feat(x-installer): extend domElement type to allow ShadowRoot

Signed-off-by: davidglezz <[email protected]>
empathyco · Dec 4, 2024 · 900eb9c · 900eb9c
1 parent 90f4a85
commit 900eb9c
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 5 deletions.
diff --git a/packages/x-components/src/x-installer/x-installer/types.ts b/packages/x-components/src/x-installer/x-installer/types.ts
@@ -30,7 +30,11 @@ export interface InstallXOptions<API extends XAPI = XAPI> extends XPluginOptions
    * An Element | string | function to indicate the HTML element that will contain the Vue
    * application. If it isn't passed, the {@link XInstaller} will create the target element.
    */
-  domElement?: Element | string | ((snippetConfig: NormalisedSnippetConfig) => Element | string);
+  domElement?:
+    | Element
+    | ShadowRoot
+    | string
+    | ((snippetConfig: NormalisedSnippetConfig) => Element | ShadowRoot | string);
   /**
    * The XPlugin which will be installed. If not passed, an instance of {@link XPlugin} will be
    * installed.

diff --git a/packages/x-components/src/x-installer/x-installer/x-installer.ts b/packages/x-components/src/x-installer/x-installer/x-installer.ts
@@ -289,13 +289,13 @@ export class XInstaller {
    * returns an Element or element selector to use.
    * If it is not present, a new <div> Element is created and appended to the body.
    *
-   * @param domElement - {@link InstallXOptions.domElement | Element, string or function} Used
-   * to mount the Vue Application.
+   * @param domElement - {@link InstallXOptions.domElement} Element, ShadowRoot, string or function
+   * used to mount the Vue Application.
    *
-   * @returns The Element to use as mounting target for the Vue Application.
+   * @returns The Element or ShadowRoot to use as mounting target for the Vue Application.
    * @internal
    */
-  protected getMountingTarget(domElement?: InstallXOptions['domElement']): Element {
+  protected getMountingTarget(domElement?: InstallXOptions['domElement']): Element | ShadowRoot {
     if (isFunction(domElement)) {
       domElement = domElement(this.snippetConfig!);
     }