@nyaruka/temba-components 0.44.0 → 0.46.0

package/dist/sw.js

@@ -1,2 +1,2 @@
-if(!self.define){let e,t={};const o=(o,n)=>(o=new URL(o+".js",n).href,t[o]||new Promise((t=>{if("document"in self){const e=document.createElement("script");e.src=o,e.onload=t,document.head.appendChild(e)}else e=o,importScripts(o),t()})).then((()=>{let e=t[o];if(!e)throw new Error(`Module ${o} didn’t register its module`);return e})));self.define=(n,s)=>{const i=e||("document"in self?document.currentScript.src:"")||location.href;if(t[i])return;let r={};const l=e=>o(e,i),c={module:{uri:i},exports:r,require:l};t[i]=Promise.all(n.map((e=>c[e]||l(e)))).then((e=>(s(...e),r)))}}define(["./workbox-919adfb7"],(function(e){"use strict";self.skipWaiting(),e.clientsClaim(),e.precacheAndRoute([{url:"70a627f4.js",revision:"3bf47e45a5c9480bc847b0995b75eb45"},{url:"templates/components-body.html",revision:"b2237acfe71e5edc08a5155f5be0e3c7"},{url:"templates/components-head.html",revision:"bb349d25dba9dfd2c41f4f2d7a4362c9"}],{}),e.registerRoute(new e.NavigationRoute(e.createHandlerBoundToURL("/index.html"))),e.registerRoute("polyfills/*.js",new e.CacheFirst,"GET")}));
+if(!self.define){let e,t={};const o=(o,n)=>(o=new URL(o+".js",n).href,t[o]||new Promise((t=>{if("document"in self){const e=document.createElement("script");e.src=o,e.onload=t,document.head.appendChild(e)}else e=o,importScripts(o),t()})).then((()=>{let e=t[o];if(!e)throw new Error(`Module ${o} didn’t register its module`);return e})));self.define=(n,s)=>{const i=e||("document"in self?document.currentScript.src:"")||location.href;if(t[i])return;let r={};const l=e=>o(e,i),f={module:{uri:i},exports:r,require:l};t[i]=Promise.all(n.map((e=>f[e]||l(e)))).then((e=>(s(...e),r)))}}define(["./workbox-919adfb7"],(function(e){"use strict";self.skipWaiting(),e.clientsClaim(),e.precacheAndRoute([{url:"041a136a.js",revision:"aff6ee4042394b36cd3b90fab4441403"},{url:"templates/components-body.html",revision:"1f8f52ccde63fce8eb1dd523e501ff57"},{url:"templates/components-head.html",revision:"88f90114b613458d968ac323b1d56af1"}],{}),e.registerRoute(new e.NavigationRoute(e.createHandlerBoundToURL("/index.html"))),e.registerRoute("polyfills/*.js",new e.CacheFirst,"GET")}));
 //# sourceMappingURL=sw.js.map

package/dist/sw.js.map

@@ -1 +1 @@
-{"version":3,"file":"sw.js","sources":["../../../../../tmp/5899974e9391baf2d80ecab5c51f16e5/sw.js"],"sourcesContent":["import {registerRoute as workbox_routing_registerRoute} from '/home/runner/work/temba-components/temba-components/node_modules/workbox-routing/registerRoute.mjs';\nimport {CacheFirst as workbox_strategies_CacheFirst} from '/home/runner/work/temba-components/temba-components/node_modules/workbox-strategies/CacheFirst.mjs';\nimport {clientsClaim as workbox_core_clientsClaim} from '/home/runner/work/temba-components/temba-components/node_modules/workbox-core/clientsClaim.mjs';\nimport {precacheAndRoute as workbox_precaching_precacheAndRoute} from '/home/runner/work/temba-components/temba-components/node_modules/workbox-precaching/precacheAndRoute.mjs';\nimport {NavigationRoute as workbox_routing_NavigationRoute} from '/home/runner/work/temba-components/temba-components/node_modules/workbox-routing/NavigationRoute.mjs';\nimport {createHandlerBoundToURL as workbox_precaching_createHandlerBoundToURL} from '/home/runner/work/temba-components/temba-components/node_modules/workbox-precaching/createHandlerBoundToURL.mjs';/**\n * Welcome to your Workbox-powered service worker!\n *\n * You'll need to register this file in your web app.\n * See https://goo.gl/nhQhGp\n *\n * The rest of the code is auto-generated. Please don't update this file\n * directly; instead, make changes to your Workbox build configuration\n * and re-run your build process.\n * See https://goo.gl/2aRDsh\n */\n\n\n\n\n\n\n\n\nself.skipWaiting();\n\nworkbox_core_clientsClaim();\n\n\n/**\n * The precacheAndRoute() method efficiently caches and responds to\n * requests for URLs in the manifest.\n * See https://goo.gl/S9QRab\n */\nworkbox_precaching_precacheAndRoute([\n  {\n    \"url\": \"70a627f4.js\",\n    \"revision\": \"3bf47e45a5c9480bc847b0995b75eb45\"\n  },\n  {\n    \"url\": \"templates/components-body.html\",\n    \"revision\": \"b2237acfe71e5edc08a5155f5be0e3c7\"\n  },\n  {\n    \"url\": \"templates/components-head.html\",\n    \"revision\": \"bb349d25dba9dfd2c41f4f2d7a4362c9\"\n  }\n], {});\n\nworkbox_routing_registerRoute(new workbox_routing_NavigationRoute(workbox_precaching_createHandlerBoundToURL(\"/index.html\")));\n\n\nworkbox_routing_registerRoute(\"polyfills/*.js\", new workbox_strategies_CacheFirst(), 'GET');\n\n\n\n\n"],"names":["self","skipWaiting","workbox_core_clientsClaim","workbox_precaching_precacheAndRoute","url","revision","workbox","registerRoute","workbox_routing_NavigationRoute","workbox_precaching_createHandlerBoundToURL","workbox_strategies_CacheFirst"],"mappings":"0nBAwBAA,KAAKC,cAELC,EAAAA,eAQAC,EAAAA,iBAAoC,CAClC,CACEC,IAAO,cACPC,SAAY,oCAEd,CACED,IAAO,iCACPC,SAAY,oCAEd,CACED,IAAO,iCACPC,SAAY,qCAEb,CAAE,GAEwBC,EAAAC,cAAC,IAAIC,EAAAA,gBAAgCC,EAAAA,wBAA2C,iBAGhFH,EAAAC,cAAC,iBAAkB,IAAIG,aAAiC"}
+{"version":3,"file":"sw.js","sources":["../../../../../tmp/4f3aa99fd9d4de0a533bbe20291f5b64/sw.js"],"sourcesContent":["import {registerRoute as workbox_routing_registerRoute} from '/home/runner/work/temba-components/temba-components/node_modules/workbox-routing/registerRoute.mjs';\nimport {CacheFirst as workbox_strategies_CacheFirst} from '/home/runner/work/temba-components/temba-components/node_modules/workbox-strategies/CacheFirst.mjs';\nimport {clientsClaim as workbox_core_clientsClaim} from '/home/runner/work/temba-components/temba-components/node_modules/workbox-core/clientsClaim.mjs';\nimport {precacheAndRoute as workbox_precaching_precacheAndRoute} from '/home/runner/work/temba-components/temba-components/node_modules/workbox-precaching/precacheAndRoute.mjs';\nimport {NavigationRoute as workbox_routing_NavigationRoute} from '/home/runner/work/temba-components/temba-components/node_modules/workbox-routing/NavigationRoute.mjs';\nimport {createHandlerBoundToURL as workbox_precaching_createHandlerBoundToURL} from '/home/runner/work/temba-components/temba-components/node_modules/workbox-precaching/createHandlerBoundToURL.mjs';/**\n * Welcome to your Workbox-powered service worker!\n *\n * You'll need to register this file in your web app.\n * See https://goo.gl/nhQhGp\n *\n * The rest of the code is auto-generated. Please don't update this file\n * directly; instead, make changes to your Workbox build configuration\n * and re-run your build process.\n * See https://goo.gl/2aRDsh\n */\n\n\n\n\n\n\n\n\nself.skipWaiting();\n\nworkbox_core_clientsClaim();\n\n\n/**\n * The precacheAndRoute() method efficiently caches and responds to\n * requests for URLs in the manifest.\n * See https://goo.gl/S9QRab\n */\nworkbox_precaching_precacheAndRoute([\n  {\n    \"url\": \"041a136a.js\",\n    \"revision\": \"aff6ee4042394b36cd3b90fab4441403\"\n  },\n  {\n    \"url\": \"templates/components-body.html\",\n    \"revision\": \"1f8f52ccde63fce8eb1dd523e501ff57\"\n  },\n  {\n    \"url\": \"templates/components-head.html\",\n    \"revision\": \"88f90114b613458d968ac323b1d56af1\"\n  }\n], {});\n\nworkbox_routing_registerRoute(new workbox_routing_NavigationRoute(workbox_precaching_createHandlerBoundToURL(\"/index.html\")));\n\n\nworkbox_routing_registerRoute(\"polyfills/*.js\", new workbox_strategies_CacheFirst(), 'GET');\n\n\n\n\n"],"names":["self","skipWaiting","workbox_core_clientsClaim","workbox_precaching_precacheAndRoute","url","revision","workbox","registerRoute","workbox_routing_NavigationRoute","workbox_precaching_createHandlerBoundToURL","workbox_strategies_CacheFirst"],"mappings":"0nBAwBAA,KAAKC,cAELC,EAAAA,eAQAC,EAAAA,iBAAoC,CAClC,CACEC,IAAO,cACPC,SAAY,oCAEd,CACED,IAAO,iCACPC,SAAY,oCAEd,CACED,IAAO,iCACPC,SAAY,qCAEb,CAAE,GAEwBC,EAAAC,cAAC,IAAIC,EAAAA,gBAAgCC,EAAAA,wBAA2C,iBAGhFH,EAAAC,cAAC,iBAAkB,IAAIG,aAAiC"}

