@alma-oss/spirit-web-react 4.4.2 → 4.6.0

package/dist/components/Text/demo/preview.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"preview.cjs","sources":["../../../../src/components/Text/demo/preview.tsx"],"sourcesContent":["'use client';\n\nimport React, { StrictMode } from 'react';\nimport DocsSection from '../../../../docs/DocsSection';\nimport TextAlignment from './TextAlignment';\nimport TextBalanced from './TextBalanced';\nimport TextColor from './TextColor';\nimport TextDefault from './TextDefault';\nimport TextEmphasis from './TextEmphasis';\nimport TextHyphens from './TextHyphens';\nimport TextSizes from './TextSizes';\nimport TextWordBreak from './TextWordBreak';\n\nexport const Preview = () => (\n  <StrictMode>\n    <DocsSection title=\"Default\">\n      <TextDefault />\n    </DocsSection>\n    <DocsSection title=\"Sizes\">\n      <TextSizes />\n    </DocsSection>\n    <DocsSection title=\"Emphasis\">\n      <TextEmphasis />\n    </DocsSection>\n    <DocsSection title=\"Colors\">\n      <TextColor />\n    </DocsSection>\n    <DocsSection title=\"Alignment\" stackAlignment=\"stretch\">\n      <TextAlignment />\n    </DocsSection>\n    <DocsSection title=\"Balanced Wrapping\" stackAlignment=\"stretch\">\n      <TextBalanced />\n    </DocsSection>\n    <DocsSection title=\"Word Break\" stackAlignment=\"stretch\">\n      <TextWordBreak />\n    </DocsSection>\n    <DocsSection title=\"Hyphens\" stackAlignment=\"stretch\">\n      <TextHyphens />\n    </DocsSection>\n  </StrictMode>\n);\n"],"names":["Preview","jsxs","StrictMode","jsx","DocsSection","TextDefault","TextSizes","TextEmphasis","TextColor","TextAlignment","TextBalanced","TextWordBreak","TextHyphens"],"mappings":"ocAaaA,EAAU,IACrBC,EAAAA,KAACC,EAAAA,WAAA,CACC,SAAA,CAAAC,MAACC,EAAAA,QAAA,CAAY,MAAM,UACjB,SAAAD,MAACE,EAAAA,UAAY,EACf,QACCD,EAAAA,QAAA,CAAY,MAAM,QACjB,SAAAD,MAACG,EAAAA,UAAU,EACb,QACCF,EAAAA,QAAA,CAAY,MAAM,WACjB,SAAAD,MAACI,EAAAA,UAAa,EAChB,QACCH,EAAAA,QAAA,CAAY,MAAM,SACjB,SAAAD,MAACK,EAAAA,UAAU,EACb,EACAL,EAAAA,IAACC,EAAAA,SAAY,MAAM,YAAY,eAAe,UAC5C,SAAAD,EAAAA,IAACM,YAAc,CAAA,CACjB,EACAN,EAAAA,IAACC,EAAAA,SAAY,MAAM,oBAAoB,eAAe,UACpD,SAAAD,EAAAA,IAACO,YAAa,CAAA,CAChB,EACAP,EAAAA,IAACC,EAAAA,SAAY,MAAM,aAAa,eAAe,UAC7C,SAAAD,EAAAA,IAACQ,YAAc,CAAA,CACjB,EACAR,EAAAA,IAACC,EAAAA,SAAY,MAAM,UAAU,eAAe,UAC1C,SAAAD,EAAAA,IAACS,EAAAA,UAAY,CAAA,CACf,CAAA,CAAA,CACF"}

package/dist/components/Text/demo/preview.js

@@ -0,0 +1,26 @@
+"use client";
+import { jsxs as r, jsx as t } from "react/jsx-runtime";
+import { StrictMode as i } from "react";
+import e from "../../../web-react/docs/DocsSection.js";
+import o from "./TextAlignment.js";
+import l from "./TextBalanced.js";
+import m from "./TextColor.js";
+import n from "./TextDefault.js";
+import c from "./TextEmphasis.js";
+import s from "./TextHyphens.js";
+import p from "./TextSizes.js";
+import a from "./TextWordBreak.js";
+const W = () => /* @__PURE__ */ r(i, { children: [
+  /* @__PURE__ */ t(e, { title: "Default", children: /* @__PURE__ */ t(n, {}) }),
+  /* @__PURE__ */ t(e, { title: "Sizes", children: /* @__PURE__ */ t(p, {}) }),
+  /* @__PURE__ */ t(e, { title: "Emphasis", children: /* @__PURE__ */ t(c, {}) }),
+  /* @__PURE__ */ t(e, { title: "Colors", children: /* @__PURE__ */ t(m, {}) }),
+  /* @__PURE__ */ t(e, { title: "Alignment", stackAlignment: "stretch", children: /* @__PURE__ */ t(o, {}) }),
+  /* @__PURE__ */ t(e, { title: "Balanced Wrapping", stackAlignment: "stretch", children: /* @__PURE__ */ t(l, {}) }),
+  /* @__PURE__ */ t(e, { title: "Word Break", stackAlignment: "stretch", children: /* @__PURE__ */ t(a, {}) }),
+  /* @__PURE__ */ t(e, { title: "Hyphens", stackAlignment: "stretch", children: /* @__PURE__ */ t(s, {}) })
+] });
+export {
+  W as Preview
+};
+//# sourceMappingURL=preview.js.map

package/dist/components/Text/demo/preview.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"preview.js","sources":["../../../../src/components/Text/demo/preview.tsx"],"sourcesContent":["'use client';\n\nimport React, { StrictMode } from 'react';\nimport DocsSection from '../../../../docs/DocsSection';\nimport TextAlignment from './TextAlignment';\nimport TextBalanced from './TextBalanced';\nimport TextColor from './TextColor';\nimport TextDefault from './TextDefault';\nimport TextEmphasis from './TextEmphasis';\nimport TextHyphens from './TextHyphens';\nimport TextSizes from './TextSizes';\nimport TextWordBreak from './TextWordBreak';\n\nexport const Preview = () => (\n  <StrictMode>\n    <DocsSection title=\"Default\">\n      <TextDefault />\n    </DocsSection>\n    <DocsSection title=\"Sizes\">\n      <TextSizes />\n    </DocsSection>\n    <DocsSection title=\"Emphasis\">\n      <TextEmphasis />\n    </DocsSection>\n    <DocsSection title=\"Colors\">\n      <TextColor />\n    </DocsSection>\n    <DocsSection title=\"Alignment\" stackAlignment=\"stretch\">\n      <TextAlignment />\n    </DocsSection>\n    <DocsSection title=\"Balanced Wrapping\" stackAlignment=\"stretch\">\n      <TextBalanced />\n    </DocsSection>\n    <DocsSection title=\"Word Break\" stackAlignment=\"stretch\">\n      <TextWordBreak />\n    </DocsSection>\n    <DocsSection title=\"Hyphens\" stackAlignment=\"stretch\">\n      <TextHyphens />\n    </DocsSection>\n  </StrictMode>\n);\n"],"names":["Preview","jsxs","StrictMode","jsx","DocsSection","TextDefault","TextSizes","TextEmphasis","TextColor","TextAlignment","TextBalanced","TextWordBreak","TextHyphens"],"mappings":";;;;;;;;;;;;AAaO,MAAMA,IAAU,MACrB,gBAAAC,EAACC,GAAA,EACC,UAAA;AAAA,EAAA,gBAAAC,EAACC,GAAA,EAAY,OAAM,WACjB,UAAA,gBAAAD,EAACE,KAAY,GACf;AAAA,oBACCD,GAAA,EAAY,OAAM,SACjB,UAAA,gBAAAD,EAACG,KAAU,GACb;AAAA,oBACCF,GAAA,EAAY,OAAM,YACjB,UAAA,gBAAAD,EAACI,KAAa,GAChB;AAAA,oBACCH,GAAA,EAAY,OAAM,UACjB,UAAA,gBAAAD,EAACK,KAAU,GACb;AAAA,EACA,gBAAAL,EAACC,KAAY,OAAM,aAAY,gBAAe,WAC5C,UAAA,gBAAAD,EAACM,KAAc,EAAA,CACjB;AAAA,EACA,gBAAAN,EAACC,KAAY,OAAM,qBAAoB,gBAAe,WACpD,UAAA,gBAAAD,EAACO,KAAa,EAAA,CAChB;AAAA,EACA,gBAAAP,EAACC,KAAY,OAAM,cAAa,gBAAe,WAC7C,UAAA,gBAAAD,EAACQ,KAAc,EAAA,CACjB;AAAA,EACA,gBAAAR,EAACC,KAAY,OAAM,WAAU,gBAAe,WAC1C,UAAA,gBAAAD,EAACS,KAAY,EAAA,CACf;AAAA,EAAA,CACF;"}

package/dist/components/Text/preview/index.cjs

@@ -0,0 +1,2 @@
+"use strict";"use client";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("../demo/preview.cjs");exports.default=e.Preview;
+//# sourceMappingURL=index.cjs.map

package/dist/components/Text/preview/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/components/Text/preview/index.js

@@ -0,0 +1,6 @@
+"use client";
+import { Preview as t } from "../demo/preview.js";
+export {
+  t as default
+};
+//# sourceMappingURL=index.js.map

package/dist/components/Text/preview/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;"}

package/dist/components/Text/preview.d.ts

@@ -0,0 +1,4 @@
+export {}
+import _default from '../../src/components/Text/preview/index'
+export default _default
+export {}

package/dist/components/Text/useTextStyleProps.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"useTextStyleProps.cjs","sources":["../../../src/components/Text/useTextStyleProps.ts"],"sourcesContent":["import classNames from 'classnames';\nimport { type ElementType } from 'react';\nimport { useClassNamePrefix } from '../../hooks';\nimport { type SpiritTextProps, type TextProps } from '../../types';\n\nexport interface TextStyles<E extends ElementType = 'p'> {\n  /** className props */\n  classProps: string | null;\n  /** props to be passed to the input element */\n  props: TextProps<E>;\n}\n\nexport function useTextStyleProps<E extends ElementType = 'p', S = void, Emph = void, C = void>(\n  props: SpiritTextProps<E, S, Emph, C>,\n): TextStyles<E> {\n  const { emphasis, size, textColor, ...restProps } = props;\n\n  const textClass = useClassNamePrefix('typography-body');\n  const textColorClass = useClassNamePrefix(textColor ? `text-${textColor}` : '');\n  const className = classNames(`${textClass}-${size}-${emphasis}`, {\n    [textColorClass]: !!textColor,\n  });\n\n  return {\n    classProps: className,\n    props: restProps,\n  };\n}\n"],"names":["useTextStyleProps","props","emphasis","size","textColor","restProps","textClass","useClassNamePrefix","textColorClass","classNames"],"mappings":"8JAYO,SAASA,EACdC,EACe,CACf,KAAM,CAAE,SAAAC,EAAU,KAAAC,EAAM,UAAAC,EAAW,GAAGC,GAAcJ,EAE9CK,EAAYC,EAAAA,mBAAmB,iBAAiB,EAChDC,EAAiBD,EAAAA,mBAAmBH,EAAY,QAAQA,CAAS,GAAK,EAAE,EAK9E,MAAO,CACL,WALgBK,EAAW,GAAGH,CAAS,IAAIH,CAAI,IAAID,CAAQ,GAAI,CAC/D,CAACM,CAAc,EAAG,CAAC,CAACJ,CAAA,CACrB,EAIC,MAAOC,CAAA,CAEX"}
+{"version":3,"file":"useTextStyleProps.cjs","sources":["../../../src/components/Text/useTextStyleProps.ts"],"sourcesContent":["import classNames from 'classnames';\nimport { useClassNamePrefix } from '../../hooks';\nimport { type TextProps } from '../../types';\n\nexport function useTextStyleProps<S = void, Emph = void, C = void>(props: TextProps<S, Emph, C>) {\n  const { emphasis, size, textColor, ...restProps } = props;\n\n  const textClass = useClassNamePrefix('typography-body');\n  const textColorClass = useClassNamePrefix(textColor ? `text-${textColor}` : '');\n  const className = classNames(`${textClass}-${size}-${emphasis}`, {\n    [textColorClass]: !!textColor,\n  });\n\n  return {\n    classProps: className,\n    props: restProps,\n  };\n}\n"],"names":["useTextStyleProps","props","emphasis","size","textColor","restProps","textClass","useClassNamePrefix","textColorClass","classNames"],"mappings":"8JAIO,SAASA,EAAmDC,EAA8B,CAC/F,KAAM,CAAE,SAAAC,EAAU,KAAAC,EAAM,UAAAC,EAAW,GAAGC,GAAcJ,EAE9CK,EAAYC,EAAAA,mBAAmB,iBAAiB,EAChDC,EAAiBD,EAAAA,mBAAmBH,EAAY,QAAQA,CAAS,GAAK,EAAE,EAK9E,MAAO,CACL,WALgBK,EAAW,GAAGH,CAAS,IAAIH,CAAI,IAAID,CAAQ,GAAI,CAC/D,CAACM,CAAc,EAAG,CAAC,CAACJ,CAAA,CACrB,EAIC,MAAOC,CAAA,CAEX"}

package/dist/components/Text/useTextStyleProps.js.map

