@webority/ui-react 0.120.1 → 0.122.0

package/dist/components/AppImagePicker.js

@@ -1 +1 @@
-import{splitMarkerProps as e}from"../lib/wuiMarker.js";import t from"./warnInvalidValue.js";import n from"./warnUnknownProps.js";import ee from"./withTooltip.js";import r from"./AppIcon.js";import te from"./AppAlert.js";import i from"./AppButton.js";import ne from"../lib/FieldMessage.js";import re from"./AppRequiredMark.js";import ie from"./AppModal.js";import ae from"../lib/useFileDrop.js";import{AVATAR_ACCEPT as oe,AVATAR_MAX_SIZE_MB as a,AVATAR_OUTPUT_SIZE as se,AVATAR_OUTPUT_TYPE as o,AVATAR_PREVIEW_SIZES as ce,AVATAR_TEXT as s,DEFAULT_IMAGE_ACCEPT as c,DEFAULT_MAX_SIZE_MB as l,avatarUnreadableMessage as u,validateFile as le}from"@webority/ui-elements/helpers";import{useCallback as ue,useEffect as de,useId as fe,useRef as d,useState as f}from"react";import{Fragment as pe,jsx as p,jsxs as m}from"react/jsx-runtime";import"@webority/ui-elements/elements/image-crop";var me=[`logo`,`avatar`],he=[`overlay`,`buttons`],ge=[`stacked`,`inline`,`profile`],_e=[`initials`,`avatar`],ve=[`circle`,`rounded`,`square`],ye=[`keep`,`image/webp`],be=ce.join(` `),xe={logo:{controls:`overlay`,accept:c,maxSizeMb:l,crop:void 0,rotatable:!1,previews:!1,camera:!1,outputSize:void 0,outputType:`keep`,variant:`initials`,sizes:{sm:72,md:120,lg:160}},avatar:{controls:`buttons`,accept:oe,maxSizeMb:a,crop:1,rotatable:!0,previews:!0,camera:!0,outputSize:se,outputType:o,variant:`avatar`,sizes:{sm:64,md:96,lg:128}}},Se=`That image could not be cropped. Choose another one.`,Ce=`That image could not be opened. Choose another one.`,we={dialogSize:`lg`,dialogTitle:`Crop photo`,dialogSubtitle:`Drag the frame and zoom to choose what to keep.`,save:`Apply`,cancel:`Cancel`,cropFailed:Se,unreadable:()=>Ce},Te={dialogSize:void 0,dialogTitle:s.dialogTitle,dialogSubtitle:s.dialogSubtitle,save:s.save,cancel:s.cancel,cropFailed:s.cropFailed,unreadable:u};function Ee(oe){let{marker:a,props:se}=e(`AppImagePicker`,oe),{kind:o=`logo`,controls:ce,value:c,fallback:l,variant:u,name:Se,onPick:Ce,onRemove:Ee,removeName:h,loading:g=!1,disabled:De=!1,accept:Oe,maxSizeMb:ke,shape:_=`circle`,size:v=`md`,crop:Ae,rotatable:je,previews:Me,camera:Ne,outputSize:Pe,outputType:Fe,layout:y=`stacked`,title:Ie,subtitle:Le,overlayIcon:Re=`image`,overlayLabel:ze=`Update photo`,removeLabel:b=`Remove photo`,ariaLabel:Be,label:Ve,hint:x,error:He,required:Ue=!1,className:We=``,fieldClassName:S=``,style:C,...w}=se;n(`AppImagePicker`,w),t(`AppImagePicker`,`kind`,o,me),t(`AppImagePicker`,`controls`,ce,he),t(`AppImagePicker`,`variant`,u,_e),t(`AppImagePicker`,`layout`,y,ge),t(`AppImagePicker`,`shape`,_,ve),t(`AppImagePicker`,`outputType`,Fe,ye);let T=xe[o]??xe.logo,E=o===`avatar`?Te:we,D=T.sizes;t(`AppImagePicker`,`size`,typeof v==`string`?v:null,Object.keys(D));let Ge=(ce??T.controls)===`overlay`,Ke=u??T.variant,O=Oe??T.accept,k=ke??T.maxSizeMb,A=Pe??T.outputSize,qe=Fe??T.outputType,Je=je??T.rotatable,Ye=Me??T.previews,Xe=Ne??T.camera,j=Ae??T.crop,M=j===`free`?null:typeof j==`number`&&Number.isFinite(j)&&j>0?j:void 0;j!=null&&M===void 0&&t(`AppImagePicker`,`crop`,String(j),[`free`,`a positive number`]);let Ze=M!==void 0&&A===void 0,N=d(null),Qe=d(null),P=d(null),F=fe(),[I,L]=f(null),[$e,R]=f(!1),[et,z]=f(!1),[tt,B]=f(``),[V,H]=f(null),[U,nt]=f(!1),[W,G]=f(`loading`),[rt,K]=f(``),it=ue(e=>{if(P.current=e,!e)return;let t=()=>{G(`ready`),e.querySelector(`.wui-crop-stage`)?.focus()},n=()=>G(`error`);return e.addEventListener(`load`,t),e.addEventListener(`error`,n),()=>{e.removeEventListener(`load`,t),e.removeEventListener(`error`,n),P.current=null}},[]);de(()=>()=>V&&URL.revokeObjectURL(V.url),[V]),de(()=>()=>I&&URL.revokeObjectURL(I),[I]);let[at,ot]=f(c);c!==at&&(ot(c),L(null),R(!1),z(!1));let q=g||De,J=$e?null:I||(c&&!et?c:null),st=!!J,Y=He||tt,X=x&&!Y?`${F}-hint`:void 0,Z=Y?`${F}-error`:void 0,ct=Z||X,lt=!q&&st&&(!!I||!!Ee||!!h),ut=st?s.change:s.choose,dt=typeof v==`number`?v:D[v]??D.md,ft=()=>{q||N.current?.click()},pt=()=>{q||Qe.current?.click()},mt=e=>{if(Se&&N.current&&typeof DataTransfer==`function`){let t=new DataTransfer;t.items.add(e),N.current.files=t.files}R(!1),z(!1),L(URL.createObjectURL(e)),Ce(e)},ht=e=>{let t=M!==void 0&&e.type!==`image/svg+xml`,n=le(e,{accept:O,maxSizeMb:t&&Ze?0:k});if(n){B(n);return}if(B(``),t){G(`loading`),K(``),H({file:e,url:URL.createObjectURL(e)});return}mt(e)},{dragOver:gt,dropProps:_t}=ae({accept:O,maxSizeMb:Ze?0:k,disabled:q,onFiles:e=>ht(e[0]),onReject:({message:e})=>B(e)}),vt=e=>{let t=qe===`keep`?e.type:qe;return A===void 0?{name:e.name,type:t,maxBytes:k>0?k*1024*1024:0}:{name:e.name||`photo`,type:t,size:A}},yt=async()=>{let{file:e}=V;nt(!0),K(``);let t=null;try{t=await P.current?.toFile(vt(e))}catch{t=null}if(nt(!1),!t){K(E.cropFailed);return}if(H(null),Ze){let e=le(t,{accept:O,maxSizeMb:k});e?B(e):mt(t);return}mt(t)},bt=()=>{U||H(null)},xt=e=>{let t=e.target.files?.[0];e.target.value=``,t&&ht(t)},St=()=>{L(null),R(!0),B(``),N.current&&(N.current.value=``),Ee?.()},Q=M!==void 0&&m(ie,{open:!!V,title:E.dialogTitle,subtitle:E.dialogSubtitle,size:E.dialogSize,staticBackdrop:!0,dismissible:!U,onClose:bt,footer:m(pe,{children:[p(i,{type:`button`,variant:`secondary`,disabled:U,onClick:bt,children:E.cancel}),p(i,{type:`button`,variant:`primary`,loading:U,disabled:W!==`ready`,onClick:yt,children:E.save})]}),children:[W===`error`&&V&&p(te,{tone:`danger`,children:E.unreadable(V.file)}),rt&&p(te,{tone:`danger`,children:rt}),V&&W!==`error`&&p(`wui-image-crop`,{ref:it,src:V.url,aspect:M??`free`,round:M===1&&_===`circle`,rotatable:Je,previews:Ye?be:void 0})]}),Ct=h&&p(`input`,{type:`hidden`,name:h,value:`true`,disabled:!$e}),$=Ve&&m(`label`,{className:`label`,htmlFor:F,children:[Ve,Ue&&p(re,{})]}),wt=p(`input`,{id:F,ref:N,type:`file`,name:Se,hidden:!0,accept:O,disabled:q,onChange:xt});if(!Ge){let e=dt,t=Xe&&m(`button`,{type:`button`,className:`btn btn-secondary btn-sm wui-image-picker-buttons-camera`,disabled:q,onClick:pt,children:[p(r,{name:`camera`,size:16}),s.camera]});return m(`div`,{...a,className:`field wui-image-picker-field${S?` ${S}`:``}`,children:[$,m(`div`,{className:`wui-image-picker-buttons${gt?` is-dragging`:``}${We?` ${We}`:``}`,style:{"--wui-avatar-size":`${e}px`,...C},..._t,children:[m(`button`,{type:`button`,className:`wui-image-picker-buttons-face`,tabIndex:-1,"aria-label":Be??ut,"aria-describedby":ct,"aria-busy":g||void 0,disabled:q,onClick:ft,...w,children:[J?p(`img`,{className:`wui-image-picker-buttons-img`,src:J,alt:``,onError:()=>z(!0)}):p(`span`,{className:`wui-image-picker-buttons-placeholder`,"aria-hidden":`true`,children:l||p(r,{name:`user`,size:Math.round(e*.5)})}),p(`span`,{className:`wui-image-picker-buttons-badge`,"aria-hidden":`true`,children:g?p(r,{name:`refresh-cw`,size:14,className:`wui-spin`}):p(r,{name:`camera`,size:14})})]}),m(`div`,{className:`wui-image-picker-buttons-actions`,children:[p(i,{variant:`secondary`,size:`sm`,disabled:q,"aria-describedby":ct,onClick:ft,children:ut}),t,p(i,{variant:`secondary-danger`,size:`sm`,"data-wui-image-picker-remove":!0,hidden:!lt,onClick:St,children:b})]}),wt,Xe&&p(`input`,{ref:Qe,type:`file`,hidden:!0,accept:`image/*`,capture:`user`,disabled:q,onChange:xt}),Ct]}),p(ne,{error:Y,hint:x,errorId:Z,hintId:X}),Q]})}let Tt=dt,Et=Math.max(14,Math.round(Tt*.18)),Dt=Math.round(Tt*.5),Ot=`wui-image-picker${Ke===`avatar`?` wui-image-picker-avatar`:``}${_===`rounded`?` wui-image-picker-rounded`:_===`square`?` wui-image-picker-square`:``}${gt?` is-dragging`:``}`,kt=y===`inline`,At=y===`profile`,jt=[`field`,`wui-image-picker-field`,kt&&`wui-image-picker-field-inline`,At&&`wui-image-picker-field-profile`,We,S].filter(Boolean).join(` `),Mt=m(`div`,{className:`wui-image-picker-shell`,style:{"--wui-logo-size":`${Tt}px`},children:[p(`button`,{type:`button`,className:Ot,onClick:ft,disabled:q,"aria-busy":g||void 0,"aria-label":Be??`Upload photo`,"aria-describedby":Z||X,..._t,...w,children:m(`span`,{className:`wui-image-picker-ring`,"data-overlay-label":ze,children:[J?p(`img`,{className:`wui-image-picker-img`,src:J,alt:``,onError:()=>z(!0)}):p(`span`,{className:`wui-image-picker-logo`,children:l||Ke===`avatar`&&p(r,{name:`user`,size:Dt})}),g?p(`span`,{className:`wui-image-picker-overlay is-loading`,"aria-hidden":`true`,children:p(r,{name:`refresh-cw`,size:Et,className:`wui-spin`})}):!De&&m(`span`,{className:`wui-image-picker-overlay`,children:[p(r,{name:Re,size:Et}),p(`span`,{children:ze})]})]})}),ee(p(`button`,{type:`button`,className:`wui-image-picker-remove`,hidden:!lt,"aria-label":b,"data-wui-image-picker-remove":!0,onClick:St,children:p(r,{name:`x`,size:14})}),lt?b:null),wt,Ct]}),Nt=x&&!Y?p(`div`,{className:`wui-image-picker-hint`,id:X,children:x}):null,Pt=Y?p(ne,{error:Y,errorId:Z}):null,Ft=m(`div`,{className:`wui-image-picker-meta`,children:[Ie&&p(`div`,{className:`wui-image-picker-title`,children:Ie}),Le&&p(`div`,{className:`wui-image-picker-subtitle`,children:Le}),Nt,Pt]});return kt?m(`div`,{...a,className:jt,style:C,children:[$,m(`div`,{className:`wui-image-picker-row`,children:[Mt,Ft]}),Q]}):At?m(`div`,{...a,className:jt,style:C,children:[$,Mt,Ft,Q]}):m(`div`,{...a,className:jt,style:C,children:[$,Mt,Nt,Pt,Q]})}export{Ee as default};
+import{splitMarkerProps as e}from"../lib/wuiMarker.js";import t from"./warnInvalidValue.js";import n from"./warnUnknownProps.js";import ee from"./withTooltip.js";import r from"./AppIcon.js";import te from"./AppAlert.js";import i from"./AppButton.js";import ne from"../lib/FieldMessage.js";import re from"./AppRequiredMark.js";import ie from"./AppModal.js";import ae from"../lib/useFileDrop.js";import{AVATAR_ACCEPT as oe,AVATAR_MAX_SIZE_MB as a,AVATAR_OUTPUT_SIZE as se,AVATAR_OUTPUT_TYPE as o,AVATAR_PREVIEW_SIZES as s,AVATAR_TEXT as c,DEFAULT_IMAGE_ACCEPT as l,DEFAULT_MAX_SIZE_MB as u,avatarUnreadableMessage as d,validateFile as ce}from"@webority/ui-elements/helpers";import{useCallback as le,useEffect as ue,useId as de,useRef as fe,useState as f}from"react";import{Fragment as pe,jsx as p,jsxs as m}from"react/jsx-runtime";import"@webority/ui-elements/elements/image-crop";var me=[`logo`,`avatar`],he=[`overlay`,`buttons`],ge=[`stacked`,`inline`,`profile`],_e=[`initials`,`avatar`],ve=[`circle`,`rounded`,`square`],ye=[`keep`,`image/webp`],be=s.join(` `),xe={logo:{controls:`overlay`,accept:l,maxSizeMb:u,crop:void 0,rotatable:!1,previews:!1,camera:!1,outputSize:void 0,outputType:`keep`,variant:`initials`,sizes:{sm:72,md:120,lg:160}},avatar:{controls:`buttons`,accept:oe,maxSizeMb:a,crop:1,rotatable:!0,previews:!0,camera:!0,outputSize:se,outputType:o,variant:`avatar`,sizes:{sm:64,md:96,lg:128}}},Se=`That image could not be cropped. Choose another one.`,Ce=`That image could not be opened. Choose another one.`,we={dialogSize:`lg`,dialogTitle:`Crop photo`,dialogSubtitle:`Drag the frame and zoom to choose what to keep.`,save:`Apply`,cancel:`Cancel`,cropFailed:Se,unreadable:()=>Ce},Te={dialogSize:void 0,dialogTitle:c.dialogTitle,dialogSubtitle:c.dialogSubtitle,save:c.save,cancel:c.cancel,cropFailed:c.cropFailed,unreadable:d};function h(oe){let{marker:a,props:se}=e(`AppImagePicker`,oe),{kind:o=`logo`,controls:s,value:l,fallback:u,variant:d,name:Se,onPick:Ce,onRemove:h,removeName:g,loading:_=!1,disabled:Ee=!1,accept:De,maxSizeMb:Oe,shape:v=`circle`,size:y=`md`,crop:ke,rotatable:Ae,previews:je,camera:Me,outputSize:Ne,outputType:Pe,layout:b=`stacked`,title:Fe,subtitle:Ie,overlayIcon:Le=`image`,overlayLabel:Re=`Update photo`,removeLabel:x=`Remove photo`,ariaLabel:ze,label:Be,hint:S,error:Ve,required:He=!1,optional:Ue=!1,className:C=``,fieldClassName:w=``,style:T,...E}=se;n(`AppImagePicker`,E),t(`AppImagePicker`,`kind`,o,me),t(`AppImagePicker`,`controls`,s,he),t(`AppImagePicker`,`variant`,d,_e),t(`AppImagePicker`,`layout`,b,ge),t(`AppImagePicker`,`shape`,v,ve),t(`AppImagePicker`,`outputType`,Pe,ye);let D=xe[o]??xe.logo,O=o===`avatar`?Te:we,k=D.sizes;t(`AppImagePicker`,`size`,typeof y==`string`?y:null,Object.keys(k));let We=(s??D.controls)===`overlay`,Ge=d??D.variant,A=De??D.accept,j=Oe??D.maxSizeMb,M=Ne??D.outputSize,Ke=Pe??D.outputType,qe=Ae??D.rotatable,Je=je??D.previews,Ye=Me??D.camera,N=ke??D.crop,P=N===`free`?null:typeof N==`number`&&Number.isFinite(N)&&N>0?N:void 0;N!=null&&P===void 0&&t(`AppImagePicker`,`crop`,String(N),[`free`,`a positive number`]);let F=P!==void 0&&M===void 0,I=fe(null),Xe=fe(null),L=fe(null),R=de(),[z,B]=f(null),[Ze,V]=f(!1),[Qe,H]=f(!1),[$e,U]=f(``),[W,et]=f(null),[G,tt]=f(!1),[nt,rt]=f(`loading`),[it,at]=f(``),ot=le(e=>{if(L.current=e,!e)return;let t=()=>{rt(`ready`),e.querySelector(`.wui-crop-stage`)?.focus()},n=()=>rt(`error`);return e.addEventListener(`load`,t),e.addEventListener(`error`,n),()=>{e.removeEventListener(`load`,t),e.removeEventListener(`error`,n),L.current=null}},[]);ue(()=>()=>W&&URL.revokeObjectURL(W.url),[W]),ue(()=>()=>z&&URL.revokeObjectURL(z),[z]);let[st,ct]=f(l);l!==st&&(ct(l),B(null),V(!1),H(!1));let K=_||Ee,q=Ze?null:z||(l&&!Qe?l:null),lt=!!q,J=Ve||$e,Y=S&&!J?`${R}-hint`:void 0,X=J?`${R}-error`:void 0,ut=X||Y,dt=!K&&lt&&(!!z||!!h||!!g),ft=lt?c.change:c.choose,pt=typeof y==`number`?y:k[y]??k.md,mt=()=>{K||I.current?.click()},ht=()=>{K||Xe.current?.click()},gt=e=>{if(Se&&I.current&&typeof DataTransfer==`function`){let t=new DataTransfer;t.items.add(e),I.current.files=t.files}V(!1),H(!1),B(URL.createObjectURL(e)),Ce(e)},_t=e=>{let t=P!==void 0&&e.type!==`image/svg+xml`,n=ce(e,{accept:A,maxSizeMb:t&&F?0:j});if(n){U(n);return}if(U(``),t){rt(`loading`),at(``),et({file:e,url:URL.createObjectURL(e)});return}gt(e)},{dragOver:vt,dropProps:yt}=ae({accept:A,maxSizeMb:F?0:j,disabled:K,onFiles:e=>_t(e[0]),onReject:({message:e})=>U(e)}),bt=e=>{let t=Ke===`keep`?e.type:Ke;return M===void 0?{name:e.name,type:t,maxBytes:j>0?j*1024*1024:0}:{name:e.name||`photo`,type:t,size:M}},xt=async()=>{let{file:e}=W;tt(!0),at(``);let t=null;try{t=await L.current?.toFile(bt(e))}catch{t=null}if(tt(!1),!t){at(O.cropFailed);return}if(et(null),F){let e=ce(t,{accept:A,maxSizeMb:j});e?U(e):gt(t);return}gt(t)},St=()=>{G||et(null)},Ct=e=>{let t=e.target.files?.[0];e.target.value=``,t&&_t(t)},wt=()=>{B(null),V(!0),U(``),I.current&&(I.current.value=``),h?.()},Z=P!==void 0&&m(ie,{open:!!W,title:O.dialogTitle,subtitle:O.dialogSubtitle,size:O.dialogSize,staticBackdrop:!0,dismissible:!G,onClose:St,footer:m(pe,{children:[p(i,{type:`button`,variant:`secondary`,disabled:G,onClick:St,children:O.cancel}),p(i,{type:`button`,variant:`primary`,loading:G,disabled:nt!==`ready`,onClick:xt,children:O.save})]}),children:[nt===`error`&&W&&p(te,{tone:`danger`,children:O.unreadable(W.file)}),it&&p(te,{tone:`danger`,children:it}),W&&nt!==`error`&&p(`wui-image-crop`,{ref:ot,src:W.url,aspect:P??`free`,round:P===1&&v===`circle`,rotatable:qe,previews:Je?be:void 0})]}),Tt=g&&p(`input`,{type:`hidden`,name:g,value:`true`,disabled:!Ze}),Q=Be&&m(`label`,{className:`label`,htmlFor:R,children:[Be,Ue&&!He&&p(`span`,{className:`label-optional`,children:` (optional)`}),He&&p(re,{})]}),Et=p(`input`,{id:R,ref:I,type:`file`,name:Se,hidden:!0,accept:A,disabled:K,onChange:Ct});if(!We){let e=pt,t=Ye&&m(`button`,{type:`button`,className:`btn btn-secondary btn-sm wui-image-picker-buttons-camera`,disabled:K,onClick:ht,children:[p(r,{name:`camera`,size:16}),c.camera]});return m(`div`,{...a,className:`field wui-image-picker-field${w?` ${w}`:``}`,children:[Q,m(`div`,{className:`wui-image-picker-buttons${vt?` is-dragging`:``}${C?` ${C}`:``}`,style:{"--wui-avatar-size":`${e}px`,...T},...yt,children:[m(`button`,{type:`button`,className:`wui-image-picker-buttons-face`,tabIndex:-1,"aria-label":ze??ft,"aria-describedby":ut,"aria-busy":_||void 0,disabled:K,onClick:mt,...E,children:[q?p(`img`,{className:`wui-image-picker-buttons-img`,src:q,alt:``,onError:()=>H(!0)}):p(`span`,{className:`wui-image-picker-buttons-placeholder`,"aria-hidden":`true`,children:u||p(r,{name:`user`,size:Math.round(e*.5)})}),p(`span`,{className:`wui-image-picker-buttons-badge`,"aria-hidden":`true`,children:_?p(r,{name:`refresh-cw`,size:14,className:`wui-spin`}):p(r,{name:`camera`,size:14})})]}),m(`div`,{className:`wui-image-picker-buttons-actions`,children:[p(i,{variant:`secondary`,size:`sm`,disabled:K,"aria-describedby":ut,onClick:mt,children:ft}),t,p(i,{variant:`secondary-danger`,size:`sm`,"data-wui-image-picker-remove":!0,hidden:!dt,onClick:wt,children:x})]}),Et,Ye&&p(`input`,{ref:Xe,type:`file`,hidden:!0,accept:`image/*`,capture:`user`,disabled:K,onChange:Ct}),Tt]}),p(ne,{error:J,hint:S,errorId:X,hintId:Y}),Z]})}let Dt=pt,Ot=Math.max(14,Math.round(Dt*.18)),kt=Math.round(Dt*.5),At=`wui-image-picker${Ge===`avatar`?` wui-image-picker-avatar`:``}${v===`rounded`?` wui-image-picker-rounded`:v===`square`?` wui-image-picker-square`:``}${vt?` is-dragging`:``}`,jt=b===`inline`,Mt=b===`profile`,Nt=[`field`,`wui-image-picker-field`,jt&&`wui-image-picker-field-inline`,Mt&&`wui-image-picker-field-profile`,C,w].filter(Boolean).join(` `),$=m(`div`,{className:`wui-image-picker-shell`,style:{"--wui-logo-size":`${Dt}px`},children:[p(`button`,{type:`button`,className:At,onClick:mt,disabled:K,"aria-busy":_||void 0,"aria-label":ze??`Upload photo`,"aria-describedby":X||Y,...yt,...E,children:m(`span`,{className:`wui-image-picker-ring`,"data-overlay-label":Re,children:[q?p(`img`,{className:`wui-image-picker-img`,src:q,alt:``,onError:()=>H(!0)}):p(`span`,{className:`wui-image-picker-logo`,children:u||Ge===`avatar`&&p(r,{name:`user`,size:kt})}),_?p(`span`,{className:`wui-image-picker-overlay is-loading`,"aria-hidden":`true`,children:p(r,{name:`refresh-cw`,size:Ot,className:`wui-spin`})}):!Ee&&m(`span`,{className:`wui-image-picker-overlay`,children:[p(r,{name:Le,size:Ot}),p(`span`,{children:Re})]})]})}),ee(p(`button`,{type:`button`,className:`wui-image-picker-remove`,hidden:!dt,"aria-label":x,"data-wui-image-picker-remove":!0,onClick:wt,children:p(r,{name:`x`,size:14})}),dt?x:null),Et,Tt]}),Pt=S&&!J?p(`div`,{className:`wui-image-picker-hint`,id:Y,children:S}):null,Ft=J?p(ne,{error:J,errorId:X}):null,It=m(`div`,{className:`wui-image-picker-meta`,children:[Fe&&p(`div`,{className:`wui-image-picker-title`,children:Fe}),Ie&&p(`div`,{className:`wui-image-picker-subtitle`,children:Ie}),Pt,Ft]});return jt?m(`div`,{...a,className:Nt,style:T,children:[Q,m(`div`,{className:`wui-image-picker-row`,children:[$,It]}),Z]}):Mt?m(`div`,{...a,className:Nt,style:T,children:[Q,$,It,Z]}):m(`div`,{...a,className:Nt,style:T,children:[Q,$,Pt,Ft,Z]})}export{h as default};

