@clicktap/ui 2.4.4 → 2.4.6

package/components/Accordion/Accordion.d.ts

@@ -1,19 +1,4 @@
 import { ComponentType, ReactNode } from 'react';
-/**
- * Native accordion on react-aria-components Disclosure (CTAP-1383).
- *
- * Previously a styled wrapper around @heroui/accordion — the ONLY
- * initially-rendered @heroui consumer (the PLP filter sidebar), which pulled
- * the whole @heroui system + theme (~25 KiB gz) into every page's initial JS.
- * react-aria-components is already this library's base, so the rewrite costs
- * nothing new. API-compatible with the call sites this repo uses:
- * selectionMode / defaultSelectedKeys ("all" included), per-item title,
- * subtitle, startContent, indicator (component, receives nothing, rotates on
- * open), classNames slots, showDivider (an <hr> between items — consumers
- * hide it with [&_hr]:hidden), onPress, and the `data-open` attribute on
- * heading/trigger/indicator that consumers style with data-[open=true]:.
- * Height animates with the CSS grid-rows trick — no animation runtime.
- */
 type ItemSlotClassNames = {
     base?: string;
     heading?: string;
@@ -38,6 +23,8 @@ export type AccordionItemProps = {
     hideIndicator?: boolean;
     disableIndicatorAnimation?: boolean;
     isDisabled?: boolean;
+    /** Overrides the Accordion's keepContentMounted for this item. */
+    keepContentMounted?: boolean;
     textValue?: string;
     'aria-label'?: string;
     classNames?: ItemSlotClassNames;
@@ -53,6 +40,10 @@ export type AccordionProps = {
     selectedKeys?: 'all' | Iterable<string>;
     onSelectionChange?: (keys: Set<string>) => void;
     disallowEmptySelection?: boolean;
+    /**
+     * Keep every collapsed item's content mounted (and server-rendered). Off by
+     * default: a collapsed item renders its content only while expanded.
+     */
     keepContentMounted?: boolean;
     /** Hide every item's indicator (heroui group-level prop). */
     hideIndicator?: boolean;
@@ -73,6 +64,6 @@ export type AccordionProps = {
  * did not change.
  */
 export declare function AccordionItem(_props: AccordionItemProps): null;
-export declare function Accordion({ children, selectionMode, defaultSelectedKeys, defaultExpandedKeys, selectedKeys, onSelectionChange, disallowEmptySelection, hideIndicator: groupHideIndicator, showDivider, dividerProps, variant, isCompact, className, itemClasses, }: AccordionProps): import("react/jsx-runtime").JSX.Element;
+export declare function Accordion({ children, selectionMode, defaultSelectedKeys, defaultExpandedKeys, selectedKeys, onSelectionChange, disallowEmptySelection, keepContentMounted: groupKeepContentMounted, hideIndicator: groupHideIndicator, showDivider, dividerProps, variant, isCompact, className, itemClasses, }: AccordionProps): import("react/jsx-runtime").JSX.Element;
 export default Accordion;
 export declare function AccordionItemArrow(): import("react/jsx-runtime").JSX.Element;

package/components/Accordion/Accordion.js

@@ -1 +1 @@
-"use client";import{jsx as e,jsxs as d,Fragment as O}from"react/jsx-runtime";import{Children as V,isValidElement as _,Fragment as q}from"react";import{DisclosureGroup as H,Disclosure as J,Button as L,DisclosurePanel as Q}from"react-aria-components";import{cn as r}from"../../utils/cn.js";import{DownArrow as y}from"../Icon/DownArrow.js";function E(p){return null}function C({children:p,selectionMode:N="single",defaultSelectedKeys:w,defaultExpandedKeys:k,selectedKeys:A,onSelectionChange:I,disallowEmptySelection:v=!1,hideIndicator:D=!1,showDivider:S=!0,dividerProps:K,variant:i,isCompact:s,className:F,itemClasses:n}){const c=V.toArray(p).filter(_),b=(t,l)=>String(t.key??l).replace(/^\.\$/,"").replace(/=2/g,":").replace(/=0/g,"="),j=c.map(b),h=t=>t==="all"?j:t?[...t].map(String):void 0,P=h(w??k)??[],W=h(A);return e(H,{allowsMultipleExpanded:N==="multiple",defaultExpandedKeys:P,expandedKeys:W,onExpandedChange:t=>{const l=new Set([...t].map(String));v&&l.size===0||I?.(l)},className:r("px-0",i==="bordered"&&["px-4 py-4 rounded-xl border-2 border-border-subtle"],i==="shadow"&&["px-4 py-4 rounded-xl bg-surface-subtle border border-border-subtle"],F),children:c.map((t,l)=>{const f=b(t,l),{title:$,subtitle:m,startContent:g,indicator:u,hideIndicator:z,disableIndicatorAnimation:x,isDisabled:B,classNames:o,onPress:G,children:M}=t.props;return d(q,{children:[e(J,{id:f,isDisabled:B,className:r("w-full py-2","data-disabled:pointer-events-none data-disabled:opacity-50",i==="bordered"&&["rounded-xl py-0"],i==="splitted"&&["flex flex-col bg-surface-subtle rounded-xl border border-border-subtle"],s&&"py-0",n?.base,o?.base),children:({isExpanded:a})=>d(O,{children:[e("h2",{"data-open":a||void 0,className:r(n?.heading,o?.heading),children:d(L,{slot:"trigger","data-open":a||void 0,onPress:G,"aria-label":t.props["aria-label"],className:r("w-full h-full flex items-center gap-3 py-0 appearance-none cursor-pointer select-none","border-0 focus-visible:outline-2 focus-visible:outline focus-visible:outline-border-subtle","bg-transparent text-inherit",s&&["py-2"],n?.trigger,o?.trigger),children:[g!=null&&e("span",{className:r("shrink-0",n?.startContent,o?.startContent),children:g}),d("span",{className:r("flex-1 text-left",n?.titleWrapper,o?.titleWrapper),children:[e("span",{className:r("block text-xl font-semibold",s&&"text-base",n?.title,o?.title),children:$}),m!=null&&e("span",{className:r("block text-base",s&&"text-sm",n?.subtitle,o?.subtitle),children:m})]}),z||D?null:e("span",{"aria-hidden":"true","data-open":a||void 0,className:r("shrink-0",!x&&"transition-transform duration-200",!x&&a&&"-rotate-180",n?.indicator,o?.indicator),children:typeof u=="function"?e(u,{isOpen:a}):u??e(y,{className:"w-4 h-4"})})]})}),e("div",{className:r("grid transition-[grid-template-rows] duration-200 ease-in-out",a?"grid-rows-[1fr]":"grid-rows-[0fr]"),children:e("div",{className:"overflow-hidden min-h-0",children:e(Q,{className:r(s?"py-1":"py-2",n?.content,o?.content),children:M})})})]})}),S&&l<c.length-1&&e("hr",{className:r("border-solid border-b-0 border-x-0",K?.className??["my-2 border-border-subtle",i==="shadow"&&"border-border"])})]},f)})})}function ee(){return e(y,{className:"w-4 h-4"})}export{C as Accordion,E as AccordionItem,ee as AccordionItemArrow,C as default};
+"use client";import{jsx as e,jsxs as b,Fragment as G}from"react/jsx-runtime";import{Children as V,isValidElement as q,Fragment as H,useState as D,useEffect as J}from"react";import{DisclosureGroup as Q,Disclosure as R,Button as U,DisclosurePanel as X}from"react-aria-components";import{cn as r}from"../../utils/cn.js";import{DownArrow as M}from"../Icon/DownArrow.js";const Y=200;function oe(n){return null}function le({children:n,selectionMode:f="single",defaultSelectedKeys:m,defaultExpandedKeys:h,selectedKeys:d,onSelectionChange:c,disallowEmptySelection:g=!1,keepContentMounted:y=!1,hideIndicator:s=!1,showDivider:K=!0,dividerProps:P,variant:u,isCompact:p,className:T,itemClasses:o}){const x=V.toArray(n).filter(q),w=(t,a)=>String(t.key??a).replace(/^\.\$/,"").replace(/=2/g,":").replace(/=0/g,"="),F=x.map(w),k=t=>t==="all"?F:t?[...t].map(String):void 0,W=k(m??h)??[],j=k(d);return e(Q,{allowsMultipleExpanded:f==="multiple",defaultExpandedKeys:W,expandedKeys:j,onExpandedChange:t=>{const a=new Set([...t].map(String));g&&a.size===0||c?.(a)},className:r("px-0",u==="bordered"&&["px-4 py-4 rounded-xl border-2 border-border-subtle"],u==="shadow"&&["px-4 py-4 rounded-xl bg-surface-subtle border border-border-subtle"],T),children:x.map((t,a)=>{const A=w(t,a),{title:L,subtitle:S,startContent:I,indicator:N,hideIndicator:O,disableIndicatorAnimation:v,isDisabled:_,keepContentMounted:$,classNames:l,onPress:z,children:B}=t.props;return b(H,{children:[e(R,{id:A,isDisabled:_,className:r("w-full py-2","data-disabled:pointer-events-none data-disabled:opacity-50",u==="bordered"&&["rounded-xl py-0"],u==="splitted"&&["flex flex-col bg-surface-subtle rounded-xl border border-border-subtle"],p&&"py-0",o?.base,l?.base),children:({isExpanded:i})=>b(G,{children:[e("h2",{"data-open":i||void 0,className:r(o?.heading,l?.heading),children:b(U,{slot:"trigger","data-open":i||void 0,onPress:z,"aria-label":t.props["aria-label"],className:r("w-full h-full flex items-center gap-3 py-0 appearance-none cursor-pointer select-none","border-0 focus-visible:outline-2 focus-visible:outline focus-visible:outline-border-subtle","bg-transparent text-inherit",p&&["py-2"],o?.trigger,l?.trigger),children:[I!=null&&e("span",{className:r("shrink-0",o?.startContent,l?.startContent),children:I}),b("span",{className:r("flex-1 text-left",o?.titleWrapper,l?.titleWrapper),children:[e("span",{className:r("block text-xl font-semibold",p&&"text-base",o?.title,l?.title),children:L}),S!=null&&e("span",{className:r("block text-base",p&&"text-sm",o?.subtitle,l?.subtitle),children:S})]}),O||s?null:e("span",{"aria-hidden":"true","data-open":i||void 0,className:r("shrink-0",!v&&"transition-transform duration-200",!v&&i&&"-rotate-180",o?.indicator,l?.indicator),children:typeof N=="function"?e(N,{isOpen:i}):N??e(M,{className:"w-4 h-4"})})]})}),e(Z,{isExpanded:i,keepContentMounted:$??y,className:r(p?"py-1":"py-2",o?.content,l?.content),children:B})]})}),K&&a<x.length-1&&e("hr",{className:r("border-solid border-b-0 border-x-0",P?.className??["my-2 border-border-subtle",u==="shadow"&&"border-border"])})]},A)})})}function Z({isExpanded:n,keepContentMounted:f,className:m,children:h}){const[d,c]=D(!1),[g,y]=D(n);return g!==n&&(y(n),c(!n)),J(()=>{if(!d)return;const s=setTimeout(()=>c(!1),Y+50);return()=>clearTimeout(s)},[d]),e("div",{className:r("grid transition-[grid-template-rows] duration-200 ease-in-out",n?"grid-rows-[1fr]":"grid-rows-[0fr]"),onTransitionEnd:s=>{s.target===s.currentTarget&&!n&&c(!1)},children:e("div",{className:"overflow-hidden min-h-0",children:e(X,{className:m,children:f||n||d?h:null})})})}function ae(){return e(M,{className:"w-4 h-4"})}export{le as Accordion,oe as AccordionItem,ae as AccordionItemArrow,le as default};

package/components/Checkbox/Checkbox.js

@@ -1 +1 @@
-"use client";import{jsx as n,jsxs as c,Fragment as h}from"react/jsx-runtime";import{Checkbox as s}from"react-aria-components";import{cn as l}from"../../utils/cn.js";function x({control:e,isHovered:u,isFocused:a,isDisabled:t,isIndeterminate:r,isInvalid:o,isSelected:b,isPressed:f,classNames:d,...g}){return e?typeof e=="function"?e({isHovered:u,isFocused:a,isDisabled:t,isIndeterminate:r,isInvalid:o,isSelected:b,isPressed:f,...g}):e:n("div",{className:l("flex items-center justify-center","w-6 h-6","border border-solid border-border rounded","transition-all duration-200 ease-in-out","checkbox-control",u&&["border-border-emphasis"],a&&["border-border-emphasis outline-2 outline outline-border-subtle"],(t||t&&r)&&["border-border-subtle bg-surface-subtle"],o&&["bg-surface-subtle text-danger border-danger-soft"],o&&u&&["border-danger"],o&&a&&["border-danger outline-danger-ring"],o&&b&&r&&["bg-danger-soft border-danger-soft"],o&&b&&r&&f&&["bg-danger border-danger"],(b||r)&&["border-border bg-border"],(b||r)&&f&&["border-border-emphasis bg-border-emphasis"],d?.control),children:n("svg",{viewBox:"0 0 18 18","aria-hidden":"true",style:{strokeDasharray:"22px",strokeDashoffset:b||r?44:66},className:l("w-4 h-4 fill-none","stroke-white stroke-[3px]","transition-all duration-200 ease-in-out",t&&r&&["stroke-none fill-border"],r&&["stroke-none fill-white"]),children:r?n("rect",{x:1,y:7.5,width:15,height:3}):n("polyline",{points:"1 9 7 14 15 4"})})})}function w({children:e,slots:u,className:a,classNames:t,...r}){return n(s,{className:l("flex items-center gap-2 cursor-pointer","text-xs text-fg-muted forced-color-adjust-none disabled:text-fg-subtle disabled:cursor-not-allowed group","invalid:text-danger-soft",a),...r,children:o=>c(h,{children:[n(x,{control:u?.control,classNames:t,...o}),typeof e=="function"?e(o):e]})})}export{w as Checkbox,w as default};
+"use client";import{jsx as n,jsxs as c,Fragment as h}from"react/jsx-runtime";import{Checkbox as s}from"react-aria-components";import{cn as l}from"../../utils/cn.js";function x({control:e,isHovered:a,isFocused:u,isDisabled:t,isIndeterminate:r,isInvalid:o,isSelected:b,isPressed:f,classNames:d,...g}){return e?typeof e=="function"?e({isHovered:a,isFocused:u,isDisabled:t,isIndeterminate:r,isInvalid:o,isSelected:b,isPressed:f,...g}):e:n("div",{className:l("flex items-center justify-center","w-6 h-6","border border-solid border-border rounded","transition-all duration-200 ease-in-out","checkbox-control",a&&["border-border-emphasis"],u&&["border-border-emphasis outline-2 outline outline-border-subtle"],(t||t&&r)&&["border-border-subtle bg-surface-subtle"],o&&["bg-surface-subtle text-danger border-danger-soft"],o&&a&&["border-danger"],o&&u&&["border-danger outline-danger-ring"],o&&b&&r&&["bg-danger-soft border-danger-soft"],o&&b&&r&&f&&["bg-danger border-danger"],(b||r)&&["border-border bg-border"],(b||r)&&f&&["border-border-emphasis bg-border-emphasis"],d?.control),children:n("svg",{viewBox:"0 0 18 18","aria-hidden":"true",style:{strokeDasharray:"22px",strokeDashoffset:b||r?44:66},className:l("w-4 h-4 fill-none","stroke-white stroke-[3px]","transition-all duration-200 ease-in-out",t&&r&&["stroke-none fill-border"],r&&["stroke-none fill-white"]),children:r?n("rect",{x:1,y:7.5,width:15,height:3}):n("polyline",{points:"1 9 7 14 15 4"})})})}function w({children:e,slots:a,className:u,classNames:t,...r}){return n(s,{className:l("flex items-center gap-2 cursor-pointer","text-xs text-fg-muted forced-color-adjust-none disabled:text-fg-subtle disabled:cursor-not-allowed group","data-[invalid]:text-danger-soft",u),...r,children:o=>c(h,{children:[n(x,{control:a?.control,classNames:t,...o}),typeof e=="function"?e(o):e]})})}export{w as Checkbox,w as default};

package/components/CreditCardExpirationInput/CreditCardExpirationInput.js

@@ -1 +1 @@
-"use client";import{jsxs as N,jsx as o}from"react/jsx-runtime";import{N as V}from"../../assets/react-number-format.es-Bf_lGveD.js";import{TextField as v,Label as I,Text as C,FieldError as F,Input as $}from"react-aria-components";import{useState as j}from"react";import{cn as t}from"../../utils/cn.js";function w({className:a,...n}){return o($,{className:t("border-solid border border-border rounded-md","text-sm text-fg placeholder-fg-subtle","h-10 px-2 py-0 m-0 w-full","bg-surface","transition-all duration-200 ease-in-out","hover:border-border-emphasis","focus:outline-2 focus:outline focus:outline-border-subtle focus:border-border-emphasis","disabled:border-border-subtle disabled:bg-surface-subtle","invalid:border-danger-soft invalid:bg-danger-surface invalid:text-danger","invalid:hover:border-danger invalid:focus:border-danger invalid:focus:outline-danger-ring",a),...n})}function L({label:a,description:n,errorMessage:i,placeholder:s,value:u,className:d,classNames:l,onChange:f,...m}){const[b,c]=j(""),x=u??b,g=r=>{if(r==="")return"";let e=r.substring(0,2);const h=r.substring(2,4);return e.length===1&&Number(e[0])>1?e=`0${e[0]}`:e.length===2&&(Number(e)===0?e="01":Number(e)>12&&(e="12")),`${e}/${h}`},p=r=>{c(r.formattedValue),f?.(r.formattedValue)};return N(v,{className:t("flex flex-col w-full text-fg",d),...m,children:[o(I,{className:t("flex text-fg-muted text-xs",l?.label),children:a}),o(V,{format:g,customInput:w,className:t(l?.input),placeholder:s,value:x,onValueChange:p}),n&&o(C,{className:t("flex text-fg-muted text-sm",l?.description),slot:"description",children:n}),o(F,{className:t("flex text-danger-soft text-sm",l?.error),children:i})]})}export{L as CreditCardExpirationInput,L as default};
+"use client";import{jsxs as N,jsx as a}from"react/jsx-runtime";import{N as V}from"../../assets/react-number-format.es-Bf_lGveD.js";import{TextField as v,Label as I,Text as C,FieldError as F,Input as $}from"react-aria-components";import{useState as j}from"react";import{cn as t}from"../../utils/cn.js";function w({className:l,...o}){return a($,{className:t("border-solid border border-border rounded-md","text-sm text-fg placeholder-fg-subtle","h-10 px-2 py-0 m-0 w-full","bg-surface","transition-all duration-200 ease-in-out","hover:border-border-emphasis","focus:outline-2 focus:outline focus:outline-border-subtle focus:border-border-emphasis","disabled:border-border-subtle disabled:bg-surface-subtle","data-[invalid]:border-danger-soft data-[invalid]:bg-danger-surface data-[invalid]:text-danger","data-[invalid]:hover:border-danger data-[invalid]:focus:border-danger data-[invalid]:focus:outline-danger-ring",l),...o})}function L({label:l,description:o,errorMessage:d,placeholder:i,value:s,className:u,classNames:n,onChange:f,...m}){const[b,c]=j(""),x=s??b,g=r=>{if(r==="")return"";let e=r.substring(0,2);const h=r.substring(2,4);return e.length===1&&Number(e[0])>1?e=`0${e[0]}`:e.length===2&&(Number(e)===0?e="01":Number(e)>12&&(e="12")),`${e}/${h}`},p=r=>{c(r.formattedValue),f?.(r.formattedValue)};return N(v,{className:t("flex flex-col w-full text-fg",u),...m,children:[a(I,{className:t("flex text-fg-muted text-xs",n?.label),children:l}),a(V,{format:g,customInput:w,className:t(n?.input),placeholder:i,value:x,onValueChange:p}),o&&a(C,{className:t("flex text-fg-muted text-sm",n?.description),slot:"description",children:o}),a(F,{className:t("flex text-danger-soft text-sm",n?.error),children:d})]})}export{L as CreditCardExpirationInput,L as default};

package/components/CreditCardInput/CreditCardInput.js

@@ -1 +1 @@
-"use client";import{jsxs as I,jsx as l}from"react/jsx-runtime";import{useState as N}from"react";import{N as P}from"../../assets/react-number-format.es-Bf_lGveD.js";import{TextField as j,Label as w,Text as L,FieldError as T,Input as k}from"react-aria-components";import{cn as t}from"../../utils/cn.js";const m=a=>{const s=[{regex:/^4[0-9]{0,15}/,format:"#### #### #### ####"},{regex:/^5[1-5][0-9]{0,14}/,format:"#### #### #### ####"},{regex:/^3[47][0-9]{0,13}/,format:"#### ###### #####"},{regex:/^6(?:011|5[0-9]{2})[0-9]{0,12}/,format:"#### #### #### ####"},{regex:/^3(?:0[0-5]|[68][0-9])[0-9]{0,11}/,format:"#### ###### ####"},{regex:/^(?:2131|1800|35\d{3})\d{0,11}/,format:"#### #### #### ####"}].find(f=>f.regex.test(a));return s?s.format:"#### #### #### #### ###"};function y({className:a,...o}){return l(k,{className:t("border-solid border border-border rounded-md","text-sm text-fg placeholder-fg-subtle","h-10 px-2 py-0 m-0 w-full","bg-surface","transition-all duration-200 ease-in-out","hover:border-border-emphasis","focus:outline-2 focus:outline focus:outline-border-subtle focus:border-border-emphasis","disabled:border-border-subtle disabled:bg-surface-subtle","invalid:border-danger-soft invalid:bg-danger-surface invalid:text-danger","invalid:hover:border-danger invalid:focus:border-danger invalid:focus:outline-danger-ring",a),...o})}function z({label:a,description:o,errorMessage:s,placeholder:f,value:g,onChange:x,className:b,classNames:d,...p}){const[h,v]=N(""),V=g??h,F=i=>{if(i==="")return"";const e=i.replace(/\s+/g,""),u=m(e);let n="",r=0;for(let c=0;c<u.length;c+=1)if(u[c]==="#")if(r<e.length)n+=e[r],r+=1;else break;else n+=u[c];return n},C=i=>{const e=i.value.replace(/\s+/g,""),n=m(e).replace(/[^#]/g,"").length,r=e.slice(0,n);v(r),x?.(r)};return I(j,{className:t("flex flex-col w-full text-fg",b),...p,children:[l(w,{className:t("flex text-fg-muted text-sm",d?.label),children:a}),l(P,{value:V,format:F,customInput:y,className:t(d?.input),placeholder:f,onValueChange:C}),o&&l(L,{className:t("flex text-fg-muted text-sm",d?.description),slot:"description",children:o}),l(T,{className:t("flex text-danger-soft text-sm",d?.error),children:s})]})}export{z as CreditCardInput,z as default};
+"use client";import{jsxs as I,jsx as l}from"react/jsx-runtime";import{useState as N}from"react";import{N as P}from"../../assets/react-number-format.es-Bf_lGveD.js";import{TextField as j,Label as w,Text as L,FieldError as T,Input as k}from"react-aria-components";import{cn as r}from"../../utils/cn.js";const m=a=>{const d=[{regex:/^4[0-9]{0,15}/,format:"#### #### #### ####"},{regex:/^5[1-5][0-9]{0,14}/,format:"#### #### #### ####"},{regex:/^3[47][0-9]{0,13}/,format:"#### ###### #####"},{regex:/^6(?:011|5[0-9]{2})[0-9]{0,12}/,format:"#### #### #### ####"},{regex:/^3(?:0[0-5]|[68][0-9])[0-9]{0,11}/,format:"#### ###### ####"},{regex:/^(?:2131|1800|35\d{3})\d{0,11}/,format:"#### #### #### ####"}].find(f=>f.regex.test(a));return d?d.format:"#### #### #### #### ###"};function y({className:a,...o}){return l(k,{className:r("border-solid border border-border rounded-md","text-sm text-fg placeholder-fg-subtle","h-10 px-2 py-0 m-0 w-full","bg-surface","transition-all duration-200 ease-in-out","hover:border-border-emphasis","focus:outline-2 focus:outline focus:outline-border-subtle focus:border-border-emphasis","disabled:border-border-subtle disabled:bg-surface-subtle","data-[invalid]:border-danger-soft data-[invalid]:bg-danger-surface data-[invalid]:text-danger","data-[invalid]:hover:border-danger data-[invalid]:focus:border-danger data-[invalid]:focus:outline-danger-ring",a),...o})}function z({label:a,description:o,errorMessage:d,placeholder:f,value:g,onChange:x,className:b,classNames:s,...p}){const[h,v]=N(""),V=g??h,F=i=>{if(i==="")return"";const e=i.replace(/\s+/g,""),u=m(e);let n="",t=0;for(let c=0;c<u.length;c+=1)if(u[c]==="#")if(t<e.length)n+=e[t],t+=1;else break;else n+=u[c];return n},C=i=>{const e=i.value.replace(/\s+/g,""),n=m(e).replace(/[^#]/g,"").length,t=e.slice(0,n);v(t),x?.(t)};return I(j,{className:r("flex flex-col w-full text-fg",b),...p,children:[l(w,{className:r("flex text-fg-muted text-sm",s?.label),children:a}),l(P,{value:V,format:F,customInput:y,className:r(s?.input),placeholder:f,onValueChange:C}),o&&l(L,{className:r("flex text-fg-muted text-sm",s?.description),slot:"description",children:o}),l(T,{className:r("flex text-danger-soft text-sm",s?.error),children:d})]})}export{z as CreditCardInput,z as default};

package/components/DateInput/DateInput.js

@@ -1 +1 @@
-"use client";import{jsxs as s,jsx as r}from"react/jsx-runtime";import{DateField as u,Label as f,DateInput as c,DateSegment as b,Text as g,FieldError as x}from"react-aria-components";import{cn as e}from"../../utils/cn.js";function v({label:a,description:i,errorMessage:o,className:d,classNames:t,...n}){return s(u,{className:e("text-fg",d),...n,children:[r(f,{className:e("flex text-fg-muted text-xs",t?.label),children:a}),r(c,{className:e("flex items-center","border-solid border border-border rounded-md","text-sm text-fg","h-10 px-1 py-0 m-0 w-full","bg-surface","transition-all duration-200 ease-in-out","hover:border-border-emphasis","focus-within:outline-2 focus-within:outline focus-within:outline-border-subtle focus-within:border-border-emphasis","disabled:border-border-subtle disabled:bg-surface-subtle","invalid:border-danger-soft invalid:bg-danger-surface invalid:text-danger","invalid:hover:border-danger invalid:focus-within:border-danger invalid:focus-within:outline-danger-ring",t?.input),children:l=>r(b,{segment:l,className:e("p-1 tabular-nums text-end text-fg","invalid:text-danger-soft","disabled:cursor-default disabled:select-none disabled:text-fg-subtle","focus:text-fg focus:bg-border-subtle focus:outline-0 focus:rounded-md focus:caret-transparent focus:invalid:bg-danger-soft focus:invalid:text-fg-inverse","type-literal:p-0","data-[placeholder]:text-fg-subtle data-[placeholder]:invalid:text-danger-soft data-[placeholder]:invalid:focus:text-fg-inverse","aria-[readonly]:focus-visible:outline aria-[readonly]:focus-visible:outline-fg-muted aria-[readonly]:focus-visible:outline-1","aria-[readonly]:focus:outline aria-[readonly]:focus:outline-fg-muted aria-[readonly]:focus:bg-transparent aria-[readonly]:focus:outline-2",t?.segment)})}),i&&r(g,{className:e("flex text-fg-muted text-sm",t?.description),slot:"description",children:i}),r(x,{className:e("flex text-danger-soft text-sm",t?.error),children:o})]})}export{v as DateInput,v as default};
+"use client";import{jsxs as s,jsx as a}from"react/jsx-runtime";import{DateField as u,Label as f,DateInput as c,DateSegment as b,Text as g,FieldError as x}from"react-aria-components";import{cn as e}from"../../utils/cn.js";function v({label:d,description:r,errorMessage:i,className:o,classNames:t,...n}){return s(u,{className:e("text-fg",o),...n,children:[a(f,{className:e("flex text-fg-muted text-xs",t?.label),children:d}),a(c,{className:e("flex items-center","border-solid border border-border rounded-md","text-sm text-fg","h-10 px-1 py-0 m-0 w-full","bg-surface","transition-all duration-200 ease-in-out","hover:border-border-emphasis","focus-within:outline-2 focus-within:outline focus-within:outline-border-subtle focus-within:border-border-emphasis","disabled:border-border-subtle disabled:bg-surface-subtle","data-[invalid]:border-danger-soft data-[invalid]:bg-danger-surface data-[invalid]:text-danger","data-[invalid]:hover:border-danger data-[invalid]:focus-within:border-danger data-[invalid]:focus-within:outline-danger-ring",t?.input),children:l=>a(b,{segment:l,className:e("p-1 tabular-nums text-end text-fg","data-[invalid]:text-danger-soft","disabled:cursor-default disabled:select-none disabled:text-fg-subtle","focus:text-fg focus:bg-border-subtle focus:outline-0 focus:rounded-md focus:caret-transparent focus:data-[invalid]:bg-danger-soft focus:data-[invalid]:text-fg-inverse","type-literal:p-0","data-[placeholder]:text-fg-subtle data-[placeholder]:data-[invalid]:text-danger-soft data-[placeholder]:data-[invalid]:focus:text-fg-inverse","aria-[readonly]:focus-visible:outline aria-[readonly]:focus-visible:outline-fg-muted aria-[readonly]:focus-visible:outline-1","aria-[readonly]:focus:outline aria-[readonly]:focus:outline-fg-muted aria-[readonly]:focus:bg-transparent aria-[readonly]:focus:outline-2",t?.segment)})}),r&&a(g,{className:e("flex text-fg-muted text-sm",t?.description),slot:"description",children:r}),a(x,{className:e("flex text-danger-soft text-sm",t?.error),children:i})]})}export{v as DateInput,v as default};

package/components/DobInput/DobInput.js

@@ -1 +1 @@
-"use client";import{jsxs as j,jsx as o}from"react/jsx-runtime";import{useId as w,useState as C}from"react";import{TextField as k,Label as y,FieldError as A,Input as B}from"react-aria-components";import{N as D}from"../../assets/react-number-format.es-Bf_lGveD.js";import{cn as r}from"../../utils/cn.js";function E({className:l,...s}){return o(B,{className:r("peer h-11",l),...s})}function z({label:l,description:s,errorMessage:u,type:m,className:p,classNames:n,id:f,value:g,onChange:h,...x}){const c=w(),[V,v]=C(""),I=g??V,F=e=>{if(e==="")return"";const b=e.replace(/\s+/g,""),a="##-##-####";let i="",d=0;for(let t=0;t<a.length;t+=1)if(a[t]==="#")if(d<b.length)i+=b[d],d+=1;else break;else i+=a[t];return i},N=e=>{v(e.formattedValue),h?.(e.formattedValue)};return j(k,{className:r("flex flex-col w-full text-fg",p),type:m,...x,children:[o(y,{className:r("flex text-fg-muted text-xs",n?.label),htmlFor:f||c,children:l}),o(D,{id:f||c,value:I,format:F,customInput:E,className:r("border-solid border border-border rounded-md","text-sm text-fg placeholder-fg-subtle","h-10 px-2 py-0 m-0 w-full","bg-surface","transition-all duration-200 ease-in-out","hover:border-border-emphasis","focus:outline-2 focus:outline focus:outline-border-subtle focus:border-border-emphasis","disabled:border-border-subtle disabled:bg-surface-subtle","invalid:border-danger-soft invalid:bg-danger-surface invalid:text-danger","invalid:hover:border-danger invalid:focus:border-danger invalid:focus:outline-danger-ring",n?.input),onValueChange:N}),u&&o(A,{className:r(n?.error),children:u})]})}export{z as DobInput,z as default};
+"use client";import{jsxs as j,jsx as a}from"react/jsx-runtime";import{useId as w,useState as C}from"react";import{TextField as k,Label as y,FieldError as A,Input as B}from"react-aria-components";import{N as D}from"../../assets/react-number-format.es-Bf_lGveD.js";import{cn as r}from"../../utils/cn.js";function E({className:o,...s}){return a(B,{className:r("peer h-11",o),...s})}function z({label:o,description:s,errorMessage:u,type:m,className:p,classNames:l,id:f,value:g,onChange:h,...x}){const c=w(),[V,v]=C(""),I=g??V,F=e=>{if(e==="")return"";const b=e.replace(/\s+/g,""),n="##-##-####";let d="",i=0;for(let t=0;t<n.length;t+=1)if(n[t]==="#")if(i<b.length)d+=b[i],i+=1;else break;else d+=n[t];return d},N=e=>{v(e.formattedValue),h?.(e.formattedValue)};return j(k,{className:r("flex flex-col w-full text-fg",p),type:m,...x,children:[a(y,{className:r("flex text-fg-muted text-xs",l?.label),htmlFor:f||c,children:o}),a(D,{id:f||c,value:I,format:F,customInput:E,className:r("border-solid border border-border rounded-md","text-sm text-fg placeholder-fg-subtle","h-10 px-2 py-0 m-0 w-full","bg-surface","transition-all duration-200 ease-in-out","hover:border-border-emphasis","focus:outline-2 focus:outline focus:outline-border-subtle focus:border-border-emphasis","disabled:border-border-subtle disabled:bg-surface-subtle","data-[invalid]:border-danger-soft data-[invalid]:bg-danger-surface data-[invalid]:text-danger","data-[invalid]:hover:border-danger data-[invalid]:focus:border-danger data-[invalid]:focus:outline-danger-ring",l?.input),onValueChange:N}),u&&a(A,{className:r(l?.error),children:u})]})}export{z as DobInput,z as default};

package/components/Input/Input.js

@@ -1 +1 @@
-"use client";import{jsxs as s,jsx as e}from"react/jsx-runtime";import{Label as f,TextField as v,Input as k,Text as L,FieldError as C}from"react-aria-components";import{forwardRef as I,useState as N}from"react";import{cn as r}from"../../utils/cn.js";import{Skeleton as M}from"../Skeleton/Skeleton.js";import S from"../../hooks/useIsClient.js";function j({className:t}){return s("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24",strokeWidth:1.5,stroke:"currentColor",className:t,children:[e("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M2.036 12.322a1.012 1.012 0 0 1 0-.639C3.423 7.51 7.36 4.5 12 4.5c4.64 0 8.577 3.007 9.963 7.178.07.207.07.431 0 .639C20.577 16.49 16.64 19.5 12 19.5c-4.64 0-8.577-3.007-9.963-7.178Z"}),e("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z"})]})}function y({className:t}){return e("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24",strokeWidth:1.5,stroke:"currentColor",className:t,children:e("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M3.98 8.223A10.477 10.477 0 0 0 1.934 12C3.226 16.338 7.244 19.5 12 19.5c.993 0 1.953-.138 2.863-.395M6.228 6.228A10.451 10.451 0 0 1 12 4.5c4.756 0 8.773 3.162 10.065 7.498a10.522 10.522 0 0 1-4.293 5.774M6.228 6.228 3 3m3.228 3.228 3.65 3.65m7.894 7.894L21 21m-3.228-3.228-3.65-3.65m0 0a3 3 0 1 0-4.243-4.243m4.242 4.242L9.88 9.88"})})}function E({className:t}){return e(M,{className:r("w-full h-10 rounded-md z-20 relative",t)})}const W=I(({inputProps:t,label:l,description:a,errorMessage:m,placeholder:p,className:u,classNames:o,disableSkeleton:x,type:c,...h},b)=>{const g=S(),d=c==="password",[n,w]=N(!1);return!g&&!x?s("div",{className:r("flex flex-col w-full text-fg",u),children:[l?e(f,{className:r("flex text-fg-muted text-xs",o?.label),children:l}):null,e(E,{className:o?.skeleton})]}):s(v,{className:r("flex flex-col w-full text-fg",u),type:d?n?"text":"password":c,...h,children:[e(f,{className:r("flex text-fg-muted text-xs",o?.label),children:l}),s("div",{className:"relative",children:[e(k,{ref:b,placeholder:p,className:r("border-solid border border-border rounded-md","text-sm text-fg placeholder-fg-subtle","h-10 px-2 py-0 m-0 w-full","bg-surface","transition-all duration-200 ease-in-out","hover:border-border-emphasis","focus:outline-2 focus:outline focus:outline-border-subtle focus:border-border-emphasis","disabled:border-border-subtle disabled:bg-surface-subtle","invalid:border-danger-soft invalid:bg-danger-surface invalid:text-danger","invalid:hover:border-danger invalid:focus:border-danger invalid:focus:outline-danger-ring",d&&"pr-10",o?.input),...t}),d&&e("button",{type:"button",className:"absolute right-2 top-1/2 -translate-y-1/2 p-1 text-fg-subtle hover:text-fg-muted bg-transparent border-none cursor-pointer select-none",onMouseDown:i=>i.preventDefault(),onClick:()=>w(i=>!i),"aria-label":n?"Hide password":"Show password","aria-pressed":n,children:n?e(y,{className:"w-5 h-5"}):e(j,{className:"w-5 h-5"})})]}),a&&e(L,{className:r("flex text-fg-muted text-sm",o?.description),slot:"description",children:a}),e(C,{className:r("flex text-danger-soft text-sm",o?.error),children:m})]})});export{W as Input,W as default};
+"use client";import{jsxs as s,jsx as e}from"react/jsx-runtime";import{Label as f,TextField as v,Input as k,Text as L,FieldError as C}from"react-aria-components";import{forwardRef as I,useState as N}from"react";import{cn as r}from"../../utils/cn.js";import{Skeleton as M}from"../Skeleton/Skeleton.js";import S from"../../hooks/useIsClient.js";function j({className:t}){return s("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24",strokeWidth:1.5,stroke:"currentColor",className:t,children:[e("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M2.036 12.322a1.012 1.012 0 0 1 0-.639C3.423 7.51 7.36 4.5 12 4.5c4.64 0 8.577 3.007 9.963 7.178.07.207.07.431 0 .639C20.577 16.49 16.64 19.5 12 19.5c-4.64 0-8.577-3.007-9.963-7.178Z"}),e("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z"})]})}function y({className:t}){return e("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24",strokeWidth:1.5,stroke:"currentColor",className:t,children:e("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M3.98 8.223A10.477 10.477 0 0 0 1.934 12C3.226 16.338 7.244 19.5 12 19.5c.993 0 1.953-.138 2.863-.395M6.228 6.228A10.451 10.451 0 0 1 12 4.5c4.756 0 8.773 3.162 10.065 7.498a10.522 10.522 0 0 1-4.293 5.774M6.228 6.228 3 3m3.228 3.228 3.65 3.65m7.894 7.894L21 21m-3.228-3.228-3.65-3.65m0 0a3 3 0 1 0-4.243-4.243m4.242 4.242L9.88 9.88"})})}function E({className:t}){return e(M,{className:r("w-full h-10 rounded-md z-20 relative",t)})}const W=I(({inputProps:t,label:a,description:i,errorMessage:m,placeholder:p,className:u,classNames:o,disableSkeleton:x,type:c,...h},b)=>{const g=S(),l=c==="password",[n,w]=N(!1);return!g&&!x?s("div",{className:r("flex flex-col w-full text-fg",u),children:[a?e(f,{className:r("flex text-fg-muted text-xs",o?.label),children:a}):null,e(E,{className:o?.skeleton})]}):s(v,{className:r("flex flex-col w-full text-fg",u),type:l?n?"text":"password":c,...h,children:[e(f,{className:r("flex text-fg-muted text-xs",o?.label),children:a}),s("div",{className:"relative",children:[e(k,{ref:b,placeholder:p,className:r("border-solid border border-border rounded-md","text-sm text-fg placeholder-fg-subtle","h-10 px-2 py-0 m-0 w-full","bg-surface","transition-all duration-200 ease-in-out","hover:border-border-emphasis","focus:outline-2 focus:outline focus:outline-border-subtle focus:border-border-emphasis","disabled:border-border-subtle disabled:bg-surface-subtle","data-[invalid]:border-danger-soft data-[invalid]:bg-danger-surface data-[invalid]:text-danger","data-[invalid]:hover:border-danger data-[invalid]:focus:border-danger data-[invalid]:focus:outline-danger-ring",l&&"pr-10",o?.input),...t}),l&&e("button",{type:"button",className:"absolute right-2 top-1/2 -translate-y-1/2 p-1 text-fg-subtle hover:text-fg-muted bg-transparent border-none cursor-pointer select-none",onMouseDown:d=>d.preventDefault(),onClick:()=>w(d=>!d),"aria-label":n?"Hide password":"Show password","aria-pressed":n,children:n?e(y,{className:"w-5 h-5"}):e(j,{className:"w-5 h-5"})})]}),i&&e(L,{className:r("flex text-fg-muted text-sm",o?.description),slot:"description",children:i}),e(C,{className:r("flex text-danger-soft text-sm",o?.error),children:m})]})});export{W as Input,W as default};

package/components/NumberInput/NumberInput.js

@@ -1 +1 @@
-"use client";import{jsxs as u,jsx as e}from"react/jsx-runtime";import{NumberField as p,Label as h,Group as m,Button as a,Input as x,Text as v,FieldError as w}from"react-aria-components";import{cn as r}from"../../utils/cn.js";const k=e("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:e("path",{d:"M5 12H19",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})}),y=e("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:e("path",{d:"M12 5V19M5 12H19",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})});function L({label:b,description:n,errorMessage:c,isInvalid:d,isReadOnly:i,slots:s,className:g,classNames:o,...f}){const t=["group-hover:border-border-emphasis","group-disabled:border-border-subtle","group-invalid:border-danger-soft group-invalid:bg-danger-surface group-invalid:text-danger","group-invalid:group-hover:border-danger","group-invalid:group-focus:border-danger"],l=["flex items-center justify-center shrink-0","rounded-md border-solid border","font-semibold text-sm","w-10 h-10 py-0 px-0 cursor-pointer disabled:cursor-default","transition-all duration-200 ease-in-out","focus:outline-2 focus:outline focus:outline-border-subtle pressed:scale-95","bg-transparent hover:bg-transparent focus:bg-transparent disabled:bg-transparent","border-border hover:border-border-emphasis focus:border-border-emphasis disabled:border-border-subtle","text-fg disabled:text-fg-muted","group-aria-readonly:bg-surface-subtle group-aria-readonly:text-fg-muted group-aria-readonly:border-border-subtle group-aria-readonly:cursor-default"];return u(p,{isInvalid:d,isReadOnly:i,className:r("flex flex-col w-full",g),...f,children:[e(h,{className:r("flex text-fg-muted text-sm",o?.label),children:b}),u(m,{isInvalid:d,"aria-readonly":i,className:r("flex rounded-md group","focus-within:outline-2 focus-within:outline focus-within:outline-border-subtle","focus-within:invalid:outline-2 focus-within:invalid:outline focus-within:invalid:outline-border-subtle","disabled:bg-surface-subtle",o?.group),children:[e(a,{slot:"decrement",className:r(l,t,"border-r-0 rounded-r-none",o?.decrementBtn),children:s?.decrementIcon||k}),e(x,{className:r("border-solid border border-border text-center","text-sm text-fg placeholder-fg-subtle","h-10 px-2 py-0 m-0 w-full","bg-surface","transition-all duration-200 ease-in-out","hover:border-border-emphasis","focus:outline-0 focus:border-border-emphasis","disabled:border-border-subtle disabled:bg-surface-subtle","invalid:border-danger-soft invalid:bg-danger-surface invalid:text-danger","invalid:hover:border-danger invalid:focus:border-danger",t,o?.input)}),e(a,{slot:"increment",className:r(l,t,"border-l-0 rounded-l-none",o?.incrementBtn),children:s?.incrementIcon||y})]}),n&&e(v,{className:r("flex text-fg-muted text-sm",o?.description),slot:"description",children:n}),e(w,{className:r("flex text-danger-soft text-sm",o?.error),children:c})]})}export{L as NumberInput,L as default};
+"use client";import{jsxs as l,jsx as e}from"react/jsx-runtime";import{NumberField as p,Label as h,Group as m,Button as u,Input as x,Text as v,FieldError as w}from"react-aria-components";import{cn as r}from"../../utils/cn.js";const k=e("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:e("path",{d:"M5 12H19",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})}),y=e("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:e("path",{d:"M12 5V19M5 12H19",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})});function L({label:b,description:d,errorMessage:c,isInvalid:n,isReadOnly:a,slots:i,className:g,classNames:o,...f}){const t=["group-hover:border-border-emphasis","group-disabled:border-border-subtle","group-data-[invalid]:border-danger-soft group-data-[invalid]:bg-danger-surface group-data-[invalid]:text-danger","group-data-[invalid]:group-hover:border-danger","group-data-[invalid]:group-focus:border-danger"],s=["flex items-center justify-center shrink-0","rounded-md border-solid border","font-semibold text-sm","w-10 h-10 py-0 px-0 cursor-pointer disabled:cursor-default","transition-all duration-200 ease-in-out","focus:outline-2 focus:outline focus:outline-border-subtle pressed:scale-95","bg-transparent hover:bg-transparent focus:bg-transparent disabled:bg-transparent","border-border hover:border-border-emphasis focus:border-border-emphasis disabled:border-border-subtle","text-fg disabled:text-fg-muted","group-aria-readonly:bg-surface-subtle group-aria-readonly:text-fg-muted group-aria-readonly:border-border-subtle group-aria-readonly:cursor-default"];return l(p,{isInvalid:n,isReadOnly:a,className:r("flex flex-col w-full",g),...f,children:[e(h,{className:r("flex text-fg-muted text-sm",o?.label),children:b}),l(m,{isInvalid:n,"aria-readonly":a,className:r("flex rounded-md group","focus-within:outline-2 focus-within:outline focus-within:outline-border-subtle","focus-within:data-[invalid]:outline-2 focus-within:data-[invalid]:outline focus-within:data-[invalid]:outline-border-subtle","disabled:bg-surface-subtle",o?.group),children:[e(u,{slot:"decrement",className:r(s,t,"border-r-0 rounded-r-none",o?.decrementBtn),children:i?.decrementIcon||k}),e(x,{className:r("border-solid border border-border text-center","text-sm text-fg placeholder-fg-subtle","h-10 px-2 py-0 m-0 w-full","bg-surface","transition-all duration-200 ease-in-out","hover:border-border-emphasis","focus:outline-0 focus:border-border-emphasis","disabled:border-border-subtle disabled:bg-surface-subtle","data-[invalid]:border-danger-soft data-[invalid]:bg-danger-surface data-[invalid]:text-danger","data-[invalid]:hover:border-danger data-[invalid]:focus:border-danger",t,o?.input)}),e(u,{slot:"increment",className:r(s,t,"border-l-0 rounded-l-none",o?.incrementBtn),children:i?.incrementIcon||y})]}),d&&e(v,{className:r("flex text-fg-muted text-sm",o?.description),slot:"description",children:d}),e(w,{className:r("flex text-danger-soft text-sm",o?.error),children:c})]})}export{L as NumberInput,L as default};

