@backstage/plugin-scaffolder 1.15.1 → 1.16.0-next.0

package/dist/esm/{index-e1da2925.esm.js → index-52e5acc5.esm.js}

@@ -1,60 +1,47 @@
-import React, { useCallback, useState, useMemo, useEffect, Component } from 'react';
-import { Link, useNavigate, Navigate, useParams, useOutlet, Routes, Route } from 'react-router-dom';
+import React, { useCallback, useState, useMemo, Component } from 'react';
+import { Link, useNavigate, Navigate, useOutlet, Routes, Route } from 'react-router-dom';
+import { useTemplateSecrets, scaffolderApiRef, useCustomFieldExtensions, useCustomLayouts, SecretsContextProvider } from '@backstage/plugin-scaffolder-react';
+import { u as useDryRun, a as useDirectoryEditor, D as DirectoryEditorProvider, b as DryRunProvider, T as TemplateEditorBrowser, c as TemplateEditorTextArea, d as DryRunResults, e as TemplateEditorIntro, W as WebFileSystemAccess, f as DEFAULT_SCAFFOLDER_FIELD_EXTENSIONS, A as ActionsPage, L as ListTasksPage } from './DryRunResults-a4d44358.esm.js';
+import { u as registerComponentRouteRef, p as editRouteRef, q as actionsRouteRef, t as scaffolderListTaskRouteRef, v as viewTechDocRouteRef, o as selectedTemplateRouteRef, r as rootRouteRef, w as scaffolderTaskRouteRef, e as OngoingTask } from './OngoingTask-8acb140b.esm.js';
+import { DocsIcon, Page, Header, Content, ContentHeader, SupportButton, ErrorPage } from '@backstage/core-components';
 import { useRouteRef, useApp, useApi, useRouteRefParams, AnalyticsContext, useApiHolder, alertApiRef } from '@backstage/core-plugin-api';
-import { DocsIcon, Page, Header, Content, ContentHeader, SupportButton, ErrorPanel, ErrorPage } from '@backstage/core-components';
 import { EntityListProvider, CatalogFilterLayout, EntitySearchBar, EntityKindPicker, UserListPicker, EntityTagPicker, catalogApiRef, humanizeEntityRef } from '@backstage/plugin-catalog-react';
-import { ScaffolderPageContextMenu, TemplateCategoryPicker, TemplateGroups, Workflow, DefaultTemplateOutputs, TaskSteps, TaskLogStream, Stepper, Form } from '@backstage/plugin-scaffolder-react/alpha';
+import { ScaffolderPageContextMenu, TemplateCategoryPicker, TemplateGroups, Workflow, createAsyncValidators, Stepper, Form } from '@backstage/plugin-scaffolder-react/alpha';
 import Button from '@material-ui/core/Button';
 import IconButton from '@material-ui/core/IconButton';
 import useMediaQuery from '@material-ui/core/useMediaQuery';
 import AddCircleOutline from '@material-ui/icons/AddCircleOutline';
 import { catalogEntityCreatePermission } from '@backstage/plugin-catalog-common/alpha';
 import { usePermission } from '@backstage/plugin-permission-react';
-import { u as registerComponentRouteRef, p as editRouteRef, q as actionsRouteRef, t as scaffolderListTaskRouteRef, v as viewTechDocRouteRef, n as selectedTemplateRouteRef, r as rootRouteRef, o as scaffolderTaskRouteRef } from './plugin-76d8b756.esm.js';
 import { parseEntityRef, stringifyEntityRef } from '@backstage/catalog-model';
-import { useTemplateSecrets, scaffolderApiRef, useTaskEventStream, useCustomFieldExtensions, useCustomLayouts, SecretsContextProvider } from '@backstage/plugin-scaffolder-react';
-import { u as useDryRun, a as useDirectoryEditor, D as DirectoryEditorProvider, b as DryRunProvider, T as TemplateEditorBrowser, c as TemplateEditorTextArea, d as DryRunResults, e as TemplateEditorIntro, W as WebFileSystemAccess, f as DEFAULT_SCAFFOLDER_FIELD_EXTENSIONS, A as ActionsPage, L as ListTasksPage } from './ListTasksPage-b7beed35.esm.js';
-import { makeStyles, useTheme, IconButton as IconButton$1, Popover, MenuList, MenuItem, ListItemIcon, ListItemText, Box, Paper, Button as Button$1, FormControl, InputLabel, Select, Card, CardHeader, CardContent, LinearProgress } from '@material-ui/core';
-import qs from 'qs';
-import { useAsync } from '@react-hookz/web';
-import Cancel from '@material-ui/icons/Cancel';
-import Retry from '@material-ui/icons/Repeat';
-import Toc from '@material-ui/icons/Toc';
-import ControlPointIcon from '@material-ui/icons/ControlPoint';
-import MoreVert from '@material-ui/icons/MoreVert';
 import { StreamLanguage } from '@codemirror/language';
 import { yaml as yaml$1 } from '@codemirror/legacy-modes/mode/yaml';
