@krds.ui/vue 0.0.4 → 0.0.6

package/dist/krds-vue.es.js

@@ -1,5 +1,5 @@
-import { defineComponent as C, computed as g, h as r, ref as M, onMounted as re, onBeforeUnmount as _e, createElementBlock as B, openBlock as w, createElementVNode as h, normalizeClass as L, withDirectives as Y, unref as I, toDisplayString as N, Fragment as E, renderList as F, vShow as G, createBlock as W, withCtx as U, createTextVNode as R, watch as Be, provide as De, inject as Ke, createCommentVNode as J, onUnmounted as ae, resolveDirective as xe, resolveDynamicComponent as le } from "vue";
-const oe = C({
+import { defineComponent as w, computed as d, h as r, ref as M, onMounted as ue, onBeforeUnmount as Be, createElementBlock as D, openBlock as B, createElementVNode as m, normalizeClass as P, withDirectives as j, unref as I, toDisplayString as L, Fragment as O, renderList as q, vShow as G, createBlock as W, withCtx as U, createTextVNode as H, watch as _e, provide as De, inject as Ke, createCommentVNode as J, onUnmounted as ne, resolveDirective as xe, resolveDynamicComponent as se } from "vue";
+const de = w({
   name: "KrdsButton",
   props: {
     type: {
@@ -36,37 +36,37 @@ const oe = C({
     }
   },
   emits: ["click"],
-  setup(e, { emit: i, slots: s }) {
-    const n = g(() => {
+  setup(e, { emit: s, slots: n }) {
+    const l = d(() => {
       const t = ["krds-btn"];
       return e.icon && t.push("icon"), e.border && t.push("border"), e.pure && t.push("pure"), e.variant && !e.icon && t.push(e.variant), e.size && t.push(e.size), e.class && t.push(e.class), t;
     }), o = (t) => {
-      e.disabled || i("click", t);
+      e.disabled || s("click", t);
     };
     return () => r(
       "button",
       {
         type: e.type,
-        class: n.value,
+        class: l.value,
         disabled: e.disabled,
         onClick: o
       },
-      s.default?.()
+      n.default?.()
     );
   }
-}), Ie = C({
+}), Ve = w({
   name: "KrdsButtonGroup",
   props: {},
-  setup(e, { slots: i }) {
+  setup(e, { slots: s }) {
     return () => r(
       "div",
       {
         class: "btn-group"
       },
-      i.default?.()
+      s.default?.()
     );
   }
-}), Ve = C({
+}), Ie = w({
   name: "KrdsIcon",
   props: {
     name: {
@@ -83,7 +83,7 @@ const oe = C({
       class: ["svg-icon", e.name, e.class].filter(Boolean).join(" ")
     });
   }
-}), ze = C({
+}), ze = w({
   name: "KrdsLink",
   props: {
     href: {
@@ -120,18 +120,18 @@ const oe = C({
     }
   },
   emits: ["click"],
-  setup(e, { emit: i, slots: s }) {
-    const n = g(() => {
+  setup(e, { emit: s, slots: n }) {
+    const l = d(() => {
       const a = ["krds-btn"];
       return e.size && a.push(e.size), e.link && a.push("link"), e.basic && a.push("basic"), e.pure && a.push("pure"), e.class && a.push(e.class), a;
-    }), o = g(() => {
+    }), o = d(() => {
       const a = {
         href: e.href,
-        class: n.value
+        class: l.value
       };
       return e.target && (a.target = e.target), e.title && (a.title = e.title), e.target === "_blank" && (a.rel = "noopener noreferrer"), a;
     }), t = (a) => {
-      i("click", a);
+      s("click", a);
     };
     return () => r(
       "a",
@@ -139,10 +139,10 @@ const oe = C({
         ...o.value,
         onClick: t
       },
-      s.default?.()
+      n.default?.()
     );
   }
-}), ue = C({
+}), ce = w({
   name: "KrdsSpinner",
   props: {
     label: {
@@ -154,7 +154,7 @@ const oe = C({
     const e = [r("span", { class: "sr-only" }, "로딩 중")];
     return this.label && e.push(r("span", this.label)), r("div", { class: "krds-spinner", role: "status" }, e);
   }
-}), Me = C({
+}), Me = w({
   name: "KrdsInput",
   props: {
     modelValue: {
@@ -243,27 +243,27 @@ const oe = C({
     }
   },
   emits: ["update:modelValue", "input", "change", "focus", "blur", "keydown", "keyup"],
-  setup(e, { emit: i, slots: s }) {
-    const n = g(() => {
+  setup(e, { emit: s, slots: n }) {
+    const l = d(() => {
       const y = ["krds-input"];
       return e.size && y.push(e.size), e.class && y.push(e.class), y;
     }), o = (y) => {
-      const $ = y.target, d = e.type === "number" ? Number($.value) : $.value;
-      i("update:modelValue", d), i("input", y);
+      const $ = y.target, c = e.type === "number" ? Number($.value) : $.value;
+      s("update:modelValue", c), s("input", y);
     }, t = (y) => {
-      i("change", y);
+      s("change", y);
     }, a = (y) => {
-      i("focus", y);
+      s("focus", y);
     }, u = (y) => {
-      i("blur", y);
-    }, v = (y) => {
-      i("keydown", y);
-    }, S = (y) => {
-      i("keyup", y);
-    }, _ = g(() => {
+      s("blur", y);
+    }, f = (y) => {
+      s("keydown", y);
+    }, p = (y) => {
+      s("keyup", y);
+    }, g = d(() => {
       const y = {
         type: e.type,
-        class: n.value,
+        class: l.value,
         value: e.modelValue,
         placeholder: e.placeholder,
         name: e.name,
@@ -277,20 +277,20 @@ const oe = C({
         onChange: t,
         onFocus: a,
         onBlur: u,
-        onKeydown: v,
-        onKeyup: S
+        onKeydown: f,
+        onKeyup: p
       };
       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;
-    }), V = g(() => {
+    }), _ = d(() => {
       const y = ["form-conts"];
       return e.state !== "default" && y.push(`is-${e.state}`), e.icon && y.push("btn-ico-wrap"), y;
     });
     return () => {
-      const y = [r("input", _.value)];
-      return e.loading ? r("div", { class: V.value }, [r("div", { class: "form-spinner" }, [...y, r(ue)])]) : (s.default && y.push(...s.default()), r("div", { class: V.value }, y));
+      const y = [r("input", g.value)];
+      return e.loading ? r("div", { class: _.value }, [r("div", { class: "form-spinner" }, [...y, r(ce)])]) : (n.default && y.push(...n.default()), r("div", { class: _.value }, y));
     };
   }
-}), $e = C({
+}), $e = w({
   name: "KrdsFormLabel",
   props: {
     for: {
@@ -311,9 +311,9 @@ const oe = C({
     }
   },
   emits: ["click"],
-  setup(e, { emit: i, slots: s }) {
-    const n = (o) => {
-      i("click", o);
+  setup(e, { emit: s, slots: n }) {
+    const l = (o) => {
+      s("click", o);
     };
     return () => r("div", { class: "form-tit" }, [
       r(
@@ -323,13 +323,13 @@ const oe = C({
           id: e.id,
           class: e.class,
           style: e.style,
-          onClick: n
+          onClick: l
         },
-        s.default?.()
+        n.default?.()
       )
     ]);
   }
-}), Pe = C({
+}), Ne = w({
   name: "KrdsFormHint",
   props: {
     type: {
@@ -350,9 +350,9 @@ const oe = C({
     }
   },
   emits: ["click"],
-  setup(e, { emit: i, slots: s }) {
-    const n = (t) => {
-      i("click", t);
+  setup(e, { emit: s, slots: n }) {
+    const l = (t) => {
+      s("click", t);
     }, o = () => {
       let t;
       switch (e.type) {
@@ -377,12 +377,12 @@ const oe = C({
         id: e.id,
         class: o(),
         style: e.style,
-        onClick: n
+        onClick: l
       },
-      s.default?.()
+      n.default?.()
     );
   }
-}), Le = C({
+}), Pe = w({
   name: "KrdsFormGroup",
   props: {
     class: {
@@ -398,94 +398,94 @@ const oe = C({
       default: void 0
     }
   },
-  setup(e, { slots: i }) {
-    const s = g(() => {
-      const n = ["form-group"];
-      return e.class && n.push(e.class), n;
+  setup(e, { slots: s }) {
+    const n = d(() => {
+      const l = ["form-group"];
+      return e.class && l.push(e.class), l;
     });
     return () => r(
       "div",
       {
         id: e.id,
-        class: s.value,
+        class: n.value,
         style: e.style
       },
-      i.default?.()
+      s.default?.()
     );
   }
 });
-function Ne(e, i) {
-  const s = /* @__PURE__ */ new Date(), n = M(e || s.getFullYear()), o = M(i || s.getMonth() + 1), t = M(null), a = M(null), u = M(null), v = g(() => {
-    const p = s.getFullYear(), f = [];
-    for (let b = p - 10; b <= p + 10; b++)
-      f.push(b);
-    return f;
-  }), S = g(() => Array.from({ length: 12 }, (p, f) => f + 1)), _ = () => {
+function Le(e, s) {
+  const n = /* @__PURE__ */ new Date(), l = M(e || n.getFullYear()), o = M(s || n.getMonth() + 1), t = M(null), a = M(null), u = M(null), f = d(() => {
+    const b = n.getFullYear(), h = [];
+    for (let S = b - 10; S <= b + 10; S++)
+      h.push(S);
+    return h;
+  }), p = d(() => Array.from({ length: 12 }, (b, h) => h + 1)), g = () => {
     t.value = null, a.value = null;
-  }, V = () => {
-    o.value === 1 ? (o.value = 12, n.value -= 1) : o.value -= 1;
+  }, _ = () => {
+    o.value === 1 ? (o.value = 12, l.value -= 1) : o.value -= 1;
   }, y = () => {
-    o.value === 12 ? (o.value = 1, n.value += 1) : o.value += 1;
-  }, $ = (p, f = !1) => {
-    if (f)
-      t.value = p, a.value = p;
+    o.value === 12 ? (o.value = 1, l.value += 1) : o.value += 1;
+  }, $ = (b, h = !1) => {
+    if (h)
+      t.value = b, a.value = b;
     else if (!t.value || t.value && a.value)
-      t.value = p, a.value = null;
+      t.value = b, a.value = null;
     else {
-      const b = new Date(t.value.replace(/\./g, "-"));
-      new Date(p.replace(/\./g, "-")) < b ? (t.value = p, a.value = null) : a.value = p;
+      const S = new Date(t.value.replace(/\./g, "-"));
+      new Date(b.replace(/\./g, "-")) < S ? (t.value = b, a.value = null) : a.value = b;
     }
   };
   return {
     // State
-    currentYear: n,
+    currentYear: l,
     currentMonth: o,
     selectedStartDate: t,
     selectedEndDate: a,
     activeDateSelector: u,
     // Computed
-    yearOptions: v,
-    monthOptions: S,
+    yearOptions: f,
+    monthOptions: p,
     // Methods
-    clearDateSelection: _,
-    prevMonth: V,
+    clearDateSelection: g,
+    prevMonth: _,
     nextMonth: y,
     handleDateSelection: $,
     selectToday: () => {
-      const p = `${s.getFullYear()}.${String(s.getMonth() + 1).padStart(2, "0")}.${String(s.getDate()).padStart(2, "0")}`;
-      $(p, !0);
+      const b = `${n.getFullYear()}.${String(n.getMonth() + 1).padStart(2, "0")}.${String(n.getDate()).padStart(2, "0")}`;
+      $(b, !0);
     },
-    isDateInSelectedRange: (p) => {
+    isDateInSelectedRange: (b) => {
       if (!t.value || !a.value)
         return { isInRange: !1, isStart: !1, isEnd: !1 };
-      const f = new Date(p.replace(/\./g, "-")), b = new Date(t.value.replace(/\./g, "-")), K = new Date(a.value.replace(/\./g, "-")), O = p === t.value, T = p === a.value;
-      return { isInRange: f >= b && f <= K, isStart: O, isEnd: T };
+      const h = new Date(b.replace(/\./g, "-")), S = new Date(t.value.replace(/\./g, "-")), x = new Date(a.value.replace(/\./g, "-")), A = b === t.value, T = b === a.value;
+      return { isInRange: h >= S && h <= x, isStart: A, isEnd: T };
     }
   };
 }
-function Te(e, i, s = {}) {
-  let n = null;
-  const o = typeof s == "string" ? { ignore: s } : s, { ignore: t, event: a = "click" } = o, u = () => {
-    n = (S) => {
-      const _ = S.target;
-      e.value?.contains(_) || t && _.closest(t) || i();
-    }, document.addEventListener(a, n);
-  }, v = () => {
-    if (n) {
-      const S = typeof s == "string" ? "click" : s.event || "click";
-      document.removeEventListener(S, n), n = null;
+function Te(e, s, n = {}) {
+  let l = null;
+  const o = typeof n == "string" ? { ignore: n } : n, { ignore: t, event: a = "click" } = o, u = () => {
+    l = (p) => {
+      const g = p.target;
+      e.value?.contains(g) || t && g.closest(t) || s();
+    }, document.addEventListener(a, l);
+  }, f = () => {
+    if (l) {
+      const p = typeof n == "string" ? "click" : n.event || "click";
+      document.removeEventListener(p, l), l = null;
     }
   };
-  return re(() => {
+  return ue(() => {
     u();
-  }), _e(() => {
-    v();
+  }), Be(() => {
+    f();
   }), {
     setupGlobalListeners: u,
-    removeGlobalListeners: v
+    removeGlobalListeners: f
   };
 }
-const Ae = { class: "form-conts" }, Ee = { class: "calendar-input" }, Oe = ["id", "name", "placeholder", "value", "readonly", "disabled", "required", "autofocus"], qe = ["disabled", "aria-expanded"], Fe = { class: "calendar-head" }, He = { class: "calendar-switch-wrap" }, Re = { class: "calendar-drop-down" }, Ye = ["aria-expanded"], je = { class: "calendar-select calendar-year-wrap" }, Ge = { class: "sel year" }, We = ["onClick"], Ue = { class: "calendar-drop-down" }, Je = ["aria-expanded"], Qe = { class: "calendar-select calendar-mon-wrap" }, Xe = { class: "sel month" }, Ze = ["onClick"], et = { class: "calendar-body" }, tt = { class: "calendar-table-wrap" }, at = { class: "calendar-tbl" }, lt = ["data-date"], nt = ["aria-pressed", "onClick"], st = { class: "calendar-footer" }, it = { class: "calendar-btn-wrap" }, rt = /* @__PURE__ */ C({
+const Ee = { class: "form-conts" }, Oe = { class: "calendar-input" }, Ae = ["id", "name", "placeholder", "value", "readonly", "disabled", "required", "autofocus"], Fe = ["disabled", "aria-expanded"], qe = { class: "calendar-head" }, Re = { class: "calendar-switch-wrap" }, He = { class: "calendar-drop-down" }, je = ["aria-expanded"], Ye = { class: "calendar-select calendar-year-wrap" }, Ge = { class: "sel year" }, We = ["onClick"], Ue = { class: "calendar-drop-down" }, Je = ["aria-expanded"], Qe = { class: "calendar-select calendar-mon-wrap" }, Xe = { class: "sel month" }, Ze = ["onClick"], et = { class: "calendar-body" }, tt = { class: "calendar-table-wrap" }, at = { class: "calendar-tbl" }, lt = ["data-date"], nt = ["aria-pressed", "onClick"], st = { class: "calendar-footer" }, it = { class: "calendar-btn-wrap" }, rt = /* @__PURE__ */ w({
   __name: "KrdsDateInput",
   props: {
     modelValue: { default: void 0 },
@@ -505,66 +505,66 @@ const Ae = { class: "form-conts" }, Ee = { class: "calendar-input" }, Oe = ["id"
     id: { default: void 0 }
   },
   emits: ["update:modelValue", "input", "change", "focus", "blur"],
-  setup(e, { emit: i }) {
-    const s = e, n = i, o = M(), t = M(), a = M(!1), u = M(null), {
-      currentYear: v,
-      currentMonth: S,
-      selectedStartDate: _,
-      selectedEndDate: V,
+  setup(e, { emit: s }) {
+    const n = e, l = s, o = M(), t = M(), a = M(!1), u = M(null), {
+      currentYear: f,
+      currentMonth: p,
+      selectedStartDate: g,
+      selectedEndDate: _,
       yearOptions: y,
       monthOptions: $,
-      prevMonth: d,
-      nextMonth: l,
-      handleDateSelection: p,
-      selectToday: f,
-      isDateInSelectedRange: b
-    } = Ne(s.initialYear, s.initialMonth), K = () => {
+      prevMonth: c,
+      nextMonth: i,
+      handleDateSelection: b,
+      selectToday: h,
+      isDateInSelectedRange: S
+    } = Le(n.initialYear, n.initialMonth), x = () => {
       a.value && t.value?.focus(), a.value = !1, u.value = null;
     };
-    Te(o, K, ".calendar-conts");
-    const O = g(() => {
-      const c = ["krds-input", "datepicker", "cal"];
-      return s.size && c.push(s.size), s.class && c.push(s.class), c;
-    }), T = g(() => ["form-conts", "calendar-conts"]), P = g(() => ({
+    Te(o, x, ".calendar-conts");
+    const A = d(() => {
+      const v = ["krds-input", "datepicker", "cal"];
+      return n.size && v.push(n.size), n.class && v.push(n.class), v;
+    }), T = d(() => ["form-conts", "calendar-conts"]), N = d(() => ({
       "krds-calendar-area": !0,
       active: a.value
-    })), z = g(() => {
-      const c = v.value, m = S.value, k = new Date(c, m - 1, 1), q = new Date(k);
-      q.setDate(q.getDate() - k.getDay());
-      const A = [], x = new Date(q);
-      for (let j = 0; j < 6; j++) {
-        const Z = [];
-        for (let ee = 0; ee < 7; ee++) {
-          const we = `${x.getFullYear()}.${String(x.getMonth() + 1).padStart(2, "0")}.${String(x.getDate()).padStart(2, "0")}`, te = x.getDay();
-          Z.push({
-            day: x.getDate(),
+    })), z = d(() => {
+      const v = f.value, k = p.value, C = new Date(v, k - 1, 1), F = new Date(C);
+      F.setDate(F.getDate() - C.getDay());
+      const E = [], V = new Date(F);
+      for (let Y = 0; Y < 6; Y++) {
+        const te = [];
+        for (let ae = 0; ae < 7; ae++) {
+          const we = `${V.getFullYear()}.${String(V.getMonth() + 1).padStart(2, "0")}.${String(V.getDate()).padStart(2, "0")}`, le = V.getDay();
+          te.push({
+            day: V.getDate(),
             dateString: we,
-            isCurrentMonth: x.getMonth() === m - 1,
-            isToday: x.toDateString() === (/* @__PURE__ */ new Date()).toDateString(),
-            isPrevMonth: x.getMonth() < m - 1 || x.getMonth() === 11 && m === 1,
-            isNextMonth: x.getMonth() > m - 1 || x.getMonth() === 0 && m === 12,
-            isSunday: te === 0,
-            isSaturday: te === 6
-          }), x.setDate(x.getDate() + 1);
+            isCurrentMonth: V.getMonth() === k - 1,
+            isToday: V.toDateString() === (/* @__PURE__ */ new Date()).toDateString(),
+            isPrevMonth: V.getMonth() < k - 1 || V.getMonth() === 11 && k === 1,
+            isNextMonth: V.getMonth() > k - 1 || V.getMonth() === 0 && k === 12,
+            isSunday: le === 0,
+            isSaturday: le === 6
+          }), V.setDate(V.getDate() + 1);
         }
-        A.push(Z);
+        E.push(te);
       }
-      return A;
-    }), H = (c) => {
-      const m = [];
-      if (c.isPrevMonth && m.push("old"), c.isNextMonth && m.push("new"), c.isToday && m.push("today"), c.isSunday && m.push("day-off"), s.holidays?.includes(c.dateString) && m.push("day-off"), s.eventDates?.includes(c.dateString) && m.push("day-event"), c.isCurrentMonth) {
-        const k = b(c.dateString);
-        k.isInRange && (m.push("period"), k.isStart && m.push("start"), k.isEnd && m.push("end"));
+      return E;
+    }), R = (v) => {
+      const k = [];
+      if (v.isPrevMonth && k.push("old"), v.isNextMonth && k.push("new"), v.isToday && k.push("today"), v.isSunday && k.push("day-off"), n.holidays?.includes(v.dateString) && k.push("day-off"), n.eventDates?.includes(v.dateString) && k.push("day-event"), v.isCurrentMonth) {
+        const C = S(v.dateString);
+        C.isInRange && (k.push("period"), C.isStart && k.push("start"), C.isEnd && k.push("end"));
       }
-      return m;
-    }, D = g(() => [
+      return k;
+    }, K = d(() => [
       {
         id: "get-today",
         label: "오늘",
         class: "text",
         variant: void 0,
         size: "small",
-        handler: f
+        handler: h
       },
       {
         id: "cancel-btn",
@@ -572,7 +572,7 @@ const Ae = { class: "form-conts" }, Ee = { class: "calendar-input" }, Oe = ["id"
         class: void 0,
         variant: "tertiary",
         size: "small",
-        handler: K
+        handler: x
       },
       {
         id: "confirm-btn",
@@ -582,132 +582,132 @@ const Ae = { class: "form-conts" }, Ee = { class: "calendar-input" }, Oe = ["id"
         size: "small",
         handler: ge
       }
-    ]), X = (c) => {
-      u.value === c ? u.value = null : u.value = c;
-    }, ve = (c) => {
-      v.value = c, u.value = null;
-    }, he = (c) => {
-      S.value = c, u.value = null;
+    ]), ee = (v) => {
+      u.value === v ? u.value = null : u.value = v;
+    }, ve = (v) => {
+      f.value = v, u.value = null;
+    }, he = (v) => {
+      p.value = v, u.value = null;
     }, ge = () => {
-      if (_.value) {
-        if (V.value && _.value !== V.value) {
-          const c = `${_.value} ~ ${V.value}`;
-          n("update:modelValue", c);
+      if (g.value) {
+        if (_.value && g.value !== _.value) {
+          const v = `${g.value} ~ ${_.value}`;
+          l("update:modelValue", v);
         } else
-          n("update:modelValue", _.value);
-        K();
+          l("update:modelValue", g.value);
+        x();
       }
-    }, ye = () => {
+    }, me = () => {
       a.value = !0, u.value = null, setTimeout(() => {
         o.value?.querySelector(".calendar-wrap")?.focus();
       }, 50);
-    }, pe = () => {
-      a.value ? K() : ye();
-    }, me = (c) => {
-      c.code === "Escape" && (u.value ? u.value = null : a.value && K());
-    }, be = (c) => {
-      const m = c.target;
-      n("update:modelValue", m.value), n("input", c);
-    }, ke = (c) => {
-      n("change", c);
-    }, Se = (c) => {
-      n("focus", c);
-    }, Ce = (c) => {
-      n("blur", c);
+    }, ye = () => {
+      a.value ? x() : me();
+    }, pe = (v) => {
+      v.code === "Escape" && (u.value ? u.value = null : a.value && x());
+    }, be = (v) => {
+      const k = v.target;
+      l("update:modelValue", k.value), l("input", v);
+    }, ke = (v) => {
+      l("change", v);
+    }, Se = (v) => {
+      l("focus", v);
+    }, Ce = (v) => {
+      l("blur", v);
     };
-    return (c, m) => (w(), B("div", Ae, [
-      h("div", {
-        class: L(T.value)
+    return (v, k) => (B(), D("div", Ee, [
+      m("div", {
+        class: P(T.value)
       }, [
-        h("div", Ee, [
-          h("input", {
-            id: c.id,
-            name: c.name,
-            class: L(O.value),
-            placeholder: c.placeholder,
-            value: c.modelValue,
-            readonly: c.readonly,
-            disabled: c.disabled,
-            required: c.required,
-            autofocus: c.autofocus,
+        m("div", Oe, [
+          m("input", {
+            id: v.id,
+            name: v.name,
+            class: P(A.value),
+            placeholder: v.placeholder,
+            value: v.modelValue,
+            readonly: v.readonly,
+            disabled: v.disabled,
+            required: v.required,
+            autofocus: v.autofocus,
             type: "text",
             onInput: be,
             onChange: ke,
             onFocus: Se,
             onBlur: Ce
-          }, null, 42, Oe),
-          h("button", {
+          }, null, 42, Ae),
+          m("button", {
             ref_key: "datePickerButtonRef",
             ref: t,
-            class: L(`krds-btn ${c.size || "medium"} icon form-btn-datepicker`),
-            disabled: c.disabled,
+            class: P(`krds-btn ${v.size || "medium"} icon form-btn-datepicker`),
+            disabled: v.disabled,
             "aria-expanded": a.value,
             type: "button",
-            onClick: pe
-          }, [...m[4] || (m[4] = [
-            h("span", { class: "sr-only" }, "달력 열기", -1),
-            h("i", { class: "svg-icon ico-calendar" }, null, -1)
-          ])], 10, qe)
+            onClick: ye
+          }, [...k[4] || (k[4] = [
+            m("span", { class: "sr-only" }, "달력 열기", -1),
+            m("i", { class: "svg-icon ico-calendar" }, null, -1)
+          ])], 10, Fe)
         ]),
-        h("div", {
+        m("div", {
           ref_key: "datePickerAreaRef",
           ref: o,
-          class: L(P.value)
+          class: P(N.value)
         }, [
-          Y(h("div", {
+          j(m("div", {
             class: "calendar-wrap bottom",
             "aria-label": "달력",
             tabindex: "0",
-            onKeydown: me
+            onKeydown: pe
           }, [
-            h("div", Fe, [
-              h("button", {
+            m("div", qe, [
+              m("button", {
                 type: "button",
                 class: "btn-cal-move prev",
-                onClick: m[0] || (m[0] = //@ts-ignore
-                (...k) => I(d) && I(d)(...k))
-              }, [...m[5] || (m[5] = [
-                h("span", { class: "sr-only" }, "이전 달", -1)
+                onClick: k[0] || (k[0] = //@ts-ignore
+                (...C) => I(c) && I(c)(...C))
+              }, [...k[5] || (k[5] = [
+                m("span", { class: "sr-only" }, "이전 달", -1)
               ])]),
-              h("div", He, [
-                h("div", Re, [
-                  h("button", {
+              m("div", Re, [
+                m("div", He, [
+                  m("button", {
                     type: "button",
                     class: "btn-cal-switch year",
                     "aria-label": "연도 선택",
                     "aria-expanded": u.value === "year",
-                    onClick: m[1] || (m[1] = (k) => X("year"))
-                  }, N(I(v)) + "년 ", 9, Ye),
-                  Y(h("div", je, [
-                    h("ul", Ge, [
-                      (w(!0), B(E, null, F(I(y), (k) => (w(), B("li", { key: k }, [
-                        h("button", {
+                    onClick: k[1] || (k[1] = (C) => ee("year"))
+                  }, L(I(f)) + "년 ", 9, je),
+                  j(m("div", Ye, [
+                    m("ul", Ge, [
+                      (B(!0), D(O, null, q(I(y), (C) => (B(), D("li", { key: C }, [
+                        m("button", {
                           type: "button",
-                          class: L({ active: k === I(v) }),
-                          onClick: (q) => ve(k)
-                        }, N(k) + "년", 11, We)
+                          class: P({ active: C === I(f) }),
+                          onClick: (F) => ve(C)
+                        }, L(C) + "년", 11, We)
                       ]))), 128))
                     ])
                   ], 512), [
                     [G, u.value === "year"]
                   ])
                 ]),
-                h("div", Ue, [
-                  h("button", {
+                m("div", Ue, [
+                  m("button", {
                     type: "button",
                     class: "btn-cal-switch month",
                     "aria-label": "월 선택",
                     "aria-expanded": u.value === "month",
-                    onClick: m[2] || (m[2] = (k) => X("month"))
-                  }, N(I(S).toString().padStart(2, "0")) + "월 ", 9, Je),
-                  Y(h("div", Qe, [
-                    h("ul", Xe, [
-                      (w(!0), B(E, null, F(I($), (k) => (w(), B("li", { key: k }, [
-                        h("button", {
+                    onClick: k[2] || (k[2] = (C) => ee("month"))
+                  }, L(I(p).toString().padStart(2, "0")) + "월 ", 9, Je),
+                  j(m("div", Qe, [
+                    m("ul", Xe, [
+                      (B(!0), D(O, null, q(I($), (C) => (B(), D("li", { key: C }, [
+                        m("button", {
                           type: "button",
-                          class: L({ active: k === I(S) }),
-                          onClick: (q) => he(k)
-                        }, N(k.toString().padStart(2, "0")) + "월 ", 11, Ze)
+                          class: P({ active: C === I(p) }),
+                          onClick: (F) => he(C)
+                        }, L(C.toString().padStart(2, "0")) + "월 ", 11, Ze)
                       ]))), 128))
                     ])
                   ], 512), [
@@ -715,44 +715,44 @@ const Ae = { class: "form-conts" }, Ee = { class: "calendar-input" }, Oe = ["id"
                   ])
                 ])
               ]),
-              h("button", {
+              m("button", {
                 type: "button",
                 class: "btn-cal-move next",
-                onClick: m[3] || (m[3] = //@ts-ignore
-                (...k) => I(l) && I(l)(...k))
-              }, [...m[6] || (m[6] = [
-                h("span", { class: "sr-only" }, "다음 달", -1)
+                onClick: k[3] || (k[3] = //@ts-ignore
+                (...C) => I(i) && I(i)(...C))
+              }, [...k[6] || (k[6] = [
+                m("span", { class: "sr-only" }, "다음 달", -1)
               ])])
             ]),
-            h("div", et, [
-              h("div", tt, [
-                h("table", at, [
-                  h("caption", null, N(I(v)) + "년 " + N(I(S).toString().padStart(2, "0")) + "월", 1),
-                  m[7] || (m[7] = h("thead", null, [
-                    h("tr", null, [
-                      h("th", null, "일"),
-                      h("th", null, "월"),
-                      h("th", null, "화"),
-                      h("th", null, "수"),
-                      h("th", null, "목"),
-                      h("th", null, "금"),
-                      h("th", null, "토")
+            m("div", et, [
+              m("div", tt, [
+                m("table", at, [
+                  m("caption", null, L(I(f)) + "년 " + L(I(p).toString().padStart(2, "0")) + "월", 1),
+                  k[7] || (k[7] = m("thead", null, [
+                    m("tr", null, [
+                      m("th", null, "일"),
+                      m("th", null, "월"),
+                      m("th", null, "화"),
+                      m("th", null, "수"),
+                      m("th", null, "목"),
+                      m("th", null, "금"),
+                      m("th", null, "토")
                     ])
                   ], -1)),
-                  h("tbody", null, [
-                    (w(!0), B(E, null, F(z.value, (k, q) => (w(), B("tr", { key: q }, [
-                      (w(!0), B(E, null, F(k, (A, x) => (w(), B("td", {
-                        key: x,
-                        class: L(H(A)),
-                        "data-date": A.dateString
+                  m("tbody", null, [
+                    (B(!0), D(O, null, q(z.value, (C, F) => (B(), D("tr", { key: F }, [
+                      (B(!0), D(O, null, q(C, (E, V) => (B(), D("td", {
+                        key: V,
+                        class: P(R(E)),
+                        "data-date": E.dateString
                       }, [
-                        h("button", {
+                        m("button", {
                           type: "button",
                           class: "btn-set-date",
-                          "aria-pressed": I(b)(A.dateString).isInRange ? "true" : "false",
-                          onClick: (j) => I(p)(A.dateString)
+                          "aria-pressed": I(S)(E.dateString).isInRange ? "true" : "false",
+                          onClick: (Y) => I(b)(E.dateString)
                         }, [
-                          h("span", null, N(A.day), 1)
+                          m("span", null, L(E.day), 1)
                         ], 8, nt)
                       ], 10, lt))), 128))
                     ]))), 128))
@@ -760,18 +760,18 @@ const Ae = { class: "form-conts" }, Ee = { class: "calendar-input" }, Oe = ["id"
                 ])
               ])
             ]),
-            h("div", st, [
-              h("div", it, [
-                (w(!0), B(E, null, F(D.value, (k) => (w(), W(I(oe), {
-                  id: k.id,
-                  key: k.id,
-                  class: L(k.class),
-                  variant: k.variant,
-                  size: k.size,
-                  onClick: k.handler
+            m("div", st, [
+              m("div", it, [
+                (B(!0), D(O, null, q(K.value, (C) => (B(), W(I(de), {
+                  id: C.id,
+                  key: C.id,
+                  class: P(C.class),
+                  variant: C.variant,
+                  size: C.size,
+                  onClick: C.handler
                 }, {
                   default: U(() => [
-                    R(N(k.label), 1)
+                    H(L(C.label), 1)
                   ]),
                   _: 2
                 }, 1032, ["id", "class", "variant", "size", "onClick"]))), 128))
@@ -784,7 +784,7 @@ const Ae = { class: "form-conts" }, Ee = { class: "calendar-input" }, Oe = ["id"
       ], 2)
     ]));
   }
-}), ot = C({
+}), ot = w({
   name: "KrdsTextarea",
   props: {
     modelValue: {
@@ -858,37 +858,37 @@ const Ae = { class: "form-conts" }, Ee = { class: "calendar-input" }, Oe = ["id"
     }
   },
   emits: ["update:modelValue", "input", "change", "focus", "blur", "keydown", "keyup"],
-  setup(e, { emit: i }) {
-    const s = M(0);
-    Be(
+  setup(e, { emit: s }) {
+    const n = M(0);
+    _e(
       () => e.modelValue,
-      (l) => {
-        s.value = (l || "").length;
+      (i) => {
+        n.value = (i || "").length;
       },
       { immediate: !0 }
     );
-    const n = g(() => {
-      const l = ["krds-input"];
-      return e.size && l.push(e.size), e.class && l.push(e.class), l;
-    }), o = g(() => {
-      const l = {};
-      return e.resize && (l.resize = e.resize), l;
-    }), t = (l) => {
-      const f = l.target.value;
-      s.value = f.length, i("update:modelValue", f), i("input", l);
-    }, a = (l) => {
-      i("change", l);
-    }, u = (l) => {
-      i("focus", l);
-    }, v = (l) => {
-      i("blur", l);
-    }, S = (l) => {
-      i("keydown", l);
-    }, _ = (l) => {
-      i("keyup", l);
-    }, V = g(() => {
-      const l = {
-        class: n.value,
+    const l = d(() => {
+      const i = ["krds-input"];
+      return e.size && i.push(e.size), e.class && i.push(e.class), i;
+    }), o = d(() => {
+      const i = {};
+      return e.resize && (i.resize = e.resize), i;
+    }), t = (i) => {
+      const h = i.target.value;
+      n.value = h.length, s("update:modelValue", h), s("input", i);
+    }, a = (i) => {
+      s("change", i);
+    }, u = (i) => {
+      s("focus", i);
+    }, f = (i) => {
+      s("blur", i);
+    }, p = (i) => {
+      s("keydown", i);
+    }, g = (i) => {
+      s("keyup", i);
+    }, _ = d(() => {
+      const i = {
+        class: l.value,
         style: o.value,
         value: e.modelValue,
         placeholder: e.placeholder,
@@ -903,30 +903,124 @@ const Ae = { class: "form-conts" }, Ee = { class: "calendar-input" }, Oe = ["id"
         onInput: t,
         onChange: a,
         onFocus: u,
-        onBlur: v,
-        onKeydown: S,
-        onKeyup: _
+        onBlur: f,
+        onKeydown: p,
+        onKeyup: g
       };
-      return e.maxlength !== void 0 && (l.maxlength = e.maxlength), e.minlength !== void 0 && (l.minlength = e.minlength), l;
-    }), y = g(() => ["form-conts"]), $ = g(() => ["textarea-wrap"]), d = g(() => {
+      return e.maxlength !== void 0 && (i.maxlength = e.maxlength), e.minlength !== void 0 && (i.minlength = e.minlength), i;
+    }), y = d(() => ["form-conts"]), $ = d(() => ["textarea-wrap"]), c = d(() => {
       if (!e.showCount) return null;
-      const l = s.value, p = e.maxlength;
+      const i = n.value, b = e.maxlength;
       return {
-        current: l,
-        max: p || ""
+        current: i,
+        max: b || ""
       };
     });
     return () => {
-      const l = [r("textarea", V.value)];
-      return d.value && l.push(
+      const i = [r("textarea", _.value)];
+      return c.value && i.push(
         r("p", { class: "textarea-count" }, [
-          r("span", { class: "count-now" }, d.value.current),
-          r("span", { class: "count-total" }, d.value.max ? `/${d.value.max}` : "")
+          r("span", { class: "count-now" }, c.value.current),
+          r("span", { class: "count-total" }, c.value.max ? `/${c.value.max}` : "")
         ])
-      ), r("div", { class: y.value }, [r("div", { class: $.value }, l)]);
+      ), r("div", { class: y.value }, [r("div", { class: $.value }, i)]);
+    };
+  }
+}), ut = w({
+  name: "KrdsSelect",
+  props: {
+    modelValue: {
+      type: [String, Number, null],
+      default: null
+    },
+    size: {
+      type: String,
+      default: "medium"
+    },
+    title: {
+      type: String,
+      default: void 0
+    },
+    options: {
+      type: Array,
+      default: () => []
+    },
+    placeholder: {
+      type: String,
+      default: "선택"
+    },
+    name: {
+      type: String,
+      default: void 0
+    },
+    disabled: {
+      type: Boolean,
+      default: !1
+    },
+    state: {
+      type: String,
+      default: "default"
+    },
+    sort: {
+      type: Boolean,
+      default: !1
+    },
+    class: {
+      type: String,
+      default: void 0
+    },
+    id: {
+      type: String,
+      default: void 0
+    }
+  },
+  emits: ["update:modelValue", "focus", "blur"],
+  setup(e, { emit: s, slots: n }) {
+    const l = d(() => {
+      const g = [];
+      return e.sort ? g.push("krds-form-select-sort") : g.push("krds-form-select"), e.size && g.push(e.size), e.class && g.push(e.class), g;
+    }), o = (g) => {
+      const _ = g.target, y = _.value === "" ? null : _.value;
+      s("update:modelValue", y);
+    }, t = (g) => {
+      s("focus", g);
+    }, a = (g) => {
+      s("blur", g);
+    }, u = d(() => ({
+      class: l.value,
+      value: e.modelValue ?? "",
+      title: e.title || e.placeholder,
+      name: e.name,
+      id: e.id,
+      disabled: e.disabled || e.readonly,
+      onChange: o,
+      onFocus: t,
+      onBlur: a
+    })), f = d(() => {
+      const g = ["form-conts"];
+      return e.state !== "default" && g.push(`is-${e.state}`), g;
+    }), p = () => {
+      const g = [];
+      return e.placeholder && !e.modelValue && g.push(r("option", { value: "", disabled: !0, selected: !0 }, e.placeholder)), e.options && e.options.length > 0 && e.options.forEach((_) => {
+        g.push(
+          r(
+            "option",
+            {
+              value: _.value,
+              disabled: _.disabled,
+              selected: _.value === e.modelValue
+            },
+            _.label
+          )
+        );
+      }), n.default && g.push(...n.default()), g;
+    };
+    return () => {
+      const g = r("select", u.value, p());
+      return e.sort ? g : r("div", { class: f.value }, [g]);
     };
   }
-}), ut = C({
+}), dt = w({
   name: "KrdsFileUpload",
   props: {
     modelValue: {
@@ -1029,15 +1123,15 @@ const Ae = { class: "form-conts" }, Ee = { class: "calendar-input" }, Oe = ["id"
     "download",
     "preview"
   ],
-  setup(e, { emit: i }) {
-    M(!1), g(() => {
-      const n = ["krds-file-upload", "line"];
-      return e.class && n.push(e.class), n;
+  setup(e, { emit: s }) {
+    M(!1), d(() => {
+      const l = ["krds-file-upload", "line"];
+      return e.class && l.push(e.class), l;
     });
-    const s = g(() => e.modelValue?.length || 0);
-    return g(() => !e.disabled && s.value < e.maxFiles), () => null;
+    const n = d(() => e.modelValue?.length || 0);
+    return d(() => !e.disabled && n.value < e.maxFiles), () => null;
   }
-}), dt = C({
+}), ct = w({
   name: "KrdsBadge",
   props: {
     type: {
@@ -1062,12 +1156,12 @@ const Ae = { class: "form-conts" }, Ee = { class: "calendar-input" }, Oe = ["id"
     }
   },
   emits: ["click"],
-  setup(e, { emit: i, slots: s }) {
-    const n = g(() => {
+  setup(e, { emit: s, slots: n }) {
+    const l = d(() => {
       const t = ["krds-badge"];
       return t.push(`${e.type}-${e.color}`), e.size && t.push(e.size), e.number && t.push("number"), e.class && t.push(e.class), t;
     }), o = (t) => {
-      i("click", t);
+      s("click", t);
     };
     return () => r(
       "span",
@@ -1076,13 +1170,13 @@ const Ae = { class: "form-conts" }, Ee = { class: "calendar-input" }, Oe = ["id"
         color: e.color,
         size: e.size,
         number: e.number,
-        class: n.value,
+        class: l.value,
         onClick: o
       },
-      s.default?.()
+      n.default?.()
     );
   }
-}), ct = C({
+}), ft = w({
   name: "KrdsTag",
   props: {
     link: {
@@ -1107,12 +1201,12 @@ const Ae = { class: "form-conts" }, Ee = { class: "calendar-input" }, Oe = ["id"
     }
   },
   emits: ["remove"],
-  setup(e, { emit: i, slots: s }) {
-    const n = g(() => {
+  setup(e, { emit: s, slots: n }) {
+    const l = d(() => {
       const a = ["krds-btn-tag"];
       return e.link && a.push("link"), e.class && a.push(e.class), a;
     }), o = (a) => {
-      i("remove", a);
+      s("remove", a);
     }, t = () => r(
       "button",
       {
@@ -1123,24 +1217,24 @@ const Ae = { class: "form-conts" }, Ee = { class: "calendar-input" }, Oe = ["id"
       [r("span", { class: "sr-only" }, "삭제")]
     );
     return () => {
-      const a = [], u = s.default?.();
+      const a = [], u = n.default?.();
       if (u && a.push(u), e.link || a.push(t()), e.link) {
-        const v = {
+        const f = {
           href: e.href,
-          class: n.value
+          class: l.value
         };
-        return e.target && (v.target = e.target), e.rel && (v.rel = e.rel), r("a", v, a);
+        return e.target && (f.target = e.target), e.rel && (f.rel = e.rel), r("a", f, a);
       }
       return r(
         "span",
         {
-          class: n.value
+          class: l.value
         },
         a
       );
     };
   }
-}), ft = C({
+}), vt = w({
   name: "KrdsTagGroup",
   props: {
     size: {
@@ -1152,20 +1246,20 @@ const Ae = { class: "form-conts" }, Ee = { class: "calendar-input" }, Oe = ["id"
       default: void 0
     }
   },
-  setup(e, { slots: i }) {
-    const s = g(() => {
-      const n = ["krds-tag-wrap"];
-      return e.size && n.push(e.size), e.class && n.push(e.class), n;
+  setup(e, { slots: s }) {
+    const n = d(() => {
+      const l = ["krds-tag-wrap"];
+      return e.size && l.push(e.size), e.class && l.push(e.class), l;
     });
     return () => r(
       "div",
       {
-        class: s.value
+        class: n.value
       },
-      i.default?.()
+      s.default?.()
     );
   }
-}), vt = C({
+}), ht = w({
   name: "KrdsMasthead",
   props: {
     class: {
@@ -1174,36 +1268,40 @@ const Ae = { class: "form-conts" }, Ee = { class: "calendar-input" }, Oe = ["id"
     }
   },
   emits: ["click"],
-  setup(e, { emit: i, slots: s }) {
-    const n = g(() => {
+  setup(e, { emit: s, slots: n }) {
+    const l = d(() => {
       const t = [""];
       return e.class && t.push(e.class), t;
     }), o = (t) => {
-      i("click", t);
+      s("click", t);
     };
     return () => r(
       "div",
       {
         id: "krds-masthead",
-        class: n.value,
+        class: l.value,
         onClick: o
       },
       [
         r("div", { class: "toggle-wrap" }, [
-          r("div", { class: "toggle-head" }, [r("div", { class: "inner" }, [r("span", { class: "nuri-txt" }, s.default?.())])])
+          r("div", { class: "toggle-head" }, [r("div", { class: "inner" }, [r("span", { class: "nuri-txt" }, n.default?.())])])
         ])
       ]
     );
   }
 });
-let ht = 0;
-function de(e = "krds") {
-  return `${e}-${++ht}`;
+let gt = 0;
+function Q(e = "krds") {
+  return `${e}-${++gt}`;
+}
+function Lt() {
+  const e = Date.now().toString(36).slice(-4), s = Math.random().toString(36).substring(2, 5);
+  return `${e}${s}`;
 }
-function ce(...e) {
+function X(...e) {
   return e.filter(Boolean).join(" ");
 }
-const gt = C({
+const mt = w({
   name: "KrdsToggleSwitch",
   props: {
     modelValue: {
@@ -1245,13 +1343,13 @@ const gt = C({
     }
   },
   emits: ["update:modelValue", "change"],
-  setup(e, { emit: i, attrs: s }) {
-    const n = g(() => e.modelValue), o = g(() => ce("krds-form-toggle-switch", e.size, e.class)), t = (u) => {
+  setup(e, { emit: s, attrs: n }) {
+    const l = d(() => e.modelValue), o = d(() => X("krds-form-toggle-switch", e.size, e.class)), t = (u) => {
       if (e.disabled)
         return;
-      const S = u.target.checked;
-      i("update:modelValue", S), i("change", S);
-    }, a = g(() => e.id || de("toggle-switch"));
+      const p = u.target.checked;
+      s("update:modelValue", p), s("change", p);
+    }, a = d(() => e.id || Q("toggle-switch"));
     return () => r(
       "div",
       {
@@ -1262,10 +1360,10 @@ const gt = C({
           type: "checkbox",
           id: a.value,
           name: e.name,
-          checked: n.value,
+          checked: l.value,
           disabled: e.disabled,
           onChange: t,
-          ...s
+          ...n
         }),
         r(
           "label",
@@ -1286,27 +1384,31 @@ const gt = C({
       ]
     );
   }
-}), yt = C({
+}), yt = w({
   name: "KrdsCheckArea",
   props: {
     class: {
       type: String,
       default: void 0
+    },
+    column: {
+      type: Boolean,
+      default: !1
     }
   },
-  setup(e, { slots: i }) {
+  setup(e, { slots: s }) {
     return () => {
-      const s = ["krds-check-area"];
-      return e.class && s.push(e.class), r(
+      const n = ["krds-check-area"];
+      return e.column && n.push("chk-column"), e.class && n.push(e.class), r(
         "div",
         {
-          class: s
+          class: n
         },
-        i.default?.()
+        s.default?.()
       );
     };
   }
-}), pt = C({
+}), pt = w({
   name: "KrdsCheckbox",
   props: {
     modelValue: {
@@ -1335,46 +1437,123 @@ const gt = C({
       default: void 0
     }
   },
-  emits: ["update:modelValue", "change"],
+  emits: ["update:modelValue"],
   slots: Object,
-  setup(e, { emit: i, attrs: s, slots: n }) {
-    const o = g(() => e.modelValue), t = g(() => {
-      const v = e.chip ? "krds-form-chip" : "krds-form-check";
-      return ce(v, e.size, e.class);
-    }), a = (v) => {
+  setup(e, { emit: s, attrs: n, slots: l }) {
+    const o = d(() => e.modelValue), t = d(() => {
+      const f = e.chip ? "krds-form-chip" : "krds-form-check";
+      return X(f, e.size, e.class);
+    }), a = (f) => {
       if (e.disabled)
         return;
-      const _ = v.target.checked;
-      i("update:modelValue", _), i("change", _);
-    }, u = g(() => e.id || de("checkbox"));
+      const g = f.target.checked;
+      s("update:modelValue", g);
+    }, u = d(() => e.id || Q("checkbox"));
     return () => {
-      const v = [
+      const f = [
         r("input", {
           type: "checkbox",
           id: u.value,
           checked: o.value,
           disabled: e.disabled,
           onChange: a,
-          ...s
+          ...n
         }),
         r(
           "label",
           {
             for: u.value
           },
-          n.default?.()
+          l.default?.()
         )
       ];
-      return n.description && !e.chip && v.push(r("div", { class: "krds-form-check-cnt" }, r("p", { class: "krds-form-check-p" }, n.description()))), r(
+      return l.description && !e.chip && f.push(r("div", { class: "krds-form-check-cnt" }, r("p", { class: "krds-form-check-p" }, l.description()))), r(
         "div",
         {
           class: t.value
         },
-        v
+        f
       );
     };
   }
-}), mt = C({
+}), bt = w({
+  name: "KrdsRadio",
+  props: {
+    modelValue: {
+      type: [String, Number, Boolean],
+      default: void 0
+    },
+    value: {
+      type: [String, Number, Boolean],
+      required: !0
+    },
+    disabled: {
+      type: Boolean,
+      default: !1
+    },
+    size: {
+      type: String,
+      default: "medium",
+      validator: (e) => ["medium", "large"].includes(e)
+    },
+    chip: {
+      type: Boolean,
+      default: !1
+    },
+    name: {
+      type: String,
+      default: void 0
+    },
+    class: {
+      type: String,
+      default: void 0
+    },
+    id: {
+      type: String,
+      default: void 0
+    }
+  },
+  emits: ["update:modelValue"],
+  slots: Object,
+  setup(e, { emit: s, attrs: n, slots: l }) {
+    const o = d(() => e.modelValue === e.value), t = d(() => {
+      const p = e.chip ? "krds-form-chip" : "krds-form-check";
+      return X(p, e.size, e.class);
+    }), a = (p) => {
+      if (e.disabled)
+        return;
+      p.target.checked && s("update:modelValue", e.value);
+    }, u = d(() => e.id || Q("radio")), f = d(() => e.name);
+    return () => {
+      const p = [
+        r("input", {
+          type: "radio",
+          id: u.value,
+          name: f.value,
+          value: String(e.value),
+          checked: o.value,
+          disabled: e.disabled,
+          onChange: a,
+          ...n
+        }),
+        r(
+          "label",
+          {
+            for: u.value
+          },
+          l.default?.()
+        )
+      ];
+      return l.description && !e.chip && p.push(r("div", { class: "krds-form-check-cnt" }, r("p", { class: "krds-form-check-p" }, l.description()))), r(
+        "div",
+        {
+          class: t.value
+        },
+        p
+      );
+    };
+  }
+}), kt = w({
   name: "KrdsStepIndicator",
   props: {
     modelValue: {
@@ -1387,30 +1566,30 @@ const gt = C({
     }
   },
   emits: ["update:modelValue"],
-  setup(e, { slots: i }) {
-    const s = g(() => {
+  setup(e, { slots: s }) {
+    const n = d(() => {
       const u = ["krds-step-wrap"];
       return e.class && u.push(e.class), u;
-    }), n = (u) => {
-      const v = e.modelValue || 0;
-      return u < v ? "done" : u === v ? "active" : "pending";
+    }), l = (u) => {
+      const f = e.modelValue || 0;
+      return u < f ? "done" : u === f ? "active" : "pending";
     }, o = M(0), t = () => {
       o.value = 0;
     }, a = () => o.value++;
     return De("stepIndicator", {
-      activeStep: g(() => e.modelValue || 0),
-      getStepStatus: n,
+      activeStep: d(() => e.modelValue || 0),
+      getStepStatus: l,
       getNextStepIndex: a,
       resetStepIndex: t
     }), () => (t(), r(
       "ol",
       {
-        class: s.value
+        class: n.value
       },
-      i.default?.()
+      s.default?.()
     ));
   }
-}), bt = C({
+}), St = w({
   name: "KrdsStep",
   props: {
     step: {
@@ -1431,15 +1610,15 @@ const gt = C({
     }
   },
   emits: ["click"],
-  setup(e, { emit: i, slots: s }) {
-    const n = Ke("stepIndicator"), o = n ? n.getNextStepIndex() : -1, t = g(() => e.status ? e.status : n && o >= 0 ? n.getStepStatus(o) : "pending"), a = g(() => {
-      const v = [t.value];
-      return e.class && v.push(e.class), v;
-    }), u = (v) => {
-      i("click", v, e.step);
+  setup(e, { emit: s, slots: n }) {
+    const l = Ke("stepIndicator"), o = l ? l.getNextStepIndex() : -1, t = d(() => e.status ? e.status : l && o >= 0 ? l.getStepStatus(o) : "pending"), a = d(() => {
+      const f = [t.value];
+      return e.class && f.push(e.class), f;
+    }), u = (f) => {
+      s("click", f, e.step);
     };
     return () => {
-      const v = t.value === "active";
+      const f = t.value === "active";
       return r(
         "li",
         {
@@ -1449,19 +1628,19 @@ const gt = C({
         [
           r("span", [
             // 현재 단계 표시 (활성 상태일 때만)
-            v && r("em", { class: "sr-only" }, "현재단계"),
+            f && r("em", { class: "sr-only" }, "현재단계"),
             // 단계 번호
             r("i", { class: "step" }, e.step),
             // 단계 제목
             r("span", { class: "step-tit" }, e.title),
             // 슬롯 내용 (추가 콘텐츠가 있는 경우)
-            s.default?.()
+            n.default?.()
           ])
         ]
       );
     };
   }
-}), kt = C({
+}), Ct = w({
   name: "KrdsSkipLink",
   props: {
     /**
@@ -1488,7 +1667,7 @@ const gt = C({
       default: "krds-skip-link"
     }
   },
-  setup(e, { slots: i }) {
+  setup(e, { slots: s }) {
     return () => r(
       "div",
       {
@@ -1501,12 +1680,12 @@ const gt = C({
           {
             href: e.href
           },
-          i.default?.()
+          s.default?.()
         )
       ]
     );
   }
-}), St = ["id", "aria-label"], Ct = { class: "breadcrumb" }, wt = ["href", "aria-current", "onClick"], _t = { key: 0 }, Bt = /* @__PURE__ */ C({
+}), wt = ["id", "aria-label"], Bt = { class: "breadcrumb" }, _t = ["href", "aria-current", "onClick"], Dt = { key: 0 }, Kt = /* @__PURE__ */ w({
   __name: "KrdsBreadcrumb",
   props: {
     items: {},
@@ -1515,33 +1694,33 @@ const gt = C({
     showHomeIcon: { type: Boolean, default: !0 }
   },
   emits: ["item-click"],
-  setup(e, { emit: i }) {
-    const s = e, n = i, o = (a) => a === s.items.length - 1, t = (a, u) => {
-      a.onClick && a.onClick(u), n("item-click", a, u);
+  setup(e, { emit: s }) {
+    const n = e, l = s, o = (a) => a === n.items.length - 1, t = (a, u) => {
+      a.onClick && a.onClick(u), l("item-click", a, u);
     };
-    return (a, u) => (w(), B("nav", {
+    return (a, u) => (B(), D("nav", {
       id: a.id,
       class: "krds-breadcrumb-wrap",
       "aria-label": a.ariaLabel
     }, [
-      h("ol", Ct, [
-        (w(!0), B(E, null, F(a.items, (v, S) => (w(), B("li", {
-          key: `breadcrumb-${S}`,
-          class: L({ home: S === 0 && a.showHomeIcon })
+      m("ol", Bt, [
+        (B(!0), D(O, null, q(a.items, (f, p) => (B(), D("li", {
+          key: `breadcrumb-${p}`,
+          class: P({ home: p === 0 && a.showHomeIcon })
         }, [
-          h("a", {
-            href: v.href || "#",
+          m("a", {
+            href: f.href || "#",
             class: "txt",
-            "aria-current": o(S) ? "page" : void 0,
-            onClick: (_) => t(v, _)
+            "aria-current": o(p) ? "page" : void 0,
+            onClick: (g) => t(f, g)
           }, [
-            S === 0 && a.showHomeIcon ? J("", !0) : (w(), B("span", _t, N(v.text), 1))
-          ], 8, wt)
+            p === 0 && a.showHomeIcon ? J("", !0) : (B(), D("span", Dt, L(f.text), 1))
+          ], 8, _t)
         ], 2))), 128))
       ])
-    ], 8, St));
+    ], 8, wt));
   }
-}), Dt = C({
+}), xt = w({
   name: "KrdsInPageNavigation",
   props: {
     title: {
@@ -1575,107 +1754,107 @@ const gt = C({
   },
   emits: ["itemClick"],
   slots: Object,
-  setup(e, { emit: i, slots: s }) {
-    const n = M(""), o = M(/* @__PURE__ */ new Map()), t = g(() => {
-      const d = ["krds-in-page-navigation-type"];
-      return e.class && d.push(e.class), d;
+  setup(e, { emit: s, slots: n }) {
+    const l = M(""), o = M(/* @__PURE__ */ new Map()), t = d(() => {
+      const c = ["krds-in-page-navigation-type"];
+      return e.class && c.push(e.class), c;
     }), a = () => {
-      const d = e.headerTopSelector, l = e.headerInnerSelector, p = document.querySelector(d)?.clientHeight || 0, f = document.querySelector(l)?.clientHeight || 0;
-      return p + f;
-    }, u = (d, l) => {
-      if (i("itemClick", d, l), d.href.startsWith("#")) {
-        l.preventDefault();
-        const p = document.querySelector(d.href);
-        if (p) {
-          const f = a();
+      const c = e.headerTopSelector, i = e.headerInnerSelector, b = document.querySelector(c)?.clientHeight || 0, h = document.querySelector(i)?.clientHeight || 0;
+      return b + h;
+    }, u = (c, i) => {
+      if (s("itemClick", c, i), c.href.startsWith("#")) {
+        i.preventDefault();
+        const b = document.querySelector(c.href);
+        if (b) {
+          const h = a();
           if (window.scrollTo({
             left: 0,
-            top: p.getBoundingClientRect().top + window.scrollY - f,
+            top: b.getBoundingClientRect().top + window.scrollY - h,
             behavior: "smooth"
-          }), n.value = d.href, l instanceof KeyboardEvent) {
-            const b = p.querySelector(".sec-tit, h1, h2, h3, h4, h5, h6");
-            b && b instanceof HTMLElement && (b.setAttribute("tabindex", "-1"), b.focus({ preventScroll: !0 }));
+          }), l.value = c.href, i instanceof KeyboardEvent) {
+            const S = b.querySelector(".sec-tit, h1, h2, h3, h4, h5, h6");
+            S && S instanceof HTMLElement && (S.setAttribute("tabindex", "-1"), S.focus({ preventScroll: !0 }));
           }
         }
       }
-    }, v = () => {
-      o.value.clear(), e.items && e.items.filter((d) => d.href.startsWith("#")).forEach((d) => {
-        const l = document.querySelector(d.href);
-        l && o.value.set(d.href, l);
+    }, f = () => {
+      o.value.clear(), e.items && e.items.filter((c) => c.href.startsWith("#")).forEach((c) => {
+        const i = document.querySelector(c.href);
+        i && o.value.set(c.href, i);
       });
-    }, S = () => {
+    }, p = () => {
       if (!e.autoActive || !e.items || o.value.size === 0) return;
-      const d = window.innerHeight, l = Math.ceil(d / 5), p = window.scrollY + d, f = document.body.scrollHeight, b = e.items.filter((z) => z.href.startsWith("#") && o.value.has(z.href)).map((z) => ({
+      const c = window.innerHeight, i = Math.ceil(c / 5), b = window.scrollY + c, h = document.body.scrollHeight, S = e.items.filter((z) => z.href.startsWith("#") && o.value.has(z.href)).map((z) => ({
         href: z.href,
         element: o.value.get(z.href),
         item: z
       }));
-      if (b.length === 0) return;
-      const K = b[0], O = b[b.length - 1], T = K.element.offsetTop;
-      let P = "";
-      if (p >= f)
-        P = O.href;
+      if (S.length === 0) return;
+      const x = S[0], A = S[S.length - 1], T = x.element.offsetTop;
+      let N = "";
+      if (b >= h)
+        N = A.href;
       else if (window.scrollY <= T)
-        P = K.href;
+        N = x.href;
       else
-        for (const z of b) {
-          const H = z.element.offsetHeight, D = z.element.offsetTop - l;
-          if (window.scrollY > D && window.scrollY <= D + H) {
-            P = z.href;
+        for (const z of S) {
+          const R = z.element.offsetHeight, K = z.element.offsetTop - i;
+          if (window.scrollY > K && window.scrollY <= K + R) {
+            N = z.href;
             break;
           }
         }
-      P && P !== n.value && (n.value = P);
-    }, _ = () => {
+      N && N !== l.value && (l.value = N);
+    }, g = () => {
       if (!e.items) return;
-      const d = e.items.find((l) => l.active);
-      d ? n.value = d.href : e.items.length > 0 && (n.value = e.items[0].href);
+      const c = e.items.find((i) => i.active);
+      c ? l.value = c.href : e.items.length > 0 && (l.value = e.items[0].href);
     };
-    re(() => {
-      if (_(), e.autoActive) {
-        v(), S(), window.addEventListener("scroll", S, { passive: !0 });
-        const d = new MutationObserver(() => {
-          v();
+    ue(() => {
+      if (g(), e.autoActive) {
+        f(), p(), window.addEventListener("scroll", p, { passive: !0 });
+        const c = new MutationObserver(() => {
+          f();
         });
-        d.observe(document.body, {
+        c.observe(document.body, {
           childList: !0,
           subtree: !0
-        }), ae(() => {
-          d.disconnect();
+        }), ne(() => {
+          c.disconnect();
         });
       }
-    }), ae(() => {
-      e.autoActive && (window.removeEventListener("scroll", S), o.value.clear());
+    }), ne(() => {
+      e.autoActive && (window.removeEventListener("scroll", p), o.value.clear());
     });
-    const V = () => !e.caption && !e.title ? null : r("div", { class: "in-page-navigation-header" }, [
+    const _ = () => !e.caption && !e.title ? null : r("div", { class: "in-page-navigation-header" }, [
       e.caption && r("p", { class: "quick-caption" }, e.caption),
       e.title && r("p", { class: "quick-title" }, e.title)
     ]), y = () => {
       if (!e.items) return null;
-      const d = e.items.map((l) => {
-        const p = n.value === l.href || !e.autoActive && l.active;
-        return r("li", { key: l.href }, [
+      const c = e.items.map((i) => {
+        const b = l.value === i.href || !e.autoActive && i.active;
+        return r("li", { key: i.href }, [
           r(
             "a",
             {
-              href: l.href,
-              class: p ? "active" : "",
-              onClick: (f) => u(l, f),
-              onKeydown: (f) => {
-                (f.key === "Enter" || f.key === " ") && (f.preventDefault(), u(l, f));
+              href: i.href,
+              class: b ? "active" : "",
+              onClick: (h) => u(i, h),
+              onKeydown: (h) => {
+                (h.key === "Enter" || h.key === " ") && (h.preventDefault(), u(i, h));
               }
             },
-            l.text
+            i.text
           )
         ]);
       });
-      return r("nav", { class: "in-page-navigation-list" }, [r("ul", {}, d)]);
-    }, $ = () => s.action ? r("div", { class: "in-page-navigation-action" }, [s.action()]) : null;
+      return r("nav", { class: "in-page-navigation-list" }, [r("ul", {}, c)]);
+    }, $ = () => n.action ? r("div", { class: "in-page-navigation-action" }, [n.action()]) : null;
     return () => r("div", { class: t.value }, [
-      r("div", { class: "krds-in-page-navigation-area" }, [V(), y(), $()].filter(Boolean))
+      r("div", { class: "krds-in-page-navigation-area" }, [_(), y(), $()].filter(Boolean))
     ]);
   }
-}), Kt = ["id"], xt = { class: "page-links" }, It = ["href", "aria-current", "onClick"], Vt = { key: 0 }, zt = ["aria-label"], Mt = /* @__PURE__ */ C({
+}), Vt = ["id"], It = { class: "page-links" }, zt = ["href", "aria-current", "onClick"], Mt = { key: 0 }, $t = ["aria-label"], Nt = /* @__PURE__ */ w({
   __name: "KrdsPagination",
   props: {
     modelValue: { default: 1 },
@@ -1686,221 +1865,226 @@ const gt = C({
     pageRange: { default: 8 }
   },
   emits: ["update:modelValue"],
-  setup(e, { emit: i }) {
-    const s = e, n = i, o = g(() => Math.max(1, s.min)), t = g(() => s.modelValue ?? o.value), a = g(() => t.value <= o.value), u = g(() => t.value >= s.max), v = g(() => {
+  setup(e, { emit: s }) {
+    const n = e, l = s, o = d(() => Math.max(1, n.min)), t = d(() => n.modelValue ?? o.value), a = d(() => t.value <= o.value), u = d(() => t.value >= n.max), f = d(() => {
       if (!a.value)
         return "#";
-    }), S = g(() => {
+    }), p = d(() => {
       if (!u.value)
         return "#";
-    }), _ = g(() => {
-      const { pageRange: d, max: l } = s, p = 1, f = [];
-      if (l <= d + 2 * p)
-        for (let b = o.value; b <= l; b++)
-          f.push({
+    }), g = d(() => {
+      const { pageRange: c, max: i } = n, b = 1, h = [];
+      if (i <= c + 2 * b)
+        for (let S = o.value; S <= i; S++)
+          h.push({
             type: "page",
-            key: `page-${b}`,
-            page: b,
+            key: `page-${S}`,
+            page: S,
             href: "#"
           });
       else {
-        const b = Math.min(p, l), K = Math.max(l - p + 1, 1), O = Math.max(o.value, t.value - Math.floor(d / 2)), T = Math.min(l, O + d - 1), P = Math.max(o.value, T - d + 1);
-        for (let D = o.value; D <= b; D++)
-          f.push({
+        const S = Math.min(b, i), x = Math.max(i - b + 1, 1), A = Math.max(o.value, t.value - Math.floor(c / 2)), T = Math.min(i, A + c - 1), N = Math.max(o.value, T - c + 1);
+        for (let K = o.value; K <= S; K++)
+          h.push({
             type: "page",
-            key: `page-${D}`,
-            page: D,
+            key: `page-${K}`,
+            page: K,
             href: "#"
           });
-        P > b + 1 && f.push({
+        N > S + 1 && h.push({
           type: "ellipsis",
           key: "ellipsis-left",
           ariaLabel: "페이지 생략"
         });
-        const z = Math.max(P, b + 1), H = Math.min(T, K - 1);
-        for (let D = z; D <= H; D++)
-          f.push({
+        const z = Math.max(N, S + 1), R = Math.min(T, x - 1);
+        for (let K = z; K <= R; K++)
+          h.push({
             type: "page",
-            key: `page-${D}`,
-            page: D,
+            key: `page-${K}`,
+            page: K,
             href: "#"
           });
-        T < K - 1 && f.push({
+        T < x - 1 && h.push({
           type: "ellipsis",
           key: "ellipsis-right",
           ariaLabel: "페이지 생략"
         });
-        for (let D = K; D <= l; D++)
-          f.push({
+        for (let K = x; K <= i; K++)
+          h.push({
             type: "page",
-            key: `page-${D}`,
-            page: D,
+            key: `page-${K}`,
+            page: K,
             href: "#"
           });
       }
-      return f;
-    }), V = (d, l) => {
-      if (d === t.value) {
-        l.preventDefault();
+      return h;
+    }), _ = (c, i) => {
+      if (c === t.value) {
+        i.preventDefault();
         return;
       }
-      n("update:modelValue", d);
-    }, y = (d) => {
+      l("update:modelValue", c);
+    }, y = (c) => {
       if (a.value) {
-        d.preventDefault();
+        c.preventDefault();
         return;
       }
-      const l = t.value - 1;
-      n("update:modelValue", l);
-    }, $ = (d) => {
+      const i = t.value - 1;
+      l("update:modelValue", i);
+    }, $ = (c) => {
       if (u.value) {
-        d.preventDefault();
+        c.preventDefault();
         return;
       }
-      const l = t.value + 1;
-      n("update:modelValue", l);
+      const i = t.value + 1;
+      l("update:modelValue", i);
     };
-    return (d, l) => {
-      const p = xe("sr-only");
-      return w(), B("div", {
-        id: d.id,
+    return (c, i) => {
+      const b = xe("sr-only");
+      return B(), D("div", {
+        id: c.id,
         class: "krds-pagination"
       }, [
-        (w(), W(le(a.value ? "span" : "a"), {
-          href: a.value ? void 0 : v.value,
-          class: L(["page-navi", "prev", { disabled: a.value }]),
+        (B(), W(se(a.value ? "span" : "a"), {
+          href: a.value ? void 0 : f.value,
+          class: P(["page-navi", "prev", { disabled: a.value }]),
           onClick: y
         }, {
-          default: U(() => [...l[0] || (l[0] = [
-            R(" 이전 ", -1)
+          default: U(() => [...i[0] || (i[0] = [
+            H(" 이전 ", -1)
           ])]),
           _: 1
         }, 8, ["href", "class"])),
-        h("div", xt, [
-          (w(!0), B(E, null, F(_.value, (f) => (w(), B(E, {
-            key: f.key
+        m("div", It, [
+          (B(!0), D(O, null, q(g.value, (h) => (B(), D(O, {
+            key: h.key
           }, [
-            f.type === "page" ? (w(), B("a", {
+            h.type === "page" ? (B(), D("a", {
               key: 0,
-              href: f.href || "#",
-              class: L(["page-link", { active: f.page === t.value }]),
-              "aria-current": f.page === t.value ? "page" : void 0,
-              onClick: (b) => V(f.page, b)
+              href: h.href || "#",
+              class: P(["page-link", { active: h.page === t.value }]),
+              "aria-current": h.page === t.value ? "page" : void 0,
+              onClick: (S) => _(h.page, S)
             }, [
-              f.page === t.value ? Y((w(), B("span", Vt, [...l[1] || (l[1] = [
-                R("현재페이지", -1)
+              h.page === t.value ? j((B(), D("span", Mt, [...i[1] || (i[1] = [
+                H("현재페이지", -1)
               ])])), [
-                [p]
+                [b]
               ]) : J("", !0),
-              R(" " + N(f.page), 1)
-            ], 10, It)) : f.type === "ellipsis" ? (w(), B("span", {
+              H(" " + L(h.page), 1)
+            ], 10, zt)) : h.type === "ellipsis" ? (B(), D("span", {
               key: 1,
               class: "page-link link-dot",
-              "aria-label": f.ariaLabel
-            }, null, 8, zt)) : J("", !0)
+              "aria-label": h.ariaLabel
+            }, null, 8, $t)) : J("", !0)
           ], 64))), 128))
         ]),
-        (w(), W(le(u.value ? "span" : "a"), {
-          href: u.value ? void 0 : S.value,
-          class: L(["page-navi", "next", { disabled: u.value }]),
+        (B(), W(se(u.value ? "span" : "a"), {
+          href: u.value ? void 0 : p.value,
+          class: P(["page-navi", "next", { disabled: u.value }]),
           onClick: $
         }, {
-          default: U(() => [...l[2] || (l[2] = [
-            R(" 다음 ", -1)
+          default: U(() => [...i[2] || (i[2] = [
+            H(" 다음 ", -1)
           ])]),
           _: 1
         }, 8, ["href", "class"]))
-      ], 8, Kt);
+      ], 8, Vt);
     };
   }
-}), ne = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+}), ie = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
-  KrdsBadge: dt,
-  KrdsBreadcrumb: Bt,
-  KrdsButton: oe,
-  KrdsButtonGroup: Ie,
+  KrdsBadge: ct,
+  KrdsBreadcrumb: Kt,
+  KrdsButton: de,
+  KrdsButtonGroup: Ve,
   KrdsCheckArea: yt,
   KrdsCheckbox: pt,
   KrdsDateInput: rt,
-  KrdsFileUpload: ut,
-  KrdsFormGroup: Le,
-  KrdsFormHint: Pe,
+  KrdsFileUpload: dt,
+  KrdsFormGroup: Pe,
+  KrdsFormHint: Ne,
   KrdsFormLabel: $e,
-  KrdsIcon: Ve,
-  KrdsInPageNavigation: Dt,
+  KrdsIcon: Ie,
+  KrdsInPageNavigation: xt,
   KrdsInput: Me,
   KrdsLink: ze,
-  KrdsMasthead: vt,
-  KrdsPagination: Mt,
-  KrdsSkipLink: kt,
-  KrdsSpinner: ue,
-  KrdsStep: bt,
-  KrdsStepIndicator: mt,
-  KrdsTag: ct,
-  KrdsTagGroup: ft,
+  KrdsMasthead: ht,
+  KrdsPagination: Nt,
+  KrdsRadio: bt,
+  KrdsSelect: ut,
+  KrdsSkipLink: Ct,
+  KrdsSpinner: ce,
+  KrdsStep: St,
+  KrdsStepIndicator: kt,
+  KrdsTag: ft,
+  KrdsTagGroup: vt,
   KrdsTextarea: ot,
-  KrdsToggleSwitch: gt
-}, Symbol.toStringTag, { value: "Module" })), Q = {
-  mounted(e, i) {
-    i.value !== !1 && e.classList.add("sr-only");
+  KrdsToggleSwitch: mt
+}, Symbol.toStringTag, { value: "Module" })), Z = {
+  mounted(e, s) {
+    s.value !== !1 && e.classList.add("sr-only");
   },
-  updated(e, i) {
-    i.value === !1 ? e.classList.remove("sr-only") : e.classList.add("sr-only");
+  updated(e, s) {
+    s.value === !1 ? e.classList.remove("sr-only") : e.classList.add("sr-only");
   },
   unmounted(e) {
     e.classList.remove("sr-only");
   }
-}, se = {
-  "sr-only": Q
+}, re = {
+  "sr-only": Z
 }, fe = (e) => {
-  e.directive("sr-only", Q);
-}, ie = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  e.directive("sr-only", Z);
+}, oe = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
-  default: se,
-  directives: se,
+  default: re,
+  directives: re,
   installDirectives: fe,
-  vSrOnly: Q
-}, Symbol.toStringTag, { value: "Module" })), Pt = {
-  install(e, i = {}) {
-    e.provide("krds:config", i);
-    const s = i.components || Object.keys(ne);
-    s.forEach((n) => {
-      const o = ne[n];
-      o && e.component(n, o);
-    }), typeof ie == "object" && ie !== null && fe(e), e.config.globalProperties.$krds = {
+  vSrOnly: Z
+}, Symbol.toStringTag, { value: "Module" })), Tt = {
+  install(e, s = {}) {
+    e.provide("krds:config", s);
+    const n = s.components || Object.keys(ie);
+    n.forEach((l) => {
+      const o = ie[l];
+      o && e.component(l, o);
+    }), typeof oe == "object" && oe !== null && fe(e), e.config.globalProperties.$krds = {
       version: "__VERSION__"
-    }, process.env.NODE_ENV !== "production" && console.log(`[KRDS Vue] v__VERSION__ 설치 완료 - 컴포넌트: ${s.length}개`);
+    }, process.env.NODE_ENV !== "production" && console.log(`[KRDS Vue] v__VERSION__ 설치 완료 - 컴포넌트: ${n.length}개`);
   }
-}, Lt = "__VERSION__";
+}, Et = "__VERSION__";
 export {
-  dt as KrdsBadge,
-  Bt as KrdsBreadcrumb,
-  oe as KrdsButton,
-  Ie as KrdsButtonGroup,
+  ct as KrdsBadge,
+  Kt as KrdsBreadcrumb,
+  de as KrdsButton,
+  Ve as KrdsButtonGroup,
   yt as KrdsCheckArea,
   pt as KrdsCheckbox,
   rt as KrdsDateInput,
-  ut as KrdsFileUpload,
-  Le as KrdsFormGroup,
-  Pe as KrdsFormHint,
+  dt as KrdsFileUpload,
+  Pe as KrdsFormGroup,
+  Ne as KrdsFormHint,
   $e as KrdsFormLabel,
-  Ve as KrdsIcon,
-  Dt as KrdsInPageNavigation,
+  Ie as KrdsIcon,
+  xt as KrdsInPageNavigation,
   Me as KrdsInput,
   ze as KrdsLink,
-  vt as KrdsMasthead,
-  Mt as KrdsPagination,
-  kt as KrdsSkipLink,
-  ue as KrdsSpinner,
-  bt as KrdsStep,
-  mt as KrdsStepIndicator,
-  ct as KrdsTag,
-  ft as KrdsTagGroup,
+  ht as KrdsMasthead,
+  Nt as KrdsPagination,
+  bt as KrdsRadio,
+  ut as KrdsSelect,
+  Ct as KrdsSkipLink,
+  ce as KrdsSpinner,
+  St as KrdsStep,
+  kt as KrdsStepIndicator,
+  ft as KrdsTag,
+  vt as KrdsTagGroup,
   ot as KrdsTextarea,
-  gt as KrdsToggleSwitch,
-  ce as classNames,
-  Pt as default,
-  de as generateId,
-  Lt as version
+  mt as KrdsToggleSwitch,
+  X as classNames,
+  Tt as default,
+  Q as generateId,
+  Lt as generateUid,
+  Et as version
 };
 //# sourceMappingURL=krds-vue.es.js.map