comand-component-library 4.1.97 → 4.1.99

package/dist/comand-component-library.js

@@ -1,7 +1,7 @@
 var Hl = Object.defineProperty;
 var ql = (e, t, n) => t in e ? Hl(e, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[t] = n;
 var Je = (e, t, n) => ql(e, typeof t != "symbol" ? t + "" : t, n);
-import { defineComponent as hi, h as Fn, resolveComponent as we, openBlock as a, createBlock as v, normalizeClass as x, createElementBlock as r, getCurrentInstance as Rl, resolveDynamicComponent as Me, withModifiers as S, withCtx as k, withDirectives as ne, createElementVNode as o, createVNode as p, createCommentVNode as m, vShow as xe, Fragment as _, toDisplayString as y, renderSlot as A, normalizeProps as j, mergeProps as I, createTextVNode as H, renderList as q, Transition as Ae, toHandlers as zt, TransitionGroup as dn, createApp as jl, normalizeStyle as xt, guardReactiveProps as Ve, useCssVars as gi, vModelDynamic as Nl, vModelText as Gt, resolveDirective as Ul, vModelSelect as zl, vModelRadio as At, onBeforeUpdate as Gl, onMounted as Wl, onUnmounted as Kl, reactive as Yl } from "vue";
+import { defineComponent as hi, h as Fn, resolveComponent as we, openBlock as a, createBlock as v, normalizeClass as x, createElementBlock as r, getCurrentInstance as Rl, resolveDynamicComponent as Me, withModifiers as S, withCtx as k, withDirectives as te, createElementVNode as o, createVNode as p, createCommentVNode as m, vShow as xe, Fragment as _, toDisplayString as y, renderSlot as A, normalizeProps as j, mergeProps as I, createTextVNode as H, renderList as q, Transition as Ae, toHandlers as zt, TransitionGroup as dn, createApp as jl, normalizeStyle as xt, guardReactiveProps as Ve, useCssVars as gi, vModelDynamic as Nl, vModelText as Gt, resolveDirective as Ul, vModelSelect as zl, vModelRadio as At, onBeforeUpdate as Gl, onMounted as Wl, onUnmounted as Kl, reactive as Yl } from "vue";
 const $e = /^[a-z0-9]+(-[a-z0-9]+)*$/, kt = (e, t, n, s = "") => {
   const i = e.split(":");
   if (e.slice(0, 1) === "@") {
@@ -1445,7 +1445,7 @@ function ha(e, t, n, s, i, l) {
   }, {
     default: k(() => [
       n.componentTag === "ul" ? (a(), r("li", ea, [
-        ne(o("ul", {
+        te(o("ul", {
           class: "flex-container no-flex action-buttons",
           "data-component": n.componentName
         }, [
@@ -1517,7 +1517,7 @@ function ha(e, t, n, s, i, l) {
         ])
       ])) : (a(), r(_, { key: 1 }, [
         l.isOuterComponent ? (a(), r("p", aa, y(n.componentName), 1)) : m("", !0),
-        ne(o("ul", {
+        te(o("ul", {
           class: "flex-container no-flex action-buttons",
           "data-component": n.componentName,
           onMouseenter: t[12] || (t[12] = (...u) => l.addHighlightRelatedComponent && l.addHighlightRelatedComponent(...u)),
@@ -1732,7 +1732,7 @@ const qe = /* @__PURE__ */ M($o, [["render", ha]]), se = {
 }, ya = { class: "pre-headline-text-wrapper" }, ba = ["innerHTML"], xa = ["innerHTML"], Ca = { key: 1 }, va = ["innerHTML"], wa = { key: 2 }, ka = { class: "pre-headline-text" };
 function Ta(e, t, n, s, i, l) {
   var h;
-  const d = W, u = ie, c = qe;
+  const d = W, u = ne, c = qe;
   return !e.editModeContext || e.settingsContext || e.mainSidebarContext || n.headlineText ? (a(), r("div", {
     key: 0,
     class: x(["cmd-headline", { "has-pre-headline-text": n.preHeadlineText, "has-icon": (h = n.cmdIcon) == null ? void 0 : h.iconClass }, l.headlineTextAlign])
@@ -3148,7 +3148,7 @@ const xn = {
   class: "search-field-wrapper flex-container no-gap"
 }, xs = ["id", "maxlength", "value"], Cs = ["title"], vs = ["title"], ws = { key: 1 };
 function ks(e, t, n, s, i, l) {
-  var c, h, f, g, w, b, O, T, F, B, D, V, U, G, P, R, Y, Z, Q, oe, ee, le, re, me;
+  var c, h, f, g, w, b, O, T, F, B, D, V, U, G, P, R, Y, Z, Q, le, oe, ie, re, me;
   const d = W, u = gn;
   return n.element === "input" || n.element === "select" || n.element === "textarea" ? (a(), r("label", {
     key: 0,
@@ -3306,11 +3306,11 @@ function ks(e, t, n, s, i, l) {
         label: X,
         key: X
       }, [
-        (a(!0), r(_, null, q(E, (te, Ce) => (a(), r("option", {
+        (a(!0), r(_, null, q(E, (ee, Ce) => (a(), r("option", {
           key: Ce,
-          value: te.value,
-          selected: te.value === n.modelValue
-        }, y(te.text), 9, fs))), 128))
+          value: ee.value,
+          selected: ee.value === n.modelValue
+        }, y(ee.text), 9, fs))), 128))
       ], 8, ps))), 128)) : (a(!0), r(_, { key: 0 }, q(n.selectOptions, (E, X) => (a(), r("option", {
         key: X,
         value: E.value,
@@ -3379,14 +3379,14 @@ function ks(e, t, n, s, i, l) {
     (P = n.nativeButton) != null && P.icon && ((R = n.nativeButton) != null && R.text) ? (a(), r("span", ws, y(n.nativeButton.text), 1)) : (a(), r(_, { key: 2 }, [
       H(y(n.nativeButton.text), 1)
     ], 64)),
-    (Z = (Y = n.nativeButton) == null ? void 0 : Y.icon) != null && Z.show && ((oe = (Q = n.nativeButton) == null ? void 0 : Q.icon) == null ? void 0 : oe.position) === "after" ? (a(), v(d, {
+    (Z = (Y = n.nativeButton) == null ? void 0 : Y.icon) != null && Z.show && ((le = (Q = n.nativeButton) == null ? void 0 : Q.icon) == null ? void 0 : le.position) === "after" ? (a(), v(d, {
       key: 3,
-      iconClass: (le = (ee = n.nativeButton) == null ? void 0 : ee.icon) == null ? void 0 : le.iconClass,
+      iconClass: (ie = (oe = n.nativeButton) == null ? void 0 : oe.icon) == null ? void 0 : ie.iconClass,
       type: (me = (re = n.nativeButton) == null ? void 0 : re.icon) == null ? void 0 : me.iconType
     }, null, 8, ["iconClass", "type"])) : m("", !0)
   ], 16)) : m("", !0);
 }
-const ie = /* @__PURE__ */ M(Wa, [["render", ks]]), Ts = {
+const ne = /* @__PURE__ */ M(Wa, [["render", ks]]), Ts = {
   name: "CmdAddressDataItem",
   mixins: [se],
   data() {
@@ -3516,7 +3516,7 @@ const ie = /* @__PURE__ */ M(Wa, [["render", ks]]), Ts = {
   class: "country-name"
 };
 function Rs(e, t, n, s, i, l) {
-  const d = W, u = ie;
+  const d = W, u = ne;
   return a(), r(_, null, [
     o("dt", {
       class: x(["cmd-address-data-item", { address: n.addressEntry.name === "address" }]),
@@ -4421,7 +4421,7 @@ const Ne = /* @__PURE__ */ M(hr, [["render", br]]), xr = {
   class: "mandatory-text"
 }, Lr = ["type"], Ir = { key: 1 };
 function Br(e, t, n, s, i, l) {
-  const d = Ne, u = ie;
+  const d = Ne, u = ne;
   return a(), r("form", {
     class: x(["cmd-form", { error: i.errorOccurred }]),
     action: n.formAction,
@@ -4807,7 +4807,7 @@ const Dr = {
 }, Mr = ["innerHTML"], Vr = ["src", "alt", "title"], Pr = ["src", "alt", "title"], Ar = ["innerHTML"], Er = ["innerHTML"], Hr = ["src", "alt", "title"], qr = ["innerHTML"], Rr = ["src", "alt", "title"];
 function jr(e, t, n, s, i, l) {
   var c, h, f, g, w, b, O, T, F, B, D, V, U;
-  const d = ie, u = qe;
+  const d = ne, u = qe;
   return e.editModeContext ? (a(), v(u, {
     key: 0,
     ref: "editComponentWrapper",
@@ -4821,7 +4821,7 @@ function jr(e, t, n, s, i, l) {
     itemProvider: ((c = e.editModeConfig) == null ? void 0 : c.allowAddItem) !== !1 ? l.itemProvider : null
   }, {
     default: k((G) => {
-      var P, R, Y, Z, Q, oe, ee, le, re, me, E, X;
+      var P, R, Y, Z, Q, le, oe, ie, re, me, E, X;
       return [
         o("figure", {
           class: x(["cmd-image flex-container no-gap vertical", l.textAlign])
@@ -4835,7 +4835,7 @@ function jr(e, t, n, s, i, l) {
               required: !0,
               labelText: "Text figcaption",
               modelValue: l.editableFigcaptionText,
-              "onUpdate:modelValue": t[0] || (t[0] = (te) => l.editableFigcaptionText = te)
+              "onUpdate:modelValue": t[0] || (t[0] = (ee) => l.editableFigcaptionText = ee)
             }, null, 8, ["class", "modelValue"])) : (Y = n.figcaption) != null && Y.text ? (a(), r("figcaption", {
               key: 1,
               innerHTML: (Z = n.figcaption) == null ? void 0 : Z.text
@@ -4846,14 +4846,14 @@ function jr(e, t, n, s, i, l) {
               href: "#",
               class: ["box drop-area flex-container vertical", { "allow-drop": i.allowDrop }]
             }, zt(l.dragAndDropHandler, !0), {
-              onClick: t[1] || (t[1] = S((...te) => l.selectFiles && l.selectFiles(...te), ["prevent"])),
+              onClick: t[1] || (t[1] = S((...ee) => l.selectFiles && l.selectFiles(...ee), ["prevent"])),
               title: "Drag new image to this area to replace old one!"
             }), [
               t[6] || (t[6] = o("span", { class: "icon-image" }, null, -1)),
               o("img", {
                 src: l.imageSource,
                 alt: (Q = n.image) == null ? void 0 : Q.alt,
-                title: (oe = n.image) == null ? void 0 : oe.tooltip
+                title: (le = n.image) == null ? void 0 : le.tooltip
               }, null, 8, Vr)
             ], 16),
             p(d, {
@@ -4868,8 +4868,8 @@ function jr(e, t, n, s, i, l) {
           ], 64)) : l.imageSource ? (a(), r("img", {
             key: 2,
             src: l.imageSource,
-            alt: (ee = n.image) == null ? void 0 : ee.alt,
-            title: (le = n.image) == null ? void 0 : le.tooltip
+            alt: (oe = n.image) == null ? void 0 : oe.alt,
+            title: (ie = n.image) == null ? void 0 : ie.tooltip
           }, null, 8, Pr)) : m("", !0),
           (re = n.figcaption) != null && re.show && ((me = n.figcaption) == null ? void 0 : me.position) !== "top" ? (a(), r(_, { key: 3 }, [
             G.editing ? (a(), v(d, {
@@ -4881,7 +4881,7 @@ function jr(e, t, n, s, i, l) {
               labelText: "Text figcaption",
               showLabel: !1,
               modelValue: l.editableFigcaptionText,
-              "onUpdate:modelValue": t[2] || (t[2] = (te) => l.editableFigcaptionText = te),
+              "onUpdate:modelValue": t[2] || (t[2] = (ee) => l.editableFigcaptionText = ee),
               placeholder: "figcaption"
             }, null, 8, ["class", "modelValue"])) : (E = n.figcaption) != null && E.text ? (a(), r("figcaption", {
               key: 1,
@@ -4892,7 +4892,7 @@ function jr(e, t, n, s, i, l) {
             key: 4,
             type: "button",
             class: "button confirm",
-            onClick: t[3] || (t[3] = (...te) => l.onAddItem && l.onAddItem(...te))
+            onClick: t[3] || (t[3] = (...ee) => l.onAddItem && l.onAddItem(...ee))
           }, t[7] || (t[7] = [
             o("span", { class: "icon-add" }, null, -1),
             o("span", null, "Add new image", -1)
@@ -5633,7 +5633,7 @@ const td = Hi, nd = ["aria-label"], id = { class: "flex-container" }, ld = {
   class: "flex-container no-flex"
 }, fd = ["title"], hd = { key: 1 }, gd = ["title"], yd = { key: 1 };
 function bd(e, t, n, s, i, l) {
-  var g, w, b, O, T, F, B, D, V, U, G, P, R, Y, Z, Q, oe, ee, le, re, me, E, X, te, Ce, Le, Ie, Be, Fe, De, ke;
+  var g, w, b, O, T, F, B, D, V, U, G, P, R, Y, Z, Q, le, oe, ie, re, me, E, X, ee, Ce, Le, Ie, Be, Fe, De, ke;
   const d = J, u = W, c = ge, h = Lt, f = Ei;
   return a(), r("dialog", {
     ref: "dialog",
@@ -5690,7 +5690,7 @@ function bd(e, t, n, s, i, l) {
       e.fancyBoxImageUrl || (Q = e.cmdImage) != null && Q.image ? (a(), r("div", rd, [
         p(c, {
           image: e.largeSingleImage,
-          figcaption: (oe = e.cmdImage) == null ? void 0 : oe.figcaption
+          figcaption: (le = e.cmdImage) == null ? void 0 : le.figcaption
         }, null, 8, ["image", "figcaption"])
       ])) : e.fancyBoxContent ? (a(), r("div", {
         key: 1,
@@ -5713,17 +5713,17 @@ function bd(e, t, n, s, i, l) {
       ]))
     ], 2),
     e.showSubmitButtons && e.fancyBoxOptionsProperties.submitButtons ? (a(), r("footer", pd, [
-      (ee = e.fancyBoxOptionsProperties.submitButtons) != null && ee.cancel ? (a(), r("button", {
+      (oe = e.fancyBoxOptionsProperties.submitButtons) != null && oe.cancel ? (a(), r("button", {
         key: 0,
         onClick: t[3] || (t[3] = (...de) => e.cancel && e.cancel(...de)),
-        title: (le = e.fancyBoxOptionsProperties.submitButtons.cancel) == null ? void 0 : le.tooltip
+        title: (ie = e.fancyBoxOptionsProperties.submitButtons.cancel) == null ? void 0 : ie.tooltip
       }, [
         (re = e.fancyBoxOptionsProperties.submitButtons.cancel) != null && re.iconClass ? (a(), v(u, {
           key: 0,
           iconClass: (me = e.fancyBoxOptionsProperties.submitButtons.cancel) == null ? void 0 : me.iconClass,
           type: (E = e.fancyBoxOptionsProperties.submitButtons.cancel) == null ? void 0 : E.iconType
         }, null, 8, ["iconClass", "type"])) : m("", !0),
-        (X = e.fancyBoxOptionsProperties.submitButtons.cancel) != null && X.buttonText ? (a(), r("span", hd, y((te = e.fancyBoxOptionsProperties.submitButtons.cancel) == null ? void 0 : te.buttonText), 1)) : m("", !0)
+        (X = e.fancyBoxOptionsProperties.submitButtons.cancel) != null && X.buttonText ? (a(), r("span", hd, y((ee = e.fancyBoxOptionsProperties.submitButtons.cancel) == null ? void 0 : ee.buttonText), 1)) : m("", !0)
       ], 8, fd)) : m("", !0),
       (Ce = e.fancyBoxOptionsProperties.submitButtons) != null && Ce.confirm ? (a(), r("button", {
         key: 1,
@@ -6052,7 +6052,7 @@ const xd = /* @__PURE__ */ M(td, [["render", bd]]), Cd = {
   class: "flex-container"
 }, _d = ["innerHTML"];
 function Od(e, t, n, s, i, l) {
-  const d = J, u = ie, c = Ai;
+  const d = J, u = ne, c = Ai;
   return a(), r("div", vd, [
     n.cmdHeadline ? (a(), v(d, j(I({ key: 0 }, n.cmdHeadline)), null, 16)) : m("", !0),
     p(c, I({
@@ -6066,7 +6066,7 @@ function Od(e, t, n, s, i, l) {
       ref: "form"
     }), {
       default: k(() => {
-        var h, f, g, w, b, O, T, F, B, D, V, U, G, P, R, Y, Z, Q, oe, ee, le, re, me, E, X, te, Ce, Le, Ie, Be, Fe, De, ke, de, at, st, We, rt, dt, ut, ct;
+        var h, f, g, w, b, O, T, F, B, D, V, U, G, P, R, Y, Z, Q, le, oe, ie, re, me, E, X, ee, Ce, Le, Ie, Be, Fe, De, ke, de, at, st, We, rt, dt, ut, ct;
         return [
           n.configuration.salutation ? (a(), r("div", wd, [
             p(u, {
@@ -6162,7 +6162,7 @@ function Od(e, t, n, s, i, l) {
               labelText: e.getMessage("basic_form.labeltext.country"),
               selectOptions: (Z = n.configuration.country) == null ? void 0 : Z.selectOptions,
               required: (Q = n.configuration.country) == null ? void 0 : Q.required,
-              name: (oe = n.configuration.country) == null ? void 0 : oe.name,
+              name: (le = n.configuration.country) == null ? void 0 : le.name,
               modelValue: i.formData.country.value,
               "onUpdate:modelValue": [
                 t[6] || (t[6] = (K) => i.formData.country.value = K),
@@ -6174,10 +6174,10 @@ function Od(e, t, n, s, i, l) {
             n.configuration.streetNo ? (a(), v(u, {
               key: 1,
               element: "input",
-              type: ((ee = n.configuration.streetNo) == null ? void 0 : ee.type) || "text",
+              type: ((oe = n.configuration.streetNo) == null ? void 0 : oe.type) || "text",
               labelText: e.getMessage("basic_form.labeltext.street_no"),
               placeholder: e.getMessage("basic_form.placeholder.street_no"),
-              required: (le = n.configuration.streetNo) == null ? void 0 : le.required,
+              required: (ie = n.configuration.streetNo) == null ? void 0 : ie.required,
               name: (re = n.configuration.streetNo) == null ? void 0 : re.name,
               modelValue: i.formData.streetNo.value,
               "onUpdate:modelValue": t[7] || (t[7] = (K) => i.formData.streetNo.value = K),
@@ -6204,7 +6204,7 @@ function Od(e, t, n, s, i, l) {
                 key: 0,
                 element: "input",
                 class: "input-zip",
-                type: ((te = n.configuration.zip) == null ? void 0 : te.type) || "number",
+                type: ((ee = n.configuration.zip) == null ? void 0 : ee.type) || "number",
                 labelText: e.getMessage("basic_form.labeltext.zip"),
                 placeholder: e.getMessage("basic_form.placeholder.zip"),
                 required: (Ce = n.configuration.zip) == null ? void 0 : Ce.required,
@@ -6311,7 +6311,7 @@ const qi = /* @__PURE__ */ M(Cd, [["render", Od]]), Ld = {
   }
 }, Id = ["src", "alt"], Bd = ["title"], Fd = { key: 2 }, Dd = ["title"], Md = ["src", "alt"];
 function Vd(e, t, n, s, i, l) {
-  var d, u, c, h, f, g, w, b, O, T, F, B, D, V, U, G, P, R, Y, Z, Q, oe, ee;
+  var d, u, c, h, f, g, w, b, O, T, F, B, D, V, U, G, P, R, Y, Z, Q, le;
   return a(), r(_, null, [
     (d = n.image) != null && d.src && (((u = n.image) == null ? void 0 : u.position) === "left" || ((c = n.image) == null ? void 0 : c.position) === "top" || !((h = n.image) != null && h.position)) ? (a(), r("img", {
       key: 0,
@@ -6329,10 +6329,10 @@ function Vd(e, t, n, s, i, l) {
       class: x((G = n.icon) == null ? void 0 : G.iconClass),
       title: (P = n.icon) == null ? void 0 : P.tooltip
     }, null, 10, Dd)) : m("", !0),
-    (R = n.image) != null && R.src && (((Y = n.image) == null ? void 0 : Y.position) === "right" || ((Z = n.image) == null ? void 0 : Z.position) === "bottom" || !((Q = n.image) != null && Q.position)) ? (a(), r("img", {
+    (R = n.image) != null && R.src && (((Y = n.image) == null ? void 0 : Y.position) === "right" || ((Z = n.image) == null ? void 0 : Z.position) === "bottom") ? (a(), r("img", {
       key: 4,
-      src: (oe = e.img) == null ? void 0 : oe.src,
-      alt: (ee = n.image) == null ? void 0 : ee.alt
+      src: (Q = e.img) == null ? void 0 : Q.src,
+      alt: (le = n.image) == null ? void 0 : le.alt
     }, null, 8, Md)) : m("", !0),
     A(e.$slots, "default")
   ], 64);
@@ -6527,7 +6527,7 @@ const Re = /* @__PURE__ */ M(Ad, [["render", qd]]), Rd = {
 };
 function zd(e, t, n, s, i, l) {
   var h, f, g, w, b, O, T, F, B, D, V, U, G;
-  const d = Re, u = we("CmdListOfLinksItem", !0), c = ie;
+  const d = Re, u = we("CmdListOfLinksItem", !0), c = ne;
   return e.editing ? (a(), r("div", Ud, [
     p(c, {
       element: "input",
@@ -7160,7 +7160,7 @@ function Fu(e, t, n, s, i, l) {
         (F = n.cmdHeadline) != null && F.headlineText && n.headlinePosition === "header" ? (a(), v(d, j(I({ key: 1 }, n.cmdHeadline)), null, 16)) : m("", !0)
       ])) : m("", !0)
     ], 64)),
-    ne(o("div", {
+    te(o("div", {
       class: x(["box-body", n.boxBodyClass]),
       "aria-expanded": "true",
       role: "article"
@@ -8014,7 +8014,7 @@ const nc = /* @__PURE__ */ M(Qu, [["render", tc]]), ic = {
   class: "flex-container vertical"
 }, fc = ["onClick", "title"], hc = { class: "collapsible-box-body" }, gc = { key: 0 }, yc = { key: 1 }, bc = ["href", "target"], xc = ["innerHTML"], Cc = { class: "button-wrapper align-center" };
 function vc(e, t, n, s, i, l) {
-  const d = J, u = ie;
+  const d = J, u = ne;
   return a(), v(Ae, { name: "fade" }, {
     default: k(() => {
       var c, h, f;
@@ -8064,7 +8064,7 @@ function vc(e, t, n, s, i, l) {
                         }, null, 2)
                       ], 8, rc)
                     ], 2),
-                    ne(o("div", dc, [
+                    te(o("div", dc, [
                       b.description ? (a(), r("p", uc, y(b.description), 1)) : m("", !0),
                       b.linkDataPrivacy ? (a(), r("p", cc, [
                         H(y(b.linkDataPrivacy.label) + " ", 1),
@@ -8115,7 +8115,7 @@ function vc(e, t, n, s, i, l) {
                         }, null, 2)
                       ], 8, fc)
                     ], 2),
-                    ne(o("div", hc, [
+                    te(o("div", hc, [
                       b.description ? (a(), r("p", gc, y(b.description), 1)) : m("", !0),
                       b.linkDataPrivacy ? (a(), r("p", yc, [
                         H(y(b.linkDataPrivacy.label) + " ", 1),
@@ -9315,7 +9315,7 @@ function Vm(e, t, n, s, i, l) {
     ]),
     "aria-labelledby": e.htmlId
   }, [
-    ne(o("span", _m, [
+    te(o("span", _m, [
       o("span", { id: e.htmlId }, [
         H(y(n.labelText), 1),
         n.required ? (a(), r("sup", Lm, "*")) : m("", !0)
@@ -9359,7 +9359,7 @@ function Vm(e, t, n, s, i, l) {
         for: c.id,
         class: x({ "toggle-switch": n.toggleSwitches, colored: n.colored })
       }, [
-        ne(o("input", {
+        te(o("input", {
           type: n.inputTypes,
           id: c.id,
           name: c.name,
@@ -9686,9 +9686,9 @@ const Yi = /* @__PURE__ */ M(Tm, [["render", Vm]]), Pm = {
 }, Am = { class: "cmd-login-form flex-container" }, Em = { class: "option-wrapper flex-container" }, Hm = { key: 1 }, qm = ["type", "disabled"], Rm = { key: 1 }, jm = { class: "cmd-login-form flex-container" }, Nm = { class: "option-wrapper flex-container" }, Um = ["type", "disabled"], zm = { key: 1 };
 function Gm(e, t, n, s, i, l) {
   var f, g, w, b, O, T, F, B;
-  const d = J, u = ie, c = W, h = Re;
+  const d = J, u = ne, c = W, h = Re;
   return a(), r(_, null, [
-    ne(o("fieldset", Am, [
+    te(o("fieldset", Am, [
       o("legend", {
         class: x({ hidden: !n.legendLoginForm.show, "align-left": n.legendLoginForm.align === "left" })
       }, y(n.legendLoginForm.text), 3),
@@ -9762,7 +9762,7 @@ function Gm(e, t, n, s, i, l) {
     ], 512), [
       [xe, !i.sendLogin]
     ]),
-    ne(o("fieldset", jm, [
+    te(o("fieldset", jm, [
       o("legend", {
         class: x({ hidden: !n.legendForgotLoginForm.show, "align-left": n.legendForgotLoginForm.align === "left" })
       }, y(n.legendForgotLoginForm.text), 3),
@@ -10378,7 +10378,7 @@ const cp = /* @__PURE__ */ M(sp, [["render", up]]), mp = {
   }
 }, pp = { class: "cmd-newsletter-subscription flex-container" }, fp = { class: "button-wrapper" };
 function hp(e, t, n, s, i, l) {
-  const d = Yi, u = ie;
+  const d = Yi, u = ne;
   return a(), r("fieldset", pp, [
     o("legend", {
       class: x({ hidden: !n.legend.show, "align-left": n.legend.align === "left" })
@@ -10529,7 +10529,7 @@ const yp = {
   class: "input-wrapper"
 }, Op = ["title"];
 function Lp(e, t, n, s, i, l) {
-  const d = ie;
+  const d = ne;
   return e.editing ? (a(), r(_, { key: 1 }, [
     o("dt", null, [
       p(d, {
@@ -10918,7 +10918,7 @@ const Dp = {
 };
 function jp(e, t, n, s, i, l) {
   var g, w;
-  const d = J, u = Re, c = ie, h = Ip, f = qe;
+  const d = J, u = Re, c = ne, h = Ip, f = qe;
   return a(), r("div", Mp, [
     (g = n.cmdHeadline) != null && g.headlineText || e.editModeContext ? (a(), v(d, j(I({ key: 0 }, n.cmdHeadline)), null, 16)) : m("", !0),
     !e.editing && n.showOpenStatus ? (a(), r(_, { key: 1 }, [
@@ -11464,7 +11464,7 @@ const sf = /* @__PURE__ */ M(tf, [["render", af]]), rf = {
 };
 function df(e, t, n, s, i, l) {
   var f, g;
-  const d = J, u = ie, c = sf, h = qe;
+  const d = J, u = ne, c = sf, h = qe;
   return a(), r("div", {
     class: x(["cmd-social-networks", { stretch: n.stretchButtons }, l.alignment])
   }, [
@@ -12285,7 +12285,7 @@ const Nf = /* @__PURE__ */ M(qf, [["render", jf]]), Uf = {
 };
 function Qf(e, t, n, s, i, l) {
   var g, w, b, O, T, F, B, D;
-  const d = J, u = ie, c = W, h = Ui, f = zi;
+  const d = J, u = ne, c = W, h = Ui, f = zi;
   return a(), r(_, null, [
     o("fieldset", Gf, [
       o("legend", {
@@ -12673,11 +12673,16 @@ const oh = /* @__PURE__ */ M($f, [["render", lh]]), ah = {
       required: !0
     },
     /**
-     * define search-field
+     * set properties for CmdFormElement-component (search-field)
      */
     cmdFormElement: {
       type: Object,
       required: !1
+    },
+    // todo: replace property by computed-property that handles position of dropdown-list automatically
+    openListToTop: {
+      type: Boolean,
+      default: !1
     }
   },
   computed: {
@@ -12714,9 +12719,9 @@ const oh = /* @__PURE__ */ M($f, [["render", lh]]), ah = {
   class: "list-of-recommendations no-list-items"
 };
 function rh(e, t, n, s, i, l) {
-  const d = ie, u = Re;
+  const d = ne, u = Re;
   return a(), r("div", {
-    class: x(["cmd-smart-search", { open: i.showListOfRecommendations }])
+    class: x(["cmd-smart-search", { open: i.showListOfRecommendations, "open-list-to-top": n.openListToTop }])
   }, [
     p(d, I({
       element: "input",
@@ -13703,6 +13708,7 @@ const dh = /* @__PURE__ */ M(ah, [["render", rh]]), uh = "data:image/svg+xml,%3c
   "SiteHeader",
   "SiteSearch",
   "Slideshow",
+  "SmartSearch",
   "SocialNetworks",
   "SwitchLanguage",
   "SystemMessage",
@@ -15295,7 +15301,7 @@ function Ng(e, t, n, s, i, l) {
         }, {
           default: k(() => [
             A(e.$slots, "table-body", {}, () => [
-              ne(o("tbody", Hg, [
+              te(o("tbody", Hg, [
                 (a(!0), r(_, null, q(n.tableData.tbody, (c, h) => (a(), r("tr", {
                   class: x({ active: n.tableData.rowIndexHighlighted === h }),
                   key: h
@@ -15433,7 +15439,7 @@ function Zg(e, t, n, s, i, l) {
         ], 8, Wg)
       ], 2))), 128))
     ], 2),
-    n.useSlot ? (a(!0), r(_, { key: 0 }, q(n.tabs.length, (c) => ne((a(), r("div", {
+    n.useSlot ? (a(!0), r(_, { key: 0 }, q(n.tabs.length, (c) => te((a(), r("div", {
       key: c,
       "aria-live": "assertive",
       class: x(["tab-content-" + (c - 1), { "no-padding": !n.useDefaultPadding }])
@@ -15605,7 +15611,7 @@ function ey(e, t, n, s, i, l) {
       allowDeleteComponent: !!n.htmlContent
     }, {
       default: k((b) => [
-        b.editing ? ne((a(), r("textarea", {
+        b.editing ? te((a(), r("textarea", {
           key: 0,
           class: x(["edit-mode", l.textAlign]),
           "onUpdate:modelValue": t[0] || (t[0] = (O) => i.editableHtmlContent = O),
@@ -15785,7 +15791,7 @@ const ty = /* @__PURE__ */ M(Qg, [["render", ey]]), ny = {
   }
 }, iy = { key: 0 };
 function ly(e, t, n, s, i, l) {
-  const d = W, u = ie;
+  const d = W, u = ne;
   return a(), r("div", {
     class: x(["cmd-toggle-dark-mode", { "styled-layout": n.useStyledLayout, "dark-mode": i.darkMode }])
   }, [
@@ -18094,7 +18100,7 @@ const Mb = {
   class: "progressbar"
 }, sx = ["value", "title"];
 function rx(e, t, n, s, i, l) {
-  const d = J, u = Ne, c = W, h = ie;
+  const d = J, u = Ne, c = W, h = ne;
   return a(), r(_, null, [
     n.advancedMode ? (a(), r("fieldset", {
       key: 0,
@@ -18619,7 +18625,7 @@ const Tl = /* @__PURE__ */ M(ux, [["render", px]]), fx = {
   }
 };
 function hx(e, t, n, s, i, l) {
-  const d = ie, u = wn;
+  const d = ne, u = wn;
   return a(), v(u, {
     "use-slots": ["body"],
     collapsible: !0,
@@ -19162,7 +19168,7 @@ const Qx = /* @__PURE__ */ M(Vx, [["render", Zx]]), Xx = {
   }
 }, $x = { class: "cmd-mail-tool-filter align-items-center" }, e1 = { class: "flex-container horizontal align-items-center" }, t1 = { class: "flex-container horizontal sort-wrapper" }, n1 = ["title"], i1 = { key: 0 }, l1 = ["title"], o1 = { key: 0 };
 function a1(e, t, n, s, i, l) {
-  const d = J, u = ie;
+  const d = J, u = ne;
   return a(), r("div", $x, [
     l.headlineText ? (a(), v(d, {
       key: 0,
@@ -20306,7 +20312,7 @@ const f1 = /* @__PURE__ */ M(c1, [["render", p1]]), h1 = [
     text: "Zimbabwe",
     value: "zw"
   }
-], w1 = "comand-component-library", k1 = "4.1.97", T1 = "GPL-3.0-only", S1 = "CoManD-UI", _1 = "module", O1 = {
+], w1 = "comand-component-library", k1 = "4.1.99", T1 = "GPL-3.0-only", S1 = "CoManD-UI", _1 = "module", O1 = {
   prepublishOnly: "npm run build-lib",
   dev: "vite",
   build: "vite build",
@@ -21728,8 +21734,8 @@ const f1 = /* @__PURE__ */ M(c1, [["render", p1]]), h1 = [
   id: "content"
 };
 function mv(e, t, n, s, i, l) {
-  const d = wn, u = Ri, c = Vf, h = Cn, f = Ni, g = Nf, w = Tl, b = Pi, O = zi, T = ie, F = dh, B = Ui, D = Of, V = Yi, U = Ai, G = sr, P = fr, R = qi, Y = ji, Z = nc, Q = em, oe = Ki, ee = J, le = W, re = ge, me = ym, E = km, X = Re, te = f1, Ce = Wm, Le = u1, Ie = Ji, Be = we("router-view"), Fe = cp, De = gp, ke = Np, de = hf, at = Cf, st = ef, We = Hf, rt = Xf, dt = oh, ut = Zi, ct = Dg, K = Ne, In = Ug, Ll = el, Vt = ty, Il = Ei, Bl = oy, Pt = Mi, Fl = dx, Dl = Sl, Ml = _c, Vl = wc, Pl = xd, Al = gx, El = Ul("fancybox");
-  return ne((a(), r("div", {
+  const d = wn, u = Ri, c = Vf, h = Cn, f = Ni, g = Nf, w = Tl, b = Pi, O = zi, T = ne, F = dh, B = Ui, D = Of, V = Yi, U = Ai, G = sr, P = fr, R = qi, Y = ji, Z = nc, Q = em, le = Ki, oe = J, ie = W, re = ge, me = ym, E = km, X = Re, ee = f1, Ce = Wm, Le = u1, Ie = Ji, Be = we("router-view"), Fe = cp, De = gp, ke = Np, de = hf, at = Cf, st = ef, We = Hf, rt = Xf, dt = oh, ut = Zi, ct = Dg, K = Ne, In = Ug, Ll = el, Vt = ty, Il = Ei, Bl = oy, Pt = Mi, Fl = dx, Dl = Sl, Ml = _c, Vl = wc, Pl = xd, Al = gx, El = Ul("fancybox");
+  return te((a(), r("div", {
     class: "page-wrapper",
     id: l.templateId
   }, [
@@ -21759,7 +21765,7 @@ function mv(e, t, n, s, i, l) {
               body: k(() => [
                 o("label", q1, [
                   t[125] || (t[125] = o("span", null, "Select template", -1)),
-                  ne(o("select", {
+                  te(o("select", {
                     id: "select-template",
                     "onUpdate:modelValue": t[0] || (t[0] = (z) => i.selectedTemplate = z)
                   }, t[124] || (t[124] = [
@@ -21776,7 +21782,7 @@ function mv(e, t, n, s, i, l) {
                   t[129] || (t[129] = o("span", null, "Color Scheme", -1)),
                   o("div", R1, [
                     o("label", j1, [
-                      ne(o("input", {
+                      te(o("input", {
                         type: "radio",
                         id: "default-color-scheme",
                         name: "color-scheme",
@@ -21788,7 +21794,7 @@ function mv(e, t, n, s, i, l) {
                       t[126] || (t[126] = o("span", { class: "label-text" }, "Color-Scheme by Browser/OS", -1))
                     ]),
                     o("label", N1, [
-                      ne(o("input", {
+                      te(o("input", {
                         type: "radio",
                         id: "light-mode",
                         name: "color-scheme",
@@ -21800,7 +21806,7 @@ function mv(e, t, n, s, i, l) {
                       t[127] || (t[127] = o("span", { class: "label-text" }, "Light Mode", -1))
                     ]),
                     o("label", U1, [
-                      ne(o("input", {
+                      te(o("input", {
                         type: "radio",
                         id: "dark-mode",
                         name: "color-scheme",
@@ -22245,11 +22251,14 @@ function mv(e, t, n, s, i, l) {
                     status: i.validationStatus,
                     disabled: i.disabledStatus
                   }, null, 8, ["modelValue", "status", "disabled"]),
-                  p(F, I(i.smartSearchData, {
+                  p(F, {
+                    listOfRecommendations: i.smartSearchData.listOfRecommendations,
+                    cmdFormElement: i.smartSearchData.cmdFormElement,
+                    openListToTop: !0,
                     modelValue: i.smartSearch,
                     "onUpdate:modelValue": t[32] || (t[32] = (C) => i.smartSearch = C),
                     disabled: i.disabledStatus
-                  }), null, 16, ["modelValue", "disabled"])
+                  }, null, 8, ["listOfRecommendations", "cmdFormElement", "modelValue", "disabled"])
                 ]),
                 t[162] || (t[162] = o("h3", null, "Textarea", -1)),
                 p(T, {
@@ -22356,7 +22365,7 @@ function mv(e, t, n, s, i, l) {
                       t[143] || (t[143] = o("span", { class: "label-text" }, [
                         o("span", null, "Range Value:")
                       ], -1)),
-                      ne(o("input", {
+                      te(o("input", {
                         type: "number",
                         class: x(i.validationStatus),
                         "onUpdate:modelValue": t[41] || (t[41] = (C) => i.rangeValue = C),
@@ -22372,7 +22381,7 @@ function mv(e, t, n, s, i, l) {
                       t[144] || (t[144] = o("span", { class: "label-text hidden" }, [
                         o("span", null, "Range Value")
                       ], -1)),
-                      ne(o("input", {
+                      te(o("input", {
                         type: "range",
                         class: "range-slider",
                         id: "range-slider",
@@ -23411,7 +23420,7 @@ function mv(e, t, n, s, i, l) {
             class: "headline-demopage",
             id: "section-google-maps"
           }, "Google Maps™", -1)),
-          p(oe, {
+          p(le, {
             address: i.addressData[1]
           }, null, 8, ["address"])
         ]),
@@ -23428,14 +23437,14 @@ function mv(e, t, n, s, i, l) {
               onClick: t[84] || (t[84] = S((C) => l.openSettingsSidebar("CmdHeadline"), ["prevent"]))
             })
           ]),
-          p(ee, I({ ref: "CmdHeadline" }, e.cmdHeadlineSettingsData), null, 16),
-          p(ee, I({ ref: "CmdHeadline" }, e.cmdHeadlineSettingsData), null, 16),
-          p(ee, {
+          p(oe, I({ ref: "CmdHeadline" }, e.cmdHeadlineSettingsData), null, 16),
+          p(oe, I({ ref: "CmdHeadline" }, e.cmdHeadlineSettingsData), null, 16),
+          p(oe, {
             ref: "CmdHeadline",
             headlineLevel: "3",
             headlineText: "Headline text<br /> with html given by property"
           }, null, 512),
-          p(ee, {
+          p(oe, {
             ref: "CmdHeadline",
             headlineLevel: "3"
           }, {
@@ -23458,23 +23467,23 @@ function mv(e, t, n, s, i, l) {
           o("ul", null, [
             o("li", null, [
               t[233] || (t[233] = o("span", null, "Icon from local iconfont", -1)),
-              p(le, { iconClass: "icon-home" })
+              p(ie, { iconClass: "icon-home" })
             ]),
             o("li", null, [
               t[234] || (t[234] = o("span", null, "Icon from iconify-api (icomoon-font)", -1)),
-              p(le, { iconClass: "icomoon-free:home" })
+              p(ie, { iconClass: "icomoon-free:home" })
             ]),
             o("li", null, [
               t[235] || (t[235] = o("span", null, "Icon from iconify-api (bootstrap-font)", -1)),
-              p(le, { iconClass: "bi:house-fill" })
+              p(ie, { iconClass: "bi:house-fill" })
             ]),
             o("li", null, [
               t[236] || (t[236] = o("span", null, "Icon from iconify-api (material-design-font)", -1)),
-              p(le, { iconClass: "mdi:home" })
+              p(ie, { iconClass: "mdi:home" })
             ]),
             o("li", null, [
               t[237] || (t[237] = o("span", null, "Icon from iconify-api (font-awesome-solid-font)", -1)),
-              p(le, { iconClass: "fa6-solid:house-chimney" })
+              p(ie, { iconClass: "fa6-solid:house-chimney" })
             ])
           ])
         ]),
@@ -23638,7 +23647,7 @@ function mv(e, t, n, s, i, l) {
               onClick: t[90] || (t[90] = S((C) => l.openSettingsSidebar("CmdListOfImages"), ["prevent"]))
             })
           ]),
-          p(te, I({ ref: "CmdListOfImages" }, e.cmdListOfImagesSettingsData, { images: i.imageGalleryData }), null, 16, ["images"])
+          p(ee, I({ ref: "CmdListOfImages" }, e.cmdListOfImagesSettingsData, { images: i.imageGalleryData }), null, 16, ["images"])
         ]),
         _: 1
       }),
@@ -24419,7 +24428,7 @@ export {
   xd as CmdFancyBox,
   em as CmdFlexibleScrollContainer,
   Ai as CmdForm,
-  ie as CmdFormElement,
+  ne as CmdFormElement,
   zi as CmdFormFilters,
   Ki as CmdGoogleMaps,
   J as CmdHeadline,