+import { makeStyles as makeStyles$1, FormControl, InputLabel, Select, MenuItem, IconButton as IconButton$1, Card, CardHeader, CardContent, Button as Button$1, LinearProgress } from '@material-ui/core';
 import CloseIcon from '@material-ui/icons/Close';
 import CodeMirror from '@uiw/react-codemirror';
 import yaml from 'yaml';
-import { makeStyles as makeStyles$1 } from '@material-ui/core/styles';
+import { makeStyles } from '@material-ui/core/styles';
 import useDebounce from 'react-use/lib/useDebounce';
 import validator from '@rjsf/validator-ajv8';
-import useAsync$1 from 'react-use/lib/useAsync';
-import '@backstage/integration-react';
-import '@backstage/errors';
-import 'zen-observable';
-import 'event-source-polyfill';
-import '@backstage/catalog-client';
-import '@material-ui/core/FormControl';
-import '@material-ui/lab/Autocomplete';
-import 'zod';
-import 'zod-to-json-schema';
-import '@material-ui/core/FormHelperText';
-import '@material-ui/core/Input';
-import '@material-ui/core/InputLabel';
-import 'react-use/lib/useEffectOnce';
-import '@material-ui/lab';
+import useAsync from 'react-use/lib/useAsync';
 import 'classnames';
 import '@material-ui/icons/ExpandMore';
 import '@material-ui/icons/ExpandLess';
 import '@material-ui/core/Chip';
+import '@material-ui/icons/Settings';
+import '@material-ui/icons/FontDownload';
+import 'luxon';
+import 'humanize-duration';
+import '@material-ui/core/Typography';
 import '@material-ui/core/Card';
 import '@material-ui/core/CardActionArea';
 import '@material-ui/core/CardContent';
 import '@material-ui/core/Tooltip';
-import '@material-ui/core/Typography';
 import '@material-ui/icons/InfoOutlined';
+import '@material-ui/icons/Refresh';
+import '@material-ui/icons/Save';
+import '@codemirror/view';
+import '@react-hookz/web';
 import '@material-ui/core/Accordion';
 import '@material-ui/core/AccordionDetails';
 import '@material-ui/core/AccordionSummary';
@@ -64,30 +51,45 @@ import '@material-ui/core/ListItem';
 import '@material-ui/core/ListItemIcon';
 import '@material-ui/core/ListItemSecondaryAction';
 import '@material-ui/core/ListItemText';
+import '@material-ui/icons/Cancel';
 import '@material-ui/icons/Check';
 import '@material-ui/icons/Delete';
 import '@material-ui/icons/GetApp';
 import '@material-ui/core/Box';
 import '@material-ui/core/Tab';
 import '@material-ui/core/Tabs';
-import './TaskPage-d1a669e0.esm.js';
+import '@material-ui/lab/TreeView';
+import '@material-ui/icons/ChevronRight';
+import '@material-ui/lab/TreeItem';
+import '@material-ui/icons/Language';
 import '@material-ui/core/Grid';
 import '@material-ui/core/Step';
 import '@material-ui/core/StepLabel';
 import '@material-ui/core/Stepper';
 import '@material-ui/icons/FiberManualRecord';
-import 'luxon';
+import 'qs';
 import 'react-use/lib/useInterval';
