@backstage/plugin-scaffolder-react 1.11.0-next.3 → 1.12.0-next.0

package/CHANGELOG.md

@@ -1,5 +1,56 @@
 # @backstage/plugin-scaffolder-react
 
+## 1.12.0-next.0
+
+### Minor Changes
+
+- 4512f71: Add `ui:backstage.review.name` option for custom item names on scaffolder review page, and also add support for rendering the `title` property instead of the key name.
+
+### Patch Changes
+
+- 3ebb64f: - Fix secret widget field not displaying as required.
+  - Fix secret widget not able to be required inside nested objects.
+  - Fix secret widget not able to be disabled.
+  - Support `minLength` and `maxLength` properties for secret widget.
+- 8dd6ef6: Fix an issue where keys with duplicate final key parts are not all displayed in the `ReviewState`. Change the way the keys are formatted to include the full schema path, separated by `>`.
+- 9a0672a: Scaffolder review page shows static amount of asterisks for secret fields.
+- Updated dependencies
+  - @backstage/plugin-catalog-react@1.12.4-next.0
+  - @backstage/catalog-client@1.6.6
+  - @backstage/catalog-model@1.6.0
+  - @backstage/core-components@0.14.10
+  - @backstage/core-plugin-api@1.9.3
+  - @backstage/theme@0.5.6
+  - @backstage/types@1.1.1
+  - @backstage/version-bridge@1.0.8
+  - @backstage/plugin-permission-react@0.4.25
+  - @backstage/plugin-scaffolder-common@1.5.5
+
+## 1.11.0
+
+### Minor Changes
+
+- 8839381: Add scaffolder option to display object items in separate rows on review page
+
+### Patch Changes
+
+- 072c00c: Fixed a bug in `DefaultTableOutputs` where output elements overlapped on smaller screen sizes
+- 46e5e55: Change scaffolder widgets to use `TextField` component for more flexibility in theme overrides.
+- d0e95a7: Add ability to customise form fields in the UI by exposing `uiSchema` and `formContext` in `FormProps`
+- 4670f06: support `ajv-errors` for scaffolder validation to allow for customizing the error messages
+- 04759f2: Fix null check in `isJsonObject` utility function for scaffolder review state component
+- Updated dependencies
+  - @backstage/plugin-catalog-react@1.12.3
+  - @backstage/core-components@0.14.10
+  - @backstage/catalog-model@1.6.0
+  - @backstage/catalog-client@1.6.6
+  - @backstage/core-plugin-api@1.9.3
+  - @backstage/theme@0.5.6
+  - @backstage/types@1.1.1
+  - @backstage/version-bridge@1.0.8
+  - @backstage/plugin-permission-react@0.4.25
+  - @backstage/plugin-scaffolder-common@1.5.5
+
 ## 1.11.0-next.3
 
 ### Patch Changes

package/alpha/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@backstage/plugin-scaffolder-react__alpha",
-  "version": "1.11.0-next.3",
+  "version": "1.12.0-next.0",
   "main": "../dist/alpha.esm.js",
   "module": "../dist/alpha.esm.js",
   "types": "../dist/alpha.d.ts"

package/dist/alpha.d.ts

@@ -264,7 +264,7 @@ declare const ScaffolderField: (props: PropsWithChildren<ScaffolderFieldProps>)
  * Secret Widget for overriding the default password input widget
  * @alpha
  */
