@wikicasa-dev/components 2.1.3 → 2.1.4-alpha.10

package/dist/packages/components/lib/UIKit/Accordion/BaseAccordionItem.vue.js

@@ -1,8 +1,8 @@
-import { defineComponent as h, ref as $, inject as p, watch as l, unref as d, createElementBlock as v, openBlock as u, normalizeClass as m, createBlock as y, createCommentVNode as g, renderSlot as s, createElementVNode as f, withModifiers as O, createVNode as k, withCtx as c } from "vue";
+import { defineComponent as h, ref as $, inject as C, watch as l, unref as d, createElementBlock as v, openBlock as u, normalizeClass as m, createBlock as y, createCommentVNode as g, renderSlot as s, createElementVNode as f, withModifiers as O, createVNode as k, withCtx as c } from "vue";
 import A from "./BaseAccordionBtn.vue.js";
 import B from "./BaseAccordionContent.vue.js";
-import { ArrowIcon as E } from "../../../../../node_modules/.pnpm/@wikicasa-dev_svg-icons@1.2.11_typescript@5.8.3/node_modules/@wikicasa-dev/svg-icons/dist/ArrowIcon.js";
-import "../../../../../node_modules/.pnpm/@wikicasa-dev_svg-icons@1.2.11_typescript@5.8.3/node_modules/@wikicasa-dev/svg-icons/dist/PharmacyIcon.js";
+import { ArrowIcon as E } from "../../../../../node_modules/.pnpm/@wikicasa-dev_svg-icons@1.2.12_typescript@5.8.3/node_modules/@wikicasa-dev/svg-icons/dist/ArrowIcon.js";
+import "../../../../../node_modules/.pnpm/@wikicasa-dev_svg-icons@1.2.12_typescript@5.8.3/node_modules/@wikicasa-dev/svg-icons/dist/PharmacyIcon.js";
 const W = { key: 0 }, I = ["id", "data-cy", "aria-expanded", "aria-controls"], M = ["itemprop", "innerHTML"], P = /* @__PURE__ */ h({
   inheritAttrs: !1,
   __name: "BaseAccordionItem",
@@ -26,31 +26,31 @@ const W = { key: 0 }, I = ["id", "data-cy", "aria-expanded", "aria-controls"], M
   },
   emits: ["click", "accordionOpened", "accordionClosed", "update:accordionState"],
   setup(i, { emit: w }) {
-    const a = w, o = $(!1), r = p(
+    const a = w, o = $(!1), r = C(
       "accordionItems",
       () => {
       },
       !0
-    ), b = p(
+    ), b = C(
       "handleClick",
       () => {
       },
       !0
-    ), C = (e, t = !1) => {
+    ), p = (e, t = !1) => {
       a(t ? "accordionOpened" : "accordionClosed", e), a("update:accordionState", t);
     };
     r && (r.value[i.id] = { id: i.id, title: i.title, active: i.active }), l(
       () => d(r),
       (e) => {
         const t = e?.[i.id];
-        !t || o.value === t.active || (o.value = t.active ?? !1, C(
+        !t || o.value === t.active || (o.value = t.active ?? !1, p(
           { id: i.id, title: i.title, active: t.active },
           t.active
         ));
       },
       { deep: !0, immediate: !0 }
     ), l(o, (e) => {
-      o.value = e, C({ id: i.id, title: i.title, active: o.value }, e);
+      o.value = e, p({ id: i.id, title: i.title, active: o.value }, e);
     }), l(
       () => i.active,
       (e) => {
@@ -68,7 +68,7 @@ const W = { key: 0 }, I = ["id", "data-cy", "aria-expanded", "aria-controls"], M
         f("button", {
           id: `accordion-title-${e.id}`,
           type: "button",
-          class: m(["uikit-flex uikit-w-full uikit-items-center uikit-justify-between uikit-border-0 uikit-bg-white uikit-px-5 uikit-py-4 uikit-text-left uikit-font-semibold uikit-transition-colors active:max-sm:uikit-bg-w-cultured hover:sm:uikit-bg-w-cultured", e.btnClasses]),
+          class: m(["uikit-flex uikit-w-full uikit-items-center uikit-justify-between uikit-border-0 uikit-bg-white uikit-px-[20px] uikit-py-md uikit-text-left uikit-font-semibold uikit-transition-colors active:max-sm:uikit-bg-w-cultured hover:sm:uikit-bg-w-cultured", e.btnClasses]),
           "data-cy": e.dataCy,
           "aria-expanded": o.value,
           "aria-controls": `accordion-text-${e.id}`,

package/dist/packages/components/lib/UIKit/BaseAlert.vue.js

@@ -1,19 +1,113 @@
-import { defineComponent as t, createElementBlock as r, openBlock as s, normalizeClass as a, renderSlot as l } from "vue";
-const o = ["id"], p = /* @__PURE__ */ t({
+import { defineComponent as g, mergeModels as T, useModel as h, ref as w, watch as x, nextTick as y, createBlock as f, openBlock as m, unref as e, withCtx as l, renderSlot as r, createVNode as i, normalizeClass as C, createCommentVNode as I, normalizeStyle as b } from "vue";
+import { CloseIcon as V } from "../../../../node_modules/.pnpm/@wikicasa-dev_svg-icons@1.2.12_typescript@5.8.3/node_modules/@wikicasa-dev/svg-icons/dist/CloseIcon.js";
+import "../../../../node_modules/.pnpm/@wikicasa-dev_svg-icons@1.2.12_typescript@5.8.3/node_modules/@wikicasa-dev/svg-icons/dist/PharmacyIcon.js";
+import { ToastProvider as $, ToastRoot as z, ToastTitle as M, ToastDescription as P, ToastClose as B, ToastAction as D, ProgressRoot as j, ProgressIndicator as A, ToastViewport as N } from "reka-ui";
+const X = /* @__PURE__ */ g({
   __name: "BaseAlert",
-  props: {
-    alertClass: { default: "" }
-  },
+  props: /* @__PURE__ */ T({
+    alertClass: { default: "primary" },
+    duration: { default: 3e3 }
+  }, {
+    open: { default: !1 },
+    openModifiers: {}
+  }),
+  emits: ["update:open"],
   setup(n) {
-    return (e, i) => (s(), r("div", {
-      id: e.$attrs.id,
-      class: a(["uikit-alert", e.alertClass]),
-      role: "alert"
-    }, [
-      l(e.$slots, "default")
-    ], 10, o));
+    const u = h(n, "open"), o = w(0);
+    let d = -1, k = -1;
+    const c = (t = 3e3) => {
+      o.value = 0;
+      const a = Date.now();
+      k = setInterval(() => {
+        const v = Date.now() - a;
+        o.value = Math.min(100, v / t * 100), o.value >= 100 && clearInterval(k);
+      }, 30);
+    }, p = () => {
+      clearTimeout(d), d = setTimeout(() => {
+        u.value = !1;
+      }, n.duration), c(n.duration);
+    };
+    return x(
+      u,
+      (t) => {
+        y(() => {
+          if (t) {
+            p();
+            return;
+          }
+          clearInterval(k), clearTimeout(d), o.value = 0;
+        });
+      },
+      { immediate: !0 }
+    ), (t, a) => (m(), f(e($), null, {
+      default: l(() => [
+        r(t.$slots, "trigger", {
+          open: () => u.value = !0
+        }),
+        i(e(z), {
+          open: u.value,
+          "onUpdate:open": a[1] || (a[1] = (s) => u.value = s),
+          duration: t.duration,
+          class: C(["toast-root uikit-shadow-surface uikit-relative uikit-flex uikit-gap-x-xs uikit-overflow-hidden uikit-rounded-2xs uikit-p-md uikit-text-16 uikit-font-medium sm:uikit-max-w-[460px]", ["uikit-alert", `uikit-alert-w-${t.alertClass}`]])
+        }, {
+          default: l(() => [
+            t.$slots.title ? (m(), f(e(M), {
+              key: 0,
+              "as-child": ""
+            }, {
+              default: l(() => [
+                r(t.$slots, "title")
+              ]),
+              _: 3
+            })) : I("", !0),
+            i(e(P), { "as-child": "" }, {
+              default: l(() => [
+                r(t.$slots, "default"),
+                i(e(B), { class: "uikit-ml-md uikit-flex uikit-size-lg uikit-shrink-0 uikit-cursor-pointer uikit-appearance-none uikit-items-center uikit-justify-center uikit-rounded-full uikit-bg-w-lightgray" }, {
+                  default: l(() => [
+                    i(e(V), {
+                      width: 12,
+                      height: 12,
+                      "stroke-color": "#fff"
+                    })
+                  ]),
+                  _: 1
+                })
+              ]),
+              _: 3
+            }),
+            i(e(D), {
+              class: "[grid-area:_action]",
+              "as-child": "",
+              "alt-text": "Goto schedule to undo"
+            }, {
+              default: l(() => [
+                r(t.$slots, "toast-action")
+              ]),
+              _: 3
+            }),
+            i(e(j), {
+              modelValue: o.value,
+              "onUpdate:modelValue": a[0] || (a[0] = (s) => o.value = s),
+              class: "uikit-absolute uikit-bottom-0 uikit-left-0 uikit-h-2xs uikit-w-full uikit-overflow-hidden"
+            }, {
+              default: l(() => [
+                i(e(A), {
+                  class: "uikit-relative uikit-block uikit-size-full uikit-bg-w-blue uikit-transition-transform uikit-duration-75 uikit-will-change-transform",
+                  style: b(`transform: translateX(-${100 - o.value}%)`)
+                }, null, 8, ["style"])
+              ]),
+              _: 1
+            }, 8, ["modelValue"])
+          ]),
+          _: 3
+        }, 8, ["open", "duration", "class"]),
+        i(e(N), { class: "uikit-fixed uikit-bottom-0 uikit-right-0 uikit-flex uikit-size-full uikit-list-none uikit-flex-col uikit-items-end uikit-justify-end uikit-p-0" })
+      ]),
+      _: 3
+    }));
   }
 });
 export {
-  p as default
+  X as default
 };

package/dist/packages/components/lib/UIKit/BaseAutocomplete.vue.js

@@ -1,5 +1,6 @@
 import { defineComponent as L, mergeModels as y, useModel as F, ref as d, computed as k, onBeforeMount as H, watch as f, createBlock as g, openBlock as h, normalizeClass as K, withCtx as s, createElementBlock as T, Fragment as z, renderList as A, unref as N, createElementVNode as U, createVNode as W, renderSlot as $ } from "vue";
-import j from "../../../../UIKit/BaseInput.js";
+import j from "./BaseInput.vue.js";
+import '../../../../assets/packages/components/lib/UIKit/BaseInput.css';/* empty css               */
 import q from "./BaseDropDown.vue.js";
 import "../../../../node_modules/.pnpm/js-cookie@3.0.5/node_modules/js-cookie/dist/js.cookie.js";
 import { debounce as G } from "../../../../node_modules/.pnpm/@wikicasa-dev_utilities@1.1.21/node_modules/@wikicasa-dev/utilities/dist/utils/FunctionUtils.js";
@@ -35,7 +36,7 @@ const R = ["innerHTML"], ne = /* @__PURE__ */ L({
     const r = F(
       o,
       "modelValue"
-    ), u = V, i = d(""), n = d([]), p = d(null), b = d(!1), l = d(!1), w = d(null), B = k(() => n.value.length);
+    ), u = V, i = d(""), a = d([]), p = d(null), b = d(!1), l = d(!1), w = d(null), B = k(() => a.value.length);
     H(() => {
       p.value = G({ delay: 300 }, o.onInputChangeCb);
     });
@@ -50,22 +51,22 @@ const R = ["innerHTML"], ne = /* @__PURE__ */ L({
         case "all-bordered":
           return "!uikit-rounded " + (l.value && "!uikit-rounded-b-none");
         case "all-bordered-thick":
-          return "!uikit-rounded-xl !uikit-h-[52px] " + (l.value && "!uikit-rounded-b-none");
+          return "!uikit-rounded-[30px] !uikit-h-[52px] " + (l.value && "!uikit-rounded-b-none");
         default:
           return "";
       }
-    }), I = k(() => {
+    }), M = k(() => {
       switch (o.theme) {
         case "bordered":
           return "";
         case "all-bordered":
           return "uikit-border uikit-border-w-lavender uikit-border-solid !uikit-rounded !uikit-border-w-lavender !uikit-border " + (l.value ? "!uikit-border-b-0 !uikit-rounded-b-none" : "");
         case "all-bordered-thick":
-          return "!uikit-rounded-xl !uikit-h-[60px] !uikit-border-w-lavender !uikit-border-none " + (l.value ? "!uikit-rounded-b-none" : "");
+          return "!uikit-rounded-[30px] !uikit-h-[60px] !uikit-border-w-lavender !uikit-border-none " + (l.value ? "!uikit-rounded-b-none" : "");
         default:
           return "";
       }
-    }), M = k(() => {
+    }), I = k(() => {
       const e = "uikit-rounded-b-xl uikit-shadow uikit-rounded-t-none uikit-mb-0 !uikit-mt-0 uikit-text-w-black !uikit-rounded-b-xl !uikit-rounded-t-none";
       switch (o.theme) {
         case "bordered":
@@ -80,15 +81,15 @@ const R = ["innerHTML"], ne = /* @__PURE__ */ L({
     }), D = async (e) => {
       if (i.value !== e && (u("changedValue", e), i.value = e, !!o.onInputChangeCb)) {
         if (!e || b.value) {
-          n.value = [], b.value = !1, m.value = -1, v.value = -1, r.value && (r.value.label = ""), l.value = !1, await p.value(null);
+          a.value = [], b.value = !1, m.value = -1, v.value = -1, r.value && (r.value.label = ""), l.value = !1, await p.value(null);
           return;
         }
-        o.disableCb || (n.value = await p.value(e), l.value = !!n.value.length);
+        o.disableCb || (a.value = await p.value(e), l.value = !!a.value.length);
       }
     }, C = (e, t) => {
-      o.onOptionSelectedCb && o.onOptionSelectedCb(e), o.cleanupOnClose && (n.value = []), b.value = !0, i.value = e.label, r.value = e, l.value = !1, m.value = t;
+      o.onOptionSelectedCb && o.onOptionSelectedCb(e), o.cleanupOnClose && (a.value = []), b.value = !0, i.value = e.label, r.value = e, l.value = !1, m.value = t;
     }, E = () => {
-      n.value.length && o.keepState !== "closed" && (l.value = !0);
+      a.value.length && o.keepState !== "closed" && (l.value = !0);
     };
     return f(
       r,
@@ -97,13 +98,13 @@ const R = ["innerHTML"], ne = /* @__PURE__ */ L({
       },
       { immediate: !0 }
     ), f(m, (e) => {
-      if (e === -1 || !n.value.length) return;
-      const t = n.value[e];
+      if (e === -1 || !a.value.length) return;
+      const t = a.value[e];
       b.value && t.label === r.value?.label || C(t, e);
     }), f(
       () => o.keepState,
       (e) => {
-        e === "closed" ? (l.value = !1, o.cleanupOnClose && (n.value = [])) : e === "open" && n.value.length && (l.value = !0);
+        e === "closed" ? (l.value = !1, o.cleanupOnClose && (a.value = [])) : e === "open" && a.value.length && (l.value = !0);
       }
     ), f(l, (e) => {
       u("update:dropdownState", e);
@@ -120,18 +121,18 @@ const R = ["innerHTML"], ne = /* @__PURE__ */ L({
         { "all-bordered-dropdown": e.theme === "all-bordered" },
         { "all-bordered-dropdown thick": e.theme === "all-bordered-thick" },
         {
-          "uikit-mt-10px !uikit-border !uikit-border-w-secondary !uikit-rounded-xs": !e.theme
+          "uikit-mt-10px !uikit-border !uikit-border-w-lightgray !uikit-rounded-xs": !e.theme
         },
-        M.value,
+        I.value,
         "!uikit-max-h-[210px] uikit-z-30",
         e.dropdownClasses
       ],
       "open-dropdown": l.value,
-      "keep-state": !n.value.length || e.keepState === "closed" ? "closed" : "opened",
+      "keep-state": !a.value.length || e.keepState === "closed" ? "closed" : "opened",
       "close-when-clicked-outside": e.closeDropdownOnBodyPressed,
       "activate-keyboard-controller": !1,
-      "onUpdate:dropdownState": t[3] || (t[3] = (a) => l.value = a),
-      onClick: t[4] || (t[4] = (a) => {
+      "onUpdate:dropdownState": t[3] || (t[3] = (n) => l.value = n),
+      onClick: t[4] || (t[4] = (n) => {
         u("click"), E();
       })
     }, {
@@ -153,31 +154,31 @@ const R = ["innerHTML"], ne = /* @__PURE__ */ L({
             e.inputClasses,
             "!uikit-ml-0 !uikit-w-full"
           ],
-          "fieldset-classes": [I.value, e.fieldsetClasses],
-          "onUpdate:modelValue": t[0] || (t[0] = (a) => D(a === void 0 ? "" : `${a}`)),
-          onKeydown: t[1] || (t[1] = (a) => u("keydown", a)),
+          "fieldset-classes": [M.value, e.fieldsetClasses],
+          "onUpdate:modelValue": t[0] || (t[0] = (n) => D(n === void 0 ? "" : `${n}`)),
+          onKeydown: t[1] || (t[1] = (n) => u("keydown", n)),
           onKeydownEnterPressed: t[2] || (t[2] = () => u("keydownEnterPressed"))
         }, {
           leftIcon: s(() => [
             $(e.$slots, "lefticon")
           ]),
-          righticon: s(({ handleClean: a }) => [
-            $(e.$slots, "righticon", { handleClean: a })
+          righticon: s(({ handleClean: n }) => [
+            $(e.$slots, "righticon", { handleClean: n })
           ]),
           _: 3
         }, 8, ["id", "data-cy", "label-text", "model-value", "is-valid", "disabled", "placeholder", "with-left-icon", "with-right-icon", "input-class", "fieldset-classes"])
       ]),
       default: s(() => [
-        (h(!0), T(z, null, A(n.value, (a, c) => (h(), g(J, {
+        (h(!0), T(z, null, A(a.value, (n, c) => (h(), g(J, {
           key: c,
           active: N(v) === c,
-          class: "uikit-m-1 uikit-rounded-[5px] uikit-px-5 uikit-py-10px hover:uikit-cursor-pointer",
-          onClick: (P) => C(a, c),
+          class: "uikit-py-xs uikit-m-1 uikit-rounded-[5px] uikit-px-5 hover:uikit-cursor-pointer",
+          onClick: (P) => C(n, c),
           onMouseover: (P) => v.value = c
         }, {
           default: s(() => [
             U("span", {
-              innerHTML: a.label
+              innerHTML: n.label
             }, null, 8, R)
           ]),
           _: 2

package/dist/packages/components/lib/UIKit/BaseBadge.vue.js

@@ -1,19 +1,54 @@
-import { defineComponent as s, createElementBlock as a, openBlock as t, normalizeClass as r, renderSlot as i } from "vue";
-const o = ["id"], p = /* @__PURE__ */ s({
-  inheritAttrs: !1,
+import { defineComponent as a, createElementBlock as t, openBlock as u, normalizeClass as d, renderSlot as r } from "vue";
+const l = /* @__PURE__ */ a({
   __name: "BaseBadge",
   props: {
-    badgeClass: { default: "uikit-badge-w-primary-sm" }
+    badgeClass: { default: "primary-sm" }
   },
-  setup(d) {
-    return (e, l) => (t(), a("span", {
-      id: e.$attrs.id,
-      class: r(["uikit-badge uikit-shadow-sm", e.badgeClass, e.$attrs.class])
+  setup(n) {
+    const e = {
+      /**
+       * @deprecated Old style
+       */
+      warning: "uikit-badge-w-warning",
+      /**
+       * @deprecated Old style
+       */
+      lavender: "uikit-badge-w-lavender",
+      /**
+       * @deprecated Old style
+       */
+      danger: "uikit-badge-w-danger",
+      /**
+       * @deprecated Old style
+       */
+      "outline-tag": "uikit-badge-outline-tag",
+      /**
+       * @deprecated Old style
+       */
+      "primary-sm": "uikit-badge-w-pink-sm",
+      /**
+       * @deprecated Old style
+       */
+      "dark-primary": "uikit-badge-w-darkblue",
+      /**
+       * @deprecated Old style
+       */
+      "outline-tag-listing": "uikit-badge-outline-tag-listing",
+      gold: "uikit-badge-gold",
+      silver: "uikit-badge-silver",
+      premium: "uikit-badge-premium",
+      luxury: "uikit-badge-luxury",
+      alert: "uikit-badge-alert",
+      new: "uikit-badge-new",
+      discount: "uikit-badge-discount"
+    };
+    return (i, s) => (u(), t("span", {
+      class: d(["uikit-badge uikit-rounded-2xs uikit-px-xs uikit-py-2xs uikit-text uikit-font-medium uikit-shadow-sm", e[i.badgeClass]])
     }, [
-      i(e.$slots, "default")
-    ], 10, o));
+      r(i.$slots, "default")
+    ], 2));
   }
 });
 export {
-  p as default
+  l as default
 };

package/dist/packages/components/lib/UIKit/BaseBanner/Background/BaseBannerBgElement1.vue.js

@@ -0,0 +1,29 @@
+import { defineComponent as o, createElementBlock as l, openBlock as n, createElementVNode as t } from "vue";
+const r = ["width", "height"], h = ["fill"], d = /* @__PURE__ */ o({
+  __name: "BaseBannerBgElement1",
+  props: {
+    width: { default: 726 },
+    height: { default: 96 },
+    color: { default: "#de1681" }
+  },
+  setup(i) {
+    return (e, a) => (n(), l("svg", {
+      xmlns: "http://www.w3.org/2000/svg",
+      "xmlns:xlink": "http://www.w3.org/1999/xlink",
+      width: e.width,
+      height: e.height,
+      viewBox: "0 0 726 96"
+    }, [
+      t("g", null, [
+        t("path", {
+          d: "M391.314,2.476C599.068-14.131,760.7,31.792,752.325,105.049S568.744,251.155,360.989,267.763-8.4,238.447-.022,165.19,183.559,19.084,391.314,2.476Z",
+          transform: "translate(400.913 -94.21) rotate(14)",
+          fill: e.color
+        }, null, 8, h)
+      ])
+    ], 8, r));
+  }
+});
+export {
+  d as default
+};

package/dist/packages/components/lib/UIKit/BaseBanner/Background/BaseBannerBgElement2.vue.js

@@ -0,0 +1,56 @@
+import { defineComponent as l, createElementBlock as i, openBlock as n, createElementVNode as e } from "vue";
+const r = ["width", "height"], s = ["fill"], h = /* @__PURE__ */ l({
+  __name: "BaseBannerBgElement2",
+  props: {
+    width: { default: 726 },
+    height: { default: 96 },
+    color: { default: "#c21973" }
+  },
+  setup(a) {
+    return (t, o) => (n(), i("svg", {
+      xmlns: "http://www.w3.org/2000/svg",
+      "xmlns:xlink": "http://www.w3.org/1999/xlink",
+      width: t.width,
+      height: t.height,
+      viewBox: "0 0 726 96"
+    }, [
+      o[0] || (o[0] = e("defs", null, [
+        e("filter", {
+          x: "-9",
+          y: "-7",
+          width: "744",
+          height: "114",
+          filterUnits: "userSpaceOnUse"
+        }, [
+          e("feOffset", {
+            dy: "2",
+            input: "SourceAlpha"
+          }),
+          e("feGaussianBlur", {
+            stdDeviation: "3",
+            result: "blur"
+          }),
+          e("feFlood", {
+            "flood-color": "#6e6e6e",
+            "flood-opacity": "0.6"
+          }),
+          e("feComposite", {
+            operator: "in",
+            in2: "blur"
+          }),
+          e("feComposite", { in: "SourceGraphic" })
+        ])
+      ], -1)),
+      e("g", null, [
+        e("path", {
+          d: "M296.562,2.236C453.63-11.06,575.519,21.962,568.808,75.994S429.328,184.605,272.26,197.9-6.7,178.176.013,124.145,139.494,15.533,296.562,2.236Z",
+          transform: "translate(442.664 -69.902) rotate(14)",
+          fill: t.color
+        }, null, 8, s)
+      ])
+    ], 8, r));
+  }
+});
+export {
+  h as default
+};

package/dist/packages/components/lib/UIKit/BaseBanner/Background/BaseBannerBgElement3.vue.js

@@ -0,0 +1,56 @@
+import { defineComponent as l, createElementBlock as i, openBlock as n, createElementVNode as e } from "vue";
+const r = ["width", "height"], s = ["fill"], h = /* @__PURE__ */ l({
+  __name: "BaseBannerBgElement3",
+  props: {
+    width: { default: 343 },
+    height: { default: 164 },
+    color: { default: "#c21973" }
+  },
+  setup(a) {
+    return (t, o) => (n(), i("svg", {
+      xmlns: "http://www.w3.org/2000/svg",
+      "xmlns:xlink": "http://www.w3.org/1999/xlink",
+      width: t.width,
+      height: t.height,
+      viewBox: "0 0 343 164"
+    }, [
+      o[0] || (o[0] = e("defs", null, [
+        e("filter", {
+          x: "-9",
+          y: "-7",
+          width: "361",
+          height: "182",
+          filterUnits: "userSpaceOnUse"
+        }, [
+          e("feOffset", {
+            dy: "2",
+            input: "SourceAlpha"
+          }),
+          e("feGaussianBlur", {
+            stdDeviation: "3",
+            result: "blur"
+          }),
+          e("feFlood", {
+            "flood-color": "#6e6e6e",
+            "flood-opacity": "0.6"
+          }),
+          e("feComposite", {
+            operator: "in",
+            in2: "blur"
+          }),
+          e("feComposite", { in: "SourceGraphic" })
+        ])
+      ], -1)),
+      e("g", null, [
+        e("path", {
+          d: "M127.936,6c81.713,23.824,157.7,113.234,169.726,199.7S253.192,342.96,171.478,319.137,13.776,205.9,1.752,119.434,46.222-17.82,127.936,6Z",
+          transform: "translate(24.544 291.435) rotate(-68)",
+          fill: t.color
+        }, null, 8, s)
+      ])
+    ], 8, r));
+  }
+});
+export {
+  h as default
+};

package/dist/packages/components/lib/UIKit/BaseBanner/Background/BaseBannerBgElement4.vue.js

@@ -0,0 +1,56 @@
+import { defineComponent as l, createElementBlock as r, openBlock as i, createElementVNode as e } from "vue";
+const n = ["width", "height"], s = { transform: "translate(-475 -2098)" }, a = ["fill"], h = /* @__PURE__ */ l({
+  __name: "BaseBannerBgElement4",
+  props: {
+    width: { default: 343 },
+    height: { default: 164 },
+    color: { default: "#de1681" }
+  },
+  setup(f) {
+    return (t, o) => (i(), r("svg", {
+      xmlns: "http://www.w3.org/2000/svg",
+      "xmlns:xlink": "http://www.w3.org/1999/xlink",
+      width: t.width,
+      height: t.height,
+      viewBox: "0 0 343 164"
+    }, [
+      o[0] || (o[0] = e("defs", null, [
+        e("filter", {
+          x: "-9",
+          y: "-7",
+          width: "361",
+          height: "182",
+          filterUnits: "userSpaceOnUse"
+        }, [
+          e("feOffset", {
+            dy: "2",
+            input: "SourceAlpha"
+          }),
+          e("feGaussianBlur", {
+            stdDeviation: "3",
+            result: "blur"
+          }),
+          e("feFlood", {
+            "flood-color": "#6e6e6e",
+            "flood-opacity": "0.6"
+          }),
+          e("feComposite", {
+            operator: "in",
+            in2: "blur"
+          }),
+          e("feComposite", { in: "SourceGraphic" })
+        ])
+      ], -1)),
+      e("g", s, [
+        e("path", {
+          d: "M167.755,7.884C276.138,41.063,377.561,163.273,394.291,280.848S336.72,466.841,228.337,433.663,18.531,278.274,1.8,160.7,59.373-25.294,167.755,7.884Z",
+          transform: "translate(426.502 2353.926) rotate(-52)",
+          fill: t.color
+        }, null, 8, a)
+      ])
+    ], 8, n));
+  }
+});
+export {
+  h as default
+};