@lowdefy/blocks-table 0.0.0-experimental-20260929110023

package/dist/features/toolbar/RecordCount.js

@@ -0,0 +1,27 @@
+/*
+  Copyright 2020-2026 Lowdefy, Inc
+
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+*/ import React from 'react';
+import formatRecordCount from './formatRecordCount.js';
+import getRecordCount from '../../core/getRecordCount.js';
+function RecordCount({ api }) {
+    return /*#__PURE__*/ React.createElement("span", {
+        "aria-live": "polite",
+        className: "lf-table-record-count",
+        "data-lf-record-count": ""
+    }, formatRecordCount(getRecordCount({
+        api
+    })));
+}
+export default RecordCount;

package/dist/features/toolbar/SaveViewAs.js

@@ -0,0 +1,66 @@
+/*
+  Copyright 2020-2026 Lowdefy, Inc
+
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+*/ import React, { useState } from 'react';
+import { Button, Checkbox, Input, Popover } from 'antd';
+// "Save as…": asks for a title and whether the view is shared, then fires onViewSave without an
+// id. The app creates the view and may make it active through `activeView`.
+function SaveViewAs({ api }) {
+    const [open, setOpen] = useState(false);
+    const [title, setTitle] = useState('');
+    const [shared, setShared] = useState(false);
+    function submit() {
+        const trimmed = title.trim();
+        if (trimmed === '') return;
+        api.views.saveAs({
+            title: trimmed,
+            shared
+        });
+        setOpen(false);
+        setTitle('');
+        setShared(false);
+    }
+    const content = /*#__PURE__*/ React.createElement("div", {
+        className: "lf-table-save-view",
+        "data-lf-save-view": ""
+    }, /*#__PURE__*/ React.createElement(Input, {
+        "aria-label": "View name",
+        autoFocus: true,
+        onChange: (event)=>setTitle(event.target.value),
+        onPressEnter: submit,
+        placeholder: "View name",
+        size: "small",
+        value: title
+    }), /*#__PURE__*/ React.createElement(Checkbox, {
+        checked: shared,
+        onChange: (event)=>setShared(event.target.checked)
+    }, "Shared"), /*#__PURE__*/ React.createElement(Button, {
+        "data-lf-view-action": "save-as-submit",
+        disabled: title.trim() === '',
+        onClick: submit,
+        size: "small",
+        type: "primary"
+    }, "Save view"));
+    return /*#__PURE__*/ React.createElement(Popover, {
+        content: content,
+        onOpenChange: setOpen,
+        open: open,
+        placement: "bottomRight",
+        trigger: "click"
+    }, /*#__PURE__*/ React.createElement(Button, {
+        "data-lf-view-action": "save-as",
+        size: "small"
+    }, "Save as…"));
+}
+export default SaveViewAs;

package/dist/features/toolbar/SortButton.js

@@ -0,0 +1,94 @@
+/*
+  Copyright 2020-2026 Lowdefy, Inc
+
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+*/ import React from 'react';
+import { Button, Popover, Segmented } from 'antd';
+import isDefaultSorting from './isDefaultSorting.js';
+import ToolbarCount from './ToolbarCount.js';
+import ToolbarIcon from './ToolbarIcon.js';
+import ToolbarList from './ToolbarList.js';
+const DIRECTIONS = [
+    {
+        label: 'Asc',
+        value: 'asc'
+    },
+    {
+        label: 'Desc',
+        value: 'desc'
+    }
+];
+// The multi-sort editor: sort levels in order, each with its direction. The button counts the
+// sort levels when they differ from `defaultView`'s sort.
+function SortButton({ api }) {
+    const { sorting } = api.state;
+    const keys = sorting.map((entry)=>entry.id);
+    const available = api.config.columns.filter((column)=>column.sortable && !keys.includes(column.key));
+    function update(next) {
+        api.updateSlice('sorting', ()=>next, {
+            cause: 'sort'
+        });
+    }
+    function onChange(nextKeys) {
+        const byKey = new Map(sorting.map((entry)=>[
+                entry.id,
+                entry
+            ]));
+        update(nextKeys.map((key)=>byKey.get(key) ?? {
+                id: key,
+                desc: false
+            }));
+    }
+    // The default view's own sort is not counted: the count shows the user changed the sort.
+    const sortCount = isDefaultSorting({
+        config: api.config,
+        sorting
+    }) ? 0 : sorting.length;
+    const content = /*#__PURE__*/ React.createElement("div", {
+        className: "lf-table-toolbar-popover",
+        "data-lf-toolbar-sort": ""
+    }, /*#__PURE__*/ React.createElement(ToolbarList, {
+        addLabel: "Add sort",
+        api: api,
+        available: available,
+        emptyText: "No sort",
+        keys: keys,
+        name: "sort",
+        onChange: onChange,
+        renderExtra: ({ index })=>/*#__PURE__*/ React.createElement(Segmented, {
+                "data-lf-sort-direction": "",
+                onChange: (direction)=>update(sorting.map((entry, i)=>i === index ? {
+                            ...entry,
+                            desc: direction === 'desc'
+                        } : entry)),
+                options: DIRECTIONS,
+                size: "small",
+                value: sorting[index].desc ? 'desc' : 'asc'
+            })
+    }));
+    return /*#__PURE__*/ React.createElement(Popover, {
+        content: content,
+        placement: "bottomLeft",
+        trigger: "click"
+    }, /*#__PURE__*/ React.createElement(Button, {
+        "data-lf-toolbar-button": "sort",
+        icon: /*#__PURE__*/ React.createElement(ToolbarIcon, {
+            api: api,
+            name: "sort"
+        }),
+        size: "small"
+    }, "Sort", /*#__PURE__*/ React.createElement(ToolbarCount, {
+        count: sortCount
+    })));
+}
+export default SortButton;

