@kong-ui-public/table-data-grid 0.1.1 → 0.1.3-pr.3447.ad53a8928.0

package/README.md

@@ -2,21 +2,55 @@
 
 Reusable Vue wrapper around AG Grid for Kong table data grids.
 
-This initial package version supports a basic infinite-placeholder fetcher and AG Grid rendering.
+This package currently supports AG Grid infinite row loading with a cursor-first
+fetcher contract, basic column definitions, empty/error presentation states, and
+state lifecycle emits.
+
+## Peer Dependencies
+
+Consumers must provide `vue` and `@kong/kongponents`. The host app should
+register Kongponents and load its styles because TableDataGrid presentation
+states render Kongponents components.
+
+```ts
+import Kongponents from '@kong/kongponents'
+import '@kong/kongponents/dist/style.css'
+
+app.use(Kongponents)
+```
 
 ## Usage
 
 ```vue
 <template>
+  <KButton @click="refreshRows">
+    Refresh rows
+  </KButton>
+
   <TableDataGrid
     :fetcher="fetchRows"
     :headers="headers"
-    @grid:ready="onGridReady"
-  />
+    :page-size="25"
+    :refresh-key="refreshKey"
+    @state="handleState"
+  >
+    <template #empty-state>
+      <KEmptyState
+        message="Try changing filters or refreshing the dataset."
+        title="No rows found"
+      />
+    </template>
+  </TableDataGrid>
 </template>
 
 <script setup lang="ts">
-import type { TableDataGridFetcher, TableDataGridHeader } from '@kong-ui-public/table-data-grid'
+import type {
+  TableDataGridFetcher,
+  TableDataGridHeader,
+  TableDataGridInfiniteFetcherParams,
+  TableDataGridStatePayload,
+} from '@kong-ui-public/table-data-grid'
+import { ref } from 'vue'
 import { TableDataGrid } from '@kong-ui-public/table-data-grid'
 
 type Row = {
@@ -30,14 +64,32 @@ const headers: Array<TableDataGridHeader<Row>> = [
   { key: 'status', label: 'Status' },
 ]
 
-const rows: Row[] = [
-  { id: 'row-1', name: 'Gateway service', status: 'Active' },
-]
+const refreshKey = ref(0)
+const lastState = ref<TableDataGridStatePayload>()
+
+const fetchRows: TableDataGridFetcher<Row> = async ({
+  pageSize,
+  cursor,
+}: TableDataGridInfiniteFetcherParams) => {
+  const response = await getRows({
+    size: pageSize,
+    cursor,
+  })
+
+  return {
+    data: response.data,
+    cursor: response.cursor,
+    hasMore: response.hasMore,
+  }
+}
+
+const refreshRows = () => {
+  refreshKey.value += 1
+}
 
-const fetchRows: TableDataGridFetcher<Row> = async ({ offset = 0, pageSize }) => ({
-  data: rows.slice(offset, offset + pageSize),
-  total: rows.length,
-})
+const handleState = (payload: TableDataGridStatePayload) => {
+  lastState.value = payload
+}
 </script>
 ```
 
@@ -46,61 +98,128 @@ const fetchRows: TableDataGridFetcher<Row> = async ({ offset = 0, pageSize }) =>
 | Prop | Type | Required | Default | Notes |
 | --- | --- | --- | --- | --- |
 | `headers` | `Array<TableDataGridHeader<Row>>` | Yes | - | Basic column definitions mapped to AG Grid columns. |
