Merge pull request #44 from dyte-io/staging

chore(release): ui-kit-addon ordering, hand raise, code indentation in dyte-chat

CHANGELOG.md

@@ -1,3 +1,18 @@
+## [2.1.3-staging.2](https://github.com/dyte-io/ui-kit/compare/@dyte-in/ui-kit-v2.1.3-staging.1...@dyte-in/ui-kit-v2.1.3-staging.2) (2024-12-24)
+
+
+### Bug Fixes
+
+* allow passing a pre-loaded audio element ([822d9c0](https://github.com/dyte-io/ui-kit/commit/822d9c028e607d66d875e164654dcb96a6bf6d0f))
+
+## [2.1.3-staging.1](https://github.com/dyte-io/ui-kit/compare/@dyte-in/ui-kit-v2.1.2...@dyte-in/ui-kit-v2.1.3-staging.1) (2024-12-13)
+
+
+### Bug Fixes
+
+* **dyte-chat:** fixed code indentation for chat messages ([dae6425](https://github.com/dyte-io/ui-kit/commit/dae64258577a8e4e72eba31eeba4f40d82e7397e))
+* **ui-kit-addons:** fixed hand raise icon ordering issue ([8131e71](https://github.com/dyte-io/ui-kit/commit/8131e71a71189ee7011f82b798408248805a6de0))
+
 ## [2.1.2](https://github.com/dyte-io/ui-kit/compare/@dyte-in/ui-kit-v2.1.1...@dyte-in/ui-kit-v2.1.2) (2024-12-10)
 
 

packages/angular-library/projects/components/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dytesdk/angular-ui-kit",
-  "version": "2.1.2",
+  "version": "2.1.3-staging.2",
   "description": "Dyte's UI Kit to support easy UI development for Angular Projects",
   "peerDependencies": {
     "@angular/common": "^13 || ^14 || ^15 || ^16 || ^17",

packages/angular-library/projects/components/src/lib/stencil-generated/components.ts

@@ -2485,13 +2485,13 @@ export declare interface DyteParticipantsAudio extends Components.DyteParticipan
 
 @ProxyCmp({
   defineCustomElementFn: undefined,
-  inputs: ['iconPack', 'meeting', 't']
+  inputs: ['iconPack', 'meeting', 'preloadedAudioElem', 't']
 })
 @Component({
   selector: 'dyte-participants-audio',
   changeDetection: ChangeDetectionStrategy.OnPush,
   template: '<ng-content></ng-content>',
-  inputs: ['iconPack', 'meeting', 't']
+  inputs: ['iconPack', 'meeting', 'preloadedAudioElem', 't']
 })
 export class DyteParticipantsAudio {
   protected el: HTMLElement;

packages/core/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dytesdk/ui-kit",
-  "version": "2.1.2",
+  "version": "2.1.3-staging.2",
   "description": "Dyte's UI kit to support easy UI development over the core web library.",
   "main": "dist/index.cjs.js",
   "module": "dist/index.js",

packages/core/src/components.d.ts

@@ -2466,6 +2466,10 @@ export namespace Components {
           * Meeting object
          */
         "meeting": Meeting;
+        /**
+          * Pass existing audio element
+         */
+        "preloadedAudioElem": HTMLAudioElement;
         /**
           * Language
          */
@@ -7660,6 +7664,10 @@ declare namespace LocalJSX {
           * Callback to execute when the dialog is closed
          */
         "onDialogClose"?: (event: DyteParticipantsAudioCustomEvent<void>) => void;
+        /**
+          * Pass existing audio element
+         */
+        "preloadedAudioElem"?: HTMLAudioElement;
         /**
           * Language
          */

packages/core/src/components/dyte-markdown-view/dyte-markdown-view.tsx

@@ -95,7 +95,7 @@ export class DyteMarkdownView {
     });
 
     if (isCodeBlock) {
-      return <pre>{message}</pre>;
+      return <pre style={{ whiteSpace: 'pre', overflow: 'scroll' }}>{lines.join('\n')}</pre>;
     }
 
     return message;

packages/core/src/components/dyte-participants-audio/dyte-participants-audio.tsx

@@ -37,6 +37,9 @@ export class DyteParticipantsAudio {
   /** Language */
   @Prop() t: DyteI18n = useLanguage();
 
+  /** Pass existing audio element */
+  @Prop() preloadedAudioElem: HTMLAudioElement = undefined;
+
   /** Callback to execute when the dialog is closed */
   @Event({ eventName: 'dialogClose' }) dialogClose: EventEmitter<void>;
 
@@ -70,7 +73,7 @@ export class DyteParticipantsAudio {
   }
 
   private async setupAudio() {
-    this.audio = new DyteAudio(this.meeting);
+    this.audio = new DyteAudio(this.meeting, this.preloadedAudioElem);
     // Set the device to the current speaker device
     const currentDevices = this.meeting.self.getCurrentDevices();
     if (currentDevices.speaker != null) {

packages/core/src/lib/audio.ts

@@ -19,9 +19,9 @@ export default class DyteAudio {
 
   private _onError: () => void;
 
-  constructor(meeting: Meeting) {
+  constructor(meeting: Meeting, audio?: HTMLAudioElement) {
     this.meeting = meeting;
-    this.audio = document.createElement('audio');
+    this.audio = audio ?? document.createElement('audio');
     this.audio.autoplay = true;
 
     this.audioStream = new MediaStream();

packages/core/src/lib/builder/index.ts

@@ -1,4 +1,3 @@
-import cloneDeep from 'lodash-es/cloneDeep';
 import { UIConfig } from '../../exports';
 import { UIRoot, Element as E, StyleProps } from '../../types/ui-config/root';
 import { defaultConfig } from '../default-ui-config';
@@ -139,7 +138,7 @@ export class DyteUIBuilder {
   private config: UIConfig;
 
   constructor(config?: UIConfig) {
-    this.config = cloneDeep(config || defaultConfig);
+    this.config = config || defaultConfig;
   }
 
   /**

packages/react-library/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dytesdk/react-ui-kit",
-  "version": "2.1.2",
+  "version": "2.1.3-staging.2",
   "description": "Dyte's UI Kit to support easy UI development for React.",
   "repository": {
     "type": "git",

packages/vue-library/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dytesdk/vue-ui-kit",
-  "version": "2.1.2",
+  "version": "2.1.3-staging.2",
   "description": "Dyte's UI Kit to support easy UI development for Vue.",
   "license": "UNLICENSED",
   "main": "lib/index.js",

packages/vue-library/src/components.ts

@@ -1016,6 +1016,7 @@ export const DyteParticipantsAudio = /*@__PURE__*/ defineContainer<JSX.DyteParti
   'meeting',
   'iconPack',
   't',
+  'preloadedAudioElem',
   'dialogClose'
 ]);