@ironsource/shared-ui 2.1.3-rc.1 → 2.1.3-rc.2

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

@@ -1,12 +1,32 @@
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
     noPadding?: boolean;
+    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;
+    label: string;
+    description: 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<{
     noPadding?: boolean;
+    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;
+    label: string;
+    description: string;
+    hoverHelpText: string;
+    hoverHelpTextPlacement: 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;
 }>, {
     default?(_: {}): any;

package/components/forms/CardPanel.vue.js

@@ -1,7 +1,7 @@
 import o from "./CardPanel.vue2.js";
 /* empty css                */import e from "../../_virtual/_plugin-vue_export-helper.js";
-// import "../../CardPanel.vue_vue_type_style_index_0_scoped_d2b5d12f_lang.css"; //*');
-const t = /* @__PURE__ */ e(o, [["__scopeId", "data-v-d2b5d12f"]]);
+// import "../../CardPanel.vue_vue_type_style_index_0_scoped_7d0acb11_lang.css"; //*');
+const t = /* @__PURE__ */ e(o, [["__scopeId", "data-v-7d0acb11"]]);
 export {
   t as default
 };

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/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_39f48410_lang.css"; //*');
+const p = /* @__PURE__ */ _(o, [["__scopeId", "data-v-39f48410"]]);
 export {
-  c as default
+  p as default
 };

package/components/forms/FormRow.vue2.js

@@ -1,4 +1,4 @@
- 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 "../../FormRow.vue_vue_type_style_index_0_scoped_39f48410_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({
   __name: "FormRow",

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: {

package/components/inlineCopy/InlineCopy.vue.js

@@ -1,7 +1,7 @@
 import o from "./InlineCopy.vue2.js";
 /* empty css                 */import e from "../../_virtual/_plugin-vue_export-helper.js";
-// import "../../InlineCopy.vue_vue_type_style_index_0_scoped_2f0a0202_lang.css"; //*');
-const t = /* @__PURE__ */ e(o, [["__scopeId", "data-v-2f0a0202"]]);
+// import "../../InlineCopy.vue_vue_type_style_index_0_scoped_2a9e8782_lang.css"; //*');
+const t = /* @__PURE__ */ e(o, [["__scopeId", "data-v-2a9e8782"]]);
 export {
   t as default
 };

package/components/inlineCopy/InlineCopy.vue2.js

@@ -1,4 +1,4 @@
- import "../../InlineCopy.vue_vue_type_style_index_0_scoped_2f0a0202_lang.css"; import { defineComponent as d, computed as f, openBlock as a, createElementBlock as y, createBlock as x, unref as e, mergeProps as c, withCtx as s, createTextVNode as C, toDisplayString as T, createCommentVNode as z, createVNode as l } from "vue";
+ import "../../InlineCopy.vue_vue_type_style_index_0_scoped_2a9e8782_lang.css"; import { defineComponent as d, computed as f, openBlock as a, createElementBlock as y, createBlock as x, unref as e, mergeProps as c, withCtx as s, createTextVNode as C, toDisplayString as T, createCommentVNode as z, createVNode as l } from "vue";
 import I from "../icon/v4/IconV4.vue.js";
 import h from "../typography/v4/Typography.vue.js";
 import { useClipboard as k } from "@vueuse/core";
@@ -45,7 +45,7 @@ const M = /* @__PURE__ */ d({
         ]),
         _: 1
       }, 16, ["style"])),