-| `fetcher` | `TableDataGridFetcher<Row>` | Yes | - | Async row loader called with the initial infinite-placeholder fetch params. |
-| `pageSize` | `number` | No | `25` | Page size sent to the basic fetcher. No pagination controls are rendered in this PR. |
-| `agGridOptions` | `TableDataGridGridOptions<Row>` | No | `{}` | Pass-through for lower-level AG Grid options. Keep this narrow until the package owns more grid behavior. |
+| `fetcher` | `TableDataGridFetcher<Row>` | Yes | - | Async row loader called by the AG Grid infinite datasource. |
+| `error` | `boolean` | No | `false` | Host-controlled visible error state. Internal fetch failures emit state but do not render error UI unless this prop is true. |
+| `pageSize` | `number` | No | `25` | AG Grid cache block size and fetcher request size. |
+| `refreshKey` | `string \| number \| boolean` | No | - | Parent invalidation signal that rebuilds the datasource from the beginning. |
 
 ## Fetcher Contract
 
-The initial fetcher uses the package's future infinite-scroll-oriented shape but only performs the first fetch.
+`TableDataGrid` uses AG Grid's infinite row model internally. The public fetcher
+receives only the stable cursor-first request shape:
 
 ```ts
-type TableDataGridFetcherParams = {
+type TableDataGridInfiniteFetcherParams = {
   mode: 'infinite'
-  cursor?: unknown
-  offset?: number
   pageSize: number
+  cursor?: unknown
 }
 
 type TableDataGridFetcherResult<Row> = {
   data: Row[]
+  cursor?: unknown
   total?: number
+  hasMore?: boolean
 }
 
 type TableDataGridFetcher<Row> = (
-  params: TableDataGridFetcherParams,
+  params: TableDataGridInfiniteFetcherParams,
 ) => Promise<TableDataGridFetcherResult<Row>>
 ```
 
-`offset` is the numeric starting row for offset/limit APIs. `cursor` is an opaque positioning token for cursor-based APIs. These fields are optional because consumers generally use one positioning model or the other. This initial version passes `offset: 0` for a single fetch; real infinite-scroll sequencing will be added later.
+`cursor` is an opaque token returned by the previous response. The first request
+uses `cursor: undefined`; later requests receive the previous response cursor.
+
+AG Grid range details are datasource internals. Consumers should not depend on,
+or return, datasource request positions or AG Grid row-count callback values in
+the public fetcher contract.
+
+`total` gives AG Grid an explicit row count when the backend knows it. If `total`
+is omitted, `hasMore: false` or a response shorter than `pageSize` marks the last
+loaded row as the end of the dataset.
+
+## Refresh Behavior
+
+`refreshKey` is a parent-owned invalidation signal. Changing it rebuilds the
+infinite datasource, clears stored cursors, and starts again from the first
+block with `cursor: undefined`.
+
+This reset is required for cursor APIs because cursor values are only valid
+relative to the response and query chain that produced them. Reusing a later
+cursor after the parent changes request context could fetch the wrong rows.
+
+## Presentation States
+
+`TableDataGrid` keeps the grid mounted while internal fetches are running so AG
+Grid can request rows and show its own loading treatment.
+
+Visible error UI is host-controlled through the `error` prop. A rejected fetch
+emits an error state, but it does not render error chrome by itself.
+
+An empty state renders after the first successful block resolves with no rows.
+Use the `empty-state` slot to replace the default empty content. Use the
+`error-state` slot to replace the default host-controlled error content.
+
+```vue
+<TableDataGrid
+  :error="showError"
+  :fetcher="fetchRows"
+  :headers="headers"
+>
+  <template #empty-state>
+    <KEmptyState
+      message="Adjust the source data and refresh."
+      title="No matching rows"
+    />
+  </template>
+
+  <template #error-state>
+    <KEmptyState
+      icon-variant="error"
+      message="Refresh or try again later."
+      title="Rows could not be loaded"
+    />
+  </template>
+</TableDataGrid>
+```
 
 ## Header Options
 
+Columns without a `width` or `maxWidth` fill the available table width by
+default. Use `width` for an explicit initial pixel width, `minWidth` for a
+lower bound on either flexible or fixed columns, and `maxWidth` when a column
+should opt out of the default flexible fill behavior.
+
 | Field | Type | Required | Notes |
 | --- | --- | --- | --- |
 | `key` | `Extract<keyof Row, string>` | Yes | Row property read for the cell value and used as the AG Grid column id. |
 | `label` | `string` | Yes | Header label rendered by AG Grid. |
