@alma-oss/spirit-web-react 4.3.0 → 4.5.0

package/dist/components/Card/CardTitle.js

@@ -0,0 +1,17 @@
+"use client";
+import { jsx as a } from "react/jsx-runtime";
+import { useStyleProps as c } from "../../hooks/styleProps.js";
+import { mergeStyleProps as P } from "../../utils/mergeStyleProps.js";
+import { useCardStyleProps as d } from "./useCardStyleProps.js";
+const u = {
+  elementType: "h4",
+  isHeading: !0
+}, f = (s) => {
+  const r = { ...u, ...s }, { elementType: e = "h4", children: o, isHeading: p, ...l } = r, { classProps: i } = d({ isHeading: p }), { styleProps: n, props: t } = c(l), m = P(e, { classProps: i.title, styleProps: n, otherProps: t });
+  return /* @__PURE__ */ a(e, { ...t, ...m, children: o });
+};
+f.spiritComponent = "CardTitle";
+export {
+  f as default
+};
+//# sourceMappingURL=CardTitle.js.map

package/dist/components/Card/CardTitle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CardTitle.js","sources":["../../../src/components/Card/CardTitle.tsx"],"sourcesContent":["'use client';\n\nimport React, { type ElementType } from 'react';\nimport { useStyleProps } from '../../hooks';\nimport { type SpiritCardTitleProps } from '../../types';\nimport { mergeStyleProps } from '../../utils';\nimport { useCardStyleProps } from './useCardStyleProps';\n\nconst defaultProps: Partial<SpiritCardTitleProps> = {\n  elementType: 'h4',\n  isHeading: true,\n};\n\nconst CardTitle = <E extends ElementType = 'h4'>(props: SpiritCardTitleProps<E>) => {\n  const propsWithDefaults = { ...defaultProps, ...props };\n  const { elementType: ElementTag = 'h4', children, isHeading, ...restProps } = propsWithDefaults;\n  const { classProps } = useCardStyleProps({ isHeading });\n  const { styleProps, props: otherProps } = useStyleProps(restProps);\n  const mergedStyleProps = mergeStyleProps(ElementTag, { classProps: classProps.title, styleProps, otherProps });\n\n  return (\n    <ElementTag {...otherProps} {...mergedStyleProps}>\n      {children}\n    </ElementTag>\n  );\n};\n\nCardTitle.spiritComponent = 'CardTitle';\n\nexport default CardTitle;\n"],"names":["defaultProps","CardTitle","props","propsWithDefaults","ElementTag","children","isHeading","restProps","classProps","useCardStyleProps","styleProps","otherProps","useStyleProps","mergedStyleProps","mergeStyleProps"],"mappings":";;;;;AAQA,MAAMA,IAA8C;AAAA,EAClD,aAAa;AAAA,EACb,WAAW;AACb,GAEMC,IAAY,CAA+BC,MAAmC;AAClF,QAAMC,IAAoB,EAAE,GAAGH,GAAc,GAAGE,EAAA,GAC1C,EAAE,aAAaE,IAAa,MAAM,UAAAC,GAAU,WAAAC,GAAW,GAAGC,MAAcJ,GACxE,EAAE,YAAAK,EAAA,IAAeC,EAAkB,EAAE,WAAAH,GAAW,GAChD,EAAE,YAAAI,GAAY,OAAOC,EAAA,IAAeC,EAAcL,CAAS,GAC3DM,IAAmBC,EAAgBV,GAAY,EAAE,YAAYI,EAAW,OAAO,YAAAE,GAAY,YAAAC,GAAY;AAE7G,2BACGP,GAAA,EAAY,GAAGO,GAAa,GAAGE,GAC7B,UAAAR,GACH;AAEJ;AAEAJ,EAAU,kBAAkB;"}

package/dist/components/Card/index.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("./Card.cjs"),e=require("./CardArtwork.cjs"),d=require("./CardBody.cjs"),t=require("./CardEyebrow.cjs"),a=require("./CardFooter.cjs"),o=require("./CardLink.cjs"),u=require("./CardLogo.cjs"),C=require("./CardMedia.cjs"),i=require("./CardTitle.cjs"),s=require("./useCardStyleProps.cjs");exports.Card=r.default;exports.CardArtwork=e.default;exports.CardBody=d.default;exports.CardEyebrow=t.default;exports.CardFooter=a.default;exports.CardLink=o.default;exports.CardLogo=u.default;exports.CardMedia=C.default;exports.CardTitle=i.default;exports.useCardStyleProps=s.useCardStyleProps;
+//# sourceMappingURL=index.cjs.map

package/dist/components/Card/index.cjs.map

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

package/dist/components/Card/index.js

@@ -0,0 +1,23 @@
+import { default as o } from "./Card.js";
+import { default as t } from "./CardArtwork.js";
+import { default as f } from "./CardBody.js";
+import { default as l } from "./CardEyebrow.js";
+import { default as u } from "./CardFooter.js";
+import { default as x } from "./CardLink.js";
+import { default as i } from "./CardLogo.js";
+import { default as k } from "./CardMedia.js";
+import { default as L } from "./CardTitle.js";
+import { useCardStyleProps as c } from "./useCardStyleProps.js";
+export {
+  o as Card,
+  t as CardArtwork,
+  f as CardBody,
+  l as CardEyebrow,
+  u as CardFooter,
+  x as CardLink,
+  i as CardLogo,
+  k as CardMedia,
+  L as CardTitle,
+  c as useCardStyleProps
+};
+//# sourceMappingURL=index.js.map

package/dist/components/Card/index.js.map

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

package/dist/components/Card/useCardMediaStyleProps.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("@alma-oss/spirit-design-tokens"),c=require("../../hooks/useClassNamePrefix.cjs"),d=r=>{const{backgroundColor:e,fit:s}=r||{},a=c.useClassNamePrefix(`bg-${e}`),o=e?a:"",t=s?{[`--${i.cssVariablePrefix}card-media-object-fit`]:s}:{};return{classProps:o,styleProps:t}};exports.useCardMediaStyleProps=d;
+//# sourceMappingURL=useCardMediaStyleProps.cjs.map

