@backstage/plugin-scaffolder 1.36.0 → 1.36.1

package/CHANGELOG.md

@@ -1,5 +1,14 @@
 # @backstage/plugin-scaffolder
 
+## 1.36.1
+
+### Patch Changes
+
+- 29238ae: Fixed the layout of the scaffolder plugin in the new frontend system to use the new page layout.
+- Updated dependencies
+  - @backstage/ui@0.13.1
+  - @backstage/frontend-plugin-api@0.15.1
+
 ## 1.36.0
 
 ### Minor Changes

package/dist/alpha/components/EditorSubPage.esm.js

@@ -0,0 +1,71 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { useCallback } from 'react';
+import { Routes, Route, useNavigate } from 'react-router-dom';
+import { Content } from '@backstage/core-components';
+import { makeStyles } from '@material-ui/core/styles';
+import { RequirePermission } from '@backstage/plugin-permission-react';
+import { templateManagementPermission } from '@backstage/plugin-scaffolder-common/alpha';
+import { SecretsContextProvider } from '@backstage/plugin-scaffolder-react';
+import { TemplateEditorIntro } from './TemplateEditorPage/TemplateEditorIntro.esm.js';
+import { TemplateEditor } from './TemplateEditorPage/TemplateEditor.esm.js';
+import { TemplateFormPreviewer } from './TemplateEditorPage/TemplateFormPreviewer.esm.js';
+import { CustomFieldExplorer } from './TemplateEditorPage/CustomFieldExplorer.esm.js';
+import { useTemplateDirectory } from './TemplateEditorPage/useTemplateDirectory.esm.js';
+
+const useEditorStyles = makeStyles({
+  editorContent: {
+    padding: 0,
+    height: "calc(100dvh - var(--bui-header-height, 0px))"
+  },
+  formContent: {
+    padding: 0,
+    height: "calc(100dvh - var(--bui-header-height, 0px))"
+  }
+});
+function EditorIntroContent() {
+  const navigate = useNavigate();
+  const { openDirectory, createDirectory } = useTemplateDirectory();
+  const handleSelect = useCallback(
+    (option) => {
+      if (option === "local") {
+        openDirectory().then(() => navigate("template")).catch(() => {
+        });
+      } else if (option === "create-template") {
+        createDirectory().then(() => navigate("template")).catch(() => {
+        });
+      } else if (option === "form") {
+        navigate("template-form");
+      } else if (option === "field-explorer") {
+        navigate("custom-fields");
+      }
+    },
+    [openDirectory, createDirectory, navigate]
+  );
+  return /* @__PURE__ */ jsx(Content, { children: /* @__PURE__ */ jsx(TemplateEditorIntro, { onSelect: handleSelect }) });
+}
+function EditorContent() {
+  const classes = useEditorStyles();
+  return /* @__PURE__ */ jsx(Content, { className: classes.editorContent, children: /* @__PURE__ */ jsx(TemplateEditor, {}) });
+}
+function FormPreviewContent() {
+  const classes = useEditorStyles();
+  const navigate = useNavigate();
+  const handleClose = useCallback(() => {
+    navigate("..");
+  }, [navigate]);
+  return /* @__PURE__ */ jsx(Content, { className: classes.formContent, children: /* @__PURE__ */ jsx(TemplateFormPreviewer, { onClose: handleClose }) });
+}
+function CustomFieldsContent() {
+  return /* @__PURE__ */ jsx(Content, { children: /* @__PURE__ */ jsx(CustomFieldExplorer, {}) });
+}
+function EditorSubPage() {
+  return /* @__PURE__ */ jsx(RequirePermission, { permission: templateManagementPermission, children: /* @__PURE__ */ jsx(SecretsContextProvider, { children: /* @__PURE__ */ jsxs(Routes, { children: [
+    /* @__PURE__ */ jsx(Route, { index: true, element: /* @__PURE__ */ jsx(EditorIntroContent, {}) }),
+    /* @__PURE__ */ jsx(Route, { path: "template", element: /* @__PURE__ */ jsx(EditorContent, {}) }),
+    /* @__PURE__ */ jsx(Route, { path: "template-form", element: /* @__PURE__ */ jsx(FormPreviewContent, {}) }),
+    /* @__PURE__ */ jsx(Route, { path: "custom-fields", element: /* @__PURE__ */ jsx(CustomFieldsContent, {}) })
+  ] }) }) });
+}
+
+export { EditorSubPage };
+//# sourceMappingURL=EditorSubPage.esm.js.map

package/dist/alpha/components/EditorSubPage.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EditorSubPage.esm.js","sources":["../../../src/alpha/components/EditorSubPage.tsx"],"sourcesContent":["/*\n * Copyright 2026 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { useCallback } from 'react';\nimport { Routes, Route, useNavigate } from 'react-router-dom';\nimport { Content } from '@backstage/core-components';\nimport { makeStyles } from '@material-ui/core/styles';\nimport { RequirePermission } from '@backstage/plugin-permission-react';\nimport { templateManagementPermission } from '@backstage/plugin-scaffolder-common/alpha';\nimport { SecretsContextProvider } from '@backstage/plugin-scaffolder-react';\nimport { TemplateEditorIntro } from './TemplateEditorPage/TemplateEditorIntro';\nimport { TemplateEditor } from './TemplateEditorPage/TemplateEditor';\nimport { TemplateFormPreviewer } from './TemplateEditorPage/TemplateFormPreviewer';\nimport { CustomFieldExplorer } from './TemplateEditorPage/CustomFieldExplorer';\nimport { useTemplateDirectory } from './TemplateEditorPage/useTemplateDirectory';\n\nconst useEditorStyles = makeStyles({\n  editorContent: {\n    padding: 0,\n    height: 'calc(100dvh - var(--bui-header-height, 0px))',\n  },\n  formContent: {\n    padding: 0,\n    height: 'calc(100dvh - var(--bui-header-height, 0px))',\n  },\n});\n\nfunction EditorIntroContent() {\n  const navigate = useNavigate();\n  const { openDirectory, createDirectory } = useTemplateDirectory();\n\n  const handleSelect = useCallback(\n    (option: 'create-template' | 'local' | 'form' | 'field-explorer') => {\n      if (option === 'local') {\n        openDirectory()\n          .then(() => navigate('template'))\n          .catch(() => {});\n      } else if (option === 'create-template') {\n        createDirectory()\n          .then(() => navigate('template'))\n          .catch(() => {});\n      } else if (option === 'form') {\n        navigate('template-form');\n      } else if (option === 'field-explorer') {\n        navigate('custom-fields');\n      }\n    },\n    [openDirectory, createDirectory, navigate],\n  );\n\n  return (\n    <Content>\n      <TemplateEditorIntro onSelect={handleSelect} />\n    </Content>\n  );\n}\n\nfunction EditorContent() {\n  const classes = useEditorStyles();\n  return (\n    <Content className={classes.editorContent}>\n      <TemplateEditor />\n    </Content>\n  );\n}\n\nfunction FormPreviewContent() {\n  const classes = useEditorStyles();\n  const navigate = useNavigate();\n\n  const handleClose = useCallback(() => {\n    navigate('..');\n  }, [navigate]);\n\n  return (\n    <Content className={classes.formContent}>\n      <TemplateFormPreviewer onClose={handleClose} />\n    </Content>\n  );\n}\n\nfunction CustomFieldsContent() {\n  return (\n    <Content>\n      <CustomFieldExplorer />\n    </Content>\n  );\n}\n\n/**\n * Sub-page for the template editor tab. Renders the editor intro at the index,\n * with sub-routes for the full editor, form previewer, and custom fields explorer.\n *\n * @internal\n */\nexport function EditorSubPage() {\n  return (\n    <RequirePermission permission={templateManagementPermission}>\n      <SecretsContextProvider>\n        <Routes>\n          <Route index element={<EditorIntroContent />} />\n          <Route path=\"template\" element={<EditorContent />} />\n          <Route path=\"template-form\" element={<FormPreviewContent />} />\n          <Route path=\"custom-fields\" element={<CustomFieldsContent />} />\n        </Routes>\n      </SecretsContextProvider>\n    </RequirePermission>\n  );\n}\n"],"names":[],"mappings":"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"}

package/dist/alpha/components/TasksSubPage.esm.js

