@kong/kongponents 9.56.1 → 9.56.2

package/dist/kongponents.es90.js

@@ -1,22 +1,22 @@
 import { defineComponent as Ee, useCssVars as Te, watch as T, useSlots as Be, ref as m, useTemplateRef as H, computed as d, nextTick as ne, onMounted as Se, onBeforeUnmount as Ie, openBlock as i, createElementBlock as b, normalizeClass as N, createVNode as r, withCtx as c, Transition as $, unref as a, createBlock as k, createCommentVNode as v, Fragment as F, createTextVNode as V, toDisplayString as w, createElementVNode as L, renderSlot as Re, withDirectives as ae, resolveDynamicComponent as ie, normalizeProps as Ae, mergeProps as ue, vShow as re } from "vue";
-import { Virtualizer as ce } from "./kongponents.es237.js";
+import { Virtualizer as ce } from "./kongponents.es183.js";
 import Pe from "./kongponents.es49.js";
 import { copyTextToClipboard as He } from "./kongponents.es169.js";
-import { ShortcutManager as $e } from "./kongponents.es238.js";
-import { LINE_NUMBER_EXPRESSION_REGEX as Fe, buildLineOffsets as Ve, highlightMatchingChars as qe, escapeHTMLIfNeeded as se, normalizeHighlightedLines as De, getMatchingLineNumbers as Oe } from "./kongponents.es239.js";
-import ze from "./kongponents.es203.js";
-import Ue from "./kongponents.es240.js";
+import { ShortcutManager as $e } from "./kongponents.es184.js";
+import { LINE_NUMBER_EXPRESSION_REGEX as Fe, buildLineOffsets as Ve, highlightMatchingChars as qe, escapeHTMLIfNeeded as se, normalizeHighlightedLines as ze, getMatchingLineNumbers as De } from "./kongponents.es185.js";
+import Oe from "./kongponents.es186.js";
+import Ue from "./kongponents.es187.js";
 import je from "./kongponents.es176.js";
-import Ke from "./kongponents.es213.js";
-import Xe from "./kongponents.es241.js";
-import Ge from "./kongponents.es186.js";
-import Qe from "./kongponents.es242.js";
-import We from "./kongponents.es233.js";
+import Ke from "./kongponents.es188.js";
+import Xe from "./kongponents.es189.js";
+import Ge from "./kongponents.es190.js";
+import Qe from "./kongponents.es191.js";
+import We from "./kongponents.es192.js";
 import { KUI_COLOR_TEXT_NEUTRAL_STRONG as Ye, KUI_COLOR_TEXT_INVERSE as Ze, KUI_ICON_SIZE_30 as Je, KUI_LINE_HEIGHT_30 as de } from "./kongponents.es181.js";
 import B from "./kongponents.es38.js";
