@sakura-ui/sakura-ui 0.1.0 → 0.1.2

package/packages/forms/dist/index.es.js

@@ -1,10 +1,10 @@
 import x from "react";
-var s = {}, cr = {
+var i = {}, cr = {
   get exports() {
-    return s;
+    return i;
   },
-  set exports(l) {
-    s = l;
+  set exports(o) {
+    i = o;
   }
 }, W = {};
 /**
@@ -17,22 +17,22 @@ var s = {}, cr = {
  * LICENSE file in the root directory of this source tree.
  */
 var we;
-function fr() {
+function dr() {
   if (we)
     return W;
   we = 1;
-  var l = x, p = Symbol.for("react.element"), m = Symbol.for("react.fragment"), d = Object.prototype.hasOwnProperty, i = l.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, n = { key: !0, ref: !0, __self: !0, __source: !0 };
-  function h(f, u, j) {
-    var g, y = {}, C = null, w = null;
+  var o = x, m = Symbol.for("react.element"), p = Symbol.for("react.fragment"), f = Object.prototype.hasOwnProperty, s = o.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, n = { key: !0, ref: !0, __self: !0, __source: !0 };
+  function h(d, u, j) {
+    var g, R = {}, C = null, w = null;
     j !== void 0 && (C = "" + j), u.key !== void 0 && (C = "" + u.key), u.ref !== void 0 && (w = u.ref);
     for (g in u)
-      d.call(u, g) && !n.hasOwnProperty(g) && (y[g] = u[g]);
-    if (f && f.defaultProps)
-      for (g in u = f.defaultProps, u)
-        y[g] === void 0 && (y[g] = u[g]);
-    return { $$typeof: p, type: f, key: C, ref: w, props: y, _owner: i.current };
+      f.call(u, g) && !n.hasOwnProperty(g) && (R[g] = u[g]);
+    if (d && d.defaultProps)
+      for (g in u = d.defaultProps, u)
+        R[g] === void 0 && (R[g] = u[g]);
+    return { $$typeof: m, type: d, key: C, ref: w, props: R, _owner: s.current };
   }
-  return W.Fragment = m, W.jsx = h, W.jsxs = h, W;
+  return W.Fragment = p, W.jsx = h, W.jsxs = h, W;
 }
 var Y = {};
 /**
@@ -45,16 +45,16 @@ var Y = {};
  * LICENSE file in the root directory of this source tree.
  */
 var Ce;
-function dr() {
+function fr() {
   return Ce || (Ce = 1, process.env.NODE_ENV !== "production" && function() {
-    var l = x, p = Symbol.for("react.element"), m = Symbol.for("react.portal"), d = Symbol.for("react.fragment"), i = Symbol.for("react.strict_mode"), n = Symbol.for("react.profiler"), h = Symbol.for("react.provider"), f = Symbol.for("react.context"), u = Symbol.for("react.forward_ref"), j = Symbol.for("react.suspense"), g = Symbol.for("react.suspense_list"), y = Symbol.for("react.memo"), C = Symbol.for("react.lazy"), w = Symbol.for("react.offscreen"), F = Symbol.iterator, Ie = "@@iterator";
+    var o = x, m = Symbol.for("react.element"), p = Symbol.for("react.portal"), f = Symbol.for("react.fragment"), s = Symbol.for("react.strict_mode"), n = Symbol.for("react.profiler"), h = Symbol.for("react.provider"), d = Symbol.for("react.context"), u = Symbol.for("react.forward_ref"), j = Symbol.for("react.suspense"), g = Symbol.for("react.suspense_list"), R = Symbol.for("react.memo"), C = Symbol.for("react.lazy"), w = Symbol.for("react.offscreen"), F = Symbol.iterator, Ie = "@@iterator";
     function Se(e) {
       if (e === null || typeof e != "object")
         return null;
       var r = F && e[F] || e[Ie];
       return typeof r == "function" ? r : null;
     }
-    var D = l.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
+    var D = o.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
     function _(e) {
       {
         for (var r = arguments.length, t = new Array(r > 1 ? r - 1 : 0), a = 1; a < r; a++)
@@ -75,7 +75,7 @@ function dr() {
     var Ne = !1, ke = !1, Fe = !1, De = !1, Me = !1, te;
     te = Symbol.for("react.module.reference");
     function Ae(e) {
-      return !!(typeof e == "string" || typeof e == "function" || e === d || e === n || Me || e === i || e === j || e === g || De || e === w || Ne || ke || Fe || typeof e == "object" && e !== null && (e.$$typeof === C || e.$$typeof === y || e.$$typeof === h || e.$$typeof === f || e.$$typeof === u || // This needs to include all possible module reference object
+      return !!(typeof e == "string" || typeof e == "function" || e === f || e === n || Me || e === s || e === j || e === g || De || e === w || Ne || ke || Fe || typeof e == "object" && e !== null && (e.$$typeof === C || e.$$typeof === R || e.$$typeof === h || e.$$typeof === d || e.$$typeof === u || // This needs to include all possible module reference object
       // types supported by any Flight configuration anywhere since
       // we don't know which Flight build this will end up being used
       // with.
@@ -99,13 +99,13 @@ function dr() {
       if (typeof e == "string")
         return e;
       switch (e) {
-        case d:
+        case f:
           return "Fragment";
-        case m:
+        case p:
           return "Portal";
         case n:
           return "Profiler";
-        case i:
+        case s:
           return "StrictMode";
         case j:
           return "Suspense";
@@ -114,7 +114,7 @@ function dr() {
       }
       if (typeof e == "object")
         switch (e.$$typeof) {
-          case f:
+          case d:
             var r = e;
             return ne(r) + ".Consumer";
           case h:
@@ -122,7 +122,7 @@ function dr() {
             return ne(t._context) + ".Provider";
           case u:
             return $e(e, e.render, "ForwardRef");
-          case y:
+          case R:
             var a = e.displayName || null;
             return a !== null ? a : S(e.type) || "Memo";
           case C: {
@@ -137,9 +137,9 @@ function dr() {
       return null;
     }
     var N = Object.assign, $ = 0, ae, se, ie, oe, le, ue, ce;
-    function fe() {
+    function de() {
     }
-    fe.__reactDisabledLog = !0;
+    de.__reactDisabledLog = !0;
     function qe() {
       {
         if ($ === 0) {
@@ -147,7 +147,7 @@ function dr() {
           var e = {
             configurable: !0,
             enumerable: !0,
-            value: fe,
+            value: de,
             writable: !0
           };
           Object.defineProperties(console, {
@@ -217,7 +217,7 @@ function dr() {
       var Ye = typeof WeakMap == "function" ? WeakMap : Map;
       V = new Ye();
     }
-    function de(e, r) {
+    function fe(e, r) {
       if (!e || K)
         return "";
       {
@@ -265,20 +265,20 @@ function dr() {
         }
       } catch (O) {
         if (O && a && typeof O.stack == "string") {
-          for (var o = O.stack.split(`
+          for (var l = O.stack.split(`
 `), T = a.stack.split(`
-`), R = o.length - 1, E = T.length - 1; R >= 1 && E >= 0 && o[R] !== T[E]; )
+`), y = l.length - 1, E = T.length - 1; y >= 1 && E >= 0 && l[y] !== T[E]; )
             E--;
-          for (; R >= 1 && E >= 0; R--, E--)
-            if (o[R] !== T[E]) {
-              if (R !== 1 || E !== 1)
+          for (; y >= 1 && E >= 0; y--, E--)
+            if (l[y] !== T[E]) {
+              if (y !== 1 || E !== 1)
                 do
-                  if (R--, E--, E < 0 || o[R] !== T[E]) {
+                  if (y--, E--, E < 0 || l[y] !== T[E]) {
                     var P = `
-` + o[R].replace(" at new ", " at ");
+` + l[y].replace(" at new ", " at ");
                     return e.displayName && P.includes("<anonymous>") && (P = P.replace("<anonymous>", e.displayName)), typeof e == "function" && V.set(e, P), P;
                   }
-                while (R >= 1 && E >= 0);
+                while (y >= 1 && E >= 0);
               break;
             }
         }
@@ -289,7 +289,7 @@ function dr() {
       return typeof e == "function" && V.set(e, je), je;
     }
     function Le(e, r, t) {
-      return de(e, !1);
+      return fe(e, !1);
     }
     function Ve(e) {
       var r = e.prototype;
@@ -299,7 +299,7 @@ function dr() {
       if (e == null)
         return "";
       if (typeof e == "function")
-        return de(e, Ve(e));
+        return fe(e, Ve(e));
       if (typeof e == "string")
         return L(e);
       switch (e) {
@@ -312,7 +312,7 @@ function dr() {
         switch (e.$$typeof) {
           case u:
             return Le(e.render);
-          case y:
+          case R:
             return U(e.type, r, t);
           case C: {
             var a = e, v = a._payload, b = a._init;
@@ -337,17 +337,17 @@ function dr() {
         var b = Function.call.bind(B);
         for (var c in e)
           if (b(e, c)) {
-            var o = void 0;
+            var l = void 0;
             try {
               if (typeof e[c] != "function") {
                 var T = Error((a || "React class") + ": " + t + " type `" + c + "` is invalid; it must be a function, usually from the `prop-types` package, but received `" + typeof e[c] + "`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.");
                 throw T.name = "Invariant Violation", T;
               }
-              o = e[c](r, c, a, t, null, "SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED");
-            } catch (R) {
-              o = R;
+              l = e[c](r, c, a, t, null, "SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED");
+            } catch (y) {
+              l = y;
             }
-            o && !(o instanceof Error) && (G(v), _("%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).", a || "React class", t, c, typeof o), G(null)), o instanceof Error && !(o.message in ve) && (ve[o.message] = !0, G(v), _("Failed %s type: %s", t, o.message), G(null));
+            l && !(l instanceof Error) && (G(v), _("%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).", a || "React class", t, c, typeof l), G(null)), l instanceof Error && !(l.message in ve) && (ve[l.message] = !0, G(v), _("Failed %s type: %s", t, l.message), G(null));
           }
       }
     }
@@ -427,9 +427,9 @@ function dr() {
       }
     }
     var er = function(e, r, t, a, v, b, c) {
-      var o = {
+      var l = {
         // This tag allows us to uniquely identify this as a React Element
-        $$typeof: p,
+        $$typeof: m,
         // Built-in properties that belong on the element
         type: e,
         key: r,
@@ -438,39 +438,39 @@ function dr() {
         // Record the component responsible for creating this element.
         _owner: b
       };
-      return o._store = {}, Object.defineProperty(o._store, "validated", {
+      return l._store = {}, Object.defineProperty(l._store, "validated", {
         configurable: !1,
         enumerable: !1,
         writable: !0,
         value: !1
-      }), Object.defineProperty(o, "_self", {
+      }), Object.defineProperty(l, "_self", {
         configurable: !1,
         enumerable: !1,
         writable: !1,
         value: a
-      }), Object.defineProperty(o, "_source", {
+      }), Object.defineProperty(l, "_source", {
         configurable: !1,
         enumerable: !1,
         writable: !1,
         value: v
-      }), Object.freeze && (Object.freeze(o.props), Object.freeze(o)), o;
+      }), Object.freeze && (Object.freeze(l.props), Object.freeze(l)), l;
     };
     function rr(e, r, t, a, v) {
       {
-        var b, c = {}, o = null, T = null;
-        t !== void 0 && (he(t), o = "" + t), He(r) && (he(r.key), o = "" + r.key), Ke(r) && (T = r.ref, Xe(r, v));
+        var b, c = {}, l = null, T = null;
+        t !== void 0 && (he(t), l = "" + t), He(r) && (he(r.key), l = "" + r.key), Ke(r) && (T = r.ref, Xe(r, v));
         for (b in r)
           B.call(r, b) && !ze.hasOwnProperty(b) && (c[b] = r[b]);
         if (e && e.defaultProps) {
-          var R = e.defaultProps;
-          for (b in R)
-            c[b] === void 0 && (c[b] = R[b]);
+          var y = e.defaultProps;
+          for (b in y)
+            c[b] === void 0 && (c[b] = y[b]);
         }
-        if (o || T) {
+        if (l || T) {
           var E = typeof e == "function" ? e.displayName || e.name || "Unknown" : e;
-          o && Ze(c, E), T && Qe(c, E);
+          l && Ze(c, E), T && Qe(c, E);
         }
-        return er(e, o, T, v, a, q.current, c);
+        return er(e, l, T, v, a, q.current, c);
       }
     }
     var Z = D.ReactCurrentOwner, ge = D.ReactDebugCurrentFrame;
@@ -484,7 +484,7 @@ function dr() {
     var Q;
     Q = !1;
     function ee(e) {
-      return typeof e == "object" && e !== null && e.$$typeof === p;
+      return typeof e == "object" && e !== null && e.$$typeof === m;
     }
     function Re() {
       {
@@ -564,7 +564,7 @@ Check the top-level render call using <` + t + ">.");
           t = r.propTypes;
         else if (typeof r == "object" && (r.$$typeof === u || // Note: Memo only checks outer props here.
         // Inner props are checked in the reconciler.
-        r.$$typeof === y))
+        r.$$typeof === R))
           t = r.propTypes;
         else
           return;
@@ -595,12 +595,12 @@ Check the top-level render call using <` + t + ">.");
       {
         var c = Ae(e);
         if (!c) {
-          var o = "";
-          (e === void 0 || typeof e == "object" && e !== null && Object.keys(e).length === 0) && (o += " You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.");
+          var l = "";
+          (e === void 0 || typeof e == "object" && e !== null && Object.keys(e).length === 0) && (l += " You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.");
           var T = tr(v);
-          T ? o += T : o += Re();
-          var R;
-          e === null ? R = "null" : H(e) ? R = "array" : e !== void 0 && e.$$typeof === p ? (R = "<" + (S(e.type) || "Unknown") + " />", o = " Did you accidentally export a JSX literal instead of a component?") : R = typeof e, _("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s", R, o);
+          T ? l += T : l += Re();
+          var y;
+          e === null ? y = "null" : H(e) ? y = "array" : e !== void 0 && e.$$typeof === m ? (y = "<" + (S(e.type) || "Unknown") + " />", l = " Did you accidentally export a JSX literal instead of a component?") : y = typeof e, _("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s", y, l);
         }
         var E = rr(e, r, t, v, b);
         if (E == null)
@@ -618,7 +618,7 @@ Check the top-level render call using <` + t + ">.");
             else
               _e(P, e);
         }
-        return e === d ? sr(E) : ar(E), E;
+        return e === f ? sr(E) : ar(E), E;
       }
     }
     function ir(e, r, t) {
@@ -628,28 +628,28 @@ Check the top-level render call using <` + t + ">.");
       return Te(e, r, t, !1);
     }
     var lr = or, ur = ir;
-    Y.Fragment = d, Y.jsx = lr, Y.jsxs = ur;
+    Y.Fragment = f, Y.jsx = lr, Y.jsxs = ur;
   }()), Y;
 }
-(function(l) {
-  process.env.NODE_ENV === "production" ? l.exports = fr() : l.exports = dr();
+(function(o) {
+  process.env.NODE_ENV === "production" ? o.exports = dr() : o.exports = fr();
 })(cr);
-const I = (...l) => l.filter(Boolean).join(" "), k = x.createContext({
+const I = (...o) => o.filter(Boolean).join(" "), k = x.createContext({
   helperTextId: "",
   errorMessageId: "",
   isInvalid: !1,
   isRequired: !1
 }), vr = x.forwardRef(
-  (l, p) => {
-    const { className: m, children: d, ...i } = l, n = x.useContext(k);
-    n.isRequired && (i.required = !0), n.groupName && (i.name = n.groupName);
+  (o, m) => {
+    const { className: p, children: f, ...s } = o, n = x.useContext(k);
+    n.isRequired && (s.required = !0), n.groupName && (s.name = n.groupName);
     const h = `
       inline-block
       text-sm
       cursor-pointer
       py-2
       mr-4
-    `, f = `
+    `, d = `
       hidden
       peer
     `, u = `
@@ -665,39 +665,39 @@ const I = (...l) => l.filter(Boolean).join(" "), k = x.createContext({
       peer-checked:bg-sea-600
       peer-checked:border-none
     `;
-    return /* @__PURE__ */ s.jsx("label", { htmlFor: i.id, className: I(h, m), children: /* @__PURE__ */ s.jsxs("span", { className: "flex items-center", children: [
-      /* @__PURE__ */ s.jsx(
+    return /* @__PURE__ */ i.jsx("label", { htmlFor: s.id, className: I(h, p), children: /* @__PURE__ */ i.jsxs("span", { className: "flex items-center", children: [
+      /* @__PURE__ */ i.jsx(
         "input",
         {
-          className: f,
+          className: d,
           type: "checkbox",
           "aria-describedby": n.helperTextId,
           "aria-errormessage": n.errorMessageId,
           "aria-invalid": n.isInvalid ?? !1,
-          ...i,
-          ref: p
+          ...s,
+          ref: m
         }
       ),
-      /* @__PURE__ */ s.jsx("span", { className: u, children: /* @__PURE__ */ s.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", children: /* @__PURE__ */ s.jsx(
+      /* @__PURE__ */ i.jsx("span", { className: u, children: /* @__PURE__ */ i.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", children: /* @__PURE__ */ i.jsx(
         "path",
         {
           fill: "#fff",
           d: "m9.55 17.65-5.325-5.325 1.05-1.075 4.275 4.275 9.175-9.175 1.05 1.075Z"
         }
       ) }) }),
-      d
+      f
     ] }) });
   }
-), pr = x.forwardRef((l, p) => {
-  const { className: m, children: d, ...i } = l, n = x.useContext(k);
-  n.isRequired && (i.required = !0), n.groupName && (i.name = n.groupName);
+), pr = x.forwardRef((o, m) => {
+  const { className: p, children: f, ...s } = o, n = x.useContext(k);
+  n.isRequired && (s.required = !0), n.groupName && (s.name = n.groupName);
   const h = `
     inline-block
     text-sm
     cursor-pointer
     py-2
     mr-4
-  `, f = `
+  `, d = `
     hidden
     peer
   `, u = `
@@ -713,27 +713,27 @@ const I = (...l) => l.filter(Boolean).join(" "), k = x.createContext({
     peer-checked:bg-sea-600
     peer-checked:border-sea-600
   `;
-  return /* @__PURE__ */ s.jsx("label", { htmlFor: i.id, className: I(h, m), children: /* @__PURE__ */ s.jsxs("span", { className: "flex items-center", children: [
-    /* @__PURE__ */ s.jsx(
+  return /* @__PURE__ */ i.jsx("label", { htmlFor: s.id, className: I(h, p), children: /* @__PURE__ */ i.jsxs("span", { className: "flex items-center", children: [
+    /* @__PURE__ */ i.jsx(
       "input",
       {
-        className: f,
+        className: d,
         type: "radio",
         "aria-describedby": n.helperTextId,
         "aria-errormessage": n.errorMessageId,
         "aria-invalid": n.isInvalid ?? !1,
-        ...i,
-        ref: p
+        ...s,
+        ref: m
       }
     ),
-    /* @__PURE__ */ s.jsx("span", { className: u }),
-    d
+    /* @__PURE__ */ i.jsx("span", { className: u }),
+    f
   ] }) });
 }), mr = x.forwardRef(
-  (l, p) => {
-    const { className: m, children: d, ...i } = l, n = x.useContext(k);
-    n.isRequired && (i.required = !0);
-    const h = n.isInvalid ? "border-sun-800" : "border-sumi-900", f = `
+  (o, m) => {
+    const { className: p, children: f, ...s } = o, n = x.useContext(k);
+    n.isRequired && (s.required = !0);
+    const h = n.isInvalid ? "border-sun-800" : "border-sumi-900", d = `
       cursor-pointer
       appearance-none
       text-base
@@ -747,36 +747,37 @@ const I = (...l) => l.filter(Boolean).join(" "), k = x.createContext({
       focus:outline-2
       focus:outline-wood-500
     `;
-    return /* @__PURE__ */ s.jsxs("span", { className: "inline-block relative", children: [
-      /* @__PURE__ */ s.jsx(
+    return /* @__PURE__ */ i.jsxs("span", { className: "inline-block relative", children: [
+      /* @__PURE__ */ i.jsx(
         "select",
         {
-          className: I(f, h, l.className),
+          id: s.id ?? n.id,
+          className: I(d, h, o.className),
           "aria-describedby": n.helperTextId,
           "aria-errormessage": n.errorMessageId,
           "aria-invalid": n.isInvalid ?? !1,
-          ...i,
-          ref: p,
-          children: d
+          ...s,
+          ref: m,
+          children: f
         }
       ),
-      /* @__PURE__ */ s.jsx("span", { className: "flex items-center absolute inset-y-0 right-0 px-2 pointer-events-none", children: /* @__PURE__ */ s.jsx(
+      /* @__PURE__ */ i.jsx("span", { className: "flex items-center absolute inset-y-0 right-0 px-2 pointer-events-none", children: /* @__PURE__ */ i.jsx(
         "svg",
         {
           xmlns: "http://www.w3.org/2000/svg",
           className: "fill-sumi-900",
           height: "24",
           width: "24",
-          children: /* @__PURE__ */ s.jsx("path", { d: "M12 15.05 6.35 9.4 7.4 8.35l4.6 4.6 4.6-4.6 1.05 1.05Z" })
+          children: /* @__PURE__ */ i.jsx("path", { d: "M12 15.05 6.35 9.4 7.4 8.35l4.6 4.6 4.6-4.6 1.05 1.05Z" })
         }
       ) })
     ] });
   }
 ), hr = x.forwardRef(
-  (l, p) => {
-    const { className: m, ...d } = l, i = x.useContext(k);
-    i.isRequired && (d.required = !0);
-    const n = i.isInvalid ? "border-sun-800" : "border-sumi-900", h = `
+  (o, m) => {
+    const { className: p, ...f } = o, s = x.useContext(k);
+    s.isRequired && (f.required = !0);
+    const n = s.isInvalid ? "border-sun-800" : "border-sumi-900", h = `
       p-4
       rounded-lg
       border
@@ -790,24 +791,25 @@ const I = (...l) => l.filter(Boolean).join(" "), k = x.createContext({
       disabled:border-solid
       disabled:border-sumi-500
     `;
-    return /* @__PURE__ */ s.jsx(
+    return /* @__PURE__ */ i.jsx(
       "input",
       {
         type: "text",
-        className: I(h, n, m),
-        "aria-describedby": i.helperTextId,
-        "aria-errormessage": i.errorMessageId,
-        "aria-invalid": i.isInvalid ?? !1,
-        ...d,
-        ref: p
+        id: f.id ?? s.id,
+        className: I(h, n, p),
+        "aria-describedby": s.helperTextId,
+        "aria-errormessage": s.errorMessageId,
+        "aria-invalid": s.isInvalid ?? !1,
+        ...f,
+        ref: m
       }
     );
   }
 ), br = x.forwardRef(
-  (l, p) => {
-    const { className: m, children: d, ...i } = l, n = x.useContext(k);
-    n.isRequired && (i.required = !0);
-    const h = n.isInvalid ? "border-sun-800" : "border-sumi-900", f = `
+  (o, m) => {
+    const { className: p, children: f, ...s } = o, n = x.useContext(k);
+    n.isRequired && (s.required = !0);
+    const h = n.isInvalid ? "border-sun-800" : "border-sumi-900", d = `
       p-4
       rounded-lg
       border
@@ -821,84 +823,88 @@ const I = (...l) => l.filter(Boolean).join(" "), k = x.createContext({
       disabled:border-solid
       disabled:border-sumi-500
     `;
-    return /* @__PURE__ */ s.jsx(
+    return /* @__PURE__ */ i.jsx(
       "textarea",
       {
-        className: I(f, h, m),
+        id: s.id ?? n.id,
+        className: I(d, h, p),
         "aria-describedby": n.helperTextId,
         "aria-errormessage": n.errorMessageId,
         "aria-invalid": n.isInvalid ?? !1,
-        ...i,
-        ref: p,
-        children: d
+        ...s,
+        ref: m,
+        children: f
       }
     );
   }
-), re = x.forwardRef(
-  (l, p) => {
-    const m = x.useId(), {
-      labelText: d,
-      className: i,
-      helperText: n,
-      errorMessage: h,
-      isInvalid: f,
-      isRequired: u,
-      children: j,
-      ...g
-    } = l, y = {
-      helperTextId: `helper-text-${m}`,
-      errorMessageId: `error-message-${m}`,
-      isInvalid: f ?? !1,
-      isRequired: u ?? !1
-    };
-    return /* @__PURE__ */ s.jsx(k.Provider, { value: y, children: /* @__PURE__ */ s.jsxs("div", { className: I("mb-4", i), ref: p, ...g, children: [
-      /* @__PURE__ */ s.jsxs("label", { children: [
-        /* @__PURE__ */ s.jsxs("span", { className: I("block mb-2", f && "text-sun-800"), children: [
-          d,
-          u && /* @__PURE__ */ s.jsx("span", { className: "text-sun-800", children: " *" })
-        ] }),
-        j
-      ] }),
-      n && /* @__PURE__ */ s.jsx("p", { id: y.helperTextId, className: "text-sm text-sumi-700 mt-2", children: n }),
-      f && /* @__PURE__ */ s.jsx(
-        "p",
-        {
-          id: y.errorMessageId,
-          className: I(
-            "text-sm text-sun-800",
-            n ? "mt-1" : "mt-2"
-          ),
-          children: h
-        }
-      )
-    ] }) });
-  }
-), Pe = x.forwardRef((l, p) => {
-  const m = x.useId(), {
-    labelText: d,
-    className: i,
+), re = x.forwardRef((o, m) => {
+  const p = x.useId(), {
+    labelText: f,
+    className: s,
+    helperText: n,
+    errorMessage: h,
+    isInvalid: d,
+    isRequired: u,
+    children: j,
+    ...g
+  } = o, R = {
+    id: o.htmlFor ?? `input-${p}`,
+    helperTextId: `helper-text-${p}`,
+    errorMessageId: `error-message-${p}`,
+    isInvalid: d ?? !1,
+    isRequired: u ?? !1
+  };
+  return /* @__PURE__ */ i.jsx(k.Provider, { value: R, children: /* @__PURE__ */ i.jsxs("div", { className: I("mb-4", s), children: [
+    /* @__PURE__ */ i.jsxs(
+      "label",
+      {
+        className: I("block mb-2", d && "text-sun-800"),
+        htmlFor: R.id,
+        ref: m,
+        ...g,
+        children: [
+          f,
+          u && /* @__PURE__ */ i.jsx("span", { className: "text-sun-800", children: " *" })
+        ]
+      }
+    ),
+    j,
+    n && /* @__PURE__ */ i.jsx("p", { id: R.helperTextId, className: "text-sm text-sumi-700 mt-2", children: n }),
+    d && /* @__PURE__ */ i.jsx(
+      "p",
+      {
+        id: R.errorMessageId,
+        className: I("text-sm text-sun-800", n ? "mt-1" : "mt-2"),
+        children: h
+      }
+    )
+  ] }) });
+}), Pe = x.forwardRef((o, m) => {
+  const p = x.useId(), {
+    labelText: f,
+    className: s,
     helperText: n,
     errorMessage: h,
-    isInvalid: f,
+    isInvalid: d,
     isRequired: u,
     direction: j,
     children: g,
-    ...y
-  } = l, w = {
-    groupName: y.name ?? `group-${m}`,
-    helperTextId: `helper-text-${m}`,
-    errorMessageId: `error-message-${m}`,
-    isInvalid: f ?? !1,
+    ...R
+  } = o, w = {
+    groupName: R.name ?? `group-${p}`,
+    helperTextId: `helper-text-${p}`,
+    errorMessageId: `error-message-${p}`,
+    isInvalid: d ?? !1,
     isRequired: u ?? !1
   }, F = j ?? "flex-col";
-  return /* @__PURE__ */ s.jsx(k.Provider, { value: w, children: /* @__PURE__ */ s.jsxs("fieldset", { className: I("mb-4", i), ref: p, ...y, children: [
-    /* @__PURE__ */ s.jsx("legend", { children: /* @__PURE__ */ s.jsxs("p", { className: I("block mb-2", f && "text-sun-800"), children: [
-      d,
-      u && /* @__PURE__ */ s.jsx("span", { className: "text-sun-800", children: " *" })
+  return /* @__PURE__ */ i.jsx(k.Provider, { value: w, children: /* @__PURE__ */ i.jsxs("fieldset", { className: I("mb-4", s), ref: m, ...R, children: [
+    /* @__PURE__ */ i.jsx("legend", { children: /* @__PURE__ */ i.jsxs("p", { className: I("block mb-2", d && "text-sun-800"), children: [
+      f,
+      u && /* @__PURE__ */ i.jsx("span", { className: "text-sun-800", children: " *" })
     ] }) }),
-    /* @__PURE__ */ s.jsx("div", { className: I("inline-flex", F), children: g }),
-    n && /* @__PURE__ */ s.jsx("p", { id: w.helperTextId, className: "text-sm text-sumi-700 mt-2", children: n }),
-    f && /* @__PURE__ */ s.jsx(
+    /* @__PURE__ */ i.jsx("div", { className: I("inline-flex", F), children: g }),
+    n && /* @__PURE__ */ i.jsx("p", { id: w.helperTextId, className: "text-sm text-sumi-700 mt-2", children: n }),
+    d && /* @__PURE__ */ i.jsx(
       "p",
       {
         id: w.errorMessageId,
@@ -907,61 +913,61 @@ const I = (...l) => l.filter(Boolean).join(" "), k = x.createContext({
       }
     )
   ] }) });
-}), gr = x.forwardRef((l, p) => {
+}), gr = x.forwardRef((o, m) => {
   const {
-    items: m,
-    onChange: d,
-    className: i,
+    items: p,
+    onChange: f,
+    className: s,
     labelText: n,
     helperText: h,
-    errorMessage: f,
+    errorMessage: d,
     isInvalid: u,
     isRequired: j,
     ...g
-  } = l;
-  return /* @__PURE__ */ s.jsx(
+  } = o;
+  return /* @__PURE__ */ i.jsx(
     Pe,
     {
-      className: i,
+      className: s,
       labelText: n,
       helperText: h,
-      errorMessage: f,
+      errorMessage: d,
       isInvalid: u,
       isRequired: j,
-      ref: p,
+      ref: m,
       ...g,
-      children: m.map(({ label: y, value: C }, w) => /* @__PURE__ */ s.jsx(vr, { value: C, onChange: d, children: y }, w))
+      children: p.map(({ label: R, value: C }, w) => /* @__PURE__ */ i.jsx(vr, { value: C, onChange: f, children: R }, w))
     }
   );
-}), Rr = x.forwardRef((l, p) => {
+}), Rr = x.forwardRef((o, m) => {
   const {
-    items: m,
-    onChange: d,
-    className: i,
+    items: p,
+    onChange: f,
+    className: s,
     labelText: n,
     helperText: h,
-    errorMessage: f,
+    errorMessage: d,
     isInvalid: u,
     isRequired: j,
     defaultValue: g,
-    ...y
-  } = l;
-  return /* @__PURE__ */ s.jsx(
+    ...R
+  } = o;
+  return /* @__PURE__ */ i.jsx(
     Pe,
     {
-      className: i,
+      className: s,
       labelText: n,
       helperText: h,
-      errorMessage: f,
+      errorMessage: d,
       isInvalid: u,
       isRequired: j,
-      ref: p,
-      ...y,
-      children: m.map(({ label: C, value: w }, F) => /* @__PURE__ */ s.jsx(
+      ref: m,
+      ...R,
+      children: p.map(({ label: C, value: w }, F) => /* @__PURE__ */ i.jsx(
         pr,
         {
           value: w,
-          onChange: d,
+          onChange: f,
           defaultChecked: g === w,
           children: C
         },
@@ -969,72 +975,72 @@ const I = (...l) => l.filter(Boolean).join(" "), k = x.createContext({
       ))
     }
   );
-}), yr = x.forwardRef((l, p) => {
+}), yr = x.forwardRef((o, m) => {
   const {
-    className: m,
-    labelText: d,
-    helperText: i,
+    className: p,
+    labelText: f,
+    helperText: s,
     errorMessage: n,
     isInvalid: h,
-    isRequired: f,
+    isRequired: d,
     ...u
-  } = l;
-  return /* @__PURE__ */ s.jsx(
+  } = o;
+  return /* @__PURE__ */ i.jsx(
     re,
     {
-      className: m,
-      labelText: d,
-      helperText: i,
+      className: p,
+      labelText: f,
+      helperText: s,
       errorMessage: n,
       isInvalid: h,
-      isRequired: f,
-      children: /* @__PURE__ */ s.jsx(mr, { ref: p, ...u })
+      isRequired: d,
+      children: /* @__PURE__ */ i.jsx(mr, { ref: m, ...u })
     }
   );
 }), Er = x.forwardRef(
-  (l, p) => {
+  (o, m) => {
     const {
-      className: m,
-      labelText: d,
-      helperText: i,
+      className: p,
+      labelText: f,
+      helperText: s,
       errorMessage: n,
       isInvalid: h,
-      isRequired: f,
+      isRequired: d,
       ...u
-    } = l;
-    return /* @__PURE__ */ s.jsx(
+    } = o;
+    return /* @__PURE__ */ i.jsx(
       re,
       {
-        className: m,
-        labelText: d,
-        helperText: i,
+        className: p,
+        labelText: f,
+        helperText: s,
         errorMessage: n,
         isInvalid: h,
-        isRequired: f,
-        children: /* @__PURE__ */ s.jsx(hr, { ref: p, ...u })
+        isRequired: d,
+        children: /* @__PURE__ */ i.jsx(hr, { ref: m, ...u })
       }
     );
   }
-), _r = x.forwardRef((l, p) => {
+), _r = x.forwardRef((o, m) => {
   const {
-    className: m,
-    labelText: d,
-    helperText: i,
+    className: p,
+    labelText: f,
+    helperText: s,
     errorMessage: n,
     isInvalid: h,
-    isRequired: f,
+    isRequired: d,
     ...u
-  } = l;
-  return /* @__PURE__ */ s.jsx(
+  } = o;
+  return /* @__PURE__ */ i.jsx(
     re,
     {
-      className: m,
-      labelText: d,
-      helperText: i,
+      className: p,
+      labelText: f,
+      helperText: s,
       errorMessage: n,
       isInvalid: h,
-      isRequired: f,
-      children: /* @__PURE__ */ s.jsx(br, { ref: p, ...u })
+      isRequired: d,
+      children: /* @__PURE__ */ i.jsx(br, { ref: m, ...u })
     }
   );
 });