@kieksme/csp-plugin-chat 0.3.0 → 0.5.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.
Files changed (5) hide show
  1. package/README.md +1 -1
  2. package/dist/browser.js +76 -44
  3. package/dist/{chunk-A54AKMRB.js → chunk-PQWU3SII.js} +1 -1
  4. package/dist/server.js +1 -1
  5. package/package.json +3 -3
package/README.md CHANGED
@@ -1,3 +1,3 @@
1
1
  # @kieksme/csp-plugin-chat
2
2
 
3
- Part of the Customer Service Portal. See the product README and docs/plugin-sdk.md for configuration and usage.
3
+ Part of the Customer Service Portal. See the product README and Docs/plugin-sdk.md for configuration and usage.
package/dist/browser.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  cspPlugin
3
- } from "./chunk-A54AKMRB.js";
3
+ } from "./chunk-PQWU3SII.js";
4
4
 
5
5
  // src/browser.tsx
6
6
  import { useEffect, useRef, useState } from "react";
@@ -31,12 +31,15 @@ function Chat(ctx) {
31
31
  const controller = new AbortController();
32
32
  abort.current = controller;
33
33
  try {
34
- const response = await fetch(ctx.config.apiUrl + "/api/v1/chat", {
35
- method: "POST",
36
- headers: { "Content-Type": "application/json" },
37
- body: JSON.stringify({ messages: bounded }),
38
- signal: controller.signal
39
- });
34
+ const response = await (ctx.request ?? fetch)(
35
+ ctx.config.apiUrl + "/api/v1/chat",
36
+ {
37
+ method: "POST",
38
+ headers: { "Content-Type": "application/json" },
39
+ body: JSON.stringify({ messages: bounded }),
40
+ signal: controller.signal
41
+ }
42
+ );
40
43
  if (!response.ok || !response.body)
41
44
  throw new Error(
42
45
  response.status === 429 ? "Zu viele Anfragen. Bitte warten Sie eine Minute." : "Chat derzeit nicht erreichbar."
@@ -89,21 +92,36 @@ function Chat(ctx) {
89
92
  abort.current = null;
90
93
  }
91
94
  }
92
- return /* @__PURE__ */ jsxs("div", { className: "chat-layout", children: [
93
- /* @__PURE__ */ jsxs("div", { className: "chat-intro", children: [
95
+ return /* @__PURE__ */ jsxs("div", { className: "chat-layout grid grid-cols-[1fr_1.7fr] gap-13.75 compact:grid-cols-[1fr] compact:gap-3.75", children: [
96
+ /* @__PURE__ */ jsxs("div", { className: "chat-intro [&_p]:text-[0.875rem] [&_p]:text-muted [&_p]:leading-[1.8] compact:max-w-[500px]", children: [
94
97
  /* @__PURE__ */ jsx("h3", { children: "Eine Frage reicht." }),
95
98
  /* @__PURE__ */ jsx("p", { children: "Unser Assistent kennt die Hilfe-Inhalte, das Team und die aktuellen Meldungen. F\xFCr dringende St\xF6rungen bleibt die Hotline der direkte Weg." }),
96
- /* @__PURE__ */ jsx("p", { className: "data-state", children: "\xD6ffentlicher Chat \xB7 Verlauf nur in dieser Sitzung" })
99
+ /* @__PURE__ */ jsx("p", { className: "data-state font-mono text-[0.625rem] text-muted m-[calc(var(--spacing)_*_3)_0_0] [&.warning]:text-warning", children: "\xD6ffentlicher Chat \xB7 Verlauf nur in dieser Sitzung" })
97
100
  ] }),
98
- /* @__PURE__ */ jsxs("div", { className: "chat-panel", children: [
99
- /* @__PURE__ */ jsxs("div", { className: "chat-history", "aria-live": "polite", "aria-busy": busy, children: [
100
- !messages.length && /* @__PURE__ */ jsx("p", { className: "message assistant", children: "Wie kann ich Ihnen helfen?" }),
101
- messages.map((m, i) => /* @__PURE__ */ jsxs("div", { className: "message " + m.role, children: [
102
- /* @__PURE__ */ jsx("span", { className: "sr-only", children: m.role === "user" ? "Sie: " : "Assistent: " }),
103
- m.content || "Antwort wird vorbereitet \u2026"
104
- ] }, i))
105
- ] }),
106
- sources.length > 0 && /* @__PURE__ */ jsxs("div", { className: "sources", children: [
101
+ /* @__PURE__ */ jsxs("div", { className: "chat-panel bg-card border border-line p-6 rounded-card", children: [
102
+ /* @__PURE__ */ jsxs(
103
+ "div",
104
+ {
105
+ className: "chat-history grid gap-3.75 max-h-[400px] overflow-auto mb-4",
106
+ "aria-live": "polite",
107
+ "aria-busy": busy,
108
+ children: [
109
+ !messages.length && /* @__PURE__ */ jsx("p", { className: "message assistant text-[0.8125rem] leading-[1.8] whitespace-pre-wrap [overflow-wrap:anywhere] [&.user]:bg-soft [&.user]:pt-3 [&.user]:pb-3 [&.user]:pl-4 [&.user]:pr-4 [&.user]:rounded-card [&.assistant]:[border-left:2px_solid_var(--accent)] [&.assistant]:pt-[0] [&.assistant]:pb-[0] [&.assistant]:pl-4 [&.assistant]:pr-4", children: "Wie kann ich Ihnen helfen?" }),
110
+ messages.map((m, i) => /* @__PURE__ */ jsxs(
111
+ "div",
112
+ {
113
+ className: "message text-[0.8125rem] leading-[1.8] whitespace-pre-wrap [overflow-wrap:anywhere] [&.user]:bg-soft [&.user]:pt-3 [&.user]:pb-3 [&.user]:pl-4 [&.user]:pr-4 [&.user]:rounded-card [&.assistant]:[border-left:2px_solid_var(--accent)] [&.assistant]:pt-[0] [&.assistant]:pb-[0] [&.assistant]:pl-4 [&.assistant]:pr-4 " + m.role,
114
+ children: [
115
+ /* @__PURE__ */ jsx("span", { className: "sr-only", children: m.role === "user" ? "Sie: " : "Assistent: " }),
116
+ m.content || "Antwort wird vorbereitet \u2026"
117
+ ]
118
+ },
119
+ i
120
+ ))
121
+ ]
122
+ }
123
+ ),
124
+ sources.length > 0 && /* @__PURE__ */ jsxs("div", { className: "sources text-[0.6875rem] text-muted mt-3.75 mb-3.75 ml-[0] mr-[0] [&_a]:mr-3", children: [
107
125
  "Referenzquellen:",
108
126
  " ",
109
127
  sources.map(
@@ -116,31 +134,45 @@ function Chat(ctx) {
116
134
  ] }, s.id)
117
135
  )
118
136
  ] }),
119
- /* @__PURE__ */ jsxs("form", { className: "chat-form", onSubmit: submit, children: [
120
- /* @__PURE__ */ jsx("label", { className: "sr-only", htmlFor: "chat-input", children: "Ihre Frage" }),
121
- /* @__PURE__ */ jsx(
122
- "textarea",
123
- {
124
- id: "chat-input",
125
- className: "search",
126
- value: input,
127
- maxLength: 4e3,
128
- onChange: (e) => setInput(e.target.value),
129
- placeholder: "Ihre Frage an unser Team \u2026",
130
- required: true
131
- }
132
- ),
133
- /* @__PURE__ */ jsx(
134
- "button",
135
- {
136
- type: "submit",
137
- disabled: busy || !input.trim(),
138
- "aria-label": "Frage senden",
139
- children: "\u2191"
140
- }
141
- )
142
- ] }),
143
- error && /* @__PURE__ */ jsx("p", { className: "chat-error", role: "alert", children: error })
137
+ /* @__PURE__ */ jsxs(
138
+ "form",
139
+ {
140
+ className: "chat-form flex gap-2.5 items-end [&_textarea]:resize-y [&_textarea]:min-h-[50px] [&_textarea]:[flex:1] [&_textarea]:min-w-0 [&_button]:bg-accent [&_button]:text-accent-ink [&_button]:[border:0] [&_button]:w-[50px] [&_button]:h-[50px] [&_button]:rounded-card [&_button]:text-[1.25rem] [&_button:disabled]:opacity-[0.5]",
141
+ onSubmit: submit,
142
+ children: [
143
+ /* @__PURE__ */ jsx("label", { className: "sr-only", htmlFor: "chat-input", children: "Ihre Frage" }),
144
+ /* @__PURE__ */ jsx(
145
+ "textarea",
146
+ {
147
+ id: "chat-input",
148
+ className: "search bg-card border border-line rounded-card py-3.5 px-4.5 text-ink w-full",
149
+ value: input,
150
+ maxLength: 4e3,
151
+ onChange: (e) => setInput(e.target.value),
152
+ placeholder: "Ihre Frage an unser Team \u2026",
153
+ required: true
154
+ }
155
+ ),
156
+ /* @__PURE__ */ jsx(
157
+ "button",
158
+ {
159
+ type: "submit",
160
+ disabled: busy || !input.trim(),
161
+ "aria-label": "Frage senden",
162
+ children: "\u2191"
163
+ }
164
+ )
165
+ ]
166
+ }
167
+ ),
168
+ error && /* @__PURE__ */ jsx(
169
+ "p",
170
+ {
171
+ className: "chat-error text-danger dark:text-warning text-[0.75rem]",
172
+ role: "alert",
173
+ children: error
174
+ }
175
+ )
144
176
  ] })
145
177
  ] });
146
178
  }
package/dist/{chunk-A54AKMRB.js → chunk-PQWU3SII.js} RENAMED
@@ -1,7 +1,7 @@
1
1
  // package.json
2
2
  var cspPlugin = {
3
3
  id: "chat",
4
- sdkVersion: "^0.3.0",
4
+ sdkVersion: "^0.5.0",
5
5
  browser: "./browser",
6
6
  server: "./server"
7
7
  };
package/dist/server.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  cspPlugin
3
- } from "./chunk-A54AKMRB.js";
3
+ } from "./chunk-PQWU3SII.js";
4
4
 
5
5
  // src/server.ts
6
6
  import { z } from "zod";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kieksme/csp-plugin-chat",
3
- "version": "0.3.0",
3
+ "version": "0.5.0",
4
4
  "type": "module",
5
5
  "license": "MIT",
6
6
  "files": [
@@ -22,7 +22,7 @@
22
22
  "registry": "https://registry.npmjs.org"
23
23
  },
24
24
  "dependencies": {
25
- "@kieksme/csp-sdk": "^0.3.0",
25
+ "@kieksme/csp-sdk": "^0.5.0",
26
26
  "zod": "^3.25.76",
27
27
  "openai": "^6.3.0"
28
28
  },
@@ -34,7 +34,7 @@
34
34
  },
35
35
  "cspPlugin": {
36
36
  "id": "chat",
37
- "sdkVersion": "^0.3.0",
37
+ "sdkVersion": "^0.5.0",
38
38
  "browser": "./browser",
39
39
  "server": "./server"
40
40
  },