-      l(e(V), { text: "Copy to clipboar" }, {
+      l(e(V), { text: "Copy to clipboard" }, {
         default: s(() => [
           l(e(I), c({
             class: "icon-copy",

package/components/radioButton/v4/RadioButtonV4.vue.js

@@ -1,7 +1,7 @@
 import o from "./RadioButtonV4.vue2.js";
-/* empty css                    */import e from "../../../_virtual/_plugin-vue_export-helper.js";
-// import "../../../RadioButtonV4.vue_vue_type_style_index_0_scoped_14be812e_lang.css"; //*');
-const p = /* @__PURE__ */ e(o, [["__scopeId", "data-v-14be812e"]]);
+/* empty css                    */import t from "../../../_virtual/_plugin-vue_export-helper.js";
+// import "../../../RadioButtonV4.vue_vue_type_style_index_0_scoped_cb3a12c6_lang.css"; //*');
+const s = /* @__PURE__ */ t(o, [["__scopeId", "data-v-cb3a12c6"]]);
 export {
-  p as default
+  s as default
 };

package/components/radioButton/v4/RadioButtonV4.vue2.js

@@ -1,4 +1,4 @@
- import "../../../RadioButtonV4.vue_vue_type_style_index_0_scoped_14be812e_lang.css"; import { defineComponent as h, ref as y, inject as g, computed as n, openBlock as I, createElementBlock as R, normalizeClass as p, unref as e, createElementVNode as r, withDirectives as E, mergeProps as v, isRef as k, vModelRadio as B, renderSlot as T, createVNode as w, withCtx as x, createTextVNode as A, toDisplayString as C } from "vue";
+ import "../../../RadioButtonV4.vue_vue_type_style_index_0_scoped_cb3a12c6_lang.css"; import { defineComponent as h, ref as y, inject as g, computed as n, openBlock as I, createElementBlock as R, normalizeClass as p, unref as e, createElementVNode as r, withDirectives as E, mergeProps as v, isRef as k, vModelRadio as B, renderSlot as T, createVNode as w, withCtx as x, createTextVNode as A, toDisplayString as C } from "vue";
 import D from "../../typography/v4/Typography.vue.js";
 import { radioGroupKey as G } from "../common/useRadio.js";
 import { RadioTestIdModifiers as u } from "../../../testids/index.js";

package/components/shared/FieldLabel.vue.d.ts

@@ -1,6 +1,7 @@
 import { TooltipPositions } from '@/components/tooltip/common/Tooltip.types';
 declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
     label: string;
+    description?: string;
     mandatory?: boolean;
     disabled?: boolean;
     hoverHelpText?: string;
@@ -8,6 +9,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     testId?: string;
 }>, {
     label: string;
+    description: string;
     testId: string;
     mandatory: boolean;
     disabled: boolean;
@@ -15,6 +17,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     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;
+    description?: string;
     mandatory?: boolean;
     disabled?: boolean;
     hoverHelpText?: string;
@@ -22,6 +25,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     testId?: string;
 }>, {
     label: string;
+    description: string;
     testId: string;
     mandatory: boolean;
     disabled: boolean;
@@ -32,6 +36,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     disabled: boolean;
     mandatory: boolean;
     testId: string;
+    description: string;
     hoverHelpText: string;
     hoverHelpTextPlacement: TooltipPositions;
 }>;

package/components/shared/FieldLabel.vue.js

@@ -1,7 +1,7 @@
 import e from "./FieldLabel.vue2.js";
 /* empty css                 */import o from "../../_virtual/_plugin-vue_export-helper.js";
-// import "../../FieldLabel.vue_vue_type_style_index_0_scoped_526af548_lang.css"; //*');
-const a = /* @__PURE__ */ o(e, [["__scopeId", "data-v-526af548"]]);
+// import "../../FieldLabel.vue_vue_type_style_index_0_scoped_5c2a70ad_lang.css"; //*');
+const t = /* @__PURE__ */ o(e, [["__scopeId", "data-v-5c2a70ad"]]);
 export {
-  a as default
+  t as default
 };

package/components/shared/FieldLabel.vue2.js

@@ -1,13 +1,17 @@
- import "../../FieldLabel.vue_vue_type_style_index_0_scoped_526af548_lang.css"; import { defineComponent as c, openBlock as r, createElementBlock as u, mergeProps as o, unref as e, createVNode as n, withCtx as d, createTextVNode as s, toDisplayString as p, createBlock as i, createCommentVNode as m } from "vue";
-import T from "../icon/v3/Icon.vue.js";
-import b from "../tooltip/v4/TooltipV4.vue.js";
-import f from "../typography/v4/Typography.vue.js";
+ import "../../FieldLabel.vue_vue_type_style_index_0_scoped_5c2a70ad_lang.css"; import { defineComponent as p, openBlock as o, createElementBlock as m, Fragment as T, createElementVNode as b, mergeProps as d, unref as e, createVNode as r, withCtx as i, createTextVNode as n, toDisplayString as f, createBlock as u, createCommentVNode as s } from "vue";
+import h from "../icon/v3/Icon.vue.js";
+import y from "../tooltip/v4/TooltipV4.vue.js";
+import c from "../typography/v4/Typography.vue.js";
 import { FieldLabelTestIdModifiers as a } from "../../testids/index.js";
-import { useTestIdAttrs as x } from "../../utils/testIds.js";
-const H = /* @__PURE__ */ c({
+import { useTestIdAttrs as v } from "../../utils/testIds.js";
+const x = {
+  key: 0,
+  class: "description"
+}, L = /* @__PURE__ */ p({
   __name: "FieldLabel",
   props: {
     label: { default: "" },
+    description: { default: "" },
     mandatory: { type: Boolean, default: !1 },
     disabled: { type: Boolean, default: !1 },
     hoverHelpText: { default: "" },
@@ -15,47 +19,60 @@ const H = /* @__PURE__ */ c({
     testId: { default: "" }
   },
   setup(t) {
-    const l = x(t.testId, a);
-    return (y, v) => (r(), u("div", o({
-      class: ["field-label", { "field-label--disabled": t.disabled }]
-    }, e(l)[e(a).CONTAINER]), [
-      n(e(f), o({
-        class: "label",
-        variant: "inputLabel"
-      }, e(l)[e(a).TEXT]), {
-        default: d(() => [
-          s(p(t.label), 1)
-        ]),
-        _: 1
-      }, 16),
-      t.mandatory ? (r(), i(e(f), o({
-        key: 0,
-        variant: "h3",
-        class: "mandatory"
-      }, e(l)[e(a).MANDATORY]), {
-        default: d(() => [
-          s("*")
-        ]),
-        _: 1
-      }, 16)) : m("", !0),
-      t.hoverHelpText ? (r(), i(e(b), o({
-        key: 1,
-        triggers: ["hover"],
-        text: t.hoverHelpText,
-        placement: t.hoverHelpTextPlacement
-      }, e(l)[e(a).TOOLTIP], { "test-id": t.testId }), {
-        default: d(() => [
-          n(e(T), {
-            class: "info-icon",
-            name: "question",
-            "font-size": "sm"
-          })
-        ]),
-        _: 1
-      }, 16, ["text", "placement", "test-id"])) : m("", !0)
-    ], 16));
+    const l = v(t.testId, a);
+    return (N, g) => (o(), m(T, null, [
+      b("div", d({
+        class: ["field-label", {
+          "field-label--disabled": t.disabled,
+          "field-label--with-description": !!t.description
+        }]
+      }, e(l)[e(a).CONTAINER]), [
+        r(e(c), d({
+          class: "label",
+          variant: "inputLabel"
+        }, e(l)[e(a).TEXT]), {
+          default: i(() => [
+            n(f(t.label), 1)
+          ]),
+          _: 1
+        }, 16),
+        t.mandatory ? (o(), u(e(c), d({
+          key: 0,
+          variant: "h3",
+          class: "mandatory"
+        }, e(l)[e(a).MANDATORY]), {
+          default: i(() => [
+            n("*")
+          ]),
+          _: 1
+        }, 16)) : s("", !0),
+        t.hoverHelpText ? (o(), u(e(y), d({
+          key: 1,
+          triggers: ["hover"],
+          text: t.hoverHelpText,
+          placement: t.hoverHelpTextPlacement
+        }, e(l)[e(a).TOOLTIP], { "test-id": t.testId }), {
+          default: i(() => [
+            r(e(h), {
+              class: "info-icon",
+              name: "question",
+              "font-size": "sm"
+            })
+          ]),
+          _: 1
+        }, 16, ["text", "placement", "test-id"])) : s("", !0)
+      ], 16),
+      t.description ? (o(), m("div", x, [
+        r(e(c), { variant: "body2" }, {
+          default: i(() => [
+            n(f(t.description), 1)
+          ]),
+          _: 1
+        })
+      ])) : s("", !0)
+    ], 64));
   }
 });
 export {
-  H as default
+  L as default
 };

package/components/table/common/Table.common.d.ts

@@ -32,4 +32,5 @@ export declare const tableCommon: (props: any, emit: any) => {
     isRowExpanded: (rowIndex: number) => boolean;
     cssRowHeight: import("vue").ComputedRef<string>;
     cssExpandGridCol: import("vue").ComputedRef<string>;
+    activeMenuRow: import("vue").Ref<number>;
 };