hanbiro-react16-sdk 1.0.25 → 1.0.26

package/dist/components/ChatAIDraft/index.js

@@ -1,6 +1,4 @@
 var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
 var __getOwnPropSymbols = Object.getOwnPropertySymbols;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __propIsEnum = Object.prototype.propertyIsEnumerable;
@@ -16,314 +14,28 @@ var __spreadValues = (a, b) => {
     }
   return a;
 };
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
-var __async = (__this, __arguments, generator) => {
-  return new Promise((resolve, reject) => {
-    var fulfilled = (value) => {
-      try {
-        step(generator.next(value));
-      } catch (e) {
-        reject(e);
-      }
-    };
-    var rejected = (value) => {
-      try {
-        step(generator.throw(value));
-      } catch (e) {
-        reject(e);
-      }
-    };
-    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
-    step((generator = generator.apply(__this, __arguments)).next());
-  });
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
 };
 import * as React from "react";
-import { callAI } from "./helper.js";
-import List from "./List.js";
-import EmptyState from "./EmptyState.js";
-import SettingPopper from "./SettingPopper/index.js";
-import { LENGTH_OPTIONS, TONE_OPTIONS } from "./constants.js";
-import { AI_LANG_FLAGS } from "../../constants/index.js";
-import CountryFlag from "../CountryFlag/index.js";
-import v4 from "../../node_modules/uuid/dist/esm-browser/v4.js";
-import ArrowUp from "../../node_modules/react-feather/dist/icons/arrow-up.js";
-class ChatAIDraft extends React.Component {
-  constructor(props) {
-    var _a;
-    super(props);
-    __publicField(this, "rootRef");
-    __publicField(this, "textareaRef");
-    __publicField(this, "adjustTextareaHeight", () => {
-      const el = this.textareaRef.current;
-      if (!el) return;
-      el.style.height = "auto";
-      el.style.height = `${Math.min(el.scrollHeight, 160)}px`;
-    });
-    __publicField(this, "handleMessageChange", (e) => {
-      this.setState({ message: e.target.value }, this.adjustTextareaHeight);
-    });
-    __publicField(this, "handleSubmit", () => __async(this, null, function* () {
-      const { message, messages, lang, tone, length, conversationId } = this.state;
-      if (!message.trim()) return;
-      const newId = v4();
-      let newMessage = {
-        id: newId,
-        question: message,
-        subject: "",
-        body: "",
-        created_at: (/* @__PURE__ */ new Date()).getTime(),
-        isLoading: true
-      };
-      const currentItems = [...messages, newMessage];
-      this.setState({
-        messages: currentItems,
-        message: "",
-        isSending: true
-      });
-      const params = {
-        query: message,
-        default_language: lang ? lang.value : "KR",
-        debug_grpc: true
-      };
-      if (tone) {
-        params.tone = tone.value;
-      }
-      if (length) {
-        params.length = length.value;
-      }
-      if (conversationId) {
-        params.conversation_id = conversationId;
-      }
-      const setContent = (nContent) => {
-        this.setState((prevState) => {
-          const updatedMessages = prevState.messages.map(
-            (m) => m.id === newId ? __spreadProps(__spreadValues({}, m), {
-              subject: "Some thing not used",
-              body: nContent,
-              isLoading: false,
-              created_at: (/* @__PURE__ */ new Date()).getTime()
-            }) : m
-          );
-          return { messages: updatedMessages };
-        });
-      };
-      const setIsLoading = (loading) => {
-        this.setState((prevState) => {
-          const updatedMessages = prevState.messages.map(
-            (m) => m.id === newId ? __spreadProps(__spreadValues({}, m), { isLoading: loading }) : m
-          );
-          return { messages: updatedMessages };
-        });
-      };
-      const setConversationId = (id) => {
-        this.setState({ conversationId: id });
-      };
-      yield callAI(params, {
-        setContent,
-        setIsLoading,
-        setConversationId
-      });
-      this.setState({ isSending: false });
-    }));
-    __publicField(this, "handleKeyDown", (event) => {
-      if (!event.shiftKey && event.key === "Enter" && !this.state.isSending) {
-        event.preventDefault();
-        this.handleSubmit();
-      }
-    });
-    __publicField(this, "setLang", (lang) => {
-      this.setState({ lang });
-    });
-    __publicField(this, "setTone", (tone) => {
-      this.setState({ tone });
-    });
-    __publicField(this, "setLength", (length) => {
-      this.setState({ length });
-    });
-    this.rootRef = React.createRef();
-    this.textareaRef = React.createRef();
-    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];
-    this.state = {
-      message: "",
-      messages: [],
-      isSending: false,
-      lang,
-      tone: TONE_OPTIONS[2],
-      // Neutral
-      length: LENGTH_OPTIONS[2],
-      // Long
-      conversationId: ""
-    };
-  }
-  componentDidUpdate(_, prevState) {
-    if (prevState.message !== this.state.message) {
-      this.adjustTextareaHeight();
-    }
+import CreatePanel from "./CreatePanel/index.js";
+import ReplyPanel from "./ReplyPanel/index.js";
+const ChatAIDraft = (props) => {
+  const _a = props, { type = "new", sourceMid } = _a, rest = __objRest(_a, ["type", "sourceMid"]);
+  if ((type === "reply" || type === "forward") && sourceMid) {
+    return /* @__PURE__ */ React.createElement(ReplyPanel, __spreadValues({ type, sourceMid }, rest));
   }
-  render() {
-    var _a, _b;
-    const { onApply, getEditorContent } = this.props;
-    const { message, messages, isSending, lang, tone, length } = this.state;
-    const flagCode = (_b = (_a = AI_LANG_FLAGS) == null ? void 0 : _a.find(
-      (_item) => (_item == null ? void 0 : _item.value) === (lang == null ? void 0 : lang.value)
-    )) == null ? void 0 : _b.flagCode;
-    return /* @__PURE__ */ React.createElement(
-      "div",
-      {
-        ref: this.rootRef,
-        style: {
-          display: "flex",
-          height: "100%",
-          padding: 16,
-          flexDirection: "column",
-          background: "#fff",
-          fontFamily: "inherit",
-          boxSizing: "border-box"
-        }
-      },
-      messages.length > 0 ? /* @__PURE__ */ React.createElement(
-        List,
-        {
-          items: messages,
-          onApply,
-          getEditorContent
-        }
-      ) : /* @__PURE__ */ React.createElement(
-        EmptyState,
-        {
-          onSelectPrompt: (text) => this.setState({ message: text })
-        }
-      ),
-      /* @__PURE__ */ React.createElement(
-        "div",
-        {
-          style: {
-            width: "100%",
-            borderRadius: 12,
-            overflow: "hidden",
-            background: "var(--background-softGrey)",
-            display: "flex",
-            flexDirection: "column",
-            border: "1px solid var(--border-light)"
-          }
-        },
-        /* @__PURE__ */ React.createElement(
-          "textarea",
-          {
-            ref: this.textareaRef,
-            value: message,
-            onChange: this.handleMessageChange,
-            placeholder: "Describe your email...",
-            name: "ai-content",
-            onKeyDown: this.handleKeyDown,
-            disabled: isSending,
-            rows: 1,
-            style: {
-              flex: 1,
-              minWidth: 0,
-              padding: 12,
-              fontSize: 13,
-              border: "none",
-              resize: "none",
-              outline: "none",
-              fontFamily: "inherit",
-              background: "transparent",
-              overflowY: "auto"
-            }
-          }
-        ),
-        /* @__PURE__ */ React.createElement(
-          "div",
-          {
-            style: {
-              display: "flex",
-              flexDirection: "row",
-              alignItems: "center",
-              width: "100%",
-              padding: "8px",
-              boxSizing: "border-box"
-            }
-          },
-          /* @__PURE__ */ React.createElement(
-            SettingPopper,
-            {
-              lang,
-              setLang: this.setLang,
-              tone,
-              setTone: this.setTone,
-              length,
-              setLength: this.setLength,
-              parentRef: this.rootRef
-            }
-          ),
-          /* @__PURE__ */ React.createElement(
-            CountryFlag,
-            {
-              flagCode,
-              style: { marginLeft: 4, height: 14 }
-            }
-          ),
-          (tone || length) && /* @__PURE__ */ React.createElement(
-            "span",
-            {
-              style: {
-                marginLeft: 8,
-                padding: "2px 8px",
-                borderRadius: 999,
-                background: "var(--primary-lighter)",
-                color: "var(--primary-main)",
-                fontSize: 11,
-                fontWeight: 500,
-                whiteSpace: "nowrap",
-                display: "inline-flex",
-                alignItems: "center",
-                gap: 4
-              }
-            },
-            (tone == null ? void 0 : tone.label) && /* @__PURE__ */ React.createElement("span", null, tone.label),
-            (tone == null ? void 0 : tone.label) && (length == null ? void 0 : length.label) && /* @__PURE__ */ React.createElement(
-              "span",
-              {
-                style: {
-                  width: 3,
-                  height: 3,
-                  borderRadius: "50%",
-                  background: "currentColor",
-                  display: "inline-block"
-                }
-              }
-            ),
-            (length == null ? void 0 : length.label) && /* @__PURE__ */ React.createElement("span", null, length.label)
-          ),
-          /* @__PURE__ */ React.createElement(
-            "button",
-            {
-              type: "button",
-              disabled: !message.trim() || isSending,
-              onClick: this.handleSubmit,
-              style: {
-                marginLeft: "auto",
-                width: 28,
-                height: 28,
-                borderRadius: "50%",
-                border: "none",
-                display: "flex",
-                alignItems: "center",
-                justifyContent: "center",
-                background: !message.trim() || isSending ? "var(--primary-lighter)" : "var(--primary-main)",
-                color: "var(--primary-contrasttext)",
-                cursor: !message.trim() || isSending ? "not-allowed" : "pointer",
-                transition: "background 0.15s ease-in-out"
-              }
-            },
-            /* @__PURE__ */ React.createElement(ArrowUp, { size: 18 })
-          )
-        )
-      )
-    );
-  }
-}
+  return /* @__PURE__ */ React.createElement(CreatePanel, __spreadValues({}, rest));
+};
 export {
   ChatAIDraft as default
 };

