@incodetech/web 2.0.0-alpha.2 → 2.0.0-alpha.4

package/dist/phone/styles.css

@@ -15,14 +15,14 @@
   padding-bottom: var(--spacing-16, var(--spacing-16, 16px));
 }
 
-.IncodePhoneInput, .IncodePhoneInputContainer {
+.IncodePhonePage .IncodePhoneInput, .IncodePhonePage .IncodePhoneInputContainer {
   flex-direction: column;
   align-items: center;
   width: 100%;
   display: flex;
 }
 
-.IncodePhoneInputRow {
+.IncodePhonePage .IncodePhoneInputRow {
   align-items: stretch;
   gap: var(--spacing-8, var(--spacing-8, 8px));
   width: 100%;
@@ -31,7 +31,7 @@
   position: relative;
 }
 
-.IncodePhoneInputWrapper {
+.IncodePhonePage .IncodePhoneInputWrapper {
   border-radius: var(--radius-small, var(--border-radius-small));
   border-style: var(--tw-border-style);
   border-width: 1px;
@@ -47,20 +47,20 @@
   display: flex;
 }
 
-.IncodePhoneInputWrapper:focus-within {
+.IncodePhonePage .IncodePhoneInputWrapper:focus-within {
   border-color: var(--color-input-border-active, var(--input-border-active));
 }
 
-.IncodePhoneInputWrapper.IncodePhoneInputWrapperError {
+.IncodePhonePage .IncodePhoneInputWrapper.IncodePhoneInputWrapperError {
   border-color: var(--color-input-border-negative, var(--input-border-negative));
 }
 
-.IncodePhoneInputWrapper.IncodePhoneInputWrapperDisabled {
+.IncodePhonePage .IncodePhoneInputWrapper.IncodePhoneInputWrapperDisabled {
   border-color: var(--color-input-border-disabled, var(--input-border-disabled));
   background-color: var(--color-input-surface-disabled, var(--input-surface-disabled));
 }
 
-.IncodePhoneCountrySelector {
+.IncodePhonePage .IncodePhoneCountrySelector {
   border-radius: var(--radius-small, var(--border-radius-small));
   border-style: var(--tw-border-style);
   border-width: 1px;
@@ -76,16 +76,16 @@
   position: static;
 }
 
-.IncodePhoneCountrySelector.IncodePhoneCountrySelectorOpen {
+.IncodePhonePage .IncodePhoneCountrySelector.IncodePhoneCountrySelectorOpen {
   border-color: var(--color-input-border-active, var(--input-border-active));
 }
 
-.IncodePhoneCountrySelector.IncodePhoneCountrySelectorDisabled {
+.IncodePhonePage .IncodePhoneCountrySelector.IncodePhoneCountrySelectorDisabled {
   border-color: var(--color-input-border-disabled, var(--input-border-disabled));
   background-color: var(--color-input-surface-disabled, var(--input-surface-disabled));
 }
 
-.IncodePhoneCountryButton {
+.IncodePhonePage .IncodePhoneCountryButton {
   width: 100%;
   height: 100%;
   padding: var(--spacing-8, var(--spacing-8, 8px));
@@ -107,23 +107,23 @@
   display: flex;
 }
 
-.IncodePhoneCountryButton:disabled {
+.IncodePhonePage .IncodePhoneCountryButton:disabled {
   cursor: not-allowed;
   color: var(--color-input-text-field-disabled, var(--input-text-field-disabled));
 }
 
-.IncodePhoneCountryButton:focus {
+.IncodePhonePage .IncodePhoneCountryButton:focus {
   --tw-outline-style: none;
   outline-style: none;
 }
 
-.IncodePhoneCountryFlag {
+.IncodePhonePage .IncodePhoneCountryFlag {
   font-size: var(--text-24, var(--primitive-typography-size-24));
   --tw-leading: 1;
   line-height: 1;
 }
 
-.IncodePhoneCountryCode {
+.IncodePhonePage .IncodePhoneCountryCode {
   margin-left: var(--spacing-4, var(--spacing-4, 4px));
   font-size: var(--text-18, var(--primitive-typography-size-18));
   --tw-font-weight: var(--font-weight-medium, var(--primitive-typography-weight-medium));
@@ -132,7 +132,7 @@
   color: var(--color-text-body-primary, var(--text-body-primary));
 }
 
-.IncodePhoneCountryArrow {
+.IncodePhonePage .IncodePhoneCountryArrow {
   margin-left: var(--spacing-8, var(--spacing-8, 8px));
   height: var(--spacing-24, var(--spacing-24, 24px));
   width: var(--spacing-24, var(--spacing-24, 24px));
@@ -144,15 +144,15 @@
   transition-duration: .2s;
 }
 
-.IncodePhoneCountryArrowUp {
+.IncodePhonePage .IncodePhoneCountryArrowUp {
   rotate: 180deg;
 }
 
-.IncodePhoneCountryButton:disabled .IncodePhoneCountryArrow {
+.IncodePhonePage .IncodePhoneCountryButton:disabled .IncodePhoneCountryArrow {
   color: var(--color-icon-neutral-300, var(--icon-neutral-300));
 }
 
-.IncodePhoneCountryDropdown {
+.IncodePhonePage .IncodePhoneCountryDropdown {
   top: 100%;
   right: var(--spacing-0, var(--spacing-none, 0px));
   left: var(--spacing-0, var(--spacing-none, 0px));
@@ -170,7 +170,7 @@
   box-shadow: 0 4px 16px #0000001f;
 }
 
-.IncodePhoneCountryOption {
+.IncodePhonePage .IncodePhoneCountryOption {
   cursor: pointer;
   align-items: center;
   gap: var(--spacing-12, var(--spacing-12, 12px));
@@ -192,27 +192,27 @@
   display: flex;
 }
 
-.IncodePhoneCountryOption:hover {
+.IncodePhonePage .IncodePhoneCountryOption:hover {
   background-color: var(--color-surface-neutral-100, var(--surface-neutral-100));
 }
 
-.IncodePhoneCountryOption:focus {
+.IncodePhonePage .IncodePhoneCountryOption:focus {
   background-color: var(--color-surface-neutral-100, var(--surface-neutral-100));
   --tw-outline-style: none;
   outline-style: none;
 }
 
-.IncodePhoneCountryOptionSelected, .IncodePhoneCountryOptionSelected:hover {
+.IncodePhonePage .IncodePhoneCountryOptionSelected, .IncodePhonePage .IncodePhoneCountryOptionSelected:hover {
   background-color: var(--color-surface-brand-50, var(--surface-brand-50));
 }
 
-.IncodePhoneCountryOptionCode {
+.IncodePhonePage .IncodePhoneCountryOptionCode {
   min-width: 52px;
   font-size: var(--text-16, var(--primitive-typography-size-16));
   color: var(--color-text-body-secondary, var(--text-body-secondary));
 }
 
-.IncodePhoneCountryOptionName {
+.IncodePhonePage .IncodePhoneCountryOptionName {
   text-overflow: ellipsis;
   white-space: nowrap;
   font-size: var(--text-16, var(--primitive-typography-size-16));
@@ -221,7 +221,7 @@
   overflow: hidden;
 }
 
-.IncodePhoneInputField {
+.IncodePhonePage .IncodePhoneInputField {
   border-style: var(--tw-border-style);
   border-width: var(--border-width-none, var(--border-none));
   --tw-border-style: none;
@@ -239,18 +239,18 @@
   outline-style: none;
 }
 
-.IncodePhoneInputField::placeholder {
+.IncodePhonePage .IncodePhoneInputField::placeholder {
   --tw-font-weight: var(--font-weight-medium, var(--primitive-typography-weight-medium));
   font-weight: var(--font-weight-medium, var(--primitive-typography-weight-medium));
   color: var(--color-input-text-field-placeholder, var(--input-text-field-placeholder));
 }
 
-.IncodePhoneInputField:disabled {
+.IncodePhonePage .IncodePhoneInputField:disabled {
   cursor: not-allowed;
   color: var(--color-input-text-field-disabled, var(--input-text-field-disabled));
 }
 
-.IncodePhoneInputError {
+.IncodePhonePage .IncodePhoneInputError {
   margin: var(--spacing-0, var(--spacing-none, 0px));
   text-align: center;
   font-size: var(--text-14, var(--primitive-typography-size-14));
@@ -259,7 +259,7 @@
   color: var(--color-input-text-helper-negative, var(--input-text-helper-negative));
 }
 
-.IncodePhoneInputOptIn {
+.IncodePhonePage .IncodePhoneInputOptIn {
   cursor: pointer;
   align-items: center;
   gap: var(--spacing-8, var(--spacing-8, 8px));
@@ -268,7 +268,7 @@
   display: flex;
 }
 
-.IncodePhoneInputOptIn input[type="checkbox"] {
+.IncodePhonePage .IncodePhoneInputOptIn input[type="checkbox"] {
   cursor: pointer;
   border-radius: var(--radius-checkbox, var(--checkbox-border-radius));
   width: 18px;
@@ -276,7 +276,7 @@
   accent-color: var(--color-checkbox-surface-selected, var(--checkbox-surface-selected));
 }
 
-.IncodePhoneInputOptIn span {
+.IncodePhonePage .IncodePhoneInputOptIn span {
   --tw-font-weight: var(--font-weight-medium, var(--primitive-typography-weight-medium));
   font-weight: var(--font-weight-medium, var(--primitive-typography-weight-medium));
   -webkit-user-select: none;

package/dist/selfie/selfie.es.js

@@ -1,11 +1,11 @@
-import { u as e, S as c, B as C, b as _, L as O, a as w } from "../button-DeMZ_34N.js";
+import { u as e, S as c, B as C, b as _, L as w, a as O } from "../button-DeMZ_34N.js";
 import { createSelfieManager as M } from "@incodetech/core/selfie";
 import { u as d, T as y } from "../title-ng7q7YDh.js";
-import { P as u, g as A, r as P, a as x, I as B } from "../incodeModule-BF5MX9GT.js";
-import { getBrowser as N, getDeviceClass as b } from "@incodetech/core";
+import { P as u, g as A, r as P, a as b, I as x } from "../incodeModule-Ct9jp5k6.js";
+import { getBrowser as B, getDeviceClass as N } from "@incodetech/core";
 import { k as E, g as K, d as v, A as T, y as I } from "../vendor-preact-CK0WeTOR.js";
 /* empty css                      */
-const F = "https://assets.incode.com/@incodetech/ui/2.0.0-alpha.1/assets/permissions-img-83924a96.svg", V = "https://assets.incode.com/@incodetech/ui/2.0.0-alpha.1/assets/android-dots-icon-846d605c.svg", k = "https://assets.incode.com/@incodetech/ui/2.0.0-alpha.1/assets/android-settings-icon-8bd49c8d.svg", H = "https://assets.incode.com/@incodetech/ui/2.0.0-alpha.1/assets/android-toggle-icon-03e22d7a.svg", U = "https://assets.incode.com/@incodetech/ui/2.0.0-alpha.1/assets/chrome-icon-4c3b130c.svg", z = () => /* @__PURE__ */ e(
+const F = "https://assets.incode.com/@incodetech/web/2.0.0-alpha.4/assets/permissions-img-83924a96.svg", V = "https://assets.incode.com/@incodetech/web/2.0.0-alpha.4/assets/android-dots-icon-846d605c.svg", k = "https://assets.incode.com/@incodetech/web/2.0.0-alpha.4/assets/android-settings-icon-8bd49c8d.svg", H = "https://assets.incode.com/@incodetech/web/2.0.0-alpha.4/assets/android-toggle-icon-03e22d7a.svg", U = "https://assets.incode.com/@incodetech/web/2.0.0-alpha.4/assets/chrome-icon-4c3b130c.svg", z = () => /* @__PURE__ */ e(
   "svg",
   {
     class: "IncodeBoldWithArrowIcon",
@@ -82,7 +82,7 @@ const F = "https://assets.incode.com/@incodetech/ui/2.0.0-alpha.1/assets/permiss
   }
   return o;
 }), G = () => {
-  const { t: i } = d(), n = N(), t = Q(n);
+  const { t: i } = d(), n = B(), t = Q(n);
   return /* @__PURE__ */ e("div", { class: "IncodeDeniedInstructionsContainer", children: /* @__PURE__ */ e("div", { class: "IncodeDeniedDesktopContainer", children: t.map((s, o) => /* @__PURE__ */ e(E, { children: [
     /* @__PURE__ */ e("div", { class: "IncodeDeniedDesktopStep", children: [
       /* @__PURE__ */ e($, { number: o + 1 }),
@@ -90,7 +90,7 @@ const F = "https://assets.incode.com/@incodetech/ui/2.0.0-alpha.1/assets/permiss
     ] }),
     o < t.length - 1 ? /* @__PURE__ */ e("div", { class: "IncodeNumberedStepConnector" }) : null
   ] }, s)) }) });
-}, j = "https://assets.incode.com/@incodetech/ui/2.0.0-alpha.1/assets/camera-ios-9eac3be1.svg", R = "https://assets.incode.com/@incodetech/ui/2.0.0-alpha.1/assets/safari-icon-7823d73d.svg", q = "https://assets.incode.com/@incodetech/ui/2.0.0-alpha.1/assets/settings-icon-9743cbda.svg", X = "https://assets.incode.com/@incodetech/ui/2.0.0-alpha.1/assets/toggle-icon-351f86ce.svg", J = () => {
+}, j = "https://assets.incode.com/@incodetech/web/2.0.0-alpha.4/assets/camera-ios-9eac3be1.svg", R = "https://assets.incode.com/@incodetech/web/2.0.0-alpha.4/assets/safari-icon-7823d73d.svg", q = "https://assets.incode.com/@incodetech/web/2.0.0-alpha.4/assets/settings-icon-9743cbda.svg", X = "https://assets.incode.com/@incodetech/web/2.0.0-alpha.4/assets/toggle-icon-351f86ce.svg", J = () => {
   const { t: i } = d(), n = [
     {
       icon: q,
@@ -141,7 +141,7 @@ const F = "https://assets.incode.com/@incodetech/ui/2.0.0-alpha.1/assets/permiss
     ] })
   ] }, t.boldKey)) }) });
 }, ee = () => {
-  const i = b();
+  const i = N();
   return i === "ios" ? /* @__PURE__ */ e(J, {}) : i === "android" ? /* @__PURE__ */ e(W, {}) : /* @__PURE__ */ e(G, {});
 }, ie = ({ onRefresh: i }) => {
   const { t: n } = d();
@@ -152,7 +152,7 @@ const F = "https://assets.incode.com/@incodetech/ui/2.0.0-alpha.1/assets/permiss
     /* @__PURE__ */ e(ee, {}),
     /* @__PURE__ */ e("div", { class: "IncodeDeniedActions", children: /* @__PURE__ */ e(C, { onClick: i, children: n("idv2.permissions.denied.refreshPage") }) })
   ] });
-}, ne = "https://assets.incode.com/@incodetech/ui/2.0.0-alpha.1/assets/bank-card-icon-6af62350.svg", te = "https://assets.incode.com/@incodetech/ui/2.0.0-alpha.1/assets/camera-icon-b2fc4c1c.svg", se = "https://assets.incode.com/@incodetech/ui/2.0.0-alpha.1/assets/check-icon-b1d1ddd8.svg", oe = "https://assets.incode.com/@incodetech/ui/2.0.0-alpha.1/assets/password-icon-f5257b0b.svg", re = "https://assets.incode.com/@incodetech/ui/2.0.0-alpha.1/assets/warning-icon-f3eadd0b.svg", ce = [
+}, ne = "https://assets.incode.com/@incodetech/web/2.0.0-alpha.4/assets/bank-card-icon-6af62350.svg", te = "https://assets.incode.com/@incodetech/web/2.0.0-alpha.4/assets/camera-icon-b2fc4c1c.svg", se = "https://assets.incode.com/@incodetech/web/2.0.0-alpha.4/assets/check-icon-b1d1ddd8.svg", oe = "https://assets.incode.com/@incodetech/web/2.0.0-alpha.4/assets/password-icon-f5257b0b.svg", re = "https://assets.incode.com/@incodetech/web/2.0.0-alpha.4/assets/warning-icon-f3eadd0b.svg", ce = [
   {
     icon: te,
     textKey: "idv2.permissions.learnMorePage.instructions.1"
@@ -772,19 +772,19 @@ const F = "https://assets.incode.com/@incodetech/ui/2.0.0-alpha.1/assets/permiss
   const { t: i } = d();
   return /* @__PURE__ */ e(u, { className: "IncodeCaptureUploadingPage", children: /* @__PURE__ */ e("div", { class: "IncodeCaptureUploadingContainer", children: [
     /* @__PURE__ */ e(c, { size: 160 }),
-    /* @__PURE__ */ e("div", { class: "IncodeCaptureUploadingIconContainer", children: /* @__PURE__ */ e(O, { size: 64 }) }),
+    /* @__PURE__ */ e("div", { class: "IncodeCaptureUploadingIconContainer", children: /* @__PURE__ */ e(w, { size: 64 }) }),
     /* @__PURE__ */ e(c, { size: 16 }),
     /* @__PURE__ */ e("h2", { class: "IncodeCaptureUploadingTitle", children: i("idv2.capture.processing.uploading") })
   ] }) });
 };
 let g = null;
-function Oe() {
+function we() {
   return g || (g = new Promise((i, n) => {
     const t = document.createElement("script");
     t.src = "https://cdn.jsdelivr.net/npm/lottie-web@5.13.0/build/player/lottie_light.min.js", t.onload = () => i(window.lottie), t.onerror = n, document.head.appendChild(t);
   }), g);
 }
-function we({
+function Oe({
   animationData: i,
   loop: n = !0,
   autoplay: t = !0,
@@ -810,7 +810,7 @@ function we({
   }, [i, n, t]), I(() => {
     if (!a.current) return;
     let p;
-    return Oe().then((m) => {
+    return we().then((m) => {
       p = m.loadAnimation(l.current), r && p.addEventListener("complete", r);
     }), () => {
       p && (r && p.removeEventListener("complete", r), p.destroy());
@@ -829,7 +829,7 @@ const Me = ({
   const l = A("--surface-brand-500");
   return /* @__PURE__ */ e(u, { className: "IncodeTutorialPage", title: n, subtitle: t, children: [
     /* @__PURE__ */ e("div", { class: "IncodeBaseTutorialContainer", children: /* @__PURE__ */ e("div", { class: "IncodeBaseTutorialAnimationContainer", children: /* @__PURE__ */ e(
-      we,
+      Oe,
       {
         animationData: P(
           i,
@@ -878,7 +878,7 @@ const Me = ({
   onFinish: n,
   onError: t
 }) => {
-  const [s, o] = w(() => M({ config: i }));
+  const [s, o] = O(() => M({ config: i }));
   return s.status === "idle" || s.status === "loading" ? null : s.status === "tutorial" ? /* @__PURE__ */ e(ye, { manager: o }) : s.status === "permissions" ? /* @__PURE__ */ e(
     de,
     {
@@ -886,8 +886,8 @@ const Me = ({
       permissionStatus: s.permissionStatus
     }
   ) : s.status === "capture" ? /* @__PURE__ */ e(De, { manager: o, state: s, onFinish: () => n?.() }) : s.status === "finished" ? (n?.(), null) : s.status === "closed" ? (t?.(void 0), null) : (s.status === "error" && t?.(s.error), null);
-}, Pe = ({ config: i, onFinish: n, onError: t }) => /* @__PURE__ */ e(B, { children: i ? /* @__PURE__ */ e(Ae, { config: i, onFinish: n, onError: t }) : null });
-x(Pe, "incode-selfie");
+}, Pe = ({ config: i, onFinish: n, onError: t }) => /* @__PURE__ */ e(x, { children: i ? /* @__PURE__ */ e(Ae, { config: i, onFinish: n, onError: t }) : null });
+b(Pe, "incode-selfie");
 export {
   Pe as Selfie
 };

package/dist/selfie/styles.css

@@ -180,57 +180,6 @@
   }
 }
 
-.IncodeComponent, .IncodeComponent * {
-  box-sizing: border-box;
-}
-
-.IncodeComponent {
-  font-family: var(--primitive-typography-family-dm-sans), sans-serif;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-  text-rendering: optimizeLegibility;
-  color: var(--text-body-primary);
-  width: 100%;
-  height: 100%;
-  margin: 0;
-  padding: 0;
-}
-
-.IncodeComponent *, .IncodeComponent :after, .IncodeComponent :before, .IncodeComponent ::backdrop {
-  box-sizing: border-box;
-  border: 0 solid;
-  margin: 0;
-  padding: 0;
-}
-
-.IncodeComponent ::file-selector-button {
-  box-sizing: border-box;
-  border: 0 solid;
-  margin: 0;
-  padding: 0;
-}
-
-.IncodeComponent h1, .IncodeComponent h2, .IncodeComponent h3, .IncodeComponent h4, .IncodeComponent h5, .IncodeComponent h6 {
-  font-size: inherit;
-  font-weight: inherit;
-  margin: 0;
-  padding: 0;
-}
-
-.IncodeComponent ol, .IncodeComponent ul, .IncodeComponent menu {
-  list-style: none;
-}
-
-.IncodeComponent img, .IncodeComponent svg, .IncodeComponent video, .IncodeComponent canvas, .IncodeComponent audio, .IncodeComponent iframe, .IncodeComponent embed, .IncodeComponent object {
-  vertical-align: middle;
-  display: block;
-}
-
-.IncodeComponent img, .IncodeComponent video {
-  max-width: 100%;
-  height: auto;
-}
-
 @property --tw-rotate-x {
   syntax: "*";
   inherits: false