@furystack/shades-common-components 12.4.0 → 12.6.0

package/esm/components/data-grid/filters/number-filter.spec.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"number-filter.spec.js","sourceRoot":"","sources":["../../../../src/components/data-grid/filters/number-filter.spec.tsx"],"names":[],"mappings":"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"}

package/esm/components/data-grid/filters/string-filter.d.ts

@@ -0,0 +1,12 @@
+import type { ObservableValue } from '@furystack/utils';
+import type { FilterableFindOptions } from '../data-grid.js';
+export declare const StringFilter: (props: {
+    field: string;
+    findOptions: ObservableValue<FilterableFindOptions>;
+    onClose: () => void;
+} & Omit<Partial<HTMLElement>, "style"> & {
+    style?: Partial<CSSStyleDeclaration>;
+} & {
+    ref?: import("@furystack/shades").RefObject<Element>;
+}, children?: import("@furystack/shades").ChildrenList) => JSX.Element;
+//# sourceMappingURL=string-filter.d.ts.map

package/esm/components/data-grid/filters/string-filter.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"string-filter.d.ts","sourceRoot":"","sources":["../../../../src/components/data-grid/filters/string-filter.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAA;AAKvD,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,iBAAiB,CAAA;AAY5D,eAAO,MAAM,YAAY;WAChB,MAAM;iBACA,eAAe,CAAC,qBAAqB,CAAC;aAC1C,MAAM,IAAI;;;;;sEA0FnB,CAAA"}

package/esm/components/data-grid/filters/string-filter.js

@@ -0,0 +1,63 @@
+import { createComponent, Shade } from '@furystack/shades';
+import { Button } from '../../button.js';
+import { SegmentedControl } from '../../button-group.js';
+import { Icon } from '../../icons/icon.js';
+import { close as closeIcon, search as searchIcon } from '../../icons/icon-definitions.js';
+import { filterBaseCss, filterInputCss } from './filter-styles.js';
+const operatorLabels = {
+    $regex: 'Contains',
+    $startsWith: 'Starts with',
+    $endsWith: 'Ends with',
+    $eq: 'Equals',
+};
+export const StringFilter = Shade({
+    shadowDomName: 'data-grid-string-filter',
+    css: {
+        ...filterBaseCss,
+        '& input': filterInputCss,
+    },
+    render: ({ props, useObservable, useState }) => {
+        const [findOptions, setFindOptions] = useObservable('findOptions', props.findOptions);
+        const currentFilter = findOptions.filter?.[props.field];
+        const currentOperator = currentFilter
+            ? (Object.keys(currentFilter).find((k) => k in operatorLabels) ?? '$regex')
+            : '$regex';
+        const currentValue = currentFilter?.[currentOperator] ?? '';
+        const applyFilter = (operator, value) => {
+            const filter = { ...findOptions.filter };
+            if (!value) {
+                delete filter[props.field];
+            }
+            else {
+                filter[props.field] = { [operator]: value };
+            }
+            setFindOptions({ ...findOptions, filter, skip: 0 });
+            props.onClose();
+        };
+        const clearFilter = () => {
+            const filter = { ...findOptions.filter };
+            delete filter[props.field];
+            setFindOptions({ ...findOptions, filter, skip: 0 });
+            props.onClose();
+        };
+        const [selectedOperator, setSelectedOperator] = useState('selectedOperator', currentOperator);
+        let inputValue = currentValue;
+        return (createComponent("form", { onsubmit: (ev) => {
+                ev.preventDefault();
+                applyFilter(selectedOperator, inputValue);
+            } },
+            createComponent("div", { className: "filter-row" },
+                createComponent(SegmentedControl, { size: "small", value: selectedOperator, onValueChange: (v) => setSelectedOperator(v), options: Object.keys(operatorLabels).map((op) => ({
+                        value: op,
+                        label: operatorLabels[op],
+                    })) })),
+            createComponent("div", { className: "filter-row" },
+                createComponent("input", { "data-testid": "string-filter-value", type: "text", placeholder: "Filter value...", value: currentValue, autofocus: true, oninput: (ev) => {
+                        inputValue = ev.target.value;
+                    } })),
+            createComponent("div", { className: "filter-actions" },
+                createComponent(Button, { type: "button", variant: "outlined", size: "small", onclick: clearFilter, startIcon: createComponent(Icon, { icon: closeIcon, size: 14 }) }, "Clear"),
+                createComponent(Button, { type: "submit", variant: "outlined", size: "small", color: "primary", startIcon: createComponent(Icon, { icon: searchIcon, size: 14 }) }, "Apply"))));
+    },
+});
+//# sourceMappingURL=string-filter.js.map

