@webority/ui-react 0.40.0 → 0.41.1

package/dist/components/AppAvatar.js

@@ -1 +1 @@
-import e from"./warnInvalidValue.js";import t from"./warnUnknownProps.js";import n from"./withTooltip.js";import r from"./AppIcon.js";import{useEffect as i,useState as a}from"react";import{Fragment as o,jsx as s,jsxs as c}from"react/jsx-runtime";var l=[`circle`,`rounded`,`square`],u=[`primary`,`neutral`,`success`,`warning`,`danger`,`info`,`auto`],d=[`none`,`online`,`offline`,`away`,`busy`],f=new Set([`xs`,`sm`,`md`,`lg`,`xl`,`2xl`]),p={xs:20,sm:24,md:32,lg:48,xl:64,"2xl":96};function m(e){let t=(e||``).trim();if(!t)return`?`;let n=t.split(/\s+/).filter(Boolean);return n.length===1?n[0].slice(0,2).toUpperCase():(n[0][0]+n[n.length-1][0]).toUpperCase()}function h(e){let t=e||``,n=0;for(let e=0;e<t.length;e+=1)n=Math.imul(n,31)+t.charCodeAt(e)>>>0;return n%360}function g(e){if(typeof e==`number`)return e;if(p[e]!=null)return p[e];let t=Number.parseInt(e,10);return Number.isNaN(t)?32:t}function _({name:p,src:_,size:v=`md`,shape:y=`circle`,tone:b=`primary`,status:x=`none`,ring:S=!1,label:C,icon:w,badge:T,href:E,onClick:D,linkComponent:O,tooltip:k,tooltipPlacement:A,className:j=``,...M}){t(`AppAvatar`,M),e(`AppAvatar`,`shape`,y,l),e(`AppAvatar`,`tone`,b,u),e(`AppAvatar`,`status`,x,d);let{style:N,...P}=M,[F,I]=a(!1);i(()=>{I(!1)},[_]);let L=typeof v==`string`&&f.has(v),R=L?null:typeof v==`number`||/^\d+$/.test(v)?`${v}px`:v,z=E!=null||D!=null,B=_!=null&&_!==``&&!F,V=[`avatar`,L&&v!==`md`?`avatar-${v}`:``,y===`circle`?``:`avatar-${y}`,b===`primary`?``:`avatar-${b}`,S?`avatar-ring`:``,z?`avatar-clickable`:``,j].filter(Boolean).join(` `),H={};R&&(H[`--avatar-size`]=R),b===`auto`&&(H[`--avatar-hue`]=h(p));let U=Object.keys(H).length||N?{...H,...N}:void 0,W=s(`span`,{className:`avatar-face`,"aria-hidden":`true`,children:w==null?m(p):s(r,{name:w,size:Math.round(g(v)*.55)})}),G=c(o,{children:[x!==`none`&&s(`span`,{className:`avatar-status avatar-status-${x}`,"aria-hidden":`true`}),T!=null&&s(`span`,{className:`avatar-badge`,children:T}),C!=null&&s(`span`,{className:`avatar-label`,"aria-hidden":`true`,children:C})]}),K=c(o,{children:[W,B&&s(`img`,{className:`avatar-img`,src:_,alt:z?``:p||`Profile photo`,onError:()=>I(!0)}),G]});if(E!=null){let e=O||`a`,t=O?{to:E}:{href:E};return n(s(e,{className:V,style:U,...P,"aria-label":C||p,...t,onClick:D,children:K}),k,A)}return n(D==null?B?s(`span`,{className:V,style:U,...P,children:K}):s(`span`,{className:V,style:U,...P,role:`img`,"aria-label":p,children:K}):s(`button`,{type:`button`,className:V,style:U,...P,"aria-label":C||p,onClick:D,children:K}),k,A)}export{_ as default};
+import e from"./warnInvalidValue.js";import t from"./warnUnknownProps.js";import n from"./withTooltip.js";import r from"./AppIcon.js";import{initialsOf as i}from"../lib/initials.js";import{useEffect as a,useState as o}from"react";import{Fragment as s,jsx as c,jsxs as l}from"react/jsx-runtime";var u=[`circle`,`rounded`,`square`],d=[`primary`,`neutral`,`success`,`warning`,`danger`,`info`,`auto`],f=[`none`,`online`,`offline`,`away`,`busy`],p=new Set([`xs`,`sm`,`md`,`lg`,`xl`,`2xl`]),m={xs:20,sm:24,md:32,lg:48,xl:64,"2xl":96};function h(e){return i(e)||`?`}function g(e){let t=e||``,n=0;for(let e=0;e<t.length;e+=1)n=Math.imul(n,31)+t.charCodeAt(e)>>>0;return n%360}function _(e){if(typeof e==`number`)return e;if(m[e]!=null)return m[e];let t=Number.parseInt(e,10);return Number.isNaN(t)?32:t}function v({name:i,src:m,size:v=`md`,shape:y=`circle`,tone:b=`primary`,status:x=`none`,ring:S=!1,label:C,icon:w,badge:T,href:E,onClick:D,linkComponent:O,tooltip:k,tooltipPlacement:A,className:j=``,...M}){t(`AppAvatar`,M),e(`AppAvatar`,`shape`,y,u),e(`AppAvatar`,`tone`,b,d),e(`AppAvatar`,`status`,x,f);let{style:N,...P}=M,[F,I]=o(!1);a(()=>{I(!1)},[m]);let L=typeof v==`string`&&p.has(v),R=L?null:typeof v==`number`||/^\d+$/.test(v)?`${v}px`:v,z=E!=null||D!=null,B=m!=null&&m!==``&&!F,V=[`avatar`,L&&v!==`md`?`avatar-${v}`:``,y===`circle`?``:`avatar-${y}`,b===`primary`?``:`avatar-${b}`,S?`avatar-ring`:``,z?`avatar-clickable`:``,j].filter(Boolean).join(` `),H={};R&&(H[`--avatar-size`]=R),b===`auto`&&(H[`--avatar-hue`]=g(i));let U=Object.keys(H).length||N?{...H,...N}:void 0,W=c(`span`,{className:`avatar-face`,"aria-hidden":`true`,children:w==null?h(i):c(r,{name:w,size:Math.round(_(v)*.55)})}),G=l(s,{children:[x!==`none`&&c(`span`,{className:`avatar-status avatar-status-${x}`,"aria-hidden":`true`}),T!=null&&c(`span`,{className:`avatar-badge`,children:T}),C!=null&&c(`span`,{className:`avatar-label`,"aria-hidden":`true`,children:C})]}),K=l(s,{children:[W,B&&c(`img`,{className:`avatar-img`,src:m,alt:z?``:i||`Profile photo`,onError:()=>I(!0)}),G]});if(E!=null){let e=O||`a`,t=O?{to:E}:{href:E};return n(c(e,{className:V,style:U,...P,"aria-label":C||i,...t,onClick:D,children:K}),k,A)}return n(D==null?B?c(`span`,{className:V,style:U,...P,children:K}):c(`span`,{className:V,style:U,...P,role:`img`,"aria-label":i,children:K}):c(`button`,{type:`button`,className:V,style:U,...P,"aria-label":C||i,onClick:D,children:K}),k,A)}export{v as default};

package/dist/components/AppPhoneNumberInput.js

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

