@civicactions/cmsds-open-data-components 3.10.0-alpha.1 → 3.10.0-alpha.2

package/dist/main.js

@@ -1,6 +1,6 @@
 import "./main.css";
 import {jsx as $hgUW1$jsx, jsxs as $hgUW1$jsxs, Fragment as $hgUW1$Fragment} from "react/jsx-runtime";
-import {Accordion as $hgUW1$Accordion, AccordionItem as $hgUW1$AccordionItem, Button as $hgUW1$Button, CloseIconThin as $hgUW1$CloseIconThin, ArrowIcon as $hgUW1$ArrowIcon, Spinner as $hgUW1$Spinner, Alert as $hgUW1$Alert, Dialog as $hgUW1$Dialog, TextField as $hgUW1$TextField, Tooltip as $hgUW1$Tooltip, TooltipIcon as $hgUW1$TooltipIcon, Dropdown as $hgUW1$Dropdown, Choice as $hgUW1$Choice, Pagination as $hgUW1$Pagination, Badge as $hgUW1$Badge, Table as $hgUW1$Table, TableHead as $hgUW1$TableHead, TableRow as $hgUW1$TableRow, TableCell as $hgUW1$TableCell, TableBody as $hgUW1$TableBody, Tabs as $hgUW1$Tabs, TabPanel as $hgUW1$TabPanel} from "@cmsgov/design-system";
+import {Accordion as $hgUW1$Accordion, AccordionItem as $hgUW1$AccordionItem, Button as $hgUW1$Button, CloseIconThin as $hgUW1$CloseIconThin, ArrowIcon as $hgUW1$ArrowIcon, Spinner as $hgUW1$Spinner, Alert as $hgUW1$Alert, Dialog as $hgUW1$Dialog, TextField as $hgUW1$TextField, Tooltip as $hgUW1$Tooltip, TooltipIcon as $hgUW1$TooltipIcon, Dropdown as $hgUW1$Dropdown, Choice as $hgUW1$Choice, Pagination as $hgUW1$Pagination, Table as $hgUW1$Table, TableHead as $hgUW1$TableHead, TableRow as $hgUW1$TableRow, TableCell as $hgUW1$TableCell, TableBody as $hgUW1$TableBody, Tabs as $hgUW1$Tabs, TabPanel as $hgUW1$TabPanel, Badge as $hgUW1$Badge} from "@cmsgov/design-system";
 import $hgUW1$react, {createContext as $hgUW1$createContext, useState as $hgUW1$useState, useRef as $hgUW1$useRef, useEffect as $hgUW1$useEffect, useContext as $hgUW1$useContext, useMemo as $hgUW1$useMemo, useCallback as $hgUW1$useCallback} from "react";
 import {NavLink as $hgUW1$NavLink, Link as $hgUW1$Link, useNavigate as $hgUW1$useNavigate, useLocation as $hgUW1$useLocation, useSearchParams as $hgUW1$useSearchParams} from "react-router-dom";
 import $hgUW1$qs from "qs";
@@ -2348,6 +2348,67 @@ var $23763e27eda0e8d7$export$2e2bcd8739ae039 = $23763e27eda0e8d7$var$FixedSizeTH
 
 
 
+const $43a30d745a7bbc86$var$DataTableContext = /*#__PURE__*/ (0, $hgUW1$createContext)({
+    id: null
+});
+var $43a30d745a7bbc86$export$2e2bcd8739ae039 = $43a30d745a7bbc86$var$DataTableContext;
+
+
+
+
+
+// Create a defaults object for reusability
+const $ee0d4d4f34048447$var$DataTableActionsContextDefaults = {
+    columnOrder: [],
+    setColumnOrder: ()=>{},
+    columnVisibility: {},
+    setColumnVisibility: ()=>{},
+    page: 1,
+    setPage: ()=>{},
+    tableDensity: "normal",
+    setTableDensity: ()=>{}
+};
+const $ee0d4d4f34048447$export$f814ea079e65d8fe = /*#__PURE__*/ (0, $hgUW1$createContext)($ee0d4d4f34048447$var$DataTableActionsContextDefaults);
+// Define our reusable provider component
+const $ee0d4d4f34048447$var$DataTableActionsProvider = ({ children: children })=>{
+    // Set up all of the state
+    const { id: id, datasetTableControls: datasetTableControls } = (0, $hgUW1$useContext)((0, $43a30d745a7bbc86$export$2e2bcd8739ae039));
+    // a wrapper component to keep column state synced between full screen and regular modes
+    const localStorageData = id ? JSON.parse(localStorage.getItem(id)) : null;
+    const [page, setPage] = (0, $hgUW1$useState)(1);
+    const [columnOrder, setColumnOrder] = (0, $hgUW1$useState)(()=>{
+        if (datasetTableControls && localStorageData) return localStorageData.tableColumnOrder;
+        else return [];
+    });
+    const [columnVisibility, setColumnVisibility] = (0, $hgUW1$useState)(()=>{
+        if (datasetTableControls && localStorageData) return localStorageData.tableColumnVisibility;
+        else return {};
+    });
+    const [tableDensity, setTableDensity] = (0, $hgUW1$useState)("normal");
+    const providerValue = {
+        columnOrder: columnOrder,
+        setColumnOrder: setColumnOrder,
+        columnVisibility: columnVisibility,
+        setColumnVisibility: setColumnVisibility,
+        page: page,
+        setPage: setPage,
+        tableDensity: tableDensity,
+        setTableDensity: setTableDensity
+    };
+    return /*#__PURE__*/ (0, $hgUW1$jsx)($ee0d4d4f34048447$export$f814ea079e65d8fe.Provider, {
+        value: providerValue,
+        children: children
+    });
+};
+const $ee0d4d4f34048447$export$67f91330d613e8f4 = ({ children: children, value: value = $ee0d4d4f34048447$var$DataTableActionsContextDefaults })=>/*#__PURE__*/ (0, $hgUW1$jsx)($ee0d4d4f34048447$export$f814ea079e65d8fe.Provider, {
+        value: value,
+        children: children
+    });
+var $ee0d4d4f34048447$export$2e2bcd8739ae039 = $ee0d4d4f34048447$var$DataTableActionsProvider;
+
+
+
+
 
 
 
@@ -2417,10 +2478,6 @@ var $5fe94aeb50e0798b$export$2e2bcd8739ae039 = $5fe94aeb50e0798b$var$Card;
 
 
 
-const $ebda441784d176a5$var$ManageColumnsContext = /*#__PURE__*/ (0, $hgUW1$createContext)({});
-var $ebda441784d176a5$export$2e2bcd8739ae039 = $ebda441784d176a5$var$ManageColumnsContext;
-
-
 
 class $5d9e2ce238d53d29$var$ExcludeCheckboxKeyboardSensor extends (0, $hgUW1$KeyboardSensor) {
     // Custom function to exclude checkbox from keyboard dragging
@@ -2458,8 +2515,10 @@ class $5d9e2ce238d53d29$var$ExcludeCheckboxPointerSensor extends (0, $hgUW1$Poin
         }
     ];
 }
-const $5d9e2ce238d53d29$var$ManageColumns = ({ id: id, columns: columns, defaultColumnOrder: defaultColumnOrder, modalOpen: modalOpen, setModalOpen: setModalOpen })=>{
-    const { columnOrder: columnOrder, setColumnOrder: setColumnOrder, setColumnVisibility: setColumnVisibility } = (0, $hgUW1$useContext)((0, $ebda441784d176a5$export$2e2bcd8739ae039));
+const $5d9e2ce238d53d29$var$ManageColumns = ({ id: id, columns: columns, defaultColumnOrder: defaultColumnOrder })=>{
+    const { columnOrder: columnOrder, setColumnOrder: setColumnOrder, setColumnVisibility: setColumnVisibility, columnVisibility: contextColumnVisibility } = (0, $hgUW1$useContext)((0, $ee0d4d4f34048447$export$f814ea079e65d8fe));
+    const columnVisibility = contextColumnVisibility || {};
+    const [modalOpen, setModalOpen] = (0, $hgUW1$useState)(false);
     // maintain card state separately from table state - only sync states when the Save button is pressed
     const [cards, setCards] = (0, $hgUW1$useState)(columns.map((c)=>{
         return {
@@ -2516,137 +2575,164 @@ const $5d9e2ce238d53d29$var$ManageColumns = ({ id: id, columns: columns, default
             };
         }));
     };
-    return /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
-        className: `ds-c-dialog-wrap${modalOpen ? " open" : ""}`,
-        children: /*#__PURE__*/ (0, $hgUW1$jsxs)((0, $hgUW1$Dialog), {
-            heading: "Manage columns",
-            isOpen: modalOpen,
-            onExit: ()=>{
-                setModalOpen(false);
-                resetCards();
-            },
-            className: "dkan-manage-columns-dialog",
-            actions: /*#__PURE__*/ (0, $hgUW1$jsxs)("div", {
-                className: "ds-u-display--flex ds-u-justify-content--between ds-u-flex-wrap--wrap ds-u-padding-x--3 ds-u-padding-bottom--1 ds-u-sm-padding-bottom--3",
+    const hiddenColumns = Object.keys(columnVisibility).filter((key)=>columnVisibility[key] === false).length;
+    return /*#__PURE__*/ (0, $hgUW1$jsxs)("div", {
+        className: "dkan-manage-columns-wrapper",
+        children: [
+            /*#__PURE__*/ (0, $hgUW1$jsxs)("button", {
+                "aria-label": "Manage columns - Opens in a dialog",
+                className: "dkan-filter-dataset-toolbar-button ds-u-color--primary ds-u-text-decoration--underline ds-u-font-size--sm ds-u-padding-x--2 ds-u-margin--0 ds-u-border--0 ds-u-fill--transparent",
+                onClick: ()=>{
+                    setModalOpen(true);
+                },
                 children: [
-                    /*#__PURE__*/ (0, $hgUW1$jsxs)("div", {
-                        className: "ds-l-col--12 ds-l-sm-col--auto ds-u-padding-x--0",
+                    /*#__PURE__*/ (0, $hgUW1$jsx)("i", {
+                        className: "fa fa-columns ds-u-margin-right--1"
+                    }),
+                    /*#__PURE__*/ (0, $hgUW1$jsxs)("span", {
                         children: [
-                            /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Button), {
-                                variation: "solid",
-                                className: "ds-l-col--6 ds-l-sm-col--auto",
-                                onClick: ()=>{
-                                    setModalOpen(false);
-                                    // update table state
-                                    // Visibility
-                                    // This code is building a new columnVisibility state object from the card state and doing a single setState on the table
-                                    // vs doing a setState on every changed column individually
-                                    const newColumnVisibility = Object.fromEntries(cards.map((c)=>Object.values(c)));
-                                    setColumnVisibility(newColumnVisibility);
-                                    // Card order
-                                    const newCardOrder = cards.map((c)=>{
-                                        return c.id;
-                                    });
-                                    setColumnOrder(newCardOrder);
-                                    // save to localStorage
-                                    const localStorageData = {
-                                        tableColumnOrder: newCardOrder,
-                                        tableColumnVisibility: newColumnVisibility
-                                    };
-                                    localStorage.setItem(id, JSON.stringify(localStorageData));
-                                },
-                                children: "Save"
+                            /*#__PURE__*/ (0, $hgUW1$jsx)("span", {
+                                className: "ds-u-display--none ds-u-lg-display--inline-block",
+                                children: "Manage Columns"
                             }),
-                            /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Button), {
-                                variation: "ghost",
-                                className: "ds-l-col--6 ds-l-sm-col--auto",
-                                onClick: ()=>{
-                                    setModalOpen(false);
-                                    resetCards();
-                                },
-                                children: "Cancel"
+                            hiddenColumns ? ` (${hiddenColumns})` : ""
+                        ]
+                    })
+                ]
+            }),
+            /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
+                className: `ds-c-dialog-wrap${modalOpen ? " open" : ""}`,
+                children: /*#__PURE__*/ (0, $hgUW1$jsxs)((0, $hgUW1$Dialog), {
+                    heading: "Manage columns",
+                    isOpen: modalOpen,
+                    onExit: ()=>{
+                        setModalOpen(false);
+                        resetCards();
+                    },
+                    className: "dkan-manage-columns-dialog",
+                    actions: /*#__PURE__*/ (0, $hgUW1$jsxs)("div", {
+                        className: "ds-u-display--flex ds-u-justify-content--between ds-u-flex-wrap--wrap ds-u-padding-x--3 ds-u-padding-bottom--1 ds-u-sm-padding-bottom--3",
+                        children: [
+                            /*#__PURE__*/ (0, $hgUW1$jsxs)("div", {
+                                className: "ds-l-col--12 ds-l-sm-col--auto ds-u-padding-x--0",
+                                children: [
+                                    /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Button), {
+                                        variation: "solid",
+                                        className: "ds-l-col--6 ds-l-sm-col--auto",
+                                        onClick: ()=>{
+                                            setModalOpen(false);
+                                            // update table state
+                                            // Visibility
+                                            // This code is building a new columnVisibility state object from the card state and doing a single setState on the table
+                                            // vs doing a setState on every changed column individually
+                                            const newColumnVisibility = Object.fromEntries(cards.map((c)=>Object.values(c)));
+                                            setColumnVisibility(newColumnVisibility);
+                                            // Card order
+                                            const newCardOrder = cards.map((c)=>{
+                                                return c.id;
+                                            });
+                                            setColumnOrder(newCardOrder);
+                                            // save to localStorage
+                                            const localStorageData = {
+                                                tableColumnOrder: newCardOrder,
+                                                tableColumnVisibility: newColumnVisibility
+                                            };
+                                            localStorage.setItem(id, JSON.stringify(localStorageData));
+                                        },
+                                        children: "Save"
+                                    }),
+                                    /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Button), {
+                                        variation: "ghost",
+                                        className: "ds-l-col--6 ds-l-sm-col--auto",
+                                        onClick: ()=>{
+                                            setModalOpen(false);
+                                            resetCards();
+                                        },
+                                        children: "Cancel"
+                                    })
+                                ]
+                            }),
+                            /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
+                                className: "ds-l-col--12 ds-l-sm-col--auto ds-u-padding-x--0 ds-u-padding-top--1 ds-u-sm-padding-y--0",
+                                children: /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Button), {
+                                    variation: "ghost",
+                                    className: "ds-l-col--6 ds-l-sm-col--auto",
+                                    onClick: ()=>{
+                                        // reset to default column order and set all cards to visible
+                                        // do not save this to the table state until the "Save" button is clicked
+                                        setCards(defaultColumnOrder.map((column)=>{
+                                            const card = cards.filter((c)=>c.id === column)[0];
+                                            return {
+                                                ...card,
+                                                visible: true
+                                            };
+                                        }));
+                                    },
+                                    children: "Reset Columns"
+                                })
                             })
                         ]
                     }),
-                    /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
-                        className: "ds-l-col--12 ds-l-sm-col--auto ds-u-padding-x--0 ds-u-padding-top--1 ds-u-sm-padding-y--0",
-                        children: /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Button), {
-                            variation: "ghost",
-                            className: "ds-l-col--6 ds-l-sm-col--auto",
-                            onClick: ()=>{
-                                // reset to default column order and set all cards to visible
-                                // do not save this to the table state until the "Save" button is clicked
-                                setCards(defaultColumnOrder.map((column)=>{
-                                    const card = cards.filter((c)=>c.id === column)[0];
+                    children: [
+                        /*#__PURE__*/ (0, $hgUW1$jsx)("p", {
+                            id: "reorder-help",
+                            className: "ds-u-padding-x--3",
+                            children: "Activate the reorder button and use the arrow keys to reorder the list or use your mouse to drag/reorder. Press escape to cancel the reordering."
+                        }),
+                        /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Choice), {
+                            checked: cardHiddenColumns === 0,
+                            type: "checkbox",
+                            onChange: ()=>{
+                                setCards(cards.map((c)=>{
                                     return {
-                                        ...card,
-                                        visible: true
+                                        ...c,
+                                        visible: cardHiddenColumns !== 0
                                     };
                                 }));
                             },
-                            children: "Reset Columns"
-                        })
-                    })
-                ]
-            }),
-            children: [
-                /*#__PURE__*/ (0, $hgUW1$jsx)("p", {
-                    id: "reorder-help",
-                    className: "ds-u-padding-x--3",
-                    children: "Activate the reorder button and use the arrow keys to reorder the list or use your mouse to drag/reorder. Press escape to cancel the reordering."
-                }),
-                /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Choice), {
-                    checked: cardHiddenColumns === 0,
-                    type: "checkbox",
-                    onChange: ()=>{
-                        setCards(cards.map((c)=>{
-                            return {
-                                ...c,
-                                visible: cardHiddenColumns !== 0
-                            };
-                        }));
-                    },
-                    className: "ds-u-padding-x--3",
-                    name: "",
-                    value: "",
-                    label: "Select all",
-                    hint: cardHiddenColumns && cardHiddenColumns + " columns hidden"
-                }),
-                /*#__PURE__*/ (0, $hgUW1$jsxs)("div", {
-                    className: "ds-u-display--flex ds-u-justify-content--between ds-u-font-weight--bold ds-u-padding-y--2 ds-u-padding-x--3 ds-u-border-y--1 ds-u-margin-top--2",
-                    children: [
-                        /*#__PURE__*/ (0, $hgUW1$jsx)("span", {
-                            children: "Display column"
+                            className: "ds-u-padding-x--3",
+                            name: "",
+                            value: "",
+                            label: "Select all",
+                            hint: cardHiddenColumns && cardHiddenColumns + " columns hidden"
                         }),
-                        /*#__PURE__*/ (0, $hgUW1$jsx)("span", {
-                            children: "Reorder"
-                        })
-                    ]
-                }),
-                /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$DndContext), {
-                    collisionDetection: (0, $hgUW1$closestCenter),
-                    modifiers: [
-                        (0, $hgUW1$restrictToVerticalAxis)
-                    ],
-                    sensors: sensors,
-                    onDragEnd: handleDragEnd,
-                    children: /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$SortableContext), {
-                        items: cardOrder,
-                        strategy: (0, $hgUW1$verticalListSortingStrategy),
-                        children: /*#__PURE__*/ (0, $hgUW1$jsx)("ul", {
-                            className: "dkan-manage-columns-list",
-                            children: cards.map((card)=>{
-                                return /*#__PURE__*/ (0, $hgUW1$jsx)((0, $5fe94aeb50e0798b$export$2e2bcd8739ae039), {
-                                    id: card.id,
-                                    visible: card.visible,
-                                    updateVisibility: updateVisibility
-                                }, card.id);
+                        /*#__PURE__*/ (0, $hgUW1$jsxs)("div", {
+                            className: "ds-u-display--flex ds-u-justify-content--between ds-u-font-weight--bold ds-u-padding-y--2 ds-u-padding-x--3 ds-u-border-y--1 ds-u-margin-top--2",
+                            children: [
+                                /*#__PURE__*/ (0, $hgUW1$jsx)("span", {
+                                    children: "Display column"
+                                }),
+                                /*#__PURE__*/ (0, $hgUW1$jsx)("span", {
+                                    children: "Reorder"
+                                })
+                            ]
+                        }),
+                        /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$DndContext), {
+                            collisionDetection: (0, $hgUW1$closestCenter),
+                            modifiers: [
+                                (0, $hgUW1$restrictToVerticalAxis)
+                            ],
+                            sensors: sensors,
+                            onDragEnd: handleDragEnd,
+                            children: /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$SortableContext), {
+                                items: cardOrder,
+                                strategy: (0, $hgUW1$verticalListSortingStrategy),
+                                children: /*#__PURE__*/ (0, $hgUW1$jsx)("ul", {
+                                    className: "dkan-manage-columns-list",
+                                    children: cards.map((card)=>{
+                                        return /*#__PURE__*/ (0, $hgUW1$jsx)((0, $5fe94aeb50e0798b$export$2e2bcd8739ae039), {
+                                            id: card.id,
+                                            visible: card.visible,
+                                            updateVisibility: updateVisibility
+                                        }, card.id);
+                                    })
+                                })
                             })
                         })
-                    })
+                    ]
                 })
