assistant-robot 0.0.1-alpha → 0.0.2-alpha

package/dist/type.d.ts

@@ -0,0 +1,64 @@
+import { LanguageModel } from "./LanguageModel";
+export interface ILanguageModelOptions {
+    [prop: string]: any;
+}
+interface ILanguageModelSubclass<T extends LanguageModel> {
+    new (options: ILanguageModelOptions): T;
+}
+export interface ILanguageModelConfig<T extends LanguageModel> extends ILanguageModelOptions {
+    Model: ILanguageModelSubclass<T>;
+}
+export interface IOperation {
+    key: string;
+    text: string;
+    disable: boolean;
+}
+export interface IOperationBoxBoxConfig {
+    hide?: boolean;
+    chatBoxClassName?: string;
+    operationList?: IOperation[];
+}
+export interface IModelConfig {
+    position: [number, number, number];
+    rotation: [number, number, number];
+    helloActionName: string;
+    idleActionName: string;
+    helloContent: string;
+}
+export interface IModelSceneConfig {
+    backgroundColor: number;
+    backgroundAlpha: number;
+    camera: {
+        fov: number;
+        near: number;
+        far: number;
+        position: [number, number, number];
+        lookAt: [number, number, number];
+    };
+    ambientLight: {
+        color: number;
+        intensity: number;
+    };
+    directionalLight: {
+        color: number;
+        intensity: number;
+        position: [number, number, number];
+    };
+}
+export type TRobotModelConfig = Partial<IModelSceneConfig> & {
+    modelConfig?: Partial<IModelConfig>;
+    modelUrl?: string;
+};
+export interface IUserDetectorConfig {
+    solutionPath?: string;
+}
+export interface IAssistantRobotConfig<T extends LanguageModel> {
+    className: string;
+    languageModel: ILanguageModelConfig<T>;
+    operationBox: IOperationBoxBoxConfig;
+    robotModel: TRobotModelConfig;
+    userDetector: IUserDetectorConfig;
+}
+export type TCallback = () => void;
+export type TEventListenFunc = (...args: any[]) => void;
+export {};

package/dist/utils-N0deqkZQ.js

