Code review updates

packages/client/manifest.json

@@ -3163,7 +3163,6 @@
     "styles": [
       "size"
     ],
-    "draggable": true,
     "illegalChildren": [
       "section"
     ],
@@ -3181,7 +3180,7 @@
       },
       {
         "type": "text",
-        "label": "Button",
+        "label": "Button text",
         "key": "scanButtonText"
       },
       {
@@ -4450,7 +4449,9 @@
   "formblock": {
     "name": "Form Block",
     "icon": "Form",
-    "styles": ["size"],
+    "styles": [
+      "size"
+    ],
     "block": true,
     "info": "Form blocks are only compatible with internal or SQL tables",
     "settings": [
@@ -4458,7 +4459,11 @@
         "type": "select",
         "label": "Type",
         "key": "actionType",
-        "options": ["Create", "Update", "View"],
+        "options": [
+          "Create",
+          "Update",
+          "View"
+        ],
         "defaultValue": "Create"
       },
       {

packages/client/src/components/app/forms/CodeScanner.svelte

@@ -6,7 +6,7 @@
   export let value
   export let disabled = false
   export let allowManualEntry = false
-  export let scanButtonText = "Scan Code"
+  export let scanButtonText = "Scan code"
 
   import { createEventDispatcher } from "svelte"
   const dispatch = createEventDispatcher()
@@ -161,17 +161,17 @@
 
       <div slot="footer">
         <div class="footer-buttons">
-          {#if allowManualEntry}
+          {#if allowManualEntry && !manualMode}
             <Button
               group
               secondary
               newStyles
               on:click={() => {
-                manualMode = !manualMode
+                manualMode = true
                 camModal.hide()
               }}
             >
-              Enter Manually
+              Enter manually
             </Button>
           {/if}
 
@@ -193,7 +193,7 @@
 <style>
   #reader :global(video) {
     border-radius: 4px;
-    border: var(--border-light-2);
+    border: 2px solid var(--spectrum-global-color-gray-300);
     overflow: hidden;
   }
   .field-display :global(.spectrum-Tags-item) {
@@ -219,7 +219,7 @@
     align-items: center;
     justify-content: center;
     border-radius: 4px;
-    border: var(--border-light-2);
+    border: 2px solid var(--spectrum-global-color-gray-300);
     background-color: var(--spectrum-global-color-gray-200);
     flex-direction: column;
     gap: var(--spectrum-global-dimension-static-size-200);

packages/client/src/components/app/forms/CodeScannerField.svelte

@@ -1,6 +1,6 @@
 <script>
   import Field from "./Field.svelte"
-  import CodeScanner from "../CodeScanner.svelte"
+  import CodeScanner from "./CodeScanner.svelte"
 
   export let field
   export let label
@@ -15,6 +15,8 @@
   let fieldState
   let fieldApi
 
+  $: scanText = scanButtonText || "Scan code"
+
   const handleUpdate = e => {
     const changed = fieldApi.setValue(e.detail)
     if (onChange && changed) {
@@ -39,7 +41,7 @@
       on:change={handleUpdate}
       disabled={fieldState.disabled}
       {allowManualEntry}
-      {scanButtonText}
+      {scanText}
     />
   {/if}
 </Field>