stream-chat-react 14.12.0 → 15.0.0-rc.1

package/dist/es/components/Attachment/utils.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"utils.mjs","names":[],"sources":["../../../../src/components/Attachment/utils.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport type { Attachment, SharedLocationResponse } from 'stream-chat';\nimport type { ATTACHMENT_GROUPS_ORDER, AttachmentProps } from './Attachment';\nimport * as linkify from 'linkifyjs';\n\nexport const SUPPORTED_VIDEO_FORMATS = [\n  'video/mp4',\n  'video/ogg',\n  'video/webm',\n  'video/quicktime',\n];\n\nexport type AttachmentComponentType =\n  | 'card'\n  | 'gallery'\n  | 'giphy'\n  | 'image'\n  | 'media'\n  | 'audio'\n  | 'voiceRecording'\n  | 'file'\n  | 'geolocation'\n  | 'unsupported';\n\nexport type AttachmentContainerType = (typeof ATTACHMENT_GROUPS_ORDER)[number];\n\nexport type GroupedRenderedAttachment = Record<AttachmentContainerType, ReactNode[]>;\n\nexport type GalleryAttachment = {\n  items: Attachment[];\n  type: 'gallery';\n};\n\nexport type RenderAttachmentProps = Omit<AttachmentProps, 'attachments'> & {\n  attachment: Attachment;\n};\n\nexport type RenderGalleryProps = Omit<AttachmentProps, 'attachments'> & {\n  attachment: GalleryAttachment;\n};\n\nexport type RenderMediaProps = Omit<AttachmentProps, 'attachments'> & {\n  attachments: Attachment[];\n};\n\nexport type GeolocationContainerProps = Omit<AttachmentProps, 'attachments'> & {\n  location: SharedLocationResponse;\n};\n\n// This identity function determines attachment type specific to React.\n// Once made sure other SDKs support the same logic, move to stream-chat-js\nexport const isGalleryAttachmentType = (\n  attachment: Attachment | GalleryAttachment,\n): attachment is GalleryAttachment =>\n  Array.isArray((attachment as GalleryAttachment).items);\n\nexport const isSvgAttachment = (attachment: Attachment) => {\n  const filename = attachment.fallback || '';\n  return filename.toLowerCase().endsWith('.svg');\n};\n\nexport const divMod = (num: number, divisor: number) => [\n  Math.floor(num / divisor),\n  num % divisor,\n];\n\nexport const displayDuration = (totalSeconds?: number) => {\n  if (!totalSeconds || totalSeconds < 0) return '00:00';\n\n  const [hours, hoursLeftover] = divMod(totalSeconds, 3600);\n  const [minutes, seconds] = divMod(hoursLeftover, 60);\n  const roundedSeconds = Math.ceil(seconds);\n  const prependHrsZero = String(hours).padStart(2, '0');\n  const prependMinZero = String(minutes).padStart(2, '0');\n  const prependSecZero = String(roundedSeconds).padStart(2, '0');\n  const minSec = `${prependMinZero}:${prependSecZero}`;\n\n  return hours ? `${prependHrsZero}:` + minSec : minSec;\n};\nexport function getCssDimensionsVariables(url: string) {\n  const cssVars = {\n    '--original-height': 1000000,\n    '--original-width': 1000000,\n  } as Record<string, number>;\n\n  if (linkify.test(url, 'url')) {\n    const urlParams = new URL(url).searchParams;\n    const oh = Number(urlParams.get('oh'));\n    const ow = Number(urlParams.get('ow'));\n    const originalHeight = oh > 1 ? oh : 1000000;\n    const originalWidth = ow > 1 ? ow : 1000000;\n    cssVars['--original-width'] = originalWidth;\n    cssVars['--original-height'] = originalHeight;\n  }\n\n  return cssVars;\n}\n"],"mappings":";;AAKA,IAAa,0BAA0B;CACrC;CACA;CACA;CACA;AACF;AAyCA,IAAa,2BACX,eAEA,MAAM,QAAS,WAAiC,KAAK;AAEvD,IAAa,mBAAmB,eAA2B;CAEzD,QADiB,WAAW,YAAY,GAAA,CACxB,YAAY,CAAC,CAAC,SAAS,MAAM;AAC/C;AAEA,IAAa,UAAU,KAAa,YAAoB,CACtD,KAAK,MAAM,MAAM,OAAO,GACxB,MAAM,OACR;AAEA,IAAa,mBAAmB,iBAA0B;CACxD,IAAI,CAAC,gBAAgB,eAAe,GAAG,OAAO;CAE9C,MAAM,CAAC,OAAO,iBAAiB,OAAO,cAAc,IAAI;CACxD,MAAM,CAAC,SAAS,WAAW,OAAO,eAAe,EAAE;CACnD,MAAM,iBAAiB,KAAK,KAAK,OAAO;CACxC,MAAM,iBAAiB,OAAO,KAAK,CAAC,CAAC,SAAS,GAAG,GAAG;CAGpD,MAAM,SAAS,GAFQ,OAAO,OAAO,CAAC,CAAC,SAAS,GAAG,GAEjC,EAAe,GADV,OAAO,cAAc,CAAC,CAAC,SAAS,GAAG,GACtB;CAEpC,OAAO,QAAQ,GAAG,eAAe,KAAK,SAAS;AACjD;AACA,SAAgB,0BAA0B,KAAa;CACrD,MAAM,UAAU;EACd,qBAAqB;EACrB,oBAAoB;CACtB;CAEA,IAAI,QAAQ,KAAK,KAAK,KAAK,GAAG;EAC5B,MAAM,YAAY,IAAI,IAAI,GAAG,CAAC,CAAC;EAC/B,MAAM,KAAK,OAAO,UAAU,IAAI,IAAI,CAAC;EACrC,MAAM,KAAK,OAAO,UAAU,IAAI,IAAI,CAAC;EACrC,MAAM,iBAAiB,KAAK,IAAI,KAAK;EAErC,QAAQ,sBADc,KAAK,IAAI,KAAK;EAEpC,QAAQ,uBAAuB;CACjC;CAEA,OAAO;AACT"}
+{"version":3,"file":"utils.mjs","names":[],"sources":["../../../../src/components/Attachment/utils.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport type { Attachment, SharedLocationResponseData } from 'stream-chat';\nimport type { ATTACHMENT_GROUPS_ORDER, AttachmentProps } from './Attachment';\nimport * as linkify from 'linkifyjs';\n\nexport const SUPPORTED_VIDEO_FORMATS = [\n  'video/mp4',\n  'video/ogg',\n  'video/webm',\n  'video/quicktime',\n];\n\nexport type AttachmentComponentType =\n  | 'card'\n  | 'gallery'\n  | 'giphy'\n  | 'image'\n  | 'media'\n  | 'audio'\n  | 'voiceRecording'\n  | 'file'\n  | 'geolocation'\n  | 'unsupported';\n\nexport type AttachmentContainerType = (typeof ATTACHMENT_GROUPS_ORDER)[number];\n\nexport type GroupedRenderedAttachment = Record<AttachmentContainerType, ReactNode[]>;\n\nexport type GalleryAttachment = {\n  items: Attachment[];\n  type: 'gallery';\n};\n\nexport type RenderAttachmentProps = Omit<AttachmentProps, 'attachments'> & {\n  attachment: Attachment;\n};\n\nexport type RenderGalleryProps = Omit<AttachmentProps, 'attachments'> & {\n  attachment: GalleryAttachment;\n};\n\nexport type RenderMediaProps = Omit<AttachmentProps, 'attachments'> & {\n  attachments: Attachment[];\n};\n\nexport type GeolocationContainerProps = Omit<AttachmentProps, 'attachments'> & {\n  location: SharedLocationResponseData;\n};\n\n// This identity function determines attachment type specific to React.\n// Once made sure other SDKs support the same logic, move to stream-chat-js\nexport const isGalleryAttachmentType = (\n  attachment: Attachment | GalleryAttachment,\n): attachment is GalleryAttachment =>\n  Array.isArray((attachment as GalleryAttachment).items);\n\nexport const isSvgAttachment = (attachment: Attachment) => {\n  const filename = attachment.fallback || '';\n  return filename.toLowerCase().endsWith('.svg');\n};\n\nexport const divMod = (num: number, divisor: number) => [\n  Math.floor(num / divisor),\n  num % divisor,\n];\n\nexport const displayDuration = (totalSeconds?: number) => {\n  if (!totalSeconds || totalSeconds < 0) return '00:00';\n\n  const [hours, hoursLeftover] = divMod(totalSeconds, 3600);\n  const [minutes, seconds] = divMod(hoursLeftover, 60);\n  const roundedSeconds = Math.ceil(seconds);\n  const prependHrsZero = String(hours).padStart(2, '0');\n  const prependMinZero = String(minutes).padStart(2, '0');\n  const prependSecZero = String(roundedSeconds).padStart(2, '0');\n  const minSec = `${prependMinZero}:${prependSecZero}`;\n\n  return hours ? `${prependHrsZero}:` + minSec : minSec;\n};\nexport function getCssDimensionsVariables(url: string) {\n  const cssVars = {\n    '--original-height': 1000000,\n    '--original-width': 1000000,\n  } as Record<string, number>;\n\n  if (linkify.test(url, 'url')) {\n    const urlParams = new URL(url).searchParams;\n    const oh = Number(urlParams.get('oh'));\n    const ow = Number(urlParams.get('ow'));\n    const originalHeight = oh > 1 ? oh : 1000000;\n    const originalWidth = ow > 1 ? ow : 1000000;\n    cssVars['--original-width'] = originalWidth;\n    cssVars['--original-height'] = originalHeight;\n  }\n\n  return cssVars;\n}\n"],"mappings":";;AAKA,IAAa,0BAA0B;CACrC;CACA;CACA;CACA;AACF;AAyCA,IAAa,2BACX,eAEA,MAAM,QAAS,WAAiC,KAAK;AAEvD,IAAa,mBAAmB,eAA2B;CAEzD,QADiB,WAAW,YAAY,GAAA,CACxB,YAAY,CAAC,CAAC,SAAS,MAAM;AAC/C;AAEA,IAAa,UAAU,KAAa,YAAoB,CACtD,KAAK,MAAM,MAAM,OAAO,GACxB,MAAM,OACR;AAEA,IAAa,mBAAmB,iBAA0B;CACxD,IAAI,CAAC,gBAAgB,eAAe,GAAG,OAAO;CAE9C,MAAM,CAAC,OAAO,iBAAiB,OAAO,cAAc,IAAI;CACxD,MAAM,CAAC,SAAS,WAAW,OAAO,eAAe,EAAE;CACnD,MAAM,iBAAiB,KAAK,KAAK,OAAO;CACxC,MAAM,iBAAiB,OAAO,KAAK,CAAC,CAAC,SAAS,GAAG,GAAG;CAGpD,MAAM,SAAS,GAFQ,OAAO,OAAO,CAAC,CAAC,SAAS,GAAG,GAEjC,EAAe,GADV,OAAO,cAAc,CAAC,CAAC,SAAS,GAAG,GACtB;CAEpC,OAAO,QAAQ,GAAG,eAAe,KAAK,SAAS;AACjD;AACA,SAAgB,0BAA0B,KAAa;CACrD,MAAM,UAAU;EACd,qBAAqB;EACrB,oBAAoB;CACtB;CAEA,IAAI,QAAQ,KAAK,KAAK,KAAK,GAAG;EAC5B,MAAM,YAAY,IAAI,IAAI,GAAG,CAAC,CAAC;EAC/B,MAAM,KAAK,OAAO,UAAU,IAAI,IAAI,CAAC;EACrC,MAAM,KAAK,OAAO,UAAU,IAAI,IAAI,CAAC;EACrC,MAAM,iBAAiB,KAAK,IAAI,KAAK;EAErC,QAAQ,sBADc,KAAK,IAAI,KAAK;EAEpC,QAAQ,uBAAuB;CACjC;CAEA,OAAO;AACT"}

