@backstage/plugin-scaffolder 1.10.0-next.1 → 1.10.0-next.2

package/dist/esm/index-78c07979.esm.js

@@ -1,693 +0,0 @@
-import React, { useState, useMemo, useCallback, useContext, useEffect } from 'react';
-import { Link, useNavigate, Navigate, useOutlet, Routes, Route } from 'react-router-dom';
-import { Progress, ItemCardHeader, Link as Link$1, MarkdownContent, UserIcon, Button as Button$1, Content, ItemCardGrid, ContentHeader, Page, Header, SupportButton, StructuredMetadataTable, InfoCard } from '@backstage/core-components';
-import { useEntityTypeFilter, FavoriteEntity, getEntityRelations, EntityRefLinks, useEntityList, EntityListProvider, CatalogFilterLayout, EntitySearchBar, EntityKindPicker, UserListPicker, EntityTagPicker } from '@backstage/plugin-catalog-react';
-import capitalize from 'lodash/capitalize';
-import { Box, Typography, FormControlLabel, Checkbox, TextField, makeStyles, useTheme, Card, CardContent, Grid, Divider, Chip, CardActions, Stepper as Stepper$1, Step, StepLabel, Button as Button$2 } from '@material-ui/core';
-import CheckBoxIcon from '@material-ui/icons/CheckBox';
-import CheckBoxOutlineBlankIcon from '@material-ui/icons/CheckBoxOutlineBlank';
-import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
-import { Autocomplete } from '@material-ui/lab';
-import { useApi, alertApiRef, useRouteRef, useApp, errorApiRef, featureFlagsApiRef, useRouteRefParams, useAnalytics, useApiHolder, AnalyticsContext, useElementFilter } from '@backstage/core-plugin-api';
-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';
-import { usePermission } from '@backstage/plugin-permission-react';
-import { B as nextSelectedTemplateRouteRef, v as viewTechDocRouteRef, r as registerComponentRouteRef, s as selectedTemplateRouteRef, C as nextRouteRef, d as scaffolderTaskRouteRef, S as SecretsContext, c as scaffolderApiRef, F as FIELD_EXTENSION_WRAPPER_KEY, i as FIELD_EXTENSION_KEY, k as SecretsContextProvider } from './index-7e25101d.esm.js';
-import { RELATION_OWNED_BY, parseEntityRef, stringifyEntityRef, DEFAULT_NAMESPACE } from '@backstage/catalog-model';
-import LanguageIcon from '@material-ui/icons/Language';
-import useAsync from 'react-use/lib/useAsync';
-import { withTheme } from '@rjsf/core-v5';
-import { Draft07 } from 'json-schema-library';
-import { c as createFieldValidation, e as extractSchemaFromStep, D as DEFAULT_SCAFFOLDER_FIELD_EXTENSIONS } from './schema-bfff60e2.esm.js';
-import validator from '@rjsf/validator-ajv6';
-import qs from 'qs';
-import '@backstage/errors';
-import 'zen-observable';
-import '@material-ui/core/FormControl';
-import '@material-ui/lab/Autocomplete';
-import 'zod';
-import 'zod-to-json-schema';
-import 'react-use/lib/useEffectOnce';
-import '@backstage/integration-react';
-import '@material-ui/core/FormHelperText';
-import '@material-ui/core/Input';
-import '@material-ui/core/InputLabel';
-import 'react-use/lib/useDebounce';
-import '@material-ui/core/Grid';
-import '@material-ui/core/Step';
-import '@material-ui/core/StepLabel';
-import '@material-ui/core/Stepper';
-import '@material-ui/core/styles';
-import '@material-ui/core/Typography';
-import '@material-ui/icons/Cancel';
-import '@material-ui/icons/Check';
-import '@material-ui/icons/FiberManualRecord';
-import 'classnames';
-import 'luxon';
-import 'react-use/lib/useInterval';
-import 'use-immer';
-
-const icon = /* @__PURE__ */ React.createElement(CheckBoxOutlineBlankIcon, { fontSize: "small" });
-const checkedIcon = /* @__PURE__ */ React.createElement(CheckBoxIcon, { fontSize: "small" });
-const CategoryPicker = () => {
-  const alertApi = useApi(alertApiRef);
-  const { error, loading, availableTypes, selectedTypes, setSelectedTypes } = useEntityTypeFilter();
-  if (loading)
-    return /* @__PURE__ */ React.createElement(Progress, null);
-  if (error) {
-    alertApi.post({
-      message: `Failed to load entity types with error: ${error}`,
-      severity: "error"
-    });
-    return null;
-  }
-  if (!availableTypes)
-    return null;
-  return /* @__PURE__ */ React.createElement(Box, { pb: 1, pt: 1 }, /* @__PURE__ */ React.createElement(Typography, { variant: "button" }, "Categories"), /* @__PURE__ */ React.createElement(
-    Autocomplete,
-    {
-      multiple: true,
-      "aria-label": "Categories",
-      options: availableTypes,
-      value: selectedTypes,
-      onChange: (_, value) => setSelectedTypes(value),
-      renderOption: (option, { selected }) => /* @__PURE__ */ React.createElement(
-        FormControlLabel,
-        {
-          control: /* @__PURE__ */ React.createElement(
-            Checkbox,
-            {
-              icon,
-              checkedIcon,
-              checked: selected
-            }
-          ),
-          label: capitalize(option)
-        }
-      ),
-      size: "small",
-      popupIcon: /* @__PURE__ */ React.createElement(ExpandMoreIcon, null),
-      renderInput: (params) => /* @__PURE__ */ React.createElement(TextField, { ...params, variant: "outlined" })
-    }
-  ));
-};
-
-const RegisterExistingButton = (props) => {
-  const { title, to } = props;
-  const { allowed } = usePermission({
-    permission: catalogEntityCreatePermission
-  });
-  const isXSScreen = useMediaQuery(
-    (theme) => theme.breakpoints.down("xs")
-  );
-  if (!to || !allowed) {
-    return null;
-  }
-  return isXSScreen ? /* @__PURE__ */ React.createElement(
-    IconButton,
-    {
-      component: Link,
-      color: "primary",
-      title,
-      size: "small",
-      to
-    },
-    /* @__PURE__ */ React.createElement(AddCircleOutline, null)
-  ) : /* @__PURE__ */ React.createElement(Button, { component: Link, variant: "contained", color: "primary", to }, title);
-};
-
-const useStyles$4 = makeStyles(
-  () => ({
-    header: {
-      backgroundImage: ({ cardBackgroundImage }) => cardBackgroundImage
-    },
-    subtitleWrapper: {
-      display: "flex",
-      justifyContent: "space-between"
-    }
-  })
-);
-const CardHeader = (props) => {
-  const {
-    template: {
-      metadata: { title, name },
-      spec: { type }
-    }
-  } = props;
-  const { getPageTheme } = useTheme();
-  const themeForType = getPageTheme({ themeId: type });
-  const styles = useStyles$4({
-    cardBackgroundImage: themeForType.backgroundImage
-  });
-  const SubtitleComponent = /* @__PURE__ */ React.createElement("div", { className: styles.subtitleWrapper }, /* @__PURE__ */ React.createElement("div", null, type), /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(FavoriteEntity, { entity: props.template, style: { padding: 0 } })));
-  return /* @__PURE__ */ React.createElement(
-    ItemCardHeader,
-    {
-      title: title != null ? title : name,
-      subtitle: SubtitleComponent,
-      classes: { root: styles.header }
-    }
-  );
-};
-
-const useStyles$3 = makeStyles(() => ({
-  linkText: {
-    display: "inline-flex",
-    alignItems: "center"
-  }
-}));
-const CardLink = ({ icon: Icon, text, url }) => {
-  const styles = useStyles$3();
-  return /* @__PURE__ */ React.createElement("div", { className: styles.linkText }, /* @__PURE__ */ React.createElement(Icon, { fontSize: "small" }), /* @__PURE__ */ React.createElement(Link$1, { style: { marginLeft: "8px" }, to: url }, text || url));
-};
-
-const useStyles$2 = makeStyles((theme) => ({
-  box: {
-    overflow: "hidden",
-    textOverflow: "ellipsis",
-    display: "-webkit-box",
-    "-webkit-line-clamp": 10,
-    "-webkit-box-orient": "vertical"
-  },
-  markdown: {
-    "& :first-child": {
-      margin: 0
-    }
-  },
-  label: {
-    color: theme.palette.text.secondary,
-    textTransform: "uppercase",
-    fontWeight: "bold",
-    letterSpacing: 0.5,
-    lineHeight: 1,
-    fontSize: "0.75rem"
-  },
-  footer: {
-    display: "flex",
-    justifyContent: "space-between",
-    flex: 1,
-    alignItems: "center"
-  },
-  ownedBy: {
-    display: "flex",
-    alignItems: "center",
-    flex: 1,
-    color: theme.palette.link
-  }
-}));
-const TemplateCard = (props) => {
-  var _a, _b, _c, _d, _e, _f, _g;
-  const { template } = props;
-  const styles = useStyles$2();
-  const ownedByRelations = getEntityRelations(template, RELATION_OWNED_BY);
-  const templateRoute = useRouteRef(nextSelectedTemplateRouteRef);
-  const { name, namespace } = parseEntityRef(
-    stringifyEntityRef(props.template)
-  );
-  const href = templateRoute({
-    templateName: name,
-    namespace
-  });
-  const app = useApp();
-  const iconResolver = (key) => {
-    var _a2;
-    return key ? (_a2 = app.getSystemIcon(key)) != null ? _a2 : LanguageIcon : LanguageIcon;
-  };
-  const viewTechDoc = useRouteRef(viewTechDocRouteRef);
-  const viewTechDocsAnnotation = (_a = template.metadata.annotations) == null ? void 0 : _a["backstage.io/techdocs-ref"];
-  const viewTechDocsLink = !!viewTechDocsAnnotation && !!viewTechDoc && viewTechDoc({
-    namespace: template.metadata.namespace || DEFAULT_NAMESPACE,
-    kind: template.kind,
-    name: template.metadata.name
-  });
-  return /* @__PURE__ */ React.createElement(Card, null, /* @__PURE__ */ React.createElement(CardHeader, { template }), /* @__PURE__ */ React.createElement(CardContent, null, /* @__PURE__ */ React.createElement(Grid, { container: true, spacing: 2 }, /* @__PURE__ */ React.createElement(Grid, { item: true, xs: 12 }, /* @__PURE__ */ React.createElement(Box, { className: styles.box }, /* @__PURE__ */ React.createElement(
-    MarkdownContent,
-    {
-      className: styles.markdown,
-      content: (_b = template.metadata.description) != null ? _b : "No description"
-    }
-  ))), ((_d = (_c = template.metadata.tags) == null ? void 0 : _c.length) != null ? _d : 0) > 0 && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Grid, { item: true, xs: 12 }, /* @__PURE__ */ React.createElement(Divider, null)), /* @__PURE__ */ React.createElement(Grid, { item: true, xs: 12 }, /* @__PURE__ */ React.createElement(Grid, { container: true, spacing: 2 }, (_e = template.metadata.tags) == null ? void 0 : _e.map((tag) => /* @__PURE__ */ React.createElement(Grid, { item: true }, /* @__PURE__ */ React.createElement(
-    Chip,
-    {
-      style: { margin: 0 },
-      size: "small",
-      label: tag,
-      key: tag
-    }
-  )))))), (!!viewTechDocsLink || ((_f = template.metadata.links) == null ? void 0 : _f.length)) && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Grid, { item: true, xs: 12 }, /* @__PURE__ */ React.createElement(Divider, null)), /* @__PURE__ */ React.createElement(Grid, { item: true, xs: 12 }, /* @__PURE__ */ React.createElement(Grid, { container: true, spacing: 2 }, viewTechDocsLink && /* @__PURE__ */ React.createElement(Grid, { className: styles.linkText, item: true, xs: 6 }, /* @__PURE__ */ React.createElement(
-    CardLink,
-    {
-      icon: iconResolver("docs"),
-      text: "View TechDocs",
-      url: viewTechDocsLink
-    }
-  )), (_g = template.metadata.links) == null ? void 0 : _g.map(({ url, icon, title }) => /* @__PURE__ */ React.createElement(Grid, { className: styles.linkText, item: true, xs: 6 }, /* @__PURE__ */ React.createElement(
-    CardLink,
-    {
-      icon: iconResolver(icon),
-      text: title || url,
-      url
-    }
-  )))))))), /* @__PURE__ */ React.createElement(CardActions, { style: { padding: "16px" } }, /* @__PURE__ */ React.createElement("div", { className: styles.footer }, /* @__PURE__ */ React.createElement("div", { className: styles.ownedBy }, ownedByRelations.length > 0 && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(UserIcon, { fontSize: "small" }), /* @__PURE__ */ React.createElement(
-    EntityRefLinks,
-    {
-      style: { marginLeft: "8px" },
-      entityRefs: ownedByRelations,
-      defaultKind: "Group"
-    }
-  ))), /* @__PURE__ */ React.createElement(Button$1, { size: "small", variant: "outlined", color: "primary", to: href }, "Choose"))));
-};
-
-const TemplateGroup = (props) => {
-  const { templates, title, components: { CardComponent } = {} } = props;
-  const titleComponent = typeof title === "string" ? /* @__PURE__ */ React.createElement(ContentHeader, { title }) : title;
-  if (templates.length === 0) {
-    return /* @__PURE__ */ React.createElement(Content, null, titleComponent, /* @__PURE__ */ React.createElement(Typography, { variant: "body2" }, "No templates found that match your filter. Learn more about", " ", /* @__PURE__ */ React.createElement(Link$1, { to: "https://backstage.io/docs/features/software-templates/adding-templates" }, "adding templates"), "."));
-  }
-  const Card = CardComponent || TemplateCard;
-  return /* @__PURE__ */ React.createElement(Content, null, titleComponent, /* @__PURE__ */ React.createElement(ItemCardGrid, null, templates.map((template) => /* @__PURE__ */ React.createElement(Card, { key: stringifyEntityRef(template), template }))));
-};
-
-const TemplateGroups = (props) => {
-  const { loading, error, entities } = useEntityList();
-  const { groups, TemplateCardComponent } = props;
-  const errorApi = useApi(errorApiRef);
-  if (loading) {
-    return /* @__PURE__ */ React.createElement(Progress, null);
-  }
-  if (error) {
-    errorApi.post(error);
-    return null;
-  }
-  if (!entities || !entities.length) {
-    return /* @__PURE__ */ React.createElement(Typography, { variant: "body2" }, "No templates found that match your filter. Learn more about", " ", /* @__PURE__ */ React.createElement(Link$1, { to: "https://backstage.io/docs/features/software-templates/adding-templates" }, "adding templates"), ".");
-  }
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, groups.map(({ title, filter }, index) => /* @__PURE__ */ React.createElement(
-    TemplateGroup,
-    {
-      key: index,
-      templates: entities.filter(
-        (e) => filter(e)
-      ),
-      title,
-      components: { CardComponent: TemplateCardComponent }
-    }
-  )));
-};
-
-const defaultGroup = {
-  title: "All Templates",
-  filter: () => true
-};
-const TemplateListPage = (props) => {
-  const registerComponentLink = useRouteRef(registerComponentRouteRef);
-  const { TemplateCardComponent, groups = [] } = props;
-  return /* @__PURE__ */ React.createElement(EntityListProvider, null, /* @__PURE__ */ React.createElement(Page, { themeId: "website" }, /* @__PURE__ */ React.createElement(
-    Header,
-    {
-      pageTitleOverride: "Create a new component",
-      title: "Create a new component",
-      subtitle: "Create new software components using standard templates in your organization"
-    }
-  ), /* @__PURE__ */ React.createElement(Content, null, /* @__PURE__ */ React.createElement(ContentHeader, { title: "Available Templates" }, /* @__PURE__ */ React.createElement(
-    RegisterExistingButton,
-    {
-      title: "Register Existing Component",
-      to: registerComponentLink && registerComponentLink()
-    }
-  ), /* @__PURE__ */ React.createElement(SupportButton, null, "Create new software components using standard templates. Different templates create different kinds of components (services, websites, documentation, ...).")), /* @__PURE__ */ React.createElement(CatalogFilterLayout, null, /* @__PURE__ */ React.createElement(CatalogFilterLayout.Filters, null, /* @__PURE__ */ React.createElement(EntitySearchBar, null), /* @__PURE__ */ React.createElement(EntityKindPicker, { initialFilter: "template", hidden: true }), /* @__PURE__ */ React.createElement(
-    UserListPicker,
-    {
-      initialFilter: "all",
-      availableFilters: ["all", "starred"]
-    }
-  ), /* @__PURE__ */ React.createElement(CategoryPicker, null), /* @__PURE__ */ React.createElement(EntityTagPicker, null)), /* @__PURE__ */ React.createElement(CatalogFilterLayout.Content, null, /* @__PURE__ */ React.createElement(
-    TemplateGroups,
-    {
-      groups: [...groups, defaultGroup],
-      TemplateCardComponent
-    }
-  ))))));
-};
-
-const createAsyncValidators = (rootSchema, validators, context) => {
-  async function validate(formData, pathPrefix = "#") {
-    const parsedSchema = new Draft07(rootSchema);
-    const formValidation = {};
-    for (const [key, value] of Object.entries(formData)) {
-      const definitionInSchema = parsedSchema.getSchema(
-        `${pathPrefix}/${key}`,
-        formData
-      );
-      if (definitionInSchema && "ui:field" in definitionInSchema) {
-        const validator = validators[definitionInSchema["ui:field"]];
-        if (validator) {
-          const fieldValidation = createFieldValidation();
-          try {
-            await validator(value, fieldValidation, { ...context, formData });
-          } catch (ex) {
-            fieldValidation.addError(ex.message);
-          }
-          formValidation[key] = fieldValidation;
-        }
-      }
-    }
-    return formValidation;
-  }
-  return async (formData) => {
-    return await validate(formData);
-  };
-};
-
-const useTemplateSchema = (manifest) => {
-  const featureFlags = useApi(featureFlagsApiRef);
-  const steps = manifest.steps.map(({ title, description, schema }) => ({
-    title,
-    description,
-    mergedSchema: schema,
-    ...extractSchemaFromStep(schema)
-  }));
-  const returningSteps = steps.filter((step) => {
-    var _a;
-    const stepFeatureFlag = (_a = step.uiSchema["ui:backstage"]) == null ? void 0 : _a.featureFlag;
-    return stepFeatureFlag ? featureFlags.isActive(stepFeatureFlag) : true;
-  }).map((step) => ({
-    ...step,
-    schema: {
-      ...step.schema,
-      title: void 0,
-      properties: Object.fromEntries(
-        Object.entries(step.schema.properties).filter(
-          ([key]) => {
-            var _a, _b;
-            const stepFeatureFlag = (_b = (_a = step.uiSchema[key]) == null ? void 0 : _a["ui:backstage"]) == null ? void 0 : _b.featureFlag;
-            return stepFeatureFlag ? featureFlags.isActive(stepFeatureFlag) : true;
-          }
-        )
-      )
-    }
-  }));
-  return {
-    steps: returningSteps
-  };
-};
-
-const ReviewState = (props) => {
-  const reviewData = Object.fromEntries(
-    Object.entries(props.formState).map(([key, value]) => {
-      var _a;
-      for (const step of props.schemas) {
-        const parsedSchema = new Draft07(step.mergedSchema);
-        const definitionInSchema = parsedSchema.getSchema(
-          `#/${key}`,
-          props.formState
-        );
-        if (definitionInSchema) {
-          const backstageReviewOptions = (_a = definitionInSchema["ui:backstage"]) == null ? void 0 : _a.review;
-          if (backstageReviewOptions) {
-            if (backstageReviewOptions.mask) {
-              return [key, backstageReviewOptions.mask];
-            }
-            if (backstageReviewOptions.show === false) {
-              return [];
-            }
-          }
-          if (definitionInSchema["ui:widget"] === "password") {
-            return [key, "******"];
-          }
-        }
-      }
-      return [key, value];
-    })
-  );
-  return /* @__PURE__ */ React.createElement(StructuredMetadataTable, { metadata: reviewData });
-};
-
-const useFormData = () => {
-  return useState(() => {
-    const query = qs.parse(window.location.search, {
-      ignoreQueryPrefix: true
-    });
-    try {
-      return JSON.parse(query.formData);
-    } catch (e) {
-      return {};
-    }
-  });
-};
-
-const useStyles$1 = makeStyles((theme) => ({
-  backButton: {
-    marginRight: theme.spacing(1)
-  },
-  footer: {
-    display: "flex",
-    flexDirection: "row",
-    justifyContent: "right"
-  },
-  formWrapper: {
-    padding: theme.spacing(2)
-  }
-}));
-const Form = withTheme(require("@rjsf/material-ui-v5").Theme);
-const Stepper = (props) => {
-  var _a;
-  const { templateName } = useRouteRefParams(selectedTemplateRouteRef);
-  const analytics = useAnalytics();
-  const { steps } = useTemplateSchema(props.manifest);
-  const apiHolder = useApiHolder();
-  const [activeStep, setActiveStep] = useState(0);
-  const [formState, setFormState] = useFormData();
-  const [errors, setErrors] = useState();
-  const styles = useStyles$1();
-  const extensions = useMemo(() => {
-    return Object.fromEntries(
-      props.extensions.map(({ name, component }) => [name, component])
-    );
-  }, [props.extensions]);
-  const validators = useMemo(() => {
-    return Object.fromEntries(
-      props.extensions.map(({ name, validation: validation2 }) => [name, validation2])
-    );
-  }, [props.extensions]);
-  const validation = useMemo(() => {
-    var _a2;
-    return createAsyncValidators((_a2 = steps[activeStep]) == null ? void 0 : _a2.mergedSchema, validators, {
-      apiHolder
-    });
-  }, [steps, activeStep, validators, apiHolder]);
-  const handleBack = () => {
-    setActiveStep((prevActiveStep) => prevActiveStep - 1);
-  };
-  const handleChange = useCallback(
-    (e) => setFormState((current) => ({ ...current, ...e.formData })),
-    [setFormState]
-  );
-  const handleNext = async ({
-    formData
-  }) => {
-    setErrors(void 0);
-    const returnedValidation = await validation(formData);
-    const hasErrors = Object.values(returnedValidation).some(
-      (i) => {
-        var _a2;
-        return (_a2 = i.__errors) == null ? void 0 : _a2.length;
-      }
-    );
-    if (hasErrors) {
-      setErrors(returnedValidation);
-    } else {
-      setErrors(void 0);
-      setActiveStep((prevActiveStep) => {
-        const stepNum = prevActiveStep + 1;
-        analytics.captureEvent("click", `Next Step (${stepNum})`);
-        return stepNum;
-      });
-    }
-    setFormState((current) => ({ ...current, ...formData }));
-  };
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Stepper$1, { activeStep, alternativeLabel: true, variant: "elevation" }, steps.map((step, index) => /* @__PURE__ */ React.createElement(Step, { key: index }, /* @__PURE__ */ React.createElement(StepLabel, null, step.title))), /* @__PURE__ */ React.createElement(Step, null, /* @__PURE__ */ React.createElement(StepLabel, null, "Review"))), /* @__PURE__ */ React.createElement("div", { className: styles.formWrapper }, activeStep < steps.length ? /* @__PURE__ */ React.createElement(
-    Form,
-    {
-      validator,
-      extraErrors: errors,
-      formData: formState,
-      formContext: { formData: formState },
-      schema: steps[activeStep].schema,
-      uiSchema: steps[activeStep].uiSchema,
-      onSubmit: handleNext,
-      fields: extensions,
-      showErrorList: false,
-      onChange: handleChange,
-      ...(_a = props.FormProps) != null ? _a : {}
-    },
-    /* @__PURE__ */ React.createElement("div", { className: styles.footer }, /* @__PURE__ */ React.createElement(
-      Button$2,
-      {
-        onClick: handleBack,
-        className: styles.backButton,
-        disabled: activeStep < 1
-      },
-      "Back"
-    ), /* @__PURE__ */ React.createElement(Button$2, { variant: "contained", color: "primary", type: "submit" }, activeStep === steps.length - 1 ? "Review" : "Next"))
-  ) : /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(ReviewState, { formState, schemas: steps }), /* @__PURE__ */ React.createElement("div", { className: styles.footer }, /* @__PURE__ */ React.createElement(
-    Button$2,
-    {
-      onClick: handleBack,
-      className: styles.backButton,
-      disabled: activeStep < 1
-    },
-    "Back"
-  ), /* @__PURE__ */ React.createElement(
-    Button$2,
-    {
-      variant: "contained",
-      onClick: () => {
-        props.onComplete(formState);
-        const name = typeof formState.name === "string" ? formState.name : void 0;
-        analytics.captureEvent(
-          "create",
-          name || `new ${templateName}`
-        );
-      }
-    },
-    "Create"
-  )))));
-};
-
-const useStyles = makeStyles(() => ({
-  markdown: {
-    "& :first-child": {
-      marginTop: 0
-    },
-    "& :last-child": {
-      marginBottom: 0
-    }
-  }
-}));
-const useTemplateParameterSchema = (templateRef) => {
-  const scaffolderApi = useApi(scaffolderApiRef);
-  const { value, loading, error } = useAsync(
-    () => scaffolderApi.getTemplateParameterSchema(templateRef),
-    [scaffolderApi, templateRef]
-  );
-  return { manifest: value, loading, error };
-};
-const TemplateWizardPage = (props) => {
-  var _a, _b;
-  const styles = useStyles();
-  const rootRef = useRouteRef(nextRouteRef);
-  const taskRoute = useRouteRef(scaffolderTaskRouteRef);
-  const { secrets } = (_a = useContext(SecretsContext)) != null ? _a : {};
-  const scaffolderApi = useApi(scaffolderApiRef);
-  const navigate = useNavigate();
-  const { templateName, namespace } = useRouteRefParams(
-    selectedTemplateRouteRef
-  );
-  const templateRef = stringifyEntityRef({
-    kind: "Template",
-    namespace,
-    name: templateName
-  });
-  const errorApi = useApi(errorApiRef);
-  const { loading, manifest, error } = useTemplateParameterSchema(templateRef);
-  const onComplete = async (values) => {
-    const { taskId } = await scaffolderApi.scaffold({
-      templateRef,
-      values,
-      secrets
-    });
-    navigate(taskRoute({ taskId }));
-  };
-  useEffect(() => {
-    if (error) {
-      errorApi.post(new Error(`Failed to load template, ${error}`));
-    }
-  }, [error, errorApi]);
-  if (error) {
-    return /* @__PURE__ */ React.createElement(Navigate, { to: rootRef() });
-  }
-  return /* @__PURE__ */ React.createElement(AnalyticsContext, { attributes: { entityRef: templateRef } }, /* @__PURE__ */ React.createElement(Page, { themeId: "website" }, /* @__PURE__ */ React.createElement(
-    Header,
-    {
-      pageTitleOverride: "Create a new component",
-      title: "Create a new component",
-      subtitle: "Create new software components using standard templates in your organization"
-    }
-  ), /* @__PURE__ */ React.createElement(Content, null, loading && /* @__PURE__ */ React.createElement(Progress, null), manifest && /* @__PURE__ */ React.createElement(
-    InfoCard,
-    {
-      title: manifest.title,
-      subheader: /* @__PURE__ */ React.createElement(
-        MarkdownContent,
-        {
-          className: styles.markdown,
-          content: (_b = manifest.description) != null ? _b : "No description"
-        }
-      ),
-      noPadding: true,
-      titleTypographyProps: { component: "h2" }
-    },
-    /* @__PURE__ */ React.createElement(
-      Stepper,
-      {
-        manifest,
-        extensions: props.customFieldExtensions,
-        onComplete,
-        FormProps: props.FormProps
-      }
-    )
-  ))));
-};
-
-const Router = (props) => {
-  const { components: { TemplateCardComponent } = {} } = props;
-  const outlet = useOutlet() || props.children;
-  const customFieldExtensions = useElementFilter(
-    outlet,
-    (elements) => elements.selectByComponentData({
-      key: FIELD_EXTENSION_WRAPPER_KEY
-    }).findComponentData({
-      key: FIELD_EXTENSION_KEY
-    })
-  );
-  const fieldExtensions = [
-    ...customFieldExtensions,
-    ...DEFAULT_SCAFFOLDER_FIELD_EXTENSIONS.filter(
-      ({ name }) => !customFieldExtensions.some(
-        (customFieldExtension) => customFieldExtension.name === name
-      )
-    )
-  ];
-  return /* @__PURE__ */ React.createElement(Routes, null, /* @__PURE__ */ React.createElement(
-    Route,
-    {
-      path: "/",
-      element: /* @__PURE__ */ React.createElement(
-        TemplateListPage,
-        {
-          TemplateCardComponent,
-          groups: props.groups
-        }
-      )
-    }
-  ), /* @__PURE__ */ React.createElement(
-    Route,
-    {
-      path: nextSelectedTemplateRouteRef.path,
-      element: /* @__PURE__ */ React.createElement(SecretsContextProvider, null, /* @__PURE__ */ React.createElement(
-        TemplateWizardPage,
-        {
-          customFieldExtensions: fieldExtensions,
-          FormProps: props.FormProps
-        }
-      ))
-    }
-  ));
-};
-
-export { Router };
-//# sourceMappingURL=index-78c07979.esm.js.map