@@ -1 +1 @@
-{"version":3,"file":"useTextStyleProps.js","sources":["../../../src/components/Text/useTextStyleProps.ts"],"sourcesContent":["import classNames from 'classnames';\nimport { type ElementType } from 'react';\nimport { useClassNamePrefix } from '../../hooks';\nimport { type SpiritTextProps, type TextProps } from '../../types';\n\nexport interface TextStyles<E extends ElementType = 'p'> {\n  /** className props */\n  classProps: string | null;\n  /** props to be passed to the input element */\n  props: TextProps<E>;\n}\n\nexport function useTextStyleProps<E extends ElementType = 'p', S = void, Emph = void, C = void>(\n  props: SpiritTextProps<E, S, Emph, C>,\n): TextStyles<E> {\n  const { emphasis, size, textColor, ...restProps } = props;\n\n  const textClass = useClassNamePrefix('typography-body');\n  const textColorClass = useClassNamePrefix(textColor ? `text-${textColor}` : '');\n  const className = classNames(`${textClass}-${size}-${emphasis}`, {\n    [textColorClass]: !!textColor,\n  });\n\n  return {\n    classProps: className,\n    props: restProps,\n  };\n}\n"],"names":["useTextStyleProps","props","emphasis","size","textColor","restProps","textClass","useClassNamePrefix","textColorClass","classNames"],"mappings":";;AAYO,SAASA,EACdC,GACe;AACf,QAAM,EAAE,UAAAC,GAAU,MAAAC,GAAM,WAAAC,GAAW,GAAGC,MAAcJ,GAE9CK,IAAYC,EAAmB,iBAAiB,GAChDC,IAAiBD,EAAmBH,IAAY,QAAQA,CAAS,KAAK,EAAE;AAK9E,SAAO;AAAA,IACL,YALgBK,EAAW,GAAGH,CAAS,IAAIH,CAAI,IAAID,CAAQ,IAAI;AAAA,MAC/D,CAACM,CAAc,GAAG,CAAC,CAACJ;AAAA,IAAA,CACrB;AAAA,IAIC,OAAOC;AAAA,EAAA;AAEX;"}
+{"version":3,"file":"useTextStyleProps.js","sources":["../../../src/components/Text/useTextStyleProps.ts"],"sourcesContent":["import classNames from 'classnames';\nimport { useClassNamePrefix } from '../../hooks';\nimport { type TextProps } from '../../types';\n\nexport function useTextStyleProps<S = void, Emph = void, C = void>(props: TextProps<S, Emph, C>) {\n  const { emphasis, size, textColor, ...restProps } = props;\n\n  const textClass = useClassNamePrefix('typography-body');\n  const textColorClass = useClassNamePrefix(textColor ? `text-${textColor}` : '');\n  const className = classNames(`${textClass}-${size}-${emphasis}`, {\n    [textColorClass]: !!textColor,\n  });\n\n  return {\n    classProps: className,\n    props: restProps,\n  };\n}\n"],"names":["useTextStyleProps","props","emphasis","size","textColor","restProps","textClass","useClassNamePrefix","textColorClass","classNames"],"mappings":";;AAIO,SAASA,EAAmDC,GAA8B;AAC/F,QAAM,EAAE,UAAAC,GAAU,MAAAC,GAAM,WAAAC,GAAW,GAAGC,MAAcJ,GAE9CK,IAAYC,EAAmB,iBAAiB,GAChDC,IAAiBD,EAAmBH,IAAY,QAAQA,CAAS,KAAK,EAAE;AAK9E,SAAO;AAAA,IACL,YALgBK,EAAW,GAAGH,CAAS,IAAIH,CAAI,IAAID,CAAQ,IAAI;AAAA,MAC/D,CAACM,CAAc,GAAG,CAAC,CAACJ;AAAA,IAAA,CACrB;AAAA,IAIC,OAAOC;AAAA,EAAA;AAEX;"}

package/dist/components/Text.d.ts

@@ -1,2 +1,2 @@
-export * from './Text/index'
+export * from '../src/components/Text/index'
 export {}

package/dist/components/TextArea/TextArea.cjs

@@ -1,2 +1,2 @@
-"use strict";"use client";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const d=require("react/jsx-runtime"),s=require("react"),g=require("../TextFieldBase/TextFieldBase.cjs"),p=require("./useAdjustHeight.cjs"),x=(n,u)=>{const{onInput:r,isAutoResizing:i,autoResizingMaxHeight:o=400,...a}=n,t=s.useRef(u),{adjustHeightOnAutoresize:c,onInput:l}=p.useAdjustHeight({elementReference:t,onInput:r,isAutoResizing:i,maxHeight:o});return d.jsx(g.default,{isMultiline:!0,ref:t,onInput:l,onFocus:c,...a})},e=s.forwardRef(x);e.spiritComponent="TextArea";e.displayName="TextArea";exports.default=e;
+"use strict";"use client";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const S=require("react/jsx-runtime"),r=require("react"),j=require("../../common/utilities/warning.cjs"),f=require("../../utils/string.cjs"),V=require("../CharacterCounter/useCharacterCounterState.cjs"),_=require("../TextFieldBase/TextFieldBase.cjs"),b=require("./constants.cjs"),E=require("./useAdjustHeight.cjs"),I=(e,a)=>e===!0||a!==void 0,w=e=>e===void 0?b.TEXTAREA_MAX_SAFE_LENGTH:e,F=(e,a)=>{const{onInput:x,isAutoResizing:m,autoResizingMaxHeight:v=400,counterThreshold:t,hasCounter:u,onChange:s,value:i,defaultValue:l,helperText:T,isDisabled:A,id:p,...n}=e,c=r.useRef(a),{adjustHeightOnAutoresize:C,onInput:L}=E.useAdjustHeight({elementReference:c,onInput:x,isAutoResizing:m,maxHeight:v}),R=f.normalizeStringValue(i),q=f.normalizeStringValue(l),{counterProps:H,handleChange:z}=V.useCharacterCounterState({value:R,defaultValue:q,counterThreshold:t,hasCounter:u,onChange:s}),d=I(u,t),h=d?w(n.maxLength):void 0,M=d?z:s,g=r.useRef(!1);return r.useEffect(()=>{t!==void 0&&n.maxLength!==void 0&&n.maxLength<t&&!g.current&&(g.current=!0,j.default(!1,"TextArea: `maxLength` should be greater than or equal to `counterThreshold` to keep visible counter and hard input limit aligned."))},[t,n.maxLength]),S.jsx(_.default,{id:p,isMultiline:!0,ref:c,onInput:L,onFocus:C,onChange:M,value:i,defaultValue:l,helperText:T,isDisabled:A,counterProps:H,...n,...h!==void 0&&{maxLength:h}})},o=r.forwardRef(F);o.spiritComponent="TextArea";o.displayName="TextArea";exports.default=o;
 //# sourceMappingURL=TextArea.cjs.map

package/dist/components/TextArea/TextArea.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"TextArea.cjs","sources":["../../../src/components/TextArea/TextArea.tsx"],"sourcesContent":["'use client';\n\nimport React, { type ForwardedRef, type RefObject, forwardRef, useRef } from 'react';\nimport { type ForwardRefComponent, type SpiritTextAreaProps } from '../../types';\nimport { TextFieldBase } from '../TextFieldBase';\nimport { useAdjustHeight } from './useAdjustHeight';\n\nconst _TextArea = (props: SpiritTextAreaProps, ref: ForwardedRef<HTMLTextAreaElement>): JSX.Element => {\n  const { onInput, isAutoResizing, autoResizingMaxHeight = 400, ...restProps } = props;\n  const elementReference = useRef(ref);\n  const { adjustHeightOnAutoresize, onInput: onInputHandler } = useAdjustHeight({\n    elementReference,\n    onInput,\n    isAutoResizing,\n    maxHeight: autoResizingMaxHeight,\n  });\n\n  return (\n    <TextFieldBase\n      isMultiline\n      ref={elementReference as RefObject<HTMLTextAreaElement>}\n      onInput={onInputHandler}\n      onFocus={adjustHeightOnAutoresize}\n      {...restProps}\n    />\n  );\n};\n\nconst TextArea = forwardRef<HTMLTextAreaElement, SpiritTextAreaProps>(_TextArea) as ForwardRefComponent<\n  HTMLTextAreaElement,\n  SpiritTextAreaProps\n>;\n\nTextArea.spiritComponent = 'TextArea';\nTextArea.displayName = 'TextArea';\n\nexport default TextArea;\n"],"names":["_TextArea","props","ref","onInput","isAutoResizing","autoResizingMaxHeight","restProps","elementReference","useRef","adjustHeightOnAutoresize","onInputHandler","useAdjustHeight","jsx","TextFieldBase","TextArea","forwardRef"],"mappings":"oQAOMA,EAAY,CAACC,EAA4BC,IAAwD,CACrG,KAAM,CAAE,QAAAC,EAAS,eAAAC,EAAgB,sBAAAC,EAAwB,IAAK,GAAGC,GAAcL,EACzEM,EAAmBC,EAAAA,OAAON,CAAG,EAC7B,CAAE,yBAAAO,EAA0B,QAASC,CAAA,EAAmBC,EAAAA,gBAAgB,CAC5E,iBAAAJ,EACA,QAAAJ,EACA,eAAAC,EACA,UAAWC,CAAA,CACZ,EAED,OACEO,EAAAA,IAACC,EAAAA,QAAA,CACC,YAAW,GACX,IAAKN,EACL,QAASG,EACT,QAASD,EACR,GAAGH,CAAA,CAAA,CAGV,EAEMQ,EAAWC,EAAAA,WAAqDf,CAAS,EAK/Ec,EAAS,gBAAkB,WAC3BA,EAAS,YAAc"}
+{"version":3,"file":"TextArea.cjs","sources":["../../../src/components/TextArea/TextArea.tsx"],"sourcesContent":["'use client';\n\nimport React, { type ForwardedRef, type RefObject, forwardRef, useEffect, useRef } from 'react';\nimport { warning } from '../../common/utilities';\nimport { type ForwardRefComponent, type SpiritTextAreaProps } from '../../types';\nimport { normalizeStringValue } from '../../utils';\nimport { useCharacterCounterState } from '../CharacterCounter';\nimport { TextFieldBase } from '../TextFieldBase';\nimport { TEXTAREA_MAX_SAFE_LENGTH } from './constants';\nimport { useAdjustHeight } from './useAdjustHeight';\n\nconst isCounterActive = (hasCounter: boolean | undefined, counterThreshold: number | undefined): boolean =>\n  hasCounter === true || counterThreshold !== undefined;\n\nconst resolveCounterNativeMaxLength = (consumerMaxLength: number | undefined): number =>\n  consumerMaxLength === undefined ? TEXTAREA_MAX_SAFE_LENGTH : consumerMaxLength;\n\nconst _TextArea = (props: SpiritTextAreaProps, ref: ForwardedRef<HTMLTextAreaElement>): JSX.Element => {\n  const {\n    onInput,\n    isAutoResizing,\n    autoResizingMaxHeight = 400,\n    counterThreshold,\n    hasCounter,\n    onChange,\n    value,\n    defaultValue,\n    helperText,\n    isDisabled,\n    id,\n    ...restProps\n  } = props;\n\n  const elementReference = useRef(ref);\n  const { adjustHeightOnAutoresize, onInput: onInputHandler } = useAdjustHeight({\n    elementReference,\n    onInput,\n    isAutoResizing,\n    maxHeight: autoResizingMaxHeight,\n  });\n\n  const normalizedValue = normalizeStringValue(value);\n  const normalizedDefaultValue = normalizeStringValue(defaultValue);\n\n  const { counterProps, handleChange } = useCharacterCounterState({\n    value: normalizedValue,\n    defaultValue: normalizedDefaultValue,\n    counterThreshold,\n    hasCounter,\n    onChange,\n  });\n\n  const counterOn = isCounterActive(hasCounter, counterThreshold);\n  const nativeMaxLength = counterOn ? resolveCounterNativeMaxLength(restProps.maxLength) : undefined;\n  const changeHandler = counterOn ? handleChange : onChange;\n\n  const didWarnMaxLengthLowerThanThresholdRef = useRef(false);\n  useEffect(() => {\n    if (\n      counterThreshold !== undefined &&\n      restProps.maxLength !== undefined &&\n      restProps.maxLength < counterThreshold &&\n      !didWarnMaxLengthLowerThanThresholdRef.current\n    ) {\n      didWarnMaxLengthLowerThanThresholdRef.current = true;\n      warning(\n        false,\n        'TextArea: `maxLength` should be greater than or equal to `counterThreshold` to keep visible counter and hard input limit aligned.',\n      );\n    }\n  }, [counterThreshold, restProps.maxLength]);\n\n  return (\n    <TextFieldBase\n      id={id}\n      isMultiline\n      ref={elementReference as RefObject<HTMLTextAreaElement>}\n      onInput={onInputHandler}\n      onFocus={adjustHeightOnAutoresize}\n      onChange={changeHandler}\n      value={value}\n      defaultValue={defaultValue}\n      helperText={helperText}\n      isDisabled={isDisabled}\n      counterProps={counterProps}\n      {...restProps}\n      {...(nativeMaxLength !== undefined && { maxLength: nativeMaxLength })}\n    />\n  );\n};\n\nconst TextArea = forwardRef<HTMLTextAreaElement, SpiritTextAreaProps>(_TextArea) as ForwardRefComponent<\n  HTMLTextAreaElement,\n  SpiritTextAreaProps\n>;\n\nTextArea.spiritComponent = 'TextArea';\nTextArea.displayName = 'TextArea';\n\nexport default TextArea;\n"],"names":["isCounterActive","hasCounter","counterThreshold","resolveCounterNativeMaxLength","consumerMaxLength","TEXTAREA_MAX_SAFE_LENGTH","_TextArea","props","ref","onInput","isAutoResizing","autoResizingMaxHeight","onChange","value","defaultValue","helperText","isDisabled","id","restProps","elementReference","useRef","adjustHeightOnAutoresize","onInputHandler","useAdjustHeight","normalizedValue","normalizeStringValue","normalizedDefaultValue","counterProps","handleChange","useCharacterCounterState","counterOn","nativeMaxLength","changeHandler","didWarnMaxLengthLowerThanThresholdRef","useEffect","warning","jsx","TextFieldBase","TextArea","forwardRef"],"mappings":"mbAWMA,EAAkB,CAACC,EAAiCC,IACxDD,IAAe,IAAQC,IAAqB,OAExCC,EAAiCC,GACrCA,IAAsB,OAAYC,EAAAA,yBAA2BD,EAEzDE,EAAY,CAACC,EAA4BC,IAAwD,CACrG,KAAM,CACJ,QAAAC,EACA,eAAAC,EACA,sBAAAC,EAAwB,IACxB,iBAAAT,EACA,WAAAD,EACA,SAAAW,EACA,MAAAC,EACA,aAAAC,EACA,WAAAC,EACA,WAAAC,EACA,GAAAC,EACA,GAAGC,CAAA,EACDX,EAEEY,EAAmBC,EAAAA,OAAOZ,CAAG,EAC7B,CAAE,yBAAAa,EAA0B,QAASC,CAAA,EAAmBC,EAAAA,gBAAgB,CAC5E,iBAAAJ,EACA,QAAAV,EACA,eAAAC,EACA,UAAWC,CAAA,CACZ,EAEKa,EAAkBC,EAAAA,qBAAqBZ,CAAK,EAC5Ca,EAAyBD,EAAAA,qBAAqBX,CAAY,EAE1D,CAAE,aAAAa,EAAc,aAAAC,CAAA,EAAiBC,2BAAyB,CAC9D,MAAOL,EACP,aAAcE,EACd,iBAAAxB,EACA,WAAAD,EACA,SAAAW,CAAA,CACD,EAEKkB,EAAY9B,EAAgBC,EAAYC,CAAgB,EACxD6B,EAAkBD,EAAY3B,EAA8Be,EAAU,SAAS,EAAI,OACnFc,EAAgBF,EAAYF,EAAehB,EAE3CqB,EAAwCb,EAAAA,OAAO,EAAK,EAC1Dc,OAAAA,EAAAA,UAAU,IAAM,CAEZhC,IAAqB,QACrBgB,EAAU,YAAc,QACxBA,EAAU,UAAYhB,GACtB,CAAC+B,EAAsC,UAEvCA,EAAsC,QAAU,GAChDE,EAAAA,QACE,GACA,mIAAA,EAGN,EAAG,CAACjC,EAAkBgB,EAAU,SAAS,CAAC,EAGxCkB,EAAAA,IAACC,EAAAA,QAAA,CACC,GAAApB,EACA,YAAW,GACX,IAAKE,EACL,QAASG,EACT,QAASD,EACT,SAAUW,EACV,MAAAnB,EACA,aAAAC,EACA,WAAAC,EACA,WAAAC,EACA,aAAAW,EACC,GAAGT,EACH,GAAIa,IAAoB,QAAa,CAAE,UAAWA,CAAA,CAAgB,CAAA,CAGzE,EAEMO,EAAWC,EAAAA,WAAqDjC,CAAS,EAK/EgC,EAAS,gBAAkB,WAC3BA,EAAS,YAAc"}

