@kartverket/backstage-plugin-risk-scorecard 6.1.4 → 6.1.6

package/dist/components/action/ActionURL.esm.js

@@ -2,6 +2,7 @@ import { jsxs, jsx } from 'react/jsx-runtime';
 import { Box, Text, Link } from '@backstage/ui';
 import { useTranslationRef } from '@backstage/core-plugin-api/alpha';
 import { pluginRiScTranslationRef } from '../../utils/translations.esm.js';
+import styles from './ActionURL.module.css.esm.js';
 
 function ActionURL(props) {
   const { t } = useTranslationRef(pluginRiScTranslationRef);
@@ -19,7 +20,7 @@ function ActionURL(props) {
         href: props.url.startsWith("http") ? props.url : `//${props.url}`,
         children: props.url
       }
-    ) : /* @__PURE__ */ jsx(Text, { as: "p", variant: "body-large", style: { fontStyle: "italic" }, children: t("dictionary.emptyField", {
+    ) : /* @__PURE__ */ jsx(Text, { as: "p", variant: "body-large", className: styles.emptyText, children: t("dictionary.emptyField", {
       field: t("dictionary.url").toLowerCase()
     }) })
   ] });

package/dist/components/action/ActionURL.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"ActionURL.esm.js","sources":["../../../src/components/action/ActionURL.tsx"],"sourcesContent":["import { Box, Link, Text } from '@backstage/ui';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { pluginRiScTranslationRef } from '../../utils/translations.ts';\n\ntype ActionURLProps = {\n  url: string;\n};\n\nexport function ActionURL(props: ActionURLProps) {\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n  return (\n    <Box mt=\"16px\">\n      <Text as=\"p\" variant=\"body-large\" weight=\"bold\">\n        {' '}\n        {t('dictionary.url')}\n      </Text>\n      {props.url ? (\n        <Link\n          target=\"_blank\"\n          variant=\"body-large\"\n          rel=\"noreferrer\"\n          href={props.url.startsWith('http') ? props.url : `//${props.url}`}\n        >\n          {props.url}\n        </Link>\n      ) : (\n        <Text as=\"p\" variant=\"body-large\" style={{ fontStyle: 'italic' }}>\n          {t('dictionary.emptyField', {\n            field: t('dictionary.url').toLowerCase(),\n          })}\n        </Text>\n      )}\n    </Box>\n  );\n}\n"],"names":[],"mappings":";;;;;AAQO,SAAS,UAAU,KAAA,EAAuB;AAC/C,EAAA,MAAM,EAAE,CAAA,EAAE,GAAI,iBAAA,CAAkB,wBAAwB,CAAA;AACxD,EAAA,uBACE,IAAA,CAAC,GAAA,EAAA,EAAI,EAAA,EAAG,MAAA,EACN,QAAA,EAAA;AAAA,oBAAA,IAAA,CAAC,QAAK,EAAA,EAAG,GAAA,EAAI,OAAA,EAAQ,YAAA,EAAa,QAAO,MAAA,EACtC,QAAA,EAAA;AAAA,MAAA,GAAA;AAAA,MACA,EAAE,gBAAgB;AAAA,KAAA,EACrB,CAAA;AAAA,IACC,MAAM,GAAA,mBACL,GAAA;AAAA,MAAC,IAAA;AAAA,MAAA;AAAA,QACC,MAAA,EAAO,QAAA;AAAA,QACP,OAAA,EAAQ,YAAA;AAAA,QACR,GAAA,EAAI,YAAA;AAAA,QACJ,IAAA,EAAM,KAAA,CAAM,GAAA,CAAI,UAAA,CAAW,MAAM,IAAI,KAAA,CAAM,GAAA,GAAM,CAAA,EAAA,EAAK,KAAA,CAAM,GAAG,CAAA,CAAA;AAAA,QAE9D,QAAA,EAAA,KAAA,CAAM;AAAA;AAAA,KACT,mBAEA,GAAA,CAAC,IAAA,EAAA,EAAK,EAAA,EAAG,GAAA,EAAI,OAAA,EAAQ,YAAA,EAAa,KAAA,EAAO,EAAE,SAAA,EAAW,QAAA,EAAS,EAC5D,YAAE,uBAAA,EAAyB;AAAA,MAC1B,KAAA,EAAO,CAAA,CAAE,gBAAgB,CAAA,CAAE,WAAA;AAAY,KACxC,CAAA,EACH;AAAA,GAAA,EAEJ,CAAA;AAEJ;;;;"}
+{"version":3,"file":"ActionURL.esm.js","sources":["../../../src/components/action/ActionURL.tsx"],"sourcesContent":["import { Box, Link, Text } from '@backstage/ui';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { pluginRiScTranslationRef } from '../../utils/translations.ts';\nimport styles from './ActionURL.module.css';\n\ntype ActionURLProps = {\n  url: string;\n};\n\nexport function ActionURL(props: ActionURLProps) {\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n  return (\n    <Box mt=\"16px\">\n      <Text as=\"p\" variant=\"body-large\" weight=\"bold\">\n        {' '}\n        {t('dictionary.url')}\n      </Text>\n      {props.url ? (\n        <Link\n          target=\"_blank\"\n          variant=\"body-large\"\n          rel=\"noreferrer\"\n          href={props.url.startsWith('http') ? props.url : `//${props.url}`}\n        >\n          {props.url}\n        </Link>\n      ) : (\n        <Text as=\"p\" variant=\"body-large\" className={styles.emptyText}>\n          {t('dictionary.emptyField', {\n            field: t('dictionary.url').toLowerCase(),\n          })}\n        </Text>\n      )}\n    </Box>\n  );\n}\n"],"names":[],"mappings":";;;;;;AASO,SAAS,UAAU,KAAA,EAAuB;AAC/C,EAAA,MAAM,EAAE,CAAA,EAAE,GAAI,iBAAA,CAAkB,wBAAwB,CAAA;AACxD,EAAA,uBACE,IAAA,CAAC,GAAA,EAAA,EAAI,EAAA,EAAG,MAAA,EACN,QAAA,EAAA;AAAA,oBAAA,IAAA,CAAC,QAAK,EAAA,EAAG,GAAA,EAAI,OAAA,EAAQ,YAAA,EAAa,QAAO,MAAA,EACtC,QAAA,EAAA;AAAA,MAAA,GAAA;AAAA,MACA,EAAE,gBAAgB;AAAA,KAAA,EACrB,CAAA;AAAA,IACC,MAAM,GAAA,mBACL,GAAA;AAAA,MAAC,IAAA;AAAA,MAAA;AAAA,QACC,MAAA,EAAO,QAAA;AAAA,QACP,OAAA,EAAQ,YAAA;AAAA,QACR,GAAA,EAAI,YAAA;AAAA,QACJ,IAAA,EAAM,KAAA,CAAM,GAAA,CAAI,UAAA,CAAW,MAAM,IAAI,KAAA,CAAM,GAAA,GAAM,CAAA,EAAA,EAAK,KAAA,CAAM,GAAG,CAAA,CAAA;AAAA,QAE9D,QAAA,EAAA,KAAA,CAAM;AAAA;AAAA,KACT,mBAEA,GAAA,CAAC,IAAA,EAAA,EAAK,EAAA,EAAG,GAAA,EAAI,OAAA,EAAQ,YAAA,EAAa,SAAA,EAAW,MAAA,CAAO,SAAA,EACjD,QAAA,EAAA,CAAA,CAAE,uBAAA,EAAyB;AAAA,MAC1B,KAAA,EAAO,CAAA,CAAE,gBAAgB,CAAA,CAAE,WAAA;AAAY,KACxC,CAAA,EACH;AAAA,GAAA,EAEJ,CAAA;AAEJ;;;;"}

package/dist/components/action/ActionURL.module.css.esm.js

@@ -0,0 +1,8 @@
+import styleInject from '../../node_modules_dist/style-inject/dist/style-inject.es.esm.js';
+
+var css_248z = ".ActionURL_emptyText__de02e3f2ac {\n  font-style: italic;\n}\n";
+var styles = {"emptyText":"ActionURL_emptyText__de02e3f2ac"};
+styleInject(css_248z);
+
+export { styles as default };
+//# sourceMappingURL=ActionURL.module.css.esm.js.map

package/dist/components/action/ActionURL.module.css.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ActionURL.module.css.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}

package/dist/components/common/AlertBar/AlertBar.esm.js

@@ -32,7 +32,7 @@ function AlertBar({ updateStatus, response, statusText }) {
       {
         severity,
         className: `${styles.alertBar} ${severityClass}`,
-        children: /* @__PURE__ */ jsx(Text, { variant: "body-large", style: { whiteSpace: "pre-line" }, children: statusText })
+        children: /* @__PURE__ */ jsx(Text, { variant: "body-large", className: styles.preLineText, children: statusText })
       }
     );
   }

package/dist/components/common/AlertBar/AlertBar.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"AlertBar.esm.js","sources":["../../../../src/components/common/AlertBar/AlertBar.tsx"],"sourcesContent":["import Alert from '@mui/material/Alert';\nimport styles from '../alertBar.module.css';\nimport { UpdateStatus } from '../../../contexts/RiScContext';\nimport { SubmitResponseObject } from '../../../utils/types';\nimport { AlertTitle, CircularProgress } from '@mui/material';\nimport { getAlertSeverity } from '../../../utils/utilityfunctions';\nimport { Text } from '@backstage/ui';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { pluginRiScTranslationRef } from '../../../utils/translations.ts';\n\ntype Props = {\n  updateStatus: UpdateStatus;\n  response: SubmitResponseObject | null;\n  statusText?: string;\n};\n\nfunction AlertBar({ updateStatus, response, statusText }: Props) {\n  const severity = getAlertSeverity(updateStatus, response ?? undefined);\n  const severityClass = (styles as any)[severity] || '';\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n\n  if (!updateStatus) return null; // Prevents error if prop is missing\n\n  if (updateStatus.isLoading) {\n    return (\n      <Alert\n        severity=\"info\"\n        className={`${styles.alertBar} ${styles.info}`}\n        icon={<CircularProgress size={16} sx={{ color: 'inherit' }} />}\n      >\n        <AlertTitle>{t('infoMessages.UpdateAction')}</AlertTitle>\n        <Text variant=\"body-large\">{t('infoMessages.UpdateInfoMessage')}</Text>\n      </Alert>\n    );\n  }\n  if (response) {\n    return (\n      <Alert\n        severity={severity}\n        className={`${styles.alertBar} ${severityClass}`}\n      >\n        <Text variant=\"body-large\" style={{ whiteSpace: 'pre-line' }}>\n          {statusText}\n        </Text>\n      </Alert>\n    );\n  }\n  return null;\n}\n\nexport default AlertBar;\n"],"names":[],"mappings":";;;;;;;;;AAgBA,SAAS,QAAA,CAAS,EAAE,YAAA,EAAc,QAAA,EAAU,YAAW,EAAU;AAC/D,EAAA,MAAM,QAAA,GAAW,gBAAA,CAAiB,YAAA,EAAc,QAAA,IAAY,MAAS,CAAA;AACrE,EAAA,MAAM,aAAA,GAAiB,MAAA,CAAe,QAAQ,CAAA,IAAK,EAAA;AACnD,EAAA,MAAM,EAAE,CAAA,EAAE,GAAI,iBAAA,CAAkB,wBAAwB,CAAA;AAExD,EAAA,IAAI,CAAC,cAAc,OAAO,IAAA;AAE1B,EAAA,IAAI,aAAa,SAAA,EAAW;AAC1B,IAAA,uBACE,IAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,QAAA,EAAS,MAAA;AAAA,QACT,WAAW,CAAA,EAAG,MAAA,CAAO,QAAQ,CAAA,CAAA,EAAI,OAAO,IAAI,CAAA,CAAA;AAAA,QAC5C,IAAA,sBAAO,gBAAA,EAAA,EAAiB,IAAA,EAAM,IAAI,EAAA,EAAI,EAAE,KAAA,EAAO,SAAA,EAAU,EAAG,CAAA;AAAA,QAE5D,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,UAAA,EAAA,EAAY,QAAA,EAAA,CAAA,CAAE,2BAA2B,CAAA,EAAE,CAAA;AAAA,8BAC3C,IAAA,EAAA,EAAK,OAAA,EAAQ,YAAA,EAAc,QAAA,EAAA,CAAA,CAAE,gCAAgC,CAAA,EAAE;AAAA;AAAA;AAAA,KAClE;AAAA,EAEJ;AACA,EAAA,IAAI,QAAA,EAAU;AACZ,IAAA,uBACE,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,QAAA;AAAA,QACA,SAAA,EAAW,CAAA,EAAG,MAAA,CAAO,QAAQ,IAAI,aAAa,CAAA,CAAA;AAAA,QAE9C,QAAA,kBAAA,GAAA,CAAC,QAAK,OAAA,EAAQ,YAAA,EAAa,OAAO,EAAE,UAAA,EAAY,UAAA,EAAW,EACxD,QAAA,EAAA,UAAA,EACH;AAAA;AAAA,KACF;AAAA,EAEJ;AACA,EAAA,OAAO,IAAA;AACT;;;;"}
+{"version":3,"file":"AlertBar.esm.js","sources":["../../../../src/components/common/AlertBar/AlertBar.tsx"],"sourcesContent":["import Alert from '@mui/material/Alert';\nimport styles from '../alertBar.module.css';\nimport { UpdateStatus } from '../../../contexts/RiScContext';\nimport { SubmitResponseObject } from '../../../utils/types';\nimport { AlertTitle, CircularProgress } from '@mui/material';\nimport { getAlertSeverity } from '../../../utils/utilityfunctions';\nimport { Text } from '@backstage/ui';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { pluginRiScTranslationRef } from '../../../utils/translations.ts';\n\ntype Props = {\n  updateStatus: UpdateStatus;\n  response: SubmitResponseObject | null;\n  statusText?: string;\n};\n\nfunction AlertBar({ updateStatus, response, statusText }: Props) {\n  const severity = getAlertSeverity(updateStatus, response ?? undefined);\n  const severityClass = (styles as any)[severity] || '';\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n\n  if (!updateStatus) return null; // Prevents error if prop is missing\n\n  if (updateStatus.isLoading) {\n    return (\n      <Alert\n        severity=\"info\"\n        className={`${styles.alertBar} ${styles.info}`}\n        icon={<CircularProgress size={16} sx={{ color: 'inherit' }} />}\n      >\n        <AlertTitle>{t('infoMessages.UpdateAction')}</AlertTitle>\n        <Text variant=\"body-large\">{t('infoMessages.UpdateInfoMessage')}</Text>\n      </Alert>\n    );\n  }\n  if (response) {\n    return (\n      <Alert\n        severity={severity}\n        className={`${styles.alertBar} ${severityClass}`}\n      >\n        <Text variant=\"body-large\" className={styles.preLineText}>\n          {statusText}\n        </Text>\n      </Alert>\n    );\n  }\n  return null;\n}\n\nexport default AlertBar;\n"],"names":[],"mappings":";;;;;;;;;AAgBA,SAAS,QAAA,CAAS,EAAE,YAAA,EAAc,QAAA,EAAU,YAAW,EAAU;AAC/D,EAAA,MAAM,QAAA,GAAW,gBAAA,CAAiB,YAAA,EAAc,QAAA,IAAY,MAAS,CAAA;AACrE,EAAA,MAAM,aAAA,GAAiB,MAAA,CAAe,QAAQ,CAAA,IAAK,EAAA;AACnD,EAAA,MAAM,EAAE,CAAA,EAAE,GAAI,iBAAA,CAAkB,wBAAwB,CAAA;AAExD,EAAA,IAAI,CAAC,cAAc,OAAO,IAAA;AAE1B,EAAA,IAAI,aAAa,SAAA,EAAW;AAC1B,IAAA,uBACE,IAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,QAAA,EAAS,MAAA;AAAA,QACT,WAAW,CAAA,EAAG,MAAA,CAAO,QAAQ,CAAA,CAAA,EAAI,OAAO,IAAI,CAAA,CAAA;AAAA,QAC5C,IAAA,sBAAO,gBAAA,EAAA,EAAiB,IAAA,EAAM,IAAI,EAAA,EAAI,EAAE,KAAA,EAAO,SAAA,EAAU,EAAG,CAAA;AAAA,QAE5D,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,UAAA,EAAA,EAAY,QAAA,EAAA,CAAA,CAAE,2BAA2B,CAAA,EAAE,CAAA;AAAA,8BAC3C,IAAA,EAAA,EAAK,OAAA,EAAQ,YAAA,EAAc,QAAA,EAAA,CAAA,CAAE,gCAAgC,CAAA,EAAE;AAAA;AAAA;AAAA,KAClE;AAAA,EAEJ;AACA,EAAA,IAAI,QAAA,EAAU;AACZ,IAAA,uBACE,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,QAAA;AAAA,QACA,SAAA,EAAW,CAAA,EAAG,MAAA,CAAO,QAAQ,IAAI,aAAa,CAAA,CAAA;AAAA,QAE9C,8BAAC,IAAA,EAAA,EAAK,OAAA,EAAQ,cAAa,SAAA,EAAW,MAAA,CAAO,aAC1C,QAAA,EAAA,UAAA,EACH;AAAA;AAAA,KACF;AAAA,EAEJ;AACA,EAAA,OAAO,IAAA;AACT;;;;"}

package/dist/components/common/DualButton/DualButton.esm.js