package/dist/features/toolbar/Toolbar.js

@@ -0,0 +1,88 @@
+/*
+  Copyright 2020-2026 Lowdefy, Inc
+
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+*/ import React from 'react';
+import { Button } from 'antd';
+import DensityToggle from './DensityToggle.js';
+import FilterButton from './FilterButton.js';
+import LazyColumnManagerPopover from '../columnManager/LazyColumnManagerPopover.js';
+import GroupButton from './GroupButton.js';
+import QuickFilter from './QuickFilter.js';
+import RecordCount from './RecordCount.js';
+import SortButton from './SortButton.js';
+import ToolbarIcon from './ToolbarIcon.js';
+import ToolbarSearch from './ToolbarSearch.js';
+import ViewTabs from './ViewTabs.js';
+import './toolbar.css';
+// The table's own chrome above the grid (D7): view tabs, then one row with the `toolbarStart`
+// slot, search, quick filters and the view controls, and at the end the record count, density,
+// columns, export and the `toolbarEnd` slot. antd components: this is chrome, not cells.
+function Toolbar({ api, searchRef, toolbar }) {
+    const { columnsByKey } = api.config;
+    const { content } = api;
+    const groupable = api.config.columns.filter((column)=>column.groupable);
+    const quickFilters = toolbar.quickFilters.map((key)=>columnsByKey.get(key));
+    const showTabs = toolbar.views && api.views.items.length > 0;
+    return /*#__PURE__*/ React.createElement("div", {
+        className: "lf-table-toolbar",
+        "data-lf-toolbar": ""
+    }, showTabs ? /*#__PURE__*/ React.createElement(ViewTabs, {
+        api: api
+    }) : null, /*#__PURE__*/ React.createElement("div", {
+        className: "lf-table-toolbar-row"
+    }, /*#__PURE__*/ React.createElement("div", {
+        className: "lf-table-toolbar-start"
+    }, content.toolbarStart ? content.toolbarStart() : null, toolbar.search ? /*#__PURE__*/ React.createElement(ToolbarSearch, {
+        api: api,
+        searchRef: searchRef
+    }) : null, quickFilters.map((column)=>/*#__PURE__*/ React.createElement(QuickFilter, {
+            api: api,
+            column: column,
+            key: column.key
+        })), toolbar.filter ? /*#__PURE__*/ React.createElement(FilterButton, {
+        api: api
+    }) : null, toolbar.sort ? /*#__PURE__*/ React.createElement(SortButton, {
+        api: api
+    }) : null, toolbar.group && groupable.length > 0 ? /*#__PURE__*/ React.createElement(GroupButton, {
+        api: api,
+        groupable: groupable
+    }) : null), /*#__PURE__*/ React.createElement("div", {
+        className: "lf-table-toolbar-end"
+    }, toolbar.count ? /*#__PURE__*/ React.createElement(RecordCount, {
+        api: api
+    }) : null, toolbar.density ? /*#__PURE__*/ React.createElement(DensityToggle, {
+        api: api
+    }) : null, toolbar.columns ? /*#__PURE__*/ React.createElement(Button, {
+        "data-lf-toolbar-button": "columns",
+        icon: /*#__PURE__*/ React.createElement(ToolbarIcon, {
+            api: api,
+            name: "view"
+        }),
+        onClick: ()=>api.actions.openColumnManager(),
+        onFocus: LazyColumnManagerPopover.preload,
+        onPointerEnter: LazyColumnManagerPopover.preload,
+        size: "small"
+    }, "Columns") : null, toolbar.export ? /*#__PURE__*/ React.createElement(Button, {
+        "data-lf-toolbar-button": "export",
+        icon: /*#__PURE__*/ React.createElement(ToolbarIcon, {
+            api: api,
+            name: "download"
+        }),
+        onClick: ()=>api.actions.exportCsv({
+                filename: `${api.blockId}.csv`
+            }),
+        size: "small"
+    }, "Export") : null, content.toolbarEnd ? content.toolbarEnd() : null)));
+}
+export default Toolbar;

