Start editor with empty label

app/static/editor.js

@@ -366,11 +366,12 @@ function draw() {
 function addObject(type, data = {}) {
   syncDesignControls();
   const size = canvasMm();
+  const margin = state.design.marginMm;
   const base = {
     id: uid(),
     type,
-    x: state.design.marginMm,
+    x: margin,
-    y: state.design.marginMm,
+    y: margin,
     w: Math.min(32, size.w - state.design.marginMm * 2),
     h: Math.min(10, size.h - state.design.marginMm * 2),
     text: "Text",
@@ -387,6 +388,10 @@ function addObject(type, data = {}) {
   state.design.objects.push(base);
   state.selectedId = base.id;
   draw();
+  if (type === "text" || type === "symbol") {
+    controls.propText.focus();
+    controls.propText.select();
+  }
 }
 
 function hitTest(mx, my) {
@@ -425,12 +430,14 @@ function applyProps() {
   const obj = selected();
   if (!obj) return;
   const manuallySizing = document.activeElement === controls.propW || document.activeElement === controls.propH;
+  const editingText = document.activeElement === controls.propText;
   obj.text = controls.propText.value;
   obj.x = Number(controls.propX.value);
   obj.y = Number(controls.propY.value);
   obj.w = Number(controls.propW.value);
   obj.h = Number(controls.propH.value);
   if (manuallySizing) obj.manualSize = true;
+  if (editingText && obj.text) obj.manualSize = false;
   obj.fontSizeMm = Number(controls.propFont.value);
   obj.lineMm = Number(controls.propLine.value);
   obj.align = controls.propAlign.value;
@@ -480,7 +487,18 @@ document.querySelectorAll("[data-tool]").forEach((button) => {
     if (tool === "frame") addObject("shape", { w: 28, h: 14, fill: false });
     if (tool === "rect") addObject("shape", { w: 18, h: 10, fill: true });
     if (tool === "line") addObject("line", { w: 24, h: 0.1 });
-    if (tool === "text") addObject("text", { w: 35, h: 10, text: "Text" });
+    if (tool === "text") {
+      syncDesignControls();
+      const size = canvasMm();
+      addObject("text", {
+        w: Math.max(2, size.w - state.design.marginMm * 2),
+        h: Math.max(2, size.h - state.design.marginMm * 2),
+        text: "",
+        fontSizeMm: Math.max(2, size.h - state.design.marginMm * 2 - 2),
+        bold: false,
+        manualSize: true,
+      });
+    }
     if (tool === "table") addObject("table", { w: 36, h: 14, rows: 2, cols: 3 });
     if (tool === "qr") addObject("qr", { w: 16, h: 16, text: "https://example.local" });
     if (tool === "barcode") addObject("barcode", { w: 42, h: 12, text: "1234567890" });
@@ -629,8 +647,6 @@ function hydrateImages() {
   }
 }
 
-addObject("text", { x: 4, y: 4, w: 36, h: 10, text: "P-Touch", fontSizeMm: 5.5, bold: true });
-state.selectedId = null;
 draw();
 updateQueueStatus();
 setInterval(updateQueueStatus, 10000);