-import '@material-ui/icons/Language';
-import '@material-ui/icons/Refresh';
-import '@material-ui/icons/Save';
-import '@material-ui/lab/TreeView';
-import '@material-ui/icons/ChevronRight';
-import '@material-ui/lab/TreeItem';
-import '@codemirror/view';
-import '@material-ui/icons/Settings';
-import '@material-ui/icons/FontDownload';
-import 'humanize-duration';
+import '@backstage/integration-react';
+import '@backstage/errors';
+import 'zen-observable';
+import 'event-source-polyfill';
+import '@backstage/catalog-client';
+import '@material-ui/core/FormControl';
+import '@material-ui/lab/Autocomplete';
+import 'zod';
+import 'zod-to-json-schema';
+import '@material-ui/core/FormHelperText';
+import '@material-ui/core/Input';
+import '@material-ui/core/InputLabel';
+import 'react-use/lib/useEffectOnce';
+import '@material-ui/lab';
+import 'lodash/capitalize';
+import '@material-ui/icons/CheckBox';
+import '@material-ui/icons/CheckBoxOutlineBlank';
+import '@material-ui/icons/Repeat';
+import '@material-ui/icons/Toc';
+import '@material-ui/icons/ControlPoint';
+import '@material-ui/icons/MoreVert';
 
 const RegisterExistingButton = (props) => {
   const { title, to } = props;
@@ -236,237 +238,22 @@ const TemplateWizardPage = (props) => {
       namespace,
       templateName,
       onCreate,
+      components: props.components,
       onError,
       extensions: props.customFieldExtensions,
-      FormProps: props.FormProps,
+      formProps: props.formProps,
       layouts: props.layouts
     }
   )));
 };
 