package/dist/components/AppLink.js

@@ -1 +1 @@
-import{splitMarkerProps as e}from"../lib/wuiMarker.js";import{devWarn as t}from"../lib/devWarn.js";import n from"./warnInvalidValue.js";import r from"./warnUnknownProps.js";import i from"./AppIcon.js";import{Fragment as a,jsx as o,jsxs as s}from"react/jsx-runtime";var c={sm:13,md:15,lg:18},l=[`underline`,`underline-center`,`static`,`slide`,`icon`,`highlight`,`bracket`,`fade`,`grow`,`glow`,`shine`,`none`];function u(e,t,n){if(!e)return null;let r=`wui-link__ic wui-link__ic--${t}`;return typeof e==`string`?o(`span`,{className:r,children:o(i,{name:e,size:c[n]??c.md})}):o(`span`,{className:r,children:e})}function d(i){let{marker:d,props:f}=e(`AppLink`,i),{children:p,label:m,href:h,animation:g=`underline`,leftIcon:_=null,rightIcon:v=null,size:y=`md`,surface:b=`default`,external:x=!1,disabled:S=!1,linkComponent:C,className:w=``,...T}=f;r(`AppLink`,T),n(`AppLink`,`animation`,g,l),n(`AppLink`,`size`,y,Object.keys(c)),n(`AppLink`,`surface`,b,[`default`,`dark`]),!h&&T.onClick&&!C&&t(`[@webority/ui-react] AppLink has onClick but no href, so it renders an anchor that keyboards cannot reach. Use AppButton for an action, or pass href.`);let E=l.includes(g)?g:`underline`,D=E===`icon`&&!v&&!_?`arrow-right`:v,O=[`wui-link`,`wui-link--${E}`,y===`md`?``:`wui-link--${y}`,S?`is-disabled`:``,b===`dark`?`wui-link--surface-dark`:``,w].filter(Boolean).join(` `),k=s(a,{children:[u(_,`left`,y),o(`span`,{className:`wui-link__label`,children:p??m}),u(D,`right`,y)]});return S?o(`span`,{className:O,"aria-disabled":`true`,...d,...T,children:k}):C&&!x?o(C,{className:O,to:h,...d,...T,children:k}):o(`a`,{className:O,href:h,target:x?`_blank`:void 0,rel:x?`noopener noreferrer`:void 0,...d,...T,children:k})}export{d as default};
+import{splitMarkerProps as e}from"../lib/wuiMarker.js";import{devWarn as t}from"../lib/devWarn.js";import n from"./warnInvalidValue.js";import r from"./warnUnknownProps.js";import i from"./AppIcon.js";import{Fragment as a,jsx as o,jsxs as s}from"react/jsx-runtime";var c={sm:13,md:15,lg:18},l=[`underline`,`underline-center`,`static`,`slide`,`icon`,`highlight`,`bracket`,`fade`,`grow`,`glow`,`shine`,`none`];function u(e,t,n){if(!e)return null;let r=`wui-link__ic wui-link__ic--${t}`;return typeof e==`string`?o(`span`,{className:r,children:o(i,{name:e,size:c[n]??c.md})}):o(`span`,{className:r,children:e})}function d(i){let{marker:d,props:f}=e(`AppLink`,i),{children:p,label:m,href:h,animation:g=`underline`,leftIcon:_=null,rightIcon:v=null,size:y=`md`,surface:b=`default`,external:x=!1,disabled:S=!1,linkComponent:C,className:w=``,...T}=f;r(`AppLink`,T),n(`AppLink`,`animation`,g,l),n(`AppLink`,`size`,y,Object.keys(c)),n(`AppLink`,`surface`,b,[`default`,`dark`]),!h&&T.onClick&&!C&&t(`[@webority/ui-react] AppLink has onClick but no href, so it renders an anchor that keyboards cannot reach. Use AppButton for an action, or pass href.`);let E=l.includes(g)?g:`underline`,D=E===`icon`&&!v&&!_?`arrow-right`:v,O=[`wui-link`,`wui-link--${E}`,y===`md`?``:`wui-link--${y}`,S?`is-disabled`:``,b===`dark`?`wui-link--surface-dark`:``,w].filter(Boolean).join(` `),k=s(a,{children:[u(_,`left`,y),o(`span`,{className:`wui-link__label`,children:p??m}),u(D,`right`,y)]});if(S){let e={...T};return delete e.onClick,delete e.type,o(`span`,{className:O,"aria-disabled":`true`,...d,...e,children:k})}return C&&!x?o(C,{className:O,to:h,...d,...T,children:k}):o(`a`,{className:O,href:h,target:x?`_blank`:void 0,rel:x?`noopener noreferrer`:void 0,...d,...T,children:k})}export{d as default};

