@vuu-ui/vuu-table 0.8.12 → 0.8.13-debug

package/cjs/index.js

@@ -1,2 +1,3451 @@
-"use strict";var Cl=Object.create;var Gt=Object.defineProperty;var bl=Object.getOwnPropertyDescriptor;var gl=Object.getOwnPropertyNames;var hl=Object.getPrototypeOf,vl=Object.prototype.hasOwnProperty;var yl=(e,t)=>{for(var o in t)Gt(e,o,{get:t[o],enumerable:!0})},Yo=(e,t,o,n)=>{if(t&&typeof t=="object"||typeof t=="function")for(let r of gl(t))!vl.call(e,r)&&r!==o&&Gt(e,r,{get:()=>t[r],enumerable:!(n=bl(t,r))||n.enumerable});return e};var W=(e,t,o)=>(o=e!=null?Cl(hl(e)):{},Yo(t||!e||!e.__esModule?Gt(o,"default",{value:e,enumerable:!0}):o,e)),Tl=e=>Yo(Gt({},"__esModule",{value:!0}),e);var vi={};yl(vi,{ColumnResizer:()=>ft,GroupHeaderCellNext:()=>At,Table:()=>Ms,TableNext:()=>rl,buildContextMenuDescriptors:()=>Ct,isShowColumnSettings:()=>is,isShowTableSettings:()=>as,updateTableConfig:()=>jt,useMeasuredContainer:()=>ko,useSelection:()=>Mt,useTableColumnResize:()=>yt,useTableContextMenu:()=>bt,useTableModel:()=>No,useTableViewport:()=>Rt});module.exports=Tl(vi);var Be=require("react");var jo=require("react/jsx-runtime"),Zo=()=>{},wl="vuuColumnResizer",ft=({onDrag:e,onDragEnd:t=Zo,onDragStart:o=Zo})=>{let n=(0,Be.useRef)(0),r=(0,Be.useCallback)(i=>{i.stopPropagation&&i.stopPropagation(),i.preventDefault&&i.preventDefault();let a=Math.round(i.clientX),c=a-n.current;n.current=a,c!==0&&e(i,c)},[e]),l=(0,Be.useCallback)(i=>{window.removeEventListener("mouseup",l),window.removeEventListener("mousemove",r),t(i)},[t,r]),s=(0,Be.useCallback)(i=>{o(i),n.current=Math.round(i.clientX),window.addEventListener("mouseup",l),window.addEventListener("mousemove",r),i.stopPropagation&&i.stopPropagation(),i.preventDefault&&i.preventDefault()},[o,r,l]);return(0,jo.jsx)("div",{className:wl,"data-align":"end",onMouseDown:s})};var qo=require("@vuu-ui/vuu-utils"),Ct=e=>(t,o)=>{let n=[];if(e===void 0)return n;if(t==="header"||t==="column-menu")n.push(...Dl(o,e)),n.push(...xl(o,e)),n.push(...Ml(o,e)),n.push(...Rl(o)),n.push({action:"column-settings",icon:"cog",label:"Column Settings",options:o}),n.push({action:"table-settings",icon:"cog",label:"DataGrid Settings",options:o});else if(t==="filter"){let{column:r,filter:l}=o,s=(l==null?void 0:l.column)===(r==null?void 0:r.name);n.push({label:"Edit filter",action:"filter-edit",options:o}),n.push({label:"Remove filter",action:"filter-remove-column",options:o}),r&&!s&&n.push({label:"Remove all filters",action:"remove-filters",options:o})}return n};function Dl(e,{sort:{sortDefs:t}}){let{column:o}=e,n=[];if(o===void 0)return n;let r=t.length>0;return o.sorted==="A"?n.push({label:"Reverse Sort (DSC)",action:"sort-dsc",options:e}):o.sorted==="D"?n.push({label:"Reverse Sort (ASC)",action:"sort-asc",options:e}):typeof o.sorted=="number"?(o.sorted>0?n.push({label:"Reverse Sort (DSC)",action:"sort-add-dsc",options:e}):n.push({label:"Reverse Sort (ASC)",action:"sort-add-asc",options:e}),r&&Math.abs(o.sorted)<t.length&&n.push({label:"Remove from sort",action:"sort-remove",options:e}),n.push({label:"New Sort",children:[{label:"Ascending",action:"sort-asc",options:e},{label:"Descending",action:"sort-dsc",options:e}]})):r?(n.push({label:"Add to sort",children:[{label:"Ascending",action:"sort-add-asc",options:e},{label:"Descending",action:"sort-add-dsc",options:e}]}),n.push({label:"New Sort",children:[{label:"Ascending",action:"sort-asc",options:e},{label:"Descending",action:"sort-dsc",options:e}]})):n.push({label:"Sort",children:[{label:"Ascending",action:"sort-asc",options:e},{label:"Descending",action:"sort-dsc",options:e}]}),n}function Ml(e,t){let{column:o}=e;if(o===void 0||t.groupBy.length===0)return[];let{name:n,label:r=n}=o;return[{label:`Aggregate ${r}`,children:[{label:"Count",action:"agg-count",options:e},{label:"Distinct",action:"agg-distinct",options:e}].concat((0,qo.isNumericColumn)(o)?[{label:"Sum",action:"agg-sum",options:e},{label:"Avg",action:"agg-avg",options:e},{label:"High",action:"agg-high",options:e},{label:"Low",action:"agg-low",options:e}]:[])}]}var yo=(e,t)=>({label:`Pin ${t}`,action:`column-pin-${t}`,options:e}),go=e=>yo(e,"left"),ho=e=>yo(e,"floating"),vo=e=>yo(e,"right");function Rl(e){let{column:t}=e;if(t===void 0)return[];let{pin:o}=t,n=[{label:"Hide column",action:"column-hide",options:e},{label:"Remove column",action:"column-remove",options:e}];return o===void 0?n.push({label:"Pin column",children:[go(e),ho(e),vo(e)]}):o==="left"?n.push({label:"Unpin column",action:"column-unpin",options:e},{label:"Pin column",children:[ho(e),vo(e)]}):o==="right"?n.push({label:"Unpin column",action:"column-unpin",options:e},{label:"Pin column",children:[go(e),ho(e)]}):o==="floating"&&n.push({label:"Unpin column",action:"column-unpin",options:e},{label:"Pin column",children:[go(e),vo(e)]}),n}function xl(e,{groupBy:t}){let{column:o}=e,n=[];if(o===void 0)return n;let{name:r,label:l=r}=o;return t.length===0?n.push({label:`Group by ${l}`,action:"group",options:e}):n.push({label:`Add ${l} to group by`,action:"group-add",options:e}),n}var en=require("@vuu-ui/vuu-utils"),B=require("@vuu-ui/vuu-utils"),Pl=(e,t)=>{if(e.filterStruct&&t){let[o,n]=(0,en.removeColumnFromFilter)(t,e.filterStruct);return{filter:n,filterStruct:o}}else return e},{Average:Hl,Count:El,Distinct:Sl,High:Al,Low:Ll,Sum:Kl}=B.AggregationType,bt=({dataSource:e,onPersistentColumnOperation:t})=>n=>{let r=n.options;if(r.column&&e){let{column:l}=r;switch(n.menuId){case"sort-asc":return e.sort=(0,B.setSortColumn)(e.sort,l,"A"),!0;case"sort-dsc":return e.sort=(0,B.setSortColumn)(e.sort,l,"D"),!0;case"sort-add-asc":return e.sort=(0,B.addSortColumn)(e.sort,l,"A"),!0;case"sort-add-dsc":return e.sort=(0,B.addSortColumn)(e.sort,l,"D"),!0;case"group":return e.groupBy=(0,B.addGroupColumn)(e.groupBy,l),!0;case"group-add":return e.groupBy=(0,B.addGroupColumn)(e.groupBy,l),!0;case"column-hide":return t({type:"hideColumns",columns:[l]}),!0;case"column-remove":return e.columns=e.columns.filter(s=>s!==l.name),!0;case"filter-remove-column":return e.filter=Pl(e.filter,l),!0;case"remove-filters":return e.filter={filter:""},!0;case"agg-avg":return e.aggregations=(0,B.setAggregations)(e.aggregations,l,Hl),!0;case"agg-high":return e.aggregations=(0,B.setAggregations)(e.aggregations,l,Al),!0;case"agg-low":return e.aggregations=(0,B.setAggregations)(e.aggregations,l,Ll),!0;case"agg-count":return e.aggregations=(0,B.setAggregations)(e.aggregations,l,El),!0;case"agg-distinct":return e.aggregations=(0,B.setAggregations)(e.aggregations,l,Sl),!0;case"agg-sum":return e.aggregations=(0,B.setAggregations)(e.aggregations,l,Kl),!0;case"column-pin-floating":return t({type:"pinColumn",column:l,pin:"floating"}),!0;case"column-pin-left":return t({type:"pinColumn",column:l,pin:"left"}),!0;case"column-pin-right":return t({type:"pinColumn",column:l,pin:"right"}),!0;case"column-unpin":return t({type:"pinColumn",column:l,pin:void 0}),!0;case"column-settings":return t({type:"columnSettings",column:l}),!0;case"table-settings":return t({type:"tableSettings"}),!0;default:}}return!1};var Yn=require("@vuu-ui/vuu-popups"),_t=require("@salt-ds/core");var re=require("@vuu-ui/vuu-utils"),Xe=require("react");var j=require("@vuu-ui/vuu-utils"),an=W(require("classnames")),ht=require("react");var Wt=require("@vuu-ui/vuu-utils"),on=require("@vuu-ui/vuu-ui-controls"),nn=W(require("classnames")),ve=require("react");var gt=require("react/jsx-runtime"),{KEY:tn}=Wt.metadataKeys,To=(0,ve.memo)(({className:e,column:t,columnMap:o,onClick:n,row:r})=>{let l=(0,ve.useRef)(null),{align:s,CellRenderer:i,key:a,pin:c,editable:u,resizing:p,valueFormatter:m}=t,[C,h]=(0,ve.useState)(!1),v=m(r[a]),[T,x]=(0,ve.useState)(v),g=()=>{var H;(H=l.current)==null||H.focus()},f=H=>{H.key==="Enter"&&h(!0)},M=(0,ve.useCallback)(H=>{n==null||n(H,t)},[t,n]),D=()=>{h(!0)},w=(H="",y="",R=!0,A=!1)=>{var S;h(!1),A?x(H):y!==H&&x(y),R===!1&&((S=l.current)==null||S.focus())},d=(0,nn.default)(e,{vuuAlignRight:s==="right",vuuPinFloating:c==="floating",vuuPinLeft:c==="left",vuuPinRight:c==="right","vuuTableCell-resizing":p})||void 0,b=(0,Wt.getColumnStyle)(t);return u?(0,gt.jsx)("div",{className:d,"data-editable":!0,role:"cell",style:b,onKeyDown:f,children:(0,gt.jsx)(on.EditableLabel,{editing:C,value:T,onChange:x,onMouseDownCapture:g,onEnterEditMode:D,onExitEditMode:w,onKeyDown:f,ref:l,tabIndex:0},"title")}):(0,gt.jsx)("div",{className:d,role:"cell",style:b,onClick:M,children:i?(0,gt.jsx)(i,{column:t,columnMap:o,row:r}):v})},kl);To.displayName="TableCell";function kl(e,t){return e.column===t.column&&e.onClick===t.onClick&&e.row[tn]===t.row[tn]&&e.row[e.column.key]===t.row[t.column.key]}var _e=require("@vuu-ui/vuu-utils"),rn=require("react");var Ue=require("react/jsx-runtime"),{IS_LEAF:Nl}=_e.metadataKeys,ln=({column:e,onClick:t,row:o})=>{let{columns:n}=e,[r,l]=(0,_e.getGroupValueAndOffset)(n,o),s=(0,rn.useCallback)(u=>{t==null||t(u,e)},[e,t]),i=(0,_e.getColumnStyle)(e),a=o[Nl],c=Array(l).fill(0).map((u,p)=>(0,Ue.jsx)("span",{className:"vuuTableGroupCell-spacer"},p));return(0,Ue.jsxs)("div",{className:"vuuTableGroupCell vuuPinLeft",onClick:a?void 0:s,role:"cell",style:i,children:[c,a?null:(0,Ue.jsx)("span",{className:"vuuTableGroupCell-toggle","data-icon":"triangle-right"}),(0,Ue.jsx)("span",{children:r})]})};var vt=require("react/jsx-runtime"),{IDX:zl,IS_EXPANDED:Il,SELECTED:Vl}=j.metadataKeys,{True:sn,First:$l,Last:Fl}=j.RowSelected,Je="vuuTableRow",cn=(0,ht.memo)(function({columnMap:t,columns:o,offset:n,onClick:r,onToggleGroup:l,virtualColSpan:s=0,row:i}){let{[zl]:a,[Il]:c,[Vl]:u}=i,p=(0,an.default)(Je,{[`${Je}-even`]:a%2===0,[`${Je}-expanded`]:c,[`${Je}-selected`]:u&sn,[`${Je}-selectedStart`]:u&$l,[`${Je}-selectedEnd`]:u&Fl}),m=(0,ht.useCallback)(h=>{let v=h.shiftKey,T=h.ctrlKey||h.metaKey;r==null||r(i,v,T)},[r,i]),C=(0,ht.useCallback)((h,v)=>{((0,j.isGroupColumn)(v)||(0,j.isJsonGroup)(v,i))&&(h.stopPropagation(),l==null||l(i,v))},[l,i]);return(0,vt.jsxs)("div",{"aria-selected":u&sn?!0:void 0,"aria-rowindex":a,className:p,onClick:m,role:"row",style:{transform:`translate3d(0px, ${n}px, 0px)`},children:[s>0?(0,vt.jsx)("div",{role:"cell",style:{width:s}}):null,o.filter(j.notHidden).map(h=>{let v=(0,j.isGroupColumn)(h),T=(0,j.isJsonColumn)(h);return(0,vt.jsx)(v?ln:To,{column:h,columnMap:t,onClick:v||T?C:void 0,row:i},h.name)})]})});var wo=W(require("classnames")),mn=require("react");var Le=require("react"),yt=({column:e,onResize:t,rootRef:o})=>{let n=(0,Le.useRef)(0),r=(0,Le.useRef)(!1),{name:l}=e,s=(0,Le.useCallback)(()=>{if(t&&o.current){console.log("handleResizeStart");let{width:c}=o.current.getBoundingClientRect();n.current=Math.round(c),r.current=!0,t==null||t("begin",l)}},[l,t,o]),i=(0,Le.useCallback)((c,u)=>{if(o.current&&t){let{width:p}=o.current.getBoundingClientRect(),m=Math.round(p)+u;m!==n.current&&m>0&&(t("resize",l,m),n.current=m)}},[l,t,o]),a=(0,Le.useCallback)(()=>{t&&(t("end",l,n.current),setTimeout(()=>{r.current=!1},100))},[l,t]);return{isResizing:r.current,onDrag:i,onDragStart:s,onDragEnd:a}};var ue=require("react/jsx-runtime"),Me="vuuTable-groupHeaderCell",un=({column:e,onClick:t,...o})=>(0,ue.jsx)("span",{...o,className:`${Me}-close`,"data-icon":"close-circle",onClick:()=>t==null?void 0:t(e)}),Ol=e=>{let{children:t,column:o,className:n}=e;return(0,ue.jsxs)("div",{className:(0,wo.default)(`${Me}-col`,n),role:"columnheader",children:[(0,ue.jsx)("span",{className:`${Me}-label`,children:o.name}),t]})},pn=({column:e,className:t,onRemoveColumn:o,onResize:n,...r})=>{let l=(0,mn.useRef)(null),{isResizing:s,...i}=yt({column:e,onResize:n,rootRef:l}),a=(0,wo.default)(Me,t,{vuuPinLeft:e.pin==="left",[`${Me}-right`]:e.align==="right",[`${Me}-resizing`]:e.resizing,[`${Me}-pending`]:e.groupConfirmed===!1}),{columns:c}=e;return(0,ue.jsx)("div",{className:a,ref:l,...r,children:(0,ue.jsxs)("div",{className:`${Me}-inner`,children:[c.map(u=>(0,ue.jsx)(Ol,{column:u,children:c.length>1?(0,ue.jsx)(un,{column:u,onClick:o}):null},u.key)),(0,ue.jsx)(un,{"data-align":"end",onClick:o}),e.resizeable!==!1?(0,ue.jsx)(ft,{...i}):null]})})};var yn=W(require("classnames")),ke=require("react");var Do=W(require("classnames"));var Ke=require("react/jsx-runtime"),dn="vuuSortIndicator",fn=({sorted:e})=>{if(!e)return null;let t=typeof e=="number"?e<0?"dsc":"asc":e==="A"?"asc":"dsc";return typeof e=="number"?(0,Ke.jsxs)("div",{className:(0,Do.default)(dn,"multi-col",t),children:[(0,Ke.jsx)("span",{"data-icon":`sorted-${t}`}),(0,Ke.jsx)("span",{className:"vuuSortPosition",children:Math.abs(e)})]}):(0,Ke.jsx)("div",{className:(0,Do.default)(dn,"single-col"),children:(0,Ke.jsx)("span",{"data-icon":`sorted-${t}`})})};var Tn=require("@vuu-ui/vuu-popups");var Cn=require("@vuu-ui/vuu-popups"),bn=W(require("classnames")),gn=require("react");var vn=require("react/jsx-runtime");var hn=({column:e,filter:t})=>{let[o]=(0,Cn.useContextMenu)(),n=(0,gn.useCallback)(r=>{r.stopPropagation(),o(r,"filter",{column:e,filter:t})},[e,t,o]);return e.filter?(0,vn.jsx)("div",{className:(0,bn.default)("vuuFilterIndicator"),"data-icon":"filter",onClick:n}):null};var Re=require("react/jsx-runtime"),Tt="vuuTable-headerCell",wn=({column:e,className:t,onClick:o,onDragStart:n,onResize:r,...l})=>{let s=(0,ke.useRef)(null),{isResizing:i,...a}=yt({column:e,onResize:r,rootRef:s}),[c]=(0,Tn.useContextMenu)(),u=(0,ke.useRef)(null),p=T=>{c(T,"header",{column:e})},m=(0,ke.useCallback)(T=>!i&&(o==null?void 0:o(T)),[i,o]),C=(0,ke.useCallback)(T=>{u.current=window.setTimeout(()=>{n==null||n(T),u.current=null},500)},[n]),h=(0,ke.useCallback)(()=>{u.current!==null&&(window.clearTimeout(u.current),u.current=null)},[]),v=(0,yn.default)(Tt,t,{vuuPinFloating:e.pin==="floating",vuuPinLeft:e.pin==="left",vuuPinRight:e.pin==="right",vuuEndPin:e.endPin,[`${Tt}-resizing`]:e.resizing,[`${Tt}-right`]:e.align==="right"});return(0,Re.jsx)("div",{className:v,...l,onClick:m,onContextMenu:p,onMouseDown:C,onMouseUp:h,ref:s,children:(0,Re.jsxs)("div",{className:`${Tt}-inner`,children:[(0,Re.jsx)(hn,{column:e}),(0,Re.jsx)("div",{className:`${Tt}-label`,children:e.label}),(0,Re.jsx)(fn,{sorted:e.sorted}),e.resizeable!==!1?(0,Re.jsx)(ft,{...a}):null]})})};var me=require("react/jsx-runtime"),Mo="vuuTable",{RENDER_IDX:Gl}=re.metadataKeys,Dn=({columns:e,columnsWithinViewport:t,data:o,getRowOffset:n,headings:r,onColumnResize:l,onHeaderCellDragStart:s,onContextMenu:i,onRemoveColumnFromGroupBy:a,onRowClick:c,onSort:u,onToggleGroup:p,tableId:m,virtualColSpan:C=0,rowCount:h})=>{let v=(0,Xe.useCallback)(f=>{s==null||s(f)},[s]),T=(0,Xe.useMemo)(()=>e.filter(re.notHidden),[e]),x=(0,Xe.useMemo)(()=>(0,re.buildColumnMap)(e),[e]),g=(0,Xe.useCallback)(f=>{var H;let D=f.target.closest(".vuuTable-headerCell"),w=parseInt((H=D==null?void 0:D.dataset.idx)!=null?H:"-1"),d=(0,re.visibleColumnAtIndex)(e,w),b=f.shiftKey;d&&u(d,b)},[e,u]);return(0,me.jsxs)("div",{"aria-rowcount":h,className:`${Mo}-table`,role:"table",children:[(0,me.jsxs)("div",{className:`${Mo}-headers`,role:"rowGroup",children:[r.map((f,M)=>(0,me.jsx)("div",{className:"vuuTable-heading",children:f.map(({label:D,width:w},d)=>(0,me.jsx)("div",{className:"vuuTable-headingCell",style:{width:w},children:D},d))},M)),(0,me.jsx)("div",{role:"row",children:T.map((f,M)=>{let D=(0,re.getColumnStyle)(f);return(0,re.isGroupColumn)(f)?(0,me.jsx)(pn,{column:f,"data-idx":M,onRemoveColumn:a,onResize:l,role:"columnHeader",style:D},M):(0,me.jsx)(wn,{column:f,"data-idx":M,id:`${m}-${M}`,onClick:g,onDragStart:v,onResize:l,role:"columnHeader",style:D},M)})})]}),(0,me.jsx)("div",{className:`${Mo}-body`,onContextMenu:i,role:"rowGroup",children:o==null?void 0:o.map(f=>(0,me.jsx)(cn,{columnMap:x,columns:t,offset:n(f),onClick:c,virtualColSpan:C,onToggleGroup:p,row:f},f[Gl]))})]})};var Xn=require("@vuu-ui/vuu-popups"),fe=require("@vuu-ui/vuu-utils"),V=require("react");var Bt=require("@vuu-ui/vuu-data-react"),xe=require("@vuu-ui/vuu-utils"),$=require("react"),{SELECTED:wt}=xe.metadataKeys;function Mn({dataSource:e,onConfigChange:t,onFeatureEnabled:o,onFeatureInvocation:n,onSizeChange:r,onSubscribed:l,range:s={from:0,to:0},renderBufferSize:i=0,viewportRowCount:a}){let[,c]=(0,$.useState)(null),u=(0,$.useRef)(!0),p=(0,$.useRef)(!1),m=(0,$.useRef)({from:0,to:0}),C=(0,$.useRef)(null),h=(0,$.useRef)([]),v=(0,$.useMemo)(()=>new Ro((0,xe.getFullRange)(s)),[]),T=(0,$.useCallback)(w=>{for(let d of w)v.add(d);h.current=v.data,p.current=!0},[v]),x=(0,$.useCallback)(w=>{w.type==="subscribed"?l==null||l(w):w.type==="viewport-update"?(typeof w.size=="number"&&(r==null||r(w.size),v.setRowCount(w.size)),w.rows?T(w.rows):typeof w.size=="number"&&(h.current=v.data,p.current=!0)):(0,Bt.isVuuFeatureAction)(w)?o==null||o(w):(0,Bt.isVuuFeatureInvocation)(w)?n==null||n(w):console.log(`useDataSource unexpected message ${w.type}`)},[v,o,n,r,l,T]);(0,$.useEffect)(()=>()=>{C.current&&(cancelAnimationFrame(C.current),C.current=null),u.current=!1},[]);let g=(0,$.useCallback)(()=>{u.current&&(p.current&&(c({}),p.current=!1),C.current=requestAnimationFrame(g))},[c]);(0,$.useEffect)(()=>{C.current=requestAnimationFrame(g)},[g]);let f=(0,$.useCallback)(w=>{let{from:d}=e.range,b={from:d,to:d+w},H=(0,xe.getFullRange)(b,i);v.setRange(H),e.range=m.current=H,e.emit("range",b)},[e,v,i]),M=(0,$.useCallback)(w=>{let d=(0,xe.getFullRange)(w,i);v.setRange(d),e.range=m.current=d,e.emit("range",w)},[e,v,i]),D=(0,$.useCallback)(()=>v.getSelectedRows(),[v]);return(0,$.useEffect)(()=>{e==null||e.subscribe({range:m.current},x)},[e,x,t]),(0,$.useEffect)(()=>{console.log(`adjust range as rowCount chnaged ${a}`),f(a)},[f,a]),{data:h.current,getSelectedRows:D,range:m.current,setRange:M,dataSource:e}}var Ro=class{constructor({from:t,to:o}){this.rowCount=0;this.setRowCount=t=>{t<this.data.length&&(this.data.length=t),this.rowCount=t};this.range=new xe.WindowRange(t,o),this.data=new Array(o-t),this.rowCount=0}add(t){var n;let[o]=t;if(this.isWithinRange(o)){let r=o-this.range.from;this.data[r]=t;let l=t[wt],s=(n=this.data[r-1])==null?void 0:n[wt];s===0&&l?this.data[r-1][wt]=2:s===2&&!l&&(this.data[r-1][wt]=0)}}getAtIndex(t){return this.range.isWithin(t)&&this.data[t-this.range.from]!=null?this.data[t-this.range.from]:void 0}isWithinRange(t){return this.range.isWithin(t)}setRange({from:t,to:o}){if(t!==this.range.from||o!==this.range.to){let[n,r]=this.range.overlap(t,o),l=new Array(Math.max(0,o-t));for(let s=n;s<r;s++){let i=this.getAtIndex(s);if(i){let a=s-t;l[a]=i}}this.data=l,this.range.from=t,this.range.to=o}}getSelectedRows(){return this.data.filter(t=>t[wt]!==0)}};var Rn=require("@vuu-ui/vuu-ui-controls"),Qe=require("react"),xn=({onDrop:e})=>{let t=(0,Qe.useRef)(),o=(0,Qe.useRef)(null),n=(0,Qe.useCallback)(()=>{console.log("handleDropSettle"),t.current=void 0,o.current=null},[]),{draggable:r,draggedItemIndex:l,onMouseDown:s}=(0,Rn.useDragDropNext)({allowDragDrop:!0,draggableClassName:"vuuTable-headerCell",orientation:"horizontal",containerRef:o,itemQuery:".vuuTable-headerCell",onDrop:e,onDropSettle:n}),i=(0,Qe.useCallback)(a=>{let{clientX:c,clientY:u}=a;console.log("useDraggableColumn handleHeaderCellDragStart means mouseDown fired on a column in RowBasedTable");let m=a.target.closest(".vuuTable-headerCell");o.current=m==null?void 0:m.closest("[role='row']");let{dataset:{idx:C="-1"}}=m;t.current={clientX:c,clientY:u,idx:C},s==null||s(a)},[s]);return{draggable:r,draggedItemIndex:l,onHeaderCellDragStart:i}};var An=require("@vuu-ui/vuu-utils"),O=require("react");function Wl(e,...t){let o=new Set(e);for(let n of t)for(let r of n)o.add(r);return o}var xo="ArrowUp",Po="ArrowDown",Ho="ArrowLeft",Eo="ArrowRight";var So="Home",Ao="End",Lo="PageUp",Ko="PageDown";var Bl=new Set(["Enter","Delete"," "]),Ul=new Set(["Tab"]),_l=new Set(["ArrowRight","ArrowLeft"]),Pn=new Set([So,Ao,Lo,Ko,Po,Ho,Eo,xo]),Jl=new Set(["F1","F2","F3","F4","F5","F6","F7","F8","F9","F10","F11","F12"]),za=Wl(Bl,Pn,_l,Jl,Ul);var Xl=["Home","End","PageUp","PageDown"],Hn=e=>Xl.includes(e),En=e=>Pn.has(e);var Sn=e=>`.vuuTable-headers .vuuTable-headerCell:nth-child(${e+1})`,Ql=(e,t)=>`.vuuTable-body > [aria-rowindex='${e}'] > [role='cell']:nth-child(${t+1})`,Yl=[-1,-1];function Zl(e,[t,o],n,r){return e===xo?t>-1?[t-1,o]:[t,o]:e===Po?t===-1?[0,o]:t===r-1?[t,o]:[t+1,o]:e===Eo?o<n-1?[t,o+1]:[t,o]:e===Ho?o>0?[t,o-1]:[t,o]:[t,o]}var Ln=({columnCount:e=0,containerRef:t,disableHighlightOnFocus:o,data:n,requestScroll:r,rowCount:l=0,viewportRange:s})=>{var H;let{from:i,to:a}=s,c=(0,O.useRef)([-1,-1]),u=(0,O.useRef)(),p=(0,O.useRef)([-1,0]),m=(0,O.useCallback)(([y,R])=>{var S;let A=y===-1?Sn(R):Ql(y,R);return(S=t.current)==null?void 0:S.querySelector(A)},[t]),C=y=>y==null?void 0:y.closest("[role='columnHeader'],[role='cell']"),h=y=>{var R,A;if(y.role==="columnHeader")return[-1,parseInt((R=y.dataset.idx)!=null?R:"-1",10)];{let S=y.closest("[role='row']");if(S){let k=parseInt((A=S.ariaRowIndex)!=null?A:"-1",10),te=Array.from(S.childNodes).indexOf(y);return[k,te]}}return Yl},v=(0,O.useCallback)(y=>{var R;if(t.current){let A=m(y);A?(A!==u.current&&((R=u.current)==null||R.setAttribute("tabindex",""),u.current=A,A.setAttribute("tabindex","0")),A.focus()):(0,An.withinRange)(y[0],s)||(u.current=void 0,r==null||r({type:"scroll-page",direction:"up"}))}},[t,m,r,s]),T=(0,O.useCallback)((y,R,A=!1)=>{let S=[y,R];p.current=S,v(S),A&&(c.current=S)},[v]),x=(0,O.useCallback)(()=>{var y;(y=u.current)==null||y.setAttribute("tabindex",""),u.current=void 0},[]),g=(0,O.useCallback)(async(y,R)=>{switch(y){case Ko:r==null||r({type:"scroll-page",direction:"down"});break;case Lo:r==null||r({type:"scroll-page",direction:"up"});break;case So:r==null||r({type:"scroll-end",direction:"home"});break;case Ao:r==null||r({type:"scroll-end",direction:"end"});break}return R},[r]),f=(0,O.useCallback)(()=>{var y;if(o!==!0&&(y=t.current)!=null&&y.contains(document.activeElement)){let R=C(document.activeElement);R&&(c.current=h(R))}},[o,t]),M=(0,O.useCallback)(async y=>{let[R,A]=Hn(y)?await g(y,p.current):Zl(y,p.current,e,l),[S,k]=p.current;(R!==S||A!==k)&&T(R,A,!0)},[e,g,l,T]),D=(0,O.useCallback)(y=>{n.length>0&&En(y.key)&&(y.preventDefault(),y.stopPropagation(),M(y.key))},[n,M]),w=(0,O.useCallback)(y=>{let R=y.target,A=C(R);if(A){let[S,k]=h(A);T(S,k)}},[T]),d=(0,O.useMemo)(()=>({onClick:w,onFocus:f,onKeyDown:D}),[w,f,D]);(0,O.useLayoutEffect)(()=>{let{current:y}=p,R=y[0]>=i&&y[0]<=a;u.current&&!R?x():!u.current&&R&&v(y)},[v,i,a,x]);let b=((H=t.current)==null?void 0:H.firstChild)!=null;return(0,O.useEffect)(()=>{var y;if(b&&u.current===void 0){let R=(y=t.current)==null?void 0:y.querySelector(Sn(0));R&&(R.setAttribute("tabindex","0"),u.current=R)}},[t,b]),d};var ye=require("@vuu-ui/vuu-utils"),Pe=require("react");var ze=require("react");var Ne=new Map,kn=(e,t,o)=>{switch(o){case"height":return t.height;case"clientHeight":return e.clientHeight;case"clientWidth":return e.clientWidth;case"contentHeight":return t.contentHeight;case"contentWidth":return t.contentWidth;case"scrollHeight":return Math.ceil(e.scrollHeight);case"scrollWidth":return Math.ceil(e.scrollWidth);case"width":return t.width;default:return 0}},Kn=new ResizeObserver(e=>{for(let t of e){let{target:o,borderBoxSize:n,contentBoxSize:r}=t,l=Ne.get(o);if(l){let[{blockSize:s,inlineSize:i}]=n,[{blockSize:a,inlineSize:c}]=r,{onResize:u,measurements:p}=l,m=!1;for(let[C,h]of Object.entries(p)){let v=kn(o,{height:s,width:i,contentHeight:a,contentWidth:c},C);v!==h&&(m=!0,p[C]=v)}m&&u&&u(p)}}});function Nn(e,t,o,n=!1){let r=(0,ze.useRef)(t),l=(0,ze.useCallback)(s=>{let{width:i,height:a}=s.getBoundingClientRect(),{clientWidth:c,clientHeight:u}=s;return r.current.reduce((p,m)=>(p[m]=kn(s,{width:i,height:a,contentHeight:u,contentWidth:c},m),p),{})},[]);(0,ze.useEffect)(()=>{let s=e.current;async function i(){Ne.set(s,{measurements:{}}),await document.fonts.ready;let a=Ne.get(s);if(a){let c=l(s);a.measurements=c,Kn.observe(s),n&&o(c)}else console.log("%cuseResizeObserver an target expected to be under observation wa snot found. This warrants investigation","font-weight:bold; color:red;")}if(s){if(Ne.has(s))throw Error("useResizeObserver attemping to observe same element twice");i()}return()=>{s&&Ne.has(s)&&(Kn.unobserve(s),Ne.delete(s))}},[l,e]),(0,ze.useEffect)(()=>{let s=e.current,i=Ne.get(s);if(i){if(r.current!==t){r.current=t;let a=l(s);i.measurements=a}i.onResize=o}},[t,l,e,o])}var jl=["clientHeight","clientWidth"],zn=e=>Number.isFinite(e),ql={height:"100%",width:"100%"},es=(e,t)=>(0,ye.isValidNumber)(e)&&(0,ye.isValidNumber)(t)?{height:`${e}px`,width:`${t}px`}:ql,ts=(e,t)=>{if((0,ye.isValidNumber)(e)&&(0,ye.isValidNumber)(t))return{height:e,width:t}},ko=({defaultHeight:e=0,defaultWidth:t=0,height:o,width:n})=>{let r=(0,Pe.useRef)(null),[l,s]=(0,Pe.useState)({css:es(o,n),inner:ts(o,n),outer:{height:o!=null?o:"100%",width:n!=null?n:"100%"}});(0,Pe.useMemo)(()=>{s(a=>{let{inner:c,outer:u}=a;if((0,ye.isValidNumber)(o)&&(0,ye.isValidNumber)(n)&&c&&u){let{height:p,width:m}=c,{height:C,width:h}=u;if(C!==o||h!==n){let v=(0,ye.isValidNumber)(C)?C-p:0,T=(0,ye.isValidNumber)(h)?h-m:0;return{...a,outer:{height:o,width:n},inner:{height:o-v,width:n-T}}}}return a})},[o,n]);let i=(0,Pe.useCallback)(({clientWidth:a,clientHeight:c})=>{s(u=>{let{css:p,inner:m,outer:C}=u;return zn(c)&&zn(a)&&(a!==(m==null?void 0:m.width)||c!==(m==null?void 0:m.height))?{css:p,outer:C,inner:{width:Math.floor(a)||t,height:Math.floor(c)||e}}:u})},[e,t]);return Nn(r,jl,i,!0),{containerRef:r,cssSize:l.css,outerSize:l.outer,innerSize:l.inner}};var He=require("@vuu-ui/vuu-utils"),Dt=require("react"),{IDX:os}=He.metadataKeys,ns=[],Mt=({selectionModel:e,onSelect:t,onSelectionChange:o})=>{let n=(0,Dt.useRef)(-1),r=(0,Dt.useRef)(ns);return(0,Dt.useCallback)((s,i,a)=>{let{[os]:c}=s,{current:u}=n,{current:p}=r,C=((0,He.isRowSelected)(s)?He.deselectItem:He.selectItem)(e,p,c,i,a,u);r.current=C,n.current=c,t==null||t(s),o==null||o(C)},[t,o,e])};var E=require("@vuu-ui/vuu-utils"),In=require("react"),rs=100,Vn=E.metadataKeys.count,ls=({serverDataType:e})=>e===void 0,ss=e=>{var t;if((0,E.isTypeDescriptor)(e.type))return(0,E.getCellRenderer)((t=e.type)==null?void 0:t.renderer)},$n=(e,t)=>{if(e.serverDataType)return e.serverDataType;if(t){let o=t.columns.find(n=>n.name===e.name);if(o)return o.serverDataType}return"string"},is=e=>e.type==="columnSettings",as=e=>e.type==="tableSettings",cs=(e,t)=>{switch(t.type){case"init":return Fn(t);case"moveColumn":return ps(e,t);case"resizeColumn":return Cs(e,t);case"setTableSchema":return bs(e,t);case"hideColumns":return ds(e,t);case"showColumns":return fs(e,t);case"pinColumn":return gs(e,t);case"updateColumnProp":return Ye(e,t);case"tableConfig":return On(e,t);default:return console.log(`unhandled action ${t.type}`),e}},No=(e,t)=>{let[o,n]=(0,In.useReducer)(cs,{tableConfig:e,dataSourceConfig:t},Fn);return{columns:o.columns,dispatchColumnAction:n,headings:o.headings}};function Fn({dataSourceConfig:e,tableConfig:t}){let o=t.columns.map(zo(t)),n=o.some(E.isPinned)?(0,E.sortPinnedColumns)(o):o,r={columns:n,headings:(0,E.getTableHeadings)(n)};if(e){let{columns:l,...s}=e;return On(r,{type:"tableConfig",...s})}else return r}var us=e=>(0,E.isCalculatedColumn)(e.name)?(0,E.getCalculatedColumnName)(e):e.name,ms=(e,t)=>t==="uppercase"?e.toUpperCase():t==="capitalize"?e[0].toUpperCase()+e.slice(1).toLowerCase():e,zo=e=>(t,o)=>{let n=$n(t,e.tableSchema),{columnDefaultWidth:r=rs,columnFormatHeader:l}=e,{align:s=(0,E.getDefaultAlignment)(n),key:i,name:a,label:c=us(t),width:u=r,...p}=t,m={...p,align:s,CellRenderer:ss(t),label:ms(c,l),key:i!=null?i:o+Vn,name:a,originalIdx:o,serverDataType:n,valueFormatter:(0,E.getValueFormatter)(t),width:u};return(0,E.isGroupColumn)(m)&&(m.columns=m.columns.map(C=>zo(e)(C,C.key))),m};function ps(e,{column:t,moveBy:o,moveTo:n}){let{columns:r}=e;if(typeof o=="number"){let l=r.indexOf(t),s=r.slice(),[i]=s.splice(l,1);return s.splice(l+o,0,i),{...e,columns:s}}else if(typeof n=="number")return{...e,columns:(0,E.moveItemDeprecated)(r,t,n)};return e}function ds(e,{columns:t}){return t.some(o=>o.hidden!==!0)?t.reduce((o,n)=>n.hidden!==!0?Ye(o,{type:"updateColumnProp",column:n,hidden:!0}):o,e):e}function fs(e,{columns:t}){return t.some(o=>o.hidden)?t.reduce((o,n)=>n.hidden?Ye(o,{type:"updateColumnProp",column:n,hidden:!1}):o,e):e}function Cs(e,{column:t,phase:o,width:n}){let r="updateColumnProp",l=o!=="end";switch(o){case"begin":return Ye(e,{type:r,column:t,resizing:l});case"end":return Ye(e,{type:r,column:t,resizing:l,width:n});case"resize":return Ye(e,{type:r,column:t,width:n});default:throw Error(`useTableModel.resizeColumn, invalid resizePhase ${o}`)}}function bs(e,{tableSchema:t}){let{columns:o}=e;if(o.some(ls)){let n=o.map(r=>{var s;let l=$n(r,t);return{...r,align:(s=r.align)!=null?s:(0,E.getDefaultAlignment)(l),serverDataType:l}});return{...e,columns:n,tableSchema:t}}else return{...e,tableSchema:t}}function gs(e,t){let{columns:o}=e,{column:n,pin:r}=t;return o=(0,E.updateColumn)(o,n.name,{pin:r}),o=(0,E.sortPinnedColumns)(o),console.log({withPins:o}),{...e,columns:o}}function Ye(e,t){let{columns:o}=e,{align:n,column:r,hidden:l,label:s,resizing:i,width:a}=t,c={};return(n==="left"||n==="right")&&(c.align=n),typeof s=="string"&&(c.label=s),typeof i=="boolean"&&(c.resizing=i),typeof l=="boolean"&&(c.hidden=l),typeof a=="number"&&(c.width=a),o=(0,E.updateColumn)(o,r.name,c),{...e,columns:o}}function On(e,{columns:t,confirmed:o,filter:n,groupBy:r,sort:l}){let s=t&&t.length>0,i=r!==void 0,a=typeof(n==null?void 0:n.filter)=="string",c=l&&l.sortDefs.length>0,u=e;return s&&(u={...e,columns:t.map((p,m)=>{let C=(0,E.getColumnName)(p),h=m+Vn,v=(0,E.findColumn)(u.columns,C);return v?v.key===h?v:{...v,key:h}:zo(e)({name:p},m)})}),i&&(u={...e,columns:(0,E.applyGroupByToColumns)(u.columns,r,o)}),c&&(u={...e,columns:(0,E.applySortToColumns)(u.columns,l)}),a?u={...e,columns:(0,E.applyFilterToColumns)(u.columns,n)}:u.columns.some(E.isFilteredColumn)&&(u={...e,columns:(0,E.stripFilterFromColumns)(u.columns)}),u}var X=require("react"),Gn=e=>{let{scrollLeft:t,scrollTop:o}=e,{clientHeight:n,clientWidth:r,scrollHeight:l,scrollWidth:s}=e,i=t/(s-r),a=o/(l-n);return[i,a]},hs=e=>{let{clientHeight:t,clientWidth:o,scrollHeight:n,scrollWidth:r}=e;return[r-o,n-t]},Wn=({onAttach:e,onDetach:t})=>{let o=(0,X.useRef)(null);return(0,X.useCallback)(r=>{if(r)o.current=r,e==null||e(r);else if(o.current){let{current:l}=o;o.current=r,t==null||t(l)}},[e,t])},Bn=({onHorizontalScroll:e,onVerticalScroll:t,viewport:o})=>{let n=(0,X.useRef)(!1),r=(0,X.useRef)({scrollTop:0,scrollLeft:0}),l=(0,X.useRef)(null),s=(0,X.useRef)(null),{maxScrollContainerScrollHorizontal:i,maxScrollContainerScrollVertical:a}=o,c=(0,X.useCallback)(()=>{let{current:g}=s,{current:f}=l,{current:M}=n;if(M)n.current=!1;else if(g&&f){let[D,w]=Gn(f),[d,b]=hs(g),H=Math.round(D*d),y=Math.round(w*b);console.log(`pctScrollTop ${w}, maxScrollTop ${b} rootScrollTop ${y}`),g.scrollTo({left:H,top:y,behavior:"auto"})}},[]),u=(0,X.useCallback)(()=>{let{current:g}=s,{current:f}=l,{current:M}=r;if(g&&f){let{scrollLeft:D,scrollTop:w}=g,[d,b]=Gn(g);n.current=!0,f.scrollLeft=Math.round(d*i),f.scrollTop=Math.round(b*a),M.scrollTop!==w&&(M.scrollTop=w,t==null||t(w,b)),M.scrollLeft!==D&&(M.scrollLeft=D,e==null||e(D))}},[i,a,e,t]),p=(0,X.useCallback)(g=>{l.current=g,g.addEventListener("scroll",c,{passive:!0})},[c]),m=(0,X.useCallback)(g=>{l.current=null,g.removeEventListener("scroll",c)},[c]),C=(0,X.useCallback)(g=>{s.current=g,g.addEventListener("scroll",u,{passive:!0})},[u]),h=(0,X.useCallback)(g=>{s.current=null,g.removeEventListener("scroll",u)},[u]),v=Wn({onAttach:C,onDetach:h}),T=Wn({onAttach:p,onDetach:m}),x=(0,X.useCallback)(g=>{let{current:f}=s;if(f){if(n.current=!1,g.type==="scroll-page"){let{clientHeight:M,scrollLeft:D,scrollTop:w}=f,{direction:d}=g,b=d==="down"?M:-M,H=Math.min(Math.max(0,w+b),a);f.scrollTo({top:H,left:D,behavior:"auto"})}else if(g.type==="scroll-end"){let{direction:M}=g,D=M==="end"?a:0;f.scrollTo({top:D,left:f.scrollLeft,behavior:"auto"})}}},[a]);return{scrollbarContainerRef:T,contentContainerRef:v,requestScroll:x}};var Te=require("react"),Ut=require("@vuu-ui/vuu-utils"),vs=15e5,ys={contentHeight:0,contentWidth:0,getRowAtPosition:()=>-1,getRowOffset:()=>-1,horizontalScrollbarHeight:0,maxScrollContainerScrollHorizontal:0,maxScrollContainerScrollVertical:0,pinnedWidthLeft:0,pinnedWidthRight:0,rowCount:0,setPctScrollTop:()=>{},totalHeaderHeight:0,verticalScrollbarWidth:0,viewportBodyHeight:0},Ts=e=>{let t=0,o=0,n=0;for(let r of e){let{hidden:l,pin:s,width:i}=r,a=l?0:i;s==="left"?t+=a:s==="right"?o+=a:n+=a}return{pinnedWidthLeft:t+4,pinnedWidthRight:o+4,unpinnedWidth:n}},Rt=({columns:e,headerHeight:t,headings:o,rowCount:n,rowHeight:r,size:l})=>{let s=(0,Te.useRef)(0),a=Math.min(n,vs)*r,u=n*r-a,{pinnedWidthLeft:p,pinnedWidthRight:m,unpinnedWidth:C}=(0,Te.useMemo)(()=>Ts(e),[e]),[h,v]=(0,Te.useMemo)(()=>(0,Ut.actualRowPositioning)(r),[r]),[T,x]=(0,Te.useMemo)(()=>u?(0,Ut.virtualRowPositioning)(r,u,s):[h,v],[v,h,u,r]),g=(0,Te.useCallback)(f=>{s.current=f},[]);return(0,Te.useMemo)(()=>{var f;if(l){let M=o.length,D=15,w=p+C+m,d=w>l.width?D:0,b=t*(1+M),H=a-(((f=l==null?void 0:l.height)!=null?f:0)-d)+b,y=w-l.width+p,R=(l.height-t)/r,A=Number.isInteger(R)?R+1:Math.ceil(R),S=l.height-b,k=a>S?D:0;return{contentHeight:a,getRowAtPosition:x,getRowOffset:T,horizontalScrollbarHeight:d,maxScrollContainerScrollHorizontal:y,maxScrollContainerScrollVertical:H,pinnedWidthLeft:p,pinnedWidthRight:m,rowCount:A,contentWidth:w,setPctScrollTop:g,totalHeaderHeight:b,verticalScrollbarWidth:k,viewportBodyHeight:S}}else return ys},[l,o.length,p,C,m,a,t,r,x,T,g])};var xt=require("@vuu-ui/vuu-utils"),q=require("react"),Un=({columns:e,getRowAtPosition:t,setRange:o,viewportMeasurements:n})=>{let r=(0,q.useRef)(-1),{rowCount:l,contentWidth:s,maxScrollContainerScrollHorizontal:i}=n,a=s-i,c=(0,q.useRef)(0),[u,p]=(0,q.useMemo)(()=>(0,xt.getColumnsInViewport)(e,c.current,c.current+a),[a,e]),m=(0,q.useRef)(p);(0,q.useEffect)(()=>{h(u)},[u]);let[C,h]=(0,q.useState)(u),v=(0,q.useCallback)(x=>{c.current=x;let[g,f]=(0,xt.getColumnsInViewport)(e,x,x+a);(0,xt.itemsChanged)(C,g)&&(m.current=f,h(g))},[a,e,C]),T=(0,q.useCallback)(x=>{let g=t(x);g!==r.current&&(r.current=g,console.log("setRange from handleVerticalScroll"),o({from:g,to:g+l}))},[t,o,l]);return{columnsWithinViewport:C,onHorizontalScroll:v,onVerticalScroll:T,virtualColSpan:m.current}};var ws=[],{KEY:Ds,IS_EXPANDED:_n,IS_LEAF:Jn}=fe.metadataKeys,Qn=({config:e,dataSource:t,headerHeight:o,onConfigChange:n,onFeatureEnabled:r,onFeatureInvocation:l,onSelectionChange:s,renderBufferSize:i=0,rowHeight:a,selectionModel:c,...u})=>{var $t,Ft;let[p,m]=(0,V.useState)(t.size),C=(0,V.useRef)(!1),h=(0,V.useRef)();if(h.current=t,t===void 0)throw Error("no data source provided to Vuu Table");let v=ko(u),T=(0,V.useCallback)(K=>{m(K)},[]),{columns:x,dispatchColumnAction:g,headings:f}=No(e,t.config),{getRowAtPosition:M,getRowOffset:D,setPctScrollTop:w,...d}=Rt({columns:x,headerHeight:o,headings:f,rowCount:p,rowHeight:a,size:v.innerSize}),b=(0,V.useCallback)(({tableSchema:K})=>{K?(C.current=!0,g({type:"setTableSchema",tableSchema:K})):console.log("usbscription message with no schema")},[g]),H=(0,V.useCallback)(K=>{t.select(K),s==null||s(K)},[t,s]),y=Mt({onSelectionChange:H,selectionModel:c}),{data:R,getSelectedRows:A,range:S,setRange:k}=Mn({dataSource:t,onFeatureEnabled:r,onFeatureInvocation:l,onSubscribed:b,onSizeChange:T,renderBufferSize:i,viewportRowCount:d.rowCount}),te=(0,V.useRef)();te.current=R;let Ae=(0,V.useCallback)(K=>{C.current=!0,console.log("onPersistentColumnOperation, dispatchColumnAction",{action:K}),g(K)},[g]),ct=bt({dataSource:t,onPersistentColumnOperation:Ae}),kt=(0,V.useCallback)((K,F=!1,Z)=>{t&&(t.sort=(0,fe.applySort)(t.sort,K,F,Z))},[t]),Nt=(0,V.useCallback)((K,F,Z)=>{let G=x.find(ae=>ae.name===F);if(G)K==="end"&&(C.current=!0),g({type:"resizeColumn",phase:K,column:G,width:Z});else throw Error(`useDataTable.handleColumnResize, column ${F} not found`)},[x,g]),ie=(0,V.useCallback)((K,F)=>{let Z=(0,fe.isJsonGroup)(F,K),G=K[Ds];if(K[_n]){if(t.closeTreeNode(G,!0),Z){let ae=x.indexOf(F);t.getRowsAtDepth(ae+1).some(ce=>ce[_n]||ce[Jn])||g({type:"hideColumns",columns:x.slice(ae+2)})}}else if(t.openTreeNode(G),Z){let ae=t.getChildRows(G),de=x.indexOf(F)+1,ce=[x[de]];ae.some(be=>be[Jn])&&ce.push(x[de+1]),ce.some(be=>be.hidden)&&g({type:"showColumns",columns:ce})}},[x,t,g]),{onVerticalScroll:Ge,onHorizontalScroll:We,columnsWithinViewport:pe,virtualColSpan:oe}=Un({columns:x,getRowAtPosition:M,setRange:k,viewportMeasurements:d}),ut=(0,V.useCallback)((K,F)=>{w(F),Ge(K)},[Ge,w]),{requestScroll:mt,...pt}=Bn({onHorizontalScroll:We,onVerticalScroll:ut,viewport:d,viewportHeight:((Ft=($t=v.innerSize)==null?void 0:$t.height)!=null?Ft:0)-o}),Y=Ln({columnCount:x.length,containerRef:v.containerRef,data:R,requestScroll:mt,rowCount:t==null?void 0:t.size,viewportRange:S}),Ce=(0,V.useCallback)(K=>{K?t&&t.groupBy.includes(K.name)&&(t.groupBy=t.groupBy.filter(F=>F!==K.name)):t.groupBy=[]},[t]),zt=(0,V.useCallback)((K,F)=>{let Z=t.columns[K],G=(0,fe.moveItemDeprecated)(t.columns,Z,F);G!==t.columns&&(t.columns=G,g({type:"tableConfig",columns:G}))},[t,g]),ao=xn({onDrop:zt});(0,V.useEffect)(()=>{h.current&&(C.current=!0,g({type:"init",tableConfig:e,dataSourceConfig:h.current.config}))},[e,g]),(0,V.useEffect)(()=>{t.on("config",(K,F)=>{C.current=!0,g({type:"tableConfig",...K,confirmed:F})})},[t,g]),(0,V.useMemo)(()=>{C.current&&(n==null||n({...e,columns:x}),C.current=!1)},[x,e,n]);let[It]=(0,Xn.useContextMenu)(),Vt=(0,V.useCallback)(K=>{var ce;let{current:F}=te,{current:Z}=h,G=K.target,ae=G==null?void 0:G.closest("div[role='cell']"),de=G==null?void 0:G.closest(".vuuTableRow");if(ae&&de&&F&&Z){let{columns:be,selectedRowsCount:co}=Z,uo=(0,fe.buildColumnMap)(be),mo=parseInt((ce=de.ariaRowIndex)!=null?ce:"-1"),po=Array.from(de.childNodes).indexOf(ae),fo=F.find(([Co])=>Co===mo),Ot=be[po];It(K,"grid",{columnMap:uo,columnName:Ot,row:fo,selectedRows:co===0?ws:A(),viewport:t==null?void 0:t.viewport})}},[t==null?void 0:t.viewport,A,It]);return{columns:x,columnsWithinViewport:pe,containerMeasurements:v,containerProps:Y,data:R,dispatchColumnAction:g,getRowOffset:D,handleContextMenuAction:ct,headings:f,onColumnResize:Nt,onContextMenu:Vt,onRemoveColumnFromGroupBy:Ce,onRowClick:y,onSort:kt,onToggleGroup:ie,virtualColSpan:oe,scrollProps:pt,rowCount:p,viewportMeasurements:d,...ao}};var Zn=W(require("classnames"));var jn=require("@vuu-ui/vuu-utils"),we=require("react/jsx-runtime"),Ie="vuuTable",Ms=({allowConfigEditing:e=!1,className:t,config:o,dataSource:n,headerHeight:r=25,height:l,id:s,onConfigChange:i,onFeatureEnabled:a,onFeatureInvocation:c,onSelect:u,onSelectionChange:p,onShowConfigEditor:m,renderBufferSize:C=0,rowHeight:h=20,selectionModel:v="extended",style:T,width:x,...g})=>{let f=(0,_t.useIdMemo)(s),{containerMeasurements:{containerRef:M,innerSize:D,outerSize:w},containerProps:d,dispatchColumnAction:b,draggable:H,draggedItemIndex:y,handleContextMenuAction:R,scrollProps:A,viewportMeasurements:S,...k}=Qn({config:o,dataSource:n,renderBufferSize:C,headerHeight:r,height:l,onConfigChange:i,onFeatureEnabled:a,onFeatureInvocation:c,onSelectionChange:p,rowHeight:h,selectionModel:v,width:x});console.log({tableProps:k});let te={...w,"--content-height":`${S.contentHeight}px`,"--horizontal-scrollbar-height":`${S.horizontalScrollbarHeight}px`,"--content-width":`${S.contentWidth}px`,"--pinned-width-left":`${S.pinnedWidthLeft}px`,"--pinned-width-right":`${S.pinnedWidthRight}px`,"--header-height":`${r}px`,"--row-height":`${h}px`,"--table-height":`${D==null?void 0:D.height}px`,"--table-width":`${D==null?void 0:D.width}px`,"--total-header-height":`${S.totalHeaderHeight}px`,"--vertical-scrollbar-width":`${S.verticalScrollbarWidth}px`,"--viewport-body-height":`${S.viewportBodyHeight}px`},Ae=(0,Zn.default)(Ie,t,{[`${Ie}-zebra`]:o.zebraStripes,[`${Ie}-loading`]:(0,jn.isDataLoading)(k.columns)});return(0,we.jsx)(Yn.ContextMenuProvider,{menuActionHandler:R,menuBuilder:Ct(n),children:(0,we.jsxs)("div",{...g,...d,className:Ae,id:f,ref:M,style:te,tabIndex:-1,children:[D?(0,we.jsx)("div",{className:`${Ie}-scrollbarContainer`,ref:A.scrollbarContainerRef,children:(0,we.jsx)("div",{className:`${Ie}-scrollbarContent`})}):null,D?(0,we.jsxs)("div",{className:`${Ie}-contentContainer`,ref:A.contentContainerRef,children:[(0,we.jsx)(Dn,{...k,headerHeight:r,tableId:f}),H]}):null,e&&D?(0,we.jsx)(_t.Button,{className:`${Ie}-settings`,"data-icon":"settings",onClick:m,variant:"secondary"}):null]})})};var qn=W(require("classnames")),je=require("@vuu-ui/vuu-utils");var Ze=require("react/jsx-runtime"),Pt="vuuJsonCell",{IS_EXPANDED:Rs,KEY:xs}=je.metadataKeys,Ps=e=>{let t=e.lastIndexOf("|");return t===-1?"":e.slice(t+1)},Hs=({column:e,row:t})=>{let{key:o}=e,n=t[o],r=!1;(0,je.isJsonAttribute)(n)&&(n=n.slice(0,-1),r=!0);let l=Ps(t[xs]),s=(0,qn.default)({[`${Pt}-name`]:l===n,[`${Pt}-value`]:l!==n,[`${Pt}-group`]:r});if(r){let i=t[Rs]?"minus-box":"plus-box";return(0,Ze.jsxs)("span",{className:s,children:[(0,Ze.jsx)("span",{className:`${Pt}-value`,children:n}),(0,Ze.jsx)("span",{className:`${Pt}-toggle`,"data-icon":i})]})}else return n?(0,Ze.jsx)("span",{className:s,children:n}):null};console.log("register JsonCell");(0,je.registerComponent)("json",Hs,"cell-renderer",{description:"JSON formatter",label:"JSON formatter",serverDataType:"json"});var Ss=W(require("classnames")),As=require("react");var qe=require("react");var tr=require("react/jsx-runtime"),er=()=>{},Es="vuuColumnResizerNext",Ht=({onDrag:e,onDragEnd:t=er,onDragStart:o=er})=>{let n=(0,qe.useRef)(0),r=(0,qe.useCallback)(i=>{i.stopPropagation&&i.stopPropagation(),i.preventDefault&&i.preventDefault();let a=Math.round(i.clientX),c=a-n.current;n.current=a,c!==0&&e(i,c)},[e]),l=(0,qe.useCallback)(i=>{window.removeEventListener("mouseup",l),window.removeEventListener("mousemove",r),t(i)},[t,r]),s=(0,qe.useCallback)(i=>{o(i),n.current=Math.round(i.clientX),window.addEventListener("mouseup",l),window.addEventListener("mousemove",r),i.stopPropagation&&i.stopPropagation(),i.preventDefault&&i.preventDefault()},[o,r,l]);return(0,tr.jsx)("div",{className:Es,onMouseDown:s})};var Ee=require("react"),Et=({column:e,onResize:t,rootRef:o})=>{let n=(0,Ee.useRef)(0),[r,l]=(0,Ee.useState)(!1),{name:s}=e,i=(0,Ee.useCallback)(()=>{if(console.log("onResizeStart"),t&&o.current){console.log("handleResizeStart");let{width:u}=o.current.getBoundingClientRect();n.current=Math.round(u),l(!0),t==null||t("begin",s)}},[s,t,o]),a=(0,Ee.useCallback)((u,p)=>{if(o.current&&t){let{width:m}=o.current.getBoundingClientRect(),C=Math.round(m)+p;C!==n.current&&C>0&&(t("resize",s,C),n.current=C)}},[s,t,o]),c=(0,Ee.useCallback)(()=>{t&&(t("end",s,n.current),setTimeout(()=>{l(!1)},80))},[s,t]);return{isResizing:r,onDrag:a,onDragStart:i,onDragEnd:c}};var or=require("@vuu-ui/vuu-utils"),nr=W(require("classnames")),rr=require("react"),De=(e,t,o)=>(0,rr.useMemo)(()=>{let n=(0,nr.default)(t,{vuuPinFloating:e.pin==="floating",vuuPinLeft:e.pin==="left",vuuPinRight:e.pin==="right",vuuEndPin:o&&e.endPin,[`${t}-editable`]:e.editable,[`${t}-right`]:e.align==="right"}),r=(0,or.getColumnStyle)(e);return{className:n,style:r}},[e,t,o]);var sr=W(require("classnames")),ir=require("react");var Jt=require("react/jsx-runtime"),lr="vuuColumnHeaderPill",Ve=({children:e,className:t,column:o,onRemove:n,removable:r,...l})=>{if(r&&typeof n!="function")throw Error("ColumnHeaderPill onRemove prop must be provided if Pill is removable");let s=(0,ir.useCallback)(i=>{i.preventDefault(),i.stopPropagation(),n==null||n(o)},[o,n]);return(0,Jt.jsxs)("div",{...l,className:(0,sr.default)(lr,t),children:[e,r?(0,Jt.jsx)("span",{className:`${lr}-removeButton`,role:"button","data-icon":"cross",onClick:s}):null]})};var et=require("react/jsx-runtime"),Io=({column:e,...t})=>{let{name:o,sorted:n}=e,r=typeof n=="number"?n<0?"arrow-down":"arrow-up":n==="A"?"arrow-up":n==="D"?"arrow-down":void 0;return(0,et.jsxs)(Ve,{...t,column:e,children:[(0,et.jsx)("span",{className:"vuuGroupColumnPill-label",children:o}),r!==void 0?(0,et.jsx)("span",{"data-icon":r}):null,typeof n=="number"?(0,et.jsx)("span",{className:"vuuSortPosition",children:Math.abs(n)}):null]})};var St=require("react/jsx-runtime"),ar=({column:e})=>{if(!e.sorted)return null;let t=typeof e.sorted=="number"?e.sorted<0?"arrow-down":"arrow-up":e.sorted==="A"?"arrow-up":"arrow-down";return(0,St.jsxs)(Ve,{column:e,children:[(0,St.jsx)("span",{"data-icon":t}),typeof e.sorted=="number"?(0,St.jsx)("span",{className:"vuuSortPosition",children:Math.abs(e.sorted)}):null]})};var cr=require("react/jsx-runtime"),Ls=require("react");var ur=W(require("classnames")),ot=require("react");var Xt=require("@vuu-ui/vuu-layout");var tt=require("react/jsx-runtime"),mr=require("react"),Vo="vuuTableNextGroupHeaderCell",Ks=(e,t)=>e===t?e:t,At=({column:e,className:t,onRemoveColumn:o,onResize:n,...r})=>{let l=(0,ot.useRef)(null),{isResizing:s,...i}=Et({column:e,onResize:n,rootRef:l}),[a,c]=(0,ot.useState)(e.columns),{className:u,style:p}=De(e,Vo,!0),m=a.length>1?{removable:!0,onRemove:o}:void 0,C=(0,ot.useCallback)((h,v)=>{c(T=>{let x=T.slice(),[g]=x.splice(h,1);return v===-1?x.concat(g):(x.splice(v,0,g),x)})},[]);return(0,Xt.useLayoutEffectSkipFirst)(()=>{c(h=>Ks(h,e.columns))},[e.columns]),(0,tt.jsxs)("div",{...r,className:(0,ur.default)(u,"vuuTableNextHeaderCell",t,{[`${Vo}-pending`]:e.groupConfirmed===!1}),ref:l,role:"columnheader",style:p,children:[(0,tt.jsx)(Xt.OverflowContainer,{allowDragDrop:!0,className:`${Vo}-inner`,height:24,onMoveItem:C,overflowPosition:"start",children:a.map(h=>(0,mr.createElement)(Io,{...m,column:h,key:h.key}))}),(0,tt.jsx)(Ve,{column:e,removable:!0,onRemove:o}),e.resizeable!==!1?(0,tt.jsx)(Ht,{...i}):null]})};var Qt=require("react");var pr=require("@vuu-ui/vuu-popups"),dr=W(require("classnames")),$e=require("react");var Cr=require("react/jsx-runtime"),ks=e=>{if(e){let{bottom:t,left:o}=e.getBoundingClientRect();return{x:o,y:t+6}}},fr=({className:e,column:t,...o})=>{let n=(0,$e.useRef)(null),[r,l]=(0,$e.useState)(!1),[s]=(0,pr.useContextMenu)(),i=(0,$e.useCallback)(()=>{l(!1)},[]),a=(0,$e.useCallback)(c=>{l(!0),s(c,"column-menu",{column:t,ContextMenuProps:{onClose:i,position:ks(n.current)}})},[t,i,s]);return(0,Cr.jsx)("span",{...o,className:(0,dr.default)("vuuTable-columnMenu",e,{"vuuTable-columnMenu-open":r}),"data-icon":"more-vert",onClick:a,ref:n})};var br=W(require("classnames"));var Fe=require("react/jsx-runtime"),$o="vuuTableNextHeaderCell",gr=({className:e,column:t,onClick:o,onResize:n,...r})=>{var v;let l=(0,Qt.useRef)(null),{isResizing:s,...i}=Et({column:t,onResize:n,rootRef:l}),a=(0,Qt.useCallback)(T=>{console.log(`click isResizing ${s}`),!s&&(o==null||o(T))},[s,o]),{className:c,style:u}=De(t,$o,!0),p=(0,Fe.jsx)(fr,{column:t}),m=(0,Fe.jsx)("div",{className:`${$o}-label`,children:(v=t.label)!=null?v:t.name}),C=(0,Fe.jsx)(ar,{column:t}),h=t.align==="right"?[C,m,p]:[p,m,C];return(0,Fe.jsxs)("div",{...r,className:(0,br.default)(c,e,{[`${$o}-resizing`]:s}),onClick:a,ref:l,role:"columnheader",style:u,children:[...h,t.resizeable!==!1?(0,Fe.jsx)(Ht,{...i}):null]})};var ol=require("@vuu-ui/vuu-popups"),it=require("@vuu-ui/vuu-utils"),Xo=W(require("classnames")),no=require("react");var ee=require("@vuu-ui/vuu-utils"),Dr=W(require("classnames")),Lt=require("react");var hr=require("@vuu-ui/vuu-utils"),Fo=require("react");var Oo=require("react/jsx-runtime"),{IDX:Ns}=hr.metadataKeys,zs="vuuTableNextCell",vr=({column:e,columnMap:t,onClick:o,onDataEdited:n,row:r})=>{let{className:l,style:s}=De(e,zs),{CellRenderer:i,name:a,valueFormatter:c}=e,u=t[a],p=(0,Fo.useCallback)(C=>(n==null||n(r[Ns],a,C),!0),[a,n,r]),m=(0,Fo.useCallback)(C=>{o==null||o(C,e)},[e,o]);return(0,Oo.jsx)("div",{className:l,onClick:o?m:void 0,role:"cell",style:s,children:i?(0,Oo.jsx)(i,{column:e,columnMap:t,onCommit:p,row:r}):c(r[u])})};var Yt=require("@vuu-ui/vuu-utils"),yr=require("react");var Tr=W(require("classnames"));var nt=require("react/jsx-runtime"),{IS_LEAF:Is}=Yt.metadataKeys,Go="vuuTableNextGroupCell",wr=({column:e,onClick:t,row:o})=>{let{columns:n}=e,[r,l]=(0,Yt.getGroupValueAndOffset)(n,o),{className:s,style:i}=De(e,Go),a=(0,yr.useCallback)(p=>{t==null||t(p,e)},[e,t]),c=o[Is],u=Array(l).fill(0).map((p,m)=>(0,nt.jsx)("span",{className:`${Go}-spacer`},m));return(0,nt.jsxs)("div",{className:(0,Tr.default)(s,"vuuTableNextCell"),role:"cell",style:i,onClick:c?void 0:a,children:[u,c?null:(0,nt.jsx)("span",{className:`${Go}-toggle`,"data-icon":"triangle-right"}),(0,nt.jsx)("span",{children:r})]})};var Zt=require("react/jsx-runtime"),Mr=require("react"),{IDX:Vs,IS_EXPANDED:$s,SELECTED:Fs}=ee.metadataKeys,Se="vuuTableNextRow",Wo=(0,Lt.memo)(({className:e,columnMap:t,columns:o,row:n,offset:r,onClick:l,onDataEdited:s,onToggleGroup:i,zebraStripes:a=!1,...c})=>{let{[Vs]:u,[$s]:p,[Fs]:m}=n,C=(0,Lt.useCallback)(M=>{let D=M.shiftKey,w=M.ctrlKey||M.metaKey;l==null||l(n,D,w)},[l,n]),{True:h,First:v,Last:T}=ee.RowSelected,x=(0,Dr.default)(Se,e,{[`${Se}-even`]:a&&u%2===0,[`${Se}-expanded`]:p,[`${Se}-selected`]:m&h,[`${Se}-selectedStart`]:m&v,[`${Se}-selectedEnd`]:m&T}),g={transform:`translate3d(0px, ${r}px, 0px)`},f=(0,Lt.useCallback)((M,D)=>{((0,ee.isGroupColumn)(D)||(0,ee.isJsonGroup)(D,n))&&(M.stopPropagation(),i==null||i(n,D))},[i,n]);return(0,Mr.createElement)("div",{...c,"aria-rowindex":n[0],key:`row-${n[0]}`,role:"row",className:x,onClick:C,style:g},(0,Zt.jsx)("span",{className:`${Se}-selectionDecorator vuuStickyLeft`}),o.filter(ee.notHidden).map(M=>{let D=(0,ee.isGroupColumn)(M),w=(0,ee.isJsonColumn)(M);return(0,Zt.jsx)(D?wr:vr,{column:M,columnMap:t,onClick:D||w?f:void 0,onDataEdited:s,row:n},M.key)}),(0,Zt.jsx)("span",{className:`${Se}-selectionDecorator vuuStickyRight`}))});Wo.displayName="Row";var jr=require("@vuu-ui/vuu-layout"),qr=require("@vuu-ui/vuu-table-extras"),el=require("@vuu-ui/vuu-ui-controls");var U=require("react");var Bo=e=>`.vuuTableNext-col-headers .vuuTableNextHeaderCell:nth-child(${e})`,Uo=(e,t)=>`.vuuTableNext-body > [aria-rowindex='${e}'] > [role='cell']:nth-child(${t+1})`,Rr=(e,[t,o])=>{var l;let n=t===-1?Bo(o):Uo(t,o),r=(l=e.current)==null?void 0:l.querySelector(n);return Os(r)&&r.querySelector("button")||r},Os=e=>e.classList.contains("vuuTableNextCell-editable"),xr=e=>e.querySelector(".vuuTableInputCell")!==null;var Pr=new Set(["Home","End","PageUp","PageDown","ArrowDown","ArrowUp"]),_o=new Set(Pr);_o.add("ArrowLeft");_o.add("ArrowRight");var Gs=(e,t)=>{switch(t){case"cell":return _o.has(e);case"row":return Pr.has(e);default:return!1}},Ws=["Home","End","PageUp","PageDown"],Bs=e=>Ws.includes(e),Us=[-1,-1],_s=[void 0,void 0],Js=e=>{var o,n;let t=(o=e.closest(".vuuTableNext"))==null?void 0:o.querySelector(".vuuTableNext-scrollbarContainer");if(t){let r=t==null?void 0:t.getBoundingClientRect(),l=(n=e.closest(".vuuTableNextCell"))==null?void 0:n.getBoundingClientRect();if(l)return l.bottom>r.bottom?["down",l.bottom-r.bottom]:l.top<r.top?["up",l.top-r.top]:l.right<r.right?["right",l.right-r.right]:l.left<r.left?["left",l.left-r.left]:_s;throw Error("Whats going on, cell not found")}else throw Error("Whats going on, scrollbar container not found")};function Xs(e,[t,o],n,r){return e==="ArrowUp"?t>-1?[t-1,o]:[t,o]:e==="ArrowDown"?t===-1?[0,o]:t===r-1?[t,o]:[t+1,o]:e==="ArrowRight"?o<n-1?[t,o+1]:[t,o]:e==="ArrowLeft"?o>1?[t,o-1]:[t,o]:[t,o]}var Hr=({columnCount:e=0,containerRef:t,disableHighlightOnFocus:o,navigationStyle:n,requestScroll:r,rowCount:l=0,viewportRowCount:s})=>{var w;let i=(0,U.useRef)([-1,-1]),a=(0,U.useRef)(),c=(0,U.useRef)([-1,0]),u=d=>d==null?void 0:d.closest("[role='columnHeader'],[role='cell']"),p=d=>{var b,H;if(d.role==="columnHeader")return[-1,parseInt((b=d.dataset.idx)!=null?b:"-1",10)];{let y=d.closest("[role='row']");if(y){let R=parseInt((H=y.ariaRowIndex)!=null?H:"-1",10),A=Array.from(y.childNodes).indexOf(d);return[R,A]}}return Us},m=(0,U.useCallback)(d=>{var b;if(t.current){let H=Rr(t,d);if(H){H!==a.current&&((b=a.current)==null||b.removeAttribute("tabindex"),a.current=H,H.setAttribute("tabindex","0"));let[y,R]=Js(H);y&&R&&(r==null||r({type:"scroll-distance",distance:R,direction:y})),H.focus()}}},[t,r]),C=(0,U.useCallback)((d,b,H=!1)=>{let y=[d,b];c.current=y,m(y),H&&(i.current=y)},[m]),h=(0,U.useCallback)((d,[b,H])=>new Promise(y=>{let R=b;switch(d){case"PageDown":R=Math.min(l-1,b+s),r==null||r({type:"scroll-page",direction:"down"});break;case"PageUp":R=Math.max(0,b-s),r==null||r({type:"scroll-page",direction:"up"});break;case"Home":R=0,r==null||r({type:"scroll-end",direction:"home"});break;case"End":R=l-1,r==null||r({type:"scroll-end",direction:"end"});break}setTimeout(()=>{y([R,H])},90)}),[r,l,s]),v=(0,U.useCallback)(()=>{var d;if(o!==!0&&(d=t.current)!=null&&d.contains(document.activeElement)){let b=u(document.activeElement);b&&(i.current=p(b))}},[o,t]),T=(0,U.useCallback)(async d=>{let[b,H]=Bs(d)?await h(d,c.current):Xs(d,c.current,e,l);console.log(`nextRowIdx ${b} nextColIdx ${H}`);let[y,R]=c.current;(b!==y||H!==R)&&C(b,H,!0)},[e,h,l,C]),x=(0,U.useCallback)(d=>{l>0&&Gs(d.key,n)&&(d.preventDefault(),d.stopPropagation(),T(d.key))},[l,n,T]),g=(0,U.useCallback)(d=>{let b=d.target,H=u(b);if(H){let[y,R]=p(H);C(y,R)}},[C]),f=(0,U.useCallback)(()=>{T("ArrowDown")},[T]),M=(0,U.useMemo)(()=>({navigate:f,onClick:g,onFocus:v,onKeyDown:x}),[g,v,x,f]),D=((w=t.current)==null?void 0:w.firstChild)!=null;return(0,U.useEffect)(()=>{if(D&&a.current===void 0){let{current:d}=t,b=(d==null?void 0:d.querySelector(Bo(0)))||(d==null?void 0:d.querySelector(Uo(0,0)));b&&(b.setAttribute("tabindex","0"),a.current=b)}},[t,D]),M};var _=require("@vuu-ui/vuu-utils"),z=require("react");var jt=(e,t)=>{switch(t.type){case"col-size":return{...e,columns:e.columns.map(o=>o.name===t.column.name?{...o,width:t.width}:o)};case"column-prop":return{...e,columns:e.columns.map(o=>o.name===t.column.name?{...o,[t.property]:t.value}:o)};default:return e}};var to=require("@vuu-ui/vuu-data-react/src"),Oe=require("@vuu-ui/vuu-utils"),J=require("react");var eo=require("@vuu-ui/vuu-utils"),{SELECTED:Qs}=eo.metadataKeys,qt=class{constructor({from:t,to:o}){this.rowCount=0;this.setRowCount=t=>{t<this.data.length&&(this.data.length=t),this.rowCount=t};this.range=new eo.WindowRange(t,o),this.data=new Array(o-t),this.rowCount=0}add(t){let[o]=t;if(this.isWithinRange(o)){let n=o-this.range.from;this.data[n]=t}}getAtIndex(t){return this.range.isWithin(t)&&this.data[t-this.range.from]!=null?this.data[t-this.range.from]:void 0}isWithinRange(t){return this.range.isWithin(t)}setRange({from:t,to:o}){if(t!==this.range.from||o!==this.range.to){let[n,r]=this.range.overlap(t,o),l=new Array(Math.max(0,o-t));for(let s=n;s<r;s++){let i=this.getAtIndex(s);if(i){let a=s-t;l[a]=i}}this.data=l,this.range.from=t,this.range.to=o}}getSelectedRows(){return this.data.filter(t=>t[Qs]!==0)}};var Er=({dataSource:e,onFeatureEnabled:t,onFeatureInvocation:o,onSizeChange:n,onSubscribed:r,range:l=Oe.NULL_RANGE,renderBufferSize:s=0})=>{let[,i]=(0,J.useState)(null),a=(0,J.useRef)([]),c=(0,J.useRef)(!0),u=(0,J.useRef)(!1),p=(0,J.useRef)(Oe.NULL_RANGE),m=(0,J.useMemo)(()=>new qt((0,Oe.getFullRange)(l,s)),[]),C=(0,J.useCallback)(T=>{for(let x of T)m.add(x);a.current=m.data,c.current&&i({})},[m]),h=(0,J.useCallback)(T=>{T.type==="subscribed"?r==null||r(T):T.type==="viewport-update"?(typeof T.size=="number"&&(n==null||n(T.size),m.setRowCount(T.size)),T.rows?C(T.rows):typeof T.size=="number"&&(a.current=m.data,u.current=!0)):(0,to.isVuuFeatureAction)(T)?t==null||t(T):(0,to.isVuuFeatureInvocation)(T)?o==null||o(T):console.log(`useDataSource unexpected message ${T.type}`)},[m,t,o,n,r,C]);(0,J.useEffect)(()=>()=>{c.current=!0,c.current=!1},[]),(0,J.useEffect)(()=>{e==null||e.subscribe({range:(0,Oe.getFullRange)(l,s)},h)},[e,h,l,s]);let v=(0,J.useCallback)(T=>{let x=(0,Oe.getFullRange)(T,s);m.setRange(x),e.range=p.current=x,e.emit("range",T)},[e,m,s]);return{data:a.current,range:p.current,setRange:v}};var oo=require("react"),Sr=e=>{let t=(0,oo.useRef)(e);return(0,oo.useMemo)(()=>t.current,[])};var Ar=require("@vuu-ui/vuu-utils"),Lr=require("react"),Kr=require("@vuu-ui/vuu-popups"),kr=({columns:e,data:t})=>{let[o]=(0,Kr.useContextMenu)();return(0,Lr.useCallback)(r=>{var a;let l=r.target,s=l==null?void 0:l.closest("div[role='cell']"),i=l==null?void 0:l.closest("div[role='row']");if(s&&i){let c=(0,Ar.buildColumnMap)(e),u=parseInt((a=i.ariaRowIndex)!=null?a:"-1"),p=Array.from(i.childNodes).indexOf(s),m=t.find(([h])=>h===u),C=e[p];o(r,"grid",{columnMap:c,columnName:C,row:m})}},[e,t,o])};var Nr=require("@vuu-ui/vuu-utils"),Kt=require("react");var zr=({navigate:e})=>{let t=(0,Kt.useCallback)(()=>{e()},[e]),o=(0,Kt.useCallback)(l=>{let s=l.target,i=s.querySelector("input");i&&(i.focus(),i.select()),s.addEventListener("vuu-commit",t,!0)},[t]),n=(0,Kt.useCallback)(l=>{let s=l.target,i=s.querySelector("input");i&&(i.focus(),i.select()),s.addEventListener("vuu-commit",t,!0)},[t]);return{onKeyDown:(0,Kt.useCallback)(l=>{xr(l.target)&&((0,Nr.isCharacterKey)(l.key)?o(l):l.key==="Enter"&&n(l))},[o,n])}};var L=require("@vuu-ui/vuu-utils"),Ir=require("@vuu-ui/vuu-ui-controls"),Vr=require("react"),{info:Jo}=(0,L.logger)("useTableModel"),Ys=100,Zs=L.metadataKeys.count,js=({serverDataType:e})=>e===void 0,qs=e=>{var t;if((0,L.isTypeDescriptor)(e.type))return(0,L.getCellRenderer)((t=e.type)==null?void 0:t.renderer)},ei=(e,t)=>{var n;let o=t.columns.find(({name:r})=>r===e.name);return o?o.serverDataType:(n=e.serverDataType)!=null?n:"string"},ti=["int","long","double"],$r=e=>e===void 0?void 0:ti.includes(e)?"right":"left",Fr=e=>e.type==="columnSettings",Or=e=>e.type==="tableSettings",oi=(e,t)=>{switch(Jo==null||Jo(`TableModelReducer ${t.type}`),t.type){case"init":return Wr(t);case"moveColumn":return ri(e,t);case"resizeColumn":return ii(e,t);case"setTableSchema":return ai(e,t);case"hideColumns":return li(e,t);case"showColumns":return si(e,t);case"pinColumn":return ci(e,t);case"updateColumnProp":return lt(e,t);case"tableConfig":return Ur(e,t);default:return console.log(`unhandled action ${t.type}`),e}},Gr=(e,t)=>{let[o,n]=(0,Vr.useReducer)(oi,{tableConfig:e,dataSourceConfig:t},Wr),{columns:r,headings:l,tableConfig:s,...i}=o;return{columns:r,dispatchColumnAction:n,headings:l,tableAttributes:i,tableConfig:s}};function Wr({dataSourceConfig:e,tableConfig:t}){let{columns:o,...n}=t,r=o.filter((0,L.subscribedOnly)(e==null?void 0:e.columns)).map(Br(n)),l=r.some(L.isPinned)?(0,L.sortPinnedColumns)(r):r,s={columns:l,headings:(0,L.getTableHeadings)(l),tableConfig:t,...n};if(e){let{columns:i,...a}=e;s=Ur(s,{type:"tableConfig",...a})}return s}var ni=(e,t)=>t==="uppercase"?e.toUpperCase():t==="capitalize"?e[0].toUpperCase()+e.slice(1).toLowerCase():e,Br=e=>(t,o)=>{let{columnDefaultWidth:n=Ys,columnFormatHeader:r}=e,{align:l=$r(t.serverDataType),key:s,name:i,label:a=(0,L.getColumnLabel)(t),width:c=n,...u}=t,p={...u,align:l,CellRenderer:qs(t),clientSideEditValidationCheck:(0,L.hasValidationRules)(t.type)?(0,Ir.buildValidationChecker)(t.type.renderer.rules):void 0,label:ni(a,r),key:s!=null?s:o+Zs,name:i,originalIdx:o,valueFormatter:(0,L.getValueFormatter)(t),width:c};return(0,L.isGroupColumn)(p)&&(p.columns=p.columns.map(m=>Br(e)(m,m.key))),p};function ri(e,{column:t,moveBy:o,moveTo:n}){let{columns:r}=e;if(typeof o=="number"){let l=r.indexOf(t),s=r.slice(),[i]=s.splice(l,1);return s.splice(l+o,0,i),{...e,columns:s}}else if(typeof n=="number"){let l=r.indexOf(t);return{...e,columns:(0,L.moveItem)(r,l,n)}}return e}function li(e,{columns:t}){return t.some(o=>o.hidden!==!0)?t.reduce((o,n)=>n.hidden!==!0?lt(o,{type:"updateColumnProp",column:n,hidden:!0}):o,e):e}function si(e,{columns:t}){return t.some(o=>o.hidden)?t.reduce((o,n)=>n.hidden?lt(o,{type:"updateColumnProp",column:n,hidden:!1}):o,e):e}function ii(e,{column:t,phase:o,width:n}){let r="updateColumnProp",l=o!=="end";switch(o){case"begin":return lt(e,{type:r,column:t,resizing:l});case"end":return lt(e,{type:r,column:t,resizing:l,width:n});case"resize":return lt(e,{type:r,column:t,width:n});default:throw Error(`useTableModel.resizeColumn, invalid resizePhase ${o}`)}}function ai(e,{tableSchema:t}){let{columns:o}=e;if(o.some(js)){let n=o.map(r=>{var s;let l=ei(r,t);return{...r,align:(s=r.align)!=null?s:$r(l),serverDataType:l}});return{...e,columns:n}}else return e}function ci(e,t){let{columns:o}=e,{column:n,pin:r}=t,l=o.find(s=>s.name===n.name);return l?(o=rt(o,{...l,pin:r}),o=(0,L.sortPinnedColumns)(o),{...e,columns:o}):e}function lt(e,t){let{columns:o}=e,{align:n,column:r,hidden:l,label:s,resizing:i,width:a}=t,c=o.find(u=>u.name===r.name);return c&&((n==="left"||n==="right")&&(o=rt(o,{...c,align:n})),typeof s=="string"&&(o=rt(o,{...c,label:s})),typeof i=="boolean"&&(o=rt(o,{...c,resizing:i})),typeof l=="boolean"&&(o=rt(o,{...c,hidden:l})),typeof a=="number"&&(o=rt(o,{...c,width:a}))),{...e,columns:o}}function Ur(e,{confirmed:t,filter:o,groupBy:n,sort:r}){let l=n!==void 0,s=typeof(o==null?void 0:o.filter)=="string",i=r&&r.sortDefs.length>0,a=e;return l&&(a={...e,columns:(0,L.applyGroupByToColumns)(a.columns,n,t)}),i&&(a={...e,columns:(0,L.applySortToColumns)(a.columns,r)}),s?a={...e,columns:(0,L.applyFilterToColumns)(a.columns,o)}:a.columns.some(L.isFilteredColumn)&&(a={...e,columns:(0,L.stripFilterFromColumns)(a.columns)}),a}function rt(e,t){return e.map(o=>o.name===t.name?t:o)}var Q=require("react"),_r=e=>{let{scrollLeft:t,scrollTop:o}=e,{clientHeight:n,clientWidth:r,scrollHeight:l,scrollWidth:s}=e,i=t/(s-r),a=o/(l-n);return[i,a]},Jr=({onAttach:e,onDetach:t})=>{let o=(0,Q.useRef)(null);return(0,Q.useCallback)(r=>{if(r)o.current=r,e==null||e(r);else if(o.current){let{current:l}=o;o.current=r,t==null||t(l)}},[e,t])},Xr=({maxScrollLeft:e,maxScrollTop:t,onHorizontalScroll:o,onVerticalScroll:n,rowHeight:r,viewportRowCount:l})=>{let s=(0,Q.useRef)(!1),i=(0,Q.useRef)({scrollTop:0,scrollLeft:0}),a=(0,Q.useRef)(null),c=(0,Q.useRef)(null),u=(0,Q.useCallback)(()=>{let{current:f}=c,{current:M}=a,{current:D}=s;if(D)s.current=!1;else if(f&&M){let[w,d]=_r(M),b=Math.round(w*e),H=Math.round(d*t);f.scrollTo({left:b,top:H,behavior:"auto"})}},[e,t]),p=(0,Q.useCallback)(()=>{let{current:f}=c,{current:M}=a,{current:D}=i;if(f&&M){let{scrollLeft:w,scrollTop:d}=f,[b,H]=_r(f);s.current=!0,M.scrollLeft=Math.round(b*e),M.scrollTop=Math.round(H*t),D.scrollTop!==d&&(D.scrollTop=d,n==null||n(d,H)),D.scrollLeft!==w&&(D.scrollLeft=w,o==null||o(w))}},[e,t,o,n]),m=(0,Q.useCallback)(f=>{a.current=f,f.addEventListener("scroll",u,{passive:!0})},[u]),C=(0,Q.useCallback)(f=>{a.current=null,f.removeEventListener("scroll",u)},[u]),h=(0,Q.useCallback)(f=>{c.current=f,f.addEventListener("scroll",p,{passive:!0})},[p]),v=(0,Q.useCallback)(f=>{c.current=null,f.removeEventListener("scroll",p)},[p]),T=Jr({onAttach:h,onDetach:v}),x=Jr({onAttach:m,onDetach:C}),g=(0,Q.useCallback)(f=>{let{current:M}=c;if(M){let{scrollLeft:D,scrollTop:w}=M;if(s.current=!1,f.type==="scroll-distance"){let d=D,b=w;f.direction==="up"||f.direction==="down"?b=Math.min(Math.max(0,w+f.distance),t):d=Math.min(Math.max(0,D+f.distance),e),M.scrollTo({top:b,left:d,behavior:"auto"})}else if(f.type==="scroll-page"){let{direction:d}=f,b=l*(d==="down"?r:-r),H=Math.min(Math.max(0,w+b),t);M.scrollTo({top:H,left:D,behavior:"auto"})}else if(f.type==="scroll-end"){let{direction:d}=f,b=d==="end"?t:0;M.scrollTo({top:b,left:M.scrollLeft,behavior:"auto"})}}},[e,t,r,l]);return{scrollbarContainerRef:x,contentContainerRef:T,requestScroll:g}};var st=require("react"),Qr=({columns:e,getRowAtPosition:t,setRange:o,viewportMeasurements:n})=>{let r=(0,st.useRef)(0),{contentWidth:l,rowCount:s}=n,i=(0,st.useCallback)(a=>{let c=t(a);c!==r.current&&(r.current=c,o({from:c,to:c+s}))},[t,o,s]);return(0,st.useEffect)(()=>{let{current:a}=r,c={from:a,to:a+s};o(c)},[o,s]),{onVerticalScroll:i}};var{KEY:ui,IS_EXPANDED:Yr,IS_LEAF:Zr}=_.metadataKeys,mi=(e,t)=>({...e,columns:e.columns.concat(t)}),tl=({availableColumns:e,config:t,containerRef:o,dataSource:n,headerHeight:r=25,navigationStyle:l="cell",onAvailableColumnsChange:s,onConfigChange:i,onFeatureEnabled:a,onFeatureInvocation:c,onRowClick:u,onSelect:p,onSelectionChange:m,renderBufferSize:C=0,rowHeight:h=20,selectionModel:v})=>{let[T,x]=(0,z.useState)(n.size);if(n===void 0)throw Error("no data source provided to Vuu Table");let[g,f]=(0,z.useState)(),M=(0,z.useCallback)(P=>{f(P)},[]),D=(0,z.useMemo)(()=>Ct(n),[n]),w=(0,z.useCallback)(P=>{x(P)},[]),{columns:d,dispatchColumnAction:b,headings:H,tableAttributes:y,tableConfig:R}=Gr(t,n.config);(0,jr.useLayoutEffectSkipFirst)(()=>{b({type:"init",dataSourceConfig:n.config,tableConfig:R})},[R,n.config,b]);let[A,S]=(0,z.useState)(),[k,te]=(0,z.useMemo)(()=>{let P=(N,I)=>{let ne=(0,_.updateColumn)(d,N,{width:I});S(ne)};return[A!=null?A:d,P]},[d,A]),Ae=(0,z.useMemo)(()=>(0,_.buildColumnMap)(n.columns),[n.columns]),{getRowAtPosition:ct,getRowOffset:kt,setPctScrollTop:Nt,...ie}=Rt({columns:k,headerHeight:r,headings:H,rowCount:T,rowHeight:h,size:g}),Ge=Sr({from:0,to:ie.rowCount}),We=(0,z.useCallback)(({tableSchema:P})=>{P||console.log("usbscription message with no schema")},[]),{data:pe,range:oe,setRange:ut}=Er({dataSource:n,onFeatureEnabled:a,onFeatureInvocation:c,renderBufferSize:C,onSizeChange:w,onSubscribed:We,range:Ge}),mt=(0,z.useCallback)(P=>{b({type:"init",tableConfig:P,dataSourceConfig:n.config}),i==null||i(P)},[n.config,b,i]),pt=(0,z.useCallback)(P=>{n.config={...n.config,...P}},[n]),Y=(0,z.useCallback)(P=>{n.columns=n.columns.concat(P.name);let N=mi(R,P);b({type:"init",tableConfig:N,dataSourceConfig:n.config}),console.log("dispatch onConfigChange",{newTableConfig:N}),i==null||i(N)},[n,b,i,R]);(0,z.useEffect)(()=>{n.on("config",(P,N)=>{b({type:"tableConfig",...P,confirmed:N})})},[n,b]);let{showColumnSettingsPanel:Ce,showTableSettingsPanel:zt}=(0,qr.useTableAndColumnSettings)({availableColumns:e!=null?e:R.columns.map(({name:P,serverDataType:N="string"})=>({name:P,serverDataType:N})),onAvailableColumnsChange:s,onConfigChange:mt,onCreateCalculatedColumn:Y,onDataSourceConfigChange:pt,tableConfig:R}),ao=(0,z.useCallback)(P=>{Fr(P)?Ce(P):Or(P)?zt():b(P)},[b,Ce,zt]),It=bt({dataSource:n,onPersistentColumnOperation:ao}),Vt=(0,z.useCallback)((P,N=!1,I)=>{n&&(n.sort=(0,_.applySort)(n.sort,P,N,I))},[n]),$t=(0,z.useCallback)((P,N,I)=>{let ne=k.find(ge=>ge.name===N);if(ne)P==="resize"?(0,_.isValidNumber)(I)&&te(N,I):P==="end"?(0,_.isValidNumber)(I)&&(b({type:"resizeColumn",phase:P,column:ne,width:I}),i==null||i(jt(R,{type:"col-size",column:ne,width:I}))):(S(void 0),b({type:"resizeColumn",phase:P,column:ne,width:I}));else throw Error(`useDataTable.handleColumnResize, column ${N} not found`)},[k,R,b,i,te]),Ft=(0,z.useCallback)((P,N)=>{let I=(0,_.isJsonGroup)(N,P),ne=P[ui];if(P[Yr]){if(n.closeTreeNode(ne,!0),I){let ge=k.indexOf(N);n.getRowsAtDepth(ge+1).some(he=>he[Yr]||he[Zr])||b({type:"hideColumns",columns:k.slice(ge+2)})}}else if(n.openTreeNode(ne),I){let ge=n.getChildRows(ne),dt=k.indexOf(N)+1,he=[k[dt]];ge.some(bo=>bo[Zr])&&he.push(k[dt+1]),he.some(bo=>bo.hidden)&&b({type:"showColumns",columns:he})}},[k,n,b]),{onVerticalScroll:K}=Qr({columns:k,getRowAtPosition:ct,setRange:ut,viewportMeasurements:ie}),F=(0,z.useCallback)(P=>{K(P)},[K]),{requestScroll:Z,...G}=Xr({maxScrollLeft:ie.maxScrollContainerScrollHorizontal,maxScrollTop:ie.maxScrollContainerScrollVertical,rowHeight:h,onVerticalScroll:F,viewportRowCount:ie.rowCount}),{navigate:ae,onKeyDown:de,...ce}=Hr({columnCount:k.filter(P=>P.hidden!==!0).length,containerRef:o,navigationStyle:l,requestScroll:Z,rowCount:n==null?void 0:n.size,viewportRange:oe,viewportRowCount:ie.rowCount}),{onKeyDown:be}=zr({navigate:ae}),co=(0,z.useCallback)(P=>{de(P),P.defaultPrevented||be(P)},[de,be]),uo=kr({columns:k,data:pe}),mo=(0,z.useCallback)(P=>{var he;let I=P.target.closest(".vuuTableNextHeaderCell"),ne=parseInt((he=I==null?void 0:I.dataset.index)!=null?he:"-1"),ge=(0,_.visibleColumnAtIndex)(k,ne),dt=P.shiftKey;ge&&Vt(ge,dt)},[k,Vt]),po=(0,z.useCallback)(P=>{(0,_.isGroupColumn)(P)?n.groupBy=[]:n&&n.groupBy.includes(P.name)&&(n.groupBy=n.groupBy.filter(N=>N!==P.name))},[n]),fo=(0,z.useCallback)(P=>{n.select(P),m==null||m(P)},[n,m]),Ot=Mt({onSelect:p,onSelectionChange:fo,selectionModel:v}),Co=(0,z.useCallback)((P,N,I)=>{Ot(P,N,I),u==null||u(P)},[u,Ot]);(0,z.useEffect)(()=>{n.on("config",(P,N)=>{b({type:"tableConfig",...P,confirmed:N})})},[n,b]);let ml=(0,z.useCallback)((P,N)=>{let I=k[P];b({type:"moveColumn",column:I,moveTo:N})},[k,b]),pl=(0,z.useCallback)((P,N,I)=>n.applyEdit(P,N,I),[n]),{onMouseDown:dl,...fl}=(0,el.useDragDropNext)({allowDragDrop:!0,containerRef:o,draggableClassName:"vuuTableNext",onDrop:ml,orientation:"horizontal",itemQuery:".vuuTableNextHeaderCell"});return{...ce,onKeyDown:co,columnMap:Ae,columns:k,data:pe,handleContextMenuAction:It,headerProps:{onClick:mo,onMouseDown:dl,onResize:$t},menuBuilder:D,onContextMenu:uo,onDataEdited:pl,onRemoveGroupColumn:po,onResize:M,onRowClick:Co,onToggleGroup:Ft,scrollProps:G,tableAttributes:y,viewportMeasurements:ie,dragDropHook:fl}};var ro=require("@vuu-ui/vuu-layout"),nl=require("@salt-ds/core");var se=require("react/jsx-runtime"),Qo=require("react"),le="vuuTableNext",{IDX:pi,RENDER_IDX:di}=it.metadataKeys,rl=(0,no.forwardRef)(function({Row:t=Wo,availableColumns:o,className:n,config:r,dataSource:l,id:s,navigationStyle:i="cell",onAvailableColumnsChange:a,onConfigChange:c,onFeatureEnabled:u,onFeatureInvocation:p,onRowClick:m,onSelect:C,onSelectionChange:h,onShowConfigEditor:v,renderBufferSize:T=0,rowHeight:x=20,selectionModel:g="extended",showColumnHeaders:f=!0,headerHeight:M=f?25:0,style:D,...w},d){let b=(0,ro.useId)(s),H=(0,no.useRef)(null),{columnMap:y,columns:R,data:A,dragDropHook:S,handleContextMenuAction:k,headerProps:te,onDataEdited:Ae,onRemoveGroupColumn:ct,onResize:kt,onRowClick:Nt,onToggleGroup:ie,menuBuilder:Ge,scrollProps:We,tableAttributes:pe,viewportMeasurements:oe,...ut}=tl({availableColumns:o,config:r,containerRef:H,dataSource:l,headerHeight:M,navigationStyle:i,onAvailableColumnsChange:a,onConfigChange:c,onFeatureEnabled:u,onFeatureInvocation:p,onRowClick:m,onSelect:C,onSelectionChange:h,renderBufferSize:T,rowHeight:x,selectionModel:g}),mt=()=>({...D,"--content-height":`${oe.contentHeight}px`,"--horizontal-scrollbar-height":`${oe.horizontalScrollbarHeight}px`,"--content-width":`${oe.contentWidth}px`,"--pinned-width-left":`${oe.pinnedWidthLeft}px`,"--pinned-width-right":`${oe.pinnedWidthRight}px`,"--header-height":`${M}px`,"--row-height":`${x}px`,"--total-header-height":`${oe.totalHeaderHeight}px`,"--vertical-scrollbar-width":`${oe.verticalScrollbarWidth}px`,"--viewport-body-height":`${oe.viewportBodyHeight}px`}),pt=(0,Xo.default)(le,n,{[`${le}-colLines`]:pe.columnSeparators,[`${le}-rowLines`]:pe.rowSeparators,[`${le}-highlight`]:pe.showHighlightedRow,[`${le}-zebra`]:pe.zebraStripes});return(0,se.jsx)(ol.ContextMenuProvider,{menuActionHandler:k,menuBuilder:Ge,children:(0,se.jsxs)(ro.MeasuredContainer,{...w,className:pt,onResize:kt,ref:(0,nl.useForkRef)(H,d),style:mt(),children:[(0,se.jsx)("div",{className:`${le}-scrollbarContainer`,ref:We.scrollbarContainerRef,children:(0,se.jsx)("div",{className:`${le}-scrollbarContent`})}),(0,se.jsx)("div",{className:`${le}-contentContainer`,ref:We.contentContainerRef,children:(0,se.jsxs)("div",{...ut,className:`${le}-table`,tabIndex:-1,children:[f?(0,se.jsx)("div",{className:`${le}-col-headings`,children:(0,se.jsxs)("div",{className:`${le}-col-headers`,role:"row",children:[R.filter(it.notHidden).map((Y,Ce)=>(0,it.isGroupColumn)(Y)?(0,Qo.createElement)(At,{...te,column:Y,"data-index":Ce,key:Y.name,onRemoveColumn:ct}):(0,Qo.createElement)(gr,{...te,className:(0,Xo.default)({"vuuDraggable-dragAway":Ce===S.draggedItemIndex}),column:Y,"data-index":Ce,id:`${b}-col-${Ce}`,key:Y.name})),S.draggable]})}):null,(0,se.jsx)("div",{className:`${le}-body`,children:A.map(Y=>(0,se.jsx)(t,{columnMap:y,columns:R,onClick:Nt,onDataEdited:Ae,row:Y,offset:x*Y[pi]+M,onToggleGroup:ie,zebraStripes:pe.zebraStripes},Y[di]))})]})})]})})});var ll=require("@vuu-ui/vuu-ui-controls"),at=require("@vuu-ui/vuu-utils");var lo=require("react"),sl=require("react/jsx-runtime"),fi="vuuTableDropdownCell",Ci=["Enter"," "],bi=({column:e,columnMap:t,row:o})=>{var a,c,u;let n=(0,at.isTypeDescriptor)(e.type)&&(0,at.isColumnTypeRenderer)((a=e.type)==null?void 0:a.renderer)?(u=(c=e.type)==null?void 0:c.renderer)==null?void 0:u.values:[],r=t[e.name],[l,s]=(0,lo.useState)(o[r]),i=(0,lo.useCallback)((p,m)=>{m&&s(m)},[]);return(0,sl.jsx)(ll.Dropdown,{className:fi,onSelectionChange:i,openKeys:Ci,selected:l,source:n,width:e.width-17})};(0,at.registerComponent)("dropdown-cell",bi,"cell-renderer",{});var il=require("@vuu-ui/vuu-utils"),al=require("@salt-ds/core"),cl=require("@vuu-ui/vuu-ui-controls"),ul=W(require("classnames"));var io=require("react/jsx-runtime"),so="vuuTableInputCell",gi=()=>(console.warn("onCommit handler has not been provided to InputCell cell renderer"),!0),hi=({column:e,columnMap:t,onCommit:o=gi,row:n})=>{let r=t[e.name],{align:l="left",clientSideEditValidationCheck:s,valueFormatter:i}=e,{warningMessage:a,...c}=(0,cl.useEditableText)({initialValue:i(n[r]),onCommit:o,clientSideEditValidationCheck:s}),u=a&&l==="left"?(0,io.jsx)("span",{className:`${so}-icon`,"data-icon":"error"}):void 0,p=a&&l==="right"?(0,io.jsx)("span",{className:`${so}-icon`,"data-icon":"error"}):void 0;return(0,io.jsx)(al.Input,{...c,className:(0,ul.default)(so,{[`${so}-error`]:a!==void 0}),endAdornment:u,startAdornment:p})};(0,il.registerComponent)("input-cell",hi,"cell-renderer",{});
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var src_exports = {};
+__export(src_exports, {
+  CheckboxCell: () => CheckboxCell,
+  DropdownCell: () => DropdownCell,
+  GroupHeaderCellNext: () => GroupHeaderCellNext,
+  HeaderCell: () => HeaderCell,
+  InputCell: () => InputCell,
+  LookupCell: () => LookupCell,
+  Table: () => Table,
+  ToggleCell: () => ToggleCell,
+  isShowColumnSettings: () => isShowColumnSettings,
+  isShowTableSettings: () => isShowTableSettings,
+  updateTableConfig: () => updateTableConfig,
+  useControlledTableNavigation: () => useControlledTableNavigation,
+  useTableModel: () => useTableModel,
+  useTableViewport: () => useTableViewport
+});
+module.exports = __toCommonJS(src_exports);
+
+// src/header-cell/GroupHeaderCellNext.tsx
+var import_classnames3 = __toESM(require("classnames"));
+var import_react5 = require("react");
+
+// src/column-resizing/ColumnResizer.tsx
+var import_react = require("react");
+var import_jsx_runtime = require("react/jsx-runtime");
+var NOOP = () => void 0;
+var baseClass = "vuuColumnResizerNext";
+var ColumnResizer = ({
+  onDrag,
+  onDragEnd = NOOP,
+  onDragStart = NOOP
+}) => {
+  const position = (0, import_react.useRef)(0);
+  const onMouseMove = (0, import_react.useCallback)(
+    (e) => {
+      if (e.stopPropagation) {
+        e.stopPropagation();
+      }
+      if (e.preventDefault) {
+        e.preventDefault();
+      }
+      const x = Math.round(e.clientX);
+      const moveBy = x - position.current;
+      position.current = x;
+      if (moveBy !== 0) {
+        onDrag(e, moveBy);
+      }
+    },
+    [onDrag]
+  );
+  const onMouseUp = (0, import_react.useCallback)(
+    (e) => {
+      window.removeEventListener("mouseup", onMouseUp);
+      window.removeEventListener("mousemove", onMouseMove);
+      onDragEnd(e);
+    },
+    [onDragEnd, onMouseMove]
+  );
+  const handleMouseDown = (0, import_react.useCallback)(
+    (e) => {
+      onDragStart(e);
+      position.current = Math.round(e.clientX);
+      window.addEventListener("mouseup", onMouseUp);
+      window.addEventListener("mousemove", onMouseMove);
+      if (e.stopPropagation) {
+        e.stopPropagation();
+      }
+      if (e.preventDefault) {
+        e.preventDefault();
+      }
+    },
+    [onDragStart, onMouseMove, onMouseUp]
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: baseClass, onMouseDown: handleMouseDown });
+};
+
+// src/column-resizing/useTableColumnResize.tsx
+var import_react2 = require("react");
+var useTableColumnResize = ({
+  column,
+  onResize,
+  rootRef
+}) => {
+  const widthRef = (0, import_react2.useRef)(0);
+  const [isResizing, setResizing] = (0, import_react2.useState)(false);
+  const { name } = column;
+  const handleResizeStart = (0, import_react2.useCallback)(() => {
+    if (onResize && rootRef.current) {
+      const { width } = rootRef.current.getBoundingClientRect();
+      widthRef.current = Math.round(width);
+      setResizing(true);
+      onResize == null ? void 0 : onResize("begin", name);
+    }
+  }, [name, onResize, rootRef]);
+  const handleResize = (0, import_react2.useCallback)(
+    (_evt, moveBy) => {
+      if (rootRef.current) {
+        if (onResize) {
+          const { width } = rootRef.current.getBoundingClientRect();
+          const newWidth = Math.round(width) + moveBy;
+          if (newWidth !== widthRef.current && newWidth > 0) {
+            onResize("resize", name, newWidth);
+            widthRef.current = newWidth;
+          }
+        }
+      }
+    },
+    [name, onResize, rootRef]
+  );
+  const handleResizeEnd = (0, import_react2.useCallback)(() => {
+    if (onResize) {
+      onResize("end", name, widthRef.current);
+      setTimeout(() => {
+        setResizing(false);
+      }, 80);
+    }
+  }, [name, onResize]);
+  return {
+    isResizing,
+    onDrag: handleResize,
+    onDragStart: handleResizeStart,
+    onDragEnd: handleResizeEnd
+  };
+};
+
+// src/useCell.ts
+var import_vuu_utils = require("@vuu-ui/vuu-utils");
+var import_classnames = __toESM(require("classnames"));
+var import_react3 = require("react");
+var useCell = (column, classBase11, isHeader) => (
+  // TODO measure perf without the memo, might not be worth the cost
+  (0, import_react3.useMemo)(() => {
+    const className = (0, import_classnames.default)(classBase11, {
+      vuuPinFloating: column.pin === "floating",
+      vuuPinLeft: column.pin === "left",
+      vuuPinRight: column.pin === "right",
+      vuuEndPin: isHeader && column.endPin,
+      // [`${classBase}-resizing`]: column.resizing,
+      [`${classBase11}-editable`]: column.editable,
+      [`${classBase11}-right`]: column.align === "right"
+    });
+    const style = (0, import_vuu_utils.getColumnStyle)(column);
+    return {
+      className,
+      style
+    };
+  }, [column, classBase11, isHeader])
+);
+
+// src/column-header-pill/ColumnHeaderPill.tsx
+var import_classnames2 = __toESM(require("classnames"));
+var import_react4 = require("react");
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var classBase = "vuuColumnHeaderPill";
+var ColumnHeaderPill = ({
+  children,
+  className,
+  column,
+  onRemove,
+  removable,
+  ...htmlAttributes
+}) => {
+  if (removable && typeof onRemove !== "function") {
+    throw Error(
+      "ColumnHeaderPill onRemove prop must be provided if Pill is removable"
+    );
+  }
+  const handleClickRemove = (0, import_react4.useCallback)(
+    (evt) => {
+      evt.preventDefault();
+      evt.stopPropagation();
+      onRemove == null ? void 0 : onRemove(column);
+    },
+    [column, onRemove]
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { ...htmlAttributes, className: (0, import_classnames2.default)(classBase, className), children: [
+    children,
+    removable ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+      "span",
+      {
+        className: `${classBase}-removeButton`,
+        role: "button",
+        "data-icon": "cross",
+        onClick: handleClickRemove
+      }
+    ) : null
+  ] });
+};
+
+// src/column-header-pill/GroupColumnPill.tsx
+var import_jsx_runtime3 = require("react/jsx-runtime");
+var GroupColumnPill = ({
+  column,
+  ...columnHeaderProps
+}) => {
+  const { name, sorted } = column;
+  const icon = typeof sorted === "number" ? sorted < 0 ? "arrow-down" : "arrow-up" : sorted === "A" ? "arrow-up" : sorted === "D" ? "arrow-down" : void 0;
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(ColumnHeaderPill, { ...columnHeaderProps, column, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "vuuGroupColumnPill-label", children: name }),
+    icon !== void 0 ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { "data-icon": icon }) : null,
+    typeof sorted === "number" ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "vuuSortPosition", children: Math.abs(sorted) }) : null
+  ] });
+};
+
+// src/column-header-pill/SortIndicator.tsx
+var import_jsx_runtime4 = require("react/jsx-runtime");
+var SortIndicator = ({ column }) => {
+  if (!column.sorted) {
+    return null;
+  }
+  const icon = typeof column.sorted === "number" ? column.sorted < 0 ? "arrow-down" : "arrow-up" : column.sorted === "A" ? "arrow-up" : "arrow-down";
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(ColumnHeaderPill, { column, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { "data-icon": icon }),
+    typeof column.sorted === "number" ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "vuuSortPosition", children: Math.abs(column.sorted) }) : null
+  ] });
+};
+
+// src/header-cell/GroupHeaderCellNext.tsx
+var import_vuu_layout = require("@vuu-ui/vuu-layout");
+var import_jsx_runtime5 = require("react/jsx-runtime");
+var import_react6 = require("react");
+var classBase2 = "vuuTableGroupHeaderCell";
+var switchIfChanged = (columns, newColumns) => {
+  if (columns === newColumns) {
+    return columns;
+  } else {
+    return newColumns;
+  }
+};
+var GroupHeaderCellNext = ({
+  column: groupColumn,
+  className: classNameProp,
+  onMoveColumn,
+  onRemoveColumn,
+  onResize,
+  ...htmlAttributes
+}) => {
+  const rootRef = (0, import_react5.useRef)(null);
+  const { isResizing, ...resizeProps } = useTableColumnResize({
+    column: groupColumn,
+    onResize,
+    rootRef
+  });
+  const [columns, setColumns] = (0, import_react5.useState)(groupColumn.columns);
+  const { className, style } = useCell(groupColumn, classBase2, true);
+  const columnPillProps = columns.length > 1 ? {
+    removable: true,
+    onRemove: onRemoveColumn
+  } : void 0;
+  const handleMoveItem = (0, import_react5.useCallback)(
+    (fromIndex, toIndex) => {
+      setColumns((cols) => {
+        const newCols = cols.slice();
+        const [tab] = newCols.splice(fromIndex, 1);
+        if (toIndex === -1) {
+          const result = newCols.concat(tab);
+          onMoveColumn == null ? void 0 : onMoveColumn(result);
+          return result;
+        } else {
+          newCols.splice(toIndex, 0, tab);
+          onMoveColumn == null ? void 0 : onMoveColumn(newCols);
+          return newCols;
+        }
+      });
+    },
+    [onMoveColumn]
+  );
+  (0, import_vuu_layout.useLayoutEffectSkipFirst)(() => {
+    setColumns((cols) => switchIfChanged(cols, groupColumn.columns));
+  }, [groupColumn.columns]);
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
+    "div",
+    {
+      ...htmlAttributes,
+      className: (0, import_classnames3.default)(className, classNameProp, {
+        [`${classBase2}-pending`]: groupColumn.groupConfirmed === false
+      }),
+      ref: rootRef,
+      role: "columnheader",
+      style,
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+          import_vuu_layout.OverflowContainer,
+          {
+            allowDragDrop: true,
+            className: `${classBase2}-inner`,
+            height: 24,
+            onMoveItem: handleMoveItem,
+            overflowPosition: "start",
+            children: columns.map((column) => {
+              return /* @__PURE__ */ (0, import_react6.createElement)(
+                GroupColumnPill,
+                {
+                  ...columnPillProps,
+                  column,
+                  key: column.key
+                }
+              );
+            })
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+          ColumnHeaderPill,
+          {
+            column: groupColumn,
+            removable: true,
+            onRemove: onRemoveColumn
+          }
+        ),
+        groupColumn.resizeable !== false ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(ColumnResizer, { ...resizeProps }) : null
+      ]
+    }
+  );
+};
+
+// src/header-cell/HeaderCell.tsx
+var import_react8 = require("react");
+
+// src/column-menu/ColumnMenu.tsx
+var import_vuu_popups = require("@vuu-ui/vuu-popups");
+var import_classnames4 = __toESM(require("classnames"));
+var import_react7 = require("react");
+var import_jsx_runtime6 = require("react/jsx-runtime");
+var getPosition = (element) => {
+  if (element) {
+    const { bottom, left } = element.getBoundingClientRect();
+    return { x: left, y: bottom + 6 };
+  }
+};
+var ColumnMenu = ({
+  className,
+  column,
+  ...props
+}) => {
+  const rootRef = (0, import_react7.useRef)(null);
+  const [menuOpen, setMenuOpen] = (0, import_react7.useState)(false);
+  const [showContextMenu] = (0, import_vuu_popups.useContextMenu)();
+  const handleMenuClose = (0, import_react7.useCallback)(() => {
+    setMenuOpen(false);
+  }, []);
+  const showColumnMenu = (0, import_react7.useCallback)(
+    (e) => {
+      setMenuOpen(true);
+      showContextMenu(e, "column-menu", {
+        column,
+        ContextMenuProps: {
+          onClose: handleMenuClose,
+          position: getPosition(rootRef.current)
+        }
+      });
+    },
+    [column, handleMenuClose, showContextMenu]
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+    "span",
+    {
+      ...props,
+      className: (0, import_classnames4.default)("vuuTable-columnMenu", className, {
+        "vuuTable-columnMenu-open": menuOpen
+      }),
+      "data-icon": "more-vert",
+      onClick: showColumnMenu,
+      ref: rootRef
+    }
+  );
+};
+
+// src/header-cell/HeaderCell.tsx
+var import_classnames5 = __toESM(require("classnames"));
+var import_jsx_runtime7 = require("react/jsx-runtime");
+var classBase3 = "vuuTableHeaderCell";
+var HeaderCell = ({
+  className: classNameProp,
+  column,
+  onClick,
+  onResize,
+  ...htmlAttributes
+}) => {
+  var _a;
+  const { HeaderCellContentRenderer, HeaderCellLabelRenderer } = column;
+  const rootRef = (0, import_react8.useRef)(null);
+  const { isResizing, ...resizeProps } = useTableColumnResize({
+    column,
+    onResize,
+    rootRef
+  });
+  const handleClick = (0, import_react8.useCallback)(
+    (evt) => {
+      !isResizing && (onClick == null ? void 0 : onClick(evt));
+    },
+    [isResizing, onClick]
+  );
+  const { className, style } = useCell(column, classBase3, true);
+  const columnMenu = /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ColumnMenu, { column });
+  const columnLabel = HeaderCellLabelRenderer ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(HeaderCellLabelRenderer, { className: `${classBase3}-label`, column }) : /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: `${classBase3}-label`, children: (_a = column.label) != null ? _a : column.name });
+  const columnContent = HeaderCellContentRenderer ? [/* @__PURE__ */ (0, import_jsx_runtime7.jsx)(HeaderCellContentRenderer, { column }, "content")] : [];
+  const sortIndicator = /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SortIndicator, { column });
+  const headerItems = column.align === "right" ? [sortIndicator, columnLabel].concat(columnContent).concat(columnMenu) : [columnMenu, columnLabel, sortIndicator].concat(columnContent);
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
+    "div",
+    {
+      ...htmlAttributes,
+      className: (0, import_classnames5.default)(className, classNameProp, {
+        [`${classBase3}-resizing`]: isResizing
+      }),
+      onClick: handleClick,
+      ref: rootRef,
+      role: "columnheader",
+      style,
+      children: [
+        ...headerItems,
+        column.resizeable !== false ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ColumnResizer, { ...resizeProps }) : null
+      ]
+    }
+  );
+};
+
+// src/Table.tsx
+var import_vuu_layout3 = require("@vuu-ui/vuu-layout");
+var import_vuu_popups3 = require("@vuu-ui/vuu-popups");
+var import_vuu_utils18 = require("@vuu-ui/vuu-utils");
+var import_core2 = require("@salt-ds/core");
+var import_classnames9 = __toESM(require("classnames"));
+var import_react25 = require("react");
+
+// src/Row.tsx
+var import_vuu_utils4 = require("@vuu-ui/vuu-utils");
+var import_classnames7 = __toESM(require("classnames"));
+var import_react11 = require("react");
+
+// src/table-cell/TableCell.tsx
+var import_vuu_utils2 = require("@vuu-ui/vuu-utils");
+var import_react9 = require("react");
+var import_jsx_runtime8 = require("react/jsx-runtime");
+var classBase4 = "vuuTableCell";
+var TableCell = ({
+  column,
+  columnMap,
+  onClick,
+  onDataEdited,
+  row
+}) => {
+  const { className, style } = useCell(column, classBase4);
+  const { CellRenderer, name, valueFormatter } = column;
+  const dataIdx = columnMap[name];
+  const handleDataItemEdited = (0, import_react9.useCallback)(
+    (value) => {
+      if (onDataEdited) {
+        let typedValue = value;
+        if ((0, import_vuu_utils2.isNumericColumn)(column) && typeof value === "string") {
+          typedValue = column.serverDataType === "double" ? parseFloat(value) : parseInt(value);
+        }
+        return onDataEdited == null ? void 0 : onDataEdited(row, name, typedValue);
+      } else {
+        throw Error(
+          "TableCell onDataEdited prop not supplied for an editable cell"
+        );
+      }
+    },
+    [column, name, onDataEdited, row]
+  );
+  const handleClick = (0, import_react9.useCallback)(
+    (evt) => {
+      onClick == null ? void 0 : onClick(evt, column);
+    },
+    [column, onClick]
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+    "div",
+    {
+      className,
+      onClick: onClick ? handleClick : void 0,
+      role: "cell",
+      style,
+      children: CellRenderer ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+        CellRenderer,
+        {
+          column,
+          columnMap,
+          onCommit: handleDataItemEdited,
+          row
+        }
+      ) : valueFormatter(row[dataIdx])
+    }
+  );
+};
+
+// src/table-cell/TableGroupCell.tsx
+var import_vuu_utils3 = require("@vuu-ui/vuu-utils");
+var import_react10 = require("react");
+var import_classnames6 = __toESM(require("classnames"));
+var import_jsx_runtime9 = require("react/jsx-runtime");
+var { IS_LEAF } = import_vuu_utils3.metadataKeys;
+var classBase5 = "vuuTableGroupCell";
+var TableGroupCell = ({ column, onClick, row }) => {
+  const { columns } = column;
+  const [value, offset] = (0, import_vuu_utils3.getGroupValueAndOffset)(columns, row);
+  const { className, style } = useCell(column, classBase5);
+  const handleClick = (0, import_react10.useCallback)(
+    (evt) => {
+      onClick == null ? void 0 : onClick(evt, column);
+    },
+    [column, onClick]
+  );
+  const isLeaf = row[IS_LEAF];
+  const spacers = Array(offset).fill(0).map((n, i) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: `${classBase5}-spacer` }, i));
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
+    "div",
+    {
+      className: (0, import_classnames6.default)(className, "vuuTableCell"),
+      role: "cell",
+      style,
+      onClick: isLeaf ? void 0 : handleClick,
+      children: [
+        spacers,
+        isLeaf ? null : /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: `${classBase5}-toggle`, "data-icon": "triangle-right" }),
+        /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { children: value })
+      ]
+    }
+  );
+};
+
+// src/Row.tsx
+var import_jsx_runtime10 = require("react/jsx-runtime");
+var import_react12 = require("react");
+var { IDX, IS_EXPANDED, SELECTED } = import_vuu_utils4.metadataKeys;
+var classBase6 = "vuuTableRow";
+var Row = (0, import_react11.memo)(
+  ({
+    className: classNameProp,
+    columnMap,
+    columns,
+    highlighted,
+    row,
+    offset,
+    onClick,
+    onDataEdited,
+    onToggleGroup,
+    zebraStripes = false,
+    ...htmlAttributes
+  }) => {
+    const {
+      [IDX]: rowIndex,
+      [IS_EXPANDED]: isExpanded,
+      [SELECTED]: selectionStatus
+    } = row;
+    const handleRowClick = (0, import_react11.useCallback)(
+      (evt) => {
+        const rangeSelect = evt.shiftKey;
+        const keepExistingSelection = evt.ctrlKey || evt.metaKey;
+        onClick == null ? void 0 : onClick(row, rangeSelect, keepExistingSelection);
+      },
+      [onClick, row]
+    );
+    const { True, First, Last } = import_vuu_utils4.RowSelected;
+    const className = (0, import_classnames7.default)(classBase6, classNameProp, {
+      [`${classBase6}-even`]: zebraStripes && rowIndex % 2 === 0,
+      [`${classBase6}-expanded`]: isExpanded,
+      [`${classBase6}-highlighted`]: highlighted,
+      [`${classBase6}-selected`]: selectionStatus & True,
+      [`${classBase6}-selectedStart`]: selectionStatus & First,
+      [`${classBase6}-selectedEnd`]: selectionStatus & Last
+    });
+    const style = { transform: `translate3d(0px, ${offset}px, 0px)` };
+    const handleGroupCellClick = (0, import_react11.useCallback)(
+      (evt, column) => {
+        if ((0, import_vuu_utils4.isGroupColumn)(column) || (0, import_vuu_utils4.isJsonGroup)(column, row)) {
+          evt.stopPropagation();
+          onToggleGroup == null ? void 0 : onToggleGroup(row, column);
+        }
+      },
+      [onToggleGroup, row]
+    );
+    return /* @__PURE__ */ (0, import_react12.createElement)(
+      "div",
+      {
+        ...htmlAttributes,
+        "aria-rowindex": row[0],
+        key: `row-${row[0]}`,
+        role: "row",
+        className,
+        onClick: handleRowClick,
+        style
+      },
+      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: `${classBase6}-selectionDecorator vuuStickyLeft` }),
+      columns.filter(import_vuu_utils4.isNotHidden).map((column) => {
+        const isGroup = (0, import_vuu_utils4.isGroupColumn)(column);
+        const isJsonCell = (0, import_vuu_utils4.isJsonColumn)(column);
+        const Cell = isGroup ? TableGroupCell : TableCell;
+        return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+          Cell,
+          {
+            column,
+            columnMap,
+            onClick: isGroup || isJsonCell ? handleGroupCellClick : void 0,
+            onDataEdited,
+            row
+          },
+          column.key
+        );
+      }),
+      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: `${classBase6}-selectionDecorator vuuStickyRight` })
+    );
+  }
+);
+Row.displayName = "Row";
+
+// src/useTable.ts
+var import_vuu_layout2 = require("@vuu-ui/vuu-layout");
+var import_vuu_table_extras = require("@vuu-ui/vuu-table-extras");
+var import_vuu_ui_controls2 = require("@vuu-ui/vuu-ui-controls");
+var import_vuu_utils15 = require("@vuu-ui/vuu-utils");
+var import_react23 = require("react");
+
+// src/context-menu/buildContextMenuDescriptors.ts
+var import_vuu_utils5 = require("@vuu-ui/vuu-utils");
+var buildContextMenuDescriptors = (dataSource) => (location, options) => {
+  const descriptors = [];
+  if (dataSource === void 0) {
+    return descriptors;
+  }
+  if (location === "header" || location === "column-menu") {
+    descriptors.push(
+      ...buildSortMenuItems(options, dataSource)
+    );
+    descriptors.push(
+      ...buildGroupMenuItems(options, dataSource)
+    );
+    descriptors.push(
+      ...buildAggregationMenuItems(options, dataSource)
+    );
+    descriptors.push(...buildColumnDisplayMenuItems(options));
+    descriptors.push({
+      action: "column-settings",
+      icon: "cog",
+      label: `Column Settings`,
+      options
+    });
+    descriptors.push({
+      action: "table-settings",
+      icon: "cog",
+      label: `DataGrid Settings`,
+      options
+    });
+  } else if (location === "filter") {
+    const { column, filter } = options;
+    const colIsOnlyFilter = (filter == null ? void 0 : filter.column) === (column == null ? void 0 : column.name);
+    descriptors.push({
+      label: "Edit filter",
+      action: "filter-edit",
+      options
+    });
+    descriptors.push({
+      label: "Remove filter",
+      action: "filter-remove-column",
+      options
+    });
+    if (column && !colIsOnlyFilter) {
+      descriptors.push({
+        label: `Remove all filters`,
+        action: "remove-filters",
+        options
+      });
+    }
+  }
+  return descriptors;
+};
+function buildSortMenuItems(options, { sort: { sortDefs } }) {
+  const { column } = options;
+  const menuItems = [];
+  if (column === void 0) {
+    return menuItems;
+  }
+  const hasSort = sortDefs.length > 0;
+  if (column.sorted === "A") {
+    menuItems.push({
+      label: "Reverse Sort (DSC)",
+      action: "sort-dsc",
+      options
+    });
+  } else if (column.sorted === "D") {
+    menuItems.push({
+      label: "Reverse Sort (ASC)",
+      action: "sort-asc",
+      options
+    });
+  } else if (typeof column.sorted === "number") {
+    if (column.sorted > 0) {
+      menuItems.push({
+        label: "Reverse Sort (DSC)",
+        action: "sort-add-dsc",
+        options
+      });
+    } else {
+      menuItems.push({
+        label: "Reverse Sort (ASC)",
+        action: "sort-add-asc",
+        options
+      });
+    }
+    if (hasSort && Math.abs(column.sorted) < sortDefs.length) {
+      menuItems.push({
+        label: "Remove from sort",
+        action: "sort-remove",
+        options
+      });
+    }
+    menuItems.push({
+      label: "New Sort",
+      children: [
+        { label: "Ascending", action: "sort-asc", options },
+        { label: "Descending", action: "sort-dsc", options }
+      ]
+    });
+  } else if (hasSort) {
+    menuItems.push({
+      label: "Add to sort",
+      children: [
+        { label: "Ascending", action: "sort-add-asc", options },
+        { label: "Descending", action: "sort-add-dsc", options }
+      ]
+    });
+    menuItems.push({
+      label: "New Sort",
+      children: [
+        { label: "Ascending", action: "sort-asc", options },
+        { label: "Descending", action: "sort-dsc", options }
+      ]
+    });
+  } else {
+    menuItems.push({
+      label: "Sort",
+      children: [
+        { label: "Ascending", action: "sort-asc", options },
+        { label: "Descending", action: "sort-dsc", options }
+      ]
+    });
+  }
+  return menuItems;
+}
+function buildAggregationMenuItems(options, dataSource) {
+  const { column } = options;
+  if (column === void 0 || dataSource.groupBy.length === 0) {
+    return [];
+  }
+  const { name, label = name } = column;
+  return [
+    {
+      label: `Aggregate ${label}`,
+      children: [
+        { label: "Count", action: "agg-count", options },
+        { label: "Distinct", action: "agg-distinct", options }
+      ].concat(
+        (0, import_vuu_utils5.isNumericColumn)(column) ? [
+          { label: "Sum", action: "agg-sum", options },
+          { label: "Avg", action: "agg-avg", options },
+          { label: "High", action: "agg-high", options },
+          { label: "Low", action: "agg-low", options }
+        ] : []
+      )
+    }
+  ];
+}
+var pinColumn = (options, pinLocation) => ({
+  label: `Pin ${pinLocation}`,
+  action: `column-pin-${pinLocation}`,
+  options
+});
+var pinLeft = (options) => pinColumn(options, "left");
+var pinFloating = (options) => pinColumn(options, "floating");
+var pinRight = (options) => pinColumn(options, "right");
+function buildColumnDisplayMenuItems(options) {
+  const { column } = options;
+  if (column === void 0) {
+    return [];
+  }
+  const { pin } = column;
+  const menuItems = [
+    {
+      label: `Hide column`,
+      action: "column-hide",
+      options
+    },
+    {
+      label: `Remove column`,
+      action: "column-remove",
+      options
+    }
+  ];
+  if (pin === void 0) {
+    menuItems.push({
+      label: `Pin column`,
+      children: [pinLeft(options), pinFloating(options), pinRight(options)]
+    });
+  } else if (pin === "left") {
+    menuItems.push(
+      { label: "Unpin column", action: "column-unpin", options },
+      {
+        label: `Pin column`,
+        children: [pinFloating(options), pinRight(options)]
+      }
+    );
+  } else if (pin === "right") {
+    menuItems.push(
+      { label: "Unpin column", action: "column-unpin", options },
+      {
+        label: `Pin column`,
+        children: [pinLeft(options), pinFloating(options)]
+      }
+    );
+  } else if (pin === "floating") {
+    menuItems.push(
+      { label: "Unpin column", action: "column-unpin", options },
+      {
+        label: `Pin column`,
+        children: [pinLeft(options), pinRight(options)]
+      }
+    );
+  }
+  return menuItems;
+}
+function buildGroupMenuItems(options, { groupBy }) {
+  const { column } = options;
+  const menuItems = [];
+  if (column === void 0) {
+    return menuItems;
+  }
+  const { name, label = name } = column;
+  if (groupBy.length === 0) {
+    menuItems.push({
+      label: `Group by ${label}`,
+      action: "group",
+      options
+    });
+  } else {
+    menuItems.push({
+      label: `Add ${label} to group by`,
+      action: "group-add",
+      options
+    });
+  }
+  return menuItems;
+}
+
+// src/context-menu/useHandleTableContextMenu.ts
+var import_vuu_utils6 = require("@vuu-ui/vuu-utils");
+var import_vuu_utils7 = require("@vuu-ui/vuu-utils");
+var removeFilterColumn = (dataSourceFilter, column) => {
+  if (dataSourceFilter.filterStruct && column) {
+    const [filterStruct, filter] = (0, import_vuu_utils6.removeColumnFromFilter)(
+      column,
+      dataSourceFilter.filterStruct
+    );
+    return {
+      filter,
+      filterStruct
+    };
+  } else {
+    return dataSourceFilter;
+  }
+};
+var { Average, Count, Distinct, High, Low, Sum } = import_vuu_utils7.AggregationType;
+var useHandleTableContextMenu = ({
+  dataSource,
+  onPersistentColumnOperation
+}) => {
+  const handleContextMenuAction = (action) => {
+    const gridOptions = action.options;
+    if (gridOptions.column && dataSource) {
+      const { column } = gridOptions;
+      switch (action.menuId) {
+        case "sort-asc":
+          return dataSource.sort = (0, import_vuu_utils7.setSortColumn)(dataSource.sort, column, "A"), true;
+        case "sort-dsc":
+          return dataSource.sort = (0, import_vuu_utils7.setSortColumn)(dataSource.sort, column, "D"), true;
+        case "sort-add-asc":
+          return dataSource.sort = (0, import_vuu_utils7.addSortColumn)(dataSource.sort, column, "A"), true;
+        case "sort-add-dsc":
+          return dataSource.sort = (0, import_vuu_utils7.addSortColumn)(dataSource.sort, column, "D"), true;
+        case "group":
+          return dataSource.groupBy = (0, import_vuu_utils7.addGroupColumn)(dataSource.groupBy, column), true;
+        case "group-add":
+          return dataSource.groupBy = (0, import_vuu_utils7.addGroupColumn)(dataSource.groupBy, column), true;
+        case "column-hide":
+          return onPersistentColumnOperation({ type: "hideColumns", columns: [column] }), true;
+        case "column-remove":
+          return dataSource.columns = dataSource.columns.filter((name) => name !== column.name), true;
+        case "filter-remove-column":
+          return dataSource.filter = removeFilterColumn(dataSource.filter, column), true;
+        case "remove-filters":
+          return dataSource.filter = { filter: "" }, true;
+        case "agg-avg":
+          return dataSource.aggregations = (0, import_vuu_utils7.setAggregations)(dataSource.aggregations, column, Average), true;
+        case "agg-high":
+          return dataSource.aggregations = (0, import_vuu_utils7.setAggregations)(dataSource.aggregations, column, High), true;
+        case "agg-low":
+          return dataSource.aggregations = (0, import_vuu_utils7.setAggregations)(dataSource.aggregations, column, Low), true;
+        case "agg-count":
+          return dataSource.aggregations = (0, import_vuu_utils7.setAggregations)(dataSource.aggregations, column, Count), true;
+        case "agg-distinct":
+          return dataSource.aggregations = (0, import_vuu_utils7.setAggregations)(dataSource.aggregations, column, Distinct), true;
+        case "agg-sum":
+          return dataSource.aggregations = (0, import_vuu_utils7.setAggregations)(dataSource.aggregations, column, Sum), true;
+        case "column-pin-floating":
+          return onPersistentColumnOperation({ type: "pinColumn", column, pin: "floating" }), true;
+        case "column-pin-left":
+          return onPersistentColumnOperation({ type: "pinColumn", column, pin: "left" }), true;
+        case "column-pin-right":
+          return onPersistentColumnOperation({ type: "pinColumn", column, pin: "right" }), true;
+        case "column-unpin":
+          return onPersistentColumnOperation({ type: "pinColumn", column, pin: void 0 }), true;
+        case "column-settings":
+          return onPersistentColumnOperation({ type: "columnSettings", column }), true;
+        case "table-settings":
+          return onPersistentColumnOperation({ type: "tableSettings" }), true;
+        default:
+      }
+    }
+    return false;
+  };
+  return handleContextMenuAction;
+};
+
+// src/table-config.ts
+var updateTableConfig = (config, action) => {
+  switch (action.type) {
+    case "col-size":
+      return {
+        ...config,
+        columns: config.columns.map(
+          (col) => col.name === action.column.name ? { ...col, width: action.width } : col
+        )
+      };
+    case "column-prop":
+      return {
+        ...config,
+        columns: config.columns.map(
+          (col) => col.name === action.column.name ? { ...col, [action.property]: action.value } : col
+        )
+      };
+    default:
+      return config;
+  }
+};
+
+// src/useCellEditing.ts
+var import_vuu_utils8 = require("@vuu-ui/vuu-utils");
+var import_react13 = require("react");
+
+// src/table-dom-utils.ts
+var headerCellQuery = (colIdx) => `.vuuTable-col-headers .vuuTableHeaderCell:nth-child(${colIdx})`;
+var dataCellQuery = (rowIdx, colIdx) => `.vuuTable-body > [aria-rowindex='${rowIdx}'] > [role='cell']:nth-child(${colIdx + 1})`;
+var getTableCell = (containerRef, [rowIdx, colIdx]) => {
+  var _a;
+  const cssQuery = rowIdx === -1 ? headerCellQuery(colIdx) : dataCellQuery(rowIdx, colIdx);
+  const cell = (_a = containerRef.current) == null ? void 0 : _a.querySelector(
+    cssQuery
+  );
+  if (cellIsEditable(cell)) {
+    const focusableContent = cell.querySelector("button");
+    return focusableContent || cell;
+  } else {
+    return cell;
+  }
+};
+var cellIsEditable = (cell) => cell.classList.contains("vuuTableCell-editable");
+var cellIsTextInput = (cell) => cell.querySelector(".vuuTableInputCell") !== null;
+function getRowIndex(rowEl) {
+  if (rowEl) {
+    const idx = rowEl.ariaRowIndex;
+    if (idx !== null) {
+      return parseInt(idx, 10);
+    }
+  }
+  return -1;
+}
+var closestRow = (el) => el.closest('[role="row"]');
+var closestRowIndex = (el) => getRowIndex(closestRow(el));
+
+// src/useCellEditing.ts
+var useCellEditing = ({ navigate }) => {
+  const commitHandler = (0, import_react13.useCallback)(() => {
+    navigate();
+  }, [navigate]);
+  const editInput = (0, import_react13.useCallback)(
+    (evt) => {
+      const cellEl = evt.target;
+      const input = cellEl.matches("input") ? cellEl : cellEl.querySelector("input");
+      if (input) {
+        input.focus();
+        input.select();
+      }
+    },
+    []
+  );
+  const focusInput = (0, import_react13.useCallback)(
+    (evt) => {
+      const cellEl = evt.target;
+      const input = cellEl.querySelector("input");
+      if (input) {
+        input.focus();
+        input.select();
+      }
+    },
+    []
+  );
+  const handleKeyDown = (0, import_react13.useCallback)(
+    (e) => {
+      const el = e.target;
+      if (cellIsTextInput(el)) {
+        if ((0, import_vuu_utils8.isCharacterKey)(e.key)) {
+          editInput(e);
+        } else if (e.key === "Enter") {
+          focusInput(e);
+        }
+      }
+    },
+    [editInput, focusInput]
+  );
+  const handleDoubleClick = (0, import_react13.useCallback)(
+    (e) => {
+      const el = e.target;
+      if (el.matches("input") || el.querySelector("input")) {
+        editInput(e);
+        e.stopPropagation();
+      }
+    },
+    [editInput]
+  );
+  const handleBlur = (0, import_react13.useCallback)(
+    (e) => {
+      const el = e.target;
+      el.removeEventListener("vuu-commit", commitHandler, true);
+    },
+    [commitHandler]
+  );
+  const handleFocus = (0, import_react13.useCallback)(
+    (e) => {
+      const el = e.target;
+      el.addEventListener("vuu-commit", commitHandler, true);
+    },
+    [commitHandler]
+  );
+  return {
+    onBlur: handleBlur,
+    onDoubleClick: handleDoubleClick,
+    onFocus: handleFocus,
+    onKeyDown: handleKeyDown
+  };
+};
+
+// src/useDataSource.ts
+var import_vuu_data = require("@vuu-ui/vuu-data");
+var import_vuu_utils10 = require("@vuu-ui/vuu-utils");
+var import_react14 = require("react");
+
+// src/moving-window.ts
+var import_vuu_utils9 = require("@vuu-ui/vuu-utils");
+var { SELECTED: SELECTED2 } = import_vuu_utils9.metadataKeys;
+var MovingWindow = class {
+  constructor({ from, to }) {
+    this.rowCount = 0;
+    this.setRowCount = (rowCount) => {
+      if (rowCount < this.data.length) {
+        this.data.length = rowCount;
+      }
+      this.rowCount = rowCount;
+    };
+    this.range = new import_vuu_utils9.WindowRange(from, to);
+    this.data = new Array(Math.max(0, to - from));
+    this.rowCount = 0;
+  }
+  add(data) {
+    const [index] = data;
+    if (this.isWithinRange(index)) {
+      const internalIndex = index - this.range.from;
+      this.data[internalIndex] = data;
+      if (data[SELECTED2]) {
+        const previousRow = this.data[internalIndex - 1];
+        if ((0, import_vuu_utils9.isRowSelectedLast)(previousRow)) {
+          this.data[internalIndex - 1] = previousRow.slice();
+          this.data[internalIndex - 1][SELECTED2] -= 4;
+        }
+      }
+    }
+  }
+  getAtIndex(index) {
+    return this.range.isWithin(index) && this.data[index - this.range.from] != null ? this.data[index - this.range.from] : void 0;
+  }
+  isWithinRange(index) {
+    return this.range.isWithin(index);
+  }
+  setRange({ from, to }) {
+    if (from !== this.range.from || to !== this.range.to) {
+      const [overlapFrom, overlapTo] = this.range.overlap(from, to);
+      const newData = new Array(Math.max(0, to - from));
+      for (let i = overlapFrom; i < overlapTo; i++) {
+        const data = this.getAtIndex(i);
+        if (data) {
+          const index = i - from;
+          newData[index] = data;
+        }
+      }
+      this.data = newData;
+      this.range.from = from;
+      this.range.to = to;
+    }
+  }
+  getSelectedRows() {
+    return this.data.filter((row) => row[SELECTED2] !== 0);
+  }
+};
+
+// src/useDataSource.ts
+var useDataSource = ({
+  dataSource,
+  onFeatureInvocation,
+  onSizeChange,
+  onSubscribed,
+  range = import_vuu_utils10.NULL_RANGE,
+  renderBufferSize = 0
+}) => {
+  const [, forceUpdate] = (0, import_react14.useState)(null);
+  const data = (0, import_react14.useRef)([]);
+  const isMounted = (0, import_react14.useRef)(true);
+  const hasUpdated = (0, import_react14.useRef)(false);
+  const rangeRef = (0, import_react14.useRef)(import_vuu_utils10.NULL_RANGE);
+  const dataWindow = (0, import_react14.useMemo)(
+    () => new MovingWindow((0, import_vuu_utils10.getFullRange)(range, renderBufferSize)),
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    []
+  );
+  const setData = (0, import_react14.useCallback)(
+    (updates) => {
+      for (const row of updates) {
+        dataWindow.add(row);
+      }
+      data.current = dataWindow.data;
+      if (isMounted.current) {
+        forceUpdate({});
+      } else {
+        console.log(`ignore update as we're not mounted`);
+      }
+    },
+    [dataWindow]
+  );
+  const datasourceMessageHandler = (0, import_react14.useCallback)(
+    (message) => {
+      if (message.type === "subscribed") {
+        onSubscribed == null ? void 0 : onSubscribed(message);
+      } else if (message.type === "viewport-update") {
+        if (typeof message.size === "number") {
+          onSizeChange == null ? void 0 : onSizeChange(message.size);
+          dataWindow.setRowCount(message.size);
+        }
+        if (message.rows) {
+          setData(message.rows);
+        } else if (typeof message.size === "number") {
+          data.current = dataWindow.data;
+          hasUpdated.current = true;
+        }
+      } else if ((0, import_vuu_data.isVuuFeatureInvocation)(message)) {
+        onFeatureInvocation == null ? void 0 : onFeatureInvocation(message);
+      } else {
+        console.log(`useDataSource unexpected message ${message.type}`);
+      }
+    },
+    [dataWindow, onFeatureInvocation, onSizeChange, onSubscribed, setData]
+  );
+  const getSelectedRows = (0, import_react14.useCallback)(() => {
+    return dataWindow.getSelectedRows();
+  }, [dataWindow]);
+  (0, import_react14.useEffect)(() => {
+    var _a;
+    isMounted.current = true;
+    (_a = dataSource.resume) == null ? void 0 : _a.call(dataSource);
+    return () => {
+      var _a2;
+      isMounted.current = false;
+      (_a2 = dataSource.suspend) == null ? void 0 : _a2.call(dataSource);
+    };
+  }, [dataSource]);
+  (0, import_react14.useEffect)(() => {
+    var _a;
+    if (dataSource.status === "disabled") {
+      (_a = dataSource.enable) == null ? void 0 : _a.call(dataSource, datasourceMessageHandler);
+    } else {
+      dataSource == null ? void 0 : dataSource.subscribe(
+        { range: (0, import_vuu_utils10.getFullRange)(range, renderBufferSize) },
+        datasourceMessageHandler
+      );
+    }
+  }, [dataSource, datasourceMessageHandler, range, renderBufferSize]);
+  const setRange = (0, import_react14.useCallback)(
+    (range2) => {
+      const fullRange = (0, import_vuu_utils10.getFullRange)(range2, renderBufferSize);
+      dataWindow.setRange(fullRange);
+      dataSource.range = rangeRef.current = fullRange;
+      dataSource.emit("range", range2);
+    },
+    [dataSource, dataWindow, renderBufferSize]
+  );
+  return {
+    data: data.current,
+    dataRef: data,
+    getSelectedRows,
+    range: rangeRef.current,
+    setRange
+  };
+};
+
+// src/useInitialValue.ts
+var import_react15 = require("react");
+var useInitialValue = (value) => {
+  const ref = (0, import_react15.useRef)(value);
+  return (0, import_react15.useMemo)(() => ref.current, []);
+};
+
+// src/useKeyboardNavigation.ts
+var import_core = require("@salt-ds/core");
+var import_react16 = require("react");
+var rowNavigationKeys = /* @__PURE__ */ new Set([
+  "Home",
+  "End",
+  "PageUp",
+  "PageDown",
+  "ArrowDown",
+  "ArrowUp"
+]);
+var cellNavigationKeys = new Set(rowNavigationKeys);
+cellNavigationKeys.add("ArrowLeft");
+cellNavigationKeys.add("ArrowRight");
+var isNavigationKey = (key, navigationStyle) => {
+  switch (navigationStyle) {
+    case "cell":
+      return cellNavigationKeys.has(key);
+    case "row":
+      return rowNavigationKeys.has(key);
+    default:
+      return false;
+  }
+};
+var PageKeys = ["Home", "End", "PageUp", "PageDown"];
+var isPagingKey = (key) => PageKeys.includes(key);
+var NULL_CELL_POS = [-1, -1];
+var NO_SCROLL_NECESSARY = [void 0, void 0];
+var howFarIsRowOutsideViewport = (rowEl, contentContainer = rowEl.closest(".vuuTable-contentContainer")) => {
+  if (contentContainer) {
+    const viewport = contentContainer == null ? void 0 : contentContainer.getBoundingClientRect();
+    const row = rowEl.getBoundingClientRect();
+    if (row) {
+      if (row.bottom > viewport.bottom) {
+        return ["down", row.bottom - viewport.bottom];
+      } else if (row.top < viewport.top) {
+        return ["up", row.top - viewport.top];
+      } else {
+        return NO_SCROLL_NECESSARY;
+      }
+    } else {
+      throw Error("Whats going on, row not found");
+    }
+  } else {
+    throw Error("Whats going on, scrollbar container not found");
+  }
+};
+var howFarIsCellOutsideViewport = (cellEl) => {
+  var _a;
+  const contentContainer = cellEl.closest(".vuuTable-contentContainer");
+  if (contentContainer) {
+    const rowEl = cellEl.closest(".vuuTableRow");
+    if (rowEl) {
+      const result = howFarIsRowOutsideViewport(rowEl, contentContainer);
+      if (result !== NO_SCROLL_NECESSARY) {
+        return result;
+      }
+      const viewport = contentContainer == null ? void 0 : contentContainer.getBoundingClientRect();
+      const cell = (_a = cellEl.closest(".vuuTableCell")) == null ? void 0 : _a.getBoundingClientRect();
+      if (cell) {
+        if (cell.right > viewport.right) {
+          return ["right", cell.right + 6 - viewport.right];
+        } else if (cell.left < viewport.left) {
+          return ["left", cell.left - viewport.left];
+        }
+      } else {
+        throw Error("Whats going on, cell not found");
+      }
+    }
+  }
+  return NO_SCROLL_NECESSARY;
+};
+function nextCellPos(key, [rowIdx, colIdx], columnCount, rowCount) {
+  if (key === "ArrowUp") {
+    if (rowIdx > -1) {
+      return [rowIdx - 1, colIdx];
+    } else {
+      return [rowIdx, colIdx];
+    }
+  } else if (key === "ArrowDown") {
+    if (rowIdx === -1) {
+      return [0, colIdx];
+    } else if (rowIdx === rowCount - 1) {
+      return [rowIdx, colIdx];
+    } else {
+      return [rowIdx + 1, colIdx];
+    }
+  } else if (key === "ArrowRight") {
+    if (colIdx < columnCount) {
+      return [rowIdx, colIdx + 1];
+    } else {
+      return [rowIdx, colIdx];
+    }
+  } else if (key === "ArrowLeft") {
+    if (colIdx > 1) {
+      return [rowIdx, colIdx - 1];
+    } else {
+      return [rowIdx, colIdx];
+    }
+  }
+  return [rowIdx, colIdx];
+}
+var useKeyboardNavigation = ({
+  columnCount = 0,
+  containerRef,
+  disableFocus = false,
+  defaultHighlightedIndex,
+  disableHighlightOnFocus,
+  highlightedIndex: highlightedIndexProp,
+  navigationStyle,
+  requestScroll,
+  onHighlight,
+  rowCount = 0,
+  viewportRowCount
+}) => {
+  var _a;
+  const focusedCellPos = (0, import_react16.useRef)([-1, -1]);
+  const focusableCell = (0, import_react16.useRef)();
+  const activeCellPos = (0, import_react16.useRef)([-1, 0]);
+  const highlightedIndexRef = (0, import_react16.useRef)();
+  const [highlightedIndex, setHighlightedIdx] = (0, import_core.useControlled)({
+    controlled: highlightedIndexProp,
+    default: defaultHighlightedIndex,
+    name: "UseKeyboardNavigation"
+  });
+  highlightedIndexRef.current = highlightedIndex;
+  const setHighlightedIndex = (0, import_react16.useCallback)(
+    (idx, fromKeyboard = false) => {
+      onHighlight == null ? void 0 : onHighlight(idx);
+      setHighlightedIdx(idx);
+      if (fromKeyboard) {
+      }
+    },
+    [onHighlight, setHighlightedIdx]
+  );
+  const getFocusedCell = (element) => element == null ? void 0 : element.closest(
+    "[role='columnHeader'],[role='cell']"
+  );
+  const getTableCellPos = (tableCell) => {
+    var _a2, _b;
+    if (tableCell.role === "columnHeader") {
+      const colIdx = parseInt((_a2 = tableCell.dataset.idx) != null ? _a2 : "-1", 10);
+      return [-1, colIdx];
+    } else {
+      const focusedRow = tableCell.closest("[role='row']");
+      if (focusedRow) {
+        const rowIdx = parseInt((_b = focusedRow.ariaRowIndex) != null ? _b : "-1", 10);
+        const colIdx = Array.from(focusedRow.childNodes).indexOf(tableCell);
+        return [rowIdx, colIdx];
+      }
+    }
+    return NULL_CELL_POS;
+  };
+  const focusCell = (0, import_react16.useCallback)(
+    (cellPos) => {
+      var _a2;
+      if (containerRef.current) {
+        const activeCell = getTableCell(containerRef, cellPos);
+        if (activeCell) {
+          if (activeCell !== focusableCell.current) {
+            (_a2 = focusableCell.current) == null ? void 0 : _a2.removeAttribute("tabindex");
+            focusableCell.current = activeCell;
+            activeCell.setAttribute("tabindex", "0");
+          }
+          const [direction, distance] = howFarIsCellOutsideViewport(activeCell);
+          if (direction && distance) {
+            requestScroll == null ? void 0 : requestScroll({ type: "scroll-distance", distance, direction });
+          }
+          console.log(`activeCell focus`);
+          activeCell.focus({ preventScroll: true });
+        }
+      }
+    },
+    // TODO we recreate this function whenever viewportRange changes, which will
+    // be often whilst scrolling - store range in a a ref ?
+    [containerRef, requestScroll]
+  );
+  const setActiveCell = (0, import_react16.useCallback)(
+    (rowIdx, colIdx, fromKeyboard = false) => {
+      const pos = [rowIdx, colIdx];
+      activeCellPos.current = pos;
+      if (navigationStyle === "row") {
+        setHighlightedIdx(rowIdx);
+      } else {
+        focusCell(pos);
+      }
+      if (fromKeyboard) {
+        focusedCellPos.current = pos;
+      }
+    },
+    [focusCell, navigationStyle, setHighlightedIdx]
+  );
+  const nextPageItemIdx = (0, import_react16.useCallback)(
+    (key, [rowIdx, colIdx]) => new Promise((resolve) => {
+      let newRowIdx = rowIdx;
+      switch (key) {
+        case "PageDown":
+          newRowIdx = Math.min(rowCount - 1, rowIdx + viewportRowCount);
+          requestScroll == null ? void 0 : requestScroll({ type: "scroll-page", direction: "down" });
+          break;
+        case "PageUp":
+          newRowIdx = Math.max(0, rowIdx - viewportRowCount);
+          requestScroll == null ? void 0 : requestScroll({ type: "scroll-page", direction: "up" });
+          break;
+        case "Home":
+          newRowIdx = 0;
+          requestScroll == null ? void 0 : requestScroll({ type: "scroll-end", direction: "home" });
+          break;
+        case "End":
+          newRowIdx = rowCount - 1;
+          requestScroll == null ? void 0 : requestScroll({ type: "scroll-end", direction: "end" });
+          break;
+      }
+      setTimeout(() => {
+        resolve([newRowIdx, colIdx]);
+      }, 90);
+    }),
+    [requestScroll, rowCount, viewportRowCount]
+  );
+  const handleFocus = (0, import_react16.useCallback)(() => {
+    var _a2;
+    if (disableHighlightOnFocus !== true) {
+      if ((_a2 = containerRef.current) == null ? void 0 : _a2.contains(document.activeElement)) {
+        const focusedCell = getFocusedCell(document.activeElement);
+        if (focusedCell) {
+          focusedCellPos.current = getTableCellPos(focusedCell);
+          if (navigationStyle === "row") {
+            setHighlightedIdx(focusedCellPos.current[0]);
+          }
+        }
+      }
+    }
+  }, [
+    disableHighlightOnFocus,
+    containerRef,
+    navigationStyle,
+    setHighlightedIdx
+  ]);
+  const navigateChildItems = (0, import_react16.useCallback)(
+    async (key) => {
+      const [nextRowIdx, nextColIdx] = isPagingKey(key) ? await nextPageItemIdx(key, activeCellPos.current) : nextCellPos(key, activeCellPos.current, columnCount, rowCount);
+      const [rowIdx, colIdx] = activeCellPos.current;
+      if (nextRowIdx !== rowIdx || nextColIdx !== colIdx) {
+        setActiveCell(nextRowIdx, nextColIdx, true);
+      }
+    },
+    [columnCount, nextPageItemIdx, rowCount, setActiveCell]
+  );
+  const scrollRowIntoViewIfNecessary = (0, import_react16.useCallback)(
+    (rowIndex) => {
+      const { current: container } = containerRef;
+      const activeRow = container == null ? void 0 : container.querySelector(
+        `[aria-rowindex="${rowIndex}"]`
+      );
+      if (activeRow) {
+        const [direction, distance] = howFarIsRowOutsideViewport(activeRow);
+        if (direction && distance) {
+          requestScroll == null ? void 0 : requestScroll({ type: "scroll-distance", distance, direction });
+        }
+      }
+    },
+    [containerRef, requestScroll]
+  );
+  const moveHighlightedRow = (0, import_react16.useCallback)(
+    async (key) => {
+      const { current: highlighted } = highlightedIndexRef;
+      const [nextRowIdx] = isPagingKey(key) ? await nextPageItemIdx(key, [highlighted != null ? highlighted : -1, 0]) : nextCellPos(key, [highlighted != null ? highlighted : -1, 0], columnCount, rowCount);
+      if (nextRowIdx !== highlighted) {
+        setHighlightedIndex(nextRowIdx);
+        scrollRowIntoViewIfNecessary(nextRowIdx);
+      }
+    },
+    [
+      columnCount,
+      nextPageItemIdx,
+      rowCount,
+      scrollRowIntoViewIfNecessary,
+      setHighlightedIndex
+    ]
+  );
+  (0, import_react16.useEffect)(() => {
+    if (highlightedIndexProp !== void 0 && highlightedIndexProp !== -1) {
+      scrollRowIntoViewIfNecessary(highlightedIndexProp);
+    }
+  }, [highlightedIndexProp, scrollRowIntoViewIfNecessary]);
+  const handleKeyDown = (0, import_react16.useCallback)(
+    (e) => {
+      if (rowCount > 0 && isNavigationKey(e.key, navigationStyle)) {
+        e.preventDefault();
+        e.stopPropagation();
+        if (navigationStyle === "row") {
+          moveHighlightedRow(e.key);
+        } else {
+          void navigateChildItems(e.key);
+        }
+      }
+    },
+    [rowCount, navigationStyle, moveHighlightedRow, navigateChildItems]
+  );
+  const handleClick = (0, import_react16.useCallback)(
+    // Might not be a cell e.g the Settings button
+    (evt) => {
+      const target = evt.target;
+      const focusedCell = getFocusedCell(target);
+      if (focusedCell) {
+        const [rowIdx, colIdx] = getTableCellPos(focusedCell);
+        setActiveCell(rowIdx, colIdx);
+      }
+    },
+    [setActiveCell]
+  );
+  const handleMouseLeave = (0, import_react16.useCallback)(() => {
+    setHighlightedIndex(-1);
+  }, [setHighlightedIndex]);
+  const handleMouseMove = (0, import_react16.useCallback)(
+    (evt) => {
+      const idx = closestRowIndex(evt.target);
+      if (idx !== -1 && idx !== highlightedIndexRef.current) {
+        setHighlightedIndex(idx);
+      }
+    },
+    [setHighlightedIndex]
+  );
+  const navigate = (0, import_react16.useCallback)(() => {
+    navigateChildItems("ArrowDown");
+  }, [navigateChildItems]);
+  const fullyRendered = ((_a = containerRef.current) == null ? void 0 : _a.firstChild) != null;
+  (0, import_react16.useEffect)(() => {
+    if (fullyRendered && focusableCell.current === void 0 && !disableFocus) {
+      const { current: container } = containerRef;
+      const cell = (container == null ? void 0 : container.querySelector(headerCellQuery(0))) || (container == null ? void 0 : container.querySelector(dataCellQuery(0, 0)));
+      if (cell) {
+        cell.setAttribute("tabindex", "0");
+        focusableCell.current = cell;
+      }
+    }
+  }, [containerRef, disableFocus, fullyRendered]);
+  return {
+    highlightedIndexRef,
+    navigate,
+    onClick: handleClick,
+    onFocus: handleFocus,
+    onKeyDown: handleKeyDown,
+    onMouseLeave: navigationStyle === "row" ? handleMouseLeave : void 0,
+    onMouseMove: navigationStyle === "row" ? handleMouseMove : void 0
+  };
+};
+
+// src/useSelection.ts
+var import_vuu_utils11 = require("@vuu-ui/vuu-utils");
+var import_react17 = require("react");
+var { IDX: IDX2 } = import_vuu_utils11.metadataKeys;
+var NO_SELECTION = [];
+var defaultSelectionKeys = ["Enter", " "];
+var useSelection = ({
+  highlightedIndexRef,
+  selectionKeys = defaultSelectionKeys,
+  selectionModel,
+  onSelect,
+  onSelectionChange
+}) => {
+  selectionModel === "extended" || selectionModel === "checkbox";
+  const lastActiveRef = (0, import_react17.useRef)(-1);
+  const selectedRef = (0, import_react17.useRef)(NO_SELECTION);
+  const isSelectionEvent = (0, import_react17.useCallback)(
+    (evt) => selectionKeys.includes(evt.key),
+    [selectionKeys]
+  );
+  const handleRowClick = (0, import_react17.useCallback)(
+    (row, rangeSelect, keepExistingSelection) => {
+      const { [IDX2]: idx } = row;
+      const { current: active } = lastActiveRef;
+      const { current: selected } = selectedRef;
+      const selectOperation = (0, import_vuu_utils11.isRowSelected)(row) ? import_vuu_utils11.deselectItem : import_vuu_utils11.selectItem;
+      const newSelected = selectOperation(
+        selectionModel,
+        selected,
+        idx,
+        rangeSelect,
+        keepExistingSelection,
+        active
+      );
+      selectedRef.current = newSelected;
+      lastActiveRef.current = idx;
+      onSelect == null ? void 0 : onSelect(row);
+      onSelectionChange == null ? void 0 : onSelectionChange(newSelected);
+    },
+    [onSelect, onSelectionChange, selectionModel]
+  );
+  const handleKeyDown = (0, import_react17.useCallback)(
+    (e) => {
+      if (isSelectionEvent(e)) {
+        const { current: rowIndex } = highlightedIndexRef;
+        if (rowIndex !== void 0 && rowIndex !== -1) {
+          const rowEl = e.target.querySelector(
+            `[aria-rowindex="${rowIndex}"]`
+          );
+          if (rowEl) {
+            (0, import_vuu_utils11.dispatchMouseEvent)(rowEl, "click");
+          }
+        }
+      }
+    },
+    [highlightedIndexRef, isSelectionEvent]
+  );
+  return {
+    onKeyDown: handleKeyDown,
+    onRowClick: handleRowClick
+  };
+};
+
+// src/useTableContextMenu.ts
+var import_vuu_popups2 = require("@vuu-ui/vuu-popups");
+var import_vuu_utils12 = require("@vuu-ui/vuu-utils");
+var import_react18 = require("react");
+var NO_ROWS = [];
+var useTableContextMenu = ({
+  columns,
+  data,
+  dataSource,
+  getSelectedRows
+}) => {
+  const [showContextMenu] = (0, import_vuu_popups2.useContextMenu)();
+  const onContextMenu = (0, import_react18.useCallback)(
+    (evt) => {
+      var _a;
+      const target = evt.target;
+      const cellEl = target == null ? void 0 : target.closest("div[role='cell']");
+      const rowEl = target == null ? void 0 : target.closest("div[role='row']");
+      if (cellEl && rowEl) {
+        const { selectedRowsCount } = dataSource;
+        const columnMap = (0, import_vuu_utils12.buildColumnMap)(columns);
+        const rowIndex = parseInt((_a = rowEl.ariaRowIndex) != null ? _a : "-1");
+        const cellIndex = Array.from(rowEl.childNodes).indexOf(cellEl);
+        const row = data.find(([idx]) => idx === rowIndex);
+        const columnName = columns[cellIndex];
+        showContextMenu(evt, "grid", {
+          columnMap,
+          columnName,
+          row,
+          selectedRows: selectedRowsCount === 0 ? NO_ROWS : getSelectedRows(),
+          viewport: dataSource.viewport
+        });
+      }
+    },
+    [columns, data, dataSource, getSelectedRows, showContextMenu]
+  );
+  return onContextMenu;
+};
+
+// src/useTableModel.ts
+var import_vuu_utils13 = require("@vuu-ui/vuu-utils");
+var import_vuu_ui_controls = require("@vuu-ui/vuu-ui-controls");
+var import_react19 = require("react");
+var { info } = (0, import_vuu_utils13.logger)("useTableModel");
+var DEFAULT_COLUMN_WIDTH = 100;
+var KEY_OFFSET = import_vuu_utils13.metadataKeys.count;
+var columnWithoutDataType = ({ serverDataType }) => serverDataType === void 0;
+var getDataType = (column, tableSchema) => {
+  const schemaColumn = tableSchema == null ? void 0 : tableSchema.columns.find(
+    ({ name }) => name === column.name
+  );
+  if (schemaColumn) {
+    return schemaColumn.serverDataType;
+  } else {
+    return column.serverDataType;
+  }
+};
+var numericTypes = ["int", "long", "double"];
+var getDefaultAlignment = (serverDataType) => serverDataType === void 0 ? void 0 : numericTypes.includes(serverDataType) ? "right" : "left";
+var isShowColumnSettings = (action) => action.type === "columnSettings";
+var isShowTableSettings = (action) => action.type === "tableSettings";
+var columnReducer = (state, action) => {
+  info == null ? void 0 : info(`TableModelReducer ${action.type}`);
+  switch (action.type) {
+    case "init":
+      return init(action);
+    case "moveColumn":
+      return moveColumn(state, action);
+    case "resizeColumn":
+      return resizeColumn(state, action);
+    case "setTableSchema":
+      return setTableSchema(state, action);
+    case "hideColumns":
+      return hideColumns(state, action);
+    case "showColumns":
+      return showColumns(state, action);
+    case "pinColumn":
+      return pinColumn2(state, action);
+    case "updateColumnProp":
+      return updateColumnProp(state, action);
+    case "tableConfig":
+      return updateTableConfig2(state, action);
+    default:
+      console.log(`unhandled action ${action.type}`);
+      return state;
+  }
+};
+var useTableModel = (tableConfigProp, dataSource) => {
+  const [state, dispatchColumnAction] = (0, import_react19.useReducer)(columnReducer, { tableConfig: tableConfigProp, dataSource }, init);
+  const { columns, headings, tableConfig, ...tableAttributes } = state;
+  return {
+    columns,
+    dispatchColumnAction,
+    headings,
+    tableAttributes,
+    tableConfig
+  };
+};
+function init({ dataSource, tableConfig }) {
+  const { columns, ...tableAttributes } = tableConfig;
+  console.log(JSON.stringify(tableAttributes, null, 2));
+  const { config: dataSourceConfig, tableSchema } = dataSource;
+  const runtimeColumns = columns.filter((0, import_vuu_utils13.subscribedOnly)(dataSourceConfig == null ? void 0 : dataSourceConfig.columns)).map(
+    columnDescriptorToRuntimeColumDescriptor(tableAttributes, tableSchema)
+  );
+  const maybePinnedColumns = runtimeColumns.some(import_vuu_utils13.isPinned) ? (0, import_vuu_utils13.sortPinnedColumns)(runtimeColumns) : runtimeColumns;
+  let state = {
+    columns: maybePinnedColumns,
+    headings: (0, import_vuu_utils13.getTableHeadings)(maybePinnedColumns),
+    tableConfig,
+    ...tableAttributes
+  };
+  if (dataSourceConfig) {
+    const { columns: _, ...rest } = dataSourceConfig;
+    state = updateTableConfig2(state, {
+      type: "tableConfig",
+      ...rest
+    });
+  }
+  return state;
+}
+var getLabel = (label, columnFormatHeader) => {
+  if (columnFormatHeader === "uppercase") {
+    return label.toUpperCase();
+  } else if (columnFormatHeader === "capitalize") {
+    return label[0].toUpperCase() + label.slice(1).toLowerCase();
+  }
+  return label;
+};
+var columnDescriptorToRuntimeColumDescriptor = (tableAttributes, tableSchema) => (column, index) => {
+  const { columnDefaultWidth = DEFAULT_COLUMN_WIDTH, columnFormatHeader } = tableAttributes;
+  const serverDataType = getDataType(column, tableSchema);
+  const {
+    align = getDefaultAlignment(serverDataType),
+    key,
+    name,
+    label = (0, import_vuu_utils13.getColumnLabel)(column),
+    width = columnDefaultWidth,
+    ...rest
+  } = column;
+  const runtimeColumnWithDefaults = {
+    ...rest,
+    align,
+    CellRenderer: (0, import_vuu_utils13.getCellRenderer)(column),
+    HeaderCellLabelRenderer: (0, import_vuu_utils13.getCellRenderer)(column, "col-label"),
+    HeaderCellContentRenderer: (0, import_vuu_utils13.getCellRenderer)(column, "col-content"),
+    clientSideEditValidationCheck: (0, import_vuu_utils13.hasValidationRules)(column.type) ? (0, import_vuu_ui_controls.buildValidationChecker)(column.type.renderer.rules) : void 0,
+    label: getLabel(label, columnFormatHeader),
+    key: key != null ? key : index + KEY_OFFSET,
+    name,
+    originalIdx: index,
+    serverDataType,
+    valueFormatter: (0, import_vuu_utils13.getValueFormatter)(column, serverDataType),
+    width
+  };
+  if ((0, import_vuu_utils13.isGroupColumn)(runtimeColumnWithDefaults)) {
+    runtimeColumnWithDefaults.columns = runtimeColumnWithDefaults.columns.map(
+      (col) => columnDescriptorToRuntimeColumDescriptor(tableAttributes)(
+        col,
+        col.key
+      )
+    );
+  }
+  return runtimeColumnWithDefaults;
+};
+function moveColumn(state, { column, moveBy }) {
+  const { columns } = state;
+  if (typeof moveBy === "number") {
+    const idx = columns.indexOf(column);
+    const newColumns = columns.slice();
+    const [movedColumns] = newColumns.splice(idx, 1);
+    newColumns.splice(idx + moveBy, 0, movedColumns);
+    return {
+      ...state,
+      columns: newColumns
+    };
+  }
+  return state;
+}
+function hideColumns(state, { columns }) {
+  if (columns.some((col) => col.hidden !== true)) {
+    return columns.reduce((s, c) => {
+      if (c.hidden !== true) {
+        return updateColumnProp(s, {
+          type: "updateColumnProp",
+          column: c,
+          hidden: true
+        });
+      } else {
+        return s;
+      }
+    }, state);
+  } else {
+    return state;
+  }
+}
+function showColumns(state, { columns }) {
+  if (columns.some((col) => col.hidden)) {
+    return columns.reduce((s, c) => {
+      if (c.hidden) {
+        return updateColumnProp(s, {
+          type: "updateColumnProp",
+          column: c,
+          hidden: false
+        });
+      } else {
+        return s;
+      }
+    }, state);
+  } else {
+    return state;
+  }
+}
+function resizeColumn(state, { column, phase, width }) {
+  const type = "updateColumnProp";
+  const resizing = phase !== "end";
+  switch (phase) {
+    case "begin":
+      return updateColumnProp(state, { type, column, resizing });
+    case "end":
+      return updateColumnProp(state, { type, column, resizing, width });
+    case "resize":
+      return updateColumnProp(state, { type, column, width });
+    default:
+      throw Error(`useTableModel.resizeColumn, invalid resizePhase ${phase}`);
+  }
+}
+function setTableSchema(state, { tableSchema }) {
+  const { columns } = state;
+  if (columns.some(columnWithoutDataType)) {
+    const cols = columns.map((column) => {
+      var _a;
+      const serverDataType = getDataType(column, tableSchema);
+      return {
+        ...column,
+        align: (_a = column.align) != null ? _a : getDefaultAlignment(serverDataType),
+        serverDataType
+      };
+    });
+    return {
+      ...state,
+      columns: cols
+    };
+  } else {
+    return state;
+  }
+}
+function pinColumn2(state, action) {
+  let { columns } = state;
+  const { column, pin } = action;
+  const targetColumn = columns.find((col) => col.name === column.name);
+  if (targetColumn) {
+    columns = (0, import_vuu_utils13.replaceColumn)(columns, { ...targetColumn, pin });
+    columns = (0, import_vuu_utils13.sortPinnedColumns)(columns);
+    return {
+      ...state,
+      columns
+    };
+  } else {
+    return state;
+  }
+}
+function updateColumnProp(state, action) {
+  let { columns, tableConfig } = state;
+  const { align, column, hidden, label, resizing, width } = action;
+  const targetColumn = columns.find((col) => col.name === column.name);
+  if (targetColumn) {
+    if (align === "left" || align === "right") {
+      columns = (0, import_vuu_utils13.replaceColumn)(columns, { ...targetColumn, align });
+    }
+    if (typeof label === "string") {
+      columns = (0, import_vuu_utils13.replaceColumn)(columns, { ...targetColumn, label });
+    }
+    if (typeof resizing === "boolean") {
+      columns = (0, import_vuu_utils13.replaceColumn)(columns, { ...targetColumn, resizing });
+    }
+    if (typeof hidden === "boolean") {
+      columns = (0, import_vuu_utils13.replaceColumn)(columns, { ...targetColumn, hidden });
+    }
+    if (typeof width === "number") {
+      columns = (0, import_vuu_utils13.replaceColumn)(columns, { ...targetColumn, width });
+      const targetConfigColumn = tableConfig.columns.find(
+        (col) => col.name === column.name
+      );
+      if (targetConfigColumn) {
+        tableConfig = {
+          ...tableConfig,
+          columns: (0, import_vuu_utils13.replaceColumn)(tableConfig.columns, {
+            ...targetConfigColumn,
+            width
+          })
+        };
+      }
+    }
+  }
+  return {
+    ...state,
+    columns,
+    tableConfig
+  };
+}
+function updateTableConfig2(state, { confirmed, filter, groupBy, sort }) {
+  const hasGroupBy = groupBy !== void 0;
+  const hasFilter = typeof (filter == null ? void 0 : filter.filter) === "string";
+  const hasSort = sort && sort.sortDefs.length > 0;
+  let result = state;
+  if (hasGroupBy) {
+    result = {
+      ...state,
+      columns: (0, import_vuu_utils13.applyGroupByToColumns)(result.columns, groupBy, confirmed)
+    };
+  }
+  if (hasSort) {
+    result = {
+      ...state,
+      columns: (0, import_vuu_utils13.applySortToColumns)(result.columns, sort)
+    };
+  }
+  if (hasFilter) {
+    result = {
+      ...state,
+      columns: (0, import_vuu_utils13.applyFilterToColumns)(result.columns, filter)
+    };
+  } else if (result.columns.some(import_vuu_utils13.isFilteredColumn)) {
+    result = {
+      ...state,
+      columns: (0, import_vuu_utils13.stripFilterFromColumns)(result.columns)
+    };
+  }
+  return result;
+}
+
+// src/useTableScroll.ts
+var import_react20 = require("react");
+var getPctScroll = (container) => {
+  const { scrollLeft, scrollTop } = container;
+  const { clientHeight, clientWidth, scrollHeight, scrollWidth } = container;
+  const pctScrollLeft = scrollLeft / (scrollWidth - clientWidth);
+  const pctScrollTop = scrollTop / (scrollHeight - clientHeight);
+  return [pctScrollLeft, pctScrollTop];
+};
+var useCallbackRef = ({
+  onAttach,
+  onDetach
+}) => {
+  const ref = (0, import_react20.useRef)(null);
+  const callbackRef = (0, import_react20.useCallback)(
+    (el) => {
+      if (el) {
+        ref.current = el;
+        onAttach == null ? void 0 : onAttach(el);
+      } else if (ref.current) {
+        const { current: originalRef } = ref;
+        ref.current = el;
+        onDetach == null ? void 0 : onDetach(originalRef);
+      }
+    },
+    [onAttach, onDetach]
+  );
+  return callbackRef;
+};
+var useTableScroll = ({
+  maxScrollLeft,
+  maxScrollTop,
+  onHorizontalScroll,
+  onVerticalScroll,
+  rowHeight,
+  viewportRowCount
+}) => {
+  const contentContainerScrolledRef = (0, import_react20.useRef)(false);
+  const scrollPosRef = (0, import_react20.useRef)({ scrollTop: 0, scrollLeft: 0 });
+  const scrollbarContainerRef = (0, import_react20.useRef)(null);
+  const contentContainerRef = (0, import_react20.useRef)(null);
+  const handleScrollbarContainerScroll = (0, import_react20.useCallback)(() => {
+    const { current: contentContainer } = contentContainerRef;
+    const { current: scrollbarContainer } = scrollbarContainerRef;
+    const { current: contentContainerScrolled } = contentContainerScrolledRef;
+    if (contentContainerScrolled) {
+      contentContainerScrolledRef.current = false;
+    } else if (contentContainer && scrollbarContainer) {
+      const [pctScrollLeft, pctScrollTop] = getPctScroll(scrollbarContainer);
+      const rootScrollLeft = Math.round(pctScrollLeft * maxScrollLeft);
+      const rootScrollTop = Math.round(pctScrollTop * maxScrollTop);
+      contentContainer.scrollTo({
+        left: rootScrollLeft,
+        top: rootScrollTop,
+        behavior: "auto"
+      });
+    }
+  }, [maxScrollLeft, maxScrollTop]);
+  const handleContentContainerScroll = (0, import_react20.useCallback)(() => {
+    const { current: contentContainer } = contentContainerRef;
+    const { current: scrollbarContainer } = scrollbarContainerRef;
+    const { current: scrollPos } = scrollPosRef;
+    if (contentContainer && scrollbarContainer) {
+      const { scrollLeft, scrollTop } = contentContainer;
+      const [pctScrollLeft, pctScrollTop] = getPctScroll(contentContainer);
+      contentContainerScrolledRef.current = true;
+      scrollbarContainer.scrollLeft = Math.round(pctScrollLeft * maxScrollLeft);
+      scrollbarContainer.scrollTop = Math.round(pctScrollTop * maxScrollTop);
+      if (scrollPos.scrollTop !== scrollTop) {
+        scrollPos.scrollTop = scrollTop;
+        onVerticalScroll == null ? void 0 : onVerticalScroll(scrollTop, pctScrollTop);
+      }
+      if (scrollPos.scrollLeft !== scrollLeft) {
+        scrollPos.scrollLeft = scrollLeft;
+        onHorizontalScroll == null ? void 0 : onHorizontalScroll(scrollLeft);
+      }
+    }
+  }, [maxScrollLeft, maxScrollTop, onHorizontalScroll, onVerticalScroll]);
+  const handleAttachScrollbarContainer = (0, import_react20.useCallback)(
+    (el) => {
+      scrollbarContainerRef.current = el;
+      el.addEventListener("scroll", handleScrollbarContainerScroll, {
+        passive: true
+      });
+    },
+    [handleScrollbarContainerScroll]
+  );
+  const handleDetachScrollbarContainer = (0, import_react20.useCallback)(
+    (el) => {
+      scrollbarContainerRef.current = null;
+      el.removeEventListener("scroll", handleScrollbarContainerScroll);
+    },
+    [handleScrollbarContainerScroll]
+  );
+  const handleAttachContentContainer = (0, import_react20.useCallback)(
+    (el) => {
+      contentContainerRef.current = el;
+      el.addEventListener("scroll", handleContentContainerScroll, {
+        passive: true
+      });
+    },
+    [handleContentContainerScroll]
+  );
+  const handleDetachContentContainer = (0, import_react20.useCallback)(
+    (el) => {
+      contentContainerRef.current = null;
+      el.removeEventListener("scroll", handleContentContainerScroll);
+    },
+    [handleContentContainerScroll]
+  );
+  const contentContainerCallbackRef = useCallbackRef({
+    onAttach: handleAttachContentContainer,
+    onDetach: handleDetachContentContainer
+  });
+  const scrollbarContainerCallbackRef = useCallbackRef({
+    onAttach: handleAttachScrollbarContainer,
+    onDetach: handleDetachScrollbarContainer
+  });
+  const requestScroll = (0, import_react20.useCallback)(
+    (scrollRequest) => {
+      const { current: scrollbarContainer } = contentContainerRef;
+      if (scrollbarContainer) {
+        const { scrollLeft, scrollTop } = scrollbarContainer;
+        contentContainerScrolledRef.current = false;
+        if (scrollRequest.type === "scroll-distance") {
+          let newScrollLeft = scrollLeft;
+          let newScrollTop = scrollTop;
+          if (scrollRequest.direction === "up" || scrollRequest.direction === "down") {
+            newScrollTop = Math.min(
+              Math.max(0, scrollTop + scrollRequest.distance),
+              maxScrollTop
+            );
+          } else {
+            newScrollLeft = Math.min(
+              Math.max(0, scrollLeft + scrollRequest.distance),
+              maxScrollLeft
+            );
+          }
+          scrollbarContainer.scrollTo({
+            top: newScrollTop,
+            left: newScrollLeft,
+            behavior: "smooth"
+          });
+        } else if (scrollRequest.type === "scroll-page") {
+          const { direction } = scrollRequest;
+          const scrollBy = viewportRowCount * (direction === "down" ? rowHeight : -rowHeight);
+          const newScrollTop = Math.min(
+            Math.max(0, scrollTop + scrollBy),
+            maxScrollTop
+          );
+          scrollbarContainer.scrollTo({
+            top: newScrollTop,
+            left: scrollLeft,
+            behavior: "auto"
+          });
+        } else if (scrollRequest.type === "scroll-end") {
+          const { direction } = scrollRequest;
+          const scrollTo = direction === "end" ? maxScrollTop : 0;
+          scrollbarContainer.scrollTo({
+            top: scrollTo,
+            left: scrollbarContainer.scrollLeft,
+            behavior: "auto"
+          });
+        }
+      }
+    },
+    [maxScrollLeft, maxScrollTop, rowHeight, viewportRowCount]
+  );
+  return {
+    /** Ref to be assigned to ScrollbarContainer */
+    scrollbarContainerRef: scrollbarContainerCallbackRef,
+    /** Ref to be assigned to ContentContainer */
+    contentContainerRef: contentContainerCallbackRef,
+    /** Scroll the table  */
+    requestScroll
+  };
+};
+
+// src/useTableViewport.ts
+var import_react21 = require("react");
+var import_vuu_utils14 = require("@vuu-ui/vuu-utils");
+var MAX_RAW_ROWS = 15e5;
+var UNMEASURED_VIEWPORT = {
+  contentHeight: 0,
+  contentWidth: 0,
+  getRowAtPosition: () => -1,
+  getRowOffset: () => -1,
+  horizontalScrollbarHeight: 0,
+  maxScrollContainerScrollHorizontal: 0,
+  maxScrollContainerScrollVertical: 0,
+  pinnedWidthLeft: 0,
+  pinnedWidthRight: 0,
+  rowCount: 0,
+  setPctScrollTop: () => void 0,
+  totalHeaderHeight: 0,
+  verticalScrollbarWidth: 0,
+  viewportBodyHeight: 0
+};
+var measurePinnedColumns = (columns) => {
+  let pinnedWidthLeft = 0;
+  let pinnedWidthRight = 0;
+  let unpinnedWidth = 0;
+  for (const column of columns) {
+    const { hidden, pin, width } = column;
+    const visibleWidth = hidden ? 0 : width;
+    if (pin === "left") {
+      pinnedWidthLeft += visibleWidth;
+    } else if (pin === "right") {
+      pinnedWidthRight += visibleWidth;
+    } else {
+      unpinnedWidth += visibleWidth;
+    }
+  }
+  return {
+    pinnedWidthLeft: pinnedWidthLeft + 4,
+    pinnedWidthRight: pinnedWidthRight + 4,
+    unpinnedWidth
+  };
+};
+var useTableViewport = ({
+  columns,
+  headerHeight,
+  headings,
+  rowCount,
+  rowHeight,
+  size
+}) => {
+  const pctScrollTopRef = (0, import_react21.useRef)(0);
+  const appliedRowCount = Math.min(rowCount, MAX_RAW_ROWS);
+  const appliedContentHeight = appliedRowCount * rowHeight;
+  const virtualContentHeight = rowCount * rowHeight;
+  const virtualisedExtent = virtualContentHeight - appliedContentHeight;
+  const { pinnedWidthLeft, pinnedWidthRight, unpinnedWidth } = (0, import_react21.useMemo)(
+    () => measurePinnedColumns(columns),
+    [columns]
+  );
+  const [actualRowOffset, actualRowAtPosition] = (0, import_react21.useMemo)(
+    () => (0, import_vuu_utils14.actualRowPositioning)(rowHeight),
+    [rowHeight]
+  );
+  const [getRowOffset, getRowAtPosition] = (0, import_react21.useMemo)(() => {
+    if (virtualisedExtent) {
+      return (0, import_vuu_utils14.virtualRowPositioning)(
+        rowHeight,
+        virtualisedExtent,
+        pctScrollTopRef
+      );
+    } else {
+      return [actualRowOffset, actualRowAtPosition];
+    }
+  }, [actualRowAtPosition, actualRowOffset, virtualisedExtent, rowHeight]);
+  const setPctScrollTop = (0, import_react21.useCallback)((scrollPct) => {
+    pctScrollTopRef.current = scrollPct;
+  }, []);
+  return (0, import_react21.useMemo)(() => {
+    var _a;
+    if (size) {
+      const headingsDepth = headings.length;
+      const scrollbarSize = 15;
+      const contentWidth = pinnedWidthLeft + unpinnedWidth + pinnedWidthRight;
+      const horizontalScrollbarHeight = contentWidth > size.width ? scrollbarSize : 0;
+      const totalHeaderHeight = headerHeight * (1 + headingsDepth);
+      const maxScrollContainerScrollVertical = appliedContentHeight - (((_a = size == null ? void 0 : size.height) != null ? _a : 0) - horizontalScrollbarHeight) + totalHeaderHeight;
+      const maxScrollContainerScrollHorizontal = contentWidth - size.width + pinnedWidthLeft;
+      const visibleRows = (size.height - headerHeight) / rowHeight;
+      const count = Number.isInteger(visibleRows) ? visibleRows + 1 : Math.ceil(visibleRows);
+      const viewportBodyHeight = size.height - totalHeaderHeight;
+      const verticalScrollbarWidth = appliedContentHeight > viewportBodyHeight ? scrollbarSize : 0;
+      return {
+        contentHeight: appliedContentHeight,
+        getRowAtPosition,
+        getRowOffset,
+        horizontalScrollbarHeight,
+        maxScrollContainerScrollHorizontal,
+        maxScrollContainerScrollVertical,
+        pinnedWidthLeft,
+        pinnedWidthRight,
+        rowCount: count,
+        contentWidth,
+        setPctScrollTop,
+        totalHeaderHeight,
+        verticalScrollbarWidth,
+        viewportBodyHeight
+      };
+    } else {
+      return UNMEASURED_VIEWPORT;
+    }
+  }, [
+    size,
+    headings.length,
+    pinnedWidthLeft,
+    unpinnedWidth,
+    pinnedWidthRight,
+    appliedContentHeight,
+    headerHeight,
+    rowHeight,
+    getRowAtPosition,
+    getRowOffset,
+    setPctScrollTop
+  ]);
+};
+
+// src/useVirtualViewport.ts
+var import_react22 = require("react");
+var useVirtualViewport = ({
+  columns,
+  getRowAtPosition,
+  setRange,
+  viewportMeasurements
+}) => {
+  const firstRowRef = (0, import_react22.useRef)(0);
+  const { contentWidth, rowCount: viewportRowCount } = viewportMeasurements;
+  const handleVerticalScroll = (0, import_react22.useCallback)(
+    (scrollTop) => {
+      const firstRow = getRowAtPosition(scrollTop);
+      if (firstRow !== firstRowRef.current) {
+        firstRowRef.current = firstRow;
+        setRange({ from: firstRow, to: firstRow + viewportRowCount });
+      }
+    },
+    [getRowAtPosition, setRange, viewportRowCount]
+  );
+  (0, import_react22.useEffect)(() => {
+    const { current: from } = firstRowRef;
+    const rowRange = { from, to: from + viewportRowCount };
+    setRange(rowRange);
+  }, [setRange, viewportRowCount]);
+  return {
+    onVerticalScroll: handleVerticalScroll
+  };
+};
+
+// src/useTable.ts
+var stripInternalProperties = (tableConfig) => {
+  return tableConfig;
+};
+var { KEY, IS_EXPANDED: IS_EXPANDED2, IS_LEAF: IS_LEAF2 } = import_vuu_utils15.metadataKeys;
+var NULL_DRAG_DROP = {
+  draggable: void 0,
+  onMouseDown: void 0
+};
+var useNullDragDrop = () => NULL_DRAG_DROP;
+var addColumn = (tableConfig, column) => ({
+  ...tableConfig,
+  columns: tableConfig.columns.concat(column)
+});
+var useTable = ({
+  allowDragDrop = false,
+  availableColumns,
+  config,
+  containerRef,
+  dataSource,
+  disableFocus,
+  headerHeight = 25,
+  highlightedIndex: highlightedIndexProp,
+  id,
+  navigationStyle = "cell",
+  onAvailableColumnsChange,
+  onConfigChange,
+  onDragStart,
+  onDrop,
+  onFeatureInvocation,
+  onHighlight,
+  onRowClick: onRowClickProp,
+  onSelect,
+  onSelectionChange,
+  renderBufferSize = 0,
+  rowHeight = 20,
+  selectionModel,
+  size
+}) => {
+  const [rowCount, setRowCount] = (0, import_react23.useState)(dataSource.size);
+  if (dataSource === void 0) {
+    throw Error("no data source provided to Vuu Table");
+  }
+  const useRowDragDrop = allowDragDrop ? import_vuu_ui_controls2.useDragDropNext : useNullDragDrop;
+  const menuBuilder = (0, import_react23.useMemo)(
+    () => buildContextMenuDescriptors(dataSource),
+    [dataSource]
+  );
+  const onDataRowcountChange = (0, import_react23.useCallback)((size2) => {
+    setRowCount(size2);
+  }, []);
+  const {
+    columns: runtimeColumns,
+    dispatchColumnAction,
+    headings,
+    tableAttributes,
+    tableConfig
+  } = useTableModel(config, dataSource);
+  (0, import_vuu_layout2.useLayoutEffectSkipFirst)(() => {
+    dispatchColumnAction({
+      type: "init",
+      dataSource,
+      tableConfig
+    });
+  }, [tableConfig, dataSource, dispatchColumnAction]);
+  const applyTableConfigChange = (0, import_react23.useCallback)(
+    (config2) => {
+      dispatchColumnAction({
+        type: "init",
+        tableConfig: config2,
+        dataSource
+      });
+      onConfigChange == null ? void 0 : onConfigChange(stripInternalProperties(config2));
+    },
+    [dataSource, dispatchColumnAction, onConfigChange]
+  );
+  const [stateColumns, setStateColumns] = (0, import_react23.useState)();
+  const [columns, setColumnSize] = (0, import_react23.useMemo)(() => {
+    const setSize = (columnName, width) => {
+      const cols = (0, import_vuu_utils15.updateColumn)(runtimeColumns, columnName, { width });
+      setStateColumns(cols);
+    };
+    return [stateColumns != null ? stateColumns : runtimeColumns, setSize];
+  }, [runtimeColumns, stateColumns]);
+  const columnMap = (0, import_react23.useMemo)(
+    () => (0, import_vuu_utils15.buildColumnMap)(dataSource.columns),
+    [dataSource.columns]
+  );
+  const {
+    getRowAtPosition,
+    getRowOffset,
+    setPctScrollTop,
+    ...viewportMeasurements
+  } = useTableViewport({
+    columns,
+    headerHeight,
+    headings,
+    rowCount,
+    rowHeight,
+    size
+  });
+  const initialRange = useInitialValue({
+    from: 0,
+    to: viewportMeasurements.rowCount
+  });
+  const onSubscribed = (0, import_react23.useCallback)(
+    ({ tableSchema }) => {
+      if (tableSchema) {
+        dispatchColumnAction({
+          type: "setTableSchema",
+          tableSchema
+        });
+      } else {
+        console.log("subscription message with no schema");
+      }
+    },
+    [dispatchColumnAction]
+  );
+  const { data, dataRef, getSelectedRows, range, setRange } = useDataSource({
+    dataSource,
+    onFeatureInvocation,
+    renderBufferSize,
+    onSizeChange: onDataRowcountChange,
+    onSubscribed,
+    range: initialRange
+  });
+  const handleConfigEditedInSettingsPanel = (0, import_react23.useCallback)(
+    (tableConfig2) => {
+      console.log(`settings changed`);
+      dispatchColumnAction({
+        type: "init",
+        tableConfig: tableConfig2,
+        dataSource
+      });
+      onConfigChange == null ? void 0 : onConfigChange(stripInternalProperties(tableConfig2));
+    },
+    [dataSource, dispatchColumnAction, onConfigChange]
+  );
+  const handleDataSourceConfigChanged = (0, import_react23.useCallback)(
+    (dataSourceConfig) => {
+      dataSource.config = {
+        ...dataSource.config,
+        ...dataSourceConfig
+      };
+    },
+    [dataSource]
+  );
+  (0, import_react23.useEffect)(() => {
+    dataSource.on("config", (config2, confirmed) => {
+      dispatchColumnAction({
+        type: "tableConfig",
+        ...config2,
+        confirmed
+      });
+    });
+  }, [dataSource, dispatchColumnAction]);
+  const handleCreateCalculatedColumn = (0, import_react23.useCallback)(
+    (column) => {
+      dataSource.columns = dataSource.columns.concat(column.name);
+      applyTableConfigChange(addColumn(tableConfig, column));
+    },
+    [dataSource, tableConfig, applyTableConfigChange]
+  );
+  const hideColumns2 = (0, import_react23.useCallback)(
+    (action) => {
+      const { columns: columns2 } = action;
+      const hiddenColumns = columns2.map((c) => c.name);
+      const newTableConfig = {
+        ...tableConfig,
+        columns: tableConfig.columns.map(
+          (col) => hiddenColumns.includes(col.name) ? { ...col, hidden: true } : col
+        )
+      };
+      applyTableConfigChange(newTableConfig);
+    },
+    [tableConfig, applyTableConfigChange]
+  );
+  const pinColumn3 = (0, import_react23.useCallback)(
+    (action) => {
+      applyTableConfigChange({
+        ...tableConfig,
+        columns: (0, import_vuu_utils15.updateColumn)(tableConfig.columns, {
+          ...action.column,
+          pin: action.pin
+        })
+      });
+    },
+    [tableConfig, applyTableConfigChange]
+  );
+  const { showColumnSettingsPanel, showTableSettingsPanel } = (0, import_vuu_table_extras.useTableAndColumnSettings)({
+    availableColumns: availableColumns != null ? availableColumns : tableConfig.columns.map(({ name, serverDataType = "string" }) => ({
+      name,
+      serverDataType
+    })),
+    onAvailableColumnsChange,
+    onConfigChange: handleConfigEditedInSettingsPanel,
+    onCreateCalculatedColumn: handleCreateCalculatedColumn,
+    onDataSourceConfigChange: handleDataSourceConfigChanged,
+    tableConfig
+  });
+  const onPersistentColumnOperation = (0, import_react23.useCallback)(
+    (action) => {
+      if (isShowColumnSettings(action)) {
+        showColumnSettingsPanel(action);
+      } else if (isShowTableSettings(action)) {
+        showTableSettingsPanel();
+      } else {
+        switch (action.type) {
+          case "hideColumns":
+            return hideColumns2(action);
+          case "pinColumn":
+            return pinColumn3(action);
+          default:
+            dispatchColumnAction(action);
+        }
+      }
+    },
+    [
+      dispatchColumnAction,
+      hideColumns2,
+      pinColumn3,
+      showColumnSettingsPanel,
+      showTableSettingsPanel
+    ]
+  );
+  const handleContextMenuAction = useHandleTableContextMenu({
+    dataSource,
+    onPersistentColumnOperation
+  });
+  const handleSort = (0, import_react23.useCallback)(
+    (column, extendSort = false, sortType) => {
+      if (dataSource) {
+        dataSource.sort = (0, import_vuu_utils15.applySort)(
+          dataSource.sort,
+          column,
+          extendSort,
+          sortType
+        );
+      }
+    },
+    [dataSource]
+  );
+  const onResizeColumn = (0, import_react23.useCallback)(
+    (phase, columnName, width) => {
+      const column = columns.find((column2) => column2.name === columnName);
+      if (column) {
+        if (phase === "resize") {
+          if ((0, import_vuu_utils15.isValidNumber)(width)) {
+            setColumnSize(columnName, width);
+          }
+        } else if (phase === "end") {
+          if ((0, import_vuu_utils15.isValidNumber)(width)) {
+            dispatchColumnAction({
+              type: "resizeColumn",
+              phase,
+              column,
+              width
+            });
+            setStateColumns(void 0);
+            onConfigChange == null ? void 0 : onConfigChange(
+              stripInternalProperties(
+                updateTableConfig(tableConfig, {
+                  type: "col-size",
+                  column,
+                  width
+                })
+              )
+            );
+          }
+        } else {
+          setStateColumns(void 0);
+          dispatchColumnAction({
+            type: "resizeColumn",
+            phase,
+            column,
+            width
+          });
+        }
+      } else {
+        throw Error(
+          `useDataTable.handleColumnResize, column ${columnName} not found`
+        );
+      }
+    },
+    [columns, tableConfig, dispatchColumnAction, onConfigChange, setColumnSize]
+  );
+  const onToggleGroup = (0, import_react23.useCallback)(
+    (row, column) => {
+      const isJson = (0, import_vuu_utils15.isJsonGroup)(column, row);
+      const key = row[KEY];
+      if (row[IS_EXPANDED2]) {
+        dataSource.closeTreeNode(key, true);
+        if (isJson) {
+          const idx = columns.indexOf(column);
+          const rows = dataSource.getRowsAtDepth(idx + 1);
+          if (!rows.some((row2) => row2[IS_EXPANDED2] || row2[IS_LEAF2])) {
+            dispatchColumnAction({
+              type: "hideColumns",
+              columns: columns.slice(idx + 2)
+            });
+          }
+        }
+      } else {
+        dataSource.openTreeNode(key);
+        if (isJson) {
+          const childRows = dataSource.getChildRows(key);
+          const idx = columns.indexOf(column) + 1;
+          const columnsToShow = [columns[idx]];
+          if (childRows.some((row2) => row2[IS_LEAF2])) {
+            columnsToShow.push(columns[idx + 1]);
+          }
+          if (columnsToShow.some((col) => col.hidden)) {
+            dispatchColumnAction({
+              type: "showColumns",
+              columns: columnsToShow
+            });
+          }
+        }
+      }
+    },
+    [columns, dataSource, dispatchColumnAction]
+  );
+  const { onVerticalScroll } = useVirtualViewport({
+    columns,
+    getRowAtPosition,
+    setRange,
+    viewportMeasurements
+  });
+  const handleVerticalScroll = (0, import_react23.useCallback)(
+    (scrollTop) => {
+      onVerticalScroll(scrollTop);
+    },
+    [onVerticalScroll]
+  );
+  const { requestScroll, ...scrollProps } = useTableScroll({
+    maxScrollLeft: viewportMeasurements.maxScrollContainerScrollHorizontal,
+    maxScrollTop: viewportMeasurements.maxScrollContainerScrollVertical,
+    rowHeight,
+    onVerticalScroll: handleVerticalScroll,
+    viewportRowCount: viewportMeasurements.rowCount
+  });
+  const {
+    highlightedIndexRef,
+    navigate,
+    onFocus: navigationFocus,
+    onKeyDown: navigationKeyDown,
+    ...containerProps
+  } = useKeyboardNavigation({
+    columnCount: columns.filter((c) => c.hidden !== true).length,
+    containerRef,
+    disableFocus,
+    highlightedIndex: highlightedIndexProp,
+    navigationStyle,
+    requestScroll,
+    rowCount: dataSource == null ? void 0 : dataSource.size,
+    onHighlight,
+    viewportRange: range,
+    viewportRowCount: viewportMeasurements.rowCount
+  });
+  const {
+    onBlur: editingBlur,
+    onDoubleClick: editingDoubleClick,
+    onKeyDown: editingKeyDown,
+    onFocus: editingFocus
+  } = useCellEditing({
+    navigate
+  });
+  const handleFocus = (0, import_react23.useCallback)(
+    (e) => {
+      navigationFocus();
+      if (!e.defaultPrevented) {
+        editingFocus(e);
+      }
+    },
+    [editingFocus, navigationFocus]
+  );
+  const onContextMenu = useTableContextMenu({
+    columns,
+    data,
+    dataSource,
+    getSelectedRows
+  });
+  const onMoveGroupColumn = (0, import_react23.useCallback)(
+    (columns2) => {
+      dataSource.groupBy = columns2.map((col) => col.name);
+    },
+    [dataSource]
+  );
+  const onRemoveGroupColumn = (0, import_react23.useCallback)(
+    (column) => {
+      if ((0, import_vuu_utils15.isGroupColumn)(column)) {
+        dataSource.groupBy = [];
+      } else {
+        if (dataSource && dataSource.groupBy.includes(column.name)) {
+          dataSource.groupBy = dataSource.groupBy.filter(
+            (columnName) => columnName !== column.name
+          );
+        }
+      }
+    },
+    [dataSource]
+  );
+  const handleSelectionChange = (0, import_react23.useCallback)(
+    (selected) => {
+      dataSource.select(selected);
+      onSelectionChange == null ? void 0 : onSelectionChange(selected);
+    },
+    [dataSource, onSelectionChange]
+  );
+  const {
+    onKeyDown: selectionHookKeyDown,
+    onRowClick: selectionHookOnRowClick
+  } = useSelection({
+    highlightedIndexRef,
+    onSelect,
+    onSelectionChange: handleSelectionChange,
+    selectionModel
+  });
+  const handleKeyDown = (0, import_react23.useCallback)(
+    (e) => {
+      navigationKeyDown(e);
+      if (!e.defaultPrevented) {
+        editingKeyDown(e);
+      }
+      if (!e.defaultPrevented) {
+        selectionHookKeyDown(e);
+      }
+    },
+    [navigationKeyDown, editingKeyDown, selectionHookKeyDown]
+  );
+  const handleRowClick = (0, import_react23.useCallback)(
+    (row, rangeSelect, keepExistingSelection) => {
+      selectionHookOnRowClick(row, rangeSelect, keepExistingSelection);
+      onRowClickProp == null ? void 0 : onRowClickProp(row);
+    },
+    [onRowClickProp, selectionHookOnRowClick]
+  );
+  (0, import_vuu_layout2.useLayoutEffectSkipFirst)(() => {
+    dispatchColumnAction({
+      type: "init",
+      tableConfig: config,
+      dataSource
+    });
+  }, [config, dataSource, dispatchColumnAction]);
+  const onMoveColumn = (0, import_react23.useCallback)(
+    (columns2) => {
+      const newTableConfig = {
+        ...tableConfig,
+        columns: columns2
+      };
+      dispatchColumnAction({
+        type: "init",
+        tableConfig: newTableConfig,
+        dataSource
+      });
+      onConfigChange == null ? void 0 : onConfigChange(stripInternalProperties(newTableConfig));
+    },
+    [dataSource, dispatchColumnAction, onConfigChange, tableConfig]
+  );
+  const handleDropRow = (0, import_react23.useCallback)(
+    (dragDropState) => {
+      onDrop == null ? void 0 : onDrop(dragDropState);
+    },
+    [onDrop]
+  );
+  const handleDataEdited = (0, import_react23.useCallback)(
+    async (row, columnName, value) => dataSource.applyEdit(row, columnName, value),
+    [dataSource]
+  );
+  const handleDragStartRow = (0, import_react23.useCallback)(
+    (dragDropState) => {
+      const { initialDragElement } = dragDropState;
+      const rowIndex = initialDragElement.ariaRowIndex;
+      if (rowIndex) {
+        const index = parseInt(rowIndex);
+        const row = dataRef.current.find((row2) => row2[0] === index);
+        if (row) {
+          dragDropState.setPayload(row);
+        } else {
+        }
+      }
+      onDragStart == null ? void 0 : onDragStart(dragDropState);
+    },
+    [dataRef, onDragStart]
+  );
+  const { onMouseDown: rowDragMouseDown, draggable: draggableRow } = useRowDragDrop({
+    allowDragDrop,
+    containerRef,
+    draggableClassName: `vuuTable`,
+    id,
+    onDragStart: handleDragStartRow,
+    onDrop: handleDropRow,
+    orientation: "vertical",
+    itemQuery: ".vuuTableRow"
+  });
+  return {
+    ...containerProps,
+    draggableRow,
+    onBlur: editingBlur,
+    onDoubleClick: editingDoubleClick,
+    onFocus: handleFocus,
+    onKeyDown: handleKeyDown,
+    onMouseDown: rowDragMouseDown,
+    columnMap,
+    columns,
+    data,
+    handleContextMenuAction,
+    headings,
+    highlightedIndex: highlightedIndexRef.current,
+    menuBuilder,
+    onContextMenu,
+    onDataEdited: handleDataEdited,
+    onMoveColumn,
+    onMoveGroupColumn,
+    onRemoveGroupColumn,
+    onRowClick: handleRowClick,
+    onSortColumn: handleSort,
+    onResizeColumn,
+    onToggleGroup,
+    scrollProps,
+    // TODO don't think we need these ...
+    tableAttributes,
+    tableConfig,
+    viewportMeasurements
+  };
+};
+
+// src/table-header/TableHeader.tsx
+var import_vuu_utils17 = require("@vuu-ui/vuu-utils");
+var import_classnames8 = __toESM(require("classnames"));
+
+// src/table-header/useTableHeader.ts
+var import_vuu_ui_controls3 = require("@vuu-ui/vuu-ui-controls");
+var import_vuu_utils16 = require("@vuu-ui/vuu-utils");
+var import_react24 = require("react");
+var useTableHeader = ({
+  columns,
+  onMoveColumn,
+  onSortColumn,
+  tableConfig
+}) => {
+  const containerRef = (0, import_react24.useRef)(null);
+  const handleDropColumnHeader = (0, import_react24.useCallback)(
+    (moveFrom, moveTo) => {
+      const column = columns[moveFrom];
+      const orderedColumns = (0, import_vuu_utils16.moveColumnTo)(columns, column, moveTo);
+      const ofColumn = ({ name }) => (col) => col.name === name;
+      const targetIndex = orderedColumns.findIndex(ofColumn(column));
+      const nextColumn = orderedColumns[targetIndex + 1];
+      const insertPos = nextColumn ? tableConfig.columns.findIndex(ofColumn(nextColumn)) : -1;
+      onMoveColumn((0, import_vuu_utils16.moveColumnTo)(tableConfig.columns, column, insertPos));
+    },
+    [columns, onMoveColumn, tableConfig.columns]
+  );
+  const handleColumnHeaderClick = (0, import_react24.useCallback)(
+    (evt) => {
+      var _a;
+      const targetElement = evt.target;
+      const headerCell = targetElement.closest(
+        ".vuuTableHeaderCell"
+      );
+      const colIdx = parseInt((_a = headerCell == null ? void 0 : headerCell.dataset.index) != null ? _a : "-1");
+      const column = (0, import_vuu_utils16.visibleColumnAtIndex)(columns, colIdx);
+      const isAdditive = evt.shiftKey;
+      column && onSortColumn(column, isAdditive);
+    },
+    [columns, onSortColumn]
+  );
+  const {
+    onMouseDown: columnHeaderDragMouseDown,
+    draggable: draggableColumn,
+    ...dragDropHook
+  } = (0, import_vuu_ui_controls3.useDragDropNext)({
+    allowDragDrop: true,
+    containerRef,
+    draggableClassName: `vuuTable`,
+    onDrop: handleDropColumnHeader,
+    orientation: "horizontal",
+    itemQuery: ".vuuTableHeaderCell"
+  });
+  return {
+    containerRef,
+    draggableColumn,
+    draggedColumnIndex: dragDropHook.draggedItemIndex,
+    onClick: handleColumnHeaderClick,
+    onMouseDown: columnHeaderDragMouseDown
+  };
+};
+
+// src/table-header/TableHeader.tsx
+var import_jsx_runtime11 = require("react/jsx-runtime");
+var TableHeader = ({
+  classBase: classBase11 = "vuuTable",
+  columns,
+  headings,
+  onMoveColumn,
+  onMoveGroupColumn,
+  onRemoveGroupColumn,
+  onResizeColumn,
+  onSortColumn,
+  tableConfig,
+  tableId
+}) => {
+  const {
+    containerRef,
+    draggableColumn,
+    draggedColumnIndex,
+    onClick,
+    onMouseDown
+  } = useTableHeader({
+    columns,
+    onMoveColumn,
+    onSortColumn,
+    tableConfig
+  });
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: `${classBase11}-col-headings`, ref: containerRef, children: [
+    headings.map((colHeaders, i) => /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "vuuTable-heading", children: colHeaders.map(({ label, width }, j) => /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "vuuTable-headingCell", style: { width }, children: label }, j)) }, i)),
+    /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: `${classBase11}-col-headers`, role: "row", children: [
+      columns.filter(import_vuu_utils17.isNotHidden).map(
+        (col, i) => (0, import_vuu_utils17.isGroupColumn)(col) ? /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+          GroupHeaderCellNext,
+          {
+            column: col,
+            "data-index": i,
+            onMoveColumn: onMoveGroupColumn,
+            onRemoveColumn: onRemoveGroupColumn,
+            onResize: onResizeColumn
+          },
+          col.name
+        ) : /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+          HeaderCell,
+          {
+            className: (0, import_classnames8.default)({
+              "vuuDraggable-dragAway": i === draggedColumnIndex
+            }),
+            column: col,
+            "data-index": i,
+            id: `${tableId}-col-${i}`,
+            onClick,
+            onMouseDown,
+            onResize: onResizeColumn
+          },
+          col.name
+        )
+      ),
+      draggableColumn
+    ] })
+  ] });
+};
+
+// src/Table.tsx
+var import_jsx_runtime12 = require("react/jsx-runtime");
+var classBase7 = "vuuTable";
+var { IDX: IDX3, RENDER_IDX } = import_vuu_utils18.metadataKeys;
+var TableCore = ({
+  Row: Row2 = Row,
+  allowDragDrop,
+  availableColumns,
+  config,
+  containerRef,
+  dataSource,
+  disableFocus = false,
+  highlightedIndex: highlightedIndexProp,
+  id: idProp,
+  navigationStyle = "cell",
+  onAvailableColumnsChange,
+  onConfigChange,
+  onDragStart,
+  onDrop,
+  onFeatureInvocation,
+  onHighlight,
+  onRowClick: onRowClickProp,
+  onSelect,
+  onSelectionChange,
+  renderBufferSize = 0,
+  rowHeight = 20,
+  selectionModel = "extended",
+  showColumnHeaders = true,
+  headerHeight = showColumnHeaders ? 25 : 0,
+  size
+}) => {
+  const id = (0, import_vuu_layout3.useId)(idProp);
+  const {
+    columnMap,
+    columns,
+    data,
+    draggableRow,
+    handleContextMenuAction,
+    headings,
+    highlightedIndex,
+    onDataEdited,
+    onMoveColumn,
+    onMoveGroupColumn,
+    onRemoveGroupColumn,
+    onResizeColumn,
+    onRowClick,
+    onSortColumn,
+    onToggleGroup,
+    menuBuilder,
+    scrollProps,
+    tableAttributes,
+    tableConfig,
+    viewportMeasurements,
+    ...tableProps
+  } = useTable({
+    allowDragDrop,
+    availableColumns,
+    config,
+    containerRef,
+    dataSource,
+    disableFocus,
+    headerHeight,
+    highlightedIndex: highlightedIndexProp,
+    id,
+    navigationStyle,
+    onAvailableColumnsChange,
+    onConfigChange,
+    onDragStart,
+    onDrop,
+    onFeatureInvocation,
+    onHighlight,
+    onRowClick: onRowClickProp,
+    onSelect,
+    onSelectionChange,
+    renderBufferSize,
+    rowHeight,
+    selectionModel,
+    size
+  });
+  const className = (0, import_classnames9.default)(`${classBase7}-contentContainer`, {
+    [`${classBase7}-colLines`]: tableAttributes.columnSeparators,
+    [`${classBase7}-rowLines`]: tableAttributes.rowSeparators,
+    // [`${classBase}-highlight`]: tableAttributes.showHighlightedRow,
+    [`${classBase7}-zebra`]: tableAttributes.zebraStripes
+    // [`${classBase}-loading`]: isDataLoading(tableProps.columns),
+  });
+  const cssVariables = {
+    "--content-height": `${viewportMeasurements.contentHeight}px`,
+    "--content-width": `${viewportMeasurements.contentWidth}px`,
+    "--horizontal-scrollbar-height": `${viewportMeasurements.horizontalScrollbarHeight}px`,
+    "--pinned-width-left": `${viewportMeasurements.pinnedWidthLeft}px`,
+    "--pinned-width-right": `${viewportMeasurements.pinnedWidthRight}px`,
+    "--header-height": `${headerHeight}px`,
+    "--row-height": `${rowHeight}px`,
+    "--total-header-height": `${viewportMeasurements.totalHeaderHeight}px`,
+    "--vertical-scrollbar-width": `${viewportMeasurements.verticalScrollbarWidth}px`,
+    "--viewport-body-height": `${viewportMeasurements.viewportBodyHeight}px`
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
+    import_vuu_popups3.ContextMenuProvider,
+    {
+      menuActionHandler: handleContextMenuAction,
+      menuBuilder,
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+          "div",
+          {
+            className: `${classBase7}-scrollbarContainer`,
+            ref: scrollProps.scrollbarContainerRef,
+            style: cssVariables,
+            children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: `${classBase7}-scrollbarContent` })
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+          "div",
+          {
+            className,
+            ref: scrollProps.contentContainerRef,
+            style: cssVariables,
+            children: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
+              "div",
+              {
+                ...tableProps,
+                className: `${classBase7}-table`,
+                tabIndex: disableFocus ? void 0 : -1,
+                children: [
+                  showColumnHeaders ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+                    TableHeader,
+                    {
+                      columns,
+                      headings,
+                      onMoveColumn,
+                      onMoveGroupColumn,
+                      onRemoveGroupColumn,
+                      onResizeColumn,
+                      onSortColumn,
+                      tableConfig,
+                      tableId: id
+                    }
+                  ) : null,
+                  /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: `${classBase7}-body`, children: data.map((data2) => /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+                    Row2,
+                    {
+                      columnMap,
+                      columns,
+                      highlighted: highlightedIndex === data2[IDX3],
+                      onClick: onRowClick,
+                      onDataEdited,
+                      row: data2,
+                      offset: rowHeight * data2[IDX3] + viewportMeasurements.totalHeaderHeight,
+                      onToggleGroup,
+                      zebraStripes: tableAttributes.zebraStripes
+                    },
+                    data2[RENDER_IDX]
+                  )) })
+                ]
+              }
+            )
+          }
+        ),
+        draggableRow
+      ]
+    }
+  );
+};
+var Table = (0, import_react25.forwardRef)(function TableNext({
+  Row: Row2,
+  allowDragDrop,
+  availableColumns,
+  className: classNameProp,
+  config,
+  dataSource,
+  disableFocus,
+  highlightedIndex,
+  id,
+  navigationStyle,
+  onAvailableColumnsChange,
+  onConfigChange,
+  onDragStart,
+  onDrop,
+  onFeatureInvocation,
+  onHighlight,
+  onRowClick,
+  onSelect,
+  onSelectionChange,
+  renderBufferSize,
+  rowHeight,
+  selectionModel,
+  showColumnHeaders,
+  headerHeight,
+  style: styleProp,
+  ...htmlAttributes
+}, forwardedRef) {
+  const containerRef = (0, import_react25.useRef)(null);
+  const [size, setSize] = (0, import_react25.useState)();
+  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+    import_vuu_layout3.MeasuredContainer,
+    {
+      ...htmlAttributes,
+      className: (0, import_classnames9.default)(classBase7, classNameProp),
+      id,
+      onResize: setSize,
+      ref: (0, import_core2.useForkRef)(containerRef, forwardedRef),
+      children: size ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+        TableCore,
+        {
+          Row: Row2,
+          allowDragDrop,
+          availableColumns,
+          config,
+          containerRef,
+          dataSource,
+          disableFocus,
+          headerHeight,
+          highlightedIndex,
+          id,
+          navigationStyle,
+          onAvailableColumnsChange,
+          onConfigChange,
+          onDragStart,
+          onDrop,
+          onFeatureInvocation,
+          onHighlight,
+          onRowClick,
+          onSelect,
+          onSelectionChange,
+          renderBufferSize,
+          rowHeight,
+          selectionModel,
+          showColumnHeaders,
+          size
+        }
+      ) : null
+    }
+  );
+});
+
+// src/cell-renderers/checkbox-cell/CheckboxCell.tsx
+var import_react26 = require("react");
+var import_vuu_ui_controls4 = require("@vuu-ui/vuu-ui-controls");
+var import_core3 = require("@salt-ds/core");
+
+// src/cell-renderers/cell-utils.ts
+var dataAndColumnUnchanged = (p, p1) => p.column === p1.column && p.row[p.columnMap[p.column.name]] === p1.row[p1.columnMap[p1.column.name]];
+
+// src/cell-renderers/checkbox-cell/CheckboxCell.tsx
+var import_vuu_utils19 = require("@vuu-ui/vuu-utils");
+var import_jsx_runtime13 = require("react/jsx-runtime");
+var CheckboxCell = (0, import_react26.memo)(
+  ({ column, columnMap, onCommit = import_vuu_ui_controls4.WarnCommit, row }) => {
+    const dataIdx = columnMap[column.name];
+    const isChecked = row[dataIdx];
+    const handleCommit = (0, import_react26.useCallback)(
+      (value) => async (evt) => {
+        const res = await onCommit(value);
+        if (res === true) {
+          (0, import_vuu_utils19.dispatchCustomEvent)(evt.target, "vuu-commit");
+        }
+        return res;
+      },
+      [onCommit]
+    );
+    return !!column.editable ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_core3.Checkbox, { checked: isChecked, onClick: handleCommit(!isChecked) }) : /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_vuu_ui_controls4.CheckboxIcon, { checked: isChecked, disabled: true });
+  },
+  dataAndColumnUnchanged
+);
+CheckboxCell.displayName = "CheckboxCell";
+(0, import_vuu_utils19.registerComponent)("checkbox-cell", CheckboxCell, "cell-renderer", {
+  serverDataType: "boolean"
+});
+
+// src/cell-renderers/dropdown-cell/DropdownCell.tsx
+var import_vuu_data_react = require("@vuu-ui/vuu-data-react");
+var import_vuu_ui_controls5 = require("@vuu-ui/vuu-ui-controls");
+var import_vuu_utils20 = require("@vuu-ui/vuu-utils");
+var import_react27 = require("react");
+var import_jsx_runtime14 = require("react/jsx-runtime");
+var classBase8 = "vuuTableDropdownCell";
+var openKeys = ["Enter", " "];
+var DropdownCell = (0, import_react27.memo)(
+  function DropdownCell2({
+    column,
+    columnMap,
+    onCommit = import_vuu_ui_controls5.WarnCommit,
+    row
+  }) {
+    const dataIdx = columnMap[column.name];
+    const { initialValue, values } = (0, import_vuu_data_react.useLookupValues)(column, row[dataIdx]);
+    const [value, setValue] = (0, import_react27.useState)(null);
+    const handleSelectionChange = (0, import_react27.useCallback)(
+      (evt, selectedOption) => {
+        if (selectedOption) {
+          setValue(selectedOption);
+          onCommit(selectedOption.value).then((response) => {
+            if (response === true && evt) {
+              (0, import_vuu_utils20.dispatchCustomEvent)(evt.target, "vuu-commit");
+            }
+          });
+        }
+      },
+      [onCommit]
+    );
+    return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+      import_vuu_ui_controls5.Dropdown,
+      {
+        className: classBase8,
+        onSelectionChange: handleSelectionChange,
+        openKeys,
+        selected: value != null ? value : initialValue,
+        source: values,
+        width: column.width - 17
+      }
+    );
+  },
+  dataAndColumnUnchanged
+);
+(0, import_vuu_utils20.registerComponent)("dropdown-cell", DropdownCell, "cell-renderer", {});
+
+// src/cell-renderers/input-cell/InputCell.tsx
+var import_vuu_utils21 = require("@vuu-ui/vuu-utils");
+var import_core4 = require("@salt-ds/core");
+var import_vuu_ui_controls6 = require("@vuu-ui/vuu-ui-controls");
+var import_classnames10 = __toESM(require("classnames"));
+var import_jsx_runtime15 = require("react/jsx-runtime");
+var classBase9 = "vuuTableInputCell";
+var WarnCommit3 = () => {
+  console.warn(
+    "onCommit handler has not been provided to InputCell cell renderer"
+  );
+  return Promise.resolve(true);
+};
+var InputCell = ({
+  column,
+  columnMap,
+  onCommit = WarnCommit3,
+  row
+}) => {
+  const dataIdx = columnMap[column.name];
+  const {
+    align = "left",
+    clientSideEditValidationCheck,
+    valueFormatter
+  } = column;
+  const { warningMessage, ...editProps } = (0, import_vuu_ui_controls6.useEditableText)({
+    initialValue: valueFormatter(row[dataIdx]),
+    onCommit,
+    clientSideEditValidationCheck
+  });
+  const endAdornment = warningMessage && align === "left" ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: `${classBase9}-icon`, "data-icon": "error" }) : void 0;
+  const startAdornment = warningMessage && align === "right" ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: `${classBase9}-icon`, "data-icon": "error" }) : void 0;
+  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+    import_core4.Input,
+    {
+      ...editProps,
+      className: (0, import_classnames10.default)(classBase9, {
+        [`${classBase9}-error`]: warningMessage !== void 0
+      }),
+      endAdornment,
+      startAdornment
+    }
+  );
+};
+(0, import_vuu_utils21.registerComponent)("input-cell", InputCell, "cell-renderer", {});
+
+// src/cell-renderers/lookup-cell/LookupCell.tsx
+var import_vuu_data_react2 = require("@vuu-ui/vuu-data-react");
+var import_vuu_utils22 = require("@vuu-ui/vuu-utils");
+var import_react28 = require("react");
+var import_jsx_runtime16 = require("react/jsx-runtime");
+var LookupCell = (0, import_react28.memo)(
+  function LookupCell2({
+    column,
+    columnMap,
+    row
+  }) {
+    const dataIdx = columnMap[column.name];
+    const { initialValue: value } = (0, import_vuu_data_react2.useLookupValues)(column, row[dataIdx]);
+    return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("span", { children: value == null ? void 0 : value.label });
+  },
+  dataAndColumnUnchanged
+);
+(0, import_vuu_utils22.registerComponent)("lookup-cell", LookupCell, "cell-renderer", {});
+
+// src/cell-renderers/toggle-cell/ToggleCell.tsx
+var import_vuu_ui_controls7 = require("@vuu-ui/vuu-ui-controls");
+var import_vuu_utils23 = require("@vuu-ui/vuu-utils");
+var import_classnames11 = __toESM(require("classnames"));
+var import_react29 = require("react");
+var import_vuu_ui_controls8 = require("@vuu-ui/vuu-ui-controls");
+var import_jsx_runtime17 = require("react/jsx-runtime");
+var classBase10 = "vuuTableToggleCell";
+var getValueList = ({ name, type }) => {
+  if ((0, import_vuu_utils23.isTypeDescriptor)(type) && (0, import_vuu_utils23.isValueListRenderer)(type.renderer)) {
+    return type.renderer.values;
+  } else {
+    throw Error(
+      `useLookupValues column ${name} has not been configured with a values list`
+    );
+  }
+};
+var ToggleCell = (0, import_react29.memo)(
+  function ToggleCell2({
+    column,
+    columnMap,
+    onCommit = import_vuu_ui_controls7.WarnCommit,
+    row
+  }) {
+    const values = getValueList(column);
+    const dataIdx = columnMap[column.name];
+    const value = row[dataIdx];
+    const handleCommit = (0, import_react29.useCallback)(
+      (evt, value2) => {
+        return onCommit(value2).then((response) => {
+          if (response === true) {
+            (0, import_vuu_utils23.dispatchCustomEvent)(evt.target, "vuu-commit");
+          }
+          return response;
+        });
+      },
+      [onCommit]
+    );
+    return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+      import_vuu_ui_controls8.CycleStateButton,
+      {
+        className: (0, import_classnames11.default)(classBase10, `${classBase10}-${column.name}`),
+        onCommit: handleCommit,
+        value,
+        values,
+        variant: "cta",
+        children: value
+      }
+    );
+  },
+  dataAndColumnUnchanged
+);
+(0, import_vuu_utils23.registerComponent)("toggle-cell", ToggleCell, "cell-renderer", {});
+
+// src/useControlledTableNavigation.ts
+var import_vuu_ui_controls9 = require("@vuu-ui/vuu-ui-controls");
+var import_vuu_utils24 = require("@vuu-ui/vuu-utils");
+var import_react30 = require("react");
+var useControlledTableNavigation = (initialValue, rowCount) => {
+  const tableRef = (0, import_react30.useRef)(null);
+  const [highlightedIndexRef, setHighlightedIndex] = (0, import_vuu_ui_controls9.useStateRef)(initialValue);
+  const handleKeyDown = (0, import_react30.useCallback)(
+    (e) => {
+      var _a;
+      if (e.key === "ArrowDown") {
+        setHighlightedIndex((index = -1) => Math.min(rowCount - 1, index + 1));
+      } else if (e.key === "ArrowUp") {
+        setHighlightedIndex((index = -1) => Math.max(0, index - 1));
+      } else if (e.key === "Enter" || e.key === " ") {
+        const { current: rowIdx } = highlightedIndexRef;
+        const rowEl = (_a = tableRef.current) == null ? void 0 : _a.querySelector(
+          `[aria-rowindex="${rowIdx}"]`
+        );
+        if (rowEl) {
+          (0, import_vuu_utils24.dispatchMouseEvent)(rowEl, "click");
+        }
+      }
+    },
+    [highlightedIndexRef, rowCount, setHighlightedIndex]
+  );
+  const handleHighlight = (0, import_react30.useCallback)(
+    (idx) => {
+      setHighlightedIndex(idx);
+    },
+    [setHighlightedIndex]
+  );
+  return {
+    highlightedIndexRef,
+    onHighlight: handleHighlight,
+    onKeyDown: handleKeyDown,
+    tableRef
+  };
+};
 //# sourceMappingURL=index.js.map