package/dist/components/TextArea/TextArea.js

@@ -1,29 +1,65 @@
 "use client";
-import { jsx as m } from "react/jsx-runtime";
-import { forwardRef as f, useRef as c } from "react";
-import x from "../TextFieldBase/TextFieldBase.js";
-import { useAdjustHeight as l } from "./useAdjustHeight.js";
-const d = (o, r) => {
-  const { onInput: n, isAutoResizing: s, autoResizingMaxHeight: i = 400, ...u } = o, e = c(r), { adjustHeightOnAutoresize: a, onInput: p } = l({
-    elementReference: e,
-    onInput: n,
-    isAutoResizing: s,
-    maxHeight: i
-  });
-  return /* @__PURE__ */ m(
-    x,
+import { jsx as V } from "react/jsx-runtime";
+import { forwardRef as I, useRef as m, useEffect as _ } from "react";
+import b from "../../common/utilities/warning.js";
+import { normalizeStringValue as c } from "../../utils/string.js";
+import { useCharacterCounterState as j } from "../CharacterCounter/useCharacterCounterState.js";
+import w from "../TextFieldBase/TextFieldBase.js";
+import { TEXTAREA_MAX_SAFE_LENGTH as F } from "./constants.js";
+import { useAdjustHeight as N } from "./useAdjustHeight.js";
+const S = (e, o) => e === !0 || o !== void 0, D = (e) => e === void 0 ? F : e, O = (e, o) => {
+  const {
+    onInput: g,
+    isAutoResizing: p,
+    autoResizingMaxHeight: x = 400,
+    counterThreshold: t,
+    hasCounter: r,
+    onChange: a,
+    value: i,
+    defaultValue: s,
+    helperText: T,
+    isDisabled: v,
+    id: A,
+    ...n
+  } = e, u = m(o), { adjustHeightOnAutoresize: L, onInput: C } = N({
+    elementReference: u,
+    onInput: g,
+    isAutoResizing: p,
+    maxHeight: x
+  }), H = c(i), R = c(s), { counterProps: z, handleChange: E } = j({
+    value: H,
+    defaultValue: R,
+    counterThreshold: t,
+    hasCounter: r,
+    onChange: a
+  }), l = S(r, t), d = l ? D(n.maxLength) : void 0, M = l ? E : a, h = m(!1);
+  return _(() => {
+    t !== void 0 && n.maxLength !== void 0 && n.maxLength < t && !h.current && (h.current = !0, b(
+      !1,
+      "TextArea: `maxLength` should be greater than or equal to `counterThreshold` to keep visible counter and hard input limit aligned."
+    ));
+  }, [t, n.maxLength]), /* @__PURE__ */ V(
+    w,
     {
+      id: A,
       isMultiline: !0,
-      ref: e,
-      onInput: p,
-      onFocus: a,
-      ...u
+      ref: u,
+      onInput: C,
+      onFocus: L,
+      onChange: M,
+      value: i,
+      defaultValue: s,
+      helperText: T,
+      isDisabled: v,
+      counterProps: z,
+      ...n,
+      ...d !== void 0 && { maxLength: d }
     }
   );
-}, t = f(d);
-t.spiritComponent = "TextArea";
-t.displayName = "TextArea";
+}, f = I(O);
+f.spiritComponent = "TextArea";
+f.displayName = "TextArea";
 export {
-  t as default
+  f as default
 };
 //# sourceMappingURL=TextArea.js.map

package/dist/components/TextArea/TextArea.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextArea.js","sources":["../../../src/components/TextArea/TextArea.tsx"],"sourcesContent":["'use client';\n\nimport React, { type ForwardedRef, type RefObject, forwardRef, useRef } from 'react';\nimport { type ForwardRefComponent, type SpiritTextAreaProps } from '../../types';\nimport { TextFieldBase } from '../TextFieldBase';\nimport { useAdjustHeight } from './useAdjustHeight';\n\nconst _TextArea = (props: SpiritTextAreaProps, ref: ForwardedRef<HTMLTextAreaElement>): JSX.Element => {\n  const { onInput, isAutoResizing, autoResizingMaxHeight = 400, ...restProps } = props;\n  const elementReference = useRef(ref);\n  const { adjustHeightOnAutoresize, onInput: onInputHandler } = useAdjustHeight({\n    elementReference,\n    onInput,\n    isAutoResizing,\n    maxHeight: autoResizingMaxHeight,\n  });\n\n  return (\n    <TextFieldBase\n      isMultiline\n      ref={elementReference as RefObject<HTMLTextAreaElement>}\n      onInput={onInputHandler}\n      onFocus={adjustHeightOnAutoresize}\n      {...restProps}\n    />\n  );\n};\n\nconst TextArea = forwardRef<HTMLTextAreaElement, SpiritTextAreaProps>(_TextArea) as ForwardRefComponent<\n  HTMLTextAreaElement,\n  SpiritTextAreaProps\n>;\n\nTextArea.spiritComponent = 'TextArea';\nTextArea.displayName = 'TextArea';\n\nexport default TextArea;\n"],"names":["_TextArea","props","ref","onInput","isAutoResizing","autoResizingMaxHeight","restProps","elementReference","useRef","adjustHeightOnAutoresize","onInputHandler","useAdjustHeight","jsx","TextFieldBase","TextArea","forwardRef"],"mappings":";;;;;AAOA,MAAMA,IAAY,CAACC,GAA4BC,MAAwD;AACrG,QAAM,EAAE,SAAAC,GAAS,gBAAAC,GAAgB,uBAAAC,IAAwB,KAAK,GAAGC,MAAcL,GACzEM,IAAmBC,EAAON,CAAG,GAC7B,EAAE,0BAAAO,GAA0B,SAASC,EAAA,IAAmBC,EAAgB;AAAA,IAC5E,kBAAAJ;AAAA,IACA,SAAAJ;AAAA,IACA,gBAAAC;AAAA,IACA,WAAWC;AAAA,EAAA,CACZ;AAED,SACE,gBAAAO;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,aAAW;AAAA,MACX,KAAKN;AAAA,MACL,SAASG;AAAA,MACT,SAASD;AAAA,MACR,GAAGH;AAAA,IAAA;AAAA,EAAA;AAGV,GAEMQ,IAAWC,EAAqDf,CAAS;AAK/Ec,EAAS,kBAAkB;AAC3BA,EAAS,cAAc;"}
+{"version":3,"file":"TextArea.js","sources":["../../../src/components/TextArea/TextArea.tsx"],"sourcesContent":["'use client';\n\nimport React, { type ForwardedRef, type RefObject, forwardRef, useEffect, useRef } from 'react';\nimport { warning } from '../../common/utilities';\nimport { type ForwardRefComponent, type SpiritTextAreaProps } from '../../types';\nimport { normalizeStringValue } from '../../utils';\nimport { useCharacterCounterState } from '../CharacterCounter';\nimport { TextFieldBase } from '../TextFieldBase';\nimport { TEXTAREA_MAX_SAFE_LENGTH } from './constants';\nimport { useAdjustHeight } from './useAdjustHeight';\n\nconst isCounterActive = (hasCounter: boolean | undefined, counterThreshold: number | undefined): boolean =>\n  hasCounter === true || counterThreshold !== undefined;\n\nconst resolveCounterNativeMaxLength = (consumerMaxLength: number | undefined): number =>\n  consumerMaxLength === undefined ? TEXTAREA_MAX_SAFE_LENGTH : consumerMaxLength;\n\nconst _TextArea = (props: SpiritTextAreaProps, ref: ForwardedRef<HTMLTextAreaElement>): JSX.Element => {\n  const {\n    onInput,\n    isAutoResizing,\n    autoResizingMaxHeight = 400,\n    counterThreshold,\n    hasCounter,\n    onChange,\n    value,\n    defaultValue,\n    helperText,\n    isDisabled,\n    id,\n    ...restProps\n  } = props;\n\n  const elementReference = useRef(ref);\n  const { adjustHeightOnAutoresize, onInput: onInputHandler } = useAdjustHeight({\n    elementReference,\n    onInput,\n    isAutoResizing,\n    maxHeight: autoResizingMaxHeight,\n  });\n\n  const normalizedValue = normalizeStringValue(value);\n  const normalizedDefaultValue = normalizeStringValue(defaultValue);\n\n  const { counterProps, handleChange } = useCharacterCounterState({\n    value: normalizedValue,\n    defaultValue: normalizedDefaultValue,\n    counterThreshold,\n    hasCounter,\n    onChange,\n  });\n\n  const counterOn = isCounterActive(hasCounter, counterThreshold);\n  const nativeMaxLength = counterOn ? resolveCounterNativeMaxLength(restProps.maxLength) : undefined;\n  const changeHandler = counterOn ? handleChange : onChange;\n\n  const didWarnMaxLengthLowerThanThresholdRef = useRef(false);\n  useEffect(() => {\n    if (\n      counterThreshold !== undefined &&\n      restProps.maxLength !== undefined &&\n      restProps.maxLength < counterThreshold &&\n      !didWarnMaxLengthLowerThanThresholdRef.current\n    ) {\n      didWarnMaxLengthLowerThanThresholdRef.current = true;\n      warning(\n        false,\n        'TextArea: `maxLength` should be greater than or equal to `counterThreshold` to keep visible counter and hard input limit aligned.',\n      );\n    }\n  }, [counterThreshold, restProps.maxLength]);\n\n  return (\n    <TextFieldBase\n      id={id}\n      isMultiline\n      ref={elementReference as RefObject<HTMLTextAreaElement>}\n      onInput={onInputHandler}\n      onFocus={adjustHeightOnAutoresize}\n      onChange={changeHandler}\n      value={value}\n      defaultValue={defaultValue}\n      helperText={helperText}\n      isDisabled={isDisabled}\n      counterProps={counterProps}\n      {...restProps}\n      {...(nativeMaxLength !== undefined && { maxLength: nativeMaxLength })}\n    />\n  );\n};\n\nconst TextArea = forwardRef<HTMLTextAreaElement, SpiritTextAreaProps>(_TextArea) as ForwardRefComponent<\n  HTMLTextAreaElement,\n  SpiritTextAreaProps\n>;\n\nTextArea.spiritComponent = 'TextArea';\nTextArea.displayName = 'TextArea';\n\nexport default TextArea;\n"],"names":["isCounterActive","hasCounter","counterThreshold","resolveCounterNativeMaxLength","consumerMaxLength","TEXTAREA_MAX_SAFE_LENGTH","_TextArea","props","ref","onInput","isAutoResizing","autoResizingMaxHeight","onChange","value","defaultValue","helperText","isDisabled","id","restProps","elementReference","useRef","adjustHeightOnAutoresize","onInputHandler","useAdjustHeight","normalizedValue","normalizeStringValue","normalizedDefaultValue","counterProps","handleChange","useCharacterCounterState","counterOn","nativeMaxLength","changeHandler","didWarnMaxLengthLowerThanThresholdRef","useEffect","warning","jsx","TextFieldBase","TextArea","forwardRef"],"mappings":";;;;;;;;;AAWA,MAAMA,IAAkB,CAACC,GAAiCC,MACxDD,MAAe,MAAQC,MAAqB,QAExCC,IAAgC,CAACC,MACrCA,MAAsB,SAAYC,IAA2BD,GAEzDE,IAAY,CAACC,GAA4BC,MAAwD;AACrG,QAAM;AAAA,IACJ,SAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,uBAAAC,IAAwB;AAAA,IACxB,kBAAAT;AAAA,IACA,YAAAD;AAAA,IACA,UAAAW;AAAA,IACA,OAAAC;AAAA,IACA,cAAAC;AAAA,IACA,YAAAC;AAAA,IACA,YAAAC;AAAA,IACA,IAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,IACDX,GAEEY,IAAmBC,EAAOZ,CAAG,GAC7B,EAAE,0BAAAa,GAA0B,SAASC,EAAA,IAAmBC,EAAgB;AAAA,IAC5E,kBAAAJ;AAAA,IACA,SAAAV;AAAA,IACA,gBAAAC;AAAA,IACA,WAAWC;AAAA,EAAA,CACZ,GAEKa,IAAkBC,EAAqBZ,CAAK,GAC5Ca,IAAyBD,EAAqBX,CAAY,GAE1D,EAAE,cAAAa,GAAc,cAAAC,EAAA,IAAiBC,EAAyB;AAAA,IAC9D,OAAOL;AAAA,IACP,cAAcE;AAAA,IACd,kBAAAxB;AAAA,IACA,YAAAD;AAAA,IACA,UAAAW;AAAA,EAAA,CACD,GAEKkB,IAAY9B,EAAgBC,GAAYC,CAAgB,GACxD6B,IAAkBD,IAAY3B,EAA8Be,EAAU,SAAS,IAAI,QACnFc,IAAgBF,IAAYF,IAAehB,GAE3CqB,IAAwCb,EAAO,EAAK;AAC1D,SAAAc,EAAU,MAAM;AACd,IACEhC,MAAqB,UACrBgB,EAAU,cAAc,UACxBA,EAAU,YAAYhB,KACtB,CAAC+B,EAAsC,YAEvCA,EAAsC,UAAU,IAChDE;AAAA,MACE;AAAA,MACA;AAAA,IAAA;AAAA,EAGN,GAAG,CAACjC,GAAkBgB,EAAU,SAAS,CAAC,GAGxC,gBAAAkB;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,IAAApB;AAAA,MACA,aAAW;AAAA,MACX,KAAKE;AAAA,MACL,SAASG;AAAA,MACT,SAASD;AAAA,MACT,UAAUW;AAAA,MACV,OAAAnB;AAAA,MACA,cAAAC;AAAA,MACA,YAAAC;AAAA,MACA,YAAAC;AAAA,MACA,cAAAW;AAAA,MACC,GAAGT;AAAA,MACH,GAAIa,MAAoB,UAAa,EAAE,WAAWA,EAAA;AAAA,IAAgB;AAAA,EAAA;AAGzE,GAEMO,IAAWC,EAAqDjC,CAAS;AAK/EgC,EAAS,kBAAkB;AAC3BA,EAAS,cAAc;"}

package/dist/components/TextArea/constants.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=1e4;exports.TEXTAREA_MAX_SAFE_LENGTH=e;
+//# sourceMappingURL=constants.cjs.map

package/dist/components/TextArea/constants.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.cjs","sources":["../../../src/components/TextArea/constants.ts"],"sourcesContent":["// Default/fallback native maxLength when the character counter is enabled and no consumer maxLength is provided.\n// Helps prevent pathological input length in the browser without capping explicit consumer-provided maxLength values.\nexport const TEXTAREA_MAX_SAFE_LENGTH = 10000;\n"],"names":["TEXTAREA_MAX_SAFE_LENGTH"],"mappings":"gFAEO,MAAMA,EAA2B"}

package/dist/components/TextArea/constants.js

@@ -0,0 +1,5 @@
+const t = 1e4;
+export {
+  t as TEXTAREA_MAX_SAFE_LENGTH
+};
+//# sourceMappingURL=constants.js.map

package/dist/components/TextArea/constants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.js","sources":["../../../src/components/TextArea/constants.ts"],"sourcesContent":["// Default/fallback native maxLength when the character counter is enabled and no consumer maxLength is provided.\n// Helps prevent pathological input length in the browser without capping explicit consumer-provided maxLength values.\nexport const TEXTAREA_MAX_SAFE_LENGTH = 10000;\n"],"names":["TEXTAREA_MAX_SAFE_LENGTH"],"mappings":"AAEO,MAAMA,IAA2B;"}

package/dist/components/TextArea.d.ts

@@ -1,2 +1,2 @@
-export * from './TextArea/index'
+export * from '../src/components/TextArea/index'
 export {}

package/dist/components/TextField.d.ts

@@ -1,2 +1,2 @@
-export * from './TextField/index'
+export * from '../src/components/TextField/index'
 export {}

package/dist/components/TextFieldBase/TextFieldBase.cjs

@@ -1,2 +1,2 @@
-"use strict";"use client";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("react/jsx-runtime"),b=require("classnames"),n=require("react"),h=require("../../constants/dictionaries.cjs"),S=require("../../hooks/styleProps.cjs"),N=require("../../hooks/useAriaDescribedBy.cjs"),_=require("../Field/HelperText.cjs"),g=require("../Field/Label.cjs"),v=require("../Field/useAriaIds.cjs"),A=require("../Field/ValidationText.cjs"),j=require("../Field/useValidationTextRole.cjs"),R=require("./TextFieldBaseInput.cjs"),I=require("./useTextFieldBaseStyleProps.cjs"),w=require("./withPasswordToggle.cjs"),D=n.forwardRef(w.default(R.default)),V=(c,u)=>{const{"aria-describedby":p="",hasValidationIcon:x,helperText:T,id:e,label:q,size:a=h.Sizes.MEDIUM,validationState:t,validationText:o,...y}=c,{classProps:r,props:P}=I.useTextFieldBaseStyleProps({id:e,size:a,validationState:t,...y}),{styleProps:l,props:f}=S.useStyleProps(P),[m,d]=v.default(p),B=N.useAriaDescribedBy(m),F=j.useValidationTextRole({validationState:t,validationText:o});return s.jsxs("div",{...l,className:b(r.root,l.className),children:[s.jsx(g.default,{htmlFor:e,UNSAFE_className:r.label,children:q}),s.jsx(D,{...f,...B,id:e,ref:u,size:a}),s.jsx(_.default,{UNSAFE_className:r.helperText,id:`${e}__helperText`,registerAria:d,helperText:T}),t&&s.jsx(A.default,{UNSAFE_className:r.validationText,elementType:"span",...x&&{hasValidationStateIcon:t},id:`${e}__validationText`,validationText:o,registerAria:d,role:F})]})},i=n.forwardRef(V);i.spiritComponent="TextFieldBase";i.displayName="TextFieldBase";exports.default=i;
+"use strict";"use client";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),j=require("classnames"),x=require("react"),B=require("../../constants/dictionaries.cjs"),_=require("../../hooks/styleProps.cjs"),v=require("../../hooks/useAriaIdRefs.cjs"),A=require("../CharacterCounter/CharacterCounter.cjs"),E=require("../Field/HelperText.cjs"),R=require("../Field/Label.cjs"),w=require("../Field/ValidationText.cjs"),I=require("../Field/useValidationTextRole.cjs"),U=require("../Flex/Flex.cjs"),V=require("./TextFieldBaseInput.cjs"),C=require("./useTextFieldBaseStyleProps.cjs"),D=require("./withPasswordToggle.cjs"),M=x.forwardRef(D.default(V.default)),z=(T,m)=>{const{"aria-describedby":h="",counterProps:i,hasValidationIcon:f,helperText:n,id:t,label:q,size:c=B.Sizes.MEDIUM,validationState:s,validationText:a,...F}=T,{classProps:r,props:P}=C.useTextFieldBaseStyleProps({id:t,size:c,validationState:s,...F}),{styleProps:d,props:g}=_.useStyleProps(P),[y,o]=v.useAriaDescribedBy(h),N=I.useValidationTextRole({validationState:s,validationText:a}),S=n||s&&a,u=e.jsx(E.default,{UNSAFE_className:r.helperText,id:`${t}__helper-text`,registerAria:o,helperText:n}),p=s?e.jsx(w.default,{UNSAFE_className:r.validationText,elementType:"span",...f&&{hasValidationStateIcon:s},id:`${t}__validation-text`,validationText:a,registerAria:o,role:N}):null,b=i?e.jsx(A.default,{...i,id:t,registerAria:o,UNSAFE_className:r.counter}):null;return e.jsxs("div",{...d,className:j(r.root,d.className),children:[e.jsx(R.default,{htmlFor:t,UNSAFE_className:r.label,children:q}),e.jsx(M,{...g,...y,id:t,ref:m,size:c}),i?e.jsxs(U.default,{direction:"horizontal",isWrapping:!1,alignmentX:"space-between",alignmentY:"top",children:[S?e.jsxs("div",{children:[p,u]}):null,b]}):e.jsxs(e.Fragment,{children:[u,p]})]})},l=x.forwardRef(z);l.spiritComponent="TextFieldBase";l.displayName="TextFieldBase";exports.default=l;
 //# sourceMappingURL=TextFieldBase.cjs.map

