@preply/ds-docs 10.0.0 → 11.0.0

package/dist/assets/{SelectField-BRicVVj7.js → SelectField-DU60q2LU.js}

@@ -1,19 +1,19 @@
-import{r as n,ab as Ee,j as i,aa as ct,af as q,ai as B,ag as R,aB as J,q as De,a7 as Le,a8 as Ne,a9 as dt,ac as pt,ae as mt,aC as ft,aD as vt,aj as ht,ak as gt,al as yt,ah as St,g as Oe,I as bt}from"./iframe-DjYTJz7A.js";import{F as xt}from"./FormControl-DgD7Nr_L.js";import{F as wt}from"./TokyoUIChevronDown-CqAWFBEe.js";import{F as Ct}from"./TokyoUICheckmark-CPDgq6wU.js";import{I as je}from"./Icon-kphbe0CE.js";import{B as It}from"./breakpoints-BfMlrtxE.js";import{w as Re}from"./componentNames-hc9KR2nX.js";import{c as _t,u as Et,b as Rt,a as Pe}from"./index-C_O4jEc0.js";import{h as Tt,u as Nt,R as Pt,F as Vt}from"./index-DOwxXd3L.js";var Mt=[" ","Enter","ArrowUp","ArrowDown"],qt=[" ","Enter"],ee="Select",[ue,ce,Dt]=_t(ee),[ae]=ct(ee,[Dt,Le]),de=Le(),[Lt,z]=ae(ee),[Ot,jt]=ae(ee),Ae=t=>{const{__scopeSelect:s,children:e,open:u,defaultOpen:l,onOpenChange:c,value:a,defaultValue:r,onValueChange:o,dir:p,name:g,autoComplete:y,disabled:C,required:E,form:I}=t,d=de(s),[h,S]=n.useState(null),[m,f]=n.useState(null),[P,V]=n.useState(!1),Y=Et(p),[T,D]=Ne({prop:u,defaultProp:l??!1,onChange:c,caller:ee}),[A,H]=Ne({prop:a,defaultProp:r,onChange:o,caller:ee}),L=n.useRef(null),O=h?I||!!h.closest("form"):!0,[U,F]=n.useState(new Set),K=Array.from(U).map(N=>N.props.value).join(";");return i.jsx(dt,{...d,children:i.jsxs(Lt,{required:E,scope:s,trigger:h,onTriggerChange:S,valueNode:m,onValueNodeChange:f,valueNodeHasChildren:P,onValueNodeHasChildrenChange:V,contentId:Ee(),value:A,onValueChange:H,open:T,onOpenChange:D,dir:Y,triggerPointerDownPosRef:L,disabled:C,children:[i.jsx(ue.Provider,{scope:s,children:i.jsx(Ot,{scope:t.__scopeSelect,onNativeOptionAdd:n.useCallback(N=>{F(k=>new Set(k).add(N))},[]),onNativeOptionRemove:n.useCallback(N=>{F(k=>{const W=new Set(k);return W.delete(N),W})},[]),children:e})}),O?i.jsxs(ot,{"aria-hidden":!0,required:E,tabIndex:-1,name:g,autoComplete:y,value:A,onChange:N=>H(N.target.value),disabled:C,form:I,children:[A===void 0?i.jsx("option",{value:""}):null,Array.from(U)]},K):null]})})};Ae.displayName=ee;var He="SelectTrigger",ke=n.forwardRef((t,s)=>{const{__scopeSelect:e,disabled:u=!1,...l}=t,c=de(e),a=z(He,e),r=a.disabled||u,o=B(s,a.onTriggerChange),p=ce(e),g=n.useRef("touch"),[y,C,E]=it(d=>{const h=p().filter(f=>!f.disabled),S=h.find(f=>f.value===a.value),m=ut(h,d,S);m!==void 0&&a.onValueChange(m.value)}),I=d=>{r||(a.onOpenChange(!0),E()),d&&(a.triggerPointerDownPosRef.current={x:Math.round(d.pageX),y:Math.round(d.pageY)})};return i.jsx(pt,{asChild:!0,...c,children:i.jsx(q.button,{type:"button",role:"combobox","aria-controls":a.contentId,"aria-expanded":a.open,"aria-required":a.required,"aria-autocomplete":"none",dir:a.dir,"data-state":a.open?"open":"closed",disabled:r,"data-disabled":r?"":void 0,"data-placeholder":st(a.value)?"":void 0,...l,ref:o,onClick:R(l.onClick,d=>{d.currentTarget.focus(),g.current!=="mouse"&&I(d)}),onPointerDown:R(l.onPointerDown,d=>{g.current=d.pointerType;const h=d.target;h.hasPointerCapture(d.pointerId)&&h.releasePointerCapture(d.pointerId),d.button===0&&d.ctrlKey===!1&&d.pointerType==="mouse"&&(I(d),d.preventDefault())}),onKeyDown:R(l.onKeyDown,d=>{const h=y.current!=="";!(d.ctrlKey||d.altKey||d.metaKey)&&d.key.length===1&&C(d.key),!(h&&d.key===" ")&&Mt.includes(d.key)&&(I(),d.preventDefault())})})})});ke.displayName=He;var Be="SelectValue",Fe=n.forwardRef((t,s)=>{const{__scopeSelect:e,className:u,style:l,children:c,placeholder:a="",...r}=t,o=z(Be,e),{onValueNodeHasChildrenChange:p}=o,g=c!==void 0,y=B(s,o.onValueNodeChange);return J(()=>{p(g)},[p,g]),i.jsx(q.span,{...r,ref:y,style:{pointerEvents:"none"},children:st(o.value)?i.jsx(i.Fragment,{children:a}):c})});Fe.displayName=Be;var At="SelectIcon",Ke=n.forwardRef((t,s)=>{const{__scopeSelect:e,children:u,...l}=t;return i.jsx(q.span,{"aria-hidden":!0,...l,ref:s,children:u||"▼"})});Ke.displayName=At;var Ht="SelectPortal",We=t=>i.jsx(mt,{asChild:!0,...t});We.displayName=Ht;var te="SelectContent",Ue=n.forwardRef((t,s)=>{const e=z(te,t.__scopeSelect),[u,l]=n.useState();if(J(()=>{l(new DocumentFragment)},[]),!e.open){const c=u;return c?De.createPortal(i.jsx(Ge,{scope:t.__scopeSelect,children:i.jsx(ue.Slot,{scope:t.__scopeSelect,children:i.jsx("div",{children:t.children})})}),c):null}return i.jsx(Xe,{...t,ref:s})});Ue.displayName=te;var j=10,[Ge,$]=ae(te),kt="SelectContentImpl",Bt=ht("SelectContent.RemoveScroll"),Xe=n.forwardRef((t,s)=>{const{__scopeSelect:e,position:u="item-aligned",onCloseAutoFocus:l,onEscapeKeyDown:c,onPointerDownOutside:a,side:r,sideOffset:o,align:p,alignOffset:g,arrowPadding:y,collisionBoundary:C,collisionPadding:E,sticky:I,hideWhenDetached:d,avoidCollisions:h,...S}=t,m=z(te,e),[f,P]=n.useState(null),[V,Y]=n.useState(null),T=B(s,v=>P(v)),[D,A]=n.useState(null),[H,L]=n.useState(null),O=ce(e),[U,F]=n.useState(!1),K=n.useRef(!1);n.useEffect(()=>{if(f)return Tt(f)},[f]),Nt();const N=n.useCallback(v=>{const[_,...M]=O().map(x=>x.ref.current),[w]=M.slice(-1),b=document.activeElement;for(const x of v)if(x===b||(x==null||x.scrollIntoView({block:"nearest"}),x===_&&V&&(V.scrollTop=0),x===w&&V&&(V.scrollTop=V.scrollHeight),x==null||x.focus(),document.activeElement!==b))return},[O,V]),k=n.useCallback(()=>N([D,f]),[N,D,f]);n.useEffect(()=>{U&&k()},[U,k]);const{onOpenChange:W,triggerPointerDownPosRef:G}=m;n.useEffect(()=>{if(f){let v={x:0,y:0};const _=w=>{var b,x;v={x:Math.abs(Math.round(w.pageX)-(((b=G.current)==null?void 0:b.x)??0)),y:Math.abs(Math.round(w.pageY)-(((x=G.current)==null?void 0:x.y)??0))}},M=w=>{v.x<=10&&v.y<=10?w.preventDefault():f.contains(w.target)||W(!1),document.removeEventListener("pointermove",_),G.current=null};return G.current!==null&&(document.addEventListener("pointermove",_),document.addEventListener("pointerup",M,{capture:!0,once:!0})),()=>{document.removeEventListener("pointermove",_),document.removeEventListener("pointerup",M,{capture:!0})}}},[f,W,G]),n.useEffect(()=>{const v=()=>W(!1);return window.addEventListener("blur",v),window.addEventListener("resize",v),()=>{window.removeEventListener("blur",v),window.removeEventListener("resize",v)}},[W]);const[pe,oe]=it(v=>{const _=O().filter(b=>!b.disabled),M=_.find(b=>b.ref.current===document.activeElement),w=ut(_,v,M);w&&setTimeout(()=>w.ref.current.focus())}),me=n.useCallback((v,_,M)=>{const w=!K.current&&!M;(m.value!==void 0&&m.value===_||w)&&(A(v),w&&(K.current=!0))},[m.value]),fe=n.useCallback(()=>f==null?void 0:f.focus(),[f]),ne=n.useCallback((v,_,M)=>{const w=!K.current&&!M;(m.value!==void 0&&m.value===_||w)&&L(v)},[m.value]),se=u==="popper"?ye:Je,le=se===ye?{side:r,sideOffset:o,align:p,alignOffset:g,arrowPadding:y,collisionBoundary:C,collisionPadding:E,sticky:I,hideWhenDetached:d,avoidCollisions:h}:{};return i.jsx(Ge,{scope:e,content:f,viewport:V,onViewportChange:Y,itemRefCallback:me,selectedItem:D,onItemLeave:fe,itemTextRefCallback:ne,focusSelectedItem:k,selectedItemText:H,position:u,isPositioned:U,searchRef:pe,children:i.jsx(Pt,{as:Bt,allowPinchZoom:!0,children:i.jsx(Vt,{asChild:!0,trapped:m.open,onMountAutoFocus:v=>{v.preventDefault()},onUnmountAutoFocus:R(l,v=>{var _;(_=m.trigger)==null||_.focus({preventScroll:!0}),v.preventDefault()}),children:i.jsx(gt,{asChild:!0,disableOutsidePointerEvents:!0,onEscapeKeyDown:c,onPointerDownOutside:a,onFocusOutside:v=>v.preventDefault(),onDismiss:()=>m.onOpenChange(!1),children:i.jsx(se,{role:"listbox",id:m.contentId,"data-state":m.open?"open":"closed",dir:m.dir,onContextMenu:v=>v.preventDefault(),...S,...le,onPlaced:()=>F(!0),ref:T,style:{display:"flex",flexDirection:"column",outline:"none",...S.style},onKeyDown:R(S.onKeyDown,v=>{const _=v.ctrlKey||v.altKey||v.metaKey;if(v.key==="Tab"&&v.preventDefault(),!_&&v.key.length===1&&oe(v.key),["ArrowUp","ArrowDown","Home","End"].includes(v.key)){let w=O().filter(b=>!b.disabled).map(b=>b.ref.current);if(["ArrowUp","End"].includes(v.key)&&(w=w.slice().reverse()),["ArrowUp","ArrowDown"].includes(v.key)){const b=v.target,x=w.indexOf(b);w=w.slice(x+1)}setTimeout(()=>N(w)),v.preventDefault()}})})})})})})});Xe.displayName=kt;var Ft="SelectItemAlignedPosition",Je=n.forwardRef((t,s)=>{const{__scopeSelect:e,onPlaced:u,...l}=t,c=z(te,e),a=$(te,e),[r,o]=n.useState(null),[p,g]=n.useState(null),y=B(s,T=>g(T)),C=ce(e),E=n.useRef(!1),I=n.useRef(!0),{viewport:d,selectedItem:h,selectedItemText:S,focusSelectedItem:m}=a,f=n.useCallback(()=>{if(c.trigger&&c.valueNode&&r&&p&&d&&h&&S){const T=c.trigger.getBoundingClientRect(),D=p.getBoundingClientRect(),A=c.valueNode.getBoundingClientRect(),H=S.getBoundingClientRect();if(c.dir!=="rtl"){const b=H.left-D.left,x=A.left-b,Z=T.left-x,Q=T.width+Z,ve=Math.max(Q,D.width),he=window.innerWidth-j,ge=Pe(x,[j,Math.max(j,he-ve)]);r.style.minWidth=Q+"px",r.style.left=ge+"px"}else{const b=D.right-H.right,x=window.innerWidth-A.right-b,Z=window.innerWidth-T.right-x,Q=T.width+Z,ve=Math.max(Q,D.width),he=window.innerWidth-j,ge=Pe(x,[j,Math.max(j,he-ve)]);r.style.minWidth=Q+"px",r.style.right=ge+"px"}const L=C(),O=window.innerHeight-j*2,U=d.scrollHeight,F=window.getComputedStyle(p),K=parseInt(F.borderTopWidth,10),N=parseInt(F.paddingTop,10),k=parseInt(F.borderBottomWidth,10),W=parseInt(F.paddingBottom,10),G=K+N+U+W+k,pe=Math.min(h.offsetHeight*5,G),oe=window.getComputedStyle(d),me=parseInt(oe.paddingTop,10),fe=parseInt(oe.paddingBottom,10),ne=T.top+T.height/2-j,se=O-ne,le=h.offsetHeight/2,v=h.offsetTop+le,_=K+N+v,M=G-_;if(_<=ne){const b=L.length>0&&h===L[L.length-1].ref.current;r.style.bottom="0px";const x=p.clientHeight-d.offsetTop-d.offsetHeight,Z=Math.max(se,le+(b?fe:0)+x+k),Q=_+Z;r.style.height=Q+"px"}else{const b=L.length>0&&h===L[0].ref.current;r.style.top="0px";const Z=Math.max(ne,K+d.offsetTop+(b?me:0)+le)+M;r.style.height=Z+"px",d.scrollTop=_-ne+d.offsetTop}r.style.margin=`${j}px 0`,r.style.minHeight=pe+"px",r.style.maxHeight=O+"px",u==null||u(),requestAnimationFrame(()=>E.current=!0)}},[C,c.trigger,c.valueNode,r,p,d,h,S,c.dir,u]);J(()=>f(),[f]);const[P,V]=n.useState();J(()=>{p&&V(window.getComputedStyle(p).zIndex)},[p]);const Y=n.useCallback(T=>{T&&I.current===!0&&(f(),m==null||m(),I.current=!1)},[f,m]);return i.jsx(Wt,{scope:e,contentWrapper:r,shouldExpandOnScrollRef:E,onScrollButtonChange:Y,children:i.jsx("div",{ref:o,style:{display:"flex",flexDirection:"column",position:"fixed",zIndex:P},children:i.jsx(q.div,{...l,ref:y,style:{boxSizing:"border-box",maxHeight:"100%",...l.style}})})})});Je.displayName=Ft;var Kt="SelectPopperPosition",ye=n.forwardRef((t,s)=>{const{__scopeSelect:e,align:u="start",collisionPadding:l=j,...c}=t,a=de(e);return i.jsx(yt,{...a,...c,ref:s,align:u,collisionPadding:l,style:{boxSizing:"border-box",...c.style,"--radix-select-content-transform-origin":"var(--radix-popper-transform-origin)","--radix-select-content-available-width":"var(--radix-popper-available-width)","--radix-select-content-available-height":"var(--radix-popper-available-height)","--radix-select-trigger-width":"var(--radix-popper-anchor-width)","--radix-select-trigger-height":"var(--radix-popper-anchor-height)"}})});ye.displayName=Kt;var[Wt,Te]=ae(te,{}),Se="SelectViewport",ze=n.forwardRef((t,s)=>{const{__scopeSelect:e,nonce:u,...l}=t,c=$(Se,e),a=Te(Se,e),r=B(s,c.onViewportChange),o=n.useRef(0);return i.jsxs(i.Fragment,{children:[i.jsx("style",{dangerouslySetInnerHTML:{__html:"[data-radix-select-viewport]{scrollbar-width:none;-ms-overflow-style:none;-webkit-overflow-scrolling:touch;}[data-radix-select-viewport]::-webkit-scrollbar{display:none}"},nonce:u}),i.jsx(ue.Slot,{scope:e,children:i.jsx(q.div,{"data-radix-select-viewport":"",role:"presentation",...l,ref:r,style:{position:"relative",flex:1,overflow:"hidden auto",...l.style},onScroll:R(l.onScroll,p=>{const g=p.currentTarget,{contentWrapper:y,shouldExpandOnScrollRef:C}=a;if(C!=null&&C.current&&y){const E=Math.abs(o.current-g.scrollTop);if(E>0){const I=window.innerHeight-j*2,d=parseFloat(y.style.minHeight),h=parseFloat(y.style.height),S=Math.max(d,h);if(S<I){const m=S+E,f=Math.min(I,m),P=m-f;y.style.height=f+"px",y.style.bottom==="0px"&&(g.scrollTop=P>0?P:0,y.style.justifyContent="flex-end")}}}o.current=g.scrollTop})})})]})});ze.displayName=Se;var $e="SelectGroup",[Ut,Gt]=ae($e),Ye=n.forwardRef((t,s)=>{const{__scopeSelect:e,...u}=t,l=Ee();return i.jsx(Ut,{scope:e,id:l,children:i.jsx(q.div,{role:"group","aria-labelledby":l,...u,ref:s})})});Ye.displayName=$e;var Ze="SelectLabel",Qe=n.forwardRef((t,s)=>{const{__scopeSelect:e,...u}=t,l=Gt(Ze,e);return i.jsx(q.div,{id:l.id,...u,ref:s})});Qe.displayName=Ze;var ie="SelectItem",[Xt,et]=ae(ie),tt=n.forwardRef((t,s)=>{const{__scopeSelect:e,value:u,disabled:l=!1,textValue:c,...a}=t,r=z(ie,e),o=$(ie,e),p=r.value===u,[g,y]=n.useState(c??""),[C,E]=n.useState(!1),I=B(s,m=>{var f;return(f=o.itemRefCallback)==null?void 0:f.call(o,m,u,l)}),d=Ee(),h=n.useRef("touch"),S=()=>{l||(r.onValueChange(u),r.onOpenChange(!1))};if(u==="")throw new Error("A <Select.Item /> must have a value prop that is not an empty string. This is because the Select value can be set to an empty string to clear the selection and show the placeholder.");return i.jsx(Xt,{scope:e,value:u,disabled:l,textId:d,isSelected:p,onItemTextChange:n.useCallback(m=>{y(f=>f||((m==null?void 0:m.textContent)??"").trim())},[]),children:i.jsx(ue.ItemSlot,{scope:e,value:u,disabled:l,textValue:g,children:i.jsx(q.div,{role:"option","aria-labelledby":d,"data-highlighted":C?"":void 0,"aria-selected":p&&C,"data-state":p?"checked":"unchecked","aria-disabled":l||void 0,"data-disabled":l?"":void 0,tabIndex:l?void 0:-1,...a,ref:I,onFocus:R(a.onFocus,()=>E(!0)),onBlur:R(a.onBlur,()=>E(!1)),onClick:R(a.onClick,()=>{h.current!=="mouse"&&S()}),onPointerUp:R(a.onPointerUp,()=>{h.current==="mouse"&&S()}),onPointerDown:R(a.onPointerDown,m=>{h.current=m.pointerType}),onPointerMove:R(a.onPointerMove,m=>{var f;h.current=m.pointerType,l?(f=o.onItemLeave)==null||f.call(o):h.current==="mouse"&&m.currentTarget.focus({preventScroll:!0})}),onPointerLeave:R(a.onPointerLeave,m=>{var f;m.currentTarget===document.activeElement&&((f=o.onItemLeave)==null||f.call(o))}),onKeyDown:R(a.onKeyDown,m=>{var P;((P=o.searchRef)==null?void 0:P.current)!==""&&m.key===" "||(qt.includes(m.key)&&S(),m.key===" "&&m.preventDefault())})})})})});tt.displayName=ie;var re="SelectItemText",nt=n.forwardRef((t,s)=>{const{__scopeSelect:e,className:u,style:l,...c}=t,a=z(re,e),r=$(re,e),o=et(re,e),p=jt(re,e),[g,y]=n.useState(null),C=B(s,S=>y(S),o.onItemTextChange,S=>{var m;return(m=r.itemTextRefCallback)==null?void 0:m.call(r,S,o.value,o.disabled)}),E=g==null?void 0:g.textContent,I=n.useMemo(()=>i.jsx("option",{value:o.value,disabled:o.disabled,children:E},o.value),[o.disabled,o.value,E]),{onNativeOptionAdd:d,onNativeOptionRemove:h}=p;return J(()=>(d(I),()=>h(I)),[d,h,I]),i.jsxs(i.Fragment,{children:[i.jsx(q.span,{id:o.textId,...c,ref:C}),o.isSelected&&a.valueNode&&!a.valueNodeHasChildren?De.createPortal(c.children,a.valueNode):null]})});nt.displayName=re;var at="SelectItemIndicator",lt=n.forwardRef((t,s)=>{const{__scopeSelect:e,...u}=t;return et(at,e).isSelected?i.jsx(q.span,{"aria-hidden":!0,...u,ref:s}):null});lt.displayName=at;var be="SelectScrollUpButton",Jt=n.forwardRef((t,s)=>{const e=$(be,t.__scopeSelect),u=Te(be,t.__scopeSelect),[l,c]=n.useState(!1),a=B(s,u.onScrollButtonChange);return J(()=>{if(e.viewport&&e.isPositioned){let r=function(){const p=o.scrollTop>0;c(p)};const o=e.viewport;return r(),o.addEventListener("scroll",r),()=>o.removeEventListener("scroll",r)}},[e.viewport,e.isPositioned]),l?i.jsx(rt,{...t,ref:a,onAutoScroll:()=>{const{viewport:r,selectedItem:o}=e;r&&o&&(r.scrollTop=r.scrollTop-o.offsetHeight)}}):null});Jt.displayName=be;var xe="SelectScrollDownButton",zt=n.forwardRef((t,s)=>{const e=$(xe,t.__scopeSelect),u=Te(xe,t.__scopeSelect),[l,c]=n.useState(!1),a=B(s,u.onScrollButtonChange);return J(()=>{if(e.viewport&&e.isPositioned){let r=function(){const p=o.scrollHeight-o.clientHeight,g=Math.ceil(o.scrollTop)<p;c(g)};const o=e.viewport;return r(),o.addEventListener("scroll",r),()=>o.removeEventListener("scroll",r)}},[e.viewport,e.isPositioned]),l?i.jsx(rt,{...t,ref:a,onAutoScroll:()=>{const{viewport:r,selectedItem:o}=e;r&&o&&(r.scrollTop=r.scrollTop+o.offsetHeight)}}):null});zt.displayName=xe;var rt=n.forwardRef((t,s)=>{const{__scopeSelect:e,onAutoScroll:u,...l}=t,c=$("SelectScrollButton",e),a=n.useRef(null),r=ce(e),o=n.useCallback(()=>{a.current!==null&&(window.clearInterval(a.current),a.current=null)},[]);return n.useEffect(()=>()=>o(),[o]),J(()=>{var g;const p=r().find(y=>y.ref.current===document.activeElement);(g=p==null?void 0:p.ref.current)==null||g.scrollIntoView({block:"nearest"})},[r]),i.jsx(q.div,{"aria-hidden":!0,...l,ref:s,style:{flexShrink:0,...l.style},onPointerDown:R(l.onPointerDown,()=>{a.current===null&&(a.current=window.setInterval(u,50))}),onPointerMove:R(l.onPointerMove,()=>{var p;(p=c.onItemLeave)==null||p.call(c),a.current===null&&(a.current=window.setInterval(u,50))}),onPointerLeave:R(l.onPointerLeave,()=>{o()})})}),$t="SelectSeparator",Yt=n.forwardRef((t,s)=>{const{__scopeSelect:e,...u}=t;return i.jsx(q.div,{"aria-hidden":!0,...u,ref:s})});Yt.displayName=$t;var we="SelectArrow",Zt=n.forwardRef((t,s)=>{const{__scopeSelect:e,...u}=t,l=de(e),c=z(we,e),a=$(we,e);return c.open&&a.position==="popper"?i.jsx(St,{...l,...u,ref:s}):null});Zt.displayName=we;var Qt="SelectBubbleInput",ot=n.forwardRef(({__scopeSelect:t,value:s,...e},u)=>{const l=n.useRef(null),c=B(u,l),a=Rt(s);return n.useEffect(()=>{const r=l.current;if(!r)return;const o=window.HTMLSelectElement.prototype,g=Object.getOwnPropertyDescriptor(o,"value").set;if(a!==s&&g){const y=new Event("change",{bubbles:!0});g.call(r,s),r.dispatchEvent(y)}},[a,s]),i.jsx(q.select,{...e,style:{...ft,...e.style},ref:c,defaultValue:s})});ot.displayName=Qt;function st(t){return t===""||t===void 0}function it(t){const s=vt(t),e=n.useRef(""),u=n.useRef(0),l=n.useCallback(a=>{const r=e.current+a;s(r),(function o(p){e.current=p,window.clearTimeout(u.current),p!==""&&(u.current=window.setTimeout(()=>o(""),1e3))})(r)},[s]),c=n.useCallback(()=>{e.current="",window.clearTimeout(u.current)},[]);return n.useEffect(()=>()=>window.clearTimeout(u.current),[]),[e,l,c]}function ut(t,s,e){const l=s.length>1&&Array.from(s).every(p=>p===s[0])?s[0]:s,c=e?t.indexOf(e):-1;let a=en(t,Math.max(c,0));l.length===1&&(a=a.filter(p=>p!==e));const o=a.find(p=>p.textValue.toLowerCase().startsWith(l.toLowerCase()));return o!==e?o:void 0}function en(t,s){return t.map((e,u)=>t[(s+u)%t.length])}var tn=Ae,nn=ke,an=Fe,ln=Ke,rn=We,on=Ue,sn=ze,un=Ye,cn=Qe,dn=tt,pn=nt,mn=lt;const fn="trigger__XRceG",vn="chevron__ENwnv",hn="content__NHVeq",gn="viewport__aqXUS",yn="item__7lwGu",Sn="indicator__NkOzD",bn="group__feJjZ",xn="groupLabel__VdJlH",X={trigger:fn,chevron:vn,content:hn,viewport:gn,item:yn,indicator:Sn,group:bn,groupLabel:xn};function wn(t){const e=`(min-width: ${It[t]}px)`,[u,l]=n.useState(!1);return n.useEffect(()=>{const c=window.matchMedia(e);l(c.matches);const a=r=>{l(r.matches)};return c.addEventListener("change",a),()=>{c.removeEventListener("change",a)}},[e]),u}const Ce=n.forwardRef(function({value:s,defaultValue:e,placeholder:u,disabled:l,onValueChange:c,children:a,dataset:r,icon:o,name:p,id:g,required:y,onFocus:C,onBlur:E,onKeyDown:I,onKeyUp:d,"aria-label":h,"aria-labelledby":S,"aria-describedby":m,"aria-invalid":f,"aria-errormessage":P},V){const[Y,T]=n.useState(!1),D=bt(),A=Oe(r,{preplyDsComponent:Re.Select}),H=wn("medium-s"),L=O=>{c==null||c(O)};return i.jsxs(tn,{value:s,defaultValue:e,onValueChange:L,disabled:l,name:p,open:Y,onOpenChange:T,required:y,children:[i.jsxs(nn,{ref:V,id:g,className:X.trigger,onFocus:C,onBlur:E,onKeyDown:I,onKeyUp:d,"aria-label":h,"aria-labelledby":S,"aria-describedby":m,"aria-invalid":f,"aria-errormessage":P,...A,children:[o,i.jsx(an,{placeholder:u}),i.jsx(ln,{className:X.chevron,children:i.jsx(je,{svg:wt})})]}),i.jsx(rn,{container:D,children:i.jsx(on,{position:H?"popper":void 0,sideOffset:H?5:void 0,className:X.content,children:i.jsx(sn,{className:X.viewport,role:"group",tabIndex:0,children:a})})})]})});function Ie({value:t,disabled:s,children:e,leadingIcon:u,dataset:l}){return i.jsxs(dn,{value:t,disabled:s,className:X.item,...Oe(l,{preplyDsComponent:Re.SelectFieldOption}),children:[u,i.jsx(pn,{children:e}),i.jsx(mn,{className:X.indicator,children:i.jsx(je,{svg:Ct})})]})}function _e({children:t,label:s}){return i.jsxs(un,{className:X.group,children:[i.jsx(cn,{className:X.groupLabel,children:s}),t]})}try{Ie.displayName="SelectOption",Ie.__docgenInfo={description:"",displayName:"SelectOption",props:{value:{defaultValue:null,description:"",name:"value",required:!0,type:{name:"string"}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},leadingIcon:{defaultValue:null,description:"",name:"leadingIcon",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}}}}}catch{}try{_e.displayName="SelectGroup",_e.__docgenInfo={description:"",displayName:"SelectGroup",props:{label:{defaultValue:null,description:"",name:"label",required:!0,type:{name:"enum",value:[{value:"undefined"},{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}}}}}catch{}try{Ce.displayName="Select",Ce.__docgenInfo={description:"",displayName:"Select",props:{id:{defaultValue:null,description:"",name:"id",required:!1,type:{name:"enum",value:[{value:"string"}]}},"aria-describedby":{defaultValue:null,description:`Identifies the element (or elements) that describes the object.
-@see aria-labelledby`,name:"aria-describedby",required:!1,type:{name:"enum",value:[{value:"string"}]}},"aria-errormessage":{defaultValue:null,description:`Identifies the element that provides an error message for the object.
+import{r as n,ab as Ee,j as i,aa as ct,af as q,ai as B,ag as R,az as J,q as De,a7 as Le,a8 as Ne,a9 as dt,ac as pt,ae as mt,aA as ft,aB as vt,aj as ht,ak as gt,al as yt,ah as St,g as Oe,I as bt}from"./iframe-B_74HtSc.js";import{F as xt}from"./FormControl-Zqf1cIwP.js";import{F as wt}from"./TokyoUIChevronDown-DiBNbDdz.js";import{F as It}from"./TokyoUICheckmark-BHJrELn_.js";import{I as je}from"./Icon-CC0yjdx9.js";import{B as Ct}from"./breakpoints-BfMlrtxE.js";import{w as Re}from"./componentNames-hc9KR2nX.js";import{c as _t,u as Et,b as Rt,a as Pe}from"./index-Cnv20V_M.js";import{h as Tt,u as Nt,R as Pt,F as Vt}from"./index-W3BB_3go.js";var Mt=[" ","Enter","ArrowUp","ArrowDown"],qt=[" ","Enter"],ee="Select",[ue,ce,Dt]=_t(ee),[ae]=ct(ee,[Dt,Le]),de=Le(),[Lt,z]=ae(ee),[Ot,jt]=ae(ee),Ae=t=>{const{__scopeSelect:s,children:e,open:u,defaultOpen:l,onOpenChange:c,value:a,defaultValue:r,onValueChange:o,dir:p,name:g,autoComplete:y,disabled:I,required:E,form:C}=t,d=de(s),[h,S]=n.useState(null),[m,f]=n.useState(null),[P,V]=n.useState(!1),Y=Et(p),[T,D]=Ne({prop:u,defaultProp:l??!1,onChange:c,caller:ee}),[A,H]=Ne({prop:a,defaultProp:r,onChange:o,caller:ee}),L=n.useRef(null),O=h?C||!!h.closest("form"):!0,[U,F]=n.useState(new Set),K=Array.from(U).map(N=>N.props.value).join(";");return i.jsx(dt,{...d,children:i.jsxs(Lt,{required:E,scope:s,trigger:h,onTriggerChange:S,valueNode:m,onValueNodeChange:f,valueNodeHasChildren:P,onValueNodeHasChildrenChange:V,contentId:Ee(),value:A,onValueChange:H,open:T,onOpenChange:D,dir:Y,triggerPointerDownPosRef:L,disabled:I,children:[i.jsx(ue.Provider,{scope:s,children:i.jsx(Ot,{scope:t.__scopeSelect,onNativeOptionAdd:n.useCallback(N=>{F(k=>new Set(k).add(N))},[]),onNativeOptionRemove:n.useCallback(N=>{F(k=>{const W=new Set(k);return W.delete(N),W})},[]),children:e})}),O?i.jsxs(ot,{"aria-hidden":!0,required:E,tabIndex:-1,name:g,autoComplete:y,value:A,onChange:N=>H(N.target.value),disabled:I,form:C,children:[A===void 0?i.jsx("option",{value:""}):null,Array.from(U)]},K):null]})})};Ae.displayName=ee;var He="SelectTrigger",ke=n.forwardRef((t,s)=>{const{__scopeSelect:e,disabled:u=!1,...l}=t,c=de(e),a=z(He,e),r=a.disabled||u,o=B(s,a.onTriggerChange),p=ce(e),g=n.useRef("touch"),[y,I,E]=it(d=>{const h=p().filter(f=>!f.disabled),S=h.find(f=>f.value===a.value),m=ut(h,d,S);m!==void 0&&a.onValueChange(m.value)}),C=d=>{r||(a.onOpenChange(!0),E()),d&&(a.triggerPointerDownPosRef.current={x:Math.round(d.pageX),y:Math.round(d.pageY)})};return i.jsx(pt,{asChild:!0,...c,children:i.jsx(q.button,{type:"button",role:"combobox","aria-controls":a.contentId,"aria-expanded":a.open,"aria-required":a.required,"aria-autocomplete":"none",dir:a.dir,"data-state":a.open?"open":"closed",disabled:r,"data-disabled":r?"":void 0,"data-placeholder":st(a.value)?"":void 0,...l,ref:o,onClick:R(l.onClick,d=>{d.currentTarget.focus(),g.current!=="mouse"&&C(d)}),onPointerDown:R(l.onPointerDown,d=>{g.current=d.pointerType;const h=d.target;h.hasPointerCapture(d.pointerId)&&h.releasePointerCapture(d.pointerId),d.button===0&&d.ctrlKey===!1&&d.pointerType==="mouse"&&(C(d),d.preventDefault())}),onKeyDown:R(l.onKeyDown,d=>{const h=y.current!=="";!(d.ctrlKey||d.altKey||d.metaKey)&&d.key.length===1&&I(d.key),!(h&&d.key===" ")&&Mt.includes(d.key)&&(C(),d.preventDefault())})})})});ke.displayName=He;var Be="SelectValue",Fe=n.forwardRef((t,s)=>{const{__scopeSelect:e,className:u,style:l,children:c,placeholder:a="",...r}=t,o=z(Be,e),{onValueNodeHasChildrenChange:p}=o,g=c!==void 0,y=B(s,o.onValueNodeChange);return J(()=>{p(g)},[p,g]),i.jsx(q.span,{...r,ref:y,style:{pointerEvents:"none"},children:st(o.value)?i.jsx(i.Fragment,{children:a}):c})});Fe.displayName=Be;var At="SelectIcon",Ke=n.forwardRef((t,s)=>{const{__scopeSelect:e,children:u,...l}=t;return i.jsx(q.span,{"aria-hidden":!0,...l,ref:s,children:u||"▼"})});Ke.displayName=At;var Ht="SelectPortal",We=t=>i.jsx(mt,{asChild:!0,...t});We.displayName=Ht;var te="SelectContent",Ue=n.forwardRef((t,s)=>{const e=z(te,t.__scopeSelect),[u,l]=n.useState();if(J(()=>{l(new DocumentFragment)},[]),!e.open){const c=u;return c?De.createPortal(i.jsx(Ge,{scope:t.__scopeSelect,children:i.jsx(ue.Slot,{scope:t.__scopeSelect,children:i.jsx("div",{children:t.children})})}),c):null}return i.jsx(Xe,{...t,ref:s})});Ue.displayName=te;var j=10,[Ge,$]=ae(te),kt="SelectContentImpl",Bt=ht("SelectContent.RemoveScroll"),Xe=n.forwardRef((t,s)=>{const{__scopeSelect:e,position:u="item-aligned",onCloseAutoFocus:l,onEscapeKeyDown:c,onPointerDownOutside:a,side:r,sideOffset:o,align:p,alignOffset:g,arrowPadding:y,collisionBoundary:I,collisionPadding:E,sticky:C,hideWhenDetached:d,avoidCollisions:h,...S}=t,m=z(te,e),[f,P]=n.useState(null),[V,Y]=n.useState(null),T=B(s,v=>P(v)),[D,A]=n.useState(null),[H,L]=n.useState(null),O=ce(e),[U,F]=n.useState(!1),K=n.useRef(!1);n.useEffect(()=>{if(f)return Tt(f)},[f]),Nt();const N=n.useCallback(v=>{const[_,...M]=O().map(x=>x.ref.current),[w]=M.slice(-1),b=document.activeElement;for(const x of v)if(x===b||(x==null||x.scrollIntoView({block:"nearest"}),x===_&&V&&(V.scrollTop=0),x===w&&V&&(V.scrollTop=V.scrollHeight),x==null||x.focus(),document.activeElement!==b))return},[O,V]),k=n.useCallback(()=>N([D,f]),[N,D,f]);n.useEffect(()=>{U&&k()},[U,k]);const{onOpenChange:W,triggerPointerDownPosRef:G}=m;n.useEffect(()=>{if(f){let v={x:0,y:0};const _=w=>{var b,x;v={x:Math.abs(Math.round(w.pageX)-(((b=G.current)==null?void 0:b.x)??0)),y:Math.abs(Math.round(w.pageY)-(((x=G.current)==null?void 0:x.y)??0))}},M=w=>{v.x<=10&&v.y<=10?w.preventDefault():f.contains(w.target)||W(!1),document.removeEventListener("pointermove",_),G.current=null};return G.current!==null&&(document.addEventListener("pointermove",_),document.addEventListener("pointerup",M,{capture:!0,once:!0})),()=>{document.removeEventListener("pointermove",_),document.removeEventListener("pointerup",M,{capture:!0})}}},[f,W,G]),n.useEffect(()=>{const v=()=>W(!1);return window.addEventListener("blur",v),window.addEventListener("resize",v),()=>{window.removeEventListener("blur",v),window.removeEventListener("resize",v)}},[W]);const[pe,oe]=it(v=>{const _=O().filter(b=>!b.disabled),M=_.find(b=>b.ref.current===document.activeElement),w=ut(_,v,M);w&&setTimeout(()=>w.ref.current.focus())}),me=n.useCallback((v,_,M)=>{const w=!K.current&&!M;(m.value!==void 0&&m.value===_||w)&&(A(v),w&&(K.current=!0))},[m.value]),fe=n.useCallback(()=>f==null?void 0:f.focus(),[f]),ne=n.useCallback((v,_,M)=>{const w=!K.current&&!M;(m.value!==void 0&&m.value===_||w)&&L(v)},[m.value]),se=u==="popper"?ye:Je,le=se===ye?{side:r,sideOffset:o,align:p,alignOffset:g,arrowPadding:y,collisionBoundary:I,collisionPadding:E,sticky:C,hideWhenDetached:d,avoidCollisions:h}:{};return i.jsx(Ge,{scope:e,content:f,viewport:V,onViewportChange:Y,itemRefCallback:me,selectedItem:D,onItemLeave:fe,itemTextRefCallback:ne,focusSelectedItem:k,selectedItemText:H,position:u,isPositioned:U,searchRef:pe,children:i.jsx(Pt,{as:Bt,allowPinchZoom:!0,children:i.jsx(Vt,{asChild:!0,trapped:m.open,onMountAutoFocus:v=>{v.preventDefault()},onUnmountAutoFocus:R(l,v=>{var _;(_=m.trigger)==null||_.focus({preventScroll:!0}),v.preventDefault()}),children:i.jsx(gt,{asChild:!0,disableOutsidePointerEvents:!0,onEscapeKeyDown:c,onPointerDownOutside:a,onFocusOutside:v=>v.preventDefault(),onDismiss:()=>m.onOpenChange(!1),children:i.jsx(se,{role:"listbox",id:m.contentId,"data-state":m.open?"open":"closed",dir:m.dir,onContextMenu:v=>v.preventDefault(),...S,...le,onPlaced:()=>F(!0),ref:T,style:{display:"flex",flexDirection:"column",outline:"none",...S.style},onKeyDown:R(S.onKeyDown,v=>{const _=v.ctrlKey||v.altKey||v.metaKey;if(v.key==="Tab"&&v.preventDefault(),!_&&v.key.length===1&&oe(v.key),["ArrowUp","ArrowDown","Home","End"].includes(v.key)){let w=O().filter(b=>!b.disabled).map(b=>b.ref.current);if(["ArrowUp","End"].includes(v.key)&&(w=w.slice().reverse()),["ArrowUp","ArrowDown"].includes(v.key)){const b=v.target,x=w.indexOf(b);w=w.slice(x+1)}setTimeout(()=>N(w)),v.preventDefault()}})})})})})})});Xe.displayName=kt;var Ft="SelectItemAlignedPosition",Je=n.forwardRef((t,s)=>{const{__scopeSelect:e,onPlaced:u,...l}=t,c=z(te,e),a=$(te,e),[r,o]=n.useState(null),[p,g]=n.useState(null),y=B(s,T=>g(T)),I=ce(e),E=n.useRef(!1),C=n.useRef(!0),{viewport:d,selectedItem:h,selectedItemText:S,focusSelectedItem:m}=a,f=n.useCallback(()=>{if(c.trigger&&c.valueNode&&r&&p&&d&&h&&S){const T=c.trigger.getBoundingClientRect(),D=p.getBoundingClientRect(),A=c.valueNode.getBoundingClientRect(),H=S.getBoundingClientRect();if(c.dir!=="rtl"){const b=H.left-D.left,x=A.left-b,Z=T.left-x,Q=T.width+Z,ve=Math.max(Q,D.width),he=window.innerWidth-j,ge=Pe(x,[j,Math.max(j,he-ve)]);r.style.minWidth=Q+"px",r.style.left=ge+"px"}else{const b=D.right-H.right,x=window.innerWidth-A.right-b,Z=window.innerWidth-T.right-x,Q=T.width+Z,ve=Math.max(Q,D.width),he=window.innerWidth-j,ge=Pe(x,[j,Math.max(j,he-ve)]);r.style.minWidth=Q+"px",r.style.right=ge+"px"}const L=I(),O=window.innerHeight-j*2,U=d.scrollHeight,F=window.getComputedStyle(p),K=parseInt(F.borderTopWidth,10),N=parseInt(F.paddingTop,10),k=parseInt(F.borderBottomWidth,10),W=parseInt(F.paddingBottom,10),G=K+N+U+W+k,pe=Math.min(h.offsetHeight*5,G),oe=window.getComputedStyle(d),me=parseInt(oe.paddingTop,10),fe=parseInt(oe.paddingBottom,10),ne=T.top+T.height/2-j,se=O-ne,le=h.offsetHeight/2,v=h.offsetTop+le,_=K+N+v,M=G-_;if(_<=ne){const b=L.length>0&&h===L[L.length-1].ref.current;r.style.bottom="0px";const x=p.clientHeight-d.offsetTop-d.offsetHeight,Z=Math.max(se,le+(b?fe:0)+x+k),Q=_+Z;r.style.height=Q+"px"}else{const b=L.length>0&&h===L[0].ref.current;r.style.top="0px";const Z=Math.max(ne,K+d.offsetTop+(b?me:0)+le)+M;r.style.height=Z+"px",d.scrollTop=_-ne+d.offsetTop}r.style.margin=`${j}px 0`,r.style.minHeight=pe+"px",r.style.maxHeight=O+"px",u==null||u(),requestAnimationFrame(()=>E.current=!0)}},[I,c.trigger,c.valueNode,r,p,d,h,S,c.dir,u]);J(()=>f(),[f]);const[P,V]=n.useState();J(()=>{p&&V(window.getComputedStyle(p).zIndex)},[p]);const Y=n.useCallback(T=>{T&&C.current===!0&&(f(),m==null||m(),C.current=!1)},[f,m]);return i.jsx(Wt,{scope:e,contentWrapper:r,shouldExpandOnScrollRef:E,onScrollButtonChange:Y,children:i.jsx("div",{ref:o,style:{display:"flex",flexDirection:"column",position:"fixed",zIndex:P},children:i.jsx(q.div,{...l,ref:y,style:{boxSizing:"border-box",maxHeight:"100%",...l.style}})})})});Je.displayName=Ft;var Kt="SelectPopperPosition",ye=n.forwardRef((t,s)=>{const{__scopeSelect:e,align:u="start",collisionPadding:l=j,...c}=t,a=de(e);return i.jsx(yt,{...a,...c,ref:s,align:u,collisionPadding:l,style:{boxSizing:"border-box",...c.style,"--radix-select-content-transform-origin":"var(--radix-popper-transform-origin)","--radix-select-content-available-width":"var(--radix-popper-available-width)","--radix-select-content-available-height":"var(--radix-popper-available-height)","--radix-select-trigger-width":"var(--radix-popper-anchor-width)","--radix-select-trigger-height":"var(--radix-popper-anchor-height)"}})});ye.displayName=Kt;var[Wt,Te]=ae(te,{}),Se="SelectViewport",ze=n.forwardRef((t,s)=>{const{__scopeSelect:e,nonce:u,...l}=t,c=$(Se,e),a=Te(Se,e),r=B(s,c.onViewportChange),o=n.useRef(0);return i.jsxs(i.Fragment,{children:[i.jsx("style",{dangerouslySetInnerHTML:{__html:"[data-radix-select-viewport]{scrollbar-width:none;-ms-overflow-style:none;-webkit-overflow-scrolling:touch;}[data-radix-select-viewport]::-webkit-scrollbar{display:none}"},nonce:u}),i.jsx(ue.Slot,{scope:e,children:i.jsx(q.div,{"data-radix-select-viewport":"",role:"presentation",...l,ref:r,style:{position:"relative",flex:1,overflow:"hidden auto",...l.style},onScroll:R(l.onScroll,p=>{const g=p.currentTarget,{contentWrapper:y,shouldExpandOnScrollRef:I}=a;if(I!=null&&I.current&&y){const E=Math.abs(o.current-g.scrollTop);if(E>0){const C=window.innerHeight-j*2,d=parseFloat(y.style.minHeight),h=parseFloat(y.style.height),S=Math.max(d,h);if(S<C){const m=S+E,f=Math.min(C,m),P=m-f;y.style.height=f+"px",y.style.bottom==="0px"&&(g.scrollTop=P>0?P:0,y.style.justifyContent="flex-end")}}}o.current=g.scrollTop})})})]})});ze.displayName=Se;var $e="SelectGroup",[Ut,Gt]=ae($e),Ye=n.forwardRef((t,s)=>{const{__scopeSelect:e,...u}=t,l=Ee();return i.jsx(Ut,{scope:e,id:l,children:i.jsx(q.div,{role:"group","aria-labelledby":l,...u,ref:s})})});Ye.displayName=$e;var Ze="SelectLabel",Qe=n.forwardRef((t,s)=>{const{__scopeSelect:e,...u}=t,l=Gt(Ze,e);return i.jsx(q.div,{id:l.id,...u,ref:s})});Qe.displayName=Ze;var ie="SelectItem",[Xt,et]=ae(ie),tt=n.forwardRef((t,s)=>{const{__scopeSelect:e,value:u,disabled:l=!1,textValue:c,...a}=t,r=z(ie,e),o=$(ie,e),p=r.value===u,[g,y]=n.useState(c??""),[I,E]=n.useState(!1),C=B(s,m=>{var f;return(f=o.itemRefCallback)==null?void 0:f.call(o,m,u,l)}),d=Ee(),h=n.useRef("touch"),S=()=>{l||(r.onValueChange(u),r.onOpenChange(!1))};if(u==="")throw new Error("A <Select.Item /> must have a value prop that is not an empty string. This is because the Select value can be set to an empty string to clear the selection and show the placeholder.");return i.jsx(Xt,{scope:e,value:u,disabled:l,textId:d,isSelected:p,onItemTextChange:n.useCallback(m=>{y(f=>f||((m==null?void 0:m.textContent)??"").trim())},[]),children:i.jsx(ue.ItemSlot,{scope:e,value:u,disabled:l,textValue:g,children:i.jsx(q.div,{role:"option","aria-labelledby":d,"data-highlighted":I?"":void 0,"aria-selected":p&&I,"data-state":p?"checked":"unchecked","aria-disabled":l||void 0,"data-disabled":l?"":void 0,tabIndex:l?void 0:-1,...a,ref:C,onFocus:R(a.onFocus,()=>E(!0)),onBlur:R(a.onBlur,()=>E(!1)),onClick:R(a.onClick,()=>{h.current!=="mouse"&&S()}),onPointerUp:R(a.onPointerUp,()=>{h.current==="mouse"&&S()}),onPointerDown:R(a.onPointerDown,m=>{h.current=m.pointerType}),onPointerMove:R(a.onPointerMove,m=>{var f;h.current=m.pointerType,l?(f=o.onItemLeave)==null||f.call(o):h.current==="mouse"&&m.currentTarget.focus({preventScroll:!0})}),onPointerLeave:R(a.onPointerLeave,m=>{var f;m.currentTarget===document.activeElement&&((f=o.onItemLeave)==null||f.call(o))}),onKeyDown:R(a.onKeyDown,m=>{var P;((P=o.searchRef)==null?void 0:P.current)!==""&&m.key===" "||(qt.includes(m.key)&&S(),m.key===" "&&m.preventDefault())})})})})});tt.displayName=ie;var re="SelectItemText",nt=n.forwardRef((t,s)=>{const{__scopeSelect:e,className:u,style:l,...c}=t,a=z(re,e),r=$(re,e),o=et(re,e),p=jt(re,e),[g,y]=n.useState(null),I=B(s,S=>y(S),o.onItemTextChange,S=>{var m;return(m=r.itemTextRefCallback)==null?void 0:m.call(r,S,o.value,o.disabled)}),E=g==null?void 0:g.textContent,C=n.useMemo(()=>i.jsx("option",{value:o.value,disabled:o.disabled,children:E},o.value),[o.disabled,o.value,E]),{onNativeOptionAdd:d,onNativeOptionRemove:h}=p;return J(()=>(d(C),()=>h(C)),[d,h,C]),i.jsxs(i.Fragment,{children:[i.jsx(q.span,{id:o.textId,...c,ref:I}),o.isSelected&&a.valueNode&&!a.valueNodeHasChildren?De.createPortal(c.children,a.valueNode):null]})});nt.displayName=re;var at="SelectItemIndicator",lt=n.forwardRef((t,s)=>{const{__scopeSelect:e,...u}=t;return et(at,e).isSelected?i.jsx(q.span,{"aria-hidden":!0,...u,ref:s}):null});lt.displayName=at;var be="SelectScrollUpButton",Jt=n.forwardRef((t,s)=>{const e=$(be,t.__scopeSelect),u=Te(be,t.__scopeSelect),[l,c]=n.useState(!1),a=B(s,u.onScrollButtonChange);return J(()=>{if(e.viewport&&e.isPositioned){let r=function(){const p=o.scrollTop>0;c(p)};const o=e.viewport;return r(),o.addEventListener("scroll",r),()=>o.removeEventListener("scroll",r)}},[e.viewport,e.isPositioned]),l?i.jsx(rt,{...t,ref:a,onAutoScroll:()=>{const{viewport:r,selectedItem:o}=e;r&&o&&(r.scrollTop=r.scrollTop-o.offsetHeight)}}):null});Jt.displayName=be;var xe="SelectScrollDownButton",zt=n.forwardRef((t,s)=>{const e=$(xe,t.__scopeSelect),u=Te(xe,t.__scopeSelect),[l,c]=n.useState(!1),a=B(s,u.onScrollButtonChange);return J(()=>{if(e.viewport&&e.isPositioned){let r=function(){const p=o.scrollHeight-o.clientHeight,g=Math.ceil(o.scrollTop)<p;c(g)};const o=e.viewport;return r(),o.addEventListener("scroll",r),()=>o.removeEventListener("scroll",r)}},[e.viewport,e.isPositioned]),l?i.jsx(rt,{...t,ref:a,onAutoScroll:()=>{const{viewport:r,selectedItem:o}=e;r&&o&&(r.scrollTop=r.scrollTop+o.offsetHeight)}}):null});zt.displayName=xe;var rt=n.forwardRef((t,s)=>{const{__scopeSelect:e,onAutoScroll:u,...l}=t,c=$("SelectScrollButton",e),a=n.useRef(null),r=ce(e),o=n.useCallback(()=>{a.current!==null&&(window.clearInterval(a.current),a.current=null)},[]);return n.useEffect(()=>()=>o(),[o]),J(()=>{var g;const p=r().find(y=>y.ref.current===document.activeElement);(g=p==null?void 0:p.ref.current)==null||g.scrollIntoView({block:"nearest"})},[r]),i.jsx(q.div,{"aria-hidden":!0,...l,ref:s,style:{flexShrink:0,...l.style},onPointerDown:R(l.onPointerDown,()=>{a.current===null&&(a.current=window.setInterval(u,50))}),onPointerMove:R(l.onPointerMove,()=>{var p;(p=c.onItemLeave)==null||p.call(c),a.current===null&&(a.current=window.setInterval(u,50))}),onPointerLeave:R(l.onPointerLeave,()=>{o()})})}),$t="SelectSeparator",Yt=n.forwardRef((t,s)=>{const{__scopeSelect:e,...u}=t;return i.jsx(q.div,{"aria-hidden":!0,...u,ref:s})});Yt.displayName=$t;var we="SelectArrow",Zt=n.forwardRef((t,s)=>{const{__scopeSelect:e,...u}=t,l=de(e),c=z(we,e),a=$(we,e);return c.open&&a.position==="popper"?i.jsx(St,{...l,...u,ref:s}):null});Zt.displayName=we;var Qt="SelectBubbleInput",ot=n.forwardRef(({__scopeSelect:t,value:s,...e},u)=>{const l=n.useRef(null),c=B(u,l),a=Rt(s);return n.useEffect(()=>{const r=l.current;if(!r)return;const o=window.HTMLSelectElement.prototype,g=Object.getOwnPropertyDescriptor(o,"value").set;if(a!==s&&g){const y=new Event("change",{bubbles:!0});g.call(r,s),r.dispatchEvent(y)}},[a,s]),i.jsx(q.select,{...e,style:{...ft,...e.style},ref:c,defaultValue:s})});ot.displayName=Qt;function st(t){return t===""||t===void 0}function it(t){const s=vt(t),e=n.useRef(""),u=n.useRef(0),l=n.useCallback(a=>{const r=e.current+a;s(r),(function o(p){e.current=p,window.clearTimeout(u.current),p!==""&&(u.current=window.setTimeout(()=>o(""),1e3))})(r)},[s]),c=n.useCallback(()=>{e.current="",window.clearTimeout(u.current)},[]);return n.useEffect(()=>()=>window.clearTimeout(u.current),[]),[e,l,c]}function ut(t,s,e){const l=s.length>1&&Array.from(s).every(p=>p===s[0])?s[0]:s,c=e?t.indexOf(e):-1;let a=en(t,Math.max(c,0));l.length===1&&(a=a.filter(p=>p!==e));const o=a.find(p=>p.textValue.toLowerCase().startsWith(l.toLowerCase()));return o!==e?o:void 0}function en(t,s){return t.map((e,u)=>t[(s+u)%t.length])}var tn=Ae,nn=ke,an=Fe,ln=Ke,rn=We,on=Ue,sn=ze,un=Ye,cn=Qe,dn=tt,pn=nt,mn=lt;const fn="trigger__XRceG",vn="chevron__ENwnv",hn="content__NHVeq",gn="viewport__aqXUS",yn="item__7lwGu",Sn="indicator__NkOzD",bn="group__feJjZ",xn="groupLabel__VdJlH",X={trigger:fn,chevron:vn,content:hn,viewport:gn,item:yn,indicator:Sn,group:bn,groupLabel:xn};function wn(t){const e=`(min-width: ${Ct[t]}px)`,[u,l]=n.useState(!1);return n.useEffect(()=>{const c=window.matchMedia(e);l(c.matches);const a=r=>{l(r.matches)};return c.addEventListener("change",a),()=>{c.removeEventListener("change",a)}},[e]),u}const Ie=n.forwardRef(function({value:s,defaultValue:e,placeholder:u,disabled:l,onValueChange:c,children:a,dataset:r,icon:o,name:p,id:g,required:y,onFocus:I,onBlur:E,onKeyDown:C,onKeyUp:d,"aria-label":h,"aria-labelledby":S,"aria-describedby":m,"aria-invalid":f,"aria-errormessage":P},V){const[Y,T]=n.useState(!1),D=bt(),A=Oe(r,{preplyDsComponent:Re.Select}),H=wn("medium-s"),L=O=>{c==null||c(O)};return i.jsxs(tn,{value:s,defaultValue:e,onValueChange:L,disabled:l,name:p,open:Y,onOpenChange:T,required:y,children:[i.jsxs(nn,{ref:V,id:g,className:X.trigger,onFocus:I,onBlur:E,onKeyDown:C,onKeyUp:d,"aria-label":h,"aria-labelledby":S,"aria-describedby":m,"aria-invalid":f,"aria-errormessage":P,...A,children:[o,i.jsx(an,{placeholder:u}),i.jsx(ln,{className:X.chevron,children:i.jsx(je,{svg:wt})})]}),i.jsx(rn,{container:D,children:i.jsx(on,{position:H?"popper":void 0,sideOffset:H?5:void 0,className:X.content,children:i.jsx(sn,{className:X.viewport,role:"group",tabIndex:0,children:a})})})]})});function Ce({value:t,disabled:s,children:e,leadingIcon:u,dataset:l}){return i.jsxs(dn,{value:t,disabled:s,className:X.item,...Oe(l,{preplyDsComponent:Re.SelectFieldOption}),children:[u,i.jsx(pn,{children:e}),i.jsx(mn,{className:X.indicator,children:i.jsx(je,{svg:It})})]})}function _e({children:t,label:s}){return i.jsxs(un,{className:X.group,children:[i.jsx(cn,{className:X.groupLabel,children:s}),t]})}try{Ce.displayName="SelectOption",Ce.__docgenInfo={description:"",displayName:"SelectOption",props:{value:{defaultValue:null,description:"",name:"value",required:!0,type:{name:"string"}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},leadingIcon:{defaultValue:null,description:"",name:"leadingIcon",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}}}}}catch{}try{_e.displayName="SelectGroup",_e.__docgenInfo={description:"",displayName:"SelectGroup",props:{label:{defaultValue:null,description:"",name:"label",required:!0,type:{name:"enum",value:[{value:"undefined"},{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}}}}}catch{}try{Ie.displayName="Select",Ie.__docgenInfo={description:"",displayName:"Select",props:{id:{defaultValue:null,description:"",name:"id",required:!1,type:{name:"enum",value:[{value:"string"}]}},onBlur:{defaultValue:null,description:"",name:"onBlur",required:!1,type:{name:"enum",value:[{value:"FocusEventHandler<HTMLButtonElement>"}]}},onFocus:{defaultValue:null,description:"",name:"onFocus",required:!1,type:{name:"enum",value:[{value:"FocusEventHandler<HTMLButtonElement>"}]}},"aria-label":{defaultValue:null,description:`Defines a string value that labels the current element.
+@see aria-labelledby.`,name:"aria-label",required:!1,type:{name:"enum",value:[{value:"string"}]}},"aria-labelledby":{defaultValue:null,description:`Identifies the element (or elements) that labels the current element.
+@see aria-describedby.`,name:"aria-labelledby",required:!1,type:{name:"enum",value:[{value:"string"}]}},"aria-describedby":{defaultValue:null,description:`Identifies the element (or elements) that describes the object.
+@see aria-labelledby`,name:"aria-describedby",required:!1,type:{name:"enum",value:[{value:"string"}]}},onKeyDown:{defaultValue:null,description:"",name:"onKeyDown",required:!1,type:{name:"enum",value:[{value:"KeyboardEventHandler<HTMLButtonElement>"}]}},onKeyUp:{defaultValue:null,description:"",name:"onKeyUp",required:!1,type:{name:"enum",value:[{value:"KeyboardEventHandler<HTMLButtonElement>"}]}},"aria-errormessage":{defaultValue:null,description:`Identifies the element that provides an error message for the object.
 @see aria-invalid
 @see aria-describedby.`,name:"aria-errormessage",required:!1,type:{name:"enum",value:[{value:"string"}]}},"aria-invalid":{defaultValue:null,description:`Indicates the entered value does not conform to the format expected by the application.
-@see aria-errormessage.`,name:"aria-invalid",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"},{value:'"false"'},{value:'"true"'},{value:'"grammar"'},{value:'"spelling"'}]}},"aria-label":{defaultValue:null,description:`Defines a string value that labels the current element.
-@see aria-labelledby.`,name:"aria-label",required:!1,type:{name:"enum",value:[{value:"string"}]}},"aria-labelledby":{defaultValue:null,description:`Identifies the element (or elements) that labels the current element.
-@see aria-describedby.`,name:"aria-labelledby",required:!1,type:{name:"enum",value:[{value:"string"}]}},onFocus:{defaultValue:null,description:"",name:"onFocus",required:!1,type:{name:"enum",value:[{value:"FocusEventHandler<HTMLButtonElement>"}]}},onBlur:{defaultValue:null,description:"",name:"onBlur",required:!1,type:{name:"enum",value:[{value:"FocusEventHandler<HTMLButtonElement>"}]}},onKeyDown:{defaultValue:null,description:"",name:"onKeyDown",required:!1,type:{name:"enum",value:[{value:"KeyboardEventHandler<HTMLButtonElement>"}]}},onKeyUp:{defaultValue:null,description:"",name:"onKeyUp",required:!1,type:{name:"enum",value:[{value:"KeyboardEventHandler<HTMLButtonElement>"}]}},value:{defaultValue:null,description:"Controlled value of the select",name:"value",required:!1,type:{name:"enum",value:[{value:"string"}]}},defaultValue:{defaultValue:null,description:"Default value when uncontrolled",name:"defaultValue",required:!1,type:{name:"enum",value:[{value:"string"}]}},placeholder:{defaultValue:null,description:"Placeholder text when no value is selected",name:"placeholder",required:!1,type:{name:"enum",value:[{value:"string"}]}},disabled:{defaultValue:null,description:"Whether the select is disabled",name:"disabled",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},onValueChange:{defaultValue:null,description:"Callback when value changes",name:"onValueChange",required:!1,type:{name:"enum",value:[{value:"(value: string) => void"}]}},children:{defaultValue:null,description:"Items to display in the select",name:"children",required:!0,type:{name:"enum",value:[{value:"undefined"},{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},dataset:{defaultValue:null,description:"Dataset for the trigger element",name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},icon:{defaultValue:null,description:"Icon to display on the left side",name:"icon",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},name:{defaultValue:null,description:"HTML name attribute",name:"name",required:!1,type:{name:"enum",value:[{value:"string"}]}},required:{defaultValue:null,description:"Whether the select is required",name:"required",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},ref:{defaultValue:null,description:"Allows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n@see {@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}",name:"ref",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"(instance: HTMLButtonElement | null) => void"},{value:"RefObject<HTMLButtonElement>"}]}},key:{defaultValue:null,description:"",name:"key",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"bigint"}]}}}}}catch{}const Ve=n.forwardRef(function({id:s,label:e,description:u,error:l,required:c,dataset:a,hideLabel:r,hasError:o,useLegacyRequiredLabel:p,inputDataset:g,...y},C){return i.jsx(xt,{id:s,label:e,description:u,error:l,hasError:o,required:c,dataset:a,hideLabel:r,useLegacyRequiredLabel:p,preplyDsComponent:Re.SelectField,children:i.jsx(Ce,{ref:C,dataset:g,...y})})}),Me=Ie,qe=_e;try{Ve.displayName="SelectField",Ve.__docgenInfo={description:"",displayName:"SelectField",props:{onClick:{defaultValue:null,description:"",name:"onClick",required:!1,type:{name:"enum",value:[{value:"MouseEventHandler<HTMLDivElement>"}]}},dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},label:{defaultValue:null,description:"The field label. This is needed for accessibility purposes, but can be\nhidden using the `hideLabel` prop.",name:"label",required:!0,type:{name:"enum",value:[{value:"undefined"},{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},id:{defaultValue:null,description:`The id to be passed to the input element.
-If not provided, will be generated for accessibility purposes.`,name:"id",required:!1,type:{name:"enum",value:[{value:"string"}]}},hasError:{defaultValue:null,description:"Whether the field has an error.\n@deprecated Use `error` prop to explicitly describe the error to users",name:"hasError",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},required:{defaultValue:null,description:`Indicates if the field is required. When false, adds a "Optional"
+@see aria-errormessage.`,name:"aria-invalid",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"},{value:'"true"'},{value:'"false"'},{value:'"grammar"'},{value:'"spelling"'}]}},value:{defaultValue:null,description:"Controlled value of the select",name:"value",required:!1,type:{name:"enum",value:[{value:"string"}]}},defaultValue:{defaultValue:null,description:"Default value when uncontrolled",name:"defaultValue",required:!1,type:{name:"enum",value:[{value:"string"}]}},placeholder:{defaultValue:null,description:"Placeholder text when no value is selected",name:"placeholder",required:!1,type:{name:"enum",value:[{value:"string"}]}},disabled:{defaultValue:null,description:"Whether the select is disabled",name:"disabled",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},onValueChange:{defaultValue:null,description:"Callback when value changes",name:"onValueChange",required:!1,type:{name:"enum",value:[{value:"(value: string) => void"}]}},children:{defaultValue:null,description:"Items to display in the select",name:"children",required:!0,type:{name:"enum",value:[{value:"undefined"},{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},dataset:{defaultValue:null,description:"Dataset for the trigger element",name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},icon:{defaultValue:null,description:"Icon to display on the left side",name:"icon",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},name:{defaultValue:null,description:"HTML name attribute",name:"name",required:!1,type:{name:"enum",value:[{value:"string"}]}},required:{defaultValue:null,description:"Whether the select is required",name:"required",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},ref:{defaultValue:null,description:"Allows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n@see {@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}",name:"ref",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"(instance: HTMLButtonElement | null) => void"},{value:"RefObject<HTMLButtonElement>"}]}},key:{defaultValue:null,description:"",name:"key",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"bigint"}]}}}}}catch{}const Ve=n.forwardRef(function({id:s,label:e,description:u,error:l,required:c,dataset:a,hideLabel:r,hasError:o,useLegacyRequiredLabel:p,inputDataset:g,...y},I){return i.jsx(xt,{id:s,label:e,description:u,error:l,hasError:o,required:c,dataset:a,hideLabel:r,useLegacyRequiredLabel:p,preplyDsComponent:Re.SelectField,children:i.jsx(Ie,{ref:I,dataset:g,...y})})}),Me=Ce,qe=_e;try{Ve.displayName="SelectField",Ve.__docgenInfo={description:"",displayName:"SelectField",props:{dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},id:{defaultValue:null,description:`The id to be passed to the input element.
+If not provided, will be generated for accessibility purposes.`,name:"id",required:!1,type:{name:"enum",value:[{value:"string"}]}},required:{defaultValue:null,description:`Indicates if the field is required. When false, adds a "Optional"
 indicator next to the label.
-Whether the select is required`,name:"required",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},description:{defaultValue:null,description:`Additional descriptive text that appears below the input field
-to provide more context or instructions to the user.`,name:"description",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},hideLabel:{defaultValue:null,description:"Use this to hide the `label` visually, but keep it in the accessibility\ntree.",name:"hideLabel",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},error:{defaultValue:null,description:"Error message to display when the field has an invalid value.",name:"error",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},useLegacyRequiredLabel:{defaultValue:null,description:`When true, adds a "Required" indicator next to the label for the required fields.
+Whether the select is required`,name:"required",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},hasError:{defaultValue:null,description:"Whether the field has an error.\n@deprecated Use `error` prop to explicitly describe the error to users",name:"hasError",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},onClick:{defaultValue:null,description:"",name:"onClick",required:!1,type:{name:"enum",value:[{value:"MouseEventHandler<HTMLDivElement>"}]}},label:{defaultValue:null,description:"The field label. This is needed for accessibility purposes, but can be\nhidden using the `hideLabel` prop.",name:"label",required:!0,type:{name:"enum",value:[{value:"undefined"},{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},hideLabel:{defaultValue:null,description:"Use this to hide the `label` visually, but keep it in the accessibility\ntree.",name:"hideLabel",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},description:{defaultValue:null,description:`Additional descriptive text that appears below the input field
+to provide more context or instructions to the user.`,name:"description",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},error:{defaultValue:null,description:"Error message to display when the field has an invalid value.",name:"error",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},useLegacyRequiredLabel:{defaultValue:null,description:`When true, adds a "Required" indicator next to the label for the required fields.
 When false, adds a "Optional" indicator next to the label for the optional fields instead.
-@deprecated This is a temporary solution for gradual migration to the "Optional" label.`,name:"useLegacyRequiredLabel",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},children:{defaultValue:null,description:"Items to display in the select",name:"children",required:!0,type:{name:"enum",value:[{value:"undefined"},{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},defaultValue:{defaultValue:null,description:"Default value when uncontrolled",name:"defaultValue",required:!1,type:{name:"enum",value:[{value:"string"}]}},"aria-describedby":{defaultValue:null,description:`Identifies the element (or elements) that describes the object.
-@see aria-labelledby`,name:"aria-describedby",required:!1,type:{name:"enum",value:[{value:"string"}]}},"aria-errormessage":{defaultValue:null,description:`Identifies the element that provides an error message for the object.
+@deprecated This is a temporary solution for gradual migration to the "Optional" label.`,name:"useLegacyRequiredLabel",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},children:{defaultValue:null,description:"Items to display in the select",name:"children",required:!0,type:{name:"enum",value:[{value:"undefined"},{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},placeholder:{defaultValue:null,description:"Placeholder text when no value is selected",name:"placeholder",required:!1,type:{name:"enum",value:[{value:"string"}]}},disabled:{defaultValue:null,description:"Whether the select is disabled",name:"disabled",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},name:{defaultValue:null,description:"HTML name attribute",name:"name",required:!1,type:{name:"enum",value:[{value:"string"}]}},onBlur:{defaultValue:null,description:"",name:"onBlur",required:!1,type:{name:"enum",value:[{value:"FocusEventHandler<HTMLButtonElement>"}]}},onFocus:{defaultValue:null,description:"",name:"onFocus",required:!1,type:{name:"enum",value:[{value:"FocusEventHandler<HTMLButtonElement>"}]}},"aria-label":{defaultValue:null,description:`Defines a string value that labels the current element.
+@see aria-labelledby.`,name:"aria-label",required:!1,type:{name:"enum",value:[{value:"string"}]}},"aria-labelledby":{defaultValue:null,description:`Identifies the element (or elements) that labels the current element.
+@see aria-describedby.`,name:"aria-labelledby",required:!1,type:{name:"enum",value:[{value:"string"}]}},"aria-describedby":{defaultValue:null,description:`Identifies the element (or elements) that describes the object.
+@see aria-labelledby`,name:"aria-describedby",required:!1,type:{name:"enum",value:[{value:"string"}]}},onKeyDown:{defaultValue:null,description:"",name:"onKeyDown",required:!1,type:{name:"enum",value:[{value:"KeyboardEventHandler<HTMLButtonElement>"}]}},onKeyUp:{defaultValue:null,description:"",name:"onKeyUp",required:!1,type:{name:"enum",value:[{value:"KeyboardEventHandler<HTMLButtonElement>"}]}},defaultValue:{defaultValue:null,description:"Default value when uncontrolled",name:"defaultValue",required:!1,type:{name:"enum",value:[{value:"string"}]}},"aria-errormessage":{defaultValue:null,description:`Identifies the element that provides an error message for the object.
 @see aria-invalid
 @see aria-describedby.`,name:"aria-errormessage",required:!1,type:{name:"enum",value:[{value:"string"}]}},"aria-invalid":{defaultValue:null,description:`Indicates the entered value does not conform to the format expected by the application.
-@see aria-errormessage.`,name:"aria-invalid",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"},{value:'"false"'},{value:'"true"'},{value:'"grammar"'},{value:'"spelling"'}]}},"aria-label":{defaultValue:null,description:`Defines a string value that labels the current element.
-@see aria-labelledby.`,name:"aria-label",required:!1,type:{name:"enum",value:[{value:"string"}]}},"aria-labelledby":{defaultValue:null,description:`Identifies the element (or elements) that labels the current element.
-@see aria-describedby.`,name:"aria-labelledby",required:!1,type:{name:"enum",value:[{value:"string"}]}},onFocus:{defaultValue:null,description:"",name:"onFocus",required:!1,type:{name:"enum",value:[{value:"FocusEventHandler<HTMLButtonElement>"}]}},onBlur:{defaultValue:null,description:"",name:"onBlur",required:!1,type:{name:"enum",value:[{value:"FocusEventHandler<HTMLButtonElement>"}]}},onKeyDown:{defaultValue:null,description:"",name:"onKeyDown",required:!1,type:{name:"enum",value:[{value:"KeyboardEventHandler<HTMLButtonElement>"}]}},onKeyUp:{defaultValue:null,description:"",name:"onKeyUp",required:!1,type:{name:"enum",value:[{value:"KeyboardEventHandler<HTMLButtonElement>"}]}},disabled:{defaultValue:null,description:"Whether the select is disabled",name:"disabled",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},name:{defaultValue:null,description:"HTML name attribute",name:"name",required:!1,type:{name:"enum",value:[{value:"string"}]}},value:{defaultValue:null,description:"Controlled value of the select",name:"value",required:!1,type:{name:"enum",value:[{value:"string"}]}},icon:{defaultValue:null,description:"Icon to display on the left side",name:"icon",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},onValueChange:{defaultValue:null,description:"Callback when value changes",name:"onValueChange",required:!1,type:{name:"enum",value:[{value:"(value: string) => void"}]}},placeholder:{defaultValue:null,description:"Placeholder text when no value is selected",name:"placeholder",required:!1,type:{name:"enum",value:[{value:"string"}]}},inputDataset:{defaultValue:null,description:"Dataset for the input element",name:"inputDataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},ref:{defaultValue:null,description:"Allows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n@see {@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}",name:"ref",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"(instance: HTMLButtonElement | null) => void"},{value:"RefObject<HTMLButtonElement>"}]}},key:{defaultValue:null,description:"",name:"key",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"bigint"}]}}}}}catch{}try{Me.displayName="SelectFieldOption",Me.__docgenInfo={description:"",displayName:"SelectFieldOption",props:{value:{defaultValue:null,description:"",name:"value",required:!0,type:{name:"string"}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},leadingIcon:{defaultValue:null,description:"",name:"leadingIcon",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}}}}}catch{}try{qe.displayName="SelectFieldGroup",qe.__docgenInfo={description:"",displayName:"SelectFieldGroup",props:{label:{defaultValue:null,description:"",name:"label",required:!0,type:{name:"enum",value:[{value:"undefined"},{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}}}}}catch{}export{qe as S,Me as a,Ve as b};
+@see aria-errormessage.`,name:"aria-invalid",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"},{value:'"true"'},{value:'"false"'},{value:'"grammar"'},{value:'"spelling"'}]}},icon:{defaultValue:null,description:"Icon to display on the left side",name:"icon",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},onValueChange:{defaultValue:null,description:"Callback when value changes",name:"onValueChange",required:!1,type:{name:"enum",value:[{value:"(value: string) => void"}]}},value:{defaultValue:null,description:"Controlled value of the select",name:"value",required:!1,type:{name:"enum",value:[{value:"string"}]}},inputDataset:{defaultValue:null,description:"Dataset for the input element",name:"inputDataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},ref:{defaultValue:null,description:"Allows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n@see {@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}",name:"ref",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"(instance: HTMLButtonElement | null) => void"},{value:"RefObject<HTMLButtonElement>"}]}},key:{defaultValue:null,description:"",name:"key",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"bigint"}]}}}}}catch{}try{Me.displayName="SelectFieldOption",Me.__docgenInfo={description:"",displayName:"SelectFieldOption",props:{value:{defaultValue:null,description:"",name:"value",required:!0,type:{name:"string"}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},leadingIcon:{defaultValue:null,description:"",name:"leadingIcon",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}}}}}catch{}try{qe.displayName="SelectFieldGroup",qe.__docgenInfo={description:"",displayName:"SelectFieldGroup",props:{label:{defaultValue:null,description:"",name:"label",required:!0,type:{name:"enum",value:[{value:"undefined"},{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}}}}}catch{}export{qe as S,Me as a,Ve as b};

package/dist/assets/{SelectField.stories-D6sJHBcs.js → SelectField.stories-BKCyFPQa.js}

@@ -1,4 +1,4 @@
-import{j as e,r as z}from"./iframe-DjYTJz7A.js";import{F as y}from"./TokyoUILanguage-Bd98PINi.js";import{I as v}from"./Icon-kphbe0CE.js";import{S as b,a,b as D}from"./SelectField-BRicVVj7.js";import{D as Ye}from"./Dialog-DaLOtRn0.js";import{B as Qe}from"./Button-DS2bg8PO.js";import{C as i}from"./CountryFlag-BKEpYyWK.js";import"./preload-helper-Dp1pzeXC.js";import"./text-accent-C5-m5mrW.js";import"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import"./render-icon-DZ6hllTG.js";import"./componentNames-hc9KR2nX.js";import"./FormControl-DgD7Nr_L.js";import"./index-CUvrBGJo.js";import"./message-DiUVdAQd.js";import"./TokyoUIChevronDown-CqAWFBEe.js";import"./TokyoUICheckmark-CPDgq6wU.js";import"./breakpoints-BfMlrtxE.js";import"./index-C_O4jEc0.js";import"./index-DOwxXd3L.js";import"./DialogCloseButton-CDDeMFIL.js";import"./useOpenInteractionType-B976GY1b.js";import"./TokyoUIClose-DoJfpCh8.js";import"./IconButton-D4lbFOKH.js";import"./ButtonBase-sV1YoG7h.js";import"./Spinner-BG27lVzS.js";import"./useMergeRefs-CL5DIjXV.js";import"./useHostname-By9vNKnQ.js";import"./index-CC6DAVyL.js";import"./shared-strings-ZccoNgto.js";const{expect:s,userEvent:c,within:R,fn:p,waitFor:Xe}=__STORYBOOK_MODULE_TEST__,Et={title:"components/SelectField",component:D,subcomponents:{SelectFieldOption:a,SelectFieldGroup:b},parameters:{layout:"padded"},decorators:[t=>e.jsx("div",{style:{width:"min(300px, 100%)",height:"300px"},children:e.jsx(t,{})})],args:{name:"language",label:"Language",placeholder:"Select a language",defaultValue:"",dataset:{testid:"field",foo:"bar"},inputDataset:{testid:"input",foo:"bar"},onValueChange:p(),onBlur:p(),onFocus:p(),onClick:p(),onKeyDown:p(),onKeyUp:p(),children:e.jsxs(e.Fragment,{children:[e.jsx(a,{value:"english",children:"English"}),e.jsx(a,{value:"spanish",children:"Spanish"}),e.jsx(a,{value:"french",children:"French"})]})}},r={a11y:{config:{rules:[{id:"aria-hidden-focus",enabled:!1}]}}},h={parameters:r,play:async({canvasElement:t,step:n,args:o})=>{const l=R(t),u=l.getByTestId("field"),d=l.getByTestId("input");await n("it should render correct label",async()=>{const W=R(u).getByTestId("label");s(W).toHaveTextContent("Language • Optional"),s(d).toHaveAccessibleName("Language")}),await n("it should call onFocus when the input is focused",async()=>{d.focus(),s(o.onFocus).toHaveBeenCalled()}),await n("it should open the menu",async()=>{await c.keyboard("{Enter}"),await Xe(async()=>{s(await l.findByRole("listbox")).toBeInTheDocument()})}),await n("it should call callback when the value changes",async()=>{await c.keyboard("{Enter}"),s(o.onValueChange).toHaveBeenCalledWith("english"),s(o.onBlur).toHaveBeenCalledTimes(1)}),await n("it should call onBlur when the input is blurred",async()=>{await c.keyboard("{tab}"),s(o.onBlur).toHaveBeenCalledTimes(2)}),await n("it should render the dataset props",async()=>{s(u).toHaveAttribute("data-testid","field"),s(u).toHaveAttribute("data-foo","bar"),s(d).toHaveAttribute("data-testid","input"),s(d).toHaveAttribute("data-foo","bar")}),await n("it should render all options",async()=>{d.focus(),await c.keyboard("{Enter}");const W=l.getByRole("option",{name:"English"}),Ue=l.getByRole("option",{name:"Spanish"}),Ze=l.getByRole("option",{name:"French"});s(W).toBeInTheDocument(),s(Ue).toBeInTheDocument(),s(Ze).toBeInTheDocument()})}},g={render:function(n){const[o,l]=z.useState(n.value);return e.jsxs(D,{...n,value:o,onValueChange:l,children:[e.jsx(a,{value:"english",children:"English"}),e.jsx(a,{value:"spanish",children:"Spanish"}),e.jsx(a,{value:"french",children:"French"})]})},args:{label:"Language",placeholder:"Select a language...",value:"spanish",defaultValue:void 0},play:async({canvas:t,step:n})=>{await n("it should render the correct initial value",async()=>{const o=t.getByTestId("input");await s(o).toHaveTextContent("Spanish")}),await n("it should update the value when the user selects",async()=>{const o=t.getByTestId("input");o.focus(),await c.keyboard("{Enter}"),await c.keyboard("{ArrowDown}"),await c.keyboard("{Enter}"),s(o).toHaveTextContent("French")})}},S={args:{icon:e.jsx(v,{svg:y,dataset:{testid:"icon"}})},play:async({canvas:t,step:n})=>{await n("it should render the icon",async()=>{const o=t.getByTestId("icon");s(o).toBeInTheDocument()})}},x={args:{description:"We will use this to get a personalized choice of tutors"},play:async({canvas:t,step:n})=>{const o=t.getByTestId("input"),l=t.getByTestId("description");await n("it should render the description",async()=>{s(o).toHaveAccessibleDescription("We will use this to get a personalized choice of tutors"),s(l).toHaveTextContent("We will use this to get a personalized choice of tutors")})}},F={args:{required:!0},play:async({canvas:t,step:n})=>{const o=t.getByTestId("input"),l=t.getByTestId("label");await n("it should render correct label",async()=>{s(o).toHaveAccessibleName("Language"),s(l).toHaveTextContent("Language")}),await n("it should render required attribute",async()=>{s(o).toHaveAttribute("aria-required")})}},f={args:{hideLabel:!0},play:async({canvas:t,step:n})=>{await n("it should render correct a11y label",async()=>{const o=t.getByTestId("input");s(o).toHaveAccessibleName("Language")})}},w={args:{error:"This is an error message"},play:async({canvas:t,step:n})=>{const o=t.getByTestId("input"),l=t.getByTestId("error");await n("it should render the error message",async()=>{s(o).toHaveAccessibleErrorMessage("This is an error message"),s(l).toHaveTextContent("This is an error message")})}},O={args:{disabled:!0},play:async({canvas:t,step:n})=>{const o=t.getByTestId("input");await n("it should render the disabled input",async()=>{s(o).toHaveAttribute("disabled")})}},I={tags:["!autodocs"],parameters:{...r,viewport:{defaultViewport:"narrow-l"}},play:async({canvas:t})=>{t.getByRole("combobox").click()}},j={parameters:{...r,viewport:{defaultViewport:"narrow-l"},chromatic:{modes:{"narrow-l":{viewport:"narrow-l"},"medium-s":{viewport:"medium-s"},"medium-l":{viewport:"medium-l"}}}},render:function(n){const[o,l]=z.useState(!0),u=()=>l(!0),d=()=>l(!1);return e.jsxs(e.Fragment,{children:[e.jsx(Qe,{onClick:u,children:"Open"}),e.jsx(Ye,{title:"Dialog With Select",description:void 0,open:o,onClose:d,children:e.jsx(D,{...n})})]})},play:async({canvas:t})=>{const n=await t.findByRole("combobox");await c.click(n)}},B={parameters:r,args:{label:"Language with icons",placeholder:"Select a language...",children:e.jsxs(e.Fragment,{children:[e.jsx(a,{value:"english",leadingIcon:e.jsx(v,{svg:y}),children:"English"}),e.jsx(a,{value:"spanish",leadingIcon:e.jsx(v,{svg:y}),children:"Spanish"}),e.jsx(a,{value:"french",leadingIcon:e.jsx(v,{svg:y}),children:"French"})]})},play:async({canvas:t})=>{t.getByRole("combobox").click()}},T={parameters:r,args:{label:"Language with country flags",placeholder:"Select a language...",children:e.jsxs(e.Fragment,{children:[e.jsx(a,{value:"english",leadingIcon:e.jsx(i,{code:"gb",alt:"English",size:"medium"}),children:"English"}),e.jsx(a,{value:"spanish",leadingIcon:e.jsx(i,{code:"es",alt:"Spanish",size:"medium"}),children:"Spanish"}),e.jsx(a,{value:"french",leadingIcon:e.jsx(i,{code:"fr",alt:"French",size:"medium"}),children:"French"})]})},play:async({canvas:t})=>{t.getByRole("combobox").click()}},E={parameters:r,args:{label:"Languages by region",placeholder:"Select a language...",children:e.jsxs(e.Fragment,{children:[e.jsxs(b,{label:"European Languages",children:[e.jsx(a,{value:"english",children:"English"}),e.jsx(a,{value:"spanish",children:"Spanish"}),e.jsx(a,{value:"french",children:"French"}),e.jsx(a,{value:"german",children:"German"})]}),e.jsxs(b,{label:"Asian Languages",children:[e.jsx(a,{value:"mandarin",children:"Mandarin"}),e.jsx(a,{value:"japanese",children:"Japanese"}),e.jsx(a,{value:"korean",children:"Korean"}),e.jsx(a,{value:"hindi",children:"Hindi"})]})]})},play:async({canvas:t})=>{t.getByRole("combobox").click()}},C={parameters:r,args:{label:"Languages by region",placeholder:"Select a language...",children:e.jsxs(e.Fragment,{children:[e.jsxs(b,{label:"European Languages",children:[e.jsx(a,{value:"english",leadingIcon:e.jsx(i,{code:"gb",alt:"English",size:"medium"}),children:"English"}),e.jsx(a,{value:"spanish",leadingIcon:e.jsx(i,{code:"es",alt:"Spanish",size:"medium"}),children:"Spanish"}),e.jsx(a,{value:"french",leadingIcon:e.jsx(i,{code:"fr",alt:"French",size:"medium"}),children:"French"}),e.jsx(a,{value:"german",leadingIcon:e.jsx(i,{code:"de",alt:"German",size:"medium"}),children:"German"})]}),e.jsxs(b,{label:"Asian Languages",children:[e.jsx(a,{value:"mandarin",leadingIcon:e.jsx(i,{code:"cn",alt:"Mandarin",size:"medium"}),children:"Mandarin"}),e.jsx(a,{value:"japanese",leadingIcon:e.jsx(i,{code:"jp",alt:"Japanese",size:"medium"}),children:"Japanese"}),e.jsx(a,{value:"korean",leadingIcon:e.jsx(i,{code:"kr",alt:"Korean",size:"medium"}),children:"Korean"}),e.jsx(a,{value:"hindi",leadingIcon:e.jsx(i,{code:"in",alt:"Hindi",size:"medium"}),children:"Hindi"})]})]})},play:async({canvas:t})=>{t.getByRole("combobox").click()}},k={parameters:r,args:{label:"Select from many options",placeholder:"Choose a number...",children:e.jsx(e.Fragment,{children:Array.from({length:100},(t,n)=>e.jsxs(a,{value:String(n+1),children:["Option ",n+1]},n+1))})},play:async({canvas:t})=>{t.getByRole("combobox").click()}},H={parameters:r,args:{label:"Select from long options",placeholder:"Choose an option...",children:e.jsxs(e.Fragment,{children:[e.jsx(a,{value:"one",children:"Path unlocks frontend development"}),e.jsx(a,{value:"two",children:"Path unlocks rapid, high-quality frontend development"}),e.jsx(a,{value:"three",children:"Path unlocks rapid, high-quality frontend development and prototyping"})]})},play:async({canvas:t})=>{t.getByRole("combobox").click()}},L={parameters:r,decorators:[t=>e.jsx("div",{style:{width:"fit-content"},children:e.jsx(t,{})})],args:{label:"Options",placeholder:"Select an option...",defaultValue:"a",children:e.jsxs(e.Fragment,{children:[e.jsx(a,{value:"a",children:"A"}),e.jsx(a,{value:"b",children:"BCDEFGHIJKLMNOPQRSTUVWXYZ"})]})},play:async({canvas:t})=>{t.getByRole("combobox").click()}},m={render:function(){return z.useEffect(()=>(document.body.style.setProperty("--ds-select-z-index-override","20"),()=>{document.body.style.removeProperty("--ds-select-z-index-override")}),[]),e.jsxs(e.Fragment,{children:[e.jsxs(D,{label:"Language",placeholder:"Select a language..",children:[e.jsx(a,{value:"english",children:"English"}),e.jsx(a,{value:"spanish",children:"Spanish"}),e.jsx(a,{value:"french",children:"French"})]}),e.jsx("div",{style:{position:"fixed",zIndex:10,inset:"0",backgroundColor:"lightgray",pointerEvents:"none",opacity:.5}})]})},play:async({canvas:t})=>{t.getByRole("combobox").click()}},A={parameters:{chromatic:{disableSnapshot:!0}},args:{label:"Language",placeholder:"Select a subject",description:"We will use this to get a personalized choice of tutors",children:e.jsxs(e.Fragment,{children:[e.jsx(a,{value:"english",children:"English"}),e.jsx(a,{value:"spanish",children:"Spanish"}),e.jsx(a,{value:"french",children:"French"})]})},argTypes:{label:{control:"text"},placeholder:{control:"text"},description:{control:"text"},error:{control:"text"},value:{control:"text"},defaultValue:{control:"text"},inputDataset:{control:"object"},dataset:{control:"object"},id:{control:"text"},required:{control:"boolean"},hideLabel:{control:"boolean"},name:{control:"text"},disabled:{control:"boolean"},icon:{options:["None","With Icon"],mapping:{None:void 0,"With Icon":e.jsx(v,{svg:y,label:"Student with a hat"})},control:"select"},children:{control:!1},hasError:{table:{disable:!0}}}};var G,V,q,P,N;h.parameters={...h.parameters,docs:{...(G=h.parameters)==null?void 0:G.docs,source:{originalSource:`{
+import{j as e,r as z}from"./iframe-B_74HtSc.js";import{F as y}from"./TokyoUILanguage-BcrymOo9.js";import{I as v}from"./Icon-CC0yjdx9.js";import{S as b,a,b as D}from"./SelectField-DU60q2LU.js";import{D as Ye}from"./Dialog-CJQmu6iz.js";import{B as Qe}from"./Button-C0Um_QuO.js";import{C as i}from"./CountryFlag-D40CtNEa.js";import"./preload-helper-Dp1pzeXC.js";import"./text-accent-BQ9POoE5.js";import"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import"./render-icon-MT6RlyNs.js";import"./componentNames-hc9KR2nX.js";import"./FormControl-Zqf1cIwP.js";import"./index-DIqvfT2b.js";import"./message-DJT5rp5J.js";import"./TokyoUIChevronDown-DiBNbDdz.js";import"./TokyoUICheckmark-BHJrELn_.js";import"./breakpoints-BfMlrtxE.js";import"./index-Cnv20V_M.js";import"./index-W3BB_3go.js";import"./DialogCloseButton-D5YliaRd.js";import"./useOpenInteractionType-D3sASQWj.js";import"./store-B0wM9Zg8.js";import"./TokyoUIClose-BfMyMrDa.js";import"./IconButton-BpjNyYgD.js";import"./ButtonBase-HkSfLFbE.js";import"./Spinner-8-RB4YZR.js";import"./useMergeRefs-Caz9hOck.js";import"./useHostname-CbpnzdHv.js";import"./index-CC6DAVyL.js";import"./shared-strings-ThL9KyH0.js";const{expect:s,userEvent:c,within:R,fn:p,waitFor:Xe}=__STORYBOOK_MODULE_TEST__,Ct={title:"components/SelectField",component:D,subcomponents:{SelectFieldOption:a,SelectFieldGroup:b},parameters:{layout:"padded"},decorators:[t=>e.jsx("div",{style:{width:"min(300px, 100%)",height:"300px"},children:e.jsx(t,{})})],args:{name:"language",label:"Language",placeholder:"Select a language",defaultValue:"",dataset:{testid:"field",foo:"bar"},inputDataset:{testid:"input",foo:"bar"},onValueChange:p(),onBlur:p(),onFocus:p(),onClick:p(),onKeyDown:p(),onKeyUp:p(),children:e.jsxs(e.Fragment,{children:[e.jsx(a,{value:"english",children:"English"}),e.jsx(a,{value:"spanish",children:"Spanish"}),e.jsx(a,{value:"french",children:"French"})]})}},r={a11y:{config:{rules:[{id:"aria-hidden-focus",enabled:!1}]}}},h={parameters:r,play:async({canvasElement:t,step:n,args:o})=>{const l=R(t),u=l.getByTestId("field"),d=l.getByTestId("input");await n("it should render correct label",async()=>{const W=R(u).getByTestId("label");s(W).toHaveTextContent("Language • Optional"),s(d).toHaveAccessibleName("Language")}),await n("it should call onFocus when the input is focused",async()=>{d.focus(),s(o.onFocus).toHaveBeenCalled()}),await n("it should open the menu",async()=>{await c.keyboard("{Enter}"),await Xe(async()=>{s(await l.findByRole("listbox")).toBeInTheDocument()})}),await n("it should call callback when the value changes",async()=>{await c.keyboard("{Enter}"),s(o.onValueChange).toHaveBeenCalledWith("english"),s(o.onBlur).toHaveBeenCalledTimes(1)}),await n("it should call onBlur when the input is blurred",async()=>{await c.keyboard("{tab}"),s(o.onBlur).toHaveBeenCalledTimes(2)}),await n("it should render the dataset props",async()=>{s(u).toHaveAttribute("data-testid","field"),s(u).toHaveAttribute("data-foo","bar"),s(d).toHaveAttribute("data-testid","input"),s(d).toHaveAttribute("data-foo","bar")}),await n("it should render all options",async()=>{d.focus(),await c.keyboard("{Enter}");const W=l.getByRole("option",{name:"English"}),Ue=l.getByRole("option",{name:"Spanish"}),Ze=l.getByRole("option",{name:"French"});s(W).toBeInTheDocument(),s(Ue).toBeInTheDocument(),s(Ze).toBeInTheDocument()})}},g={render:function(n){const[o,l]=z.useState(n.value);return e.jsxs(D,{...n,value:o,onValueChange:l,children:[e.jsx(a,{value:"english",children:"English"}),e.jsx(a,{value:"spanish",children:"Spanish"}),e.jsx(a,{value:"french",children:"French"})]})},args:{label:"Language",placeholder:"Select a language...",value:"spanish",defaultValue:void 0},play:async({canvas:t,step:n})=>{await n("it should render the correct initial value",async()=>{const o=t.getByTestId("input");await s(o).toHaveTextContent("Spanish")}),await n("it should update the value when the user selects",async()=>{const o=t.getByTestId("input");o.focus(),await c.keyboard("{Enter}"),await c.keyboard("{ArrowDown}"),await c.keyboard("{Enter}"),s(o).toHaveTextContent("French")})}},S={args:{icon:e.jsx(v,{svg:y,dataset:{testid:"icon"}})},play:async({canvas:t,step:n})=>{await n("it should render the icon",async()=>{const o=t.getByTestId("icon");s(o).toBeInTheDocument()})}},x={args:{description:"We will use this to get a personalized choice of tutors"},play:async({canvas:t,step:n})=>{const o=t.getByTestId("input"),l=t.getByTestId("description");await n("it should render the description",async()=>{s(o).toHaveAccessibleDescription("We will use this to get a personalized choice of tutors"),s(l).toHaveTextContent("We will use this to get a personalized choice of tutors")})}},F={args:{required:!0},play:async({canvas:t,step:n})=>{const o=t.getByTestId("input"),l=t.getByTestId("label");await n("it should render correct label",async()=>{s(o).toHaveAccessibleName("Language"),s(l).toHaveTextContent("Language")}),await n("it should render required attribute",async()=>{s(o).toHaveAttribute("aria-required")})}},f={args:{hideLabel:!0},play:async({canvas:t,step:n})=>{await n("it should render correct a11y label",async()=>{const o=t.getByTestId("input");s(o).toHaveAccessibleName("Language")})}},w={args:{error:"This is an error message"},play:async({canvas:t,step:n})=>{const o=t.getByTestId("input"),l=t.getByTestId("error");await n("it should render the error message",async()=>{s(o).toHaveAccessibleErrorMessage("This is an error message"),s(l).toHaveTextContent("This is an error message")})}},O={args:{disabled:!0},play:async({canvas:t,step:n})=>{const o=t.getByTestId("input");await n("it should render the disabled input",async()=>{s(o).toHaveAttribute("disabled")})}},I={tags:["!autodocs"],parameters:{...r,viewport:{defaultViewport:"narrow-l"}},play:async({canvas:t})=>{t.getByRole("combobox").click()}},j={parameters:{...r,viewport:{defaultViewport:"narrow-l"},chromatic:{modes:{"narrow-l":{viewport:"narrow-l"},"medium-s":{viewport:"medium-s"},"medium-l":{viewport:"medium-l"}}}},render:function(n){const[o,l]=z.useState(!0),u=()=>l(!0),d=()=>l(!1);return e.jsxs(e.Fragment,{children:[e.jsx(Qe,{onClick:u,children:"Open"}),e.jsx(Ye,{title:"Dialog With Select",description:void 0,open:o,onClose:d,children:e.jsx(D,{...n})})]})},play:async({canvas:t})=>{const n=await t.findByRole("combobox");await c.click(n)}},B={parameters:r,args:{label:"Language with icons",placeholder:"Select a language...",children:e.jsxs(e.Fragment,{children:[e.jsx(a,{value:"english",leadingIcon:e.jsx(v,{svg:y}),children:"English"}),e.jsx(a,{value:"spanish",leadingIcon:e.jsx(v,{svg:y}),children:"Spanish"}),e.jsx(a,{value:"french",leadingIcon:e.jsx(v,{svg:y}),children:"French"})]})},play:async({canvas:t})=>{t.getByRole("combobox").click()}},T={parameters:r,args:{label:"Language with country flags",placeholder:"Select a language...",children:e.jsxs(e.Fragment,{children:[e.jsx(a,{value:"english",leadingIcon:e.jsx(i,{code:"gb",alt:"English",size:"medium"}),children:"English"}),e.jsx(a,{value:"spanish",leadingIcon:e.jsx(i,{code:"es",alt:"Spanish",size:"medium"}),children:"Spanish"}),e.jsx(a,{value:"french",leadingIcon:e.jsx(i,{code:"fr",alt:"French",size:"medium"}),children:"French"})]})},play:async({canvas:t})=>{t.getByRole("combobox").click()}},E={parameters:r,args:{label:"Languages by region",placeholder:"Select a language...",children:e.jsxs(e.Fragment,{children:[e.jsxs(b,{label:"European Languages",children:[e.jsx(a,{value:"english",children:"English"}),e.jsx(a,{value:"spanish",children:"Spanish"}),e.jsx(a,{value:"french",children:"French"}),e.jsx(a,{value:"german",children:"German"})]}),e.jsxs(b,{label:"Asian Languages",children:[e.jsx(a,{value:"mandarin",children:"Mandarin"}),e.jsx(a,{value:"japanese",children:"Japanese"}),e.jsx(a,{value:"korean",children:"Korean"}),e.jsx(a,{value:"hindi",children:"Hindi"})]})]})},play:async({canvas:t})=>{t.getByRole("combobox").click()}},C={parameters:r,args:{label:"Languages by region",placeholder:"Select a language...",children:e.jsxs(e.Fragment,{children:[e.jsxs(b,{label:"European Languages",children:[e.jsx(a,{value:"english",leadingIcon:e.jsx(i,{code:"gb",alt:"English",size:"medium"}),children:"English"}),e.jsx(a,{value:"spanish",leadingIcon:e.jsx(i,{code:"es",alt:"Spanish",size:"medium"}),children:"Spanish"}),e.jsx(a,{value:"french",leadingIcon:e.jsx(i,{code:"fr",alt:"French",size:"medium"}),children:"French"}),e.jsx(a,{value:"german",leadingIcon:e.jsx(i,{code:"de",alt:"German",size:"medium"}),children:"German"})]}),e.jsxs(b,{label:"Asian Languages",children:[e.jsx(a,{value:"mandarin",leadingIcon:e.jsx(i,{code:"cn",alt:"Mandarin",size:"medium"}),children:"Mandarin"}),e.jsx(a,{value:"japanese",leadingIcon:e.jsx(i,{code:"jp",alt:"Japanese",size:"medium"}),children:"Japanese"}),e.jsx(a,{value:"korean",leadingIcon:e.jsx(i,{code:"kr",alt:"Korean",size:"medium"}),children:"Korean"}),e.jsx(a,{value:"hindi",leadingIcon:e.jsx(i,{code:"in",alt:"Hindi",size:"medium"}),children:"Hindi"})]})]})},play:async({canvas:t})=>{t.getByRole("combobox").click()}},k={parameters:r,args:{label:"Select from many options",placeholder:"Choose a number...",children:e.jsx(e.Fragment,{children:Array.from({length:100},(t,n)=>e.jsxs(a,{value:String(n+1),children:["Option ",n+1]},n+1))})},play:async({canvas:t})=>{t.getByRole("combobox").click()}},H={parameters:r,args:{label:"Select from long options",placeholder:"Choose an option...",children:e.jsxs(e.Fragment,{children:[e.jsx(a,{value:"one",children:"Path unlocks frontend development"}),e.jsx(a,{value:"two",children:"Path unlocks rapid, high-quality frontend development"}),e.jsx(a,{value:"three",children:"Path unlocks rapid, high-quality frontend development and prototyping"})]})},play:async({canvas:t})=>{t.getByRole("combobox").click()}},L={parameters:r,decorators:[t=>e.jsx("div",{style:{width:"fit-content"},children:e.jsx(t,{})})],args:{label:"Options",placeholder:"Select an option...",defaultValue:"a",children:e.jsxs(e.Fragment,{children:[e.jsx(a,{value:"a",children:"A"}),e.jsx(a,{value:"b",children:"BCDEFGHIJKLMNOPQRSTUVWXYZ"})]})},play:async({canvas:t})=>{t.getByRole("combobox").click()}},m={render:function(){return z.useEffect(()=>(document.body.style.setProperty("--ds-select-z-index-override","20"),()=>{document.body.style.removeProperty("--ds-select-z-index-override")}),[]),e.jsxs(e.Fragment,{children:[e.jsxs(D,{label:"Language",placeholder:"Select a language..",children:[e.jsx(a,{value:"english",children:"English"}),e.jsx(a,{value:"spanish",children:"Spanish"}),e.jsx(a,{value:"french",children:"French"})]}),e.jsx("div",{style:{position:"fixed",zIndex:10,inset:"0",backgroundColor:"lightgray",pointerEvents:"none",opacity:.5}})]})},play:async({canvas:t})=>{t.getByRole("combobox").click()}},A={parameters:{chromatic:{disableSnapshot:!0}},args:{label:"Language",placeholder:"Select a subject",description:"We will use this to get a personalized choice of tutors",children:e.jsxs(e.Fragment,{children:[e.jsx(a,{value:"english",children:"English"}),e.jsx(a,{value:"spanish",children:"Spanish"}),e.jsx(a,{value:"french",children:"French"})]})},argTypes:{label:{control:"text"},placeholder:{control:"text"},description:{control:"text"},error:{control:"text"},value:{control:"text"},defaultValue:{control:"text"},inputDataset:{control:"object"},dataset:{control:"object"},id:{control:"text"},required:{control:"boolean"},hideLabel:{control:"boolean"},name:{control:"text"},disabled:{control:"boolean"},icon:{options:["None","With Icon"],mapping:{None:void 0,"With Icon":e.jsx(v,{svg:y,label:"Student with a hat"})},control:"select"},children:{control:!1},hasError:{table:{disable:!0}}}};var G,V,q,P,N;h.parameters={...h.parameters,docs:{...(G=h.parameters)==null?void 0:G.docs,source:{originalSource:`{
   parameters: disableA11yFocus,
   play: async ({
     canvasElement,
@@ -514,4 +514,4 @@ Note: This is done using a \\\`useEffect\\\` just for the sake of the story. In
       }
     }
   }
-}`,...(Je=(_e=A.parameters)==null?void 0:_e.docs)==null?void 0:Je.source}}};const Ct=["Basic","Controlled","WithIcon","WithDescription","Required","WithHiddenLabel","WithError","Disabled","ResponsiveBottomSheet","InDialog","WithOptionIcons","WithOptionCountryFlags","WithOptionGroups","WithOptionGroupsAndIcons","WithOverflowingContent","WithOverflowingLabels","WithShortOptionSelected","WithZIndexOverride","Playground"];export{h as Basic,g as Controlled,O as Disabled,j as InDialog,A as Playground,F as Required,I as ResponsiveBottomSheet,x as WithDescription,w as WithError,f as WithHiddenLabel,S as WithIcon,T as WithOptionCountryFlags,E as WithOptionGroups,C as WithOptionGroupsAndIcons,B as WithOptionIcons,k as WithOverflowingContent,H as WithOverflowingLabels,L as WithShortOptionSelected,m as WithZIndexOverride,Ct as __namedExportsOrder,Et as default};
+}`,...(Je=(_e=A.parameters)==null?void 0:_e.docs)==null?void 0:Je.source}}};const kt=["Basic","Controlled","WithIcon","WithDescription","Required","WithHiddenLabel","WithError","Disabled","ResponsiveBottomSheet","InDialog","WithOptionIcons","WithOptionCountryFlags","WithOptionGroups","WithOptionGroupsAndIcons","WithOverflowingContent","WithOverflowingLabels","WithShortOptionSelected","WithZIndexOverride","Playground"];export{h as Basic,g as Controlled,O as Disabled,j as InDialog,A as Playground,F as Required,I as ResponsiveBottomSheet,x as WithDescription,w as WithError,f as WithHiddenLabel,S as WithIcon,T as WithOptionCountryFlags,E as WithOptionGroups,C as WithOptionGroupsAndIcons,B as WithOptionIcons,k as WithOverflowingContent,H as WithOverflowingLabels,L as WithShortOptionSelected,m as WithZIndexOverride,kt as __namedExportsOrder,Ct as default};

package/dist/assets/{ShowOnIntersection.stories-DT94aTYJ.js → ShowOnIntersection.stories-BdO_3n9P.js}

@@ -1,4 +1,4 @@
-import{r as o,j as t}from"./iframe-DjYTJz7A.js";import{O as f}from"./ObserveIntersection-MtxhRIzU.js";import"./preload-helper-Dp1pzeXC.js";import"./componentNames-hc9KR2nX.js";const a=({onIntersect:e,once:u,threshold:c,tag:d,dataset:p,children:v})=>{const[l,h]=o.useState(!1),m=o.useCallback(()=>{l||h(!0),e==null||e()},[l,e]);return t.jsx(f,{onIntersect:m,once:e?u:!0,threshold:c,tag:d,dataset:p,children:l&&v})};try{a.displayName="ShowOnIntersection",a.__docgenInfo={description:"Only renders the wrapped components once it intersects with the viewport.\n\nNote that elements will not be detached from the DOM if the component is\nscrolled out of view again.\n\nYou can use `React.lazy` to lazy-load the wrapped components.\n\nAdditionally, an `onIntersect` callback can be provided. As with\n`ObserveIntersection`, this callback will be called every time the component\nintersects with the viewport, or only the first time if `once` is set to\n`true`.",displayName:"ShowOnIntersection",props:{onIntersect:{defaultValue:null,description:"",name:"onIntersect",required:!1,type:{name:"enum",value:[{value:"() => void"}]}},once:{defaultValue:null,description:"",name:"once",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},threshold:{defaultValue:null,description:"",name:"threshold",required:!1,type:{name:"enum",value:[{value:"number"}]}},tag:{defaultValue:null,description:"",name:"tag",required:!1,type:{name:"enum",value:[{value:'"article"'},{value:'"caption"'},{value:'"div"'},{value:'"fieldset"'},{value:'"figcaption"'},{value:'"figure"'},{value:'"footer"'},{value:'"header"'},{value:'"li"'},{value:'"main"'},{value:'"ol"'},{value:'"p"'},{value:'"section"'},{value:'"span"'},{value:'"table"'},{value:'"tbody"'},{value:'"td"'},{value:'"tfoot"'},{value:'"th"'},{value:'"thead"'},{value:'"tr"'},{value:'"ul"'}]}},dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}}}}}catch{}const b={title:"components/ShowOnIntersection",component:a,parameters:{tags:["!test"],chromatic:{disableSnapshot:!0}}},n=()=>t.jsx("div",{style:{height:"200px",overflowY:"scroll",position:"relative"},children:t.jsx("div",{style:{height:"400px",display:"flex",alignItems:"end"},children:t.jsx(a,{children:t.jsx("p",{children:"Intersected"})})})});n.storyName="ShowOnIntersection";var r,s,i;n.parameters={...n.parameters,docs:{...(r=n.parameters)==null?void 0:r.docs,source:{originalSource:`() => {
+import{r as o,j as t}from"./iframe-B_74HtSc.js";import{O as f}from"./ObserveIntersection-Dx2gD1CU.js";import"./preload-helper-Dp1pzeXC.js";import"./componentNames-hc9KR2nX.js";const a=({onIntersect:e,once:u,threshold:c,tag:d,dataset:p,children:v})=>{const[l,h]=o.useState(!1),m=o.useCallback(()=>{l||h(!0),e==null||e()},[l,e]);return t.jsx(f,{onIntersect:m,once:e?u:!0,threshold:c,tag:d,dataset:p,children:l&&v})};try{a.displayName="ShowOnIntersection",a.__docgenInfo={description:"Only renders the wrapped components once it intersects with the viewport.\n\nNote that elements will not be detached from the DOM if the component is\nscrolled out of view again.\n\nYou can use `React.lazy` to lazy-load the wrapped components.\n\nAdditionally, an `onIntersect` callback can be provided. As with\n`ObserveIntersection`, this callback will be called every time the component\nintersects with the viewport, or only the first time if `once` is set to\n`true`.",displayName:"ShowOnIntersection",props:{onIntersect:{defaultValue:null,description:"",name:"onIntersect",required:!1,type:{name:"enum",value:[{value:"() => void"}]}},once:{defaultValue:null,description:"",name:"once",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},threshold:{defaultValue:null,description:"",name:"threshold",required:!1,type:{name:"enum",value:[{value:"number"}]}},tag:{defaultValue:null,description:"",name:"tag",required:!1,type:{name:"enum",value:[{value:'"p"'},{value:'"div"'},{value:'"span"'},{value:'"main"'},{value:'"header"'},{value:'"footer"'},{value:'"article"'},{value:'"section"'},{value:'"ul"'},{value:'"ol"'},{value:'"li"'},{value:'"fieldset"'},{value:'"table"'},{value:'"th"'},{value:'"tr"'},{value:'"td"'},{value:'"thead"'},{value:'"tfoot"'},{value:'"tbody"'},{value:'"caption"'},{value:'"figure"'},{value:'"figcaption"'}]}},dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}}}}}catch{}const b={title:"components/ShowOnIntersection",component:a,parameters:{tags:["!test"],chromatic:{disableSnapshot:!0}}},n=()=>t.jsx("div",{style:{height:"200px",overflowY:"scroll",position:"relative"},children:t.jsx("div",{style:{height:"400px",display:"flex",alignItems:"end"},children:t.jsx(a,{children:t.jsx("p",{children:"Intersected"})})})});n.storyName="ShowOnIntersection";var r,s,i;n.parameters={...n.parameters,docs:{...(r=n.parameters)==null?void 0:r.docs,source:{originalSource:`() => {
   return <div style={{
     height: '200px',
     overflowY: 'scroll',

package/dist/assets/{SingleSelectChips-B1d9MkC-.js → SingleSelectChips-CDtny-H7.js}

@@ -1,2 +1,2 @@
-import{r as b,j as e,g as y}from"./iframe-DjYTJz7A.js";import{u as w}from"./useControllableState-DQg81cp5.js";import{c as x,C as j,a as R,b as I,d as _,D as z,e as E}from"./createRequiredContext-5BPDYgIa.js";import{f as C}from"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import{w as S}from"./componentNames-hc9KR2nX.js";const[N,L]=x("SingleSelectChips"),h=b.forwardRef(function({items:a,children:n,orientation:l=z,"aria-label":t,"aria-controls":i,value:r,onValueChange:s,defaultValue:o,dataset:c,...m},d){const[p,u]=w({value:r,onValueChange:s,defaultValue:o??null}),V=a?a.map(({label:k,value:g,...q})=>e.jsx(f,{value:g,...q,children:k},g)):n;return e.jsx(N,{value:{value:p,onValueChange:u},children:e.jsx(_,{orientation:l,children:e.jsx(E,{...C(m),ref:d,orientation:l,"aria-orientation":l,"aria-label":t,"aria-controls":i,role:"listbox","aria-multiselectable":"false",...y(c,{preplyDsComponent:S.SingleSelectChips}),children:V})})})}),f=b.forwardRef(function({value:a,children:n,icon:l,countryFlagCode:t,disabled:i,counter:r,dataset:s,dsInternalSimulation:o,...c},m){const{value:d,onValueChange:p}=L(),u=d===a;return e.jsx(j,{role:"presentation",children:e.jsx(R,{...C(c),ref:m,role:"option","aria-selected":u,onClick:()=>p(u?null:a),icon:l,countryFlagCode:t,disabled:i,dsInternalSimulation:o,...y(s,{preplyDsComponent:S.SingleSelectChipsItem}),children:e.jsx(I,{counter:r,children:n})})})});try{h.displayName="SingleSelectChips",h.__docgenInfo={description:`A chips component that allows selection of a single option from a group.
-Users can select one chip at a time, and clicking a selected chip will deselect it.`,displayName:"SingleSelectChips",props:{dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},defaultValue:{defaultValue:null,description:"Default value for uncontrolled usage. Will be ignored if `value` is provided",name:"defaultValue",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"}]}},"aria-controls":{defaultValue:null,description:"If the chips control other elements on the page, use `aria-controls` with the target element's ID.",name:"aria-controls",required:!1,type:{name:"enum",value:[{value:"string"}]}},"aria-label":{defaultValue:null,description:"Accessible label for the chips group. Required for screen reader users",name:"aria-label",required:!0,type:{name:"string"}},key:{defaultValue:null,description:"",name:"key",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"bigint"}]}},value:{defaultValue:null,description:"Current value of the chips. When provided, the component operates in controlled mode",name:"value",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"}]}},onValueChange:{defaultValue:null,description:"Callback fired when the value changes. Receives the new value as an argument",name:"onValueChange",required:!1,type:{name:"enum",value:[{value:"(value: T | null) => void"}]}},orientation:{defaultValue:{value:"'horizontal'"},description:"Layout orientation of the chips group.",name:"orientation",required:!1,type:{name:"enum",value:[{value:'"horizontal"'},{value:'"vertical"'}]}},items:{defaultValue:null,description:"",name:"items",required:!1,type:{name:"enum",value:[{value:'(Omit<ChipsItemProps, "children" | "dsInternalSimulation" | "value"> & { value: T extends unknown[] ? NonNullable<T[number]> : NonNullable<T>; label: ReactNode; })[]'}]}},ref:{defaultValue:null,description:"",name:"ref",required:!1,type:{name:"enum",value:[{value:"null"},{value:"(instance: HTMLUListElement | null) => void"},{value:"RefObject<HTMLUListElement>"}]}}}}}catch{}try{f.displayName="SingleSelectChipsItem",f.__docgenInfo={description:"Individual chip item for use within SingleSelectChips.",displayName:"SingleSelectChipsItem",props:{disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},icon:{defaultValue:null,description:"",name:"icon",required:!1,type:{name:"enum",value:[{value:"ComponentClass<SVGAttributes<SVGElement>, any>"},{value:"FunctionComponent<SVGAttributes<SVGElement>>"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"}]}},countryFlagCode:{defaultValue:null,description:"",name:"countryFlagCode",required:!1,type:{name:"enum",value:[{value:'"as"'},{value:'"br"'},{value:'"hr"'},{value:'"li"'},{value:'"td"'},{value:'"th"'},{value:'"tr"'},{value:'"id"'},{value:'"is"'},{value:'"at"'},{value:'"ai"'},{value:'"af"'},{value:'"ax"'},{value:'"al"'},{value:'"dz"'},{value:'"ad"'},{value:'"ao"'},{value:'"aq"'},{value:'"ag"'},{value:'"ar"'},{value:'"am"'},{value:'"aw"'},{value:'"sh-ac"'},{value:'"asean"'},{value:'"au"'},{value:'"az"'},{value:'"bs"'},{value:'"bh"'},{value:'"bd"'},{value:'"bb"'},{value:'"es-pv"'},{value:'"by"'},{value:'"be"'},{value:'"bz"'},{value:'"bj"'},{value:'"bm"'},{value:'"bt"'},{value:'"bo"'},{value:'"bq"'},{value:'"ba"'},{value:'"bw"'},{value:'"bv"'},{value:'"io"'},{value:'"bn"'},{value:'"bg"'},{value:'"bf"'},{value:'"bi"'},{value:'"cv"'},{value:'"kh"'},{value:'"cm"'},{value:'"ca"'},{value:'"ic"'},{value:'"es-ct"'},{value:'"ky"'},{value:'"cf"'},{value:'"cefta"'},{value:'"cl"'},{value:'"cn"'},{value:'"cx"'},{value:'"cp"'},{value:'"cc"'},{value:'"co"'},{value:'"km"'},{value:'"ck"'},{value:'"cr"'},{value:'"cu"'},{value:'"cw"'},{value:'"cy"'},{value:'"cz"'},{value:'"ci"'},{value:'"cd"'},{value:'"dk"'},{value:'"dg"'},{value:'"dj"'},{value:'"dm"'},{value:'"do"'},{value:'"eac"'},{value:'"ec"'},{value:'"eg"'},{value:'"sv"'},{value:'"gb-eng"'},{value:'"gq"'},{value:'"er"'},{value:'"ee"'},{value:'"sz"'},{value:'"et"'},{value:'"eu"'},{value:'"fk"'},{value:'"fo"'},{value:'"fm"'},{value:'"fj"'},{value:'"fi"'},{value:'"fr"'},{value:'"gf"'},{value:'"pf"'},{value:'"tf"'},{value:'"ga"'},{value:'"es-ga"'},{value:'"gm"'},{value:'"ge"'},{value:'"de"'},{value:'"gh"'},{value:'"gi"'},{value:'"gr"'},{value:'"gl"'},{value:'"gd"'},{value:'"gp"'},{value:'"gu"'},{value:'"gt"'},{value:'"gg"'},{value:'"gn"'},{value:'"gw"'},{value:'"gy"'},{value:'"ht"'},{value:'"hm"'},{value:'"va"'},{value:'"hn"'},{value:'"hk"'},{value:'"hu"'},{value:'"in"'},{value:'"ir"'},{value:'"iq"'},{value:'"ie"'},{value:'"im"'},{value:'"il"'},{value:'"it"'},{value:'"jm"'},{value:'"jp"'},{value:'"je"'},{value:'"jo"'},{value:'"kz"'},{value:'"ke"'},{value:'"ki"'},{value:'"xk"'},{value:'"kw"'},{value:'"kg"'},{value:'"la"'},{value:'"lv"'},{value:'"arab"'},{value:'"lb"'},{value:'"ls"'},{value:'"lr"'},{value:'"ly"'},{value:'"lt"'},{value:'"lu"'},{value:'"mo"'},{value:'"mg"'},{value:'"mw"'},{value:'"my"'},{value:'"mv"'},{value:'"ml"'},{value:'"mt"'},{value:'"mh"'},{value:'"mq"'},{value:'"mr"'},{value:'"mu"'},{value:'"yt"'},{value:'"mx"'},{value:'"md"'},{value:'"mc"'},{value:'"mn"'},{value:'"me"'},{value:'"ms"'},{value:'"ma"'},{value:'"mz"'},{value:'"mm"'},{value:'"na"'},{value:'"nr"'},{value:'"np"'},{value:'"nl"'},{value:'"nc"'},{value:'"nz"'},{value:'"ni"'},{value:'"ne"'},{value:'"ng"'},{value:'"nu"'},{value:'"nf"'},{value:'"kp"'},{value:'"mk"'},{value:'"gb-nir"'},{value:'"mp"'},{value:'"no"'},{value:'"om"'},{value:'"pc"'},{value:'"pk"'},{value:'"pw"'},{value:'"pa"'},{value:'"pg"'},{value:'"py"'},{value:'"pe"'},{value:'"ph"'},{value:'"pn"'},{value:'"pl"'},{value:'"pt"'},{value:'"pr"'},{value:'"qa"'},{value:'"cg"'},{value:'"ro"'},{value:'"ru"'},{value:'"rw"'},{value:'"re"'},{value:'"bl"'},{value:'"sh-hl"'},{value:'"sh"'},{value:'"kn"'},{value:'"lc"'},{value:'"mf"'},{value:'"pm"'},{value:'"vc"'},{value:'"ws"'},{value:'"sm"'},{value:'"st"'},{value:'"sa"'},{value:'"gb-sct"'},{value:'"sn"'},{value:'"rs"'},{value:'"sc"'},{value:'"sl"'},{value:'"sg"'},{value:'"sx"'},{value:'"sk"'},{value:'"si"'},{value:'"sb"'},{value:'"so"'},{value:'"za"'},{value:'"gs"'},{value:'"kr"'},{value:'"ss"'},{value:'"es"'},{value:'"lk"'},{value:'"ps"'},{value:'"sd"'},{value:'"sr"'},{value:'"sj"'},{value:'"se"'},{value:'"ch"'},{value:'"sy"'},{value:'"tw"'},{value:'"tj"'},{value:'"tz"'},{value:'"tl"'},{value:'"tg"'},{value:'"tk"'},{value:'"to"'},{value:'"tt"'},{value:'"sh-ta"'},{value:'"tn"'},{value:'"tm"'},{value:'"tc"'},{value:'"tv"'},{value:'"ug"'},{value:'"ua"'},{value:'"ae"'},{value:'"gb"'},{value:'"un"'},{value:'"um"'},{value:'"us"'},{value:'"uy"'},{value:'"uz"'},{value:'"vu"'},{value:'"ve"'},{value:'"vn"'},{value:'"vg"'},{value:'"vi"'},{value:'"gb-wls"'},{value:'"wf"'},{value:'"eh"'},{value:'"ye"'},{value:'"zm"'},{value:'"zw"'}]}},value:{defaultValue:null,description:"Unique identifier for this chip. Used for selection tracking",name:"value",required:!0,type:{name:"string"}},children:{defaultValue:null,description:"Content to display inside the chip",name:"children",required:!0,type:{name:"enum",value:[{value:"undefined"},{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},counter:{defaultValue:null,description:"Optional numeric counter to display alongside the chip label",name:"counter",required:!1,type:{name:"enum",value:[{value:"number"}]}},dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},ref:{defaultValue:null,description:"Allows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n@see {@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}",name:"ref",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"(instance: HTMLButtonElement | null) => void"},{value:"RefObject<HTMLButtonElement>"}]}},key:{defaultValue:null,description:"",name:"key",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"bigint"}]}}}}}catch{}export{f as S,h as a};
+import{r as b,j as e,g as y}from"./iframe-B_74HtSc.js";import{u as w}from"./useControllableState-BB4EHwEp.js";import{c as x,C as j,a as R,b as I,d as _,D as z,e as E}from"./createRequiredContext-B3Arn9-D.js";import{f as C}from"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import{w as S}from"./componentNames-hc9KR2nX.js";const[N,L]=x("SingleSelectChips"),h=b.forwardRef(function({items:a,children:n,orientation:l=z,"aria-label":t,"aria-controls":i,value:r,onValueChange:s,defaultValue:o,dataset:c,...m},d){const[p,u]=w({value:r,onValueChange:s,defaultValue:o??null}),V=a?a.map(({label:k,value:g,...q})=>e.jsx(f,{value:g,...q,children:k},g)):n;return e.jsx(N,{value:{value:p,onValueChange:u},children:e.jsx(_,{orientation:l,children:e.jsx(E,{...C(m),ref:d,orientation:l,"aria-orientation":l,"aria-label":t,"aria-controls":i,role:"listbox","aria-multiselectable":"false",...y(c,{preplyDsComponent:S.SingleSelectChips}),children:V})})})}),f=b.forwardRef(function({value:a,children:n,icon:l,countryFlagCode:t,disabled:i,counter:r,dataset:s,dsInternalSimulation:o,...c},m){const{value:d,onValueChange:p}=L(),u=d===a;return e.jsx(j,{role:"presentation",children:e.jsx(R,{...C(c),ref:m,role:"option","aria-selected":u,onClick:()=>p(u?null:a),icon:l,countryFlagCode:t,disabled:i,dsInternalSimulation:o,...y(s,{preplyDsComponent:S.SingleSelectChipsItem}),children:e.jsx(I,{counter:r,children:n})})})});try{h.displayName="SingleSelectChips",h.__docgenInfo={description:`A chips component that allows selection of a single option from a group.
+Users can select one chip at a time, and clicking a selected chip will deselect it.`,displayName:"SingleSelectChips",props:{dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},key:{defaultValue:null,description:"",name:"key",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"bigint"}]}},"aria-label":{defaultValue:null,description:"Accessible label for the chips group. Required for screen reader users",name:"aria-label",required:!0,type:{name:"string"}},defaultValue:{defaultValue:null,description:"Default value for uncontrolled usage. Will be ignored if `value` is provided",name:"defaultValue",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"}]}},"aria-controls":{defaultValue:null,description:"If the chips control other elements on the page, use `aria-controls` with the target element's ID.",name:"aria-controls",required:!1,type:{name:"enum",value:[{value:"string"}]}},onValueChange:{defaultValue:null,description:"Callback fired when the value changes. Receives the new value as an argument",name:"onValueChange",required:!1,type:{name:"enum",value:[{value:"(value: T | null) => void"}]}},value:{defaultValue:null,description:"Current value of the chips. When provided, the component operates in controlled mode",name:"value",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"}]}},orientation:{defaultValue:{value:"'horizontal'"},description:"Layout orientation of the chips group.",name:"orientation",required:!1,type:{name:"enum",value:[{value:'"horizontal"'},{value:'"vertical"'}]}},items:{defaultValue:null,description:"",name:"items",required:!1,type:{name:"enum",value:[{value:'(Omit<ChipsItemProps, "children" | "dsInternalSimulation" | "value"> & { value: T extends unknown[] ? NonNullable<T[number]> : NonNullable<T>; label: ReactNode; })[]'}]}},ref:{defaultValue:null,description:"",name:"ref",required:!1,type:{name:"enum",value:[{value:"null"},{value:"(instance: HTMLUListElement | null) => void"},{value:"RefObject<HTMLUListElement>"}]}}}}}catch{}try{f.displayName="SingleSelectChipsItem",f.__docgenInfo={description:"Individual chip item for use within SingleSelectChips.",displayName:"SingleSelectChipsItem",props:{disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},icon:{defaultValue:null,description:"",name:"icon",required:!1,type:{name:"enum",value:[{value:"ComponentClass<SVGAttributes<SVGElement>, any>"},{value:"FunctionComponent<SVGAttributes<SVGElement>>"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"}]}},countryFlagCode:{defaultValue:null,description:"",name:"countryFlagCode",required:!1,type:{name:"enum",value:[{value:'"li"'},{value:'"th"'},{value:'"tr"'},{value:'"td"'},{value:'"id"'},{value:'"ai"'},{value:'"as"'},{value:'"br"'},{value:'"hr"'},{value:'"is"'},{value:'"at"'},{value:'"af"'},{value:'"ax"'},{value:'"al"'},{value:'"dz"'},{value:'"ad"'},{value:'"ao"'},{value:'"aq"'},{value:'"ag"'},{value:'"ar"'},{value:'"am"'},{value:'"aw"'},{value:'"sh-ac"'},{value:'"asean"'},{value:'"au"'},{value:'"az"'},{value:'"bs"'},{value:'"bh"'},{value:'"bd"'},{value:'"bb"'},{value:'"es-pv"'},{value:'"by"'},{value:'"be"'},{value:'"bz"'},{value:'"bj"'},{value:'"bm"'},{value:'"bt"'},{value:'"bo"'},{value:'"bq"'},{value:'"ba"'},{value:'"bw"'},{value:'"bv"'},{value:'"io"'},{value:'"bn"'},{value:'"bg"'},{value:'"bf"'},{value:'"bi"'},{value:'"cv"'},{value:'"kh"'},{value:'"cm"'},{value:'"ca"'},{value:'"ic"'},{value:'"es-ct"'},{value:'"ky"'},{value:'"cf"'},{value:'"cefta"'},{value:'"cl"'},{value:'"cn"'},{value:'"cx"'},{value:'"cp"'},{value:'"cc"'},{value:'"co"'},{value:'"km"'},{value:'"ck"'},{value:'"cr"'},{value:'"cu"'},{value:'"cw"'},{value:'"cy"'},{value:'"cz"'},{value:'"ci"'},{value:'"cd"'},{value:'"dk"'},{value:'"dg"'},{value:'"dj"'},{value:'"dm"'},{value:'"do"'},{value:'"eac"'},{value:'"ec"'},{value:'"eg"'},{value:'"sv"'},{value:'"gb-eng"'},{value:'"gq"'},{value:'"er"'},{value:'"ee"'},{value:'"sz"'},{value:'"et"'},{value:'"eu"'},{value:'"fk"'},{value:'"fo"'},{value:'"fm"'},{value:'"fj"'},{value:'"fi"'},{value:'"fr"'},{value:'"gf"'},{value:'"pf"'},{value:'"tf"'},{value:'"ga"'},{value:'"es-ga"'},{value:'"gm"'},{value:'"ge"'},{value:'"de"'},{value:'"gh"'},{value:'"gi"'},{value:'"gr"'},{value:'"gl"'},{value:'"gd"'},{value:'"gp"'},{value:'"gu"'},{value:'"gt"'},{value:'"gg"'},{value:'"gn"'},{value:'"gw"'},{value:'"gy"'},{value:'"ht"'},{value:'"hm"'},{value:'"va"'},{value:'"hn"'},{value:'"hk"'},{value:'"hu"'},{value:'"in"'},{value:'"ir"'},{value:'"iq"'},{value:'"ie"'},{value:'"im"'},{value:'"il"'},{value:'"it"'},{value:'"jm"'},{value:'"jp"'},{value:'"je"'},{value:'"jo"'},{value:'"kz"'},{value:'"ke"'},{value:'"ki"'},{value:'"xk"'},{value:'"kw"'},{value:'"kg"'},{value:'"la"'},{value:'"lv"'},{value:'"arab"'},{value:'"lb"'},{value:'"ls"'},{value:'"lr"'},{value:'"ly"'},{value:'"lt"'},{value:'"lu"'},{value:'"mo"'},{value:'"mg"'},{value:'"mw"'},{value:'"my"'},{value:'"mv"'},{value:'"ml"'},{value:'"mt"'},{value:'"mh"'},{value:'"mq"'},{value:'"mr"'},{value:'"mu"'},{value:'"yt"'},{value:'"mx"'},{value:'"md"'},{value:'"mc"'},{value:'"mn"'},{value:'"me"'},{value:'"ms"'},{value:'"ma"'},{value:'"mz"'},{value:'"mm"'},{value:'"na"'},{value:'"nr"'},{value:'"np"'},{value:'"nl"'},{value:'"nc"'},{value:'"nz"'},{value:'"ni"'},{value:'"ne"'},{value:'"ng"'},{value:'"nu"'},{value:'"nf"'},{value:'"kp"'},{value:'"mk"'},{value:'"gb-nir"'},{value:'"mp"'},{value:'"no"'},{value:'"om"'},{value:'"pc"'},{value:'"pk"'},{value:'"pw"'},{value:'"pa"'},{value:'"pg"'},{value:'"py"'},{value:'"pe"'},{value:'"ph"'},{value:'"pn"'},{value:'"pl"'},{value:'"pt"'},{value:'"pr"'},{value:'"qa"'},{value:'"cg"'},{value:'"ro"'},{value:'"ru"'},{value:'"rw"'},{value:'"re"'},{value:'"bl"'},{value:'"sh-hl"'},{value:'"sh"'},{value:'"kn"'},{value:'"lc"'},{value:'"mf"'},{value:'"pm"'},{value:'"vc"'},{value:'"ws"'},{value:'"sm"'},{value:'"st"'},{value:'"sa"'},{value:'"gb-sct"'},{value:'"sn"'},{value:'"rs"'},{value:'"sc"'},{value:'"sl"'},{value:'"sg"'},{value:'"sx"'},{value:'"sk"'},{value:'"si"'},{value:'"sb"'},{value:'"so"'},{value:'"za"'},{value:'"gs"'},{value:'"kr"'},{value:'"ss"'},{value:'"es"'},{value:'"lk"'},{value:'"ps"'},{value:'"sd"'},{value:'"sr"'},{value:'"sj"'},{value:'"se"'},{value:'"ch"'},{value:'"sy"'},{value:'"tw"'},{value:'"tj"'},{value:'"tz"'},{value:'"tl"'},{value:'"tg"'},{value:'"tk"'},{value:'"to"'},{value:'"tt"'},{value:'"sh-ta"'},{value:'"tn"'},{value:'"tm"'},{value:'"tc"'},{value:'"tv"'},{value:'"ug"'},{value:'"ua"'},{value:'"ae"'},{value:'"gb"'},{value:'"un"'},{value:'"um"'},{value:'"us"'},{value:'"uy"'},{value:'"uz"'},{value:'"vu"'},{value:'"ve"'},{value:'"vn"'},{value:'"vg"'},{value:'"vi"'},{value:'"gb-wls"'},{value:'"wf"'},{value:'"eh"'},{value:'"ye"'},{value:'"zm"'},{value:'"zw"'}]}},value:{defaultValue:null,description:"Unique identifier for this chip. Used for selection tracking",name:"value",required:!0,type:{name:"string"}},children:{defaultValue:null,description:"Content to display inside the chip",name:"children",required:!0,type:{name:"enum",value:[{value:"undefined"},{value:"null"},{value:"string"},{value:"number"},{value:"false"},{value:"true"},{value:"ReactElement<any, string | JSXElementConstructor<any>>"},{value:"Iterable<ReactNode>"},{value:"ReactPortal"}]}},counter:{defaultValue:null,description:"Optional numeric counter to display alongside the chip label",name:"counter",required:!1,type:{name:"enum",value:[{value:"number"}]}},dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},ref:{defaultValue:null,description:"Allows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n@see {@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}",name:"ref",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"(instance: HTMLButtonElement | null) => void"},{value:"RefObject<HTMLButtonElement>"}]}},key:{defaultValue:null,description:"",name:"key",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"bigint"}]}}}}}catch{}export{f as S,h as a};

package/dist/assets/{SingleSelectChips.stories-QdsPQJO8.js → SingleSelectChips.stories-CTAvW0Y9.js}

@@ -1,4 +1,4 @@
-import{j as a,r as Ze}from"./iframe-DjYTJz7A.js";import{S as p,a as g}from"./SingleSelectChips-B1d9MkC-.js";import{F as L,a as Ye,b as Qe,c as aa}from"./TokyoUIAvailability7LateNight-CyPCBR0g.js";import{F as ta}from"./TokyoUIEmojiFrowning-Bztw_WuD.js";import{F as na}from"./index-CUvrBGJo.js";import{L as h}from"./LayoutFlex-p_p7LCCd.js";import{T as V}from"./Text-C8DrHLQF.js";import{d as ia}from"./styled-components.browser.esm-3T8u8x7l.js";import{L as sa}from"./Link-BHV5DCu-.js";import{H as oa}from"./Heading-BPJGe0Bg.js";import{T as H}from"./Tooltip-DDtzGgNm.js";import{B as la}from"./Button-DS2bg8PO.js";import"./preload-helper-Dp1pzeXC.js";import"./useControllableState-DQg81cp5.js";import"./useStableCallback-662ysKf2.js";import"./createRequiredContext-5BPDYgIa.js";import"./Icon-kphbe0CE.js";import"./text-accent-C5-m5mrW.js";import"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import"./render-icon-DZ6hllTG.js";import"./componentNames-hc9KR2nX.js";import"./CountryFlag-BKEpYyWK.js";import"./useMergeRefs-jFGYKOXz.js";import"./layout-relative.module-BM7yIsEb.js";import"./text-centered-D70wah8Y.js";import"./emotion-unitless.esm-BZwEwAnk.js";import"./useHostname-By9vNKnQ.js";import"./ButtonBase-sV1YoG7h.js";import"./Spinner-BG27lVzS.js";import"./useMergeRefs-CL5DIjXV.js";import"./index-CC6DAVyL.js";const{expect:e,within:c,fn:ra,userEvent:r,resetAllMocks:Xe,waitFor:T}=__STORYBOOK_MODULE_TEST__,Pa={title:"components/Chips/SingleSelectChips",component:g,subcomponents:{SingleSelectChipsItem:p},parameters:{layout:"padded"},args:{"aria-label":"Choose a skill",defaultValue:"vocabulary",onValueChange:ra(),items:[{value:"vocabulary",label:"Vocabulary"},{value:"speaking",label:"Speaking"},{value:"listening",label:"Listening"},{value:"reading",label:"Reading"}]},beforeEach:()=>{Xe()}},v={play:async({canvasElement:i,step:t,args:n})=>{const s=c(i),o=s.getByRole("option",{name:"Vocabulary"}),l=s.getByRole("option",{name:"Speaking"}),u=s.getByRole("option",{name:"Listening"}),d=s.getByRole("option",{name:"Reading"});await t("Render chips with default value",async()=>{e(o).toHaveAttribute("aria-selected","true"),e(l).toHaveAttribute("aria-selected","false"),e(u).toHaveAttribute("aria-selected","false"),e(d).toHaveAttribute("aria-selected","false")}),await t("Click on the chip to select it",async()=>{await r.click(l),e(n.onValueChange).toHaveBeenCalledWith("speaking"),e(o).toHaveAttribute("aria-selected","false"),e(l).toHaveAttribute("aria-selected","true"),e(u).toHaveAttribute("aria-selected","false"),e(d).toHaveAttribute("aria-selected","false")}),await t("Click on the chip to deselect it",async()=>{await r.click(l),e(n.onValueChange).toHaveBeenCalledWith(null),e(o).toHaveAttribute("aria-selected","false"),e(l).toHaveAttribute("aria-selected","false"),e(u).toHaveAttribute("aria-selected","false"),e(d).toHaveAttribute("aria-selected","false")})}};let E;const y={render:function({defaultValue:t,...n}){const[s,o]=Ze.useState(t);E=o;const l=u=>{var d;o(u),(d=n.onValueChange)==null||d.call(n,u)};return a.jsx(g,{...n,value:s,onValueChange:l})},play:async({canvasElement:i,step:t,args:n})=>{const s=c(i),o=s.getByRole("option",{name:"Vocabulary"}),l=s.getByRole("option",{name:"Speaking"}),u=s.getByRole("option",{name:"Listening"}),d=s.getByRole("option",{name:"Reading"});await t("Render chips with default value",async()=>{e(o).toHaveAttribute("aria-selected","true"),e(l).toHaveAttribute("aria-selected","false"),e(u).toHaveAttribute("aria-selected","false"),e(d).toHaveAttribute("aria-selected","false")}),await t("Click on the chip to select it",async()=>{await r.click(l),e(n.onValueChange).toHaveBeenCalledWith("speaking"),e(o).toHaveAttribute("aria-selected","false"),e(l).toHaveAttribute("aria-selected","true"),e(u).toHaveAttribute("aria-selected","false"),e(d).toHaveAttribute("aria-selected","false")}),await t("Click on the chip to deselect it",async()=>{await r.click(l),e(n.onValueChange).toHaveBeenCalledWith(null),e(o).toHaveAttribute("aria-selected","false"),e(l).toHaveAttribute("aria-selected","false"),e(u).toHaveAttribute("aria-selected","false"),e(d).toHaveAttribute("aria-selected","false")}),await t("Change the value externally",async()=>{Xe(),E("vocabulary"),await T(()=>{e(n.onValueChange).not.toHaveBeenCalled(),e(o).toHaveAttribute("aria-selected","true"),e(l).toHaveAttribute("aria-selected","false"),e(u).toHaveAttribute("aria-selected","false"),e(d).toHaveAttribute("aria-selected","false")})})}},b={args:{items:[{value:"vocabulary",label:"Vocabulary"},{value:"speaking",label:"Speaking",disabled:!0},{value:"listening",label:"Listening"},{value:"reading",label:"Reading"}]},play:async({canvasElement:i,step:t,args:n})=>{const s=c(i),o=s.getByRole("option",{name:"Speaking"}),l=s.getByRole("option",{name:"Vocabulary"});await t("Disabled chip must have disabled attribute",async()=>{e(o).toBeDisabled()}),await t("Disabled chip must not be selectable",async()=>{await r.click(o),e(n.onValueChange).not.toHaveBeenCalled(),e(l).toHaveAttribute("aria-selected","true"),e(o).toHaveAttribute("aria-selected","false")})}},m={args:{"aria-label":"Choose an availability",defaultValue:"morning",items:[{value:"morning",label:"Morning",icon:a.jsx(L,{})},{value:"afternoon",label:"Afternoon",icon:a.jsx(Ye,{})},{value:"evening",label:"Evening",icon:a.jsx(Qe,{})}]},play:async({canvasElement:i,step:t})=>{const s=c(i).getByRole("option",{name:"Morning"}),o=c(s).getByTestId("chip-icon");await t("Chip should render an icon when `icon` prop is passed",async()=>{e(o).toBeVisible()})}},w={args:{"aria-label":"Choose a language to learn",defaultValue:"english",items:[{value:"english",label:"English",counter:1247},{value:"spanish",label:"Spanish",counter:892},{value:"french",label:"French",counter:534},{value:"german",label:"German",counter:421},{value:"italian",label:"Italian",counter:287},{value:"portuguese",label:"Portuguese",counter:156}]},play:async({canvasElement:i,step:t})=>{const s=c(i).getByRole("option",{name:/^English/}),o=c(s).getByTestId("chip-counter");await t("Chip should render a counter when `counter` prop is passed",async()=>{e(o).toBeVisible(),e(o).toHaveTextContent("1247")})}},f={args:{"aria-label":"Choose a country",defaultValue:"ua",items:[{value:"ua",label:"Ukraine",countryFlagCode:"ua"},{value:"gb",label:"United Kingdom",countryFlagCode:"gb"},{value:"it",label:"Italy",countryFlagCode:"it"},{value:"es",label:"Spain",countryFlagCode:"es"},{value:"au",label:"Australia",countryFlagCode:"au"},{value:"br",label:"Brazil",countryFlagCode:"br"},{value:"eg",label:"Egypt",countryFlagCode:"eg"}]},play:async({canvasElement:i,step:t})=>{const s=c(i).getByRole("option",{name:"Ukraine"}),o=c(s).getByTestId("chip-country-flag");await t("Chip should render a flag when `flagCountryCode` prop is passed",async()=>{e(o).toBeVisible()})}},S={args:{"aria-label":"Fancy chips",items:[{value:"counter+icon",label:"Icon + Counter",icon:a.jsx(L,{}),counter:1247},{value:"counter+flag",label:"Flag + Counter",countryFlagCode:"ua",counter:1247},{value:"icon+flag",label:"Icon + Flag",icon:a.jsx(L,{}),countryFlagCode:"ua"}]},play:async({canvasElement:i})=>{const t=c(i),n=c(t.getByRole("option",{name:"Icon + Flag"}));e(n.getByTestId("chip-icon")).toBeVisible(),e(n.queryByTestId("chip-country-flag")).not.toBeInTheDocument()}},C=["2025-08-15T10:00Z","2025-08-16T12:00Z","2025-08-17T14:00Z"],x={args:{orientation:"vertical","aria-label":"Choose a time slot",defaultValue:C[0],items:C.map(i=>({value:`${i}`,label:a.jsx(na,{weekday:"short",day:"numeric",month:"short",hour:"2-digit",minute:"2-digit",value:i}),dataset:{testid:i}}))},decorators:[i=>a.jsx("div",{style:{width:300,margin:"0 auto"},children:a.jsx(i,{})})],play:async({canvasElement:i,step:t})=>{const n=c(i),s=n.getByRole("listbox",{name:"Choose a time slot"}),o=n.getByTestId(C[0]),l=n.getByTestId(C[1]),u=n.getByTestId(C[2]);await t('Vertical chips should have `aria-orientation="vertical"`',async()=>{e(s).toHaveAttribute("aria-orientation","vertical")}),await t("Focus first chip",async()=>{o.focus()}),await t("Arrow down should focus second chip",async()=>{await r.keyboard("{ArrowDown}"),e(l).toHaveFocus()}),await t("Arrow down should focus third chip",async()=>{await r.keyboard("{ArrowDown}"),e(u).toHaveFocus()}),await t("Arrow down should focus first chip",async()=>{await r.keyboard("{ArrowDown}"),e(o).toHaveFocus()}),await t("Arrow up should focus third chip",async()=>{await r.keyboard("{ArrowUp}"),e(u).toHaveFocus()})}},k={render:i=>a.jsxs(h,{gap:"12",children:[a.jsx(g,{...i}),a.jsx(la,{variant:"tertiary",size:"small",onClick:()=>alert("Show all"),children:"Show all"})]})},ca=[{value:"just-starting",label:"I’m just starting"},{value:"basics",label:"I know the basics"},{value:"dont-know",label:"I don’t know"}],ua=[{value:"monday",label:"Monday"},{value:"tuesday",label:"Tuesday"},{value:"wednesday",label:"Wednesday"},{value:"thursday",label:"Thursday"},{value:"friday",label:"Friday"},{value:"saturday",label:"Saturday"},{value:"sunday",label:"Sunday"},{value:"dont-know",label:"I don’t know"}],da=[{value:"morning",label:"Morning (6-12)",icon:a.jsx(L,{})},{value:"afternoon",label:"Afternoon (12-18)",icon:a.jsx(Ye,{})},{value:"evening",label:"Evening (18-0)",icon:a.jsx(Qe,{})},{value:"night",label:"Night (0-6)",icon:a.jsx(aa,{})},{value:"dont-know",label:"I don’t know"}],I={render:function(t){return a.jsxs(h,{direction:"column",alignItems:"stretch",gap:"64",children:[a.jsxs(h,{direction:"column",alignItems:"stretch",gap:"16",children:[a.jsx(V,{variant:"large-semibold",children:"What’s your current English level?"}),a.jsx(g,{"aria-label":"Selected English level",items:ca})]}),a.jsxs(h,{direction:"column",alignItems:"stretch",gap:"16",children:[a.jsx(V,{variant:"large-semibold",children:"When can you take lessons?"}),a.jsx(g,{"aria-label":"Selected day of the week",items:ua})]}),a.jsxs(h,{direction:"column",alignItems:"stretch",gap:"16",children:[a.jsx(V,{variant:"large-semibold",children:"What time of day works for you?"}),a.jsx(g,{"aria-label":"Selected time of day",items:da})]})]})},play:async({canvasElement:i,step:t})=>{const n=c(i),s=c(n.getByRole("listbox",{name:"Selected English level"})),o=c(n.getByRole("listbox",{name:"Selected day of the week"})),l=s.getByRole("option",{name:"I’m just starting"}),u=s.getByRole("option",{name:"I know the basics"}),d=s.getByRole("option",{name:"I don’t know"}),ea=o.getByRole("option",{name:"Monday"});await t("Tab once to enter first chips group",async()=>{await r.tab(),e(l).toHaveFocus()}),await t("Next tab should focus second chips group",async()=>{await r.tab(),e(ea).toHaveFocus()}),await t("Shift+Tab should focus first chips group again",async()=>{await r.tab({shift:!0}),e(l).toHaveFocus()}),await t("Right arrow should focus next chip in the group",async()=>{await r.keyboard("{ArrowRight}"),e(u).toHaveFocus()}),await t("Left arrow should focus previous chip in the group",async()=>{await r.keyboard("{ArrowLeft}"),e(l).toHaveFocus()}),await t("Left arrow should focus last chip if first chip is focused",async()=>{await r.keyboard("{ArrowLeft}"),e(d).toHaveFocus()}),await t("Right arrow should focus first chip if last chip is focused",async()=>{await r.keyboard("{ArrowRight}"),e(l).toHaveFocus()}),await t("Focus last chip",async()=>{await r.keyboard("{ArrowLeft}")}),await t("Tab to the next group",async()=>{await r.tab()}),await t("Shift+Tab to return to the first group, the last focused chip should be focused",async()=>{await r.tab({shift:!0}),e(d).toHaveFocus()})}},j=[{id:1,title:"Building Your First Vocabulary List",skills:["vocabulary"]},{id:2,title:"Effective Speaking Practice Techniques",skills:["speaking"]},{id:3,title:"Active Listening Strategies",skills:["listening"]},{id:4,title:"Speed Reading Methods",skills:["reading"]},{id:5,title:"Grammar Rules Made Simple",skills:["grammar"]},{id:6,title:"Combining Speaking and Vocabulary",skills:["speaking","vocabulary"]},{id:7,title:"Reading Comprehension and Vocabulary Building",skills:["reading","vocabulary"]},{id:8,title:"Listening and Speaking Integration",skills:["listening","speaking"]}],pa=ia.ul`
+import{j as a,r as Ze}from"./iframe-B_74HtSc.js";import{S as p,a as g}from"./SingleSelectChips-CDtny-H7.js";import{F as L,a as Ye,b as Qe,c as aa}from"./TokyoUIAvailability7LateNight-BUCnoHXS.js";import{F as ta}from"./TokyoUIEmojiFrowning-DkxcBN-M.js";import{F as na}from"./index-DIqvfT2b.js";import{L as h}from"./LayoutFlex-DXRMJ9FH.js";import{T as V}from"./Text-DvShrljd.js";import{d as ia}from"./styled-components.browser.esm-BHxIJD2_.js";import{L as sa}from"./Link-BAFCJR3T.js";import{H as oa}from"./Heading-Cj8Si45g.js";import{T as H}from"./Tooltip-BiqKWYpo.js";import{B as la}from"./Button-C0Um_QuO.js";import"./preload-helper-Dp1pzeXC.js";import"./useControllableState-BB4EHwEp.js";import"./useStableCallback-D5P5kDx5.js";import"./createRequiredContext-B3Arn9-D.js";import"./Icon-CC0yjdx9.js";import"./text-accent-BQ9POoE5.js";import"./filterAttributesPassedByRadixUIAtRuntime-B7QTVwVw.js";import"./render-icon-MT6RlyNs.js";import"./componentNames-hc9KR2nX.js";import"./CountryFlag-D40CtNEa.js";import"./useMergeRefs-CFhXCqbA.js";import"./layout-relative.module-BIZVul8q.js";import"./text-centered-BEaaxMgl.js";import"./emotion-unitless.esm-BZwEwAnk.js";import"./useHostname-CbpnzdHv.js";import"./ButtonBase-HkSfLFbE.js";import"./Spinner-8-RB4YZR.js";import"./useMergeRefs-Caz9hOck.js";import"./index-CC6DAVyL.js";const{expect:e,within:c,fn:ra,userEvent:r,resetAllMocks:Xe,waitFor:T}=__STORYBOOK_MODULE_TEST__,Pa={title:"components/Chips/SingleSelectChips",component:g,subcomponents:{SingleSelectChipsItem:p},parameters:{layout:"padded"},args:{"aria-label":"Choose a skill",defaultValue:"vocabulary",onValueChange:ra(),items:[{value:"vocabulary",label:"Vocabulary"},{value:"speaking",label:"Speaking"},{value:"listening",label:"Listening"},{value:"reading",label:"Reading"}]},beforeEach:()=>{Xe()}},v={play:async({canvasElement:i,step:t,args:n})=>{const s=c(i),o=s.getByRole("option",{name:"Vocabulary"}),l=s.getByRole("option",{name:"Speaking"}),u=s.getByRole("option",{name:"Listening"}),d=s.getByRole("option",{name:"Reading"});await t("Render chips with default value",async()=>{e(o).toHaveAttribute("aria-selected","true"),e(l).toHaveAttribute("aria-selected","false"),e(u).toHaveAttribute("aria-selected","false"),e(d).toHaveAttribute("aria-selected","false")}),await t("Click on the chip to select it",async()=>{await r.click(l),e(n.onValueChange).toHaveBeenCalledWith("speaking"),e(o).toHaveAttribute("aria-selected","false"),e(l).toHaveAttribute("aria-selected","true"),e(u).toHaveAttribute("aria-selected","false"),e(d).toHaveAttribute("aria-selected","false")}),await t("Click on the chip to deselect it",async()=>{await r.click(l),e(n.onValueChange).toHaveBeenCalledWith(null),e(o).toHaveAttribute("aria-selected","false"),e(l).toHaveAttribute("aria-selected","false"),e(u).toHaveAttribute("aria-selected","false"),e(d).toHaveAttribute("aria-selected","false")})}};let E;const y={render:function({defaultValue:t,...n}){const[s,o]=Ze.useState(t);E=o;const l=u=>{var d;o(u),(d=n.onValueChange)==null||d.call(n,u)};return a.jsx(g,{...n,value:s,onValueChange:l})},play:async({canvasElement:i,step:t,args:n})=>{const s=c(i),o=s.getByRole("option",{name:"Vocabulary"}),l=s.getByRole("option",{name:"Speaking"}),u=s.getByRole("option",{name:"Listening"}),d=s.getByRole("option",{name:"Reading"});await t("Render chips with default value",async()=>{e(o).toHaveAttribute("aria-selected","true"),e(l).toHaveAttribute("aria-selected","false"),e(u).toHaveAttribute("aria-selected","false"),e(d).toHaveAttribute("aria-selected","false")}),await t("Click on the chip to select it",async()=>{await r.click(l),e(n.onValueChange).toHaveBeenCalledWith("speaking"),e(o).toHaveAttribute("aria-selected","false"),e(l).toHaveAttribute("aria-selected","true"),e(u).toHaveAttribute("aria-selected","false"),e(d).toHaveAttribute("aria-selected","false")}),await t("Click on the chip to deselect it",async()=>{await r.click(l),e(n.onValueChange).toHaveBeenCalledWith(null),e(o).toHaveAttribute("aria-selected","false"),e(l).toHaveAttribute("aria-selected","false"),e(u).toHaveAttribute("aria-selected","false"),e(d).toHaveAttribute("aria-selected","false")}),await t("Change the value externally",async()=>{Xe(),E("vocabulary"),await T(()=>{e(n.onValueChange).not.toHaveBeenCalled(),e(o).toHaveAttribute("aria-selected","true"),e(l).toHaveAttribute("aria-selected","false"),e(u).toHaveAttribute("aria-selected","false"),e(d).toHaveAttribute("aria-selected","false")})})}},b={args:{items:[{value:"vocabulary",label:"Vocabulary"},{value:"speaking",label:"Speaking",disabled:!0},{value:"listening",label:"Listening"},{value:"reading",label:"Reading"}]},play:async({canvasElement:i,step:t,args:n})=>{const s=c(i),o=s.getByRole("option",{name:"Speaking"}),l=s.getByRole("option",{name:"Vocabulary"});await t("Disabled chip must have disabled attribute",async()=>{e(o).toBeDisabled()}),await t("Disabled chip must not be selectable",async()=>{await r.click(o),e(n.onValueChange).not.toHaveBeenCalled(),e(l).toHaveAttribute("aria-selected","true"),e(o).toHaveAttribute("aria-selected","false")})}},m={args:{"aria-label":"Choose an availability",defaultValue:"morning",items:[{value:"morning",label:"Morning",icon:a.jsx(L,{})},{value:"afternoon",label:"Afternoon",icon:a.jsx(Ye,{})},{value:"evening",label:"Evening",icon:a.jsx(Qe,{})}]},play:async({canvasElement:i,step:t})=>{const s=c(i).getByRole("option",{name:"Morning"}),o=c(s).getByTestId("chip-icon");await t("Chip should render an icon when `icon` prop is passed",async()=>{e(o).toBeVisible()})}},w={args:{"aria-label":"Choose a language to learn",defaultValue:"english",items:[{value:"english",label:"English",counter:1247},{value:"spanish",label:"Spanish",counter:892},{value:"french",label:"French",counter:534},{value:"german",label:"German",counter:421},{value:"italian",label:"Italian",counter:287},{value:"portuguese",label:"Portuguese",counter:156}]},play:async({canvasElement:i,step:t})=>{const s=c(i).getByRole("option",{name:/^English/}),o=c(s).getByTestId("chip-counter");await t("Chip should render a counter when `counter` prop is passed",async()=>{e(o).toBeVisible(),e(o).toHaveTextContent("1247")})}},f={args:{"aria-label":"Choose a country",defaultValue:"ua",items:[{value:"ua",label:"Ukraine",countryFlagCode:"ua"},{value:"gb",label:"United Kingdom",countryFlagCode:"gb"},{value:"it",label:"Italy",countryFlagCode:"it"},{value:"es",label:"Spain",countryFlagCode:"es"},{value:"au",label:"Australia",countryFlagCode:"au"},{value:"br",label:"Brazil",countryFlagCode:"br"},{value:"eg",label:"Egypt",countryFlagCode:"eg"}]},play:async({canvasElement:i,step:t})=>{const s=c(i).getByRole("option",{name:"Ukraine"}),o=c(s).getByTestId("chip-country-flag");await t("Chip should render a flag when `flagCountryCode` prop is passed",async()=>{e(o).toBeVisible()})}},S={args:{"aria-label":"Fancy chips",items:[{value:"counter+icon",label:"Icon + Counter",icon:a.jsx(L,{}),counter:1247},{value:"counter+flag",label:"Flag + Counter",countryFlagCode:"ua",counter:1247},{value:"icon+flag",label:"Icon + Flag",icon:a.jsx(L,{}),countryFlagCode:"ua"}]},play:async({canvasElement:i})=>{const t=c(i),n=c(t.getByRole("option",{name:"Icon + Flag"}));e(n.getByTestId("chip-icon")).toBeVisible(),e(n.queryByTestId("chip-country-flag")).not.toBeInTheDocument()}},C=["2025-08-15T10:00Z","2025-08-16T12:00Z","2025-08-17T14:00Z"],x={args:{orientation:"vertical","aria-label":"Choose a time slot",defaultValue:C[0],items:C.map(i=>({value:`${i}`,label:a.jsx(na,{weekday:"short",day:"numeric",month:"short",hour:"2-digit",minute:"2-digit",value:i}),dataset:{testid:i}}))},decorators:[i=>a.jsx("div",{style:{width:300,margin:"0 auto"},children:a.jsx(i,{})})],play:async({canvasElement:i,step:t})=>{const n=c(i),s=n.getByRole("listbox",{name:"Choose a time slot"}),o=n.getByTestId(C[0]),l=n.getByTestId(C[1]),u=n.getByTestId(C[2]);await t('Vertical chips should have `aria-orientation="vertical"`',async()=>{e(s).toHaveAttribute("aria-orientation","vertical")}),await t("Focus first chip",async()=>{o.focus()}),await t("Arrow down should focus second chip",async()=>{await r.keyboard("{ArrowDown}"),e(l).toHaveFocus()}),await t("Arrow down should focus third chip",async()=>{await r.keyboard("{ArrowDown}"),e(u).toHaveFocus()}),await t("Arrow down should focus first chip",async()=>{await r.keyboard("{ArrowDown}"),e(o).toHaveFocus()}),await t("Arrow up should focus third chip",async()=>{await r.keyboard("{ArrowUp}"),e(u).toHaveFocus()})}},k={render:i=>a.jsxs(h,{gap:"12",children:[a.jsx(g,{...i}),a.jsx(la,{variant:"tertiary",size:"small",onClick:()=>alert("Show all"),children:"Show all"})]})},ca=[{value:"just-starting",label:"I’m just starting"},{value:"basics",label:"I know the basics"},{value:"dont-know",label:"I don’t know"}],ua=[{value:"monday",label:"Monday"},{value:"tuesday",label:"Tuesday"},{value:"wednesday",label:"Wednesday"},{value:"thursday",label:"Thursday"},{value:"friday",label:"Friday"},{value:"saturday",label:"Saturday"},{value:"sunday",label:"Sunday"},{value:"dont-know",label:"I don’t know"}],da=[{value:"morning",label:"Morning (6-12)",icon:a.jsx(L,{})},{value:"afternoon",label:"Afternoon (12-18)",icon:a.jsx(Ye,{})},{value:"evening",label:"Evening (18-0)",icon:a.jsx(Qe,{})},{value:"night",label:"Night (0-6)",icon:a.jsx(aa,{})},{value:"dont-know",label:"I don’t know"}],I={render:function(t){return a.jsxs(h,{direction:"column",alignItems:"stretch",gap:"64",children:[a.jsxs(h,{direction:"column",alignItems:"stretch",gap:"16",children:[a.jsx(V,{variant:"large-semibold",children:"What’s your current English level?"}),a.jsx(g,{"aria-label":"Selected English level",items:ca})]}),a.jsxs(h,{direction:"column",alignItems:"stretch",gap:"16",children:[a.jsx(V,{variant:"large-semibold",children:"When can you take lessons?"}),a.jsx(g,{"aria-label":"Selected day of the week",items:ua})]}),a.jsxs(h,{direction:"column",alignItems:"stretch",gap:"16",children:[a.jsx(V,{variant:"large-semibold",children:"What time of day works for you?"}),a.jsx(g,{"aria-label":"Selected time of day",items:da})]})]})},play:async({canvasElement:i,step:t})=>{const n=c(i),s=c(n.getByRole("listbox",{name:"Selected English level"})),o=c(n.getByRole("listbox",{name:"Selected day of the week"})),l=s.getByRole("option",{name:"I’m just starting"}),u=s.getByRole("option",{name:"I know the basics"}),d=s.getByRole("option",{name:"I don’t know"}),ea=o.getByRole("option",{name:"Monday"});await t("Tab once to enter first chips group",async()=>{await r.tab(),e(l).toHaveFocus()}),await t("Next tab should focus second chips group",async()=>{await r.tab(),e(ea).toHaveFocus()}),await t("Shift+Tab should focus first chips group again",async()=>{await r.tab({shift:!0}),e(l).toHaveFocus()}),await t("Right arrow should focus next chip in the group",async()=>{await r.keyboard("{ArrowRight}"),e(u).toHaveFocus()}),await t("Left arrow should focus previous chip in the group",async()=>{await r.keyboard("{ArrowLeft}"),e(l).toHaveFocus()}),await t("Left arrow should focus last chip if first chip is focused",async()=>{await r.keyboard("{ArrowLeft}"),e(d).toHaveFocus()}),await t("Right arrow should focus first chip if last chip is focused",async()=>{await r.keyboard("{ArrowRight}"),e(l).toHaveFocus()}),await t("Focus last chip",async()=>{await r.keyboard("{ArrowLeft}")}),await t("Tab to the next group",async()=>{await r.tab()}),await t("Shift+Tab to return to the first group, the last focused chip should be focused",async()=>{await r.tab({shift:!0}),e(d).toHaveFocus()})}},j=[{id:1,title:"Building Your First Vocabulary List",skills:["vocabulary"]},{id:2,title:"Effective Speaking Practice Techniques",skills:["speaking"]},{id:3,title:"Active Listening Strategies",skills:["listening"]},{id:4,title:"Speed Reading Methods",skills:["reading"]},{id:5,title:"Grammar Rules Made Simple",skills:["grammar"]},{id:6,title:"Combining Speaking and Vocabulary",skills:["speaking","vocabulary"]},{id:7,title:"Reading Comprehension and Vocabulary Building",skills:["reading","vocabulary"]},{id:8,title:"Listening and Speaking Integration",skills:["listening","speaking"]}],pa=ia.ul`
     all: unset;
     list-style: none;
     display: flex;

package/dist/assets/{Slider-CVM0huNa.js → Slider-B8ndK7PX.js}

@@ -1,2 +1,2 @@
-import{r as d,a8 as de,j as m,aa as me,ag as E,af as A,ai as C,aq as fe,g as pe}from"./iframe-DjYTJz7A.js";import{w as he}from"./componentNames-hc9KR2nX.js";import{c as ve,u as ge,a as W,b as be}from"./index-C_O4jEc0.js";var X=["PageUp","PageDown"],G=["ArrowUp","ArrowDown","ArrowLeft","ArrowRight"],J={"from-left":["Home","PageDown","ArrowDown","ArrowLeft"],"from-right":["Home","PageDown","ArrowDown","ArrowRight"],"from-bottom":["Home","PageDown","ArrowDown","ArrowLeft"],"from-top":["Home","PageDown","ArrowUp","ArrowLeft"]},T="Slider",[H,Se,ye]=ve(T),[Q]=me(T,[ye]),[we,N]=Q(T),Z=d.forwardRef((e,t)=>{const{name:n,min:r=0,max:s=100,step:l=1,orientation:a="horizontal",disabled:i=!1,minStepsBetweenThumbs:u=0,defaultValue:p=[r],value:h,onValueChange:o=()=>{},onValueCommit:c=()=>{},inverted:S=!1,form:x,...b}=e,v=d.useRef(new Set),f=d.useRef(0),y=a==="horizontal"?xe:_e,[g=[],I]=de({prop:h,defaultProp:p,onChange:w=>{var V;(V=[...v.current][f.current])==null||V.focus(),o(w)}}),B=d.useRef(g);function K(w){const _=Ee(g,w);M(w,_)}function ue(w){M(w,f.current)}function ce(){const w=B.current[f.current];g[f.current]!==w&&c(g)}function M(w,_,{commit:V}={commit:!1}){const F=Me(l),q=je(Math.round((w-r)/l)*l+r,F),j=W(q,[r,s]);I((D=[])=>{const R=Ve(D,j,_);if(Ie(R,u*l)){f.current=R.indexOf(j);const Y=String(R)!==String(D);return Y&&V&&c(R),Y?R:D}else return D})}return m.jsx(we,{scope:e.__scopeSlider,name:n,disabled:i,min:r,max:s,valueIndexToChangeRef:f,thumbs:v.current,values:g,orientation:a,form:x,children:m.jsx(H.Provider,{scope:e.__scopeSlider,children:m.jsx(H.Slot,{scope:e.__scopeSlider,children:m.jsx(y,{"aria-disabled":i,"data-disabled":i?"":void 0,...b,ref:t,onPointerDown:E(b.onPointerDown,()=>{i||(B.current=g)}),min:r,max:s,inverted:S,onSlideStart:i?void 0:K,onSlideMove:i?void 0:ue,onSlideEnd:i?void 0:ce,onHomeKeyDown:()=>!i&&M(r,0,{commit:!0}),onEndKeyDown:()=>!i&&M(s,g.length-1,{commit:!0}),onStepKeyDown:({event:w,direction:_})=>{if(!i){const q=X.includes(w.key)||w.shiftKey&&G.includes(w.key)?10:1,j=f.current,D=g[j],R=l*q*_;M(D+R,j,{commit:!0})}}})})})})});Z.displayName=T;var[ee,te]=Q(T,{startEdge:"left",endEdge:"right",size:"width",direction:1}),xe=d.forwardRef((e,t)=>{const{min:n,max:r,dir:s,inverted:l,onSlideStart:a,onSlideMove:i,onSlideEnd:u,onStepKeyDown:p,...h}=e,[o,c]=d.useState(null),S=C(t,y=>c(y)),x=d.useRef(void 0),b=ge(s),v=b==="ltr",f=v&&!l||!v&&l;function P(y){const g=x.current||o.getBoundingClientRect(),I=[0,g.width],K=U(I,f?[n,r]:[r,n]);return x.current=g,K(y-g.left)}return m.jsx(ee,{scope:e.__scopeSlider,startEdge:f?"left":"right",endEdge:f?"right":"left",direction:f?1:-1,size:"width",children:m.jsx(ne,{dir:b,"data-orientation":"horizontal",...h,ref:S,style:{...h.style,"--radix-slider-thumb-transform":"translateX(-50%)"},onSlideStart:y=>{const g=P(y.clientX);a==null||a(g)},onSlideMove:y=>{const g=P(y.clientX);i==null||i(g)},onSlideEnd:()=>{x.current=void 0,u==null||u()},onStepKeyDown:y=>{const I=J[f?"from-left":"from-right"].includes(y.key);p==null||p({event:y,direction:I?-1:1})}})})}),_e=d.forwardRef((e,t)=>{const{min:n,max:r,inverted:s,onSlideStart:l,onSlideMove:a,onSlideEnd:i,onStepKeyDown:u,...p}=e,h=d.useRef(null),o=C(t,h),c=d.useRef(void 0),S=!s;function x(b){const v=c.current||h.current.getBoundingClientRect(),f=[0,v.height],y=U(f,S?[r,n]:[n,r]);return c.current=v,y(b-v.top)}return m.jsx(ee,{scope:e.__scopeSlider,startEdge:S?"bottom":"top",endEdge:S?"top":"bottom",size:"height",direction:S?1:-1,children:m.jsx(ne,{"data-orientation":"vertical",...p,ref:o,style:{...p.style,"--radix-slider-thumb-transform":"translateY(50%)"},onSlideStart:b=>{const v=x(b.clientY);l==null||l(v)},onSlideMove:b=>{const v=x(b.clientY);a==null||a(v)},onSlideEnd:()=>{c.current=void 0,i==null||i()},onStepKeyDown:b=>{const f=J[S?"from-bottom":"from-top"].includes(b.key);u==null||u({event:b,direction:f?-1:1})}})})}),ne=d.forwardRef((e,t)=>{const{__scopeSlider:n,onSlideStart:r,onSlideMove:s,onSlideEnd:l,onHomeKeyDown:a,onEndKeyDown:i,onStepKeyDown:u,...p}=e,h=N(T,n);return m.jsx(A.span,{...p,ref:t,onKeyDown:E(e.onKeyDown,o=>{o.key==="Home"?(a(o),o.preventDefault()):o.key==="End"?(i(o),o.preventDefault()):X.concat(G).includes(o.key)&&(u(o),o.preventDefault())}),onPointerDown:E(e.onPointerDown,o=>{const c=o.target;c.setPointerCapture(o.pointerId),o.preventDefault(),h.thumbs.has(c)?c.focus():r(o)}),onPointerMove:E(e.onPointerMove,o=>{o.target.hasPointerCapture(o.pointerId)&&s(o)}),onPointerUp:E(e.onPointerUp,o=>{const c=o.target;c.hasPointerCapture(o.pointerId)&&(c.releasePointerCapture(o.pointerId),l(o))})})}),re="SliderTrack",ae=d.forwardRef((e,t)=>{const{__scopeSlider:n,...r}=e,s=N(re,n);return m.jsx(A.span,{"data-disabled":s.disabled?"":void 0,"data-orientation":s.orientation,...r,ref:t})});ae.displayName=re;var O="SliderRange",oe=d.forwardRef((e,t)=>{const{__scopeSlider:n,...r}=e,s=N(O,n),l=te(O,n),a=d.useRef(null),i=C(t,a),u=s.values.length,p=s.values.map(c=>le(c,s.min,s.max)),h=u>1?Math.min(...p):0,o=100-Math.max(...p);return m.jsx(A.span,{"data-orientation":s.orientation,"data-disabled":s.disabled?"":void 0,...r,ref:i,style:{...e.style,[l.startEdge]:h+"%",[l.endEdge]:o+"%"}})});oe.displayName=O;var z="SliderThumb",ie=d.forwardRef((e,t)=>{const n=Se(e.__scopeSlider),[r,s]=d.useState(null),l=C(t,i=>s(i)),a=d.useMemo(()=>r?n().findIndex(i=>i.ref.current===r):-1,[n,r]);return m.jsx(Re,{...e,ref:l,index:a})}),Re=d.forwardRef((e,t)=>{const{__scopeSlider:n,index:r,name:s,...l}=e,a=N(z,n),i=te(z,n),[u,p]=d.useState(null),h=C(t,P=>p(P)),o=u?a.form||!!u.closest("form"):!0,c=fe(u),S=a.values[r],x=S===void 0?0:le(S,a.min,a.max),b=De(r,a.values.length),v=c==null?void 0:c[i.size],f=v?Ce(v,x,i.direction):0;return d.useEffect(()=>{if(u)return a.thumbs.add(u),()=>{a.thumbs.delete(u)}},[u,a.thumbs]),m.jsxs("span",{style:{transform:"var(--radix-slider-thumb-transform)",position:"absolute",[i.startEdge]:`calc(${x}% + ${f}px)`},children:[m.jsx(H.ItemSlot,{scope:e.__scopeSlider,children:m.jsx(A.span,{role:"slider","aria-label":e["aria-label"]||b,"aria-valuemin":a.min,"aria-valuenow":S,"aria-valuemax":a.max,"aria-orientation":a.orientation,"data-orientation":a.orientation,"data-disabled":a.disabled?"":void 0,tabIndex:a.disabled?void 0:0,...l,ref:h,style:S===void 0?{display:"none"}:e.style,onFocus:E(e.onFocus,()=>{a.valueIndexToChangeRef.current=r})})}),o&&m.jsx(se,{name:s??(a.name?a.name+(a.values.length>1?"[]":""):void 0),form:a.form,value:S},r)]})});ie.displayName=z;var Pe="RadioBubbleInput",se=d.forwardRef(({__scopeSlider:e,value:t,...n},r)=>{const s=d.useRef(null),l=C(s,r),a=be(t);return d.useEffect(()=>{const i=s.current;if(!i)return;const u=window.HTMLInputElement.prototype,h=Object.getOwnPropertyDescriptor(u,"value").set;if(a!==t&&h){const o=new Event("input",{bubbles:!0});h.call(i,t),i.dispatchEvent(o)}},[a,t]),m.jsx(A.input,{style:{display:"none"},...n,ref:l,defaultValue:t})});se.displayName=Pe;function Ve(e=[],t,n){const r=[...e];return r[n]=t,r.sort((s,l)=>s-l)}function le(e,t,n){const l=100/(n-t)*(e-t);return W(l,[0,100])}function De(e,t){return t>2?`Value ${e+1} of ${t}`:t===2?["Minimum","Maximum"][e]:void 0}function Ee(e,t){if(e.length===1)return 0;const n=e.map(s=>Math.abs(s-t)),r=Math.min(...n);return n.indexOf(r)}function Ce(e,t,n){const r=e/2,l=U([0,50],[0,r]);return(r-l(t)*n)*n}function Te(e){return e.slice(0,-1).map((t,n)=>e[n+1]-t)}function Ie(e,t){if(t>0){const n=Te(e);return Math.min(...n)>=t}return!0}function U(e,t){return n=>{if(e[0]===e[1]||t[0]===t[1])return t[0];const r=(t[1]-t[0])/(e[1]-e[0]);return t[0]+r*(n-e[0])}}function Me(e){return(String(e).split(".")[1]||"").length}function je(e,t){const n=Math.pow(10,t);return Math.round(e*n)/n}var Ae=Z,ke=ae,Ne=oe,Be=ie;const Ke="root__Eki38",qe="track__zosW2",He="range__Awc-3",Oe="thumb__IV11l",k={root:Ke,track:qe,range:He,thumb:Oe};function L(e){const t={};return Object.entries(e).forEach(([n,r])=>{switch(n){case"id":case"aria-label":case"aria-labelledby":case"aria-describedby":case"aria-invalid":case"aria-errormessage":t[n]=r}}),t}const $=d.forwardRef(function({value:t,defaultValue:n=0,onValueChange:r,min:s=0,max:l=100,step:a=1,dataset:i,...u},p){const h=pe(i,{preplyDsComponent:he.Slider}),o=r?c=>r(c[0]):void 0;return m.jsxs(Ae,{ref:p,...h,className:k.root,value:t!==void 0?[t]:void 0,defaultValue:n!==void 0?[n]:void 0,onValueChange:o,min:s,max:l,step:a,children:[m.jsx(ke,{className:k.track,children:m.jsx(Ne,{className:k.range})}),m.jsx(Be,{...L(u),className:k.thumb})]})});try{L.displayName="filterThumbProps",L.__docgenInfo={description:"",displayName:"filterThumbProps",props:{}}}catch{}try{$.displayName="Slider",$.__docgenInfo={description:"A slider input that allows users to select a single value from a range.",displayName:"Slider",props:{id:{defaultValue:null,description:"The unique identifier for the range slider element.",name:"id",required:!1,type:{name:"enum",value:[{value:"string"}]}},"aria-label":{defaultValue:null,description:"Accessible label for the range slider.",name:"aria-label",required:!1,type:{name:"enum",value:[{value:"string"}]}},"aria-labelledby":{defaultValue:null,description:"ID of the element that labels the range slider.",name:"aria-labelledby",required:!1,type:{name:"enum",value:[{value:"string"}]}},"aria-describedby":{defaultValue:null,description:"ID of the element that describes the range slider.",name:"aria-describedby",required:!1,type:{name:"enum",value:[{value:"string"}]}},"aria-invalid":{defaultValue:null,description:"Indicates whether the range slider value is invalid.",name:"aria-invalid",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},"aria-errormessage":{defaultValue:null,description:"ID of the element that describes the error, if any.",name:"aria-errormessage",required:!1,type:{name:"enum",value:[{value:"string"}]}},value:{defaultValue:null,description:"The controlled value of the slider.\nMust be used in conjunction with `onValueChange`.",name:"value",required:!1,type:{name:"enum",value:[{value:"number"}]}},defaultValue:{defaultValue:{value:"0"},description:`The value of the slider when initially rendered.
+import{r as d,a8 as de,j as m,aa as me,ag as E,af as A,ai as C,aq as fe,g as pe}from"./iframe-B_74HtSc.js";import{w as he}from"./componentNames-hc9KR2nX.js";import{c as ve,u as ge,a as W,b as be}from"./index-Cnv20V_M.js";var X=["PageUp","PageDown"],G=["ArrowUp","ArrowDown","ArrowLeft","ArrowRight"],J={"from-left":["Home","PageDown","ArrowDown","ArrowLeft"],"from-right":["Home","PageDown","ArrowDown","ArrowRight"],"from-bottom":["Home","PageDown","ArrowDown","ArrowLeft"],"from-top":["Home","PageDown","ArrowUp","ArrowLeft"]},T="Slider",[H,Se,ye]=ve(T),[Q]=me(T,[ye]),[we,N]=Q(T),Z=d.forwardRef((e,t)=>{const{name:n,min:r=0,max:s=100,step:l=1,orientation:a="horizontal",disabled:i=!1,minStepsBetweenThumbs:u=0,defaultValue:p=[r],value:h,onValueChange:o=()=>{},onValueCommit:c=()=>{},inverted:S=!1,form:x,...b}=e,v=d.useRef(new Set),f=d.useRef(0),y=a==="horizontal"?xe:_e,[g=[],I]=de({prop:h,defaultProp:p,onChange:w=>{var V;(V=[...v.current][f.current])==null||V.focus(),o(w)}}),B=d.useRef(g);function K(w){const _=Ee(g,w);M(w,_)}function ue(w){M(w,f.current)}function ce(){const w=B.current[f.current];g[f.current]!==w&&c(g)}function M(w,_,{commit:V}={commit:!1}){const F=Me(l),q=je(Math.round((w-r)/l)*l+r,F),j=W(q,[r,s]);I((D=[])=>{const R=Ve(D,j,_);if(Ie(R,u*l)){f.current=R.indexOf(j);const Y=String(R)!==String(D);return Y&&V&&c(R),Y?R:D}else return D})}return m.jsx(we,{scope:e.__scopeSlider,name:n,disabled:i,min:r,max:s,valueIndexToChangeRef:f,thumbs:v.current,values:g,orientation:a,form:x,children:m.jsx(H.Provider,{scope:e.__scopeSlider,children:m.jsx(H.Slot,{scope:e.__scopeSlider,children:m.jsx(y,{"aria-disabled":i,"data-disabled":i?"":void 0,...b,ref:t,onPointerDown:E(b.onPointerDown,()=>{i||(B.current=g)}),min:r,max:s,inverted:S,onSlideStart:i?void 0:K,onSlideMove:i?void 0:ue,onSlideEnd:i?void 0:ce,onHomeKeyDown:()=>!i&&M(r,0,{commit:!0}),onEndKeyDown:()=>!i&&M(s,g.length-1,{commit:!0}),onStepKeyDown:({event:w,direction:_})=>{if(!i){const q=X.includes(w.key)||w.shiftKey&&G.includes(w.key)?10:1,j=f.current,D=g[j],R=l*q*_;M(D+R,j,{commit:!0})}}})})})})});Z.displayName=T;var[ee,te]=Q(T,{startEdge:"left",endEdge:"right",size:"width",direction:1}),xe=d.forwardRef((e,t)=>{const{min:n,max:r,dir:s,inverted:l,onSlideStart:a,onSlideMove:i,onSlideEnd:u,onStepKeyDown:p,...h}=e,[o,c]=d.useState(null),S=C(t,y=>c(y)),x=d.useRef(void 0),b=ge(s),v=b==="ltr",f=v&&!l||!v&&l;function P(y){const g=x.current||o.getBoundingClientRect(),I=[0,g.width],K=U(I,f?[n,r]:[r,n]);return x.current=g,K(y-g.left)}return m.jsx(ee,{scope:e.__scopeSlider,startEdge:f?"left":"right",endEdge:f?"right":"left",direction:f?1:-1,size:"width",children:m.jsx(ne,{dir:b,"data-orientation":"horizontal",...h,ref:S,style:{...h.style,"--radix-slider-thumb-transform":"translateX(-50%)"},onSlideStart:y=>{const g=P(y.clientX);a==null||a(g)},onSlideMove:y=>{const g=P(y.clientX);i==null||i(g)},onSlideEnd:()=>{x.current=void 0,u==null||u()},onStepKeyDown:y=>{const I=J[f?"from-left":"from-right"].includes(y.key);p==null||p({event:y,direction:I?-1:1})}})})}),_e=d.forwardRef((e,t)=>{const{min:n,max:r,inverted:s,onSlideStart:l,onSlideMove:a,onSlideEnd:i,onStepKeyDown:u,...p}=e,h=d.useRef(null),o=C(t,h),c=d.useRef(void 0),S=!s;function x(b){const v=c.current||h.current.getBoundingClientRect(),f=[0,v.height],y=U(f,S?[r,n]:[n,r]);return c.current=v,y(b-v.top)}return m.jsx(ee,{scope:e.__scopeSlider,startEdge:S?"bottom":"top",endEdge:S?"top":"bottom",size:"height",direction:S?1:-1,children:m.jsx(ne,{"data-orientation":"vertical",...p,ref:o,style:{...p.style,"--radix-slider-thumb-transform":"translateY(50%)"},onSlideStart:b=>{const v=x(b.clientY);l==null||l(v)},onSlideMove:b=>{const v=x(b.clientY);a==null||a(v)},onSlideEnd:()=>{c.current=void 0,i==null||i()},onStepKeyDown:b=>{const f=J[S?"from-bottom":"from-top"].includes(b.key);u==null||u({event:b,direction:f?-1:1})}})})}),ne=d.forwardRef((e,t)=>{const{__scopeSlider:n,onSlideStart:r,onSlideMove:s,onSlideEnd:l,onHomeKeyDown:a,onEndKeyDown:i,onStepKeyDown:u,...p}=e,h=N(T,n);return m.jsx(A.span,{...p,ref:t,onKeyDown:E(e.onKeyDown,o=>{o.key==="Home"?(a(o),o.preventDefault()):o.key==="End"?(i(o),o.preventDefault()):X.concat(G).includes(o.key)&&(u(o),o.preventDefault())}),onPointerDown:E(e.onPointerDown,o=>{const c=o.target;c.setPointerCapture(o.pointerId),o.preventDefault(),h.thumbs.has(c)?c.focus():r(o)}),onPointerMove:E(e.onPointerMove,o=>{o.target.hasPointerCapture(o.pointerId)&&s(o)}),onPointerUp:E(e.onPointerUp,o=>{const c=o.target;c.hasPointerCapture(o.pointerId)&&(c.releasePointerCapture(o.pointerId),l(o))})})}),re="SliderTrack",ae=d.forwardRef((e,t)=>{const{__scopeSlider:n,...r}=e,s=N(re,n);return m.jsx(A.span,{"data-disabled":s.disabled?"":void 0,"data-orientation":s.orientation,...r,ref:t})});ae.displayName=re;var O="SliderRange",oe=d.forwardRef((e,t)=>{const{__scopeSlider:n,...r}=e,s=N(O,n),l=te(O,n),a=d.useRef(null),i=C(t,a),u=s.values.length,p=s.values.map(c=>le(c,s.min,s.max)),h=u>1?Math.min(...p):0,o=100-Math.max(...p);return m.jsx(A.span,{"data-orientation":s.orientation,"data-disabled":s.disabled?"":void 0,...r,ref:i,style:{...e.style,[l.startEdge]:h+"%",[l.endEdge]:o+"%"}})});oe.displayName=O;var z="SliderThumb",ie=d.forwardRef((e,t)=>{const n=Se(e.__scopeSlider),[r,s]=d.useState(null),l=C(t,i=>s(i)),a=d.useMemo(()=>r?n().findIndex(i=>i.ref.current===r):-1,[n,r]);return m.jsx(Re,{...e,ref:l,index:a})}),Re=d.forwardRef((e,t)=>{const{__scopeSlider:n,index:r,name:s,...l}=e,a=N(z,n),i=te(z,n),[u,p]=d.useState(null),h=C(t,P=>p(P)),o=u?a.form||!!u.closest("form"):!0,c=fe(u),S=a.values[r],x=S===void 0?0:le(S,a.min,a.max),b=De(r,a.values.length),v=c==null?void 0:c[i.size],f=v?Ce(v,x,i.direction):0;return d.useEffect(()=>{if(u)return a.thumbs.add(u),()=>{a.thumbs.delete(u)}},[u,a.thumbs]),m.jsxs("span",{style:{transform:"var(--radix-slider-thumb-transform)",position:"absolute",[i.startEdge]:`calc(${x}% + ${f}px)`},children:[m.jsx(H.ItemSlot,{scope:e.__scopeSlider,children:m.jsx(A.span,{role:"slider","aria-label":e["aria-label"]||b,"aria-valuemin":a.min,"aria-valuenow":S,"aria-valuemax":a.max,"aria-orientation":a.orientation,"data-orientation":a.orientation,"data-disabled":a.disabled?"":void 0,tabIndex:a.disabled?void 0:0,...l,ref:h,style:S===void 0?{display:"none"}:e.style,onFocus:E(e.onFocus,()=>{a.valueIndexToChangeRef.current=r})})}),o&&m.jsx(se,{name:s??(a.name?a.name+(a.values.length>1?"[]":""):void 0),form:a.form,value:S},r)]})});ie.displayName=z;var Pe="RadioBubbleInput",se=d.forwardRef(({__scopeSlider:e,value:t,...n},r)=>{const s=d.useRef(null),l=C(s,r),a=be(t);return d.useEffect(()=>{const i=s.current;if(!i)return;const u=window.HTMLInputElement.prototype,h=Object.getOwnPropertyDescriptor(u,"value").set;if(a!==t&&h){const o=new Event("input",{bubbles:!0});h.call(i,t),i.dispatchEvent(o)}},[a,t]),m.jsx(A.input,{style:{display:"none"},...n,ref:l,defaultValue:t})});se.displayName=Pe;function Ve(e=[],t,n){const r=[...e];return r[n]=t,r.sort((s,l)=>s-l)}function le(e,t,n){const l=100/(n-t)*(e-t);return W(l,[0,100])}function De(e,t){return t>2?`Value ${e+1} of ${t}`:t===2?["Minimum","Maximum"][e]:void 0}function Ee(e,t){if(e.length===1)return 0;const n=e.map(s=>Math.abs(s-t)),r=Math.min(...n);return n.indexOf(r)}function Ce(e,t,n){const r=e/2,l=U([0,50],[0,r]);return(r-l(t)*n)*n}function Te(e){return e.slice(0,-1).map((t,n)=>e[n+1]-t)}function Ie(e,t){if(t>0){const n=Te(e);return Math.min(...n)>=t}return!0}function U(e,t){return n=>{if(e[0]===e[1]||t[0]===t[1])return t[0];const r=(t[1]-t[0])/(e[1]-e[0]);return t[0]+r*(n-e[0])}}function Me(e){return(String(e).split(".")[1]||"").length}function je(e,t){const n=Math.pow(10,t);return Math.round(e*n)/n}var Ae=Z,ke=ae,Ne=oe,Be=ie;const Ke="root__Eki38",qe="track__zosW2",He="range__Awc-3",Oe="thumb__IV11l",k={root:Ke,track:qe,range:He,thumb:Oe};function L(e){const t={};return Object.entries(e).forEach(([n,r])=>{switch(n){case"id":case"aria-label":case"aria-labelledby":case"aria-describedby":case"aria-invalid":case"aria-errormessage":t[n]=r}}),t}const $=d.forwardRef(function({value:t,defaultValue:n=0,onValueChange:r,min:s=0,max:l=100,step:a=1,dataset:i,...u},p){const h=pe(i,{preplyDsComponent:he.Slider}),o=r?c=>r(c[0]):void 0;return m.jsxs(Ae,{ref:p,...h,className:k.root,value:t!==void 0?[t]:void 0,defaultValue:n!==void 0?[n]:void 0,onValueChange:o,min:s,max:l,step:a,children:[m.jsx(ke,{className:k.track,children:m.jsx(Ne,{className:k.range})}),m.jsx(Be,{...L(u),className:k.thumb})]})});try{L.displayName="filterThumbProps",L.__docgenInfo={description:"",displayName:"filterThumbProps",props:{}}}catch{}try{$.displayName="Slider",$.__docgenInfo={description:"A slider input that allows users to select a single value from a range.",displayName:"Slider",props:{id:{defaultValue:null,description:"The unique identifier for the range slider element.",name:"id",required:!1,type:{name:"enum",value:[{value:"string"}]}},"aria-label":{defaultValue:null,description:"Accessible label for the range slider.",name:"aria-label",required:!1,type:{name:"enum",value:[{value:"string"}]}},"aria-labelledby":{defaultValue:null,description:"ID of the element that labels the range slider.",name:"aria-labelledby",required:!1,type:{name:"enum",value:[{value:"string"}]}},"aria-describedby":{defaultValue:null,description:"ID of the element that describes the range slider.",name:"aria-describedby",required:!1,type:{name:"enum",value:[{value:"string"}]}},"aria-invalid":{defaultValue:null,description:"Indicates whether the range slider value is invalid.",name:"aria-invalid",required:!1,type:{name:"enum",value:[{value:"false"},{value:"true"}]}},"aria-errormessage":{defaultValue:null,description:"ID of the element that describes the error, if any.",name:"aria-errormessage",required:!1,type:{name:"enum",value:[{value:"string"}]}},value:{defaultValue:null,description:"The controlled value of the slider.\nMust be used in conjunction with `onValueChange`.",name:"value",required:!1,type:{name:"enum",value:[{value:"number"}]}},defaultValue:{defaultValue:{value:"0"},description:`The value of the slider when initially rendered.
 Use when you do not need to control the state of the slider.`,name:"defaultValue",required:!1,type:{name:"enum",value:[{value:"number"}]}},onValueChange:{defaultValue:null,description:"Event handler called when the value changes.",name:"onValueChange",required:!1,type:{name:"enum",value:[{value:"(value: number) => void"}]}},name:{defaultValue:null,description:"The name of the slider. Submitted with its owning form as part of a name/value pair.",name:"name",required:!1,type:{name:"enum",value:[{value:"string"}]}},min:{defaultValue:{value:"0"},description:"The minimum value for the slider.",name:"min",required:!1,type:{name:"enum",value:[{value:"number"}]}},max:{defaultValue:{value:"100"},description:"The maximum value for the slider.",name:"max",required:!1,type:{name:"enum",value:[{value:"number"}]}},step:{defaultValue:{value:"1"},description:"The slider stepping interval.",name:"step",required:!1,type:{name:"enum",value:[{value:"number"}]}},dataset:{defaultValue:null,description:"",name:"dataset",required:!1,type:{name:"enum",value:[{value:"Dataset"}]}},ref:{defaultValue:null,description:"Allows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n@see {@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}",name:"ref",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"(instance: HTMLSpanElement | null) => void"},{value:"RefObject<HTMLSpanElement>"}]}},key:{defaultValue:null,description:"",name:"key",required:!1,type:{name:"enum",value:[{value:"null"},{value:"string"},{value:"number"},{value:"bigint"}]}}}}}catch{}export{Ae as R,$ as S,ke as T,Ne as a,Be as b,L as f,k as s};