package/dist/components/Card/useCardMediaStyleProps.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useCardMediaStyleProps.cjs","sources":["../../../src/components/Card/useCardMediaStyleProps.ts"],"sourcesContent":["import { cssVariablePrefix } from '@alma-oss/spirit-design-tokens';\nimport { type CSSProperties } from 'react';\nimport { useClassNamePrefix } from '../../hooks';\nimport { type SpiritCardMediaProps } from '../../types';\n\nexport interface UseCardMediaStylePropsReturn {\n  /** className props */\n  classProps: string;\n  /** Style object with CSS variables */\n  styleProps: CSSProperties;\n}\n\nexport const useCardMediaStyleProps = (props: Partial<SpiritCardMediaProps>): UseCardMediaStylePropsReturn => {\n  const { backgroundColor, fit } = props || {};\n  const cardMediaBackgroundClassName = useClassNamePrefix(`bg-${backgroundColor}`);\n\n  const cardMediaBackgroundColor = backgroundColor ? cardMediaBackgroundClassName : '';\n\n  // Generate CSS variable for fit\n  const cardMediaStyle: CSSProperties = fit\n    ? ({ [`--${cssVariablePrefix}card-media-object-fit`]: fit } as CSSProperties)\n    : {};\n\n  return {\n    classProps: cardMediaBackgroundColor,\n    styleProps: cardMediaStyle,\n  };\n};\n"],"names":["useCardMediaStyleProps","props","backgroundColor","fit","cardMediaBackgroundClassName","useClassNamePrefix","cardMediaBackgroundColor","cardMediaStyle","cssVariablePrefix"],"mappings":"kLAYaA,EAA0BC,GAAuE,CAC5G,KAAM,CAAE,gBAAAC,EAAiB,IAAAC,CAAA,EAAQF,GAAS,CAAA,EACpCG,EAA+BC,EAAAA,mBAAmB,MAAMH,CAAe,EAAE,EAEzEI,EAA2BJ,EAAkBE,EAA+B,GAG5EG,EAAgCJ,EACjC,CAAE,CAAC,KAAKK,EAAAA,iBAAiB,uBAAuB,EAAGL,CAAA,EACpD,CAAA,EAEJ,MAAO,CACL,WAAYG,EACZ,WAAYC,CAAA,CAEhB"}

package/dist/components/Card/useCardMediaStyleProps.d.ts

@@ -0,0 +1,7 @@
+import { CSSProperties } from 'react';
+import { SpiritCardMediaProps } from '../../types';
+export interface UseCardMediaStylePropsReturn {
+    classProps: string;
+    styleProps: CSSProperties;
+}
+export declare const useCardMediaStyleProps: (props: Partial<SpiritCardMediaProps>) => UseCardMediaStylePropsReturn;

package/dist/components/Card/useCardMediaStyleProps.js

@@ -0,0 +1,13 @@
+import { cssVariablePrefix as c } from "@alma-oss/spirit-design-tokens";
+import { useClassNamePrefix as d } from "../../hooks/useClassNamePrefix.js";
+const n = (s) => {
+  const { backgroundColor: r, fit: o } = s || {}, a = d(`bg-${r}`), e = r ? a : "", t = o ? { [`--${c}card-media-object-fit`]: o } : {};
+  return {
+    classProps: e,
+    styleProps: t
+  };
+};
+export {
+  n as useCardMediaStyleProps
+};
+//# sourceMappingURL=useCardMediaStyleProps.js.map

package/dist/components/Card/useCardMediaStyleProps.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useCardMediaStyleProps.js","sources":["../../../src/components/Card/useCardMediaStyleProps.ts"],"sourcesContent":["import { cssVariablePrefix } from '@alma-oss/spirit-design-tokens';\nimport { type CSSProperties } from 'react';\nimport { useClassNamePrefix } from '../../hooks';\nimport { type SpiritCardMediaProps } from '../../types';\n\nexport interface UseCardMediaStylePropsReturn {\n  /** className props */\n  classProps: string;\n  /** Style object with CSS variables */\n  styleProps: CSSProperties;\n}\n\nexport const useCardMediaStyleProps = (props: Partial<SpiritCardMediaProps>): UseCardMediaStylePropsReturn => {\n  const { backgroundColor, fit } = props || {};\n  const cardMediaBackgroundClassName = useClassNamePrefix(`bg-${backgroundColor}`);\n\n  const cardMediaBackgroundColor = backgroundColor ? cardMediaBackgroundClassName : '';\n\n  // Generate CSS variable for fit\n  const cardMediaStyle: CSSProperties = fit\n    ? ({ [`--${cssVariablePrefix}card-media-object-fit`]: fit } as CSSProperties)\n    : {};\n\n  return {\n    classProps: cardMediaBackgroundColor,\n    styleProps: cardMediaStyle,\n  };\n};\n"],"names":["useCardMediaStyleProps","props","backgroundColor","fit","cardMediaBackgroundClassName","useClassNamePrefix","cardMediaBackgroundColor","cardMediaStyle","cssVariablePrefix"],"mappings":";;AAYO,MAAMA,IAAyB,CAACC,MAAuE;AAC5G,QAAM,EAAE,iBAAAC,GAAiB,KAAAC,EAAA,IAAQF,KAAS,CAAA,GACpCG,IAA+BC,EAAmB,MAAMH,CAAe,EAAE,GAEzEI,IAA2BJ,IAAkBE,IAA+B,IAG5EG,IAAgCJ,IACjC,EAAE,CAAC,KAAKK,CAAiB,uBAAuB,GAAGL,EAAA,IACpD,CAAA;AAEJ,SAAO;AAAA,IACL,YAAYG;AAAA,IACZ,YAAYC;AAAA,EAAA;AAEhB;"}

package/dist/components/Card/useCardStyleProps.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("classnames"),a=require("../../hooks/useAlignmentClass.cjs"),T=require("../../hooks/useClassNamePrefix.cjs"),j=require("../../utils/string.cjs"),z=require("../../utils/stylePropsClassesGenerator.cjs");function I(m){const{alignmentY:o,artworkAlignmentX:l,direction:n,footerAlignmentX:i,hasFilledHeight:u,isBoxed:b,isExpanded:$,isHeading:y,isSelectable:f,size:r}=m||{},s=T.useClassNamePrefix("Card"),c=`${s}Artwork`,C=`${s}Body`,p=`${s}Eyebrow`,d=`${s}Footer`,k=`${s}Link`,w=`${s}Logo`,t=`${s}Media`,g=`${s}Title`,x=`${C}--selectable`,P=z.generateStylePropsClassNames(s,j.stringOrObjectKebabCaseToCamelCase(n)),S=`${s}--boxed`,A=`${t}__canvas`,H=`${t}--filledHeight`,h=`${t}--expanded`,q=r?`${t}--${r}`:"",v=`${g}--heading`,N=e(c,{[a.useAlignmentClass(c,l,"alignmentX")]:l}),X=e(C,{[x]:f}),B=e(d,{[a.useAlignmentClass(d,i,"alignmentX")]:i}),E=e(t,q,{[h]:$,[H]:u}),F=e(s,{[a.useAlignmentClass(s,o,"alignmentY")]:o,[P]:n,[S]:b}),O=e(g,{[v]:y});return{classProps:{artwork:N,body:X,eyebrow:p,footer:B,link:k,logo:w,media:E,mediaCanvas:A,root:F,title:O}}}exports.useCardStyleProps=I;
+//# sourceMappingURL=useCardStyleProps.cjs.map

package/dist/components/Card/useCardStyleProps.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useCardStyleProps.cjs","sources":["../../../src/components/Card/useCardStyleProps.ts"],"sourcesContent":["import classNames from 'classnames';\nimport { useAlignmentClass, useClassNamePrefix } from '../../hooks';\nimport {\n  type CardAlignmentXType,\n  type CardAlignmentYType,\n  type CardDirectionType,\n  type CardSizesDictionaryType,\n} from '../../types';\nimport { generateStylePropsClassNames, stringOrObjectKebabCaseToCamelCase } from '../../utils';\n\nexport interface UseCardStyleProps {\n  alignmentY?: CardAlignmentYType;\n  artworkAlignmentX?: CardAlignmentXType;\n  direction?: CardDirectionType;\n  footerAlignmentX?: CardAlignmentXType;\n  hasFilledHeight?: boolean;\n  isBoxed?: boolean;\n  isExpanded?: boolean;\n  isHeading?: boolean;\n  isSelectable?: boolean;\n  size?: CardSizesDictionaryType;\n}\n\nexport interface UseCardStylePropsReturn {\n  /** className props */\n  classProps: {\n    artwork: string;\n    body: string;\n    eyebrow: string;\n    footer: string;\n    link: string;\n    logo: string;\n    media: string;\n    mediaCanvas: string;\n    root: string;\n    title: string;\n  };\n}\n\nexport function useCardStyleProps(props?: UseCardStyleProps): UseCardStylePropsReturn {\n  const {\n    alignmentY,\n    artworkAlignmentX,\n    direction,\n    footerAlignmentX,\n    hasFilledHeight,\n    isBoxed,\n    isExpanded,\n    isHeading,\n    isSelectable,\n    size,\n  } = props || {};\n  const cardClass = useClassNamePrefix('Card');\n  const artworkClass = `${cardClass}Artwork`;\n  const bodyClass = `${cardClass}Body`;\n  const eyebrowClass = `${cardClass}Eyebrow`;\n  const footerClass = `${cardClass}Footer`;\n  const linkClass = `${cardClass}Link`;\n  const logoClass = `${cardClass}Logo`;\n  const mediaClass = `${cardClass}Media`;\n  const titleClass = `${cardClass}Title`;\n\n  const bodyIsSelectableClass = `${bodyClass}--selectable`;\n\n  const directionClass = generateStylePropsClassNames(cardClass, stringOrObjectKebabCaseToCamelCase(direction!));\n\n  const isBoxedClass = `${cardClass}--boxed`;\n  const mediaCanvasClass = `${mediaClass}__canvas`;\n  const mediaHasFilledHeightClass = `${mediaClass}--filledHeight`;\n  const mediaIsExpandedClass = `${mediaClass}--expanded`;\n  const mediaSizeClass = size ? `${mediaClass}--${size}` : '';\n  const titleHeadingClass = `${titleClass}--heading`;\n\n  const artworkClasses = classNames(artworkClass, {\n    [useAlignmentClass(artworkClass, artworkAlignmentX!, 'alignmentX')]: artworkAlignmentX,\n  });\n  const bodyClasses = classNames(bodyClass, {\n    [bodyIsSelectableClass]: isSelectable,\n  });\n  const footerClasses = classNames(footerClass, {\n    [useAlignmentClass(footerClass, footerAlignmentX!, 'alignmentX')]: footerAlignmentX,\n  });\n  const mediaClasses = classNames(mediaClass, mediaSizeClass, {\n    [mediaIsExpandedClass]: isExpanded,\n    [mediaHasFilledHeightClass]: hasFilledHeight,\n  });\n  const rootClasses = classNames(cardClass, {\n    [useAlignmentClass(cardClass, alignmentY!, 'alignmentY')]: alignmentY,\n    [directionClass]: direction,\n    [isBoxedClass]: isBoxed,\n  });\n  const titleClasses = classNames(titleClass, {\n    [titleHeadingClass]: isHeading,\n  });\n\n  return {\n    classProps: {\n      artwork: artworkClasses,\n      body: bodyClasses,\n      eyebrow: eyebrowClass,\n      footer: footerClasses,\n      link: linkClass,\n      logo: logoClass,\n      media: mediaClasses,\n      mediaCanvas: mediaCanvasClass,\n      root: rootClasses,\n      title: titleClasses,\n    },\n  };\n}\n"],"names":["useCardStyleProps","props","alignmentY","artworkAlignmentX","direction","footerAlignmentX","hasFilledHeight","isBoxed","isExpanded","isHeading","isSelectable","size","cardClass","useClassNamePrefix","artworkClass","bodyClass","eyebrowClass","footerClass","linkClass","logoClass","mediaClass","titleClass","bodyIsSelectableClass","directionClass","generateStylePropsClassNames","stringOrObjectKebabCaseToCamelCase","isBoxedClass","mediaCanvasClass","mediaHasFilledHeightClass","mediaIsExpandedClass","mediaSizeClass","titleHeadingClass","artworkClasses","classNames","useAlignmentClass","bodyClasses","footerClasses","mediaClasses","rootClasses","titleClasses"],"mappings":"ySAuCO,SAASA,EAAkBC,EAAoD,CACpF,KAAM,CACJ,WAAAC,EACA,kBAAAC,EACA,UAAAC,EACA,iBAAAC,EACA,gBAAAC,EACA,QAAAC,EACA,WAAAC,EACA,UAAAC,EACA,aAAAC,EACA,KAAAC,CAAA,EACEV,GAAS,CAAA,EACPW,EAAYC,EAAAA,mBAAmB,MAAM,EACrCC,EAAe,GAAGF,CAAS,UAC3BG,EAAY,GAAGH,CAAS,OACxBI,EAAe,GAAGJ,CAAS,UAC3BK,EAAc,GAAGL,CAAS,SAC1BM,EAAY,GAAGN,CAAS,OACxBO,EAAY,GAAGP,CAAS,OACxBQ,EAAa,GAAGR,CAAS,QACzBS,EAAa,GAAGT,CAAS,QAEzBU,EAAwB,GAAGP,CAAS,eAEpCQ,EAAiBC,EAAAA,6BAA6BZ,EAAWa,EAAAA,mCAAmCrB,CAAU,CAAC,EAEvGsB,EAAe,GAAGd,CAAS,UAC3Be,EAAmB,GAAGP,CAAU,WAChCQ,EAA4B,GAAGR,CAAU,iBACzCS,EAAuB,GAAGT,CAAU,aACpCU,EAAiBnB,EAAO,GAAGS,CAAU,KAAKT,CAAI,GAAK,GACnDoB,EAAoB,GAAGV,CAAU,YAEjCW,EAAiBC,EAAWnB,EAAc,CAC9C,CAACoB,oBAAkBpB,EAAcX,EAAoB,YAAY,CAAC,EAAGA,CAAA,CACtE,EACKgC,EAAcF,EAAWlB,EAAW,CACxC,CAACO,CAAqB,EAAGZ,CAAA,CAC1B,EACK0B,EAAgBH,EAAWhB,EAAa,CAC5C,CAACiB,oBAAkBjB,EAAaZ,EAAmB,YAAY,CAAC,EAAGA,CAAA,CACpE,EACKgC,EAAeJ,EAAWb,EAAYU,EAAgB,CAC1D,CAACD,CAAoB,EAAGrB,EACxB,CAACoB,CAAyB,EAAGtB,CAAA,CAC9B,EACKgC,EAAcL,EAAWrB,EAAW,CACxC,CAACsB,EAAAA,kBAAkBtB,EAAWV,EAAa,YAAY,CAAC,EAAGA,EAC3D,CAACqB,CAAc,EAAGnB,EAClB,CAACsB,CAAY,EAAGnB,CAAA,CACjB,EACKgC,EAAeN,EAAWZ,EAAY,CAC1C,CAACU,CAAiB,EAAGtB,CAAA,CACtB,EAED,MAAO,CACL,WAAY,CACV,QAASuB,EACT,KAAMG,EACN,QAASnB,EACT,OAAQoB,EACR,KAAMlB,EACN,KAAMC,EACN,MAAOkB,EACP,YAAaV,EACb,KAAMW,EACN,MAAOC,CAAA,CACT,CAEJ"}

package/dist/components/Card/useCardStyleProps.d.ts

@@ -0,0 +1,28 @@
+import { CardAlignmentXType, CardAlignmentYType, CardDirectionType, CardSizesDictionaryType } from '../../types';
+export interface UseCardStyleProps {
+    alignmentY?: CardAlignmentYType;
+    artworkAlignmentX?: CardAlignmentXType;
+    direction?: CardDirectionType;
+    footerAlignmentX?: CardAlignmentXType;
+    hasFilledHeight?: boolean;
+    isBoxed?: boolean;
+    isExpanded?: boolean;
+    isHeading?: boolean;
+    isSelectable?: boolean;
+    size?: CardSizesDictionaryType;
+}
+export interface UseCardStylePropsReturn {
+    classProps: {
+        artwork: string;
+        body: string;
+        eyebrow: string;
+        footer: string;
+        link: string;
+        logo: string;
+        media: string;
+        mediaCanvas: string;
+        root: string;
+        title: string;
+    };
+}
+export declare function useCardStyleProps(props?: UseCardStyleProps): UseCardStylePropsReturn;

package/dist/components/Card/useCardStyleProps.js

@@ -0,0 +1,52 @@
+import e from "classnames";
+import { useAlignmentClass as t } from "../../hooks/useAlignmentClass.js";
+import { useClassNamePrefix as L } from "../../hooks/useClassNamePrefix.js";
+import { stringOrObjectKebabCaseToCamelCase as O } from "../../utils/string.js";
+import { generateStylePropsClassNames as T } from "../../utils/stylePropsClassesGenerator.js";
+function q(g) {
+  const {
+    alignmentY: a,
+    artworkAlignmentX: l,
+    direction: n,
+    footerAlignmentX: i,
+    hasFilledHeight: $,
+    isBoxed: b,
+    isExpanded: f,
+    isHeading: p,
+    isSelectable: y,
+    size: r
+  } = g || {}, s = L("Card"), c = `${s}Artwork`, d = `${s}Body`, k = `${s}Eyebrow`, C = `${s}Footer`, w = `${s}Link`, x = `${s}Logo`, o = `${s}Media`, m = `${s}Title`, u = `${d}--selectable`, H = T(s, O(n)), h = `${s}--boxed`, S = `${o}__canvas`, A = `${o}--filledHeight`, P = `${o}--expanded`, X = r ? `${o}--${r}` : "", v = `${m}--heading`, B = e(c, {
+    [t(c, l, "alignmentX")]: l
+  }), E = e(d, {
+    [u]: y
+  }), F = e(C, {
+    [t(C, i, "alignmentX")]: i
+  }), N = e(o, X, {
+    [P]: f,
+    [A]: $
+  }), z = e(s, {
+    [t(s, a, "alignmentY")]: a,
+    [H]: n,
+    [h]: b
+  }), I = e(m, {
+    [v]: p
+  });
+  return {
+    classProps: {
+      artwork: B,
+      body: E,
+      eyebrow: k,
+      footer: F,
+      link: w,
+      logo: x,
+      media: N,
+      mediaCanvas: S,
+      root: z,
+      title: I
+    }
+  };
+}
+export {
+  q as useCardStyleProps
+};
+//# sourceMappingURL=useCardStyleProps.js.map

package/dist/components/Card/useCardStyleProps.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useCardStyleProps.js","sources":["../../../src/components/Card/useCardStyleProps.ts"],"sourcesContent":["import classNames from 'classnames';\nimport { useAlignmentClass, useClassNamePrefix } from '../../hooks';\nimport {\n  type CardAlignmentXType,\n  type CardAlignmentYType,\n  type CardDirectionType,\n  type CardSizesDictionaryType,\n} from '../../types';\nimport { generateStylePropsClassNames, stringOrObjectKebabCaseToCamelCase } from '../../utils';\n\nexport interface UseCardStyleProps {\n  alignmentY?: CardAlignmentYType;\n  artworkAlignmentX?: CardAlignmentXType;\n  direction?: CardDirectionType;\n  footerAlignmentX?: CardAlignmentXType;\n  hasFilledHeight?: boolean;\n  isBoxed?: boolean;\n  isExpanded?: boolean;\n  isHeading?: boolean;\n  isSelectable?: boolean;\n  size?: CardSizesDictionaryType;\n}\n\nexport interface UseCardStylePropsReturn {\n  /** className props */\n  classProps: {\n    artwork: string;\n    body: string;\n    eyebrow: string;\n    footer: string;\n    link: string;\n    logo: string;\n    media: string;\n    mediaCanvas: string;\n    root: string;\n    title: string;\n  };\n}\n\nexport function useCardStyleProps(props?: UseCardStyleProps): UseCardStylePropsReturn {\n  const {\n    alignmentY,\n    artworkAlignmentX,\n    direction,\n    footerAlignmentX,\n    hasFilledHeight,\n    isBoxed,\n    isExpanded,\n    isHeading,\n    isSelectable,\n    size,\n  } = props || {};\n  const cardClass = useClassNamePrefix('Card');\n  const artworkClass = `${cardClass}Artwork`;\n  const bodyClass = `${cardClass}Body`;\n  const eyebrowClass = `${cardClass}Eyebrow`;\n  const footerClass = `${cardClass}Footer`;\n  const linkClass = `${cardClass}Link`;\n  const logoClass = `${cardClass}Logo`;\n  const mediaClass = `${cardClass}Media`;\n  const titleClass = `${cardClass}Title`;\n\n  const bodyIsSelectableClass = `${bodyClass}--selectable`;\n\n  const directionClass = generateStylePropsClassNames(cardClass, stringOrObjectKebabCaseToCamelCase(direction!));\n\n  const isBoxedClass = `${cardClass}--boxed`;\n  const mediaCanvasClass = `${mediaClass}__canvas`;\n  const mediaHasFilledHeightClass = `${mediaClass}--filledHeight`;\n  const mediaIsExpandedClass = `${mediaClass}--expanded`;\n  const mediaSizeClass = size ? `${mediaClass}--${size}` : '';\n  const titleHeadingClass = `${titleClass}--heading`;\n\n  const artworkClasses = classNames(artworkClass, {\n    [useAlignmentClass(artworkClass, artworkAlignmentX!, 'alignmentX')]: artworkAlignmentX,\n  });\n  const bodyClasses = classNames(bodyClass, {\n    [bodyIsSelectableClass]: isSelectable,\n  });\n  const footerClasses = classNames(footerClass, {\n    [useAlignmentClass(footerClass, footerAlignmentX!, 'alignmentX')]: footerAlignmentX,\n  });\n  const mediaClasses = classNames(mediaClass, mediaSizeClass, {\n    [mediaIsExpandedClass]: isExpanded,\n    [mediaHasFilledHeightClass]: hasFilledHeight,\n  });\n  const rootClasses = classNames(cardClass, {\n    [useAlignmentClass(cardClass, alignmentY!, 'alignmentY')]: alignmentY,\n    [directionClass]: direction,\n    [isBoxedClass]: isBoxed,\n  });\n  const titleClasses = classNames(titleClass, {\n    [titleHeadingClass]: isHeading,\n  });\n\n  return {\n    classProps: {\n      artwork: artworkClasses,\n      body: bodyClasses,\n      eyebrow: eyebrowClass,\n      footer: footerClasses,\n      link: linkClass,\n      logo: logoClass,\n      media: mediaClasses,\n      mediaCanvas: mediaCanvasClass,\n      root: rootClasses,\n      title: titleClasses,\n    },\n  };\n}\n"],"names":["useCardStyleProps","props","alignmentY","artworkAlignmentX","direction","footerAlignmentX","hasFilledHeight","isBoxed","isExpanded","isHeading","isSelectable","size","cardClass","useClassNamePrefix","artworkClass","bodyClass","eyebrowClass","footerClass","linkClass","logoClass","mediaClass","titleClass","bodyIsSelectableClass","directionClass","generateStylePropsClassNames","stringOrObjectKebabCaseToCamelCase","isBoxedClass","mediaCanvasClass","mediaHasFilledHeightClass","mediaIsExpandedClass","mediaSizeClass","titleHeadingClass","artworkClasses","classNames","useAlignmentClass","bodyClasses","footerClasses","mediaClasses","rootClasses","titleClasses"],"mappings":";;;;;AAuCO,SAASA,EAAkBC,GAAoD;AACpF,QAAM;AAAA,IACJ,YAAAC;AAAA,IACA,mBAAAC;AAAA,IACA,WAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,SAAAC;AAAA,IACA,YAAAC;AAAA,IACA,WAAAC;AAAA,IACA,cAAAC;AAAA,IACA,MAAAC;AAAA,EAAA,IACEV,KAAS,CAAA,GACPW,IAAYC,EAAmB,MAAM,GACrCC,IAAe,GAAGF,CAAS,WAC3BG,IAAY,GAAGH,CAAS,QACxBI,IAAe,GAAGJ,CAAS,WAC3BK,IAAc,GAAGL,CAAS,UAC1BM,IAAY,GAAGN,CAAS,QACxBO,IAAY,GAAGP,CAAS,QACxBQ,IAAa,GAAGR,CAAS,SACzBS,IAAa,GAAGT,CAAS,SAEzBU,IAAwB,GAAGP,CAAS,gBAEpCQ,IAAiBC,EAA6BZ,GAAWa,EAAmCrB,CAAU,CAAC,GAEvGsB,IAAe,GAAGd,CAAS,WAC3Be,IAAmB,GAAGP,CAAU,YAChCQ,IAA4B,GAAGR,CAAU,kBACzCS,IAAuB,GAAGT,CAAU,cACpCU,IAAiBnB,IAAO,GAAGS,CAAU,KAAKT,CAAI,KAAK,IACnDoB,IAAoB,GAAGV,CAAU,aAEjCW,IAAiBC,EAAWnB,GAAc;AAAA,IAC9C,CAACoB,EAAkBpB,GAAcX,GAAoB,YAAY,CAAC,GAAGA;AAAA,EAAA,CACtE,GACKgC,IAAcF,EAAWlB,GAAW;AAAA,IACxC,CAACO,CAAqB,GAAGZ;AAAA,EAAA,CAC1B,GACK0B,IAAgBH,EAAWhB,GAAa;AAAA,IAC5C,CAACiB,EAAkBjB,GAAaZ,GAAmB,YAAY,CAAC,GAAGA;AAAA,EAAA,CACpE,GACKgC,IAAeJ,EAAWb,GAAYU,GAAgB;AAAA,IAC1D,CAACD,CAAoB,GAAGrB;AAAA,IACxB,CAACoB,CAAyB,GAAGtB;AAAA,EAAA,CAC9B,GACKgC,IAAcL,EAAWrB,GAAW;AAAA,IACxC,CAACsB,EAAkBtB,GAAWV,GAAa,YAAY,CAAC,GAAGA;AAAA,IAC3D,CAACqB,CAAc,GAAGnB;AAAA,IAClB,CAACsB,CAAY,GAAGnB;AAAA,EAAA,CACjB,GACKgC,IAAeN,EAAWZ,GAAY;AAAA,IAC1C,CAACU,CAAiB,GAAGtB;AAAA,EAAA,CACtB;AAED,SAAO;AAAA,IACL,YAAY;AAAA,MACV,SAASuB;AAAA,MACT,MAAMG;AAAA,MACN,SAASnB;AAAA,MACT,QAAQoB;AAAA,MACR,MAAMlB;AAAA,MACN,MAAMC;AAAA,MACN,OAAOkB;AAAA,MACP,aAAaV;AAAA,MACb,MAAMW;AAAA,MACN,OAAOC;AAAA,IAAA;AAAA,EACT;AAEJ;"}

package/dist/components/Card.d.ts

@@ -0,0 +1,2 @@
+export * from './Card/index'
+export {}

package/dist/components/CharacterCounter/CharacterCounter.cjs

@@ -0,0 +1,2 @@
+"use strict";"use client";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),c=require("../VisuallyHidden/VisuallyHidden.cjs"),l=require("./useCharacterCounterState.cjs"),r=t=>{const{debouncedScreenReaderMessage:s,isVisible:i,screenReaderMessageId:a,styleProps:n,transferProps:u,visibleCounterText:o}=l.useCharacterCounter(t);return i?e.jsxs(e.Fragment,{children:[e.jsx("div",{...u,...n,"aria-hidden":"true",children:o}),e.jsx(c.default,{id:a,"aria-live":"polite","aria-atomic":"true",children:s})]}):null};r.spiritComponent="CharacterCounter";exports.default=r;
+//# sourceMappingURL=CharacterCounter.cjs.map

package/dist/components/CharacterCounter/CharacterCounter.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"CharacterCounter.cjs","sources":["../../../src/components/CharacterCounter/CharacterCounter.tsx"],"sourcesContent":["'use client';\n\nimport React from 'react';\nimport { VisuallyHidden } from '../VisuallyHidden';\nimport { type CharacterCounterProps } from './types';\nimport { useCharacterCounter } from './useCharacterCounterState';\n\nconst CharacterCounter = (props: CharacterCounterProps) => {\n  const {\n    debouncedScreenReaderMessage,\n    isVisible,\n    screenReaderMessageId,\n    styleProps,\n    transferProps,\n    visibleCounterText,\n  } = useCharacterCounter(props);\n\n  return isVisible ? (\n    <>\n      <div {...transferProps} {...styleProps} aria-hidden=\"true\">\n        {visibleCounterText}\n      </div>\n      <VisuallyHidden id={screenReaderMessageId} aria-live=\"polite\" aria-atomic=\"true\">\n        {debouncedScreenReaderMessage}\n      </VisuallyHidden>\n    </>\n  ) : null;\n};\n\nCharacterCounter.spiritComponent = 'CharacterCounter';\n\nexport default CharacterCounter;\n"],"names":["CharacterCounter","props","debouncedScreenReaderMessage","isVisible","screenReaderMessageId","styleProps","transferProps","visibleCounterText","useCharacterCounter","jsxs","Fragment","jsx","VisuallyHidden"],"mappings":"4PAOMA,EAAoBC,GAAiC,CACzD,KAAM,CACJ,6BAAAC,EACA,UAAAC,EACA,sBAAAC,EACA,WAAAC,EACA,cAAAC,EACA,mBAAAC,CAAA,EACEC,EAAAA,oBAAoBP,CAAK,EAE7B,OAAOE,EACLM,EAAAA,KAAAC,EAAAA,SAAA,CACE,SAAA,CAAAC,MAAC,OAAK,GAAGL,EAAgB,GAAGD,EAAY,cAAY,OACjD,SAAAE,EACH,EACAI,EAAAA,IAACC,EAAAA,SAAe,GAAIR,EAAuB,YAAU,SAAS,cAAY,OACvE,SAAAF,CAAA,CACH,CAAA,CAAA,CACF,EACE,IACN,EAEAF,EAAiB,gBAAkB"}

