@nyaruka/temba-components 0.93.3 → 0.94.0

package/CHANGELOG.md

@@ -4,8 +4,16 @@ All notable changes to this project will be documented in this file. Dates are d
 
 Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 
+#### [v0.94.0](https://github.com/nyaruka/temba-components/compare/v0.93.3...v0.94.0)
+
+- Improvements to contact search [`#437`](https://github.com/nyaruka/temba-components/pull/437)
+- Show contact search exclusions as filters [`98cf90e`](https://github.com/nyaruka/temba-components/commit/98cf90e74a5ca4017998c52284251ddf07268b4a)
+- Allow filter by various activity levels [`8928b7b`](https://github.com/nyaruka/temba-components/commit/8928b7bf3bd018fa53ec1a9c3e4f8b551d4289d6)
+
 #### [v0.93.3](https://github.com/nyaruka/temba-components/compare/v0.93.2...v0.93.3)
 
+> 21 June 2024
+
 - More z-index tweaks [`a416b7d`](https://github.com/nyaruka/temba-components/commit/a416b7d8ea7499a508e7ce60886c54d39335c2b5)
 
 #### [v0.93.2](https://github.com/nyaruka/temba-components/compare/v0.93.1...v0.93.2)

package/dist/locales/es.js

@@ -4,11 +4,8 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
 export const templates = {
     scf1453991c986b25: `Tab para completar, enter para seleccionar`,
-    sf8653793d61d060c: `Skip inactive contacts`,
-    sd4af861b95e8ba4a: `Only include contacts who have sent a message in the last 90 days.`,
-    sd149dff460c8dc41: `Skip contacts currently in a flow`,
-    sc85010c81b71421e: `Avoid interrupting a contact who is already in a flow.`,
-    s3e3fa53e834f4fda: `Skip repeat contacts`,
-    s95e715d82602bced: `Avoid restarting a contact who has been in this flow in the last 90 days.`
+    s638236250662c6b3: `Have sent a message in the last`,
+    s8f02e3a18ffc083a: `Are not currently in a flow`,
+    s4788ee206c4570c7: `Have not started this flow in the last 90 days`
 };
 //# sourceMappingURL=es.js.map

package/dist/locales/es.js.map

@@ -1 +1 @@
-{"version":3,"file":"es.js","sourceRoot":"","sources":["../../../src/locales/es.ts"],"names":[],"mappings":"AAAA,mCAAmC;AACnC,gDAAgD;AAEhD,4CAA4C;AAC5C,uDAAuD;AAEvD,MAAM,CAAC,MAAM,SAAS,GAAG;IACvB,iBAAiB,EAAE,4CAA4C;IAC/D,iBAAiB,EAAE,wBAAwB;IAC3C,iBAAiB,EAAE,oEAAoE;IACvF,iBAAiB,EAAE,mCAAmC;IACtD,iBAAiB,EAAE,wDAAwD;IAC3E,iBAAiB,EAAE,sBAAsB;IACzC,iBAAiB,EAAE,2EAA2E;CAC/F,CAAC","sourcesContent":["// Do not modify this file by hand!\n// Re-generate this file by running lit-localize\n\n/* eslint-disable no-irregular-whitespace */\n/* eslint-disable @typescript-eslint/no-explicit-any */\n\nexport const templates = {\n  scf1453991c986b25: `Tab para completar, enter para seleccionar`,\n  sf8653793d61d060c: `Skip inactive contacts`,\n  sd4af861b95e8ba4a: `Only include contacts who have sent a message in the last 90 days.`,\n  sd149dff460c8dc41: `Skip contacts currently in a flow`,\n  sc85010c81b71421e: `Avoid interrupting a contact who is already in a flow.`,\n  s3e3fa53e834f4fda: `Skip repeat contacts`,\n  s95e715d82602bced: `Avoid restarting a contact who has been in this flow in the last 90 days.`\n};\n"]}
+{"version":3,"file":"es.js","sourceRoot":"","sources":["../../../src/locales/es.ts"],"names":[],"mappings":"AAAA,mCAAmC;AACnC,gDAAgD;AAEhD,4CAA4C;AAC5C,uDAAuD;AAEvD,MAAM,CAAC,MAAM,SAAS,GAAG;IACvB,iBAAiB,EAAE,4CAA4C;IAC/D,iBAAiB,EAAE,iCAAiC;IACpD,iBAAiB,EAAE,6BAA6B;IAChD,iBAAiB,EAAE,gDAAgD;CACpE,CAAC","sourcesContent":["// Do not modify this file by hand!\n// Re-generate this file by running lit-localize\n\n/* eslint-disable no-irregular-whitespace */\n/* eslint-disable @typescript-eslint/no-explicit-any */\n\nexport const templates = {\n  scf1453991c986b25: `Tab para completar, enter para seleccionar`,\n  s638236250662c6b3: `Have sent a message in the last`,\n  s8f02e3a18ffc083a: `Are not currently in a flow`,\n  s4788ee206c4570c7: `Have not started this flow in the last 90 days`\n};\n"]}

package/dist/locales/fr.js

@@ -4,11 +4,8 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
 export const templates = {
     scf1453991c986b25: `Tab to complete, enter to select`,
-    sf8653793d61d060c: `Skip inactive contacts`,
-    sd4af861b95e8ba4a: `Only include contacts who have sent a message in the last 90 days.`,
-    sd149dff460c8dc41: `Skip contacts currently in a flow`,
-    sc85010c81b71421e: `Avoid interrupting a contact who is already in a flow.`,
-    s3e3fa53e834f4fda: `Skip repeat contacts`,
-    s95e715d82602bced: `Avoid restarting a contact who has been in this flow in the last 90 days.`
+    s638236250662c6b3: `Have sent a message in the last`,
+    s8f02e3a18ffc083a: `Are not currently in a flow`,
+    s4788ee206c4570c7: `Have not started this flow in the last 90 days`
 };
 //# sourceMappingURL=fr.js.map

package/dist/locales/fr.js.map

@@ -1 +1 @@
-{"version":3,"file":"fr.js","sourceRoot":"","sources":["../../../src/locales/fr.ts"],"names":[],"mappings":"AAAA,mCAAmC;AACnC,gDAAgD;AAEhD,4CAA4C;AAC5C,uDAAuD;AAEvD,MAAM,CAAC,MAAM,SAAS,GAAG;IACvB,iBAAiB,EAAE,kCAAkC;IACrD,iBAAiB,EAAE,wBAAwB;IAC3C,iBAAiB,EAAE,oEAAoE;IACvF,iBAAiB,EAAE,mCAAmC;IACtD,iBAAiB,EAAE,wDAAwD;IAC3E,iBAAiB,EAAE,sBAAsB;IACzC,iBAAiB,EAAE,2EAA2E;CAC/F,CAAC","sourcesContent":["// Do not modify this file by hand!\n// Re-generate this file by running lit-localize\n\n/* eslint-disable no-irregular-whitespace */\n/* eslint-disable @typescript-eslint/no-explicit-any */\n\nexport const templates = {\n  scf1453991c986b25: `Tab to complete, enter to select`,\n  sf8653793d61d060c: `Skip inactive contacts`,\n  sd4af861b95e8ba4a: `Only include contacts who have sent a message in the last 90 days.`,\n  sd149dff460c8dc41: `Skip contacts currently in a flow`,\n  sc85010c81b71421e: `Avoid interrupting a contact who is already in a flow.`,\n  s3e3fa53e834f4fda: `Skip repeat contacts`,\n  s95e715d82602bced: `Avoid restarting a contact who has been in this flow in the last 90 days.`\n};\n"]}
+{"version":3,"file":"fr.js","sourceRoot":"","sources":["../../../src/locales/fr.ts"],"names":[],"mappings":"AAAA,mCAAmC;AACnC,gDAAgD;AAEhD,4CAA4C;AAC5C,uDAAuD;AAEvD,MAAM,CAAC,MAAM,SAAS,GAAG;IACvB,iBAAiB,EAAE,kCAAkC;IACrD,iBAAiB,EAAE,iCAAiC;IACpD,iBAAiB,EAAE,6BAA6B;IAChD,iBAAiB,EAAE,gDAAgD;CACpE,CAAC","sourcesContent":["// Do not modify this file by hand!\n// Re-generate this file by running lit-localize\n\n/* eslint-disable no-irregular-whitespace */\n/* eslint-disable @typescript-eslint/no-explicit-any */\n\nexport const templates = {\n  scf1453991c986b25: `Tab to complete, enter to select`,\n  s638236250662c6b3: `Have sent a message in the last`,\n  s8f02e3a18ffc083a: `Are not currently in a flow`,\n  s4788ee206c4570c7: `Have not started this flow in the last 90 days`\n};\n"]}

package/dist/locales/pt.js

@@ -4,11 +4,8 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
 export const templates = {
     scf1453991c986b25: `Tab to complete, enter to select`,
-    sf8653793d61d060c: `Skip inactive contacts`,
-    sd4af861b95e8ba4a: `Only include contacts who have sent a message in the last 90 days.`,
-    sd149dff460c8dc41: `Skip contacts currently in a flow`,
-    sc85010c81b71421e: `Avoid interrupting a contact who is already in a flow.`,
-    s3e3fa53e834f4fda: `Skip repeat contacts`,
-    s95e715d82602bced: `Avoid restarting a contact who has been in this flow in the last 90 days.`
+    s638236250662c6b3: `Have sent a message in the last`,
+    s8f02e3a18ffc083a: `Are not currently in a flow`,
+    s4788ee206c4570c7: `Have not started this flow in the last 90 days`
 };
 //# sourceMappingURL=pt.js.map

package/dist/locales/pt.js.map

@@ -1 +1 @@
-{"version":3,"file":"pt.js","sourceRoot":"","sources":["../../../src/locales/pt.ts"],"names":[],"mappings":"AAAA,mCAAmC;AACnC,gDAAgD;AAEhD,4CAA4C;AAC5C,uDAAuD;AAEvD,MAAM,CAAC,MAAM,SAAS,GAAG;IACvB,iBAAiB,EAAE,kCAAkC;IACrD,iBAAiB,EAAE,wBAAwB;IAC3C,iBAAiB,EAAE,oEAAoE;IACvF,iBAAiB,EAAE,mCAAmC;IACtD,iBAAiB,EAAE,wDAAwD;IAC3E,iBAAiB,EAAE,sBAAsB;IACzC,iBAAiB,EAAE,2EAA2E;CAC/F,CAAC","sourcesContent":["// Do not modify this file by hand!\n// Re-generate this file by running lit-localize\n\n/* eslint-disable no-irregular-whitespace */\n/* eslint-disable @typescript-eslint/no-explicit-any */\n\nexport const templates = {\n  scf1453991c986b25: `Tab to complete, enter to select`,\n  sf8653793d61d060c: `Skip inactive contacts`,\n  sd4af861b95e8ba4a: `Only include contacts who have sent a message in the last 90 days.`,\n  sd149dff460c8dc41: `Skip contacts currently in a flow`,\n  sc85010c81b71421e: `Avoid interrupting a contact who is already in a flow.`,\n  s3e3fa53e834f4fda: `Skip repeat contacts`,\n  s95e715d82602bced: `Avoid restarting a contact who has been in this flow in the last 90 days.`\n};\n"]}
+{"version":3,"file":"pt.js","sourceRoot":"","sources":["../../../src/locales/pt.ts"],"names":[],"mappings":"AAAA,mCAAmC;AACnC,gDAAgD;AAEhD,4CAA4C;AAC5C,uDAAuD;AAEvD,MAAM,CAAC,MAAM,SAAS,GAAG;IACvB,iBAAiB,EAAE,kCAAkC;IACrD,iBAAiB,EAAE,iCAAiC;IACpD,iBAAiB,EAAE,6BAA6B;IAChD,iBAAiB,EAAE,gDAAgD;CACpE,CAAC","sourcesContent":["// Do not modify this file by hand!\n// Re-generate this file by running lit-localize\n\n/* eslint-disable no-irregular-whitespace */\n/* eslint-disable @typescript-eslint/no-explicit-any */\n\nexport const templates = {\n  scf1453991c986b25: `Tab to complete, enter to select`,\n  s638236250662c6b3: `Have sent a message in the last`,\n  s8f02e3a18ffc083a: `Are not currently in a flow`,\n  s4788ee206c4570c7: `Have not started this flow in the last 90 days`\n};\n"]}

package/dist/temba-components.js

@@ -2731,7 +2731,38 @@ let ir=Is,or=!1;const nr=["es","fr","pt"],{setLocale:sr}=(t=>(function(t){if(or)
       temba-alert {
         margin: 1em 0;
       }
-    `}refresh(){this.refreshKey="requested_"+(new Date).getTime()}updated(t){super.updated(t),t.has("advanced")&&this.advanced||(t.has("in_a_flow")&&!this.in_a_flow&&(delete this.exclusions.in_a_flow,this.requestUpdate("exclusions")),(t.has("query")&&this.advanced||t.has("refreshKey")&&"0"!==this.refreshKey)&&(this.summary=null,this.fireCustomEvent(Oe.ContentChanged,{reset:!0}),this.lastQuery&&(window.clearTimeout(this.lastQuery),this.fetching=!1),(this.query.trim().length>0||this.recipients.length>0)&&(this.fetching=!0,this.lastQuery=window.setTimeout((()=>{this.fetchSummary()}),2e3))))}fetchSummary(){if(this.endpoint){const t=this.recipients.filter((t=>"group"===t.type)).map((t=>t.id)),e=this.recipients.filter((t=>"contact"===t.type)).map((t=>t.id));Kt(this.endpoint,{include:this.advanced?{query:this.query}:{contact_uuids:e,group_uuids:t},exclude:this.exclusions}).then((t=>{this.fetching=!1,200===t.status?(this.summary=t.json,this.advanced||(this.query=this.summary.query),this.setValue({advanced:this.advanced,query:this.query,exclusions:this.exclusions,recipients:this.recipients}),this.summary.error?this.errors=[this.summary.error]:this.errors=[],this.requestUpdate("errors"),this.fireCustomEvent(Oe.ContentChanged,this.summary)):(this.summary=t.json,this.summary.error&&(this.errors=[this.summary.error]),this.requestUpdate("errors"),this.fireCustomEvent(Oe.ContentChanged,this.summary))}))}}handleAdvancedToggle(t){re(t),this.recipients=[],this.exclusions={},this.advanced&&(this.query="",this.value=null),this.advanced=!this.advanced,this.setValue({advanced:this.advanced,query:this.query,exclusions:this.exclusions,recipients:this.recipients})}handleQueryChange(t){const e=t.target;this.query=e.inputElement.value}handleRecipientsChanged(){"0"!==this.refreshKey||this.initialized?this.refresh():this.initialized=!0}handleExclusionChanged(t){if("TEMBA-CHECKBOX"===t.target.tagName){const e=JSON.stringify(this.exclusions),i=t.target;let o=i.checked;o?("not_seen_since_days"===i.name&&(o=90),this.exclusions[i.name]=o):delete this.exclusions[i.name],e!==JSON.stringify(this.exclusions)&&this.refresh()}}render(){let t;if(this.summary&&!this.summary.error){const e=this.summary.total||0;t=j`
+
+      temba-select[name='not_seen_since_days'] {
+        margin-bottom: 1em;
+        display: block;
+      }
+
+      .activity-select {
+        display: flex;
+        align-items: center;
+        padding: var(--checkbox-padding, 10px);
+        border-radius: var(--curvature);
+        cursor: pointer;
+      }
+
+      .activity-select:hover {
+        background: #f9f9f9;
+      }
+
+      .small-select {
+        --temba-select-selected-padding: 0px 0.5em;
+        --temba-select-selected-line-height: 1em;
+        --temba-select-selected-font-size: 1em;
+        --search-input-height: 0px !important;
+        min-width: 100px;
+      }
+
+      .filters {
+        padding: 1em;
+        border: 1px solid var(--color-borders);
+        border-radius: var(--curvature);
+      }
+    `}refresh(){this.refreshKey="requested_"+(new Date).getTime()}updated(t){super.updated(t),t.has("advanced")&&this.advanced||(t.has("in_a_flow")&&!this.in_a_flow&&(delete this.exclusions.in_a_flow,this.requestUpdate("exclusions")),(t.has("query")&&this.advanced||t.has("refreshKey")&&"0"!==this.refreshKey)&&(this.summary=null,this.fireCustomEvent(Oe.ContentChanged,{reset:!0}),this.lastQuery&&(window.clearTimeout(this.lastQuery),this.fetching=!1),(this.query.trim().length>0||this.recipients.length>0)&&(this.fetching=!0,this.lastQuery=window.setTimeout((()=>{this.fetchSummary()}),2e3))))}fetchSummary(){if(this.endpoint){const t=this.recipients.filter((t=>"group"===t.type)).map((t=>t.id)),e=this.recipients.filter((t=>"contact"===t.type)).map((t=>t.id));Kt(this.endpoint,{include:this.advanced?{query:this.query}:{contact_uuids:e,group_uuids:t},exclude:this.exclusions}).then((t=>{this.fetching=!1,200===t.status?(this.summary=t.json,this.advanced||(this.query=this.summary.query),this.setValue({advanced:this.advanced,query:this.query,exclusions:this.exclusions,recipients:this.recipients}),this.summary.error?this.errors=[this.summary.error]:this.errors=[],this.requestUpdate("errors"),this.fireCustomEvent(Oe.ContentChanged,this.summary)):(this.summary=t.json,this.summary.error&&(this.errors=[this.summary.error]),this.requestUpdate("errors"),this.fireCustomEvent(Oe.ContentChanged,this.summary))}))}}handleAdvancedToggle(t){re(t),this.recipients=[],this.exclusions={},this.advanced&&(this.query="",this.value=null),this.advanced=!this.advanced,this.setValue({advanced:this.advanced,query:this.query,exclusions:this.exclusions,recipients:this.recipients})}handleQueryChange(t){const e=t.target;this.query=e.inputElement.value}handleRecipientsChanged(){"0"!==this.refreshKey||this.initialized?this.refresh():this.initialized=!0}handleActivityLevelChanged(t){const e=t.target.values[0];e&&this.exclusions.not_seen_since_days&&(this.exclusions.not_seen_since_days=parseInt(e.value),this.refresh())}handleActivityLabelClicked(t){if(t.target&&"TEMBA-CHECKBOX"!==t.target.tagName&&"TEMBA-SELECT"!==t.target.tagName&&!t.target.disabled){const e=t.currentTarget.querySelector("temba-checkbox");e.checked=!e.checked}}handleExclusionChanged(t){if("TEMBA-CHECKBOX"===t.target.tagName){const e=JSON.stringify(this.exclusions),i=t.target;let o=i.checked;if("not_seen_since_days"===i.name&&o){const t=i.parentElement.querySelector("temba-select");t.values[0]&&(o=parseInt(t.values[0].value))}o?this.exclusions[i.name]=o:delete this.exclusions[i.name],e!==JSON.stringify(this.exclusions)&&this.refresh()}}render(){let t;if(this.summary&&!this.summary.error){const e=this.summary.total||0;t=j`
           <div class="result-count">
             Found
             <a
@@ -2766,57 +2797,93 @@ let ir=Is,or=!1;const nr=["es","fr","pt"],{setLocale:sr}=(t=>(function(t){if(or)
           </temba-button>
         `}return this.summary&&this.summary.blockers&&this.summary.blockers.length>0?j`${this.summary.blockers.map((t=>j`<temba-alert level="error">${pr(t)}</temba-alert>`))}`:j`
       ${this.advanced?j`<div class="query">
-            <temba-textinput
-              .label=${this.label}
-              .helpText=${this.helpText}
-              .widgetOnly=${this.widgetOnly}
-              .errors=${this.errors}
-              name=${this.name}
-              .inputRoot=${this}
-              @input=${this.handleQueryChange}
-              placeholder=${this.placeholder}
-              .value=${this.query}
-              textarea
-              autogrow
-            >
-            </temba-textinput>
-          </div>`:j`<temba-omnibox
-              placeholder="Search for contacts or groups"
-              widget_only=""
-              groups=""
-              contacts=""
-              label="Recipients"
-              help_text="The contacts to send the message to."
-              .errors=${this.errors}
-              id="recipients"
-              name="recipients"
-              .value=${this.recipients}
-              endpoint="/contact/omnibox/?"
-              @change=${this.handleRecipientsChanged}
-            >
-            </temba-omnibox>
-
-            ${this.not_seen_since_days?j`<temba-checkbox
-                  name="not_seen_since_days"
-                  label="${ir("Skip inactive contacts")}"
-                  help_text="${ir("Only include contacts who have sent a message in the last 90 days.")}"
-                  ?checked=${90===this.exclusions.not_seen_since_days}
-                  @change=${this.handleExclusionChanged}
-                ></temba-checkbox>`:null}
-            ${this.in_a_flow?j`<temba-checkbox
-                  name="in_a_flow"
-                  label="${ir("Skip contacts currently in a flow")}"
-                  help_text="${ir("Avoid interrupting a contact who is already in a flow.")}"
-                  ?checked=${this.exclusions.in_a_flow}
-                  @change=${this.handleExclusionChanged}
-                ></temba-checkbox>`:null}
-            ${this.started_previously?j`<temba-checkbox
-                  name="started_previously"
-                  label="${ir("Skip repeat contacts")}"
-                  help_text="${ir("Avoid restarting a contact who has been in this flow in the last 90 days.")}"
-                  ?checked=${this.exclusions.started_previously}
-                  @change=${this.handleExclusionChanged}
-                ></temba-checkbox>`:null}`}
+              <temba-textinput
+                .label=${this.label}
+                .helpText=${this.helpText}
+                .widgetOnly=${this.widgetOnly}
+                .errors=${this.errors}
+                name=${this.name}
+                .inputRoot=${this}
+                @input=${this.handleQueryChange}
+                placeholder=${this.placeholder}
+                .value=${this.query}
+                textarea
+                autogrow
+              >
+              </temba-textinput>
+            </div>`:j`<temba-omnibox
+                placeholder="Search for contacts or groups"
+                widget_only=""
+                groups=""
+                contacts=""
+                label="Recipients"
+                help_text="The contacts to send the message to."
+                .errors=${this.errors}
+                id="recipients"
+                name="recipients"
+                .value=${this.recipients}
+                endpoint="/contact/omnibox/?"
+                @change=${this.handleRecipientsChanged}
+              >
+              </temba-omnibox>
+
+              <div class="filters">
+                <div style="display:flex;font-size:1em;margin-bottom:0.5em">
+                  <temba-icon size="1" name="filter"></temba-icon>
+                  <div style="margin-left:0.5em">
+                    Only include contacts who...
+                  </div>
+                </div>
+
+                ${this.not_seen_since_days?j`
+                      <div
+                        class="activity-select"
+                        @click=${this.handleActivityLabelClicked}
+                      >
+                        <temba-checkbox
+                          style="display:inline;"
+                          name="not_seen_since_days"
+                          @change=${this.handleExclusionChanged}
+                        >
+                        </temba-checkbox>
+
+                        <div style="margin-left:0.5em">
+                          ${ir("Have sent a message in the last")}
+                        </div>
+
+                        <temba-select
+                          style="margin-left:0.5em"
+                          class="small-select"
+                          @change=${this.handleActivityLevelChanged}
+                          ?disabled=${!this.exclusions.not_seen_since_days}
+                        >
+                          <temba-option
+                            name="90 days"
+                            value="90"
+                          ></temba-option>
+                          <temba-option
+                            name="180 days"
+                            value="180"
+                          ></temba-option>
+                          <temba-option name="Year" value="365"></temba-option>
+                        </temba-select>
+                        <div></div>
+                      </div>
+                    `:null}
+                ${this.in_a_flow?j`<temba-checkbox
+                      name="in_a_flow"
+                      label="${ir("Are not currently in a flow")}"
+                      ?checked=${this.exclusions.in_a_flow}
+                      @change=${this.handleExclusionChanged}
+                    ></temba-checkbox>`:null}
+                ${this.started_previously?j`<temba-checkbox
+                      name="started_previously"
+                      label="${ir("Have not started this flow in the last 90 days")}"
+                      ?checked=${this.exclusions.started_previously}
+                      @change=${this.handleExclusionChanged}
+                    ></temba-checkbox>`:null}
+              </div>`}
+              </div>
 
       <div
         class="results ${Vt({fetching:this.fetching,initialized:this.initialized||this.fetching,empty:(this.summary&&this.summary.error||!this.summary)&&!this.fetching})}"
@@ -2826,8 +2893,8 @@ let ir=Is,or=!1;const nr=["es","fr","pt"],{setLocale:sr}=(t=>(function(t){if(or)
       </div>
 
       ${this.summary&&this.summary.warnings?this.summary.warnings.map((t=>j`<temba-alert level="warning"
-                >${pr(t)}</temba-alert
-              >`)):""}
+                  >${pr(t)}</temba-alert
+                >`)):""}
     `}}t([ge({type:Boolean})],Yl.prototype,"in_a_flow",void 0),t([ge({type:Boolean})],Yl.prototype,"started_previously",void 0),t([ge({type:Boolean})],Yl.prototype,"not_seen_since_days",void 0),t([ge({type:Boolean})],Yl.prototype,"fetching",void 0),t([ge({type:Boolean})],Yl.prototype,"expanded",void 0),t([ge({type:String})],Yl.prototype,"endpoint",void 0),t([ge({type:String})],Yl.prototype,"placeholder",void 0),t([ge({type:String})],Yl.prototype,"name",void 0),t([ge({type:String})],Yl.prototype,"query",void 0),t([ge({type:Number})],Yl.prototype,"inactiveThreshold",void 0),t([ge({type:Number})],Yl.prototype,"inactiveDays",void 0),t([ge({type:Object,attribute:!1})],Yl.prototype,"summary",void 0),t([ge({type:Object,attribute:!1})],Yl.prototype,"flow",void 0),t([ge({type:Array})],Yl.prototype,"recipients",void 0),t([ge({type:Boolean})],Yl.prototype,"advanced",void 0),t([ge({type:String})],Yl.prototype,"refreshKey",void 0),t([ge({type:Object})],Yl.prototype,"exclusions",void 0);class Kl extends lt{static get styles(){return r`
       :host {
         align-items: center;
@@ -3863,7 +3930,7 @@ let ir=Is,or=!1;const nr=["es","fr","pt"],{setLocale:sr}=(t=>(function(t){if(or)
           </div>
         </div>
       </div>
-    `}}t([ge({type:Boolean})],ah.prototype,"open",void 0),t([ge({type:Boolean})],ah.prototype,"top",void 0),t([ge({type:Boolean})],ah.prototype,"bottom",void 0),t([ge({type:Boolean})],ah.prototype,"left",void 0),t([ge({type:Boolean})],ah.prototype,"right",void 0),t([ge({type:Number})],ah.prototype,"arrowSize",void 0),t([ge({type:Number})],ah.prototype,"arrowOffset",void 0),t([ge({type:Number})],ah.prototype,"offsetX",void 0),t([ge({type:Number})],ah.prototype,"offsetY",void 0),t([ge({type:Boolean})],ah.prototype,"mask",void 0);class lh extends ue{constructor(){super(...arguments),this.embedded=!1,this.collapses=!1,this.bottom=!1,this.focusedName=!1,this.index=-1,this.refresh="",this.tabs=[]}static get styles(){return r`
+    `}}t([ge({type:Boolean})],ah.prototype,"open",void 0),t([ge({type:Boolean})],ah.prototype,"top",void 0),t([ge({type:Boolean})],ah.prototype,"bottom",void 0),t([ge({type:Boolean})],ah.prototype,"left",void 0),t([ge({type:Boolean})],ah.prototype,"right",void 0),t([ge({type:Number})],ah.prototype,"arrowSize",void 0),t([ge({type:Number})],ah.prototype,"arrowOffset",void 0),t([ge({type:Number})],ah.prototype,"offsetX",void 0),t([ge({type:Number})],ah.prototype,"offsetY",void 0),t([ge({type:Boolean})],ah.prototype,"mask",void 0);class lh extends ue{constructor(){super(...arguments),this.embedded=!1,this.collapses=!1,this.bottom=!1,this.unselect=!1,this.focusedName=!1,this.index=-1,this.refresh="",this.tabs=[]}static get styles(){return r`
       :host {
         display: flex;
         flex-direction: column;
@@ -3972,6 +4039,14 @@ let ir=Is,or=!1;const nr=["es","fr","pt"],{setLocale:sr}=(t=>(function(t){if(or)
       .bottom .tab.selected {
       }
 
+      .unselect .tab.selected {
+        cursor: pointer;
+      }
+
+      .unselect .tab.selected:hover {
+        background: var(--unselect-tab-color, #eee);
+      }
+
       .tab:hover {
         --icon-color: #666;
         color: #666;
@@ -4059,7 +4134,7 @@ let ir=Is,or=!1;const nr=["es","fr","pt"],{setLocale:sr}=(t=>(function(t){if(or)
       .pane {
         display: flex;
       }
-    `}handleTabClick(t){this.index=parseInt(t.currentTarget.dataset.index),t.preventDefault(),t.stopPropagation(),this.requestUpdate("index")}handleSlotChange(){const t=[];for(const e of this.children)if("TEMBA-TAB"===e.tagName){const i=e;t.push(i)}this.tabs=t}firstUpdated(t){super.firstUpdated(t),this.shadowRoot.addEventListener("slotchange",this.handleSlotChange.bind(this))}updated(t){if(super.updated(t),(t.has("index")||t.has("tabs"))&&(this.tabs.forEach(((t,e)=>{t.selected=e==this.index})),this.fireEvent(Oe.ContextChanged)),this.index>this.tabs.length){const t=this.tabs[this.index];if(t&&t.hidden)for(let t=0;t<this.tabs.length;t++){const e=this.tabs[t];if(e&&!e.hidden)return void(this.index=t)}}}setTabDetails(t,e){if(t<this.tabs.length){const i=this.tabs[t];i.count=e.count,i.hidden=e.hidden,this.requestUpdate()}else setTimeout((()=>{this.setTabDetails(t,e)}),100)}getCurrentTab(){return this.tabs[this.index]}getTab(t){return this.tabs[t]}handleTabContentChanged(){this.requestUpdate()}render(){return j`
+    `}handleTabClick(t){const e=parseInt(t.currentTarget.dataset.index);this.unselect&&this.index===e?this.index=-1:this.index=e,t.preventDefault(),t.stopPropagation(),this.requestUpdate("index")}handleSlotChange(){const t=[];for(const e of this.children)if("TEMBA-TAB"===e.tagName){const i=e;t.push(i)}this.tabs=t}firstUpdated(t){super.firstUpdated(t),this.shadowRoot.addEventListener("slotchange",this.handleSlotChange.bind(this))}updated(t){if(super.updated(t),(t.has("index")||t.has("tabs"))&&(this.tabs.forEach(((t,e)=>{t.selected=e==this.index})),this.fireEvent(Oe.ContextChanged)),this.index>this.tabs.length){const t=this.tabs[this.index];if(t&&t.hidden)for(let t=0;t<this.tabs.length;t++){const e=this.tabs[t];if(e&&!e.hidden)return void(this.index=t)}}}setTabDetails(t,e){if(t<this.tabs.length){const i=this.tabs[t];i.count=e.count,i.hidden=e.hidden,this.requestUpdate()}else setTimeout((()=>{this.setTabDetails(t,e)}),100)}getCurrentTab(){return this.tabs[this.index]}getTab(t){return this.tabs[t]}handleTabContentChanged(){this.requestUpdate()}render(){return j`
       ${this.bottom?j`<div
             class="pane ${Vt({first:0==this.index,embedded:this.embedded,bottom:this.bottom})}"
           >
@@ -4067,7 +4142,7 @@ let ir=Is,or=!1;const nr=["es","fr","pt"],{setLocale:sr}=(t=>(function(t){if(or)
           </div>`:null}
 
       <div
-        class="tabs ${Vt({tabs:!0,bottom:this.bottom,collapses:this.collapses,embedded:this.embedded,focusedname:this.focusedName})}"
+        class="tabs ${Vt({tabs:!0,bottom:this.bottom,collapses:this.collapses,embedded:this.embedded,focusedname:this.focusedName,unselect:this.unselect})}"
       >
         ${this.tabs.map(((t,e)=>j`
             <div
@@ -4099,7 +4174,7 @@ let ir=Is,or=!1;const nr=["es","fr","pt"],{setLocale:sr}=(t=>(function(t){if(or)
           >
             <slot></slot>
           </div>`}
-    `}}t([ge({type:Boolean})],lh.prototype,"embedded",void 0),t([ge({type:Boolean})],lh.prototype,"collapses",void 0),t([ge({type:Boolean})],lh.prototype,"bottom",void 0),t([ge({type:Boolean})],lh.prototype,"focusedName",void 0),t([ge({type:Number})],lh.prototype,"index",void 0),t([ge({type:String})],lh.prototype,"refresh",void 0),t([ge({type:Array,attribute:!1})],lh.prototype,"tabs",void 0);class hh extends ue{constructor(){super(...arguments),this.selected=!1,this.notify=!1,this.hidden=!1,this.count=0,this.checked=!1}static get styles(){return r`
+    `}}t([ge({type:Boolean})],lh.prototype,"embedded",void 0),t([ge({type:Boolean})],lh.prototype,"collapses",void 0),t([ge({type:Boolean})],lh.prototype,"bottom",void 0),t([ge({type:Boolean})],lh.prototype,"unselect",void 0),t([ge({type:Boolean})],lh.prototype,"focusedName",void 0),t([ge({type:Number})],lh.prototype,"index",void 0),t([ge({type:String})],lh.prototype,"refresh",void 0),t([ge({type:Array,attribute:!1})],lh.prototype,"tabs",void 0);class hh extends ue{constructor(){super(...arguments),this.selected=!1,this.notify=!1,this.hidden=!1,this.count=0,this.checked=!1}static get styles(){return r`
       :host {
         display: none;
         flex-direction: column;
@@ -5938,6 +6013,10 @@ let ir=Is,or=!1;const nr=["es","fr","pt"],{setLocale:sr}=(t=>(function(t){if(or)
         title="${this.datetime.toLocaleString(Ph.datetime)}"
         >${t}</span
       >`}}}t([ge({type:String})],Ih.prototype,"value",void 0),t([ge({type:String})],Ih.prototype,"display",void 0),t([ge({type:Object,attribute:!1})],Ih.prototype,"datetime",void 0);let Dh=class extends ue{constructor(){super(...arguments),this.body=j`<temba-loading></temba-loading>`}static get styles(){return r``}updated(t){super.updated(t),t.has("endpoint")&&jt(this.endpoint).then((t=>{this.body=pr(t.body)}))}render(){return j`${this.body}`}};t([ge({type:String})],Dh.prototype,"endpoint",void 0),t([ge({attribute:!1})],Dh.prototype,"body",void 0),Dh=t([(t=>(e,i)=>{void 0!==i?i.addInitializer((()=>{customElements.define(t,e)})):customElements.define(t,e)})("temba-remote")],Dh);var Nh,Bh=Dh;class Rh extends fe{static get styles(){return r`
+      :host {
+        --textarea-min-height: var(--textarea-min-height, 4em);
+      }
+
       .container {
         display: flex;
         flex-direction: column;
@@ -5958,7 +6037,7 @@ let ir=Is,or=!1;const nr=["es","fr","pt"],{setLocale:sr}=(t=>(function(t){if(or)
           --compose-curvature,
           var(--curvature) var(--curvature) 0px 0px
         );
-        --textarea-min-height: var(--textarea-min-height, 4em);
+
         --widget-box-shadow: none;
         padding: var(--compose-padding, 0px);
       }
@@ -6074,6 +6153,7 @@ let ir=Is,or=!1;const nr=["es","fr","pt"],{setLocale:sr}=(t=>(function(t){if(or)
         embedded
         focusedname
         bottom
+        unselect
         refresh="${this.currentAttachments.length}|${this.index}|${this.currentQuickReplies.length}|${t}|${this.currentOptin}"
       >
         ${this.attachments?j`<temba-tab