@kong/kongponents 9.61.0 → 9.61.1

package/dist/kongponents260.es.js

@@ -1,50 +1,227 @@
-import { defineComponent as h, useCssVars as f, computed as k, openBlock as t, createElementBlock as r, Fragment as s, renderList as c, createElementVNode as l, renderSlot as i, createVNode as n } from "vue";
-import d from "./kongponents67.es.js";
-import { KUI_SPACE_50 as C } from "./kongponents189.es.js";
-import { normalizeSize as p } from "./kongponents192.es.js";
-const _ = { class: "skeleton-card-wrapper" }, v = { class: "skeleton-card-header" }, w = { class: "skeleton-card-content" }, x = { class: "skeleton-card-footer" }, E = /* @__PURE__ */ h({
-  __name: "CardSkeleton",
+import { defineComponent as G, useCssVars as W, useAttrs as j, ref as p, useTemplateRef as P, computed as o, onMounted as z, resolveComponent as H, openBlock as y, createBlock as h, unref as S, withCtx as d, createElementVNode as k, createVNode as x, createTextVNode as C, renderSlot as J, createElementBlock as Q, createCommentVNode as X, toDisplayString as Y, mergeProps as Z, withModifiers as _, nextTick as ee } from "vue";
+import { KUI_SPACE_30 as te } from "./kongponents190.es.js";
+import le from "./kongponents62.es.js";
+import ae from "./kongponents55.es.js";
+import q from "./kongponents66.es.js";
+import ie from "./kongponents60.es.js";
+import oe from "./kongponents404.es.js";
+const re = {
+  class: "filter-content",
+  "data-testid": "filter-pill-content"
+}, ne = { class: "default-layout" }, ue = {
+  key: 0,
+  class: "operator"
+}, se = { class: "value" }, ce = { class: "footer" }, Ve = /* @__PURE__ */ G({
+  inheritAttrs: !1,
+  __name: "FilterPill",
   props: {
-    cardCount: {},
-    maxWidth: {}
+    filter: {},
+    initOpen: { type: Boolean, default: !1 },
+    selection: { default: () => {
+    } },
+    custom: { type: Boolean, default: !1 }
   },
-  setup(o) {
-    f((e) => ({
-      v2bf65be7: u.value
+  emits: ["apply", "close", "open", "clear"],
+  setup(e, { emit: A }) {
+    W((l) => ({
+      v7a84ec58: U.value
     }));
-    const u = k(() => o.maxWidth ? p(o.maxWidth) : o.cardCount === 1 ? "470px" : `calc((100% / 3) - ${C})`);
-    return (e, S) => (t(), r("div", _, [
-      (t(!0), r(s, null, c(o.cardCount, (m) => (t(), r("div", {
-        key: m,
-        class: "skeleton-card"
-      }, [
-        l("div", v, [
-          i(e.$slots, "card-header", {}, () => [
-            n(d, { width: "50" })
-          ], !0)
+    const B = j(), f = A, v = p(!1), b = P("filterPopper"), s = p(), r = p(), n = p(), u = p(), K = P("inputField"), c = o(() => e.custom ? "custom" : e.filter.options && !e.filter.multiple ? "select" : e.filter.options && e.filter.multiple ? "multiselect" : "input"), O = o(() => {
+      switch (c.value) {
+        case "input":
+          return !r.value || r.value === "";
+        case "select":
+          return !n.value;
+        case "multiselect":
+          return !u.value || u.value.length === 0;
+        default:
+          return !1;
+      }
+    }), V = o(() => e.filter.operators && e.filter.operators.length ? e.filter.operators : ["eq"]), U = o(() => V.value.some((l) => l === "lte" || l === "gte") ? "205px" : "120px"), E = o(() => {
+      let l, t;
+      switch (c.value) {
+        case "input":
+          l = r.value, t = r.value;
+          break;
+        case "select":
+          l = n.value, t = e.filter?.options?.find(({ value: a }) => a === n.value)?.label ?? n.value?.toString();
+          break;
+        case "multiselect":
+          l = u.value, t = u.value?.map((a) => e.filter.options?.find(({ value: i }) => i === a))?.filter((a) => a !== void 0)?.map(({ label: a }) => a)?.join(", ");
+          break;
+      }
+      if (!(s.value === void 0 || l === void 0 || t === void 0))
+        return {
+          operator: s.value,
+          value: l,
+          text: t
+        };
+    }), F = o(() => {
+      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 ": ";
+      }
+    }), g = o(() => {
+      const l = {
+        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 V.value.map((t) => ({
+        label: l[t],
+        value: t
+      }));
+    }), D = o(() => g.value.find(({ value: l }) => l === s.value)?.label ?? ""), I = () => {
+      c.value === "input" && K.value?.input?.focus();
+    }, M = () => {
+      s.value = e.selection?.operator ?? V.value?.[0], r.value = typeof e.selection?.value == "string" ? e.selection.value : void 0, n.value = e.filter.options?.find(({ value: l }) => l === e.selection?.value)?.value, u.value = e.filter.options?.filter(({ value: l }) => {
+        if (Array.isArray(e.selection?.value))
+          return e.selection.value.includes(`${l}`);
+      }).map(({ value: l }) => l);
+    }, w = async () => {
+      M(), b.value && (b.value.showPopover(), v.value = !0, await ee(), I()), f("open");
+    }, m = () => {
+      b.value && (b.value.hidePopover(), v.value = !1), f("close");
+    };
+    z(() => {
+      e.initOpen && w();
+    });
+    const N = () => {
+      v.value && m();
+    }, T = () => {
+      c.value === "custom" ? f("apply", void 0) : f("apply", E.value), m();
+    }, L = () => {
+      m();
+    }, R = () => {
+      m(), f("clear");
+    }, $ = () => {
+      v.value ? m() : w();
+    };
+    return (l, t) => {
+      const a = H("KButton");
+      return y(), h(le, {
+        ref: "filterPopper",
+        "max-width": e.filter.maxWidth ?? "400px",
+        offset: `var(--kui-space-30, ${S(te)})`,
+        placement: e.filter.placement ?? "bottom-start",
+        width: "auto",
+        onClose: N
+      }, {
+        default: d(() => [
+          x(oe, Z({
+            "content-label": e.selection?.text,
+            "data-testid": "filter-pill",
+            delimiter: F.value,
+            label: e.filter.label,
+            "pill-focus": v.value,
+            readonly: e.filter.readonly
+          }, S(B), {
+            onClear: R,
+            onClick: t[0] || (t[0] = _(() => {
+            }, ["prevent", "stop"])),
+            onTrigger: $
+          }), null, 16, ["content-label", "delimiter", "label", "pill-focus", "readonly"])
         ]),
-        l("div", w, [
-          i(e.$slots, "card-content", {}, () => [
-            (t(), r(s, null, c(3, (a) => n(d, {
-              key: a,
-              width: "100"
-            })), 64)),
-            n(d, { width: "50" })
-          ], !0)
+        title: d(() => [
+          C(Y(e.filter.label), 1)
         ]),
-        l("div", x, [
-          i(e.$slots, "card-footer", {}, () => [
-            (t(), r(s, null, c(2, (a) => n(d, {
-              key: a,
-              height: "2",
-              width: "5"
-            })), 64))
-          ], !0)
-        ])
-      ]))), 128))
-    ]));
+        content: d(() => [
+          k("div", re, [
+            J(l.$slots, "default", {}, () => [
+              k("div", ne, [
+                V.value.length > 1 ? (y(), Q("div", ue, [
+                  x(q, {
+                    modelValue: s.value,
+                    "onUpdate:modelValue": t[1] || (t[1] = (i) => s.value = i),
+                    items: g.value,
+                    "kpop-attributes": {
+                      popoverClasses: "force-operator-width"
+                    },
+                    label: "Operator",
+                    title: D.value
+                  }, null, 8, ["modelValue", "items", "title"])
+                ])) : X("", !0),
+                k("div", se, [
+                  c.value === "select" ? (y(), h(q, {
+                    key: 0,
+                    modelValue: n.value,
+                    "onUpdate:modelValue": t[2] || (t[2] = (i) => n.value = i),
+                    "data-testid": "filter-pill-select",
+                    items: e.filter.options,
+                    label: "Value",
+                    placeholder: "Select a value"
+                  }, null, 8, ["modelValue", "items"])) : c.value === "multiselect" ? (y(), h(ie, {
+                    key: 1,
+                    modelValue: u.value,
+                    "onUpdate:modelValue": t[3] || (t[3] = (i) => u.value = i),
+                    "data-testid": "filter-pill-multiselect",
+                    items: e.filter.options,
+                    label: "Value",
+                    placeholder: "Select values"
+                  }, null, 8, ["modelValue", "items"])) : (y(), h(ae, {
+                    key: 2,
+                    ref: "inputField",
+                    modelValue: r.value,
+                    "onUpdate:modelValue": t[4] || (t[4] = (i) => r.value = i),
+                    modelModifiers: { trim: !0 },
+                    "data-testid": "filter-pill-input",
+                    label: "Value",
+                    placeholder: "Enter a value"
+                  }, null, 8, ["modelValue"]))
+                ])
+              ])
+            ], !0)
+          ])
+        ]),
+        footer: d(() => [
+          k("div", ce, [
+            x(a, {
+              appearance: "secondary",
+              "data-testid": "filter-pill-cancel",
+              onClick: L
+            }, {
+              default: d(() => [...t[5] || (t[5] = [
+                C(" Cancel ", -1)
+              ])]),
+              _: 1
+            }),
+            x(a, {
+              appearance: "primary",
+              "data-testid": "filter-pill-apply",
+              disabled: O.value,
+              onClick: T
+            }, {
+              default: d(() => [...t[6] || (t[6] = [
+                C(" Apply ", -1)
+              ])]),
+              _: 1
+            }, 8, ["disabled"])
+          ])
+        ]),
+        _: 3
+      }, 8, ["max-width", "offset", "placement"]);
+    };
   }
 });
 export {
-  E as default
+  Ve as default
 };

package/dist/kongponents262.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),c=require("./kongponents67.cjs"),u={class:"skeleton-table-wrapper"},a=e.defineComponent({__name:"TableSkeleton",props:{rows:{},columns:{}},setup(n){e.useCssVars(t=>({v33b7f45f:t.columns}));const s=(t,l)=>t===1&&l===1||t!==1&&l!==1?"25":"50";return(t,l)=>(e.openBlock(),e.createElementBlock("div",u,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.rows,r=>(e.openBlock(),e.createElementBlock("div",{key:r,class:"skeleton-table-row"},[e.renderSlot(t.$slots,"default",{},()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.columns,o=>(e.openBlock(),e.createElementBlock("div",{key:o,class:"skeleton-cell-container"},[e.createVNode(c.default,{class:"skeleton-cell",width:s(o,r)},null,8,["width"])]))),128))],!0)]))),128))]))}});exports.default=a;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("vue");function i(e,n){return t.getCurrentScope()?(t.onScopeDispose(e,n),!0):!1}const c=typeof window<"u"&&typeof document<"u";typeof WorkerGlobalScope<"u"&&globalThis instanceof WorkerGlobalScope;const u=Object.prototype.toString,s=e=>u.call(e)==="[object Object]",a=()=>{};function f(e){return Array.isArray(e)?e:[e]}function r(e){return t.getCurrentInstance()}function p(e,n=!0,o){r()?t.onMounted(e,o):n?e():t.nextTick(e)}function d(e,n,o){return t.watch(e,n,{...o,immediate:!0})}exports.getLifeCycleTarget=r;exports.isClient=c;exports.isObject=s;exports.noop=a;exports.toArray=f;exports.tryOnMounted=p;exports.tryOnScopeDispose=i;exports.watchImmediate=d;

package/dist/kongponents262.es.js

@@ -1,36 +1,33 @@
-import { defineComponent as i, useCssVars as d, openBlock as t, createElementBlock as n, Fragment as a, renderList as c, renderSlot as m, createVNode as f } from "vue";
-import k from "./kongponents67.es.js";
-const p = { class: "skeleton-table-wrapper" }, b = /* @__PURE__ */ i({
-  __name: "TableSkeleton",
-  props: {
-    rows: {},
-    columns: {}
-  },
-  setup(s) {
-    d((e) => ({
-      v33b7f45f: e.columns
-    }));
-    const u = (e, r) => e === 1 && r === 1 || e !== 1 && r !== 1 ? "25" : "50";
-    return (e, r) => (t(), n("div", p, [
-      (t(!0), n(a, null, c(s.rows, (l) => (t(), n("div", {
-        key: l,
-        class: "skeleton-table-row"
-      }, [
-        m(e.$slots, "default", {}, () => [
-          (t(!0), n(a, null, c(s.columns, (o) => (t(), n("div", {
-            key: o,
-            class: "skeleton-cell-container"
-          }, [
-            f(k, {
-              class: "skeleton-cell",
-              width: u(o, l)
-            }, null, 8, ["width"])
-          ]))), 128))
-        ], !0)
-      ]))), 128))
-    ]));
-  }
-});
+import { watch as o, onMounted as r, nextTick as i, getCurrentScope as c, onScopeDispose as u, getCurrentInstance as s } from "vue";
+function d(e, t) {
+  return c() ? (u(e, t), !0) : !1;
+}
+const l = typeof window < "u" && typeof document < "u";
+typeof WorkerGlobalScope < "u" && globalThis instanceof WorkerGlobalScope;
+const f = Object.prototype.toString, y = (e) => f.call(e) === "[object Object]", g = () => {
+};
+function b(e) {
+  return Array.isArray(e) ? e : [e];
+}
+function p(e) {
+  return s();
+}
+function m(e, t = !0, n) {
+  p() ? r(e, n) : t ? e() : i(e);
+}
+function S(e, t, n) {
+  return o(e, t, {
+    ...n,
+    immediate: !0
+  });
+}
 export {
-  b as default
+  p as getLifeCycleTarget,
+  l as isClient,
+  y as isObject,
+  g as noop,
+  b as toArray,
+  m as tryOnMounted,
+  d as tryOnScopeDispose,
+  S as watchImmediate
 };

package/dist/kongponents263.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});function s(){return typeof window<"u"}function u(t){return w(t)?(t.nodeName||"").toLowerCase():"#document"}function r(t){var e;return(t==null||(e=t.ownerDocument)==null?void 0:e.defaultView)||window}function S(t){var e;return(e=(w(t)?t.ownerDocument:t.document)||window.document)==null?void 0:e.documentElement}function w(t){return s()?t instanceof Node||t instanceof r(t).Node:!1}function p(t){return s()?t instanceof Element||t instanceof r(t).Element:!1}function g(t){return s()?t instanceof HTMLElement||t instanceof r(t).HTMLElement:!1}function d(t){return!s()||typeof ShadowRoot>"u"?!1:t instanceof ShadowRoot||t instanceof r(t).ShadowRoot}function N(t){const{overflow:e,overflowX:i,overflowY:c,display:n}=b(t);return/auto|scroll|overlay|hidden|clip/.test(e+c+i)&&n!=="inline"&&n!=="contents"}function k(t){return/^(table|td|th)$/.test(u(t))}function T(t){try{if(t.matches(":popover-open"))return!0}catch{}try{return t.matches(":modal")}catch{return!1}}const O=/transform|translate|scale|rotate|perspective|filter/,R=/paint|layout|strict|content/,o=t=>!!t&&t!=="none";let a;function v(t){const e=p(t)?b(t):t;return o(e.transform)||o(e.translate)||o(e.scale)||o(e.rotate)||o(e.perspective)||!L()&&(o(e.backdropFilter)||o(e.filter))||O.test(e.willChange||"")||R.test(e.contain||"")}function W(t){let e=l(t);for(;g(e)&&!y(e);){if(v(e))return e;if(T(e))return null;e=l(e)}return null}function L(){return a==null&&(a=typeof CSS<"u"&&CSS.supports&&CSS.supports("-webkit-backdrop-filter","none")),a}function y(t){return/^(html|body|#document)$/.test(u(t))}function b(t){return r(t).getComputedStyle(t)}function A(t){return p(t)?{scrollLeft:t.scrollLeft,scrollTop:t.scrollTop}:{scrollLeft:t.scrollX,scrollTop:t.scrollY}}function l(t){if(u(t)==="html")return t;const e=t.assignedSlot||t.parentNode||d(t)&&t.host||S(t);return d(e)?e.host:e}function h(t){const e=l(t);return y(e)?t.ownerDocument?t.ownerDocument.body:t.body:g(e)&&N(e)?e:h(e)}function m(t,e,i){var c;e===void 0&&(e=[]),i===void 0&&(i=!0);const n=h(t),D=n===((c=t.ownerDocument)==null?void 0:c.body),f=r(n);if(D){const E=C(f);return e.concat(f,f.visualViewport||[],N(n)?n:[],E&&i?m(E):[])}else return e.concat(n,m(n,[],i))}function C(t){return t.parent&&Object.getPrototypeOf(t.parent)?t.frameElement:null}exports.getComputedStyle=b;exports.getContainingBlock=W;exports.getDocumentElement=S;exports.getFrameElement=C;exports.getNearestOverflowAncestor=h;exports.getNodeName=u;exports.getNodeScroll=A;exports.getOverflowAncestors=m;exports.getParentNode=l;exports.getWindow=r;exports.isContainingBlock=v;exports.isElement=p;exports.isHTMLElement=g;exports.isLastTraversableNode=y;exports.isNode=w;exports.isOverflowElement=N;exports.isShadowRoot=d;exports.isTableElement=k;exports.isTopLayer=T;exports.isWebKit=L;

package/dist/kongponents263.es.js

@@ -0,0 +1,136 @@
+function u() {
+  return typeof window < "u";
+}
+function a(t) {
+  return m(t) ? (t.nodeName || "").toLowerCase() : "#document";
+}
+function i(t) {
+  var n;
+  return (t == null || (n = t.ownerDocument) == null ? void 0 : n.defaultView) || window;
+}
+function L(t) {
+  var n;
+  return (n = (m(t) ? t.ownerDocument : t.document) || window.document) == null ? void 0 : n.documentElement;
+}
+function m(t) {
+  return u() ? t instanceof Node || t instanceof i(t).Node : !1;
+}
+function h(t) {
+  return u() ? t instanceof Element || t instanceof i(t).Element : !1;
+}
+function g(t) {
+  return u() ? t instanceof HTMLElement || t instanceof i(t).HTMLElement : !1;
+}
+function p(t) {
+  return !u() || typeof ShadowRoot > "u" ? !1 : t instanceof ShadowRoot || t instanceof i(t).ShadowRoot;
+}
+function y(t) {
+  const {
+    overflow: n,
+    overflowX: r,
+    overflowY: c,
+    display: e
+  } = b(t);
+  return /auto|scroll|overlay|hidden|clip/.test(n + c + r) && e !== "inline" && e !== "contents";
+}
+function _(t) {
+  return /^(table|td|th)$/.test(a(t));
+}
+function T(t) {
+  try {
+    if (t.matches(":popover-open"))
+      return !0;
+  } catch {
+  }
+  try {
+    return t.matches(":modal");
+  } catch {
+    return !1;
+  }
+}
+const v = /transform|translate|scale|rotate|perspective|filter/, C = /paint|layout|strict|content/, o = (t) => !!t && t !== "none";
+let s;
+function D(t) {
+  const n = h(t) ? b(t) : t;
+  return o(n.transform) || o(n.translate) || o(n.scale) || o(n.rotate) || o(n.perspective) || !R() && (o(n.backdropFilter) || o(n.filter)) || v.test(n.willChange || "") || C.test(n.contain || "");
+}
+function W(t) {
+  let n = f(t);
+  for (; g(n) && !N(n); ) {
+    if (D(n))
+      return n;
+    if (T(n))
+      return null;
+    n = f(n);
+  }
+  return null;
+}
+function R() {
+  return s == null && (s = typeof CSS < "u" && CSS.supports && CSS.supports("-webkit-backdrop-filter", "none")), s;
+}
+function N(t) {
+  return /^(html|body|#document)$/.test(a(t));
+}
+function b(t) {
+  return i(t).getComputedStyle(t);
+}
+function $(t) {
+  return h(t) ? {
+    scrollLeft: t.scrollLeft,
+    scrollTop: t.scrollTop
+  } : {
+    scrollLeft: t.scrollX,
+    scrollTop: t.scrollY
+  };
+}
+function f(t) {
+  if (a(t) === "html")
+    return t;
+  const n = (
+    // Step into the shadow DOM of the parent of a slotted node.
+    t.assignedSlot || // DOM Element detected.
+    t.parentNode || // ShadowRoot detected.
+    p(t) && t.host || // Fallback.
+    L(t)
+  );
+  return p(n) ? n.host : n;
+}
+function S(t) {
+  const n = f(t);
+  return N(n) ? t.ownerDocument ? t.ownerDocument.body : t.body : g(n) && y(n) ? n : S(n);
+}
+function w(t, n, r) {
+  var c;
+  n === void 0 && (n = []), r === void 0 && (r = !0);
+  const e = S(t), E = e === ((c = t.ownerDocument) == null ? void 0 : c.body), l = i(e);
+  if (E) {
+    const d = k(l);
+    return n.concat(l, l.visualViewport || [], y(e) ? e : [], d && r ? w(d) : []);
+  } else
+    return n.concat(e, w(e, [], r));
+}
+function k(t) {
+  return t.parent && Object.getPrototypeOf(t.parent) ? t.frameElement : null;
+}
+export {
+  b as getComputedStyle,
+  W as getContainingBlock,
+  L as getDocumentElement,
+  k as getFrameElement,
+  S as getNearestOverflowAncestor,
+  a as getNodeName,
+  $ as getNodeScroll,
+  w as getOverflowAncestors,
+  f as getParentNode,
+  i as getWindow,
+  D as isContainingBlock,
+  h as isElement,
+  g as isHTMLElement,
+  N as isLastTraversableNode,
+  m as isNode,
+  y as isOverflowElement,
+  p as isShadowRoot,
+  _ as isTableElement,
+  T as isTopLayer,
+  R as isWebKit
+};

package/dist/kongponents264.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),t=require("./kongponents67.cjs"),r={class:"skeleton-form-wrapper"},n=e.defineComponent({__name:"FormSkeleton",setup(l){return(c,s)=>(e.openBlock(),e.createElementBlock("div",r,[(e.openBlock(),e.createElementBlock(e.Fragment,null,e.renderList(4,o=>e.createElementVNode("div",{key:o,class:"skeleton-form-row"},[e.createVNode(t.default,{height:"2",width:"10"}),e.createVNode(t.default,{height:"2",width:"100"})])),64))]))}});exports.default=n;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./kongponents219.cjs");exports.default=e.default;

package/dist/kongponents264.es.js

@@ -1,25 +1,4 @@
-import { defineComponent as s, openBlock as e, createElementBlock as t, Fragment as c, renderList as l, createElementVNode as m, createVNode as o } from "vue";
-import r from "./kongponents67.es.js";
-const a = { class: "skeleton-form-wrapper" }, f = /* @__PURE__ */ s({
-  __name: "FormSkeleton",
-  setup(i) {
-    return (d, p) => (e(), t("div", a, [
-      (e(), t(c, null, l(4, (n) => m("div", {
-        key: n,
-        class: "skeleton-form-row"
-      }, [
-        o(r, {
-          height: "2",
-          width: "10"
-        }),
-        o(r, {
-          height: "2",
-          width: "100"
-        })
-      ])), 64))
-    ]));
-  }
-});
+import f from "./kongponents219.es.js";
 export {
   f as default
 };

package/dist/kongponents266.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),s=require("./kongponents346.cjs"),a={class:"fullscreen-loading-container","data-testid":"full-screen-loader"},c=["src"],u={key:0,class:"progress"},d=e.defineComponent({__name:"FullScreenKongSkeleton",props:{progress:{},hideProgress:{type:Boolean},zIndex:{}},setup(t){e.useCssVars(l=>({v4d434712:l.zIndex}));const n=e.ref(0),r=e.ref(0),o=e.computed(()=>t.progress!==null?t.progress:r.value);return e.onMounted(()=>{t.progress||(n.value=setInterval(()=>{r.value>=100&&(clearInterval(n.value),r.value=100),r.value=Math.min(r.value+Math.ceil(Math.random()*10*30),100)},200))}),e.onUnmounted(()=>{clearInterval(n.value)}),(l,i)=>(e.openBlock(),e.createElementBlock("div",a,[e.createElementVNode("div",null,[e.createElementVNode("img",{alt:"Loading",src:e.unref(s.default)},null,8,c),t.hideProgress?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",u,[e.createElementVNode("div",{class:"progress-bar",role:"progressbar",style:e.normalizeStyle({width:`${o.value}%`}),title:"Loading"},null,4)]))])]))}});exports.default=d;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),n=require("./kongponents270.cjs"),o=require("./kongponents185.cjs"),a=require("./kongponents203.cjs"),l=require("./kongponents190.cjs"),s=require("./kongponents183.cjs"),c=["aria-current","data-testid"],i={class:"step-circle"},u={key:3,class:"step-number"},d=["title"],m=e.defineComponent({__name:"KStep",props:{label:{},state:{default:"default"},maxLabelWidth:{},stepNumber:{}},setup(t){const r=e.computed(()=>({maxWidth:s.normalizeSize(t.maxLabelWidth)}));return(k,f)=>(e.openBlock(),e.createElementBlock("li",{"aria-current":t.state==="active"?"step":"false",class:"step","data-testid":`step-${t.state}`},[e.createElementVNode("div",{class:e.normalizeClass(["step-container",`${t.state}`])},[e.createElementVNode("div",i,[t.state==="completed"?(e.openBlock(),e.createBlock(e.unref(n.default),{key:0,color:`var(--kui-color-text-inverse, ${e.unref(l.KUI_COLOR_TEXT_INVERSE)})`,size:`var(--kui-icon-size-40, ${e.unref(l.KUI_ICON_SIZE_40)})`,title:"Completed"},null,8,["color","size"])):t.state==="pending"?(e.openBlock(),e.createBlock(e.unref(a.default),{key:1,color:`var(--kui-color-text-primary, ${e.unref(l.KUI_COLOR_TEXT_PRIMARY)})`,size:`var(--kui-icon-size-40, ${e.unref(l.KUI_ICON_SIZE_40)})`,title:"Pending"},null,8,["color","size"])):t.state==="error"?(e.openBlock(),e.createBlock(e.unref(o.default),{key:2,color:`var(--kui-color-text-inverse, ${e.unref(l.KUI_COLOR_TEXT_INVERSE)})`,size:`var(--kui-icon-size-40, ${e.unref(l.KUI_ICON_SIZE_40)})`,title:"Error"},null,8,["color","size"])):t.stepNumber?(e.openBlock(),e.createElementBlock("span",u,e.toDisplayString(t.stepNumber),1)):e.createCommentVNode("",!0)]),e.createElementVNode("span",{class:"step-label",style:e.normalizeStyle(r.value),title:t.label},e.toDisplayString(t.label),13,d)],2)],8,c))}});exports.default=m;

package/dist/kongponents266.es.js

@@ -1,47 +1,59 @@
-import { defineComponent as d, useCssVars as i, ref as s, computed as u, onMounted as m, onUnmounted as g, openBlock as l, createElementBlock as a, createElementVNode as o, unref as v, normalizeStyle as p, createCommentVNode as f } from "vue";
-import h from "./kongponents346.es.js";
-const I = {
-  class: "fullscreen-loading-container",
-  "data-testid": "full-screen-loader"
-}, _ = ["src"], k = {
-  key: 0,
-  class: "progress"
-}, z = /* @__PURE__ */ d({
-  __name: "FullScreenKongSkeleton",
+import { defineComponent as m, computed as u, openBlock as a, createElementBlock as o, createElementVNode as i, normalizeClass as d, createBlock as l, unref as t, toDisplayString as s, createCommentVNode as f, normalizeStyle as k } from "vue";
+import z from "./kongponents270.es.js";
+import v from "./kongponents185.es.js";
+import b from "./kongponents203.es.js";
+import { KUI_ICON_SIZE_40 as r, KUI_COLOR_TEXT_INVERSE as c, KUI_COLOR_TEXT_PRIMARY as p } from "./kongponents190.es.js";
+import { normalizeSize as y } from "./kongponents183.es.js";
+const E = ["aria-current", "data-testid"], $ = { class: "step-circle" }, h = {
+  key: 3,
+  class: "step-number"
+}, x = ["title"], L = /* @__PURE__ */ m({
+  __name: "KStep",
   props: {
-    progress: {},
-    hideProgress: { type: Boolean },
-    zIndex: {}
+    label: {},
+    state: { default: "default" },
+    maxLabelWidth: {},
+    stepNumber: {}
   },
-  setup(r) {
-    i((t) => ({
-      v4d434712: t.zIndex
+  setup(e) {
+    const n = u(() => ({
+      maxWidth: y(e.maxLabelWidth)
     }));
-    const n = s(0), e = s(0), c = u(() => r.progress !== null ? r.progress : e.value);
-    return m(() => {
-      r.progress || (n.value = setInterval(() => {
-        e.value >= 100 && (clearInterval(n.value), e.value = 100), e.value = Math.min(e.value + Math.ceil(Math.random() * 10 * 30), 100);
-      }, 200));
-    }), g(() => {
-      clearInterval(n.value);
-    }), (t, x) => (l(), a("div", I, [
-      o("div", null, [
-        o("img", {
-          alt: "Loading",
-          src: v(h)
-        }, null, 8, _),
-        r.hideProgress ? f("", !0) : (l(), a("div", k, [
-          o("div", {
-            class: "progress-bar",
-            role: "progressbar",
-            style: p({ width: `${c.value}%` }),
-            title: "Loading"
-          }, null, 4)
-        ]))
-      ])
-    ]));
+    return (C, I) => (a(), o("li", {
+      "aria-current": e.state === "active" ? "step" : "false",
+      class: "step",
+      "data-testid": `step-${e.state}`
+    }, [
+      i("div", {
+        class: d(["step-container", `${e.state}`])
+      }, [
+        i("div", $, [
+          e.state === "completed" ? (a(), l(t(z), {
+            key: 0,
+            color: `var(--kui-color-text-inverse, ${t(c)})`,
+            size: `var(--kui-icon-size-40, ${t(r)})`,
+            title: "Completed"
+          }, null, 8, ["color", "size"])) : e.state === "pending" ? (a(), l(t(b), {
+            key: 1,
+            color: `var(--kui-color-text-primary, ${t(p)})`,
+            size: `var(--kui-icon-size-40, ${t(r)})`,
+            title: "Pending"
+          }, null, 8, ["color", "size"])) : e.state === "error" ? (a(), l(t(v), {
+            key: 2,
+            color: `var(--kui-color-text-inverse, ${t(c)})`,
+            size: `var(--kui-icon-size-40, ${t(r)})`,
+            title: "Error"
+          }, null, 8, ["color", "size"])) : e.stepNumber ? (a(), o("span", h, s(e.stepNumber), 1)) : f("", !0)
+        ]),
+        i("span", {
+          class: "step-label",
+          style: k(n.value),
+          title: e.label
+        }, s(e.label), 13, x)
+      ], 2)
+    ], 8, E));
   }
 });
 export {
-  z as default
+  L as default
 };