package/dist/components/CharacterCounter/CharacterCounter.d.ts

@@ -0,0 +1,7 @@
+import { default as React } from 'react';
+import { CharacterCounterProps } from './types';
+declare const CharacterCounter: {
+    (props: CharacterCounterProps): React.JSX.Element | null;
+    spiritComponent: string;
+};
+export default CharacterCounter;

package/dist/components/CharacterCounter/CharacterCounter.js

@@ -0,0 +1,23 @@
+"use client";
+import { jsxs as d, Fragment as c, jsx as e } from "react/jsx-runtime";
+import l from "../VisuallyHidden/VisuallyHidden.js";
+import { useCharacterCounter as u } from "./useCharacterCounterState.js";
+const m = (r) => {
+  const {
+    debouncedScreenReaderMessage: t,
+    isVisible: i,
+    screenReaderMessageId: s,
+    styleProps: a,
+    transferProps: n,
+    visibleCounterText: o
+  } = u(r);
+  return i ? /* @__PURE__ */ d(c, { children: [
+    /* @__PURE__ */ e("div", { ...n, ...a, "aria-hidden": "true", children: o }),
+    /* @__PURE__ */ e(l, { id: s, "aria-live": "polite", "aria-atomic": "true", children: t })
+  ] }) : null;
+};
+m.spiritComponent = "CharacterCounter";
+export {
+  m as default
+};
+//# sourceMappingURL=CharacterCounter.js.map

