@sakura-ui/sakura-ui 0.1.13 → 0.1.16

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

@@ -631,10 +631,11 @@ const P = (...p) => p.filter(Boolean).join(" "), F = y.createContext({
   errorMessageId: "",
   isInvalid: !1,
   isRequired: !1
-}), Ie = y.forwardRef((p, b) => {
-  const { className: m, children: f, ...i } = p, a = y.useContext(F);
-  a.isRequired && (i.required = !0), a.groupName && (i.name = a.groupName);
-  const v = `
+}), Ie = y.forwardRef(
+  (p, b) => {
+    const { className: m, children: f, ...i } = p, a = y.useContext(F);
+    a.isRequired && (i.required = !0), a.groupName && (i.name = a.groupName);
+    const v = `
     inline-block
     text-base
     cursor-pointer
@@ -658,28 +659,30 @@ const P = (...p) => p.filter(Boolean).join(" "), F = y.createContext({
     peer-checked:border-none
     peer-disabled:border-sumi-500
   `;
-  return /* @__PURE__ */ s.jsx("label", { htmlFor: i.id, className: P(v, m), children: /* @__PURE__ */ s.jsxs("span", { className: "flex items-center", children: [
-    /* @__PURE__ */ s.jsx(
-      "input",
-      {
-        className: c,
-        type: "checkbox",
-        "aria-describedby": a.helperTextId,
-        "aria-errormessage": a.errorMessageId,
-        "aria-invalid": a.isInvalid ?? !1,
-        ...i,
-        ref: b
-      }
-    ),
-    /* @__PURE__ */ s.jsx("span", { className: o, children: /* @__PURE__ */ s.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", children: /* @__PURE__ */ s.jsx("path", { 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" }) }) }),
-    /* @__PURE__ */ s.jsx("span", { className: "peer-disabled:text-sumi-500", children: f })
-  ] }) });
-});
+    return /* @__PURE__ */ s.jsx("label", { htmlFor: i.id, className: P(v, m), children: /* @__PURE__ */ s.jsxs("span", { className: "flex items-center", children: [
+      /* @__PURE__ */ s.jsx(
+        "input",
+        {
+          className: c,
+          type: "checkbox",
+          "aria-describedby": a.helperTextId,
+          "aria-errormessage": a.errorMessageId,
+          "aria-invalid": a.isInvalid ?? !1,
+          ...i,
+          ref: b
+        }
+      ),
+      /* @__PURE__ */ s.jsx("span", { className: o, children: /* @__PURE__ */ s.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", children: /* @__PURE__ */ s.jsx("path", { 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" }) }) }),
+      /* @__PURE__ */ s.jsx("span", { className: "peer-disabled:text-sumi-500", children: f })
+    ] }) });
+  }
+);
 Ie.displayName = "Checkbox";
-const Se = y.forwardRef((p, b) => {
-  const { className: m, children: f, ...i } = p, a = y.useContext(F);
-  a.isRequired && (i.required = !0), a.groupName && (i.name = a.groupName);
-  const v = `
+const Se = y.forwardRef(
+  (p, b) => {
+    const { className: m, children: f, ...i } = p, a = y.useContext(F);
+    a.isRequired && (i.required = !0), a.groupName && (i.name = a.groupName);
+    const v = `
     inline-block
     text-base
     cursor-pointer
@@ -703,28 +706,30 @@ const Se = y.forwardRef((p, b) => {
     peer-checked:border-sea-600
     peer-disabled:border-sumi-500
   `;
-  return /* @__PURE__ */ s.jsx("label", { htmlFor: i.id, className: P(v, m), children: /* @__PURE__ */ s.jsxs("span", { className: "flex items-center", children: [
-    /* @__PURE__ */ s.jsx(
-      "input",
-      {
-        className: c,
-        type: "radio",
-        "aria-describedby": a.helperTextId,
-        "aria-errormessage": a.errorMessageId,
-        "aria-invalid": a.isInvalid ?? !1,
-        ...i,
-        ref: b
-      }
-    ),
-    /* @__PURE__ */ s.jsx("span", { className: o }),
-    /* @__PURE__ */ s.jsx("span", { className: "peer-disabled:text-sumi-500", children: f })
-  ] }) });
-});
+    return /* @__PURE__ */ s.jsx("label", { htmlFor: i.id, className: P(v, m), children: /* @__PURE__ */ s.jsxs("span", { className: "flex items-center", children: [
+      /* @__PURE__ */ s.jsx(
+        "input",
+        {
+          className: c,
+          type: "radio",
+          "aria-describedby": a.helperTextId,
+          "aria-errormessage": a.errorMessageId,
+          "aria-invalid": a.isInvalid ?? !1,
+          ...i,
+          ref: b
+        }
+      ),
+      /* @__PURE__ */ s.jsx("span", { className: o }),
+      /* @__PURE__ */ s.jsx("span", { className: "peer-disabled:text-sumi-500", children: f })
+    ] }) });
+  }
+);
 Se.displayName = "Radio";
-const hr = y.forwardRef((p, b) => {
-  const { className: m, children: f, ...i } = p, a = y.useContext(F);
-  a.isRequired && (i.required = !0);
-  const v = a.isInvalid ? "border-sun-800" : "border-sumi-900", c = `
+const hr = y.forwardRef(
+  (p, b) => {
+    const { className: m, children: f, ...i } = p, a = y.useContext(F);
+    a.isRequired && (i.required = !0);
+    const v = a.isInvalid ? "border-sun-800" : "border-sumi-900", c = `
     peer
     cursor-pointer
     appearance-none
@@ -748,26 +753,28 @@ const hr = y.forwardRef((p, b) => {
     pointer-events-none
     peer-disabled:fill-sumi-500
   `;
-  return /* @__PURE__ */ s.jsxs("label", { className: "inline-block relative", children: [
-    /* @__PURE__ */ s.jsx(
-      "select",
-      {
-        id: i.id ?? a.id,
-        className: P(c, v, p.className),
-        "aria-describedby": a.helperTextId,
-        "aria-errormessage": a.errorMessageId,
-        "aria-invalid": a.isInvalid ?? !1,
-        ...i,
-        ref: b,
-        children: f
-      }
-    ),
-    /* @__PURE__ */ s.jsx("span", { className: o, children: /* @__PURE__ */ s.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", 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" }) }) })
-  ] });
-}), br = y.forwardRef((p, b) => {
-  const { className: m, ...f } = p, i = y.useContext(F);
-  i.isRequired && (f.required = !0);
-  const a = i.isInvalid ? "border-sun-800" : "border-sumi-900", v = `
+    return /* @__PURE__ */ s.jsxs("label", { className: "inline-block relative", children: [
+      /* @__PURE__ */ s.jsx(
+        "select",
+        {
+          id: i.id ?? a.id,
+          className: P(c, v, p.className),
+          "aria-describedby": a.helperTextId,
+          "aria-errormessage": a.errorMessageId,
+          "aria-invalid": a.isInvalid ?? !1,
+          ...i,
+          ref: b,
+          children: f
+        }
+      ),
+      /* @__PURE__ */ s.jsx("span", { className: o, children: /* @__PURE__ */ s.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", 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" }) }) })
+    ] });
+  }
+), br = y.forwardRef(
+  (p, b) => {
+    const { className: m, ...f } = p, i = y.useContext(F);
+    i.isRequired && (f.required = !0);
+    const a = i.isInvalid ? "border-sun-800" : "border-sumi-900", v = `
     p-4
     rounded-lg
     border
@@ -779,27 +786,29 @@ const hr = y.forwardRef((p, b) => {
     disabled:text-sumi-500
     disabled:border-sumi-500
   `;
-  return /* @__PURE__ */ s.jsx(
-    "input",
-    {
-      type: "text",
-      id: f.id ?? i.id,
-      className: P(v, a, m),
-      "aria-describedby": i.helperTextId,
-      "aria-errormessage": i.errorMessageId,
-      "aria-invalid": i.isInvalid ?? !1,
-      ref: b,
-      ...f
-    }
-  );
-});
+    return /* @__PURE__ */ s.jsx(
+      "input",
+      {
+        type: "text",
+        id: f.id ?? i.id,
+        className: P(v, a, m),
+        "aria-describedby": i.helperTextId,
+        "aria-errormessage": i.errorMessageId,
+        "aria-invalid": i.isInvalid ?? !1,
+        ref: b,
+        ...f
+      }
+    );
+  }
+);
 br.displayName = "Input";
