@vizbl/room-viewer 0.0.21 → 0.0.22

package/dist/components/Dialog.d.ts

@@ -0,0 +1,6 @@
+import type { ComponentProps } from 'react';
+import { RoomViewerDialog } from '@vizbl/react-room-viewer';
+export interface DialogProps extends ComponentProps<typeof RoomViewerDialog> {
+    trigger: Element;
+}
+export declare function Dialog({ trigger, ...props }: DialogProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/DialogManager.d.ts

@@ -0,0 +1 @@
+export declare function DialogManager(): import("react/jsx-runtime").JSX.Element;

package/dist/index.d.ts

@@ -0,0 +1 @@
+import '@vizbl/react-room-viewer/style.css';

package/dist/room-viewer.js

@@ -0,0 +1,90 @@
+import { createElement, useCallback, useEffect, useState } from "react";
+import client from "react-dom/client";
+import { Fragment, jsx } from "react/jsx-runtime";
+import { observe } from "selector-observer";
+import { RoomViewerDialog } from "@vizbl/react-room-viewer";
+import "@vizbl/react-room-viewer/style.css";
+function Dialog({ trigger, ...props }) {
+    const [open, setOpen] = useState(false);
+    const handleClick = useCallback(()=>{
+        setOpen(true);
+    }, []);
+    const handleOpenChange = useCallback((newOpen)=>{
+        setOpen(newOpen);
+    }, []);
+    useEffect(()=>{
+        trigger.addEventListener('click', handleClick);
+        return ()=>{
+            trigger.removeEventListener('click', handleClick);
+        };
+    }, [
+        trigger,
+        handleClick
+    ]);
+    return /*#__PURE__*/ jsx(RoomViewerDialog, {
+        open: open,
+        onOpenChange: handleOpenChange,
+        ...props
+    });
+}
+let nextTriggerId = 0;
+function DialogManager() {
+    const [triggers, setTriggers] = useState([]);
+    useEffect(()=>{
+        const observer = observe('[data-vizbl-room-viewer-dialog]', {
+            initialize (el) {
+                const type = el.getAttribute('data-vizbl-room-viewer-type');
+                const src = el.getAttribute('data-vizbl-room-viewer-src');
+                const tinuuid = el.getAttribute('data-vizbl-room-viewer-tinuuid');
+                const name = el.getAttribute('data-vizbl-room-viewer-name');
+                const language = el.getAttribute('data-vizbl-room-viewer-language');
+                const widthAttr = el.getAttribute('data-vizbl-room-viewer-width');
+                const heightAttr = el.getAttribute('data-vizbl-room-viewer-height');
+                const width = widthAttr ? Number(widthAttr) : void 0;
+                const height = heightAttr ? Number(heightAttr) : void 0;
+                const id = nextTriggerId++;
+                return {
+                    add () {
+                        setTriggers((prev)=>[
+                                ...prev,
+                                {
+                                    id,
+                                    trigger: el,
+                                    src,
+                                    tinuuid,
+                                    type,
+                                    name,
+                                    language,
+                                    width,
+                                    height
+                                }
+                            ]);
+                    },
+                    remove () {
+                        setTriggers((prev)=>prev.filter((t)=>t.id !== id));
+                    }
+                };
+            }
+        });
+        return ()=>{
+            observer.abort();
+        };
+    }, []);
+    return /*#__PURE__*/ jsx(Fragment, {
+        children: triggers.map((trigger)=>/*#__PURE__*/ jsx(Dialog, {
+                trigger: trigger.trigger,
+                src: trigger.src,
+                tinuuid: trigger.tinuuid,
+                type: trigger.type,
+                name: trigger.name,
+                language: trigger.language,
+                width: trigger.width,
+                height: trigger.height
+            }, trigger.id))
+    });
+}
+const dialogContainer = document.createElement('div');
+dialogContainer.id = 'vizbl-room-viewer-dialog-manager';
+document.body.appendChild(dialogContainer);
+const dialogRoot = client.createRoot(dialogContainer);
+dialogRoot.render(createElement(DialogManager));