package/dist/features/toolbar/ToolbarCount.js

@@ -0,0 +1,25 @@
+/*
+  Copyright 2020-2026 Lowdefy, Inc
+
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+*/ import React from 'react';
+// How many filter conditions, sort levels or group levels are set, inside the toolbar button
+// after its label: a small count in the primary tint, not a badge over the button's border.
+function ToolbarCount({ count }) {
+    if (count === 0) return null;
+    return /*#__PURE__*/ React.createElement("span", {
+        className: "lf-table-toolbar-count",
+        "data-lf-toolbar-count": ""
+    }, count);
+}
+export default ToolbarCount;

package/dist/features/toolbar/ToolbarIcon.js

@@ -0,0 +1,28 @@
+/*
+  Copyright 2020-2026 Lowdefy, Inc
+
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+*/ import React from 'react';
+// Toolbar icons are the app's semantic icons (theme.icons can re-skin them).
+function ToolbarIcon({ api, name }) {
+    const { Icon } = api.components;
+    return /*#__PURE__*/ React.createElement(Icon, {
+        blockId: `${api.blockId}_toolbar_${name}_icon`,
+        events: {},
+        properties: {
+            name,
+            title: ''
+        }
+    });
+}
+export default ToolbarIcon;

package/dist/features/toolbar/ToolbarList.js

@@ -0,0 +1,100 @@
+/*
+  Copyright 2020-2026 Lowdefy, Inc
+
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+*/ import React from 'react';
+import { Button, Select } from 'antd';
+import ColumnTitle from './ColumnTitle.js';
+import moveItem from './moveItem.js';
+import ToolbarIcon from './ToolbarIcon.js';
+// An ordered list of columns (sort levels, group levels) with reorder and remove buttons, a slot
+// for per-entry controls and a picker that appends a column. `onChange` receives the new keys.
+function ToolbarList({ addLabel, api, available, emptyText, keys, name, onChange, renderExtra }) {
+    const { columnsByKey } = api.config;
+    return /*#__PURE__*/ React.createElement("div", {
+        className: "lf-table-toolbar-list",
+        "data-lf-toolbar-list": name
+    }, keys.length === 0 ? /*#__PURE__*/ React.createElement("div", {
+        className: "lf-table-toolbar-list-empty"
+    }, emptyText) : null, keys.map((key, index)=>/*#__PURE__*/ React.createElement("div", {
+            className: "lf-table-toolbar-list-item",
+            "data-key": key,
+            key: key
+        }, /*#__PURE__*/ React.createElement("span", {
+            className: "lf-table-toolbar-list-title"
+        }, /*#__PURE__*/ React.createElement(ColumnTitle, {
+            api: api,
+            column: columnsByKey.get(key)
+        })), renderExtra ? renderExtra({
+            key,
+            index
+        }) : null, /*#__PURE__*/ React.createElement(Button, {
+            "aria-label": "Move up",
+            "data-lf-action": "up",
+            disabled: index === 0,
+            icon: /*#__PURE__*/ React.createElement(ToolbarIcon, {
+                api: api,
+                name: "chevron-up"
+            }),
+            onClick: ()=>onChange(moveItem({
+                    items: keys,
+                    from: index,
+                    to: index - 1
+                })),
+            size: "small",
+            type: "text"
+        }), /*#__PURE__*/ React.createElement(Button, {
+            "aria-label": "Move down",
+            "data-lf-action": "down",
+            disabled: index === keys.length - 1,
+            icon: /*#__PURE__*/ React.createElement(ToolbarIcon, {
+                api: api,
+                name: "chevron-down"
+            }),
+            onClick: ()=>onChange(moveItem({
+                    items: keys,
+                    from: index,
+                    to: index + 1
+                })),
+            size: "small",
+            type: "text"
+        }), /*#__PURE__*/ React.createElement(Button, {
+            "aria-label": "Remove",
+            "data-lf-action": "remove",
+            icon: /*#__PURE__*/ React.createElement(ToolbarIcon, {
+                api: api,
+                name: "close"
+            }),
+            onClick: ()=>onChange(keys.filter((_, i)=>i !== index)),
+            size: "small",
+            type: "text"
+        }))), available.length > 0 ? /*#__PURE__*/ React.createElement(Select, {
+        className: "lf-table-toolbar-list-add",
+        "data-lf-toolbar-add": name,
+        onChange: (key)=>onChange([
+                ...keys,
+                key
+            ]),
+        options: available.map((column)=>({
+                value: column.key,
+                label: /*#__PURE__*/ React.createElement(ColumnTitle, {
+                    api: api,
+                    column: column
+                })
+            })),
+        placeholder: addLabel,
+        size: "small",
+        value: null
+    }) : null);
+}
+export default ToolbarList;