@@ -0,0 +1,21 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { Routes, Route } from 'react-router-dom';
+import { Content } from '@backstage/core-components';
+import { OngoingTaskBody } from '../../components/OngoingTask/OngoingTask.esm.js';
+import { ListTaskPageContent } from '../../components/ListTasksPage/ListTasksPage.esm.js';
+
+function TasksSubPage() {
+  return /* @__PURE__ */ jsxs(Routes, { children: [
+    /* @__PURE__ */ jsx(
+      Route,
+      {
+        index: true,
+        element: /* @__PURE__ */ jsx(Content, { children: /* @__PURE__ */ jsx(ListTaskPageContent, {}) })
+      }
+    ),
+    /* @__PURE__ */ jsx(Route, { path: ":taskId", element: /* @__PURE__ */ jsx(OngoingTaskBody, {}) })
+  ] });
+}
+
+export { TasksSubPage };
+//# sourceMappingURL=TasksSubPage.esm.js.map

package/dist/alpha/components/TasksSubPage.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TasksSubPage.esm.js","sources":["../../../src/alpha/components/TasksSubPage.tsx"],"sourcesContent":["/*\n * Copyright 2026 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { Routes, Route } from 'react-router-dom';\nimport { Content } from '@backstage/core-components';\nimport { OngoingTaskBody } from '../../components/OngoingTask';\nimport { ListTaskPageContent } from '../../components/ListTasksPage';\n\n/**\n * Sub-page for the tasks tab. Renders the task list at the index route\n * and the ongoing task detail at the parameterized route.\n *\n * @internal\n */\nexport function TasksSubPage() {\n  return (\n    <Routes>\n      <Route\n        index\n        element={\n          <Content>\n            <ListTaskPageContent />\n          </Content>\n        }\n      />\n      <Route path=\":taskId\" element={<OngoingTaskBody />} />\n    </Routes>\n  );\n}\n"],"names":[],"mappings":";;;;;;AA2BO,SAAS,YAAA,GAAe;AAC7B,EAAA,4BACG,MAAA,EAAA,EACC,QAAA,EAAA;AAAA,oBAAA,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,KAAA,EAAK,IAAA;AAAA,QACL,OAAA,kBACE,GAAA,CAAC,OAAA,EAAA,EACC,QAAA,kBAAA,GAAA,CAAC,uBAAoB,CAAA,EACvB;AAAA;AAAA,KAEJ;AAAA,wBACC,KAAA,EAAA,EAAM,IAAA,EAAK,WAAU,OAAA,kBAAS,GAAA,CAAC,mBAAgB,CAAA,EAAI;AAAA,GAAA,EACtD,CAAA;AAEJ;;;;"}

package/dist/alpha/components/TemplateWizardPage/TemplateWizardPage.esm.js

@@ -3,10 +3,10 @@ import { useState, useCallback } from 'react';
 import { useNavigate, Navigate } from 'react-router-dom';
 import useAsync from 'react-use/esm/useAsync';
 import { stringifyEntityRef, ANNOTATION_EDIT_URL } from '@backstage/catalog-model';
-import { useRouteRef, useApi, useRouteRefParams, AnalyticsContext } from '@backstage/core-plugin-api';
+import { AnalyticsContext, useRouteRef, useApi, useRouteRefParams } from '@backstage/core-plugin-api';
 import { useTemplateSecrets, scaffolderApiRef } from '@backstage/plugin-scaffolder-react';
 import { catalogApiRef } from '@backstage/plugin-catalog-react';
-import { useTemplateParameterSchema, Workflow } from '@backstage/plugin-scaffolder-react/alpha';
+import { Workflow, useTemplateParameterSchema } from '@backstage/plugin-scaffolder-react/alpha';
 import { Page, Header, Progress } from '@backstage/core-components';
 import { rootRouteRef, scaffolderTaskRouteRef, selectedTemplateRouteRef } from '../../../routes.esm.js';
 import { useTranslationRef } from '@backstage/core-plugin-api/alpha';
@@ -14,7 +14,7 @@ import { scaffolderTranslationRef } from '../../../translation.esm.js';
 import { TemplateWizardPageContextMenu } from './TemplateWizardPageContextMenu.esm.js';
 import { useFormDecorators } from '../../hooks/useFormDecorators.esm.js';
 
