@release0/nextjs 0.2.0 → 0.2.2

package/README.md

@@ -12,7 +12,7 @@ import { Standard } from "@release0/nextjs";
 const App = () => {
   return (
     <Standard
-      agent="my-questions-agent"
+      agent="ag_herexisxyourxagentxid"
       style={{ width: "100%", height: "600px" }}
     />
   );
@@ -27,7 +27,7 @@ This code is creating a container with a 100% width (will match parent width) an
 import { Popup } from "@release0/nextjs";
 
 const App = () => {
-  return <Popup agent="my-questions-agent" autoShowDelay={3000} />;
+  return <Popup agent="ag_herexisxyourxagentxid" autoShowDelay={3000} />;
 };
 ```
 
@@ -63,7 +63,7 @@ import { Bubble } from "@release0/nextjs";
 const App = () => {
   return (
     <Bubble
-      agent="my-questions-agent"
+      agent="ag_herexisxyourxagentxid"
       previewMessage={{
         message: "I have a question for you!",
         autoShowDelay: 5000,
@@ -128,17 +128,17 @@ import { Standard } from "@release0/nextjs";
 const App = () => {
   return (
     <Standard
-      agent="my-questions-agent"
+      agent="ag_herexisxyourxagentxid"
       style={{ width: "100%", height: "600px" }}
       prefilledVariables={{
-        "Current URL": "https://my-site.com/account",
-        "User name": "John Doe",
+        "Account URL": "https://my-site.com/account",
+        "User name": "My username",
       }}
     />
   );
 };
 ```
 
-It will prefill the `Current URL` variable with "https://my-site.com/account" and the `User name` variable with "John Doe".
+It will prefill the `Account URL` variable with "https://my-site.com/account" and the `User name` variable with "My username".
 
-Note: If your site URL contains query params (i.e. https://release0?User%20name=John%20Doe), the variables will automatically be injected to the agent. So you don't need to manually transfer query params to the agent embed configuration.
+Note: If your site URL contains query params (i.e. https://my-site.com/account?User%20name=My%20username), the variables will automatically be injected to the agent. So you don't need to manually transfer query params to the agent embed configuration.

package/dist/dist-WPLDFLQO.js

@@ -0,0 +1,56 @@
+"use client"
+
+// ../react/dist/index.js
+import { useEffect as m, useRef as i } from "react";
+import "@release0/js/web";
+import { jsx as b } from "react/jsx-runtime";
+import { useEffect as c, useRef as d } from "react";
+import "@release0/js/web";
+import { jsx as P } from "react/jsx-runtime";
+import { useCallback as y, useEffect as u, useRef as s } from "react";
+import "@release0/js/web";
+import { jsx as g } from "react/jsx-runtime";
+export * from "@release0/js";
+var f = ({ style: r, className: e, ...t }) => {
+  let n = i(null);
+  return m(() => {
+    if (!n.current || typeof t != "object" || t === null) return;
+    let { children: p, ref: o, key: l, ...a } = t;
+    Object.assign(n.current, a);
+  }, [t]), b("agent-standard", { ref: n, style: r, class: e });
+};
+var E = (r) => {
+  let e = d(null);
+  return c(() => {
+    if (r.theme?.position === "static" && !e.current) return;
+    e.current || (e.current = document.createElement("agent-bubble"), document.body.prepend(e.current));
+    let { agent: t, ...n } = r;
+    Object.assign(e.current, n, { agent: t });
+  }, [r]), c(() => () => {
+    r.theme?.position !== "static" && (e.current?.remove(), e.current = null);
+  }, [r.theme?.position]), r.theme?.position === "static" ? P("agent-bubble", { ref: e, style: { display: "inline-flex" } }) : null;
+};
+var T = (r) => {
+  let e = s(null), t = s(null), n = y((o) => {
+    let l = document.createElement("agent-popup");
+    if (t.current = l, p(t.current, o), !e.current) {
+      console.warn("Could not attach popup to container because containerRef.current is null");
+      return;
+    }
+    e.current?.append(t.current);
+  }, []);
+  u(() => {
+    t.current || n(r), p(t.current, r);
+  }, [n, r]), u(() => () => {
+    t.current?.remove(), t.current = null;
+  }, []);
+  let p = (o, l) => {
+    Object.assign(o, l);
+  };
+  return g("div", { ref: e });
+};
+export {
+  E as Bubble,
+  T as Popup,
+  f as Standard
+};

package/dist/index.js

@@ -13,19 +13,19 @@ import {
   close
 } from "@release0/js";
 var Standard = dynamic(
-  () => import("./dist-7FPSDZKC.js").then((mod) => mod.Standard),
+  () => import("./dist-WPLDFLQO.js").then((mod) => mod.Standard),
   {
     ssr: false
   }
 );
 var Bubble = dynamic(
-  () => import("./dist-7FPSDZKC.js").then((mod) => mod.Bubble),
+  () => import("./dist-WPLDFLQO.js").then((mod) => mod.Bubble),
   {
     ssr: false
   }
 );
 var Popup = dynamic(
-  () => import("./dist-7FPSDZKC.js").then((mod) => mod.Popup),
+  () => import("./dist-WPLDFLQO.js").then((mod) => mod.Popup),
   {
     ssr: false
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@release0/nextjs",
-  "version": "0.2.0",
+  "version": "0.2.2",
   "license": "FSL-1.1-ALv2",
   "description": "Relese0 Lib: A convenient library for displaying chat agents on Next.js websites",
   "type": "module",
@@ -17,22 +17,22 @@
     "build": "tsup"
   },
   "dependencies": {
-    "@release0/js": "1.1.2"
+    "@release0/js": "1.1.7"
   },
   "devDependencies": {
     "@release0/tsconfig": "0.0.1",
     "@types/react": "18.2.15",
     "tsup": "8.3.0",
     "react": "18.2.0",
-    "@release0/react": "1.0.0",
+    "@release0/react": "1.0.2",
     "next": "14.2.13"
   },
   "peerDependencies": {
     "react": "^16.0.0 || ^17.0.0 || ^18.0.0",
     "next": "12.x || 13.x || 14.x",
-    "@release0/js": "^1.1.3 || workspace:*"
+    "@release0/js": "^1.1.7 || workspace:*"
   },
   "publishConfig": {
     "access": "public"
   }
-}
+}

package/dist/dist-7FPSDZKC.js

@@ -1,80 +0,0 @@
-"use client"
-
-// ../react/dist/index.js
-import { useEffect, useRef } from "react";
-import "@release0/js/web";
-import { jsx } from "react/jsx-runtime";
-import { useCallback, useEffect as useEffect2, useRef as useRef2 } from "react";
-import "@release0/js/web";
-import { useCallback as useCallback2, useEffect as useEffect3, useRef as useRef3 } from "react";
-import "@release0/js/web";
-import { jsx as jsx2 } from "react/jsx-runtime";
-export * from "@release0/js";
-var Standard = ({ style, className, ...assignableProps }) => {
-  const ref = useRef(null);
-  useEffect(() => {
-    if (!ref.current) return;
-    Object.assign(ref.current, assignableProps);
-  }, [assignableProps]);
-  return /* @__PURE__ */ jsx("agent-standard", { ref, style, class: className });
-};
-var Bubble = (props) => {
-  const bubbleElement = useRef2(null);
-  const attachBubbleToDom = useCallback((props2) => {
-    const newBubbleElement = document.createElement(
-      "agent-bubble"
-    );
-    bubbleElement.current = newBubbleElement;
-    injectPropsToElement(bubbleElement.current, props2);
-    document.body.prepend(bubbleElement.current);
-  }, []);
-  useEffect2(() => {
-    if (!bubbleElement.current) attachBubbleToDom(props);
-    injectPropsToElement(bubbleElement.current, props);
-  }, [attachBubbleToDom, props]);
-  useEffect2(() => {
-    return () => {
-      bubbleElement.current?.remove();
-      bubbleElement.current = null;
-    };
-  }, []);
-  const injectPropsToElement = (element, props2) => {
-    Object.assign(element, props2);
-  };
-  return null;
-};
-var Popup = (props) => {
-  const containerRef = useRef3(null);
-  const popupRef = useRef3(null);
-  const attachPopupToContainer = useCallback2((props2) => {
-    const popupElement = document.createElement("agent-popup");
-    popupRef.current = popupElement;
-    injectPropsToElement(popupRef.current, props2);
-    if (!containerRef.current) {
-      console.warn(
-        "Could not attach popup to container because containerRef.current is null"
-      );
-      return;
-    }
-    containerRef.current?.append(popupRef.current);
-  }, []);
-  useEffect3(() => {
-    if (!popupRef.current) attachPopupToContainer(props);
-    injectPropsToElement(popupRef.current, props);
-  }, [attachPopupToContainer, props]);
-  useEffect3(() => {
-    return () => {
-      popupRef.current?.remove();
-      popupRef.current = null;
-    };
-  }, []);
-  const injectPropsToElement = (element, props2) => {
-    Object.assign(element, props2);
-  };
-  return /* @__PURE__ */ jsx2("div", { ref: containerRef });
-};
-export {
-  Bubble,
-  Popup,
-  Standard
-};