@ironsource/shared-ui 2.0.0-rc.2 → 2.0.0-rc.4

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

@@ -0,0 +1,210 @@
+ 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 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 = {
+  key: 0,
+  class: "icon-container icon-before"
+}, Z = ["value", "placeholder", "disabled", "type", "step", "maxlength"], _ = ["onClick"], ee = {
+  key: 3,
+  class: "inline-error"
+}, te = {
+  key: 6,
+  class: "icon-container icon-after"
+}, le = {
+  key: 1,
+  class: "footer"
+}, ae = {
+  key: 1,
+  class: "max-length"
+}, ne = /* @__PURE__ */ X(() => /* @__PURE__ */ g("span", { class: "max-length__divider" }, "/", -1)), ie = {
+  inheritAttrs: !1
+}, he = /* @__PURE__ */ H({
+  ...ie,
+  __name: "TextField",
+  props: {
+    modelValue: { default: "" },
+    placeholder: { default: "" },
+    disabled: { type: Boolean, default: !1 },
+    viewOnly: { type: Boolean, default: !1 },
+    size: { default: "small" },
+    label: { default: "" },
+    labelDirection: { default: "top" },
+    mandatory: { type: Boolean, default: !1 },
+    feedbackVariant: { default: null },
+    feedbackText: { default: "" },
+    autoFocus: { type: Boolean, default: !1 },
+    type: { default: "text" },
+    hideNumberArrows: { type: Boolean, default: !1 },
+    step: { default: 1 },
+    hoverHelpText: { default: "" },
+    hoverHelpTextPlacement: { default: "top" },
+    onlyDigits: { type: Boolean, default: !1 },
+    testId: { default: "" },
+    prefix: { default: "" },
+    suffix: { default: "" },
+    maxLength: { default: null },
+    showApply: { type: Boolean, default: !1 },
+    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,
+      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({
+      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, {
+        key: 0,
+        label: e.label,
+        mandatory: e.mandatory,
+        "hover-help-text": e.hoverHelpText,
+        "hover-help-text-placement": e.hoverHelpTextPlacement,
+        disabled: e.disabled,
+        "test-id": e.testId
+      }, null, 8, ["label", "mandatory", "hover-help-text", "hover-help-text-placement", "disabled", "test-id"])) : n("", !0),
+      g("div", {
+        class: K({
+          "input-container": !0,
+          "label-inside": t(B),
+          focused: t(b)
+        })
+      }, [
+        r.$slots.iconBefore ? (a(), o("div", Y, [
+          L(r.$slots, "iconBefore", {}, void 0, !0)
+        ])) : n("", !0),
+        e.prefix ? (a(), v(t(T), {
+          key: 1,
+          class: "prefix-text",
+          variant: "body1"
+        }, {
+          default: h(() => [
+            p(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),
+          disabled: e.disabled || e.viewOnly,
+          type: t(N),
+          class: ["input", {
+            [t(z)]: !0,
+            "view-only": e.viewOnly,
+            "label-inside": t(B),
+            "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($(
+            //@ts-ignore
+            (...i) => t(A) && t(A)(...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", {
+          key: 2,
+          class: "apply-button",
+          onClick: $(S, ["stop", "prevent"])
+        }, [
+          u(t(w), {
+            name: "check-v4",
+            "font-size": "md"
+          })
+        ], 8, _)) : n("", !0),
+        e.inlineError || t(d)?.error?.value ? (a(), o("div", ee, [
+          u(t(U), 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), {
+                name: "warning-circle",
+                "font-size": "sm"
+              })
+            ]),
+            _: 1
+          }, 16, ["disabled", "text", "test-id"])
+        ])) : n("", !0),
+        e.suffix ? (a(), v(t(T), {
+          key: 4,
+          class: "suffix-text",
+          variant: "body1"
+        }, {
+          default: h(() => [
+            p(x(e.suffix), 1)
+          ]),
+          _: 1
+        })) : n("", !0),
+        e.type === "password" ? (a(), 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)
+        }), [
+          u(t(w), {
+            name: m.value ? "eye-v4" : "eye-slash",
+            "font-size": "sm"
+          }, null, 8, ["name"])
+        ], 16)) : n("", !0),
+        r.$slots.iconAfter ? (a(), o("div", te, [
+          L(r.$slots, "iconAfter", {}, void 0, !0)
+        ])) : n("", !0)
+      ], 2),
+      e.feedbackText || e.maxLength ? (a(), o("div", le, [
+        e.feedbackText ? (a(), v(J, {
+          key: 0,
+          text: e.feedbackText,
+          variant: e.feedbackVariant,
+          "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)
+            ]),
+            _: 1
+          })
+        ])) : n("", !0)
+      ])) : n("", !0)
+    ], 16));
+  }
+});
+export {
+  he as default
+};

