@backstage/plugin-scaffolder 1.19.0-next.2 → 1.19.1

package/dist/esm/{index-81d5d395.esm.js → index-CSOk13rN.esm.js}

@@ -1,23 +1,43 @@
 import React, { useState, Fragment, useCallback, createContext, useRef, useMemo, useContext, useEffect, Component, Children, memo } from 'react';
 import { useNavigate, Link as Link$1, Navigate, useOutlet, Routes, Route } from 'react-router-dom';
 import { useTemplateSecrets, scaffolderApiRef, useCustomFieldExtensions, useCustomLayouts, SecretsContextProvider } from '@backstage/plugin-scaffolder-react';
-import { E as EntityPicker, a as EntityPickerSchema, b as EntityNamePicker, e as entityNamePickerValidation, c as EntityNamePickerSchema, l as EntityTagsPicker, m as EntityTagsPickerSchema, R as RepoUrlPicker, r as repoPickerValidation, f as RepoUrlPickerSchema, O as OwnerPicker, g as OwnerPickerSchema, j as OwnedEntityPicker, k as OwnedEntityPickerSchema, h as MyGroupsPicker, i as MyGroupsPickerSchema, M as MultiEntityPicker, d as MultiEntityPickerSchema, v as validateMultiEntityPickerValidation, n as OngoingTask } from './OngoingTask-5a95edc0.esm.js';
+import { E as EntityPicker, a as EntityPickerSchema, b as EntityNamePicker, e as entityNamePickerValidation, c as EntityNamePickerSchema, l as EntityTagsPicker, m as EntityTagsPickerSchema, R as RepoUrlPicker, r as repoPickerValidation, f as RepoUrlPickerSchema, O as OwnerPicker, g as OwnerPickerSchema, j as OwnedEntityPicker, k as OwnedEntityPickerSchema, h as MyGroupsPicker, i as MyGroupsPickerSchema, M as MultiEntityPicker, d as MultiEntityPickerSchema, v as validateMultiEntityPickerValidation, n as OngoingTask } from './OngoingTask-BeP2EzG8.esm.js';
 import { ScaffolderField, ScaffolderPageContextMenu, TemplateCategoryPicker, TemplateGroups, Workflow, createAsyncValidators, Stepper, Form } from '@backstage/plugin-scaffolder-react/alpha';
-import { InputLabel, Input, makeStyles, Box, Typography, Accordion, AccordionSummary, AccordionDetails, Grid, TableContainer, Paper, Table, TableHead, TableRow, TableCell, TableBody, Collapse, Card, List, MenuItem, ListItemIcon, ListItemText, FormControl, Select, IconButton as IconButton$1, CardHeader, CardContent, Button as Button$1, Tooltip, Divider, createStyles, StepButton, CircularProgress, LinearProgress } from '@material-ui/core';
-import { e as editRouteRef, c as scaffolderListTaskRouteRef, r as rootRouteRef, b as actionsRouteRef, d as registerComponentRouteRef, v as viewTechDocRouteRef, s as selectedTemplateRouteRef, a as scaffolderTaskRouteRef } from './routes-1428737e.esm.js';
+import Input from '@material-ui/core/Input';
+import InputLabel from '@material-ui/core/InputLabel';
+import { e as editRouteRef, c as scaffolderListTaskRouteRef, r as rootRouteRef, b as actionsRouteRef, d as registerComponentRouteRef, v as viewTechDocRouteRef, s as selectedTemplateRouteRef, a as scaffolderTaskRouteRef } from './routes-BvToNy4N.esm.js';
 import { Progress, ErrorPage, MarkdownContent, Page, Header, Content, CodeSnippet, StatusError, StatusOK, StatusPending, ErrorPanel, EmptyState, Table as Table$1, Link, DocsIcon, ContentHeader, SupportButton, LogViewer } from '@backstage/core-components';
