@pixygon/chatbot-react 0.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +95 -0
- package/dist/index.d.ts +220 -0
- package/dist/index.js +1086 -0
- package/package.json +46 -0
- package/public/chatbot.js +81 -0
package/package.json
ADDED
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@pixygon/chatbot-react",
|
|
3
|
+
"version": "0.1.0",
|
|
4
|
+
"description": "React + MUI pages for the Pixygon chatbot: knowledge base admin, chat, analytics, embeddable widget.",
|
|
5
|
+
"type": "module",
|
|
6
|
+
"main": "./dist/index.js",
|
|
7
|
+
"module": "./dist/index.js",
|
|
8
|
+
"types": "./dist/index.d.ts",
|
|
9
|
+
"exports": {
|
|
10
|
+
".": {
|
|
11
|
+
"types": "./dist/index.d.ts",
|
|
12
|
+
"import": "./dist/index.js"
|
|
13
|
+
},
|
|
14
|
+
"./chatbot.js": "./public/chatbot.js"
|
|
15
|
+
},
|
|
16
|
+
"files": ["dist", "public", "README.md"],
|
|
17
|
+
"publishConfig": { "access": "public" },
|
|
18
|
+
"scripts": {
|
|
19
|
+
"build": "tsup src/index.tsx --format esm --dts --clean --target es2022 --external react --external react-dom --external @mui/material --external @mui/icons-material --external @reduxjs/toolkit --external react-redux --tsconfig tsconfig.json",
|
|
20
|
+
"typecheck": "tsc --noEmit"
|
|
21
|
+
},
|
|
22
|
+
"peerDependencies": {
|
|
23
|
+
"@emotion/react": "^11.0.0",
|
|
24
|
+
"@emotion/styled": "^11.0.0",
|
|
25
|
+
"@mui/icons-material": "^6.0.0 || ^7.0.0",
|
|
26
|
+
"@mui/material": "^6.0.0 || ^7.0.0",
|
|
27
|
+
"@reduxjs/toolkit": "^2.0.0",
|
|
28
|
+
"react": "^18.0.0 || ^19.0.0",
|
|
29
|
+
"react-dom": "^18.0.0 || ^19.0.0",
|
|
30
|
+
"react-redux": "^9.0.0"
|
|
31
|
+
},
|
|
32
|
+
"devDependencies": {
|
|
33
|
+
"@emotion/react": "^11.13.5",
|
|
34
|
+
"@emotion/styled": "^11.13.5",
|
|
35
|
+
"@mui/icons-material": "^6.2.0",
|
|
36
|
+
"@mui/material": "^6.2.0",
|
|
37
|
+
"@reduxjs/toolkit": "^2.4.0",
|
|
38
|
+
"@types/react": "^19.0.1",
|
|
39
|
+
"@types/react-dom": "^19.0.2",
|
|
40
|
+
"react": "^19.0.0",
|
|
41
|
+
"react-dom": "^19.0.0",
|
|
42
|
+
"react-redux": "^9.2.0",
|
|
43
|
+
"tsup": "^8.5.0",
|
|
44
|
+
"typescript": "^5.7.0"
|
|
45
|
+
}
|
|
46
|
+
}
|
|
@@ -0,0 +1,81 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Pixygon chatbot embed bootstrap.
|
|
3
|
+
*
|
|
4
|
+
* <script
|
|
5
|
+
* src="https://your-app.example/chatbot.js"
|
|
6
|
+
* data-tenant-slug="acme"
|
|
7
|
+
* data-position="bottom-right"
|
|
8
|
+
* data-color="#8FB7C9"
|
|
9
|
+
* defer
|
|
10
|
+
* ></script>
|
|
11
|
+
*
|
|
12
|
+
* Renders a floating launcher; click opens an iframe at
|
|
13
|
+
* `/embed/chat/<slug>` on the same origin. Listens for `pixygon-chatbot:close`
|
|
14
|
+
* postMessage from the iframe.
|
|
15
|
+
*/
|
|
16
|
+
(function () {
|
|
17
|
+
"use strict";
|
|
18
|
+
if (window.__pixygonChatbotLoaded) return;
|
|
19
|
+
window.__pixygonChatbotLoaded = true;
|
|
20
|
+
|
|
21
|
+
var script = document.currentScript || document.querySelector('script[src*="chatbot.js"]');
|
|
22
|
+
if (!script) return;
|
|
23
|
+
|
|
24
|
+
var slug = script.getAttribute("data-tenant-slug");
|
|
25
|
+
if (!slug) { console.warn("[pixygon-chatbot] missing data-tenant-slug"); return; }
|
|
26
|
+
|
|
27
|
+
var origin = new URL(script.src).origin;
|
|
28
|
+
var position = script.getAttribute("data-position") || "bottom-right";
|
|
29
|
+
var primary = script.getAttribute("data-color") || "#8FB7C9";
|
|
30
|
+
|
|
31
|
+
var posStyle = {
|
|
32
|
+
"bottom-right": "right:20px;bottom:20px;",
|
|
33
|
+
"bottom-left": "left:20px;bottom:20px;",
|
|
34
|
+
}[position] || "right:20px;bottom:20px;";
|
|
35
|
+
|
|
36
|
+
var launcher = document.createElement("button");
|
|
37
|
+
launcher.setAttribute("aria-label", "Open chat assistant");
|
|
38
|
+
launcher.style.cssText =
|
|
39
|
+
"position:fixed;" + posStyle +
|
|
40
|
+
"width:56px;height:56px;border-radius:50%;border:none;cursor:pointer;" +
|
|
41
|
+
"background:" + primary + ";color:white;z-index:2147483600;" +
|
|
42
|
+
"box-shadow:0 4px 16px rgba(0,0,0,0.15);display:flex;align-items:center;justify-content:center;" +
|
|
43
|
+
"transition:transform 0.2s;font-family:system-ui,sans-serif;";
|
|
44
|
+
launcher.innerHTML =
|
|
45
|
+
'<svg width="26" height="26" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">' +
|
|
46
|
+
'<path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"></path></svg>';
|
|
47
|
+
launcher.onmouseover = function () { launcher.style.transform = "scale(1.05)"; };
|
|
48
|
+
launcher.onmouseout = function () { launcher.style.transform = "scale(1)"; };
|
|
49
|
+
|
|
50
|
+
var panel = document.createElement("div");
|
|
51
|
+
panel.style.cssText =
|
|
52
|
+
"position:fixed;" + posStyle.replace(/bottom:20px/, "bottom:90px") +
|
|
53
|
+
"width:380px;height:560px;max-width:calc(100vw - 40px);max-height:calc(100vh - 120px);" +
|
|
54
|
+
"border-radius:12px;overflow:hidden;z-index:2147483601;" +
|
|
55
|
+
"box-shadow:0 16px 40px rgba(0,0,0,0.18);display:none;background:white;";
|
|
56
|
+
|
|
57
|
+
var iframe = document.createElement("iframe");
|
|
58
|
+
iframe.style.cssText = "width:100%;height:100%;border:none;display:block;";
|
|
59
|
+
iframe.title = "Chat assistant";
|
|
60
|
+
iframe.src = origin + "/embed/chat/" + encodeURIComponent(slug);
|
|
61
|
+
panel.appendChild(iframe);
|
|
62
|
+
|
|
63
|
+
function setOpen(next) {
|
|
64
|
+
panel.style.display = next ? "block" : "none";
|
|
65
|
+
launcher.style.display = next ? "none" : "flex";
|
|
66
|
+
}
|
|
67
|
+
launcher.addEventListener("click", function () { setOpen(true); });
|
|
68
|
+
window.addEventListener("message", function (e) {
|
|
69
|
+
if (e.data && e.data.type === "pixygon-chatbot:close") setOpen(false);
|
|
70
|
+
});
|
|
71
|
+
|
|
72
|
+
function attach() {
|
|
73
|
+
document.body.appendChild(launcher);
|
|
74
|
+
document.body.appendChild(panel);
|
|
75
|
+
}
|
|
76
|
+
if (document.readyState === "loading") {
|
|
77
|
+
document.addEventListener("DOMContentLoaded", attach);
|
|
78
|
+
} else {
|
|
79
|
+
attach();
|
|
80
|
+
}
|
|
81
|
+
})();
|