@@ -0,0 +1,153 @@
+"use strict";var E=Object.defineProperty;var x=(e,t,o)=>t in e?E(e,t,{enumerable:!0,configurable:!0,writable:!0,value:o}):e[t]=o;var d=(e,t,o)=>(x(e,typeof t!="symbol"?t+"":t,o),o);const b={position:[0,0,0],rotation:[0,Math.PI,0],helloActionName:"hello",idleActionName:"idle",helloContent:"Hi, you can talk to me!"},I={backgroundColor:0,backgroundAlpha:0,camera:{fov:50,near:.1,far:10,position:[0,0,2],lookAt:[0,0,0]},ambientLight:{color:16777215,intensity:.5},directionalLight:{color:16777215,intensity:2,position:[10,10,0]}},N={big:{width:640,height:480},small:{width:360,height:270}},s="assistant-robot-model-container",n="assistant_tip_container",f='<div class="assistant-robot-container ',C=`">
+  <style>
+    .assistant-robot-container{
+      width: 100%;
+      height: 100%;
+      display: flex;
+      flex-direction: column;
+    }
+    .${s}{
+      flex: 1;
+      position:relative;
+      width:100%;
+    }
+    .${n}{
+      position: absolute;
+      top: 2px;
+      left: 50%;
+      min-width: 100px;
+      border: 1px solid #aaaaaa;
+      border-radius: 6px;
+      background: #fff;
+      transform: translate(-50%);
+      padding: 12px 20px;
+      text-align: center;
+      animation: fadeInOut 0.4s ease-in-out;
+    }
+    @keyframes fadeInOut {
+      0% { opacity: 0; }
+      100% { opacity: 1; }
+    }
+    .${n}::after{
+      content: '';
+      display: block;
+      position: absolute;
+      bottom: -6px;
+      left: 50%;
+      width: 8px;
+      height: 8px;
+      transform: rotate(45deg);
+      border-bottom: 1px solid #aaaaaa;
+      border-right: 1px solid #aaaaaa;
+      background: #fff;
+    }
+  </style>
+  <div class="${s}">
+    <div class="${n}">HI!</div>
+
+  </div>
+<div>
+`,g={openCamera:"To interactive with the assistant, we'd like to access your device's camera.Take it easy, your pictures and information won't be sent anywhere or be stored.",alreadyOpenCamera:"the camera have be opened"};var c=(e=>(e.openCamera="openCamera",e.hello="hello",e))(c||{});const _="assistant-robot-input",O="assistant-robot-btn",p="operation_container",l="menu_btn",a="menu_list",S='<div class="assistant-robot-chartbox',m=`">
+<style>
+  .assistant-robot-chartbox{
+    width: 100%;
+    height: 32px;
+    display: flex;
+    flex: 0 0 auto;
+    flex-wrap: wrap;
+    align-items: center;
+    border-radius: 54px;
+    box-shadow: 0 1px 2px -2px rgba(0, 0, 0, 0.16),
+    0 3px 6px 0 rgba(0, 0, 0, 0.12),
+    0 5px 12px 4px rgba(0, 0, 0, 0.09);
+    padding: 10px 12px;
+  }
+  .assistant-robot-input{
+    flex: 1;
+    min-width: 200px;
+    background: rgba(0,0,0,0);
+    border: 1px solid #dedede;
+    height: 28px;
+    margin-right: 6px;
+    outline:none;
+    color: #666666;
+  }
+  .assistant-robot-btn{
+    flex: 0 0 auto;
+    height: 24px;
+  }
+
+  .${p}{
+    position: relative;
+    height: 24px;
+  }
+  .${l}{
+    color: #dedede;
+    width:24px;
+    height: 24px;
+    cursor: pointer;
+  }
+
+  .${a} {
+    display: none;
+    position: absolute;
+    top: 30px;
+    left: 0px;
+    background-color: #fff;
+    border: 1px solid #ccc;
+    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
+    padding: 10px;
+    border-radius: 5px;
+    animation: fadeInOut 0.4s ease-in-out;
+    list-style: none;
+  }
+
+  .${a} li{
+    line-height: 32px;
+    text-wrap: nowrap;
+    border-bottom: 1px solid #dedede;
+    cursor: pointer;
+  }
+
+  .${a} li:last-child{
+    border-bottom: none;
+  }
+
+  @keyframes fadeInOut {
+    0% { opacity: 0; }
+    100% { opacity: 1; }
+  }
+</style>
+<span class="${p}">
+  <svg
+    t="1702017878997"
+    class="${l}"
+    viewBox="0 0 1024 1024"
+    version="1.1"
+    p-id="1322"
+    width="32"
+    height="32"
+    >
+    <path
+      d="M512 512m-116.949333 0a116.949333 116.949333 0 1 0 233.898666 0 116.949333 116.949333 0 1 0-233.898666 0Z"
+      fill="currentColor"
+      p-id="1323"
+    ></path>
+    <path
+      d="M512 159.616m-116.949333 0a116.949333 116.949333 0 1 0 233.898666 0 116.949333 116.949333 0 1 0-233.898666 0Z"
+      fill="currentColor"
+      p-id="1324"
+    ></path>
+    <path
+      d="M512 864.384m-116.949333 0a116.949333 116.949333 0 1 0 233.898666 0 116.949333 116.949333 0 1 0-233.898666 0Z"
+      fill="currentColor"
+      p-id="1325"
+    ></path>
+  </svg>
+  <ul class="${a}">
+    <li data-id="openCamera">Open the Camera</li>
+`,R=`</ul>
+</span>
+<input class="${_}" type="text" />
+<button class="${O}">ask</button>
+</div>`;var T=(e=>(e[e.loading=1]="loading",e[e.ready=2]="ready",e[e.error=3]="error",e))(T||{});const y=50,L=2e3;var h=(e=>(e.init="init",e.ready="ready",e.openCameraRejected="openCameraRejected",e.userMediaUnavailable="userMediaUnavailable",e.faceDetectorCreateError="faceDetectorCreateError",e.error="error",e))(h||{});const u="userDetectorStatusChange";var A=(e=>(e.languageModelLoaded="languageModelLoaded",e[e.userDetectorStatusChange=u]="userDetectorStatusChange",e.menuClick="menuClick",e.ask="ask",e.say="say",e))(A||{});function v(){return/iPhone|iPad|iPod/i.test(navigator.userAgent)}function B(){return/Android/i.test(navigator.userAgent)}function D(){return B()||v()}function M(e){return new DOMParser().parseFromString(e,"text/html").body.firstElementChild}function P(e){if(!Array.isArray(e)||e.length===0)return null;let t=-1/0,o=null;for(let i=0;i<e.length;i++){const r=e[i];r&&typeof r.score=="number"&&r.score>t&&(t=r.score,o=r)}return o}class w{constructor(){d(this,"listeners",{})}addEventListener(t,o){this.listeners[t]?this.get(t).push(o):this.listeners[t]=[o]}removeEventListener(t,o){this.listeners[t]&&(this.listeners[t]=this.get(t).filter(i=>i!==o))}emit(t,...o){this.get(t).map(i=>{i(...o)})}get(t){return this.listeners[t]||[]}}exports.ASSISTANT_MODEL_CONTAINER_CLASS=s;exports.ASSISTANT_TIP_CONTAINER=n;exports.CONTAINER_BODY=C;exports.CONTAINER_HEAD=f;exports.EAssistantEvent=A;exports.ELanguageModelStatus=T;exports.EMenuKey=c;exports.EUserDetectorStatus=h;exports.EventListener=w;exports.MENU_BTN_CLASS=l;exports.MENU_LIST_CLASS=a;exports.MODEL_CONFIG=b;exports.MODEL_SCENE_CONFIG=I;exports.ONE_LETTER_READ_TIME=y;exports.READ_WAIT_TIME=L;exports.ROBOT_OPERATION_BOX_BODY=m;exports.ROBOT_OPERATION_BOX_HEAD=S;exports.ROBOT_OPERATION_BOX_TAIL=R;exports.ROBOT_OPERATION_BTN_CLASS=O;exports.ROBOT_OPERATION_INPUT_CLASS=_;exports.TARGET_FPS=60;exports.USER_DETECTOR_STATUS_CHANGE_EVENT=u;exports.VIDEO_SIZE=N;exports.findHighestScoreItem=P;exports.isMobile=D;exports.parseHTML=M;exports.tips=g;