package/dist/es/components/AudioPlayback/AudioPlaybackArbiter.mjs

@@ -0,0 +1,57 @@
+import { StateStore } from "@stream-io/state-store";
+//#region src/components/AudioPlayback/AudioPlaybackArbiter.ts
+/**
+* Decides who is allowed to play, across every {@link AudioPlayerPool} that shares it.
+*
+* It owns the single `Audio` element and hands ownership between players: starting one pauses
+* whoever held the element. Exclusivity has to live here rather than in the pool because a pool is
+* scoped to a surface -- `Channel` and `Thread` each mount their own -- and two voice messages
+* playing over each other is exactly what happens when each surface arbitrates for itself.
+*
+* Reusing one element is also what keeps playback working on iOS, where an element must be unlocked
+* by a user gesture before it can be played programmatically.
+*/
+var AudioPlaybackArbiter = class {
+	state = new StateStore({ activeAudioPlayer: null });
+	element = null;
+	owner = null;
+	get activeAudioPlayer() {
+		return this.state.getLatestValue().activeAudioPlayer;
+	}
+	/**
+	* Hands the shared element to `owner`, pausing the previous holder, and loads `src` into it.
+	*/
+	acquire = ({ owner, src }) => {
+		if (!this.element) this.element = new Audio();
+		if (this.owner && this.owner !== owner) {
+			this.owner.pause();
+			this.owner.releaseElementForHandoff();
+		}
+		this.owner = owner;
+		if (this.element.src !== src) this.element.src = src;
+		return this.element;
+	};
+	/**
+	* Drops `owner`'s claim on the shared element and pauses it. A release from anyone who is not the
+	* current holder is ignored, so a player torn down in the background cannot stop the one that has
+	* since taken over.
+	*/
+	release = (owner) => {
+		if (this.owner !== owner) return;
+		if (this.element) {
+			try {
+				this.element.pause();
+			} catch {}
+			this.element.removeAttribute("src");
+			this.element.load();
+		}
+		this.owner = null;
+	};
+	setActivePlayer = (activeAudioPlayer) => {
+		this.state.partialNext({ activeAudioPlayer });
+	};
+};
+//#endregion
+export { AudioPlaybackArbiter };
+
+//# sourceMappingURL=AudioPlaybackArbiter.mjs.map