package/esm/components/data-grid/filters/string-filter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"string-filter.js","sourceRoot":"","sources":["../../../../src/components/data-grid/filters/string-filter.tsx"],"names":[],"mappings":"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"}

package/esm/components/data-grid/filters/string-filter.spec.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=string-filter.spec.d.ts.map

package/esm/components/data-grid/filters/string-filter.spec.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"string-filter.spec.d.ts","sourceRoot":"","sources":["../../../../src/components/data-grid/filters/string-filter.spec.tsx"],"names":[],"mappings":""}

package/esm/components/data-grid/filters/string-filter.spec.js

@@ -0,0 +1,128 @@
+import { Injector } from '@furystack/inject';
+import { createComponent, flushUpdates, initializeShadeRoot } from '@furystack/shades';
+import { ObservableValue, usingAsync } from '@furystack/utils';
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
+import { StringFilter } from './string-filter.js';
+describe('StringFilter', () => {
+    beforeEach(() => {
+        document.body.innerHTML = '<div id="root"></div>';
+    });
+    afterEach(() => {
+        document.body.innerHTML = '';
+    });
+    const createFindOptions = (options = {}) => {
+        return new ObservableValue(options);
+    };
+    const renderStringFilter = async (findOptions, field = 'name', onClose = vi.fn()) => {
+        const injector = new Injector();
+        const rootElement = document.getElementById('root');
+        initializeShadeRoot({
+            injector,
+            rootElement,
+            jsxElement: createComponent(StringFilter, { field: field, findOptions: findOptions, onClose: onClose }),
+        });
+        await flushUpdates();
+        return { injector, onClose };
+    };
+    it('should render operator segmented control and input', async () => {
+        const findOptions = createFindOptions();
+        await usingAsync((await renderStringFilter(findOptions)).injector, async () => {
+            const control = document.querySelector('shade-segmented-control');
+            expect(control).not.toBeNull();
+            const input = document.querySelector('[data-testid="string-filter-value"]');
+            expect(input).not.toBeNull();
+        });
+    });
+    it('should apply $regex filter on submit', async () => {
+        const findOptions = createFindOptions();
+        const { injector, onClose } = await renderStringFilter(findOptions);
+        await usingAsync(injector, async () => {
+            const input = document.querySelector('[data-testid="string-filter-value"]');
+            input.value = 'test-value';
+            input.dispatchEvent(new Event('input', { bubbles: true }));
+            const form = document.querySelector('form');
+            form.dispatchEvent(new Event('submit', { bubbles: true }));
+            await flushUpdates();
+            expect(findOptions.getValue().filter).toEqual({ name: { $regex: 'test-value' } });
+            expect(onClose).toHaveBeenCalled();
+        });
+    });
+    it('should clear filter when Clear button is clicked', async () => {
+        const findOptions = createFindOptions({ filter: { name: { $regex: 'existing' } } });
+        const { injector, onClose } = await renderStringFilter(findOptions);
+        await usingAsync(injector, async () => {
+            const clearButton = Array.from(document.querySelectorAll('button')).find((b) => b.textContent?.trim() === 'Clear');
+            clearButton?.click();
+            await flushUpdates();
+            expect(findOptions.getValue().filter?.name).toBeUndefined();
+            expect(onClose).toHaveBeenCalled();
+        });
+    });
+    it('should remove filter when submitting empty value', async () => {
+        const findOptions = createFindOptions({ filter: { name: { $regex: 'existing' } } });
+        const { injector, onClose } = await renderStringFilter(findOptions);
+        await usingAsync(injector, async () => {
+            const input = document.querySelector('[data-testid="string-filter-value"]');
+            input.value = '';
+            input.dispatchEvent(new Event('input', { bubbles: true }));
+            const form = document.querySelector('form');
+            form.dispatchEvent(new Event('submit', { bubbles: true }));
+            await flushUpdates();
+            expect(findOptions.getValue().filter?.name).toBeUndefined();
+            expect(onClose).toHaveBeenCalled();
+        });
+    });
+    it('should preserve filters on other fields', async () => {
+        const findOptions = createFindOptions({ filter: { name: { $regex: 'old' }, email: { $regex: 'keep' } } });
+        const { injector } = await renderStringFilter(findOptions);
+        await usingAsync(injector, async () => {
+            const input = document.querySelector('[data-testid="string-filter-value"]');
+            input.value = 'new-value';
+            input.dispatchEvent(new Event('input', { bubbles: true }));
+            const form = document.querySelector('form');
+            form.dispatchEvent(new Event('submit', { bubbles: true }));
+            await flushUpdates();
+            const updatedFilter = findOptions.getValue().filter;
+            expect(updatedFilter?.name).toEqual({ $regex: 'new-value' });
+            expect(updatedFilter?.email).toEqual({ $regex: 'keep' });
+        });
+    });
+    it('should apply selected operator', async () => {
+        const findOptions = createFindOptions();
+        const { injector, onClose } = await renderStringFilter(findOptions);
+        await usingAsync(injector, async () => {
+            const eqButton = document.querySelector('shade-segmented-control button[data-value="$eq"]');
+            eqButton?.click();
+            await flushUpdates();
+            const input = document.querySelector('[data-testid="string-filter-value"]');
+            input.value = 'exact';
+            input.dispatchEvent(new Event('input', { bubbles: true }));
+            const form = document.querySelector('form');
+            form.dispatchEvent(new Event('submit', { bubbles: true }));
+            await flushUpdates();
+            expect(findOptions.getValue().filter).toEqual({ name: { $eq: 'exact' } });
+            expect(onClose).toHaveBeenCalled();
+        });
+    });
+    it('should reset skip to 0 when applying filter', async () => {
+        const findOptions = createFindOptions({ skip: 20 });
+        const { injector } = await renderStringFilter(findOptions);
+        await usingAsync(injector, async () => {
+            const input = document.querySelector('[data-testid="string-filter-value"]');
+            input.value = 'test';
+            input.dispatchEvent(new Event('input', { bubbles: true }));
+            const form = document.querySelector('form');
+            form.dispatchEvent(new Event('submit', { bubbles: true }));
+            await flushUpdates();
+            expect(findOptions.getValue().skip).toBe(0);
+        });
+    });
+    it('should show current filter value in input', async () => {
+        const findOptions = createFindOptions({ filter: { name: { $regex: 'current-value' } } });
+        await usingAsync((await renderStringFilter(findOptions)).injector, async () => {
+            const input = document.querySelector('[data-testid="string-filter-value"]');
+            expect(input.value).toBe('current-value');
+        });
+    });
+});
+//# sourceMappingURL=string-filter.spec.js.map

