From b3aa4a5b0bbbb87d041b9515bddedbcbf8ae9fc5 Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Fri, 8 Aug 2025 12:54:45 -0400
Subject: fixed sizing of arrows and dashes to relate to stroke width.  Made
 link's use fill to set color and default to backgorundColor

---
 src/client/views/PropertiesView.tsx | 70 ++++++++++---------------------------
 1 file changed, 19 insertions(+), 51 deletions(-)

(limited to 'src/client/views/PropertiesView.tsx')

diff --git a/src/client/views/PropertiesView.tsx b/src/client/views/PropertiesView.tsx
index f7c4b464c..b4ea1f07b 100644
--- a/src/client/views/PropertiesView.tsx
+++ b/src/client/views/PropertiesView.tsx
@@ -880,18 +880,14 @@ export class PropertiesView extends ObservableReactComponent<PropertiesViewProps
     set colorFil(value) {
         this.selectedStrokes.forEach(doc => {
             const inkStroke = DocumentView.getDocumentView(doc)?.ComponentView as InkingStroke;
-            const { inkData } = inkStroke.inkScaledData();
-            if (InkingStroke.IsClosed(inkData)) {
+            const inkData = inkStroke?.inkScaledData?.().inkData;
+            if (!inkData || InkingStroke.IsClosed(inkData)) {
                 doc.$fillColor = value || undefined;
             }
         });
     }
     @computed get colorStk() { return StrCast(this.selectedStrokes.lastElement()?.$color); } // prettier-ignore
-    set colorStk(value) {
-        this.selectedStrokes.forEach(doc => {
-            doc.$color = value || undefined;
-        });
-    }
+    set colorStk(value) {  this.selectedStrokes.forEach(doc => (doc.$color = value || undefined)); } // prettier-ignore
     @computed get borderColor() {
         return StrCast(this.selectedDoc._color);
     }
@@ -1023,47 +1019,21 @@ export class PropertiesView extends ObservableReactComponent<PropertiesViewProps
         );
     }
 
-    @computed get dashdStk() {  return this.selectedStrokes[0]?.stroke_dash || ''; } // prettier-ignore
-    set dashdStk(value) {
-        value && (this._lastDash = value as string);
-        this.selectedStrokes.forEach(doc => {
-            doc.$stroke_dash = value ? this._lastDash : undefined;
-        });
-    }
-    @computed get widthStk() { return this.getField('stroke_width') || '1'; } // prettier-ignore
-    set widthStk(value) {
-        this.selectedStrokes.forEach(doc => {
-            doc.$stroke_width = Number(value);
-        });
-    }
-    @computed get markScal() { return Number(this.getField('stroke_markerScale') || '1'); } // prettier-ignore
-    set markScal(value) {
-        this.selectedStrokes.forEach(doc => {
-            doc.$stroke_markerScale = Number(value);
-        });
-    }
+    @computed get dashdStk()    { return this.selectedStrokes[0]?.stroke_dash || ''; } // prettier-ignore
+    set dashdStk(value)         { value && (this._lastDash = value as string);
+                                  this.selectedStrokes.forEach(doc => (doc.$stroke_dash = value ? this._lastDash : undefined)); } // prettier-ignore
+    @computed get widthStk()    { return this.getField('stroke_width') || '1'; } // prettier-ignore
+    set widthStk(value)         { this.selectedStrokes.forEach(doc => (doc.$stroke_width = Number(value))); } // prettier-ignore
+    @computed get markScal()    { return Number(this.getField('stroke_markerScale') || '1'); } // prettier-ignore
+    set markScal(value)         { this.selectedStrokes.forEach(doc => (doc.$stroke_markerScale = Number(value))); } // prettier-ignore
     @computed get refStrength() { return Number(this.getField('drawing_refStrength') || '50'); } // prettier-ignore
-    set refStrength(value) {
-        this.selectedDoc.$drawing_refStrength = Number(value);
-    }
-    @computed get smoothAmt() { return Number(this.getField('stroke_smoothAmount') || '5'); } // prettier-ignore
-    set smoothAmt(value) {
-        this.selectedStrokes.forEach(doc => {
-            doc.$stroke_smoothAmount = Number(value);
-        });
-    }
-    @computed get markHead() { return this.getField('stroke_startMarker') || ''; } // prettier-ignore
-    set markHead(value) {
-        this.selectedStrokes.forEach(doc => {
-            doc.$stroke_startMarker = value;
-        });
-    }
-    @computed get markTail() {  return this.getField('stroke_endMarker') || ''; } // prettier-ignore
-    set markTail(value) {
-        this.selectedStrokes.forEach(doc => {
-            doc.$stroke_endMarker = value;
-        });
-    }
+    set refStrength(value)      { this.selectedDoc.$drawing_refStrength = Number(value); } // prettier-ignore
+    @computed get smoothAmt()   { return Number(this.getField('stroke_smoothAmount') || '5'); } // prettier-ignore
+    set smoothAmt(value)        { this.selectedStrokes.forEach(doc => (doc.$stroke_smoothAmount = Number(value))) } // prettier-ignore
+    @computed get markHead()    { return this.getField('stroke_startMarker') || ''; } // prettier-ignore
+    set markHead(value)         { this.selectedStrokes.forEach(doc => (doc.$stroke_startMarker = value)); } // prettier-ignore
+    @computed get markTail()    { return this.getField('stroke_endMarker') || ''; } // prettier-ignore
+    set markTail(value)         { this.selectedStrokes.forEach(doc => (doc.$stroke_endMarker = value)); } // prettier-ignore
 
     regInput = (key: string, value: string | number | undefined, setter: (val: string) => void) => (
         <div className="inputBox">
@@ -1160,16 +1130,14 @@ export class PropertiesView extends ObservableReactComponent<PropertiesViewProps
                 </div>
                 <div className="dashed">
                     <div className="dashed-title">Dashed Line:</div>
-                    <input key="markHead" className="dashed-input" type="checkbox" checked={this.dashdStk === '2'} onChange={this.changeDash} />
+                    <input key="markHead" className="dashed-input" type="checkbox" checked={!!this.dashdStk} onChange={this.changeDash} />
                 </div>
             </div>
         );
     }
 
     @undoBatch
-    changeDash = () => {
-        this.dashdStk = this.dashdStk === '2' ? '0' : '2';
-    };
+    changeDash = () => (this.dashdStk = this.dashdStk ? '' : '2');
 
     @computed get inkEditor() {
         return (
-- 
cgit v1.2.3-70-g09d2