package/dist/components/CharacterCounter/CharacterCounter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CharacterCounter.js","sources":["../../../src/components/CharacterCounter/CharacterCounter.tsx"],"sourcesContent":["'use client';\n\nimport React from 'react';\nimport { VisuallyHidden } from '../VisuallyHidden';\nimport { type CharacterCounterProps } from './types';\nimport { useCharacterCounter } from './useCharacterCounterState';\n\nconst CharacterCounter = (props: CharacterCounterProps) => {\n  const {\n    debouncedScreenReaderMessage,\n    isVisible,\n    screenReaderMessageId,\n    styleProps,\n    transferProps,\n    visibleCounterText,\n  } = useCharacterCounter(props);\n\n  return isVisible ? (\n    <>\n      <div {...transferProps} {...styleProps} aria-hidden=\"true\">\n        {visibleCounterText}\n      </div>\n      <VisuallyHidden id={screenReaderMessageId} aria-live=\"polite\" aria-atomic=\"true\">\n        {debouncedScreenReaderMessage}\n      </VisuallyHidden>\n    </>\n  ) : null;\n};\n\nCharacterCounter.spiritComponent = 'CharacterCounter';\n\nexport default CharacterCounter;\n"],"names":["CharacterCounter","props","debouncedScreenReaderMessage","isVisible","screenReaderMessageId","styleProps","transferProps","visibleCounterText","useCharacterCounter","jsxs","Fragment","jsx","VisuallyHidden"],"mappings":";;;;AAOA,MAAMA,IAAmB,CAACC,MAAiC;AACzD,QAAM;AAAA,IACJ,8BAAAC;AAAA,IACA,WAAAC;AAAA,IACA,uBAAAC;AAAA,IACA,YAAAC;AAAA,IACA,eAAAC;AAAA,IACA,oBAAAC;AAAA,EAAA,IACEC,EAAoBP,CAAK;AAE7B,SAAOE,IACL,gBAAAM,EAAAC,GAAA,EACE,UAAA;AAAA,IAAA,gBAAAC,EAAC,SAAK,GAAGL,GAAgB,GAAGD,GAAY,eAAY,QACjD,UAAAE,GACH;AAAA,IACA,gBAAAI,EAACC,KAAe,IAAIR,GAAuB,aAAU,UAAS,eAAY,QACvE,UAAAF,EAAA,CACH;AAAA,EAAA,EAAA,CACF,IACE;AACN;AAEAF,EAAiB,kBAAkB;"}

package/dist/components/CharacterCounter/constants.cjs

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"constants.cjs","sources":["../../../src/components/CharacterCounter/constants.ts"],"sourcesContent":["/** Debounce delay (ms) for screen reader message updates in the character counter */\nexport const CHARACTER_COUNTER_SCREEN_READER_DEBOUNCE_MS = 500;\n"],"names":["CHARACTER_COUNTER_SCREEN_READER_DEBOUNCE_MS"],"mappings":"gFACO,MAAMA,EAA8C"}

package/dist/components/CharacterCounter/constants.d.ts

@@ -0,0 +1 @@
+export declare const CHARACTER_COUNTER_SCREEN_READER_DEBOUNCE_MS = 500;

package/dist/components/CharacterCounter/constants.js

@@ -0,0 +1,5 @@
+const E = 500;
+export {
+  E as CHARACTER_COUNTER_SCREEN_READER_DEBOUNCE_MS
+};
+//# sourceMappingURL=constants.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"constants.js","sources":["../../../src/components/CharacterCounter/constants.ts"],"sourcesContent":["/** Debounce delay (ms) for screen reader message updates in the character counter */\nexport const CHARACTER_COUNTER_SCREEN_READER_DEBOUNCE_MS = 500;\n"],"names":["CHARACTER_COUNTER_SCREEN_READER_DEBOUNCE_MS"],"mappings":"AACO,MAAMA,IAA8C;"}

package/dist/components/CharacterCounter/index.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./CharacterCounter.cjs"),t=require("./useCharacterCounterState.cjs");exports.CharacterCounter=e.default;exports.useCharacterCounterState=t.useCharacterCounterState;
+//# sourceMappingURL=index.cjs.map

package/dist/components/CharacterCounter/index.cjs.map

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

package/dist/components/CharacterCounter/index.d.ts

@@ -0,0 +1,3 @@
+export { default as CharacterCounter } from './CharacterCounter';
+export type { CharacterCounterProps } from './types';
+export { useCharacterCounterState, type CharacterCounterState, type UseCharacterCounterStateProps, } from './useCharacterCounterState';

package/dist/components/CharacterCounter/index.js

@@ -0,0 +1,7 @@
+import { default as e } from "./CharacterCounter.js";
+import { useCharacterCounterState as o } from "./useCharacterCounterState.js";
+export {
+  e as CharacterCounter,
+  o as useCharacterCounterState
+};
+//# sourceMappingURL=index.js.map

package/dist/components/CharacterCounter/index.js.map

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

package/dist/components/CharacterCounter/types.d.ts

@@ -0,0 +1,6 @@
+import { RegisterType } from '../../hooks/useAriaIdRefs';
+import { TextAreaCounterRenderProps } from '../../types/textArea';
+export interface CharacterCounterProps extends TextAreaCounterRenderProps {
+    id: string;
+    registerAria: RegisterType;
+}

