@purpurds/text-field 5.20.1 → 5.21.1

package/dist/text-field.es.js

@@ -1,15 +1,15 @@
 import { jsxs as g, jsx as p } from "react/jsx-runtime";
-import { forwardRef as y, Children as z, isValidElement as M, createElement as A, cloneElement as U, useEffect as vr, Fragment as xr, useRef as mr, useId as gr } from "react";
+import { forwardRef as y, Children as z, isValidElement as M, createElement as A, cloneElement as W, useEffect as xr, Fragment as mr, useRef as gr, useId as br } from "react";
 import "react-dom";
-const br = {
+const yr = {
   SM: "sm",
   MD: "md",
   LG: "lg"
 };
-function yr(t) {
+function hr(t) {
   return t && t.__esModule && Object.prototype.hasOwnProperty.call(t, "default") ? t.default : t;
 }
-var W = { exports: {} };
+var K = { exports: {} };
 /*!
 	Copyright (c) 2018 Jed Watson.
 	Licensed under the MIT License (MIT), see
@@ -44,42 +44,42 @@ var W = { exports: {} };
     }
     t.exports ? (n.default = n, t.exports = n) : window.classNames = n;
   })();
-})(W);
-var hr = W.exports;
-const Z = /* @__PURE__ */ yr(hr), $r = "_rotate_1xozj_1", wr = "_dash_1xozj_1", j = {
+})(K);
+var $r = K.exports;
+const R = /* @__PURE__ */ hr($r), wr = "_rotate_1xozj_1", jr = "_dash_1xozj_1", j = {
   "purpur-spinner": "_purpur-spinner_1xozj_1",
-  rotate: $r,
+  rotate: wr,
   "purpur-spinner--xxs": "_purpur-spinner--xxs_1xozj_4",
   "purpur-spinner--xs": "_purpur-spinner--xs_1xozj_8",
   "purpur-spinner--sm": "_purpur-spinner--sm_1xozj_12",
   "purpur-spinner--md": "_purpur-spinner--md_1xozj_16",
   "purpur-spinner--lg": "_purpur-spinner--lg_1xozj_20",
   "purpur-spinner__circle": "_purpur-spinner__circle_1xozj_24",
-  dash: wr,
+  dash: jr,
   "purpur-spinner__circle--disabled": "_purpur-spinner__circle--disabled_1xozj_33",
   "purpur-spinner__circle--negative": "_purpur-spinner__circle--negative_1xozj_36"
-}, S = "purpur-spinner", jr = {
+}, S = "purpur-spinner", Sr = {
   XXS: "xxs",
   XS: "xs",
   SM: "sm",
   MD: "md",
   LG: "lg"
-}, Sr = ({
+}, Nr = ({
   ["data-testid"]: t,
   disabled: u = !1,
   negative: n = !1,
-  size: a = jr.SM,
+  size: a = Sr.SM,
   ...o
 }) => /* @__PURE__ */ p(
   "div",
   {
-    className: Z([j[S], j[`${S}--${a}`]]),
+    className: R([j[S], j[`${S}--${a}`]]),
     "data-testid": t,
     ...o,
     children: /* @__PURE__ */ p("svg", { viewBox: "0 0 50 50", children: /* @__PURE__ */ p(
       "circle",
       {
-        className: Z(j[`${S}__circle`], {
+        className: R(j[`${S}__circle`], {
           [j[`${S}__circle--disabled`]]: u,
           [j[`${S}__circle--negative`]]: n
         }),
@@ -90,10 +90,10 @@ const Z = /* @__PURE__ */ yr(hr), $r = "_rotate_1xozj_1", wr = "_dash_1xozj_1",
     ) })
   }
 );
-function Nr(t) {
+function Or(t) {
   return t && t.__esModule && Object.prototype.hasOwnProperty.call(t, "default") ? t.default : t;
 }
-var K = { exports: {} };
+var Q = { exports: {} };
 /*!
 	Copyright (c) 2018 Jed Watson.
 	Licensed under the MIT License (MIT), see
@@ -128,9 +128,9 @@ var K = { exports: {} };
     }
     t.exports ? (n.default = n, t.exports = n) : window.classNames = n;
   })();
-})(K);
-var Or = K.exports;
-const zr = /* @__PURE__ */ Nr(Or), Mr = {
+})(Q);
+var zr = Q.exports;
+const Mr = /* @__PURE__ */ Or(zr), Ar = {
   "purpur-button": "_purpur-button_1acxn_1",
   "purpur-button--sm": "_purpur-button--sm_1acxn_33",
   "purpur-button--icon-only": "_purpur-button--icon-only_1acxn_36",
@@ -151,7 +151,7 @@ const zr = /* @__PURE__ */ Nr(Or), Mr = {
   "purpur-button--tertiary-purple-negative": "_purpur-button--tertiary-purple-negative_1acxn_160",
   "purpur-button--text-negative": "_purpur-button--text-negative_1acxn_175",
   "purpur-button--text": "_purpur-button--text_1acxn_175"
-}, Ar = zr.bind(Mr), x = "purpur-button", Cr = ({
+}, Cr = Mr.bind(Ar), x = "purpur-button", qr = ({
   children: t,
   className: u,
   ["data-testid"]: n,
@@ -168,7 +168,7 @@ const zr = /* @__PURE__ */ Nr(Or), Mr = {
 }, m) => {
   if (r && h === "destructive")
     return null;
-  const q = Ar(
+  const q = Cr(
     [
       x,
       `${x}--${i ? `${h}-negative` : h}`,
@@ -195,18 +195,18 @@ const zr = /* @__PURE__ */ Nr(Or), Mr = {
       onClick: $,
       ...l,
       children: [
-        e && /* @__PURE__ */ p(Sr, { size: v === br.LG ? "xs" : "xxs", negative: i, disabled: c }),
+        e && /* @__PURE__ */ p(Nr, { size: v === yr.LG ? "xs" : "xxs", negative: i, disabled: c }),
         " ",
         t
       ]
     }
   );
-}, Q = y(Cr);
-Q.displayName = "Button";
-function qr(t) {
+}, rr = y(qr);
+rr.displayName = "Button";
+function Ir(t) {
   return t && t.__esModule && Object.prototype.hasOwnProperty.call(t, "default") ? t.default : t;
 }
-var rr = { exports: {} };
+var tr = { exports: {} };
 /*!
 	Copyright (c) 2018 Jed Watson.
 	Licensed under the MIT License (MIT), see
@@ -241,9 +241,9 @@ var rr = { exports: {} };
     }
     t.exports ? (n.default = n, t.exports = n) : window.classNames = n;
   })();
-})(rr);
-var Lr = rr.exports;
-const Br = /* @__PURE__ */ qr(Lr), Dr = {
+})(tr);
+var Lr = tr.exports;
+const Br = /* @__PURE__ */ Ir(Lr), Dr = {
   "purpur-icon": "_purpur-icon_8u1lq_1",
   "purpur-icon--xxs": "_purpur-icon--xxs_8u1lq_4",
   "purpur-icon--xs": "_purpur-icon--xs_8u1lq_8",
@@ -251,31 +251,31 @@ const Br = /* @__PURE__ */ qr(Lr), Dr = {
   "purpur-icon--md": "_purpur-icon--md_8u1lq_16",
   "purpur-icon--lg": "_purpur-icon--lg_8u1lq_20",
   "purpur-icon--xl": "_purpur-icon--xl_8u1lq_24"
-}, Ir = {
+}, Er = {
   name: "error-filled",
   svg: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 25 24" fill="currentColor"><path fill-rule="evenodd" d="M14.268 3.5c-.77-1.333-2.694-1.333-3.464 0l-8.66 15c-.77 1.333.192 3 1.732 3h17.32c1.54 0 2.502-1.667 1.733-3l-8.66-15Zm-.694 5.067-.247 6.876h-1.566l-.247-6.876a1.03 1.03 0 1 1 2.06 0Zm.212 8.917c0 .649-.585 1.234-1.25 1.234-.648 0-1.25-.585-1.25-1.234 0-.633.602-1.234 1.25-1.234.665 0 1.25.601 1.25 1.234Z" clip-rule="evenodd"/></svg>',
   keywords: ["error-filled"],
   category: "status"
-}, Er = Br.bind(Dr), R = "purpur-icon", Fr = "md", Pr = (t) => t.filter((u) => Object.keys(u).length >= 1).map((u) => `${u.name}="${u.value}"`).join(" "), kr = ({ content: t = "", title: u } = {}) => {
+}, Fr = Br.bind(Dr), V = "purpur-icon", Pr = "md", kr = (t) => t.filter((u) => Object.keys(u).length >= 1).map((u) => `${u.name}="${u.value}"`).join(" "), Xr = ({ content: t = "", title: u } = {}) => {
   const n = [
     { name: "xmlns", value: "http://www.w3.org/2000/svg" },
     { name: "fill", value: "currentColor" },
     { name: "viewBox", value: "0 0 24 24" },
     u ? { name: "role", value: "img" } : { name: "aria-hidden", value: "true" }
   ], a = u ? `<title>${u}</title>` : "";
-  return `<svg ${Pr(n)}>${a}${t}</svg>`;
-}, Xr = (t) => t.replace(/<(\/?)svg([^>]*)>/g, "").trim(), Zr = ({
+  return `<svg ${kr(n)}>${a}${t}</svg>`;
+}, Zr = (t) => t.replace(/<(\/?)svg([^>]*)>/g, "").trim(), er = ({
   ["data-testid"]: t,
   svg: u,
   allyTitle: n,
   className: a,
-  size: o = Fr,
+  size: o = Pr,
   ...r
 }) => {
-  const e = kr({
-    content: Xr(u.svg),
+  const e = Xr({
+    content: Zr(u.svg),
     title: n
-  }), i = Er(a, R, `${R}--${o}`);
+  }), i = Fr(a, V, `${V}--${o}`);
   return /* @__PURE__ */ p(
     "span",
     {
@@ -287,10 +287,11 @@ const Br = /* @__PURE__ */ qr(Lr), Dr = {
     }
   );
 };
+er.displayName = "Icon";
 function Rr(t) {
   return t && t.__esModule && Object.prototype.hasOwnProperty.call(t, "default") ? t.default : t;
 }
-var tr = { exports: {} };
+var nr = { exports: {} };
 /*!
 	Copyright (c) 2018 Jed Watson.
 	Licensed under the MIT License (MIT), see
@@ -325,12 +326,12 @@ var tr = { exports: {} };
     }
     t.exports ? (n.default = n, t.exports = n) : window.classNames = n;
   })();
-})(tr);
-var Vr = tr.exports;
-const Tr = /* @__PURE__ */ Rr(Vr), V = {
+})(nr);
+var Vr = nr.exports;
+const Tr = /* @__PURE__ */ Rr(Vr), T = {
   "purpur-field-error-text": "_purpur-field-error-text_1u768_1",
   "purpur-field-error-text__icon": "_purpur-field-error-text__icon_1u768_12"
-}, T = "purpur-field-error-text", Gr = ({
+}, G = "purpur-field-error-text", Gr = ({
   ["data-testid"]: t,
   children: u,
   className: n,
@@ -339,13 +340,13 @@ const Tr = /* @__PURE__ */ Rr(Vr), V = {
 }) => /* @__PURE__ */ g(
   "div",
   {
-    className: Tr([n, V[T]]),
+    className: Tr([n, T[G]]),
     "data-testid": t,
     "aria-live": "assertive",
     "aria-relevant": a,
     ...o,
     children: [
-      /* @__PURE__ */ p(Zr, { svg: Ir, size: "xs", className: V[`${T}__icon`] }),
+      /* @__PURE__ */ p(er, { svg: Er, size: "xs", className: T[`${G}__icon`] }),
       u
     ]
   }
@@ -353,7 +354,7 @@ const Tr = /* @__PURE__ */ Rr(Vr), V = {
 function Hr(t) {
   return t && t.__esModule && Object.prototype.hasOwnProperty.call(t, "default") ? t.default : t;
 }
-var er = { exports: {} };
+var ir = { exports: {} };
 /*!
 	Copyright (c) 2018 Jed Watson.
 	Licensed under the MIT License (MIT), see
@@ -388,12 +389,12 @@ var er = { exports: {} };
     }
     t.exports ? (n.default = n, t.exports = n) : window.classNames = n;
   })();
-})(er);
-var Yr = er.exports;
-const Jr = /* @__PURE__ */ Hr(Yr), G = {
+})(ir);
+var Yr = ir.exports;
+const Jr = /* @__PURE__ */ Hr(Yr), H = {
   "purpur-field-helper-text": "_purpur-field-helper-text_atw6b_1",
   "purpur-field-helper-text--disabled": "_purpur-field-helper-text--disabled_atw6b_9"
-}, H = "purpur-field-helper-text", Ur = ({
+}, Y = "purpur-field-helper-text", Ur = ({
   ["data-testid"]: t,
   children: u,
   className: n,
@@ -403,9 +404,9 @@ const Jr = /* @__PURE__ */ Hr(Yr), G = {
 }) => {
   const e = Jr([
     n,
-    G[H],
+    H[Y],
     {
-      [G[`${H}--disabled`]]: a
+      [H[`${Y}--disabled`]]: a
     }
   ]);
   return /* @__PURE__ */ p("span", { id: o, className: e, "data-testid": t, ...r, children: u });
@@ -413,7 +414,7 @@ const Jr = /* @__PURE__ */ Hr(Yr), G = {
 function Wr(t) {
   return t && t.__esModule && Object.prototype.hasOwnProperty.call(t, "default") ? t.default : t;
 }
-var nr = { exports: {} };
+var ur = { exports: {} };
 /*!
 	Copyright (c) 2018 Jed Watson.
 	Licensed under the MIT License (MIT), see
@@ -448,8 +449,8 @@ var nr = { exports: {} };
     }
     t.exports ? (n.default = n, t.exports = n) : window.classNames = n;
   })();
-})(nr);
-var Kr = nr.exports;
+})(ur);
+var Kr = ur.exports;
 const Qr = /* @__PURE__ */ Wr(Kr), rt = {
   "purpur-icon": "_purpur-icon_8u1lq_1",
   "purpur-icon--xxs": "_purpur-icon--xxs_8u1lq_4",
@@ -468,23 +469,23 @@ const Qr = /* @__PURE__ */ Wr(Kr), rt = {
   svg: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><path fill-rule="evenodd" d="M4.864 4.864a.9.9 0 0 1 1.273 0L12 10.727l5.864-5.863a.9.9 0 0 1 1.272 1.272L13.273 12l5.863 5.864a.9.9 0 1 1-1.272 1.272L12 13.273l-5.863 5.863a.9.9 0 0 1-1.273-1.272L10.727 12 4.864 6.136a.9.9 0 0 1 0-1.272Z" clip-rule="evenodd"/></svg>',
   keywords: ["close"],
   category: "utility"
-}, ir = (t) => /* @__PURE__ */ p(
-  ar,
+}, ar = (t) => /* @__PURE__ */ p(
+  P,
   {
     ...t,
     svg: tt
   }
 );
-ir.displayName = "IconCheckCircleFilled";
-const ur = (t) => /* @__PURE__ */ p(
-  ar,
+ar.displayName = "IconCheckCircleFilled";
+const or = (t) => /* @__PURE__ */ p(
+  P,
   {
     ...t,
     svg: et
   }
 );
-ur.displayName = "IconClose";
-const nt = Qr.bind(rt), Y = "purpur-icon", it = "md", ut = (t) => t.filter((u) => Object.keys(u).length >= 1).map((u) => `${u.name}="${u.value}"`).join(" "), at = ({ content: t = "", title: u } = {}) => {
+or.displayName = "IconClose";
+const nt = Qr.bind(rt), J = "purpur-icon", it = "md", ut = (t) => t.filter((u) => Object.keys(u).length >= 1).map((u) => `${u.name}="${u.value}"`).join(" "), at = ({ content: t = "", title: u } = {}) => {
   const n = [
     { name: "xmlns", value: "http://www.w3.org/2000/svg" },
     { name: "fill", value: "currentColor" },
@@ -492,7 +493,7 @@ const nt = Qr.bind(rt), Y = "purpur-icon", it = "md", ut = (t) => t.filter((u) =
     u ? { name: "role", value: "img" } : { name: "aria-hidden", value: "true" }
   ], a = u ? `<title>${u}</title>` : "";
   return `<svg ${ut(n)}>${a}${t}</svg>`;
-}, ot = (t) => t.replace(/<(\/?)svg([^>]*)>/g, "").trim(), ar = ({
+}, ot = (t) => t.replace(/<(\/?)svg([^>]*)>/g, "").trim(), P = ({
   ["data-testid"]: t,
   svg: u,
   allyTitle: n,
@@ -503,7 +504,7 @@ const nt = Qr.bind(rt), Y = "purpur-icon", it = "md", ut = (t) => t.filter((u) =
   const e = at({
     content: ot(u.svg),
     title: n
-  }), i = nt(a, Y, `${Y}--${o}`);
+  }), i = nt(a, J, `${J}--${o}`);
   return /* @__PURE__ */ p(
     "span",
     {
@@ -515,6 +516,7 @@ const nt = Qr.bind(rt), Y = "purpur-icon", it = "md", ut = (t) => t.filter((u) =
     }
   );
 };
+P.displayName = "Icon";
 function b() {
   return b = Object.assign ? Object.assign.bind() : function(t) {
     for (var u = 1; u < arguments.length; u++) {
@@ -532,28 +534,28 @@ function lt(...t) {
     (n) => pt(n, u)
   );
 }
-const or = /* @__PURE__ */ y((t, u) => {
+const pr = /* @__PURE__ */ y((t, u) => {
   const { children: n, ...a } = t, o = z.toArray(n), r = o.find(ct);
   if (r) {
     const e = r.props.children, i = o.map((f) => f === r ? z.count(e) > 1 ? z.only(null) : /* @__PURE__ */ M(e) ? e.props.children : null : f);
     return /* @__PURE__ */ A(F, b({}, a, {
       ref: u
-    }), /* @__PURE__ */ M(e) ? /* @__PURE__ */ U(e, void 0, i) : null);
+    }), /* @__PURE__ */ M(e) ? /* @__PURE__ */ W(e, void 0, i) : null);
   }
   return /* @__PURE__ */ A(F, b({}, a, {
     ref: u
   }), n);
 });
-or.displayName = "Slot";
+pr.displayName = "Slot";
 const F = /* @__PURE__ */ y((t, u) => {
   const { children: n, ...a } = t;
-  return /* @__PURE__ */ M(n) ? /* @__PURE__ */ U(n, {
+  return /* @__PURE__ */ M(n) ? /* @__PURE__ */ W(n, {
     ...dt(a, n.props),
     ref: u ? lt(u, n.ref) : n.ref
   }) : z.count(n) > 1 ? z.only(null) : null;
 });
 F.displayName = "SlotClone";
-const st = ({ children: t }) => /* @__PURE__ */ A(xr, null, t);
+const st = ({ children: t }) => /* @__PURE__ */ A(mr, null, t);
 function ct(t) {
   return /* @__PURE__ */ M(t) && t.type === st;
 }
@@ -597,8 +599,8 @@ const _t = [
   "ul"
 ], ft = _t.reduce((t, u) => {
   const n = /* @__PURE__ */ y((a, o) => {
-    const { asChild: r, ...e } = a, i = r ? or : u;
-    return vr(() => {
+    const { asChild: r, ...e } = a, i = r ? pr : u;
+    return xr(() => {
       window[Symbol.for("radix-ui")] = !0;
     }, []), /* @__PURE__ */ A(i, b({}, e, {
       ref: o
@@ -618,7 +620,7 @@ const _t = [
 function mt(t) {
   return t && t.__esModule && Object.prototype.hasOwnProperty.call(t, "default") ? t.default : t;
 }
-var pr = { exports: {} };
+var lr = { exports: {} };
 /*!
 	Copyright (c) 2018 Jed Watson.
 	Licensed under the MIT License (MIT), see
@@ -653,9 +655,9 @@ var pr = { exports: {} };
     }
     t.exports ? (n.default = n, t.exports = n) : window.classNames = n;
   })();
-})(pr);
-var gt = pr.exports;
-const bt = /* @__PURE__ */ mt(gt), I = {
+})(lr);
+var gt = lr.exports;
+const bt = /* @__PURE__ */ mt(gt), D = {
   "purpur-label": "_purpur-label_12cfi_1",
   "purpur-label--negative": "_purpur-label--negative_12cfi_9",
   "purpur-label--disabled": "_purpur-label--disabled_12cfi_12"
@@ -670,10 +672,10 @@ const bt = /* @__PURE__ */ mt(gt), I = {
 }) => {
   const i = bt([
     u,
-    I[E],
+    D[E],
     {
-      [I[`${E}--disabled`]]: o,
-      [I[`${E}--negative`]]: r
+      [D[`${E}--disabled`]]: o,
+      [D[`${E}--negative`]]: r
     }
   ]);
   return /* @__PURE__ */ p(xt, { className: i, "data-testid": a, htmlFor: n, ...e, children: t });
@@ -681,7 +683,7 @@ const bt = /* @__PURE__ */ mt(gt), I = {
 function ht(t) {
   return t && t.__esModule && Object.prototype.hasOwnProperty.call(t, "default") ? t.default : t;
 }
-var lr = { exports: {} };
+var sr = { exports: {} };
 /*!
 	Copyright (c) 2018 Jed Watson.
 	Licensed under the MIT License (MIT), see
@@ -716,9 +718,9 @@ var lr = { exports: {} };
     }
     t.exports ? (n.default = n, t.exports = n) : window.classNames = n;
   })();
-})(lr);
-var $t = lr.exports;
-const J = /* @__PURE__ */ ht($t), wt = "_rotate_1xozj_1", jt = "_dash_1xozj_1", N = {
+})(sr);
+var $t = sr.exports;
+const U = /* @__PURE__ */ ht($t), wt = "_rotate_1xozj_1", jt = "_dash_1xozj_1", N = {
   "purpur-spinner": "_purpur-spinner_1xozj_1",
   rotate: wt,
   "purpur-spinner--xxs": "_purpur-spinner--xxs_1xozj_4",
@@ -745,13 +747,13 @@ const J = /* @__PURE__ */ ht($t), wt = "_rotate_1xozj_1", jt = "_dash_1xozj_1",
 }) => /* @__PURE__ */ p(
   "div",
   {
-    className: J([N[O], N[`${O}--${a}`]]),
+    className: U([N[O], N[`${O}--${a}`]]),
     "data-testid": t,
     ...o,
     children: /* @__PURE__ */ p("svg", { viewBox: "0 0 50 50", children: /* @__PURE__ */ p(
       "circle",
       {
-        className: J(N[`${O}__circle`], {
+        className: U(N[`${O}__circle`], {
           [N[`${O}__circle--disabled`]]: u,
           [N[`${O}__circle--negative`]]: n
         }),
@@ -765,7 +767,7 @@ const J = /* @__PURE__ */ ht($t), wt = "_rotate_1xozj_1", jt = "_dash_1xozj_1",
 function Ot(t) {
   return t && t.__esModule && Object.prototype.hasOwnProperty.call(t, "default") ? t.default : t;
 }
-var sr = { exports: {} };
+var cr = { exports: {} };
 /*!
 	Copyright (c) 2018 Jed Watson.
 	Licensed under the MIT License (MIT), see
@@ -800,8 +802,8 @@ var sr = { exports: {} };
     }
     t.exports ? (n.default = n, t.exports = n) : window.classNames = n;
   })();
-})(sr);
-var zt = sr.exports;
+})(cr);
+var zt = cr.exports;
 const Mt = /* @__PURE__ */ Ot(zt), At = {
   "purpur-text-field": "_purpur-text-field_nj9f4_1",
   "purpur-text-field__label": "_purpur-text-field__label_nj9f4_7",
@@ -819,7 +821,7 @@ const Mt = /* @__PURE__ */ Ot(zt), At = {
   "purpur-text-field__input--error": "_purpur-text-field__input--error_nj9f4_94",
   "purpur-text-field__adornment-container": "_purpur-text-field__adornment-container_nj9f4_106",
   "purpur-text-field__valid-icon": "_purpur-text-field__valid-icon_nj9f4_111"
-}, Ct = (t) => mr(t), _ = Mt.bind(At), s = "purpur-text-field", qt = ({
+}, Ct = (t) => gr(t), _ = Mt.bind(At), s = "purpur-text-field", qt = ({
   ["data-testid"]: t,
   className: u,
   clearButtonAllyLabel: n,
@@ -834,13 +836,13 @@ const Mt = /* @__PURE__ */ Ot(zt), At = {
   valid: C = !1,
   ...l
 }, m) => {
-  var X;
-  const q = gr(), $ = l.id ?? q, c = (d) => t ? `${t}-${d}` : void 0, w = C && !r, L = e ? `${$}-helper-text` : void 0, B = [h].filter((d) => !!d), P = (typeof l.value == "number" ? l.value !== void 0 : (X = l.value) == null ? void 0 : X.length) && !l.disabled && !l.readOnly && !f && v && n, k = Ct(null), dr = (d) => {
-    k.current = d, typeof m == "function" ? m(d) : m && (m.current = d);
-  }, _r = () => {
+  var Z;
+  const q = br(), $ = l.id ?? q, c = (d) => t ? `${t}-${d}` : void 0, w = C && !r, I = e ? `${$}-helper-text` : void 0, L = [h].filter((d) => !!d), k = (typeof l.value == "number" ? l.value !== void 0 : (Z = l.value) == null ? void 0 : Z.length) && !l.disabled && !l.readOnly && !f && v && n, X = Ct(null), _r = (d) => {
+    X.current = d, typeof m == "function" ? m(d) : m && (m.current = d);
+  }, fr = () => {
     var d;
-    v == null || v(), (d = k.current) == null || d.focus();
-  }, D = [
+    v == null || v(), (d = X.current) == null || d.focus();
+  }, B = [
     f && /* @__PURE__ */ p(
       Nt,
       {
@@ -850,34 +852,34 @@ const Mt = /* @__PURE__ */ Ot(zt), At = {
       },
       "spinner"
     ),
-    P && /* @__PURE__ */ p(
-      Q,
+    k && /* @__PURE__ */ p(
+      rr,
       {
         variant: "tertiary-purple",
-        onClick: _r,
+        onClick: fr,
         iconOnly: !0,
         "aria-label": n ?? "",
         "data-testid": c("clear-button"),
         tabIndex: -1,
-        children: /* @__PURE__ */ p(ur, { size: "xs" })
+        children: /* @__PURE__ */ p(or, { size: "xs" })
       },
       "clear-button"
     ),
     w && /* @__PURE__ */ p(
-      ir,
+      ar,
       {
         "data-testid": c("valid-icon"),
         className: _(`${s}__valid-icon`)
       },
       "valid-icon"
     )
-  ].filter((d) => !!d), fr = _([
+  ].filter((d) => !!d), vr = _([
     `${s}__input-container`,
     {
-      [`${s}__input-container--start-adornment`]: B.length,
-      [`${s}__input-container--end-adornment`]: D.length || o,
+      [`${s}__input-container--start-adornment`]: L.length,
+      [`${s}__input-container--end-adornment`]: B.length || o,
       [`${s}__input-container--disabled`]: l.disabled,
-      [`${s}__input-container--has-clear-button`]: P,
+      [`${s}__input-container--has-clear-button`]: k,
       [`${s}__input-container--readonly`]: l.readOnly && !l.disabled
     }
   ]);
@@ -893,13 +895,13 @@ const Mt = /* @__PURE__ */ Ot(zt), At = {
       }
     ),
     /* @__PURE__ */ g("div", { className: _(`${s}__field-row`), children: [
-      /* @__PURE__ */ g("div", { className: fr, children: [
-        !!B.length && /* @__PURE__ */ p(
+      /* @__PURE__ */ g("div", { className: vr, children: [
+        !!L.length && /* @__PURE__ */ p(
           "div",
           {
             "data-testid": c("start-adornments"),
             className: _(`${s}__adornment-container`),
-            children: B
+            children: L
           }
         ),
         /* @__PURE__ */ p(
@@ -907,9 +909,9 @@ const Mt = /* @__PURE__ */ Ot(zt), At = {
           {
             ...l,
             id: $,
-            ref: dr,
+            ref: _r,
             "data-testid": c("input"),
-            "aria-describedby": l["aria-describedby"] || L,
+            "aria-describedby": l["aria-describedby"] || I,
             "aria-invalid": l["aria-invalid"] || !!r,
             className: _([
               `${s}__input`,
@@ -921,13 +923,13 @@ const Mt = /* @__PURE__ */ Ot(zt), At = {
           }
         ),
         /* @__PURE__ */ p("div", { className: _(`${s}__frame`) }),
-        (!!D.length || o) && /* @__PURE__ */ g(
+        (!!B.length || o) && /* @__PURE__ */ g(
           "div",
           {
             "data-testid": c("end-adornments"),
             className: _(`${s}__adornment-container`),
             children: [
-              D,
+              B,
               o
             ]
           }
@@ -935,14 +937,14 @@ const Mt = /* @__PURE__ */ Ot(zt), At = {
       ] }),
       !!a && a
     ] }),
-    L && /* @__PURE__ */ p(Ur, { "data-testid": c("helper-text"), id: L, children: e }),
+    I && /* @__PURE__ */ p(Ur, { "data-testid": c("helper-text"), id: I, children: e }),
     r && /* @__PURE__ */ p(Gr, { "data-testid": c("error-text"), children: r })
   ] });
-}, cr = y(qt);
-cr.displayName = "TextField";
-const Et = (t) => M(t) && t.type.displayName === cr.displayName;
+}, dr = y(qt);
+dr.displayName = "TextField";
+const Et = (t) => M(t) && t.type.displayName === dr.displayName;
 export {
-  cr as TextField,
+  dr as TextField,
   Et as isTextField
 };
 //# sourceMappingURL=text-field.es.js.map