@@ -1,5 +1,6 @@
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { Button, Box, MenuTrigger, Menu, MenuItem } from '@backstage/ui';
+import classNames from 'classnames';
 import styles from './DualButton.module.css.esm.js';
 
 function DualButton({
@@ -31,7 +32,7 @@ function DualButton({
       /* @__PURE__ */ jsx(Menu, { children: menuItems.map((item) => /* @__PURE__ */ jsx(
         MenuItem,
         {
-          style: item.selected ? { backgroundColor: "var(--bui-bg-neutral-2)" } : {},
+          className: classNames({ [styles.selected]: item.selected }),
           onAction: () => item.onClick(),
           children: item.label
         },

package/dist/components/common/DualButton/DualButton.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"DualButton.esm.js","sources":["../../../../src/components/common/DualButton/DualButton.tsx"],"sourcesContent":["import {\n  Box,\n  Button,\n  ButtonProps,\n  MenuTrigger,\n  Menu,\n  MenuItem,\n} from '@backstage/ui';\nimport styles from './DualButton.module.css';\n\ntype MenuItemDef = {\n  key: string;\n  label: React.ReactNode;\n  onClick: () => void;\n  selected?: boolean;\n};\n\ntype DualButtonProps = {\n  menuItems?: MenuItemDef[];\n  propsLeft?: ButtonProps;\n  propsRight?: ButtonProps;\n  propsCommon?: ButtonProps;\n} & React.HTMLAttributes<HTMLDivElement>;\n\n/** Base component for dual sided button component.\n * props provided serves as configuration for the left and right button.\n * propsCommon applies to both sides.\n * Specificity takes precedence.\n */\nexport function DualButton({\n  menuItems,\n  propsLeft,\n  propsRight,\n  className,\n  propsCommon,\n  ...props\n}: DualButtonProps) {\n  const leftButton = (\n    <Button\n      size=\"small\"\n      {...propsCommon}\n      {...propsLeft}\n      className={`${styles.DualButtonLeft} ${propsCommon?.className || ''} ${propsLeft?.className || ''}`}\n    />\n  );\n\n  const ConditionalMenuWrapper: React.FC<{ children: React.ReactNode }> = ({\n    children,\n  }) => {\n    const hasMenu = menuItems && menuItems.length > 0;\n\n    if (!hasMenu) {\n      return <>{children}</>;\n    }\n\n    return (\n      <MenuTrigger>\n        {children}\n        <Menu>\n          {menuItems.map(item => (\n            <MenuItem\n              key={item.key}\n              style={\n                item.selected\n                  ? { backgroundColor: 'var(--bui-bg-neutral-2)' }\n                  : {}\n              }\n              onAction={() => item.onClick()}\n            >\n              {item.label}\n            </MenuItem>\n          ))}\n        </Menu>\n      </MenuTrigger>\n    );\n  };\n\n  return (\n    <Box {...props} className={`${styles.DualButton} ${className || ''}`}>\n      <ConditionalMenuWrapper>{leftButton}</ConditionalMenuWrapper>\n      <Button\n        size=\"small\"\n        {...propsCommon}\n        {...propsRight}\n        className={`${styles.DualButtonRight} ${propsCommon?.className || ''} ${propsRight?.className || ''}`}\n      />\n    </Box>\n  );\n}\n"],"names":[],"mappings":";;;;AA6BO,SAAS,UAAA,CAAW;AAAA,EACzB,SAAA;AAAA,EACA,SAAA;AAAA,EACA,UAAA;AAAA,EACA,SAAA;AAAA,EACA,WAAA;AAAA,EACA,GAAG;AACL,CAAA,EAAoB;AAClB,EAAA,MAAM,UAAA,mBACJ,GAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,IAAA,EAAK,OAAA;AAAA,MACJ,GAAG,WAAA;AAAA,MACH,GAAG,SAAA;AAAA,MACJ,SAAA,EAAW,CAAA,EAAG,MAAA,CAAO,cAAc,CAAA,CAAA,EAAI,WAAA,EAAa,SAAA,IAAa,EAAE,CAAA,CAAA,EAAI,SAAA,EAAW,SAAA,IAAa,EAAE,CAAA;AAAA;AAAA,GACnG;AAGF,EAAA,MAAM,yBAAkE,CAAC;AAAA,IACvE;AAAA,GACF,KAAM;AACJ,IAAA,MAAM,OAAA,GAAU,SAAA,IAAa,SAAA,CAAU,MAAA,GAAS,CAAA;AAEhD,IAAA,IAAI,CAAC,OAAA,EAAS;AACZ,MAAA,uCAAU,QAAA,EAAS,CAAA;AAAA,IACrB;AAEA,IAAA,4BACG,WAAA,EAAA,EACE,QAAA,EAAA;AAAA,MAAA,QAAA;AAAA,sBACD,GAAA,CAAC,IAAA,EAAA,EACE,QAAA,EAAA,SAAA,CAAU,GAAA,CAAI,CAAA,IAAA,qBACb,GAAA;AAAA,QAAC,QAAA;AAAA,QAAA;AAAA,UAEC,OACE,IAAA,CAAK,QAAA,GACD,EAAE,eAAA,EAAiB,yBAAA,KACnB,EAAC;AAAA,UAEP,QAAA,EAAU,MAAM,IAAA,CAAK,OAAA,EAAQ;AAAA,UAE5B,QAAA,EAAA,IAAA,CAAK;AAAA,SAAA;AAAA,QARD,IAAA,CAAK;AAAA,OAUb,CAAA,EACH;AAAA,KAAA,EACF,CAAA;AAAA,EAEJ,CAAA;AAEA,EAAA,uBACE,IAAA,CAAC,GAAA,EAAA,EAAK,GAAG,KAAA,EAAO,SAAA,EAAW,CAAA,EAAG,MAAA,CAAO,UAAU,CAAA,CAAA,EAAI,SAAA,IAAa,EAAE,CAAA,CAAA,EAChE,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,0BAAwB,QAAA,EAAA,UAAA,EAAW,CAAA;AAAA,oBACpC,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,IAAA,EAAK,OAAA;AAAA,QACJ,GAAG,WAAA;AAAA,QACH,GAAG,UAAA;AAAA,QACJ,SAAA,EAAW,CAAA,EAAG,MAAA,CAAO,eAAe,CAAA,CAAA,EAAI,WAAA,EAAa,SAAA,IAAa,EAAE,CAAA,CAAA,EAAI,UAAA,EAAY,SAAA,IAAa,EAAE,CAAA;AAAA;AAAA;AACrG,GAAA,EACF,CAAA;AAEJ;;;;"}
+{"version":3,"file":"DualButton.esm.js","sources":["../../../../src/components/common/DualButton/DualButton.tsx"],"sourcesContent":["import {\n  Box,\n  Button,\n  ButtonProps,\n  MenuTrigger,\n  Menu,\n  MenuItem,\n} from '@backstage/ui';\nimport classnames from 'classnames';\nimport styles from './DualButton.module.css';\n\ntype MenuItemDef = {\n  key: string;\n  label: React.ReactNode;\n  onClick: () => void;\n  selected?: boolean;\n};\n\ntype DualButtonProps = {\n  menuItems?: MenuItemDef[];\n  propsLeft?: ButtonProps;\n  propsRight?: ButtonProps;\n  propsCommon?: ButtonProps;\n} & React.HTMLAttributes<HTMLDivElement>;\n\n/** Base component for dual sided button component.\n * props provided serves as configuration for the left and right button.\n * propsCommon applies to both sides.\n * Specificity takes precedence.\n */\nexport function DualButton({\n  menuItems,\n  propsLeft,\n  propsRight,\n  className,\n  propsCommon,\n  ...props\n}: DualButtonProps) {\n  const leftButton = (\n    <Button\n      size=\"small\"\n      {...propsCommon}\n      {...propsLeft}\n      className={`${styles.DualButtonLeft} ${propsCommon?.className || ''} ${propsLeft?.className || ''}`}\n    />\n  );\n\n  const ConditionalMenuWrapper: React.FC<{ children: React.ReactNode }> = ({\n    children,\n  }) => {\n    const hasMenu = menuItems && menuItems.length > 0;\n\n    if (!hasMenu) {\n      return <>{children}</>;\n    }\n\n    return (\n      <MenuTrigger>\n        {children}\n        <Menu>\n          {menuItems.map(item => (\n            <MenuItem\n              key={item.key}\n              className={classnames({ [styles.selected]: item.selected })}\n              onAction={() => item.onClick()}\n            >\n              {item.label}\n            </MenuItem>\n          ))}\n        </Menu>\n      </MenuTrigger>\n    );\n  };\n\n  return (\n    <Box {...props} className={`${styles.DualButton} ${className || ''}`}>\n      <ConditionalMenuWrapper>{leftButton}</ConditionalMenuWrapper>\n      <Button\n        size=\"small\"\n        {...propsCommon}\n        {...propsRight}\n        className={`${styles.DualButtonRight} ${propsCommon?.className || ''} ${propsRight?.className || ''}`}\n      />\n    </Box>\n  );\n}\n"],"names":["classnames"],"mappings":";;;;;AA8BO,SAAS,UAAA,CAAW;AAAA,EACzB,SAAA;AAAA,EACA,SAAA;AAAA,EACA,UAAA;AAAA,EACA,SAAA;AAAA,EACA,WAAA;AAAA,EACA,GAAG;AACL,CAAA,EAAoB;AAClB,EAAA,MAAM,UAAA,mBACJ,GAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,IAAA,EAAK,OAAA;AAAA,MACJ,GAAG,WAAA;AAAA,MACH,GAAG,SAAA;AAAA,MACJ,SAAA,EAAW,CAAA,EAAG,MAAA,CAAO,cAAc,CAAA,CAAA,EAAI,WAAA,EAAa,SAAA,IAAa,EAAE,CAAA,CAAA,EAAI,SAAA,EAAW,SAAA,IAAa,EAAE,CAAA;AAAA;AAAA,GACnG;AAGF,EAAA,MAAM,yBAAkE,CAAC;AAAA,IACvE;AAAA,GACF,KAAM;AACJ,IAAA,MAAM,OAAA,GAAU,SAAA,IAAa,SAAA,CAAU,MAAA,GAAS,CAAA;AAEhD,IAAA,IAAI,CAAC,OAAA,EAAS;AACZ,MAAA,uCAAU,QAAA,EAAS,CAAA;AAAA,IACrB;AAEA,IAAA,4BACG,WAAA,EAAA,EACE,QAAA,EAAA;AAAA,MAAA,QAAA;AAAA,sBACD,GAAA,CAAC,IAAA,EAAA,EACE,QAAA,EAAA,SAAA,CAAU,GAAA,CAAI,CAAA,IAAA,qBACb,GAAA;AAAA,QAAC,QAAA;AAAA,QAAA;AAAA,UAEC,SAAA,EAAWA,WAAW,EAAE,CAAC,OAAO,QAAQ,GAAG,IAAA,CAAK,QAAA,EAAU,CAAA;AAAA,UAC1D,QAAA,EAAU,MAAM,IAAA,CAAK,OAAA,EAAQ;AAAA,UAE5B,QAAA,EAAA,IAAA,CAAK;AAAA,SAAA;AAAA,QAJD,IAAA,CAAK;AAAA,OAMb,CAAA,EACH;AAAA,KAAA,EACF,CAAA;AAAA,EAEJ,CAAA;AAEA,EAAA,uBACE,IAAA,CAAC,GAAA,EAAA,EAAK,GAAG,KAAA,EAAO,SAAA,EAAW,CAAA,EAAG,MAAA,CAAO,UAAU,CAAA,CAAA,EAAI,SAAA,IAAa,EAAE,CAAA,CAAA,EAChE,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,0BAAwB,QAAA,EAAA,UAAA,EAAW,CAAA;AAAA,oBACpC,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,IAAA,EAAK,OAAA;AAAA,QACJ,GAAG,WAAA;AAAA,QACH,GAAG,UAAA;AAAA,QACJ,SAAA,EAAW,CAAA,EAAG,MAAA,CAAO,eAAe,CAAA,CAAA,EAAI,WAAA,EAAa,SAAA,IAAa,EAAE,CAAA,CAAA,EAAI,UAAA,EAAY,SAAA,IAAa,EAAE,CAAA;AAAA;AAAA;AACrG,GAAA,EACF,CAAA;AAEJ;;;;"}

package/dist/components/common/DualButton/DualButton.module.css.esm.js

@@ -1,7 +1,7 @@
 import styleInject from '../../../node_modules_dist/style-inject/dist/style-inject.es.esm.js';
 
-var css_248z = ".DualButton_DualButton__3d4ea232f2 {\n  display: flex;\n  text-wrap: nowrap;\n  gap: 4px;\n\n  .DualButton_DualButtonLeft__3d4ea232f2 {\n    border-top-left-radius: 1000px;\n    border-bottom-left-radius: 1000px;\n    text-transform: none;\n    min-width: 110px;\n  }\n\n  .DualButton_DualButtonRight__3d4ea232f2 {\n    border-top-right-radius: 1000px;\n    border-bottom-right-radius: 1000px;\n    text-transform: none;\n  }\n}\n";
-var styles = {"DualButton":"DualButton_DualButton__3d4ea232f2","DualButtonLeft":"DualButton_DualButtonLeft__3d4ea232f2","DualButtonRight":"DualButton_DualButtonRight__3d4ea232f2"};
+var css_248z = ".DualButton_DualButton__6d4076daa8 {\n  display: flex;\n  text-wrap: nowrap;\n  gap: 4px;\n\n  .DualButton_DualButtonLeft__6d4076daa8 {\n    border-top-left-radius: 1000px;\n    border-bottom-left-radius: 1000px;\n    text-transform: none;\n    min-width: 110px;\n  }\n\n  .DualButton_DualButtonRight__6d4076daa8 {\n    border-top-right-radius: 1000px;\n    border-bottom-right-radius: 1000px;\n    text-transform: none;\n  }\n}\n\n.DualButton_selected__6d4076daa8 {\n  background-color: var(--bui-bg-neutral-2);\n}\n";
+var styles = {"DualButton":"DualButton_DualButton__6d4076daa8","DualButtonLeft":"DualButton_DualButtonLeft__6d4076daa8","DualButtonRight":"DualButton_DualButtonRight__6d4076daa8","selected":"DualButton_selected__6d4076daa8"};
 styleInject(css_248z);
 
 export { styles as default };

package/dist/components/common/alertBar.module.css.esm.js

@@ -1,7 +1,7 @@
 import styleInject from '../../node_modules_dist/style-inject/dist/style-inject.es.esm.js';
 
-var css_248z = ".alertBar_alertBarBox__832f499abf {\n  position: sticky;\n  top: 8px;\n  z-index: 100;\n  display: block;\n}\n\n.alertBar_alertBar__832f499abf {\n  width: 100%;\n  margin-bottom: 8px;\n}\n\n/* severity variants */\n.alertBar_success__832f499abf {\n  background-color: #e9f8eb;\n  border: 1px solid #66b077;\n}\n\n.alertBar_warning__832f499abf {\n  background-color: #fff7ed;\n  border: 1px solid #cf914a;\n}\n\n.alertBar_error__832f499abf {\n  background-color: #fcf1e8;\n  border: 1px solid #a32f00;\n}\n\n.alertBar_info__832f499abf {\n  background-color: #eaf6ff;\n  border: 1px solid #439ccd;\n}\n";
-var styles = {"alertBarBox":"alertBar_alertBarBox__832f499abf","alertBar":"alertBar_alertBar__832f499abf","success":"alertBar_success__832f499abf","warning":"alertBar_warning__832f499abf","error":"alertBar_error__832f499abf","info":"alertBar_info__832f499abf"};
+var css_248z = ".alertBar_alertBarBox__381ae2067c {\n  position: sticky;\n  top: 8px;\n  z-index: 100;\n  display: block;\n}\n\n.alertBar_alertBar__381ae2067c {\n  width: 100%;\n  margin-bottom: 8px;\n}\n\n/* severity variants */\n.alertBar_success__381ae2067c {\n  background-color: #e9f8eb;\n  border: 1px solid #66b077;\n}\n\n.alertBar_warning__381ae2067c {\n  background-color: #fff7ed;\n  border: 1px solid #cf914a;\n}\n\n.alertBar_error__381ae2067c {\n  background-color: #fcf1e8;\n  border: 1px solid #a32f00;\n}\n\n.alertBar_info__381ae2067c {\n  background-color: #eaf6ff;\n  border: 1px solid #439ccd;\n}\n\n.alertBar_preLineText__381ae2067c {\n  white-space: pre-line;\n}\n";
+var styles = {"alertBarBox":"alertBar_alertBarBox__381ae2067c","alertBar":"alertBar_alertBar__381ae2067c","success":"alertBar_success__381ae2067c","warning":"alertBar_warning__381ae2067c","error":"alertBar_error__381ae2067c","info":"alertBar_info__381ae2067c","preLineText":"alertBar_preLineText__381ae2067c"};
 styleInject(css_248z);
 
 export { styles as default };

package/dist/components/riScInfo/CreateNewRiScButton.esm.js

@@ -2,6 +2,7 @@ import { jsx } from 'react/jsx-runtime';
 import { Button } from '@backstage/ui';
 import { useTranslationRef } from '@backstage/core-plugin-api/alpha';
 import { pluginRiScTranslationRef } from '../../utils/translations.esm.js';
+import styles from './CreateNewRiScButton.module.css.esm.js';
 
 function CreateNewRiScButton(props) {
   const { t } = useTranslationRef(pluginRiScTranslationRef);
@@ -10,9 +11,7 @@ function CreateNewRiScButton(props) {
     {
       iconStart: /* @__PURE__ */ jsx("i", { className: "ri-add-circle-line" }),
       onClick: props.onCreateNew,
-      style: {
-        width: "fit-content"
-      },
+      className: styles.button,
       children: t("contentHeader.createNewButton")
     }
   );

package/dist/components/riScInfo/CreateNewRiScButton.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"CreateNewRiScButton.esm.js","sources":["../../../src/components/riScInfo/CreateNewRiScButton.tsx"],"sourcesContent":["import { Button } from '@backstage/ui';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { pluginRiScTranslationRef } from '../../utils/translations.ts';\n\ntype CreateNewRiScButtonProps = {\n  onCreateNew: () => void;\n};\n\nexport function CreateNewRiScButton(props: CreateNewRiScButtonProps) {\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n  return (\n    <Button\n      iconStart={<i className=\"ri-add-circle-line\" />}\n      onClick={props.onCreateNew}\n      style={{\n        width: 'fit-content',\n      }}\n    >\n      {t('contentHeader.createNewButton')}\n    </Button>\n  );\n}\n"],"names":[],"mappings":";;;;;AAQO,SAAS,oBAAoB,KAAA,EAAiC;AACnE,EAAA,MAAM,EAAE,CAAA,EAAE,GAAI,iBAAA,CAAkB,wBAAwB,CAAA;AACxD,EAAA,uBACE,GAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,SAAA,kBAAW,GAAA,CAAC,GAAA,EAAA,EAAE,SAAA,EAAU,oBAAA,EAAqB,CAAA;AAAA,MAC7C,SAAS,KAAA,CAAM,WAAA;AAAA,MACf,KAAA,EAAO;AAAA,QACL,KAAA,EAAO;AAAA,OACT;AAAA,MAEC,YAAE,+BAA+B;AAAA;AAAA,GACpC;AAEJ;;;;"}
+{"version":3,"file":"CreateNewRiScButton.esm.js","sources":["../../../src/components/riScInfo/CreateNewRiScButton.tsx"],"sourcesContent":["import { Button } from '@backstage/ui';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { pluginRiScTranslationRef } from '../../utils/translations.ts';\nimport styles from './CreateNewRiScButton.module.css';\n\ntype CreateNewRiScButtonProps = {\n  onCreateNew: () => void;\n};\n\nexport function CreateNewRiScButton(props: CreateNewRiScButtonProps) {\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n  return (\n    <Button\n      iconStart={<i className=\"ri-add-circle-line\" />}\n      onClick={props.onCreateNew}\n      className={styles.button}\n    >\n      {t('contentHeader.createNewButton')}\n    </Button>\n  );\n}\n"],"names":[],"mappings":";;;;;;AASO,SAAS,oBAAoB,KAAA,EAAiC;AACnE,EAAA,MAAM,EAAE,CAAA,EAAE,GAAI,iBAAA,CAAkB,wBAAwB,CAAA;AACxD,EAAA,uBACE,GAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,SAAA,kBAAW,GAAA,CAAC,GAAA,EAAA,EAAE,SAAA,EAAU,oBAAA,EAAqB,CAAA;AAAA,MAC7C,SAAS,KAAA,CAAM,WAAA;AAAA,MACf,WAAW,MAAA,CAAO,MAAA;AAAA,MAEjB,YAAE,+BAA+B;AAAA;AAAA,GACpC;AAEJ;;;;"}

package/dist/components/riScInfo/CreateNewRiScButton.module.css.esm.js

@@ -0,0 +1,8 @@
+import styleInject from '../../node_modules_dist/style-inject/dist/style-inject.es.esm.js';
+
+var css_248z = ".CreateNewRiScButton_button__79f70428ca {\n  width: fit-content;\n}\n";
+var styles = {"button":"CreateNewRiScButton_button__79f70428ca"};
+styleInject(css_248z);
+
+export { styles as default };
+//# sourceMappingURL=CreateNewRiScButton.module.css.esm.js.map

package/dist/components/riScInfo/CreateNewRiScButton.module.css.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CreateNewRiScButton.module.css.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}

package/dist/components/riScInfo/ErrorState.esm.js

@@ -2,24 +2,17 @@ import { jsx, jsxs } from 'react/jsx-runtime';
 import { Card, CardBody, Flex, Text, Button } from '@backstage/ui';
 import { pluginRiScTranslationRef } from '../../utils/translations.esm.js';
 import { useTranslationRef } from '@backstage/core-plugin-api/alpha';
+import styles from './ErrorState.module.css.esm.js';
 
 function ErrorState() {
   const { t } = useTranslationRef(pluginRiScTranslationRef);
   const refreshPage = () => {
     window.location.reload();
   };
-  return /* @__PURE__ */ jsx(
-    Card,
-    {
-      style: {
-        width: "520px"
-      },
-      children: /* @__PURE__ */ jsx(CardBody, { children: /* @__PURE__ */ jsxs(Flex, { direction: "column", align: "center", children: [
-        /* @__PURE__ */ jsx(Text, { variant: "body-large", children: t("errorMessages.FailedToFetchRiScs") }),
-        /* @__PURE__ */ jsx(Button, { onClick: refreshPage, children: t("dictionary.refresh") })
-      ] }) })
-    }
-  );
+  return /* @__PURE__ */ jsx(Card, { className: styles.card, children: /* @__PURE__ */ jsx(CardBody, { children: /* @__PURE__ */ jsxs(Flex, { direction: "column", align: "center", children: [
+    /* @__PURE__ */ jsx(Text, { variant: "body-large", children: t("errorMessages.FailedToFetchRiScs") }),
+    /* @__PURE__ */ jsx(Button, { onClick: refreshPage, children: t("dictionary.refresh") })
+  ] }) }) });
 }
 
 export { ErrorState };

package/dist/components/riScInfo/ErrorState.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"ErrorState.esm.js","sources":["../../../src/components/riScInfo/ErrorState.tsx"],"sourcesContent":["import { Card, CardBody, Flex, Text, Button } from '@backstage/ui';\nimport { pluginRiScTranslationRef } from '../../utils/translations';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\n\nexport function ErrorState() {\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n\n  const refreshPage = () => {\n    window.location.reload();\n  };\n  return (\n    <Card\n      style={{\n        width: '520px',\n      }}\n    >\n      <CardBody>\n        <Flex direction=\"column\" align=\"center\">\n          <Text variant=\"body-large\">\n            {t('errorMessages.FailedToFetchRiScs')}\n          </Text>\n          <Button onClick={refreshPage}>{t('dictionary.refresh')}</Button>\n        </Flex>\n      </CardBody>\n    </Card>\n  );\n}\n"],"names":[],"mappings":";;;;;AAIO,SAAS,UAAA,GAAa;AAC3B,EAAA,MAAM,EAAE,CAAA,EAAE,GAAI,iBAAA,CAAkB,wBAAwB,CAAA;AAExD,EAAA,MAAM,cAAc,MAAM;AACxB,IAAA,MAAA,CAAO,SAAS,MAAA,EAAO;AAAA,EACzB,CAAA;AACA,EAAA,uBACE,GAAA;AAAA,IAAC,IAAA;AAAA,IAAA;AAAA,MACC,KAAA,EAAO;AAAA,QACL,KAAA,EAAO;AAAA,OACT;AAAA,MAEA,8BAAC,QAAA,EAAA,EACC,QAAA,kBAAA,IAAA,CAAC,QAAK,SAAA,EAAU,QAAA,EAAS,OAAM,QAAA,EAC7B,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,IAAA,EAAA,EAAK,OAAA,EAAQ,YAAA,EACX,QAAA,EAAA,CAAA,CAAE,kCAAkC,CAAA,EACvC,CAAA;AAAA,4BACC,MAAA,EAAA,EAAO,OAAA,EAAS,WAAA,EAAc,QAAA,EAAA,CAAA,CAAE,oBAAoB,CAAA,EAAE;AAAA,OAAA,EACzD,CAAA,EACF;AAAA;AAAA,GACF;AAEJ;;;;"}
+{"version":3,"file":"ErrorState.esm.js","sources":["../../../src/components/riScInfo/ErrorState.tsx"],"sourcesContent":["import { Card, CardBody, Flex, Text, Button } from '@backstage/ui';\nimport { pluginRiScTranslationRef } from '../../utils/translations';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport styles from './ErrorState.module.css';\n\nexport function ErrorState() {\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n\n  const refreshPage = () => {\n    window.location.reload();\n  };\n  return (\n    <Card className={styles.card}>\n      <CardBody>\n        <Flex direction=\"column\" align=\"center\">\n          <Text variant=\"body-large\">\n            {t('errorMessages.FailedToFetchRiScs')}\n          </Text>\n          <Button onClick={refreshPage}>{t('dictionary.refresh')}</Button>\n        </Flex>\n      </CardBody>\n    </Card>\n  );\n}\n"],"names":[],"mappings":";;;;;;AAKO,SAAS,UAAA,GAAa;AAC3B,EAAA,MAAM,EAAE,CAAA,EAAE,GAAI,iBAAA,CAAkB,wBAAwB,CAAA;AAExD,EAAA,MAAM,cAAc,MAAM;AACxB,IAAA,MAAA,CAAO,SAAS,MAAA,EAAO;AAAA,EACzB,CAAA;AACA,EAAA,uBACE,GAAA,CAAC,IAAA,EAAA,EAAK,SAAA,EAAW,MAAA,CAAO,IAAA,EACtB,QAAA,kBAAA,GAAA,CAAC,QAAA,EAAA,EACC,QAAA,kBAAA,IAAA,CAAC,IAAA,EAAA,EAAK,SAAA,EAAU,QAAA,EAAS,KAAA,EAAM,QAAA,EAC7B,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,IAAA,EAAA,EAAK,OAAA,EAAQ,YAAA,EACX,QAAA,EAAA,CAAA,CAAE,kCAAkC,CAAA,EACvC,CAAA;AAAA,wBACC,MAAA,EAAA,EAAO,OAAA,EAAS,WAAA,EAAc,QAAA,EAAA,CAAA,CAAE,oBAAoB,CAAA,EAAE;AAAA,GAAA,EACzD,GACF,CAAA,EACF,CAAA;AAEJ;;;;"}

package/dist/components/riScInfo/ErrorState.module.css.esm.js

@@ -0,0 +1,8 @@
+import styleInject from '../../node_modules_dist/style-inject/dist/style-inject.es.esm.js';
+
+var css_248z = ".ErrorState_card__21ea4655ec {\n  width: 520px;\n}\n";
+var styles = {"card":"ErrorState_card__21ea4655ec"};
+styleInject(css_248z);
+
+export { styles as default };
+//# sourceMappingURL=ErrorState.module.css.esm.js.map

package/dist/components/riScInfo/ErrorState.module.css.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ErrorState.module.css.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}

package/dist/components/riScInfo/riScStatus/StatusBadge.esm.js

@@ -3,6 +3,7 @@ import { Flex, Text } from '@backstage/ui';
 import { RiScStatusEnum } from './utils.esm.js';
 import { useTranslationRef } from '@backstage/core-plugin-api/alpha';
 import { pluginRiScTranslationRef } from '../../../utils/translations.esm.js';
+import styles from './StatusBadge.module.css.esm.js';
 
 function StatusBadge(props) {
   const { t } = useTranslationRef(pluginRiScTranslationRef);
@@ -33,13 +34,7 @@ function StatusBadge(props) {
     }
   };
   return /* @__PURE__ */ jsxs(Flex, { direction: "row", align: "center", gap: "2", children: [
-    /* @__PURE__ */ jsx(
-      "i",
-      {
-        className: statusMap[props.riScStatus].icon,
-        style: { fontSize: "20px" }
-      }
-    ),
+    /* @__PURE__ */ jsx("i", { className: `${statusMap[props.riScStatus].icon} ${styles.icon}` }),
     /* @__PURE__ */ jsx(Text, { as: "p", variant: "body-large", weight: "bold", children: statusMap[props.riScStatus].text })
   ] });
 }

package/dist/components/riScInfo/riScStatus/StatusBadge.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"StatusBadge.esm.js","sources":["../../../../src/components/riScInfo/riScStatus/StatusBadge.tsx"],"sourcesContent":["import { Flex, Text } from '@backstage/ui';\nimport {\n  RiScStatusEnum,\n  RiScStatusEnumType,\n  StatusIconMapType,\n} from './utils.ts';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { pluginRiScTranslationRef } from '../../../utils/translations.ts';\n\ninterface StatusBadgeProps {\n  riScStatus: RiScStatusEnumType;\n}\n\nexport function StatusBadge(props: StatusBadgeProps) {\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n\n  const statusMap: StatusIconMapType = {\n    [RiScStatusEnum.CREATED]: {\n      icon: 'ri-edit-line',\n      text: t('rosStatus.statusBadge.created'),\n    },\n    [RiScStatusEnum.DRAFT]: {\n      icon: 'ri-edit-line',\n      text: t('rosStatus.statusBadge.draft'),\n    },\n    [RiScStatusEnum.WAITING]: {\n      icon: 'ri-hourglass-line',\n      text: t('rosStatus.statusBadge.waiting'),\n    },\n    [RiScStatusEnum.PUBLISHED]: {\n      icon: 'ri-checkbox-circle-line',\n      text: t('rosStatus.statusBadge.published'),\n    },\n    [RiScStatusEnum.DELETION_DRAFT]: {\n      icon: 'ri-delete-bin-line',\n      text: t('rosStatus.statusBadge.draftDeletion'),\n    },\n    [RiScStatusEnum.DELETION_WAITING]: {\n      icon: 'ri-close-circle-line',\n      text: t('rosStatus.statusBadge.waitingDeletion'),\n    },\n  };\n\n  return (\n    <Flex direction=\"row\" align=\"center\" gap=\"2\">\n      <i\n        className={statusMap[props.riScStatus].icon}\n        style={{ fontSize: '20px' }}\n      />\n      <Text as=\"p\" variant=\"body-large\" weight=\"bold\">\n        {statusMap[props.riScStatus].text}\n      </Text>\n    </Flex>\n  );\n}\n"],"names":[],"mappings":";;;;;;AAaO,SAAS,YAAY,KAAA,EAAyB;AACnD,EAAA,MAAM,EAAE,CAAA,EAAE,GAAI,iBAAA,CAAkB,wBAAwB,CAAA;AAExD,EAAA,MAAM,SAAA,GAA+B;AAAA,IACnC,CAAC,cAAA,CAAe,OAAO,GAAG;AAAA,MACxB,IAAA,EAAM,cAAA;AAAA,MACN,IAAA,EAAM,EAAE,+BAA+B;AAAA,KACzC;AAAA,IACA,CAAC,cAAA,CAAe,KAAK,GAAG;AAAA,MACtB,IAAA,EAAM,cAAA;AAAA,MACN,IAAA,EAAM,EAAE,6BAA6B;AAAA,KACvC;AAAA,IACA,CAAC,cAAA,CAAe,OAAO,GAAG;AAAA,MACxB,IAAA,EAAM,mBAAA;AAAA,MACN,IAAA,EAAM,EAAE,+BAA+B;AAAA,KACzC;AAAA,IACA,CAAC,cAAA,CAAe,SAAS,GAAG;AAAA,MAC1B,IAAA,EAAM,yBAAA;AAAA,MACN,IAAA,EAAM,EAAE,iCAAiC;AAAA,KAC3C;AAAA,IACA,CAAC,cAAA,CAAe,cAAc,GAAG;AAAA,MAC/B,IAAA,EAAM,oBAAA;AAAA,MACN,IAAA,EAAM,EAAE,qCAAqC;AAAA,KAC/C;AAAA,IACA,CAAC,cAAA,CAAe,gBAAgB,GAAG;AAAA,MACjC,IAAA,EAAM,sBAAA;AAAA,MACN,IAAA,EAAM,EAAE,uCAAuC;AAAA;AACjD,GACF;AAEA,EAAA,4BACG,IAAA,EAAA,EAAK,SAAA,EAAU,OAAM,KAAA,EAAM,QAAA,EAAS,KAAI,GAAA,EACvC,QAAA,EAAA;AAAA,oBAAA,GAAA;AAAA,MAAC,GAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAW,SAAA,CAAU,KAAA,CAAM,UAAU,CAAA,CAAE,IAAA;AAAA,QACvC,KAAA,EAAO,EAAE,QAAA,EAAU,MAAA;AAAO;AAAA,KAC5B;AAAA,oBACA,GAAA,CAAC,IAAA,EAAA,EAAK,EAAA,EAAG,GAAA,EAAI,OAAA,EAAQ,YAAA,EAAa,MAAA,EAAO,MAAA,EACtC,QAAA,EAAA,SAAA,CAAU,KAAA,CAAM,UAAU,CAAA,CAAE,IAAA,EAC/B;AAAA,GAAA,EACF,CAAA;AAEJ;;;;"}
+{"version":3,"file":"StatusBadge.esm.js","sources":["../../../../src/components/riScInfo/riScStatus/StatusBadge.tsx"],"sourcesContent":["import { Flex, Text } from '@backstage/ui';\nimport {\n  RiScStatusEnum,\n  RiScStatusEnumType,\n  StatusIconMapType,\n} from './utils.ts';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { pluginRiScTranslationRef } from '../../../utils/translations.ts';\nimport styles from './StatusBadge.module.css';\n\ninterface StatusBadgeProps {\n  riScStatus: RiScStatusEnumType;\n}\n\nexport function StatusBadge(props: StatusBadgeProps) {\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n\n  const statusMap: StatusIconMapType = {\n    [RiScStatusEnum.CREATED]: {\n      icon: 'ri-edit-line',\n      text: t('rosStatus.statusBadge.created'),\n    },\n    [RiScStatusEnum.DRAFT]: {\n      icon: 'ri-edit-line',\n      text: t('rosStatus.statusBadge.draft'),\n    },\n    [RiScStatusEnum.WAITING]: {\n      icon: 'ri-hourglass-line',\n      text: t('rosStatus.statusBadge.waiting'),\n    },\n    [RiScStatusEnum.PUBLISHED]: {\n      icon: 'ri-checkbox-circle-line',\n      text: t('rosStatus.statusBadge.published'),\n    },\n    [RiScStatusEnum.DELETION_DRAFT]: {\n      icon: 'ri-delete-bin-line',\n      text: t('rosStatus.statusBadge.draftDeletion'),\n    },\n    [RiScStatusEnum.DELETION_WAITING]: {\n      icon: 'ri-close-circle-line',\n      text: t('rosStatus.statusBadge.waitingDeletion'),\n    },\n  };\n\n  return (\n    <Flex direction=\"row\" align=\"center\" gap=\"2\">\n      <i className={`${statusMap[props.riScStatus].icon} ${styles.icon}`} />\n      <Text as=\"p\" variant=\"body-large\" weight=\"bold\">\n        {statusMap[props.riScStatus].text}\n      </Text>\n    </Flex>\n  );\n}\n"],"names":[],"mappings":";;;;;;;AAcO,SAAS,YAAY,KAAA,EAAyB;AACnD,EAAA,MAAM,EAAE,CAAA,EAAE,GAAI,iBAAA,CAAkB,wBAAwB,CAAA;AAExD,EAAA,MAAM,SAAA,GAA+B;AAAA,IACnC,CAAC,cAAA,CAAe,OAAO,GAAG;AAAA,MACxB,IAAA,EAAM,cAAA;AAAA,MACN,IAAA,EAAM,EAAE,+BAA+B;AAAA,KACzC;AAAA,IACA,CAAC,cAAA,CAAe,KAAK,GAAG;AAAA,MACtB,IAAA,EAAM,cAAA;AAAA,MACN,IAAA,EAAM,EAAE,6BAA6B;AAAA,KACvC;AAAA,IACA,CAAC,cAAA,CAAe,OAAO,GAAG;AAAA,MACxB,IAAA,EAAM,mBAAA;AAAA,MACN,IAAA,EAAM,EAAE,+BAA+B;AAAA,KACzC;AAAA,IACA,CAAC,cAAA,CAAe,SAAS,GAAG;AAAA,MAC1B,IAAA,EAAM,yBAAA;AAAA,MACN,IAAA,EAAM,EAAE,iCAAiC;AAAA,KAC3C;AAAA,IACA,CAAC,cAAA,CAAe,cAAc,GAAG;AAAA,MAC/B,IAAA,EAAM,oBAAA;AAAA,MACN,IAAA,EAAM,EAAE,qCAAqC;AAAA,KAC/C;AAAA,IACA,CAAC,cAAA,CAAe,gBAAgB,GAAG;AAAA,MACjC,IAAA,EAAM,sBAAA;AAAA,MACN,IAAA,EAAM,EAAE,uCAAuC;AAAA;AACjD,GACF;AAEA,EAAA,4BACG,IAAA,EAAA,EAAK,SAAA,EAAU,OAAM,KAAA,EAAM,QAAA,EAAS,KAAI,GAAA,EACvC,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,GAAA,EAAA,EAAE,SAAA,EAAW,CAAA,EAAG,SAAA,CAAU,KAAA,CAAM,UAAU,CAAA,CAAE,IAAI,CAAA,CAAA,EAAI,MAAA,CAAO,IAAI,CAAA,CAAA,EAAI,CAAA;AAAA,oBACpE,GAAA,CAAC,IAAA,EAAA,EAAK,EAAA,EAAG,GAAA,EAAI,OAAA,EAAQ,YAAA,EAAa,MAAA,EAAO,MAAA,EACtC,QAAA,EAAA,SAAA,CAAU,KAAA,CAAM,UAAU,CAAA,CAAE,IAAA,EAC/B;AAAA,GAAA,EACF,CAAA;AAEJ;;;;"}

package/dist/components/riScInfo/riScStatus/StatusBadge.module.css.esm.js

@@ -0,0 +1,8 @@
+import styleInject from '../../../node_modules_dist/style-inject/dist/style-inject.es.esm.js';
+
+var css_248z = ".StatusBadge_icon__99a3714a48 {\n  font-size: 20px;\n}\n";
+var styles = {"icon":"StatusBadge_icon__99a3714a48"};
+styleInject(css_248z);
+
+export { styles as default };
+//# sourceMappingURL=StatusBadge.module.css.esm.js.map

package/dist/components/riScInfo/riScStatus/StatusBadge.module.css.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StatusBadge.module.css.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}

package/dist/components/scenario/ScenarioLastUpdatedLabel.esm.js

@@ -3,24 +3,35 @@ import { Flex, Text } from '@backstage/ui';
 import { formatDate, shortenName } from '../../utils/utilityfunctions.esm.js';
 import { useTranslationRef } from '@backstage/core-plugin-api/alpha';
 import { pluginRiScTranslationRef } from '../../utils/translations.esm.js';
+import classNames from 'classnames';
 import styles from './ScenarioLastUpdatedLabel.module.css.esm.js';
 
 function ScenarioLastUpdatedLabel(props) {
   const { t } = useTranslationRef(pluginRiScTranslationRef);
   const parsedLastUpdated = props.lastUpdated ? formatDate(props.lastUpdated) : t("scenarioDrawer.action.notUpdated");
-  const totalLabelWidth = t("currentLanguage") === "en" ? `${144 + 8}px` : `${169 + 8}px`;
-  return /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: "0", style: { width: totalLabelWidth }, children: [
-    /* @__PURE__ */ jsxs(Text, { as: "p", variant: "body-medium", children: [
-      t("scenarioDrawer.action.lastUpdated"),
-      " ",
-      parsedLastUpdated
-    ] }),
-    props.lastUpdatedBy && /* @__PURE__ */ jsxs(Text, { variant: "body-medium", className: styles.textGray, children: [
-      t("dictionary.by"),
-      " ",
-      shortenName(props.lastUpdatedBy, 16)
-    ] })
-  ] });
+  return /* @__PURE__ */ jsxs(
+    Flex,
+    {
+      direction: "column",
+      gap: "0",
+      className: classNames({
+        [styles.labelWidthEn]: t("currentLanguage") === "en",
+        [styles.labelWidthNo]: t("currentLanguage") !== "en"
+      }),
+      children: [
+        /* @__PURE__ */ jsxs(Text, { as: "p", variant: "body-medium", children: [
+          t("scenarioDrawer.action.lastUpdated"),
+          " ",
+          parsedLastUpdated
+        ] }),
+        props.lastUpdatedBy && /* @__PURE__ */ jsxs(Text, { variant: "body-medium", className: styles.textGray, children: [
+          t("dictionary.by"),
+          " ",
+          shortenName(props.lastUpdatedBy, 16)
+        ] })
+      ]
+    }
+  );
 }
 
 export { ScenarioLastUpdatedLabel };