package/dist/components/AppModal.js

@@ -1 +1 @@
-import{splitMarkerProps as e}from"../lib/wuiMarker.js";import{devWarn as t}from"../lib/devWarn.js";import n from"./warnInvalidValue.js";import r from"./warnUnknownProps.js";import i from"./AppIcon.js";import a from"../lib/DiscardPrompt.js";import{useCallback as o,useEffect as s,useRef as c,useState as l}from"react";import{Modal as u}from"react-bootstrap";import{jsx as d,jsxs as f}from"react/jsx-runtime";var p=[`default`,`danger`,`success`,`warning`],ee=[`center`,`top`],m=`a[href],button:not([disabled]),input:not([disabled]),select:not([disabled]),textarea:not([disabled]),[tabindex]:not([tabindex="-1"])`,h={sm:380,md:440,lg:640,xl:880},g=`wui-modal-fullscreen`,_=!1;function te(){let e=!0;try{e=process.env.NODE_ENV!==`production`}catch{e=!0}!e||_||(_=!0,t("[@webority/ui-react] <AppModal hideHeader> has no accessible name: pass `ariaLabel` (or a string `title`)."))}function ne(e,t){if(e.key!==`Tab`)return;let n=Array.from(t.querySelectorAll(m));if(!n.length){e.preventDefault(),t.focus();return}let r=n[0],i=n[n.length-1],a=document.activeElement;e.shiftKey&&(a===r||a===t)?(e.preventDefault(),i.focus()):!e.shiftKey&&a===i&&(e.preventDefault(),r.focus())}function re(){let e=[];for(let t of document.body.children)t.hasAttribute(`inert`)||t.matches(`.modal, .modal-backdrop`)||(t.setAttribute(`inert`,``),e.push(t));return e}function ie(){return typeof document<`u`&&document.querySelector(`wui-drawer[open], .offcanvas.show`)!==null}function v(t){let{marker:_,props:v}=e(`AppModal`,t),{open:y,eyebrow:b,title:x,subtitle:S,headerIcon:C,tone:w=`default`,dismissible:T=!0,onClose:E,onBack:D,backLabel:ae=`Back`,headerActions:O,footer:k,size:A=`md`,placement:j=`center`,hideHeader:M=!1,staticBackdrop:N=!1,confirmDiscard:P,dirty:F=!1,ariaLabel:I,className:oe=``,children:se,...L}=v;r(`AppModal`,L),n(`AppModal`,`tone`,w,p),n(`AppModal`,`placement`,j,ee),n(`AppModal`,`size`,typeof A==`string`?A:null,[...Object.keys(h),`fullscreen`]);let{style:R,ref:z,"data-wui":B,"data-wui-props":V,...H}=L,U=B?{"data-wui":B,"data-wui-props":V}:_,W=U[`data-wui`],G=U[`data-wui-props`];M&&!I&&typeof x!=`string`&&te();let K=c(null),q=c(null),[J,Y]=l(!1);s(()=>{y||Y(!1)},[y]),s(()=>{J&&q.current?.focus()},[J]),s(()=>{let e=K.current?.closest(`.modal`);e&&(P?e.setAttribute(`confirm-discard`,P):e.removeAttribute(`confirm-discard`))},[y,P]);let X=c(null),ce=o(e=>{X.current=e,typeof z==`function`?z(e):z&&(z.current=e)},[z]);s(()=>{let e=X.current?.dialog;e&&(e.setAttribute(`data-wui`,W),G===void 0?e.removeAttribute(`data-wui-props`):e.setAttribute(`data-wui-props`,G))},[y,W,G]),s(()=>{if(!y)return;let e=K.current?.closest(`.modal-content`);if(!e)return;let t=()=>Array.from(e.querySelectorAll(m));(e.querySelector(`[data-autofocus]`)||t().find(e=>!e.classList.contains(`wui-modal-close`)&&!e.classList.contains(`wui-modal-back`))||t()[0]||e).focus?.();let n=e.closest(`.modal`),r=re(),i=e=>ne(e,n);return n?.addEventListener(`keydown`,i),()=>{n?.removeEventListener(`keydown`,i);for(let e of r)e.removeAttribute(`inert`);n&&setTimeout(()=>{n.isConnected&&!n.classList.contains(`show`)&&n.dispatchEvent(new Event(`transitionend`,{bubbles:!0}))},500)}},[y]);let Z=()=>{if(P&&F){Y(!0);return}E?.()},le=()=>{Y(!1),E?.()},ue=()=>{Y(!1),(K.current?.querySelector(`input:not([type="hidden"]):not([disabled]),select:not([disabled]),textarea:not([disabled])`))?.focus()},Q=A===`fullscreen`,de=typeof A==`number`?A:h[A]??h.md,fe=[`wui-modal`,w==="default"?``:`tone-${w}`,oe].filter(Boolean).join(` `),$=y&&ie(),pe=[`wui-modal-shell`,Q&&g,$&&`wui-modal-stacked`].filter(Boolean).join(` `);return f(u,{...H,ref:ce,show:y,onHide:Z,backdrop:!N||`static`,keyboard:!N,autoFocus:!1,enforceFocus:!0,restoreFocus:!0,centered:j!==`top`,className:pe,style:Q?R:{"--wui-modal-max-width":`${de}px`,...R},dialogClassName:`wui-rb-dialog`,contentClassName:fe,backdropClassName:$?`wui-modal-dim wui-modal-backdrop-stacked`:`wui-modal-dim`,"aria-label":I||(typeof x==`string`?x:void 0),children:[!M&&f(`div`,{className:`wui-modal-header`,children:[D&&d(`button`,{type:`button`,className:`wui-modal-back`,onClick:D,"aria-label":ae,children:d(i,{name:`arrow-left`,size:18})}),f(`div`,{className:`wui-modal-heading`,children:[C&&d(`span`,{className:`wui-modal-headicon`,children:d(i,{name:C,size:18})}),f(`div`,{className:`wui-modal-headtext`,children:[b&&d(`div`,{className:`wui-modal-eyebrow`,children:b}),d(`div`,{className:`wui-modal-title`,children:x}),S&&d(`div`,{className:`wui-modal-subtitle`,children:S})]})]}),O&&d(`div`,{className:`wui-modal-header-actions`,children:O}),T&&d(`button`,{type:`button`,className:`wui-modal-close`,onClick:Z,"aria-label":`Close`,children:d(`svg`,{width:`18`,height:`18`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:`2`,strokeLinecap:`round`,strokeLinejoin:`round`,"aria-hidden":`true`,children:d(`path`,{d:`M18 6 6 18M6 6l12 12`})})})]}),d(`div`,{className:`wui-modal-body`,ref:K,children:se}),(k||J)&&f(`div`,{className:J?`wui-modal-footer wui-drawer-discarding`:`wui-modal-footer`,children:[J&&d(a,{text:P,confirmRef:q,onDiscard:le,onKeep:ue}),k]})]})}export{v as default};
+import{splitMarkerProps as e}from"../lib/wuiMarker.js";import{devWarn as t}from"../lib/devWarn.js";import n from"./warnInvalidValue.js";import r from"./warnUnknownProps.js";import i from"./AppIcon.js";import a from"../lib/DiscardPrompt.js";import{lockPageScroll as o}from"../lib/pageScrollLock.js";import{useCallback as s,useEffect as c,useRef as l,useState as ee}from"react";import{Modal as te}from"react-bootstrap";import{jsx as u,jsxs as d}from"react/jsx-runtime";var ne=[`default`,`danger`,`success`,`warning`],f=[`center`,`top`],p=`a[href],button:not([disabled]),input:not([disabled]),select:not([disabled]),textarea:not([disabled]),[tabindex]:not([tabindex="-1"])`,m={sm:380,md:440,lg:640,xl:880},h=`wui-modal-fullscreen`,g=!1;function re(){let e=!0;try{e=process.env.NODE_ENV!==`production`}catch{e=!0}!e||g||(g=!0,t("[@webority/ui-react] <AppModal hideHeader> has no accessible name: pass `ariaLabel` (or a string `title`)."))}function ie(e,t){if(e.key!==`Tab`)return;let n=Array.from(t.querySelectorAll(p));if(!n.length){e.preventDefault(),t.focus();return}let r=n[0],i=n[n.length-1],a=document.activeElement;e.shiftKey&&(a===r||a===t)?(e.preventDefault(),i.focus()):!e.shiftKey&&a===i&&(e.preventDefault(),r.focus())}function _(){let e=[];for(let t of document.body.children)t.hasAttribute(`inert`)||t.matches(`.modal, .modal-backdrop`)||(t.setAttribute(`inert`,``),e.push(t));return e}function ae(){return typeof document<`u`&&document.querySelector(`wui-drawer[open], .offcanvas.show`)!==null}function v(t){let{marker:g,props:v}=e(`AppModal`,t),{open:y,eyebrow:b,title:x,subtitle:S,headerIcon:C,tone:w=`default`,dismissible:T=!0,onClose:E,onBack:D,backLabel:O=`Back`,headerActions:k,footer:A,size:j=`md`,placement:M=`center`,hideHeader:N=!1,staticBackdrop:P=!1,confirmDiscard:F,dirty:oe=!1,ariaLabel:I,className:se=``,children:ce,...L}=v;r(`AppModal`,L),n(`AppModal`,`tone`,w,ne),n(`AppModal`,`placement`,M,f),n(`AppModal`,`size`,typeof j==`string`?j:null,[...Object.keys(m),`fullscreen`]);let{style:R,ref:z,"data-wui":B,"data-wui-props":V,...H}=L,U=B?{"data-wui":B,"data-wui-props":V}:g,W=U[`data-wui`],G=U[`data-wui-props`];N&&!I&&typeof x!=`string`&&re();let K=l(null),q=l(null),[J,Y]=ee(!1);c(()=>{y||Y(!1)},[y]),c(()=>{J&&q.current?.focus()},[J]),c(()=>{if(y)return o()},[y]),c(()=>{let e=K.current?.closest(`.modal`);e&&(F?e.setAttribute(`confirm-discard`,F):e.removeAttribute(`confirm-discard`))},[y,F]);let X=l(null),le=s(e=>{X.current=e,typeof z==`function`?z(e):z&&(z.current=e)},[z]);c(()=>{let e=X.current?.dialog;e&&(e.setAttribute(`data-wui`,W),G===void 0?e.removeAttribute(`data-wui-props`):e.setAttribute(`data-wui-props`,G))},[y,W,G]),c(()=>{if(!y)return;let e=K.current?.closest(`.modal-content`);if(!e)return;let t=()=>Array.from(e.querySelectorAll(p));(e.querySelector(`[data-autofocus]`)||t().find(e=>!e.classList.contains(`wui-modal-close`)&&!e.classList.contains(`wui-modal-back`))||t()[0]||e).focus?.();let n=e.closest(`.modal`),r=_(),i=e=>ie(e,n);return n?.addEventListener(`keydown`,i),()=>{n?.removeEventListener(`keydown`,i);for(let e of r)e.removeAttribute(`inert`);n&&setTimeout(()=>{n.isConnected&&!n.classList.contains(`show`)&&n.dispatchEvent(new Event(`transitionend`,{bubbles:!0}))},500)}},[y]);let Z=()=>{if(F&&oe){Y(!0);return}E?.()},ue=()=>{Y(!1),E?.()},de=()=>{Y(!1),(K.current?.querySelector(`input:not([type="hidden"]):not([disabled]),select:not([disabled]),textarea:not([disabled])`))?.focus()},Q=j===`fullscreen`,fe=typeof j==`number`?j:m[j]??m.md,pe=[`wui-modal`,w==="default"?``:`tone-${w}`,se].filter(Boolean).join(` `),$=y&&ae(),me=[`wui-modal-shell`,Q&&h,$&&`wui-modal-stacked`].filter(Boolean).join(` `);return d(te,{...H,ref:le,show:y,onHide:Z,backdrop:!P||`static`,keyboard:!P,autoFocus:!1,enforceFocus:!0,restoreFocus:!0,centered:M!==`top`,className:me,style:Q?R:{"--wui-modal-max-width":`${fe}px`,...R},dialogClassName:`wui-rb-dialog`,contentClassName:pe,backdropClassName:$?`wui-modal-dim wui-modal-backdrop-stacked`:`wui-modal-dim`,"aria-label":I||(typeof x==`string`?x:void 0),children:[!N&&d(`div`,{className:`wui-modal-header`,children:[D&&u(`button`,{type:`button`,className:`wui-modal-back`,onClick:D,"aria-label":O,children:u(i,{name:`arrow-left`,size:18})}),d(`div`,{className:`wui-modal-heading`,children:[C&&u(`span`,{className:`wui-modal-headicon`,children:u(i,{name:C,size:18})}),d(`div`,{className:`wui-modal-headtext`,children:[b&&u(`div`,{className:`wui-modal-eyebrow`,children:b}),u(`div`,{className:`wui-modal-title`,children:x}),S&&u(`div`,{className:`wui-modal-subtitle`,children:S})]})]}),k&&u(`div`,{className:`wui-modal-header-actions`,children:k}),T&&u(`button`,{type:`button`,className:`wui-modal-close`,onClick:Z,"aria-label":`Close`,children:u(`svg`,{width:`18`,height:`18`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:`2`,strokeLinecap:`round`,strokeLinejoin:`round`,"aria-hidden":`true`,children:u(`path`,{d:`M18 6 6 18M6 6l12 12`})})})]}),u(`div`,{className:`wui-modal-body`,ref:K,children:ce}),(A||J)&&d(`div`,{className:J?`wui-modal-footer wui-drawer-discarding`:`wui-modal-footer`,children:[J&&u(a,{text:F,confirmRef:q,onDiscard:ue,onKeep:de}),A]})]})}export{v as default};