-            ]
-        })
+            })
+        ]
     });
 };
 var $5d9e2ce238d53d29$export$2e2bcd8739ae039 = $5d9e2ce238d53d29$var$ManageColumns;
@@ -2665,139 +2751,111 @@ var $5d9e2ce238d53d29$export$2e2bcd8739ae039 = $5d9e2ce238d53d29$var$ManageColum
 
 
 
+function $a35cf16d1488f54e$export$1147582dfae658c6(columns, schema) {
+    return columns.map((column)=>({
+            header: schema && schema.fields[column].description ? schema.fields[column].description : column,
+            accessor: column
+        }));
+}
+const $a35cf16d1488f54e$var$DatasetTable = ({ isModal: isModal = false, closeFullScreenModal: closeFullScreenModal, showCopyLinkButton: showCopyLinkButton = true, showDownloadFilteredDataButton: showDownloadFilteredDataButton = true, showDownloadFullDataButton: showDownloadFullDataButton = true, showStoredQueryDownloadButton: showStoredQueryDownloadButton = false })=>{
+    const { id: id, distribution: distribution, resource: resource, rootUrl: rootUrl, customColumns: customColumns = [], dataDictionaryBanner: dataDictionaryBanner } = (0, $hgUW1$useContext)((0, $43a30d745a7bbc86$export$2e2bcd8739ae039));
+    const { page: page, setPage: setPage, tableDensity: tableDensity } = (0, $hgUW1$useContext)((0, $ee0d4d4f34048447$export$f814ea079e65d8fe));
+    const defaultPageSize = 10;
+    const customColumnHeaders = (0, $7264a673914aa746$export$8049e8f40a9bdfb8)(customColumns, resource.columns, resource.schema[distribution.identifier]);
+    const columns = customColumnHeaders ? customColumnHeaders : $a35cf16d1488f54e$export$1147582dfae658c6(resource.columns, resource.schema[id]);
+    const { limit: limit, setOffset: setOffset } = resource;
+    const pageSize = limit ? limit : defaultPageSize;
+    const downloadURL = `${rootUrl}/datastore/query/${id}/0/download?${(0, $hgUW1$qs).stringify({
+        conditions: resource.conditions
+    }, {
+        encode: true
+    })}&format=csv`;
+    if (Object.keys(resource).length && columns.length && resource.schema && Object.keys(distribution).length) return /*#__PURE__*/ (0, $hgUW1$jsxs)((0, $hgUW1$Fragment), {
+        children: [
+            /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
+                className: isModal ? "dkan-datatable-fullscreen-mode" : "",
+                children: /*#__PURE__*/ (0, $hgUW1$jsx)((0, $d98f94c79ddf4e0e$export$2e2bcd8739ae039), {
+                    canResize: true,
+                    columns: columns,
+                    sortTransform: (0, $aa4450dcbeef3ac0$export$385a5aba38cc3325),
+                    tablePadding: tableDensity === "normal" ? "ds-u-padding-y--2" : tableDensity === "compact" ? "ds-u-padding-y--1" : "ds-u-padding-y--3",
+                    loading: resource.loading,
+                    isModal: isModal,
+                    closeFullScreenModal: closeFullScreenModal,
+                    downloadURL: downloadURL,
+                    unfilteredDownloadURL: distribution.data.downloadURL,
+                    setPage: setPage,
+                    showCopyLinkButton: showCopyLinkButton,
+                    showDownloadFilteredDataButton: showDownloadFilteredDataButton,
+                    showDownloadFullDataButton: showDownloadFullDataButton,
+                    showStoredQueryDownloadButton: showStoredQueryDownloadButton
+                })
+            }),
+            !resource.loading && resource.count !== null && /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
+                className: "ds-u-display--flex ds-u-flex-wrap--wrap ds-u-justify-content--end ds-u-md-justify-content--between ds-u-margin-top--2 ds-u-align-items--center",
+                children: /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Pagination), {
+                    totalPages: Math.ceil(resource.count ? resource.count / pageSize : 1),
+                    currentPage: Number(page),
+                    onPageChange: (evt, page)=>{
+                        evt.preventDefault();
+                        setOffset((page - 1) * limit);
+                        setPage(page);
+                    },
+                    renderHref: (p)=>`?page=${p}`,
+                    className: "ds-l-col--12 ds-u-padding-x--0"
+                })
+            })
+        ]
+    });
+    else return /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Spinner), {
+        "aria-valuetext": "Dataset loading",
+        role: "status",
+        className: "ds-u-margin--3"
+    });
+};
+var $a35cf16d1488f54e$export$2e2bcd8739ae039 = $a35cf16d1488f54e$var$DatasetTable;
 
 
-const $6380a4a580b24362$var$DataTableHeader = ({ resource: resource, downloadURL: downloadURL, unfilteredDownloadURL: unfilteredDownloadURL, setPage: setPage, showCopyLinkButton: showCopyLinkButton = true, showDownloadFilteredDataButton: showDownloadFilteredDataButton = true, showDownloadFullDataButton: showDownloadFullDataButton = true, showStoredQueryDownloadButton: showStoredQueryDownloadButton = false })=>{
-    const { limit: limit, offset: offset, count: count, conditions: conditions, setLimit: setLimit, setOffset: setOffset } = resource;
-    const intCount = count ? count : 0;
-    const rowOptions = [
-        10,
-        25,
-        50,
-        100
-    ];
+const $16bd41951b91f02d$var$FullScreenDataTable = ({ isModal: isModal, closeFullScreenModal: closeFullScreenModal })=>{
+    const [modalOpen, setModalOpen] = (0, $hgUW1$useState)(false);
+    if (isModal) return null;
     return /*#__PURE__*/ (0, $hgUW1$jsxs)("div", {
-        className: "ds-u-display--flex ds-u-flex-wrap--wrap ds-u-justify-content--between",
+        className: "dkan-fullscreen-data-table-wrapper",
         children: [
-            /*#__PURE__*/ (0, $hgUW1$jsxs)("div", {
-                className: "dc-c-resource-header--buttons ds-u-display--flex ds-u-flex-wrap--wrap ds-u-justify-content--end ds-l-col--12 ds-u-margin-top--2 ds-u-padding-x--0",
+            /*#__PURE__*/ (0, $hgUW1$jsxs)("button", {
+                "aria-label": isModal ? "Close Full Screen dialog" : "Full Screen mode - Opens in a dialog",
+                className: "dkan-filter-dataset-toolbar-button ds-u-color--primary ds-u-text-decoration--underline ds-u-font-size--sm ds-u-padding-x--2 ds-u-margin--0 ds-u-border--0 ds-u-fill--transparent",
+                onClick: ()=>{
+                    if (isModal) closeFullScreenModal();
+                    else setModalOpen(true);
+                },
                 children: [
-                    showCopyLinkButton && /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
-                        className: "ds-l-col--12 ds-l-sm-col--auto ds-u-padding-x--0 ds-u-margin-bottom--2",
-                        children: conditions && conditions.length ? /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Tooltip), {
-                            onOpen: ()=>{
-                                navigator.clipboard.writeText(window.location.href);
-                            },
-                            className: "ds-c-button ds-u-text-align--center ds-u-display--inline-block ds-l-col--12",
-                            placement: "bottom",
-                            dialog: true,
-                            ariaLabel: "Copy link to filtered data",
-                            title: "Link copied to clipboard",
-                            "aria-disabled": !conditions || conditions.length === 0,
-                            children: /*#__PURE__*/ (0, $hgUW1$jsxs)("span", {
-                                className: "ds-u-font-weight--semibold ds-u-margin-left--1 ds-u-padding--0",
-                                children: [
-                                    /*#__PURE__*/ (0, $hgUW1$jsx)("i", {
-                                        className: "fas fa-copy"
-                                    }),
-                                    " Copy link to filtered data"
-                                ]
-                            })
-                        }) : /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Button), {
-                            "aria-disabled": true,
-                            "aria-label": "Copy link to filtered data",
-                            className: "ds-c-button ds-u-text-align--center ds-u-display--inline-block ds-l-col--12",
-                            children: /*#__PURE__*/ (0, $hgUW1$jsxs)("span", {
-                                className: "ds-u-font-weight--semibold ds-u-margin-left--1 ds-u-padding--0",
-                                children: [
-                                    /*#__PURE__*/ (0, $hgUW1$jsx)("i", {
-                                        className: "fas fa-copy"
-                                    }),
-                                    " Copy link to filtered data"
-                                ]
-                            })
-                        })
+                    /*#__PURE__*/ (0, $hgUW1$jsx)("i", {
+                        className: `fa ${isModal ? "fa-compress" : "fa-expand"} ds-u-margin-right--1`
                     }),
-                    /*#__PURE__*/ (0, $hgUW1$jsxs)("div", {
-                        className: "ds-l-col--12 ds-l-md-col--auto ds-u-padding-x--0 ds-u-display--flex ds-u-flex-wrap--wrap ds-u-justify-content--end",
-                        children: [
-                            (showDownloadFilteredDataButton || showStoredQueryDownloadButton) && /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
-                                className: "ds-l-col--12 ds-l-sm-col--auto ds-u-padding-x--0 ds-u-sm-margin-left--2 ds-u-margin-bottom--2",
-                                children: /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Button), {
-                                    className: "ds-u-text-align--center ds-u-font-weight--normal ds-u-font-size--base ds-u-margin-right--1 ds-u-display--inline-block ds-l-col--12",
-                                    href: downloadURL,
-                                    "aria-disabled": !conditions || conditions.length === 0,
-                                    children: /*#__PURE__*/ (0, $hgUW1$jsxs)("span", {
-                                        className: "ds-u-font-weight--semibold ds-u-margin-left--1 ds-u-padding--0",
-                                        children: [
-                                            /*#__PURE__*/ (0, $hgUW1$jsx)("i", {
-                                                className: "fas fa-file-csv"
-                                            }),
-                                            " ",
-                                            showDownloadFilteredDataButton ? `Download filtered data (CSV)` : `Download stored query data (CSV)`
-                                        ]
-                                    })
-                                })
-                            }),
-                            showDownloadFullDataButton && /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
-                                className: "ds-l-col--12 ds-l-sm-col--auto ds-u-padding-x--0 ds-u-sm-margin-left--2 ds-u-margin-bottom--2",
-                                children: /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Button), {
-                                    className: "ds-u-text-align--center ds-u-font-weight--normal ds-u-font-size--base ds-u-margin-right--1 ds-u-display--inline-block ds-l-col--12",
-                                    href: unfilteredDownloadURL,
-                                    children: /*#__PURE__*/ (0, $hgUW1$jsxs)("span", {
-                                        className: "ds-u-font-weight--semibold ds-u-margin-left--1 ds-u-padding--0",
-                                        children: [
-                                            /*#__PURE__*/ (0, $hgUW1$jsx)("i", {
-                                                className: "fas fa-file-csv"
-                                            }),
-                                            " Download full dataset (CSV)"
-                                        ]
-                                    })
-                                })
-                            })
-                        ]
+                    /*#__PURE__*/ (0, $hgUW1$jsx)("span", {
+                        className: "ds-u-display--none ds-u-lg-display--inline-block",
+                        children: isModal ? "Exit Full Screen" : "Full Screen"
                     })
                 ]
             }),
