@ai-coding-agent/react-assistant 0.1.1 → 0.1.3

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.
@@ -1,40 +1,8 @@
1
1
  import { default as React } from 'react';
2
- /**
3
- * 悬浮按钮的 Props 接口
4
- *
5
- * 属性说明:
6
- * - isOpen: 聊天窗口是否打开
7
- * - onClick: 点击事件处理函数
8
- * - position: 按钮在屏幕上的位置
9
- */
10
2
  interface FloatingButtonProps {
11
3
  isOpen: boolean;
12
4
  onClick: () => void;
13
5
  position?: 'bottom-right' | 'bottom-left';
14
6
  }
15
- /**
16
- * 悬浮按钮组件
17
- *
18
- * 参数说明:
19
- * - isOpen: 控制显示的图标类型
20
- * * true: 显示关闭图标 (X)
21
- * * false: 显示聊天图标
22
- *
23
- * - onClick: 点击按钮时调用的函数
24
- * * 通常用于切换聊天窗口的显示/隐藏
25
- *
26
- * - position: 按钮位置(可选,默认 'bottom-right')
27
- * * 'bottom-right': 右下角(推荐)
28
- * * 'bottom-left': 左下角
29
- *
30
- * 样式说明:
31
- * - fixed: 固定定位
32
- * - w-14 h-14: 宽高 56px
33
- * - bg-gradient-to-r: 渐变背景
34
- * - shadow-lg: 大阴影
35
- * - hover:scale-110: 悬停时放大 10%
36
- * - transition-all: 平滑过渡动画
37
- * - z-50: 层级 50(确保在最上层)
38
- */
39
7
  export declare const FloatingButton: React.FC<FloatingButtonProps>;
40
8
  export {};
package/dist/index.js CHANGED
@@ -1,60 +1,205 @@
1
1
  import { useCallback as e, useEffect as t, useRef as n, useState as r } from "react";
2
2
  import { Fragment as i, jsx as a, jsxs as o } from "react/jsx-runtime";
3
3
  //#region src/components/FloatingButton.tsx
