@stream-io/video-react-sdk 1.43.2 → 2.0.0-beta.1

package/src/utilities/filter.test.ts

@@ -1,4 +1,4 @@
-import { test, type TestContext } from 'node:test';
+import { describe, expect, it } from 'vitest';
 import { applyFilter } from './filter';
 
 const obj = {
@@ -7,133 +7,141 @@ const obj = {
   array: ['apples', 'bananas'],
 };
 
-test('checks single $eq condition', (t: TestContext) => {
-  t.assert.ok(applyFilter(obj, { num: { $eq: 42 } }));
-  t.assert.ok(!applyFilter(obj, { num: { $eq: 43 } }));
-});
-
-test('checks single $neq condition', (t: TestContext) => {
-  t.assert.ok(applyFilter(obj, { num: { $neq: 43 } }));
-  t.assert.ok(!applyFilter(obj, { num: { $neq: 42 } }));
-});
-
-test('checks single $gt condition', (t: TestContext) => {
-  t.assert.ok(applyFilter(obj, { num: { $gt: 41 } }));
-  t.assert.ok(!applyFilter(obj, { num: { $gt: 42 } }));
-});
-
-test('checks single $gte condition', (t: TestContext) => {
-  t.assert.ok(applyFilter(obj, { num: { $gte: 42 } }));
-  t.assert.ok(!applyFilter(obj, { num: { $gte: 43 } }));
-});
-
-test('checks single $lt condition', (t: TestContext) => {
-  t.assert.ok(applyFilter(obj, { num: { $lt: 43 } }));
-  t.assert.ok(!applyFilter(obj, { num: { $lt: 42 } }));
-});
-
-test('checks single $lte condition', (t: TestContext) => {
-  t.assert.ok(applyFilter(obj, { num: { $lte: 42 } }));
-  t.assert.ok(!applyFilter(obj, { num: { $lte: 41 } }));
-});
-
-test('checks single $in condition', (t: TestContext) => {
-  t.assert.ok(applyFilter(obj, { num: { $in: [41, 42, 43] } }));
-  t.assert.ok(!applyFilter(obj, { num: { $in: [1, 2, 3] } }));
-});
-
-test('checks single $contains condition', (t: TestContext) => {
-  t.assert.ok(applyFilter(obj, { array: { $contains: 'apples' } }));
-  t.assert.ok(!applyFilter(obj, { array: { $contains: 'cherries' } }));
-});
-
-test('fails $contains condition if value is not array', (t: TestContext) => {
-  // This case is not permitted by types, but can still happen in runtime
-  t.assert.ok(!applyFilter(obj as any, { str: { $contains: 'apples' } }));
-});
-
-test('conditions without operator are treated as $eq', (t: TestContext) => {
-  t.assert.ok(applyFilter(obj, { num: 42 }));
-  t.assert.ok(!applyFilter(obj, { num: 43 }));
-});
-
-test('checks multiple conditions', (t: TestContext) => {
-  t.assert.ok(applyFilter(obj, { num: 42, array: { $contains: 'bananas' } }));
-  t.assert.ok(!applyFilter(obj, { num: 42, array: { $contains: 'cherries' } }));
-});
-
-test('applies $and filter', (t: TestContext) => {
-  t.assert.ok(
-    applyFilter(obj, {
-      $and: [
-        { num: 42, array: { $contains: 'bananas' } },
-        { str: 'hello, world', array: { $contains: 'apples' } },
-      ],
-    }),
-  );
-
-  t.assert.ok(
-    !applyFilter(obj, {
-      $and: [
-        { num: 42, array: { $contains: 'bananas' } },
-        { str: 'hello, world', array: { $contains: 'cherries' } },
-      ],
-    }),
-  );
-});
+describe('applyFilter', () => {
+  it('checks single $eq condition', () => {
+    expect(applyFilter(obj, { num: { $eq: 42 } })).toBe(true);
+    expect(applyFilter(obj, { num: { $eq: 43 } })).toBe(false);
+  });
+
+  it('checks single $neq condition', () => {
+    expect(applyFilter(obj, { num: { $neq: 43 } })).toBe(true);
+    expect(applyFilter(obj, { num: { $neq: 42 } })).toBe(false);
+  });
+
+  it('checks single $gt condition', () => {
+    expect(applyFilter(obj, { num: { $gt: 41 } })).toBe(true);
+    expect(applyFilter(obj, { num: { $gt: 42 } })).toBe(false);
+  });
+
+  it('checks single $gte condition', () => {
+    expect(applyFilter(obj, { num: { $gte: 42 } })).toBe(true);
+    expect(applyFilter(obj, { num: { $gte: 43 } })).toBe(false);
+  });
+
+  it('checks single $lt condition', () => {
+    expect(applyFilter(obj, { num: { $lt: 43 } })).toBe(true);
+    expect(applyFilter(obj, { num: { $lt: 42 } })).toBe(false);
+  });
+
+  it('checks single $lte condition', () => {
+    expect(applyFilter(obj, { num: { $lte: 42 } })).toBe(true);
+    expect(applyFilter(obj, { num: { $lte: 41 } })).toBe(false);
+  });
+
+  it('checks single $in condition', () => {
+    expect(applyFilter(obj, { num: { $in: [41, 42, 43] } })).toBe(true);
+    expect(applyFilter(obj, { num: { $in: [1, 2, 3] } })).toBe(false);
+  });
+
+  it('checks single $contains condition', () => {
+    expect(applyFilter(obj, { array: { $contains: 'apples' } })).toBe(true);
+    expect(applyFilter(obj, { array: { $contains: 'cherries' } })).toBe(false);
+  });
+
+  it('fails $contains condition if value is not array', () => {
+    // This case is not permitted by types, but can still happen in runtime
+    expect(applyFilter(obj as any, { str: { $contains: 'apples' } })).toBe(
+      false,
+    );
+  });
+
+  it('conditions without operator are treated as $eq', () => {
+    expect(applyFilter(obj, { num: 42 })).toBe(true);
+    expect(applyFilter(obj, { num: 43 })).toBe(false);
+  });
+
+  it('checks multiple conditions', () => {
+    expect(applyFilter(obj, { num: 42, array: { $contains: 'bananas' } })).toBe(
+      true,
+    );
+    expect(
+      applyFilter(obj, { num: 42, array: { $contains: 'cherries' } }),
+    ).toBe(false);
+  });
+
+  it('applies $and filter', () => {
+    expect(
+      applyFilter(obj, {
+        $and: [
+          { num: 42, array: { $contains: 'bananas' } },
+          { str: 'hello, world', array: { $contains: 'apples' } },
+        ],
+      }),
+    ).toBe(true);
 
-test('applies $or filter', (t: TestContext) => {
-  t.assert.ok(
-    applyFilter(obj, {
-      $or: [
-        { str: 'hello, world', array: { $contains: 'cherries' } },
-        { num: 42, array: { $contains: 'bananas' } },
-      ],
-    }),
-  );
-
-  t.assert.ok(
-    !applyFilter(obj, {
-      $or: [
-        { str: 'hello, world', array: { $contains: 'cherries' } },
-        { num: 43, array: { $contains: 'bananas' } },
-      ],
-    }),
-  );
-});
+    expect(
+      applyFilter(obj, {
+        $and: [
+          { num: 42, array: { $contains: 'bananas' } },
+          { str: 'hello, world', array: { $contains: 'cherries' } },
+        ],
+      }),
+    ).toBe(false);
+  });
 
-test('applies $not filter', (t: TestContext) => {
-  t.assert.ok(
-    applyFilter(obj, {
-      $not: { str: 'hello, world', array: { $contains: 'cherries' } },
-    }),
-  );
-});
+  it('applies $or filter', () => {
+    expect(
+      applyFilter(obj, {
+        $or: [
+          { str: 'hello, world', array: { $contains: 'cherries' } },
+          { num: 42, array: { $contains: 'bananas' } },
+        ],
+      }),
+    ).toBe(true);
 
-test('applies nested filters', (t: TestContext) => {
-  t.assert.ok(
-    applyFilter(obj, {
-      $or: [
-        { str: 'hello, world', array: { $contains: 'cherries' } },
-        { $and: [{ num: 42 }, { array: { $contains: 'bananas' } }] },
-      ],
-    }),
-  );
-
-  t.assert.ok(
-    applyFilter(obj, {
-      $not: {
+    expect(
+      applyFilter(obj, {
+        $or: [
+          { str: 'hello, world', array: { $contains: 'cherries' } },
+          { num: 43, array: { $contains: 'bananas' } },
+        ],
+      }),
+    ).toBe(false);
+  });
+
+  it('applies $not filter', () => {
+    expect(
+      applyFilter(obj, {
+        $not: { str: 'hello, world', array: { $contains: 'cherries' } },
+      }),
+    ).toBe(true);
+  });
+
+  it('applies nested filters', () => {
+    expect(
+      applyFilter(obj, {
         $or: [
           { str: 'hello, world', array: { $contains: 'cherries' } },
-          {
-            $and: [
-              { num: 42 },
-              { array: { $contains: 'bananas' } },
-              { str: 'bye, world' },
-            ],
-          },
+          { $and: [{ num: 42 }, { array: { $contains: 'bananas' } }] },
         ],
-      },
-    }),
-  );
+      }),
+    ).toBe(true);
+
+    expect(
+      applyFilter(obj, {
+        $not: {
+          $or: [
+            { str: 'hello, world', array: { $contains: 'cherries' } },
+            {
+              $and: [
+                { num: 42 },
+                { array: { $contains: 'bananas' } },
+                { str: 'bye, world' },
+              ],
+            },
+          ],
+        },
+      }),
+    ).toBe(true);
+  });
 });

package/src/utilities/normalizeString.test.ts

@@ -1,51 +1,53 @@
-import { test, type TestContext } from 'node:test';
+import { describe, expect, it } from 'vitest';
 import { normalizeString } from './normalizeString';
 
-test('removes acute accents', (t: TestContext) => {
-  t.assert.strictEqual(normalizeString('Éva'), 'eva');
-  t.assert.strictEqual(normalizeString('café'), 'cafe');
-  t.assert.strictEqual(normalizeString('résumé'), 'resume');
-});
-
-test('removes grave accents', (t: TestContext) => {
-  t.assert.strictEqual(normalizeString('à'), 'a');
-  t.assert.strictEqual(normalizeString('è'), 'e');
-  t.assert.strictEqual(normalizeString('Père'), 'pere');
-});
-
-test('removes circumflex accents', (t: TestContext) => {
-  t.assert.strictEqual(normalizeString('château'), 'chateau');
-  t.assert.strictEqual(normalizeString('forêt'), 'foret');
-});
-
-test('removes umlaut/diaeresis', (t: TestContext) => {
-  t.assert.strictEqual(normalizeString('Müller'), 'muller');
-  t.assert.strictEqual(normalizeString('naïve'), 'naive');
-  t.assert.strictEqual(normalizeString('Zoë'), 'zoe');
-});
-
-test('removes tilde', (t: TestContext) => {
-  t.assert.strictEqual(normalizeString('señor'), 'senor');
-  t.assert.strictEqual(normalizeString('São Paulo'), 'sao paulo');
-});
-
-test('removes cedilla', (t: TestContext) => {
-  t.assert.strictEqual(normalizeString('François'), 'francois');
-  t.assert.strictEqual(normalizeString('façade'), 'facade');
-});
-
-test('handles mixed diacritics', (t: TestContext) => {
-  t.assert.strictEqual(normalizeString('Éva Raposa'), 'eva raposa');
-  t.assert.strictEqual(normalizeString('Jürgen Müller'), 'jurgen muller');
-  t.assert.strictEqual(normalizeString('Crème brûlée'), 'creme brulee');
-});
-
-test('preserves non-accented characters', (t: TestContext) => {
-  t.assert.strictEqual(normalizeString('hello world'), 'hello world');
-  t.assert.strictEqual(normalizeString('test123'), 'test123');
-  t.assert.strictEqual(normalizeString('user@email.com'), 'user@email.com');
-});
-
-test('handles empty string', (t: TestContext) => {
-  t.assert.strictEqual(normalizeString(''), '');
+describe('normalizeString', () => {
+  it('removes acute accents', () => {
+    expect(normalizeString('Éva')).toBe('eva');
+    expect(normalizeString('café')).toBe('cafe');
+    expect(normalizeString('résumé')).toBe('resume');
+  });
+
+  it('removes grave accents', () => {
+    expect(normalizeString('à')).toBe('a');
+    expect(normalizeString('è')).toBe('e');
+    expect(normalizeString('Père')).toBe('pere');
+  });
+
+  it('removes circumflex accents', () => {
+    expect(normalizeString('château')).toBe('chateau');
+    expect(normalizeString('forêt')).toBe('foret');
+  });
+
+  it('removes umlaut/diaeresis', () => {
+    expect(normalizeString('Müller')).toBe('muller');
+    expect(normalizeString('naïve')).toBe('naive');
+    expect(normalizeString('Zoë')).toBe('zoe');
+  });
+
+  it('removes tilde', () => {
+    expect(normalizeString('señor')).toBe('senor');
+    expect(normalizeString('São Paulo')).toBe('sao paulo');
+  });
+
+  it('removes cedilla', () => {
+    expect(normalizeString('François')).toBe('francois');
+    expect(normalizeString('façade')).toBe('facade');
+  });
+
+  it('handles mixed diacritics', () => {
+    expect(normalizeString('Éva Raposa')).toBe('eva raposa');
+    expect(normalizeString('Jürgen Müller')).toBe('jurgen muller');
+    expect(normalizeString('Crème brûlée')).toBe('creme brulee');
+  });
+
+  it('preserves non-accented characters', () => {
+    expect(normalizeString('hello world')).toBe('hello world');
+    expect(normalizeString('test123')).toBe('test123');
+    expect(normalizeString('user@email.com')).toBe('user@email.com');
+  });
+
+  it('handles empty string', () => {
+    expect(normalizeString('')).toBe('');
+  });
 });

package/dist/embedded-CallStatsLatencyChart-CpL1M_s0.cjs.js

@@ -1,59 +0,0 @@
-'use strict';
-
-var jsxRuntime = require('react/jsx-runtime');
-var chart_js = require('chart.js');
-var reactChartjs2 = require('react-chartjs-2');
-var react = require('react');
-
-// NOTE: this is a side effect by definition, but this component is
-// isolated in a separate chunk, and it won't affect the rest of the app.
-// See CallStats.tsx for more details.
-chart_js.Chart.register(chart_js.CategoryScale, chart_js.LinearScale, chart_js.LineElement, chart_js.PointElement);
-const CallStatsLatencyChart = (props) => {
-    const { values } = props;
-    let max = 0;
-    const data = {
-        labels: values.map((point) => {
-            const date = new Date(point.x * 1000);
-            return `${date.getHours()}:${date.getMinutes()}`;
-        }),
-        datasets: [
-            {
-                data: values.map((point) => {
-                    const { y } = point;
-                    max = Math.max(max, y);
-                    return point;
-                }),
-                borderColor: '#00e2a1',
-                backgroundColor: '#00e2a1',
-            },
-        ],
-    };
-    const options = react.useMemo(() => getLineOptions(max), [max]);
-    return (jsxRuntime.jsx("div", { className: "str-video__call-stats-line-chart-container", children: jsxRuntime.jsx(reactChartjs2.Line, { options: options, data: data, className: "str-video__call-stats__latencychart" }) }));
-};
-const getLineOptions = (max) => ({
-    maintainAspectRatio: false,
-    animation: { duration: 0 },
-    elements: {
-        line: { borderWidth: 1 },
-        point: { radius: 2 },
-    },
-    scales: {
-        y: {
-            position: 'right',
-            stacked: true,
-            min: 0,
-            max: Math.max(180, Math.ceil((max + 10) / 10) * 10),
-            grid: { display: true, color: '#979ca0' },
-            ticks: { stepSize: 30 },
-        },
-        x: {
-            grid: { display: false },
-            ticks: { display: false },
-        },
-    },
-});
-
-exports.default = CallStatsLatencyChart;
-//# sourceMappingURL=embedded-CallStatsLatencyChart-CpL1M_s0.cjs.js.map

package/dist/embedded-CallStatsLatencyChart-CpL1M_s0.cjs.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"embedded-CallStatsLatencyChart-CpL1M_s0.cjs.js","sources":["../../src/components/CallStats/CallStatsLatencyChart.tsx"],"sourcesContent":["import {\n  CategoryScale,\n  Chart as ChartJS,\n  ChartData,\n  ChartOptions,\n  LinearScale,\n  LineElement,\n  PointElement,\n} from 'chart.js';\nimport { Line } from 'react-chartjs-2';\nimport { useMemo } from 'react';\n\n// NOTE: this is a side effect by definition, but this component is\n// isolated in a separate chunk, and it won't affect the rest of the app.\n// See CallStats.tsx for more details.\nChartJS.register(CategoryScale, LinearScale, LineElement, PointElement);\n\nconst CallStatsLatencyChart = (props: {\n  values: Array<{ x: number; y: number }>;\n}) => {\n  const { values } = props;\n  let max = 0;\n  const data: ChartData<'line'> = {\n    labels: values.map((point) => {\n      const date = new Date(point.x * 1000);\n      return `${date.getHours()}:${date.getMinutes()}`;\n    }),\n    datasets: [\n      {\n        data: values.map((point) => {\n          const { y } = point;\n          max = Math.max(max, y);\n          return point;\n        }),\n        borderColor: '#00e2a1',\n        backgroundColor: '#00e2a1',\n      },\n    ],\n  };\n\n  const options = useMemo(() => getLineOptions(max), [max]);\n  return (\n    <div className=\"str-video__call-stats-line-chart-container\">\n      <Line\n        options={options}\n        data={data}\n        className=\"str-video__call-stats__latencychart\"\n      />\n    </div>\n  );\n};\n\nexport default CallStatsLatencyChart;\n\nconst getLineOptions = (max: number): ChartOptions<'line'> => ({\n  maintainAspectRatio: false,\n  animation: { duration: 0 },\n  elements: {\n    line: { borderWidth: 1 },\n    point: { radius: 2 },\n  },\n  scales: {\n    y: {\n      position: 'right',\n      stacked: true,\n      min: 0,\n      max: Math.max(180, Math.ceil((max + 10) / 10) * 10),\n      grid: { display: true, color: '#979ca0' },\n      ticks: { stepSize: 30 },\n    },\n    x: {\n      grid: { display: false },\n      ticks: { display: false },\n    },\n  },\n});\n"],"names":["ChartJS","CategoryScale","LinearScale","LineElement","PointElement","useMemo","_jsx","Line"],"mappings":";;;;;;;AAYA;AACA;AACA;AACAA,cAAO,CAAC,QAAQ,CAACC,sBAAa,EAAEC,oBAAW,EAAEC,oBAAW,EAAEC,qBAAY,CAAC;AAEvE,MAAM,qBAAqB,GAAG,CAAC,KAE9B,KAAI;AACH,IAAA,MAAM,EAAE,MAAM,EAAE,GAAG,KAAK;IACxB,IAAI,GAAG,GAAG,CAAC;AACX,IAAA,MAAM,IAAI,GAAsB;QAC9B,MAAM,EAAE,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,KAAI;YAC3B,MAAM,IAAI,GAAG,IAAI,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,IAAI,CAAC;YACrC,OAAO,CAAA,EAAG,IAAI,CAAC,QAAQ,EAAE,CAAA,CAAA,EAAI,IAAI,CAAC,UAAU,EAAE,CAAA,CAAE;AAClD,QAAA,CAAC,CAAC;AACF,QAAA,QAAQ,EAAE;AACR,YAAA;gBACE,IAAI,EAAE,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,KAAI;AACzB,oBAAA,MAAM,EAAE,CAAC,EAAE,GAAG,KAAK;oBACnB,GAAG,GAAG,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE,CAAC,CAAC;AACtB,oBAAA,OAAO,KAAK;AACd,gBAAA,CAAC,CAAC;AACF,gBAAA,WAAW,EAAE,SAAS;AACtB,gBAAA,eAAe,EAAE,SAAS;AAC3B,aAAA;AACF,SAAA;KACF;AAED,IAAA,MAAM,OAAO,GAAGC,aAAO,CAAC,MAAM,cAAc,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC;IACzD,QACEC,wBAAK,SAAS,EAAC,4CAA4C,EAAA,QAAA,EACzDA,cAAA,CAACC,kBAAI,EAAA,EACH,OAAO,EAAE,OAAO,EAChB,IAAI,EAAE,IAAI,EACV,SAAS,EAAC,qCAAqC,EAAA,CAC/C,EAAA,CACE;AAEV;AAIA,MAAM,cAAc,GAAG,CAAC,GAAW,MAA4B;AAC7D,IAAA,mBAAmB,EAAE,KAAK;AAC1B,IAAA,SAAS,EAAE,EAAE,QAAQ,EAAE,CAAC,EAAE;AAC1B,IAAA,QAAQ,EAAE;AACR,QAAA,IAAI,EAAE,EAAE,WAAW,EAAE,CAAC,EAAE;AACxB,QAAA,KAAK,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE;AACrB,KAAA;AACD,IAAA,MAAM,EAAE;AACN,QAAA,CAAC,EAAE;AACD,YAAA,QAAQ,EAAE,OAAO;AACjB,YAAA,OAAO,EAAE,IAAI;AACb,YAAA,GAAG,EAAE,CAAC;YACN,GAAG,EAAE,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC,GAAG,GAAG,EAAE,IAAI,EAAE,CAAC,GAAG,EAAE,CAAC;YACnD,IAAI,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,SAAS,EAAE;AACzC,YAAA,KAAK,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE;AACxB,SAAA;AACD,QAAA,CAAC,EAAE;AACD,YAAA,IAAI,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE;AACxB,YAAA,KAAK,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE;AAC1B,SAAA;AACF,KAAA;AACF,CAAA,CAAC;;;;"}

package/dist/esm/src/components/Button/TextButton.js

@@ -1,8 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-
-const TextButton = ({ children, ...rest }) => {
-    return (jsx("button", { ...rest, className: "str-video__text-button", children: children }));
-};
-
-export { TextButton };
-//# sourceMappingURL=TextButton.js.map

package/dist/esm/src/components/Button/TextButton.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"TextButton.js","sources":["../../../../../../../src/components/Button/TextButton.tsx"],"sourcesContent":["import { ComponentProps } from 'react';\n\nexport const TextButton = ({\n  children,\n  ...rest\n}: Omit<ComponentProps<'button'>, 'ref' | 'className'>) => {\n  return (\n    <button {...rest} className=\"str-video__text-button\">\n      {children}\n    </button>\n  );\n};\n"],"names":["_jsx"],"mappings":";;AAEO,MAAM,UAAU,GAAG,CAAC,EACzB,QAAQ,EACR,GAAG,IAAI,EAC6C,KAAI;IACxD,QACEA,GAAA,CAAA,QAAA,EAAA,EAAA,GAAY,IAAI,EAAE,SAAS,EAAC,wBAAwB,EAAA,QAAA,EACjD,QAAQ,EAAA,CACF;AAEb;;;;"}

package/dist/esm/src/components/CallControls/CallStatsButton.js

@@ -1,18 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-import { forwardRef } from 'react';
-import { useI18n } from '@stream-io/video-react-bindings';
-import { CallStats } from '../CallStats/CallStats.js';
-import { CompositeButton } from '../Button/CompositeButton.js';
-import '../Button/IconButton.js';
-import { MenuToggle } from '../Menu/MenuToggle.js';
-import { Icon } from '../Icon/Icon.js';
-
-const CallStatsButton = () => (jsx(MenuToggle, { placement: "top-end", ToggleButton: ToggleMenuButton, children: jsx(CallStats, {}) }));
-const ToggleMenuButton = forwardRef(function ToggleMenuButtonRender(props, ref) {
-    const { t } = useI18n();
-    const { caption, menuShown } = props;
-    return (jsx(CompositeButton, { ref: ref, active: menuShown, caption: caption, title: caption || t('Statistics'), "data-testid": "stats-button", children: jsx(Icon, { icon: "stats" }) }));
-});
-
-export { CallStatsButton };
-//# sourceMappingURL=CallStatsButton.js.map

package/dist/esm/src/components/CallControls/CallStatsButton.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"CallStatsButton.js","sources":["../../../../../../../src/components/CallControls/CallStatsButton.tsx"],"sourcesContent":["import { forwardRef } from 'react';\nimport { useI18n } from '@stream-io/video-react-bindings';\n\nimport { CallStats } from '../CallStats';\nimport { CompositeButton } from '../Button/';\nimport { MenuToggle, ToggleMenuButtonProps } from '../Menu';\nimport { Icon } from '../Icon';\n\nexport type CallStatsButtonProps = {\n  caption?: string;\n};\n\nexport const CallStatsButton = () => (\n  <MenuToggle placement=\"top-end\" ToggleButton={ToggleMenuButton}>\n    <CallStats />\n  </MenuToggle>\n);\n\nconst ToggleMenuButton = forwardRef<\n  HTMLDivElement,\n  ToggleMenuButtonProps<HTMLDivElement> & CallStatsButtonProps\n>(function ToggleMenuButtonRender(props, ref) {\n  const { t } = useI18n();\n  const { caption, menuShown } = props;\n\n  return (\n    <CompositeButton\n      ref={ref}\n      active={menuShown}\n      caption={caption}\n      title={caption || t('Statistics')}\n      data-testid=\"stats-button\"\n    >\n      <Icon icon=\"stats\" />\n    </CompositeButton>\n  );\n});\n"],"names":["_jsx"],"mappings":";;;;;;;;;AAYO,MAAM,eAAe,GAAG,OAC7BA,GAAA,CAAC,UAAU,EAAA,EAAC,SAAS,EAAC,SAAS,EAAC,YAAY,EAAE,gBAAgB,EAAA,QAAA,EAC5DA,IAAC,SAAS,EAAA,EAAA,CAAG,EAAA,CACF;AAGf,MAAM,gBAAgB,GAAG,UAAU,CAGjC,SAAS,sBAAsB,CAAC,KAAK,EAAE,GAAG,EAAA;AAC1C,IAAA,MAAM,EAAE,CAAC,EAAE,GAAG,OAAO,EAAE;AACvB,IAAA,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE,GAAG,KAAK;AAEpC,IAAA,QACEA,GAAA,CAAC,eAAe,EAAA,EACd,GAAG,EAAE,GAAG,EACR,MAAM,EAAE,SAAS,EACjB,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,OAAO,IAAI,CAAC,CAAC,YAAY,CAAC,EAAA,aAAA,EACrB,cAAc,EAAA,QAAA,EAE1BA,GAAA,CAAC,IAAI,EAAA,EAAC,IAAI,EAAC,OAAO,EAAA,CAAG,EAAA,CACL;AAEtB,CAAC,CAAC;;;;"}