package/dist/assets/{Slider.stories-UCLuhto1.js → Slider.stories-CBV0fePJ.js}

@@ -1,4 +1,4 @@
-import{j as c,r as f}from"./iframe-DjYTJz7A.js";import{S as H}from"./Slider-CVM0huNa.js";import"./preload-helper-Dp1pzeXC.js";import"./componentNames-hc9KR2nX.js";import"./index-C_O4jEc0.js";const{action:C}=__STORYBOOK_MODULE_ACTIONS__,{expect:a,fn:R,userEvent:u,within:d}=__STORYBOOK_MODULE_TEST__,l=R(C("change")),T={title:"Components/Slider",component:H,decorators:[n=>c.jsx("div",{style:{padding:"32px",maxWidth:"400px"},children:c.jsx(n,{})})],args:{"aria-label":"Sample",onValueChange:l}},o={play:async({canvasElement:n,step:t})=>{const e=d(n).getByRole("slider");await t("Initial state",async()=>{a(e).toBeInTheDocument(),a(e).toHaveAttribute("aria-valuemin","0"),a(e).toHaveAttribute("aria-valuemax","100"),a(e).toHaveAttribute("aria-valuenow","0")}),await t("Move thumb via keyboard interactions",async()=>{e.focus(),await u.keyboard("{ArrowRight}"),a(e).toHaveAttribute("aria-valuenow","1"),a(l).toBeCalledWith(1)})}},i={args:{defaultValue:50},play:async({canvasElement:n,step:t})=>{const e=d(n).getByRole("slider");await t("Initial state",async()=>{a(e).toBeInTheDocument(),a(e).toHaveAttribute("aria-valuemin","0"),a(e).toHaveAttribute("aria-valuemax","100"),a(e).toHaveAttribute("aria-valuenow","50")}),await t("Move thumb via keyboard interactions",async()=>{e.focus(),await u.keyboard("{ArrowRight}"),a(e).toHaveAttribute("aria-valuenow","51"),a(l).toBeCalledWith(51)})}},s={render:function(t){const[r,e]=f.useState(50);return c.jsx(H,{...t,value:r,onValueChange:v=>{var p;e(v),(p=t.onValueChange)==null||p.call(t,v)}})},play:async({canvasElement:n,step:t})=>{const e=d(n).getByRole("slider");await t("Initial controlled state",async()=>{a(e).toBeInTheDocument(),a(e).toHaveAttribute("aria-valuenow","50")}),await t("Move thumb and verify value updates",async()=>{e.focus(),await u.keyboard("{ArrowRight}"),a(e).toHaveAttribute("aria-valuenow","51"),a(l).toBeCalledWith(51)})}};var m,y,h;o.parameters={...o.parameters,docs:{...(m=o.parameters)==null?void 0:m.docs,source:{originalSource:`{
+import{j as c,r as f}from"./iframe-B_74HtSc.js";import{S as H}from"./Slider-B8ndK7PX.js";import"./preload-helper-Dp1pzeXC.js";import"./componentNames-hc9KR2nX.js";import"./index-Cnv20V_M.js";const{action:C}=__STORYBOOK_MODULE_ACTIONS__,{expect:a,fn:R,userEvent:u,within:d}=__STORYBOOK_MODULE_TEST__,l=R(C("change")),T={title:"Components/Slider",component:H,decorators:[n=>c.jsx("div",{style:{padding:"32px",maxWidth:"400px"},children:c.jsx(n,{})})],args:{"aria-label":"Sample",onValueChange:l}},o={play:async({canvasElement:n,step:t})=>{const e=d(n).getByRole("slider");await t("Initial state",async()=>{a(e).toBeInTheDocument(),a(e).toHaveAttribute("aria-valuemin","0"),a(e).toHaveAttribute("aria-valuemax","100"),a(e).toHaveAttribute("aria-valuenow","0")}),await t("Move thumb via keyboard interactions",async()=>{e.focus(),await u.keyboard("{ArrowRight}"),a(e).toHaveAttribute("aria-valuenow","1"),a(l).toBeCalledWith(1)})}},i={args:{defaultValue:50},play:async({canvasElement:n,step:t})=>{const e=d(n).getByRole("slider");await t("Initial state",async()=>{a(e).toBeInTheDocument(),a(e).toHaveAttribute("aria-valuemin","0"),a(e).toHaveAttribute("aria-valuemax","100"),a(e).toHaveAttribute("aria-valuenow","50")}),await t("Move thumb via keyboard interactions",async()=>{e.focus(),await u.keyboard("{ArrowRight}"),a(e).toHaveAttribute("aria-valuenow","51"),a(l).toBeCalledWith(51)})}},s={render:function(t){const[r,e]=f.useState(50);return c.jsx(H,{...t,value:r,onValueChange:v=>{var p;e(v),(p=t.onValueChange)==null||p.call(t,v)}})},play:async({canvasElement:n,step:t})=>{const e=d(n).getByRole("slider");await t("Initial controlled state",async()=>{a(e).toBeInTheDocument(),a(e).toHaveAttribute("aria-valuenow","50")}),await t("Move thumb and verify value updates",async()=>{e.focus(),await u.keyboard("{ArrowRight}"),a(e).toHaveAttribute("aria-valuenow","51"),a(l).toBeCalledWith(51)})}};var m,y,h;o.parameters={...o.parameters,docs:{...(m=o.parameters)==null?void 0:m.docs,source:{originalSource:`{
   play: async ({
     canvasElement,
     step