@webority/ui-react 0.83.1 → 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/AppFilterBar.js

@@ -1 +1 @@
-import{devWarn as e}from"../lib/devWarn.js";import t from"./warnInvalidValue.js";import n from"./warnUnknownProps.js";import r from"./AppIcon.js";import i from"./AppButton.js";import a from"./AppSegmented.js";import o from"./AppChip.js";import s from"./AppDateRangePicker.js";import{emptyFacetValue as c,isFacetActive as l}from"../lib/listQuery.js";import u from"./AppMultiSelect.js";import d from"./AppSearch.js";import f from"./AppSelect.js";import p from"./AppSwitch.js";import{useEffect as m,useId as h,useRef as g,useSyncExternalStore as _}from"react";import{jsx as v,jsxs as y}from"react/jsx-runtime";import"@webority/ui-elements/elements/filter-popover";var b=`(max-width: 575.98px)`,x=3,S=2,C=e=>{let t=window.matchMedia?.(b);return t?.addEventListener(`change`,e),()=>t?.removeEventListener(`change`,e)},w=()=>window.matchMedia?.(b).matches??!1,T=[`enum`,`multiEnum`,`dateRange`,`text`],E=4,D=e=>(e.type===`enum`||e.type===`multiEnum`)&&!e.options?.length,O=(e,t)=>e.options?.find(e=>e.value===t)?.label??t;function k(e,t){if(!l(e,t))return[];if(e.type===`enum`)return[{id:e.key,text:O(e,t),clear:()=>c(e)}];if(e.type===`multiEnum`)return t.map(n=>({id:`${e.key}:${n}`,text:O(e,n),clear:()=>t.filter(e=>e!==n)}));if(e.type===`dateRange`){let n=t.from&&t.to?`${t.from} to ${t.to}`:t.from?`From ${t.from}`:`Until ${t.to}`;return[{id:e.key,text:n,clear:()=>c(e)}]}return[]}var A=new Set;function j(t){let n=!0;try{n=process.env.NODE_ENV!==`production`}catch{n=!0}!n||A.has(t)||(A.add(t),e(`[@webority/ui-react] <AppFilterBar> facet "${t}" sets allLabel, which only an enum facet uses.`))}var M=new Set;function N(t){let n=!0;try{n=process.env.NODE_ENV!==`production`}catch{n=!0}!n||M.has(t)||(M.add(t),e(`[@webority/ui-react] <AppFilterBar> facet "${t}" sets presets, which only a dateRange facet uses.`))}function P({facets:e,value:a,onChange:s,inline:u=x,floating:d=!1,className:f=``,...b}){n(`AppFilterBar`,b);let E=_(C,w,()=>!1),O=g(null),A=h();for(let n of e)t(`AppFilterBar`,`facets[].type`,n.type,T);for(let t of e)t.allLabel!=null&&t.type!==`enum`&&j(t.key),t.presets!=null&&t.type!==`dateRange`&&N(t.key);let M=e.filter(e=>!D(e)),P=M.flatMap(e=>k(e,a[e.key]).map(t=>({...t,facet:e}))),I=M.filter(e=>l(e,a[e.key])),L=d||E?0:Math.max(0,u),R=M.slice(L),z=R.filter(e=>I.includes(e)).length,B=!d&&R.length>0;m(()=>{if(!B)return;let e=e=>{let t=O.current;t?.open&&(e.type===`keydown`?e.key===`Escape`:!e.composedPath().includes(t))&&(t.open=!1)};return document.addEventListener(`click`,e),document.addEventListener(`keydown`,e),()=>{document.removeEventListener(`click`,e),document.removeEventListener(`keydown`,e)}},[B]);let V=e=>v(F,{facet:e,value:a[e.key],onChange:t=>s(e.key,t)},e.key),H=e=>y(`div`,{className:`wui-filter-popover-field`,children:[v(`span`,{className:`label`,"aria-hidden":`true`,children:e.label}),v(F,{facet:e,value:a[e.key],onChange:t=>s(e.key,t),floating:!0})]},e.key),U=(e,t)=>t>0&&v(`span`,{className:e,children:` (${t})`}),W=e=>v(o,{size:`sm`,label:`${e.facet.label}: ${e.text}`,removeLabel:`Remove ${e.facet.label} filter ${e.text}`,onRemove:()=>s(e.facet.key,e.clear()),className:!d&&M.indexOf(e.facet)<L?`wui-filter-chip-inline`:void 0},e.id),G=v(i,{variant:`ghost`,size:`sm`,onClick:()=>{for(let e of I)s(e.key,c(e))},children:`Clear all`});if(d){let e=P.slice(S),t=I.length;return y(`div`,{className:`wui-filter-bar d-flex flex-wrap align-items-center gap-2${f?` ${f}`:``}`,...b,children:[y(`wui-filter-popover`,{class:`wui-filter-popover`,children:[y(`button`,{type:`button`,className:`btn ${t>0?`btn-outline-primary`:`btn-ghost`} btn-sm wui-filter-popover-trigger`,"aria-expanded":`false`,"aria-controls":A,"aria-label":t>0?`Filters, ${t} active`:void 0,children:[v(r,{name:`filter`,size:14,className:`me-2`}),`Filters`,t>0&&v(`span`,{className:`badge rounded-pill text-bg-primary ms-1`,children:t})]}),y(`div`,{id:A,className:`wui-filter-popover-panel`,role:`dialog`,"aria-label":`Filters`,hidden:!0,children:[y(`div`,{className:`wui-filter-popover-head`,children:[v(`span`,{className:`wui-filter-popover-title`,children:`Filters`}),v(p,{label:`Keep open`,id:`${A}-pin`})]}),v(`div`,{className:`wui-filter-popover-grid`,children:M.map(H)}),y(`div`,{className:`wui-filter-popover-foot`,children:[v(`span`,{className:`wui-filter-popover-note`,children:`Changes apply at once.`}),t>0&&G]})]})]}),P.slice(0,S).map(W),e.length>0&&y(`span`,{className:`chip chip-sm wui-filter-popover-more`,title:e.map(e=>`${e.facet.label}: ${e.text}`).join(`, `),children:[`+`,e.length]})]})}return y(`div`,{className:`wui-filter-bar d-flex flex-wrap align-items-center gap-2${E&&B?` wui-filter-bar--folded`:``}${f?` ${f}`:``}`,...b,children:[M.slice(0,L).map(V),B&&y(`details`,{ref:O,className:`wui-filter-more`,children:[y(`summary`,{className:`btn btn-outline-primary btn-sm wui-filter-more-trigger`,children:[v(r,{name:`filter`,size:14,className:`me-2`}),`Filters`,U(`wui-filter-count-desktop`,z),U(`wui-filter-count-phone`,I.length)]}),y(`div`,{className:`wui-filter-more-panel`,children:[v(`div`,{className:`wui-filter-more-head`,children:`Filters`}),R.map(H)]})]}),P.map(W),I.length>0&&G]})}function F({facet:e,value:t,onChange:n,floating:r=!1}){if(e.type===`enum`){let i=e.options??[];return i.length<E?v(a,{label:e.label,name:e.key,size:`sm`,value:t??``,onChange:n,options:[{value:``,label:e.allLabel||`All`},...i]}):v(f,{"aria-label":e.label,name:e.key,placeholder:r?`Any`:e.label,size:`sm`,clearable:!0,value:t??``,onChange:n,options:i})}return e.type===`multiEnum`?v(u,{"aria-label":e.label,name:e.key,placeholder:r?`Any`:e.label,size:`sm`,collapseChips:!0,values:t??[],onChange:n,options:e.options??[]}):e.type===`dateRange`?v(s,{ariaLabel:e.label,startName:`${e.key}From`,endName:`${e.key}To`,placeholder:r?`Any`:e.label,size:`sm`,presets:e.presets,start:t?.from??``,end:t?.to??``,onChange:e=>n({from:e.start??``,to:e.end??``})}):v(d,{ariaLabel:e.label,name:e.key,placeholder:e.label,size:`sm`,value:t??``,onChange:n})}export{P as default};
+import{devWarn as e}from"../lib/devWarn.js";import t from"./warnInvalidValue.js";import n from"./warnUnknownProps.js";import r from"./AppIcon.js";import i from"./AppButton.js";import a from"./AppSegmented.js";import ee from"./AppChip.js";import o from"./AppDateRangePicker.js";import{emptyFacetValue as s,isFacetActive as c}from"../lib/listQuery.js";import l from"./AppMultiSelect.js";import u from"./AppSearch.js";import d from"./AppSelect.js";import f from"./AppSwitch.js";import{Fragment as te,useEffect as p,useId as m,useRef as h,useState as ne,useSyncExternalStore as re}from"react";import{Fragment as g,jsx as _,jsxs as v}from"react/jsx-runtime";import"@webority/ui-elements/elements/filter-popover";var y=`(max-width: 575.98px)`,b=3,x=2,ie=e=>{let t=window.matchMedia?.(y);return t?.addEventListener(`change`,e),()=>t?.removeEventListener(`change`,e)},ae=()=>window.matchMedia?.(y).matches??!1,S=[`enum`,`multiEnum`,`dateRange`,`text`],C=4,w=e=>(e.type===`enum`||e.type===`multiEnum`)&&!e.options?.length,T=(e,t)=>e.options?.find(e=>e.value===t)?.label??t,oe=(e,t)=>JSON.stringify(e)===JSON.stringify(t);function se(e,t){if(!c(e,t))return[];if(e.type===`enum`)return[{id:e.key,text:T(e,t),clear:()=>s(e)}];if(e.type===`multiEnum`)return t.map(n=>({id:`${e.key}:${n}`,text:T(e,n),clear:()=>t.filter(e=>e!==n)}));if(e.type===`dateRange`){let n=t.from&&t.to?`${t.from} to ${t.to}`:t.from?`From ${t.from}`:`Until ${t.to}`;return[{id:e.key,text:n,clear:()=>s(e)}]}return[]}var E=new Set;function D(t){let n=!0;try{n=process.env.NODE_ENV!==`production`}catch{n=!0}!n||E.has(t)||(E.add(t),e(`[@webority/ui-react] <AppFilterBar> facet "${t}" sets allLabel, which only an enum facet uses.`))}var O=new Set;function k(t){let n=!0;try{n=process.env.NODE_ENV!==`production`}catch{n=!0}!n||O.has(t)||(O.add(t),e(`[@webority/ui-react] <AppFilterBar> facet "${t}" sets presets, which only a dateRange facet uses.`))}function A({facets:e,value:a,onChange:o,inline:l=b,floating:u=!1,apply:d=!1,className:y=``,...C}){n(`AppFilterBar`,C);let T=re(ie,ae,()=>!1),E=h(null),O=m(),[A,M]=ne({}),N=h(a);for(let n of e)t(`AppFilterBar`,`facets[].type`,n.type,S);for(let t of e)t.allLabel!=null&&t.type!==`enum`&&D(t.key),t.presets!=null&&t.type!==`dateRange`&&k(t.key);let P=e.filter(e=>!w(e)),F=P.flatMap(e=>se(e,a[e.key]).map(t=>({...t,facet:e}))),I=P.filter(e=>c(e,a[e.key])),L=u||T?0:Math.max(0,l),R=P.slice(L),z=R.filter(e=>I.includes(e)).length,B=!u&&R.length>0;p(()=>{if(!B)return;let e=e=>{let t=E.current;t?.open&&(e.type===`keydown`?e.key===`Escape`:!e.composedPath().includes(t))&&(t.open=!1)};return document.addEventListener(`click`,e),document.addEventListener(`keydown`,e),()=>{document.removeEventListener(`click`,e),document.removeEventListener(`keydown`,e)}},[B]),p(()=>{let e=N.current;N.current=a,M(t=>{let n=Object.entries(t).filter(([t])=>oe(e[t],a[t]));return n.length===Object.keys(t).length?t:Object.fromEntries(n)})},[a]);let V=e=>d&&!u&&(e.type===`text`||e.type===`dateRange`),H=e=>V(e)&&Object.hasOwn(A,e.key)?A[e.key]:a[e.key],U=e=>t=>V(e)?M(n=>({...n,[e.key]:t})):o(e.key,t),W=()=>{for(let[e,t]of Object.entries(A))o(e,t);M({})},G=e=>{e.key===`Enter`&&W()},ce=e=>{e.preventDefault(),W()},K=(e,t)=>e.type===`text`&&V(e)?_(`span`,{onKeyDownCapture:G,children:t}):t,le=e=>_(te,{children:K(e,_(j,{facet:e,value:H(e),onChange:U(e)}))},e.key),q=e=>v(`div`,{className:`wui-filter-popover-field`,children:[_(`span`,{className:`label`,"aria-hidden":`true`,children:e.label}),K(e,_(j,{facet:e,value:H(e),onChange:U(e),floating:!0}))]},e.key),J=(e,t)=>t>0&&_(`span`,{className:e,children:` (${t})`}),Y=e=>_(ee,{size:`sm`,label:`${e.facet.label}: ${e.text}`,removeLabel:`Remove ${e.facet.label} filter ${e.text}`,onRemove:()=>o(e.facet.key,e.clear()),className:!u&&P.indexOf(e.facet)<L?`wui-filter-chip-inline`:void 0},e.id),X=_(i,{variant:`ghost`,size:`sm`,onClick:()=>{for(let e of I)o(e.key,s(e));M({})},children:`Clear all`});if(u){let e=F.slice(x),t=I.length;return v(`div`,{className:`wui-filter-bar d-flex flex-wrap align-items-center gap-2${y?` ${y}`:``}`,...C,children:[v(`wui-filter-popover`,{class:`wui-filter-popover`,children:[v(`button`,{type:`button`,className:`btn ${t>0?`btn-outline-primary`:`btn-ghost`} btn-sm wui-filter-popover-trigger`,"aria-expanded":`false`,"aria-controls":O,"aria-label":t>0?`Filters, ${t} active`:void 0,children:[_(r,{name:`filter`,size:14,className:`me-2`}),`Filters`,t>0&&_(`span`,{className:`badge rounded-pill text-bg-primary ms-1`,children:t})]}),v(`div`,{id:O,className:`wui-filter-popover-panel`,role:`dialog`,"aria-label":`Filters`,hidden:!0,children:[v(`div`,{className:`wui-filter-popover-head`,children:[_(`span`,{className:`wui-filter-popover-title`,children:`Filters`}),_(f,{label:`Keep open`,id:`${O}-pin`})]}),_(`div`,{className:`wui-filter-popover-grid`,children:P.map(q)}),v(`div`,{className:`wui-filter-popover-foot`,children:[_(`span`,{className:`wui-filter-popover-note`,children:`Changes apply at once.`}),t>0&&X]})]})]}),F.slice(0,x).map(Y),e.length>0&&v(`span`,{className:`chip chip-sm wui-filter-popover-more`,title:e.map(e=>`${e.facet.label}: ${e.text}`).join(`, `),children:[`+`,e.length]})]})}let Z=`wui-filter-bar d-flex flex-wrap align-items-center gap-2${T&&B?` wui-filter-bar--folded`:``}`,Q=e=>`${e}${y?` ${y}`:``}`,$=v(g,{children:[P.slice(0,L).map(le),B&&v(`details`,{ref:E,className:`wui-filter-more`,children:[v(`summary`,{className:`btn btn-outline-primary btn-sm wui-filter-more-trigger`,children:[_(r,{name:`filter`,size:14,className:`me-2`}),`Filters`,J(`wui-filter-count-desktop`,z),J(`wui-filter-count-phone`,I.length)]}),v(`div`,{className:`wui-filter-more-panel`,children:[_(`div`,{className:`wui-filter-more-head`,children:`Filters`}),R.map(q)]})]}),F.map(Y),I.length>0&&X]});return!d||!P.some(e=>e.type===`text`||e.type===`dateRange`)?_(`div`,{className:Q(Z),...C,children:$}):v(`div`,{className:Q(`wui-filter-form d-flex flex-wrap align-items-center gap-2`),...C,children:[_(`div`,{className:Z,children:$}),_(i,{type:`submit`,size:`sm`,onClick:ce,children:`Apply`})]})}function j({facet:e,value:t,onChange:n,floating:r=!1}){if(e.type===`enum`){let i=e.options??[];return i.length<C?_(a,{label:e.label,name:e.key,size:`sm`,value:t??``,onChange:n,options:[{value:``,label:e.allLabel||`All`},...i]}):_(d,{"aria-label":e.label,name:e.key,placeholder:r?`Any`:e.label,size:`sm`,clearable:!0,value:t??``,onChange:n,options:i})}return e.type===`multiEnum`?_(l,{"aria-label":e.label,name:e.key,placeholder:r?`Any`:e.label,size:`sm`,collapseChips:!0,values:t??[],onChange:n,options:e.options??[]}):e.type===`dateRange`?_(o,{ariaLabel:e.label,startName:`${e.key}From`,endName:`${e.key}To`,placeholder:r?`Any`:e.label,size:`sm`,presets:e.presets,start:t?.from??``,end:t?.to??``,onChange:e=>n({from:e.start??``,to:e.end??``})}):_(u,{ariaLabel:e.label,name:e.key,placeholder:e.label,size:`sm`,value:t??``,onChange:n})}export{A 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/AppFilterBar.d.ts

@@ -18,6 +18,8 @@ import "@webority/ui-elements/elements/filter-popover";
  * into that one button and the panel becomes a sheet from the bottom edge. The button and Clear all
  * never wrap.
  *
+ * With `apply`, a search box or date range waits for Apply, or Enter in a search box, before it calls `onChange`; other choices still apply as they change.
+ *
  * @param {object} props
  * @param {{ key: string, label: string, type: 'enum'|'multiEnum'|'dateRange'|'text',
  *   options?: { value: string, label: string }[], allLabel?: string, presets?: string[] }[]} props.facets `options` fills an `enum` or `multiEnum`;
@@ -29,9 +31,10 @@ import "@webority/ui-elements/elements/filter-popover";
  *   Called with the facet key and its new value. Clear all calls it once per active facet, with the empty value.
  * @param {number} [props.inline=3] How many facets stay in the row; the rest fold into the Filters button.
  * @param {boolean} [props.floating=false] A floating panel: hover, click or F opens the facets in a non-modal panel under the Filters button, with a chip summary in the row.
+ * @param {boolean} [props.apply=false] Hold search and date range edits until Apply (or Enter in a search box), as the Razor app-filter-bar does; other choices still apply when they change. Apply shows only when a text or dateRange facet is present, and never with floating.
  * @param {string} [props.className]
  */
-export default function AppFilterBar({ facets: allFacets, value, onChange, inline, floating, className, ...rest }: {
+export default function AppFilterBar({ facets: allFacets, value, onChange, inline, floating, apply, className, ...rest }: {
     facets: {
         key: string;
         label: string;
@@ -53,5 +56,6 @@ export default function AppFilterBar({ facets: allFacets, value, onChange, inlin
     }) => void;
     inline?: number;
     floating?: boolean;
+    apply?: boolean;
     className?: string;
 }): import("react").JSX.Element;

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.1",
+  "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.1",
-    "@webority/ui-elements": "0.83.1"
+    "@webority/theme": "0.83.3",
+    "@webority/ui-elements": "0.83.3"
   },
   "peerDependencies": {
     "@webority/analytics": "^0.25.0",