@backstage/plugin-scaffolder-react 1.9.0 → 1.10.0-next.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +44 -0
- package/alpha/package.json +2 -2
- package/dist/index.d.ts +10 -0
- package/dist/next/components/Form/Form.esm.js +3 -1
- package/dist/next/components/Form/Form.esm.js.map +1 -1
- package/dist/next/components/Stepper/ErrorListTemplate/errorListTemplate.esm.js +16 -2
- package/dist/next/components/Stepper/ErrorListTemplate/errorListTemplate.esm.js.map +1 -1
- package/dist/next/components/Stepper/Stepper.esm.js +1 -2
- package/dist/next/components/Stepper/Stepper.esm.js.map +1 -1
- package/dist/next/components/TemplateCategoryPicker/TemplateCategoryPicker.esm.js +2 -4
- package/dist/next/components/TemplateCategoryPicker/TemplateCategoryPicker.esm.js.map +1 -1
- package/package.json +11 -11
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,49 @@
|
|
|
1
1
|
# @backstage/plugin-scaffolder-react
|
|
2
2
|
|
|
3
|
+
## 1.10.0-next.1
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- 354e68c: Improve validation error display text in scaffolder
|
|
8
|
+
|
|
9
|
+
### Patch Changes
|
|
10
|
+
|
|
11
|
+
- cc81579: Updated dependency `@rjsf/utils` to `5.18.5`.
|
|
12
|
+
Updated dependency `@rjsf/core` to `5.18.5`.
|
|
13
|
+
Updated dependency `@rjsf/material-ui` to `5.18.5`.
|
|
14
|
+
Updated dependency `@rjsf/validator-ajv8` to `5.18.5`.
|
|
15
|
+
- Updated dependencies
|
|
16
|
+
- @backstage/plugin-catalog-react@1.12.2-next.1
|
|
17
|
+
- @backstage/core-components@0.14.9-next.0
|
|
18
|
+
- @backstage/core-plugin-api@1.9.3
|
|
19
|
+
- @backstage/catalog-client@1.6.5
|
|
20
|
+
- @backstage/catalog-model@1.5.0
|
|
21
|
+
- @backstage/theme@0.5.6
|
|
22
|
+
- @backstage/types@1.1.1
|
|
23
|
+
- @backstage/version-bridge@1.0.8
|
|
24
|
+
- @backstage/plugin-permission-react@0.4.23
|
|
25
|
+
- @backstage/plugin-scaffolder-common@1.5.3
|
|
26
|
+
|
|
27
|
+
## 1.10.0-next.0
|
|
28
|
+
|
|
29
|
+
### Minor Changes
|
|
30
|
+
|
|
31
|
+
- b5deed0: Add support for `bitbucketCloud` autocomplete in `RepoUrlPicker`
|
|
32
|
+
|
|
33
|
+
### Patch Changes
|
|
34
|
+
|
|
35
|
+
- Updated dependencies
|
|
36
|
+
- @backstage/core-components@0.14.9-next.0
|
|
37
|
+
- @backstage/plugin-catalog-react@1.12.2-next.0
|
|
38
|
+
- @backstage/core-plugin-api@1.9.3
|
|
39
|
+
- @backstage/catalog-client@1.6.5
|
|
40
|
+
- @backstage/catalog-model@1.5.0
|
|
41
|
+
- @backstage/theme@0.5.6
|
|
42
|
+
- @backstage/types@1.1.1
|
|
43
|
+
- @backstage/version-bridge@1.0.8
|
|
44
|
+
- @backstage/plugin-permission-react@0.4.23
|
|
45
|
+
- @backstage/plugin-scaffolder-common@1.5.3
|
|
46
|
+
|
|
3
47
|
## 1.9.0
|
|
4
48
|
|
|
5
49
|
### Minor Changes
|
package/alpha/package.json
CHANGED
package/dist/index.d.ts
CHANGED
|
@@ -556,6 +556,16 @@ interface ScaffolderApi {
|
|
|
556
556
|
listActions(): Promise<ListActionsResponse>;
|
|
557
557
|
streamLogs(options: ScaffolderStreamLogsOptions): Observable<LogEvent>;
|
|
558
558
|
dryRun?(options: ScaffolderDryRunOptions): Promise<ScaffolderDryRunResponse>;
|
|
559
|
+
autocomplete?(options: {
|
|
560
|
+
token: string;
|
|
561
|
+
provider: string;
|
|
562
|
+
resource: string;
|
|
563
|
+
context?: Record<string, string>;
|
|
564
|
+
}): Promise<{
|
|
565
|
+
results: {
|
|
566
|
+
title: string;
|
|
567
|
+
}[];
|
|
568
|
+
}>;
|
|
559
569
|
}
|
|
560
570
|
|
|
561
571
|
/** @public */
|
|
@@ -17,7 +17,9 @@ const Form = (props) => {
|
|
|
17
17
|
...wrapperProps,
|
|
18
18
|
uiSchema: wrapperProps.uiSchema ?? {},
|
|
19
19
|
formData: wrapperProps.formData,
|
|
20
|
-
rawErrors: wrapperProps.rawErrors ?? []
|
|
20
|
+
rawErrors: wrapperProps.rawErrors ?? [],
|
|
21
|
+
disabled: wrapperProps.disabled ?? false,
|
|
22
|
+
readonly: wrapperProps.readonly ?? false
|
|
21
23
|
}
|
|
22
24
|
);
|
|
23
25
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Form.esm.js","sources":["../../../../src/next/components/Form/Form.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 */\n\nimport { withTheme } from '@rjsf/core';\nimport React from 'react';\nimport { PropsWithChildren } from 'react';\nimport { FieldTemplate } from './FieldTemplate';\nimport { DescriptionFieldTemplate } from './DescriptionFieldTemplate';\nimport { FieldProps } from '@rjsf/utils';\nimport { ScaffolderRJSFFormProps } from '@backstage/plugin-scaffolder-react';\nimport { Theme as MuiTheme } from '@rjsf/material-ui';\n\nconst WrappedForm = withTheme(MuiTheme);\n\n/**\n * The Form component\n * @alpha\n */\nexport const Form = (props: PropsWithChildren<ScaffolderRJSFFormProps>) => {\n // This is where we unbreak the changes from RJSF, and make it work with our custom fields so we don't pass on this\n // breaking change to our users. We will look more into a better API for this in scaffolderv2.\n const wrappedFields = React.useMemo(\n () =>\n Object.fromEntries(\n Object.entries(props.fields ?? {}).map(([key, Component]) => [\n key,\n (wrapperProps: FieldProps) => {\n return (\n <Component\n {...wrapperProps}\n uiSchema={wrapperProps.uiSchema ?? {}}\n formData={wrapperProps.formData}\n rawErrors={wrapperProps.rawErrors ?? []}\n />\n );\n },\n ]),\n ),\n [props.fields],\n );\n\n const templates = React.useMemo(\n () => ({\n FieldTemplate,\n DescriptionFieldTemplate,\n ...props.templates,\n }),\n [props.templates],\n );\n\n return (\n <WrappedForm {...props} templates={templates} fields={wrappedFields} />\n );\n};\n"],"names":["MuiTheme"],"mappings":";;;;;;AAyBA,MAAM,WAAA,GAAc,UAAUA,KAAQ,CAAA,CAAA;AAMzB,MAAA,IAAA,GAAO,CAAC,KAAsD,KAAA;AAGzE,EAAA,MAAM,gBAAgB,KAAM,CAAA,OAAA;AAAA,IAC1B,MACE,MAAO,CAAA,WAAA;AAAA,MACL,MAAO,CAAA,OAAA,CAAQ,KAAM,CAAA,MAAA,IAAU,EAAE,CAAE,CAAA,GAAA,CAAI,CAAC,CAAC,GAAK,EAAA,SAAS,CAAM,KAAA;AAAA,QAC3D,GAAA;AAAA,QACA,CAAC,YAA6B,KAAA;AAC5B,UACE,uBAAA,KAAA,CAAA,aAAA;AAAA,YAAC,SAAA;AAAA,YAAA;AAAA,cACE,GAAG,YAAA;AAAA,cACJ,QAAA,EAAU,YAAa,CAAA,QAAA,IAAY,EAAC;AAAA,cACpC,UAAU,YAAa,CAAA,QAAA;AAAA,cACvB,SAAA,EAAW,YAAa,CAAA,SAAA,IAAa,EAAC;AAAA,aAAA;AAAA,
|
|
1
|
+
{"version":3,"file":"Form.esm.js","sources":["../../../../src/next/components/Form/Form.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 */\n\nimport { withTheme } from '@rjsf/core';\nimport React from 'react';\nimport { PropsWithChildren } from 'react';\nimport { FieldTemplate } from './FieldTemplate';\nimport { DescriptionFieldTemplate } from './DescriptionFieldTemplate';\nimport { FieldProps } from '@rjsf/utils';\nimport { ScaffolderRJSFFormProps } from '@backstage/plugin-scaffolder-react';\nimport { Theme as MuiTheme } from '@rjsf/material-ui';\n\nconst WrappedForm = withTheme(MuiTheme);\n\n/**\n * The Form component\n * @alpha\n */\nexport const Form = (props: PropsWithChildren<ScaffolderRJSFFormProps>) => {\n // This is where we unbreak the changes from RJSF, and make it work with our custom fields so we don't pass on this\n // breaking change to our users. We will look more into a better API for this in scaffolderv2.\n const wrappedFields = React.useMemo(\n () =>\n Object.fromEntries(\n Object.entries(props.fields ?? {}).map(([key, Component]) => [\n key,\n (wrapperProps: FieldProps) => {\n return (\n <Component\n {...wrapperProps}\n uiSchema={wrapperProps.uiSchema ?? {}}\n formData={wrapperProps.formData}\n rawErrors={wrapperProps.rawErrors ?? []}\n disabled={wrapperProps.disabled ?? false}\n readonly={wrapperProps.readonly ?? false}\n />\n );\n },\n ]),\n ),\n [props.fields],\n );\n\n const templates = React.useMemo(\n () => ({\n FieldTemplate,\n DescriptionFieldTemplate,\n ...props.templates,\n }),\n [props.templates],\n );\n\n return (\n <WrappedForm {...props} templates={templates} fields={wrappedFields} />\n );\n};\n"],"names":["MuiTheme"],"mappings":";;;;;;AAyBA,MAAM,WAAA,GAAc,UAAUA,KAAQ,CAAA,CAAA;AAMzB,MAAA,IAAA,GAAO,CAAC,KAAsD,KAAA;AAGzE,EAAA,MAAM,gBAAgB,KAAM,CAAA,OAAA;AAAA,IAC1B,MACE,MAAO,CAAA,WAAA;AAAA,MACL,MAAO,CAAA,OAAA,CAAQ,KAAM,CAAA,MAAA,IAAU,EAAE,CAAE,CAAA,GAAA,CAAI,CAAC,CAAC,GAAK,EAAA,SAAS,CAAM,KAAA;AAAA,QAC3D,GAAA;AAAA,QACA,CAAC,YAA6B,KAAA;AAC5B,UACE,uBAAA,KAAA,CAAA,aAAA;AAAA,YAAC,SAAA;AAAA,YAAA;AAAA,cACE,GAAG,YAAA;AAAA,cACJ,QAAA,EAAU,YAAa,CAAA,QAAA,IAAY,EAAC;AAAA,cACpC,UAAU,YAAa,CAAA,QAAA;AAAA,cACvB,SAAA,EAAW,YAAa,CAAA,SAAA,IAAa,EAAC;AAAA,cACtC,QAAA,EAAU,aAAa,QAAY,IAAA,KAAA;AAAA,cACnC,QAAA,EAAU,aAAa,QAAY,IAAA,KAAA;AAAA,aAAA;AAAA,WACrC,CAAA;AAAA,SAEJ;AAAA,OACD,CAAA;AAAA,KACH;AAAA,IACF,CAAC,MAAM,MAAM,CAAA;AAAA,GACf,CAAA;AAEA,EAAA,MAAM,YAAY,KAAM,CAAA,OAAA;AAAA,IACtB,OAAO;AAAA,MACL,aAAA;AAAA,MACA,wBAAA;AAAA,MACA,GAAG,KAAM,CAAA,SAAA;AAAA,KACX,CAAA;AAAA,IACA,CAAC,MAAM,SAAS,CAAA;AAAA,GAClB,CAAA;AAEA,EAAA,2CACG,WAAa,EAAA,EAAA,GAAG,KAAO,EAAA,SAAA,EAAsB,QAAQ,aAAe,EAAA,CAAA,CAAA;AAEzE;;;;"}
|
|
@@ -6,6 +6,7 @@ import ListItemText from '@material-ui/core/ListItemText';
|
|
|
6
6
|
import Paper from '@material-ui/core/Paper';
|
|
7
7
|
import { makeStyles, createStyles } from '@material-ui/core/styles';
|
|
8
8
|
import ErrorIcon from '@material-ui/icons/Error';
|
|
9
|
+
import startCase from 'lodash/startCase';
|
|
9
10
|
|
|
10
11
|
const useStyles = makeStyles(
|
|
11
12
|
(_theme) => createStyles({
|
|
@@ -17,13 +18,26 @@ const useStyles = makeStyles(
|
|
|
17
18
|
}
|
|
18
19
|
})
|
|
19
20
|
);
|
|
20
|
-
const ErrorListTemplate = ({ errors }) => {
|
|
21
|
+
const ErrorListTemplate = ({ errors, schema }) => {
|
|
21
22
|
const classes = useStyles();
|
|
23
|
+
function formatErrorMessage(error) {
|
|
24
|
+
if (error.property && error.message) {
|
|
25
|
+
const propertyName = error.property.startsWith(".") ? error.property.substring(1) : error.property;
|
|
26
|
+
if (schema.properties && propertyName in schema.properties) {
|
|
27
|
+
const property = schema.properties[propertyName];
|
|
28
|
+
if (typeof property === "object" && "title" in property) {
|
|
29
|
+
return `'${property.title}' ${error.message}`;
|
|
30
|
+
}
|
|
31
|
+
}
|
|
32
|
+
return `'${startCase(propertyName)}' ${error.message}`;
|
|
33
|
+
}
|
|
34
|
+
return error.stack;
|
|
35
|
+
}
|
|
22
36
|
return /* @__PURE__ */ React.createElement(Paper, null, /* @__PURE__ */ React.createElement(List, { dense: true, className: classes.list }, errors.map((error, index) => /* @__PURE__ */ React.createElement(ListItem, { key: index }, /* @__PURE__ */ React.createElement(ListItemIcon, null, /* @__PURE__ */ React.createElement(ErrorIcon, { color: "error" })), /* @__PURE__ */ React.createElement(
|
|
23
37
|
ListItemText,
|
|
24
38
|
{
|
|
25
39
|
classes: { primary: classes.text },
|
|
26
|
-
primary: error
|
|
40
|
+
primary: formatErrorMessage(error)
|
|
27
41
|
}
|
|
28
42
|
)))));
|
|
29
43
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"errorListTemplate.esm.js","sources":["../../../../../src/next/components/Stepper/ErrorListTemplate/errorListTemplate.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 { ErrorListProps } from '@rjsf/utils';\nimport List from '@material-ui/core/List';\nimport ListItem from '@material-ui/core/ListItem';\nimport ListItemIcon from '@material-ui/core/ListItemIcon';\nimport ListItemText from '@material-ui/core/ListItemText';\nimport Paper from '@material-ui/core/Paper';\nimport { Theme, createStyles, makeStyles } from '@material-ui/core/styles';\nimport ErrorIcon from '@material-ui/icons/Error';\n\nconst useStyles = makeStyles((_theme: Theme) =>\n createStyles({\n list: {\n width: '100%',\n },\n text: {\n textWrap: 'wrap',\n },\n }),\n);\n\n/**\n * Shows a list of errors found in the form\n *\n * @public\n */\nexport const ErrorListTemplate = ({ errors }: ErrorListProps) => {\n const classes = useStyles();\n\n return (\n <Paper>\n <List dense className={classes.list}>\n {errors.map((error, index) => (\n <ListItem key={index}>\n <ListItemIcon>\n <ErrorIcon color=\"error\" />\n </ListItemIcon>\n <ListItemText\n classes={{ primary: classes.text }}\n primary={error
|
|
1
|
+
{"version":3,"file":"errorListTemplate.esm.js","sources":["../../../../../src/next/components/Stepper/ErrorListTemplate/errorListTemplate.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 { ErrorListProps, RJSFValidationError } from '@rjsf/utils';\nimport List from '@material-ui/core/List';\nimport ListItem from '@material-ui/core/ListItem';\nimport ListItemIcon from '@material-ui/core/ListItemIcon';\nimport ListItemText from '@material-ui/core/ListItemText';\nimport Paper from '@material-ui/core/Paper';\nimport { Theme, createStyles, makeStyles } from '@material-ui/core/styles';\nimport ErrorIcon from '@material-ui/icons/Error';\nimport startCase from 'lodash/startCase';\n\nconst useStyles = makeStyles((_theme: Theme) =>\n createStyles({\n list: {\n width: '100%',\n },\n text: {\n textWrap: 'wrap',\n },\n }),\n);\n\n/**\n * Shows a list of errors found in the form\n *\n * @public\n */\nexport const ErrorListTemplate = ({ errors, schema }: ErrorListProps) => {\n const classes = useStyles();\n\n function formatErrorMessage(error: RJSFValidationError) {\n if (error.property && error.message) {\n const propertyName = error.property.startsWith('.')\n ? error.property.substring(1)\n : error.property;\n if (schema.properties && propertyName in schema.properties) {\n const property = schema.properties[propertyName];\n\n if (typeof property === 'object' && 'title' in property) {\n return `'${property.title}' ${error.message}`;\n }\n }\n // fall back to property name\n return `'${startCase(propertyName)}' ${error.message}`;\n }\n // fall back if property does not exist\n return error.stack;\n }\n\n return (\n <Paper>\n <List dense className={classes.list}>\n {errors.map((error, index) => (\n <ListItem key={index}>\n <ListItemIcon>\n <ErrorIcon color=\"error\" />\n </ListItemIcon>\n <ListItemText\n classes={{ primary: classes.text }}\n primary={formatErrorMessage(error)}\n />\n </ListItem>\n ))}\n </List>\n </Paper>\n );\n};\n"],"names":[],"mappings":";;;;;;;;;;AA0BA,MAAM,SAAY,GAAA,UAAA;AAAA,EAAW,CAAC,WAC5B,YAAa,CAAA;AAAA,IACX,IAAM,EAAA;AAAA,MACJ,KAAO,EAAA,MAAA;AAAA,KACT;AAAA,IACA,IAAM,EAAA;AAAA,MACJ,QAAU,EAAA,MAAA;AAAA,KACZ;AAAA,GACD,CAAA;AACH,CAAA,CAAA;AAOO,MAAM,iBAAoB,GAAA,CAAC,EAAE,MAAA,EAAQ,QAA6B,KAAA;AACvE,EAAA,MAAM,UAAU,SAAU,EAAA,CAAA;AAE1B,EAAA,SAAS,mBAAmB,KAA4B,EAAA;AACtD,IAAI,IAAA,KAAA,CAAM,QAAY,IAAA,KAAA,CAAM,OAAS,EAAA;AACnC,MAAM,MAAA,YAAA,GAAe,KAAM,CAAA,QAAA,CAAS,UAAW,CAAA,GAAG,CAC9C,GAAA,KAAA,CAAM,QAAS,CAAA,SAAA,CAAU,CAAC,CAAA,GAC1B,KAAM,CAAA,QAAA,CAAA;AACV,MAAA,IAAI,MAAO,CAAA,UAAA,IAAc,YAAgB,IAAA,MAAA,CAAO,UAAY,EAAA;AAC1D,QAAM,MAAA,QAAA,GAAW,MAAO,CAAA,UAAA,CAAW,YAAY,CAAA,CAAA;AAE/C,QAAA,IAAI,OAAO,QAAA,KAAa,QAAY,IAAA,OAAA,IAAW,QAAU,EAAA;AACvD,UAAA,OAAO,CAAI,CAAA,EAAA,QAAA,CAAS,KAAK,CAAA,EAAA,EAAK,MAAM,OAAO,CAAA,CAAA,CAAA;AAAA,SAC7C;AAAA,OACF;AAEA,MAAA,OAAO,IAAI,SAAU,CAAA,YAAY,CAAC,CAAA,EAAA,EAAK,MAAM,OAAO,CAAA,CAAA,CAAA;AAAA,KACtD;AAEA,IAAA,OAAO,KAAM,CAAA,KAAA,CAAA;AAAA,GACf;AAEA,EACE,uBAAA,KAAA,CAAA,aAAA,CAAC,KACC,EAAA,IAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,IAAK,EAAA,EAAA,KAAA,EAAK,MAAC,SAAW,EAAA,OAAA,CAAQ,IAC5B,EAAA,EAAA,MAAA,CAAO,GAAI,CAAA,CAAC,OAAO,KAClB,qBAAA,KAAA,CAAA,aAAA,CAAC,QAAS,EAAA,EAAA,GAAA,EAAK,KACb,EAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,YACC,EAAA,IAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,SAAU,EAAA,EAAA,KAAA,EAAM,OAAQ,EAAA,CAC3B,CACA,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,YAAA;AAAA,IAAA;AAAA,MACC,OAAS,EAAA,EAAE,OAAS,EAAA,OAAA,CAAQ,IAAK,EAAA;AAAA,MACjC,OAAA,EAAS,mBAAmB,KAAK,CAAA;AAAA,KAAA;AAAA,GAErC,CACD,CACH,CACF,CAAA,CAAA;AAEJ;;;;"}
|
|
@@ -121,8 +121,7 @@ const Stepper = (stepperProps) => {
|
|
|
121
121
|
"aria-label": `Step ${index + 1}`,
|
|
122
122
|
style: { cursor: isAllowedLabelClick ? "pointer" : "default" },
|
|
123
123
|
onClick: () => {
|
|
124
|
-
if (isAllowedLabelClick)
|
|
125
|
-
setActiveStep(index);
|
|
124
|
+
if (isAllowedLabelClick) setActiveStep(index);
|
|
126
125
|
}
|
|
127
126
|
},
|
|
128
127
|
step.title
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Stepper.esm.js","sources":["../../../../src/next/components/Stepper/Stepper.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 { useAnalytics, useApiHolder } from '@backstage/core-plugin-api';\nimport { JsonValue } from '@backstage/types';\nimport MuiStepper from '@material-ui/core/Stepper';\nimport MuiStep from '@material-ui/core/Step';\nimport MuiStepLabel from '@material-ui/core/StepLabel';\nimport Button from '@material-ui/core/Button';\nimport LinearProgress from '@material-ui/core/LinearProgress';\nimport { type IChangeEvent } from '@rjsf/core';\nimport { ErrorSchema } from '@rjsf/utils';\nimport React, {\n useCallback,\n useMemo,\n useState,\n type ReactNode,\n ComponentType,\n} from 'react';\nimport {\n createAsyncValidators,\n type FormValidation,\n} from './createAsyncValidators';\nimport { ReviewState, type ReviewStateProps } from '../ReviewState';\nimport { useTemplateSchema, useFormDataFromQuery } from '../../hooks';\nimport validator from '@rjsf/validator-ajv8';\nimport { useTransformSchemaToProps } from '../../hooks/useTransformSchemaToProps';\nimport { hasErrors } from './utils';\nimport * as FieldOverrides from './FieldOverrides';\nimport { Form } from '../Form';\nimport {\n TemplateParameterSchema,\n LayoutOptions,\n FieldExtensionOptions,\n FormProps,\n} from '@backstage/plugin-scaffolder-react';\nimport { ReviewStepProps } from '@backstage/plugin-scaffolder-react';\nimport { ErrorListTemplate } from './ErrorListTemplate';\nimport { makeStyles } from '@material-ui/core/styles';\nimport { PasswordWidget } from '../PasswordWidget/PasswordWidget';\n\nconst useStyles = makeStyles(theme => ({\n backButton: {\n marginRight: theme.spacing(1),\n },\n footer: {\n display: 'flex',\n flexDirection: 'row',\n justifyContent: 'right',\n marginTop: theme.spacing(2),\n },\n formWrapper: {\n padding: theme.spacing(2),\n },\n}));\n\n/**\n * The Props for {@link Stepper} component\n * @alpha\n */\nexport type StepperProps = {\n manifest: TemplateParameterSchema;\n extensions: FieldExtensionOptions<any, any>[];\n /**\n * @deprecated This was only ever used for analytics tracking purposes, which\n * is now handled in the `<Workflow />` component. Passing it in will have no\n * effect.\n */\n templateName?: string;\n formProps?: FormProps;\n initialState?: Record<string, JsonValue>;\n onCreate: (values: Record<string, JsonValue>) => Promise<void>;\n components?: {\n ReviewStepComponent?: ComponentType<ReviewStepProps>;\n ReviewStateComponent?: (props: ReviewStateProps) => JSX.Element;\n backButtonText?: ReactNode;\n createButtonText?: ReactNode;\n reviewButtonText?: ReactNode;\n };\n layouts?: LayoutOptions[];\n};\n\n/**\n * The `Stepper` component is the Wizard that is rendered when a user selects a template\n * @alpha\n */\nexport const Stepper = (stepperProps: StepperProps) => {\n const { layouts = [], components = {}, ...props } = stepperProps;\n const {\n ReviewStateComponent = ReviewState,\n ReviewStepComponent,\n backButtonText = 'Back',\n createButtonText = 'Create',\n reviewButtonText = 'Review',\n } = components;\n const analytics = useAnalytics();\n const { presentation, steps } = useTemplateSchema(props.manifest);\n const apiHolder = useApiHolder();\n const [activeStep, setActiveStep] = useState(0);\n const [isValidating, setIsValidating] = useState(false);\n const [formState, setFormState] = useFormDataFromQuery(props.initialState);\n\n const [errors, setErrors] = useState<undefined | FormValidation>();\n const styles = useStyles();\n\n const backLabel =\n presentation?.buttonLabels?.backButtonText ?? backButtonText;\n const createLabel =\n presentation?.buttonLabels?.createButtonText ?? createButtonText;\n const reviewLabel =\n presentation?.buttonLabels?.reviewButtonText ?? reviewButtonText;\n\n const extensions = useMemo(() => {\n return Object.fromEntries(\n props.extensions.map(({ name, component }) => [name, component]),\n );\n }, [props.extensions]);\n\n const fields = useMemo(\n () => ({ ...FieldOverrides, ...extensions }),\n [extensions],\n );\n\n const validators = useMemo(() => {\n return Object.fromEntries(\n props.extensions.map(({ name, validation }) => [name, validation]),\n );\n }, [props.extensions]);\n\n const validation = useMemo(() => {\n return createAsyncValidators(steps[activeStep]?.mergedSchema, validators, {\n apiHolder,\n });\n }, [steps, activeStep, validators, apiHolder]);\n\n const handleBack = () => {\n setActiveStep(prevActiveStep => prevActiveStep - 1);\n };\n\n const handleChange = useCallback(\n (e: IChangeEvent) =>\n setFormState(current => ({ ...current, ...e.formData })),\n [setFormState],\n );\n\n const handleCreate = useCallback(() => {\n props.onCreate(formState);\n analytics.captureEvent('click', `${createLabel}`);\n }, [props, formState, analytics, createLabel]);\n\n const currentStep = useTransformSchemaToProps(steps[activeStep], { layouts });\n\n const handleNext = async ({\n formData = {},\n }: {\n formData?: Record<string, JsonValue>;\n }) => {\n // The validation should never throw, as the validators are wrapped in a try/catch.\n // This makes it fine to set and unset state without try/catch.\n setErrors(undefined);\n setIsValidating(true);\n\n const returnedValidation = await validation(formData);\n\n setIsValidating(false);\n\n if (hasErrors(returnedValidation)) {\n setErrors(returnedValidation);\n } else {\n setErrors(undefined);\n setActiveStep(prevActiveStep => {\n const stepNum = prevActiveStep + 1;\n analytics.captureEvent('click', `Next Step (${stepNum})`);\n return stepNum;\n });\n }\n setFormState(current => ({ ...current, ...formData }));\n };\n\n return (\n <>\n {isValidating && <LinearProgress variant=\"indeterminate\" />}\n <MuiStepper\n activeStep={activeStep}\n alternativeLabel\n variant=\"elevation\"\n style={{ overflowX: 'auto' }}\n >\n {steps.map((step, index) => {\n const isAllowedLabelClick = activeStep > index;\n return (\n <MuiStep key={index}>\n <MuiStepLabel\n aria-label={`Step ${index + 1}`}\n style={{ cursor: isAllowedLabelClick ? 'pointer' : 'default' }}\n onClick={() => {\n if (isAllowedLabelClick) setActiveStep(index);\n }}\n >\n {step.title}\n </MuiStepLabel>\n </MuiStep>\n );\n })}\n <MuiStep>\n <MuiStepLabel>{reviewLabel}</MuiStepLabel>\n </MuiStep>\n </MuiStepper>\n <div className={styles.formWrapper}>\n {/* eslint-disable-next-line no-nested-ternary */}\n {activeStep < steps.length ? (\n <Form\n validator={validator}\n extraErrors={errors as unknown as ErrorSchema}\n formData={formState}\n formContext={{ formData: formState }}\n schema={currentStep.schema}\n uiSchema={currentStep.uiSchema}\n onSubmit={handleNext}\n fields={fields}\n showErrorList=\"top\"\n templates={{ ErrorListTemplate }}\n onChange={handleChange}\n widgets={{ password: PasswordWidget }}\n experimental_defaultFormStateBehavior={{\n allOf: 'populateDefaults',\n }}\n {...(props.formProps ?? {})}\n >\n <div className={styles.footer}>\n <Button\n onClick={handleBack}\n className={styles.backButton}\n disabled={activeStep < 1 || isValidating}\n >\n {backLabel}\n </Button>\n <Button\n variant=\"contained\"\n color=\"primary\"\n type=\"submit\"\n disabled={isValidating}\n >\n {activeStep === steps.length - 1 ? reviewLabel : 'Next'}\n </Button>\n </div>\n </Form>\n ) : // TODO: potentially move away from this pattern, deprecate?\n ReviewStepComponent ? (\n <ReviewStepComponent\n disableButtons={isValidating}\n formData={formState}\n handleBack={handleBack}\n handleReset={() => {}}\n steps={steps}\n handleCreate={handleCreate}\n />\n ) : (\n <>\n <ReviewStateComponent formState={formState} schemas={steps} />\n <div className={styles.footer}>\n <Button\n onClick={handleBack}\n className={styles.backButton}\n disabled={activeStep < 1}\n >\n {backLabel}\n </Button>\n <Button\n variant=\"contained\"\n color=\"primary\"\n onClick={handleCreate}\n >\n {createLabel}\n </Button>\n </div>\n </>\n )}\n </div>\n </>\n );\n};\n"],"names":["FieldOverrides","validation"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAqDA,MAAM,SAAA,GAAY,WAAW,CAAU,KAAA,MAAA;AAAA,EACrC,UAAY,EAAA;AAAA,IACV,WAAA,EAAa,KAAM,CAAA,OAAA,CAAQ,CAAC,CAAA;AAAA,GAC9B;AAAA,EACA,MAAQ,EAAA;AAAA,IACN,OAAS,EAAA,MAAA;AAAA,IACT,aAAe,EAAA,KAAA;AAAA,IACf,cAAgB,EAAA,OAAA;AAAA,IAChB,SAAA,EAAW,KAAM,CAAA,OAAA,CAAQ,CAAC,CAAA;AAAA,GAC5B;AAAA,EACA,WAAa,EAAA;AAAA,IACX,OAAA,EAAS,KAAM,CAAA,OAAA,CAAQ,CAAC,CAAA;AAAA,GAC1B;AACF,CAAE,CAAA,CAAA,CAAA;AAgCW,MAAA,OAAA,GAAU,CAAC,YAA+B,KAAA;AACrD,EAAM,MAAA,EAAE,UAAU,EAAC,EAAG,aAAa,EAAC,EAAG,GAAG,KAAA,EAAU,GAAA,YAAA,CAAA;AACpD,EAAM,MAAA;AAAA,IACJ,oBAAuB,GAAA,WAAA;AAAA,IACvB,mBAAA;AAAA,IACA,cAAiB,GAAA,MAAA;AAAA,IACjB,gBAAmB,GAAA,QAAA;AAAA,IACnB,gBAAmB,GAAA,QAAA;AAAA,GACjB,GAAA,UAAA,CAAA;AACJ,EAAA,MAAM,YAAY,YAAa,EAAA,CAAA;AAC/B,EAAA,MAAM,EAAE,YAAc,EAAA,KAAA,EAAU,GAAA,iBAAA,CAAkB,MAAM,QAAQ,CAAA,CAAA;AAChE,EAAA,MAAM,YAAY,YAAa,EAAA,CAAA;AAC/B,EAAA,MAAM,CAAC,UAAA,EAAY,aAAa,CAAA,GAAI,SAAS,CAAC,CAAA,CAAA;AAC9C,EAAA,MAAM,CAAC,YAAA,EAAc,eAAe,CAAA,GAAI,SAAS,KAAK,CAAA,CAAA;AACtD,EAAA,MAAM,CAAC,SAAW,EAAA,YAAY,CAAI,GAAA,oBAAA,CAAqB,MAAM,YAAY,CAAA,CAAA;AAEzE,EAAA,MAAM,CAAC,MAAA,EAAQ,SAAS,CAAA,GAAI,QAAqC,EAAA,CAAA;AACjE,EAAA,MAAM,SAAS,SAAU,EAAA,CAAA;AAEzB,EAAM,MAAA,SAAA,GACJ,YAAc,EAAA,YAAA,EAAc,cAAkB,IAAA,cAAA,CAAA;AAChD,EAAM,MAAA,WAAA,GACJ,YAAc,EAAA,YAAA,EAAc,gBAAoB,IAAA,gBAAA,CAAA;AAClD,EAAM,MAAA,WAAA,GACJ,YAAc,EAAA,YAAA,EAAc,gBAAoB,IAAA,gBAAA,CAAA;AAElD,EAAM,MAAA,UAAA,GAAa,QAAQ,MAAM;AAC/B,IAAA,OAAO,MAAO,CAAA,WAAA;AAAA,MACZ,KAAA,CAAM,UAAW,CAAA,GAAA,CAAI,CAAC,EAAE,IAAM,EAAA,SAAA,EAAgB,KAAA,CAAC,IAAM,EAAA,SAAS,CAAC,CAAA;AAAA,KACjE,CAAA;AAAA,GACC,EAAA,CAAC,KAAM,CAAA,UAAU,CAAC,CAAA,CAAA;AAErB,EAAA,MAAM,MAAS,GAAA,OAAA;AAAA,IACb,OAAO,EAAE,GAAGA,KAAA,EAAgB,GAAG,UAAW,EAAA,CAAA;AAAA,IAC1C,CAAC,UAAU,CAAA;AAAA,GACb,CAAA;AAEA,EAAM,MAAA,UAAA,GAAa,QAAQ,MAAM;AAC/B,IAAA,OAAO,MAAO,CAAA,WAAA;AAAA,MACZ,KAAM,CAAA,UAAA,CAAW,GAAI,CAAA,CAAC,EAAE,IAAA,EAAM,UAAAC,EAAAA,WAAAA,EAAiB,KAAA,CAAC,IAAMA,EAAAA,WAAU,CAAC,CAAA;AAAA,KACnE,CAAA;AAAA,GACC,EAAA,CAAC,KAAM,CAAA,UAAU,CAAC,CAAA,CAAA;AAErB,EAAM,MAAA,UAAA,GAAa,QAAQ,MAAM;AAC/B,IAAA,OAAO,qBAAsB,CAAA,KAAA,CAAM,UAAU,CAAA,EAAG,cAAc,UAAY,EAAA;AAAA,MACxE,SAAA;AAAA,KACD,CAAA,CAAA;AAAA,KACA,CAAC,KAAA,EAAO,UAAY,EAAA,UAAA,EAAY,SAAS,CAAC,CAAA,CAAA;AAE7C,EAAA,MAAM,aAAa,MAAM;AACvB,IAAc,aAAA,CAAA,CAAA,cAAA,KAAkB,iBAAiB,CAAC,CAAA,CAAA;AAAA,GACpD,CAAA;AAEA,EAAA,MAAM,YAAe,GAAA,WAAA;AAAA,IACnB,CAAC,CACC,KAAA,YAAA,CAAa,CAAY,OAAA,MAAA,EAAE,GAAG,OAAS,EAAA,GAAG,CAAE,CAAA,QAAA,EAAW,CAAA,CAAA;AAAA,IACzD,CAAC,YAAY,CAAA;AAAA,GACf,CAAA;AAEA,EAAM,MAAA,YAAA,GAAe,YAAY,MAAM;AACrC,IAAA,KAAA,CAAM,SAAS,SAAS,CAAA,CAAA;AACxB,IAAA,SAAA,CAAU,YAAa,CAAA,OAAA,EAAS,CAAG,EAAA,WAAW,CAAE,CAAA,CAAA,CAAA;AAAA,KAC/C,CAAC,KAAA,EAAO,SAAW,EAAA,SAAA,EAAW,WAAW,CAAC,CAAA,CAAA;AAE7C,EAAA,MAAM,cAAc,yBAA0B,CAAA,KAAA,CAAM,UAAU,CAAG,EAAA,EAAE,SAAS,CAAA,CAAA;AAE5E,EAAA,MAAM,aAAa,OAAO;AAAA,IACxB,WAAW,EAAC;AAAA,GAGR,KAAA;AAGJ,IAAA,SAAA,CAAU,KAAS,CAAA,CAAA,CAAA;AACnB,IAAA,eAAA,CAAgB,IAAI,CAAA,CAAA;AAEpB,IAAM,MAAA,kBAAA,GAAqB,MAAM,UAAA,CAAW,QAAQ,CAAA,CAAA;AAEpD,IAAA,eAAA,CAAgB,KAAK,CAAA,CAAA;AAErB,IAAI,IAAA,SAAA,CAAU,kBAAkB,CAAG,EAAA;AACjC,MAAA,SAAA,CAAU,kBAAkB,CAAA,CAAA;AAAA,KACvB,MAAA;AACL,MAAA,SAAA,CAAU,KAAS,CAAA,CAAA,CAAA;AACnB,MAAA,aAAA,CAAc,CAAkB,cAAA,KAAA;AAC9B,QAAA,MAAM,UAAU,cAAiB,GAAA,CAAA,CAAA;AACjC,QAAA,SAAA,CAAU,YAAa,CAAA,OAAA,EAAS,CAAc,WAAA,EAAA,OAAO,CAAG,CAAA,CAAA,CAAA,CAAA;AACxD,QAAO,OAAA,OAAA,CAAA;AAAA,OACR,CAAA,CAAA;AAAA,KACH;AACA,IAAA,YAAA,CAAa,cAAY,EAAE,GAAG,OAAS,EAAA,GAAG,UAAW,CAAA,CAAA,CAAA;AAAA,GACvD,CAAA;AAEA,EAAA,iEAEK,YAAgB,oBAAA,KAAA,CAAA,aAAA,CAAC,cAAe,EAAA,EAAA,OAAA,EAAQ,iBAAgB,CACzD,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MACC,UAAA;AAAA,MACA,gBAAgB,EAAA,IAAA;AAAA,MAChB,OAAQ,EAAA,WAAA;AAAA,MACR,KAAA,EAAO,EAAE,SAAA,EAAW,MAAO,EAAA;AAAA,KAAA;AAAA,IAE1B,KAAM,CAAA,GAAA,CAAI,CAAC,IAAA,EAAM,KAAU,KAAA;AAC1B,MAAA,MAAM,sBAAsB,UAAa,GAAA,KAAA,CAAA;AACzC,MACE,uBAAA,KAAA,CAAA,aAAA,CAAC,OAAQ,EAAA,EAAA,GAAA,EAAK,KACZ,EAAA,kBAAA,KAAA,CAAA,aAAA;AAAA,QAAC,YAAA;AAAA,QAAA;AAAA,UACC,YAAA,EAAY,CAAQ,KAAA,EAAA,KAAA,GAAQ,CAAC,CAAA,CAAA;AAAA,UAC7B,KAAO,EAAA,EAAE,MAAQ,EAAA,mBAAA,GAAsB,YAAY,SAAU,EAAA;AAAA,UAC7D,SAAS,MAAM;AACb,YAAI,IAAA,mBAAA;AAAqB,cAAA,aAAA,CAAc,KAAK,CAAA,CAAA;AAAA,WAC9C;AAAA,SAAA;AAAA,QAEC,IAAK,CAAA,KAAA;AAAA,OAEV,CAAA,CAAA;AAAA,KAEH,CAAA;AAAA,oBACA,KAAA,CAAA,aAAA,CAAA,OAAA,EAAA,IAAA,kBACE,KAAA,CAAA,aAAA,CAAA,YAAA,EAAA,IAAA,EAAc,WAAY,CAC7B,CAAA;AAAA,GACF,sCACC,KAAI,EAAA,EAAA,SAAA,EAAW,OAAO,WAEpB,EAAA,EAAA,UAAA,GAAa,MAAM,MAClB,mBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,IAAA;AAAA,IAAA;AAAA,MACC,SAAA;AAAA,MACA,WAAa,EAAA,MAAA;AAAA,MACb,QAAU,EAAA,SAAA;AAAA,MACV,WAAA,EAAa,EAAE,QAAA,EAAU,SAAU,EAAA;AAAA,MACnC,QAAQ,WAAY,CAAA,MAAA;AAAA,MACpB,UAAU,WAAY,CAAA,QAAA;AAAA,MACtB,QAAU,EAAA,UAAA;AAAA,MACV,MAAA;AAAA,MACA,aAAc,EAAA,KAAA;AAAA,MACd,SAAA,EAAW,EAAE,iBAAkB,EAAA;AAAA,MAC/B,QAAU,EAAA,YAAA;AAAA,MACV,OAAA,EAAS,EAAE,QAAA,EAAU,cAAe,EAAA;AAAA,MACpC,qCAAuC,EAAA;AAAA,QACrC,KAAO,EAAA,kBAAA;AAAA,OACT;AAAA,MACC,GAAI,KAAM,CAAA,SAAA,IAAa,EAAC;AAAA,KAAA;AAAA,oBAExB,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAI,SAAW,EAAA,MAAA,CAAO,MACrB,EAAA,kBAAA,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,OAAS,EAAA,UAAA;AAAA,QACT,WAAW,MAAO,CAAA,UAAA;AAAA,QAClB,QAAA,EAAU,aAAa,CAAK,IAAA,YAAA;AAAA,OAAA;AAAA,MAE3B,SAAA;AAAA,KAEH,kBAAA,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,OAAQ,EAAA,WAAA;AAAA,QACR,KAAM,EAAA,SAAA;AAAA,QACN,IAAK,EAAA,QAAA;AAAA,QACL,QAAU,EAAA,YAAA;AAAA,OAAA;AAAA,MAET,UAAe,KAAA,KAAA,CAAM,MAAS,GAAA,CAAA,GAAI,WAAc,GAAA,MAAA;AAAA,KAErD,CAAA;AAAA,GACF;AAAA;AAAA,IAEF,mBACE,mBAAA,KAAA,CAAA,aAAA;AAAA,MAAC,mBAAA;AAAA,MAAA;AAAA,QACC,cAAgB,EAAA,YAAA;AAAA,QAChB,QAAU,EAAA,SAAA;AAAA,QACV,UAAA;AAAA,QACA,aAAa,MAAM;AAAA,SAAC;AAAA,QACpB,KAAA;AAAA,QACA,YAAA;AAAA,OAAA;AAAA,KAGF,mBAAA,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,QAAA,EAAA,IAAA,kBACG,KAAA,CAAA,aAAA,CAAA,oBAAA,EAAA,EAAqB,SAAsB,EAAA,OAAA,EAAS,KAAO,EAAA,CAAA,kBAC3D,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAI,SAAW,EAAA,MAAA,CAAO,MACrB,EAAA,kBAAA,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,OAAS,EAAA,UAAA;AAAA,QACT,WAAW,MAAO,CAAA,UAAA;AAAA,QAClB,UAAU,UAAa,GAAA,CAAA;AAAA,OAAA;AAAA,MAEtB,SAAA;AAAA,KAEH,kBAAA,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,OAAQ,EAAA,WAAA;AAAA,QACR,KAAM,EAAA,SAAA;AAAA,QACN,OAAS,EAAA,YAAA;AAAA,OAAA;AAAA,MAER,WAAA;AAAA,KAEL,CACF,CAAA;AAAA,GAEJ,CACF,CAAA,CAAA;AAEJ;;;;"}
|
|
1
|
+
{"version":3,"file":"Stepper.esm.js","sources":["../../../../src/next/components/Stepper/Stepper.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 { useAnalytics, useApiHolder } from '@backstage/core-plugin-api';\nimport { JsonValue } from '@backstage/types';\nimport MuiStepper from '@material-ui/core/Stepper';\nimport MuiStep from '@material-ui/core/Step';\nimport MuiStepLabel from '@material-ui/core/StepLabel';\nimport Button from '@material-ui/core/Button';\nimport LinearProgress from '@material-ui/core/LinearProgress';\nimport { type IChangeEvent } from '@rjsf/core';\nimport { ErrorSchema } from '@rjsf/utils';\nimport React, {\n useCallback,\n useMemo,\n useState,\n type ReactNode,\n ComponentType,\n} from 'react';\nimport {\n createAsyncValidators,\n type FormValidation,\n} from './createAsyncValidators';\nimport { ReviewState, type ReviewStateProps } from '../ReviewState';\nimport { useTemplateSchema, useFormDataFromQuery } from '../../hooks';\nimport validator from '@rjsf/validator-ajv8';\nimport { useTransformSchemaToProps } from '../../hooks/useTransformSchemaToProps';\nimport { hasErrors } from './utils';\nimport * as FieldOverrides from './FieldOverrides';\nimport { Form } from '../Form';\nimport {\n TemplateParameterSchema,\n LayoutOptions,\n FieldExtensionOptions,\n FormProps,\n} from '@backstage/plugin-scaffolder-react';\nimport { ReviewStepProps } from '@backstage/plugin-scaffolder-react';\nimport { ErrorListTemplate } from './ErrorListTemplate';\nimport { makeStyles } from '@material-ui/core/styles';\nimport { PasswordWidget } from '../PasswordWidget/PasswordWidget';\n\nconst useStyles = makeStyles(theme => ({\n backButton: {\n marginRight: theme.spacing(1),\n },\n footer: {\n display: 'flex',\n flexDirection: 'row',\n justifyContent: 'right',\n marginTop: theme.spacing(2),\n },\n formWrapper: {\n padding: theme.spacing(2),\n },\n}));\n\n/**\n * The Props for {@link Stepper} component\n * @alpha\n */\nexport type StepperProps = {\n manifest: TemplateParameterSchema;\n extensions: FieldExtensionOptions<any, any>[];\n /**\n * @deprecated This was only ever used for analytics tracking purposes, which\n * is now handled in the `<Workflow />` component. Passing it in will have no\n * effect.\n */\n templateName?: string;\n formProps?: FormProps;\n initialState?: Record<string, JsonValue>;\n onCreate: (values: Record<string, JsonValue>) => Promise<void>;\n components?: {\n ReviewStepComponent?: ComponentType<ReviewStepProps>;\n ReviewStateComponent?: (props: ReviewStateProps) => JSX.Element;\n backButtonText?: ReactNode;\n createButtonText?: ReactNode;\n reviewButtonText?: ReactNode;\n };\n layouts?: LayoutOptions[];\n};\n\n/**\n * The `Stepper` component is the Wizard that is rendered when a user selects a template\n * @alpha\n */\nexport const Stepper = (stepperProps: StepperProps) => {\n const { layouts = [], components = {}, ...props } = stepperProps;\n const {\n ReviewStateComponent = ReviewState,\n ReviewStepComponent,\n backButtonText = 'Back',\n createButtonText = 'Create',\n reviewButtonText = 'Review',\n } = components;\n const analytics = useAnalytics();\n const { presentation, steps } = useTemplateSchema(props.manifest);\n const apiHolder = useApiHolder();\n const [activeStep, setActiveStep] = useState(0);\n const [isValidating, setIsValidating] = useState(false);\n const [formState, setFormState] = useFormDataFromQuery(props.initialState);\n\n const [errors, setErrors] = useState<undefined | FormValidation>();\n const styles = useStyles();\n\n const backLabel =\n presentation?.buttonLabels?.backButtonText ?? backButtonText;\n const createLabel =\n presentation?.buttonLabels?.createButtonText ?? createButtonText;\n const reviewLabel =\n presentation?.buttonLabels?.reviewButtonText ?? reviewButtonText;\n\n const extensions = useMemo(() => {\n return Object.fromEntries(\n props.extensions.map(({ name, component }) => [name, component]),\n );\n }, [props.extensions]);\n\n const fields = useMemo(\n () => ({ ...FieldOverrides, ...extensions }),\n [extensions],\n );\n\n const validators = useMemo(() => {\n return Object.fromEntries(\n props.extensions.map(({ name, validation }) => [name, validation]),\n );\n }, [props.extensions]);\n\n const validation = useMemo(() => {\n return createAsyncValidators(steps[activeStep]?.mergedSchema, validators, {\n apiHolder,\n });\n }, [steps, activeStep, validators, apiHolder]);\n\n const handleBack = () => {\n setActiveStep(prevActiveStep => prevActiveStep - 1);\n };\n\n const handleChange = useCallback(\n (e: IChangeEvent) =>\n setFormState(current => ({ ...current, ...e.formData })),\n [setFormState],\n );\n\n const handleCreate = useCallback(() => {\n props.onCreate(formState);\n analytics.captureEvent('click', `${createLabel}`);\n }, [props, formState, analytics, createLabel]);\n\n const currentStep = useTransformSchemaToProps(steps[activeStep], { layouts });\n\n const handleNext = async ({\n formData = {},\n }: {\n formData?: Record<string, JsonValue>;\n }) => {\n // The validation should never throw, as the validators are wrapped in a try/catch.\n // This makes it fine to set and unset state without try/catch.\n setErrors(undefined);\n setIsValidating(true);\n\n const returnedValidation = await validation(formData);\n\n setIsValidating(false);\n\n if (hasErrors(returnedValidation)) {\n setErrors(returnedValidation);\n } else {\n setErrors(undefined);\n setActiveStep(prevActiveStep => {\n const stepNum = prevActiveStep + 1;\n analytics.captureEvent('click', `Next Step (${stepNum})`);\n return stepNum;\n });\n }\n setFormState(current => ({ ...current, ...formData }));\n };\n\n return (\n <>\n {isValidating && <LinearProgress variant=\"indeterminate\" />}\n <MuiStepper\n activeStep={activeStep}\n alternativeLabel\n variant=\"elevation\"\n style={{ overflowX: 'auto' }}\n >\n {steps.map((step, index) => {\n const isAllowedLabelClick = activeStep > index;\n return (\n <MuiStep key={index}>\n <MuiStepLabel\n aria-label={`Step ${index + 1}`}\n style={{ cursor: isAllowedLabelClick ? 'pointer' : 'default' }}\n onClick={() => {\n if (isAllowedLabelClick) setActiveStep(index);\n }}\n >\n {step.title}\n </MuiStepLabel>\n </MuiStep>\n );\n })}\n <MuiStep>\n <MuiStepLabel>{reviewLabel}</MuiStepLabel>\n </MuiStep>\n </MuiStepper>\n <div className={styles.formWrapper}>\n {/* eslint-disable-next-line no-nested-ternary */}\n {activeStep < steps.length ? (\n <Form\n validator={validator}\n extraErrors={errors as unknown as ErrorSchema}\n formData={formState}\n formContext={{ formData: formState }}\n schema={currentStep.schema}\n uiSchema={currentStep.uiSchema}\n onSubmit={handleNext}\n fields={fields}\n showErrorList=\"top\"\n templates={{ ErrorListTemplate }}\n onChange={handleChange}\n widgets={{ password: PasswordWidget }}\n experimental_defaultFormStateBehavior={{\n allOf: 'populateDefaults',\n }}\n {...(props.formProps ?? {})}\n >\n <div className={styles.footer}>\n <Button\n onClick={handleBack}\n className={styles.backButton}\n disabled={activeStep < 1 || isValidating}\n >\n {backLabel}\n </Button>\n <Button\n variant=\"contained\"\n color=\"primary\"\n type=\"submit\"\n disabled={isValidating}\n >\n {activeStep === steps.length - 1 ? reviewLabel : 'Next'}\n </Button>\n </div>\n </Form>\n ) : // TODO: potentially move away from this pattern, deprecate?\n ReviewStepComponent ? (\n <ReviewStepComponent\n disableButtons={isValidating}\n formData={formState}\n handleBack={handleBack}\n handleReset={() => {}}\n steps={steps}\n handleCreate={handleCreate}\n />\n ) : (\n <>\n <ReviewStateComponent formState={formState} schemas={steps} />\n <div className={styles.footer}>\n <Button\n onClick={handleBack}\n className={styles.backButton}\n disabled={activeStep < 1}\n >\n {backLabel}\n </Button>\n <Button\n variant=\"contained\"\n color=\"primary\"\n onClick={handleCreate}\n >\n {createLabel}\n </Button>\n </div>\n </>\n )}\n </div>\n </>\n );\n};\n"],"names":["FieldOverrides","validation"],"mappings":"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"}
|
|
@@ -27,8 +27,7 @@ const TemplateCategoryPicker = () => {
|
|
|
27
27
|
const classes = useStyles();
|
|
28
28
|
const alertApi = useApi(alertApiRef);
|
|
29
29
|
const { error, loading, availableTypes, selectedTypes, setSelectedTypes } = useEntityTypeFilter();
|
|
30
|
-
if (loading)
|
|
31
|
-
return /* @__PURE__ */ React.createElement(Progress, null);
|
|
30
|
+
if (loading) return /* @__PURE__ */ React.createElement(Progress, null);
|
|
32
31
|
if (error) {
|
|
33
32
|
alertApi.post({
|
|
34
33
|
message: `Failed to load entity types with error: ${error}`,
|
|
@@ -36,8 +35,7 @@ const TemplateCategoryPicker = () => {
|
|
|
36
35
|
});
|
|
37
36
|
return null;
|
|
38
37
|
}
|
|
39
|
-
if (!availableTypes)
|
|
40
|
-
return null;
|
|
38
|
+
if (!availableTypes) return null;
|
|
41
39
|
return /* @__PURE__ */ React.createElement(Box, { className: classes.root, pb: 1, pt: 1 }, /* @__PURE__ */ React.createElement(
|
|
42
40
|
Typography,
|
|
43
41
|
{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TemplateCategoryPicker.esm.js","sources":["../../../../src/next/components/TemplateCategoryPicker/TemplateCategoryPicker.tsx"],"sourcesContent":["/*\n * Copyright 2021 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 React, { ReactNode } from 'react';\nimport capitalize from 'lodash/capitalize';\nimport { Progress } from '@backstage/core-components';\nimport Box from '@material-ui/core/Box';\nimport Checkbox from '@material-ui/core/Checkbox';\nimport FormControlLabel from '@material-ui/core/FormControlLabel';\nimport TextField from '@material-ui/core/TextField';\nimport Typography from '@material-ui/core/Typography';\nimport { makeStyles } from '@material-ui/core/styles';\nimport CheckBoxIcon from '@material-ui/icons/CheckBox';\nimport CheckBoxOutlineBlankIcon from '@material-ui/icons/CheckBoxOutlineBlank';\nimport ExpandMoreIcon from '@material-ui/icons/ExpandMore';\nimport Autocomplete from '@material-ui/lab/Autocomplete';\nimport { useEntityTypeFilter } from '@backstage/plugin-catalog-react';\nimport { alertApiRef, useApi } from '@backstage/core-plugin-api';\n\nconst icon = <CheckBoxOutlineBlankIcon fontSize=\"small\" />;\nconst checkedIcon = <CheckBoxIcon fontSize=\"small\" />;\n\n/** @alpha */\nexport type ScaffolderReactTemplateCategoryPickerClassKey = 'root' | 'label';\n\nconst useStyles = makeStyles(\n {\n root: {},\n label: {},\n },\n { name: 'ScaffolderReactTemplateCategoryPicker' },\n);\n\n/**\n * The Category Picker that is rendered on the left side for picking\n * categories and filtering the template list.\n * @alpha\n */\nexport const TemplateCategoryPicker = () => {\n const classes = useStyles();\n const alertApi = useApi(alertApiRef);\n const { error, loading, availableTypes, selectedTypes, setSelectedTypes } =\n useEntityTypeFilter();\n\n if (loading) return <Progress />;\n\n if (error) {\n alertApi.post({\n message: `Failed to load entity types with error: ${error}`,\n severity: 'error',\n });\n return null;\n }\n\n if (!availableTypes) return null;\n\n return (\n <Box className={classes.root} pb={1} pt={1}>\n <Typography\n className={classes.label}\n variant=\"button\"\n component=\"label\"\n htmlFor=\"categories-picker\"\n >\n Categories\n </Typography>\n <Autocomplete<string, true>\n PopperComponent={popperProps => (\n <div {...popperProps}>{popperProps.children as ReactNode}</div>\n )}\n multiple\n id=\"categories-picker\"\n options={availableTypes}\n value={selectedTypes}\n onChange={(_: object, value: string[]) => setSelectedTypes(value)}\n renderOption={(option, { selected }) => (\n <FormControlLabel\n control={\n <Checkbox\n icon={icon}\n checkedIcon={checkedIcon}\n checked={selected}\n />\n }\n label={capitalize(option)}\n />\n )}\n size=\"small\"\n popupIcon={<ExpandMoreIcon />}\n renderInput={params => <TextField {...params} variant=\"outlined\" />}\n />\n </Box>\n );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAgCA,MAAM,IAAO,mBAAA,KAAA,CAAA,aAAA,CAAC,wBAAyB,EAAA,EAAA,QAAA,EAAS,OAAQ,EAAA,CAAA,CAAA;AACxD,MAAM,WAAc,mBAAA,KAAA,CAAA,aAAA,CAAC,YAAa,EAAA,EAAA,QAAA,EAAS,OAAQ,EAAA,CAAA,CAAA;AAKnD,MAAM,SAAY,GAAA,UAAA;AAAA,EAChB;AAAA,IACE,MAAM,EAAC;AAAA,IACP,OAAO,EAAC;AAAA,GACV;AAAA,EACA,EAAE,MAAM,uCAAwC,EAAA;AAClD,CAAA,CAAA;AAOO,MAAM,yBAAyB,MAAM;AAC1C,EAAA,MAAM,UAAU,SAAU,EAAA,CAAA;AAC1B,EAAM,MAAA,QAAA,GAAW,OAAO,WAAW,CAAA,CAAA;AACnC,EAAA,MAAM,EAAE,KAAO,EAAA,OAAA,EAAS,gBAAgB,aAAe,EAAA,gBAAA,KACrD,mBAAoB,EAAA,CAAA;AAEtB,EAAI,IAAA,OAAA
|
|
1
|
+
{"version":3,"file":"TemplateCategoryPicker.esm.js","sources":["../../../../src/next/components/TemplateCategoryPicker/TemplateCategoryPicker.tsx"],"sourcesContent":["/*\n * Copyright 2021 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 React, { ReactNode } from 'react';\nimport capitalize from 'lodash/capitalize';\nimport { Progress } from '@backstage/core-components';\nimport Box from '@material-ui/core/Box';\nimport Checkbox from '@material-ui/core/Checkbox';\nimport FormControlLabel from '@material-ui/core/FormControlLabel';\nimport TextField from '@material-ui/core/TextField';\nimport Typography from '@material-ui/core/Typography';\nimport { makeStyles } from '@material-ui/core/styles';\nimport CheckBoxIcon from '@material-ui/icons/CheckBox';\nimport CheckBoxOutlineBlankIcon from '@material-ui/icons/CheckBoxOutlineBlank';\nimport ExpandMoreIcon from '@material-ui/icons/ExpandMore';\nimport Autocomplete from '@material-ui/lab/Autocomplete';\nimport { useEntityTypeFilter } from '@backstage/plugin-catalog-react';\nimport { alertApiRef, useApi } from '@backstage/core-plugin-api';\n\nconst icon = <CheckBoxOutlineBlankIcon fontSize=\"small\" />;\nconst checkedIcon = <CheckBoxIcon fontSize=\"small\" />;\n\n/** @alpha */\nexport type ScaffolderReactTemplateCategoryPickerClassKey = 'root' | 'label';\n\nconst useStyles = makeStyles(\n {\n root: {},\n label: {},\n },\n { name: 'ScaffolderReactTemplateCategoryPicker' },\n);\n\n/**\n * The Category Picker that is rendered on the left side for picking\n * categories and filtering the template list.\n * @alpha\n */\nexport const TemplateCategoryPicker = () => {\n const classes = useStyles();\n const alertApi = useApi(alertApiRef);\n const { error, loading, availableTypes, selectedTypes, setSelectedTypes } =\n useEntityTypeFilter();\n\n if (loading) return <Progress />;\n\n if (error) {\n alertApi.post({\n message: `Failed to load entity types with error: ${error}`,\n severity: 'error',\n });\n return null;\n }\n\n if (!availableTypes) return null;\n\n return (\n <Box className={classes.root} pb={1} pt={1}>\n <Typography\n className={classes.label}\n variant=\"button\"\n component=\"label\"\n htmlFor=\"categories-picker\"\n >\n Categories\n </Typography>\n <Autocomplete<string, true>\n PopperComponent={popperProps => (\n <div {...popperProps}>{popperProps.children as ReactNode}</div>\n )}\n multiple\n id=\"categories-picker\"\n options={availableTypes}\n value={selectedTypes}\n onChange={(_: object, value: string[]) => setSelectedTypes(value)}\n renderOption={(option, { selected }) => (\n <FormControlLabel\n control={\n <Checkbox\n icon={icon}\n checkedIcon={checkedIcon}\n checked={selected}\n />\n }\n label={capitalize(option)}\n />\n )}\n size=\"small\"\n popupIcon={<ExpandMoreIcon />}\n renderInput={params => <TextField {...params} variant=\"outlined\" />}\n />\n </Box>\n );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAgCA,MAAM,IAAO,mBAAA,KAAA,CAAA,aAAA,CAAC,wBAAyB,EAAA,EAAA,QAAA,EAAS,OAAQ,EAAA,CAAA,CAAA;AACxD,MAAM,WAAc,mBAAA,KAAA,CAAA,aAAA,CAAC,YAAa,EAAA,EAAA,QAAA,EAAS,OAAQ,EAAA,CAAA,CAAA;AAKnD,MAAM,SAAY,GAAA,UAAA;AAAA,EAChB;AAAA,IACE,MAAM,EAAC;AAAA,IACP,OAAO,EAAC;AAAA,GACV;AAAA,EACA,EAAE,MAAM,uCAAwC,EAAA;AAClD,CAAA,CAAA;AAOO,MAAM,yBAAyB,MAAM;AAC1C,EAAA,MAAM,UAAU,SAAU,EAAA,CAAA;AAC1B,EAAM,MAAA,QAAA,GAAW,OAAO,WAAW,CAAA,CAAA;AACnC,EAAA,MAAM,EAAE,KAAO,EAAA,OAAA,EAAS,gBAAgB,aAAe,EAAA,gBAAA,KACrD,mBAAoB,EAAA,CAAA;AAEtB,EAAI,IAAA,OAAA,EAAgB,uBAAA,KAAA,CAAA,aAAA,CAAC,QAAS,EAAA,IAAA,CAAA,CAAA;AAE9B,EAAA,IAAI,KAAO,EAAA;AACT,IAAA,QAAA,CAAS,IAAK,CAAA;AAAA,MACZ,OAAA,EAAS,2CAA2C,KAAK,CAAA,CAAA;AAAA,MACzD,QAAU,EAAA,OAAA;AAAA,KACX,CAAA,CAAA;AACD,IAAO,OAAA,IAAA,CAAA;AAAA,GACT;AAEA,EAAI,IAAA,CAAC,gBAAuB,OAAA,IAAA,CAAA;AAE5B,EACE,uBAAA,KAAA,CAAA,aAAA,CAAC,OAAI,SAAW,EAAA,OAAA,CAAQ,MAAM,EAAI,EAAA,CAAA,EAAG,IAAI,CACvC,EAAA,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MACC,WAAW,OAAQ,CAAA,KAAA;AAAA,MACnB,OAAQ,EAAA,QAAA;AAAA,MACR,SAAU,EAAA,OAAA;AAAA,MACV,OAAQ,EAAA,mBAAA;AAAA,KAAA;AAAA,IACT,YAAA;AAAA,GAGD,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,YAAA;AAAA,IAAA;AAAA,MACC,iBAAiB,CACf,WAAA,qBAAA,KAAA,CAAA,aAAA,CAAC,SAAK,GAAG,WAAA,EAAA,EAAc,YAAY,QAAsB,CAAA;AAAA,MAE3D,QAAQ,EAAA,IAAA;AAAA,MACR,EAAG,EAAA,mBAAA;AAAA,MACH,OAAS,EAAA,cAAA;AAAA,MACT,KAAO,EAAA,aAAA;AAAA,MACP,QAAU,EAAA,CAAC,CAAW,EAAA,KAAA,KAAoB,iBAAiB,KAAK,CAAA;AAAA,MAChE,YAAc,EAAA,CAAC,MAAQ,EAAA,EAAE,UACvB,qBAAA,KAAA,CAAA,aAAA;AAAA,QAAC,gBAAA;AAAA,QAAA;AAAA,UACC,OACE,kBAAA,KAAA,CAAA,aAAA;AAAA,YAAC,QAAA;AAAA,YAAA;AAAA,cACC,IAAA;AAAA,cACA,WAAA;AAAA,cACA,OAAS,EAAA,QAAA;AAAA,aAAA;AAAA,WACX;AAAA,UAEF,KAAA,EAAO,WAAW,MAAM,CAAA;AAAA,SAAA;AAAA,OAC1B;AAAA,MAEF,IAAK,EAAA,OAAA;AAAA,MACL,SAAA,sCAAY,cAAe,EAAA,IAAA,CAAA;AAAA,MAC3B,aAAa,CAAU,MAAA,qBAAA,KAAA,CAAA,aAAA,CAAC,aAAW,GAAG,MAAA,EAAQ,SAAQ,UAAW,EAAA,CAAA;AAAA,KAAA;AAAA,GAErE,CAAA,CAAA;AAEJ;;;;"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@backstage/plugin-scaffolder-react",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.10.0-next.1",
|
|
4
4
|
"description": "A frontend library that helps other Backstage plugins interact with the Scaffolder",
|
|
5
5
|
"backstage": {
|
|
6
6
|
"role": "web-library",
|
|
@@ -59,9 +59,9 @@
|
|
|
59
59
|
"dependencies": {
|
|
60
60
|
"@backstage/catalog-client": "^1.6.5",
|
|
61
61
|
"@backstage/catalog-model": "^1.5.0",
|
|
62
|
-
"@backstage/core-components": "^0.14.
|
|
62
|
+
"@backstage/core-components": "^0.14.9-next.0",
|
|
63
63
|
"@backstage/core-plugin-api": "^1.9.3",
|
|
64
|
-
"@backstage/plugin-catalog-react": "^1.12.1",
|
|
64
|
+
"@backstage/plugin-catalog-react": "^1.12.2-next.1",
|
|
65
65
|
"@backstage/plugin-permission-react": "^0.4.23",
|
|
66
66
|
"@backstage/plugin-scaffolder-common": "^1.5.3",
|
|
67
67
|
"@backstage/theme": "^0.5.6",
|
|
@@ -71,10 +71,10 @@
|
|
|
71
71
|
"@material-ui/icons": "^4.9.1",
|
|
72
72
|
"@material-ui/lab": "4.0.0-alpha.61",
|
|
73
73
|
"@react-hookz/web": "^24.0.0",
|
|
74
|
-
"@rjsf/core": "5.18.
|
|
75
|
-
"@rjsf/material-ui": "5.18.
|
|
76
|
-
"@rjsf/utils": "5.18.
|
|
77
|
-
"@rjsf/validator-ajv8": "5.18.
|
|
74
|
+
"@rjsf/core": "5.18.5",
|
|
75
|
+
"@rjsf/material-ui": "5.18.5",
|
|
76
|
+
"@rjsf/utils": "5.18.5",
|
|
77
|
+
"@rjsf/validator-ajv8": "5.18.5",
|
|
78
78
|
"@types/json-schema": "^7.0.9",
|
|
79
79
|
"@types/react": "^16.13.1 || ^17.0.0 || ^18.0.0",
|
|
80
80
|
"classnames": "^2.2.6",
|
|
@@ -92,12 +92,12 @@
|
|
|
92
92
|
"zod-to-json-schema": "^3.20.4"
|
|
93
93
|
},
|
|
94
94
|
"devDependencies": {
|
|
95
|
-
"@backstage/cli": "^0.26.
|
|
96
|
-
"@backstage/core-app-api": "^1.
|
|
97
|
-
"@backstage/plugin-catalog": "^1.21.
|
|
95
|
+
"@backstage/cli": "^0.26.11-next.1",
|
|
96
|
+
"@backstage/core-app-api": "^1.13.1-next.1",
|
|
97
|
+
"@backstage/plugin-catalog": "^1.21.1-next.1",
|
|
98
98
|
"@backstage/plugin-catalog-common": "^1.0.24",
|
|
99
99
|
"@backstage/plugin-permission-common": "^0.7.14",
|
|
100
|
-
"@backstage/test-utils": "^1.5.
|
|
100
|
+
"@backstage/test-utils": "^1.5.8-next.1",
|
|
101
101
|
"@testing-library/dom": "^10.0.0",
|
|
102
102
|
"@testing-library/jest-dom": "^6.0.0",
|
|
103
103
|
"@testing-library/react": "^15.0.0",
|