@twilio/conversations 2.0.0-rc.3 → 2.0.1-rc.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -2818,27 +2818,34 @@ img {
2818
2818
  <a href="#instantiating-and-using" id="instantiating-and-using" style="color: inherit; text-decoration: none;">
2819
2819
  <h2>Instantiating and using</h2>
2820
2820
  </a>
2821
- <p>To use the library you need <a href="https://www.twilio.com/docs/conversations/create-tokens">to generate a token</a> and pass it to the conversations Client <code>create</code> factory.</p>
2821
+ <p>To use the library you need <a href="https://www.twilio.com/docs/conversations/create-tokens">to generate a token</a> and pass it to the Conversations Client constructor.</p>
2822
2822
  <a href="#npm" id="npm" style="color: inherit; text-decoration: none;">
2823
2823
  <h3>NPM</h3>
2824
2824
  </a>
2825
2825
  <pre><code><span style="color: #001080">npm</span><span style="color: #000000"> </span><span style="color: #001080">install</span><span style="color: #000000"> --</span><span style="color: #001080">save</span><span style="color: #000000"> @</span><span style="color: #001080">twilio</span><span style="color: #000000">/</span><span style="color: #001080">conversations</span>
2826
2826
  </code></pre>
2827
- <p>Using this method, you can <code>require</code> <code>twilio-conversations</code> and then use the client:</p>
2828
- <pre><code><span style="color: #0000FF">const</span><span style="color: #000000"> </span><span style="color: #0070C1">Conversations</span><span style="color: #000000"> = </span><span style="color: #795E26">require</span><span style="color: #000000">(</span><span style="color: #A31515">'@twilio/conversations'</span><span style="color: #000000">);</span>
2829
- <span style="color: #001080">Conversations</span><span style="color: #000000">.</span><span style="color: #001080">Client</span><span style="color: #000000">.</span><span style="color: #795E26">create</span><span style="color: #000000">(</span><span style="color: #001080">token</span><span style="color: #000000">).</span><span style="color: #795E26">then</span><span style="color: #000000">(</span><span style="color: #001080">client</span><span style="color: #000000"> </span><span style="color: #0000FF">=&gt;</span><span style="color: #000000"> {</span>
2830
- <span style="color: #000000"> </span><span style="color: #008000">// Use client</span>
2831
- <span style="color: #000000">});</span>
2832
- </code></pre>
2833
- <p>Or, if you prefer <code>async</code>/<code>await</code> syntax:</p>
2834
- <pre><code><span style="color: #0000FF">const</span><span style="color: #000000"> </span><span style="color: #0070C1">Conversations</span><span style="color: #000000"> = </span><span style="color: #795E26">require</span><span style="color: #000000">(</span><span style="color: #A31515">'@twilio/conversations'</span><span style="color: #000000">);</span>
2835
- <span style="color: #0000FF">const</span><span style="color: #000000"> </span><span style="color: #0070C1">client</span><span style="color: #000000"> = </span><span style="color: #AF00DB">await</span><span style="color: #000000"> </span><span style="color: #001080">Conversations</span><span style="color: #000000">.</span><span style="color: #001080">Client</span><span style="color: #000000">.</span><span style="color: #795E26">create</span><span style="color: #000000">(</span><span style="color: #001080">token</span><span style="color: #000000">);</span>
2836
- <span style="color: #008000">// Use client</span>
2827
+ <p>Using this method, you can <code>require</code> <code>twilio-conversations</code> and then use the
2828
+ client:</p>
2829
+ <pre><code><span style="color: #0000FF">const</span><span style="color: #000000"> { </span><span style="color: #0070C1">Client</span><span style="color: #000000"> } = </span><span style="color: #795E26">require</span><span style="color: #000000">(</span><span style="color: #A31515">'@twilio/conversations'</span><span style="color: #000000">);</span>
2830
+ <span style="color: #0000FF">const</span><span style="color: #000000"> </span><span style="color: #0070C1">client</span><span style="color: #000000"> = </span><span style="color: #0000FF">new</span><span style="color: #000000"> </span><span style="color: #795E26">Client</span><span style="color: #000000">(</span><span style="color: #001080">token</span><span style="color: #000000">);</span>
2831
+ <span style="color: #008000">// Before you use the client, subscribe to the `'stateChanged'` event and wait </span>
2832
+ <span style="color: #008000">// for the `'initialized'` state to be reported.</span>
2833
+ <span style="color: #001080">client</span><span style="color: #000000">.</span><span style="color: #795E26">on</span><span style="color: #000000">(</span><span style="color: #A31515">'stateChanged'</span><span style="color: #000000">, (</span><span style="color: #001080">state</span><span style="color: #000000">) </span><span style="color: #0000FF">=&gt;</span><span style="color: #000000"> {</span>
2834
+ <span style="color: #000000"> </span><span style="color: #AF00DB">if</span><span style="color: #000000"> (</span><span style="color: #001080">state</span><span style="color: #000000"> === </span><span style="color: #A31515">'initialized'</span><span style="color: #000000">) {</span>
2835
+ <span style="color: #000000"> </span><span style="color: #008000">// Use the client</span>
2836
+ <span style="color: #000000"> }</span>
2837
+ <span style="color: #000000">}</span>
2837
2838
  </code></pre>
2838
2839
  <p>The SDK could also be imported using the ES module syntax:</p>
2839
- <pre><code><span style="color: #AF00DB">import</span><span style="color: #000000"> { </span><span style="color: #001080">Conversations</span><span style="color: #000000"> } </span><span style="color: #AF00DB">from</span><span style="color: #000000"> </span><span style="color: #A31515">'@twilio/conversations'</span><span style="color: #000000">;</span>
2840
- <span style="color: #0000FF">const</span><span style="color: #000000"> </span><span style="color: #0070C1">client</span><span style="color: #000000"> = </span><span style="color: #AF00DB">await</span><span style="color: #000000"> </span><span style="color: #001080">Conversations</span><span style="color: #000000">.</span><span style="color: #001080">Client</span><span style="color: #000000">.</span><span style="color: #795E26">create</span><span style="color: #000000">(</span><span style="color: #001080">token</span><span style="color: #000000">);</span>
2841
- <span style="color: #008000">// Use client</span>
2840
+ <pre><code><span style="color: #AF00DB">import</span><span style="color: #000000"> { </span><span style="color: #001080">Client</span><span style="color: #000000"> } </span><span style="color: #AF00DB">from</span><span style="color: #000000"> </span><span style="color: #A31515">'@twilio/conversations'</span><span style="color: #000000">;</span>
2841
+ <span style="color: #0000FF">const</span><span style="color: #000000"> </span><span style="color: #0070C1">client</span><span style="color: #000000"> = </span><span style="color: #0000FF">new</span><span style="color: #000000"> </span><span style="color: #795E26">Client</span><span style="color: #000000">(</span><span style="color: #001080">token</span><span style="color: #000000">);</span>
2842
+ <span style="color: #008000">// Before you use the client, subscribe to the `'stateChanged'` event and wait </span>
2843
+ <span style="color: #008000">// for the `'initialized'` state to be reported.</span>
2844
+ <span style="color: #001080">client</span><span style="color: #000000">.</span><span style="color: #795E26">on</span><span style="color: #000000">(</span><span style="color: #A31515">'stateChanged'</span><span style="color: #000000">, (</span><span style="color: #001080">state</span><span style="color: #000000">) </span><span style="color: #0000FF">=&gt;</span><span style="color: #000000"> {</span>
2845
+ <span style="color: #000000"> </span><span style="color: #AF00DB">if</span><span style="color: #000000"> (</span><span style="color: #001080">state</span><span style="color: #000000"> === </span><span style="color: #A31515">'initialized'</span><span style="color: #000000">) {</span>
2846
+ <span style="color: #000000"> </span><span style="color: #008000">// Use the client</span>
2847
+ <span style="color: #000000"> }</span>
2848
+ <span style="color: #000000">}</span>
2842
2849
  </code></pre>
2843
2850
  <a href="#cdn" id="cdn" style="color: inherit; text-decoration: none;">
2844
2851
  <h3>CDN</h3>
@@ -2847,14 +2854,8 @@ img {
2847
2854
  directly in your web app using a <code>&lt;script&gt;</code> tag.</p>
2848
2855
  <pre><code class="language-html"><span style="color: #800000">&lt;script</span><span style="color: #000000FF"> </span><span style="color: #FF0000">src</span><span style="color: #000000FF">=</span><span style="color: #0000FF">"https://media.twiliocdn.com/sdk/js/conversations/v2.0/twilio-conversations.min.js"</span><span style="color: #800000">&gt;&lt;/script&gt;</span>
2849
2856
  </code></pre>
2850
- <p>Using this method, <code>twilio-conversations.js</code> will set a browser global <code>Twilio.Conversations</code> through which you can use the client :</p>
2851
- <pre><code><span style="color: #001080">Twilio</span><span style="color: #000000">.</span><span style="color: #001080">Conversations</span><span style="color: #000000">.</span><span style="color: #001080">Client</span><span style="color: #000000">.</span><span style="color: #795E26">create</span><span style="color: #000000">(</span><span style="color: #001080">token</span><span style="color: #000000">).</span><span style="color: #795E26">then</span><span style="color: #000000">(</span><span style="color: #001080">client</span><span style="color: #000000"> </span><span style="color: #0000FF">=&gt;</span><span style="color: #000000"> {</span>
2852
- <span style="color: #000000"> </span><span style="color: #008000">// Use client</span>
2853
- <span style="color: #000000">});</span>
2854
- </code></pre>
2855
- <p>or, if you prefer <code>async</code>/<code>await</code> syntax:</p>
2856
- <pre><code><span style="color: #0000FF">let</span><span style="color: #000000"> </span><span style="color: #001080">client</span><span style="color: #000000"> = </span><span style="color: #AF00DB">await</span><span style="color: #000000"> </span><span style="color: #001080">Twilio</span><span style="color: #000000">.</span><span style="color: #001080">Conversations</span><span style="color: #000000">.</span><span style="color: #001080">Client</span><span style="color: #000000">.</span><span style="color: #795E26">create</span><span style="color: #000000">(</span><span style="color: #001080">token</span><span style="color: #000000">);</span>
2857
- <span style="color: #008000">// Use client</span>
2857
+ <p>Using this method, <code>twilio-conversations.js</code> will set a browser global <code>Twilio.Conversations</code> through which you can use the client:</p>
2858
+ <pre><code><span style="color: #0000FF">const</span><span style="color: #000000"> </span><span style="color: #0070C1">client</span><span style="color: #000000"> = </span><span style="color: #0000FF">new</span><span style="color: #000000"> </span><span style="color: #001080">Twilio</span><span style="color: #000000">.</span><span style="color: #001080">Conversations</span><span style="color: #000000">.</span><span style="color: #795E26">Client</span><span style="color: #000000">(</span><span style="color: #001080">token</span><span style="color: #000000">);</span>
2858
2859
  </code></pre>
2859
2860
  <a href="#security" id="security" style="color: inherit; text-decoration: none;">
2860
2861
  <h3>Security</h3>
@@ -2864,7 +2865,7 @@ img {
2864
2865
  <p>If you require more security you will have to consume SDK by using <a href="https://developer.mozilla.org/en-US/docs/Web/Security/Subresource_Integrity">SRI</a> and using an exact version
2865
2866
  number. While less flexible it is significantly more secure, which is required by some applications.</p>
2866
2867
  <p>To consume securely use the following script snippet format:</p>
2867
- <pre><code class="language-html"><span style="color: #800000">&lt;script</span><span style="color: #000000FF"> </span><span style="color: #FF0000">src</span><span style="color: #000000FF">=</span><span style="color: #0000FF">"https://media.twiliocdn.com/sdk/js/conversations/releases/2.0.0/twilio-conversations.min.js"</span>
2868
+ <pre><code class="language-html"><span style="color: #800000">&lt;script</span><span style="color: #000000FF"> </span><span style="color: #FF0000">src</span><span style="color: #000000FF">=</span><span style="color: #0000FF">"https://media.twiliocdn.com/sdk/js/conversations/releases/2.0.1/twilio-conversations.min.js"</span>
2868
2869
  <span style="color: #000000FF"> </span><span style="color: #FF0000">integrity</span><span style="color: #000000FF">=</span><span style="color: #0000FF">"sha256-&lt;HASH FROM THE CHANGELOGS PAGE&gt;"</span>
2869
2870
  <span style="color: #000000FF"> </span><span style="color: #FF0000">crossorigin</span><span style="color: #000000FF">=</span><span style="color: #0000FF">"anonymous"</span><span style="color: #800000">&gt;&lt;/script&gt;</span>
2870
2871
  </code></pre>
@@ -2886,7 +2886,7 @@ img {
2886
2886
  </aside>
2887
2887
  <div class="tsd-comment tsd-typography">
2888
2888
  <div class="lead">
2889
- <p>SID of the message in the conversation.s</p>
2889
+ <p>SID of the message in the conversation.</p>
2890
2890
  </div>
2891
2891
  </div>
2892
2892
  </section>
@@ -2826,7 +2826,8 @@ img {
2826
2826
  <div class="tsd-comment tsd-typography">
2827
2827
  <div class="lead">
2828
2828
  <p>Configuration for attaching a media file to a message.
2829
- These options can be passed to <a href="../classes/Conversation.html#sendMessage">Conversation.sendMessage</a>.</p>
2829
+ These options can be passed to <a href="../classes/Conversation.html#sendMessage">Conversation.sendMessage</a> and
2830
+ <a href="../classes/MessageBuilder.html#addMedia">MessageBuilder.addMedia</a>.</p>
2830
2831
  </div>
2831
2832
  </div>
2832
2833
  </section>
@@ -2820,27 +2820,34 @@ img {
2820
2820
  <a href="#instantiating-and-using" id="instantiating-and-using" style="color: inherit; text-decoration: none;">
2821
2821
  <h2>Instantiating and using</h2>
2822
2822
  </a>
2823
- <p>To use the library you need <a href="https://www.twilio.com/docs/conversations/create-tokens">to generate a token</a> and pass it to the conversations Client <code>create</code> factory.</p>
2823
+ <p>To use the library you need <a href="https://www.twilio.com/docs/conversations/create-tokens">to generate a token</a> and pass it to the Conversations Client constructor.</p>
2824
2824
  <a href="#npm" id="npm" style="color: inherit; text-decoration: none;">
2825
2825
  <h3>NPM</h3>
2826
2826
  </a>
2827
2827
  <pre><code><span style="color: #001080">npm</span><span style="color: #000000"> </span><span style="color: #001080">install</span><span style="color: #000000"> --</span><span style="color: #001080">save</span><span style="color: #000000"> @</span><span style="color: #001080">twilio</span><span style="color: #000000">/</span><span style="color: #001080">conversations</span>
2828
2828
  </code></pre>
2829
- <p>Using this method, you can <code>require</code> <code>twilio-conversations</code> and then use the client:</p>
2830
- <pre><code><span style="color: #0000FF">const</span><span style="color: #000000"> </span><span style="color: #0070C1">Conversations</span><span style="color: #000000"> = </span><span style="color: #795E26">require</span><span style="color: #000000">(</span><span style="color: #A31515">&#039;@twilio/conversations&#039;</span><span style="color: #000000">);</span>
2831
- <span style="color: #001080">Conversations</span><span style="color: #000000">.</span><span style="color: #001080">Client</span><span style="color: #000000">.</span><span style="color: #795E26">create</span><span style="color: #000000">(</span><span style="color: #001080">token</span><span style="color: #000000">).</span><span style="color: #795E26">then</span><span style="color: #000000">(</span><span style="color: #001080">client</span><span style="color: #000000"> </span><span style="color: #0000FF">=&gt;</span><span style="color: #000000"> {</span>
2832
- <span style="color: #000000"> </span><span style="color: #008000">// Use client</span>
2833
- <span style="color: #000000">});</span>
2834
- </code></pre>
2835
- <p>Or, if you prefer <code>async</code>/<code>await</code> syntax:</p>
2836
- <pre><code><span style="color: #0000FF">const</span><span style="color: #000000"> </span><span style="color: #0070C1">Conversations</span><span style="color: #000000"> = </span><span style="color: #795E26">require</span><span style="color: #000000">(</span><span style="color: #A31515">&#039;@twilio/conversations&#039;</span><span style="color: #000000">);</span>
2837
- <span style="color: #0000FF">const</span><span style="color: #000000"> </span><span style="color: #0070C1">client</span><span style="color: #000000"> = </span><span style="color: #AF00DB">await</span><span style="color: #000000"> </span><span style="color: #001080">Conversations</span><span style="color: #000000">.</span><span style="color: #001080">Client</span><span style="color: #000000">.</span><span style="color: #795E26">create</span><span style="color: #000000">(</span><span style="color: #001080">token</span><span style="color: #000000">);</span>
2838
- <span style="color: #008000">// Use client</span>
2829
+ <p>Using this method, you can <code>require</code> <code>twilio-conversations</code> and then use the
2830
+ client:</p>
2831
+ <pre><code><span style="color: #0000FF">const</span><span style="color: #000000"> { </span><span style="color: #0070C1">Client</span><span style="color: #000000"> } = </span><span style="color: #795E26">require</span><span style="color: #000000">(</span><span style="color: #A31515">&#039;@twilio/conversations&#039;</span><span style="color: #000000">);</span>
2832
+ <span style="color: #0000FF">const</span><span style="color: #000000"> </span><span style="color: #0070C1">client</span><span style="color: #000000"> = </span><span style="color: #0000FF">new</span><span style="color: #000000"> </span><span style="color: #795E26">Client</span><span style="color: #000000">(</span><span style="color: #001080">token</span><span style="color: #000000">);</span>
2833
+ <span style="color: #008000">// Before you use the client, subscribe to the `&#039;stateChanged&#039;` event and wait </span>
2834
+ <span style="color: #008000">// for the `&#039;initialized&#039;` state to be reported.</span>
2835
+ <span style="color: #001080">client</span><span style="color: #000000">.</span><span style="color: #795E26">on</span><span style="color: #000000">(</span><span style="color: #A31515">&#039;stateChanged&#039;</span><span style="color: #000000">, (</span><span style="color: #001080">state</span><span style="color: #000000">) </span><span style="color: #0000FF">=&gt;</span><span style="color: #000000"> {</span>
2836
+ <span style="color: #000000"> </span><span style="color: #AF00DB">if</span><span style="color: #000000"> (</span><span style="color: #001080">state</span><span style="color: #000000"> === </span><span style="color: #A31515">&#039;initialized&#039;</span><span style="color: #000000">) {</span>
2837
+ <span style="color: #000000"> </span><span style="color: #008000">// Use the client</span>
2838
+ <span style="color: #000000"> }</span>
2839
+ <span style="color: #000000">}</span>
2839
2840
  </code></pre>
2840
2841
  <p>The SDK could also be imported using the ES module syntax:</p>
2841
- <pre><code><span style="color: #AF00DB">import</span><span style="color: #000000"> { </span><span style="color: #001080">Conversations</span><span style="color: #000000"> } </span><span style="color: #AF00DB">from</span><span style="color: #000000"> </span><span style="color: #A31515">&#039;@twilio/conversations&#039;</span><span style="color: #000000">;</span>
2842
- <span style="color: #0000FF">const</span><span style="color: #000000"> </span><span style="color: #0070C1">client</span><span style="color: #000000"> = </span><span style="color: #AF00DB">await</span><span style="color: #000000"> </span><span style="color: #001080">Conversations</span><span style="color: #000000">.</span><span style="color: #001080">Client</span><span style="color: #000000">.</span><span style="color: #795E26">create</span><span style="color: #000000">(</span><span style="color: #001080">token</span><span style="color: #000000">);</span>
2843
- <span style="color: #008000">// Use client</span>
2842
+ <pre><code><span style="color: #AF00DB">import</span><span style="color: #000000"> { </span><span style="color: #001080">Client</span><span style="color: #000000"> } </span><span style="color: #AF00DB">from</span><span style="color: #000000"> </span><span style="color: #A31515">&#039;@twilio/conversations&#039;</span><span style="color: #000000">;</span>
2843
+ <span style="color: #0000FF">const</span><span style="color: #000000"> </span><span style="color: #0070C1">client</span><span style="color: #000000"> = </span><span style="color: #0000FF">new</span><span style="color: #000000"> </span><span style="color: #795E26">Client</span><span style="color: #000000">(</span><span style="color: #001080">token</span><span style="color: #000000">);</span>
2844
+ <span style="color: #008000">// Before you use the client, subscribe to the `&#039;stateChanged&#039;` event and wait </span>
2845
+ <span style="color: #008000">// for the `&#039;initialized&#039;` state to be reported.</span>
2846
+ <span style="color: #001080">client</span><span style="color: #000000">.</span><span style="color: #795E26">on</span><span style="color: #000000">(</span><span style="color: #A31515">&#039;stateChanged&#039;</span><span style="color: #000000">, (</span><span style="color: #001080">state</span><span style="color: #000000">) </span><span style="color: #0000FF">=&gt;</span><span style="color: #000000"> {</span>
2847
+ <span style="color: #000000"> </span><span style="color: #AF00DB">if</span><span style="color: #000000"> (</span><span style="color: #001080">state</span><span style="color: #000000"> === </span><span style="color: #A31515">&#039;initialized&#039;</span><span style="color: #000000">) {</span>
2848
+ <span style="color: #000000"> </span><span style="color: #008000">// Use the client</span>
2849
+ <span style="color: #000000"> }</span>
2850
+ <span style="color: #000000">}</span>
2844
2851
  </code></pre>
2845
2852
  <a href="#cdn" id="cdn" style="color: inherit; text-decoration: none;">
2846
2853
  <h3>CDN</h3>
@@ -2849,14 +2856,8 @@ img {
2849
2856
  directly in your web app using a <code>&lt;script&gt;</code> tag.</p>
2850
2857
  <pre><code class="language-html"><span style="color: #800000">&lt;script</span><span style="color: #000000FF"> </span><span style="color: #FF0000">src</span><span style="color: #000000FF">=</span><span style="color: #0000FF">&quot;https://media.twiliocdn.com/sdk/js/conversations/v2.0/twilio-conversations.min.js&quot;</span><span style="color: #800000">&gt;&lt;/script&gt;</span>
2851
2858
  </code></pre>
2852
- <p>Using this method, <code>twilio-conversations.js</code> will set a browser global <code>Twilio.Conversations</code> through which you can use the client :</p>
2853
- <pre><code><span style="color: #001080">Twilio</span><span style="color: #000000">.</span><span style="color: #001080">Conversations</span><span style="color: #000000">.</span><span style="color: #001080">Client</span><span style="color: #000000">.</span><span style="color: #795E26">create</span><span style="color: #000000">(</span><span style="color: #001080">token</span><span style="color: #000000">).</span><span style="color: #795E26">then</span><span style="color: #000000">(</span><span style="color: #001080">client</span><span style="color: #000000"> </span><span style="color: #0000FF">=&gt;</span><span style="color: #000000"> {</span>
2854
- <span style="color: #000000"> </span><span style="color: #008000">// Use client</span>
2855
- <span style="color: #000000">});</span>
2856
- </code></pre>
2857
- <p>or, if you prefer <code>async</code>/<code>await</code> syntax:</p>
2858
- <pre><code><span style="color: #0000FF">let</span><span style="color: #000000"> </span><span style="color: #001080">client</span><span style="color: #000000"> = </span><span style="color: #AF00DB">await</span><span style="color: #000000"> </span><span style="color: #001080">Twilio</span><span style="color: #000000">.</span><span style="color: #001080">Conversations</span><span style="color: #000000">.</span><span style="color: #001080">Client</span><span style="color: #000000">.</span><span style="color: #795E26">create</span><span style="color: #000000">(</span><span style="color: #001080">token</span><span style="color: #000000">);</span>
2859
- <span style="color: #008000">// Use client</span>
2859
+ <p>Using this method, <code>twilio-conversations.js</code> will set a browser global <code>Twilio.Conversations</code> through which you can use the client:</p>
2860
+ <pre><code><span style="color: #0000FF">const</span><span style="color: #000000"> </span><span style="color: #0070C1">client</span><span style="color: #000000"> = </span><span style="color: #0000FF">new</span><span style="color: #000000"> </span><span style="color: #001080">Twilio</span><span style="color: #000000">.</span><span style="color: #001080">Conversations</span><span style="color: #000000">.</span><span style="color: #795E26">Client</span><span style="color: #000000">(</span><span style="color: #001080">token</span><span style="color: #000000">);</span>
2860
2861
  </code></pre>
2861
2862
  <a href="#security" id="security" style="color: inherit; text-decoration: none;">
2862
2863
  <h3>Security</h3>
@@ -2866,7 +2867,7 @@ img {
2866
2867
  <p>If you require more security you will have to consume SDK by using <a href="https://developer.mozilla.org/en-US/docs/Web/Security/Subresource_Integrity">SRI</a> and using an exact version
2867
2868
  number. While less flexible it is significantly more secure, which is required by some applications.</p>
2868
2869
  <p>To consume securely use the following script snippet format:</p>
2869
- <pre><code class="language-html"><span style="color: #800000">&lt;script</span><span style="color: #000000FF"> </span><span style="color: #FF0000">src</span><span style="color: #000000FF">=</span><span style="color: #0000FF">&quot;https://media.twiliocdn.com/sdk/js/conversations/releases/2.0.0/twilio-conversations.min.js&quot;</span>
2870
+ <pre><code class="language-html"><span style="color: #800000">&lt;script</span><span style="color: #000000FF"> </span><span style="color: #FF0000">src</span><span style="color: #000000FF">=</span><span style="color: #0000FF">&quot;https://media.twiliocdn.com/sdk/js/conversations/releases/2.0.1/twilio-conversations.min.js&quot;</span>
2870
2871
  <span style="color: #000000FF"> </span><span style="color: #FF0000">integrity</span><span style="color: #000000FF">=</span><span style="color: #0000FF">&quot;sha256-&lt;HASH FROM THE CHANGELOGS PAGE&gt;&quot;</span>
2871
2872
  <span style="color: #000000FF"> </span><span style="color: #FF0000">crossorigin</span><span style="color: #000000FF">=</span><span style="color: #0000FF">&quot;anonymous&quot;</span><span style="color: #800000">&gt;&lt;/script&gt;</span>
2872
2873
  </code></pre>
package/dist/lib.d.ts CHANGED
@@ -1009,7 +1009,8 @@ interface ConversationUpdatedEventArgs {
1009
1009
  }
1010
1010
  /**
1011
1011
  * Configuration for attaching a media file to a message.
1012
- * These options can be passed to {@link Conversation.sendMessage}.
1012
+ * These options can be passed to {@link Conversation.sendMessage} and
1013
+ * {@link MessageBuilder.addMedia}.
1013
1014
  */
1014
1015
  interface SendMediaOptions {
1015
1016
  /**
@@ -1431,7 +1432,7 @@ interface PushNotificationData {
1431
1432
  */
1432
1433
  messageIndex?: number;
1433
1434
  /**
1434
- * SID of the message in the conversation.s
1435
+ * SID of the message in the conversation.
1435
1436
  */
1436
1437
  messageSid?: string;
1437
1438
  }
@@ -1815,6 +1816,13 @@ declare class Client extends ReplayEventEmitter<ClientEvents> {
1815
1816
  * The factory method will automatically trigger connection.
1816
1817
  * Do not use it if you need finer-grained control.
1817
1818
  *
1819
+ * Since this method returns an already-initialized client, some of the events
1820
+ * will be lost because they happen *before* the initialization. It is
1821
+ * recommended that `client.onWithReplay` is used as opposed to `client.on`
1822
+ * for subscribing to client events. The `client.onWithReplay` will re-emit
1823
+ * the most recent value for a given event if it emitted before the
1824
+ * subscription.
1825
+ *
1818
1826
  * @param token Access token.
1819
1827
  * @param options Options to customize the client.
1820
1828
  * @returns Returns a fully initialized client.
@@ -1941,4 +1949,12 @@ declare class RestPaginator<T> implements Paginator<T> {
1941
1949
  */
1942
1950
  prevPage(): Promise<RestPaginator<T>>;
1943
1951
  }
1944
- export { Conversation, ConversationUpdateReason, ConversationStatus, NotificationLevel, ConversationState, ConversationUpdatedEventArgs, SendMediaOptions, SendEmailOptions, LastMessage, Participant, ParticipantUpdateReason, ParticipantType, ParticipantUpdatedEventArgs, Message, MessageUpdateReason, MessageType, MessageUpdatedEventArgs, Media, MediaCategory$0 as MediaCategory, AggregatedDeliveryReceipt, DeliveryAmount, DetailedDeliveryReceipt, DeliveryStatus, RestPaginator, MessageBuilder, UnsentMessage, Paginator, User, UserUpdateReason, UserUpdatedEventArgs, PushNotification, PushNotificationType, PushNotificationDescriptor, PushNotificationData, Client, State, ConnectionState, NotificationsChannelType, ClientOptions, CreateConversationOptions };
1952
+ declare class NotificationTypes {
1953
+ static readonly TYPING_INDICATOR = "twilio.ipmsg.typing_indicator";
1954
+ static readonly NEW_MESSAGE = "twilio.conversations.new_message";
1955
+ static readonly ADDED_TO_CONVERSATION = "twilio.conversations.added_to_conversation";
1956
+ // static readonly INVITED_TO_CHANNEL = 'twilio.channel.invited_to_channel';
1957
+ static readonly REMOVED_FROM_CONVERSATION = "twilio.conversations.removed_from_conversation";
1958
+ static readonly CONSUMPTION_UPDATE = "twilio.channel.consumption_update";
1959
+ }
1960
+ export { Conversation, ConversationUpdateReason, ConversationStatus, NotificationLevel, ConversationState, ConversationUpdatedEventArgs, SendMediaOptions, SendEmailOptions, LastMessage, Participant, ParticipantUpdateReason, ParticipantType, ParticipantUpdatedEventArgs, Message, MessageUpdateReason, MessageType, MessageUpdatedEventArgs, Media, MediaCategory$0 as MediaCategory, AggregatedDeliveryReceipt, DeliveryAmount, DetailedDeliveryReceipt, DeliveryStatus, RestPaginator, MessageBuilder, UnsentMessage, Paginator, User, UserUpdateReason, UserUpdatedEventArgs, PushNotification, PushNotificationType, PushNotificationDescriptor, PushNotificationData, NotificationTypes, Client, State, ConnectionState, NotificationsChannelType, ClientOptions, CreateConversationOptions };
package/dist/lib.js CHANGED
@@ -161,9 +161,9 @@ require('core-js/modules/web.dom-collections.iterator.js');
161
161
  require('core-js/modules/es.regexp.exec.js');
162
162
  require('core-js/modules/es.string.replace.js');
163
163
  require('core-js/modules/es.array.join.js');
164
- var JsonDiff = require('rfc6902');
165
164
  var declarativeTypeValidator = require('@twilio/declarative-type-validator');
166
165
  var replayEventEmitter = require('@twilio/replay-event-emitter');
166
+ var isEqual = require('lodash.isequal');
167
167
  require('core-js/modules/es.array.slice.js');
168
168
  require('core-js/modules/es.function.name.js');
169
169
  require('core-js/modules/es.symbol.description.js');
@@ -244,7 +244,7 @@ var _classCallCheck__default = /*#__PURE__*/_interopDefaultLegacy(_classCallChec
244
244
  var _regeneratorRuntime__default = /*#__PURE__*/_interopDefaultLegacy(_regeneratorRuntime);
245
245
  var _typeof__default = /*#__PURE__*/_interopDefaultLegacy(_typeof);
246
246
  var loglevelLog__namespace = /*#__PURE__*/_interopNamespace(loglevelLog);
247
- var JsonDiff__namespace = /*#__PURE__*/_interopNamespace(JsonDiff);
247
+ var isEqual__default = /*#__PURE__*/_interopDefaultLegacy(isEqual);
248
248
  var _slicedToArray__default = /*#__PURE__*/_interopDefaultLegacy(_slicedToArray);
249
249
  var _toConsumableArray__default = /*#__PURE__*/_interopDefaultLegacy(_toConsumableArray);
250
250
 
@@ -459,21 +459,12 @@ var Configuration = function Configuration() {
459
459
  }
460
460
  };
461
461
 
462
- /**
463
- * Checks if objects are equal
464
- */
465
-
466
- function isDeepEqual(o1, o2) {
467
- return JsonDiff__namespace.createPatch(o1, o2).length === 0;
468
- }
469
462
  /**
470
463
  * Deep-clone an object. Note that this does not work on object containing
471
464
  * functions.
472
465
  * @param {object} obj - the object to deep-clone
473
466
  * @returns {object}
474
467
  */
475
-
476
-
477
468
  function deepClone(obj) {
478
469
  return JSON.parse(JSON.stringify(obj));
479
470
  }
@@ -719,7 +710,7 @@ var User = /*#__PURE__*/function (_ReplayEventEmitter) {
719
710
  case 9:
720
711
  updateAttributes = parseAttributes(value.value, "Retrieved malformed attributes from the server for user: ".concat(this.state.identity), log$8);
721
712
 
722
- if (!isDeepEqual(this.state.attributes, updateAttributes)) {
713
+ if (!isEqual__default['default'](this.state.attributes, updateAttributes)) {
723
714
  this.state.attributes = updateAttributes;
724
715
  updateReasons.push('attributes');
725
716
  }
@@ -1432,7 +1423,7 @@ var Participant = /*#__PURE__*/function (_ReplayEventEmitter) {
1432
1423
  var updateReasons = [];
1433
1424
  var updateAttributes = parseAttributes(data.attributes, 'Retrieved malformed attributes from the server for participant: ' + this.state.sid, log$7);
1434
1425
 
1435
- if (data.attributes && !isDeepEqual(this.state.attributes, updateAttributes)) {
1426
+ if (data.attributes && !isEqual__default['default'](this.state.attributes, updateAttributes)) {
1436
1427
  this.state.attributes = updateAttributes;
1437
1428
  updateReasons.push('attributes');
1438
1429
  }
@@ -2647,7 +2638,7 @@ var Message = /*#__PURE__*/function (_ReplayEventEmitter) {
2647
2638
 
2648
2639
  var updatedAttributes = parseAttributes(data.attributes, "Got malformed attributes for the message ".concat(this.sid), log$5);
2649
2640
 
2650
- if (!isDeepEqual(this.state.attributes, updatedAttributes)) {
2641
+ if (!isEqual__default['default'](this.state.attributes, updatedAttributes)) {
2651
2642
  this.state.attributes = updatedAttributes;
2652
2643
  updateReasons.push('attributes');
2653
2644
  }
@@ -4210,7 +4201,7 @@ var Conversation = /*#__PURE__*/function (_ReplayEventEmitter) {
4210
4201
  break;
4211
4202
 
4212
4203
  case fieldMappings.attributes:
4213
- if (isDeepEqual(this.channelState.attributes, update.attributes)) {
4204
+ if (isEqual__default['default'](this.channelState.attributes, update.attributes)) {
4214
4205
  break;
4215
4206
  }
4216
4207
 
@@ -4246,7 +4237,7 @@ var Conversation = /*#__PURE__*/function (_ReplayEventEmitter) {
4246
4237
  updateReasons.add(localKey);
4247
4238
  }
4248
4239
 
4249
- if (isDeepEqual(this.channelState.lastMessage, {})) {
4240
+ if (isEqual__default['default'](this.channelState.lastMessage, {})) {
4250
4241
  delete this.channelState.lastMessage;
4251
4242
  }
4252
4243
 
@@ -4259,7 +4250,7 @@ var Conversation = /*#__PURE__*/function (_ReplayEventEmitter) {
4259
4250
  state.dateUpdated = new Date(state.dateUpdated);
4260
4251
  }
4261
4252
 
4262
- if (isDeepEqual(this.channelState.state, state)) {
4253
+ if (isEqual__default['default'](this.channelState.state, state)) {
4263
4254
  break;
4264
4255
  }
4265
4256
 
@@ -4393,7 +4384,7 @@ var Conversation = /*#__PURE__*/function (_ReplayEventEmitter) {
4393
4384
  while (1) {
4394
4385
  switch (_context5.prev = _context5.next) {
4395
4386
  case 0:
4396
- return _context5.abrupt("return", this.participantsEntity.addNonChatParticipant(proxyAddress, address, attributes !== null && attributes !== void 0 ? attributes : {}));
4387
+ return _context5.abrupt("return", this.participantsEntity.addNonChatParticipant(proxyAddress, address, attributes));
4397
4388
 
4398
4389
  case 1:
4399
4390
  case "end":
@@ -5925,7 +5916,7 @@ var Conversations = /*#__PURE__*/function (_ReplayEventEmitter) {
5925
5916
  updateData.lastConsumedMessageIndex = data.lastConsumedMessageIndex;
5926
5917
  }
5927
5918
 
5928
- if (!isDeepEqual(updateData, {})) {
5919
+ if (!isEqual__default['default'](updateData, {})) {
5929
5920
  conversation._update(updateData);
5930
5921
  }
5931
5922
 
@@ -6608,7 +6599,7 @@ function PushNotification(data) {
6608
6599
  this.data = data.data || {};
6609
6600
  };
6610
6601
 
6611
- var version = "2.0.0-rc.3";
6602
+ var version = "2.0.1-rc.2";
6612
6603
 
6613
6604
  function ownKeys$1(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
6614
6605
 
@@ -7692,6 +7683,13 @@ exports.Client = Client_1 = (_temp = _class = /*#__PURE__*/function (_ReplayEven
7692
7683
  * The factory method will automatically trigger connection.
7693
7684
  * Do not use it if you need finer-grained control.
7694
7685
  *
7686
+ * Since this method returns an already-initialized client, some of the events
7687
+ * will be lost because they happen *before* the initialization. It is
7688
+ * recommended that `client.onWithReplay` is used as opposed to `client.on`
7689
+ * for subscribing to client events. The `client.onWithReplay` will re-emit
7690
+ * the most recent value for a given event if it emitted before the
7691
+ * subscription.
7692
+ *
7695
7693
  * @param token Access token.
7696
7694
  * @param options Options to customize the client.
7697
7695
  * @returns Returns a fully initialized client.
@@ -7858,6 +7856,7 @@ exports.DetailedDeliveryReceipt = DetailedDeliveryReceipt;
7858
7856
  exports.Media = Media;
7859
7857
  exports.Message = Message;
7860
7858
  exports.MessageBuilder = MessageBuilder;
7859
+ exports.NotificationTypes = NotificationTypes;
7861
7860
  exports.Participant = Participant;
7862
7861
  exports.PushNotification = PushNotification;
7863
7862
  exports.RestPaginator = RestPaginator;