@kong/kongponents 9.46.4 → 9.46.5-pr.2983.c02bc9f.0

package/dist/kongponents.es96.js

@@ -1,16 +1,16 @@
-import { defineComponent as ae, ref as c, computed as R, reactive as le, useTemplateRef as ie, watch as T, createElementBlock as u, openBlock as r, normalizeStyle as j, normalizeClass as x, createVNode as ne, unref as D, withCtx as f, createElementVNode as v, createBlock as y, createCommentVNode as g, createTextVNode as M, toDisplayString as A, isRef as re, Fragment as q, renderList as F } from "vue";
-import I from "./kongponents.es33.js";
+import { defineComponent as ae, ref as c, computed as R, reactive as le, useTemplateRef as ie, watch as T, createElementBlock as u, openBlock as r, normalizeStyle as j, normalizeClass as x, createVNode as ne, unref as D, withCtx as f, createElementVNode as v, createBlock as y, createCommentVNode as g, createTextVNode as M, toDisplayString as I, isRef as re, Fragment as q, renderList as F } from "vue";
+import U from "./kongponents.es33.js";
 import de from "./kongponents.es53.js";
 import se from "./kongponents.es56.js";
 /* empty css                  */
 import "./kongponents.es5.js";
 import { DateTimePickerModes as oe, ModeArrayCustom as me, ModeArrayRelative as ce, ModeDateOnly as ue } from "./kongponents.es10.js";
