@stream-io/video-react-sdk 0.0.44 → 0.0.45

package/CHANGELOG.md

@@ -2,6 +2,13 @@
 
 This file was generated using [@jscutlery/semver](https://github.com/jscutlery/semver).
 
+### [0.0.45](https://github.com/GetStream/stream-video-js/compare/@stream-io/video-react-sdk-0.0.44...@stream-io/video-react-sdk-0.0.45) (2023-06-21)
+
+
+### Features
+
+* **react sdk:** prefer URL credentials in audio rooms demo app ([#678](https://github.com/GetStream/stream-video-js/issues/678)) ([f9ac52f](https://github.com/GetStream/stream-video-js/commit/f9ac52ff5afa10e6a10e97177dd2fb7e8a4c2e48))
+
 ### [0.0.44](https://github.com/GetStream/stream-video-js/compare/@stream-io/video-react-sdk-0.0.43...@stream-io/video-react-sdk-0.0.44) (2023-06-21)
 
 

package/dist/src/components/Avatar/Avatar.d.ts

@@ -1,14 +1,15 @@
-import { CSSProperties } from 'react';
+import { ComponentProps, CSSProperties } from 'react';
 export type AvatarData = {
     imageSrc?: string;
     name?: string;
     style?: CSSProperties & Record<string, string | number>;
 };
-export type AvatarProps = AvatarData;
-export declare const Avatar: ({ imageSrc, name, style }: AvatarProps) => JSX.Element;
+export type AvatarProps = AvatarData & ComponentProps<'img'>;
+export declare const Avatar: ({ imageSrc, name, style, className, ...rest }: AvatarProps) => JSX.Element;
 type AvatarFallbackProps = {
     names: string[];
+    className?: string;
     style?: CSSProperties & Record<string, string | number>;
 };
-export declare const AvatarFallback: ({ names, style }: AvatarFallbackProps) => JSX.Element;
+export declare const AvatarFallback: ({ className, names, style, }: AvatarFallbackProps) => JSX.Element;
 export {};

package/dist/src/components/Avatar/Avatar.js

@@ -1,11 +1,24 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState } from 'react';
-export const Avatar = ({ imageSrc, name, style }) => {
+import clsx from 'clsx';
+export const Avatar = (_a) => {
+    var { imageSrc, name, style, className } = _a, rest = __rest(_a, ["imageSrc", "name", "style", "className"]);
     const [error, setError] = useState(false);
-    return (_jsxs(_Fragment, { children: [(!imageSrc || error) && name && (_jsx(AvatarFallback, { style: style, names: [name] })), imageSrc && !error && (_jsx("img", { onError: () => setError(true), alt: "avatar", className: "str-video__avatar", src: imageSrc, style: style }))] }));
+    return (_jsxs(_Fragment, { children: [(!imageSrc || error) && name && (_jsx(AvatarFallback, { className: className, style: style, names: [name] })), imageSrc && !error && (_jsx("img", Object.assign({ onError: () => setError(true), alt: "avatar", className: clsx('str-video__avatar', className), src: imageSrc, style: style }, rest)))] }));
 };
-export const AvatarFallback = ({ names, style }) => {
+export const AvatarFallback = ({ className, names, style, }) => {
     var _a;
-    return (_jsx("div", Object.assign({ className: "str-video__avatar--initials-fallback", style: style }, { children: _jsxs("div", { children: [names[0][0], (_a = names[1]) === null || _a === void 0 ? void 0 : _a[0]] }) })));
+    return (_jsx("div", Object.assign({ className: clsx('str-video__avatar--initials-fallback', className), style: style }, { children: _jsxs("div", { children: [names[0][0], (_a = names[1]) === null || _a === void 0 ? void 0 : _a[0]] }) })));
 };
 //# sourceMappingURL=Avatar.js.map

package/dist/src/components/Avatar/Avatar.js.map

@@ -1 +1 @@
-{"version":3,"file":"Avatar.js","sourceRoot":"","sources":["../../../../src/components/Avatar/Avatar.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAiB,QAAQ,EAAE,MAAM,OAAO,CAAC;AAUhD,MAAM,CAAC,MAAM,MAAM,GAAG,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,KAAK,EAAe,EAAE,EAAE;IAC/D,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAE1C,OAAO,CACL,8BACG,CAAC,CAAC,QAAQ,IAAI,KAAK,CAAC,IAAI,IAAI,IAAI,CAC/B,KAAC,cAAc,IAAC,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC,IAAI,CAAC,GAAI,CAChD,EACA,QAAQ,IAAI,CAAC,KAAK,IAAI,CACrB,cACE,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,EAC7B,GAAG,EAAC,QAAQ,EACZ,SAAS,EAAC,mBAAmB,EAC7B,GAAG,EAAE,QAAQ,EACb,KAAK,EAAE,KAAK,GACZ,CACH,IACA,CACJ,CAAC;AACJ,CAAC,CAAC;AAMF,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,EAAE,KAAK,EAAE,KAAK,EAAuB,EAAE,EAAE;;IACtE,OAAO,CACL,4BAAK,SAAS,EAAC,sCAAsC,EAAC,KAAK,EAAE,KAAK,gBAChE,0BACG,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EACX,MAAA,KAAK,CAAC,CAAC,CAAC,0CAAG,CAAC,CAAC,IACV,IACF,CACP,CAAC;AACJ,CAAC,CAAC"}
+{"version":3,"file":"Avatar.js","sourceRoot":"","sources":["../../../../src/components/Avatar/Avatar.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA,OAAO,EAAiC,QAAQ,EAAE,MAAM,OAAO,CAAC;AAChE,OAAO,IAAI,MAAM,MAAM,CAAC;AAUxB,MAAM,CAAC,MAAM,MAAM,GAAG,CAAC,EAMT,EAAE,EAAE;QANK,EACrB,QAAQ,EACR,IAAI,EACJ,KAAK,EACL,SAAS,OAEG,EADT,IAAI,cALc,0CAMtB,CADQ;IAEP,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAE1C,OAAO,CACL,8BACG,CAAC,CAAC,QAAQ,IAAI,KAAK,CAAC,IAAI,IAAI,IAAI,CAC/B,KAAC,cAAc,IAAC,SAAS,EAAE,SAAS,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC,IAAI,CAAC,GAAI,CACtE,EACA,QAAQ,IAAI,CAAC,KAAK,IAAI,CACrB,4BACE,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,EAC7B,GAAG,EAAC,QAAQ,EACZ,SAAS,EAAE,IAAI,CAAC,mBAAmB,EAAE,SAAS,CAAC,EAC/C,GAAG,EAAE,QAAQ,EACb,KAAK,EAAE,KAAK,IACR,IAAI,EACR,CACH,IACA,CACJ,CAAC;AACJ,CAAC,CAAC;AAOF,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,EAC7B,SAAS,EACT,KAAK,EACL,KAAK,GACe,EAAE,EAAE;;IACxB,OAAO,CACL,4BACE,SAAS,EAAE,IAAI,CAAC,sCAAsC,EAAE,SAAS,CAAC,EAClE,KAAK,EAAE,KAAK,gBAEZ,0BACG,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EACX,MAAA,KAAK,CAAC,CAAC,CAAC,0CAAG,CAAC,CAAC,IACV,IACF,CACP,CAAC;AACJ,CAAC,CAAC"}

package/package.json

@@ -45,5 +45,5 @@
     "rimraf": "^3.0.2",
     "typescript": "^4.9.5"
   },
-  "version": "0.0.44"
+  "version": "0.0.45"
 }

package/src/components/Avatar/Avatar.tsx

@@ -1,4 +1,5 @@
-import { CSSProperties, useState } from 'react';
+import { ComponentProps, CSSProperties, useState } from 'react';
+import clsx from 'clsx';
 
 export type AvatarData = {
   imageSrc?: string;
@@ -6,23 +7,30 @@ export type AvatarData = {
   style?: CSSProperties & Record<string, string | number>;
 };
 
-export type AvatarProps = AvatarData;
+export type AvatarProps = AvatarData & ComponentProps<'img'>;
 
-export const Avatar = ({ imageSrc, name, style }: AvatarProps) => {
+export const Avatar = ({
+  imageSrc,
+  name,
+  style,
+  className,
+  ...rest
+}: AvatarProps) => {
   const [error, setError] = useState(false);
 
   return (
     <>
       {(!imageSrc || error) && name && (
-        <AvatarFallback style={style} names={[name]} />
+        <AvatarFallback className={className} style={style} names={[name]} />
       )}
       {imageSrc && !error && (
         <img
           onError={() => setError(true)}
           alt="avatar"
-          className="str-video__avatar"
+          className={clsx('str-video__avatar', className)}
           src={imageSrc}
           style={style}
+          {...rest}
         />
       )}
     </>
@@ -31,11 +39,19 @@ export const Avatar = ({ imageSrc, name, style }: AvatarProps) => {
 
 type AvatarFallbackProps = {
   names: string[];
+  className?: string;
   style?: CSSProperties & Record<string, string | number>;
 };
-export const AvatarFallback = ({ names, style }: AvatarFallbackProps) => {
+export const AvatarFallback = ({
+  className,
+  names,
+  style,
+}: AvatarFallbackProps) => {
   return (
-    <div className="str-video__avatar--initials-fallback" style={style}>
+    <div
+      className={clsx('str-video__avatar--initials-fallback', className)}
+      style={style}
+    >
       <div>
         {names[0][0]}
         {names[1]?.[0]}