package/dist/components/TextFieldBase/TextFieldBase.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"TextFieldBase.cjs","sources":["../../../src/components/TextFieldBase/TextFieldBase.tsx"],"sourcesContent":["'use client';\n\nimport classNames from 'classnames';\nimport React, { type ForwardedRef, forwardRef } from 'react';\nimport { Sizes } from '../../constants';\nimport { useAriaDescribedBy, useStyleProps } from '../../hooks';\nimport {\n  type ForwardRefComponent,\n  type SpiritTextFieldBaseProps,\n  type TextFieldBasePasswordToggleProps,\n} from '../../types';\nimport { HelperText, Label, ValidationText, useAriaIds } from '../Field';\nimport { useValidationTextRole } from '../Field/useValidationTextRole';\nimport TextFieldBaseInput from './TextFieldBaseInput';\nimport { useTextFieldBaseStyleProps } from './useTextFieldBaseStyleProps';\nimport withPasswordToggle from './withPasswordToggle';\n\nconst TextFieldBaseInputWithPasswordToggle = forwardRef(\n  withPasswordToggle<TextFieldBasePasswordToggleProps>(TextFieldBaseInput),\n);\n\nconst _TextFieldBase = (props: SpiritTextFieldBaseProps, ref: ForwardedRef<HTMLInputElement | HTMLTextAreaElement>) => {\n  const {\n    'aria-describedby': ariaDescribedBy = '',\n    hasValidationIcon,\n    helperText,\n    id,\n    label,\n    size = Sizes.MEDIUM,\n    validationState,\n    validationText,\n    ...restProps\n  } = props;\n  const { classProps, props: modifiedProps } = useTextFieldBaseStyleProps({\n    id,\n    size,\n    validationState,\n    ...restProps,\n  });\n  const { styleProps, props: otherProps } = useStyleProps(modifiedProps);\n  const [ids, register] = useAriaIds(ariaDescribedBy);\n  const ariaDescribedByProp = useAriaDescribedBy(ids);\n  const validationTextRole = useValidationTextRole({\n    validationState,\n    validationText,\n  });\n\n  return (\n    <div {...styleProps} className={classNames(classProps.root, styleProps.className)}>\n      <Label htmlFor={id} UNSAFE_className={classProps.label}>\n        {label}\n      </Label>\n      <TextFieldBaseInputWithPasswordToggle {...otherProps} {...ariaDescribedByProp} id={id} ref={ref} size={size} />\n      <HelperText\n        UNSAFE_className={classProps.helperText}\n        id={`${id}__helperText`}\n        registerAria={register}\n        helperText={helperText}\n      />\n      {validationState && (\n        <ValidationText\n          UNSAFE_className={classProps.validationText}\n          elementType=\"span\"\n          {...(hasValidationIcon && { hasValidationStateIcon: validationState })}\n          id={`${id}__validationText`}\n          validationText={validationText}\n          registerAria={register}\n          role={validationTextRole}\n        />\n      )}\n    </div>\n  );\n};\n\nconst TextFieldBase = forwardRef<HTMLInputElement | HTMLTextAreaElement, SpiritTextFieldBaseProps>(\n  _TextFieldBase,\n) as ForwardRefComponent<HTMLInputElement | HTMLTextAreaElement, SpiritTextFieldBaseProps>;\n\nTextFieldBase.spiritComponent = 'TextFieldBase';\nTextFieldBase.displayName = 'TextFieldBase';\n\nexport default TextFieldBase;\n"],"names":["TextFieldBaseInputWithPasswordToggle","forwardRef","withPasswordToggle","TextFieldBaseInput","_TextFieldBase","props","ref","ariaDescribedBy","hasValidationIcon","helperText","id","label","size","Sizes","validationState","validationText","restProps","classProps","modifiedProps","useTextFieldBaseStyleProps","styleProps","otherProps","useStyleProps","ids","register","useAriaIds","ariaDescribedByProp","useAriaDescribedBy","validationTextRole","useValidationTextRole","jsxs","classNames","jsx","Label","HelperText","ValidationText","TextFieldBase"],"mappings":"4oBAiBMA,EAAuCC,EAAAA,WAC3CC,EAAAA,QAAqDC,EAAAA,OAAkB,CACzE,EAEMC,EAAiB,CAACC,EAAiCC,IAA8D,CACrH,KAAM,CACJ,mBAAoBC,EAAkB,GACtC,kBAAAC,EACA,WAAAC,EACA,GAAAC,EACA,MAAAC,EACA,KAAAC,EAAOC,EAAAA,MAAM,OACb,gBAAAC,EACA,eAAAC,EACA,GAAGC,CAAA,EACDX,EACE,CAAE,WAAAY,EAAY,MAAOC,CAAA,EAAkBC,EAAAA,2BAA2B,CACtE,GAAAT,EACA,KAAAE,EACA,gBAAAE,EACA,GAAGE,CAAA,CACJ,EACK,CAAA,WAAEI,EAAY,MAAOC,CAAA,EAAeC,EAAAA,cAAcJ,CAAa,EAC/D,CAACK,EAAKC,CAAQ,EAAIC,EAAAA,QAAWlB,CAAe,EAC5CmB,EAAsBC,EAAAA,mBAAmBJ,CAAG,EAC5CK,EAAqBC,EAAAA,sBAAsB,CAC/C,gBAAAf,EACA,eAAAC,CAAA,CACD,EAED,OACEe,OAAC,MAAA,CAAK,GAAGV,EAAY,UAAWW,EAAWd,EAAW,KAAMG,EAAW,SAAS,EAC9E,SAAA,CAAAY,MAACC,EAAAA,SAAM,QAASvB,EAAI,iBAAkBO,EAAW,MAC9C,SAAAN,EACH,EACAqB,MAAChC,GAAsC,GAAGqB,EAAa,GAAGK,EAAqB,GAAAhB,EAAQ,IAAAJ,EAAU,KAAAM,EAAY,EAC7GoB,EAAAA,IAACE,EAAAA,QAAA,CACC,iBAAkBjB,EAAW,WAC7B,GAAI,GAAGP,CAAE,eACT,aAAcc,EACd,WAAAf,CAAA,CAAA,EAEDK,GACCkB,EAAAA,IAACG,EAAAA,QAAA,CACC,iBAAkBlB,EAAW,eAC7B,YAAY,OACX,GAAIT,GAAqB,CAAE,uBAAwBM,CAAA,EACpD,GAAI,GAAGJ,CAAE,mBACT,eAAAK,EACA,aAAcS,EACd,KAAMI,CAAA,CAAA,CACR,EAEJ,CAEJ,EAEMQ,EAAgBnC,EAAAA,WACpBG,CACF,EAEAgC,EAAc,gBAAkB,gBAChCA,EAAc,YAAc"}
+{"version":3,"file":"TextFieldBase.cjs","sources":["../../../src/components/TextFieldBase/TextFieldBase.tsx"],"sourcesContent":["'use client';\n\nimport classNames from 'classnames';\nimport React, { type ForwardedRef, forwardRef } from 'react';\nimport { Sizes } from '../../constants';\nimport { useAriaDescribedBy, useStyleProps } from '../../hooks';\nimport {\n  type ForwardRefComponent,\n  type SpiritTextFieldBaseProps,\n  type TextFieldBasePasswordToggleProps,\n} from '../../types';\nimport { CharacterCounter } from '../CharacterCounter';\nimport { HelperText, Label, ValidationText } from '../Field';\nimport { useValidationTextRole } from '../Field/useValidationTextRole';\nimport { Flex } from '../Flex';\nimport TextFieldBaseInput from './TextFieldBaseInput';\nimport { useTextFieldBaseStyleProps } from './useTextFieldBaseStyleProps';\nimport withPasswordToggle from './withPasswordToggle';\n\nconst TextFieldBaseInputWithPasswordToggle = forwardRef(\n  withPasswordToggle<TextFieldBasePasswordToggleProps>(TextFieldBaseInput),\n);\n\nconst _TextFieldBase = (props: SpiritTextFieldBaseProps, ref: ForwardedRef<HTMLInputElement | HTMLTextAreaElement>) => {\n  const {\n    'aria-describedby': ariaDescribedBy = '',\n    counterProps,\n    hasValidationIcon,\n    helperText,\n    id,\n    label,\n    size = Sizes.MEDIUM,\n    validationState,\n    validationText,\n    ...restProps\n  } = props;\n  const { classProps, props: modifiedProps } = useTextFieldBaseStyleProps({\n    id,\n    size,\n    validationState,\n    ...restProps,\n  });\n  const { styleProps, props: otherProps } = useStyleProps(modifiedProps);\n  const [ariaDescribedByProp, register] = useAriaDescribedBy(ariaDescribedBy);\n  const validationTextRole = useValidationTextRole({\n    validationState,\n    validationText,\n  });\n\n  const hasTextContent = helperText || (validationState && validationText);\n\n  const helperTextElement = (\n    <HelperText\n      UNSAFE_className={classProps.helperText}\n      id={`${id}__helper-text`}\n      registerAria={register}\n      helperText={helperText}\n    />\n  );\n\n  const validationTextElement = validationState ? (\n    <ValidationText\n      UNSAFE_className={classProps.validationText}\n      elementType=\"span\"\n      {...(hasValidationIcon && { hasValidationStateIcon: validationState })}\n      id={`${id}__validation-text`}\n      validationText={validationText}\n      registerAria={register}\n      role={validationTextRole}\n    />\n  ) : null;\n\n  const counterElement = counterProps ? (\n    <CharacterCounter {...counterProps} id={id} registerAria={register} UNSAFE_className={classProps.counter} />\n  ) : null;\n\n  return (\n    <div {...styleProps} className={classNames(classProps.root, styleProps.className)}>\n      <Label htmlFor={id} UNSAFE_className={classProps.label}>\n        {label}\n      </Label>\n      <TextFieldBaseInputWithPasswordToggle {...otherProps} {...ariaDescribedByProp} id={id} ref={ref} size={size} />\n      {counterProps ? (\n        <Flex direction=\"horizontal\" isWrapping={false} alignmentX=\"space-between\" alignmentY=\"top\">\n          {hasTextContent ? (\n            <div>\n              {/* In counter layout, put validation first so the status message stays visually closest to the counter row. */}\n              {validationTextElement}\n              {helperTextElement}\n            </div>\n          ) : null}\n          {counterElement}\n        </Flex>\n      ) : (\n        <>\n          {/* Without counter, keep the default field text flow: helper first, then validation. */}\n          {helperTextElement}\n          {validationTextElement}\n        </>\n      )}\n    </div>\n  );\n};\n\nconst TextFieldBase = forwardRef<HTMLInputElement | HTMLTextAreaElement, SpiritTextFieldBaseProps>(\n  _TextFieldBase,\n) as ForwardRefComponent<HTMLInputElement | HTMLTextAreaElement, SpiritTextFieldBaseProps>;\n\nTextFieldBase.spiritComponent = 'TextFieldBase';\nTextFieldBase.displayName = 'TextFieldBase';\n\nexport default TextFieldBase;\n"],"names":["TextFieldBaseInputWithPasswordToggle","forwardRef","withPasswordToggle","TextFieldBaseInput","_TextFieldBase","props","ref","ariaDescribedBy","counterProps","hasValidationIcon","helperText","id","label","size","Sizes","validationState","validationText","restProps","classProps","modifiedProps","useTextFieldBaseStyleProps","styleProps","otherProps","useStyleProps","ariaDescribedByProp","register","useAriaDescribedBy","validationTextRole","useValidationTextRole","hasTextContent","helperTextElement","jsx","HelperText","validationTextElement","ValidationText","counterElement","CharacterCounter","jsxs","classNames","Label","Flex","Fragment","TextFieldBase"],"mappings":"srBAmBMA,EAAuCC,EAAAA,WAC3CC,EAAAA,QAAqDC,EAAAA,OAAkB,CACzE,EAEMC,EAAiB,CAACC,EAAiCC,IAA8D,CACrH,KAAM,CACJ,mBAAoBC,EAAkB,GACtC,aAAAC,EACA,kBAAAC,EACA,WAAAC,EACA,GAAAC,EACA,MAAAC,EACA,KAAAC,EAAOC,EAAAA,MAAM,OACb,gBAAAC,EACA,eAAAC,EACA,GAAGC,CAAA,EACDZ,EACE,CAAE,WAAAa,EAAY,MAAOC,CAAA,EAAkBC,EAAAA,2BAA2B,CACtE,GAAAT,EACA,KAAAE,EACA,gBAAAE,EACA,GAAGE,CAAA,CACJ,EACK,CAAA,WAAEI,EAAY,MAAOC,CAAA,EAAeC,EAAAA,cAAcJ,CAAa,EAC/D,CAACK,EAAqBC,CAAQ,EAAIC,EAAAA,mBAAmBnB,CAAe,EACpEoB,EAAqBC,EAAAA,sBAAsB,CAC/C,gBAAAb,EACA,eAAAC,CAAA,CACD,EAEKa,EAAiBnB,GAAeK,GAAmBC,EAEnDc,EACJC,EAAAA,IAACC,EAAAA,QAAA,CACC,iBAAkBd,EAAW,WAC7B,GAAI,GAAGP,CAAE,gBACT,aAAcc,EACd,WAAAf,CAAA,CAAA,EAIEuB,EAAwBlB,EAC5BgB,EAAAA,IAACG,EAAAA,QAAA,CACC,iBAAkBhB,EAAW,eAC7B,YAAY,OACX,GAAIT,GAAqB,CAAE,uBAAwBM,CAAA,EACpD,GAAI,GAAGJ,CAAE,oBACT,eAAAK,EACA,aAAcS,EACd,KAAME,CAAA,CAAA,EAEN,KAEEQ,EAAiB3B,EACrBuB,EAAAA,IAACK,EAAAA,QAAA,CAAkB,GAAG5B,EAAc,GAAAG,EAAQ,aAAcc,EAAU,iBAAkBP,EAAW,OAAA,CAAS,EACxG,KAEJ,OACEmB,OAAC,MAAA,CAAK,GAAGhB,EAAY,UAAWiB,EAAWpB,EAAW,KAAMG,EAAW,SAAS,EAC9E,SAAA,CAAAU,MAACQ,EAAAA,SAAM,QAAS5B,EAAI,iBAAkBO,EAAW,MAC9C,SAAAN,EACH,EACAmB,MAAC/B,GAAsC,GAAGsB,EAAa,GAAGE,EAAqB,GAAAb,EAAQ,IAAAL,EAAU,KAAAO,EAAY,EAC5GL,EACC6B,EAAAA,KAACG,EAAAA,QAAA,CAAK,UAAU,aAAa,WAAY,GAAO,WAAW,gBAAgB,WAAW,MACnF,SAAA,CAAAX,SACE,MAAA,CAEE,SAAA,CAAAI,EACAH,CAAA,CAAA,CACH,EACE,KACHK,CAAA,CAAA,CACH,EAEAE,EAAAA,KAAAI,EAAAA,SAAA,CAEG,SAAA,CAAAX,EACAG,CAAA,CAAA,CACH,CAAA,EAEJ,CAEJ,EAEMS,EAAgBzC,EAAAA,WACpBG,CACF,EAEAsC,EAAc,gBAAkB,gBAChCA,EAAc,YAAc"}