-| `width` | `number` | No | Initial AG Grid column width in pixels. |
-| `minWidth` | `number` | No | Minimum AG Grid column width in pixels. |
-| `maxWidth` | `number` | No | Maximum AG Grid column width in pixels. |
+| `width` | `number` | No | Explicit initial AG Grid column width in pixels. Columns with `width` do not receive default flex sizing. |
+| `minWidth` | `number` | No | Minimum AG Grid column width in pixels. Columns with only `minWidth` still fill available width by default. |
+| `maxWidth` | `number` | No | Maximum AG Grid column width in pixels. Columns with `maxWidth` do not receive default flex sizing. |
 
 ## Events
 
 | Event | Payload | When it fires |
 | --- | --- | --- |
 | `grid:ready` | `GridApi<Row>` | AG Grid is ready. |
+| `state` | `{ state: 'loading' \| 'success' \| 'error', hasData: boolean }` | Internal fetch lifecycle changes after the datasource starts requesting rows. |
 
 ## Slots
 
-No slots are part of the initial public contract.
+| Slot | Purpose |
+| --- | --- |
+| `empty-state` | Replaces the default empty state after a successful empty first block. |
+| `error-state` | Replaces the default visible error state when `error` is true. |
 
 ## Exports
 
 - `TableDataGrid`
 - `TableDataGridMode`
+- `TableDataGridState`
+- `TableDataGridStatePayload`
 - `TableDataGridHeader`
-- `TableDataGridFetcherParams`
+- `TableDataGridInfiniteFetcherParams`
 - `TableDataGridFetcherResult`
 - `TableDataGridFetcher`
-- `TableDataGridGridOptions`
 - `TableDataGridReadyPayload`

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kong-ui-public/table-data-grid",
-  "version": "0.1.1",
+  "version": "0.1.3-pr.3447.ad53a8928.0",
   "type": "module",
   "main": "./dist/table-data-grid.umd.js",
   "module": "./dist/table-data-grid.es.js",
