@webority/ui-react 0.83.2 → 0.83.3

package/dist/components/AppButton.js

@@ -1 +1 @@
-import e from"./warnInvalidValue.js";import t from"./warnUnknownProps.js";import{shortcutAria as n,shortcutChip as r}from"../lib/shortcutChip.js";import i from"./withTooltip.js";import a from"./AppIcon.js";import o from"./warnDeprecatedValue.js";import{Button as s}from"react-bootstrap";import{jsx as c,jsxs as l}from"react/jsx-runtime";var u={primary:`primary`,secondary:`secondary`,outline:`outline-primary`,ghost:`ghost`,text:`text`,danger:`danger`,success:`success`,"secondary-danger":`secondary-danger`,"outline-danger":`outline-danger`,light:`light`,warning:`warning`,neutral:`neutral`,"outline-light":`outline-light`,"outline-secondary":`outline-secondary`},d={subtle:{use:`neutral`,removeIn:`0.79.0`}};function f(e){return`btn-${u[d[e]?.use??e]??`primary`}`}var p={sm:14,md:16,lg:20},m=[`sheen`,`fill`,`expand`,`glow`,`roll`,`none`],h=[`rounded`,`pill`,`sharp`],g=[`linear`,`outline`,`bold`,`bulk`,`broken`,`twotone`],_=e=>e===`pill`||e===`sharp`?`wui-btn-shape-${e}`:``;function v(e){return l(`span`,{className:`wui-btn-roll`,children:[c(`span`,{className:`wui-btn-roll__a`,children:e}),c(`span`,{className:`wui-btn-roll__b`,"aria-hidden":`true`,children:e})]})}function y(e,t,n,r){if(!e)return null;let i=n=>typeof e==`string`?c(a,{name:e,size:p[t]??p.md,variant:r,className:n}):c(`span`,{className:[`d-inline-flex`,n].filter(Boolean).join(` `),children:e});return l(`span`,{className:n?`wui-btn-roll-ico wui-btn-pin-icon`:`wui-btn-roll-ico ms-2`,"aria-hidden":`true`,children:[i(),i(`wui-btn-roll-ico__next`)]})}function b(e,t,n,r){if(!e)return null;let i=t===`left`?`me-2`:`ms-2`;return typeof e==`string`?c(a,{name:e,size:p[n]??p.md,variant:r,className:i}):c(`span`,{className:`d-inline-flex ${i}`,children:e})}function x(e,t,n){return e?c(`span`,{className:`wui-btn-pin-icon`,"aria-hidden":`true`,children:typeof e==`string`?c(a,{name:e,size:p[t]??p.md,variant:n}):e}):null}function S({children:a,variant:f=`primary`,size:S=`md`,type:C=`button`,loading:w=!1,disabled:T=!1,block:E=!1,leftIcon:D=null,rightIcon:O=null,href:k,static:A=!1,tooltip:j,tooltipPlacement:M,shortcut:N,animation:P,pinRightIcon:F=!1,shape:I=`rounded`,iconVariant:L,className:R=``,...z}){t(`AppButton`,z),P!==void 0&&e(`AppButton`,`animation`,P,m);let B=P===`roll`&&!A,V=F&&O!=null&&O!==``&&!A&&!w;o(`AppButton`,`variant`,f,d);let H=d[f]?.use??f;if(e(`AppButton`,`variant`,H,Object.keys(u)),e(`AppButton`,`size`,S,Object.keys(p)),e(`AppButton`,`shape`,I,h),L!==void 0&&e(`AppButton`,`iconVariant`,L,g),A)return i(l(`span`,{className:[`btn`,`btn-${u[H]??`primary`}`,S===`sm`?`btn-sm`:S===`lg`?`btn-lg`:``,E?`w-100`:``,_(I),`btn-static`,R].filter(Boolean).join(` `),...z,children:[b(D,`left`,S,L),a,b(O,`right`,S,L)]}),j,M);let U=[E?`w-100`:``,w?`is-loading`:``,P&&m.includes(P)?`btn-anim-${P}`:``,V?`wui-btn-pin-end`:``,_(I),R].filter(Boolean).join(` `),W=(z.as===void 0||z.as===`button`)&&k===void 0&&z.to===void 0,G=W?{}:{role:void 0,tabIndex:T||w?-1:void 0},K=j!=null&&j!==``;return i(l(s,{type:W?C:void 0,href:k,variant:u[H]??`primary`,size:S===`md`?void 0:S,disabled:T||w,"aria-busy":w||void 0,"aria-keyshortcuts":n(N),className:U||void 0,...G,...z,children:[w&&c(`span`,{className:`spinner-border spinner-border-sm me-2`,"aria-hidden":`true`}),!w&&b(D,`left`,S,L),B?v(a):a,!w&&(B?y(O,S,V,L):V?x(O,S,L):b(O,`right`,S,L)),!K&&r(N)]}),j,M,N)}export{f as buttonVariantClass,S as default};
+import e from"./warnInvalidValue.js";import t from"./warnUnknownProps.js";import{shortcutAria as n,shortcutChip as r}from"../lib/shortcutChip.js";import i from"./withTooltip.js";import a from"./AppIcon.js";import o from"./warnDeprecatedValue.js";import{Button as s}from"react-bootstrap";import{jsx as c,jsxs as l}from"react/jsx-runtime";var u={primary:`primary`,secondary:`secondary`,outline:`outline-primary`,ghost:`ghost`,text:`text`,danger:`danger`,success:`success`,"secondary-danger":`secondary-danger`,"outline-danger":`outline-danger`,light:`light`,warning:`warning`,neutral:`neutral`,"outline-light":`outline-light`,"outline-secondary":`outline-secondary`},d={subtle:{use:`neutral`,removeIn:`0.79.0`}};function f(e){return`btn-${u[d[e]?.use??e]??`primary`}`}var p={sm:14,md:16,lg:20},m=[`sheen`,`fill`,`expand`,`glow`,`roll`,`none`],h=[`rounded`,`pill`,`sharp`],g=[`button`,`submit`,`reset`],_=[`linear`,`outline`,`bold`,`bulk`,`broken`,`twotone`],v=e=>e===`pill`||e===`sharp`?`wui-btn-shape-${e}`:``;function y(e){return l(`span`,{className:`wui-btn-roll`,children:[c(`span`,{className:`wui-btn-roll__a`,children:e}),c(`span`,{className:`wui-btn-roll__b`,"aria-hidden":`true`,children:e})]})}function b(e,t,n,r){if(!e)return null;let i=n=>typeof e==`string`?c(a,{name:e,size:p[t]??p.md,variant:r,className:n}):c(`span`,{className:[`d-inline-flex`,n].filter(Boolean).join(` `),children:e});return l(`span`,{className:n?`wui-btn-roll-ico wui-btn-pin-icon`:`wui-btn-roll-ico ms-2`,"aria-hidden":`true`,children:[i(),i(`wui-btn-roll-ico__next`)]})}function x(e,t,n,r){if(!e)return null;let i=t===`left`?`me-2`:`ms-2`;return typeof e==`string`?c(a,{name:e,size:p[n]??p.md,variant:r,className:i}):c(`span`,{className:`d-inline-flex ${i}`,children:e})}function S(e,t,n){return e?c(`span`,{className:`wui-btn-pin-icon`,"aria-hidden":`true`,children:typeof e==`string`?c(a,{name:e,size:p[t]??p.md,variant:n}):e}):null}function C({children:a,variant:f=`primary`,size:C=`md`,type:w=`button`,loading:T=!1,disabled:E=!1,block:D=!1,leftIcon:O=null,rightIcon:k=null,href:A,static:j=!1,tooltip:M,tooltipPlacement:N,shortcut:P,animation:F,pinRightIcon:I=!1,shape:L=`rounded`,iconVariant:R,className:z=``,...B}){t(`AppButton`,B),F!==void 0&&e(`AppButton`,`animation`,F,m);let V=F===`roll`&&!j,H=I&&k!=null&&k!==``&&!j&&!T;o(`AppButton`,`variant`,f,d);let U=d[f]?.use??f;if(e(`AppButton`,`variant`,U,Object.keys(u)),e(`AppButton`,`size`,C,Object.keys(p)),e(`AppButton`,`shape`,L,h),e(`AppButton`,`type`,w,g),R!==void 0&&e(`AppButton`,`iconVariant`,R,_),j){let e=[`btn`,`btn-${u[U]??`primary`}`,C===`sm`?`btn-sm`:C===`lg`?`btn-lg`:``,D?`w-100`:``,v(L),`btn-static`,z].filter(Boolean).join(` `),{onClick:t,...n}=B;return i(l(`span`,{className:e,...n,children:[x(O,`left`,C,R),a,x(k,`right`,C,R)]}),M,N)}let W=[D?`w-100`:``,T?`is-loading`:``,F&&m.includes(F)?`btn-anim-${F}`:``,H?`wui-btn-pin-end`:``,v(L),z].filter(Boolean).join(` `),G=(B.as===void 0||B.as===`button`)&&A===void 0&&B.to===void 0,K=G?{}:{role:void 0,tabIndex:E||T?-1:void 0},q=M!=null&&M!==``;return i(l(s,{type:G?w:void 0,href:A,variant:u[U]??`primary`,size:C===`md`?void 0:C,disabled:E||T,"aria-busy":T||void 0,"aria-keyshortcuts":n(P),className:W||void 0,...K,...B,children:[T&&c(`span`,{className:`spinner-border spinner-border-sm me-2`,"aria-hidden":`true`}),!T&&x(O,`left`,C,R),V?y(a):a,!T&&(V?b(k,C,H,R):H?S(k,C,R):x(k,`right`,C,R)),!q&&r(P)]}),M,N,P)}export{f as buttonVariantClass,C 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=[`comfortable`,`compact`],x=e=>e>g?`${g}+`:String(e);function S({groups:r=[],brand:i,sidebarStart:l,sidebarStartCompact:p,sidebarFooter:g,topbarStart:_,topbarEnd:v,footer:y,children:x,collapsed:S,onCollapsedChange:E,noSidebar:O=!1,density:j=`comfortable`,navLabel:N=`Main navigation`,linkComponent:P,currentPath:F,rememberCollapsed:I=!1,collapsedCookie:L=`wui-shell-collapsed`,tabBarLabel:R=`Quick navigation`,moreLabel:z=`More`,userMenu:B,notifications:V,search:H,className:U=``,...W}){t(`AppShell`,W),e(`AppShell`,`density`,j,b);let[G,K]=f(()=>I&&S===void 0&&typeof document<`u`?a(L)??!1:!1),[q,J]=f(!1),[Y,ee]=f(!1),[te,ne]=f(!1),X=d(null),Z=S??G,re=()=>{let e=!Z;S===void 0&&K(e),I&&o(e,L),E?.(e)},Q=u(()=>C(r,F),[r,F]),$=O?null:w(Q);return c(()=>{let e=()=>ee(window.scrollY>4);return e(),window.addEventListener(`scroll`,e,{passive:!0}),()=>window.removeEventListener(`scroll`,e)},[]),c(()=>{s()},[]),c(()=>{let e=X.current,t=e?.querySelector(`.app-nav-item[aria-current="page"]`);if(!e||!t)return;let n=t.getBoundingClientRect(),r=e.getBoundingClientRect();n.top<r.top?e.scrollTop-=r.top-n.top:n.bottom>r.bottom&&(e.scrollTop+=n.bottom-r.bottom)},[]),c(()=>{let e=X.current;if(!e)return;let t=()=>ne(e.scrollHeight>e.clientHeight);if(t(),typeof ResizeObserver>`u`)return;let n=new ResizeObserver(t);return n.observe(e),()=>n.disconnect()},[Q]),c(()=>{if(!q)return;let e=e=>{e.key===`Escape`&&J(!1)};return document.addEventListener(`keydown`,e),()=>document.removeEventListener(`keydown`,e)},[q]),h(`div`,{className:[`app-shell`,Z?`collapsed`:``,O?`no-sidebar`:``,q?`mobile-open`:``,U].filter(Boolean).join(` `),"data-density":j===`compact`?`compact`:void 0,...W,children:[m(`a`,{className:`wui-skip-link`,href:`#main-content`,children:`Skip to content`}),h(`aside`,{className:`app-sidebar`,children:[i&&m(`div`,{className:`app-sidebar-brand`,children:i}),l&&m(`div`,{className:`app-sidebar-start`,children:l}),p&&m(`div`,{className:`app-sidebar-start-compact`,children:p}),m(`nav`,{className:`app-sidebar-scroll`,"aria-label":N,ref:X,tabIndex:te?0:void 0,children:Q.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(D,{item:e,linkComponent:P,onNavigate:()=>J(!1)},e.key??e.href??e.label)),e.after&&m(`div`,{className:`wui-nav-group-after`,children:e.after})]},e.label??`group-${t}`))}),g&&m(`div`,{className:`app-sidebar-foot`,children:g}),!O&&m(`button`,{type:`button`,className:`app-sidebar-toggle`,onClick:re,"aria-label":Z?`Expand navigation`:`Collapse navigation`,"aria-expanded":!Z,children:m(n,{name:`chevrons-left`,size:20})})]}),h(`div`,{className:`app-main`,children:[h(`header`,{className:`app-topbar${Y?` scrolled`:``}`,children:[h(`div`,{className:`app-topbar-start`,children:[m(`button`,{type:`button`,className:`app-topbar-menu`,onClick:()=>J(!0),"aria-label":`Open navigation`,"aria-expanded":q,children:m(n,{name:`menu`,size:18})}),_,H&&m(M,{config:H})]}),h(`div`,{className:`app-topbar-end`,children:[v,V&&m(A,{config:V}),B&&m(k,{config:B,linkComponent:P})]})]}),m(`main`,{className:`app-content`,id:`main-content`,children:x}),y&&m(`footer`,{className:`app-footer`,children:y})]}),$&&h(`nav`,{className:`wui-tabbar`,"aria-label":R,children:[$.tabs.map(e=>m(T,{tab:e,linkComponent:P},e.key??e.href)),$.hasMore&&h(`button`,{type:`button`,className:`wui-tabbar-item${$.moreActive?` active`:``}`,onClick:()=>J(!0),children:[m(`span`,{className:`wui-tabbar-icon`,children:m(n,{name:`more`,size:24})}),m(`span`,{className:`wui-tabbar-label`,children:z})]})]}),m(`button`,{type:`button`,className:`app-scrim`,onClick:()=>J(!1),"aria-label":`Close navigation`,tabIndex:q?0:-1})]})}function C(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&&!t.href)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 w(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 T({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}`:``}`,title:e.badgeTitle||void 0,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 E(e){for(let t of e){if(t.active)return t;let e=t.children?.length?E(t.children):void 0;if(e)return e}}function D({item:e,linkComponent:t,onNavigate:r,depth:i=0}){let a=i>0,o=i>1?` wui-nav-depth-${Math.min(i,6)}`:``,s=Array.isArray(e.children)&&e.children.length>0,l=s?E(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}`:``}`,title:e.badgeTitle||void 0,children:e.badge}),x=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})]}),S=e.active?`page`:void 0;if(s){let s=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(D,{item:e,linkComponent:t,onNavigate:r,depth:i+1},e.key??e.href))})});if(e.href){let i=t?m(t,{className:`wui-nav-split-link`,to:e.href,"aria-current":S,onClick:r,children:x}):m(`a`,{className:`wui-nav-split-link`,href:e.href,"aria-current":S,onClick:r,children:x});return h(p,{children:[h(`div`,{className:`app-nav-item has-children wui-nav-split${a?` app-nav-subitem`:``}${u||e.active?` active`:``}${o}`,"data-label":v,children:[i,m(`button`,{type:`button`,className:`app-nav-caret wui-nav-split-toggle`,"aria-expanded":g,"aria-label":`Show or hide ${v??``} pages`,onClick:()=>_(e=>!e),children:m(n,{name:`chevron-right`,size:16})})]}),s]})}return h(p,{children:[h(`button`,{type:`button`,className:`app-nav-item${a?` app-nav-subitem`:``} has-children${u?` active`:``}${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})})]}),s]})}let C=`app-nav-item${a?` app-nav-subitem`:``}${e.active?` active`:``}${o}`;return t?m(t,{className:C,to:e.href,"aria-current":S,"data-label":v,onClick:r,children:x}):m(`a`,{className:C,href:e.href,"aria-current":S,"data-label":v,onClick:r,children:x})}function O(){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 k({config:e,linkComponent:t}){let i=l(),{open:a,setOpen:o,ref:s}=O(),{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 A({config:e}){let t=l(),{open:r,setOpen:i,ref:a}=O(),{unread:o=0,items:s,loading:u=!1,onOpen:g,onMarkAllRead:_,viewAllHref:v,label:y=`Notifications`,emptyText:b=`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`:`${x(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:b})),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}, ${x(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:x(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 j=e=>!!e&&(e.isContentEditable||/^(INPUT|TEXTAREA|SELECT)$/.test(e.tagName));function M({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,A=O.length;c(()=>{let e=e=>{e.key!==`/`||e.ctrlKey||e.metaKey||e.altKey||j(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||A===0)return;e.preventDefault(),w((C+(e.key===`ArrowDown`?1:-1)+A)%A)}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:[A===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?A===0?`No results`:`${A} ${A===1?`result`:`results`}`:``})]})}export{S 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=[`comfortable`,`compact`],x=[`default`,`primary`],S=e=>e>g?`${g}+`:String(e);function C({groups:r=[],brand:i,sidebarStart:l,sidebarStartCompact:p,sidebarFooter:g,topbarStart:_,topbarEnd:v,footer:y,launcher:S,children:C,collapsed:D,onCollapsedChange:k,noSidebar:M=!1,density:P=`comfortable`,topbarTone:F=`default`,navLabel:I=`Main navigation`,linkComponent:L,currentPath:R,rememberCollapsed:z=!1,collapsedCookie:B=`wui-shell-collapsed`,tabBarLabel:V=`Quick navigation`,moreLabel:H=`More`,userMenu:U,notifications:W,search:G,className:K=``,...q}){t(`AppShell`,q),e(`AppShell`,`density`,P,b),e(`AppShell`,`topbarTone`,F,x);let[ee,te]=f(()=>z&&D===void 0&&typeof document<`u`?a(B)??!1:!1),[J,Y]=f(!1),[ne,re]=f(!1),[ie,ae]=f(!1),X=d(null),Z=D??ee,oe=()=>{let e=!Z;D===void 0&&te(e),z&&o(e,B),k?.(e)},Q=u(()=>w(r,R),[r,R]),$=M?null:T(Q);return c(()=>{let e=()=>re(window.scrollY>4);return e(),window.addEventListener(`scroll`,e,{passive:!0}),()=>window.removeEventListener(`scroll`,e)},[]),c(()=>{s()},[]),c(()=>{let e=X.current,t=e?.querySelector(`.app-nav-item[aria-current="page"]`);if(!e||!t)return;let n=t.getBoundingClientRect(),r=e.getBoundingClientRect();n.top<r.top?e.scrollTop-=r.top-n.top:n.bottom>r.bottom&&(e.scrollTop+=n.bottom-r.bottom)},[]),c(()=>{let e=X.current;if(!e)return;let t=()=>ae(e.scrollHeight>e.clientHeight);if(t(),typeof ResizeObserver>`u`)return;let n=new ResizeObserver(t);return n.observe(e),()=>n.disconnect()},[Q]),c(()=>{if(!J)return;let e=e=>{e.key===`Escape`&&Y(!1)};return document.addEventListener(`keydown`,e),()=>document.removeEventListener(`keydown`,e)},[J]),h(`div`,{className:[`app-shell`,Z?`collapsed`:``,M?`no-sidebar`:``,J?`mobile-open`:``,K].filter(Boolean).join(` `),"data-density":P===`compact`?`compact`:void 0,...q,children:[m(`a`,{className:`wui-skip-link`,href:`#main-content`,children:`Skip to content`}),h(`aside`,{className:`app-sidebar`,children:[i&&m(`div`,{className:`app-sidebar-brand`,children:i}),l&&m(`div`,{className:`app-sidebar-start`,children:l}),p&&m(`div`,{className:`app-sidebar-start-compact`,children:p}),m(`nav`,{className:`app-sidebar-scroll`,"aria-label":I,ref:X,tabIndex:ie?0:void 0,children:Q.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(O,{item:e,linkComponent:L,onNavigate:()=>Y(!1)},e.key??e.href??e.label)),e.after&&m(`div`,{className:`wui-nav-group-after`,children:e.after})]},e.label??`group-${t}`))}),g&&m(`div`,{className:`app-sidebar-foot`,children:g}),!M&&m(`button`,{type:`button`,className:`app-sidebar-toggle`,onClick:oe,"aria-label":Z?`Expand navigation`:`Collapse navigation`,"aria-expanded":!Z,children:m(n,{name:`chevrons-left`,size:20})})]}),h(`div`,{className:`app-main`,children:[h(`header`,{className:`app-topbar${ne?` scrolled`:``}`,"data-tone":F===`primary`?`primary`:void 0,children:[h(`div`,{className:`app-topbar-start`,children:[m(`button`,{type:`button`,className:`app-topbar-menu`,onClick:()=>Y(!0),"aria-label":`Open navigation`,"aria-expanded":J,children:m(n,{name:`menu`,size:18})}),_,G&&m(N,{config:G})]}),h(`div`,{className:`app-topbar-end`,children:[v,W&&m(j,{config:W}),U&&m(A,{config:U,linkComponent:L})]})]}),m(`main`,{className:`app-content`,id:`main-content`,children:C}),y&&m(`footer`,{className:`app-footer`,children:y})]}),S&&m(`div`,{className:`wui-shell-launcher`,children:S}),$&&h(`nav`,{className:`wui-tabbar`,"aria-label":V,children:[$.tabs.map(e=>m(E,{tab:e,linkComponent:L},e.key??e.href)),$.hasMore&&h(`button`,{type:`button`,className:`wui-tabbar-item${$.moreActive?` active`:``}`,onClick:()=>Y(!0),children:[m(`span`,{className:`wui-tabbar-icon`,children:m(n,{name:`more`,size:24})}),m(`span`,{className:`wui-tabbar-label`,children:H})]})]}),m(`button`,{type:`button`,className:`app-scrim`,onClick:()=>Y(!1),"aria-label":`Close navigation`,tabIndex:J?0:-1})]})}function w(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&&!t.href)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 T(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 E({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}`:``}`,title:e.badgeTitle||void 0,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 D(e){for(let t of e){if(t.active)return t;let e=t.children?.length?D(t.children):void 0;if(e)return e}}function O({item:e,linkComponent:t,onNavigate:r,depth:i=0}){let a=i>0,o=i>1?` wui-nav-depth-${Math.min(i,6)}`:``,s=Array.isArray(e.children)&&e.children.length>0,l=s?D(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}`:``}`,title:e.badgeTitle||void 0,children:e.badge}),x=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})]}),S=e.active?`page`:void 0;if(s){let s=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(O,{item:e,linkComponent:t,onNavigate:r,depth:i+1},e.key??e.href))})});if(e.href){let i=t?m(t,{className:`wui-nav-split-link`,to:e.href,"aria-current":S,onClick:r,children:x}):m(`a`,{className:`wui-nav-split-link`,href:e.href,"aria-current":S,onClick:r,children:x});return h(p,{children:[h(`div`,{className:`app-nav-item has-children wui-nav-split${a?` app-nav-subitem`:``}${u||e.active?` active`:``}${o}`,"data-label":v,children:[i,m(`button`,{type:`button`,className:`app-nav-caret wui-nav-split-toggle`,"aria-expanded":g,"aria-label":`Show or hide ${v??``} pages`,onClick:()=>_(e=>!e),children:m(n,{name:`chevron-right`,size:16})})]}),s]})}return h(p,{children:[h(`button`,{type:`button`,className:`app-nav-item${a?` app-nav-subitem`:``} has-children${u?` active`:``}${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})})]}),s]})}let C=`app-nav-item${a?` app-nav-subitem`:``}${e.active?` active`:``}${o}`;return t?m(t,{className:C,to:e.href,"aria-current":S,"data-label":v,onClick:r,children:x}):m(`a`,{className:C,href:e.href,"aria-current":S,"data-label":v,onClick:r,children:x})}function k(){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 A({config:e,linkComponent:t}){let i=l(),{open:a,setOpen:o,ref:s}=k(),{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 j({config:e}){let t=l(),{open:r,setOpen:i,ref:a}=k(),{unread:o=0,items:s,loading:u=!1,onOpen:g,onMarkAllRead:_,viewAllHref:v,label:y=`Notifications`,emptyText:b=`You are all caught up.`}=e,[x,C]=f(``),w=d(o);c(()=>{w.current!==o&&(w.current=o,C(o===0?`No unread notifications`:`${S(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:b})),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}, ${S(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:S(o)})]}),m(`span`,{className:`visually-hidden`,"aria-live":`polite`,children:x}),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 M=e=>!!e&&(e.isContentEditable||/^(INPUT|TEXTAREA|SELECT)$/.test(e.tagName));function N({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,A=O.length;c(()=>{let e=e=>{e.key!==`/`||e.ctrlKey||e.metaKey||e.altKey||M(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 j=e=>{if(e.key===`ArrowDown`||e.key===`ArrowUp`){if(!k||A===0)return;e.preventDefault(),w((C+(e.key===`ArrowDown`?1:-1)+A)%A)}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:j})]}),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:[A===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?A===0?`No results`:`${A} ${A===1?`result`:`results`}`:``})]})}export{C as default};

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