package/components/input/v4/index.js

@@ -0,0 +1,6 @@
+import e from "./TextField.vue.js";
+const o = () => [e];
+export {
+  e as TextField,
+  o as TextFieldTypes
+};

package/components/loader/v4/Loader.vue.js

@@ -0,0 +1,7 @@
+import o from "./Loader.vue2.js";
+/* empty css             */import e from "../../../_virtual/_plugin-vue_export-helper.js";
+// import "../../../Loader.vue_vue_type_style_index_0_scoped_50d9be64_lang.css"; //*');
+const d = /* @__PURE__ */ e(o, [["__scopeId", "data-v-50d9be64"]]);
+export {
+  d as default
+};

package/components/loader/v4/Loader.vue2.js

@@ -0,0 +1,48 @@
+ import "../../../Loader.vue_vue_type_style_index_0_scoped_50d9be64_lang.css"; import { defineComponent as v, ref as l, onMounted as m, openBlock as u, createElementBlock as h, createElementVNode as g, renderSlot as x, normalizeStyle as p } from "vue";
+const W = { style: { visibility: "hidden" } }, O = ["width", "height"], _ = ["r"], y = /* @__PURE__ */ v({
+  __name: "Loader",
+  props: {
+    strokeWidth: { default: 2 },
+    paddingOffsetPx: { default: 0 },
+    paddingOffsetPercentage: { default: 0 },
+    maxWidth: { default: null }
+  },
+  setup(s) {
+    const e = s, o = l(null), i = l(0), r = l("50%"), f = l(0);
+    return m(() => {
+      const a = o?.value?.clientWidth, n = o?.value?.clientHeight;
+      let t = a && n && n < a ? n : a, d = 0;
+      if (typeof t == "number" && (e.paddingOffsetPercentage ? e.paddingOffsetPercentage > 49 ? d = 0 : d = t * e.paddingOffsetPercentage / 100 : e.paddingOffsetPx && e.paddingOffsetPx < t - e.strokeWidth ? d = e.paddingOffsetPx : d = 0), e.maxWidth && e.maxWidth < t - d) {
+        const c = e.maxWidth < t ? e.maxWidth : t;
+        d = (t - c) / 2, t = c + d * 2;
+      }
+      f.value = d || 0, i.value = t - d * 2, r.value = i.value ? `${(i.value / 2 - e.strokeWidth / 2) / i.value * 100}%` : "50%";
+    }), (a, n) => (u(), h("div", {
+      ref_key: "loaderContainer",
+      ref: o,
+      class: "loader-container"
+    }, [
+      g("div", W, [
+        x(a.$slots, "default", {}, void 0, !0)
+      ]),
+      (u(), h("svg", {
+        class: "circle-svg",
+        width: i.value,
+        height: i.value,
+        style: p({
+          padding: f.value
+        })
+      }, [
+        g("circle", {
+          cx: "50%",
+          cy: "50%",
+          r: r.value,
+          style: p({ strokeWidth: s.strokeWidth })
+        }, null, 12, _)
+      ], 12, O))
+    ], 512));
+  }
+});
+export {
+  y as default
+};

package/components/menu/Menu.vue.js

@@ -0,0 +1,8 @@
+import e from "./Menu.vue2.js";
+/* empty css           *//* empty css           */import o from "../../_virtual/_plugin-vue_export-helper.js";
+// import "../../Menu.vue_vue_type_style_index_0_scoped_eb057818_lang.css"; //*');
+// import "../../Menu.vue_vue_type_style_index_1_lang.css";  //');
+const l = /* @__PURE__ */ o(e, [["__scopeId", "data-v-eb057818"]]);
+export {
+  l as default
+};

package/components/menu/Menu.vue2.js