package/dist/utils-RQ7tdPHo.mjs

@@ -0,0 +1,266 @@
+var c = Object.defineProperty;
+var h = (e, t, a) => t in e ? c(e, t, { enumerable: !0, configurable: !0, writable: !0, value: a }) : e[t] = a;
+var n = (e, t, a) => (h(e, typeof t != "symbol" ? t + "" : t, a), a);
+const A = 60, y = {
+  position: [0, 0, 0],
+  rotation: [0, Math.PI, 0],
+  helloActionName: "hello",
+  idleActionName: "idle",
+  helloContent: "Hi, you can talk to me!"
+}, I = {
+  backgroundColor: 0,
+  backgroundAlpha: 0,
+  camera: {
+    fov: 50,
+    near: 0.1,
+    far: 10,
+    position: [0, 0, 2],
+    lookAt: [0, 0, 0]
+  },
+  ambientLight: {
+    color: 16777215,
+    intensity: 0.5
+  },
+  directionalLight: {
+    color: 16777215,
+    intensity: 2,
+    position: [10, 10, 0]
+  }
+}, N = {
+  big: { width: 640, height: 480 },
+  small: { width: 360, height: 270 }
+}, l = "assistant-robot-model-container", s = "assistant_tip_container", v = '<div class="assistant-robot-container ', R = `">
+  <style>
+    .assistant-robot-container{
+      width: 100%;
+      height: 100%;
+      display: flex;
+      flex-direction: column;
+    }
+    .${l}{
+      flex: 1;
+      position:relative;
+      width:100%;
+    }
+    .${s}{
+      position: absolute;
+      top: 2px;
+      left: 50%;
+      min-width: 100px;
+      border: 1px solid #aaaaaa;
+      border-radius: 6px;
+      background: #fff;
+      transform: translate(-50%);
+      padding: 12px 20px;
+      text-align: center;
+      animation: fadeInOut 0.4s ease-in-out;
+    }
+    @keyframes fadeInOut {
+      0% { opacity: 0; }
+      100% { opacity: 1; }
+    }
+    .${s}::after{
+      content: '';
+      display: block;
+      position: absolute;
+      bottom: -6px;
+      left: 50%;
+      width: 8px;
+      height: 8px;
+      transform: rotate(45deg);
+      border-bottom: 1px solid #aaaaaa;
+      border-right: 1px solid #aaaaaa;
+      background: #fff;
+    }
+  </style>
+  <div class="${l}">
+    <div class="${s}">HI!</div>
+
+  </div>
+<div>
+`, S = {
+  openCamera: "To interactive with the assistant, we'd like to access your device's camera.Take it easy, your pictures and information won't be sent anywhere or be stored.",
+  alreadyOpenCamera: "the camera have be opened"
+};
+var x = /* @__PURE__ */ ((e) => (e.openCamera = "openCamera", e.hello = "hello", e))(x || {});
+const u = "assistant-robot-input", b = "assistant-robot-btn", d = "operation_container", p = "menu_btn", i = "menu_list", w = '<div class="assistant-robot-chartbox', E = `">
+<style>
+  .assistant-robot-chartbox{
+    width: 100%;
+    height: 32px;
+    display: flex;
+    flex: 0 0 auto;
+    flex-wrap: wrap;
+    align-items: center;
+    border-radius: 54px;
+    box-shadow: 0 1px 2px -2px rgba(0, 0, 0, 0.16),
+    0 3px 6px 0 rgba(0, 0, 0, 0.12),
+    0 5px 12px 4px rgba(0, 0, 0, 0.09);
+    padding: 10px 12px;
+  }
+  .assistant-robot-input{
+    flex: 1;
+    min-width: 200px;
+    background: rgba(0,0,0,0);
+    border: 1px solid #dedede;
+    height: 28px;
+    margin-right: 6px;
+    outline:none;
+    color: #666666;
+  }
+  .assistant-robot-btn{
+    flex: 0 0 auto;
+    height: 24px;
+  }
+
+  .${d}{
+    position: relative;
+    height: 24px;
+  }
+  .${p}{
+    color: #dedede;
+    width:24px;
+    height: 24px;
+    cursor: pointer;
+  }
+
+  .${i} {
+    display: none;
+    position: absolute;
+    top: 30px;
+    left: 0px;
+    background-color: #fff;
+    border: 1px solid #ccc;
+    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
+    padding: 10px;
+    border-radius: 5px;
+    animation: fadeInOut 0.4s ease-in-out;
+    list-style: none;
+  }
+
+  .${i} li{
+    line-height: 32px;
+    text-wrap: nowrap;
+    border-bottom: 1px solid #dedede;
+    cursor: pointer;
+  }
+
+  .${i} li:last-child{
+    border-bottom: none;
+  }
+
+  @keyframes fadeInOut {
+    0% { opacity: 0; }
+    100% { opacity: 1; }
+  }
+</style>
+<span class="${d}">
+  <svg
+    t="1702017878997"
+    class="${p}"
+    viewBox="0 0 1024 1024"
+    version="1.1"
+    p-id="1322"
+    width="32"
+    height="32"
+    >
+    <path
+      d="M512 512m-116.949333 0a116.949333 116.949333 0 1 0 233.898666 0 116.949333 116.949333 0 1 0-233.898666 0Z"
+      fill="currentColor"
+      p-id="1323"
+    ></path>
+    <path
+      d="M512 159.616m-116.949333 0a116.949333 116.949333 0 1 0 233.898666 0 116.949333 116.949333 0 1 0-233.898666 0Z"
+      fill="currentColor"
+      p-id="1324"
+    ></path>
+    <path
+      d="M512 864.384m-116.949333 0a116.949333 116.949333 0 1 0 233.898666 0 116.949333 116.949333 0 1 0-233.898666 0Z"
+      fill="currentColor"
+      p-id="1325"
+    ></path>
+  </svg>
+  <ul class="${i}">
+    <li data-id="openCamera">Open the Camera</li>
+`, k = `</ul>
+</span>
+<input class="${u}" type="text" />
+<button class="${b}">ask</button>
+</div>`;
+var f = /* @__PURE__ */ ((e) => (e[e.loading = 1] = "loading", e[e.ready = 2] = "ready", e[e.error = 3] = "error", e))(f || {});
+const $ = 50, L = 2e3;
+var m = /* @__PURE__ */ ((e) => (e.init = "init", e.ready = "ready", e.openCameraRejected = "openCameraRejected", e.userMediaUnavailable = "userMediaUnavailable", e.faceDetectorCreateError = "faceDetectorCreateError", e.error = "error", e))(m || {});
+const O = "userDetectorStatusChange";
+var g = /* @__PURE__ */ ((e) => (e.languageModelLoaded = "languageModelLoaded", e[e.userDetectorStatusChange = O] = "userDetectorStatusChange", e.menuClick = "menuClick", e.ask = "ask", e.say = "say", e))(g || {});
+function _() {
+  return /iPhone|iPad|iPod/i.test(navigator.userAgent);
+}
+function T() {
+  return /Android/i.test(navigator.userAgent);
+}
+function P() {
+  return T() || _();
+}
+function B(e) {
+  return new DOMParser().parseFromString(e, "text/html").body.firstElementChild;
+}
+function M(e) {
+  if (!Array.isArray(e) || e.length === 0)
+    return null;
+  let t = -1 / 0, a = null;
+  for (let o = 0; o < e.length; o++) {
+    const r = e[o];
+    r && typeof r.score == "number" && r.score > t && (t = r.score, a = r);
+  }
+  return a;
+}
+class D {
+  constructor() {
+    n(this, "listeners", {});
+  }
+  addEventListener(t, a) {
+    this.listeners[t] ? this.get(t).push(a) : this.listeners[t] = [a];
+  }
+  removeEventListener(t, a) {
+    this.listeners[t] && (this.listeners[t] = this.get(t).filter(
+      (o) => o !== a
+    ));
+  }
+  emit(t, ...a) {
+    this.get(t).map((o) => {
+      o(...a);
+    });
+  }
+  get(t) {
+    return this.listeners[t] || [];
+  }
+}
+export {
+  s as A,
+  v as C,
+  D as E,
+  I as M,
+  $ as O,
+  L as R,
+  A as T,
+  O as U,
+  N as V,
+  y as a,
+  m as b,
+  w as c,
+  E as d,
+  k as e,
+  b as f,
+  u as g,
+  p as h,
+  P as i,
+  i as j,
+  R as k,
+  l,
+  g as m,
+  x as n,
+  f as o,
+  B as p,
+  M as q,
+  S as t
+};

