@incodetech/web 0.0.0-dev-20260318-7381409 → 0.0.0-dev-20260318-7837fc0

package/dist/base.css

@@ -586,6 +586,60 @@
 .IncodeInput[type="date"][data-has-value="true"] {
   color: var(--color-input-text-field-default, var(--input-text-field-default));
 }
+.IncodeTextArea {
+  width: 100%;
+  max-width: 420px;
+  min-height: 56px;
+  font-family: var(--typography-input-dropdown-family);
+  font-size: var(--typography-input-dropdown-m-size);
+  font-weight: var(--typography-input-dropdown-m-weight);
+  line-height: var(--typography-input-dropdown-m-line-height);
+  letter-spacing: var(--typography-input-dropdown-m-letter-spacing);
+  background-color: var(--color-input-surface-default, var(--input-surface-default));
+  color: var(--color-input-text-field-default, var(--input-text-field-default));
+  border-radius: var(--radius-input, var(--input-border-radius));
+  border-style: var(--tw-border-style);
+  border-width: 1px;
+  border-color: var(--color-input-border-default, var(--input-border-default));
+  padding: var(--spacing-16, var(--spacing-16, 16px));
+  transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
+  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));
+  transition-duration: var(--tw-duration, var(--default-transition-duration, .15s));
+  --tw-duration: .2s;
+  --tw-outline-style: none;
+  resize: vertical;
+  outline-style: none;
+  transition-duration: .2s;
+}
+.IncodeTextArea::placeholder {
+  color: var(--color-input-text-field-placeholder, var(--input-text-field-placeholder));
+}
+.IncodeTextArea:disabled {
+  border-color: var(--color-input-border-disabled, var(--input-border-disabled));
+  background-color: var(--color-input-surface-disabled, var(--input-surface-disabled));
+  cursor: not-allowed;
+  color: var(--color-input-text-field-disabled, var(--input-text-field-disabled));
+  resize: none;
+  opacity: 1;
+}
+.IncodeTextArea:focus {
+  border-style: var(--tw-border-style);
+  border-width: 2px;
+  border-color: var(--color-input-border-focus, var(--input-border-focus));
+  background-color: var(--color-input-surface-active, var(--input-surface-active));
+}
+.IncodeTextArea:active:not(:disabled) {
+  border-color: var(--color-input-border-active, var(--input-border-active));
+  background-color: var(--color-input-surface-active, var(--input-surface-active));
+}
+.IncodeTextArea[aria-invalid="true"] {
+  border-color: var(--color-input-border-negative, var(--input-border-negative));
+}
+.IncodeTextArea[aria-invalid="true"]:focus {
+  border-style: var(--tw-border-style);
+  border-width: 2px;
+  border-color: var(--color-input-border-negative, var(--input-border-negative));
+}
 .IncodeInputComposed {
   width: 100%;
   max-width: 420px;
@@ -659,6 +713,57 @@
   font-family: inherit;
   display: inline-block;
 }
+.IncodeTextAreaComposed {
+  width: 100%;
+  max-width: 420px;
+}
+.IncodeTextAreaComposedLabel {
+  font-family: var(--typography-label-family);
+  font-size: var(--typography-label-m-size);
+  font-weight: var(--typography-label-m-weight);
+  line-height: var(--typography-label-m-line-height);
+  letter-spacing: var(--typography-label-m-letter-spacing);
+  color: var(--color-input-text-label-default, var(--input-text-label-default));
+  margin: var(--spacing-0, var(--spacing-none, 0px));
+  margin-bottom: var(--spacing-8, var(--spacing-8, 8px));
+  padding: var(--spacing-0, var(--spacing-none, 0px));
+  display: inline-block;
+}
+.IncodeTextAreaComposedRequired {
+  color: var(--color-input-text-helper-negative, var(--input-text-helper-negative));
+}
+.IncodeTextAreaComposedWrapper {
+  position: relative;
+}
+.IncodeTextAreaComposedErrorWrapper, .IncodeTextAreaComposedHelperWrapper {
+  margin-top: var(--spacing-8, var(--spacing-8, 8px));
+  align-items: center;
+  display: flex;
+}
+.IncodeTextAreaComposedIconWrapper {
+  margin-right: var(--spacing-4, var(--spacing-4, 4px));
+  display: inline-block;
+}
+.IncodeTextAreaComposedError {
+  margin: var(--spacing-0, var(--spacing-none, 0px));
+  color: var(--color-input-text-helper-negative, var(--input-text-helper-negative));
+  font-family: var(--typography-body-family);
+  font-size: var(--typography-body-m-regular-size);
+  font-weight: var(--typography-body-m-regular-weight);
+  line-height: var(--typography-body-m-regular-line-height);
+  letter-spacing: var(--typography-body-m-regular-letter-spacing);
+  display: inline-block;
+}
+.IncodeTextAreaComposedHelper {
+  margin: var(--spacing-0, var(--spacing-none, 0px));
+  color: var(--color-input-text-helper-default, var(--input-text-helper-default));
+  font-family: var(--typography-body-family);
+  font-size: var(--typography-body-m-regular-size);
+  font-weight: var(--typography-body-m-regular-weight);
+  line-height: var(--typography-body-m-regular-line-height);
+  letter-spacing: var(--typography-body-m-regular-letter-spacing);
+  display: inline-block;
+}
 .IncodeDropdownComposed {
   width: 100%;
   max-width: 420px;
@@ -2047,6 +2152,66 @@
     height: 840px;
   }
 }
