@kong-ui-public/table-data-grid 0.4.2-pr.3761.fdf1bafe4.0 → 0.5.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -3,8 +3,8 @@
3
3
  Reusable Vue wrapper around AG Grid for Kong table data grids.
4
4
 
5
5
  This package currently supports AG Grid infinite row loading with a cursor-first
6
- fetcher contract, basic column definitions, empty/error presentation states, and
7
- state lifecycle emits.
6
+ fetcher contract, basic column definitions, single-column sorting, empty/error
7
+ presentation states, and state lifecycle emits.
8
8
 
9
9
  ## Peer Dependencies
10
10
 
@@ -147,11 +147,11 @@ type TableDataGridFetcher<Row> = (
147
147
  `cursor` is an opaque token returned by the previous response. The first request
148
148
  uses `cursor: undefined`; later requests receive the previous response cursor.
149
149
 
150
- `sort` is the current single-column sort, or `undefined` when nothing is
151
- sorted. A sort change is a request-context change like `refreshKey` or
152
- `pageSize`: it rebuilds the datasource and restarts the cursor chain from the
153
- beginning, because a cursor produced under one sort order is not valid under
154
- another.
150
+ `sort` carries the current single-column sort, with `sortColumnKey` and
151
+ `sortColumnOrder` left `undefined` when nothing is sorted. A sort change is a
152
+ request-context change like `refreshKey` or `pageSize`: it rebuilds the
153
+ datasource and restarts the cursor chain from the beginning, because a cursor
154
+ produced under one sort order is not valid under another.
155
155
 
156
156
  AG Grid range details are datasource internals. Consumers should not depend on,
157
157
  or return, datasource request positions or AG Grid row-count callback values in
package/dist/style.css CHANGED
@@ -1 +1 @@
1
- .table-data-grid-cell-renderer,.table-data-grid-cell-tooltip,.table-data-grid-cell-content{display:block;min-width:0;width:100%}.table-data-grid-cell-content{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.kong-ui-public-table-data-grid[data-v-465120d6]{border:none;border-radius:4px;border-radius:var(--kui-border-radius-20, 4px);box-sizing:border-box;display:flex;flex-direction:column;height:100%;min-height:0;overflow:hidden;width:100%}.table-data-grid-grid[data-v-465120d6]{--ag-background-color: var(--kui-color-background, #ffffff);--ag-border-color: var(--kui-color-border, #e0e4ea);--ag-foreground-color: var(--kui-color-text, #0d0e14);--ag-header-background-color: var(--kui-color-background, #ffffff);--ag-header-column-border: 1px solid var(--kui-color-border, #e0e4ea);--ag-header-column-border-height: 30%;--ag-header-column-resize-handle-color: transparent;--ag-header-font-weight: var(--kui-font-weight-semibold, 600);--ag-header-text-color: var(--kui-color-text-neutral, #6c7489);--ag-wrapper-border: none;--ag-wrapper-border-radius: 0;flex:1 1 auto;min-height:0;width:100%}.ag-cell{align-items:center;display:flex;min-width:0}.ag-cell-wrapper,.ag-cell-value{min-width:0;width:100%}
1
+ .table-data-grid-cell-renderer,.table-data-grid-cell-tooltip,.table-data-grid-cell-content{display:block;min-width:0;width:100%}.table-data-grid-cell-content{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.kong-ui-public-table-data-grid[data-v-d8328fe5]{border:none;border-radius:4px;border-radius:var(--kui-border-radius-20, 4px);box-sizing:border-box;display:flex;flex-direction:column;height:100%;min-height:0;overflow:hidden;width:100%}.table-data-grid-grid[data-v-d8328fe5]{--ag-background-color: var(--kui-color-background, #ffffff);--ag-border-color: var(--kui-color-border, #e0e4ea);--ag-foreground-color: var(--kui-color-text, #0d0e14);--ag-header-background-color: var(--kui-color-background, #ffffff);--ag-header-column-border: 1px solid var(--kui-color-border, #e0e4ea);--ag-header-column-border-height: 30%;--ag-header-column-resize-handle-color: transparent;--ag-header-font-weight: var(--kui-font-weight-semibold, 600);--ag-header-text-color: var(--kui-color-text-neutral, #6c7489);--ag-wrapper-border: none;--ag-wrapper-border-radius: 0;flex:1 1 auto;min-height:0;width:100%}.ag-cell{align-items:center;display:flex;min-width:0}.ag-cell-wrapper,.ag-cell-value{min-width:0;width:100%}
@@ -1,4 +1,4 @@
1
- import { computed as S, watch as B, ref as K, shallowRef as G, readonly as x, defineComponent as $, onMounted as j, onUnmounted as H, nextTick as Q, resolveComponent as P, openBlock as I, createBlock as q, resolveDynamicComponent as J, createElementBlock as N, createVNode as L, withCtx as X, createElementVNode as Y, toDisplayString as Z, useSlots as ee, toRef as O, renderSlot as V, unref as y } from "vue";
1
+ import { computed as S, watch as B, ref as E, shallowRef as G, readonly as x, defineComponent as $, onMounted as j, onUnmounted as H, nextTick as Q, resolveComponent as q, openBlock as I, createBlock as P, resolveDynamicComponent as J, createElementBlock as N, createVNode as L, withCtx as X, createElementVNode as Y, toDisplayString as Z, useSlots as ee, toRef as O, renderSlot as V, unref as y } from "vue";
2
2
  import { AgGridVue as te } from "ag-grid-vue3";
3
3
  import { ModuleRegistry as oe, AllCommunityModule as ae, InfiniteRowModelModule as le, themeQuartz as re } from "ag-grid-community";
4
4
  import { createI18n as ne, i18nTComponent as se } from "@kong-ui-public/i18n";
@@ -70,7 +70,7 @@ const ue = ({
70
70
  resetKey: r,
71
71
  sort: t
72
72
  }) => {
73
- const l = /* @__PURE__ */ new Map(), n = /* @__PURE__ */ new Map(), i = K(0), o = G(), f = G(), a = G(), s = K(0), v = K(!1), g = (c) => c === i.value, k = () => {
73
+ const l = /* @__PURE__ */ new Map(), n = /* @__PURE__ */ new Map(), i = E(0), o = G(), f = G(), a = G(), s = E(0), v = E(!1), g = (c) => c === i.value, k = () => {
74
74
  v.value = s.value > 0;
75
75
  }, D = () => {
76
76
  a.value = void 0, s.value += 1, k();
@@ -90,7 +90,7 @@ const ue = ({
90
90
  return n.set(c, h), h;
91
91
  }, b = (c, u) => {
92
92
  u.resolve(!1), n.get(c) === u && n.delete(c);
93
- }, E = async ({
93
+ }, K = async ({
94
94
  blockIndex: c,
95
95
  currentBlockCompletion: u,
96
96
  datasourceId: d
@@ -134,7 +134,7 @@ const ue = ({
134
134
  startRow: u.startRow,
135
135
  endRow: u.endRow
136
136
  }), m = C(d);
137
- if (await E({
137
+ if (await K({
138
138
  blockIndex: d,
139
139
  currentBlockCompletion: m,
140
140
  datasourceId: c
@@ -148,6 +148,7 @@ const ue = ({
148
148
  mode: "infinite",
149
149
  pageSize: h,
150
150
  cursor: R,
151
+ // Always read the latest sort, not a stale one.
151
152
  sort: t?.value
152
153
  });
153
154
  if (!g(c)) {
@@ -202,7 +203,7 @@ const ue = ({
202
203
  params: {}
203
204
  },
204
205
  setup(e, { expose: r }) {
205
- const t = G(e.params), l = K(null), n = K(!1), i = S(() => t.value.valueFormatted ?? String(t.value.value ?? "")), o = S(() => {
206
+ const t = G(e.params), l = E(null), n = E(!1), i = S(() => t.value.valueFormatted ?? String(t.value.value ?? "")), o = S(() => {
206
207
  const C = t.value.colDef?.colId;
207
208
  return C ? t.value.context?.cells?.slots?.[C] : void 0;
208
209
  }), f = S(() => ({
@@ -241,9 +242,9 @@ const ue = ({
241
242
  return t.value = C, Q(D), !0;
242
243
  }
243
244
  }), (C, b) => {
244
- const E = P("KTooltip");
245
- return o.value ? (I(), q(J(a), { key: 0 })) : (I(), N("span", ve, [
246
- L(E, {
245
+ const K = q("KTooltip");
246
+ return o.value ? (I(), P(J(a), { key: 0 })) : (I(), N("span", ve, [
247
+ L(K, {
247
248
  class: "table-data-grid-cell-tooltip",
248
249
  disabled: !n.value,
249
250
  "kpop-attributes": { popoverDelay: 400 },
@@ -312,7 +313,7 @@ const ue = ({
312
313
  emitTableConfigUpdate: l,
313
314
  onExternalConfigChange: n
314
315
  }) => {
315
- const i = S(() => t.value ? U({ config: t.value, headers: e.value, pageSize: r.value }) : void 0), o = K(
316
+ const i = S(() => t.value ? U({ config: t.value, headers: e.value, pageSize: r.value }) : void 0), o = E(
316
317
  i.value ?? U({ config: void 0, headers: e.value, pageSize: r.value })
317
318
  );
318
319
  B(i, (v) => {
@@ -328,7 +329,7 @@ const ue = ({
328
329
  }, a = S(() => ({
329
330
  sortColumnKey: o.value.sortColumnKey,
330
331
  sortColumnOrder: o.value.sortColumnOrder
331
- })), s = S(() => o.value.pageSize ?? r.value);
332
+ })), s = S(() => t.value?.pageSize ?? r.value);
332
333
  return {
333
334
  activeTableConfig: x(o),
334
335
  activeSort: a,
@@ -400,7 +401,7 @@ const we = {
400
401
  key: 1,
401
402
  class: "table-empty-state",
402
403
  "data-testid": "table-empty-state"
403
- }, Ke = /* @__PURE__ */ $({
404
+ }, Ee = /* @__PURE__ */ $({
404
405
  __name: "TableDataGrid",
405
406
  props: {
406
407
  headers: {},
@@ -419,7 +420,7 @@ const we = {
419
420
  tableConfig: O(() => e.tableConfig),
420
421
  emitTableConfigUpdate: (p) => t("update:tableConfig", p),
421
422
  onExternalConfigChange: (p) => {
422
- i.value && g(i.value, { sortColumnKey: p.sortColumnKey, sortColumnOrder: p.sortColumnOrder });
423
+ i.value && g(i.value, p);
423
424
  }
424
425
  }), { onSortChanged: v, applySortToGrid: g } = ye({
425
426
  activeSort: f,
@@ -437,7 +438,7 @@ const we = {
437
438
  resizable: !1,
438
439
  sortable: !1,
439
440
  suppressMovable: !0
440
- }, E = S(() => [
441
+ }, K = S(() => [
441
442
  e.fetcher,
442
443
  a.value,
443
444
  e.refreshKey,
@@ -450,7 +451,7 @@ const we = {
450
451
  isFetching: F
451
452
  } = fe({
452
453
  fetcher: e.fetcher,
453
- resetKey: E,
454
+ resetKey: K,
454
455
  sort: f
455
456
  }), {
456
457
  fetchState: c,
@@ -466,7 +467,7 @@ const we = {
466
467
  i.value = p.api, t("grid:ready", p.api);
467
468
  };
468
469
  return (p, R) => {
469
- const z = P("KEmptyState");
470
+ const z = q("KEmptyState");
470
471
  return I(), N("div", we, [
471
472
  e.error ? (I(), N("div", Re, [
472
473
  V(p.$slots, "error-state", {}, () => [
@@ -483,7 +484,7 @@ const we = {
483
484
  title: y(l)("emptyState.title")
484
485
  }, null, 8, ["message", "title"])
485
486
  ], !0)
486
- ])) : (I(), q(y(te), {
487
+ ])) : (I(), P(y(te), {
487
488
  key: 2,
488
489
  "cache-block-size": y(a),
489
490
  class: "table-data-grid-grid",
@@ -505,12 +506,12 @@ const we = {
505
506
  ]);
506
507
  };
507
508
  }
508
- }), Ee = (e, r) => {
509
+ }), Ke = (e, r) => {
509
510
  const t = e.__vccOpts || e;
510
511
  for (const [l, n] of r)
511
512
  t[l] = n;
512
513
  return t;
513
- }, Fe = /* @__PURE__ */ Ee(Ke, [["__scopeId", "data-v-465120d6"]]);
514
+ }, Fe = /* @__PURE__ */ Ke(Ee, [["__scopeId", "data-v-d8328fe5"]]);
514
515
  export {
515
516
  Fe as TableDataGrid
516
517
  };
@@ -1 +1 @@
1
- (function(k,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue"),require("ag-grid-vue3"),require("ag-grid-community"),require("@kong-ui-public/i18n")):typeof define=="function"&&define.amd?define(["exports","vue","ag-grid-vue3","ag-grid-community","@kong-ui-public/i18n"],e):(k=typeof globalThis<"u"?globalThis:k||self,e(k["kong-ui-public-table-data-grid"]={},k.Vue,k.AgGridVue,k.agGridCommunity,k["kong-ui-public-i18n"]))})(this,(function(k,e,_,K,F){"use strict";var E=(t=>(t.PENDING="PENDING",t.LOADING="LOADING",t.SUCCESS="SUCCESS",t.ERROR="ERROR",t))(E||{});const M=t=>!!t?.length;function A(t,r,o,l=M){const s=e.computed(()=>l(t.value)),i=e.computed(()=>{const C=t.value!==void 0,n=r.value!==void 0&&r.value!==null;return o.value?"LOADING":s.value?"SUCCESS":n?"ERROR":C?"SUCCESS":"PENDING"});return{fetchState:E,hasData:s,state:i}}const V=({emitState:t,fetchLifecycleState:r,hasData:o})=>{e.watch(()=>({hasData:o.value,state:r.value}),({hasData:l,state:s})=>{if(s!==E.PENDING){if(s===E.LOADING){t({hasData:l,state:"loading"});return}if(s===E.ERROR){t({hasData:l,state:"error"});return}t({hasData:l,state:"success"})}})},U=({startRow:t,endRow:r})=>{const o=r-t;return{blockIndex:o>0?Math.floor(t/o):0,pageSize:o}},L=({startRow:t,rowsLength:r,pageSize:o,total:l,hasMore:s})=>{if(typeof l=="number")return l;if(s!==!0&&(s===!1||r<o))return t+r},W=({fetcher:t,resetKey:r,sort:o})=>{const l=new Map,s=new Map,i=e.ref(0),a=e.shallowRef(),C=e.shallowRef(),n=e.shallowRef(),c=e.ref(0),p=e.ref(!1),y=d=>d===i.value,v=()=>{p.value=c.value>0},w=()=>{n.value=void 0,c.value+=1,v()},D=()=>{c.value=Math.max(0,c.value-1),v()},g=d=>{const u=s.get(d);if(u)return u;let f;const S={promise:new Promise(m=>{f=m}),resolve:m=>f(m)};return s.set(d,S),S},b=(d,u)=>{u.resolve(!1),s.get(d)===u&&s.delete(d)},I=async({blockIndex:d,currentBlockCompletion:u,datasourceId:f})=>{if(d===0)return"ready";const S=s.get(d-1);if(!S)return b(d,u),"failed";const m=await S.promise;return y(f)?m?"ready":(b(d,u),"failed"):(b(d,u),"stale")},B=({blockIndex:d,currentBlockCompletion:u,getRowsParams:f,pageSize:S,result:m})=>{m.cursor!==void 0&&l.set(d,m.cursor),f.successCallback(m.data,L({startRow:f.startRow,rowsLength:m.data.length,pageSize:S,total:m.total,hasMore:m.hasMore})),f.startRow===0&&(C.value=m.data),u.resolve(!0)},G=({blockIndex:d,currentBlockCompletion:u,fetchError:f,getRowsParams:S})=>{n.value=f,S.failCallback(),b(d,u)},N=()=>{const d=i.value+1;return i.value=d,l.clear(),s.clear(),C.value=void 0,n.value=void 0,c.value=0,v(),{async getRows(u){const{blockIndex:f,pageSize:S}=U({startRow:u.startRow,endRow:u.endRow}),m=g(f);if(await I({blockIndex:f,currentBlockCompletion:m,datasourceId:d})!=="ready"){u.failCallback();return}y(d)&&w();try{const R=f>0?l.get(f-1):void 0,x=await t({mode:"infinite",pageSize:S,cursor:R,sort:o?.value});if(!y(d)){u.failCallback(),b(f,m);return}B({blockIndex:f,currentBlockCompletion:m,getRowsParams:u,pageSize:S,result:x})}catch(R){if(!y(d)){u.failCallback(),b(f,m);return}G({blockIndex:f,currentBlockCompletion:m,fetchError:R,getRowsParams:u})}finally{y(d)&&D()}}}},O=()=>{a.value=N()};return e.watch(()=>r?.value,()=>{O()},{immediate:!0}),{datasource:e.readonly(a),data:e.readonly(C),error:e.readonly(n),isFetching:e.readonly(p)}},q={key:1,class:"table-data-grid-cell-renderer"},$=e.defineComponent({name:"TableDataGridCellRenderer",__name:"TableDataGridCellRenderer",props:{params:{}},setup(t,{expose:r}){const o=e.shallowRef(t.params),l=e.ref(null),s=e.ref(!1),i=e.computed(()=>o.value.valueFormatted??String(o.value.value??"")),a=e.computed(()=>{const g=o.value.colDef?.colId;return g?o.value.context?.cells?.slots?.[g]:void 0}),C=e.computed(()=>({column:o.value.headerDef,refreshCell:()=>{const g=o.value.node;g&&o.value.api.refreshCells({force:!0,rowNodes:[g]})},row:o.value.data??{},rowIndex:o.value.node?.rowIndex??0,rowValue:o.value.value,selected:o.value.node?.isSelected()??!1})),n=()=>a.value?.(C.value);let c,p,y=!1;const v=()=>{const g=l.value;s.value=!!g&&g.scrollWidth>g.clientWidth},w=()=>{y||(p!==void 0&&cancelAnimationFrame(p),p=requestAnimationFrame(()=>{p=void 0,v()}))},D=g=>{if(c?.disconnect(),g){c?.observe(g);const b=g.closest(".ag-cell");b&&c?.observe(b)}w()};return e.onMounted(()=>{c=new ResizeObserver(w),D(l.value)}),e.watch(l,D,{flush:"post"}),e.onUnmounted(()=>{y=!0,c?.disconnect(),p!==void 0&&cancelAnimationFrame(p)}),r({refresh(g){return o.value=g,e.nextTick(w),!0}}),(g,b)=>{const I=e.resolveComponent("KTooltip");return a.value?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(n),{key:0})):(e.openBlock(),e.createElementBlock("span",q,[e.createVNode(I,{class:"table-data-grid-cell-tooltip",disabled:!s.value,"kpop-attributes":{popoverDelay:400},"max-width":"300",placement:"bottom-start",target:"body",text:i.value},{default:e.withCtx(()=>[e.createElementVNode("span",{ref_key:"contentElement",ref:l,class:"table-data-grid-cell-content"},e.toDisplayString(i.value),513)]),_:1},8,["disabled","text"])]))}}}),P=({headers:t,slots:r,initialSort:o})=>{const l=e.computed(()=>({cells:{slots:r}})),s=a=>{const C=o?.sortColumnKey===a.key;return{colId:a.key,flex:!a.width&&!a.maxWidth?1:void 0,headerName:a.label,maxWidth:a.maxWidth,minWidth:a.minWidth,sortable:a.sortable??!1,unSortIcon:a.showSortIcon,...C?{initialSort:o?.sortColumnOrder,initialSortIndex:0}:{},valueGetter:n=>n.data?.[a.key],width:a.width,cellRenderer:$,cellRendererParams:{headerDef:a}}};return{columnDefs:e.computed(()=>t.value.map(s)),gridContext:l}},T=({config:t,headers:r,pageSize:o})=>{const l=new Set(r.filter(i=>i.sortable).map(i=>i.key)),s=t?.sortColumnKey&&l.has(t.sortColumnKey)?t.sortColumnKey:void 0;return{sortColumnKey:s,sortColumnOrder:s?t?.sortColumnOrder:void 0,pageSize:t?.pageSize??o}},z=(t,r)=>t.sortColumnKey===r.sortColumnKey&&t.sortColumnOrder===r.sortColumnOrder&&t.pageSize===r.pageSize,j=({headers:t,pageSize:r,tableConfig:o,emitTableConfigUpdate:l,onExternalConfigChange:s})=>{const i=e.computed(()=>o.value?T({config:o.value,headers:t.value,pageSize:r.value}):void 0),a=e.ref(i.value??T({config:void 0,headers:t.value,pageSize:r.value}));e.watch(i,p=>{p&&!z(p,a.value)&&(a.value=p,s?.(p))});const C=p=>{const y=T({config:{...a.value,...p},headers:t.value,pageSize:r.value});z(y,a.value)||(a.value=y,l(y))},n=e.computed(()=>({sortColumnKey:a.value.sortColumnKey,sortColumnOrder:a.value.sortColumnOrder})),c=e.computed(()=>a.value.pageSize??r.value);return{activeTableConfig:e.readonly(a),activeSort:n,activePageSize:c,patchTableConfig:C}},H=({cellClick:t,headers:r,rowClick:o})=>{const l=e.computed(()=>new Set(r.value.filter(n=>n.disableRowClick).map(n=>n.key))),s=n=>{const c=n.event?.target;return c instanceof Element?c.closest(".ag-cell")?.getAttribute("col-id")??void 0:void 0},i=n=>{const c=s(n);return!!(c&&l.value.has(c))};return{onCellClick:n=>{const c=n.colDef.colId;!n.data||!c||t({columnKey:c,row:n.data,value:n.value})},onRowClick:n=>{n.data&&!i(n)&&o(n.data,n)}}},Q=({activeSort:t,emitSort:r,patchTableConfig:o})=>{const l=(i,a)=>{i.applyColumnState({state:a.sortColumnKey?[{colId:a.sortColumnKey,sort:a.sortColumnOrder??null,sortIndex:0}]:[],defaultState:{sort:null,sortIndex:null}})};return{onSortChanged:i=>{const a=i.api.getColumnState().filter(c=>c.sort).sort((c,p)=>(c.sortIndex??0)-(p.sortIndex??0)),C=a[a.length-1],n=C?{sortColumnKey:C.colId,sortColumnOrder:C.sort}:{sortColumnKey:void 0,sortColumnOrder:void 0};n.sortColumnKey===t.value.sortColumnKey&&n.sortColumnOrder===t.value.sortColumnOrder||(r(n),o(n),a.length>1&&l(i.api,n))},applySortToGrid:l}},J={emptyState:{title:"No Data",message:"There is no data to display."},errorState:{title:"An error occurred",message:"Data cannot be displayed due to an error."}};function X(){const t=F.createI18n("en-us",J);return{i18n:t,i18nT:F.i18nTComponent(t)}}const Y={class:"kong-ui-public-table-data-grid","data-testid":"table-data-grid"},Z={key:0,class:"table-error-state","data-testid":"table-error-state"},ee={key:1,class:"table-empty-state","data-testid":"table-empty-state"},te=((t,r)=>{const o=t.__vccOpts||t;for(const[l,s]of r)o[l]=s;return o})(e.defineComponent({__name:"TableDataGrid",props:{headers:{},fetcher:{type:Function},error:{type:Boolean,default:!1},pageSize:{default:25},refreshKey:{type:[String,Number,Boolean]},tableConfig:{}},emits:["grid:ready","state","row:click","cell:click","sort","update:tableConfig"],setup(t,{emit:r}){K.ModuleRegistry.registerModules([K.AllCommunityModule,K.InfiniteRowModelModule]);const o=r,{i18n:{t:l}}=X(),s=e.useSlots(),i=e.shallowRef(),{activeTableConfig:a,activeSort:C,activePageSize:n,patchTableConfig:c}=j({headers:e.toRef(()=>t.headers),pageSize:e.toRef(()=>t.pageSize),tableConfig:e.toRef(()=>t.tableConfig),emitTableConfigUpdate:h=>o("update:tableConfig",h),onExternalConfigChange:h=>{i.value&&y(i.value,{sortColumnKey:h.sortColumnKey,sortColumnOrder:h.sortColumnOrder})}}),{onSortChanged:p,applySortToGrid:y}=Q({activeSort:C,emitSort:h=>o("sort",h),patchTableConfig:c}),{columnDefs:v,gridContext:w}=P({headers:e.toRef(()=>t.headers),slots:s,initialSort:C.value}),{onCellClick:D,onRowClick:g}=H({cellClick:h=>o("cell:click",h),headers:e.toRef(()=>t.headers),rowClick:(h,R)=>o("row:click",h,R)}),b={resizable:!1,sortable:!1,suppressMovable:!0},I=e.computed(()=>[t.fetcher,n.value,t.refreshKey,a.value.sortColumnKey,a.value.sortColumnOrder]),{data:B,datasource:G,error:N,isFetching:O}=W({fetcher:t.fetcher,resetKey:I,sort:C}),{fetchState:d,hasData:u,state:f}=A(B,N,O),S=e.computed(()=>f.value===d.SUCCESS&&!u.value);V({emitState:h=>o("state",h),fetchLifecycleState:f,hasData:u});const m=h=>{i.value=h.api,o("grid:ready",h.api)};return(h,R)=>{const x=e.resolveComponent("KEmptyState");return e.openBlock(),e.createElementBlock("div",Y,[t.error?(e.openBlock(),e.createElementBlock("div",Z,[e.renderSlot(h.$slots,"error-state",{},()=>[e.createVNode(x,{"icon-variant":"error",message:e.unref(l)("errorState.message"),title:e.unref(l)("errorState.title")},null,8,["message","title"])],!0)])):S.value?(e.openBlock(),e.createElementBlock("div",ee,[e.renderSlot(h.$slots,"empty-state",{},()=>[e.createVNode(x,{message:e.unref(l)("emptyState.message"),title:e.unref(l)("emptyState.title")},null,8,["message","title"])],!0)])):(e.openBlock(),e.createBlock(e.unref(_.AgGridVue),{key:2,"cache-block-size":e.unref(n),class:"table-data-grid-grid","column-defs":e.unref(v),context:e.unref(w),datasource:e.unref(G),"default-col-def":b,"infinite-initial-row-count":1,loading:e.unref(O),"row-model-type":"infinite","suppress-cell-focus":!0,"suppress-multi-sort":!0,theme:e.unref(K.themeQuartz),onCellClicked:e.unref(D),onGridReady:m,onRowClicked:e.unref(g),onSortChanged:e.unref(p)},null,8,["cache-block-size","column-defs","context","datasource","loading","theme","onCellClicked","onRowClicked","onSortChanged"]))])}}}),[["__scopeId","data-v-465120d6"]]);k.TableDataGrid=te,Object.defineProperty(k,Symbol.toStringTag,{value:"Module"})}));
1
+ (function(b,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue"),require("ag-grid-vue3"),require("ag-grid-community"),require("@kong-ui-public/i18n")):typeof define=="function"&&define.amd?define(["exports","vue","ag-grid-vue3","ag-grid-community","@kong-ui-public/i18n"],e):(b=typeof globalThis<"u"?globalThis:b||self,e(b["kong-ui-public-table-data-grid"]={},b.Vue,b.AgGridVue,b.agGridCommunity,b["kong-ui-public-i18n"]))})(this,(function(b,e,_,K,F){"use strict";var E=(t=>(t.PENDING="PENDING",t.LOADING="LOADING",t.SUCCESS="SUCCESS",t.ERROR="ERROR",t))(E||{});const M=t=>!!t?.length;function A(t,r,o,l=M){const s=e.computed(()=>l(t.value)),i=e.computed(()=>{const C=t.value!==void 0,n=r.value!==void 0&&r.value!==null;return o.value?"LOADING":s.value?"SUCCESS":n?"ERROR":C?"SUCCESS":"PENDING"});return{fetchState:E,hasData:s,state:i}}const V=({emitState:t,fetchLifecycleState:r,hasData:o})=>{e.watch(()=>({hasData:o.value,state:r.value}),({hasData:l,state:s})=>{if(s!==E.PENDING){if(s===E.LOADING){t({hasData:l,state:"loading"});return}if(s===E.ERROR){t({hasData:l,state:"error"});return}t({hasData:l,state:"success"})}})},U=({startRow:t,endRow:r})=>{const o=r-t;return{blockIndex:o>0?Math.floor(t/o):0,pageSize:o}},L=({startRow:t,rowsLength:r,pageSize:o,total:l,hasMore:s})=>{if(typeof l=="number")return l;if(s!==!0&&(s===!1||r<o))return t+r},W=({fetcher:t,resetKey:r,sort:o})=>{const l=new Map,s=new Map,i=e.ref(0),a=e.shallowRef(),C=e.shallowRef(),n=e.shallowRef(),c=e.ref(0),p=e.ref(!1),y=d=>d===i.value,v=()=>{p.value=c.value>0},w=()=>{n.value=void 0,c.value+=1,v()},D=()=>{c.value=Math.max(0,c.value-1),v()},g=d=>{const u=s.get(d);if(u)return u;let f;const S={promise:new Promise(m=>{f=m}),resolve:m=>f(m)};return s.set(d,S),S},k=(d,u)=>{u.resolve(!1),s.get(d)===u&&s.delete(d)},I=async({blockIndex:d,currentBlockCompletion:u,datasourceId:f})=>{if(d===0)return"ready";const S=s.get(d-1);if(!S)return k(d,u),"failed";const m=await S.promise;return y(f)?m?"ready":(k(d,u),"failed"):(k(d,u),"stale")},B=({blockIndex:d,currentBlockCompletion:u,getRowsParams:f,pageSize:S,result:m})=>{m.cursor!==void 0&&l.set(d,m.cursor),f.successCallback(m.data,L({startRow:f.startRow,rowsLength:m.data.length,pageSize:S,total:m.total,hasMore:m.hasMore})),f.startRow===0&&(C.value=m.data),u.resolve(!0)},G=({blockIndex:d,currentBlockCompletion:u,fetchError:f,getRowsParams:S})=>{n.value=f,S.failCallback(),k(d,u)},N=()=>{const d=i.value+1;return i.value=d,l.clear(),s.clear(),C.value=void 0,n.value=void 0,c.value=0,v(),{async getRows(u){const{blockIndex:f,pageSize:S}=U({startRow:u.startRow,endRow:u.endRow}),m=g(f);if(await I({blockIndex:f,currentBlockCompletion:m,datasourceId:d})!=="ready"){u.failCallback();return}y(d)&&w();try{const R=f>0?l.get(f-1):void 0,x=await t({mode:"infinite",pageSize:S,cursor:R,sort:o?.value});if(!y(d)){u.failCallback(),k(f,m);return}B({blockIndex:f,currentBlockCompletion:m,getRowsParams:u,pageSize:S,result:x})}catch(R){if(!y(d)){u.failCallback(),k(f,m);return}G({blockIndex:f,currentBlockCompletion:m,fetchError:R,getRowsParams:u})}finally{y(d)&&D()}}}},O=()=>{a.value=N()};return e.watch(()=>r?.value,()=>{O()},{immediate:!0}),{datasource:e.readonly(a),data:e.readonly(C),error:e.readonly(n),isFetching:e.readonly(p)}},q={key:1,class:"table-data-grid-cell-renderer"},$=e.defineComponent({name:"TableDataGridCellRenderer",__name:"TableDataGridCellRenderer",props:{params:{}},setup(t,{expose:r}){const o=e.shallowRef(t.params),l=e.ref(null),s=e.ref(!1),i=e.computed(()=>o.value.valueFormatted??String(o.value.value??"")),a=e.computed(()=>{const g=o.value.colDef?.colId;return g?o.value.context?.cells?.slots?.[g]:void 0}),C=e.computed(()=>({column:o.value.headerDef,refreshCell:()=>{const g=o.value.node;g&&o.value.api.refreshCells({force:!0,rowNodes:[g]})},row:o.value.data??{},rowIndex:o.value.node?.rowIndex??0,rowValue:o.value.value,selected:o.value.node?.isSelected()??!1})),n=()=>a.value?.(C.value);let c,p,y=!1;const v=()=>{const g=l.value;s.value=!!g&&g.scrollWidth>g.clientWidth},w=()=>{y||(p!==void 0&&cancelAnimationFrame(p),p=requestAnimationFrame(()=>{p=void 0,v()}))},D=g=>{if(c?.disconnect(),g){c?.observe(g);const k=g.closest(".ag-cell");k&&c?.observe(k)}w()};return e.onMounted(()=>{c=new ResizeObserver(w),D(l.value)}),e.watch(l,D,{flush:"post"}),e.onUnmounted(()=>{y=!0,c?.disconnect(),p!==void 0&&cancelAnimationFrame(p)}),r({refresh(g){return o.value=g,e.nextTick(w),!0}}),(g,k)=>{const I=e.resolveComponent("KTooltip");return a.value?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(n),{key:0})):(e.openBlock(),e.createElementBlock("span",q,[e.createVNode(I,{class:"table-data-grid-cell-tooltip",disabled:!s.value,"kpop-attributes":{popoverDelay:400},"max-width":"300",placement:"bottom-start",target:"body",text:i.value},{default:e.withCtx(()=>[e.createElementVNode("span",{ref_key:"contentElement",ref:l,class:"table-data-grid-cell-content"},e.toDisplayString(i.value),513)]),_:1},8,["disabled","text"])]))}}}),j=({headers:t,slots:r,initialSort:o})=>{const l=e.computed(()=>({cells:{slots:r}})),s=a=>{const C=o?.sortColumnKey===a.key;return{colId:a.key,flex:!a.width&&!a.maxWidth?1:void 0,headerName:a.label,maxWidth:a.maxWidth,minWidth:a.minWidth,sortable:a.sortable??!1,unSortIcon:a.showSortIcon,...C?{initialSort:o?.sortColumnOrder,initialSortIndex:0}:{},valueGetter:n=>n.data?.[a.key],width:a.width,cellRenderer:$,cellRendererParams:{headerDef:a}}};return{columnDefs:e.computed(()=>t.value.map(s)),gridContext:l}},T=({config:t,headers:r,pageSize:o})=>{const l=new Set(r.filter(i=>i.sortable).map(i=>i.key)),s=t?.sortColumnKey&&l.has(t.sortColumnKey)?t.sortColumnKey:void 0;return{sortColumnKey:s,sortColumnOrder:s?t?.sortColumnOrder:void 0,pageSize:t?.pageSize??o}},z=(t,r)=>t.sortColumnKey===r.sortColumnKey&&t.sortColumnOrder===r.sortColumnOrder&&t.pageSize===r.pageSize,P=({headers:t,pageSize:r,tableConfig:o,emitTableConfigUpdate:l,onExternalConfigChange:s})=>{const i=e.computed(()=>o.value?T({config:o.value,headers:t.value,pageSize:r.value}):void 0),a=e.ref(i.value??T({config:void 0,headers:t.value,pageSize:r.value}));e.watch(i,p=>{p&&!z(p,a.value)&&(a.value=p,s?.(p))});const C=p=>{const y=T({config:{...a.value,...p},headers:t.value,pageSize:r.value});z(y,a.value)||(a.value=y,l(y))},n=e.computed(()=>({sortColumnKey:a.value.sortColumnKey,sortColumnOrder:a.value.sortColumnOrder})),c=e.computed(()=>o.value?.pageSize??r.value);return{activeTableConfig:e.readonly(a),activeSort:n,activePageSize:c,patchTableConfig:C}},H=({cellClick:t,headers:r,rowClick:o})=>{const l=e.computed(()=>new Set(r.value.filter(n=>n.disableRowClick).map(n=>n.key))),s=n=>{const c=n.event?.target;return c instanceof Element?c.closest(".ag-cell")?.getAttribute("col-id")??void 0:void 0},i=n=>{const c=s(n);return!!(c&&l.value.has(c))};return{onCellClick:n=>{const c=n.colDef.colId;!n.data||!c||t({columnKey:c,row:n.data,value:n.value})},onRowClick:n=>{n.data&&!i(n)&&o(n.data,n)}}},Q=({activeSort:t,emitSort:r,patchTableConfig:o})=>{const l=(i,a)=>{i.applyColumnState({state:a.sortColumnKey?[{colId:a.sortColumnKey,sort:a.sortColumnOrder??null,sortIndex:0}]:[],defaultState:{sort:null,sortIndex:null}})};return{onSortChanged:i=>{const a=i.api.getColumnState().filter(c=>c.sort).sort((c,p)=>(c.sortIndex??0)-(p.sortIndex??0)),C=a[a.length-1],n=C?{sortColumnKey:C.colId,sortColumnOrder:C.sort}:{sortColumnKey:void 0,sortColumnOrder:void 0};n.sortColumnKey===t.value.sortColumnKey&&n.sortColumnOrder===t.value.sortColumnOrder||(r(n),o(n),a.length>1&&l(i.api,n))},applySortToGrid:l}},J={emptyState:{title:"No Data",message:"There is no data to display."},errorState:{title:"An error occurred",message:"Data cannot be displayed due to an error."}};function X(){const t=F.createI18n("en-us",J);return{i18n:t,i18nT:F.i18nTComponent(t)}}const Y={class:"kong-ui-public-table-data-grid","data-testid":"table-data-grid"},Z={key:0,class:"table-error-state","data-testid":"table-error-state"},ee={key:1,class:"table-empty-state","data-testid":"table-empty-state"},te=((t,r)=>{const o=t.__vccOpts||t;for(const[l,s]of r)o[l]=s;return o})(e.defineComponent({__name:"TableDataGrid",props:{headers:{},fetcher:{type:Function},error:{type:Boolean,default:!1},pageSize:{default:25},refreshKey:{type:[String,Number,Boolean]},tableConfig:{}},emits:["grid:ready","state","row:click","cell:click","sort","update:tableConfig"],setup(t,{emit:r}){K.ModuleRegistry.registerModules([K.AllCommunityModule,K.InfiniteRowModelModule]);const o=r,{i18n:{t:l}}=X(),s=e.useSlots(),i=e.shallowRef(),{activeTableConfig:a,activeSort:C,activePageSize:n,patchTableConfig:c}=P({headers:e.toRef(()=>t.headers),pageSize:e.toRef(()=>t.pageSize),tableConfig:e.toRef(()=>t.tableConfig),emitTableConfigUpdate:h=>o("update:tableConfig",h),onExternalConfigChange:h=>{i.value&&y(i.value,h)}}),{onSortChanged:p,applySortToGrid:y}=Q({activeSort:C,emitSort:h=>o("sort",h),patchTableConfig:c}),{columnDefs:v,gridContext:w}=j({headers:e.toRef(()=>t.headers),slots:s,initialSort:C.value}),{onCellClick:D,onRowClick:g}=H({cellClick:h=>o("cell:click",h),headers:e.toRef(()=>t.headers),rowClick:(h,R)=>o("row:click",h,R)}),k={resizable:!1,sortable:!1,suppressMovable:!0},I=e.computed(()=>[t.fetcher,n.value,t.refreshKey,a.value.sortColumnKey,a.value.sortColumnOrder]),{data:B,datasource:G,error:N,isFetching:O}=W({fetcher:t.fetcher,resetKey:I,sort:C}),{fetchState:d,hasData:u,state:f}=A(B,N,O),S=e.computed(()=>f.value===d.SUCCESS&&!u.value);V({emitState:h=>o("state",h),fetchLifecycleState:f,hasData:u});const m=h=>{i.value=h.api,o("grid:ready",h.api)};return(h,R)=>{const x=e.resolveComponent("KEmptyState");return e.openBlock(),e.createElementBlock("div",Y,[t.error?(e.openBlock(),e.createElementBlock("div",Z,[e.renderSlot(h.$slots,"error-state",{},()=>[e.createVNode(x,{"icon-variant":"error",message:e.unref(l)("errorState.message"),title:e.unref(l)("errorState.title")},null,8,["message","title"])],!0)])):S.value?(e.openBlock(),e.createElementBlock("div",ee,[e.renderSlot(h.$slots,"empty-state",{},()=>[e.createVNode(x,{message:e.unref(l)("emptyState.message"),title:e.unref(l)("emptyState.title")},null,8,["message","title"])],!0)])):(e.openBlock(),e.createBlock(e.unref(_.AgGridVue),{key:2,"cache-block-size":e.unref(n),class:"table-data-grid-grid","column-defs":e.unref(v),context:e.unref(w),datasource:e.unref(G),"default-col-def":k,"infinite-initial-row-count":1,loading:e.unref(O),"row-model-type":"infinite","suppress-cell-focus":!0,"suppress-multi-sort":!0,theme:e.unref(K.themeQuartz),onCellClicked:e.unref(D),onGridReady:m,onRowClicked:e.unref(g),onSortChanged:e.unref(p)},null,8,["cache-block-size","column-defs","context","datasource","loading","theme","onCellClicked","onRowClicked","onSortChanged"]))])}}}),[["__scopeId","data-v-d8328fe5"]]);b.TableDataGrid=te,Object.defineProperty(b,Symbol.toStringTag,{value:"Module"})}));
@@ -1 +1 @@
1
- {"version":3,"file":"TableDataGrid.vue.d.ts","sourceRoot":"","sources":["../../../src/components/TableDataGrid.vue"],"names":[],"mappings":"AA4PA,OAAO,KAAK,EACV,6BAA6B,EAC7B,0BAA0B,EAC1B,mBAAmB,EACnB,oBAAoB,EACpB,mBAAmB,EACnB,iBAAiB,EACjB,yBAAyB,EAC1B,MAAM,UAAU,CAAA;AACjB,OAAO,KAAK,EAEV,OAAO,EACP,cAAc,EACd,eAAe,EAChB,MAAM,mBAAmB,CAAA;AAkB1B,QAAA,MAAM,YAAY,GAAK,GAAG,SAAS,MAAM,EACxC,aAAa,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,OAAO,CAAC,EAC9D,YAAY,mBAAmB,CAAC,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,CAAC,CAAC,EAC3G,gBAAgB,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,QAAQ,CAAC,EAClE;WAsRO,OAAO,KAAK,EAAE,WAAW,GAAG,mBAAmB,CAAC;iBAlR7C,KAAK,CAAC,mBAAmB,CAAC,GAAG,CAAC,CAAC;iBAC/B,oBAAoB,CAAC,GAAG,CAAC;gBAC1B,OAAO;mBACJ,MAAM;qBACJ,MAAM,GAAG,MAAM,GAAG,OAAO;sBACxB,mBAAmB;;;;;;;;KA6QwD,CAAC,GAAG,CAAC,OAAO,UAAU,SAAS;QAAE,oBAAoB,EAAE,MAAM,CAAC,CAAA;KAAE,GAAG,CAAC,GAAG,EAAE,CAAC;YAC5J,CAAC,OAAO,EAAE,EAAE,KAAK,IAAI;WACtB,GAAG;;qCAhQoB,0BAA0B,CAAC,GAAG,CAAC,KAAK,OAAO;uBAFzD,MAAM,OAAO;uBACb,MAAM,OAAO;;;YAMxB,YAAY,OAAO,cAAc,CAAC,GAAG,CAAC,CAAC,KAAK,CAAC,GAAG,IAAI;YACpD,OAAO,WAAW,yBAAyB,GAAG,IAAI;YAClD,WAAW,OAAO,GAAG,SAAS,eAAe,CAAC,GAAG,CAAC,GAAG,IAAI;YACzD,YAAY,WAAW,6BAA6B,CAAC,GAAG,CAAC,GAAG,IAAI;YAChE,MAAM,WAAW,iBAAiB,GAAG,IAAI;YACzC,oBAAoB,WAAW,mBAAmB,GAAG,IAAI;;EA0P3D,KACQ,OAAO,KAAK,EAAE,KAAK,GAAG;IAAE,KAAK,CAAC,EAAE,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAA;CAAI,CAAC;wBACpE,OAAO,YAAY;AAAxC,wBAAyC;AACzC,KAAK,mBAAmB,CAAC,CAAC,IAAI,CAAC,CAAC,SAAS,GAAG,GAAG;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,GAAG;KAAG,CAAC,IAAI,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,CAAC,GAAG,EAAE,CAAC"}
1
+ {"version":3,"file":"TableDataGrid.vue.d.ts","sourceRoot":"","sources":["../../../src/components/TableDataGrid.vue"],"names":[],"mappings":"AAgQA,OAAO,KAAK,EACV,6BAA6B,EAC7B,0BAA0B,EAC1B,mBAAmB,EACnB,oBAAoB,EACpB,mBAAmB,EACnB,iBAAiB,EACjB,yBAAyB,EAC1B,MAAM,UAAU,CAAA;AACjB,OAAO,KAAK,EAEV,OAAO,EACP,cAAc,EACd,eAAe,EAChB,MAAM,mBAAmB,CAAA;AAkB1B,QAAA,MAAM,YAAY,GAAK,GAAG,SAAS,MAAM,EACxC,aAAa,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,OAAO,CAAC,EAC9D,YAAY,mBAAmB,CAAC,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,CAAC,CAAC,EAC3G,gBAAgB,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,QAAQ,CAAC,EAClE;WA0RO,OAAO,KAAK,EAAE,WAAW,GAAG,mBAAmB,CAAC;iBAtR7C,KAAK,CAAC,mBAAmB,CAAC,GAAG,CAAC,CAAC;iBAC/B,oBAAoB,CAAC,GAAG,CAAC;gBAC1B,OAAO;mBACJ,MAAM;qBACJ,MAAM,GAAG,MAAM,GAAG,OAAO;sBACxB,mBAAmB;;;;;;;;KAiRwD,CAAC,GAAG,CAAC,OAAO,UAAU,SAAS;QAAE,oBAAoB,EAAE,MAAM,CAAC,CAAA;KAAE,GAAG,CAAC,GAAG,EAAE,CAAC;YAC5J,CAAC,OAAO,EAAE,EAAE,KAAK,IAAI;WACtB,GAAG;;qCApQoB,0BAA0B,CAAC,GAAG,CAAC,KAAK,OAAO;uBAFzD,MAAM,OAAO;uBACb,MAAM,OAAO;;;YAMxB,YAAY,OAAO,cAAc,CAAC,GAAG,CAAC,CAAC,KAAK,CAAC,GAAG,IAAI;YACpD,OAAO,WAAW,yBAAyB,GAAG,IAAI;YAClD,WAAW,OAAO,GAAG,SAAS,eAAe,CAAC,GAAG,CAAC,GAAG,IAAI;YACzD,YAAY,WAAW,6BAA6B,CAAC,GAAG,CAAC,GAAG,IAAI;YAChE,MAAM,WAAW,iBAAiB,GAAG,IAAI;YACzC,oBAAoB,WAAW,mBAAmB,GAAG,IAAI;;EA8P3D,KACQ,OAAO,KAAK,EAAE,KAAK,GAAG;IAAE,KAAK,CAAC,EAAE,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAA;CAAI,CAAC;wBACpE,OAAO,YAAY;AAAxC,wBAAyC;AACzC,KAAK,mBAAmB,CAAC,CAAC,IAAI,CAAC,CAAC,SAAS,GAAG,GAAG;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,GAAG;KAAG,CAAC,IAAI,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,CAAC,GAAG,EAAE,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"useFetchInfinite.d.ts","sourceRoot":"","sources":["../../../src/composables/useFetchInfinite.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,oBAAoB,EAEpB,gBAAgB,EAChB,iBAAiB,EAClB,MAAM,UAAU,CAAA;AACjB,OAAO,KAAK,EAAe,cAAc,EAAE,MAAM,mBAAmB,CAAA;AACpE,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAW9B,UAAU,uBAAuB,CAAC,GAAG,SAAS,MAAM,GAAG,gBAAgB;IACrE;;;OAGG;IACH,OAAO,EAAE,oBAAoB,CAAC,GAAG,CAAC,CAAA;IAClC;;;OAGG;IACH,QAAQ,CAAC,EAAE,QAAQ,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC,CAAA;IACjC;;OAEG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC,GAAG,CAAC,iBAAiB,GAAG,SAAS,CAAC,CAAC,CAAA;CACpD;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,eAAO,MAAM,gBAAgB,GAAI,GAAG,SAAS,MAAM,GAAG,gBAAgB,EAAE,8BAIrE,uBAAuB,CAAC,GAAG,CAAC;;;;;;;;;;;;;CA6U9B,CAAA"}
1
+ {"version":3,"file":"useFetchInfinite.d.ts","sourceRoot":"","sources":["../../../src/composables/useFetchInfinite.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,oBAAoB,EAEpB,gBAAgB,EAChB,iBAAiB,EAClB,MAAM,UAAU,CAAA;AACjB,OAAO,KAAK,EAAe,cAAc,EAAE,MAAM,mBAAmB,CAAA;AACpE,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAW9B,UAAU,uBAAuB,CAAC,GAAG,SAAS,MAAM,GAAG,gBAAgB;IACrE;;;OAGG;IACH,OAAO,EAAE,oBAAoB,CAAC,GAAG,CAAC,CAAA;IAClC;;;OAGG;IACH,QAAQ,CAAC,EAAE,QAAQ,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC,CAAA;IACjC;;OAEG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC,GAAG,CAAC,iBAAiB,GAAG,SAAS,CAAC,CAAC,CAAA;CACpD;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,eAAO,MAAM,gBAAgB,GAAI,GAAG,SAAS,MAAM,GAAG,gBAAgB,EAAE,8BAIrE,uBAAuB,CAAC,GAAG,CAAC;;;;;;;;;;;;;CAsU9B,CAAA"}
@@ -8,16 +8,6 @@ import type { Ref, Slots } from 'vue';
8
8
  export declare const useTableDataGridColumnDefs: <Row extends object = TableDataGridRow>({ headers, slots, initialSort, }: {
9
9
  headers: Readonly<Ref<Array<TableDataGridHeader<Row>>>>;
10
10
  slots: Slots;
11
- /**
12
- * Sort to seed into AG Grid's initial column state, captured once (not a
13
- * reactive ref). This only covers the very first render, e.g. a
14
- * host-controlled `tableConfig` prop supplied at mount. Ongoing sort sync
15
- * after mount goes through `applyColumnState` (see `useTableDataGridSort`),
16
- * not through recomputing column defs — AG Grid already reflects a
17
- * grid-driven sort change internally, and re-pushing column defs on every
18
- * such change would redundantly re-trigger AG Grid's own column state
19
- * handling.
20
- */
21
11
  initialSort?: TableDataGridSort;
22
12
  }) => {
23
13
  columnDefs: import("vue").ComputedRef<ColDef<Row, any>[]>;
@@ -1 +1 @@
1
- {"version":3,"file":"useTableDataGridColumnDefs.d.ts","sourceRoot":"","sources":["../../../src/composables/useTableDataGridColumnDefs.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,mBAAmB,EAAE,gBAAgB,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAA;AACxF,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAA;AAC/C,OAAO,KAAK,EAAE,GAAG,EAAE,KAAK,EAAE,MAAM,KAAK,CAAA;AAIrC;;;GAGG;AACH,eAAO,MAAM,0BAA0B,GAAI,GAAG,SAAS,MAAM,GAAG,gBAAgB,EAAE,kCAI/E;IACD,OAAO,EAAE,QAAQ,CAAC,GAAG,CAAC,KAAK,CAAC,mBAAmB,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAA;IACvD,KAAK,EAAE,KAAK,CAAA;IACZ;;;;;;;;;OASG;IACH,WAAW,CAAC,EAAE,iBAAiB,CAAA;CAChC;;;;;;;;;CAiCA,CAAA"}
1
+ {"version":3,"file":"useTableDataGridColumnDefs.d.ts","sourceRoot":"","sources":["../../../src/composables/useTableDataGridColumnDefs.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,mBAAmB,EAAE,gBAAgB,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAA;AACxF,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAA;AAC/C,OAAO,KAAK,EAAE,GAAG,EAAE,KAAK,EAAE,MAAM,KAAK,CAAA;AAIrC;;;GAGG;AACH,eAAO,MAAM,0BAA0B,GAAI,GAAG,SAAS,MAAM,GAAG,gBAAgB,EAAE,kCAI/E;IACD,OAAO,EAAE,QAAQ,CAAC,GAAG,CAAC,KAAK,CAAC,mBAAmB,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAA;IACvD,KAAK,EAAE,KAAK,CAAA;IACZ,WAAW,CAAC,EAAE,iBAAiB,CAAA;CAChC;;;;;;;;;CAiCA,CAAA"}
@@ -2,15 +2,8 @@ import type { TableDataGridRow, TableDataGridSort } from '../types';
2
2
  import type { GridApi, SortChangedEvent } from 'ag-grid-community';
3
3
  import type { Ref } from 'vue';
4
4
  /**
5
- * Translates AG Grid's `sortChanged` event into `TableDataGrid`'s
6
- * package-owned `sort` shape, and pushes a host- or package-driven sort
7
- * back onto the grid.
8
- *
9
- * A grid-driven event is only acted on when it actually changes the
10
- * current sort — comparing against `activeSort` (rather than a mutable
11
- * re-entrancy flag) makes this idempotent, so it also absorbs the echo
12
- * `sortChanged` event that `applySortToGrid`'s own `applyColumnState` call
13
- * fires.
5
+ * Translates AG Grid's `sortChanged` event into `TableDataGrid`'s `sort`
6
+ * shape, and pushes a sort back onto the grid.
14
7
  *
15
8
  * @param activeSort Current resolved sort, read from `useTableDataGridConfig`.
16
9
  * @param emitSort Called with the new sort whenever a grid interaction changes it.
@@ -1 +1 @@
1
- {"version":3,"file":"useTableDataGridSort.d.ts","sourceRoot":"","sources":["../../../src/composables/useTableDataGridSort.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,iBAAiB,EAA8B,MAAM,UAAU,CAAA;AAC/F,OAAO,KAAK,EAAE,OAAO,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAA;AAClE,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAE9B;;;;;;;;;;;;;;GAcG;AACH,eAAO,MAAM,oBAAoB,GAAI,GAAG,SAAS,MAAM,GAAG,gBAAgB,EAAE,6CAIzE;IACD,UAAU,EAAE,QAAQ,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC,CAAA;IAC5C,QAAQ,EAAE,CAAC,IAAI,EAAE,iBAAiB,KAAK,IAAI,CAAA;IAC3C,gBAAgB,EAAE,CAAC,KAAK,EAAE,OAAO,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAA;CAC9D;2BAU+B,gBAAgB,CAAC,GAAG,CAAC;2BATrB,OAAO,CAAC,GAAG,CAAC,QAAQ,iBAAiB;CAsCpE,CAAA"}
1
+ {"version":3,"file":"useTableDataGridSort.d.ts","sourceRoot":"","sources":["../../../src/composables/useTableDataGridSort.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,iBAAiB,EAA8B,MAAM,UAAU,CAAA;AAC/F,OAAO,KAAK,EAAE,OAAO,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAA;AAClE,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAE9B;;;;;;;GAOG;AACH,eAAO,MAAM,oBAAoB,GAAI,GAAG,SAAS,MAAM,GAAG,gBAAgB,EAAE,6CAIzE;IACD,UAAU,EAAE,QAAQ,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC,CAAA;IAC5C,QAAQ,EAAE,CAAC,IAAI,EAAE,iBAAiB,KAAK,IAAI,CAAA;IAC3C,gBAAgB,EAAE,CAAC,KAAK,EAAE,OAAO,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAA;CAC9D;2BAU+B,gBAAgB,CAAC,GAAG,CAAC;2BATrB,OAAO,CAAC,GAAG,CAAC,QAAQ,iBAAiB;CAqCpE,CAAA"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kong-ui-public/table-data-grid",
3
- "version": "0.4.2-pr.3761.fdf1bafe4.0",
3
+ "version": "0.5.1",
4
4
  "type": "module",
5
5
  "main": "./dist/table-data-grid.umd.js",
6
6
  "module": "./dist/table-data-grid.es.js",
@@ -21,9 +21,9 @@
21
21
  "access": "public"
22
22
  },
23
23
  "devDependencies": {
24
- "@kong/kongponents": "9.64.10",
25
- "vue": "^3.5.41",
26
- "@kong-ui-public/i18n": "^2.5.1"
24
+ "@kong-ui-public/i18n": "^2.5.1",
25
+ "@kong/kongponents": "9.64.14",
26
+ "vue": "^3.5.41"
27
27
  },
28
28
  "repository": {
29
29
  "type": "git",
@@ -43,9 +43,9 @@
43
43
  "errorLimit": "500KB"
44
44
  },
45
45
  "peerDependencies": {
46
+ "@kong-ui-public/i18n": "^2.5.1",
46
47
  "@kong/kongponents": "^9.63.0",
47
- "vue": "^3.5.35",
48
- "@kong-ui-public/i18n": "^2.5.1"
48
+ "vue": "^3.5.35"
49
49
  },
50
50
  "dependencies": {
51
51
  "ag-grid-community": "^36.1.0",