-import useAsync from 'react-use/lib/useAsync';
+import useAsync from 'react-use/esm/useAsync';
+import Accordion from '@material-ui/core/Accordion';
+import AccordionDetails from '@material-ui/core/AccordionDetails';
+import AccordionSummary from '@material-ui/core/AccordionSummary';
+import Box from '@material-ui/core/Box';
+import Collapse from '@material-ui/core/Collapse';
+import Grid from '@material-ui/core/Grid';
+import Paper from '@material-ui/core/Paper';
+import Table from '@material-ui/core/Table';
+import TableBody from '@material-ui/core/TableBody';
+import TableCell from '@material-ui/core/TableCell';
+import TableContainer from '@material-ui/core/TableContainer';
+import TableHead from '@material-ui/core/TableHead';
+import TableRow from '@material-ui/core/TableRow';
+import Typography from '@material-ui/core/Typography';
+import { makeStyles, createStyles } from '@material-ui/core/styles';
 import classNames from 'classnames';
 import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
 import ExpandLessIcon from '@material-ui/icons/ExpandLess';
 import { useApi, useRouteRef, useApp, useRouteRefParams, AnalyticsContext, useApiHolder, alertApiRef } from '@backstage/core-plugin-api';
 import Chip from '@material-ui/core/Chip';
 import { catalogApiRef, EntityRefLink, CatalogFilterLayout, EntityListProvider, EntitySearchBar, EntityKindPicker, UserListPicker, EntityTagPicker, entityRouteRef, humanizeEntityRef } from '@backstage/plugin-catalog-react';
+import Card from '@material-ui/core/Card';
+import List from '@material-ui/core/List';
+import ListItemIcon from '@material-ui/core/ListItemIcon';
+import ListItemText from '@material-ui/core/ListItemText';
+import MenuItem from '@material-ui/core/MenuItem';
 import SettingsIcon from '@material-ui/icons/Settings';
 import AllIcon from '@material-ui/icons/FontDownload';
 import { DateTime, Interval } from 'luxon';
 import humanizeDuration from 'humanize-duration';
-import Typography$1 from '@material-ui/core/Typography';
 import { parseEntityRef, stringifyEntityRef, ANNOTATION_EDIT_URL } from '@backstage/catalog-model';
 import Button from '@material-ui/core/Button';
 import IconButton from '@material-ui/core/IconButton';
@@ -25,63 +45,56 @@ import useMediaQuery from '@material-ui/core/useMediaQuery';
 import CreateComponentIcon from '@material-ui/icons/AddCircleOutline';
 import { catalogEntityCreatePermission } from '@backstage/plugin-catalog-common/alpha';
 import { usePermission } from '@backstage/plugin-permission-react';
-import ListItemIcon$1 from '@material-ui/core/ListItemIcon';
-import ListItemText$1 from '@material-ui/core/ListItemText';
-import MenuItem$1 from '@material-ui/core/MenuItem';
 import MenuList from '@material-ui/core/MenuList';
 import Popover from '@material-ui/core/Popover';
-import { makeStyles as makeStyles$1 } from '@material-ui/core/styles';
 import Edit from '@material-ui/icons/Edit';
 import MoreVert from '@material-ui/icons/MoreVert';
 import { StreamLanguage } from '@codemirror/language';
 import { yaml as yaml$1 } from '@codemirror/legacy-modes/mode/yaml';
+import CardContent from '@material-ui/core/CardContent';
+import CardHeader from '@material-ui/core/CardHeader';
+import FormControl from '@material-ui/core/FormControl';
+import Select from '@material-ui/core/Select';
 import CloseIcon from '@material-ui/icons/Close';
 import CodeMirror from '@uiw/react-codemirror';
 import yaml from 'yaml';
-import useDebounce from 'react-use/lib/useDebounce';
+import useDebounce from 'react-use/esm/useDebounce';
 import { useAsync as useAsync$1, useRerender, useKeyboardEvent, usePrevious } from '@react-hookz/web';
 import validator from '@rjsf/validator-ajv8';
+import Divider from '@material-ui/core/Divider';
+import Tooltip from '@material-ui/core/Tooltip';
 import RefreshIcon from '@material-ui/icons/Refresh';
 import SaveIcon from '@material-ui/icons/Save';
 import TreeView from '@material-ui/lab/TreeView';
 import ChevronRightIcon from '@material-ui/icons/ChevronRight';
 import TreeItem from '@material-ui/lab/TreeItem';
 import { showPanel } from '@codemirror/view';