-declare const SecretWidget: (props: Pick<WidgetProps, 'name' | 'onChange' | 'schema'>) => React__default.JSX.Element;
+declare const SecretWidget: (props: Pick<WidgetProps, 'name' | 'onChange' | 'schema' | 'required' | 'disabled'>) => React__default.JSX.Element;
 
 /**
  * Takes a step from a Backstage Template Manifest and converts it to a JSON Schema and UI Schema for rjsf

package/dist/next/components/PasswordWidget/PasswordWidget.esm.js

@@ -1,5 +1,4 @@
-import InputLabel from '@material-ui/core/InputLabel';
-import Input from '@material-ui/core/Input';
+import TextField from '@material-ui/core/TextField';
 import React from 'react';
 import FormHelperText from '@material-ui/core/FormHelperText';
 import { MarkdownContent } from '@backstage/core-components';
@@ -10,10 +9,11 @@ const PasswordWidget = (props) => {
     onChange,
     schema: { title }
   } = props;
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(InputLabel, { htmlFor: title }, title), /* @__PURE__ */ React.createElement(
-    Input,
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
+    TextField,
     {
       id: title,
+      label: title,
       "aria-describedby": title,
       onChange: (e) => {
         onChange(e.target.value);

package/dist/next/components/PasswordWidget/PasswordWidget.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"PasswordWidget.esm.js","sources":["../../../../src/next/components/PasswordWidget/PasswordWidget.tsx"],"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 { WidgetProps } from '@rjsf/utils';\nimport InputLabel from '@material-ui/core/InputLabel';\nimport Input from '@material-ui/core/Input';\nimport React from 'react';\nimport FormHelperText from '@material-ui/core/FormHelperText';\nimport { MarkdownContent } from '@backstage/core-components';\n\nexport const PasswordWidget = (\n  props: Pick<WidgetProps, 'onChange' | 'schema' | 'value'>,\n) => {\n  const {\n    value,\n    onChange,\n    schema: { title },\n  } = props;\n\n  return (\n    <>\n      <InputLabel htmlFor={title}>{title}</InputLabel>\n      <Input\n        id={title}\n        aria-describedby={title}\n        onChange={e => {\n          onChange(e.target.value);\n        }}\n        value={value}\n        autoComplete=\"off\"\n      />\n      <FormHelperText error>\n        <MarkdownContent\n          content=\"This widget is insecure. Please use [`ui:field: Secret`](https://backstage.io/docs/features/software-templates/writing-templates/#using-secrets) instead of\n          `ui:widget: password`\"\n        />\n      </FormHelperText>\n    </>\n  );\n};\n"],"names":[],"mappings":";;;;;;AAuBa,MAAA,cAAA,GAAiB,CAC5B,KACG,KAAA;AACH,EAAM,MAAA;AAAA,IACJ,KAAA;AAAA,IACA,QAAA;AAAA,IACA,MAAA,EAAQ,EAAE,KAAM,EAAA;AAAA,GACd,GAAA,KAAA,CAAA;AAEJ,EAAA,iFAEK,KAAA,CAAA,aAAA,CAAA,UAAA,EAAA,EAAW,OAAS,EAAA,KAAA,EAAA,EAAQ,KAAM,CACnC,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,EAAI,EAAA,KAAA;AAAA,MACJ,kBAAkB,EAAA,KAAA;AAAA,MAClB,UAAU,CAAK,CAAA,KAAA;AACb,QAAS,QAAA,CAAA,CAAA,CAAE,OAAO,KAAK,CAAA,CAAA;AAAA,OACzB;AAAA,MACA,KAAA;AAAA,MACA,YAAa,EAAA,KAAA;AAAA,KAAA;AAAA,GAEf,kBAAA,KAAA,CAAA,aAAA,CAAC,cAAe,EAAA,EAAA,KAAA,EAAK,IACnB,EAAA,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,eAAA;AAAA,IAAA;AAAA,MACC,OAAQ,EAAA,8LAAA;AAAA,KAAA;AAAA,GAGZ,CACF,CAAA,CAAA;AAEJ;;;;"}
+{"version":3,"file":"PasswordWidget.esm.js","sources":["../../../../src/next/components/PasswordWidget/PasswordWidget.tsx"],"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 { WidgetProps } from '@rjsf/utils';\nimport TextField from '@material-ui/core/TextField';\nimport React from 'react';\nimport FormHelperText from '@material-ui/core/FormHelperText';\nimport { MarkdownContent } from '@backstage/core-components';\n\nexport const PasswordWidget = (\n  props: Pick<WidgetProps, 'onChange' | 'schema' | 'value'>,\n) => {\n  const {\n    value,\n    onChange,\n    schema: { title },\n  } = props;\n\n  return (\n    <>\n      <TextField\n        id={title}\n        label={title}\n        aria-describedby={title}\n        onChange={e => {\n          onChange(e.target.value);\n        }}\n        value={value}\n        autoComplete=\"off\"\n      />\n      <FormHelperText error>\n        <MarkdownContent\n          content=\"This widget is insecure. Please use [`ui:field: Secret`](https://backstage.io/docs/features/software-templates/writing-templates/#using-secrets) instead of\n          `ui:widget: password`\"\n        />\n      </FormHelperText>\n    </>\n  );\n};\n"],"names":[],"mappings":";;;;;AAsBa,MAAA,cAAA,GAAiB,CAC5B,KACG,KAAA;AACH,EAAM,MAAA;AAAA,IACJ,KAAA;AAAA,IACA,QAAA;AAAA,IACA,MAAA,EAAQ,EAAE,KAAM,EAAA;AAAA,GACd,GAAA,KAAA,CAAA;AAEJ,EAAA,uBAEI,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,QAAA,EAAA,IAAA,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,SAAA;AAAA,IAAA;AAAA,MACC,EAAI,EAAA,KAAA;AAAA,MACJ,KAAO,EAAA,KAAA;AAAA,MACP,kBAAkB,EAAA,KAAA;AAAA,MAClB,UAAU,CAAK,CAAA,KAAA;AACb,QAAS,QAAA,CAAA,CAAA,CAAE,OAAO,KAAK,CAAA,CAAA;AAAA,OACzB;AAAA,MACA,KAAA;AAAA,MACA,YAAa,EAAA,KAAA;AAAA,KAAA;AAAA,GAEf,kBAAA,KAAA,CAAA,aAAA,CAAC,cAAe,EAAA,EAAA,KAAA,EAAK,IACnB,EAAA,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,eAAA;AAAA,IAAA;AAAA,MACC,OAAQ,EAAA,8LAAA;AAAA,KAAA;AAAA,GAGZ,CACF,CAAA,CAAA;AAEJ;;;;"}

