tungsten 0.3.3 → 0.3.5

package/dist/componentProxyHandlers.js

@@ -1,5 +1,6 @@
 import { KeyIsArrayMutatingFunction, KeyIsMapMutatingFunction, KeyIsSetMutatingFunction } from "./mutatingFunctions.js";
 import { objectTypesToProxy } from "./objectTypesToProxy.js";
+import { markChanged } from "./stateTracking.js";
 export const $original = Symbol('original');
 export const $ownerName = Symbol('ownerName');
 export const getStateProxyHandler = element => ({
@@ -44,23 +45,25 @@ export const getStateProxyHandler = element => ({
     }
     //const varKey = key
     //this.__reactiveUpdate(varKey)
+    markChanged(obj); // stamp for the props dirty check
     if (element.__initialized) element.__stateUpdated();
     return true;
   },
   deleteProperty: (obj, key) => {
     if (key in obj) {
       delete obj[key]; // we know key is in obj
+      markChanged(obj); // stamp for the props dirty check
       if (element.__initialized) element.__stateUpdated();
     }
     return true;
   },
   has(obj, key) {
-    if (key === $original || key === $ownerName) return true;
+    if (key === $original || key === '__original' || key === $ownerName) return true;
     return key in obj;
   }
 });
 // intercept get sna dsets within state objects to proxy child objects and trigger component updates
