@ironsource/shared-ui 2.1.11-rc.32 → 2.1.11-rc.33

package/ButtonDropdownTrigger.vue_vue_type_style_index_0_scoped_853b18b2_lang.css

@@ -0,0 +1 @@
+.button-trigger.open[data-v-853b18b2]{background:var(--action-selected);outline:2px solid var(--action-active);outline-offset:-2px;transition:outline 0s}.button-trigger.open[data-v-853b18b2]:hover{background:var(--action-selected)}.button-trigger .label-wrapper[data-v-853b18b2]{display:block;width:100%}.button-trigger .label-wrapper .label[data-v-853b18b2]{white-space:nowrap}

package/components/dropdown/v4/ButtonDropdownTrigger.vue.d.ts

@@ -8,6 +8,9 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     startIconType?: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test" | "ad-networks" | "ad-networks/flat" | "content-rate";
     hideEndIcon?: boolean;
     testId?: string;
+    maxWidth?: string;
+    withTooltip?: boolean;
+    tooltipPlacement?: "top" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end";
 }>, {
     variant: string;
     size: string;
@@ -17,6 +20,9 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     startIconType: string;
     hideEndIcon: boolean;
     testId: string;
+    maxWidth: string;
+    withTooltip: boolean;
+    tooltipPlacement: string;
 }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     click: () => void;
 }, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
@@ -29,6 +35,9 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     startIconType?: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test" | "ad-networks" | "ad-networks/flat" | "content-rate";
     hideEndIcon?: boolean;
     testId?: string;