package/dist/utils.d.ts

@@ -0,0 +1,14 @@
+import { TEventListenFunc } from "./type";
+import type { Answer } from "@tensorflow-models/qna/dist/question_and_answer";
+export declare function isiOS(): boolean;
+export declare function isAndroid(): boolean;
+export declare function isMobile(): boolean;
+export declare function parseHTML(htmlString: string): Element | null;
+export declare function findHighestScoreItem(data: Answer[]): Answer | null;
+export declare class EventListener {
+    private listeners;
+    addEventListener(name: string, func: TEventListenFunc): void;
+    removeEventListener(name: string, func: TEventListenFunc): void;
+    emit(event: string, ...args: any[]): void;
+    get(name: string): TEventListenFunc[];
+}

package/index.d.ts

@@ -0,0 +1,3 @@
+declare module '*.glb?url' {
+  export default  string
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "assistant-robot",
-  "version": "0.0.1-alpha",
+  "version": "0.0.2-alpha",
   "description": "An assistant widget, have a 3D robot which can interact with user, have a simple LLM which can chat with user.",
   "main": "dist/index.js",
   "module": "dist/index.mjs",
@@ -21,15 +21,24 @@
     "three": "^0.158.0"
   },
   "devDependencies": {
+    "@types/three": "^0.159.0",
+    "@typescript-eslint/eslint-plugin": "^6.13.2",
+    "@typescript-eslint/parser": "^6.13.2",
+    "eslint": "^8.55.0",
+    "typescript": "^5.3.2",
     "vite": "^5.0.4"
   },
   "scripts": {
-    "dev": "vite example",
-    "build": "vite build --minify=false",
+    "dev": "vite example --port 7000",
+    "build": "vite build && tsc",
+    "lint": "eslint . --ext ts --report-unused-disable-directives --max-warnings 0",
     "preview": "vite preview"
   },
   "keywords": [
     "assistant",
+    "robot",
+    "web-component",
+    "html",
     "LLM",
     "AI",
     "3D",
@@ -37,5 +46,5 @@
     "UI"
   ],
   "author": "ymrdf",
-  "license": "ISC"
+  "license": "MIT"
 }

package/tsconfig.json

@@ -0,0 +1,26 @@
+{
+  "compilerOptions": {
+    "target": "ES2020",
+    "useDefineForClassFields": true,
+    "lib": ["ES2020", "DOM", "DOM.Iterable"],
+    "module": "ESNext",
+    "skipLibCheck": true,
+
+    /* Bundler mode */
+    "moduleResolution": "Node",
+    "allowImportingTsExtensions": true,
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "emitDeclarationOnly": true,
+
+    /* Linting */
+    "strict": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "noFallthroughCasesInSwitch": true,
+
+    "declaration": true,    // Ensure this option is set to true
+    "outDir": "dist"        // Specify your output directory
+  },
+  "include": ["index.d.ts","src/**/*.ts"]
+}