package/dist/components/AppShell.js

@@ -1 +1 @@
-import e from"./warnInvalidValue.js";import t from"./warnUnknownProps.js";import n from"./AppIcon.js";import r from"./AppAvatar.js";import{navMatchScore as i}from"../lib/navMatch.js";import{readShellCollapsed as a,writeShellCollapsed as o}from"../lib/shellCookie.js";import{initScrollEdges as s}from"@webority/ui-elements/helpers";import{useEffect as c,useId as l,useMemo as u,useRef as d,useState as f}from"react";import{Fragment as p,jsx as m,jsxs as h}from"react/jsx-runtime";var g=99,_=4,v=5,y=[`prefix`,`exact`],b=e=>e>g?`${g}+`:String(e);function x({groups:e=[],brand:r,sidebarStart:i,sidebarStartCompact:l,sidebarFooter:d,topbarStart:p,topbarEnd:g,footer:_,children:v,collapsed:y,onCollapsedChange:b,noSidebar:x=!1,navLabel:E=`Main navigation`,linkComponent:k,currentPath:j,rememberCollapsed:M=!1,collapsedCookie:N=`wui-shell-collapsed`,tabBarLabel:P=`Quick navigation`,moreLabel:F=`More`,userMenu:I,notifications:L,search:R,className:z=``,...B}){t(`AppShell`,B);let[V,H]=f(()=>M&&y===void 0&&typeof document<`u`?a(N)??!1:!1),[U,W]=f(!1),[G,K]=f(!1),q=y??V,J=()=>{let e=!q;y===void 0&&H(e),M&&o(e,N),b?.(e)},Y=u(()=>S(e,j),[e,j]),X=x?null:C(Y);return c(()=>{let e=()=>K(window.scrollY>4);return e(),window.addEventListener(`scroll`,e,{passive:!0}),()=>window.removeEventListener(`scroll`,e)},[]),c(()=>{s()},[]),c(()=>{if(!U)return;let e=e=>{e.key===`Escape`&&W(!1)};return document.addEventListener(`keydown`,e),()=>document.removeEventListener(`keydown`,e)},[U]),h(`div`,{className:[`app-shell`,q?`collapsed`:``,x?`no-sidebar`:``,U?`mobile-open`:``,z].filter(Boolean).join(` `),...B,children:[h(`aside`,{className:`app-sidebar`,children:[r&&m(`div`,{className:`app-sidebar-brand`,children:r}),i&&m(`div`,{className:`app-sidebar-start`,children:i}),l&&m(`div`,{className:`app-sidebar-start-compact`,children:l}),m(`nav`,{className:`app-sidebar-scroll`,"aria-label":E,children:Y.map((e,t)=>h(`div`,{className:`app-nav-group`,children:[e.label&&m(`div`,{className:`app-nav-group-label`,children:e.label}),e.items.map(e=>m(T,{item:e,linkComponent:k,onNavigate:()=>W(!1)},e.key??e.href??e.label)),e.after&&m(`div`,{className:`wui-nav-group-after`,children:e.after})]},e.label??`group-${t}`))}),d&&m(`div`,{className:`app-sidebar-foot`,children:d}),!x&&m(`button`,{type:`button`,className:`app-sidebar-toggle`,onClick:J,"aria-label":q?`Expand navigation`:`Collapse navigation`,"aria-expanded":!q,children:m(n,{name:`chevrons-left`,size:20})})]}),h(`div`,{className:`app-main`,children:[h(`header`,{className:`app-topbar${G?` scrolled`:``}`,children:[h(`div`,{className:`app-topbar-start`,children:[m(`button`,{type:`button`,className:`app-topbar-menu`,onClick:()=>W(!0),"aria-label":`Open navigation`,"aria-expanded":U,children:m(n,{name:`menu`,size:18})}),p,R&&m(A,{config:R})]}),h(`div`,{className:`app-topbar-end`,children:[g,L&&m(O,{config:L}),I&&m(D,{config:I,linkComponent:k})]})]}),m(`main`,{className:`app-content`,children:v}),_&&m(`footer`,{className:`app-footer`,children:_})]}),X&&h(`nav`,{className:`wui-tabbar`,"aria-label":P,children:[X.tabs.map(e=>m(w,{tab:e,linkComponent:k},e.key??e.href)),X.hasMore&&h(`button`,{type:`button`,className:`wui-tabbar-item${X.moreActive?` active`:``}`,onClick:()=>W(!0),children:[m(`span`,{className:`wui-tabbar-icon`,children:m(n,{name:`more`,size:24})}),m(`span`,{className:`wui-tabbar-label`,children:F})]})]}),m(`button`,{type:`button`,className:`app-scrim`,onClick:()=>W(!1),"aria-label":`Close navigation`,tabIndex:U?0:-1})]})}function S(t,n){let r=e=>(e??[]).map(e=>Array.isArray(e.children)?{...e,children:r(e.children)}:{...e}).filter(e=>(e.children?.length??0)>0||!!e.href),a=t.map(e=>({...e,items:r(e.items)})).filter(e=>e.items.length>0),o=[],s=e=>{for(let t of e)o.push(t),t.children&&s(t.children)};for(let e of a)s(e.items);for(let t of o)e(`AppShell`,`match`,t.match,y);let c=null;if(n!=null&&!o.some(e=>e.active===!0)){let e=-1;for(let t of o){if(t.active!=null||t.children?.length)continue;let r=i(n,t.href,{exact:t.match===`exact`,also:t.matchAlso});r>e&&(e=r,c=t)}}for(let e of o)e.active=e.active??e===c;return a}function C(e){let t=[],n=e=>{for(let r of e)r.children?.length?n(r.children):t.push(r)};for(let t of e)n(t.items);let r=t.filter(e=>e.tab);if(r.length===0)return null;let i=r.length<t.length,a=i?_:v;if(r.length>a)throw Error(`<AppShell>: ${r.length} items carry tab: true, but the phone tab bar holds ${a} (${i?`4 plus More, because other items exist`:`5 when every item is a tab`}). Flag fewer items.`);return{tabs:r,hasMore:i,moreActive:t.some(e=>!e.tab&&e.active)}}function w({tab:e,linkComponent:t}){let r=`wui-tabbar-item${e.active?` active`:``}`,i=h(p,{children:[e.icon&&m(`span`,{className:`wui-tabbar-icon`,children:typeof e.icon==`string`?m(n,{name:e.icon,size:24}):e.icon}),m(`span`,{className:`wui-tabbar-label`,children:e.tabLabel??e.label}),e.badge!=null&&m(`span`,{className:`wui-tabbar-badge${e.badgeTone?` tone-${e.badgeTone}`:``}`,children:e.badge})]}),a=e.active?`page`:void 0;return t?m(t,{className:r,to:e.href,"aria-current":a,children:i}):m(`a`,{className:r,href:e.href,"aria-current":a,children:i})}function T({item:e,linkComponent:t,onNavigate:r,depth:i=0}){let a=i>0,o=i>1?{"--wui-nav-depth":i}:void 0,s=Array.isArray(e.children)&&e.children.length>0,l=s&&e.children.some(e=>e.active),[u,d]=f(l);c(()=>{l&&!u&&d(!0)},[l,u]);let g=typeof e.label==`string`?e.label:void 0,_=!a&&e.icon&&m(`span`,{className:`app-nav-icon`,children:typeof e.icon==`string`?m(n,{name:e.icon,size:22}):e.icon}),v=e.badge!=null&&m(`span`,{className:`app-nav-badge${e.badgeTone?` tone-${e.badgeTone}`:``}`,children:e.badge});if(s)return h(p,{children:[h(`button`,{type:`button`,className:`app-nav-item${a?` app-nav-subitem`:``} has-children${l?` active`:``}`,style:o,"aria-expanded":u,"data-label":g,onClick:()=>d(e=>!e),children:[_,m(`span`,{className:`app-nav-text`,children:e.label}),v,m(`span`,{className:`app-nav-caret`,children:m(n,{name:`chevron-right`,size:16})})]}),m(`div`,{className:`app-nav-sub${u?` expanded`:``}`,inert:!u,"aria-hidden":!u||void 0,children:m(`div`,{className:`app-nav-sub-inner`,children:e.children.map(e=>m(T,{item:e,linkComponent:t,onNavigate:r,depth:i+1},e.key??e.href))})})]});let y=`app-nav-item${a?` app-nav-subitem`:``}${e.active?` active`:``}`,b=h(p,{children:[_,m(`span`,{className:`app-nav-text`,children:e.label}),v,e.trailingIcon&&m(`span`,{className:`app-nav-trailing`,children:typeof e.trailingIcon==`string`?m(n,{name:e.trailingIcon,size:16}):e.trailingIcon})]}),x=e.active?`page`:void 0;return t?m(t,{className:y,style:o,to:e.href,"aria-current":x,"data-label":g,onClick:r,children:b}):m(`a`,{className:y,style:o,href:e.href,"aria-current":x,"data-label":g,onClick:r,children:b})}function E(){let[e,t]=f(!1),n=d(null);return c(()=>{if(!e)return;let r=e=>{n.current?.contains(e.target)||t(!1)},i=e=>{e.key===`Escape`&&(t(!1),n.current?.querySelector(`button`)?.focus())};return document.addEventListener(`mousedown`,r),document.addEventListener(`keydown`,i),()=>{document.removeEventListener(`mousedown`,r),document.removeEventListener(`keydown`,i)}},[e]),{open:e,setOpen:t,ref:n}}function D({config:e,linkComponent:t}){let i=l(),{open:a,setOpen:o,ref:s}=E(),{name:c,role:u,photo:d,profileHref:f,profileLabel:g=`My profile`,onLogout:_,logoutAction:v,logoutLabel:y=`Sign out`,items:b=[]}=e;if(!c)throw Error(`<AppShell> userMenu.name is required; the trigger and the avatar are named from it.`);let x=()=>o(!1),S=(e,n,r,i)=>t?m(t,{className:`dropdown-item`,to:e,onClick:i,children:n},r):m(`a`,{className:`dropdown-item`,href:e,onClick:i,children:n},r),C=h(p,{children:[m(n,{name:`log-out`,size:18}),y]});return h(`div`,{className:`dropdown wui-usermenu`,ref:s,children:[h(`button`,{type:`button`,id:i,className:`wui-usermenu-trigger`,"aria-expanded":a,"aria-label":`Account menu for ${c}`,onClick:()=>o(e=>!e),children:[m(r,{name:c,src:d,tone:`auto`}),h(`span`,{className:`wui-usermenu-text`,children:[m(`span`,{className:`wui-usermenu-name`,children:c}),u&&m(`span`,{className:`wui-usermenu-role`,children:u})]}),m(n,{name:`chevron-down`,size:14,className:`wui-usermenu-caret`})]}),h(`div`,{className:`dropdown-menu dropdown-menu-end wui-usermenu-menu${a?` show`:``}`,"aria-labelledby":i,"data-bs-popper":a?`static`:void 0,children:[h(`div`,{className:`wui-usermenu-head`,children:[m(r,{name:c,src:d,size:`lg`,tone:`auto`}),h(`div`,{className:`wui-usermenu-who`,children:[m(`div`,{className:`wui-usermenu-name`,children:c}),u&&m(`div`,{className:`wui-usermenu-role`,children:u})]})]}),f&&S(f,h(p,{children:[m(n,{name:`user`,size:18}),g]}),void 0,x),b.map(e=>{if(e.divider)return m(`hr`,{className:`dropdown-divider`},e.key);let t=h(p,{children:[e.icon&&m(n,{name:e.icon,size:18}),e.label]}),r=()=>{e.onClick?.(),x()};return e.href?S(e.href,t,e.key,r):m(`button`,{type:`button`,className:`dropdown-item`,onClick:r,children:t},e.key)}),v?m(`form`,{method:`post`,action:v,className:`wui-usermenu-logout`,children:m(`button`,{type:`submit`,className:`dropdown-item danger`,children:C})}):_&&m(`button`,{type:`button`,className:`dropdown-item danger`,onClick:()=>{x(),_()},children:C})]})]})}function O({config:e}){let t=l(),{open:r,setOpen:i,ref:a}=E(),{unread:o=0,items:s,loading:u=!1,onOpen:g,onMarkAllRead:_,viewAllHref:v,label:y=`Notifications`,emptyText:x=`You are all caught up.`}=e,[S,C]=f(``),w=d(o);c(()=>{w.current!==o&&(w.current=o,C(o===0?`No unread notifications`:`${b(o)} unread notifications`))},[o]);let T=null;return s?.length?T=m(`div`,{className:`wui-bell-items`,children:s.map((e,t)=>{let r=`wui-bell-item${e.read?` wui-bell-item-read`:``}`,i=h(p,{children:[m(`span`,{className:`wui-bell-dot`,"aria-hidden":`true`}),e.icon&&m(`span`,{className:`wui-bell-icon`,children:m(n,{name:e.icon,size:18})}),h(`span`,{className:`wui-bell-body`,children:[!e.read&&m(`span`,{className:`visually-hidden`,children:`Unread: `}),m(`span`,{className:`wui-bell-item-title`,children:e.title}),e.time&&m(`span`,{className:`wui-bell-when`,children:e.time})]})]});return e.href?m(`a`,{className:r,href:e.href,"data-id":e.id,children:i},e.id??t):m(`div`,{className:r,"data-id":e.id,children:i},e.id??t)})}):u?T=m(`div`,{className:`wui-bell-state`,children:`Loading…`}):s&&(T=m(`div`,{className:`wui-bell-state`,children:x})),h(`div`,{className:`dropdown wui-bell`,ref:a,children:[h(`button`,{type:`button`,id:t,className:`topbar-icon-btn wui-bell-trigger`,"aria-expanded":r,"aria-label":o===0?y:`${y}, ${b(o)} unread`,onClick:()=>{let e=!r;i(e),e&&g?.()},children:[m(n,{name:`notification`,size:20}),m(`span`,{className:`wui-bell-count`,"aria-hidden":`true`,hidden:o===0,children:b(o)})]}),m(`span`,{className:`visually-hidden`,"aria-live":`polite`,children:S}),h(`div`,{className:`dropdown-menu dropdown-menu-end wui-bell-menu${r?` show`:``}`,"aria-labelledby":t,"data-bs-popper":r?`static`:void 0,children:[h(`div`,{className:`wui-bell-head`,children:[m(`span`,{className:`wui-bell-title`,children:y}),_&&m(`button`,{type:`button`,className:`wui-bell-markall`,onClick:_,children:`Mark all read`})]}),m(`div`,{className:`wui-bell-list`,"aria-busy":u||void 0,children:T}),v&&m(`a`,{className:`wui-bell-foot`,href:v,children:`View all`})]})]})}var k=e=>!!e&&(e.isContentEditable||/^(INPUT|TEXTAREA|SELECT)$/.test(e.tagName));function A({config:e}){let t=l(),{value:r=``,onChange:i,results:a=null,loading:o=!1,onSelect:s,onSubmit:p,placeholder:g=`Search`}=e,[_,v]=f(!1),[y,b]=f(!1),[x,S]=f({results:null,index:-1}),C=x.results===a?x.index:-1,w=e=>S({results:a,index:e}),T=d(null),E=d(null),D=d([]),O=u(()=>(a??[]).flatMap(e=>e.hits??[]),[a]),A=a!=null&&!y,j=O.length;c(()=>{let e=e=>{e.key!==`/`||e.ctrlKey||e.metaKey||e.altKey||k(e.target)||(e.preventDefault(),v(!0),E.current?.focus())},t=e=>{T.current?.contains(e.target)||(b(!0),v(!1))};return document.addEventListener(`keydown`,e),document.addEventListener(`pointerdown`,t),()=>{document.removeEventListener(`keydown`,e),document.removeEventListener(`pointerdown`,t)}},[]);let M=e=>{if(e.key===`ArrowDown`||e.key===`ArrowUp`){if(!A||j===0)return;e.preventDefault(),w((C+(e.key===`ArrowDown`?1:-1)+j)%j)}else e.key===`Enter`?A&&C>=0&&D.current[C]?(e.preventDefault(),D.current[C].click()):p&&r.trim()!==``&&(e.preventDefault(),p(r.trim())):e.key===`Escape`&&(A?(e.preventDefault(),b(!0)):_&&(e.preventDefault(),v(!1)))},N=-1;return D.current=[],h(`div`,{className:`wui-topsearch${_?` is-open`:``}${o?` is-loading`:``}`,ref:T,children:[m(`button`,{type:`button`,className:`topbar-icon-btn wui-topsearch-open`,"aria-label":g,"aria-expanded":_,"aria-controls":`${t}-panel`,onClick:()=>{let e=!_;v(e),e&&E.current?.focus()},children:m(n,{name:`search`,size:20})}),h(`div`,{className:`wui-topsearch-panel`,id:`${t}-panel`,children:[h(`div`,{className:`search-wrap`,children:[m(n,{name:`search`,size:18,className:`search-icon`}),m(`input`,{ref:E,type:`search`,className:`form-control input search-input`,id:`${t}-input`,placeholder:g,"aria-label":g,role:`combobox`,"aria-autocomplete":`list`,"aria-expanded":A,"aria-controls":`${t}-list`,"aria-activedescendant":A&&C>=0?`${t}-opt-${C}`:void 0,autoComplete:`off`,value:r,onChange:e=>{b(!1),i?.(e.target.value)},onKeyDown:M})]}),m(`div`,{className:`wui-topsearch-results`,id:`${t}-list`,role:`listbox`,"aria-label":`Search results`,hidden:!A,children:A&&h(`div`,{className:`wui-topsearch-groups`,role:`presentation`,children:[j===0&&h(`div`,{className:`wui-topsearch-empty`,role:`option`,"aria-disabled":`true`,"aria-selected":`false`,children:[`No results for “`,r,`”`]}),a.filter(e=>e.hits?.length).map((e,r)=>h(`div`,{className:`wui-topsearch-group`,role:`group`,"aria-label":e.label??``,children:[e.label&&m(`div`,{className:`wui-topsearch-group-label`,role:`presentation`,children:e.label}),e.hits.map(e=>{N+=1;let r=N;return h(`a`,{className:`wui-topsearch-hit${r===C?` is-active`:``}`,role:`option`,"aria-selected":r===C,id:`${t}-opt-${r}`,href:e.href,ref:e=>{D.current[r]=e},onClick:t=>s?.(e,t),children:[e.icon&&m(`span`,{className:`wui-topsearch-hit-icon`,children:m(n,{name:e.icon,size:18})}),h(`span`,{className:`wui-topsearch-hit-text`,children:[m(`span`,{className:`wui-topsearch-hit-title`,children:e.title}),e.subtitle&&m(`span`,{className:`wui-topsearch-hit-sub`,children:e.subtitle})]})]},`${e.href}-${r}`)})]},e.label??r))]})})]}),m(`span`,{className:`visually-hidden`,"aria-live":`polite`,children:A?j===0?`No results`:`${j} ${j===1?`result`:`results`}`:``})]})}export{x as default};
+import e from"./warnInvalidValue.js";import t from"./warnUnknownProps.js";import n from"./AppIcon.js";import r from"./AppAvatar.js";import{navMatchScore as i}from"../lib/navMatch.js";import{readShellCollapsed as a,writeShellCollapsed as o}from"../lib/shellCookie.js";import{initScrollEdges as s}from"@webority/ui-elements/helpers";import{useEffect as c,useId as l,useMemo as u,useRef as d,useState as f}from"react";import{Fragment as p,jsx as m,jsxs as h}from"react/jsx-runtime";var g=99,_=4,v=5,y=[`prefix`,`exact`],b=e=>e>g?`${g}+`:String(e);function x({groups:e=[],brand:r,sidebarStart:i,sidebarStartCompact:l,sidebarFooter:d,topbarStart:p,topbarEnd:g,footer:_,children:v,collapsed:y,onCollapsedChange:b,noSidebar:x=!1,navLabel:T=`Main navigation`,linkComponent:D,currentPath:A,rememberCollapsed:M=!1,collapsedCookie:N=`wui-shell-collapsed`,tabBarLabel:P=`Quick navigation`,moreLabel:F=`More`,userMenu:I,notifications:L,search:R,className:z=``,...B}){t(`AppShell`,B);let[V,H]=f(()=>M&&y===void 0&&typeof document<`u`?a(N)??!1:!1),[U,W]=f(!1),[G,K]=f(!1),q=y??V,J=()=>{let e=!q;y===void 0&&H(e),M&&o(e,N),b?.(e)},Y=u(()=>S(e,A),[e,A]),X=x?null:C(Y);return c(()=>{let e=()=>K(window.scrollY>4);return e(),window.addEventListener(`scroll`,e,{passive:!0}),()=>window.removeEventListener(`scroll`,e)},[]),c(()=>{s()},[]),c(()=>{if(!U)return;let e=e=>{e.key===`Escape`&&W(!1)};return document.addEventListener(`keydown`,e),()=>document.removeEventListener(`keydown`,e)},[U]),h(`div`,{className:[`app-shell`,q?`collapsed`:``,x?`no-sidebar`:``,U?`mobile-open`:``,z].filter(Boolean).join(` `),...B,children:[h(`aside`,{className:`app-sidebar`,children:[r&&m(`div`,{className:`app-sidebar-brand`,children:r}),i&&m(`div`,{className:`app-sidebar-start`,children:i}),l&&m(`div`,{className:`app-sidebar-start-compact`,children:l}),m(`nav`,{className:`app-sidebar-scroll`,"aria-label":T,children:Y.map((e,t)=>h(`div`,{className:`app-nav-group`,children:[e.label&&m(`div`,{className:`app-nav-group-label`,children:e.label}),e.items.map(e=>m(E,{item:e,linkComponent:D,onNavigate:()=>W(!1)},e.key??e.href??e.label)),e.after&&m(`div`,{className:`wui-nav-group-after`,children:e.after})]},e.label??`group-${t}`))}),d&&m(`div`,{className:`app-sidebar-foot`,children:d}),!x&&m(`button`,{type:`button`,className:`app-sidebar-toggle`,onClick:J,"aria-label":q?`Expand navigation`:`Collapse navigation`,"aria-expanded":!q,children:m(n,{name:`chevrons-left`,size:20})})]}),h(`div`,{className:`app-main`,children:[h(`header`,{className:`app-topbar${G?` scrolled`:``}`,children:[h(`div`,{className:`app-topbar-start`,children:[m(`button`,{type:`button`,className:`app-topbar-menu`,onClick:()=>W(!0),"aria-label":`Open navigation`,"aria-expanded":U,children:m(n,{name:`menu`,size:18})}),p,R&&m(j,{config:R})]}),h(`div`,{className:`app-topbar-end`,children:[g,L&&m(k,{config:L}),I&&m(O,{config:I,linkComponent:D})]})]}),m(`main`,{className:`app-content`,children:v}),_&&m(`footer`,{className:`app-footer`,children:_})]}),X&&h(`nav`,{className:`wui-tabbar`,"aria-label":P,children:[X.tabs.map(e=>m(w,{tab:e,linkComponent:D},e.key??e.href)),X.hasMore&&h(`button`,{type:`button`,className:`wui-tabbar-item${X.moreActive?` active`:``}`,onClick:()=>W(!0),children:[m(`span`,{className:`wui-tabbar-icon`,children:m(n,{name:`more`,size:24})}),m(`span`,{className:`wui-tabbar-label`,children:F})]})]}),m(`button`,{type:`button`,className:`app-scrim`,onClick:()=>W(!1),"aria-label":`Close navigation`,tabIndex:U?0:-1})]})}function S(t,n){let r=e=>(e??[]).map(e=>Array.isArray(e.children)?{...e,children:r(e.children)}:{...e}).filter(e=>(e.children?.length??0)>0||!!e.href),a=t.map(e=>({...e,items:r(e.items)})).filter(e=>e.items.length>0),o=[],s=e=>{for(let t of e)o.push(t),t.children&&s(t.children)};for(let e of a)s(e.items);for(let t of o)e(`AppShell`,`match`,t.match,y);let c=null;if(n!=null&&!o.some(e=>e.active===!0)){let e=-1;for(let t of o){if(t.active!=null||t.children?.length)continue;let r=i(n,t.href,{exact:t.match===`exact`,also:t.matchAlso});r>e&&(e=r,c=t)}}for(let e of o)e.active=e.active??e===c;return a}function C(e){let t=[],n=e=>{for(let r of e)r.children?.length?n(r.children):t.push(r)};for(let t of e)n(t.items);let r=t.filter(e=>e.tab);if(r.length===0)return null;let i=r.length<t.length,a=i?_:v;if(r.length>a)throw Error(`<AppShell>: ${r.length} items carry tab: true, but the phone tab bar holds ${a} (${i?`4 plus More, because other items exist`:`5 when every item is a tab`}). Flag fewer items.`);return{tabs:r,hasMore:i,moreActive:t.some(e=>!e.tab&&e.active)}}function w({tab:e,linkComponent:t}){let r=`wui-tabbar-item${e.active?` active`:``}`,i=h(p,{children:[e.icon&&m(`span`,{className:`wui-tabbar-icon`,children:typeof e.icon==`string`?m(n,{name:e.icon,size:24}):e.icon}),m(`span`,{className:`wui-tabbar-label`,children:e.tabLabel??e.label}),e.badge!=null&&m(`span`,{className:`wui-tabbar-badge${e.badgeTone?` tone-${e.badgeTone}`:``}`,children:e.badge})]}),a=e.active?`page`:void 0;return t?m(t,{className:r,to:e.href,"aria-current":a,children:i}):m(`a`,{className:r,href:e.href,"aria-current":a,children:i})}function T(e){for(let t of e){if(t.active)return t;let e=t.children?.length?T(t.children):void 0;if(e)return e}}function E({item:e,linkComponent:t,onNavigate:r,depth:i=0}){let a=i>0,o=i>1?{"--wui-nav-depth":i}:void 0,s=Array.isArray(e.children)&&e.children.length>0,l=s?T(e.children):void 0,u=!!l,d=l?l.key??l.href??l.label:null,[g,_]=f(u);c(()=>{d!=null&&_(!0)},[d]);let v=typeof e.label==`string`?e.label:void 0,y=!a&&e.icon&&m(`span`,{className:`app-nav-icon`,children:typeof e.icon==`string`?m(n,{name:e.icon,size:22}):e.icon}),b=e.badge!=null&&m(`span`,{className:`app-nav-badge${e.badgeTone?` tone-${e.badgeTone}`:``}`,children:e.badge});if(s)return h(p,{children:[h(`button`,{type:`button`,className:`app-nav-item${a?` app-nav-subitem`:``} has-children${u?` active`:``}`,style:o,"aria-expanded":g,"data-label":v,onClick:()=>_(e=>!e),children:[y,m(`span`,{className:`app-nav-text`,children:e.label}),b,m(`span`,{className:`app-nav-caret`,children:m(n,{name:`chevron-right`,size:16})})]}),m(`div`,{className:`app-nav-sub${g?` expanded`:``}`,inert:!g,"aria-hidden":!g||void 0,children:m(`div`,{className:`app-nav-sub-inner`,children:e.children.map(e=>m(E,{item:e,linkComponent:t,onNavigate:r,depth:i+1},e.key??e.href))})})]});let x=`app-nav-item${a?` app-nav-subitem`:``}${e.active?` active`:``}`,S=h(p,{children:[y,m(`span`,{className:`app-nav-text`,children:e.label}),b,e.trailingIcon&&m(`span`,{className:`app-nav-trailing`,children:typeof e.trailingIcon==`string`?m(n,{name:e.trailingIcon,size:16}):e.trailingIcon})]}),C=e.active?`page`:void 0;return t?m(t,{className:x,style:o,to:e.href,"aria-current":C,"data-label":v,onClick:r,children:S}):m(`a`,{className:x,style:o,href:e.href,"aria-current":C,"data-label":v,onClick:r,children:S})}function D(){let[e,t]=f(!1),n=d(null);return c(()=>{if(!e)return;let r=e=>{n.current?.contains(e.target)||t(!1)},i=e=>{e.key===`Escape`&&(t(!1),n.current?.querySelector(`button`)?.focus())};return document.addEventListener(`mousedown`,r),document.addEventListener(`keydown`,i),()=>{document.removeEventListener(`mousedown`,r),document.removeEventListener(`keydown`,i)}},[e]),{open:e,setOpen:t,ref:n}}function O({config:e,linkComponent:t}){let i=l(),{open:a,setOpen:o,ref:s}=D(),{name:c,role:u,photo:d,profileHref:f,profileLabel:g=`My profile`,onLogout:_,logoutAction:v,logoutLabel:y=`Sign out`,items:b=[]}=e;if(!c)throw Error(`<AppShell> userMenu.name is required; the trigger and the avatar are named from it.`);let x=()=>o(!1),S=(e,n,r,i)=>t?m(t,{className:`dropdown-item`,to:e,onClick:i,children:n},r):m(`a`,{className:`dropdown-item`,href:e,onClick:i,children:n},r),C=h(p,{children:[m(n,{name:`log-out`,size:18}),y]});return h(`div`,{className:`dropdown wui-usermenu`,ref:s,children:[h(`button`,{type:`button`,id:i,className:`wui-usermenu-trigger`,"aria-expanded":a,"aria-label":`Account menu for ${c}`,onClick:()=>o(e=>!e),children:[m(r,{name:c,src:d,tone:`auto`}),h(`span`,{className:`wui-usermenu-text`,children:[m(`span`,{className:`wui-usermenu-name`,children:c}),u&&m(`span`,{className:`wui-usermenu-role`,children:u})]}),m(n,{name:`chevron-down`,size:14,className:`wui-usermenu-caret`})]}),h(`div`,{className:`dropdown-menu dropdown-menu-end wui-usermenu-menu${a?` show`:``}`,"aria-labelledby":i,"data-bs-popper":a?`static`:void 0,children:[h(`div`,{className:`wui-usermenu-head`,children:[m(r,{name:c,src:d,size:`lg`,tone:`auto`}),h(`div`,{className:`wui-usermenu-who`,children:[m(`div`,{className:`wui-usermenu-name`,children:c}),u&&m(`div`,{className:`wui-usermenu-role`,children:u})]})]}),f&&S(f,h(p,{children:[m(n,{name:`user`,size:18}),g]}),void 0,x),b.map(e=>{if(e.divider)return m(`hr`,{className:`dropdown-divider`},e.key);let t=h(p,{children:[e.icon&&m(n,{name:e.icon,size:18}),e.label]}),r=()=>{e.onClick?.(),x()};return e.href?S(e.href,t,e.key,r):m(`button`,{type:`button`,className:`dropdown-item`,onClick:r,children:t},e.key)}),v?m(`form`,{method:`post`,action:v,className:`wui-usermenu-logout`,children:m(`button`,{type:`submit`,className:`dropdown-item danger`,children:C})}):_&&m(`button`,{type:`button`,className:`dropdown-item danger`,onClick:()=>{x(),_()},children:C})]})]})}function k({config:e}){let t=l(),{open:r,setOpen:i,ref:a}=D(),{unread:o=0,items:s,loading:u=!1,onOpen:g,onMarkAllRead:_,viewAllHref:v,label:y=`Notifications`,emptyText:x=`You are all caught up.`}=e,[S,C]=f(``),w=d(o);c(()=>{w.current!==o&&(w.current=o,C(o===0?`No unread notifications`:`${b(o)} unread notifications`))},[o]);let T=null;return s?.length?T=m(`div`,{className:`wui-bell-items`,children:s.map((e,t)=>{let r=`wui-bell-item${e.read?` wui-bell-item-read`:``}`,i=h(p,{children:[m(`span`,{className:`wui-bell-dot`,"aria-hidden":`true`}),e.icon&&m(`span`,{className:`wui-bell-icon`,children:m(n,{name:e.icon,size:18})}),h(`span`,{className:`wui-bell-body`,children:[!e.read&&m(`span`,{className:`visually-hidden`,children:`Unread: `}),m(`span`,{className:`wui-bell-item-title`,children:e.title}),e.time&&m(`span`,{className:`wui-bell-when`,children:e.time})]})]});return e.href?m(`a`,{className:r,href:e.href,"data-id":e.id,children:i},e.id??t):m(`div`,{className:r,"data-id":e.id,children:i},e.id??t)})}):u?T=m(`div`,{className:`wui-bell-state`,children:`Loading…`}):s&&(T=m(`div`,{className:`wui-bell-state`,children:x})),h(`div`,{className:`dropdown wui-bell`,ref:a,children:[h(`button`,{type:`button`,id:t,className:`topbar-icon-btn wui-bell-trigger`,"aria-expanded":r,"aria-label":o===0?y:`${y}, ${b(o)} unread`,onClick:()=>{let e=!r;i(e),e&&g?.()},children:[m(n,{name:`notification`,size:20}),m(`span`,{className:`wui-bell-count`,"aria-hidden":`true`,hidden:o===0,children:b(o)})]}),m(`span`,{className:`visually-hidden`,"aria-live":`polite`,children:S}),h(`div`,{className:`dropdown-menu dropdown-menu-end wui-bell-menu${r?` show`:``}`,"aria-labelledby":t,"data-bs-popper":r?`static`:void 0,children:[h(`div`,{className:`wui-bell-head`,children:[m(`span`,{className:`wui-bell-title`,children:y}),_&&m(`button`,{type:`button`,className:`wui-bell-markall`,onClick:_,children:`Mark all read`})]}),m(`div`,{className:`wui-bell-list`,"aria-busy":u||void 0,children:T}),v&&m(`a`,{className:`wui-bell-foot`,href:v,children:`View all`})]})]})}var A=e=>!!e&&(e.isContentEditable||/^(INPUT|TEXTAREA|SELECT)$/.test(e.tagName));function j({config:e}){let t=l(),{value:r=``,onChange:i,results:a=null,loading:o=!1,onSelect:s,onSubmit:p,placeholder:g=`Search`}=e,[_,v]=f(!1),[y,b]=f(!1),[x,S]=f({results:null,index:-1}),C=x.results===a?x.index:-1,w=e=>S({results:a,index:e}),T=d(null),E=d(null),D=d([]),O=u(()=>(a??[]).flatMap(e=>e.hits??[]),[a]),k=a!=null&&!y,j=O.length;c(()=>{let e=e=>{e.key!==`/`||e.ctrlKey||e.metaKey||e.altKey||A(e.target)||(e.preventDefault(),v(!0),E.current?.focus())},t=e=>{T.current?.contains(e.target)||(b(!0),v(!1))};return document.addEventListener(`keydown`,e),document.addEventListener(`pointerdown`,t),()=>{document.removeEventListener(`keydown`,e),document.removeEventListener(`pointerdown`,t)}},[]);let M=e=>{if(e.key===`ArrowDown`||e.key===`ArrowUp`){if(!k||j===0)return;e.preventDefault(),w((C+(e.key===`ArrowDown`?1:-1)+j)%j)}else e.key===`Enter`?k&&C>=0&&D.current[C]?(e.preventDefault(),D.current[C].click()):p&&r.trim()!==``&&(e.preventDefault(),p(r.trim())):e.key===`Escape`&&(k?(e.preventDefault(),b(!0)):_&&(e.preventDefault(),v(!1)))},N=-1;return D.current=[],h(`div`,{className:`wui-topsearch${_?` is-open`:``}${o?` is-loading`:``}`,ref:T,children:[m(`button`,{type:`button`,className:`topbar-icon-btn wui-topsearch-open`,"aria-label":g,"aria-expanded":_,"aria-controls":`${t}-panel`,onClick:()=>{let e=!_;v(e),e&&E.current?.focus()},children:m(n,{name:`search`,size:20})}),h(`div`,{className:`wui-topsearch-panel`,id:`${t}-panel`,children:[h(`div`,{className:`search-wrap`,children:[m(n,{name:`search`,size:18,className:`search-icon`}),m(`input`,{ref:E,type:`search`,className:`form-control input search-input`,id:`${t}-input`,placeholder:g,"aria-label":g,role:`combobox`,"aria-autocomplete":`list`,"aria-expanded":k,"aria-controls":`${t}-list`,"aria-activedescendant":k&&C>=0?`${t}-opt-${C}`:void 0,autoComplete:`off`,value:r,onChange:e=>{b(!1),i?.(e.target.value)},onKeyDown:M})]}),m(`div`,{className:`wui-topsearch-results`,id:`${t}-list`,role:`listbox`,"aria-label":`Search results`,hidden:!k,children:k&&h(`div`,{className:`wui-topsearch-groups`,role:`presentation`,children:[j===0&&h(`div`,{className:`wui-topsearch-empty`,role:`option`,"aria-disabled":`true`,"aria-selected":`false`,children:[`No results for “`,r,`”`]}),a.filter(e=>e.hits?.length).map((e,r)=>h(`div`,{className:`wui-topsearch-group`,role:`group`,"aria-label":e.label??``,children:[e.label&&m(`div`,{className:`wui-topsearch-group-label`,role:`presentation`,children:e.label}),e.hits.map(e=>{N+=1;let r=N;return h(`a`,{className:`wui-topsearch-hit${r===C?` is-active`:``}`,role:`option`,"aria-selected":r===C,id:`${t}-opt-${r}`,href:e.href,ref:e=>{D.current[r]=e},onClick:t=>s?.(e,t),children:[e.icon&&m(`span`,{className:`wui-topsearch-hit-icon`,children:m(n,{name:e.icon,size:18})}),h(`span`,{className:`wui-topsearch-hit-text`,children:[m(`span`,{className:`wui-topsearch-hit-title`,children:e.title}),e.subtitle&&m(`span`,{className:`wui-topsearch-hit-sub`,children:e.subtitle})]})]},`${e.href}-${r}`)})]},e.label??r))]})})]}),m(`span`,{className:`visually-hidden`,"aria-live":`polite`,children:k?j===0?`No results`:`${j} ${j===1?`result`:`results`}`:``})]})}export{x as default};