@@ -21,7 +21,9 @@
     "access": "public"
   },
   "devDependencies": {
-    "vue": "^3.5.35"
+    "@kong/kongponents": "9.59.0",
+    "vue": "^3.5.35",
+    "@kong-ui-public/i18n": "^2.4.6"
   },
   "repository": {
     "type": "git",
@@ -41,7 +43,9 @@
     "errorLimit": "500KB"
   },
   "peerDependencies": {
-    "vue": "^3.5.35"
+    "@kong/kongponents": "^9.59.0",
+    "vue": "^3.5.35",
+    "@kong-ui-public/i18n": "^2.4.6"
   },
   "dependencies": {
     "ag-grid-community": "^34.3.1",

package/dist/style.css

@@ -1 +0,0 @@
-.kong-ui-public-table-data-grid[data-v-d6e38335]{border:1px solid #e0e4ea;border:1px solid var(--kui-color-border, #e0e4ea);border-radius:4px;border-radius:var(--kui-border-radius-20, 4px);display:flex;flex-direction:column;min-height:360px;overflow:hidden;width:100%}.table-data-grid-grid[data-v-d6e38335]{--ag-background-color: var(--kui-color-background, #ffffff);--ag-border-color: var(--kui-color-border, #e0e4ea);--ag-header-background-color: var(--kui-color-background, #ffffff);--ag-header-column-border: 1px solid var(--kui-color-border, #e0e4ea);--ag-header-column-resize-handle-color: transparent;--ag-wrapper-border: none;--ag-wrapper-border-radius: 0;flex:1 1 360px;min-height:360px;width:100%}.ag-cell{align-items:center;display:flex}

package/dist/table-data-grid.es.js

@@ -1,73 +0,0 @@
-import { defineComponent as g, shallowRef as h, ref as p, computed as v, watch as y, toRef as n, openBlock as w, createElementBlock as b, createVNode as G, unref as l } from "vue";
-import { AgGridVue as k } from "ag-grid-vue3";
-import { ModuleRegistry as D, AllCommunityModule as x, themeQuartz as z } from "ag-grid-community";
-const R = {
-  class: "kong-ui-public-table-data-grid",
-  "data-testid": "table-data-grid"
-}, I = /* @__PURE__ */ g({
-  __name: "TableDataGrid",
-  props: {
-    headers: {},
-    fetcher: { type: Function },
-    pageSize: { default: 25 },
-    agGridOptions: { default: () => ({}) }
-  },
-  emits: ["grid:ready"],
-  setup(t, { emit: c }) {
-    D.registerModules([x]);
-    const r = c, o = h([]), a = p(0), s = v(() => t.headers.map((e) => ({
-      colId: e.key,
-      headerName: e.label,
-      maxWidth: e.maxWidth,
-      minWidth: e.minWidth,
-      valueGetter: (f) => {
-        var d;
-        return (d = f.data) == null ? void 0 : d[e.key];
-      },
-      width: e.width
-    }))), u = async () => {
-      const e = a.value + 1;
-      a.value = e;
-      try {
-        const i = await t.fetcher({
-          mode: "infinite",
-          offset: 0,
-          pageSize: t.pageSize
-        });
-        e === a.value && (o.value = i.data);
-      } catch (i) {
-        e === a.value && (o.value = []), console.error(i);
-      }
-    }, m = (e) => {
-      r("grid:ready", e.api);
-    };
-    return y(
-      [
-        n(() => t.fetcher),
-        n(() => t.pageSize)
-      ],
-      () => {
-        u();
-      },
-      { immediate: !0 }
-    ), (e, i) => (w(), b("div", R, [
-      G(l(k), {
-        class: "table-data-grid-grid",
-        "column-defs": s.value,
-        "grid-options": t.agGridOptions,
-        "row-data": o.value,
-        "suppress-cell-focus": !0,
-        theme: l(z),
-        onGridReady: m
-      }, null, 8, ["column-defs", "grid-options", "row-data", "theme"])
-    ]));
-  }
-}), S = (t, c) => {
-  const r = t.__vccOpts || t;
-  for (const [o, a] of c)
-    r[o] = a;
-  return r;
-}, O = /* @__PURE__ */ S(I, [["__scopeId", "data-v-d6e38335"]]);
-export {
-  O as TableDataGrid
-};

package/dist/table-data-grid.umd.js

@@ -1 +0,0 @@
-(function(i,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue"),require("ag-grid-vue3"),require("ag-grid-community")):typeof define=="function"&&define.amd?define(["exports","vue","ag-grid-vue3","ag-grid-community"],e):(i=typeof globalThis<"u"?globalThis:i||self,e(i["kong-ui-public-table-data-grid"]={},i.Vue,i.AgGridVue,i.agGridCommunity))})(this,function(i,e,l,c){"use strict";const f={class:"kong-ui-public-table-data-grid","data-testid":"table-data-grid"},m=((a,s)=>{const r=a.__vccOpts||a;for(const[d,o]of s)r[d]=o;return r})(e.defineComponent({__name:"TableDataGrid",props:{headers:{},fetcher:{type:Function},pageSize:{default:25},agGridOptions:{default:()=>({})}},emits:["grid:ready"],setup(a,{emit:s}){c.ModuleRegistry.registerModules([c.AllCommunityModule]);const r=s,d=e.shallowRef([]),o=e.ref(0),g=e.computed(()=>a.headers.map(t=>({colId:t.key,headerName:t.label,maxWidth:t.maxWidth,minWidth:t.minWidth,valueGetter:y=>{var u;return(u=y.data)==null?void 0:u[t.key]},width:t.width}))),p=async()=>{const t=o.value+1;o.value=t;try{const n=await a.fetcher({mode:"infinite",offset:0,pageSize:a.pageSize});t===o.value&&(d.value=n.data)}catch(n){t===o.value&&(d.value=[]),console.error(n)}},h=t=>{r("grid:ready",t.api)};return e.watch([e.toRef(()=>a.fetcher),e.toRef(()=>a.pageSize)],()=>{p()},{immediate:!0}),(t,n)=>(e.openBlock(),e.createElementBlock("div",f,[e.createVNode(e.unref(l.AgGridVue),{class:"table-data-grid-grid","column-defs":g.value,"grid-options":a.agGridOptions,"row-data":d.value,"suppress-cell-focus":!0,theme:e.unref(c.themeQuartz),onGridReady:h},null,8,["column-defs","grid-options","row-data","theme"])]))}}),[["__scopeId","data-v-d6e38335"]]);i.TableDataGrid=m,Object.defineProperty(i,Symbol.toStringTag,{value:"Module"})});

package/dist/types/components/TableDataGrid.vue.d.ts

@@ -1,28 +0,0 @@
-import type { TableDataGridFetcher, TableDataGridGridOptions, TableDataGridHeader } from '../types';
-import type { GridReadyEvent } from 'ag-grid-community';
-declare const __VLS_export: <Row extends object>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
-    props: import("vue").PublicProps & __VLS_PrettifyLocal<{
-        headers: Array<TableDataGridHeader<Row>>;
-        fetcher: TableDataGridFetcher<Row>;
-        pageSize?: number;
-        agGridOptions?: TableDataGridGridOptions<Row>;
-    } & {
-        "onGrid:ready"?: ((api: import("ag-grid-community").GridApi<Row>) => any) | undefined;
-    }> & (typeof globalThis extends {
-        __VLS_PROPS_FALLBACK: infer P;
-    } ? P : {});
-    expose: (exposed: {}) => void;
-    attrs: any;
-    slots: {};
-    emit: (e: "grid:ready", api: GridReadyEvent<Row>["api"]) => void;
-}>) => import("vue").VNode & {
-    __ctx?: Awaited<typeof __VLS_setup>;
-};
-declare const _default: typeof __VLS_export;
-export default _default;
-type __VLS_PrettifyLocal<T> = (T extends any ? {
-    [K in keyof T]: T[K];
-} : {
-    [K in keyof T as K]: T[K];
-}) & {};
-//# sourceMappingURL=TableDataGrid.vue.d.ts.map

package/dist/types/components/TableDataGrid.vue.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"TableDataGrid.vue.d.ts","sourceRoot":"","sources":["../../../src/components/TableDataGrid.vue"],"names":[],"mappings":"AAuIA,OAAO,KAAK,EACV,oBAAoB,EACpB,wBAAwB,EACxB,mBAAmB,EACpB,MAAM,UAAU,CAAA;AACjB,OAAO,KAAK,EAAU,cAAc,EAAE,MAAM,mBAAmB,CAAA;AAK/D,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;WA8IO,OAAO,KAAK,EAAE,WAAW,GAAG,mBAAmB,CAAC;iBA1I7C,KAAK,CAAC,mBAAmB,CAAC,GAAG,CAAC,CAAC;iBAC/B,oBAAoB,CAAC,GAAG,CAAC;mBACvB,MAAM;wBACD,wBAAwB,CAAC,GAAG,CAAC;;;KAuI4C,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;WACH,EAAE;cA/HJ,YAAY,OAAO,cAAc,CAAC,GAAG,CAAC,CAAC,KAAK,CAAC,KAAG,IAAI;EAkItD,KACQ,OAAO,KAAK,EAAE,KAAK,GAAG;IAAE,KAAK,CAAC,EAAE,OAAO,CAAC,OAAO,WAAW,CAAC,CAAA;CAAI,CAAC;wBACvD,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"}

package/dist/types/index.d.ts

@@ -1,4 +0,0 @@
-import TableDataGrid from './components/TableDataGrid.vue';
-export { TableDataGrid };
-export * from './types';
-//# sourceMappingURL=index.d.ts.map

package/dist/types/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,aAAa,MAAM,gCAAgC,CAAA;AAE1D,OAAO,EAAE,aAAa,EAAE,CAAA;AAExB,cAAc,SAAS,CAAA"}

package/dist/types/types/index.d.ts

@@ -1,30 +0,0 @@
-import type { GridApi, GridOptions } from 'ag-grid-community';
-export type TableDataGridMode = 'infinite';
-export type TableDataGridHeader<Row extends object = Record<string, unknown>> = {
-    key: Extract<keyof Row, string>;
-    label: string;
-    width?: number;
-    minWidth?: number;
-    maxWidth?: number;
-};
-type TableDataGridCursorParams = {
-    cursor?: unknown;
-    offset?: never;
-};
-type TableDataGridOffsetParams = {
-    cursor?: never;
-    offset?: number;
-};
-export type TableDataGridFetcherParams = {
-    mode: TableDataGridMode;
-    pageSize: number;
-} & (TableDataGridCursorParams | TableDataGridOffsetParams);
-export type TableDataGridFetcherResult<Row extends object = Record<string, unknown>> = {
-    data: Row[];
-    total?: number;
-};
-export type TableDataGridFetcher<Row extends object = Record<string, unknown>> = (params: TableDataGridFetcherParams) => Promise<TableDataGridFetcherResult<Row>>;
-export type TableDataGridGridOptions<Row extends object = Record<string, unknown>> = GridOptions<Row>;
-export type TableDataGridReadyPayload<Row extends object = Record<string, unknown>> = GridApi<Row>;
-export {};
-//# sourceMappingURL=index.d.ts.map

package/dist/types/types/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/types/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAA;AAE7D,MAAM,MAAM,iBAAiB,GAAG,UAAU,CAAA;AAE1C,MAAM,MAAM,mBAAmB,CAAC,GAAG,SAAS,MAAM,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,IAAI;IAC9E,GAAG,EAAE,OAAO,CAAC,MAAM,GAAG,EAAE,MAAM,CAAC,CAAA;IAC/B,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAA;CAClB,CAAA;AAED,KAAK,yBAAyB,GAAG;IAC/B,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,MAAM,CAAC,EAAE,KAAK,CAAA;CACf,CAAA;AAED,KAAK,yBAAyB,GAAG;IAC/B,MAAM,CAAC,EAAE,KAAK,CAAA;IACd,MAAM,CAAC,EAAE,MAAM,CAAA;CAChB,CAAA;AAED,MAAM,MAAM,0BAA0B,GAAG;IACvC,IAAI,EAAE,iBAAiB,CAAA;IACvB,QAAQ,EAAE,MAAM,CAAA;CACjB,GAAG,CAAC,yBAAyB,GAAG,yBAAyB,CAAC,CAAA;AAE3D,MAAM,MAAM,0BAA0B,CAAC,GAAG,SAAS,MAAM,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,IAAI;IACrF,IAAI,EAAE,GAAG,EAAE,CAAA;IACX,KAAK,CAAC,EAAE,MAAM,CAAA;CACf,CAAA;AAED,MAAM,MAAM,oBAAoB,CAAC,GAAG,SAAS,MAAM,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,IAAI,CAC/E,MAAM,EAAE,0BAA0B,KAC/B,OAAO,CAAC,0BAA0B,CAAC,GAAG,CAAC,CAAC,CAAA;AAE7C,MAAM,MAAM,wBAAwB,CAAC,GAAG,SAAS,MAAM,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,IAAI,WAAW,CAAC,GAAG,CAAC,CAAA;AAErG,MAAM,MAAM,yBAAyB,CAAC,GAAG,SAAS,MAAM,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,IAAI,OAAO,CAAC,GAAG,CAAC,CAAA"}