@overmap-ai/blocks 1.0.17-add-error-boundary-component.1 → 1.0.17-add-error-boundary-component.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-dropdown-menu"), require("@radix-ui/react-dialog"), require("re-resizable"), require("@radix-ui/react-dismissable-layer"), require("react-transition-group"), require("@radix-ui/react-toggle-group"), require("@radix-ui/react-toolbar"), require("@radix-ui/react-toast"), require("react-error-boundary"), require("react-dom"), 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"), require("react-device-detect")) : typeof define === "function" && define.amd ? define(["exports", "react/jsx-runtime", "@radix-ui/themes", "react", "react-responsive", "@radix-ui/react-icons", "@radix-ui/react-dropdown-menu", "@radix-ui/react-dialog", "re-resizable", "@radix-ui/react-dismissable-layer", "react-transition-group", "@radix-ui/react-toggle-group", "@radix-ui/react-toolbar", "@radix-ui/react-toast", "react-error-boundary", "react-dom", "@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", "react-device-detect"], factory) : (global = typeof globalThis !== "undefined" ? globalThis : global || self, factory(global.blocks = {}, global.jsxRuntime, global.themes, global.React, global.reactResponsive, global.reactIcons, global.RadixDropdownMenu, global.RadixDialogPrimitive, global.reResizable, global.reactDismissableLayer, global.reactTransitionGroup, global.reactToggleGroup, global.reactToolbar, global.RadixToast, global.reactErrorBoundary, global.reactDom, global.table_js, global.theme_js, global.sort_js, global.select_js, global.pagination_js, global.reactDeviceDetect));
-})(this, function(exports2, jsxRuntime, themes, React, reactResponsive, reactIcons, RadixDropdownMenu, RadixDialogPrimitive, reResizable, reactDismissableLayer, reactTransitionGroup, reactToggleGroup, reactToolbar, RadixToast, reactErrorBoundary, reactDom, table_js, theme_js, sort_js, select_js, pagination_js, reactDeviceDetect) {
+  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-dropdown-menu"), require("@radix-ui/react-dialog"), require("re-resizable"), require("@radix-ui/react-dismissable-layer"), require("react-transition-group"), 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("react-dom"), 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"), require("react-device-detect")) : typeof define === "function" && define.amd ? define(["exports", "react/jsx-runtime", "@radix-ui/themes", "react", "react-responsive", "@radix-ui/react-icons", "@radix-ui/react-dropdown-menu", "@radix-ui/react-dialog", "re-resizable", "@radix-ui/react-dismissable-layer", "react-transition-group", "@radix-ui/react-toggle-group", "@radix-ui/react-toolbar", "@radix-ui/react-toast", "react-error-boundary", "feather-icons-react", "react-dom", "@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", "react-device-detect"], factory) : (global = typeof globalThis !== "undefined" ? globalThis : global || self, factory(global.blocks = {}, global.jsxRuntime, global.themes, global.React, global.reactResponsive, global.reactIcons, global.RadixDropdownMenu, global.RadixDialogPrimitive, global.reResizable, global.reactDismissableLayer, global.reactTransitionGroup, global.reactToggleGroup, global.reactToolbar, global.RadixToast, global.reactErrorBoundary, global.FeatherIcon, global.reactDom, global.table_js, global.theme_js, global.sort_js, global.select_js, global.pagination_js, global.reactDeviceDetect));
+})(this, function(exports2, jsxRuntime, themes, React, reactResponsive, reactIcons, RadixDropdownMenu, RadixDialogPrimitive, reResizable, reactDismissableLayer, reactTransitionGroup, reactToggleGroup, reactToolbar, RadixToast, reactErrorBoundary, FeatherIcon, reactDom, table_js, theme_js, sort_js, select_js, pagination_js, reactDeviceDetect) {
   "use strict";
   function _interopNamespaceDefault(e) {
     const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
@@ -2261,22 +2261,34 @@
     );
   });
   const Separator = React.memo(_Separator);
-  const ErrorFallback = React.memo((props) => {
-    alert("FIND ME");
-    const { resetErrorBoundary } = props;
-    return /* @__PURE__ */ jsxRuntime.jsxs(themes.Box, { style: { background: "red" }, p: "2", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(Text$1, { children: "Something went wrong" }),
-      /* @__PURE__ */ jsxRuntime.jsx(Button2, { onClick: resetErrorBoundary, children: "Try again" })
+  const ErrorFallback = React.memo(() => {
+    const { resetBoundary } = reactErrorBoundary.useErrorBoundary();
+    const height = "20px";
+    const centerStyles = { placeSelf: "center" };
+    return /* @__PURE__ */ jsxRuntime.jsxs(Flex, { gap: "2", direction: "row", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { style: { flexGrow: 1 } }),
+      /* @__PURE__ */ jsxRuntime.jsx(FeatherIcon, { icon: "alert-triangle", size: height, style: centerStyles }),
+      /* @__PURE__ */ jsxRuntime.jsx(Text$1, { style: { lineHeight: height, ...centerStyles }, children: "Something went wrong" }),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        IconButton,
+        {
+          "aria-label": "Try again",
+          variant: "soft",
+          onClick: resetBoundary,
+          style: centerStyles,
+          hoverEffects: ["spin180Clockwise"],
+          children: /* @__PURE__ */ jsxRuntime.jsx(FeatherIcon, { icon: "refresh-ccw", size: height })
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { style: { flexGrow: 1 } })
     ] });
   });
   ErrorFallback.displayName = "ErrorFallback";
   const OvermapErrorBoundary = React.memo((props) => {
     const logError = React.useCallback((error, info) => {
       console.error(error, info);
-      alert("Test");
     }, []);
-    alert(props.children);
-    return /* @__PURE__ */ jsxRuntime.jsx(themes.Box, { style: { background: "green" }, p: "2", children: /* @__PURE__ */ jsxRuntime.jsx(reactErrorBoundary.ErrorBoundary, { fallbackRender: ErrorFallback, onError: logError, children: props.children }) });
+    return /* @__PURE__ */ jsxRuntime.jsx(reactErrorBoundary.ErrorBoundary, { fallback: /* @__PURE__ */ jsxRuntime.jsx(ErrorFallback, {}), onError: logError, children: props.children });
   });
   OvermapErrorBoundary.displayName = "OvermapErrorBoundary";
   function _extends() {