package/dist/components/CharacterCounter/useCharacterCounterState.cjs

@@ -0,0 +1,2 @@
+"use strict";"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const m=require("react"),P=require("../../hooks/styleProps.cjs"),R=require("../../hooks/useControlledModeGuard.cjs"),v=require("../../hooks/useDebouncedValue.cjs"),S=require("../../translations/defaults.cjs"),d=require("../../translations/replaceTranslationParams.cjs"),E=require("./constants.cjs"),u=S.defaultLabels.textArea.counter,f=(t,e)=>e!==void 0?`${t}/${e}`:String(t),b=(t,e)=>{if(e===void 0)return d.replaceTranslationParams(u.charactersEntered,{count:t});if(t===0)return d.replaceTranslationParams(u.canEnterUpTo,{maxLength:e});if(t>e){const a=t-e,n=a===1?u.characterOverLimit:u.charactersOverLimit;return d.replaceTranslationParams(n,{count:a})}const r=e-t,o=r===1?u.characterRemaining:u.charactersRemaining;return d.replaceTranslationParams(o,{count:r})},M=t=>{const{value:e,defaultValue:r,counterThreshold:o,hasCounter:a,onChange:n}=t,c=e!==void 0;R.useControlledModeGuard({componentName:"useCharacterCounterState",value:e,defaultValue:r});const[C,g]=m.useState(()=>c?e.length:r?.length??0),i=c?e.length:C,s=a===!0||o!==void 0,p=m.useCallback(l=>{!c&&s&&g(l.target.value.length),n?.(l)},[c,s,n]);return{counterProps:s?{counterThreshold:o,currentLength:i,hasCounter:a}:void 0,handleChange:p}},T=t=>{const{counterThreshold:e,currentLength:r,hasCounter:o,id:a,registerAria:n,...c}=t,{styleProps:C,props:g}=P.useStyleProps(c),i=o===!0||e!==void 0,s=`${a}__counterScreenReaderMessage`,p=f(r,e),h=b(r,e),l=v.useDebouncedValue(h,E.CHARACTER_COUNTER_SCREEN_READER_DEBOUNCE_MS);return m.useEffect(()=>{if(i)return n({add:s}),()=>{n({remove:s})}},[i,s,n]),{debouncedScreenReaderMessage:l,isVisible:i,screenReaderMessageId:s,styleProps:C,transferProps:g,visibleCounterText:p}};exports.useCharacterCounter=T;exports.useCharacterCounterState=M;
+//# sourceMappingURL=useCharacterCounterState.cjs.map

package/dist/components/CharacterCounter/useCharacterCounterState.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useCharacterCounterState.cjs","sources":["../../../src/components/CharacterCounter/useCharacterCounterState.ts"],"sourcesContent":["'use client';\n\nimport { type ChangeEvent, useCallback, useEffect, useState } from 'react';\nimport { type StylePropsResult, useControlledModeGuard, useDebouncedValue, useStyleProps } from '../../hooks';\nimport { defaultLabels, replaceTranslationParams } from '../../translations';\nimport { type TextAreaCounterRenderProps } from '../../types';\nimport { CHARACTER_COUNTER_SCREEN_READER_DEBOUNCE_MS } from './constants';\nimport { type CharacterCounterProps } from './types';\n\n/** Return value of the useCharacterCounterState hook */\nexport interface CharacterCounterState {\n  /** Props to pass to CharacterCounter, or undefined when counter is hidden */\n  counterProps: TextAreaCounterRenderProps | undefined;\n  /** Change handler that updates internal length and calls the provided onChange */\n  handleChange: (event: ChangeEvent<HTMLTextAreaElement>) => void;\n}\n\n/** Props for the useCharacterCounterState hook */\nexport interface UseCharacterCounterStateProps {\n  /** Character threshold shown after the slash in the counter (e.g. `5/200`); implicitly enables the counter */\n  counterThreshold?: number;\n  /** Initial value when uncontrolled */\n  defaultValue?: string;\n  /** Whether to show the character counter; automatically true when `counterThreshold` is set */\n  hasCounter?: boolean;\n  /** Called when the textarea value changes */\n  onChange?: (event: ChangeEvent<HTMLTextAreaElement>) => void;\n  /** Controlled value (takes precedence over defaultValue) */\n  value?: string;\n}\n\n/** Return value of the `useCharacterCounter` hook (visible + screen reader presentation for `CharacterCounter`). */\nexport interface UseCharacterCounterResult {\n  debouncedScreenReaderMessage: string;\n  isVisible: boolean;\n  screenReaderMessageId: string;\n  styleProps: StylePropsResult['styleProps'];\n  transferProps: StylePropsResult['props'];\n  visibleCounterText: string;\n}\n\nconst COUNTER_LABELS = defaultLabels.textArea.counter;\n\n/**\n * Builds the visible counter label (`current/max` or count only).\n *\n * @param currentLength - Current number of characters.\n * @param counterThreshold - When set, label includes a slash and this max; when omitted, only the count is shown.\n * @returns {string} Formatted string for the aria-hidden counter element.\n */\nconst getCharacterCounterVisibleText = (currentLength: number, counterThreshold: number | undefined): string =>\n  counterThreshold !== undefined ? `${currentLength}/${counterThreshold}` : String(currentLength);\n\n/**\n * Builds the polite live-region message for assistive technologies (remaining, over limit, count-only, etc.).\n *\n * @param currentLength - Current number of characters.\n * @param counterThreshold - When set, messages relate to this max; when omitted, only “characters entered” copy is used.\n * @returns {string} Localized screen reader string (not debounced).\n */\nconst getCharacterCounterScreenReaderMessage = (\n  currentLength: number,\n  counterThreshold: number | undefined,\n): string => {\n  if (counterThreshold === undefined) {\n    return replaceTranslationParams(COUNTER_LABELS.charactersEntered, { count: currentLength });\n  }\n\n  if (currentLength === 0) {\n    return replaceTranslationParams(COUNTER_LABELS.canEnterUpTo, { maxLength: counterThreshold });\n  }\n\n  if (currentLength > counterThreshold) {\n    const overCount = currentLength - counterThreshold;\n    const template = overCount === 1 ? COUNTER_LABELS.characterOverLimit : COUNTER_LABELS.charactersOverLimit;\n\n    return replaceTranslationParams(template, { count: overCount });\n  }\n\n  const remaining = counterThreshold - currentLength;\n  const template = remaining === 1 ? COUNTER_LABELS.characterRemaining : COUNTER_LABELS.charactersRemaining;\n\n  return replaceTranslationParams(template, { count: remaining });\n};\n\n/**\n * Tracks textarea length for `TextArea` and exposes `counterProps` plus a change handler when the counter is active.\n *\n * @param props - Controlled/uncontrolled value and counter flags; see {@link UseCharacterCounterStateProps}.\n * @returns {CharacterCounterState} Counter props for `CharacterCounter` (if visible) and textarea `onChange` handler.\n */\nexport const useCharacterCounterState = (props: UseCharacterCounterStateProps): CharacterCounterState => {\n  const { value, defaultValue, counterThreshold, hasCounter, onChange } = props;\n  const isControlled = value !== undefined;\n\n  useControlledModeGuard({\n    componentName: 'useCharacterCounterState',\n    value,\n    defaultValue,\n  });\n\n  const [internalLength, setInternalLength] = useState(() =>\n    isControlled ? value.length : (defaultValue?.length ?? 0),\n  );\n\n  const currentLength = isControlled ? value.length : internalLength;\n  const isCounterVisible = hasCounter === true || counterThreshold !== undefined;\n\n  const handleChange = useCallback(\n    (event: ChangeEvent<HTMLTextAreaElement>) => {\n      if (!isControlled && isCounterVisible) {\n        setInternalLength(event.target.value.length);\n      }\n      onChange?.(event);\n    },\n    [isControlled, isCounterVisible, onChange],\n  );\n\n  const counterProps: TextAreaCounterRenderProps | undefined = isCounterVisible\n    ? {\n        counterThreshold,\n        currentLength,\n        hasCounter,\n      }\n    : undefined;\n\n  return {\n    counterProps,\n    handleChange,\n  };\n};\n\n/**\n * Presentation hook for `CharacterCounter`: style props, visible text, debounced screen reader text, and ARIA id registration.\n *\n * @param props - Full `CharacterCounterProps` including `id` and `registerAria`.\n * @returns {UseCharacterCounterResult} Values to render the visible counter and `VisuallyHidden` live region.\n */\nexport const useCharacterCounter = (props: CharacterCounterProps): UseCharacterCounterResult => {\n  const { counterThreshold, currentLength, hasCounter, id, registerAria, ...restProps } = props;\n  const { styleProps, props: transferProps } = useStyleProps(restProps);\n  const isVisible = hasCounter === true || counterThreshold !== undefined;\n  const screenReaderMessageId = `${id}__counterScreenReaderMessage`;\n  const visibleCounterText = getCharacterCounterVisibleText(currentLength, counterThreshold);\n  const screenReaderMessage = getCharacterCounterScreenReaderMessage(currentLength, counterThreshold);\n  const debouncedScreenReaderMessage = useDebouncedValue(\n    screenReaderMessage,\n    CHARACTER_COUNTER_SCREEN_READER_DEBOUNCE_MS,\n  );\n\n  useEffect(() => {\n    if (isVisible) {\n      registerAria({ add: screenReaderMessageId });\n\n      return () => {\n        registerAria({ remove: screenReaderMessageId });\n      };\n    }\n\n    return undefined;\n  }, [isVisible, screenReaderMessageId, registerAria]);\n\n  return {\n    debouncedScreenReaderMessage,\n    isVisible,\n    screenReaderMessageId,\n    styleProps,\n    transferProps,\n    visibleCounterText,\n  };\n};\n"],"names":["COUNTER_LABELS","defaultLabels","getCharacterCounterVisibleText","currentLength","counterThreshold","getCharacterCounterScreenReaderMessage","replaceTranslationParams","overCount","template","remaining","useCharacterCounterState","props","value","defaultValue","hasCounter","onChange","isControlled","useControlledModeGuard","internalLength","setInternalLength","useState","isCounterVisible","handleChange","useCallback","event","useCharacterCounter","id","registerAria","restProps","styleProps","transferProps","useStyleProps","isVisible","screenReaderMessageId","visibleCounterText","screenReaderMessage","debouncedScreenReaderMessage","useDebouncedValue","CHARACTER_COUNTER_SCREEN_READER_DEBOUNCE_MS","useEffect"],"mappings":"wYAyCMA,EAAiBC,EAAAA,cAAc,SAAS,QASxCC,EAAiC,CAACC,EAAuBC,IAC7DA,IAAqB,OAAY,GAAGD,CAAa,IAAIC,CAAgB,GAAK,OAAOD,CAAa,EAS1FE,EAAyC,CAC7CF,EACAC,IACW,CACX,GAAIA,IAAqB,OACvB,OAAOE,EAAAA,yBAAyBN,EAAe,kBAAmB,CAAE,MAAOG,EAAe,EAG5F,GAAIA,IAAkB,EACpB,OAAOG,EAAAA,yBAAyBN,EAAe,aAAc,CAAE,UAAWI,EAAkB,EAG9F,GAAID,EAAgBC,EAAkB,CACpC,MAAMG,EAAYJ,EAAgBC,EAC5BI,EAAWD,IAAc,EAAIP,EAAe,mBAAqBA,EAAe,oBAEtF,OAAOM,EAAAA,yBAAyBE,EAAU,CAAE,MAAOD,EAAW,CAChE,CAEA,MAAME,EAAYL,EAAmBD,EAC/BK,EAAWC,IAAc,EAAIT,EAAe,mBAAqBA,EAAe,oBAEtF,OAAOM,EAAAA,yBAAyBE,EAAU,CAAE,MAAOC,EAAW,CAChE,EAQaC,EAA4BC,GAAgE,CACvG,KAAM,CAAE,MAAAC,EAAO,aAAAC,EAAc,iBAAAT,EAAkB,WAAAU,EAAY,SAAAC,GAAaJ,EAClEK,EAAeJ,IAAU,OAE/BK,yBAAuB,CACrB,cAAe,2BACf,MAAAL,EACA,aAAAC,CAAA,CACD,EAED,KAAM,CAACK,EAAgBC,CAAiB,EAAIC,EAAAA,SAAS,IACnDJ,EAAeJ,EAAM,OAAUC,GAAc,QAAU,CAAA,EAGnDV,EAAgBa,EAAeJ,EAAM,OAASM,EAC9CG,EAAmBP,IAAe,IAAQV,IAAqB,OAE/DkB,EAAeC,EAAAA,YAClBC,GAA4C,CACvC,CAACR,GAAgBK,GACnBF,EAAkBK,EAAM,OAAO,MAAM,MAAM,EAE7CT,IAAWS,CAAK,CAClB,EACA,CAACR,EAAcK,EAAkBN,CAAQ,CAAA,EAW3C,MAAO,CACL,aAT2DM,EACzD,CACE,iBAAAjB,EACA,cAAAD,EACA,WAAAW,CAAA,EAEF,OAIF,aAAAQ,CAAA,CAEJ,EAQaG,EAAuBd,GAA4D,CAC9F,KAAM,CAAE,iBAAAP,EAAkB,cAAAD,EAAe,WAAAW,EAAY,GAAAY,EAAI,aAAAC,EAAc,GAAGC,GAAcjB,EAClF,CAAA,WAAEkB,EAAY,MAAOC,CAAA,EAAkBC,EAAAA,cAAcH,CAAS,EAC9DI,EAAYlB,IAAe,IAAQV,IAAqB,OACxD6B,EAAwB,GAAGP,CAAE,+BAC7BQ,EAAqBhC,EAA+BC,EAAeC,CAAgB,EACnF+B,EAAsB9B,EAAuCF,EAAeC,CAAgB,EAC5FgC,EAA+BC,EAAAA,kBACnCF,EACAG,EAAAA,2CAAA,EAGFC,OAAAA,EAAAA,UAAU,IAAM,CACd,GAAIP,EACF,OAAAL,EAAa,CAAE,IAAKM,EAAuB,EAEpC,IAAM,CACXN,EAAa,CAAE,OAAQM,EAAuB,CAChD,CAIJ,EAAG,CAACD,EAAWC,EAAuBN,CAAY,CAAC,EAE5C,CACL,6BAAAS,EACA,UAAAJ,EACA,sBAAAC,EAAA,WACAJ,EACA,cAAAC,EACA,mBAAAI,CAAA,CAEJ"}