package/components/Radio/Radio.js

@@ -1 +1 @@
-"use client";import{jsx as t,jsxs as g,Fragment as v}from"react/jsx-runtime";import{Radio as p}from"react-aria-components";import{cn as s}from"../../utils/cn.js";function m({control:e,classNames:i,isHovered:d,isFocused:r,isFocusVisible:n,isDisabled:a,isInvalid:u,isSelected:o,isPressed:l,isReadOnly:b,isRequired:f,defaultChildren:h,...x}){const c={isHovered:d,isFocused:r,isFocusVisible:n,isDisabled:a,isInvalid:u,isSelected:o,isPressed:l,isReadOnly:b,isRequired:f};return e?typeof e=="function"?e(c):e:t("div",{"data-hovered":d,"data-focused":r,"data-disabled":a,"data-invalid":u,"data-selected":o,"data-pressed":l,className:s("flex items-center justify-center w-6 h-6  border-solid border border-border ransition-all duration-300 ease rounded-full",'data-[hovered="true"]:border-border-emphasis','data-[focused="true"]:border-border-emphasis data-[focused="true"]:outline-2 data-[focused="true"]:outline data-[focused="true"]:outline-border-subtle','data-[disabled="true"]:border-border-subtle data-[disabled="true"]:bg-surface-subtle','data-[invalid="true"]:bg-danger-surface data-[invalid="true"]:text-danger data-[invalid="true"]:border-danger-soft','data-[invalid="true"]:data-[disabled="true"]:border-danger-ring data-[invalid="true"]:data-[disabled="true"]:bg-danger-surface','data-[invalid="true"]:data-[hovered="true"]:border-danger','data-[invalid="true"]:data-[focused="true"]:border-danger data-[invalid="true"]:data-[focused="true"]:outline-danger-ring','data-[invalid="true"]:data-[selected="true"]:bg-danger-surface data-[invalid="true"]:data-[selected="true"]:border-danger-soft','data-[invalid="true"]:data-[pressed="true"]:bg-danger data-[invalid="true"]:data-[pressed="true"]:border-danger',i?.control),children:t("div",{"data-invalid":u,className:s('w-3 h-3 rounded-full bg-surface-inverse opacity-0 transition-all duration-300 ease data-[invalid="true"]:bg-danger-soft',{"opacity-100":o})})})}function N({children:e,slots:i,className:d,classNames:r,...n}){return t(p,{className:s("flex items-center gap-2 group","invalid:text-danger-soft invalid:disabled:text-red-300","disabled:text-fg-subtle",d),...n,children:a=>g(v,{children:[t(m,{control:i?.control,classNames:r,...a}),typeof e=="function"?e(a):e]})})}export{N as Radio,N as default};
+"use client";import{jsx as r,jsxs as g,Fragment as v}from"react/jsx-runtime";import{Radio as p}from"react-aria-components";import{cn as s}from"../../utils/cn.js";function m({control:a,classNames:i,isHovered:d,isFocused:t,isFocusVisible:n,isDisabled:e,isInvalid:u,isSelected:o,isPressed:l,isReadOnly:b,isRequired:f,defaultChildren:h,...x}){const c={isHovered:d,isFocused:t,isFocusVisible:n,isDisabled:e,isInvalid:u,isSelected:o,isPressed:l,isReadOnly:b,isRequired:f};return a?typeof a=="function"?a(c):a:r("div",{"data-hovered":d,"data-focused":t,"data-disabled":e,"data-invalid":u,"data-selected":o,"data-pressed":l,className:s("flex items-center justify-center w-6 h-6  border-solid border border-border ransition-all duration-300 ease rounded-full",'data-[hovered="true"]:border-border-emphasis','data-[focused="true"]:border-border-emphasis data-[focused="true"]:outline-2 data-[focused="true"]:outline data-[focused="true"]:outline-border-subtle','data-[disabled="true"]:border-border-subtle data-[disabled="true"]:bg-surface-subtle','data-[invalid="true"]:bg-danger-surface data-[invalid="true"]:text-danger data-[invalid="true"]:border-danger-soft','data-[invalid="true"]:data-[disabled="true"]:border-danger-ring data-[invalid="true"]:data-[disabled="true"]:bg-danger-surface','data-[invalid="true"]:data-[hovered="true"]:border-danger','data-[invalid="true"]:data-[focused="true"]:border-danger data-[invalid="true"]:data-[focused="true"]:outline-danger-ring','data-[invalid="true"]:data-[selected="true"]:bg-danger-surface data-[invalid="true"]:data-[selected="true"]:border-danger-soft','data-[invalid="true"]:data-[pressed="true"]:bg-danger data-[invalid="true"]:data-[pressed="true"]:border-danger',i?.control),children:r("div",{"data-invalid":u,className:s('w-3 h-3 rounded-full bg-surface-inverse opacity-0 transition-all duration-300 ease data-[invalid="true"]:bg-danger-soft',{"opacity-100":o})})})}function N({children:a,slots:i,className:d,classNames:t,...n}){return r(p,{className:s("flex items-center gap-2 group","data-[invalid]:text-danger-soft data-[invalid]:disabled:text-red-300","disabled:text-fg-subtle",d),...n,children:e=>g(v,{children:[r(m,{control:i?.control,classNames:t,...e}),typeof a=="function"?a(e):a]})})}export{N as Radio,N as default};