@@ -1,23 +1,50 @@
 export declare function buttonVariantClass(variant: any): string;
+/**
+ * A button, or a button-styled link with href, in the kit's variants and sizes.
+ *
+ * @param {object} props
+ * @param {import('react').ReactNode} props.children The label.
+ * @param {"primary"|"secondary"|"outline"|"ghost"|"text"|"danger"|"success"|"secondary-danger"|"outline-danger"|"light"|"warning"|"neutral"|"outline-light"|"outline-secondary"|"subtle"} [props.variant="primary"] Emphasis level. subtle is deprecated (use neutral) and is removed in 0.79.0.
+ * @param {"sm"|"md"|"lg"} [props.size="md"] Control size.
+ * @param {"button"|"submit"|"reset"} [props.type="button"] The native button type; not emitted on a link-shaped button.
+ * @param {boolean} [props.loading=false] Shows a spinner and disables the button while work runs; hides both icons.
+ * @param {boolean} [props.disabled=false] Disables the button.
+ * @param {boolean} [props.block=false] Full width of its container.
+ * @param {string|import('react').ReactNode} [props.leftIcon=null] An icon name, or a node drawn as given.
+ * @param {string|import('react').ReactNode} [props.rightIcon=null] An icon name, or a node drawn as given.
+ * @param {string} [props.href] Render as a button-styled link (an <a href>) instead of a <button>; matches Razor <app-button href>.
+ * @param {boolean} [props.static=false] Render as a NON-interactive element (a <span>) that keeps the
+ *   button's chrome but does not click, focus, or hover — a resolved/confirmation label (e.g. "Verified")
+ *   sized to sit where its action button was. Ignores loading/disabled/type/href.
+ * @param {string} [props.tooltip] A collision-aware hover/focus tooltip (via AppTooltip / Popper) — flips to stay on-screen. For a labelled button use it sparingly (the label already says what it does); most useful on a terse or icon-led action.
+ * @param {"auto"|"top"|"bottom"|"start"|"end"} [props.tooltipPlacement="auto"] Preferred tooltip side; `auto` picks the side with the most room.
+ * @param {string} [props.shortcut] The key that runs this action ("A", "E", "/"), drawn as a key chip: in the tooltip when the button has one, otherwise after the label. Sets aria-keyshortcuts; the page binds the key itself (useListShortcuts). Ignored on a static button.
+ * @param {"sheen"|"fill"|"expand"|"glow"|"roll"|"none"} [props.animation] Hover animation; omit for the default sheen. `roll` rolls the label up and slides a trailing `rightIcon` through a round well.
+ * @param {boolean} [props.pinRightIcon=false] Pin the rightIcon (or the roll animation's icon well) to the button's end edge and centre the label; for a wide or full-width button.
+ * @param {"rounded"|"pill"|"sharp"} [props.shape="rounded"] Corner shape: the default rounded squircle, a fully rounded pill, or sharp square corners.
+ * @param {"linear"|"outline"|"bold"|"bulk"|"broken"|"twotone"} [props.iconVariant="linear"] The iconsax style of a named leftIcon / rightIcon; a node icon is drawn as given.
+ * @param {string} [props.className=""] Extra classes on the button.
+ * @param {(event: import('react').MouseEvent<HTMLElement>) => void} [props.onClick] Runs on a click; ignored on a static button.
+ */
 export default function AppButton({ children, variant, size, type, loading, disabled, block, leftIcon, rightIcon, href, static: isStatic, tooltip, tooltipPlacement, shortcut, animation, pinRightIcon, shape, iconVariant, className, ...rest }: {
-    [x: string]: any;
-    animation: any;
-    block?: boolean;
-    children: any;
-    className?: string;
-    disabled?: boolean;
-    href: any;
-    iconVariant: any;
-    leftIcon?: any;
+    children: import('react').ReactNode;
+    variant?: "primary" | "secondary" | "outline" | "ghost" | "text" | "danger" | "success" | "secondary-danger" | "outline-danger" | "light" | "warning" | "neutral" | "outline-light" | "outline-secondary" | "subtle";
+    size?: "sm" | "md" | "lg";
+    type?: "button" | "submit" | "reset";
     loading?: boolean;
-    pinRightIcon?: boolean;
-    rightIcon?: any;
-    shape?: string;
-    shortcut: any;
-    size?: string;
+    disabled?: boolean;
+    block?: boolean;
+    leftIcon?: string | import('react').ReactNode;
+    rightIcon?: string | import('react').ReactNode;
+    href?: string;
     static?: boolean;
-    tooltip: any;
-    tooltipPlacement: any;
-    type?: string;
-    variant?: string;
+    tooltip?: string;
+    tooltipPlacement?: "auto" | "top" | "bottom" | "start" | "end";
+    shortcut?: string;
+    animation?: "sheen" | "fill" | "expand" | "glow" | "roll" | "none";
+    pinRightIcon?: boolean;
+    shape?: "rounded" | "pill" | "sharp";
+    iconVariant?: "linear" | "outline" | "bold" | "bulk" | "broken" | "twotone";
+    className?: string;
+    onClick?: (event: import('react').MouseEvent<HTMLElement>) => void;
 }): any;

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

