tungsten 0.1.72 → 0.2.0

package/dist/Components.js

@@ -1,923 +0,0 @@
-function _classPrivateFieldInitSpec(e, t, a) { _checkPrivateRedeclaration(e, t), t.set(e, a); }
-function _checkPrivateRedeclaration(e, t) { if (t.has(e)) throw new TypeError("Cannot initialize the same private elements twice on an object"); }
-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 { Store } from './Store/Store.js'
-//import { createStoreProxy } from './Store/createStoreProxy.js'
-import { styleContent } from "./style/styleContent.js";
-import { TungstenError } from "./TungstenError.js";
-//import { integrateUpdate } from './update/integrateUpdate.js'
-import { integrateElementUpdateVdom } from "./update/integrateUpdateVdom.js";
-import { objectTypesToCopy } from "./objectTypesToCopy.js";
-import { isClient } from "./isClient.js";
-import { isServer } from "./isServer.js";
-//import { warn } from './output.js'
-function debug(...texts) {
-  //console.log(...texts)
-  //console.log(getStackTrace().split('\n')[2])
-}
-function elementDelete() {
-  //console.log('basic delete code')
-  //console.log('this', this)
-  if (typeof this.componentWillUnmount === 'function') this.componentWillUnmount();
-  if (typeof this._deleting === 'function') this._deleting();
-  //console.log('this.__disposables', this.__disposables)
-  this.__disposables?.forEach(d => {
-    //console.log(' try to dispose', d)
-    d[Symbol.dispose]();
-  });
-  //this.__dead = true
-}
-let __testing_tci = 0;
-//export type TungstenComponentType = 'redirect'
-var _reactives = /*#__PURE__*/new WeakMap();
-var _reactivityChart = /*#__PURE__*/new WeakMap();
-export class TungstenBaseComponent {
-  constructor(pkg) {
-    _defineProperty(this, "__testing_tci", __testing_tci++);
-    //__tungstenComponentType?: TungstenComponentType
-    _defineProperty(this, "__instance", void 0);
-    _defineProperty(this, "__domRegion", void 0);
-    _defineProperty(this, "parentComponent", void 0);
-    _defineProperty(this, "childComponents", []);
-    _defineProperty(this, "props", void 0);
-    _defineProperty(this, "routeParams", void 0);
-    _defineProperty(this, "routeData", void 0);
-    _defineProperty(this, "storeData", void 0);
-    // serverInit
-    _defineProperty(this, "title", void 0);
-    //styles?: TaggedTemplateExpression
-    _defineProperty(this, "style", void 0);
-    _defineProperty(this, "__queuedUpdateHandle", void 0);
-    _defineProperty(this, "__initialized", false);
-    _classPrivateFieldInitSpec(this, _reactives, {});
-    _classPrivateFieldInitSpec(this, _reactivityChart, {});
-    _defineProperty(this, "__currentContent", $contentNull);
-    // is this a problem, because undefined could be a result of content func?
-    _defineProperty(this, "__dead", false);
-    // lifecycle hooks
-    // render?
-    // content?
-    _defineProperty(this, "content", void 0);
-    _defineProperty(this, "render", void 0);
-    //abstract __newUpdateCompleted: (props: Props, state: any) => void | (() => void)
-    _defineProperty(this, "componentDidMount", void 0);
-    _defineProperty(this, "_mounted", void 0);
-    _defineProperty(this, "componentDidHydrate", void 0);
-    _defineProperty(this, "_hydrated", void 0);
-    _defineProperty(this, "componentWillUnmount", void 0);
-    _defineProperty(this, "_deleting", void 0);
-    _defineProperty(this, "componentDidUnmount", void 0);
-    _defineProperty(this, "_deleted", void 0);
-    //shouldComponentUpdate?: (nextProps: unknown, nextState: unknown) => boolean
-    // disable this because static methods don't play nicely with generics 
-    // static getDerivedStateFromProps?: (props: Props, state: State) => void | ((props: Props) => any) | (() => any)
-    _defineProperty(this, "shouldStoreComponentUpdate", void 0);
-    _defineProperty(this, "__queueUpdate", () => {
-      //console.log('queue update')
-      if (this.__queuedUpdateHandle === undefined) {
-        this.__queuedUpdateHandle = setTimeout(() => {
-          this.__update();
-        }, 0);
-      }
-    });
-    _defineProperty(this, "triggerUpdate", () => {
-      //console.log('trigger update')
-      return this.__update();
-    });
-    _defineProperty(this, "reactive", code => {
-      // dummy func
-    });
-    // !!! needs checking
-    _defineProperty(this, "__didMount", () => {
-      if (typeof this.componentDidMount === 'function') this.componentDidMount();
-      if (typeof this._mounted === 'function') this._mounted();
-      this.__didRender();
-    });
-    // !!! needs checking
-    _defineProperty(this, "__didHydrate", () => {
-      this.__didMount();
-      if (typeof this.componentDidHydrate === 'function') this.componentDidHydrate();
-      if (typeof this._hydrated === 'function') this._hydrated();
-    });
-    // _preDelete = () => {
-    //     if (typeof this.componentDidHydrate === 'function') this.componentDidHydrate()
-    // }
-    _defineProperty(this, "__delete", elementDelete.bind(this));
-    // __delete = () => {
-    //     if (typeof this.componentWillUnmount === 'function') this.componentWillUnmount()
-    //     if (typeof this._deleting === 'function') this._deleting()
-    //     this.__disposables?.forEach( (d: Disposable) => d[Symbol.dispose]())
-    //     // deleting content is handled by the update code
-    // }
-    _defineProperty(this, "__deleted", () => {
-      //console.log(`marking ${this.constructor.name} TCI ${this.tci} as dead`)
-      this.__dead = true; // sanity checking, not essential
-      if (typeof this.componentDidUnmount === 'function') this.componentDidUnmount();
-      if (typeof this._deleted === 'function') this._deleted();
-    });
-    _defineProperty(this, "delayed", (func, delay = 0) => setTimeout(func, delay));
-    // eslint-disable-line @typescript-eslint/ban-types -- Function seems fine
-    _defineProperty(this, "pickProps", (...keys) => {
-      return objects.pick(this.props, ...keys);
-    });
-    // #timeouts: number[] = []
-    // #intervals: number[] = []
-    // addTimeout(func: Function, ms: number) {
-    //     const h = setTimeout(func, ms)
-    //     return h
-    // }
-    // addInterval(func: Function, ms: number) {
-    //     const h = setInterval(func, ms)
-    //     return h
-    // }
-    _defineProperty(this, "__disposables", void 0);
-    _defineProperty(this, "using", (d, callback) => {
-      //console.log('using d', d)
-      const ds = this.__disposables || (this.__disposables = new Set());
-      // let ds = this.__disposables
-      // if (!ds) this.__disposables = ds = new Set
-      // let ds = this.__disposables
-      // if (!ds) this.__disposables = ds = new Set
-      ds.add(d);
-      //console.log('disps', ds)
-      if (callback) callback(d);
-      //console.log('disps 2', this.__disposables)
-      //console.log('this', this)
-      return d;
-    });
-    const {
-      props,
-      routeParams,
-      routeData,
-      instance,
-      parentElement: parentComponent
-    } = pkg;
-    this.__instance = instance;
-    this.props = props;
-    this.routeParams = routeParams;
-    this.routeData = routeData;
-    this.parentComponent = parentComponent;
-    // re-add any overwritten render or content methods
-    // damn Typescript grrr
-    //
-    // better explanation of what this is, is needed
-    const proto = Object.getPrototypeOf(this);
-    const propertyNames = Object.getOwnPropertyNames(proto);
-    for (const p of propertyNames) {
-      switch (p) {
-        case 'render':
-        case 'content':
-          {
-            this[p] = proto[p].bind(this);
-          }
-      }
-    }
-  }
-  get globalData() {
-    return this.__instance.globalData;
-  }
-}
-_defineProperty(TungstenBaseComponent, "tagName", void 0);
-_defineProperty(TungstenBaseComponent, "displayName", void 0);
-export class TungstenSimpleComponent extends TungstenBaseComponent {
-  constructor(...args) {
-    super(...args);
-    _defineProperty(this, "state", void 0);
-    _defineProperty(this, "init", void 0);
-    _defineProperty(this, "clientInit", void 0);
-    _defineProperty(this, "serverInit", void 0);
-    _defineProperty(this, "componentDidUpdate", void 0);
-    // ignore arg 3 for now:   , snapshot: unknown
-    _defineProperty(this, "_updated", void 0);
-    // ignore arg 3 for now:   , snapshot: unknown
-    _defineProperty(this, "componentDidRender", void 0);
-    _defineProperty(this, "_rendered", void 0);
-    _defineProperty(this, "__init", async /*instance: Instance*/ () => {
-      if (typeof this.init === 'function') {
-        // this first check isn't needed with how TS currently emits, but leaving it there to be safe
-        await this.init(this.props);
-        //(this.state !== undefined) ? this.init(this.props, this.state) : this.init(this.props, {})
-      }
-      if (isClient && typeof this.clientInit === 'function') {
-        await this.clientInit(this.props);
-        //(this.state !== undefined) ? this.clientInit(this.props, this.state) : this.clientInit(this.props, {})
-      }
-      if (isServer && typeof this.serverInit === 'function') {
-        await this.serverInit(this.props);
-        //(this.state !== undefined) ? this.serverInit(this.props, this.state) : this.serverInit(this.props, {})
-      }
-      this.__handleTitle();
-      this.__initialized = true;
-    });
-    // !!! needs checking
-    // a func to manage the initial render, and call componentDidMount
-    // !! Only used during hydration and updates
-    _defineProperty(this, "__initialContent", () => {
-      //console.log('initial content', this.constructor.name)
-      const styledContentPromise = this.__styledContent();
-      // // if there is a componentDidMount func, queue this up to trigger after styled content is loaded
-      // // should we trigger this at a different time - such as after render/hydration? -- probably 
-      // styledContentPromise.then( () => {
-      //     if (typeof this.componentDidMount === 'function') this.componentDidMount()
-      //     if (typeof this._mounted === 'function') this._mounted()
-      //     if (typeof this.componentDidRender === 'function') {
-      //         this.componentDidRender(this.props)
-      //     }
-      //     if (typeof this._rendered === 'function') {
-      //         this._rendered(this.props)
-      //     }
-      // })
-      //console.log(`A ${this.constructor.name} TCI ${this.tci} is providing initial content`)
-      return styledContentPromise;
-    });
-    _defineProperty(this, "__update", async () => {
-      // how do we handle dom pointer index incrementing when being called by another component?
-      // maybe we pass back information, possibly the rendered content?
-      debug(`Simple Component '${this.constructor.name}' is updating`);
-      if (this.__queuedUpdateHandle !== undefined) {
-        clearTimeout(this.__queuedUpdateHandle);
-        delete this.__queuedUpdateHandle;
-      }
-      // do update
-      const styledContent = await this.__styledContent();
-      debug('styledContent', styledContent, 'for', this);
-      debug('TSsC new content', styledContent);
-      //console.log(`A ${this.constructor.name} TCI ${this.tci} is updating its content`)
-      const updateResult = await integrateElementUpdateVdom(this, styledContent);
-      if (typeof this.componentDidUpdate === 'function') {
-        this.componentDidUpdate(this.props);
-      }
-      if (typeof this._updated === 'function') {
-        this._updated(this.props);
-      }
-      if (typeof this.componentDidRender === 'function') {
-        this.componentDidRender(this.props);
-      }
-      if (typeof this._rendered === 'function') {
-        this._rendered(this.props);
-      }
-      return updateResult;
-    });
-    _defineProperty(this, "__updateAndReturnContent", async () => {
-      if (this.__queuedUpdateHandle !== undefined) {
-        clearTimeout(this.__queuedUpdateHandle);
-        delete this.__queuedUpdateHandle;
-      }
-      const styledContent = await this.__styledContent();
-      const {
-        props,
-        state
-      } = this;
-      return {
-        content: styledContent,
-        complete: () => this.__newUpdateCompleted(props)
-      };
-    });
-    _defineProperty(this, "__newUpdateCompleted", props => {
-      if (typeof this.componentDidUpdate === 'function') {
-        this.componentDidUpdate(props);
-      }
-      if (typeof this._updated === 'function') {
-        this._updated(props);
-      }
-      if (typeof this.componentDidRender === 'function') {
-        this.componentDidRender(props);
-      }
-      if (typeof this._rendered === 'function') {
-        this._rendered(props);
-      }
-    });
-    _defineProperty(this, "__handleTitle", () => {
-      if (typeof this.title === 'undefined') return;
-      if (typeof this.title === 'function') {
-        this.__instance.setTitle(this.title(this.props).toString());
-        return;
-      }
-      this.__instance.setTitle(this.title.toString());
-    });
-    _defineProperty(this, "__content", async () => {
-      if (this.content === undefined) {
-        if (this.render !== undefined) return this.render(this.props);else throw new TungstenError(`${this.constructor.name} has no render or content function.`);
-      } else {
-        return await this.content(this.props);
-      }
-    });
-    _defineProperty(this, "__styledContent", async () => {
-      if (this.content === undefined && this.render !== undefined) return this.render(this.props);
-      //console.log('__styledContent checking __content')
-      const content = await this.__content();
-      if (this.style !== undefined) {
-        if (typeof this.style !== 'object') {
-          throw new TungstenError(`style property of ${this.constructor.name} is invalid.` + ' Should be a template string tagged with an accepted language name' + ', starting with an upper case letter, e.g. Sass`...styles...`.' + ` Received (${typeof this.style}) ${this.style}`);
-        }
-        const styledContent = styleContent(content, this.style);
-        //console.log(`styledContent for ${this.constructor.name}`, styledContent)
-        return styledContent;
-      } else {
-        return content;
-      }
-    });
-    _defineProperty(this, "__didUpdate", () => {
-      this.__didRender();
-      if (typeof this.componentDidUpdate === 'function') this.componentDidUpdate(this.props);
-      if (typeof this._updated === 'function') this._updated(this.props);
-    });
-    _defineProperty(this, "__didRender", () => {
-      if (typeof this.componentDidRender === 'function') this.componentDidRender(this.props);
-      if (typeof this._rendered === 'function') this._rendered(this.props);
-    });
-  }
-}
-const a = ['a', 'b'];
-const b = a.map(x => `--${x}`);
-export class TungstenComponent extends TungstenBaseComponent {
-  constructor(pkg) {
-    super(pkg);
-    _defineProperty(this, "state", void 0);
-    _defineProperty(this, "init", void 0);
-    _defineProperty(this, "clientInit", void 0);
-    _defineProperty(this, "serverInit", void 0);
-    _defineProperty(this, "componentDidUpdate", void 0);
-    // ignore arg 3 for now:   , snapshot: unknown
-    _defineProperty(this, "_updated", void 0);
-    // ignore arg 3 for now:   , snapshot: unknown
-    _defineProperty(this, "componentDidRender", void 0);
-    _defineProperty(this, "_rendered", void 0);
-    _defineProperty(this, "__init", (/*instance: Instance*/
-    ) => {
-      if (typeof window !== 'undefined' && typeof process === 'undefined' && this.state !== undefined) {
-        // eslint-disable-next-line @typescript-eslint/ban-types
-        //this.state = new Proxy<>(this.state, this.__stateProxyHandler)
-        // needs to be proxied from bottom up, might need to do more than this
-        proxyObjectContent(this, this.state);
-        this.state = new Proxy(this.state, getStateProxyHandler(this)); // eslint-disable-line no-type-assertion/no-type-assertion, @typescript-eslint/ban-types -- tell TS that state is defined
-      }
-      if (typeof this.init === 'function') {
-        // this first check isn't needed with how TS currently emits, but leaving it there to be safe
-        //(this.init as StatelessMethodHack<Props, State>)(this.props, this.state)
-        this.init(this.props, this.state);
-      }
-      if (isClient && typeof this.clientInit === 'function') {
-        //(this.clientInit as StatelessMethodHack<Props, State>)(this.props, this.state)
-        this.clientInit(this.props, this.state);
-      }
-      if (isServer && typeof this.serverInit === 'function') {
-        //(this.serverInit as StatelessMethodHack<Props, State>)(this.props, this.state)
-        this.serverInit(this.props, this.state);
-      }
-      this.__handleTitle();
-      this.__initialized = true;
-    });
-    // !!! needs checking
-    // a func to manage the initial render, and call componentDidMount
-    // !! not yet used
-    _defineProperty(this, "__initialContent", () => {
-      const styledContentPromise = this.__styledContent();
-      // if there is a componentDidMount func, queue this up to trigger after styled content is loaded
-      // don't queue it up to check unless the func already exists, for perf reasons
-      // should we trigger this at a different time - such as after render/hydration? -- probably 
-      // if (typeof this.componentDidRender === 'function') {
-      //     if (typeof this.componentDidMount === 'function') this.componentDidMount()
-      //     if (typeof this._mounted === 'function') this._mounted()
-      //     if (typeof this.componentDidRender === 'function') {
-      //         (this.componentDidRender as StatelessMethodHack<Props, State>)(this.props, this.state)
-      //     }
-      //     if (typeof this._rendered === 'function') {
-      //         (this._rendered as StatelessMethodHack<Props, State>)(this.props, this.state)
-      //     }
-      // }
-      //console.log(`A ${this.constructor.name} TCI ${this.tci} is providing initial content`)
-      return styledContentPromise;
-    });
-    _defineProperty(this, "__update", async () => {
-      debug(`TungstenComponent '${this.constructor.name}' is updating`);
-      if (this.__queuedUpdateHandle !== undefined) {
-        clearTimeout(this.__queuedUpdateHandle);
-        delete this.__queuedUpdateHandle;
-      }
-      // do update
-      const styledContent = await this.__styledContent();
-      debug(`${this.constructor.name}' styledContent`, styledContent, 'for', this);
-      //console.log(`A ${this.constructor.name} TCI ${this.tci} is updating its content`)
-      const updateResult = await integrateElementUpdateVdom(this, styledContent);
-      if (typeof this.componentDidUpdate === 'function') {
-        this.componentDidUpdate(this.props, this.state);
-      }
-      return updateResult;
-    });
-    _defineProperty(this, "__handleTitle", () => {
-      if (typeof this.title === 'undefined') return;
-      if (typeof this.title === 'function') {
-        this.__instance.setTitle(this.title(this.props, this.state).toString());
-        return;
-      }
-      this.__instance.setTitle(this.title.toString());
-    });
-    _defineProperty(this, "setState", stateUpdates => {
-      // mimic react's set state
-      // queue up an updates
-      setTimeout(() => this.__doSetState(stateUpdates), 0);
-    });
-    _defineProperty(this, "__doSetState", stateUpdates => {
-      if (stateUpdates === undefined) {
-        throw new TungstenError(`TungstenComponent __doSetState() error. State is undefined`);
-      }
-      if (this.state === undefined) {
-        throw new TungstenError(`TungstenComponent __doSetState() error. State is undefined`);
-      }
-      for (const key in stateUpdates) {
-        // @ts-ignore
-        this.state[key] = stateUpdates[key];
-      }
-    });
-    // // I think this is called by the babel'd code to trigger update when state is modified
-    // __updateState = (val: unknown): unknown => { // what is this?
-    //     this.__queueUpdate()
-    //     return val
-    // }
-    _defineProperty(this, "__stateUpdated", () => {
-      if (isDev && this.__dead) throwError('TungstenStatefulComponent.__stateUpdated', `A dead component ${this.constructor.name} received a notice that it's state has updated`);
-      this.__queueUpdate();
-    });
-    // this could be moved out of the component
-    // that would shorten references to it by not needing 'this.'
-    _defineProperty(this, "__stateCopy", item => {
-      if (typeof item !== 'object' || item === null) return item; // just return the value if it's not an object
-      if (!objectTypesToCopy.includes(item.constructor.name)) return item; // if it is not a plain object, return the original item
-      return structuredClone(item);
-    });
-    _defineProperty(this, "__content", async () => {
-      if (this.content === undefined) {
-        if (this.render !== undefined) {
-          return this.render(this.props, this.state);
-        } else throw new TungstenError(`${this.constructor.name} has no render or content function.`);
-      } else {
-        return await this.content(this.props, this.state);
-      }
-    });
-    _defineProperty(this, "__styledContent", async () => {
-      if (this.content === undefined && this.render !== undefined) return this.render(this.props, this.state);
-      //console.log('__styledContent checking __content')
-      const content = await this.__content();
-      if (this.style !== undefined) {
-        if (typeof this.style !== 'object') {
-          throw new TungstenError(`style property of ${this.constructor.name} is invalid.` + ' Should be a template string tagged with an accepted language name' + ', starting with an upper case letter, e.g. Sass`...styles...`.' + ` Received (${typeof this.style}) ${this.style}`);
-        }
-        const styledContent = styleContent(content, this.style);
-        //console.log(`styledContent for ${this.constructor.name}`, styledContent)
-        return styledContent;
-      } else {
-        return content;
-      }
-    });
-  }
-}
-_defineProperty(TungstenComponent, "tagName", void 0);
-_defineProperty(TungstenComponent, "displayName", void 0);
-export class TungstenStatefulComponent extends TungstenBaseComponent {
-  constructor(pkg) {
-    //const { props, routeParams, routeData, instance, parentComponent } = pkg
-    super(pkg);
-    _defineProperty(this, "init", void 0);
-    _defineProperty(this, "clientInit", void 0);
-    _defineProperty(this, "serverInit", void 0);
-    _defineProperty(this, "componentDidUpdate", void 0);
-    // ignore arg 3 for now:   , snapshot: unknown
-    _defineProperty(this, "_updated", void 0);
-    // ignore arg 3 for now:   , snapshot: unknown
-    _defineProperty(this, "componentDidRender", void 0);
-    _defineProperty(this, "_rendered", void 0);
-    _defineProperty(this, "__init", async /*instance: Instance*/ () => {
-      if (typeof window !== 'undefined' && typeof process === 'undefined') {
-        // needs to be proxied from bottom up, might need to do more than this
-        proxyObjectContent(this, this.state);
-        this.state = new Proxy(this.state, getStateProxyHandler(this));
-      }
-      if (typeof this.init === 'function') {
-        // this first check isn't needed with how TS currently emits, but leaving it there to be safe
-        //(this.init as StatelessMethodHack<Props, State>)(this.props, this.state)
-        await this.init(this.props, this.state);
-      }
-      if (isClient && typeof this.clientInit === 'function') {
-        //(this.clientInit as StatelessMethodHack<Props, State>)(this.props, this.state)
-        await this.clientInit(this.props, this.state);
-      }
-      if (isServer && typeof this.serverInit === 'function') {
-        //(this.serverInit as StatelessMethodHack<Props, State>)(this.props, this.state)
-        await this.serverInit(this.props, this.state);
-      }
-      this.__handleTitle();
-      this.__initialized = true;
-    });
-    // !!! needs checking
-    // a func to manage the initial render, and call componentDidMount
-    // !! not yet used
-    _defineProperty(this, "__initialContent", () => {
-      const styledContentPromise = this.__styledContent();
-      // if there is a componentDidMount func, queue this up to trigger after styled content is loaded
-      // don't queue it up to check unless the func already exists, for perf reasons
-      // should we trigger this at a different time - such as after render/hydration? -- probably 
-      // styledContentPromise.then(() => {
-      //     if (typeof this.componentDidMount === 'function') {
-      //         if (typeof this.componentDidMount === 'function') this.componentDidMount()
-      //     }
-      //     if (typeof this._mounted === 'function') {
-      //         if (typeof this._mounted === 'function') this._mounted()
-      //     }
-      //     if (typeof this.componentDidRender === 'function') {
-      //         this.componentDidRender(this.props, this.state)
-      //     }
-      //     if (typeof this._rendered === 'function') {
-      //         this._rendered(this.props, this.state)
-      //     }
-      // })
-      //console.log(`A ${this.constructor.name} TCI ${this.tci} is providing initial content`)
-      return styledContentPromise;
-    });
-    _defineProperty(this, "__update", async () => {
-      debug(`Stateful Component ${this.constructor.name} is updating`);
-      if (this.__queuedUpdateHandle !== undefined) {
-        clearTimeout(this.__queuedUpdateHandle);
-        delete this.__queuedUpdateHandle;
-      }
-      // do update
-      const styledContent = await this.__styledContent();
-      debug('styledContent', styledContent, 'for', this);
-      //console.log(`A ${this.constructor.name} TCI ${this.tci} is updating its content`)
-      const updateResult = await integrateElementUpdateVdom(this, styledContent);
-      if (typeof this.componentDidUpdate === 'function') {
-        this.componentDidUpdate(this.props, this.state);
-      }
-      if (typeof this._updated === 'function') {
-        this._updated(this.props, this.state);
-      }
-      if (typeof this.componentDidRender === 'function') {
-        this.componentDidRender(this.props, this.state);
-      }
-      if (typeof this._rendered === 'function') {
-        this._rendered(this.props, this.state);
-      }
-      return updateResult;
-    });
-    _defineProperty(this, "__updateAndReturnContent", async () => {
-      if (this.__queuedUpdateHandle !== undefined) {
-        clearTimeout(this.__queuedUpdateHandle);
-        delete this.__queuedUpdateHandle;
-      }
-      const styledContent = await this.__styledContent();
-      const {
-        props,
-        state
-      } = this;
-      return {
-        content: styledContent,
-        complete: () => this.__newUpdateCompleted(props, state)
-      };
-    });
-    _defineProperty(this, "__newUpdateCompleted", (props, state) => {
-      if (typeof this.componentDidUpdate === 'function') {
-        this.componentDidUpdate(props, state);
-      }
-      if (typeof this._updated === 'function') {
-        this._updated(props, state);
-      }
-      if (typeof this.componentDidRender === 'function') {
-        this.componentDidRender(props, state);
-      }
-      if (typeof this._rendered === 'function') {
-        this._rendered(props, state);
-      }
-    });
-    _defineProperty(this, "__handleTitle", () => {
-      if (typeof this.title === 'undefined') return;
-      if (typeof this.title === 'function') {
-        this.__instance.setTitle(this.title(this.props, this.state).toString());
-        return;
-      }
-      this.__instance.setTitle(this.title.toString());
-    });
-    _defineProperty(this, "setState", stateUpdates => {
-      // mimic react's set state
-      // queue up an updates
-      setTimeout(() => this.__doSetState(stateUpdates), 0);
-    });
-    _defineProperty(this, "__doSetState", stateUpdates => {
-      if (stateUpdates === undefined) throw new TungstenError(`TungstenComponent __doSetState() error. State is undefined`);
-      if (this.state === undefined) throw new TungstenError(`TungstenComponent __doSetState() error. State is undefined`);
-      for (const key in stateUpdates) {
-        // @ts-ignore
-        this.state[key] = stateUpdates[key];
-      }
-    });
-    _defineProperty(this, "__stateUpdated", () => {
-      if (isDev && this.__dead) throwError('TungstenStatefulComponent.__stateUpdated', `A dead component ${this.constructor.name} received a notice that it's state has updated`);
-      this.__queueUpdate();
-    });
-    // I think this is called by the babel'd code to trigger update when state is modified
-    // __updateState = (val: unknown): unknown => { // what is this?
-    //     console.log('__updateState', isDev, this.__dead)
-    //     if (isDev && this.__dead) throwError(
-    //         'TungstenStatefulComponent.__updateState',
-    //         `A dead component ${this.constructor.name} received a notice that it's state has updated`
-    //     )
-    //     this.__queueUpdate()
-    //     return val
-    // }
-    // this could be moved out of the component
-    // that would shorten references to it by not needing 'this.'
-    _defineProperty(this, "__stateCopy", item => {
-      if (typeof item !== 'object' || item === null) return item; // just return the value if it's not an object
-      if (!objectTypesToCopy.includes(item.constructor.name)) return item; // if it is not a plain object, return the original item
-      return structuredClone(item);
-    });
-    _defineProperty(this, "__content", async () => {
-      if (this.content === undefined) {
-        if (this.render !== undefined) return this.render(this.props, this.state);else throw new TungstenError(`${this.constructor.name} has no render or content function.`);
-      } else {
-        return await this.content(this.props, this.state);
-      }
-    });
-    _defineProperty(this, "__styledContent", async () => {
-      // what is this?
-      // for an old style component, just return the result of render()
-      //if (this.constructor.name === 'Highlight') {
-      //console.log('__styledContent')
-      //console.log('this.content', this.content)
-      //console.log('this.render', this.render)
-      //}
-      if (this.content === undefined && this.render !== undefined) return this.render(this.props, this.state);
-      //console.log('__styledContent checking __content')
-      const content = await this.__content();
-      if (this.style !== undefined) {
-        if (typeof this.style !== 'object') {
-          throw new TungstenError(`style property of ${this.constructor.name} is invalid.` + ' Should be a template string tagged with an accepted language name' + ', starting with an upper case letter, e.g. Sass`...styles...`.' + ` Received (${typeof this.style}) ${this.style}`);
-        }
-        const styledContent = styleContent(content, this.style);
-        //console.log(`styledContent for ${this.constructor.name}`, styledContent)
-        return styledContent;
-      } else {
-        return content;
-      }
-    });
-    // __filterText(t) {
-    //     return (typeof t === 'boolean' || t === null || t === undefined) ? '' : t
-    // }
-    _defineProperty(this, "__didUpdate", () => {
-      this.__didRender();
-      if (typeof this.componentDidUpdate === 'function') this.componentDidUpdate(this.props, this.state);
-      if (typeof this._updated === 'function') this._updated(this.props, this.state);
-    });
-    _defineProperty(this, "__didRender", () => {
-      if (typeof this.componentDidRender === 'function') this.componentDidRender(this.props, this.state);
-      if (typeof this._rendered === 'function') this._rendered(this.props, this.state);
-    });
-    _defineProperty(this, "pickState", (...keys) => {
-      return objects.pick(this.state, ...keys);
-    });
-  }
-}
-_defineProperty(TungstenStatefulComponent, "tagName", void 0);
-_defineProperty(TungstenStatefulComponent, "displayName", void 0);
-class TungstenSignalsComponent extends TungstenBaseComponent {
-  constructor(pkg) {
-    //const { props, routeParams, routeData, instance, parentComponent } = pkg
-    super(pkg);
-    _defineProperty(this, "init", void 0);
-    _defineProperty(this, "clientInit", void 0);
-    _defineProperty(this, "serverInit", void 0);
-    _defineProperty(this, "componentDidUpdate", void 0);
-    // ignore arg 3 for now:   , snapshot: unknown
-    _defineProperty(this, "componentDidRender", void 0);
-    _defineProperty(this, "__init", async /*instance: Instance*/ () => {
-      if (typeof window !== 'undefined' && typeof process === 'undefined') {
-        // init signals
-        // this.state = new Proxy(this.state, getStateProxyHandler<State>(this))
-        // proxyStateContent(this, this.state)
-      }
-      if (typeof this.init === 'function') {
-        // this first check isn't needed with how TS currently emits, but leaving it there to be safe
-        //(this.init as StatelessMethodHack<Props, State>)(this.props, this.state)
-        await this.init(this.props, this.signals);
-      }
-      if (isClient && typeof this.clientInit === 'function') {
-        //(this.clientInit as StatelessMethodHack<Props, State>)(this.props, this.state)
-        await this.clientInit(this.props, this.signals);
-      }
-      if (isServer && typeof this.serverInit === 'function') {
-        //(this.serverInit as StatelessMethodHack<Props, State>)(this.props, this.state)
-        await this.serverInit(this.props, this.signals);
-      }
-      this.__handleTitle();
-      this.__initialized = true;
-    });
-    // !!! needs checking
-    // a func to manage the initial render, and call componentDidMount
-    // !! not yet used
-    _defineProperty(this, "__initialContent", () => {
-      const styledContentPromise = this.__styledContent();
-      // if there is a componentDidMount func, queue this up to trigger after styled content is loaded
-      // don't queue it up to check unless the func already exists, for perf reasons
-      // should we trigger this at a different time - such as after render/hydration? -- probably 
-      // styledContentPromise.then(() => {
-      //     if (typeof this.componentDidMount === 'function') {
-      //         if (typeof this.componentDidMount === 'function') this.componentDidMount()
-      //     }
-      //     if (typeof this._mounted === 'function') {
-      //         if (typeof this._mounted === 'function') this._mounted()
-      //     }
-      //     if (typeof this.componentDidRender === 'function') {
-      //         this.componentDidRender(this.props, this.signals)
-      //     }
-      //     if (typeof this._rendered === 'function') {
-      //         this._rendered(this.props, this.signals)
-      //     }
-      // })
-      //console.log(`A ${this.constructor.name} TCI ${this.tci} is providing initial content`)
-      return styledContentPromise;
-    });
-    _defineProperty(this, "__update", async () => {
-      if (this.__queuedUpdateHandle !== undefined) {
-        clearTimeout(this.__queuedUpdateHandle);
-        delete this.__queuedUpdateHandle;
-      }
-      // do update
-      const styledContent = await this.__styledContent();
-      debug('styledContent', styledContent, 'for', this);
-      //console.log(`A ${this.constructor.name} TCI ${this.tci} is updating its content`)
-      const updateResult = await integrateElementUpdateVdom(this, styledContent);
-      if (typeof this.componentDidUpdate === 'function') {
-        this.componentDidUpdate(this.props, this.signals);
-      }
-      return updateResult;
-    });
-    _defineProperty(this, "__updateAndReturnContent", async () => {
-      if (this.__queuedUpdateHandle !== undefined) {
-        clearTimeout(this.__queuedUpdateHandle);
-        delete this.__queuedUpdateHandle;
-      }
-      const styledContent = await this.__styledContent();
-      return {
-        content: styledContent,
-        complete: () => {
-          throwError('TungstenCliComponent', '__updateAndReturnContent complete callback not implemented');
-        }
-      };
-    });
-    // __newUpdateCompleted = (props: Props) => {
-    //     if (typeof this.componentDidUpdate === 'function') {
-    //         this.componentDidUpdate(props)
-    //     }
-    //     if (typeof this._updated === 'function') {
-    //         this._updated(props, state)
-    //     }
-    //     if (typeof this.componentDidRender === 'function') {
-    //         this.componentDidRender(props, state)
-    //     }
-    //     if (typeof this._rendered === 'function') {
-    //         this._rendered(props, state)
-    //     }
-    // }
-    _defineProperty(this, "__handleTitle", () => {
-      if (typeof this.title === 'undefined') return;
-      if (typeof this.title === 'function') {
-        this.__instance.setTitle(this.title(this.props, this.signals).toString());
-        return;
-      }
-      this.__instance.setTitle(this.title.toString());
-    });
-    _defineProperty(this, "__content", async () => {
-      if (this.content === undefined) {
-        if (this.render !== undefined) return this.render(this.props, this.signals);else throw new TungstenError(`${this.constructor.name} has no render or content function.`);
-      } else {
-        return await this.content(this.props, this.signals);
-      }
-    });
-    _defineProperty(this, "__styledContent", async () => {
-      if (this.content === undefined && this.render !== undefined) return this.render(this.props, this.signals);
-      const content = await this.__content();
-      if (this.style !== undefined) {
-        if (typeof this.style !== 'object') {
-          throw new TungstenError(`style property of ${this.constructor.name} is invalid.` + ' Should be a template string tagged with an accepted language name' + ', starting with an upper case letter, e.g. Sass`...styles...`.' + ` Received (${typeof this.style}) ${this.style}`);
-        }
-        const styledContent = styleContent(content, this.style);
-        return styledContent;
-      } else {
-        return content;
-      }
-    });
-  }
-}
-_defineProperty(TungstenSignalsComponent, "tagName", void 0);
-_defineProperty(TungstenSignalsComponent, "displayName", void 0);
-import { objectMap } from "./objectMap.js";
-import { getStateProxyHandler, proxyObjectContent } from "./componentProxyHandlers.js";
-import { $contentNull } from "./symbols.js";
-import { getInternalStore } from "./Store/getInternalStore.js";
-import { objects } from 'sxy-lib';
-import { isDev } from "./isDev.js";
-import { throwError } from "./throwError.js";
-export function __proxyStore(store) {
-  const proxiedStore = objectMap(store, (valueKey, valueObject) => {
-    const handler = {
-      get: (valueObject, key) => {
-        switch (key) {
-          case 'subscribe':
-            {
-              //console.log('proxy sub gotten')
-              return () => valueObject.subscribe(this);
-            }
-          case 'unsubscribe':
-            {
-              //console.log('proxy sub gotten')
-              return () => valueObject.unsubscribe(this);
-            }
-          case 'sync':
-            {
-              //console.log('proxy sync gotten')
-              return () => valueObject.sync(this);
-            }
-          default:
-            {
-              return valueObject[key];
-            }
-        }
-      }
-    };
-    return new Proxy(valueObject, handler);
-  });
-  proxiedStore.__trueStore = store;
-  //console.log('returning a proxied store with element', this)
-  //return new Proxy(store, handler as ProxyHandler<TrueStore<Schema>>) as ComponentStore<Schema>
-  return proxiedStore;
-}
-function unsubscribeAll(
-// TungstenBaseStoreComponent might be obsolete, needs review
-element) {
-  const store = element.store;
-  const trueStore = store.__trueStore;
-  const subs = element.__instance.storeSubscriptions.get(trueStore)?.get(element);
-  //console.log('all subs', element.__instance.storeSubscriptions)
-  //console.log('store subs', element.__instance.storeSubscriptions.get(trueStore))
-  //console.log('el subs', subs)
-  if (subs) {
-    subs.forEach(key => {
-      //const typedKey = key as keyof typeof this.store
-      //console.log(element.constructor.name + ' is unsubscribing from ' + String(key) + ' during deletion')
-      store[key].unsubscribe();
-    });
-  }
-}
-// Maybe we don't use it, and it is just creating confusing
-export class TungstenBaseStoreComponent extends TungstenBaseComponent {
-  constructor(pkg) {
-    //const { props, routeParams, routeData, instance, parentComponent } = pkg
-    super(pkg);
-    _defineProperty(this, "__proxyStore", __proxyStore);
-    _defineProperty(this, "__delete", () => {
-      //console.log('deleting a store component')
-      elementDelete.call(this);
-      //console.log('try unsub')
-      // remove store subscriptions?
-      unsubscribeAll(this);
-    });
-  }
-}
-export class TungstenBaseSimpleStoreComponent extends TungstenSimpleComponent {
-  constructor(pkg) {
-    //const { props, routeParams, routeData, instance, parentComponent } = pkg
-    super(pkg);
-    _defineProperty(this, "__proxyStore", __proxyStore);
-    _defineProperty(this, "__delete", () => {
-      //console.log('deleting a simple store component')
-      elementDelete.call(this);
-      // remove store subscriptions?
-      unsubscribeAll(this);
-    });
-  }
-}
-export class TungstenBaseStatefulStoreComponent extends TungstenStatefulComponent {
-  constructor(pkg) {
-    super(pkg);
-    _defineProperty(this, "__proxyStore", __proxyStore);
-    _defineProperty(this, "__delete", () => {
-      // console.log('deleting a stateful store component')
-      elementDelete.call(this);
-      // remove store subscriptions?
-      unsubscribeAll(this);
-    });
-  }
-}
-export class TungstenSimpleInternalStoreComponent extends TungstenBaseSimpleStoreComponent {
-  constructor(...args) {
-    super(...args);
-    _defineProperty(this, "store", getInternalStore(this));
-  }
-}
-export class TungstenStatefulInternalStoreComponent extends TungstenBaseStatefulStoreComponent {
-  constructor(...args) {
-    super(...args);
-    _defineProperty(this, "store", getInternalStore(this));
-  }
-}