-            /*#__PURE__*/ (0, $hgUW1$jsxs)("div", {
-                className: "ds-l-col--12 ds-u-display--flex ds-u-align-items--end ds-u-flex-direction--row-reverse ds-u-sm-flex-direction--row ds-u-padding-x--0 ds-u-margin-bottom--2 ds-u-flex-wrap--wrap",
-                children: [
-                    /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
-                        className: "ds-l-col--12 ds-l-sm-col--8 ds-u-padding-x--0",
-                        children: !resource.loading && resource.count !== null && /*#__PURE__*/ (0, $hgUW1$jsx)((0, $2ed0091f7e32d1e6$export$2e2bcd8739ae039), {
-                            totalRows: intCount,
-                            limit: limit,
-                            offset: offset
-                        })
-                    }),
-                    /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
-                        className: "ds-l-col--12 ds-l-sm-col--4 ds-u-display--flex ds-u-justify-content--end ds-u-padding-x--0",
-                        children: /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
-                            children: /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Dropdown), {
-                                options: rowOptions.map((row)=>({
-                                        label: row.toString(),
-                                        value: row
-                                    })),
-                                size: "medium",
-                                label: "Rows per page:",
-                                labelClassName: "ds-u-margin-top--0",
-                                name: "datatable_rows_per_page",
-                                onChange: (e)=>{
-                                    setLimit(parseInt(e.target.value));
-                                    setPage(1);
-                                    setOffset(0);
-                                },
-                                value: limit.toString(),
-                                defaultValue: limit.toString()
-                            })
-                        })
+            /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
+                className: `ds-c-dialog-wrap${modalOpen ? " open" : ""}`,
+                children: /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Dialog), {
+                    heading: "Dataset Explorer",
+                    isOpen: modalOpen,
+                    onExit: ()=>setModalOpen(false),
+                    className: "dkan-full-screen-dataset-dialog",
+                    children: /*#__PURE__*/ (0, $hgUW1$jsx)((0, $a35cf16d1488f54e$export$2e2bcd8739ae039), {
+                        isModal: true,
+                        closeFullScreenModal: ()=>setModalOpen(false)
                     })
-                ]
+                })
             })
         ]
     });
 };
-var $6380a4a580b24362$export$2e2bcd8739ae039 = $6380a4a580b24362$var$DataTableHeader;
+var $16bd41951b91f02d$export$2e2bcd8739ae039 = $16bd41951b91f02d$var$FullScreenDataTable;
 
 
 
@@ -2809,96 +2867,27 @@ var $6380a4a580b24362$export$2e2bcd8739ae039 = $6380a4a580b24362$var$DataTableHe
 
 
 
-const $bef7bff2823feea2$var$QueryTitle = ({ conditions: conditions, schema: schema, customColumns: customColumns })=>{
-    const { fields: fields } = schema;
-    const prependedMessage = /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Fragment), {
-        children: "Data filters: "
-    });
-    if (!conditions || !conditions.length) return /*#__PURE__*/ (0, $hgUW1$jsxs)("p", {
-        className: "ds-u-margin-y--0",
-        children: [
-            prependedMessage,
-            " none"
-        ]
-    });
-    function formatValue(text, property) {
-        if (customColumns && customColumns.length > 0) {
-            let newValue = text;
-            let customColumn = customColumns.find((c)=>c.accessor === property);
-            if (customColumn && customColumn.cell) return customColumn.cell({
-                value: text
-            });
-            return text;
-        } else return text;
-    }
-    return /*#__PURE__*/ (0, $hgUW1$jsxs)("span", {
-        className: "dc-querybuilder-title",
-        children: [
-            /*#__PURE__*/ (0, $hgUW1$jsx)("p", {
-                className: "ds-u-margin-y--0",
-                children: prependedMessage
-            }),
-            conditions.map((c)=>{
-                const field = fields[c.property];
-                const description = field && field.description ? field.description : c.property;
-                const operator = (0, $7264a673914aa746$export$5f89a5ae87bc48e1).find((op)=>op.value === c.operator);
-                const cleanedText = (0, $7264a673914aa746$export$6b5e57d20078142b)(c.value);
-                const formattedText = formatValue(cleanedText, c.property);
-                return /*#__PURE__*/ (0, $hgUW1$jsxs)("span", {
-                    className: "ds-u-fill--background ds-u-padding--1 ds-u-margin-y--1 ds-u-display--inline-block ds-u-font-weight--semibold",
-                    children: [
-                        /*#__PURE__*/ (0, $hgUW1$jsx)("span", {
-                            className: "ds-u-font-weight--bold",
-                            children: description
-                        }),
-                        " ",
-                        /*#__PURE__*/ (0, $hgUW1$jsx)("span", {
-                            className: "ds-u-font-weight--normal",
-                            children: operator.label.toUpperCase()
-                        }),
-                        " ",
-                        /*#__PURE__*/ (0, $hgUW1$jsx)("span", {
-                            className: "ds-u-color--success",
-                            children: formattedText
-                        })
-                    ]
-                });
-            }).reduce((prev, curr)=>[
-                    prev,
-                    /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Badge), {
-                        className: "ds-u-margin-x--1",
-                        variation: "info",
-                        children: "AND"
-                    }),
-                    curr
-                ])
-        ]
-    });
-};
-var $bef7bff2823feea2$export$2e2bcd8739ae039 = $bef7bff2823feea2$var$QueryTitle;
-
-
-
-
-
-
-
-
-
-function $6369abf590ca298f$var$getStartDate(condition, schema, id) {
-    if (schema[id].fields[condition.property].mysql_type === "date") {
-        const newDate = new Date(condition.value.toString());
-        if (newDate instanceof Date && !isNaN(newDate.getTime())) return newDate;
-    }
-    return new Date();
-}
-const $6369abf590ca298f$var$QueryRow = ({ id: id, condition: condition, index: index, update: update, remove: remove, propertyOptions: propertyOptions, schema: schema })=>{
-    const [operator, setOperator] = (0, $hgUW1$useState)(condition.operator);
-    const [property, setProperty] = (0, $hgUW1$useState)(condition.property);
-    const [value, setValue] = (0, $hgUW1$useState)(condition.value);
-    const [startDate, setStartDate] = (0, $hgUW1$react).useState($6369abf590ca298f$var$getStartDate(condition, schema, id));
-    const xl = (0, $hgUW1$useMediaQuery)({
-        minWidth: 1280
+
+
+
+
+
+
+
+function $eadd6431fddf4b6c$var$getStartDate(condition, schema, id) {
+    if (schema[id].fields[condition.property].mysql_type === "date") {
+        const newDate = new Date(condition.value.toString());
+        if (newDate instanceof Date && !isNaN(newDate.getTime())) return newDate;
+    }
+    return new Date();
+}
+const $eadd6431fddf4b6c$var$FilterItem = ({ id: id, condition: condition, index: index, update: update, remove: remove, propertyOptions: propertyOptions, schema: schema, className: className = "" })=>{
+    const [operator, setOperator] = (0, $hgUW1$useState)(condition.operator);
+    const [property, setProperty] = (0, $hgUW1$useState)(condition.property);
+    const [value, setValue] = (0, $hgUW1$useState)(condition.value);
+    const [startDate, setStartDate] = (0, $hgUW1$react).useState($eadd6431fddf4b6c$var$getStartDate(condition, schema, id));
+    const xl = (0, $hgUW1$useMediaQuery)({
+        minWidth: 1280
     });
     (0, $hgUW1$useEffect)(()=>{
         if (property !== condition.property) {
@@ -2933,102 +2922,95 @@ const $6369abf590ca298f$var$QueryRow = ({ id: id, condition: condition, index: i
         value
     ]);
     return /*#__PURE__*/ (0, $hgUW1$jsxs)("fieldset", {
-        className: "ds-u-display--flex ds-u-flex-wrap--wrap ds-u-justify-content--between ds-u-align-items--center ds-u-border--0",
+        className: `dkan-filter-dataset-control ds-u-padding-x--2 ds-u-md-padding-x--3 ds-u-padding-y--1 ds-u-margin-top--05${className !== "" ? ` ${className}` : ""}`,
         children: [
-            /*#__PURE__*/ (0, $hgUW1$jsxs)("div", {
-                className: "ds-l-col--12 ds-l-md-col--8 ds-u-display--flex ds-u-justify-content--between ds-u-padding-x--0",
-                children: [
-                    /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Dropdown), {
-                        options: propertyOptions,
-                        className: "ds-l-col--8 ds-u-padding-left--0",
-                        value: property,
-                        label: "Column Name",
-                        name: `${condition.key}_property`,
-                        onChange: (e)=>setProperty(e.target.value)
-                    }),
-                    /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Dropdown), {
-                        options: (0, $7264a673914aa746$export$2b9377795161999)(schema[id].fields[property].mysql_type),
-                        className: "ds-l-col--4 ds-u-padding-x--0",
-                        value: operator,
-                        label: "Operator",
-                        name: `${condition.key}_operator`,
-                        onChange: (e)=>setOperator(e.target.value)
-                    })
-                ]
+            /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Dropdown), {
+                options: propertyOptions,
+                className: "ds-u-padding-x--0",
+                value: property,
+                label: "Column Name",
+                name: `${condition.key}_property`,
+                onChange: (e)=>setProperty(e.target.value)
             }),
-            /*#__PURE__*/ (0, $hgUW1$jsxs)("div", {
-                className: "ds-l-col--12 ds-l-md-col--4 ds-u-padding-x--0 ds-u-md-padding-left--2 ds-u-display--flex ds-u-justify-content--between",
+            /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Dropdown), {
+                options: (0, $7264a673914aa746$export$2b9377795161999)(schema[id].fields[property].mysql_type),
+                className: "ds-u-padding-x--0",
+                value: operator,
+                label: "Condition",
+                name: `${condition.key}_operator`,
+                onChange: (e)=>setOperator(e.target.value)
+            }),
+            schema[id].fields[property].mysql_type === "date" ? /*#__PURE__*/ (0, $hgUW1$jsxs)("div", {
                 children: [
-                    schema[id].fields[property].mysql_type === "date" ? /*#__PURE__*/ (0, $hgUW1$jsxs)("div", {
-                        children: [
-                            /*#__PURE__*/ (0, $hgUW1$jsx)("label", {
-                                className: "ds-c-label",
-                                htmlFor: `${condition.key}_date_value`,
-                                id: `${condition.key}_date_value-label`,
-                                children: /*#__PURE__*/ (0, $hgUW1$jsx)("span", {
-                                    children: "Value"
-                                })
-                            }),
-                            /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$reactdatepicker), {
-                                name: `${condition.key}_date_value`,
-                                selected: (0, $7264a673914aa746$export$e284ae5d89467c8f)(startDate),
-                                onChange: (date)=>{
-                                    setStartDate(date);
-                                    setValue(date.toJSON().slice(0, 10));
-                                },
-                                showMonthDropdown: true,
-                                showYearDropdown: true,
-                                dropdownMode: "select",
-                                className: "ds-c-field",
-                                withPortal: true
-                            })
-                        ]
-                    }) : /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$TextField), {
-                        className: "ds-l-col--11 ds-u-padding-x--0",
-                        label: "Value",
-                        name: `${condition.key}_value`,
-                        value: (0, $7264a673914aa746$export$6b5e57d20078142b)(value, operator),
-                        onChange: (e)=>setValue(e.target.value)
-                    }),
-                    /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Button), {
-                        variation: "ghost",
-                        size: "small",
-                        className: "ds-u-margin-top--6 ds-u-padding-right--0",
-                        "aria-label": "Delete filter",
-                        onClick: ()=>remove(index),
+                    /*#__PURE__*/ (0, $hgUW1$jsx)("label", {
+                        className: "ds-c-label",
+                        htmlFor: `${condition.key}_date_value`,
+                        id: `${condition.key}_date_value-label`,
                         children: /*#__PURE__*/ (0, $hgUW1$jsx)("span", {
-                            className: "fas fa-trash"
+                            children: "Value"
                         })
+                    }),
+                    /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$reactdatepicker), {
+                        name: `${condition.key}_date_value`,
+                        selected: (0, $7264a673914aa746$export$e284ae5d89467c8f)(startDate),
+                        onChange: (date)=>{
+                            setStartDate(date);
+                            setValue(date.toJSON().slice(0, 10));
+                        },
+                        showMonthDropdown: true,
+                        showYearDropdown: true,
+                        dropdownMode: "select",
+                        className: "ds-c-field",
+                        withPortal: true
                     })
                 ]
+            }) : /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$TextField), {
+                className: "ds-u-padding-x--0",
+                label: "Value",
+                name: `${condition.key}_value`,
+                value: (0, $7264a673914aa746$export$6b5e57d20078142b)(value, operator),
+                onChange: (e)=>setValue(e.target.value),
+                placeholder: "Enter value"
+            }),
+            /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Button), {
+                variation: "ghost",
+                size: "small",
+                className: "dkan-delete-dataset-filter-button ds-u-padding-x--0 ds-u-margin-left--05 ds-u-md-margin-top--0 ds-u-border--1 ds-u-border--dark ds-u-color--black",
+                "aria-label": "Delete filter",
+                onClick: ()=>remove(index),
+                children: /*#__PURE__*/ (0, $hgUW1$jsx)("span", {
+                    className: "far fa-trash"
+                })
             })
         ]
     });
 };
