@vuu-ui/vuu-table-extras 0.8.9 → 0.8.10-debug

package/esm/index.js

@@ -1,2 +1,4217 @@
-var Et=(t,e,o)=>{if(!e.has(t))throw TypeError("Cannot "+o)};var C=(t,e,o)=>(Et(t,e,"read from private field"),o?o.call(t):e.get(t)),P=(t,e,o)=>{if(e.has(t))throw TypeError("Cannot add the same private member more than once");e instanceof WeakSet?e.add(t):e.set(t,o)},F=(t,e,o,n)=>(Et(t,e,"write to private field"),n?n.call(t,o):e.set(t,o),o);import{registerComponent as Go}from"@vuu-ui/vuu-utils";var Uo=t=>typeof t=="string",Xo=(t,e)=>Uo(e)?e===""?!0:t.value==="lower"&&e.toLowerCase()!==e?"value must be all lowercase":t.value==="upper"&&e.toUpperCase()!==e?"value must be all uppercase":!0:"value must be a string";Go("vuu-case",Xo,"data-edit-validator",{});import{registerComponent as _o}from"@vuu-ui/vuu-utils";var Yo=t=>typeof t=="string",Jo="value does not match expected pattern",Zo=(t,e)=>{if(typeof t.value!="string")throw Error("Pattern validation rule must provide pattern");if(Yo(e)){if(e==="")return!0;{let{message:o=Jo}=t;return new RegExp(t.value).test(e)||o}}else return"value must be a string"};_o("vuu-pattern",Zo,"data-edit-validator",{});import{DOWN1 as nn,DOWN2 as rn,isTypeDescriptor as sn,metadataKeys as ln,registerComponent as an,UP1 as un,UP2 as cn}from"@vuu-ui/vuu-utils";import mn from"classnames";import{getMovingValueDirection as qo,isTypeDescriptor as jo,isValidNumber as wt}from"@vuu-ui/vuu-utils";import{useEffect as en,useRef as tn}from"react";var on=[void 0,void 0,void 0,void 0];function Dt(t,e,o){var d;let n=tn(),[r,s,i,l]=n.current||on,{type:u}=o,c=jo(u)?(d=u.formatting)==null?void 0:d.decimals:void 0,m=t===r&&wt(e)&&wt(s)&&o===i?qo(e,l,s,c):"";return en(()=>{n.current=[t,e,o,m]}),m}import{jsx as bn,jsxs as hn}from"react/jsx-runtime";var pn=String.fromCharCode(11014),dn=String.fromCharCode(11015),{KEY:fn}=ln,Te="vuuBackgroundCellDeprecated",ie={ArrowOnly:"arrow",BackgroundOnly:"bg-only",ArrowBackground:"arrow-bg"},gn=t=>sn(t)&&t.renderer&&"flashStyle"in t.renderer?t.renderer.flashStyle:ie.BackgroundOnly,Cn=({column:t,row:e})=>{let{key:o,type:n,valueFormatter:r}=t,s=e[o],i=gn(n),l=Dt(e[fn],s,t),u=i===ie.ArrowOnly||i===ie.ArrowBackground?l===un||l===cn?pn:l===nn||l===rn?dn:null:null,c=l?" "+l:"",m=mn(Te,c,{[`${Te}-arrowOnly`]:i===ie.ArrowOnly,[`${Te}-arrowBackground`]:i===ie.ArrowBackground});return hn("div",{className:m,tabIndex:-1,children:[bn("div",{className:`${Te}-flasher`,children:u}),r(e[t.key])]})};an("background",Cn,"cell-renderer",{description:"Background Cell renderer for VuuTable",label:"Background Cell (deprecated)",serverDataType:["long","int","double"]});import{isColumnTypeRenderer as xn,isTypeDescriptor as yn,isValidNumber as Rt,registerComponent as vn}from"@vuu-ui/vuu-utils";import Tn from"classnames";import{jsx as ze,jsxs as St}from"react/jsx-runtime";var le="vuuProgressCell",En=({column:t,columnMap:e,row:o})=>{let{type:n}=t,r=o[t.key],s=!1,i=0;if(yn(n)&&xn(n.renderer)){let{associatedField:u}=n.renderer;if(u){let c=o[e[u]];if(typeof Rt(r)&&Rt(c))i=Math.min(Math.round(r/c*100),100),i=Math.min(Math.round(r/c*100),100),s=isFinite(i);else{let m=parseFloat(r);if(Number.isFinite(m)){let d=parseFloat(c);Number.isFinite(d)&&(i=Math.min(Math.round(m/d*100),100),s=isFinite(i))}}}else throw Error("ProgressCell associatedField is required to render")}let l=Tn(le,{});return St("div",{className:l,tabIndex:-1,children:[s?St("span",{className:`${le}-track`,children:[ze("span",{className:`${le}-bg`}),ze("span",{className:`${le}-bar`,style:{"--progress-bar-pct":`-${100-i}%`}})]}):null,ze("span",{className:`${le}-text`,children:`${i} %`})]})};vn("vuu.progress",En,"cell-renderer",{description:"Progress formatter",label:"Progress formatter",serverDataType:["long","int","double"]});import{DOWN1 as Mn,DOWN2 as Hn,isTypeDescriptor as On,metadataKeys as An,registerComponent as Ln,UP1 as Nn,UP2 as kn}from"@vuu-ui/vuu-utils";import Fn from"classnames";import{getMovingValueDirection as wn,isTypeDescriptor as Dn,isValidNumber as Pt}from"@vuu-ui/vuu-utils";import{useEffect as Rn,useRef as Sn}from"react";var Pn=[void 0,void 0,void 0,void 0];function Mt(t,e,o){var d;let n=Sn(),[r,s,i,l]=n.current||Pn,{type:u}=o,c=Dn(u)?(d=u.formatting)==null?void 0:d.decimals:void 0,m=t===r&&Pt(e)&&Pt(s)&&o===i?wn(e,l,s,c):"";return Rn(()=>{n.current=[t,e,o,m]}),m}import{jsx as Bn,jsxs as Wn}from"react/jsx-runtime";var In=String.fromCharCode(11014),Kn=String.fromCharCode(11015),{KEY:zn}=An,Ee="vuuBackgroundCell",ae={ArrowOnly:"arrow",BackgroundOnly:"bg-only",ArrowBackground:"arrow-bg"},Vn=t=>On(t)&&t.renderer&&"flashStyle"in t.renderer?t.renderer.flashStyle:ae.BackgroundOnly,$n=({column:t,row:e})=>{let{key:o,type:n,valueFormatter:r}=t,s=e[o],i=Vn(n),l=Mt(e[zn],s,t),u=i===ae.ArrowOnly||i===ae.ArrowBackground?l===Nn||l===kn?In:l===Mn||l===Hn?Kn:null:null,c=l?" "+l:"",m=Fn(Ee,c,{[`${Ee}-arrowOnly`]:i===ae.ArrowOnly,[`${Ee}-arrowBackground`]:i===ae.ArrowBackground});return Wn("div",{className:m,tabIndex:-1,children:[Bn("div",{className:`${Ee}-flasher`,children:u}),r(e[t.key])]})};console.log("register BackgroundCellNext");Ln("background-next",$n,"cell-renderer",{description:"Change background color of cell when value changes",label:"Background Flash",serverDataType:["long","int","double"]});import{List as Qn,ListItem as Gn}from"@vuu-ui/vuu-ui-controls";import{Checkbox as Un}from"@salt-ds/core";import{Switch as Xn}from"@salt-ds/lab";import _n from"classnames";import{useCallback as Yn}from"react";import{jsx as L,jsxs as Ve}from"react/jsx-runtime";var A="vuuColumnList",Ht="vuuColumnListItem",Jn=({className:t,item:e,...o})=>{var n;return Ve(Gn,{...o,className:_n(t,Ht),"data-name":e==null?void 0:e.name,children:[e!=null&&e.isCalculated?L("span",{className:`${A}-icon`,"data-icon":"function"}):L(Xn,{className:`${A}-switch`,checked:e==null?void 0:e.subscribed}),L("span",{className:`${A}-text`,children:(n=e==null?void 0:e.label)!=null?n:e==null?void 0:e.name}),L(Un,{className:`${A}-checkBox`,checked:(e==null?void 0:e.hidden)!==!0,disabled:(e==null?void 0:e.subscribed)!==!0})]})},Ot=({columnItems:t,onChange:e,onMoveListItem:o,...n})=>{let r=Yn(s=>{let i=s.target,l=i.closest(`.${Ht}`),{dataset:{name:u}}=l;if(u){let c=i.closest(`.${A}-switch`),m=i.closest(`.${A}-checkBox`);c?e(u,"subscribed",i.checked):m&&e(u,"hidden",i.checked===!1)}},[e]);return Ve("div",{...n,className:A,children:[L("div",{className:`${A}-header`,children:L("span",{children:"Column Selection"})}),Ve("div",{className:`${A}-colHeadings`,children:[L("span",{children:"Column subscription"}),L("span",{children:"Visibility"})]}),L(Qn,{ListItem:Jn,allowDragDrop:!0,height:"100%",onChange:r,onMoveListItem:o,selectionStrategy:"none",source:t,itemHeight:33})]})};import{getDefaultAlignment as Hs,isCalculatedColumn as Os}from"@vuu-ui/vuu-utils";import{Button as fo,FormField as Ae,FormFieldLabel as Le,ToggleButton as te,ToggleButtonGroup as go}from"@salt-ds/core";import{Dropdown as tr}from"@vuu-ui/vuu-ui-controls";import{FormField as or,FormFieldLabel as nr}from"@salt-ds/core";import Nt from"classnames";import{useMemo as rr}from"react";import{FormField as $e,FormFieldLabel as Be,Input as Zn}from"@salt-ds/core";import{Switch as At}from"@salt-ds/lab";import{getTypeSettingsFromColumn as qn}from"@vuu-ui/vuu-utils";import{useCallback as we,useState as jn}from"react";import{jsx as U,jsxs as De}from"react/jsx-runtime";var er="vuuFormattingSettings",Lt=({column:t,onChange:e})=>{var u;let[o,n]=jn(qn(t)),r=we(c=>{(c.key==="Enter"||c.key==="Tab")&&e(o)},[o,e]),s=we(c=>{let{value:m}=c.target,d=m===""||isNaN(parseInt(m))?void 0:parseInt(m),b={...o,decimals:d};n(b)},[o]),i=we(c=>{let{checked:m}=c.target,d={...o,alignOnDecimals:m};n(d),e(d)},[o,e]),l=we(c=>{let{checked:m}=c.target,d={...o,zeroPad:m};n(d),e(d)},[o,e]);return De("div",{className:er,children:[De($e,{"data-field":"decimals",children:[U(Be,{children:"Number of decimals"}),U(Zn,{className:"vuuInput",onChange:s,onKeyDown:r,value:(u=o.decimals)!=null?u:""})]}),De($e,{labelPlacement:"left",children:[U(Be,{children:"Align on decimals"}),U(At,{checked:o.alignOnDecimals,onChange:i,value:"align-decimals"})]}),De($e,{labelPlacement:"left",children:[U(Be,{children:"Zero pad decimals"}),U(At,{checked:o.zeroPad,onChange:l,value:"zero-pad"})]})]})};import{jsx as ue,jsxs as kt}from"react/jsx-runtime";var We="vuuColumnFormattingPanel",sr=t=>{var e;return(e=t.label)!=null?e:t.name},Ft=({availableRenderers:t,selectedCellRenderer:e,className:o,column:n,onChangeFormatting:r,onChangeRenderer:s,...i})=>{let l=rr(()=>{switch(n.serverDataType){case"double":case"int":case"long":return ue(Lt,{column:n,onChange:r});default:return null}},[n,r]),{serverDataType:u="string"}=n;return kt("div",{...i,className:"vuuColumnSettingsPanel-header",children:[ue("div",{children:"Formatting"}),kt(or,{children:[ue(nr,{children:"Renderer"}),ue(tr,{className:Nt(`${We}-renderer`),itemToString:sr,onSelectionChange:s,selected:e,source:t,width:"100%"})]}),ue("div",{className:Nt(We,o,`${We}-${u}`),children:l})]})};import{getRegisteredCellRenderers as ir,isColumnTypeRenderer as lr,isTypeDescriptor as ar,isValidColumnAlignment as ur,isValidPinLocation as cr,setCalculatedColumnName as mr,updateColumnRenderer as pr,updateColumnType as dr}from"@vuu-ui/vuu-utils";import{useCallback as I,useMemo as fr,useRef as gr,useState as Cr}from"react";var br=[{description:"Default formatter for columns with data type integer",label:"Default Renderer (data type int, long)",name:"default-int"}],hr=[{description:"Default formatter for columns with data type double",label:"Default Renderer (data type double)",name:"default-double"},...ir("double")],It=[{description:"Default formatter for columns with data type string",label:"Default Renderer (data type string)",name:"default-string"}],zt=t=>{switch(t.serverDataType){case"char":case"string":return It;case"int":case"long":return br;case"double":return hr;default:return It}},Kt=(t,e)=>{if(ar(e.type)){let{renderer:n}=e.type;if(lr(n)){let r=t.find(s=>s.name===n.name);if(r)return r}}return zt(e)[0]},xr=t=>{let e=t.closest(".saltFormField");if(e&&e.dataset.field){let{dataset:{field:o}}=e;return o}else throw Error("named form field not found")},yr=(t,e)=>{if(e.name==="::")return e;{let o=t.find(n=>n.name===e.name);if(o)return o;throw Error(`columns does not contain column ${name}`)}},ce=(t,e)=>({...t,columns:t.columns.map(o=>o.name===e.name?e:o)}),Vt=({column:t,onConfigChange:e,onCreateCalculatedColumn:o,tableConfig:n})=>{let[r,s]=Cr(yr(n.columns,t)),i=fr(()=>zt(r),[r]),l=gr(Kt(i,r)),u=I(()=>{e(ce(n,r))},[r,e,n]),c=I(f=>{let h=f.target,v=xr(h),{value:T}=h;switch(v){case"column-label":s(y=>({...y,label:T}));break;case"column-name":s(y=>mr(y,T));break;case"column-width":s(y=>({...y,width:parseInt(T)}));break;case"column-alignment":if(ur(T)){let y={...r,align:T||void 0};s(y),e(ce(n,y))}break;case"column-pin":if(cr(T)){let y={...r,pin:T||void 0};s(y),e(ce(n,y));break}}},[r,e,n]),m=I((f,h)=>{if(h){let v=pr(r,h);l.current=h,s(v),e(ce(n,v))}},[r,e,n]),d=I(f=>{let h=dr(r,f);s(h),e(ce(n,h))},[r,e,n]),b=I(({moveBy:f})=>{let{columns:h}=n,v=h.indexOf(r)+f,T=h[v];T&&(l.current=Kt(i,T),s(T))},[i,r,n]),a=I(()=>{b({moveBy:1})},[b]),p=I(()=>{b({moveBy:-1})},[b]),g=I(f=>{o({...r,...f})},[r,o]);return{availableRenderers:i,selectedCellRenderer:l.current,column:r,navigateNextColumn:a,navigatePrevColumn:p,onChange:c,onChangeFormatting:d,onChangeRenderer:m,onInputCommit:u,onSave:g}};import{Dropdown as Es}from"@vuu-ui/vuu-ui-controls";import{getCalculatedColumnExpression as ws,getCalculatedColumnName as Ds,getCalculatedColumnType as Rs}from"@vuu-ui/vuu-utils";import{Button as st,FormField as it,FormFieldLabel as lt,Input as Ss}from"@salt-ds/core";import{useCallback as Ps,useRef as Ms}from"react";import{autocompletion as Vr,defaultKeymap as $r,EditorState as Br,EditorView as to,ensureSyntaxTree as Wr,keymap as oo,minimalSetup as Qr,startCompletion as no}from"@vuu-ui/vuu-codemirror";import{createEl as ro}from"@vuu-ui/vuu-utils";import{useEffect as Gr,useMemo as Ur,useRef as tt}from"react";import{LanguageSupport as Tr,LRLanguage as Er,styleTags as wr,tags as Se}from"@vuu-ui/vuu-codemirror";import{LRParser as vr}from"@lezer/lr";var Re=vr.deserialize({version:14,states:"&fOVQPOOO!SQPO'#C^OVQPO'#CcQ!pQPOOO#OQPO'#CkO#TQPO'#CrOOQO'#Cy'#CyO#YQPO,58}OVQPO,59QOVQPO,59QOVQPO,59VOVQPO'#CtOOQO,59^,59^OOQO1G.i1G.iOOQO1G.l1G.lO#kQPO1G.lO$fQPO'#CmO%WQQO1G.qOOQO'#C{'#C{O%cQPO,59`OOQO'#Cn'#CnO%wQPO,59XOVQPO,59ZOVQPO,59[OVQPO7+$]OVQPO'#CuO&`QPO1G.zOOQO1G.z1G.zO&hQQO'#C^O&rQQO1G.sO'ZQQO1G.uOOQO1G.v1G.vO'fQPO<<GwO'wQPO,59aOOQO-E6s-E6sOOQO7+$f7+$fOVQPOAN=cO(]QQO1G.lO(tQPOG22}OOQOLD(iLD(iO%wQPO,59QO%wQPO,59Q",stateData:")[~OlOS~ORUOSUOTUOUUOWQO`SOnPO~OWgXZQX[QX]QX^QXeQX~OjQXXQXpQXqQXrQXsQXtQXuQX~PnOZWO[WO]XO^XO~OWYO~OWZO~OX]OZWO[WO]XO^XO~OZWO[WO]Yi^YijYiXYipYiqYirYisYitYiuYieYi~OZWO[WO]XO^XOpdOqdOrdOsdOtdOudO~OehOvfOwgO~OXkOZWO[WO]XO^XOeiO~ORUOSUOTUOUUOWQO`SOnlO~OXsOeiO~OvQXwQX~PnOZxO[xO]yO^yOeaivaiwai~OwgOecivci~OZWO[WO]XO^XOetO~OZWO[WO]XO^XOXiaeia~OZxO[xO]Yi^YieYivYiwYi~OXwOZWO[WO]XO^XO~O`UTn~",goto:"#spPPqPPPPqPPqPPPPqP!R!W!R!RPq!Z!k!nPPP!tP#jmUOQWXYZefghitxyVbYfgRe`mTOQWXYZefghitxyR[TQjcRrjQROQVQS^WxQ_XU`YfgQcZQmeQphQqiQuyRvtQaYQnfRog",nodeNames:"\u26A0 ColumnDefinitionExpression Column Number String True False ParenthesizedExpression OpenBrace CloseBrace ArithmeticExpression Divide Times Plus Minus ConditionalExpression If RelationalExpression RelationalOperator AndCondition OrCondition Comma CallExpression Function ArgList",maxTerm:39,skippedNodes:[0],repeatNodeCount:1,tokenData:".^~RnXY#PYZ#P]^#Ppq#Pqr#brs#mxy$eyz$jz{$o{|$t|}$y}!O%O!O!P%T!P!Q%c!Q![%h!^!_%s!_!`&Q!`!a&V!c!}&d#R#S&d#T#U&u#U#Y&d#Y#Z(Y#Z#]&d#]#^*j#^#c&d#c#d+f#d#h&d#h#i,b#i#o&d~#USl~XY#PYZ#P]^#Ppq#P~#eP!_!`#h~#mOu~~#pWOX#mZ]#m^r#mrs$Ys#O#m#P;'S#m;'S;=`$_<%lO#m~$_OS~~$bP;=`<%l#m~$jOW~~$oOX~~$tO[~~$yO]~~%OOe~~%TO^~~%WP!Q![%Z~%`PR~!Q![%Z~%hOZ~~%mQR~!O!P%Z!Q![%h~%xPr~!_!`%{~&QOt~~&VOp~~&[Pq~!_!`&_~&dOs~P&iSnP!Q![&d!c!}&d#R#S&d#T#o&dR&zUnP!Q![&d!c!}&d#R#S&d#T#b&d#b#c'^#c#o&dR'cUnP!Q![&d!c!}&d#R#S&d#T#W&d#W#X'u#X#o&dR'|SvQnP!Q![&d!c!}&d#R#S&d#T#o&d~(_TnP!Q![&d!c!}&d#R#S&d#T#U(n#U#o&d~(sUnP!Q![&d!c!}&d#R#S&d#T#`&d#`#a)V#a#o&d~)[UnP!Q![&d!c!}&d#R#S&d#T#g&d#g#h)n#h#o&d~)sUnP!Q![&d!c!}&d#R#S&d#T#X&d#X#Y*V#Y#o&d~*^SU~nP!Q![&d!c!}&d#R#S&d#T#o&d~*oUnP!Q![&d!c!}&d#R#S&d#T#Y&d#Y#Z+R#Z#o&d~+YS`~nP!Q![&d!c!}&d#R#S&d#T#o&dR+kUnP!Q![&d!c!}&d#R#S&d#T#f&d#f#g+}#g#o&dR,USwQnP!Q![&d!c!}&d#R#S&d#T#o&d~,gUnP!Q![&d!c!}&d#R#S&d#T#f&d#f#g,y#g#o&d~-OUnP!Q![&d!c!}&d#R#S&d#T#i&d#i#j-b#j#o&d~-gUnP!Q![&d!c!}&d#R#S&d#T#X&d#X#Y-y#Y#o&d~.QST~nP!Q![&d!c!}&d#R#S&d#T#o&d",tokenizers:[0,1],topRules:{ColumnDefinitionExpression:[0,1]},tokenPrec:375});var Dr=Er.define({name:"VuuColumnExpression",parser:Re.configure({props:[wr({Function:Se.variableName,String:Se.string,Or:Se.emphasis,Operator:Se.operator})]})}),$t=()=>new Tr(Dr);var Qe=class{constructor(e){switch(this.value=e,typeof e){case"boolean":this.type="booleanLiteralExpression";break;case"number":this.type="numericLiteralExpression";break;default:this.type="stringLiteralExpression"}}toJSON(){return{type:this.type,value:this.value}}},Ge=class{constructor(e){this.type="colExpression";this.column=e}toJSON(){return{type:this.type,column:this.column}}},pe,$,Ue=class{constructor(e="unknown"){P(this,pe,[{type:"unknown"},{type:"unknown"}]);P(this,$,void 0);this.type="arithmeticExpression";F(this,$,e)}get op(){return C(this,$)}set op(e){F(this,$,e)}get expressions(){return C(this,pe)}toJSON(){return{type:this.type,op:C(this,$),expressions:C(this,pe)}}};pe=new WeakMap,$=new WeakMap;var J,Xe=class{constructor(e){P(this,J,[]);this.type="callExpression";this.functionName=e}get expressions(){return C(this,J)}get arguments(){return C(this,J)}toJSON(){return{type:this.type,functionName:this.functionName,arguments:C(this,J).map(e=>{var o;return(o=e.toJSON)==null?void 0:o.call(e)})}}};J=new WeakMap;var de,Z,_=class{constructor(){P(this,de,[{type:"unknown"},{type:"unknown"}]);P(this,Z,"unknown");this.type="relationalExpression"}get op(){return C(this,Z)}set op(e){F(this,Z,e)}get expressions(){return C(this,de)}toJSON(){return{type:this.type,op:C(this,Z),expressions:C(this,de)}}};de=new WeakMap,Z=new WeakMap;var fe,q,Y=class{constructor(e){P(this,fe,[{type:"unknown"},{type:"unknown"}]);P(this,q,void 0);this.type="booleanCondition";F(this,q,e)}get op(){return C(this,q)}get expressions(){return C(this,fe)}toJSON(){return{type:this.type,op:C(this,q),expressions:C(this,fe).map(e=>{var o;return(o=e.toJSON)==null?void 0:o.call(e)})}}};fe=new WeakMap,q=new WeakMap;var H,me=class{constructor(e){P(this,H,void 0);this.type="conditionalExpression";F(this,H,[e?new Y(e):new _,{type:"unknown"},{type:"unknown"}])}get expressions(){return C(this,H)}get condition(){return C(this,H)[0]}get truthyExpression(){return C(this,H)[1]}set truthyExpression(e){C(this,H)[1]=e}get falsyExpression(){return C(this,H)[2]}set falsyExpression(e){C(this,H)[2]=e}toJSON(){var e,o,n,r,s;return{type:this.type,condition:(o=(e=this.condition).toJSON)==null?void 0:o.call(e),truthyExpression:this.truthyExpression,falsyExpression:(s=(r=(n=this.falsyExpression)==null?void 0:n.toJSON)==null?void 0:r.call(n))!=null?s:this.falsyExpression}}};H=new WeakMap;var V=t=>t.type==="unknown",Pe=t=>t.type==="arithmeticExpression",Rr=t=>t.type==="callExpression",X=t=>t.type==="conditionalExpression",Sr=t=>t.type==="relationalExpression"||t.type==="booleanCondition";var Pr=t=>t.type==="booleanCondition",Ye=t=>(t==null?void 0:t.type)==="relationalExpression";var S=t=>{if(V(t))return t;if(Ye(t)){let[e,o]=t.expressions;if(w(e))return S(e);if(t.op==="unknown")return t;if(w(o))return S(o)}else if(Sr(t)){let{expressions:e=[]}=t;for(let o of e)if(w(o))return S(o)}else if(X(t)){let{condition:e,truthyExpression:o,falsyExpression:n}=t;if(w(e))return S(e);if(w(o))return S(o);if(w(n))return S(n)}else if(Pe(t)){let{expressions:e=[]}=t;for(let o of e)if(w(o))return S(o)}},Me=(t,e,o)=>{let{expressions:n=[]}=t;if(n.includes(e)){let r=n.indexOf(e);return n.splice(r,1,o),!0}else for(let r of n)if(Me(r,e,o))return!0;return!1},w=t=>V(t)?!0:X(t)?w(t.condition)||w(t.truthyExpression)||w(t.falsyExpression):Ye(t)||Pr(t)?t.op===void 0||t.expressions.some(e=>w(e)):!1,Bt=(t,e)=>{let o=S(t);o?o.expressions?o.expressions.push(e):console.warn("don't know how to treat targetExpression"):console.error("no target expression found")},x,B,_e=class{constructor(){P(this,x,void 0);P(this,B,[])}setCondition(e){if(C(this,x)===void 0)this.addExpression(new me(e));else if(X(C(this,x))){if(w(C(this,x).condition)){let o=e?new Y(e):new _;this.addExpression(o)}else if(V(C(this,x).truthyExpression))C(this,x).truthyExpression=new me(e);else if(w(C(this,x).truthyExpression)){let o=e?new Y(e):new _;this.addExpression(o)}else if(V(C(this,x).falsyExpression))C(this,x).falsyExpression=new me(e);else if(w(C(this,x).falsyExpression)){let o=e?new Y(e):new _;this.addExpression(o)}}else console.error("setCondition called unexpectedly")}addExpression(e){if(C(this,B).length>0){let o=C(this,B).at(-1);o==null||o.arguments.push(e)}else if(C(this,x)===void 0)F(this,x,e);else if(Pe(C(this,x))){let o=S(C(this,x));o&&V(o)&&Me(C(this,x),o,e)}else if(X(C(this,x))&&w(C(this,x))){let o=S(C(this,x));o&&V(o)?Me(C(this,x),o,e):o&&Bt(o,e)}}setFunction(e){let o=new Xe(e);this.addExpression(o),C(this,B).push(o)}setColumn(e){this.addExpression(new Ge(e))}setArithmeticOp(e){let o=e,n=C(this,x);Pe(n)&&(n.op=o)}setRelationalOperator(e){let o=e;if(C(this,x)&&X(C(this,x))){let n=S(C(this,x));Ye(n)?n.op=o:console.error(`no target expression found (op = ${e})`)}}setValue(e){let o=new Qe(e);if(C(this,x)===void 0)F(this,x,o);else if(Pe(C(this,x)))this.addExpression(o);else if(Rr(C(this,x)))C(this,x).arguments.push(o);else if(X(C(this,x)))if(w(C(this,x))){let n=S(C(this,x));n&&V(n)?Me(C(this,x),n,o):n&&Bt(n,o)}else console.log("what do we do with value, in a complete expression")}closeBrace(){C(this,B).pop()}get expression(){return C(this,x)}toJSON(){var e;return(e=C(this,x))==null?void 0:e.toJSON()}};x=new WeakMap,B=new WeakMap;var Wt=(t,e)=>{let o=new _e,n=t.cursor();do{let{name:r,from:s,to:i}=n;switch(r){case"AndCondition":o.setCondition("and");break;case"OrCondition":o.setCondition("or");break;case"RelationalExpression":o.setCondition();break;case"ArithmeticExpression":o.addExpression(new Ue);break;case"Column":{let l=e.substring(s,i);o.setColumn(l)}break;case"Function":{let l=e.substring(s,i);o.setFunction(l)}break;case"Times":case"Divide":case"Plus":case"Minus":{let l=e.substring(s,i);o.setArithmeticOp(l)}break;case"RelationalOperator":{let l=e.substring(s,i);o.setRelationalOperator(l)}break;case"False":case"True":{let l=e.substring(s,i);o.setValue(l==="true")}break;case"String":o.setValue(e.substring(s+1,i-1));break;case"Number":o.setValue(parseFloat(e.substring(s,i)));break;case"CloseBrace":o.closeBrace();break;default:}}while(n.next());return o.toJSON()};var Mr=Re.configure({strict:!0}),Qt=["Number","String"],Je=[...Qt,"AndCondition","ArithmeticExpression","BooleanOperator","RelationalOperatorOperator","CallExpression","CloseBrace","Column","Comma","ConditionalExpression","Divide","Equal","If","Minus","OpenBrace","OrCondition","ParenthesizedExpression","Plus","RelationalExpression","RelationalOperator","Times"],Gt=t=>{try{return Mr.parse(t),!0}catch{return!1}},Ze=t=>{let{lastChild:e}=t;for(;e&&!Je.includes(e.name);)e=e.prevSibling,console.log(e==null?void 0:e.name);return e},Ut=t=>{if((t==null?void 0:t.name)==="RelationalExpression"){let{firstChild:e}=t,o=Ze(t);if((e==null?void 0:e.name)==="Column"&&typeof(o==null?void 0:o.name)=="string"&&Qt.includes(o.name))return!0}return!1};import{HighlightStyle as Hr,syntaxHighlighting as Or,tags as Xt}from"@vuu-ui/vuu-codemirror";var Ar=Hr.define([{tag:Xt.variableName,color:"var(--vuuFilterEditor-variableColor)"},{tag:Xt.comment,color:"green",fontStyle:"italic"}]),_t=Or(Ar);import{EditorView as Lr}from"@vuu-ui/vuu-codemirror";var Yt=Lr.theme({"&":{border:"solid 1px var(--salt-container-primary-borderColor)",color:"var(--vuuFilterEditor-color)",backgroundColor:"var(--vuuFilterEditor-background)"},".cm-content":{caretColor:"var(--vuuFilterEditor-cursorColor)"},"&.cm-focused .cm-cursor":{borderLeftColor:"var(--vuuFilterEditor-cursorColor)"},"&.cm-focused .cm-selectionBackground, ::selection":{backgroundColor:"var(--vuuFilterEditor-selectionBackground)"},".cm-selectionBackground, ::selection":{backgroundColor:"var(--vuuFilterEditor-selectionBackground)"},".cm-scroller":{fontFamily:"var(--vuuFilterEditor-fontFamily)"},".cm-tooltip":{background:"var(--vuuFilterEditor-tooltipBackground)",border:"var(--vuuFilterEditor-tooltipBorder)",boxShadow:"var(--vuuFilterEditor-tooltipElevation)","&.cm-tooltip-autocomplete > ul":{fontFamily:"var(--vuuFilterEditor-fontFamily)",fontSize:"var(--vuuFilterEditor-fontSize)",maxHeight:"240px"},"&.cm-tooltip-autocomplete > ul > li":{height:"var(--vuuFilterEditor-suggestion-height)",padding:"0 3px",lineHeight:"var(--vuuFilterEditor-suggestion-height)"},"&.cm-tooltip-autocomplete li[aria-selected]":{background:"var(--vuuFilterEditor-suggestion-selectedBackground)",color:"var(--vuuFilterEditor-suggestion-selectedColor)"},"&.cm-tooltip-autocomplete li .cm-completionDetail":{color:"var(--vuuFilterEditor-suggestion-detailColor)"}}},{dark:!1});import{booleanJoinSuggestions as Nr,getNamedParentNode as Jt,getPreviousNode as kr,getValue as N,syntaxTree as Fr}from"@vuu-ui/vuu-codemirror";import{useCallback as Zt}from"react";var Ir=(t,e)=>e?t.map(o=>{var n;return{...o,apply:typeof o.apply=="function"?o.apply:`${e}${(n=o.apply)!=null?n:o.label}`}}):t,Kr=t=>t===void 0?!1:["Times","Divide","Plus","Minus"].includes(t.name),ge=t=>({apply:()=>{t==null||t()},label:"Done",boost:10}),j=(t,e)=>{var r;let{lastChild:o}=t,{pos:n}=e;for(;o;)if(o.from<n&&Je.includes(o.name)){if(o.name==="ParenthesizedExpression"){let i=(r=o.firstChild)==null?void 0:r.nextSibling;i&&(o=i)}return o}else o=o.prevSibling},qt=(t,e)=>{var o;if(t.name==="ArgList"){let n=t.prevSibling;if(n)return N(n,e)}else if(t.name==="OpenBrace"){let n=(o=t.parent)==null?void 0:o.prevSibling;if((n==null?void 0:n.name)==="Function")return N(n,e)}},jt=(t,e)=>{if(t.name==="RelationalExpression"){let o=Ze(t);if((o==null?void 0:o.name)==="RelationalOperator")return N(o,e)}else{let o=t.prevSibling;if((o==null?void 0:o.name)==="RelationalOperator")return N(o,e)}},et=(t,e)=>{var o;if(t.name==="RelationalExpression"){if(((o=t.firstChild)==null?void 0:o.name)==="Column")return N(t.firstChild,e)}else{let n=t.prevSibling;if((n==null?void 0:n.name)==="Column")return N(n,e);if((n==null?void 0:n.name)==="RelationalOperator")return et(n,e)}},qe=async(t,e,o,n={})=>{let r=await e.getSuggestions(o,n),{startsWith:s=""}=n;return{from:t.pos-s.length,options:r}},je=(t,e,o,n,r)=>{let s=j(t,e);switch(console.log(`conditional expression last child ${s==null?void 0:s.name}`),s==null?void 0:s.name){case"If":return qe(e,o,"expression",{prefix:"( "});case"OpenBrace":return qe(e,o,"expression");case"Condition":return qe(e,o,"expression",{prefix:", "});case"CloseBrace":if(n){let i=[ge(r)];return{from:e.pos,options:i}}}},zr=(t,e)=>{let o=[ge(e)];return{from:t.pos,options:o}},eo=(t,e)=>{let o=Zt(async(n,r,s={})=>{let i=await t.getSuggestions(r,s),{startsWith:l=""}=s;return{from:n.pos-l.length,options:i}},[t]);return Zt(async n=>{var d,b;let{state:r,pos:s}=n,i=(d=n.matchBefore(/\w*/))!=null?d:{from:0,to:0,text:void 0},u=Fr(r).resolveInner(s,-1),c=r.doc.toString(),m=Gt(c);switch(u.name){case"If":return console.log("conditional expression  If"),o(n,"expression",{prefix:"( "});case"Condition":{let a=j(u,n);if((a==null?void 0:a.name)==="Column"){let p=kr(a);if((p==null?void 0:p.name)!=="RelationalOperator")return o(n,"condition-operator",{columnName:N(a,r)})}else if((a==null?void 0:a.name)==="RelationalOperator")return o(n,"expression");console.log(`condition  last child ${a==null?void 0:a.name}`)}break;case"ConditionalExpression":return je(u,n,t);case"RelationalExpression":{if(Ut(u))return{from:n.pos,options:Nr.concat({label:", <truthy expression>, <falsy expression>",apply:", "})};{let a=jt(u,r),p=et(u,r);if(a)return o(n,"expression");{let g=await t.getSuggestions("condition-operator",{columnName:p});return{from:n.pos,options:g}}}}break;case"RelationalOperator":return o(n,"expression");case"String":{let a=jt(u,r),p=et(u,r),{from:g,to:f}=u;if(f-g===2&&n.pos===g+1){if(p&&a)return o(n,"columnValue",{columnName:p,operator:a,startsWith:i.text})}else if(f-g>2&&n.pos===f)return o(n,"expression",{prefix:", "})}break;case"ArithmeticExpression":{let a=j(u,n);if((a==null?void 0:a.name)==="Column")return o(n,"expression");if(Kr(a)){let p=a.name;return o(n,"column",{operator:p})}}break;case"OpenBrace":{let a=qt(u,r);return o(n,"expression",{functionName:a})}break;case"ArgList":{let a=qt(u,r),p=j(u,n),g=(p==null?void 0:p.name)==="OpenBrace"?void 0:",",f=await t.getSuggestions("expression",{functionName:a});return f=g?Ir(f,", "):f,(p==null?void 0:p.name)!=="OpenBrace"&&(p==null?void 0:p.name)!=="Comma"&&(f=[{apply:") ",boost:10,label:"Done - no more arguments"}].concat(f)),{from:n.pos,options:f}}case"Equal":if(c.trim()==="=")return o(n,"expression");break;case"ParenthesizedExpression":case"ColumnDefinitionExpression":if(n.pos===0)return o(n,"expression");{let a=j(u,n);if((a==null?void 0:a.name)==="Column"){if(m){let p=[ge(e.current)],g=N(a,r),f=await t.getSuggestions("operator",{columnName:g});return{from:n.pos,options:p.concat(f)}}}else if((a==null?void 0:a.name)==="CallExpression"){if(m)return{from:n.pos,options:[ge(e.current)]}}else if((a==null?void 0:a.name)==="ArithmeticExpression"){if(m){let p=[ge(e.current)],g=j(a,n);if((g==null?void 0:g.name)==="Column"){let f=N(g,r),h=await t.getSuggestions("operator",{columnName:f});p=p.concat(h)}return{from:n.pos,options:p}}}else if((a==null?void 0:a.name)==="ConditionalExpression")return je(a,n,t,m,e.current);break}case"Column":if(await t.isPartialMatch("expression",void 0,i.text))return o(n,"expression",{startsWith:i.text});break;case"Comma":{let a=Jt(u);if((a==null?void 0:a.name)==="ConditionalExpression")return o(n,"expression")}break;case"CloseBrace":{let a=Jt(u);if((a==null?void 0:a.name)==="ConditionalExpression")return je(a,n,t,m,e.current);if((a==null?void 0:a.name)==="ArgList"&&m)return zr(n,e.current)}break;default:((b=u==null?void 0:u.prevSibling)==null?void 0:b.name)==="FilterClause"&&console.log("looks like we ight be a or|and operator")}},[o,e,t])};var He=t=>{if(t.current==null)throw Error("EditorView not defined");return t.current},Xr=()=>"vuuSuggestion",_r=()=>console.log("noooop"),Yr=t=>"expressionType"in t,Jr=t=>{if(Yr(t)){let e=ro("div","expression-type-container"),o=ro("span","expression-type",t.expressionType);return e.appendChild(o),e}else return null},so=({onChange:t,onSubmitExpression:e,source:o,suggestionProvider:n})=>{let r=tt(null),s=tt(_r),i=tt(),l=eo(n,s),[u,c]=Ur(()=>{let m=()=>{let g=He(i),f=g.state.doc.toString(),h=Wr(g.state,g.state.doc.length,5e3);if(h){let v=Wt(h,f);return[f,v]}else return["",void 0]},d=()=>{He(i).setState(p())},b=()=>{let[g,f]=m();e==null||e(g,f)},a=g=>oo.of([{key:g,run(){return no(He(i)),!0}}]),p=()=>Br.create({doc:o,extensions:[Qr,Vr({addToOptions:[{render:Jr,position:70}],override:[l],optionClass:Xr}),$t(),oo.of($r),a("ArrowDown"),to.updateListener.of(g=>{let f=He(i);if(g.docChanged){no(f);let h=f.state.doc.toString();t==null||t(h)}}),Yt,_t]});return s.current=()=>{b()},[p,d]},[l,t,e,o]);return Gr(()=>{if(!r.current)throw Error("editor not in dom");return i.current=new to({state:u(),parent:r.current}),()=>{var m;(m=i.current)==null||m.destroy()}},[l,u]),{editorRef:r,clearInput:c}};import{jsx as qr}from"react/jsx-runtime";var Zr="vuuColumnExpressionInput",io=({onChange:t,onSubmitExpression:e,source:o="",suggestionProvider:n})=>{let{editorRef:r}=so({onChange:t,onSubmitExpression:e,source:o,suggestionProvider:n});return qr("div",{className:`${Zr}`,ref:r})};import{AnnotationType as jr,getRelationalOperators as es,numericOperators as ts,stringOperators as os,toSuggestions as ns}from"@vuu-ui/vuu-codemirror";import{getTypeaheadParams as rs,useTypeaheadSuggestions as ss}from"@vuu-ui/vuu-data-react";import{isNumericColumn as nt,isTextColumn as is}from"@vuu-ui/vuu-utils";import{useCallback as ot,useRef as ls}from"react";var ee=[{accepts:"string",description:"Returns multiple string values as a single joined string. Arguments may be string literal values, string columns or other string expressions. Non string arguments may also be included, these will be converted to strings.",example:{expression:'concatenate("example", "-test")',result:'"example-test"'},name:"concatenate",params:{description:"( string, string, [ string* ] )"},type:"string"},{accepts:["string","string"],description:"Tests a string value to determine whether it contains a given substring. Accepts two arguments: source text and target substring. Returns true if <source text> contains one or more occurrences of <target subscring>",example:{expression:'contains("Royal Bank of Scotland", "bank")',result:"true"},name:"contains",params:{description:"( string )"},type:"boolean"},{accepts:["string","number"],description:"Returns the leftmost <number> characters from <string>. First argument may be a string literal, string column or other string expression.",example:{expression:'left("USD Benchmark Report", 3)',result:'"USD"'},name:"left",params:{count:2,description:"( string, number )"},type:"string"},{accepts:"string",description:"Returns the number of characters in <string>. Argument may be a string literal, string column or other string expression.",example:{expression:'len("example")',result:"7"},name:"len",params:{description:"(string)"},type:"number"},{accepts:"string",description:"Convert a string value to lowercase. Argument may be a string column or other string expression.",example:{expression:'lower("examPLE")',result:'"example"'},name:"lower",params:{description:"( string )"},type:"string"},{accepts:"string",description:"Convert a string value to uppercase. Argument may be a string column or other string expression.",example:{expression:'upper("example")',result:'"EXAMPLE"'},name:"upper",params:{description:"( string )"},type:"string"},{accepts:["string","number"],description:"Returns the rightmost <number> characters from <string>. First argument may be a string literal, string column or other string expression.",example:{expression:"blah",result:"blah"},name:"right",params:{description:"( string )"},type:"string"},{accepts:["string","string","string"],description:"Replace characters within a string. Accepts three arguments: source text, text to replace and replacement text. Returns a copy of <source text> with any occurrences of <text to replace> replaced by <replacement text>",example:{expression:"blah",result:"blah"},name:"replace",params:{description:"( string )"},type:"string"},{accepts:"number",description:"Converts a number to a string.",example:{expression:"blah",result:"blah"},name:"text",params:{description:"( string )"},type:"string"},{accepts:"string",description:"Tests a string value to determine whether it starts with a given substring. Accepts two arguments: source text and target substring. Returns true if <source text> starts with <target subscring>.",example:{expression:"blah",result:"blah"},name:"starts",params:{description:"( string )"},type:"boolean"},{accepts:"string",description:"Tests a string value to determine whether it ends with a given substring. Accepts two arguments: source text and target substring. Returns true if <source text> ends with <target subscring>.",example:{expression:"blah",result:"blah"},name:"ends",params:{description:"( string )"},type:"boolean"},{accepts:"number",description:"blah",example:{expression:"blah",result:"blah"},name:"min",params:{description:"( string )"},type:"number"},{accepts:"number",description:"blah",example:{expression:"blah",result:"blah"},name:"max",params:{description:"( string )"},type:"number"},{accepts:"number",description:"blah",example:{expression:"blah",result:"blah"},name:"sum",params:{description:"( string )"},type:"number"},{accepts:"number",description:"blah",example:{expression:"blah",result:"blah"},name:"round",params:{description:"( string )"},type:"number"},{accepts:"any",description:"blah",example:{expression:"blah",result:"blah"},name:"or",params:{description:"( string )"},type:"boolean"},{accepts:"any",description:"blah",example:{expression:"blah",result:"blah"},name:"and",params:{description:"( string )"},type:"boolean"},{accepts:"any",description:"Return one of two possible result values, depending on the evaluation of a filter expression. If <filterExpression> resolves to true, result is <expression1>, otherwise <expression2>. ",example:{expression:"blah",result:"blah"},name:"if",params:{description:"( filterExpression, expression1, expression 2)"},type:"variable"}];import{createEl as k}from"@vuu-ui/vuu-utils";var lo=({name:t,description:e,example:o,params:n,type:r})=>{let s=k("div","vuuFunctionDoc"),i=k("div","function-heading"),l=k("span","function-name",t),u=k("span","param-list",n.description),c=k("span","function-type",r);i.appendChild(l),i.appendChild(u),i.appendChild(c);let m=k("p",void 0,e);if(s.appendChild(i),s.appendChild(m),o){let d=k("div","example-container","Example:"),b=k("div","example-expression",o.expression),a=k("div","example-result",o.result);d.appendChild(b),d.appendChild(a),s.appendChild(d)}return s};var as=[],W=t=>t.map(e=>{var o;return{...e,apply:((o=e.apply)!=null?o:e.label)+" "}}),us=(t,{functionName:e,operator:o})=>{if(o)return t.filter(nt);if(e){let n=ee.find(r=>r.name===e);if(n)switch(n.accepts){case"string":return t.filter(is);case"number":return t.filter(nt);default:return t}}return t},ao=(t,e)=>us(t,e).map(n=>{var s;let r=(s=n.label)!=null?s:n.name;return{apply:e.prefix?`${e.prefix}${r}`:r,label:r,boost:5,type:"column",expressionType:n.serverDataType}}),cs=[{apply:"* ",boost:2,label:"*",type:"operator"},{apply:"/ ",boost:2,label:"/",type:"operator"},{apply:"+ ",boost:2,label:"+",type:"operator"},{apply:"- ",boost:2,label:"-",type:"operator"}],ms=t=>t===void 0||nt(t)?cs:as,ps=t=>{switch(t.serverDataType){case"string":case"char":return W(os);case"int":case"long":case"double":return W(ts)}},rt=t=>({apply:`${t.name}( `,boost:2,expressionType:t.type,info:()=>lo(t),label:t.name,type:"function"}),ds=t=>{if(t){if(typeof t.accepts=="string")return t.accepts;if(Array.isArray(t.accepts))return t.accepts.every(e=>e==="string")?"string":"any"}return"any"},fs=ee.map(rt),gs=({functionName:t})=>{if(t){let e=ee.find(n=>n.name===t),o=ds(e);if(e)switch(o){case"string":return ee.filter(n=>n.type==="string"||n.type==="variable").map(rt);case"number":return ee.filter(n=>n.type==="number"||n.type==="variable").map(rt);default:}}return fs},Cs={},uo=({columns:t,table:e})=>{let o=ot(l=>l?t.find(u=>u.name===l):void 0,[t]),n=ls(),r=ss(),s=ot(async(l,u=Cs)=>{let{columnName:c,functionName:m,operator:d,prefix:b}=u;switch(l){case"expression":{let a=await W(ao(t,{functionName:m,prefix:b})).concat(gs(u));return n.current=a}case"column":{let a=await ao(t,u);return n.current=W(a)}case"operator":{let a=await ms(o(c));return n.current=W(a)}case"relational-operator":{let a=await es(o(c));return n.current=W(a)}case"condition-operator":{let a=o(c);if(a){let p=await ps(a);if(p)return n.current=W(p)}}break;case"columnValue":if(c&&d){let a=rs(e,c),p=await r(a);return n.current=ns(p,{suffix:""}),n.current.forEach(g=>{g.apply=(f,h,v)=>{let T=new jr,y=v+h.label.length+1;f.dispatch({changes:{from:v,insert:h.label},selection:{anchor:y,head:y},annotations:T.of(h)})}}),n.current}break}return[]},[t,o,r,e]),i=ot(async(l,u,c)=>{let{current:m}=n,d=!1,b=m||await s(l,{columnName:u});if(c&&b)for(let a of b){if(a.label===c)return!1;a.label.startsWith(c)&&(d=!0)}return d},[s]);return{getSuggestions:s,isPartialMatch:i}};import{getCalculatedColumnDetails as co,setCalculatedColumnExpression as bs,setCalculatedColumnName as hs,setCalculatedColumnType as xs}from"@vuu-ui/vuu-utils";import{useCallback as Oe,useRef as ys,useState as vs}from"react";var Ts=t=>{let[e,o,n]=co(t);return n===""?{...t,name:`${e}:${o}:string`}:t},mo=({column:t,onSave:e})=>{let[o,n]=vs(Ts(t)),r=ys(co(o)[1]),s=Oe(c=>{let{value:m}=c.target;n(d=>hs(d,m))},[]),i=Oe(c=>{r.current=c.trim()},[]),l=Oe((c,m)=>{typeof m=="string"&&n(d=>xs(d,m))},[]),u=Oe(()=>{let c=bs(o,r.current);n(c),e(c)},[o,e]);return{column:o,onChangeExpression:i,onChangeName:s,onChangeType:l,onSave:u}};import{jsx as M,jsxs as be}from"react/jsx-runtime";var Ce="vuuColumnExpressionPanel",po=({column:t,onSave:e,tableConfig:o,vuuTable:n})=>{let r=Ms(null),{column:s,onChangeExpression:i,onChangeName:l,onChangeType:u,onSave:c}=mo({column:t,onSave:e}),m=uo({columns:o.columns,table:n}),d=Ps(()=>{requestAnimationFrame(()=>{var b,a;(a=(b=r.current)==null?void 0:b.querySelector("button"))==null||a.focus()})},[]);return be("div",{className:Ce,children:[M("div",{className:"vuuColumnSettingsPanel-header",children:M("span",{children:"Calculation"})}),be(it,{"data-field":"column-name",children:[M(lt,{children:"Column Name"}),M(Ss,{className:"vuuInput",onChange:l,value:Ds(s)})]}),be(it,{"data-field":"column-expression",children:[M(lt,{children:"Expression"}),M(io,{onChange:i,onSubmitExpression:d,source:ws(s),suggestionProvider:m})]}),be(it,{"data-field":"type",children:[M(lt,{children:"Column type"}),M(Es,{className:`${Ce}-type`,onSelectionChange:u,ref:r,selected:Rs(s)||null,source:["double","long","string"],width:"100%"})]}),be("div",{className:"vuuColumnSettingsPanel-buttonBar","data-align":"right",children:[M(st,{className:`${Ce}-buttonCancel`,tabIndex:-1,children:"cancel"}),M(st,{className:`${Ce}-buttonApply`,tabIndex:-1,children:"apply"}),M(st,{className:`${Ce}-buttonSave`,onClick:c,variant:"cta",children:"save"})]})]})};import{VuuInput as Co}from"@vuu-ui/vuu-ui-controls";import{jsx as E,jsxs as K}from"react/jsx-runtime";var he="vuuColumnSettingsPanel",Cm=({column:t,onConfigChange:e,onCreateCalculatedColumn:o,tableConfig:n,vuuTable:r})=>{let s=t.name==="::",{availableRenderers:i,selectedCellRenderer:l,column:u,navigateNextColumn:c,navigatePrevColumn:m,onChange:d,onChangeFormatting:b,onChangeRenderer:a,onInputCommit:p,onSave:g}=Vt({column:t,onConfigChange:e,onCreateCalculatedColumn:o,tableConfig:n}),{serverDataType:f,align:h=Hs(f),name:v,label:T=v,pin:y,width:R}=u;return K("div",{className:he,children:[E("div",{className:`${he}-header`,children:E("span",{children:v})}),K(Ae,{"data-field":"column-label",children:[E(Le,{children:"Column Label"}),E(Co,{className:"vuuInput",onChange:d,onCommit:p,value:T})]}),K(Ae,{"data-field":"column-width",children:[E(Le,{children:"Column Width"}),E(Co,{className:"vuuInput",onChange:d,value:R,onCommit:p})]}),K(Ae,{"data-field":"column-alignment",children:[E(Le,{children:"Alignment"}),K(go,{className:"vuuToggleButtonGroup",onChange:d,value:h,children:[E(te,{"data-icon":"align-left",className:"vuuIconToggleButton",value:"left"}),E(te,{"data-icon":"align-right",className:"vuuIconToggleButton",value:"right"})]})]}),K(Ae,{"data-field":"column-pin",children:[E(Le,{children:"Pin Column"}),K(go,{className:"vuuToggleButtonGroup",onChange:d,value:y!=null?y:"",children:[E(te,{className:"vuuIconToggleButton","data-icon":"cross-circle",value:""}),E(te,{className:"vuuIconToggleButton","data-icon":"pin-left",value:"left"}),E(te,{className:"vuuIconToggleButton","data-icon":"pin-float",value:"floating"}),E(te,{className:"vuuIconToggleButton","data-icon":"pin-right",value:"right"})]})]}),E(Ft,{availableRenderers:i,selectedCellRenderer:l,column:u,onChangeFormatting:b,onChangeRenderer:a}),Os(u.name)?E(po,{column:u,onSave:g,tableConfig:n,vuuTable:r}):K("div",{className:`${he}-buttonBar`,"data-align":s?"right":void 0,children:[E(fo,{className:`${he}-buttonNavPrev`,variant:"secondary","data-icon":"arrow-left",onClick:m,children:"PREVIOUS"}),E(fo,{className:`${he}-buttonNavNext`,variant:"secondary","data-icon":"arrow-right",onClick:c,children:"NEXT"})]})]})};import{useEffect as As,useState as bo}from"react";import Ls from"classnames";import{jsx as oe,jsxs as Ns}from"react/jsx-runtime";var xe="vuuDatasourceStats",at=new Intl.NumberFormat,Sm=({className:t,dataSource:e})=>{let[o,n]=bo(e.range),[r,s]=bo(e.size);As(()=>{s(e.size),e.on("resize",s),e.on("range",n)},[e]);let i=Ls(xe,t),l=at.format(o.from),u=at.format(o.to-1),c=at.format(r);return Ns("div",{className:i,children:[oe("span",{className:`${xe}-label`,children:"Row count"}),oe("span",{className:`${xe}-range`,children:l}),oe("span",{children:"-"}),oe("span",{className:`${xe}-range`,children:u}),oe("span",{children:"of"}),oe("span",{className:`${xe}-size`,children:c})]})};import{Button as Vl,FormField as bt,FormFieldLabel as ht,Input as $l,ToggleButton as re,ToggleButtonGroup as Bl}from"@salt-ds/core";import{useLayoutEffectSkipFirst as Ol}from"@vuu-ui/vuu-layout";import{useCallback as km,useRef as Fm}from"react";import{jsx as zm}from"react/jsx-runtime";import{isNumericColumn as Bm}from"@vuu-ui/vuu-utils";import{removeColumnFromFilter as Gm}from"@vuu-ui/vuu-utils";import{addGroupColumn as Xm,addSortColumn as _m,AggregationType as ks,setAggregations as Ym,setSortColumn as Jm}from"@vuu-ui/vuu-utils";var{Average:Zm,Count:qm,Distinct:jm,High:ep,Low:tp,Sum:op}=ks;import{ContextMenuProvider as bb}from"@vuu-ui/vuu-popups";import{Button as xb,useIdMemo as yb}from"@salt-ds/core";import{buildColumnMap as jd,getColumnStyle as ef,isGroupColumn as tf,metadataKeys as pi,notHidden as of,visibleColumnAtIndex as nf}from"@vuu-ui/vuu-utils";import{useCallback as lf,useMemo as af}from"react";import{isGroupColumn as vo,isJsonColumn as Js,isJsonGroup as Zs,metadataKeys as qs,notHidden as js,RowSelected as ei}from"@vuu-ui/vuu-utils";import ti from"classnames";import{memo as oi,useCallback as To}from"react";import{getColumnStyle as Fs,metadataKeys as Is}from"@vuu-ui/vuu-utils";import{EditableLabel as Ks}from"@vuu-ui/vuu-ui-controls";import zs from"classnames";import{memo as Vs,useCallback as $s,useRef as Bs,useState as ho}from"react";import{jsx as Ne}from"react/jsx-runtime";var{KEY:xo}=Is,ut=Vs(({className:t,column:e,columnMap:o,onClick:n,row:r})=>{let s=Bs(null),{align:i,CellRenderer:l,key:u,pin:c,editable:m,resizing:d,valueFormatter:b}=e,[a,p]=ho(!1),g=b(r[u]),[f,h]=ho(g),v=()=>{var O;(O=s.current)==null||O.focus()},T=O=>{O.key==="Enter"&&p(!0)},y=$s(O=>{n==null||n(O,e)},[e,n]),R=()=>{p(!0)},se=(O="",vt="",Wo=!0,Qo=!1)=>{var Tt;p(!1),Qo?h(O):vt!==O&&h(vt),Wo===!1&&((Tt=s.current)==null||Tt.focus())},Ke=zs(t,{vuuAlignRight:i==="right",vuuPinFloating:c==="floating",vuuPinLeft:c==="left",vuuPinRight:c==="right","vuuTableCell-resizing":d})||void 0,yt=Fs(e);return m?Ne("div",{className:Ke,"data-editable":!0,role:"cell",style:yt,onKeyDown:T,children:Ne(Ks,{editing:a,value:f,onChange:h,onMouseDownCapture:v,onEnterEditMode:R,onExitEditMode:se,onKeyDown:T,ref:s,tabIndex:0},"title")}):Ne("div",{className:Ke,role:"cell",style:yt,onClick:y,children:l?Ne(l,{column:e,columnMap:o,row:r}):g})},Ws);ut.displayName="TableCell";function Ws(t,e){return t.column===e.column&&t.onClick===e.onClick&&t.row[xo]===e.row[xo]&&t.row[t.column.key]===e.row[e.column.key]}import{getColumnStyle as Qs,getGroupValueAndOffset as Gs,metadataKeys as Us}from"@vuu-ui/vuu-utils";import{useCallback as Xs}from"react";import{jsx as ct,jsxs as Ys}from"react/jsx-runtime";var{IS_LEAF:_s}=Us,yo=({column:t,onClick:e,row:o})=>{let{columns:n}=t,[r,s]=Gs(n,o),i=Xs(m=>{e==null||e(m,t)},[t,e]),l=Qs(t),u=o[_s],c=Array(s).fill(0).map((m,d)=>ct("span",{className:"vuuTableGroupCell-spacer"},d));return Ys("div",{className:"vuuTableGroupCell vuuPinLeft",onClick:u?void 0:i,role:"cell",style:l,children:[c,u?null:ct("span",{className:"vuuTableGroupCell-toggle","data-icon":"triangle-right"}),ct("span",{children:r})]})};import{jsx as wo,jsxs as ui}from"react/jsx-runtime";var{IDX:ni,IS_EXPANDED:ri,SELECTED:si}=qs,{True:Eo,First:ii,Last:li}=ei,ne="vuuTableRow",ai=oi(function({columnMap:e,columns:o,offset:n,onClick:r,onToggleGroup:s,virtualColSpan:i=0,row:l}){let{[ni]:u,[ri]:c,[si]:m}=l,d=ti(ne,{[`${ne}-even`]:u%2===0,[`${ne}-expanded`]:c,[`${ne}-selected`]:m&Eo,[`${ne}-selectedStart`]:m&ii,[`${ne}-selectedEnd`]:m&li}),b=To(p=>{let g=p.shiftKey,f=p.ctrlKey||p.metaKey;r==null||r(l,g,f)},[r,l]),a=To((p,g)=>{(vo(g)||Zs(g,l))&&(p.stopPropagation(),s==null||s(l,g))},[s,l]);return ui("div",{"aria-selected":m&Eo?!0:void 0,"aria-rowindex":u,className:d,onClick:b,role:"row",style:{transform:`translate3d(0px, ${n}px, 0px)`},children:[i>0?wo("div",{role:"cell",style:{width:i}}):null,o.filter(js).map(p=>{let g=vo(p),f=Js(p);return wo(g?yo:ut,{column:p,columnMap:e,onClick:g||f?a:void 0,row:l},p.name)})]})});import Xp from"classnames";import{useRef as Jp}from"react";import{useCallback as $p,useRef as Bp}from"react";import{jsx as td,jsxs as od}from"react/jsx-runtime";import Od from"classnames";import{useCallback as kd,useRef as Fd}from"react";import ld from"classnames";import{jsx as cd,jsxs as md}from"react/jsx-runtime";import{useContextMenu as Bd}from"@vuu-ui/vuu-popups";import{useContextMenu as hd}from"@vuu-ui/vuu-popups";import yd from"classnames";import{useCallback as Ed}from"react";import{jsx as Rd}from"react/jsx-runtime";import{jsx as Gd,jsxs as Ud}from"react/jsx-runtime";import{jsx as gf,jsxs as Cf}from"react/jsx-runtime";var{RENDER_IDX:df}=pi;import{useContextMenu as kC}from"@vuu-ui/vuu-popups";import{applySort as IC,buildColumnMap as KC,isJsonGroup as zC,metadataKeys as Si,moveItemDeprecated as VC}from"@vuu-ui/vuu-utils";import{useCallback as WC,useEffect as QC,useMemo as GC,useRef as UC,useState as XC}from"react";import{isVuuFeatureAction as xf,isVuuFeatureInvocation as yf}from"@vuu-ui/vuu-data-react";import{getFullRange as Tf,metadataKeys as di,WindowRange as Ef}from"@vuu-ui/vuu-utils";import{useCallback as Df,useEffect as Rf,useMemo as Sf,useRef as Pf,useState as Mf}from"react";var{SELECTED:Hf}=di;import{useDragDropNext as Lf}from"@vuu-ui/vuu-ui-controls";import{useCallback as Ff,useRef as If}from"react";import{withinRange as Qf}from"@vuu-ui/vuu-utils";import{useCallback as Yf,useEffect as Jf,useLayoutEffect as Zf,useMemo as qf,useRef as jf}from"react";function fi(t,...e){let o=new Set(t);for(let n of e)for(let r of n)o.add(r);return o}var Do="ArrowUp",Ro="ArrowDown",So="ArrowLeft",Po="ArrowRight";var Mo="Home",Ho="End",Oo="PageUp",Ao="PageDown";var gi=new Set(["Enter","Delete"," "]),Ci=new Set(["Tab"]),bi=new Set(["ArrowRight","ArrowLeft"]),hi=new Set([Mo,Ho,Oo,Ao,Ro,So,Po,Do]),xi=new Set(["F1","F2","F3","F4","F5","F6","F7","F8","F9","F10","F11","F12"]),zf=fi(gi,hi,bi,xi,Ci);import{isValidNumber as dg}from"@vuu-ui/vuu-utils";import{useCallback as Cg,useMemo as bg,useRef as hg,useState as xg}from"react";import{useCallback as ig,useEffect as lg,useRef as ag}from"react";var yi=new Map,vi=(t,e,o)=>{switch(o){case"height":return e.height;case"clientHeight":return t.clientHeight;case"clientWidth":return t.clientWidth;case"contentHeight":return e.contentHeight;case"contentWidth":return e.contentWidth;case"scrollHeight":return Math.ceil(t.scrollHeight);case"scrollWidth":return Math.ceil(t.scrollWidth);case"width":return e.width;default:return 0}},ug=new ResizeObserver(t=>{for(let e of t){let{target:o,borderBoxSize:n,contentBoxSize:r}=e,s=yi.get(o);if(s){let[{blockSize:i,inlineSize:l}]=n,[{blockSize:u,inlineSize:c}]=r,{onResize:m,measurements:d}=s,b=!1;for(let[a,p]of Object.entries(d)){let g=vi(o,{height:i,width:l,contentHeight:u,contentWidth:c},a);g!==p&&(b=!0,d[a]=g)}b&&m&&m(d)}}});import{deselectItem as wg,isRowSelected as Dg,metadataKeys as Ti,selectItem as Rg}from"@vuu-ui/vuu-utils";import{useCallback as Pg,useRef as Mg}from"react";var{IDX:Hg}=Ti;import{applyFilterToColumns as Lg,applyGroupByToColumns as Ng,applySortToColumns as kg,findColumn as Fg,getCellRenderer as Ig,getColumnName as Kg,getTableHeadings as zg,getValueFormatter as Vg,isFilteredColumn as $g,isGroupColumn as Bg,isPinned as Wg,isTypeDescriptor as Qg,metadataKeys as Ei,updateColumn as Gg,sortPinnedColumns as Ug,stripFilterFromColumns as Xg,moveItemDeprecated as _g,getDefaultAlignment as Yg}from"@vuu-ui/vuu-utils";import{useReducer as qg}from"react";var jg=Ei.count;import{useCallback as oC,useRef as nC}from"react";import{useCallback as iC,useMemo as lC,useRef as aC}from"react";import{actualRowPositioning as cC,virtualRowPositioning as fC}from"@vuu-ui/vuu-utils";import{getColumnsInViewport as bC,itemsChanged as hC}from"@vuu-ui/vuu-utils";import{useCallback as vC,useEffect as TC,useMemo as EC,useRef as wC,useState as DC}from"react";var{KEY:ib,IS_EXPANDED:lb,IS_LEAF:ab}=Si;import Db from"classnames";import{isDataLoading as Mb}from"@vuu-ui/vuu-utils";import{jsx as Ob,jsxs as Ab}from"react/jsx-runtime";import Mi from"classnames";import{isJsonAttribute as Hi,metadataKeys as Oi,registerComponent as Ai}from"@vuu-ui/vuu-utils";import{jsx as mt,jsxs as Ii}from"react/jsx-runtime";var ye="vuuJsonCell",{IS_EXPANDED:Li,KEY:Ni}=Oi,ki=t=>{let e=t.lastIndexOf("|");return e===-1?"":t.slice(e+1)},Fi=({column:t,row:e})=>{let{key:o}=t,n=e[o],r=!1;Hi(n)&&(n=n.slice(0,-1),r=!0);let s=ki(e[Ni]),i=Mi({[`${ye}-name`]:s===n,[`${ye}-value`]:s!==n,[`${ye}-group`]:r});if(r){let l=e[Li]?"minus-box":"plus-box";return Ii("span",{className:i,children:[mt("span",{className:`${ye}-value`,children:n}),mt("span",{className:`${ye}-toggle`,"data-icon":l})]})}else return n?mt("span",{className:i,children:n}):null};Ai("json",Fi,"cell-renderer",{description:"JSON formatter",label:"JSON formatter",serverDataType:"json"});import rx from"classnames";import{useRef as ix}from"react";import{useCallback as oh,useRef as nh}from"react";import{jsx as ih}from"react/jsx-runtime";import{useCallback as ch,useRef as mh,useState as ph}from"react";import{getColumnStyle as Ki}from"@vuu-ui/vuu-utils";import zi from"classnames";import{useMemo as Vi}from"react";var Q=(t,e,o)=>Vi(()=>{let n=zi(e,{vuuPinFloating:t.pin==="floating",vuuPinLeft:t.pin==="left",vuuPinRight:t.pin==="right",vuuEndPin:o&&t.endPin,[`${e}-editable`]:t.editable,[`${e}-right`]:t.align==="right"}),r=Ki(t);return{className:n,style:r}},[t,e,o]);import wh from"classnames";import{useCallback as Ph}from"react";import{jsx as Oh,jsxs as Ah}from"react/jsx-runtime";import{jsx as Vh,jsxs as $h}from"react/jsx-runtime";import{jsx as _h,jsxs as Yh}from"react/jsx-runtime";import{jsx as dx,jsxs as fx}from"react/jsx-runtime";import{createElement as px}from"react";import hx from"classnames";import{useCallback as yx,useRef as vx,useState as Tx}from"react";import{OverflowContainer as Sx,useLayoutEffectSkipFirst as Px}from"@vuu-ui/vuu-layout";import{jsx as Ax,jsxs as Lx}from"react/jsx-runtime";import{createElement as Ox}from"react";import{useCallback as ly,useRef as ay}from"react";import{useContextMenu as zx}from"@vuu-ui/vuu-popups";import $x from"classnames";import{useCallback as Gx,useRef as Ux,useState as Xx}from"react";import{jsx as Jx}from"react/jsx-runtime";import dy from"classnames";import{jsx as hy,jsxs as xy}from"react/jsx-runtime";import{ContextMenuProvider as $E}from"@vuu-ui/vuu-popups";import{isGroupColumn as WE,metadataKeys as fl,notHidden as QE}from"@vuu-ui/vuu-utils";import UE from"classnames";import{useRef as JE}from"react";import{isGroupColumn as Ko,isJsonColumn as qi,isJsonGroup as ji,metadataKeys as el,notHidden as tl,RowSelected as ol}from"@vuu-ui/vuu-utils";import nl from"classnames";import{memo as rl,useCallback as zo}from"react";import{metadataKeys as Bi}from"@vuu-ui/vuu-utils";import{useCallback as Wi}from"react";import{jsx as ko}from"react/jsx-runtime";var{IDX:Qi}=Bi,Gi="vuuTableNextCell",Fo=({column:t,columnMap:e,onDataEdited:o,row:n})=>{let{className:r,style:s}=Q(t,Gi),{CellRenderer:i,name:l,valueFormatter:u}=t,c=e[l],m=Wi(d=>(o==null||o(n[Qi],l,d),!0),[l,o,n]);return ko("div",{className:r,role:"cell",style:s,children:i?ko(i,{column:t,columnMap:e,onCommit:m,row:n}):u(n[c])})};import{getGroupValueAndOffset as Ui,metadataKeys as Xi}from"@vuu-ui/vuu-utils";import{useCallback as _i}from"react";import Yi from"classnames";import{jsx as ft,jsxs as Zi}from"react/jsx-runtime";var{IS_LEAF:Ji}=Xi,dt="vuuTableNextGroupCell",Io=({column:t,onClick:e,row:o})=>{let{columns:n}=t,[r,s]=Ui(n,o),{className:i,style:l}=Q(t,dt),u=_i(d=>{e==null||e(d,t)},[t,e]),c=o[Ji],m=Array(s).fill(0).map((d,b)=>ft("span",{className:`${dt}-spacer`},b));return Zi("div",{className:Yi(i,"vuuTableNextCell"),role:"cell",style:l,onClick:c?void 0:u,children:[m,c?null:ft("span",{className:`${dt}-toggle`,"data-icon":"triangle-right"}),ft("span",{children:r})]})};import{jsx as gt}from"react/jsx-runtime";import{createElement as al}from"react";var{IDX:sl,IS_EXPANDED:il,SELECTED:ll}=el,z="vuuTableNextRow",Vo=rl(({className:t,columnMap:e,columns:o,row:n,offset:r,onClick:s,onDataEdited:i,onToggleGroup:l,zebraStripes:u=!1,...c})=>{let{[sl]:m,[il]:d,[ll]:b}=n,a=zo(y=>{let R=y.shiftKey,se=y.ctrlKey||y.metaKey;s==null||s(n,R,se)},[s,n]),{True:p,First:g,Last:f}=ol,h=nl(z,t,{[`${z}-even`]:u&&m%2===0,[`${z}-expanded`]:d,[`${z}-selected`]:b&p,[`${z}-selectedStart`]:b&g,[`${z}-selectedEnd`]:b&f}),v={transform:`translate3d(0px, ${r}px, 0px)`},T=zo((y,R)=>{(Ko(R)||ji(R,n))&&(y.stopPropagation(),l==null||l(n,R))},[l,n]);return al("div",{...c,"aria-rowindex":n[0],key:`row-${n[0]}`,role:"row",className:h,onClick:a,style:v},gt("span",{className:`${z}-selectionDecorator vuuStickyLeft`}),o.filter(tl).map(y=>{let R=Ko(y),se=qi(y);return gt(R?Io:Fo,{column:y,columnMap:e,onClick:R||se?T:void 0,onDataEdited:i,row:n},y.key)}),gt("span",{className:`${z}-selectionDecorator vuuStickyRight`}))});Vo.displayName="Row";import{useLayoutEffectSkipFirst as ZT}from"@vuu-ui/vuu-layout";import{useDragDropNext as eE}from"@vuu-ui/vuu-ui-controls";import{useCallback as dv,useEffect as fv,useMemo as gv,useRef as Cv}from"react";import{applySort as nE,buildColumnMap as rE,isGroupColumn as sE,isJsonGroup as iE,isValidNumber as lE,metadataKeys as pl,updateColumn as aE,visibleColumnAtIndex as uE}from"@vuu-ui/vuu-utils";import{useCallback as fE,useEffect as gE,useMemo as CE,useState as bE}from"react";var ke=(t,e)=>{switch(e.type){case"col-size":return{...t,columns:t.columns.map(o=>o.name===e.column.name?{...o,width:e.width}:o)};case"column-prop":return{...t,columns:t.columns.map(o=>o.name===e.column.name?{...o,[e.property]:e.value}:o)};default:return t}};import{isVuuFeatureAction as Sv,isVuuFeatureInvocation as Pv}from"@vuu-ui/vuu-data-react/src";import{getFullRange as Hv,NULL_RANGE as Ov}from"@vuu-ui/vuu-utils";import{useCallback as Lv,useEffect as Nv,useMemo as kv,useRef as Fv,useState as Iv}from"react";import{metadataKeys as ul,WindowRange as Tv}from"@vuu-ui/vuu-utils";var{SELECTED:Ev}=ul;import{useMemo as $v,useRef as Bv}from"react";import{buildColumnMap as Gv}from"@vuu-ui/vuu-utils";import{useCallback as _v}from"react";import{useContextMenu as Jv}from"@vuu-ui/vuu-popups";import{isCharacterKey as eT}from"@vuu-ui/vuu-utils";import{useCallback as nT}from"react";import{applyFilterToColumns as lT,applyGroupByToColumns as aT,applySortToColumns as uT,getCellRenderer as cT,getTableHeadings as mT,getValueFormatter as pT,hasValidationRules as dT,isFilteredColumn as fT,isGroupColumn as gT,isPinned as CT,isTypeDescriptor as bT,logger as cl,metadataKeys as ml,moveItem as hT,sortPinnedColumns as xT,stripFilterFromColumns as yT,subscribedOnly as vT}from"@vuu-ui/vuu-utils";import{buildValidationChecker as ET}from"@vuu-ui/vuu-ui-controls";import{useReducer as RT}from"react";var{info:ST}=cl("useTableModel");var PT=ml.count;import{useCallback as OT,useRef as AT}from"react";import{useCallback as kT,useEffect as FT,useRef as IT}from"react";var{KEY:AE,IS_EXPANDED:LE,IS_LEAF:NE}=pl;import{MeasuredContainer as tw,useId as ow}from"@vuu-ui/vuu-layout";import{jsx as lw,jsxs as uw}from"react/jsx-runtime";import{createElement as aw}from"react";var{IDX:rw,RENDER_IDX:sw}=fl;import{Dropdown as gl}from"@vuu-ui/vuu-ui-controls";import{isColumnTypeRenderer as Cl,isTypeDescriptor as bl,registerComponent as hl}from"@vuu-ui/vuu-utils";import{useCallback as xl,useState as yl}from"react";import{jsx as wl}from"react/jsx-runtime";var vl="vuuTableDropdownCell",Tl=["Enter"," "],El=({column:t,columnMap:e,row:o})=>{var u,c,m;let n=bl(t.type)&&Cl((u=t.type)==null?void 0:u.renderer)?(m=(c=t.type)==null?void 0:c.renderer)==null?void 0:m.values:[],r=e[t.name],[s,i]=yl(o[r]),l=xl((d,b)=>{b&&i(b)},[]);return wl(gl,{className:vl,onSelectionChange:l,openKeys:Tl,selected:s,source:n,width:t.width-17})};hl("dropdown-cell",El,"cell-renderer",{});import{registerComponent as Dl}from"@vuu-ui/vuu-utils";import{Input as Rl}from"@salt-ds/core";import{useEditableText as Sl}from"@vuu-ui/vuu-ui-controls";import Pl from"classnames";import{jsx as Ct}from"react/jsx-runtime";var Fe="vuuTableInputCell",Ml=()=>(console.warn("onCommit handler has not been provided to InputCell cell renderer"),!0),Hl=({column:t,columnMap:e,onCommit:o=Ml,row:n})=>{let r=e[t.name],{align:s="left",clientSideEditValidationCheck:i,valueFormatter:l}=t,{warningMessage:u,...c}=Sl({initialValue:l(n[r]),onCommit:o,clientSideEditValidationCheck:i}),m=u&&s==="left"?Ct("span",{className:`${Fe}-icon`,"data-icon":"error"}):void 0,d=u&&s==="right"?Ct("span",{className:`${Fe}-icon`,"data-icon":"error"}):void 0;return Ct(Rl,{...c,className:Pl(Fe,{[`${Fe}-error`]:u!==void 0}),endAdornment:m,startAdornment:d})};Dl("input-cell",Hl,"cell-renderer",{});import{addColumnToSubscribedColumns as Al,isCalculatedColumn as Ll,moveItem as Nl,subscribedOnly as kl}from"@vuu-ui/vuu-utils";import{useCallback as Ie,useMemo as Fl,useState as Il}from"react";var Kl=(t,e)=>{let o=[];for(let{name:n}of t){let r=e.find(s=>s.name===n);r&&o.push(r)}return o},zl=(t,e)=>t.map(({name:o,serverDataType:n})=>{let r=e.find(s=>s.name===o);return{hidden:r==null?void 0:r.hidden,isCalculated:Ll(o),label:r==null?void 0:r.label,name:o,serverDataType:n,subscribed:r!==void 0}}),Bo=({availableColumns:t,onConfigChange:e,onDataSourceConfigChange:o,tableConfig:n})=>{let[{availableColumns:r,tableConfig:s},i]=Il({availableColumns:t,tableConfig:n}),l=Fl(()=>zl(r,s.columns),[r,s.columns]),u=Ie((a,p)=>{i(g=>{let f=Nl(g.availableColumns,a,p),h=Kl(f,s.columns);return{availableColumns:f,tableConfig:{...g.tableConfig,columns:h}}})},[s.columns]),c=Ie((a,p,g)=>{let f=l.find(h=>h.name===a);if(p==="subscribed")if(f!=null&&f.subscribed){let h=s.columns.filter(v=>v.name!==a).map(v=>v.name);i(v=>({...v,tableConfig:{...s,columns:s.columns.filter(kl(h))}})),o({columns:h})}else{let h={...s,columns:Al(s.columns,r,a)};i(T=>({...T,tableConfig:h}));let v=h.columns.map(T=>T.name);o({columns:v})}else if(f!=null&&f.subscribed){let h=s.columns.find(v=>v.name===a);if(h){let v=ke(s,{type:"column-prop",property:p,column:h,value:g});i(T=>({...T,tableConfig:v}))}}},[r,l,o,s]),m=Ie(a=>{let{value:p}=a.target,g=p==="0"?void 0:p==="1"?"capitalize":"uppercase";i(f=>({...f,tableConfig:{...f.tableConfig,columnFormatHeader:g}}))},[]),d=Ie(a=>{let{ariaChecked:p,value:g}=a.target;i(f=>({...f,tableConfig:{...f.tableConfig,[g]:p!=="true"}}))},[]);Ol(()=>{e==null||e(s)},[e,s]);let b=s.columnFormatHeader===void 0?0:s.columnFormatHeader==="capitalize"?1:2;return{columnItems:l,columnLabelsValue:b,onChangeColumnLabels:m,onChangeTableAttribute:d,onColumnChange:c,onMoveListItem:u,tableConfig:s}};import{jsx as D,jsxs as G}from"react/jsx-runtime";var xt="vuuTableSettingsPanel",lD=({availableColumns:t,onAddCalculatedColumn:e,onConfigChange:o,onDataSourceConfigChange:n,tableConfig:r,...s})=>{let{columnItems:i,columnLabelsValue:l,onChangeColumnLabels:u,onChangeTableAttribute:c,onColumnChange:m,onMoveListItem:d,tableConfig:b}=Bo({availableColumns:t,onConfigChange:o,onDataSourceConfigChange:n,tableConfig:r});return G("div",{...s,className:xt,children:[G(bt,{children:[D(ht,{children:"Column Labels"}),G(Bl,{className:"vuuToggleButtonGroup",onChange:u,value:l,children:[D(re,{className:"vuuIconToggleButton","data-icon":"text-strikethrough",value:0}),D(re,{className:"vuuIconToggleButton","data-icon":"text-Tt",value:1}),D(re,{className:"vuuIconToggleButton","data-icon":"text-T",value:2})]})]}),G(bt,{children:[D(ht,{children:"Grid separators"}),G("div",{className:"saltToggleButtonGroup vuuToggleButtonGroup saltToggleButtonGroup-horizontal vuuGridSeparators",children:[D(re,{className:"vuuIconToggleButton","data-icon":"row-striping",selected:b.zebraStripes,onChange:c,value:"zebraStripes"}),D(re,{className:"vuuIconToggleButton","data-icon":"row-lines",selected:b.rowSeparators,onChange:c,value:"rowSeparators"}),D(re,{className:"vuuIconToggleButton","data-icon":"col-lines",selected:b.columnSeparators,onChange:c,value:"columnSeparators"})]})]}),G(bt,{children:[D(ht,{children:"Default Column Width"}),D($l,{className:"vuuInput"})]}),D(Ot,{columnItems:i,onChange:m,onMoveListItem:d}),G("div",{className:`${xt}-calculatedButtonbar`,children:[D(Vl,{"data-icon":"plus",onClick:e}),D("span",{className:`${xt}-calculatedLabel`,children:"Add calculated column"})]})]})};import{useLayoutProviderDispatch as Wl}from"@vuu-ui/vuu-layout";import{getCalculatedColumnType as Ql}from"@vuu-ui/vuu-utils";import{useCallback as ve,useRef as Gl,useState as Ul}from"react";var dl=({availableColumns:t,onAvailableColumnsChange:e,onConfigChange:o,onCreateCalculatedColumn:n,onDataSourceConfigChange:r,tableConfig:s})=>{let i=Wl(),l=Gl(),[u,c]=Ul(t),m=ve((p,g,f)=>{i({type:"set-props",path:"#context-panel",props:{expanded:!0,content:{type:p,props:f},title:g}})},[i]),d=ve(p=>{let g=u.concat({name:p.name,serverDataType:Ql(p)});c(g),e==null||e(g),requestAnimationFrame(()=>{var f;(f=l.current)==null||f.call(l)}),n(p)},[u,e,n]),b=ve(p=>{m("ColumnSettings","Column Settings",{column:p.column,onConfigChange:o,onCreateCalculatedColumn:d,tableConfig:s,vuuTable:p.vuuTable})},[d,o,m,s]),a=ve(()=>{b({column:{name:"::",serverDataType:"string"},type:"columnSettings",vuuTable:{module:"SIMUL",table:"instruments"}})},[b]);return l.current=ve(()=>{m("TableSettings","DataGrid Settings",{availableColumns:u!=null?u:s.columns.map(({name:p,serverDataType:g})=>({name:p,serverDataType:g})),onAddCalculatedColumn:a,onConfigChange:o,onDataSourceConfigChange:r,tableConfig:s})},[u,a,o,r,m,s]),{showColumnSettingsPanel:b,showTableSettingsPanel:l.current}};export{$n as BackgroundCell,Xo as CaseValidator,io as ColumnExpressionInput,po as ColumnExpressionPanel,Ft as ColumnFormattingPanel,Ot as ColumnList,Je as ColumnNamedTerms,Cm as ColumnSettingsPanel,Sm as DataSourceStats,Lt as NumericFormattingSettings,Zo as PatternValidator,lD as TableSettingsPanel,$t as columnExpressionLanguageSupport,Gt as isCompleteExpression,Ut as isCompleteRelationalExpression,Ze as lastNamedChild,so as useColumnExpressionEditor,uo as useColumnExpressionSuggestionProvider,dl as useTableAndColumnSettings,Bo as useTableSettings,Wt as walkTree};
+var __accessCheck = (obj, member, msg) => {
+  if (!member.has(obj))
+    throw TypeError("Cannot " + msg);
+};
+var __privateGet = (obj, member, getter) => {
+  __accessCheck(obj, member, "read from private field");
+  return getter ? getter.call(obj) : member.get(obj);
+};
+var __privateAdd = (obj, member, value) => {
+  if (member.has(obj))
+    throw TypeError("Cannot add the same private member more than once");
+  member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
+};
+var __privateSet = (obj, member, value, setter) => {
+  __accessCheck(obj, member, "write to private field");
+  setter ? setter.call(obj, value) : member.set(obj, value);
+  return value;
+};
+
+// src/cell-edit-validators/CaseValidator.ts
+import { registerComponent } from "@vuu-ui/vuu-utils";
+var isString = (value) => typeof value === "string";
+var CaseValidator = (rule, value) => {
+  if (isString(value)) {
+    if (value === "") {
+      return true;
+    } else if (rule.value === "lower" && value.toLowerCase() !== value) {
+      return "value must be all lowercase";
+    } else if (rule.value === "upper" && value.toUpperCase() !== value) {
+      return "value must be all uppercase";
+    } else {
+      return true;
+    }
+  } else {
+    return "value must be a string";
+  }
+};
+registerComponent("vuu-case", CaseValidator, "data-edit-validator", {});
+
+// src/cell-edit-validators/PatternValidator.ts
+import { registerComponent as registerComponent2 } from "@vuu-ui/vuu-utils";
+var isString2 = (value) => typeof value === "string";
+var defaultMessage = "value does not match expected pattern";
+var PatternValidator = (rule, value) => {
+  if (typeof rule.value !== "string") {
+    throw Error("Pattern validation rule must provide pattern");
+  }
+  if (isString2(value)) {
+    if (value === "") {
+      return true;
+    } else {
+      const { message = defaultMessage } = rule;
+      const pattern = new RegExp(rule.value);
+      return pattern.test(value) || message;
+    }
+  } else {
+    return "value must be a string";
+  }
+};
+registerComponent2("vuu-pattern", PatternValidator, "data-edit-validator", {});
+
+// src/cell-renderers/background-cell/BackgroundCell.tsx
+import {
+  DOWN1,
+  DOWN2,
+  isTypeDescriptor as isTypeDescriptor2,
+  metadataKeys,
+  registerComponent as registerComponent3,
+  UP1,
+  UP2
+} from "@vuu-ui/vuu-utils";
+import cx from "classnames";
+
+// src/cell-renderers/background-cell/useDirection.ts
+import {
+  getMovingValueDirection,
+  isTypeDescriptor,
+  isValidNumber
+} from "@vuu-ui/vuu-utils";
+import { useEffect, useRef } from "react";
+var INITIAL_VALUE = [void 0, void 0, void 0, void 0];
+function useDirection(key, value, column) {
+  var _a;
+  const ref = useRef();
+  const [prevKey, prevValue, prevColumn, prevDirection] = ref.current || INITIAL_VALUE;
+  const { type: dataType } = column;
+  const decimals = isTypeDescriptor(dataType) ? (_a = dataType.formatting) == null ? void 0 : _a.decimals : void 0;
+  const direction = key === prevKey && isValidNumber(value) && isValidNumber(prevValue) && column === prevColumn ? getMovingValueDirection(value, prevDirection, prevValue, decimals) : "";
+  useEffect(() => {
+    ref.current = [key, value, column, direction];
+  });
+  return direction;
+}
+
+// src/cell-renderers/background-cell/BackgroundCell.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+var CHAR_ARROW_UP = String.fromCharCode(11014);
+var CHAR_ARROW_DOWN = String.fromCharCode(11015);
+var { KEY } = metadataKeys;
+var classBase = "vuuBackgroundCellDeprecated";
+var FlashStyle = {
+  ArrowOnly: "arrow",
+  BackgroundOnly: "bg-only",
+  ArrowBackground: "arrow-bg"
+};
+var getFlashStyle = (colType) => {
+  if (isTypeDescriptor2(colType) && colType.renderer) {
+    if ("flashStyle" in colType.renderer) {
+      return colType.renderer["flashStyle"];
+    }
+  }
+  return FlashStyle.BackgroundOnly;
+};
+var BackgroundCell = ({ column, row }) => {
+  const { key, type, valueFormatter } = column;
+  const value = row[key];
+  const flashStyle = getFlashStyle(type);
+  const direction = useDirection(row[KEY], value, column);
+  const arrow = flashStyle === FlashStyle.ArrowOnly || flashStyle === FlashStyle.ArrowBackground ? direction === UP1 || direction === UP2 ? CHAR_ARROW_UP : direction === DOWN1 || direction === DOWN2 ? CHAR_ARROW_DOWN : null : null;
+  const dirClass = direction ? ` ` + direction : "";
+  const className = cx(classBase, dirClass, {
+    [`${classBase}-arrowOnly`]: flashStyle === FlashStyle.ArrowOnly,
+    [`${classBase}-arrowBackground`]: flashStyle === FlashStyle.ArrowBackground
+  });
+  return /* @__PURE__ */ jsxs("div", { className, tabIndex: -1, children: [
+    /* @__PURE__ */ jsx("div", { className: `${classBase}-flasher`, children: arrow }),
+    valueFormatter(row[column.key])
+  ] });
+};
+registerComponent3("background", BackgroundCell, "cell-renderer", {
+  description: "Background Cell renderer for VuuTable",
+  label: "Background Cell (deprecated)",
+  serverDataType: ["long", "int", "double"]
+});
+
+// src/cell-renderers/progress-cell/ProgressCell.tsx
+import {
+  isColumnTypeRenderer,
+  isTypeDescriptor as isTypeDescriptor3,
+  isValidNumber as isValidNumber2,
+  registerComponent as registerComponent4
+} from "@vuu-ui/vuu-utils";
+import cx2 from "classnames";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+var classBase2 = "vuuProgressCell";
+var ProgressCell = ({ column, columnMap, row }) => {
+  const { type } = column;
+  const value = row[column.key];
+  let showProgress = false;
+  let percentage = 0;
+  if (isTypeDescriptor3(type) && isColumnTypeRenderer(type.renderer)) {
+    const { associatedField } = type.renderer;
+    if (associatedField) {
+      const associatedValue = row[columnMap[associatedField]];
+      if (typeof isValidNumber2(value) && isValidNumber2(associatedValue)) {
+        percentage = Math.min(Math.round(value / associatedValue * 100), 100);
+        percentage = Math.min(Math.round(value / associatedValue * 100), 100);
+        showProgress = isFinite(percentage);
+      } else {
+        const floatValue = parseFloat(value);
+        if (Number.isFinite(floatValue)) {
+          const floatOtherValue = parseFloat(associatedValue);
+          if (Number.isFinite(floatOtherValue)) {
+            percentage = Math.min(
+              Math.round(floatValue / floatOtherValue * 100),
+              100
+            );
+            showProgress = isFinite(percentage);
+          }
+        }
+      }
+    } else {
+      throw Error("ProgressCell associatedField is required to render");
+    }
+  }
+  const className = cx2(classBase2, {});
+  return /* @__PURE__ */ jsxs2("div", { className, tabIndex: -1, children: [
+    showProgress ? /* @__PURE__ */ jsxs2("span", { className: `${classBase2}-track`, children: [
+      /* @__PURE__ */ jsx2("span", { className: `${classBase2}-bg` }),
+      /* @__PURE__ */ jsx2(
+        "span",
+        {
+          className: `${classBase2}-bar`,
+          style: { "--progress-bar-pct": `-${100 - percentage}%` }
+        }
+      )
+    ] }) : null,
+    /* @__PURE__ */ jsx2("span", { className: `${classBase2}-text`, children: `${percentage} %` })
+  ] });
+};
+registerComponent4("vuu.progress", ProgressCell, "cell-renderer", {
+  description: "Progress formatter",
+  label: "Progress formatter",
+  serverDataType: ["long", "int", "double"]
+});
+
+// src/cell-renderers-next/background-cell/BackgroundCell.tsx
+import {
+  DOWN1 as DOWN12,
+  DOWN2 as DOWN22,
+  isTypeDescriptor as isTypeDescriptor5,
+  metadataKeys as metadataKeys2,
+  registerComponent as registerComponent5,
+  UP1 as UP12,
+  UP2 as UP22
+} from "@vuu-ui/vuu-utils";
+import cx3 from "classnames";
+
+// src/cell-renderers-next/background-cell/useDirection.ts
+import {
+  getMovingValueDirection as getMovingValueDirection2,
+  isTypeDescriptor as isTypeDescriptor4,
+  isValidNumber as isValidNumber3
+} from "@vuu-ui/vuu-utils";
+import { useEffect as useEffect2, useRef as useRef2 } from "react";
+var INITIAL_VALUE2 = [void 0, void 0, void 0, void 0];
+function useDirection2(key, value, column) {
+  var _a;
+  const ref = useRef2();
+  const [prevKey, prevValue, prevColumn, prevDirection] = ref.current || INITIAL_VALUE2;
+  const { type: dataType } = column;
+  const decimals = isTypeDescriptor4(dataType) ? (_a = dataType.formatting) == null ? void 0 : _a.decimals : void 0;
+  const direction = key === prevKey && isValidNumber3(value) && isValidNumber3(prevValue) && column === prevColumn ? getMovingValueDirection2(value, prevDirection, prevValue, decimals) : "";
+  useEffect2(() => {
+    ref.current = [key, value, column, direction];
+  });
+  return direction;
+}
+
+// src/cell-renderers-next/background-cell/BackgroundCell.tsx
+import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+var CHAR_ARROW_UP2 = String.fromCharCode(11014);
+var CHAR_ARROW_DOWN2 = String.fromCharCode(11015);
+var { KEY: KEY2 } = metadataKeys2;
+var classBase3 = "vuuBackgroundCell";
+var FlashStyle2 = {
+  ArrowOnly: "arrow",
+  BackgroundOnly: "bg-only",
+  ArrowBackground: "arrow-bg"
+};
+var getFlashStyle2 = (colType) => {
+  if (isTypeDescriptor5(colType) && colType.renderer) {
+    if ("flashStyle" in colType.renderer) {
+      return colType.renderer["flashStyle"];
+    }
+  }
+  return FlashStyle2.BackgroundOnly;
+};
+var BackgroundCell2 = ({ column, row }) => {
+  const { key, type, valueFormatter } = column;
+  const value = row[key];
+  const flashStyle = getFlashStyle2(type);
+  const direction = useDirection2(row[KEY2], value, column);
+  const arrow = flashStyle === FlashStyle2.ArrowOnly || flashStyle === FlashStyle2.ArrowBackground ? direction === UP12 || direction === UP22 ? CHAR_ARROW_UP2 : direction === DOWN12 || direction === DOWN22 ? CHAR_ARROW_DOWN2 : null : null;
+  const dirClass = direction ? ` ` + direction : "";
+  const className = cx3(classBase3, dirClass, {
+    [`${classBase3}-arrowOnly`]: flashStyle === FlashStyle2.ArrowOnly,
+    [`${classBase3}-arrowBackground`]: flashStyle === FlashStyle2.ArrowBackground
+  });
+  return /* @__PURE__ */ jsxs3("div", { className, tabIndex: -1, children: [
+    /* @__PURE__ */ jsx3("div", { className: `${classBase3}-flasher`, children: arrow }),
+    valueFormatter(row[column.key])
+  ] });
+};
+console.log("register BackgroundCellNext");
+registerComponent5("background-next", BackgroundCell2, "cell-renderer", {
+  description: "Change background color of cell when value changes",
+  label: "Background Flash",
+  serverDataType: ["long", "int", "double"]
+});
+
+// src/column-list/ColumnList.tsx
+import {
+  List,
+  ListItem
+} from "@vuu-ui/vuu-ui-controls";
+import { Checkbox } from "@salt-ds/core";
+import { Switch } from "@salt-ds/lab";
+import cx4 from "classnames";
+import { useCallback } from "react";
+import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
+var classBase4 = "vuuColumnList";
+var classBaseListItem = "vuuColumnListItem";
+var ColumnListItem = ({
+  className: classNameProp,
+  item,
+  ...listItemProps
+}) => {
+  var _a;
+  return /* @__PURE__ */ jsxs4(
+    ListItem,
+    {
+      ...listItemProps,
+      className: cx4(classNameProp, classBaseListItem),
+      "data-name": item == null ? void 0 : item.name,
+      children: [
+        (item == null ? void 0 : item.isCalculated) ? /* @__PURE__ */ jsx4("span", { className: `${classBase4}-icon`, "data-icon": "function" }) : /* @__PURE__ */ jsx4(Switch, { className: `${classBase4}-switch`, checked: item == null ? void 0 : item.subscribed }),
+        /* @__PURE__ */ jsx4("span", { className: `${classBase4}-text`, children: (_a = item == null ? void 0 : item.label) != null ? _a : item == null ? void 0 : item.name }),
+        /* @__PURE__ */ jsx4(
+          Checkbox,
+          {
+            className: `${classBase4}-checkBox`,
+            checked: (item == null ? void 0 : item.hidden) !== true,
+            disabled: (item == null ? void 0 : item.subscribed) !== true
+          }
+        )
+      ]
+    }
+  );
+};
+var ColumnList = ({
+  columnItems,
+  onChange,
+  onMoveListItem,
+  ...htmlAttributes
+}) => {
+  const handleChange = useCallback(
+    (evt) => {
+      const input = evt.target;
+      const listItem = input.closest(`.${classBaseListItem}`);
+      const {
+        dataset: { name: name2 }
+      } = listItem;
+      if (name2) {
+        const saltSwitch = input.closest(`.${classBase4}-switch`);
+        const saltCheckbox = input.closest(
+          `.${classBase4}-checkBox`
+        );
+        if (saltSwitch) {
+          onChange(name2, "subscribed", input.checked);
+        } else if (saltCheckbox) {
+          onChange(name2, "hidden", input.checked === false);
+        }
+      }
+    },
+    [onChange]
+  );
+  return /* @__PURE__ */ jsxs4("div", { ...htmlAttributes, className: classBase4, children: [
+    /* @__PURE__ */ jsx4("div", { className: `${classBase4}-header`, children: /* @__PURE__ */ jsx4("span", { children: "Column Selection" }) }),
+    /* @__PURE__ */ jsxs4("div", { className: `${classBase4}-colHeadings`, children: [
+      /* @__PURE__ */ jsx4("span", { children: "Column subscription" }),
+      /* @__PURE__ */ jsx4("span", { children: "Visibility" })
+    ] }),
+    /* @__PURE__ */ jsx4(
+      List,
+      {
+        ListItem: ColumnListItem,
+        allowDragDrop: true,
+        height: "100%",
+        onChange: handleChange,
+        onMoveListItem,
+        selectionStrategy: "none",
+        source: columnItems,
+        itemHeight: 33
+      }
+    )
+  ] });
+};
+
+// src/column-settings/ColumnSettingsPanel.tsx
+import { getDefaultAlignment, isCalculatedColumn } from "@vuu-ui/vuu-utils";
+import {
+  Button as Button2,
+  FormField as FormField4,
+  FormFieldLabel as FormFieldLabel4,
+  ToggleButton,
+  ToggleButtonGroup
+} from "@salt-ds/core";
+
+// src/column-formatting-settings/ColumnFormattingPanel.tsx
+import { Dropdown } from "@vuu-ui/vuu-ui-controls";
+import { FormField as FormField2, FormFieldLabel as FormFieldLabel2 } from "@salt-ds/core";
+import cx5 from "classnames";
+import { useMemo } from "react";
+
+// src/column-formatting-settings/NumericFormattingSettings.tsx
+import { FormField, FormFieldLabel, Input } from "@salt-ds/core";
+import { Switch as Switch2 } from "@salt-ds/lab";
+import { getTypeSettingsFromColumn } from "@vuu-ui/vuu-utils";
+import {
+  useCallback as useCallback2,
+  useState
+} from "react";
+import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
+var classBase5 = "vuuFormattingSettings";
+var NumericFormattingSettings = ({
+  column,
+  onChange
+}) => {
+  var _a;
+  const [formattingSettings, setFormattingSettings] = useState(
+    getTypeSettingsFromColumn(column)
+  );
+  const handleInputKeyDown = useCallback2(
+    (evt) => {
+      if (evt.key === "Enter" || evt.key === "Tab") {
+        onChange(formattingSettings);
+      }
+    },
+    [formattingSettings, onChange]
+  );
+  const handleChangeDecimals = useCallback2(
+    (evt) => {
+      const { value } = evt.target;
+      const numericValue = value === "" ? void 0 : isNaN(parseInt(value)) ? void 0 : parseInt(value);
+      const newFormattingSettings = {
+        ...formattingSettings,
+        decimals: numericValue
+      };
+      setFormattingSettings(newFormattingSettings);
+    },
+    [formattingSettings]
+  );
+  const handleChangeAlignDecimals = useCallback2(
+    (evt) => {
+      const { checked } = evt.target;
+      const newFormattingSettings = {
+        ...formattingSettings,
+        alignOnDecimals: checked
+      };
+      setFormattingSettings(newFormattingSettings);
+      onChange(newFormattingSettings);
+    },
+    [formattingSettings, onChange]
+  );
+  const handleChangeZeroPad = useCallback2(
+    (evt) => {
+      const { checked } = evt.target;
+      const newFormattingSettings = {
+        ...formattingSettings,
+        zeroPad: checked
+      };
+      setFormattingSettings(newFormattingSettings);
+      onChange(newFormattingSettings);
+    },
+    [formattingSettings, onChange]
+  );
+  return /* @__PURE__ */ jsxs5("div", { className: classBase5, children: [
+    /* @__PURE__ */ jsxs5(FormField, { "data-field": "decimals", children: [
+      /* @__PURE__ */ jsx5(FormFieldLabel, { children: "Number of decimals" }),
+      /* @__PURE__ */ jsx5(
+        Input,
+        {
+          className: "vuuInput",
+          onChange: handleChangeDecimals,
+          onKeyDown: handleInputKeyDown,
+          value: (_a = formattingSettings.decimals) != null ? _a : ""
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxs5(FormField, { labelPlacement: "left", children: [
+      /* @__PURE__ */ jsx5(FormFieldLabel, { children: "Align on decimals" }),
+      /* @__PURE__ */ jsx5(
+        Switch2,
+        {
+          checked: formattingSettings.alignOnDecimals,
+          onChange: handleChangeAlignDecimals,
+          value: "align-decimals"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxs5(FormField, { labelPlacement: "left", children: [
+      /* @__PURE__ */ jsx5(FormFieldLabel, { children: "Zero pad decimals" }),
+      /* @__PURE__ */ jsx5(
+        Switch2,
+        {
+          checked: formattingSettings.zeroPad,
+          onChange: handleChangeZeroPad,
+          value: "zero-pad"
+        }
+      )
+    ] })
+  ] });
+};
+
+// src/column-formatting-settings/ColumnFormattingPanel.tsx
+import { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
+var classBase6 = "vuuColumnFormattingPanel";
+var itemToString = (item) => {
+  var _a;
+  return (_a = item.label) != null ? _a : item.name;
+};
+var ColumnFormattingPanel = ({
+  availableRenderers,
+  selectedCellRenderer,
+  className,
+  column,
+  onChangeFormatting,
+  onChangeRenderer,
+  ...htmlAttributes
+}) => {
+  const content = useMemo(() => {
+    switch (column.serverDataType) {
+      case "double":
+      case "int":
+      case "long":
+        return /* @__PURE__ */ jsx6(
+          NumericFormattingSettings,
+          {
+            column,
+            onChange: onChangeFormatting
+          }
+        );
+      default:
+        return null;
+    }
+  }, [column, onChangeFormatting]);
+  const { serverDataType = "string" } = column;
+  return /* @__PURE__ */ jsxs6("div", { ...htmlAttributes, className: `vuuColumnSettingsPanel-header`, children: [
+    /* @__PURE__ */ jsx6("div", { children: "Formatting" }),
+    /* @__PURE__ */ jsxs6(FormField2, { children: [
+      /* @__PURE__ */ jsx6(FormFieldLabel2, { children: "Renderer" }),
+      /* @__PURE__ */ jsx6(
+        Dropdown,
+        {
+          className: cx5(`${classBase6}-renderer`),
+          itemToString,
+          onSelectionChange: onChangeRenderer,
+          selected: selectedCellRenderer,
+          source: availableRenderers,
+          width: "100%"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx6(
+      "div",
+      {
+        className: cx5(classBase6, className, `${classBase6}-${serverDataType}`),
+        children: content
+      }
+    )
+  ] });
+};
+
+// src/column-settings/useColumnSettings.ts
+import {
+  getRegisteredCellRenderers,
+  isColumnTypeRenderer as isColumnTypeRenderer2,
+  isTypeDescriptor as isTypeDescriptor6,
+  isValidColumnAlignment,
+  isValidPinLocation,
+  setCalculatedColumnName,
+  updateColumnRenderer,
+  updateColumnType
+} from "@vuu-ui/vuu-utils";
+import {
+  useCallback as useCallback3,
+  useMemo as useMemo2,
+  useRef as useRef3,
+  useState as useState2
+} from "react";
+var integerCellRenderers = [
+  {
+    description: "Default formatter for columns with data type integer",
+    label: "Default Renderer (data type int, long)",
+    name: "default-int"
+  }
+];
+var doubleCellRenderers = [
+  {
+    description: "Default formatter for columns with data type double",
+    label: "Default Renderer (data type double)",
+    name: "default-double"
+  },
+  ...getRegisteredCellRenderers("double")
+];
+var stringCellRenderers = [
+  {
+    description: "Default formatter for columns with data type string",
+    label: "Default Renderer (data type string)",
+    name: "default-string"
+  }
+];
+var getAvailableCellRenderers = (column) => {
+  switch (column.serverDataType) {
+    case "char":
+    case "string":
+      return stringCellRenderers;
+    case "int":
+    case "long":
+      return integerCellRenderers;
+    case "double":
+      return doubleCellRenderers;
+    default:
+      return stringCellRenderers;
+  }
+};
+var getCellRendererDescriptor = (availableRenderers, column) => {
+  if (isTypeDescriptor6(column.type)) {
+    const { renderer } = column.type;
+    if (isColumnTypeRenderer2(renderer)) {
+      const cellRenderer = availableRenderers.find(
+        (r) => r.name === renderer.name
+      );
+      if (cellRenderer) {
+        return cellRenderer;
+      }
+    }
+  }
+  const typedAvailableRenderers = getAvailableCellRenderers(column);
+  return typedAvailableRenderers[0];
+};
+var getFieldName = (input) => {
+  const saltFormField = input.closest(".saltFormField");
+  if (saltFormField && saltFormField.dataset.field) {
+    const {
+      dataset: { field }
+    } = saltFormField;
+    return field;
+  } else {
+    throw Error("named form field not found");
+  }
+};
+var getColumn = (columns, column) => {
+  if (column.name === "::") {
+    return column;
+  } else {
+    const col = columns.find((col2) => col2.name === column.name);
+    if (col) {
+      return col;
+    }
+    throw Error(`columns does not contain column ${name}`);
+  }
+};
+var replaceColumn = (tableConfig, column) => ({
+  ...tableConfig,
+  columns: tableConfig.columns.map(
+    (col) => col.name === column.name ? column : col
+  )
+});
+var useColumnSettings = ({
+  column: columnProp,
+  onConfigChange,
+  onCreateCalculatedColumn,
+  tableConfig
+}) => {
+  const [column, setColumn] = useState2(
+    getColumn(tableConfig.columns, columnProp)
+  );
+  const availableRenderers = useMemo2(() => {
+    return getAvailableCellRenderers(column);
+  }, [column]);
+  const selectedCellRendererRef = useRef3(
+    getCellRendererDescriptor(availableRenderers, column)
+  );
+  const handleInputCommit = useCallback3(() => {
+    onConfigChange(replaceColumn(tableConfig, column));
+  }, [column, onConfigChange, tableConfig]);
+  const handleChange = useCallback3(
+    (evt) => {
+      const input = evt.target;
+      const fieldName = getFieldName(input);
+      const { value } = input;
+      switch (fieldName) {
+        case "column-label":
+          setColumn((state) => ({ ...state, label: value }));
+          break;
+        case "column-name":
+          setColumn((state) => setCalculatedColumnName(state, value));
+          break;
+        case "column-width":
+          setColumn((state) => ({ ...state, width: parseInt(value) }));
+          break;
+        case "column-alignment":
+          if (isValidColumnAlignment(value)) {
+            const newColumn = {
+              ...column,
+              align: value || void 0
+            };
+            setColumn(newColumn);
+            onConfigChange(replaceColumn(tableConfig, newColumn));
+          }
+          break;
+        case "column-pin":
+          if (isValidPinLocation(value)) {
+            const newColumn = {
+              ...column,
+              pin: value || void 0
+            };
+            setColumn(newColumn);
+            onConfigChange(replaceColumn(tableConfig, newColumn));
+            break;
+          }
+      }
+    },
+    [column, onConfigChange, tableConfig]
+  );
+  const handleChangeRenderer = useCallback3(
+    (evt, cellRenderer) => {
+      if (cellRenderer) {
+        const newColumn = updateColumnRenderer(
+          column,
+          cellRenderer
+        );
+        selectedCellRendererRef.current = cellRenderer;
+        setColumn(newColumn);
+        onConfigChange(replaceColumn(tableConfig, newColumn));
+      }
+    },
+    [column, onConfigChange, tableConfig]
+  );
+  const handleChangeFormatting = useCallback3(
+    (formatting) => {
+      const newColumn = updateColumnType(column, formatting);
+      setColumn(newColumn);
+      onConfigChange(replaceColumn(tableConfig, newColumn));
+    },
+    [column, onConfigChange, tableConfig]
+  );
+  const navigateColumn = useCallback3(
+    ({ moveBy }) => {
+      const { columns } = tableConfig;
+      const index = columns.indexOf(column) + moveBy;
+      const newColumn = columns[index];
+      if (newColumn) {
+        selectedCellRendererRef.current = getCellRendererDescriptor(
+          availableRenderers,
+          newColumn
+        );
+        setColumn(newColumn);
+      }
+    },
+    [availableRenderers, column, tableConfig]
+  );
+  const navigateNextColumn = useCallback3(() => {
+    navigateColumn({ moveBy: 1 });
+  }, [navigateColumn]);
+  const navigatePrevColumn = useCallback3(() => {
+    navigateColumn({ moveBy: -1 });
+  }, [navigateColumn]);
+  const handleSaveCalculatedColumn = useCallback3(
+    (calculatedColumn) => {
+      onCreateCalculatedColumn({
+        ...column,
+        ...calculatedColumn
+      });
+    },
+    [column, onCreateCalculatedColumn]
+  );
+  return {
+    availableRenderers,
+    selectedCellRenderer: selectedCellRendererRef.current,
+    column,
+    navigateNextColumn,
+    navigatePrevColumn,
+    onChange: handleChange,
+    onChangeFormatting: handleChangeFormatting,
+    onChangeRenderer: handleChangeRenderer,
+    onInputCommit: handleInputCommit,
+    onSave: handleSaveCalculatedColumn
+  };
+};
+
+// src/column-expression-panel/ColumnExpressionPanel.tsx
+import { Dropdown as Dropdown2 } from "@vuu-ui/vuu-ui-controls";
+import {
+  getCalculatedColumnExpression,
+  getCalculatedColumnName,
+  getCalculatedColumnType
+} from "@vuu-ui/vuu-utils";
+import { Button, FormField as FormField3, FormFieldLabel as FormFieldLabel3, Input as Input2 } from "@salt-ds/core";
+import { useCallback as useCallback7, useRef as useRef7 } from "react";
+
+// src/column-expression-input/useColumnExpressionEditor.ts
+import {
+  autocompletion,
+  defaultKeymap,
+  EditorState as EditorState2,
+  EditorView as EditorView2,
+  ensureSyntaxTree,
+  keymap,
+  minimalSetup,
+  startCompletion
+} from "@vuu-ui/vuu-codemirror";
+import { createEl } from "@vuu-ui/vuu-utils";
+import { useEffect as useEffect3, useMemo as useMemo3, useRef as useRef4 } from "react";
+
+// src/column-expression-input/column-language-parser/ColumnExpressionLanguage.ts
+import {
+  LanguageSupport,
+  LRLanguage,
+  styleTags,
+  tags as tag
+} from "@vuu-ui/vuu-codemirror";
+
+// src/column-expression-input/column-language-parser/generated/column-parser.js
+import { LRParser } from "@lezer/lr";
+var parser = LRParser.deserialize({
+  version: 14,
+  states: "&fOVQPOOO!SQPO'#C^OVQPO'#CcQ!pQPOOO#OQPO'#CkO#TQPO'#CrOOQO'#Cy'#CyO#YQPO,58}OVQPO,59QOVQPO,59QOVQPO,59VOVQPO'#CtOOQO,59^,59^OOQO1G.i1G.iOOQO1G.l1G.lO#kQPO1G.lO$fQPO'#CmO%WQQO1G.qOOQO'#C{'#C{O%cQPO,59`OOQO'#Cn'#CnO%wQPO,59XOVQPO,59ZOVQPO,59[OVQPO7+$]OVQPO'#CuO&`QPO1G.zOOQO1G.z1G.zO&hQQO'#C^O&rQQO1G.sO'ZQQO1G.uOOQO1G.v1G.vO'fQPO<<GwO'wQPO,59aOOQO-E6s-E6sOOQO7+$f7+$fOVQPOAN=cO(]QQO1G.lO(tQPOG22}OOQOLD(iLD(iO%wQPO,59QO%wQPO,59Q",
+  stateData: ")[~OlOS~ORUOSUOTUOUUOWQO`SOnPO~OWgXZQX[QX]QX^QXeQX~OjQXXQXpQXqQXrQXsQXtQXuQX~PnOZWO[WO]XO^XO~OWYO~OWZO~OX]OZWO[WO]XO^XO~OZWO[WO]Yi^YijYiXYipYiqYirYisYitYiuYieYi~OZWO[WO]XO^XOpdOqdOrdOsdOtdOudO~OehOvfOwgO~OXkOZWO[WO]XO^XOeiO~ORUOSUOTUOUUOWQO`SOnlO~OXsOeiO~OvQXwQX~PnOZxO[xO]yO^yOeaivaiwai~OwgOecivci~OZWO[WO]XO^XOetO~OZWO[WO]XO^XOXiaeia~OZxO[xO]Yi^YieYivYiwYi~OXwOZWO[WO]XO^XO~O`UTn~",
+  goto: "#spPPqPPPPqPPqPPPPqP!R!W!R!RPq!Z!k!nPPP!tP#jmUOQWXYZefghitxyVbYfgRe`mTOQWXYZefghitxyR[TQjcRrjQROQVQS^WxQ_XU`YfgQcZQmeQphQqiQuyRvtQaYQnfRog",
+  nodeNames: "\u26A0 ColumnDefinitionExpression Column Number String True False ParenthesizedExpression OpenBrace CloseBrace ArithmeticExpression Divide Times Plus Minus ConditionalExpression If RelationalExpression RelationalOperator AndCondition OrCondition Comma CallExpression Function ArgList",
+  maxTerm: 39,
+  skippedNodes: [0],
+  repeatNodeCount: 1,
+  tokenData: ".^~RnXY#PYZ#P]^#Ppq#Pqr#brs#mxy$eyz$jz{$o{|$t|}$y}!O%O!O!P%T!P!Q%c!Q![%h!^!_%s!_!`&Q!`!a&V!c!}&d#R#S&d#T#U&u#U#Y&d#Y#Z(Y#Z#]&d#]#^*j#^#c&d#c#d+f#d#h&d#h#i,b#i#o&d~#USl~XY#PYZ#P]^#Ppq#P~#eP!_!`#h~#mOu~~#pWOX#mZ]#m^r#mrs$Ys#O#m#P;'S#m;'S;=`$_<%lO#m~$_OS~~$bP;=`<%l#m~$jOW~~$oOX~~$tO[~~$yO]~~%OOe~~%TO^~~%WP!Q![%Z~%`PR~!Q![%Z~%hOZ~~%mQR~!O!P%Z!Q![%h~%xPr~!_!`%{~&QOt~~&VOp~~&[Pq~!_!`&_~&dOs~P&iSnP!Q![&d!c!}&d#R#S&d#T#o&dR&zUnP!Q![&d!c!}&d#R#S&d#T#b&d#b#c'^#c#o&dR'cUnP!Q![&d!c!}&d#R#S&d#T#W&d#W#X'u#X#o&dR'|SvQnP!Q![&d!c!}&d#R#S&d#T#o&d~(_TnP!Q![&d!c!}&d#R#S&d#T#U(n#U#o&d~(sUnP!Q![&d!c!}&d#R#S&d#T#`&d#`#a)V#a#o&d~)[UnP!Q![&d!c!}&d#R#S&d#T#g&d#g#h)n#h#o&d~)sUnP!Q![&d!c!}&d#R#S&d#T#X&d#X#Y*V#Y#o&d~*^SU~nP!Q![&d!c!}&d#R#S&d#T#o&d~*oUnP!Q![&d!c!}&d#R#S&d#T#Y&d#Y#Z+R#Z#o&d~+YS`~nP!Q![&d!c!}&d#R#S&d#T#o&dR+kUnP!Q![&d!c!}&d#R#S&d#T#f&d#f#g+}#g#o&dR,USwQnP!Q![&d!c!}&d#R#S&d#T#o&d~,gUnP!Q![&d!c!}&d#R#S&d#T#f&d#f#g,y#g#o&d~-OUnP!Q![&d!c!}&d#R#S&d#T#i&d#i#j-b#j#o&d~-gUnP!Q![&d!c!}&d#R#S&d#T#X&d#X#Y-y#Y#o&d~.QST~nP!Q![&d!c!}&d#R#S&d#T#o&d",
+  tokenizers: [0, 1],
+  topRules: { "ColumnDefinitionExpression": [0, 1] },
+  tokenPrec: 375
+});
+
+// src/column-expression-input/column-language-parser/ColumnExpressionLanguage.ts
+var columnExpressionLanguage = LRLanguage.define({
+  name: "VuuColumnExpression",
+  parser: parser.configure({
+    props: [
+      styleTags({
+        Function: tag.variableName,
+        String: tag.string,
+        Or: tag.emphasis,
+        Operator: tag.operator
+      })
+    ]
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  })
+});
+var columnExpressionLanguageSupport = () => {
+  return new LanguageSupport(
+    columnExpressionLanguage
+    /*, [exampleCompletion]*/
+  );
+};
+
+// src/column-expression-input/column-language-parser/ColumnExpressionTreeWalker.ts
+var LiteralExpressionImpl = class {
+  constructor(value) {
+    this.value = value;
+    switch (typeof value) {
+      case "boolean":
+        this.type = "booleanLiteralExpression";
+        break;
+      case "number":
+        this.type = "numericLiteralExpression";
+        break;
+      default:
+        this.type = "stringLiteralExpression";
+    }
+  }
+  toJSON() {
+    return {
+      type: this.type,
+      value: this.value
+    };
+  }
+};
+var ColumnExpressionImpl = class {
+  constructor(columnName) {
+    this.type = "colExpression";
+    this.column = columnName;
+  }
+  toJSON() {
+    return {
+      type: this.type,
+      column: this.column
+    };
+  }
+};
+var _expressions, _op;
+var ArithmeticExpressionImpl = class {
+  constructor(op = "unknown") {
+    __privateAdd(this, _expressions, [
+      { type: "unknown" },
+      { type: "unknown" }
+    ]);
+    __privateAdd(this, _op, void 0);
+    this.type = "arithmeticExpression";
+    __privateSet(this, _op, op);
+  }
+  get op() {
+    return __privateGet(this, _op);
+  }
+  set op(op) {
+    __privateSet(this, _op, op);
+  }
+  get expressions() {
+    return __privateGet(this, _expressions);
+  }
+  toJSON() {
+    return {
+      type: this.type,
+      op: __privateGet(this, _op),
+      expressions: __privateGet(this, _expressions)
+    };
+  }
+};
+_expressions = new WeakMap();
+_op = new WeakMap();
+var _expressions2;
+var CallExpressionImpl = class {
+  constructor(functionName) {
+    __privateAdd(this, _expressions2, []);
+    this.type = "callExpression";
+    this.functionName = functionName;
+  }
+  get expressions() {
+    return __privateGet(this, _expressions2);
+  }
+  get arguments() {
+    return __privateGet(this, _expressions2);
+  }
+  toJSON() {
+    return {
+      type: this.type,
+      functionName: this.functionName,
+      arguments: __privateGet(this, _expressions2).map((e) => {
+        var _a;
+        return (_a = e.toJSON) == null ? void 0 : _a.call(e);
+      })
+    };
+  }
+};
+_expressions2 = new WeakMap();
+var _expressions3, _op2;
+var RelationalExpressionImpl = class {
+  constructor() {
+    __privateAdd(this, _expressions3, [
+      { type: "unknown" },
+      { type: "unknown" }
+    ]);
+    __privateAdd(this, _op2, "unknown");
+    this.type = "relationalExpression";
+  }
+  get op() {
+    return __privateGet(this, _op2);
+  }
+  set op(op) {
+    __privateSet(this, _op2, op);
+  }
+  get expressions() {
+    return __privateGet(this, _expressions3);
+  }
+  toJSON() {
+    return {
+      type: this.type,
+      op: __privateGet(this, _op2),
+      expressions: __privateGet(this, _expressions3)
+    };
+  }
+};
+_expressions3 = new WeakMap();
+_op2 = new WeakMap();
+var _expressions4, _op3;
+var BooleanConditionImp = class {
+  constructor(booleanOperator) {
+    __privateAdd(this, _expressions4, [
+      { type: "unknown" },
+      { type: "unknown" }
+    ]);
+    __privateAdd(this, _op3, void 0);
+    this.type = "booleanCondition";
+    __privateSet(this, _op3, booleanOperator);
+  }
+  get op() {
+    return __privateGet(this, _op3);
+  }
+  get expressions() {
+    return __privateGet(this, _expressions4);
+  }
+  toJSON() {
+    return {
+      type: this.type,
+      op: __privateGet(this, _op3),
+      expressions: __privateGet(this, _expressions4).map((e) => {
+        var _a;
+        return (_a = e.toJSON) == null ? void 0 : _a.call(e);
+      })
+    };
+  }
+};
+_expressions4 = new WeakMap();
+_op3 = new WeakMap();
+var _expressions5;
+var ConditionalExpressionImpl = class {
+  constructor(booleanOperator) {
+    __privateAdd(this, _expressions5, void 0);
+    this.type = "conditionalExpression";
+    __privateSet(this, _expressions5, [
+      booleanOperator ? new BooleanConditionImp(booleanOperator) : new RelationalExpressionImpl(),
+      { type: "unknown" },
+      { type: "unknown" }
+    ]);
+  }
+  get expressions() {
+    return __privateGet(this, _expressions5);
+  }
+  get condition() {
+    return __privateGet(this, _expressions5)[0];
+  }
+  get truthyExpression() {
+    return __privateGet(this, _expressions5)[1];
+  }
+  set truthyExpression(expression) {
+    __privateGet(this, _expressions5)[1] = expression;
+  }
+  get falsyExpression() {
+    return __privateGet(this, _expressions5)[2];
+  }
+  set falsyExpression(expression) {
+    __privateGet(this, _expressions5)[2] = expression;
+  }
+  toJSON() {
+    var _a, _b, _c, _d, _e;
+    return {
+      type: this.type,
+      condition: (_b = (_a = this.condition).toJSON) == null ? void 0 : _b.call(_a),
+      truthyExpression: this.truthyExpression,
+      falsyExpression: (_e = (_d = (_c = this.falsyExpression) == null ? void 0 : _c.toJSON) == null ? void 0 : _d.call(_c)) != null ? _e : this.falsyExpression
+    };
+  }
+};
+_expressions5 = new WeakMap();
+var isUnknown = (e) => e.type === "unknown";
+var isArithmeticExpression = (expression) => expression.type === "arithmeticExpression";
+var isCallExpression = (expression) => expression.type === "callExpression";
+var isConditionalExpression = (expression) => expression.type === "conditionalExpression";
+var isCondition = (expression) => expression.type === "relationalExpression" || expression.type === "booleanCondition";
+var isBooleanCondition = (expression) => expression.type === "booleanCondition";
+var isRelationalExpression = (expression) => (expression == null ? void 0 : expression.type) === "relationalExpression";
+var firstIncompleteExpression = (expression) => {
+  if (isUnknown(expression)) {
+    return expression;
+  } else if (isRelationalExpression(expression)) {
+    const [operand1, operand2] = expression.expressions;
+    if (expressionIsIncomplete(operand1)) {
+      return firstIncompleteExpression(operand1);
+    } else if (expression.op === "unknown") {
+      return expression;
+    } else if (expressionIsIncomplete(operand2)) {
+      return firstIncompleteExpression(operand2);
+    }
+  } else if (isCondition(expression)) {
+    const { expressions = [] } = expression;
+    for (const e of expressions) {
+      if (expressionIsIncomplete(e)) {
+        return firstIncompleteExpression(e);
+      }
+    }
+  } else if (isConditionalExpression(expression)) {
+    const { condition, truthyExpression, falsyExpression } = expression;
+    if (expressionIsIncomplete(condition)) {
+      return firstIncompleteExpression(condition);
+    } else if (expressionIsIncomplete(truthyExpression)) {
+      return firstIncompleteExpression(truthyExpression);
+    } else if (expressionIsIncomplete(falsyExpression)) {
+      return firstIncompleteExpression(falsyExpression);
+    }
+  } else if (isArithmeticExpression(expression)) {
+    const { expressions = [] } = expression;
+    for (const e of expressions) {
+      if (expressionIsIncomplete(e)) {
+        return firstIncompleteExpression(e);
+      }
+    }
+  }
+};
+var replaceUnknownExpression = (incompleteExpression, unknownExpression, expression) => {
+  const { expressions = [] } = incompleteExpression;
+  if (expressions.includes(unknownExpression)) {
+    const pos = expressions.indexOf(unknownExpression);
+    expressions.splice(pos, 1, expression);
+    return true;
+  } else {
+    for (const e of expressions) {
+      if (replaceUnknownExpression(e, unknownExpression, expression)) {
+        return true;
+      }
+    }
+  }
+  return false;
+};
+var expressionIsIncomplete = (expression) => {
+  if (isUnknown(expression)) {
+    return true;
+  } else if (isConditionalExpression(expression)) {
+    return expressionIsIncomplete(expression.condition) || expressionIsIncomplete(expression.truthyExpression) || expressionIsIncomplete(expression.falsyExpression);
+  } else if (isRelationalExpression(expression) || isBooleanCondition(expression)) {
+    return expression.op === void 0 || expression.expressions.some((e) => expressionIsIncomplete(e));
+  }
+  return false;
+};
+var addExpression = (expression, subExpression) => {
+  const targetExpression = firstIncompleteExpression(expression);
+  if (targetExpression) {
+    if (targetExpression.expressions) {
+      targetExpression.expressions.push(subExpression);
+    } else {
+      console.warn("don't know how to treat targetExpression");
+    }
+  } else {
+    console.error("no target expression found");
+  }
+};
+var _expression, _callStack;
+var ColumnExpression = class {
+  constructor() {
+    __privateAdd(this, _expression, void 0);
+    __privateAdd(this, _callStack, []);
+  }
+  setCondition(booleanOperator) {
+    if (__privateGet(this, _expression) === void 0) {
+      this.addExpression(new ConditionalExpressionImpl(booleanOperator));
+    } else if (isConditionalExpression(__privateGet(this, _expression))) {
+      if (expressionIsIncomplete(__privateGet(this, _expression).condition)) {
+        const condition = booleanOperator ? new BooleanConditionImp(booleanOperator) : new RelationalExpressionImpl();
+        this.addExpression(condition);
+      } else if (isUnknown(__privateGet(this, _expression).truthyExpression)) {
+        __privateGet(this, _expression).truthyExpression = new ConditionalExpressionImpl(
+          booleanOperator
+        );
+      } else if (expressionIsIncomplete(__privateGet(this, _expression).truthyExpression)) {
+        const condition = booleanOperator ? new BooleanConditionImp(booleanOperator) : new RelationalExpressionImpl();
+        this.addExpression(condition);
+      } else if (isUnknown(__privateGet(this, _expression).falsyExpression)) {
+        __privateGet(this, _expression).falsyExpression = new ConditionalExpressionImpl(
+          booleanOperator
+        );
+      } else if (expressionIsIncomplete(__privateGet(this, _expression).falsyExpression)) {
+        const condition = booleanOperator ? new BooleanConditionImp(booleanOperator) : new RelationalExpressionImpl();
+        this.addExpression(condition);
+      }
+    } else {
+      console.error("setCondition called unexpectedly");
+    }
+  }
+  addExpression(expression) {
+    if (__privateGet(this, _callStack).length > 0) {
+      const currentCallExpression = __privateGet(this, _callStack).at(-1);
+      currentCallExpression == null ? void 0 : currentCallExpression.arguments.push(expression);
+    } else if (__privateGet(this, _expression) === void 0) {
+      __privateSet(this, _expression, expression);
+    } else if (isArithmeticExpression(__privateGet(this, _expression))) {
+      const targetExpression = firstIncompleteExpression(__privateGet(this, _expression));
+      if (targetExpression && isUnknown(targetExpression)) {
+        replaceUnknownExpression(
+          __privateGet(this, _expression),
+          targetExpression,
+          expression
+        );
+      }
+    } else if (isConditionalExpression(__privateGet(this, _expression))) {
+      if (expressionIsIncomplete(__privateGet(this, _expression))) {
+        const targetExpression = firstIncompleteExpression(__privateGet(this, _expression));
+        if (targetExpression && isUnknown(targetExpression)) {
+          replaceUnknownExpression(
+            __privateGet(this, _expression),
+            targetExpression,
+            expression
+          );
+        } else if (targetExpression) {
+          addExpression(targetExpression, expression);
+        }
+      }
+    }
+  }
+  setFunction(functionName) {
+    const callExpression = new CallExpressionImpl(functionName);
+    this.addExpression(callExpression);
+    __privateGet(this, _callStack).push(callExpression);
+  }
+  setColumn(columnName) {
+    this.addExpression(new ColumnExpressionImpl(columnName));
+  }
+  setArithmeticOp(value) {
+    const op = value;
+    const expression = __privateGet(this, _expression);
+    if (isArithmeticExpression(expression)) {
+      expression.op = op;
+    }
+  }
+  setRelationalOperator(value) {
+    const op = value;
+    if (__privateGet(this, _expression) && isConditionalExpression(__privateGet(this, _expression))) {
+      const targetExpression = firstIncompleteExpression(__privateGet(this, _expression));
+      if (isRelationalExpression(targetExpression)) {
+        targetExpression.op = op;
+      } else {
+        console.error(`no target expression found (op = ${value})`);
+      }
+    }
+  }
+  setValue(value) {
+    const literalExpression = new LiteralExpressionImpl(value);
+    if (__privateGet(this, _expression) === void 0) {
+      __privateSet(this, _expression, literalExpression);
+    } else if (isArithmeticExpression(__privateGet(this, _expression))) {
+      this.addExpression(literalExpression);
+    } else if (isCallExpression(__privateGet(this, _expression))) {
+      __privateGet(this, _expression).arguments.push(literalExpression);
+    } else if (isConditionalExpression(__privateGet(this, _expression))) {
+      if (expressionIsIncomplete(__privateGet(this, _expression))) {
+        const targetExpression = firstIncompleteExpression(__privateGet(this, _expression));
+        if (targetExpression && isUnknown(targetExpression)) {
+          replaceUnknownExpression(
+            __privateGet(this, _expression),
+            targetExpression,
+            literalExpression
+          );
+        } else if (targetExpression) {
+          addExpression(targetExpression, literalExpression);
+        }
+      } else {
+        console.log("what do we do with value, in a complete expression");
+      }
+    }
+  }
+  closeBrace() {
+    __privateGet(this, _callStack).pop();
+  }
+  get expression() {
+    return __privateGet(this, _expression);
+  }
+  toJSON() {
+    var _a;
+    return (_a = __privateGet(this, _expression)) == null ? void 0 : _a.toJSON();
+  }
+};
+_expression = new WeakMap();
+_callStack = new WeakMap();
+var walkTree = (tree, source) => {
+  const columnExpression = new ColumnExpression();
+  const cursor = tree.cursor();
+  do {
+    const { name: name2, from, to } = cursor;
+    switch (name2) {
+      case "AndCondition":
+        columnExpression.setCondition("and");
+        break;
+      case "OrCondition":
+        columnExpression.setCondition("or");
+        break;
+      case "RelationalExpression":
+        columnExpression.setCondition();
+        break;
+      case "ArithmeticExpression":
+        columnExpression.addExpression(new ArithmeticExpressionImpl());
+        break;
+      case "Column":
+        {
+          const columnName = source.substring(from, to);
+          columnExpression.setColumn(columnName);
+        }
+        break;
+      case "Function":
+        {
+          const functionName = source.substring(from, to);
+          columnExpression.setFunction(functionName);
+        }
+        break;
+      case "Times":
+      case "Divide":
+      case "Plus":
+      case "Minus":
+        {
+          const op = source.substring(from, to);
+          columnExpression.setArithmeticOp(op);
+        }
+        break;
+      case "RelationalOperator":
+        {
+          const op = source.substring(from, to);
+          columnExpression.setRelationalOperator(op);
+        }
+        break;
+      case "False":
+      case "True":
+        {
+          const value = source.substring(from, to);
+          columnExpression.setValue(value === "true" ? true : false);
+        }
+        break;
+      case "String":
+        columnExpression.setValue(source.substring(from + 1, to - 1));
+        break;
+      case "Number":
+        columnExpression.setValue(parseFloat(source.substring(from, to)));
+        break;
+      case "CloseBrace":
+        columnExpression.closeBrace();
+        break;
+      default:
+    }
+  } while (cursor.next());
+  return columnExpression.toJSON();
+};
+
+// src/column-expression-input/column-language-parser/column-expression-parse-utils.ts
+var strictParser = parser.configure({ strict: true });
+var RelationalOperands = ["Number", "String"];
+var ColumnNamedTerms = [
+  ...RelationalOperands,
+  "AndCondition",
+  "ArithmeticExpression",
+  "BooleanOperator",
+  "RelationalOperatorOperator",
+  "CallExpression",
+  "CloseBrace",
+  "Column",
+  "Comma",
+  "ConditionalExpression",
+  "Divide",
+  "Equal",
+  "If",
+  "Minus",
+  "OpenBrace",
+  "OrCondition",
+  "ParenthesizedExpression",
+  "Plus",
+  "RelationalExpression",
+  "RelationalOperator",
+  "Times"
+];
+var isCompleteExpression = (src) => {
+  try {
+    strictParser.parse(src);
+    return true;
+  } catch (err) {
+    return false;
+  }
+};
+var lastNamedChild = (node) => {
+  let { lastChild } = node;
+  while (lastChild && !ColumnNamedTerms.includes(lastChild.name)) {
+    lastChild = lastChild.prevSibling;
+    console.log(lastChild == null ? void 0 : lastChild.name);
+  }
+  return lastChild;
+};
+var isCompleteRelationalExpression = (node) => {
+  if ((node == null ? void 0 : node.name) === "RelationalExpression") {
+    const { firstChild } = node;
+    const lastChild = lastNamedChild(node);
+    if ((firstChild == null ? void 0 : firstChild.name) === "Column" && typeof (lastChild == null ? void 0 : lastChild.name) === "string" && RelationalOperands.includes(lastChild.name)) {
+      return true;
+    }
+  }
+  return false;
+};
+
+// src/column-expression-input/highlighting.ts
+import {
+  HighlightStyle,
+  syntaxHighlighting,
+  tags
+} from "@vuu-ui/vuu-codemirror";
+var myHighlightStyle = HighlightStyle.define([
+  { tag: tags.variableName, color: "var(--vuuFilterEditor-variableColor)" },
+  { tag: tags.comment, color: "green", fontStyle: "italic" }
+]);
+var vuuHighlighting = syntaxHighlighting(myHighlightStyle);
+
+// src/column-expression-input/theme.ts
+import { EditorView } from "@vuu-ui/vuu-codemirror";
+var vuuTheme = EditorView.theme(
+  {
+    "&": {
+      border: "solid 1px var(--salt-container-primary-borderColor)",
+      color: "var(--vuuFilterEditor-color)",
+      backgroundColor: "var(--vuuFilterEditor-background)"
+    },
+    ".cm-content": {
+      caretColor: "var(--vuuFilterEditor-cursorColor)"
+    },
+    "&.cm-focused .cm-cursor": {
+      borderLeftColor: "var(--vuuFilterEditor-cursorColor)"
+    },
+    "&.cm-focused .cm-selectionBackground, ::selection": {
+      backgroundColor: "var(--vuuFilterEditor-selectionBackground)"
+    },
+    ".cm-selectionBackground, ::selection": {
+      backgroundColor: "var(--vuuFilterEditor-selectionBackground)"
+    },
+    ".cm-scroller": {
+      fontFamily: "var(--vuuFilterEditor-fontFamily)"
+    },
+    ".cm-tooltip": {
+      background: "var(--vuuFilterEditor-tooltipBackground)",
+      border: "var(--vuuFilterEditor-tooltipBorder)",
+      boxShadow: "var(--vuuFilterEditor-tooltipElevation)",
+      "&.cm-tooltip-autocomplete > ul": {
+        fontFamily: "var(--vuuFilterEditor-fontFamily)",
+        fontSize: "var(--vuuFilterEditor-fontSize)",
+        maxHeight: "240px"
+      },
+      "&.cm-tooltip-autocomplete > ul > li": {
+        height: "var(--vuuFilterEditor-suggestion-height)",
+        padding: "0 3px",
+        lineHeight: "var(--vuuFilterEditor-suggestion-height)"
+      },
+      "&.cm-tooltip-autocomplete li[aria-selected]": {
+        background: "var(--vuuFilterEditor-suggestion-selectedBackground)",
+        color: "var(--vuuFilterEditor-suggestion-selectedColor)"
+      },
+      "&.cm-tooltip-autocomplete li .cm-completionDetail": {
+        color: "var(--vuuFilterEditor-suggestion-detailColor)"
+      }
+    }
+  },
+  { dark: false }
+);
+
+// src/column-expression-input/useColumnAutoComplete.ts
+import {
+  booleanJoinSuggestions,
+  getNamedParentNode,
+  getPreviousNode,
+  getValue,
+  syntaxTree
+} from "@vuu-ui/vuu-codemirror";
+import { useCallback as useCallback4 } from "react";
+var applyPrefix = (completions, prefix) => prefix ? completions.map((completion) => {
+  var _a;
+  return {
+    ...completion,
+    apply: typeof completion.apply === "function" ? completion.apply : `${prefix}${(_a = completion.apply) != null ? _a : completion.label}`
+  };
+}) : completions;
+var isOperator = (node) => node === void 0 ? false : ["Times", "Divide", "Plus", "Minus"].includes(node.name);
+var completionDone = (onSubmit) => ({
+  apply: () => {
+    onSubmit == null ? void 0 : onSubmit();
+  },
+  label: "Done",
+  boost: 10
+});
+var getLastChild = (node, context) => {
+  var _a;
+  let { lastChild: childNode } = node;
+  const { pos } = context;
+  while (childNode) {
+    const isBeforeCursor = childNode.from < pos;
+    if (isBeforeCursor && ColumnNamedTerms.includes(childNode.name)) {
+      if (childNode.name === "ParenthesizedExpression") {
+        const expression = (_a = childNode.firstChild) == null ? void 0 : _a.nextSibling;
+        if (expression) {
+          childNode = expression;
+        }
+      }
+      return childNode;
+    } else {
+      childNode = childNode.prevSibling;
+    }
+  }
+};
+var getFunctionName = (node, state) => {
+  var _a;
+  if (node.name === "ArgList") {
+    const functionNode = node.prevSibling;
+    if (functionNode) {
+      return getValue(functionNode, state);
+    }
+  } else if (node.name === "OpenBrace") {
+    const maybeFunction = (_a = node.parent) == null ? void 0 : _a.prevSibling;
+    if ((maybeFunction == null ? void 0 : maybeFunction.name) === "Function") {
+      return getValue(maybeFunction, state);
+    }
+  }
+};
+var getRelationalOperator = (node, state) => {
+  if (node.name === "RelationalExpression") {
+    const lastNode = lastNamedChild(node);
+    if ((lastNode == null ? void 0 : lastNode.name) === "RelationalOperator") {
+      return getValue(lastNode, state);
+    }
+  } else {
+    const prevNode = node.prevSibling;
+    if ((prevNode == null ? void 0 : prevNode.name) === "RelationalOperator") {
+      return getValue(prevNode, state);
+    }
+  }
+};
+var getColumnName = (node, state) => {
+  var _a;
+  if (node.name === "RelationalExpression") {
+    if (((_a = node.firstChild) == null ? void 0 : _a.name) === "Column") {
+      return getValue(node.firstChild, state);
+    }
+  } else {
+    const prevNode = node.prevSibling;
+    if ((prevNode == null ? void 0 : prevNode.name) === "Column") {
+      return getValue(prevNode, state);
+    } else if ((prevNode == null ? void 0 : prevNode.name) === "RelationalOperator") {
+      return getColumnName(prevNode, state);
+    }
+  }
+};
+var makeSuggestions = async (context, suggestionProvider, suggestionType, optionalArgs = {}) => {
+  const options = await suggestionProvider.getSuggestions(
+    suggestionType,
+    optionalArgs
+  );
+  const { startsWith = "" } = optionalArgs;
+  return { from: context.pos - startsWith.length, options };
+};
+var handleConditionalExpression = (node, context, suggestionProvider, maybeComplete, onSubmit) => {
+  const lastChild = getLastChild(node, context);
+  console.log(`conditional expression last child ${lastChild == null ? void 0 : lastChild.name}`);
+  switch (lastChild == null ? void 0 : lastChild.name) {
+    case "If":
+      return makeSuggestions(context, suggestionProvider, "expression", {
+        prefix: "( "
+      });
+    case "OpenBrace":
+      return makeSuggestions(context, suggestionProvider, "expression");
+    case "Condition":
+      return makeSuggestions(context, suggestionProvider, "expression", {
+        prefix: ", "
+      });
+    case "CloseBrace":
+      if (maybeComplete) {
+        const options = [completionDone(onSubmit)];
+        return { from: context.pos, options };
+      }
+  }
+};
+var promptToSave = (context, onSubmit) => {
+  const options = [completionDone(onSubmit)];
+  return { from: context.pos, options };
+};
+var useColumnAutoComplete = (suggestionProvider, onSubmit) => {
+  const makeSuggestions2 = useCallback4(
+    async (context, suggestionType, optionalArgs = {}) => {
+      const options = await suggestionProvider.getSuggestions(
+        suggestionType,
+        optionalArgs
+      );
+      const { startsWith = "" } = optionalArgs;
+      return { from: context.pos - startsWith.length, options };
+    },
+    [suggestionProvider]
+  );
+  return useCallback4(
+    async (context) => {
+      var _a, _b;
+      const { state, pos } = context;
+      const word = (_a = context.matchBefore(/\w*/)) != null ? _a : {
+        from: 0,
+        to: 0,
+        text: void 0
+      };
+      const tree = syntaxTree(state);
+      const nodeBefore = tree.resolveInner(pos, -1);
+      const text = state.doc.toString();
+      const maybeComplete = isCompleteExpression(text);
+      switch (nodeBefore.name) {
+        case "If": {
+          console.log(`conditional expression  If`);
+          return makeSuggestions2(context, "expression", { prefix: "( " });
+        }
+        case "Condition":
+          {
+            const lastChild = getLastChild(nodeBefore, context);
+            if ((lastChild == null ? void 0 : lastChild.name) === "Column") {
+              const prevChild = getPreviousNode(lastChild);
+              if ((prevChild == null ? void 0 : prevChild.name) !== "RelationalOperator") {
+                return makeSuggestions2(context, "condition-operator", {
+                  columnName: getValue(lastChild, state)
+                });
+              }
+            } else if ((lastChild == null ? void 0 : lastChild.name) === "RelationalOperator") {
+              return makeSuggestions2(context, "expression");
+            }
+            console.log(`condition  last child ${lastChild == null ? void 0 : lastChild.name}`);
+          }
+          break;
+        case "ConditionalExpression":
+          return handleConditionalExpression(
+            nodeBefore,
+            context,
+            suggestionProvider
+          );
+        case "RelationalExpression":
+          {
+            if (isCompleteRelationalExpression(nodeBefore)) {
+              return {
+                from: context.pos,
+                options: booleanJoinSuggestions.concat({
+                  label: ", <truthy expression>, <falsy expression>",
+                  apply: ", "
+                })
+              };
+            } else {
+              const operator = getRelationalOperator(nodeBefore, state);
+              const columnName = getColumnName(nodeBefore, state);
+              if (!operator) {
+                const options = await suggestionProvider.getSuggestions(
+                  "condition-operator",
+                  {
+                    columnName
+                  }
+                );
+                return { from: context.pos, options };
+              } else {
+                return makeSuggestions2(context, "expression");
+              }
+            }
+          }
+          break;
+        case "RelationalOperator":
+          return makeSuggestions2(context, "expression");
+        case "String":
+          {
+            const operator = getRelationalOperator(
+              nodeBefore,
+              state
+            );
+            const columnName = getColumnName(nodeBefore, state);
+            const { from, to } = nodeBefore;
+            if (to - from === 2 && context.pos === from + 1) {
+              if (columnName && operator) {
+                return makeSuggestions2(context, "columnValue", {
+                  columnName,
+                  operator,
+                  startsWith: word.text
+                });
+              }
+            } else if (to - from > 2 && context.pos === to) {
+              return makeSuggestions2(context, "expression", {
+                prefix: ", "
+              });
+            }
+          }
+          break;
+        case "ArithmeticExpression":
+          {
+            const lastChild = getLastChild(nodeBefore, context);
+            if ((lastChild == null ? void 0 : lastChild.name) === "Column") {
+              return makeSuggestions2(context, "expression");
+            } else if (isOperator(lastChild)) {
+              const operator = lastChild.name;
+              return makeSuggestions2(context, "column", { operator });
+            }
+          }
+          break;
+        case "OpenBrace":
+          {
+            const functionName = getFunctionName(nodeBefore, state);
+            return makeSuggestions2(context, "expression", { functionName });
+          }
+          break;
+        case "ArgList": {
+          const functionName = getFunctionName(nodeBefore, state);
+          const lastArgument = getLastChild(nodeBefore, context);
+          const prefix = (lastArgument == null ? void 0 : lastArgument.name) === "OpenBrace" ? void 0 : ",";
+          let options = await suggestionProvider.getSuggestions("expression", {
+            functionName
+          });
+          options = prefix ? applyPrefix(options, ", ") : options;
+          if ((lastArgument == null ? void 0 : lastArgument.name) !== "OpenBrace" && (lastArgument == null ? void 0 : lastArgument.name) !== "Comma") {
+            options = [
+              {
+                apply: ") ",
+                boost: 10,
+                label: "Done - no more arguments"
+              }
+            ].concat(options);
+          }
+          return { from: context.pos, options };
+        }
+        case "Equal":
+          if (text.trim() === "=") {
+            return makeSuggestions2(context, "expression");
+          }
+          break;
+        case "ParenthesizedExpression":
+        case "ColumnDefinitionExpression":
+          if (context.pos === 0) {
+            return makeSuggestions2(context, "expression");
+          } else {
+            const lastChild = getLastChild(nodeBefore, context);
+            if ((lastChild == null ? void 0 : lastChild.name) === "Column") {
+              if (maybeComplete) {
+                const options = [
+                  completionDone(onSubmit.current)
+                ];
+                const columnName = getValue(lastChild, state);
+                const columnOptions = await suggestionProvider.getSuggestions("operator", {
+                  columnName
+                });
+                return {
+                  from: context.pos,
+                  options: options.concat(columnOptions)
+                };
+              }
+            } else if ((lastChild == null ? void 0 : lastChild.name) === "CallExpression") {
+              if (maybeComplete) {
+                return {
+                  from: context.pos,
+                  options: [completionDone(onSubmit.current)]
+                };
+              }
+            } else if ((lastChild == null ? void 0 : lastChild.name) === "ArithmeticExpression") {
+              if (maybeComplete) {
+                let options = [completionDone(onSubmit.current)];
+                const lastExpressionChild = getLastChild(lastChild, context);
+                if ((lastExpressionChild == null ? void 0 : lastExpressionChild.name) === "Column") {
+                  const columnName = getValue(lastExpressionChild, state);
+                  const suggestions = await suggestionProvider.getSuggestions(
+                    "operator",
+                    { columnName }
+                  );
+                  options = options.concat(suggestions);
+                }
+                return {
+                  from: context.pos,
+                  options
+                };
+              }
+            } else if ((lastChild == null ? void 0 : lastChild.name) === "ConditionalExpression") {
+              return handleConditionalExpression(
+                lastChild,
+                context,
+                suggestionProvider,
+                maybeComplete,
+                onSubmit.current
+              );
+            }
+            break;
+          }
+        case "Column":
+          {
+            const isPartialMatch = await suggestionProvider.isPartialMatch(
+              "expression",
+              void 0,
+              word.text
+            );
+            if (isPartialMatch) {
+              return makeSuggestions2(context, "expression", {
+                startsWith: word.text
+              });
+            }
+          }
+          break;
+        case "Comma":
+          {
+            const parentNode = getNamedParentNode(nodeBefore);
+            if ((parentNode == null ? void 0 : parentNode.name) === "ConditionalExpression") {
+              return makeSuggestions2(context, "expression");
+            }
+          }
+          break;
+        case "CloseBrace":
+          {
+            const parentNode = getNamedParentNode(nodeBefore);
+            if ((parentNode == null ? void 0 : parentNode.name) === "ConditionalExpression") {
+              return handleConditionalExpression(
+                parentNode,
+                context,
+                suggestionProvider,
+                maybeComplete,
+                onSubmit.current
+              );
+            } else if ((parentNode == null ? void 0 : parentNode.name) === "ArgList") {
+              if (maybeComplete) {
+                return promptToSave(context, onSubmit.current);
+              }
+            }
+          }
+          break;
+        default: {
+          if (((_b = nodeBefore == null ? void 0 : nodeBefore.prevSibling) == null ? void 0 : _b.name) === "FilterClause") {
+            console.log("looks like we ight be a or|and operator");
+          }
+        }
+      }
+    },
+    [makeSuggestions2, onSubmit, suggestionProvider]
+  );
+};
+
+// src/column-expression-input/useColumnExpressionEditor.ts
+var getView = (ref) => {
+  if (ref.current == void 0) {
+    throw Error("EditorView not defined");
+  }
+  return ref.current;
+};
+var getOptionClass = () => {
+  return "vuuSuggestion";
+};
+var noop = () => console.log("noooop");
+var hasExpressionType = (completion) => "expressionType" in completion;
+var injectOptionContent = (completion) => {
+  if (hasExpressionType(completion)) {
+    const div = createEl("div", "expression-type-container");
+    const span = createEl("span", "expression-type", completion.expressionType);
+    div.appendChild(span);
+    return div;
+  } else {
+    return null;
+  }
+};
+var useColumnExpressionEditor = ({
+  onChange,
+  onSubmitExpression,
+  source,
+  suggestionProvider
+}) => {
+  const editorRef = useRef4(null);
+  const onSubmitRef = useRef4(noop);
+  const viewRef = useRef4();
+  const completionFn = useColumnAutoComplete(suggestionProvider, onSubmitRef);
+  const [createState, clearInput] = useMemo3(() => {
+    const parseExpression = () => {
+      const view = getView(viewRef);
+      const source2 = view.state.doc.toString();
+      const tree = ensureSyntaxTree(view.state, view.state.doc.length, 5e3);
+      if (tree) {
+        const expression = walkTree(tree, source2);
+        return [source2, expression];
+      } else {
+        return ["", void 0];
+      }
+    };
+    const clearInput2 = () => {
+      getView(viewRef).setState(createState2());
+    };
+    const submitExpression = () => {
+      const [source2, expression] = parseExpression();
+      onSubmitExpression == null ? void 0 : onSubmitExpression(source2, expression);
+    };
+    const showSuggestions = (key) => {
+      return keymap.of([
+        {
+          key,
+          run() {
+            startCompletion(getView(viewRef));
+            return true;
+          }
+        }
+      ]);
+    };
+    const createState2 = () => EditorState2.create({
+      doc: source,
+      extensions: [
+        minimalSetup,
+        autocompletion({
+          addToOptions: [
+            {
+              render: injectOptionContent,
+              position: 70
+            }
+          ],
+          override: [completionFn],
+          optionClass: getOptionClass
+        }),
+        columnExpressionLanguageSupport(),
+        keymap.of(defaultKeymap),
+        showSuggestions("ArrowDown"),
+        EditorView2.updateListener.of((v) => {
+          const view = getView(viewRef);
+          if (v.docChanged) {
+            startCompletion(view);
+            const source2 = view.state.doc.toString();
+            onChange == null ? void 0 : onChange(source2);
+          }
+        }),
+        // Enforces single line view
+        // EditorState.transactionFilter.of((tr) =>
+        //   tr.newDoc.lines > 1 ? [] : tr
+        // ),
+        vuuTheme,
+        vuuHighlighting
+      ]
+    });
+    onSubmitRef.current = () => {
+      submitExpression();
+    };
+    return [createState2, clearInput2];
+  }, [completionFn, onChange, onSubmitExpression, source]);
+  useEffect3(() => {
+    if (!editorRef.current) {
+      throw Error("editor not in dom");
+    }
+    viewRef.current = new EditorView2({
+      state: createState(),
+      parent: editorRef.current
+    });
+    return () => {
+      var _a;
+      (_a = viewRef.current) == null ? void 0 : _a.destroy();
+    };
+  }, [completionFn, createState]);
+  return { editorRef, clearInput };
+};
+
+// src/column-expression-input/ColumnExpressionInput.tsx
+import { jsx as jsx7 } from "react/jsx-runtime";
+var classBase7 = "vuuColumnExpressionInput";
+var ColumnExpressionInput = ({
+  onChange,
+  onSubmitExpression,
+  source = "",
+  suggestionProvider
+}) => {
+  const { editorRef } = useColumnExpressionEditor({
+    onChange,
+    onSubmitExpression,
+    source,
+    suggestionProvider
+  });
+  return /* @__PURE__ */ jsx7("div", { className: `${classBase7}`, ref: editorRef });
+};
+
+// src/column-expression-input/useColumnExpressionSuggestionProvider.ts
+import {
+  AnnotationType,
+  getRelationalOperators,
+  numericOperators,
+  stringOperators,
+  toSuggestions
+} from "@vuu-ui/vuu-codemirror";
+import {
+  getTypeaheadParams,
+  useTypeaheadSuggestions
+} from "@vuu-ui/vuu-data-react";
+import { isNumericColumn, isTextColumn } from "@vuu-ui/vuu-utils";
+import { useCallback as useCallback5, useRef as useRef5 } from "react";
+
+// src/column-expression-input/column-function-descriptors.ts
+var columnFunctionDescriptors = [
+  /**
+   * concatenate()
+   */
+  {
+    accepts: "string",
+    description: "Returns multiple string values as a single joined string. Arguments may be string literal values, string columns or other string expressions. Non string arguments may also be included, these will be converted to strings.",
+    example: {
+      expression: 'concatenate("example", "-test")',
+      result: '"example-test"'
+    },
+    name: "concatenate",
+    params: {
+      description: "( string, string, [ string* ] )"
+    },
+    type: "string"
+  },
+  /**
+   * contains()
+   */
+  {
+    accepts: ["string", "string"],
+    description: "Tests a string value to determine whether it contains a given substring. Accepts two arguments: source text and target substring. Returns true if <source text> contains one or more occurrences of <target subscring>",
+    example: {
+      expression: 'contains("Royal Bank of Scotland", "bank")',
+      result: "true"
+    },
+    name: "contains",
+    params: {
+      description: "( string )"
+    },
+    type: "boolean"
+  },
+  /**
+   * left()
+   */
+  {
+    accepts: ["string", "number"],
+    description: "Returns the leftmost <number> characters from <string>. First argument may be a string literal, string column or other string expression.",
+    example: {
+      expression: 'left("USD Benchmark Report", 3)',
+      result: '"USD"'
+    },
+    name: "left",
+    params: {
+      count: 2,
+      description: "( string, number )"
+    },
+    type: "string"
+  },
+  /**
+   * len()
+   */
+  {
+    accepts: "string",
+    description: "Returns the number of characters in <string>. Argument may be a string literal, string column or other string expression.",
+    example: {
+      expression: 'len("example")',
+      result: "7"
+    },
+    name: "len",
+    params: {
+      description: "(string)"
+    },
+    type: "number"
+  },
+  /**
+   * lower()
+   */
+  {
+    accepts: "string",
+    description: "Convert a string value to lowercase. Argument may be a string column or other string expression.",
+    example: {
+      expression: 'lower("examPLE")',
+      result: '"example"'
+    },
+    name: "lower",
+    params: {
+      description: "( string )"
+    },
+    type: "string"
+  },
+  /**
+   * upper()
+   */
+  {
+    accepts: "string",
+    description: "Convert a string value to uppercase. Argument may be a string column or other string expression.",
+    example: {
+      expression: 'upper("example")',
+      result: '"EXAMPLE"'
+    },
+    name: "upper",
+    params: {
+      description: "( string )"
+    },
+    type: "string"
+  },
+  /**
+   * right()
+   */
+  {
+    accepts: ["string", "number"],
+    description: "Returns the rightmost <number> characters from <string>. First argument may be a string literal, string column or other string expression.",
+    example: {
+      expression: "blah",
+      result: "blah"
+    },
+    name: "right",
+    params: {
+      description: "( string )"
+    },
+    type: "string"
+  },
+  /**
+   * replace()
+   */
+  {
+    accepts: ["string", "string", "string"],
+    description: "Replace characters within a string. Accepts three arguments: source text, text to replace and replacement text. Returns a copy of <source text> with any occurrences of <text to replace> replaced by <replacement text>",
+    example: {
+      expression: "blah",
+      result: "blah"
+    },
+    name: "replace",
+    params: {
+      description: "( string )"
+    },
+    type: "string"
+  },
+  /**
+   * text()
+   */
+  {
+    accepts: "number",
+    description: "Converts a number to a string.",
+    example: {
+      expression: "blah",
+      result: "blah"
+    },
+    name: "text",
+    params: {
+      description: "( string )"
+    },
+    type: "string"
+  },
+  /**
+   * starts()
+   */
+  {
+    accepts: "string",
+    description: "Tests a string value to determine whether it starts with a given substring. Accepts two arguments: source text and target substring. Returns true if <source text> starts with <target subscring>.",
+    example: {
+      expression: "blah",
+      result: "blah"
+    },
+    name: "starts",
+    params: {
+      description: "( string )"
+    },
+    type: "boolean"
+  },
+  /**
+   * starts()
+   */
+  {
+    accepts: "string",
+    description: "Tests a string value to determine whether it ends with a given substring. Accepts two arguments: source text and target substring. Returns true if <source text> ends with <target subscring>.",
+    example: {
+      expression: "blah",
+      result: "blah"
+    },
+    name: "ends",
+    params: {
+      description: "( string )"
+    },
+    type: "boolean"
+  },
+  {
+    accepts: "number",
+    description: "blah",
+    example: {
+      expression: "blah",
+      result: "blah"
+    },
+    name: "min",
+    params: {
+      description: "( string )"
+    },
+    type: "number"
+  },
+  {
+    accepts: "number",
+    description: "blah",
+    example: {
+      expression: "blah",
+      result: "blah"
+    },
+    name: "max",
+    params: {
+      description: "( string )"
+    },
+    type: "number"
+  },
+  {
+    accepts: "number",
+    description: "blah",
+    example: {
+      expression: "blah",
+      result: "blah"
+    },
+    name: "sum",
+    params: {
+      description: "( string )"
+    },
+    type: "number"
+  },
+  {
+    accepts: "number",
+    description: "blah",
+    example: {
+      expression: "blah",
+      result: "blah"
+    },
+    name: "round",
+    params: {
+      description: "( string )"
+    },
+    type: "number"
+  },
+  {
+    accepts: "any",
+    description: "blah",
+    example: {
+      expression: "blah",
+      result: "blah"
+    },
+    name: "or",
+    params: {
+      description: "( string )"
+    },
+    type: "boolean"
+  },
+  {
+    accepts: "any",
+    description: "blah",
+    example: {
+      expression: "blah",
+      result: "blah"
+    },
+    name: "and",
+    params: {
+      description: "( string )"
+    },
+    type: "boolean"
+  },
+  {
+    accepts: "any",
+    description: "Return one of two possible result values, depending on the evaluation of a filter expression. If <filterExpression> resolves to true, result is <expression1>, otherwise <expression2>. ",
+    example: {
+      expression: "blah",
+      result: "blah"
+    },
+    name: "if",
+    params: {
+      description: "( filterExpression, expression1, expression 2)"
+    },
+    type: "variable"
+  }
+];
+
+// src/column-expression-input/functionDocInfo.ts
+import { createEl as createEl2 } from "@vuu-ui/vuu-utils";
+var functionDocInfo = ({
+  name: name2,
+  description,
+  example,
+  params,
+  type
+}) => {
+  const rootElement = createEl2("div", "vuuFunctionDoc");
+  const headingElement = createEl2("div", "function-heading");
+  const nameElement = createEl2("span", "function-name", name2);
+  const paramElement = createEl2("span", "param-list", params.description);
+  const typeElement = createEl2("span", "function-type", type);
+  headingElement.appendChild(nameElement);
+  headingElement.appendChild(paramElement);
+  headingElement.appendChild(typeElement);
+  const child2 = createEl2("p", void 0, description);
+  rootElement.appendChild(headingElement);
+  rootElement.appendChild(child2);
+  if (example) {
+    const exampleElement = createEl2("div", "example-container", "Example:");
+    const expressionElement = createEl2(
+      "div",
+      "example-expression",
+      example.expression
+    );
+    const resultElement = createEl2("div", "example-result", example.result);
+    exampleElement.appendChild(expressionElement);
+    exampleElement.appendChild(resultElement);
+    rootElement.appendChild(exampleElement);
+  }
+  return rootElement;
+};
+
+// src/column-expression-input/useColumnExpressionSuggestionProvider.ts
+var NO_OPERATORS = [];
+var withApplySpace = (suggestions) => suggestions.map((suggestion) => {
+  var _a;
+  return {
+    ...suggestion,
+    apply: ((_a = suggestion.apply) != null ? _a : suggestion.label) + " "
+  };
+});
+var getValidColumns = (columns, { functionName, operator }) => {
+  if (operator) {
+    return columns.filter(isNumericColumn);
+  } else if (functionName) {
+    const fn = columnFunctionDescriptors.find((f) => f.name === functionName);
+    if (fn) {
+      switch (fn.accepts) {
+        case "string":
+          return columns.filter(isTextColumn);
+        case "number":
+          return columns.filter(isNumericColumn);
+        default:
+          return columns;
+      }
+    }
+  }
+  return columns;
+};
+var getColumns = (columns, options) => {
+  const validColumns = getValidColumns(columns, options);
+  return validColumns.map((column) => {
+    var _a;
+    const label = (_a = column.label) != null ? _a : column.name;
+    return {
+      apply: options.prefix ? `${options.prefix}${label}` : label,
+      label,
+      boost: 5,
+      type: "column",
+      expressionType: column.serverDataType
+    };
+  });
+};
+var arithmeticOperators = [
+  { apply: "* ", boost: 2, label: "*", type: "operator" },
+  { apply: "/ ", boost: 2, label: "/", type: "operator" },
+  { apply: "+ ", boost: 2, label: "+", type: "operator" },
+  { apply: "- ", boost: 2, label: "-", type: "operator" }
+];
+var getOperators = (column) => {
+  if (column === void 0 || isNumericColumn(column)) {
+    return arithmeticOperators;
+  } else {
+    return NO_OPERATORS;
+  }
+};
+var getConditionOperators = (column) => {
+  switch (column.serverDataType) {
+    case "string":
+    case "char":
+      return withApplySpace(
+        stringOperators
+        /*, startsWith*/
+      );
+    case "int":
+    case "long":
+    case "double":
+      return withApplySpace(numericOperators);
+  }
+};
+var toFunctionCompletion = (functionDescriptor) => ({
+  apply: `${functionDescriptor.name}( `,
+  boost: 2,
+  expressionType: functionDescriptor.type,
+  info: () => functionDocInfo(functionDescriptor),
+  label: functionDescriptor.name,
+  type: "function"
+});
+var getAcceptedTypes = (fn) => {
+  if (fn) {
+    if (typeof fn.accepts === "string") {
+      return fn.accepts;
+    } else if (Array.isArray(fn.accepts)) {
+      if (fn.accepts.every((s) => s === "string")) {
+        return "string";
+      } else {
+        return "any";
+      }
+    }
+  }
+  return "any";
+};
+var functions = columnFunctionDescriptors.map(toFunctionCompletion);
+var getFunctions = ({ functionName }) => {
+  if (functionName) {
+    const fn = columnFunctionDescriptors.find((f) => f.name === functionName);
+    const acceptedTypes = getAcceptedTypes(fn);
+    if (fn) {
+      switch (acceptedTypes) {
+        case "string":
+          return columnFunctionDescriptors.filter((f) => f.type === "string" || f.type === "variable").map(toFunctionCompletion);
+        case "number":
+          return columnFunctionDescriptors.filter((f) => f.type === "number" || f.type === "variable").map(toFunctionCompletion);
+        default:
+      }
+    }
+  }
+  return functions;
+};
+var NONE = {};
+var useColumnExpressionSuggestionProvider = ({
+  columns,
+  table
+}) => {
+  const findColumn2 = useCallback5(
+    (name2) => name2 ? columns.find((col) => col.name === name2) : void 0,
+    [columns]
+  );
+  const latestSuggestionsRef = useRef5();
+  const getTypeaheadSuggestions = useTypeaheadSuggestions();
+  const getSuggestions = useCallback5(
+    async (suggestionType, options = NONE) => {
+      const { columnName, functionName, operator, prefix } = options;
+      switch (suggestionType) {
+        case "expression": {
+          const suggestions = await withApplySpace(
+            getColumns(columns, { functionName, prefix })
+          ).concat(getFunctions(options));
+          return latestSuggestionsRef.current = suggestions;
+        }
+        case "column": {
+          const suggestions = await getColumns(columns, options);
+          return latestSuggestionsRef.current = withApplySpace(suggestions);
+        }
+        case "operator": {
+          const suggestions = await getOperators(findColumn2(columnName));
+          return latestSuggestionsRef.current = withApplySpace(suggestions);
+        }
+        case "relational-operator": {
+          const suggestions = await getRelationalOperators(
+            findColumn2(columnName)
+          );
+          return latestSuggestionsRef.current = withApplySpace(suggestions);
+        }
+        case "condition-operator":
+          {
+            const column = findColumn2(columnName);
+            if (column) {
+              const suggestions = await getConditionOperators(column);
+              if (suggestions) {
+                return latestSuggestionsRef.current = withApplySpace(suggestions);
+              }
+            }
+          }
+          break;
+        case "columnValue":
+          if (columnName && operator) {
+            const params = getTypeaheadParams(
+              table,
+              columnName
+              /*, startsWith*/
+            );
+            const suggestions = await getTypeaheadSuggestions(params);
+            latestSuggestionsRef.current = toSuggestions(suggestions, {
+              suffix: ""
+            });
+            latestSuggestionsRef.current.forEach((suggestion) => {
+              suggestion.apply = (view, completion, from) => {
+                const annotation = new AnnotationType();
+                const cursorPos = from + completion.label.length + 1;
+                view.dispatch({
+                  changes: { from, insert: completion.label },
+                  selection: { anchor: cursorPos, head: cursorPos },
+                  annotations: annotation.of(completion)
+                });
+              };
+            });
+            return latestSuggestionsRef.current;
+          }
+          break;
+      }
+      return [];
+    },
+    [columns, findColumn2, getTypeaheadSuggestions, table]
+  );
+  const isPartialMatch = useCallback5(
+    async (valueType, columnName, pattern) => {
+      const { current: latestSuggestions } = latestSuggestionsRef;
+      let maybe = false;
+      const suggestions = latestSuggestions || await getSuggestions(valueType, { columnName });
+      if (pattern && suggestions) {
+        for (const option of suggestions) {
+          if (option.label === pattern) {
+            return false;
+          } else if (option.label.startsWith(pattern)) {
+            maybe = true;
+          }
+        }
+      }
+      return maybe;
+    },
+    [getSuggestions]
+  );
+  return {
+    getSuggestions,
+    isPartialMatch
+  };
+};
+
+// src/column-expression-panel/useColumnExpression.ts
+import {
+  getCalculatedColumnDetails,
+  setCalculatedColumnExpression,
+  setCalculatedColumnName as setCalculatedColumnName2,
+  setCalculatedColumnType
+} from "@vuu-ui/vuu-utils";
+import { useCallback as useCallback6, useRef as useRef6, useState as useState3 } from "react";
+var applyDefaults = (column) => {
+  const [name2, expression, type] = getCalculatedColumnDetails(column);
+  if (type === "") {
+    return {
+      ...column,
+      name: `${name2}:${expression}:string`
+    };
+  } else {
+    return column;
+  }
+};
+var useColumnExpression = ({
+  column: columnProp,
+  onSave: onSaveProp
+}) => {
+  const [column, setColumn] = useState3(
+    applyDefaults(columnProp)
+  );
+  const expressionRef = useRef6(getCalculatedColumnDetails(column)[1]);
+  const onChangeName = useCallback6((evt) => {
+    const { value } = evt.target;
+    setColumn((state) => setCalculatedColumnName2(state, value));
+  }, []);
+  const onChangeExpression = useCallback6((value) => {
+    expressionRef.current = value.trim();
+  }, []);
+  const onChangeType = useCallback6((evt, value) => {
+    if (typeof value === "string") {
+      setColumn((state) => setCalculatedColumnType(state, value));
+    }
+  }, []);
+  const onSave = useCallback6(() => {
+    const newColumn = setCalculatedColumnExpression(
+      column,
+      expressionRef.current
+    );
+    setColumn(newColumn);
+    onSaveProp(newColumn);
+  }, [column, onSaveProp]);
+  return {
+    column,
+    onChangeExpression,
+    onChangeName,
+    onChangeType,
+    onSave
+  };
+};
+
+// src/column-expression-panel/ColumnExpressionPanel.tsx
+import { jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
+var classBase8 = "vuuColumnExpressionPanel";
+var ColumnExpressionPanel = ({
+  column: columnProp,
+  onSave: onSaveProp,
+  tableConfig,
+  vuuTable
+}) => {
+  const typeRef = useRef7(null);
+  const { column, onChangeExpression, onChangeName, onChangeType, onSave } = useColumnExpression({ column: columnProp, onSave: onSaveProp });
+  const suggestionProvider = useColumnExpressionSuggestionProvider({
+    columns: tableConfig.columns,
+    table: vuuTable
+  });
+  const handleSubmitExpression = useCallback7(() => {
+    requestAnimationFrame(() => {
+      var _a, _b;
+      (_b = (_a = typeRef.current) == null ? void 0 : _a.querySelector("button")) == null ? void 0 : _b.focus();
+    });
+  }, []);
+  return /* @__PURE__ */ jsxs7("div", { className: classBase8, children: [
+    /* @__PURE__ */ jsx8("div", { className: "vuuColumnSettingsPanel-header", children: /* @__PURE__ */ jsx8("span", { children: "Calculation" }) }),
+    /* @__PURE__ */ jsxs7(FormField3, { "data-field": "column-name", children: [
+      /* @__PURE__ */ jsx8(FormFieldLabel3, { children: "Column Name" }),
+      /* @__PURE__ */ jsx8(
+        Input2,
+        {
+          className: "vuuInput",
+          onChange: onChangeName,
+          value: getCalculatedColumnName(column)
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxs7(FormField3, { "data-field": "column-expression", children: [
+      /* @__PURE__ */ jsx8(FormFieldLabel3, { children: "Expression" }),
+      /* @__PURE__ */ jsx8(
+        ColumnExpressionInput,
+        {
+          onChange: onChangeExpression,
+          onSubmitExpression: handleSubmitExpression,
+          source: getCalculatedColumnExpression(column),
+          suggestionProvider
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxs7(FormField3, { "data-field": "type", children: [
+      /* @__PURE__ */ jsx8(FormFieldLabel3, { children: "Column type" }),
+      /* @__PURE__ */ jsx8(
+        Dropdown2,
+        {
+          className: `${classBase8}-type`,
+          onSelectionChange: onChangeType,
+          ref: typeRef,
+          selected: getCalculatedColumnType(column) || null,
+          source: ["double", "long", "string"],
+          width: "100%"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxs7("div", { className: "vuuColumnSettingsPanel-buttonBar", "data-align": "right", children: [
+      /* @__PURE__ */ jsx8(Button, { className: `${classBase8}-buttonCancel`, tabIndex: -1, children: "cancel" }),
+      /* @__PURE__ */ jsx8(Button, { className: `${classBase8}-buttonApply`, tabIndex: -1, children: "apply" }),
+      /* @__PURE__ */ jsx8(
+        Button,
+        {
+          className: `${classBase8}-buttonSave`,
+          onClick: onSave,
+          variant: "cta",
+          children: "save"
+        }
+      )
+    ] })
+  ] });
+};
+
+// src/column-settings/ColumnSettingsPanel.tsx
+import { VuuInput } from "@vuu-ui/vuu-ui-controls";
+import { jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
+var classBase9 = "vuuColumnSettingsPanel";
+var ColumnSettingsPanel = ({
+  column: columnProp,
+  onConfigChange,
+  onCreateCalculatedColumn,
+  tableConfig,
+  vuuTable
+}) => {
+  const isNewCalculatedColumn = columnProp.name === "::";
+  const {
+    availableRenderers,
+    selectedCellRenderer,
+    column,
+    navigateNextColumn,
+    navigatePrevColumn,
+    onChange,
+    onChangeFormatting,
+    onChangeRenderer,
+    onInputCommit,
+    onSave
+  } = useColumnSettings({
+    column: columnProp,
+    onConfigChange,
+    onCreateCalculatedColumn,
+    tableConfig
+  });
+  const {
+    serverDataType,
+    align = getDefaultAlignment(serverDataType),
+    name: name2,
+    label = name2,
+    pin,
+    width
+  } = column;
+  return /* @__PURE__ */ jsxs8("div", { className: classBase9, children: [
+    /* @__PURE__ */ jsx9("div", { className: `${classBase9}-header`, children: /* @__PURE__ */ jsx9("span", { children: name2 }) }),
+    /* @__PURE__ */ jsxs8(FormField4, { "data-field": "column-label", children: [
+      /* @__PURE__ */ jsx9(FormFieldLabel4, { children: "Column Label" }),
+      /* @__PURE__ */ jsx9(
+        VuuInput,
+        {
+          className: "vuuInput",
+          onChange,
+          onCommit: onInputCommit,
+          value: label
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxs8(FormField4, { "data-field": "column-width", children: [
+      /* @__PURE__ */ jsx9(FormFieldLabel4, { children: "Column Width" }),
+      /* @__PURE__ */ jsx9(
+        VuuInput,
+        {
+          className: "vuuInput",
+          onChange,
+          value: width,
+          onCommit: onInputCommit
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxs8(FormField4, { "data-field": "column-alignment", children: [
+      /* @__PURE__ */ jsx9(FormFieldLabel4, { children: "Alignment" }),
+      /* @__PURE__ */ jsxs8(
+        ToggleButtonGroup,
+        {
+          className: "vuuToggleButtonGroup",
+          onChange,
+          value: align,
+          children: [
+            /* @__PURE__ */ jsx9(
+              ToggleButton,
+              {
+                "data-icon": "align-left",
+                className: "vuuIconToggleButton",
+                value: "left"
+              }
+            ),
+            /* @__PURE__ */ jsx9(
+              ToggleButton,
+              {
+                "data-icon": "align-right",
+                className: "vuuIconToggleButton",
+                value: "right"
+              }
+            )
+          ]
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxs8(FormField4, { "data-field": "column-pin", children: [
+      /* @__PURE__ */ jsx9(FormFieldLabel4, { children: "Pin Column" }),
+      /* @__PURE__ */ jsxs8(
+        ToggleButtonGroup,
+        {
+          className: "vuuToggleButtonGroup",
+          onChange,
+          value: pin != null ? pin : "",
+          children: [
+            /* @__PURE__ */ jsx9(
+              ToggleButton,
+              {
+                className: "vuuIconToggleButton",
+                "data-icon": "cross-circle",
+                value: ""
+              }
+            ),
+            /* @__PURE__ */ jsx9(
+              ToggleButton,
+              {
+                className: "vuuIconToggleButton",
+                "data-icon": "pin-left",
+                value: "left"
+              }
+            ),
+            /* @__PURE__ */ jsx9(
+              ToggleButton,
+              {
+                className: "vuuIconToggleButton",
+                "data-icon": "pin-float",
+                value: "floating"
+              }
+            ),
+            /* @__PURE__ */ jsx9(
+              ToggleButton,
+              {
+                className: "vuuIconToggleButton",
+                "data-icon": "pin-right",
+                value: "right"
+              }
+            )
+          ]
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx9(
+      ColumnFormattingPanel,
+      {
+        availableRenderers,
+        selectedCellRenderer,
+        column,
+        onChangeFormatting,
+        onChangeRenderer
+      }
+    ),
+    isCalculatedColumn(column.name) ? /* @__PURE__ */ jsx9(
+      ColumnExpressionPanel,
+      {
+        column,
+        onSave,
+        tableConfig,
+        vuuTable
+      }
+    ) : /* @__PURE__ */ jsxs8(
+      "div",
+      {
+        className: `${classBase9}-buttonBar`,
+        "data-align": isNewCalculatedColumn ? "right" : void 0,
+        children: [
+          /* @__PURE__ */ jsx9(
+            Button2,
+            {
+              className: `${classBase9}-buttonNavPrev`,
+              variant: "secondary",
+              "data-icon": "arrow-left",
+              onClick: navigatePrevColumn,
+              children: "PREVIOUS"
+            }
+          ),
+          /* @__PURE__ */ jsx9(
+            Button2,
+            {
+              className: `${classBase9}-buttonNavNext`,
+              variant: "secondary",
+              "data-icon": "arrow-right",
+              onClick: navigateNextColumn,
+              children: "NEXT"
+            }
+          )
+        ]
+      }
+    )
+  ] });
+};
+
+// src/datasource-stats/DatasourceStats.tsx
+import { useEffect as useEffect4, useState as useState4 } from "react";
+import cx6 from "classnames";
+import { jsx as jsx10, jsxs as jsxs9 } from "react/jsx-runtime";
+var classBase10 = "vuuDatasourceStats";
+var numberFormatter = new Intl.NumberFormat();
+var DataSourceStats = ({
+  className: classNameProp,
+  dataSource
+}) => {
+  const [range, setRange] = useState4(dataSource.range);
+  const [size, setSize] = useState4(dataSource.size);
+  useEffect4(() => {
+    setSize(dataSource.size);
+    dataSource.on("resize", setSize);
+    dataSource.on("range", setRange);
+  }, [dataSource]);
+  const className = cx6(classBase10, classNameProp);
+  const from = numberFormatter.format(range.from);
+  const to = numberFormatter.format(range.to - 1);
+  const value = numberFormatter.format(size);
+  return /* @__PURE__ */ jsxs9("div", { className, children: [
+    /* @__PURE__ */ jsx10("span", { className: `${classBase10}-label`, children: "Row count" }),
+    /* @__PURE__ */ jsx10("span", { className: `${classBase10}-range`, children: from }),
+    /* @__PURE__ */ jsx10("span", { children: "-" }),
+    /* @__PURE__ */ jsx10("span", { className: `${classBase10}-range`, children: to }),
+    /* @__PURE__ */ jsx10("span", { children: "of" }),
+    /* @__PURE__ */ jsx10("span", { className: `${classBase10}-size`, children: value })
+  ] });
+};
+
+// src/table-settings/TableSettingsPanel.tsx
+import {
+  Button as Button4,
+  FormField as FormField5,
+  FormFieldLabel as FormFieldLabel5,
+  Input as Input4,
+  ToggleButton as ToggleButton2,
+  ToggleButtonGroup as ToggleButtonGroup2
+} from "@salt-ds/core";
+
+// src/table-settings/useTableSettings.ts
+import { useLayoutEffectSkipFirst as useLayoutEffectSkipFirst3 } from "@vuu-ui/vuu-layout";
+
+// ../vuu-table/src/table/ColumnResizer.tsx
+import { useCallback as useCallback8, useRef as useRef8 } from "react";
+import { jsx as jsx11 } from "react/jsx-runtime";
+
+// ../vuu-table/src/table/context-menu/buildContextMenuDescriptors.ts
+import { isNumericColumn as isNumericColumn2 } from "@vuu-ui/vuu-utils";
+
+// ../vuu-table/src/table/context-menu/useTableContextMenu.ts
+import { removeColumnFromFilter } from "@vuu-ui/vuu-utils";
+import {
+  addGroupColumn,
+  addSortColumn,
+  AggregationType,
+  setAggregations,
+  setSortColumn
+} from "@vuu-ui/vuu-utils";
+var { Average, Count, Distinct, High, Low, Sum } = AggregationType;
+
+// ../vuu-table/src/table/Table.tsx
+import { ContextMenuProvider } from "@vuu-ui/vuu-popups";
+import { Button as Button3, useIdMemo } from "@salt-ds/core";
+
+// ../vuu-table/src/table/RowBasedTable.tsx
+import {
+  buildColumnMap,
+  getColumnStyle as getColumnStyle3,
+  isGroupColumn as isGroupColumn2,
+  metadataKeys as metadataKeys6,
+  notHidden as notHidden2,
+  visibleColumnAtIndex
+} from "@vuu-ui/vuu-utils";
+import { useCallback as useCallback15, useMemo as useMemo4 } from "react";
+
+// ../vuu-table/src/table/TableRow.tsx
+import {
+  isGroupColumn,
+  isJsonColumn,
+  isJsonGroup,
+  metadataKeys as metadataKeys5,
+  notHidden,
+  RowSelected
+} from "@vuu-ui/vuu-utils";
+import cx8 from "classnames";
+import { memo as memo2, useCallback as useCallback11 } from "react";
+
+// ../vuu-table/src/table/TableCell.tsx
+import { getColumnStyle, metadataKeys as metadataKeys3 } from "@vuu-ui/vuu-utils";
+import { EditableLabel } from "@vuu-ui/vuu-ui-controls";
+import cx7 from "classnames";
+import {
+  memo,
+  useCallback as useCallback9,
+  useRef as useRef9,
+  useState as useState5
+} from "react";
+import { jsx as jsx12 } from "react/jsx-runtime";
+var { KEY: KEY3 } = metadataKeys3;
+var TableCell = memo(
+  ({
+    className: classNameProp,
+    column,
+    columnMap,
+    onClick,
+    row
+  }) => {
+    const labelFieldRef = useRef9(null);
+    const {
+      align,
+      CellRenderer,
+      key,
+      pin,
+      editable,
+      resizing,
+      valueFormatter
+    } = column;
+    const [editing, setEditing] = useState5(false);
+    const value = valueFormatter(row[key]);
+    const [editableValue, setEditableValue] = useState5(value);
+    const handleTitleMouseDown = () => {
+      var _a;
+      (_a = labelFieldRef.current) == null ? void 0 : _a.focus();
+    };
+    const handleTitleKeyDown = (evt) => {
+      if (evt.key === "Enter") {
+        setEditing(true);
+      }
+    };
+    const handleClick = useCallback9(
+      (evt) => {
+        onClick == null ? void 0 : onClick(evt, column);
+      },
+      [column, onClick]
+    );
+    const handleEnterEditMode = () => {
+      setEditing(true);
+    };
+    const handleExitEditMode = (originalValue = "", finalValue = "", allowDeactivation = true, editCancelled = false) => {
+      var _a;
+      setEditing(false);
+      if (editCancelled) {
+        setEditableValue(originalValue);
+      } else if (finalValue !== originalValue) {
+        setEditableValue(finalValue);
+      }
+      if (allowDeactivation === false) {
+        (_a = labelFieldRef.current) == null ? void 0 : _a.focus();
+      }
+    };
+    const className = cx7(classNameProp, {
+      vuuAlignRight: align === "right",
+      vuuPinFloating: pin === "floating",
+      vuuPinLeft: pin === "left",
+      vuuPinRight: pin === "right",
+      "vuuTableCell-resizing": resizing
+    }) || void 0;
+    const style = getColumnStyle(column);
+    return editable ? /* @__PURE__ */ jsx12(
+      "div",
+      {
+        className,
+        "data-editable": true,
+        role: "cell",
+        style,
+        onKeyDown: handleTitleKeyDown,
+        children: /* @__PURE__ */ jsx12(
+          EditableLabel,
+          {
+            editing,
+            value: editableValue,
+            onChange: setEditableValue,
+            onMouseDownCapture: handleTitleMouseDown,
+            onEnterEditMode: handleEnterEditMode,
+            onExitEditMode: handleExitEditMode,
+            onKeyDown: handleTitleKeyDown,
+            ref: labelFieldRef,
+            tabIndex: 0
+          },
+          "title"
+        )
+      }
+    ) : /* @__PURE__ */ jsx12(
+      "div",
+      {
+        className,
+        role: "cell",
+        style,
+        onClick: handleClick,
+        children: CellRenderer ? /* @__PURE__ */ jsx12(CellRenderer, { column, columnMap, row }) : value
+      }
+    );
+  },
+  cellValuesAreEqual
+);
+TableCell.displayName = "TableCell";
+function cellValuesAreEqual(prev, next) {
+  return prev.column === next.column && prev.onClick === next.onClick && prev.row[KEY3] === next.row[KEY3] && prev.row[prev.column.key] === next.row[next.column.key];
+}
+
+// ../vuu-table/src/table/TableGroupCell.tsx
+import {
+  getColumnStyle as getColumnStyle2,
+  getGroupValueAndOffset,
+  metadataKeys as metadataKeys4
+} from "@vuu-ui/vuu-utils";
+import { useCallback as useCallback10 } from "react";
+import { jsx as jsx13, jsxs as jsxs10 } from "react/jsx-runtime";
+var { IS_LEAF } = metadataKeys4;
+var TableGroupCell = ({ column, onClick, row }) => {
+  const { columns } = column;
+  const [value, offset] = getGroupValueAndOffset(columns, row);
+  const handleClick = useCallback10(
+    (evt) => {
+      onClick == null ? void 0 : onClick(evt, column);
+    },
+    [column, onClick]
+  );
+  const style = getColumnStyle2(column);
+  const isLeaf = row[IS_LEAF];
+  const spacers = Array(offset).fill(0).map((n, i) => /* @__PURE__ */ jsx13("span", { className: "vuuTableGroupCell-spacer" }, i));
+  return /* @__PURE__ */ jsxs10(
+    "div",
+    {
+      className: "vuuTableGroupCell vuuPinLeft",
+      onClick: isLeaf ? void 0 : handleClick,
+      role: "cell",
+      style,
+      children: [
+        spacers,
+        isLeaf ? null : /* @__PURE__ */ jsx13("span", { className: "vuuTableGroupCell-toggle", "data-icon": "triangle-right" }),
+        /* @__PURE__ */ jsx13("span", { children: value })
+      ]
+    }
+  );
+};
+
+// ../vuu-table/src/table/TableRow.tsx
+import { jsx as jsx14, jsxs as jsxs11 } from "react/jsx-runtime";
+var { IDX, IS_EXPANDED, SELECTED } = metadataKeys5;
+var { True, First, Last } = RowSelected;
+var classBase11 = "vuuTableRow";
+var TableRow = memo2(function Row({
+  columnMap,
+  columns,
+  offset,
+  onClick,
+  onToggleGroup,
+  virtualColSpan = 0,
+  row
+}) {
+  const {
+    [IDX]: rowIndex,
+    [IS_EXPANDED]: isExpanded,
+    [SELECTED]: selectionStatus
+  } = row;
+  const className = cx8(classBase11, {
+    [`${classBase11}-even`]: rowIndex % 2 === 0,
+    [`${classBase11}-expanded`]: isExpanded,
+    [`${classBase11}-selected`]: selectionStatus & True,
+    [`${classBase11}-selectedStart`]: selectionStatus & First,
+    [`${classBase11}-selectedEnd`]: selectionStatus & Last
+  });
+  const handleRowClick = useCallback11(
+    (evt) => {
+      const rangeSelect = evt.shiftKey;
+      const keepExistingSelection = evt.ctrlKey || evt.metaKey;
+      onClick == null ? void 0 : onClick(row, rangeSelect, keepExistingSelection);
+    },
+    [onClick, row]
+  );
+  const handleGroupCellClick = useCallback11(
+    (evt, column) => {
+      if (isGroupColumn(column) || isJsonGroup(column, row)) {
+        evt.stopPropagation();
+        onToggleGroup == null ? void 0 : onToggleGroup(row, column);
+      }
+    },
+    [onToggleGroup, row]
+  );
+  return /* @__PURE__ */ jsxs11(
+    "div",
+    {
+      "aria-selected": selectionStatus & True ? true : void 0,
+      "aria-rowindex": rowIndex,
+      className,
+      onClick: handleRowClick,
+      role: "row",
+      style: {
+        transform: `translate3d(0px, ${offset}px, 0px)`
+      },
+      children: [
+        virtualColSpan > 0 ? /* @__PURE__ */ jsx14("div", { role: "cell", style: { width: virtualColSpan } }) : null,
+        columns.filter(notHidden).map((column) => {
+          const isGroup = isGroupColumn(column);
+          const isJsonCell = isJsonColumn(column);
+          const Cell = isGroup ? TableGroupCell : TableCell;
+          return /* @__PURE__ */ jsx14(
+            Cell,
+            {
+              column,
+              columnMap,
+              onClick: isGroup || isJsonCell ? handleGroupCellClick : void 0,
+              row
+            },
+            column.name
+          );
+        })
+      ]
+    }
+  );
+});
+
+// ../vuu-table/src/table/TableGroupHeaderCell.tsx
+import cx9 from "classnames";
+import { useRef as useRef11 } from "react";
+
+// ../vuu-table/src/table/useTableColumnResize.tsx
+import { useCallback as useCallback12, useRef as useRef10 } from "react";
+
+// ../vuu-table/src/table/TableGroupHeaderCell.tsx
+import { jsx as jsx15, jsxs as jsxs12 } from "react/jsx-runtime";
+
+// ../vuu-table/src/table/TableHeaderCell.tsx
+import cx12 from "classnames";
+import { useCallback as useCallback14, useRef as useRef12 } from "react";
+
+// ../vuu-table/src/table/SortIndicator.tsx
+import cx10 from "classnames";
+import { jsx as jsx16, jsxs as jsxs13 } from "react/jsx-runtime";
+
+// ../vuu-table/src/table/TableHeaderCell.tsx
+import { useContextMenu as useContextMenu2 } from "@vuu-ui/vuu-popups";
+
+// ../vuu-table/src/table/filter-indicator.tsx
+import { useContextMenu } from "@vuu-ui/vuu-popups";
+import cx11 from "classnames";
+import { useCallback as useCallback13 } from "react";
+import { jsx as jsx17 } from "react/jsx-runtime";
+
+// ../vuu-table/src/table/TableHeaderCell.tsx
+import { jsx as jsx18, jsxs as jsxs14 } from "react/jsx-runtime";
+
+// ../vuu-table/src/table/RowBasedTable.tsx
+import { jsx as jsx19, jsxs as jsxs15 } from "react/jsx-runtime";
+var { RENDER_IDX } = metadataKeys6;
+
+// ../vuu-table/src/table/useTable.ts
+import { useContextMenu as usePopupContextMenu } from "@vuu-ui/vuu-popups";
+import {
+  applySort,
+  buildColumnMap as buildColumnMap2,
+  isJsonGroup as isJsonGroup2,
+  metadataKeys as metadataKeys10,
+  moveItemDeprecated as moveItemDeprecated2
+} from "@vuu-ui/vuu-utils";
+import {
+  useCallback as useCallback25,
+  useEffect as useEffect9,
+  useMemo as useMemo10,
+  useRef as useRef22,
+  useState as useState9
+} from "react";
+
+// ../vuu-table/src/table/useDataSource.ts
+import {
+  isVuuFeatureAction,
+  isVuuFeatureInvocation
+} from "@vuu-ui/vuu-data-react";
+import { getFullRange, metadataKeys as metadataKeys7, WindowRange } from "@vuu-ui/vuu-utils";
+import { useCallback as useCallback16, useEffect as useEffect5, useMemo as useMemo5, useRef as useRef13, useState as useState6 } from "react";
+var { SELECTED: SELECTED2 } = metadataKeys7;
+
+// ../vuu-table/src/table/useDraggableColumn.ts
+import { useDragDropNext as useDragDrop } from "@vuu-ui/vuu-ui-controls";
+import { useCallback as useCallback17, useRef as useRef14 } from "react";
+
+// ../vuu-table/src/table/useKeyboardNavigation.ts
+import { withinRange } from "@vuu-ui/vuu-utils";
+import {
+  useCallback as useCallback18,
+  useEffect as useEffect6,
+  useLayoutEffect,
+  useMemo as useMemo6,
+  useRef as useRef15
+} from "react";
+
+// ../vuu-table/src/table/keyUtils.ts
+function union(set1, ...sets) {
+  const result = new Set(set1);
+  for (let set of sets) {
+    for (let element of set) {
+      result.add(element);
+    }
+  }
+  return result;
+}
+var ArrowUp = "ArrowUp";
+var ArrowDown = "ArrowDown";
+var ArrowLeft = "ArrowLeft";
+var ArrowRight = "ArrowRight";
+var Home = "Home";
+var End = "End";
+var PageUp = "PageUp";
+var PageDown = "PageDown";
+var actionKeys = /* @__PURE__ */ new Set(["Enter", "Delete", " "]);
+var focusKeys = /* @__PURE__ */ new Set(["Tab"]);
+var arrowLeftRightKeys = /* @__PURE__ */ new Set(["ArrowRight", "ArrowLeft"]);
+var navigationKeys = /* @__PURE__ */ new Set([
+  Home,
+  End,
+  PageUp,
+  PageDown,
+  ArrowDown,
+  ArrowLeft,
+  ArrowRight,
+  ArrowUp
+]);
+var functionKeys = /* @__PURE__ */ new Set([
+  "F1",
+  "F2",
+  "F3",
+  "F4",
+  "F5",
+  "F6",
+  "F7",
+  "F8",
+  "F9",
+  "F10",
+  "F11",
+  "F12"
+]);
+var specialKeys = union(
+  actionKeys,
+  navigationKeys,
+  arrowLeftRightKeys,
+  functionKeys,
+  focusKeys
+);
+
+// ../vuu-table/src/table/useMeasuredContainer.ts
+import { isValidNumber as isValidNumber4 } from "@vuu-ui/vuu-utils";
+import { useCallback as useCallback20, useMemo as useMemo7, useRef as useRef17, useState as useState7 } from "react";
+
+// ../vuu-table/src/table/useResizeObserver.ts
+import { useCallback as useCallback19, useEffect as useEffect7, useRef as useRef16 } from "react";
+var observedMap = /* @__PURE__ */ new Map();
+var getTargetSize = (element, size, dimension) => {
+  switch (dimension) {
+    case "height":
+      return size.height;
+    case "clientHeight":
+      return element.clientHeight;
+    case "clientWidth":
+      return element.clientWidth;
+    case "contentHeight":
+      return size.contentHeight;
+    case "contentWidth":
+      return size.contentWidth;
+    case "scrollHeight":
+      return Math.ceil(element.scrollHeight);
+    case "scrollWidth":
+      return Math.ceil(element.scrollWidth);
+    case "width":
+      return size.width;
+    default:
+      return 0;
+  }
+};
+var resizeObserver = new ResizeObserver((entries) => {
+  for (const entry of entries) {
+    const { target, borderBoxSize, contentBoxSize } = entry;
+    const observedTarget = observedMap.get(target);
+    if (observedTarget) {
+      const [{ blockSize: height, inlineSize: width }] = borderBoxSize;
+      const [{ blockSize: contentHeight, inlineSize: contentWidth }] = contentBoxSize;
+      const { onResize, measurements } = observedTarget;
+      let sizeChanged = false;
+      for (const [dimension, size] of Object.entries(measurements)) {
+        const newSize = getTargetSize(
+          target,
+          { height, width, contentHeight, contentWidth },
+          dimension
+        );
+        if (newSize !== size) {
+          sizeChanged = true;
+          measurements[dimension] = newSize;
+        }
+      }
+      if (sizeChanged) {
+        onResize && onResize(measurements);
+      }
+    }
+  }
+});
+
+// ../vuu-table/src/table/useSelection.ts
+import {
+  deselectItem,
+  isRowSelected,
+  metadataKeys as metadataKeys8,
+  selectItem
+} from "@vuu-ui/vuu-utils";
+import { useCallback as useCallback21, useRef as useRef18 } from "react";
+var { IDX: IDX2 } = metadataKeys8;
+
+// ../vuu-table/src/table/useTableModel.ts
+import {
+  applyFilterToColumns,
+  applyGroupByToColumns,
+  applySortToColumns,
+  findColumn,
+  getCellRenderer,
+  getColumnName as getColumnName2,
+  getTableHeadings,
+  getValueFormatter,
+  isFilteredColumn,
+  isGroupColumn as isGroupColumn3,
+  isPinned,
+  isTypeDescriptor as isTypeDescriptor7,
+  metadataKeys as metadataKeys9,
+  updateColumn,
+  sortPinnedColumns,
+  stripFilterFromColumns,
+  moveItemDeprecated,
+  getDefaultAlignment as getDefaultAlignment2
+} from "@vuu-ui/vuu-utils";
+import { useReducer } from "react";
+var KEY_OFFSET = metadataKeys9.count;
+
+// ../vuu-table/src/table/useTableScroll.ts
+import { useCallback as useCallback22, useRef as useRef19 } from "react";
+
+// ../vuu-table/src/table-next/useTableViewport.ts
+import { useCallback as useCallback23, useMemo as useMemo8, useRef as useRef20 } from "react";
+import {
+  actualRowPositioning,
+  virtualRowPositioning
+} from "@vuu-ui/vuu-utils";
+
+// ../vuu-table/src/table/useVirtualViewport.ts
+import {
+  getColumnsInViewport,
+  itemsChanged
+} from "@vuu-ui/vuu-utils";
+import { useCallback as useCallback24, useEffect as useEffect8, useMemo as useMemo9, useRef as useRef21, useState as useState8 } from "react";
+
+// ../vuu-table/src/table/useTable.ts
+var { KEY: KEY4, IS_EXPANDED: IS_EXPANDED2, IS_LEAF: IS_LEAF2 } = metadataKeys10;
+
+// ../vuu-table/src/table/Table.tsx
+import cx13 from "classnames";
+import { isDataLoading } from "@vuu-ui/vuu-utils";
+import { jsx as jsx20, jsxs as jsxs16 } from "react/jsx-runtime";
+
+// ../vuu-table/src/table/cell-renderers/json-cell/JsonCell.tsx
+import cx14 from "classnames";
+import {
+  isJsonAttribute,
+  metadataKeys as metadataKeys11,
+  registerComponent as registerComponent6
+} from "@vuu-ui/vuu-utils";
+import { jsx as jsx21, jsxs as jsxs17 } from "react/jsx-runtime";
+var classBase12 = "vuuJsonCell";
+var { IS_EXPANDED: IS_EXPANDED3, KEY: KEY5 } = metadataKeys11;
+var localKey = (key) => {
+  const pos = key.lastIndexOf("|");
+  if (pos === -1) {
+    return "";
+  } else {
+    return key.slice(pos + 1);
+  }
+};
+var JsonCell = ({ column, row }) => {
+  const {
+    key: columnKey
+    /*, type, valueFormatter */
+  } = column;
+  let value = row[columnKey];
+  let isToggle = false;
+  if (isJsonAttribute(value)) {
+    value = value.slice(0, -1);
+    isToggle = true;
+  }
+  const rowKey = localKey(row[KEY5]);
+  const className = cx14({
+    [`${classBase12}-name`]: rowKey === value,
+    [`${classBase12}-value`]: rowKey !== value,
+    [`${classBase12}-group`]: isToggle
+  });
+  if (isToggle) {
+    const toggleIcon = row[IS_EXPANDED3] ? "minus-box" : "plus-box";
+    return /* @__PURE__ */ jsxs17("span", { className, children: [
+      /* @__PURE__ */ jsx21("span", { className: `${classBase12}-value`, children: value }),
+      /* @__PURE__ */ jsx21("span", { className: `${classBase12}-toggle`, "data-icon": toggleIcon })
+    ] });
+  } else if (value) {
+    return /* @__PURE__ */ jsx21("span", { className, children: value });
+  } else {
+    return null;
+  }
+};
+registerComponent6("json", JsonCell, "cell-renderer", {
+  description: "JSON formatter",
+  label: "JSON formatter",
+  serverDataType: "json"
+});
+
+// ../vuu-table/src/table-next/header-cell/GroupHeaderCell.tsx
+import cx17 from "classnames";
+import { useRef as useRef25 } from "react";
+
+// ../vuu-table/src/table-next/column-resizing/ColumnResizer.tsx
+import { useCallback as useCallback26, useRef as useRef23 } from "react";
+import { jsx as jsx22 } from "react/jsx-runtime";
+
+// ../vuu-table/src/table-next/column-resizing/useTableColumnResize.tsx
+import { useCallback as useCallback27, useRef as useRef24, useState as useState10 } from "react";
+
+// ../vuu-table/src/table-next/useCell.ts
+import { getColumnStyle as getColumnStyle4 } from "@vuu-ui/vuu-utils";
+import cx15 from "classnames";
+import { useMemo as useMemo11 } from "react";
+var useCell = (column, classBase19, isHeader) => (
+  // TODO measure perf without the memo, might not be worth the cost
+  useMemo11(() => {
+    const className = cx15(classBase19, {
+      vuuPinFloating: column.pin === "floating",
+      vuuPinLeft: column.pin === "left",
+      vuuPinRight: column.pin === "right",
+      vuuEndPin: isHeader && column.endPin,
+      // [`${classBase}-resizing`]: column.resizing,
+      [`${classBase19}-editable`]: column.editable,
+      [`${classBase19}-right`]: column.align === "right"
+    });
+    const style = getColumnStyle4(column);
+    return {
+      className,
+      style
+    };
+  }, [column, classBase19, isHeader])
+);
+
+// ../vuu-table/src/table-next/column-header-pill/ColumnHeaderPill.tsx
+import cx16 from "classnames";
+import { useCallback as useCallback28 } from "react";
+import { jsx as jsx23, jsxs as jsxs18 } from "react/jsx-runtime";
+
+// ../vuu-table/src/table-next/column-header-pill/GroupColumnPill.tsx
+import { jsx as jsx24, jsxs as jsxs19 } from "react/jsx-runtime";
+
+// ../vuu-table/src/table-next/column-header-pill/SortIndicator.tsx
+import { jsx as jsx25, jsxs as jsxs20 } from "react/jsx-runtime";
+
+// ../vuu-table/src/table-next/header-cell/GroupHeaderCell.tsx
+import { jsx as jsx26, jsxs as jsxs21 } from "react/jsx-runtime";
+import { createElement } from "react";
+
+// ../vuu-table/src/table-next/header-cell/GroupHeaderCellNext.tsx
+import cx18 from "classnames";
+import { useCallback as useCallback29, useRef as useRef26, useState as useState11 } from "react";
+import {
+  OverflowContainer,
+  useLayoutEffectSkipFirst
+} from "@vuu-ui/vuu-layout";
+import { jsx as jsx27, jsxs as jsxs22 } from "react/jsx-runtime";
+import { createElement as createElement2 } from "react";
+
+// ../vuu-table/src/table-next/header-cell/HeaderCell.tsx
+import { useCallback as useCallback31, useRef as useRef28 } from "react";
+
+// ../vuu-table/src/table-next/column-menu/ColumnMenu.tsx
+import { useContextMenu as useContextMenu3 } from "@vuu-ui/vuu-popups";
+import cx19 from "classnames";
+import {
+  useCallback as useCallback30,
+  useRef as useRef27,
+  useState as useState12
+} from "react";
+import { jsx as jsx28 } from "react/jsx-runtime";
+
+// ../vuu-table/src/table-next/header-cell/HeaderCell.tsx
+import cx20 from "classnames";
+import { jsx as jsx29, jsxs as jsxs23 } from "react/jsx-runtime";
+
+// ../vuu-table/src/table-next/TableNext.tsx
+import { ContextMenuProvider as ContextMenuProvider2 } from "@vuu-ui/vuu-popups";
+import { isGroupColumn as isGroupColumn7, metadataKeys as metadataKeys18, notHidden as notHidden4 } from "@vuu-ui/vuu-utils";
+import cx23 from "classnames";
+import { useRef as useRef34 } from "react";
+
+// ../vuu-table/src/table-next/Row.tsx
+import {
+  isGroupColumn as isGroupColumn4,
+  isJsonColumn as isJsonColumn2,
+  isJsonGroup as isJsonGroup3,
+  metadataKeys as metadataKeys14,
+  notHidden as notHidden3,
+  RowSelected as RowSelected2
+} from "@vuu-ui/vuu-utils";
+import cx22 from "classnames";
+import { memo as memo3, useCallback as useCallback34 } from "react";
+
+// ../vuu-table/src/table-next/table-cell/TableCell.tsx
+import { metadataKeys as metadataKeys12 } from "@vuu-ui/vuu-utils";
+import { useCallback as useCallback32 } from "react";
+import { jsx as jsx30 } from "react/jsx-runtime";
+var { IDX: IDX3 } = metadataKeys12;
+var classBase13 = "vuuTableNextCell";
+var TableCell2 = ({
+  column,
+  columnMap,
+  onDataEdited,
+  row
+}) => {
+  const { className, style } = useCell(column, classBase13);
+  const { CellRenderer, name: name2, valueFormatter } = column;
+  const dataIdx = columnMap[name2];
+  const handleDataItemEdited = useCallback32(
+    (value) => {
+      onDataEdited == null ? void 0 : onDataEdited(row[IDX3], name2, value);
+      return true;
+    },
+    [name2, onDataEdited, row]
+  );
+  return /* @__PURE__ */ jsx30("div", { className, role: "cell", style, children: CellRenderer ? /* @__PURE__ */ jsx30(
+    CellRenderer,
+    {
+      column,
+      columnMap,
+      onCommit: handleDataItemEdited,
+      row
+    }
+  ) : valueFormatter(row[dataIdx]) });
+};
+
+// ../vuu-table/src/table-next/table-cell/TableGroupCell.tsx
+import { getGroupValueAndOffset as getGroupValueAndOffset2, metadataKeys as metadataKeys13 } from "@vuu-ui/vuu-utils";
+import { useCallback as useCallback33 } from "react";
+import cx21 from "classnames";
+import { jsx as jsx31, jsxs as jsxs24 } from "react/jsx-runtime";
+var { IS_LEAF: IS_LEAF3 } = metadataKeys13;
+var classBase14 = "vuuTableNextGroupCell";
+var TableGroupCell2 = ({ column, onClick, row }) => {
+  const { columns } = column;
+  const [value, offset] = getGroupValueAndOffset2(columns, row);
+  const { className, style } = useCell(column, classBase14);
+  const handleClick = useCallback33(
+    (evt) => {
+      onClick == null ? void 0 : onClick(evt, column);
+    },
+    [column, onClick]
+  );
+  const isLeaf = row[IS_LEAF3];
+  const spacers = Array(offset).fill(0).map((n, i) => /* @__PURE__ */ jsx31("span", { className: `${classBase14}-spacer` }, i));
+  return /* @__PURE__ */ jsxs24(
+    "div",
+    {
+      className: cx21(className, "vuuTableNextCell"),
+      role: "cell",
+      style,
+      onClick: isLeaf ? void 0 : handleClick,
+      children: [
+        spacers,
+        isLeaf ? null : /* @__PURE__ */ jsx31("span", { className: `${classBase14}-toggle`, "data-icon": "triangle-right" }),
+        /* @__PURE__ */ jsx31("span", { children: value })
+      ]
+    }
+  );
+};
+
+// ../vuu-table/src/table-next/Row.tsx
+import { jsx as jsx32 } from "react/jsx-runtime";
+import { createElement as createElement3 } from "react";
+var { IDX: IDX4, IS_EXPANDED: IS_EXPANDED4, SELECTED: SELECTED3 } = metadataKeys14;
+var classBase15 = "vuuTableNextRow";
+var Row2 = memo3(
+  ({
+    className: classNameProp,
+    columnMap,
+    columns,
+    row,
+    offset,
+    onClick,
+    onDataEdited,
+    onToggleGroup,
+    zebraStripes = false,
+    ...htmlAttributes
+  }) => {
+    const {
+      [IDX4]: rowIndex,
+      [IS_EXPANDED4]: isExpanded,
+      [SELECTED3]: selectionStatus
+    } = row;
+    const handleRowClick = useCallback34(
+      (evt) => {
+        const rangeSelect = evt.shiftKey;
+        const keepExistingSelection = evt.ctrlKey || evt.metaKey;
+        onClick == null ? void 0 : onClick(row, rangeSelect, keepExistingSelection);
+      },
+      [onClick, row]
+    );
+    const { True: True2, First: First2, Last: Last2 } = RowSelected2;
+    const className = cx22(classBase15, classNameProp, {
+      [`${classBase15}-even`]: zebraStripes && rowIndex % 2 === 0,
+      [`${classBase15}-expanded`]: isExpanded,
+      [`${classBase15}-selected`]: selectionStatus & True2,
+      [`${classBase15}-selectedStart`]: selectionStatus & First2,
+      [`${classBase15}-selectedEnd`]: selectionStatus & Last2
+    });
+    const style = { transform: `translate3d(0px, ${offset}px, 0px)` };
+    const handleGroupCellClick = useCallback34(
+      (evt, column) => {
+        if (isGroupColumn4(column) || isJsonGroup3(column, row)) {
+          evt.stopPropagation();
+          onToggleGroup == null ? void 0 : onToggleGroup(row, column);
+        }
+      },
+      [onToggleGroup, row]
+    );
+    return /* @__PURE__ */ createElement3(
+      "div",
+      {
+        ...htmlAttributes,
+        "aria-rowindex": row[0],
+        key: `row-${row[0]}`,
+        role: "row",
+        className,
+        onClick: handleRowClick,
+        style
+      },
+      /* @__PURE__ */ jsx32("span", { className: `${classBase15}-selectionDecorator vuuStickyLeft` }),
+      columns.filter(notHidden3).map((column) => {
+        const isGroup = isGroupColumn4(column);
+        const isJsonCell = isJsonColumn2(column);
+        const Cell = isGroup ? TableGroupCell2 : TableCell2;
+        return /* @__PURE__ */ jsx32(
+          Cell,
+          {
+            column,
+            columnMap,
+            onClick: isGroup || isJsonCell ? handleGroupCellClick : void 0,
+            onDataEdited,
+            row
+          },
+          column.key
+        );
+      }),
+      /* @__PURE__ */ jsx32("span", { className: `${classBase15}-selectionDecorator vuuStickyRight` })
+    );
+  }
+);
+Row2.displayName = "Row";
+
+// ../vuu-table/src/table-next/useTableNext.ts
+import { useLayoutEffectSkipFirst as useLayoutEffectSkipFirst2 } from "@vuu-ui/vuu-layout";
+import { useDragDropNext as useDragDrop2 } from "@vuu-ui/vuu-ui-controls";
+
+// ../vuu-table/src/table-next/useKeyboardNavigation.ts
+import {
+  useCallback as useCallback35,
+  useEffect as useEffect10,
+  useMemo as useMemo12,
+  useRef as useRef29
+} from "react";
+
+// ../vuu-table/src/table-next/useTableNext.ts
+import {
+  applySort as applySort2,
+  buildColumnMap as buildColumnMap4,
+  isGroupColumn as isGroupColumn6,
+  isJsonGroup as isJsonGroup4,
+  isValidNumber as isValidNumber5,
+  metadataKeys as metadataKeys17,
+  updateColumn as updateColumn2,
+  visibleColumnAtIndex as visibleColumnAtIndex2
+} from "@vuu-ui/vuu-utils";
+import {
+  useCallback as useCallback41,
+  useEffect as useEffect13,
+  useMemo as useMemo15,
+  useState as useState14
+} from "react";
+
+// ../vuu-table/src/table-next/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;
+  }
+};
+
+// ../vuu-table/src/table-next/useDataSource.ts
+import {
+  isVuuFeatureAction as isVuuFeatureAction2,
+  isVuuFeatureInvocation as isVuuFeatureInvocation2
+} from "@vuu-ui/vuu-data-react/src";
+import { getFullRange as getFullRange2, NULL_RANGE } from "@vuu-ui/vuu-utils";
+import { useCallback as useCallback36, useEffect as useEffect11, useMemo as useMemo13, useRef as useRef30, useState as useState13 } from "react";
+
+// ../vuu-table/src/table-next/moving-window.ts
+import { metadataKeys as metadataKeys15, WindowRange as WindowRange2 } from "@vuu-ui/vuu-utils";
+var { SELECTED: SELECTED4 } = metadataKeys15;
+
+// ../vuu-table/src/table-next/useInitialValue.ts
+import { useMemo as useMemo14, useRef as useRef31 } from "react";
+
+// ../vuu-table/src/table-next/useTableContextMenu.ts
+import { buildColumnMap as buildColumnMap3 } from "@vuu-ui/vuu-utils";
+import { useCallback as useCallback37 } from "react";
+import { useContextMenu as usePopupContextMenu2 } from "@vuu-ui/vuu-popups";
+
+// ../vuu-table/src/table-next/useCellEditing.ts
+import { isCharacterKey } from "@vuu-ui/vuu-utils";
+import { useCallback as useCallback38 } from "react";
+
+// ../vuu-table/src/table-next/useTableModel.ts
+import {
+  applyFilterToColumns as applyFilterToColumns2,
+  applyGroupByToColumns as applyGroupByToColumns2,
+  applySortToColumns as applySortToColumns2,
+  getCellRenderer as getCellRenderer2,
+  getTableHeadings as getTableHeadings2,
+  getValueFormatter as getValueFormatter2,
+  hasValidationRules,
+  isFilteredColumn as isFilteredColumn2,
+  isGroupColumn as isGroupColumn5,
+  isPinned as isPinned2,
+  isTypeDescriptor as isTypeDescriptor8,
+  logger,
+  metadataKeys as metadataKeys16,
+  moveItem,
+  sortPinnedColumns as sortPinnedColumns2,
+  stripFilterFromColumns as stripFilterFromColumns2,
+  subscribedOnly
+} from "@vuu-ui/vuu-utils";
+import { buildValidationChecker } from "@vuu-ui/vuu-ui-controls";
+import { useReducer as useReducer2 } from "react";
+var { info } = logger("useTableModel");
+var KEY_OFFSET2 = metadataKeys16.count;
+
+// ../vuu-table/src/table-next/useTableScroll.ts
+import { useCallback as useCallback39, useRef as useRef32 } from "react";
+
+// ../vuu-table/src/table-next/useVirtualViewport.ts
+import { useCallback as useCallback40, useEffect as useEffect12, useRef as useRef33 } from "react";
+
+// ../vuu-table/src/table-next/useTableNext.ts
+var { KEY: KEY6, IS_EXPANDED: IS_EXPANDED5, IS_LEAF: IS_LEAF4 } = metadataKeys17;
+
+// ../vuu-table/src/table-next/TableNext.tsx
+import { MeasuredContainer, useId } from "@vuu-ui/vuu-layout";
+import { jsx as jsx33, jsxs as jsxs25 } from "react/jsx-runtime";
+import { createElement as createElement4 } from "react";
+var { IDX: IDX5, RENDER_IDX: RENDER_IDX2 } = metadataKeys18;
+
+// ../vuu-table/src/table-next/cell-renderers/dropdown-cell/DropdownCell.tsx
+import {
+  Dropdown as Dropdown3
+} from "@vuu-ui/vuu-ui-controls";
+import {
+  isColumnTypeRenderer as isColumnTypeRenderer3,
+  isTypeDescriptor as isTypeDescriptor9,
+  registerComponent as registerComponent7
+} from "@vuu-ui/vuu-utils";
+import { useCallback as useCallback42, useState as useState15 } from "react";
+import { jsx as jsx34 } from "react/jsx-runtime";
+var classBase16 = "vuuTableDropdownCell";
+var openKeys = ["Enter", " "];
+var DropdownCell = ({ column, columnMap, row }) => {
+  var _a, _b, _c;
+  const values = isTypeDescriptor9(column.type) && isColumnTypeRenderer3((_a = column.type) == null ? void 0 : _a.renderer) ? (_c = (_b = column.type) == null ? void 0 : _b.renderer) == null ? void 0 : _c.values : [];
+  const dataIdx = columnMap[column.name];
+  const [value, setValue] = useState15(row[dataIdx]);
+  const handleSelectionChange = useCallback42(
+    (evt, selectedItem) => {
+      if (selectedItem) {
+        setValue(selectedItem);
+      }
+    },
+    []
+  );
+  return /* @__PURE__ */ jsx34(
+    Dropdown3,
+    {
+      className: classBase16,
+      onSelectionChange: handleSelectionChange,
+      openKeys,
+      selected: value,
+      source: values,
+      width: column.width - 17
+    }
+  );
+};
+registerComponent7("dropdown-cell", DropdownCell, "cell-renderer", {});
+
+// ../vuu-table/src/table-next/cell-renderers/input-cell/InputCell.tsx
+import { registerComponent as registerComponent8 } from "@vuu-ui/vuu-utils";
+import { Input as Input3 } from "@salt-ds/core";
+import { useEditableText } from "@vuu-ui/vuu-ui-controls";
+import cx24 from "classnames";
+import { jsx as jsx35 } from "react/jsx-runtime";
+var classBase17 = "vuuTableInputCell";
+var WarnCommit = () => {
+  console.warn(
+    "onCommit handler has not been provided to InputCell cell renderer"
+  );
+  return true;
+};
+var InputCell = ({
+  column,
+  columnMap,
+  onCommit = WarnCommit,
+  row
+}) => {
+  const dataIdx = columnMap[column.name];
+  const {
+    align = "left",
+    clientSideEditValidationCheck,
+    valueFormatter
+  } = column;
+  const { warningMessage, ...editProps } = useEditableText({
+    initialValue: valueFormatter(row[dataIdx]),
+    onCommit,
+    clientSideEditValidationCheck
+  });
+  const endAdornment = warningMessage && align === "left" ? /* @__PURE__ */ jsx35("span", { className: `${classBase17}-icon`, "data-icon": "error" }) : void 0;
+  const startAdornment = warningMessage && align === "right" ? /* @__PURE__ */ jsx35("span", { className: `${classBase17}-icon`, "data-icon": "error" }) : void 0;
+  return /* @__PURE__ */ jsx35(
+    Input3,
+    {
+      ...editProps,
+      className: cx24(classBase17, {
+        [`${classBase17}-error`]: warningMessage !== void 0
+      }),
+      endAdornment,
+      startAdornment
+    }
+  );
+};
+registerComponent8("input-cell", InputCell, "cell-renderer", {});
+
+// src/table-settings/useTableSettings.ts
+import {
+  addColumnToSubscribedColumns,
+  isCalculatedColumn as isCalculatedColumn2,
+  moveItem as moveItem2,
+  subscribedOnly as subscribedOnly2
+} from "@vuu-ui/vuu-utils";
+import {
+  useCallback as useCallback43,
+  useMemo as useMemo16,
+  useState as useState16
+} from "react";
+var sortOrderFromAvailableColumns = (availableColumns, columns) => {
+  const sortedColumns = [];
+  for (const { name: name2 } of availableColumns) {
+    const column = columns.find((col) => col.name === name2);
+    if (column) {
+      sortedColumns.push(column);
+    }
+  }
+  return sortedColumns;
+};
+var buildColumnItems = (availableColumns, configuredColumns) => {
+  return availableColumns.map(({ name: name2, serverDataType }) => {
+    const configuredColumn = configuredColumns.find((col) => col.name === name2);
+    return {
+      hidden: configuredColumn == null ? void 0 : configuredColumn.hidden,
+      isCalculated: isCalculatedColumn2(name2),
+      label: configuredColumn == null ? void 0 : configuredColumn.label,
+      name: name2,
+      serverDataType,
+      subscribed: configuredColumn !== void 0
+    };
+  });
+};
+var useTableSettings = ({
+  availableColumns: availableColumnsProp,
+  onConfigChange,
+  onDataSourceConfigChange,
+  tableConfig: tableConfigProp
+}) => {
+  const [{ availableColumns, tableConfig }, setColumnState] = useState16({
+    availableColumns: availableColumnsProp,
+    tableConfig: tableConfigProp
+  });
+  const columnItems = useMemo16(
+    () => buildColumnItems(availableColumns, tableConfig.columns),
+    [availableColumns, tableConfig.columns]
+  );
+  const handleMoveListItem = useCallback43(
+    (fromIndex, toIndex) => {
+      setColumnState((state) => {
+        const newAvailableColumns = moveItem2(
+          state.availableColumns,
+          fromIndex,
+          toIndex
+        );
+        const newColumns = sortOrderFromAvailableColumns(
+          newAvailableColumns,
+          tableConfig.columns
+        );
+        return {
+          availableColumns: newAvailableColumns,
+          tableConfig: {
+            ...state.tableConfig,
+            columns: newColumns
+          }
+        };
+      });
+    },
+    [tableConfig.columns]
+  );
+  const handleColumnChange = useCallback43(
+    (name2, property, value) => {
+      const columnItem = columnItems.find((col) => col.name === name2);
+      if (property === "subscribed") {
+        if (columnItem == null ? void 0 : columnItem.subscribed) {
+          const subscribedColumns = tableConfig.columns.filter((col) => col.name !== name2).map((col) => col.name);
+          setColumnState((state) => ({
+            ...state,
+            tableConfig: {
+              ...tableConfig,
+              columns: tableConfig.columns.filter(
+                subscribedOnly2(subscribedColumns)
+              )
+            }
+          }));
+          onDataSourceConfigChange({
+            columns: subscribedColumns
+          });
+        } else {
+          const newConfig = {
+            ...tableConfig,
+            columns: addColumnToSubscribedColumns(
+              tableConfig.columns,
+              availableColumns,
+              name2
+            )
+          };
+          setColumnState((state) => ({
+            ...state,
+            tableConfig: newConfig
+          }));
+          const subscribedColumns = newConfig.columns.map((col) => col.name);
+          onDataSourceConfigChange({
+            columns: subscribedColumns
+          });
+        }
+      } else if (columnItem == null ? void 0 : columnItem.subscribed) {
+        const column = tableConfig.columns.find((col) => col.name === name2);
+        if (column) {
+          const newConfig = updateTableConfig(tableConfig, {
+            type: "column-prop",
+            property,
+            column,
+            value
+          });
+          setColumnState((state) => ({
+            ...state,
+            tableConfig: newConfig
+          }));
+        }
+      }
+    },
+    [availableColumns, columnItems, onDataSourceConfigChange, tableConfig]
+  );
+  const handleChangeColumnLabels = useCallback43((evt) => {
+    const { value } = evt.target;
+    const columnFormatHeader = value === "0" ? void 0 : value === "1" ? "capitalize" : "uppercase";
+    setColumnState((state) => ({
+      ...state,
+      tableConfig: {
+        ...state.tableConfig,
+        columnFormatHeader
+      }
+    }));
+  }, []);
+  const handleChangeTableAttribute = useCallback43(
+    (evt) => {
+      const { ariaChecked, value } = evt.target;
+      setColumnState((state) => ({
+        ...state,
+        tableConfig: {
+          ...state.tableConfig,
+          [value]: ariaChecked !== "true"
+        }
+      }));
+    },
+    []
+  );
+  useLayoutEffectSkipFirst3(() => {
+    onConfigChange == null ? void 0 : onConfigChange(tableConfig);
+  }, [onConfigChange, tableConfig]);
+  const columnLabelsValue = tableConfig.columnFormatHeader === void 0 ? 0 : tableConfig.columnFormatHeader === "capitalize" ? 1 : 2;
+  return {
+    columnItems,
+    columnLabelsValue,
+    onChangeColumnLabels: handleChangeColumnLabels,
+    onChangeTableAttribute: handleChangeTableAttribute,
+    onColumnChange: handleColumnChange,
+    onMoveListItem: handleMoveListItem,
+    tableConfig
+  };
+};
+
+// src/table-settings/TableSettingsPanel.tsx
+import { jsx as jsx36, jsxs as jsxs26 } from "react/jsx-runtime";
+var classBase18 = "vuuTableSettingsPanel";
+var TableSettingsPanel = ({
+  availableColumns,
+  onAddCalculatedColumn,
+  onConfigChange,
+  onDataSourceConfigChange,
+  tableConfig: tableConfigProp,
+  ...htmlAttributes
+}) => {
+  const {
+    columnItems,
+    columnLabelsValue,
+    onChangeColumnLabels,
+    onChangeTableAttribute,
+    onColumnChange,
+    onMoveListItem,
+    tableConfig
+  } = useTableSettings({
+    availableColumns,
+    onConfigChange,
+    onDataSourceConfigChange,
+    tableConfig: tableConfigProp
+  });
+  return /* @__PURE__ */ jsxs26("div", { ...htmlAttributes, className: classBase18, children: [
+    /* @__PURE__ */ jsxs26(FormField5, { children: [
+      /* @__PURE__ */ jsx36(FormFieldLabel5, { children: "Column Labels" }),
+      /* @__PURE__ */ jsxs26(
+        ToggleButtonGroup2,
+        {
+          className: "vuuToggleButtonGroup",
+          onChange: onChangeColumnLabels,
+          value: columnLabelsValue,
+          children: [
+            /* @__PURE__ */ jsx36(
+              ToggleButton2,
+              {
+                className: "vuuIconToggleButton",
+                "data-icon": "text-strikethrough",
+                value: 0
+              }
+            ),
+            /* @__PURE__ */ jsx36(
+              ToggleButton2,
+              {
+                className: "vuuIconToggleButton",
+                "data-icon": "text-Tt",
+                value: 1
+              }
+            ),
+            /* @__PURE__ */ jsx36(
+              ToggleButton2,
+              {
+                className: "vuuIconToggleButton",
+                "data-icon": "text-T",
+                value: 2
+              }
+            )
+          ]
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxs26(FormField5, { children: [
+      /* @__PURE__ */ jsx36(FormFieldLabel5, { children: "Grid separators" }),
+      /* @__PURE__ */ jsxs26("div", { className: "saltToggleButtonGroup vuuToggleButtonGroup saltToggleButtonGroup-horizontal vuuGridSeparators", children: [
+        /* @__PURE__ */ jsx36(
+          ToggleButton2,
+          {
+            className: "vuuIconToggleButton",
+            "data-icon": "row-striping",
+            selected: tableConfig.zebraStripes,
+            onChange: onChangeTableAttribute,
+            value: "zebraStripes"
+          }
+        ),
+        /* @__PURE__ */ jsx36(
+          ToggleButton2,
+          {
+            className: "vuuIconToggleButton",
+            "data-icon": "row-lines",
+            selected: tableConfig.rowSeparators,
+            onChange: onChangeTableAttribute,
+            value: "rowSeparators"
+          }
+        ),
+        /* @__PURE__ */ jsx36(
+          ToggleButton2,
+          {
+            className: "vuuIconToggleButton",
+            "data-icon": "col-lines",
+            selected: tableConfig.columnSeparators,
+            onChange: onChangeTableAttribute,
+            value: "columnSeparators"
+          }
+        )
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs26(FormField5, { children: [
+      /* @__PURE__ */ jsx36(FormFieldLabel5, { children: "Default Column Width" }),
+      /* @__PURE__ */ jsx36(Input4, { className: "vuuInput" })
+    ] }),
+    /* @__PURE__ */ jsx36(
+      ColumnList,
+      {
+        columnItems,
+        onChange: onColumnChange,
+        onMoveListItem
+      }
+    ),
+    /* @__PURE__ */ jsxs26("div", { className: `${classBase18}-calculatedButtonbar`, children: [
+      /* @__PURE__ */ jsx36(Button4, { "data-icon": "plus", onClick: onAddCalculatedColumn }),
+      /* @__PURE__ */ jsx36("span", { className: `${classBase18}-calculatedLabel`, children: "Add calculated column" })
+    ] })
+  ] });
+};
+
+// src/useTableAndColumnSettings.ts
+import { useLayoutProviderDispatch } from "@vuu-ui/vuu-layout";
+import { getCalculatedColumnType as getCalculatedColumnType2 } from "@vuu-ui/vuu-utils";
+import { useCallback as useCallback44, useRef as useRef35, useState as useState17 } from "react";
+var useTableAndColumnSettings = ({
+  availableColumns: availableColumnsProps,
+  onAvailableColumnsChange,
+  onConfigChange,
+  onCreateCalculatedColumn,
+  onDataSourceConfigChange,
+  tableConfig
+}) => {
+  const dispatchLayoutAction = useLayoutProviderDispatch();
+  const showTableSettingsRef = useRef35();
+  const [availableColumns, setAvailableColumns] = useState17(
+    availableColumnsProps
+  );
+  const showContextPanel = useCallback44(
+    (componentType, title, props) => {
+      dispatchLayoutAction({
+        type: "set-props",
+        path: "#context-panel",
+        props: {
+          expanded: true,
+          content: {
+            type: componentType,
+            props
+          },
+          title
+        }
+      });
+    },
+    [dispatchLayoutAction]
+  );
+  const handleCreateCalculatedColumn = useCallback44(
+    (column) => {
+      const newAvailableColumns = availableColumns.concat({
+        name: column.name,
+        serverDataType: getCalculatedColumnType2(column)
+      });
+      setAvailableColumns(newAvailableColumns);
+      onAvailableColumnsChange == null ? void 0 : onAvailableColumnsChange(newAvailableColumns);
+      requestAnimationFrame(() => {
+        var _a;
+        (_a = showTableSettingsRef.current) == null ? void 0 : _a.call(showTableSettingsRef);
+      });
+      onCreateCalculatedColumn(column);
+    },
+    [availableColumns, onAvailableColumnsChange, onCreateCalculatedColumn]
+  );
+  const showColumnSettingsPanel = useCallback44(
+    (action) => {
+      showContextPanel("ColumnSettings", "Column Settings", {
+        column: action.column,
+        onConfigChange,
+        onCreateCalculatedColumn: handleCreateCalculatedColumn,
+        tableConfig,
+        vuuTable: action.vuuTable
+      });
+    },
+    [
+      handleCreateCalculatedColumn,
+      onConfigChange,
+      showContextPanel,
+      tableConfig
+    ]
+  );
+  const handleAddCalculatedColumn = useCallback44(() => {
+    showColumnSettingsPanel({
+      column: {
+        name: "::",
+        serverDataType: "string"
+      },
+      type: "columnSettings",
+      vuuTable: { module: "SIMUL", table: "instruments" }
+    });
+  }, [showColumnSettingsPanel]);
+  showTableSettingsRef.current = useCallback44(() => {
+    showContextPanel("TableSettings", "DataGrid Settings", {
+      availableColumns: availableColumns != null ? availableColumns : tableConfig.columns.map(({ name: name2, serverDataType }) => ({
+        name: name2,
+        serverDataType
+      })),
+      onAddCalculatedColumn: handleAddCalculatedColumn,
+      onConfigChange,
+      onDataSourceConfigChange,
+      tableConfig
+    });
+  }, [
+    availableColumns,
+    handleAddCalculatedColumn,
+    onConfigChange,
+    onDataSourceConfigChange,
+    showContextPanel,
+    tableConfig
+  ]);
+  return {
+    showColumnSettingsPanel,
+    showTableSettingsPanel: showTableSettingsRef.current
+  };
+};
+export {
+  BackgroundCell2 as BackgroundCell,
+  CaseValidator,
+  ColumnExpressionInput,
+  ColumnExpressionPanel,
+  ColumnFormattingPanel,
+  ColumnList,
+  ColumnNamedTerms,
+  ColumnSettingsPanel,
+  DataSourceStats,
+  NumericFormattingSettings,
+  PatternValidator,
+  TableSettingsPanel,
+  columnExpressionLanguageSupport,
+  isCompleteExpression,
+  isCompleteRelationalExpression,
+  lastNamedChild,
+  useColumnExpressionEditor,
+  useColumnExpressionSuggestionProvider,
+  useTableAndColumnSettings,
+  useTableSettings,
+  walkTree
+};
 //# sourceMappingURL=index.js.map