hanbiro-react16-sdk 1.0.12 → 1.0.14

package/README.md

@@ -15,12 +15,14 @@ npm install hanbiro-react16-sdk
 You **must** import the SDK stylesheet at the entry point of your project (or in the HTML file when using UMD).
 
 **For npm/ES module projects:**
+
 ```ts
 // src/index.tsx or App.tsx
-import 'hanbiro-react16-sdk/style.css';
+import "hanbiro-react16-sdk/style.css";
 ```
 
 **For UMD (script tag):**
+
 ```html
 <link rel="stylesheet" href="path/to/hanbiro-react16-sdk.style.css" />
 ```
@@ -29,19 +31,20 @@ import 'hanbiro-react16-sdk/style.css';
 
 ## Exported Components
 
-| Component | Import path |
-|---|---|
-| `ChatAIDraft` | `hanbiro-react16-sdk/components` |
-| `LoadingCircular` | `hanbiro-react16-sdk/components` |
+| Component          | Import path                      |
+| ------------------ | -------------------------------- |
+| `ChatAIDraft`      | `hanbiro-react16-sdk/components` |
+| `LoadingCircular`  | `hanbiro-react16-sdk/components` |
 | `LoadingContainer` | `hanbiro-react16-sdk/components` |
+| `CountryFlag`      | `hanbiro-react16-sdk/components` |
 
 ## Exported Utils
 
-| Function | Description | Import path |
-|---|---|---|
+| Function              | Description                      | Import path                 |
+| --------------------- | -------------------------------- | --------------------------- |
 | `initHanbiroReactSDK` | Initialize SDK (baseUrl, signer) | `hanbiro-react16-sdk/utils` |
-| `getBaseUrl` | Get the configured base URL | `hanbiro-react16-sdk/utils` |
-| `getGroupwareUrl` | Get the groupware URL | `hanbiro-react16-sdk/utils` |
+| `getBaseUrl`          | Get the configured base URL      | `hanbiro-react16-sdk/utils` |
+| `getGroupwareUrl`     | Get the groupware URL            | `hanbiro-react16-sdk/utils` |
 
 ---
 
@@ -50,10 +53,10 @@ import 'hanbiro-react16-sdk/style.css';
 Call `initHanbiroReactSDK` at the entry point of your project before rendering any components.
 
 ```ts
-import { initHanbiroReactSDK } from 'hanbiro-react16-sdk/utils';
+import { initHanbiroReactSDK } from "hanbiro-react16-sdk/utils";
 
 initHanbiroReactSDK({
-  baseUrl: 'https://vndev.hanbiro.com',
+  baseUrl: "https://vndev.hanbiro.com",
   signer: null, // Pass your signer instance here if available
 });
 ```