-var $6369abf590ca298f$export$2e2bcd8739ae039 = $6369abf590ca298f$var$QueryRow;
+var $eadd6431fddf4b6c$export$2e2bcd8739ae039 = $eadd6431fddf4b6c$var$FilterItem;
 
 
 
 
 
 
-const $2eec38d4d0dbf714$var$ClearFiltersButton = ({ disabled: disabled = false, clearFiltersFn: clearFiltersFn })=>{
+
+const $2eec38d4d0dbf714$var$ClearFiltersButton = ({ disabled: disabled = false, clearFiltersFn: clearFiltersFn, disableDefaultClasses: disableDefaultClasses = false, className: className = "" })=>{
     const small = (0, $hgUW1$useMediaQuery)({
         minWidth: 0,
         maxWidth: 544
     });
     return /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Button), {
         disabled: disabled,
-        className: "ds-u-float--right ds-l-md-col--6 ds-l-col--5",
+        className: `dkan-clear-dataset-filters-button ${disableDefaultClasses ? "" : " ds-u-float--right ds-l-md-col--6 ds-l-col--5"}${className !== "" ? ` ${className}` : ""}`,
         variation: small ? "ghost" : undefined,
         onClick: ()=>clearFiltersFn(),
-        children: small ? "Clear all" : "Clear all filters"
+        children: "Reset"
     });
 };
 var $2eec38d4d0dbf714$export$2e2bcd8739ae039 = $2eec38d4d0dbf714$var$ClearFiltersButton;
 
 
-function $ee4ad47aa483e5b5$var$updateQueryForDatastore(condition) {
+
+function $6f4318b1e14124e5$var$updateQueryForDatastore(condition) {
     let cond = condition;
     delete cond.key;
     if (cond.operator === "=" || cond.operator === "<>") {
@@ -3046,12 +3028,19 @@ function $ee4ad47aa483e5b5$var$updateQueryForDatastore(condition) {
     if (Array.isArray(cond.value)) cond.value = cond.value.map((v)=>v.trim().replace(/(^\%+|\%+$)/gm, ""));
     return cond;
 }
-const $ee4ad47aa483e5b5$var$QueryBuilder = ({ resource: resource, id: id, customColumns: customColumns, isModal: isModal = false, setPage: setPage, setOffset: setOffset })=>{
-    const { conditions: conditions, schema: schema, setConditions: setConditions } = resource;
+const $6f4318b1e14124e5$var$FilterDataset = ()=>{
+    const { distribution: distribution, resource: resource, customColumns: customColumns = [] } = (0, $hgUW1$useContext)((0, $43a30d745a7bbc86$export$2e2bcd8739ae039));
+    const { setPage: setPage } = (0, $hgUW1$useContext)((0, $ee0d4d4f34048447$export$f814ea079e65d8fe));
+    if (!resource) return null;
+    const customColumnHeaders = (0, $7264a673914aa746$export$8049e8f40a9bdfb8)(customColumns, resource.columns, resource.schema[distribution.identifier]);
+    const id = distribution.identifier;
+    const columns = customColumnHeaders ? customColumnHeaders : (0, $a35cf16d1488f54e$export$1147582dfae658c6)(resource.columns, resource.schema[id]);
+    const { conditions: conditions, schema: schema, setConditions: setConditions, setOffset: setOffset } = resource;
     const fields = Object.keys(schema[id].fields);
     const [queryConditions, setQueryConditions] = (0, $hgUW1$useState)([]);
-    const [titleConditions, setTitleConditions] = (0, $hgUW1$useState)([]); // Add use effect to load conditions on first load if needed
+    const [titleConditions, setTitleConditions] = (0, $hgUW1$useState)([]);
     const [conditionsChanged, setConditionsChanged] = (0, $hgUW1$useState)(false);
+    const [modalOpen, setModalOpen] = (0, $hgUW1$useState)(false);
     const syncConditions = ()=>{
         if (conditions && conditions.length) {
             const keyedConditions = conditions.map((oc)=>({
@@ -3086,7 +3075,7 @@ const $ee4ad47aa483e5b5$var$QueryBuilder = ({ resource: resource, id: id, custom
         ]);
     };
     // Sync the UI with the actual data conditions whenever those change
-    (0, $hgUW1$react).useEffect(()=>{
+    (0, $hgUW1$useEffect)(()=>{
         syncConditions();
         setTitleConditions(conditions);
     }, [
@@ -3112,21 +3101,37 @@ const $ee4ad47aa483e5b5$var$QueryBuilder = ({ resource: resource, id: id, custom
         });
         window.history.pushState({}, "", `${url.origin}${url.pathname}${urlString}`);
     };
-    const submitConditions = (e)=>{
+    const submitConditions = ()=>{
         // only update the data conditions when "Apply filters" is pressed
-        e.preventDefault();
         const submitConditions = queryConditions.filter((oc)=>{
             if (oc.property) return oc;
             return false;
         }).map((oc)=>{
             let cond = Object.assign({}, oc);
-            return $ee4ad47aa483e5b5$var$updateQueryForDatastore(cond);
+            return $6f4318b1e14124e5$var$updateQueryForDatastore(cond);
         });
-        setConditions(submitConditions);
-        setPage(1);
-        setOffset(0);
-        setConditionsChanged(false);
-        updateBrowserURL(submitConditions);
+        const completeConditions = conditionsReadyToSubmit(submitConditions);
+        if (completeConditions.length) {
+            setConditions(completeConditions);
+            setPage(1);
+            setOffset(0);
+            setConditionsChanged(false);
+            updateBrowserURL(completeConditions);
+            setModalOpen(false);
+        }
+    };
+    const conditionsReadyToSubmit = (conditions)=>{
+        const isEmpty = (val)=>{
+            if (typeof val === "string") return val.trim() === "";
+            if (Array.isArray(val)) return val.length === 0;
+            return true;
+        };
+        const completeConditions = conditions.filter((condition)=>{
+            if (condition) {
+                if (!isEmpty(condition.property) && !isEmpty(condition.operator) && !isEmpty(condition.value)) return condition;
+            }
+        });
+        return completeConditions;
     };
     const updateCondition = (index, key, value)=>{
         let newConditions = [
@@ -3142,258 +3147,451 @@ const $ee4ad47aa483e5b5$var$QueryBuilder = ({ resource: resource, id: id, custom
         newConditions.splice(index, 1);
         setQueryConditions(newConditions);
         setConditionsChanged(true);
+        if (newConditions.length === 0) {
+            setConditions([]);
+            updateBrowserURL([]);
+        }
     };
-    return /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
-        className: "dc-query-builder ds-u-margin-bottom--3",
-        children: /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
-            className: "ds-c-accordion ds-c-accordion--bordered",
-            children: /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$AccordionItem), {
-                heading: /*#__PURE__*/ (0, $hgUW1$jsx)((0, $bef7bff2823feea2$export$2e2bcd8739ae039), {
-                    schema: schema[id],
-                    conditions: titleConditions,
-                    customColumns: customColumns
-                }),
-                defaultOpen: !isModal,
-                children: /*#__PURE__*/ (0, $hgUW1$jsxs)("form", {
-                    onSubmit: (e)=>submitConditions(e),
+    const disableFilterSubmitButton = ()=>{
+        return !conditionsChanged || queryConditions.length === 0 || conditionsReadyToSubmit(queryConditions).length === 0;
+    };
+    return /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Fragment), {
+        children: Object.keys(resource).length && columns.length && resource.schema && Object.keys(distribution).length ? /*#__PURE__*/ (0, $hgUW1$jsxs)("div", {
+            className: "dkan-filter-dataset-wrapper",
+            children: [
+                /*#__PURE__*/ (0, $hgUW1$jsxs)("button", {
+                    "aria-label": "Filter dataset - Opens in a dialog",
+                    className: "dkan-filter-dataset-toolbar-button ds-u-color--primary ds-u-text-decoration--underline ds-u-font-size--sm ds-u-padding-x--2 ds-u-margin--0 ds-u-border--0 ds-u-fill--transparent",
+                    onClick: ()=>{
+                        setModalOpen(true);
+                    },
                     children: [
-                        /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
-                            children: queryConditions.map((qf, index)=>/*#__PURE__*/ (0, $hgUW1$jsx)((0, $6369abf590ca298f$export$2e2bcd8739ae039), {
-                                    id: id,
-                                    schema: schema,
-                                    condition: qf,
-                                    index: index,
-                                    propertyOptions: propertyOptions,
-                                    update: updateCondition,
-                                    remove: removeCondition
-                                }, qf.key))
+                        /*#__PURE__*/ (0, $hgUW1$jsx)("i", {
+                            className: "fa fa-filter ds-u-margin-right--1"
                         }),
-                        /*#__PURE__*/ (0, $hgUW1$jsxs)("div", {
-                            className: "dc-query-bulder--form-buttons ds-u-padding-x--2 ds-u-padding-top--0 ds-u-md-padding-top--2 ds-u-display--flex ds-u-flex-wrap--wrap",
+                        /*#__PURE__*/ (0, $hgUW1$jsxs)("span", {
                             children: [
-                                /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
-                                    className: "ds-l-col--12 ds-l-md-col--4 ds-l-md-col--6 ds-u-padding-x--0 ds-u-margin-bottom--2 ds-u-md-margin-bottom--0",
-                                    children: /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Button), {
-                                        variation: "ghost",
-                                        onClick: ()=>addCondition(null),
-                                        className: "ds-u-padding-left--0",
-                                        children: "+ Add filter"
+                                /*#__PURE__*/ (0, $hgUW1$jsx)("span", {
+                                    className: "ds-u-display--none ds-u-lg-display--inline-block",
+                                    children: conditions.length > 0 ? `Edit Filters` : "Filter Dataset"
+                                }),
+                                conditions.length > 0 && ` (${conditions.length})`
+                            ]
+                        })
+                    ]
+                }),
+                /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
+                    className: `ds-c-dialog-wrap${modalOpen ? " open" : ""}`,
+                    children: /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Dialog), {
+                        heading: "Filter Dataset",
+                        isOpen: modalOpen,
+                        onExit: ()=>setModalOpen(false),
+                        className: "dkan-filter-dataset-dialog",
+                        ariaCloseLabel: "Close filter dataset dialog",
+                        actions: /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
+                            className: "ds-u-display--flex ds-u-justify-content--end ds-u-padding-x--2 ds-u-md-padding-x--3 ds-u-padding-y--2",
+                            children: /*#__PURE__*/ (0, $hgUW1$jsxs)("div", {
+                                className: "ds-u-display--flex ",
+                                children: [
+                                    /*#__PURE__*/ (0, $hgUW1$jsx)((0, $2eec38d4d0dbf714$export$2e2bcd8739ae039), {
+                                        disabled: queryConditions.length === 0,
+                                        clearFiltersFn: ()=>{
+                                            setConditions([]);
+                                            updateBrowserURL([]);
+                                        },
+                                        disableDefaultClasses: true,
+                                        className: "ds-l-md-col--auto ds-l-col--auto ds-u-margin--right--0 ds-u-sm-margin-right--2"
+                                    }),
+                                    /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Button), {
+                                        disabled: disableFilterSubmitButton(),
+                                        className: "dkan-apply-dataset-filters-button ds-u-float--right ds-l-md-col--auto ds-l-col--auto",
+                                        onClick: submitConditions,
+                                        variation: "solid",
+                                        children: `Apply ${conditionsReadyToSubmit(queryConditions).length || ""} filter${conditionsReadyToSubmit(queryConditions).length === 1 ? "" : "s"}`
                                     })
+                                ]
+                            })
+                        }),
+                        children: /*#__PURE__*/ (0, $hgUW1$jsxs)("div", {
+                            children: [
+                                /*#__PURE__*/ (0, $hgUW1$jsx)("p", {
+                                    className: "ds-u-margin--0 ds-u-margin-top--1 ds-u-margin-bottom--2 ds-u-padding-x--2 ds-u-md-padding-x--3",
+                                    children: "Add filters to only display data that meets your criteria. Filtered results can be downloaded."
                                 }),
                                 /*#__PURE__*/ (0, $hgUW1$jsxs)("div", {
-                                    className: "ds-u-display--flex ds-u-justify-content--end ds-l-col--12 ds-l-md-col--6 ds-u-padding-x--0",
+                                    className: "dkan-filter-dataset-controls-header ds-u-padding-x--2 ds-u-md-padding-x--3 ds-u-padding-y--1 ds-u-margin-top--05 ds-u-fill--gray-lightest",
                                     children: [
-                                        /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Button), {
-                                            disabled: !conditionsChanged,
-                                            className: "ds-u-float--right ds-l-md-col--6 ds-u-margin--right--0 ds-u-sm-margin-right--2",
-                                            type: "submit",
-                                            variation: "solid",
-                                            children: "Apply filters"
+                                        /*#__PURE__*/ (0, $hgUW1$jsx)("h3", {
+                                            className: "ds-u-margin--0 ds-u-font-weight--bold ds-u-padding--0",
+                                            children: "Column Name"
                                         }),
-                                        /*#__PURE__*/ (0, $hgUW1$jsx)((0, $2eec38d4d0dbf714$export$2e2bcd8739ae039), {
-                                            disabled: queryConditions.length === 0,
-                                            clearFiltersFn: ()=>{
-                                                setConditions([]);
-                                                updateBrowserURL([]);
-                                            }
+                                        /*#__PURE__*/ (0, $hgUW1$jsx)("h3", {
+                                            className: "ds-u-margin--0 ds-u-font-weight--bold ds-u-padding--0",
+                                            children: "Condition"
+                                        }),
+                                        /*#__PURE__*/ (0, $hgUW1$jsx)("h3", {
+                                            className: "ds-u-margin--0 ds-u-font-weight--bold ds-u-padding--0",
+                                            children: "Value"
+                                        }),
+                                        /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
+                                            className: "dkan-filter-dataset-controls-header-gutter"
                                         })
                                     ]
+                                }),
+                                /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
+                                    className: "dkan-filter-dataset-form-container ds-u-display--flex ds-u-flex-direction--column ds-u-border-bottom--1",
+                                    children: /*#__PURE__*/ (0, $hgUW1$jsxs)("div", {
+                                        className: "ds-u-padding-bottom--05",
+                                        children: [
+                                            /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
+                                                className: "dkan-filter-dataset-controls",
+                                                children: queryConditions.map((qf, index)=>/*#__PURE__*/ (0, $hgUW1$jsx)((0, $eadd6431fddf4b6c$export$2e2bcd8739ae039), {
+                                                        id: id,
+                                                        schema: schema,
+                                                        condition: qf,
+                                                        index: index,
+                                                        propertyOptions: propertyOptions,
+                                                        update: updateCondition,
+                                                        remove: removeCondition,
+                                                        className: index !== 0 ? "ds-u-border-top--1" : "ds-u-border--0"
+                                                    }, qf.key))
+                                            }),
+                                            /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
+                                                className: "ds-u-padding-x--2 ds-u-md-padding-x--3 ds-u-padding-y--1 ds-u-border-top--1 ds-u-margin-top--05",
+                                                children: /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Button), {
+                                                    onClick: ()=>addCondition(null),
+                                                    className: "dkan-add-dataset-filter-button ds-l-col--12 ds-u-radius--pill ds-u-margin-top--05 ds-u-font-weight--normal",
+                                                    children: "+ Add filter"
+                                                })
+                                            })
+                                        ]
+                                    })
                                 })
                             ]
                         })
-                    ]
+                    })
                 })
-            })
-        })
+            ]
+        }) : null
     });
 };