package/dist/features/toolbar/ToolbarSearch.js

@@ -0,0 +1,63 @@
+/*
+  Copyright 2020-2026 Lowdefy, Inc
+
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+*/ import React, { useEffect, useRef, useState } from 'react';
+import { Input } from 'antd';
+import ToolbarIcon from './ToolbarIcon.js';
+const DEBOUNCE_MS = 200;
+// Writes `view.search` 200ms after typing stops (clearing applies at once). A search set from
+// outside (SetState, a saved view) shows in the input unless the user is mid-edit.
+function ToolbarSearch({ api, searchRef }) {
+    const search = api.state.search ?? '';
+    const [text, setText] = useState(search);
+    const [seen, setSeen] = useState(search);
+    const timer = useRef(null);
+    if (seen !== search) {
+        setSeen(search);
+        if (timer.current === null) setText(search);
+    }
+    useEffect(()=>()=>clearTimeout(timer.current), []);
+    function apply(next) {
+        clearTimeout(timer.current);
+        timer.current = null;
+        api.actions.setSearch(next);
+    }
+    function onChange(event) {
+        const next = event.target.value;
+        setText(next);
+        if (next === '') {
+            apply(next);
+            return;
+        }
+        clearTimeout(timer.current);
+        timer.current = setTimeout(()=>apply(next), DEBOUNCE_MS);
+    }
+    return /*#__PURE__*/ React.createElement("span", {
+        className: "lf-table-toolbar-search",
+        "data-lf-toolbar-search": ""
+    }, /*#__PURE__*/ React.createElement(Input, {
+        allowClear: true,
+        "aria-label": "Search rows",
+        onChange: onChange,
+        placeholder: "Search",
+        prefix: /*#__PURE__*/ React.createElement(ToolbarIcon, {
+            api: api,
+            name: "search"
+        }),
+        ref: searchRef,
+        size: "small",
+        value: text
+    }));
+}
+export default ToolbarSearch;

package/dist/features/toolbar/ViewActions.js

@@ -0,0 +1,41 @@
+/*
+  Copyright 2020-2026 Lowdefy, Inc
+
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+*/ import React from 'react';
+import { Button } from 'antd';
+import SaveViewAs from './SaveViewAs.js';
+// The strip shown while the current view differs from the active saved view (Attio, Notion):
+// changes never silently edit a saved view. A locked view hides Save.
+function ViewActions({ api }) {
+    const { active } = api.views;
+    return /*#__PURE__*/ React.createElement("div", {
+        className: "lf-table-view-actions",
+        "data-lf-view-actions": ""
+    }, /*#__PURE__*/ React.createElement("span", {
+        className: "lf-table-view-actions-label"
+    }, "Unsaved changes"), active.locked ? null : /*#__PURE__*/ React.createElement(Button, {
+        "data-lf-view-action": "save",
+        onClick: ()=>api.views.save(),
+        size: "small",
+        type: "primary"
+    }, "Save"), /*#__PURE__*/ React.createElement(SaveViewAs, {
+        api: api
+    }), /*#__PURE__*/ React.createElement(Button, {
+        "data-lf-view-action": "discard",
+        onClick: ()=>api.views.discard(),
+        size: "small",
+        type: "text"
+    }, "Discard"));
+}
+export default ViewActions;

