@genai-fi/base 4.1.2 → 4.1.4

package/dist/components/ConnectionStatus/ConnectionStatus.d.ts

@@ -1,8 +1,9 @@
 interface Props {
     api: string;
+    checkURL?: string;
     appName: string;
     visibility?: number;
     noCheck?: boolean;
 }
-export default function ConnectionStatus({ api, appName, visibility, noCheck }: Props): import("react/jsx-runtime").JSX.Element;
+export default function ConnectionStatus({ api, checkURL, appName, visibility, noCheck }: Props): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/ConnectionStatus/ConnectionStatus.js

@@ -1,24 +1,24 @@
-import { jsx as r, Fragment as I, jsxs as L } from "react/jsx-runtime";
-import { iceConfig as W, webrtcActive as q } from "../../state/webrtcState.js";
-import { useRef as F, useState as g, useEffect as o } from "react";
-import { getRTConfig as P } from "./ice.js";
-import { W as R, F as z } from "../../FlashWifi-DkGhdWqj.js";
-import { useTranslation as E } from "react-i18next";
-import { c as b } from "../../createSvgIcon-DQhMxTx4.js";
-import { checkP2P as j } from "./check.js";
-import { usePeerObject as x } from "../../hooks/peer.js";
-import { a as T } from "../../react-D_xU5dL6.js";
-import '../../assets/ConnectionStatus.css';const A = "_containerConnecting_1p4sr_15 _container_1p4sr_3", U = "_containerSuccess_1p4sr_20 _container_1p4sr_3", k = "_containerMedium_1p4sr_25 _container_1p4sr_3", w = "_containerBad_1p4sr_30 _container_1p4sr_3", D = "_message_1p4sr_35", a = {
-  containerConnecting: A,
-  containerSuccess: U,
-  containerMedium: k,
-  containerBad: w,
-  message: D
-}, O = b(/* @__PURE__ */ r("path", {
+import { jsx as r, Fragment as W, jsxs as q } from "react/jsx-runtime";
+import { iceConfig as F, webrtcActive as L } from "../../state/webrtcState.js";
+import { useRef as P, useState as g, useEffect as o } from "react";
+import { getRTConfig as z } from "./ice.js";
+import { W as E, F as R } from "../../FlashWifi-DkGhdWqj.js";
+import { useTranslation as b } from "react-i18next";
+import { c as j } from "../../createSvgIcon-DQhMxTx4.js";
+import { checkP2P as x } from "./check.js";
+import { usePeerObject as A } from "../../hooks/peer.js";
+import { a as B } from "../../react-D_xU5dL6.js";
+import '../../assets/ConnectionStatus.css';const w = "_containerConnecting_1p4sr_15 _container_1p4sr_3", D = "_containerSuccess_1p4sr_20 _container_1p4sr_3", O = "_containerMedium_1p4sr_25 _container_1p4sr_3", U = "_containerBad_1p4sr_30 _container_1p4sr_3", $ = "_message_1p4sr_35", a = {
+  containerConnecting: w,
+  containerSuccess: D,
+  containerMedium: O,
+  containerBad: U,
+  message: $
+}, k = j(/* @__PURE__ */ r("path", {
   d: "M24 8.98C20.93 5.9 16.69 4 12 4S3.07 5.9 0 8.98L12 21v-9h8.99zM19.59 14l-2.09 2.09L15.41 14 14 15.41l2.09 2.09L14 19.59 15.41 21l2.09-2.08L19.59 21 21 19.59l-2.08-2.09L21 15.41z"
-}), "SignalWifiBad"), $ = 6e4;
-function ee({ api: f, appName: h, visibility: S, noCheck: v }) {
-  const { t: p } = E(), e = x(), [u, y] = T(W), [C, l] = T(q), m = F(), [n, d] = g("connecting"), [s, _] = g(0), [, B] = g(!1), [c, M] = g(!1), i = n === "ready";
+}), "SignalWifiBad"), N = 6e4;
+function te({ api: f, checkURL: S, appName: h, visibility: v, noCheck: y }) {
+  const { t: p } = b(), e = A(), [u, C] = B(F), [M, l] = B(L), m = P(), [n, d] = g("connecting"), [s, _] = g(0), [, I] = g(!1), [c, T] = g(!1), i = n === "ready";
   return o(() => {
     if (e)
       return e.on("status", d), e.on("quality", _), d(e.status), _(e.quality), () => {
@@ -26,48 +26,48 @@ function ee({ api: f, appName: h, visibility: S, noCheck: v }) {
       };
     _(0), d("connecting");
   }, [e]), o(() => {
-    u || P(f, h, (t) => {
-      y(t);
+    u || z(f, h, (t) => {
+      C(t);
     });
-  }, [u, y, f, h]), o(() => {
+  }, [u, C, f, h]), o(() => {
     if (n !== "ready") {
       const t = setTimeout(() => {
-        M(!0);
-      }, $);
+        T(!0);
+      }, N);
       return () => {
         clearTimeout(t);
       };
     } else
-      M(!1);
+      T(!1);
   }, [n]), o(() => {
-    u && C === "unset" && (navigator != null && navigator.mediaDevices ? navigator.mediaDevices.getUserMedia({ video: !0 }).then((t) => {
+    u && M === "unset" && (navigator != null && navigator.mediaDevices ? navigator.mediaDevices.getUserMedia({ video: !0 }).then((t) => {
       m.current = t, l("full");
     }).catch(() => {
       l("relay");
     }) : l("relay"));
-  }, [u, C, l]), o(() => {
+  }, [u, M, l]), o(() => {
     i && m.current && (m.current.getTracks().forEach(function(t) {
       t.stop();
     }), m.current = void 0);
   }, [i, n]), o(() => {
-    i && e && !v && e.code && j(f, e.code).then((t) => {
-      B(t);
+    i && e && !y && e.code && x(S || f, e.code).then((t) => {
+      I(t);
     });
-  }, [i, e, f, v]), /* @__PURE__ */ r(I, { children: (S === void 0 || s <= S) && /* @__PURE__ */ L(
+  }, [i, e, f, S, y]), /* @__PURE__ */ r(W, { children: (v === void 0 || s <= v) && /* @__PURE__ */ q(
     "div",
     {
       className: n === "connecting" && !c ? a.containerConnecting : s === 3 ? a.containerSuccess : s === 2 ? a.containerMedium : a.containerBad,
       children: [
         !c && s > 0 && /* @__PURE__ */ r(
-          R,
+          E,
           {
             fontSize: "large",
             color: "inherit"
           }
         ),
-        !c && s <= 0 && /* @__PURE__ */ r(z, {}),
+        !c && s <= 0 && /* @__PURE__ */ r(R, {}),
         c && /* @__PURE__ */ r(
-          O,
+          k,
           {
             fontSize: "large",
             color: "inherit"
@@ -79,5 +79,5 @@ function ee({ api: f, appName: h, visibility: S, noCheck: v }) {
   ) });
 }
 export {
-  ee as default
+  te as default
 };

package/dist/components/Webcam/Webcam.d.ts

@@ -13,5 +13,5 @@ interface Props extends Callbacks {
     hidden?: boolean;
     size: number;
 }
-export default function Webcam({ interval, capture, disable, direct, hidden, size, ...props }: Props): import("react/jsx-runtime").JSX.Element;
+export default function Webcam({ interval, capture, disable, direct, hidden, size, onActivated, onFatal, onPostprocess, onCapture, onPreprocess, }: Props): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/Webcam/Webcam.js

@@ -1,41 +1,41 @@
-import { jsx as c, jsxs as j, Fragment as D } from "react/jsx-runtime";
-import * as X from "react";
-import { useState as T, useRef as b, useEffect as C, useCallback as B } from "react";
-import { useTranslation as H } from "react-i18next";
-import { IconButton as P } from "@mui/material";
-import { c as K } from "../../createSvgIcon-DQhMxTx4.js";
-import { WebcamClass as L } from "./webcamClass.js";
-import { g as G, u as J, s as Q, c as Y, a as Z, m as W } from "../../DefaultPropsProvider-BurgXZzw.js";
-import { g as tt, P as n } from "../../createTheme-DV959X3d.js";
-import { css as z, keyframes as q } from "@emotion/react";
-import '../../assets/Webcam.css';function et(t) {
-  return String(t).match(/[\d.\-+]*\s*(.*)/)[1] || "";
+import { jsx as c, jsxs as F, Fragment as q } from "react/jsx-runtime";
+import * as G from "react";
+import { useState as N, useRef as T, useEffect as b, useCallback as E } from "react";
+import { useTranslation as J } from "react-i18next";
+import { IconButton as V } from "@mui/material";
+import { c as Q } from "../../createSvgIcon-DQhMxTx4.js";
+import { WebcamClass as Y } from "./webcamClass.js";
+import { g as Z, u as P, s as W, c as ee, a as te, m as ae } from "../../DefaultPropsProvider-BurgXZzw.js";
+import { g as ne, P as a } from "../../createTheme-DV959X3d.js";
+import { css as A, keyframes as H } from "@emotion/react";
+import '../../assets/Webcam.css';function re(e) {
+  return String(e).match(/[\d.\-+]*\s*(.*)/)[1] || "";
 }
-function nt(t) {
-  return parseFloat(t);
+function ie(e) {
+  return parseFloat(e);
 }
-const rt = "_container_u6uf5_1", at = "_wrapContainer_u6uf5_5", ot = "_flipButton_u6uf5_10", F = {
-  container: rt,
-  wrapContainer: at,
-  flipButton: ot
+const oe = "_container_u6uf5_1", se = "_wrapContainer_u6uf5_5", ce = "_flipButton_u6uf5_10", $ = {
+  container: oe,
+  wrapContainer: se,
+  flipButton: ce
 };
-function it(t) {
-  return tt("MuiSkeleton", t);
+function le(e) {
+  return ne("MuiSkeleton", e);
 }
-G("MuiSkeleton", ["root", "text", "rectangular", "rounded", "circular", "pulse", "wave", "withChildren", "fitContent", "heightAuto"]);
-const st = (t) => {
+Z("MuiSkeleton", ["root", "text", "rectangular", "rounded", "circular", "pulse", "wave", "withChildren", "fitContent", "heightAuto"]);
+const ue = (e) => {
   const {
-    classes: o,
-    variant: a,
-    animation: i,
-    hasChildren: p,
-    width: y,
-    height: m
-  } = t;
-  return Z({
-    root: ["root", a, i, p && "withChildren", p && !y && "fitContent", p && !m && "heightAuto"]
-  }, it, o);
-}, M = q`
+    classes: i,
+    variant: r,
+    animation: o,
+    hasChildren: u,
+    width: v,
+    height: s
+  } = e;
+  return te({
+    root: ["root", r, o, u && "withChildren", u && !v && "fitContent", u && !s && "heightAuto"]
+  }, le, i);
+}, j = H`
   0% {
     opacity: 1;
   }
@@ -47,7 +47,7 @@ const st = (t) => {
   100% {
     opacity: 1;
   }
-`, _ = q`
+`, D = H`
   0% {
     transform: translateX(-100%);
   }
@@ -60,29 +60,29 @@ const st = (t) => {
   100% {
     transform: translateX(100%);
   }
-`, ct = typeof M != "string" ? z`
-        animation: ${M} 2s ease-in-out 0.5s infinite;
-      ` : null, lt = typeof _ != "string" ? z`
+`, fe = typeof j != "string" ? A`
+        animation: ${j} 2s ease-in-out 0.5s infinite;
+      ` : null, pe = typeof D != "string" ? A`
         &::after {
-          animation: ${_} 2s linear 0.5s infinite;
+          animation: ${D} 2s linear 0.5s infinite;
         }
-      ` : null, ut = Q("span", {
+      ` : null, de = W("span", {
   name: "MuiSkeleton",
   slot: "Root",
-  overridesResolver: (t, o) => {
+  overridesResolver: (e, i) => {
     const {
-      ownerState: a
-    } = t;
-    return [o.root, o[a.variant], a.animation !== !1 && o[a.animation], a.hasChildren && o.withChildren, a.hasChildren && !a.width && o.fitContent, a.hasChildren && !a.height && o.heightAuto];
+      ownerState: r
+    } = e;
+    return [i.root, i[r.variant], r.animation !== !1 && i[r.animation], r.hasChildren && i.withChildren, r.hasChildren && !r.width && i.fitContent, r.hasChildren && !r.height && i.heightAuto];
   }
-})(W(({
-  theme: t
+})(ae(({
+  theme: e
 }) => {
-  const o = et(t.shape.borderRadius) || "px", a = nt(t.shape.borderRadius);
+  const i = re(e.shape.borderRadius) || "px", r = ie(e.shape.borderRadius);
   return {
     display: "block",
     // Create a "on paper" color with sufficient contrast retaining the color
-    backgroundColor: t.vars ? t.vars.palette.Skeleton.bg : t.alpha(t.palette.text.primary, t.palette.mode === "light" ? 0.11 : 0.13),
+    backgroundColor: e.vars ? e.vars.palette.Skeleton.bg : e.alpha(e.palette.text.primary, e.palette.mode === "light" ? 0.11 : 0.13),
     height: "1.2em",
     variants: [{
       props: {
@@ -94,7 +94,7 @@ const st = (t) => {
         height: "auto",
         transformOrigin: "0 55%",
         transform: "scale(1, 0.60)",
-        borderRadius: `${a}${o}/${Math.round(a / 0.6 * 10) / 10}${o}`,
+        borderRadius: `${r}${i}/${Math.round(r / 0.6 * 10) / 10}${i}`,
         "&:empty:before": {
           content: '"\\00a0"'
         }
@@ -111,12 +111,12 @@ const st = (t) => {
         variant: "rounded"
       },
       style: {
-        borderRadius: (t.vars || t).shape.borderRadius
+        borderRadius: (e.vars || e).shape.borderRadius
       }
     }, {
       props: ({
-        ownerState: i
-      }) => i.hasChildren,
+        ownerState: o
+      }) => o.hasChildren,
       style: {
         "& > *": {
           visibility: "hidden"
@@ -124,15 +124,15 @@ const st = (t) => {
       }
     }, {
       props: ({
-        ownerState: i
-      }) => i.hasChildren && !i.width,
+        ownerState: o
+      }) => o.hasChildren && !o.width,
       style: {
         maxWidth: "fit-content"
       }
     }, {
       props: ({
-        ownerState: i
-      }) => i.hasChildren && !i.height,
+        ownerState: o
+      }) => o.hasChildren && !o.height,
       style: {
         height: "auto"
       }
@@ -140,8 +140,8 @@ const st = (t) => {
       props: {
         animation: "pulse"
       },
-      style: ct || {
-        animation: `${M} 2s ease-in-out 0.5s infinite`
+      style: fe || {
+        animation: `${j} 2s ease-in-out 0.5s infinite`
       }
     }, {
       props: {
@@ -156,7 +156,7 @@ const st = (t) => {
           background: `linear-gradient(
                 90deg,
                 transparent,
-                ${(t.vars || t).palette.action.hover},
+                ${(e.vars || e).palette.action.hover},
                 transparent
               )`,
           content: '""',
@@ -172,47 +172,47 @@ const st = (t) => {
       props: {
         animation: "wave"
       },
-      style: lt || {
+      style: pe || {
         "&::after": {
-          animation: `${_} 2s linear 0.5s infinite`
+          animation: `${D} 2s linear 0.5s infinite`
         }
       }
     }]
   };
-})), E = /* @__PURE__ */ X.forwardRef(function(o, a) {
-  const i = J({
-    props: o,
+})), K = /* @__PURE__ */ G.forwardRef(function(i, r) {
+  const o = P({
+    props: i,
     name: "MuiSkeleton"
   }), {
-    animation: p = "pulse",
-    className: y,
-    component: m = "span",
-    height: h,
-    style: e,
-    variant: A = "text",
-    width: v,
-    ...f
-  } = i, g = {
-    ...i,
-    animation: p,
-    component: m,
-    variant: A,
-    hasChildren: !!f.children
-  }, u = st(g);
-  return /* @__PURE__ */ c(ut, {
-    as: m,
-    ref: a,
-    className: Y(u.root, y),
-    ownerState: g,
-    ...f,
+    animation: u = "pulse",
+    className: v,
+    component: s = "span",
+    height: d,
+    style: w,
+    variant: m = "text",
+    width: y,
+    ...h
+  } = o, t = {
+    ...o,
+    animation: u,
+    component: s,
+    variant: m,
+    hasChildren: !!h.children
+  }, M = ue(t);
+  return /* @__PURE__ */ c(de, {
+    as: s,
+    ref: r,
+    className: ee(M.root, v),
+    ownerState: t,
+    ...h,
     style: {
-      width: v,
-      height: h,
-      ...e
+      width: y,
+      height: d,
+      ...w
     }
   });
 });
-process.env.NODE_ENV !== "production" && (E.propTypes = {
+process.env.NODE_ENV !== "production" && (K.propTypes = {
   // ┌────────────────────────────── Warning ──────────────────────────────┐
   // │ These PropTypes are generated from the TypeScript type definitions. │
   // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
@@ -222,159 +222,169 @@ process.env.NODE_ENV !== "production" && (E.propTypes = {
    * If `false` the animation effect is disabled.
    * @default 'pulse'
    */
-  animation: n.oneOf(["pulse", "wave", !1]),
+  animation: a.oneOf(["pulse", "wave", !1]),
   /**
    * Optional children to infer width and height from.
    */
-  children: n.node,
+  children: a.node,
   /**
    * Override or extend the styles applied to the component.
    */
-  classes: n.object,
+  classes: a.object,
   /**
    * @ignore
    */
-  className: n.string,
+  className: a.string,
   /**
    * The component used for the root node.
    * Either a string to use a HTML element or a component.
    */
-  component: n.elementType,
+  component: a.elementType,
   /**
    * Height of the skeleton.
    * Useful when you don't want to adapt the skeleton to a text element but for instance a card.
    */
-  height: n.oneOfType([n.number, n.string]),
+  height: a.oneOfType([a.number, a.string]),
   /**
    * @ignore
    */
-  style: n.object,
+  style: a.object,
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx: n.oneOfType([n.arrayOf(n.oneOfType([n.func, n.object, n.bool])), n.func, n.object]),
+  sx: a.oneOfType([a.arrayOf(a.oneOfType([a.func, a.object, a.bool])), a.func, a.object]),
   /**
    * The type of content that will be rendered.
    * @default 'text'
    */
-  variant: n.oneOfType([n.oneOf(["circular", "rectangular", "rounded", "text"]), n.string]),
+  variant: a.oneOfType([a.oneOf(["circular", "rectangular", "rounded", "text"]), a.string]),
   /**
    * Width of the skeleton.
    * Useful when the skeleton is inside an inline element with no width of its own.
    */
-  width: n.oneOfType([n.number, n.string])
+  width: a.oneOfType([a.number, a.string])
 });
-const U = K([/* @__PURE__ */ c("path", {
+const X = Q([/* @__PURE__ */ c("path", {
   d: "M16 7h-1l-1-1h-4L9 7H8c-1.1 0-2 .9-2 2v6c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V9c0-1.1-.9-2-2-2m-4 7c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2"
 }, "0"), /* @__PURE__ */ c("path", {
   d: "m8.57.51 4.48 4.48V2.04c4.72.47 8.48 4.23 8.95 8.95h2C23.34 3.02 15.49-1.59 8.57.51m2.38 21.45c-4.72-.47-8.48-4.23-8.95-8.95H0c.66 7.97 8.51 12.58 15.43 10.48l-4.48-4.48z"
 }, "1")], "Cameraswitch");
-function bt({ interval: t, capture: o, disable: a, direct: i, hidden: p, size: y, ...m }) {
-  const { t: h } = H(), [e, A] = T(null), v = b(null), f = b(-1), g = b(0), u = b(), s = b({}), [k, V] = T(!1), [R, I] = T(!1);
-  s.current = m;
-  const d = Math.floor(y);
-  C(() => {
-    u.current = async (r) => {
+function Re({
+  interval: e,
+  capture: i,
+  disable: r,
+  direct: o,
+  hidden: u,
+  size: v,
+  onActivated: s,
+  onFatal: d,
+  onPostprocess: w,
+  onCapture: m,
+  onPreprocess: y
+}) {
+  const { t: h } = J(), [t, M] = N(null), C = T(null), k = T(-1), _ = T(0), f = T(), [R, L] = N(!1), [S, B] = N(!1), p = Math.floor(v);
+  b(() => {
+    f.current = async (n) => {
       var l;
-      if (a) {
-        u.current && (f.current = window.requestAnimationFrame(u.current));
+      if (r) {
+        f.current && (k.current = window.requestAnimationFrame(f.current));
         return;
       }
-      if (e && e.canvas) {
-        e.update();
-        const S = t !== void 0 ? t : 1e3;
-        if (s.current.onPreprocess && await s.current.onPreprocess(e.canvas), o && s.current.onCapture && r - g.current >= S) {
-          if (i && e.canvas)
-            await s.current.onCapture(e.canvas);
+      if (t && t.canvas) {
+        t.update();
+        const x = e !== void 0 ? e : 1e3;
+        if (y && await y(t.canvas), i && m && n - _.current >= x) {
+          if (o && t.canvas)
+            await m(t.canvas);
           else {
-            const w = document.createElement("canvas");
-            w.width = e.canvas.width, w.height = e.canvas.height;
-            const x = w.getContext("2d");
-            x || console.error("Failed to get context"), x == null || x.drawImage(e.canvas, 0, 0), await s.current.onCapture(w);
+            const g = document.createElement("canvas");
+            g.width = t.canvas.width, g.height = t.canvas.height;
+            const O = g.getContext("2d");
+            O || console.error("Failed to get context"), O == null || O.drawImage(t.canvas, 0, 0), await m(g);
           }
-          g.current = r;
+          _.current = n;
         }
-        const O = (l = v.current) == null ? void 0 : l.getContext("2d");
-        O && (O.drawImage(e.canvas, 0, 0), s.current.onPostprocess && v.current && await s.current.onPostprocess(v.current));
+        const I = (l = C.current) == null ? void 0 : l.getContext("2d");
+        I && (I.drawImage(t.canvas, 0, 0), w && C.current && await w(C.current));
       }
-      u.current && (f.current = window.requestAnimationFrame(u.current));
-    }, f.current === -1 && (f.current = window.requestAnimationFrame(u.current));
-  }, [e, t, o, i, a]);
-  const N = B(
-    async (r) => {
+      f.current && (k.current = window.requestAnimationFrame(f.current));
+    }, k.current === -1 && (k.current = window.requestAnimationFrame(f.current));
+  }, [t, e, i, o, r, m, y, w]);
+  const U = E(
+    async (n) => {
       var l;
-      if (await r.setup({ facingMode: R ? "user" : "environment" }), r.webcam && (r.webcam.playsInline = !0, r.webcam.muted = !0, r.webcam.onsuspend = () => r.play(), A(r)), (l = navigator.mediaDevices) != null && l.enumerateDevices)
+      if (await n.setup({ facingMode: S ? "user" : "environment" }), n.webcam && (n.webcam.playsInline = !0, n.webcam.muted = !0, n.webcam.onsuspend = () => n.play(), M(n)), (l = navigator.mediaDevices) != null && l.enumerateDevices)
         try {
-          (await navigator.mediaDevices.enumerateDevices()).filter((w) => w.kind === "videoinput").length > 1 && (k || V(!0), r.flip = R);
-        } catch (S) {
-          console.error(S);
+          (await navigator.mediaDevices.enumerateDevices()).filter((g) => g.kind === "videoinput").length > 1 && (R || L(!0), n.flip = S);
+        } catch (x) {
+          console.error(x);
         }
-      return s.current.onActivated && s.current.onActivated(!0), r;
+      return s && s(!0), n;
     },
-    [R, k]
+    [S, R, s]
   );
-  C(() => {
-    o && (g.current = 0);
-  }, [o]), C(() => {
-    const r = new L(d, d, !0);
-    return N(r).catch((l) => {
-      s.current.onActivated && s.current.onActivated(!1), console.error("No webcam", l), s.current.onFatal && s.current.onFatal();
+  b(() => {
+    i && (_.current = 0);
+  }, [i]), b(() => {
+    const n = new Y(p, p, !0);
+    return U(n).catch((l) => {
+      s && s(!1), console.error("No webcam", l), d && d();
     }), () => {
       var l;
-      (l = r.webcam) != null && l.srcObject && r.stop();
+      (l = n.webcam) != null && l.srcObject && n.stop();
     };
-  }, [R, N, d]), C(() => () => {
-    var r;
-    u.current = void 0, (r = e == null ? void 0 : e.webcam) != null && r.srcObject && e.stop();
-  }, [e]), C(() => {
-    e && (a ? e.pause() : e.play());
-  }, [e, a]);
-  const $ = B(() => {
-    I((r) => !r);
-  }, [I]);
-  return p ? /* @__PURE__ */ c(D, { children: k && /* @__PURE__ */ c(
-    P,
+  }, [S, U, p, s, d]), b(() => () => {
+    var n;
+    f.current = void 0, (n = t == null ? void 0 : t.webcam) != null && n.srcObject && t.stop();
+  }, [t]), b(() => {
+    t && (r ? t.pause() : t.play());
+  }, [t, r]);
+  const z = E(() => {
+    B((n) => !n);
+  }, [B]);
+  return u ? /* @__PURE__ */ c(q, { children: R && /* @__PURE__ */ c(
+    V,
     {
       size: "large",
       color: "inherit",
-      onClick: $,
+      onClick: z,
       "aria-label": h("webcam.aria.flip"),
-      children: /* @__PURE__ */ c(U, { fontSize: "large" })
+      children: /* @__PURE__ */ c(X, { fontSize: "large" })
     }
-  ) }) : /* @__PURE__ */ j(D, { children: [
-    !e && /* @__PURE__ */ c(
-      E,
+  ) }) : /* @__PURE__ */ F(q, { children: [
+    !t && /* @__PURE__ */ c(
+      K,
       {
         variant: "rounded",
-        width: d,
-        height: d
+        width: p,
+        height: p
       }
     ),
-    e && /* @__PURE__ */ j("div", { className: F.wrapContainer, children: [
-      k && /* @__PURE__ */ c(
-        P,
+    t && /* @__PURE__ */ F("div", { className: $.wrapContainer, children: [
+      R && /* @__PURE__ */ c(
+        V,
         {
-          className: F.flipButton,
+          className: $.flipButton,
           size: "large",
           color: "inherit",
-          onClick: $,
+          onClick: z,
           "aria-label": h("webcam.aria.flip"),
-          children: /* @__PURE__ */ c(U, { fontSize: "large" })
+          children: /* @__PURE__ */ c(X, { fontSize: "large" })
         }
       ),
       /* @__PURE__ */ c(
         "div",
         {
           "data-testid": "webcam",
-          className: F.container,
+          className: $.container,
           role: "img",
           "aria-label": h("webcam.aria.video"),
           children: /* @__PURE__ */ c(
             "canvas",
             {
-              width: d,
-              height: d,
-              ref: v
+              width: p,
+              height: p,
+              ref: C
             }
           )
         }
@@ -383,5 +393,5 @@ function bt({ interval: t, capture: o, disable: a, direct: i, hidden: p, size: y
   ] });
 }
 export {
-  bt as default
+  Re as default
 };

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@genai-fi/base",
-    "version": "4.1.2",
+    "version": "4.1.4",
     "license": "MIT",
     "type": "module",
     "main": "dist/main.js",