@@ -188,11 +188,13 @@ export type SearchShape = {
  * @param {import('react').ReactNode} [props.topbarStart] Leading topbar slot — page title, crumbs.
  * @param {import('react').ReactNode} [props.topbarEnd] Trailing topbar slot — page actions; the bell and account menu follow it.
  * @param {import('react').ReactNode} [props.footer]
+ * @param {import('react').ReactNode} [props.launcher] A floating button pinned to the bottom end corner over the page, such as an assistant launcher; on a phone it sits above the tab bar.
  * @param {import('react').ReactNode} props.children The routed page.
  * @param {boolean} [props.collapsed] Controlled rail state. Omit to let the shell own it.
  * @param {(collapsed: boolean) => void} [props.onCollapsedChange]
  * @param {boolean} [props.noSidebar=false] Full-width, no side nav — a focused wizard. No tab bar either.
  * @param {'comfortable'|'compact'} [props.density='comfortable'] Compact sets the content's top padding to 12px.
+ * @param {'default'|'primary'} [props.topbarTone='default'] The top bar's colour. primary paints the bar in the primary colour, with its text, menu button, bell and account menu in the ink that reads on it; the search field keeps its own surface.
  * @param {string} [props.navLabel='Main navigation']
  * @param {string} [props.currentPath] The current location; items without `active` are matched against it.
  * @param {boolean} [props.rememberCollapsed=false] Remember the uncontrolled rail state in a cookie.
@@ -204,7 +206,7 @@ export type SearchShape = {
  * @param {SearchShape} [props.search] The topbar search.
  * @param {string} [props.className]
  */
-export default function AppShell({ groups, brand, sidebarStart, sidebarStartCompact, sidebarFooter, topbarStart, topbarEnd, footer, children, collapsed, onCollapsedChange, noSidebar, density, navLabel, linkComponent: Link, currentPath, rememberCollapsed, collapsedCookie, tabBarLabel, moreLabel, userMenu, notifications, search, className, ...rest }: {
+export default function AppShell({ groups, brand, sidebarStart, sidebarStartCompact, sidebarFooter, topbarStart, topbarEnd, footer, launcher, children, collapsed, onCollapsedChange, noSidebar, density, topbarTone, navLabel, linkComponent: Link, currentPath, rememberCollapsed, collapsedCookie, tabBarLabel, moreLabel, userMenu, notifications, search, className, ...rest }: {
     groups: {
         label?: string;
         items: NavItemShape[];
@@ -217,11 +219,13 @@ export default function AppShell({ groups, brand, sidebarStart, sidebarStartComp
     topbarStart?: import('react').ReactNode;
     topbarEnd?: import('react').ReactNode;
     footer?: import('react').ReactNode;
+    launcher?: import('react').ReactNode;
     children: import('react').ReactNode;
     collapsed?: boolean;
     onCollapsedChange?: (collapsed: boolean) => void;
     noSidebar?: boolean;
     density?: 'comfortable' | 'compact';
+    topbarTone?: 'default' | 'primary';
     navLabel?: string;
     currentPath?: string;
     rememberCollapsed?: boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@webority/ui-react",
-  "version": "0.83.2",
+  "version": "0.83.3",
   "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.83.2",
-    "@webority/ui-elements": "0.83.2"
+    "@webority/theme": "0.83.3",
+    "@webority/ui-elements": "0.83.3"
   },
   "peerDependencies": {
     "@webority/analytics": "^0.25.0",