-const Oe = y.forwardRef((p, b) => {
-  const { className: m, children: f, onChange: i, maxLength: a, ...v } = p, [c, o] = y.useState(0), _ = (I) => {
-    i && i(I), o(I.target.value.length);
-  }, h = y.useContext(F);
-  h.isRequired && (v.required = !0);
-  const g = h.isInvalid ? "border-sun-800" : "border-sumi-900", C = c > (a || 0) ? "text-sun-800" : "text-sumi-700", T = `
+const Oe = y.forwardRef(
+  (p, b) => {
+    const { className: m, children: f, onChange: i, maxLength: a, ...v } = p, [c, o] = y.useState(0), _ = (I) => {
+      i && i(I), o(I.target.value.length);
+    }, h = y.useContext(F);
+    h.isRequired && (v.required = !0);
+    const g = h.isInvalid ? "border-sun-800" : "border-sumi-900", C = c > (a || 0) ? "text-sun-800" : "text-sumi-700", T = `
     p-4
     rounded-lg
     border
@@ -811,28 +820,29 @@ const Oe = y.forwardRef((p, b) => {
     disabled:text-sumi-500
     disabled:border-sumi-500
   `;
-  return /* @__PURE__ */ s.jsxs(s.Fragment, { children: [
-    /* @__PURE__ */ s.jsx(
-      "textarea",
-      {
-        id: v.id ?? h.id,
-        className: P(T, g, m),
-        "aria-describedby": h.helperTextId,
-        "aria-errormessage": h.errorMessageId,
-        "aria-invalid": h.isInvalid ?? !1,
-        onChange: _,
-        ...v,
-        ref: b,
-        children: f
-      }
-    ),
-    a ? /* @__PURE__ */ s.jsxs("p", { className: "text-xs text-sumi-700", children: [
-      /* @__PURE__ */ s.jsx("span", { className: C, children: c }),
-      "/",
-      /* @__PURE__ */ s.jsx("span", { children: a })
-    ] }) : ""
-  ] });
-});
+    return /* @__PURE__ */ s.jsxs(s.Fragment, { children: [
+      /* @__PURE__ */ s.jsx(
+        "textarea",
+        {
+          id: v.id ?? h.id,
+          className: P(T, g, m),
+          "aria-describedby": h.helperTextId,
+          "aria-errormessage": h.errorMessageId,
+          "aria-invalid": h.isInvalid ?? !1,
+          onChange: _,
+          ...v,
+          ref: b,
+          children: f
+        }
+      ),
+      a ? /* @__PURE__ */ s.jsxs("p", { className: "text-sup text-sumi-700", children: [
+        /* @__PURE__ */ s.jsx("span", { className: C, children: c }),
+        "/",
+        /* @__PURE__ */ s.jsx("span", { children: a })
+      ] }) : ""
+    ] });
+  }
+);
 Oe.displayName = "Textarea";
 const te = y.forwardRef((p, b) => {
   const m = y.useId(), {
@@ -865,14 +875,14 @@ const te = y.forwardRef((p, b) => {
         ]
       }
     ),
-    a && /* @__PURE__ */ s.jsx("p", { id: g.helperTextId, className: "text-xs text-sumi-700 mb-2", children: a }),
+    a && /* @__PURE__ */ s.jsx("p", { id: g.helperTextId, className: "text-sup text-sumi-700 mb-2", children: a }),
     _,
     c && /* @__PURE__ */ s.jsx(
       "p",
       {
         id: g.errorMessageId,
         className: P(
-          "text-xs text-sun-800",
+          "text-sup text-sun-800",
           a ? "mt-1" : "mt-2"
         ),
         children: v
@@ -903,10 +913,7 @@ const ae = y.forwardRef((p, b) => {
     /* @__PURE__ */ s.jsx("legend", { children: /* @__PURE__ */ s.jsxs(
       "p",
       {
-        className: P(
-          "block mb-2 text-label",
-          c && "text-sun-800"
-        ),
+        className: P("block mb-2 text-label", c && "text-sun-800"),
         children: [
           f,
           o && /* @__PURE__ */ s.jsx("span", { className: "text-sun-800", children: " *" })
@@ -914,13 +921,13 @@ const ae = y.forwardRef((p, b) => {
       }
     ) }),
     /* @__PURE__ */ s.jsx("div", { className: P("inline-flex", I), children: h }),
-    a && /* @__PURE__ */ s.jsx("p", { id: T.helperTextId, className: "text-xs text-sumi-700 mt-2", children: a }),
+    a && /* @__PURE__ */ s.jsx("p", { id: T.helperTextId, className: "text-sup text-sumi-700 mt-2", children: a }),
     c && /* @__PURE__ */ s.jsx(
       "p",
       {
         id: T.errorMessageId,
         className: P(
-          "text-xs text-sun-800",
+          "text-sup text-sun-800",
           a ? "mt-1" : "mt-2"
         ),
         children: v