+@media (min-width: 40rem) {
+  .IncodePageContainer .IncodePageInner {
+    max-width: 40rem;
+  }
+}
+@media (min-width: 48rem) {
+  .IncodePageContainer .IncodePageInner {
+    max-width: 48rem;
+  }
+}
+@media (min-width: 64rem) {
+  .IncodePageContainer .IncodePageInner {
+    max-width: 64rem;
+  }
+}
+@media (min-width: 80rem) {
+  .IncodePageContainer .IncodePageInner {
+    max-width: 80rem;
+  }
+}
+@media (min-width: 96rem) {
+  .IncodePageContainer .IncodePageInner {
+    max-width: 96rem;
+  }
+}
+@media (min-width: 48rem) {
+  .IncodePageContainer .IncodePageInner {
+    height: 840px;
+  }
+}
+@media (min-width: 40rem) {
+  .IncodePageContainer .IncodePageInner {
+    max-width: 40rem;
+  }
+}
+@media (min-width: 48rem) {
+  .IncodePageContainer .IncodePageInner {
+    max-width: 48rem;
+  }
+}
+@media (min-width: 64rem) {
+  .IncodePageContainer .IncodePageInner {
+    max-width: 64rem;
+  }
+}
+@media (min-width: 80rem) {
+  .IncodePageContainer .IncodePageInner {
+    max-width: 80rem;
+  }
+}
+@media (min-width: 96rem) {
+  .IncodePageContainer .IncodePageInner {
+    max-width: 96rem;
+  }
+}
+@media (min-width: 48rem) {
+  .IncodePageContainer .IncodePageInner {
+    height: 840px;
+  }
+}
 .IncodePageContainer .IncodePageInner {
   width: 100%;
 }

package/dist/extensibility.es.js

