@tduniec/plugin-template-designer-foundation 0.1.1

package/CHANGELOG.md

@@ -0,0 +1,13 @@
+## [0.1.1](https://github.com/tduniec/template-designer-plugin/compare/template-designer-foundation-v0.1.0...template-designer-foundation-v0.1.1) (2025-12-20)
+
+
+### Bug Fixes
+
+* **template-designer-foundation:** initial release ([1ddc9d7](https://github.com/tduniec/template-designer-plugin/commit/1ddc9d72f343ab944e706919788e244b8efcdb39))
+
+# [0.1.0](https://github.com/tduniec/template-designer-plugin/compare/template-designer-foundation-v0.0.1...template-designer-foundation-v0.1.0) (2025-12-20)
+
+
+### Features
+
+* bulk refactor to commons ([#55](https://github.com/tduniec/template-designer-plugin/issues/55)) optimized rendering - redesigned rendering logic ([99aa586](https://github.com/tduniec/template-designer-plugin/commit/99aa5862ffb3bac254f1bb0e69b0e94a5ed96c16))

package/README.md

@@ -0,0 +1,13 @@
+# template-designer-foundation
+
+Welcome to the template-designer-foundation plugin!
+
+_This plugin was created through the Backstage CLI_
+
+## Getting started
+
+Your plugin has been added to the example app in this repository, meaning you'll be able to access it by running `yarn start` in the root directory, and then navigating to [/template-designer-foundation](http://localhost:3000/template-designer-foundation).
+
+You can also serve the plugin in isolation by running `yarn start` in the plugin directory.
+This method of serving the plugin provides quicker iteration speed and a faster startup and hot reloads.
+It is only meant for local development, and the setup for it can be found inside the [/dev](./dev) directory.

package/dist/api/useScaffolderActions.esm.js

@@ -0,0 +1,59 @@
+import { useState, useEffect } from 'react';
+import { useApiHolder } from '@backstage/core-plugin-api';
+import { scaffolderApiRef } from '@backstage/plugin-scaffolder-react';
+import { MOCK_SCAFFOLDER_ACTIONS } from '../utils/mocks/mocks.esm.js';
+
+const buildCache = (list) => {
+  const { inputsById, outputsById, inputRequiredById } = list.reduce(
+    (acc, action) => {
+      acc.inputsById[action.id] = action.schema?.input?.properties ?? {};
+      acc.outputsById[action.id] = action.schema?.output?.properties ?? {};
+      const required = Array.isArray(action.schema?.input?.required) ? action.schema?.input?.required.filter(
+        (key) => typeof key === "string" && key.trim().length > 0
+      ) : [];
+      acc.inputRequiredById[action.id] = required;
+      return acc;
+    },
+    { inputsById: {}, outputsById: {}, inputRequiredById: {} }
+  );
+  return {
+    ids: list.map((action) => action.id),
+    inputsById,
+    outputsById,
+    inputRequiredById
+  };
+};
+const fallbackCache = buildCache(
+  MOCK_SCAFFOLDER_ACTIONS
+);
+const useScaffolderActions = () => {
+  const apiHolder = useApiHolder();
+  const scaffolderApi = apiHolder.get(scaffolderApiRef);
+  const [cache, setCache] = useState(fallbackCache);
+  useEffect(() => {
+    let cancelled = false;
+    if (!scaffolderApi) {
+      setCache(fallbackCache);
+      return () => {
+        cancelled = true;
+      };
+    }
+    scaffolderApi.listActions().then((remoteActions) => {
+      if (cancelled) {
+        return;
+      }
+      setCache(buildCache(remoteActions));
+    }).catch(() => {
+      if (!cancelled) {
+        setCache(fallbackCache);
+      }
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, [scaffolderApi]);
+  return cache;
+};
+
+export { useScaffolderActions };
+//# sourceMappingURL=useScaffolderActions.esm.js.map

package/dist/api/useScaffolderActions.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useScaffolderActions.esm.js","sources":["../../src/api/useScaffolderActions.ts"],"sourcesContent":["import { useEffect, useState } from \"react\";\nimport { useApiHolder } from \"@backstage/core-plugin-api\";\nimport { scaffolderApiRef } from \"@backstage/plugin-scaffolder-react\";\nimport type { ListActionsResponse } from \"@backstage/plugin-scaffolder-common\";\nimport { MOCK_SCAFFOLDER_ACTIONS } from \"../utils/mocks/mocks\";\n\ntype ScaffolderAction = {\n  id: string;\n  schema?: {\n    input?: {\n      properties?: Record<string, unknown>;\n      required?: unknown;\n    };\n    output?: {\n      properties?: Record<string, unknown>;\n    };\n  };\n};\n\nexport type ScaffolderActionsCache = {\n  ids: string[];\n  inputsById: Record<string, Record<string, unknown>>;\n  outputsById: Record<string, Record<string, unknown>>;\n  inputRequiredById: Record<string, string[]>;\n};\n\nconst buildCache = (list: ScaffolderAction[]): ScaffolderActionsCache => {\n  const { inputsById, outputsById, inputRequiredById } = list.reduce<{\n    inputsById: Record<string, Record<string, unknown>>;\n    outputsById: Record<string, Record<string, unknown>>;\n    inputRequiredById: Record<string, string[]>;\n  }>(\n    (acc, action) => {\n      acc.inputsById[action.id] = action.schema?.input?.properties ?? {};\n      acc.outputsById[action.id] = action.schema?.output?.properties ?? {};\n      const required = Array.isArray(action.schema?.input?.required)\n        ? action.schema?.input?.required.filter(\n            (key): key is string =>\n              typeof key === \"string\" && key.trim().length > 0\n          )\n        : [];\n      acc.inputRequiredById[action.id] = required;\n      return acc;\n    },\n    { inputsById: {}, outputsById: {}, inputRequiredById: {} }\n  );\n\n  return {\n    ids: list.map((action) => action.id),\n    inputsById,\n    outputsById,\n    inputRequiredById,\n  };\n};\n\nconst fallbackCache = buildCache(\n  MOCK_SCAFFOLDER_ACTIONS as ListActionsResponse\n);\n\nexport const useScaffolderActions = () => {\n  const apiHolder = useApiHolder();\n  const scaffolderApi = apiHolder.get(scaffolderApiRef);\n  const [cache, setCache] = useState<ScaffolderActionsCache>(fallbackCache);\n\n  useEffect(() => {\n    let cancelled = false;\n\n    if (!scaffolderApi) {\n      setCache(fallbackCache);\n      return () => {\n        cancelled = true;\n      };\n    }\n\n    scaffolderApi\n      .listActions()\n      .then((remoteActions) => {\n        if (cancelled) {\n          return;\n        }\n        setCache(buildCache(remoteActions));\n      })\n      .catch(() => {\n        if (!cancelled) {\n          setCache(fallbackCache);\n        }\n      });\n\n    return () => {\n      cancelled = true;\n    };\n  }, [scaffolderApi]);\n\n  return cache;\n};\n"],"names":[],"mappings":";;;;;AA0BA,MAAM,UAAA,GAAa,CAAC,IAAA,KAAqD;AACvE,EAAA,MAAM,EAAE,UAAA,EAAY,WAAA,EAAa,iBAAA,KAAsB,IAAA,CAAK,MAAA;AAAA,IAK1D,CAAC,KAAK,MAAA,KAAW;AACf,MAAA,GAAA,CAAI,UAAA,CAAW,OAAO,EAAE,CAAA,GAAI,OAAO,MAAA,EAAQ,KAAA,EAAO,cAAc,EAAC;AACjE,MAAA,GAAA,CAAI,WAAA,CAAY,OAAO,EAAE,CAAA,GAAI,OAAO,MAAA,EAAQ,MAAA,EAAQ,cAAc,EAAC;AACnE,MAAA,MAAM,QAAA,GAAW,KAAA,CAAM,OAAA,CAAQ,MAAA,CAAO,MAAA,EAAQ,KAAA,EAAO,QAAQ,CAAA,GACzD,MAAA,CAAO,MAAA,EAAQ,KAAA,EAAO,QAAA,CAAS,MAAA;AAAA,QAC7B,CAAC,QACC,OAAO,GAAA,KAAQ,YAAY,GAAA,CAAI,IAAA,GAAO,MAAA,GAAS;AAAA,UAEnD,EAAC;AACL,MAAA,GAAA,CAAI,iBAAA,CAAkB,MAAA,CAAO,EAAE,CAAA,GAAI,QAAA;AACnC,MAAA,OAAO,GAAA;AAAA,IACT,CAAA;AAAA,IACA,EAAE,YAAY,EAAC,EAAG,aAAa,EAAC,EAAG,iBAAA,EAAmB,EAAC;AAAE,GAC3D;AAEA,EAAA,OAAO;AAAA,IACL,KAAK,IAAA,CAAK,GAAA,CAAI,CAAC,MAAA,KAAW,OAAO,EAAE,CAAA;AAAA,IACnC,UAAA;AAAA,IACA,WAAA;AAAA,IACA;AAAA,GACF;AACF,CAAA;AAEA,MAAM,aAAA,GAAgB,UAAA;AAAA,EACpB;AACF,CAAA;AAEO,MAAM,uBAAuB,MAAM;AACxC,EAAA,MAAM,YAAY,YAAA,EAAa;AAC/B,EAAA,MAAM,aAAA,GAAgB,SAAA,CAAU,GAAA,CAAI,gBAAgB,CAAA;AACpD,EAAA,MAAM,CAAC,KAAA,EAAO,QAAQ,CAAA,GAAI,SAAiC,aAAa,CAAA;AAExE,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,SAAA,GAAY,KAAA;AAEhB,IAAA,IAAI,CAAC,aAAA,EAAe;AAClB,MAAA,QAAA,CAAS,aAAa,CAAA;AACtB,MAAA,OAAO,MAAM;AACX,QAAA,SAAA,GAAY,IAAA;AAAA,MACd,CAAA;AAAA,IACF;AAEA,IAAA,aAAA,CACG,WAAA,EAAY,CACZ,IAAA,CAAK,CAAC,aAAA,KAAkB;AACvB,MAAA,IAAI,SAAA,EAAW;AACb,QAAA;AAAA,MACF;AACA,MAAA,QAAA,CAAS,UAAA,CAAW,aAAa,CAAC,CAAA;AAAA,IACpC,CAAC,CAAA,CACA,KAAA,CAAM,MAAM;AACX,MAAA,IAAI,CAAC,SAAA,EAAW;AACd,QAAA,QAAA,CAAS,aAAa,CAAA;AAAA,MACxB;AAAA,IACF,CAAC,CAAA;AAEH,IAAA,OAAO,MAAM;AACX,MAAA,SAAA,GAAY,IAAA;AAAA,IACd,CAAA;AAAA,EACF,CAAA,EAAG,CAAC,aAAa,CAAC,CAAA;AAElB,EAAA,OAAO,KAAA;AACT;;;;"}

package/dist/components/FieldEditorDialog.esm.js

@@ -0,0 +1,55 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { Dialog, DialogTitle, DialogContent, TextField, DialogActions, Button } from '@material-ui/core';
+import { useRef, useEffect } from 'react';
+
+const FieldEditorDialog = ({
+  open,
+  label,
+  value,
+  onClose,
+  onApply
+}) => {
+  const draftRef = useRef(value);
+  const inputRef = useRef(null);
+  useEffect(() => {
+    if (open) {
+      draftRef.current = value;
+      if (inputRef.current) {
+        inputRef.current.value = value;
+      }
+    }
+  }, [open, value]);
+  return /* @__PURE__ */ jsxs(Dialog, { open, onClose, fullWidth: true, maxWidth: "md", children: [
+    /* @__PURE__ */ jsx(DialogTitle, { children: label ? `Edit ${label}` : "Edit field" }),
+    /* @__PURE__ */ jsx(DialogContent, { children: /* @__PURE__ */ jsx(
+      TextField,
+      {
+        multiline: true,
+        minRows: 8,
+        variant: "outlined",
+        defaultValue: value,
+        inputRef,
+        onChange: (event) => {
+          draftRef.current = event.target.value;
+        },
+        fullWidth: true,
+        autoFocus: true
+      }
+    ) }),
+    /* @__PURE__ */ jsxs(DialogActions, { children: [
+      /* @__PURE__ */ jsx(Button, { onClick: onClose, children: "Cancel" }),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          color: "primary",
+          variant: "contained",
+          onClick: () => onApply(draftRef.current ?? value),
+          children: "Apply"
+        }
+      )
+    ] })
+  ] });
+};
+
+export { FieldEditorDialog };
+//# sourceMappingURL=FieldEditorDialog.esm.js.map

package/dist/components/FieldEditorDialog.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FieldEditorDialog.esm.js","sources":["../../src/components/FieldEditorDialog.tsx"],"sourcesContent":["import {\n  Button,\n  Dialog,\n  DialogActions,\n  DialogContent,\n  DialogTitle,\n  TextField,\n} from \"@material-ui/core\";\nimport { useEffect, useRef } from \"react\";\n\nexport type FieldEditorDialogProps = {\n  open: boolean;\n  label?: string;\n  value: string;\n  onClose: () => void;\n  onApply: (value: string) => void;\n};\n\nexport const FieldEditorDialog = ({\n  open,\n  label,\n  value,\n  onClose,\n  onApply,\n}: FieldEditorDialogProps) => {\n  const draftRef = useRef(value);\n  const inputRef = useRef<HTMLInputElement | HTMLTextAreaElement | null>(null);\n\n  useEffect(() => {\n    if (open) {\n      draftRef.current = value;\n      if (inputRef.current) {\n        inputRef.current.value = value;\n      }\n    }\n  }, [open, value]);\n\n  return (\n    <Dialog open={open} onClose={onClose} fullWidth maxWidth=\"md\">\n      <DialogTitle>{label ? `Edit ${label}` : \"Edit field\"}</DialogTitle>\n      <DialogContent>\n        <TextField\n          multiline\n          minRows={8}\n          variant=\"outlined\"\n          defaultValue={value}\n          inputRef={inputRef}\n          onChange={(event) => {\n            draftRef.current = event.target.value;\n          }}\n          fullWidth\n          // eslint-disable-next-line jsx-a11y/no-autofocus\n          autoFocus\n        />\n      </DialogContent>\n      <DialogActions>\n        <Button onClick={onClose}>Cancel</Button>\n        <Button\n          color=\"primary\"\n          variant=\"contained\"\n          onClick={() => onApply(draftRef.current ?? value)}\n        >\n          Apply\n        </Button>\n      </DialogActions>\n    </Dialog>\n  );\n};\n"],"names":[],"mappings":";;;;AAkBO,MAAM,oBAAoB,CAAC;AAAA,EAChC,IAAA;AAAA,EACA,KAAA;AAAA,EACA,KAAA;AAAA,EACA,OAAA;AAAA,EACA;AACF,CAAA,KAA8B;AAC5B,EAAA,MAAM,QAAA,GAAW,OAAO,KAAK,CAAA;AAC7B,EAAA,MAAM,QAAA,GAAW,OAAsD,IAAI,CAAA;AAE3E,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,IAAA,EAAM;AACR,MAAA,QAAA,CAAS,OAAA,GAAU,KAAA;AACnB,MAAA,IAAI,SAAS,OAAA,EAAS;AACpB,QAAA,QAAA,CAAS,QAAQ,KAAA,GAAQ,KAAA;AAAA,MAC3B;AAAA,IACF;AAAA,EACF,CAAA,EAAG,CAAC,IAAA,EAAM,KAAK,CAAC,CAAA;AAEhB,EAAA,4BACG,MAAA,EAAA,EAAO,IAAA,EAAY,SAAkB,SAAA,EAAS,IAAA,EAAC,UAAS,IAAA,EACvD,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,WAAA,EAAA,EAAa,QAAA,EAAA,KAAA,GAAQ,CAAA,KAAA,EAAQ,KAAK,KAAK,YAAA,EAAa,CAAA;AAAA,wBACpD,aAAA,EAAA,EACC,QAAA,kBAAA,GAAA;AAAA,MAAC,SAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAS,IAAA;AAAA,QACT,OAAA,EAAS,CAAA;AAAA,QACT,OAAA,EAAQ,UAAA;AAAA,QACR,YAAA,EAAc,KAAA;AAAA,QACd,QAAA;AAAA,QACA,QAAA,EAAU,CAAC,KAAA,KAAU;AACnB,UAAA,QAAA,CAAS,OAAA,GAAU,MAAM,MAAA,CAAO,KAAA;AAAA,QAClC,CAAA;AAAA,QACA,SAAA,EAAS,IAAA;AAAA,QAET,SAAA,EAAS;AAAA;AAAA,KACX,EACF,CAAA;AAAA,yBACC,aAAA,EAAA,EACC,QAAA,EAAA;AAAA,sBAAA,GAAA,CAAC,MAAA,EAAA,EAAO,OAAA,EAAS,OAAA,EAAS,QAAA,EAAA,QAAA,EAAM,CAAA;AAAA,sBAChC,GAAA;AAAA,QAAC,MAAA;AAAA,QAAA;AAAA,UACC,KAAA,EAAM,SAAA;AAAA,UACN,OAAA,EAAQ,WAAA;AAAA,UACR,OAAA,EAAS,MAAM,OAAA,CAAQ,QAAA,CAAS,WAAW,KAAK,CAAA;AAAA,UACjD,QAAA,EAAA;AAAA;AAAA;AAED,KAAA,EACF;AAAA,GAAA,EACF,CAAA;AAEJ;;;;"}