package/dist/es/components/AudioPlayback/AudioPlaybackArbiter.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"AudioPlaybackArbiter.mjs","names":[],"sources":["../../../../src/components/AudioPlayback/AudioPlaybackArbiter.ts"],"sourcesContent":["import { StateStore } from '@stream-io/state-store';\nimport type { AudioPlayer } from './AudioPlayer';\n\nexport type AudioPlaybackArbiterState = {\n  activeAudioPlayer: AudioPlayer | null;\n};\n\n/**\n * Decides who is allowed to play, across every {@link AudioPlayerPool} that shares it.\n *\n * It owns the single `Audio` element and hands ownership between players: starting one pauses\n * whoever held the element. Exclusivity has to live here rather than in the pool because a pool is\n * scoped to a surface -- `Channel` and `Thread` each mount their own -- and two voice messages\n * playing over each other is exactly what happens when each surface arbitrates for itself.\n *\n * Reusing one element is also what keeps playback working on iOS, where an element must be unlocked\n * by a user gesture before it can be played programmatically.\n */\nexport class AudioPlaybackArbiter {\n  state = new StateStore<AudioPlaybackArbiterState>({ activeAudioPlayer: null });\n\n  private element: HTMLAudioElement | null = null;\n  private owner: AudioPlayer | null = null;\n\n  get activeAudioPlayer() {\n    return this.state.getLatestValue().activeAudioPlayer;\n  }\n\n  /**\n   * Hands the shared element to `owner`, pausing the previous holder, and loads `src` into it.\n   */\n  acquire = ({ owner, src }: { owner: AudioPlayer; src: string }) => {\n    if (!this.element) {\n      this.element = new Audio();\n    }\n\n    if (this.owner && this.owner !== owner) {\n      // Pause and drop the reference, but leave the player registered in its own pool.\n      this.owner.pause();\n      this.owner.releaseElementForHandoff();\n    }\n    this.owner = owner;\n\n    if (this.element.src !== src) {\n      // setting src starts loading; avoid explicit load() to prevent currentTime reset flicker\n      this.element.src = src;\n    }\n    return this.element;\n  };\n\n  /**\n   * Drops `owner`'s claim on the shared element and pauses it. A release from anyone who is not the\n   * current holder is ignored, so a player torn down in the background cannot stop the one that has\n   * since taken over.\n   */\n  release = (owner: AudioPlayer) => {\n    if (this.owner !== owner) return;\n    if (this.element) {\n      try {\n        this.element.pause();\n      } catch {\n        // ignore\n      }\n      this.element.removeAttribute('src');\n      this.element.load();\n    }\n    // Keep the element instance for reuse\n    this.owner = null;\n  };\n\n  setActivePlayer = (activeAudioPlayer: AudioPlayer | null) => {\n    this.state.partialNext({ activeAudioPlayer });\n  };\n}\n"],"mappings":";;;;;;;;;;;;;AAkBA,IAAa,uBAAb,MAAkC;CAChC,QAAQ,IAAI,WAAsC,EAAE,mBAAmB,KAAK,CAAC;CAE7E,UAA2C;CAC3C,QAAoC;CAEpC,IAAI,oBAAoB;EACtB,OAAO,KAAK,MAAM,eAAe,CAAC,CAAC;CACrC;;;;CAKA,WAAW,EAAE,OAAO,UAA+C;EACjE,IAAI,CAAC,KAAK,SACR,KAAK,UAAU,IAAI,MAAM;EAG3B,IAAI,KAAK,SAAS,KAAK,UAAU,OAAO;GAEtC,KAAK,MAAM,MAAM;GACjB,KAAK,MAAM,yBAAyB;EACtC;EACA,KAAK,QAAQ;EAEb,IAAI,KAAK,QAAQ,QAAQ,KAEvB,KAAK,QAAQ,MAAM;EAErB,OAAO,KAAK;CACd;;;;;;CAOA,WAAW,UAAuB;EAChC,IAAI,KAAK,UAAU,OAAO;EAC1B,IAAI,KAAK,SAAS;GAChB,IAAI;IACF,KAAK,QAAQ,MAAM;GACrB,QAAQ,CAER;GACA,KAAK,QAAQ,gBAAgB,KAAK;GAClC,KAAK,QAAQ,KAAK;EACpB;EAEA,KAAK,QAAQ;CACf;CAEA,mBAAmB,sBAA0C;EAC3D,KAAK,MAAM,YAAY,EAAE,kBAAkB,CAAC;CAC9C;AACF"}