-var $ee4ad47aa483e5b5$export$2e2bcd8739ae039 = $ee4ad47aa483e5b5$var$QueryBuilder;
-
+var $6f4318b1e14124e5$export$2e2bcd8739ae039 = $6f4318b1e14124e5$var$FilterDataset;
 
 
-const $43a30d745a7bbc86$var$DataTableContext = /*#__PURE__*/ (0, $hgUW1$createContext)({
-    id: null
-});
-var $43a30d745a7bbc86$export$2e2bcd8739ae039 = $43a30d745a7bbc86$var$DataTableContext;
 
 
 
-function $a35cf16d1488f54e$export$1147582dfae658c6(columns, schema) {
-    return columns.map((column)=>({
-            header: schema && schema.fields[column].description ? schema.fields[column].description : column,
-            accessor: column
-        }));
-}
-const $a35cf16d1488f54e$var$DatasetTable = ({ isModal: isModal = false, closeFullScreenModal: closeFullScreenModal, showQueryBuilder: showQueryBuilder = true, showCopyLinkButton: showCopyLinkButton = true, showDownloadFilteredDataButton: showDownloadFilteredDataButton = true, showDownloadFullDataButton: showDownloadFullDataButton = true, showStoredQueryDownloadButton: showStoredQueryDownloadButton = false })=>{
-    const { id: id, distribution: distribution, resource: resource, rootUrl: rootUrl, customColumns: customColumns = [], dataDictionaryBanner: dataDictionaryBanner } = (0, $hgUW1$useContext)((0, $43a30d745a7bbc86$export$2e2bcd8739ae039));
-    const { page: page, setPage: setPage } = (0, $hgUW1$useContext)((0, $ebda441784d176a5$export$2e2bcd8739ae039));
-    const defaultPageSize = 10;
-    const customColumnHeaders = (0, $7264a673914aa746$export$8049e8f40a9bdfb8)(customColumns, resource.columns, resource.schema[distribution.identifier]);
-    const columns = customColumnHeaders ? customColumnHeaders : $a35cf16d1488f54e$export$1147582dfae658c6(resource.columns, resource.schema[id]);
-    const { limit: limit, setOffset: setOffset } = resource;
-    const pageSize = limit ? limit : defaultPageSize;
-    const downloadURL = `${rootUrl}/datastore/query/${id}/0/download?${(0, $hgUW1$qs).stringify({
-        conditions: resource.conditions
-    }, {
-        encode: true
-    })}&format=csv`;
-    if (Object.keys(resource).length && columns.length && resource.schema && Object.keys(distribution).length) return /*#__PURE__*/ (0, $hgUW1$jsxs)((0, $hgUW1$Fragment), {
+const $c5b172e8d1a8197c$var$FliterChip = ({ iconClass: iconClass, text: text, onClick: onClick })=>{
+    return /*#__PURE__*/ (0, $hgUW1$jsxs)("button", {
+        className: "dkan-filter-chip ds-u-display--flex ds-u-font-size--sm ds-u-align-items--center ds-u-padding-x--1 ds-u-padding-y--05 ds-u-margin--0 ds-u-margin-right--1 ds-u-margin-bottom--1",
+        onClick: onClick,
         children: [
-            showQueryBuilder && /*#__PURE__*/ (0, $hgUW1$jsx)((0, $ee4ad47aa483e5b5$export$2e2bcd8739ae039), {
-                resource: resource,
-                id: distribution.identifier,
-                customColumns: customColumnHeaders,
-                isModal: isModal,
-                setPage: setPage,
-                setOffset: setOffset
-            }),
-            dataDictionaryBanner && !isModal && /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
-                children: /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Alert), {
-                    children: 'Click on the "Data Dictionary" tab above for full column definitions'
-                })
-            }),
-            /*#__PURE__*/ (0, $hgUW1$jsx)((0, $6380a4a580b24362$export$2e2bcd8739ae039), {
-                resource: resource,
-                downloadURL: downloadURL,
-                unfilteredDownloadURL: distribution.data.downloadURL,
-                setPage: setPage,
-                showCopyLinkButton: showCopyLinkButton,
-                showDownloadFilteredDataButton: showDownloadFilteredDataButton,
-                showDownloadFullDataButton: showDownloadFullDataButton,
-                showStoredQueryDownloadButton: showStoredQueryDownloadButton
+            /*#__PURE__*/ (0, $hgUW1$jsx)("i", {
+                className: `${iconClass} ds-u-color--primary ds-u-margin-right--1`
             }),
-            /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
-                className: `ds-u-border-x--1 ds-u-border-bottom--1 ${isModal && "dkan-datatable-fullscreen-mode"}`,
-                children: /*#__PURE__*/ (0, $hgUW1$jsx)((0, $d98f94c79ddf4e0e$export$2e2bcd8739ae039), {
-                    canResize: true,
-                    columns: columns,
-                    sortTransform: (0, $aa4450dcbeef3ac0$export$385a5aba38cc3325),
-                    tablePadding: "ds-u-padding-y--2",
-                    loading: resource.loading,
-                    isModal: isModal,
-                    closeFullScreenModal: closeFullScreenModal
-                })
+            text,
+            /*#__PURE__*/ (0, $hgUW1$jsx)("i", {
+                className: "fa fa-xmark ds-u-font-size--sm ds-u-margin-left--1"
+            })
+        ]
+    });
+};
+var $c5b172e8d1a8197c$export$2e2bcd8739ae039 = $c5b172e8d1a8197c$var$FliterChip;
+
+
+
+
+
+
+
+
+const $dae856e97a09bcd6$var$DisplaySettings = ()=>{
+    const { resource: resource } = (0, $hgUW1$useContext)((0, $43a30d745a7bbc86$export$2e2bcd8739ae039));
+    const { setPage: setPage, tableDensity: tableDensity, setTableDensity: setTableDensity } = (0, $hgUW1$useContext)((0, $ee0d4d4f34048447$export$f814ea079e65d8fe));
+    const rowOptions = [
+        10,
+        25,
+        50,
+        100
+    ];
+    if (!resource) return null;
+    const { limit: limit, setLimit: setLimit, setOffset: setOffset } = resource;
+    return /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
+        className: "dkan-display-settings-wrapper",
+        children: /*#__PURE__*/ (0, $hgUW1$jsxs)((0, $hgUW1$Tooltip), {
+            className: "dkan-filter-dataset-toolbar-button ds-u-display--flex ds-u-align-items--center ds-u-color--primary ds-u-border--0 ds-u-padding--0 ds-u-padding-x--2 ds-u-margin--0 ds-u-fill--transparent ds-u-font-size--sm",
+            activeClassName: "dkan-data-table-display-settings-tooltip-open",
+            dialog: true,
+            offset: [
+                0,
+                5
+            ],
+            placement: "bottom-start",
+            maxWidth: "350px",
+            "aria-label": "Display Settings",
+            title: /*#__PURE__*/ (0, $hgUW1$jsxs)("div", {
+                className: "ds-u-display--flex ds-u-flex-direction--column",
+                children: [
+                    /*#__PURE__*/ (0, $hgUW1$jsxs)("div", {
+                        className: "dkan-data-table-display-settings-row ds-u-padding-bottom--1",
+                        children: [
+                            /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
+                                className: "",
+                                children: /*#__PURE__*/ (0, $hgUW1$jsx)("span", {
+                                    className: "ds-u-font-size--md ds-u-font-weight--normal",
+                                    children: "Row height"
+                                })
+                            }),
+                            /*#__PURE__*/ (0, $hgUW1$jsxs)("div", {
+                                className: "ds-u-display--flex ds-u-align-items--start",
+                                children: [
+                                    /*#__PURE__*/ (0, $hgUW1$jsx)("button", {
+                                        onClick: ()=>setTableDensity("expanded"),
+                                        "aria-label": "Row height, Expanded",
+                                        className: `dkan-table-density-button ds-u-leading--reset ds-u-padding--1 ds-u-margin--0 ${tableDensity === "expanded" ? "active ds-u-fill--primary-lightest" : ""}`,
+                                        children: /*#__PURE__*/ (0, $hgUW1$jsx)("i", {
+                                            className: "ds-u-display--block",
+                                            children: /*#__PURE__*/ (0, $hgUW1$jsx)("svg", {
+                                                className: "ds-u-display--block",
+                                                viewBox: "0 0 512 512",
+                                                xmlns: "http://www.w3.org/2000/svg",
+                                                "aria-hidden": "true",
+                                                focusable: "false",
+                                                height: "16",
+                                                role: "img",
+                                                width: "16",
+                                                children: /*#__PURE__*/ (0, $hgUW1$jsx)("path", {
+                                                    d: "M496,384 C504.836556,384 512,391.163444 512,400 L512,496 C512,504.836556 504.836556,512 496,512 L16,512 C7.163444,512 1.082166e-15,504.836556 0,496 L0,400 C-1.082166e-15,391.163444 7.163444,384 16,384 L496,384 Z M496,192 C504.836556,192 512,199.163444 512,208 L512,304 C512,312.836556 504.836556,320 496,320 L16,320 C7.163444,320 1.082166e-15,312.836556 0,304 L0,208 C-1.082166e-15,199.163444 7.163444,192 16,192 L496,192 Z M496,0 C504.836556,-1.623249e-15 512,7.163444 512,16 L512,112 C512,120.836556 504.836556,128 496,128 L16,128 C7.163444,128 1.082166e-15,120.836556 0,112 L0,16 C-1.082166e-15,7.163444 7.163444,1.623249e-15 16,0 L496,0 Z"
+                                                })
+                                            })
+                                        })
+                                    }),
+                                    /*#__PURE__*/ (0, $hgUW1$jsx)("button", {
+                                        onClick: ()=>setTableDensity("normal"),
+                                        "aria-label": "Row height, Normal",
+                                        className: `dkan-table-density-button ds-u-leading--reset ds-u-padding--1 ds-u-margin--0 ${tableDensity === "normal" ? "active ds-u-fill--primary-lightest" : ""}`,
+                                        children: /*#__PURE__*/ (0, $hgUW1$jsx)("i", {
+                                            className: "ds-u-display--block",
+                                            children: /*#__PURE__*/ (0, $hgUW1$jsx)("svg", {
+                                                className: "ds-u-display--block",
+                                                viewBox: "0 0 512 512",
+                                                xmlns: "http://www.w3.org/2000/svg",
+                                                "aria-hidden": "true",
+                                                focusable: "false",
+                                                height: "16",
+                                                role: "img",
+                                                width: "16",
+                                                children: /*#__PURE__*/ (0, $hgUW1$jsx)("path", {
+                                                    d: "M496,416 C504.836556,416 512,423.163444 512,432 L512,496 C512,504.836556 504.836556,512 496,512 L16,512 C7.163444,512 1.082166e-15,504.836556 0,496 L0,432 C-1.082166e-15,423.163444 7.163444,416 16,416 L496,416 Z M496,277 C504.836556,277 512,284.163444 512,293 L512,357 C512,365.836556 504.836556,373 496,373 L16,373 C7.163444,373 1.082166e-15,365.836556 0,357 L0,293 C-1.082166e-15,284.163444 7.163444,277 16,277 L496,277 Z M496,139 C504.836556,139 512,146.163444 512,155 L512,219 C512,227.836556 504.836556,235 496,235 L16,235 C7.163444,235 1.082166e-15,227.836556 0,219 L0,155 C-1.082166e-15,146.163444 7.163444,139 16,139 L496,139 Z M496,0 C504.836556,-1.623249e-15 512,7.163444 512,16 L512,80 C512,88.836556 504.836556,96 496,96 L16,96 C7.163444,96 1.082166e-15,88.836556 0,80 L0,16 C-1.082166e-15,7.163444 7.163444,1.623249e-15 16,0 L496,0 Z"
+                                                })
+                                            })
+                                        })
+                                    }),
+                                    /*#__PURE__*/ (0, $hgUW1$jsx)("button", {
+                                        onClick: ()=>setTableDensity("compact"),
+                                        "aria-label": "Row height, Compact",
+                                        className: `dkan-table-density-button ds-u-leading--reset ds-u-padding--1 ds-u-margin--0 ${tableDensity === "compact" ? "active ds-u-fill--primary-lightest " : ""}`,
+                                        children: /*#__PURE__*/ (0, $hgUW1$jsx)("i", {
+                                            className: "ds-u-display--block",
+                                            children: /*#__PURE__*/ (0, $hgUW1$jsx)("svg", {
+                                                className: "ds-u-display--block",
+                                                viewBox: "0 0 512 512",
+                                                xmlns: "http://www.w3.org/2000/svg",
+                                                "aria-hidden": "true",
+                                                focusable: "false",
+                                                height: "16",
+                                                role: "img",
+                                                width: "16",
+                                                children: /*#__PURE__*/ (0, $hgUW1$jsx)("path", {
+                                                    d: "M496,448 C504.836556,448 512,455.163444 512,464 L512,496 C512,504.836556 504.836556,512 496,512 L16,512 C7.163444,512 1.082166e-15,504.836556 0,496 L0,464 C-1.082166e-15,455.163444 7.163444,448 16,448 L496,448 Z M496,336 C504.836556,336 512,343.163444 512,352 L512,384 C512,392.836556 504.836556,400 496,400 L16,400 C7.163444,400 1.082166e-15,392.836556 0,384 L0,352 C-1.082166e-15,343.163444 7.163444,336 16,336 L496,336 Z M496,224 C504.836556,224 512,231.163444 512,240 L512,272 C512,280.836556 504.836556,288 496,288 L16,288 C7.163444,288 1.082166e-15,280.836556 0,272 L0,240 C-1.082166e-15,231.163444 7.163444,224 16,224 L496,224 Z M496,112 C504.836556,112 512,119.163444 512,128 L512,160 C512,168.836556 504.836556,176 496,176 L16,176 C7.163444,176 1.082166e-15,168.836556 0,160 L0,128 C-1.082166e-15,119.163444 7.163444,112 16,112 L496,112 Z M496,0 C504.836556,-1.623249e-15 512,7.163444 512,16 L512,48 C512,56.836556 504.836556,64 496,64 L16,64 C7.163444,64 1.082166e-15,56.836556 0,48 L0,16 C-1.082166e-15,7.163444 7.163444,1.623249e-15 16,0 L496,0 Z"
+                                                })
+                                            })
+                                        })
+                                    })
+                                ]
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ (0, $hgUW1$jsxs)("div", {
+                        className: "dkan-data-table-display-settings-row ds-u-border-top--1 ds-u-padding-top--1",
+                        children: [
+                            /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
+                                className: "",
+                                children: /*#__PURE__*/ (0, $hgUW1$jsx)("span", {
+                                    className: "ds-u-font-size--md ds-u-font-weight--normal",
+                                    children: "Rows per page"
+                                })
+                            }),
+                            /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Dropdown), {
+                                className: "",
+                                options: rowOptions.map((row)=>({
+                                        label: row.toString(),
+                                        value: row
+                                    })),
+                                size: "medium",
+                                label: "Rows per page:",
+                                labelClassName: "ds-u-margin-top--0 ds-u-font-size--md ds-u-font-weight--normal",
+                                name: "datatable_rows_per_page",
+                                onChange: (e)=>{
+                                    setLimit(parseInt(e.target.value));
+                                    setPage(1);
+                                    setOffset(0);
+                                },
+                                value: limit.toString(),
+                                defaultValue: limit.toString()
+                            })
+                        ]
+                    })
+                ]
             }),
-            !resource.loading && resource.count !== null && /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
-                className: "ds-u-display--flex ds-u-flex-wrap--wrap ds-u-justify-content--end ds-u-md-justify-content--between ds-u-margin-top--2 ds-u-align-items--center",
-                children: /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Pagination), {
-                    totalPages: Math.ceil(resource.count ? resource.count / pageSize : 1),
-                    currentPage: Number(page),
-                    onPageChange: (evt, page)=>{
-                        evt.preventDefault();
-                        setOffset((page - 1) * limit);
-                        setPage(page);
-                    },
-                    renderHref: (p)=>`?page=${p}`,
-                    className: "ds-l-col--12 ds-u-padding-x--0"
+            children: [
+                /*#__PURE__*/ (0, $hgUW1$jsx)("i", {
+                    className: "far fa-sliders-h ds-u-margin-right--1"
+                }),
+                /*#__PURE__*/ (0, $hgUW1$jsx)("span", {
+                    className: "ds-u-display--none ds-u-lg-display--inline-block",
+                    children: "Display Settings"
+                }),
+                /*#__PURE__*/ (0, $hgUW1$jsx)("i", {
+                    className: "fa fa-chevron-down ds-u-margin-left--1 ds-u-font-weight--bold"
+                }),
+                /*#__PURE__*/ (0, $hgUW1$jsx)("i", {
+                    className: "fa fa-chevron-up ds-u-margin-left--1 ds-u-font-weight--bold"
                 })
-            })
-        ]
-    });
-    else return /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Spinner), {
-        "aria-valuetext": "Dataset loading",
-        role: "status",
-        className: "ds-u-margin--3"
+            ]
+        })
     });
 };