@@ -63,23 +66,18 @@ initHanbiroReactSDK({
 ## Usage: ES Module (npm)
 
 ```tsx
-import React, { Component } from 'react';
-import { ChatAIDraft } from 'hanbiro-react16-sdk/components';
-import { getBaseUrl } from 'hanbiro-react16-sdk/utils';
-import 'hanbiro-react16-sdk/style.css';
+import React, { Component } from "react";
+import { ChatAIDraft } from "hanbiro-react16-sdk/components";
+import { getBaseUrl } from "hanbiro-react16-sdk/utils";
+import "hanbiro-react16-sdk/style.css";
 
 class ChatAIDraftApp extends Component {
   handleApply = (result) => {
-    console.log('Applied Output:', result);
+    console.log("Applied Output:", result);
   };
 
   render() {
-    return (
-      <ChatAIDraft
-        baseUrl={getBaseUrl()}
-        onApply={this.handleApply}
-      />
-    );
+    return <ChatAIDraft baseUrl={getBaseUrl()} onApply={this.handleApply} />;
   }
 }
 
@@ -109,7 +107,7 @@ The SDK is exposed as a global variable `HanbiroReact16SDK`.
 ```js
 // Initialize
 HanbiroReact16SDK.initHanbiroReactSDK({
-  baseUrl: 'https://vndev.hanbiro.com',
+  baseUrl: "https://vndev.hanbiro.com",
   signer: null,
 });
 
@@ -117,44 +115,44 @@ HanbiroReact16SDK.initHanbiroReactSDK({
 ReactDOM.render(
   React.createElement(HanbiroReact16SDK.ChatAIDraft, {
     baseUrl: HanbiroReact16SDK.getBaseUrl(),
-    onApply: function(result) {
-      console.log('Applied:', result);
+    onApply: function (result) {
+      console.log("Applied:", result);
     },
   }),
-  document.getElementById('chat-ai-container')
+  document.getElementById("chat-ai-container"),
 );
 ```
 
 ### Example: AngularJS Directive
 
 ```js
-angular.module('myApp').directive('chatAiDraft', function() {
+angular.module("myApp").directive("chatAiDraft", function () {
   return {
-    restrict: 'E',
-    link: function(scope, element) {
+    restrict: "E",
+    link: function (scope, element) {
       var container = element[0];
 
       HanbiroReact16SDK.initHanbiroReactSDK({
-        baseUrl: 'https://vndev.hanbiro.com',
+        baseUrl: "https://vndev.hanbiro.com",
         signer: null,
       });
 
       ReactDOM.render(
         React.createElement(HanbiroReact16SDK.ChatAIDraft, {
           baseUrl: HanbiroReact16SDK.getBaseUrl(),
-          onApply: function(result) {
-            scope.$apply(function() {
+          onApply: function (result) {
+            scope.$apply(function () {
               scope.draftContent = result.html;
             });
           },
         }),
-        container
+        container,
       );
 
-      scope.$on('$destroy', function() {
+      scope.$on("$destroy", function () {
         ReactDOM.unmountComponentAtNode(container);
       });
-    }
+    },
   };
 });
 ```
@@ -179,14 +177,14 @@ interface ChatAIDraftRef {
 ### React 18 / React 16.8+ (useRef)
 
 ```tsx
-import React, { useRef } from 'react';
-import { ChatAIDraft } from 'hanbiro-react16-sdk/components';
+import React, { useRef } from "react";
+import { ChatAIDraft } from "hanbiro-react16-sdk/components";
 
 function MailComposer() {
   const chatRef = useRef<ChatAIDraft>(null);
 
   const handleOpenAI = () => {
-    chatRef.current?.setAIContext('<p>Original email content...</p>');
+    chatRef.current?.setAIContext("<p>Original email content...</p>");
   };
 
   return (
@@ -208,10 +206,14 @@ let chatAIInstance = null;
 
 ReactDOM.render(
   React.createElement(HanbiroReact16SDK.ChatAIDraft, {
-    ref: function(instance) { chatAIInstance = instance; },
-    onApply: function(result) { /* ... */ },
+    ref: function (instance) {
+      chatAIInstance = instance;
+    },
+    onApply: function (result) {
+      /* ... */
+    },
   }),
-  document.getElementById('chat-ai-container')
+  document.getElementById("chat-ai-container"),
 );
 
 // Call anytime — e.g. when opening the AI panel
@@ -226,8 +228,30 @@ function setEmailContext(html) {
 
 ## Development Commands
 
-
 - Run playground locally: `npm run dev`
 - Build library for production: `npm run build`
 - Build playground for production: `npm run build:playground`
 - Typecheck: `npm run test:typescript`
+
+## Development Workflow
+
+Follow these steps when updating the library:
+
+1. **Finish coding**: Make your changes in the `src` directory.
+2. **Build**: Run the build command and ensure there are no errors.
+   ```bash
+   npm run build
+   ```
+3. **Commit**: Commit your changes to git.
+4. **Patch version**: Increment the version number.
+   ```bash
+   npm version patch
+   ```
+5. **Push**: Push the changes and tags to GitHub.
+   ```bash
+   git push origin main --follow-tags
+   ```
+6. **Publish**: Publish the new version to npm.
+   ```bash
+   npm publish
+   ```

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

@@ -9,6 +9,7 @@ interface SettingPopperProps {
     parentRef?: React.RefObject<HTMLDivElement>;
 }
 interface SettingPopperState {
+    languageOptions: LabelValue[];
     open: boolean;
 }
 declare class SettingPopper extends React.Component<SettingPopperProps, SettingPopperState> {
@@ -17,6 +18,7 @@ declare class SettingPopper extends React.Component<SettingPopperProps, SettingP
     constructor(props: SettingPopperProps);
     componentDidMount(): void;
     componentWillUnmount(): void;
+    getLanguageOptions: () => Promise<void>;
     handleClickOutside: (event: MouseEvent) => void;
     togglePopper: () => void;
     handleLangChange: (e: React.ChangeEvent<HTMLSelectElement>) => void;

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

@@ -1,6 +1,7 @@
 import { LabelValue } from '../../types';
 import * as React from "react";
-export interface AIPaneProps {
+export interface ChatAIDraftProps {
+    defaultLang?: string;
     getEditorContent?: () => string;
     onApply: (params: {
         html: string;
@@ -26,9 +27,9 @@ interface AIPaneState {
     conversationId: string;
     originalEmail: string;
 }
-declare class ChatAIDraft extends React.Component<AIPaneProps, AIPaneState> implements ChatAIDraftRef {
+declare class ChatAIDraft extends React.Component<ChatAIDraftProps, AIPaneState> implements ChatAIDraftRef {
     private rootRef;
-    constructor(props: AIPaneProps);
+    constructor(props: ChatAIDraftProps);
     setAIContext: (html: string) => void;
     handleMessageChange: (e: React.ChangeEvent<HTMLTextAreaElement>) => void;
     handleSubmit: () => Promise<void>;

package/dist/components/CountryFlag/flags/CNFlag.d.ts

@@ -0,0 +1,3 @@
+import * as React from "react";
+declare const CNFlag: (props: React.SVGAttributes<SVGSVGElement>) => React.JSX.Element;
+export default CNFlag;

package/dist/components/CountryFlag/flags/IDFlag.d.ts

@@ -0,0 +1,3 @@
+import * as React from "react";
+declare const IDFlag: (props: React.SVGAttributes<SVGSVGElement>) => React.JSX.Element;
+export default IDFlag;

package/dist/components/CountryFlag/flags/KRFlag.d.ts

@@ -0,0 +1,3 @@
+import * as React from "react";
+declare const KRFlag: (props: React.SVGAttributes<SVGSVGElement>) => React.JSX.Element;
+export default KRFlag;

package/dist/components/CountryFlag/flags/USFlag.d.ts

@@ -0,0 +1,3 @@
+import * as React from "react";
+declare const USFlag: (props: React.SVGAttributes<SVGSVGElement>) => React.JSX.Element;
+export default USFlag;

package/dist/components/CountryFlag/flags/VNFlag.d.ts

@@ -0,0 +1,3 @@
+import * as React from "react";
+declare const VNFlag: (props: React.SVGAttributes<SVGSVGElement>) => React.JSX.Element;
+export default VNFlag;

package/dist/components/CountryFlag/index.d.ts

@@ -0,0 +1,7 @@
+import * as React from "react";
+export type FlagCode = "cn" | "id" | "kr" | "us" | "vn";
+export interface FlagProps extends React.SVGAttributes<SVGSVGElement> {
+    flagCode?: FlagCode;
+}
+declare const CountryFlag: (props: FlagProps) => React.JSX.Element | null;
+export default CountryFlag;

package/dist/components/index.d.ts

@@ -1,5 +1,7 @@
-export { default as ChatAIDraft } from './ChatAIDraft';
+export { default as ChatAIDraft, type ChatAIDraftRef } from './ChatAIDraft';
 export { default as LoadingCircular } from './LoadingCircular';
 export { default as LoadingContainer } from './LoadingContainer';
 export { default as Tooltip } from './Tooltip';
 export type { TooltipProps, TooltipPlacement } from './Tooltip';
+export { default as CountryFlag } from './CountryFlag';
+export type { FlagCode } from './CountryFlag';

package/dist/constants/index.d.ts

@@ -0,0 +1,8 @@
+import { FlagCode } from '../components/CountryFlag';
+import { LabelValue } from '../types';
+
+interface AILang extends LabelValue {
+    flagCode: FlagCode;
+}
+export declare const AI_LANG_FLAGS: AILang[];
+export {};