@ironsource/shared-ui 2.0.0-test.9 → 2.0.1

package/components/input/v4/TextField.vue2.js

@@ -1,32 +1,31 @@
- import "../../../TextField.vue_vue_type_style_index_0_scoped_f4f61aa1_lang.css"; import { defineComponent as H, computed as k, ref as R, openBlock as a, createElementBlock as o, mergeProps as y, unref as t, createBlock as v, createCommentVNode as n, createElementVNode as g, normalizeClass as K, renderSlot as L, withCtx as h, createTextVNode as p, toDisplayString as x, withKeys as G, withModifiers as $, createVNode as u, pushScopeId as M, popScopeId as W } from "vue";
-import w from "../../icon/Icon.vue.js";
-import "../../tooltip/Tooltip.vue2.js";
+ import "../../../TextField.vue_vue_type_style_index_0_scoped_473bab9b_lang.css"; import { defineComponent as K, computed as w, ref as G, openBlock as l, createElementBlock as o, mergeProps as y, unref as t, createBlock as u, createCommentVNode as n, createElementVNode as g, normalizeClass as M, renderSlot as F, withCtx as v, createTextVNode as h, toDisplayString as x, withKeys as W, withModifiers as S, createVNode as b, pushScopeId as j, popScopeId as q } from "vue";
+import p from "../../icon/v4/IconV4.vue.js";
+import J from "../../tooltip/v4/TooltipV4.vue.js";
 import T from "../../typography/v4/Typography.vue.js";
 import { InputTestIdModifiers as f } from "../../../testids/index.js";