-var $a35cf16d1488f54e$export$2e2bcd8739ae039 = $a35cf16d1488f54e$var$DatasetTable;
+var $dae856e97a09bcd6$export$2e2bcd8739ae039 = $dae856e97a09bcd6$var$DisplaySettings;
 
 
-const $16bd41951b91f02d$var$FullScreenDataTable = ({ modalOpen: modalOpen, setModalOpen: setModalOpen })=>{
-    return /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
-        className: `ds-c-dialog-wrap${modalOpen ? " open" : ""}`,
-        children: /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Dialog), {
-            heading: "Dataset Explorer",
-            isOpen: modalOpen,
-            onExit: ()=>setModalOpen(false),
-            className: "dkan-full-screen-dataset-dialog",
-            children: /*#__PURE__*/ (0, $hgUW1$jsx)((0, $a35cf16d1488f54e$export$2e2bcd8739ae039), {
-                isModal: true,
-                closeFullScreenModal: ()=>setModalOpen(false)
-            })
-        })
+
+const $85f8ff1ff89899c7$var$updateBrowserURL = (newConditions)=>{
+    const url = new URL(window.location.href);
+    const urlString = (0, $hgUW1$qs).stringify({
+        conditions: newConditions
+    }, {
+        encodeValuesOnly: true,
+        addQueryPrefix: true
     });
+    window.history.pushState({}, "", `${url.origin}${url.pathname}${urlString}`);
 };