@@ -0,0 +1,62 @@
+ import "../../Menu.vue_vue_type_style_index_0_scoped_eb057818_lang.css";  import "../../Menu.vue_vue_type_style_index_1_lang.css";  import { defineComponent as k, ref as s, computed as u, openBlock as v, createBlock as h, unref as t, withCtx as a, createElementVNode as l, renderSlot as f } from "vue";
+import { Dropdown as C } from "floating-vue";
+import { onClickOutside as w } from "@vueuse/core";
+import { useToggle as B } from "../../composables/useToggle.js";
+const $ = /* @__PURE__ */ k({
+  __name: "Menu",
+  props: {
+    isOnTop: { type: Boolean, default: !0 },
+    distance: { default: 0 },
+    theme: { default: "dropdown" },
+    skidding: { default: 0 },
+    container: { default: "body" },
+    testId: { default: "" }
+  },
+  setup(e) {
+    const [c, d] = B({ initialValue: !1 }), r = s(), n = s(), p = u(() => n.value?.getBoundingClientRect()), g = u(() => {
+      if (!r.value || !n.value)
+        return;
+      const { width: o } = n.value.getBoundingClientRect();
+      return -o;
+    });
+    return w(r, () => {
+      d(!1);
+    }), (o, i) => (v(), h(t(C), {
+      class: "menu",
+      theme: "is-menu",
+      triggers: [],
+      shown: t(c),
+      placement: "auto-start",
+      container: e.container,
+      flip: "",
+      distance: e.isOnTop ? t(g) : e.distance,
+      skidding: e.isOnTop ? -t(p)?.height / 2 : e.distance,
+      "auto-hide": !1,
+      "test-id": e.testId
+    }, {
+      popper: a(() => [
+        l("div", {
+          ref_key: "popup",
+          ref: r,
+          class: "menu-popup",
+          onClick: i[1] || (i[1] = (m) => t(d)(!1))
+        }, [
+          f(o.$slots, "default", {}, void 0, !0)
+        ], 512)
+      ]),
+      default: a(() => [
+        l("div", {
+          ref_key: "triggerRef",
+          ref: n,
+          onClick: i[0] || (i[0] = (m) => t(d)())
+        }, [
+          f(o.$slots, "trigger", {}, void 0, !0)
+        ], 512)
+      ]),
+      _: 3
+    }, 8, ["shown", "container", "distance", "skidding", "test-id"]));
+  }
+});
+export {
+  $ as default
+};

package/components/menu/index.js

@@ -0,0 +1,6 @@
+import e from "./Menu.vue.js";
+const n = () => [e];
+export {
+  e as Menu,
+  n as MenuTypes
+};

package/components/menuItem/MenuItem.vue.js

@@ -0,0 +1,26 @@
+import "../typography/Heading.vue.js";
+import n from "../typography/Text.vue.js";
+import { resolveComponent as s, openBlock as r, createElementBlock as c, createElementVNode as d, renderSlot as t, createVNode as i, withCtx as a } from "vue";
+/* empty css               */import m from "../../_virtual/_plugin-vue_export-helper.js";
+const p = {
+  components: { Text: n }
+}, f = { class: "menu-item" }, l = { class: "start-icon" };
+function u(e, _, $, h, v, x) {
+  const o = s("Text");
+  return r(), c("div", f, [
+    d("div", l, [
+      t(e.$slots, "start-icon", {}, void 0, !0)
+    ]),
+    i(o, { size: "sm" }, {
+      default: a(() => [
+        t(e.$slots, "default", {}, void 0, !0)
+      ]),
+      _: 3
+    }),
+    t(e.$slots, "end-icon", {}, void 0, !0)
+  ]);
+}
+const I = /* @__PURE__ */ m(p, [["render", u], ["__scopeId", "data-v-c7e837fa"]]);
+export {
+  I as default
+};

package/components/menuItem/index.js

@@ -0,0 +1,6 @@
+import e from "./MenuItem.vue.js";
+const m = () => [e];
+export {
+  e as MenuItem,
+  m as MenuItemTypes
+};

package/components/popover/Popover.vue2.js

@@ -0,0 +1,5 @@
+import e from "./Popover.vue.js";
+/* empty css              */console.log('global// import "../../Popover.vue_vue_type_style_index_0_lang.css"; //');
+export {
+  e as default
+};

package/components/popover/index.js

@@ -0,0 +1,7 @@
+import "./Popover.vue2.js";
+import o from "./Popover.vue.js";
+const e = () => [o];
+export {
+  o as Popover,
+  e as PopoverTypes
+};

package/components/radioButton/RadioButton.vue.js

@@ -0,0 +1,7 @@
+import o from "./RadioButton.vue2.js";
+/* empty css                  */import t from "../../_virtual/_plugin-vue_export-helper.js";
+// import "../../RadioButton.vue_vue_type_style_index_0_scoped_f5d3359c_lang.css"; //*');
+const c = /* @__PURE__ */ t(o, [["__scopeId", "data-v-f5d3359c"]]);
+export {
+  c as default
+};

package/components/radioButton/RadioButton.vue2.js

