tablevu 0.2.22 → 0.3.0-beta.1

package/dist/tablevu-index.esm.js

@@ -0,0 +1,1076 @@
+import { h, reactive, watch, onMounted, ref } from 'vue';
+
+function adaptArray(props, data) {
+    const d = Array.isArray(data) ? [...data] : [];
+    return new Promise((resolve, reject) => {
+        try {
+            // Filter & Search //
+            if (props.filter || props.search) {
+                const searchableCols = props.cols
+                    ?.map((m, i) => ({ index: i, searchable: m.searchable !== false }))
+                    .filter(q => q.searchable)
+                    .map(m => m.index) || [];
+                let filtered = d;
+                if (props.filter) {
+                    filtered = filtered.filter(row => {
+                        return Object.entries(props.filter).every(([key, value]) => {
+                            return row[key] === value;
+                        });
+                    });
+                }
+                if (props.search && searchableCols.length > 0) {
+                    const searchLower = props.search.toLowerCase();
+                    filtered = filtered.filter(row => {
+                        return searchableCols.some(colIndex => {
+                            const col = props.cols?.[colIndex];
+                            if (!col)
+                                return false;
+                            const val = row[col.name];
+                            return val && String(val).toLowerCase().includes(searchLower);
+                        });
+                    });
+                }
+                // Update d with filtered results
+                d.length = 0;
+                d.push(...filtered);
+            }
+            // Sort //
+            if (props.sort && props.sort.length > 0) {
+                for (let i = props.sort.length - 1; i >= 0; i--) {
+                    const s = props.sort[i];
+                    let field;
+                    if (s.index !== undefined && s.index >= 0 && props.cols?.[s.index]) {
+                        field = props.cols[s.index].name;
+                    }
+                    else {
+                        field = s.name || '';
+                    }
+                    if (!field)
+                        continue;
+                    const dir = s.dir === 'desc' ? -1 : 1;
+                    d.sort((a, b) => {
+                        const av = a[field];
+                        const bv = b[field];
+                        if (av === bv)
+                            return 0;
+                        if (av === null || av === undefined)
+                            return 1;
+                        if (bv === null || bv === undefined)
+                            return -1;
+                        return (av > bv ? 1 : -1) * dir;
+                    });
+                }
+            }
+            // Paging //
+            let result = d;
+            if (props.pageSize && props.pageSize > 0) {
+                const start = (props.currPage - 1) * props.pageSize;
+                const end = props.currPage * props.pageSize;
+                result = d.slice(start, end);
+            }
+            resolve({ rows: result, count: d.length });
+        }
+        catch (err) {
+            reject(err);
+        }
+    });
+}
+
+const TablevuStatus = {
+    Error: -1,
+    Ready: 0,
+    Loading: 1
+};
+const tablevu = {
+    props: {
+        settings: { type: Object, default: null },
+        data: { type: [Array, Function] },
+        group: { type: [String, Object] },
+        search: { type: String },
+        filter: { type: [Array, Object] },
+        command: { type: Array, default: () => [] },
+        rowid: { type: String },
+        onRowClick: { type: Function },
+        onRowDblClick: { type: Function },
+        class: { type: String, default: 'table' },
+        style: { type: String, default: null }
+    },
+    emits: ['onRowClick', 'onRowDblClick'],
+    setup(props, { attrs, slots, emit, expose }) {
+        let rows = [];
+        let rowg = [];
+        let grps = [];
+        let adapter = null;
+        let timer = null;
+        const spec = reactive({
+            caption: null,
+            group: {
+                value: (props.settings && props.settings.group) ? props.settings.group.value : props.group ? props.group : null,
+                content: (props.settings && props.settings.group) ? props.settings.group.content : null,
+                expandAll: true,
+                class: 'table-light'
+            },
+            page: {
+                count: 0,
+                size: (props.settings && props.settings.page) ? props.settings.page.size : 0,
+                current: 0,
+                type: null
+            },
+            sort: (props.settings && props.settings.sort) ? props.settings.sort : [],
+            columns: (props.settings && props.settings.columns) ? props.settings.columns : [],
+            footer: {
+                button: {
+                    class: (props.settings && props.settings.footer && props.settings.footer.button && props.settings.footer.button.class) || 'btn'
+                }
+            },
+            status: TablevuStatus.Ready,
+            time: null,
+            search: null,
+            filter: null,
+            onData: (props.settings && props.settings.onData) ? props.settings.onData : undefined
+        });
+        if (props.data) {
+            if (Array.isArray(props.data)) {
+                adapter = adaptArray;
+            }
+            else {
+                adapter = props.data;
+            }
+        }
+        if (props.search)
+            spec.search = props.search;
+        watch(() => props.search, (n, o) => {
+            const x = parseInt(String(props.settings?.searchMinChar)) || 3;
+            if (timer) {
+                clearTimeout(timer);
+                timer = null;
+            }
+            if (n && n.length > x) {
+                spec.search = n;
+                timer = setTimeout(() => { refresh(); timer = null; }, 444);
+            }
+            else if (o && o.length > x && (n == undefined || n == null || n.length <= x)) {
+                spec.search = null;
+                timer = setTimeout(() => { refresh(); timer = null; }, 444);
+            }
+        });
+        if (props.filter)
+            spec.filter = props.filter;
+        watch(() => props.filter, () => {
+            if (props.filter)
+                spec.filter = props.filter;
+            else
+                spec.filter = null;
+            refresh();
+        }, { deep: true });
+        watch(() => props.command, (n, o) => {
+            if (n && n.length > 0) {
+                const c = props.command[n.length - 1];
+                if (c && c.name) {
+                    switch (c.name.toLowerCase()) {
+                        case 'refresh':
+                            refresh();
+                            break;
+                        case 'first':
+                            first();
+                            break;
+                        case 'prior':
+                            prior();
+                            break;
+                        case 'next':
+                            next();
+                            break;
+                        case 'last':
+                            last();
+                            break;
+                        default: console.log('Unknown command');
+                    }
+                }
+                props.command.length = 0;
+            }
+        }, { deep: true });
+        function prepareGroup(g, r) {
+            grps = [];
+            rowg = [];
+            for (let i = 0; i < r.length; i++) {
+                let v = null;
+                let c = null;
+                const o = r[i];
+                if (g.value) {
+                    if (typeof g.value == 'function')
+                        v = g.value(o);
+                    else
+                        v = o[g.value];
+                }
+                else if (typeof g == 'function') {
+                    v = g(o);
+                }
+                else {
+                    if (typeof g == 'bigint' || typeof g == 'number') {
+                        const l = parseFloat(String(g));
+                        if (l)
+                            v = o[l];
+                    }
+                    else if (typeof g == 'string')
+                        v = o[g];
+                }
+                if (g.content) {
+                    if (typeof g.content == 'function')
+                        c = g.content(o);
+                    else
+                        c = o[g.content];
+                }
+                let n = grps.findIndex(f => f.group == v);
+                if (n == -1) {
+                    n = grps.push({ group: v, content: c, expand: spec.group.expandAll }) - 1;
+                }
+                rowg.push(n);
+            }
+        }
+        function first() { page(1); }
+        function prior() {
+            if (spec.page.current > 1) {
+                page(spec.page.current - 1);
+            }
+            else {
+                page(spec.page.current);
+            }
+        }
+        function next() { page(spec.page.current + 1); }
+        function last() { page(spec.page.count); }
+        function go() {
+            let p;
+            let g = spec.page.current;
+            do {
+                p = prompt(undefined, String(spec.page.current));
+                g = parseInt(p || '0');
+            } while (p && isNaN(g));
+            if (g && g > 0 && g != spec.page.current)
+                page(g);
+        }
+        function refresh() { page(spec.page.current); }
+        function orderby(ind, dir) {
+            if (spec.sort && spec.sort.length > 0) {
+                let l = spec.sort.findIndex(f => f.index == ind);
+                if (l < 0) {
+                    let n = spec.columns[ind]?.name;
+                    l = spec.sort.findIndex(f => f.name == n);
+                }
+                if (l == 0) {
+                    spec.sort[l].dir = dir ? dir : (spec.sort[0].dir ? null : 'desc');
+                }
+                else if (l > 0) {
+                    spec.sort.splice(l, 1);
+                }
+                if (l != 0) {
+                    spec.sort.unshift({ index: ind, dir: dir ? dir : null });
+                }
+                if (spec.sort.length > 2) {
+                    spec.sort.pop();
+                }
+            }
+            else {
+                spec.sort.push({ index: ind, dir: dir ? dir : null });
+            }
+            page(spec.page.current);
+        }
+        function page(currentPage) {
+            let dat = null;
+            if (props.data) {
+                if (Array.isArray(props.data))
+                    dat = props.data;
+            }
+            else
+                return;
+            spec.status = TablevuStatus.Loading;
+            if (adapter) {
+                adapter({
+                    pageSize: spec.page.size,
+                    currPage: currentPage,
+                    sort: spec.sort,
+                    cols: spec.columns,
+                    filter: spec.filter,
+                    search: spec.search
+                }, dat).then(ada => {
+                    if (spec.onData)
+                        rows = spec.onData(ada.rows);
+                    else
+                        rows = ada.rows;
+                    const groupValue = spec.group.value;
+                    if (groupValue && (typeof groupValue == 'string' || typeof groupValue == 'number' || typeof groupValue == 'bigint' || (typeof groupValue == 'object' && groupValue.value)))
+                        prepareGroup(spec.group, rows);
+                    spec.page.count = (ada.count > 0 && spec.page.size > 0) ? Math.ceil(ada.count / spec.page.size) : 0;
+                    spec.page.current = currentPage;
+                    spec.status = TablevuStatus.Ready;
+                    spec.time = Date.now();
+                }).catch(err => {
+                    console.error(err);
+                    spec.status = TablevuStatus.Error;
+                });
+            }
+        }
+        function renderValue(col, val) {
+            if (val) {
+                let v;
+                if (col.type == 'datetime' || col.type == 'date' || col.type == 'time') {
+                    const t = new Date(val);
+                    if (col.type == 'date')
+                        v = t.toLocaleDateString();
+                    else if (col.type == 'time')
+                        v = t.toLocaleTimeString();
+                    else
+                        v = t.toLocaleString();
+                }
+                else {
+                    if (col.type == 'numeric') {
+                        v = parseFloat(val);
+                    }
+                    else {
+                        if (col.type == 'integer') {
+                            v = parseInt(val);
+                        }
+                        else
+                            v = val;
+                    }
+                }
+                return v;
+            }
+            else
+                return '';
+        }
+        function renderCell(col, val) {
+            const o = { style: {} };
+            if (col.colspan && col.colspan > 1)
+                o.colspan = col.colspan;
+            if (col.style)
+                o.style = { ...o.style, ...col.style };
+            if (col.align)
+                o.style['text-align'] = col.align;
+            if (col.width)
+                o.style['max-width'] = col.width;
+            const v = renderValue(col, val);
+            return h('td', o, v);
+        }
+        function renderCustomCell(col, row) {
+            const o = { style: {} };
+            if (col.colspan && col.colspan > 1)
+                o.colspan = col.colspan;
+            if (col.style)
+                o.style = { ...o.style, ...col.style };
+            if (col.align)
+                o.style['text-align'] = col.align;
+            if (col.width)
+                o.style['max-width'] = col.width;
+            const f = col.render(row);
+            return h('td', o, f);
+        }
+        function renderGroup(grp) {
+            const b = h('button', {
+                title: String(grp.expand),
+                onClick: (event) => {
+                    grp.expand = !grp.expand;
+                    event.currentTarget.value = grp.expand ? '▼' : '►';
+                    spec.time = Date.now();
+                    event.preventDefault();
+                },
+                style: { padding: 0, margin: '0 6px 0 0', width: '12px', height: '100%', border: 'none', outline: '0', backgroundColor: 'transparent' }
+            }, grp.expand ? '▼' : '►');
+            const v = grp.content || grp.group;
+            return h('tr', {}, h('td', { colspan: spec.columns.length, class: spec.group.class }, [b, v]));
+        }
+        function renderRow(index, row) {
+            const o = { key: index, index: index };
+            if (props.rowid)
+                o.rowid = row[props.rowid];
+            const r = [];
+            for (let i = 0; i < spec.columns.length; i++) {
+                const c = spec.columns[i];
+                if (c.render) {
+                    r.push(renderCustomCell(c, row));
+                }
+                else {
+                    let v;
+                    if (c.depth) {
+                        v = row;
+                        for (let j = 0; j < c.depth.length; j++) {
+                            if (v)
+                                v = v[c.depth[j]];
+                        }
+                    }
+                    else {
+                        v = row[c.name];
+                    }
+                    r.push(renderCell(c, v));
+                }
+            }
+            o.ondblclick = (event) => {
+                const target = event.currentTarget;
+                const idx = target.getAttribute('index');
+                if (idx !== null) {
+                    const rowData = rows[parseInt(idx)];
+                    emit('onRowDblClick', event, rowData);
+                }
+            };
+            if (props.onRowClick) {
+                o.onClick = (event) => {
+                    const target = event.currentTarget;
+                    const idx = target.getAttribute('index');
+                    if (idx !== null) {
+                        const rowData = rows[parseInt(idx)];
+                        props.onRowClick(event, rowData);
+                    }
+                };
+            }
+            return h('tr', o, r);
+        }
+        function renderHeader() {
+            const ar = [];
+            for (let i = 0; i < spec.columns.length; i++) {
+                const cl = [];
+                if (spec.columns[i].label)
+                    cl.push(h('span', spec.columns[i].label));
+                else
+                    cl.push(h('span', spec.columns[i].name));
+                if (spec.sort && spec.sort.length > 0 && spec.sort[0].index == i) {
+                    if (spec.sort[0].dir == 'desc')
+                        cl.push(h('span', { style: { float: 'right' } }, '▼'));
+                    else
+                        cl.push(h('span', { style: { float: 'right' } }, '▲'));
+                }
+                const ch = { position: 'relative' };
+                if (spec.columns[i].width) {
+                    ch.width = spec.columns[i].width;
+                    ch.minWidth = spec.columns[i].width;
+                    ch.maxWidth = spec.columns[i].width;
+                }
+                const cy = { display: 'block', 'font-weight': 500, textDecoration: 'none', textAlign: 'center' };
+                let a;
+                let f;
+                if (spec.columns[i].popup) {
+                    const r = ref(null);
+                    const c = [
+                        h('a', { href: '#', onClick: (event) => { orderby(i); event.preventDefault(); }, style: { display: 'block', textDecoration: 'none', color: 'black', fontWeight: 'initial', padding: '.25rem' } }, 'Order by Ascending'),
+                        h('a', { href: '#', onClick: (event) => { orderby(i, 'desc'); event.preventDefault(); }, style: { display: 'block', textDecoration: 'none', color: 'black', fontWeight: 'initial', padding: '.25rem' } }, 'Order by Descending'),
+                    ];
+                    a = h('a', {
+                        href: '#',
+                        onClick: (event) => {
+                            if (r.value && r.value.style && r.value.style.display && r.value.style.display == 'block')
+                                r.value.style.display = 'none';
+                            else if (r.value && r.value.style)
+                                r.value.style.display = 'block';
+                            event.preventDefault();
+                        },
+                        style: cy
+                    }, cl);
+                    f = h('div', {
+                        ref: r,
+                        style: { position: 'absolute', display: 'none', width: spec.columns[i].width || '12rem', height: 'fit-content', border: '1px solid lightgray', backgroundColor: 'whitesmoke', zIndex: 1, left: 0, top: '2rem', bottom: 0, right: 0, padding: '.25rem' }
+                    }, c);
+                }
+                else
+                    a = h('a', { href: '#', onClick: (event) => { orderby(i); event.preventDefault(); }, style: cy }, cl);
+                if (spec.columns[i].filter) ;
+                ar.push(h('th', { colspan: null, style: ch }, [a, f]));
+            }
+            const tr = h('tr', {}, ar);
+            return [tr];
+        }
+        function renderBody() {
+            const dr = [];
+            if (rows && rows.length > 0) {
+                if (grps && grps.length > 0) {
+                    const r = [];
+                    for (let g = 0; g < grps.length; g++)
+                        r.push({ index: g, childs: [] });
+                    for (let i = 0; i < rows.length; i++) {
+                        const x = rowg[i];
+                        r[x].childs.push(renderRow(i, rows[i]));
+                    }
+                    for (let g = 0; g < grps.length; g++) {
+                        dr.push(renderGroup(grps[g]));
+                        if (grps[g].expand)
+                            dr.push(r[g].childs);
+                    }
+                }
+                else {
+                    for (let i = 0; i < rows.length; i++) {
+                        dr.push(renderRow(i, rows[i]));
+                    }
+                }
+            }
+            return dr;
+        }
+        function renderFooter() {
+            const fr = h('button', { class: spec.footer.button.class, style: 'font: initial; margin-right: .5rem', onClick: first, disabled: spec.page.current == 1 }, '◀◀');
+            const ls = h('button', { class: spec.footer.button.class, style: 'font: initial; margin-right: .5rem', onClick: last, disabled: spec.page.count == 0 || spec.page.current == spec.page.count }, '▶▶');
+            const pg = h('button', { class: spec.footer.button.class, style: 'font: initial; margin-right: .5rem', onClick: go }, spec.page.current + (spec.page.count > 0 ? (' / ' + spec.page.count) : ''));
+            const pr = h('button', { class: spec.footer.button.class, style: 'font: initial; margin-right: .5rem', onClick: prior, disabled: spec.page.current == 1 }, '◀');
+            const nx = h('button', { class: spec.footer.button.class, style: 'font: initial; margin-right: .5rem', onClick: next, disabled: spec.page.count > 0 && spec.page.current == spec.page.count }, '▶');
+            const td = h('td', { colspan: spec.columns.length, align: 'center' }, [fr, pr, pg, nx, ls]);
+            const tr = h('tr', {}, [td]);
+            return [tr];
+        }
+        function renderCaption() {
+            return null;
+        }
+        if (spec.columns.length == 0) {
+            console.error('Columns not defined !');
+        }
+        for (let i = 0; i < spec.columns.length; i++)
+            if (spec.columns[i].name && spec.columns[i].name.indexOf('.') > -1) {
+                spec.columns[i].depth = spec.columns[i].name.split('.');
+            }
+        page(1);
+        onMounted(() => {
+            // mounted hook
+        });
+        return {
+            spec, renderHeader, renderBody, renderFooter, renderCaption
+        };
+    },
+    render(props) {
+        let prps = { class: 'tablevu' };
+        if (props.class)
+            prps.class = 'tablevu ' + props.class;
+        if (props.style)
+            prps.style = props.style;
+        const cntn = [];
+        cntn.push(h('thead', {}, this.renderHeader()));
+        if (this.spec.status == TablevuStatus.Ready)
+            cntn.push(h('tbody', { 'data-time': this.spec.time }, this.renderBody()));
+        if (this.spec.caption)
+            cntn.push(h('caption', {}, this.renderCaption()));
+        if (this.spec.status == TablevuStatus.Ready)
+            if (this.spec.page.size > 0)
+                cntn.push(h('tfoot', {}, this.renderFooter()));
+        return h('table', prps, cntn);
+    }
+};
+
+/* ==========================================================================
+ * OData DataTable Query Builder
+ * ========================================================================== */
+/* ==========================================================================
+ * Value
+ * ========================================================================== */
+function formatValue(value) {
+    if (value === null)
+        return 'null';
+    if (typeof value === 'string')
+        return `'${escapeODataString(value)}'`;
+    if (typeof value === 'number') {
+        if (!Number.isFinite(value))
+            throw new Error('Invalid numeric value.');
+        return String(value);
+    }
+    if (typeof value === 'boolean')
+        return value ? 'true' : 'false';
+    if (value instanceof Date)
+        return value.toISOString();
+    /*
+     * Backward compatibility with:
+     *
+     * {
+     *     func: 'now',
+     *     params: []
+     * }
+     */
+    if (typeof value === 'object' &&
+        value !== null &&
+        'func' in value &&
+        'params' in value) {
+        const funcValue = value;
+        return (funcValue.func +
+            '(' +
+            funcValue.params
+                .map(m => formatValue(m))
+                .join(',') +
+            ')');
+    }
+    throw new Error(`Unsupported OData value type: ${typeof value}`);
+}
+function escapeODataString(value) {
+    /*
+     * OData escapes a single quote by doubling it.
+     *
+     * O'Reilly
+     * ↓
+     * 'O''Reilly'
+     */
+    return value.replace(/'/g, "''");
+}
+/* ==========================================================================
+ * Filter
+ * ========================================================================== */
+function toODataFilter(filter) {
+    return buildFilter(filter);
+}
+function buildFilter(filter) {
+    if (!filter)
+        throw new Error('Invalid filter.');
+    /*
+     * Backward compatibility:
+     *
+     * {
+     *     func: 'contains',
+     *     params: [...]
+     * }
+     */
+    if (filter.func) {
+        return buildFunctionObject(filter);
+    }
+    switch (filter.operator) {
+        /* ------------------------------------------------------------------ */
+        /* Logical                                                            */
+        /* ------------------------------------------------------------------ */
+        case 'and':
+            return buildLogical(filter, 'and');
+        case 'or':
+            return buildLogical(filter, 'or');
+        case 'not':
+            return buildNot(filter);
+        /* ------------------------------------------------------------------ */
+        /* Comparison                                                         */
+        /* ------------------------------------------------------------------ */
+        case 'eq':
+        case 'ne':
+        case 'gt':
+        case 'ge':
+        case 'lt':
+        case 'le':
+            return buildComparison(filter);
+        /* ------------------------------------------------------------------ */
+        /* String                                                             */
+        /* ------------------------------------------------------------------ */
+        case 'contains':
+            return buildFunction(filter, 'contains');
+        case 'startsWith':
+            return buildFunction(filter, 'startswith');
+        case 'endsWith':
+            return buildFunction(filter, 'endswith');
+        /* ------------------------------------------------------------------ */
+        /* Value                                                              */
+        /* ------------------------------------------------------------------ */
+        case 'in':
+            return buildIn(filter);
+        case 'between':
+            return buildBetween(filter);
+        case 'isNull':
+            return `${getColumn(filter)} eq null`;
+        case 'isNotNull':
+            return `${getColumn(filter)} ne null`;
+        /* ------------------------------------------------------------------ */
+        /* Collection                                                         */
+        /* ------------------------------------------------------------------ */
+        case 'any':
+            return buildAny(filter);
+        case 'all':
+            return buildAll(filter);
+        /* ------------------------------------------------------------------ */
+        /* Collection count                                                   */
+        /* ------------------------------------------------------------------ */
+        case 'countGt':
+        case 'countGe':
+        case 'countLt':
+        case 'countLe':
+            return buildCount(filter);
+        default:
+            throw new Error(`Unsupported OData operator: ${filter.operator}`);
+    }
+}
+/* ==========================================================================
+ * Logical
+ * ========================================================================== */
+function buildLogical(filter, operator) {
+    const filters = requireFilters(filter);
+    if (filters.length === 0)
+        throw new Error(`Operator '${filter.operator}' requires at least one filter.`);
+    return filters
+        .map(buildFilter)
+        .map(expression => `(${expression})`)
+        .join(` ${operator} `);
+}
+function buildNot(filter) {
+    const filters = requireFilters(filter);
+    if (filters.length !== 1)
+        throw new Error("Operator 'not' requires exactly one filter.");
+    return `not (${buildFilter(filters[0])})`;
+}
+/* ==========================================================================
+ * Comparison
+ * ========================================================================== */
+function buildComparison(filter) {
+    const column = getColumn(filter);
+    return (`${column} ` +
+        `${filter.operator} ` +
+        `${formatValue(filter.value)}`);
+}
+/* ==========================================================================
+ * String functions
+ * ========================================================================== */
+function buildFunction(filter, functionName) {
+    const column = getColumn(filter);
+    return (`${functionName}(` +
+        `${column},` +
+        `${formatValue(filter.value)}` +
+        `)`);
+}
+/* ==========================================================================
+ * Function object
+ *
+ * Backward compatibility with the old:
+ *
+ * {
+ *     func: 'contains',
+ *     params: [...]
+ * }
+ * ========================================================================== */
+function buildFunctionObject(filter) {
+    if (!filter.func)
+        throw new Error('Function is required.');
+    return (filter.func +
+        '(' +
+        (filter.params ?? [])
+            .map(m => formatValue(m))
+            .join(',') +
+        ')');
+}
+/* ==========================================================================
+ * IN
+ * ========================================================================== */
+function buildIn(filter) {
+    const column = getColumn(filter);
+    if (!Array.isArray(filter.value))
+        throw new Error("Operator 'in' requires an array value.");
+    if (filter.value.length === 0)
+        throw new Error("Operator 'in' requires at least one value.");
+    return (`${column} in (` +
+        filter.value
+            .map(formatValue)
+            .join(',') +
+        `)`);
+}
+/* ==========================================================================
+ * BETWEEN
+ * ========================================================================== */
+function buildBetween(filter) {
+    const column = getColumn(filter);
+    if (!Array.isArray(filter.value) ||
+        filter.value.length !== 2) {
+        throw new Error("Operator 'between' requires exactly two values.");
+    }
+    const [min, max] = filter.value;
+    return (`(${column} ge ${formatValue(min)} ` +
+        `and ${column} le ${formatValue(max)})`);
+}
+/* ==========================================================================
+ * ANY
+ * ========================================================================== */
+function buildAny(filter) {
+    const column = getColumn(filter);
+    /*
+     * orders/any()
+     */
+    if (!filter.filters?.length)
+        return `${column}/any()`;
+    if (filter.filters.length !== 1)
+        throw new Error("Operator 'any' requires exactly one filter.");
+    return (`${column}/any(x: ` +
+        `${buildLambdaFilter(filter.filters[0], 'x')}` +
+        `)`);
+}
+/* ==========================================================================
+ * ALL
+ * ========================================================================== */
+function buildAll(filter) {
+    const column = getColumn(filter);
+    const filters = requireFilters(filter);
+    if (filters.length !== 1)
+        throw new Error("Operator 'all' requires exactly one filter.");
+    return (`${column}/all(x: ` +
+        `${buildLambdaFilter(filters[0], 'x')}` +
+        `)`);
+}
+/* ==========================================================================
+ * Lambda filter
+ * ========================================================================== */
+function buildLambdaFilter(filter, variable) {
+    /*
+     * Logical
+     */
+    if (filter.operator === 'and')
+        return buildLambdaLogical(filter, variable, 'and');
+    if (filter.operator === 'or')
+        return buildLambdaLogical(filter, variable, 'or');
+    if (filter.operator === 'not') {
+        const filters = requireFilters(filter);
+        if (filters.length !== 1)
+            throw new Error("Operator 'not' requires exactly one filter.");
+        return (`not (` +
+            `${buildLambdaFilter(filters[0], variable)}` +
+            `)`);
+    }
+    /*
+     * Comparison
+     */
+    switch (filter.operator) {
+        case 'eq':
+        case 'ne':
+        case 'gt':
+        case 'ge':
+        case 'lt':
+        case 'le':
+            return (`${variable}/${getColumn(filter)} ` +
+                `${filter.operator} ` +
+                `${formatValue(filter.value)}`);
+        /*
+         * String
+         */
+        case 'contains':
+            return (`contains(` +
+                `${getLambdaColumn(filter, variable)},` +
+                `${formatValue(filter.value)}` +
+                `)`);
+        case 'startsWith':
+            return (`startswith(` +
+                `${getLambdaColumn(filter, variable)},` +
+                `${formatValue(filter.value)}` +
+                `)`);
+        case 'endsWith':
+            return (`endswith(` +
+                `${getLambdaColumn(filter, variable)},` +
+                `${formatValue(filter.value)}` +
+                `)`);
+        /*
+         * Null
+         */
+        case 'isNull':
+            return (`${getLambdaColumn(filter, variable)} eq null`);
+        case 'isNotNull':
+            return (`${getLambdaColumn(filter, variable)} ne null`);
+        default:
+            throw new Error(`Operator '${filter.operator}' ` +
+                `is not supported inside any/all.`);
+    }
+}
+function buildLambdaLogical(filter, variable, operator) {
+    const filters = requireFilters(filter);
+    if (filters.length === 0)
+        throw new Error(`Operator '${filter.operator}' requires at least one filter.`);
+    return filters
+        .map(item => buildLambdaFilter(item, variable))
+        .map(expression => `(${expression})`)
+        .join(` ${operator} `);
+}
+/* ==========================================================================
+ * Collection count
+ * ========================================================================== */
+function buildCount(filter) {
+    const column = getColumn(filter);
+    const operators = {
+        countGt: 'gt',
+        countGe: 'ge',
+        countLt: 'lt',
+        countLe: 'le'
+    };
+    return (`${column}/$count ` +
+        `${operators[filter.operator]} ` +
+        `${formatValue(filter.value)}`);
+}
+/* ==========================================================================
+ * Helpers
+ * ========================================================================== */
+function getColumn(filter) {
+    if (!filter.column ||
+        filter.column.trim().length === 0) {
+        throw new Error(`Operator '${filter.operator}' requires a column.`);
+    }
+    /*
+     * Allow:
+     *
+     * customer.name
+     * customer.address.city
+     *
+     * to become:
+     *
+     * customer/name
+     * customer/address/city
+     */
+    return filter.column.replace(/\./g, '/');
+}
+function getLambdaColumn(filter, variable) {
+    return (`${variable}/` +
+        `${getColumn(filter)}`);
+}
+function requireFilters(filter) {
+    if (!filter.filters)
+        throw new Error(`Operator '${filter.operator}' requires filters.`);
+    return filter.filters;
+}
+/* ==========================================================================
+ * OData Request
+ * ========================================================================== */
+function odata(options, props = {}) {
+    const url = new URL(options.url);
+    /* ---------------------------------------------------------------------- */
+    /* Paging                                                                 */
+    /* ---------------------------------------------------------------------- */
+    if (props.pageSize &&
+        props.pageSize > 0) {
+        const currPage = props.currPage && props.currPage > 0
+            ? props.currPage
+            : 1;
+        const skip = props.pageSize * (currPage - 1);
+        url.searchParams.set('$skip', String(skip));
+        url.searchParams.set('$top', String(props.pageSize));
+    }
+    /* ---------------------------------------------------------------------- */
+    /* Count                                                                  */
+    /* ---------------------------------------------------------------------- */
+    if (options.count === true) {
+        url.searchParams.set('$count', 'true');
+    }
+    /* ---------------------------------------------------------------------- */
+    /* Select                                                                 */
+    /* ---------------------------------------------------------------------- */
+    if (options.select &&
+        options.select.length > 0) {
+        url.searchParams.set('$select', options.select
+            .map(m => m.replace(/\./g, '/'))
+            .join(','));
+    }
+    /* ---------------------------------------------------------------------- */
+    /* Expand                                                                 */
+    /* ---------------------------------------------------------------------- */
+    if (options.expand &&
+        options.expand.length > 0) {
+        const expand = options.expand
+            .map(expand => {
+            const name = expand.name.replace(/\./g, '/');
+            if (expand.select &&
+                expand.select.length > 0) {
+                return (`${name}` +
+                    `($select=` +
+                    `${expand.select
+                        .map(m => m.replace(/\./g, '/'))
+                        .join(',')}` +
+                    `)`);
+            }
+            return name;
+        })
+            .join(',');
+        url.searchParams.set('$expand', expand);
+    }
+    /* ---------------------------------------------------------------------- */
+    /* Filter                                                                 */
+    /* ---------------------------------------------------------------------- */
+    const filters = [];
+    /*
+     * Static filter from options
+     */
+    if (options.filter &&
+        (options.filter.filters ||
+            options.filter.column ||
+            options.filter.func)) {
+        const expression = toODataFilter(options.filter);
+        if (expression)
+            filters.push(`(${expression})`);
+    }
+    /*
+     * Runtime filter from DataTable
+     */
+    if (props.filter &&
+        (props.filter.filters ||
+            props.filter.column ||
+            props.filter.func)) {
+        const expression = toODataFilter(props.filter);
+        if (expression)
+            filters.push(`(${expression})`);
+    }
+    /* ---------------------------------------------------------------------- */
+    /* Search                                                                 */
+    /* ---------------------------------------------------------------------- */
+    if (props.search &&
+        props.search.trim() &&
+        props.cols &&
+        props.cols.length > 0) {
+        const searchValue = escapeODataString(props.search.trim());
+        const searchExpressions = props.cols
+            .filter(column => column.searchable === undefined ||
+            column.searchable === true)
+            .map(column => {
+            const name = column.name.replace(/\./g, '/');
+            return (`contains(` +
+                `${name},` +
+                `'${searchValue}'` +
+                `)`);
+        });
+        if (searchExpressions.length > 0) {
+            filters.push(`(${searchExpressions.join(' or ')})`);
+        }
+    }
+    /*
+     * Combine all filters with AND.
+     */
+    if (filters.length > 0) {
+        url.searchParams.set('$filter', filters.join(' and '));
+    }
+    /* ---------------------------------------------------------------------- */
+    /* Order By                                                               */
+    /* ---------------------------------------------------------------------- */
+    if (props.sort &&
+        props.sort.length > 0) {
+        const orderBy = props.sort
+            .map(sort => {
+            let column;
+            if (sort.index !== undefined &&
+                sort.index >= 0) {
+                if (!props.cols ||
+                    !props.cols[sort.index]) {
+                    throw new Error(`Invalid sort column index: ${sort.index}`);
+                }
+                column =
+                    props.cols[sort.index].name;
+            }
+            else if (sort.name) {
+                column = sort.name;
+            }
+            else {
+                throw new Error('Sort requires either index or name.');
+            }
+            column =
+                column.replace(/\./g, '/');
+            return (column +
+                (sort.dir
+                    ? ` ${sort.dir}`
+                    : ''));
+        })
+            .join(',');
+        url.searchParams.set('$orderby', orderBy);
+    }
+    /* ---------------------------------------------------------------------- */
+    /* Request                                                                */
+    /* ---------------------------------------------------------------------- */
+    return new Request(url, options.header);
+}
+
+const param = (uri, header, props) => {
+    const url = new URL(uri);
+    // Paging //
+    if (props.pageSize && props.currentPage) {
+        url.searchParams.append('skip', String(props.pageSize * (props.currentPage - 1)));
+        url.searchParams.append('top', String(props.pageSize));
+    }
+    // Filter //
+    if (props.search)
+        url.searchParams.append('search', props.search);
+    // Order //
+    if (props.order && props.order.length > 0 && props.cols) {
+        url.searchParams.append('orderby', props.order.map(m => props.cols?.[m.index]?.name || '').join(','));
+        url.searchParams.append('orderdir', props.order.map(m => m.type ? m.type : 'asc').join(','));
+    }
+    return new Request(url, header);
+};
+
+export { tablevu as TableVu, TablevuStatus, adaptArray, toODataFilter as buildFilter, odata, param as webapi };