package/dist/templates/components-body.html

@@ -1 +1 @@
-<script type="module" src="{{STATIC_URL}}@nyaruka/temba-components/dist/70a627f4.js"></script><script>window.TEMBA_COMPONENTS_VERSION="0.44.0"</script>
+<script type="module" src="{{STATIC_URL}}@nyaruka/temba-components/dist/041a136a.js"></script><script>window.TEMBA_COMPONENTS_VERSION="0.46.0"</script>

package/dist/templates/components-head.html

@@ -1 +1 @@
-<link rel="modulepreload" href="{{STATIC_URL}}@nyaruka/temba-components/dist/70a627f4.js" crossorigin="anonymous">
+<link rel="modulepreload" href="{{STATIC_URL}}@nyaruka/temba-components/dist/041a136a.js" crossorigin="anonymous">

package/out-tsc/src/button/Button.js

@@ -15,6 +15,12 @@ export class Button extends LitElement {
         font-weight: 400;
       }
 
+      .small {
+        font-size: 0.8em;
+        --button-y: 0px;
+        --button-x: 0.5em;
+      }
+
       .v-2.button-container {
         background: var(--button-bg);
         background-image: var(--button-bg-img);
@@ -193,6 +199,7 @@ export class Button extends LitElement {
             'attention-button': this.attention,
             'destructive-button': this.destructive,
             'light-button': this.light,
+            small: this.small,
         })}"
         tabindex="0"
         @mousedown=${this.handleMouseDown}