package/dist/components/AppMultiSelect.js

@@ -1 +1 @@
-import{splitMarkerProps as e}from"../lib/wuiMarker.js";import t from"./warnInvalidValue.js";import n from"./warnUnknownProps.js";import r from"../lib/FieldMessage.js";import i from"./AppInfoTip.js";import a from"./AppRequiredMark.js";import o from"./useNodeLabels.js";import s,{optionsEqual as c,readValues as l,writeValues as u}from"./useWuiControl.js";import{forwardRef as d,useEffect as f,useId as p}from"react";import{jsx as m,jsxs as h}from"react/jsx-runtime";import"@webority/ui-elements/elements/multiselect";var g=[`sm`,`lg`],_=[],v=(e,t)=>({...e,label:t}),y=d(function(d,y){let{marker:b,props:x}=e(`AppMultiSelect`,d),{values:S,onChange:C,options:w,placeholder:T=`Select…`,searchPlaceholder:E=`Search…`,searchable:D=!0,disabled:O=!1,icon:k,size:A,collapseChips:j=!1,allowCustom:M=!1,validateCustom:N,customPattern:P,customInvalidMessage:F,name:I,id:L,label:R,error:z,hint:B,required:V=!1,help:H,helpLabel:U=`More information`,fieldClassName:W=``,...G}=x;n(`AppMultiSelect`,G),t(`AppMultiSelect`,`size`,A,g);let K=p(),q=L||K,{setRef:J,innerRef:Y}=s({ref:y,value:S,onChange:C,readValue:l,writeValue:u}),X=w||_,{portal:Z,toElementOptions:Q}=o(X);return f(()=>{let e=Y.current;if(!e)return;let t=Q(X,v);c(t,e.options)||(e.options=t)},[X,Y,Q]),f(()=>{let e=Y.current;e&&(e.validateCustom=N??null)},[N,Y]),h(`div`,{...b,className:`field${W?` ${W}`:``}`,children:[R&&h(`label`,{className:`label`,htmlFor:q,children:[R,V&&m(a,{}),H&&m(i,{label:U,children:H})]}),m(`wui-multiselect`,{"aria-label":typeof R==`string`?R:void 0,"aria-describedby":z?`${q}-error`:B?`${q}-hint`:void 0,"aria-invalid":z?`true`:void 0,id:q,ref:J,name:I,placeholder:T,"search-placeholder":E,icon:k||void 0,size:A||void 0,"collapse-chips":j?``:void 0,"allow-custom":M?``:void 0,"custom-pattern":P||void 0,"custom-invalid-message":F||void 0,searchable:D?``:void 0,disabled:O?``:void 0,required:V?``:void 0,...G}),Z,m(r,{error:z,hint:B,errorId:`${q}-error`,hintId:`${q}-hint`})]})});export{y as default};
+import{splitMarkerProps as e}from"../lib/wuiMarker.js";import t from"./warnInvalidValue.js";import n from"./warnUnknownProps.js";import r from"../lib/FieldMessage.js";import i from"./AppInfoTip.js";import a from"./AppRequiredMark.js";import o from"./useNodeLabels.js";import s,{optionsEqual as c,readValues as l,writeValues as u}from"./useWuiControl.js";import{forwardRef as d,useEffect as f,useId as p}from"react";import{jsx as m,jsxs as h}from"react/jsx-runtime";import"@webority/ui-elements/elements/multiselect";var g=[`sm`,`lg`],_=[],v=(e,t)=>({...e,label:t}),y=d(function(d,y){let{marker:b,props:x}=e(`AppMultiSelect`,d),{values:S,onChange:C,options:w,placeholder:T=`Select…`,searchPlaceholder:E=`Search…`,searchable:D=!0,disabled:O=!1,icon:k,size:A,collapseChips:j=!1,allowCustom:M=!1,validateCustom:N,customPattern:P,customInvalidMessage:F,name:I,id:L,label:R,error:z,hint:B,required:V=!1,optional:H=!1,help:U,helpLabel:W=`More information`,fieldClassName:G=``,...K}=x;n(`AppMultiSelect`,K),t(`AppMultiSelect`,`size`,A,g);let q=p(),J=L||q,{setRef:Y,innerRef:X}=s({ref:y,value:S,onChange:C,readValue:l,writeValue:u}),Z=w||_,{portal:Q,toElementOptions:$}=o(Z);return f(()=>{let e=X.current;if(!e)return;let t=$(Z,v);c(t,e.options)||(e.options=t)},[Z,X,$]),f(()=>{let e=X.current;e&&(e.validateCustom=N??null)},[N,X]),h(`div`,{...b,className:`field${G?` ${G}`:``}`,children:[R&&h(`label`,{className:`label`,htmlFor:J,children:[R,H&&!V&&m(`span`,{className:`label-optional`,children:` (optional)`}),V&&m(a,{}),U&&m(i,{label:W,children:U})]}),m(`wui-multiselect`,{"aria-label":typeof R==`string`?R:void 0,"aria-describedby":z?`${J}-error`:B?`${J}-hint`:void 0,"aria-invalid":z?`true`:void 0,id:J,ref:Y,name:I,placeholder:T,"search-placeholder":E,icon:k||void 0,size:A||void 0,"collapse-chips":j?``:void 0,"allow-custom":M?``:void 0,"custom-pattern":P||void 0,"custom-invalid-message":F||void 0,searchable:D?``:void 0,disabled:O?``:void 0,required:V?``:void 0,...K}),Q,m(r,{error:z,hint:B,errorId:`${J}-error`,hintId:`${J}-hint`})]})});export{y as default};