package/dist/components/ChatAIDraft/types.d.ts

@@ -0,0 +1,36 @@
+export type ChatType = "forward" | "reply" | "new";
+export interface AIMessage {
+    id: string;
+    question: string;
+    subject: string;
+    body: string;
+    created_at: number;
+    isLoading: boolean;
+}
+export interface MailListItem {
+    mid: string;
+    subject: string;
+    from_name: string;
+    from_addr: string;
+    date: string;
+    is_file: number;
+    preview: string;
+}
+export interface MailViewData {
+    mid: string;
+    subject: string;
+    from_name: string;
+    from_addr: string;
+    date: string;
+    ai_contents: string;
+    contents: string;
+}
+export interface ContextMail {
+    mid: string;
+    subject: string;
+    from_name: string;
+    from_addr: string;
+    date: string;
+    ai_contents: string;
+    contents?: string;
+}

package/dist/hanbiro-react16-sdk.style.css

@@ -1,5 +1,5 @@
 /*!
- * hanbiro-react16-sdk v1.0.25
+ * hanbiro-react16-sdk v1.0.26
  * Build Date: 2026-05-21
  */
 @charset "UTF-8";
@@ -63,6 +63,46 @@ button.icon-button.large svg {
   height: 20px;
 }
 
+button.text-button {
+  background: transparent;
+  border: none;
+  cursor: pointer;
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+  padding: 4px 8px;
+  border-radius: 4px;
+  font-family: inherit;
+  font-size: 12px;
+  transition: background 0.15s ease-in-out, color 0.15s ease-in-out;
+  color: var(--text-secondary);
+}
+button.text-button:hover {
+  background-color: rgb(244, 244, 244);
+}
+button.text-button:active {
+  background-color: rgb(232, 232, 232);
+}
+button.text-button[disabled] {
+  cursor: not-allowed;
+  color: var(--grey-lighter);
+  background: transparent;
+}
+button.text-button.primary, button.text-button[color=primary] {
+  color: var(--primary-main);
+  font-weight: 600;
+}
+button.text-button.primary:hover, button.text-button[color=primary]:hover {
+  background-color: var(--primary-lighter);
+}
+button.text-button.primary:active, button.text-button[color=primary]:active {
+  background-color: var(--primary-light);
+}
+button.text-button.primary[disabled], button.text-button[color=primary][disabled] {
+  color: var(--primary-lighter);
+  background: transparent;
+}
+
 .circular-container {
   display: inline-block;
   animation: rotate 1.4s linear infinite; /* Xoay cả khối SVG */