+    maxWidth?: string;
+    withTooltip?: boolean;
+    tooltipPlacement?: "top" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end";
 }>, {
     variant: string;
     size: string;
@@ -38,13 +47,19 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     startIconType: string;
     hideEndIcon: boolean;
     testId: string;
+    maxWidth: string;
+    withTooltip: boolean;
+    tooltipPlacement: string;
 }>>> & {
     onClick?: () => any;
 }, {
     testId: string;
     variant: "text" | "outlined";
+    withTooltip: boolean;
+    tooltipPlacement: "top" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end";
     disabled: boolean;
     size: "small" | "medium";
+    maxWidth: string;
     open: boolean;
     startIconName: string;
     startIconType: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test" | "ad-networks" | "ad-networks/flat" | "content-rate";

package/components/dropdown/v4/ButtonDropdownTrigger.vue.js

@@ -1,7 +1,7 @@
 import o from "./ButtonDropdownTrigger.vue2.js";
-/* empty css                            */import e from "../../../_virtual/_plugin-vue_export-helper.js";
-// import "../../../ButtonDropdownTrigger.vue_vue_type_style_index_0_scoped_f9a13e27_lang.css"; //*');
-const p = /* @__PURE__ */ e(o, [["__scopeId", "data-v-f9a13e27"]]);
+/* empty css                            */import t from "../../../_virtual/_plugin-vue_export-helper.js";
+// import "../../../ButtonDropdownTrigger.vue_vue_type_style_index_0_scoped_853b18b2_lang.css"; //*');
+const p = /* @__PURE__ */ t(o, [["__scopeId", "data-v-853b18b2"]]);
 export {
   p as default
 };

package/components/dropdown/v4/ButtonDropdownTrigger.vue2.js

@@ -1,9 +1,10 @@
- import "../../../ButtonDropdownTrigger.vue_vue_type_style_index_0_scoped_f9a13e27_lang.css"; import { defineComponent as l, openBlock as o, createBlock as i, unref as d, normalizeClass as r, withCtx as s, renderSlot as c, createElementVNode as u, toDisplayString as m } from "vue";
-import f from "../../button/v4/ButtonV4.vue.js";
+ import "../../../ButtonDropdownTrigger.vue_vue_type_style_index_0_scoped_853b18b2_lang.css"; import { defineComponent as n, openBlock as i, createBlock as d, unref as r, normalizeClass as c, withCtx as a, renderSlot as u, createElementVNode as m, normalizeStyle as s, createVNode as f, createTextVNode as p, toDisplayString as y } from "vue";
+import b from "../../button/v4/ButtonV4.vue.js";
 import "../../button/v4/IconButtonV4.vue.js";
 import "../../button/v4/ButtonGroup.vue.js";
 import "../../button/v4/ToggleButtonGroupAB.vue.js";
-const b = { class: "label" }, p = /* @__PURE__ */ l({
+import h from "../../typography/v4/Typography.vue.js";
+const z = /* @__PURE__ */ n({
   __name: "ButtonDropdownTrigger",
   props: {
     label: null,
@@ -14,26 +15,46 @@ const b = { class: "label" }, p = /* @__PURE__ */ l({
     startIconName: { default: null },
     startIconType: { default: "regular" },
     hideEndIcon: { type: Boolean, default: !1 },
-    testId: { default: "" }
+    testId: { default: "" },
+    maxWidth: { default: "" },
+    withTooltip: { type: Boolean, default: !0 },
+    tooltipPlacement: { default: "top" }
   },
   emits: ["click"],
-  setup(e, { emit: a }) {
-    return (n, t) => (o(), i(d(f), {
-      class: r(["button-trigger", { open: e.open }]),
-      disabled: e.disabled,
+  setup(t, { emit: l }) {
+    return (o, e) => (i(), d(r(b), {
+      class: c(["button-trigger", { open: t.open }]),
+      disabled: t.disabled,
       color: "default",
-      variant: e.variant,
-      size: e.size,
-      "start-icon-name": e.startIconName,
-      "start-icon-type": e.startIconType,
-      "end-icon-name": e.hideEndIcon ? null : "caret-down",
-      content: e.label,
-      "test-id": e.testId,
-      onClick: t[0] || (t[0] = (y) => a("click"))
+      variant: t.variant,
+      size: t.size,
+      "start-icon-name": t.startIconName,
+      "start-icon-type": t.startIconType,
+      "end-icon-name": t.hideEndIcon ? null : "caret-down",
+      content: t.label,
+      "test-id": t.testId,
+      onClick: e[0] || (e[0] = (w) => l("click"))
     }, {
-      default: s(() => [
-        c(n.$slots, "default", {}, () => [
-          u("div", b, m(e.label), 1)
+      default: a(() => [
+        u(o.$slots, "default", {}, () => [
+          m("div", {
+            style: s({ maxWidth: t.maxWidth }),
+            class: "label-wrapper"
+          }, [
+            f(h, {
+              variant: "button",
+              class: "label",
+              "is-truncated": "",
+              "with-tooltip": t.withTooltip,
+              "tooltip-text": t.label,
+              "tooltip-placement": t.tooltipPlacement
+            }, {
+              default: a(() => [
+                p(y(t.label), 1)
+              ]),
+              _: 1
+            }, 8, ["with-tooltip", "tooltip-text", "tooltip-placement"])
+          ], 4)
         ], !0)
       ]),
       _: 3
@@ -41,5 +62,5 @@ const b = { class: "label" }, p = /* @__PURE__ */ l({
   }
 });
 export {
-  p as default
+  z as default
 };

package/index.d.ts

@@ -18021,8 +18021,11 @@ declare const _default: {
             $props: Partial<{
                 testId: string;
                 variant: "text" | "outlined";
+                withTooltip: boolean;
+                tooltipPlacement: "top" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end";
                 disabled: boolean;
                 size: "small" | "medium";
+                maxWidth: string;
                 open: boolean;
                 startIconName: string;
                 startIconType: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test" | "ad-networks" | "ad-networks/flat" | "content-rate";
@@ -18040,6 +18043,14 @@ declare const _default: {
                     type: import("vue").PropType<"text" | "outlined">;
                     default: string;
                 };
+                withTooltip: {
+                    type: import("vue").PropType<boolean>;
+                    default: boolean;
+                };
+                tooltipPlacement: {
+                    type: import("vue").PropType<"top" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end">;
+                    default: string;
+                };
                 disabled: {
                     type: import("vue").PropType<boolean>;
                     default: boolean;
@@ -18048,6 +18059,10 @@ declare const _default: {
                     type: import("vue").PropType<"small" | "medium">;
                     default: string;
                 };
+                maxWidth: {
+                    type: import("vue").PropType<string>;
+                    default: string;
+                };
                 open: {
                     type: import("vue").PropType<boolean>;
                     default: boolean;
@@ -18066,7 +18081,7 @@ declare const _default: {
                 };
             }>> & {
                 onClick?: () => any;
-            } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "testId" | "variant" | "disabled" | "size" | "open" | "startIconName" | "startIconType" | "hideEndIcon">;
+            } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "testId" | "variant" | "withTooltip" | "tooltipPlacement" | "disabled" | "size" | "maxWidth" | "open" | "startIconName" | "startIconType" | "hideEndIcon">;
             $attrs: {
                 [x: string]: unknown;
             };
@@ -18093,6 +18108,14 @@ declare const _default: {
                     type: import("vue").PropType<"text" | "outlined">;
                     default: string;
                 };
+                withTooltip: {
+                    type: import("vue").PropType<boolean>;
+                    default: boolean;
+                };
+                tooltipPlacement: {
+                    type: import("vue").PropType<"top" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end">;
+                    default: string;
+                };
                 disabled: {
                     type: import("vue").PropType<boolean>;
                     default: boolean;
@@ -18101,6 +18124,10 @@ declare const _default: {
                     type: import("vue").PropType<"small" | "medium">;
                     default: string;
                 };
+                maxWidth: {
+                    type: import("vue").PropType<string>;
+                    default: string;
+                };
                 open: {
                     type: import("vue").PropType<boolean>;
                     default: boolean;
@@ -18124,8 +18151,11 @@ declare const _default: {
             }, string, {
                 testId: string;
                 variant: "text" | "outlined";
+                withTooltip: boolean;
+                tooltipPlacement: "top" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end";
                 disabled: boolean;
                 size: "small" | "medium";
+                maxWidth: string;
                 open: boolean;
                 startIconName: string;
                 startIconType: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test" | "ad-networks" | "ad-networks/flat" | "content-rate";
@@ -18163,6 +18193,14 @@ declare const _default: {
                 type: import("vue").PropType<"text" | "outlined">;
                 default: string;
             };
+            withTooltip: {
+                type: import("vue").PropType<boolean>;
+                default: boolean;
+            };
+            tooltipPlacement: {
+                type: import("vue").PropType<"top" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end">;
+                default: string;
+            };
             disabled: {
                 type: import("vue").PropType<boolean>;
                 default: boolean;
@@ -18171,6 +18209,10 @@ declare const _default: {
                 type: import("vue").PropType<"small" | "medium">;
                 default: string;
             };
+            maxWidth: {
+                type: import("vue").PropType<string>;
+                default: string;
+            };
             open: {
                 type: import("vue").PropType<boolean>;
                 default: boolean;
@@ -18206,6 +18248,14 @@ declare const _default: {
             type: import("vue").PropType<"text" | "outlined">;
             default: string;
         };
+        withTooltip: {
+            type: import("vue").PropType<boolean>;
+            default: boolean;
+        };
+        tooltipPlacement: {
+            type: import("vue").PropType<"top" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end">;
+            default: string;
+        };
         disabled: {
             type: import("vue").PropType<boolean>;
             default: boolean;
@@ -18214,6 +18264,10 @@ declare const _default: {
             type: import("vue").PropType<"small" | "medium">;
             default: string;
         };
+        maxWidth: {
+            type: import("vue").PropType<string>;
+            default: string;
+        };
         open: {
             type: import("vue").PropType<boolean>;
             default: boolean;
@@ -18237,8 +18291,11 @@ declare const _default: {
     }, string, {
         testId: string;
         variant: "text" | "outlined";
+        withTooltip: boolean;
+        tooltipPlacement: "top" | "auto" | "auto-start" | "auto-end" | "top-start" | "top-end" | "right" | "right-start" | "right-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end";
         disabled: boolean;
         size: "small" | "medium";
+        maxWidth: string;
         open: boolean;
         startIconName: string;
         startIconType: "fill" | "bold" | "regular" | "branded" | "ad-unit" | "ab-test" | "ad-networks" | "ad-networks/flat" | "content-rate";

package/index.js

@@ -1,4 +1,4 @@
-import './MenuItem.vue_vue_type_style_index_0_scoped_67e53b85_lang.css';
+import './AddFilterButton.vue_vue_type_style_index_0_scoped_fd98af08_lang.css';
 import { AppTriggerTypes as ro } from "./components/appTrigger/index.js";
 import { AutocompleteDropdownTypes as mo } from "./components/autocompleteDropdown/index.js";
 import { MenuItemTypes as po } from "./components/menuItem/index.js";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ironsource/shared-ui",
-  "version": "2.1.11-rc.32",
+  "version": "2.1.11-rc.33",
   "engines": {
     "npm": ">=7.0.0",
     "node": ">=16.0.0"

package/ButtonDropdownTrigger.vue_vue_type_style_index_0_scoped_f9a13e27_lang.css

@@ -1 +0,0 @@
-.button-trigger.open[data-v-f9a13e27]{background:var(--action-selected);outline:2px solid var(--action-active);outline-offset:-2px;transition:outline 0s}.button-trigger.open[data-v-f9a13e27]:hover{background:var(--action-selected)}.button-trigger .label[data-v-f9a13e27]{white-space:nowrap}