-import Accordion$1 from '@material-ui/core/Accordion';
-import AccordionDetails$1 from '@material-ui/core/AccordionDetails';
-import AccordionSummary$1 from '@material-ui/core/AccordionSummary';
-import Divider$1 from '@material-ui/core/Divider';
-import List$1 from '@material-ui/core/List';
 import ListItem from '@material-ui/core/ListItem';
 import ListItemSecondaryAction from '@material-ui/core/ListItemSecondaryAction';
 import Cancel from '@material-ui/icons/Cancel';
 import CheckIcon from '@material-ui/icons/Check';
 import DeleteIcon from '@material-ui/icons/Delete';
 import DownloadIcon from '@material-ui/icons/GetApp';
-import Box$1 from '@material-ui/core/Box';
 import Tab from '@material-ui/core/Tab';
 import Tabs from '@material-ui/core/Tabs';
 import LanguageIcon from '@material-ui/icons/Language';
 import Step from '@material-ui/core/Step';
 import StepLabel from '@material-ui/core/StepLabel';
 import Stepper$1 from '@material-ui/core/Stepper';
+import StepButton from '@material-ui/core/StepButton';
+import CircularProgress from '@material-ui/core/CircularProgress';
 import FiberManualRecordIcon from '@material-ui/icons/FiberManualRecord';
-import useInterval from 'react-use/lib/useInterval';
-import Card$1 from '@material-ui/core/Card';
+import useInterval from 'react-use/esm/useInterval';
+import LinearProgress from '@material-ui/core/LinearProgress';
 import CardActionArea from '@material-ui/core/CardActionArea';
-import CardContent$1 from '@material-ui/core/CardContent';
-import Tooltip$1 from '@material-ui/core/Tooltip';
 import InfoOutlinedIcon from '@material-ui/icons/InfoOutlined';
+import '@material-ui/core/TextField';
 import 'zod';
 import '@backstage/catalog-client';
-import '@material-ui/core/FormControl';
 import '@material-ui/lab/Autocomplete';
 import '@backstage/integration-react';
 import '@material-ui/core/FormHelperText';
-import '@material-ui/core/Input';
-import '@material-ui/core/InputLabel';
-import 'react-use/lib/useEffectOnce';
-import '@material-ui/lab';
+import 'react-use/esm/useEffectOnce';
 import 'zod-to-json-schema';
 import '@backstage/errors';
 import 'qs';
@@ -415,7 +428,7 @@ const OwnerListPicker = (props) => {
 const CreatedAtColumn = ({ createdAt }) => {
   const createdAtTime = DateTime.fromISO(createdAt);
   const formatted = Interval.fromDateTimes(createdAtTime, DateTime.local()).toDuration().valueOf();
-  return /* @__PURE__ */ React.createElement(Typography$1, { paragraph: true }, humanizeDuration(formatted, { round: true }), " ago");
+  return /* @__PURE__ */ React.createElement(Typography, { paragraph: true }, humanizeDuration(formatted, { round: true }), " ago");
 };
 
 const OwnerEntityColumn = ({ entityRef }) => {
@@ -426,7 +439,7 @@ const OwnerEntityColumn = ({ entityRef }) => {
     [catalogApi, entityRef]
   );
   if (!entityRef) {
-    return /* @__PURE__ */ React.createElement(Typography$1, { paragraph: true }, "Unknown");
+    return /* @__PURE__ */ React.createElement(Typography, { paragraph: true }, "Unknown");
   }
   if (loading || error) {
     return null;
@@ -679,7 +692,7 @@ const TemplateListPage = (props) => {
   ))))));
 };
 