package/components/TimeInput/TimeInput.js

@@ -1 +1 @@
-"use client";import{jsxs as s,jsx as r}from"react/jsx-runtime";import{TimeField as u,Label as f,DateInput as c,DateSegment as b,Text as g,FieldError as x}from"react-aria-components";import{cn as e}from"../../utils/cn.js";function v({label:a,description:i,errorMessage:o,className:d,classNames:t,...n}){return s(u,{className:e("text-fg",d),...n,children:[r(f,{className:e("flex text-fg-muted text-sm",t?.label),children:a}),r(c,{className:e("flex items-center","border-solid border border-border rounded-md","text-sm text-fg","h-10 px-1 py-0 m-0 w-full","bg-surface","transition-all duration-200 ease-in-out","hover:border-border-emphasis","focus-within:outline-2 focus-within:outline focus-within:outline-border-subtle focus-within:border-border-emphasis","disabled:border-border-subtle disabled:bg-surface-subtle","invalid:border-danger-soft invalid:bg-danger-surface invalid:text-danger","invalid:hover:border-danger invalid:focus-within:border-danger invalid:focus-within:outline-danger-ring",t?.input),children:l=>r(b,{segment:l,className:e("p-1 tabular-nums text-end text-fg","invalid:text-danger-soft","disabled:cursor-default disabled:select-none disabled:text-fg-subtle","focus:text-fg focus:bg-border-subtle focus:outline-0 focus:rounded-md focus:caret-transparent focus:invalid:bg-danger-soft focus:invalid:text-fg-inverse","type-literal:p-0.5","data-[placeholder]:text-fg-subtle data-[placeholder]:invalid:text-danger-soft data-[placeholder]:invalid:focus:text-fg-inverse","aria-[readonly]:focus-visible:outline aria-[readonly]:focus-visible:outline-fg-muted aria-[readonly]:focus-visible:outline-1","aria-[readonly]:focus:outline aria-[readonly]:focus:outline-fg-muted aria-[readonly]:focus:bg-transparent aria-[readonly]:focus:outline-2",t?.segment)})}),i&&r(g,{className:e("flex text-fg-muted text-sm",t?.description),slot:"description",children:i}),r(x,{className:e("flex text-danger-soft text-sm",t?.error),children:o})]})}export{v as TimeInput,v as default};
+"use client";import{jsxs as s,jsx as a}from"react/jsx-runtime";import{TimeField as u,Label as f,DateInput as c,DateSegment as b,Text as g,FieldError as x}from"react-aria-components";import{cn as e}from"../../utils/cn.js";function v({label:d,description:r,errorMessage:i,className:o,classNames:t,...n}){return s(u,{className:e("text-fg",o),...n,children:[a(f,{className:e("flex text-fg-muted text-sm",t?.label),children:d}),a(c,{className:e("flex items-center","border-solid border border-border rounded-md","text-sm text-fg","h-10 px-1 py-0 m-0 w-full","bg-surface","transition-all duration-200 ease-in-out","hover:border-border-emphasis","focus-within:outline-2 focus-within:outline focus-within:outline-border-subtle focus-within:border-border-emphasis","disabled:border-border-subtle disabled:bg-surface-subtle","data-[invalid]:border-danger-soft data-[invalid]:bg-danger-surface data-[invalid]:text-danger","data-[invalid]:hover:border-danger data-[invalid]:focus-within:border-danger data-[invalid]:focus-within:outline-danger-ring",t?.input),children:l=>a(b,{segment:l,className:e("p-1 tabular-nums text-end text-fg","data-[invalid]:text-danger-soft","disabled:cursor-default disabled:select-none disabled:text-fg-subtle","focus:text-fg focus:bg-border-subtle focus:outline-0 focus:rounded-md focus:caret-transparent focus:data-[invalid]:bg-danger-soft focus:data-[invalid]:text-fg-inverse","type-literal:p-0.5","data-[placeholder]:text-fg-subtle data-[placeholder]:data-[invalid]:text-danger-soft data-[placeholder]:data-[invalid]:focus:text-fg-inverse","aria-[readonly]:focus-visible:outline aria-[readonly]:focus-visible:outline-fg-muted aria-[readonly]:focus-visible:outline-1","aria-[readonly]:focus:outline aria-[readonly]:focus:outline-fg-muted aria-[readonly]:focus:bg-transparent aria-[readonly]:focus:outline-2",t?.segment)})}),r&&a(g,{className:e("flex text-fg-muted text-sm",t?.description),slot:"description",children:r}),a(x,{className:e("flex text-danger-soft text-sm",t?.error),children:i})]})}export{v as TimeInput,v as default};