package/dist/components/TextFieldBase/TextFieldBase.js

@@ -1,71 +1,81 @@
 "use client";
-import { jsxs as y, jsx as o } from "react/jsx-runtime";
-import b from "classnames";
-import { forwardRef as m } from "react";
-import { Sizes as S } from "../../constants/dictionaries.js";
-import { useStyleProps as _ } from "../../hooks/styleProps.js";
-import { useAriaDescribedBy as g } from "../../hooks/useAriaDescribedBy.js";
-import A from "../Field/HelperText.js";
-import v from "../Field/Label.js";
-import I from "../Field/useAriaIds.js";
-import w from "../Field/ValidationText.js";
-import { useValidationTextRole as D } from "../Field/useValidationTextRole.js";
-import E from "./TextFieldBaseInput.js";
-import { useTextFieldBaseStyleProps as U } from "./useTextFieldBaseStyleProps.js";
-import V from "./withPasswordToggle.js";
-const R = m(
-  V(E)
-), j = (d, n) => {
+import { jsx as o, jsxs as i, Fragment as v } from "react/jsx-runtime";
+import A from "classnames";
+import { forwardRef as x } from "react";
+import { Sizes as E } from "../../constants/dictionaries.js";
+import { useStyleProps as w } from "../../hooks/styleProps.js";
+import { useAriaDescribedBy as I } from "../../hooks/useAriaIdRefs.js";
+import U from "../CharacterCounter/CharacterCounter.js";
+import C from "../Field/HelperText.js";
+import D from "../Field/Label.js";
+import V from "../Field/ValidationText.js";
+import { useValidationTextRole as z } from "../Field/useValidationTextRole.js";
+import R from "../Flex/Flex.js";
+import j from "./TextFieldBaseInput.js";
+import { useTextFieldBaseStyleProps as M } from "./useTextFieldBaseStyleProps.js";
+import W from "./withPasswordToggle.js";
+const $ = x(
+  W(j)
+), H = (f, h) => {
   const {
-    "aria-describedby": c = "",
-    hasValidationIcon: x,
-    helperText: T,
+    "aria-describedby": u = "",
+    counterProps: s,
+    hasValidationIcon: F,
+    helperText: n,
     id: e,
-    label: f,
-    size: s = S.MEDIUM,
+    label: g,
+    size: m = E.MEDIUM,
     validationState: t,
-    validationText: i,
-    ...h
-  } = d, { classProps: r, props: u } = U({
+    validationText: a,
+    ...N
+  } = f, { classProps: r, props: P } = M({
     id: e,
-    size: s,
+    size: m,
     validationState: t,
-    ...h
-  }), { styleProps: a, props: F } = _(u), [B, l] = I(c), N = g(B), P = D({
+    ...N
+  }), { styleProps: p, props: B } = w(P), [b, l] = I(u), y = z({
     validationState: t,
-    validationText: i
-  });
-  return /* @__PURE__ */ y("div", { ...a, className: b(r.root, a.className), children: [
-    /* @__PURE__ */ o(v, { htmlFor: e, UNSAFE_className: r.label, children: f }),
-    /* @__PURE__ */ o(R, { ...F, ...N, id: e, ref: n, size: s }),
-    /* @__PURE__ */ o(
-      A,
-      {
-        UNSAFE_className: r.helperText,
-        id: `${e}__helperText`,
-        registerAria: l,
-        helperText: T
-      }
-    ),
-    t && /* @__PURE__ */ o(
-      w,
-      {
-        UNSAFE_className: r.validationText,
-        elementType: "span",
-        ...x && { hasValidationStateIcon: t },
-        id: `${e}__validationText`,
-        validationText: i,
-        registerAria: l,
-        role: P
-      }
-    )
+    validationText: a
+  }), S = n || t && a, d = /* @__PURE__ */ o(
+    C,
+    {
+      UNSAFE_className: r.helperText,
+      id: `${e}__helper-text`,
+      registerAria: l,
+      helperText: n
+    }
+  ), c = t ? /* @__PURE__ */ o(
+    V,
+    {
+      UNSAFE_className: r.validationText,
+      elementType: "span",
+      ...F && { hasValidationStateIcon: t },
+      id: `${e}__validation-text`,
+      validationText: a,
+      registerAria: l,
+      role: y
+    }
+  ) : null, _ = s ? /* @__PURE__ */ o(U, { ...s, id: e, registerAria: l, UNSAFE_className: r.counter }) : null;
+  return /* @__PURE__ */ i("div", { ...p, className: A(r.root, p.className), children: [
+    /* @__PURE__ */ o(D, { htmlFor: e, UNSAFE_className: r.label, children: g }),
+    /* @__PURE__ */ o($, { ...B, ...b, id: e, ref: h, size: m }),
+    s ? /* @__PURE__ */ i(R, { direction: "horizontal", isWrapping: !1, alignmentX: "space-between", alignmentY: "top", children: [
+      S ? /* @__PURE__ */ i("div", { children: [
+        c,
+        d
+      ] }) : null,
+      _
+    ] }) : /* @__PURE__ */ i(v, { children: [
+      d,
+      c
+    ] })
   ] });
-}, p = m(
-  j
+}, T = x(
+  H
 );
-p.spiritComponent = "TextFieldBase";
-p.displayName = "TextFieldBase";
+T.spiritComponent = "TextFieldBase";
+T.displayName = "TextFieldBase";
 export {
-  p as default
+  T as default
 };
 //# sourceMappingURL=TextFieldBase.js.map

package/dist/components/TextFieldBase/TextFieldBase.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextFieldBase.js","sources":["../../../src/components/TextFieldBase/TextFieldBase.tsx"],"sourcesContent":["'use client';\n\nimport classNames from 'classnames';\nimport React, { type ForwardedRef, forwardRef } from 'react';\nimport { Sizes } from '../../constants';\nimport { useAriaDescribedBy, useStyleProps } from '../../hooks';\nimport {\n  type ForwardRefComponent,\n  type SpiritTextFieldBaseProps,\n  type TextFieldBasePasswordToggleProps,\n} from '../../types';\nimport { HelperText, Label, ValidationText, useAriaIds } from '../Field';\nimport { useValidationTextRole } from '../Field/useValidationTextRole';\nimport TextFieldBaseInput from './TextFieldBaseInput';\nimport { useTextFieldBaseStyleProps } from './useTextFieldBaseStyleProps';\nimport withPasswordToggle from './withPasswordToggle';\n\nconst TextFieldBaseInputWithPasswordToggle = forwardRef(\n  withPasswordToggle<TextFieldBasePasswordToggleProps>(TextFieldBaseInput),\n);\n\nconst _TextFieldBase = (props: SpiritTextFieldBaseProps, ref: ForwardedRef<HTMLInputElement | HTMLTextAreaElement>) => {\n  const {\n    'aria-describedby': ariaDescribedBy = '',\n    hasValidationIcon,\n    helperText,\n    id,\n    label,\n    size = Sizes.MEDIUM,\n    validationState,\n    validationText,\n    ...restProps\n  } = props;\n  const { classProps, props: modifiedProps } = useTextFieldBaseStyleProps({\n    id,\n    size,\n    validationState,\n    ...restProps,\n  });\n  const { styleProps, props: otherProps } = useStyleProps(modifiedProps);\n  const [ids, register] = useAriaIds(ariaDescribedBy);\n  const ariaDescribedByProp = useAriaDescribedBy(ids);\n  const validationTextRole = useValidationTextRole({\n    validationState,\n    validationText,\n  });\n\n  return (\n    <div {...styleProps} className={classNames(classProps.root, styleProps.className)}>\n      <Label htmlFor={id} UNSAFE_className={classProps.label}>\n        {label}\n      </Label>\n      <TextFieldBaseInputWithPasswordToggle {...otherProps} {...ariaDescribedByProp} id={id} ref={ref} size={size} />\n      <HelperText\n        UNSAFE_className={classProps.helperText}\n        id={`${id}__helperText`}\n        registerAria={register}\n        helperText={helperText}\n      />\n      {validationState && (\n        <ValidationText\n          UNSAFE_className={classProps.validationText}\n          elementType=\"span\"\n          {...(hasValidationIcon && { hasValidationStateIcon: validationState })}\n          id={`${id}__validationText`}\n          validationText={validationText}\n          registerAria={register}\n          role={validationTextRole}\n        />\n      )}\n    </div>\n  );\n};\n\nconst TextFieldBase = forwardRef<HTMLInputElement | HTMLTextAreaElement, SpiritTextFieldBaseProps>(\n  _TextFieldBase,\n) as ForwardRefComponent<HTMLInputElement | HTMLTextAreaElement, SpiritTextFieldBaseProps>;\n\nTextFieldBase.spiritComponent = 'TextFieldBase';\nTextFieldBase.displayName = 'TextFieldBase';\n\nexport default TextFieldBase;\n"],"names":["TextFieldBaseInputWithPasswordToggle","forwardRef","withPasswordToggle","TextFieldBaseInput","_TextFieldBase","props","ref","ariaDescribedBy","hasValidationIcon","helperText","id","label","size","Sizes","validationState","validationText","restProps","classProps","modifiedProps","useTextFieldBaseStyleProps","styleProps","otherProps","useStyleProps","ids","register","useAriaIds","ariaDescribedByProp","useAriaDescribedBy","validationTextRole","useValidationTextRole","jsxs","classNames","jsx","Label","HelperText","ValidationText","TextFieldBase"],"mappings":";;;;;;;;;;;;;;;AAiBA,MAAMA,IAAuCC;AAAA,EAC3CC,EAAqDC,CAAkB;AACzE,GAEMC,IAAiB,CAACC,GAAiCC,MAA8D;AACrH,QAAM;AAAA,IACJ,oBAAoBC,IAAkB;AAAA,IACtC,mBAAAC;AAAA,IACA,YAAAC;AAAA,IACA,IAAAC;AAAA,IACA,OAAAC;AAAA,IACA,MAAAC,IAAOC,EAAM;AAAA,IACb,iBAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,IACDX,GACE,EAAE,YAAAY,GAAY,OAAOC,EAAA,IAAkBC,EAA2B;AAAA,IACtE,IAAAT;AAAA,IACA,MAAAE;AAAA,IACA,iBAAAE;AAAA,IACA,GAAGE;AAAA,EAAA,CACJ,GACK,EAAE,YAAAI,GAAY,OAAOC,EAAA,IAAeC,EAAcJ,CAAa,GAC/D,CAACK,GAAKC,CAAQ,IAAIC,EAAWlB,CAAe,GAC5CmB,IAAsBC,EAAmBJ,CAAG,GAC5CK,IAAqBC,EAAsB;AAAA,IAC/C,iBAAAf;AAAA,IACA,gBAAAC;AAAA,EAAA,CACD;AAED,SACE,gBAAAe,EAAC,OAAA,EAAK,GAAGV,GAAY,WAAWW,EAAWd,EAAW,MAAMG,EAAW,SAAS,GAC9E,UAAA;AAAA,IAAA,gBAAAY,EAACC,KAAM,SAASvB,GAAI,kBAAkBO,EAAW,OAC9C,UAAAN,GACH;AAAA,IACA,gBAAAqB,EAAChC,KAAsC,GAAGqB,GAAa,GAAGK,GAAqB,IAAAhB,GAAQ,KAAAJ,GAAU,MAAAM,GAAY;AAAA,IAC7G,gBAAAoB;AAAA,MAACE;AAAA,MAAA;AAAA,QACC,kBAAkBjB,EAAW;AAAA,QAC7B,IAAI,GAAGP,CAAE;AAAA,QACT,cAAcc;AAAA,QACd,YAAAf;AAAA,MAAA;AAAA,IAAA;AAAA,IAEDK,KACC,gBAAAkB;AAAA,MAACG;AAAA,MAAA;AAAA,QACC,kBAAkBlB,EAAW;AAAA,QAC7B,aAAY;AAAA,QACX,GAAIT,KAAqB,EAAE,wBAAwBM,EAAA;AAAA,QACpD,IAAI,GAAGJ,CAAE;AAAA,QACT,gBAAAK;AAAA,QACA,cAAcS;AAAA,QACd,MAAMI;AAAA,MAAA;AAAA,IAAA;AAAA,EACR,GAEJ;AAEJ,GAEMQ,IAAgBnC;AAAA,EACpBG;AACF;AAEAgC,EAAc,kBAAkB;AAChCA,EAAc,cAAc;"}
+{"version":3,"file":"TextFieldBase.js","sources":["../../../src/components/TextFieldBase/TextFieldBase.tsx"],"sourcesContent":["'use client';\n\nimport classNames from 'classnames';\nimport React, { type ForwardedRef, forwardRef } from 'react';\nimport { Sizes } from '../../constants';\nimport { useAriaDescribedBy, useStyleProps } from '../../hooks';\nimport {\n  type ForwardRefComponent,\n  type SpiritTextFieldBaseProps,\n  type TextFieldBasePasswordToggleProps,\n} from '../../types';\nimport { CharacterCounter } from '../CharacterCounter';\nimport { HelperText, Label, ValidationText } from '../Field';\nimport { useValidationTextRole } from '../Field/useValidationTextRole';\nimport { Flex } from '../Flex';\nimport TextFieldBaseInput from './TextFieldBaseInput';\nimport { useTextFieldBaseStyleProps } from './useTextFieldBaseStyleProps';\nimport withPasswordToggle from './withPasswordToggle';\n\nconst TextFieldBaseInputWithPasswordToggle = forwardRef(\n  withPasswordToggle<TextFieldBasePasswordToggleProps>(TextFieldBaseInput),\n);\n\nconst _TextFieldBase = (props: SpiritTextFieldBaseProps, ref: ForwardedRef<HTMLInputElement | HTMLTextAreaElement>) => {\n  const {\n    'aria-describedby': ariaDescribedBy = '',\n    counterProps,\n    hasValidationIcon,\n    helperText,\n    id,\n    label,\n    size = Sizes.MEDIUM,\n    validationState,\n    validationText,\n    ...restProps\n  } = props;\n  const { classProps, props: modifiedProps } = useTextFieldBaseStyleProps({\n    id,\n    size,\n    validationState,\n    ...restProps,\n  });\n  const { styleProps, props: otherProps } = useStyleProps(modifiedProps);\n  const [ariaDescribedByProp, register] = useAriaDescribedBy(ariaDescribedBy);\n  const validationTextRole = useValidationTextRole({\n    validationState,\n    validationText,\n  });\n\n  const hasTextContent = helperText || (validationState && validationText);\n\n  const helperTextElement = (\n    <HelperText\n      UNSAFE_className={classProps.helperText}\n      id={`${id}__helper-text`}\n      registerAria={register}\n      helperText={helperText}\n    />\n  );\n\n  const validationTextElement = validationState ? (\n    <ValidationText\n      UNSAFE_className={classProps.validationText}\n      elementType=\"span\"\n      {...(hasValidationIcon && { hasValidationStateIcon: validationState })}\n      id={`${id}__validation-text`}\n      validationText={validationText}\n      registerAria={register}\n      role={validationTextRole}\n    />\n  ) : null;\n\n  const counterElement = counterProps ? (\n    <CharacterCounter {...counterProps} id={id} registerAria={register} UNSAFE_className={classProps.counter} />\n  ) : null;\n\n  return (\n    <div {...styleProps} className={classNames(classProps.root, styleProps.className)}>\n      <Label htmlFor={id} UNSAFE_className={classProps.label}>\n        {label}\n      </Label>\n      <TextFieldBaseInputWithPasswordToggle {...otherProps} {...ariaDescribedByProp} id={id} ref={ref} size={size} />\n      {counterProps ? (\n        <Flex direction=\"horizontal\" isWrapping={false} alignmentX=\"space-between\" alignmentY=\"top\">\n          {hasTextContent ? (\n            <div>\n              {/* In counter layout, put validation first so the status message stays visually closest to the counter row. */}\n              {validationTextElement}\n              {helperTextElement}\n            </div>\n          ) : null}\n          {counterElement}\n        </Flex>\n      ) : (\n        <>\n          {/* Without counter, keep the default field text flow: helper first, then validation. */}\n          {helperTextElement}\n          {validationTextElement}\n        </>\n      )}\n    </div>\n  );\n};\n\nconst TextFieldBase = forwardRef<HTMLInputElement | HTMLTextAreaElement, SpiritTextFieldBaseProps>(\n  _TextFieldBase,\n) as ForwardRefComponent<HTMLInputElement | HTMLTextAreaElement, SpiritTextFieldBaseProps>;\n\nTextFieldBase.spiritComponent = 'TextFieldBase';\nTextFieldBase.displayName = 'TextFieldBase';\n\nexport default TextFieldBase;\n"],"names":["TextFieldBaseInputWithPasswordToggle","forwardRef","withPasswordToggle","TextFieldBaseInput","_TextFieldBase","props","ref","ariaDescribedBy","counterProps","hasValidationIcon","helperText","id","label","size","Sizes","validationState","validationText","restProps","classProps","modifiedProps","useTextFieldBaseStyleProps","styleProps","otherProps","useStyleProps","ariaDescribedByProp","register","useAriaDescribedBy","validationTextRole","useValidationTextRole","hasTextContent","helperTextElement","jsx","HelperText","validationTextElement","ValidationText","counterElement","CharacterCounter","jsxs","classNames","Label","Flex","Fragment","TextFieldBase"],"mappings":";;;;;;;;;;;;;;;;AAmBA,MAAMA,IAAuCC;AAAA,EAC3CC,EAAqDC,CAAkB;AACzE,GAEMC,IAAiB,CAACC,GAAiCC,MAA8D;AACrH,QAAM;AAAA,IACJ,oBAAoBC,IAAkB;AAAA,IACtC,cAAAC;AAAA,IACA,mBAAAC;AAAA,IACA,YAAAC;AAAA,IACA,IAAAC;AAAA,IACA,OAAAC;AAAA,IACA,MAAAC,IAAOC,EAAM;AAAA,IACb,iBAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,IACDZ,GACE,EAAE,YAAAa,GAAY,OAAOC,EAAA,IAAkBC,EAA2B;AAAA,IACtE,IAAAT;AAAA,IACA,MAAAE;AAAA,IACA,iBAAAE;AAAA,IACA,GAAGE;AAAA,EAAA,CACJ,GACK,EAAE,YAAAI,GAAY,OAAOC,EAAA,IAAeC,EAAcJ,CAAa,GAC/D,CAACK,GAAqBC,CAAQ,IAAIC,EAAmBnB,CAAe,GACpEoB,IAAqBC,EAAsB;AAAA,IAC/C,iBAAAb;AAAA,IACA,gBAAAC;AAAA,EAAA,CACD,GAEKa,IAAiBnB,KAAeK,KAAmBC,GAEnDc,IACJ,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,kBAAkBd,EAAW;AAAA,MAC7B,IAAI,GAAGP,CAAE;AAAA,MACT,cAAcc;AAAA,MACd,YAAAf;AAAA,IAAA;AAAA,EAAA,GAIEuB,IAAwBlB,IAC5B,gBAAAgB;AAAA,IAACG;AAAA,IAAA;AAAA,MACC,kBAAkBhB,EAAW;AAAA,MAC7B,aAAY;AAAA,MACX,GAAIT,KAAqB,EAAE,wBAAwBM,EAAA;AAAA,MACpD,IAAI,GAAGJ,CAAE;AAAA,MACT,gBAAAK;AAAA,MACA,cAAcS;AAAA,MACd,MAAME;AAAA,IAAA;AAAA,EAAA,IAEN,MAEEQ,IAAiB3B,IACrB,gBAAAuB,EAACK,GAAA,EAAkB,GAAG5B,GAAc,IAAAG,GAAQ,cAAcc,GAAU,kBAAkBP,EAAW,QAAA,CAAS,IACxG;AAEJ,SACE,gBAAAmB,EAAC,OAAA,EAAK,GAAGhB,GAAY,WAAWiB,EAAWpB,EAAW,MAAMG,EAAW,SAAS,GAC9E,UAAA;AAAA,IAAA,gBAAAU,EAACQ,KAAM,SAAS5B,GAAI,kBAAkBO,EAAW,OAC9C,UAAAN,GACH;AAAA,IACA,gBAAAmB,EAAC/B,KAAsC,GAAGsB,GAAa,GAAGE,GAAqB,IAAAb,GAAQ,KAAAL,GAAU,MAAAO,GAAY;AAAA,IAC5GL,IACC,gBAAA6B,EAACG,GAAA,EAAK,WAAU,cAAa,YAAY,IAAO,YAAW,iBAAgB,YAAW,OACnF,UAAA;AAAA,MAAAX,sBACE,OAAA,EAEE,UAAA;AAAA,QAAAI;AAAA,QACAH;AAAA,MAAA,EAAA,CACH,IACE;AAAA,MACHK;AAAA,IAAA,EAAA,CACH,IAEA,gBAAAE,EAAAI,GAAA,EAEG,UAAA;AAAA,MAAAX;AAAA,MACAG;AAAA,IAAA,EAAA,CACH;AAAA,EAAA,GAEJ;AAEJ,GAEMS,IAAgBzC;AAAA,EACpBG;AACF;AAEAsC,EAAc,kBAAkB;AAChCA,EAAc,cAAc;"}

package/dist/components/TextFieldBase/useTextFieldBaseInputStyleProps.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"useTextFieldBaseInputStyleProps.cjs","sources":["../../../src/components/TextFieldBase/useTextFieldBaseInputStyleProps.ts"],"sourcesContent":["import { useClassNamePrefix } from '../../hooks';\nimport { type SpiritTextFieldBaseInputProps, type TextFieldBaseProps } from '../../types';\n\nexport interface TextFieldBaseInputStyles {\n  /** className props */\n  classProps: {\n    input: string;\n  };\n  /** props to be passed to the input element */\n  props: TextFieldBaseProps;\n}\n\nexport function useTextFieldBaseInputStyleProps(props: SpiritTextFieldBaseInputProps): TextFieldBaseInputStyles {\n  const { isMultiline, id, ...restProps } = props;\n\n  const TextFieldBaseClass = useClassNamePrefix(isMultiline ? 'TextArea' : 'TextField');\n  const TextFieldBaseInputClass = `${TextFieldBaseClass}__input`;\n\n  return {\n    classProps: {\n      input: TextFieldBaseInputClass,\n    },\n    props: {\n      ...restProps,\n      isMultiline,\n      id,\n    },\n  };\n}\n"],"names":["useTextFieldBaseInputStyleProps","props","isMultiline","id","restProps","useClassNamePrefix"],"mappings":"sIAYO,SAASA,EAAgCC,EAAgE,CAC9G,KAAM,CAAE,YAAAC,EAAa,GAAAC,EAAI,GAAGC,GAAcH,EAK1C,MAAO,CACL,WAAY,CACV,MAJ4B,GADLI,EAAAA,mBAAmBH,EAAc,WAAa,WAAW,CAC/B,SAI1C,EAET,MAAO,CACL,GAAGE,EACH,YAAAF,EACA,GAAAC,CAAA,CACF,CAEJ"}
+{"version":3,"file":"useTextFieldBaseInputStyleProps.cjs","sources":["../../../src/components/TextFieldBase/useTextFieldBaseInputStyleProps.ts"],"sourcesContent":["import { useClassNamePrefix } from '../../hooks';\nimport { type RequiredProps, type TextFieldBaseInputProps, type TextFieldBaseProps } from '../../types';\n\nexport interface TextFieldBaseInputStyles {\n  /** className props */\n  classProps: {\n    input: string;\n  };\n  /** props to be passed to the input element */\n  props: TextFieldBaseProps;\n}\n\nexport function useTextFieldBaseInputStyleProps(\n  props: RequiredProps & TextFieldBaseInputProps,\n): TextFieldBaseInputStyles {\n  const { isMultiline, id, ...restProps } = props;\n\n  const TextFieldBaseClass = useClassNamePrefix(isMultiline ? 'TextArea' : 'TextField');\n  const TextFieldBaseInputClass = `${TextFieldBaseClass}__input`;\n\n  return {\n    classProps: {\n      input: TextFieldBaseInputClass,\n    },\n    props: {\n      ...restProps,\n      isMultiline,\n      id,\n    },\n  };\n}\n"],"names":["useTextFieldBaseInputStyleProps","props","isMultiline","id","restProps","useClassNamePrefix"],"mappings":"sIAYO,SAASA,EACdC,EAC0B,CAC1B,KAAM,CAAE,YAAAC,EAAa,GAAAC,EAAI,GAAGC,GAAcH,EAK1C,MAAO,CACL,WAAY,CACV,MAJ4B,GADLI,EAAAA,mBAAmBH,EAAc,WAAa,WAAW,CAC/B,SAI1C,EAET,MAAO,CACL,GAAGE,EACH,YAAAF,EACA,GAAAC,CAAA,CACF,CAEJ"}

package/dist/components/TextFieldBase/useTextFieldBaseInputStyleProps.js.map

@@ -1 +1 @@
-{"version":3,"file":"useTextFieldBaseInputStyleProps.js","sources":["../../../src/components/TextFieldBase/useTextFieldBaseInputStyleProps.ts"],"sourcesContent":["import { useClassNamePrefix } from '../../hooks';\nimport { type SpiritTextFieldBaseInputProps, type TextFieldBaseProps } from '../../types';\n\nexport interface TextFieldBaseInputStyles {\n  /** className props */\n  classProps: {\n    input: string;\n  };\n  /** props to be passed to the input element */\n  props: TextFieldBaseProps;\n}\n\nexport function useTextFieldBaseInputStyleProps(props: SpiritTextFieldBaseInputProps): TextFieldBaseInputStyles {\n  const { isMultiline, id, ...restProps } = props;\n\n  const TextFieldBaseClass = useClassNamePrefix(isMultiline ? 'TextArea' : 'TextField');\n  const TextFieldBaseInputClass = `${TextFieldBaseClass}__input`;\n\n  return {\n    classProps: {\n      input: TextFieldBaseInputClass,\n    },\n    props: {\n      ...restProps,\n      isMultiline,\n      id,\n    },\n  };\n}\n"],"names":["useTextFieldBaseInputStyleProps","props","isMultiline","id","restProps","useClassNamePrefix"],"mappings":";AAYO,SAASA,EAAgCC,GAAgE;AAC9G,QAAM,EAAE,aAAAC,GAAa,IAAAC,GAAI,GAAGC,MAAcH;AAK1C,SAAO;AAAA,IACL,YAAY;AAAA,MACV,OAJ4B,GADLI,EAAmBH,IAAc,aAAa,WAAW,CAC/B;AAAA,IAI1C;AAAA,IAET,OAAO;AAAA,MACL,GAAGE;AAAA,MACH,aAAAF;AAAA,MACA,IAAAC;AAAA,IAAA;AAAA,EACF;AAEJ;"}
+{"version":3,"file":"useTextFieldBaseInputStyleProps.js","sources":["../../../src/components/TextFieldBase/useTextFieldBaseInputStyleProps.ts"],"sourcesContent":["import { useClassNamePrefix } from '../../hooks';\nimport { type RequiredProps, type TextFieldBaseInputProps, type TextFieldBaseProps } from '../../types';\n\nexport interface TextFieldBaseInputStyles {\n  /** className props */\n  classProps: {\n    input: string;\n  };\n  /** props to be passed to the input element */\n  props: TextFieldBaseProps;\n}\n\nexport function useTextFieldBaseInputStyleProps(\n  props: RequiredProps & TextFieldBaseInputProps,\n): TextFieldBaseInputStyles {\n  const { isMultiline, id, ...restProps } = props;\n\n  const TextFieldBaseClass = useClassNamePrefix(isMultiline ? 'TextArea' : 'TextField');\n  const TextFieldBaseInputClass = `${TextFieldBaseClass}__input`;\n\n  return {\n    classProps: {\n      input: TextFieldBaseInputClass,\n    },\n    props: {\n      ...restProps,\n      isMultiline,\n      id,\n    },\n  };\n}\n"],"names":["useTextFieldBaseInputStyleProps","props","isMultiline","id","restProps","useClassNamePrefix"],"mappings":";AAYO,SAASA,EACdC,GAC0B;AAC1B,QAAM,EAAE,aAAAC,GAAa,IAAAC,GAAI,GAAGC,MAAcH;AAK1C,SAAO;AAAA,IACL,YAAY;AAAA,MACV,OAJ4B,GADLI,EAAmBH,IAAc,aAAa,WAAW,CAC/B;AAAA,IAI1C;AAAA,IAET,OAAO;AAAA,MACL,GAAGE;AAAA,MACH,aAAAF;AAAA,MACA,IAAAC;AAAA,IAAA;AAAA,EACF;AAEJ;"}

package/dist/components/TextFieldBase/useTextFieldBaseStyleProps.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("classnames"),f=require("../../hooks/useClassNamePrefix.cjs");function q(i){const{isFluid:d,isMultiline:s,isLabelHidden:n,size:l,validationState:t,...a}=i,{isDisabled:r,isRequired:T}=a,e=f.useClassNamePrefix(s?"TextArea":"TextField"),c=`${e}--disabled`,x=`${e}--fluid`,u=`${e}--${l}`,_=`${e}--${t}`,g=`${e}__input`,p=`${e}__label`,F=`${e}__label--required`,B=`${e}__label--hidden`,C=`${e}__validationText`,b=`${e}__passwordToggle`,$=`${e}__passwordToggle__button`,P=`${e}__passwordToggle__icon`,w=`${e}__helperText`,S=o(e,{[c]:r,[x]:d,[_]:t,[u]:l}),y=o(p,{[F]:T,[B]:n});return{classProps:{root:S,label:y,input:g,helperText:w,validationText:C,passwordToggle:b,passwordToggleButton:$,passwordToggleIcon:P},props:{...a,isMultiline:s}}}exports.useTextFieldBaseStyleProps=q;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("classnames"),f=require("../../hooks/useClassNamePrefix.cjs");function q(i){const{isFluid:d,isMultiline:s,isLabelHidden:n,size:t,validationState:l,...a}=i,{isDisabled:r,isRequired:c}=a,e=f.useClassNamePrefix(s?"TextArea":"TextField"),u=`${e}--disabled`,x=`${e}--fluid`,_=`${e}--${t}`,g=`${e}--${l}`,F=`${e}__input`,T=`${e}__label`,p=`${e}__label--required`,B=`${e}__label--hidden`,C=`${e}__validationText`,$=`${e}__passwordToggle`,b=`${e}__passwordToggle__button`,P=`${e}__passwordToggle__icon`,w=`${e}__helperText`,S=`${e}__counter`;return{classProps:{root:o(e,{[u]:r,[x]:d,[g]:l,[_]:t}),label:o(T,{[p]:c,[B]:n}),input:F,helperText:w,validationText:C,passwordToggle:$,passwordToggleButton:b,passwordToggleIcon:P,counter:S},props:{...a,isMultiline:s}}}exports.useTextFieldBaseStyleProps=q;
 //# sourceMappingURL=useTextFieldBaseStyleProps.cjs.map

package/dist/components/TextFieldBase/useTextFieldBaseStyleProps.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"useTextFieldBaseStyleProps.cjs","sources":["../../../src/components/TextFieldBase/useTextFieldBaseStyleProps.ts"],"sourcesContent":["import classNames from 'classnames';\nimport { useClassNamePrefix } from '../../hooks';\nimport { type SpiritTextFieldBaseProps, type TextFieldBaseProps } from '../../types';\n\nexport interface TextFieldBaseStyles {\n  /** className props */\n  classProps: {\n    root: string;\n    label: string;\n    input: string;\n    helperText: string;\n    validationText: string;\n    passwordToggle: string;\n    passwordToggleButton: string;\n    passwordToggleIcon: string;\n  };\n  /** props to be passed to the input element */\n  props: Omit<TextFieldBaseProps, 'label'>;\n}\n\nexport function useTextFieldBaseStyleProps(props: Omit<SpiritTextFieldBaseProps, 'label'>): TextFieldBaseStyles {\n  const { isFluid, isMultiline, isLabelHidden, size, validationState, ...restProps } = props;\n  const { isDisabled, isRequired } = restProps;\n\n  const TextFieldBaseClass = useClassNamePrefix(isMultiline ? 'TextArea' : 'TextField');\n  const TextFieldBaseDisabledClass = `${TextFieldBaseClass}--disabled`;\n  const TextFieldBaseFluidClass = `${TextFieldBaseClass}--fluid`;\n  const TextFieldBaseSizeClass = `${TextFieldBaseClass}--${size}`;\n  const TextFieldBaseValidationClass = `${TextFieldBaseClass}--${validationState}`;\n  const TextFieldBaseInputClass = `${TextFieldBaseClass}__input`;\n  const TextFieldBaseLabelClass = `${TextFieldBaseClass}__label`;\n  const TextFieldBaseLabelRequiredClass = `${TextFieldBaseClass}__label--required`;\n  const TextFieldBaseLabelHiddenClass = `${TextFieldBaseClass}__label--hidden`;\n  const TextFieldBaseValidationTextClass = `${TextFieldBaseClass}__validationText`;\n  const TextFieldBasePasswordToggleClass = `${TextFieldBaseClass}__passwordToggle`;\n  const TextFieldBasePasswordToggleButtonClass = `${TextFieldBaseClass}__passwordToggle__button`;\n  const TextFieldBasePasswordToggleIconClass = `${TextFieldBaseClass}__passwordToggle__icon`;\n  const TextFieldBaseHelperTextClass = `${TextFieldBaseClass}__helperText`;\n\n  const rootStyles = classNames(TextFieldBaseClass, {\n    [TextFieldBaseDisabledClass]: isDisabled,\n    [TextFieldBaseFluidClass]: isFluid,\n    [TextFieldBaseValidationClass]: validationState,\n    [TextFieldBaseSizeClass]: size,\n  });\n  const labelStyles = classNames(TextFieldBaseLabelClass, {\n    [TextFieldBaseLabelRequiredClass]: isRequired,\n    [TextFieldBaseLabelHiddenClass]: isLabelHidden,\n  });\n\n  return {\n    classProps: {\n      root: rootStyles,\n      label: labelStyles,\n      input: TextFieldBaseInputClass,\n      helperText: TextFieldBaseHelperTextClass,\n      validationText: TextFieldBaseValidationTextClass,\n      passwordToggle: TextFieldBasePasswordToggleClass,\n      passwordToggleButton: TextFieldBasePasswordToggleButtonClass,\n      passwordToggleIcon: TextFieldBasePasswordToggleIconClass,\n    },\n    props: {\n      ...restProps,\n      isMultiline,\n    },\n  };\n}\n"],"names":["useTextFieldBaseStyleProps","props","isFluid","isMultiline","isLabelHidden","size","validationState","restProps","isDisabled","isRequired","TextFieldBaseClass","useClassNamePrefix","TextFieldBaseDisabledClass","TextFieldBaseFluidClass","TextFieldBaseSizeClass","TextFieldBaseValidationClass","TextFieldBaseInputClass","TextFieldBaseLabelClass","TextFieldBaseLabelRequiredClass","TextFieldBaseLabelHiddenClass","TextFieldBaseValidationTextClass","TextFieldBasePasswordToggleClass","TextFieldBasePasswordToggleButtonClass","TextFieldBasePasswordToggleIconClass","TextFieldBaseHelperTextClass","rootStyles","classNames","labelStyles"],"mappings":"8JAoBO,SAASA,EAA2BC,EAAqE,CAC9G,KAAM,CAAE,QAAAC,EAAS,YAAAC,EAAa,cAAAC,EAAe,KAAAC,EAAM,gBAAAC,EAAiB,GAAGC,GAAcN,EAC/E,CAAE,WAAAO,EAAY,WAAAC,CAAA,EAAeF,EAE7BG,EAAqBC,EAAAA,mBAAmBR,EAAc,WAAa,WAAW,EAC9ES,EAA6B,GAAGF,CAAkB,aAClDG,EAA0B,GAAGH,CAAkB,UAC/CI,EAAyB,GAAGJ,CAAkB,KAAKL,CAAI,GACvDU,EAA+B,GAAGL,CAAkB,KAAKJ,CAAe,GACxEU,EAA0B,GAAGN,CAAkB,UAC/CO,EAA0B,GAAGP,CAAkB,UAC/CQ,EAAkC,GAAGR,CAAkB,oBACvDS,EAAgC,GAAGT,CAAkB,kBACrDU,EAAmC,GAAGV,CAAkB,mBACxDW,EAAmC,GAAGX,CAAkB,mBACxDY,EAAyC,GAAGZ,CAAkB,2BAC9Da,EAAuC,GAAGb,CAAkB,yBAC5Dc,EAA+B,GAAGd,CAAkB,eAEpDe,EAAaC,EAAWhB,EAAoB,CAChD,CAACE,CAA0B,EAAGJ,EAC9B,CAACK,CAAuB,EAAGX,EAC3B,CAACa,CAA4B,EAAGT,EAChC,CAACQ,CAAsB,EAAGT,CAAA,CAC3B,EACKsB,EAAcD,EAAWT,EAAyB,CACtD,CAACC,CAA+B,EAAGT,EACnC,CAACU,CAA6B,EAAGf,CAAA,CAClC,EAED,MAAO,CACL,WAAY,CACV,KAAMqB,EACN,MAAOE,EACP,MAAOX,EACP,WAAYQ,EACZ,eAAgBJ,EAChB,eAAgBC,EAChB,qBAAsBC,EACtB,mBAAoBC,CAAA,EAEtB,MAAO,CACL,GAAGhB,EACH,YAAAJ,CAAA,CACF,CAEJ"}
+{"version":3,"file":"useTextFieldBaseStyleProps.cjs","sources":["../../../src/components/TextFieldBase/useTextFieldBaseStyleProps.ts"],"sourcesContent":["import classNames from 'classnames';\nimport { useClassNamePrefix } from '../../hooks';\nimport { type SpiritTextFieldBaseProps, type TextFieldBaseProps } from '../../types';\n\nexport interface TextFieldBaseStyles {\n  /** className props */\n  classProps: {\n    root: string;\n    label: string;\n    input: string;\n    helperText: string;\n    validationText: string;\n    passwordToggle: string;\n    passwordToggleButton: string;\n    passwordToggleIcon: string;\n    counter: string;\n  };\n  /** props to be passed to the input element */\n  props: Omit<TextFieldBaseProps, 'label'>;\n}\n\nexport function useTextFieldBaseStyleProps(props: Omit<SpiritTextFieldBaseProps, 'label'>): TextFieldBaseStyles {\n  const { isFluid, isMultiline, isLabelHidden, size, validationState, ...restProps } = props;\n  const { isDisabled, isRequired } = restProps;\n\n  const textFieldBaseClass = useClassNamePrefix(isMultiline ? 'TextArea' : 'TextField');\n  const textFieldBaseDisabledClass = `${textFieldBaseClass}--disabled`;\n  const textFieldBaseFluidClass = `${textFieldBaseClass}--fluid`;\n  const textFieldBaseSizeClass = `${textFieldBaseClass}--${size}`;\n  const textFieldBaseValidationClass = `${textFieldBaseClass}--${validationState}`;\n  const textFieldBaseInputClass = `${textFieldBaseClass}__input`;\n  const textFieldBaseLabelClass = `${textFieldBaseClass}__label`;\n  const textFieldBaseLabelRequiredClass = `${textFieldBaseClass}__label--required`;\n  const textFieldBaseLabelHiddenClass = `${textFieldBaseClass}__label--hidden`;\n  const textFieldBaseValidationTextClass = `${textFieldBaseClass}__validationText`;\n  const textFieldBasePasswordToggleClass = `${textFieldBaseClass}__passwordToggle`;\n  const textFieldBasePasswordToggleButtonClass = `${textFieldBaseClass}__passwordToggle__button`;\n  const textFieldBasePasswordToggleIconClass = `${textFieldBaseClass}__passwordToggle__icon`;\n  const textFieldBaseHelperTextClass = `${textFieldBaseClass}__helperText`;\n  const textFieldBaseCounterClass = `${textFieldBaseClass}__counter`;\n\n  return {\n    classProps: {\n      root: classNames(textFieldBaseClass, {\n        [textFieldBaseDisabledClass]: isDisabled,\n        [textFieldBaseFluidClass]: isFluid,\n        [textFieldBaseValidationClass]: validationState,\n        [textFieldBaseSizeClass]: size,\n      }),\n      label: classNames(textFieldBaseLabelClass, {\n        [textFieldBaseLabelRequiredClass]: isRequired,\n        [textFieldBaseLabelHiddenClass]: isLabelHidden,\n      }),\n      input: textFieldBaseInputClass,\n      helperText: textFieldBaseHelperTextClass,\n      validationText: textFieldBaseValidationTextClass,\n      passwordToggle: textFieldBasePasswordToggleClass,\n      passwordToggleButton: textFieldBasePasswordToggleButtonClass,\n      passwordToggleIcon: textFieldBasePasswordToggleIconClass,\n      counter: textFieldBaseCounterClass,\n    },\n    props: {\n      ...restProps,\n      isMultiline,\n    },\n  };\n}\n"],"names":["useTextFieldBaseStyleProps","props","isFluid","isMultiline","isLabelHidden","size","validationState","restProps","isDisabled","isRequired","textFieldBaseClass","useClassNamePrefix","textFieldBaseDisabledClass","textFieldBaseFluidClass","textFieldBaseSizeClass","textFieldBaseValidationClass","textFieldBaseInputClass","textFieldBaseLabelClass","textFieldBaseLabelRequiredClass","textFieldBaseLabelHiddenClass","textFieldBaseValidationTextClass","textFieldBasePasswordToggleClass","textFieldBasePasswordToggleButtonClass","textFieldBasePasswordToggleIconClass","textFieldBaseHelperTextClass","textFieldBaseCounterClass","classNames"],"mappings":"8JAqBO,SAASA,EAA2BC,EAAqE,CAC9G,KAAM,CAAE,QAAAC,EAAS,YAAAC,EAAa,cAAAC,EAAe,KAAAC,EAAM,gBAAAC,EAAiB,GAAGC,GAAcN,EAC/E,CAAE,WAAAO,EAAY,WAAAC,CAAA,EAAeF,EAE7BG,EAAqBC,EAAAA,mBAAmBR,EAAc,WAAa,WAAW,EAC9ES,EAA6B,GAAGF,CAAkB,aAClDG,EAA0B,GAAGH,CAAkB,UAC/CI,EAAyB,GAAGJ,CAAkB,KAAKL,CAAI,GACvDU,EAA+B,GAAGL,CAAkB,KAAKJ,CAAe,GACxEU,EAA0B,GAAGN,CAAkB,UAC/CO,EAA0B,GAAGP,CAAkB,UAC/CQ,EAAkC,GAAGR,CAAkB,oBACvDS,EAAgC,GAAGT,CAAkB,kBACrDU,EAAmC,GAAGV,CAAkB,mBACxDW,EAAmC,GAAGX,CAAkB,mBACxDY,EAAyC,GAAGZ,CAAkB,2BAC9Da,EAAuC,GAAGb,CAAkB,yBAC5Dc,EAA+B,GAAGd,CAAkB,eACpDe,EAA4B,GAAGf,CAAkB,YAEvD,MAAO,CACL,WAAY,CACV,KAAMgB,EAAWhB,EAAoB,CACnC,CAACE,CAA0B,EAAGJ,EAC9B,CAACK,CAAuB,EAAGX,EAC3B,CAACa,CAA4B,EAAGT,EAChC,CAACQ,CAAsB,EAAGT,CAAA,CAC3B,EACD,MAAOqB,EAAWT,EAAyB,CACzC,CAACC,CAA+B,EAAGT,EACnC,CAACU,CAA6B,EAAGf,CAAA,CAClC,EACD,MAAOY,EACP,WAAYQ,EACZ,eAAgBJ,EAChB,eAAgBC,EAChB,qBAAsBC,EACtB,mBAAoBC,EACpB,QAASE,CAAA,EAEX,MAAO,CACL,GAAGlB,EACH,YAAAJ,CAAA,CACF,CAEJ"}