@ironsource/shared-ui 2.1.3-rc.0 → 2.1.3-rc.10

package/components/forms/CardPanel.vue2.js

@@ -1,25 +1,37 @@
- import "../../CardPanel.vue_vue_type_style_index_0_scoped_d2b5d12f_lang.css"; import { defineComponent as t, ref as a, onMounted as r, openBlock as s, createElementBlock as d, normalizeClass as c, renderSlot as f } from "vue";
-const u = /* @__PURE__ */ t({
+ import "../../CardPanel.vue_vue_type_style_index_0_scoped_7d0acb11_lang.css"; import { defineComponent as r, ref as a, onMounted as d, openBlock as n, createElementBlock as c, normalizeClass as i, createBlock as s, createCommentVNode as p, renderSlot as u } from "vue";
+import f from "../shared/FieldLabel.vue.js";
+const x = /* @__PURE__ */ r({
   __name: "CardPanel",
   props: {
-    noPadding: { type: Boolean, default: !1 }
+    noPadding: { type: Boolean, default: !1 },
+    label: { default: "" },
+    description: { default: "" },
+    hoverHelpText: { default: "" },
+    hoverHelpTextPlacement: { default: "top" }
   },
-  setup(l) {
-    const e = a(null), n = a(!1);
-    return r(() => {
-      n.value = e.value?.nextSibling?.classList?.contains("card-panel") || null;
-    }), (o, i) => (s(), d("div", {
+  setup(e) {
+    const l = a(null), t = a(!1);
+    return d(() => {
+      t.value = l.value?.nextSibling?.classList?.contains("card-panel") || null;
+    }), (o, h) => (n(), c("div", {
       ref_key: "rootRef",
-      ref: e,
-      class: c(["card-panel", {
-        "card-panel--no-padding": l.noPadding,
-        "card-panel--has-next": n.value
+      ref: l,
+      class: i(["card-panel", {
+        "card-panel--no-padding": e.noPadding,
+        "card-panel--has-next": t.value
       }])
     }, [
-      f(o.$slots, "default", {}, void 0, !0)
+      e.label ? (n(), s(f, {
+        key: 0,
+        label: e.label,
+        "hover-help-text": e.hoverHelpText,
+        "hover-help-text-placement": e.hoverHelpTextPlacement,
+        description: e.description
+      }, null, 8, ["label", "hover-help-text", "hover-help-text-placement", "description"])) : p("", !0),
+      u(o.$slots, "default", {}, void 0, !0)
     ], 2));
   }
 });
 export {
-  u as default
+  x as default
 };

package/components/forms/FormCard.vue.d.ts

@@ -6,6 +6,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     cancelLabel?: string;
     saveLoading?: boolean;
     testId?: string;
+    isLoading?: boolean;
 }>, {
     title: string;
     noPadding: boolean;
@@ -14,6 +15,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     saveLabel: string;
     saveLoading: boolean;
     testId: string;
+    isLoading: boolean;
 }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     save: () => void;
     cancel: () => void;
@@ -25,6 +27,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     cancelLabel?: string;
     saveLoading?: boolean;
     testId?: string;
+    isLoading?: boolean;
 }>, {
     title: string;
     noPadding: boolean;
@@ -33,6 +36,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     saveLabel: string;
     saveLoading: boolean;
     testId: string;
+    isLoading: boolean;
 }>>> & {
     onCancel?: () => any;
     onSave?: () => any;
@@ -40,6 +44,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     title: string;
     testId: string;
     actionButtons: boolean;
+    isLoading: boolean;
     noPadding: boolean;
     saveLabel: string;
     cancelLabel: string;

package/components/forms/FormCard.vue.js

@@ -1,7 +1,7 @@
 import o from "./FormCard.vue2.js";
-/* empty css               */import e from "../../_virtual/_plugin-vue_export-helper.js";
-// import "../../FormCard.vue_vue_type_style_index_0_scoped_ad5e4be0_lang.css"; //*');
-const t = /* @__PURE__ */ e(o, [["__scopeId", "data-v-ad5e4be0"]]);
+/* empty css               */import _ from "../../_virtual/_plugin-vue_export-helper.js";
+// import "../../FormCard.vue_vue_type_style_index_0_scoped_276bd901_lang.css"; //*');
+const t = /* @__PURE__ */ _(o, [["__scopeId", "data-v-276bd901"]]);
 export {
   t as default
 };

package/components/forms/FormCard.vue2.js

@@ -1,10 +1,14 @@
- import "../../FormCard.vue_vue_type_style_index_0_scoped_ad5e4be0_lang.css"; import { defineComponent as g, openBlock as v, createElementBlock as T, createElementVNode as r, mergeProps as n, unref as e, renderSlot as s, createVNode as i, withCtx as c, createTextVNode as f, toDisplayString as u, createCommentVNode as B } from "vue";
-import N from "../typography/v4/Typography.vue.js";
-import p from "../button/v4/ButtonV4.vue.js";
+ import "../../FormCard.vue_vue_type_style_index_0_scoped_276bd901_lang.css"; import { defineComponent as T, openBlock as d, createElementBlock as c, createElementVNode as f, mergeProps as l, unref as e, renderSlot as u, createVNode as a, withCtx as m, createTextVNode as g, toDisplayString as v, createBlock as B, createCommentVNode as C } from "vue";
+import p from "../typography/v4/Typography.vue.js";
+import y from "../button/v4/ButtonV4.vue.js";
 import "../button/v4/IconButtonV4.vue.js";
-import { FormCardTestIdModifiers as a } from "../../testids/index.js";
-import { useTestIdAttrs as L } from "../../utils/testIds.js";
-const y = { class: "form-card" }, b = /* @__PURE__ */ g({
+import { FormCardTestIdModifiers as o } from "../../testids/index.js";
+import { useTestIdAttrs as N } from "../../utils/testIds.js";
+import i from "../skeleton/v4/SkeletonV4.vue.js";
+const b = { class: "form-card" }, h = {
+  key: 1,
+  class: "content-skeleton-container"
+}, z = /* @__PURE__ */ T({
   __name: "FormCard",
   props: {
     title: { default: "" },
@@ -13,62 +17,84 @@ const y = { class: "form-card" }, b = /* @__PURE__ */ g({
     saveLabel: { default: "Save" },
     cancelLabel: { default: "Cancel" },
     saveLoading: { type: Boolean, default: !1 },
-    testId: { default: "" }
+    testId: { default: "" },
+    isLoading: { type: Boolean, default: !1 }
   },
   emits: ["save", "cancel"],
-  setup(t, { emit: m }) {
-    const o = L(t.testId, a);
-    return (d, l) => (v(), T("div", null, [
-      r("div", y, [
-        r("header", n({ class: "card-header" }, e(o)[e(a).TITLE]), [
-          s(d.$slots, "header", {}, () => [
-            i(e(N), { variant: "h3" }, {
-              default: c(() => [
-                f(u(t.title), 1)
+  setup(t, { emit: k }) {
+    const n = N(t.testId, o);
+    return (r, s) => (d(), c("div", null, [
+      f("div", b, [
+        f("header", l({ class: "card-header" }, e(n)[e(o).TITLE]), [
+          t.isLoading ? (d(), B(e(i), {
+            key: 1,
+            type: "rectangle",
+            size: 20,
+            class: "skeleton-header"
+          })) : u(r.$slots, "header", { key: 0 }, () => [
+            a(e(p), { variant: "h3" }, {
+              default: m(() => [
+                g(v(t.title), 1)
               ]),
               _: 1
             })
           ], !0)
         ], 16),
-        r("div", n({
+        f("div", l({
           class: ["card-content", { "card-content--no-padding": t.noPadding }]
-        }, e(o)[e(a).CONTENT]), [
-          s(d.$slots, "default", {}, void 0, !0)
+        }, e(n)[e(o).CONTENT]), [
+          t.isLoading ? (d(), c("div", h, [
+            a(e(i), {
+              type: "rectangle",
+              size: 20,
+              class: "skeleton-long"
+            }),
+            a(e(i), {
+              class: "skeleton-short",
+              type: "rectangle"
+            }),
+            a(e(i), {
+              class: "skeleton-short",
+              type: "rectangle"
+            })
+          ])) : u(r.$slots, "default", { key: 0 }, void 0, !0)
         ], 16)
       ]),
-      t.actionButtons ? (v(), T("div", n({
+      t.actionButtons ? (d(), c("div", l({
         key: 0,
         class: "form-actions"
-      }, e(o)[e(a).ACTIONS]), [
-        s(d.$slots, "footer", {}, () => [
-          i(e(p), n({
+      }, e(n)[e(o).ACTIONS]), [
+        u(r.$slots, "footer", {}, () => [
+          a(e(y), l({
             class: "form-action",
             variant: "outlined",
             color: "default"
-          }, e(o)[e(a).CANCEL_BUTTON], {
-            onClick: l[0] || (l[0] = (C) => m("cancel"))
+          }, e(n)[e(o).CANCEL_BUTTON], {
+            disabled: t.isLoading,
+            onClick: s[0] || (s[0] = (L) => k("cancel"))
           }), {
-            default: c(() => [
-              f(u(t.cancelLabel), 1)
+            default: m(() => [
+              g(v(t.cancelLabel), 1)
             ]),
             _: 1
-          }, 16),
-          i(e(p), n({
+          }, 16, ["disabled"]),
+          a(e(y), l({
             class: "form-action",
             loading: t.saveLoading
-          }, e(o)[e(a).SAVE_BUTTON], {
-            onClick: l[1] || (l[1] = (C) => m("save"))
+          }, e(n)[e(o).SAVE_BUTTON], {
+            disabled: t.isLoading,
+            onClick: s[1] || (s[1] = (L) => k("save"))
           }), {
-            default: c(() => [
-              f(u(t.saveLabel), 1)
+            default: m(() => [
+              g(v(t.saveLabel), 1)
             ]),
             _: 1
-          }, 16, ["loading"])
+          }, 16, ["loading", "disabled"])
         ], !0)
-      ], 16)) : B("", !0)
+      ], 16)) : C("", !0)
     ]));
   }
 });
 export {
-  b as default
+  z as default
 };

package/components/forms/FormRow.vue.d.ts

@@ -2,22 +2,32 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     label: string;
     mandatory?: boolean;
     testId?: string;
+    hoverHelpText?: string;
+    hoverHelpTextPlacement?: "auto" | "left" | "right" | "bottom" | "top" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right-start" | "right-end" | "bottom-start" | "bottom-end" | "left-start" | "left-end";
 }>, {
     label: string;
     mandatory: boolean;
     testId: string;
+    hoverHelpText: string;
+    hoverHelpTextPlacement: string;
 }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
     label: string;
     mandatory?: boolean;
     testId?: string;
+    hoverHelpText?: string;
+    hoverHelpTextPlacement?: "auto" | "left" | "right" | "bottom" | "top" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right-start" | "right-end" | "bottom-start" | "bottom-end" | "left-start" | "left-end";
 }>, {
     label: string;
     mandatory: boolean;
     testId: string;
+    hoverHelpText: string;
+    hoverHelpTextPlacement: string;
 }>>>, {
     label: string;
     mandatory: boolean;
     testId: string;
+    hoverHelpText: string;
+    hoverHelpTextPlacement: "auto" | "left" | "right" | "bottom" | "top" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right-start" | "right-end" | "bottom-start" | "bottom-end" | "left-start" | "left-end";
 }>, {
     default?(_: {}): any;
 }>;

package/components/forms/FormRow.vue.js

@@ -1,7 +1,7 @@
 import o from "./FormRow.vue2.js";
-/* empty css              */import e from "../../_virtual/_plugin-vue_export-helper.js";
-// import "../../FormRow.vue_vue_type_style_index_0_scoped_017dc22e_lang.css"; //*');
-const c = /* @__PURE__ */ e(o, [["__scopeId", "data-v-017dc22e"]]);
+/* empty css              */import _ from "../../_virtual/_plugin-vue_export-helper.js";
+// import "../../FormRow.vue_vue_type_style_index_0_scoped_c5265707_lang.css"; //*');
+const c = /* @__PURE__ */ _(o, [["__scopeId", "data-v-c5265707"]]);
 export {
   c as default
 };

package/components/forms/FormRow.vue2.js

@@ -1,41 +1,34 @@
- import "../../FormRow.vue_vue_type_style_index_0_scoped_017dc22e_lang.css"; import { defineComponent as c, openBlock as t, createElementBlock as a, createVNode as i, unref as o, withCtx as l, createTextVNode as d, toDisplayString as m, createBlock as u, createCommentVNode as r, createElementVNode as f, renderSlot as y } from "vue";
-import n from "../typography/v4/Typography.vue.js";
-const p = { class: "form-row" }, _ = ["data-testid"], h = { class: "content" }, B = /* @__PURE__ */ c({
+ import "../../FormRow.vue_vue_type_style_index_0_scoped_c5265707_lang.css"; import { defineComponent as o, openBlock as t, createElementBlock as l, createVNode as d, createCommentVNode as n, createElementVNode as r, renderSlot as c } from "vue";
+import m from "../shared/FieldLabel.vue.js";
+const s = { class: "form-row" }, h = {
+  key: 0,
+  class: "label-container"
+}, i = { class: "content" }, p = /* @__PURE__ */ o({
   __name: "FormRow",
   props: {
     label: { default: "" },
     mandatory: { type: Boolean, default: !1 },
-    testId: { default: "" }
+    testId: { default: "" },
+    hoverHelpText: { default: "" },
+    hoverHelpTextPlacement: { default: "top" }
   },
   setup(e) {
-    return (s, b) => (t(), a("div", p, [
-      e.label ? (t(), a("div", {
-        key: 0,
-        "data-testid": e.testId,
-        class: "label-container"
-      }, [
-        i(o(n), { variant: "inputLabel" }, {
-          default: l(() => [
-            d(m(e.label), 1)
-          ]),
-          _: 1
-        }),
-        e.mandatory ? (t(), u(o(n), {
-          key: 0,
-          class: "mandatory"
-        }, {
-          default: l(() => [
-            d("*")
-          ]),
-          _: 1
-        })) : r("", !0)
-      ], 8, _)) : r("", !0),
-      f("div", h, [
-        y(s.$slots, "default", {}, void 0, !0)
+    return (a, f) => (t(), l("div", s, [
+      e.label ? (t(), l("div", h, [
+        d(m, {
+          label: e.label,
+          mandatory: e.mandatory,
+          "hover-help-text": e.hoverHelpText,
+          "hover-help-text-placement": e.hoverHelpTextPlacement,
+          "data-testid": e.testId
+        }, null, 8, ["label", "mandatory", "hover-help-text", "hover-help-text-placement", "data-testid"])
+      ])) : n("", !0),
+      r("div", i, [
+        c(a.$slots, "default", {}, void 0, !0)
       ])
     ]));
   }
 });
 export {
-  B as default
+  p as default
 };

package/components/forms/index.d.ts

@@ -7,13 +7,33 @@ declare const FormCardTypes: () => (({
         $: import("vue").ComponentInternalInstance;
         $data: {};
         $props: Partial<{
+            label: string;
+            description: string;
+            hoverHelpText: string;
+            hoverHelpTextPlacement: "auto" | "left" | "right" | "bottom" | "top" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right-start" | "right-end" | "bottom-start" | "bottom-end" | "left-start" | "left-end";
             noPadding: boolean;
         }> & Omit<Readonly<import("vue").ExtractPropTypes<{
+            label: {
+                type: import("vue").PropType<string>;
+                default: string;
+            };
+            description: {
+                type: import("vue").PropType<string>;
+                default: string;
+            };
+            hoverHelpText: {
+                type: import("vue").PropType<string>;
+                default: string;
+            };
+            hoverHelpTextPlacement: {
+                type: import("vue").PropType<"auto" | "left" | "right" | "bottom" | "top" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right-start" | "right-end" | "bottom-start" | "bottom-end" | "left-start" | "left-end">;
+                default: string;
+            };
             noPadding: {
                 type: import("vue").PropType<boolean>;
                 default: boolean;
             };
-        }>> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "noPadding">;
+        }>> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "label" | "description" | "hoverHelpText" | "hoverHelpTextPlacement" | "noPadding">;
         $attrs: {
             [x: string]: unknown;
         };
@@ -28,11 +48,31 @@ declare const FormCardTypes: () => (({
         $emit: (event: string, ...args: any[]) => void;
         $el: any;
         $options: import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
+            label: {
+                type: import("vue").PropType<string>;
+                default: string;
+            };
+            description: {
+                type: import("vue").PropType<string>;
+                default: string;
+            };
+            hoverHelpText: {
+                type: import("vue").PropType<string>;
+                default: string;
+            };
+            hoverHelpTextPlacement: {
+                type: import("vue").PropType<"auto" | "left" | "right" | "bottom" | "top" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right-start" | "right-end" | "bottom-start" | "bottom-end" | "left-start" | "left-end">;
+                default: string;
+            };
             noPadding: {
                 type: import("vue").PropType<boolean>;
                 default: boolean;
             };
         }>>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, {
+            label: string;
+            description: string;
+            hoverHelpText: string;
+            hoverHelpTextPlacement: "auto" | "left" | "right" | "bottom" | "top" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right-start" | "right-end" | "bottom-start" | "bottom-end" | "left-start" | "left-end";
             noPadding: boolean;
         }, {}, string> & {
             beforeCreate?: (() => void) | (() => void)[];
@@ -55,6 +95,22 @@ declare const FormCardTypes: () => (({
         $nextTick: typeof import("vue").nextTick;
         $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (args_0: R, args_1: R) => any : (...args: any) => any, options?: import("vue").WatchOptions<boolean>): import("vue").WatchStopHandle;
     } & Readonly<import("vue").ExtractPropTypes<{
+        label: {
+            type: import("vue").PropType<string>;
+            default: string;
+        };
+        description: {
+            type: import("vue").PropType<string>;
+            default: string;
+        };
+        hoverHelpText: {
+            type: import("vue").PropType<string>;
+            default: string;
+        };
+        hoverHelpTextPlacement: {
+            type: import("vue").PropType<"auto" | "left" | "right" | "bottom" | "top" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right-start" | "right-end" | "bottom-start" | "bottom-end" | "left-start" | "left-end">;
+            default: string;
+        };
         noPadding: {
             type: import("vue").PropType<boolean>;
             default: boolean;
@@ -64,11 +120,31 @@ declare const FormCardTypes: () => (({
     __isTeleport?: never;
     __isSuspense?: never;
 } & import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
+    label: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
+    description: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
+    hoverHelpText: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
+    hoverHelpTextPlacement: {
+        type: import("vue").PropType<"auto" | "left" | "right" | "bottom" | "top" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right-start" | "right-end" | "bottom-start" | "bottom-end" | "left-start" | "left-end">;
+        default: string;
+    };
     noPadding: {
         type: import("vue").PropType<boolean>;
         default: boolean;
     };
 }>>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, {
+    label: string;
+    description: string;
+    hoverHelpText: string;
+    hoverHelpTextPlacement: "auto" | "left" | "right" | "bottom" | "top" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right-start" | "right-end" | "bottom-start" | "bottom-end" | "left-start" | "left-end";
     noPadding: boolean;
 }, {}, string> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => {
     $slots: {
@@ -82,6 +158,7 @@ declare const FormCardTypes: () => (({
             title: string;
             testId: string;
             actionButtons: boolean;
+            isLoading: boolean;
             noPadding: boolean;
             saveLabel: string;
             cancelLabel: string;
@@ -99,6 +176,10 @@ declare const FormCardTypes: () => (({
                 type: import("vue").PropType<boolean>;
                 default: boolean;
             };
+            isLoading: {
+                type: import("vue").PropType<boolean>;
+                default: boolean;
+            };
             noPadding: {
                 type: import("vue").PropType<boolean>;
                 default: boolean;
@@ -118,7 +199,7 @@ declare const FormCardTypes: () => (({
         }>> & {
             onCancel?: () => any;
             onSave?: () => any;
-        } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "title" | "testId" | "actionButtons" | "noPadding" | "saveLabel" | "cancelLabel" | "saveLoading">;
+        } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "title" | "testId" | "actionButtons" | "isLoading" | "noPadding" | "saveLabel" | "cancelLabel" | "saveLoading">;
         $attrs: {
             [x: string]: unknown;
         };
@@ -145,6 +226,10 @@ declare const FormCardTypes: () => (({
                 type: import("vue").PropType<boolean>;
                 default: boolean;
             };
+            isLoading: {
+                type: import("vue").PropType<boolean>;
+                default: boolean;
+            };
             noPadding: {
                 type: import("vue").PropType<boolean>;
                 default: boolean;
@@ -171,6 +256,7 @@ declare const FormCardTypes: () => (({
             title: string;
             testId: string;
             actionButtons: boolean;
+            isLoading: boolean;
             noPadding: boolean;
             saveLabel: string;
             cancelLabel: string;
@@ -208,6 +294,10 @@ declare const FormCardTypes: () => (({
             type: import("vue").PropType<boolean>;
             default: boolean;
         };
+        isLoading: {
+            type: import("vue").PropType<boolean>;
+            default: boolean;
+        };
         noPadding: {
             type: import("vue").PropType<boolean>;
             default: boolean;
@@ -244,6 +334,10 @@ declare const FormCardTypes: () => (({
         type: import("vue").PropType<boolean>;
         default: boolean;
     };
+    isLoading: {
+        type: import("vue").PropType<boolean>;
+        default: boolean;
+    };
     noPadding: {
         type: import("vue").PropType<boolean>;
         default: boolean;
@@ -270,6 +364,7 @@ declare const FormCardTypes: () => (({
     title: string;
     testId: string;
     actionButtons: boolean;
+    isLoading: boolean;
     noPadding: boolean;
     saveLabel: string;
     cancelLabel: string;
@@ -288,6 +383,8 @@ declare const FormCardTypes: () => (({
             label: string;
             mandatory: boolean;
             testId: string;
+            hoverHelpText: string;
+            hoverHelpTextPlacement: "auto" | "left" | "right" | "bottom" | "top" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right-start" | "right-end" | "bottom-start" | "bottom-end" | "left-start" | "left-end";
         }> & Omit<Readonly<import("vue").ExtractPropTypes<{
             label: {
                 type: import("vue").PropType<string>;
@@ -302,7 +399,15 @@ declare const FormCardTypes: () => (({
                 type: import("vue").PropType<string>;
                 default: string;
             };
-        }>> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "label" | "mandatory" | "testId">;
+            hoverHelpText: {
+                type: import("vue").PropType<string>;
+                default: string;
+            };
+            hoverHelpTextPlacement: {
+                type: import("vue").PropType<"auto" | "left" | "right" | "bottom" | "top" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right-start" | "right-end" | "bottom-start" | "bottom-end" | "left-start" | "left-end">;
+                default: string;
+            };
+        }>> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "label" | "mandatory" | "testId" | "hoverHelpText" | "hoverHelpTextPlacement">;
         $attrs: {
             [x: string]: unknown;
         };
@@ -330,10 +435,20 @@ declare const FormCardTypes: () => (({
                 type: import("vue").PropType<string>;
                 default: string;
             };
+            hoverHelpText: {
+                type: import("vue").PropType<string>;
+                default: string;
+            };
+            hoverHelpTextPlacement: {
+                type: import("vue").PropType<"auto" | "left" | "right" | "bottom" | "top" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right-start" | "right-end" | "bottom-start" | "bottom-end" | "left-start" | "left-end">;
+                default: string;
+            };
         }>>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, {
             label: string;
             mandatory: boolean;
             testId: string;
+            hoverHelpText: string;
+            hoverHelpTextPlacement: "auto" | "left" | "right" | "bottom" | "top" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right-start" | "right-end" | "bottom-start" | "bottom-end" | "left-start" | "left-end";
         }, {}, string> & {
             beforeCreate?: (() => void) | (() => void)[];
             created?: (() => void) | (() => void)[];
@@ -368,6 +483,14 @@ declare const FormCardTypes: () => (({
             type: import("vue").PropType<string>;
             default: string;
         };
+        hoverHelpText: {
+            type: import("vue").PropType<string>;
+            default: string;
+        };
+        hoverHelpTextPlacement: {
+            type: import("vue").PropType<"auto" | "left" | "right" | "bottom" | "top" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right-start" | "right-end" | "bottom-start" | "bottom-end" | "left-start" | "left-end">;
+            default: string;
+        };
     }>> & import("vue").ShallowUnwrapRef<{}> & {} & import("vue").ComponentCustomProperties & {};
     __isFragment?: never;
     __isTeleport?: never;
@@ -386,10 +509,20 @@ declare const FormCardTypes: () => (({
         type: import("vue").PropType<string>;
         default: string;
     };
+    hoverHelpText: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
+    hoverHelpTextPlacement: {
+        type: import("vue").PropType<"auto" | "left" | "right" | "bottom" | "top" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right-start" | "right-end" | "bottom-start" | "bottom-end" | "left-start" | "left-end">;
+        default: string;
+    };
 }>>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, {
     label: string;
     mandatory: boolean;
     testId: string;
+    hoverHelpText: string;
+    hoverHelpTextPlacement: "auto" | "left" | "right" | "bottom" | "top" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right-start" | "right-end" | "bottom-start" | "bottom-end" | "left-start" | "left-end";
 }, {}, string> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => {
     $slots: {
         default?(_: {}): any;