package/dist/next/components/ReviewState/ReviewState.esm.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { StructuredMetadataTable } from '@backstage/core-components';
 import { Draft07 } from 'json-schema-library';
-import { getLastKey, isJsonObject } from './util.esm.js';
+import { isJsonObject, formatKey } from './util.esm.js';
 
 function processSchema(key, value, schema, formState) {
   const parsedSchema = new Draft07(schema.mergedSchema);
@@ -9,23 +9,24 @@ function processSchema(key, value, schema, formState) {
     pointer: `#/${key}`,
     data: formState
   });
+  const name = definitionInSchema?.["ui:backstage"]?.review?.name ?? definitionInSchema?.title ?? key;
   if (definitionInSchema) {
     const backstageReviewOptions = definitionInSchema["ui:backstage"]?.review;
     if (backstageReviewOptions) {
       if (backstageReviewOptions.mask) {
-        return [[getLastKey(key), backstageReviewOptions.mask]];
+        return [[name, backstageReviewOptions.mask]];
       }
       if (backstageReviewOptions.show === false) {
         return [];
       }
     }
-    if (definitionInSchema["ui:widget"] === "password") {
-      return [[getLastKey(key), "******"]];
+    if (definitionInSchema["ui:widget"] === "password" || definitionInSchema["ui:field"]?.toLocaleLowerCase("en-us") === "secret") {
+      return [[name, "******"]];
     }
     if (definitionInSchema.enum && definitionInSchema.enumNames) {
       return [
         [
-          getLastKey(key),
+          name,
           definitionInSchema.enumNames[definitionInSchema.enum.indexOf(value)] || value
         ]
       ];
@@ -36,7 +37,7 @@ function processSchema(key, value, schema, formState) {
       );
     }
   }
-  return [[getLastKey(key), value]];
+  return [[name, value]];
 }
 const ReviewState = (props) => {
   const reviewData = Object.fromEntries(
@@ -47,7 +48,10 @@ const ReviewState = (props) => {
       return [[key, value]];
     }).filter((prop) => prop.length > 0)
   );
-  return /* @__PURE__ */ React.createElement(StructuredMetadataTable, { metadata: reviewData });
+  const options = {
+    titleFormat: formatKey
+  };
+  return /* @__PURE__ */ React.createElement(StructuredMetadataTable, { metadata: reviewData, options });
 };
 
 export { ReviewState };

