@theroutingcompany/components 0.0.139-alpha.3 → 0.0.139-alpha.4

package/dist/trc-components.umd.js

@@ -2664,7 +2664,7 @@ const theme2 = createTheme({ palette: {
   &:hover {
     color: ${p.color_gray_6};
   }
-`;function fK(e){const{label:t,tooltipContent:n,placeholder:r,items:o,isLoading:a=!1,onSearch:i,onSelect:l,getItemKey:s,getItemLabel:u,renderItem:d,selectedItem:f,errorMessage:m,boldLabel:g=!0,inputValue:h,onInputChange:b,usePortal:v=!1,isValid:_=!0,required:y=!1,...x}=e;console.log("SearchableSelect received isValid:",_,"errorMessage:",m);const S=h!==void 0,[T,P]=c.useState(!1),[M,$]=c.useState(()=>!S&&f?u(f):""),[C,N]=c.useState(-1),[E,K]=c.useState({top:0,left:0,width:0}),I=S?h:M,k=S?W=>b==null?void 0:b(W):$,j=c.useRef(null),O=c.useRef(null),J=c.useRef(null),{labelProps:V,inputProps:q}=Xr({...x,inputElementType:"input",value:I,onChange:W=>{k(W),i(W),P(!0),N(-1),W===""&&l(null)}},j),{isFocusVisible:B,focusProps:U}=jo();D.useEffect(()=>{const W=ee=>{var _e,Tt;const fe=ee.target,le=(_e=J.current)==null?void 0:_e.contains(fe),ge=(Tt=O.current)==null?void 0:Tt.contains(fe);!le&&!ge&&P(!1)};return document.addEventListener("mousedown",W),()=>{document.removeEventListener("mousedown",W)}},[]);const H=W=>{if(!T&&W.key!=="Escape"&&W.key!=="Tab"){P(!0);return}switch(W.key){case"Tab":T&&(W.shiftKey?C<=0?(P(!1),N(-1)):(W.preventDefault(),N(ee=>ee-1)):(W.preventDefault(),N(ee=>ee<o.length-1?ee+1:0)));break;case"ArrowDown":W.preventDefault(),N(ee=>ee<o.length-1?ee+1:ee);break;case"ArrowUp":W.preventDefault(),N(ee=>ee>0?ee-1:-1);break;case"Enter":if(W.preventDefault(),C>=0&&C<o.length){const ee=o[C];ee!==void 0&&R(ee)}break;case"Escape":W.preventDefault(),P(!1),N(-1);break}},R=W=>{k(u(W)),P(!1),N(-1),l(W)},G=()=>{var W;k(""),i(""),P(!1),l(null),(W=j.current)==null||W.focus()},ne=()=>{(I||o.length>0)&&P(!0)},te=c.useRef(null);D.useLayoutEffect(()=>{if(!S){const W=f?s(f):null;if(W!==te.current)if(te.current=W,f){const ee=u(f);$(ee)}else $("")}},[f,u,s,S]),D.useEffect(()=>{if(v&&T&&J.current){const W=()=>{var fe;const ee=(fe=J.current)==null?void 0:fe.getBoundingClientRect();ee&&K({top:ee.bottom+4,left:ee.left,width:ee.width})};return W(),window.addEventListener("scroll",W,!0),window.addEventListener("resize",W),()=>{window.removeEventListener("scroll",W,!0),window.removeEventListener("resize",W)}}},[v,T]);const ie=w(lK,{ref:O,isOpen:T,usePortal:v,style:v?{top:`${E.top}px`,left:`${E.left}px`,width:`${E.width}px`}:void 0,children:a?w(cK,{children:"Loading..."}):o.length===0?w(uK,{children:I?"No results found":"Start typing to search"}):o.map((W,ee)=>w(sK,{isHighlighted:ee===C,onClick:()=>R(W),onMouseDown:fe=>fe.preventDefault(),onMouseEnter:()=>N(ee),type:"button",children:d?d(W):u(W)},s(W)))}),X=v&&T?ie:null;return Q(oK,{ref:J,children:[t&&Q(Re,{...V,mb:p.spacing_150,bold:g,children:[t,n&&w(Xe,{children:n})]}),Q(aK,{children:[w(iK,{...q,...U,ref:j,isFocused:B,isInvalid:!_||!!m,placeholder:a&&!I?"Loading...":r,onKeyDown:H,onFocus:ne,required:y}),I&&w(dK,{type:"button",onClick:G,onMouseDown:W=>W.preventDefault(),tabIndex:-1,"aria-label":"Clear",children:"×"})]}),v?w(ai,{children:X}):ie]})}const wS="Switch",[pK,iB]=Ke(wS),[gK,mK]=pK(wS),hK=c.forwardRef((e,t)=>{const{__scopeSwitch:n,name:r,checked:o,defaultChecked:a,required:i,disabled:l,value:s="on",onCheckedChange:u,...d}=e,[f,m]=c.useState(null),g=$e(t,y=>m(y)),h=c.useRef(!1),b=f?!!f.closest("form"):!0,[v=!1,_]=Ue({prop:o,defaultProp:a,onChange:u});return c.createElement(gK,{scope:n,checked:v,disabled:l},c.createElement(ce.button,L({type:"button",role:"switch","aria-checked":v,"aria-required":i,"data-state":ES(v),"data-disabled":l?"":void 0,disabled:l,value:s},d,{ref:g,onClick:oe(e.onClick,y=>{_(x=>!x),b&&(h.current=y.isPropagationStopped(),h.current||y.stopPropagation())})})),b&&c.createElement(yK,{control:f,bubbles:!h.current,name:r,value:s,checked:v,required:i,disabled:l,style:{transform:"translateX(-100%)"}}))}),bK="SwitchThumb",vK=c.forwardRef((e,t)=>{const{__scopeSwitch:n,...r}=e,o=mK(bK,n);return c.createElement(ce.span,L({"data-state":ES(o.checked),"data-disabled":o.disabled?"":void 0},r,{ref:t}))}),yK=e=>{const{control:t,checked:n,bubbles:r=!0,...o}=e,a=c.useRef(null),i=vw(n),l=Qu(t);return c.useEffect(()=>{const s=a.current,u=window.HTMLInputElement.prototype,f=Object.getOwnPropertyDescriptor(u,"checked").set;if(i!==n&&f){const m=new Event("click",{bubbles:r});f.call(s,n),s.dispatchEvent(m)}},[i,n,r]),c.createElement("input",L({type:"checkbox","aria-hidden":!0,defaultChecked:n},o,{tabIndex:-1,ref:a,style:{...e.style,...l,position:"absolute",pointerEvents:"none",opacity:0,margin:0}}))};function ES(e){return e?"checked":"unchecked"}const $K=hK,_K=vK;function xK(e){const t=Lt(),n=e??t;return{...zl(),disabled:n}}const wK=F.default($K)`
+`;function fK(e){const{label:t,tooltipContent:n,placeholder:r,items:o,isLoading:a=!1,onSearch:i,onSelect:l,getItemKey:s,getItemLabel:u,renderItem:d,selectedItem:f,errorMessage:m,boldLabel:g=!0,inputValue:h,onInputChange:b,usePortal:v=!1,isInvalid:_=!1,required:y=!1,...x}=e,S=h!==void 0,[T,P]=c.useState(!1),[M,$]=c.useState(()=>!S&&f?u(f):""),[C,N]=c.useState(-1),[E,K]=c.useState({top:0,left:0,width:0}),I=S?h:M,k=S?W=>b==null?void 0:b(W):$,j=c.useRef(null),O=c.useRef(null),J=c.useRef(null),{labelProps:V,inputProps:q}=Xr({...x,inputElementType:"input",value:I,onChange:W=>{k(W),i(W),P(!0),N(-1),W===""&&l(null)}},j),{isFocusVisible:B,focusProps:U}=jo();D.useEffect(()=>{const W=ee=>{var _e,Tt;const fe=ee.target,le=(_e=J.current)==null?void 0:_e.contains(fe),ge=(Tt=O.current)==null?void 0:Tt.contains(fe);!le&&!ge&&P(!1)};return document.addEventListener("mousedown",W),()=>{document.removeEventListener("mousedown",W)}},[]);const H=W=>{if(!T&&W.key!=="Escape"&&W.key!=="Tab"){P(!0);return}switch(W.key){case"Tab":T&&(W.shiftKey?C<=0?(P(!1),N(-1)):(W.preventDefault(),N(ee=>ee-1)):(W.preventDefault(),N(ee=>ee<o.length-1?ee+1:0)));break;case"ArrowDown":W.preventDefault(),N(ee=>ee<o.length-1?ee+1:ee);break;case"ArrowUp":W.preventDefault(),N(ee=>ee>0?ee-1:-1);break;case"Enter":if(W.preventDefault(),C>=0&&C<o.length){const ee=o[C];ee!==void 0&&R(ee)}break;case"Escape":W.preventDefault(),P(!1),N(-1);break}},R=W=>{k(u(W)),P(!1),N(-1),l(W)},G=()=>{var W;k(""),i(""),P(!1),l(null),(W=j.current)==null||W.focus()},ne=()=>{(I||o.length>0)&&P(!0)},te=c.useRef(null);D.useLayoutEffect(()=>{if(!S){const W=f?s(f):null;if(W!==te.current)if(te.current=W,f){const ee=u(f);$(ee)}else $("")}},[f,u,s,S]),D.useEffect(()=>{if(v&&T&&J.current){const W=()=>{var fe;const ee=(fe=J.current)==null?void 0:fe.getBoundingClientRect();ee&&K({top:ee.bottom+4,left:ee.left,width:ee.width})};return W(),window.addEventListener("scroll",W,!0),window.addEventListener("resize",W),()=>{window.removeEventListener("scroll",W,!0),window.removeEventListener("resize",W)}}},[v,T]);const ie=w(lK,{ref:O,isOpen:T,usePortal:v,style:v?{top:`${E.top}px`,left:`${E.left}px`,width:`${E.width}px`}:void 0,children:a?w(cK,{children:"Loading..."}):o.length===0?w(uK,{children:I?"No results found":"Start typing to search"}):o.map((W,ee)=>w(sK,{isHighlighted:ee===C,onClick:()=>R(W),onMouseDown:fe=>fe.preventDefault(),onMouseEnter:()=>N(ee),type:"button",children:d?d(W):u(W)},s(W)))}),X=v&&T?ie:null;return Q(oK,{ref:J,children:[t&&Q(Re,{...V,mb:p.spacing_150,bold:g,children:[t,n&&w(Xe,{children:n})]}),Q(aK,{children:[w(iK,{...q,...U,ref:j,isFocused:B,isInvalid:_||!!m,placeholder:a&&!I?"Loading...":r,onKeyDown:H,onFocus:ne,required:y}),I&&w(dK,{type:"button",onClick:G,onMouseDown:W=>W.preventDefault(),tabIndex:-1,"aria-label":"Clear",children:"×"})]}),v?w(ai,{children:X}):ie]})}const wS="Switch",[pK,iB]=Ke(wS),[gK,mK]=pK(wS),hK=c.forwardRef((e,t)=>{const{__scopeSwitch:n,name:r,checked:o,defaultChecked:a,required:i,disabled:l,value:s="on",onCheckedChange:u,...d}=e,[f,m]=c.useState(null),g=$e(t,y=>m(y)),h=c.useRef(!1),b=f?!!f.closest("form"):!0,[v=!1,_]=Ue({prop:o,defaultProp:a,onChange:u});return c.createElement(gK,{scope:n,checked:v,disabled:l},c.createElement(ce.button,L({type:"button",role:"switch","aria-checked":v,"aria-required":i,"data-state":ES(v),"data-disabled":l?"":void 0,disabled:l,value:s},d,{ref:g,onClick:oe(e.onClick,y=>{_(x=>!x),b&&(h.current=y.isPropagationStopped(),h.current||y.stopPropagation())})})),b&&c.createElement(yK,{control:f,bubbles:!h.current,name:r,value:s,checked:v,required:i,disabled:l,style:{transform:"translateX(-100%)"}}))}),bK="SwitchThumb",vK=c.forwardRef((e,t)=>{const{__scopeSwitch:n,...r}=e,o=mK(bK,n);return c.createElement(ce.span,L({"data-state":ES(o.checked),"data-disabled":o.disabled?"":void 0},r,{ref:t}))}),yK=e=>{const{control:t,checked:n,bubbles:r=!0,...o}=e,a=c.useRef(null),i=vw(n),l=Qu(t);return c.useEffect(()=>{const s=a.current,u=window.HTMLInputElement.prototype,f=Object.getOwnPropertyDescriptor(u,"checked").set;if(i!==n&&f){const m=new Event("click",{bubbles:r});f.call(s,n),s.dispatchEvent(m)}},[i,n,r]),c.createElement("input",L({type:"checkbox","aria-hidden":!0,defaultChecked:n},o,{tabIndex:-1,ref:a,style:{...e.style,...l,position:"absolute",pointerEvents:"none",opacity:0,margin:0}}))};function ES(e){return e?"checked":"unchecked"}const $K=hK,_K=vK;function xK(e){const t=Lt(),n=e??t;return{...zl(),disabled:n}}const wK=F.default($K)`
   all: unset;
   width: 40px;
   height: 24px;