package/dist/components/AppNumberInput.js

@@ -1 +1 @@
-import{splitMarkerProps as e}from"../lib/wuiMarker.js";import t from"./warnInvalidValue.js";import n from"./warnUnknownProps.js";import r from"./AppIcon.js";import i from"../lib/FieldMessage.js";import ee from"./AppInfoTip.js";import a from"./AppRequiredMark.js";import{forwardRef as o,useEffect as s,useId as c,useState as l}from"react";import{Form as u}from"react-bootstrap";import{jsx as d,jsxs as f}from"react/jsx-runtime";var p=[`sm`,`md`,`lg`],m=e=>{if(e===``||e===null)return null;let t=parseFloat(e);return Number.isNaN(t)?null:t},h=(e,t)=>t>0&&Number.isFinite(e)?e.toFixed(t):String(e??``),g=o(function(o,g){let{marker:_,props:v}=e(`AppNumberInput`,o),{label:y,required:b=!1,error:x,hint:S,help:C,helpLabel:w=`More information`,value:T,onChange:E,min:D,max:O,step:k=1,precision:A=0,unit:j,size:M=`md`,id:N,name:P,className:F=``,fieldClassName:I=``,disabled:L=!1,readOnly:R=!1,...z}=v;n(`AppNumberInput`,z),t(`AppNumberInput`,`size`,M,p);let B=c(),V=N||B,H=e=>{if(A===0)return Math.round(e);let t=10**A;return Math.round(e*t)/t},U=e=>{let t=e;return typeof D==`number`&&(t=Math.max(t,D)),typeof O==`number`&&(t=Math.min(t,O)),t},W=e=>h(e,A),[G,K]=l(()=>W(T));s(()=>{K(e=>m(e)===(T??null)?e:h(T,A))},[T,A]);let q=e=>{let t=(m(G)??U(0))+e*k,n=U(H(t));K(W(n)),E?.(n)},J=m(G),Y=L||R||J!==null&&typeof D==`number`&&J<=D,X=L||R||J!==null&&typeof O==`number`&&J>=O,Z=x&&V?`${V}-error`:void 0,Q=S&&V?`${V}-hint`:void 0,$=Z||Q,te=[`input`,M===`sm`?`input-sm`:``,M===`lg`?`input-lg`:``,x?`error`:``,`num-input`,F].filter(Boolean).join(` `),ne=RegExp(`^${typeof D==`number`&&D>=0?``:`-?`}\\d*${A>0?`(\\.\\d*)?`:``}$`),re=e=>{let t=e.target.value;if(!ne.test(t))return;K(t);let n=m(t);n!==null&&E?.(n)},ie=e=>{if(R){z.onBlur?.(e);return}let t=m(e.target.value);if(t===null)K(``),E?.(null);else{let e=U(H(t));K(W(e)),E?.(e)}z.onBlur?.(e)},ae=e=>{if(R){z.onKeyDown?.(e);return}e.key===`ArrowUp`?(e.preventDefault(),q(1)):e.key===`ArrowDown`&&(e.preventDefault(),q(-1)),z.onKeyDown?.(e)},oe=d(u.Control,{...z,id:V,name:P,type:`text`,inputMode:A>0?`decimal`:`numeric`,className:te,disabled:L,readOnly:R,required:b,"aria-invalid":x?`true`:`false`,"aria-describedby":$,value:G,ref:g,onChange:re,onBlur:ie,onKeyDown:ae}),se=f(`div`,{className:[`num-wrap`,M===`sm`?`num-wrap-sm`:``,M===`lg`?`num-wrap-lg`:``].filter(Boolean).join(` `),children:[d(`button`,{type:`button`,className:`num-btn`,"aria-label":`Decrease`,tabIndex:-1,disabled:Y,onClick:()=>q(-1),children:d(r,{name:`minus`,size:16})}),oe,j&&d(`span`,{className:`affix`,children:j}),d(`button`,{type:`button`,className:`num-btn`,"aria-label":`Increase`,tabIndex:-1,disabled:X,onClick:()=>q(1),children:d(r,{name:`plus`,size:16})})]});return f(u.Group,{..._,className:`field${I?` ${I}`:``}`,children:[y&&f(u.Label,{className:`label`,htmlFor:V,children:[y,b&&d(a,{}),C&&d(ee,{label:w,children:C})]}),se,d(i,{error:x,hint:S,errorId:Z,hintId:Q})]})});export{g as default};
+import{splitMarkerProps as e}from"../lib/wuiMarker.js";import t from"./warnInvalidValue.js";import n from"./warnUnknownProps.js";import r from"./AppIcon.js";import i from"../lib/FieldMessage.js";import a from"./AppInfoTip.js";import o from"./AppRequiredMark.js";import{forwardRef as s,useEffect as c,useId as l,useState as u}from"react";import{Form as d}from"react-bootstrap";import{jsx as f,jsxs as p}from"react/jsx-runtime";var m=[`sm`,`md`,`lg`],h=e=>{if(e===``||e===null)return null;let t=parseFloat(e);return Number.isNaN(t)?null:t},g=(e,t)=>t>0&&Number.isFinite(e)?e.toFixed(t):String(e??``),_=s(function(s,_){let{marker:v,props:y}=e(`AppNumberInput`,s),{label:b,required:x=!1,optional:ee=!1,error:S,hint:C,help:w,helpLabel:T=`More information`,value:E,onChange:D,min:O,max:k,step:A=1,precision:j=0,unit:M,size:N=`md`,id:P,name:F,className:te=``,fieldClassName:I=``,disabled:L=!1,readOnly:R=!1,...z}=y;n(`AppNumberInput`,z),t(`AppNumberInput`,`size`,N,m);let B=l(),V=P||B,H=e=>{if(j===0)return Math.round(e);let t=10**j;return Math.round(e*t)/t},U=e=>{let t=e;return typeof O==`number`&&(t=Math.max(t,O)),typeof k==`number`&&(t=Math.min(t,k)),t},W=e=>g(e,j),[G,K]=u(()=>W(E));c(()=>{K(e=>h(e)===(E??null)?e:g(E,j))},[E,j]);let q=e=>{let t=(h(G)??U(0))+e*A,n=U(H(t));K(W(n)),D?.(n)},J=h(G),Y=L||R||J!==null&&typeof O==`number`&&J<=O,X=L||R||J!==null&&typeof k==`number`&&J>=k,Z=S&&V?`${V}-error`:void 0,Q=C&&V?`${V}-hint`:void 0,$=Z||Q,ne=[`input`,N===`sm`?`input-sm`:``,N===`lg`?`input-lg`:``,S?`error`:``,`num-input`,te].filter(Boolean).join(` `),re=RegExp(`^${typeof O==`number`&&O>=0?``:`-?`}\\d*${j>0?`(\\.\\d*)?`:``}$`),ie=e=>{let t=e.target.value;if(!re.test(t))return;K(t);let n=h(t);n!==null&&D?.(n)},ae=e=>{if(R){z.onBlur?.(e);return}let t=h(e.target.value);if(t===null)K(``),D?.(null);else{let e=U(H(t));K(W(e)),D?.(e)}z.onBlur?.(e)},oe=e=>{if(R){z.onKeyDown?.(e);return}e.key===`ArrowUp`?(e.preventDefault(),q(1)):e.key===`ArrowDown`&&(e.preventDefault(),q(-1)),z.onKeyDown?.(e)},se=f(d.Control,{...z,id:V,name:F,type:`text`,inputMode:j>0?`decimal`:`numeric`,className:ne,disabled:L,readOnly:R,required:x,"aria-invalid":S?`true`:`false`,"aria-describedby":$,value:G,ref:_,onChange:ie,onBlur:ae,onKeyDown:oe}),ce=p(`div`,{className:[`num-wrap`,N===`sm`?`num-wrap-sm`:``,N===`lg`?`num-wrap-lg`:``].filter(Boolean).join(` `),children:[f(`button`,{type:`button`,className:`num-btn`,"aria-label":`Decrease`,tabIndex:-1,disabled:Y,onClick:()=>q(-1),children:f(r,{name:`minus`,size:16})}),se,M&&f(`span`,{className:`affix`,children:M}),f(`button`,{type:`button`,className:`num-btn`,"aria-label":`Increase`,tabIndex:-1,disabled:X,onClick:()=>q(1),children:f(r,{name:`plus`,size:16})})]});return p(d.Group,{...v,className:`field${I?` ${I}`:``}`,children:[b&&p(d.Label,{className:`label`,htmlFor:V,children:[b,ee&&!x&&f(`span`,{className:`label-optional`,children:` (optional)`}),x&&f(o,{}),w&&f(a,{label:T,children:w})]}),ce,f(i,{error:S,hint:C,errorId:Z,hintId:Q})]})});export{_ as default};

package/dist/components/AppOtpInput.js