-const useStyles$5 = makeStyles(() => ({
-  button: {
-    color: ({ fontColor }) => fontColor
-  }
-}));
-const ContextMenu = (props) => {
-  const {
-    cancelEnabled,
-    logsVisible,
-    buttonBarVisible,
-    onStartOver,
-    onToggleLogs,
-    onToggleButtonBar,
-    taskId
-  } = props;
-  const { getPageTheme } = useTheme();
-  const pageTheme = getPageTheme({ themeId: "website" });
-  const classes = useStyles$5({ fontColor: pageTheme.fontColor });
-  const scaffolderApi = useApi(scaffolderApiRef);
-  const [anchorEl, setAnchorEl] = useState();
-  const [{ status: cancelStatus }, { execute: cancel }] = useAsync(async () => {
-    if (taskId) {
-      await scaffolderApi.cancelTask(taskId);
-    }
-  });
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
-    IconButton$1,
-    {
-      "aria-label": "more",
-      "aria-controls": "long-menu",
-      "aria-haspopup": "true",
-      onClick: (event) => {
-        setAnchorEl(event.currentTarget);
-      },
-      "data-testid": "menu-button",
-      className: classes.button
-    },
-    /* @__PURE__ */ React.createElement(MoreVert, null)
-  ), /* @__PURE__ */ React.createElement(
-    Popover,
-    {
-      open: Boolean(anchorEl),
-      onClose: () => setAnchorEl(void 0),
-      anchorEl,
-      anchorOrigin: { vertical: "bottom", horizontal: "right" },
-      transformOrigin: { vertical: "top", horizontal: "right" }
-    },
-    /* @__PURE__ */ React.createElement(MenuList, null, /* @__PURE__ */ React.createElement(MenuItem, { onClick: () => onToggleLogs == null ? void 0 : onToggleLogs(!logsVisible) }, /* @__PURE__ */ React.createElement(ListItemIcon, null, /* @__PURE__ */ React.createElement(Toc, { fontSize: "small" })), /* @__PURE__ */ React.createElement(ListItemText, { primary: logsVisible ? "Hide Logs" : "Show Logs" })), /* @__PURE__ */ React.createElement(MenuItem, { onClick: () => onToggleButtonBar == null ? void 0 : onToggleButtonBar(!buttonBarVisible) }, /* @__PURE__ */ React.createElement(ListItemIcon, null, /* @__PURE__ */ React.createElement(ControlPointIcon, { fontSize: "small" })), /* @__PURE__ */ React.createElement(
-      ListItemText,
-      {
-        primary: buttonBarVisible ? "Hide Button Bar" : "Show Button Bar"
-      }
-    )), /* @__PURE__ */ React.createElement(MenuItem, { onClick: onStartOver }, /* @__PURE__ */ React.createElement(ListItemIcon, null, /* @__PURE__ */ React.createElement(Retry, { fontSize: "small" })), /* @__PURE__ */ React.createElement(ListItemText, { primary: "Start Over" })), /* @__PURE__ */ React.createElement(
-      MenuItem,
-      {
-        onClick: cancel,
-        disabled: !cancelEnabled || cancelStatus !== "not-executed",
-        "data-testid": "cancel-task"
-      },
-      /* @__PURE__ */ React.createElement(ListItemIcon, null, /* @__PURE__ */ React.createElement(Cancel, { fontSize: "small" })),
-      /* @__PURE__ */ React.createElement(ListItemText, { primary: "Cancel" })
-    ))
-  ));
-};
-
-const useStyles$4 = makeStyles((theme) => ({
-  contentWrapper: {
-    display: "flex",
-    flexDirection: "column"
-  },
-  buttonBar: {
-    display: "flex",
-    flexDirection: "row",
-    justifyContent: "right"
-  },
-  cancelButton: {
-    marginRight: theme.spacing(1)
-  },
-  logsVisibilityButton: {
-    marginRight: theme.spacing(1)
-  }
-}));
-const OngoingTask = (props) => {
-  var _a, _b, _c, _d, _e, _f, _g, _h;
-  const { taskId } = useParams();
-  const templateRouteRef = useRouteRef(selectedTemplateRouteRef);
-  const navigate = useNavigate();
-  const scaffolderApi = useApi(scaffolderApiRef);
-  const taskStream = useTaskEventStream(taskId);
-  const classes = useStyles$4();
-  const steps = useMemo(
-    () => {
-      var _a2, _b2;
-      return (_b2 = (_a2 = taskStream.task) == null ? void 0 : _a2.spec.steps.map((step) => {
-        var _a3;
-        return {
-          ...step,
-          ...(_a3 = taskStream == null ? void 0 : taskStream.steps) == null ? void 0 : _a3[step.id]
-        };
-      })) != null ? _b2 : [];
-    },
-    [taskStream]
-  );
-  const [logsVisible, setLogVisibleState] = useState(false);
-  const [buttonBarVisible, setButtonBarVisibleState] = useState(true);
-  useEffect(() => {
-    if (taskStream.error) {
-      setLogVisibleState(true);
-    }
-  }, [taskStream.error]);
-  useEffect(() => {
-    if (taskStream.completed && !taskStream.error) {
-      setButtonBarVisibleState(false);
-    }
-  }, [taskStream.error, taskStream.completed]);
-  const activeStep = useMemo(() => {
-    for (let i = steps.length - 1; i >= 0; i--) {
-      if (steps[i].status !== "open") {
-        return i;
-      }
-    }
-    return 0;
-  }, [steps]);
-  const startOver = useCallback(() => {
-    var _a2, _b2, _c2, _d2, _e2, _f2;
-    const { namespace, name } = (_d2 = (_c2 = (_b2 = (_a2 = taskStream.task) == null ? void 0 : _a2.spec.templateInfo) == null ? void 0 : _b2.entity) == null ? void 0 : _c2.metadata) != null ? _d2 : {};
-    const formData = (_f2 = (_e2 = taskStream.task) == null ? void 0 : _e2.spec.parameters) != null ? _f2 : {};
-    if (!namespace || !name) {
-      return;
-    }
-    navigate({
-      pathname: templateRouteRef({
-        namespace,
-        templateName: name
-      }),
-      search: `?${qs.stringify({ formData: JSON.stringify(formData) })}`
-    });
-  }, [
-    navigate,
-    (_a = taskStream.task) == null ? void 0 : _a.spec.parameters,
-    (_d = (_c = (_b = taskStream.task) == null ? void 0 : _b.spec.templateInfo) == null ? void 0 : _c.entity) == null ? void 0 : _d.metadata,
-    templateRouteRef
-  ]);
-  const [{ status: cancelStatus }, { execute: triggerCancel }] = useAsync(
-    async () => {
-      if (taskId) {
-        await scaffolderApi.cancelTask(taskId);
-      }
-    }
-  );
-  const Outputs = (_e = props.TemplateOutputsComponent) != null ? _e : DefaultTemplateOutputs;
-  const templateName = (_h = (_g = (_f = taskStream.task) == null ? void 0 : _f.spec.templateInfo) == null ? void 0 : _g.entity) == null ? void 0 : _h.metadata.name;
-  const cancelEnabled = !(taskStream.cancelled || taskStream.completed);
-  return /* @__PURE__ */ React.createElement(Page, { themeId: "website" }, /* @__PURE__ */ React.createElement(
-    Header,
-    {
-      pageTitleOverride: `Run of ${templateName}`,
-      title: /* @__PURE__ */ React.createElement("div", null, "Run of ", /* @__PURE__ */ React.createElement("code", null, templateName)),
-      subtitle: `Task ${taskId}`
-    },
-    /* @__PURE__ */ React.createElement(
-      ContextMenu,
-      {
-        cancelEnabled,
-        logsVisible,
-        buttonBarVisible,
-        onStartOver: startOver,
-        onToggleLogs: setLogVisibleState,
-        onToggleButtonBar: setButtonBarVisibleState,
-        taskId
-      }
-    )
-  ), /* @__PURE__ */ React.createElement(Content, { className: classes.contentWrapper }, taskStream.error ? /* @__PURE__ */ React.createElement(Box, { paddingBottom: 2 }, /* @__PURE__ */ React.createElement(
-    ErrorPanel,
-    {
-      error: taskStream.error,
-      title: taskStream.error.message
-    }
-  )) : null, /* @__PURE__ */ React.createElement(Box, { paddingBottom: 2 }, /* @__PURE__ */ React.createElement(
-    TaskSteps,
-    {
-      steps,
-      activeStep,
-      isComplete: taskStream.completed,
-      isError: Boolean(taskStream.error)
-    }
-  )), /* @__PURE__ */ React.createElement(Outputs, { output: taskStream.output }), buttonBarVisible ? /* @__PURE__ */ React.createElement(Box, { paddingBottom: 2 }, /* @__PURE__ */ React.createElement(Paper, null, /* @__PURE__ */ React.createElement(Box, { padding: 2 }, /* @__PURE__ */ React.createElement("div", { className: classes.buttonBar }, /* @__PURE__ */ React.createElement(
-    Button$1,
-    {
-      className: classes.cancelButton,
-      disabled: !cancelEnabled || cancelStatus !== "not-executed",
-      onClick: triggerCancel,
-      "data-testid": "cancel-button"
-    },
-    "Cancel"
-  ), /* @__PURE__ */ React.createElement(
-    Button$1,
-    {
-      className: classes.logsVisibilityButton,
-      color: "primary",
-      variant: "outlined",
-      onClick: () => setLogVisibleState(!logsVisible)
-    },
-    logsVisible ? "Hide Logs" : "Show Logs"
-  ), /* @__PURE__ */ React.createElement(
-    Button$1,
-    {
-      variant: "contained",
-      color: "primary",
-      disabled: cancelEnabled,
-      onClick: startOver
-    },
-    "Start Over"
-  ))))) : null, logsVisible ? /* @__PURE__ */ React.createElement(Box, { paddingBottom: 2, height: "100%" }, /* @__PURE__ */ React.createElement(Paper, { style: { height: "100%" } }, /* @__PURE__ */ React.createElement(Box, { padding: 2, height: "100%" }, /* @__PURE__ */ React.createElement(TaskLogStream, { logs: taskStream.stepLogs })))) : null));
-};
-
 var __defProp = Object.defineProperty;
 var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
 var __publicField = (obj, key, value) => {
   __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
   return value;
 };