@@ -238,6 +245,9 @@ __decorate([
 __decorate([
     property({ type: Boolean })
 ], Button.prototype, "active", void 0);
+__decorate([
+    property({ type: Boolean })
+], Button.prototype, "small", void 0);
 __decorate([
     property({ type: String })
 ], Button.prototype, "href", void 0);

package/out-tsc/src/button/Button.js.map

@@ -1 +1 @@
-{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../../src/button/Button.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, TemplateResult, html, css } from 'lit';\nimport { getClasses } from '../utils';\n\nimport { property } from 'lit/decorators.js';\n\nexport class Button extends LitElement {\n  static get styles() {\n    return css`\n      :host {\n        display: inline-block;\n        font-family: var(--font-family);\n        font-weight: 400;\n      }\n\n      .v-2.button-container {\n        background: var(--button-bg);\n        background-image: var(--button-bg-img);\n        color: var(--button-text);\n        box-shadow: var(--button-shadow);\n        transition: all calc(var(--transition-speed) / 2) ease-in;\n      }\n\n      .button-container {\n        color: #fff;\n        cursor: pointer;\n        display: block;\n        border-radius: var(--curvature);\n        outline: none;\n        transition: background ease-in var(--transition-speed);\n        user-select: none;\n        -webkit-user-select: none;\n        text-align: center;\n      }\n\n      .button-name {\n        white-space: nowrap;\n      }\n\n      .secondary-button:hover .button-mask {\n        border: 1px solid var(--color-button-secondary);\n      }\n\n      .button-mask:hover {\n        background: rgba(0, 0, 0, 0.05);\n      }\n\n      .button-container:focus {\n        outline: none;\n        margin: 0;\n      }\n\n      .button-container:focus {\n        box-shadow: var(--widget-box-shadow-focused);\n      }\n\n      .button-container.secondary-button:focus .button-mask {\n        background: transparent;\n      }\n\n      .button-mask {\n        padding: var(--button-y) var(--button-x);\n        border-radius: var(--curvature);\n        border: 1px solid transparent;\n        transition: var(--transition-speed);\n        background: var(--button-mask);\n      }\n\n      .button-container.disabled-button {\n        background: rgba(0, 0, 0, 0.05);\n        color: rgba(255, 255, 255, 0.45);\n        cursor: default;\n      }\n\n      .button-container.disabled-button .button-mask {\n        box-shadow: 0 0 0px 1px var(--color-button-disabled);\n      }\n\n      .button-container.disabled-button:hover .button-mask {\n        box-shadow: 0 0 0px 1px var(--color-button-disabled);\n        background: rgba(0, 0, 0, 0.05);\n      }\n\n      .button-container.active-button .button-mask {\n      }\n\n      .secondary-button.active-button {\n        background: transparent;\n        color: var(--color-text);\n      }\n\n      .secondary-button.active-button .button-mask {\n        border: none;\n      }\n\n      .button-container.secondary-button.active-button:focus .button-mask {\n        background: transparent;\n        box-shadow: none;\n      }\n\n      .primary-button {\n        background: var(--color-button-primary);\n        color: var(--color-button-primary-text);\n      }\n\n      .light-button {\n        background: var(--color-button-light);\n        color: var(--color-button-light-text);\n      }\n\n      .attention-button {\n        background: var(--color-button-attention);\n        color: var(--color-button-primary-text);\n      }\n\n      .secondary-button {\n        background: transparent;\n        color: var(--color-text);\n        font-weight: 300;\n      }\n\n      .destructive-button {\n        background: var(--color-button-destructive);\n        color: var(--color-button-destructive-text);\n      }\n\n      .button-mask.disabled-button {\n        background: rgba(0, 0, 0, 0.1);\n      }\n\n      .secondary-button .button-mask:hover {\n        background: transparent;\n      }\n\n      .submit-animation {\n        padding: 1px 4px;\n      }\n\n      .submit-animation temba-loading {\n        margin-bottom: -3px;\n        line-height: normal;\n      }\n    `;\n  }\n\n  @property({ type: Boolean })\n  primary: boolean;\n\n  @property({ type: Boolean })\n  secondary: boolean;\n\n  @property({ type: Boolean })\n  attention: boolean;\n\n  @property({ type: Number })\n  v = 1;\n\n  @property({ type: Boolean })\n  destructive: boolean;\n\n  @property({ type: Boolean })\n  light: boolean;\n\n  @property()\n  name: string;\n\n  @property({ type: Boolean })\n  disabled: boolean;\n\n  @property({ type: Boolean })\n  submitting: boolean;\n\n  @property({ type: Boolean })\n  active: boolean;\n\n  @property({ type: String })\n  href: string;\n\n  private handleClick(evt: MouseEvent) {\n    if (this.disabled) {\n      evt.preventDefault();\n      evt.stopPropagation();\n    }\n\n    if (this.href && !this.disabled) {\n      this.ownerDocument.location.href = this.href;\n      evt.preventDefault();\n      evt.stopPropagation();\n    }\n  }\n\n  private handleKeyUp(event: KeyboardEvent): void {\n    this.active = false;\n    if (event.key === 'Enter') {\n      this.click();\n    }\n  }\n\n  private handleMouseDown(): void {\n    if (!this.disabled && !this.submitting) {\n      this.active = true;\n      this.classList.add('active');\n    }\n  }\n\n  private handleMouseUp(): void {\n    this.active = false;\n    this.classList.remove('active');\n  }\n\n  public render(): TemplateResult {\n    const buttonName = this.submitting\n      ? html`<div class=\"submit-animation\">\n          <temba-loading units=\"3\" size=\"8\" color=\"#eee\"></temba-loading>\n        </div>`\n      : this.name;\n\n    return html`\n      <div\n        class=\"button-container \n          v-${this.v}\n          ${getClasses({\n          'primary-button':\n            this.primary ||\n            (!this.primary &&\n              !this.secondary &&\n              !this.attention &&\n              this.v == 1),\n          'secondary-button': this.secondary,\n          'disabled-button': this.disabled,\n          'active-button': this.active,\n          'attention-button': this.attention,\n          'destructive-button': this.destructive,\n          'light-button': this.light,\n        })}\"\n        tabindex=\"0\"\n        @mousedown=${this.handleMouseDown}\n        @mouseup=${this.handleMouseUp}\n        @mouseleave=${this.handleMouseUp}\n        @keyup=${this.handleKeyUp}\n        @click=${this.handleClick}\n      >\n        <div class=\"button-mask\">\n          <div class=\"button-name\">${buttonName}</div>\n        </div>\n      </div>\n    `;\n  }\n}\n"]}
+{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../../src/button/Button.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, TemplateResult, html, css } from 'lit';\nimport { getClasses } from '../utils';\n\nimport { property } from 'lit/decorators.js';\n\nexport class Button extends LitElement {\n  static get styles() {\n    return css`\n      :host {\n        display: inline-block;\n        font-family: var(--font-family);\n        font-weight: 400;\n      }\n\n      .small {\n        font-size: 0.8em;\n        --button-y: 0px;\n        --button-x: 0.5em;\n      }\n\n      .v-2.button-container {\n        background: var(--button-bg);\n        background-image: var(--button-bg-img);\n        color: var(--button-text);\n        box-shadow: var(--button-shadow);\n        transition: all calc(var(--transition-speed) / 2) ease-in;\n      }\n\n      .button-container {\n        color: #fff;\n        cursor: pointer;\n        display: block;\n        border-radius: var(--curvature);\n        outline: none;\n        transition: background ease-in var(--transition-speed);\n        user-select: none;\n        -webkit-user-select: none;\n        text-align: center;\n      }\n\n      .button-name {\n        white-space: nowrap;\n      }\n\n      .secondary-button:hover .button-mask {\n        border: 1px solid var(--color-button-secondary);\n      }\n\n      .button-mask:hover {\n        background: rgba(0, 0, 0, 0.05);\n      }\n\n      .button-container:focus {\n        outline: none;\n        margin: 0;\n      }\n\n      .button-container:focus {\n        box-shadow: var(--widget-box-shadow-focused);\n      }\n\n      .button-container.secondary-button:focus .button-mask {\n        background: transparent;\n      }\n\n      .button-mask {\n        padding: var(--button-y) var(--button-x);\n        border-radius: var(--curvature);\n        border: 1px solid transparent;\n        transition: var(--transition-speed);\n        background: var(--button-mask);\n      }\n\n      .button-container.disabled-button {\n        background: rgba(0, 0, 0, 0.05);\n        color: rgba(255, 255, 255, 0.45);\n        cursor: default;\n      }\n\n      .button-container.disabled-button .button-mask {\n        box-shadow: 0 0 0px 1px var(--color-button-disabled);\n      }\n\n      .button-container.disabled-button:hover .button-mask {\n        box-shadow: 0 0 0px 1px var(--color-button-disabled);\n        background: rgba(0, 0, 0, 0.05);\n      }\n\n      .button-container.active-button .button-mask {\n      }\n\n      .secondary-button.active-button {\n        background: transparent;\n        color: var(--color-text);\n      }\n\n      .secondary-button.active-button .button-mask {\n        border: none;\n      }\n\n      .button-container.secondary-button.active-button:focus .button-mask {\n        background: transparent;\n        box-shadow: none;\n      }\n\n      .primary-button {\n        background: var(--color-button-primary);\n        color: var(--color-button-primary-text);\n      }\n\n      .light-button {\n        background: var(--color-button-light);\n        color: var(--color-button-light-text);\n      }\n\n      .attention-button {\n        background: var(--color-button-attention);\n        color: var(--color-button-primary-text);\n      }\n\n      .secondary-button {\n        background: transparent;\n        color: var(--color-text);\n        font-weight: 300;\n      }\n\n      .destructive-button {\n        background: var(--color-button-destructive);\n        color: var(--color-button-destructive-text);\n      }\n\n      .button-mask.disabled-button {\n        background: rgba(0, 0, 0, 0.1);\n      }\n\n      .secondary-button .button-mask:hover {\n        background: transparent;\n      }\n\n      .submit-animation {\n        padding: 1px 4px;\n      }\n\n      .submit-animation temba-loading {\n        margin-bottom: -3px;\n        line-height: normal;\n      }\n    `;\n  }\n\n  @property({ type: Boolean })\n  primary: boolean;\n\n  @property({ type: Boolean })\n  secondary: boolean;\n\n  @property({ type: Boolean })\n  attention: boolean;\n\n  @property({ type: Number })\n  v = 1;\n\n  @property({ type: Boolean })\n  destructive: boolean;\n\n  @property({ type: Boolean })\n  light: boolean;\n\n  @property()\n  name: string;\n\n  @property({ type: Boolean })\n  disabled: boolean;\n\n  @property({ type: Boolean })\n  submitting: boolean;\n\n  @property({ type: Boolean })\n  active: boolean;\n\n  @property({ type: Boolean })\n  small: boolean;\n\n  @property({ type: String })\n  href: string;\n\n  private handleClick(evt: MouseEvent) {\n    if (this.disabled) {\n      evt.preventDefault();\n      evt.stopPropagation();\n    }\n\n    if (this.href && !this.disabled) {\n      this.ownerDocument.location.href = this.href;\n      evt.preventDefault();\n      evt.stopPropagation();\n    }\n  }\n\n  private handleKeyUp(event: KeyboardEvent): void {\n    this.active = false;\n    if (event.key === 'Enter') {\n      this.click();\n    }\n  }\n\n  private handleMouseDown(): void {\n    if (!this.disabled && !this.submitting) {\n      this.active = true;\n      this.classList.add('active');\n    }\n  }\n\n  private handleMouseUp(): void {\n    this.active = false;\n    this.classList.remove('active');\n  }\n\n  public render(): TemplateResult {\n    const buttonName = this.submitting\n      ? html`<div class=\"submit-animation\">\n          <temba-loading units=\"3\" size=\"8\" color=\"#eee\"></temba-loading>\n        </div>`\n      : this.name;\n\n    return html`\n      <div\n        class=\"button-container \n          v-${this.v}\n          ${getClasses({\n          'primary-button':\n            this.primary ||\n            (!this.primary &&\n              !this.secondary &&\n              !this.attention &&\n              this.v == 1),\n          'secondary-button': this.secondary,\n          'disabled-button': this.disabled,\n          'active-button': this.active,\n          'attention-button': this.attention,\n          'destructive-button': this.destructive,\n          'light-button': this.light,\n          small: this.small,\n        })}\"\n        tabindex=\"0\"\n        @mousedown=${this.handleMouseDown}\n        @mouseup=${this.handleMouseUp}\n        @mouseleave=${this.handleMouseUp}\n        @keyup=${this.handleKeyUp}\n        @click=${this.handleClick}\n      >\n        <div class=\"button-mask\">\n          <div class=\"button-name\">${buttonName}</div>\n        </div>\n      </div>\n    `;\n  }\n}\n"]}

package/out-tsc/src/completion/Completion.js

@@ -114,6 +114,9 @@ export class Completion extends FormElement {
     }
     executeQuery(ele) {
         const store = document.querySelector('temba-store');
+        if (!ele.inputElement) {
+            return;
+        }
         const result = executeCompletionQuery(ele.inputElement, store, this.session);
         this.query = result.query;
         this.options = result.options;

package/out-tsc/src/completion/Completion.js.map

@@ -1 +1 @@
-{"version":3,"file":"Completion.js","sourceRoot":"","sources":["../../../src/completion/Completion.ts"],"names":[],"mappings":"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","sourcesContent":["import { TemplateResult, css, html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { ifDefined } from 'lit-html/directives/if-defined.js';\nimport { TextInput } from '../textinput/TextInput';\nimport {\n  renderCompletionOption,\n  updateInputElementWithCompletion,\n  executeCompletionQuery,\n} from './helpers';\n\nimport { FormElement } from '../FormElement';\nimport { CompletionOption, Position } from '../interfaces';\nimport { Store } from '../store/Store';\nimport { styleMap } from 'lit-html/directives/style-map.js';\n\n/**\n * Completion is a text input that handles excellent completion options in a popup\n */\nexport class Completion extends FormElement {\n  static get styles() {\n    return css`\n      :host {\n        display: block;\n      }\n\n      temba-options {\n        --widget-box-shadow-focused: 0 0 4px rgba(0, 0, 0, 0.15);\n        --color-focus: #e6e6e6;\n      }\n\n      .comp-container {\n        position: relative;\n        height: 100%;\n      }\n\n      #anchor {\n        /* background: rgba(132, 40, 158, .1); */\n        position: absolute;\n        visibility: hidden;\n        width: 250px;\n        height: 20px;\n      }\n\n      .fn-marker {\n        font-weight: bold;\n        font-size: 42px;\n      }\n\n      .option-slot {\n        background: #fff;\n      }\n\n      .current-fn {\n        padding: 10px;\n        margin: 5px;\n        background: var(--color-primary-light);\n        color: rgba(0, 0, 0, 0.5);\n        border-radius: var(--curvature-widget);\n        font-size: 90%;\n      }\n\n      .footer {\n        padding: 5px 10px;\n        background: var(--color-primary-light);\n        color: rgba(0, 0, 0, 0.5);\n        font-size: 80%;\n        border-bottom-left-radius: var(--curvature-widget);\n        border-bottom-right-radius: var(--curvature-widget);\n      }\n\n      code {\n        background: rgba(0, 0, 0, 0.1);\n        padding: 1px 5px;\n        border-radius: var(--curvature);\n      }\n    `;\n  }\n\n  @property({ type: Boolean })\n  session: boolean;\n\n  @property({ type: Boolean })\n  submitOnEnter = false;\n\n  @property({ type: Object })\n  anchorPosition: Position = { left: 0, top: 0 };\n\n  @property({ attribute: false })\n  currentFunction: CompletionOption;\n\n  @property({ type: String })\n  placeholder = '';\n\n  @property({ attribute: false })\n  textInputElement: TextInput;\n\n  @property({ attribute: false })\n  anchorElement: HTMLDivElement;\n\n  @property({ type: Array })\n  options: any[] = [];\n\n  @property({ type: String })\n  name = '';\n\n  @property({ type: String })\n  value = '';\n\n  @property({ type: Boolean })\n  textarea: boolean;\n\n  @property({ type: Boolean })\n  gsm: boolean;\n\n  @property({ type: String })\n  counter: string;\n\n  @property({ type: Boolean })\n  autogrow = false;\n\n  private hiddenElement: HTMLInputElement;\n  private query: string;\n\n  public firstUpdated() {\n    this.textInputElement = this.shadowRoot.querySelector(\n      'temba-textinput'\n    ) as TextInput;\n    this.anchorElement = this.shadowRoot.querySelector('#anchor');\n\n    // create our hidden container so it gets included in our host element's form\n    this.hiddenElement = document.createElement('input');\n    this.hiddenElement.setAttribute('type', 'hidden');\n    this.hiddenElement.setAttribute('name', this.getAttribute('name'));\n    this.hiddenElement.setAttribute('value', this.getAttribute('value') || '');\n    this.appendChild(this.hiddenElement);\n  }\n\n  private handleKeyUp(evt: KeyboardEvent) {\n    // if we have options, ignore keys that are meant for them\n    if (this.options && this.options.length > 0) {\n      if (evt.key === 'ArrowUp' || evt.key === 'ArrowDown') {\n        return;\n      }\n\n      if (evt.ctrlKey) {\n        if (evt.key === 'n' || evt.key === 'p') {\n          return;\n        }\n      }\n\n      if (\n        evt.key === 'Enter' ||\n        evt.key === 'Escape' ||\n        evt.key === 'Tab' ||\n        evt.key.startsWith('Control')\n      ) {\n        evt.stopPropagation();\n        evt.preventDefault();\n        return;\n      }\n\n      this.executeQuery(evt.currentTarget as TextInput);\n    }\n  }\n\n  public hasVisibleOptions() {\n    return this.options.length > 0;\n  }\n\n  private executeQuery(ele: TextInput) {\n    const store: Store = document.querySelector('temba-store');\n    const result = executeCompletionQuery(\n      ele.inputElement,\n      store,\n      this.session\n    );\n\n    this.query = result.query;\n    this.options = result.options;\n    this.anchorPosition = result.anchorPosition;\n  }\n\n  private handleClick(evt: MouseEvent) {\n    this.executeQuery(evt.currentTarget as TextInput);\n  }\n\n  public updated(changedProperties: Map<string, any>) {\n    super.updated(changedProperties);\n\n    // if our cursor changed, lets make sure our scrollbox is showing it\n    if (changedProperties.has('value')) {\n      this.hiddenElement.setAttribute('value', this.value);\n    }\n  }\n\n  private handleInput(evt: KeyboardEvent) {\n    const ele = evt.currentTarget as TextInput;\n    this.executeQuery(ele);\n    this.value = ele.inputElement.value;\n    this.fireEvent('change');\n  }\n\n  private handleOptionCanceled() {\n    // delay in case we are actively selecting\n    window.setTimeout(() => {\n      this.options = [];\n      this.query = '';\n    }, 100);\n  }\n\n  private handleOptionSelection(evt: CustomEvent) {\n    const option = evt.detail.selected as CompletionOption;\n    const tabbed = evt.detail.tabbed;\n\n    updateInputElementWithCompletion(\n      this.query,\n      this.textInputElement.inputElement,\n      option\n    );\n    this.query = '';\n    this.options = [];\n\n    if (tabbed) {\n      this.executeQuery(this.textInputElement);\n    }\n  }\n\n  public click() {\n    super.click();\n    const input = this.shadowRoot.querySelector('temba-textinput') as TextInput;\n    if (input) {\n      input.click();\n    }\n  }\n\n  public render(): TemplateResult {\n    const anchorStyles = this.anchorPosition\n      ? {\n          top: `${this.anchorPosition.top}px`,\n          left: `${this.anchorPosition.left}px`,\n        }\n      : {};\n\n    return html`\n      <temba-field\n        name=${this.name}\n        .label=${this.label}\n        .helpText=${this.helpText}\n        .errors=${this.errors}\n        .widgetOnly=${this.widgetOnly}\n      >\n        <div class=\"comp-container\">\n          <div id=\"anchor\" style=${styleMap(anchorStyles)}></div>\n          <temba-textinput\n            name=${this.name}\n            placeholder=${this.placeholder}\n            gsm=${this.gsm}\n            counter=${ifDefined(this.counter)}\n            @keyup=${this.handleKeyUp}\n            @click=${this.handleClick}\n            @input=${this.handleInput}\n            @blur=${this.handleOptionCanceled}\n            .value=${this.value}\n            ?autogrow=${this.autogrow}\n            ?textarea=${this.textarea}\n            ?submitOnEnter=${this.submitOnEnter}\n          >\n          </temba-textinput>\n          <temba-options\n            @temba-selection=${this.handleOptionSelection}\n            @temba-canceled=${this.handleOptionCanceled}\n            .renderOption=${renderCompletionOption}\n            .anchorTo=${this.anchorElement}\n            .options=${this.options}\n            ?visible=${this.options && this.options.length > 0}\n          >\n            ${this.currentFunction\n              ? html`\n                  <div class=\"current-fn\">\n                    ${renderCompletionOption(this.currentFunction, true)}\n                  </div>\n                `\n              : null}\n            <div class=\"footer\">Tab to complete, enter to select</div>\n          </temba-options>\n        </div>\n      </temba-field>\n    `;\n  }\n}\n"]}
+{"version":3,"file":"Completion.js","sourceRoot":"","sources":["../../../src/completion/Completion.ts"],"names":[],"mappings":"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","sourcesContent":["import { TemplateResult, css, html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { ifDefined } from 'lit-html/directives/if-defined.js';\nimport { TextInput } from '../textinput/TextInput';\nimport {\n  renderCompletionOption,\n  updateInputElementWithCompletion,\n  executeCompletionQuery,\n} from './helpers';\n\nimport { FormElement } from '../FormElement';\nimport { CompletionOption, Position } from '../interfaces';\nimport { Store } from '../store/Store';\nimport { styleMap } from 'lit-html/directives/style-map.js';\n\n/**\n * Completion is a text input that handles excellent completion options in a popup\n */\nexport class Completion extends FormElement {\n  static get styles() {\n    return css`\n      :host {\n        display: block;\n      }\n\n      temba-options {\n        --widget-box-shadow-focused: 0 0 4px rgba(0, 0, 0, 0.15);\n        --color-focus: #e6e6e6;\n      }\n\n      .comp-container {\n        position: relative;\n        height: 100%;\n      }\n\n      #anchor {\n        /* background: rgba(132, 40, 158, .1); */\n        position: absolute;\n        visibility: hidden;\n        width: 250px;\n        height: 20px;\n      }\n\n      .fn-marker {\n        font-weight: bold;\n        font-size: 42px;\n      }\n\n      .option-slot {\n        background: #fff;\n      }\n\n      .current-fn {\n        padding: 10px;\n        margin: 5px;\n        background: var(--color-primary-light);\n        color: rgba(0, 0, 0, 0.5);\n        border-radius: var(--curvature-widget);\n        font-size: 90%;\n      }\n\n      .footer {\n        padding: 5px 10px;\n        background: var(--color-primary-light);\n        color: rgba(0, 0, 0, 0.5);\n        font-size: 80%;\n        border-bottom-left-radius: var(--curvature-widget);\n        border-bottom-right-radius: var(--curvature-widget);\n      }\n\n      code {\n        background: rgba(0, 0, 0, 0.1);\n        padding: 1px 5px;\n        border-radius: var(--curvature);\n      }\n    `;\n  }\n\n  @property({ type: Boolean })\n  session: boolean;\n\n  @property({ type: Boolean })\n  submitOnEnter = false;\n\n  @property({ type: Object })\n  anchorPosition: Position = { left: 0, top: 0 };\n\n  @property({ attribute: false })\n  currentFunction: CompletionOption;\n\n  @property({ type: String })\n  placeholder = '';\n\n  @property({ attribute: false })\n  textInputElement: TextInput;\n\n  @property({ attribute: false })\n  anchorElement: HTMLDivElement;\n\n  @property({ type: Array })\n  options: any[] = [];\n\n  @property({ type: String })\n  name = '';\n\n  @property({ type: String })\n  value = '';\n\n  @property({ type: Boolean })\n  textarea: boolean;\n\n  @property({ type: Boolean })\n  gsm: boolean;\n\n  @property({ type: String })\n  counter: string;\n\n  @property({ type: Boolean })\n  autogrow = false;\n\n  private hiddenElement: HTMLInputElement;\n  private query: string;\n\n  public firstUpdated() {\n    this.textInputElement = this.shadowRoot.querySelector(\n      'temba-textinput'\n    ) as TextInput;\n    this.anchorElement = this.shadowRoot.querySelector('#anchor');\n\n    // create our hidden container so it gets included in our host element's form\n    this.hiddenElement = document.createElement('input');\n    this.hiddenElement.setAttribute('type', 'hidden');\n    this.hiddenElement.setAttribute('name', this.getAttribute('name'));\n    this.hiddenElement.setAttribute('value', this.getAttribute('value') || '');\n    this.appendChild(this.hiddenElement);\n  }\n\n  private handleKeyUp(evt: KeyboardEvent) {\n    // if we have options, ignore keys that are meant for them\n    if (this.options && this.options.length > 0) {\n      if (evt.key === 'ArrowUp' || evt.key === 'ArrowDown') {\n        return;\n      }\n\n      if (evt.ctrlKey) {\n        if (evt.key === 'n' || evt.key === 'p') {\n          return;\n        }\n      }\n\n      if (\n        evt.key === 'Enter' ||\n        evt.key === 'Escape' ||\n        evt.key === 'Tab' ||\n        evt.key.startsWith('Control')\n      ) {\n        evt.stopPropagation();\n        evt.preventDefault();\n        return;\n      }\n\n      this.executeQuery(evt.currentTarget as TextInput);\n    }\n  }\n\n  public hasVisibleOptions() {\n    return this.options.length > 0;\n  }\n\n  private executeQuery(ele: TextInput) {\n    const store: Store = document.querySelector('temba-store');\n    if (!ele.inputElement) {\n      return;\n    }\n    const result = executeCompletionQuery(\n      ele.inputElement,\n      store,\n      this.session\n    );\n\n    this.query = result.query;\n    this.options = result.options;\n    this.anchorPosition = result.anchorPosition;\n  }\n\n  private handleClick(evt: MouseEvent) {\n    this.executeQuery(evt.currentTarget as TextInput);\n  }\n\n  public updated(changedProperties: Map<string, any>) {\n    super.updated(changedProperties);\n\n    // if our cursor changed, lets make sure our scrollbox is showing it\n    if (changedProperties.has('value')) {\n      this.hiddenElement.setAttribute('value', this.value);\n    }\n  }\n\n  private handleInput(evt: KeyboardEvent) {\n    const ele = evt.currentTarget as TextInput;\n    this.executeQuery(ele);\n    this.value = ele.inputElement.value;\n    this.fireEvent('change');\n  }\n\n  private handleOptionCanceled() {\n    // delay in case we are actively selecting\n    window.setTimeout(() => {\n      this.options = [];\n      this.query = '';\n    }, 100);\n  }\n\n  private handleOptionSelection(evt: CustomEvent) {\n    const option = evt.detail.selected as CompletionOption;\n    const tabbed = evt.detail.tabbed;\n\n    updateInputElementWithCompletion(\n      this.query,\n      this.textInputElement.inputElement,\n      option\n    );\n    this.query = '';\n    this.options = [];\n\n    if (tabbed) {\n      this.executeQuery(this.textInputElement);\n    }\n  }\n\n  public click() {\n    super.click();\n    const input = this.shadowRoot.querySelector('temba-textinput') as TextInput;\n    if (input) {\n      input.click();\n    }\n  }\n\n  public render(): TemplateResult {\n    const anchorStyles = this.anchorPosition\n      ? {\n          top: `${this.anchorPosition.top}px`,\n          left: `${this.anchorPosition.left}px`,\n        }\n      : {};\n\n    return html`\n      <temba-field\n        name=${this.name}\n        .label=${this.label}\n        .helpText=${this.helpText}\n        .errors=${this.errors}\n        .widgetOnly=${this.widgetOnly}\n      >\n        <div class=\"comp-container\">\n          <div id=\"anchor\" style=${styleMap(anchorStyles)}></div>\n          <temba-textinput\n            name=${this.name}\n            placeholder=${this.placeholder}\n            gsm=${this.gsm}\n            counter=${ifDefined(this.counter)}\n            @keyup=${this.handleKeyUp}\n            @click=${this.handleClick}\n            @input=${this.handleInput}\n            @blur=${this.handleOptionCanceled}\n            .value=${this.value}\n            ?autogrow=${this.autogrow}\n            ?textarea=${this.textarea}\n            ?submitOnEnter=${this.submitOnEnter}\n          >\n          </temba-textinput>\n          <temba-options\n            @temba-selection=${this.handleOptionSelection}\n            @temba-canceled=${this.handleOptionCanceled}\n            .renderOption=${renderCompletionOption}\n            .anchorTo=${this.anchorElement}\n            .options=${this.options}\n            ?visible=${this.options && this.options.length > 0}\n          >\n            ${this.currentFunction\n              ? html`\n                  <div class=\"current-fn\">\n                    ${renderCompletionOption(this.currentFunction, true)}\n                  </div>\n                `\n              : null}\n            <div class=\"footer\">Tab to complete, enter to select</div>\n          </temba-options>\n        </div>\n      </temba-field>\n    `;\n  }\n}\n"]}

package/out-tsc/src/completion/helpers.js

@@ -239,6 +239,9 @@ export const executeCompletionQuery = (ele, store, session) => {
         anchorPosition: null,
         query: null,
     };
+    if (!ele) {
+        return;
+    }
     // we need a store to do anything useful
     if (!store) {
         return result;

package/out-tsc/src/completion/helpers.js.map

@@ -1 +1 @@
-{"version":3,"file":"helpers.js","sourceRoot":"","sources":["../../../src/completion/helpers.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, TemplateResult } from 'lit';\nimport { unsafeHTML } from 'lit-html/directives/unsafe-html.js';\nimport {\n  directive,\n  Directive,\n  Part,\n  PartInfo,\n  PartType,\n} from 'lit/directive.js';\nimport ExcellentParser, { Expression } from './ExcellentParser';\nimport {\n  CompletionOption,\n  CompletionProperty,\n  CompletionResult,\n  CompletionSchema,\n  CompletionType,\n  KeyedAssets,\n} from '../interfaces';\nimport { Store } from '../store/Store';\nimport { Remarkable } from 'remarkable';\n\nconst md = new Remarkable();\n\nconst messageParser = new ExcellentParser('@', [\n  'contact',\n  'fields',\n  'globals',\n  'urns',\n]);\n\nconst sessionParser = new ExcellentParser('@', [\n  'contact',\n  'fields',\n  'globals',\n  'urns',\n  'results',\n  'input',\n  'run',\n  'child',\n  'parent',\n  'node',\n  'webhook',\n  'ticket',\n  'trigger',\n  'resume',\n]);\n\n// Class-based directive API\nexport class RenderMarkdown extends Directive {\n  // State stored in class field\n  value: string | undefined;\n  constructor(partInfo: PartInfo) {\n    super(partInfo);\n    // When necessary, validate part in constructor using `part.type`\n    if (partInfo.type !== PartType.CHILD) {\n      throw new Error('renderMarkdown only supports child expressions');\n    }\n  }\n  // Optional: override update to perform any direct DOM manipulation\n  // DirectiveParameters<this>\n  update(part: Part, [initialValue]: any) {\n    /* Any imperative updates to DOM/parts would go here */\n    return this.render(initialValue);\n  }\n  // Do SSR-compatible rendering (arguments are passed from call site)\n  render(initialValue: string) {\n    // Previous state available on class field\n    if (this.value === undefined) {\n      this.value = initialValue;\n    }\n    return html`${unsafeHTML(md.render(this.value))}`;\n  }\n}\n\nexport const renderMarkdown = directive(RenderMarkdown);\n\nexport const renderCompletionOption = (\n  option: CompletionOption,\n  selected: boolean\n): TemplateResult => {\n  if (option.signature) {\n    const argStart = option.signature.indexOf('(');\n    const name = option.signature.substr(0, argStart);\n    const args = option.signature.substr(argStart);\n\n    return html`\n      <div style=\"${selected ? 'font-weight: 400' : ''}\">\n        <div style=\"display:inline-block;margin-right: 5px\">ƒ</div>\n        <div style=\"display:inline-block\">${name}</div>\n        ${selected\n          ? html`\n              <div\n                style=\"display:inline-block; font-weight: 300; font-size: 85%\"\n              >\n                ${args}\n              </div>\n              <div class=\"detail\">${renderMarkdown(option.summary)}</div>\n            `\n          : null}\n      </div>\n    `;\n  }\n\n  return html`\n    <div>\n      <div style=\"${selected ? 'font-weight: 400' : ''}\">${option.name}</div>\n      ${selected\n        ? html` <div style=\"font-size: 85%\">${option.summary}</div> `\n        : null}\n    </div>\n  `;\n};\n\nexport const getFunctions = (\n  functions: CompletionOption[],\n  query: string\n): CompletionOption[] => {\n  if (!query) {\n    return functions;\n  }\n  return functions.filter((option: CompletionOption) => {\n    if (option.signature) {\n      return option.signature.indexOf((query || '').toLowerCase()) === 0;\n    }\n    return false;\n  });\n};\n\n/**\n * Takes a dot query and returns the completions options at the current level\n * @param dotQuery query such as \"contact.first_n\"\n */\nexport const getCompletions = (\n  schema: CompletionSchema,\n  dotQuery: string,\n  keyedAssets: KeyedAssets = {},\n  session: boolean\n): CompletionOption[] => {\n  const parts = (dotQuery || '').split('.');\n  let currentProps: CompletionProperty[] = session\n    ? schema.root\n    : schema.root_no_session;\n\n  if (!currentProps) {\n    return [];\n  }\n\n  let prefix = '';\n  let part = '';\n  while (parts.length > 0) {\n    part = parts.shift();\n    if (part) {\n      // eslint-disable-next-line\n      const nextProp = currentProps.find(\n        (prop: CompletionProperty) => prop.key === part\n      );\n      if (nextProp) {\n        // eslint-disable-next-line\n        const nextType = schema.types.find(\n          (type: CompletionType) => type.name === nextProp.type\n        );\n        if (nextType && nextType.properties) {\n          currentProps = nextType.properties;\n          prefix += part + '.';\n        } else if (nextType && nextType.property_template) {\n          prefix += part + '.';\n          const template = nextType.property_template;\n          if (keyedAssets[nextType.name]) {\n            currentProps = keyedAssets[nextType.name].map((key: string) => ({\n              key: template.key.replace('{key}', key),\n              help: template.help.replace('{key}', key),\n              type: template.type,\n            }));\n          } else {\n            currentProps = [];\n          }\n        } else {\n          // eslint-disable-next-line\n          currentProps = currentProps.filter((prop: CompletionProperty) =>\n            prop.key.startsWith(part.toLowerCase())\n          );\n          break;\n        }\n      } else {\n        // eslint-disable-next-line\n        currentProps = currentProps.filter((prop: CompletionProperty) =>\n          prop.key.startsWith(part.toLowerCase())\n        );\n        break;\n      }\n    }\n  }\n\n  return currentProps.map((prop: CompletionProperty) => {\n    const name =\n      prop.key === '__default__'\n        ? prefix.substr(0, prefix.length - 1)\n        : prefix + prop.key;\n    return { name, summary: prop.help };\n  });\n};\n\nexport const getOffset = (el: HTMLElement) => {\n  const rect = el.getBoundingClientRect(),\n    scrollLeft = window.pageXOffset || document.documentElement.scrollLeft,\n    scrollTop = window.pageYOffset || document.documentElement.scrollTop;\n  return { top: rect.top + scrollTop, left: rect.left + scrollLeft };\n};\n\nexport const getVerticalScroll = (ele: Node) => {\n  let current = ele;\n  const verticalScroll = 0;\n  while (current) {\n    current = current.parentNode;\n  }\n  return verticalScroll;\n};\n\nexport const getCompletionName = (option: CompletionOption): string => {\n  return (\n    option.name || option.signature.substr(0, option.signature.indexOf('('))\n  );\n};\n\nexport const getCompletionSignature = (option: CompletionOption): string => {\n  return option.signature.substr(option.signature.indexOf('('));\n};\n\n/**\n * Determines the pixel position of position inside a textarea or input\n * TODO: Explore somethign like contenteditable to avoid this madness\n * see: https://jh3y.medium.com/how-to-where-s-the-caret-getting-the-xy-position-of-the-caret-a24ba372990a\n */\nconst getCursorXY = (input, selectionPoint) => {\n  const { offsetLeft: inputX, offsetTop: inputY } = input;\n  const div = document.createElement('div');\n  const copyStyle = getComputedStyle(input);\n  for (const prop of copyStyle) {\n    div.style[prop] = copyStyle[prop];\n  }\n  div.style.position = 'relative';\n  const swap = '.';\n  const inputValue =\n    input.tagName === 'INPUT' ? input.value.replace(/ /g, swap) : input.value;\n  const textContent = inputValue.substr(0, selectionPoint);\n  div.textContent = textContent;\n  if (input.tagName === 'TEXTAREA') div.style.height = 'auto';\n  if (input.tagName === 'INPUT') div.style.width = 'auto';\n  const span = document.createElement('span');\n  span.textContent = inputValue.substr(selectionPoint) || '.';\n  div.appendChild(span);\n  document.body.appendChild(div);\n  const { offsetLeft: spanX, offsetTop: spanY } = span;\n  document.body.removeChild(div);\n  return {\n    left: inputX + spanX,\n    top: inputY + spanY,\n  };\n};\n\nexport const updateInputElementWithCompletion = (\n  currentQuery: string,\n  ele: HTMLInputElement,\n  option: CompletionOption\n) => {\n  let insertText = '';\n\n  if (option.signature) {\n    // they selected a function\n    insertText = option.signature.substr(0, option.signature.indexOf('(') + 1);\n  } else {\n    insertText = option.name;\n  }\n\n  const queryLength = currentQuery.length;\n\n  if (ele) {\n    const value = ele.value;\n    const insertionPoint = ele.selectionStart - queryLength;\n\n    // strip out our query\n    // const insertionPoint = value.lastIndexOf(value.substring(0, this.inputElement.selectionStart));\n    const leftSide = value.substr(0, insertionPoint);\n    const remaining = value.substr(insertionPoint + queryLength);\n    const caret = leftSide.length + insertText.length;\n\n    // set our value and our new caret\n    ele.value = leftSide + insertText + remaining;\n    ele.setSelectionRange(caret, caret);\n\n    // now scroll our text box if necessary\n    const position = getCursorXY(ele, caret);\n    if (position.left > ele.width) {\n      ele.scrollLeft = position.left;\n    }\n\n    ele.dispatchEvent(new Event('input'));\n  }\n};\n\nexport const executeCompletionQuery = (\n  ele: HTMLInputElement,\n  store: Store,\n  session: boolean\n): CompletionResult => {\n  const result: CompletionResult = {\n    currentFunction: null,\n    options: [],\n    anchorPosition: null,\n    query: null,\n  };\n\n  // we need a store to do anything useful\n  if (!store) {\n    return result;\n  }\n\n  const cursor = ele.selectionStart;\n  const input = ele.value.substring(0, cursor);\n\n  const parser = session ? sessionParser : messageParser;\n  const expressions = parser.findExpressions(input);\n  const currentExpression = expressions.find(\n    (expr: Expression) =>\n      expr.start <= cursor &&\n      (expr.end > cursor || (expr.end === cursor && !expr.closed))\n  );\n\n  if (currentExpression) {\n    const includeFunctions = currentExpression.text.indexOf('(') > -1;\n    if (includeFunctions) {\n      const functionQuery = parser.functionContext(currentExpression.text);\n      if (functionQuery) {\n        const fns = getFunctions(store.getFunctions(), functionQuery);\n        if (fns.length > 0) {\n          result.currentFunction = fns[0];\n        }\n      }\n    }\n\n    for (let i = currentExpression.text.length; i >= 0; i--) {\n      const curr = currentExpression.text[i];\n      if (\n        curr === '@' ||\n        curr === '(' ||\n        curr === ' ' ||\n        curr === ',' ||\n        curr === ')' ||\n        i === 0\n      ) {\n        // don't include non-expression chars\n        if (\n          curr === '(' ||\n          curr === ' ' ||\n          curr === ',' ||\n          curr === ')' ||\n          curr === '@'\n        ) {\n          i++;\n        }\n\n        const caret = getCursorXY(ele, currentExpression.start + i);\n\n        result.anchorPosition = {\n          left: caret.left - 2 - ele.scrollLeft,\n          top: caret.top - ele.scrollTop,\n        };\n\n        result.query = currentExpression.text.substr(\n          i,\n          currentExpression.text.length - i\n        );\n\n        result.options = [\n          ...getCompletions(\n            store.getCompletionSchema(),\n            result.query,\n            store.getKeyedAssets(),\n            session\n          ),\n          ...(includeFunctions\n            ? getFunctions(store.getFunctions(), result.query)\n            : []),\n        ];\n\n        return result;\n      }\n    }\n  } else {\n    result.options = [];\n    result.query = '';\n  }\n  return result;\n};\n"]}
+{"version":3,"file":"helpers.js","sourceRoot":"","sources":["../../../src/completion/helpers.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, TemplateResult } from 'lit';\nimport { unsafeHTML } from 'lit-html/directives/unsafe-html.js';\nimport {\n  directive,\n  Directive,\n  Part,\n  PartInfo,\n  PartType,\n} from 'lit/directive.js';\nimport ExcellentParser, { Expression } from './ExcellentParser';\nimport {\n  CompletionOption,\n  CompletionProperty,\n  CompletionResult,\n  CompletionSchema,\n  CompletionType,\n  KeyedAssets,\n} from '../interfaces';\nimport { Store } from '../store/Store';\nimport { Remarkable } from 'remarkable';\n\nconst md = new Remarkable();\n\nconst messageParser = new ExcellentParser('@', [\n  'contact',\n  'fields',\n  'globals',\n  'urns',\n]);\n\nconst sessionParser = new ExcellentParser('@', [\n  'contact',\n  'fields',\n  'globals',\n  'urns',\n  'results',\n  'input',\n  'run',\n  'child',\n  'parent',\n  'node',\n  'webhook',\n  'ticket',\n  'trigger',\n  'resume',\n]);\n\n// Class-based directive API\nexport class RenderMarkdown extends Directive {\n  // State stored in class field\n  value: string | undefined;\n  constructor(partInfo: PartInfo) {\n    super(partInfo);\n    // When necessary, validate part in constructor using `part.type`\n    if (partInfo.type !== PartType.CHILD) {\n      throw new Error('renderMarkdown only supports child expressions');\n    }\n  }\n  // Optional: override update to perform any direct DOM manipulation\n  // DirectiveParameters<this>\n  update(part: Part, [initialValue]: any) {\n    /* Any imperative updates to DOM/parts would go here */\n    return this.render(initialValue);\n  }\n  // Do SSR-compatible rendering (arguments are passed from call site)\n  render(initialValue: string) {\n    // Previous state available on class field\n    if (this.value === undefined) {\n      this.value = initialValue;\n    }\n    return html`${unsafeHTML(md.render(this.value))}`;\n  }\n}\n\nexport const renderMarkdown = directive(RenderMarkdown);\n\nexport const renderCompletionOption = (\n  option: CompletionOption,\n  selected: boolean\n): TemplateResult => {\n  if (option.signature) {\n    const argStart = option.signature.indexOf('(');\n    const name = option.signature.substr(0, argStart);\n    const args = option.signature.substr(argStart);\n\n    return html`\n      <div style=\"${selected ? 'font-weight: 400' : ''}\">\n        <div style=\"display:inline-block;margin-right: 5px\">ƒ</div>\n        <div style=\"display:inline-block\">${name}</div>\n        ${selected\n          ? html`\n              <div\n                style=\"display:inline-block; font-weight: 300; font-size: 85%\"\n              >\n                ${args}\n              </div>\n              <div class=\"detail\">${renderMarkdown(option.summary)}</div>\n            `\n          : null}\n      </div>\n    `;\n  }\n\n  return html`\n    <div>\n      <div style=\"${selected ? 'font-weight: 400' : ''}\">${option.name}</div>\n      ${selected\n        ? html` <div style=\"font-size: 85%\">${option.summary}</div> `\n        : null}\n    </div>\n  `;\n};\n\nexport const getFunctions = (\n  functions: CompletionOption[],\n  query: string\n): CompletionOption[] => {\n  if (!query) {\n    return functions;\n  }\n  return functions.filter((option: CompletionOption) => {\n    if (option.signature) {\n      return option.signature.indexOf((query || '').toLowerCase()) === 0;\n    }\n    return false;\n  });\n};\n\n/**\n * Takes a dot query and returns the completions options at the current level\n * @param dotQuery query such as \"contact.first_n\"\n */\nexport const getCompletions = (\n  schema: CompletionSchema,\n  dotQuery: string,\n  keyedAssets: KeyedAssets = {},\n  session: boolean\n): CompletionOption[] => {\n  const parts = (dotQuery || '').split('.');\n  let currentProps: CompletionProperty[] = session\n    ? schema.root\n    : schema.root_no_session;\n\n  if (!currentProps) {\n    return [];\n  }\n\n  let prefix = '';\n  let part = '';\n  while (parts.length > 0) {\n    part = parts.shift();\n    if (part) {\n      // eslint-disable-next-line\n      const nextProp = currentProps.find(\n        (prop: CompletionProperty) => prop.key === part\n      );\n      if (nextProp) {\n        // eslint-disable-next-line\n        const nextType = schema.types.find(\n          (type: CompletionType) => type.name === nextProp.type\n        );\n        if (nextType && nextType.properties) {\n          currentProps = nextType.properties;\n          prefix += part + '.';\n        } else if (nextType && nextType.property_template) {\n          prefix += part + '.';\n          const template = nextType.property_template;\n          if (keyedAssets[nextType.name]) {\n            currentProps = keyedAssets[nextType.name].map((key: string) => ({\n              key: template.key.replace('{key}', key),\n              help: template.help.replace('{key}', key),\n              type: template.type,\n            }));\n          } else {\n            currentProps = [];\n          }\n        } else {\n          // eslint-disable-next-line\n          currentProps = currentProps.filter((prop: CompletionProperty) =>\n            prop.key.startsWith(part.toLowerCase())\n          );\n          break;\n        }\n      } else {\n        // eslint-disable-next-line\n        currentProps = currentProps.filter((prop: CompletionProperty) =>\n          prop.key.startsWith(part.toLowerCase())\n        );\n        break;\n      }\n    }\n  }\n\n  return currentProps.map((prop: CompletionProperty) => {\n    const name =\n      prop.key === '__default__'\n        ? prefix.substr(0, prefix.length - 1)\n        : prefix + prop.key;\n    return { name, summary: prop.help };\n  });\n};\n\nexport const getOffset = (el: HTMLElement) => {\n  const rect = el.getBoundingClientRect(),\n    scrollLeft = window.pageXOffset || document.documentElement.scrollLeft,\n    scrollTop = window.pageYOffset || document.documentElement.scrollTop;\n  return { top: rect.top + scrollTop, left: rect.left + scrollLeft };\n};\n\nexport const getVerticalScroll = (ele: Node) => {\n  let current = ele;\n  const verticalScroll = 0;\n  while (current) {\n    current = current.parentNode;\n  }\n  return verticalScroll;\n};\n\nexport const getCompletionName = (option: CompletionOption): string => {\n  return (\n    option.name || option.signature.substr(0, option.signature.indexOf('('))\n  );\n};\n\nexport const getCompletionSignature = (option: CompletionOption): string => {\n  return option.signature.substr(option.signature.indexOf('('));\n};\n\n/**\n * Determines the pixel position of position inside a textarea or input\n * TODO: Explore somethign like contenteditable to avoid this madness\n * see: https://jh3y.medium.com/how-to-where-s-the-caret-getting-the-xy-position-of-the-caret-a24ba372990a\n */\nconst getCursorXY = (input, selectionPoint) => {\n  const { offsetLeft: inputX, offsetTop: inputY } = input;\n  const div = document.createElement('div');\n  const copyStyle = getComputedStyle(input);\n  for (const prop of copyStyle) {\n    div.style[prop] = copyStyle[prop];\n  }\n  div.style.position = 'relative';\n  const swap = '.';\n  const inputValue =\n    input.tagName === 'INPUT' ? input.value.replace(/ /g, swap) : input.value;\n  const textContent = inputValue.substr(0, selectionPoint);\n  div.textContent = textContent;\n  if (input.tagName === 'TEXTAREA') div.style.height = 'auto';\n  if (input.tagName === 'INPUT') div.style.width = 'auto';\n  const span = document.createElement('span');\n  span.textContent = inputValue.substr(selectionPoint) || '.';\n  div.appendChild(span);\n  document.body.appendChild(div);\n  const { offsetLeft: spanX, offsetTop: spanY } = span;\n  document.body.removeChild(div);\n  return {\n    left: inputX + spanX,\n    top: inputY + spanY,\n  };\n};\n\nexport const updateInputElementWithCompletion = (\n  currentQuery: string,\n  ele: HTMLInputElement,\n  option: CompletionOption\n) => {\n  let insertText = '';\n\n  if (option.signature) {\n    // they selected a function\n    insertText = option.signature.substr(0, option.signature.indexOf('(') + 1);\n  } else {\n    insertText = option.name;\n  }\n\n  const queryLength = currentQuery.length;\n\n  if (ele) {\n    const value = ele.value;\n    const insertionPoint = ele.selectionStart - queryLength;\n\n    // strip out our query\n    // const insertionPoint = value.lastIndexOf(value.substring(0, this.inputElement.selectionStart));\n    const leftSide = value.substr(0, insertionPoint);\n    const remaining = value.substr(insertionPoint + queryLength);\n    const caret = leftSide.length + insertText.length;\n\n    // set our value and our new caret\n    ele.value = leftSide + insertText + remaining;\n    ele.setSelectionRange(caret, caret);\n\n    // now scroll our text box if necessary\n    const position = getCursorXY(ele, caret);\n    if (position.left > ele.width) {\n      ele.scrollLeft = position.left;\n    }\n\n    ele.dispatchEvent(new Event('input'));\n  }\n};\n\nexport const executeCompletionQuery = (\n  ele: HTMLInputElement,\n  store: Store,\n  session: boolean\n): CompletionResult => {\n  const result: CompletionResult = {\n    currentFunction: null,\n    options: [],\n    anchorPosition: null,\n    query: null,\n  };\n\n  if (!ele) {\n    return;\n  }\n\n  // we need a store to do anything useful\n  if (!store) {\n    return result;\n  }\n\n  const cursor = ele.selectionStart;\n  const input = ele.value.substring(0, cursor);\n\n  const parser = session ? sessionParser : messageParser;\n  const expressions = parser.findExpressions(input);\n  const currentExpression = expressions.find(\n    (expr: Expression) =>\n      expr.start <= cursor &&\n      (expr.end > cursor || (expr.end === cursor && !expr.closed))\n  );\n\n  if (currentExpression) {\n    const includeFunctions = currentExpression.text.indexOf('(') > -1;\n    if (includeFunctions) {\n      const functionQuery = parser.functionContext(currentExpression.text);\n      if (functionQuery) {\n        const fns = getFunctions(store.getFunctions(), functionQuery);\n        if (fns.length > 0) {\n          result.currentFunction = fns[0];\n        }\n      }\n    }\n\n    for (let i = currentExpression.text.length; i >= 0; i--) {\n      const curr = currentExpression.text[i];\n      if (\n        curr === '@' ||\n        curr === '(' ||\n        curr === ' ' ||\n        curr === ',' ||\n        curr === ')' ||\n        i === 0\n      ) {\n        // don't include non-expression chars\n        if (\n          curr === '(' ||\n          curr === ' ' ||\n          curr === ',' ||\n          curr === ')' ||\n          curr === '@'\n        ) {\n          i++;\n        }\n\n        const caret = getCursorXY(ele, currentExpression.start + i);\n\n        result.anchorPosition = {\n          left: caret.left - 2 - ele.scrollLeft,\n          top: caret.top - ele.scrollTop,\n        };\n\n        result.query = currentExpression.text.substr(\n          i,\n          currentExpression.text.length - i\n        );\n\n        result.options = [\n          ...getCompletions(\n            store.getCompletionSchema(),\n            result.query,\n            store.getKeyedAssets(),\n            session\n          ),\n          ...(includeFunctions\n            ? getFunctions(store.getFunctions(), result.query)\n            : []),\n        ];\n\n        return result;\n      }\n    }\n  } else {\n    result.options = [];\n    result.query = '';\n  }\n  return result;\n};\n"]}

package/out-tsc/src/contacts/ContactChat.js

@@ -1,10 +1,8 @@
 import { __decorate } from "tslib";
 import { css, html } from 'lit';
 import { property } from 'lit/decorators.js';
-import { CustomEventType } from '../interfaces';
-import { COOKIE_KEYS, getCookieBoolean, postJSON, setCookie } from '../utils';
+import { COOKIE_KEYS, getCookieBoolean, postJSON } from '../utils';
 import { ContactStoreElement } from './ContactStoreElement';
-import { Icon } from '../vectoricon';
 const DEFAULT_REFRESH = 10000;
 export class ContactChat extends ContactStoreElement {
     static get styles() {
@@ -32,6 +30,7 @@ export class ContactChat extends ContactStoreElement {
         flex-direction: column;
         overflow: hidden;
         min-height: 0;
+        border-radius: var(--curvature);
       }
 
       temba-contact-history {
@@ -79,73 +78,6 @@ export class ContactChat extends ContactStoreElement {
         --button-x: 12px;
       }
 
-      .toolbar {
-        position: relative;
-        width: 2.5em;
-        background: #e6e6e6;
-        transition: all 600ms ease-in;
-        z-index: 10;
-        flex-shrink: 0;
-        border-top-right-radius: var(--curvature);
-        border-bottom-right-radius: var(--curvature);
-        padding: 0.5em 0;
-        display: flex;
-        flex-direction: column;
-        align-items: center;
-        overflow: hidden;
-      }
-
-      .toolbar temba-icon {
-        fill: rgb(60, 60, 60);
-        margin-bottom: 0.5em;
-      }
-
-      .toolbar.closed {
-        box-shadow: inset 10px 0px 10px -11px rgb(0 0 0 / 15%);
-      }
-
-      temba-contact-details {
-        flex-basis: 16em;
-        flex-grow: 0;
-        flex-shrink: 0;
-        transition: margin 600ms cubic-bezier(0.68, -0.55, 0.265, 1.05),
-          opacity 600ms ease-in-out 200ms;
-        z-index: 5;
-      }
-
-      temba-contact-details.hidden {
-        margin-right: -16em;
-        opacity: 0;
-      }
-
-      @media only screen and (max-width: 768px) {
-        temba-contact-details {
-          flex-basis: 12em;
-          flex-shrink: 0;
-        }
-
-        temba-contact-details.hidden {
-          margin-right: -12em;
-        }
-      }
-
-      #close-button,
-      #open-button {
-        margin-top: 1em;
-      }
-
-      #details-button {
-        margin-top: 0.25em;
-        transform: rotate(180deg);
-      }
-
-      #note-dialog,
-      #assign-dialog {
-        --header-bg: rgb(255, 249, 194);
-        --header-text: #555;
-        --textarea-height: 5em;
-      }
-
       temba-completion {
         --widget-box-shadow: none;
         --color-widget-border: transparent;
@@ -160,7 +92,6 @@ export class ContactChat extends ContactStoreElement {
         this.contactsEndpoint = '/api/v2/contacts.json';
         this.currentNote = '';
         this.showDetails = true;
-        this.toolbar = false;
         this.monitor = false;
         this.currentTicket = null;
         this.currentContact = null;
@@ -194,6 +125,7 @@ export class ContactChat extends ContactStoreElement {
                 contactHistory.scrollToBottom();
             }
             contactHistory.refresh();
+            // super.refresh();
         }
     }
     updated(changedProperties) {
@@ -204,22 +136,6 @@ export class ContactChat extends ContactStoreElement {
             this.currentContact = this.data;
         }
     }
-    handleTicketReopen() {
-        const uuid = this.currentTicket.uuid;
-        postJSON(`/api/v2/ticket_actions.json`, {
-            tickets: [uuid],
-            action: 'reopen',
-        })
-            .then(() => {
-            this.refresh();
-            this.fireCustomEvent(CustomEventType.ContentChanged, {
-                ticket: { uuid, status: 'open' },
-            });
-        })
-            .catch((response) => {
-            console.error(response);
-        });
-    }
     handleSend(evt) {
         const buttonName = evt.detail.name;
         if (buttonName === 'Send') {
@@ -275,14 +191,6 @@ export class ContactChat extends ContactStoreElement {
             });
         }
     }
-    handleTicketAssigned() {
-        this.refresh();
-        this.getContactHistory().checkForAgentAssignmentEvent(this.agent);
-    }
-    handleDetailSlider() {
-        this.showDetails = !this.showDetails;
-        setCookie(COOKIE_KEYS.TICKET_SHOW_DETAILS, this.showDetails);
-    }
     render() {
         const contactHistory = this.currentContact
             ? this.getTembaContactHistory()
@@ -294,26 +202,6 @@ export class ContactChat extends ContactStoreElement {
     >
       <div class="chat-wrapper">${contactHistory} ${chatbox}</div>
     </div>`;
-        if (this.toolbar) {
-            const contactDetails = this.currentContact
-                ? this.getTembaContactDetails()
-                : null;
-            const toggleContactDetails = this.currentContact
-                ? this.getToggleDetailsTembaTip()
-                : null;
-            const addNoteAndAssignTicketTembaTips = this.currentContact && this.currentTicket
-                ? this.getAddNoteAndAssignTicketTembaTips()
-                : null;
-            const addNoteAndAssignTicketTembaModaxes = this.currentTicket
-                ? this.getAddNoteAndAssignTicketTembaModaxes()
-                : null;
-            const contactDetailsAndActions = html `${contactDetails}
-        <div class="toolbar ${this.showDetails ? '' : 'closed'}">
-          ${toggleContactDetails} ${addNoteAndAssignTicketTembaTips}
-        </div>
-        ${addNoteAndAssignTicketTembaModaxes}`;
-            return html `${contactHistoryAndChatbox} ${contactDetailsAndActions}`;
-        }
         return html `${contactHistoryAndChatbox}`;
     }
     getTembaContactHistory() {
@@ -333,20 +221,13 @@ export class ContactChat extends ContactStoreElement {
                 return null;
             }
             else {
-                if (this.currentTicket.closed_on) {
-                    //reopen button for active contacts with a closed ticket
-                    return html ` <div class="closed-footer">
-            <temba-button
-              id="reopen-button"
-              name="Reopen"
-              @click=${this.handleTicketReopen}
-            ></temba-button>
-          </div>`;
-                }
-                else {
+                if (!this.currentTicket.closed_on) {
                     //chatbox for active contacts with an open ticket
                     return this.getChatbox();
                 }
+                else {
+                    return null;
+                }
             }
         }
         if (this.currentContact && this.currentContact.status !== 'active') {
@@ -359,7 +240,7 @@ export class ContactChat extends ContactStoreElement {
         }
     }
     getChatbox() {
-        return html ` <div class="chatbox ${this.toolbar ? 'full' : ''}">
+        return html `<div class="chatbox">
       <temba-compose
         chatbox
         attachments
@@ -370,77 +251,6 @@ export class ContactChat extends ContactStoreElement {
       </temba-compose>
     </div>`;
     }
-    getTembaContactDetails() {
-        return html ` <temba-contact-details
-      style="z-index: 10"
-      class="${this.showDetails ? '' : 'hidden'}"
-      showGroups="true"
-      .visible=${this.showDetails}
-      .ticket=${this.currentTicket}
-      .contact=${this.currentContact}
-    >
-    </temba-contact-details>`;
-    }
-    getToggleDetailsTembaTip() {
-        return html ` <temba-tip
-      style="margin-top:5px"
-      text="${this.showDetails ? 'Hide Details' : 'Show Details'}"
-      position="left"
-      hideOnChange
-    >
-      <temba-icon
-        id="details-button"
-        name="${this.showDetails ? Icon.menu_collapse : 'layout-left'}"
-        @click="${this.handleDetailSlider}"
-        clickable
-        animatechange="spin"
-      ></temba-icon>
-    </temba-tip>`;
-    }
-    getAddNoteAndAssignTicketTembaTips() {
-        return html ` <temba-tip
-        style="margin-top:5px"
-        text="Assign"
-        position="left"
-      >
-        <temba-icon
-          id="assign-button"
-          name="${Icon.users}"
-          @click="${() => {
-            const modax = this.shadowRoot.getElementById('assign-dialog');
-            modax.open = true;
-        }}"
-          clickable
-        ></temba-icon>
-      </temba-tip>
-      <temba-tip style="margin-top:5px" text="Add Note" position="left">
-        <temba-icon
-          id="add-note-button"
-          name="${Icon.add_note}"
-          @click="${() => {
-            const note = this.shadowRoot.getElementById('note-dialog');
-            note.open = true;
-        }}"
-          clickable
-        ></temba-icon>
-      </temba-tip>`;
-    }
-    getAddNoteAndAssignTicketTembaModaxes() {
-        return html ` <temba-modax
-        header="Add Note"
-        id="note-dialog"
-        @temba-submitted=${this.refresh}
-        endpoint="/ticket/note/${this.currentTicket.uuid}/"
-      >
-      </temba-modax>
-      <temba-modax
-        header="Assign Ticket"
-        id="assign-dialog"
-        @temba-submitted=${this.handleTicketAssigned}
-        endpoint="/ticket/assign/${this.currentTicket.uuid}/"
-      >
-      </temba-modax>`;
-    }
 }
 __decorate([
     property({ type: String, attribute: 'ticket' })
@@ -454,9 +264,6 @@ __decorate([
 __decorate([
     property({ type: Boolean })
 ], ContactChat.prototype, "showDetails", void 0);
-__decorate([
-    property({ type: Boolean })
-], ContactChat.prototype, "toolbar", void 0);
 __decorate([
     property({ type: Boolean })
 ], ContactChat.prototype, "monitor", void 0);