@@ -1 +1 @@
-import{splitMarkerProps as e}from"../lib/wuiMarker.js";import t from"./warnInvalidValue.js";import n from"./warnUnknownProps.js";import r from"../lib/FieldMessage.js";import i from"./AppRequiredMark.js";import a from"./useWuiControl.js";import{cloneElement as o,forwardRef as s,useId as c}from"react";import{jsx as l,jsxs as u}from"react/jsx-runtime";import"@webority/ui-elements/elements/otp";var d=[`numeric`,`alphanumeric`],f=s(function(s,f){let{marker:p,props:m}=e(`AppOtpInput`,s),{value:h,onChange:g,onComplete:_,length:v=6,mode:y=`numeric`,label:b,required:x=!1,hint:S,error:C,disabled:w=!1,name:T,id:E,className:D=``,fieldClassName:O=``,...k}=m;n(`AppOtpInput`,k),t(`AppOtpInput`,`mode`,y,d);let A=c(),j=E||A,M=C?`${j}-error`:void 0,N=S?`${j}-hint`:void 0,P=M||N,{setRef:F}=a({ref:f,value:h??``,onChange:g,on:{complete:e=>_?.(e.detail)}}),I=l(`wui-otp`,{"aria-label":typeof b==`string`?b:void 0,ref:F,id:j,name:T,length:String(v),mode:y,"aria-describedby":P,"aria-invalid":C?`true`:void 0,disabled:w?``:void 0,required:x?``:void 0,className:D||void 0,...k});return!b&&!C&&!S?o(I,p):u(`div`,{...p,className:`field${O?` ${O}`:``}`,children:[b&&u(`label`,{className:`label`,htmlFor:j,children:[b,x&&l(i,{})]}),I,l(r,{error:C,hint:S,errorId:M,hintId:N})]})});export{f as default};
+import{splitMarkerProps as e}from"../lib/wuiMarker.js";import t from"./warnInvalidValue.js";import n from"./warnUnknownProps.js";import r from"../lib/FieldMessage.js";import i from"./AppRequiredMark.js";import a from"./useWuiControl.js";import{cloneElement as o,forwardRef as s,useId as c}from"react";import{jsx as l,jsxs as u}from"react/jsx-runtime";import"@webority/ui-elements/elements/otp";var d=[`numeric`,`alphanumeric`],f=s(function(s,f){let{marker:p,props:m}=e(`AppOtpInput`,s),{value:h,onChange:g,onComplete:_,length:v=6,mode:y=`numeric`,label:b,required:x=!1,optional:S=!1,hint:C,error:w,disabled:T=!1,name:E,id:D,className:O=``,fieldClassName:k=``,...A}=m;n(`AppOtpInput`,A),t(`AppOtpInput`,`mode`,y,d);let j=c(),M=D||j,N=w?`${M}-error`:void 0,P=C?`${M}-hint`:void 0,F=N||P,{setRef:I}=a({ref:f,value:h??``,onChange:g,on:{complete:e=>_?.(e.detail)}}),L=l(`wui-otp`,{"aria-label":typeof b==`string`?b:void 0,ref:I,id:M,name:E,length:String(v),mode:y,"aria-describedby":F,"aria-invalid":w?`true`:void 0,disabled:T?``:void 0,required:x?``:void 0,className:O||void 0,...A});return!b&&!w&&!C?o(L,p):u(`div`,{...p,className:`field${k?` ${k}`:``}`,children:[b&&u(`label`,{className:`label`,htmlFor:M,children:[b,S&&!x&&l(`span`,{className:`label-optional`,children:` (optional)`}),x&&l(i,{})]}),L,l(r,{error:w,hint:C,errorId:N,hintId:P})]})});export{f as default};

package/dist/components/AppPhoneNumberInput.js

@@ -1 +1 @@
-import{splitMarkerProps as e}from"../lib/wuiMarker.js";import t from"./warnInvalidValue.js";import n from"./warnUnknownProps.js";import r from"../lib/FieldMessage.js";import i from"./AppRequiredMark.js";import a from"./useWuiControl.js";import{forwardRef as o,useId as s}from"react";import{jsx as c,jsxs as l}from"react/jsx-runtime";import"@webority/ui-elements/elements/phone";var u=[`sm`,`md`,`lg`],d=o(function(o,d){let{marker:f,props:p}=e(`AppPhoneNumberInput`,o),{value:m,onChange:h,country:g,disabled:_=!1,name:v,id:y,label:b=`Phone number`,placeholder:x,required:S=!1,hint:C,error:w,showFlag:T=!0,showDialCode:E=!0,size:D=`md`,fieldClassName:O=``,...k}=p;n(`AppPhoneNumberInput`,k),t(`AppPhoneNumberInput`,`size`,D,u);let A=s(),j=y||A,M=w&&j?`${j}-error`:void 0,N=!w&&C&&j?`${j}-hint`:void 0,{setRef:P}=a({ref:d,value:m??``,onChange:h,events:[`input`,`change`]});return l(`div`,{...f,className:`field app-phone-number-input${D===`sm`?` phone-sm`:``}${D===`lg`?` phone-lg`:``}${O?` ${O}`:``}`,children:[b&&l(`label`,{className:`label`,htmlFor:j,children:[b,S&&c(i,{})]}),c(`wui-phone`,{ref:P,id:j,name:v,"aria-label":typeof b==`string`?b:void 0,"aria-describedby":M||N,"aria-invalid":w?`true`:void 0,country:g,placeholder:x,required:S?``:void 0,disabled:_?``:void 0,"hide-flag":T?void 0:``,"hide-dial":E?void 0:``,"external-error":``,...k}),c(r,{error:w,hint:C,errorId:M,hintId:N})]})});export{d as default};
+import{splitMarkerProps as e}from"../lib/wuiMarker.js";import t from"./warnInvalidValue.js";import n from"./warnUnknownProps.js";import r from"../lib/FieldMessage.js";import i from"./AppRequiredMark.js";import a from"./useWuiControl.js";import{loadFlagStyles as o}from"../lib/flagStyles.js";import{forwardRef as s,useEffect as c,useId as l}from"react";import{jsx as u,jsxs as d}from"react/jsx-runtime";import"@webority/ui-elements/elements/phone";var f=[`sm`,`md`,`lg`],p=s(function(s,p){let{marker:m,props:h}=e(`AppPhoneNumberInput`,s),{value:g,onChange:_,country:v,disabled:y=!1,name:b,id:x,label:S=`Phone number`,placeholder:C,required:w=!1,optional:T=!1,hint:E,error:D,showFlag:O=!0,showDialCode:k=!0,size:A=`md`,fieldClassName:j=``,...M}=h;n(`AppPhoneNumberInput`,M),t(`AppPhoneNumberInput`,`size`,A,f),c(()=>{O&&o()},[O]);let N=l(),P=x||N,F=D&&P?`${P}-error`:void 0,I=!D&&E&&P?`${P}-hint`:void 0,{setRef:L}=a({ref:p,value:g??``,onChange:_,events:[`input`,`change`]});return d(`div`,{...m,className:`field app-phone-number-input${A===`sm`?` phone-sm`:``}${A===`lg`?` phone-lg`:``}${j?` ${j}`:``}`,children:[S&&d(`label`,{className:`label`,htmlFor:P,children:[S,T&&!w&&u(`span`,{className:`label-optional`,children:` (optional)`}),w&&u(i,{})]}),u(`wui-phone`,{ref:L,id:P,name:b,"aria-label":typeof S==`string`?S:void 0,"aria-describedby":F||I,"aria-invalid":D?`true`:void 0,country:v,placeholder:C,required:w?``:void 0,disabled:y?``:void 0,"hide-flag":O?void 0:``,"hide-dial":k?void 0:``,"external-error":``,...M}),u(r,{error:D,hint:E,errorId:F,hintId:I})]})});export{p as default};

package/dist/components/AppRadioGroup.js

@@ -1 +1 @@
-import{splitMarkerProps as e}from"../lib/wuiMarker.js";import t from"./warnInvalidValue.js";import n from"./warnUnknownProps.js";import r from"../lib/FieldMessage.js";import i from"./AppInfoTip.js";import a from"./AppRequiredMark.js";import{useId as o}from"react";import{jsx as s,jsxs as c}from"react/jsx-runtime";var l=[`default`,`card`];function u(u){let{marker:d,props:f}=e(`AppRadioGroup`,u),{label:p,options:m=[],name:h,value:g,defaultValue:_,onChange:v,variant:y=`default`,inline:b=!1,required:x=!1,disabled:S=!1,error:C,hint:w,help:T,helpLabel:E=`More information`,id:D,className:O=``,fieldClassName:k=``,style:A,...j}=f;n(`AppRadioGroup`,j),t(`AppRadioGroup`,`variant`,y,l);let M=o(),N=D||M,P=h||N,F=`${N}-error`,I=`${N}-hint`,L=g!==void 0;return c(`div`,{...d,className:`field${k?` ${k}`:``}`,children:[p!=null&&c(`span`,{className:`label`,id:`${N}-label`,children:[p,x&&s(a,{}),T&&s(i,{label:E,children:T})]}),s(`div`,{className:[`wui-radio-group`,y===`card`?`wui-radio-group-card`:``,b?`wui-radio-group-inline`:``,O].filter(Boolean).join(` `),style:A,id:N,role:`radiogroup`,"aria-labelledby":p==null?void 0:`${N}-label`,"aria-required":x?`true`:void 0,"aria-invalid":C?`true`:void 0,"aria-describedby":C?F:w?I:void 0,...j,children:m.map((e,t)=>{let n=`${N}-${t}`,r=e.description==null?void 0:`${n}-desc`;return c(`div`,{className:`form-check`,children:[s(`input`,{type:`radio`,className:`form-check-input`,id:n,name:P,value:e.value,disabled:S||e.disabled||void 0,required:x||void 0,"aria-describedby":r,...L?{checked:g===e.value,onChange:()=>v?.(e.value)}:{defaultChecked:_===e.value,onChange:()=>v?.(e.value)}}),s(`label`,{className:`form-check-label`,htmlFor:n,children:e.label}),r&&s(`div`,{className:`wui-radio-option-desc`,id:r,children:e.description})]},e.value)})}),s(r,{error:C,hint:w,errorId:F,hintId:I})]})}export{u as default};
+import{splitMarkerProps as e}from"../lib/wuiMarker.js";import t from"./warnInvalidValue.js";import n from"./warnUnknownProps.js";import r from"../lib/FieldMessage.js";import i from"./AppInfoTip.js";import a from"./AppRequiredMark.js";import{useId as o}from"react";import{jsx as s,jsxs as c}from"react/jsx-runtime";var l=[`default`,`card`];function u(u){let{marker:d,props:f}=e(`AppRadioGroup`,u),{label:p,options:m=[],name:h,value:g,defaultValue:_,onChange:v,variant:y=`default`,inline:b=!1,required:x=!1,optional:S=!1,disabled:C=!1,error:w,hint:T,help:E,helpLabel:D=`More information`,id:O,className:k=``,fieldClassName:A=``,style:j,...M}=f;n(`AppRadioGroup`,M),t(`AppRadioGroup`,`variant`,y,l);let N=o(),P=O||N,F=h||P,I=`${P}-error`,L=`${P}-hint`,R=g!==void 0;return c(`div`,{...d,className:`field${A?` ${A}`:``}`,children:[p!=null&&c(`span`,{className:`label`,id:`${P}-label`,children:[p,S&&!x&&s(`span`,{className:`label-optional`,children:` (optional)`}),x&&s(a,{}),E&&s(i,{label:D,children:E})]}),s(`div`,{className:[`wui-radio-group`,y===`card`?`wui-radio-group-card`:``,b?`wui-radio-group-inline`:``,k].filter(Boolean).join(` `),style:j,id:P,role:`radiogroup`,"aria-labelledby":p==null?void 0:`${P}-label`,"aria-required":x?`true`:void 0,"aria-invalid":w?`true`:void 0,"aria-describedby":w?I:T?L:void 0,...M,children:m.map((e,t)=>{let n=`${P}-${t}`,r=e.description==null?void 0:`${n}-desc`;return c(`div`,{className:`form-check`,children:[s(`input`,{type:`radio`,className:`form-check-input`,id:n,name:F,value:e.value,disabled:C||e.disabled||void 0,required:x||void 0,"aria-describedby":r,...R?{checked:g===e.value,onChange:()=>v?.(e.value)}:{defaultChecked:_===e.value,onChange:()=>v?.(e.value)}}),s(`label`,{className:`form-check-label`,htmlFor:n,children:e.label}),r&&s(`div`,{className:`wui-radio-option-desc`,id:r,children:e.description})]},e.value)})}),s(r,{error:w,hint:T,errorId:I,hintId:L})]})}export{u as default};

package/dist/components/AppRepeater.js