package/dist/components/CharacterCounter/useCharacterCounterState.d.ts

@@ -0,0 +1,25 @@
+import { ChangeEvent } from 'react';
+import { StylePropsResult } from '../../hooks';
+import { TextAreaCounterRenderProps } from '../../types';
+import { CharacterCounterProps } from './types';
+export interface CharacterCounterState {
+    counterProps: TextAreaCounterRenderProps | undefined;
+    handleChange: (event: ChangeEvent<HTMLTextAreaElement>) => void;
+}
+export interface UseCharacterCounterStateProps {
+    counterThreshold?: number;
+    defaultValue?: string;
+    hasCounter?: boolean;
+    onChange?: (event: ChangeEvent<HTMLTextAreaElement>) => void;
+    value?: string;
+}
+export interface UseCharacterCounterResult {
+    debouncedScreenReaderMessage: string;
+    isVisible: boolean;
+    screenReaderMessageId: string;
+    styleProps: StylePropsResult['styleProps'];
+    transferProps: StylePropsResult['props'];
+    visibleCounterText: string;
+}
+export declare const useCharacterCounterState: (props: UseCharacterCounterStateProps) => CharacterCounterState;
+export declare const useCharacterCounter: (props: CharacterCounterProps) => UseCharacterCounterResult;

package/dist/components/CharacterCounter/useCharacterCounterState.js

@@ -0,0 +1,66 @@
+"use client";
+import { useState as f, useCallback as R, useEffect as h } from "react";
+import { useStyleProps as v } from "../../hooks/styleProps.js";
+import { useControlledModeGuard as E } from "../../hooks/useControlledModeGuard.js";
+import { useDebouncedValue as S } from "../../hooks/useDebouncedValue.js";
+import { defaultLabels as b } from "../../translations/defaults.js";
+import { replaceTranslationParams as m } from "../../translations/replaceTranslationParams.js";
+import { CHARACTER_COUNTER_SCREEN_READER_DEBOUNCE_MS as _ } from "./constants.js";
+const i = b.textArea.counter, M = (t, e) => e !== void 0 ? `${t}/${e}` : String(t), P = (t, e) => {
+  if (e === void 0)
+    return m(i.charactersEntered, { count: t });
+  if (t === 0)
+    return m(i.canEnterUpTo, { maxLength: e });
+  if (t > e) {
+    const s = t - e, n = s === 1 ? i.characterOverLimit : i.charactersOverLimit;
+    return m(n, { count: s });
+  }
+  const r = e - t, a = r === 1 ? i.characterRemaining : i.charactersRemaining;
+  return m(a, { count: r });
+}, U = (t) => {
+  const { value: e, defaultValue: r, counterThreshold: a, hasCounter: s, onChange: n } = t, c = e !== void 0;
+  E({
+    componentName: "useCharacterCounterState",
+    value: e,
+    defaultValue: r
+  });
+  const [C, d] = f(
+    () => c ? e.length : r?.length ?? 0
+  ), u = c ? e.length : C, o = s === !0 || a !== void 0, p = R(
+    (l) => {
+      !c && o && d(l.target.value.length), n?.(l);
+    },
+    [c, o, n]
+  );
+  return {
+    counterProps: o ? {
+      counterThreshold: a,
+      currentLength: u,
+      hasCounter: s
+    } : void 0,
+    handleChange: p
+  };
+}, D = (t) => {
+  const { counterThreshold: e, currentLength: r, hasCounter: a, id: s, registerAria: n, ...c } = t, { styleProps: C, props: d } = v(c), u = a === !0 || e !== void 0, o = `${s}__counterScreenReaderMessage`, p = M(r, e), g = P(r, e), l = S(
+    g,
+    _
+  );
+  return h(() => {
+    if (u)
+      return n({ add: o }), () => {
+        n({ remove: o });
+      };
+  }, [u, o, n]), {
+    debouncedScreenReaderMessage: l,
+    isVisible: u,
+    screenReaderMessageId: o,
+    styleProps: C,
+    transferProps: d,
+    visibleCounterText: p
+  };
+};
+export {
+  D as useCharacterCounter,
+  U as useCharacterCounterState
+};
+//# sourceMappingURL=useCharacterCounterState.js.map

