@krds.ui/vue 0.0.15 → 0.0.16

package/dist/krds-vue.es.js

@@ -1,13 +1,13 @@
-import { Teleport as ke, computed as g, defineComponent as D, getCurrentInstance as Se, h as t, inject as Ke, nextTick as ue, onBeforeUnmount as Q, onMounted as N, onUnmounted as q, provide as we, ref as _, useId as O, vShow as X, watch as G, withDirectives as W, withModifiers as J } from "vue";
-var se = Object.defineProperty, ce = (e, l) => {
+import { Comment as je, Fragment as Ge, Teleport as Ce, Text as Ue, computed as b, defineComponent as A, getCurrentInstance as xe, h as t, inject as Xe, nextTick as ce, onBeforeUnmount as fe, onMounted as ie, onUnmounted as re, provide as Qe, ref as B, useId as de, vShow as pe, watch as se, withDirectives as ve, withModifiers as ge } from "vue";
+var be = Object.defineProperty, Je = (e, a) => {
   let r = {};
-  for (var a in e)
-    se(r, a, {
-      get: e[a],
+  for (var l in e)
+    be(r, l, {
+      get: e[l],
       enumerable: !0
     });
-  return l || se(r, Symbol.toStringTag, { value: "Module" }), r;
-}, fe = D({
+  return a || be(r, Symbol.toStringTag, { value: "Module" }), r;
+}, $e = A({
   name: "KrdsButton",
   props: {
     type: {
@@ -48,27 +48,27 @@ var se = Object.defineProperty, ce = (e, l) => {
     }
   },
   emits: ["click"],
-  setup(e, { emit: l, slots: r }) {
-    const a = g(() => {
+  setup(e, { emit: a, slots: r }) {
+    const l = b(() => {
       const s = ["krds-btn"];
       return e.icon && s.push("icon"), e.border && s.push("border"), e.pure && s.push("pure"), e.text && s.push("text"), e.variant && !e.icon && s.push(e.variant), e.size && s.push(e.size), e.class && s.push(e.class), s;
     }), n = (s) => {
-      e.disabled || l("click", s);
+      e.disabled || a("click", s);
     };
     return () => t("button", {
       type: e.type,
-      class: a.value,
+      class: l.value,
       disabled: e.disabled,
       onClick: n
     }, r.default?.());
   }
-}), Ce = fe, xe = D({
+}), Ze = $e, et = A({
   name: "KrdsButtonGroup",
   props: {},
-  setup(e, { slots: l }) {
-    return () => t("div", { class: "btn-group" }, l.default?.());
+  setup(e, { slots: a }) {
+    return () => t("div", { class: "btn-group" }, a.default?.());
   }
-}), $e = D({
+}), tt = A({
   name: "KrdsIcon",
   props: {
     name: {
@@ -87,7 +87,7 @@ var se = Object.defineProperty, ce = (e, l) => {
       e.class
     ].filter(Boolean).join(" ") });
   }
-}), Be = D({
+}), at = A({
   name: "KrdsLink",
   props: {
     href: {
@@ -124,25 +124,25 @@ var se = Object.defineProperty, ce = (e, l) => {
     }
   },
   emits: ["click"],
-  setup(e, { emit: l, slots: r }) {
-    const a = g(() => {
-      const d = ["krds-btn"];
-      return e.size && d.push(e.size), e.link && d.push("link"), e.basic && d.push("basic"), e.pure && d.push("pure"), e.class && d.push(e.class), d;
-    }), n = g(() => {
-      const d = {
+  setup(e, { emit: a, slots: r }) {
+    const l = b(() => {
+      const u = ["krds-btn"];
+      return e.size && u.push(e.size), e.link && u.push("link"), e.basic && u.push("basic"), e.pure && u.push("pure"), e.class && u.push(e.class), u;
+    }), n = b(() => {
+      const u = {
         href: e.href,
-        class: a.value
+        class: l.value
       };
-      return e.target && (d.target = e.target), e.title && (d.title = e.title), e.target === "_blank" && (d.rel = "noopener noreferrer"), d;
-    }), s = (d) => {
-      l("click", d);
+      return e.target && (u.target = e.target), e.title && (u.title = e.title), e.target === "_blank" && (u.rel = "noopener noreferrer"), u;
+    }), s = (u) => {
+      a("click", u);
     };
     return () => t("a", {
       ...n.value,
       onClick: s
     }, r.default?.());
   }
-}), ve = D({
+}), Le = A({
   name: "KrdsSpinner",
   props: { label: {
     type: String,
@@ -155,7 +155,7 @@ var se = Object.defineProperty, ce = (e, l) => {
       role: "status"
     }, e);
   }
-}), Le = D({
+}), lt = A({
   name: "KrdsInput",
   props: {
     modelValue: {
@@ -252,27 +252,27 @@ var se = Object.defineProperty, ce = (e, l) => {
     "keydown",
     "keyup"
   ],
-  setup(e, { emit: l, slots: r }) {
-    const a = g(() => {
-      const y = ["krds-input"];
-      return e.size && y.push(e.size), e.class && y.push(e.class), y;
-    }), n = (y) => {
-      const k = y.target;
-      l("update:modelValue", e.type === "number" ? Number(k.value) : k.value), l("input", y);
-    }, s = (y) => {
-      l("change", y);
-    }, d = (y) => {
-      l("focus", y);
-    }, h = (y) => {
-      l("blur", y);
-    }, f = (y) => {
-      l("keydown", y);
-    }, S = (y) => {
-      l("keyup", y);
-    }, p = g(() => {
-      const y = {
+  setup(e, { emit: a, slots: r }) {
+    const l = b(() => {
+      const S = ["krds-input"];
+      return e.size && S.push(e.size), e.class && S.push(e.class), S;
+    }), n = (S) => {
+      const x = S.target;
+      a("update:modelValue", e.type === "number" ? Number(x.value) : x.value), a("input", S);
+    }, s = (S) => {
+      a("change", S);
+    }, u = (S) => {
+      a("focus", S);
+    }, h = (S) => {
+      a("blur", S);
+    }, f = (S) => {
+      a("keydown", S);
+    }, w = (S) => {
+      a("keyup", S);
+    }, m = b(() => {
+      const S = {
         type: e.type,
-        class: a.value,
+        class: l.value,
         value: e.modelValue,
         placeholder: e.placeholder,
         name: e.name,
@@ -284,22 +284,22 @@ var se = Object.defineProperty, ce = (e, l) => {
         autofocus: e.autofocus,
         onInput: n,
         onChange: s,
-        onFocus: d,
+        onFocus: u,
         onBlur: h,
         onKeydown: f,
-        onKeyup: S
+        onKeyup: w
       };
-      return e.maxlength !== void 0 && (y.maxlength = e.maxlength), e.minlength !== void 0 && (y.minlength = e.minlength), e.type === "number" && (e.max !== void 0 && (y.max = e.max), e.min !== void 0 && (y.min = e.min), e.step !== void 0 && (y.step = e.step)), y;
-    }), C = g(() => {
-      const y = ["form-conts"];
-      return e.state !== "default" && y.push(`is-${e.state}`), e.icon && y.push("btn-ico-wrap"), y;
+      return e.maxlength !== void 0 && (S.maxlength = e.maxlength), e.minlength !== void 0 && (S.minlength = e.minlength), e.type === "number" && (e.max !== void 0 && (S.max = e.max), e.min !== void 0 && (S.min = e.min), e.step !== void 0 && (S.step = e.step)), S;
+    }), T = b(() => {
+      const S = ["form-conts"];
+      return e.state !== "default" && S.push(`is-${e.state}`), e.icon && S.push("btn-ico-wrap"), S;
     });
     return () => {
-      const y = [t("input", p.value)];
-      return e.loading ? t("div", { class: C.value }, [t("div", { class: "form-spinner" }, [...y, t(ve)])]) : (r.default && y.push(...r.default()), t("div", { class: C.value }, y));
+      const S = [t("input", m.value)];
+      return e.loading ? t("div", { class: T.value }, [t("div", { class: "form-spinner" }, [...S, t(Le)])]) : (r.default && S.push(...r.default()), t("div", { class: T.value }, S));
     };
   }
-}), De = Le, _e = D({
+}), nt = lt, st = A({
   name: "KrdsFormLabel",
   props: {
     for: {
@@ -320,19 +320,19 @@ var se = Object.defineProperty, ce = (e, l) => {
     }
   },
   emits: ["click"],
-  setup(e, { emit: l, slots: r }) {
-    const a = (n) => {
-      l("click", n);
+  setup(e, { emit: a, slots: r }) {
+    const l = (n) => {
+      a("click", n);
     };
     return () => t("div", { class: "form-tit" }, [t("label", {
       for: e.for,
       id: e.id,
       class: e.class,
       style: e.style,
-      onClick: a
+      onClick: l
     }, r.default?.())]);
   }
-}), Te = _e, Ve = D({
+}), rt = st, it = A({
   name: "KrdsFormHint",
   props: {
     type: {
@@ -353,9 +353,9 @@ var se = Object.defineProperty, ce = (e, l) => {
     }
   },
   emits: ["click"],
-  setup(e, { emit: l, slots: r }) {
-    const a = (s) => {
-      l("click", s);
+  setup(e, { emit: a, slots: r }) {
+    const l = (s) => {
+      a("click", s);
     }, n = () => {
       let s;
       switch (e.type) {
@@ -377,10 +377,10 @@ var se = Object.defineProperty, ce = (e, l) => {
       id: e.id,
       class: n(),
       style: e.style,
-      onClick: a
+      onClick: l
     }, r.default?.());
   }
-}), Ee = Ve, ze = D({
+}), ot = it, dt = A({
   name: "KrdsFormGroup",
   props: {
     class: {
@@ -396,93 +396,93 @@ var se = Object.defineProperty, ce = (e, l) => {
       default: void 0
     }
   },
-  setup(e, { slots: l }) {
-    const r = g(() => {
-      const a = ["form-group"];
-      return e.class && a.push(e.class), a;
+  setup(e, { slots: a }) {
+    const r = b(() => {
+      const l = ["form-group"];
+      return e.class && l.push(e.class), l;
     });
     return () => t("div", {
       id: e.id,
       class: r.value,
       style: e.style
-    }, l.default?.());
+    }, a.default?.());
   }
-}), Ie = ze;
-function Ae(e, l) {
-  const r = /* @__PURE__ */ new Date(), a = _(e || r.getFullYear()), n = _(l || r.getMonth() + 1), s = _(null), d = _(null), h = _(null), f = g(() => {
-    const i = r.getFullYear(), v = [];
-    for (let m = i - 10; m <= i + 10; m++) v.push(m);
-    return v;
-  }), S = g(() => Array.from({ length: 12 }, (i, v) => v + 1)), p = () => {
-    s.value = null, d.value = null;
-  }, C = () => {
-    n.value === 1 ? (n.value = 12, a.value -= 1) : n.value -= 1;
-  }, y = () => {
-    n.value === 12 ? (n.value = 1, a.value += 1) : n.value += 1;
-  }, k = (i, v = !1) => {
-    if (v)
-      s.value = i, d.value = i;
-    else if (!s.value || s.value && d.value)
-      s.value = i, d.value = null;
+}), ut = dt;
+function ct(e, a) {
+  const r = /* @__PURE__ */ new Date(), l = B(e || r.getFullYear()), n = B(a || r.getMonth() + 1), s = B(null), u = B(null), h = B(null), f = b(() => {
+    const i = r.getFullYear(), p = [];
+    for (let y = i - 10; y <= i + 10; y++) p.push(y);
+    return p;
+  }), w = b(() => Array.from({ length: 12 }, (i, p) => p + 1)), m = () => {
+    s.value = null, u.value = null;
+  }, T = () => {
+    n.value === 1 ? (n.value = 12, l.value -= 1) : n.value -= 1;
+  }, S = () => {
+    n.value === 12 ? (n.value = 1, l.value += 1) : n.value += 1;
+  }, x = (i, p = !1) => {
+    if (p)
+      s.value = i, u.value = i;
+    else if (!s.value || s.value && u.value)
+      s.value = i, u.value = null;
     else {
-      const m = new Date(s.value.replace(/\./g, "-"));
-      new Date(i.replace(/\./g, "-")) < m ? (s.value = i, d.value = null) : d.value = i;
+      const y = new Date(s.value.replace(/\./g, "-"));
+      new Date(i.replace(/\./g, "-")) < y ? (s.value = i, u.value = null) : u.value = i;
     }
   };
   return {
-    currentYear: a,
+    currentYear: l,
     currentMonth: n,
     selectedStartDate: s,
-    selectedEndDate: d,
+    selectedEndDate: u,
     activeDateSelector: h,
     yearOptions: f,
-    monthOptions: S,
-    clearDateSelection: p,
-    prevMonth: C,
-    nextMonth: y,
-    handleDateSelection: k,
+    monthOptions: w,
+    clearDateSelection: m,
+    prevMonth: T,
+    nextMonth: S,
+    handleDateSelection: x,
     selectToday: () => {
       const i = `${r.getFullYear()}.${String(r.getMonth() + 1).padStart(2, "0")}.${String(r.getDate()).padStart(2, "0")}`;
-      k(i, !0);
+      x(i, !0);
     },
     isDateInSelectedRange: (i) => {
-      if (!s.value || !d.value) return {
+      if (!s.value || !u.value) return {
         isInRange: !1,
         isStart: !1,
         isEnd: !1
       };
-      const v = new Date(i.replace(/\./g, "-")), m = new Date(s.value.replace(/\./g, "-")), K = new Date(d.value.replace(/\./g, "-")), b = i === s.value, w = i === d.value;
+      const p = new Date(i.replace(/\./g, "-")), y = new Date(s.value.replace(/\./g, "-")), $ = new Date(u.value.replace(/\./g, "-")), C = i === s.value, E = i === u.value;
       return {
-        isInRange: v >= m && v <= K,
-        isStart: b,
-        isEnd: w
+        isInRange: p >= y && p <= $,
+        isStart: C,
+        isEnd: E
       };
     }
   };
 }
-function Fe(e, l, r = {}) {
-  let a = null;
-  const { ignore: n, event: s = "click" } = typeof r == "string" ? { ignore: r } : r, d = () => {
-    a = (f) => {
-      const S = f.target;
-      e.value?.contains(S) || n && S.closest(n) || l();
-    }, document.addEventListener(s, a);
+function ft(e, a, r = {}) {
+  let l = null;
+  const { ignore: n, event: s = "click" } = typeof r == "string" ? { ignore: r } : r, u = () => {
+    l = (f) => {
+      const w = f.target;
+      e.value?.contains(w) || n && w.closest(n) || a();
+    }, document.addEventListener(s, l);
   }, h = () => {
-    if (a) {
+    if (l) {
       const f = typeof r == "string" ? "click" : r.event || "click";
-      document.removeEventListener(f, a), a = null;
+      document.removeEventListener(f, l), l = null;
     }
   };
-  return N(() => {
-    d();
-  }), Q(() => {
+  return ie(() => {
+    u();
+  }), fe(() => {
     h();
   }), {
-    setupGlobalListeners: d,
+    setupGlobalListeners: u,
     removeGlobalListeners: h
   };
 }
-var Me = [
+var vt = [
   "일",
   "월",
   "화",
@@ -490,7 +490,7 @@ var Me = [
   "목",
   "금",
   "토"
-], Pe = D({
+], pt = A({
   name: "KrdsDateInput",
   props: {
     modelValue: {
@@ -561,51 +561,51 @@ var Me = [
     "focus",
     "blur"
   ],
-  setup(e, { emit: l }) {
-    const r = _(), a = _(), n = _(!1), s = _(null), { currentYear: d, currentMonth: h, selectedStartDate: f, selectedEndDate: S, yearOptions: p, monthOptions: C, prevMonth: y, nextMonth: k, handleDateSelection: u, selectToday: o, isDateInSelectedRange: i } = Ae(e.initialYear, e.initialMonth), v = () => {
-      n.value && a.value?.focus(), n.value = !1, s.value = null;
+  setup(e, { emit: a }) {
+    const r = B(), l = B(), n = B(!1), s = B(null), { currentYear: u, currentMonth: h, selectedStartDate: f, selectedEndDate: w, yearOptions: m, monthOptions: T, prevMonth: S, nextMonth: x, handleDateSelection: c, selectToday: o, isDateInSelectedRange: i } = ct(e.initialYear, e.initialMonth), p = () => {
+      n.value && l.value?.focus(), n.value = !1, s.value = null;
     };
-    Fe(r, v, ".calendar-conts");
-    const m = g(() => {
-      const $ = [
+    ft(r, p, ".calendar-conts");
+    const y = b(() => {
+      const L = [
         "krds-input",
         "datepicker",
         "cal"
       ];
-      return e.size && $.push(e.size), e.class && $.push(e.class), $;
-    }), K = g(() => ["form-conts", "calendar-conts"]), b = g(() => ({
+      return e.size && L.push(e.size), e.class && L.push(e.class), L;
+    }), $ = b(() => ["form-conts", "calendar-conts"]), C = b(() => ({
       "krds-calendar-area": !0,
       active: n.value
-    })), w = g(() => {
-      const $ = d.value, T = h.value, F = new Date($, T - 1, 1), R = new Date(F);
-      R.setDate(R.getDate() - F.getDay());
-      const H = [], z = new Date(R);
-      for (let te = 0; te < 6; te++) {
-        const ae = [];
-        for (let le = 0; le < 7; le++) {
-          const be = `${z.getFullYear()}.${String(z.getMonth() + 1).padStart(2, "0")}.${String(z.getDate()).padStart(2, "0")}`, ne = z.getDay();
-          ae.push({
+    })), E = b(() => {
+      const L = u.value, R = h.value, Y = new Date(L, R - 1, 1), V = new Date(Y);
+      V.setDate(V.getDate() - Y.getDay());
+      const F = [], z = new Date(V);
+      for (let O = 0; O < 6; O++) {
+        const U = [];
+        for (let J = 0; J < 7; J++) {
+          const ee = `${z.getFullYear()}.${String(z.getMonth() + 1).padStart(2, "0")}.${String(z.getDate()).padStart(2, "0")}`, oe = z.getDay();
+          U.push({
             day: z.getDate(),
-            dateString: be,
-            isCurrentMonth: z.getMonth() === T - 1,
+            dateString: ee,
+            isCurrentMonth: z.getMonth() === R - 1,
             isToday: z.toDateString() === (/* @__PURE__ */ new Date()).toDateString(),
-            isPrevMonth: z.getMonth() < T - 1 || z.getMonth() === 11 && T === 1,
-            isNextMonth: z.getMonth() > T - 1 || z.getMonth() === 0 && T === 12,
-            isSunday: ne === 0,
-            isSaturday: ne === 6
+            isPrevMonth: z.getMonth() < R - 1 || z.getMonth() === 11 && R === 1,
+            isNextMonth: z.getMonth() > R - 1 || z.getMonth() === 0 && R === 12,
+            isSunday: oe === 0,
+            isSaturday: oe === 6
           }), z.setDate(z.getDate() + 1);
         }
-        H.push(ae);
+        F.push(U);
       }
-      return H;
-    }), x = ($) => {
-      const T = [];
-      if ($.isPrevMonth && T.push("old"), $.isNextMonth && T.push("new"), $.isToday && T.push("today"), $.isSunday && T.push("day-off"), e.holidays?.includes($.dateString) && T.push("day-off"), e.eventDates?.includes($.dateString) && T.push("day-event"), $.isCurrentMonth) {
-        const F = i($.dateString);
-        F.isInRange && (T.push("period"), F.isStart && T.push("start"), F.isEnd && T.push("end"));
+      return F;
+    }), D = (L) => {
+      const R = [];
+      if (L.isPrevMonth && R.push("old"), L.isNextMonth && R.push("new"), L.isToday && R.push("today"), L.isSunday && R.push("day-off"), e.holidays?.includes(L.dateString) && R.push("day-off"), e.eventDates?.includes(L.dateString) && R.push("day-event"), L.isCurrentMonth) {
+        const Y = i(L.dateString);
+        Y.isInRange && (R.push("period"), Y.isStart && R.push("start"), Y.isEnd && R.push("end"));
       }
-      return T;
-    }, L = g(() => [
+      return R;
+    }, _ = b(() => [
       {
         id: "get-today",
         label: "오늘",
@@ -620,7 +620,7 @@ var Me = [
         class: void 0,
         variant: "tertiary",
         size: "small",
-        handler: v
+        handler: p
       },
       {
         id: "confirm-btn",
@@ -628,64 +628,64 @@ var Me = [
         class: void 0,
         variant: "primary",
         size: "small",
-        handler: I
+        handler: N
       }
-    ]), c = ($) => {
-      s.value === $ ? s.value = null : s.value = $;
-    }, B = ($) => {
-      d.value = $, s.value = null;
-    }, V = ($) => {
-      h.value = $, s.value = null;
-    }, I = () => {
-      f.value && (S.value && f.value !== S.value ? l("update:modelValue", `${f.value} ~ ${S.value}`) : l("update:modelValue", f.value), v());
-    }, E = () => {
+    ]), v = (L) => {
+      s.value === L ? s.value = null : s.value = L;
+    }, M = (L) => {
+      u.value = L, s.value = null;
+    }, I = (L) => {
+      h.value = L, s.value = null;
+    }, N = () => {
+      f.value && (w.value && f.value !== w.value ? a("update:modelValue", `${f.value} ~ ${w.value}`) : a("update:modelValue", f.value), p());
+    }, H = () => {
       n.value = !0, s.value = null, setTimeout(() => {
         r.value?.querySelector(".calendar-wrap")?.focus();
       }, 50);
-    }, M = () => {
-      n.value ? v() : E();
-    }, A = ($) => {
-      $.code === "Escape" && (s.value ? s.value = null : n.value && v());
-    }, P = ($) => {
-      const T = $.target;
-      l("update:modelValue", T.value), l("input", $);
-    }, j = ($) => {
-      l("change", $);
-    }, me = ($) => {
-      l("focus", $);
-    }, ge = ($) => {
-      l("blur", $);
-    }, ee = ($) => {
-      const T = $ === "year", F = T ? p.value : C.value, R = T ? d.value : h.value, H = (z) => T ? `${z}년` : `${z.toString().padStart(2, "0")}월`;
+    }, G = () => {
+      n.value ? p() : H();
+    }, j = (L) => {
+      L.code === "Escape" && (s.value ? s.value = null : n.value && p());
+    }, X = (L) => {
+      const R = L.target;
+      a("update:modelValue", R.value), a("input", L);
+    }, le = (L) => {
+      a("change", L);
+    }, ue = (L) => {
+      a("focus", L);
+    }, ae = (L) => {
+      a("blur", L);
+    }, Q = (L) => {
+      const R = L === "year", Y = R ? m.value : T.value, V = R ? u.value : h.value, F = (z) => R ? `${z}년` : `${z.toString().padStart(2, "0")}월`;
       return t("div", { class: "calendar-drop-down" }, [t("button", {
         type: "button",
-        class: `btn-cal-switch ${$}`,
-        "aria-label": T ? "연도 선택" : "월 선택",
-        "aria-expanded": s.value === $,
-        onClick: () => c($)
-      }, H(R)), W(t("div", { class: `calendar-select ${T ? "calendar-year-wrap" : "calendar-mon-wrap"}` }, [t("ul", { class: `sel ${$}` }, F.map((z) => t("li", { key: z }, [t("button", {
+        class: `btn-cal-switch ${L}`,
+        "aria-label": R ? "연도 선택" : "월 선택",
+        "aria-expanded": s.value === L,
+        onClick: () => v(L)
+      }, F(V)), ve(t("div", { class: `calendar-select ${R ? "calendar-year-wrap" : "calendar-mon-wrap"}` }, [t("ul", { class: `sel ${L}` }, Y.map((z) => t("li", { key: z }, [t("button", {
         type: "button",
-        class: { active: z === R },
-        onClick: () => T ? B(z) : V(z)
-      }, H(z))])))]), [[X, s.value === $]])]);
-    }, ye = () => t("table", { class: "calendar-tbl" }, [
-      t("caption", null, `${d.value}년 ${h.value.toString().padStart(2, "0")}월`),
-      t("thead", null, [t("tr", null, Me.map(($) => t("th", null, $)))]),
-      t("tbody", null, w.value.map(($, T) => t("tr", { key: T }, $.map((F, R) => t("td", {
-        key: R,
-        class: x(F),
-        "data-date": F.dateString
+        class: { active: z === V },
+        onClick: () => R ? M(z) : I(z)
+      }, F(z))])))]), [[pe, s.value === L]])]);
+    }, ne = () => t("table", { class: "calendar-tbl" }, [
+      t("caption", null, `${u.value}년 ${h.value.toString().padStart(2, "0")}월`),
+      t("thead", null, [t("tr", null, vt.map((L) => t("th", null, L)))]),
+      t("tbody", null, E.value.map((L, R) => t("tr", { key: R }, L.map((Y, V) => t("td", {
+        key: V,
+        class: D(Y),
+        "data-date": Y.dateString
       }, [t("button", {
         type: "button",
         class: "btn-set-date",
-        "aria-pressed": i(F.dateString).isInRange ? "true" : "false",
-        onClick: () => u(F.dateString)
-      }, [t("span", null, String(F.day))])])))))
+        "aria-pressed": i(Y.dateString).isInRange ? "true" : "false",
+        onClick: () => c(Y.dateString)
+      }, [t("span", null, String(Y.day))])])))))
     ]);
-    return () => t("div", { class: "form-conts" }, [t("div", { class: K.value }, [t("div", { class: "calendar-input" }, [t("input", {
+    return () => t("div", { class: "form-conts" }, [t("div", { class: $.value }, [t("div", { class: "calendar-input" }, [t("input", {
       id: e.id,
       name: e.name,
-      class: m.value,
+      class: y.value,
       placeholder: e.placeholder,
       value: e.modelValue,
       readonly: e.readonly,
@@ -693,51 +693,51 @@ var Me = [
       required: e.required,
       autofocus: e.autofocus,
       type: "text",
-      onInput: P,
-      onChange: j,
-      onFocus: me,
-      onBlur: ge
+      onInput: X,
+      onChange: le,
+      onFocus: ue,
+      onBlur: ae
     }), t("button", {
-      ref: a,
+      ref: l,
       class: `krds-btn ${e.size || "medium"} icon form-btn-datepicker`,
       disabled: e.disabled,
       "aria-expanded": n.value,
       type: "button",
-      onClick: M
+      onClick: G
     }, [t("span", { class: "sr-only" }, "달력 열기"), t("i", { class: "svg-icon ico-calendar" })])]), t("div", {
       ref: r,
-      class: b.value
-    }, [W(t("div", {
+      class: C.value
+    }, [ve(t("div", {
       class: "calendar-wrap bottom",
       "aria-label": "달력",
       tabindex: "0",
-      onKeydown: A
+      onKeydown: j
     }, [
       t("div", { class: "calendar-head" }, [
         t("button", {
           type: "button",
           class: "btn-cal-move prev",
-          onClick: y
+          onClick: S
         }, [t("span", { class: "sr-only" }, "이전 달")]),
-        t("div", { class: "calendar-switch-wrap" }, [ee("year"), ee("month")]),
+        t("div", { class: "calendar-switch-wrap" }, [Q("year"), Q("month")]),
         t("button", {
           type: "button",
           class: "btn-cal-move next",
-          onClick: k
+          onClick: x
         }, [t("span", { class: "sr-only" }, "다음 달")])
       ]),
-      t("div", { class: "calendar-body" }, [t("div", { class: "calendar-table-wrap" }, [ye()])]),
-      t("div", { class: "calendar-footer" }, [t("div", { class: "calendar-btn-wrap" }, L.value.map(($) => t(fe, {
-        id: $.id,
-        key: $.id,
-        class: $.class,
-        variant: $.variant,
-        size: $.size,
-        onClick: $.handler
-      }, { default: () => $.label })))])
-    ]), [[X, n.value]])])])]);
+      t("div", { class: "calendar-body" }, [t("div", { class: "calendar-table-wrap" }, [ne()])]),
+      t("div", { class: "calendar-footer" }, [t("div", { class: "calendar-btn-wrap" }, _.value.map((L) => t($e, {
+        id: L.id,
+        key: L.id,
+        class: L.class,
+        variant: L.variant,
+        size: L.size,
+        onClick: L.handler
+      }, { default: () => L.label })))])
+    ]), [[pe, n.value]])])])]);
   }
-}), Re = Pe, qe = D({
+}), gt = pt, ht = A({
   name: "KrdsTextarea",
   props: {
     modelValue: {
@@ -818,33 +818,33 @@ var Me = [
     "keydown",
     "keyup"
   ],
-  setup(e, { emit: l }) {
-    const r = _(0);
-    G(() => e.modelValue, (o) => {
+  setup(e, { emit: a }) {
+    const r = B(0);
+    se(() => e.modelValue, (o) => {
       r.value = (o || "").length;
     }, { immediate: !0 });
-    const a = g(() => {
+    const l = b(() => {
       const o = ["krds-input"];
       return e.size && o.push(e.size), e.class && o.push(e.class), o;
-    }), n = g(() => {
+    }), n = b(() => {
       const o = {};
       return e.resize && (o.resize = e.resize), o;
     }), s = (o) => {
       const i = o.target.value;
-      r.value = i.length, l("update:modelValue", i), l("input", o);
-    }, d = (o) => {
-      l("change", o);
+      r.value = i.length, a("update:modelValue", i), a("input", o);
+    }, u = (o) => {
+      a("change", o);
     }, h = (o) => {
-      l("focus", o);
+      a("focus", o);
     }, f = (o) => {
-      l("blur", o);
-    }, S = (o) => {
-      l("keydown", o);
-    }, p = (o) => {
-      l("keyup", o);
-    }, C = g(() => {
+      a("blur", o);
+    }, w = (o) => {
+      a("keydown", o);
+    }, m = (o) => {
+      a("keyup", o);
+    }, T = b(() => {
       const o = {
-        class: a.value,
+        class: l.value,
         style: n.value,
         value: e.modelValue,
         placeholder: e.placeholder,
@@ -857,23 +857,23 @@ var Me = [
         rows: e.rows,
         cols: e.cols,
         onInput: s,
-        onChange: d,
+        onChange: u,
         onFocus: h,
         onBlur: f,
-        onKeydown: S,
-        onKeyup: p
+        onKeydown: w,
+        onKeyup: m
       };
       return e.maxlength !== void 0 && (o.maxlength = e.maxlength), e.minlength !== void 0 && (o.minlength = e.minlength), o;
-    }), y = g(() => ["form-conts"]), k = g(() => ["textarea-wrap"]), u = g(() => e.showCount ? {
+    }), S = b(() => ["form-conts"]), x = b(() => ["textarea-wrap"]), c = b(() => e.showCount ? {
       current: r.value,
       max: e.maxlength || ""
     } : null);
     return () => {
-      const o = [t("textarea", C.value)];
-      return u.value && o.push(t("p", { class: "textarea-count" }, [t("span", { class: "count-now" }, u.value.current), t("span", { class: "count-total" }, u.value.max ? `/${u.value.max}` : "")])), t("div", { class: y.value }, [t("div", { class: k.value }, o)]);
+      const o = [t("textarea", T.value)];
+      return c.value && o.push(t("p", { class: "textarea-count" }, [t("span", { class: "count-now" }, c.value.current), t("span", { class: "count-total" }, c.value.max ? `/${c.value.max}` : "")])), t("div", { class: S.value }, [t("div", { class: x.value }, o)]);
     };
   }
-}), He = qe, Ne = D({
+}), yt = ht, mt = A({
   name: "KrdsSelect",
   props: {
     modelValue: {
@@ -930,19 +930,19 @@ var Me = [
     "focus",
     "blur"
   ],
-  setup(e, { emit: l, slots: r }) {
-    const a = g(() => {
-      const p = [];
-      return e.sort ? p.push("krds-form-select-sort") : p.push("krds-form-select"), e.size && p.push(e.size), e.class && p.push(e.class), p;
-    }), n = (p) => {
-      const C = p.target;
-      l("update:modelValue", C.value === "" ? null : C.value);
-    }, s = (p) => {
-      l("focus", p);
-    }, d = (p) => {
-      l("blur", p);
-    }, h = g(() => ({
-      class: a.value,
+  setup(e, { emit: a, slots: r }) {
+    const l = b(() => {
+      const m = [];
+      return e.sort ? m.push("krds-form-select-sort") : m.push("krds-form-select"), e.size && m.push(e.size), e.class && m.push(e.class), m;
+    }), n = (m) => {
+      const T = m.target;
+      a("update:modelValue", T.value === "" ? null : T.value);
+    }, s = (m) => {
+      a("focus", m);
+    }, u = (m) => {
+      a("blur", m);
+    }, h = b(() => ({
+      class: l.value,
       value: e.modelValue ?? "",
       title: e.title || e.placeholder,
       name: e.name,
@@ -950,30 +950,30 @@ var Me = [
       disabled: e.disabled || e.readonly,
       onChange: n,
       onFocus: s,
-      onBlur: d
-    })), f = g(() => {
-      const p = ["form-conts"];
-      return e.state !== "default" && p.push(`is-${e.state}`), p;
-    }), S = () => {
-      const p = [];
-      return e.placeholder && !e.modelValue && p.push(t("option", {
+      onBlur: u
+    })), f = b(() => {
+      const m = ["form-conts"];
+      return e.state !== "default" && m.push(`is-${e.state}`), m;
+    }), w = () => {
+      const m = [];
+      return e.placeholder && !e.modelValue && m.push(t("option", {
         value: "",
         disabled: !0,
         selected: !0
-      }, e.placeholder)), e.options && e.options.length > 0 && e.options.forEach((C) => {
-        p.push(t("option", {
-          value: C.value,
-          disabled: C.disabled,
-          selected: C.value === e.modelValue
-        }, C.label));
-      }), r.default && p.push(...r.default()), p;
+      }, e.placeholder)), e.options && e.options.length > 0 && e.options.forEach((T) => {
+        m.push(t("option", {
+          value: T.value,
+          disabled: T.disabled,
+          selected: T.value === e.modelValue
+        }, T.label));
+      }), r.default && m.push(...r.default()), m;
     };
     return () => {
-      const p = t("select", h.value, S());
-      return e.sort ? p : t("div", { class: f.value }, [p]);
+      const m = t("select", h.value, w());
+      return e.sort ? m : t("div", { class: f.value }, [m]);
     };
   }
-}), Oe = Ne, je = 0, We = D({
+}), bt = mt, kt = 0, St = A({
   name: "KrdsFileUpload",
   props: {
     modelValue: {
@@ -1074,128 +1074,128 @@ var Me = [
     "download",
     "preview"
   ],
-  setup(e, { emit: l }) {
-    const r = _(!1), a = _(null), n = e.id ? `${e.id}-input` : `krds-file-upload-${++je}`, s = (c) => c < 1024 ? `${c}B` : c < 1048576 ? `${Math.round(c / 1024)}KB` : `${(c / 1048576).toFixed(1)}MB`, d = (c) => {
-      const B = c.split(".");
-      return B.length > 1 ? B.pop().toLowerCase() : "";
-    }, h = (c) => {
-      const B = d(c.name), V = B ? c.name.slice(0, -(B.length + 1)) : c.name;
-      return B ? `${V} [${B}, ${s(c.size)}]` : `${c.name} [${s(c.size)}]`;
-    }, f = () => `${Date.now()}-${Math.random().toString(36).substr(2, 9)}`, S = (c) => {
-      if (e.maxFileSize && c.size > e.maxFileSize) return `등록 가능한 파일 용량을 초과하였습니다.
+  setup(e, { emit: a }) {
+    const r = B(!1), l = B(null), n = e.id ? `${e.id}-input` : `krds-file-upload-${++kt}`, s = (v) => v < 1024 ? `${v}B` : v < 1048576 ? `${Math.round(v / 1024)}KB` : `${(v / 1048576).toFixed(1)}MB`, u = (v) => {
+      const M = v.split(".");
+      return M.length > 1 ? M.pop().toLowerCase() : "";
+    }, h = (v) => {
+      const M = u(v.name), I = M ? v.name.slice(0, -(M.length + 1)) : v.name;
+      return M ? `${I} [${M}, ${s(v.size)}]` : `${v.name} [${s(v.size)}]`;
+    }, f = () => `${Date.now()}-${Math.random().toString(36).substr(2, 9)}`, w = (v) => {
+      if (e.maxFileSize && v.size > e.maxFileSize) return `등록 가능한 파일 용량을 초과하였습니다.
 ${s(e.maxFileSize)} 미만의 파일만 등록할 수 있습니다.`;
       if (e.accept) {
-        const B = e.accept.split(",").map((E) => E.trim().toLowerCase()), V = `.${d(c.name)}`, I = c.type;
-        if (!B.some((E) => E.startsWith(".") ? V === E : E.endsWith("/*") ? I.startsWith(E.replace("/*", "/")) : I === E)) return "허용되지 않는 파일 형식입니다.";
+        const M = e.accept.split(",").map((H) => H.trim().toLowerCase()), I = `.${u(v.name)}`, N = v.type;
+        if (!M.some((H) => H.startsWith(".") ? I === H : H.endsWith("/*") ? N.startsWith(H.replace("/*", "/")) : N === H)) return "허용되지 않는 파일 형식입니다.";
       }
       return null;
-    }, p = (c) => {
+    }, m = (v) => {
       if (e.disabled || e.readonly) return;
-      let B = [...e.modelValue || []];
-      !e.multiple && B.length > 0 && (B = []);
-      const V = [];
-      for (let I = 0; I < c.length && !(B.length + V.length >= e.maxFiles); I++) {
-        const E = c[I], M = S(E), A = {
+      let M = [...e.modelValue || []];
+      !e.multiple && M.length > 0 && (M = []);
+      const I = [];
+      for (let N = 0; N < v.length && !(M.length + I.length >= e.maxFiles); N++) {
+        const H = v[N], G = w(H), j = {
           id: f(),
-          file: E,
-          name: E.name,
-          size: E.size,
-          type: E.type,
-          status: M ? "error" : "pending",
-          errorMessage: M || void 0
+          file: H,
+          name: H.name,
+          size: H.size,
+          type: H.type,
+          status: G ? "error" : "pending",
+          errorMessage: G || void 0
         };
-        V.push(A), M ? l("file-error", A, M) : l("file-added", A);
+        I.push(j), G ? a("file-error", j, G) : a("file-added", j);
       }
-      V.length > 0 && l("update:modelValue", [...B, ...V]);
-    }, C = (c) => {
-      const B = c.target;
-      B.files?.length && (p(B.files), B.value = "");
-    }, y = (c) => {
-      e.disabled || e.readonly || !e.dragAndDrop || (c.preventDefault(), r.value = !0);
-    }, k = () => {
+      I.length > 0 && a("update:modelValue", [...M, ...I]);
+    }, T = (v) => {
+      const M = v.target;
+      M.files?.length && (m(M.files), M.value = "");
+    }, S = (v) => {
+      e.disabled || e.readonly || !e.dragAndDrop || (v.preventDefault(), r.value = !0);
+    }, x = () => {
       r.value = !1;
-    }, u = (c) => {
-      c.preventDefault(), r.value = !1, !(e.disabled || e.readonly || !e.dragAndDrop) && c.dataTransfer?.files && p(c.dataTransfer.files);
+    }, c = (v) => {
+      v.preventDefault(), r.value = !1, !(e.disabled || e.readonly || !e.dragAndDrop) && v.dataTransfer?.files && m(v.dataTransfer.files);
     }, o = () => {
-      e.disabled || e.readonly || a.value?.click();
-    }, i = (c) => {
-      e.disabled || e.readonly || (l("update:modelValue", (e.modelValue || []).filter((B) => B.id !== c)), l("file-removed", c));
-    }, v = () => {
-      e.disabled || e.readonly || (l("update:modelValue", []), l("clear-all"));
-    }, m = g(() => {
-      const c = ["krds-file-upload", "line"];
-      return e.class && c.push(e.class), c;
-    }), K = () => t("div", { class: "file-head" }, [t("h3", { class: "tit" }, e.title), t("div", null, [t("p", null, e.description)])]), b = () => t("div", {
+      e.disabled || e.readonly || l.value?.click();
+    }, i = (v) => {
+      e.disabled || e.readonly || (a("update:modelValue", (e.modelValue || []).filter((M) => M.id !== v)), a("file-removed", v));
+    }, p = () => {
+      e.disabled || e.readonly || (a("update:modelValue", []), a("clear-all"));
+    }, y = b(() => {
+      const v = ["krds-file-upload", "line"];
+      return e.class && v.push(e.class), v;
+    }), $ = () => t("div", { class: "file-head" }, [t("h3", { class: "tit" }, e.title), t("div", null, [t("p", null, e.description)])]), C = () => t("div", {
       class: "file-upload",
-      onDragover: y,
-      onDragleave: k,
-      onDrop: u
+      onDragover: S,
+      onDragleave: x,
+      onDrop: c
     }, [t("p", { class: "txt" }, e.placeholder), t("div", { class: "file-upload-btn-wrap" }, [t("input", {
-      ref: a,
+      ref: l,
       type: "file",
       name: e.name || "myFile",
       id: n,
       hidden: !0,
       accept: e.accept || void 0,
       multiple: e.multiple,
-      onChange: C
+      onChange: T
     }), t("label", { for: n }, [t("button", {
       type: "button",
       class: ["krds-btn", e.size],
       disabled: e.disabled || void 0,
       onClick: o
-    }, [t("i", { class: "svg-icon ico-upload" }), "파일선택"])])])]), w = (c) => {
-      const B = [];
-      return c.status === "uploading" ? B.push(t("span", {
+    }, [t("i", { class: "svg-icon ico-upload" }), "파일선택"])])])]), E = (v) => {
+      const M = [];
+      return v.status === "uploading" ? M.push(t("span", {
         class: "krds-spinner",
         role: "status"
-      }, [t("span", { class: "sr-only" }, "업로드 중")])) : c.downloadUrl ? (e.showDownload && B.push(t("button", {
+      }, [t("span", { class: "sr-only" }, "업로드 중")])) : v.downloadUrl ? (e.showDownload && M.push(t("button", {
         type: "button",
         class: "krds-btn medium text",
-        onClick: () => l("download", c)
-      }, ["다운로드 ", t("i", { class: "svg-icon ico-down" })])), e.showPreviewButton && B.push(t("button", {
+        onClick: () => a("download", v)
+      }, ["다운로드 ", t("i", { class: "svg-icon ico-down" })])), e.showPreviewButton && M.push(t("button", {
         type: "button",
         class: "krds-btn medium text",
-        onClick: () => l("preview", c)
-      }, ["바로보기 ", t("i", { class: "svg-icon ico-angle right" })]))) : c.status === "completed" ? B.push(t("span", { class: "ico-invalid complete" }, [t("em", { class: "sr-only" }, "업로드 완료")])) : e.readonly || B.push(t("button", {
+        onClick: () => a("preview", v)
+      }, ["바로보기 ", t("i", { class: "svg-icon ico-angle right" })]))) : v.status === "completed" ? M.push(t("span", { class: "ico-invalid complete" }, [t("em", { class: "sr-only" }, "업로드 완료")])) : e.readonly || M.push(t("button", {
         type: "button",
         class: "krds-btn medium text",
         disabled: e.disabled || void 0,
-        onClick: () => i(c.id)
-      }, ["삭제 ", t("i", { class: "svg-icon ico-delete-fill" })])), B;
-    }, x = (c) => {
-      const B = [t("div", { class: c.downloadUrl ? "file-info m-column" : "file-info" }, [t("div", { class: "file-name" }, h(c)), t("div", { class: "btn-wrap" }, w(c))])];
-      if (c.status === "error" && c.errorMessage) {
-        const V = c.errorMessage.split(`
-`), I = [];
-        V.forEach((E, M) => {
-          M > 0 && I.push(t("br")), I.push(E);
-        }), B.push(t("p", { class: "file-hint-invalid" }, I));
+        onClick: () => i(v.id)
+      }, ["삭제 ", t("i", { class: "svg-icon ico-delete-fill" })])), M;
+    }, D = (v) => {
+      const M = [t("div", { class: v.downloadUrl ? "file-info m-column" : "file-info" }, [t("div", { class: "file-name" }, h(v)), t("div", { class: "btn-wrap" }, E(v))])];
+      if (v.status === "error" && v.errorMessage) {
+        const I = v.errorMessage.split(`
+`), N = [];
+        I.forEach((H, G) => {
+          G > 0 && N.push(t("br")), N.push(H);
+        }), M.push(t("p", { class: "file-hint-invalid" }, N));
       }
       return t("li", {
-        key: c.id,
-        class: c.status === "error" ? "is-error" : void 0
-      }, B);
-    }, L = (c) => {
-      const B = c.filter((I) => I.status !== "error").length, V = [t("div", { class: "total" }, [t("span", { class: "current" }, `${B}개`), ` / ${e.maxFiles}개`]), t("ul", { class: "upload-list" }, c.map(x))];
-      return e.showClearAll && !e.readonly && V.push(t("div", { class: "upload-delete-btn" }, [t("button", {
+        key: v.id,
+        class: v.status === "error" ? "is-error" : void 0
+      }, M);
+    }, _ = (v) => {
+      const M = v.filter((N) => N.status !== "error").length, I = [t("div", { class: "total" }, [t("span", { class: "current" }, `${M}개`), ` / ${e.maxFiles}개`]), t("ul", { class: "upload-list" }, v.map(D))];
+      return e.showClearAll && !e.readonly && I.push(t("div", { class: "upload-delete-btn" }, [t("button", {
         type: "button",
         class: "krds-btn xsmall tertiary",
         disabled: e.disabled || void 0,
-        onClick: v
-      }, ["전체 파일 삭제", t("i", { class: "svg-icon ico-angle right" })])])), t("div", { class: "file-list" }, V);
+        onClick: p
+      }, ["전체 파일 삭제", t("i", { class: "svg-icon ico-angle right" })])])), t("div", { class: "file-list" }, I);
     };
     return () => {
-      const c = [K()];
-      e.readonly || c.push(b());
-      const B = e.modelValue || [];
-      return B.length > 0 && c.push(L(B)), t("div", {
-        class: m.value,
+      const v = [$()];
+      e.readonly || v.push(C());
+      const M = e.modelValue || [];
+      return M.length > 0 && v.push(_(M)), t("div", {
+        class: y.value,
         style: e.style || void 0
-      }, c);
+      }, v);
     };
   }
-}), Ge = We, Ye = D({
+}), wt = St, Kt = A({
   name: "KrdsBadge",
   props: {
     type: {
@@ -1220,23 +1220,23 @@ ${s(e.maxFileSize)} 미만의 파일만 등록할 수 있습니다.`;
     }
   },
   emits: ["click"],
-  setup(e, { emit: l, slots: r }) {
-    const a = g(() => {
+  setup(e, { emit: a, slots: r }) {
+    const l = b(() => {
       const s = ["krds-badge"];
       return s.push(`${e.type}-${e.color}`), e.size && s.push(e.size), e.number && s.push("number"), e.class && s.push(e.class), s;
     }), n = (s) => {
-      l("click", s);
+      a("click", s);
     };
     return () => t("span", {
       type: e.type,
       color: e.color,
       size: e.size,
       number: e.number,
-      class: a.value,
+      class: l.value,
       onClick: n
     }, r.default?.());
   }
-}), Ue = Ye, Xe = D({
+}), Ct = Kt, xt = A({
   name: "KrdsTag",
   props: {
     link: {
@@ -1261,30 +1261,30 @@ ${s(e.maxFileSize)} 미만의 파일만 등록할 수 있습니다.`;
     }
   },
   emits: ["remove"],
-  setup(e, { emit: l, slots: r }) {
-    const a = g(() => {
-      const d = ["krds-btn-tag"];
-      return e.link && d.push("link"), e.class && d.push(e.class), d;
-    }), n = (d) => {
-      l("remove", d);
+  setup(e, { emit: a, slots: r }) {
+    const l = b(() => {
+      const u = ["krds-btn-tag"];
+      return e.link && u.push("link"), e.class && u.push(e.class), u;
+    }), n = (u) => {
+      a("remove", u);
     }, s = () => t("button", {
       type: "button",
       class: "btn-delete",
       onClick: n
     }, [t("span", { class: "sr-only" }, "삭제")]);
     return () => {
-      const d = [], h = r.default?.();
-      if (h && d.push(h), e.link || d.push(s()), e.link) {
+      const u = [], h = r.default?.();
+      if (h && u.push(h), e.link || u.push(s()), e.link) {
         const f = {
           href: e.href,
-          class: a.value
+          class: l.value
         };
-        return e.target && (f.target = e.target), e.rel && (f.rel = e.rel), t("a", f, d);
+        return e.target && (f.target = e.target), e.rel && (f.rel = e.rel), t("a", f, u);
       }
-      return t("span", { class: a.value }, d);
+      return t("span", { class: l.value }, u);
     };
   }
-}), Je = Xe, Qe = D({
+}), $t = xt, Lt = A({
   name: "KrdsTagGroup",
   props: {
     size: {
@@ -1296,44 +1296,44 @@ ${s(e.maxFileSize)} 미만의 파일만 등록할 수 있습니다.`;
       default: void 0
     }
   },
-  setup(e, { slots: l }) {
-    const r = g(() => {
-      const a = ["krds-tag-wrap"];
-      return e.size && a.push(e.size), e.class && a.push(e.class), a;
+  setup(e, { slots: a }) {
+    const r = b(() => {
+      const l = ["krds-tag-wrap"];
+      return e.size && l.push(e.size), e.class && l.push(e.class), l;
     });
-    return () => t("div", { class: r.value }, l.default?.());
+    return () => t("div", { class: r.value }, a.default?.());
   }
-}), Ze = Qe, et = D({
+}), Dt = Lt, Bt = A({
   name: "KrdsMasthead",
   props: { class: {
     type: String,
     default: void 0
   } },
   emits: ["click"],
-  setup(e, { emit: l, slots: r }) {
-    const a = g(() => {
+  setup(e, { emit: a, slots: r }) {
+    const l = b(() => {
       const s = [""];
       return e.class && s.push(e.class), s;
     }), n = (s) => {
-      l("click", s);
+      a("click", s);
     };
     return () => t("div", {
       id: "krds-masthead",
-      class: a.value,
+      class: l.value,
       onClick: n
     }, [t("div", { class: "toggle-wrap" }, [t("div", { class: "toggle-head" }, [t("div", { class: "inner" }, [t("span", { class: "nuri-txt" }, r.default?.())])])])]);
   }
-}), tt = et, at = 0;
-function fa(e = "krds") {
-  return `${e}-${++at}`;
+}), Et = Bt, Tt = 0;
+function Za(e = "krds") {
+  return `${e}-${++Tt}`;
 }
-function va() {
+function el() {
   return `${Date.now().toString(36).slice(-4)}${Math.random().toString(36).substring(2, 5)}`;
 }
-function Z(...e) {
+function he(...e) {
   return e.filter(Boolean).join(" ");
 }
-var lt = D({
+var _t = A({
   name: "KrdsToggleSwitch",
   props: {
     modelValue: {
@@ -1375,23 +1375,23 @@ var lt = D({
     }
   },
   emits: ["update:modelValue", "change"],
-  setup(e, { emit: l, attrs: r }) {
-    const a = `toggle-switch-${O()}`, n = g(() => e.modelValue), s = g(() => Z("krds-form-toggle-switch", e.size, e.class)), d = (f) => {
+  setup(e, { emit: a, attrs: r }) {
+    const l = `toggle-switch-${de()}`, n = b(() => e.modelValue), s = b(() => he("krds-form-toggle-switch", e.size, e.class)), u = (f) => {
       if (e.disabled) return;
-      const S = f.target.checked;
-      l("update:modelValue", S), l("change", S);
-    }, h = g(() => e.id || a);
+      const w = f.target.checked;
+      a("update:modelValue", w), a("change", w);
+    }, h = b(() => e.id || l);
     return () => t("div", { class: s.value }, [t("input", {
       type: "checkbox",
       id: h.value,
       name: e.name,
       checked: n.value,
       disabled: e.disabled,
-      onChange: d,
+      onChange: u,
       ...r
     }), t("label", { for: h.value }, [t("span", { class: "switch-toggle" }, [t("i")]), e.label || ""])]);
   }
-}), nt = lt, st = D({
+}), Mt = _t, At = A({
   name: "KrdsCheckArea",
   props: {
     class: {
@@ -1403,13 +1403,13 @@ var lt = D({
       default: !1
     }
   },
-  setup(e, { slots: l }) {
+  setup(e, { slots: a }) {
     return () => {
       const r = ["krds-check-area"];
-      return e.column && r.push("chk-column"), e.class && r.push(e.class), t("div", { class: r }, l.default?.());
+      return e.column && r.push("chk-column"), e.class && r.push(e.class), t("div", { class: r }, a.default?.());
     };
   }
-}), rt = st, it = D({
+}), Vt = At, Pt = A({
   name: "KrdsCheckbox",
   props: {
     modelValue: {
@@ -1440,28 +1440,28 @@ var lt = D({
   },
   emits: ["update:modelValue"],
   slots: Object,
-  setup(e, { emit: l, attrs: r, slots: a }) {
-    const n = `checkbox-${O()}`, s = g(() => e.modelValue), d = g(() => {
-      const S = e.chip ? "krds-form-chip" : "krds-form-check";
-      return Z(S, e.size, e.class);
-    }), h = (S) => {
+  setup(e, { emit: a, attrs: r, slots: l }) {
+    const n = `checkbox-${de()}`, s = b(() => e.modelValue), u = b(() => {
+      const w = e.chip ? "krds-form-chip" : "krds-form-check";
+      return he(w, e.size, e.class);
+    }), h = (w) => {
       if (e.disabled) return;
-      const p = S.target.checked;
-      l("update:modelValue", p);
-    }, f = g(() => e.id || n);
+      const m = w.target.checked;
+      a("update:modelValue", m);
+    }, f = b(() => e.id || n);
     return () => {
-      const S = [t("input", {
+      const w = [t("input", {
         type: "checkbox",
         id: f.value,
         checked: s.value,
         disabled: e.disabled,
         onChange: h,
         ...r
-      }), t("label", { for: f.value }, a.default?.())];
-      return a.description && !e.chip && S.push(t("div", { class: "krds-form-check-cnt" }, t("p", { class: "krds-form-check-p" }, a.description()))), t("div", { class: d.value }, S);
+      }), t("label", { for: f.value }, l.default?.())];
+      return l.description && !e.chip && w.push(t("div", { class: "krds-form-check-cnt" }, t("p", { class: "krds-form-check-p" }, l.description()))), t("div", { class: u.value }, w);
     };
   }
-}), ot = it, dt = D({
+}), zt = Pt, Ft = A({
   name: "KrdsRadio",
   props: {
     modelValue: {
@@ -1508,28 +1508,28 @@ var lt = D({
   },
   emits: ["update:modelValue"],
   slots: Object,
-  setup(e, { emit: l, attrs: r, slots: a }) {
-    const n = `radio-${O()}`, s = g(() => e.modelValue === e.value), d = g(() => {
-      const p = e.chip ? "krds-form-chip" : "krds-form-check";
-      return Z(p, e.size, e.class);
-    }), h = (p) => {
-      e.disabled || p.target.checked && l("update:modelValue", e.value);
-    }, f = g(() => e.id || n), S = g(() => e.name);
+  setup(e, { emit: a, attrs: r, slots: l }) {
+    const n = `radio-${de()}`, s = b(() => e.modelValue === e.value), u = b(() => {
+      const m = e.chip ? "krds-form-chip" : "krds-form-check";
+      return he(m, e.size, e.class);
+    }), h = (m) => {
+      e.disabled || m.target.checked && a("update:modelValue", e.value);
+    }, f = b(() => e.id || n), w = b(() => e.name);
     return () => {
-      const p = [t("input", {
+      const m = [t("input", {
         type: "radio",
         id: f.value,
-        name: S.value,
+        name: w.value,
         value: String(e.value),
         checked: s.value,
         disabled: e.disabled,
         onChange: h,
         ...r
-      }), t("label", { for: f.value }, a.default?.())];
-      return a.description && !e.chip && p.push(t("div", { class: "krds-form-check-cnt" }, t("p", { class: "krds-form-check-p" }, a.description()))), t("div", { class: d.value }, p);
+      }), t("label", { for: f.value }, l.default?.())];
+      return l.description && !e.chip && m.push(t("div", { class: "krds-form-check-cnt" }, t("p", { class: "krds-form-check-p" }, l.description()))), t("div", { class: u.value }, m);
     };
   }
-}), ut = dt, ct = ve, ft = D({
+}), Rt = Ft, It = Le, Ht = A({
   name: "KrdsStepIndicator",
   props: {
     modelValue: {
@@ -1542,24 +1542,24 @@ var lt = D({
     }
   },
   emits: ["update:modelValue"],
-  setup(e, { slots: l }) {
-    const r = g(() => {
+  setup(e, { slots: a }) {
+    const r = b(() => {
       const h = ["krds-step-wrap"];
       return e.class && h.push(e.class), h;
-    }), a = (h) => {
+    }), l = (h) => {
       const f = e.modelValue || 0;
       return h < f ? "done" : h === f ? "active" : "pending";
-    }, n = _(0), s = () => {
+    }, n = B(0), s = () => {
       n.value = 0;
-    }, d = () => n.value++;
-    return we("stepIndicator", {
-      activeStep: g(() => e.modelValue || 0),
-      getStepStatus: a,
-      getNextStepIndex: d,
+    }, u = () => n.value++;
+    return Qe("stepIndicator", {
+      activeStep: b(() => e.modelValue || 0),
+      getStepStatus: l,
+      getNextStepIndex: u,
       resetStepIndex: s
-    }), () => (s(), t("ol", { class: r.value }, l.default?.()));
+    }), () => (s(), t("ol", { class: r.value }, a.default?.()));
   }
-}), vt = ft, ht = D({
+}), Ot = Ht, Nt = A({
   name: "KrdsStep",
   props: {
     step: {
@@ -1580,17 +1580,17 @@ var lt = D({
     }
   },
   emits: ["click"],
-  setup(e, { emit: l, slots: r }) {
-    const a = Ke("stepIndicator"), n = a ? a.getNextStepIndex() : -1, s = g(() => e.status ? e.status : a && n >= 0 ? a.getStepStatus(n) : "pending"), d = g(() => {
+  setup(e, { emit: a, slots: r }) {
+    const l = Xe("stepIndicator"), n = l ? l.getNextStepIndex() : -1, s = b(() => e.status ? e.status : l && n >= 0 ? l.getStepStatus(n) : "pending"), u = b(() => {
       const f = [s.value];
       return e.class && f.push(e.class), f;
     }), h = (f) => {
-      l("click", f, e.step);
+      a("click", f, e.step);
     };
     return () => {
       const f = s.value === "active";
       return t("li", {
-        class: d.value,
+        class: u.value,
         onClick: h
       }, [t("span", [
         f && t("em", { class: "sr-only" }, "현재단계"),
@@ -1600,7 +1600,7 @@ var lt = D({
       ])]);
     };
   }
-}), pt = ht, mt = D({
+}), qt = Nt, Wt = A({
   name: "KrdsSkipLink",
   props: {
     href: {
@@ -1621,13 +1621,13 @@ var lt = D({
       default: "krds-skip-link"
     }
   },
-  setup(e, { slots: l }) {
+  setup(e, { slots: a }) {
     return () => t("div", {
       id: e.id,
       class: e.class
-    }, [t("a", { href: e.href }, l.default?.())]);
+    }, [t("a", { href: e.href }, a.default?.())]);
   }
-}), gt = mt, yt = D({
+}), Yt = Wt, jt = A({
   name: "KrdsBreadcrumb",
   props: {
     items: {
@@ -1648,28 +1648,28 @@ var lt = D({
     }
   },
   emits: ["item-click"],
-  setup(e, { emit: l }) {
-    const r = (n) => n === e.items.length - 1, a = (n, s) => {
-      n.onClick && n.onClick(s), l("item-click", n, s);
+  setup(e, { emit: a }) {
+    const r = (n) => n === e.items.length - 1, l = (n, s) => {
+      n.onClick && n.onClick(s), a("item-click", n, s);
     };
     return () => t("nav", {
       id: e.id,
       class: "krds-breadcrumb-wrap",
       "aria-label": e.ariaLabel
     }, [t("ol", { class: "breadcrumb" }, e.items.map((n, s) => {
-      const d = s === 0 && e.showHomeIcon;
+      const u = s === 0 && e.showHomeIcon;
       return t("li", {
         key: `breadcrumb-${s}`,
-        class: { home: d }
+        class: { home: u }
       }, [t("a", {
         href: n.href || "#",
         class: "txt",
         "aria-current": r(s) ? "page" : void 0,
-        onClick: (h) => a(n, h)
-      }, d ? [] : [t("span", null, n.text)])]);
+        onClick: (h) => l(n, h)
+      }, u ? [] : [t("span", null, n.text)])]);
     }))]);
   }
-}), bt = yt, kt = D({
+}), Gt = jt, Ut = A({
   name: "KrdsInPageNavigation",
   props: {
     title: {
@@ -1703,114 +1703,109 @@ var lt = D({
   },
   emits: ["itemClick"],
   slots: Object,
-  setup(e, { emit: l, slots: r }) {
-    const a = _(""), n = _(/* @__PURE__ */ new Map()), s = g(() => {
-      const u = ["krds-in-page-navigation-type"];
-      return e.class && u.push(e.class), u;
-    }), d = () => {
-      const u = e.headerTopSelector, o = e.headerInnerSelector;
-      return (document.querySelector(u)?.clientHeight || 0) + (document.querySelector(o)?.clientHeight || 0);
-    }, h = (u, o) => {
-      if (l("itemClick", u, o), u.href.startsWith("#")) {
+  setup(e, { emit: a, slots: r }) {
+    const l = B(""), n = B(/* @__PURE__ */ new Map()), s = b(() => {
+      const c = ["krds-in-page-navigation-type"];
+      return e.class && c.push(e.class), c;
+    }), u = () => {
+      const c = e.headerTopSelector, o = e.headerInnerSelector;
+      return (document.querySelector(c)?.clientHeight || 0) + (document.querySelector(o)?.clientHeight || 0);
+    }, h = (c, o) => {
+      if (a("itemClick", c, o), c.href.startsWith("#")) {
         o.preventDefault();
-        const i = document.querySelector(u.href);
+        const i = document.querySelector(c.href);
         if (i) {
-          const v = d();
+          const p = u();
           if (window.scrollTo({
             left: 0,
-            top: i.getBoundingClientRect().top + window.scrollY - v,
+            top: i.getBoundingClientRect().top + window.scrollY - p,
             behavior: "smooth"
-          }), a.value = u.href, o instanceof KeyboardEvent) {
-            const m = i.querySelector(".sec-tit, h1, h2, h3, h4, h5, h6");
-            m && m instanceof HTMLElement && (m.setAttribute("tabindex", "-1"), m.focus({ preventScroll: !0 }));
+          }), l.value = c.href, o instanceof KeyboardEvent) {
+            const y = i.querySelector(".sec-tit, h1, h2, h3, h4, h5, h6");
+            y && y instanceof HTMLElement && (y.setAttribute("tabindex", "-1"), y.focus({ preventScroll: !0 }));
           }
         }
       }
     }, f = () => {
-      n.value.clear(), e.items && e.items.filter((u) => u.href.startsWith("#")).forEach((u) => {
-        const o = document.querySelector(u.href);
-        o && n.value.set(u.href, o);
+      n.value.clear(), e.items && e.items.filter((c) => c.href.startsWith("#")).forEach((c) => {
+        const o = document.querySelector(c.href);
+        o && n.value.set(c.href, o);
       });
-    }, S = () => {
+    }, w = () => {
       if (!e.autoActive || !e.items || n.value.size === 0) return;
-      const u = window.innerHeight, o = Math.ceil(u / 5), i = window.scrollY + u, v = document.body.scrollHeight, m = e.items.filter((L) => L.href.startsWith("#") && n.value.has(L.href)).map((L) => ({
-        href: L.href,
-        element: n.value.get(L.href),
-        item: L
+      const c = window.innerHeight, o = Math.ceil(c / 5), i = window.scrollY + c, p = document.body.scrollHeight, y = e.items.filter((_) => _.href.startsWith("#") && n.value.has(_.href)).map((_) => ({
+        href: _.href,
+        element: n.value.get(_.href),
+        item: _
       }));
-      if (m.length === 0) return;
-      const K = m[0], b = m[m.length - 1], w = K.element.offsetTop;
-      let x = "";
-      if (i >= v) x = b.href;
-      else if (window.scrollY <= w) x = K.href;
-      else for (const L of m) {
-        const c = L.element.offsetHeight, B = L.element.offsetTop - o;
-        if (window.scrollY > B && window.scrollY <= B + c) {
-          x = L.href;
+      if (y.length === 0) return;
+      const $ = y[0], C = y[y.length - 1], E = $.element.offsetTop;
+      let D = "";
+      if (i >= p) D = C.href;
+      else if (window.scrollY <= E) D = $.href;
+      else for (const _ of y) {
+        const v = _.element.offsetHeight, M = _.element.offsetTop - o;
+        if (window.scrollY > M && window.scrollY <= M + v) {
+          D = _.href;
           break;
         }
       }
-      x && x !== a.value && (a.value = x);
-    }, p = () => {
+      D && D !== l.value && (l.value = D);
+    }, m = () => {
       if (!e.items) return;
-      const u = e.items.find((o) => o.active);
-      u ? a.value = u.href : e.items.length > 0 && (a.value = e.items[0].href);
+      const c = e.items.find((o) => o.active);
+      c ? l.value = c.href : e.items.length > 0 && (l.value = e.items[0].href);
     };
-    N(() => {
-      if (p(), e.autoActive) {
-        f(), S(), window.addEventListener("scroll", S, { passive: !0 });
-        const u = new MutationObserver(() => {
+    ie(() => {
+      if (m(), e.autoActive) {
+        f(), w(), window.addEventListener("scroll", w, { passive: !0 });
+        const c = new MutationObserver(() => {
           f();
         });
-        u.observe(document.body, {
+        c.observe(document.body, {
           childList: !0,
           subtree: !0
-        }), q(() => {
-          u.disconnect();
+        }), re(() => {
+          c.disconnect();
         });
       }
-    }), q(() => {
-      e.autoActive && (window.removeEventListener("scroll", S), n.value.clear());
+    }), re(() => {
+      e.autoActive && (window.removeEventListener("scroll", w), n.value.clear());
     });
-    const C = () => !e.caption && !e.title ? null : t("div", { class: "in-page-navigation-header" }, [e.caption && t("p", { class: "quick-caption" }, e.caption), e.title && t("p", { class: "quick-title" }, e.title)]), y = () => {
+    const T = () => !e.caption && !e.title ? null : t("div", { class: "in-page-navigation-header" }, [e.caption && t("p", { class: "quick-caption" }, e.caption), e.title && t("p", { class: "quick-title" }, e.title)]), S = () => {
       if (!e.items) return null;
-      const u = e.items.map((o) => {
-        const i = a.value === o.href || !e.autoActive && o.active;
+      const c = e.items.map((o) => {
+        const i = l.value === o.href || !e.autoActive && o.active;
         return t("li", { key: o.href }, [t("a", {
           href: o.href,
           class: i ? "active" : "",
-          onClick: (v) => h(o, v),
-          onKeydown: (v) => {
-            (v.key === "Enter" || v.key === " ") && (v.preventDefault(), h(o, v));
+          onClick: (p) => h(o, p),
+          onKeydown: (p) => {
+            (p.key === "Enter" || p.key === " ") && (p.preventDefault(), h(o, p));
           }
         }, o.text)]);
       });
-      return t("nav", { class: "in-page-navigation-list" }, [t("ul", {}, u)]);
-    }, k = () => r.action ? t("div", { class: "in-page-navigation-action" }, [r.action()]) : null;
+      return t("nav", { class: "in-page-navigation-list" }, [t("ul", {}, c)]);
+    }, x = () => r.action ? t("div", { class: "in-page-navigation-action" }, [r.action()]) : null;
     return () => t("div", { class: s.value }, [t("div", { class: "krds-in-page-navigation-area" }, [
-      C(),
-      y(),
-      k()
+      T(),
+      S(),
+      x()
     ].filter(Boolean))]);
   }
-}), St = kt, Y = {
-  mounted(e, l) {
-    l.value !== !1 && e.classList.add("sr-only");
+}), Xt = Ut, De = {
+  mounted(e, a) {
+    a.value !== !1 && e.classList.add("sr-only");
   },
-  updated(e, l) {
-    l.value === !1 ? e.classList.remove("sr-only") : e.classList.add("sr-only");
+  updated(e, a) {
+    a.value === !1 ? e.classList.remove("sr-only") : e.classList.add("sr-only");
   },
   unmounted(e) {
     e.classList.remove("sr-only");
   }
-}, U = /* @__PURE__ */ ce({
-  default: () => re,
-  directives: () => re,
-  installDirectives: () => he,
-  vSrOnly: () => Y
-}), re = { "sr-only": Y }, he = (e) => {
-  e.directive("sr-only", Y);
-}, ie = 1, oe = 8, Kt = D({
+}, Qt = (e) => {
+  e.directive("sr-only", De);
+}, ke = 1, Se = 8, Jt = A({
   name: "KrdsPagination",
   props: {
     modelValue: {
@@ -1819,7 +1814,7 @@ var lt = D({
     },
     min: {
       type: Number,
-      default: ie
+      default: ke
     },
     max: {
       type: Number,
@@ -1835,91 +1830,91 @@ var lt = D({
     },
     pageRange: {
       type: Number,
-      default: oe
+      default: Se
     }
   },
   emits: ["update:modelValue"],
-  setup(e, { emit: l }) {
-    const r = g(() => Math.max(1, e.min ?? ie)), a = g(() => e.modelValue ?? r.value), n = g(() => a.value <= r.value), s = g(() => a.value >= e.max), d = g(() => {
+  setup(e, { emit: a }) {
+    const r = b(() => Math.max(1, e.min ?? ke)), l = b(() => e.modelValue ?? r.value), n = b(() => l.value <= r.value), s = b(() => l.value >= e.max), u = b(() => {
       if (!n.value)
         return "#";
-    }), h = g(() => {
+    }), h = b(() => {
       if (!s.value)
         return "#";
-    }), f = g(() => {
-      const { max: k } = e, u = e.pageRange ?? oe, o = 1, i = [];
-      if (k <= u + 2) for (let v = r.value; v <= k; v++) i.push({
+    }), f = b(() => {
+      const { max: x } = e, c = e.pageRange ?? Se, o = 1, i = [];
+      if (x <= c + 2) for (let p = r.value; p <= x; p++) i.push({
         type: "page",
-        key: `page-${v}`,
-        page: v,
+        key: `page-${p}`,
+        page: p,
         href: "#"
       });
       else {
-        const v = Math.min(o, k), m = Math.max(k - o + 1, 1), K = Math.max(r.value, a.value - Math.floor(u / 2)), b = Math.min(k, K + u - 1), w = Math.max(r.value, b - u + 1);
-        for (let c = r.value; c <= v; c++) i.push({
+        const p = Math.min(o, x), y = Math.max(x - o + 1, 1), $ = Math.max(r.value, l.value - Math.floor(c / 2)), C = Math.min(x, $ + c - 1), E = Math.max(r.value, C - c + 1);
+        for (let v = r.value; v <= p; v++) i.push({
           type: "page",
-          key: `page-${c}`,
-          page: c,
+          key: `page-${v}`,
+          page: v,
           href: "#"
         });
-        w > v + 1 && i.push({
+        E > p + 1 && i.push({
           type: "ellipsis",
           key: "ellipsis-left",
           ariaLabel: "페이지 생략"
         });
-        const x = Math.max(w, v + 1), L = Math.min(b, m - 1);
-        for (let c = x; c <= L; c++) i.push({
+        const D = Math.max(E, p + 1), _ = Math.min(C, y - 1);
+        for (let v = D; v <= _; v++) i.push({
           type: "page",
-          key: `page-${c}`,
-          page: c,
+          key: `page-${v}`,
+          page: v,
           href: "#"
         });
-        b < m - 1 && i.push({
+        C < y - 1 && i.push({
           type: "ellipsis",
           key: "ellipsis-right",
           ariaLabel: "페이지 생략"
         });
-        for (let c = m; c <= k; c++) i.push({
+        for (let v = y; v <= x; v++) i.push({
           type: "page",
-          key: `page-${c}`,
-          page: c,
+          key: `page-${v}`,
+          page: v,
           href: "#"
         });
       }
       return i;
-    }), S = (k, u) => {
-      if (k === a.value) {
-        u.preventDefault();
+    }), w = (x, c) => {
+      if (x === l.value) {
+        c.preventDefault();
         return;
       }
-      l("update:modelValue", k);
-    }, p = (k) => {
+      a("update:modelValue", x);
+    }, m = (x) => {
       if (n.value) {
-        k.preventDefault();
+        x.preventDefault();
         return;
       }
-      l("update:modelValue", a.value - 1);
-    }, C = (k) => {
+      a("update:modelValue", l.value - 1);
+    }, T = (x) => {
       if (s.value) {
-        k.preventDefault();
+        x.preventDefault();
         return;
       }
-      l("update:modelValue", a.value + 1);
-    }, y = (k) => {
-      if (k.type === "page") {
-        const u = k.page === a.value;
+      a("update:modelValue", l.value + 1);
+    }, S = (x) => {
+      if (x.type === "page") {
+        const c = x.page === l.value;
         return t("a", {
-          key: k.key,
-          href: k.href || "#",
-          class: ["page-link", { active: u }],
-          "aria-current": u ? "page" : void 0,
-          onClick: (o) => S(k.page, o)
-        }, [u ? W(t("span", null, "현재페이지"), [[Y]]) : null, ` ${k.page} `]);
+          key: x.key,
+          href: x.href || "#",
+          class: ["page-link", { active: c }],
+          "aria-current": c ? "page" : void 0,
+          onClick: (o) => w(x.page, o)
+        }, [c ? ve(t("span", null, "현재페이지"), [[De]]) : null, ` ${x.page} `]);
       }
       return t("span", {
-        key: k.key,
+        key: x.key,
         class: "page-link link-dot",
-        "aria-label": k.ariaLabel
+        "aria-label": x.ariaLabel
       });
     };
     return () => t("div", {
@@ -1927,15 +1922,15 @@ var lt = D({
       class: "krds-pagination"
     }, [
       t(n.value ? "span" : "a", {
-        href: n.value ? void 0 : d.value,
+        href: n.value ? void 0 : u.value,
         class: [
           "page-navi",
           "prev",
           { disabled: n.value }
         ],
-        onClick: p
+        onClick: m
       }, "이전"),
-      t("div", { class: "page-links" }, f.value.map(y)),
+      t("div", { class: "page-links" }, f.value.map(S)),
       t(s.value ? "span" : "a", {
         href: s.value ? void 0 : h.value,
         class: [
@@ -1943,31 +1938,31 @@ var lt = D({
           "next",
           { disabled: s.value }
         ],
-        onClick: C
+        onClick: T
       }, "다음")
     ]);
   }
-}), wt = Kt, Ct = D({
+}), Zt = Jt, ea = A({
   name: "KrdsPanel",
   props: { modelValue: {
     type: Boolean,
     default: !1
   } },
   emits: ["update:modelValue"],
-  setup(e, { emit: l, slots: r }) {
-    const a = g({
+  setup(e, { emit: a, slots: r }) {
+    const l = b({
       get: () => e.modelValue,
-      set: (d) => l("update:modelValue", d)
+      set: (u) => a("update:modelValue", u)
     }), n = () => {
-      a.value = !0;
+      l.value = !0;
     }, s = () => {
-      a.value = !1;
+      l.value = !1;
     };
     return () => t("div", { class: "inner help-panel-flexible" }, [t("button", {
       type: "button",
       class: "krds-btn small tertiary btn-help-panel expand btn-help-exec",
       onClick: n
-    }, [t("i", { class: "svg-icon ico-fold" }), " 도움말"]), t("div", { class: ["krds-help-panel", { expand: a.value }] }, [t("div", { class: "help-panel-wrap" }, [t("div", { class: "help-conts-area" }, [r.default?.(), t("button", {
+    }, [t("i", { class: "svg-icon ico-fold" }), " 도움말"]), t("div", { class: ["krds-help-panel", { expand: l.value }] }, [t("div", { class: "help-panel-wrap" }, [t("div", { class: "help-conts-area" }, [r.default?.(), t("button", {
       type: "button",
       class: "krds-btn small tertiary btn-help-panel fold",
       onClick: s
@@ -1977,7 +1972,7 @@ var lt = D({
       t("i", { class: "svg-icon ico-angle right" })
     ])])])])]);
   }
-}), xt = Ct, $t = D({
+}), ta = ea, aa = A({
   name: "KrdsContextualHelp",
   props: {
     tooltipTitle: {
@@ -1993,45 +1988,45 @@ var lt = D({
       default: "top left"
     }
   },
-  setup(e, { slots: l }) {
-    const r = _(), a = _(), n = _(), s = _(), d = _(!1), h = () => {
-      const o = d.value;
-      p(), o || f();
+  setup(e, { slots: a }) {
+    const r = B(), l = B(), n = B(), s = B(), u = B(!1), h = () => {
+      const o = u.value;
+      m(), o || f();
     }, f = () => {
-      !n.value || !a.value || (d.value = !0, n.value.style.display = "block", a.value.setAttribute("aria-expanded", "true"), n.value.querySelector('a, button, [tabindex="0"], input, textarea, select')?.focus(), C());
-    }, S = () => {
-      !n.value || !a.value || (d.value = !1, n.value.style.display = "none", a.value.setAttribute("aria-expanded", "false"));
-    }, p = () => {
+      !n.value || !l.value || (u.value = !0, n.value.style.display = "block", l.value.setAttribute("aria-expanded", "true"), n.value.querySelector('a, button, [tabindex="0"], input, textarea, select')?.focus(), T());
+    }, w = () => {
+      !n.value || !l.value || (u.value = !1, n.value.style.display = "none", l.value.setAttribute("aria-expanded", "false"));
+    }, m = () => {
       const o = document.querySelectorAll(".krds-contextual-help .tooltip-popover"), i = document.querySelectorAll(".krds-contextual-help .tooltip-btn");
-      o.forEach((v) => {
-        v.style.display = "none";
-      }), i.forEach((v) => {
-        v.setAttribute("aria-expanded", "false");
-      }), d.value = !1;
-    }, C = () => {
+      o.forEach((p) => {
+        p.style.display = "none";
+      }), i.forEach((p) => {
+        p.setAttribute("aria-expanded", "false");
+      }), u.value = !1;
+    }, T = () => {
       if (!r.value || !n.value) return;
       const o = window.innerWidth <= 768, i = r.value.querySelector(".tooltip-action");
       if (o) {
-        const v = getComputedStyle(document.querySelector(":root")).getPropertyValue("--krds-contents-padding-x").trim().split("px")[0], m = i.getBoundingClientRect().left - parseInt(v), K = document.body.clientWidth - parseInt(v) * 2;
-        n.value.style.left = `-${m}px`, n.value.style.width = `${K}px`;
+        const p = getComputedStyle(document.querySelector(":root")).getPropertyValue("--krds-contents-padding-x").trim().split("px")[0], y = i.getBoundingClientRect().left - parseInt(p), $ = document.body.clientWidth - parseInt(p) * 2;
+        n.value.style.left = `-${y}px`, n.value.style.width = `${$}px`;
       } else
         n.value.style.left = "", n.value.style.right = "", n.value.style.width = "360px";
-    }, y = (o) => {
-      (o.key === "Escape" || o.key === "Esc") && p();
-    }, k = (o) => {
-      o.target.closest(".tooltip-action") || p();
-    }, u = () => {
-      d.value && C();
+    }, S = (o) => {
+      (o.key === "Escape" || o.key === "Esc") && m();
+    }, x = (o) => {
+      o.target.closest(".tooltip-action") || m();
+    }, c = () => {
+      u.value && T();
     };
-    return N(() => {
-      r.value && (a.value && a.value.setAttribute("aria-expanded", "false"), n.value && n.value.setAttribute("role", "tooltip"), document.addEventListener("keydown", y), document.addEventListener("click", k), window.addEventListener("resize", u));
-    }), q(() => {
-      document.removeEventListener("keydown", y), document.removeEventListener("click", k), window.removeEventListener("resize", u);
+    return ie(() => {
+      r.value && (l.value && l.value.setAttribute("aria-expanded", "false"), n.value && n.value.setAttribute("role", "tooltip"), document.addEventListener("keydown", S), document.addEventListener("click", x), window.addEventListener("resize", c));
+    }), re(() => {
+      document.removeEventListener("keydown", S), document.removeEventListener("click", x), window.removeEventListener("resize", c);
     }), () => t("div", {
       ref: r,
       class: ["krds-contextual-help", e.position]
     }, [t("div", { class: "tooltip-action" }, [t("button", {
-      ref: a,
+      ref: l,
       type: "button",
       class: "krds-btn medium icon tooltip-btn",
       onClick: h
@@ -2041,16 +2036,16 @@ var lt = D({
       role: "tooltip"
     }, [
       t("h4", { class: "tooltip-title" }, e.tooltipTitle),
-      t("div", { class: "tooltip-contents" }, l.default?.()),
+      t("div", { class: "tooltip-contents" }, a.default?.()),
       t("button", {
         ref: s,
         type: "button",
         class: "krds-btn xsmall icon tooltip-close",
-        onClick: S
+        onClick: w
       }, [t("span", { class: "sr-only" }, "닫기"), t("i", { class: "svg-icon ico-modal-close" })])
     ])])]);
   }
-}), Bt = $t, Lt = D({
+}), la = aa, na = A({
   name: "KrdsCoachMark",
   props: {
     coachMarkClass: {
@@ -2083,18 +2078,18 @@ var lt = D({
     }
   },
   emits: ["update:modelValue", "close"],
-  setup(e, { emit: l, slots: r }) {
-    const a = g(() => {
+  setup(e, { emit: a, slots: r }) {
+    const l = b(() => {
       const f = e.activeStep - 1;
       return e.stepsData && f >= 0 && f < e.stepsData.length ? e.stepsData[f] : null;
     }), n = () => {
-      e.activeStep > 1 && l("update:modelValue", e.activeStep - 1);
+      e.activeStep > 1 && a("update:modelValue", e.activeStep - 1);
     }, s = () => {
-      e.activeStep < e.stepsData.length && l("update:modelValue", e.activeStep + 1);
-    }, d = () => {
-      l("close");
+      e.activeStep < e.stepsData.length && a("update:modelValue", e.activeStep + 1);
+    }, u = () => {
+      a("close");
     }, h = () => {
-      const f = a.value;
+      const f = l.value;
       return e.modelValue !== e.activeStep || !f ? null : t("div", { class: "coach-balloon" }, [
         t("h5", { class: "sr-only" }, "따라하기 가이드"),
         t("h6", { class: "coach-tit" }, `${e.activeStep}단계 : ${f.title}`),
@@ -2108,7 +2103,7 @@ var lt = D({
           t("button", {
             type: "button",
             class: "krds-btn small text",
-            onClick: d
+            onClick: u
           }, "그만보기"),
           e.activeStep !== 1 ? t("button", {
             type: "button",
@@ -2128,7 +2123,7 @@ var lt = D({
       style: e.style
     }, [h(), r["coach-mark-content"]?.()]);
   }
-}), Dt = Lt, _t = D({
+}), sa = na, ra = A({
   name: "KrdsTooltip",
   props: {
     type: {
@@ -2164,65 +2159,65 @@ var lt = D({
       default: void 0
     }
   },
-  setup(e, { slots: l }) {
-    const r = _(null), a = _(null), n = _(!1), s = _({}), d = `tooltip-popover-${O()}`, h = _(!1), f = g(() => {
-      const m = ["krds-btn", "krds-tooltip"];
-      return e.type === "default" ? m.push("small", "text") : e.type === "icon" ? m.push("icon") : e.type === "button" && m.push(""), !e.box && e.vertical && m.push("tooltip-vertical"), e.box && !e.vertical && m.push("tooltip-box"), m.join(" ");
-    }), S = g(() => {
-      const m = [];
-      return e.box && m.push("tooltip-box"), e.vertical && m.push("tooltip-vertical"), n.value && m.push("active"), m;
-    }), p = g(() => r.value?.querySelector("button")?.textContent?.trim() || ""), C = () => window.innerWidth <= 768, y = () => {
-      if (!r.value || !a.value) return;
-      const m = r.value.querySelector("button");
-      if (!m) return;
-      const K = 12, { clientHeight: b, clientWidth: w } = a.value, { top: x, left: L, right: c, height: B, width: V } = m.getBoundingClientRect(), I = window.innerWidth / 2, E = window.innerHeight / 2;
-      let M, A;
-      const P = [];
-      h.value || e.box || e.vertical ? (x + B > E ? (M = x - b - K, P.push("top")) : (M = x + B + K, P.push("bottom")), L + V > I ? (A = c - w, P.push("right"), window.innerWidth - (L + V) > w / 2 && (A = L + (V - w) / 2, P.splice(P.indexOf("right"), 1))) : (A = L + (V - w) / 2, A < 0 && (A = L, P.push("left")))) : (M = x + (B - b) / 2, L + V > I ? (A = L - w - K, P.push("right")) : A = c + K);
-      const j = window.innerWidth <= 420;
+  setup(e, { slots: a }) {
+    const r = B(null), l = B(null), n = B(!1), s = B({}), u = `tooltip-popover-${de()}`, h = B(!1), f = b(() => {
+      const y = ["krds-btn", "krds-tooltip"];
+      return e.type === "default" ? y.push("small", "text") : e.type === "icon" ? y.push("icon") : e.type === "button" && y.push(""), !e.box && e.vertical && y.push("tooltip-vertical"), e.box && !e.vertical && y.push("tooltip-box"), y.join(" ");
+    }), w = b(() => {
+      const y = [];
+      return e.box && y.push("tooltip-box"), e.vertical && y.push("tooltip-vertical"), n.value && y.push("active"), y;
+    }), m = b(() => r.value?.querySelector("button")?.textContent?.trim() || ""), T = () => window.innerWidth <= 768, S = () => {
+      if (!r.value || !l.value) return;
+      const y = r.value.querySelector("button");
+      if (!y) return;
+      const $ = 12, { clientHeight: C, clientWidth: E } = l.value, { top: D, left: _, right: v, height: M, width: I } = y.getBoundingClientRect(), N = window.innerWidth / 2, H = window.innerHeight / 2;
+      let G, j;
+      const X = [];
+      h.value || e.box || e.vertical ? (D + M > H ? (G = D - C - $, X.push("top")) : (G = D + M + $, X.push("bottom")), _ + I > N ? (j = v - E, X.push("right"), window.innerWidth - (_ + I) > E / 2 && (j = _ + (I - E) / 2, X.splice(X.indexOf("right"), 1))) : (j = _ + (I - E) / 2, j < 0 && (j = _, X.push("left")))) : (G = D + (M - C) / 2, _ + I > N ? (j = _ - E - $, X.push("right")) : j = v + $);
+      const le = window.innerWidth <= 420;
       s.value = {
-        top: `${M}px`,
-        left: j ? "50%" : `${A}px`,
-        transform: j ? "translateX(-50%)" : "none"
-      }, a.value && (a.value.className = `krds-tooltip-popover ${P.join(" ")} ${S.value.join(" ")}`);
-    }, k = async () => {
-      e.disabled || !e.tooltipContent || (n.value = !0, await ue(), y());
-    }, u = () => {
+        top: `${G}px`,
+        left: le ? "50%" : `${j}px`,
+        transform: le ? "translateX(-50%)" : "none"
+      }, l.value && (l.value.className = `krds-tooltip-popover ${X.join(" ")} ${w.value.join(" ")}`);
+    }, x = async () => {
+      e.disabled || !e.tooltipContent || (n.value = !0, await ce(), S());
+    }, c = () => {
       n.value = !1, s.value = {};
-    }, o = (m) => {
-      (m.key === "Escape" || m.key === "Esc") && n.value && u();
+    }, o = (y) => {
+      (y.key === "Escape" || y.key === "Esc") && n.value && c();
     }, i = () => {
-      h.value = C(), n.value && u();
-    }, v = () => {
-      n.value && u();
+      h.value = T(), n.value && c();
+    }, p = () => {
+      n.value && c();
     };
-    return N(() => {
-      h.value = C(), document.addEventListener("keydown", o), window.addEventListener("scroll", v), window.addEventListener("resize", i);
-    }), q(() => {
-      document.removeEventListener("keydown", o), window.removeEventListener("scroll", v), window.removeEventListener("resize", i);
+    return ie(() => {
+      h.value = T(), document.addEventListener("keydown", o), window.addEventListener("scroll", p), window.addEventListener("resize", i);
+    }), re(() => {
+      document.removeEventListener("keydown", o), window.removeEventListener("scroll", p), window.removeEventListener("resize", i);
     }), () => t("div", { ref: r }, [t("button", {
       type: "button",
       class: f.value,
       disabled: e.disabled,
-      "aria-labelledby": d,
-      onMouseover: k,
-      onMouseout: u,
-      onFocusin: k,
-      onFocusout: u
-    }, l.default?.()), W(t("div", {
-      id: d,
-      ref: a,
-      class: ["krds-tooltip-popover", S.value],
+      "aria-labelledby": u,
+      onMouseover: x,
+      onMouseout: c,
+      onFocusin: x,
+      onFocusout: c
+    }, a.default?.()), ve(t("div", {
+      id: u,
+      ref: l,
+      class: ["krds-tooltip-popover", w.value],
       style: s.value,
       "aria-hidden": !n.value,
       role: "tooltip"
     }, [
-      t("span", { class: "sr-only" }, p.value),
+      t("span", { class: "sr-only" }, m.value),
       " ",
       e.tooltipContent
-    ]), [[X, n.value]])]);
+    ]), [[pe, n.value]])]);
   }
-}), Tt = _t, Vt = D({
+}), ia = ra, oa = A({
   name: "KrdsLanguageSwitcher",
   props: {
     languageList: {
@@ -2255,45 +2250,45 @@ var lt = D({
     }
   },
   emits: ["update:modelValue", "close"],
-  setup(e, { emit: l, slots: r }) {
-    const a = _(!1), n = _(), s = _(), d = () => {
-      a.value = !a.value, a.value && n.value && S();
+  setup(e, { emit: a, slots: r }) {
+    const l = B(!1), n = B(), s = B(), u = () => {
+      l.value = !l.value, l.value && n.value && w();
     }, h = () => {
-      a.value = !1;
+      l.value = !1;
     }, f = (i) => {
-      l("update:modelValue", i), h(), l("close"), s.value?.focus();
-    }, S = () => {
+      a("update:modelValue", i), h(), a("close"), s.value?.focus();
+    }, w = () => {
       if (!n.value) return;
       const i = n.value.querySelector(".drop-menu");
       if (!i) return;
-      const v = i.getBoundingClientRect(), m = window.innerWidth;
-      n.value.classList.remove("drop-left", "drop-right"), v.left < 0 ? n.value.classList.add("drop-left") : m < v.left + v.width && n.value.classList.add("drop-right");
-    }, p = (i) => {
+      const p = i.getBoundingClientRect(), y = window.innerWidth;
+      n.value.classList.remove("drop-left", "drop-right"), p.left < 0 ? n.value.classList.add("drop-left") : y < p.left + p.width && n.value.classList.add("drop-right");
+    }, m = (i) => {
       i.key === "Escape" && (h(), s.value?.focus());
-    }, C = (i) => {
+    }, T = (i) => {
       n.value?.contains(i.target) || h();
-    }, y = (i) => {
+    }, S = (i) => {
       n.value?.contains(i.relatedTarget) || h();
-    }, k = (i) => {
+    }, x = (i) => {
       if (!n.value) return;
-      n.value.querySelectorAll(".drop-list .item-link").forEach((m) => {
-        m.style.position = "relative", m.style.zIndex = "0";
+      n.value.querySelectorAll(".drop-list .item-link").forEach((y) => {
+        y.style.position = "relative", y.style.zIndex = "0";
       });
-      const v = i.target;
-      v.style.zIndex = "1";
+      const p = i.target;
+      p.style.zIndex = "1";
     };
-    G(a, (i) => {
-      i ? (document.addEventListener("keydown", p), document.addEventListener("click", C)) : (document.removeEventListener("keydown", p), document.removeEventListener("click", C));
-    }), q(() => {
-      document.removeEventListener("keydown", p), document.removeEventListener("click", C);
+    se(l, (i) => {
+      i ? (document.addEventListener("keydown", m), document.addEventListener("click", T)) : (document.removeEventListener("keydown", m), document.removeEventListener("click", T));
+    }), re(() => {
+      document.removeEventListener("keydown", m), document.removeEventListener("click", T);
     });
-    const u = () => t("ul", { class: "drop-list" }, e.languageList.map((i) => t("li", { key: i.code }, [t("a", {
+    const c = () => t("ul", { class: "drop-list" }, e.languageList.map((i) => t("li", { key: i.code }, [t("a", {
       href: "#",
       class: ["item-link", { active: e.modelValue === i.code }],
       lang: i.code,
       "aria-selected": e.modelValue === i.code,
-      onClick: J(() => f(i.code), ["prevent"]),
-      onFocus: k
+      onClick: ge(() => f(i.code), ["prevent"]),
+      onFocus: x
     }, [
       i.name,
       " ",
@@ -2304,7 +2299,7 @@ var lt = D({
       lang: i.code,
       target: "_blank",
       title: "새 창 열림",
-      onFocus: k
+      onFocus: x
     }, [
       i.name,
       " ",
@@ -2316,32 +2311,32 @@ var lt = D({
         "krds-drop-wrap",
         "krds-language",
         {
-          active: a.value,
+          active: l.value,
           "drop-left": e.dropPosition === "left",
           "drop-right": e.dropPosition === "right"
         }
       ],
-      onFocusout: y
+      onFocusout: S
     }, [t("button", {
       ref: s,
       type: "button",
-      class: ["krds-btn small text drop-btn", { active: a.value }],
-      "aria-expanded": a.value,
-      onClick: d
+      class: ["krds-btn small text drop-btn", { active: l.value }],
+      "aria-expanded": l.value,
+      onClick: u
     }, [
       t("i", { class: "svg-icon ico-global" }),
       r.default?.(),
       t("i", { class: "svg-icon ico-toggle" })
     ]), t("div", {
       class: "drop-menu",
-      style: { display: a.value ? "block" : "none" }
-    }, [t("div", { class: "drop-in" }, [r["prev-item"] ? t("div", { class: "drop-top" }, r["prev-item"]()) : null, e.type === "default" ? u() : e.type === "external" ? o() : null])])]);
+      style: { display: l.value ? "block" : "none" }
+    }, [t("div", { class: "drop-in" }, [r["prev-item"] ? t("div", { class: "drop-top" }, r["prev-item"]()) : null, e.type === "default" ? c() : e.type === "external" ? o() : null])])]);
   }
-}), Et = Vt, zt = D({
+}), da = oa, ua = A({
   name: "KrdsResize",
   emits: ["update:modelValue", "close"],
-  setup(e, { emit: l }) {
-    const r = _(!1), a = _(), n = _(), s = _("md"), d = [
+  setup(e, { emit: a }) {
+    const r = B(!1), l = B(), n = B(), s = B("md"), u = [
       {
         key: "sm",
         label: "작게",
@@ -2368,43 +2363,43 @@ var lt = D({
         zoom: "1.5"
       }
     ], h = () => {
-      r.value = !r.value, r.value && a.value && C();
+      r.value = !r.value, r.value && l.value && T();
     }, f = () => {
       r.value = !1;
-    }, S = (i) => {
-      f(), l("close"), n.value?.focus(), s.value = i.key, document.body.style.zoom = i?.zoom;
-    }, p = () => {
-      const i = d.find((v) => v.key === "md");
-      i && S(i);
-    }, C = () => {
-      if (!a.value) return;
-      const i = a.value.querySelector(".drop-menu");
+    }, w = (i) => {
+      f(), a("close"), n.value?.focus(), s.value = i.key, document.body.style.zoom = i?.zoom;
+    }, m = () => {
+      const i = u.find((p) => p.key === "md");
+      i && w(i);
+    }, T = () => {
+      if (!l.value) return;
+      const i = l.value.querySelector(".drop-menu");
       if (!i) return;
-      const v = i.getBoundingClientRect(), m = window.innerWidth;
-      a.value.classList.remove("drop-left", "drop-right"), v.left < 0 ? a.value.classList.add("drop-left") : m < v.left + v.width && a.value.classList.add("drop-right");
-    }, y = (i) => {
+      const p = i.getBoundingClientRect(), y = window.innerWidth;
+      l.value.classList.remove("drop-left", "drop-right"), p.left < 0 ? l.value.classList.add("drop-left") : y < p.left + p.width && l.value.classList.add("drop-right");
+    }, S = (i) => {
       i.key === "Escape" && (f(), n.value?.focus());
-    }, k = (i) => {
-      a.value?.contains(i.target) || f();
-    }, u = (i) => {
-      a.value?.contains(i.relatedTarget) || f();
+    }, x = (i) => {
+      l.value?.contains(i.target) || f();
+    }, c = (i) => {
+      l.value?.contains(i.relatedTarget) || f();
     }, o = (i) => {
-      if (!a.value) return;
-      a.value.querySelectorAll(".drop-list .item-link").forEach((m) => {
-        m.style.position = "relative", m.style.zIndex = "0";
+      if (!l.value) return;
+      l.value.querySelectorAll(".drop-list .item-link").forEach((y) => {
+        y.style.position = "relative", y.style.zIndex = "0";
       });
-      const v = i.target;
-      v.style.zIndex = "1";
+      const p = i.target;
+      p.style.zIndex = "1";
     };
-    return G(r, (i) => {
-      i ? (document.addEventListener("keydown", y), document.addEventListener("click", k)) : (document.removeEventListener("keydown", y), document.removeEventListener("click", k));
-    }), q(() => {
-      document.removeEventListener("keydown", y), document.removeEventListener("click", k);
+    return se(r, (i) => {
+      i ? (document.addEventListener("keydown", S), document.addEventListener("click", x)) : (document.removeEventListener("keydown", S), document.removeEventListener("click", x));
+    }), re(() => {
+      document.removeEventListener("keydown", S), document.removeEventListener("click", x);
     }), () => t("div", {
-      ref: a,
+      ref: l,
       class: "krds-drop-wrap krds-resize",
       "data-adjust": "scale",
-      onFocusout: u
+      onFocusout: c
     }, [t("button", {
       ref: n,
       type: "button",
@@ -2413,7 +2408,7 @@ var lt = D({
     }, ["화면크기 ", t("i", { class: "svg-icon ico-toggle" })]), t("div", {
       class: "drop-menu",
       style: { display: r.value ? "block" : "none" }
-    }, [t("div", { class: "drop-in" }, [t("ul", { class: "drop-list" }, d.map((i) => t("li", { key: i.key }, [t("button", {
+    }, [t("div", { class: "drop-in" }, [t("ul", { class: "drop-list" }, u.map((i) => t("li", { key: i.key }, [t("button", {
       type: "button",
       class: [
         "item-link",
@@ -2421,17 +2416,17 @@ var lt = D({
         i.key === s.value ? "active" : ""
       ],
       "data-adjust-scale": i.key,
-      onClick: J(() => S(i), ["prevent"]),
+      onClick: ge(() => w(i), ["prevent"]),
       onFocus: o
     }, i.label)]))), t("div", { class: "drop-bottom" }, [t("button", {
       type: "button",
       class: "krds-btn medium text",
       "data-adjust-scale": "md",
-      onClick: J(p, ["prevent"]),
+      onClick: ge(m, ["prevent"]),
       onFocus: o
     }, [t("i", { class: "svg-icon ico-reset" }), " 초기화"])])])])]);
   }
-}), It = zt, At = D({
+}), ca = ua, fa = A({
   name: "KrdsModal",
   props: {
     modelValue: {
@@ -2465,43 +2460,43 @@ var lt = D({
   },
   emits: ["update:modelValue"],
   slots: Object,
-  setup(e, { slots: l, emit: r }) {
-    const a = Se()?.uid, n = g(() => e.modalId ?? `krds-modal-${a}`), s = g({
+  setup(e, { slots: a, emit: r }) {
+    const l = xe()?.uid, n = b(() => e.modalId ?? `krds-modal-${l}`), s = b({
       get: () => e.modelValue,
       set: (i) => r("update:modelValue", i)
-    }), d = g(() => `tit_${n.value}`), h = g(() => ({
+    }), u = b(() => `tit_${n.value}`), h = b(() => ({
       small: "modal-sm",
       medium: "modal-md",
       large: "modal-lg"
     })[e.size]), f = () => {
       s.value = !1;
     };
-    let S = "", p = null;
-    const C = _(null), y = (i) => Array.from(i.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])')).filter((v) => !v.hasAttribute("disabled") && v.getAttribute("tabindex") !== "-1"), k = (i) => {
-      if (!C.value || i.key !== "Tab") return;
-      const v = y(C.value);
-      if (v.length === 0) {
+    let w = "", m = null;
+    const T = B(null), S = (i) => Array.from(i.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])')).filter((p) => !p.hasAttribute("disabled") && p.getAttribute("tabindex") !== "-1"), x = (i) => {
+      if (!T.value || i.key !== "Tab") return;
+      const p = S(T.value);
+      if (p.length === 0) {
         i.preventDefault();
         return;
       }
-      const m = v[0], K = v[v.length - 1];
-      i.shiftKey && document.activeElement === m ? (i.preventDefault(), K.focus()) : !i.shiftKey && document.activeElement === K && (i.preventDefault(), m.focus());
-    }, u = (i) => {
+      const y = p[0], $ = p[p.length - 1];
+      i.shiftKey && document.activeElement === y ? (i.preventDefault(), $.focus()) : !i.shiftKey && document.activeElement === $ && (i.preventDefault(), y.focus());
+    }, c = (i) => {
       i.key === "Escape" && !e.persistent && f();
     }, o = () => {
-      document.body.style.overflow = S, document.removeEventListener("keydown", k), document.removeEventListener("keydown", u), p && (p.focus(), p = null), C.value = null;
+      document.body.style.overflow = w, document.removeEventListener("keydown", x), document.removeEventListener("keydown", c), m && (m.focus(), m = null), T.value = null;
     };
-    return G(() => e.modelValue, async (i) => {
+    return se(() => e.modelValue, async (i) => {
       if (i) {
-        S = document.body.style.overflow, document.body.style.overflow = "hidden", p = document.activeElement, await ue();
-        const v = document.getElementById(n.value);
-        if (v) {
-          C.value = v;
-          const m = v.querySelector(".modal-conts");
-          m && (m.setAttribute("tabindex", "-1"), m.focus()), document.addEventListener("keydown", k), document.addEventListener("keydown", u);
+        w = document.body.style.overflow, document.body.style.overflow = "hidden", m = document.activeElement, await ce();
+        const p = document.getElementById(n.value);
+        if (p) {
+          T.value = p;
+          const y = p.querySelector(".modal-conts");
+          y && (y.setAttribute("tabindex", "-1"), y.focus()), document.addEventListener("keydown", x), document.addEventListener("keydown", c);
         }
       } else o();
-    }, { immediate: !0 }), Q(() => {
+    }, { immediate: !0 }), fe(() => {
       e.modelValue && o();
     }), () => {
       if (!s.value) return null;
@@ -2510,15 +2505,15 @@ var lt = D({
         class: "krds-modal fade in shown",
         role: "dialog",
         "aria-modal": !0,
-        "aria-labelledby": d.value
+        "aria-labelledby": u.value
       };
-      return e.full ? i["data-type"] = "full" : e.bottomSheet && (i["data-type"] = "bottom-sheet"), t(ke, { to: "body" }, t("section", i, [t("div", { class: `modal-dialog ${h.value}` }, [t("div", { class: "modal-content" }, [
-        l.title ? t("div", { class: "modal-header" }, [t("h2", {
-          id: d.value,
+      return e.full ? i["data-type"] = "full" : e.bottomSheet && (i["data-type"] = "bottom-sheet"), t(Ce, { to: "body" }, t("section", i, [t("div", { class: `modal-dialog ${h.value}` }, [t("div", { class: "modal-content" }, [
+        a.title ? t("div", { class: "modal-header" }, [t("h2", {
+          id: u.value,
           class: "modal-title"
-        }, l.title())]) : null,
-        t("div", { class: "modal-conts" }, [t("div", { class: "conts-area" }, l.default?.())]),
-        l.footer ? t("div", { class: "modal-btn btn-wrap" }, l.footer()) : null,
+        }, a.title())]) : null,
+        t("div", { class: "modal-conts" }, [t("div", { class: "conts-area" }, a.default?.())]),
+        a.footer ? t("div", { class: "modal-btn btn-wrap" }, a.footer()) : null,
         t("button", {
           type: "button",
           class: "krds-btn medium icon btn-close close-modal",
@@ -2530,7 +2525,7 @@ var lt = D({
       })]));
     };
   }
-}), Ft = At, Mt = D({
+}), va = fa, pa = A({
   name: "KrdsAccordionGroup",
   props: {
     typeLine: {
@@ -2542,14 +2537,14 @@ var lt = D({
       default: void 0
     }
   },
-  setup(e, { slots: l }) {
-    const r = g(() => {
-      const a = ["krds-accordion"];
-      return e.typeLine && a.push("type-line"), e.class && a.push(e.class), a;
+  setup(e, { slots: a }) {
+    const r = b(() => {
+      const l = ["krds-accordion"];
+      return e.typeLine && l.push("type-line"), e.class && l.push(e.class), l;
     });
-    return () => t("div", { class: r.value }, l.default?.());
+    return () => t("div", { class: r.value }, a.default?.());
   }
-}), Pt = Mt, Rt = D({
+}), ga = pa, ha = A({
   name: "KrdsAccordionItem",
   props: {
     id: {
@@ -2570,18 +2565,18 @@ var lt = D({
     }
   },
   emits: ["toggle"],
-  setup(e, { emit: l, slots: r }) {
-    const a = g(() => e.openItem === e.id), n = () => {
-      l("toggle", e.id);
+  setup(e, { emit: a, slots: r }) {
+    const l = b(() => e.openItem === e.id), n = () => {
+      a("toggle", e.id);
     };
     return () => t("div", {
       id: e.id,
-      class: ["accordion-item", { active: a.value }]
+      class: ["accordion-item", { active: l.value }]
     }, [t("h5", { class: "accordion-header" }, [t("button", {
       id: `accordion-header-${e.id}`,
       type: "button",
-      class: ["btn-accordion", { active: a.value }],
-      "aria-expanded": a.value,
+      class: ["btn-accordion", { active: l.value }],
+      "aria-expanded": l.value,
       "aria-controls": `accordion-collapse-${e.id}`,
       onClick: n
     }, r.title?.() ?? e.title)]), t("div", {
@@ -2591,7 +2586,7 @@ var lt = D({
       "aria-labelledby": `accordion-header-${e.id}`
     }, [t("div", { class: "accordion-body" }, r.content?.() ?? e.content)])]);
   }
-}), qt = Rt, Ht = D({
+}), ya = ha, ma = A({
   name: "KrdsTts",
   props: {
     text: {
@@ -2625,34 +2620,34 @@ var lt = D({
     "end",
     "error"
   ],
-  setup(e, { emit: l }) {
-    const r = _(!1);
-    let a = null;
+  setup(e, { emit: a }) {
+    const r = B(!1);
+    let l = null;
     const n = () => {
-      typeof window < "u" && window.speechSynthesis && window.speechSynthesis.cancel(), r.value = !1, a = null;
+      typeof window < "u" && window.speechSynthesis && window.speechSynthesis.cancel(), r.value = !1, l = null;
     }, s = () => {
       if (!e.disabled) {
         if (r.value) {
-          n(), l("pause");
+          n(), a("pause");
           return;
         }
         if (typeof window > "u" || !window.speechSynthesis) {
-          l("error", /* @__PURE__ */ new Error("SpeechSynthesis API is not supported"));
+          a("error", /* @__PURE__ */ new Error("SpeechSynthesis API is not supported"));
           return;
         }
-        window.speechSynthesis.cancel(), a = new SpeechSynthesisUtterance(e.text), a.lang = "ko-KR", a.onstart = () => {
+        window.speechSynthesis.cancel(), l = new SpeechSynthesisUtterance(e.text), l.lang = "ko-KR", l.onstart = () => {
           r.value = !0;
-        }, a.onend = () => {
-          r.value = !1, a = null, l("end");
-        }, a.onerror = (f) => {
-          r.value = !1, a = null, f.error !== "canceled" && l("error", new Error(f.error));
-        }, window.speechSynthesis.speak(a), l("play", e.text);
+        }, l.onend = () => {
+          r.value = !1, l = null, a("end");
+        }, l.onerror = (f) => {
+          r.value = !1, l = null, f.error !== "canceled" && a("error", new Error(f.error));
+        }, window.speechSynthesis.speak(l), a("play", e.text);
       }
-    }, d = g(() => {
+    }, u = b(() => {
       const f = ["krds-tts"];
       return e.size && f.push(e.size), r.value ? f.push("pause") : e.icon === "play" && f.push("play"), e.class && f.push(e.class), f;
-    }), h = g(() => r.value ? "ico-stop" : e.icon === "play" ? "ico-play" : "ico-volume");
-    return Q(() => {
+    }), h = b(() => r.value ? "ico-stop" : e.icon === "play" ? "ico-play" : "ico-volume");
+    return fe(() => {
       n();
     }), () => {
       const f = [t("span", {
@@ -2661,13 +2656,13 @@ var lt = D({
       }, [t("i", { class: `svg-icon ${h.value}` })])];
       return e.label && f.push(t("span", { class: "krds-tts-text" }, e.label)), t("button", {
         type: "button",
-        class: d.value,
+        class: u.value,
         disabled: e.disabled || void 0,
         onClick: s
       }, f);
     };
   }
-}), Nt = Ht, Ot = D({
+}), ba = ma, ka = A({
   name: "KrdsTable",
   props: {
     caption: {
@@ -2689,105 +2684,98 @@ var lt = D({
   },
   emits: ["row-click"],
   slots: Object,
-  setup(e, { emit: l, slots: r }) {
-    const a = g(() => {
-      const u = ["tbl"];
-      return e.class && u.push(e.class), u;
-    }), n = g(() => ["krds-table-wrap"]), s = (u) => u.headerStyle || void 0, d = (u) => {
+  setup(e, { emit: a, slots: r }) {
+    const l = b(() => {
+      const c = ["tbl"];
+      return e.class && c.push(e.class), c;
+    }), n = b(() => ["krds-table-wrap"]), s = (c) => c.headerStyle || void 0, u = (c) => {
       const o = [];
-      return u.align && o.push(`text-${u.align}`), u.headerClasses && o.push(u.headerClasses), o.length > 0 ? o : void 0;
-    }, h = (u, o) => {
+      return c.align && o.push(`text-${c.align}`), c.headerClasses && o.push(c.headerClasses), o.length > 0 ? o : void 0;
+    }, h = (c, o) => {
       if (o.style)
-        return typeof o.style == "function" ? o.style(u) : o.style;
-    }, f = (u, o) => {
+        return typeof o.style == "function" ? o.style(c) : o.style;
+    }, f = (c, o) => {
       const i = [];
       if (o.align && i.push(`text-${o.align}`), o.classes) {
-        const v = typeof o.classes == "function" ? o.classes(u) : o.classes;
-        i.push(v);
+        const p = typeof o.classes == "function" ? o.classes(c) : o.classes;
+        i.push(p);
       }
       return i.length > 0 ? i : void 0;
-    }, S = () => !e.columns.length || !e.columns.some((u) => u.headerStyle && u.headerStyle.includes("width")) ? null : t("colgroup", e.columns.map((u) => {
-      if (!u.headerStyle) return t("col");
-      const o = u.headerStyle.match(/width\s*:\s*([^;]+)/i);
+    }, w = () => !e.columns.length || !e.columns.some((c) => c.headerStyle && c.headerStyle.includes("width")) ? null : t("colgroup", e.columns.map((c) => {
+      if (!c.headerStyle) return t("col");
+      const o = c.headerStyle.match(/width\s*:\s*([^;]+)/i);
       return t("col", { style: o ? { width: o[1].trim() } : void 0 });
-    })), p = () => {
+    })), m = () => {
       if (!e.columns.length) return null;
-      const u = e.columns.map((o) => {
-        const i = s(o), v = d(o);
+      const c = e.columns.map((o) => {
+        const i = s(o), p = u(o);
         return t("th", {
           scope: "col",
-          class: v,
+          class: p,
           style: i
         }, o.label);
       });
-      return t("thead", [t("tr", u)]);
-    }, C = (u, o) => typeof o.field == "function" ? o.field(u) : u[o.field], y = () => {
+      return t("thead", [t("tr", c)]);
+    }, T = (c, o) => typeof o.field == "function" ? o.field(c) : c[o.field], S = () => {
       if (!e.rows.length) return t("tbody", [t("tr", [t("td", {
         colspan: e.columns.length || 1,
         class: "text-center"
       }, r["no-data"] ? r["no-data"]() : "데이터가 없습니다.")])]);
-      const u = e.rows.map((o, i) => {
-        const v = e.columns.map((m, K) => {
-          const b = C(o, m), w = typeof b == "function" ? b() : b, x = h(o, m), L = f(o, m);
-          return t(K === 0 ? "th" : "td", {
-            scope: K === 0 ? "row" : void 0,
-            class: L,
-            style: x
-          }, w);
+      const c = e.rows.map((o, i) => {
+        const p = e.columns.map((y, $) => {
+          const C = T(o, y), E = typeof C == "function" ? C() : C, D = h(o, y), _ = f(o, y);
+          return t($ === 0 ? "th" : "td", {
+            scope: $ === 0 ? "row" : void 0,
+            class: _,
+            style: D
+          }, E);
         });
-        return t("tr", { onClick: () => k(o, i) }, v);
+        return t("tr", { onClick: () => x(o, i) }, p);
       });
-      return t("tbody", u);
-    }, k = (u, o) => {
-      l("row-click", u, o);
+      return t("tbody", c);
+    }, x = (c, o) => {
+      a("row-click", c, o);
     };
-    return () => t("div", { class: n.value }, [t("table", { class: a.value }, [
+    return () => t("div", { class: n.value }, [t("table", { class: l.value }, [
       e.caption && t("caption", e.caption),
-      S(),
-      p(),
-      y()
+      w(),
+      m(),
+      S()
     ])]);
   }
-}), jt = Ot, Wt = D({
+}), Sa = ka, wa = A({
   name: "KrdsHeader",
   props: {
     id: {
       type: String,
       default: "krds-header"
     },
-    mobileNavId: {
-      type: String,
-      default: "mobile-nav"
-    },
     class: {
       type: String,
       default: void 0
     }
   },
   slots: Object,
-  setup(e, { slots: l }) {
-    const r = g(() => {
-      const a = [];
-      return e.class && a.push(e.class), a;
+  setup(e, { slots: a }) {
+    const r = b(() => {
+      const l = [];
+      return e.class && l.push(e.class), l;
     });
     return () => {
-      const a = [];
-      if (l.utility || l.branding) {
+      const l = [];
+      if (a.utility || a.branding) {
         const s = [];
-        l.utility && s.push(t("div", { class: "header-utility" }, l.utility())), l.branding && s.push(t("div", { class: "header-branding" }, l.branding())), a.push(t("div", { class: "header-container" }, [t("div", { class: "inner" }, s)]));
+        a.utility && s.push(t("div", { class: "header-utility" }, a.utility())), a.branding && s.push(t("div", { class: "header-branding" }, a.branding())), l.push(t("div", { class: "header-container" }, [t("div", { class: "inner" }, s)]));
       }
-      l.navigation && a.push(t("nav", { class: "krds-main-menu" }, [t("div", { class: "inner" }, l.navigation())]));
-      const n = [t("div", { class: "header-in" }, a)];
-      return l.mobileNavigation && n.push(t("div", {
-        id: e.mobileNavId,
-        class: "krds-main-menu-mobile"
-      }, l.mobileNavigation())), t("header", {
+      a.navigation && l.push(...a.navigation());
+      const n = [t("div", { class: "header-in" }, l)];
+      return a.mobileNavigation && n.push(...a.mobileNavigation()), t("header", {
         id: e.id,
         class: r.value
       }, n);
     };
   }
-}), Gt = Wt, Yt = D({
+}), Ka = wa, Ca = A({
   name: "KrdsFooter",
   props: {
     id: {
@@ -2799,22 +2787,22 @@ var lt = D({
       default: void 0
     }
   },
-  setup(e, { slots: l }) {
-    const r = g(() => {
+  setup(e, { slots: a }) {
+    const r = b(() => {
       const h = [];
       return e.class && h.push(e.class), h;
-    }), a = () => l.top ? t("div", { class: "foot-quick" }, [t("div", { class: "inner" }, l.top())]) : null, n = () => l.logo ? t("div", { class: "f-logo" }, l.logo()) : null, s = () => l.content ? t("div", { class: "f-cnt" }, l.content()) : null, d = () => l.bottom ? t("div", { class: "f-btm" }, l.bottom()) : null;
+    }), l = () => a.top ? t("div", { class: "foot-quick" }, [t("div", { class: "inner" }, a.top())]) : null, n = () => a.logo ? t("div", { class: "f-logo" }, a.logo()) : null, s = () => a.content ? t("div", { class: "f-cnt" }, a.content()) : null, u = () => a.bottom ? t("div", { class: "f-btm" }, a.bottom()) : null;
     return () => {
-      const h = a(), f = n(), S = s(), p = d(), C = [];
-      f && C.push(f), S && C.push(S), p && C.push(p);
-      const y = [];
-      return h && y.push(h), C.length > 0 && y.push(t("div", { class: "inner" }, C)), t("footer", {
+      const h = l(), f = n(), w = s(), m = u(), T = [];
+      f && T.push(f), w && T.push(w), m && T.push(m);
+      const S = [];
+      return h && S.push(h), T.length > 0 && S.push(t("div", { class: "inner" }, T)), t("footer", {
         id: e.id,
         class: r.value
-      }, y);
+      }, S);
     };
   }
-}), Ut = Yt, Xt = D({
+}), xa = Ca, $a = A({
   name: "KrdsDisclosure",
   props: {
     title: {
@@ -2827,9 +2815,9 @@ var lt = D({
     }
   },
   emits: ["update:modelValue"],
-  setup(e, { emit: l, slots: r }) {
-    const a = `disclosure-${O()}`, n = g(() => e.modelValue), s = () => {
-      l("update:modelValue", !e.modelValue);
+  setup(e, { emit: a, slots: r }) {
+    const l = `disclosure-${de()}`, n = b(() => e.modelValue), s = () => {
+      a("update:modelValue", !e.modelValue);
     };
     return () => t("div", { class: [
       "krds-disclosure",
@@ -2840,14 +2828,14 @@ var lt = D({
       class: "btn-conts-expand",
       onClick: s,
       "aria-expanded": n.value,
-      "aria-controls": a
+      "aria-controls": l
     }, e.title), t("div", {
-      id: a,
+      id: l,
       class: "expand-wrap",
       inert: !n.value
     }, [t("div", { class: "expand-in" }, r.default?.())])]);
   }
-}), Jt = Xt, Qt = D({
+}), La = $a, Da = A({
   name: "KrdsIdentifier",
   props: {
     class: {
@@ -2860,19 +2848,19 @@ var lt = D({
     }
   },
   emits: ["click"],
-  setup(e, { emit: l, slots: r }) {
-    const a = g(() => {
+  setup(e, { emit: a, slots: r }) {
+    const l = b(() => {
       const s = ["krds-identifier"];
       return e.class && s.push(e.class), s;
     }), n = (s) => {
-      l("click", s);
+      a("click", s);
     };
     return () => t("div", {
-      class: a.value,
+      class: l.value,
       onClick: n
     }, [t("span", { class: "logo" }, [t("span", { class: "sr-only" }, e.logoLabel)]), t("span", { class: "ban-txt" }, r.default?.())]);
   }
-}), Zt = Qt, ea = 50, ta = D({
+}), Ba = Da, Ea = 50, Ta = A({
   name: "KrdsLayout",
   props: {
     id: {
@@ -2893,46 +2881,46 @@ var lt = D({
     scroll: (e) => !0,
     "scroll-height": (e) => !0
   },
-  setup(e, { slots: l, emit: r }) {
-    const a = _(0), n = _(0), s = _(0), d = _(null), h = _(null), f = _(null), S = () => {
-      const u = n.value;
-      a.value = window.scrollY, n.value = document.body.scrollHeight, u !== n.value && u > 0 && r("scroll-height", n.value);
-    }, p = () => {
+  setup(e, { slots: a, emit: r }) {
+    const l = B(0), n = B(0), s = B(0), u = B(null), h = B(null), f = B(null), w = () => {
+      const c = n.value;
+      l.value = window.scrollY, n.value = document.body.scrollHeight, c !== n.value && c > 0 && r("scroll-height", n.value);
+    }, m = () => {
       if (!h.value || !e.enableScrollDetection) return;
-      const u = document.querySelector("#container");
-      if (!u) return;
-      const o = u.offsetTop, i = window.scrollY, v = i > s.value, m = i < s.value;
-      i > o + ea ? v ? (h.value.classList.add("scroll-down"), h.value.classList.remove("scroll-up"), d.value = "down") : m && (h.value.classList.add("scroll-up"), h.value.classList.remove("scroll-down"), d.value = "up") : (h.value.classList.remove("scroll-down", "scroll-up"), d.value = null), s.value = i;
-    }, C = () => {
-      S(), p(), r("scroll", {
-        scrollY: a.value,
+      const c = document.querySelector("#container");
+      if (!c) return;
+      const o = c.offsetTop, i = window.scrollY, p = i > s.value, y = i < s.value;
+      i > o + Ea ? p ? (h.value.classList.add("scroll-down"), h.value.classList.remove("scroll-up"), u.value = "down") : y && (h.value.classList.add("scroll-up"), h.value.classList.remove("scroll-down"), u.value = "up") : (h.value.classList.remove("scroll-down", "scroll-up"), u.value = null), s.value = i;
+    }, T = () => {
+      w(), m(), r("scroll", {
+        scrollY: l.value,
         scrollHeight: n.value,
-        direction: d.value,
+        direction: u.value,
         timestamp: Date.now()
       });
-    }, y = (u) => {
-      for (const o of u) {
-        const { width: i, height: v } = o.contentRect;
+    }, S = (c) => {
+      for (const o of c) {
+        const { width: i, height: p } = o.contentRect;
         r("resize", {
           width: i,
-          height: v
+          height: p
         });
       }
-    }, k = g(() => {
-      const u = ["g-wrap"];
-      return e.class && u.push(e.class), u;
+    }, x = b(() => {
+      const c = ["g-wrap"];
+      return e.class && c.push(e.class), c;
     });
-    return N(() => {
-      e.enableScrollDetection && (S(), window.addEventListener("scroll", C, { passive: !0 })), h.value && typeof ResizeObserver < "u" && (f.value = new ResizeObserver(y), f.value.observe(h.value));
-    }), q(() => {
-      e.enableScrollDetection && window.removeEventListener("scroll", C), f.value && (f.value.disconnect(), f.value = null);
+    return ie(() => {
+      e.enableScrollDetection && (w(), window.addEventListener("scroll", T, { passive: !0 })), h.value && typeof ResizeObserver < "u" && (f.value = new ResizeObserver(S), f.value.observe(h.value));
+    }), re(() => {
+      e.enableScrollDetection && window.removeEventListener("scroll", T), f.value && (f.value.disconnect(), f.value = null);
     }), () => t("div", {
       id: e.id,
-      class: k.value,
+      class: x.value,
       ref: h
-    }, l.default?.());
+    }, a.default?.());
   }
-}), aa = ta, la = D({
+}), _a = Ta, Ma = A({
   name: "KrdsSideNavigation",
   props: {
     title: {
@@ -2945,161 +2933,161 @@ var lt = D({
     }
   },
   emits: ["update:modelValue"],
-  setup(e, { emit: l }) {
-    const r = g(() => e.modelValue || []), a = _(/* @__PURE__ */ new Map()), n = _(/* @__PURE__ */ new Map()), s = _(/* @__PURE__ */ new Map()), d = _(null), h = (K, b, w) => {
-      const x = `${b}-${w}`;
-      K ? a.value.set(x, K) : a.value.delete(x);
-    }, f = (K, b, w) => {
-      const x = `${b}-${w}`;
-      K ? n.value.set(x, K) : n.value.delete(x);
-    }, S = (K, b, w) => {
-      const x = `${b}-${w}`;
-      K ? s.value.set(x, K) : s.value.delete(x);
-    }, p = (K) => {
-      l("update:modelValue", r.value.map((b, w) => {
-        if (w === K && b.subItems) {
-          const x = b.expanded, L = {
-            ...b,
-            expanded: !b.expanded
+  setup(e, { emit: a }) {
+    const r = b(() => e.modelValue || []), l = B(/* @__PURE__ */ new Map()), n = B(/* @__PURE__ */ new Map()), s = B(/* @__PURE__ */ new Map()), u = B(null), h = ($, C, E) => {
+      const D = `${C}-${E}`;
+      $ ? l.value.set(D, $) : l.value.delete(D);
+    }, f = ($, C, E) => {
+      const D = `${C}-${E}`;
+      $ ? n.value.set(D, $) : n.value.delete(D);
+    }, w = ($, C, E) => {
+      const D = `${C}-${E}`;
+      $ ? s.value.set(D, $) : s.value.delete(D);
+    }, m = ($) => {
+      a("update:modelValue", r.value.map((C, E) => {
+        if (E === $ && C.subItems) {
+          const D = C.expanded, _ = {
+            ...C,
+            expanded: !C.expanded
           };
-          return x && !L.expanded && (L.subItems = b.subItems.map((c) => ({
-            ...c,
+          return D && !_.expanded && (_.subItems = C.subItems.map((v) => ({
+            ...v,
             expanded: !1
-          })), d.value = null), L;
+          })), u.value = null), _;
         }
-        return b;
+        return C;
       }));
-    }, C = (K, b) => {
-      l("update:modelValue", r.value.map((w, x) => x === K && w.subItems ? {
-        ...w,
-        subItems: w.subItems.map((L, c) => {
-          if (c === b && L.subItems) {
-            const B = {
-              ...L,
-              expanded: !L.expanded
+    }, T = ($, C) => {
+      a("update:modelValue", r.value.map((E, D) => D === $ && E.subItems ? {
+        ...E,
+        subItems: E.subItems.map((_, v) => {
+          if (v === C && _.subItems) {
+            const M = {
+              ..._,
+              expanded: !_.expanded
             };
-            if (B.expanded) {
-              const V = `${K}-${b}`;
-              d.value = a.value.get(V) || null;
-              const I = n.value.get(V), E = s.value.get(V);
-              I && E && I.addEventListener("transitionend", () => {
-                E.focus();
+            if (M.expanded) {
+              const I = `${$}-${C}`;
+              u.value = l.value.get(I) || null;
+              const N = n.value.get(I), H = s.value.get(I);
+              N && H && N.addEventListener("transitionend", () => {
+                H.focus();
               }, { once: !0 });
             }
-            return B;
+            return M;
           }
-          return L;
+          return _;
         })
-      } : w));
-    }, y = (K, b) => {
-      l("update:modelValue", r.value.map((w, x) => x === K && w.subItems ? {
-        ...w,
-        subItems: w.subItems.map((L, c) => {
-          if (c === b && L.subItems && L.expanded) {
-            if (d.value) {
-              const B = d.value;
+      } : E));
+    }, S = ($, C) => {
+      a("update:modelValue", r.value.map((E, D) => D === $ && E.subItems ? {
+        ...E,
+        subItems: E.subItems.map((_, v) => {
+          if (v === C && _.subItems && _.expanded) {
+            if (u.value) {
+              const M = u.value;
               requestAnimationFrame(() => {
-                B.focus();
-              }), d.value = null;
+                M.focus();
+              }), u.value = null;
             }
             return {
-              ...L,
+              ..._,
               expanded: !1
             };
           }
-          return L;
+          return _;
         })
-      } : w));
-    }, k = (K, b, w) => {
-      const x = `${b}-${w}`, L = n.value.get(x);
-      L && !L.contains(K.relatedTarget) && y(b, w);
-    }, u = (K, b) => {
-      y(K, b);
-    }, o = (K, b) => {
-      K.onClick && K.onClick(b);
-    }, i = (K, b, w) => K.map((x, L) => t("li", {
-      key: `popup-item-${b}-${w}-${L}`,
+      } : E));
+    }, x = ($, C, E) => {
+      const D = `${C}-${E}`, _ = n.value.get(D);
+      _ && !_.contains($.relatedTarget) && S(C, E);
+    }, c = ($, C) => {
+      S($, C);
+    }, o = ($, C) => {
+      $.onClick && $.onClick(C);
+    }, i = ($, C, E) => $.map((D, _) => t("li", {
+      key: `popup-item-${C}-${E}-${_}`,
       role: "none"
     }, t("a", {
-      href: x.href || "#",
+      href: D.href || "#",
       class: "lnb-btn",
       role: "menuitem",
-      onClick: (c) => o(x, c)
-    }, x.text))), v = (K, b) => K.map((w, x) => {
-      const L = `lnb-subitem-${b}-${x}`;
+      onClick: (v) => o(D, v)
+    }, D.text))), p = ($, C) => $.map((E, D) => {
+      const _ = `lnb-subitem-${C}-${D}`;
       return t("li", {
-        key: L,
-        class: ["lnb-subitem", { active: w.expanded }],
+        key: _,
+        class: ["lnb-subitem", { active: E.expanded }],
         role: "none"
-      }, [w.subItems ? [t("button", {
-        ref: (c) => h(c, b, x),
+      }, [E.subItems ? [t("button", {
+        ref: (v) => h(v, C, D),
         type: "button",
         class: "lnb-btn lnb-toggle-popup",
         role: "menuitem",
-        "aria-controls": `lnbmenu-${b}-${x}`,
-        "aria-expanded": w.expanded ? "true" : "false",
+        "aria-controls": `lnbmenu-${C}-${D}`,
+        "aria-expanded": E.expanded ? "true" : "false",
         "aria-haspopup": "true",
-        onClick: () => C(b, x)
-      }, w.text), t("div", {
-        ref: (c) => f(c, b, x),
-        id: `lnbmenu-${b}-${x}`,
-        class: ["lnb-submenu-lv2", { active: w.expanded }],
+        onClick: () => T(C, D)
+      }, E.text), t("div", {
+        ref: (v) => f(v, C, D),
+        id: `lnbmenu-${C}-${D}`,
+        class: ["lnb-submenu-lv2", { active: E.expanded }],
         role: "menu",
-        onFocusout: (c) => k(c, b, x)
+        onFocusout: (v) => x(v, C, D)
       }, [t("button", {
-        ref: (c) => S(c, b, x),
+        ref: (v) => w(v, C, D),
         type: "button",
         class: "lnb-btn-tit",
-        onClick: () => u(b, x)
-      }, w.popupTitle || w.text), t("ul", {}, i(w.subItems || [], b, x))])] : t("a", {
-        href: w.href || "#",
+        onClick: () => c(C, D)
+      }, E.popupTitle || E.text), t("ul", {}, i(E.subItems || [], C, D))])] : t("a", {
+        href: E.href || "#",
         class: ["lnb-btn", "lnb-link"],
         role: "menuitem",
-        onClick: (c) => o(w, c)
-      }, w.text)]);
-    }), m = () => r.value.map((K, b) => t("li", {
-      key: `lnb-item-${b}`,
-      class: ["lnb-item", { active: K.expanded }],
+        onClick: (v) => o(E, v)
+      }, E.text)]);
+    }), y = () => r.value.map(($, C) => t("li", {
+      key: `lnb-item-${C}`,
+      class: ["lnb-item", { active: $.expanded }],
       role: "none"
     }, [t("button", {
       type: "button",
       class: [
         "lnb-btn",
         "lnb-toggle",
-        { active: K.expanded }
+        { active: $.expanded }
       ],
       role: "menuitem",
-      "aria-controls": `lnbmenu-${b}`,
-      "aria-expanded": K.expanded ? "true" : "false",
-      onClick: () => p(b)
-    }, K.text), K.subItems ? t("div", { class: "lnb-submenu" }, [t("ul", {
-      id: `lnbmenu-${b}`,
+      "aria-controls": `lnbmenu-${C}`,
+      "aria-expanded": $.expanded ? "true" : "false",
+      onClick: () => m(C)
+    }, $.text), $.subItems ? t("div", { class: "lnb-submenu" }, [t("ul", {
+      id: `lnbmenu-${C}`,
       role: "menu"
-    }, v(K.subItems, b))]) : null]));
+    }, p($.subItems, C))]) : null]));
     return () => t("nav", { class: "krds-side-navigation" }, [t("h2", { class: "lnb-tit" }, e.title), t("ul", {
       class: "lnb-list",
       role: "menubar"
-    }, m())]);
+    }, y())]);
   }
-}), na = la, sa = D({
+}), Aa = Ma, Va = A({
   name: "KrdsStructuredList",
   props: { full: {
     type: Boolean,
     default: !0
   } },
   slots: Object,
-  setup(e, { slots: l }) {
+  setup(e, { slots: a }) {
     return () => {
-      const r = l.cardTop?.(), a = l.cardBody?.(), n = l.cardBtm?.(), s = l.cardBtn?.(), d = t("li", { class: "structured-item" }, [t("div", { class: "in" }, [
+      const r = a.cardTop?.(), l = a.cardBody?.(), n = a.cardBtm?.(), s = a.cardBtn?.(), u = t("li", { class: "structured-item" }, [t("div", { class: "in" }, [
         r && t("div", { class: "card-top" }, r),
-        a && t("div", { class: "card-body" }, a),
+        l && t("div", { class: "card-body" }, l),
         n && t("div", { class: "card-btm" }, n),
         s && t("div", { class: "card-btn" }, s)
       ].filter(Boolean))]);
-      return t("ul", { class: ["krds-structured-list", e.full ? "type-full" : ""] }, [d]);
+      return t("ul", { class: ["krds-structured-list", e.full ? "type-full" : ""] }, [u]);
     };
   }
-}), ra = sa, ia = D({
+}), Pa = Va, za = A({
   name: "KrdsTextList",
   props: {
     type: {
@@ -3111,10 +3099,10 @@ var lt = D({
       default: "dash"
     }
   },
-  setup(e, { slots: l }) {
-    return () => t(e.type, { class: ["krds-info-list", e.variant] }, l.default?.());
+  setup(e, { slots: a }) {
+    return () => t(e.type, { class: ["krds-info-list", e.variant] }, a.default?.());
   }
-}), oa = ia, da = D({
+}), Fa = za, Ra = A({
   name: "KrdsCriticalAlerts",
   props: {
     type: {
@@ -3135,13 +3123,13 @@ var lt = D({
     }
   },
   emits: ["link-click"],
-  setup(e, { emit: l }) {
+  setup(e, { emit: a }) {
     const r = (n) => ({
       danger: "긴급",
       ok: "안전",
       info: "안내"
-    })[n], a = (n) => {
-      l("link-click", n);
+    })[n], l = (n) => {
+      a("link-click", n);
     };
     return () => t("ul", { class: "krds-critical-alerts" }, [t("li", [t("div", { class: "critical-ban" }, [
       t("span", { class: ["critical-badge", e.type] }, r(e.type)),
@@ -3149,117 +3137,810 @@ var lt = D({
       e.linkHref && t("a", {
         href: e.linkHref,
         class: "krds-btn medium link basic",
-        onClick: a
+        onClick: l
       }, [t("span", { class: "m-hide" }, e.linkText), t("i", { class: "svg-icon ico-angle right" })])
     ])])]);
   }
-}), ua = da, de = /* @__PURE__ */ ce({
-  KrdsAccordionGroup: () => Pt,
-  KrdsAccordionItem: () => qt,
-  KrdsBadge: () => Ue,
-  KrdsBreadcrumb: () => bt,
-  KrdsButton: () => Ce,
-  KrdsButtonGroup: () => xe,
-  KrdsCheckArea: () => rt,
-  KrdsCheckbox: () => ot,
-  KrdsCoachMark: () => Dt,
-  KrdsContextualHelp: () => Bt,
-  KrdsCriticalAlerts: () => ua,
-  KrdsDateInput: () => Re,
-  KrdsDisclosure: () => Jt,
-  KrdsFileUpload: () => Ge,
-  KrdsFooter: () => Ut,
-  KrdsFormGroup: () => Ie,
-  KrdsFormHint: () => Ee,
-  KrdsFormLabel: () => Te,
-  KrdsHeader: () => Gt,
-  KrdsIcon: () => $e,
-  KrdsIdentifier: () => Zt,
-  KrdsInPageNavigation: () => St,
-  KrdsInput: () => De,
-  KrdsLanguageSwitcher: () => Et,
-  KrdsLayout: () => aa,
-  KrdsLink: () => Be,
-  KrdsMasthead: () => tt,
-  KrdsModal: () => Ft,
-  KrdsPagination: () => wt,
-  KrdsPanel: () => xt,
-  KrdsRadio: () => ut,
-  KrdsResize: () => It,
-  KrdsSelect: () => Oe,
-  KrdsSideNavigation: () => na,
-  KrdsSkipLink: () => gt,
-  KrdsSpinner: () => ct,
-  KrdsStep: () => pt,
-  KrdsStepIndicator: () => vt,
-  KrdsStructuredList: () => ra,
-  KrdsTable: () => jt,
-  KrdsTag: () => Je,
-  KrdsTagGroup: () => Ze,
-  KrdsTextList: () => oa,
-  KrdsTextarea: () => He,
-  KrdsToggleSwitch: () => nt,
-  KrdsTooltip: () => Tt,
-  KrdsTts: () => Nt
-}), pe = "0.0.15", ha = { install(e, l = {}) {
-  e.provide("krds:config", l), (l.components || Object.keys(de)).forEach((r) => {
-    const a = de[r];
-    a && e.component(r, a);
-  }), typeof U == "object" && U !== null && "installDirectives" in U && he(e), e.config.globalProperties.$krds = { version: pe };
-} }, pa = pe;
+}), Ia = Ra, Ha = "새 창 열림", Oa = 100, we = 400, Na = 'a[href], button:not([disabled]), input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"])', qa = A({
+  name: "KrdsMainMenu",
+  props: {
+    items: {
+      type: Array,
+      default: () => []
+    },
+    variant: {
+      type: String,
+      default: "pc"
+    },
+    ariaLabel: {
+      type: String,
+      default: "메인 메뉴"
+    },
+    open: {
+      type: Boolean,
+      default: !1
+    },
+    mobileId: {
+      type: String,
+      default: "mobile-nav"
+    },
+    backdrop: {
+      type: Boolean,
+      default: !0
+    },
+    closeLabel: {
+      type: String,
+      default: "전체메뉴 닫기"
+    }
+  },
+  emits: [
+    "update:open",
+    "menu-toggle",
+    "item-click"
+  ],
+  slots: Object,
+  setup(e, { emit: a, slots: r }) {
+    const l = de(), n = B(null), s = B(null), u = B(null), h = b(() => e.variant === "pc"), f = (d) => `${l}-gnb-panel-${d}`, w = (d, g) => `${l}-gnb-sub-${d}-${g}`, m = (d) => `${l}-gnb-tab-${d}`, T = (d, g) => `${l}-gnb-depth3-${d}-${g}`, S = (d) => !!d?.subItems?.length, x = (d) => !S(d) && !!d?.items?.length, c = (d) => S(d) || x(d), o = (d) => !d.items?.length, i = (d) => d ? {
+      target: "_blank",
+      rel: "noopener noreferrer",
+      title: Ha
+    } : {}, p = (d, g) => {
+      d.onClick?.(g), a("item-click", d, g);
+    }, y = B(-1), $ = B({}), C = B(0), E = /* @__PURE__ */ new Map(), D = /* @__PURE__ */ new Map(), _ = (d, g, K) => {
+      g ? d.set(K, g) : d.delete(K);
+    }, v = (d) => {
+      const g = d?.subItems?.findIndex((K) => !o(K));
+      return g === void 0 ? -1 : g;
+    }, M = (d) => {
+      const g = $.value[d];
+      return g === void 0 ? v(e.items[d]) : g;
+    }, I = (d) => {
+      if (typeof document > "u") return;
+      document.body.classList.toggle("is-gnb-web", d);
+      const g = document.body.scrollHeight > window.innerHeight;
+      document.body.classList.toggle("hasScrollY", d && g);
+    }, N = async () => {
+      await ce();
+      const d = E.get(y.value)?.querySelector(".gnb-sub-list.active");
+      C.value = d?.scrollHeight ?? 0;
+    }, H = (d = !1) => {
+      if (y.value === -1) return;
+      const g = y.value;
+      y.value = -1, C.value = 0, I(!1), a("menu-toggle", g, !1), d && D.get(g)?.focus();
+    }, G = (d) => {
+      if (c(e.items[d])) {
+        if (y.value === d) {
+          H();
+          return;
+        }
+        y.value = d, I(!0), a("menu-toggle", d, !0), N();
+      }
+    }, j = (d, g) => {
+      $.value = {
+        ...$.value,
+        [d]: g
+      }, N();
+    }, X = (d) => {
+      const g = n.value;
+      !g || g.contains(d.target) || H();
+    }, le = (d) => {
+      const g = n.value, K = d.relatedTarget;
+      !g || !K || g.contains(K) || H();
+    }, ue = (d) => {
+      if (d.key === "Escape") {
+        H(!0);
+        return;
+      }
+      const g = d.target;
+      if (!g?.dataset.trigger) return;
+      const K = (k) => {
+        const P = g.closest("li");
+        (k === "next" ? P?.nextElementSibling : P?.previousElementSibling)?.querySelector("[data-trigger]")?.focus();
+      };
+      switch (d.key) {
+        case "Home":
+          d.preventDefault(), D.get(0)?.focus();
+          break;
+        case "End":
+          d.preventDefault(), D.get(e.items.length - 1)?.focus();
+          break;
+        case "ArrowRight":
+        case "ArrowDown":
+          d.preventDefault(), K("next");
+          break;
+        case "ArrowLeft":
+        case "ArrowUp":
+          d.preventDefault(), K("prev");
+      }
+    }, ae = B(0), Q = B({}), ne = B(null), L = B(null), R = B(e.open), Y = B(e.open), V = /* @__PURE__ */ new Map(), F = /* @__PURE__ */ new Map(), z = /* @__PURE__ */ new Map(), O = /* @__PURE__ */ new Map(), U = (d, g, K) => {
+      g ? d.set(K, g) : d.delete(K);
+    };
+    let J, ee;
+    const oe = (d) => {
+      typeof document > "u" || document.body.classList.toggle("is-gnb-mobile", d);
+    }, Te = () => {
+      ee && clearTimeout(ee), R.value = !0, J = setTimeout(() => {
+        Y.value = !0, oe(!0), s.value?.focus();
+      }, Oa);
+    }, _e = () => {
+      J && clearTimeout(J), Y.value = !1, ee = setTimeout(() => {
+        R.value = !1, oe(!1);
+      }, we);
+    };
+    se(() => e.open, (d) => {
+      d ? Te() : _e();
+    });
+    const Me = (d, g) => {
+      d.preventDefault(), ae.value = g;
+      const K = u.value, k = V.get(g);
+      K && k && K.scrollTo({
+        left: 0,
+        top: k.offsetTop,
+        behavior: "smooth"
+      });
+    }, Ae = () => {
+      const d = u.value;
+      if (!d) return;
+      const { scrollTop: g, scrollHeight: K, clientHeight: k } = d;
+      let P = ae.value;
+      V.forEach((q, W) => {
+        (g >= q.offsetTop || g + k >= K) && (P = W);
+      }), ae.value = P;
+    }, Ve = (d, g) => {
+      d.preventDefault(), Q.value = {
+        ...Q.value,
+        [g]: !Q.value[g]
+      };
+    }, Pe = async (d, g) => {
+      d.preventDefault(), ne.value = g, await ce(), L.value = g, await ce(), O.get(g)?.focus();
+    }, ye = (d) => {
+      L.value = null, F.get(d)?.focus(), setTimeout(() => {
+        L.value || (ne.value = null);
+      }, we);
+    }, ze = (d, g) => {
+      const K = Array.from(d.querySelectorAll(Na));
+      if (!K.length) return;
+      const k = K[0], P = K[K.length - 1], q = document.activeElement;
+      g.shiftKey && (q === k || q === d) ? (g.preventDefault(), P.focus()) : !g.shiftKey && q === P && (g.preventDefault(), k.focus());
+    }, Fe = (d) => {
+      if (d.key === "Escape") {
+        L.value ? ye(L.value) : a("update:open", !1);
+        return;
+      }
+      if (d.key !== "Tab") return;
+      const g = L.value ? z.get(L.value) : s.value;
+      g && ze(g, d);
+    };
+    ie(() => {
+      if (h.value) {
+        document.addEventListener("click", X);
+        return;
+      }
+      e.open && (R.value = !0, Y.value = !0, oe(!0));
+      const d = {};
+      e.items.forEach((g, K) => {
+        g.subItems?.forEach((k, P) => {
+          k.expanded && (d[`${K}-${P}`] = !0);
+        });
+      }), Q.value = d;
+    }), fe(() => {
+      typeof document < "u" && (document.removeEventListener("click", X), document.body.classList.remove("is-gnb-web", "hasScrollY", "is-gnb-mobile")), J && clearTimeout(J), ee && clearTimeout(ee);
+    });
+    const Re = (d) => {
+      const g = d.some((k) => !!k.description), K = d.map((k, P) => {
+        const q = i(k.external), W = k.external ? t("i", { class: "svg-icon ico-go" }) : null;
+        if (g) return t("li", { key: `link-${P}` }, [t("h3", { class: "tit" }, [t("a", {
+          href: k.href || "#",
+          ...q,
+          onClick: (te) => p(k, te)
+        }, [k.text, W])]), k.description ? t("p", { class: "txt" }, k.description) : null]);
+        const Z = k.href ? "a" : "button";
+        return t("li", { key: `link-${P}` }, [t(Z, {
+          ...k.href ? {
+            href: k.href,
+            ...q
+          } : { type: "button" },
+          class: { active: k.selected },
+          onClick: (te) => p(k, te)
+        }, [k.text, W])]);
+      });
+      return t("ul", { class: g ? "type-description" : void 0 }, K);
+    }, me = (d) => {
+      const g = d.titleLink ? [d.title, t("a", {
+        href: d.titleLink.href,
+        class: "krds-btn link basic small"
+      }, [t("span", { class: "underline" }, d.titleLink.text || "바로가기"), t("i", { class: "svg-icon ico-angle right" })])] : [t("span", d.title)];
+      return t("div", {
+        id: d.id,
+        class: ["gnb-sub-list", {
+          active: d.active,
+          between: d.layout === "between",
+          "single-list": d.single
+        }]
+      }, [t("div", { class: "gnb-sub-content" }, [t("h2", { class: "sub-title" }, g), Re(d.linkItems)]), d.banner]);
+    }, Ie = (d, g) => (d.subItems ?? []).map((K, k) => {
+      if (o(K)) {
+        const W = K.href ? "a" : "button";
+        return t("li", { key: `sub-${k}` }, [t(W, {
+          ...K.href ? {
+            href: K.href,
+            ...i(K.external)
+          } : { type: "button" },
+          class: [
+            "gnb-sub-trigger",
+            "is-link",
+            {
+              "external-link": K.external,
+              selected: K.selected
+            }
+          ],
+          "data-trigger": "gnb",
+          onClick: (Z) => p(K, Z)
+        }, K.text)]);
+      }
+      const P = M(g) === k, q = K.banner && r.banner ? t("div", { class: "gnb-sub-banner" }, r.banner({
+        item: d,
+        subItem: K,
+        index: g,
+        subIndex: k
+      })) : null;
+      return t("li", { key: `sub-${k}` }, [t("button", {
+        type: "button",
+        class: ["gnb-sub-trigger", {
+          active: P,
+          selected: K.selected
+        }],
+        "data-trigger": "gnb",
+        "aria-controls": w(g, k),
+        "aria-expanded": P ? "true" : "false",
+        "aria-haspopup": "true",
+        onClick: (W) => {
+          j(g, k), p(K, W);
+        }
+      }, K.text), me({
+        id: w(g, k),
+        title: K.title || K.text,
+        titleLink: K.titleLink,
+        linkItems: K.items ?? [],
+        layout: K.layout,
+        active: P,
+        banner: q
+      })]);
+    }), He = (d, g) => {
+      const K = y.value === g, k = S(d), P = k ? [t("ul", {}, Ie(d, g))] : [me({
+        title: d.title || d.text,
+        linkItems: d.items ?? [],
+        layout: d.layout,
+        single: !0,
+        banner: d.banner && r.banner ? t("div", { class: "gnb-sub-banner" }, r.banner({
+          item: d,
+          index: g,
+          subIndex: -1
+        })) : null
+      })];
+      return t("div", {
+        id: f(g),
+        class: ["gnb-toggle-wrap", { "is-open": K }]
+      }, [t("div", {
+        ref: (q) => _(E, q, g),
+        class: "gnb-main-list",
+        ...k ? { "data-has-submenu": "true" } : {},
+        style: K && C.value ? { minHeight: `${C.value}px` } : void 0
+      }, P)]);
+    }, Oe = () => {
+      const d = e.items.map((K, k) => {
+        const P = c(K), q = y.value === k, W = !P && K.href ? "a" : "button", Z = t(W, {
+          ref: (te) => _(D, te, k),
+          ...W === "a" ? {
+            href: K.href,
+            ...i(K.external)
+          } : { type: "button" },
+          class: ["gnb-main-trigger", {
+            active: q,
+            "is-link": !P,
+            selected: K.selected
+          }],
+          "data-trigger": "gnb",
+          ...P ? {
+            "aria-controls": f(k),
+            "aria-expanded": q ? "true" : "false",
+            "aria-haspopup": "true"
+          } : {},
+          onClick: (te) => {
+            P && G(k), p(K, te);
+          }
+        }, K.text);
+        return t("li", { key: `main-${k}` }, [Z, P ? He(K, k) : null]);
+      }), g = e.backdrop && y.value !== -1 ? t(Ce, { to: "body" }, [t("div", {
+        class: "gnb-backdrop active",
+        "aria-hidden": "true"
+      })]) : null;
+      return t("nav", {
+        ref: n,
+        class: "krds-main-menu",
+        "aria-label": e.ariaLabel,
+        onKeydown: ue,
+        onFocusout: le
+      }, [t("div", { class: "inner" }, [t("ul", {
+        class: "gnb-menu",
+        "aria-label": e.ariaLabel
+      }, d)]), g]);
+    }, Ne = (d, g) => {
+      const K = () => ye(g);
+      return t("div", {
+        ref: (k) => U(z, k, g),
+        class: ["depth4-wrap", { "is-open": L.value === g }],
+        style: ne.value === g ? { display: "block" } : void 0
+      }, [t("div", { class: "depth4-head" }, [t("button", {
+        ref: (k) => U(O, k, g),
+        type: "button",
+        class: "krds-btn icon trigger-prev",
+        onClick: K
+      }, [t("span", { class: "sr-only" }, "이전화면"), t("i", { class: "svg-icon ico-angle left" })]), t("button", {
+        type: "button",
+        class: "krds-btn icon trigger-close",
+        onClick: K
+      }, [t("span", { class: "sr-only" }, e.closeLabel), t("i", { class: "svg-icon ico-popup-close" })])]), t("div", { class: "depth4-body" }, [t("h4", { class: "sub-title" }, d.panelTitle || d.text), t("ul", { class: "depth4-ul" }, (d.items ?? []).map((k, P) => t("li", { key: `depth4-${P}` }, [t("a", {
+        href: k.href || "#",
+        ...i(k.external),
+        class: { selected: k.selected },
+        onClick: (q) => p(k, q)
+      }, k.text)])))])]);
+    }, qe = (d, g, K) => {
+      const k = (d.items ?? []).map((P, q) => {
+        const W = `${g}-${K}-${q}`, Z = !!P.items?.length;
+        return t("li", { key: `depth3-${q}` }, [t("a", {
+          ref: (te) => U(F, te, W),
+          href: P.href || "#",
+          ...Z ? {} : i(P.external),
+          class: ["depth3-trigger", {
+            "has-depth4": Z,
+            selected: P.selected
+          }],
+          ...Z ? {
+            "aria-haspopup": "true",
+            "aria-expanded": L.value === W ? "true" : "false"
+          } : {},
+          onClick: (te) => {
+            Z && Pe(te, W), p(P, te);
+          }
+        }, P.text), Z ? Ne(P, W) : null]);
+      });
+      return t("div", { class: ["depth3-wrap", { "is-open": Q.value[`${g}-${K}`] }] }, [t("ul", {}, k)]);
+    }, We = (d, g) => {
+      const K = (d.subItems ?? []).map((k, P) => {
+        const q = `${g}-${P}`, W = !!k.items?.length;
+        return t("li", { key: `sub-${P}` }, [t("a", {
+          href: k.href || "#",
+          ...W ? {} : i(k.external),
+          class: ["gnb-sub-trigger", {
+            "has-depth3": W,
+            active: W && Q.value[q],
+            selected: k.selected
+          }],
+          ...W ? {
+            "aria-controls": T(g, P),
+            "aria-expanded": Q.value[q] ? "true" : "false"
+          } : {},
+          onClick: (Z) => {
+            W && Ve(Z, q), p(k, Z);
+          }
+        }, k.text), W ? qe(k, g, P) : null]);
+      });
+      return t("div", {
+        ref: (k) => _(V, k, g),
+        id: f(g),
+        class: "gnb-sub-list",
+        role: "tabpanel",
+        "aria-labelledby": m(g)
+      }, [t("h2", { class: "sub-title" }, d.title || d.text), t("ul", {}, K)]);
+    }, Ye = () => {
+      const d = e.items.map((K, k) => t("li", {
+        key: `tab-${k}`,
+        role: "none"
+      }, [t("a", {
+        id: m(k),
+        href: `#${f(k)}`,
+        class: ["gnb-main-trigger", { active: ae.value === k }],
+        role: "tab",
+        "aria-controls": f(k),
+        "aria-selected": ae.value === k ? "true" : "false",
+        onClick: (P) => {
+          Me(P, k), p(K, P);
+        }
+      }, K.text)])), g = [t("div", { class: "gnb-menu" }, [t("div", { class: "menu-wrap" }, [t("ul", {
+        role: "tablist",
+        "aria-label": e.ariaLabel
+      }, d)]), t("div", { class: "submenu-wrap" }, e.items.map(We))]), r.bottom ? t("div", { class: "gnb-bottom" }, r.bottom()) : null];
+      return t("div", {
+        ref: n,
+        id: e.mobileId,
+        class: ["krds-main-menu-mobile", {
+          "is-open": Y.value,
+          "is-backdrop": Y.value
+        }],
+        style: R.value ? void 0 : { display: "none" },
+        onKeydown: Fe
+      }, [t("div", {
+        ref: s,
+        class: "gnb-wrap",
+        tabindex: -1
+      }, [
+        t("div", { class: "gnb-header" }, r.header ? r.header() : []),
+        t("div", {
+          ref: u,
+          class: "gnb-body",
+          onScroll: Ae
+        }, g),
+        t("button", {
+          type: "button",
+          id: "close-nav",
+          class: "krds-btn medium icon",
+          onClick: () => a("update:open", !1)
+        }, [t("span", { class: "sr-only" }, e.closeLabel), t("i", { class: "svg-icon ico-popup-close" })])
+      ])]);
+    };
+    return () => h.value ? Oe() : Ye();
+  }
+}), Wa = qa, Ya = 400, ja = 2500, Ga = 0, Ua = 16, Be = (e) => e ? e.flatMap((a) => a.type === Ge ? Array.isArray(a.children) ? Be(a.children) : [] : a.type === je ? [] : a.type === Ue && typeof a.children == "string" && a.children.trim() === "" ? [] : [a]) : [], Xa = A({
+  name: "KrdsCarousel",
+  props: {
+    variant: {
+      type: String,
+      default: "visual"
+    },
+    activeIndex: {
+      type: Number,
+      default: void 0
+    },
+    loop: {
+      type: Boolean,
+      default: !0
+    },
+    autoplay: {
+      type: Boolean,
+      default: !1
+    },
+    autoplayDelay: {
+      type: Number,
+      default: ja
+    },
+    pauseOnHover: {
+      type: Boolean,
+      default: !0
+    },
+    speed: {
+      type: Number,
+      default: Ya
+    },
+    spaceBetween: {
+      type: Number,
+      default: void 0
+    },
+    pagination: {
+      type: String,
+      default: void 0
+    },
+    navigation: {
+      type: Boolean,
+      default: !0
+    },
+    moreHref: {
+      type: String,
+      default: void 0
+    },
+    ariaLabel: {
+      type: String,
+      default: "캐러셀"
+    },
+    prevLabel: {
+      type: String,
+      default: "이전"
+    },
+    nextLabel: {
+      type: String,
+      default: "다음"
+    },
+    playLabel: {
+      type: String,
+      default: "슬라이드 재생"
+    },
+    stopLabel: {
+      type: String,
+      default: "슬라이드 멈춤"
+    },
+    moreLabel: {
+      type: String,
+      default: "더 보기"
+    },
+    id: {
+      type: String,
+      default: void 0
+    }
+  },
+  emits: [
+    "update:activeIndex",
+    "change",
+    "play",
+    "stop",
+    "more-click"
+  ],
+  setup(e, { emit: a, slots: r }) {
+    const l = xe()?.uid, n = b(() => `${e.id ?? `krds-carousel-${l}`}-wrapper`);
+    let s = 0;
+    const u = B(e.activeIndex ?? 0), h = b(() => e.spaceBetween ?? (e.variant === "banner" ? Ua : Ga)), f = b(() => e.pagination ?? (e.variant === "banner" ? "fraction" : "bullets")), w = B(!1), m = B(!1), T = B(!1), S = b(() => m.value || T.value);
+    let x;
+    const c = () => {
+      x !== void 0 && (clearInterval(x), x = void 0);
+    }, o = (V) => {
+      if (s <= 0) return;
+      const F = e.loop ? (V % s + s) % s : Math.min(Math.max(V, 0), s - 1);
+      F !== u.value && (u.value = F, a("update:activeIndex", F), a("change", F));
+    }, i = () => o(u.value - 1), p = () => o(u.value + 1), y = () => {
+      w.value || (w.value = !0, a("play"));
+    }, $ = () => {
+      w.value && (w.value = !1, a("stop"));
+    };
+    se([
+      w,
+      S,
+      () => e.autoplayDelay
+    ], () => {
+      c(), !(!w.value || S.value) && (x = setInterval(() => {
+        if (!e.loop && s > 0 && u.value >= s - 1) {
+          $();
+          return;
+        }
+        p();
+      }, e.autoplayDelay));
+    }), se(() => e.autoplay, (V) => {
+      V ? y() : $();
+    }), se(() => e.activeIndex, (V) => {
+      typeof V != "number" || V === u.value || (u.value = s > 0 ? Math.min(Math.max(V, 0), s - 1) : V);
+    });
+    const E = B(!1);
+    let D;
+    const _ = (V) => {
+      E.value = V.matches;
+    }, v = b(() => E.value ? 0 : e.speed);
+    ie(() => {
+      typeof window < "u" && window.matchMedia && (D = window.matchMedia("(prefers-reduced-motion: reduce)"), E.value = D.matches, D.addEventListener("change", _)), e.autoplay && y();
+    }), fe(() => {
+      c(), D?.removeEventListener("change", _);
+    });
+    const M = () => {
+      e.pauseOnHover && (m.value = !0);
+    }, I = () => {
+      m.value = !1;
+    }, N = () => {
+      T.value = !0;
+    }, H = (V) => {
+      const F = V.currentTarget;
+      F && F.contains(V.relatedTarget) || (T.value = !1);
+    }, G = (V) => {
+      a("more-click", V);
+    }, j = {
+      position: "relative",
+      overflow: "hidden",
+      width: "100%"
+    }, X = {
+      flex: "0 0 100%",
+      width: "100%"
+    }, le = (V) => ({
+      display: "flex",
+      width: "100%",
+      gap: h.value > 0 ? `${h.value}px` : void 0,
+      transform: `translate3d(calc(${-V} * (100% + ${h.value}px)), 0, 0)`,
+      transitionProperty: "transform",
+      transitionDuration: `${v.value}ms`,
+      transitionTimingFunction: "ease-out",
+      willChange: "transform"
+    }), ue = (V) => ({
+      position: "absolute",
+      top: "50%",
+      left: V ? "0" : void 0,
+      right: V ? void 0 : "0",
+      transform: "translateY(-50%)",
+      zIndex: 10
+    }), ae = (V, F) => V.map((z, O) => {
+      const U = O === F;
+      return t("li", {
+        key: z.key ?? `krds-carousel-slide-${O}`,
+        class: ["swiper-slide", { "swiper-slide-active": U }],
+        style: X,
+        "aria-roledescription": "slide",
+        "aria-label": `${O + 1} / ${V.length}`,
+        "aria-hidden": U ? void 0 : "true",
+        inert: U ? void 0 : !0
+      }, [z]);
+    }), Q = (V, F, z) => {
+      const O = V === "prev", U = !e.loop && (O ? F <= 0 : F >= s - 1);
+      return t("button", {
+        type: "button",
+        class: [`swiper-button-${V}`, { "swiper-button-disabled": U }],
+        style: z ? ue(O) : void 0,
+        disabled: U,
+        "aria-controls": n.value,
+        onClick: O ? i : p
+      }, [t("span", { class: "sr-only" }, O ? e.prevLabel : e.nextLabel)]);
+    }, ne = () => t("a", {
+      href: e.moreHref,
+      class: "swiper-button-more",
+      onClick: G
+    }, [t("span", { class: "sr-only" }, e.moreLabel)]), L = (V, F) => f.value === "fraction" ? t("div", { class: "swiper-pagination swiper-pagination-fraction" }, [
+      t("span", { class: "swiper-pagination-current" }, String(F + 1)),
+      t("span", { "aria-hidden": "true" }, "/"),
+      t("span", { class: "swiper-pagination-total" }, String(V))
+    ]) : t("div", { class: "swiper-pagination" }, Array.from({ length: V }, (z, O) => t("button", {
+      key: `krds-carousel-bullet-${O}`,
+      type: "button",
+      class: ["swiper-pagination-bullet", { "swiper-pagination-bullet-active": O === F }],
+      "aria-label": `${O + 1}번째 슬라이드로 이동`,
+      "aria-current": O === F ? "true" : void 0,
+      "aria-controls": n.value,
+      onClick: () => o(O)
+    }))), R = () => t("div", { class: "swiper-controller" }, [t("button", {
+      type: "button",
+      class: "swiper-button-play",
+      style: w.value ? { display: "none" } : void 0,
+      "aria-controls": n.value,
+      onClick: y
+    }, [t("span", { class: "sr-only" }, e.playLabel)]), t("button", {
+      type: "button",
+      class: "swiper-button-stop",
+      style: w.value ? void 0 : { display: "none" },
+      "aria-controls": n.value,
+      onClick: $
+    }, [t("span", { class: "sr-only" }, e.stopLabel)])]), Y = (V, F) => {
+      const z = e.variant === "banner", O = f.value !== "none", U = !!e.moreHref, J = [];
+      if (O && J.push(L(V, F)), e.autoplay && J.push(R()), z) {
+        const ee = [];
+        e.navigation && ee.push(Q("prev", F, !1), Q("next", F, !1)), U && ee.push(ne()), ee.length > 0 && J.push(t("div", { class: "swiper-navigation" }, ee));
+      } else U && J.push(ne());
+      return J.length === 0 ? null : t("div", { class: ["swiper-indicator", { "text-center": !z }] }, J);
+    };
+    return () => {
+      const V = Be(r.default?.()), F = V.length;
+      s = F;
+      const z = F > 0 ? Math.min(Math.max(u.value, 0), F - 1) : 0, O = e.variant === "banner";
+      return t("div", {
+        id: e.id,
+        class: ["krds-carousel", O ? "main-d-ban-swiper" : "vb-swiper"],
+        style: { position: "relative" },
+        role: "region",
+        "aria-roledescription": "carousel",
+        "aria-label": e.ariaLabel,
+        onMouseenter: M,
+        onMouseleave: I,
+        onFocusin: N,
+        onFocusout: H
+      }, [
+        t("div", {
+          class: "swiper",
+          style: j,
+          "aria-live": w.value ? "off" : "polite"
+        }, [t("ul", {
+          id: n.value,
+          class: "swiper-wrapper",
+          style: le(z)
+        }, ae(V, z))]),
+        !O && e.navigation && F > 0 ? Q("prev", z, !0) : null,
+        !O && e.navigation && F > 0 ? Q("next", z, !0) : null,
+        F > 0 ? Y(F, z) : null
+      ]);
+    };
+  }
+}), Qa = Xa, Ke = /* @__PURE__ */ Je({
+  KrdsAccordionGroup: () => ga,
+  KrdsAccordionItem: () => ya,
+  KrdsBadge: () => Ct,
+  KrdsBreadcrumb: () => Gt,
+  KrdsButton: () => Ze,
+  KrdsButtonGroup: () => et,
+  KrdsCarousel: () => Qa,
+  KrdsCheckArea: () => Vt,
+  KrdsCheckbox: () => zt,
+  KrdsCoachMark: () => sa,
+  KrdsContextualHelp: () => la,
+  KrdsCriticalAlerts: () => Ia,
+  KrdsDateInput: () => gt,
+  KrdsDisclosure: () => La,
+  KrdsFileUpload: () => wt,
+  KrdsFooter: () => xa,
+  KrdsFormGroup: () => ut,
+  KrdsFormHint: () => ot,
+  KrdsFormLabel: () => rt,
+  KrdsHeader: () => Ka,
+  KrdsIcon: () => tt,
+  KrdsIdentifier: () => Ba,
+  KrdsInPageNavigation: () => Xt,
+  KrdsInput: () => nt,
+  KrdsLanguageSwitcher: () => da,
+  KrdsLayout: () => _a,
+  KrdsLink: () => at,
+  KrdsMainMenu: () => Wa,
+  KrdsMasthead: () => Et,
+  KrdsModal: () => va,
+  KrdsPagination: () => Zt,
+  KrdsPanel: () => ta,
+  KrdsRadio: () => Rt,
+  KrdsResize: () => ca,
+  KrdsSelect: () => bt,
+  KrdsSideNavigation: () => Aa,
+  KrdsSkipLink: () => Yt,
+  KrdsSpinner: () => It,
+  KrdsStep: () => qt,
+  KrdsStepIndicator: () => Ot,
+  KrdsStructuredList: () => Pa,
+  KrdsTable: () => Sa,
+  KrdsTag: () => $t,
+  KrdsTagGroup: () => Dt,
+  KrdsTextList: () => Fa,
+  KrdsTextarea: () => yt,
+  KrdsToggleSwitch: () => Mt,
+  KrdsTooltip: () => ia,
+  KrdsTts: () => ba
+}), Ee = "0.0.16", tl = { install(e, a = {}) {
+  e.provide("krds:config", a), (a.components || Object.keys(Ke)).forEach((r) => {
+    const l = Ke[r];
+    l && e.component(r, l);
+  }), Qt(e), e.config.globalProperties.$krds = { version: Ee };
+} }, al = Ee;
 export {
-  Pt as KrdsAccordionGroup,
-  qt as KrdsAccordionItem,
-  Ue as KrdsBadge,
-  bt as KrdsBreadcrumb,
-  Ce as KrdsButton,
-  xe as KrdsButtonGroup,
-  rt as KrdsCheckArea,
-  ot as KrdsCheckbox,
-  Dt as KrdsCoachMark,
-  Bt as KrdsContextualHelp,
-  ua as KrdsCriticalAlerts,
-  Re as KrdsDateInput,
-  Jt as KrdsDisclosure,
-  Ge as KrdsFileUpload,
-  Ut as KrdsFooter,
-  Ie as KrdsFormGroup,
-  Ee as KrdsFormHint,
-  Te as KrdsFormLabel,
-  Gt as KrdsHeader,
-  $e as KrdsIcon,
-  Zt as KrdsIdentifier,
-  St as KrdsInPageNavigation,
-  De as KrdsInput,
-  Et as KrdsLanguageSwitcher,
-  aa as KrdsLayout,
-  Be as KrdsLink,
-  tt as KrdsMasthead,
-  Ft as KrdsModal,
-  wt as KrdsPagination,
-  xt as KrdsPanel,
-  ut as KrdsRadio,
-  It as KrdsResize,
-  Oe as KrdsSelect,
-  na as KrdsSideNavigation,
-  gt as KrdsSkipLink,
-  ct as KrdsSpinner,
-  pt as KrdsStep,
-  vt as KrdsStepIndicator,
-  ra as KrdsStructuredList,
-  jt as KrdsTable,
-  Je as KrdsTag,
-  Ze as KrdsTagGroup,
-  oa as KrdsTextList,
-  He as KrdsTextarea,
-  nt as KrdsToggleSwitch,
-  Tt as KrdsTooltip,
-  Nt as KrdsTts,
-  Z as classNames,
-  ha as default,
-  fa as generateId,
-  va as generateUid,
-  pa as version
+  ga as KrdsAccordionGroup,
+  ya as KrdsAccordionItem,
+  Ct as KrdsBadge,
+  Gt as KrdsBreadcrumb,
+  Ze as KrdsButton,
+  et as KrdsButtonGroup,
+  Qa as KrdsCarousel,
+  Vt as KrdsCheckArea,
+  zt as KrdsCheckbox,
+  sa as KrdsCoachMark,
+  la as KrdsContextualHelp,
+  Ia as KrdsCriticalAlerts,
+  gt as KrdsDateInput,
+  La as KrdsDisclosure,
+  wt as KrdsFileUpload,
+  xa as KrdsFooter,
+  ut as KrdsFormGroup,
+  ot as KrdsFormHint,
+  rt as KrdsFormLabel,
+  Ka as KrdsHeader,
+  tt as KrdsIcon,
+  Ba as KrdsIdentifier,
+  Xt as KrdsInPageNavigation,
+  nt as KrdsInput,
+  da as KrdsLanguageSwitcher,
+  _a as KrdsLayout,
+  at as KrdsLink,
+  Wa as KrdsMainMenu,
+  Et as KrdsMasthead,
+  va as KrdsModal,
+  Zt as KrdsPagination,
+  ta as KrdsPanel,
+  Rt as KrdsRadio,
+  ca as KrdsResize,
+  bt as KrdsSelect,
+  Aa as KrdsSideNavigation,
+  Yt as KrdsSkipLink,
+  It as KrdsSpinner,
+  qt as KrdsStep,
+  Ot as KrdsStepIndicator,
+  Pa as KrdsStructuredList,
+  Sa as KrdsTable,
+  $t as KrdsTag,
+  Dt as KrdsTagGroup,
+  Fa as KrdsTextList,
+  yt as KrdsTextarea,
+  Mt as KrdsToggleSwitch,
+  ia as KrdsTooltip,
+  ba as KrdsTts,
+  he as classNames,
+  tl as default,
+  Za as generateId,
+  el as generateUid,
+  al as version
 };
 
 //# sourceMappingURL=krds-vue.es.js.map