stream-chat-angular 5.13.0 → 5.14.0

package/src/assets/styles/scss/Channel/Channel-layout.scss

@@ -65,8 +65,9 @@
   }
 
   .str-chat__loading-channel-message-list {
-    @include utils.message-list-spacing;
+    /* stylelint-disable */
     height: 100%;
+    @include utils.message-list-spacing;
 
     .str-chat__loading-channel-message {
       display: flex;

package/src/assets/styles/scss/ChannelSearch/ChannelSearch-layout.scss

@@ -7,6 +7,7 @@
   flex-direction: column;
   justify-content: center;
 
+  &.str-chat__channel-search--active.str-chat__channel-search--inline,
   &.str-chat__channel-search--with-results.str-chat__channel-search--inline {
     height: 100%;
   }

package/src/assets/styles/scss/Message/Message-layout.scss

@@ -120,6 +120,10 @@
     grid-template-areas: 'message';
   }
 
+  &.str-chat__message--blocked {
+    grid-template-areas: 'message';
+  }
+
   &.str-chat__message--system {
     grid-template-areas: 'message';
     grid-template-columns: auto;
@@ -260,6 +264,10 @@
     @include chat-bubble-spacing;
   }
 
+  .str-chat__message--blocked-inner {
+    @include chat-bubble-spacing;
+  }
+
   .str-chat__quoted-message-bubble {
     @include chat-bubble-spacing;
     display: flex;
@@ -375,7 +383,7 @@
   }
 }
 
-.str-chat__message--other .str-chat__message-inner {
+.str-chat__message--other .str-chat__message-inner:not(:has(.str-chat__message-options--active)) {
   margin-inline-end: var(--str-chat-message-options-size);
 }
 

package/src/assets/styles/scss/Message/Message-theme.scss

@@ -118,6 +118,30 @@
   /* Box shadow applied to a deleted message */
   --str-chat__deleted-message-box-shadow: none;
 
+  /* The border radius used for the borders of a deleted message */
+  --str-chat__blocked-message-border-radius: var(--str-chat__border-radius-md);
+
+  /* The text/icon of a deleted message */
+  --str-chat__blocked-message-color: var(--str-chat__text-low-emphasis-color);
+
+  /* The background of a deleted message */
+  --str-chat__blocked-message-background-color: var(--str-chat__secondary-surface-color);
+
+  /* Top border of a deleted message */
+  --str-chat__blocked-message-border-block-start: none;
+
+  /* Bottom border of a deleted message */
+  --str-chat__blocked-message-border-block-end: none;
+
+  /* Left (right in RTL layout) border of a deleted message */
+  --str-chat__blocked-message-border-inline-start: none;
+
+  /* Right (left in RTL layout) border of a deleted message */
+  --str-chat__blocked-message-border-inline-end: none;
+
+  /* Box shadow applied to a deleted message */
+  --str-chat__blocked-message-box-shadow: none;
+
   /* The border radius used for the borders of a system message */
   --str-chat__system-message-border-radius: 0;
 
@@ -191,6 +215,11 @@
   }
 }
 
+.str-chat__message-mention {
+  color: var(--str-chat__message-mention-color);
+  font: var(--str-chat__body2-medium-text);
+}
+
 .str-chat__message {
   @include utils.component-layer-overrides('message');
 
@@ -199,11 +228,6 @@
     color: var(--str-chat__message-link-color);
   }
 
-  .str-chat__message-mention {
-    color: var(--str-chat__message-mention-color);
-    font: var(--str-chat__body2-medium-text);
-  }
-
   .str-chat__message-bubble {
     @include utils.component-layer-overrides('message-bubble');
     font: var(--str-chat__body2-text);
@@ -214,6 +238,11 @@
     font: var(--str-chat__body2-text);
   }
 