package/dist/components/CharacterCounter/useCharacterCounterState.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useCharacterCounterState.js","sources":["../../../src/components/CharacterCounter/useCharacterCounterState.ts"],"sourcesContent":["'use client';\n\nimport { type ChangeEvent, useCallback, useEffect, useState } from 'react';\nimport { type StylePropsResult, useControlledModeGuard, useDebouncedValue, useStyleProps } from '../../hooks';\nimport { defaultLabels, replaceTranslationParams } from '../../translations';\nimport { type TextAreaCounterRenderProps } from '../../types';\nimport { CHARACTER_COUNTER_SCREEN_READER_DEBOUNCE_MS } from './constants';\nimport { type CharacterCounterProps } from './types';\n\n/** Return value of the useCharacterCounterState hook */\nexport interface CharacterCounterState {\n  /** Props to pass to CharacterCounter, or undefined when counter is hidden */\n  counterProps: TextAreaCounterRenderProps | undefined;\n  /** Change handler that updates internal length and calls the provided onChange */\n  handleChange: (event: ChangeEvent<HTMLTextAreaElement>) => void;\n}\n\n/** Props for the useCharacterCounterState hook */\nexport interface UseCharacterCounterStateProps {\n  /** Character threshold shown after the slash in the counter (e.g. `5/200`); implicitly enables the counter */\n  counterThreshold?: number;\n  /** Initial value when uncontrolled */\n  defaultValue?: string;\n  /** Whether to show the character counter; automatically true when `counterThreshold` is set */\n  hasCounter?: boolean;\n  /** Called when the textarea value changes */\n  onChange?: (event: ChangeEvent<HTMLTextAreaElement>) => void;\n  /** Controlled value (takes precedence over defaultValue) */\n  value?: string;\n}\n\n/** Return value of the `useCharacterCounter` hook (visible + screen reader presentation for `CharacterCounter`). */\nexport interface UseCharacterCounterResult {\n  debouncedScreenReaderMessage: string;\n  isVisible: boolean;\n  screenReaderMessageId: string;\n  styleProps: StylePropsResult['styleProps'];\n  transferProps: StylePropsResult['props'];\n  visibleCounterText: string;\n}\n\nconst COUNTER_LABELS = defaultLabels.textArea.counter;\n\n/**\n * Builds the visible counter label (`current/max` or count only).\n *\n * @param currentLength - Current number of characters.\n * @param counterThreshold - When set, label includes a slash and this max; when omitted, only the count is shown.\n * @returns {string} Formatted string for the aria-hidden counter element.\n */\nconst getCharacterCounterVisibleText = (currentLength: number, counterThreshold: number | undefined): string =>\n  counterThreshold !== undefined ? `${currentLength}/${counterThreshold}` : String(currentLength);\n\n/**\n * Builds the polite live-region message for assistive technologies (remaining, over limit, count-only, etc.).\n *\n * @param currentLength - Current number of characters.\n * @param counterThreshold - When set, messages relate to this max; when omitted, only “characters entered” copy is used.\n * @returns {string} Localized screen reader string (not debounced).\n */\nconst getCharacterCounterScreenReaderMessage = (\n  currentLength: number,\n  counterThreshold: number | undefined,\n): string => {\n  if (counterThreshold === undefined) {\n    return replaceTranslationParams(COUNTER_LABELS.charactersEntered, { count: currentLength });\n  }\n\n  if (currentLength === 0) {\n    return replaceTranslationParams(COUNTER_LABELS.canEnterUpTo, { maxLength: counterThreshold });\n  }\n\n  if (currentLength > counterThreshold) {\n    const overCount = currentLength - counterThreshold;\n    const template = overCount === 1 ? COUNTER_LABELS.characterOverLimit : COUNTER_LABELS.charactersOverLimit;\n\n    return replaceTranslationParams(template, { count: overCount });\n  }\n\n  const remaining = counterThreshold - currentLength;\n  const template = remaining === 1 ? COUNTER_LABELS.characterRemaining : COUNTER_LABELS.charactersRemaining;\n\n  return replaceTranslationParams(template, { count: remaining });\n};\n\n/**\n * Tracks textarea length for `TextArea` and exposes `counterProps` plus a change handler when the counter is active.\n *\n * @param props - Controlled/uncontrolled value and counter flags; see {@link UseCharacterCounterStateProps}.\n * @returns {CharacterCounterState} Counter props for `CharacterCounter` (if visible) and textarea `onChange` handler.\n */\nexport const useCharacterCounterState = (props: UseCharacterCounterStateProps): CharacterCounterState => {\n  const { value, defaultValue, counterThreshold, hasCounter, onChange } = props;\n  const isControlled = value !== undefined;\n\n  useControlledModeGuard({\n    componentName: 'useCharacterCounterState',\n    value,\n    defaultValue,\n  });\n\n  const [internalLength, setInternalLength] = useState(() =>\n    isControlled ? value.length : (defaultValue?.length ?? 0),\n  );\n\n  const currentLength = isControlled ? value.length : internalLength;\n  const isCounterVisible = hasCounter === true || counterThreshold !== undefined;\n\n  const handleChange = useCallback(\n    (event: ChangeEvent<HTMLTextAreaElement>) => {\n      if (!isControlled && isCounterVisible) {\n        setInternalLength(event.target.value.length);\n      }\n      onChange?.(event);\n    },\n    [isControlled, isCounterVisible, onChange],\n  );\n\n  const counterProps: TextAreaCounterRenderProps | undefined = isCounterVisible\n    ? {\n        counterThreshold,\n        currentLength,\n        hasCounter,\n      }\n    : undefined;\n\n  return {\n    counterProps,\n    handleChange,\n  };\n};\n\n/**\n * Presentation hook for `CharacterCounter`: style props, visible text, debounced screen reader text, and ARIA id registration.\n *\n * @param props - Full `CharacterCounterProps` including `id` and `registerAria`.\n * @returns {UseCharacterCounterResult} Values to render the visible counter and `VisuallyHidden` live region.\n */\nexport const useCharacterCounter = (props: CharacterCounterProps): UseCharacterCounterResult => {\n  const { counterThreshold, currentLength, hasCounter, id, registerAria, ...restProps } = props;\n  const { styleProps, props: transferProps } = useStyleProps(restProps);\n  const isVisible = hasCounter === true || counterThreshold !== undefined;\n  const screenReaderMessageId = `${id}__counterScreenReaderMessage`;\n  const visibleCounterText = getCharacterCounterVisibleText(currentLength, counterThreshold);\n  const screenReaderMessage = getCharacterCounterScreenReaderMessage(currentLength, counterThreshold);\n  const debouncedScreenReaderMessage = useDebouncedValue(\n    screenReaderMessage,\n    CHARACTER_COUNTER_SCREEN_READER_DEBOUNCE_MS,\n  );\n\n  useEffect(() => {\n    if (isVisible) {\n      registerAria({ add: screenReaderMessageId });\n\n      return () => {\n        registerAria({ remove: screenReaderMessageId });\n      };\n    }\n\n    return undefined;\n  }, [isVisible, screenReaderMessageId, registerAria]);\n\n  return {\n    debouncedScreenReaderMessage,\n    isVisible,\n    screenReaderMessageId,\n    styleProps,\n    transferProps,\n    visibleCounterText,\n  };\n};\n"],"names":["COUNTER_LABELS","defaultLabels","getCharacterCounterVisibleText","currentLength","counterThreshold","getCharacterCounterScreenReaderMessage","replaceTranslationParams","overCount","template","remaining","useCharacterCounterState","props","value","defaultValue","hasCounter","onChange","isControlled","useControlledModeGuard","internalLength","setInternalLength","useState","isCounterVisible","handleChange","useCallback","event","useCharacterCounter","id","registerAria","restProps","styleProps","transferProps","useStyleProps","isVisible","screenReaderMessageId","visibleCounterText","screenReaderMessage","debouncedScreenReaderMessage","useDebouncedValue","CHARACTER_COUNTER_SCREEN_READER_DEBOUNCE_MS","useEffect"],"mappings":";;;;;;;;AAyCA,MAAMA,IAAiBC,EAAc,SAAS,SASxCC,IAAiC,CAACC,GAAuBC,MAC7DA,MAAqB,SAAY,GAAGD,CAAa,IAAIC,CAAgB,KAAK,OAAOD,CAAa,GAS1FE,IAAyC,CAC7CF,GACAC,MACW;AACX,MAAIA,MAAqB;AACvB,WAAOE,EAAyBN,EAAe,mBAAmB,EAAE,OAAOG,GAAe;AAG5F,MAAIA,MAAkB;AACpB,WAAOG,EAAyBN,EAAe,cAAc,EAAE,WAAWI,GAAkB;AAG9F,MAAID,IAAgBC,GAAkB;AACpC,UAAMG,IAAYJ,IAAgBC,GAC5BI,IAAWD,MAAc,IAAIP,EAAe,qBAAqBA,EAAe;AAEtF,WAAOM,EAAyBE,GAAU,EAAE,OAAOD,GAAW;AAAA,EAChE;AAEA,QAAME,IAAYL,IAAmBD,GAC/BK,IAAWC,MAAc,IAAIT,EAAe,qBAAqBA,EAAe;AAEtF,SAAOM,EAAyBE,GAAU,EAAE,OAAOC,GAAW;AAChE,GAQaC,IAA2B,CAACC,MAAgE;AACvG,QAAM,EAAE,OAAAC,GAAO,cAAAC,GAAc,kBAAAT,GAAkB,YAAAU,GAAY,UAAAC,MAAaJ,GAClEK,IAAeJ,MAAU;AAE/B,EAAAK,EAAuB;AAAA,IACrB,eAAe;AAAA,IACf,OAAAL;AAAA,IACA,cAAAC;AAAA,EAAA,CACD;AAED,QAAM,CAACK,GAAgBC,CAAiB,IAAIC;AAAA,IAAS,MACnDJ,IAAeJ,EAAM,SAAUC,GAAc,UAAU;AAAA,EAAA,GAGnDV,IAAgBa,IAAeJ,EAAM,SAASM,GAC9CG,IAAmBP,MAAe,MAAQV,MAAqB,QAE/DkB,IAAeC;AAAA,IACnB,CAACC,MAA4C;AAC3C,MAAI,CAACR,KAAgBK,KACnBF,EAAkBK,EAAM,OAAO,MAAM,MAAM,GAE7CT,IAAWS,CAAK;AAAA,IAClB;AAAA,IACA,CAACR,GAAcK,GAAkBN,CAAQ;AAAA,EAAA;AAW3C,SAAO;AAAA,IACL,cAT2DM,IACzD;AAAA,MACE,kBAAAjB;AAAA,MACA,eAAAD;AAAA,MACA,YAAAW;AAAA,IAAA,IAEF;AAAA,IAIF,cAAAQ;AAAA,EAAA;AAEJ,GAQaG,IAAsB,CAACd,MAA4D;AAC9F,QAAM,EAAE,kBAAAP,GAAkB,eAAAD,GAAe,YAAAW,GAAY,IAAAY,GAAI,cAAAC,GAAc,GAAGC,MAAcjB,GAClF,EAAE,YAAAkB,GAAY,OAAOC,EAAA,IAAkBC,EAAcH,CAAS,GAC9DI,IAAYlB,MAAe,MAAQV,MAAqB,QACxD6B,IAAwB,GAAGP,CAAE,gCAC7BQ,IAAqBhC,EAA+BC,GAAeC,CAAgB,GACnF+B,IAAsB9B,EAAuCF,GAAeC,CAAgB,GAC5FgC,IAA+BC;AAAA,IACnCF;AAAA,IACAG;AAAA,EAAA;AAGF,SAAAC,EAAU,MAAM;AACd,QAAIP;AACF,aAAAL,EAAa,EAAE,KAAKM,GAAuB,GAEpC,MAAM;AACX,QAAAN,EAAa,EAAE,QAAQM,GAAuB;AAAA,MAChD;AAAA,EAIJ,GAAG,CAACD,GAAWC,GAAuBN,CAAY,CAAC,GAE5C;AAAA,IACL,8BAAAS;AAAA,IACA,WAAAJ;AAAA,IACA,uBAAAC;AAAA,IACA,YAAAJ;AAAA,IACA,eAAAC;AAAA,IACA,oBAAAI;AAAA,EAAA;AAEJ;"}

package/dist/components/CharacterCounter.d.ts

@@ -0,0 +1,2 @@
+export * from './CharacterCounter/index'
+export {}

package/dist/components/Checkbox/Checkbox.cjs