package/dist/components/AppWorkspaceSwitcher.js

@@ -1 +1 @@
-import e from"./warnInvalidValue.js";import t from"./warnUnknownProps.js";import n from"./AppIcon.js";import{forwardRef as r,useEffect as i,useMemo as a,useRef as o,useState as s}from"react";import{Dropdown as c}from"react-bootstrap";import{Fragment as l,jsx as u,jsxs as d}from"react/jsx-runtime";var f=[`sm`,`md`,`lg`],p=new Set([`ArrowUp`,`ArrowDown`,`ArrowLeft`,`ArrowRight`]);function m({tenants:r=[],currentId:l,onSelect:m,menuLabel:h,footerAction:y,linkComponent:b,searchable:x=!1,onCreate:S,canCreate:C=!1,createLabel:w=`Create workspace`,compact:T=!1,size:E=`md`,ariaLabel:D,...O}){let{onToggle:k,...A}=O;t(`AppWorkspaceSwitcher`,A),e(`AppWorkspaceSwitcher`,`size`,E,f);let[j,M]=s(``),[N,P]=s(!1),F=o(null),I=(e,t)=>{P(e),k?.(e,t)},L=r.find(e=>e.id===l)??r[0],R=a(()=>{let e=j.trim().toLowerCase();return!x||!e?r:r.filter(t=>String(t.name??``).toLowerCase().includes(e))},[r,j,x]);i(()=>{N&&x&&F.current?.focus()},[N,x]),i(()=>{if(!x)return;let e=F.current;if(!e)return;let t=e=>{if(p.has(e.key)){e.stopPropagation();return}e.key===`Escape`&&N&&(e.preventDefault(),e.stopPropagation(),I(!1,{source:`keydown`,originalEvent:e}))};return e.addEventListener(`keydown`,t),()=>e.removeEventListener(`keydown`,t)},[x,N]);let z=L?.name??``,B=D??`Workspace ${z}`;return d(c,{className:`workspace-switcher${E===`sm`?` workspace-switcher-sm`:``}${E===`lg`?` workspace-switcher-lg`:``}`,show:N,onToggle:I,...A,children:[u(c.Toggle,{as:v,compact:T,tenant:L,"aria-label":B}),d(c.Menu,{className:`workspace-switcher-menu`,renderOnMount:!0,popperConfig:{strategy:`fixed`},children:[h?u(`div`,{className:`workspace-switcher-menu-label`,children:h}):null,x?d(`div`,{className:`workspace-switcher-search`,children:[u(n,{name:`search`,size:14}),u(`input`,{ref:F,type:`search`,className:`workspace-switcher-search-input`,placeholder:`Search workspaces`,"aria-label":`Search workspaces`,value:j,onChange:e=>M(e.target.value)})]}):null,d(`div`,{className:`workspace-switcher-list`,children:[R.map(e=>d(c.Item,{as:`button`,type:`button`,className:`workspace-switcher-option${e.id===L?.id?` is-active`:``}`,onClick:()=>m?.(e),children:[u(g,{tenant:e}),u(`span`,{className:`workspace-switcher-option-name`,children:e.name}),e.badge?u(`span`,{className:`workspace-switcher-badge`,children:e.badge}):null,e.id===L?.id?u(n,{name:`check`,size:16,className:`workspace-switcher-tick`}):null]},e.id)),R.length===0?u(`div`,{className:`workspace-switcher-empty`,children:`No workspaces match.`}):null]}),C?d(c.Item,{as:`button`,type:`button`,className:`workspace-switcher-create`,onClick:()=>S?.(),children:[u(n,{name:`plus`,size:16}),w]}):null,y?u(`div`,{className:`workspace-switcher-footer`,children:_(y,b)}):null]})]})}function h(e){let t=String(e??``).trim().split(/\s+/).filter(Boolean);return t.length===0?``:(t[0][0]+(t.length>1?t[t.length-1][0]:``)).toUpperCase()}function g({tenant:e}){return e?.logoUrl?u(`img`,{className:`workspace-switcher-mark`,src:e.logoUrl,alt:``,loading:`lazy`}):u(`span`,{className:`workspace-switcher-mark`,children:h(e?.name)})}function _(e,t){if(typeof e!=`object`||!e||!(`label`in e))return e;let{label:r,icon:i,href:a}=e;return d(a?t??`a`:`button`,{className:`workspace-switcher-footer-action`,...a?t?{to:a}:{href:a}:{type:`button`},children:[i?u(n,{name:i,size:16}):null,r]})}var v=r(function({compact:e,tenant:t,"aria-label":r,className:i,...a},o){return d(`button`,{ref:o,type:`button`,className:`workspace-switcher-trigger${e?` is-compact`:``}`,"aria-haspopup":`true`,"aria-label":r,...a,children:[u(g,{tenant:t}),e?null:d(l,{children:[u(`span`,{className:`workspace-switcher-trigger-name`,children:t?.name}),u(n,{name:`chevrons-up-down`,size:16,className:`workspace-switcher-chevron`})]})]})});export{m as default};
+import e from"./warnInvalidValue.js";import t from"./warnUnknownProps.js";import n from"./AppIcon.js";import{initialsOf as r}from"../lib/initials.js";import{forwardRef as i,useEffect as a,useMemo as o,useRef as s,useState as c}from"react";import{Dropdown as l}from"react-bootstrap";import{Fragment as u,jsx as d,jsxs as f}from"react/jsx-runtime";var p=[`sm`,`md`,`lg`],m=new Set([`ArrowUp`,`ArrowDown`,`ArrowLeft`,`ArrowRight`]);function h({tenants:r=[],currentId:i,onSelect:u,menuLabel:h,footerAction:y,linkComponent:b,searchable:x=!1,onCreate:S,canCreate:C=!1,createLabel:w=`Create workspace`,compact:T=!1,size:E=`md`,ariaLabel:D,...O}){let{onToggle:k,...A}=O;t(`AppWorkspaceSwitcher`,A),e(`AppWorkspaceSwitcher`,`size`,E,p);let[j,M]=c(``),[N,P]=c(!1),F=s(null),I=(e,t)=>{P(e),k?.(e,t)},L=r.find(e=>e.id===i)??r[0],R=o(()=>{let e=j.trim().toLowerCase();return!x||!e?r:r.filter(t=>String(t.name??``).toLowerCase().includes(e))},[r,j,x]);a(()=>{N&&x&&F.current?.focus()},[N,x]),a(()=>{if(!x)return;let e=F.current;if(!e)return;let t=e=>{if(m.has(e.key)){e.stopPropagation();return}e.key===`Escape`&&N&&(e.preventDefault(),e.stopPropagation(),I(!1,{source:`keydown`,originalEvent:e}))};return e.addEventListener(`keydown`,t),()=>e.removeEventListener(`keydown`,t)},[x,N]);let z=L?.name??``,B=D??`Workspace ${z}`;return f(l,{className:`workspace-switcher${E===`sm`?` workspace-switcher-sm`:``}${E===`lg`?` workspace-switcher-lg`:``}`,show:N,onToggle:I,...A,children:[d(l.Toggle,{as:v,compact:T,tenant:L,"aria-label":B}),f(l.Menu,{className:`workspace-switcher-menu`,renderOnMount:!0,popperConfig:{strategy:`fixed`},children:[h?d(`div`,{className:`workspace-switcher-menu-label`,children:h}):null,x?f(`div`,{className:`workspace-switcher-search`,children:[d(n,{name:`search`,size:14}),d(`input`,{ref:F,type:`search`,className:`workspace-switcher-search-input`,placeholder:`Search workspaces`,"aria-label":`Search workspaces`,value:j,onChange:e=>M(e.target.value)})]}):null,f(`div`,{className:`workspace-switcher-list`,children:[R.map(e=>f(l.Item,{as:`button`,type:`button`,className:`workspace-switcher-option${e.id===L?.id?` is-active`:``}`,onClick:()=>u?.(e),children:[d(g,{tenant:e}),d(`span`,{className:`workspace-switcher-option-name`,children:e.name}),e.badge?d(`span`,{className:`workspace-switcher-badge`,children:e.badge}):null,e.id===L?.id?d(n,{name:`check`,size:16,className:`workspace-switcher-tick`}):null]},e.id)),R.length===0?d(`div`,{className:`workspace-switcher-empty`,children:`No workspaces match.`}):null]}),C?f(l.Item,{as:`button`,type:`button`,className:`workspace-switcher-create`,onClick:()=>S?.(),children:[d(n,{name:`plus`,size:16}),w]}):null,y?d(`div`,{className:`workspace-switcher-footer`,children:_(y,b)}):null]})]})}function g({tenant:e}){return e?.logoUrl?d(`img`,{className:`workspace-switcher-mark`,src:e.logoUrl,alt:``,loading:`lazy`}):d(`span`,{className:`workspace-switcher-mark`,children:r(e?.name,1)})}function _(e,t){if(typeof e!=`object`||!e||!(`label`in e))return e;let{label:r,icon:i,href:a}=e;return f(a?t??`a`:`button`,{className:`workspace-switcher-footer-action`,...a?t?{to:a}:{href:a}:{type:`button`},children:[i?d(n,{name:i,size:16}):null,r]})}var v=i(function({compact:e,tenant:t,"aria-label":r,className:i,...a},o){return f(`button`,{ref:o,type:`button`,className:`workspace-switcher-trigger${e?` is-compact`:``}`,"aria-haspopup":`true`,"aria-label":r,...a,children:[d(g,{tenant:t}),e?null:f(u,{children:[d(`span`,{className:`workspace-switcher-trigger-name`,children:t?.name}),d(n,{name:`chevrons-up-down`,size:16,className:`workspace-switcher-chevron`})]})]})});export{h as default};