-import { IS_MAYBE_MAC as _e } from "./kongponents.es198.js";
-import { normalizeSize as et } from "./kongponents.es189.js";
-import tt from "./kongponents.es243.js";
+import { IS_MAYBE_MAC as _e } from "./kongponents.es193.js";
+import { normalizeSize as et } from "./kongponents.es182.js";
+import tt from "./kongponents.es194.js";
 const ot = ["id"], lt = {
   key: 0,
   class: "code-block-actions"
@@ -52,8 +52,8 @@ const ot = ["id"], lt = {
   emits: ["code-block-render", "matching-lines-change", "query-change", "filter-mode-change", "reg-exp-mode-change"],
   setup(t, { emit: he }) {
     Te((e) => ({
-      v6051f68b: Le.value,
-      v01369cea: ve.value
+      v5822394f: Le.value,
+      v3ddfddae: ve.value
     }));
     const C = _e ? "Option" : "Alt", me = tt(W, 150, { leading: !0, trailing: !0 });
     T(() => t.highlightedLineNumbers, (e) => {
@@ -61,7 +61,7 @@ const ot = ["id"], lt = {
         "KCodeBlock: `highlightedLineNumbers` prop should be either a properly formatted string (e.g. '1,3-5,7'), an array of numbers or tuples of numbers."
       );
     }, { immediate: !0 });
-    const x = he, fe = Be(), q = m(t.query), p = m(!1), g = m(t.initialRegExpMode), f = m(t.initialFilterMode), y = m(null), s = m(t.query), D = m(0), n = m([]), h = m(null), u = H("codeBlock"), R = H("codeBlockContent"), O = H("codeBlockLineNumbers"), A = m(!1), P = m(!1), z = d(() => new Set(n.value)), S = d(() => {
+    const x = he, fe = Be(), q = m(t.query), p = m(!1), g = m(t.initialRegExpMode), f = m(t.initialFilterMode), y = m(null), s = m(t.query), z = m(0), n = m([]), h = m(null), u = H("codeBlock"), R = H("codeBlockContent"), D = H("codeBlockLineNumbers"), A = m(!1), P = m(!1), O = d(() => new Set(n.value)), S = d(() => {
       var e;
       return Array.from({ length: (e = t.code) == null ? void 0 : e.split(`
 `).length }, (o, l) => l + 1);
@@ -77,7 +77,7 @@ const ot = ["id"], lt = {
       if (s.value === "" || n.value.length === 0)
         return "";
       const e = (o = t.code) == null ? void 0 : o.split(`
-`).filter((l, xe) => z.value.has(xe + 1)).join(`
+`).filter((l, xe) => O.value.has(xe + 1)).join(`
 `);
       return qe(e, s.value, g.value);
     }), ye = d(() => !t.singleLine && t.searchable), ke = d(
@@ -179,14 +179,14 @@ const ot = ["id"], lt = {
       await ne(), x("query-change", s.value), I();
     }
     function Y() {
-      p.value = !0, y.value = null, n.value = De(t.highlightedLineNumbers, S.value.length), D.value = n.value.length, G(), p.value = !1;
+      p.value = !0, y.value = null, n.value = ze(t.highlightedLineNumbers, S.value.length), z.value = n.value.length, G(), p.value = !1;
     }
     function I() {
       p.value = !0, y.value = null;
       let e = [];
       if (s.value.length > 0)
         try {
-          e = Oe(
+          e = De(
             t.code.toLowerCase(),
             s.value.toLowerCase(),
             g.value,
@@ -198,7 +198,7 @@ const ot = ["id"], lt = {
           else
             throw o;
         }
-      h.value = null, D.value = e.length, n.value = Array.from(new Set(e)), G(), p.value = !1;
+      h.value = null, z.value = e.length, n.value = Array.from(new Set(e)), G(), p.value = !1;
     }
     function Ne() {
       s.value = "", W();
@@ -223,7 +223,7 @@ const ot = ["id"], lt = {
       if (!o)
         return;
       const l = u.value.querySelector(`.highlighted-code-block #${E(o)}`);
-      l ? "scrollIntoViewIfNeeded" in l && typeof l.scrollIntoViewIfNeeded == "function" ? l.scrollIntoViewIfNeeded(!0) : l.scrollIntoView({ block: "nearest" }) : O.value && O.value.scrollToIndex(o - 1, { align: "center" });
+      l ? "scrollIntoViewIfNeeded" in l && typeof l.scrollIntoViewIfNeeded == "function" ? l.scrollIntoViewIfNeeded(!0) : l.scrollIntoView({ block: "nearest" }) : D.value && D.value.scrollToIndex(o - 1, { align: "center" });
     }
     async function oe(e) {
       const o = e.target.closest("button");
@@ -246,7 +246,7 @@ const ot = ["id"], lt = {
         itemProps: ({ item: o }) => ({
           class: N({
             line: !0,
-            "line-is-match": e ? !1 : z.value.has(o),
+            "line-is-match": e ? !1 : O.value.has(o),
             "line-is-highlighted-match": e ? !1 : h.value !== null && o === n.value[h.value]
           })
         }),
@@ -322,7 +322,7 @@ const ot = ["id"], lt = {
                     class: "code-block-processing-icon",
                     color: we.value,
                     "data-testid": "code-block-processing-icon",
-                    size: a(Je),
+                    size: `var(--kui-icon-size-30, ${a(Je)})`,
                     title: "Loading"
                   }, null, 8, ["color", "size"])) : v("", !0)
                 ]),
@@ -396,7 +396,7 @@ const ot = ["id"], lt = {
             onClick: _
           }, {
             default: c(() => [
-              r(a(ze), { decorative: "" })
+              r(a(Oe), { decorative: "" })
             ]),
             _: 1
           }, 8, ["disabled", "theme"])

package/dist/kongponents.es95.js

@@ -1,5 +1,5 @@
-import { defineComponent as I, useSlots as N, useId as T, ref as f, computed as n, watch as w, openBlock as r, createElementBlock as g, createElementVNode as d, normalizeClass as h, createBlock as D, resolveDynamicComponent as L, withCtx as b, renderSlot as a, createTextVNode as z, toDisplayString as C, createCommentVNode as v, withModifiers as E, unref as c, createVNode as V, Transition as A, withDirectives as K, vShow as x } from "vue";
-import M from "./kongponents.es204.js";
+import { defineComponent as I, useSlots as N, useId as T, ref as f, computed as n, watch as w, openBlock as r, createElementBlock as g, createElementVNode as d, normalizeClass as h, createBlock as z, resolveDynamicComponent as D, withCtx as b, renderSlot as a, createTextVNode as L, toDisplayString as C, createCommentVNode as v, withModifiers as E, unref as c, createVNode as V, Transition as A, withDirectives as K, vShow as x } from "vue";
+import M from "./kongponents.es209.js";
 import { KUI_ICON_SIZE_40 as O } from "./kongponents.es181.js";
 const U = { class: "k-collapse" }, Z = { class: "collapse-trigger" }, j = ["aria-controls", "aria-expanded", "aria-label"], q = {
   key: 0,
@@ -36,14 +36,14 @@ const U = { class: "k-collapse" }, Z = { class: "collapse-trigger" }, j = ["aria
       d("div", {
         class: h(["collapse-heading", { "has-trailing-trigger": $.value }])
       }, [
-        t.title || e.$slots.title ? (r(), D(L(t.titleTag), {
+        t.title || e.$slots.title ? (r(), z(D(t.titleTag), {
           key: 0,
           class: "collapse-title",
           "data-testid": "collapse-title"
         }, {
           default: b(() => [
             a(e.$slots, "title", {}, () => [
-              z(C(t.title), 1)
+              L(C(t.title), 1)
             ], !0)
           ]),
           _: 3
@@ -67,7 +67,7 @@ const U = { class: "k-collapse" }, Z = { class: "collapse-trigger" }, j = ["aria
                   class: h(["collapse-trigger-icon", { "collapse-expanded": !o.value }]),
                   "data-testid": "collapse-trigger-icon",
                   decorative: "",
-                  size: c(O)
+                  size: `var(--kui-icon-size-40, ${c(O)})`
                 }, null, 8, ["class", "size"]),
                 t.triggerLabel ? (r(), g("span", q, C(t.triggerLabel), 1)) : v("", !0)
               ], !0)

package/dist/kongponents.es97.js

@@ -1,16 +1,16 @@
-import { defineComponent as ae, ref as u, computed as R, useTemplateRef as le, reactive as ie, watch as D, openBlock as d, createElementBlock as c, normalizeStyle as X, normalizeClass as x, createVNode as ne, unref as T, withCtx as f, createElementVNode as v, createBlock as y, createCommentVNode as g, createTextVNode as M, toDisplayString as I, isRef as de, Fragment as j, renderList as q } from "vue";
+import { defineComponent as ae, ref as u, computed as R, useTemplateRef as le, reactive as ie, watch as D, openBlock as r, createElementBlock as c, normalizeStyle as X, normalizeClass as x, createVNode as ne, unref as T, withCtx as f, createElementVNode as v, createBlock as y, createCommentVNode as g, createTextVNode as M, toDisplayString as I, isRef as re, Fragment as j, renderList as q } from "vue";
 import U from "./kongponents.es32.js";
-import re from "./kongponents.es56.js";
+import de from "./kongponents.es56.js";
 import oe from "./kongponents.es59.js";
 /* empty css                  */
 import "./kongponents.es5.js";
 import { DateTimePickerModes as se, ModeArrayCustom as me, ModeArrayRelative as ue, ModeDateOnly as ce } from "./kongponents.es10.js";
-import fe from "./kongponents.es215.js";
+import fe from "./kongponents.es196.js";
 import { KUI_SPACE_40 as ve, KUI_ICON_SIZE_40 as ye, KUI_COLOR_TEXT_NEUTRAL as ge } from "./kongponents.es181.js";
-import { normalizeSize as be } from "./kongponents.es189.js";
-import pe from "./kongponents.es216.js";
-import B from "./kongponents.es217.js";
-import C from "./kongponents.es218.js";
+import { normalizeSize as be } from "./kongponents.es182.js";
+import pe from "./kongponents.es197.js";
+import B from "./kongponents.es198.js";
+import C from "./kongponents.es199.js";
 const ke = ["tabindex"], Re = ["innerHTML"], De = {
   key: 1,
   class: "range-display"
@@ -59,18 +59,18 @@ const ke = ["tabindex"], Re = ["innerHTML"], De = {
       tabName: "relative"
     }), N = (e) => {
       if (!e) return;
-      const l = o.value ? !e.start : !e.start || !e.end, i = (e == null ? void 0 : e.start) || /* @__PURE__ */ new Date(), r = (e == null ? void 0 : e.end) || null;
-      P.value = !!l, !o.value && e && e.start && e.end ? (p.value.start = i, p.value.end = r) : e && e.start && (h.value = i), t.selectedRange = t.previouslySelectedRange = {
+      const l = o.value ? !e.start : !e.start || !e.end, i = (e == null ? void 0 : e.start) || /* @__PURE__ */ new Date(), d = (e == null ? void 0 : e.end) || null;
+      P.value = !!l, !o.value && e && e.start && e.end ? (p.value.start = i, p.value.end = d) : e && e.start && (h.value = i), t.selectedRange = t.previouslySelectedRange = {
         start: i,
-        end: r
+        end: d
       };
     }, E = (e, l = !1) => {
       if (e) {
         if (t.selectedTimeframe = t.previouslySelectedTimeframe = e, t.selectedRange = {
           timePeriodsKey: t.selectedTimeframe.key
         }, t.selectedTimeframe.start && t.selectedTimeframe.end) {
-          const i = new Date(t.selectedTimeframe.start()), r = new Date(t.selectedTimeframe.end());
-          t.fullRangeDisplay = Z({ start: i, end: r }, !1), t.selectedRange.start = i, t.selectedRange.end = r;
+          const i = new Date(t.selectedTimeframe.start()), d = new Date(t.selectedTimeframe.end());
+          t.fullRangeDisplay = Z({ start: i, end: d }, !1), t.selectedRange.start = i, t.selectedRange.end = d;
         } else
           t.fullRangeDisplay = "";
         P.value = !1, l && F();
@@ -79,10 +79,10 @@ const ke = ["tabindex"], Re = ["innerHTML"], De = {
       var e;
       p.value = O, h.value = null, t.abbreviatedDisplay = a.placeholder, t.fullRangeDisplay = "", s.value && (t.selectedTimeframe = ((e = a.timePeriods[0]) == null ? void 0 : e.values[0]) || null), t.selectedRange = t.previouslySelectedRange = O, m("change", t.selectedRange), m("update:modelValue", t.selectedRange);
     }, Z = (e, l) => {
-      const { start: i, end: r } = e;
+      const { start: i, end: d } = e;
       let n = a.timeGranularity === "secondly" ? "PP hh:mm:ss a" : "PP hh:mm a";
       const k = B(i, $, "(z)");
-      return !z.value && s.value ? n = "PP hh:mm a" : ce.includes(a.mode) && (n = "PP"), o.value ? `${C(i, n)} ${k}` : l ? `<div>${C(i, n)} -&nbsp;</div><div>${B(r, $, n)} ${k}</div>` : `${C(i, n)} - ${B(r, $, n)} ${k}`;
+      return !z.value && s.value ? n = "PP hh:mm a" : ce.includes(a.mode) && (n = "PP"), o.value ? `${C(i, n)} ${k}` : l ? `<div>${C(i, n)} -&nbsp;</div><div>${B(d, $, n)} ${k}</div>` : `${C(i, n)} - ${B(d, $, n)} ${k}`;
     }, F = async () => {
       var e;
       o.value ? t.selectedRange.start && (m("change", { start: t.selectedRange.start, end: null }), m("update:modelValue", { start: t.selectedRange.start, end: null })) : (m("change", t.selectedRange), m("update:modelValue", t.selectedRange)), (e = L.value) == null || e.hidePopover(), w();
@@ -125,24 +125,24 @@ const ke = ["tabindex"], Re = ["innerHTML"], De = {
     }, te = () => {
       t.popoverOpen = !0, S.value && S.value.initTimeInputs();
     };
-    return (e, l) => (d(), c("div", {
+    return (e, l) => (r(), c("div", {
       class: x(["k-datetime-picker", { "set-min-width": s.value }]),
       style: X(G.value)
     }, [
-      ne(re, {
+      ne(de, {
         ref_key: "kPop",
         ref: L,
         disabled: a.disabled || a.readonly,
         "hide-caret": "",
         "hide-close-icon": "",
-        offset: T(ve),
+        offset: `var(--kui-space-40, ${T(ve)})`,
         placement: a.popoverPlacement,
         width: "auto",
         onClose: ee,
         onOpen: te
       }, {
         content: f(() => [
-          s.value && z.value ? (d(), y(oe, {
+          s.value && z.value ? (r(), y(oe, {
             key: 0,
             modelValue: t.tabName,
             "onUpdate:modelValue": l[0] || (l[0] = (i) => t.tabName = i),
@@ -154,12 +154,12 @@ const ke = ["tabindex"], Re = ["innerHTML"], De = {
             ],
             onClick: l[1] || (l[1] = (i) => t.tabName = i)
           }, null, 8, ["modelValue"])) : g("", !0),
-          !b.value && t.fullRangeDisplay ? (d(), c("p", De, I(t.fullRangeDisplay), 1)) : g("", !0),
-          z.value && b.value ? (d(), y(pe, {
+          !b.value && t.fullRangeDisplay ? (r(), c("p", De, I(t.fullRangeDisplay), 1)) : g("", !0),
+          z.value && b.value ? (r(), y(pe, {
             key: W.value,
             ref: "calendarWrapperRef",
             modelValue: T(A),
-            "onUpdate:modelValue": l[2] || (l[2] = (i) => de(A) ? A.value = i : null),
+            "onUpdate:modelValue": l[2] || (l[2] = (i) => re(A) ? A.value = i : null),
             error: K.value,
             "onUpdate:error": l[3] || (l[3] = (i) => K.value = i),
             "custom-range-validation": a.customRangeValidation,
@@ -170,14 +170,14 @@ const ke = ["tabindex"], Re = ["innerHTML"], De = {
             "min-date": a.minDate,
             "same-day-full-range": a.sameDayFullRange,
             "time-granularity": a.timeGranularity
-          }, null, 8, ["modelValue", "error", "custom-range-validation", "error-message", "is-range", "k-date-picker-mode", "max-date", "min-date", "same-day-full-range", "time-granularity"])) : s.value && !o.value ? (d(), c("div", Te, [
-            (d(!0), c(j, null, q(a.timePeriods, (i, r) => (d(), c("div", {
-              key: `section-${String(i.section || r)}`,
+          }, null, 8, ["modelValue", "error", "custom-range-validation", "error-message", "is-range", "k-date-picker-mode", "max-date", "min-date", "same-day-full-range", "time-granularity"])) : s.value && !o.value ? (r(), c("div", Te, [
+            (r(!0), c(j, null, q(a.timePeriods, (i, d) => (r(), c("div", {
+              key: `section-${String(i.section || d)}`,
               class: "timeframe-section"
             }, [
               v("div", Pe, I(i.section), 1),
               v("div", he, [
-                (d(!0), c(j, null, q(i.values, (n, k) => (d(), y(U, {
+                (r(!0), c(j, null, q(i.values, (n, k) => (r(), y(U, {
                   key: `time-${k}`,
                   appearance: _(n),
                   class: "timeframe-button",
@@ -195,7 +195,7 @@ const ke = ["tabindex"], Re = ["innerHTML"], De = {
         ]),
         footer: f(() => [
           v("div", Se, [
-            a.clearButton ? (d(), y(U, {
+            a.clearButton ? (r(), y(U, {
               key: 0,
               appearance: "tertiary",
               class: "action-button",
@@ -207,7 +207,7 @@ const ke = ["tabindex"], Re = ["innerHTML"], De = {
               ])]),
               _: 1
             })) : g("", !0),
-            b.value ? (d(), y(U, {
+            b.value ? (r(), y(U, {
               key: 1,
               appearance: "tertiary",
               class: "action-button",
@@ -239,12 +239,12 @@ const ke = ["tabindex"], Re = ["innerHTML"], De = {
                 innerHTML: t.abbreviatedDisplay
               }, null, 10, Re)
             ], 14, ke),
-            a.icon ? (d(), y(T(fe), {
+            a.icon ? (r(), y(T(fe), {
               key: 0,
               class: "calendar-icon",
               color: `var(--kui-color-text-neutral, ${T(ge)})`,
               decorative: "",
-              size: T(ye)
+              size: `var(--kui-icon-size-40, ${T(ye)})`
             }, null, 8, ["color", "size"])) : g("", !0)
           ], 2)
         ]),