Login: allow edit of title & button text

packages/builder/src/components/userInterface/temporaryPanelStructure.js

@@ -303,6 +303,16 @@ export default {
                 key: "logo",
                 control: Input,
               },
+              {
+                label: "Title",
+                key: "title",
+                control: Input,
+              },
+              {
+                label: "Button Text",
+                key: "buttonText",
+                control: Input,
+              },
             ],
           },
         },

packages/server/src/utilities/appDirectoryTemplate/pages/unauthenticated/page.json

@@ -28,7 +28,8 @@
         "_instanceName": "Login",
         "inputClass": "",
         "_children": [],
-        "name": "{{ name }}",
+        "title": "Login to {{ name }}",
+        "buttonText": "Login",
         "logo": ""
       }
     ],

packages/standard-components/components.json

@@ -66,7 +66,7 @@
 		"props": {
 			"logo": "asset",
 			"loginRedirect": "string",
-			"name": "string",
+			"title": "string",
 			"usernameLabel": {
 				"type": "string",
 				"default": "Username"
@@ -80,7 +80,8 @@
 				"default": "Login"
 			},
 			"buttonClass": "string",
-			"inputClass": "string"
+			"inputClass": "string",
+			"buttonText": "string"
 		},
 		"tags": [
 			"login",

packages/standard-components/src/Login.svelte

@@ -1,9 +1,9 @@
 <script>
   import Button from "./Button.svelte"
 
-  export let loginButtonLabel = "Login"
+  export let buttonText = "Login"
   export let logo = ""
-  export let name = ""
+  export let title = ""
   export let buttonClass = ""
   export let inputClass = ""
 
@@ -47,7 +47,9 @@
       </div>
     {/if}
 
-    <h1 class="header-content">Log in to {name}</h1>
+    {#if title}
+      <h1 class="header-content">{title}</h1>
+    {/if}
 
     <div class="form-root">
       <div class="control">
@@ -69,7 +71,7 @@
 
     <div class="login-button-container">
       <button disabled={loading} on:click={login} class={_buttonClass}>
-        Log in to {name}
+        {buttonText || "Login"}
       </button>
     </div>