@@ -1,28 +1,28 @@
-import { u as e, d as l, B as V } from "./button-Ca1tRSTI.js";
-import { I as Y, e as _, S as N, a as ee, b as ae } from "./button-Ca1tRSTI.js";
-import { s as re, u as te } from "./uiConfig-Z6RT23Sl.js";
-import { P as se } from "./page-BVHG3h0V.js";
-import { C as ie, F as le, M as de } from "./fileIcon-DOyMcRWU.js";
-import { S as ue, T as he, a as Ce, b as xe, c as me, d as Ie } from "./spinner-Cx3FPUCD.js";
-import { P as be } from "./processing-CDgOueI3.js";
-import { E as ve } from "./errorContent-yUAdbZ5o.js";
-import { F as ye, V as we } from "./formField-FeX9N4c8.js";
-import { a as Be, C as Le, c as Me, b as Se, e as Fe, d as De, H as He, L as Pe, P as Ve } from "./captureFooter-X2qN1773.js";
-import { a as Oe, I as Re } from "./inputComposed-BHi-MSpP.js";
-import { O as je } from "./otpInput-DdkvlvCS.js";
-import { D as E, d as O, A as R, y as W, q as j } from "./vendor-preact-BXf0bkEs.js";
-import { E as U } from "./errorIcon-BL647nVh.js";
-import { P as $e } from "./phoneInputComposed-CwtJKvGh.js";
-import { D as Ae, S as Ze } from "./dropdownComposed-B5ZuQS8C.js";
-import { C as Ge, D as Je } from "./dateInputComposed-CvFmQpJ0.js";
-import { B as Qe, L as Xe, P as Ye } from "./permissions-DwF2Ez1N.js";
-import { C as Ne } from "./chevronDown-BUaOuf9J.js";
-import { C as aa } from "./closeIcon-BM7WLbKp.js";
-import { S as ra } from "./successIcon-BybULRRU.js";
-import { c as na, a as sa, g as ca } from "./countries-C9bhJe4u.js";
-import { C as la, T as da } from "./tutorial-Dagmccxh.js";
-import { a as ua, C as ha, b as Ca, I as xa, F as ma, T as Ia } from "./flipAnimation-DoMQoFPb.js";
-const $ = ({ size: a = 28 }) => /* @__PURE__ */ e(
+import { u as e, d as i, B as V } from "./button-Ca1tRSTI.js";
+import { I as ae, e as re, S as oe, a as se, b as te } from "./button-Ca1tRSTI.js";
+import { s as ce, u as de } from "./uiConfig-Z6RT23Sl.js";
+import { P as le } from "./page-BVHG3h0V.js";
+import { C as he, F as Ce, M as ue } from "./fileIcon-DOyMcRWU.js";
+import { S as xe, T as Ie, a as be, b as fe, c as ve, d as ge } from "./spinner-Cx3FPUCD.js";
+import { P as Te } from "./processing-CDgOueI3.js";
+import { E as we } from "./errorContent-yUAdbZ5o.js";
+import { F as Be, V as Le } from "./formField-FeX9N4c8.js";
+import { a as Se, C as Fe, c as He, b as De, e as Ee, d as Pe, H as Ve, L as We, P as $e } from "./captureFooter-X2qN1773.js";
+import { a as Oe, I as je } from "./inputComposed-BHi-MSpP.js";
+import { O as qe } from "./otpInput-DdkvlvCS.js";
+import { D as f, d as W, A as $, y as R, q as O } from "./vendor-preact-BXf0bkEs.js";
+import { E as w } from "./errorIcon-BL647nVh.js";
+import { P as Ne } from "./phoneInputComposed-CwtJKvGh.js";
+import { D as Ge, S as Je } from "./dropdownComposed-B5ZuQS8C.js";
+import { C as Qe, D as Xe } from "./dateInputComposed-CvFmQpJ0.js";
+import { S as j } from "./successIcon-BybULRRU.js";
+import { B as _e, L as ea, P as aa } from "./permissions-DwF2Ez1N.js";
+import { C as oa } from "./chevronDown-BUaOuf9J.js";
+import { C as ta } from "./closeIcon-BM7WLbKp.js";
+import { c as ca, a as da, g as ia } from "./countries-C9bhJe4u.js";
+import { C as pa, T as ha } from "./tutorial-Dagmccxh.js";
+import { a as ua, C as ma, b as xa, I as Ia, F as ba, T as fa } from "./flipAnimation-DoMQoFPb.js";
+const U = ({ size: a = 28 }) => /* @__PURE__ */ e(
   "svg",
   {
     width: a,
@@ -44,9 +44,9 @@ const $ = ({ size: a = 28 }) => /* @__PURE__ */ e(
       )
     ]
   }
-), G = ({
+), Q = ({
   size: a = 14,
-  class: o
+  class: r
 }) => /* @__PURE__ */ e(
   "svg",
   {
@@ -55,7 +55,7 @@ const $ = ({ size: a = 28 }) => /* @__PURE__ */ e(
     viewBox: "0 0 14 14",
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg",
-    class: o,
+    class: r,
     "aria-hidden": "true",
     children: /* @__PURE__ */ e(
       "path",
@@ -68,37 +68,37 @@ const $ = ({ size: a = 28 }) => /* @__PURE__ */ e(
       }
     )
   }
-), J = E(
+), X = f(
   ({
     id: a,
-    label: o,
-    size: t = "m",
-    checked: r,
-    defaultChecked: c,
-    disabled: i = !1,
-    required: n = !1,
-    name: b,
-    value: g,
-    onChange: v,
-    error: s,
-    helper: d,
-    showErrorIcon: k = !0,
+    label: r,
+    size: s = "m",
+    checked: o,
+    defaultChecked: t,
+    disabled: n = !1,
+    required: c = !1,
+    name: l,
+    value: u,
+    onChange: m,
+    error: d,
+    helper: p,
+    showErrorIcon: C = !0,
     class: h,
-    "aria-label": y,
-    "aria-labelledby": C,
-    "aria-describedby": w,
-    "aria-invalid": T,
-    ...B
-  }, L) => {
-    const [M, S] = O(!!c), p = r !== void 0, x = p ? !!r : M, u = !!i, F = !!n, D = typeof h == "string" ? h : void 0, H = (f) => {
-      p || S(f.target.checked), v?.(f);
-    }, m = d ? `${a}-helper` : void 0, I = s ? `${a}-error` : void 0, P = [w, I, m].filter(Boolean).join(" ") || void 0;
-    return /* @__PURE__ */ e("div", { class: l("IncodeCheckbox", D), children: [
+    "aria-label": x,
+    "aria-labelledby": v,
+    "aria-describedby": A,
+    "aria-invalid": B,
+    ...L
+  }, M) => {
+    const [S, F] = W(!!t), I = o !== void 0, g = I ? !!o : S, b = !!n, H = !!c, D = typeof h == "string" ? h : void 0, E = (y) => {
+      I || F(y.target.checked), m?.(y);
+    }, k = p ? `${a}-helper` : void 0, T = d ? `${a}-error` : void 0, P = [A, T, k].filter(Boolean).join(" ") || void 0;
+    return /* @__PURE__ */ e("div", { class: i("IncodeCheckbox", D), children: [
       /* @__PURE__ */ e(
         "label",
         {
-          class: l("IncodeCheckboxLabel", {
-            IncodeCheckboxLabelDisabled: u
+          class: i("IncodeCheckboxLabel", {
+            IncodeCheckboxLabelDisabled: b
           }),
           htmlFor: a,
           children: [
@@ -106,105 +106,185 @@ const $ = ({ size: a = 28 }) => /* @__PURE__ */ e(
               /* @__PURE__ */ e(
                 "input",
                 {
-                  ref: L,
+                  ref: M,
                   type: "checkbox",
                   class: "IncodeCheckboxInput",
                   id: a,
-                  name: b,
-                  value: g,
-                  ...p ? { checked: r } : { defaultChecked: c },
-                  disabled: i,
-                  required: n,
-                  onChange: H,
-                  "aria-label": y,
-                  "aria-labelledby": C,
+                  name: l,
+                  value: u,
+                  ...I ? { checked: o } : { defaultChecked: t },
+                  disabled: n,
+                  required: c,
+                  onChange: E,
+                  "aria-label": x,
+                  "aria-labelledby": v,
                   "aria-describedby": P,
-                  "aria-invalid": T || !!s,
-                  "aria-required": F,
-                  ...B
+                  "aria-invalid": B || !!d,
+                  "aria-required": H,
+                  ...L
                 }
               ),
               /* @__PURE__ */ e(
                 "div",
                 {
-                  class: l("IncodeCheckboxVisual", {
-                    IncodeCheckboxVisualChecked: x,
-                    IncodeCheckboxVisualDisabled: u,
-                    IncodeCheckboxVisualError: !!s
+                  class: i("IncodeCheckboxVisual", {
+                    IncodeCheckboxVisualChecked: g,
+                    IncodeCheckboxVisualDisabled: b,
+                    IncodeCheckboxVisualError: !!d
                   }),
-                  children: x && /* @__PURE__ */ e($, { size: 28 })
+                  children: g && /* @__PURE__ */ e(U, { size: 28 })
                 }
               )
             ] }),
-            o && /* @__PURE__ */ e(
+            r && /* @__PURE__ */ e(
               "span",
               {
-                class: l("IncodeCheckboxText", {
-                  IncodeCheckboxTextS: t === "s",
-                  IncodeCheckboxTextM: t === "m",
-                  IncodeCheckboxTextDisabled: u
+                class: i("IncodeCheckboxText", {
+                  IncodeCheckboxTextS: s === "s",
+                  IncodeCheckboxTextM: s === "m",
+                  IncodeCheckboxTextDisabled: b
                 }),
-                "aria-hidden": C ? "true" : void 0,
+                "aria-hidden": v ? "true" : void 0,
                 children: [
-                  o,
-                  n && /* @__PURE__ */ e("span", { class: "IncodeCheckboxRequired", "aria-hidden": "true", children: "*" })
+                  r,
+                  c && /* @__PURE__ */ e("span", { class: "IncodeCheckboxRequired", "aria-hidden": "true", children: "*" })
                 ]
               }
             )
           ]
         }
       ),
-      s && /* @__PURE__ */ e(
+      d && /* @__PURE__ */ e(
         "div",
         {
           class: "IncodeCheckboxMessageWrapper",
           "data-testid": `${a}-error-wrapper`,
           children: [
-            k && /* @__PURE__ */ e("div", { class: "IncodeCheckboxIconWrapper", children: /* @__PURE__ */ e(U, { size: 17 }) }),
-            /* @__PURE__ */ e("p", { id: I, class: "IncodeCheckboxErrorText", children: s })
+            C && /* @__PURE__ */ e("div", { class: "IncodeCheckboxIconWrapper", children: /* @__PURE__ */ e(w, { size: 17 }) }),
+            /* @__PURE__ */ e("p", { id: T, class: "IncodeCheckboxErrorText", children: d })
           ]
         }
       ),
-      d && !s && /* @__PURE__ */ e(
+      p && !d && /* @__PURE__ */ e(
         "div",
         {
           class: "IncodeCheckboxMessageWrapper",
           "data-testid": `${a}-helper-wrapper`,
-          children: /* @__PURE__ */ e("p", { id: m, class: "IncodeCheckboxHelperText", children: d })
+          children: /* @__PURE__ */ e("p", { id: k, class: "IncodeCheckboxHelperText", children: p })
+        }
+      )
+    ] });
+  }
+), q = f(
+  (a, r) => {
+    const { class: s, rows: o = 4, ...t } = a;
+    return /* @__PURE__ */ e(
+      "textarea",
+      {
+        ...t,
+        ref: r,
+        rows: o,
+        class: i("IncodeTextArea", s)
+      }
+    );
+  }
+), z = f(
+  ({
+    id: a,
+    label: r,
+    "aria-label": s,
+    error: o,
+    showErrorIcon: t,
+    helper: n,
+    showHelperIcon: c,
+    required: l,
+    rows: u = 4,
+    class: m,
+    ...d
+  }, p) => {
+    const C = `${a}-helper`, h = `${a}-error`, x = [n ? C : null, o ? h : null].filter(Boolean).join(" ");
+    return /* @__PURE__ */ e("div", { class: i("IncodeTextAreaComposed", m), children: [
+      r && /* @__PURE__ */ e(
+        "label",
+        {
+          class: "IncodeTextAreaComposedLabel",
+          htmlFor: a,
+          "data-testid": `${a}-label`,
+          children: [
+            r,
+            l && /* @__PURE__ */ e("span", { class: "IncodeTextAreaComposedRequired", children: " *" })
+          ]
+        }
+      ),
+      /* @__PURE__ */ e("div", { class: "IncodeTextAreaComposedWrapper", children: /* @__PURE__ */ e(
+        q,
+        {
+          id: a,
+          rows: u,
+          ...d,
+          ref: p,
+          required: l,
+          ...!r && s ? { "aria-label": s } : {},
+          "aria-describedby": x || void 0,
+          "aria-required": l ? "true" : void 0,
+          "aria-invalid": o ? "true" : void 0
+        }
+      ) }),
+      o && /* @__PURE__ */ e(
+        "div",
+        {
+          class: "IncodeTextAreaComposedErrorWrapper",
+          "data-testid": `${a}-error-wrapper`,
+          children: [
+            t && /* @__PURE__ */ e("div", { class: "IncodeTextAreaComposedIconWrapper", children: /* @__PURE__ */ e(w, { size: 17 }) }),
+            /* @__PURE__ */ e("p", { id: h, class: "IncodeTextAreaComposedError", children: o })
+          ]
+        }
+      ),
+      n && !o && /* @__PURE__ */ e(
+        "div",
+        {
+          class: "IncodeTextAreaComposedHelperWrapper",
+          "data-testid": `${a}-helper-wrapper`,
+          children: [
+            c && /* @__PURE__ */ e("div", { class: "IncodeTextAreaComposedIconWrapper", children: /* @__PURE__ */ e(j, { size: 17 }) }),
+            /* @__PURE__ */ e("p", { id: C, class: "IncodeTextAreaComposedHelper", children: n })
+          ]
         }
       )
     ] });
   }
 );
-function q(a) {
+z.displayName = "TextAreaComposed";
+function N(a) {
   if (a.readyState < 2 || a.videoWidth === 0 || a.videoHeight === 0)
     return null;
-  const o = document.createElement("canvas");
-  o.width = a.videoWidth, o.height = a.videoHeight;
-  const t = o.getContext("2d");
-  return t ? (t.drawImage(a, 0, 0), o.toDataURL("image/jpeg", 0.92).split(",")[1] ?? null) : null;
+  const r = document.createElement("canvas");
+  r.width = a.videoWidth, r.height = a.videoHeight;
+  const s = r.getContext("2d");
+  return s ? (s.drawImage(a, 0, 0), r.toDataURL("image/jpeg", 0.92).split(",")[1] ?? null) : null;
 }
-const K = ({
+const Y = ({
   stream: a,
-  onCapture: o,
-  disabled: t
+  onCapture: r,
+  disabled: s
 }) => {
-  const r = R(null);
-  W(() => {
-    r.current && a && (r.current.srcObject = a, r.current.play().catch(() => {
+  const o = $(null);
+  R(() => {
+    o.current && a && (o.current.srcObject = a, o.current.play().catch(() => {
     }));
   }, [a]);
-  const c = j(() => {
-    const i = r.current;
-    if (!i || t) return;
-    const n = q(i);
-    n && o(n);
-  }, [o, t]);
+  const t = O(() => {
+    const n = o.current;
+    if (!n || s) return;
+    const c = N(n);
+    c && r(c);
+  }, [r, s]);
   return /* @__PURE__ */ e("div", { class: "IncodeManualCapture", children: [
     /* @__PURE__ */ e("div", { class: "IncodeManualCaptureVideoContainer", children: /* @__PURE__ */ e(
       "video",
       {
-        ref: r,
+        ref: o,
         autoplay: !0,
         playsInline: !0,
         muted: !0,
@@ -217,8 +297,8 @@ const K = ({
       {
         variant: "primary",
         size: "L",
-        onClick: c,
-        disabled: t,
+        onClick: t,
+        disabled: s,
         class: "IncodeManualCaptureButton",
         "aria-label": "Capture document",
         children: "Capture"
@@ -227,65 +307,67 @@ const K = ({
   ] });
 };
 export {
-  Qe as BaseTutorial,
+  _e as BaseTutorial,
   V as Button,
-  Ge as CalendarIcon,
-  Be as CameraFrame,
-  ie as CameraIcon,
-  Le as CameraOverlay,
-  Me as CameraOverlayHeader,
-  Se as CameraView,
-  Fe as CaptureButtonIcon,
-  De as CaptureFooter,
-  J as Checkbox,
-  $ as CheckmarkIcon,
-  Ne as ChevronDown,
-  G as ChevronRightIcon,
-  aa as CloseIcon,
-  Je as DateInputComposed,
-  Ae as DropdownComposed,
-  ve as ErrorContent,
-  U as ErrorIcon,
-  le as FileIcon,
-  ye as FormField,
-  He as HelpIcon,
+  Qe as CalendarIcon,
+  Se as CameraFrame,
+  he as CameraIcon,
+  Fe as CameraOverlay,
+  He as CameraOverlayHeader,
+  De as CameraView,
+  Ee as CaptureButtonIcon,
+  Pe as CaptureFooter,
+  X as Checkbox,
+  U as CheckmarkIcon,
+  oa as ChevronDown,
+  Q as ChevronRightIcon,
+  ta as CloseIcon,
+  Xe as DateInputComposed,
+  Ge as DropdownComposed,
+  we as ErrorContent,
+  w as ErrorIcon,
+  Ce as FileIcon,
+  Be as FormField,
+  Ve as HelpIcon,
   ua as IdCapture,
-  ha as IdChooser,
-  Ca as IdError,
-  xa as IdExpired,
-  ma as IdFlipAnimation,
-  Ia as IdTutorial,
-  Y as IncodeComponent,
+  ma as IdChooser,
+  xa as IdError,
+  Ia as IdExpired,
+  ba as IdFlipAnimation,
+  fa as IdTutorial,
+  ae as IncodeComponent,
   Oe as Input,
-  Re as InputComposed,
-  _ as LandscapeBlocker,
-  Pe as LockIcon,
-  Xe as Lottie,
-  K as ManualCapture,
-  de as Modal,
-  je as OtpInput,
-  se as Page,
-  Ye as Permissions,
-  $e as PhoneInputComposed,
-  be as Processing,
-  Ve as ProgressBar,
-  Ze as SearchIcon,
-  la as SelfieCapture,
-  da as SelfieTutorial,
-  N as Spacer,
-  ue as Spinner,
-  ra as SuccessIcon,
-  he as Title,
-  Ce as TypographyH1,
-  xe as TypographyH3,
-  me as TypographyH4,
-  Ie as TypographyH5,
-  we as VerificationResult,
-  na as countries,
-  sa as getCountryByCallingCode,
-  ca as getCountryByCode,
-  re as setUiConfig,
-  ee as useManager,
-  te as useScreenOrientation,
-  ae as useTranslation
+  je as InputComposed,
+  re as LandscapeBlocker,
+  We as LockIcon,
+  ea as Lottie,
+  Y as ManualCapture,
+  ue as Modal,
+  qe as OtpInput,
+  le as Page,
+  aa as Permissions,
+  Ne as PhoneInputComposed,
+  Te as Processing,
+  $e as ProgressBar,
+  Je as SearchIcon,
+  pa as SelfieCapture,
+  ha as SelfieTutorial,
+  oe as Spacer,
+  xe as Spinner,
+  j as SuccessIcon,
+  q as TextArea,
+  z as TextAreaComposed,
+  Ie as Title,
+  be as TypographyH1,
+  fe as TypographyH3,
+  ve as TypographyH4,
+  ge as TypographyH5,
+  Le as VerificationResult,
+  ca as countries,
+  da as getCountryByCallingCode,
+  ia as getCountryByCode,
+  ce as setUiConfig,
+  se as useManager,
+  de as useScreenOrientation,
+  te as useTranslation
 };

package/dist/types/extensibility.d.ts

@@ -594,6 +594,29 @@ declare type SuccessIconProps = {
     size?: number | string;
 };
 
+export declare const TextArea: FunctionalComponent<PropsWithoutRef<TextAreaProps> & {
+ref?: Ref<HTMLTextAreaElement> | undefined;
+}>;
+
+export declare const TextAreaComposed: FunctionalComponent<PropsWithoutRef<TextAreaComposedProps> & {
+ref?: Ref<HTMLTextAreaElement> | undefined;
+}>;
+
+declare type TextAreaComposedProps = Omit<JSX.IntrinsicElements['textarea'], 'id' | 'class'> & {
+    id: string;
+    label?: string;
+    error?: string;
+    helper?: string;
+    showErrorIcon?: boolean;
+    showHelperIcon?: boolean;
+    rows?: number;
+    class?: string;
+};
+
+declare type TextAreaProps = Omit<JSX.IntrinsicElements['textarea'], 'class'> & {
+    class?: string;
+};
+
 export declare const Title: FunctionalComponent<PropsWithoutRef<TitleProps> & {
 ref?: Ref<HTMLHeadingElement> | undefined;
 }>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@incodetech/web",
-  "version": "0.0.0-dev-20260318-7381409",
+  "version": "0.0.0-dev-20260318-7837fc0",
   "type": "module",
   "main": "./dist/index.es.js",
   "types": "./dist/types/index.d.ts",
@@ -119,7 +119,7 @@
     "preact-custom-element": "^4.6.0",
     "qrcode": "^1.5.4",
     "tailwindcss": "^4.1.17",
-    "@incodetech/core": "0.0.0-dev-20260318-7381409"
+    "@incodetech/core": "0.0.0-dev-20260318-7837fc0"
   },
   "devDependencies": {
     "@microsoft/api-extractor": "^7.53.3",