package/dist/lib/initials.js

@@ -0,0 +1 @@
+var e=new Set([`pvt`,`private`,`ltd`,`limited`,`llp`,`llc`,`inc`,`corp`,`co`]),t=/\p{L}/u;function n(e){let t=``,n=0;for(let r of e)r===`(`?(n+=1,t+=` `):r===`)`?(n=Math.max(0,n-1),t+=` `):n===0&&(t+=r);return t}function r(e){return e.map(e=>{let t=e.toUpperCase();return Array.from(t).length===1?t:e}).join(``)}function i(i,a=2){let o=n(String(i??``)).split(/\s+/).map(e=>Array.from(e).filter(e=>t.test(e))).filter(t=>t.length>0&&!e.has(t.join(``).toLowerCase()));return o.length===0?``:o.length===1?r(o[0].slice(0,a)):r([o[0][0],o[1][0]])}export{i as initialsOf};

package/dist/types/components/AppFilterBar.d.ts

@@ -7,7 +7,8 @@
  * of strings for `multiEnum`, and `{ from, to }` (yyyy-MM-dd strings) for `dateRange`; the empty value
  * is "", [] and `{ from: "", to: "" }`. An `enum` shows as segments (with an "All" segment) up to three
  * options and as a clearable select beyond that. A `text` facet has no chip: its box shows the text
