@kong/kongponents 9.64.5 → 9.64.6

package/dist/kongponents282.es.js

@@ -1,377 +1,248 @@
-import { evaluate as j, getSideAxis as T, getSide as L, clamp as X, getOppositePlacement as q, getExpandedPlacements as z, getOppositeAxisPlacements as G, getAlignmentSides as U, placements as I, getAlignment as D, getOppositeAxis as H, getOppositeAlignmentPlacement as J, getAlignmentAxis as K, getPaddingObject as Q, rectToClientRect as Y, getAxisLength as Z } from "./kongponents283.es.js";
-function N(t, i, f) {
-  let {
-    reference: n,
-    floating: e
-  } = t;
-  const o = T(i), s = K(i), l = Z(s), g = L(i), A = o === "y", x = n.x + n.width / 2 - e.width / 2, a = n.y + n.height / 2 - e.height / 2, c = n[l] / 2 - e[l] / 2;
-  let r;
-  switch (g) {
-    case "top":
-      r = {
-        x,
-        y: n.y - e.height
-      };
-      break;
-    case "bottom":
-      r = {
-        x,
-        y: n.y + n.height
-      };
-      break;
-    case "right":
-      r = {
-        x: n.x + n.width,
-        y: a
-      };
-      break;
-    case "left":
-      r = {
-        x: n.x - e.width,
-        y: a
-      };
-      break;
-    default:
-      r = {
-        x: n.x,
-        y: n.y
-      };
-  }
-  switch (D(i)) {
-    case "start":
-      r[s] -= c * (f && A ? -1 : 1);
-      break;
-    case "end":
-      r[s] += c * (f && A ? -1 : 1);
-      break;
-  }
-  return r;
-}
-async function ee(t, i) {
-  var f;
-  i === void 0 && (i = {});
-  const {
-    x: n,
-    y: e,
-    platform: o,
-    rects: s,
-    elements: l,
-    strategy: g
-  } = t, {
-    boundary: A = "clippingAncestors",
-    rootBoundary: x = "viewport",
-    elementContext: a = "floating",
-    altBoundary: c = !1,
-    padding: r = 0
-  } = j(i, t), m = Q(r), h = l[c ? a === "floating" ? "reference" : "floating" : a], d = Y(await o.getClippingRect({
-    element: (f = await (o.isElement == null ? void 0 : o.isElement(h))) == null || f ? h : h.contextElement || await (o.getDocumentElement == null ? void 0 : o.getDocumentElement(l.floating)),
-    boundary: A,
-    rootBoundary: x,
-    strategy: g
-  })), u = a === "floating" ? {
-    x: n,
-    y: e,
-    width: s.floating.width,
-    height: s.floating.height
-  } : s.reference, p = await (o.getOffsetParent == null ? void 0 : o.getOffsetParent(l.floating)), y = await (o.isElement == null ? void 0 : o.isElement(p)) ? await (o.getScale == null ? void 0 : o.getScale(p)) || {
-    x: 1,
-    y: 1
-  } : {
-    x: 1,
-    y: 1
-  }, P = Y(o.convertOffsetParentRelativeRectToViewportRelativeRect ? await o.convertOffsetParentRelativeRectToViewportRelativeRect({
-    elements: l,
-    rect: u,
-    offsetParent: p,
-    strategy: g
-  }) : u);
-  return {
-    top: (d.top - P.top + m.top) / y.y,
-    bottom: (P.bottom - d.bottom + m.bottom) / y.y,
-    left: (d.left - P.left + m.left) / y.x,
-    right: (P.right - d.right + m.right) / y.x
-  };
-}
-const te = 50, oe = async (t, i, f) => {
-  const {
-    placement: n = "bottom",
-    strategy: e = "absolute",
-    middleware: o = [],
-    platform: s
-  } = f, l = s.detectOverflow ? s : {
-    ...s,
-    detectOverflow: ee
-  }, g = await (s.isRTL == null ? void 0 : s.isRTL(i));
-  let A = await s.getElementRects({
-    reference: t,
-    floating: i,
-    strategy: e
-  }), {
-    x,
-    y: a
-  } = N(A, n, g), c = n, r = 0;
-  const m = {};
-  for (let w = 0; w < o.length; w++) {
-    const h = o[w];
-    if (!h)
-      continue;
-    const {
-      name: d,
-      fn: u
-    } = h, {
-      x: p,
-      y,
-      data: P,
-      reset: O
-    } = await u({
-      x,
-      y: a,
-      initialPlacement: n,
-      placement: c,
-      strategy: e,
-      middlewareData: m,
-      rects: A,
-      platform: l,
-      elements: {
-        reference: t,
-        floating: i
+import { defineComponent as X, useCssVars as Y, useAttrs as Z, ref as r, useTemplateRef as A, computed as i, onMounted as _, resolveComponent as ee, openBlock as y, createBlock as k, unref as O, withCtx as v, createElementVNode as h, createVNode as g, createTextVNode as S, renderSlot as te, normalizeProps as le, guardReactiveProps as ae, createElementBlock as oe, createCommentVNode as ie, toDisplayString as ue, mergeProps as re, withModifiers as ne, nextTick as se } from "vue";
+import { KUI_SPACE_30 as ce } from "./kongponents185.es.js";
+import ve from "./kongponents62.es.js";
+import de from "./kongponents55.es.js";
+import B from "./kongponents66.es.js";
+import fe from "./kongponents60.es.js";
+import me from "./kongponents460.es.js";
+const pe = {
+  class: "filter-content",
+  "data-testid": "filter-pill-content"
+}, ye = { class: "default-layout" }, be = {
+  key: 0,
+  class: "operator"
+}, Ve = { class: "value" }, Ce = { class: "footer" }, qe = /* @__PURE__ */ X({
+  inheritAttrs: !1,
+  __name: "FilterPill",
+  props: {
+    filter: {},
+    initOpen: { type: Boolean, default: !1 },
+    selection: { default: () => {
+    } },
+    custom: { type: Boolean, default: !1 }
+  },
+  emits: ["apply", "close", "open", "clear"],
+  setup(e, { emit: E }) {
+    Y((t) => ({
+      f988e390: N.value
+    }));
+    const K = Z(), b = E, d = r(!1), V = A("filterPopper"), u = r(), n = r(), s = r(), c = r(), C = r(), x = r(), P = r(!0), U = A("inputField"), f = i(() => e.custom ? "custom" : e.filter.options && !e.filter.multiple ? "select" : e.filter.options && e.filter.multiple ? "multiselect" : "input"), F = i(() => {
+      switch (f.value) {
+        case "input":
+          return !n.value || n.value === "";
+        case "select":
+          return !s.value;
+        case "multiselect":
+          return !c.value || c.value.length === 0;
+        case "custom":
+          return !P.value;
+        default:
+          return !1;
       }
-    });
-    x = p ?? x, a = y ?? a, m[d] = {
-      ...m[d],
-      ...P
-    }, O && r < te && (r++, typeof O == "object" && (O.placement && (c = O.placement), O.rects && (A = O.rects === !0 ? await s.getElementRects({
-      reference: t,
-      floating: i,
-      strategy: e
-    }) : O.rects), {
-      x,
-      y: a
-    } = N(A, c, g)), w = -1);
-  }
-  return {
-    x,
-    y: a,
-    placement: c,
-    strategy: e,
-    middlewareData: m
-  };
-};
-function ne(t, i, f) {
-  return (t ? [...f.filter((e) => D(e) === t), ...f.filter((e) => D(e) !== t)] : f.filter((e) => L(e) === e)).filter((e) => t ? D(e) === t || (i ? J(e) !== e : !1) : !0);
-}
-const le = function(t) {
-  return t === void 0 && (t = {}), {
-    name: "autoPlacement",
-    options: t,
-    async fn(i) {
-      var f, n, e;
-      const {
-        rects: o,
-        middlewareData: s,
-        placement: l,
-        platform: g,
-        elements: A
-      } = i, {
-        crossAxis: x = !1,
-        alignment: a,
-        allowedPlacements: c = I,
-        autoAlignment: r = !0,
-        ...m
-      } = j(t, i), w = a !== void 0 || c === I ? ne(a || null, r, c) : c, h = await g.detectOverflow(i, m), d = ((f = s.autoPlacement) == null ? void 0 : f.index) || 0, u = w[d];
-      if (u == null)
-        return {};
-      const p = U(u, o, await (g.isRTL == null ? void 0 : g.isRTL(A.floating)));
-      if (l !== u)
-        return {
-          reset: {
-            placement: w[0]
-          }
-        };
-      const y = [h[L(u)], h[p[0]], h[p[1]]], P = [...((n = s.autoPlacement) == null ? void 0 : n.overflows) || [], {
-        placement: u,
-        overflows: y
-      }], O = w[d + 1];
-      if (O)
+    }), m = i(() => e.filter.operators && e.filter.operators.length ? e.filter.operators : ["eq"]), T = (t) => {
+      u.value = t;
+    }, D = (t, l) => {
+      C.value = t, x.value = l;
+    }, I = (t) => {
+      P.value = t;
+    }, M = i(() => ({
+      value: C.value,
+      text: x.value,
+      options: e.filter.options,
+      multiple: e.filter.multiple,
+      operators: m.value,
+      operator: u.value,
+      setOperator: T,
+      setValue: D,
+      setApplyState: I
+    })), N = i(() => m.value.some((t) => t === "lte" || t === "gte") ? "205px" : "120px"), L = i(() => {
+      let t, l;
+      switch (f.value) {
+        case "input":
+          t = n.value, l = n.value;
+          break;
+        case "select":
+          t = s.value, l = e.filter?.options?.find(({ value: a }) => a === s.value)?.label ?? s.value?.toString();
+          break;
+        case "multiselect":
+          t = c.value, l = c.value?.map((a) => e.filter.options?.find(({ value: o }) => o === a))?.filter((a) => a !== void 0)?.map(({ label: a }) => a)?.join(", ");
+          break;
+        case "custom":
+          t = C.value, l = x.value;
+          break;
+      }
+      if (!(u.value === void 0 || t === void 0 || l === void 0))
         return {
-          data: {
-            index: d + 1,
-            overflows: P
-          },
-          reset: {
-            placement: O
-          }
+          operator: u.value,
+          value: t,
+          text: l
         };
-      const B = P.map((v) => {
-        const S = D(v.placement);
-        return [v.placement, S && x ? (
-          // Check along the mainAxis and main crossAxis side.
-          v.overflows.slice(0, 2).reduce((_, $) => _ + $, 0)
-        ) : (
-          // Check only the mainAxis.
-          v.overflows[0]
-        ), v.overflows];
-      }).sort((v, S) => v[1] - S[1]), k = ((e = B.filter((v) => v[2].slice(
-        0,
-        // Aligned placements should not check their opposite crossAxis
-        // side.
-        D(v[0]) ? 2 : 3
-      ).every((S) => S <= 0))[0]) == null ? void 0 : e[0]) || B[0][0];
-      return k !== l ? {
-        data: {
-          index: d + 1,
-          overflows: P
-        },
-        reset: {
-          placement: k
-        }
-      } : {};
-    }
-  };
-}, se = function(t) {
-  return t === void 0 && (t = {}), {
-    name: "flip",
-    options: t,
-    async fn(i) {
-      var f, n;
-      const {
-        placement: e,
-        middlewareData: o,
-        rects: s,
-        initialPlacement: l,
-        platform: g,
-        elements: A
-      } = i, {
-        mainAxis: x = !0,
-        crossAxis: a = !0,
-        fallbackPlacements: c,
-        fallbackStrategy: r = "bestFit",
-        fallbackAxisSideDirection: m = "none",
-        flipAlignment: w = !0,
-        ...h
-      } = j(t, i);
-      if ((f = o.arrow) != null && f.alignmentOffset)
-        return {};
-      const d = L(e), u = T(l), p = L(l) === l, y = await (g.isRTL == null ? void 0 : g.isRTL(A.floating)), P = c || (p || !w ? [q(l)] : z(l)), O = m !== "none";
-      !c && O && P.push(...G(l, w, m, y));
-      const B = [l, ...P], M = await g.detectOverflow(i, h), k = [];
-      let v = ((n = o.flip) == null ? void 0 : n.overflows) || [];
-      if (x && k.push(M[d]), a) {
-        const C = U(e, s, y);
-        k.push(M[C[0]], M[C[1]]);
-      }
-      if (v = [...v, {
-        placement: e,
-        overflows: k
-      }], !k.every((C) => C <= 0)) {
-        var S, _;
-        const C = (((S = o.flip) == null ? void 0 : S.index) || 0) + 1, V = B[C];
-        if (V && (!(a === "alignment" ? u !== T(V) : !1) || // We leave the current main axis only if every placement on that axis
-        // overflows the main axis.
-        v.every((b) => T(b.placement) === u ? b.overflows[0] > 0 : !0)))
-          return {
-            data: {
-              index: C,
-              overflows: v
-            },
-            reset: {
-              placement: V
-            }
-          };
-        let F = (_ = v.filter((E) => E.overflows[0] <= 0).sort((E, b) => E.overflows[1] - b.overflows[1])[0]) == null ? void 0 : _.placement;
-        if (!F)
-          switch (r) {
-            case "bestFit": {
-              var $;
-              const E = ($ = v.filter((b) => {
-                if (O) {
-                  const R = T(b.placement);
-                  return R === u || // Create a bias to the `y` side axis due to horizontal
-                  // reading directions favoring greater width.
-                  R === "y";
-                }
-                return !0;
-              }).map((b) => [b.placement, b.overflows.filter((R) => R > 0).reduce((R, W) => R + W, 0)]).sort((b, R) => b[1] - R[1])[0]) == null ? void 0 : $[0];
-              E && (F = E);
-              break;
-            }
-            case "initialPlacement":
-              F = l;
-              break;
-          }
-        if (e !== F)
-          return {
-            reset: {
-              placement: F
-            }
-          };
-      }
-      return {};
-    }
-  };
-}, ae = function(t) {
-  return t === void 0 && (t = {}), {
-    name: "shift",
-    options: t,
-    async fn(i) {
-      const {
-        x: f,
-        y: n,
-        placement: e,
-        platform: o
-      } = i, {
-        mainAxis: s = !0,
-        crossAxis: l = !1,
-        limiter: g = {
-          fn: (d) => {
-            let {
-              x: u,
-              y: p
-            } = d;
-            return {
-              x: u,
-              y: p
-            };
-          }
-        },
-        ...A
-      } = j(t, i), x = {
-        x: f,
-        y: n
-      }, a = await o.detectOverflow(i, A), c = T(L(e)), r = H(c);
-      let m = x[r], w = x[c];
-      if (s) {
-        const d = r === "y" ? "top" : "left", u = r === "y" ? "bottom" : "right", p = m + a[d], y = m - a[u];
-        m = X(p, m, y);
+    }), R = i(() => {
+      if (e.selection?.operatorDelimiter !== void 0)
+        return e.selection.operatorDelimiter;
+      switch (e.selection?.operator) {
+        case "eq":
+          return " = ";
+        case "neq":
+          return " ≠ ";
+        case "lt":
+          return " < ";
+        case "lte":
+          return " ≤ ";
+        case "gt":
+          return " > ";
+        case "gte":
+          return " ≥ ";
+        default:
+          return ": ";
       }
-      if (l) {
-        const d = c === "y" ? "top" : "left", u = c === "y" ? "bottom" : "right", p = w + a[d], y = w - a[u];
-        w = X(p, w, y);
-      }
-      const h = g.fn({
-        ...i,
-        [r]: m,
-        [c]: w
-      });
-      return {
-        ...h,
-        data: {
-          x: h.x - f,
-          y: h.y - n,
-          enabled: {
-            [r]: s,
-            [c]: l
-          }
-        }
+    }), w = i(() => {
+      const t = {
+        eq: "Equals",
+        neq: "Not equals",
+        contains: "Contains",
+        exists: "Exists",
+        lt: "Less than",
+        lte: "Less than or equal to",
+        gt: "Greater than",
+        gte: "Greater than or equal to"
       };
-    }
-  };
-};
+      return m.value.map((l) => ({
+        label: t[l],
+        value: l
+      }));
+    }), $ = i(() => w.value.find(({ value: t }) => t === u.value)?.label ?? ""), G = () => {
+      f.value === "input" && U.value?.input?.focus();
+    }, W = () => {
+      u.value = e.selection?.operator ?? m.value?.[0], n.value = typeof e.selection?.value == "string" ? e.selection.value : void 0, s.value = e.filter.options?.find(({ value: t }) => t === e.selection?.value)?.value, c.value = e.filter.options?.filter(({ value: t }) => {
+        if (Array.isArray(e.selection?.value))
+          return e.selection.value.includes(`${t}`);
+      }).map(({ value: t }) => t), C.value = e.selection?.value, x.value = e.selection?.text, P.value = !0;
+    }, q = async () => {
+      W(), V.value && (V.value.showPopover(), d.value = !0, await se(), G()), b("open");
+    }, p = () => {
+      V.value && (V.value.hidePopover(), d.value = !1), b("close");
+    };
+    _(() => {
+      e.initOpen && q();
+    });
+    const j = () => {
+      d.value && p();
+    }, z = () => {
+      b("apply", L.value), p();
+    }, H = () => {
+      p();
+    }, J = () => {
+      p(), b("clear");
+    }, Q = () => {
+      d.value ? p() : q();
+    };
+    return (t, l) => {
+      const a = ee("KButton");
+      return y(), k(ve, {
+        ref: "filterPopper",
+        "max-width": e.filter.maxWidth ?? "400px",
+        offset: `var(--kui-space-30, ${O(ce)})`,
+        placement: e.filter.placement ?? "bottom-start",
+        width: "auto",
+        onClose: j
+      }, {
+        default: v(() => [
+          g(me, re({
+            "content-label": e.selection?.text,
+            "data-testid": "filter-pill",
+            delimiter: R.value,
+            label: e.filter.label,
+            "pill-focus": d.value,
+            readonly: e.filter.readonly
+          }, O(K), {
+            onClear: J,
+            onClick: l[0] || (l[0] = ne(() => {
+            }, ["prevent", "stop"])),
+            onTrigger: Q
+          }), null, 16, ["content-label", "delimiter", "label", "pill-focus", "readonly"])
+        ]),
+        title: v(() => [
+          S(ue(e.filter.label), 1)
+        ]),
+        content: v(() => [
+          h("div", pe, [
+            te(t.$slots, "default", le(ae(M.value)), () => [
+              h("div", ye, [
+                m.value.length > 1 ? (y(), oe("div", be, [
+                  g(B, {
+                    modelValue: u.value,
+                    "onUpdate:modelValue": l[1] || (l[1] = (o) => u.value = o),
+                    items: w.value,
+                    "kpop-attributes": {
+                      popoverClasses: "force-operator-width"
+                    },
+                    label: "Operator",
+                    title: $.value
+                  }, null, 8, ["modelValue", "items", "title"])
+                ])) : ie("", !0),
+                h("div", Ve, [
+                  f.value === "select" ? (y(), k(B, {
+                    key: 0,
+                    modelValue: s.value,
+                    "onUpdate:modelValue": l[2] || (l[2] = (o) => s.value = o),
+                    "data-testid": "filter-pill-select",
+                    items: e.filter.options,
+                    label: "Value",
+                    placeholder: "Select a value"
+                  }, null, 8, ["modelValue", "items"])) : f.value === "multiselect" ? (y(), k(fe, {
+                    key: 1,
+                    modelValue: c.value,
+                    "onUpdate:modelValue": l[3] || (l[3] = (o) => c.value = o),
+                    "data-testid": "filter-pill-multiselect",
+                    items: e.filter.options,
+                    label: "Value",
+                    placeholder: "Select values"
+                  }, null, 8, ["modelValue", "items"])) : (y(), k(de, {
+                    key: 2,
+                    ref: "inputField",
+                    modelValue: n.value,
+                    "onUpdate:modelValue": l[4] || (l[4] = (o) => n.value = o),
+                    modelModifiers: { trim: !0 },
+                    "data-testid": "filter-pill-input",
+                    label: "Value",
+                    placeholder: "Enter a value"
+                  }, null, 8, ["modelValue"]))
+                ])
+              ])
+            ], !0)
+          ])
+        ]),
+        footer: v(() => [
+          h("div", Ce, [
+            g(a, {
+              appearance: "secondary",
+              "data-testid": "filter-pill-cancel",
+              onClick: H
+            }, {
+              default: v(() => [...l[5] || (l[5] = [
+                S(" Cancel ", -1)
+              ])]),
+              _: 1
+            }),
+            g(a, {
+              appearance: "primary",
+              "data-testid": "filter-pill-apply",
+              disabled: F.value,
+              onClick: z
+            }, {
+              default: v(() => [...l[6] || (l[6] = [
+                S(" Apply ", -1)
+              ])]),
+              _: 1
+            }, 8, ["disabled"])
+          ])
+        ]),
+        _: 3
+      }, 8, ["max-width", "offset", "placement"]);
+    };
+  }
+});
 export {
-  le as autoPlacement,
-  oe as computePosition,
-  ee as detectOverflow,
-  se as flip,
-  Y as rectToClientRect,
-  ae as shift
+  qe as default
 };

package/dist/kongponents284.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),r=require("./kongponents199.cjs"),p={ref:"itemsContainer"},B={key:1,class:"select-group","data-propagate-clicks":"false"},g={class:"select-group-title"},v={class:"select-item-description"},u=".select-item button:not(:disabled)",w='.select-item[aria-selected="true"] button:not(:disabled)',C=e.defineComponent({__name:"KSelectItems",props:{items:{default:()=>[]},itemCreationEnabled:{type:Boolean},filterString:{default:""},itemCreationValid:{type:Boolean,default:!0}},emits:["selected","add-item"],setup(i,{expose:f,emit:E}){const k=E,a=n=>"items"in n&&Array.isArray(n.items),d=n=>k("selected",n),m=e.useTemplateRef("itemsContainer"),S=n=>{const o=m.value;if(!o)return;const t=o.querySelectorAll(u);if(!t?.length)return;const s=o.querySelector(w);if(s){const l=[...t].indexOf(s);t[n==="down"?l+1:l-1]?.focus()}else t[n==="down"?0:t.length-1]?.focus()},c=({target:n,key:o})=>{if(o==="ArrowDown"||o==="ArrowUp"){const t=m.value?.querySelectorAll(u);if(t?.length){const s=[...t].indexOf(n),l=o==="ArrowDown"?s+1:s-1;t[l]?.focus()}}};return f({setFocus:S}),(n,o)=>(e.openBlock(),e.createElementBlock("div",p,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(i.items,(t,s)=>(e.openBlock(),e.createElementBlock(e.Fragment,{key:a(t)?`${t.key||t.label}-group`:t.key||t.value||s},[a(t)?(e.openBlock(),e.createElementBlock("div",B,[e.createElementVNode("span",g,e.toDisplayString(t.label),1),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.items,l=>(e.openBlock(),e.createBlock(r.default,{key:l.key,item:l,onKeydown:c,onSelected:d},{content:e.withCtx(()=>[e.renderSlot(n.$slots,"content",{item:l},void 0,!0)]),_:2},1032,["item"]))),128))])):(e.openBlock(),e.createBlock(r.default,{key:0,item:t,onKeydown:c,onSelected:d},{content:e.withCtx(()=>[e.renderSlot(n.$slots,"content",{item:t},void 0,!0)]),_:2},1032,["item"]))],64))),128)),i.itemCreationEnabled?(e.openBlock(),e.createBlock(r.default,{key:"select-add-item",class:"select-add-item","data-testid":"select-add-item",item:{label:`${i.filterString} (Add new value)`,value:"add_item",disabled:!i.itemCreationValid},onKeydown:c,onSelected:o[0]||(o[0]=t=>n.$emit("add-item"))},{content:e.withCtx(()=>[e.createElementVNode("div",v,[e.createTextVNode(e.toDisplayString(i.filterString)+" ",1),o[1]||(o[1]=e.createElementVNode("span",{class:"select-item-new-indicator"},"(Add new value)",-1))])]),_:1},8,["item"])):e.createCommentVNode("",!0)],512))}});exports.default=C;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("vue"),u=require("./kongponents285.cjs"),b=["aria-hidden"],c='<path d="M11 19V13H5V11H11V5H13V11H19V13H13V19H11Z" fill="currentColor"/>',h=r.defineComponent({__name:"AddIcon",props:{title:{type:String,required:!1,default:""},color:{type:String,required:!1,default:"currentColor"},display:{type:String,required:!1,default:"block"},decorative:{type:Boolean,required:!1,default:!1},size:{type:[Number,String],required:!1,default:u.KUI_ICON_SIZE_50,validator:t=>{if(typeof t=="string"&&/^\s*var\(\s*--[\w-]+\s*(?:,[^)]*)?\)\s*$/.test(t)||typeof t=="number"&&t>0)return!0;if(typeof t=="string"){const e=String(t).replace(/px/gi,""),o=Number(e);if(o&&!isNaN(o)&&Number.isInteger(o)&&o>0)return!0}return!1}},as:{type:String,required:!1,default:"span"},staticIds:{type:Boolean,default:!1}},setup(t){const e=t,o=n=>typeof n=="string"&&/^\s*var\(\s*--[\w-]+\s*(?:,[^)]*)?\)\s*$/.test(n),s=r.computed(()=>{if(o(e.size))return e.size;if(typeof e.size=="number"&&e.size>0)return`${e.size}px`;if(typeof e.size=="string"){const n=String(e.size).replace(/px/gi,""),i=Number(n);if(i&&!isNaN(i)&&Number.isInteger(i)&&i>0)return`${i}px`}return u.KUI_ICON_SIZE_50}),p=r.computed(()=>({boxSizing:"border-box",color:e.color,display:e.display,flexShrink:"0",height:s.value,lineHeight:"0",width:s.value,pointerEvents:e.decorative?"none":void 0})),f=n=>{const i={},m=Math.random().toString(36).substring(2,12);return n.replace(/id="([^"]+)"/g,(l,a)=>{const d=`${m}-${a}`;return i[a]=d,`id="${d}"`}).replace(/#([^\s^")]+)/g,(l,a)=>i[a]?`#${i[a]}`:l)},g={"<":"&lt;",">":"&gt;",'"':"&quot;","'":"&#39;","&":"&amp;"},v=n=>n.replace(/[<>"'&]/g,i=>g[i]),y=`${e.title?`<title data-testid="kui-icon-svg-title">${v(e.title)}</title>`:""}${e.staticIds?c:f(c)}`;return(n,i)=>(r.openBlock(),r.createBlock(r.resolveDynamicComponent(t.as),{"aria-hidden":t.decorative?"true":void 0,class:"kui-icon add-icon","data-testid":"kui-icon-wrapper-add-icon",style:r.normalizeStyle(p.value),tabindex:t.decorative?"-1":void 0},{default:r.withCtx(()=>[(r.openBlock(),r.createElementBlock("svg",{"aria-hidden":t.decorative?"true":void 0,"data-testid":"kui-icon-svg-add-icon",fill:"none",height:"100%",role:"img",viewBox:"0 0 24 24",width:"100%",xmlns:"http://www.w3.org/2000/svg",innerHTML:y},null,8,b))]),_:1},8,["aria-hidden","style","tabindex"]))}});exports.default=h;