@ostack.tech/kform-scaffolder 0.31.5 → 0.32.0

package/ostack-kform-scaffolder.css

@@ -16,19 +16,52 @@
 
 .builder-header {
   display: flex;
-  justify-content: space-between;
-  column-gap: 1rem;
+  gap: 0.5rem 1rem;
   flex-wrap: wrap;
+  align-items: baseline;
+  position: sticky;
+  top: 1rem;
+  z-index: 1;
+  margin-bottom: 1rem;
+
+  > * {
+    position: relative;
+    display: inline-block;
+    isolation: isolate;
+
+    &::after {
+      content: "";
+      position: absolute;
+      inset: -0.35rem -0.35rem;
+      border-radius: 0.5rem;
+      pointer-events: none;
+
+      background: color-mix(in srgb, Canvas 70%, transparent);
+      backdrop-filter: blur(12px);
+      -webkit-backdrop-filter: blur(12px);
+
+      z-index: -1;
+    }
+  }
 }
 
 .builder-title {
-  margin: 0 0 0.5rem;
+  margin: 0;
+}
+
+.builder-version {
+  opacity: 0.65;
+
+  &::before {
+    content: "v";
+  }
 }
 
 .builder-actions {
   display: inline-flex;
+  align-self: center;
   gap: 0.5rem;
-  margin-bottom: 1.5rem;
+  margin-left: auto;
 }
 
 .builder {

package/ostack-kform-scaffolder.js

@@ -86,9 +86,7 @@ function LoadSchematic() {
             description: "Form schematic",
             id: name
           });
-          if (file.handle) {
-            latestSchematicFileHandleRef.current = file.handle;
-          }
+          latestSchematicFileHandleRef.current = file.handle ?? null;
           const content = JSON.parse(await file.text());
           setSchematic(() => content);
         } catch (err) {
@@ -127,7 +125,7 @@ function SaveSchematic() {
           );
           if (supported) {
             alert(
-              `Schematic saved successfully as “${latestSchematicFileHandleRef.current.name}”.`
+              `Schematic saved successfully as “${latestSchematicFileHandleRef.current?.name ?? "unknown"}”.`
             );
           }
         } catch (err) {
@@ -211,7 +209,6 @@ function useScaffolder() {
     schematicKinds
   ]);
 }
-let latestZipFileHandle = null;
 function ScaffoldToZip() {
   const { getRootSchematic, name } = useSchematicBuilderContext();
   const scaffold2 = useScaffolder();
@@ -233,7 +230,7 @@ function ScaffoldToZip() {
               unixPermissions: executable ? "755" : void 0
             });
           }
-          latestZipFileHandle = await fileSave(
+          const fileHandle = await fileSave(
             zip.generateAsync({ platform: "UNIX", type: "blob" }),
             {
               fileName: `${schematic.name}.zip`,
@@ -241,12 +238,11 @@ function ScaffoldToZip() {
               mimeTypes: ["application/zip"],
               description: "Form scaffolding",
               id: name
-            },
-            latestZipFileHandle
+            }
           );
           if (supported) {
             alert(
-              `Project scaffolded successfully in “${latestZipFileHandle.name}”.`
+              `Project scaffolded successfully in “${fileHandle?.name ?? "unknown"}”.`
             );
           }
         } catch (err) {
@@ -1533,7 +1529,8 @@ function SchematicBuilder({
   configs = /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsx(UseFileBase64SerializerConfig, {}),
     /* @__PURE__ */ jsx(UseTableValuesSerializerConfig, {})
-  ] })
+  ] }),
+  version = "0.32.0"
 }) {
   const [useSchematic] = useState(
     () => create(
@@ -1612,6 +1609,7 @@ function SchematicBuilder({
             /* @__PURE__ */ jsxs("form", { className: "builder-root", children: [
               /* @__PURE__ */ jsxs("header", { className: "builder-header", children: [
                 /* @__PURE__ */ jsx("h1", { className: "builder-title", children: title }),
+                version && /* @__PURE__ */ jsx("div", { className: "builder-version", children: version }),
                 /* @__PURE__ */ jsxs("div", { className: "builder-actions", children: [
                   configs && /* @__PURE__ */ jsx(SchematicBuilderConfig, { children: configs }),
                   actions