package/dist/next/components/ReviewState/ReviewState.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"ReviewState.esm.js","sources":["../../../../src/next/components/ReviewState/ReviewState.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 React from 'react';\nimport { StructuredMetadataTable } from '@backstage/core-components';\nimport { JsonObject, JsonValue } from '@backstage/types';\nimport { Draft07 as JSONSchema } from 'json-schema-library';\nimport { ParsedTemplateSchema } from '../../hooks/useTemplateSchema';\nimport { isJsonObject, getLastKey } from './util';\n\n/**\n * The props for the {@link ReviewState} component.\n * @alpha\n */\nexport type ReviewStateProps = {\n  schemas: ParsedTemplateSchema[];\n  formState: JsonObject;\n};\n\nfunction processSchema(\n  key: string,\n  value: JsonValue | undefined,\n  schema: ParsedTemplateSchema,\n  formState: JsonObject,\n): [string, JsonValue | undefined][] {\n  const parsedSchema = new JSONSchema(schema.mergedSchema);\n  const definitionInSchema = parsedSchema.getSchema({\n    pointer: `#/${key}`,\n    data: formState,\n  });\n\n  if (definitionInSchema) {\n    const backstageReviewOptions = definitionInSchema['ui:backstage']?.review;\n    if (backstageReviewOptions) {\n      if (backstageReviewOptions.mask) {\n        return [[getLastKey(key), backstageReviewOptions.mask]];\n      }\n      if (backstageReviewOptions.show === false) {\n        return [];\n      }\n    }\n\n    if (definitionInSchema['ui:widget'] === 'password') {\n      return [[getLastKey(key), '******']];\n    }\n\n    if (definitionInSchema.enum && definitionInSchema.enumNames) {\n      return [\n        [\n          getLastKey(key),\n          definitionInSchema.enumNames[\n            definitionInSchema.enum.indexOf(value)\n          ] || value,\n        ],\n      ];\n    }\n\n    if (backstageReviewOptions?.explode !== false && isJsonObject(value)) {\n      // Recurse nested objects\n      return Object.entries(value).flatMap(([nestedKey, nestedValue]) =>\n        processSchema(`${key}/${nestedKey}`, nestedValue, schema, formState),\n      );\n    }\n  }\n\n  return [[getLastKey(key), value]];\n}\n\n/**\n * The component used by the {@link Stepper} to render the review step.\n * @alpha\n */\nexport const ReviewState = (props: ReviewStateProps) => {\n  const reviewData = Object.fromEntries(\n    Object.entries(props.formState)\n      .flatMap(([key, value]) => {\n        for (const step of props.schemas) {\n          return processSchema(key, value, step, props.formState);\n        }\n        return [[key, value]];\n      })\n      .filter(prop => prop.length > 0),\n  );\n  return <StructuredMetadataTable metadata={reviewData} />;\n};\n"],"names":["JSONSchema"],"mappings":";;;;;AA+BA,SAAS,aACP,CAAA,GAAA,EACA,KACA,EAAA,MAAA,EACA,SACmC,EAAA;AACnC,EAAA,MAAM,YAAe,GAAA,IAAIA,OAAW,CAAA,MAAA,CAAO,YAAY,CAAA,CAAA;AACvD,EAAM,MAAA,kBAAA,GAAqB,aAAa,SAAU,CAAA;AAAA,IAChD,OAAA,EAAS,KAAK,GAAG,CAAA,CAAA;AAAA,IACjB,IAAM,EAAA,SAAA;AAAA,GACP,CAAA,CAAA;AAED,EAAA,IAAI,kBAAoB,EAAA;AACtB,IAAM,MAAA,sBAAA,GAAyB,kBAAmB,CAAA,cAAc,CAAG,EAAA,MAAA,CAAA;AACnE,IAAA,IAAI,sBAAwB,EAAA;AAC1B,MAAA,IAAI,uBAAuB,IAAM,EAAA;AAC/B,QAAA,OAAO,CAAC,CAAC,UAAA,CAAW,GAAG,CAAG,EAAA,sBAAA,CAAuB,IAAI,CAAC,CAAA,CAAA;AAAA,OACxD;AACA,MAAI,IAAA,sBAAA,CAAuB,SAAS,KAAO,EAAA;AACzC,QAAA,OAAO,EAAC,CAAA;AAAA,OACV;AAAA,KACF;AAEA,IAAI,IAAA,kBAAA,CAAmB,WAAW,CAAA,KAAM,UAAY,EAAA;AAClD,MAAA,OAAO,CAAC,CAAC,UAAA,CAAW,GAAG,CAAA,EAAG,QAAQ,CAAC,CAAA,CAAA;AAAA,KACrC;AAEA,IAAI,IAAA,kBAAA,CAAmB,IAAQ,IAAA,kBAAA,CAAmB,SAAW,EAAA;AAC3D,MAAO,OAAA;AAAA,QACL;AAAA,UACE,WAAW,GAAG,CAAA;AAAA,UACd,mBAAmB,SACjB,CAAA,kBAAA,CAAmB,KAAK,OAAQ,CAAA,KAAK,CACvC,CAAK,IAAA,KAAA;AAAA,SACP;AAAA,OACF,CAAA;AAAA,KACF;AAEA,IAAA,IAAI,sBAAwB,EAAA,OAAA,KAAY,KAAS,IAAA,YAAA,CAAa,KAAK,CAAG,EAAA;AAEpE,MAAO,OAAA,MAAA,CAAO,OAAQ,CAAA,KAAK,CAAE,CAAA,OAAA;AAAA,QAAQ,CAAC,CAAC,SAAW,EAAA,WAAW,CAC3D,KAAA,aAAA,CAAc,CAAG,EAAA,GAAG,CAAI,CAAA,EAAA,SAAS,CAAI,CAAA,EAAA,WAAA,EAAa,QAAQ,SAAS,CAAA;AAAA,OACrE,CAAA;AAAA,KACF;AAAA,GACF;AAEA,EAAA,OAAO,CAAC,CAAC,UAAA,CAAW,GAAG,CAAA,EAAG,KAAK,CAAC,CAAA,CAAA;AAClC,CAAA;AAMa,MAAA,WAAA,GAAc,CAAC,KAA4B,KAAA;AACtD,EAAA,MAAM,aAAa,MAAO,CAAA,WAAA;AAAA,IACxB,MAAA,CAAO,OAAQ,CAAA,KAAA,CAAM,SAAS,CAAA,CAC3B,QAAQ,CAAC,CAAC,GAAK,EAAA,KAAK,CAAM,KAAA;AACzB,MAAW,KAAA,MAAA,IAAA,IAAQ,MAAM,OAAS,EAAA;AAChC,QAAA,OAAO,aAAc,CAAA,GAAA,EAAK,KAAO,EAAA,IAAA,EAAM,MAAM,SAAS,CAAA,CAAA;AAAA,OACxD;AACA,MAAA,OAAO,CAAC,CAAC,GAAK,EAAA,KAAK,CAAC,CAAA,CAAA;AAAA,KACrB,CACA,CAAA,MAAA,CAAO,CAAQ,IAAA,KAAA,IAAA,CAAK,SAAS,CAAC,CAAA;AAAA,GACnC,CAAA;AACA,EAAO,uBAAA,KAAA,CAAA,aAAA,CAAC,uBAAwB,EAAA,EAAA,QAAA,EAAU,UAAY,EAAA,CAAA,CAAA;AACxD;;;;"}
+{"version":3,"file":"ReviewState.esm.js","sources":["../../../../src/next/components/ReviewState/ReviewState.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 React from 'react';\nimport { StructuredMetadataTable } from '@backstage/core-components';\nimport { JsonObject, JsonValue } from '@backstage/types';\nimport { Draft07 as JSONSchema } from 'json-schema-library';\nimport { ParsedTemplateSchema } from '../../hooks/useTemplateSchema';\nimport { isJsonObject, formatKey } from './util';\n\n/**\n * The props for the {@link ReviewState} component.\n * @alpha\n */\nexport type ReviewStateProps = {\n  schemas: ParsedTemplateSchema[];\n  formState: JsonObject;\n};\n\nfunction processSchema(\n  key: string,\n  value: JsonValue | undefined,\n  schema: ParsedTemplateSchema,\n  formState: JsonObject,\n): [string, JsonValue | undefined][] {\n  const parsedSchema = new JSONSchema(schema.mergedSchema);\n  const definitionInSchema = parsedSchema.getSchema({\n    pointer: `#/${key}`,\n    data: formState,\n  });\n\n  const name =\n    definitionInSchema?.['ui:backstage']?.review?.name ??\n    definitionInSchema?.title ??\n    key;\n\n  if (definitionInSchema) {\n    const backstageReviewOptions = definitionInSchema['ui:backstage']?.review;\n    if (backstageReviewOptions) {\n      if (backstageReviewOptions.mask) {\n        return [[name, backstageReviewOptions.mask]];\n      }\n      if (backstageReviewOptions.show === false) {\n        return [];\n      }\n    }\n\n    if (\n      definitionInSchema['ui:widget'] === 'password' ||\n      definitionInSchema['ui:field']?.toLocaleLowerCase('en-us') === 'secret'\n    ) {\n      return [[name, '******']];\n    }\n\n    if (definitionInSchema.enum && definitionInSchema.enumNames) {\n      return [\n        [\n          name,\n          definitionInSchema.enumNames[\n            definitionInSchema.enum.indexOf(value)\n          ] || value,\n        ],\n      ];\n    }\n\n    if (backstageReviewOptions?.explode !== false && isJsonObject(value)) {\n      // Recurse nested objects\n      return Object.entries(value).flatMap(([nestedKey, nestedValue]) =>\n        processSchema(`${key}/${nestedKey}`, nestedValue, schema, formState),\n      );\n    }\n  }\n\n  return [[name, value]];\n}\n\n/**\n * The component used by the {@link Stepper} to render the review step.\n * @alpha\n */\nexport const ReviewState = (props: ReviewStateProps) => {\n  const reviewData = Object.fromEntries(\n    Object.entries(props.formState)\n      .flatMap(([key, value]) => {\n        for (const step of props.schemas) {\n          return processSchema(key, value, step, props.formState);\n        }\n        return [[key, value]];\n      })\n      .filter(prop => prop.length > 0),\n  );\n  const options = {\n    titleFormat: formatKey,\n  };\n  return <StructuredMetadataTable metadata={reviewData} options={options} />;\n};\n"],"names":["JSONSchema"],"mappings":"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"}