+  .str-chat__message--blocked-inner {
+    @include utils.component-layer-overrides('blocked-message');
+    font: var(--str-chat__body2-text);
+  }
+
   &.str-chat__message--me .str-chat__message-bubble {
     color: var(--str-chat__own-message-bubble-color);
     background-color: var(--str-chat__own-message-bubble-background-color);

package/src/assets/styles/scss/Poll/Poll-layout.scss

@@ -332,8 +332,8 @@
   }
 
   .str-chat__poll-creation-dialog {
+    height: 100%;
     width: 100%;
-    height: 700px;
     display: flex;
     flex-direction: column;
 

package/src/assets/styles/scss/Search/Search-layout.scss

@@ -0,0 +1,148 @@
+@use '../utils';
+
+.str-chat__search {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+
+  &.str-chat__search--active {
+    flex: 1;
+    max-height: 100%;
+  }
+
+  .str-chat__search-bar {
+    @include utils.flex-row-center;
+    padding: var(--str-chat__spacing-2_5)  var(--str-chat__spacing-2);
+    gap: 0.25rem;
+
+    .str-chat__search-bar-button {
+      @include utils.button-reset;
+      padding: var(--str-chat__spacing-1);
+      cursor: pointer;
+    }
+
+    .str-chat__search-input--wrapper {
+      display: flex;
+      align-items: center;
+      flex: 1;
+      padding: var(--str-chat__spacing-1_5) var(--str-chat__spacing-2);
+      min-width: 0;
+
+      .str-chat__search-input--icon {
+        height: 20px;
+        width: 20px;
+        margin-right: 0.5rem;
+      }
+
+      .str-chat__search-input--clear-button {
+        @include utils.button-reset;
+        cursor: pointer;
+        padding: 0;
+
+        &:disabled {
+          cursor: default;
+        }
+
+        .str-chat__search-input--clear-button-icon {
+          height: 20px;
+          width: 20px;
+          mask-size: 20px;
+          -webkit-mask-size: 20px;
+        }
+      }
+
+      input {
+        flex: 1;
+        min-width: 0;
+      }
+    }
+  }
+
+  .str-chat__search-results {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    min-height: 0;
+
+    .str-chat__search-results-header {
+      width: 100%;
+
+      button {
+        @include utils.button-reset();
+        cursor: pointer;
+      }
+
+      .str-chat__search-results-header__filter-source-buttons {
+        display: flex;
+        flex-wrap: wrap;
+        gap: 0.5rem;
+        padding: var(--str-chat__spacing-3) var(--str-chat__spacing-2_5);
+        width: 100%;
+
+        .str-chat__search-results-header__filter-source-button {
+          padding: 0.5rem 0.75rem;
+          border-radius: var(--str-chat__border-radius-circle);
+          background-color: var(--str-chat__tertiary-surface-color);
+        }
+
+        .str-chat__search-results-header__filter-source-button--active {
+          background-color: var(--str-chat__surface-color);
+          color: var(--str-chat__text-color);
+          font-weight: 500;
+        }
+      }
+    }
+
+    .str-chat__search-results-presearch,
+    .str-chat__search-source-results-empty {
+      width: 100%;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      padding: 1.25rem;
+    }
+
+    .str-chat__search-source-results {
+      flex: 1;
+      display: flex;
+      flex-direction: column;
+      min-height: 0;
+
+      .str-chat__search-source-result-list {
+        flex: 1;
+        display: flex;
+        flex-direction: column;
+        min-height: 0;
+
+        .str-chat__infinite-scroll-paginator__content {
+          display: flex;
+          flex-direction: column;
+        }
+
+        .str-chat__search-result {
+          display: flex;
+          align-items: center;
+          width: 100%;
+          column-gap: var(--str-chat__spacing-2);
+          padding: var(--str-chat__spacing-3) var(--str-chat__spacing-2);
+
+          .search__result-text,
+          .str-chat__search-result--display-name {
+            @include utils.ellipsis-text;
+            @include utils.prevent-glitch-text-overflow;
+          }
+        }
+
+        .str-chat__search-source-result-list__footer {
+          height: 4rem;
+          width: 100%;
+          display: flex;
+          justify-content: center;
+          align-items: center;
+          flex-direction: column;
+        }
+      }
+    }
+  }
+}

package/src/assets/styles/scss/Search/Search-theme.scss

@@ -0,0 +1,222 @@
+@use '../utils';
+
+/* Only available in React SDK. */
+.str-chat {
+  /* The text/icon color of the component */
+  --str-chat__search-input-color: var(--str-chat__text-color);
+
+  /* The text/icon color of the component */
+  --str-chat__search-input-placeholder-color: var(--str-chat__text-low-emphasis-color);
+
+  /* The text/icon color of the component */
+  --str-chat__search-input-icon-color: var(--str-chat__text-low-emphasis-color);
+
+  /* Top border of the component */
+  --str-chat__search-input-border-block-start: none;
+
+  /* Bottom border of the component */
+  --str-chat__search-input-border-block-end: none;
+
+  /* Left (right in RTL layout) borhe component */
+  --str-chat__search-input-border-inline-start: none;
+
+  /* Right (left in RTL layout) borhe component */
+  --str-chat__search-input-border-inline-end: none;
+
+  /* The border radius used for the borders of the component */
+  --str-chat__search-input-wrapper-border-radius: var(--str-chat__border-radius-circle);
+
+  /* The background color of the component */
+  --str-chat__search-input-wrapper-background-color: transparent;
+
+  /* Top border of the component */
+  --str-chat__search-input-wrapper-border-block-start: var(--str-chat__surface-color) 1px
+  solid;
+
+  /* Bottom border of the component */
+  --str-chat__search-input-wrapper-border-block-end: var(--str-chat__surface-color) 1px
+  solid;
+
+  /* Left (right in RTL layout) border of the component */
+  --str-chat__search-input-wrapper-border-inline-start: var(--str-chat__surface-color) 1px
+  solid;
+
+  /* Right (left in RTL layout) border of the component */
+  --str-chat__search-input-wrapper-border-inline-end: var(--str-chat__surface-color) 1px
+  solid;
+
+  /* The border radius used for the borders of the component */
+  --str-chat__search-input-wrapper-active-border-radius: var(--str-chat__border-radius-circle);
+
+  /* The background color of the component */
+  --str-chat__search-input-wrapper-active-background-color: transparent;
+
+  /* Top border of the component */
+  --str-chat__search-input-wrapper-active-border-block-start: var(--str-chat__primary-color)
+  1px solid;
+
+  /* Bottom border of the component */
+  --str-chat__search-input-wrapper-active-border-block-end: var(--str-chat__primary-color)
+  1px solid;
+
+  /* Left (right in RTL layout) border of the component */
+  --str-chat__search-input-wrapper-active-border-inline-start: var(
+                  --str-chat__primary-color
+  )
+  1px solid;
+
+  /* Right (left in RTL layout) border of the component */
+  --str-chat__search-input-wrapper-active-border-inline-end: var(--str-chat__primary-color)
+  1px solid;
+
+  /* The background applied to channel search result */
+  --str-chat__search-result-background-color: transparent;
+
+  /* Top border of the component */
+  --str-chat__search-result-border-block-start: none;
+
+  /* Bottom border of the component */
+  --str-chat__search-result-border-block-end: none;
+
+  /* Left (right in RTL layout) border of the component */
+  --str-chat__search-result-border-inline-start: none;
+
+  /* Right (left in RTL layout) border of the component */
+  --str-chat__search-result-border-inline-end: none;
+
+  /* Background color used for the search result hover / focused state */
+  --str-chat__search-result-hover-background-color: var(
+                  --str-chat__secondary-surface-color
+  );
+
+  --str-chat__search-result-list-color: var(--str-chat__text-color);
+
+  --str-chat__search-result-list-background-color: var(--str-chat__secondary-background-color);
+
+  /* Top border of the component  */
+  --str-chat__search-result-list-border-block-start: none;
+
+  /* Bottom border of the component */
+  --str-chat__search-result-list-border-block-end: none;
+
+  /* Left (right in RTL layout) border of the component */
+  --str-chat__search-result-list-border-inline-start: none;
+
+  /* Right (left in RTL layout) border of the component */
+  --str-chat__search-result-list-border-inline-end: none;
+
+  /* Box shadow applied to the component */
+  --str-chat__search-result-list-popup-box-shadow: 0 4px 4px var(--str-chat__box-shadow-color);
+
+  /* The font color used in the search results header  */
+  --str-chat__search-results-header-color: var(--str-chat__text-low-emphasis-color);
+
+  /* The background color used in the search results header  */
+  --str-chat__search-results-header-background-color: var(--str-chat__background-color);
+
+  /* Top border of the component  */
+  --str-chat__search-results-header-border-block-start: none;
+
+  /* Bottom border of the component */
+  --str-chat__search-results-header-border-block-end: var(--str-chat__surface-color) 1px
+  solid;
+
+  /* Left (right in RTL layout) border of the component */
+  --str-chat__search-results-header-border-inline-start: none;
+
+  /* Right (left in RTL layout) border of the component */
+  --str-chat__search-results-header-border-inline-end: none;
+
+  /* The font color used in the empty search results indicator  */
+  --str-chat__search-results-empty-color: var(--str-chat__text-low-emphasis-color);
+
+  /* The icon color used in the empty search results indicator  */
+  --str-chat__search-results-empty-icon-color: var(--str-chat__disabled-color);
+
+  /* The background color used in the empty search results indicator  */
+  --str-chat__search-results-empty-background-color: var(--str-chat__background-color);
+
+  /* Top border of the component  */
+  --str-chat__search-results-empty-border-block-start: none;
+
+  /* Bottom border of the component */
+  --str-chat__search-results-empty-border-block-end: none;
+
+  /* Left (right in RTL layout) border of the component */
+  --str-chat__search-results-empty-border-inline-start: none;
+
+  /* Right (left in RTL layout) border of the component */
+  --str-chat__search-results-empty-border-inline-end: none;
+}
+
+.str-chat__search-input--wrapper {
+  @include utils.component-layer-overrides('search-input-wrapper');
+
+  .str-chat__search-input--icon {
+    background-image: var(--str-chat__magnifier-glass-icon);
+    background-repeat: no-repeat;
+  }
+
+  input {
+    @include utils.component-layer-overrides('search-input');
+    outline: none;
+    font: var(--str-chat__subtitle-text);
+  }
+
+  .str-chat__search-input--clear-button-icon {
+    background-color: transparent;
+    -webkit-mask: var(--str-chat__clear-icon) no-repeat center / contain;
+    mask: var(--str-chat__clear-icon) no-repeat center / contain;
+  }
+}
+
+.str-chat__search-input--wrapper-active {
+  @include utils.component-layer-overrides('search-input-wrapper-active');
+
+  .str-chat__search-input--clear-button-icon {
+    background-color: var(--str-chat__text-low-emphasis-color);
+  }
+}
+
+.str-chat__search-bar-button--exit-search {
+  @include utils.button-reset();
+  color: var(--str-chat__primary-color);
+  font: var(--str-chat__subtitle-text);
+}
+
+.str-chat__search-results-header {
+  @include utils.component-layer-overrides('search-results-header');
+  font: var(--str-chat__subtitle-text);
+}
+
+.str-chat__search-source-result-list {
+  @include utils.component-layer-overrides('search-result-list');
+
+  .str-chat__search-container-empty {
+    @include utils.component-layer-overrides('search-results-empty');
+    font: var(--str-chat__subtitle2-medium-text);
+
+    svg path {
+      fill: var(--str-chat__search-results-empty-icon-color);
+    }
+  }
+
+  .str-chat__search-result {
+    @include utils.component-layer-overrides('search-result');
+
+    &.str-chat__channel-preview-messenger--active {
+      background-color: var(--str-chat__channel-preview-active-background-color);
+    }
+
+    .str-chat__search-result--display-name {
+      @include utils.channel-preview-display-name-theme;
+    }
+  }
+
+
+
+  .str-chat__search-result:hover,
+  .str-chat__search-result--focused {
+    background-color: var(--str-chat__search-result-hover-background-color);
+  }
+}

package/src/assets/styles/scss/_icons.scss

@@ -10,6 +10,8 @@
   --str-chat__poll-icon: url('data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMTggMTgiIGZpbGw9ImN1cnJlbnRDb2xvciIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxwYXRoIGQ9Ik0xNiAwSDJDMC45IDAgMCAwLjkgMCAyVjE2QzAgMTcuMSAwLjkgMTggMiAxOEgxNkMxNy4xIDE4IDE4IDE3LjEgMTggMTZWMkMxOCAwLjkgMTcuMSAwIDE2IDBaTTE2IDE2SDJWMkgxNlYxNlpNNCA3SDZWMTRINFY3Wk04IDRIMTBWMTRIOFY0Wk0xMiAxMEgxNFYxNEgxMlYxMFoiLz4KPC9zdmc+');
   --str-chat__handle-icon: url('data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMTYgNiIgZmlsbD0iY3VycmVuQ29sb3IiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgICA8cGF0aCBkPSJNMTYgMEgwVjJIMTZWMFpNMCA2SDE2VjRIMFY2WiIvPgo8L3N2Zz4K');
   --str-chat__circle-stop-icon: url('data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiBoZWlnaHQ9IjMyIiB2aWV3Qm94PSI0IDQgMjggMjgiIHdpZHRoPSIzMiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE2LjQ1NTEgMjcuMjQ0MUMyMi42MzA5IDI3LjI0NDEgMjcuNzQ0MSAyMi4xMTk4IDI3Ljc0NDEgMTUuOTU1MUMyNy43NDQxIDkuNzc5MyAyMi42MTk4IDQuNjY2MDIgMTYuNDQ0IDQuNjY2MDJDMTAuMjc5MyA0LjY2NjAyIDUuMTY2MDIgOS43NzkzIDUuMTY2MDIgMTUuOTU1MUM1LjE2NjAyIDIyLjExOTggMTAuMjkwNCAyNy4yNDQxIDE2LjQ1NTEgMjcuMjQ0MVpNMTYuNDU1MSAyNS4zNjI2QzExLjIzMTEgMjUuMzYyNiA3LjA1ODU5IDIxLjE3OSA3LjA1ODU5IDE1Ljk1NTFDNy4wNTg1OSAxMC43MzExIDExLjIyMDEgNi41NDc1MyAxNi40NDQgNi41NDc1M0MyMS42NjggNi41NDc1MyAyNS44NTE2IDEwLjczMTEgMjUuODYyNiAxNS45NTUxQzI1Ljg3MzcgMjEuMTc5IDIxLjY3OSAyNS4zNjI2IDE2LjQ1NTEgMjUuMzYyNlpNMTMuNTIyMSAxOS45ODM3SDE5LjM2NTlDMjAuMDYzMiAxOS45ODM3IDIwLjQ3MjcgMTkuNTc0MiAyMC40NzI3IDE4Ljg5OTFWMTMuMDExMUMyMC40NzI3IDEyLjMyNDkgMjAuMDYzMiAxMS45MjY0IDE5LjM2NTkgMTEuOTI2NEgxMy41MjIxQzEyLjgzNTkgMTEuOTI2NCAxMi40MTU0IDEyLjMyNDkgMTIuNDE1NCAxMy4wMTExVjE4Ljg5OTFDMTIuNDE1NCAxOS41NzQyIDEyLjgzNTkgMTkuOTgzNyAxMy41MjIxIDE5Ljk4MzdaIiBmaWxsPSIjMDA1ZmZmIi8+Cjwvc3ZnPg==');
+  --str-chat__magnifier-glass-icon: url('data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMjEgMjEiIGZpbGw9ImN1cnJlbnRDb2xvciIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNOSAwQzEzLjk2OCAwIDE4IDQuMDMyIDE4IDlDMTggMTMuOTY4IDEzLjk2OCAxOCA5IDE4QzQuMDMyIDE4IDAgMTMuOTY4IDAgOUMwIDQuMDMyIDQuMDMyIDAgOSAwWk05IDE2QzEyLjg2NyAxNiAxNiAxMi44NjcgMTYgOUMxNiA1LjEzMiAxMi44NjcgMiA5IDJDNS4xMzIgMiAyIDUuMTMyIDIgOUMyIDEyLjg2NyA1LjEzMiAxNiA5IDE2Wk0yMC4zMTQgMTguODk5TDE3LjQ4NSAxNi4wNzFMMTYuMDcxIDE3LjQ4NUwxOC44OTkgMjAuMzE0TDIwLjMxNCAxOC44OTlaIi8+Cjwvc3ZnPgo=');
+  --str-chat__clear-icon: url('data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMjAgMjAiIGZpbGw9ImN1cnJlbnRDb2xvciIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0wIDEwQzAgNC40NzcxNSA0LjQ3NzE1IDAgMTAgMEMxNS41MjI4IDAgMjAgNC40NzcxNSAyMCAxMEMyMCAxNS41MjI4IDE1LjUyMjggMjAgMTAgMjBDNC40NzcxNSAyMCAwIDE1LjUyMjggMCAxMFpNMTAgMkM1LjU4MTcyIDIgMiA1LjU4MTcyIDIgMTBDMiAxNC40MTgzIDUuNTgxNzIgMTggMTAgMThDMTQuNDE4MyAxOCAxOCAxNC40MTgzIDE4IDEwQzE4IDUuNTgxNzIgMTQuNDE4MyAyIDEwIDJaTTEzLjUzNTggNi40NjQ0NkMxMy4xNDUzIDYuMDczOTQgMTIuNTEyMSA2LjA3Mzk0IDEyLjEyMTYgNi40NjQ0NkwxMC4wMDAzIDguNTg1NzhMNy44Nzg5OCA2LjQ2NDQ2QzcuNDg4NDYgNi4wNzM5NCA2Ljg1NTI5IDYuMDczOTQgNi40NjQ3NyA2LjQ2NDQ2QzYuMDc0MjQgNi44NTQ5OSA2LjA3NDI0IDcuNDg4MTUgNi40NjQ3NyA3Ljg3ODY4TDguNTg2MDkgMTBMNi40NjQ3NyAxMi4xMjEzQzYuMDc0MjQgMTIuNTExOCA2LjA3NDI0IDEzLjE0NSA2LjQ2NDc3IDEzLjUzNTVDNi44NTUyOSAxMy45MjYxIDcuNDg4NDYgMTMuOTI2MSA3Ljg3ODk4IDEzLjUzNTVMMTAuMDAwMyAxMS40MTQyTDEyLjEyMTYgMTMuNTM1NUMxMi41MTIxIDEzLjkyNjEgMTMuMTQ1MyAxMy45MjYxIDEzLjUzNTggMTMuNTM1NUMxMy45MjY0IDEzLjE0NSAxMy45MjY0IDEyLjUxMTggMTMuNTM1OCAxMi4xMjEzTDExLjQxNDUgMTBMMTMuNTM1OCA3Ljg3ODY4QzEzLjkyNjQgNy40ODgxNSAxMy45MjY0IDYuODU0OTkgMTMuNTM1OCA2LjQ2NDQ2WiIvPgo8L3N2Zz4K');
 }
 
 @font-face {

package/src/assets/styles/scss/index.layout.scss

@@ -37,6 +37,7 @@
 @use 'Notification/NotificationList-layout';
 @use 'Notification/Notification-layout';
 @use 'Poll/Poll-layout';
+@use 'Search/Search-layout';
 @use 'Thread/Thread-layout';
 @use 'Tooltip/Tooltip-layout';
 @use 'TypingIndicator/TypingIndicator-layout';

package/src/assets/styles/scss/index.scss

@@ -38,6 +38,7 @@
 @use 'Notification/NotificationList-theme';
 @use 'Notification/Notification-theme';
 @use 'Poll/Poll-theme';
+@use 'Search/Search-theme';
 @use 'Thread/Thread-theme';
 @use 'Tooltip/Tooltip-theme';
 @use 'TypingIndicator/TypingIndicator-theme';

package/src/assets/styles/scss/vendor/react-image-gallery.scss

@@ -1,3 +1,5 @@
+@use "sass:color";
+
 $ig-small-screen: 768px !default;
 $ig-xsmall-screen: 480px !default;
 $ig-white: #fff !default;
@@ -5,7 +7,7 @@ $ig-black: #000 !default;
 $ig-blue: #337ab7 !default;
 $ig-background-black: rgba(0, 0, 0, 0.4) !default;
 $ig-transparent: rgba(0, 0, 0, 0) !default;
-$ig-shadow: 0 2px 2px lighten($ig-black, 10%);
+$ig-shadow: 0 2px 2px color.adjust($ig-black, $lightness: 10%);
 
 @mixin vendor-prefix($name, $value) {
   @each $vendor in ('-webkit-', '-moz-', '-ms-', '-o-', '') {

package/src/assets/version.ts

@@ -1 +1 @@
-export const version = '5.13.0';
+export const version = '5.14.0';