@overmap-ai/blocks 1.0.25-table-row-loading.0 → 1.0.25-try-to-fix-react-table-library-imports.2

package/dist/blocks.umd.cjs

@@ -1,6 +1,6 @@
 (function(global, factory) {
-  typeof exports === "object" && typeof module !== "undefined" ? factory(exports, require("react/jsx-runtime"), require("@radix-ui/themes"), require("react"), require("react-responsive"), require("@radix-ui/react-icons"), require("@radix-ui/react-context-menu"), require("@radix-ui/react-dropdown-menu"), require("react-device-detect"), require("@radix-ui/react-dialog"), require("re-resizable"), require("react-transition-group"), require("react-dom"), require("@radix-ui/react-slot"), require("@radix-ui/react-dismissable-layer"), require("@radix-ui/react-toggle-group"), require("@radix-ui/react-toolbar"), require("@radix-ui/react-toast"), require("react-error-boundary"), require("feather-icons-react"), require("@table-library/react-table-library/table.js"), require("@table-library/react-table-library/theme.js"), require("@table-library/react-table-library/sort.js"), require("@table-library/react-table-library/select.js"), require("@table-library/react-table-library/pagination.js")) : typeof define === "function" && define.amd ? define(["exports", "react/jsx-runtime", "@radix-ui/themes", "react", "react-responsive", "@radix-ui/react-icons", "@radix-ui/react-context-menu", "@radix-ui/react-dropdown-menu", "react-device-detect", "@radix-ui/react-dialog", "re-resizable", "react-transition-group", "react-dom", "@radix-ui/react-slot", "@radix-ui/react-dismissable-layer", "@radix-ui/react-toggle-group", "@radix-ui/react-toolbar", "@radix-ui/react-toast", "react-error-boundary", "feather-icons-react", "@table-library/react-table-library/table.js", "@table-library/react-table-library/theme.js", "@table-library/react-table-library/sort.js", "@table-library/react-table-library/select.js", "@table-library/react-table-library/pagination.js"], factory) : (global = typeof globalThis !== "undefined" ? globalThis : global || self, factory(global.blocks = {}, global.jsxRuntime, global.themes, global.React, global.reactResponsive, global.reactIcons, global.RadixContextMenu, global.RadixDropdownMenu, global.reactDeviceDetect, global.RadixDialogPrimitive, global.reResizable, global.reactTransitionGroup, global.ReactDOM, global.reactSlot, global.reactDismissableLayer, global.reactToggleGroup, global.reactToolbar, global.RadixToast, global.reactErrorBoundary, global.FeatherIcon, global.table_js, global.theme_js, global.sort_js, global.select_js, global.pagination_js));
-})(this, function(exports2, jsxRuntime, themes, React, reactResponsive, reactIcons, RadixContextMenu, RadixDropdownMenu, reactDeviceDetect, RadixDialogPrimitive, reResizable, reactTransitionGroup, ReactDOM, reactSlot, reactDismissableLayer, reactToggleGroup, reactToolbar, RadixToast, reactErrorBoundary, FeatherIcon, table_js, theme_js, sort_js, select_js, pagination_js) {
+  typeof exports === "object" && typeof module !== "undefined" ? factory(exports, require("react/jsx-runtime"), require("@radix-ui/themes"), require("react"), require("react-responsive"), require("@radix-ui/react-icons"), require("@radix-ui/react-context-menu"), require("@radix-ui/react-dropdown-menu"), require("react-device-detect"), require("@radix-ui/react-dialog"), require("re-resizable"), require("react-transition-group"), require("react-dom"), require("@radix-ui/react-slot"), require("@radix-ui/react-dismissable-layer"), require("@radix-ui/react-toggle-group"), require("@radix-ui/react-toolbar"), require("@radix-ui/react-toast"), require("react-error-boundary"), require("feather-icons-react")) : typeof define === "function" && define.amd ? define(["exports", "react/jsx-runtime", "@radix-ui/themes", "react", "react-responsive", "@radix-ui/react-icons", "@radix-ui/react-context-menu", "@radix-ui/react-dropdown-menu", "react-device-detect", "@radix-ui/react-dialog", "re-resizable", "react-transition-group", "react-dom", "@radix-ui/react-slot", "@radix-ui/react-dismissable-layer", "@radix-ui/react-toggle-group", "@radix-ui/react-toolbar", "@radix-ui/react-toast", "react-error-boundary", "feather-icons-react"], factory) : (global = typeof globalThis !== "undefined" ? globalThis : global || self, factory(global.blocks = {}, global.jsxRuntime, global.themes, global.React, global.reactResponsive, global.reactIcons, global.RadixContextMenu, global.RadixDropdownMenu, global.reactDeviceDetect, global.RadixDialogPrimitive, global.reResizable, global.reactTransitionGroup, global.ReactDOM, global.reactSlot, global.reactDismissableLayer, global.reactToggleGroup, global.reactToolbar, global.RadixToast, global.reactErrorBoundary, global.FeatherIcon));
+})(this, function(exports2, jsxRuntime, themes, React, reactResponsive, reactIcons, RadixContextMenu, RadixDropdownMenu, reactDeviceDetect, RadixDialogPrimitive, reResizable, reactTransitionGroup, ReactDOM, reactSlot, reactDismissableLayer, reactToggleGroup, reactToolbar, RadixToast, reactErrorBoundary, FeatherIcon) {
   "use strict";
   function _interopNamespaceDefault(e) {
     const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
@@ -95,11 +95,11 @@
     info: "gray"
   };
   const useSeverityColor = (severity) => {
-    const theme = themes.useThemeContext();
+    const theme2 = themes.useThemeContext();
     if (!severity)
       return void 0;
     if (severity === "primary")
-      return theme.accentColor;
+      return theme2.accentColor;
     return nonThemeSeverityMapping[severity];
   };
   const useViewportSize = () => {
@@ -1493,6 +1493,7 @@
   });
   const Sidebar = React.memo(_Sidebar);
   const LayoutContext = React.createContext({});
+  const useLayoutContext = () => React.useContext(LayoutContext);
   const Root$1 = React.memo((props) => {
     const { children, small = false, hideLayout = false } = props;
     const [showLeftSlideOut, setShowLeftSlideOut] = React.useState(false);
@@ -1511,7 +1512,6 @@
     return /* @__PURE__ */ jsxRuntime.jsx(LayoutContext.Provider, { value: contextValue, children });
   });
   Root$1.displayName = "Layout.Root";
-  const useLayoutContext = () => React.useContext(LayoutContext);
   const Container = React.memo(
     React.forwardRef((props, ref) => {
       const { children, style, grow = "1", height = "100%", position, ...rest } = props;
@@ -3553,7 +3553,7 @@
   const tableContainer = "_tableContainer_5i91d_25";
   const searchContainer = "_searchContainer_5i91d_30";
   const columnFilterSelect = "_columnFilterSelect_5i91d_40";
-  const table = "_table_5i91d_21";
+  const table$1 = "_table_5i91d_21";
   const tableHeaderCell = "_tableHeaderCell_5i91d_58";
   const showSortIcon = "_showSortIcon_5i91d_74";
   const tableRow = "_tableRow_5i91d_78";
@@ -3572,7 +3572,7 @@
     tableContainer,
     searchContainer,
     columnFilterSelect,
-    table,
+    table: table$1,
     tableHeaderCell,
     showSortIcon,
     tableRow,
@@ -3584,6 +3584,16 @@
     pageText,
     descriptionSecondLine
   };
+  const table = import("@overmap-ai/react-table-library/table.js");
+  const { Body, Cell, Header, HeaderCell, HeaderRow, Row, Table: ReactLibraryTable } = table;
+  const theme = import("@overmap-ai/react-table-library/theme.js");
+  const { useTheme } = theme;
+  const sort = import("@overmap-ai/react-table-library/sort.js");
+  const { HeaderCellSort, useSort } = sort;
+  const select = import("@overmap-ai/react-table-library/select.js");
+  const { CellSelect, HeaderCellSelect, SelectClickTypes, SelectTypes, useRowSelect } = select;
+  const pagination = import("@overmap-ai/react-table-library/pagination.js");
+  const { usePagination } = pagination;
   const _Table = React.forwardRef(function Table2(props, ref) {
     var _a;
     const {
@@ -3732,7 +3742,7 @@
       setSearch(e.target.value);
     }, []);
     const tableData = { nodes: rows };
-    const tableSelect = select_js.useRowSelect(
+    const tableSelect = useRowSelect(
       tableData,
       {
         onChange: (_action, state) => {
@@ -3740,13 +3750,13 @@
         }
       },
       {
-        rowSelect: select_js.SelectTypes.MultiSelect,
-        buttonSelect: select_js.SelectTypes.MultiSelect,
-        clickType: select_js.SelectClickTypes.ButtonClick,
+        rowSelect: SelectTypes.MultiSelect,
+        buttonSelect: SelectTypes.MultiSelect,
+        clickType: SelectClickTypes.ButtonClick,
         isCarryForward: false
       }
     );
-    const pagination = pagination_js.usePagination(
+    const pagination2 = usePagination(
       tableData,
       {
         state: {
@@ -3758,7 +3768,7 @@
         isServer: false
       }
     );
-    const sort = sort_js.useSort(
+    const sort2 = useSort(
       tableData,
       {
         onChange: (_action, state) => {
@@ -3843,7 +3853,7 @@
       [columnFilterValues, columns, getFilterValues]
     );
     const columnCells = columnsData.map((column) => {
-      const Component = column.sort ? sort_js.HeaderCellSort : table_js.HeaderCell;
+      const Component = column.sort ? HeaderCellSort : HeaderCell;
       let firstLine = column.label;
       let secondLine = void 0;
       if (column.label && typeof column.label === "string") {
@@ -3875,7 +3885,7 @@
     });
     const SelectedModeButton = reactDeviceDetect.isMobile ? IconButton : Button2;
     const layout = React.useMemo(() => ({ custom: true, ...fixHeader && { fixedHeader: true } }), [fixHeader]);
-    const theme = theme_js.useTheme({
+    const theme2 = useTheme({
       Table: `
 			 --data-table-library_grid-template-columns: ${gridTemplateColumns} !important;
 		`,
@@ -3898,14 +3908,14 @@
       if (showPageNavigation) {
         const numTotalPages = Math.ceil(rows.length / numRowsPerPage);
         setTotalPages(numTotalPages);
-        if (pagination.state.page < 0) {
-          pagination.fns.onSetPage(0);
+        if (pagination2.state.page < 0) {
+          pagination2.fns.onSetPage(0);
         }
-        if (pagination.state.page > numTotalPages - 1) {
-          pagination.fns.onSetPage(numTotalPages - 1);
+        if (pagination2.state.page > numTotalPages - 1) {
+          pagination2.fns.onSetPage(numTotalPages - 1);
         }
       }
-    }, [rowsPerPage, rows.length, numRowsPerPage, pagination, showPageNavigation]);
+    }, [rowsPerPage, rows.length, numRowsPerPage, pagination2, showPageNavigation]);
     return /* @__PURE__ */ jsxRuntime.jsxs(themes.Flex, { className: classNames({ [styles$1.outerTableContainer]: showContainer }), direction: "column", height: "100%", children: [
       (!!title || !!description) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles$1.headerContainer, children: [
         !!title && /* @__PURE__ */ jsxRuntime.jsx(Text$1, { weight: "bold", size: "5", children: title }),
@@ -3938,7 +3948,7 @@
               color: "crimson",
               onClick: () => {
                 setColumnFilterValues(defaultColumnFilterValues);
-                pagination.fns.onSetPage(0);
+                pagination2.fns.onSetPage(0);
               },
               "aria-label": "Clear filters",
               children: /* @__PURE__ */ jsxRuntime.jsx(reactIcons.Cross2Icon, {})
@@ -3959,33 +3969,33 @@
       ] }),
       children,
       /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles$1.tableContainer, children: /* @__PURE__ */ jsxRuntime.jsx(
-        table_js.Table,
+        ReactLibraryTable,
         {
           className: classNames(styles$1.table, className),
           data: tableData,
-          theme,
-          sort,
-          pagination: showPageNavigation && pagination,
+          theme: theme2,
+          sort: sort2,
+          pagination: showPageNavigation && pagination2,
           select: tableSelect,
           layout,
           ref,
           children: (tableList) => /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-            /* @__PURE__ */ jsxRuntime.jsx(table_js.Header, { children: /* @__PURE__ */ jsxRuntime.jsxs(table_js.HeaderRow, { children: [
-              showSelect && /* @__PURE__ */ jsxRuntime.jsx(select_js.HeaderCellSelect, { className: styles$1.tableHeaderCell }),
+            /* @__PURE__ */ jsxRuntime.jsx(Header, { children: /* @__PURE__ */ jsxRuntime.jsxs(HeaderRow, { children: [
+              showSelect && /* @__PURE__ */ jsxRuntime.jsx(HeaderCellSelect, { className: styles$1.tableHeaderCell }),
               ...columnCells
             ] }) }),
-            /* @__PURE__ */ jsxRuntime.jsxs(table_js.Body, { children: [
-              tableList.length === 0 && /* @__PURE__ */ jsxRuntime.jsx(themes.TableRow, { className: styles$1.noDataTextContainer, children: /* @__PURE__ */ jsxRuntime.jsx(table_js.Cell, { children: emptyMessage }) }),
+            /* @__PURE__ */ jsxRuntime.jsxs(Body, { children: [
+              tableList.length === 0 && /* @__PURE__ */ jsxRuntime.jsx(themes.TableRow, { className: styles$1.noDataTextContainer, children: /* @__PURE__ */ jsxRuntime.jsx(Cell, { children: emptyMessage }) }),
               tableList.map((row) => /* @__PURE__ */ jsxRuntime.jsx(
-                table_js.Row,
+                Row,
                 {
                   item: row,
                   className: classNames(styles$1.tableRow, rowClassName, row.className, {
                     [styles$1.disabled]: row.disabled
                   }),
-                  onClick: !row.loading && !row.disabled && row.onClick,
+                  onClick: !row.disabled && row.onClick,
                   children: row.loading ? /* @__PURE__ */ jsxRuntime.jsx(
-                    table_js.Cell,
+                    Cell,
                     {
                       style: {
                         gridColumn: `1 / span ${columns.length}`
@@ -3994,11 +4004,11 @@
                     },
                     `loading-${row.id}`
                   ) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-                    showSelect && /* @__PURE__ */ jsxRuntime.jsx(select_js.CellSelect, { item: row }, row.id),
+                    showSelect && /* @__PURE__ */ jsxRuntime.jsx(CellSelect, { item: row }, row.id),
                     columns.map((column, i) => {
                       const cell = row[column.id];
                       return /* @__PURE__ */ jsxRuntime.jsx(
-                        table_js.Cell,
+                        Cell,
                         {
                           className: classNames(
                             styles$1.tableCell,
@@ -4031,7 +4041,7 @@
               items: rowsPerPageOptions,
               defaultValue: (_a = rowsPerPageOptions.find((rowPerPage) => rowPerPage.value === defaultRowsPerPage.toString())) == null ? void 0 : _a.value.toString(),
               onValueChange: (v) => {
-                pagination.fns.onSetSize(Number(v));
+                pagination2.fns.onSetSize(Number(v));
                 setNumRowsPerPage(Number(v));
               },
               placeholder: rowsPerPageOptions[0].itemContent,
@@ -4039,14 +4049,14 @@
             }
           )
         ] }),
-        showPageNumber && /* @__PURE__ */ jsxRuntime.jsx(themes.Flex, { justify: "center", children: /* @__PURE__ */ jsxRuntime.jsx(Text$1, { className: styles$1.pageText, size: "2", children: totalPages > 0 && `Page ${pagination.state.page + 1} of ${totalPages}` }) }),
+        showPageNumber && /* @__PURE__ */ jsxRuntime.jsx(themes.Flex, { justify: "center", children: /* @__PURE__ */ jsxRuntime.jsx(Text$1, { className: styles$1.pageText, size: "2", children: totalPages > 0 && `Page ${pagination2.state.page + 1} of ${totalPages}` }) }),
         showPageNavigation && /* @__PURE__ */ jsxRuntime.jsxs(themes.Flex, { className: styles$1.rowsPerPageContainer, gap: "2", justify: "end", children: [
           /* @__PURE__ */ jsxRuntime.jsx(
             IconButton,
             {
               variant: "surface",
-              onClick: () => pagination.fns.onSetPage(0),
-              disabled: pagination.state.page === 0 || totalPages === 0,
+              onClick: () => pagination2.fns.onSetPage(0),
+              disabled: pagination2.state.page === 0 || totalPages === 0,
               "aria-label": "Go to first page",
               children: /* @__PURE__ */ jsxRuntime.jsx(reactIcons.DoubleArrowLeftIcon, {})
             }
@@ -4055,8 +4065,8 @@
             IconButton,
             {
               variant: "surface",
-              disabled: pagination.state.page === 0 || totalPages === 0,
-              onClick: () => pagination.fns.onSetPage(pagination.state.page - 1),
+              disabled: pagination2.state.page === 0 || totalPages === 0,
+              onClick: () => pagination2.fns.onSetPage(pagination2.state.page - 1),
               "aria-label": "Previous page",
               children: /* @__PURE__ */ jsxRuntime.jsx(reactIcons.ChevronLeftIcon, {})
             }
@@ -4065,8 +4075,8 @@
             IconButton,
             {
               variant: "surface",
-              disabled: pagination.state.page + 1 === totalPages || totalPages === 0,
-              onClick: () => pagination.fns.onSetPage(pagination.state.page + 1),
+              disabled: pagination2.state.page + 1 === totalPages || totalPages === 0,
+              onClick: () => pagination2.fns.onSetPage(pagination2.state.page + 1),
               "aria-label": "Next page",
               children: /* @__PURE__ */ jsxRuntime.jsx(reactIcons.ChevronRightIcon, {})
             }
@@ -4075,8 +4085,8 @@
             IconButton,
             {
               variant: "surface",
-              disabled: pagination.state.page + 1 === totalPages || totalPages === 0,
-              onClick: () => pagination.fns.onSetPage(totalPages - 1),
+              disabled: pagination2.state.page + 1 === totalPages || totalPages === 0,
+              onClick: () => pagination2.fns.onSetPage(totalPages - 1),
               "aria-label": "Go to last page",
               children: /* @__PURE__ */ jsxRuntime.jsx(reactIcons.DoubleArrowRightIcon, {})
             }
@@ -4290,6 +4300,7 @@
   exports2.IconColorUtility = IconColorUtility;
   exports2.Input = Input;
   exports2.Layout = Layout;
+  exports2.LayoutContext = LayoutContext;
   exports2.LeftAndRightPanels = LeftAndRightPanels;
   exports2.MultiPagePopover = MultiPagePopover;
   exports2.MultiSelect = MultiSelect;