@dative-gpi/foundation-shared-components 1.1.9-sandbox-1 → 1.1.9-sandbox-2

package/composables/useDomRenderer.ts

@@ -1,14 +1,21 @@
 import { h, render, getCurrentInstance, onBeforeUnmount, toValue, type Component, type MaybeRefOrGetter, watch } from "vue";
 
 interface RenderHandle {
-  unmount: () => void;
+  unsubscribe: () => void;
   getElement: (style?: Partial<CSSStyleDeclaration>) => HTMLElement;
 }
 
-interface Subscriber {
-  container: HTMLElement | null;
+interface Subscription {
+  container: HTMLElement;
   mountPoint: HTMLElement;
-  stopWatching: (() => void) | null;
+  stopWatching: () => void;
+}
+
+function destroySubscription(subscription: Subscription) {
+  subscription.stopWatching();
+  render(null, subscription.container);
+  subscription.container.remove();
+  subscription.mountPoint.remove();
 }
 
 export function useDomRenderer<TProps extends Record<string, any>>(component: Component<TProps>) {
@@ -19,12 +26,10 @@ export function useDomRenderer<TProps extends Record<string, any>>(component: Co
   }
 
   const appContext = instance.appContext;
-  const subscribers = new Map<symbol, Subscriber>();
+  const subscriptions = new Set<Subscription>();
 
-  const mount = (getProps: MaybeRefOrGetter<TProps>, style?: Partial<CSSStyleDeclaration>): RenderHandle => {
-    const id = Symbol();
+  const subscribe = (getProps: MaybeRefOrGetter<TProps>, style?: Partial<CSSStyleDeclaration>): RenderHandle => {
     const mountPoint = document.createElement("div");
-    Object.assign(mountPoint.style, style ?? {});
 
     const container = document.createElement("div");
     mountPoint.appendChild(container);
@@ -39,51 +44,40 @@ export function useDomRenderer<TProps extends Record<string, any>>(component: Co
       { immediate: true }
     );
 
-    subscribers.set(id, { container, mountPoint, stopWatching });
+    const subscription: Subscription = { container, mountPoint, stopWatching };
+    subscriptions.add(subscription);
 
-    const unmount = () => {
-      const subscriber = subscribers.get(id);
-      if (!subscriber) {
+    const unsubscribe = () => {
+      if (!subscriptions.has(subscription)) {
         return;
       }
-
-      if (subscriber.stopWatching) {
-        subscriber.stopWatching();
-      }
-      render(null, subscriber.container!);
-      subscriber.container!.remove();
-      subscriber.mountPoint.remove();
-      subscribers.delete(id);
+      destroySubscription(subscription);
+      subscriptions.delete(subscription);
     };
 
     const getElement = (newStyle?: Partial<CSSStyleDeclaration>): HTMLElement => {
-      const subscriber = subscribers.get(id);
-      if (!subscriber) {
-        throw new Error("This render handle has already been unmounted");
+      if (!subscriptions.has(subscription)) {
+        throw new Error("This render handle has already been unsubscribed");
       }
-      Object.assign(subscriber.mountPoint.style, newStyle ?? {});
-      return subscriber.mountPoint;
+      mountPoint.style.cssText = "";
+      Object.assign(mountPoint.style, style ?? {}, newStyle ?? {});
+      return mountPoint;
     };
 
-    return { unmount, getElement };
+    return { unsubscribe, getElement };
   };
 
-  const unmountAll = () => {
-    for (const [id, subscriber] of subscribers) {
-      if (subscriber.stopWatching) {
-        subscriber.stopWatching();
-      }
-      render(null, subscriber.container!);
-      subscriber.container!.remove();
-      subscriber.mountPoint.remove();
-      subscribers.delete(id);
+  const unsubscribeAll = () => {
+    for (const subscription of subscriptions) {
+      destroySubscription(subscription);
     }
+    subscriptions.clear();
   };
 
-  onBeforeUnmount(unmountAll);
+  onBeforeUnmount(unsubscribeAll);
 
   return {
-    mount,
-    unmountAll,
+    subscribe,
+    unsubscribeAll,
   };
 }

package/package.json

@@ -4,7 +4,7 @@
     "url": "https://github.com/Dative-GPI/foundation-shared-ui.git"
   },
   "sideEffects": false,
-  "version": "1.1.9-sandbox-1",
+  "version": "1.1.9-sandbox-2",
   "description": "",
   "publishConfig": {
     "access": "public"
@@ -13,8 +13,8 @@
   "author": "",
   "license": "ISC",
   "dependencies": {
-    "@dative-gpi/foundation-shared-domain": "1.1.9-sandbox-1",
-    "@dative-gpi/foundation-shared-services": "1.1.9-sandbox-1"
+    "@dative-gpi/foundation-shared-domain": "1.1.9-sandbox-2",
+    "@dative-gpi/foundation-shared-services": "1.1.9-sandbox-2"
   },
   "peerDependencies": {
     "@dative-gpi/bones-ui": "^1.0.0",
@@ -38,5 +38,5 @@
     "sass": "1.71.1",
     "sass-loader": "13.3.2"
   },
-  "gitHead": "3c1f52d5262262dcb567c0af3956ee0050ad9126"
+  "gitHead": "a26ae1e0964030d75000054d021c1d45feadb98e"
 }