- * and clears itself.
+ * and clears itself. The controls, chips and Clear all share one row, the search box wider and
+ * selects and date ranges narrow; it wraps only when full, and each facet takes its own line on a phone.
  *
  * @param {object} props
  * @param {{ key: string, label: string, type: 'enum'|'multiEnum'|'dateRange'|'text',

package/dist/types/lib/initials.d.ts

@@ -0,0 +1,6 @@
+/**
+ * @param {string} [name]
+ * @param {number} [singleWordLetters=2] Letters a one-word name gives.
+ * @returns {string}
+ */
+export declare function initialsOf(name?: string, singleWordLetters?: number): string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@webority/ui-react",
-  "version": "0.40.0",
+  "version": "0.41.1",
   "description": "Webority shared React component library — App* primitives on react-bootstrap + the @webority/theme design system.",
   "license": "SEE LICENSE IN LICENSE",
   "type": "module",
@@ -27,8 +27,8 @@
   },
   "sideEffects": false,
   "dependencies": {
-    "@webority/theme": "0.40.0",
-    "@webority/ui-elements": "0.40.0"
+    "@webority/theme": "0.41.1",
+    "@webority/ui-elements": "0.41.1"
   },
   "peerDependencies": {
     "@webority/analytics": "^0.6.0 || ^0.7.0 || ^0.8.0 || ^0.9.0 || ^0.10.0 || ^0.11.0",