package/dist/components/scenario/ScenarioLastUpdatedLabel.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"ScenarioLastUpdatedLabel.esm.js","sources":["../../../src/components/scenario/ScenarioLastUpdatedLabel.tsx"],"sourcesContent":["import { Flex, Text } from '@backstage/ui';\nimport { formatDate, shortenName } from '../../utils/utilityfunctions.ts';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { pluginRiScTranslationRef } from '../../utils/translations.ts';\nimport styles from './ScenarioLastUpdatedLabel.module.css';\n\ntype ScenarioLastUpdatedLabelProps = {\n  lastUpdated?: Date | undefined | null;\n  lastUpdatedBy?: string | undefined | null;\n};\n\nexport function ScenarioLastUpdatedLabel(props: ScenarioLastUpdatedLabelProps) {\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n\n  const parsedLastUpdated = props.lastUpdated\n    ? formatDate(props.lastUpdated)\n    : t('scenarioDrawer.action.notUpdated');\n\n  const totalLabelWidth =\n    t('currentLanguage') === 'en' ? `${144 + 8}px` : `${169 + 8}px`;\n\n  return (\n    <Flex direction=\"column\" gap=\"0\" style={{ width: totalLabelWidth }}>\n      <Text as=\"p\" variant=\"body-medium\">\n        {t('scenarioDrawer.action.lastUpdated')} {parsedLastUpdated}\n      </Text>\n      {props.lastUpdatedBy && (\n        <Text variant=\"body-medium\" className={styles.textGray}>\n          {t('dictionary.by')} {shortenName(props.lastUpdatedBy, 16)}\n        </Text>\n      )}\n    </Flex>\n  );\n}\n"],"names":[],"mappings":";;;;;;;AAWO,SAAS,yBAAyB,KAAA,EAAsC;AAC7E,EAAA,MAAM,EAAE,CAAA,EAAE,GAAI,iBAAA,CAAkB,wBAAwB,CAAA;AAExD,EAAA,MAAM,iBAAA,GAAoB,MAAM,WAAA,GAC5B,UAAA,CAAW,MAAM,WAAW,CAAA,GAC5B,EAAE,kCAAkC,CAAA;AAExC,EAAA,MAAM,eAAA,GACJ,CAAA,CAAE,iBAAiB,CAAA,KAAM,IAAA,GAAO,CAAA,EAAG,GAAA,GAAM,CAAC,CAAA,EAAA,CAAA,GAAO,CAAA,EAAG,GAAA,GAAM,CAAC,CAAA,EAAA,CAAA;AAE7D,EAAA,uBACE,IAAA,CAAC,IAAA,EAAA,EAAK,SAAA,EAAU,QAAA,EAAS,GAAA,EAAI,KAAI,KAAA,EAAO,EAAE,KAAA,EAAO,eAAA,EAAgB,EAC/D,QAAA,EAAA;AAAA,oBAAA,IAAA,CAAC,IAAA,EAAA,EAAK,EAAA,EAAG,GAAA,EAAI,OAAA,EAAQ,aAAA,EAClB,QAAA,EAAA;AAAA,MAAA,CAAA,CAAE,mCAAmC,CAAA;AAAA,MAAE,GAAA;AAAA,MAAE;AAAA,KAAA,EAC5C,CAAA;AAAA,IACC,KAAA,CAAM,iCACL,IAAA,CAAC,IAAA,EAAA,EAAK,SAAQ,aAAA,EAAc,SAAA,EAAW,OAAO,QAAA,EAC3C,QAAA,EAAA;AAAA,MAAA,CAAA,CAAE,eAAe,CAAA;AAAA,MAAE,GAAA;AAAA,MAAE,WAAA,CAAY,KAAA,CAAM,aAAA,EAAe,EAAE;AAAA,KAAA,EAC3D;AAAA,GAAA,EAEJ,CAAA;AAEJ;;;;"}
+{"version":3,"file":"ScenarioLastUpdatedLabel.esm.js","sources":["../../../src/components/scenario/ScenarioLastUpdatedLabel.tsx"],"sourcesContent":["import { Flex, Text } from '@backstage/ui';\nimport { formatDate, shortenName } from '../../utils/utilityfunctions.ts';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { pluginRiScTranslationRef } from '../../utils/translations.ts';\nimport classnames from 'classnames';\nimport styles from './ScenarioLastUpdatedLabel.module.css';\n\ntype ScenarioLastUpdatedLabelProps = {\n  lastUpdated?: Date | undefined | null;\n  lastUpdatedBy?: string | undefined | null;\n};\n\nexport function ScenarioLastUpdatedLabel(props: ScenarioLastUpdatedLabelProps) {\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n\n  const parsedLastUpdated = props.lastUpdated\n    ? formatDate(props.lastUpdated)\n    : t('scenarioDrawer.action.notUpdated');\n\n  return (\n    <Flex\n      direction=\"column\"\n      gap=\"0\"\n      className={classnames({\n        [styles.labelWidthEn]: t('currentLanguage') === 'en',\n        [styles.labelWidthNo]: t('currentLanguage') !== 'en',\n      })}\n    >\n      <Text as=\"p\" variant=\"body-medium\">\n        {t('scenarioDrawer.action.lastUpdated')} {parsedLastUpdated}\n      </Text>\n      {props.lastUpdatedBy && (\n        <Text variant=\"body-medium\" className={styles.textGray}>\n          {t('dictionary.by')} {shortenName(props.lastUpdatedBy, 16)}\n        </Text>\n      )}\n    </Flex>\n  );\n}\n"],"names":["classnames"],"mappings":";;;;;;;;AAYO,SAAS,yBAAyB,KAAA,EAAsC;AAC7E,EAAA,MAAM,EAAE,CAAA,EAAE,GAAI,iBAAA,CAAkB,wBAAwB,CAAA;AAExD,EAAA,MAAM,iBAAA,GAAoB,MAAM,WAAA,GAC5B,UAAA,CAAW,MAAM,WAAW,CAAA,GAC5B,EAAE,kCAAkC,CAAA;AAExC,EAAA,uBACE,IAAA;AAAA,IAAC,IAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAU,QAAA;AAAA,MACV,GAAA,EAAI,GAAA;AAAA,MACJ,WAAWA,UAAA,CAAW;AAAA,QACpB,CAAC,MAAA,CAAO,YAAY,GAAG,CAAA,CAAE,iBAAiB,CAAA,KAAM,IAAA;AAAA,QAChD,CAAC,MAAA,CAAO,YAAY,GAAG,CAAA,CAAE,iBAAiB,CAAA,KAAM;AAAA,OACjD,CAAA;AAAA,MAED,QAAA,EAAA;AAAA,wBAAA,IAAA,CAAC,IAAA,EAAA,EAAK,EAAA,EAAG,GAAA,EAAI,OAAA,EAAQ,aAAA,EAClB,QAAA,EAAA;AAAA,UAAA,CAAA,CAAE,mCAAmC,CAAA;AAAA,UAAE,GAAA;AAAA,UAAE;AAAA,SAAA,EAC5C,CAAA;AAAA,QACC,KAAA,CAAM,iCACL,IAAA,CAAC,IAAA,EAAA,EAAK,SAAQ,aAAA,EAAc,SAAA,EAAW,OAAO,QAAA,EAC3C,QAAA,EAAA;AAAA,UAAA,CAAA,CAAE,eAAe,CAAA;AAAA,UAAE,GAAA;AAAA,UAAE,WAAA,CAAY,KAAA,CAAM,aAAA,EAAe,EAAE;AAAA,SAAA,EAC3D;AAAA;AAAA;AAAA,GAEJ;AAEJ;;;;"}