@@ -0,0 +1,2 @@
+"use strict";"use client";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),j=require("classnames"),k=require("react"),C=require("../../hooks/styleProps.cjs"),d=require("../../hooks/useAriaIdRefs.cjs"),R=require("../Field/HelperText.cjs"),g=require("../Field/Label.cjs"),V=require("../Field/ValidationText.cjs"),F=require("../Field/useValidationTextRole.cjs"),I=require("../InputDetails/InputDetails.cjs"),$=require("./useCheckboxStyleProps.cjs"),B=(n,u)=>{const{classProps:s,props:p}=$.useCheckboxStyleProps(n),{"aria-describedby":x="","aria-details":h,details:a,hasValidationIcon:b,helperText:y,id:t,isChecked:m,isDisabled:q,isRequired:P,label:N,validationState:i,validationText:l,value:T,...f}=p,{styleProps:o,props:v}=C.useStyleProps(f),[A,c]=d.useAriaDescribedBy(x),[D,S]=d.useAriaDetails(h),_=F.useValidationTextRole({validationState:i,validationText:l});return e.jsxs("div",{style:o.style,className:j(s.root,o.className),children:[e.jsx("input",{...v,...A,...D,type:"checkbox",id:t,className:s.input,disabled:q,required:P,checked:m,value:T,ref:u}),e.jsxs("div",{className:s.text,children:[e.jsx(g.default,{UNSAFE_className:s.label,htmlFor:t,children:N}),a&&e.jsx(I.default,{id:`${t}-details`,registerAriaDetails:S,children:a}),e.jsx(R.default,{UNSAFE_className:s.helperText,id:`${t}__helperText`,registerAria:c,helperText:y}),i&&e.jsx(V.default,{UNSAFE_className:s.validationText,id:`${t}__validationText`,...b&&{hasValidationStateIcon:i},validationText:l,registerAria:c,role:_})]})]})},r=k.forwardRef(B);r.spiritComponent="Checkbox";r.displayName="Checkbox";exports.default=r;
+//# sourceMappingURL=Checkbox.cjs.map

package/dist/components/Checkbox/Checkbox.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Checkbox.cjs","sources":["../../../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["'use client';\n\nimport classNames from 'classnames';\nimport React, { type ForwardedRef, forwardRef } from 'react';\nimport { useAriaDescribedBy, useAriaDetails, useStyleProps } from '../../hooks';\nimport { type ForwardRefComponent, type SpiritCheckboxProps } from '../../types';\nimport { HelperText, Label, ValidationText } from '../Field';\nimport { useValidationTextRole } from '../Field/useValidationTextRole';\nimport { InputDetails } from '../InputDetails';\nimport { useCheckboxStyleProps } from './useCheckboxStyleProps';\n\nconst _Checkbox = (props: SpiritCheckboxProps, ref: ForwardedRef<HTMLInputElement>): JSX.Element => {\n  const { classProps, props: modifiedProps } = useCheckboxStyleProps(props);\n  const {\n    'aria-describedby': ariaDescribedBy = '',\n    'aria-details': ariaDetailsAttr,\n    details,\n    hasValidationIcon,\n    helperText,\n    id,\n    isChecked,\n    isDisabled,\n    isRequired,\n    label,\n    validationState,\n    validationText,\n    value,\n    ...restProps\n  } = modifiedProps;\n  const { styleProps, props: otherProps } = useStyleProps(restProps);\n  const [ariaDescribedByProp, register] = useAriaDescribedBy(ariaDescribedBy);\n  const [ariaDetailsProp, registerDetails] = useAriaDetails(ariaDetailsAttr);\n  const validationTextRole = useValidationTextRole({\n    validationState,\n    validationText,\n  });\n\n  return (\n    <div style={styleProps.style} className={classNames(classProps.root, styleProps.className)}>\n      <input\n        {...otherProps}\n        {...ariaDescribedByProp}\n        {...ariaDetailsProp}\n        type=\"checkbox\"\n        id={id}\n        className={classProps.input}\n        disabled={isDisabled}\n        required={isRequired}\n        checked={isChecked}\n        value={value}\n        ref={ref}\n      />\n      <div className={classProps.text}>\n        <Label UNSAFE_className={classProps.label} htmlFor={id}>\n          {label}\n        </Label>\n        {details && (\n          <InputDetails id={`${id}-details`} registerAriaDetails={registerDetails}>\n            {details}\n          </InputDetails>\n        )}\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            id={`${id}__validationText`}\n            {...(hasValidationIcon && { hasValidationStateIcon: validationState })}\n            validationText={validationText}\n            registerAria={register}\n            role={validationTextRole}\n          />\n        )}\n      </div>\n    </div>\n  );\n};\n\nconst Checkbox = forwardRef<HTMLInputElement, SpiritCheckboxProps>(_Checkbox) as ForwardRefComponent<\n  HTMLInputElement,\n  SpiritCheckboxProps\n>;\n\nCheckbox.spiritComponent = 'Checkbox';\nCheckbox.displayName = 'Checkbox';\n\nexport default Checkbox;\n"],"names":["_Checkbox","props","ref","classProps","modifiedProps","useCheckboxStyleProps","ariaDescribedBy","ariaDetailsAttr","details","hasValidationIcon","helperText","id","isChecked","isDisabled","isRequired","label","validationState","validationText","value","restProps","styleProps","otherProps","useStyleProps","ariaDescribedByProp","register","useAriaDescribedBy","ariaDetailsProp","registerDetails","useAriaDetails","validationTextRole","useValidationTextRole","jsxs","classNames","jsx","Label","InputDetails","HelperText","ValidationText","Checkbox","forwardRef"],"mappings":"ihBAWMA,EAAY,CAACC,EAA4BC,IAAqD,CAClG,KAAM,CAAE,WAAAC,EAAY,MAAOC,CAAA,EAAkBC,EAAAA,sBAAsBJ,CAAK,EAClE,CACJ,mBAAoBK,EAAkB,GACtC,eAAgBC,EAChB,QAAAC,EACA,kBAAAC,EACA,WAAAC,EACA,GAAAC,EACA,UAAAC,EACA,WAAAC,EACA,WAAAC,EACA,MAAAC,EACA,gBAAAC,EACA,eAAAC,EACA,MAAAC,EACA,GAAGC,CAAA,EACDf,EACE,CAAA,WAAEgB,EAAY,MAAOC,CAAA,EAAeC,EAAAA,cAAcH,CAAS,EAC3D,CAACI,EAAqBC,CAAQ,EAAIC,EAAAA,mBAAmBnB,CAAe,EACpE,CAACoB,EAAiBC,CAAe,EAAIC,EAAAA,eAAerB,CAAe,EACnEsB,EAAqBC,EAAAA,sBAAsB,CAC/C,gBAAAd,EACA,eAAAC,CAAA,CACD,EAED,OACEc,EAAAA,KAAC,MAAA,CAAI,MAAOX,EAAW,MAAO,UAAWY,EAAW7B,EAAW,KAAMiB,EAAW,SAAS,EACvF,SAAA,CAAAa,EAAAA,IAAC,QAAA,CACE,GAAGZ,EACH,GAAGE,EACH,GAAGG,EACJ,KAAK,WACL,GAAAf,EACA,UAAWR,EAAW,MACtB,SAAUU,EACV,SAAUC,EACV,QAASF,EACT,MAAAM,EACA,IAAAhB,CAAA,CAAA,EAEF6B,EAAAA,KAAC,MAAA,CAAI,UAAW5B,EAAW,KACzB,SAAA,CAAA8B,MAACC,EAAAA,SAAM,iBAAkB/B,EAAW,MAAO,QAASQ,EACjD,SAAAI,EACH,EACCP,SACE2B,EAAAA,QAAA,CAAa,GAAI,GAAGxB,CAAE,WAAY,oBAAqBgB,EACrD,SAAAnB,CAAA,CACH,EAEFyB,EAAAA,IAACG,EAAAA,QAAA,CACC,iBAAkBjC,EAAW,WAC7B,GAAI,GAAGQ,CAAE,eACT,aAAca,EACd,WAAAd,CAAA,CAAA,EAEDM,GACCiB,EAAAA,IAACI,EAAAA,QAAA,CACC,iBAAkBlC,EAAW,eAC7B,GAAI,GAAGQ,CAAE,mBACR,GAAIF,GAAqB,CAAE,uBAAwBO,CAAA,EACpD,eAAAC,EACA,aAAcO,EACd,KAAMK,CAAA,CAAA,CACR,CAAA,CAEJ,CAAA,EACF,CAEJ,EAEMS,EAAWC,EAAAA,WAAkDvC,CAAS,EAK5EsC,EAAS,gBAAkB,WAC3BA,EAAS,YAAc"}

package/dist/components/Checkbox/Checkbox.d.ts

@@ -0,0 +1,3 @@
+import { ForwardRefComponent, SpiritCheckboxProps } from '../../types';
+declare const Checkbox: ForwardRefComponent<HTMLInputElement, SpiritCheckboxProps>;
+export default Checkbox;

package/dist/components/Checkbox/Checkbox.js

@@ -0,0 +1,81 @@
+"use client";
+import { jsxs as c, jsx as r } from "react/jsx-runtime";
+import S from "classnames";
+import { forwardRef as g } from "react";
+import { useStyleProps as F } from "../../hooks/styleProps.js";
+import { useAriaDescribedBy as R, useAriaDetails as V } from "../../hooks/useAriaIdRefs.js";
+import B from "../Field/HelperText.js";
+import E from "../Field/Label.js";
+import I from "../Field/ValidationText.js";
+import { useValidationTextRole as U } from "../Field/useValidationTextRole.js";
+import $ from "../InputDetails/InputDetails.js";
+import { useCheckboxStyleProps as j } from "./useCheckboxStyleProps.js";
+const q = (p, m) => {
+  const { classProps: e, props: n } = j(p), {
+    "aria-describedby": x = "",
+    "aria-details": h,
+    details: s,
+    hasValidationIcon: b,
+    helperText: f,
+    id: i,
+    isChecked: u,
+    isDisabled: N,
+    isRequired: y,
+    label: D,
+    validationState: t,
+    validationText: a,
+    value: T,
+    ...A
+  } = n, { styleProps: o, props: P } = F(A), [k, l] = R(x), [v, _] = V(h), C = U({
+    validationState: t,
+    validationText: a
+  });
+  return /* @__PURE__ */ c("div", { style: o.style, className: S(e.root, o.className), children: [
+    /* @__PURE__ */ r(
+      "input",
+      {
+        ...P,
+        ...k,
+        ...v,
+        type: "checkbox",
+        id: i,
+        className: e.input,
+        disabled: N,
+        required: y,
+        checked: u,
+        value: T,
+        ref: m
+      }
+    ),
+    /* @__PURE__ */ c("div", { className: e.text, children: [
+      /* @__PURE__ */ r(E, { UNSAFE_className: e.label, htmlFor: i, children: D }),
+      s && /* @__PURE__ */ r($, { id: `${i}-details`, registerAriaDetails: _, children: s }),
+      /* @__PURE__ */ r(
+        B,
+        {
+          UNSAFE_className: e.helperText,
+          id: `${i}__helperText`,
+          registerAria: l,
+          helperText: f
+        }
+      ),
+      t && /* @__PURE__ */ r(
+        I,
+        {
+          UNSAFE_className: e.validationText,
+          id: `${i}__validationText`,
+          ...b && { hasValidationStateIcon: t },
+          validationText: a,
+          registerAria: l,
+          role: C
+        }
+      )
+    ] })
+  ] });
+}, d = g(q);
+d.spiritComponent = "Checkbox";
+d.displayName = "Checkbox";
+export {
+  d as default
+};
+//# sourceMappingURL=Checkbox.js.map