package/esm/components/data-grid/filters/string-filter.spec.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"string-filter.spec.js","sourceRoot":"","sources":["../../../../src/components/data-grid/filters/string-filter.spec.tsx"],"names":[],"mappings":"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"}

package/esm/components/data-grid/footer.d.ts

@@ -5,5 +5,6 @@ export declare const dataGridItemsPerPage: number[];
 export declare const DataGridFooter: <T>(props: {
     service: CollectionService<T>;
     findOptions: ObservableValue<FindOptions<T, Array<keyof T>>>;
+    paginationOptions?: number[];
 }) => JSX.Element;
 //# sourceMappingURL=footer.d.ts.map

package/esm/components/data-grid/footer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"footer.d.ts","sourceRoot":"","sources":["../../../src/components/data-grid/footer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAA;AAElD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAA;AACvD,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,sCAAsC,CAAA;AAG7E,eAAO,MAAM,oBAAoB,UAAkC,CAAA;AAEnE,eAAO,MAAM,cAAc,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE;IACtC,OAAO,EAAE,iBAAiB,CAAC,CAAC,CAAC,CAAA;IAC7B,WAAW,EAAE,eAAe,CAAC,WAAW,CAAC,CAAC,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAA;CAC7D,KAAK,GAAG,CAAC,OA8ER,CAAA"}
+{"version":3,"file":"footer.d.ts","sourceRoot":"","sources":["../../../src/components/data-grid/footer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAA;AAElD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAA;AACvD,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,sCAAsC,CAAA;AAI7E,eAAO,MAAM,oBAAoB,UAAkC,CAAA;AAEnE,eAAO,MAAM,cAAc,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE;IACtC,OAAO,EAAE,iBAAiB,CAAC,CAAC,CAAC,CAAA;IAC7B,WAAW,EAAE,eAAe,CAAC,WAAW,CAAC,CAAC,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAA;IAC5D,iBAAiB,CAAC,EAAE,MAAM,EAAE,CAAA;CAC7B,KAAK,GAAG,CAAC,OAmFR,CAAA"}

package/esm/components/data-grid/footer.js

@@ -1,5 +1,6 @@
 import { Shade, createComponent } from '@furystack/shades';
 import { cssVariableTheme } from '../../services/css-variable-theme.js';
+import { Pagination } from '../pagination.js';
 export const dataGridItemsPerPage = [10, 20, 25, 50, 100, Infinity];
 export const DataGridFooter = Shade({
     shadowDomName: 'shade-data-grid-footer',
@@ -12,15 +13,28 @@ export const DataGridFooter = Shade({
             bottom: '0',
             display: 'flex',
             justifyContent: 'flex-end',
-            padding: '1em',
+            padding: '8px 12px',
             alignItems: 'center',
+            gap: '16px',
+            fontSize: cssVariableTheme.typography.fontSize.xs,
+        },
+        '& .pager-section': {
+            display: 'flex',
+            alignItems: 'center',
+            gap: '6px',
         },
         '& select': {
-            margin: '0 1em',
+            padding: '4px 8px',
+            borderRadius: cssVariableTheme.shape.borderRadius.sm,
+            border: `1px solid ${cssVariableTheme.divider}`,
+            background: cssVariableTheme.background.default,
+            color: cssVariableTheme.text.primary,
+            fontSize: cssVariableTheme.typography.fontSize.xs,
+            cursor: 'pointer',
         },
     },
     render: ({ props, useObservable }) => {
-        const { service, findOptions } = props;
+        const { service, findOptions, paginationOptions = dataGridItemsPerPage } = props;
         const [currentData] = useObservable('dataUpdater', service.data);
         const [currentOptions, setCurrentOptions] = useObservable('optionsUpdater', findOptions, {
             filter: (newValue, oldValue) => {
@@ -31,18 +45,13 @@ export const DataGridFooter = Shade({
         const skip = currentOptions.skip || 0;
         const currentPage = Math.ceil(skip) / (top || 1);
         const currentEntriesPerPage = top;
-        const pages = new Array(Math.ceil(currentData.count / (currentOptions.top || Infinity)))
-            .fill(0)
-            .map((_, index) => index);
+        const pageCount = Math.ceil(currentData.count / (currentOptions.top || Infinity));
         return (createComponent("div", { className: "pager" },
-            currentEntriesPerPage !== Infinity && (createComponent("div", null,
-                "Goto page",
-                createComponent("select", { onchange: (ev) => {
-                        const value = parseInt(ev.target.value, 10);
-                        setCurrentOptions({ ...currentOptions, skip: (currentOptions.top || 0) * value });
-                    } }, pages.map((index) => (createComponent("option", { value: index.toString(), selected: currentPage === index }, (index + 1).toString())))))),
-            createComponent("div", null,
-                "Show",
+            currentEntriesPerPage !== Infinity && pageCount > 1 && (createComponent(Pagination, { count: pageCount, page: currentPage + 1, size: "small", onPageChange: (newPage) => {
+                    setCurrentOptions({ ...currentOptions, skip: (currentOptions.top || 0) * (newPage - 1) });
+                } })),
+            paginationOptions.length > 1 && (createComponent("div", { className: "pager-section" },
+                createComponent("span", null, "Rows per page"),
                 createComponent("select", { onchange: (ev) => {
                         const value = parseInt(ev.currentTarget.value, 10);
                         setCurrentOptions({
@@ -50,8 +59,7 @@ export const DataGridFooter = Shade({
                             top: value,
                             skip: currentPage * value,
                         });
-                    } }, dataGridItemsPerPage.map((no) => (createComponent("option", { value: no.toString(), selected: no === currentEntriesPerPage }, no.toString())))),
-                "items per page")));
+                    } }, paginationOptions.map((no) => (createComponent("option", { value: no.toString(), selected: no === currentEntriesPerPage }, no === Infinity ? 'All' : no.toString()))))))));
     },
 });
 //# sourceMappingURL=footer.js.map

package/esm/components/data-grid/footer.js.map

@@ -1 +1 @@
-{"version":3,"file":"footer.js","sourceRoot":"","sources":["../../../src/components/data-grid/footer.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"footer.js","sourceRoot":"","sources":["../../../src/components/data-grid/footer.tsx"],"names":[],"mappings":"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"}