-import { inputCommon as j } from "../common/Input.common.js";
-import q from "../../shared/FieldLabel.vue.js";
-import J from "../../shared/FieldHelpText.vue.js";
-import { useTestIdAttrs as Q } from "../../../utils/testIds.js";
-import U from "../../tooltip/Tooltip.vue.js";
-const X = (e) => (M("data-v-f4f61aa1"), e = e(), W(), e), Y = {
+import { inputCommon as Q } from "../common/Input.common.js";
+import U from "../../shared/FieldLabel.vue.js";
+import X from "../../shared/FieldHelpText.vue.js";
+import { useTestIdAttrs as Y } from "../../../utils/testIds.js";
+const Z = (e) => (j("data-v-473bab9b"), e = e(), q(), e), _ = {
   key: 0,
   class: "icon-container icon-before"
-}, Z = ["value", "placeholder", "disabled", "type", "step", "maxlength"], _ = ["onClick"], ee = {
+}, ee = ["value", "placeholder", "disabled", "type", "step", "maxlength"], te = ["onClick"], le = {
   key: 3,
   class: "inline-error"
-}, te = {
+}, ae = {
   key: 6,
   class: "icon-container icon-after"
-}, le = {
+}, ne = {
   key: 1,
   class: "footer"
-}, ae = {
+}, ie = {
   key: 1,
   class: "max-length"
-}, ne = /* @__PURE__ */ X(() => /* @__PURE__ */ g("span", { class: "max-length__divider" }, "/", -1)), ie = {
+}, oe = /* @__PURE__ */ Z(() => /* @__PURE__ */ g("span", { class: "max-length__divider" }, "/", -1)), de = {
   inheritAttrs: !1
-}, he = /* @__PURE__ */ H({
-  ...ie,
+}, xe = /* @__PURE__ */ K({
+  ...de,
   __name: "TextField",
   props: {
     modelValue: { default: "" },
@@ -39,6 +38,7 @@ const X = (e) => (M("data-v-f4f61aa1"), e = e(), W(), e), Y = {
     mandatory: { type: Boolean, default: !1 },
     feedbackVariant: { default: null },
     feedbackText: { default: "" },
+    showFeedbackTextIcon: { type: Boolean, default: !0 },
     autoFocus: { type: Boolean, default: !1 },
     type: { default: "text" },
     hideNumberArrows: { type: Boolean, default: !1 },
@@ -54,30 +54,32 @@ const X = (e) => (M("data-v-f4f61aa1"), e = e(), W(), e), Y = {
     inlineError: { type: Boolean, default: !1 },
     inlineErrorText: { default: "" }
   },
-  emits: ["update:modelValue", "update:showApply"],
-  setup(e, { emit: I }) {
-    const s = e, c = Q(s.testId, f), S = () => {
-      s.showApply ? I("update:showApply", !1) : d?.confirmable && P();
-    }, {
-      onConfirm: P,
-      onEnter: A,
-      inputRef: F,
-      isFocused: b,
-      showLabelInside: B,
+  emits: ["update:modelValue", "apply"],
+  setup(e, { expose: $, emit: I }) {
+    const s = e, c = Y(s.testId, f), P = () => {
+      s.showApply ? I("apply") : d?.confirmable && O();
+    }, z = () => A.value.focus(), {
+      onConfirm: O,
+      onEnter: B,
+      inputRef: A,
+      isFocused: k,
+      showLabelInside: V,
       api: d,
-      labelText: O,
-      sizeClass: z,
-      handleInput: V,
-      handleKeypress: C
-    } = j(s, I), E = k(() => d.value?.value ?? s.modelValue), D = k(() => (E.value || "").length), m = R(!1), N = k(() => m.value && s.type === "password" ? "text" : s.type);
-    return (r, l) => (a(), o("div", y({
+      labelText: D,
+      sizeClass: N,
+      handleInput: C,
+      handleKeypress: E
+    } = Q(s, I), L = w(() => d.value?.value ?? s.modelValue), H = w(() => (L.value || "").length), m = G(!1), R = w(() => m.value && s.type === "password" ? "text" : s.type);
+    return $({
+      manualFocus: z
+    }), (r, a) => (l(), o("div", y({
       class: {
         "input-with-label-container": !0,
         disabled: e.disabled,
         [`variant-${e.feedbackVariant}`]: !0
       }
     }, t(c)[t(f).WRAPPER]), [
-      e.label && e.labelDirection !== "inside" ? (a(), v(q, {
+      e.label && e.labelDirection !== "inside" ? (l(), u(U, {
         key: 0,
         label: e.label,
         mandatory: e.mandatory,
@@ -87,116 +89,122 @@ const X = (e) => (M("data-v-f4f61aa1"), e = e(), W(), e), Y = {
         "test-id": e.testId
       }, null, 8, ["label", "mandatory", "hover-help-text", "hover-help-text-placement", "disabled", "test-id"])) : n("", !0),
       g("div", {
-        class: K({
+        class: M({
           "input-container": !0,
-          "label-inside": t(B),
-          focused: t(b)
+          "label-inside": t(V),
+          focused: t(k)
         })
       }, [
-        r.$slots.iconBefore ? (a(), o("div", Y, [
-          L(r.$slots, "iconBefore", {}, void 0, !0)
+        r.$slots.iconBefore ? (l(), o("div", _, [
+          F(r.$slots, "iconBefore", {}, void 0, !0)
         ])) : n("", !0),
-        e.prefix ? (a(), v(t(T), {
+        e.prefix ? (l(), u(t(T), {
           key: 1,
           class: "prefix-text",
           variant: "body1"
         }, {
-          default: h(() => [
-            p(x(e.prefix), 1)
+          default: v(() => [
+            h(x(e.prefix), 1)
           ]),
           _: 1
         })) : n("", !0),
         g("input", y({ ...r.$attrs, ...t(c)[t(f).FIELD] }, {
           ref_key: "inputRef",
-          ref: F,
-          value: t(E),
-          placeholder: t(O),
+          ref: A,
+          value: t(L),
+          placeholder: t(D),
           disabled: e.disabled || e.viewOnly,
-          type: t(N),
+          type: t(R),
           class: ["input", {
-            [t(z)]: !0,
+            [t(N)]: !0,
             "view-only": e.viewOnly,
-            "label-inside": t(B),
+            "label-inside": t(V),
             "hide-arrows": e.hideNumberArrows,
             "input-type": e.type
           }],
           step: e.step,
           maxlength: e.maxLength,
-          onInput: l[0] || (l[0] = //@ts-ignore
-          (...i) => t(V) && t(V)(...i)),
-          onFocus: l[1] || (l[1] = (i) => b.value = !0),
-          onBlur: l[2] || (l[2] = (i) => b.value = !1),
-          onKeyup: l[3] || (l[3] = G($(
+          onInput: a[0] || (a[0] = //@ts-ignore
+          (...i) => t(C) && t(C)(...i)),
+          onFocus: a[1] || (a[1] = (i) => k.value = !0),
+          onBlur: a[2] || (a[2] = (i) => k.value = !1),
+          onKeyup: a[3] || (a[3] = W(S(
             //@ts-ignore
-            (...i) => t(A) && t(A)(...i),
+            (...i) => t(B) && t(B)(...i),
             ["prevent"]
           ), ["enter"])),
-          onKeypress: l[4] || (l[4] = //@ts-ignore
-          (...i) => t(C) && t(C)(...i))
-        }), null, 16, Z),
-        e.showApply || t(d)?.confirmable && !t(d)?.error?.value ? (a(), o("div", {
+          onKeypress: a[4] || (a[4] = //@ts-ignore
+          (...i) => t(E) && t(E)(...i))
+        }), null, 16, ee),
+        e.showApply || t(d)?.confirmable && !t(d)?.error?.value ? (l(), o("div", {
           key: 2,
           class: "apply-button",
-          onClick: $(S, ["stop", "prevent"])
+          onClick: S(P, ["stop", "prevent"])
         }, [
-          u(t(w), {
-            name: "check-v4",
-            "font-size": "md"
+          b(t(p), {
+            name: "check",
+            size: "20px"
           })
-        ], 8, _)) : n("", !0),
-        e.inlineError || t(d)?.error?.value ? (a(), o("div", ee, [
-          u(t(U), y({
+        ], 8, te)) : n("", !0),
+        e.inlineError || t(d)?.error?.value ? (l(), o("div", le, [
+          b(t(J), y({
             disabled: !e.inlineErrorText && !t(d)?.error?.value,
             text: e.inlineErrorText || t(d)?.error?.value,
             "test-id": e.testId
           }, t(c)[t(f).TOOLTIP]), {
-            default: h(() => [
-              u(t(w), {
+            default: v(() => [
+              b(t(p), {
                 name: "warning-circle",
-                "font-size": "sm"
+                size: "16px"
               })
             ]),
             _: 1
           }, 16, ["disabled", "text", "test-id"])
         ])) : n("", !0),
-        e.suffix ? (a(), v(t(T), {
+        e.suffix ? (l(), u(t(T), {
           key: 4,
           class: "suffix-text",
           variant: "body1"
         }, {
-          default: h(() => [
-            p(x(e.suffix), 1)
+          default: v(() => [
+            h(x(e.suffix), 1)
           ]),
           _: 1
         })) : n("", !0),
-        e.type === "password" ? (a(), o("div", y({
+        e.type === "password" ? (l(), o("div", y({
           key: 5,
           class: "password-visibility-toggle"
         }, t(c)[t(f).TOGGLE_PASSWORD], {
-          onClick: l[5] || (l[5] = (i) => m.value = !m.value)
+          onClick: a[5] || (a[5] = (i) => m.value = !m.value)
         }), [
-          u(t(w), {
-            name: m.value ? "eye-v4" : "eye-slash",
-            "font-size": "sm"
-          }, null, 8, ["name"])
+          m.value ? (l(), u(t(p), {
+            key: 0,
+            name: "eye",
+            size: "16px"
+          })) : (l(), u(t(p), {
+            key: 1,
+            name: "eye-slash",
+            size: "16px"
+          }))
         ], 16)) : n("", !0),
-        r.$slots.iconAfter ? (a(), o("div", te, [
-          L(r.$slots, "iconAfter", {}, void 0, !0)
+        r.$slots.iconAfter ? (l(), o("div", ae, [
+          F(r.$slots, "iconAfter", {}, void 0, !0)
         ])) : n("", !0)
       ], 2),
-      e.feedbackText || e.maxLength ? (a(), o("div", le, [
-        e.feedbackText ? (a(), v(J, {
+      e.feedbackText || e.maxLength ? (l(), o("div", ne, [
+        e.feedbackText ? (l(), u(X, {
           key: 0,
           text: e.feedbackText,
           variant: e.feedbackVariant,
+          "show-icon": e.showFeedbackTextIcon,
           "test-id": e.testId
-        }, null, 8, ["text", "variant", "test-id"])) : n("", !0),
-        e.maxLength ? (a(), o("div", ae, [
-          u(t(T), { variant: "caption" }, {
-            default: h(() => [
-              p(x(t(D)) + " ", 1),
-              ne,
-              p(" " + x(e.maxLength), 1)
+        }, null, 8, ["text", "variant", "show-icon", "test-id"])) : n("", !0),
+        e.maxLength ? (l(), o("div", ie, [
+          b(t(T), { variant: "caption" }, {
+            default: v(() => [
+              h(x(t(H)) + " ", 1),
+              oe,
+              h(" " + x(e.maxLength), 1)
             ]),
             _: 1
           })
@@ -206,5 +214,5 @@ const X = (e) => (M("data-v-f4f61aa1"), e = e(), W(), e), Y = {
   }
 });
 export {
-  he as default
+  xe as default
 };

package/components/input/v4/index.d.ts

@@ -14,20 +14,21 @@ declare const TextFieldTypes: () => ({
             mandatory: boolean;
             autoFocus: boolean;
             prefix: string;
+            hoverHelpText: string;
+            hoverHelpTextPlacement: "auto" | "auto-start" | "auto-end" | "top" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end";
+            feedbackText: string;
+            feedbackVariant: "error" | "success" | "warning";
             viewOnly: boolean;
             labelDirection: "top" | "inside";
             hideNumberArrows: boolean;
             step: number;
-            hoverHelpText: string;
-            hoverHelpTextPlacement: "auto" | "auto-start" | "auto-end" | "top" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end";
             onlyDigits: boolean;
             suffix: string;
             maxLength: number;
             showApply: boolean;
             inlineError: boolean;
             inlineErrorText: string;
-            feedbackText: string;
-            feedbackVariant: "error" | "success" | "warning";
+            showFeedbackTextIcon: boolean;
         }> & Omit<Readonly<import("vue").ExtractPropTypes<{
             type: {
                 type: import("vue").PropType<"number" | "text" | "password">;
@@ -69,6 +70,22 @@ declare const TextFieldTypes: () => ({
                 type: import("vue").PropType<string>;
                 default: string;
             };
+            hoverHelpText: {
+                type: import("vue").PropType<string>;
+                default: string;
+            };
+            hoverHelpTextPlacement: {
+                type: import("vue").PropType<"auto" | "auto-start" | "auto-end" | "top" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end">;
+                default: string;
+            };
+            feedbackText: {
+                type: import("vue").PropType<string>;
+                default: string;
+            };
+            feedbackVariant: {
+                type: import("vue").PropType<"error" | "success" | "warning">;
+                default: any;
+            };
             viewOnly: {
                 type: import("vue").PropType<boolean>;
                 default: boolean;
@@ -85,14 +102,6 @@ declare const TextFieldTypes: () => ({
                 type: import("vue").PropType<number>;
                 default: number;
             };
-            hoverHelpText: {
-                type: import("vue").PropType<string>;
-                default: string;
-            };
-            hoverHelpTextPlacement: {
-                type: import("vue").PropType<"auto" | "auto-start" | "auto-end" | "top" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end">;
-                default: string;
-            };
             onlyDigits: {
                 type: import("vue").PropType<boolean>;
                 default: boolean;
@@ -117,18 +126,14 @@ declare const TextFieldTypes: () => ({
                 type: import("vue").PropType<string>;
                 default: string;
             };
-            feedbackText: {
-                type: import("vue").PropType<string>;
-                default: string;
-            };
-            feedbackVariant: {
-                type: import("vue").PropType<"error" | "success" | "warning">;
-                default: any;
+            showFeedbackTextIcon: {
+                type: import("vue").PropType<boolean>;
+                default: boolean;
             };
         }>> & {
             "onUpdate:modelValue"?: (value: string | number) => any;
-            "onUpdate:showApply"?: (value: boolean) => any;
-        } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "type" | "label" | "size" | "testId" | "disabled" | "modelValue" | "placeholder" | "mandatory" | "autoFocus" | "prefix" | "viewOnly" | "labelDirection" | "hideNumberArrows" | "step" | "hoverHelpText" | "hoverHelpTextPlacement" | "onlyDigits" | "suffix" | "maxLength" | "showApply" | "inlineError" | "inlineErrorText" | "feedbackText" | "feedbackVariant">;
+            onApply?: () => any;
+        } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "type" | "label" | "size" | "testId" | "disabled" | "modelValue" | "placeholder" | "mandatory" | "autoFocus" | "prefix" | "hoverHelpText" | "hoverHelpTextPlacement" | "feedbackText" | "feedbackVariant" | "viewOnly" | "labelDirection" | "hideNumberArrows" | "step" | "onlyDigits" | "suffix" | "maxLength" | "showApply" | "inlineError" | "inlineErrorText" | "showFeedbackTextIcon">;
         $attrs: {
             [x: string]: unknown;
         };
@@ -140,7 +145,7 @@ declare const TextFieldTypes: () => ({
         }>;
         $root: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string>, {}>;
         $parent: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string>, {}>;
-        $emit: ((event: "update:modelValue", value: string | number) => void) & ((event: "update:showApply", value: boolean) => void);
+        $emit: ((event: "update:modelValue", value: string | number) => void) & ((event: "apply") => void);
         $el: any;
         $options: import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
             type: {
@@ -183,6 +188,22 @@ declare const TextFieldTypes: () => ({
                 type: import("vue").PropType<string>;
                 default: string;
             };
+            hoverHelpText: {
+                type: import("vue").PropType<string>;
+                default: string;
+            };
+            hoverHelpTextPlacement: {
+                type: import("vue").PropType<"auto" | "auto-start" | "auto-end" | "top" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end">;
+                default: string;
+            };
+            feedbackText: {
+                type: import("vue").PropType<string>;
+                default: string;
+            };
+            feedbackVariant: {
+                type: import("vue").PropType<"error" | "success" | "warning">;
+                default: any;
+            };
             viewOnly: {
                 type: import("vue").PropType<boolean>;
                 default: boolean;
@@ -199,14 +220,6 @@ declare const TextFieldTypes: () => ({
                 type: import("vue").PropType<number>;
                 default: number;
             };
-            hoverHelpText: {
-                type: import("vue").PropType<string>;
-                default: string;
-            };
-            hoverHelpTextPlacement: {
-                type: import("vue").PropType<"auto" | "auto-start" | "auto-end" | "top" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end">;
-                default: string;
-            };
             onlyDigits: {
                 type: import("vue").PropType<boolean>;
                 default: boolean;
@@ -231,20 +244,18 @@ declare const TextFieldTypes: () => ({
                 type: import("vue").PropType<string>;
                 default: string;
             };
-            feedbackText: {
-                type: import("vue").PropType<string>;
-                default: string;
-            };
-            feedbackVariant: {
-                type: import("vue").PropType<"error" | "success" | "warning">;
-                default: any;
+            showFeedbackTextIcon: {
+                type: import("vue").PropType<boolean>;
+                default: boolean;
             };
         }>> & {
             "onUpdate:modelValue"?: (value: string | number) => any;
-            "onUpdate:showApply"?: (value: boolean) => any;
-        }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+            onApply?: () => any;
+        }, {
+            manualFocus: () => any;
+        }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
             "update:modelValue": (value: string | number) => void;
-            "update:showApply": (value: boolean) => void;
+            apply: () => void;
         }, string, {
             type: "number" | "text" | "password";
             label: string;
@@ -256,20 +267,21 @@ declare const TextFieldTypes: () => ({
             mandatory: boolean;
             autoFocus: boolean;
             prefix: string;
+            hoverHelpText: string;
+            hoverHelpTextPlacement: "auto" | "auto-start" | "auto-end" | "top" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end";
+            feedbackText: string;
+            feedbackVariant: "error" | "success" | "warning";
             viewOnly: boolean;
             labelDirection: "top" | "inside";
             hideNumberArrows: boolean;
             step: number;
-            hoverHelpText: string;
-            hoverHelpTextPlacement: "auto" | "auto-start" | "auto-end" | "top" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end";
             onlyDigits: boolean;
             suffix: string;
             maxLength: number;
             showApply: boolean;
             inlineError: boolean;
             inlineErrorText: string;
-            feedbackText: string;
-            feedbackVariant: "error" | "success" | "warning";
+            showFeedbackTextIcon: boolean;
         }, {}, string> & {
             beforeCreate?: (() => void) | (() => void)[];
             created?: (() => void) | (() => void)[];
@@ -331,6 +343,22 @@ declare const TextFieldTypes: () => ({
             type: import("vue").PropType<string>;
             default: string;
         };
+        hoverHelpText: {
+            type: import("vue").PropType<string>;
+            default: string;
+        };
+        hoverHelpTextPlacement: {
+            type: import("vue").PropType<"auto" | "auto-start" | "auto-end" | "top" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end">;
+            default: string;
+        };
+        feedbackText: {
+            type: import("vue").PropType<string>;
+            default: string;
+        };
+        feedbackVariant: {
+            type: import("vue").PropType<"error" | "success" | "warning">;
+            default: any;
+        };
         viewOnly: {
             type: import("vue").PropType<boolean>;
             default: boolean;
@@ -347,14 +375,6 @@ declare const TextFieldTypes: () => ({
             type: import("vue").PropType<number>;
             default: number;
         };
-        hoverHelpText: {
-            type: import("vue").PropType<string>;
-            default: string;
-        };
-        hoverHelpTextPlacement: {
-            type: import("vue").PropType<"auto" | "auto-start" | "auto-end" | "top" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end">;
-            default: string;
-        };
         onlyDigits: {
             type: import("vue").PropType<boolean>;
             default: boolean;
@@ -379,18 +399,16 @@ declare const TextFieldTypes: () => ({
             type: import("vue").PropType<string>;
             default: string;
         };
-        feedbackText: {
-            type: import("vue").PropType<string>;
-            default: string;
-        };
-        feedbackVariant: {
-            type: import("vue").PropType<"error" | "success" | "warning">;
-            default: any;
+        showFeedbackTextIcon: {
+            type: import("vue").PropType<boolean>;
+            default: boolean;
         };
     }>> & {
         "onUpdate:modelValue"?: (value: string | number) => any;
-        "onUpdate:showApply"?: (value: boolean) => any;
-    } & import("vue").ShallowUnwrapRef<{}> & {} & import("vue").ComponentCustomProperties & {};
+        onApply?: () => any;
+    } & import("vue").ShallowUnwrapRef<{
+        manualFocus: () => any;
+    }> & {} & import("vue").ComponentCustomProperties & {};
     __isFragment?: never;
     __isTeleport?: never;
     __isSuspense?: never;
@@ -435,6 +453,22 @@ declare const TextFieldTypes: () => ({
         type: import("vue").PropType<string>;
         default: string;
     };
+    hoverHelpText: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
+    hoverHelpTextPlacement: {
+        type: import("vue").PropType<"auto" | "auto-start" | "auto-end" | "top" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end">;
+        default: string;
+    };
+    feedbackText: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
+    feedbackVariant: {
+        type: import("vue").PropType<"error" | "success" | "warning">;
+        default: any;
+    };
     viewOnly: {
         type: import("vue").PropType<boolean>;
         default: boolean;
@@ -451,14 +485,6 @@ declare const TextFieldTypes: () => ({
         type: import("vue").PropType<number>;
         default: number;
     };
-    hoverHelpText: {
-        type: import("vue").PropType<string>;
-        default: string;
-    };
-    hoverHelpTextPlacement: {
-        type: import("vue").PropType<"auto" | "auto-start" | "auto-end" | "top" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end">;
-        default: string;
-    };
     onlyDigits: {
         type: import("vue").PropType<boolean>;
         default: boolean;
@@ -483,20 +509,18 @@ declare const TextFieldTypes: () => ({
         type: import("vue").PropType<string>;
         default: string;
     };
-    feedbackText: {
-        type: import("vue").PropType<string>;
-        default: string;
-    };
-    feedbackVariant: {
-        type: import("vue").PropType<"error" | "success" | "warning">;
-        default: any;
+    showFeedbackTextIcon: {
+        type: import("vue").PropType<boolean>;
+        default: boolean;
     };
 }>> & {
     "onUpdate:modelValue"?: (value: string | number) => any;
-    "onUpdate:showApply"?: (value: boolean) => any;
-}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    onApply?: () => any;
+}, {
+    manualFocus: () => any;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:modelValue": (value: string | number) => void;
-    "update:showApply": (value: boolean) => void;
+    apply: () => void;
 }, string, {
     type: "number" | "text" | "password";
     label: string;
@@ -508,20 +532,21 @@ declare const TextFieldTypes: () => ({
     mandatory: boolean;
     autoFocus: boolean;
     prefix: string;
+    hoverHelpText: string;
+    hoverHelpTextPlacement: "auto" | "auto-start" | "auto-end" | "top" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end";
+    feedbackText: string;
+    feedbackVariant: "error" | "success" | "warning";
     viewOnly: boolean;
     labelDirection: "top" | "inside";
     hideNumberArrows: boolean;
     step: number;
-    hoverHelpText: string;
-    hoverHelpTextPlacement: "auto" | "auto-start" | "auto-end" | "top" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end";
     onlyDigits: boolean;
     suffix: string;
     maxLength: number;
     showApply: boolean;
     inlineError: boolean;
     inlineErrorText: string;
-    feedbackText: string;
-    feedbackVariant: "error" | "success" | "warning";
+    showFeedbackTextIcon: boolean;
 }, {}, string> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => {
     $slots: {
         iconBefore?(_: {}): any;