fix(overlay): persist "host" in directive rendered Overlay content (#…

…4475)

packages/overlay/src/overlay-trigger-directive.ts

@@ -10,10 +10,11 @@ OF ANY KIND, either express or implied. See the License for the specific languag
 governing permissions and limitations under the License.
 */
 import {
-    ElementPart,
+    type ElementPart,
     nothing,
     render,
-    TemplateResult,
+    type RenderOptions,
+    type TemplateResult,
 } from '@spectrum-web-components/base';
 import { directive } from '@spectrum-web-components/base/src/async-directive.js';
 import { strategies } from './strategies.js';
@@ -41,6 +42,7 @@ export type OverlayTriggerOptions = {
 };
 
 export class OverlayTriggerDirective extends SlottableRequestDirective {
+    private host?: object;
     private overlay!: AbstractOverlay;
     private strategy!: ClickController | HoverController | LongpressController;
 
@@ -77,6 +79,7 @@ export class OverlayTriggerDirective extends SlottableRequestDirective {
         };
         this.insertionOptions = options?.insertionOptions;
         this.template = template;
+        this.host = part.options?.host;
         let newTarget = false;
         const triggerInteraction = (options?.triggerInteraction ||
             this.defaultOptions.triggerInteraction) as TriggerInteraction;
@@ -107,7 +110,15 @@ export class OverlayTriggerDirective extends SlottableRequestDirective {
         if (event.target !== event.currentTarget) return;
 
         const willRemoveSlottable = event.data === removeSlottableRequest;
-        render(willRemoveSlottable ? undefined : this.template(), this.overlay);
+        const options = {} as RenderOptions;
+        if (this.host) {
+            options.host = this.host;
+        }
+        render(
+            willRemoveSlottable ? undefined : this.template(),
+            this.overlay,
+            options
+        );
 
         if (willRemoveSlottable) {
             this.overlay.remove();