@kartverket/backstage-plugin-risk-scorecard 5.0.1 → 5.1.0
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/dist/components/scenarioWizard/components/ConsequenceTable.esm.js +54 -97
- package/dist/components/scenarioWizard/components/ConsequenceTable.esm.js.map +1 -1
- package/dist/components/scenarioWizard/components/ProbabilityTable.esm.js +20 -60
- package/dist/components/scenarioWizard/components/ProbabilityTable.esm.js.map +1 -1
- package/dist/components/scenarioWizard/components/RiskTableBase.esm.js +63 -0
- package/dist/components/scenarioWizard/components/RiskTableBase.esm.js.map +1 -0
- package/package.json +1 -1
|
@@ -1,12 +1,10 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
2
2
|
import { pluginRiScTranslationRef } from '../../../utils/translations.esm.js';
|
|
3
3
|
import { useTranslationRef } from '@backstage/core-plugin-api/alpha';
|
|
4
|
-
import { useController } from 'react-hook-form';
|
|
5
|
-
import { RiskRadioButton } from './RiskRadioButton.esm.js';
|
|
6
|
-
import RadioGroup from '@mui/material/RadioGroup';
|
|
7
4
|
import { consequenceOptions } from '../../../utils/constants.esm.js';
|
|
8
5
|
import { Box, Text } from '@backstage/ui';
|
|
9
6
|
import styles from '../ScenarioWizardTable.module.css.esm.js';
|
|
7
|
+
import { createInfoWithHeadersComponent, RiskTableBase } from './RiskTableBase.esm.js';
|
|
10
8
|
|
|
11
9
|
function ConsequenceTableInfo() {
|
|
12
10
|
const { t } = useTranslationRef(pluginRiScTranslationRef);
|
|
@@ -16,107 +14,66 @@ function ConsequenceTableInfo() {
|
|
|
16
14
|
function getRow(resourceKey, cellType) {
|
|
17
15
|
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
18
16
|
/* @__PURE__ */ jsx(Box, { className: styles.riskLabelCell, children: /* @__PURE__ */ jsx(Text, { as: "p", variant: "body-large", weight: "bold", children: t(`consequenceTable.columns.${resourceKey}`) }) }),
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
getTextCell(resourceKey, 4, cellType[4])
|
|
17
|
+
Array.from(
|
|
18
|
+
{ length: 5 },
|
|
19
|
+
(_, i) => getTextCell(resourceKey, i, cellType[i])
|
|
20
|
+
)
|
|
24
21
|
] });
|
|
25
22
|
}
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
"
|
|
29
|
-
"riskCell",
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
"
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
"
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
"
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
]
|
|
23
|
+
const consequenceRows = [
|
|
24
|
+
{
|
|
25
|
+
key: "economical",
|
|
26
|
+
cells: ["riskCell", "riskCell", "riskCell", "riskCell", "riskCell"]
|
|
27
|
+
},
|
|
28
|
+
{
|
|
29
|
+
key: "privacy",
|
|
30
|
+
cells: ["riskCell", "riskCell", "riskCell", "riskCell", "riskVoidCell"]
|
|
31
|
+
},
|
|
32
|
+
{
|
|
33
|
+
key: "reputation",
|
|
34
|
+
cells: [
|
|
35
|
+
"riskCell",
|
|
36
|
+
"riskCell",
|
|
37
|
+
"riskCell",
|
|
38
|
+
"riskVoidCell",
|
|
39
|
+
"riskVoidCell"
|
|
40
|
+
]
|
|
41
|
+
},
|
|
42
|
+
{
|
|
43
|
+
key: "health",
|
|
44
|
+
cells: [
|
|
45
|
+
"riskVoidCell",
|
|
46
|
+
"riskVoidCell",
|
|
47
|
+
"riskCell",
|
|
48
|
+
"riskCell",
|
|
49
|
+
"riskCell"
|
|
50
|
+
]
|
|
51
|
+
}
|
|
52
|
+
];
|
|
53
|
+
return /* @__PURE__ */ jsx(Box, { className: styles.consequenceGrid, children: consequenceRows.map((row) => getRow(row.key, row.cells)) });
|
|
56
54
|
}
|
|
57
55
|
function ConsequenceTable({
|
|
58
56
|
formMethods,
|
|
59
57
|
riskType
|
|
60
58
|
}) {
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
value: consequenceOptions[row],
|
|
74
|
-
ref: field.ref,
|
|
75
|
-
label: getRadioLabel(row + 1)
|
|
76
|
-
}
|
|
77
|
-
);
|
|
78
|
-
}
|
|
79
|
-
return /* @__PURE__ */ jsxs(Box, { className: styles.riskTable, children: [
|
|
80
|
-
/* @__PURE__ */ jsxs(
|
|
81
|
-
RadioGroup,
|
|
82
|
-
{
|
|
83
|
-
...field,
|
|
84
|
-
className: `${styles.riskRow} ${styles.consequenceRow}`,
|
|
85
|
-
children: [
|
|
86
|
-
/* @__PURE__ */ jsx(Box, { className: styles.riskLabelCell }),
|
|
87
|
-
getRadioCell(0),
|
|
88
|
-
getRadioCell(1),
|
|
89
|
-
getRadioCell(2),
|
|
90
|
-
getRadioCell(3),
|
|
91
|
-
getRadioCell(4)
|
|
92
|
-
]
|
|
93
|
-
}
|
|
94
|
-
),
|
|
95
|
-
/* @__PURE__ */ jsx(ConsequenceTableInfo, {})
|
|
96
|
-
] });
|
|
97
|
-
}
|
|
98
|
-
function ConsequenceTableInfoWithHeaders() {
|
|
99
|
-
const { t } = useTranslationRef(pluginRiScTranslationRef);
|
|
100
|
-
function getRadioLabel(row) {
|
|
101
|
-
return (
|
|
102
|
-
/* @ts-ignore Because ts can't typecheck strings agains our keys */
|
|
103
|
-
/* @__PURE__ */ jsx(Text, { as: "p", variant: "body-large", children: `${row}: ${t(
|
|
104
|
-
`consequenceTable.rows.${row}`
|
|
105
|
-
)}` })
|
|
106
|
-
);
|
|
107
|
-
}
|
|
108
|
-
return /* @__PURE__ */ jsxs(Box, { className: styles.riskTable, children: [
|
|
109
|
-
/* @__PURE__ */ jsxs(Box, { className: styles.consequenceGrid, children: [
|
|
110
|
-
/* @__PURE__ */ jsx(Box, { className: styles.riskLabelCell }),
|
|
111
|
-
getRadioLabel(1),
|
|
112
|
-
getRadioLabel(2),
|
|
113
|
-
getRadioLabel(3),
|
|
114
|
-
getRadioLabel(4),
|
|
115
|
-
getRadioLabel(5)
|
|
116
|
-
] }),
|
|
117
|
-
/* @__PURE__ */ jsx(ConsequenceTableInfo, {})
|
|
118
|
-
] });
|
|
59
|
+
return /* @__PURE__ */ jsx(
|
|
60
|
+
RiskTableBase,
|
|
61
|
+
{
|
|
62
|
+
formMethods,
|
|
63
|
+
riskType,
|
|
64
|
+
fieldName: "consequence",
|
|
65
|
+
options: consequenceOptions,
|
|
66
|
+
additionalClassName: styles.consequenceRow,
|
|
67
|
+
translationPrefix: "consequenceTable",
|
|
68
|
+
InfoComponent: ConsequenceTableInfo
|
|
69
|
+
}
|
|
70
|
+
);
|
|
119
71
|
}
|
|
72
|
+
const ConsequenceTableInfoWithHeaders = createInfoWithHeadersComponent(
|
|
73
|
+
"consequenceTable",
|
|
74
|
+
ConsequenceTableInfo,
|
|
75
|
+
true
|
|
76
|
+
);
|
|
120
77
|
|
|
121
78
|
export { ConsequenceTable, ConsequenceTableInfoWithHeaders };
|
|
122
79
|
//# sourceMappingURL=ConsequenceTable.esm.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ConsequenceTable.esm.js","sources":["../../../../src/components/scenarioWizard/components/ConsequenceTable.tsx"],"sourcesContent":["import { pluginRiScTranslationRef } from '../../../utils/translations';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport {
|
|
1
|
+
{"version":3,"file":"ConsequenceTable.esm.js","sources":["../../../../src/components/scenarioWizard/components/ConsequenceTable.tsx"],"sourcesContent":["import { pluginRiScTranslationRef } from '../../../utils/translations';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { UseFormReturn } from 'react-hook-form';\nimport { FormScenario } from '../../../utils/types';\nimport { consequenceOptions } from '../../../utils/constants';\nimport { Text, Box } from '@backstage/ui';\nimport styles from '../ScenarioWizardTable.module.css';\nimport { createInfoWithHeadersComponent, RiskTableBase } from './RiskTableBase';\n\nfunction ConsequenceTableInfo() {\n const { t } = useTranslationRef(pluginRiScTranslationRef);\n\n function getTextCell(\n resourceKey: string,\n row: number,\n cellType: keyof typeof styles,\n ) {\n return (\n <Box className={styles[cellType]}>\n {/* @ts-ignore */}\n {t(`consequenceTable.cells.${resourceKey}.${row + 1}`)}\n </Box>\n );\n }\n\n function getRow(resourceKey: string, cellType: Array<keyof typeof styles>) {\n return (\n <>\n <Box className={styles.riskLabelCell}>\n <Text as=\"p\" variant=\"body-large\" weight=\"bold\">\n {/* @ts-ignore */}\n {t(`consequenceTable.columns.${resourceKey}`)}\n </Text>\n </Box>\n {Array.from({ length: 5 }, (_, i) =>\n getTextCell(resourceKey, i, cellType[i]),\n )}\n </>\n );\n }\n\n const consequenceRows = [\n {\n key: 'economical',\n cells: ['riskCell', 'riskCell', 'riskCell', 'riskCell', 'riskCell'],\n },\n {\n key: 'privacy',\n cells: ['riskCell', 'riskCell', 'riskCell', 'riskCell', 'riskVoidCell'],\n },\n {\n key: 'reputation',\n cells: [\n 'riskCell',\n 'riskCell',\n 'riskCell',\n 'riskVoidCell',\n 'riskVoidCell',\n ],\n },\n {\n key: 'health',\n cells: [\n 'riskVoidCell',\n 'riskVoidCell',\n 'riskCell',\n 'riskCell',\n 'riskCell',\n ],\n },\n ];\n\n return (\n <Box className={styles.consequenceGrid}>\n {consequenceRows.map(row => getRow(row.key, row.cells))}\n </Box>\n );\n}\n\nexport function ConsequenceTable({\n formMethods,\n riskType,\n}: {\n formMethods: UseFormReturn<FormScenario>;\n riskType: keyof Pick<FormScenario, 'risk' | 'remainingRisk'>;\n}) {\n return (\n <RiskTableBase\n formMethods={formMethods}\n riskType={riskType}\n fieldName=\"consequence\"\n options={consequenceOptions}\n additionalClassName={styles.consequenceRow}\n translationPrefix=\"consequenceTable\"\n InfoComponent={ConsequenceTableInfo}\n />\n );\n}\n\nexport const ConsequenceTableInfoWithHeaders = createInfoWithHeadersComponent(\n 'consequenceTable',\n ConsequenceTableInfo,\n true,\n);\n"],"names":[],"mappings":";;;;;;;;AASA,SAAS,oBAAA,GAAuB;AAC9B,EAAA,MAAM,EAAE,CAAA,EAAE,GAAI,iBAAA,CAAkB,wBAAwB,CAAA;AAExD,EAAA,SAAS,WAAA,CACP,WAAA,EACA,GAAA,EACA,QAAA,EACA;AACA,IAAA,uBACE,GAAA,CAAC,GAAA,EAAA,EAAI,SAAA,EAAW,MAAA,CAAO,QAAQ,CAAA,EAE5B,QAAA,EAAA,CAAA,CAAE,CAAA,uBAAA,EAA0B,WAAW,CAAA,CAAA,EAAI,GAAA,GAAM,CAAC,EAAE,CAAA,EACvD,CAAA;AAAA,EAEJ;AAEA,EAAA,SAAS,MAAA,CAAO,aAAqB,QAAA,EAAsC;AACzE,IAAA,uBACE,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,sBAAA,GAAA,CAAC,OAAI,SAAA,EAAW,MAAA,CAAO,aAAA,EACrB,QAAA,kBAAA,GAAA,CAAC,QAAK,EAAA,EAAG,GAAA,EAAI,OAAA,EAAQ,YAAA,EAAa,QAAO,MAAA,EAEtC,QAAA,EAAA,CAAA,CAAE,4BAA4B,WAAW,CAAA,CAAE,GAC9C,CAAA,EACF,CAAA;AAAA,MACC,KAAA,CAAM,IAAA;AAAA,QAAK,EAAE,QAAQ,CAAA,EAAE;AAAA,QAAG,CAAC,GAAG,CAAA,KAC7B,WAAA,CAAY,aAAa,CAAA,EAAG,QAAA,CAAS,CAAC,CAAC;AAAA;AACzC,KAAA,EACF,CAAA;AAAA,EAEJ;AAEA,EAAA,MAAM,eAAA,GAAkB;AAAA,IACtB;AAAA,MACE,GAAA,EAAK,YAAA;AAAA,MACL,OAAO,CAAC,UAAA,EAAY,UAAA,EAAY,UAAA,EAAY,YAAY,UAAU;AAAA,KACpE;AAAA,IACA;AAAA,MACE,GAAA,EAAK,SAAA;AAAA,MACL,OAAO,CAAC,UAAA,EAAY,UAAA,EAAY,UAAA,EAAY,YAAY,cAAc;AAAA,KACxE;AAAA,IACA;AAAA,MACE,GAAA,EAAK,YAAA;AAAA,MACL,KAAA,EAAO;AAAA,QACL,UAAA;AAAA,QACA,UAAA;AAAA,QACA,UAAA;AAAA,QACA,cAAA;AAAA,QACA;AAAA;AACF,KACF;AAAA,IACA;AAAA,MACE,GAAA,EAAK,QAAA;AAAA,MACL,KAAA,EAAO;AAAA,QACL,cAAA;AAAA,QACA,cAAA;AAAA,QACA,UAAA;AAAA,QACA,UAAA;AAAA,QACA;AAAA;AACF;AACF,GACF;AAEA,EAAA,uBACE,GAAA,CAAC,GAAA,EAAA,EAAI,SAAA,EAAW,MAAA,CAAO,iBACpB,QAAA,EAAA,eAAA,CAAgB,GAAA,CAAI,CAAA,GAAA,KAAO,MAAA,CAAO,GAAA,CAAI,GAAA,EAAK,GAAA,CAAI,KAAK,CAAC,CAAA,EACxD,CAAA;AAEJ;AAEO,SAAS,gBAAA,CAAiB;AAAA,EAC/B,WAAA;AAAA,EACA;AACF,CAAA,EAGG;AACD,EAAA,uBACE,GAAA;AAAA,IAAC,aAAA;AAAA,IAAA;AAAA,MACC,WAAA;AAAA,MACA,QAAA;AAAA,MACA,SAAA,EAAU,aAAA;AAAA,MACV,OAAA,EAAS,kBAAA;AAAA,MACT,qBAAqB,MAAA,CAAO,cAAA;AAAA,MAC5B,iBAAA,EAAkB,kBAAA;AAAA,MAClB,aAAA,EAAe;AAAA;AAAA,GACjB;AAEJ;AAEO,MAAM,+BAAA,GAAkC,8BAAA;AAAA,EAC7C,kBAAA;AAAA,EACA,oBAAA;AAAA,EACA;AACF;;;;"}
|
|
@@ -1,79 +1,39 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { jsx } from 'react/jsx-runtime';
|
|
2
2
|
import { pluginRiScTranslationRef } from '../../../utils/translations.esm.js';
|
|
3
3
|
import { useTranslationRef } from '@backstage/core-plugin-api/alpha';
|
|
4
|
-
import { useController } from 'react-hook-form';
|
|
5
|
-
import { RiskRadioButton } from './RiskRadioButton.esm.js';
|
|
6
|
-
import RadioGroup from '@mui/material/RadioGroup';
|
|
7
4
|
import { probabilityOptions } from '../../../utils/constants.esm.js';
|
|
8
|
-
import { Box
|
|
5
|
+
import { Box } from '@backstage/ui';
|
|
9
6
|
import styles from '../ScenarioWizardTable.module.css.esm.js';
|
|
7
|
+
import { createInfoWithHeadersComponent, RiskTableBase } from './RiskTableBase.esm.js';
|
|
10
8
|
|
|
11
9
|
function ProbabilityTableInfo() {
|
|
12
10
|
const { t } = useTranslationRef(pluginRiScTranslationRef);
|
|
13
11
|
function getContentCell(row) {
|
|
14
12
|
return /* @__PURE__ */ jsx(Box, { className: styles.riskCell, children: t(`probabilityTable.cells.${row + 1}`) });
|
|
15
13
|
}
|
|
16
|
-
return /* @__PURE__ */
|
|
17
|
-
getContentCell(0),
|
|
18
|
-
getContentCell(1),
|
|
19
|
-
getContentCell(2),
|
|
20
|
-
getContentCell(3),
|
|
21
|
-
getContentCell(4)
|
|
22
|
-
] });
|
|
14
|
+
return /* @__PURE__ */ jsx(Box, { className: styles.riskRow, children: Array.from({ length: 5 }, (_, i) => getContentCell(i)) });
|
|
23
15
|
}
|
|
24
16
|
function ProbabilityTable({
|
|
25
17
|
formMethods,
|
|
26
18
|
riskType
|
|
27
19
|
}) {
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
{
|
|
40
|
-
value: probabilityOptions[row],
|
|
41
|
-
ref: field.ref,
|
|
42
|
-
label: getRadioLabel(row + 1)
|
|
43
|
-
}
|
|
44
|
-
);
|
|
45
|
-
}
|
|
46
|
-
return /* @__PURE__ */ jsxs(Box, { className: styles.riskTable, children: [
|
|
47
|
-
/* @__PURE__ */ jsxs(RadioGroup, { ...field, className: styles.riskRow, children: [
|
|
48
|
-
getRadioCell(0),
|
|
49
|
-
getRadioCell(1),
|
|
50
|
-
getRadioCell(2),
|
|
51
|
-
getRadioCell(3),
|
|
52
|
-
getRadioCell(4)
|
|
53
|
-
] }),
|
|
54
|
-
/* @__PURE__ */ jsx(ProbabilityTableInfo, {})
|
|
55
|
-
] });
|
|
56
|
-
}
|
|
57
|
-
function ProbabilityTableInfoWithHeaders() {
|
|
58
|
-
const { t } = useTranslationRef(pluginRiScTranslationRef);
|
|
59
|
-
function getRadioLabel(row) {
|
|
60
|
-
return (
|
|
61
|
-
/* @ts-ignore Because ts can't typecheck strings agains our keys */
|
|
62
|
-
/* @__PURE__ */ jsx(Text, { children: `${row}: ${t(`probabilityTable.rows.${row}`)}` })
|
|
63
|
-
);
|
|
64
|
-
}
|
|
65
|
-
return /* @__PURE__ */ jsxs(Box, { className: styles.riskTable, children: [
|
|
66
|
-
/* @__PURE__ */ jsxs(Box, { className: styles.consequenceGrid, children: [
|
|
67
|
-
/* @__PURE__ */ jsx(Box, { className: styles.riskLabelCell }),
|
|
68
|
-
getRadioLabel(1),
|
|
69
|
-
getRadioLabel(2),
|
|
70
|
-
getRadioLabel(3),
|
|
71
|
-
getRadioLabel(4),
|
|
72
|
-
getRadioLabel(5)
|
|
73
|
-
] }),
|
|
74
|
-
/* @__PURE__ */ jsx(ProbabilityTableInfo, {})
|
|
75
|
-
] });
|
|
20
|
+
return /* @__PURE__ */ jsx(
|
|
21
|
+
RiskTableBase,
|
|
22
|
+
{
|
|
23
|
+
formMethods,
|
|
24
|
+
riskType,
|
|
25
|
+
fieldName: "probability",
|
|
26
|
+
options: probabilityOptions,
|
|
27
|
+
translationPrefix: "probabilityTable",
|
|
28
|
+
InfoComponent: ProbabilityTableInfo
|
|
29
|
+
}
|
|
30
|
+
);
|
|
76
31
|
}
|
|
32
|
+
const ProbabilityTableInfoWithHeaders = createInfoWithHeadersComponent(
|
|
33
|
+
"probabilityTable",
|
|
34
|
+
ProbabilityTableInfo,
|
|
35
|
+
false
|
|
36
|
+
);
|
|
77
37
|
|
|
78
38
|
export { ProbabilityTable, ProbabilityTableInfoWithHeaders };
|
|
79
39
|
//# sourceMappingURL=ProbabilityTable.esm.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ProbabilityTable.esm.js","sources":["../../../../src/components/scenarioWizard/components/ProbabilityTable.tsx"],"sourcesContent":["import { pluginRiScTranslationRef } from '../../../utils/translations';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport {
|
|
1
|
+
{"version":3,"file":"ProbabilityTable.esm.js","sources":["../../../../src/components/scenarioWizard/components/ProbabilityTable.tsx"],"sourcesContent":["import { pluginRiScTranslationRef } from '../../../utils/translations';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { UseFormReturn } from 'react-hook-form';\nimport { FormScenario } from '../../../utils/types';\nimport { probabilityOptions } from '../../../utils/constants';\nimport { Box } from '@backstage/ui';\nimport styles from '../ScenarioWizardTable.module.css';\nimport { createInfoWithHeadersComponent, RiskTableBase } from './RiskTableBase';\n\nfunction ProbabilityTableInfo() {\n const { t } = useTranslationRef(pluginRiScTranslationRef);\n function getContentCell(row: number) {\n return (\n <Box className={styles.riskCell}>\n {/* @ts-ignore */}\n {t(`probabilityTable.cells.${row + 1}`)}\n </Box>\n );\n }\n\n return (\n <Box className={styles.riskRow}>\n {Array.from({ length: 5 }, (_, i) => getContentCell(i))}\n </Box>\n );\n}\n\nexport function ProbabilityTable({\n formMethods,\n riskType,\n}: {\n formMethods: UseFormReturn<FormScenario>;\n riskType: keyof Pick<FormScenario, 'risk' | 'remainingRisk'>;\n}) {\n return (\n <RiskTableBase\n formMethods={formMethods}\n riskType={riskType}\n fieldName=\"probability\"\n options={probabilityOptions}\n translationPrefix=\"probabilityTable\"\n InfoComponent={ProbabilityTableInfo}\n />\n );\n}\n\nexport const ProbabilityTableInfoWithHeaders = createInfoWithHeadersComponent(\n 'probabilityTable',\n ProbabilityTableInfo,\n false,\n);\n"],"names":[],"mappings":";;;;;;;;AASA,SAAS,oBAAA,GAAuB;AAC9B,EAAA,MAAM,EAAE,CAAA,EAAE,GAAI,iBAAA,CAAkB,wBAAwB,CAAA;AACxD,EAAA,SAAS,eAAe,GAAA,EAAa;AACnC,IAAA,uBACE,GAAA,CAAC,GAAA,EAAA,EAAI,SAAA,EAAW,MAAA,CAAO,QAAA,EAEpB,YAAE,CAAA,uBAAA,EAA0B,GAAA,GAAM,CAAC,CAAA,CAAE,CAAA,EACxC,CAAA;AAAA,EAEJ;AAEA,EAAA,2BACG,GAAA,EAAA,EAAI,SAAA,EAAW,MAAA,CAAO,OAAA,EACpB,gBAAM,IAAA,CAAK,EAAE,MAAA,EAAQ,CAAA,IAAK,CAAC,CAAA,EAAG,MAAM,cAAA,CAAe,CAAC,CAAC,CAAA,EACxD,CAAA;AAEJ;AAEO,SAAS,gBAAA,CAAiB;AAAA,EAC/B,WAAA;AAAA,EACA;AACF,CAAA,EAGG;AACD,EAAA,uBACE,GAAA;AAAA,IAAC,aAAA;AAAA,IAAA;AAAA,MACC,WAAA;AAAA,MACA,QAAA;AAAA,MACA,SAAA,EAAU,aAAA;AAAA,MACV,OAAA,EAAS,kBAAA;AAAA,MACT,iBAAA,EAAkB,kBAAA;AAAA,MAClB,aAAA,EAAe;AAAA;AAAA,GACjB;AAEJ;AAEO,MAAM,+BAAA,GAAkC,8BAAA;AAAA,EAC7C,kBAAA;AAAA,EACA,oBAAA;AAAA,EACA;AACF;;;;"}
|
|
@@ -0,0 +1,63 @@
|
|
|
1
|
+
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { pluginRiScTranslationRef } from '../../../utils/translations.esm.js';
|
|
3
|
+
import { useTranslationRef } from '@backstage/core-plugin-api/alpha';
|
|
4
|
+
import { useController } from 'react-hook-form';
|
|
5
|
+
import { RiskRadioButton } from './RiskRadioButton.esm.js';
|
|
6
|
+
import RadioGroup from '@mui/material/RadioGroup';
|
|
7
|
+
import { Box, Text } from '@backstage/ui';
|
|
8
|
+
import styles from '../ScenarioWizardTable.module.css.esm.js';
|
|
9
|
+
|
|
10
|
+
function RiskTableBase({
|
|
11
|
+
formMethods,
|
|
12
|
+
riskType,
|
|
13
|
+
fieldName,
|
|
14
|
+
options,
|
|
15
|
+
additionalClassName = "",
|
|
16
|
+
translationPrefix,
|
|
17
|
+
InfoComponent
|
|
18
|
+
}) {
|
|
19
|
+
const { t } = useTranslationRef(pluginRiScTranslationRef);
|
|
20
|
+
const { field } = useController({
|
|
21
|
+
name: `${riskType}.${fieldName}`,
|
|
22
|
+
control: formMethods.control
|
|
23
|
+
});
|
|
24
|
+
function getRadioLabel(row) {
|
|
25
|
+
return `${row}: ${t(`${translationPrefix}.rows.${row}`)}`;
|
|
26
|
+
}
|
|
27
|
+
function getRadioCell(row) {
|
|
28
|
+
return /* @__PURE__ */ jsx(
|
|
29
|
+
RiskRadioButton,
|
|
30
|
+
{
|
|
31
|
+
value: options[row],
|
|
32
|
+
ref: field.ref,
|
|
33
|
+
label: getRadioLabel(row + 1)
|
|
34
|
+
}
|
|
35
|
+
);
|
|
36
|
+
}
|
|
37
|
+
const radioGroupClassName = additionalClassName ? `${styles.riskRow} ${additionalClassName}` : styles.riskRow;
|
|
38
|
+
return /* @__PURE__ */ jsxs(Box, { className: styles.riskTable, children: [
|
|
39
|
+
/* @__PURE__ */ jsxs(RadioGroup, { ...field, className: radioGroupClassName, children: [
|
|
40
|
+
fieldName === "consequence" && /* @__PURE__ */ jsx(Box, { className: styles.riskLabelCell }),
|
|
41
|
+
Array.from({ length: 5 }, (_, i) => getRadioCell(i))
|
|
42
|
+
] }),
|
|
43
|
+
/* @__PURE__ */ jsx(InfoComponent, {})
|
|
44
|
+
] });
|
|
45
|
+
}
|
|
46
|
+
function createInfoWithHeadersComponent(translationPrefix, InfoComponent, includeLabel = false) {
|
|
47
|
+
return function InfoWithHeaders() {
|
|
48
|
+
const { t } = useTranslationRef(pluginRiScTranslationRef);
|
|
49
|
+
function getRadioLabel(row) {
|
|
50
|
+
return /* @__PURE__ */ jsx(Text, { as: "p", variant: "body-large", children: `${row}: ${t(`${translationPrefix}.rows.${row}`)}` });
|
|
51
|
+
}
|
|
52
|
+
return /* @__PURE__ */ jsxs(Box, { className: styles.riskTable, children: [
|
|
53
|
+
/* @__PURE__ */ jsxs(Box, { className: styles.consequenceGrid, children: [
|
|
54
|
+
includeLabel && /* @__PURE__ */ jsx(Box, { className: styles.riskLabelCell }),
|
|
55
|
+
Array.from({ length: 5 }, (_, i) => getRadioLabel(i))
|
|
56
|
+
] }),
|
|
57
|
+
/* @__PURE__ */ jsx(InfoComponent, {})
|
|
58
|
+
] });
|
|
59
|
+
};
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
export { RiskTableBase, createInfoWithHeadersComponent };
|
|
63
|
+
//# sourceMappingURL=RiskTableBase.esm.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"RiskTableBase.esm.js","sources":["../../../../src/components/scenarioWizard/components/RiskTableBase.tsx"],"sourcesContent":["import { pluginRiScTranslationRef } from '../../../utils/translations';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { useController, UseFormReturn } from 'react-hook-form';\nimport { FormScenario } from '../../../utils/types';\nimport { RiskRadioButton } from './RiskRadioButton';\nimport RadioGroup from '@mui/material/RadioGroup';\nimport { Text, Box } from '@backstage/ui';\nimport styles from '../ScenarioWizardTable.module.css';\nimport React from 'react';\n\ntype RiskTableBaseProps = {\n formMethods: UseFormReturn<FormScenario>;\n riskType: keyof Pick<FormScenario, 'risk' | 'remainingRisk'>;\n fieldName: 'probability' | 'consequence';\n translationPrefix: 'probabilityTable' | 'consequenceTable';\n options: readonly number[];\n additionalClassName?: string;\n InfoComponent: React.ComponentType;\n};\n\nexport function RiskTableBase({\n formMethods,\n riskType,\n fieldName,\n options,\n additionalClassName = '',\n translationPrefix,\n InfoComponent,\n}: RiskTableBaseProps) {\n const { t } = useTranslationRef(pluginRiScTranslationRef);\n\n const { field } = useController({\n name: `${riskType}.${fieldName}`,\n control: formMethods.control,\n });\n\n function getRadioLabel(row: number) {\n /* @ts-ignore Because ts can't typecheck strings against our keys */\n return `${row}: ${t(`${translationPrefix}.rows.${row}`)}`;\n }\n\n function getRadioCell(row: number) {\n return (\n <RiskRadioButton\n value={options[row]}\n ref={field.ref}\n label={getRadioLabel(row + 1)}\n />\n );\n }\n\n const radioGroupClassName = additionalClassName\n ? `${styles.riskRow} ${additionalClassName}`\n : styles.riskRow;\n\n return (\n <Box className={styles.riskTable}>\n <RadioGroup {...field} className={radioGroupClassName}>\n {fieldName === 'consequence' && (\n <Box className={styles.riskLabelCell} />\n )}\n {Array.from({ length: 5 }, (_, i) => getRadioCell(i))}\n </RadioGroup>\n <InfoComponent />\n </Box>\n );\n}\n\nexport function createInfoWithHeadersComponent(\n translationPrefix: 'probabilityTable' | 'consequenceTable',\n InfoComponent: React.ComponentType,\n includeLabel: boolean = false,\n) {\n return function InfoWithHeaders() {\n const { t } = useTranslationRef(pluginRiScTranslationRef);\n\n function getRadioLabel(row: number) {\n return (\n <Text as=\"p\" variant=\"body-large\">\n {/* @ts-ignore Because ts can't typecheck strings against our keys */}\n {`${row}: ${t(`${translationPrefix}.rows.${row}`)}`}\n </Text>\n );\n }\n return (\n <Box className={styles.riskTable}>\n <Box className={styles.consequenceGrid}>\n {includeLabel && <Box className={styles.riskLabelCell} />}\n {Array.from({ length: 5 }, (_, i) => getRadioLabel(i))}\n </Box>\n <InfoComponent />\n </Box>\n );\n };\n}\n"],"names":[],"mappings":"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"}
|