gbc-kyc-kit 1.9.3 → 1.10.0

package/dist/gbc-kyc-kit.es.js

@@ -25222,7 +25222,7 @@ const internal_processStyles = (tag, processor) => {
     tag.__emotion_styles = processor(tag.__emotion_styles);
   }
 };
-const _excluded$g = ["values", "unit", "step"];
+const _excluded$h = ["values", "unit", "step"];
 const sortBreakpointsValues = (values2) => {
   const breakpointsAsArray = Object.keys(values2).map((key) => ({
     key,
@@ -25246,7 +25246,7 @@ function createBreakpoints(breakpoints) {
     },
     unit = "px",
     step = 5
-  } = breakpoints, other = _objectWithoutPropertiesLoose(breakpoints, _excluded$g);
+  } = breakpoints, other = _objectWithoutPropertiesLoose(breakpoints, _excluded$h);
   const sortedValues = sortBreakpointsValues(values2);
   const keys2 = Object.keys(sortedValues);
   function up(key) {
@@ -26148,14 +26148,14 @@ function unstable_createStyleFunctionSx() {
 const styleFunctionSx = unstable_createStyleFunctionSx();
 styleFunctionSx.filterProps = ["sx"];
 var styleFunctionSx$1 = styleFunctionSx;
-const _excluded$f = ["breakpoints", "palette", "spacing", "shape"];
+const _excluded$g = ["breakpoints", "palette", "spacing", "shape"];
 function createTheme$1(options = {}, ...args) {
   const {
     breakpoints: breakpointsInput = {},
     palette: paletteInput = {},
     spacing: spacingInput,
     shape: shapeInput = {}
-  } = options, other = _objectWithoutPropertiesLoose(options, _excluded$f);
+  } = options, other = _objectWithoutPropertiesLoose(options, _excluded$g);
   const breakpoints = createBreakpoints(breakpointsInput);
   const spacing = createSpacing(spacingInput);
   let muiTheme = deepmerge({
@@ -26189,7 +26189,7 @@ const systemDefaultTheme$1 = createTheme$1();
 function useTheme$1(defaultTheme2 = systemDefaultTheme$1) {
   return useTheme$2(defaultTheme2);
 }
-const _excluded$e = ["sx"];
+const _excluded$f = ["sx"];
 const splitProps = (props) => {
   var _props$theme$unstable, _props$theme;
   const result = {
@@ -26209,7 +26209,7 @@ const splitProps = (props) => {
 function extendSxProp(props) {
   const {
     sx: inSx
-  } = props, other = _objectWithoutPropertiesLoose(props, _excluded$e);
+  } = props, other = _objectWithoutPropertiesLoose(props, _excluded$f);
   const {
     systemProps,
     otherProps
@@ -26250,7 +26250,7 @@ function clsx() {
     (e2 = arguments[f2++]) && (t2 = r(e2)) && (n2 && (n2 += " "), n2 += t2);
   return n2;
 }
-const _excluded$d = ["className", "component"];
+const _excluded$e = ["className", "component"];
 function createBox(options = {}) {
   const {
     themeId,
@@ -26266,7 +26266,7 @@ function createBox(options = {}) {
     const _extendSxProp = extendSxProp(inProps), {
       className,
       component = "div"
-    } = _extendSxProp, other = _objectWithoutPropertiesLoose(_extendSxProp, _excluded$d);
+    } = _extendSxProp, other = _objectWithoutPropertiesLoose(_extendSxProp, _excluded$e);
     return /* @__PURE__ */ jsx(BoxRoot, _extends({
       as: component,
       ref,
@@ -26276,14 +26276,14 @@ function createBox(options = {}) {
   });
   return Box2;
 }
-const _excluded$c = ["variant"];
+const _excluded$d = ["variant"];
 function isEmpty$1(string2) {
   return string2.length === 0;
 }
 function propsToClassKey(props) {
   const {
     variant
-  } = props, other = _objectWithoutPropertiesLoose(props, _excluded$c);
+  } = props, other = _objectWithoutPropertiesLoose(props, _excluded$d);
   let classKey = variant || "";
   Object.keys(other).sort().forEach((key) => {
     if (key === "color") {
@@ -26294,7 +26294,7 @@ function propsToClassKey(props) {
   });
   return classKey;
 }
-const _excluded$b = ["name", "slot", "skipVariantsResolver", "skipSx", "overridesResolver"];
+const _excluded$c = ["name", "slot", "skipVariantsResolver", "skipSx", "overridesResolver"];
 function isEmpty(obj) {
   return Object.keys(obj).length === 0;
 }
@@ -26388,7 +26388,7 @@ function createStyled2(input = {}) {
       skipVariantsResolver: inputSkipVariantsResolver,
       skipSx: inputSkipSx,
       overridesResolver = defaultOverridesResolver(lowercaseFirstLetter(componentSlot))
-    } = inputOptions, options = _objectWithoutPropertiesLoose(inputOptions, _excluded$b);
+    } = inputOptions, options = _objectWithoutPropertiesLoose(inputOptions, _excluded$c);
     const skipVariantsResolver = inputSkipVariantsResolver !== void 0 ? inputSkipVariantsResolver : componentSlot && componentSlot !== "Root" && componentSlot !== "root" || false;
     const skipSx = inputSkipSx || false;
     let label;
@@ -26661,7 +26661,7 @@ function createMixins(breakpoints, mixins) {
     }
   }, mixins);
 }
-const _excluded$a = ["mode", "contrastThreshold", "tonalOffset"];
+const _excluded$b = ["mode", "contrastThreshold", "tonalOffset"];
 const light = {
   text: {
     primary: "rgba(0, 0, 0, 0.87)",
@@ -26815,7 +26815,7 @@ function createPalette(palette) {
     mode = "light",
     contrastThreshold = 3,
     tonalOffset = 0.2
-  } = palette, other = _objectWithoutPropertiesLoose(palette, _excluded$a);
+  } = palette, other = _objectWithoutPropertiesLoose(palette, _excluded$b);
   const primary = palette.primary || getDefaultPrimary(mode);
   const secondary = palette.secondary || getDefaultSecondary(mode);
   const error = palette.error || getDefaultError(mode);
@@ -26892,7 +26892,7 @@ function createPalette(palette) {
   }, modes[mode]), other);
   return paletteOutput;
 }
-const _excluded$9 = ["fontFamily", "fontSize", "fontWeightLight", "fontWeightRegular", "fontWeightMedium", "fontWeightBold", "htmlFontSize", "allVariants", "pxToRem"];
+const _excluded$a = ["fontFamily", "fontSize", "fontWeightLight", "fontWeightRegular", "fontWeightMedium", "fontWeightBold", "htmlFontSize", "allVariants", "pxToRem"];
 function round$2(value) {
   return Math.round(value * 1e5) / 1e5;
 }
@@ -26911,7 +26911,7 @@ function createTypography(palette, typography) {
     htmlFontSize = 16,
     allVariants,
     pxToRem: pxToRem2
-  } = _ref, other = _objectWithoutPropertiesLoose(_ref, _excluded$9);
+  } = _ref, other = _objectWithoutPropertiesLoose(_ref, _excluded$a);
   const coef = fontSize2 / 14;
   const pxToRem = pxToRem2 || ((size) => `${size / htmlFontSize * coef}rem`);
   const buildVariant = (fontWeight, size, lineHeight, letterSpacing, casing) => _extends({
@@ -26965,7 +26965,7 @@ function createShadow(...px) {
 }
 const shadows = ["none", createShadow(0, 2, 1, -1, 0, 1, 1, 0, 0, 1, 3, 0), createShadow(0, 3, 1, -2, 0, 2, 2, 0, 0, 1, 5, 0), createShadow(0, 3, 3, -2, 0, 3, 4, 0, 0, 1, 8, 0), createShadow(0, 2, 4, -1, 0, 4, 5, 0, 0, 1, 10, 0), createShadow(0, 3, 5, -1, 0, 5, 8, 0, 0, 1, 14, 0), createShadow(0, 3, 5, -1, 0, 6, 10, 0, 0, 1, 18, 0), createShadow(0, 4, 5, -2, 0, 7, 10, 1, 0, 2, 16, 1), createShadow(0, 5, 5, -3, 0, 8, 10, 1, 0, 3, 14, 2), createShadow(0, 5, 6, -3, 0, 9, 12, 1, 0, 3, 16, 2), createShadow(0, 6, 6, -3, 0, 10, 14, 1, 0, 4, 18, 3), createShadow(0, 6, 7, -4, 0, 11, 15, 1, 0, 4, 20, 3), createShadow(0, 7, 8, -4, 0, 12, 17, 2, 0, 5, 22, 4), createShadow(0, 7, 8, -4, 0, 13, 19, 2, 0, 5, 24, 4), createShadow(0, 7, 9, -4, 0, 14, 21, 2, 0, 5, 26, 4), createShadow(0, 8, 9, -5, 0, 15, 22, 2, 0, 6, 28, 5), createShadow(0, 8, 10, -5, 0, 16, 24, 2, 0, 6, 30, 5), createShadow(0, 8, 11, -5, 0, 17, 26, 2, 0, 6, 32, 5), createShadow(0, 9, 11, -5, 0, 18, 28, 2, 0, 7, 34, 6), createShadow(0, 9, 12, -6, 0, 19, 29, 2, 0, 7, 36, 6), createShadow(0, 10, 13, -6, 0, 20, 31, 3, 0, 8, 38, 7), createShadow(0, 10, 13, -6, 0, 21, 33, 3, 0, 8, 40, 7), createShadow(0, 10, 14, -6, 0, 22, 35, 3, 0, 8, 42, 7), createShadow(0, 11, 14, -7, 0, 23, 36, 3, 0, 9, 44, 8), createShadow(0, 11, 15, -7, 0, 24, 38, 3, 0, 9, 46, 8)];
 var shadows$1 = shadows;
-const _excluded$8 = ["duration", "easing", "delay"];
+const _excluded$9 = ["duration", "easing", "delay"];
 const easing = {
   easeInOut: "cubic-bezier(0.4, 0, 0.2, 1)",
   easeOut: "cubic-bezier(0.0, 0, 0.2, 1)",
@@ -27000,7 +27000,7 @@ function createTransitions(inputTransitions) {
       easing: easingOption = mergedEasing.easeInOut,
       delay = 0
     } = options;
-    _objectWithoutPropertiesLoose(options, _excluded$8);
+    _objectWithoutPropertiesLoose(options, _excluded$9);
     return (Array.isArray(props) ? props : [props]).map((animatedProp) => `${animatedProp} ${typeof durationOption === "string" ? durationOption : formatMs(durationOption)} ${easingOption} ${typeof delay === "string" ? delay : formatMs(delay)}`).join(",");
   };
   return _extends({
@@ -27022,14 +27022,14 @@ const zIndex = {
   tooltip: 1500
 };
 var zIndex$1 = zIndex;
-const _excluded$7 = ["breakpoints", "mixins", "spacing", "palette", "transitions", "typography", "shape"];
+const _excluded$8 = ["breakpoints", "mixins", "spacing", "palette", "transitions", "typography", "shape"];
 function createTheme(options = {}, ...args) {
   const {
     mixins: mixinsInput = {},
     palette: paletteInput = {},
     transitions: transitionsInput = {},
     typography: typographyInput = {}
-  } = options, other = _objectWithoutPropertiesLoose(options, _excluded$7);
+  } = options, other = _objectWithoutPropertiesLoose(options, _excluded$8);
   if (options.vars) {
     throw new Error(formatMuiErrorMessage(18));
   }
@@ -27082,8 +27082,8 @@ function getSvgIconUtilityClass(slot) {
   return generateUtilityClass("MuiSvgIcon", slot);
 }
 generateUtilityClasses("MuiSvgIcon", ["root", "colorPrimary", "colorSecondary", "colorAction", "colorError", "colorDisabled", "fontSizeInherit", "fontSizeSmall", "fontSizeMedium", "fontSizeLarge"]);
-const _excluded$6 = ["children", "className", "color", "component", "fontSize", "htmlColor", "inheritViewBox", "titleAccess", "viewBox"];
-const useUtilityClasses$2 = (ownerState) => {
+const _excluded$7 = ["children", "className", "color", "component", "fontSize", "htmlColor", "inheritViewBox", "titleAccess", "viewBox"];
+const useUtilityClasses$3 = (ownerState) => {
   const {
     color: color2,
     fontSize: fontSize2,
@@ -27146,7 +27146,7 @@ const SvgIcon = /* @__PURE__ */ React.forwardRef(function SvgIcon2(inProps, ref)
     inheritViewBox = false,
     titleAccess,
     viewBox = "0 0 24 24"
-  } = props, other = _objectWithoutPropertiesLoose(props, _excluded$6);
+  } = props, other = _objectWithoutPropertiesLoose(props, _excluded$7);
   const hasSvgAsChild = /* @__PURE__ */ React.isValidElement(children) && children.type === "svg";
   const ownerState = _extends({}, props, {
     color: color2,
@@ -27161,7 +27161,7 @@ const SvgIcon = /* @__PURE__ */ React.forwardRef(function SvgIcon2(inProps, ref)
   if (!inheritViewBox) {
     more.viewBox = viewBox;
   }
-  const classes = useUtilityClasses$2(ownerState);
+  const classes = useUtilityClasses$3(ownerState);
   return /* @__PURE__ */ jsxs(SvgIconRoot, _extends({
     as: component,
     className: clsx(classes.root, className),
@@ -27476,6 +27476,115 @@ function getTransitionProps(props, options) {
     delay: style2.transitionDelay
   };
 }
+function getTypographyUtilityClass(slot) {
+  return generateUtilityClass("MuiTypography", slot);
+}
+generateUtilityClasses("MuiTypography", ["root", "h1", "h2", "h3", "h4", "h5", "h6", "subtitle1", "subtitle2", "body1", "body2", "inherit", "button", "caption", "overline", "alignLeft", "alignRight", "alignCenter", "alignJustify", "noWrap", "gutterBottom", "paragraph"]);
+const _excluded$6 = ["align", "className", "component", "gutterBottom", "noWrap", "paragraph", "variant", "variantMapping"];
+const useUtilityClasses$2 = (ownerState) => {
+  const {
+    align,
+    gutterBottom,
+    noWrap,
+    paragraph,
+    variant,
+    classes
+  } = ownerState;
+  const slots = {
+    root: ["root", variant, ownerState.align !== "inherit" && `align${capitalize(align)}`, gutterBottom && "gutterBottom", noWrap && "noWrap", paragraph && "paragraph"]
+  };
+  return composeClasses(slots, getTypographyUtilityClass, classes);
+};
+const TypographyRoot = styled$1("span", {
+  name: "MuiTypography",
+  slot: "Root",
+  overridesResolver: (props, styles2) => {
+    const {
+      ownerState
+    } = props;
+    return [styles2.root, ownerState.variant && styles2[ownerState.variant], ownerState.align !== "inherit" && styles2[`align${capitalize(ownerState.align)}`], ownerState.noWrap && styles2.noWrap, ownerState.gutterBottom && styles2.gutterBottom, ownerState.paragraph && styles2.paragraph];
+  }
+})(({
+  theme,
+  ownerState
+}) => _extends({
+  margin: 0
+}, ownerState.variant === "inherit" && {
+  font: "inherit"
+}, ownerState.variant !== "inherit" && theme.typography[ownerState.variant], ownerState.align !== "inherit" && {
+  textAlign: ownerState.align
+}, ownerState.noWrap && {
+  overflow: "hidden",
+  textOverflow: "ellipsis",
+  whiteSpace: "nowrap"
+}, ownerState.gutterBottom && {
+  marginBottom: "0.35em"
+}, ownerState.paragraph && {
+  marginBottom: 16
+}));
+const defaultVariantMapping = {
+  h1: "h1",
+  h2: "h2",
+  h3: "h3",
+  h4: "h4",
+  h5: "h5",
+  h6: "h6",
+  subtitle1: "h6",
+  subtitle2: "h6",
+  body1: "p",
+  body2: "p",
+  inherit: "p"
+};
+const colorTransformations = {
+  primary: "primary.main",
+  textPrimary: "text.primary",
+  secondary: "secondary.main",
+  textSecondary: "text.secondary",
+  error: "error.main"
+};
+const transformDeprecatedColors = (color2) => {
+  return colorTransformations[color2] || color2;
+};
+const Typography = /* @__PURE__ */ React.forwardRef(function Typography2(inProps, ref) {
+  const themeProps = useThemeProps({
+    props: inProps,
+    name: "MuiTypography"
+  });
+  const color2 = transformDeprecatedColors(themeProps.color);
+  const props = extendSxProp(_extends({}, themeProps, {
+    color: color2
+  }));
+  const {
+    align = "inherit",
+    className,
+    component,
+    gutterBottom = false,
+    noWrap = false,
+    paragraph = false,
+    variant = "body1",
+    variantMapping = defaultVariantMapping
+  } = props, other = _objectWithoutPropertiesLoose(props, _excluded$6);
+  const ownerState = _extends({}, props, {
+    align,
+    color: color2,
+    className,
+    component,
+    gutterBottom,
+    noWrap,
+    paragraph,
+    variant,
+    variantMapping
+  });
+  const Component = component || (paragraph ? "p" : variantMapping[variant] || defaultVariantMapping[variant]) || "span";
+  const classes = useUtilityClasses$2(ownerState);
+  return /* @__PURE__ */ jsx(TypographyRoot, _extends({
+    as: Component,
+    ref,
+    ownerState,
+    className: clsx(classes.root, className)
+  }, other));
+});
+var Typography$1 = Typography;
 function isHostComponent(element) {
   return typeof element === "string";
 }
@@ -31231,7 +31340,7 @@ FaceMatch.propTypes = {
   source: propTypes.exports.PropTypes.string,
   validateVpn: propTypes.exports.PropTypes.bool
 };
-const LivenessController = (clientId, eventId, source2, inProduction, countryCodeAllowed, faceMatch, dataLiveness, validateVpn) => {
+const LivenessController = (clientId, eventId, source2, inProduction, countryCodeAllowed, faceMatch, dataLiveness, validateVpn, successMessage) => {
   const [isLoading, setIsLoading] = useState(false);
   const [token2, setToken] = useState("");
   const [status, setStatus] = useState(clientId === void 0 ? "CLIENTID" : token2 === void 0 ? "TOKEN" : "");
@@ -31307,6 +31416,7 @@ const LivenessController = (clientId, eventId, source2, inProduction, countryCod
         await request2(parseReq);
         faceMatch ? await fetchFaceMatch(faceMatch, `data:image/jpeg;base64,${data2.images[0]}`, inProduction, customHeaders).then((res) => {
           setSimilarity(res.data.similarity);
+          setMessage(successMessage ? successMessage : "Verificaci\xF3n de identidad completada");
           saveDataToDB({
             data: {
               similarity: res.data.similarity,
@@ -31345,13 +31455,26 @@ const LivenessController = (clientId, eventId, source2, inProduction, countryCod
     clearState,
     message,
     countryCode,
-    setToken
+    setToken,
+    data: data2,
+    similarity
   };
 };
 const primaryColor = getComputedStyle(document.documentElement).getPropertyValue("--primary");
 const primaryColorHover = getComputedStyle(document.documentElement).getPropertyValue("--primary-hov");
 const fontSize = getComputedStyle(document.documentElement).getPropertyValue("--font-size");
 const fontFamily = getComputedStyle(document.documentElement).getPropertyValue("--font-family");
+const CustomSpinnerProgress = () => {
+  return /* @__PURE__ */ jsx("div", {
+    className: "custom_spinner_container",
+    children: /* @__PURE__ */ jsx("div", {
+      className: "box_spinner",
+      children: /* @__PURE__ */ jsx("div", {
+        className: "spinner"
+      })
+    })
+  });
+};
 function LivenessCheck({
   mode,
   clientId,
@@ -31362,7 +31485,8 @@ function LivenessCheck({
   countryCodeAllowed,
   faceMatch,
   dataLiveness,
-  validateVpn
+  validateVpn,
+  successMessage
 }) {
   const {
     status,
@@ -31371,8 +31495,10 @@ function LivenessCheck({
     clearState,
     message,
     countryCode,
-    setToken
-  } = LivenessController(clientId, eventId, source2, inProduction, countryCodeAllowed, faceMatch, dataLiveness, validateVpn);
+    setToken,
+    data: data2,
+    similarity
+  } = LivenessController(clientId, eventId, source2, inProduction, countryCodeAllowed, faceMatch, dataLiveness, validateVpn, successMessage);
   useEffect(() => {
     const component = document.getElementsByTagName("face-liveness")[0];
     if (component) {
@@ -31423,8 +31549,27 @@ function LivenessCheck({
           status,
           message
         })]
-      }) : /* @__PURE__ */ jsx("face-liveness", {
+      }) : lib(data2) && faceMatch || faceMatch === null ? /* @__PURE__ */ jsx("face-liveness", {
         class: "liveness"
+      }) : /* @__PURE__ */ jsx(Box$1, {
+        className: "box-liveness",
+        children: similarity === 0 ? /* @__PURE__ */ jsxs(Box$1, {
+          display: "flex",
+          flexDirection: "column",
+          justifyContent: "center",
+          alignItems: "center",
+          children: [/* @__PURE__ */ jsx(CustomSpinnerProgress, {}), /* @__PURE__ */ jsx(Typography$1, {
+            variant: "caption",
+            style: {
+              fontSize: "0.875em",
+              paddingTop: "0.875em",
+              color: "#000000"
+            },
+            children: "Comparando rostro..."
+          })]
+        }) : /* @__PURE__ */ jsx(SuccessAnimation, {
+          message
+        })
       })]
     })
   });