TJSContextMenu.create({
    event,
    duration: 0, // If you really need to change duration.
    items: contextMenu
})

TJSContextMenu.create({
    event,
    duration: 0, // If you really need to change duration.
    items: contextMenu
})

{
 x: x ?? focusSource.x,
 y: y ?? focusSource.y,
}

{
 x: x ?? focusSource.x,
 y: y ?? focusSource.y,
}

#runtime/svelte/store/reducer/array-object
#runtime/svelte/store/fvtt/settings
#runtime/svelte/store/fvtt/settings/world

#runtime/svelte/store/reducer/array-object
#runtime/svelte/store/fvtt/settings
#runtime/svelte/store/fvtt/settings/world

<script>
   const { application } = getContext('#external');
   const storeTitle = application.reactive.storeAppOptions.title;
</script>

<input type=text bind:value={$storeTitle}>

<script>
   const { application } = getContext('#external');
   const storeTitle = application.reactive.storeAppOptions.title;
</script>

<input type=text bind:value={$storeTitle}>

  svelte: {
    class: FFActiveEffectShell,
    target: document.body
    context: function() {
      return { doc: this.#doc; }
    }
 }

  svelte: {
    class: FFActiveEffectShell,
    target: document.body
    context: function() {
      return { doc: this.#doc; }
    }
 }

import { SvelteApplication } from "#runtime/svelte/application";
import { TJSDocument } from '#runtime/svelte/store/fvtt/document';

import FFActiveEffectShell from './FFActiveEffectShell.svelte';
import { SYSTEM_CODE } from "~/src/helpers/constants"

export default class FFActiveEffectSheet extends SvelteApplication {
   #doc;

   constructor(doc, options) {
      super(options);
      this.#doc = new TJSDocument(doc, { delete: () => this.close() ));
   }

   /**
    * Default Application options
    *
    * @returns {object} options - Application options.
    * @see https://foundryvtt.com/api/interfaces/client.ApplicationOptions.html
    */
   static get defaultOptions() {
      return foundry.utils.mergeObject(super.defaultOptions, {
         classes: [SYSTEM_CODE, 'sheet', 'active-effect-config'],
         title: 'EFFECT.ConfigTitle',
         width: 560,
         height: 'auto',
         svelte: {
            class: FFActiveEffectShell,
            target: document.body
            context: function() {
               doc: this.#doc;
            }
         }
      });
   }
}

import { SvelteApplication } from "#runtime/svelte/application";
import { TJSDocument } from '#runtime/svelte/store/fvtt/document';

import FFActiveEffectShell from './FFActiveEffectShell.svelte';
import { SYSTEM_CODE } from "~/src/helpers/constants"

export default class FFActiveEffectSheet extends SvelteApplication {
   #doc;

   constructor(doc, options) {
      super(options);
      this.#doc = new TJSDocument(doc, { delete: () => this.close() ));
   }

   /**
    * Default Application options
    *
    * @returns {object} options - Application options.
    * @see https://foundryvtt.com/api/interfaces/client.ApplicationOptions.html
    */
   static get defaultOptions() {
      return foundry.utils.mergeObject(super.defaultOptions, {
         classes: [SYSTEM_CODE, 'sheet', 'active-effect-config'],
         title: 'EFFECT.ConfigTitle',
         width: 560,
         height: 'auto',
         svelte: {
            class: FFActiveEffectShell,
            target: document.body
            context: function() {
               doc: this.#doc;
            }
         }
      });
   }
}

<script>
   import { getContext } from 'svelte';
   const doc = getContext('#external').doc;

  // doc is the TJSDocument from the outer JS class. 
</script>

<!-- Do the regular app shell stuff this is demo code -->
<ApplicationShell ...>
Doc name: {$doc?.name}
</ApplicationShell>

<script>
   import { getContext } from 'svelte';
   const doc = getContext('#external').doc;

  // doc is the TJSDocument from the outer JS class. 
</script>

<!-- Do the regular app shell stuff this is demo code -->
<ApplicationShell ...>
Doc name: {$doc?.name}
</ApplicationShell>