open-chat-studio-widget 0.3.0 → 0.4.0

package/README.md

@@ -9,13 +9,20 @@ For more information, see the [Open Chat Studio documentation](https://docs.open
 
 ## Properties
 
-| Property              | Attribute     | Description                                            | Type                            | Default     |
-| --------------------- | ------------- | ------------------------------------------------------ | ------------------------------- | ----------- |
-| `botUrl` _(required)_ | `bot-url`     | The URL of the bot to connect to.                      | `string`                        | `undefined` |
-| `buttonText`          | `button-text` | The text to display on the button.                     | `string`                        | `"Chat"`    |
-| `expanded`            | `expanded`    | Whether the chat widget is initially expanded.         | `boolean`                       | `false`     |
-| `position`            | `position`    | The initial position of the chat widget on the screen. | `"center" \| "left" \| "right"` | `'right'`   |
-| `visible`             | `visible`     | Whether the chat widget is visible on load.            | `boolean`                       | `false`     |
+| Property                  | Attribute                   | Description                                                                                                                       | Type                            | Default                         |
+| ------------------------- | --------------------------- | --------------------------------------------------------------------------------------------------------------------------------- | ------------------------------- | ------------------------------- |
+| `apiBaseUrl`              | `api-base-url`              | The base URL for the API (defaults to current origin).                                                                            | `string`                        | `"https://chatbots.dimagi.com"` |
+| `buttonShape`             | `button-shape`              | The shape of the chat button. 'round' makes it circular, 'square' keeps it rectangular.                                           | `"round" \| "square"`           | `'square'`                      |
+| `buttonText`              | `button-text`               | The text to display on the button.                                                                                                | `string`                        | `undefined`                     |
+| `chatbotId` _(required)_  | `chatbot-id`                | The ID of the chatbot to connect to.                                                                                              | `string`                        | `undefined`                     |
+| `expanded`                | `expanded`                  | Whether the chat widget is initially expanded.                                                                                    | `boolean`                       | `false`                         |
+| `iconUrl`                 | `icon-url`                  | URL of the icon to display on the button. If not provided, uses the default OCS logo.                                             | `string`                        | `undefined`                     |
+| `persistentSession`       | `persistent-session`        | Whether to persist session data to local storage to allow resuming previous conversations after page reload.                      | `boolean`                       | `true`                          |
+| `persistentSessionExpire` | `persistent-session-expire` | Minutes since the most recent message after which the session data in local storage will expire. Set this to `0` to never expire. | `number`                        | `60 * 24`                       |
+| `position`                | `position`                  | The initial position of the chat widget on the screen.                                                                            | `"center" \| "left" \| "right"` | `'right'`                       |
+| `starterQuestions`        | `starter-questions`         | Array of starter questions that users can click to send (JSON array of strings)                                                   | `string`                        | `undefined`                     |
+| `visible`                 | `visible`                   | Whether the chat widget is visible on load.                                                                                       | `boolean`                       | `false`                         |
+| `welcomeMessages`         | `welcome-messages`          | Welcome messages to display above starter questions (JSON array of strings)                                                       | `string`                        | `undefined`                     |
 
 
 ## CSS Custom Properties

package/dist/cjs/{index-d39b7c53.js → index-b700441a.js}

@@ -21,7 +21,7 @@ function _interopNamespace(e) {
 }
 
 const NAMESPACE = 'open-chat-studio-widget';
-const BUILD = /* open-chat-studio-widget */ { allRenderFn: true, appendChildSlotFix: false, asyncLoading: true, asyncQueue: false, attachStyles: true, cloneNodeFix: false, cmpDidLoad: false, cmpDidRender: false, cmpDidUnload: false, cmpDidUpdate: false, cmpShouldUpdate: false, cmpWillLoad: true, cmpWillRender: false, cmpWillUpdate: false, connectedCallback: false, constructableCSS: true, cssAnnotations: true, devTools: false, disconnectedCallback: false, element: false, event: false, experimentalScopedSlotChanges: false, experimentalSlotFixes: false, formAssociated: false, hasRenderFn: true, hostListener: false, hostListenerTarget: false, hostListenerTargetBody: false, hostListenerTargetDocument: false, hostListenerTargetParent: false, hostListenerTargetWindow: false, hotModuleReplacement: false, hydrateClientSide: false, hydrateServerSide: false, hydratedAttribute: false, hydratedClass: true, hydratedSelectorName: "hydrated", initializeNextTick: false, invisiblePrehydration: true, isDebug: false, isDev: false, isTesting: false, lazyLoad: true, lifecycle: true, lifecycleDOMEvents: false, member: true, method: false, mode: false, modernPropertyDecls: false, observeAttribute: true, profile: false, prop: true, propBoolean: true, propMutable: true, propNumber: false, propString: true, reflect: false, scoped: false, scopedSlotTextContentFix: false, scriptDataOpts: false, shadowDelegatesFocus: false, shadowDom: true, slot: false, slotChildNodesFix: false, slotRelocation: false, state: true, style: true, svg: true, taskQueue: true, transformTagName: false, updatable: true, vdomAttribute: true, vdomClass: true, vdomFunctional: true, vdomKey: false, vdomListener: true, vdomPropOrAttr: true, vdomRef: false, vdomRender: true, vdomStyle: false, vdomText: true, vdomXlink: false, watchCallback: false };
+const BUILD = /* open-chat-studio-widget */ { allRenderFn: true, appendChildSlotFix: false, asyncLoading: true, asyncQueue: false, attachStyles: true, cloneNodeFix: false, cmpDidLoad: true, cmpDidRender: false, cmpDidUnload: false, cmpDidUpdate: false, cmpShouldUpdate: false, cmpWillLoad: true, cmpWillRender: false, cmpWillUpdate: false, connectedCallback: false, constructableCSS: true, cssAnnotations: true, devTools: false, disconnectedCallback: true, element: false, event: false, experimentalScopedSlotChanges: false, experimentalSlotFixes: false, formAssociated: false, hasRenderFn: true, hostListener: false, hostListenerTarget: false, hostListenerTargetBody: false, hostListenerTargetDocument: false, hostListenerTargetParent: false, hostListenerTargetWindow: false, hotModuleReplacement: false, hydrateClientSide: false, hydrateServerSide: false, hydratedAttribute: false, hydratedClass: true, hydratedSelectorName: "hydrated", initializeNextTick: false, invisiblePrehydration: true, isDebug: false, isDev: false, isTesting: false, lazyLoad: true, lifecycle: true, lifecycleDOMEvents: false, member: true, method: false, mode: false, modernPropertyDecls: false, observeAttribute: true, profile: false, prop: true, propBoolean: true, propMutable: true, propNumber: true, propString: true, reflect: false, scoped: false, scopedSlotTextContentFix: false, scriptDataOpts: false, shadowDelegatesFocus: false, shadowDom: true, slot: false, slotChildNodesFix: false, slotRelocation: false, state: true, style: true, svg: true, taskQueue: true, transformTagName: false, updatable: true, vdomAttribute: true, vdomClass: true, vdomFunctional: true, vdomKey: true, vdomListener: true, vdomPropOrAttr: true, vdomRef: true, vdomRender: true, vdomStyle: true, vdomText: true, vdomXlink: false, watchCallback: false };
 
 /*
  Stencil Client Platform v4.26.0 | MIT Licensed | https://stenciljs.com
@@ -227,6 +227,7 @@ var uniqueTime = (key, measureText) => {
 };
 var h = (nodeName, vnodeData, ...children) => {
   let child = null;
+  let key = null;
   let simple = false;
   let lastSimple = false;
   const vNodeChildren = [];
@@ -250,6 +251,9 @@ var h = (nodeName, vnodeData, ...children) => {
   };
   walk(children);
   if (vnodeData) {
+    if (vnodeData.key) {
+      key = vnodeData.key;
+    }
     {
       const classData = vnodeData.className || vnodeData.class;
       if (classData) {
@@ -269,6 +273,9 @@ var h = (nodeName, vnodeData, ...children) => {
   if (vNodeChildren.length > 0) {
     vnode.$children$ = vNodeChildren;
   }
+  {
+    vnode.$key$ = key;
+  }
   return vnode;
 };
 var newVNode = (tag, text) => {
@@ -282,6 +289,9 @@ var newVNode = (tag, text) => {
   {
     vnode.$attrs$ = null;
   }
+  {
+    vnode.$key$ = null;
+  }
   return vnode;
 };
 var Host = {};
@@ -321,6 +331,9 @@ var parsePropertyValue = (propValue, propType) => {
     if (propType & 4 /* Boolean */) {
       return propValue === "false" ? false : propValue === "" || !!propValue;
     }