package/dist/next/components/ReviewState/util.esm.js

@@ -1,10 +1,12 @@
+import { startCase } from 'lodash';
+
 function isJsonObject(value) {
   return typeof value === "object" && value !== null && !Array.isArray(value);
 }
-function getLastKey(key) {
+function formatKey(key) {
   const parts = key.split("/");
-  return parts[parts.length - 1];
+  return parts.filter(Boolean).map((part) => startCase(part)).join(" > ");
 }
 
-export { getLastKey, isJsonObject };
+export { formatKey, isJsonObject };
 //# sourceMappingURL=util.esm.js.map

package/dist/next/components/ReviewState/util.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"util.esm.js","sources":["../../../../src/next/components/ReviewState/util.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 { JsonObject, JsonValue } from '@backstage/types';\n\nexport function isJsonObject(value?: JsonValue): value is JsonObject {\n  return typeof value === 'object' && value !== null && !Array.isArray(value);\n}\n\n// Helper function to get the last part of the key\nexport function getLastKey(key: string): string {\n  const parts = key.split('/');\n  return parts[parts.length - 1];\n}\n"],"names":[],"mappings":"AAkBO,SAAS,aAAa,KAAwC,EAAA;AACnE,EAAO,OAAA,OAAO,UAAU,QAAY,IAAA,KAAA,KAAU,QAAQ,CAAC,KAAA,CAAM,QAAQ,KAAK,CAAA,CAAA;AAC5E,CAAA;AAGO,SAAS,WAAW,GAAqB,EAAA;AAC9C,EAAM,MAAA,KAAA,GAAQ,GAAI,CAAA,KAAA,CAAM,GAAG,CAAA,CAAA;AAC3B,EAAO,OAAA,KAAA,CAAM,KAAM,CAAA,MAAA,GAAS,CAAC,CAAA,CAAA;AAC/B;;;;"}
+{"version":3,"file":"util.esm.js","sources":["../../../../src/next/components/ReviewState/util.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 { JsonObject, JsonValue } from '@backstage/types';\nimport { startCase } from 'lodash';\n\nexport function isJsonObject(value?: JsonValue): value is JsonObject {\n  return typeof value === 'object' && value !== null && !Array.isArray(value);\n}\n\n// Helper function to format a key into a human-readable string\nexport function formatKey(key: string): string {\n  const parts = key.split('/');\n  return parts\n    .filter(Boolean)\n    .map(part => startCase(part))\n    .join(' > ');\n}\n"],"names":[],"mappings":";;AAmBO,SAAS,aAAa,KAAwC,EAAA;AACnE,EAAO,OAAA,OAAO,UAAU,QAAY,IAAA,KAAA,KAAU,QAAQ,CAAC,KAAA,CAAM,QAAQ,KAAK,CAAA,CAAA;AAC5E,CAAA;AAGO,SAAS,UAAU,GAAqB,EAAA;AAC7C,EAAM,MAAA,KAAA,GAAQ,GAAI,CAAA,KAAA,CAAM,GAAG,CAAA,CAAA;AAC3B,EAAO,OAAA,KAAA,CACJ,MAAO,CAAA,OAAO,CACd,CAAA,GAAA,CAAI,CAAQ,IAAA,KAAA,SAAA,CAAU,IAAI,CAAC,CAC3B,CAAA,IAAA,CAAK,KAAK,CAAA,CAAA;AACf;;;;"}