-const TemplateWizardPage = (props) => {
+function useTemplateWizard(_props) {
   const rootRef = useRouteRef(rootRouteRef);
   const taskRoute = useRouteRef(scaffolderTaskRouteRef);
   const { secrets: contextSecrets } = useTemplateSecrets();
@@ -67,6 +67,56 @@ const TemplateWizardPage = (props) => {
     ]
   );
   const onError = useCallback(() => /* @__PURE__ */ jsx(Navigate, { to: rootRef() }), [rootRef]);
+  return {
+    templateRef,
+    templateName,
+    namespace,
+    manifest,
+    editUrl,
+    isCreating,
+    onCreate,
+    onError,
+    t
+  };
+}
+const TemplateWizardPageContent = (props) => {
+  const {
+    templateRef,
+    templateName,
+    namespace,
+    isCreating,
+    onCreate,
+    onError
+  } = useTemplateWizard();
+  return /* @__PURE__ */ jsxs(AnalyticsContext, { attributes: { entityRef: templateRef }, children: [
+    isCreating && /* @__PURE__ */ jsx(Progress, {}),
+    /* @__PURE__ */ jsx(
+      Workflow,
+      {
+        namespace,
+        templateName,
+        onCreate,
+        components: props.components,
+        onError,
+        extensions: props.customFieldExtensions,
+        formProps: props.formProps,
+        layouts: props.layouts
+      }
+    )
+  ] });
+};
+const TemplateWizardPage = (props) => {
+  const {
+    templateRef,
+    templateName,
+    namespace,
+    manifest,
+    editUrl,
+    isCreating,
+    onCreate,
+    onError,
+    t
+  } = useTemplateWizard();
   return /* @__PURE__ */ jsx(AnalyticsContext, { attributes: { entityRef: templateRef }, children: /* @__PURE__ */ jsxs(Page, { themeId: "website", children: [
     /* @__PURE__ */ jsx(
       Header,
@@ -97,5 +147,5 @@ const TemplateWizardPage = (props) => {
   ] }) });
 };
 
-export { TemplateWizardPage };
+export { TemplateWizardPage, TemplateWizardPageContent };
 //# sourceMappingURL=TemplateWizardPage.esm.js.map

package/dist/alpha/components/TemplateWizardPage/TemplateWizardPage.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"TemplateWizardPage.esm.js","sources":["../../../../src/alpha/components/TemplateWizardPage/TemplateWizardPage.tsx"],"sourcesContent":["/*\n * Copyright 2022 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport { ComponentType, useCallback, useState } from 'react';\nimport { Navigate, useNavigate } from 'react-router-dom';\nimport useAsync from 'react-use/esm/useAsync';\nimport {\n  stringifyEntityRef,\n  ANNOTATION_EDIT_URL,\n} from '@backstage/catalog-model';\nimport {\n  AnalyticsContext,\n  useApi,\n  useRouteRef,\n  useRouteRefParams,\n} from '@backstage/core-plugin-api';\nimport {\n  scaffolderApiRef,\n  useTemplateSecrets,\n  type LayoutOptions,\n  FormProps,\n  FieldExtensionOptions,\n  ReviewStepProps,\n} from '@backstage/plugin-scaffolder-react';\nimport { catalogApiRef } from '@backstage/plugin-catalog-react';\n\nimport {\n  Workflow,\n  useTemplateParameterSchema,\n} from '@backstage/plugin-scaffolder-react/alpha';\nimport { JsonValue } from '@backstage/types';\nimport { Header, Page, Progress } from '@backstage/core-components';\n\nimport {\n  rootRouteRef,\n  scaffolderTaskRouteRef,\n  selectedTemplateRouteRef,\n} from '../../../routes';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { scaffolderTranslationRef } from '../../../translation';\n\nimport { TemplateWizardPageContextMenu } from './TemplateWizardPageContextMenu';\nimport { useFormDecorators } from '../../hooks';\n\n/**\n * @alpha\n */\nexport type TemplateWizardPageProps = {\n  customFieldExtensions: FieldExtensionOptions<any, any>[];\n  components?: {\n    ReviewStepComponent?: ComponentType<ReviewStepProps>;\n  };\n  layouts?: LayoutOptions[];\n  formProps?: FormProps;\n  headerOptions?: {\n    pageTitleOverride?: string;\n    title?: string;\n    subtitle?: string;\n  };\n};\n\nexport const TemplateWizardPage = (props: TemplateWizardPageProps) => {\n  const rootRef = useRouteRef(rootRouteRef);\n  const taskRoute = useRouteRef(scaffolderTaskRouteRef);\n  const { secrets: contextSecrets } = useTemplateSecrets();\n  const scaffolderApi = useApi(scaffolderApiRef);\n  const catalogApi = useApi(catalogApiRef);\n  const [isCreating, setIsCreating] = useState(false);\n  const navigate = useNavigate();\n  const { templateName, namespace } = useRouteRefParams(\n    selectedTemplateRouteRef,\n  );\n  const { t } = useTranslationRef(scaffolderTranslationRef);\n\n  const templateRef = stringifyEntityRef({\n    kind: 'Template',\n    namespace,\n    name: templateName,\n  });\n\n  const { manifest } = useTemplateParameterSchema(templateRef);\n  const decorators = useFormDecorators();\n\n  const { value: editUrl } = useAsync(async () => {\n    const data = await catalogApi.getEntityByRef(templateRef);\n    return data?.metadata.annotations?.[ANNOTATION_EDIT_URL];\n  }, [templateRef, catalogApi]);\n\n  const onCreate = useCallback(\n    async (initialValues: Record<string, JsonValue>) => {\n      if (isCreating) {\n        return;\n      }\n\n      setIsCreating(true);\n\n      const { formState: values, secrets } = await decorators.run({\n        formState: initialValues,\n        secrets: contextSecrets,\n        manifest,\n      });\n\n      const { taskId } = await scaffolderApi.scaffold({\n        templateRef,\n        values,\n        secrets,\n      });\n\n      navigate(taskRoute({ taskId }));\n    },\n    [\n      contextSecrets,\n      decorators,\n      isCreating,\n      manifest,\n      navigate,\n      scaffolderApi,\n      taskRoute,\n      templateRef,\n    ],\n  );\n\n  const onError = useCallback(() => <Navigate to={rootRef()} />, [rootRef]);\n\n  return (\n    <AnalyticsContext attributes={{ entityRef: templateRef }}>\n      <Page themeId=\"website\">\n        <Header\n          pageTitleOverride={\n            manifest?.title\n              ? t('templateWizardPage.templateWithTitle', {\n                  templateTitle: manifest.title,\n                })\n              : t('templateWizardPage.pageTitle')\n          }\n          title={t('templateWizardPage.title')}\n          subtitle={t('templateWizardPage.subtitle')}\n          {...props.headerOptions}\n        >\n          <TemplateWizardPageContextMenu editUrl={editUrl} />\n        </Header>\n        {isCreating && <Progress />}\n        <Workflow\n          namespace={namespace}\n          templateName={templateName}\n          onCreate={onCreate}\n          components={props.components}\n          onError={onError}\n          extensions={props.customFieldExtensions}\n          formProps={props.formProps}\n          layouts={props.layouts}\n        />\n      </Page>\n    </AnalyticsContext>\n  );\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"TemplateWizardPage.esm.js","sources":["../../../../src/alpha/components/TemplateWizardPage/TemplateWizardPage.tsx"],"sourcesContent":["/*\n * Copyright 2022 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport { ComponentType, useCallback, useState } from 'react';\nimport { Navigate, useNavigate } from 'react-router-dom';\nimport useAsync from 'react-use/esm/useAsync';\nimport {\n  stringifyEntityRef,\n  ANNOTATION_EDIT_URL,\n} from '@backstage/catalog-model';\nimport {\n  AnalyticsContext,\n  useApi,\n  useRouteRef,\n  useRouteRefParams,\n} from '@backstage/core-plugin-api';\nimport {\n  scaffolderApiRef,\n  useTemplateSecrets,\n  type LayoutOptions,\n  FormProps,\n  FieldExtensionOptions,\n  ReviewStepProps,\n} from '@backstage/plugin-scaffolder-react';\nimport { catalogApiRef } from '@backstage/plugin-catalog-react';\n\nimport {\n  Workflow,\n  useTemplateParameterSchema,\n} from '@backstage/plugin-scaffolder-react/alpha';\nimport { JsonValue } from '@backstage/types';\nimport { Header, Page, Progress } from '@backstage/core-components';\n\nimport {\n  rootRouteRef,\n  scaffolderTaskRouteRef,\n  selectedTemplateRouteRef,\n} from '../../../routes';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { scaffolderTranslationRef } from '../../../translation';\n\nimport { TemplateWizardPageContextMenu } from './TemplateWizardPageContextMenu';\nimport { useFormDecorators } from '../../hooks';\n\n/**\n * @alpha\n */\nexport type TemplateWizardPageProps = {\n  customFieldExtensions: FieldExtensionOptions<any, any>[];\n  components?: {\n    ReviewStepComponent?: ComponentType<ReviewStepProps>;\n  };\n  layouts?: LayoutOptions[];\n  formProps?: FormProps;\n  headerOptions?: {\n    pageTitleOverride?: string;\n    title?: string;\n    subtitle?: string;\n  };\n};\n\nfunction useTemplateWizard(_props: TemplateWizardPageProps) {\n  const rootRef = useRouteRef(rootRouteRef);\n  const taskRoute = useRouteRef(scaffolderTaskRouteRef);\n  const { secrets: contextSecrets } = useTemplateSecrets();\n  const scaffolderApi = useApi(scaffolderApiRef);\n  const catalogApi = useApi(catalogApiRef);\n  const [isCreating, setIsCreating] = useState(false);\n  const navigate = useNavigate();\n  const { templateName, namespace } = useRouteRefParams(\n    selectedTemplateRouteRef,\n  );\n  const { t } = useTranslationRef(scaffolderTranslationRef);\n\n  const templateRef = stringifyEntityRef({\n    kind: 'Template',\n    namespace,\n    name: templateName,\n  });\n\n  const { manifest } = useTemplateParameterSchema(templateRef);\n  const decorators = useFormDecorators();\n\n  const { value: editUrl } = useAsync(async () => {\n    const data = await catalogApi.getEntityByRef(templateRef);\n    return data?.metadata.annotations?.[ANNOTATION_EDIT_URL];\n  }, [templateRef, catalogApi]);\n\n  const onCreate = useCallback(\n    async (initialValues: Record<string, JsonValue>) => {\n      if (isCreating) {\n        return;\n      }\n\n      setIsCreating(true);\n\n      const { formState: values, secrets } = await decorators.run({\n        formState: initialValues,\n        secrets: contextSecrets,\n        manifest,\n      });\n\n      const { taskId } = await scaffolderApi.scaffold({\n        templateRef,\n        values,\n        secrets,\n      });\n\n      navigate(taskRoute({ taskId }));\n    },\n    [\n      contextSecrets,\n      decorators,\n      isCreating,\n      manifest,\n      navigate,\n      scaffolderApi,\n      taskRoute,\n      templateRef,\n    ],\n  );\n\n  const onError = useCallback(() => <Navigate to={rootRef()} />, [rootRef]);\n\n  return {\n    templateRef,\n    templateName,\n    namespace,\n    manifest,\n    editUrl,\n    isCreating,\n    onCreate,\n    onError,\n    t,\n  };\n}\n\n/**\n * Content-only version of the template wizard, for use within the NFS page layout\n * where the header is provided by the framework.\n *\n * @internal\n */\nexport const TemplateWizardPageContent = (props: TemplateWizardPageProps) => {\n  const {\n    templateRef,\n    templateName,\n    namespace,\n    isCreating,\n    onCreate,\n    onError,\n  } = useTemplateWizard(props);\n\n  return (\n    <AnalyticsContext attributes={{ entityRef: templateRef }}>\n      {isCreating && <Progress />}\n      <Workflow\n        namespace={namespace}\n        templateName={templateName}\n        onCreate={onCreate}\n        components={props.components}\n        onError={onError}\n        extensions={props.customFieldExtensions}\n        formProps={props.formProps}\n        layouts={props.layouts}\n      />\n    </AnalyticsContext>\n  );\n};\n\nexport const TemplateWizardPage = (props: TemplateWizardPageProps) => {\n  const {\n    templateRef,\n    templateName,\n    namespace,\n    manifest,\n    editUrl,\n    isCreating,\n    onCreate,\n    onError,\n    t,\n  } = useTemplateWizard(props);\n\n  return (\n    <AnalyticsContext attributes={{ entityRef: templateRef }}>\n      <Page themeId=\"website\">\n        <Header\n          pageTitleOverride={\n            manifest?.title\n              ? t('templateWizardPage.templateWithTitle', {\n                  templateTitle: manifest.title,\n                })\n              : t('templateWizardPage.pageTitle')\n          }\n          title={t('templateWizardPage.title')}\n          subtitle={t('templateWizardPage.subtitle')}\n          {...props.headerOptions}\n        >\n          <TemplateWizardPageContextMenu editUrl={editUrl} />\n        </Header>\n        {isCreating && <Progress />}\n        <Workflow\n          namespace={namespace}\n          templateName={templateName}\n          onCreate={onCreate}\n          components={props.components}\n          onError={onError}\n          extensions={props.customFieldExtensions}\n          formProps={props.formProps}\n          layouts={props.layouts}\n        />\n      </Page>\n    </AnalyticsContext>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/alpha/components/TemplatesSubPage.esm.js

@@ -0,0 +1,128 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useCallback } from 'react';
+import { Routes, Route, useNavigate } from 'react-router-dom';
+import { DocsIcon, Content, ContentHeader, SupportButton } from '@backstage/core-components';
+import { useRouteRef, useApp } from '@backstage/core-plugin-api';
+import { useTranslationRef } from '@backstage/core-plugin-api/alpha';
+import { EntityListProvider, CatalogFilterLayout, EntitySearchBar, EntityKindPicker, UserListPicker, EntityTagPicker, EntityOwnerPicker } from '@backstage/plugin-catalog-react';
+import { TemplateCategoryPicker, TemplateGroups } from '@backstage/plugin-scaffolder-react/alpha';
+import { useCustomFieldExtensions, useCustomLayouts, SecretsContextProvider } from '@backstage/plugin-scaffolder-react';
+import { parseEntityRef, stringifyEntityRef } from '@backstage/catalog-model';
+import { RegisterExistingButton } from './TemplateListPage/RegisterExistingButton.esm.js';
+import { TemplateWizardPageContent } from './TemplateWizardPage/TemplateWizardPage.esm.js';
+import { registerComponentRouteRef, viewTechDocRouteRef, selectedTemplateRouteRef } from '../../routes.esm.js';
+import { scaffolderTranslationRef } from '../../translation.esm.js';
+import { DEFAULT_SCAFFOLDER_FIELD_EXTENSIONS } from '../../extensions/default.esm.js';
+import { buildTechDocsURL } from '@backstage/plugin-techdocs-react';
+import { TECHDOCS_ANNOTATION, TECHDOCS_EXTERNAL_ANNOTATION } from '@backstage/plugin-techdocs-common';
+import { OpaqueFormField } from '../../packages/scaffolder-internal/src/wiring/InternalFormField.esm.js';
+
+function TemplateListContent() {
+  const registerComponentLink = useRouteRef(registerComponentRouteRef);
+  const viewTechDocsLink = useRouteRef(viewTechDocRouteRef);
+  const templateRoute = useRouteRef(selectedTemplateRouteRef);
+  const navigate = useNavigate();
+  const app = useApp();
+  const { t } = useTranslationRef(scaffolderTranslationRef);
+  const groups = [
+    {
+      title: t("templateListPage.templateGroups.defaultTitle"),
+      filter: () => true
+    }
+  ];
+  const additionalLinksForEntity = useCallback(
+    (template) => {
+      if (!(template.metadata.annotations?.[TECHDOCS_ANNOTATION] || template.metadata.annotations?.[TECHDOCS_EXTERNAL_ANNOTATION]) || !viewTechDocsLink) {
+        return [];
+      }
+      const url = buildTechDocsURL(template, viewTechDocsLink);
+      return url ? [
+        {
+          icon: app.getSystemIcon("docs") ?? DocsIcon,
+          text: t(
+            "templateListPage.additionalLinksForEntity.viewTechDocsTitle"
+          ),
+          url
+        }
+      ] : [];
+    },
+    [app, viewTechDocsLink, t]
+  );
+  const onTemplateSelected = useCallback(
+    (template) => {
+      const { namespace, name } = parseEntityRef(stringifyEntityRef(template));
+      navigate(templateRoute({ namespace, templateName: name }));
+    },
+    [navigate, templateRoute]
+  );
+  return /* @__PURE__ */ jsx(EntityListProvider, { children: /* @__PURE__ */ jsxs(Content, { children: [
+    /* @__PURE__ */ jsxs(ContentHeader, { children: [
+      /* @__PURE__ */ jsx(
+        RegisterExistingButton,
+        {
+          title: t(
+            "templateListPage.contentHeader.registerExistingButtonTitle"
+          ),
+          to: registerComponentLink && registerComponentLink()
+        }
+      ),
+      /* @__PURE__ */ jsx(SupportButton, { children: t("templateListPage.contentHeader.supportButtonTitle") })
+    ] }),
+    /* @__PURE__ */ jsxs(CatalogFilterLayout, { children: [
+      /* @__PURE__ */ jsxs(CatalogFilterLayout.Filters, { children: [
+        /* @__PURE__ */ jsx(EntitySearchBar, {}),
+        /* @__PURE__ */ jsx(EntityKindPicker, { initialFilter: "template", hidden: true }),
+        /* @__PURE__ */ jsx(
+          UserListPicker,
+          {
+            initialFilter: "all",
+            availableFilters: ["all", "starred"]
+          }
+        ),
+        /* @__PURE__ */ jsx(TemplateCategoryPicker, {}),
+        /* @__PURE__ */ jsx(EntityTagPicker, {}),
+        /* @__PURE__ */ jsx(EntityOwnerPicker, {})
+      ] }),
+      /* @__PURE__ */ jsx(CatalogFilterLayout.Content, { children: /* @__PURE__ */ jsx(
+        TemplateGroups,
+        {
+          groups,
+          onTemplateSelected,
+          additionalLinksForEntity
+        }
+      ) })
+    ] })
+  ] }) });
+}
+function TemplatesSubPage(props) {
+  const customFieldExtensions = useCustomFieldExtensions(void 0);
+  const customLayouts = useCustomLayouts(void 0);
+  const fieldExtensions = [
+    ...customFieldExtensions,
+    ...props.formFields?.map(OpaqueFormField.toInternal) ?? [],
+    ...DEFAULT_SCAFFOLDER_FIELD_EXTENSIONS.filter(
+      ({ name }) => !customFieldExtensions.some(
+        (customFieldExtension) => customFieldExtension.name === name
+      )
+    )
+  ];
+  return /* @__PURE__ */ jsxs(Routes, { children: [
+    /* @__PURE__ */ jsx(Route, { index: true, element: /* @__PURE__ */ jsx(TemplateListContent, {}) }),
+    /* @__PURE__ */ jsx(
+      Route,
+      {
+        path: ":namespace/:templateName",
+        element: /* @__PURE__ */ jsx(SecretsContextProvider, { children: /* @__PURE__ */ jsx(
+          TemplateWizardPageContent,
+          {
+            customFieldExtensions: fieldExtensions,
+            layouts: customLayouts
+          }
+        ) })
+      }
+    )
+  ] });
+}
+
+export { TemplatesSubPage };
+//# sourceMappingURL=TemplatesSubPage.esm.js.map

package/dist/alpha/components/TemplatesSubPage.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TemplatesSubPage.esm.js","sources":["../../../src/alpha/components/TemplatesSubPage.tsx"],"sourcesContent":["/*\n * Copyright 2026 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { useCallback } from 'react';\nimport { Routes, Route, useNavigate } from 'react-router-dom';\nimport {\n  Content,\n  ContentHeader,\n  DocsIcon,\n  SupportButton,\n} from '@backstage/core-components';\nimport { useApp, useRouteRef } from '@backstage/core-plugin-api';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport {\n  EntityKindPicker,\n  EntityListProvider,\n  EntitySearchBar,\n  EntityTagPicker,\n  CatalogFilterLayout,\n  UserListPicker,\n  EntityOwnerPicker,\n} from '@backstage/plugin-catalog-react';\nimport {\n  TemplateCategoryPicker,\n  TemplateGroups,\n} from '@backstage/plugin-scaffolder-react/alpha';\nimport {\n  FieldExtensionOptions,\n  SecretsContextProvider,\n  useCustomFieldExtensions,\n  useCustomLayouts,\n} from '@backstage/plugin-scaffolder-react';\nimport { TemplateEntityV1beta3 } from '@backstage/plugin-scaffolder-common';\nimport { parseEntityRef, stringifyEntityRef } from '@backstage/catalog-model';\nimport { FormField } from '@backstage/plugin-scaffolder-react/alpha';\nimport { OpaqueFormField } from '@internal/scaffolder';\nimport { RegisterExistingButton } from './TemplateListPage/RegisterExistingButton';\nimport { TemplateWizardPageContent } from './TemplateWizardPage';\nimport {\n  registerComponentRouteRef,\n  selectedTemplateRouteRef,\n  viewTechDocRouteRef,\n} from '../../routes';\nimport { scaffolderTranslationRef } from '../../translation';\nimport { DEFAULT_SCAFFOLDER_FIELD_EXTENSIONS } from '../../extensions/default';\nimport { buildTechDocsURL } from '@backstage/plugin-techdocs-react';\nimport {\n  TECHDOCS_ANNOTATION,\n  TECHDOCS_EXTERNAL_ANNOTATION,\n} from '@backstage/plugin-techdocs-common';\n\nfunction TemplateListContent() {\n  const registerComponentLink = useRouteRef(registerComponentRouteRef);\n  const viewTechDocsLink = useRouteRef(viewTechDocRouteRef);\n  const templateRoute = useRouteRef(selectedTemplateRouteRef);\n  const navigate = useNavigate();\n  const app = useApp();\n  const { t } = useTranslationRef(scaffolderTranslationRef);\n\n  const groups = [\n    {\n      title: t('templateListPage.templateGroups.defaultTitle'),\n      filter: () => true,\n    },\n  ];\n\n  const additionalLinksForEntity = useCallback(\n    (template: TemplateEntityV1beta3) => {\n      if (\n        !(\n          template.metadata.annotations?.[TECHDOCS_ANNOTATION] ||\n          template.metadata.annotations?.[TECHDOCS_EXTERNAL_ANNOTATION]\n        ) ||\n        !viewTechDocsLink\n      ) {\n        return [];\n      }\n\n      const url = buildTechDocsURL(template, viewTechDocsLink);\n      return url\n        ? [\n            {\n              icon: app.getSystemIcon('docs') ?? DocsIcon,\n              text: t(\n                'templateListPage.additionalLinksForEntity.viewTechDocsTitle',\n              ),\n              url,\n            },\n          ]\n        : [];\n    },\n    [app, viewTechDocsLink, t],\n  );\n\n  const onTemplateSelected = useCallback(\n    (template: TemplateEntityV1beta3) => {\n      const { namespace, name } = parseEntityRef(stringifyEntityRef(template));\n      navigate(templateRoute({ namespace, templateName: name }));\n    },\n    [navigate, templateRoute],\n  );\n\n  return (\n    <EntityListProvider>\n      <Content>\n        <ContentHeader>\n          <RegisterExistingButton\n            title={t(\n              'templateListPage.contentHeader.registerExistingButtonTitle',\n            )}\n            to={registerComponentLink && registerComponentLink()}\n          />\n          <SupportButton>\n            {t('templateListPage.contentHeader.supportButtonTitle')}\n          </SupportButton>\n        </ContentHeader>\n\n        <CatalogFilterLayout>\n          <CatalogFilterLayout.Filters>\n            <EntitySearchBar />\n            <EntityKindPicker initialFilter=\"template\" hidden />\n            <UserListPicker\n              initialFilter=\"all\"\n              availableFilters={['all', 'starred']}\n            />\n            <TemplateCategoryPicker />\n            <EntityTagPicker />\n            <EntityOwnerPicker />\n          </CatalogFilterLayout.Filters>\n          <CatalogFilterLayout.Content>\n            <TemplateGroups\n              groups={groups}\n              onTemplateSelected={onTemplateSelected}\n              additionalLinksForEntity={additionalLinksForEntity}\n            />\n          </CatalogFilterLayout.Content>\n        </CatalogFilterLayout>\n      </Content>\n    </EntityListProvider>\n  );\n}\n\n/**\n * Sub-page for the templates tab. Renders the template list at the index route\n * and the template wizard at the parameterized route.\n *\n * @internal\n */\nexport function TemplatesSubPage(props: { formFields?: Array<FormField> }) {\n  const customFieldExtensions = useCustomFieldExtensions(undefined);\n  const customLayouts = useCustomLayouts(undefined);\n\n  const fieldExtensions = [\n    ...customFieldExtensions,\n    ...(props.formFields?.map(OpaqueFormField.toInternal) ?? []),\n    ...DEFAULT_SCAFFOLDER_FIELD_EXTENSIONS.filter(\n      ({ name }) =>\n        !customFieldExtensions.some(\n          (customFieldExtension: FieldExtensionOptions) =>\n            customFieldExtension.name === name,\n        ),\n    ),\n  ] as FieldExtensionOptions[];\n\n  return (\n    <Routes>\n      <Route index element={<TemplateListContent />} />\n      <Route\n        path=\":namespace/:templateName\"\n        element={\n          <SecretsContextProvider>\n            <TemplateWizardPageContent\n              customFieldExtensions={fieldExtensions}\n              layouts={customLayouts}\n            />\n          </SecretsContextProvider>\n        }\n      />\n    </Routes>\n  );\n}\n"],"names":[],"mappings":"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"}

package/dist/alpha/extensions.esm.js

@@ -1,8 +1,8 @@
 import { jsx } from 'react/jsx-runtime';
-import { PageBlueprint, createExtensionInput, NavItemBlueprint, ApiBlueprint, identityApiRef, fetchApiRef, discoveryApiRef } from '@backstage/frontend-plugin-api';
+import { PageBlueprint, createExtensionInput, SubPageBlueprint, NavItemBlueprint, ApiBlueprint, identityApiRef, fetchApiRef, discoveryApiRef } from '@backstage/frontend-plugin-api';
 import { rootRouteRef } from '../routes.esm.js';
 import CreateComponentIcon from '@material-ui/icons/AddCircleOutline';
-import { formFieldsApiRef, FormFieldBlueprint } from '@backstage/plugin-scaffolder-react/alpha';
+import { FormFieldBlueprint, formFieldsApiRef } from '@backstage/plugin-scaffolder-react/alpha';
 import { scmIntegrationsApiRef } from '@backstage/integration-react';
 import { scaffolderApiRef } from '@backstage/plugin-scaffolder-react';
 import { ScaffolderClient } from '../api.esm.js';
@@ -13,25 +13,66 @@ const scaffolderPage = PageBlueprint.makeWithOverrides({
       FormFieldBlueprint.dataRefs.formFieldLoader
     ])
   },
-  factory(originalFactory, { apis, inputs }) {
-    const formFieldsApi = apis.get(formFieldsApiRef);
+  factory(originalFactory) {
     return originalFactory({
       routeRef: rootRouteRef,
       path: "/create",
+      title: "Create"
+    });
+  }
+});
+const scaffolderTemplatesSubPage = SubPageBlueprint.makeWithOverrides({
+  name: "templates",
+  factory(originalFactory, { apis }) {
+    const formFieldsApi = apis.get(formFieldsApiRef);
+    return originalFactory({
+      path: "templates",
+      title: "Templates",
       loader: async () => {
-        const apiFormFields = await formFieldsApi?.loadFormFields() ?? [];
-        const formFieldLoaders = inputs.formFields.map(
-          (output) => output.get(FormFieldBlueprint.dataRefs.formFieldLoader)
-        );
-        const loadedFormFields = await Promise.all(
-          formFieldLoaders.map((loader) => loader())
-        );
-        const formFields = [...apiFormFields, ...loadedFormFields];
-        return import('../components/Router/Router.esm.js').then((m) => /* @__PURE__ */ jsx(m.InternalRouter, { formFields }));
+        const formFields = await formFieldsApi?.loadFormFields() ?? [];
+        return import('./components/TemplatesSubPage.esm.js').then((m) => /* @__PURE__ */ jsx(m.TemplatesSubPage, { formFields }));
       }
     });
   }
 });
+const scaffolderTasksSubPage = SubPageBlueprint.make({
+  name: "tasks",
+  params: {
+    path: "tasks",
+    title: "Tasks",
+    loader: () => import('./components/TasksSubPage.esm.js').then((m) => /* @__PURE__ */ jsx(m.TasksSubPage, {}))
+  }
+});
+const scaffolderActionsSubPage = SubPageBlueprint.make({
+  name: "actions",
+  params: {
+    path: "actions",
+    title: "Actions",
+    loader: () => Promise.all([
+      import('../components/ActionsPage/index.esm.js'),
+      import('@backstage/core-components')
+    ]).then(([m, { Content }]) => /* @__PURE__ */ jsx(Content, { children: /* @__PURE__ */ jsx(m.ActionPageContent, {}) }))
+  }
+});
+const scaffolderEditorSubPage = SubPageBlueprint.make({
+  name: "editor",
+  params: {
+    path: "edit",
+    title: "Template Editor",
+    loader: () => import('./components/EditorSubPage.esm.js').then((m) => /* @__PURE__ */ jsx(m.EditorSubPage, {}))
+  }
+});
+const scaffolderTemplatingExtensionsSubPage = SubPageBlueprint.make({
+  name: "templating-extensions",
+  params: {
+    path: "templating-extensions",
+    title: "Templating Extensions",
+    loader: () => Promise.all([
+      import('../components/TemplatingExtensionsPage/index.esm.js'),
+      import('@backstage/core-components')
+    ]).then(([m, { Content }]) => /* @__PURE__ */ jsx(Content, { children: /* @__PURE__ */ jsx(m.TemplatingExtensionsPageContent, { linkLocal: true }) }))
+  }
+});
 const scaffolderNavItem = NavItemBlueprint.make({
   params: {
     routeRef: rootRouteRef,
@@ -117,5 +158,5 @@ const scaffolderApi = ApiBlueprint.make({
   })
 });
 
-export { entityNamePickerFormField, entityPickerFormField, entityTagsPickerFormField, multiEntityPickerFormField, myGroupsPickerFormField, ownedEntityPickerFormField, ownerPickerFormField, repoBranchPickerFormField, repoOwnerPickerFormField, repoUrlPickerFormField, scaffolderApi, scaffolderNavItem, scaffolderPage };
+export { entityNamePickerFormField, entityPickerFormField, entityTagsPickerFormField, multiEntityPickerFormField, myGroupsPickerFormField, ownedEntityPickerFormField, ownerPickerFormField, repoBranchPickerFormField, repoOwnerPickerFormField, repoUrlPickerFormField, scaffolderActionsSubPage, scaffolderApi, scaffolderEditorSubPage, scaffolderNavItem, scaffolderPage, scaffolderTasksSubPage, scaffolderTemplatesSubPage, scaffolderTemplatingExtensionsSubPage };
 //# sourceMappingURL=extensions.esm.js.map

package/dist/alpha/extensions.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"extensions.esm.js","sources":["../../src/alpha/extensions.tsx"],"sourcesContent":["/*\n * Copyright 2023 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport {\n  ApiBlueprint,\n  createExtensionInput,\n  discoveryApiRef,\n  fetchApiRef,\n  identityApiRef,\n  NavItemBlueprint,\n  PageBlueprint,\n} from '@backstage/frontend-plugin-api';\nimport { rootRouteRef } from '../routes';\nimport CreateComponentIcon from '@material-ui/icons/AddCircleOutline';\nimport {\n  FormFieldBlueprint,\n  formFieldsApiRef,\n} from '@backstage/plugin-scaffolder-react/alpha';\nimport { scmIntegrationsApiRef } from '@backstage/integration-react';\nimport { scaffolderApiRef } from '@backstage/plugin-scaffolder-react';\nimport { ScaffolderClient } from '../api';\n\nexport const scaffolderPage = PageBlueprint.makeWithOverrides({\n  inputs: {\n    formFields: createExtensionInput([\n      FormFieldBlueprint.dataRefs.formFieldLoader,\n    ]),\n  },\n  factory(originalFactory, { apis, inputs }) {\n    const formFieldsApi = apis.get(formFieldsApiRef);\n\n    return originalFactory({\n      routeRef: rootRouteRef,\n      path: '/create',\n      loader: async () => {\n        // Merge form fields from the API with old-style direct attachments\n        const apiFormFields = (await formFieldsApi?.loadFormFields()) ?? [];\n        const formFieldLoaders = inputs.formFields.map(output =>\n          output.get(FormFieldBlueprint.dataRefs.formFieldLoader),\n        );\n\n        // Resolve direct attachments and combine with API form fields\n        const loadedFormFields = await Promise.all(\n          formFieldLoaders.map(loader => loader()),\n        );\n        const formFields = [...apiFormFields, ...loadedFormFields];\n\n        return import('../components/Router/Router').then(m => (\n          <m.InternalRouter formFields={formFields} />\n        ));\n      },\n    });\n  },\n});\n\nexport const scaffolderNavItem = NavItemBlueprint.make({\n  params: {\n    routeRef: rootRouteRef,\n    title: 'Create...',\n    icon: CreateComponentIcon,\n  },\n});\n\nexport const repoUrlPickerFormField = FormFieldBlueprint.make({\n  name: 'repo-url-picker',\n  params: {\n    field: () => import('./fields/RepoUrlPicker').then(m => m.RepoUrlPicker),\n  },\n});\n\nexport const entityNamePickerFormField = FormFieldBlueprint.make({\n  name: 'entity-name-picker',\n  params: {\n    field: () =>\n      import('./fields/EntityNamePicker').then(m => m.EntityNamePicker),\n  },\n});\n\nexport const entityPickerFormField = FormFieldBlueprint.make({\n  name: 'entity-picker',\n  params: {\n    field: () => import('./fields/EntityPicker').then(m => m.EntityPicker),\n  },\n});\n\nexport const ownerPickerFormField = FormFieldBlueprint.make({\n  name: 'owner-picker',\n  params: {\n    field: () => import('./fields/OwnerPicker').then(m => m.OwnerPicker),\n  },\n});\n\nexport const entityTagsPickerFormField = FormFieldBlueprint.make({\n  name: 'entity-tags-picker',\n  params: {\n    field: () =>\n      import('./fields/EntityTagsPicker').then(m => m.EntityTagsPicker),\n  },\n});\n\nexport const multiEntityPickerFormField = FormFieldBlueprint.make({\n  name: 'multi-entity-picker',\n  params: {\n    field: () =>\n      import('./fields/MultiEntityPicker').then(m => m.MultiEntityPicker),\n  },\n});\n\nexport const myGroupsPickerFormField = FormFieldBlueprint.make({\n  name: 'my-groups-picker',\n  params: {\n    field: () => import('./fields/MyGroupsPicker').then(m => m.MyGroupsPicker),\n  },\n});\n\nexport const ownedEntityPickerFormField = FormFieldBlueprint.make({\n  name: 'owned-entity-picker',\n  params: {\n    field: () =>\n      import('./fields/OwnedEntityPicker').then(m => m.OwnedEntityPicker),\n  },\n});\n\nexport const repoBranchPickerFormField = FormFieldBlueprint.make({\n  name: 'repo-branch-picker',\n  params: {\n    field: () =>\n      import('./fields/RepoBranchPicker').then(m => m.RepoBranchPicker),\n  },\n});\n\nexport const repoOwnerPickerFormField = FormFieldBlueprint.make({\n  name: 'repo-owner-picker',\n  params: {\n    field: () =>\n      import('./fields/RepoOwnerPicker').then(m => m.RepoOwnerPicker),\n  },\n});\n\nexport const scaffolderApi = ApiBlueprint.make({\n  params: defineParams =>\n    defineParams({\n      api: scaffolderApiRef,\n      deps: {\n        discoveryApi: discoveryApiRef,\n        scmIntegrationsApi: scmIntegrationsApiRef,\n        fetchApi: fetchApiRef,\n        identityApi: identityApiRef,\n      },\n      factory: ({ discoveryApi, scmIntegrationsApi, fetchApi, identityApi }) =>\n        new ScaffolderClient({\n          discoveryApi,\n          scmIntegrationsApi,\n          fetchApi,\n          identityApi,\n        }),\n    }),\n});\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"extensions.esm.js","sources":["../../src/alpha/extensions.tsx"],"sourcesContent":["/*\n * Copyright 2023 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport {\n  ApiBlueprint,\n  createExtensionInput,\n  discoveryApiRef,\n  fetchApiRef,\n  identityApiRef,\n  NavItemBlueprint,\n  PageBlueprint,\n  SubPageBlueprint,\n} from '@backstage/frontend-plugin-api';\nimport { rootRouteRef } from '../routes';\nimport CreateComponentIcon from '@material-ui/icons/AddCircleOutline';\nimport {\n  FormFieldBlueprint,\n  formFieldsApiRef,\n} from '@backstage/plugin-scaffolder-react/alpha';\nimport { scmIntegrationsApiRef } from '@backstage/integration-react';\nimport { scaffolderApiRef } from '@backstage/plugin-scaffolder-react';\nimport { ScaffolderClient } from '../api';\n\nexport const scaffolderPage = PageBlueprint.makeWithOverrides({\n  inputs: {\n    formFields: createExtensionInput([\n      FormFieldBlueprint.dataRefs.formFieldLoader,\n    ]),\n  },\n  factory(originalFactory) {\n    return originalFactory({\n      routeRef: rootRouteRef,\n      path: '/create',\n      title: 'Create',\n    });\n  },\n});\n\nexport const scaffolderTemplatesSubPage = SubPageBlueprint.makeWithOverrides({\n  name: 'templates',\n  factory(originalFactory, { apis }) {\n    const formFieldsApi = apis.get(formFieldsApiRef);\n\n    return originalFactory({\n      path: 'templates',\n      title: 'Templates',\n      loader: async () => {\n        const formFields = (await formFieldsApi?.loadFormFields()) ?? [];\n\n        return import('./components/TemplatesSubPage').then(m => (\n          <m.TemplatesSubPage formFields={formFields} />\n        ));\n      },\n    });\n  },\n});\n\nexport const scaffolderTasksSubPage = SubPageBlueprint.make({\n  name: 'tasks',\n  params: {\n    path: 'tasks',\n    title: 'Tasks',\n    loader: () =>\n      import('./components/TasksSubPage').then(m => <m.TasksSubPage />),\n  },\n});\n\nexport const scaffolderActionsSubPage = SubPageBlueprint.make({\n  name: 'actions',\n  params: {\n    path: 'actions',\n    title: 'Actions',\n    loader: () =>\n      Promise.all([\n        import('../components/ActionsPage'),\n        import('@backstage/core-components'),\n      ]).then(([m, { Content }]) => (\n        <Content>\n          <m.ActionPageContent />\n        </Content>\n      )),\n  },\n});\n\nexport const scaffolderEditorSubPage = SubPageBlueprint.make({\n  name: 'editor',\n  params: {\n    path: 'edit',\n    title: 'Template Editor',\n    loader: () =>\n      import('./components/EditorSubPage').then(m => <m.EditorSubPage />),\n  },\n});\n\nexport const scaffolderTemplatingExtensionsSubPage = SubPageBlueprint.make({\n  name: 'templating-extensions',\n  params: {\n    path: 'templating-extensions',\n    title: 'Templating Extensions',\n    loader: () =>\n      Promise.all([\n        import('../components/TemplatingExtensionsPage'),\n        import('@backstage/core-components'),\n      ]).then(([m, { Content }]) => (\n        <Content>\n          <m.TemplatingExtensionsPageContent linkLocal />\n        </Content>\n      )),\n  },\n});\n\nexport const scaffolderNavItem = NavItemBlueprint.make({\n  params: {\n    routeRef: rootRouteRef,\n    title: 'Create...',\n    icon: CreateComponentIcon,\n  },\n});\n\nexport const repoUrlPickerFormField = FormFieldBlueprint.make({\n  name: 'repo-url-picker',\n  params: {\n    field: () => import('./fields/RepoUrlPicker').then(m => m.RepoUrlPicker),\n  },\n});\n\nexport const entityNamePickerFormField = FormFieldBlueprint.make({\n  name: 'entity-name-picker',\n  params: {\n    field: () =>\n      import('./fields/EntityNamePicker').then(m => m.EntityNamePicker),\n  },\n});\n\nexport const entityPickerFormField = FormFieldBlueprint.make({\n  name: 'entity-picker',\n  params: {\n    field: () => import('./fields/EntityPicker').then(m => m.EntityPicker),\n  },\n});\n\nexport const ownerPickerFormField = FormFieldBlueprint.make({\n  name: 'owner-picker',\n  params: {\n    field: () => import('./fields/OwnerPicker').then(m => m.OwnerPicker),\n  },\n});\n\nexport const entityTagsPickerFormField = FormFieldBlueprint.make({\n  name: 'entity-tags-picker',\n  params: {\n    field: () =>\n      import('./fields/EntityTagsPicker').then(m => m.EntityTagsPicker),\n  },\n});\n\nexport const multiEntityPickerFormField = FormFieldBlueprint.make({\n  name: 'multi-entity-picker',\n  params: {\n    field: () =>\n      import('./fields/MultiEntityPicker').then(m => m.MultiEntityPicker),\n  },\n});\n\nexport const myGroupsPickerFormField = FormFieldBlueprint.make({\n  name: 'my-groups-picker',\n  params: {\n    field: () => import('./fields/MyGroupsPicker').then(m => m.MyGroupsPicker),\n  },\n});\n\nexport const ownedEntityPickerFormField = FormFieldBlueprint.make({\n  name: 'owned-entity-picker',\n  params: {\n    field: () =>\n      import('./fields/OwnedEntityPicker').then(m => m.OwnedEntityPicker),\n  },\n});\n\nexport const repoBranchPickerFormField = FormFieldBlueprint.make({\n  name: 'repo-branch-picker',\n  params: {\n    field: () =>\n      import('./fields/RepoBranchPicker').then(m => m.RepoBranchPicker),\n  },\n});\n\nexport const repoOwnerPickerFormField = FormFieldBlueprint.make({\n  name: 'repo-owner-picker',\n  params: {\n    field: () =>\n      import('./fields/RepoOwnerPicker').then(m => m.RepoOwnerPicker),\n  },\n});\n\nexport const scaffolderApi = ApiBlueprint.make({\n  params: defineParams =>\n    defineParams({\n      api: scaffolderApiRef,\n      deps: {\n        discoveryApi: discoveryApiRef,\n        scmIntegrationsApi: scmIntegrationsApiRef,\n        fetchApi: fetchApiRef,\n        identityApi: identityApiRef,\n      },\n      factory: ({ discoveryApi, scmIntegrationsApi, fetchApi, identityApi }) =>\n        new ScaffolderClient({\n          discoveryApi,\n          scmIntegrationsApi,\n          fetchApi,\n          identityApi,\n        }),\n    }),\n});\n"],"names":[],"mappings":"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"}

package/dist/alpha/formFieldsApi.esm.js

@@ -1,4 +1,4 @@
-import { ApiBlueprint, createExtensionInput } from '@backstage/frontend-plugin-api';
+import { ApiBlueprint, createExtensionInput, appTreeApiRef } from '@backstage/frontend-plugin-api';
 import { FormFieldBlueprint, formFieldsApiRef } from '@backstage/plugin-scaffolder-react/alpha';
 export { formFieldsApiRef } from '@backstage/plugin-scaffolder-react/alpha';
 import { OpaqueFormField } from '../packages/scaffolder-internal/src/wiring/InternalFormField.esm.js';
@@ -18,22 +18,39 @@ const formFieldsApi = ApiBlueprint.makeWithOverrides({
     return originalFactory(
       (defineParams) => defineParams({
         api: formFieldsApiRef,
-        deps: {},
-        factory: () => ({
+        deps: { appTreeApi: appTreeApiRef },
+        factory: ({ appTreeApi }) => ({
           async loadFormFields() {
+            const pageFormFieldLoaders = getPageFormFieldLoaders(appTreeApi);
             const formFields = await Promise.all(
-              formFieldLoaders.map((loader) => loader())
+              [...formFieldLoaders, ...pageFormFieldLoaders].map(
+                (loader) => loader()
+              )
             );
-            const internalFormFields = formFields.map(
-              OpaqueFormField.toInternal
-            );
-            return internalFormFields;
+            return formFields.map(OpaqueFormField.toInternal);
           }
         })
       })
     );
   }
 });
+function getPageFormFieldLoaders(appTreeApi) {
+  const { tree } = appTreeApi.getTree();
+  const pageNode = tree.nodes.get("page:scaffolder");
+  if (!pageNode?.instance) {
+    return [];
+  }
+  const formFieldNodes = pageNode.edges.attachments.get("formFields") ?? [];
+  return formFieldNodes.flatMap((node) => {
+    if (!node.instance) {
+      return [];
+    }
+    const loader = node.instance.getData(
+      FormFieldBlueprint.dataRefs.formFieldLoader
+    );
+    return loader ? [loader] : [];
+  });
+}
 
 export { formFieldsApi };
 //# sourceMappingURL=formFieldsApi.esm.js.map

package/dist/alpha/formFieldsApi.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"formFieldsApi.esm.js","sources":["../../src/alpha/formFieldsApi.ts"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport {\n  ApiBlueprint,\n  createExtensionInput,\n} from '@backstage/frontend-plugin-api';\nimport {\n  FormFieldBlueprint,\n  formFieldsApiRef,\n} from '@backstage/plugin-scaffolder-react/alpha';\nimport { OpaqueFormField } from '@internal/scaffolder';\n\nexport const formFieldsApi = ApiBlueprint.makeWithOverrides({\n  name: 'form-fields',\n  inputs: {\n    formFields: createExtensionInput([\n      FormFieldBlueprint.dataRefs.formFieldLoader,\n    ]),\n  },\n  factory(originalFactory, { inputs }) {\n    const formFieldLoaders = inputs.formFields.map(e =>\n      e.get(FormFieldBlueprint.dataRefs.formFieldLoader),\n    );\n\n    return originalFactory(defineParams =>\n      defineParams({\n        api: formFieldsApiRef,\n        deps: {},\n        factory: () => ({\n          async loadFormFields() {\n            const formFields = await Promise.all(\n              formFieldLoaders.map(loader => loader()),\n            );\n\n            const internalFormFields = formFields.map(\n              OpaqueFormField.toInternal,\n            );\n\n            return internalFormFields;\n          },\n        }),\n      }),\n    );\n  },\n});\n\nexport {\n  formFieldsApiRef,\n  type ScaffolderFormFieldsApi,\n} from '@backstage/plugin-scaffolder-react/alpha';\n"],"names":[],"mappings":";;;;;;AA0BO,MAAM,aAAA,GAAgB,aAAa,iBAAA,CAAkB;AAAA,EAC1D,IAAA,EAAM,aAAA;AAAA,EACN,MAAA,EAAQ;AAAA,IACN,YAAY,oBAAA,CAAqB;AAAA,MAC/B,mBAAmB,QAAA,CAAS;AAAA,KAC7B;AAAA,GACH;AAAA,EACA,OAAA,CAAQ,eAAA,EAAiB,EAAE,MAAA,EAAO,EAAG;AACnC,IAAA,MAAM,gBAAA,GAAmB,OAAO,UAAA,CAAW,GAAA;AAAA,MAAI,CAAA,CAAA,KAC7C,CAAA,CAAE,GAAA,CAAI,kBAAA,CAAmB,SAAS,eAAe;AAAA,KACnD;AAEA,IAAA,OAAO,eAAA;AAAA,MAAgB,kBACrB,YAAA,CAAa;AAAA,QACX,GAAA,EAAK,gBAAA;AAAA,QACL,MAAM,EAAC;AAAA,QACP,SAAS,OAAO;AAAA,UACd,MAAM,cAAA,GAAiB;AACrB,YAAA,MAAM,UAAA,GAAa,MAAM,OAAA,CAAQ,GAAA;AAAA,cAC/B,gBAAA,CAAiB,GAAA,CAAI,CAAA,MAAA,KAAU,MAAA,EAAQ;AAAA,aACzC;AAEA,YAAA,MAAM,qBAAqB,UAAA,CAAW,GAAA;AAAA,cACpC,eAAA,CAAgB;AAAA,aAClB;AAEA,YAAA,OAAO,kBAAA;AAAA,UACT;AAAA,SACF;AAAA,OACD;AAAA,KACH;AAAA,EACF;AACF,CAAC;;;;"}
+{"version":3,"file":"formFieldsApi.esm.js","sources":["../../src/alpha/formFieldsApi.ts"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport {\n  ApiBlueprint,\n  appTreeApiRef,\n  createExtensionInput,\n} from '@backstage/frontend-plugin-api';\nimport {\n  FormFieldBlueprint,\n  formFieldsApiRef,\n} from '@backstage/plugin-scaffolder-react/alpha';\nimport { OpaqueFormField } from '@internal/scaffolder';\n\nexport const formFieldsApi = ApiBlueprint.makeWithOverrides({\n  name: 'form-fields',\n  inputs: {\n    formFields: createExtensionInput([\n      FormFieldBlueprint.dataRefs.formFieldLoader,\n    ]),\n  },\n  factory(originalFactory, { inputs }) {\n    const formFieldLoaders = inputs.formFields.map(e =>\n      e.get(FormFieldBlueprint.dataRefs.formFieldLoader),\n    );\n\n    return originalFactory(defineParams =>\n      defineParams({\n        api: formFieldsApiRef,\n        deps: { appTreeApi: appTreeApiRef },\n        factory: ({ appTreeApi }) => ({\n          async loadFormFields() {\n            const pageFormFieldLoaders = getPageFormFieldLoaders(appTreeApi);\n\n            const formFields = await Promise.all(\n              [...formFieldLoaders, ...pageFormFieldLoaders].map(loader =>\n                loader(),\n              ),\n            );\n\n            return formFields.map(OpaqueFormField.toInternal);\n          },\n        }),\n      }),\n    );\n  },\n});\n\nfunction getPageFormFieldLoaders(appTreeApi: typeof appTreeApiRef.T) {\n  const { tree } = appTreeApi.getTree();\n  const pageNode = tree.nodes.get('page:scaffolder');\n  if (!pageNode?.instance) {\n    return [];\n  }\n  const formFieldNodes = pageNode.edges.attachments.get('formFields') ?? [];\n  return formFieldNodes.flatMap(node => {\n    if (!node.instance) {\n      return [];\n    }\n    const loader = node.instance.getData(\n      FormFieldBlueprint.dataRefs.formFieldLoader,\n    );\n    return loader ? [loader] : [];\n  });\n}\n\nexport {\n  formFieldsApiRef,\n  type ScaffolderFormFieldsApi,\n} from '@backstage/plugin-scaffolder-react/alpha';\n"],"names":[],"mappings":";;;;;;AA2BO,MAAM,aAAA,GAAgB,aAAa,iBAAA,CAAkB;AAAA,EAC1D,IAAA,EAAM,aAAA;AAAA,EACN,MAAA,EAAQ;AAAA,IACN,YAAY,oBAAA,CAAqB;AAAA,MAC/B,mBAAmB,QAAA,CAAS;AAAA,KAC7B;AAAA,GACH;AAAA,EACA,OAAA,CAAQ,eAAA,EAAiB,EAAE,MAAA,EAAO,EAAG;AACnC,IAAA,MAAM,gBAAA,GAAmB,OAAO,UAAA,CAAW,GAAA;AAAA,MAAI,CAAA,CAAA,KAC7C,CAAA,CAAE,GAAA,CAAI,kBAAA,CAAmB,SAAS,eAAe;AAAA,KACnD;AAEA,IAAA,OAAO,eAAA;AAAA,MAAgB,kBACrB,YAAA,CAAa;AAAA,QACX,GAAA,EAAK,gBAAA;AAAA,QACL,IAAA,EAAM,EAAE,UAAA,EAAY,aAAA,EAAc;AAAA,QAClC,OAAA,EAAS,CAAC,EAAE,UAAA,EAAW,MAAO;AAAA,UAC5B,MAAM,cAAA,GAAiB;AACrB,YAAA,MAAM,oBAAA,GAAuB,wBAAwB,UAAU,CAAA;AAE/D,YAAA,MAAM,UAAA,GAAa,MAAM,OAAA,CAAQ,GAAA;AAAA,cAC/B,CAAC,GAAG,gBAAA,EAAkB,GAAG,oBAAoB,CAAA,CAAE,GAAA;AAAA,gBAAI,YACjD,MAAA;AAAO;AACT,aACF;AAEA,YAAA,OAAO,UAAA,CAAW,GAAA,CAAI,eAAA,CAAgB,UAAU,CAAA;AAAA,UAClD;AAAA,SACF;AAAA,OACD;AAAA,KACH;AAAA,EACF;AACF,CAAC;AAED,SAAS,wBAAwB,UAAA,EAAoC;AACnE,EAAA,MAAM,EAAE,IAAA,EAAK,GAAI,UAAA,CAAW,OAAA,EAAQ;AACpC,EAAA,MAAM,QAAA,GAAW,IAAA,CAAK,KAAA,CAAM,GAAA,CAAI,iBAAiB,CAAA;AACjD,EAAA,IAAI,CAAC,UAAU,QAAA,EAAU;AACvB,IAAA,OAAO,EAAC;AAAA,EACV;AACA,EAAA,MAAM,iBAAiB,QAAA,CAAS,KAAA,CAAM,YAAY,GAAA,CAAI,YAAY,KAAK,EAAC;AACxE,EAAA,OAAO,cAAA,CAAe,QAAQ,CAAA,IAAA,KAAQ;AACpC,IAAA,IAAI,CAAC,KAAK,QAAA,EAAU;AAClB,MAAA,OAAO,EAAC;AAAA,IACV;AACA,IAAA,MAAM,MAAA,GAAS,KAAK,QAAA,CAAS,OAAA;AAAA,MAC3B,mBAAmB,QAAA,CAAS;AAAA,KAC9B;AACA,IAAA,OAAO,MAAA,GAAS,CAAC,MAAM,CAAA,GAAI,EAAC;AAAA,EAC9B,CAAC,CAAA;AACH;;;;"}