package/dist/features/toolbar/ViewTabLabel.js

@@ -0,0 +1,39 @@
+/*
+  Copyright 2020-2026 Lowdefy, Inc
+
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+*/ import React from 'react';
+import { type } from '@lowdefy/helpers';
+import ViewTabMenu from './ViewTabMenu.js';
+const countFormat = new Intl.NumberFormat();
+// A view tab: title, the view's count (queue tabs), the dirty dot and, on the active tab, its menu.
+function ViewTabLabel({ api, dirty, isActive, view }) {
+    return /*#__PURE__*/ React.createElement("span", {
+        className: "lf-table-view-tab",
+        "data-dirty": dirty ? '' : undefined,
+        "data-lf-view-tab": view.key
+    }, /*#__PURE__*/ React.createElement("span", {
+        className: "lf-table-view-tab-title"
+    }, view.title), type.isNumber(view.count) ? /*#__PURE__*/ React.createElement("span", {
+        className: "lf-table-view-tab-count",
+        "data-lf-view-count": ""
+    }, countFormat.format(view.count)) : null, dirty ? /*#__PURE__*/ React.createElement("span", {
+        "aria-label": "Unsaved changes",
+        className: "lf-table-view-dirty",
+        role: "img"
+    }) : null, isActive ? /*#__PURE__*/ React.createElement(ViewTabMenu, {
+        api: api,
+        view: view
+    }) : null);
+}
+export default ViewTabLabel;

package/dist/features/toolbar/ViewTabMenu.js

@@ -0,0 +1,48 @@
+/*
+  Copyright 2020-2026 Lowdefy, Inc
+
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+*/ import React from 'react';
+import { Dropdown } from 'antd';
+import ToolbarIcon from './ToolbarIcon.js';
+// The active tab's menu. Its trigger stops the click so the tab bar does not handle it.
+function ViewTabMenu({ api, view }) {
+    const items = [
+        {
+            key: 'delete',
+            label: 'Delete view',
+            danger: true,
+            disabled: view.locked
+        }
+    ];
+    return /*#__PURE__*/ React.createElement(Dropdown, {
+        menu: {
+            items,
+            onClick: ()=>api.views.remove(view)
+        },
+        placement: "bottomLeft",
+        trigger: [
+            'click'
+        ]
+    }, /*#__PURE__*/ React.createElement("button", {
+        "aria-label": "View options",
+        className: "lf-table-view-menu",
+        "data-lf-view-menu": "",
+        onClick: (event)=>event.stopPropagation(),
+        type: "button"
+    }, /*#__PURE__*/ React.createElement(ToolbarIcon, {
+        api: api,
+        name: "more"
+    })));
+}
+export default ViewTabMenu;

package/dist/features/toolbar/ViewTabs.js

@@ -0,0 +1,44 @@
+/*
+  Copyright 2020-2026 Lowdefy, Inc
+
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+*/ import React from 'react';
+import { Tabs } from 'antd';
+import ViewActions from './ViewActions.js';
+import ViewTabLabel from './ViewTabLabel.js';
+// Saved views as tabs (D7): selecting one loads its view; the dirty strip sits at the end of the
+// tab bar.
+function ViewTabs({ api }) {
+    const { active, dirty, items } = api.views;
+    return /*#__PURE__*/ React.createElement(Tabs, {
+        activeKey: active?.key,
+        className: "lf-table-views",
+        items: items.map((view)=>({
+                key: view.key,
+                label: /*#__PURE__*/ React.createElement(ViewTabLabel, {
+                    api: api,
+                    dirty: dirty && view === active,
+                    isActive: view === active,
+                    view: view
+                })
+            })),
+        onChange: (id)=>api.views.select(id),
+        size: "small",
+        tabBarExtraContent: dirty ? {
+            right: /*#__PURE__*/ React.createElement(ViewActions, {
+                api: api
+            })
+        } : null
+    });
+}
+export default ViewTabs;