package/dist/next/components/SecretWidget/SecretWidget.esm.js

@@ -1,6 +1,5 @@
 import { useTemplateSecrets } from '@backstage/plugin-scaffolder-react';
-import InputLabel from '@material-ui/core/InputLabel';
-import Input from '@material-ui/core/Input';
+import TextField from '@material-ui/core/TextField';
 import React from 'react';
 
 const SecretWidget = (props) => {
@@ -8,22 +7,31 @@ const SecretWidget = (props) => {
   const {
     name,
     onChange,
-    schema: { title }
+    schema: { title, minLength, maxLength },
+    required,
+    disabled
   } = props;
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(InputLabel, { htmlFor: title }, title), /* @__PURE__ */ React.createElement(
-    Input,
+  return /* @__PURE__ */ React.createElement(
+    TextField,
     {
       id: title,
+      label: title,
       "aria-describedby": title,
       onChange: (e) => {
-        onChange(Array(e.target?.value.length).fill("*").join(""));
-        setSecrets({ [name]: e.target?.value });
+        onChange(Array(e.target.value.length).fill("*").join(""));
+        setSecrets({ [name]: e.target.value });
       },
       value: secrets[name] ?? "",
       type: "password",
-      autoComplete: "off"
+      autoComplete: "off",
+      required,
+      disabled,
+      inputProps: {
+        minLength,
+        maxLength
+      }
     }
-  ));
+  );
 };
 
 export { SecretWidget };