-const useStyles$3 = makeStyles$1({
+const useStyles$3 = makeStyles({
   containerWrapper: {
     position: "relative",
     width: "100%",
@@ -516,6 +303,11 @@ function TemplateEditorForm(props) {
   const classes = useStyles$3();
   const apiHolder = useApiHolder();
   const [steps, setSteps] = useState();
+  const fields = useMemo(() => {
+    return Object.fromEntries(
+      fieldExtensions.map(({ name, component }) => [name, component])
+    );
+  }, [fieldExtensions]);
   useDebounce(
     () => {
       try {
@@ -523,7 +315,7 @@ function TemplateEditorForm(props) {
           setSteps(void 0);
           return;
         }
-        const parsed = yaml.parse(content);
+        const parsed = yaml.parseAllDocuments(content).filter((c) => c).map((c) => c.toJSON())[0];
         if (!isJsonObject(parsed)) {
           setSteps(void 0);
           return;
@@ -543,13 +335,19 @@ function TemplateEditorForm(props) {
           setSteps(void 0);
           return;
         }
+        const fieldValidators = Object.fromEntries(
+          fieldExtensions.map(({ name, validation }) => [name, validation])
+        );
         setErrorText();
         setSteps(
           parameters.flatMap(
             (param) => isJsonObject(param) ? [
               {
                 title: String(param.title),
-                schema: param
+                schema: param,
+                validate: createAsyncValidators(param, fieldValidators, {
+                  apiHolder
+                })
               }
             ] : []
           )
@@ -569,11 +367,11 @@ function TemplateEditorForm(props) {
     {
       manifest: { steps, title: "Template Editor" },
       extensions: fieldExtensions,
-      onCreate: async (data) => {
-        await (onDryRun == null ? void 0 : onDryRun(data));
+      components: fields,
+      onCreate: async (options) => {
+        await (onDryRun == null ? void 0 : onDryRun(options));
       },
-      layouts,
-      components: { createButtonText: onDryRun && "Try It" }
+      layouts
     }
   ))));
 }
@@ -582,14 +380,14 @@ function TemplateEditorFormDirectoryEditorDryRun(props) {
   const dryRun = useDryRun();
   const directoryEditor = useDirectoryEditor();
   const { selectedFile } = directoryEditor;
-  const handleDryRun = async (values) => {
+  const handleDryRun = async (data) => {
     if (!selectedFile) {
       return;
     }
     try {
       await dryRun.execute({
         templateContent: selectedFile.content,
-        values,
+        values: data,
         files: directoryEditor.files
       });
       setErrorText();
@@ -612,7 +410,7 @@ function TemplateEditorFormDirectoryEditorDryRun(props) {
 }
 TemplateEditorForm.DirectoryEditorDryRun = TemplateEditorFormDirectoryEditorDryRun;
 
-const useStyles$2 = makeStyles((theme) => ({
+const useStyles$2 = makeStyles$1((theme) => ({
   root: {
     gridArea: "pageContent",
     display: "grid",
@@ -738,7 +536,7 @@ const CustomFieldExplorer = ({
   )));
 };
 
-const useStyles$1 = makeStyles({
+const useStyles$1 = makeStyles$1({
   // Reset and fix sizing to make sure scrolling behaves correctly
   root: {
     gridArea: "pageContent",
@@ -817,7 +615,7 @@ steps:
       values:
         name: \${{parameters.name}}
 `;
-const useStyles = makeStyles((theme) => ({
+const useStyles = makeStyles$1((theme) => ({
   root: {
     gridArea: "pageContent",
     display: "grid",
@@ -855,7 +653,7 @@ const TemplateFormPreviewer = ({
   const [errorText, setErrorText] = useState();
   const [templateOptions, setTemplateOptions] = useState([]);
   const [templateYaml, setTemplateYaml] = useState(defaultPreviewTemplate);
-  const { loading } = useAsync$1(
+  const { loading } = useAsync(
     () => catalogApi.getEntities({
       filter: { kind: "template" },
       fields: [
@@ -982,10 +780,11 @@ const Router = (props) => {
   const {
     components: {
       TemplateCardComponent,
-      TemplateOutputsComponent,
       TaskPageComponent = OngoingTask,
-      TemplateListPageComponent = TemplateListPage,
-      TemplateWizardPageComponent = TemplateWizardPage
+      ReviewStepComponent,
+      EXPERIMENTAL_TemplateOutputsComponent: TemplateOutputsComponent,
+      EXPERIMENTAL_TemplateListPageComponent: TemplateListPageComponent = TemplateListPage,
+      EXPERIMENTAL_TemplateWizardPageComponent: TemplateWizardPageComponent = TemplateWizardPage
     } = {}
   } = props;
   const outlet = useOutlet() || props.children;
@@ -1022,7 +821,8 @@ const Router = (props) => {
         {
           customFieldExtensions: fieldExtensions,
           layouts: customLayouts,
-          FormProps: props.FormProps
+          components: { ReviewStepComponent },
+          formProps: props.formProps
         }
       ))
     }
@@ -1065,4 +865,4 @@ const Router = (props) => {
 };
 
 export { Router };
-//# sourceMappingURL=index-e1da2925.esm.js.map
+//# sourceMappingURL=index-52e5acc5.esm.js.map