-const useStyles$e = makeStyles$1((theme) => ({
+const useStyles$e = makeStyles((theme) => ({
   button: {
     color: theme.page.fontColor
   }
@@ -722,7 +735,7 @@ function TemplateWizardPageContextMenu(props) {
       anchorOrigin: { vertical: "bottom", horizontal: "right" },
       transformOrigin: { vertical: "top", horizontal: "right" }
     },
-    /* @__PURE__ */ React.createElement(MenuList, null, /* @__PURE__ */ React.createElement(MenuItem$1, { onClick: () => window.open(editUrl, "_blank") }, /* @__PURE__ */ React.createElement(ListItemIcon$1, null, /* @__PURE__ */ React.createElement(Edit, { fontSize: "small" })), /* @__PURE__ */ React.createElement(ListItemText$1, { primary: "Edit Configuration" })))
+    /* @__PURE__ */ React.createElement(MenuList, null, /* @__PURE__ */ React.createElement(MenuItem, { onClick: () => window.open(editUrl, "_blank") }, /* @__PURE__ */ React.createElement(ListItemIcon, null, /* @__PURE__ */ React.createElement(Edit, { fontSize: "small" })), /* @__PURE__ */ React.createElement(ListItemText, { primary: "Edit Configuration" })))
   ));
 }
 
@@ -1122,7 +1135,7 @@ var __publicField = (obj, key, value) => {
   __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
   return value;
 };
-const useStyles$d = makeStyles$1({
+const useStyles$d = makeStyles({
   containerWrapper: {
     position: "relative",
     width: "100%",
@@ -1362,7 +1375,7 @@ const CustomFieldExplorer = ({
       onChange: (e) => handleSelectionChange(e.target.value)
     },
     fieldOptions.map((option, idx) => /* @__PURE__ */ React.createElement(MenuItem, { key: idx, value: option }, option.name))
-  )), /* @__PURE__ */ React.createElement(IconButton$1, { size: "medium", onClick: onClose, "aria-label": "Close" }, /* @__PURE__ */ React.createElement(CloseIcon, null))), /* @__PURE__ */ React.createElement("div", { className: classes.fieldForm }, /* @__PURE__ */ React.createElement(Card, null, /* @__PURE__ */ React.createElement(CardHeader, { title: "Field Options" }), /* @__PURE__ */ React.createElement(CardContent, null, /* @__PURE__ */ React.createElement(
+  )), /* @__PURE__ */ React.createElement(IconButton, { size: "medium", onClick: onClose, "aria-label": "Close" }, /* @__PURE__ */ React.createElement(CloseIcon, null))), /* @__PURE__ */ React.createElement("div", { className: classes.fieldForm }, /* @__PURE__ */ React.createElement(Card, null, /* @__PURE__ */ React.createElement(CardHeader, { title: "Field Options" }), /* @__PURE__ */ React.createElement(CardContent, null, /* @__PURE__ */ React.createElement(
     Form,
     {
       showErrorList: false,
@@ -1378,7 +1391,7 @@ const CustomFieldExplorer = ({
       }
     },
     /* @__PURE__ */ React.createElement(
-      Button$1,
+      Button,
       {
         variant: "contained",
         color: "primary",
@@ -1408,7 +1421,7 @@ const CustomFieldExplorer = ({
   )));
 };
 
-const useStyles$b = makeStyles$1({
+const useStyles$b = makeStyles({
   root: {
     whiteSpace: "nowrap",
     overflowY: "auto"
@@ -1526,7 +1539,7 @@ function TemplateEditorBrowser(props) {
     props.onClose();
   };
   return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("div", { className: classes.buttons }, /* @__PURE__ */ React.createElement(Tooltip, { title: "Save all files" }, /* @__PURE__ */ React.createElement(
-    IconButton$1,
+    IconButton,
     {
       className: classes.button,
       disabled: directoryEditor.files.every((file) => !file.dirty),
@@ -1534,13 +1547,13 @@ function TemplateEditorBrowser(props) {
     },
     /* @__PURE__ */ React.createElement(SaveIcon, null)
   )), /* @__PURE__ */ React.createElement(Tooltip, { title: "Reload directory" }, /* @__PURE__ */ React.createElement(
-    IconButton$1,
+    IconButton,
     {
       className: classes.button,
       onClick: () => directoryEditor.reload()
     },
     /* @__PURE__ */ React.createElement(RefreshIcon, null)
-  )), /* @__PURE__ */ React.createElement("div", { className: classes.buttonsGap }), /* @__PURE__ */ React.createElement(Tooltip, { title: "Close directory" }, /* @__PURE__ */ React.createElement(IconButton$1, { className: classes.button, onClick: handleClose }, /* @__PURE__ */ React.createElement(CloseIcon, null)))), /* @__PURE__ */ React.createElement(Divider, { className: classes.buttonsDivider }), /* @__PURE__ */ React.createElement(
+  )), /* @__PURE__ */ React.createElement("div", { className: classes.buttonsGap }), /* @__PURE__ */ React.createElement(Tooltip, { title: "Close directory" }, /* @__PURE__ */ React.createElement(IconButton, { className: classes.button, onClick: handleClose }, /* @__PURE__ */ React.createElement(CloseIcon, null)))), /* @__PURE__ */ React.createElement(Divider, { className: classes.buttonsDivider }), /* @__PURE__ */ React.createElement(
     FileBrowser,
     {
       selected: (_b = (_a = directoryEditor.selectedFile) == null ? void 0 : _a.path) != null ? _b : "",
@@ -1609,7 +1622,7 @@ function TemplateEditorTextArea(props) {
       onChange: props.onUpdate
     }
   ), (props.onSave || props.onReload) && /* @__PURE__ */ React.createElement("div", { className: classes.floatingButtons }, /* @__PURE__ */ React.createElement(Paper, null, props.onSave && /* @__PURE__ */ React.createElement(Tooltip, { title: "Save file" }, /* @__PURE__ */ React.createElement(
-    IconButton$1,
+    IconButton,
     {
       className: classes.floatingButton,
       onClick: () => {
@@ -1619,7 +1632,7 @@ function TemplateEditorTextArea(props) {
     },
     /* @__PURE__ */ React.createElement(SaveIcon, null)
   )), props.onReload && /* @__PURE__ */ React.createElement(Tooltip, { title: "Reload file" }, /* @__PURE__ */ React.createElement(
-    IconButton$1,
+    IconButton,
     {
       className: classes.floatingButton,
       onClick: () => {
@@ -1663,7 +1676,7 @@ function downloadBlob(blob, name) {
   a.remove();
 }
 
-const useStyles$8 = makeStyles$1((theme) => ({
+const useStyles$8 = makeStyles((theme) => ({
   root: {
     overflowY: "auto",
     background: theme.palette.background.default
@@ -1682,7 +1695,7 @@ const useStyles$8 = makeStyles$1((theme) => ({
 function DryRunResultsList() {
   const classes = useStyles$8();
   const dryRun = useDryRun();
-  return /* @__PURE__ */ React.createElement(List$1, { className: classes.root, dense: true }, dryRun.results.map((result) => {
+  return /* @__PURE__ */ React.createElement(List, { className: classes.root, dense: true }, dryRun.results.map((result) => {
     var _a;
     const failed = result.log.some((l) => l.body.status === "failed");
     let isLoading = false;
@@ -1703,13 +1716,13 @@ function DryRunResultsList() {
         onClick: () => dryRun.selectResult(result.id)
       },
       /* @__PURE__ */ React.createElement(
-        ListItemIcon$1,
+        ListItemIcon,
         {
           className: failed ? classes.iconFailure : classes.iconSuccess
         },
         failed ? /* @__PURE__ */ React.createElement(Cancel, null) : /* @__PURE__ */ React.createElement(CheckIcon, null)
       ),
-      /* @__PURE__ */ React.createElement(ListItemText$1, { primary: `Result ${result.id}` }),
+      /* @__PURE__ */ React.createElement(ListItemText, { primary: `Result ${result.id}` }),
       /* @__PURE__ */ React.createElement(ListItemSecondaryAction, null, /* @__PURE__ */ React.createElement(
         IconButton,
         {
@@ -1744,7 +1757,7 @@ async function downloadDirectoryContents(directoryContents, name) {
   downloadBlob(blob, name);
 }
 
-const useStyles$7 = makeStyles$1((theme) => ({
+const useStyles$7 = makeStyles((theme) => ({
   root: {
     display: "grid",
     gridTemplateColumns: "280px auto 3fr",
@@ -1765,7 +1778,7 @@ function DryRunResultsSplitView(props) {
   if (childArray.length !== 2) {
     throw new Error("must have exactly 2 children");
   }
-  return /* @__PURE__ */ React.createElement("div", { className: classes.root }, /* @__PURE__ */ React.createElement("div", { className: classNames(classes.child, classes.firstChild) }, childArray[0]), /* @__PURE__ */ React.createElement(Divider$1, { orientation: "horizontal" }), /* @__PURE__ */ React.createElement("div", { className: classes.child }, childArray[1]));
+  return /* @__PURE__ */ React.createElement("div", { className: classes.root }, /* @__PURE__ */ React.createElement("div", { className: classNames(classes.child, classes.firstChild) }, childArray[0]), /* @__PURE__ */ React.createElement(Divider, { orientation: "horizontal" }), /* @__PURE__ */ React.createElement("div", { className: classes.child }, childArray[1]));
 }
 
 const useStyles$6 = makeStyles({
@@ -1868,7 +1881,7 @@ const StepTimeTicker = ({ step }) => {
     const formatted = Interval.fromDateTimes(startedAt, end).toDuration().valueOf();
     setTime(humanizeDuration(formatted, { round: true }));
   }, 1e3);
-  return /* @__PURE__ */ React.createElement(Typography$1, { variant: "caption" }, time);
+  return /* @__PURE__ */ React.createElement(Typography, { variant: "caption" }, time);
 };
 function TaskStepIconComponent(props) {
   const classes = useStepIconStyles();
@@ -1924,14 +1937,14 @@ const TaskStatusStepper = memo(
             StepIconComponent: TaskStepIconComponent,
             className: classes.stepWrapper
           },
-          /* @__PURE__ */ React.createElement("div", { className: classes.labelWrapper }, /* @__PURE__ */ React.createElement(Typography$1, { variant: "subtitle2" }, step.name), isSkipped ? /* @__PURE__ */ React.createElement(Typography$1, { variant: "caption" }, "Skipped") : /* @__PURE__ */ React.createElement(StepTimeTicker, { step }))
+          /* @__PURE__ */ React.createElement("div", { className: classes.labelWrapper }, /* @__PURE__ */ React.createElement(Typography, { variant: "subtitle2" }, step.name), isSkipped ? /* @__PURE__ */ React.createElement(Typography, { variant: "caption" }, "Skipped") : /* @__PURE__ */ React.createElement(StepTimeTicker, { step }))
         )));
       })
     ));
   }
 );
 
-const useStyles$4 = makeStyles$1({
+const useStyles$4 = makeStyles({
   root: {
     display: "flex",
     flexFlow: "column nowrap"
@@ -2038,7 +2051,7 @@ function OutputContent() {
   if (!selectedResult) {
     return null;
   }
-  return /* @__PURE__ */ React.createElement(DryRunResultsSplitView, null, /* @__PURE__ */ React.createElement(Box$1, { pt: 2 }, ((_b = (_a = selectedResult.output) == null ? void 0 : _a.links) == null ? void 0 : _b.length) && /* @__PURE__ */ React.createElement(TaskPageLinks, { output: selectedResult.output })), /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ React.createElement(DryRunResultsSplitView, null, /* @__PURE__ */ React.createElement(Box, { pt: 2 }, ((_b = (_a = selectedResult.output) == null ? void 0 : _a.links) == null ? void 0 : _b.length) && /* @__PURE__ */ React.createElement(TaskPageLinks, { output: selectedResult.output })), /* @__PURE__ */ React.createElement(
     CodeMirror,
     {
       className: classes.codeMirror,
@@ -2055,10 +2068,10 @@ function DryRunResultsView() {
   const [selectedTab, setSelectedTab] = useState(
     "files"
   );
-  return /* @__PURE__ */ React.createElement("div", { className: classes.root }, /* @__PURE__ */ React.createElement(Tabs, { value: selectedTab, onChange: (_, v) => setSelectedTab(v) }, /* @__PURE__ */ React.createElement(Tab, { value: "files", label: "Files" }), /* @__PURE__ */ React.createElement(Tab, { value: "log", label: "Log" }), /* @__PURE__ */ React.createElement(Tab, { value: "output", label: "Output" })), /* @__PURE__ */ React.createElement(Divider$1, null), /* @__PURE__ */ React.createElement("div", { className: classes.contentWrapper }, /* @__PURE__ */ React.createElement("div", { className: classes.content }, selectedTab === "files" && /* @__PURE__ */ React.createElement(FilesContent, null), selectedTab === "log" && /* @__PURE__ */ React.createElement(LogContent, null), selectedTab === "output" && /* @__PURE__ */ React.createElement(OutputContent, null))));
+  return /* @__PURE__ */ React.createElement("div", { className: classes.root }, /* @__PURE__ */ React.createElement(Tabs, { value: selectedTab, onChange: (_, v) => setSelectedTab(v) }, /* @__PURE__ */ React.createElement(Tab, { value: "files", label: "Files" }), /* @__PURE__ */ React.createElement(Tab, { value: "log", label: "Log" }), /* @__PURE__ */ React.createElement(Tab, { value: "output", label: "Output" })), /* @__PURE__ */ React.createElement(Divider, null), /* @__PURE__ */ React.createElement("div", { className: classes.contentWrapper }, /* @__PURE__ */ React.createElement("div", { className: classes.content }, selectedTab === "files" && /* @__PURE__ */ React.createElement(FilesContent, null), selectedTab === "log" && /* @__PURE__ */ React.createElement(LogContent, null), selectedTab === "output" && /* @__PURE__ */ React.createElement(OutputContent, null))));
 }
 
-const useStyles$3 = makeStyles$1((theme) => ({
+const useStyles$3 = makeStyles((theme) => ({
   header: {
     height: 48,
     minHeight: 0,
@@ -2092,7 +2105,7 @@ function DryRunResults() {
     }
   }, [prevResultsLength, resultsLength]);
   return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
-    Accordion$1,
+    Accordion,
     {
       variant: "outlined",
       expanded,
@@ -2101,15 +2114,15 @@ function DryRunResults() {
       onTransitionEnd: () => resultsLength === 0 && setHidden(true)
     },
     /* @__PURE__ */ React.createElement(
-      AccordionSummary$1,
+      AccordionSummary,
       {
         className: classes.header,
         expandIcon: /* @__PURE__ */ React.createElement(ExpandLessIcon, null)
       },
-      /* @__PURE__ */ React.createElement(Typography$1, null, "Dry-run results")
+      /* @__PURE__ */ React.createElement(Typography, null, "Dry-run results")
     ),
-    /* @__PURE__ */ React.createElement(Divider$1, { orientation: "horizontal" }),
-    /* @__PURE__ */ React.createElement(AccordionDetails$1, { className: classes.content }, /* @__PURE__ */ React.createElement(DryRunResultsList, null), /* @__PURE__ */ React.createElement(Divider$1, { orientation: "horizontal" }), /* @__PURE__ */ React.createElement(DryRunResultsView, null))
+    /* @__PURE__ */ React.createElement(Divider, { orientation: "horizontal" }),
+    /* @__PURE__ */ React.createElement(AccordionDetails, { className: classes.content }, /* @__PURE__ */ React.createElement(DryRunResultsList, null), /* @__PURE__ */ React.createElement(Divider, { orientation: "horizontal" }), /* @__PURE__ */ React.createElement(DryRunResultsView, null))
   ));
 }
 
@@ -2277,7 +2290,7 @@ const TemplateFormPreviewer = ({
       onChange: (e) => handleSelectChange(e.target.value)
     },
     templateOptions.map((option, idx) => /* @__PURE__ */ React.createElement(MenuItem, { key: idx, value: option.value }, option.label))
-  )), /* @__PURE__ */ React.createElement(IconButton$1, { size: "medium", onClick: onClose }, /* @__PURE__ */ React.createElement(CloseIcon, null))), /* @__PURE__ */ React.createElement("div", { className: classes.textArea }, /* @__PURE__ */ React.createElement(
+  )), /* @__PURE__ */ React.createElement(IconButton, { size: "medium", onClick: onClose }, /* @__PURE__ */ React.createElement(CloseIcon, null))), /* @__PURE__ */ React.createElement("div", { className: classes.textArea }, /* @__PURE__ */ React.createElement(
     TemplateEditorTextArea,
     {
       content: templateYaml,
@@ -2296,7 +2309,7 @@ const TemplateFormPreviewer = ({
   ))));
 };
 
-const useStyles = makeStyles$1((theme) => ({
+const useStyles = makeStyles((theme) => ({
   introText: {
     textAlign: "center",
     marginTop: theme.spacing(2)
@@ -2316,7 +2329,7 @@ const useStyles = makeStyles$1((theme) => ({
 function TemplateEditorIntro(props) {
   const classes = useStyles();
   const supportsLoad = WebFileSystemAccess.isSupported();
-  const cardLoadLocal = /* @__PURE__ */ React.createElement(Card$1, { className: classes.card, elevation: 4 }, /* @__PURE__ */ React.createElement(
+  const cardLoadLocal = /* @__PURE__ */ React.createElement(Card, { className: classes.card, elevation: 4 }, /* @__PURE__ */ React.createElement(
     CardActionArea,
     {
       disabled: !supportsLoad,
@@ -2325,8 +2338,8 @@ function TemplateEditorIntro(props) {
         return (_a = props.onSelect) == null ? void 0 : _a.call(props, "local");
       }
     },
-    /* @__PURE__ */ React.createElement(CardContent$1, null, /* @__PURE__ */ React.createElement(
-      Typography$1,
+    /* @__PURE__ */ React.createElement(CardContent, null, /* @__PURE__ */ React.createElement(
+      Typography,
       {
         variant: "h4",
         component: "h3",
@@ -2336,7 +2349,7 @@ function TemplateEditorIntro(props) {
       },
       "Load Template Directory"
     ), /* @__PURE__ */ React.createElement(
-      Typography$1,
+      Typography,
       {
         variant: "body1",
         color: supportsLoad ? void 0 : "textSecondary"
@@ -2344,22 +2357,22 @@ function TemplateEditorIntro(props) {
       "Load a local template directory, allowing you to both edit and try executing your own template."
     ))
   ), !supportsLoad && /* @__PURE__ */ React.createElement("div", { className: classes.infoIcon }, /* @__PURE__ */ React.createElement(
-    Tooltip$1,
+    Tooltip,
     {
       placement: "top",
       title: "Only supported in some Chromium-based browsers"
     },
     /* @__PURE__ */ React.createElement(InfoOutlinedIcon, null)
   )));
-  const cardFormEditor = /* @__PURE__ */ React.createElement(Card$1, { className: classes.card, elevation: 4 }, /* @__PURE__ */ React.createElement(CardActionArea, { onClick: () => {
+  const cardFormEditor = /* @__PURE__ */ React.createElement(Card, { className: classes.card, elevation: 4 }, /* @__PURE__ */ React.createElement(CardActionArea, { onClick: () => {
     var _a;
     return (_a = props.onSelect) == null ? void 0 : _a.call(props, "form");
-  } }, /* @__PURE__ */ React.createElement(CardContent$1, null, /* @__PURE__ */ React.createElement(Typography$1, { variant: "h4", component: "h3", gutterBottom: true }, "Edit Template Form"), /* @__PURE__ */ React.createElement(Typography$1, { variant: "body1" }, "Preview and edit a template form, either using a sample template or by loading a template from the catalog."))));
-  const cardFieldExplorer = /* @__PURE__ */ React.createElement(Card$1, { className: classes.card, elevation: 4 }, /* @__PURE__ */ React.createElement(CardActionArea, { onClick: () => {
+  } }, /* @__PURE__ */ React.createElement(CardContent, null, /* @__PURE__ */ React.createElement(Typography, { variant: "h4", component: "h3", gutterBottom: true }, "Edit Template Form"), /* @__PURE__ */ React.createElement(Typography, { variant: "body1" }, "Preview and edit a template form, either using a sample template or by loading a template from the catalog."))));
+  const cardFieldExplorer = /* @__PURE__ */ React.createElement(Card, { className: classes.card, elevation: 4 }, /* @__PURE__ */ React.createElement(CardActionArea, { onClick: () => {
     var _a;
     return (_a = props.onSelect) == null ? void 0 : _a.call(props, "field-explorer");
-  } }, /* @__PURE__ */ React.createElement(CardContent$1, null, /* @__PURE__ */ React.createElement(Typography$1, { variant: "h4", component: "h3", gutterBottom: true }, "Custom Field Explorer"), /* @__PURE__ */ React.createElement(Typography$1, { variant: "body1" }, "View and play around with available installed custom field extensions."))));
-  return /* @__PURE__ */ React.createElement("div", { style: props.style }, /* @__PURE__ */ React.createElement(Typography$1, { variant: "h4", component: "h2", className: classes.introText }, "Get started by choosing one of the options below"), /* @__PURE__ */ React.createElement(
+  } }, /* @__PURE__ */ React.createElement(CardContent, null, /* @__PURE__ */ React.createElement(Typography, { variant: "h4", component: "h3", gutterBottom: true }, "Custom Field Explorer"), /* @__PURE__ */ React.createElement(Typography, { variant: "body1" }, "View and play around with available installed custom field extensions."))));
+  return /* @__PURE__ */ React.createElement("div", { style: props.style }, /* @__PURE__ */ React.createElement(Typography, { variant: "h4", component: "h2", className: classes.introText }, "Get started by choosing one of the options below"), /* @__PURE__ */ React.createElement(
     "div",
     {
       style: {
@@ -2536,4 +2549,4 @@ const Router = (props) => {
 };
 
 export { Router };
-//# sourceMappingURL=index-81d5d395.esm.js.map
+//# sourceMappingURL=index-CSOk13rN.esm.js.map