https://mastodon.social/packs/form_fields-CqbxgB4s.js

1import{o as e}from"./rolldown-runtime-C0FnF6B9.js";import{n as t,t as n}from"./jsx-runtime-D3F0h15I.js";import{a as r,c as i}from"./react-intl-D77hBoiN.js";import{Et as a,Ht as o,Ot as s,Ut as c,_n as l,mn as u}from"./poll-Cyo3AGGB.js";import{qi as d}from"./render-BZ78Gn2E.js";import{i as f}from"./utils-Dv-7a-ja.js";import{t as p}from"./classnames-CfLRLWYq.js";import{t as m}from"./polymorphic-8XAI_M8V.js";import{a as h}from"./toggle_field-D5x7HXiV.js";import{r as g}from"./copy_button-Dp7avmR4.js";import{t as ee}from"./search-ChptxC0m.js";import{n as te,t as ne}from"./keyboard_arrow_up-B9LNvMdp.js";import{t as _}from"./react-textarea-autosize.browser.esm-o9pjGy_A.js";import{t as v}from"./emoji_picker_dropdown_container-BVvV1QWx.js";function y(e,t){if(!e)return!1;let n=window.getComputedStyle(e),r=document.scrollingElement||document.documentElement,i=/(auto|scroll)/.test(n.overflow+n.overflowX+n.overflowY);return e===r&&n.overflow!==`hidden`&&(i=!0),i&&t&&(i=e.scrollHeight!==e.clientHeight||e.scrollWidth!==e.clientWidth),i}function b(e,t){let n=e;for(y(n,t)&&(n=n.parentElement);n&&!y(n,t);)n=n.parentElement;return n||document.scrollingElement||document.documentElement}var x=e(p()),re={stack:`_comp_form_fields_form_stack__stack`},S=n(),C=m(({as:e=`div`,children:t,className:n,...r},i)=>(0,S.jsx)(e,{ref:i,...r,className:(0,x.default)(n,re.stack),children:t}));C.displayName=`FormStack`;var w=e(t()),T=(0,w.forwardRef)(({id:e,label:t,hint:n,required:r,status:i,wrapperClassName:a,...o},s)=>(0,S.jsx)(h,{label:t,hint:n,required:r,status:i,inputId:e,className:a,children:e=>(0,S.jsx)(E,{...o,...e,ref:s})}));T.displayName=`TextAreaField`;var E=(0,w.forwardRef)(({className:e,onKeyDown:t,autoSize:n,...r},i)=>{let a=(0,w.useCallback)(e=>{t?.(e),e.key===`Enter`&&(e.ctrlKey||e.metaKey)&&e.currentTarget.form?.requestSubmit()},[t]);return n?(0,S.jsx)(_,{...r,onKeyDown:a,className:(0,x.default)(e,s.input),ref:i}):(0,S.jsx)(`textarea`,{...r,onKeyDown:a,className:(0,x.default)(e,s.input),ref:i})});E.displayName=`TextArea`;var ie={checkbox:`_comp_form_fields_checkbox__checkbox`},D=(0,w.forwardRef)(({id:e,label:t,hint:n,status:r,required:i,wrapperClassName:a,...o},s)=>(0,S.jsx)(h,{label:t,hint:n,required:i,status:r,inputId:e,inputPlacement:`inline-start`,className:a,children:e=>(0,S.jsx)(O,{...o,...e,ref:s})}));D.displayName=`CheckboxField`;var O=(0,w.forwardRef)(({className:e,size:t,indeterminate:n,...r},i)=>{let a=(0,w.useRef)(null),o=(0,w.useCallback)(e=>{a.current=e,typeof i==`function`?i(e):i&&(i.current=e)},[i]);return(0,w.useEffect)(()=>{a.current&&(a.current.indeterminate=n||!1)},[n]),(0,S.jsx)(`input`,{...r,type:`checkbox`,className:ie.checkbox,style:t?{"--size":`${t}px`}:void 0,ref:o})});O.displayName=`Checkbox`;var k={wrapper:`_comp_form_fields_combobox__wrapper`,input:`_comp_form_fields_combobox__input`,menuButton:`_comp_form_fields_combobox__menuButton`,listBoxWrapper:`_comp_form_fields_combobox__listBoxWrapper`,listBoxWrapperPopover:`_comp_form_fields_combobox__listBoxWrapperPopover`,groupTitle:`_comp_form_fields_combobox__groupTitle`,menuItem:`_comp_form_fields_combobox__menuItem`,emptyMessage:`_comp_form_fields_combobox__emptyMessage`,groupEmptyMessage:`_comp_form_fields_combobox__groupEmptyMessage`,loadingIndicator:`_comp_form_fields_combobox__loadingIndicator`},ae=(0,w.createContext)(null);function A(){let e=(0,w.useContext)(ae);if(e===null)throw Error(`useComboboxItemProps must be used within a Combobox component`);return e}var j=({className:e,children:t})=>{let n=A();return(0,S.jsx)(`li`,{className:(0,x.default)(e,k.menuItem),...n,children:t})},oe=({className:e,children:t,...n})=>(0,S.jsx)(`li`,{...n,role:`presentation`,className:(0,x.default)(e,k.groupTitle),children:t}),M=(0,w.forwardRef)(({id:e,label:t,hint:n,status:r,required:i,wrapperClassName:a,...o},s)=>(0,S.jsx)(h,{label:t,hint:n,required:i,status:r,inputId:e,className:a,children:e=>(0,S.jsx)(N,{...o,...e,ref:s})}));M.displayName=`ComboboxField`;var N=(0,w.forwardRef)(({value:e,isLoading:t=!1,items:n,getItemId:r=e=>`id`in e?e.id??``:``,getIsItemDisabled:s,getIsItemSelected:c,getGroupEmptyMessage:l,disabled:d,renderGroupTitle:f,renderItem:p,onSelectItem:m,onFocus:h,onChange:g,onKeyDown:_,listBoxType:v=`popover`,openOnFocus:y=v===`in-place`||!1,closeOnSelect:b=v!==`in-place`,autoHighlightFirstItem:re=!0,suppressMenu:C=!1,icon:T=ee,className:E,...ie},D)=>{let O=i(),A=(0,w.useRef)(null),[j,M]=(0,w.useState)(null),[N,P]=(0,w.useState)(null),[F,I]=(0,w.useState)(!1),L=(0,w.useRef)(!1),R=!Array.isArray(n),z=(0,w.useMemo)(()=>R?Object.values(n).flat().filter(e=>!!e):n,[R,n]),[de,B]=(0,w.useState)(null),V=z[0],H=V?r(V):null,U=de??(re?H:null),W=R&&!!l&&Object.keys(n).some(e=>!!l(e)),G=le({value:e,isLoading:t,itemCount:z.length}),K=!!G&&e.length>0&&z.length===0,fe=!d&&!C&&(z.length>0||W||K),q=v===`in-place`||F&&fe,J=(0,w.useCallback)(()=>

1{I(!0),j?.focus()},[j]),Y=(0,w.useCallback)(()=>{I(!1)},[]);(0,w.useEffect)(()=>{if(U){let e=N?.querySelector(`[data-item-id='${U}']`);e&&ue(e)}},[U,N]);let pe=(0,w.useCallback)(e=>{y&&!L.current&&I(!0),h?.(e)},[h,y]),me=(0,w.useCallback)(e=>{g(e),B(null),I(!!e.target.value)},[g]),he=(0,w.useCallback)(e=>{let{itemId:t}=e.currentTarget.dataset;t&&B(t)},[B]),X=(0,w.useCallback)(e=>{let t=z.find(t=>t.id===e);t&&((s?.(t)??!1)||(m(t),b&&(Y(),L.current=!0,setTimeout(()=>{L.current=!1},50)))),j?.focus()},[z,j,s,m,b,Y]),ge=(0,w.useCallback)(e=>{let{itemId:t}=e.currentTarget.dataset;X(t??null)},[X]),Z=(0,w.useCallback)(()=>{X(U)},[U,X]),Q=(0,w.useCallback)(e=>{if(z.length===0)return;let t=z.findIndex(e=>r(e)===U);if(t===-1){if(e>0){let e=z.at(0);B(e?r(e):null)}else{let e=z.at(-1);B(e?r(e):null)}}else{let n=t+e;n>=z.length?n=0:n<0&&(n=z.length-1);let i=z[n];B(i?r(i):null)}},[r,B,U,z]),_e=(0,w.useCallback)(e=>{_?.(e),e.key===`ArrowUp`&&(e.preventDefault(),q?Q(-1):J()),e.key===`ArrowDown`&&(e.preventDefault(),q?Q(1):J()),e.key===`Tab`&&q&&(Z(),Y()),e.key===`Enter`&&q&&U&&(e.preventDefault(),Z()),e.key===`Escape`&&q&&(e.preventDefault(),Y())},[Y,q,Q,_,J,U,Z]),ve=e=>e.map(e=>{let t=r(e),n=s?.(e)??!1,i=t===U,a=c?c(e):i;return(0,S.jsx)(ae.Provider,{value:{role:`option`,"data-highlighted":i,"aria-selected":a,"aria-disabled":n,"data-item-id":t,onMouseEnter:he,onClick:ge},children:p(e,{isSelected:a,isDisabled:n})},t)}),ye=o(D,M),$=`${(0,w.useId)()}-list`;return(0,S.jsxs)(`div`,{className:k.wrapper,ref:A,children:[(0,S.jsx)(a,{role:`combobox`,...ie,disabled:d,"aria-controls":$,"aria-expanded":v===`popover`?q:void 0,"aria-haspopup":v===`popover`?`listbox`:void 0,"aria-activedescendant":q&&U?U:void 0,"aria-autocomplete":`list`,autoComplete:`off`,spellCheck:`false`,value:e,onFocus:pe,onChange:me,onKeyDown:_e,icon:T??void 0,className:(0,x.default)(k.input,E),ref:ye}),fe&&v===`popover`&&(0,S.jsx)(u,{title:q?O.formatMessage({id:`combobox.close_results`,defaultMessage:`Close results`}):O.formatMessage({id:`combobox.open_results`,defaultMessage:`Open results`}),className:k.menuButton,icon:`results`,iconComponent:q?ne:te,onClick:q?Y:J}),(0,S.jsx)(`span`,{role:`status`,"aria-live":`polite`,className:`sr-only`,children:q&&G}),(0,S.jsx)(se,{renderAsPopover:v===`popover`,isMenuOpen:q,onClose:Y,ref:P,popoverElement:N,popoverReference:j,children:(0,S.jsx)(ce,{showStatus:K&&!W,isLoading:t,status:G,children:R?(0,S.jsx)(`div`,{role:`listbox`,id:$,tabIndex:-1,children:Object.keys(n).map(e=>{let t=n[e],r=`${$}-group-${e}`,i=f?.(e,r),a=i!==null,o=!!t?.length,s=l?.(e);return!o&&!s?null:(0,S.jsxs)(!o&&s?`div`:`ul`,{role:`group`,"aria-labelledby":a?r:void 0,children:[a&&(i??(0,S.jsx)(oe,{id:r,children:e})),o?ve(t):(0,S.jsx)(`div`,{className:k.groupEmptyMessage,children:s})]},e)})}):(0,S.jsx)(`ul`,{role:`listbox`,id:$,tabIndex:-1,children:ve(n)})})})]})});N.displayName=`Combobox`;var se=({renderAsPopover:e,isMenuOpen:t,popoverElement:n,popoverReference:r,ref:i,onClose:a,children:o})=>e?(0,S.jsx)(c,{matchReferenceWidth:!0,isOpen:t,onClose:a,offset:1,placement:`bottom-start`,strategy:`absolute`,popoverElement:n,reference:r,container:null,children:({props:e,placement:t})=>(0,S.jsx)(`div`,{...e,ref:i,className:(0,x.default)(k.listBoxWrapper,k.listBoxWrapperPopover,t),children:o})}):(0,S.jsx)(`div`,{ref:i,className:k.listBoxWrapper,children:o}),ce=({showStatus:e,status:t,isLoading:n,children:r})=>e?(0,S.jsxs)(`span`,{className:k.emptyMessage,children:[n&&(0,S.jsx)(`span`,{className:k.loadingIndicator,children:(0,S.jsx)(l,{role:`none`})}),t]}):r;function le({itemCount:e,value:t,isLoading:n}){let r=i();return n?r.formatMessage({id:`combobox.loading`,defaultMessage:`Loading`}):t.length&&!e?r.formatMessage({id:`combobox.no_results_found`,defaultMessage:`No results for this search`}):e>0?r.formatMessage({id:`combobox.results_available`,defaultMessage:`{count,plural,one{# suggestion available. Use up and down arrow keys to navigate. Press Enter key to select.} other{# suggestions available. Use up and down arrow keys to navigate. Press Enter key to select.}}`},{count:e}):``}var P=6;function ue(e){let t=b(e);

1if(!(t instanceof HTMLElement))return;let n=e.offsetTop,r=n+e.offsetHeight;n<t.scrollTop?t.scrollTop=n-P:r>t.scrollTop+t.offsetHeight&&(t.scrollTop=r-t.offsetHeight+P)}var F={wrapper:`_comp_form_fields_copy_link_field__wrapper`,input:`_comp_form_fields_copy_link_field__input`,copyButton:`_comp_form_fields_copy_link_field__copyButton`},I=(0,w.forwardRef)(({id:e,label:t,hint:n,status:r,value:o,required:s,className:c,wrapperClassName:l,...u},d)=>{let f=i(),p=(0,w.useRef)(null),m=(0,w.useCallback)(()=>{p.current?.select()},[]),ee=(0,w.useCallback)(e=>{p.current=e,typeof d==`function`?d(e):d&&(d.current=e)},[d]);return(0,S.jsx)(h,{label:t,hint:n,required:s,status:r,inputId:e,className:l,children:e=>(0,S.jsxs)(`div`,{className:F.wrapper,children:[(0,S.jsx)(a,{readOnly:!0,...u,...e,ref:ee,value:o,onFocus:m,className:(0,x.default)(c,F.input)}),(0,S.jsx)(g,{value:o,title:f.formatMessage({id:`copy_icon_button.copy_this_text`,defaultMessage:`Copy link to clipboard`}),className:F.copyButton,"aria-describedby":e.id})]})})});I.displayName=`CopyLinkField`;var L=d(),R={counter:`_comp_character_counter__counter`,counterError:`_comp_character_counter__counterError`},z=m(({currentString:e,maxLength:t,as:n=`span`,recommended:i=!1,className:a,...o},s)=>{let c=(0,L.length)(e);return(0,S.jsx)(n,{...o,ref:s,className:(0,x.default)(a,R.counter,c>t&&!i&&R.counterError),children:i?(0,S.jsx)(r,{id:`character_counter.recommended`,defaultMessage:`{currentLength}/{maxLength} recommended characters`,values:{currentLength:c,maxLength:t}}):(0,S.jsx)(r,{id:`character_counter.required`,defaultMessage:`{currentLength}/{maxLength} characters`,values:{currentLength:c,maxLength:t}})})});z.displayName=`CharCounter`;var de=({onPick:e,disabled:t})=>{let n=(0,w.useCallback)(n=>{t||typeof n==`object`&&n&&(`native`in n&&typeof n.native==`string`?e(n.native):`shortcode`in n&&typeof n.shortcode==`string`&&e(`:${n.shortcode}:`))},[t,e]);return(0,S.jsx)(v,{onPickEmoji:n,disabled:t})},B={fieldWrapper:`_comp_form_fields_emoji_text_field__fieldWrapper`},V=({onChange:e,value:t,label:n,hint:r,status:i,maxLength:o,counterMax:s=o,recommended:c,disabled:l,...u})=>{let d=(0,w.useRef)(null);return(0,S.jsx)(U,{label:n,hint:r,status:i,counterMax:s,recommended:c,disabled:l,inputRef:d,value:t,onChange:e,children:e=>(0,S.jsx)(a,{...e,...u,maxLength:o,value:t,ref:d})})},H=({onChange:e,value:t,label:n,maxLength:r,counterMax:i=r,recommended:a,disabled:o,hint:s,status:c,...l})=>{let u=(0,w.useRef)(null);return(0,S.jsx)(U,{label:n,hint:s,status:c,counterMax:i,recommended:a,disabled:o,inputRef:u,value:t,onChange:e,children:e=>(0,S.jsx)(E,{...l,...e,maxLength:r,value:t,ref:u})})},U=({value:e,onChange:t,children:n,disabled:r,inputRef:i,counterMax:a,recommended:o=!1,...s})=>{let c=(0,w.useId)(),l=(0,w.useCallback)(n=>{if(!e){t?.(``);return}let r=i.current?.selectionStart??e.length,a=f(e,n,r);t?.(a)},[i,e,t]),u=(0,w.useCallback)(e=>{t?.(e.target.value)},[t]);return(0,S.jsx)(h,{className:B.fieldWrapper,describedById:c,...s,children:t=>(0,S.jsxs)(S.Fragment,{children:[n({...t,onChange:u}),(0,S.jsx)(de,{onPick:l,disabled:r}),a&&(0,S.jsx)(z,{currentString:e??``,maxLength:a,recommended:o,id:c})]})})},W={wrapper:`_comp_form_fields_select__wrapper`,select:`_comp_form_fields_select__select`},G=(0,w.forwardRef)(({id:e,label:t,hint:n,required:r,status:i,inputPlacement:a,children:o,wrapperClassName:s,...c},l)=>(0,S.jsx)(h,{label:t,hint:n,required:r,status:i,inputId:e,inputPlacement:a,className:s,children:e=>(0,S.jsx)(K,{...c,...e,ref:l,children:o})}));G.displayName=`SelectField`;var K=(0,w.forwardRef)(({className:e,size:t,...n},r)=>(0,S.jsx)(`div`,{className:W.wrapper,children:(0,S.jsx)(`select`,{...n,className:(0,x.default)(e,W.select),ref:r})}));K.displayName=`Select`;export{z as a,M as c,D as d,E as f,V as i,j as l,C as m,G as n,I as o,T as p,H as r,N as s,K as t,A as u};
2//# sourceMappingURL=form_fields-CqbxgB4s.js.map