hanbiro-react16-sdk 1.0.25 → 1.0.27

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 (40) hide show
  1. package/dist/components/ChatAIDraft/ChatInput.d.ts +27 -0
  2. package/dist/components/ChatAIDraft/ChatInput.js +190 -0
  3. package/dist/components/ChatAIDraft/ChatList/AIAvatar.d.ts +3 -0
  4. package/dist/components/ChatAIDraft/ChatList/AIAvatar.js +24 -0
  5. package/dist/components/ChatAIDraft/ChatList/LoadingDots.d.ts +6 -0
  6. package/dist/components/ChatAIDraft/ChatList/LoadingDots.js +24 -0
  7. package/dist/components/ChatAIDraft/ChatList/MessageItem.d.ts +11 -0
  8. package/dist/components/ChatAIDraft/ChatList/MessageItem.js +124 -0
  9. package/dist/components/ChatAIDraft/ChatList/helpers.d.ts +1 -0
  10. package/dist/components/ChatAIDraft/ChatList/helpers.js +35 -0
  11. package/dist/components/ChatAIDraft/ChatList/index.d.ts +11 -0
  12. package/dist/components/ChatAIDraft/ChatList/index.js +36 -0
  13. package/dist/components/ChatAIDraft/{EmptyState.js → CreatePanel/EmptyState.js} +4 -4
  14. package/dist/components/ChatAIDraft/CreatePanel/index.d.ts +30 -0
  15. package/dist/components/ChatAIDraft/CreatePanel/index.js +173 -0
  16. package/dist/components/ChatAIDraft/ReplyPanel/EmptyState.d.ts +10 -0
  17. package/dist/components/ChatAIDraft/ReplyPanel/EmptyState.js +365 -0
  18. package/dist/components/ChatAIDraft/ReplyPanel/MailListSelect.d.ts +26 -0
  19. package/dist/components/ChatAIDraft/ReplyPanel/MailListSelect.js +480 -0
  20. package/dist/components/ChatAIDraft/ReplyPanel/helper.d.ts +13 -0
  21. package/dist/components/ChatAIDraft/ReplyPanel/helper.js +100 -0
  22. package/dist/components/ChatAIDraft/ReplyPanel/index.d.ts +46 -0
  23. package/dist/components/ChatAIDraft/ReplyPanel/index.js +465 -0
  24. package/dist/components/ChatAIDraft/helper.d.ts +1 -0
  25. package/dist/components/ChatAIDraft/helper.js +12 -1
  26. package/dist/components/ChatAIDraft/index.d.ts +4 -32
  27. package/dist/components/ChatAIDraft/index.js +19 -307
  28. package/dist/components/ChatAIDraft/types.d.ts +36 -0
  29. package/dist/hanbiro-react16-sdk.style.css +41 -1
  30. package/dist/hanbiro-react16-sdk.umd.js +5143 -3379
  31. package/dist/index.js +1 -1
  32. package/dist/node_modules/react-feather/dist/icons/arrow-left.js +73 -0
  33. package/dist/node_modules/react-feather/dist/icons/lock.js +75 -0
  34. package/dist/node_modules/react-feather/dist/icons/mail.js +70 -0
  35. package/dist/node_modules/react-feather/dist/icons/paperclip.js +68 -0
  36. package/dist/node_modules/react-feather/dist/icons/plus.js +76 -0
  37. package/package.json +1 -1
  38. package/dist/components/ChatAIDraft/List.d.ts +0 -10
  39. package/dist/components/ChatAIDraft/List.js +0 -188
  40. /package/dist/components/ChatAIDraft/{EmptyState.d.ts → CreatePanel/EmptyState.d.ts} +0 -0
@@ -1,6 +1,4 @@
1
1
  var __defProp = Object.defineProperty;
2
- var __defProps = Object.defineProperties;
3
- var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
4
2
  var __getOwnPropSymbols = Object.getOwnPropertySymbols;
5
3
  var __hasOwnProp = Object.prototype.hasOwnProperty;
6
4
  var __propIsEnum = Object.prototype.propertyIsEnumerable;
@@ -16,314 +14,28 @@ var __spreadValues = (a, b) => {
16
14
  }
17
15
  return a;
18
16
  };