package/dist/next/components/SecretWidget/SecretWidget.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"SecretWidget.esm.js","sources":["../../../../src/next/components/SecretWidget/SecretWidget.tsx"],"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 { WidgetProps } from '@rjsf/utils';\nimport { useTemplateSecrets } from '@backstage/plugin-scaffolder-react';\nimport InputLabel from '@material-ui/core/InputLabel';\nimport Input from '@material-ui/core/Input';\nimport React from 'react';\n\n/**\n * Secret Widget for overriding the default password input widget\n * @alpha\n */\nexport const SecretWidget = (\n  props: Pick<WidgetProps, 'name' | 'onChange' | 'schema'>,\n) => {\n  const { setSecrets, secrets } = useTemplateSecrets();\n  const {\n    name,\n    onChange,\n    schema: { title },\n  } = props;\n\n  return (\n    <>\n      <InputLabel htmlFor={title}>{title}</InputLabel>\n      <Input\n        id={title}\n        aria-describedby={title}\n        onChange={e => {\n          onChange(Array(e.target?.value.length).fill('*').join(''));\n          setSecrets({ [name]: e.target?.value });\n        }}\n        value={secrets[name] ?? ''}\n        type=\"password\"\n        autoComplete=\"off\"\n      />\n    </>\n  );\n};\n"],"names":[],"mappings":";;;;;AA0Ba,MAAA,YAAA,GAAe,CAC1B,KACG,KAAA;AACH,EAAA,MAAM,EAAE,UAAA,EAAY,OAAQ,EAAA,GAAI,kBAAmB,EAAA,CAAA;AACnD,EAAM,MAAA;AAAA,IACJ,IAAA;AAAA,IACA,QAAA;AAAA,IACA,MAAA,EAAQ,EAAE,KAAM,EAAA;AAAA,GACd,GAAA,KAAA,CAAA;AAEJ,EAAA,iFAEK,KAAA,CAAA,aAAA,CAAA,UAAA,EAAA,EAAW,OAAS,EAAA,KAAA,EAAA,EAAQ,KAAM,CACnC,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,EAAI,EAAA,KAAA;AAAA,MACJ,kBAAkB,EAAA,KAAA;AAAA,MAClB,UAAU,CAAK,CAAA,KAAA;AACb,QAAS,QAAA,CAAA,KAAA,CAAM,CAAE,CAAA,MAAA,EAAQ,KAAM,CAAA,MAAM,CAAE,CAAA,IAAA,CAAK,GAAG,CAAA,CAAE,IAAK,CAAA,EAAE,CAAC,CAAA,CAAA;AACzD,QAAA,UAAA,CAAW,EAAE,CAAC,IAAI,GAAG,CAAE,CAAA,MAAA,EAAQ,OAAO,CAAA,CAAA;AAAA,OACxC;AAAA,MACA,KAAA,EAAO,OAAQ,CAAA,IAAI,CAAK,IAAA,EAAA;AAAA,MACxB,IAAK,EAAA,UAAA;AAAA,MACL,YAAa,EAAA,KAAA;AAAA,KAAA;AAAA,GAEjB,CAAA,CAAA;AAEJ;;;;"}
+{"version":3,"file":"SecretWidget.esm.js","sources":["../../../../src/next/components/SecretWidget/SecretWidget.tsx"],"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 { WidgetProps } from '@rjsf/utils';\nimport { useTemplateSecrets } from '@backstage/plugin-scaffolder-react';\nimport TextField from '@material-ui/core/TextField';\nimport React from 'react';\n\n/**\n * Secret Widget for overriding the default password input widget\n * @alpha\n */\nexport const SecretWidget = (\n  props: Pick<\n    WidgetProps,\n    'name' | 'onChange' | 'schema' | 'required' | 'disabled'\n  >,\n) => {\n  const { setSecrets, secrets } = useTemplateSecrets();\n  const {\n    name,\n    onChange,\n    schema: { title, minLength, maxLength },\n    required,\n    disabled,\n  } = props;\n\n  return (\n    <TextField\n      id={title}\n      label={title}\n      aria-describedby={title}\n      onChange={e => {\n        onChange(Array(e.target.value.length).fill('*').join(''));\n        setSecrets({ [name]: e.target.value });\n      }}\n      value={secrets[name] ?? ''}\n      type=\"password\"\n      autoComplete=\"off\"\n      required={required}\n      disabled={disabled}\n      inputProps={{\n        minLength,\n        maxLength,\n      }}\n    />\n  );\n};\n"],"names":[],"mappings":";;;;AAyBa,MAAA,YAAA,GAAe,CAC1B,KAIG,KAAA;AACH,EAAA,MAAM,EAAE,UAAA,EAAY,OAAQ,EAAA,GAAI,kBAAmB,EAAA,CAAA;AACnD,EAAM,MAAA;AAAA,IACJ,IAAA;AAAA,IACA,QAAA;AAAA,IACA,MAAQ,EAAA,EAAE,KAAO,EAAA,SAAA,EAAW,SAAU,EAAA;AAAA,IACtC,QAAA;AAAA,IACA,QAAA;AAAA,GACE,GAAA,KAAA,CAAA;AAEJ,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,SAAA;AAAA,IAAA;AAAA,MACC,EAAI,EAAA,KAAA;AAAA,MACJ,KAAO,EAAA,KAAA;AAAA,MACP,kBAAkB,EAAA,KAAA;AAAA,MAClB,UAAU,CAAK,CAAA,KAAA;AACb,QAAS,QAAA,CAAA,KAAA,CAAM,CAAE,CAAA,MAAA,CAAO,KAAM,CAAA,MAAM,CAAE,CAAA,IAAA,CAAK,GAAG,CAAA,CAAE,IAAK,CAAA,EAAE,CAAC,CAAA,CAAA;AACxD,QAAA,UAAA,CAAW,EAAE,CAAC,IAAI,GAAG,CAAE,CAAA,MAAA,CAAO,OAAO,CAAA,CAAA;AAAA,OACvC;AAAA,MACA,KAAA,EAAO,OAAQ,CAAA,IAAI,CAAK,IAAA,EAAA;AAAA,MACxB,IAAK,EAAA,UAAA;AAAA,MACL,YAAa,EAAA,KAAA;AAAA,MACb,QAAA;AAAA,MACA,QAAA;AAAA,MACA,UAAY,EAAA;AAAA,QACV,SAAA;AAAA,QACA,SAAA;AAAA,OACF;AAAA,KAAA;AAAA,GACF,CAAA;AAEJ;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@backstage/plugin-scaffolder-react",
-  "version": "1.11.0-next.3",
+  "version": "1.12.0-next.0",
   "description": "A frontend library that helps other Backstage plugins interact with the Scaffolder",
   "backstage": {
     "role": "web-library",
@@ -57,13 +57,13 @@
     "test": "backstage-cli package test"
   },
   "dependencies": {
-    "@backstage/catalog-client": "^1.6.6-next.0",
-    "@backstage/catalog-model": "^1.6.0-next.0",
-    "@backstage/core-components": "^0.14.10-next.0",
+    "@backstage/catalog-client": "^1.6.6",
+    "@backstage/catalog-model": "^1.6.0",
+    "@backstage/core-components": "^0.14.10",
     "@backstage/core-plugin-api": "^1.9.3",
-    "@backstage/plugin-catalog-react": "^1.12.3-next.3",
-    "@backstage/plugin-permission-react": "^0.4.25-next.1",
-    "@backstage/plugin-scaffolder-common": "^1.5.5-next.2",
+    "@backstage/plugin-catalog-react": "^1.12.4-next.0",
+    "@backstage/plugin-permission-react": "^0.4.25",
+    "@backstage/plugin-scaffolder-common": "^1.5.5",
     "@backstage/theme": "^0.5.6",
     "@backstage/types": "^1.1.1",
     "@backstage/version-bridge": "^1.0.8",
@@ -93,12 +93,12 @@
     "zod-to-json-schema": "^3.20.4"
   },
   "devDependencies": {
-    "@backstage/cli": "^0.27.0-next.4",
-    "@backstage/core-app-api": "^1.14.2-next.0",
-    "@backstage/plugin-catalog": "^1.22.0-next.3",
-    "@backstage/plugin-catalog-common": "^1.0.26-next.2",
-    "@backstage/plugin-permission-common": "^0.8.1-next.1",
-    "@backstage/test-utils": "^1.5.10-next.2",
+    "@backstage/cli": "^0.27.1-next.0",
+    "@backstage/core-app-api": "^1.14.2",
+    "@backstage/plugin-catalog": "^1.22.1-next.0",
+    "@backstage/plugin-catalog-common": "^1.0.26",
+    "@backstage/plugin-permission-common": "^0.8.1",
+    "@backstage/test-utils": "^1.6.0-next.0",
     "@testing-library/dom": "^10.0.0",
     "@testing-library/jest-dom": "^6.0.0",
     "@testing-library/react": "^15.0.0",