@@ -1 +1 @@
-import{splitMarkerProps as e}from"../lib/wuiMarker.js";import t from"./warnUnknownProps.js";import n from"./AppActionIcon.js";import r from"./AppButton.js";import{jsx as i,jsxs as a}from"react/jsx-runtime";function o(o){let{marker:s,props:c}=e(`AppRepeater`,o),{rows:l=[],renderRow:u,rowLabel:d,onAdd:f,onRemove:p,addLabel:m=`Add another`,addVariant:h=`secondary`,removeLabel:g=`Remove row`,emptyText:_,min:v=0,max:y,numbered:b=!0,className:x=``,...S}=c;t(`AppRepeater`,S);let C=typeof y==`number`&&l.length>=y,w=!!p&&l.length>v;return a(`div`,{className:`repeater${x?` ${x}`:``}`,...s,...S,children:[l.length===0&&_&&i(`div`,{className:`repeater-empty`,children:_}),l.map((e,t)=>{let r=d?d(e,t):null;return a(`div`,{className:`repeater-row`,children:[(!!r||w)&&i(`span`,{className:`repeater-row-label`,children:r}),b&&i(`span`,{className:`repeater-index`,children:t+1}),i(`div`,{className:`repeater-body`,children:u(e,t)}),w&&i(n,{icon:`trash-2`,label:`${g} ${t+1}`,danger:!0,className:`repeater-remove`,onClick:()=>p(t)})]},e.id??t)}),i(r,{variant:h,size:`sm`,leftIcon:`plus`,className:`repeater-add`,disabled:C,onClick:f,children:m})]})}export{o as default};
+import{splitMarkerProps as e}from"../lib/wuiMarker.js";import t from"./warnUnknownProps.js";import n from"./AppActionIcon.js";import r from"./AppButton.js";import i from"./AppLink.js";import{jsx as a,jsxs as o}from"react/jsx-runtime";function s(s){let{marker:c,props:l}=e(`AppRepeater`,s),{rows:u=[],renderRow:d,rowLabel:f,onAdd:p,onRemove:m,addLabel:h=`Add another`,addVariant:g=`secondary`,removeLabel:_=`Remove row`,emptyText:v,min:y=0,max:b,numbered:x=!0,className:S=``,...C}=l;t(`AppRepeater`,C);let w=typeof b==`number`&&u.length>=b,T=!!m&&u.length>y;return o(`div`,{className:`repeater${S?` ${S}`:``}`,...c,...C,children:[u.length===0&&v&&a(`div`,{className:`repeater-empty`,children:v}),u.map((e,t)=>{let r=f?f(e,t):null;return o(`div`,{className:`repeater-row`,children:[(!!r||T)&&a(`span`,{className:`repeater-row-label`,children:r}),x&&a(`span`,{className:`repeater-index`,children:t+1}),a(`div`,{className:`repeater-body`,children:d(e,t)}),T&&a(n,{icon:`trash-2`,label:`${_} ${t+1}`,danger:!0,className:`repeater-remove`,onClick:()=>m(t)})]},e.id??t)}),g===`link`?a(i,{animation:`static`,size:`sm`,linkComponent:`button`,type:`button`,leftIcon:`plus`,className:`repeater-add`,disabled:w,onClick:p,children:h}):a(r,{variant:g,size:`sm`,leftIcon:`plus`,className:`repeater-add`,disabled:w,onClick:p,children:h})]})}export{s as default};

package/dist/components/AppSelect.js

@@ -1 +1 @@
-import{splitMarkerProps as e}from"../lib/wuiMarker.js";import t from"./warnInvalidValue.js";import n from"./warnUnknownProps.js";import ee from"../lib/FieldMessage.js";import r from"./AppInfoTip.js";import i from"./AppRequiredMark.js";import a from"./useNodeLabels.js";import o,{optionsEqual as te}from"./useWuiControl.js";import{forwardRef as s,useEffect as ne,useId as c,useLayoutEffect as l,useRef as u}from"react";import{Fragment as d,jsx as f,jsxs as p}from"react/jsx-runtime";import"@webority/ui-elements/elements/select";var m=[`sm`,`lg`,`xl`],h=[`off`,`border`,`above`],g=(e,t)=>({value:e.value,label:t,icon:e.icon}),_=s(function(s,_){let{marker:v,props:re}=e(`AppSelect`,s),{value:y,onChange:ie,options:b=[],placeholder:ae=`Select...`,searchPlaceholder:oe=`Search...`,emptyText:se,searchable:ce=!1,clearable:le=!1,size:x,icon:ue,compact:S=!1,valuePrefix:C,prefix:w,suffix:T,floatingLabel:E=`off`,disabled:D,open:O,label:k,required:A=!1,error:j,hint:M,help:N,helpLabel:P=`More information`,id:F,name:I,className:L=``,fieldClassName:de=``,"aria-label":R,"aria-labelledby":z,"aria-describedby":B,...V}=re;n(`AppSelect`,V),t(`AppSelect`,`size`,x,m),t(`AppSelect`,`floatingLabel`,E,h);let H=c(),{setRef:fe,innerRef:U}=o({ref:_,value:y??``,onChange:ie}),{portal:pe,toElementOptions:W}=a(b),G=u({el:null,options:null,map:null});l(()=>{let e=U.current;if(!e||G.current.el===e&&G.current.options===b&&G.current.map===W)return;G.current={el:e,options:b,map:W};let t=W(b,g);te(t,e.options)||(e.options=t)});let K=F||H,q=E!==`off`&&k,J=j&&K?`${K}-error`:void 0,Y=M&&K?`${K}-hint`:void 0,me=J||Y||B;ne(()=>{let e=U.current;e&&(C==null||C===``?e.removeAttribute(`prefix`):e.setAttribute(`prefix`,C))},[C,U]);let X=!q&&(w!=null||T!=null),Z=!k&&!j&&!M,Q=p(d,{children:[f(`wui-select`,{"aria-label":R||(typeof k==`string`?k:void 0),"aria-labelledby":z||void 0,"aria-describedby":me||void 0,"aria-invalid":j?`true`:void 0,ref:fe,value:y||void 0,id:K,name:I,placeholder:E!==`off`&&k?` `:ae,"search-placeholder":oe,"empty-text":se||void 0,searchable:ce?``:void 0,clearable:le?``:void 0,size:x||void 0,icon:ue||void 0,compact:S?``:void 0,disabled:D?``:void 0,open:O?``:void 0,required:A?``:void 0,className:L||void 0,...Z&&!X?v:null,...V}),pe]}),$=X?p(`div`,{...Z?v:null,className:`input-affixed`,children:[w!=null&&f(`span`,{className:`affix affix-pre`,children:w}),Q,T!=null&&f(`span`,{className:`affix affix-suf`,children:T})]}):Q;if(Z)return $;let he=[`field`,de].filter(Boolean).join(` `);return p(`div`,{...v,className:he,children:[k&&!q&&p(`label`,{className:`label`,htmlFor:K,children:[k,A&&f(i,{}),N&&f(r,{label:P,children:N})]}),q?p(`div`,{className:E===`above`?`field-float wui-float-above`:`field-float`,children:[Q,p(`label`,{className:`float-label`,htmlFor:K,children:[k,A&&f(i,{})]})]}):$,f(ee,{error:j,hint:M,errorId:J,hintId:Y})]})});export{_ as default};
+import{splitMarkerProps as e}from"../lib/wuiMarker.js";import t from"./warnInvalidValue.js";import n from"./warnUnknownProps.js";import ee from"../lib/FieldMessage.js";import r from"./AppInfoTip.js";import i from"./AppRequiredMark.js";import a from"./useNodeLabels.js";import o,{optionsEqual as te}from"./useWuiControl.js";import{forwardRef as s,useEffect as ne,useId as c,useLayoutEffect as l,useRef as u}from"react";import{Fragment as d,jsx as f,jsxs as p}from"react/jsx-runtime";import"@webority/ui-elements/elements/select";var m=[`sm`,`lg`,`xl`],h=[`off`,`border`,`above`],g=(e,t)=>({value:e.value,label:t,icon:e.icon}),_=s(function(s,_){let{marker:v,props:y}=e(`AppSelect`,s),{value:b,onChange:re,options:x=[],placeholder:ie=`Select...`,searchPlaceholder:ae=`Search...`,emptyText:oe,searchable:se=!1,clearable:ce=!1,size:S,icon:le,compact:ue=!1,valuePrefix:C,prefix:w,suffix:T,floatingLabel:E=`off`,disabled:D,open:O,label:k,required:A=!1,optional:j=!1,error:M,hint:N,help:P,helpLabel:F=`More information`,id:I,name:L,className:R=``,fieldClassName:de=``,"aria-label":z,"aria-labelledby":B,"aria-describedby":V,...H}=y;n(`AppSelect`,H),t(`AppSelect`,`size`,S,m),t(`AppSelect`,`floatingLabel`,E,h);let fe=c(),{setRef:pe,innerRef:U}=o({ref:_,value:b??``,onChange:re}),{portal:me,toElementOptions:W}=a(x),G=u({el:null,options:null,map:null});l(()=>{let e=U.current;if(!e||G.current.el===e&&G.current.options===x&&G.current.map===W)return;G.current={el:e,options:x,map:W};let t=W(x,g);te(t,e.options)||(e.options=t)});let K=I||fe,q=E!==`off`&&k,J=M&&K?`${K}-error`:void 0,Y=N&&K?`${K}-hint`:void 0,he=J||Y||V;ne(()=>{let e=U.current;e&&(C==null||C===``?e.removeAttribute(`prefix`):e.setAttribute(`prefix`,C))},[C,U]);let X=!q&&(w!=null||T!=null),Z=!k&&!M&&!N,Q=p(d,{children:[f(`wui-select`,{"aria-label":z||(typeof k==`string`?k:void 0),"aria-labelledby":B||void 0,"aria-describedby":he||void 0,"aria-invalid":M?`true`:void 0,ref:pe,value:b||void 0,id:K,name:L,placeholder:E!==`off`&&k?` `:ie,"search-placeholder":ae,"empty-text":oe||void 0,searchable:se?``:void 0,clearable:ce?``:void 0,size:S||void 0,icon:le||void 0,compact:ue?``:void 0,disabled:D?``:void 0,open:O?``:void 0,required:A?``:void 0,className:R||void 0,...Z&&!X?v:null,...H}),me]}),$=X?p(`div`,{...Z?v:null,className:`input-affixed`,children:[w!=null&&f(`span`,{className:`affix affix-pre`,children:w}),Q,T!=null&&f(`span`,{className:`affix affix-suf`,children:T})]}):Q;if(Z)return $;let ge=[`field`,de].filter(Boolean).join(` `);return p(`div`,{...v,className:ge,children:[k&&!q&&p(`label`,{className:`label`,htmlFor:K,children:[k,j&&!A&&f(`span`,{className:`label-optional`,children:` (optional)`}),A&&f(i,{}),P&&f(r,{label:F,children:P})]}),q?p(`div`,{className:E===`above`?`field-float wui-float-above`:`field-float`,children:[Q,p(`label`,{className:`float-label`,htmlFor:K,children:[k,j&&!A&&f(`span`,{className:`label-optional`,children:` (optional)`}),A&&f(i,{})]})]}):$,f(ee,{error:M,hint:N,errorId:J,hintId:Y})]})});export{_ as default};

package/dist/components/AppSlider.js

