@webority/ui-react 0.68.3 → 0.69.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/AppBreadcrumbs.js +1 -1
- package/dist/components/AppCard.js +1 -1
- package/dist/components/AppDataTable.js +1 -1
- package/dist/components/AppDueDate.js +1 -1
- package/dist/components/AppFilterBar.js +1 -1
- package/dist/components/AppPageHeader.js +1 -1
- package/dist/lib/useTableView.js +1 -1
- package/dist/types/components/AppBreadcrumbs.d.ts +5 -2
- package/dist/types/components/AppCard.d.ts +7 -1
- package/dist/types/components/AppDataTable.d.ts +2 -1
- package/dist/types/lib/useTableView.d.ts +4 -2
- package/package.json +3 -3
|
@@ -1 +1 @@
|
|
|
1
|
-
import e from"./warnUnknownProps.js";import t from"./renderIconProp.js";import{
|
|
1
|
+
import e from"./warnUnknownProps.js";import t from"./renderIconProp.js";import{createContext as n,useContext as r}from"react";import{Breadcrumb as i}from"react-bootstrap";import{jsx as a,jsxs as o}from"react/jsx-runtime";var s=n(!1);function c({items:n=[],linkComponent:c,className:l=``,...u}){e(`AppBreadcrumbs`,u);let d=r(s);return a(i,{className:l||void 0,...u,children:n.map((e,r)=>{let a=!d&&r===n.length-1,s=e.icon?t(e.icon,{size:14}):null,l={};return a||(l=e.to&&c?{linkAs:c,linkProps:{to:e.to}}:e.to||e.href?{href:e.to||e.href}:{linkAs:`span`}),o(i.Item,{active:a,...l,children:[s,e.label]},e.key??`${e.label}-${r}`)})})}export{s as BreadcrumbTrailContext,c as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import e from"./warnInvalidValue.js";import t from"./warnUnknownProps.js";import n from"./AppIcon.js";import{
|
|
1
|
+
import e from"./warnInvalidValue.js";import t from"./warnUnknownProps.js";import n from"./AppIcon.js";import{useState as r}from"react";import{Card as i}from"react-bootstrap";import{Fragment as a,jsx as o,jsxs as s}from"react/jsx-runtime";var c=[`default`,`elevated`,`outlined`,`muted`,`accent`],l=[`primary`,`success`,`warning`,`danger`,`info`],u=[`none`,`sm`,`md`,`lg`],d={xs:320,sm:420,md:560,lg:720};function f({title:f,subtitle:p,headerIcon:m,titleClassName:h=``,header:g,headerExtra:_,headerActions:v,footer:y,media:b,children:x,variant:S=`default`,tone:C=`primary`,padding:w=`md`,maxWidth:T,className:E=``,bodyClassName:D=``,headerClassName:O=``,body:k=!0,lifted:A=!1,href:j,onClick:M,linkComponent:N,onClose:P,dismissible:F,closeLabel:I=`Close`,...L}){let[R,z]=r(!1);t(`AppCard`,L),e(`AppCard`,`variant`,S,c),e(`AppCard`,`tone`,C,l),e(`AppCard`,`padding`,w,u);let{style:B,...V}=L,H=j!=null||M!=null,U=[S&&S!=="default"?`card-${S}`:``,S===`accent`&&C&&C!==`primary`?`tone-${C}`:``,w&&w!==`md`?`card-pad-${w}`:``,A?`card-lifted`:``,T==null?``:`card-constrained`,H?`card-clickable`:``,E].filter(Boolean).join(` `)||void 0,W=T==null?void 0:d[T]==null?typeof T==`number`?`${T}px`:T:`${d[T]}px`,G=W?{"--card-max-width":W,...B}:B,K={};j==null?M!=null&&(K={role:`button`,tabIndex:0,onClick:M,onKeyDown:e=>{(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),M(e))}}):(K=N?{as:N,to:j}:{as:`a`,href:j},M&&(K.onClick=M));let q=F??typeof P==`function`,J=q?o(`button`,{type:`button`,className:`card-close`,"aria-label":I,onClick:e=>{e.preventDefault(),e.stopPropagation(),z(!0),P?.()},onKeyDown:e=>e.stopPropagation(),children:o(n,{name:`x`,size:16})}):null,Y=f!=null||p!=null||m!=null,X=g!=null||Y||_!=null||v!=null||q,Z=m==null?null:typeof m==`string`?o(n,{name:m,size:18}):m;return R?null:s(i,{className:U,style:G,...V,...K,children:[b!=null&&o(`div`,{className:`card-media`,children:b}),X&&s(i.Header,{className:O||void 0,children:[g??s(a,{children:[Y&&s(`div`,{className:`card-header-main`,children:[Z!=null&&o(`span`,{className:`card-header-icon`,children:Z}),s(`div`,{className:`card-header-titles`,children:[f!=null&&o(`div`,{className:[`card-title`,h].filter(Boolean).join(` `),children:f}),p!=null&&o(`div`,{className:`card-subtitle`,children:p})]})]}),_,v!=null&&o(`div`,{className:`card-header-actions`,children:v})]}),J]}),k?o(i.Body,{className:D||void 0,children:x}):x,y!=null&&o(`div`,{className:`card-footer`,children:y})]})}export{f as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import e from"./warnInvalidValue.js";import t from"./warnUnknownProps.js";import n from"./AppIcon.js";import{AppSkeletonRows as r}from"./AppSkeleton.js";import i from"./AppTablePagination.js";import{attachRowDrag as a,attachScrollEdges as o,syncTargets as s}from"@webority/ui-elements/helpers";import{Fragment as ee,useEffect as c,useLayoutEffect as l,useMemo as u,useRef as d,useState as f}from"react";import{Fragment as te,jsx as p,jsxs as m}from"react/jsx-runtime";import{COLUMN_MAX_WIDTH as ne,COLUMN_MIN_WIDTH as re,DATA_TABLE_TEXT as ie,PIN_AT_VAR as ae,PIN_SIDES as oe,ROW_HEIGHTS as se,ROW_MOVE_LIMIT as ce,ROW_SAVE_ERROR_CLASS as le,groupCount as ue,groupItems as de,measureRows as fe,pinAtValue as pe,pinClasses as me,planPins as he,playRowMoves as ge,rowOrderChanged as _e,saveOutcomeText as ve,settledRows as ye,virtualRange as be}from"@webority/ui-elements/elements/data-table";var xe=[`comfortable`,`cozy`,`compact`],h=()=>{try{return process.env.NODE_ENV!==`production`}catch{return!0}},g=new Set;function _(e,t){g.has(e)||!h()||(g.add(e),console.warn(`[@webority/ui-react] <AppDataTable> ${t}`))}var Se=100;function Ce(e){return e===`end`?`wui-cell-end`:e===`num`?`num`:e===`center`?`text-center`:``}function we(e){return e==null||e===``?`-`:typeof e==`boolean`?String(e):e}function v({columns:h,rows:g,rowKey:v=e=>e.id,sort:y,onSort:b,loading:x=!1,skeletonRows:Te=5,empty:Ee=`No records found.`,emptyFiltered:De,sourceCount:Oe,rowActions:S,rowActionsLabel:ke,pagination:C,ariaLabel:Ae,className:je=``,wrapperClassName:Me=``,selectable:w=!1,selectedIds:T,onToggleRow:Ne,onToggleAll:Pe,onSelectRange:Fe,renderExpanded:Ie,density:E=`comfortable`,striped:Le=!1,flush:Re=!1,rowDrag:D=!1,maxHeight:O,stickyFirstColumn:ze=!1,stickyActions:Be=!1,stackOnMobile:k=!1,hiddenColumns:Ve,rowStatus:He,rowHref:A,onRowClick:j,activeRowKey:Ue,resizableColumns:M=!1,viewKey:We,groupBy:N,groupLabel:Ge,virtual:P=!1,rowSaving:Ke,rowSaveError:qe,...Je}){t(`AppDataTable`,Je);let Ye=Ve?.length?new Set(Ve):null;h=Ye?h.filter(e=>!(e.hideable&&Ye.has(e.key))):h,e(`AppDataTable`,`density`,E,xe);for(let t of h)e(`AppDataTable`,`column.pin`,t.pin,oe);let Xe=[`table table-ledger`,E===`cozy`||E===`compact`?`wui-table-${E}`:``,Le?`wui-table-striped`:``,ze?`wui-table-sticky-first`:``,Be?`wui-table-sticky-actions`:``,k?`wui-table-stack`:``,je].filter(Boolean).join(` `),F=typeof Ie==`function`,[Ze,Qe]=f(()=>new Set),$e=e=>Qe(t=>{let n=new Set(t);return n.has(e)?n.delete(e):n.add(e),n}),et=h.some(e=>typeof e.footer==`function`),I=typeof A==`function`||typeof j==`function`,tt=e=>!!e.target.closest(`a, button, input, select, textarea, label, [role='menu'], [role='menuitem'], .dropdown`),L=(e,t)=>{if(tt(t)||(j&&j(e),!A))return;let n=A(e);n&&(t.ctrlKey||t.metaKey||t.button===1?window.open(n,`_blank`,`noopener`):window.location.assign(n))},R=O!==void 0,nt=[`table-wrap`,R?`wui-table-scroll`:``,Re?`wui-table-flush`:``,Me].filter(Boolean).join(` `),rt=R?{maxHeight:O}:void 0,z=Math.max(1,h.length+ +!!S+ +!!w+ +!!F),it=h.some(e=>e.pin===`start`||e.pin===`end`),B=it||M||!!N||P,V=+!!F+ +!!w,at=it?he([...F?[`lead`]:[],...w?[`lead`]:[],...h.map(e=>e.pin===`start`||e.pin===`end`?e.pin:null),...S?[null]:[]]):[],H=(e,t=``)=>{let n=at[e];return n?{className:`${t.trim()} ${me(n)}`.trim(),style:{[ae]:pe(n.side,n.ordinal)}}:{className:t,style:void 0}},U=(e,t)=>at[e]?{...t,...H(e).style}:t,ot=h.length-1+ +!!S;We&&!M&&_(`view-key`,"`viewKey` remembers resized widths: add `resizableColumns`."),P&&!R&&_(`virtual-height`,"`virtual` needs `maxHeight`: without a scroll box every row renders."),P&&(F||k)&&_(`virtual-shape`,"`virtual` takes rows of one height, so it is off with `renderExpanded` or `stackOnMobile`.");let W=P&&R&&!F&&!k&&!x&&g?.length>0,G=w&&g?g.reduce((e,t,n)=>e+ +!!T?.has(v(t,n)),0):0,st=w&&g&&g.length>0&&G===g.length,ct=G>0&&!st,lt=e=>{e&&(e.indeterminate=ct)},ut=d(null),dt=(e,t)=>{let n=ut.current;ut.current=e;let r=t&&n!==null?g.findIndex((e,t)=>v(e,t)===n):-1,i=g.findIndex((t,n)=>v(t,n)===e);if(r<0||i<0||r===i){Ne?.(e);return}let a=!T?.has(e),o=g.slice(Math.min(r,i),Math.max(r,i)+1).map((e,t)=>v(e,Math.min(r,i)+t)).filter(e=>(T?.has(e)||!1)!==a);if(Fe)Fe(o,a);else for(let e of o)Ne?.(e)},[K,ft]=f(()=>new Set),pt=e=>ft(t=>{let n=new Set(t);return n.has(e)?n.delete(e):n.add(e),n}),q=u(()=>{let e=(g||[]).map((e,t)=>({row:e,i:t}));return N?de(e,({row:e})=>String(e[N]??``)).flatMap(e=>[{group:e,open:!K.has(e.key)},...K.has(e.key)?[]:e.items]):e},[g,N,K]),J=d(null),Y=d(null);c(()=>{let e=J.current;if(!e)return;let t=e=>{let t=e.target.closest?.(`.u-name`);t&&!t.title&&(t.scrollWidth>t.clientWidth||t.scrollHeight>t.clientHeight)&&(t.title=t.textContent.trim())},n=e=>{let t=e.target.closest?.(`tbody > tr[aria-rowindex]`)?.getAttribute(`aria-rowindex`);Y.current=t?Number(t)-2:null},r=t=>{e.contains(t.relatedTarget)||(Y.current=null)};e.addEventListener(`mouseover`,t),e.addEventListener(`focusin`,t),e.addEventListener(`focusin`,n),e.addEventListener(`focusout`,r);let i=o(e);return()=>{e.removeEventListener(`mouseover`,t),e.removeEventListener(`focusin`,t),e.removeEventListener(`focusin`,n),e.removeEventListener(`focusout`,r),i()}},[B]),c(()=>{if(!D||!J.current)return;let e=a(J.current);return s(document),e},[D,B]);let mt=d(!1);c(()=>{!mt.current&&(mt.current=!0,G===0)||J.current?.querySelector(`table`)?.dispatchEvent(new CustomEvent(`selectionchange`,{bubbles:!0,detail:{selected:G,total:g?.length??0,keys:g?g.map((e,t)=>v(e,t)).filter(e=>T?.has(e)).map(String):[]}}))},[w,G]);let[ht,gt]=f({top:0,height:0}),[X,_t]=f(se[E]??se.comfortable);c(()=>{let e=J.current;if(!W||!e)return;let t=0,n=()=>{t=0;let n=e.querySelector(`:scope > table > thead`)?.getBoundingClientRect().height||0,r={top:Math.max(0,e.scrollTop-n),height:e.clientHeight};gt(e=>e.top===r.top&&e.height===r.height?e:r)},r=()=>{t||=requestAnimationFrame(n)};e.addEventListener(`scroll`,r,{passive:!0});let i=typeof ResizeObserver<`u`?new ResizeObserver(r):null;return i?.observe(e),n(),()=>{e.removeEventListener(`scroll`,r),i?.disconnect(),t&&cancelAnimationFrame(t)}},[W,B]),l(()=>{if(!W)return;let e=(J.current?.querySelector(`:scope > table > tbody > tr:not(.wui-virtual-spacer, .wui-group-row)`))?.getBoundingClientRect().height;e>0&&Math.abs(e-X)>.5&&_t(e)});let Z={start:0,end:q.length,before:0,after:0};if(W){Z=be({scrollTop:ht.top,viewport:ht.height||Number.parseFloat(O)||0,rowHeight:X,count:q.length});let e=Y.current;e!==null&&e>=0&&e<q.length&&(e<Z.start&&Z.start-e<=Se&&(Z={...Z,start:e,before:e*X}),e>=Z.end&&e-Z.end<Se&&(Z={...Z,end:e+1,after:(q.length-e-1)*X}))}let vt=d(null),yt=d(null),bt=d(null),xt=!P&&!x&&g?.length>0&&g.length<=ce;l(()=>{let e=vt.current;if(!xt||!e){yt.current=null,bt.current=null;return}let t=g.map((e,t)=>v(e,t));_e(bt.current,t)&&ge(e.rows,yt.current),yt.current=fe(e.rows),bt.current=t});let St=typeof Ke==`function`||typeof qe==`function`,Ct=e=>{let t=!!Ke?.(e),n=t?``:qe?.(e)||``;return{state:t?`saving`:n?`error`:null,message:n}},wt=d(null),Tt=d(null);c(()=>{if(!St){Tt.current=null;return}let e=h[0]?.key,t=new Map;(g||[]).forEach((n,r)=>{let i=e===void 0?void 0:n[e],a=typeof i==`string`||typeof i==`number`?String(i):``;t.set(v(n,r),{...Ct(n),label:a})});let n=ve(ye(Tt.current,t));Tt.current=t,n&&wt.current&&(wt.current.textContent=n)});let Et=De!==void 0&&Oe>0?De:Ee,Dt=({group:e,open:t},r)=>{let i=e.items[0].row[N],a=e.items.map(e=>e.row);return p(`tr`,{className:`wui-group-row`,"data-group-key":e.key,"aria-rowindex":W?r+2:void 0,children:p(`th`,{className:`wui-group-cell`,scope:`rowgroup`,colSpan:z,children:m(`button`,{type:`button`,className:`wui-group-toggle`,"aria-expanded":t,onClick:()=>pt(e.key),children:[p(n,{name:`chevron-down`,size:16}),p(`span`,{className:`wui-group-label`,children:Ge?Ge(i,a):we(i)}),p(`span`,{className:`wui-group-count`,"aria-hidden":`true`,children:ue(e.items.length)}),p(`span`,{className:`visually-hidden wui-group-rows`,children:`, ${ie.rows(e.items.length)}`})]})})},`group:${e.key}`)},Ot=({row:e,i:t},r)=>{let i=v(e,t),a=F&&Ze.has(i),o=Ue!=null&&String(Ue)===String(i),s=String(i).replace(/[^a-z0-9]/gi,`_`),c=H(0,`wui-expand-cell`),l=H(+!!F,`wui-select-cell`),u=St?Ct(e):null;return m(ee,{children:[m(`tr`,{className:[w&&T?.has(i)?`is-selected`:``,I?`wui-row-link`:``,o?`wui-row-active`:``].filter(Boolean).join(` `)||void 0,"aria-current":o?`true`:void 0,"aria-rowindex":W?r+2:void 0,"aria-busy":u?.state===`saving`?`true`:void 0,"data-wui-save-state":u?.state||void 0,"data-status":He?.(e)||void 0,"data-href":A?.(e)||void 0,"data-row-key":D?String(i):void 0,tabIndex:I?0:void 0,onClick:I?t=>L(e,t):void 0,onAuxClick:I&&A?t=>t.button===1&&L(e,t):void 0,onKeyDown:I?t=>{t.key===`Enter`&&t.target===t.currentTarget&&L(e,t)}:void 0,children:[F&&p(`td`,{className:c.className,style:c.style,children:p(`button`,{type:`button`,className:`wui-expand-toggle${a?` is-open`:``}`,"aria-expanded":a,"aria-controls":a?`${s}-expanded`:void 0,"aria-label":a?`Collapse row`:`Expand row`,onClick:()=>$e(i),children:p(n,{name:`chevron-down`,size:16})})}),w&&p(`td`,{className:l.className,style:l.style,children:p(`input`,{type:`checkbox`,className:`wui-check`,checked:T?.has(i)||!1,onChange:e=>dt(i,e.nativeEvent.shiftKey),onMouseDown:e=>{e.shiftKey&&e.preventDefault()},"aria-label":`Select row`})}),h.map((t,n)=>m(`td`,{className:H(V+n,(n===0?`wui-name-cell `:``)+(t.nowrap?`text-nowrap `:``)+Ce(t.align)+(t.cellClassName?` ${t.cellClassName}`:``)).className,style:U(V+n,t.cellStyle),"data-label":k&&typeof t.label==`string`?t.label:void 0,children:[t.render?t.render(e):we(e[t.key]),n===0&&u?.state===`error`&&p(`span`,{className:le,children:u.message})]},t.key)),S&&p(`td`,{children:p(`div`,{className:`u-row-actions`,children:S(e)})})]}),a&&p(`tr`,{className:`wui-row-expanded`,children:p(`td`,{id:`${s}-expanded`,colSpan:z,children:Ie(e)})})]},i)},kt=(e,t)=>e.group?Dt(e,t):Ot(e,t),At=(e,t)=>W?p(`tr`,{className:`wui-virtual-spacer`,"aria-hidden":`true`,hidden:t===0,children:p(`td`,{colSpan:z,style:{height:t}})},e):null,Q=H(0,`wui-expand-cell`),$=H(+!!F,`wui-select-cell`);return m(te,{children:[m(B?`wui-data-table`:`div`,{ref:J,...B?{class:nt,resizable:M?``:void 0,"view-key":We||void 0,"data-wui-row-drag":D?``:void 0}:{className:nt,"data-wui-row-drag":D?``:void 0},style:rt,tabIndex:0,...Je,children:[m(`table`,{className:Xe,"aria-label":Ae,"aria-rowcount":W?q.length+1:void 0,children:[p(`thead`,{children:m(`tr`,{"aria-rowindex":W?1:void 0,children:[F&&p(`th`,{className:Q.className,style:Q.style,children:p(`span`,{className:`visually-hidden`,children:`Expand`})}),w&&p(`th`,{className:$.className,style:$.style,children:p(`input`,{ref:lt,type:`checkbox`,className:`wui-check`,checked:st,onChange:e=>Pe?.(e.target.checked),"aria-label":`Select all rows`})}),h.map((e,t)=>{let r=!!(e.sortable&&b),i=y&&y.key===e.key,a=e.align===`num`||e.align===`end`,o=r&&p(`span`,{className:`sort-icon${a?` wui-sort-lead`:``}`,children:p(n,{name:`chevrons-up-down`,size:14})}),s=M&&t!==ot,ee=e.width||e.minWidth?{width:e.width,minWidth:e.minWidth}:void 0;return m(`th`,{className:H(V+t,(r?`sortable `:``)+(t===0?`wui-name-cell `:``)+(e.nowrap?`text-nowrap `:``)+(e.grow?`wui-col-grow `:``)+(s?`wui-col-resizable `:``)+Ce(e.align)).className,style:U(V+t,ee),"data-key":B?e.key:void 0,"aria-label":s&&typeof e.label==`string`?e.label:void 0,"data-pin":e.pin===`start`||e.pin===`end`?e.pin:void 0,tabIndex:r?0:void 0,"aria-sort":i?y.dir===`asc`?`ascending`:`descending`:r?`none`:void 0,onClick:r?()=>b(e.key):void 0,onKeyDown:r?t=>{(t.key===`Enter`||t.key===` `)&&(t.preventDefault(),b(e.key))}:void 0,children:[a&&o,e.label,!a&&o,s&&p(`span`,{className:`wui-col-resize`,role:`separator`,"aria-orientation":`vertical`,"aria-valuemin":re,"aria-valuemax":ne,tabIndex:0,"aria-label":ie.resize(typeof e.label==`string`?e.label:e.key)})]},e.key)}),S&&(ke?p(`th`,{className:`wui-cell-end`,children:ke}):p(`th`,{className:`wui-cell-end`,children:p(`span`,{className:`visually-hidden`,children:`Actions`})}))]})}),p(`tbody`,{ref:vt,children:x?p(r,{rows:Te,cols:z}):g?.length?m(te,{children:[At(`before`,Z.before),q.slice(Z.start,Z.end).map((e,t)=>kt(e,Z.start+t)),At(`after`,Z.after)]}):null}),et&&!x&&g?.length>0&&p(`tfoot`,{children:m(`tr`,{children:[F&&p(`td`,{className:Q.className,style:Q.style}),w&&p(`td`,{className:$.className,style:$.style}),h.map((e,t)=>p(`td`,{className:H(V+t,(t===0?`wui-name-cell `:``)+(e.nowrap?`text-nowrap `:``)+Ce(e.align)).className,style:U(V+t,void 0),children:e.footer?e.footer(g):null},e.key)),S&&p(`td`,{})]})})]}),!x&&!g?.length&&p(`div`,{className:`tbl-empty-block`,children:typeof Et==`string`?p(`div`,{className:`tbl-empty-plain`,children:Et}):Et})]}),C&&C.total>0&&p(i,{page:C.page,totalPages:C.totalPages,pageSize:C.pageSize,onPageChange:C.setPage,onPageSizeChange:C.setPageSize,pageSizes:C.pageSizes,mode:C.mode}),St&&p(`div`,{ref:wt,className:`visually-hidden`,role:`status`,"aria-live":`polite`,"data-wui-table-status":``})]})}export{v as default};
|
|
1
|
+
import e from"./warnInvalidValue.js";import t from"./warnUnknownProps.js";import n from"./AppIcon.js";import{AppSkeletonRows as r}from"./AppSkeleton.js";import i from"./AppTablePagination.js";import{attachRowDrag as a,attachScrollEdges as o,syncTargets as s}from"@webority/ui-elements/helpers";import{Fragment as ee,useEffect as c,useLayoutEffect as l,useMemo as u,useRef as d,useState as f}from"react";import{Fragment as te,jsx as p,jsxs as m}from"react/jsx-runtime";import{COLUMN_MAX_WIDTH as ne,COLUMN_MIN_WIDTH as re,DATA_TABLE_TEXT as ie,PIN_AT_VAR as ae,PIN_SIDES as oe,ROW_HEIGHTS as se,ROW_MOVE_LIMIT as ce,ROW_SAVE_ERROR_CLASS as le,groupCount as ue,groupItems as de,measureRows as fe,pinAtValue as pe,pinClasses as me,planPins as he,playRowMoves as ge,rowOrderChanged as _e,saveOutcomeText as ve,settledRows as ye,virtualRange as be}from"@webority/ui-elements/elements/data-table";var xe=[`comfortable`,`cozy`,`compact`],h=()=>{try{return process.env.NODE_ENV!==`production`}catch{return!0}},g=new Set;function Se(e,t){g.has(e)||!h()||(g.add(e),console.warn(`[@webority/ui-react] <AppDataTable> ${t}`))}var Ce=100;function _(e){return e===`end`?`wui-cell-end`:e===`num`?`num`:e===`center`?`text-center`:``}function we(e){return e==null||e===``?`-`:typeof e==`boolean`?String(e):e}function Te(e){if(!e||!(e.total>0))return!1;let t=e.pageSizes?.length?e.pageSizes:[e.pageSize];return e.total>Math.min(...t)}function v({columns:h,rows:g,rowKey:v=e=>e.id,sort:Ee,onSort:y,loading:b=!1,skeletonRows:De=5,empty:Oe=`No records found.`,emptyFiltered:ke,sourceCount:Ae,rowActions:x,rowActionsLabel:je,pagination:S,ariaLabel:Me,className:Ne=``,wrapperClassName:Pe=``,selectable:C=!1,selectedIds:w,onToggleRow:Fe,onToggleAll:Ie,onSelectRange:Le,renderExpanded:Re,density:T=`comfortable`,striped:ze=!1,flush:Be=!1,rowDrag:E=!1,maxHeight:D,stickyFirstColumn:Ve=!1,stickyActions:He=!1,stackOnMobile:O=!1,hiddenColumns:Ue,rowStatus:We,rowHref:k,onRowClick:A,activeRowKey:Ge,resizableColumns:j=!1,viewKey:Ke,groupBy:M,groupLabel:qe,virtual:N=!1,rowSaving:Je,rowSaveError:Ye,...Xe}){t(`AppDataTable`,Xe);let Ze=Ue?.length?new Set(Ue):null;h=Ze?h.filter(e=>!(e.hideable&&Ze.has(e.key))):h,e(`AppDataTable`,`density`,T,xe);for(let t of h)e(`AppDataTable`,`column.pin`,t.pin,oe);let Qe=[`table table-ledger`,T===`cozy`||T===`compact`?`wui-table-${T}`:``,ze?`wui-table-striped`:``,Ve?`wui-table-sticky-first`:``,He?`wui-table-sticky-actions`:``,O?`wui-table-stack`:``,Ne].filter(Boolean).join(` `),P=typeof Re==`function`,[$e,et]=f(()=>new Set),tt=e=>et(t=>{let n=new Set(t);return n.has(e)?n.delete(e):n.add(e),n}),nt=h.some(e=>typeof e.footer==`function`),F=typeof k==`function`||typeof A==`function`,rt=e=>!!e.target.closest(`a, button, input, select, textarea, label, [role='menu'], [role='menuitem'], .dropdown`),it=(e,t)=>{if(rt(t)||(A&&A(e),!k))return;let n=k(e);n&&(t.ctrlKey||t.metaKey||t.button===1?window.open(n,`_blank`,`noopener`):window.location.assign(n))},I=D!==void 0,at=[`table-wrap`,I?`wui-table-scroll`:``,Be?`wui-table-flush`:``,Pe].filter(Boolean).join(` `),ot=I?{maxHeight:D}:void 0,L=Math.max(1,h.length+ +!!x+ +!!C+ +!!P),st=h.some(e=>e.pin===`start`||e.pin===`end`),R=st||j||!!M||N,z=+!!P+ +!!C,ct=st?he([...P?[`lead`]:[],...C?[`lead`]:[],...h.map(e=>e.pin===`start`||e.pin===`end`?e.pin:null),...x?[null]:[]]):[],B=(e,t=``)=>{let n=ct[e];return n?{className:`${t.trim()} ${me(n)}`.trim(),style:{[ae]:pe(n.side,n.ordinal)}}:{className:t,style:void 0}},V=(e,t)=>ct[e]?{...t,...B(e).style}:t,lt=h.length-1+ +!!x;Ke&&!j&&Se(`view-key`,"`viewKey` remembers resized widths: add `resizableColumns`."),N&&!I&&Se(`virtual-height`,"`virtual` needs `maxHeight`: without a scroll box every row renders."),N&&(P||O)&&Se(`virtual-shape`,"`virtual` takes rows of one height, so it is off with `renderExpanded` or `stackOnMobile`.");let H=N&&I&&!P&&!O&&!b&&g?.length>0,U=C&&g?g.reduce((e,t,n)=>e+ +!!w?.has(v(t,n)),0):0,ut=C&&g&&g.length>0&&U===g.length,dt=U>0&&!ut,ft=e=>{e&&(e.indeterminate=dt)},pt=d(null),mt=(e,t)=>{let n=pt.current;pt.current=e;let r=t&&n!==null?g.findIndex((e,t)=>v(e,t)===n):-1,i=g.findIndex((t,n)=>v(t,n)===e);if(r<0||i<0||r===i){Fe?.(e);return}let a=!w?.has(e),o=g.slice(Math.min(r,i),Math.max(r,i)+1).map((e,t)=>v(e,Math.min(r,i)+t)).filter(e=>(w?.has(e)||!1)!==a);if(Le)Le(o,a);else for(let e of o)Fe?.(e)},[W,ht]=f(()=>new Set),gt=e=>ht(t=>{let n=new Set(t);return n.has(e)?n.delete(e):n.add(e),n}),G=u(()=>{let e=(g||[]).map((e,t)=>({row:e,i:t}));return M?de(e,({row:e})=>String(e[M]??``)).flatMap(e=>[{group:e,open:!W.has(e.key)},...W.has(e.key)?[]:e.items]):e},[g,M,W]),K=d(null),q=d(null);c(()=>{let e=K.current;if(!e)return;let t=e=>{let t=e.target.closest?.(`.u-name`);t&&!t.title&&(t.scrollWidth>t.clientWidth||t.scrollHeight>t.clientHeight)&&(t.title=t.textContent.trim())},n=e=>{let t=e.target.closest?.(`tbody > tr[aria-rowindex]`)?.getAttribute(`aria-rowindex`);q.current=t?Number(t)-2:null},r=t=>{e.contains(t.relatedTarget)||(q.current=null)};e.addEventListener(`mouseover`,t),e.addEventListener(`focusin`,t),e.addEventListener(`focusin`,n),e.addEventListener(`focusout`,r);let i=o(e);return()=>{e.removeEventListener(`mouseover`,t),e.removeEventListener(`focusin`,t),e.removeEventListener(`focusin`,n),e.removeEventListener(`focusout`,r),i()}},[R]),c(()=>{if(!E||!K.current)return;let e=a(K.current);return s(document),e},[E,R]);let _t=d(!1);c(()=>{!_t.current&&(_t.current=!0,U===0)||K.current?.querySelector(`table`)?.dispatchEvent(new CustomEvent(`selectionchange`,{bubbles:!0,detail:{selected:U,total:g?.length??0,keys:g?g.map((e,t)=>v(e,t)).filter(e=>w?.has(e)).map(String):[]}}))},[C,U]);let[vt,yt]=f({top:0,height:0}),[J,bt]=f(se[T]??se.comfortable);c(()=>{let e=K.current;if(!H||!e)return;let t=0,n=()=>{t=0;let n=e.querySelector(`:scope > table > thead`)?.getBoundingClientRect().height||0,r={top:Math.max(0,e.scrollTop-n),height:e.clientHeight};yt(e=>e.top===r.top&&e.height===r.height?e:r)},r=()=>{t||=requestAnimationFrame(n)};e.addEventListener(`scroll`,r,{passive:!0});let i=typeof ResizeObserver<`u`?new ResizeObserver(r):null;return i?.observe(e),n(),()=>{e.removeEventListener(`scroll`,r),i?.disconnect(),t&&cancelAnimationFrame(t)}},[H,R]),l(()=>{if(!H)return;let e=(K.current?.querySelector(`:scope > table > tbody > tr:not(.wui-virtual-spacer, .wui-group-row)`))?.getBoundingClientRect().height;e>0&&Math.abs(e-J)>.5&&bt(e)});let Y={start:0,end:G.length,before:0,after:0};if(H){Y=be({scrollTop:vt.top,viewport:vt.height||Number.parseFloat(D)||0,rowHeight:J,count:G.length});let e=q.current;e!==null&&e>=0&&e<G.length&&(e<Y.start&&Y.start-e<=Ce&&(Y={...Y,start:e,before:e*J}),e>=Y.end&&e-Y.end<Ce&&(Y={...Y,end:e+1,after:(G.length-e-1)*J}))}let xt=d(null),X=d(null),Z=d(null),St=!N&&!b&&g?.length>0&&g.length<=ce;l(()=>{let e=xt.current;if(!St||!e){X.current=null,Z.current=null;return}let t=g.map((e,t)=>v(e,t));_e(Z.current,t)&&ge(e.rows,X.current),X.current=fe(e.rows),Z.current=t});let Ct=typeof Je==`function`||typeof Ye==`function`,wt=e=>{let t=!!Je?.(e),n=t?``:Ye?.(e)||``;return{state:t?`saving`:n?`error`:null,message:n}},Tt=d(null),Et=d(null);c(()=>{if(!Ct){Et.current=null;return}let e=h[0]?.key,t=new Map;(g||[]).forEach((n,r)=>{let i=e===void 0?void 0:n[e],a=typeof i==`string`||typeof i==`number`?String(i):``;t.set(v(n,r),{...wt(n),label:a})});let n=ve(ye(Et.current,t));Et.current=t,n&&Tt.current&&(Tt.current.textContent=n)});let Dt=ke!==void 0&&Ae>0?ke:Oe,Ot=({group:e,open:t},r)=>{let i=e.items[0].row[M],a=e.items.map(e=>e.row);return p(`tr`,{className:`wui-group-row`,"data-group-key":e.key,"aria-rowindex":H?r+2:void 0,children:p(`th`,{className:`wui-group-cell`,scope:`rowgroup`,colSpan:L,children:m(`button`,{type:`button`,className:`wui-group-toggle`,"aria-expanded":t,onClick:()=>gt(e.key),children:[p(n,{name:`chevron-down`,size:16}),p(`span`,{className:`wui-group-label`,children:qe?qe(i,a):we(i)}),p(`span`,{className:`wui-group-count`,"aria-hidden":`true`,children:ue(e.items.length)}),p(`span`,{className:`visually-hidden wui-group-rows`,children:`, ${ie.rows(e.items.length)}`})]})})},`group:${e.key}`)},kt=({row:e,i:t},r)=>{let i=v(e,t),a=P&&$e.has(i),o=Ge!=null&&String(Ge)===String(i),s=String(i).replace(/[^a-z0-9]/gi,`_`),c=B(0,`wui-expand-cell`),l=B(+!!P,`wui-select-cell`),u=Ct?wt(e):null;return m(ee,{children:[m(`tr`,{className:[C&&w?.has(i)?`is-selected`:``,F?`wui-row-link`:``,o?`wui-row-active`:``].filter(Boolean).join(` `)||void 0,"aria-current":o?`true`:void 0,"aria-rowindex":H?r+2:void 0,"aria-busy":u?.state===`saving`?`true`:void 0,"data-wui-save-state":u?.state||void 0,"data-status":We?.(e)||void 0,"data-href":k?.(e)||void 0,"data-row-key":E?String(i):void 0,tabIndex:F?0:void 0,onClick:F?t=>it(e,t):void 0,onAuxClick:F&&k?t=>t.button===1&&it(e,t):void 0,onKeyDown:F?t=>{t.key===`Enter`&&t.target===t.currentTarget&&it(e,t)}:void 0,children:[P&&p(`td`,{className:c.className,style:c.style,children:p(`button`,{type:`button`,className:`wui-expand-toggle${a?` is-open`:``}`,"aria-expanded":a,"aria-controls":a?`${s}-expanded`:void 0,"aria-label":a?`Collapse row`:`Expand row`,onClick:()=>tt(i),children:p(n,{name:`chevron-down`,size:16})})}),C&&p(`td`,{className:l.className,style:l.style,children:p(`input`,{type:`checkbox`,className:`wui-check`,checked:w?.has(i)||!1,onChange:e=>mt(i,e.nativeEvent.shiftKey),onMouseDown:e=>{e.shiftKey&&e.preventDefault()},"aria-label":`Select row`})}),h.map((t,n)=>m(`td`,{className:B(z+n,(n===0?`wui-name-cell `:``)+(t.nowrap?`text-nowrap `:``)+_(t.align)+(t.cellClassName?` ${t.cellClassName}`:``)).className,style:V(z+n,t.cellStyle),"data-label":O&&typeof t.label==`string`?t.label:void 0,children:[t.render?t.render(e):we(e[t.key]),n===0&&u?.state===`error`&&p(`span`,{className:le,children:u.message})]},t.key)),x&&p(`td`,{children:p(`div`,{className:`u-row-actions`,children:x(e)})})]}),a&&p(`tr`,{className:`wui-row-expanded`,children:p(`td`,{id:`${s}-expanded`,colSpan:L,children:Re(e)})})]},i)},At=(e,t)=>e.group?Ot(e,t):kt(e,t),jt=(e,t)=>H?p(`tr`,{className:`wui-virtual-spacer`,"aria-hidden":`true`,hidden:t===0,children:p(`td`,{colSpan:L,style:{height:t}})},e):null,Q=B(0,`wui-expand-cell`),$=B(+!!P,`wui-select-cell`);return m(te,{children:[m(R?`wui-data-table`:`div`,{ref:K,...R?{class:at,resizable:j?``:void 0,"view-key":Ke||void 0,"data-wui-row-drag":E?``:void 0}:{className:at,"data-wui-row-drag":E?``:void 0},style:ot,tabIndex:0,...Xe,children:[m(`table`,{className:Qe,"aria-label":Me,"aria-rowcount":H?G.length+1:void 0,children:[p(`thead`,{children:m(`tr`,{"aria-rowindex":H?1:void 0,children:[P&&p(`th`,{className:Q.className,style:Q.style,children:p(`span`,{className:`visually-hidden`,children:`Expand`})}),C&&p(`th`,{className:$.className,style:$.style,children:p(`input`,{ref:ft,type:`checkbox`,className:`wui-check`,checked:ut,onChange:e=>Ie?.(e.target.checked),"aria-label":`Select all rows`})}),h.map((e,t)=>{let r=!!(e.sortable&&y),i=Ee&&Ee.key===e.key,a=e.align===`num`||e.align===`end`,o=r&&p(`span`,{className:`sort-icon${a?` wui-sort-lead`:``}`,children:p(n,{name:`chevrons-up-down`,size:14})}),s=j&&t!==lt,ee=e.width||e.minWidth?{width:e.width,minWidth:e.minWidth}:void 0;return m(`th`,{className:B(z+t,(r?`sortable `:``)+(t===0?`wui-name-cell `:``)+(e.nowrap?`text-nowrap `:``)+(e.grow?`wui-col-grow `:``)+(s?`wui-col-resizable `:``)+_(e.align)).className,style:V(z+t,ee),"data-key":R?e.key:void 0,"aria-label":s&&typeof e.label==`string`?e.label:void 0,"data-pin":e.pin===`start`||e.pin===`end`?e.pin:void 0,tabIndex:r?0:void 0,"aria-sort":i?Ee.dir===`asc`?`ascending`:`descending`:r?`none`:void 0,onClick:r?()=>y(e.key):void 0,onKeyDown:r?t=>{(t.key===`Enter`||t.key===` `)&&(t.preventDefault(),y(e.key))}:void 0,children:[a&&o,e.label,!a&&o,s&&p(`span`,{className:`wui-col-resize`,role:`separator`,"aria-orientation":`vertical`,"aria-valuemin":re,"aria-valuemax":ne,tabIndex:0,"aria-label":ie.resize(typeof e.label==`string`?e.label:e.key)})]},e.key)}),x&&(je?p(`th`,{className:`wui-cell-end`,children:je}):p(`th`,{className:`wui-cell-end`,children:p(`span`,{className:`visually-hidden`,children:`Actions`})}))]})}),p(`tbody`,{ref:xt,children:b?p(r,{rows:De,cols:L}):g?.length?m(te,{children:[jt(`before`,Y.before),G.slice(Y.start,Y.end).map((e,t)=>At(e,Y.start+t)),jt(`after`,Y.after)]}):null}),nt&&!b&&g?.length>0&&p(`tfoot`,{children:m(`tr`,{children:[P&&p(`td`,{className:Q.className,style:Q.style}),C&&p(`td`,{className:$.className,style:$.style}),h.map((e,t)=>p(`td`,{className:B(z+t,(t===0?`wui-name-cell `:``)+(e.nowrap?`text-nowrap `:``)+_(e.align)).className,style:V(z+t,void 0),children:e.footer?e.footer(g):null},e.key)),x&&p(`td`,{})]})})]}),!b&&!g?.length&&p(`div`,{className:`tbl-empty-block`,children:typeof Dt==`string`?p(`div`,{className:`tbl-empty-plain`,children:Dt}):Dt})]}),Te(S)&&p(i,{page:S.page,totalPages:S.totalPages,pageSize:S.pageSize,onPageChange:S.setPage,onPageSizeChange:S.setPageSize,pageSizes:S.pageSizes,mode:S.mode}),Ct&&p(`div`,{ref:Tt,className:`visually-hidden`,role:`status`,"aria-live":`polite`,"data-wui-table-status":``})]})}export{v as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import e from"./warnUnknownProps.js";import t from"./AppIcon.js";import{formatDate as n,toInstant as r}from"@webority/ui-elements/helpers";import{jsx as i,jsxs as a}from"react/jsx-runtime";var o=864e5,s=330*6e4,c=14,l=e=>Math.floor((e+s)/o),u=(...e)=>e.filter(Boolean).join(` `);function d({date:s,soonDays:d,overdue:f=!1,overdueLabel:p,className:m=``,...h}){e(`AppDueDate`,h);let g=r(s);if(!Number.isFinite(g))return i(`wui-due-date`,{class:u(`wui-due-date`,`wui-due-date-empty`,m),...h,children:i(`time`,{children:`Not set`})});let _=l(g),v=new Date(_*o).toISOString().slice(0,10),y=_-l(Date.now());if(f){let e=n(g);return a(`wui-due-date`,{class:u(`wui-due-date`,`wui-due-date-danger`,m),title:`Overdue since ${e}`,...h,children:[i(t,{name:`
|
|
1
|
+
import e from"./warnUnknownProps.js";import t from"./AppIcon.js";import{formatDate as n,toInstant as r}from"@webority/ui-elements/helpers";import{jsx as i,jsxs as a}from"react/jsx-runtime";var o=864e5,s=330*6e4,c=14,l=e=>Math.floor((e+s)/o),u=(...e)=>e.filter(Boolean).join(` `);function d({date:s,soonDays:d,overdue:f=!1,overdueLabel:p,className:m=``,...h}){e(`AppDueDate`,h);let g=r(s);if(!Number.isFinite(g))return i(`wui-due-date`,{class:u(`wui-due-date`,`wui-due-date-empty`,m),...h,children:i(`time`,{children:`Not set`})});let _=l(g),v=new Date(_*o).toISOString().slice(0,10),y=_-l(Date.now());if(f){let e=n(g);return a(`wui-due-date`,{class:u(`wui-due-date`,`wui-due-date-danger`,m),title:`Overdue since ${e}`,...h,children:[i(t,{name:`danger`,size:c}),i(`time`,{dateTime:v,children:p||e})]})}if(Number.isFinite(d)&&y>=0&&y<=d){let e=y===1?`1 day left`:`${y} days left`;return i(`wui-due-date`,{class:u(`wui-due-date`,`wui-due-date-warning`,m),...h,children:i(`time`,{dateTime:v,children:e})})}return i(`wui-due-date`,{class:u(`wui-due-date`,m),...h,children:i(`time`,{dateTime:v,children:n(g)})})}export{d as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import e from"./warnInvalidValue.js";import t from"./warnUnknownProps.js";import n from"./AppIcon.js";import r from"./AppButton.js";import i from"./AppSegmented.js";import a 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{useEffect as p,useId as m,useRef as h,useSyncExternalStore as g}from"react";import{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,S=e=>{let t=window.matchMedia?.(y);return t?.addEventListener(`change`,e),()=>t?.removeEventListener(`change`,e)},C=()=>window.matchMedia?.(y).matches??!1,w=[`enum`,`multiEnum`,`dateRange`,`text`],T=4,E=e=>(e.type===`enum`||e.type===`multiEnum`)&&!e.options?.length,D=(e,t)=>e.options?.find(e=>e.value===t)?.label??t;function O(e,t){if(!c(e,t))return[];if(e.type===`enum`)return[{id:e.key,text:D(e,t),clear:()=>s(e)}];if(e.type===`multiEnum`)return t.map(n=>({id:`${e.key}:${n}`,text:D(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 k=new Set;function A(e){let t=!0;try{t=process.env.NODE_ENV!==`production`}catch{t=!0}!t||k.has(e)||(k.add(e),console.warn(`[@webority/ui-react] <AppFilterBar> facet "${e}" sets allLabel, which only an enum facet uses.`))}var j=new Set;function M(e){let t=!0;try{t=process.env.NODE_ENV!==`production`}catch{t=!0}!t||j.has(e)||(j.add(e),console.warn(`[@webority/ui-react] <AppFilterBar> facet "${e}" sets presets, which only a dateRange facet uses.`))}function N({facets:i,value:o,onChange:l,inline:u=b,floating:d=!1,className:y=``,...T}){t(`AppFilterBar`,T);let D=g(S,C,()=>!1),k=h(null),j=m();for(let t of i)e(`AppFilterBar`,`facets[].type`,t.type,w);for(let e of i)e.allLabel!=null&&e.type!==`enum`&&A(e.key),e.presets!=null&&e.type!==`dateRange`&&M(e.key);let N=i.filter(e=>!E(e)),F=N.flatMap(e=>O(e,o[e.key]).map(t=>({...t,facet:e}))),I=N.filter(e=>c(e,o[e.key])),L=d||D?0:Math.max(0,u),R=N.slice(L),z=R.filter(e=>I.includes(e)).length,B=!d&&R.length>0;p(()=>{if(!B)return;let e=e=>{let t=k.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=>_(P,{facet:e,value:o[e.key],onChange:t=>l(e.key,t)},e.key),H=(e,t)=>t>0&&_(`span`,{className:e,children:` (${t})`}),U=e=>_(a,{size:`sm`,label:`${e.facet.label}: ${e.text}`,removeLabel:`Remove ${e.facet.label} filter ${e.text}`,onRemove:()=>l(e.facet.key,e.clear())},e.id),W=_(r,{variant:`ghost`,size:`sm`,onClick:()=>{for(let e of I)l(e.key,s(e))},children:`Clear all`});if(d){let e=F.slice(x);return v(`div`,{className:`wui-filter-bar d-flex flex-wrap align-items-center gap-2${y?` ${y}`:``}`,...T,children:[v(`wui-filter-popover`,{class:`wui-filter-popover`,children:[v(`button`,{type:`button`,className:`btn btn-outline-primary btn-sm wui-filter-popover-trigger`,"aria-expanded":`false`,"aria-controls":j,children:[_(n,{name:`filter`,size:14,className:`me-2`}),`Filters`,
|
|
1
|
+
import e from"./warnInvalidValue.js";import t from"./warnUnknownProps.js";import n from"./AppIcon.js";import r from"./AppButton.js";import i from"./AppSegmented.js";import a 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{useEffect as p,useId as m,useRef as h,useSyncExternalStore as g}from"react";import{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,S=e=>{let t=window.matchMedia?.(y);return t?.addEventListener(`change`,e),()=>t?.removeEventListener(`change`,e)},C=()=>window.matchMedia?.(y).matches??!1,w=[`enum`,`multiEnum`,`dateRange`,`text`],T=4,E=e=>(e.type===`enum`||e.type===`multiEnum`)&&!e.options?.length,D=(e,t)=>e.options?.find(e=>e.value===t)?.label??t;function O(e,t){if(!c(e,t))return[];if(e.type===`enum`)return[{id:e.key,text:D(e,t),clear:()=>s(e)}];if(e.type===`multiEnum`)return t.map(n=>({id:`${e.key}:${n}`,text:D(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 k=new Set;function A(e){let t=!0;try{t=process.env.NODE_ENV!==`production`}catch{t=!0}!t||k.has(e)||(k.add(e),console.warn(`[@webority/ui-react] <AppFilterBar> facet "${e}" sets allLabel, which only an enum facet uses.`))}var j=new Set;function M(e){let t=!0;try{t=process.env.NODE_ENV!==`production`}catch{t=!0}!t||j.has(e)||(j.add(e),console.warn(`[@webority/ui-react] <AppFilterBar> facet "${e}" sets presets, which only a dateRange facet uses.`))}function N({facets:i,value:o,onChange:l,inline:u=b,floating:d=!1,className:y=``,...T}){t(`AppFilterBar`,T);let D=g(S,C,()=>!1),k=h(null),j=m();for(let t of i)e(`AppFilterBar`,`facets[].type`,t.type,w);for(let e of i)e.allLabel!=null&&e.type!==`enum`&&A(e.key),e.presets!=null&&e.type!==`dateRange`&&M(e.key);let N=i.filter(e=>!E(e)),F=N.flatMap(e=>O(e,o[e.key]).map(t=>({...t,facet:e}))),I=N.filter(e=>c(e,o[e.key])),L=d||D?0:Math.max(0,u),R=N.slice(L),z=R.filter(e=>I.includes(e)).length,B=!d&&R.length>0;p(()=>{if(!B)return;let e=e=>{let t=k.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=>_(P,{facet:e,value:o[e.key],onChange:t=>l(e.key,t)},e.key),H=(e,t)=>t>0&&_(`span`,{className:e,children:` (${t})`}),U=e=>_(a,{size:`sm`,label:`${e.facet.label}: ${e.text}`,removeLabel:`Remove ${e.facet.label} filter ${e.text}`,onRemove:()=>l(e.facet.key,e.clear())},e.id),W=_(r,{variant:`ghost`,size:`sm`,onClick:()=>{for(let e of I)l(e.key,s(e))},children:`Clear all`});if(d){let e=F.slice(x),t=I.length,r=e=>v(`div`,{className:`wui-filter-popover-field`,children:[_(`span`,{className:`label`,"aria-hidden":`true`,children:e.label}),_(P,{facet:e,value:o[e.key],onChange:t=>l(e.key,t),floating:!0})]},e.key);return v(`div`,{className:`wui-filter-bar d-flex flex-wrap align-items-center gap-2${y?` ${y}`:``}`,...T,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":j,"aria-label":t>0?`Filters, ${t} active`:void 0,children:[_(n,{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:j,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:`${j}-pin`})]}),_(`div`,{className:`wui-filter-popover-grid`,children:N.map(r)}),v(`div`,{className:`wui-filter-popover-foot`,children:[_(`span`,{className:`wui-filter-popover-note`,children:`Changes apply at once.`}),t>0&&W]})]})]}),F.slice(0,x).map(U),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]})]})}return v(`div`,{className:`wui-filter-bar d-flex flex-wrap align-items-center gap-2${D&&B?` wui-filter-bar--folded`:``}${y?` ${y}`:``}`,...T,children:[N.slice(0,L).map(V),B&&v(`details`,{ref:k,className:`wui-filter-more`,children:[v(`summary`,{className:`btn btn-outline-primary btn-sm wui-filter-more-trigger`,children:[_(n,{name:`filter`,size:14,className:`me-2`}),`Filters`,H(`wui-filter-count-desktop`,z),H(`wui-filter-count-phone`,I.length)]}),v(`div`,{className:`wui-filter-more-panel`,children:[_(`div`,{className:`wui-filter-more-head`,children:`Filters`}),R.map(V)]})]}),F.map(U),I.length>1&&W]})}function P({facet:e,value:t,onChange:n,floating:r=!1}){if(e.type===`enum`){let a=e.options??[];return a.length<T?_(i,{label:e.label,name:e.key,size:`sm`,value:t??``,onChange:n,options:[{value:``,label:e.allLabel||`All`},...a]}):_(d,{"aria-label":e.label,name:e.key,placeholder:r?`Any`:e.label,size:`sm`,clearable:!0,value:t??``,onChange:n,options:a})}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{N as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import e from"./warnInvalidValue.js";import t from"./warnUnknownProps.js";import n from"./AppIcon.js";import{
|
|
1
|
+
import e from"./warnInvalidValue.js";import t from"./warnUnknownProps.js";import n from"./AppIcon.js";import{BreadcrumbTrailContext as r}from"./AppBreadcrumbs.js";import{formatNumber as i}from"@webority/ui-elements/helpers";import{useEffect as a,useState as o}from"react";import{jsx as s,jsxs as c}from"react/jsx-runtime";var l=[`primary`,`success`,`warning`,`danger`,`info`],u=[`sm`,`md`,`lg`,`bar`],d=[`start`,`center`],f=[`inline`,`below`],p=[`h1`,`h2`,`h3`,`h4`,`h5`,`h6`];function m({title:m,as:h=`h1`,subtitle:g,eyebrow:_,icon:v,tone:y=`primary`,status:b,breadcrumbs:x,actions:S,views:C,tools:w,meta:T,metaPlacement:E=`inline`,bulkFor:D,bulk:O,size:k=`md`,align:A=`start`,divider:j=!1,sticky:M=!1,className:N=``,...P}){t(`AppPageHeader`,P),e(`AppPageHeader`,`tone`,y,l),e(`AppPageHeader`,`size`,k,u),e(`AppPageHeader`,`align`,A,d),e(`AppPageHeader`,`as`,h,p),e(`AppPageHeader`,`metaPlacement`,E,f);let F=p.includes(h)?h:`h1`,I=k===`bar`,L=I&&E===`below`,R=[`page-header`,k&&k!==`md`?`page-header-${k}`:``,A===`center`?`page-header-center`:``,j?`page-header-divider`:``,M?`page-header-sticky`:``,y&&y!==`primary`?`tone-${y}`:``,L?`wui-page-header-meta-below`:``,N].filter(Boolean).join(` `),[z,B]=o(0),V=I?D:void 0;if(a(()=>{if(!V)return;document.getElementById(V)?.setAttribute(`data-wui-bulk-in-bar`,``);let e=e=>{typeof e.detail?.selected==`number`&&document.getElementById(V)?.contains(e.target)&&B(e.detail.selected)};return document.addEventListener(`selectionchange`,e),()=>{document.removeEventListener(`selectionchange`,e),document.getElementById(V)?.removeAttribute(`data-wui-bulk-in-bar`)}},[V]),I)return c(`header`,{className:R,"data-wui-page-header-bar":``,"data-wui-bulk-for":D||void 0,...P,children:[x!=null&&s(r.Provider,{value:!0,children:s(`div`,{className:`page-header-bar-crumbs`,children:x})}),m!=null&&s(F,{className:`page-title`,children:m}),b!=null&&s(`span`,{className:`page-status`,children:b}),C!=null&&s(`div`,{className:`page-header-bar-views`,"data-wui-bar-swap":``,hidden:D&&z>0?!0:void 0,children:C}),s(`span`,{className:`page-header-bar-spacer`,"aria-hidden":`true`}),T!=null&&!L&&s(`div`,{className:`page-header-bar-meta`,children:T}),w!=null&&s(`div`,{className:`page-header-bar-tools`,"data-wui-bar-swap":``,hidden:D&&z>0?!0:void 0,children:w}),D?c(`div`,{className:`page-header-bar-bulk`,"data-wui-bar-bulk":``,hidden:z===0||void 0,children:[s(`span`,{className:`page-header-bar-bulk-count`,"aria-live":`polite`,children:z>0?`${i(z,{decimals:0})} selected`:``}),O]}):null,S!=null&&s(`div`,{className:`page-actions`,children:S}),T!=null&&L&&s(`div`,{className:`page-header-bar-meta`,children:T})]});let H=v==null?null:typeof v==`string`?s(n,{name:v,size:20}):v;return c(`div`,{className:R,...P,children:[x!=null&&s(`div`,{className:`page-breadcrumbs`,children:x}),c(`div`,{className:`page-header-bar`,children:[c(`div`,{className:`page-header-lead`,children:[H!=null&&s(`span`,{className:`page-header-icon`,children:H}),c(`div`,{className:`page-header-titles`,children:[_!=null&&s(`div`,{className:`page-eyebrow`,children:_}),c(`div`,{className:`page-titlebar`,children:[m!=null&&s(F,{className:`page-title`,children:m}),b!=null&&s(`span`,{className:`page-status`,children:b})]}),g!=null&&s(`div`,{className:`page-subtitle`,children:g})]})]}),S!=null&&s(`div`,{className:`page-actions`,children:S})]})]})}export{m as default};
|
package/dist/lib/useTableView.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{useCallback as e,useEffect as t,useState as n}from"react";var r=e=>`wui-view:${e}`;function i(e,t){try{let n=window.localStorage.getItem(r(e));if(!n)return t;let i=JSON.parse(n);return{hidden:Array.isArray(i.hidden)?i.hidden:t.hidden,sort:i.sort&&typeof i.sort.key==`string`?i.sort:t.sort}}catch{return t}}function a(a,{sort:o}={}){let[
|
|
1
|
+
import{useCallback as e,useEffect as t,useState as n}from"react";var r=e=>`wui-view:${e}`;function i(e,t){try{let n=window.localStorage.getItem(r(e));if(!n)return t;let i=JSON.parse(n);return{hidden:Array.isArray(i.hidden)?i.hidden:t.hidden,sort:i.sort&&typeof i.sort.key==`string`?i.sort:t.sort}}catch{return t}}function a(a,{sort:o,defaultHidden:s=[]}={}){let[c,l]=n(()=>i(a,{hidden:s,sort:o}));t(()=>{try{window.localStorage.setItem(r(a),JSON.stringify(c))}catch{}},[a,c]);let u=e(e=>l(t=>({...t,hidden:t.hidden.includes(e)?t.hidden.filter(t=>t!==e):[...t.hidden,e]})),[]),d=e(e=>l(t=>({...t,sort:typeof e==`function`?e(t.sort):e})),[]);return{hiddenColumns:c.hidden,toggleColumn:u,sort:c.sort,setSort:d}}export{a as useTableView};
|
|
@@ -1,6 +1,9 @@
|
|
|
1
|
+
/** True inside a bar page header: every crumb is a parent link and none is the current page. */
|
|
2
|
+
export declare const BreadcrumbTrailContext: import("react").Context<boolean>;
|
|
1
3
|
/**
|
|
2
4
|
* A breadcrumb trail — the path from a root to the current page. The last item is the
|
|
3
|
-
* current page: rendered as text with `aria-current="page"`, never a link
|
|
5
|
+
* current page: rendered as text with `aria-current="page"`, never a link, except inside a bar
|
|
6
|
+
* page header (`BreadcrumbTrailContext`), where every crumb is a parent. Wraps
|
|
4
7
|
* react-bootstrap's Breadcrumb (Bootstrap `.breadcrumb`), so React and the Razor
|
|
5
8
|
* `<app-breadcrumbs>` render the same markup.
|
|
6
9
|
*
|
|
@@ -11,7 +14,7 @@
|
|
|
11
14
|
* @param {object} props
|
|
12
15
|
* @param {{ key?: string, label: string, href?: string, to?: string,
|
|
13
16
|
* icon?: string|import('react').ReactNode }[]} props.items The trail, root first, current
|
|
14
|
-
* page last. An item links when it has `href`/`to
|
|
17
|
+
* page last. An item links when it has `href`/`to`, unless it is the current page.
|
|
15
18
|
* @param {import('react').ElementType} [props.linkComponent] Component for `to` items (e.g. Link).
|
|
16
19
|
* @param {string} [props.className]
|
|
17
20
|
*/
|
|
@@ -31,8 +31,11 @@
|
|
|
31
31
|
* @param {string} [props.href] Makes the whole card a link.
|
|
32
32
|
* @param {(e) => void} [props.onClick] Makes the whole card a button (when no href).
|
|
33
33
|
* @param {import('react').ElementType} [props.linkComponent] Router link; receives `to` instead of `href`.
|
|
34
|
+
* @param {() => void} [props.onClose] Called when the close button is pressed; the card then hides itself.
|
|
35
|
+
* @param {boolean} [props.dismissible] Show a close button at the end of the header (defaults to true when onClose is set).
|
|
36
|
+
* @param {string} [props.closeLabel="Close"] Accessible name of the close button.
|
|
34
37
|
*/
|
|
35
|
-
export default function AppCard({ title, subtitle, headerIcon, titleClassName, header, headerExtra, headerActions, footer, media, children, variant, tone, padding, maxWidth, className, bodyClassName, headerClassName, body, lifted, href, onClick, linkComponent: Link, ...rest }: {
|
|
38
|
+
export default function AppCard({ title, subtitle, headerIcon, titleClassName, header, headerExtra, headerActions, footer, media, children, variant, tone, padding, maxWidth, className, bodyClassName, headerClassName, body, lifted, href, onClick, linkComponent: Link, onClose, dismissible, closeLabel, ...rest }: {
|
|
36
39
|
title?: import('react').ReactNode;
|
|
37
40
|
subtitle?: import('react').ReactNode;
|
|
38
41
|
headerIcon?: string;
|
|
@@ -55,4 +58,7 @@ export default function AppCard({ title, subtitle, headerIcon, titleClassName, h
|
|
|
55
58
|
href?: string;
|
|
56
59
|
onClick?: (e: any) => void;
|
|
57
60
|
linkComponent?: import('react').ElementType;
|
|
61
|
+
onClose?: () => void;
|
|
62
|
+
dismissible?: boolean;
|
|
63
|
+
closeLabel?: string;
|
|
58
64
|
}): import("react").JSX.Element;
|
|
@@ -20,7 +20,8 @@
|
|
|
20
20
|
* @param {string} [props.rowActionsLabel]
|
|
21
21
|
* @param {object} [props.pagination] The footer's state, usually straight from usePagination:
|
|
22
22
|
* `{ page, totalPages, pageSize, total, setPage, setPageSize }`, plus the optional `pageSizes`
|
|
23
|
-
* and `mode` that AppTablePagination takes. The footer shows once `total` is above
|
|
23
|
+
* and `mode` that AppTablePagination takes. The footer shows once `total` is above the smallest of
|
|
24
|
+
* `pageSizes` (or `pageSize` when there are none) and stays
|
|
24
25
|
* in place while `loading`, so the table does not jump between pages.
|
|
25
26
|
* @param {string} [props.ariaLabel]
|
|
26
27
|
* @param {string} [props.className] Extra classes on the <table> (column/table styling).
|
|
@@ -2,15 +2,17 @@
|
|
|
2
2
|
* Hidden columns and sort for one table, remembered per browser.
|
|
3
3
|
*
|
|
4
4
|
* @param {string} viewKey Names the view, e.g. "invoices". Two tables sharing a key share a view.
|
|
5
|
-
* @param {{ sort?: { key: string, dir: "asc"|"desc" } }} [options] The sort to start
|
|
5
|
+
* @param {{ sort?: { key: string, dir: "asc"|"desc" }, defaultHidden?: string[] }} [options] The sort to start
|
|
6
|
+
* from, and the keys of the columns hidden until the user stores a choice (a stored list always wins).
|
|
6
7
|
* @returns {{ hiddenColumns: string[], toggleColumn: (key: string) => void,
|
|
7
8
|
* sort: { key: string, dir: "asc"|"desc" }|undefined, setSort: (next: object|((prev: object) => object)) => void }}
|
|
8
9
|
*/
|
|
9
|
-
export declare function useTableView(viewKey: string, { sort: initialSort }?: {
|
|
10
|
+
export declare function useTableView(viewKey: string, { sort: initialSort, defaultHidden }?: {
|
|
10
11
|
sort?: {
|
|
11
12
|
key: string;
|
|
12
13
|
dir: "asc" | "desc";
|
|
13
14
|
};
|
|
15
|
+
defaultHidden?: string[];
|
|
14
16
|
}): {
|
|
15
17
|
hiddenColumns: string[];
|
|
16
18
|
toggleColumn: (key: string) => void;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@webority/ui-react",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.69.0",
|
|
4
4
|
"description": "Webority shared React component library — App* primitives on react-bootstrap + the @webority/theme design system.",
|
|
5
5
|
"license": "SEE LICENSE IN LICENSE",
|
|
6
6
|
"type": "module",
|
|
@@ -27,8 +27,8 @@
|
|
|
27
27
|
},
|
|
28
28
|
"sideEffects": false,
|
|
29
29
|
"dependencies": {
|
|
30
|
-
"@webority/theme": "0.
|
|
31
|
-
"@webority/ui-elements": "0.
|
|
30
|
+
"@webority/theme": "0.69.0",
|
|
31
|
+
"@webority/ui-elements": "0.69.0"
|
|
32
32
|
},
|
|
33
33
|
"peerDependencies": {
|
|
34
34
|
"@webority/analytics": "^0.23.0",
|