package/docs/migrations/2026/10/ui-2026-10-06-accordion-mounts-collapsed-content-on-expand.md

@@ -0,0 +1,93 @@
+# `Accordion` mounts a collapsed item's content only when it expands
+
+**Date:** 2026-10-06
+**Package:** `@clicktap/ui`
+**Affects:** `components/Accordion` (`Accordion`, `AccordionItem`)
+**Classification:** BUGFIX
+**Breaking:** No API change. ⚠️ Behavior change for any consumer that relies on collapsed content being in the server-rendered HTML, findable with the browser's find-in-page, or keeping its state across a collapse. Pass `keepContentMounted` there.
+**Ticket:** CTAP-2217
+
+## Dependencies
+
+*None*
+
+## Summary
+
+The react-aria `Accordion` that replaced heroui's in `@clicktap/ui` 2.0 rendered every item's content,
+expanded or not, and hid collapsed items with CSS only. Collapsed content mounted, ran its effects and
+queries, and filled the DOM. One consumer's page, with a data-fetching panel per group and nested
+accordions, sent 520 GraphQL requests and rendered about 72,000 hidden DOM nodes on load. heroui never
+mounted a collapsed item unless `keepContentMounted` was set, and `AccordionProps` kept declaring that
+prop, but the component ignored it.
+
+The default is now heroui's: a collapsed item's content is not rendered. It mounts when the item expands,
+stays mounted while the collapse transition runs, then unmounts. `keepContentMounted` works again.
+
+## Changes
+
+| | Before | After |
+| --- | --- | --- |
+| Collapsed item, default | Content mounted, hidden by CSS | Content not rendered |
+| Expanding | Already mounted | Content mounts |
+| Collapsing | Stays mounted | Unmounts once the height transition ends (or after 250 ms) |
+| `keepContentMounted` on `Accordion` | Accepted, ignored | Every item's content always mounted, as before this fix |
+| `keepContentMounted` on `AccordionItem` | Not a prop | Overrides the `Accordion`'s value for that item, in either direction |
+
+The panel element itself (`DisclosurePanel`, the target of the trigger's `aria-controls`) is still always
+rendered; only its children are conditional.
+
+**Source**: `libs/frontend-modules/ui/src/components/Accordion/Accordion.tsx` (`AccordionPanel`)
+
+## Migrate
+
+Most accordions need nothing: menus, filters, cookie categories and checkout sections are interactive
+content that nobody needs before it is opened. Pass `keepContentMounted` where one of these holds.
+
+1. **The content must be in the initial HTML**, typically for search engines: FAQ answers, product
+   details, specifications.
+
+   ```tsx
+   <Accordion keepContentMounted>
+     {faqs.map((faq) => (
+       <AccordionItem key={faq.id} title={faq.question}>
+         {faq.answer}
+       </AccordionItem>
+     ))}
+   </Accordion>
+   ```
+
+   The platform's reference storefront does this in `apps/frontend/components/FAQ/FAQ.tsx`.
+
+2. **State inside the panel must survive a collapse**: a half-filled form, a payment widget that
+   initializes once, a nested accordion's open item. Set it on the whole accordion or on just that
+   item:
+
+   ```tsx
+   <Accordion>
+     <AccordionItem key="card" title="Card" keepContentMounted>
+       <CardForm />
+     </AccordionItem>
+     <AccordionItem key="paypal" title="PayPal">
+       <PayPalButton />
+     </AccordionItem>
+   </Accordion>
+   ```
+
+   An item can also opt out of a group-level `keepContentMounted` with `keepContentMounted={false}`.
+
+3. **Code that reads collapsed content from the DOM** (a test that queries a collapsed item's text, a
+   script that measures it) must expand the item first, or the accordion must keep its content mounted.
+
+Find your call sites:
+
+```bash
+grep -rn '<Accordion\b' apps/ libs/ --include=*.tsx
+```
+
+## Verify
+
+- With the default, open a page with an accordion and search the page source (view-source, not the
+  inspector) for text from a collapsed item: it is absent. Expanding the item renders it.
+- With `keepContentMounted`, the same text is present in the page source.
+- On a page whose panels fetch data, the network panel shows no requests for collapsed items until they
+  are opened.

package/docs/migrations/2026/10/ui-2026-10-06-invalid-styling-keys-on-data-invalid.md

@@ -0,0 +1,34 @@
+# Required fields are no longer red before anyone types
+
+**Date:** 2026-10-06
+**Package:** `@clicktap/ui`
+**Affects:** `Input`, `CreditCardInput`, `CreditCardExpirationInput`, `DobInput`, `NumberInput`, `DateInput`, `TimeInput`, `Radio`, `Checkbox`
+**Classification:** BUGFIX
+**Breaking:** No. A field shows its danger styling only when react-aria reports it invalid.
+**Ticket:** CTAP-2225
+
+## What changed
+
+These components styled their invalid state with Tailwind's `invalid:` and `group-invalid:`
+variants, which compile to the CSS `:invalid` pseudo-class. That had two effects:
+
+- A required `<input>` that is empty matches `:invalid` as soon as it renders, so every
+  `isRequired` field (sign-in, password reset, checkout) showed the danger border, background and
+  text before the user had typed or submitted anything.
+- The date, time, radio and checkbox components put those classes on react-aria `div` and `label`
+  elements, which never match `:invalid`, so their invalid styling never showed at all.
+
+They now key on react-aria's `data-invalid` attribute (`data-[invalid]:` and
+`group-data-[invalid]:`), which react-aria sets when the field's invalid state is displayed: after a
+submit or commit fails validation, or when `isInvalid` / `validate` says so.
+
+## Migrate
+
+Nothing for an app that uses the components as they are. An app that passed its own `invalid:`
+classes through `className` / `classNames` has the same on-load problem; switch them to
+`data-[invalid]:` too.
+
+## Verify
+
+Open a form with a required field: it renders with the normal border. Submit it empty, or pass
+`isInvalid`, and the danger styling appears.

