From 4574b7f03ccc85c4bebdbfd9475788456086704f Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Thu, 8 Aug 2024 12:27:40 -0400
Subject: many changes to add typing in place of 'any's etc

---
 src/client/views/nodes/DocumentContentsView.tsx | 46 ++++++++++++++++---------
 1 file changed, 29 insertions(+), 17 deletions(-)

(limited to 'src/client/views/nodes/DocumentContentsView.tsx')

diff --git a/src/client/views/nodes/DocumentContentsView.tsx b/src/client/views/nodes/DocumentContentsView.tsx
index 192c7875e..8a2c4e530 100644
--- a/src/client/views/nodes/DocumentContentsView.tsx
+++ b/src/client/views/nodes/DocumentContentsView.tsx
@@ -43,26 +43,37 @@ interface HTMLtagProps {
 @observer
 export class HTMLtag extends React.Component<HTMLtagProps> {
     click = () => {
-        const clickScript = (this.props as any).onClick as Opt<ScriptField>;
+        const clickScript = this.props.onClick as Opt<ScriptField>;
         clickScript?.script.run({ this: this.props.Document, scale: this.props.scaling });
     };
-    onInput = (e: React.FormEvent<HTMLDivElement>) => {
-        const onInputScript = (this.props as any).onInput as Opt<ScriptField>;
-        onInputScript?.script.run({ this: this.props.Document, value: (e.target as any).textContent });
+    onInput = (e: React.FormEvent<unknown>) => {
+        const onInputScript = this.props.onInput as Opt<ScriptField>;
+        onInputScript?.script.run({ this: this.props.Document, value: (e.target as HTMLElement).textContent });
     };
     render() {
-        const style: { [key: string]: any } = {};
-        const divKeys = OmitKeys(this.props, ['children', 'dragStarting', 'dragEnding', 'htmltag', 'scaling', 'Document', 'key', 'onInput', 'onClick', '__proto__']).omit;
-        const replacer = (match: any, expr: string) =>
+        const style: { [key: string]: unknown } = {};
+        const divKeys = OmitKeys(this.props, [
+            'children', //
+            'dragStarting',
+            'dragEnding',
+            'htmltag',
+            'scaling',
+            'Document',
+            'key',
+            'onInput',
+            'onClick',
+            '__proto__',
+        ]).omit;
+        const replacer = (match: string, expr: string) =>
             // bcz: this executes a script to convert a property expression string:  { script }  into a value
             (ScriptField.MakeFunction(expr, { this: Doc.name, scale: 'number' })?.script.run({ this: this.props.Document, scale: this.props.scaling }).result as string) || '';
         Object.keys(divKeys).forEach((prop: string) => {
-            const p = (this.props as any)[prop] as string;
+            const p = (this.props as unknown as { [key: string]: string })[prop] as string;
             style[prop] = p?.replace(/{([^.'][^}']+)}/g, replacer);
         });
         const Tag = this.props.htmltag as keyof JSX.IntrinsicElements;
         return (
-            <Tag style={style} onClick={this.click} onInput={this.onInput as any}>
+            <Tag style={style} onClick={this.click} onInput={this.onInput}>
                 {this.props.children}
             </Tag>
         );
@@ -78,12 +89,12 @@ export class DocumentContentsView extends ObservableReactComponent<DocumentConte
     /**
      * Set of all available rendering componets for Docs (e.g., ImageBox, CollectionFreeFormView, etc)
      */
-    private static Components: { [key: string]: any };
-    public static Init(defaultLayoutString: string, components: { [key: string]: any }) {
+    private static Components: { [key: string]: DocumentContentsViewProps };
+    public static Init(defaultLayoutString: string, components: { [key: string]: DocumentContentsViewProps }) {
         DocumentContentsView.DefaultLayoutString = defaultLayoutString;
         DocumentContentsView.Components = components;
     }
-    constructor(props: any) {
+    constructor(props: DocumentContentsViewProps) {
         super(props);
         makeObservable(this);
     }
@@ -132,13 +143,13 @@ export class DocumentContentsView extends ObservableReactComponent<DocumentConte
             ...this._props,
             Document: this.layoutDoc ?? this._props.Document,
             TemplateDataDocument: templateDataDoc instanceof Promise ? undefined : templateDataDoc,
-            onClick: onClick as any as React.MouseEventHandler, // pass onClick script as if it were a real function -- it will be interpreted properly in the HTMLtag
-            onInput: onInput as any as React.FormEventHandler,
+            onClick: onClick as unknown as React.MouseEventHandler, // pass onClick script as if it were a real function -- it will be interpreted properly in the HTMLtag
+            onInput: onInput as unknown as React.FormEventHandler,
         };
         return {
             props: {
                 ...OmitKeys(list, [...docOnlyProps], '').omit,
-            },
+            } as BindingProps,
         };
     }
 
@@ -151,11 +162,11 @@ export class DocumentContentsView extends ObservableReactComponent<DocumentConte
         let layoutFrame = this.layout;
 
         // replace code content with a script  >{content}<   as in  <HTMLdiv>{this.title}</HTMLdiv>
-        const replacer = (match: any, prefix: string, expr: string, postfix: string) => prefix + ((ScriptField.MakeFunction(expr, { this: Doc.name })?.script.run({ this: this._props.Document }).result as string) || '') + postfix;
+        const replacer = (match: string, prefix: string, expr: string, postfix: string) => prefix + ((ScriptField.MakeFunction(expr, { this: Doc.name })?.script.run({ this: this._props.Document }).result as string) || '') + postfix;
         layoutFrame = layoutFrame.replace(/(>[^{]*)[^=]\{([^.'][^<}]+)\}([^}]*<)/g, replacer);
 
         // replace HTML<tag> with corresponding HTML tag as in:  <HTMLdiv> becomes  <HTMLtag Document={props.Document} htmltag='div'>
-        const replacer2 = (match: any, p1: string) => `<HTMLtag Document={props.Document} scaling='${this._props.NativeDimScaling?.() || 1}' htmltag='${p1}'`;
+        const replacer2 = (match: string, p1: string) => `<HTMLtag Document={props.Document} scaling='${this._props.NativeDimScaling?.() || 1}' htmltag='${p1}'`;
         layoutFrame = layoutFrame.replace(/<HTML([a-zA-Z0-9_-]+)/g, replacer2);
 
         // replace /HTML<tag> with </HTMLdiv>  as in:  </HTMLdiv> becomes  </HTMLtag>
@@ -194,6 +205,7 @@ export class DocumentContentsView extends ObservableReactComponent<DocumentConte
                 bindings={bindings}
                 jsx={layoutFrame}
                 showWarnings
+                // eslint-disable-next-line @typescript-eslint/no-explicit-any
                 onError={(test: any) => {
                     console.log('DocumentContentsView:' + test, bindings, layoutFrame);
                 }}
-- 
cgit v1.2.3-70-g09d2