@@ -1 +1 @@
-import{splitMarkerProps as e}from"../lib/wuiMarker.js";import t from"./warnInvalidValue.js";import n from"./warnUnknownProps.js";import r from"../lib/FieldMessage.js";import i from"./AppRequiredMark.js";import a,{readRange as o,writeNumberValue as s}from"./useWuiControl.js";import{forwardRef as c,useEffect as l,useId as u}from"react";import{jsx as d,jsxs as f}from"react/jsx-runtime";import"@webority/ui-elements/elements/slider";var p=[`sm`,`md`,`lg`],m=c(function(c,m){let{marker:h,props:g}=e(`AppSlider`,c),{value:_,start:v,end:y,range:b=!1,onChange:x,label:S,required:C=!1,hint:w,error:T,name:E,startName:D,endName:O,min:k=0,max:A=100,step:j=1,disabled:M,size:N,showValue:P,unit:F,id:I,ariaLabel:L,className:R=``,fieldClassName:z=``,...B}=g;n(`AppSlider`,B),t(`AppSlider`,`size`,N,p);let V=u(),H=I||V,U=b,{setRef:W,innerRef:G}=a({ref:m,value:U?void 0:_,onChange:x,readValue:U?o:void 0,writeValue:U?void 0:s});l(()=>{if(!U)return;let e=G.current;e&&(v!==void 0&&v>e.end?(y!==void 0&&e.end!==y&&(e.end=y),v!==void 0&&e.start!==v&&(e.start=v)):(v!==void 0&&e.start!==v&&(e.start=v),y!==void 0&&e.end!==y&&(e.end=y)))},[v,y,U,G]);let K=!S&&!T&&!w,q=T?`${H}-error`:void 0,J=w?`${H}-hint`:void 0,Y=d(`wui-slider`,{ref:W,id:H,name:E||void 0,"start-name":D||void 0,"end-name":O||void 0,min:k,max:A,step:j,size:N||void 0,"aria-label":L||(typeof S==`string`?S:void 0),"aria-describedby":q||J,"aria-invalid":T?`true`:void 0,disabled:M?``:void 0,required:C?``:void 0,range:U?``:void 0,"show-value":P?``:void 0,unit:F||void 0,className:R||void 0,...K?h:null,...B});return K?Y:f(`div`,{...h,className:`field${z?` ${z}`:``}`,children:[S&&f(`label`,{className:`label`,htmlFor:H,children:[S,C&&d(i,{})]}),Y,d(r,{error:T,hint:w,errorId:q,hintId:J})]})});export{m as default};
+import{splitMarkerProps as e}from"../lib/wuiMarker.js";import t from"./warnInvalidValue.js";import n from"./warnUnknownProps.js";import r from"../lib/FieldMessage.js";import i from"./AppRequiredMark.js";import a,{readRange as o,writeNumberValue as s}from"./useWuiControl.js";import{forwardRef as c,useEffect as l,useId as u}from"react";import{jsx as d,jsxs as f}from"react/jsx-runtime";import"@webority/ui-elements/elements/slider";var p=[`sm`,`md`,`lg`],m=c(function(c,m){let{marker:h,props:g}=e(`AppSlider`,c),{value:_,start:v,end:y,range:b=!1,onChange:x,label:S,required:C=!1,optional:w=!1,hint:T,error:E,name:D,startName:O,endName:k,min:A=0,max:j=100,step:M=1,disabled:N,size:P,showValue:F,unit:I,id:L,ariaLabel:R,className:z=``,fieldClassName:B=``,...V}=g;n(`AppSlider`,V),t(`AppSlider`,`size`,P,p);let H=u(),U=L||H,W=b,{setRef:G,innerRef:K}=a({ref:m,value:W?void 0:_,onChange:x,readValue:W?o:void 0,writeValue:W?void 0:s});l(()=>{if(!W)return;let e=K.current;e&&(v!==void 0&&v>e.end?(y!==void 0&&e.end!==y&&(e.end=y),v!==void 0&&e.start!==v&&(e.start=v)):(v!==void 0&&e.start!==v&&(e.start=v),y!==void 0&&e.end!==y&&(e.end=y)))},[v,y,W,K]);let q=!S&&!E&&!T,J=E?`${U}-error`:void 0,Y=T?`${U}-hint`:void 0,X=d(`wui-slider`,{ref:G,id:U,name:D||void 0,"start-name":O||void 0,"end-name":k||void 0,min:A,max:j,step:M,size:P||void 0,"aria-label":R||(typeof S==`string`?S:void 0),"aria-describedby":J||Y,"aria-invalid":E?`true`:void 0,disabled:N?``:void 0,required:C?``:void 0,range:W?``:void 0,"show-value":F?``:void 0,unit:I||void 0,className:z||void 0,...q?h:null,...V});return q?X:f(`div`,{...h,className:`field${B?` ${B}`:``}`,children:[S&&f(`label`,{className:`label`,htmlFor:U,children:[S,w&&!C&&d(`span`,{className:`label-optional`,children:` (optional)`}),C&&d(i,{})]}),X,d(r,{error:E,hint:T,errorId:J,hintId:Y})]})});export{m as default};

package/dist/components/AppTagInput.js

@@ -1 +1 @@
-import{splitMarkerProps as e}from"../lib/wuiMarker.js";import t from"./warnInvalidValue.js";import n from"./warnUnknownProps.js";import r from"../lib/FieldMessage.js";import i from"./AppInfoTip.js";import a from"./AppRequiredMark.js";import o,{readValues as s,writeValues as c}from"./useWuiControl.js";import{forwardRef as l,useId as u}from"react";import{jsx as d,jsxs as f}from"react/jsx-runtime";import"@webority/ui-elements/elements/taginput";var p=[`sm`,`lg`],m=l(function(l,m){let{marker:h,props:g}=e(`AppTagInput`,l),{values:_,onChange:v,placeholder:y=`Add…`,name:b,label:x,error:S,hint:C,required:w=!1,size:T,maxTags:E,allowDuplicates:D=!1,disabled:O=!1,id:k,ariaLabel:A,className:j=``,fieldClassName:M=``,help:N,helpLabel:P=`More information`,...F}=g;n(`AppTagInput`,F),t(`AppTagInput`,`size`,T,p);let I=u(),L=k||I,{setRef:R}=o({ref:m,value:_,onChange:v,readValue:s,writeValue:c});return f(`div`,{...h,className:`field${M?` ${M}`:``}`,children:[x&&f(`label`,{className:`label`,htmlFor:L,children:[x,w&&d(a,{}),N&&d(i,{label:P,children:N})]}),d(`wui-taginput`,{"aria-label":A||(typeof x==`string`?x:void 0),"aria-describedby":S?`${L}-error`:C?`${L}-hint`:void 0,"aria-invalid":S?`true`:void 0,id:L,ref:R,name:b,placeholder:y,size:T||void 0,"max-tags":E===void 0?void 0:String(E),"allow-duplicates":D?``:void 0,disabled:O?``:void 0,required:w?``:void 0,className:j||void 0,...F}),d(r,{error:S,hint:C,errorId:`${L}-error`,hintId:`${L}-hint`})]})});export{m as default};
+import{splitMarkerProps as e}from"../lib/wuiMarker.js";import t from"./warnInvalidValue.js";import n from"./warnUnknownProps.js";import r from"../lib/FieldMessage.js";import i from"./AppInfoTip.js";import a from"./AppRequiredMark.js";import o,{readValues as s,writeValues as c}from"./useWuiControl.js";import{forwardRef as l,useId as u}from"react";import{jsx as d,jsxs as f}from"react/jsx-runtime";import"@webority/ui-elements/elements/taginput";var p=[`sm`,`lg`],m=l(function(l,m){let{marker:h,props:g}=e(`AppTagInput`,l),{values:_,onChange:v,placeholder:y=`Add…`,name:b,label:x,error:S,hint:C,required:w=!1,optional:T=!1,size:E,maxTags:D,allowDuplicates:O=!1,disabled:k=!1,id:A,ariaLabel:j,className:M=``,fieldClassName:N=``,help:P,helpLabel:F=`More information`,...I}=g;n(`AppTagInput`,I),t(`AppTagInput`,`size`,E,p);let L=u(),R=A||L,{setRef:z}=o({ref:m,value:_,onChange:v,readValue:s,writeValue:c});return f(`div`,{...h,className:`field${N?` ${N}`:``}`,children:[x&&f(`label`,{className:`label`,htmlFor:R,children:[x,T&&!w&&d(`span`,{className:`label-optional`,children:` (optional)`}),w&&d(a,{}),P&&d(i,{label:F,children:P})]}),d(`wui-taginput`,{"aria-label":j||(typeof x==`string`?x:void 0),"aria-describedby":S?`${R}-error`:C?`${R}-hint`:void 0,"aria-invalid":S?`true`:void 0,id:R,ref:z,name:b,placeholder:y,size:E||void 0,"max-tags":D===void 0?void 0:String(D),"allow-duplicates":O?``:void 0,disabled:k?``:void 0,required:w?``:void 0,className:M||void 0,...I}),d(r,{error:S,hint:C,errorId:`${R}-error`,hintId:`${R}-hint`})]})});export{m as default};

package/dist/components/AppTimePicker.js

@@ -1 +1 @@
-import{splitMarkerProps as e}from"../lib/wuiMarker.js";import t from"./warnInvalidValue.js";import n from"./warnUnknownProps.js";import r from"../lib/FieldMessage.js";import i from"./AppInfoTip.js";import a from"./AppRequiredMark.js";import o from"./useWuiControl.js";import{cloneElement as s,forwardRef as c,useId as l}from"react";import{jsx as u,jsxs as d}from"react/jsx-runtime";import"@webority/ui-elements/elements/timepicker";var f=[`sm`,`md`,`lg`],p=[`12`,`24`],m=c(function(c,m){let{marker:h,props:g}=e(`AppTimePicker`,c),{value:_,onChange:v,label:y,required:b=!1,hint:x,error:S,help:C,helpLabel:w=`More information`,name:T,min:E,max:D,step:O,format:k=24,placeholder:A=`Select time`,disabled:j,size:M,id:N,ariaLabel:P,className:F=``,fieldClassName:I=``,...L}=g;n(`AppTimePicker`,L),t(`AppTimePicker`,`size`,M,f);let R=String(k);t(`AppTimePicker`,`format`,R,p);let z=l(),B=N||T||z,{setRef:V}=o({ref:m,value:_??``,onChange:v}),H=!y&&!S&&!x,U=S?`${B}-error`:void 0,W=x?`${B}-hint`:void 0,G=u(`wui-timepicker`,{ref:V,value:_||void 0,id:B,name:T,min:E,max:D,step:O==null?void 0:String(O),format:R,placeholder:A,size:M||void 0,"aria-label":P||(typeof y==`string`?y:void 0),"aria-describedby":U||W,"aria-invalid":S?`true`:void 0,disabled:j?``:void 0,required:b?``:void 0,className:F||void 0,...L});return H?s(G,h):d(`div`,{...h,className:`field${I?` ${I}`:``}`,children:[y&&d(`label`,{className:`label`,htmlFor:B,children:[y,b&&u(a,{}),C&&u(i,{label:w,children:C})]}),G,u(r,{error:S,hint:x,errorId:U,hintId:W})]})});export{m as default};
+import{splitMarkerProps as e}from"../lib/wuiMarker.js";import t from"./warnInvalidValue.js";import n from"./warnUnknownProps.js";import r from"../lib/FieldMessage.js";import i from"./AppInfoTip.js";import a from"./AppRequiredMark.js";import o from"./useWuiControl.js";import{cloneElement as s,forwardRef as c,useId as l}from"react";import{jsx as u,jsxs as d}from"react/jsx-runtime";import"@webority/ui-elements/elements/timepicker";var f=[`sm`,`md`,`lg`],p=[`12`,`24`],m=c(function(c,m){let{marker:h,props:g}=e(`AppTimePicker`,c),{value:_,onChange:v,label:y,required:b=!1,optional:x=!1,hint:S,error:C,help:w,helpLabel:T=`More information`,name:E,min:D,max:O,step:k,format:A=24,placeholder:j=`Select time`,disabled:M,size:N,id:P,ariaLabel:F,className:I=``,fieldClassName:L=``,...R}=g;n(`AppTimePicker`,R),t(`AppTimePicker`,`size`,N,f);let z=String(A);t(`AppTimePicker`,`format`,z,p);let B=l(),V=P||E||B,{setRef:H}=o({ref:m,value:_??``,onChange:v}),U=!y&&!C&&!S,W=C?`${V}-error`:void 0,G=S?`${V}-hint`:void 0,K=u(`wui-timepicker`,{ref:H,value:_||void 0,id:V,name:E,min:D,max:O,step:k==null?void 0:String(k),format:z,placeholder:j,size:N||void 0,"aria-label":F||(typeof y==`string`?y:void 0),"aria-describedby":W||G,"aria-invalid":C?`true`:void 0,disabled:M?``:void 0,required:b?``:void 0,className:I||void 0,...R});return U?s(K,h):d(`div`,{...h,className:`field${L?` ${L}`:``}`,children:[y&&d(`label`,{className:`label`,htmlFor:V,children:[y,x&&!b&&u(`span`,{className:`label-optional`,children:` (optional)`}),b&&u(a,{}),w&&u(i,{label:T,children:w})]}),K,u(r,{error:C,hint:S,errorId:W,hintId:G})]})});export{m as default};