-export const getStateObjectProxyHandler = element => ({
+const makeStateObjectProxyHandler = element => ({
   get: (obj, key) => {
     if (key === '__original') return obj; // return the internal object if requested
     if (key === $original) return obj; // return the internal object if requested
@@ -100,23 +103,46 @@ export const getStateObjectProxyHandler = element => ({
     }
     //const varKey = key
     //this.__reactiveUpdate(varKey)
+    markChanged(obj); // stamp for the props dirty check
     if (element.__initialized) element.__stateUpdated();
     return true;
   },
   deleteProperty: (obj, key) => {
     if (key in obj) {
       delete obj[key]; // we know key is in obj
+      markChanged(obj); // stamp for the props dirty check
       if (element.__initialized) element.__stateUpdated();
     }
     return true;
   },
   has(obj, key) {
-    if (key === $original || key === $ownerName) return true;
+    if (key === $original || key === '__original' || key === $ownerName) return true;
     return key in obj;
   }
 });
+/**
+ * Proxy handlers are shared per component rather than rebuilt per proxied object.
+ *
+ * Each handler closes over `element` and nothing else, so one instance can serve every
+ * object that component proxies. They were previously built fresh for each object -- a new
+ * literal plus a new closure for every trap -- which for a 50,000 row list meant tens of
+ * thousands of handlers: 12% of the update in the factory itself, plus the GC that
+ * followed. A WeakMap keyed on the component keeps this tied to the component's lifetime.
+ */
+function perElement(build) {
+  const cache = new WeakMap();
+  return element => {
+    const existing = cache.get(element);
+    if (existing !== undefined) return existing;
+    const created = build(element);
+    cache.set(element, created);
+    return created;
+  };
+}
+const getStateObjectProxyHandlerCached = perElement(makeStateObjectProxyHandler);
+export const getStateObjectProxyHandler = element => getStateObjectProxyHandlerCached(element); // eslint-disable-line no-type-assertion/no-type-assertion -- the generic only types the trap parameters; the handler itself is identical for every O
 // intercept calls to array prototype funcs that mutate the array, to trigger an update
-export const getStateArrayProxyHandler = element => {
+const makeStateArrayProxyHandler = element => {
   const set = (arr, key, value) => {
     //console.log('set in proxied array', arr, key)
     //if (typeof key === 'string') {
@@ -142,6 +168,7 @@ export const getStateArrayProxyHandler = element => {
     //const varKey = key
     //warn('__stateArrayProxyHandler set __reactiveUpdate key may overlap between strings and numbers')
     //this.__reactiveUpdate(String(varKey))
+    markChanged(arr); // stamp for the props dirty check
     if (element.__initialized) element.__stateUpdated();
     return true;
   };
@@ -171,6 +198,7 @@ export const getStateArrayProxyHandler = element => {
             // reactivity
             //const varKey = key
             //this.__reactiveUpdate(varKey)
+            markChanged(arr); // stamp for the props dirty check
             if (element.__initialized) element.__stateUpdated();
           };
         }
@@ -180,7 +208,7 @@ export const getStateArrayProxyHandler = element => {
     },
     set,
     has(arr, key) {
-      if (key === $original || key === $ownerName) return true;
+      if (key === $original || key === '__original' || key === $ownerName) return true;
       return key in arr;
     },
     deleteProperty(arr, key) {
@@ -188,14 +216,16 @@ export const getStateArrayProxyHandler = element => {
       const res = delete arr[key]; // eslint-disable-line no-type-assertion/no-type-assertion
       if (element.__initialized) {
         //console.log('proxy delete update')
+        markChanged(arr); // stamp for the props dirty check
         element.__stateUpdated();
       }
       return res;
     }
   };
 };
+export const getStateArrayProxyHandler = perElement(makeStateArrayProxyHandler);
 // intercept calls to array prototype funcs that mutate the array, to trigger an update
-export const getStateMapProxyHandler = element => ({
+const makeStateMapProxyHandler = element => ({
   get: (map, key) => {
     //console.log('map get', key)
     if (key === $original) return map; // return the internal object if requested
@@ -215,6 +245,7 @@ export const getStateMapProxyHandler = element => ({
             // reactivity
             //const varKey = key
             //this.__reactiveUpdate(varKey)
+            markChanged(map); // stamp for the props dirty check
             if (element.__initialized) element.__stateUpdated();
           };
         } else {
@@ -226,6 +257,7 @@ export const getStateMapProxyHandler = element => ({
             // reactivity
             //const varKey = key
             //this.__reactiveUpdate(varKey)
+            markChanged(map); // stamp for the props dirty check
             if (element.__initialized) element.__stateUpdated();
           };
         }
@@ -240,12 +272,13 @@ export const getStateMapProxyHandler = element => ({
     // return map[key]
   },
   has(map, key) {
-    if (key === $original || key === $ownerName) return true;
+    if (key === $original || key === '__original' || key === $ownerName) return true;
     return key in map;
   }
 });
+export const getStateMapProxyHandler = perElement(makeStateMapProxyHandler);
 // intercept calls to array prototype funcs that mutate the array, to trigger an update
-export const getStateSetProxyHandler = element => ({
+const makeStateSetProxyHandler = element => ({
   get: (set, key) => {
     //console.log('arr key', typeof key)
     if (key === $original) return set; // return the internal object if requested
@@ -264,6 +297,7 @@ export const getStateSetProxyHandler = element => ({
             // reactivity
             //const varKey = key
             //this.__reactiveUpdate(varKey)
+            markChanged(set); // stamp for the props dirty check
             if (element.__initialized) element.__stateUpdated();
           };
         } else {
@@ -275,6 +309,7 @@ export const getStateSetProxyHandler = element => ({
             // reactivity
             //const varKey = key
             //this.__reactiveUpdate(varKey)
+            markChanged(set); // stamp for the props dirty check
             if (element.__initialized) element.__stateUpdated();
           };
         }
@@ -286,10 +321,11 @@ export const getStateSetProxyHandler = element => ({
     return v;
   },
   has(set, key) {
-    if (key === $original || key === $ownerName) return true;
+    if (key === $original || key === '__original' || key === $ownerName) return true;
     return key in set;
   }
 });
+export const getStateSetProxyHandler = perElement(makeStateSetProxyHandler);
 // export function proxyStateContent<O extends object>(element: StatefulComponentAny, object: O) {
 //     for (const key in object) {
 //         const value = object[key]

package/dist/components/GoToComponent.d.ts

@@ -1,4 +1,4 @@
-import { TungstenSimpleComponent } from '../Components.js';
+import { TungstenSimpleComponent } from '../Components.jsx';
 import type { RouteKey } from '../routing/RouteTypes.js';
 type Props = {
     to: RouteKey;

package/dist/components/GoToComponent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"GoToComponent.d.ts","sourceRoot":"","sources":["../../src/components/GoToComponent.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,uBAAuB,EAAE,MAAM,kBAAkB,CAAA;AAC1D,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,0BAA0B,CAAA;AAExD,KAAK,KAAK,GAAG;IACT,EAAE,EAAE,QAAQ,CAAA;CACf,CAAA;AACD,qBAAa,IAAK,SAAQ,uBAAuB,CAAC,KAAK,CAAC;IACpD,OAAO,aAGN;CACJ"}
+{"version":3,"file":"GoToComponent.d.ts","sourceRoot":"","sources":["../../src/components/GoToComponent.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,uBAAuB,EAAE,MAAM,mBAAmB,CAAA;AAC3D,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,0BAA0B,CAAA;AAExD,KAAK,KAAK,GAAG;IACT,EAAE,EAAE,QAAQ,CAAA;CACf,CAAA;AACD,qBAAa,IAAK,SAAQ,uBAAuB,CAAC,KAAK,CAAC;IACpD,OAAO,aAGN;CACJ"}

package/dist/components/_GoToComponent.d.ts

@@ -0,0 +1,10 @@
+import { TungstenSimpleComponent } from '../Components.jsx';
+import type { RouteKey } from '../routing/RouteTypes.js';
+type Props = {
+    to: RouteKey;
+};
+export declare class GoTo extends TungstenSimpleComponent<Props> {
+    content: () => null;
+}
+export {};
+//# sourceMappingURL=_GoToComponent.d.ts.map

package/dist/components/_GoToComponent.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"_GoToComponent.d.ts","sourceRoot":"","sources":["../../src/components/_GoToComponent.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,uBAAuB,EAAE,MAAM,mBAAmB,CAAA;AAC3D,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,0BAA0B,CAAA;AAExD,KAAK,KAAK,GAAG;IACT,EAAE,EAAE,QAAQ,CAAA;CACf,CAAA;AACD,qBAAa,IAAK,SAAQ,uBAAuB,CAAC,KAAK,CAAC;IACpD,OAAO,aAGN;CACJ"}

package/dist/components/_GoToComponent.js

@@ -0,0 +1,13 @@
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import { TungstenSimpleComponent } from "../Components.js";
+export class GoTo extends TungstenSimpleComponent {
+  constructor(...args) {
+    super(...args);
+    _defineProperty(this, "content", () => {
+      this.__instance.goto(this.props.to);
+      return null;
+    });
+  }
+}

package/dist/components/library/RichTextEditor/RichTextEditor.d.ts

@@ -0,0 +1,50 @@
+import { TungstenStatefulComponent } from '../../../Components.jsx';
+import type { TypedBindVariable } from '../../bindable/BindVariable.js';
+import type { ExtendedChangeEvent, ExtendedClipboardEvent, ExtendedFormEvent, ExtendedKeyboardEvent, ExtendedMouseEvent } from '../../../../types/jsx/html.events.js';
+declare const trackedCommands: readonly ["bold", "italic", "underline", "strikeThrough", "subscript", "superscript", "insertUnorderedList", "insertOrderedList"];
+type TrackedCommand = (typeof trackedCommands)[number];
+type Props<TreeO extends object, TreeK extends keyof TreeO, HtmlO extends object, HtmlK extends keyof HtmlO> = {
+    className?: string;
+    name?: string;
+    placeholder?: string;
+    treeBind: TypedBindVariable<TreeO, TreeK>;
+    htmlBind: TypedBindVariable<HtmlO, HtmlK>;
+    recordKey?: string | number;
+};
+type State = {
+    initialHtml: string;
+    sourceMode: boolean;
+    sourceDraft: string;
+    active: ReadonlySet<TrackedCommand>;
+    blockFormat: string;
+    loadedRecordKey: string | number | undefined;
+};
+export declare class RichTextEditor<TreeO extends object, TreeK extends keyof TreeO, HtmlO extends object, HtmlK extends keyof HtmlO> extends TungstenStatefulComponent<Props<TreeO, TreeK, HtmlO, HtmlK>, State> {
+    state: State;
+    surfaceRef: import("../../../createRef.js").TungstenElementRef<HTMLDivElement>;
+    sourceRef: import("../../../createRef.js").TungstenElementRef<HTMLTextAreaElement>;
+    componentDidUpdate: () => void;
+    ownerDocument: () => Document | null;
+    commitSurface: () => void;
+    savedRange: Range | null;
+    captureSelection: () => void;
+    restoreSelection: () => void;
+    selectionChanged: () => void;
+    refreshFormatState: () => void;
+    exec: (command: string, value?: string) => void;
+    preventFocusLoss: (event: ExtendedMouseEvent<HTMLButtonElement>) => void;
+    changeFormatBlock: (event: ExtendedChangeEvent<HTMLSelectElement>) => void;
+    insertLink: () => void;
+    removeLink: () => void;
+    clearFormatting: () => void;
+    undo: () => void;
+    redo: () => void;
+    handleKeyDown: (event: ExtendedKeyboardEvent<HTMLDivElement>) => void;
+    handlePaste: (event: ExtendedClipboardEvent<HTMLDivElement>) => void;
+    toggleSource: () => void;
+    changeSourceDraft: (event: ExtendedFormEvent<HTMLTextAreaElement>) => void;
+    content: ({ className, name, placeholder }: Props<TreeO, TreeK, HtmlO, HtmlK>, state: State) => import("../../../ContentNode.js").ContentNode;
+    style: import("../../../CssNames.js").CssNames;
+}
+export {};
+//# sourceMappingURL=RichTextEditor.d.ts.map

package/dist/components/library/RichTextEditor/RichTextEditor.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RichTextEditor.d.ts","sourceRoot":"","sources":["../../../../src/components/library/RichTextEditor/RichTextEditor.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,yBAAyB,EAAE,MAAM,yBAAyB,CAAA;AACnE,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAA;AAKvE,OAAO,KAAK,EACR,mBAAmB,EAAE,sBAAsB,EAAE,iBAAiB,EAAE,qBAAqB,EAAE,kBAAkB,EAC5G,MAAM,sCAAsC,CAAA;AAyB7C,QAAA,MAAM,eAAe,mIAGX,CAAA;AACV,KAAK,cAAc,GAAG,CAAC,OAAO,eAAe,CAAC,CAAC,MAAM,CAAC,CAAA;AAyCtD,KAAK,KAAK,CAAC,KAAK,SAAS,MAAM,EAAE,KAAK,SAAS,MAAM,KAAK,EAAE,KAAK,SAAS,MAAM,EAAE,KAAK,SAAS,MAAM,KAAK,IAAI;IAC3G,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,WAAW,CAAC,EAAE,MAAM,CAAA;IAGpB,QAAQ,EAAE,iBAAiB,CAAC,KAAK,EAAE,KAAK,CAAC,CAAA;IAGzC,QAAQ,EAAE,iBAAiB,CAAC,KAAK,EAAE,KAAK,CAAC,CAAA;IAOzC,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;CAC9B,CAAA;AAED,KAAK,KAAK,GAAG;IAUT,WAAW,EAAE,MAAM,CAAA;IACnB,UAAU,EAAE,OAAO,CAAA;IACnB,WAAW,EAAE,MAAM,CAAA;IACnB,MAAM,EAAE,WAAW,CAAC,cAAc,CAAC,CAAA;IAGnC,WAAW,EAAE,MAAM,CAAA;IAGnB,eAAe,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,CAAA;CAC/C,CAAA;AAED,qBAAa,cAAc,CACvB,KAAK,SAAS,MAAM,EAAE,KAAK,SAAS,MAAM,KAAK,EAAE,KAAK,SAAS,MAAM,EAAE,KAAK,SAAS,MAAM,KAAK,CAClG,SAAQ,yBAAyB,CAAC,KAAK,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC,EAAE,KAAK,CAAC;IACzE,KAAK,EAAE,KAAK,CAOX;IAED,UAAU,qEAAqC;IAC/C,SAAS,0EAA0C;IAUnD,kBAAkB,aAWjB;IAOD,aAAa,QAAO,QAAQ,GAAG,IAAI,CACwD;IAiB3F,aAAa,aAMZ;IAOD,UAAU,EAAE,KAAK,GAAG,IAAI,CAAO;IAE/B,gBAAgB,aAWf;IAED,gBAAgB,aAKf;IAID,gBAAgB,aAGf;IAQD,kBAAkB,aAYjB;IAED,IAAI,GAAI,SAAS,MAAM,EAAE,QAAQ,MAAM,UAStC;IASD,gBAAgB,GAAI,OAAO,kBAAkB,CAAC,iBAAiB,CAAC,UAE/D;IAED,iBAAiB,GAAI,OAAO,mBAAmB,CAAC,iBAAiB,CAAC,UAOjE;IAED,UAAU,aAMT;IAED,UAAU,aAA4B;IACtC,eAAe,aAAkC;IACjD,IAAI,aAA0B;IAC9B,IAAI,aAA0B;IAQ9B,aAAa,GAAI,OAAO,qBAAqB,CAAC,cAAc,CAAC,UAS5D;IAED,WAAW,GAAI,OAAO,sBAAsB,CAAC,cAAc,CAAC,UAS3D;IAED,YAAY,aAaX;IAED,iBAAiB,GAAI,OAAO,iBAAiB,CAAC,mBAAmB,CAAC,UAEjE;IAED,OAAO,GAAI,kCAAkC,KAAK,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC,EAAE,OAAO,KAAK,mDAyElF;IAEV,KAAK,0CA8FJ;CACJ"}