package/docs/migrations/index.json

@@ -1,4 +1,24 @@
 [
+  {
+    "path": "2026/10/ui-2026-10-06-invalid-styling-keys-on-data-invalid.md",
+    "module": "libs/frontend-modules/ui",
+    "package": "@clicktap/ui",
+    "date": "2026-10-06",
+    "title": "Required fields are no longer red before anyone types",
+    "classification": "BUGFIX",
+    "breaking": "No. A field shows its danger styling only when react-aria reports it invalid.",
+    "affects": "`Input`, `CreditCardInput`, `CreditCardExpirationInput`, `DobInput`, `NumberInput`, `DateInput`, `TimeInput`, `Radio`, `Checkbox`"
+  },
+  {
+    "path": "2026/10/ui-2026-10-06-accordion-mounts-collapsed-content-on-expand.md",
+    "module": "libs/frontend-modules/ui",
+    "package": "@clicktap/ui",
+    "date": "2026-10-06",
+    "title": "`Accordion` mounts a collapsed item's content only when it expands",
+    "classification": "BUGFIX",
+    "breaking": "No API change. ⚠️ Behavior change for any consumer that relies on collapsed content being in the server-rendered HTML, findable with the browser's find-in-page, or keeping its state across a collapse. Pass `keepContentMounted` there.",
+    "affects": "`components/Accordion` (`Accordion`, `AccordionItem`)"
+  },
   {
     "path": "2026/10/ui-2026-10-02-user-icon-drops-project-color-class.md",
     "module": "libs/frontend-modules/ui",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@clicktap/ui",
-  "version": "2.4.4",
+  "version": "2.4.6",
   "private": false,
   "author": "Clicktap",
   "description": "A library of React UI components and low-level hooks.",