package/dist/components/scenario/ScenarioLastUpdatedLabel.module.css.esm.js

@@ -1,7 +1,7 @@
 import styleInject from '../../node_modules_dist/style-inject/dist/style-inject.es.esm.js';
 
-var css_248z = ".ScenarioLastUpdatedLabel_textGray__72ded095c5 {\n  color: var(--bui-fg-secondary);\n}\n";
-var styles = {"textGray":"ScenarioLastUpdatedLabel_textGray__72ded095c5"};
+var css_248z = ".ScenarioLastUpdatedLabel_textGray__9be7e48cfa {\n  color: var(--bui-fg-secondary);\n}\n\n.ScenarioLastUpdatedLabel_labelWidthEn__9be7e48cfa {\n  width: 152px;\n}\n\n.ScenarioLastUpdatedLabel_labelWidthNo__9be7e48cfa {\n  width: 177px;\n}\n";
+var styles = {"textGray":"ScenarioLastUpdatedLabel_textGray__9be7e48cfa","labelWidthEn":"ScenarioLastUpdatedLabel_labelWidthEn__9be7e48cfa","labelWidthNo":"ScenarioLastUpdatedLabel_labelWidthNo__9be7e48cfa"};
 styleInject(css_248z);
 
 export { styles as default };

package/dist/components/scenarioDrawer/components/ActionsSection.esm.js

@@ -4,7 +4,7 @@ import Paper from '@mui/material/Paper';
 import { useTranslationRef } from '@backstage/core-plugin-api/alpha';
 import { pluginRiScTranslationRef } from '../../../utils/translations.esm.js';
 import { useScenario, emptyAction } from '../../../contexts/ScenarioContext.esm.js';
-import { section } from '../scenarioDrawerComponents.esm.js';
+import styles from '../scenarioDrawer.module.css.esm.js';
 import { useFieldArray } from 'react-hook-form';
 import { ActionFormItem } from './ActionFormItem.esm.js';
 import { AddCircle } from '@mui/icons-material';
@@ -14,7 +14,7 @@ import { Flex, Text, TooltipTrigger, Button, Tooltip, Box, Card } from '@backsta
 import { useSortActionsByRelevance } from '../../../hooks/UseSortActionsByRelevance.esm.js';
 import { filterActionsByRelevance } from '../../../utils/actions.esm.js';
 import { ActionRowList } from '../../action/ActionRowList.esm.js';