+    if (propType & 2 /* Number */) {
+      return parseFloat(propValue);
+    }
     if (propType & 1 /* String */) {
       return String(propValue);
     }
@@ -438,6 +451,31 @@ var setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags, initialRen
         classList.remove(...oldClasses.filter((c) => c && !newClasses.includes(c)));
         classList.add(...newClasses.filter((c) => c && !oldClasses.includes(c)));
       }
+    } else if (memberName === "style") {
+      {
+        for (const prop in oldValue) {
+          if (!newValue || newValue[prop] == null) {
+            if (prop.includes("-")) {
+              elm.style.removeProperty(prop);
+            } else {
+              elm.style[prop] = "";
+            }
+          }
+        }
+      }
+      for (const prop in newValue) {
+        if (!oldValue || newValue[prop] !== oldValue[prop]) {
+          if (prop.includes("-")) {
+            elm.style.setProperty(prop, newValue[prop]);
+          } else {
+            elm.style[prop] = newValue[prop];
+          }
+        }
+      }
+    } else if (memberName === "key") ; else if (memberName === "ref") {
+      if (newValue) {
+        newValue(elm);
+      }
     } else if ((!isProp ) && memberName[0] === "o" && memberName[1] === "n") {
       if (memberName[2] === "-") {
         memberName = memberName.slice(3);
@@ -606,6 +644,7 @@ var removeVnodes = (vnodes, startIdx, endIdx) => {
     const vnode = vnodes[index];
     if (vnode) {
       const elm = vnode.$elm$;
+      nullifyVNodeRefs(vnode);
       if (elm) {
         elm.remove();
       }
@@ -615,6 +654,8 @@ var removeVnodes = (vnodes, startIdx, endIdx) => {
 var updateChildren = (parentElm, oldCh, newVNode2, newCh, isInitialRender = false) => {
   let oldStartIdx = 0;
   let newStartIdx = 0;
+  let idxInOld = 0;
+  let i2 = 0;
   let oldEndIdx = oldCh.length - 1;
   let oldStartVnode = oldCh[0];
   let oldEndVnode = oldCh[oldEndIdx];
@@ -622,6 +663,7 @@ var updateChildren = (parentElm, oldCh, newVNode2, newCh, isInitialRender = fals
   let newStartVnode = newCh[0];
   let newEndVnode = newCh[newEndIdx];
   let node;
+  let elmToMove;
   while (oldStartIdx <= oldEndIdx && newStartIdx <= newEndIdx) {
     if (oldStartVnode == null) {
       oldStartVnode = oldCh[++oldStartIdx];
@@ -650,7 +692,26 @@ var updateChildren = (parentElm, oldCh, newVNode2, newCh, isInitialRender = fals
       oldEndVnode = oldCh[--oldEndIdx];
       newStartVnode = newCh[++newStartIdx];
     } else {
+      idxInOld = -1;
       {
+        for (i2 = oldStartIdx; i2 <= oldEndIdx; ++i2) {
+          if (oldCh[i2] && oldCh[i2].$key$ !== null && oldCh[i2].$key$ === newStartVnode.$key$) {
+            idxInOld = i2;
+            break;
+          }
+        }
+      }
+      if (idxInOld >= 0) {
+        elmToMove = oldCh[idxInOld];
+        if (elmToMove.$tag$ !== newStartVnode.$tag$) {
+          node = createElm(oldCh && oldCh[newStartIdx], newVNode2, idxInOld);
+        } else {
+          patch(elmToMove, newStartVnode, isInitialRender);
+          oldCh[idxInOld] = void 0;
+          node = elmToMove.$elm$;
+        }
+        newStartVnode = newCh[++newStartIdx];
+      } else {
         node = createElm(oldCh && oldCh[newStartIdx], newVNode2, newStartIdx);
         newStartVnode = newCh[++newStartIdx];
       }
@@ -676,6 +737,9 @@ var updateChildren = (parentElm, oldCh, newVNode2, newCh, isInitialRender = fals
 };
 var isSameVnode = (leftVNode, rightVNode, isInitialRender = false) => {
   if (leftVNode.$tag$ === rightVNode.$tag$) {
+    if (!isInitialRender) {
+      return leftVNode.$key$ === rightVNode.$key$;
+    }
     if (isInitialRender && !leftVNode.$key$ && rightVNode.$key$) {
       leftVNode.$key$ = rightVNode.$key$;
     }
@@ -718,6 +782,12 @@ var patch = (oldVNode, newVNode2, isInitialRender = false) => {
     elm.data = text;
   }
 };
+var nullifyVNodeRefs = (vNode) => {
+  {
+    vNode.$attrs$ && vNode.$attrs$.ref && vNode.$attrs$.ref(null);
+    vNode.$children$ && vNode.$children$.map(nullifyVNodeRefs);
+  }
+};
 var insertBefore = (parent, newNode, reference) => {
   {
     return parent == null ? void 0 : parent.insertBefore(newNode, reference);
@@ -847,12 +917,16 @@ var postUpdateComponent = (hostRef) => {
   const tagName = hostRef.$cmpMeta$.$tagName$;
   const elm = hostRef.$hostElement$;
   const endPostUpdate = createTime("postUpdate", tagName);
+  const instance = hostRef.$lazyInstance$ ;
   const ancestorComponent = hostRef.$ancestorComponent$;
   if (!(hostRef.$flags$ & 64 /* hasLoadedComponent */)) {
     hostRef.$flags$ |= 64 /* hasLoadedComponent */;
     {
       addHydratedFlag(elm);
     }
+    {
+      safeCall(instance, "componentDidLoad", void 0, elm);
+    }
     endPostUpdate();
     {
       hostRef.$onReadyResolve$(elm);
@@ -1140,12 +1214,17 @@ var connectedCallback = (elm) => {
   }
 };
 var disconnectInstance = (instance, elm) => {
+  {
+    safeCall(instance, "disconnectedCallback", void 0, elm || instance);
+  }
 };
 var disconnectedCallback = async (elm) => {
   if ((plt.$flags$ & 1 /* isTmpDisconnected */) === 0) {
     const hostRef = getHostRef(elm);
-    if (hostRef == null ? void 0 : hostRef.$lazyInstance$) ; else if (hostRef == null ? void 0 : hostRef.$onReadyPromise$) {
-      hostRef.$onReadyPromise$.then(() => disconnectInstance());
+    if (hostRef == null ? void 0 : hostRef.$lazyInstance$) {
+      disconnectInstance(hostRef.$lazyInstance$, elm);
+    } else if (hostRef == null ? void 0 : hostRef.$onReadyPromise$) {
+      hostRef.$onReadyPromise$.then(() => disconnectInstance(hostRef.$lazyInstance$, elm));
     }
   }
   if (rootAppliedStyles.has(elm)) {
@@ -1290,4 +1369,4 @@ exports.promiseResolve = promiseResolve;
 exports.registerInstance = registerInstance;
 exports.setNonce = setNonce;
 
-//# sourceMappingURL=index-d39b7c53.js.map
+//# sourceMappingURL=index-b700441a.js.map