-var $16bd41951b91f02d$export$2e2bcd8739ae039 = $16bd41951b91f02d$var$FullScreenDataTable;
-
-
-const $71b4324f265dec16$var$DataTableControls = ({ id: id, columns: columns, defaultColumnOrder: defaultColumnOrder, isModal: isModal, closeFullScreenModal: closeFullScreenModal })=>{
-    const [manageColumnsModalOpen, setManageColumnsModalOpen] = (0, $hgUW1$useState)(false);
-    const [fullScreenModalOpen, setFullScreenModalOpen] = (0, $hgUW1$useState)(false);
-    const hiddenColumns = columns.filter((c)=>c.getIsVisible() === false).length;
-    return /*#__PURE__*/ (0, $hgUW1$jsxs)((0, $hgUW1$Fragment), {
+const $85f8ff1ff89899c7$var$DataTableToolbar = ({ resource: resource, id: id, columns: columns, defaultColumnOrder: defaultColumnOrder, isModal: isModal, closeFullScreenModal: closeFullScreenModal, datasetTableControls: datasetTableControls, columnVisibility: columnVisibility, setColumnVisibility: setColumnVisibility })=>{
+    const { limit: limit, offset: offset, count: count, conditions: conditions, setConditions: setConditions } = resource;
+    const intCount = count ? count : 0;
+    const hiddenColumns = Object.keys(columnVisibility).filter((key)=>columnVisibility[key] === false).length;
+    const resetColumnVisibility = ()=>{
+        const columns = {
+            ...columnVisibility
+        };
+        for(let key in columns)if (columns[key] === false) columns[key] = true;
+        setColumnVisibility(columns);
+        // save to localStorage
+        const currentLocalStorage = JSON.parse(localStorage.getItem(id));
+        const updatedLocalStorageData = {
+            ...currentLocalStorage,
+            tableColumnVisibility: columns
+        };
+        localStorage.setItem(id, JSON.stringify(updatedLocalStorageData));
+    };
+    const removeCondition = (index)=>{
+        // just removes the condition from the UI - "Apply Filters" must be clicked to change the data model
+        let updatedConditions = JSON.parse(JSON.stringify(conditions));
+        updatedConditions.splice(index, 1);
+        setConditions(updatedConditions);
+        $85f8ff1ff89899c7$var$updateBrowserURL(updatedConditions);
+    };
+    return /*#__PURE__*/ (0, $hgUW1$jsxs)("div", {
+        className: "ds-u-margin-top--2",
         children: [
-            /*#__PURE__*/ (0, $hgUW1$jsxs)("div", {
-                className: "ds-u-border-top--1 ds-u-fill--gray-lightest ds-u-display--flex ds-u-justify-content--between",
-                children: [
-                    /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
-                        children: hiddenColumns > 0 && /*#__PURE__*/ (0, $hgUW1$jsxs)((0, $hgUW1$Alert), {
-                            variation: "warn",
+            /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
+                className: "dkan-filter-dataset-toolbar ds-u-fill--white ds-u-border--1",
+                children: /*#__PURE__*/ (0, $hgUW1$jsxs)("div", {
+                    className: "ds-l-col--12 ds-u-display--flex ds-u-justify-content--between ds-u-align-items--center ds-u-flex-wrap--wrap ds-u-padding-x--0 ds-u-padding-y--2",
+                    children: [
+                        /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
+                            className: "ds-u-padding-x--2",
+                            children: !resource.loading && resource.count !== null && /*#__PURE__*/ (0, $hgUW1$jsx)((0, $2ed0091f7e32d1e6$export$2e2bcd8739ae039), {
+                                totalRows: intCount,
+                                limit: limit,
+                                offset: offset,
+                                className: "data-table-results ds-u-margin--0 ds-u-font-size--sm ds-u-padding-y--0 ds-u-md-padding-y--1 ds-u-padding-bottom--2 ds-u-md-padding-bottom--0"
+                            })
+                        }),
+                        datasetTableControls && /*#__PURE__*/ (0, $hgUW1$jsxs)("div", {
+                            className: "dkan-data-table-toolbar-controls ds-u-display--flex ds-u-flex-wrap--wrap ds-u-align-items--center ds-l-md-col--auto ds-l-col--12 ds-u-padding-x--2 ds-u-padding-top--2 ds-u-md-padding-top--0",
                             children: [
-                                hiddenColumns,
-                                " Columns Hidden"
+                                /*#__PURE__*/ (0, $hgUW1$jsx)((0, $6f4318b1e14124e5$export$2e2bcd8739ae039), {}),
+                                /*#__PURE__*/ (0, $hgUW1$jsx)((0, $5d9e2ce238d53d29$export$2e2bcd8739ae039), {
+                                    id: id,
+                                    columns: columns,
+                                    defaultColumnOrder: defaultColumnOrder
+                                }),
+                                /*#__PURE__*/ (0, $hgUW1$jsx)((0, $dae856e97a09bcd6$export$2e2bcd8739ae039), {}),
+                                /*#__PURE__*/ (0, $hgUW1$jsx)((0, $16bd41951b91f02d$export$2e2bcd8739ae039), {
+                                    isModal: isModal,
+                                    closeFullScreenModal: closeFullScreenModal
+                                })
                             ]
                         })
+                    ]
+                })
+            }),
+            (conditions.length > 0 || hiddenColumns > 0) && /*#__PURE__*/ (0, $hgUW1$jsxs)("div", {
+                className: "ds-u-fill--white ds-u-padding-x--0 ds-u-md-padding-x--2 ds-u-padding-top--2",
+                children: [
+                    /*#__PURE__*/ (0, $hgUW1$jsx)("h2", {
+                        className: "ds-u-margin--0 ds-u-margin-bottom--2 ds-u-font-size--lg ds-u-font-weight--bold",
+                        children: "Selected filters"
                     }),
                     /*#__PURE__*/ (0, $hgUW1$jsxs)("div", {
+                        className: "ds-u-display--flex ds-u-justify-content--between ds-u-md-align-items--end ds-u-flex-direction--column ds-u-md-flex-direction--row",
                         children: [
-                            /*#__PURE__*/ (0, $hgUW1$jsxs)("button", {
-                                "aria-label": "Manage columns - Opens in a dialog",
-                                className: "ds-c-button ds-c-button--ghost ds-u-margin-y--1",
-                                onClick: ()=>{
-                                    setManageColumnsModalOpen(true);
-                                },
+                            /*#__PURE__*/ (0, $hgUW1$jsxs)("div", {
+                                className: "ds-u-display--flex ds-u-padding-right--0 ds-u-md-padding-right--4 ds-u-flex-wrap--wrap",
                                 children: [
-                                    /*#__PURE__*/ (0, $hgUW1$jsx)("i", {
-                                        className: "far fa-cog ds-u-margin-right--1"
-                                    }),
-                                    "Manage Columns"
+                                    conditions.length > 0 ? conditions.map((condition, index)=>/*#__PURE__*/ (0, $hgUW1$jsx)((0, $c5b172e8d1a8197c$export$2e2bcd8739ae039), {
+                                            iconClass: "far fa-filter",
+                                            text: `"${condition.property}" ${condition.operator} ${condition.value}`,
+                                            onClick: ()=>{
+                                                removeCondition(index);
+                                            }
+                                        }, index)) : null,
+                                    hiddenColumns > 0 ? /*#__PURE__*/ (0, $hgUW1$jsx)((0, $c5b172e8d1a8197c$export$2e2bcd8739ae039), {
+                                        iconClass: "fa fa-columns",
+                                        text: `${hiddenColumns} Column${hiddenColumns === 1 ? "" : "s"} Hidden`,
+                                        onClick: ()=>{
+                                            resetColumnVisibility();
+                                        }
+                                    }) : null
                                 ]
                             }),
-                            /*#__PURE__*/ (0, $hgUW1$jsxs)("button", {
-                                "aria-label": isModal ? "Close Full Screen dialog" : "Full Screen mode - Opens in a dialog",
-                                className: "ds-c-button ds-c-button--ghost ds-u-margin-y--1",
-                                onClick: ()=>{
-                                    if (isModal) closeFullScreenModal();
-                                    else setFullScreenModalOpen(true);
-                                },
-                                children: [
-                                    /*#__PURE__*/ (0, $hgUW1$jsx)("i", {
-                                        className: `fa ${isModal ? "fa-compress" : "fa-expand"} ds-u-margin-right--1`
-                                    }),
-                                    isModal ? "Exit Full Screen" : "Full Screen"
-                                ]
+                            /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
+                                className: "ds-l-col--auto ds-u-padding--0 ds-u-display--flex ds-u-justify-content--end",
+                                children: /*#__PURE__*/ (0, $hgUW1$jsx)("button", {
+                                    className: "dkan-clear-all-filters-button ds-u-color--primary ds-u-font-size--md ds-u-font-weight--bold ds-u-border--0 ds-u-padding--0 ds-u-margin--0 ds-u-fill--transparent ds-u-text-decoration--underline ds-u-margin-bottom--1",
+                                    onClick: ()=>{
+                                        setConditions([]);
+                                        $85f8ff1ff89899c7$var$updateBrowserURL([]);
+                                        resetColumnVisibility();
+                                    },
+                                    children: "Clear all filters"
+                                })
                             })
                         ]
                     })
                 ]
-            }),
-            /*#__PURE__*/ (0, $hgUW1$jsxs)("div", {
-                children: [
-                    /*#__PURE__*/ (0, $hgUW1$jsx)((0, $5d9e2ce238d53d29$export$2e2bcd8739ae039), {
-                        id: id,
-                        columns: columns,
-                        defaultColumnOrder: defaultColumnOrder,
-                        modalOpen: manageColumnsModalOpen,
-                        setModalOpen: setManageColumnsModalOpen
-                    }),
-                    !isModal && /*#__PURE__*/ (0, $hgUW1$jsx)((0, $16bd41951b91f02d$export$2e2bcd8739ae039), {
-                        modalOpen: fullScreenModalOpen,
-                        setModalOpen: setFullScreenModalOpen
-                    })
-                ]
             })
         ]
     });
 };
-var $71b4324f265dec16$export$2e2bcd8739ae039 = $71b4324f265dec16$var$DataTableControls;
-
-
+var $85f8ff1ff89899c7$export$2e2bcd8739ae039 = $85f8ff1ff89899c7$var$DataTableToolbar;
 
 
-const $d98f94c79ddf4e0e$var$DataTable = ({ columns: columns, sortTransform: sortTransform, tablePadding: tablePadding, canResize: canResize, loading: loading = false, isModal: isModal, closeFullScreenModal: closeFullScreenModal })=>{
-    const { id: id, resource: resource, datasetTableControls: datasetTableControls } = (0, $hgUW1$useContext)((0, $43a30d745a7bbc86$export$2e2bcd8739ae039));
-    const { columnOrder: columnOrder, setColumnOrder: setColumnOrder, columnVisibility: columnVisibility, setColumnVisibility: setColumnVisibility } = (0, $hgUW1$useContext)((0, $ebda441784d176a5$export$2e2bcd8739ae039));
+const $d98f94c79ddf4e0e$var$DataTable = ({ columns: columns, sortTransform: sortTransform, tablePadding: tablePadding, canResize: canResize, loading: loading = false, isModal: isModal, closeFullScreenModal: closeFullScreenModal, downloadURL: downloadURL, unfilteredDownloadURL: unfilteredDownloadURL, setPage: setPage, showCopyLinkButton: showCopyLinkButton, showDownloadFilteredDataButton: showDownloadFilteredDataButton, showDownloadFullDataButton: showDownloadFullDataButton, showStoredQueryDownloadButton: showStoredQueryDownloadButton })=>{
+    const { id: id, resource: resource, datasetTableControls: datasetTableControls, dataDictionaryBanner: dataDictionaryBanner } = (0, $hgUW1$useContext)((0, $43a30d745a7bbc86$export$2e2bcd8739ae039));
+    const { columnOrder: columnOrder, setColumnOrder: setColumnOrder, columnVisibility: columnVisibility, setColumnVisibility: setColumnVisibility } = (0, $hgUW1$useContext)((0, $ee0d4d4f34048447$export$f814ea079e65d8fe));
+    const { conditions: conditions } = resource;
     const data = resource.values;
     const [sorting, setSorting] = (0, $hgUW1$useState)([]);
     const [ariaLiveFeedback, setAriaLiveFeedback] = (0, $hgUW1$useState)("");
@@ -3455,17 +3653,142 @@ const $d98f94c79ddf4e0e$var$DataTable = ({ columns: columns, sortTransform: sort
     ]);
     return /*#__PURE__*/ (0, $hgUW1$jsxs)((0, $hgUW1$Fragment), {
         children: [
-            datasetTableControls && /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
-                children: /*#__PURE__*/ (0, $hgUW1$jsx)((0, $71b4324f265dec16$export$2e2bcd8739ae039), {
-                    id: id,
-                    columns: table.getAllLeafColumns(),
-                    defaultColumnOrder: defaultColumnOrder,
-                    isModal: isModal,
-                    closeFullScreenModal: closeFullScreenModal
+            /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
+                className: "ds-u-margin-bottom--3",
+                children: showDownloadFullDataButton && /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Button), {
+                    className: "dkan-data-table-download-full-dataset-button ds-u-fill--primary ds-u-color--white ds-u-text-align--center ds-u-padding-x--3 ds-u-margin-x--0 ds-u-margin-y--0",
+                    href: unfilteredDownloadURL,
+                    children: /*#__PURE__*/ (0, $hgUW1$jsxs)("span", {
+                        className: "ds-u-font-weight--normal ds-u-font-size--md ds-u-margin-x--0 ds-u-padding--0",
+                        children: [
+                            /*#__PURE__*/ (0, $hgUW1$jsx)("i", {
+                                className: "fas fa-file-csv"
+                            }),
+                            " Download full dataset (CSV)"
+                        ]
+                    })
                 })
             }),
+            /*#__PURE__*/ (0, $hgUW1$jsx)((0, $85f8ff1ff89899c7$export$2e2bcd8739ae039), {
+                id: id,
+                columns: table.getAllLeafColumns(),
+                defaultColumnOrder: defaultColumnOrder,
+                isModal: isModal,
+                closeFullScreenModal: closeFullScreenModal,
+                resource: resource,
+                datasetTableControls: datasetTableControls,
+                columnVisibility: columnVisibility,
+                setColumnVisibility: setColumnVisibility
+            }),
+            /*#__PURE__*/ (0, $hgUW1$jsxs)("div", {
+                className: "ds-u-display--flex ds-l-col--12 ds-l-md-col--11 ds-u-justify-content--between ds-u-padding--0 ds-u-margin-y--2 ds-u-md-margin-y--3 ds-u-flex-direction--column ds-u-md-flex-direction--row",
+                children: [
+                    /*#__PURE__*/ (0, $hgUW1$jsxs)("div", {
+                        className: "dkan-data-table-info-container ds-u-padding-right--0 ds-u-md-padding-right--4",
+                        children: [
+                            dataDictionaryBanner && !isModal && /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
+                                className: "ds-u-margin-bottom--3",
+                                children: /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Alert), {
+                                    children: 'Click on the "Data Dictionary" tab above for full column definitions'
+                                })
+                            }),
+                            /*#__PURE__*/ (0, $hgUW1$jsx)("p", {
+                                className: "ds-u-margin--0",
+                                children: "Activate the column resize button and use the right and left arrow keys to resize a column or use your mouse to drag/resize. Press escape to cancel the resizing."
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
+                        className: "dkan-data-table-share-container ds-l-col--auto ds-u-padding--0 ds-u-margin-bottom--2 ds-u-md-margin-bottom--0",
+                        children: /*#__PURE__*/ (0, $hgUW1$jsxs)((0, $hgUW1$Tooltip), {
+                            className: "dkan-data-table-share-button ds-u-display--flex ds-u-align-items--center ds-u-fill--primary ds-u-radius--pill ds-u-color--white ds-u-border--0 ds-u-padding-x--3 ds-u-padding-y--1 ds-u-font-weight--bold ds-l-col--12 ds-l-md-col--auto ds-u-justify-content--center",
+                            activeClassName: "dkan-data-table-share-tooltip-open",
+                            dialog: true,
+                            offset: [
+                                0,
+                                5
+                            ],
+                            placement: "bottom-start",
+                            maxWidth: "320px",
+                            title: /*#__PURE__*/ (0, $hgUW1$jsxs)("div", {
+                                className: "dc-c-resource-header--buttons ds-u-display--flex ds-u-flex-direction--column ds-l-col--12 ds-u-padding-x--0",
+                                children: [
+                                    showCopyLinkButton && /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Fragment), {
+                                        children: conditions && conditions.length ? /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Tooltip), {
+                                            onOpen: ()=>{
+                                                navigator.clipboard.writeText(window.location.href);
+                                            },
+                                            className: "dkan-data-table-download-button ds-c-button ds-u-text-align--center ds-l-col--12 ds-u-padding-x--2 ds-u-margin-x--0 ds-u-margin-bottom--1",
+                                            placement: "bottom",
+                                            dialog: true,
+                                            ariaLabel: "Copy link to filtered data",
+                                            title: "Link copied to clipboard",
+                                            "aria-disabled": !conditions || conditions.length === 0,
+                                            children: /*#__PURE__*/ (0, $hgUW1$jsxs)("span", {
+                                                className: "ds-u-font-weight--normal ds-u-font-size--md ds-u-margin-x--0 ds-u-padding--0",
+                                                children: [
+                                                    /*#__PURE__*/ (0, $hgUW1$jsx)("i", {
+                                                        className: "fas fa-copy"
+                                                    }),
+                                                    " Copy link to filtered data"
+                                                ]
+                                            })
+                                        }) : /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Button), {
+                                            "aria-disabled": true,
+                                            "aria-label": "Copy link to filtered data",
+                                            className: "dkan-data-table-download-button ds-c-button ds-u-text-align--center ds-l-col--12 ds-u-padding-x--2 ds-u-margin-x--0 ds-u-margin-bottom--1",
+                                            children: /*#__PURE__*/ (0, $hgUW1$jsxs)("span", {
+                                                className: "ds-u-font-weight--normal ds-u-font-size--md ds-u-padding--0",
+                                                children: [
+                                                    /*#__PURE__*/ (0, $hgUW1$jsx)("i", {
+                                                        className: "fas fa-copy"
+                                                    }),
+                                                    " Copy link to filtered data"
+                                                ]
+                                            })
+                                        })
+                                    }),
+                                    (showDownloadFilteredDataButton || showStoredQueryDownloadButton) && /*#__PURE__*/ (0, $hgUW1$jsx)("div", {
+                                        className: "ds-l-col--12 ds-u-padding-x--0 ds-u-margin-x--0",
+                                        children: /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Button), {
+                                            className: "dkan-data-table-download-button ds-u-text-align--center ds-u-display--inline-block ds-l-col--12 ds-u-padding-x--2 ds-u-margin-x--0 ds-u-margin-bottom--1",
+                                            href: downloadURL,
+                                            "aria-disabled": !conditions || conditions.length === 0,
+                                            children: /*#__PURE__*/ (0, $hgUW1$jsxs)("span", {
+                                                className: "ds-u-font-weight--normal ds-u-font-size--md ds-u-padding--0",
+                                                children: [
+                                                    /*#__PURE__*/ (0, $hgUW1$jsx)("i", {
+                                                        className: "fas fa-file-csv"
+                                                    }),
+                                                    " ",
+                                                    showDownloadFilteredDataButton ? `Download filtered data (CSV)` : `Download stored query data (CSV)`
+                                                ]
+                                            })
+                                        })
+                                    })
+                                ]
+                            }),
+                            children: [
+                                /*#__PURE__*/ (0, $hgUW1$jsx)("i", {
+                                    className: "far fa-share-alt"
+                                }),
+                                /*#__PURE__*/ (0, $hgUW1$jsx)("span", {
+                                    className: "ds-u-margin-x--05",
+                                    children: "Share"
+                                }),
+                                /*#__PURE__*/ (0, $hgUW1$jsx)("i", {
+                                    className: "fa fa-chevron-down"
+                                }),
+                                /*#__PURE__*/ (0, $hgUW1$jsx)("i", {
+                                    className: "fa fa-chevron-up"
+                                })
+                            ]
+                        })
+                    })
+                ]
+            }),
             /*#__PURE__*/ (0, $hgUW1$jsxs)("div", {
-                className: "dc-c-datatable-wrapper",
+                className: "dc-c-datatable-wrapper ds-u-border-x--1 ds-u-border-bottom--1",
                 tabIndex: 0,
                 ref: dataTableWrapperElement,
                 children: [
@@ -5895,32 +6218,9 @@ var $6012b86ffcaf3f71$export$2e2bcd8739ae039 = (0, $61ff88fb3f6ee2c8$export$2e2b
 
 
 
-
-const $39bc4d98030a5599$var$DataTableStateWrapper = ({ showQueryBuilder: showQueryBuilder = true, showCopyLinkButton: showCopyLinkButton = true, showDownloadFilteredDataButton: showDownloadFilteredDataButton = true, showDownloadFullDataButton: showDownloadFullDataButton = true, showStoredQueryDownloadButton: showStoredQueryDownloadButton = false })=>{
-    const { id: id, datasetTableControls: datasetTableControls } = (0, $hgUW1$useContext)((0, $43a30d745a7bbc86$export$2e2bcd8739ae039));
-    // a wrapper component to keep column state synced between full screen and regular modes
-    const localStorageData = id ? JSON.parse(localStorage.getItem(id)) : null;
-    const defaultPage = 1;
-    const [page, setPage] = (0, $hgUW1$useState)(defaultPage);
-    const [columnOrder, setColumnOrder] = (0, $hgUW1$useState)(()=>{
-        if (datasetTableControls && localStorageData) return localStorageData.tableColumnOrder;
-        else return [];
-    });
-    const [columnVisibility, setColumnVisibility] = (0, $hgUW1$useState)(()=>{
-        if (datasetTableControls && localStorageData) return localStorageData.tableColumnVisibility;
-        else return {};
-    });
-    return /*#__PURE__*/ (0, $hgUW1$jsx)((0, $ebda441784d176a5$export$2e2bcd8739ae039).Provider, {
-        value: {
-            columnOrder: columnOrder,
-            setColumnOrder: setColumnOrder,
-            columnVisibility: columnVisibility,
-            setColumnVisibility: setColumnVisibility,
-            page: page,
-            setPage: setPage
-        },
+const $39bc4d98030a5599$var$DataTableStateWrapper = ({ showCopyLinkButton: showCopyLinkButton = true, showDownloadFilteredDataButton: showDownloadFilteredDataButton = true, showDownloadFullDataButton: showDownloadFullDataButton = true, showStoredQueryDownloadButton: showStoredQueryDownloadButton = false })=>{
+    return /*#__PURE__*/ (0, $hgUW1$jsx)((0, $ee0d4d4f34048447$export$2e2bcd8739ae039), {
         children: /*#__PURE__*/ (0, $hgUW1$jsx)((0, $a35cf16d1488f54e$export$2e2bcd8739ae039), {
-            showQueryBuilder: showQueryBuilder,
             showCopyLinkButton: showCopyLinkButton,
             showDownloadFilteredDataButton: showDownloadFilteredDataButton,
             showDownloadFullDataButton: showDownloadFullDataButton,
@@ -7018,7 +7318,6 @@ function $8b67b7ee3fcfb629$export$2e2bcd8739ae039({ id: id, rootUrl: rootUrl, cu
             datasetTableControls: !disableTableControls
         },
         children: /*#__PURE__*/ (0, $hgUW1$jsx)((0, $39bc4d98030a5599$export$2e2bcd8739ae039), {
-            showQueryBuilder: false,
             showCopyLinkButton: false,
             showDownloadFilteredDataButton: false,
             showDownloadFullDataButton: false,
@@ -7168,6 +7467,78 @@ var $374c4669b044ddf8$export$2e2bcd8739ae039 = $374c4669b044ddf8$var$QueryRow;
 
 
 
+
+const $bef7bff2823feea2$var$QueryTitle = ({ conditions: conditions, schema: schema, customColumns: customColumns })=>{
+    const { fields: fields } = schema;
+    const prependedMessage = /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Fragment), {
+        children: "Data filters: "
+    });
+    if (!conditions || !conditions.length) return /*#__PURE__*/ (0, $hgUW1$jsxs)("p", {
+        className: "ds-u-margin-y--0",
+        children: [
+            prependedMessage,
+            " none"
+        ]
+    });
+    function formatValue(text, property) {
+        if (customColumns && customColumns.length > 0) {
+            let newValue = text;
+            let customColumn = customColumns.find((c)=>c.accessor === property);
+            if (customColumn && customColumn.cell) return customColumn.cell({
+                value: text
+            });
+            return text;
+        } else return text;
+    }
+    return /*#__PURE__*/ (0, $hgUW1$jsxs)("span", {
+        className: "dc-querybuilder-title",
+        children: [
+            /*#__PURE__*/ (0, $hgUW1$jsx)("p", {
+                className: "ds-u-margin-y--0",
+                children: prependedMessage
+            }),
+            conditions.map((c)=>{
+                const field = fields[c.property];
+                const description = field && field.description ? field.description : c.property;
+                const operator = (0, $7264a673914aa746$export$5f89a5ae87bc48e1).find((op)=>op.value === c.operator);
+                const cleanedText = (0, $7264a673914aa746$export$6b5e57d20078142b)(c.value);
+                const formattedText = formatValue(cleanedText, c.property);
+                return /*#__PURE__*/ (0, $hgUW1$jsxs)("span", {
+                    className: "ds-u-fill--background ds-u-padding--1 ds-u-margin-y--1 ds-u-display--inline-block ds-u-font-weight--semibold",
+                    children: [
+                        /*#__PURE__*/ (0, $hgUW1$jsx)("span", {
+                            className: "ds-u-font-weight--bold",
+                            children: description
+                        }),
+                        " ",
+                        /*#__PURE__*/ (0, $hgUW1$jsx)("span", {
+                            className: "ds-u-font-weight--normal",
+                            children: operator.label.toUpperCase()
+                        }),
+                        " ",
+                        /*#__PURE__*/ (0, $hgUW1$jsx)("span", {
+                            className: "ds-u-color--success",
+                            children: formattedText
+                        })
+                    ]
+                });
+            }).reduce((prev, curr)=>[
+                    prev,
+                    /*#__PURE__*/ (0, $hgUW1$jsx)((0, $hgUW1$Badge), {
+                        className: "ds-u-margin-x--1",
+                        variation: "info",
+                        children: "AND"
+                    }),
+                    curr
+                ])
+        ]
+    });
+};
+var $bef7bff2823feea2$export$2e2bcd8739ae039 = $bef7bff2823feea2$var$QueryTitle;
+
+
+
+
 function $3b6ca952e79f0695$var$updateQueryForDatastore(condition) {
     let cond = condition;
     delete cond.key;
@@ -7683,5 +8054,5 @@ var $90fb213ab8eeb2e7$export$2e2bcd8739ae039 = $90fb213ab8eeb2e7$var$useScrollTo
 
 
 
-export {$e49d4387bed21287$export$2e2bcd8739ae039 as ApiRowLimitNotice, $a8accc31bf9e0bda$export$2e2bcd8739ae039 as CMSTopNav, $c49454ea7d1c4579$export$2e2bcd8739ae039 as ErrorBoundary, $046ded0064bd0a3d$export$2e2bcd8739ae039 as FAQAccordion, $b939b31651e82908$export$2e2bcd8739ae039 as HeaderNav, $1555e1cb3eb7b3e3$export$2e2bcd8739ae039 as HeaderNavIconLink, $fea9297ba4dd394c$export$2e2bcd8739ae039 as HeaderSearch, $9a8892c5ac150556$export$2e2bcd8739ae039 as HeaderSiteTitle, $3c72c298c3a7f21f$export$2e2bcd8739ae039 as HeaderTagline, $403833a4b442d5df$export$2e2bcd8739ae039 as MobileMenuButton, $f57121650539d8c5$export$2e2bcd8739ae039 as NavBar, $953b286f7778640e$export$2e2bcd8739ae039 as SidebarNavigation, $b0968edc60d7d3a4$export$2e2bcd8739ae039 as SidebarPage, $4f153ca537d853e5$export$2e2bcd8739ae039 as SubMenu, $59a079354baa335c$export$2e2bcd8739ae039 as Hero, $c068004d499082cc$export$2e2bcd8739ae039 as DatasetListItem, $52c6454cae137465$export$2e2bcd8739ae039 as DatasetSearchListItem, $17711e94d2ce0ee4$export$2e2bcd8739ae039 as DatasetDateItem, $20de4fedf33d4f9a$export$2e2bcd8739ae039 as DatasetDate, $10bc3aae21fc1572$export$2e2bcd8739ae039 as DatasetListSubmenu, $789279954d8eff7f$export$2e2bcd8739ae039 as ApiDocumentation, $af099c546cb226c7$export$2e2bcd8739ae039 as ResourceHeader, $626282d9a03c51d5$export$2e2bcd8739ae039 as ResourcePreview, $072291d44ce1834a$export$2e2bcd8739ae039 as ResourceFooter, $ec3e23baa005dc03$export$2e2bcd8739ae039 as Breadcrumb, $bd76a91923d7e8a7$export$2e2bcd8739ae039 as TransformedDate, $d98f94c79ddf4e0e$export$2e2bcd8739ae039 as DataTable, $bdb071ea3a6d3466$export$2e2bcd8739ae039 as SearchInput, $5644ebd2c3dbfd7b$export$eea3a12df15499ca as buildRows, $2ed0091f7e32d1e6$export$2e2bcd8739ae039 as DataTablePageResults, $1a2bf34e2a8f6b80$export$59a943b34a82e690 as truncateText, $c96c4b9ef7203c1f$export$2e2bcd8739ae039 as APIPage, $026cb986f9fea2b1$export$2e2bcd8739ae039 as PageNotFound, $e873081a6e8f024e$export$2e2bcd8739ae039 as DatasetSearch, $550bcc185f420ff5$export$2e2bcd8739ae039 as DatasetList, $a0f13962e513caa1$export$2e2bcd8739ae039 as Dataset, $a35cf16d1488f54e$export$2e2bcd8739ae039 as DatasetTable, $b9af6ce5e2c06331$export$2e2bcd8739ae039 as Header, $a6df0aa147323304$export$2e2bcd8739ae039 as Footer, $669d2782ec2e2250$export$2e2bcd8739ae039 as SpecsAndLimits, $8b67b7ee3fcfb629$export$2e2bcd8739ae039 as StoredQueryPage, $f61ecf9f84951a61$export$2e2bcd8739ae039 as FilteredResource, $bef7bff2823feea2$export$2e2bcd8739ae039 as QueryTitle, $7264a673914aa746$export$2b9377795161999 as buildOperatorOptions, $7264a673914aa746$export$e284ae5d89467c8f as convertUTCToLocalDate, $7264a673914aa746$export$6b5e57d20078142b as cleanText, $7264a673914aa746$export$8049e8f40a9bdfb8 as buildCustomColHeaders, $11500a65bd7d9cf1$export$2e2bcd8739ae039 as HeaderContext, $43a30d745a7bbc86$export$2e2bcd8739ae039 as DataTableContext, $ebda441784d176a5$export$2e2bcd8739ae039 as ManageColumnsContext, $844981eac9b63865$export$eccc29c8d0ff408 as ACAContext, $efc410f5f7ac5ef3$export$2e2bcd8739ae039 as useSearchAPI, $1d3d480a9cfaabe0$export$2e2bcd8739ae039 as useDatastore, $aa4450dcbeef3ac0$export$385a5aba38cc3325 as transformTableSortToQuerySort, $eb7821d186b1a389$export$2e2bcd8739ae039 as useAddLoginLink, $90fb213ab8eeb2e7$export$2e2bcd8739ae039 as useScrollToTop, $b4aa9c66f2e86959$export$2e2bcd8739ae039 as useMetastoreDataset, $61ff88fb3f6ee2c8$export$2e2bcd8739ae039 as withQueryProvider, $6d5c0212e738499b$export$34e95918366a058e as acaToParams, $6da0396069e23175$export$bc27cf7ecf44639d as defaultMetadataMapping};
+export {$e49d4387bed21287$export$2e2bcd8739ae039 as ApiRowLimitNotice, $a8accc31bf9e0bda$export$2e2bcd8739ae039 as CMSTopNav, $c49454ea7d1c4579$export$2e2bcd8739ae039 as ErrorBoundary, $046ded0064bd0a3d$export$2e2bcd8739ae039 as FAQAccordion, $b939b31651e82908$export$2e2bcd8739ae039 as HeaderNav, $1555e1cb3eb7b3e3$export$2e2bcd8739ae039 as HeaderNavIconLink, $fea9297ba4dd394c$export$2e2bcd8739ae039 as HeaderSearch, $9a8892c5ac150556$export$2e2bcd8739ae039 as HeaderSiteTitle, $3c72c298c3a7f21f$export$2e2bcd8739ae039 as HeaderTagline, $403833a4b442d5df$export$2e2bcd8739ae039 as MobileMenuButton, $f57121650539d8c5$export$2e2bcd8739ae039 as NavBar, $953b286f7778640e$export$2e2bcd8739ae039 as SidebarNavigation, $b0968edc60d7d3a4$export$2e2bcd8739ae039 as SidebarPage, $4f153ca537d853e5$export$2e2bcd8739ae039 as SubMenu, $59a079354baa335c$export$2e2bcd8739ae039 as Hero, $c068004d499082cc$export$2e2bcd8739ae039 as DatasetListItem, $52c6454cae137465$export$2e2bcd8739ae039 as DatasetSearchListItem, $17711e94d2ce0ee4$export$2e2bcd8739ae039 as DatasetDateItem, $20de4fedf33d4f9a$export$2e2bcd8739ae039 as DatasetDate, $10bc3aae21fc1572$export$2e2bcd8739ae039 as DatasetListSubmenu, $789279954d8eff7f$export$2e2bcd8739ae039 as ApiDocumentation, $af099c546cb226c7$export$2e2bcd8739ae039 as ResourceHeader, $626282d9a03c51d5$export$2e2bcd8739ae039 as ResourcePreview, $072291d44ce1834a$export$2e2bcd8739ae039 as ResourceFooter, $ec3e23baa005dc03$export$2e2bcd8739ae039 as Breadcrumb, $bd76a91923d7e8a7$export$2e2bcd8739ae039 as TransformedDate, $d98f94c79ddf4e0e$export$2e2bcd8739ae039 as DataTable, $bdb071ea3a6d3466$export$2e2bcd8739ae039 as SearchInput, $5644ebd2c3dbfd7b$export$eea3a12df15499ca as buildRows, $2ed0091f7e32d1e6$export$2e2bcd8739ae039 as DataTablePageResults, $1a2bf34e2a8f6b80$export$59a943b34a82e690 as truncateText, $c96c4b9ef7203c1f$export$2e2bcd8739ae039 as APIPage, $026cb986f9fea2b1$export$2e2bcd8739ae039 as PageNotFound, $e873081a6e8f024e$export$2e2bcd8739ae039 as DatasetSearch, $550bcc185f420ff5$export$2e2bcd8739ae039 as DatasetList, $a0f13962e513caa1$export$2e2bcd8739ae039 as Dataset, $a35cf16d1488f54e$export$2e2bcd8739ae039 as DatasetTable, $b9af6ce5e2c06331$export$2e2bcd8739ae039 as Header, $a6df0aa147323304$export$2e2bcd8739ae039 as Footer, $669d2782ec2e2250$export$2e2bcd8739ae039 as SpecsAndLimits, $8b67b7ee3fcfb629$export$2e2bcd8739ae039 as StoredQueryPage, $f61ecf9f84951a61$export$2e2bcd8739ae039 as FilteredResource, $bef7bff2823feea2$export$2e2bcd8739ae039 as QueryTitle, $7264a673914aa746$export$2b9377795161999 as buildOperatorOptions, $7264a673914aa746$export$e284ae5d89467c8f as convertUTCToLocalDate, $7264a673914aa746$export$6b5e57d20078142b as cleanText, $7264a673914aa746$export$8049e8f40a9bdfb8 as buildCustomColHeaders, $11500a65bd7d9cf1$export$2e2bcd8739ae039 as HeaderContext, $43a30d745a7bbc86$export$2e2bcd8739ae039 as DataTableContext, $ee0d4d4f34048447$export$2e2bcd8739ae039 as DataTableActionsProvider, $844981eac9b63865$export$eccc29c8d0ff408 as ACAContext, $efc410f5f7ac5ef3$export$2e2bcd8739ae039 as useSearchAPI, $1d3d480a9cfaabe0$export$2e2bcd8739ae039 as useDatastore, $aa4450dcbeef3ac0$export$385a5aba38cc3325 as transformTableSortToQuerySort, $eb7821d186b1a389$export$2e2bcd8739ae039 as useAddLoginLink, $90fb213ab8eeb2e7$export$2e2bcd8739ae039 as useScrollToTop, $b4aa9c66f2e86959$export$2e2bcd8739ae039 as useMetastoreDataset, $61ff88fb3f6ee2c8$export$2e2bcd8739ae039 as withQueryProvider, $6d5c0212e738499b$export$34e95918366a058e as acaToParams, $6da0396069e23175$export$bc27cf7ecf44639d as defaultMetadataMapping};
 //# sourceMappingURL=main.js.map