@@ -0,0 +1,82 @@
+ import "../../RadioButton.vue_vue_type_style_index_0_scoped_f5d3359c_lang.css"; import { defineComponent as V, openBlock as o, createElementBlock as k, normalizeClass as x, unref as t, createElementVNode as d, withDirectives as B, isRef as E, vModelRadio as I, renderSlot as y, createVNode as C, withCtx as i, createTextVNode as s, toDisplayString as n, createBlock as b, createCommentVNode as T } from "vue";
+import u from "../typography/Text.vue.js";
+import { useRadio as N } from "./useRadio.js";
+import { RadioTestIdModifiers as f } from "../../testids/index.js";
+const w = { class: "wrapper" }, z = ["value", "name", "disabled", "data-testid"], D = ["data-testid"], S = /* @__PURE__ */ V({
+  __name: "RadioButton",
+  props: {
+    label: { default: "" },
+    name: { default: "" },
+    helperText: { default: "" },
+    errorText: { default: "" },
+    modelValue: { default: void 0 },
+    testId: { default: "" }
+  },
+  emits: ["update:modelValue", "change"],
+  setup(e, { emit: v }) {
+    const R = e, { radioRef: $, focus: m, disabled: c, modelValue: l, radioGroup: h } = N(
+      R,
+      v
+    );
+    return (p, a) => (o(), k("label", {
+      class: x(["radio-button", { "radio-button--disabled": t(c) }])
+    }, [
+      d("span", w, [
+        B(d("input", {
+          ref_key: "radioRef",
+          ref: $,
+          "onUpdate:modelValue": a[0] || (a[0] = (r) => E(l) ? l.value = r : null),
+          value: e.label,
+          name: e.name || t(h)?.name,
+          type: "radio",
+          disabled: t(c),
+          "data-testid": `${e.testId}-${t(f).FIELD}`,
+          onFocus: a[1] || (a[1] = (r) => m.value = !0),
+          onBlur: a[2] || (a[2] = (r) => m.value = !1)
+        }, null, 40, z), [
+          [I, t(l)]
+        ]),
+        d("span", {
+          class: x([{ "circle--selected": t(l) === e.label }, "circle"])
+        }, null, 2)
+      ]),
+      d("span", {
+        class: "label",
+        "data-testid": `${e.testId}-${t(f).LABEL}`
+      }, [
+        y(p.$slots, "default", {}, () => [
+          C(u, { "is-truncated": "" }, {
+            default: i(() => [
+              s(n(e.label), 1)
+            ]),
+            _: 1
+          })
+        ], !0),
+        !e.errorText && e.helperText ? (o(), b(u, {
+          key: 0,
+          class: "helper-text--text helper-text",
+          size: "caption"
+        }, {
+          default: i(() => [
+            s(n(e.helperText), 1)
+          ]),
+          _: 1
+        })) : T("", !0),
+        e.errorText ? (o(), b(u, {
+          key: 1,
+          size: "caption",
+          class: "helper-text--error helper-text",
+          "data-testid": `${e.testId}-${t(f).ERROR_TEXT}`
+        }, {
+          default: i(() => [
+            s(n(e.errorText), 1)
+          ]),
+          _: 1
+        }, 8, ["data-testid"])) : T("", !0)
+      ], 8, D)
+    ], 2));
+  }
+});
+export {
+  S as default
+};

package/components/radioButton/RadioGroup.vue.js

@@ -0,0 +1,7 @@
+import o from "./RadioGroup.vue2.js";
+/* empty css                 */import _ from "../../_virtual/_plugin-vue_export-helper.js";
+// import "../../RadioGroup.vue_vue_type_style_index_0_scoped_50bc6963_lang.css"; //*');
+const t = /* @__PURE__ */ _(o, [["__scopeId", "data-v-50bc6963"]]);
+export {
+  t as default
+};

package/components/radioButton/RadioGroup.vue2.js

@@ -0,0 +1,44 @@
+ import "../../RadioGroup.vue_vue_type_style_index_0_scoped_50bc6963_lang.css"; import { defineComponent as u, ref as c, onMounted as f, computed as m, provide as p, reactive as y, toRefs as g, openBlock as h, createElementBlock as v, normalizeClass as I, unref as R, renderSlot as k, nextTick as G } from "vue";
+import { useId as B } from "../../composables/useId.js";
+import { radioGroupKey as _ } from "./useRadio.js";
+import { RadioTestIdModifiers as b } from "../../testids/index.js";
+const w = ["data-testid"], C = /* @__PURE__ */ u({
+  __name: "RadioGroup",
+  props: {
+    name: { default: "" },
+    disabled: { type: Boolean, default: !1 },
+    modelValue: null,
+    row: { type: Boolean, default: !1 },
+    testId: { default: "" }
+  },
+  emits: ["update:modelValue", "change"],
+  setup(o, { emit: r }) {
+    const a = o, n = B(), d = c(), s = (e) => {
+      r("update:modelValue", e), G(() => r("change", e));
+    };
+    f(() => {
+      const e = d.value?.querySelectorAll("[type=radio]"), t = e[0];
+      !Array.from(e).some((i) => i.checked) && t && (t.tabIndex = 0);
+    });
+    const l = m(() => a.name || n.value);
+    return p(
+      _,
+      y({
+        ...g(a),
+        changeEvent: s,
+        name: l
+      })
+    ), (e, t) => (h(), v("div", {
+      ref_key: "radioGroupRef",
+      ref: d,
+      class: I([{ "radio-group--row": o.row }, "radio-group"]),
+      role: "radiogroup",
+      "data-testid": `${o.testId}-${R(b).GROUP}`
+    }, [
+      k(e.$slots, "default", {}, void 0, !0)
+    ], 10, w));
+  }
+});
+export {
+  C as default
+};

