From ab0e1ac6f5b21f2e10bdce428c882482a0f159b4 Mon Sep 17 00:00:00 2001 From: mehekj Date: Tue, 12 Apr 2022 18:09:03 -0400 Subject: ink to text for groupings --- src/typings/index.d.ts | 1 + 1 file changed, 1 insertion(+) (limited to 'src/typings') diff --git a/src/typings/index.d.ts b/src/typings/index.d.ts index 068ac2159..bc7727426 100644 --- a/src/typings/index.d.ts +++ b/src/typings/index.d.ts @@ -8,6 +8,7 @@ declare module 'webrtc-adapter'; declare module 'bezier-curve'; declare module 'fit-curve'; declare module 'react-audio-waveform'; +declare module 'iink-js'; declare module 'reveal'; declare module 'react-reveal'; -- cgit v1.2.3-70-g09d2 From 5ec467d2c03f98a6070361caf5727dece6327c29 Mon Sep 17 00:00:00 2001 From: bobzel Date: Thu, 7 Jul 2022 14:57:23 -0400 Subject: got rid of typings for ReactTextareaAutocomplete to avoid react warnings. --- package-lock.json | 166 ++---- package.json | 6 +- src/client/views/collections/CollectionView.tsx | 1 - src/client/views/nodes/ScriptingBox.tsx | 761 ++++++++++++++---------- src/typings/index.d.ts | 84 +-- 5 files changed, 535 insertions(+), 483 deletions(-) (limited to 'src/typings') diff --git a/package-lock.json b/package-lock.json index 7e413d5c5..ed3160696 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1947,25 +1947,9 @@ "version": "6.8.9", "resolved": "https://registry.npmjs.org/@types/react-table/-/react-table-6.8.9.tgz", "integrity": "sha512-fVQXjy/EYDbgraScgjDONA291McKqGrw0R0NeK639fx2bS4T19TnXMjg3FjOPlkI3qYTQtFTPADlRYysaQIMpA==", + "dev": true, "requires": { "@types/react": "*" - }, - "dependencies": { - "@types/react": { - "version": "18.0.12", - "resolved": "https://registry.npmjs.org/@types/react/-/react-18.0.12.tgz", - "integrity": "sha512-duF1OTASSBQtcigUvhuiTB1Ya3OvSy+xORCiEf20H0P0lzx+/KeVsA99U5UjLXSbyo1DRJDlLKqTeM1ngosqtg==", - "requires": { - "@types/prop-types": "*", - "@types/scheduler": "*", - "csstype": "^3.0.2" - } - }, - "csstype": { - "version": "3.1.0", - "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.0.tgz", - "integrity": "sha512-uX1KG+x9h5hIJsaKR9xHUeUraxf8IODOwq9JLNPq6BwB04a/xgpq3rcx47l5BZu5zBPlgD342tdke3Hom/nJRA==" - } } }, "@types/react-transition-group": { @@ -2263,31 +2247,6 @@ } } }, - "@types/webscopeio__react-textarea-autocomplete": { - "version": "4.7.2", - "resolved": "https://registry.npmjs.org/@types/webscopeio__react-textarea-autocomplete/-/webscopeio__react-textarea-autocomplete-4.7.2.tgz", - "integrity": "sha512-e1DZGD+eH19BnllTWCGXAdrMa2kI53wEMuhn/d+wUmnu8//ZI6BiuK/EPdw07fI4+tlyo5qdPZdXdpkoXHJVOw==", - "requires": { - "@types/react": "*" - }, - "dependencies": { - "@types/react": { - "version": "18.0.12", - "resolved": "https://registry.npmjs.org/@types/react/-/react-18.0.12.tgz", - "integrity": "sha512-duF1OTASSBQtcigUvhuiTB1Ya3OvSy+xORCiEf20H0P0lzx+/KeVsA99U5UjLXSbyo1DRJDlLKqTeM1ngosqtg==", - "requires": { - "@types/prop-types": "*", - "@types/scheduler": "*", - "csstype": "^3.0.2" - } - }, - "csstype": { - "version": "3.1.0", - "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.0.tgz", - "integrity": "sha512-uX1KG+x9h5hIJsaKR9xHUeUraxf8IODOwq9JLNPq6BwB04a/xgpq3rcx47l5BZu5zBPlgD342tdke3Hom/nJRA==" - } - } - }, "@types/xregexp": { "version": "4.4.0", "resolved": "https://registry.npmjs.org/@types/xregexp/-/xregexp-4.4.0.tgz", @@ -2496,7 +2455,7 @@ "textarea-caret": { "version": "3.0.2", "resolved": "https://registry.npmjs.org/textarea-caret/-/textarea-caret-3.0.2.tgz", - "integrity": "sha1-82DEhpmqGr9xhoCkOjGoUGZcLK8=" + "integrity": "sha512-gRzeti2YS4did7UJnPQ47wrjD+vp+CJIe9zbsu0bJ987d8QVLvLNG9757rqiQTIy4hGIeFauTTJt5Xkn51UkXg==" } } }, @@ -3550,11 +3509,6 @@ "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.7.2.tgz", "integrity": "sha512-XpNj6GDQzdfW+r2Wnn7xiSAd7TM3jzkxGXBGTtWKuSXv1xUV+azxAm8jdWZN06QTQk+2N2XB9jRDkvbmQmcRtg==" }, - "blueimp-load-image": { - "version": "2.31.0", - "resolved": "https://registry.npmjs.org/blueimp-load-image/-/blueimp-load-image-2.31.0.tgz", - "integrity": "sha512-6sTGh1OiUmuH8ftAYvUzALivoOmcnahinGmjZFI4puZVowXoKTn/bXtth7N1skW5AlezEOfjgFH4lNXHeNRQog==" - }, "body-parser": { "version": "1.20.0", "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.20.0.tgz", @@ -5097,7 +5051,7 @@ "custom-event": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/custom-event/-/custom-event-1.0.1.tgz", - "integrity": "sha1-XQKkaFCt8bSjF5RqOSj8y1v9BCU=" + "integrity": "sha512-GAj5FOq0Hd+RsCGVJxZuKaIDXDf3h6GQoNEjFgbLLI/trgtavwUbSnZ5pVfg27DVCaWjIohryS0JFwIJyT2cMg==" }, "cyclist": { "version": "1.0.1", @@ -5105,6 +5059,16 @@ "integrity": "sha1-WW6WmP0MgOEgOMK4LW6xs1tiJNk=", "dev": true }, + "d": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/d/-/d-1.0.1.tgz", + "integrity": "sha512-m62ShEObQ39CfralilEQRjH6oAMtNCV1xJyEx5LpRYUVN+EviphDgUc/F3hnYbADmkiNs67Y+3ylmlG7Lnu+FA==", + "dev": true, + "requires": { + "es5-ext": "^0.10.50", + "type": "^1.0.1" + } + }, "d3-array": { "version": "2.12.1", "resolved": "https://registry.npmjs.org/d3-array/-/d3-array-2.12.1.tgz", @@ -6254,6 +6218,28 @@ "is-symbol": "^1.0.2" } }, + "es5-ext": { + "version": "0.10.61", + "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.61.tgz", + "integrity": "sha512-yFhIqQAzu2Ca2I4SE2Au3rxVfmohU9Y7wqGR+s7+H7krk26NXhIRAZDgqd6xqjCEFUomDEA3/Bo/7fKmIkW1kA==", + "dev": true, + "requires": { + "es6-iterator": "^2.0.3", + "es6-symbol": "^3.1.3", + "next-tick": "^1.1.0" + } + }, + "es6-iterator": { + "version": "2.0.3", + "resolved": "https://registry.npmjs.org/es6-iterator/-/es6-iterator-2.0.3.tgz", + "integrity": "sha512-zw4SRzoUkd+cl+ZoE15A9o1oQd920Bb0iOJMQkQhl3jNc03YqVjAhG7scf9C5KWRU/R13Orf588uCC6525o02g==", + "dev": true, + "requires": { + "d": "1", + "es5-ext": "^0.10.35", + "es6-symbol": "^3.1.1" + } + }, "es6-promise": { "version": "3.2.1", "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-3.2.1.tgz", @@ -6265,6 +6251,7 @@ "integrity": "sha512-NJ6Yn3FuDinBaBRWl/q5X/s4koRHBrgKAu+yGI6JCBeiu3qrcbJhwT2GeR/EXVfylRk8dpQVJoLEFhK+Mu31NA==", "dev": true, "requires": { + "d": "^1.0.1", "ext": "^1.1.2" } }, @@ -7577,11 +7564,6 @@ } } }, - "exenv": { - "version": "1.2.2", - "resolved": "https://registry.npmjs.org/exenv/-/exenv-1.2.2.tgz", - "integrity": "sha1-KueOhdmJQVhnCwPUe+wfA72Ru50=" - }, "exeq": { "version": "2.4.0", "resolved": "https://registry.npmjs.org/exeq/-/exeq-2.4.0.tgz", @@ -17500,13 +17482,11 @@ } }, "react": { - "version": "16.14.0", - "resolved": "https://registry.npmjs.org/react/-/react-16.14.0.tgz", - "integrity": "sha512-0X2CImDkJGApiAlcf0ODKIneSwBPhqJawOa5wCtKbu7ZECrmS26NvtSILynQ66cgkT/RJ4LidJOc3bUESwmU8g==", + "version": "18.2.0", + "resolved": "https://registry.npmjs.org/react/-/react-18.2.0.tgz", + "integrity": "sha512-/3IjMdb2L9QbBdWiW5e3P2/npwMBaU9mHCSCUzNln0ZCYbcfTsGbTJrU/kGemdH2IWmB2ioZ+zkxtmq6g09fGQ==", "requires": { - "loose-envify": "^1.1.0", - "object-assign": "^4.1.1", - "prop-types": "^15.6.2" + "loose-envify": "^1.1.0" } }, "react-audio-waveform": { @@ -17613,23 +17593,20 @@ } }, "react-dom": { - "version": "16.14.0", - "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-16.14.0.tgz", - "integrity": "sha512-1gCeQXDLoIqMgqD3IO2Ah9bnf0w9kzhwN5q4FGnHZ67hBm9yePzB5JJAIQCc8x3pFnNlwFq4RidZggNAAkzWWw==", + "version": "18.2.0", + "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.2.0.tgz", + "integrity": "sha512-6IMTriUmvsjHUjNtEDudZfuDQUoWXVxKHhlEGSk81n4YFS+r/Kl99wXiwlVXtPBtJenozv2P+hxDsw9eA7Xo6g==", "requires": { "loose-envify": "^1.1.0", - "object-assign": "^4.1.1", - "prop-types": "^15.6.2", - "scheduler": "^0.19.1" + "scheduler": "^0.23.0" }, "dependencies": { "scheduler": { - "version": "0.19.1", - "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.19.1.tgz", - "integrity": "sha512-n/zwRWRYSUj0/3g/otKDRPMh6qv2SYMWNq85IEa8iZyAv8od9zDYpGSnpBEjNgcMNq6Scbu5KfIPxNF72R/2EA==", + "version": "0.23.0", + "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.23.0.tgz", + "integrity": "sha512-CtuThmgHNg7zIZWAXi3AsyIzA3n4xx7aNyjwC2VJldO2LMVDhFK+63xGqq6CsJH4rTAt6/M+N4GhZiDYPx9eUw==", "requires": { - "loose-envify": "^1.1.0", - "object-assign": "^4.1.1" + "loose-envify": "^1.1.0" } } } @@ -17691,16 +17668,6 @@ "resolved": "https://registry.npmjs.org/react-icons/-/react-icons-4.4.0.tgz", "integrity": "sha512-fSbvHeVYo/B5/L4VhB7sBA1i2tS8MkT0Hb9t2H1AVPkwGfVHLJCqyr2Py9dKMxsyM63Eng1GkdZfbWj+Fmv8Rg==" }, - "react-image-lightbox-with-rotate": { - "version": "5.1.1", - "resolved": "https://registry.npmjs.org/react-image-lightbox-with-rotate/-/react-image-lightbox-with-rotate-5.1.1.tgz", - "integrity": "sha512-5ZubUQefKSDGIiAwK4lkfmGr/bgIfNDHXqC+Fm6nbNwTVYuYOZ1RJjULOniEB4fxb3Vm0z/x0oNhi1lbP1aMtg==", - "requires": { - "blueimp-load-image": "^2.19.0", - "prop-types": "^15.6.1", - "react-modal": "^3.4.4" - } - }, "react-input-autosize": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/react-input-autosize/-/react-input-autosize-3.0.0.tgz", @@ -17797,27 +17764,6 @@ "resolved": "https://registry.npmjs.org/react-merge-refs/-/react-merge-refs-1.1.0.tgz", "integrity": "sha512-alTKsjEL0dKH/ru1Iyn7vliS2QRcBp9zZPGoWxUOvRGWPUYgjo+V01is7p04It6KhgrzhJGnIj9GgX8W4bZoCQ==" }, - "react-modal": { - "version": "3.15.1", - "resolved": "https://registry.npmjs.org/react-modal/-/react-modal-3.15.1.tgz", - "integrity": "sha512-duB9bxOaYg7Zt6TMFldIFxQRtSP+Dg3F1ZX3FXxSUn+3tZZ/9JCgeAQKDg7rhZSAqopq8TFRw3yIbnx77gyFTw==", - "requires": { - "exenv": "^1.2.0", - "prop-types": "^15.7.2", - "react-lifecycles-compat": "^3.0.0", - "warning": "^4.0.3" - }, - "dependencies": { - "warning": { - "version": "4.0.3", - "resolved": "https://registry.npmjs.org/warning/-/warning-4.0.3.tgz", - "integrity": "sha512-rpJyN222KWIvHJ/F53XSZv0Zl/accqHR8et1kpaMTD/fLCRxtV8iX8czMzY7sVZupTI3zcUTg8eycS2kNF9l6w==", - "requires": { - "loose-envify": "^1.0.0" - } - } - } - }, "react-onclickoutside": { "version": "6.12.2", "resolved": "https://registry.npmjs.org/react-onclickoutside/-/react-onclickoutside-6.12.2.tgz", @@ -17969,6 +17915,16 @@ "@types/react-table": "^6.8.5", "classnames": "^2.2.5", "react-is": "^16.8.1" + }, + "dependencies": { + "@types/react-table": { + "version": "6.8.9", + "resolved": "https://registry.npmjs.org/@types/react-table/-/react-table-6.8.9.tgz", + "integrity": "sha512-fVQXjy/EYDbgraScgjDONA291McKqGrw0R0NeK639fx2bS4T19TnXMjg3FjOPlkI3qYTQtFTPADlRYysaQIMpA==", + "requires": { + "@types/react": "*" + } + } } }, "react-themeable": { @@ -20792,6 +20748,12 @@ "resolved": "https://registry.npmjs.org/tweetnacl/-/tweetnacl-0.14.5.tgz", "integrity": "sha1-WuaBd/GS1EViadEIr6k/+HQ/T2Q=" }, + "type": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/type/-/type-1.2.0.tgz", + "integrity": "sha512-+5nt5AAniqsCnu2cEQQdpzCAh33kVx8n0VoFidKpB1dVVLAN/F+bgVOqOJqOnEnrhp222clB5p3vUlD+1QAnfg==", + "dev": true + }, "type-check": { "version": "0.3.2", "resolved": "https://registry.npmjs.org/type-check/-/type-check-0.3.2.tgz", diff --git a/package.json b/package.json index 93968dce4..c2b6c24bf 100644 --- a/package.json +++ b/package.json @@ -152,7 +152,6 @@ "@types/supercluster": "^7.1.0", "@types/three": "^0.126.2", "@types/web": "0.0.53", - "@types/webscopeio__react-textarea-autocomplete": "^4.7.2", "@webscopeio/react-textarea-autocomplete": "^4.9.1", "D": "^1.0.0", "adm-zip": "^0.4.16", @@ -261,17 +260,16 @@ "query-string": "^6.14.1", "raw-loader": "^1.0.0", "rc-switch": "^1.9.2", - "react": "^16.14.0", + "react": "^18.2.0", "react-audio-waveform": "0.0.5", "react-autosuggest": "^9.4.3", "react-beautiful-dnd": "^13.1.0", "react-color": "^2.19.3", "react-compound-slider": "^2.5.0", "react-datepicker": "^3.8.0", - "react-dom": "^16.14.0", + "react-dom": "^18.2.0", "react-grid-layout": "^1.3.4", "react-icons": "^4.3.1", - "react-image-lightbox-with-rotate": "^5.1.1", "react-jsx-parser": "^1.29.0", "react-loading": "^2.0.3", "react-measure": "^2.5.2", diff --git a/src/client/views/collections/CollectionView.tsx b/src/client/views/collections/CollectionView.tsx index d788f9a77..1576ec40f 100644 --- a/src/client/views/collections/CollectionView.tsx +++ b/src/client/views/collections/CollectionView.tsx @@ -1,7 +1,6 @@ import { computed, observable, runInAction } from 'mobx'; import { observer } from 'mobx-react'; import * as React from 'react'; -import 'react-image-lightbox-with-rotate/style.css'; // This only needs to be imported once in your app import { Doc, DocListCast } from '../../../fields/Doc'; import { Id } from '../../../fields/FieldSymbols'; import { ObjectField } from '../../../fields/ObjectField'; diff --git a/src/client/views/nodes/ScriptingBox.tsx b/src/client/views/nodes/ScriptingBox.tsx index 366c3fc2f..05ff40f22 100644 --- a/src/client/views/nodes/ScriptingBox.tsx +++ b/src/client/views/nodes/ScriptingBox.tsx @@ -1,39 +1,39 @@ -import ReactTextareaAutocomplete from "@webscopeio/react-textarea-autocomplete"; -import "@webscopeio/react-textarea-autocomplete/style.css"; -import { action, computed, observable } from "mobx"; -import { observer } from "mobx-react"; -import * as React from "react"; -import { Doc } from "../../../fields/Doc"; -import { List } from "../../../fields/List"; -import { listSpec } from "../../../fields/Schema"; -import { ScriptField } from "../../../fields/ScriptField"; -import { BoolCast, Cast, NumCast, ScriptCast, StrCast } from "../../../fields/Types"; -import { TraceMobx } from "../../../fields/util"; -import { returnEmptyString } from "../../../Utils"; -import { DragManager } from "../../util/DragManager"; -import { InteractionUtils } from "../../util/InteractionUtils"; -import { CompileScript, ScriptParam } from "../../util/Scripting"; -import { ScriptingGlobals } from "../../util/ScriptingGlobals"; -import { ScriptManager } from "../../util/ScriptManager"; -import { ContextMenu } from "../ContextMenu"; -import { ViewBoxAnnotatableComponent, ViewBoxAnnotatableProps } from "../DocComponent"; -import { EditableView } from "../EditableView"; -import { FieldView, FieldViewProps } from "../nodes/FieldView"; -import { OverlayView } from "../OverlayView"; -import { DocumentIconContainer } from "./DocumentIcon"; -import "./ScriptingBox.scss"; -const _global = (window /* browser */ || global /* node */) as any; +let ReactTextareaAutocomplete = require('@webscopeio/react-textarea-autocomplete').default; +import { action, computed, observable } from 'mobx'; +import { observer } from 'mobx-react'; +import * as React from 'react'; +import { Doc } from '../../../fields/Doc'; +import { List } from '../../../fields/List'; +import { listSpec } from '../../../fields/Schema'; +import { ScriptField } from '../../../fields/ScriptField'; +import { BoolCast, Cast, NumCast, ScriptCast, StrCast } from '../../../fields/Types'; +import { TraceMobx } from '../../../fields/util'; +import { returnEmptyString } from '../../../Utils'; +import { DragManager } from '../../util/DragManager'; +import { InteractionUtils } from '../../util/InteractionUtils'; +import { CompileScript, ScriptParam } from '../../util/Scripting'; +import { ScriptingGlobals } from '../../util/ScriptingGlobals'; +import { ScriptManager } from '../../util/ScriptManager'; +import { ContextMenu } from '../ContextMenu'; +import { ViewBoxAnnotatableComponent, ViewBoxAnnotatableProps } from '../DocComponent'; +import { EditableView } from '../EditableView'; +import { FieldView, FieldViewProps } from '../nodes/FieldView'; +import { OverlayView } from '../OverlayView'; +import { DocumentIconContainer } from './DocumentIcon'; +import './ScriptingBox.scss'; +const _global = (window /* browser */ || global) /* node */ as any; @observer export class ScriptingBox extends ViewBoxAnnotatableComponent() { - private dropDisposer?: DragManager.DragDropDisposer; protected _multiTouchDisposer?: InteractionUtils.MultiTouchEventDisposer | undefined; - public static LayoutString(fieldStr: string) { return FieldView.LayoutString(ScriptingBox, fieldStr); } + public static LayoutString(fieldStr: string) { + return FieldView.LayoutString(ScriptingBox, fieldStr); + } private _overlayDisposer?: () => void; private _caretPos = 0; - @observable private _errorMessage: string = ""; + @observable private _errorMessage: string = ''; @observable private _applied: boolean = false; @observable private _function: boolean = false; @observable private _spaced: boolean = false; @@ -42,12 +42,12 @@ export class ScriptingBox extends ViewBoxAnnotatableComponent p.split(":")[0].trim()); } - @computed({ keepAlive: true }) get paramsTypes() { return this.compileParams.map(p => p.split(":")[1].trim()); } - @computed({ keepAlive: true }) get rawScript() { return StrCast(this.dataDoc[this.props.fieldKey + "-rawScript"], ""); } - @computed({ keepAlive: true }) get functionName() { return StrCast(this.dataDoc[this.props.fieldKey + "-functionName"], ""); } - @computed({ keepAlive: true }) get functionDescription() { return StrCast(this.dataDoc[this.props.fieldKey + "-functionDescription"], ""); } - @computed({ keepAlive: true }) get compileParams() { return Cast(this.dataDoc[this.props.fieldKey + "-params"], listSpec("string"), []); } + @computed({ keepAlive: true }) get paramsNames() { + return this.compileParams.map(p => p.split(':')[0].trim()); + } + @computed({ keepAlive: true }) get paramsTypes() { + return this.compileParams.map(p => p.split(':')[1].trim()); + } + @computed({ keepAlive: true }) get rawScript() { + return StrCast(this.dataDoc[this.props.fieldKey + '-rawScript'], ''); + } + @computed({ keepAlive: true }) get functionName() { + return StrCast(this.dataDoc[this.props.fieldKey + '-functionName'], ''); + } + @computed({ keepAlive: true }) get functionDescription() { + return StrCast(this.dataDoc[this.props.fieldKey + '-functionDescription'], ''); + } + @computed({ keepAlive: true }) get compileParams() { + return Cast(this.dataDoc[this.props.fieldKey + '-params'], listSpec('string'), []); + } - set rawScript(value) { this.dataDoc[this.props.fieldKey + "-rawScript"] = value; } - set functionName(value) { this.dataDoc[this.props.fieldKey + "-functionName"] = value; } - set functionDescription(value) { this.dataDoc[this.props.fieldKey + "-functionDescription"] = value; } + set rawScript(value) { + this.dataDoc[this.props.fieldKey + '-rawScript'] = value; + } + set functionName(value) { + this.dataDoc[this.props.fieldKey + '-functionName'] = value; + } + set functionDescription(value) { + this.dataDoc[this.props.fieldKey + '-functionDescription'] = value; + } - set compileParams(value) { this.dataDoc[this.props.fieldKey + "-params"] = new List(value); } + set compileParams(value) { + this.dataDoc[this.props.fieldKey + '-params'] = new List(value); + } getValue(result: any, descrip: boolean) { - if (typeof result === "object") { + if (typeof result === 'object') { const text = descrip ? result[1] : result[2]; - return text !== undefined ? text : ""; + return text !== undefined ? text : ''; } else { - return ""; + return ''; } } @@ -89,17 +109,19 @@ export class ScriptingBox extends ViewBoxAnnotatableComponent { - const area = document.querySelector('textarea'); - if (area) { - for (const { } of entries) { - const getCaretCoordinates = require('textarea-caret'); - const caret = getCaretCoordinates(area, this._selection); - this.resetSuggestionPos(caret); + const observer = new _global.ResizeObserver( + action((entries: any) => { + const area = document.querySelector('textarea'); + if (area) { + for (const {} of entries) { + const getCaretCoordinates = require('textarea-caret'); + const caret = getCaretCoordinates(area, this._selection); + this.resetSuggestionPos(caret); + } } - } - })); - observer.observe(document.getElementsByClassName("scriptingBox")[0]); + }) + ); + observer.observe(document.getElementsByClassName('scriptingBox')[0]); } @action @@ -110,8 +132,8 @@ export class ScriptingBox extends ViewBoxAnnotatableComponent (x + scriptWidth)) { - const diff = (left + suggestionWidth) - (x + scriptWidth); + if (left + suggestionWidth > x + scriptWidth) { + const diff = left + suggestionWidth - (x + scriptWidth); left = left - diff; } @@ -123,52 +145,53 @@ export class ScriptingBox extends ViewBoxAnnotatableComponent void) => { //used for stacking and masonry view + protected createDashEventsTarget = (ele: HTMLDivElement, dropFunc: (e: Event, de: DragManager.DropEvent) => void) => { + //used for stacking and masonry view if (ele) { this.dropDisposer?.(); this.dropDisposer = DragManager.MakeDropTarget(ele, dropFunc, this.layoutDoc); } - } + }; // only included in buttons, transforms scripting UI to a button @action onFinish = () => { - this.rootDoc.layoutKey = "layout"; - } + this.rootDoc.layoutKey = 'layout'; + }; // displays error message @action onError = (error: any) => { - this._errorMessage = error?.message ? error.message : error?.map((entry: any) => entry.messageText).join(" ") || ""; - } + this._errorMessage = error?.message ? error.message : error?.map((entry: any) => entry.messageText).join(' ') || ''; + }; // checks if the script compiles using CompileScript method and inputting params @action onCompile = () => { const params: ScriptParam = {}; - this.compileParams.forEach(p => params[p.split(":")[0].trim()] = p.split(":")[1].trim()); + this.compileParams.forEach(p => (params[p.split(':')[0].trim()] = p.split(':')[1].trim())); const result = CompileScript(this.rawScript, { editable: true, transformer: DocumentIconContainer.getTransformer(), params, - typecheck: false + typecheck: false, }); this.dataDoc[this.fieldKey] = result.compiled ? new ScriptField(result) : undefined; this.onError(result.compiled ? undefined : result.errors); return result.compiled; - } + }; // checks if the script compiles and then runs the script @action onRun = () => { if (this.onCompile()) { const bindings: { [name: string]: any } = {}; - this.paramsNames.forEach(key => bindings[key] = this.dataDoc[key]); + this.paramsNames.forEach(key => (bindings[key] = this.dataDoc[key])); // binds vars so user doesnt have to refer to everything as self. ScriptCast(this.dataDoc[this.fieldKey], null)?.script.run({ self: this.rootDoc, this: this.layoutDoc, ...bindings }, this.onError); } - } + }; // checks if the script compiles and switches to applied UI @action @@ -176,39 +199,39 @@ export class ScriptingBox extends ViewBoxAnnotatableComponent { - this._errorMessage = ""; + this._errorMessage = ''; this._applied = false; this._function = false; - } + }; @action onSave = () => { if (this.onCompile()) { this._function = true; } else { - this._errorMessage = "Can not save script, does not compile"; + this._errorMessage = 'Can not save script, does not compile'; } - } + }; @action onCreate = () => { - this._errorMessage = ""; + this._errorMessage = ''; if (this.functionName.length === 0) { - this._errorMessage = "Must enter a function name"; + this._errorMessage = 'Must enter a function name'; return false; } - if (this.functionName.indexOf(" ") > 0) { - this._errorMessage = "Name can not include spaces"; + if (this.functionName.indexOf(' ') > 0) { + this._errorMessage = 'Name can not include spaces'; return false; } - if (this.functionName.indexOf(".") > 0) { + if (this.functionName.indexOf('.') > 0) { this._errorMessage = "Name can not include '.'"; return false; } @@ -223,173 +246,184 @@ export class ScriptingBox extends ViewBoxAnnotatableComponent { this._overlayDisposer?.(); this._overlayDisposer = OverlayView.Instance.addElement(, { x: 0, y: 0 }); - } + }; // sets field of the corresponding field key (param name) to be dropped document @action onDrop = (e: Event, de: DragManager.DropEvent, fieldKey: string) => { this.dataDoc[fieldKey] = de.complete.docDragData?.droppedDocuments[0]; e.stopPropagation(); - } + }; - // deletes a param from all areas in which it is stored + // deletes a param from all areas in which it is stored @action onDelete = (num: number) => { this.dataDoc[this.paramsNames[num]] = undefined; this.compileParams.splice(num, 1); return true; - } + }; // sets field of the param name to the selected value in drop down box @action viewChanged = (e: React.ChangeEvent, name: string) => { //@ts-ignore const val = e.target.selectedOptions[0].value; - this.dataDoc[name] = val[0] === "S" ? val.substring(1) : val[0] === "N" ? parseInt(val.substring(1)) : val.substring(1) === "true"; - } + this.dataDoc[name] = val[0] === 'S' ? val.substring(1) : val[0] === 'N' ? parseInt(val.substring(1)) : val.substring(1) === 'true'; + }; // creates a copy of the script document onCopy = () => { const copy = Doc.MakeCopy(this.rootDoc, true); copy.x = NumCast(this.dataDoc.x) + NumCast(this.dataDoc._width); this.props.addDocument?.(copy); - } + }; // adds option to create a copy to the context menu specificContextMenu = (): void => { - const existingOptions = ContextMenu.Instance.findByDescription("Options..."); - const options = existingOptions && "subitems" in existingOptions ? existingOptions.subitems : []; - options.push({ description: "Create a Copy", event: this.onCopy, icon: "copy" }); - !existingOptions && ContextMenu.Instance.addItem({ description: "Options...", subitems: options, icon: "hand-point-right" }); - } + const existingOptions = ContextMenu.Instance.findByDescription('Options...'); + const options = existingOptions && 'subitems' in existingOptions ? existingOptions.subitems : []; + options.push({ description: 'Create a Copy', event: this.onCopy, icon: 'copy' }); + !existingOptions && ContextMenu.Instance.addItem({ description: 'Options...', subitems: options, icon: 'hand-point-right' }); + }; renderFunctionInputs() { - const descriptionInput = -