-import fe from "./kongponents.es229.js";
-import { KUI_SPACE_40 as ve, KUI_ICON_SIZE_40 as ye, KUI_COLOR_TEXT_NEUTRAL as ge } from "./kongponents.es172.js";
-import { normalizeSize as pe } from "./kongponents.es173.js";
-import be from "./kongponents.es230.js";
-import U from "./kongponents.es231.js";
-import C from "./kongponents.es232.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.es177.js";
+import { normalizeSize as be } from "./kongponents.es178.js";
+import pe from "./kongponents.es197.js";
+import B from "./kongponents.es198.js";
+import C from "./kongponents.es199.js";
 const ke = ["tabindex"], Re = ["innerHTML"], Te = {
   key: 1,
   class: "range-display"
@@ -41,12 +41,12 @@ const ke = ["tabindex"], Re = ["innerHTML"], Te = {
   emits: ["change", "update:modelValue"],
   setup(a, { emit: J }) {
     var V, X;
-    const m = J, L = c(null), w = R(() => a.mode !== oe.Relative), s = R(() => me.includes(a.mode) && !a.range), o = R(() => a.timePeriods.length > 0), p = R(() => t.tabName === "custom" || !o.value), P = c(!0), B = c(!1), W = c(0), K = {
+    const m = J, L = c(null), z = R(() => a.mode !== oe.Relative), s = R(() => me.includes(a.mode) && !a.range), o = R(() => a.timePeriods.length > 0), b = R(() => t.tabName === "custom" || !o.value), P = c(!0), K = c(!1), W = c(0), O = {
       start: null,
       end: null
-    }, h = c(a.modelValue.start || null), b = c(a.modelValue || K), O = s.value ? h : b, S = ie("calendarWrapperRef"), G = R(() => ({
-      width: pe(a.width)
-    })), z = Intl.DateTimeFormat().resolvedOptions().timeZone, t = le({
+    }, h = c(a.modelValue.start || null), p = c(a.modelValue || O), A = s.value ? h : p, S = ie("calendarWrapperRef"), G = R(() => ({
+      width: be(a.width)
+    })), $ = Intl.DateTimeFormat().resolvedOptions().timeZone, t = le({
       abbreviatedDisplay: a.placeholder,
       fullRangeDisplay: "",
       popoverOpen: !1,
@@ -55,10 +55,10 @@ const ke = ["tabindex"], Re = ["innerHTML"], Te = {
       selectedTimeframe: (V = a.timePeriods[0]) == null ? void 0 : V.values[0],
       previouslySelectedTimeframe: (X = a.timePeriods[0]) == null ? void 0 : X.values[0],
       tabName: "relative"
-    }), $ = (e) => {
+    }), N = (e) => {
       if (!e) return;
       const l = s.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, !s.value && e && e.start && e.end ? (b.value.start = i, b.value.end = d) : e && e.start && (h.value = i), t.selectedRange = t.previouslySelectedRange = {
+      P.value = !!l, !s.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: d
       };
@@ -73,40 +73,45 @@ const ke = ["tabindex"], Re = ["innerHTML"], Te = {
       P.value = !1, l && H();
     }, Q = () => {
       var e;
-      b.value = K, h.value = null, t.abbreviatedDisplay = a.placeholder, t.fullRangeDisplay = "", o.value && (t.selectedTimeframe = (e = a.timePeriods[0]) == null ? void 0 : e.values[0]), t.selectedRange = t.previouslySelectedRange = K, m("change", t.selectedRange), m("update:modelValue", t.selectedRange);
+      p.value = O, h.value = null, t.abbreviatedDisplay = a.placeholder, t.fullRangeDisplay = "", o.value && (t.selectedTimeframe = (e = a.timePeriods[0]) == null ? void 0 : e.values[0]), t.selectedRange = t.previouslySelectedRange = O, m("change", t.selectedRange), m("update:modelValue", t.selectedRange);
     }, Z = (e, l) => {
       const { start: i, end: d } = e;
       let n = a.timeGranularity === "secondly" ? "PP hh:mm:ss a" : "PP hh:mm a";
-      const k = U(i, z, "(z)");
-      return !w.value && o.value ? n = "PP hh:mm a" : ue.includes(a.mode) && (n = "PP"), s.value ? `${C(i, n)} ${k}` : l ? `<div>${C(i, n)} -&nbsp;</div><div>${U(d, z, n)} ${k}</div>` : `${C(i, n)} - ${U(d, z, n)} ${k}`;
+      const k = B(i, $, "(z)");
+      return !z.value && o.value ? n = "PP hh:mm a" : ue.includes(a.mode) && (n = "PP"), s.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}`;
     }, H = async () => {
       var e;
-      s.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(), N();
-    }, N = () => {
+      s.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();
+    }, w = () => {
       var e;
-      p.value && ((e = t.selectedRange) != null && e.start) ? t.abbreviatedDisplay = Z(t.selectedRange, !0) : o.value && !p.value && (t.abbreviatedDisplay = t.selectedTimeframe.display);
+      if (b.value && ((e = t.selectedRange) != null && e.start))
+        t.abbreviatedDisplay = Z(t.selectedRange, !0);
+      else if (o.value && !b.value) {
+        const l = B(/* @__PURE__ */ new Date(), $, "(z)");
+        t.abbreviatedDisplay = `${t.selectedTimeframe.display} ${l}`;
+      }
     }, Y = (e) => e.charAt(0).toUpperCase() + e.slice(1), _ = (e) => t.selectedTimeframe.key === e.key ? "primary" : "secondary";
     T(h, (e, l) => {
-      e !== void 0 && e !== l && $({ start: e, end: null });
-    }, { immediate: !0 }), T(b, (e, l) => {
-      e !== void 0 && e !== l && $(e);
+      e !== void 0 && e !== l && N({ start: e, end: null });
+    }, { immediate: !0 }), T(p, (e, l) => {
+      e !== void 0 && e !== l && N(e);
     }, { immediate: !0 }), T(() => t.tabName, (e, l) => {
-      l !== void 0 && e === "relative" ? E(t.previouslySelectedTimeframe) : l !== void 0 && e === "custom" && $(t.previouslySelectedRange);
+      l !== void 0 && e === "relative" ? E(t.previouslySelectedTimeframe) : l !== void 0 && e === "custom" && N(t.previouslySelectedRange);
     }), T(() => a.modelValue, () => {
       if (ce.includes(a.mode) && a.modelValue.timePeriodsKey) {
         t.tabName = "relative", P.value = !1;
         for (const e of a.timePeriods) {
           const l = e.values.find((i) => i.key === a.modelValue.timePeriodsKey);
           if (l) {
-            E(l), N();
+            E(l), w();
             break;
           }
         }
       } else
-        t.tabName = "custom", $(a.modelValue), (a.modelValue.start && a.modelValue.end || s.value && a.modelValue.start) && N();
+        t.tabName = "custom", N(a.modelValue), (a.modelValue.start && a.modelValue.end || s.value && a.modelValue.start) && w();
       W.value++;
     }, { immediate: !0 }), T(() => a.timeGranularity, () => {
-      N();
+      w();
     });
     const ee = () => {
       t.popoverOpen = !1, S.value && S.value.resetTime();
@@ -130,7 +135,7 @@ const ke = ["tabindex"], Re = ["innerHTML"], Te = {
         onOpen: te
       }, {
         content: f(() => [
-          o.value && w.value ? (r(), y(se, {
+          o.value && z.value ? (r(), y(se, {
             key: 0,
             modelValue: t.tabName,
             "onUpdate:modelValue": l[0] || (l[0] = (i) => t.tabName = i),
@@ -142,14 +147,14 @@ const ke = ["tabindex"], Re = ["innerHTML"], Te = {
             ],
             onClick: l[1] || (l[1] = (i) => t.tabName = i)
           }, null, 8, ["modelValue"])) : g("", !0),
-          !p.value && t.fullRangeDisplay ? (r(), u("p", Te, A(t.fullRangeDisplay), 1)) : g("", !0),
-          w.value && p.value ? (r(), y(be, {
+          !b.value && t.fullRangeDisplay ? (r(), u("p", Te, I(t.fullRangeDisplay), 1)) : g("", !0),
+          z.value && b.value ? (r(), y(pe, {
             key: W.value,
             ref: "calendarWrapperRef",
-            modelValue: D(O),
-            "onUpdate:modelValue": l[2] || (l[2] = (i) => re(O) ? O.value = i : null),
-            error: B.value,
-            "onUpdate:error": l[3] || (l[3] = (i) => B.value = i),
+            modelValue: D(A),
+            "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),
             "error-message": a.invalidTimeErrorMessage,
             "is-range": !s.value,
             "k-date-picker-mode": a.mode,
@@ -161,9 +166,9 @@ const ke = ["tabindex"], Re = ["innerHTML"], Te = {
               key: `section-${String(i.section || d)}`,
               class: "timeframe-section"
             }, [
-              v("div", Pe, A(i.section), 1),
+              v("div", Pe, I(i.section), 1),
               v("div", he, [
-                (r(!0), u(q, null, F(i.values, (n, k) => (r(), y(I, {
+                (r(!0), u(q, null, F(i.values, (n, k) => (r(), y(U, {
                   key: `time-${k}`,
                   appearance: _(n),
                   class: "timeframe-button",
@@ -171,7 +176,7 @@ const ke = ["tabindex"], Re = ["innerHTML"], Te = {
                   onClick: ($e) => E(n, !0)
                 }, {
                   default: f(() => [
-                    M(A(Y(n.timeframeText)), 1)
+                    M(I(Y(n.timeframeText)), 1)
                   ]),
                   _: 2
                 }, 1032, ["appearance", "data-testid", "onClick"]))), 128))
@@ -181,7 +186,7 @@ const ke = ["tabindex"], Re = ["innerHTML"], Te = {
         ]),
         footer: f(() => [
           v("div", Se, [
-            a.clearButton ? (r(), y(I, {
+            a.clearButton ? (r(), y(U, {
               key: 0,
               appearance: "tertiary",
               class: "action-button",
@@ -193,12 +198,12 @@ const ke = ["tabindex"], Re = ["innerHTML"], Te = {
               ])]),
               _: 1
             })) : g("", !0),
-            p.value ? (r(), y(I, {
+            b.value ? (r(), y(U, {
               key: 1,
               appearance: "tertiary",
               class: "action-button",
               "data-testid": "datetime-picker-submit",
-              disabled: P.value || B.value,
+              disabled: P.value || K.value,
               onClick: l[5] || (l[5] = (i) => H())
             }, {
               default: f(() => [...l[7] || (l[7] = [

package/dist/kongponents.es99.js

@@ -5,8 +5,8 @@ import j from "./kongponents.es24.js";
 import G from "./kongponents.es53.js";
 import H from "./kongponents.es20.js";
 import J from "./kongponents.es43.js";
-import Q from "./kongponents.es177.js";
-import { KUI_SPACE_20 as W } from "./kongponents.es172.js";
+import Q from "./kongponents.es213.js";
+import { KUI_SPACE_20 as W } from "./kongponents.es177.js";
 const X = {
   class: "dropdown-list",
   "data-testid": "dropdown-list"