package/components/radioButton/index.js

@@ -0,0 +1,8 @@
+import o from "./RadioButton.vue.js";
+import t from "./RadioGroup.vue.js";
+const p = () => [o, t];
+export {
+  o as RadioButton,
+  p as RadioButtonTypes,
+  t as RadioGroup
+};

package/components/search/v3/Search.vue.js

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

package/components/search/v3/Search.vue2.js

@@ -0,0 +1,62 @@
+ import "../../../Search.vue_vue_type_style_index_0_scoped_446ea6ad_lang.css"; import { defineComponent as v, openBlock as a, createElementBlock as b, normalizeClass as l, unref as e, createBlock as i, createCommentVNode as c, createElementVNode as g } from "vue";
+import r from "../../icon/Icon.vue.js";
+import { SearchTestIdModifiers as o } from "../../../testids/index.js";
+import { searchCommon as p } from "../common/Search.common.js";
+const z = ["data-testid"], E = ["value", "placeholder", "disabled", "data-testid"], L = /* @__PURE__ */ v({
+  __name: "Search",
+  props: {
+    modelValue: null,
+    placeholder: null,
+    variant: { default: "default" },
+    size: { default: "sm" },
+    disabled: { type: Boolean, default: !1 },
+    testId: { default: "" }
+  },
+  emits: ["update:modelValue"],
+  setup(t, { expose: u, emit: m }) {
+    const f = t, {
+      showLeftIcon: h,
+      updateValue: d,
+      showRightIcon: I,
+      showClear: C,
+      rightIcon: k,
+      onRightIconClick: V,
+      inputRef: n
+    } = p(f, m);
+    return u({
+      inputRef: n
+    }), (R, s) => (a(), b("div", {
+      class: l(["search-container", `${t.size}`]),
+      "data-testid": `${t.testId}-${e(o).CONTAINER}`
+    }, [
+      e(h) ? (a(), i(e(r), {
+        key: 0,
+        class: "search-left-icon",
+        name: "search-bold",
+        "font-size": "sm"
+      })) : c("", !0),
+      g("input", {
+        ref_key: "inputRef",
+        ref: n,
+        class: l({ [t.variant]: !0, activated: t.modelValue !== "" }),
+        value: t.modelValue,
+        placeholder: t.placeholder,
+        disabled: t.disabled,
+        "data-testid": `${t.testId}-${e(o).FIELD}`,
+        onInput: s[0] || (s[0] = //@ts-ignore
+        (...$) => e(d) && e(d)(...$))
+      }, null, 42, E),
+      e(I) ? (a(), i(e(r), {
+        key: 1,
+        class: l(["search-right-icon", { "search-right-icon-clear": e(C) }]),
+        name: e(k),
+        "font-size": "sm",
+        "data-testid": `${t.testId}-${e(o).CLOSE}`,
+        onClick: e(V)
+      }, null, 8, ["class", "name", "data-testid", "onClick"])) : c("", !0)
+    ], 10, z));
+  }
+});
+export {
+  L as default
+};

package/components/search/v3/index.js

@@ -0,0 +1,6 @@
+import r from "./Search.vue.js";
+const o = () => [r];
+export {
+  r as Search,
+  o as SearchTypes
+};

package/components/search/v4/SearchV4.vue.js

@@ -0,0 +1,7 @@
+import o from "./SearchV4.vue2.js";
+/* empty css               */import e from "../../../_virtual/_plugin-vue_export-helper.js";
+// import "../../../SearchV4.vue_vue_type_style_index_0_scoped_71404005_lang.css"; //*');
+const c = /* @__PURE__ */ e(o, [["__scopeId", "data-v-71404005"]]);
+export {
+  c as default
+};