-import styles from './ActionsSection.module.css.esm.js';
+import styles$1 from './ActionsSection.module.css.esm.js';
 import { ActionStatusOptions } from '../../../utils/constants.esm.js';
 
 const RelevanceToggle = ({
@@ -22,7 +22,7 @@ const RelevanceToggle = ({
   onChange
 }) => {
   const { t } = useTranslationRef(pluginRiScTranslationRef);
-  return /* @__PURE__ */ jsxs(Flex, { align: "center", gap: "0", className: styles.noRelevantActionToggle, children: [
+  return /* @__PURE__ */ jsxs(Flex, { align: "center", gap: "0", className: styles$1.noRelevantActionToggle, children: [
     /* @__PURE__ */ jsx(
       Switch,
       {
@@ -70,7 +70,7 @@ function ActionsSection({ formMethods, isEditing }) {
     (action) => action.status === ActionStatusOptions.NotRelevant
   );
   const isActionsEmpty = currentActions.length === 0;
-  return /* @__PURE__ */ jsxs(Paper, { sx: section, children: [
+  return /* @__PURE__ */ jsxs(Paper, { className: styles.section, children: [
     /* @__PURE__ */ jsxs(Flex, { justify: "between", mb: "2", children: [
       /* @__PURE__ */ jsx(Text, { variant: "title-x-small", weight: "bold", children: t("dictionary.measures") }),
       /* @__PURE__ */ jsxs(Flex, { align: "center", children: [
@@ -106,7 +106,7 @@ function ActionsSection({ formMethods, isEditing }) {
         allowDeletion: allowActionDeletion,
         allowEdit: true
       }
-    ) : /* @__PURE__ */ jsx(Text, { variant: "body-large", className: styles.italicText, children: !currentActions || currentActions.length === 0 ? t("dictionary.emptyField", {
+    ) : /* @__PURE__ */ jsx(Text, { variant: "body-large", className: styles$1.italicText, children: !currentActions || currentActions.length === 0 ? t("dictionary.emptyField", {
       field: t("dictionary.measures").toLowerCase()
     }) : t("dictionary.noRelevantMeasures") })
   ] });
@@ -118,9 +118,9 @@ function ActionsSectionOnEdit(props) {
     control,
     name: "actions"
   });
-  return /* @__PURE__ */ jsxs(Paper, { sx: section, children: [
+  return /* @__PURE__ */ jsxs(Paper, { className: styles.section, children: [
     /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsx(Text, { variant: "title-x-small", weight: "bold", children: t("dictionary.measures") }) }),
-    fields.map((field, index) => /* @__PURE__ */ jsx(Card, { className: styles.actionFormItemCard, children: /* @__PURE__ */ jsx(
+    fields.map((field, index) => /* @__PURE__ */ jsx(Card, { className: styles$1.actionFormItemCard, children: /* @__PURE__ */ jsx(
       ActionFormItem,
       {
         formMethods: props.formMethods,
@@ -136,7 +136,7 @@ function ActionsSectionOnEdit(props) {
         iconStart: /* @__PURE__ */ jsx(AddCircle, {}),
         variant: "primary",
         onClick: () => append(emptyAction()),
-        className: styles.addActionButton,
+        className: styles$1.addActionButton,
         children: t("scenarioDrawer.measureTab.addMeasureButton")
       }
     )

package/dist/components/scenarioDrawer/components/ActionsSection.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"ActionsSection.esm.js","sources":["../../../../src/components/scenarioDrawer/components/ActionsSection.tsx"],"sourcesContent":["import { useEffect, useState } from 'react';\nimport Paper from '@mui/material/Paper';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { pluginRiScTranslationRef } from '../../../utils/translations';\nimport { emptyAction, useScenario } from '../../../contexts/ScenarioContext';\nimport { section } from '../scenarioDrawerComponents';\nimport { useFieldArray, UseFormReturn } from 'react-hook-form';\nimport { Action, FormScenario } from '../../../utils/types';\nimport { ActionFormItem } from './ActionFormItem';\nimport { AddCircle } from '@mui/icons-material';\nimport Switch from '@mui/material/Switch';\nimport { useActionFiltersStorage } from '../../../stores/ActionFiltersStore.ts';\nimport {\n  Text,\n  Tooltip,\n  TooltipTrigger,\n  Flex,\n  Button,\n  Card,\n  Box,\n} from '@backstage/ui';\nimport { useSortActionsByRelevance } from '../../../hooks/UseSortActionsByRelevance.ts';\nimport { filterActionsByRelevance } from '../../../utils/actions.ts';\nimport { ActionRowList } from '../../action/ActionRowList.tsx';\nimport styles from './ActionsSection.module.css';\nimport { ActionStatusOptions } from '../../../utils/constants.ts';\n\nconst RelevanceToggle = ({\n  checked,\n  onChange,\n}: {\n  checked: boolean;\n  onChange: (checked: boolean) => void;\n}) => {\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n\n  return (\n    <Flex align=\"center\" gap=\"0\" className={styles.noRelevantActionToggle}>\n      <Switch\n        checked={checked}\n        onChange={e => onChange(e.target.checked)}\n        name=\"showOnlyRelevant\"\n        color=\"primary\"\n      />\n      <Text variant=\"body-medium\">{t('dictionary.showOnlyRelevant')}</Text>\n    </Flex>\n  );\n};\n\ntype ActionSectionProps = {\n  formMethods: UseFormReturn<FormScenario>;\n  isEditing: boolean;\n};\n\nexport function ActionsSection({ formMethods, isEditing }: ActionSectionProps) {\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n  const { scenario } = useScenario();\n\n  const [allowActionDeletion, setAllowActionDeletion] =\n    useState<boolean>(false);\n  const { watch } = formMethods;\n  const currentActions = watch('actions');\n\n  const [sortedActions, setSortedActions] = useState<Action[] | undefined>(\n    undefined,\n  );\n  const { actionFilters, saveOnlyRelevantFilter } = useActionFiltersStorage();\n  const sortActionsByRelevance = useSortActionsByRelevance();\n\n  useEffect(() => {\n    setSortedActions(sortedActionsState => {\n      if (sortedActionsState === undefined)\n        return sortActionsByRelevance([...currentActions]);\n\n      // sync actions\n      const updatedSortedActions: Action[] = [];\n      for (const action of sortedActionsState) {\n        const updatedAction = currentActions.find(a => a.ID === action.ID);\n        if (updatedAction) updatedSortedActions.push(updatedAction);\n      }\n      // add new actions\n      for (const action of currentActions) {\n        if (!updatedSortedActions.some(a => a.ID === action.ID)) {\n          updatedSortedActions.push(action);\n        }\n      }\n      return updatedSortedActions;\n    });\n  }, [currentActions, actionFilters, sortActionsByRelevance]);\n\n  if (isEditing) {\n    return <ActionsSectionOnEdit formMethods={formMethods} />;\n  }\n\n  const doesCurrentActionsContainNotRelevantActions = currentActions.some(\n    action => action.status === ActionStatusOptions.NotRelevant,\n  );\n\n  const isActionsEmpty = currentActions.length === 0;\n\n  return (\n    <Paper sx={section}>\n      <Flex justify=\"between\" mb=\"2\">\n        <Text variant=\"title-x-small\" weight=\"bold\">\n          {t('dictionary.measures')}\n        </Text>\n        <Flex align=\"center\">\n          {doesCurrentActionsContainNotRelevantActions && (\n            <RelevanceToggle\n              checked={actionFilters.showOnlyRelevant}\n              onChange={value => saveOnlyRelevantFilter(value)}\n            />\n          )}\n          {!isActionsEmpty && (\n            <TooltipTrigger>\n              <Button\n                iconStart={\n                  allowActionDeletion ? (\n                    <i className=\"ri-checkbox-circle-line\" />\n                  ) : (\n                    <i className=\"ri-pencil-line\" />\n                  )\n                }\n                variant=\"secondary\"\n                onClick={() => setAllowActionDeletion(prev => !prev)}\n              >\n                {allowActionDeletion}\n              </Button>\n              <Tooltip>\n                {allowActionDeletion\n                  ? t('scenarioTable.doneEditing')\n                  : t('scenarioTable.editButton')}\n              </Tooltip>\n            </TooltipTrigger>\n          )}\n        </Flex>\n      </Flex>\n      {sortedActions !== undefined && sortedActions.length > 0 ? (\n        <ActionRowList\n          scenarioId={scenario.ID}\n          displayedActions={filterActionsByRelevance(\n            sortedActions,\n            actionFilters.showOnlyRelevant,\n          )}\n          allowDeletion={allowActionDeletion}\n          allowEdit\n        />\n      ) : (\n        <Text variant=\"body-large\" className={styles.italicText}>\n          {!currentActions || currentActions.length === 0\n            ? t('dictionary.emptyField', {\n                field: t('dictionary.measures').toLowerCase(),\n              })\n            : t('dictionary.noRelevantMeasures')}\n        </Text>\n      )}\n    </Paper>\n  );\n}\n\ntype ActionsSectionOnEditProps = {\n  formMethods: UseFormReturn<FormScenario>;\n};\n\nfunction ActionsSectionOnEdit(props: ActionsSectionOnEditProps) {\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n\n  const { control } = props.formMethods;\n  const { fields, append, remove } = useFieldArray({\n    control,\n    name: 'actions',\n  });\n\n  return (\n    <Paper sx={section}>\n      <Box>\n        <Text variant=\"title-x-small\" weight=\"bold\">\n          {t('dictionary.measures')}\n        </Text>\n      </Box>\n      {fields.map((field, index) => (\n        <Card key={field.id} className={styles.actionFormItemCard}>\n          <ActionFormItem\n            key={index}\n            formMethods={props.formMethods}\n            displayedIndex={index}\n            handleDelete={() => remove(index)}\n            baseObjectPathToActionOfForm={`actions.${index}`}\n          />\n        </Card>\n      ))}\n      <Button\n        iconStart={<AddCircle />}\n        variant=\"primary\"\n        onClick={() => append(emptyAction())}\n        className={styles.addActionButton}\n      >\n        {t('scenarioDrawer.measureTab.addMeasureButton')}\n      </Button>\n    </Paper>\n  );\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"ActionsSection.esm.js","sources":["../../../../src/components/scenarioDrawer/components/ActionsSection.tsx"],"sourcesContent":["import { useEffect, useState } from 'react';\nimport Paper from '@mui/material/Paper';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { pluginRiScTranslationRef } from '../../../utils/translations';\nimport { emptyAction, useScenario } from '../../../contexts/ScenarioContext';\nimport sharedStyles from '../scenarioDrawer.module.css';\nimport { useFieldArray, UseFormReturn } from 'react-hook-form';\nimport { Action, FormScenario } from '../../../utils/types';\nimport { ActionFormItem } from './ActionFormItem';\nimport { AddCircle } from '@mui/icons-material';\nimport Switch from '@mui/material/Switch';\nimport { useActionFiltersStorage } from '../../../stores/ActionFiltersStore.ts';\nimport {\n  Text,\n  Tooltip,\n  TooltipTrigger,\n  Flex,\n  Button,\n  Card,\n  Box,\n} from '@backstage/ui';\nimport { useSortActionsByRelevance } from '../../../hooks/UseSortActionsByRelevance.ts';\nimport { filterActionsByRelevance } from '../../../utils/actions.ts';\nimport { ActionRowList } from '../../action/ActionRowList.tsx';\nimport styles from './ActionsSection.module.css';\nimport { ActionStatusOptions } from '../../../utils/constants.ts';\n\nconst RelevanceToggle = ({\n  checked,\n  onChange,\n}: {\n  checked: boolean;\n  onChange: (checked: boolean) => void;\n}) => {\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n\n  return (\n    <Flex align=\"center\" gap=\"0\" className={styles.noRelevantActionToggle}>\n      <Switch\n        checked={checked}\n        onChange={e => onChange(e.target.checked)}\n        name=\"showOnlyRelevant\"\n        color=\"primary\"\n      />\n      <Text variant=\"body-medium\">{t('dictionary.showOnlyRelevant')}</Text>\n    </Flex>\n  );\n};\n\ntype ActionSectionProps = {\n  formMethods: UseFormReturn<FormScenario>;\n  isEditing: boolean;\n};\n\nexport function ActionsSection({ formMethods, isEditing }: ActionSectionProps) {\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n  const { scenario } = useScenario();\n\n  const [allowActionDeletion, setAllowActionDeletion] =\n    useState<boolean>(false);\n  const { watch } = formMethods;\n  const currentActions = watch('actions');\n\n  const [sortedActions, setSortedActions] = useState<Action[] | undefined>(\n    undefined,\n  );\n  const { actionFilters, saveOnlyRelevantFilter } = useActionFiltersStorage();\n  const sortActionsByRelevance = useSortActionsByRelevance();\n\n  useEffect(() => {\n    setSortedActions(sortedActionsState => {\n      if (sortedActionsState === undefined)\n        return sortActionsByRelevance([...currentActions]);\n\n      // sync actions\n      const updatedSortedActions: Action[] = [];\n      for (const action of sortedActionsState) {\n        const updatedAction = currentActions.find(a => a.ID === action.ID);\n        if (updatedAction) updatedSortedActions.push(updatedAction);\n      }\n      // add new actions\n      for (const action of currentActions) {\n        if (!updatedSortedActions.some(a => a.ID === action.ID)) {\n          updatedSortedActions.push(action);\n        }\n      }\n      return updatedSortedActions;\n    });\n  }, [currentActions, actionFilters, sortActionsByRelevance]);\n\n  if (isEditing) {\n    return <ActionsSectionOnEdit formMethods={formMethods} />;\n  }\n\n  const doesCurrentActionsContainNotRelevantActions = currentActions.some(\n    action => action.status === ActionStatusOptions.NotRelevant,\n  );\n\n  const isActionsEmpty = currentActions.length === 0;\n\n  return (\n    <Paper className={sharedStyles.section}>\n      <Flex justify=\"between\" mb=\"2\">\n        <Text variant=\"title-x-small\" weight=\"bold\">\n          {t('dictionary.measures')}\n        </Text>\n        <Flex align=\"center\">\n          {doesCurrentActionsContainNotRelevantActions && (\n            <RelevanceToggle\n              checked={actionFilters.showOnlyRelevant}\n              onChange={value => saveOnlyRelevantFilter(value)}\n            />\n          )}\n          {!isActionsEmpty && (\n            <TooltipTrigger>\n              <Button\n                iconStart={\n                  allowActionDeletion ? (\n                    <i className=\"ri-checkbox-circle-line\" />\n                  ) : (\n                    <i className=\"ri-pencil-line\" />\n                  )\n                }\n                variant=\"secondary\"\n                onClick={() => setAllowActionDeletion(prev => !prev)}\n              >\n                {allowActionDeletion}\n              </Button>\n              <Tooltip>\n                {allowActionDeletion\n                  ? t('scenarioTable.doneEditing')\n                  : t('scenarioTable.editButton')}\n              </Tooltip>\n            </TooltipTrigger>\n          )}\n        </Flex>\n      </Flex>\n      {sortedActions !== undefined && sortedActions.length > 0 ? (\n        <ActionRowList\n          scenarioId={scenario.ID}\n          displayedActions={filterActionsByRelevance(\n            sortedActions,\n            actionFilters.showOnlyRelevant,\n          )}\n          allowDeletion={allowActionDeletion}\n          allowEdit\n        />\n      ) : (\n        <Text variant=\"body-large\" className={styles.italicText}>\n          {!currentActions || currentActions.length === 0\n            ? t('dictionary.emptyField', {\n                field: t('dictionary.measures').toLowerCase(),\n              })\n            : t('dictionary.noRelevantMeasures')}\n        </Text>\n      )}\n    </Paper>\n  );\n}\n\ntype ActionsSectionOnEditProps = {\n  formMethods: UseFormReturn<FormScenario>;\n};\n\nfunction ActionsSectionOnEdit(props: ActionsSectionOnEditProps) {\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n\n  const { control } = props.formMethods;\n  const { fields, append, remove } = useFieldArray({\n    control,\n    name: 'actions',\n  });\n\n  return (\n    <Paper className={sharedStyles.section}>\n      <Box>\n        <Text variant=\"title-x-small\" weight=\"bold\">\n          {t('dictionary.measures')}\n        </Text>\n      </Box>\n      {fields.map((field, index) => (\n        <Card key={field.id} className={styles.actionFormItemCard}>\n          <ActionFormItem\n            key={index}\n            formMethods={props.formMethods}\n            displayedIndex={index}\n            handleDelete={() => remove(index)}\n            baseObjectPathToActionOfForm={`actions.${index}`}\n          />\n        </Card>\n      ))}\n      <Button\n        iconStart={<AddCircle />}\n        variant=\"primary\"\n        onClick={() => append(emptyAction())}\n        className={styles.addActionButton}\n      >\n        {t('scenarioDrawer.measureTab.addMeasureButton')}\n      </Button>\n    </Paper>\n  );\n}\n"],"names":["styles","sharedStyles"],"mappings":"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"}

package/dist/components/scenarioDrawer/components/RiskFormSection.esm.js

@@ -8,7 +8,7 @@ import { probabilityOptions, consequenceOptions } from '../../../utils/constants
 import { pluginRiScTranslationRef } from '../../../utils/translations.esm.js';
 import { probabilityIndexToTranslationKeys, findProbabilityIndex, consequenceIndexToTranslationKeys, findConsequenceIndex } from '../../../utils/utilityfunctions.esm.js';
 import { Select } from '../../common/Select.esm.js';
-import { section, riscSection, selectSection, headerSection } from '../scenarioDrawerComponents.esm.js';
+import styles from '../scenarioDrawer.module.css.esm.js';
 import RiskOptionDisplay from './RiskOptionDisplay.esm.js';
 import { Text } from '@backstage/ui';
 
@@ -69,7 +69,7 @@ function ScenarioForm({
       )
     }));
   };
-  return /* @__PURE__ */ jsxs(Paper, { sx: section, children: [
+  return /* @__PURE__ */ jsxs(Paper, { className: styles.section, children: [
     /* @__PURE__ */ jsx(
       Box,
       {
@@ -77,12 +77,12 @@ function ScenarioForm({
           display: "flex",
           gap: "24px"
         },
-        children: /* @__PURE__ */ jsx(Paper, { sx: riscSection, children: /* @__PURE__ */ jsxs(Box, { sx: selectSection, children: [
-          /* @__PURE__ */ jsxs(Box, { sx: headerSection, children: [
+        children: /* @__PURE__ */ jsx(Paper, { className: styles.riscSection, children: /* @__PURE__ */ jsxs(Box, { className: styles.selectSection, children: [
+          /* @__PURE__ */ jsxs(Box, { className: styles.headerSection, children: [
             /* @__PURE__ */ jsx(Text, { variant: "title-x-small", weight: "bold", children: t("dictionary.initialRisk") }),
             /* @__PURE__ */ jsx(Text, { variant: "body-large", children: t("scenarioDrawer.riskMatrixModal.startRisk") })
           ] }),
-          /* @__PURE__ */ jsxs(Box, { sx: headerSection, children: [
+          /* @__PURE__ */ jsxs(Box, { className: styles.headerSection, children: [
             /* @__PURE__ */ jsx(Text, { variant: "title-x-small", weight: "bold", children: t("dictionary.restRisk") }),
             /* @__PURE__ */ jsx(Text, { variant: "body-large", children: t("scenarioDrawer.riskMatrixModal.restRisk") })
           ] }),

package/dist/components/scenarioDrawer/components/RiskFormSection.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"RiskFormSection.esm.js","sources":["../../../../src/components/scenarioDrawer/components/RiskFormSection.tsx"],"sourcesContent":["import { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport InfoIcon from '@mui/icons-material/Info';\nimport Box from '@mui/material/Box';\nimport IconButton from '@mui/material/IconButton';\nimport Paper from '@mui/material/Paper';\nimport { UseFormReturn } from 'react-hook-form';\nimport {\n  consequenceOptions,\n  probabilityOptions,\n} from '../../../utils/constants';\nimport { pluginRiScTranslationRef } from '../../../utils/translations';\nimport { FormScenario } from '../../../utils/types';\nimport {\n  consequenceIndexToTranslationKeys,\n  findConsequenceIndex,\n  findProbabilityIndex,\n  probabilityIndexToTranslationKeys,\n} from '../../../utils/utilityfunctions';\nimport { Select } from '../../common/Select';\nimport {\n  headerSection,\n  riscSection,\n  section,\n  selectSection,\n} from '../scenarioDrawerComponents';\nimport RiskOptionDisplay from './RiskOptionDisplay';\nimport { Text } from '@backstage/ui';\n\nfunction ScenarioForm({\n  formMethods,\n  setIsMatrixDialogOpen,\n}: {\n  formMethods: UseFormReturn<FormScenario>;\n  setIsMatrixDialogOpen: React.Dispatch<React.SetStateAction<boolean>>;\n}) {\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n  const {\n    watch,\n    control,\n    formState: { errors },\n  } = formMethods;\n\n  const [\n    riskProbability,\n    riskConsequence,\n    remainingRiskProbability,\n    remainingRiskConsequence,\n  ] = watch([\n    'risk.probability',\n    'risk.consequence',\n    'remainingRisk.probability',\n    'remainingRisk.consequence',\n  ]);\n\n  const probabilityValues = (selectedValue: number) => {\n    return probabilityOptions.map((value, index) => ({\n      value: `${value}`,\n      renderedValue: (\n        <RiskOptionDisplay\n          isSelected={\n            findProbabilityIndex(value) === findProbabilityIndex(selectedValue)\n          }\n          level={index + 1}\n          label={\n            /* @ts-ignore Because ts can't typecheck strings against our keys */\n            `${t(`probabilityTable.rows.${index + 1}`)} (${t(\n              probabilityIndexToTranslationKeys[index],\n            )})`\n          }\n        />\n      ),\n    }));\n  };\n\n  const consequenceValues = (selectedValue: number) => {\n    return consequenceOptions.map((value, index) => ({\n      value: `${value}`,\n      renderedValue: (\n        <RiskOptionDisplay\n          isSelected={\n            findConsequenceIndex(value) === findConsequenceIndex(selectedValue)\n          }\n          level={index + 1}\n          label={\n            /* @ts-ignore Because ts can't typecheck strings against our keys */\n            `${t(`consequenceTable.rows.${index + 1}`)} (${t(\n              consequenceIndexToTranslationKeys[index],\n            )})`\n          }\n        />\n      ),\n    }));\n  };\n\n  return (\n    <Paper sx={section}>\n      <Box\n        sx={{\n          display: 'flex',\n          gap: '24px',\n        }}\n      >\n        <Paper sx={riscSection}>\n          <Box sx={selectSection}>\n            {/* Row 1 */}\n            <Box sx={headerSection}>\n              <Text variant=\"title-x-small\" weight=\"bold\">\n                {t('dictionary.initialRisk')}\n              </Text>\n              <Text variant=\"body-large\">\n                {t('scenarioDrawer.riskMatrixModal.startRisk')}\n              </Text>\n            </Box>\n            <Box sx={headerSection}>\n              <Text variant=\"title-x-small\" weight=\"bold\">\n                {t('dictionary.restRisk')}\n              </Text>\n              <Text variant=\"body-large\">\n                {t('scenarioDrawer.riskMatrixModal.restRisk')}\n              </Text>\n            </Box>\n\n            {/* Row 2 */}\n            <Select<FormScenario>\n              control={control}\n              name=\"risk.probability\"\n              label={t('infoDialog.probabilityTitle')}\n              options={probabilityValues(Number(riskProbability))}\n            />\n            <Select<FormScenario>\n              control={control}\n              name=\"remainingRisk.probability\"\n              label={t('infoDialog.probabilityTitle')}\n              options={probabilityValues(Number(remainingRiskProbability))}\n              rules={{\n                validate: (value, _) =>\n                  Number(value) <=\n                    Number(control._formValues.risk?.probability) ||\n                  t('scenarioDrawer.errors.remainingProbabilityTooHigh'),\n              }}\n              error={errors.remainingRisk?.probability !== undefined}\n              helperText={errors.remainingRisk?.probability?.message}\n            />\n\n            {/* Row 3 */}\n            <Select<FormScenario>\n              control={control}\n              name=\"risk.consequence\"\n              label={t('infoDialog.consequenceTitle')}\n              options={consequenceValues(Number(riskConsequence))}\n            />\n            <Select<FormScenario>\n              control={control}\n              name=\"remainingRisk.consequence\"\n              label={t('infoDialog.consequenceTitle')}\n              options={consequenceValues(Number(remainingRiskConsequence))}\n              rules={{\n                validate: (value, _) =>\n                  Number(value) <=\n                    Number(control._formValues.risk?.consequence) ||\n                  t('scenarioDrawer.errors.remainingConsequenceTooHigh'),\n              }}\n              error={errors.remainingRisk?.consequence !== undefined}\n              helperText={errors.remainingRisk?.consequence?.message}\n            />\n          </Box>\n        </Paper>\n      </Box>\n      <IconButton\n        sx={{\n          position: 'absolute',\n          top: 10,\n          right: 10,\n        }}\n        onClick={() => setIsMatrixDialogOpen(true)}\n        color=\"primary\"\n      >\n        <InfoIcon />\n      </IconButton>\n    </Paper>\n  );\n}\n\nexport default ScenarioForm;\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"RiskFormSection.esm.js","sources":["../../../../src/components/scenarioDrawer/components/RiskFormSection.tsx"],"sourcesContent":["import { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport InfoIcon from '@mui/icons-material/Info';\nimport Box from '@mui/material/Box';\nimport IconButton from '@mui/material/IconButton';\nimport Paper from '@mui/material/Paper';\nimport { UseFormReturn } from 'react-hook-form';\nimport {\n  consequenceOptions,\n  probabilityOptions,\n} from '../../../utils/constants';\nimport { pluginRiScTranslationRef } from '../../../utils/translations';\nimport { FormScenario } from '../../../utils/types';\nimport {\n  consequenceIndexToTranslationKeys,\n  findConsequenceIndex,\n  findProbabilityIndex,\n  probabilityIndexToTranslationKeys,\n} from '../../../utils/utilityfunctions';\nimport { Select } from '../../common/Select';\nimport styles from '../scenarioDrawer.module.css';\nimport RiskOptionDisplay from './RiskOptionDisplay';\nimport { Text } from '@backstage/ui';\n\nfunction ScenarioForm({\n  formMethods,\n  setIsMatrixDialogOpen,\n}: {\n  formMethods: UseFormReturn<FormScenario>;\n  setIsMatrixDialogOpen: React.Dispatch<React.SetStateAction<boolean>>;\n}) {\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n  const {\n    watch,\n    control,\n    formState: { errors },\n  } = formMethods;\n\n  const [\n    riskProbability,\n    riskConsequence,\n    remainingRiskProbability,\n    remainingRiskConsequence,\n  ] = watch([\n    'risk.probability',\n    'risk.consequence',\n    'remainingRisk.probability',\n    'remainingRisk.consequence',\n  ]);\n\n  const probabilityValues = (selectedValue: number) => {\n    return probabilityOptions.map((value, index) => ({\n      value: `${value}`,\n      renderedValue: (\n        <RiskOptionDisplay\n          isSelected={\n            findProbabilityIndex(value) === findProbabilityIndex(selectedValue)\n          }\n          level={index + 1}\n          label={\n            /* @ts-ignore Because ts can't typecheck strings against our keys */\n            `${t(`probabilityTable.rows.${index + 1}`)} (${t(\n              probabilityIndexToTranslationKeys[index],\n            )})`\n          }\n        />\n      ),\n    }));\n  };\n\n  const consequenceValues = (selectedValue: number) => {\n    return consequenceOptions.map((value, index) => ({\n      value: `${value}`,\n      renderedValue: (\n        <RiskOptionDisplay\n          isSelected={\n            findConsequenceIndex(value) === findConsequenceIndex(selectedValue)\n          }\n          level={index + 1}\n          label={\n            /* @ts-ignore Because ts can't typecheck strings against our keys */\n            `${t(`consequenceTable.rows.${index + 1}`)} (${t(\n              consequenceIndexToTranslationKeys[index],\n            )})`\n          }\n        />\n      ),\n    }));\n  };\n\n  return (\n    <Paper className={styles.section}>\n      <Box\n        sx={{\n          display: 'flex',\n          gap: '24px',\n        }}\n      >\n        <Paper className={styles.riscSection}>\n          <Box className={styles.selectSection}>\n            {/* Row 1 */}\n            <Box className={styles.headerSection}>\n              <Text variant=\"title-x-small\" weight=\"bold\">\n                {t('dictionary.initialRisk')}\n              </Text>\n              <Text variant=\"body-large\">\n                {t('scenarioDrawer.riskMatrixModal.startRisk')}\n              </Text>\n            </Box>\n            <Box className={styles.headerSection}>\n              <Text variant=\"title-x-small\" weight=\"bold\">\n                {t('dictionary.restRisk')}\n              </Text>\n              <Text variant=\"body-large\">\n                {t('scenarioDrawer.riskMatrixModal.restRisk')}\n              </Text>\n            </Box>\n\n            {/* Row 2 */}\n            <Select<FormScenario>\n              control={control}\n              name=\"risk.probability\"\n              label={t('infoDialog.probabilityTitle')}\n              options={probabilityValues(Number(riskProbability))}\n            />\n            <Select<FormScenario>\n              control={control}\n              name=\"remainingRisk.probability\"\n              label={t('infoDialog.probabilityTitle')}\n              options={probabilityValues(Number(remainingRiskProbability))}\n              rules={{\n                validate: (value, _) =>\n                  Number(value) <=\n                    Number(control._formValues.risk?.probability) ||\n                  t('scenarioDrawer.errors.remainingProbabilityTooHigh'),\n              }}\n              error={errors.remainingRisk?.probability !== undefined}\n              helperText={errors.remainingRisk?.probability?.message}\n            />\n\n            {/* Row 3 */}\n            <Select<FormScenario>\n              control={control}\n              name=\"risk.consequence\"\n              label={t('infoDialog.consequenceTitle')}\n              options={consequenceValues(Number(riskConsequence))}\n            />\n            <Select<FormScenario>\n              control={control}\n              name=\"remainingRisk.consequence\"\n              label={t('infoDialog.consequenceTitle')}\n              options={consequenceValues(Number(remainingRiskConsequence))}\n              rules={{\n                validate: (value, _) =>\n                  Number(value) <=\n                    Number(control._formValues.risk?.consequence) ||\n                  t('scenarioDrawer.errors.remainingConsequenceTooHigh'),\n              }}\n              error={errors.remainingRisk?.consequence !== undefined}\n              helperText={errors.remainingRisk?.consequence?.message}\n            />\n          </Box>\n        </Paper>\n      </Box>\n      <IconButton\n        sx={{\n          position: 'absolute',\n          top: 10,\n          right: 10,\n        }}\n        onClick={() => setIsMatrixDialogOpen(true)}\n        color=\"primary\"\n      >\n        <InfoIcon />\n      </IconButton>\n    </Paper>\n  );\n}\n\nexport default ScenarioForm;\n"],"names":[],"mappings":"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"}

package/dist/components/scenarioDrawer/components/RiskSection.esm.js

@@ -6,13 +6,13 @@ import Paper from '@mui/material/Paper';
 import { useScenario } from '../../../contexts/ScenarioContext.esm.js';
 import { pluginRiScTranslationRef } from '../../../utils/translations.esm.js';
 import { getRiskMatrixColor, getProbabilityLevel, getConsequenceLevel, formatNOK } from '../../../utils/utilityfunctions.esm.js';
-import { section } from '../scenarioDrawerComponents.esm.js';
+import styles from '../scenarioDrawer.module.css.esm.js';
 import { Text } from '@backstage/ui';
 
 function RiskBox({ risk, heading }) {
   const { t } = useTranslationRef(pluginRiScTranslationRef);
   const cost = risk.probability * risk.consequence;
-  return /* @__PURE__ */ jsxs(Paper, { sx: section, children: [
+  return /* @__PURE__ */ jsxs(Paper, { className: styles.section, children: [
     /* @__PURE__ */ jsx(Text, { variant: "title-x-small", weight: "bold", children: heading }),
     /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsxs(
       Box,

package/dist/components/scenarioDrawer/components/RiskSection.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"RiskSection.esm.js","sources":["../../../../src/components/scenarioDrawer/components/RiskSection.tsx"],"sourcesContent":["import { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport KeyboardDoubleArrowRightIcon from '@mui/icons-material/KeyboardDoubleArrowRight';\nimport Box from '@mui/material/Box';\nimport Paper from '@mui/material/Paper';\nimport { useScenario } from '../../../contexts/ScenarioContext';\nimport { pluginRiScTranslationRef } from '../../../utils/translations';\nimport { Risk } from '../../../utils/types';\nimport {\n  formatNOK,\n  getConsequenceLevel,\n  getProbabilityLevel,\n  getRiskMatrixColor,\n} from '../../../utils/utilityfunctions';\nimport { section } from '../scenarioDrawerComponents';\nimport { Text } from '@backstage/ui';\n\ninterface RiskProps {\n  risk: Risk;\n  heading: string;\n}\n\nfunction RiskBox({ risk, heading }: RiskProps) {\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n\n  const cost = risk.probability * risk.consequence;\n\n  return (\n    <Paper sx={section}>\n      <Text variant=\"title-x-small\" weight=\"bold\">\n        {heading}\n      </Text>\n\n      <Box>\n        <Box\n          sx={{\n            display: 'flex',\n            alignItems: 'center',\n            gap: 1,\n          }}\n        >\n          <Box\n            sx={{\n              width: '20px',\n              height: '48px',\n              borderRadius: 1,\n              backgroundColor: getRiskMatrixColor(risk),\n            }}\n          />\n          <Box\n            sx={{\n              display: 'flex',\n              flexDirection: 'column',\n              alignItems: 'start',\n              gap: 0.5,\n            }}\n          >\n            <Text variant=\"body-medium\" style={{ fontWeight: '700' }}>\n              {t('dictionary.probability')}: {getProbabilityLevel(risk)}\n            </Text>\n            <Text variant=\"body-medium\" style={{ fontWeight: '700' }}>\n              {t('dictionary.consequence')}: {getConsequenceLevel(risk)}\n            </Text>\n          </Box>\n        </Box>\n      </Box>\n      <Box>\n        <Text\n          as=\"p\"\n          variant=\"body-medium\"\n          style={{ paddingBottom: '0.4rem', fontWeight: '700' }}\n        >\n          {t('dictionary.estimatedRisk')}\n        </Text>\n        <Text variant=\"body-large\" weight=\"bold\">\n          {formatNOK(cost)} {t('riskMatrix.estimatedRisk.unit.nokPerYear')}\n        </Text>\n      </Box>\n    </Paper>\n  );\n}\n\nexport function RiskSection() {\n  const { scenario } = useScenario();\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n\n  return (\n    <Box sx={{ display: 'flex', alignItems: 'center', gap: 1 }}>\n      <RiskBox risk={scenario.risk} heading={t('dictionary.initialRisk')} />\n      <KeyboardDoubleArrowRightIcon sx={{ fontSize: '48px' }} />\n      <RiskBox\n        risk={scenario.remainingRisk}\n        heading={t('dictionary.restRisk')}\n      />\n    </Box>\n  );\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"RiskSection.esm.js","sources":["../../../../src/components/scenarioDrawer/components/RiskSection.tsx"],"sourcesContent":["import { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport KeyboardDoubleArrowRightIcon from '@mui/icons-material/KeyboardDoubleArrowRight';\nimport Box from '@mui/material/Box';\nimport Paper from '@mui/material/Paper';\nimport { useScenario } from '../../../contexts/ScenarioContext';\nimport { pluginRiScTranslationRef } from '../../../utils/translations';\nimport { Risk } from '../../../utils/types';\nimport {\n  formatNOK,\n  getConsequenceLevel,\n  getProbabilityLevel,\n  getRiskMatrixColor,\n} from '../../../utils/utilityfunctions';\nimport styles from '../scenarioDrawer.module.css';\nimport { Text } from '@backstage/ui';\n\ninterface RiskProps {\n  risk: Risk;\n  heading: string;\n}\n\nfunction RiskBox({ risk, heading }: RiskProps) {\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n\n  const cost = risk.probability * risk.consequence;\n\n  return (\n    <Paper className={styles.section}>\n      <Text variant=\"title-x-small\" weight=\"bold\">\n        {heading}\n      </Text>\n\n      <Box>\n        <Box\n          sx={{\n            display: 'flex',\n            alignItems: 'center',\n            gap: 1,\n          }}\n        >\n          <Box\n            sx={{\n              width: '20px',\n              height: '48px',\n              borderRadius: 1,\n              backgroundColor: getRiskMatrixColor(risk),\n            }}\n          />\n          <Box\n            sx={{\n              display: 'flex',\n              flexDirection: 'column',\n              alignItems: 'start',\n              gap: 0.5,\n            }}\n          >\n            <Text variant=\"body-medium\" style={{ fontWeight: '700' }}>\n              {t('dictionary.probability')}: {getProbabilityLevel(risk)}\n            </Text>\n            <Text variant=\"body-medium\" style={{ fontWeight: '700' }}>\n              {t('dictionary.consequence')}: {getConsequenceLevel(risk)}\n            </Text>\n          </Box>\n        </Box>\n      </Box>\n      <Box>\n        <Text\n          as=\"p\"\n          variant=\"body-medium\"\n          style={{ paddingBottom: '0.4rem', fontWeight: '700' }}\n        >\n          {t('dictionary.estimatedRisk')}\n        </Text>\n        <Text variant=\"body-large\" weight=\"bold\">\n          {formatNOK(cost)} {t('riskMatrix.estimatedRisk.unit.nokPerYear')}\n        </Text>\n      </Box>\n    </Paper>\n  );\n}\n\nexport function RiskSection() {\n  const { scenario } = useScenario();\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n\n  return (\n    <Box sx={{ display: 'flex', alignItems: 'center', gap: 1 }}>\n      <RiskBox risk={scenario.risk} heading={t('dictionary.initialRisk')} />\n      <KeyboardDoubleArrowRightIcon sx={{ fontSize: '48px' }} />\n      <RiskBox\n        risk={scenario.remainingRisk}\n        heading={t('dictionary.restRisk')}\n      />\n    </Box>\n  );\n}\n"],"names":[],"mappings":"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"}

package/dist/components/scenarioDrawer/components/ScopeFormSection.esm.js

@@ -8,7 +8,7 @@ import { threatActorOptionsToTranslationKeys, vulnerabiltiesOptionsToTranslation
 import { Input } from '../../common/Input.esm.js';
 import { MarkdownInput } from '../../common/MarkdownInput/MarkdownInput.esm.js';
 import { Select } from '../../common/Select.esm.js';
-import { section } from '../scenarioDrawerComponents.esm.js';
+import styles from '../scenarioDrawer.module.css.esm.js';
 import { Text } from '@backstage/ui';
 
 function ScopeFormSection({
@@ -34,7 +34,7 @@ function ScopeFormSection({
       renderedValue: t(vulnerabiltiesOptionsToTranslationKeys[vulnerability])
     })
   );
-  return /* @__PURE__ */ jsxs(Paper, { sx: section, children: [
+  return /* @__PURE__ */ jsxs(Paper, { className: styles.section, children: [
     /* @__PURE__ */ jsx(Text, { as: "h6", variant: "title-x-small", weight: "bold", children: t("scenarioDrawer.title") }),
     /* @__PURE__ */ jsx(
       Input,

package/dist/components/scenarioDrawer/components/ScopeFormSection.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"ScopeFormSection.esm.js","sources":["../../../../src/components/scenarioDrawer/components/ScopeFormSection.tsx"],"sourcesContent":["import { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport Paper from '@mui/material/Paper';\nimport { Controller, UseFormReturn } from 'react-hook-form';\nimport {\n  ThreatActorsOptions,\n  VulnerabilitiesOptions,\n} from '../../../utils/constants';\nimport { pluginRiScTranslationRef } from '../../../utils/translations';\nimport { FormScenario } from '../../../utils/types';\nimport {\n  threatActorOptionsToTranslationKeys,\n  vulnerabiltiesOptionsToTranslationKeys,\n} from '../../../utils/utilityfunctions';\nimport { Input } from '../../common/Input';\nimport { MarkdownInput } from '../../common/MarkdownInput';\nimport { Select } from '../../common/Select';\nimport { section } from '../scenarioDrawerComponents';\nimport { Text } from '@backstage/ui';\n\nfunction ScopeFormSection({\n  formMethods,\n}: {\n  formMethods: UseFormReturn<FormScenario>;\n}) {\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n  const {\n    control,\n    register,\n    formState: { errors },\n  } = formMethods;\n\n  const threatActorOptions = Object.values(ThreatActorsOptions).map(\n    threatActor => ({\n      value: threatActor,\n      /* @ts-ignore Because ts can't typecheck strings against our keys */\n      renderedValue: t(threatActorOptionsToTranslationKeys[threatActor]),\n    }),\n  );\n\n  const vulnerabilitiesOptions = Object.values(VulnerabilitiesOptions).map(\n    vulnerability => ({\n      value: vulnerability,\n      /* @ts-ignore Because ts can't typecheck strings against our keys */\n      renderedValue: t(vulnerabiltiesOptionsToTranslationKeys[vulnerability]),\n    }),\n  );\n\n  return (\n    <Paper sx={section}>\n      <Text as=\"h6\" variant=\"title-x-small\" weight=\"bold\">\n        {t('scenarioDrawer.title')}\n      </Text>\n      <Input\n        required\n        {...register('title', { required: true })}\n        error={errors.title !== undefined}\n        label={t('dictionary.title')}\n        helperText={errors.title && t('scenarioDrawer.titleError')}\n      />\n      <Select<FormScenario>\n        multiple\n        control={control}\n        name=\"threatActors\"\n        label={t('dictionary.threatActors')}\n        labelTranslationKey=\"threatActors\"\n        options={threatActorOptions}\n      />\n      <Select<FormScenario>\n        multiple\n        control={control}\n        name=\"vulnerabilities\"\n        label={t('dictionary.vulnerabilities')}\n        labelTranslationKey=\"vulnerabilities\"\n        options={vulnerabilitiesOptions}\n      />\n      <Controller\n        control={control}\n        name=\"description\"\n        render={({ field: { onChange, value }, fieldState: { error } }) => (\n          <MarkdownInput\n            value={value}\n            onMarkdownChange={onChange}\n            label={t('dictionary.description')}\n            minRows={8}\n            error={!!error}\n          />\n        )}\n      />\n    </Paper>\n  );\n}\n\nexport default ScopeFormSection;\n"],"names":[],"mappings":";;;;;;;;;;;;;AAmBA,SAAS,gBAAA,CAAiB;AAAA,EACxB;AACF,CAAA,EAEG;AACD,EAAA,MAAM,EAAE,CAAA,EAAE,GAAI,iBAAA,CAAkB,wBAAwB,CAAA;AACxD,EAAA,MAAM;AAAA,IACJ,OAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA,EAAW,EAAE,MAAA;AAAO,GACtB,GAAI,WAAA;AAEJ,EAAA,MAAM,kBAAA,GAAqB,MAAA,CAAO,MAAA,CAAO,mBAAmB,CAAA,CAAE,GAAA;AAAA,IAC5D,CAAA,WAAA,MAAgB;AAAA,MACd,KAAA,EAAO,WAAA;AAAA;AAAA,MAEP,aAAA,EAAe,CAAA,CAAE,mCAAA,CAAoC,WAAW,CAAC;AAAA,KACnE;AAAA,GACF;AAEA,EAAA,MAAM,sBAAA,GAAyB,MAAA,CAAO,MAAA,CAAO,sBAAsB,CAAA,CAAE,GAAA;AAAA,IACnE,CAAA,aAAA,MAAkB;AAAA,MAChB,KAAA,EAAO,aAAA;AAAA;AAAA,MAEP,aAAA,EAAe,CAAA,CAAE,sCAAA,CAAuC,aAAa,CAAC;AAAA,KACxE;AAAA,GACF;AAEA,EAAA,uBACE,IAAA,CAAC,KAAA,EAAA,EAAM,EAAA,EAAI,OAAA,EACT,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,IAAA,EAAA,EAAK,IAAG,IAAA,EAAK,OAAA,EAAQ,iBAAgB,MAAA,EAAO,MAAA,EAC1C,QAAA,EAAA,CAAA,CAAE,sBAAsB,CAAA,EAC3B,CAAA;AAAA,oBACA,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,QAAA,EAAQ,IAAA;AAAA,QACP,GAAG,QAAA,CAAS,OAAA,EAAS,EAAE,QAAA,EAAU,MAAM,CAAA;AAAA,QACxC,KAAA,EAAO,OAAO,KAAA,KAAU,MAAA;AAAA,QACxB,KAAA,EAAO,EAAE,kBAAkB,CAAA;AAAA,QAC3B,UAAA,EAAY,MAAA,CAAO,KAAA,IAAS,CAAA,CAAE,2BAA2B;AAAA;AAAA,KAC3D;AAAA,oBACA,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,QAAA,EAAQ,IAAA;AAAA,QACR,OAAA;AAAA,QACA,IAAA,EAAK,cAAA;AAAA,QACL,KAAA,EAAO,EAAE,yBAAyB,CAAA;AAAA,QAClC,mBAAA,EAAoB,cAAA;AAAA,QACpB,OAAA,EAAS;AAAA;AAAA,KACX;AAAA,oBACA,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,QAAA,EAAQ,IAAA;AAAA,QACR,OAAA;AAAA,QACA,IAAA,EAAK,iBAAA;AAAA,QACL,KAAA,EAAO,EAAE,4BAA4B,CAAA;AAAA,QACrC,mBAAA,EAAoB,iBAAA;AAAA,QACpB,OAAA,EAAS;AAAA;AAAA,KACX;AAAA,oBACA,GAAA;AAAA,MAAC,UAAA;AAAA,MAAA;AAAA,QACC,OAAA;AAAA,QACA,IAAA,EAAK,aAAA;AAAA,QACL,MAAA,EAAQ,CAAC,EAAE,KAAA,EAAO,EAAE,QAAA,EAAU,KAAA,EAAM,EAAG,UAAA,EAAY,EAAE,KAAA,EAAM,EAAE,qBAC3D,GAAA;AAAA,UAAC,aAAA;AAAA,UAAA;AAAA,YACC,KAAA;AAAA,YACA,gBAAA,EAAkB,QAAA;AAAA,YAClB,KAAA,EAAO,EAAE,wBAAwB,CAAA;AAAA,YACjC,OAAA,EAAS,CAAA;AAAA,YACT,KAAA,EAAO,CAAC,CAAC;AAAA;AAAA;AACX;AAAA;AAEJ,GAAA,EACF,CAAA;AAEJ;;;;"}
+{"version":3,"file":"ScopeFormSection.esm.js","sources":["../../../../src/components/scenarioDrawer/components/ScopeFormSection.tsx"],"sourcesContent":["import { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport Paper from '@mui/material/Paper';\nimport { Controller, UseFormReturn } from 'react-hook-form';\nimport {\n  ThreatActorsOptions,\n  VulnerabilitiesOptions,\n} from '../../../utils/constants';\nimport { pluginRiScTranslationRef } from '../../../utils/translations';\nimport { FormScenario } from '../../../utils/types';\nimport {\n  threatActorOptionsToTranslationKeys,\n  vulnerabiltiesOptionsToTranslationKeys,\n} from '../../../utils/utilityfunctions';\nimport { Input } from '../../common/Input';\nimport { MarkdownInput } from '../../common/MarkdownInput';\nimport { Select } from '../../common/Select';\nimport styles from '../scenarioDrawer.module.css';\nimport { Text } from '@backstage/ui';\n\nfunction ScopeFormSection({\n  formMethods,\n}: {\n  formMethods: UseFormReturn<FormScenario>;\n}) {\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n  const {\n    control,\n    register,\n    formState: { errors },\n  } = formMethods;\n\n  const threatActorOptions = Object.values(ThreatActorsOptions).map(\n    threatActor => ({\n      value: threatActor,\n      /* @ts-ignore Because ts can't typecheck strings against our keys */\n      renderedValue: t(threatActorOptionsToTranslationKeys[threatActor]),\n    }),\n  );\n\n  const vulnerabilitiesOptions = Object.values(VulnerabilitiesOptions).map(\n    vulnerability => ({\n      value: vulnerability,\n      /* @ts-ignore Because ts can't typecheck strings against our keys */\n      renderedValue: t(vulnerabiltiesOptionsToTranslationKeys[vulnerability]),\n    }),\n  );\n\n  return (\n    <Paper className={styles.section}>\n      <Text as=\"h6\" variant=\"title-x-small\" weight=\"bold\">\n        {t('scenarioDrawer.title')}\n      </Text>\n      <Input\n        required\n        {...register('title', { required: true })}\n        error={errors.title !== undefined}\n        label={t('dictionary.title')}\n        helperText={errors.title && t('scenarioDrawer.titleError')}\n      />\n      <Select<FormScenario>\n        multiple\n        control={control}\n        name=\"threatActors\"\n        label={t('dictionary.threatActors')}\n        labelTranslationKey=\"threatActors\"\n        options={threatActorOptions}\n      />\n      <Select<FormScenario>\n        multiple\n        control={control}\n        name=\"vulnerabilities\"\n        label={t('dictionary.vulnerabilities')}\n        labelTranslationKey=\"vulnerabilities\"\n        options={vulnerabilitiesOptions}\n      />\n      <Controller\n        control={control}\n        name=\"description\"\n        render={({ field: { onChange, value }, fieldState: { error } }) => (\n          <MarkdownInput\n            value={value}\n            onMarkdownChange={onChange}\n            label={t('dictionary.description')}\n            minRows={8}\n            error={!!error}\n          />\n        )}\n      />\n    </Paper>\n  );\n}\n\nexport default ScopeFormSection;\n"],"names":[],"mappings":";;;;;;;;;;;;;AAmBA,SAAS,gBAAA,CAAiB;AAAA,EACxB;AACF,CAAA,EAEG;AACD,EAAA,MAAM,EAAE,CAAA,EAAE,GAAI,iBAAA,CAAkB,wBAAwB,CAAA;AACxD,EAAA,MAAM;AAAA,IACJ,OAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA,EAAW,EAAE,MAAA;AAAO,GACtB,GAAI,WAAA;AAEJ,EAAA,MAAM,kBAAA,GAAqB,MAAA,CAAO,MAAA,CAAO,mBAAmB,CAAA,CAAE,GAAA;AAAA,IAC5D,CAAA,WAAA,MAAgB;AAAA,MACd,KAAA,EAAO,WAAA;AAAA;AAAA,MAEP,aAAA,EAAe,CAAA,CAAE,mCAAA,CAAoC,WAAW,CAAC;AAAA,KACnE;AAAA,GACF;AAEA,EAAA,MAAM,sBAAA,GAAyB,MAAA,CAAO,MAAA,CAAO,sBAAsB,CAAA,CAAE,GAAA;AAAA,IACnE,CAAA,aAAA,MAAkB;AAAA,MAChB,KAAA,EAAO,aAAA;AAAA;AAAA,MAEP,aAAA,EAAe,CAAA,CAAE,sCAAA,CAAuC,aAAa,CAAC;AAAA,KACxE;AAAA,GACF;AAEA,EAAA,uBACE,IAAA,CAAC,KAAA,EAAA,EAAM,SAAA,EAAW,MAAA,CAAO,OAAA,EACvB,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,IAAA,EAAA,EAAK,IAAG,IAAA,EAAK,OAAA,EAAQ,iBAAgB,MAAA,EAAO,MAAA,EAC1C,QAAA,EAAA,CAAA,CAAE,sBAAsB,CAAA,EAC3B,CAAA;AAAA,oBACA,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,QAAA,EAAQ,IAAA;AAAA,QACP,GAAG,QAAA,CAAS,OAAA,EAAS,EAAE,QAAA,EAAU,MAAM,CAAA;AAAA,QACxC,KAAA,EAAO,OAAO,KAAA,KAAU,MAAA;AAAA,QACxB,KAAA,EAAO,EAAE,kBAAkB,CAAA;AAAA,QAC3B,UAAA,EAAY,MAAA,CAAO,KAAA,IAAS,CAAA,CAAE,2BAA2B;AAAA;AAAA,KAC3D;AAAA,oBACA,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,QAAA,EAAQ,IAAA;AAAA,QACR,OAAA;AAAA,QACA,IAAA,EAAK,cAAA;AAAA,QACL,KAAA,EAAO,EAAE,yBAAyB,CAAA;AAAA,QAClC,mBAAA,EAAoB,cAAA;AAAA,QACpB,OAAA,EAAS;AAAA;AAAA,KACX;AAAA,oBACA,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,QAAA,EAAQ,IAAA;AAAA,QACR,OAAA;AAAA,QACA,IAAA,EAAK,iBAAA;AAAA,QACL,KAAA,EAAO,EAAE,4BAA4B,CAAA;AAAA,QACrC,mBAAA,EAAoB,iBAAA;AAAA,QACpB,OAAA,EAAS;AAAA;AAAA,KACX;AAAA,oBACA,GAAA;AAAA,MAAC,UAAA;AAAA,MAAA;AAAA,QACC,OAAA;AAAA,QACA,IAAA,EAAK,aAAA;AAAA,QACL,MAAA,EAAQ,CAAC,EAAE,KAAA,EAAO,EAAE,QAAA,EAAU,KAAA,EAAM,EAAG,UAAA,EAAY,EAAE,KAAA,EAAM,EAAE,qBAC3D,GAAA;AAAA,UAAC,aAAA;AAAA,UAAA;AAAA,YACC,KAAA;AAAA,YACA,gBAAA,EAAkB,QAAA;AAAA,YAClB,KAAA,EAAO,EAAE,wBAAwB,CAAA;AAAA,YACjC,OAAA,EAAS,CAAA;AAAA,YACT,KAAA,EAAO,CAAC,CAAC;AAAA;AAAA;AACX;AAAA;AAEJ,GAAA,EACF,CAAA;AAEJ;;;;"}

package/dist/components/scenarioDrawer/components/ScopeSection.esm.js

@@ -5,14 +5,14 @@ import Paper from '@mui/material/Paper';
 import Box from '@mui/material/Box';
 import { useTranslationRef } from '@backstage/core-plugin-api/alpha';
 import { useScenario } from '../../../contexts/ScenarioContext.esm.js';
-import { section } from '../scenarioDrawerComponents.esm.js';
+import styles from '../scenarioDrawer.module.css.esm.js';
 import { Markdown } from '../../common/Markdown.esm.js';
 import { Text } from '@backstage/ui';
 
 function ScopeSection() {
   const { t } = useTranslationRef(pluginRiScTranslationRef);
   const { scenario } = useScenario();
-  return /* @__PURE__ */ jsxs(Paper, { sx: section, children: [
+  return /* @__PURE__ */ jsxs(Paper, { className: styles.section, children: [
     /* @__PURE__ */ jsx(Text, { variant: "title-x-small", weight: "bold", children: t("scenarioDrawer.title") }),
     /* @__PURE__ */ jsx(Text, { variant: "title-medium", style: { fontWeight: "700" }, children: scenario.title }),
     /* @__PURE__ */ jsxs(Box, { children: [

package/dist/components/scenarioDrawer/components/ScopeSection.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"ScopeSection.esm.js","sources":["../../../../src/components/scenarioDrawer/components/ScopeSection.tsx"],"sourcesContent":["import { pluginRiScTranslationRef } from '../../../utils/translations';\nimport Divider from '@mui/material/Divider';\nimport Paper from '@mui/material/Paper';\nimport Box from '@mui/material/Box';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { useScenario } from '../../../contexts/ScenarioContext';\nimport { section } from '../scenarioDrawerComponents';\nimport { Markdown } from '../../common/Markdown';\nimport { Text } from '@backstage/ui';\n\nexport function ScopeSection() {\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n  const { scenario } = useScenario();\n\n  return (\n    <Paper sx={section}>\n      <Text variant=\"title-x-small\" weight=\"bold\">\n        {t('scenarioDrawer.title')}\n      </Text>\n\n      <Text variant=\"title-medium\" style={{ fontWeight: '700' }}>\n        {scenario.title}\n      </Text>\n\n      <Box>\n        <Text\n          as=\"p\"\n          variant=\"body-medium\"\n          weight=\"bold\"\n          style={{ paddingBottom: '0.4rem' }}\n        >\n          {t('dictionary.description')}\n        </Text>\n        {scenario.description ? (\n          <Markdown description={scenario.description} />\n        ) : (\n          <Text variant=\"body-large\" style={{ fontStyle: 'italic' }}>\n            {t('dictionary.emptyField', {\n              field: t('dictionary.description').toLowerCase(),\n            })}{' '}\n          </Text>\n        )}\n      </Box>\n\n      <Divider />\n\n      <Box sx={{ display: 'grid', gridTemplateColumns: '1fr 1fr', gap: 2 }}>\n        <Box>\n          <Text\n            as=\"p\"\n            variant=\"body-medium\"\n            style={{ paddingBottom: '0.4rem', fontWeight: '700' }}\n          >\n            {t('dictionary.threatActors')}\n          </Text>\n          {scenario.threatActors.length > 0 ? (\n            scenario.threatActors.map(threatActor => {\n              /* @ts-ignore Because ts can't typecheck strings against our keys */\n              const translatedThreatActor = t(`threatActors.${threatActor}`);\n              return (\n                <Text as=\"p\" variant=\"body-large\" key={threatActor}>\n                  {translatedThreatActor}\n                </Text>\n              );\n            })\n          ) : (\n            <Text variant=\"body-large\" style={{ fontStyle: 'italic' }}>\n              {t('dictionary.emptyField', {\n                field: t('dictionary.threatActors').toLowerCase(),\n              })}\n            </Text>\n          )}\n        </Box>\n\n        <Box>\n          <Text\n            as=\"p\"\n            variant=\"body-medium\"\n            style={{ paddingBottom: '0.4rem', fontWeight: '700' }}\n          >\n            {t('dictionary.vulnerabilities')}\n          </Text>\n          {scenario.vulnerabilities.length > 0 ? (\n            scenario.vulnerabilities.map(vulnerability => {\n              /* @ts-ignore Because ts can't typecheck strings against our keys */\n              const translatedVulnerability = t(\n                `vulnerabilities.${vulnerability}`,\n              );\n              return (\n                <Text variant=\"body-large\" as=\"p\" key={vulnerability}>\n                  {translatedVulnerability}\n                </Text>\n              );\n            })\n          ) : (\n            <Text variant=\"body-large\" style={{ fontStyle: 'italic' }}>\n              {t('dictionary.emptyField', {\n                field: t('dictionary.vulnerabilities').toLowerCase(),\n              })}\n            </Text>\n          )}\n        </Box>\n      </Box>\n    </Paper>\n  );\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"ScopeSection.esm.js","sources":["../../../../src/components/scenarioDrawer/components/ScopeSection.tsx"],"sourcesContent":["import { pluginRiScTranslationRef } from '../../../utils/translations';\nimport Divider from '@mui/material/Divider';\nimport Paper from '@mui/material/Paper';\nimport Box from '@mui/material/Box';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { useScenario } from '../../../contexts/ScenarioContext';\nimport styles from '../scenarioDrawer.module.css';\nimport { Markdown } from '../../common/Markdown';\nimport { Text } from '@backstage/ui';\n\nexport function ScopeSection() {\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n  const { scenario } = useScenario();\n\n  return (\n    <Paper className={styles.section}>\n      <Text variant=\"title-x-small\" weight=\"bold\">\n        {t('scenarioDrawer.title')}\n      </Text>\n\n      <Text variant=\"title-medium\" style={{ fontWeight: '700' }}>\n        {scenario.title}\n      </Text>\n\n      <Box>\n        <Text\n          as=\"p\"\n          variant=\"body-medium\"\n          weight=\"bold\"\n          style={{ paddingBottom: '0.4rem' }}\n        >\n          {t('dictionary.description')}\n        </Text>\n        {scenario.description ? (\n          <Markdown description={scenario.description} />\n        ) : (\n          <Text variant=\"body-large\" style={{ fontStyle: 'italic' }}>\n            {t('dictionary.emptyField', {\n              field: t('dictionary.description').toLowerCase(),\n            })}{' '}\n          </Text>\n        )}\n      </Box>\n\n      <Divider />\n\n      <Box sx={{ display: 'grid', gridTemplateColumns: '1fr 1fr', gap: 2 }}>\n        <Box>\n          <Text\n            as=\"p\"\n            variant=\"body-medium\"\n            style={{ paddingBottom: '0.4rem', fontWeight: '700' }}\n          >\n            {t('dictionary.threatActors')}\n          </Text>\n          {scenario.threatActors.length > 0 ? (\n            scenario.threatActors.map(threatActor => {\n              /* @ts-ignore Because ts can't typecheck strings against our keys */\n              const translatedThreatActor = t(`threatActors.${threatActor}`);\n              return (\n                <Text as=\"p\" variant=\"body-large\" key={threatActor}>\n                  {translatedThreatActor}\n                </Text>\n              );\n            })\n          ) : (\n            <Text variant=\"body-large\" style={{ fontStyle: 'italic' }}>\n              {t('dictionary.emptyField', {\n                field: t('dictionary.threatActors').toLowerCase(),\n              })}\n            </Text>\n          )}\n        </Box>\n\n        <Box>\n          <Text\n            as=\"p\"\n            variant=\"body-medium\"\n            style={{ paddingBottom: '0.4rem', fontWeight: '700' }}\n          >\n            {t('dictionary.vulnerabilities')}\n          </Text>\n          {scenario.vulnerabilities.length > 0 ? (\n            scenario.vulnerabilities.map(vulnerability => {\n              /* @ts-ignore Because ts can't typecheck strings against our keys */\n              const translatedVulnerability = t(\n                `vulnerabilities.${vulnerability}`,\n              );\n              return (\n                <Text variant=\"body-large\" as=\"p\" key={vulnerability}>\n                  {translatedVulnerability}\n                </Text>\n              );\n            })\n          ) : (\n            <Text variant=\"body-large\" style={{ fontStyle: 'italic' }}>\n              {t('dictionary.emptyField', {\n                field: t('dictionary.vulnerabilities').toLowerCase(),\n              })}\n            </Text>\n          )}\n        </Box>\n      </Box>\n    </Paper>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;;;;AAUO,SAAS,YAAA,GAAe;AAC7B,EAAA,MAAM,EAAE,CAAA,EAAE,GAAI,iBAAA,CAAkB,wBAAwB,CAAA;AACxD,EAAA,MAAM,EAAE,QAAA,EAAS,GAAI,WAAA,EAAY;AAEjC,EAAA,uBACE,IAAA,CAAC,KAAA,EAAA,EAAM,SAAA,EAAW,MAAA,CAAO,OAAA,EACvB,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,QAAK,OAAA,EAAQ,eAAA,EAAgB,QAAO,MAAA,EAClC,QAAA,EAAA,CAAA,CAAE,sBAAsB,CAAA,EAC3B,CAAA;AAAA,oBAEA,GAAA,CAAC,IAAA,EAAA,EAAK,OAAA,EAAQ,cAAA,EAAe,KAAA,EAAO,EAAE,UAAA,EAAY,KAAA,EAAM,EACrD,QAAA,EAAA,QAAA,CAAS,KAAA,EACZ,CAAA;AAAA,yBAEC,GAAA,EAAA,EACC,QAAA,EAAA;AAAA,sBAAA,GAAA;AAAA,QAAC,IAAA;AAAA,QAAA;AAAA,UACC,EAAA,EAAG,GAAA;AAAA,UACH,OAAA,EAAQ,aAAA;AAAA,UACR,MAAA,EAAO,MAAA;AAAA,UACP,KAAA,EAAO,EAAE,aAAA,EAAe,QAAA,EAAS;AAAA,UAEhC,YAAE,wBAAwB;AAAA;AAAA,OAC7B;AAAA,MACC,SAAS,WAAA,mBACR,GAAA,CAAC,QAAA,EAAA,EAAS,WAAA,EAAa,SAAS,WAAA,EAAa,CAAA,mBAE7C,IAAA,CAAC,IAAA,EAAA,EAAK,SAAQ,YAAA,EAAa,KAAA,EAAO,EAAE,SAAA,EAAW,UAAS,EACrD,QAAA,EAAA;AAAA,QAAA,CAAA,CAAE,uBAAA,EAAyB;AAAA,UAC1B,KAAA,EAAO,CAAA,CAAE,wBAAwB,CAAA,CAAE,WAAA;AAAY,SAChD,CAAA;AAAA,QAAG;AAAA,OAAA,EACN;AAAA,KAAA,EAEJ,CAAA;AAAA,wBAEC,OAAA,EAAA,EAAQ,CAAA;AAAA,oBAET,IAAA,CAAC,GAAA,EAAA,EAAI,EAAA,EAAI,EAAE,OAAA,EAAS,QAAQ,mBAAA,EAAqB,SAAA,EAAW,GAAA,EAAK,CAAA,EAAE,EACjE,QAAA,EAAA;AAAA,sBAAA,IAAA,CAAC,GAAA,EAAA,EACC,QAAA,EAAA;AAAA,wBAAA,GAAA;AAAA,UAAC,IAAA;AAAA,UAAA;AAAA,YACC,EAAA,EAAG,GAAA;AAAA,YACH,OAAA,EAAQ,aAAA;AAAA,YACR,KAAA,EAAO,EAAE,aAAA,EAAe,QAAA,EAAU,YAAY,KAAA,EAAM;AAAA,YAEnD,YAAE,yBAAyB;AAAA;AAAA,SAC9B;AAAA,QACC,SAAS,YAAA,CAAa,MAAA,GAAS,IAC9B,QAAA,CAAS,YAAA,CAAa,IAAI,CAAA,WAAA,KAAe;AAEvC,UAAA,MAAM,qBAAA,GAAwB,CAAA,CAAE,CAAA,aAAA,EAAgB,WAAW,CAAA,CAAE,CAAA;AAC7D,UAAA,2BACG,IAAA,EAAA,EAAK,EAAA,EAAG,KAAI,OAAA,EAAQ,YAAA,EAClB,mCADoC,WAEvC,CAAA;AAAA,QAEJ,CAAC,CAAA,mBAED,GAAA,CAAC,IAAA,EAAA,EAAK,OAAA,EAAQ,YAAA,EAAa,KAAA,EAAO,EAAE,SAAA,EAAW,QAAA,EAAS,EACrD,QAAA,EAAA,CAAA,CAAE,uBAAA,EAAyB;AAAA,UAC1B,KAAA,EAAO,CAAA,CAAE,yBAAyB,CAAA,CAAE,WAAA;AAAY,SACjD,CAAA,EACH;AAAA,OAAA,EAEJ,CAAA;AAAA,2BAEC,GAAA,EAAA,EACC,QAAA,EAAA;AAAA,wBAAA,GAAA;AAAA,UAAC,IAAA;AAAA,UAAA;AAAA,YACC,EAAA,EAAG,GAAA;AAAA,YACH,OAAA,EAAQ,aAAA;AAAA,YACR,KAAA,EAAO,EAAE,aAAA,EAAe,QAAA,EAAU,YAAY,KAAA,EAAM;AAAA,YAEnD,YAAE,4BAA4B;AAAA;AAAA,SACjC;AAAA,QACC,SAAS,eAAA,CAAgB,MAAA,GAAS,IACjC,QAAA,CAAS,eAAA,CAAgB,IAAI,CAAA,aAAA,KAAiB;AAE5C,UAAA,MAAM,uBAAA,GAA0B,CAAA;AAAA,YAC9B,mBAAmB,aAAa,CAAA;AAAA,WAClC;AACA,UAAA,2BACG,IAAA,EAAA,EAAK,OAAA,EAAQ,cAAa,EAAA,EAAG,GAAA,EAC3B,qCADoC,aAEvC,CAAA;AAAA,QAEJ,CAAC,CAAA,mBAED,GAAA,CAAC,IAAA,EAAA,EAAK,OAAA,EAAQ,YAAA,EAAa,KAAA,EAAO,EAAE,SAAA,EAAW,QAAA,EAAS,EACrD,QAAA,EAAA,CAAA,CAAE,uBAAA,EAAyB;AAAA,UAC1B,KAAA,EAAO,CAAA,CAAE,4BAA4B,CAAA,CAAE,WAAA;AAAY,SACpD,CAAA,EACH;AAAA,OAAA,EAEJ;AAAA,KAAA,EACF;AAAA,GAAA,EACF,CAAA;AAEJ;;;;"}

package/dist/components/scenarioDrawer/scenarioDrawer.module.css.esm.js

@@ -0,0 +1,8 @@
+import styleInject from '../../node_modules_dist/style-inject/dist/style-inject.es.esm.js';
+
+var css_248z = ".scenarioDrawer_section__cc79f985a5 {\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n  width: 100%;\n  padding: 16px;\n  position: relative;\n}\n\n.scenarioDrawer_riscSection__cc79f985a5 {\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n  gap: 16px;\n  width: 100%;\n  padding: 16px;\n  position: relative;\n  box-shadow: none !important;\n}\n\n.scenarioDrawer_headerSection__cc79f985a5 {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n  width: 100%;\n}\n\n.scenarioDrawer_selectSection__cc79f985a5 {\n  display: grid;\n  grid-template-columns: 1fr 1fr;\n  gap: 24px;\n  row-gap: 16px;\n}\n";
+var styles = {"section":"scenarioDrawer_section__cc79f985a5","riscSection":"scenarioDrawer_riscSection__cc79f985a5","headerSection":"scenarioDrawer_headerSection__cc79f985a5","selectSection":"scenarioDrawer_selectSection__cc79f985a5"};
+styleInject(css_248z);
+
+export { styles as default };
+//# sourceMappingURL=scenarioDrawer.module.css.esm.js.map

package/dist/components/scenarioDrawer/scenarioDrawer.module.css.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"scenarioDrawer.module.css.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}

package/dist/components/threatActorsAndVulnerabilities/CoverageRatio.esm.js

@@ -3,12 +3,13 @@ import { Flex, Text } from '@backstage/ui';
 import { useTranslationRef } from '@backstage/core-plugin-api/alpha';
 import { pluginRiScTranslationRef } from '../../utils/translations.esm.js';
 import { CoverageType } from '../../utils/threatActorsAndVulnerabilities.esm.js';
+import styles from './CoverageRatio.module.css.esm.js';
 
 function CoverageRatio(props) {
   const { t } = useTranslationRef(pluginRiScTranslationRef);
   const label = props.coverageType === CoverageType.Vulnerability ? t("threatActorsAndVulnerabilities.vulnerabilityCoverage") : t("threatActorsAndVulnerabilities.threatActorCoverage");
   return /* @__PURE__ */ jsxs(Flex, { align: "center", children: [
-    /* @__PURE__ */ jsxs(Text, { variant: "body-large", style: { width: "170px" }, children: [
+    /* @__PURE__ */ jsxs(Text, { variant: "body-large", className: styles.label, children: [
       label,
       ":"
     ] }),

package/dist/components/threatActorsAndVulnerabilities/CoverageRatio.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"CoverageRatio.esm.js","sources":["../../../src/components/threatActorsAndVulnerabilities/CoverageRatio.tsx"],"sourcesContent":["import { Flex, Text } from '@backstage/ui';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { pluginRiScTranslationRef } from '../../utils/translations.ts';\nimport { CoverageType } from '../../utils/threatActorsAndVulnerabilities.ts';\n\ntype CoverageRatioProps = {\n  covered: number;\n  total: number;\n  coverageType: CoverageType;\n};\n\nexport function CoverageRatio(props: CoverageRatioProps) {\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n\n  const label =\n    props.coverageType === CoverageType.Vulnerability\n      ? t('threatActorsAndVulnerabilities.vulnerabilityCoverage')\n      : t('threatActorsAndVulnerabilities.threatActorCoverage');\n\n  return (\n    <Flex align=\"center\">\n      <Text variant=\"body-large\" style={{ width: '170px' }}>\n        {label}:\n      </Text>\n      <Text variant=\"title-x-small\" weight=\"bold\">\n        {t('threatActorsAndVulnerabilities.coverageRatio', {\n          covered: props.covered.toString(),\n          total: props.total.toString(),\n        })}\n      </Text>\n    </Flex>\n  );\n}\n"],"names":[],"mappings":";;;;;;AAWO,SAAS,cAAc,KAAA,EAA2B;AACvD,EAAA,MAAM,EAAE,CAAA,EAAE,GAAI,iBAAA,CAAkB,wBAAwB,CAAA;AAExD,EAAA,MAAM,KAAA,GACJ,MAAM,YAAA,KAAiB,YAAA,CAAa,gBAChC,CAAA,CAAE,sDAAsD,CAAA,GACxD,CAAA,CAAE,oDAAoD,CAAA;AAE5D,EAAA,uBACE,IAAA,CAAC,IAAA,EAAA,EAAK,KAAA,EAAM,QAAA,EACV,QAAA,EAAA;AAAA,oBAAA,IAAA,CAAC,QAAK,OAAA,EAAQ,YAAA,EAAa,OAAO,EAAE,KAAA,EAAO,SAAQ,EAChD,QAAA,EAAA;AAAA,MAAA,KAAA;AAAA,MAAM;AAAA,KAAA,EACT,CAAA;AAAA,wBACC,IAAA,EAAA,EAAK,OAAA,EAAQ,iBAAgB,MAAA,EAAO,MAAA,EAClC,YAAE,8CAAA,EAAgD;AAAA,MACjD,OAAA,EAAS,KAAA,CAAM,OAAA,CAAQ,QAAA,EAAS;AAAA,MAChC,KAAA,EAAO,KAAA,CAAM,KAAA,CAAM,QAAA;AAAS,KAC7B,CAAA,EACH;AAAA,GAAA,EACF,CAAA;AAEJ;;;;"}
+{"version":3,"file":"CoverageRatio.esm.js","sources":["../../../src/components/threatActorsAndVulnerabilities/CoverageRatio.tsx"],"sourcesContent":["import { Flex, Text } from '@backstage/ui';\nimport { useTranslationRef } from '@backstage/core-plugin-api/alpha';\nimport { pluginRiScTranslationRef } from '../../utils/translations.ts';\nimport { CoverageType } from '../../utils/threatActorsAndVulnerabilities.ts';\nimport styles from './CoverageRatio.module.css';\n\ntype CoverageRatioProps = {\n  covered: number;\n  total: number;\n  coverageType: CoverageType;\n};\n\nexport function CoverageRatio(props: CoverageRatioProps) {\n  const { t } = useTranslationRef(pluginRiScTranslationRef);\n\n  const label =\n    props.coverageType === CoverageType.Vulnerability\n      ? t('threatActorsAndVulnerabilities.vulnerabilityCoverage')\n      : t('threatActorsAndVulnerabilities.threatActorCoverage');\n\n  return (\n    <Flex align=\"center\">\n      <Text variant=\"body-large\" className={styles.label}>\n        {label}:\n      </Text>\n      <Text variant=\"title-x-small\" weight=\"bold\">\n        {t('threatActorsAndVulnerabilities.coverageRatio', {\n          covered: props.covered.toString(),\n          total: props.total.toString(),\n        })}\n      </Text>\n    </Flex>\n  );\n}\n"],"names":[],"mappings":";;;;;;;AAYO,SAAS,cAAc,KAAA,EAA2B;AACvD,EAAA,MAAM,EAAE,CAAA,EAAE,GAAI,iBAAA,CAAkB,wBAAwB,CAAA;AAExD,EAAA,MAAM,KAAA,GACJ,MAAM,YAAA,KAAiB,YAAA,CAAa,gBAChC,CAAA,CAAE,sDAAsD,CAAA,GACxD,CAAA,CAAE,oDAAoD,CAAA;AAE5D,EAAA,uBACE,IAAA,CAAC,IAAA,EAAA,EAAK,KAAA,EAAM,QAAA,EACV,QAAA,EAAA;AAAA,oBAAA,IAAA,CAAC,IAAA,EAAA,EAAK,OAAA,EAAQ,YAAA,EAAa,SAAA,EAAW,OAAO,KAAA,EAC1C,QAAA,EAAA;AAAA,MAAA,KAAA;AAAA,MAAM;AAAA,KAAA,EACT,CAAA;AAAA,wBACC,IAAA,EAAA,EAAK,OAAA,EAAQ,iBAAgB,MAAA,EAAO,MAAA,EAClC,YAAE,8CAAA,EAAgD;AAAA,MACjD,OAAA,EAAS,KAAA,CAAM,OAAA,CAAQ,QAAA,EAAS;AAAA,MAChC,KAAA,EAAO,KAAA,CAAM,KAAA,CAAM,QAAA;AAAS,KAC7B,CAAA,EACH;AAAA,GAAA,EACF,CAAA;AAEJ;;;;"}

package/dist/components/threatActorsAndVulnerabilities/CoverageRatio.module.css.esm.js

@@ -0,0 +1,8 @@
+import styleInject from '../../node_modules_dist/style-inject/dist/style-inject.es.esm.js';
+
+var css_248z = ".CoverageRatio_label__158cbb4ee8 {\n  width: 170px;\n}\n";
+var styles = {"label":"CoverageRatio_label__158cbb4ee8"};
+styleInject(css_248z);
+
+export { styles as default };
+//# sourceMappingURL=CoverageRatio.module.css.esm.js.map

package/dist/components/threatActorsAndVulnerabilities/CoverageRatio.module.css.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CoverageRatio.module.css.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kartverket/backstage-plugin-risk-scorecard",
-  "version": "6.1.4",
+  "version": "6.1.6",
   "main": "dist/index.esm.js",
   "types": "dist/index.d.ts",
   "license": "MIT",

package/dist/components/scenarioDrawer/scenarioDrawerComponents.esm.js

@@ -1,33 +0,0 @@
-const section = {
-  display: "flex",
-  flexDirection: "column",
-  gap: "16px",
-  width: "100%",
-  padding: 2,
-  position: "relative"
-};
-const riscSection = {
-  display: "flex",
-  flexDirection: "column",
-  justifyContent: "space-between",
-  gap: "16px",
-  width: "100%",
-  padding: 2,
-  position: "relative",
-  boxShadow: "none"
-};
-const headerSection = {
-  display: "flex",
-  flexDirection: "column",
-  gap: "4px",
-  width: "100%"
-};
-const selectSection = {
-  display: "grid",
-  gridTemplateColumns: "1fr 1fr",
-  gap: "24px",
-  rowGap: "16px"
-};
-
-export { headerSection, riscSection, section, selectSection };
-//# sourceMappingURL=scenarioDrawerComponents.esm.js.map

package/dist/components/scenarioDrawer/scenarioDrawerComponents.esm.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"scenarioDrawerComponents.esm.js","sources":["../../../src/components/scenarioDrawer/scenarioDrawerComponents.ts"],"sourcesContent":["import { SxProps, Theme } from '@mui/material/styles';\n\nexport const section: SxProps<Theme> = {\n  display: 'flex',\n  flexDirection: 'column',\n  gap: '16px',\n  width: '100%',\n  padding: 2,\n  position: 'relative',\n};\n\nexport const riscSection: SxProps<Theme> = {\n  display: 'flex',\n  flexDirection: 'column',\n  justifyContent: 'space-between',\n  gap: '16px',\n  width: '100%',\n  padding: 2,\n  position: 'relative',\n  boxShadow: 'none',\n};\n\nexport const headerSection: SxProps<Theme> = {\n  display: 'flex',\n  flexDirection: 'column',\n  gap: '4px',\n  width: '100%',\n};\n\nexport const selectSection: SxProps<Theme> = {\n  display: 'grid',\n  gridTemplateColumns: '1fr 1fr',\n  gap: '24px',\n  rowGap: '16px',\n};\n"],"names":[],"mappings":"AAEO,MAAM,OAAA,GAA0B;AAAA,EACrC,OAAA,EAAS,MAAA;AAAA,EACT,aAAA,EAAe,QAAA;AAAA,EACf,GAAA,EAAK,MAAA;AAAA,EACL,KAAA,EAAO,MAAA;AAAA,EACP,OAAA,EAAS,CAAA;AAAA,EACT,QAAA,EAAU;AACZ;AAEO,MAAM,WAAA,GAA8B;AAAA,EACzC,OAAA,EAAS,MAAA;AAAA,EACT,aAAA,EAAe,QAAA;AAAA,EACf,cAAA,EAAgB,eAAA;AAAA,EAChB,GAAA,EAAK,MAAA;AAAA,EACL,KAAA,EAAO,MAAA;AAAA,EACP,OAAA,EAAS,CAAA;AAAA,EACT,QAAA,EAAU,UAAA;AAAA,EACV,SAAA,EAAW;AACb;AAEO,MAAM,aAAA,GAAgC;AAAA,EAC3C,OAAA,EAAS,MAAA;AAAA,EACT,aAAA,EAAe,QAAA;AAAA,EACf,GAAA,EAAK,KAAA;AAAA,EACL,KAAA,EAAO;AACT;AAEO,MAAM,aAAA,GAAgC;AAAA,EAC3C,OAAA,EAAS,MAAA;AAAA,EACT,mBAAA,EAAqB,SAAA;AAAA,EACrB,GAAA,EAAK,MAAA;AAAA,EACL,MAAA,EAAQ;AACV;;;;"}