19
- var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
20
- var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
21
- var __async = (__this, __arguments, generator) => {
22
- return new Promise((resolve, reject) => {
23
- var fulfilled = (value) => {
24
- try {
25
- step(generator.next(value));
26
- } catch (e) {
27
- reject(e);
28
- }
29
- };
30
- var rejected = (value) => {
31
- try {
32
- step(generator.throw(value));
33
- } catch (e) {
34
- reject(e);
35
- }
36
- };
37
- var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
38
- step((generator = generator.apply(__this, __arguments)).next());
39
- });
17
+ var __objRest = (source, exclude) => {
18
+ var target = {};
19
+ for (var prop in source)
20
+ if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
21
+ target[prop] = source[prop];
22
+ if (source != null && __getOwnPropSymbols)
23
+ for (var prop of __getOwnPropSymbols(source)) {
24
+ if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
25
+ target[prop] = source[prop];
26
+ }
27
+ return target;
40
28
  };
41
29
  import * as React from "react";
42
- import { callAI } from "./helper.js";
43
- import List from "./List.js";
44
- import EmptyState from "./EmptyState.js";
45
- import SettingPopper from "./SettingPopper/index.js";
46
- import { LENGTH_OPTIONS, TONE_OPTIONS } from "./constants.js";
47
- import { AI_LANG_FLAGS } from "../../constants/index.js";
48
- import CountryFlag from "../CountryFlag/index.js";
49
- import v4 from "../../node_modules/uuid/dist/esm-browser/v4.js";
50
- import ArrowUp from "../../node_modules/react-feather/dist/icons/arrow-up.js";
51
- class ChatAIDraft extends React.Component {
52
- constructor(props) {
53
- var _a;
54
- super(props);
55
- __publicField(this, "rootRef");
56
- __publicField(this, "textareaRef");
57
- __publicField(this, "adjustTextareaHeight", () => {
58
- const el = this.textareaRef.current;
59
- if (!el) return;
60
- el.style.height = "auto";
61
- el.style.height = `${Math.min(el.scrollHeight, 160)}px`;
62
- });
63
- __publicField(this, "handleMessageChange", (e) => {
64
- this.setState({ message: e.target.value }, this.adjustTextareaHeight);
65
- });
66
- __publicField(this, "handleSubmit", () => __async(this, null, function* () {
67
- const { message, messages, lang, tone, length, conversationId } = this.state;
68
- if (!message.trim()) return;
69
- const newId = v4();
70
- let newMessage = {
71
- id: newId,
72
- question: message,
73
- subject: "",
74
- body: "",
75
- created_at: (/* @__PURE__ */ new Date()).getTime(),
76
- isLoading: true
77
- };
78
- const currentItems = [...messages, newMessage];
79
- this.setState({
80
- messages: currentItems,
81
- message: "",
82
- isSending: true
83
- });
84
- const params = {
85
- query: message,
86
- default_language: lang ? lang.value : "KR",
87
- debug_grpc: true
88
- };
89
- if (tone) {
90
- params.tone = tone.value;
91
- }
92
- if (length) {
93
- params.length = length.value;
94
- }
95
- if (conversationId) {
96
- params.conversation_id = conversationId;
97
- }
98
- const setContent = (nContent) => {
99
- this.setState((prevState) => {
100
- const updatedMessages = prevState.messages.map(
101
- (m) => m.id === newId ? __spreadProps(__spreadValues({}, m), {
102
- subject: "Some thing not used",
103
- body: nContent,
104
- isLoading: false,
105
- created_at: (/* @__PURE__ */ new Date()).getTime()
106
- }) : m
107
- );
108
- return { messages: updatedMessages };
109
- });
110
- };
111
- const setIsLoading = (loading) => {
112
- this.setState((prevState) => {
113
- const updatedMessages = prevState.messages.map(
114
- (m) => m.id === newId ? __spreadProps(__spreadValues({}, m), { isLoading: loading }) : m
115
- );
116
- return { messages: updatedMessages };
117
- });
118
- };
119
- const setConversationId = (id) => {
120
- this.setState({ conversationId: id });
121
- };
122
- yield callAI(params, {
123
- setContent,
124
- setIsLoading,
125
- setConversationId
126
- });
127
- this.setState({ isSending: false });
128
- }));
129
- __publicField(this, "handleKeyDown", (event) => {
130
- if (!event.shiftKey && event.key === "Enter" && !this.state.isSending) {
131
- event.preventDefault();
132
- this.handleSubmit();
133
- }
134
- });
135
- __publicField(this, "setLang", (lang) => {
136
- this.setState({ lang });
137
- });
138
- __publicField(this, "setTone", (tone) => {
139
- this.setState({ tone });
140
- });
141
- __publicField(this, "setLength", (length) => {
142
- this.setState({ length });
143
- });
144
- this.rootRef = React.createRef();
145
- this.textareaRef = React.createRef();
146
- const lang = ((_a = AI_LANG_FLAGS) == null ? void 0 : _a.find((_item) => (_item == null ? void 0 : _item.value) === (props == null ? void 0 : props.defaultLang))) || AI_LANG_FLAGS[0];
147
- this.state = {
148
- message: "",
149
- messages: [],
150
- isSending: false,
151
- lang,
152
- tone: TONE_OPTIONS[2],
153
- // Neutral
154
- length: LENGTH_OPTIONS[2],
155
- // Long
156
- conversationId: ""
157
- };
158
- }
159
- componentDidUpdate(_, prevState) {
160
- if (prevState.message !== this.state.message) {
161
- this.adjustTextareaHeight();
162
- }
30
+ import CreatePanel from "./CreatePanel/index.js";
31
+ import ReplyPanel from "./ReplyPanel/index.js";
32
+ const ChatAIDraft = (props) => {
33
+ const _a = props, { type = "new", sourceMid } = _a, rest = __objRest(_a, ["type", "sourceMid"]);
34
+ if ((type === "reply" || type === "forward") && sourceMid) {
35
+ return /* @__PURE__ */ React.createElement(ReplyPanel, __spreadValues({ type, sourceMid }, rest));
163
36
  }
164
- render() {
165
- var _a, _b;
166
- const { onApply, getEditorContent } = this.props;
167
- const { message, messages, isSending, lang, tone, length } = this.state;
168
- const flagCode = (_b = (_a = AI_LANG_FLAGS) == null ? void 0 : _a.find(
169
- (_item) => (_item == null ? void 0 : _item.value) === (lang == null ? void 0 : lang.value)
170
- )) == null ? void 0 : _b.flagCode;
171
- return /* @__PURE__ */ React.createElement(
172
- "div",
173
- {
174
- ref: this.rootRef,
175
- style: {
176
- display: "flex",
177
- height: "100%",
178
- padding: 16,
179
- flexDirection: "column",
180
- background: "#fff",
181
- fontFamily: "inherit",
182
- boxSizing: "border-box"
183
- }
184
- },
185
- messages.length > 0 ? /* @__PURE__ */ React.createElement(
186
- List,
187
- {
188
- items: messages,
189
- onApply,
190
- getEditorContent
191
- }
192
- ) : /* @__PURE__ */ React.createElement(
193
- EmptyState,
194
- {
195
- onSelectPrompt: (text) => this.setState({ message: text })
196
- }
197
- ),
198
- /* @__PURE__ */ React.createElement(
199
- "div",
200
- {
201
- style: {
202
- width: "100%",
203
- borderRadius: 12,
204
- overflow: "hidden",
205
- background: "var(--background-softGrey)",
206
- display: "flex",
207
- flexDirection: "column",
208
- border: "1px solid var(--border-light)"
209
- }
210
- },
211
- /* @__PURE__ */ React.createElement(
212
- "textarea",
213
- {
214
- ref: this.textareaRef,
215
- value: message,
216
- onChange: this.handleMessageChange,
217
- placeholder: "Describe your email...",
218
- name: "ai-content",
219
- onKeyDown: this.handleKeyDown,
220
- disabled: isSending,
221
- rows: 1,
222
- style: {
223
- flex: 1,
224
- minWidth: 0,
225
- padding: 12,
226
- fontSize: 13,
227
- border: "none",
228
- resize: "none",
229
- outline: "none",
230
- fontFamily: "inherit",
231
- background: "transparent",
232
- overflowY: "auto"
233
- }
234
- }
235
- ),
236
- /* @__PURE__ */ React.createElement(
237
- "div",
238
- {
239
- style: {
240
- display: "flex",
241
- flexDirection: "row",
242
- alignItems: "center",
243
- width: "100%",
244
- padding: "8px",
245
- boxSizing: "border-box"
246
- }
247
- },
248
- /* @__PURE__ */ React.createElement(
249
- SettingPopper,
250
- {
251
- lang,
252
- setLang: this.setLang,
253
- tone,
254
- setTone: this.setTone,
255
- length,
256
- setLength: this.setLength,
257
- parentRef: this.rootRef
258
- }
259
- ),
260
- /* @__PURE__ */ React.createElement(
261
- CountryFlag,
262
- {
263
- flagCode,
264
- style: { marginLeft: 4, height: 14 }
265
- }
266
- ),
267
- (tone || length) && /* @__PURE__ */ React.createElement(
268
- "span",
269
- {
270
- style: {
271
- marginLeft: 8,
272
- padding: "2px 8px",
273
- borderRadius: 999,
274
- background: "var(--primary-lighter)",
275
- color: "var(--primary-main)",
276
- fontSize: 11,
277
- fontWeight: 500,
278
- whiteSpace: "nowrap",
279
- display: "inline-flex",
280
- alignItems: "center",
281
- gap: 4
282
- }
283
- },
284
- (tone == null ? void 0 : tone.label) && /* @__PURE__ */ React.createElement("span", null, tone.label),
285
- (tone == null ? void 0 : tone.label) && (length == null ? void 0 : length.label) && /* @__PURE__ */ React.createElement(
286
- "span",
287
- {
288
- style: {
289
- width: 3,
290
- height: 3,
291
- borderRadius: "50%",
292
- background: "currentColor",
293
- display: "inline-block"
294
- }
295
- }
296
- ),
297
- (length == null ? void 0 : length.label) && /* @__PURE__ */ React.createElement("span", null, length.label)
298
- ),
299
- /* @__PURE__ */ React.createElement(
300
- "button",
301
- {
302
- type: "button",
303
- disabled: !message.trim() || isSending,
304
- onClick: this.handleSubmit,
305
- style: {
306
- marginLeft: "auto",
307
- width: 28,
308
- height: 28,
309
- borderRadius: "50%",
310
- border: "none",
311
- display: "flex",
312
- alignItems: "center",
313
- justifyContent: "center",
314
- background: !message.trim() || isSending ? "var(--primary-lighter)" : "var(--primary-main)",
315
- color: "var(--primary-contrasttext)",
316
- cursor: !message.trim() || isSending ? "not-allowed" : "pointer",
317
- transition: "background 0.15s ease-in-out"
318
- }
319
- },
320
- /* @__PURE__ */ React.createElement(ArrowUp, { size: 18 })
321
- )
322
- )
323
- )
324
- );
325
- }
326
- }
37
+ return /* @__PURE__ */ React.createElement(CreatePanel, __spreadValues({}, rest));
38
+ };
327
39
  export {
328
40
  ChatAIDraft as default
329
41
  };
@@ -0,0 +1,36 @@
1
+ export type ChatType = "forward" | "reply" | "new";
2
+ export interface AIMessage {
3
+ id: string;
4
+ question: string;
5
+ subject: string;
6
+ body: string;
7
+ created_at: number;
8
+ isLoading: boolean;
9
+ }
10
+ export interface MailListItem {
11
+ mid: string;
12
+ subject: string;
13
+ from_name: string;
14
+ from_addr: string;
15
+ date: string;
16
+ is_file: number;
17
+ preview: string;
18
+ }
19
+ export interface MailViewData {
20
+ mid: string;
21
+ subject: string;
22
+ from_name: string;
23
+ from_addr: string;
24
+ date: string;
25
+ ai_contents: string;
26
+ contents: string;
27
+ }
28
+ export interface ContextMail {
29
+ mid: string;
30
+ subject: string;
31
+ from_name: string;
32
+ from_addr: string;
33
+ date: string;
34
+ ai_contents: string;
35
+ contents?: string;
36
+ }
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * hanbiro-react16-sdk v1.0.25
2
+ * hanbiro-react16-sdk v1.0.27
3
3
  * Build Date: 2026-05-21
4
4
  */
5
5
  @charset "UTF-8";
@@ -63,6 +63,46 @@ button.icon-button.large svg {
63
63
  height: 20px;
64
64
  }
65
65
 
66
+ button.text-button {
67
+ background: transparent;
68
+ border: none;
69
+ cursor: pointer;
70
+ display: inline-flex;
71
+ align-items: center;
72
+ gap: 4px;
73
+ padding: 4px 8px;
74
+ border-radius: 4px;
75
+ font-family: inherit;
76
+ font-size: 12px;
77
+ transition: background 0.15s ease-in-out, color 0.15s ease-in-out;
78
+ color: var(--text-secondary);
79
+ }
80
+ button.text-button:hover {
81
+ background-color: rgb(244, 244, 244);
82
+ }
83
+ button.text-button:active {
84
+ background-color: rgb(232, 232, 232);
85
+ }
86
+ button.text-button[disabled] {
87
+ cursor: not-allowed;
88
+ color: var(--grey-lighter);
89
+ background: transparent;
90
+ }
91
+ button.text-button.primary, button.text-button[color=primary] {
92
+ color: var(--primary-main);
93
+ font-weight: 600;
94
+ }
95
+ button.text-button.primary:hover, button.text-button[color=primary]:hover {
96
+ background-color: var(--primary-lighter);
97
+ }
98
+ button.text-button.primary:active, button.text-button[color=primary]:active {
99
+ background-color: var(--primary-light);
100
+ }
101
+ button.text-button.primary[disabled], button.text-button[color=primary][disabled] {
102
+ color: var(--primary-lighter);
103
+ background: transparent;
104
+ }
105
+
66
106
  .circular-container {
67
107
  display: inline-block;
68
108
  animation: rotate 1.4s linear infinite; /* Xoay cả khối SVG */