4
- var s = ({ isOpen: e, onClick: t, position: n = "bottom-right" }) => /* @__PURE__ */ a("button", {
5
- onClick: t,
6
- className: `fixed ${n === "bottom-right" ? "right-6 bottom-6" : "left-6 bottom-6"} w-14 h-14 bg-gradient-to-r from-blue-500 to-purple-600 text-white rounded-full shadow-lg hover:shadow-xl transform hover:scale-110 transition-all duration-300 flex items-center justify-center z-50`,
7
- "aria-label": "Toggle chat",
8
- children: e ? /* @__PURE__ */ a("svg", {
9
- className: "w-6 h-6",
10
- fill: "none",
11
- stroke: "currentColor",
12
- viewBox: "0 0 24 24",
13
- children: /* @__PURE__ */ a("path", {
14
- strokeLinecap: "round",
15
- strokeLinejoin: "round",
16
- strokeWidth: 2,
17
- d: "M6 18L18 6M6 6l12 12"
18
- })
19
- }) : /* @__PURE__ */ a("svg", {
20
- className: "w-6 h-6",
21
- fill: "none",
22
- stroke: "currentColor",
23
- viewBox: "0 0 24 24",
24
- children: /* @__PURE__ */ a("path", {
25
- strokeLinecap: "round",
26
- strokeLinejoin: "round",
27
- strokeWidth: 2,
28
- d: "M8 10h.01M12 10h.01M16 10h.01M9 16H5a2 2 0 01-2-2V6a2 2 0 012-2h14a2 2 0 012 2v8a2 2 0 01-2 2h-5l-5 5v-5z"
4
+ var s = ({ isOpen: e, onClick: t, position: n = "bottom-right" }) => {
5
+ let r = {
6
+ ...n === "bottom-right" ? {
7
+ right: 24,
8
+ bottom: 24
9
+ } : {
10
+ left: 24,
11
+ bottom: 24
12
+ },
13
+ position: "fixed",
14
+ width: 56,
15
+ height: 56,
16
+ borderRadius: "50%",
17
+ background: "linear-gradient(to right, #3b82f6, #8b5cf6)",
18
+ color: "white",
19
+ border: "none",
20
+ boxShadow: "0 4px 6px rgba(0, 0, 0, 0.1)",
21
+ cursor: "pointer",
22
+ transition: "all 0.3s ease",
23
+ display: "flex",
24
+ alignItems: "center",
25
+ justifyContent: "center"
26
+ }, i = {
27
+ transform: "scale(1.1)",
28
+ boxShadow: "0 10px 15px rgba(0, 0, 0, 0.2)"
29
+ };
30
+ return /* @__PURE__ */ a("button", {
31
+ onClick: t,
32
+ style: r,
33
+ onMouseEnter: (e) => {
34
+ let t = e.target;
35
+ Object.assign(t.style, i);
36
+ },
37
+ onMouseLeave: (e) => {
38
+ let t = e.target;
39
+ t.style.transform = "scale(1)", t.style.boxShadow = "0 4px 6px rgba(0, 0, 0, 0.1)";
40
+ },
41
+ "aria-label": "Toggle chat",
42
+ children: e ? /* @__PURE__ */ a("svg", {
43
+ width: 24,
44
+ height: 24,
45
+ fill: "none",
46
+ stroke: "currentColor",
47
+ viewBox: "0 0 24 24",
48
+ children: /* @__PURE__ */ a("path", {
49
+ strokeLinecap: "round",
50
+ strokeLinejoin: "round",
51
+ strokeWidth: 2,
52
+ d: "M6 18L18 6M6 6l12 12"
53
+ })
54
+ }) : /* @__PURE__ */ a("svg", {
55
+ width: 24,
56
+ height: 24,
57
+ fill: "none",
58
+ stroke: "currentColor",
59
+ viewBox: "0 0 24 24",
60
+ children: /* @__PURE__ */ a("path", {
61
+ strokeLinecap: "round",
62
+ strokeLinejoin: "round",
63
+ strokeWidth: 2,
64
+ d: "M8 10h.01M12 10h.01M16 10h.01M9 16H5a2 2 0 01-2-2V6a2 2 0 012-2h14a2 2 0 012 2v8a2 2 0 01-2 2h-5l-5 5v-5z"
65
+ })
29
66
  })
30
- })
31
- }), c = ({ messages: e, isLoading: i, onSendMessage: s, onClose: c, position: l = "bottom-right" }) => {
32
- let [u, d] = r(""), f = n(null), p = () => {
33
- f.current?.scrollIntoView({ behavior: "smooth" });
67
+ });
68
+ }, c = ({ messages: e, isLoading: s, onSendMessage: c, onClose: l, position: u = "bottom-right" }) => {
69
+ let [d, f] = r(""), p = n(null), m = () => {
70
+ p.current?.scrollIntoView({ behavior: "smooth" });
34
71
  };
35
72
  t(() => {
36
- p();
73
+ m();
37
74
  }, [e]);
38
- let m = (e) => {
39
- e.preventDefault(), u.trim() && !i && (s(u.trim()), d(""));
75
+ let h = (e) => {
76
+ e.preventDefault(), d.trim() && !s && (c(d.trim()), f(""));
77
+ }, g = {
78
+ ...u === "bottom-right" ? { right: 0 } : { left: 0 },
79
+ position: "fixed",
80
+ bottom: 80,
81
+ width: 384,
82
+ height: 500,
83
+ backgroundColor: "white",
84
+ borderRadius: 8,
85
+ boxShadow: "0 4px 6px rgba(0, 0, 0, 0.1)",
86
+ display: "flex",
87
+ flexDirection: "column",
88
+ overflow: "hidden",
89
+ border: "1px solid #e5e7eb",
90
+ zIndex: 50
91
+ }, _ = {
92
+ background: "linear-gradient(to right, #3b82f6, #8b5cf6)",
93
+ color: "white",
94
+ padding: "12px 16px",
95
+ display: "flex",
96
+ justifyContent: "space-between",
97
+ alignItems: "center"
98
+ }, v = {
99
+ margin: 0,
100
+ fontSize: 18,
101
+ fontWeight: 600
102
+ }, y = {
103
+ margin: 0,
104
+ fontSize: 12,
105
+ opacity: .9
106
+ }, b = {
107
+ background: "none",
108
+ border: "none",
109
+ color: "white",
110
+ cursor: "pointer",
111
+ padding: 4,
112
+ borderRadius: 4,
113
+ transition: "background 0.2s"
114
+ }, x = {
115
+ flex: 1,
116
+ overflowY: "auto",
117
+ padding: 16,
118
+ display: "flex",
119
+ flexDirection: "column",
120
+ gap: 16,
121
+ backgroundColor: "#f9fafb"
122
+ }, S = (e) => ({
123
+ display: "flex",
124
+ justifyContent: e === "user" ? "flex-end" : "flex-start"
125
+ }), C = (e) => ({
126
+ maxWidth: "80%",
127
+ padding: "8px 16px",
128
+ borderRadius: 16,
129
+ ...e === "user" && {
130
+ backgroundColor: "#3b82f6",
131
+ color: "white"
132
+ },
133
+ ...e === "assistant" && {
134
+ backgroundColor: "white",
135
+ color: "#1f2937",
136
+ border: "1px solid #e5e7eb"
137
+ }
138
+ }), w = {
139
+ fontSize: 11,
140
+ opacity: .7,
141
+ marginTop: 4,
142
+ display: "block"
143
+ }, T = {
144
+ padding: 16,
145
+ backgroundColor: "white",
146
+ borderTop: "1px solid #e5e7eb",
147
+ display: "flex",
148
+ gap: 8
149
+ }, E = {
150
+ flex: 1,
151
+ padding: "8px 16px",
152
+ border: "1px solid #d1d5db",
153
+ borderRadius: 9999,
154
+ outline: "none",
155
+ fontSize: 14
156
+ }, D = {
157
+ ...E,
158
+ borderColor: "#3b82f6",
159
+ boxShadow: "0 0 0 3px rgba(59, 130, 246, 0.1)"
160
+ }, O = () => {
161
+ let e = {
162
+ padding: "8px 16px",
163
+ backgroundColor: "#3b82f6",
164
+ color: "white",
165
+ border: "none",
166
+ borderRadius: 9999,
167
+ cursor: "pointer",
168
+ fontSize: 14,
169
+ transition: "background 0.2s"
170
+ };
171
+ return s || !d.trim() ? {
172
+ ...e,
173
+ opacity: .5,
174
+ cursor: "not-allowed"
175
+ } : e;
176
+ }, k = {
177
+ width: 8,
178
+ height: 8,
179
+ borderRadius: "50%",
180
+ backgroundColor: "#9ca3af",
181
+ animationName: "bounce",
182
+ animationDuration: "1s",
183
+ animationIterationCount: "infinite"
40
184
  };
41
- return /* @__PURE__ */ o("div", {
42
- className: `fixed bottom-20 ${l === "bottom-right" ? "right-0" : "left-0"} w-96 h-[500px] bg-white rounded-lg shadow-2xl flex flex-col overflow-hidden border border-gray-200`,
185
+ return /* @__PURE__ */ o(i, { children: [/* @__PURE__ */ a("style", { children: "\n @keyframes bounce {\n 0%, 100% {\n transform: translateY(0);\n }\n 50% {\n transform: translateY(-10px);\n }\n }\n @keyframes spin {\n to {\n transform: rotate(360deg);\n }\n }\n .spinner {\n animation: spin 1s linear infinite;\n }\n " }), /* @__PURE__ */ o("div", {
186
+ style: g,
43
187
  children: [
44
188
  /* @__PURE__ */ o("div", {
45
- className: "bg-gradient-to-r from-blue-500 to-purple-600 text-white px-4 py-3 flex justify-between items-center",
189
+ style: _,
46
190
  children: [/* @__PURE__ */ o("div", { children: [/* @__PURE__ */ a("h3", {
47
- className: "font-semibold text-lg",
191
+ style: v,
48
192
  children: "AI Coding Assistant"
49
193
  }), /* @__PURE__ */ a("p", {
50
- className: "text-xs text-blue-100",
194
+ style: y,
51
195
  children: "Ask me about your code"
52
196
  })] }), /* @__PURE__ */ a("button", {
53
- onClick: c,
54
- className: "text-white hover:bg-white/20 rounded-full p-1 transition-colors",
197
+ onClick: l,
198
+ style: b,
55
199
  "aria-label": "Close chat",
56
200
  children: /* @__PURE__ */ a("svg", {
57
- className: "w-5 h-5",
201
+ width: 20,
202
+ height: 20,
58
203
  fill: "none",
59
204
  stroke: "currentColor",
60
205
  viewBox: "0 0 24 24",
@@ -68,13 +213,22 @@ var s = ({ isOpen: e, onClick: t, position: n = "bottom-right" }) => /* @__PURE_
68
213
  })]
69
214
  }),
70
215
  /* @__PURE__ */ o("div", {
71
- className: "flex-1 overflow-y-auto p-4 space-y-4 bg-gray-50",
216
+ style: x,
72
217
  children: [
73
218
  e.length === 0 ? /* @__PURE__ */ o("div", {
74
- className: "text-center text-gray-500 mt-10",
219
+ style: {
220
+ textAlign: "center",
221
+ color: "#6b7280",
222
+ marginTop: 40
223
+ },
75
224
  children: [
76
225
  /* @__PURE__ */ a("svg", {
77
- className: "w-16 h-16 mx-auto mb-4 text-gray-300",
226
+ width: 64,
227
+ height: 64,
228
+ style: {
229
+ margin: "0 auto 16px",
230
+ color: "#d1d5db"
231
+ },
78
232
  fill: "none",
79
233
  stroke: "currentColor",
80
234
  viewBox: "0 0 24 24",
@@ -86,102 +240,115 @@ var s = ({ isOpen: e, onClick: t, position: n = "bottom-right" }) => /* @__PURE_
86
240
  })
87
241
  }),
88
242
  /* @__PURE__ */ a("p", {
89
- className: "text-sm",
243
+ style: {
244
+ margin: 0,
245
+ fontSize: 14
246
+ },
90
247
  children: "你好!我是你的代码助手。"
91
248
  }),
92
249
  /* @__PURE__ */ a("p", {
93
- className: "text-xs mt-1",
250
+ style: {
251
+ margin: 0,
252
+ fontSize: 12,
253
+ marginTop: 4
254
+ },
94
255
  children: "问我关于这个代码库的任何问题"
95
256
  })
96
257
  ]
97
258
  }) : e.map((e) => /* @__PURE__ */ a("div", {
98
- className: `flex ${e.role === "user" ? "justify-end" : "justify-start"}`,
259
+ style: S(e.role),
99
260
  children: /* @__PURE__ */ o("div", {
100
- className: `max-w-[80%] rounded-2xl px-4 py-2 ${e.role === "user" ? "bg-blue-500 text-white" : "bg-white text-gray-800 border border-gray-200"}`,
261
+ style: C(e.role),
101
262
  children: [/* @__PURE__ */ a("p", {
102
- className: "text-sm whitespace-pre-wrap break-words",
263
+ style: {
264
+ margin: 0,
265
+ fontSize: 14,
266
+ whiteSpace: "pre-wrap",
267
+ wordBreak: "break-word"
268
+ },
103
269
  children: e.content
104
270
  }), /* @__PURE__ */ a("span", {
105
- className: "text-xs opacity-70 mt-1 block",
271
+ style: w,
106
272
  children: new Date(e.timestamp).toLocaleTimeString()
107
273
  })]
108
274
  })
109
275
  }, e.id)),
110
- i && /* @__PURE__ */ a("div", {
111
- className: "flex justify-start",
276
+ s && /* @__PURE__ */ a("div", {
277
+ style: S("assistant"),
112
278
  children: /* @__PURE__ */ a("div", {
113
- className: "bg-white border border-gray-200 rounded-2xl px-4 py-3",
279
+ style: C("assistant"),
114
280
  children: /* @__PURE__ */ o("div", {
115
- className: "flex space-x-2",
281
+ style: {
282
+ display: "flex",
283
+ gap: 8
284
+ },
116
285
  children: [
117
- /* @__PURE__ */ a("div", {
118
- className: "w-2 h-2 bg-gray-400 rounded-full animate-bounce",
119
- style: { animationDelay: "0ms" }
120
- }),
121
- /* @__PURE__ */ a("div", {
122
- className: "w-2 h-2 bg-gray-400 rounded-full animate-bounce",
123
- style: { animationDelay: "150ms" }
124
- }),
125
- /* @__PURE__ */ a("div", {
126
- className: "w-2 h-2 bg-gray-400 rounded-full animate-bounce",
127
- style: { animationDelay: "300ms" }
128
- })
286
+ /* @__PURE__ */ a("div", { style: k }),
287
+ /* @__PURE__ */ a("div", { style: {
288
+ ...k,
289
+ animationDelay: "150ms"
290
+ } }),
291
+ /* @__PURE__ */ a("div", { style: {
292
+ ...k,
293
+ animationDelay: "300ms"
294
+ } })
129
295
  ]
130
296
  })
131
297
  })
132
298
  }),
133
- /* @__PURE__ */ a("div", { ref: f })
299
+ /* @__PURE__ */ a("div", { ref: p })
134
300
  ]
135
301
  }),
136
- /* @__PURE__ */ a("form", {
137
- onSubmit: m,
138
- className: "p-4 bg-white border-t border-gray-200",
139
- children: /* @__PURE__ */ o("div", {
140
- className: "flex space-x-2",
141
- children: [/* @__PURE__ */ a("input", {
142
- type: "text",
143
- value: u,
144
- onChange: (e) => d(e.target.value),
145
- placeholder: "输入你的问题...",
146
- disabled: i,
147
- className: "flex-1 px-4 py-2 border border-gray-300 rounded-full focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent disabled:opacity-50 disabled:cursor-not-allowed"
148
- }), /* @__PURE__ */ a("button", {
149
- type: "submit",
150
- disabled: i || !u.trim(),
151
- className: "px-4 py-2 bg-blue-500 text-white rounded-full hover:bg-blue-600 disabled:opacity-50 disabled:cursor-not-allowed transition-colors",
152
- children: i ? /* @__PURE__ */ o("svg", {
153
- className: "w-5 h-5 animate-spin",
154
- fill: "none",
155
- viewBox: "0 0 24 24",
156
- children: [/* @__PURE__ */ a("circle", {
157
- className: "opacity-25",
158
- cx: "12",
159
- cy: "12",
160
- r: "10",
161
- stroke: "currentColor",
162
- strokeWidth: "4"
163
- }), /* @__PURE__ */ a("path", {
164
- className: "opacity-75",
165
- fill: "currentColor",
166
- d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
167
- })]
168
- }) : /* @__PURE__ */ a("svg", {
169
- className: "w-5 h-5",
170
- fill: "none",
302
+ /* @__PURE__ */ o("form", {
303
+ onSubmit: h,
304
+ style: T,
305
+ children: [/* @__PURE__ */ a("input", {
306
+ type: "text",
307
+ value: d,
308
+ onChange: (e) => f(e.target.value),
309
+ placeholder: "输入你的问题...",
310
+ disabled: s,
311
+ style: E,
312
+ onFocus: (e) => Object.assign(e.target.style, D),
313
+ onBlur: (e) => Object.assign(e.target.style, E)
314
+ }), /* @__PURE__ */ a("button", {
315
+ type: "submit",
316
+ disabled: s || !d.trim(),
317
+ style: O(),
318
+ children: s ? /* @__PURE__ */ o("svg", {
319
+ width: 20,
320
+ height: 20,
321
+ className: "spinner",
322
+ viewBox: "0 0 24 24",
323
+ children: [/* @__PURE__ */ a("circle", {
324
+ className: "opacity-25",
325
+ cx: "12",
326
+ cy: "12",
327
+ r: "10",
171
328
  stroke: "currentColor",
172
- viewBox: "0 0 24 24",
173
- children: /* @__PURE__ */ a("path", {
174
- strokeLinecap: "round",
175
- strokeLinejoin: "round",
176
- strokeWidth: 2,
177
- d: "M12 19l9 2-9-18-9 18 9-2zm0 0v-8"
178
- })
329
+ strokeWidth: "4"
330
+ }), /* @__PURE__ */ a("path", {
331
+ className: "opacity-75",
332
+ fill: "currentColor",
333
+ d: "M4 12a8 8 0 018-8V0C5.373 0 0 1 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
334
+ })]
335
+ }) : /* @__PURE__ */ a("svg", {
336
+ width: 20,
337
+ height: 20,
338
+ fill: "none",
339
+ stroke: "currentColor",
340
+ viewBox: "0 0 24 24",
341
+ children: /* @__PURE__ */ a("path", {
342
+ strokeLinecap: "round",
343
+ strokeLinejoin: "round",
344
+ strokeWidth: 2,
345
+ d: "M12 19l9 2-9-18-9-18 9 2-9 2zm0 0v-8"
179
346
  })
180
- })]
181
- })
347
+ })
348
+ })]
182
349
  })
183
350
  ]
184
- });
351
+ })] });
185
352
  };
186
353
  //#endregion
187
354
  //#region src/hooks/useChat.ts
@@ -232,7 +399,7 @@ function l(t) {
232
399
  //#endregion
233
400
  //#region src/index.tsx
234
401
  var u = (e) => {
235
- let [t, n] = r(!1), { messages: u, isLoading: d, error: f, sendMessage: p, clearMessages: m } = l(e);
402
+ let [t, n] = r(!1), { messages: u, isLoading: d, error: f, sendMessage: p } = l(e);
236
403
  return /* @__PURE__ */ o(i, { children: [
237
404
  /* @__PURE__ */ a(s, {
238
405
  isOpen: t,
@@ -1 +1,18 @@
1
- (function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require(`react`),require(`react/jsx-runtime`)):typeof define==`function`&&define.amd?define([`exports`,`react`,`react/jsx-runtime`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e.CodingAssistant={},e.React,e._jsx_runtime))})(this,function(e,t,n){Object.defineProperties(e,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});var r=Object.create,i=Object.defineProperty,a=Object.getOwnPropertyDescriptor,o=Object.getOwnPropertyNames,s=Object.getPrototypeOf,c=Object.prototype.hasOwnProperty,l=(e,t,n,r)=>{if(t&&typeof t==`object`||typeof t==`function`)for(var s=o(t),l=0,u=s.length,d;l<u;l++)d=s[l],!c.call(e,d)&&d!==n&&i(e,d,{get:(e=>t[e]).bind(null,d),enumerable:!(r=a(t,d))||r.enumerable});return e};t=((e,t,n)=>(n=e==null?{}:r(s(e)),l(t||!e||!e.__esModule?i(n,`default`,{value:e,enumerable:!0}):n,e)))(t);var u=({isOpen:e,onClick:t,position:r=`bottom-right`})=>(0,n.jsx)(`button`,{onClick:t,className:`fixed ${r===`bottom-right`?`right-6 bottom-6`:`left-6 bottom-6`} w-14 h-14 bg-gradient-to-r from-blue-500 to-purple-600 text-white rounded-full shadow-lg hover:shadow-xl transform hover:scale-110 transition-all duration-300 flex items-center justify-center z-50`,"aria-label":`Toggle chat`,children:e?(0,n.jsx)(`svg`,{className:`w-6 h-6`,fill:`none`,stroke:`currentColor`,viewBox:`0 0 24 24`,children:(0,n.jsx)(`path`,{strokeLinecap:`round`,strokeLinejoin:`round`,strokeWidth:2,d:`M6 18L18 6M6 6l12 12`})}):(0,n.jsx)(`svg`,{className:`w-6 h-6`,fill:`none`,stroke:`currentColor`,viewBox:`0 0 24 24`,children:(0,n.jsx)(`path`,{strokeLinecap:`round`,strokeLinejoin:`round`,strokeWidth:2,d:`M8 10h.01M12 10h.01M16 10h.01M9 16H5a2 2 0 01-2-2V6a2 2 0 012-2h14a2 2 0 012 2v8a2 2 0 01-2 2h-5l-5 5v-5z`})})}),d=({messages:e,isLoading:r,onSendMessage:i,onClose:a,position:o=`bottom-right`})=>{let[s,c]=(0,t.useState)(``),l=(0,t.useRef)(null),u=()=>{l.current?.scrollIntoView({behavior:`smooth`})};(0,t.useEffect)(()=>{u()},[e]);let d=e=>{e.preventDefault(),s.trim()&&!r&&(i(s.trim()),c(``))};return(0,n.jsxs)(`div`,{className:`fixed bottom-20 ${o===`bottom-right`?`right-0`:`left-0`} w-96 h-[500px] bg-white rounded-lg shadow-2xl flex flex-col overflow-hidden border border-gray-200`,children:[(0,n.jsxs)(`div`,{className:`bg-gradient-to-r from-blue-500 to-purple-600 text-white px-4 py-3 flex justify-between items-center`,children:[(0,n.jsxs)(`div`,{children:[(0,n.jsx)(`h3`,{className:`font-semibold text-lg`,children:`AI Coding Assistant`}),(0,n.jsx)(`p`,{className:`text-xs text-blue-100`,children:`Ask me about your code`})]}),(0,n.jsx)(`button`,{onClick:a,className:`text-white hover:bg-white/20 rounded-full p-1 transition-colors`,"aria-label":`Close chat`,children:(0,n.jsx)(`svg`,{className:`w-5 h-5`,fill:`none`,stroke:`currentColor`,viewBox:`0 0 24 24`,children:(0,n.jsx)(`path`,{strokeLinecap:`round`,strokeLinejoin:`round`,strokeWidth:2,d:`M6 18L18 6M6 6l12 12`})})})]}),(0,n.jsxs)(`div`,{className:`flex-1 overflow-y-auto p-4 space-y-4 bg-gray-50`,children:[e.length===0?(0,n.jsxs)(`div`,{className:`text-center text-gray-500 mt-10`,children:[(0,n.jsx)(`svg`,{className:`w-16 h-16 mx-auto mb-4 text-gray-300`,fill:`none`,stroke:`currentColor`,viewBox:`0 0 24 24`,children:(0,n.jsx)(`path`,{strokeLinecap:`round`,strokeLinejoin:`round`,strokeWidth:1.5,d:`M8 10h.01M12 10h.01M16 10h.01M9 16H5a2 2 0 01-2-2V6a2 2 0 012-2h14a2 2 0 012 2v8a2 2 0 01-2 2h-5l-5 5v-5z`})}),(0,n.jsx)(`p`,{className:`text-sm`,children:`你好!我是你的代码助手。`}),(0,n.jsx)(`p`,{className:`text-xs mt-1`,children:`问我关于这个代码库的任何问题`})]}):e.map(e=>(0,n.jsx)(`div`,{className:`flex ${e.role===`user`?`justify-end`:`justify-start`}`,children:(0,n.jsxs)(`div`,{className:`max-w-[80%] rounded-2xl px-4 py-2 ${e.role===`user`?`bg-blue-500 text-white`:`bg-white text-gray-800 border border-gray-200`}`,children:[(0,n.jsx)(`p`,{className:`text-sm whitespace-pre-wrap break-words`,children:e.content}),(0,n.jsx)(`span`,{className:`text-xs opacity-70 mt-1 block`,children:new Date(e.timestamp).toLocaleTimeString()})]})},e.id)),r&&(0,n.jsx)(`div`,{className:`flex justify-start`,children:(0,n.jsx)(`div`,{className:`bg-white border border-gray-200 rounded-2xl px-4 py-3`,children:(0,n.jsxs)(`div`,{className:`flex space-x-2`,children:[(0,n.jsx)(`div`,{className:`w-2 h-2 bg-gray-400 rounded-full animate-bounce`,style:{animationDelay:`0ms`}}),(0,n.jsx)(`div`,{className:`w-2 h-2 bg-gray-400 rounded-full animate-bounce`,style:{animationDelay:`150ms`}}),(0,n.jsx)(`div`,{className:`w-2 h-2 bg-gray-400 rounded-full animate-bounce`,style:{animationDelay:`300ms`}})]})})}),(0,n.jsx)(`div`,{ref:l})]}),(0,n.jsx)(`form`,{onSubmit:d,className:`p-4 bg-white border-t border-gray-200`,children:(0,n.jsxs)(`div`,{className:`flex space-x-2`,children:[(0,n.jsx)(`input`,{type:`text`,value:s,onChange:e=>c(e.target.value),placeholder:`输入你的问题...`,disabled:r,className:`flex-1 px-4 py-2 border border-gray-300 rounded-full focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent disabled:opacity-50 disabled:cursor-not-allowed`}),(0,n.jsx)(`button`,{type:`submit`,disabled:r||!s.trim(),className:`px-4 py-2 bg-blue-500 text-white rounded-full hover:bg-blue-600 disabled:opacity-50 disabled:cursor-not-allowed transition-colors`,children:r?(0,n.jsxs)(`svg`,{className:`w-5 h-5 animate-spin`,fill:`none`,viewBox:`0 0 24 24`,children:[(0,n.jsx)(`circle`,{className:`opacity-25`,cx:`12`,cy:`12`,r:`10`,stroke:`currentColor`,strokeWidth:`4`}),(0,n.jsx)(`path`,{className:`opacity-75`,fill:`currentColor`,d:`M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z`})]}):(0,n.jsx)(`svg`,{className:`w-5 h-5`,fill:`none`,stroke:`currentColor`,viewBox:`0 0 24 24`,children:(0,n.jsx)(`path`,{strokeLinecap:`round`,strokeLinejoin:`round`,strokeWidth:2,d:`M12 19l9 2-9-18-9 18 9-2zm0 0v-8`})})})]})})]})};function f(e){let[n,r]=(0,t.useState)([]),[i,a]=(0,t.useState)(!1),[o,s]=(0,t.useState)(null);return{messages:n,isLoading:i,error:o,sendMessage:(0,t.useCallback)(async t=>{let n={id:Date.now().toString(),role:`user`,content:t,timestamp:new Date};r(e=>[...e,n]),a(!0),s(null);try{let n=await fetch(`${e.apiUrl}/api/chat`,{method:`POST`,headers:{"Content-Type":`application/json`},body:JSON.stringify({message:t,repoUrl:e.repoUrl,accessToken:e.accessToken,branch:e.branch})});if(!n.ok)throw Error(`HTTP error! status: ${n.status}`);let i=await n.json(),a={id:(Date.now()+1).toString(),role:`assistant`,content:i.response,timestamp:new Date};r(e=>[...e,a])}catch(e){s(e instanceof Error?e.message:`Unknown error`),console.error(`Error sending message:`,e)}finally{a(!1)}},[e]),clearMessages:(0,t.useCallback)(()=>{r([]),s(null)},[])}}var p=e=>{let[r,i]=(0,t.useState)(!1),{messages:a,isLoading:o,error:s,sendMessage:c,clearMessages:l}=f(e);return(0,n.jsxs)(n.Fragment,{children:[(0,n.jsx)(u,{isOpen:r,onClick:()=>i(!r),position:e.position}),r&&(0,n.jsx)(d,{messages:a,isLoading:o,onSendMessage:c,onClose:()=>i(!1),position:e.position}),s&&(0,n.jsxs)(`div`,{className:`fixed top-4 right-4 bg-red-500 text-white px-4 py-2 rounded-lg shadow-lg z-50`,children:[`Error: `,s]})]})};e.CodingAssistant=p,e.default=p});
1
+ (function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require(`react`),require(`react/jsx-runtime`)):typeof define==`function`&&define.amd?define([`exports`,`react`,`react/jsx-runtime`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e.CodingAssistant={},e.React,e._jsx_runtime))})(this,function(e,t,n){Object.defineProperties(e,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});var r=Object.create,i=Object.defineProperty,a=Object.getOwnPropertyDescriptor,o=Object.getOwnPropertyNames,s=Object.getPrototypeOf,c=Object.prototype.hasOwnProperty,l=(e,t,n,r)=>{if(t&&typeof t==`object`||typeof t==`function`)for(var s=o(t),l=0,u=s.length,d;l<u;l++)d=s[l],!c.call(e,d)&&d!==n&&i(e,d,{get:(e=>t[e]).bind(null,d),enumerable:!(r=a(t,d))||r.enumerable});return e};t=((e,t,n)=>(n=e==null?{}:r(s(e)),l(t||!e||!e.__esModule?i(n,`default`,{value:e,enumerable:!0}):n,e)))(t);var u=({isOpen:e,onClick:t,position:r=`bottom-right`})=>{let i={...r===`bottom-right`?{right:24,bottom:24}:{left:24,bottom:24},position:`fixed`,width:56,height:56,borderRadius:`50%`,background:`linear-gradient(to right, #3b82f6, #8b5cf6)`,color:`white`,border:`none`,boxShadow:`0 4px 6px rgba(0, 0, 0, 0.1)`,cursor:`pointer`,transition:`all 0.3s ease`,display:`flex`,alignItems:`center`,justifyContent:`center`},a={transform:`scale(1.1)`,boxShadow:`0 10px 15px rgba(0, 0, 0, 0.2)`};return(0,n.jsx)(`button`,{onClick:t,style:i,onMouseEnter:e=>{let t=e.target;Object.assign(t.style,a)},onMouseLeave:e=>{let t=e.target;t.style.transform=`scale(1)`,t.style.boxShadow=`0 4px 6px rgba(0, 0, 0, 0.1)`},"aria-label":`Toggle chat`,children:e?(0,n.jsx)(`svg`,{width:24,height:24,fill:`none`,stroke:`currentColor`,viewBox:`0 0 24 24`,children:(0,n.jsx)(`path`,{strokeLinecap:`round`,strokeLinejoin:`round`,strokeWidth:2,d:`M6 18L18 6M6 6l12 12`})}):(0,n.jsx)(`svg`,{width:24,height:24,fill:`none`,stroke:`currentColor`,viewBox:`0 0 24 24`,children:(0,n.jsx)(`path`,{strokeLinecap:`round`,strokeLinejoin:`round`,strokeWidth:2,d:`M8 10h.01M12 10h.01M16 10h.01M9 16H5a2 2 0 01-2-2V6a2 2 0 012-2h14a2 2 0 012 2v8a2 2 0 01-2 2h-5l-5 5v-5z`})})})},d=({messages:e,isLoading:r,onSendMessage:i,onClose:a,position:o=`bottom-right`})=>{let[s,c]=(0,t.useState)(``),l=(0,t.useRef)(null),u=()=>{l.current?.scrollIntoView({behavior:`smooth`})};(0,t.useEffect)(()=>{u()},[e]);let d=e=>{e.preventDefault(),s.trim()&&!r&&(i(s.trim()),c(``))},f={...o===`bottom-right`?{right:0}:{left:0},position:`fixed`,bottom:80,width:384,height:500,backgroundColor:`white`,borderRadius:8,boxShadow:`0 4px 6px rgba(0, 0, 0, 0.1)`,display:`flex`,flexDirection:`column`,overflow:`hidden`,border:`1px solid #e5e7eb`,zIndex:50},p={background:`linear-gradient(to right, #3b82f6, #8b5cf6)`,color:`white`,padding:`12px 16px`,display:`flex`,justifyContent:`space-between`,alignItems:`center`},m={margin:0,fontSize:18,fontWeight:600},h={margin:0,fontSize:12,opacity:.9},g={background:`none`,border:`none`,color:`white`,cursor:`pointer`,padding:4,borderRadius:4,transition:`background 0.2s`},_={flex:1,overflowY:`auto`,padding:16,display:`flex`,flexDirection:`column`,gap:16,backgroundColor:`#f9fafb`},v=e=>({display:`flex`,justifyContent:e===`user`?`flex-end`:`flex-start`}),y=e=>({maxWidth:`80%`,padding:`8px 16px`,borderRadius:16,...e===`user`&&{backgroundColor:`#3b82f6`,color:`white`},...e===`assistant`&&{backgroundColor:`white`,color:`#1f2937`,border:`1px solid #e5e7eb`}}),b={fontSize:11,opacity:.7,marginTop:4,display:`block`},x={padding:16,backgroundColor:`white`,borderTop:`1px solid #e5e7eb`,display:`flex`,gap:8},S={flex:1,padding:`8px 16px`,border:`1px solid #d1d5db`,borderRadius:9999,outline:`none`,fontSize:14},C={...S,borderColor:`#3b82f6`,boxShadow:`0 0 0 3px rgba(59, 130, 246, 0.1)`},w=()=>{let e={padding:`8px 16px`,backgroundColor:`#3b82f6`,color:`white`,border:`none`,borderRadius:9999,cursor:`pointer`,fontSize:14,transition:`background 0.2s`};return r||!s.trim()?{...e,opacity:.5,cursor:`not-allowed`}:e},T={width:8,height:8,borderRadius:`50%`,backgroundColor:`#9ca3af`,animationName:`bounce`,animationDuration:`1s`,animationIterationCount:`infinite`};return(0,n.jsxs)(n.Fragment,{children:[(0,n.jsx)(`style`,{children:`
2
+ @keyframes bounce {
3
+ 0%, 100% {
4
+ transform: translateY(0);
5
+ }
6
+ 50% {
7
+ transform: translateY(-10px);
8
+ }
9
+ }
10
+ @keyframes spin {
11
+ to {
12
+ transform: rotate(360deg);
13
+ }
14
+ }
15
+ .spinner {
16
+ animation: spin 1s linear infinite;
17
+ }
18
+ `}),(0,n.jsxs)(`div`,{style:f,children:[(0,n.jsxs)(`div`,{style:p,children:[(0,n.jsxs)(`div`,{children:[(0,n.jsx)(`h3`,{style:m,children:`AI Coding Assistant`}),(0,n.jsx)(`p`,{style:h,children:`Ask me about your code`})]}),(0,n.jsx)(`button`,{onClick:a,style:g,"aria-label":`Close chat`,children:(0,n.jsx)(`svg`,{width:20,height:20,fill:`none`,stroke:`currentColor`,viewBox:`0 0 24 24`,children:(0,n.jsx)(`path`,{strokeLinecap:`round`,strokeLinejoin:`round`,strokeWidth:2,d:`M6 18L18 6M6 6l12 12`})})})]}),(0,n.jsxs)(`div`,{style:_,children:[e.length===0?(0,n.jsxs)(`div`,{style:{textAlign:`center`,color:`#6b7280`,marginTop:40},children:[(0,n.jsx)(`svg`,{width:64,height:64,style:{margin:`0 auto 16px`,color:`#d1d5db`},fill:`none`,stroke:`currentColor`,viewBox:`0 0 24 24`,children:(0,n.jsx)(`path`,{strokeLinecap:`round`,strokeLinejoin:`round`,strokeWidth:1.5,d:`M8 10h.01M12 10h.01M16 10h.01M9 16H5a2 2 0 01-2-2V6a2 2 0 012-2h14a2 2 0 012 2v8a2 2 0 01-2 2h-5l-5 5v-5z`})}),(0,n.jsx)(`p`,{style:{margin:0,fontSize:14},children:`你好!我是你的代码助手。`}),(0,n.jsx)(`p`,{style:{margin:0,fontSize:12,marginTop:4},children:`问我关于这个代码库的任何问题`})]}):e.map(e=>(0,n.jsx)(`div`,{style:v(e.role),children:(0,n.jsxs)(`div`,{style:y(e.role),children:[(0,n.jsx)(`p`,{style:{margin:0,fontSize:14,whiteSpace:`pre-wrap`,wordBreak:`break-word`},children:e.content}),(0,n.jsx)(`span`,{style:b,children:new Date(e.timestamp).toLocaleTimeString()})]})},e.id)),r&&(0,n.jsx)(`div`,{style:v(`assistant`),children:(0,n.jsx)(`div`,{style:y(`assistant`),children:(0,n.jsxs)(`div`,{style:{display:`flex`,gap:8},children:[(0,n.jsx)(`div`,{style:T}),(0,n.jsx)(`div`,{style:{...T,animationDelay:`150ms`}}),(0,n.jsx)(`div`,{style:{...T,animationDelay:`300ms`}})]})})}),(0,n.jsx)(`div`,{ref:l})]}),(0,n.jsxs)(`form`,{onSubmit:d,style:x,children:[(0,n.jsx)(`input`,{type:`text`,value:s,onChange:e=>c(e.target.value),placeholder:`输入你的问题...`,disabled:r,style:S,onFocus:e=>Object.assign(e.target.style,C),onBlur:e=>Object.assign(e.target.style,S)}),(0,n.jsx)(`button`,{type:`submit`,disabled:r||!s.trim(),style:w(),children:r?(0,n.jsxs)(`svg`,{width:20,height:20,className:`spinner`,viewBox:`0 0 24 24`,children:[(0,n.jsx)(`circle`,{className:`opacity-25`,cx:`12`,cy:`12`,r:`10`,stroke:`currentColor`,strokeWidth:`4`}),(0,n.jsx)(`path`,{className:`opacity-75`,fill:`currentColor`,d:`M4 12a8 8 0 018-8V0C5.373 0 0 1 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z`})]}):(0,n.jsx)(`svg`,{width:20,height:20,fill:`none`,stroke:`currentColor`,viewBox:`0 0 24 24`,children:(0,n.jsx)(`path`,{strokeLinecap:`round`,strokeLinejoin:`round`,strokeWidth:2,d:`M12 19l9 2-9-18-9-18 9 2-9 2zm0 0v-8`})})})]})]})]})};function f(e){let[n,r]=(0,t.useState)([]),[i,a]=(0,t.useState)(!1),[o,s]=(0,t.useState)(null);return{messages:n,isLoading:i,error:o,sendMessage:(0,t.useCallback)(async t=>{let n={id:Date.now().toString(),role:`user`,content:t,timestamp:new Date};r(e=>[...e,n]),a(!0),s(null);try{let n=await fetch(`${e.apiUrl}/api/chat`,{method:`POST`,headers:{"Content-Type":`application/json`},body:JSON.stringify({message:t,repoUrl:e.repoUrl,accessToken:e.accessToken,branch:e.branch})});if(!n.ok)throw Error(`HTTP error! status: ${n.status}`);let i=await n.json(),a={id:(Date.now()+1).toString(),role:`assistant`,content:i.response,timestamp:new Date};r(e=>[...e,a])}catch(e){s(e instanceof Error?e.message:`Unknown error`),console.error(`Error sending message:`,e)}finally{a(!1)}},[e]),clearMessages:(0,t.useCallback)(()=>{r([]),s(null)},[])}}var p=e=>{let[r,i]=(0,t.useState)(!1),{messages:a,isLoading:o,error:s,sendMessage:c}=f(e);return(0,n.jsxs)(n.Fragment,{children:[(0,n.jsx)(u,{isOpen:r,onClick:()=>i(!r),position:e.position}),r&&(0,n.jsx)(d,{messages:a,isLoading:o,onSendMessage:c,onClose:()=>i(!1),position:e.position}),s&&(0,n.jsxs)(`div`,{className:`fixed top-4 right-4 bg-red-500 text-white px-4 py-2 rounded-lg shadow-lg z-50`,children:[`Error: `,s]})]})};e.CodingAssistant=p,e.default=p});
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ai-coding-agent/react-assistant",
3
- "version": "0.1.1",
3
+ "version": "0.1.3",
4
4
  "description": "AI-powered coding assistant for React applications",
5
5
  "type": "module",
6
6
  "main": "./dist/index.js",
@@ -44,9 +44,6 @@
44
44
  "@types/react": "^19.2.14",
45
45
  "@types/react-dom": "^19.2.3",
46
46
  "@vitejs/plugin-react": "^6.0.1",
47
- "autoprefixer": "^10.4.21",
48
- "postcss": "^8.5.3",
49
- "tailwindcss": "^3.4.1",
50
47
  "typescript": "~5.9.3",
51
48
  "vite": "^8.0.1",
52
49
  "vite-plugin-dts": "^4.5.3"
package/dist/index.css DELETED
@@ -1,2 +0,0 @@
1
- *,:before,:after,::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#3b82f680;--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }*,:before,:after{box-sizing:border-box;border:0 solid #e5e7eb}:before,:after{--tw-content:""}html,:host{-webkit-text-size-adjust:100%;tab-size:4;font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent;font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;line-height:1.5}body{line-height:inherit;margin:0}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-feature-settings:normal;font-variation-settings:normal;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-feature-settings:inherit;font-variation-settings:inherit;font-family:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:#0000;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{margin:0;padding:0;list-style:none}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder{opacity:1;color:#9ca3af}textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}.fixed{position:fixed}.bottom-20{bottom:5rem}.bottom-6{bottom:1.5rem}.left-0{left:0}.left-6{left:1.5rem}.right-0{right:0}.right-4{right:1rem}.right-6{right:1.5rem}.top-4{top:1rem}.z-50{z-index:50}.mx-auto{margin-left:auto;margin-right:auto}.mb-4{margin-bottom:1rem}.mt-1{margin-top:.25rem}.mt-10{margin-top:2.5rem}.block{display:block}.flex{display:flex}.h-14{height:3.5rem}.h-16{height:4rem}.h-2{height:.5rem}.h-5{height:1.25rem}.h-6{height:1.5rem}.h-\[500px\]{height:500px}.w-14{width:3.5rem}.w-16{width:4rem}.w-2{width:.5rem}.w-5{width:1.25rem}.w-6{width:1.5rem}.w-96{width:24rem}.max-w-\[80\%\]{max-width:80%}.flex-1{flex:1}.transform{transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}@keyframes bounce{0%,to{animation-timing-function:cubic-bezier(.8,0,1,1);transform:translateY(-25%)}50%{animation-timing-function:cubic-bezier(0,0,.2,1);transform:none}}.animate-bounce{animation:1s infinite bounce}@keyframes spin{to{transform:rotate(360deg)}}.animate-spin{animation:1s linear infinite spin}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-start{justify-content:flex-start}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.space-x-2>:not([hidden])~:not([hidden]){--tw-space-x-reverse:0;margin-right:calc(.5rem * var(--tw-space-x-reverse));margin-left:calc(.5rem * calc(1 - var(--tw-space-x-reverse)))}.space-y-4>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem * var(--tw-space-y-reverse))}.overflow-hidden{overflow:hidden}.overflow-y-auto{overflow-y:auto}.whitespace-pre-wrap{white-space:pre-wrap}.break-words{overflow-wrap:break-word}.rounded-2xl{border-radius:1rem}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:.5rem}.border{border-width:1px}.border-t{border-top-width:1px}.border-gray-200{--tw-border-opacity:1;border-color:rgb(229 231 235/var(--tw-border-opacity,1))}.border-gray-300{--tw-border-opacity:1;border-color:rgb(209 213 219/var(--tw-border-opacity,1))}.bg-blue-500{--tw-bg-opacity:1;background-color:rgb(59 130 246/var(--tw-bg-opacity,1))}.bg-gray-400{--tw-bg-opacity:1;background-color:rgb(156 163 175/var(--tw-bg-opacity,1))}.bg-gray-50{--tw-bg-opacity:1;background-color:rgb(249 250 251/var(--tw-bg-opacity,1))}.bg-red-500{--tw-bg-opacity:1;background-color:rgb(239 68 68/var(--tw-bg-opacity,1))}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))}.bg-gradient-to-r{background-image:linear-gradient(to right, var(--tw-gradient-stops))}.from-blue-500{--tw-gradient-from:#3b82f6 var(--tw-gradient-from-position);--tw-gradient-to:#3b82f600 var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from), var(--tw-gradient-to)}.to-purple-600{--tw-gradient-to:#9333ea var(--tw-gradient-to-position)}.p-1{padding:.25rem}.p-4{padding:1rem}.px-4{padding-left:1rem;padding-right:1rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.text-center{text-align:center}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-xs{font-size:.75rem;line-height:1rem}.font-semibold{font-weight:600}.text-blue-100{--tw-text-opacity:1;color:rgb(219 234 254/var(--tw-text-opacity,1))}.text-gray-300{--tw-text-opacity:1;color:rgb(209 213 219/var(--tw-text-opacity,1))}.text-gray-500{--tw-text-opacity:1;color:rgb(107 114 128/var(--tw-text-opacity,1))}.text-gray-800{--tw-text-opacity:1;color:rgb(31 41 55/var(--tw-text-opacity,1))}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.opacity-25{opacity:.25}.opacity-70{opacity:.7}.opacity-75{opacity:.75}.shadow-2xl{--tw-shadow:0 25px 50px -12px #00000040;--tw-shadow-colored:0 25px 50px -12px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000), var(--tw-ring-shadow,0 0 #0000), var(--tw-shadow)}.shadow-lg{--tw-shadow:0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a;--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000), var(--tw-ring-shadow,0 0 #0000), var(--tw-shadow)}.transition-all{transition-property:all;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-300{transition-duration:.3s}.hover\:scale-110:hover{--tw-scale-x:1.1;--tw-scale-y:1.1;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.hover\:bg-blue-600:hover{--tw-bg-opacity:1;background-color:rgb(37 99 235/var(--tw-bg-opacity,1))}.hover\:bg-white\/20:hover{background-color:#fff3}.hover\:shadow-xl:hover{--tw-shadow:0 20px 25px -5px #0000001a, 0 8px 10px -6px #0000001a;--tw-shadow-colored:0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000), var(--tw-ring-shadow,0 0 #0000), var(--tw-shadow)}.focus\:border-transparent:focus{border-color:#0000}.focus\:outline-none:focus{outline-offset:2px;outline:2px solid #0000}.focus\:ring-2:focus{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow,0 0 #0000)}.focus\:ring-blue-500:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(59 130 246/var(--tw-ring-opacity,1))}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:opacity-50:disabled{opacity:.5}
2
- /*$vite$:1*/