@sustaina/shared-ui 1.3.0 → 1.4.0

package/dist/index.d.mts

@@ -3,10 +3,10 @@ import * as React$1 from 'react';
 import React__default, { CSSProperties, ReactNode } from 'react';
 import { FieldValues, FieldPath, ControllerProps, UseFormGetFieldState } from 'react-hook-form';
 import { Header, RowData as RowData$1, Column as Column$1, Table as Table$1, ColumnDef, ColumnFiltersState, OnChangeFn, FilterFnOption, SortingState, ColumnOrderState, VisibilityState, ColumnPinningState, GroupingState, GroupingOptions, ColumnResizeMode, RowSelectionState, Row, ExpandedState, HeaderGroup, Cell, HeaderContext } from '@tanstack/react-table';
+import * as zustand from 'zustand';
 import * as class_variance_authority_dist_types from 'class-variance-authority/dist/types';
 import { VariantProps } from 'class-variance-authority';
 import { ClassValue } from 'clsx';
-import * as zustand from 'zustand';
 
 type FormErrorMessageProps = React__default.ComponentProps<"p"> & {
     errorClassName?: string;
@@ -259,6 +259,19 @@ type HeaderCellProps<TData = any, TValue = any> = {
 };
 declare const HeaderCell: ({ rootClassName, labelClassName, context, label, sorterProps }: HeaderCellProps) => react_jsx_runtime.JSX.Element;
 
+declare const PreventPageLeave: ({ children }: React__default.PropsWithChildren) => React__default.ReactNode;
+
+type PreventPageLeaveStore = {
+    isPreventing: boolean;
+    setPreventing: (value: boolean) => void;
+};
+declare const usePreventPageLeaveStore: zustand.UseBoundStore<zustand.StoreApi<PreventPageLeaveStore>>;
+
+type UsePreventPageLeaveOptions = {
+    isPrevening: boolean;
+};
+declare const usePreventPageLeave: ({ isPrevening }: UsePreventPageLeaveOptions) => void;
+
 declare const buttonVariants: (props?: ({
     variant?: "link" | "default" | "outline" | "cancel" | "destructive" | "secondary" | "ghost" | "defaultSelect" | "defaultOutline" | null | undefined;
     size?: "default" | "option" | "icon" | "sm" | "lg" | "icon-xs" | "icon-sm" | "icon-md" | "icon-lg" | null | undefined;
@@ -473,4 +486,4 @@ type Breakpoints = {
 };
 declare const useScreenSize: (breakpoints?: Breakpoints) => UseScreenSizeResult;
 
-export { AdvanceSearch, type Breakpoints, Button, type Column, type ContentSlot, DataTable, type DataTableChildrenKeyHandler, type DataTableColumnFilter, type DataTableColumnFilterProps, type DataTableColumnGrouping, type DataTableColumnOrdering, type DataTableColumnPinning, type DataTableColumnSorting, type DataTableColumnVisibility, type DataTableComponentProps, type DataTableFilterConfig, type DataTableFilters, type DataTableGlobalFilter, type DataTableHeaderCell, type DataTableProps, type DataTableRenderHeaderHandler, type DataTableRenderHeaderProps, type DataTableRenderRowHandler, type DataTableRenderRowProps, type DataTableRowCell, type DataTableRowClickHandler, type DataTableRowExpansion, type DataTableRowIdKeyHandler, type DataTableRowSelection, type DataTableScrollFetch, type DataTableStatusContent, type DatatableColumnResizing, ConfirmDialog as Dialog, type FieldSchema, FormErrorMessage, type FormErrorMessageProps, FormField, FormFieldContext, type FormFieldContextValue, type FormFieldProps, FormItem, FormItemContext, type FormItemContextValue, type FormItemProps, FormLabel, type FormLabelProps, type GridPayload, GridSettingsModal, type GridSettingsModalProps, HeaderCell, type HeaderCellProps, _default as Navbar, type NavbarProps, NumberInput, type NumberInputProps, type SorterProps, TextInput, type TextInputProps, type UseFormFieldOptions, type UseFormFieldReturn, type UseHoverResult, type UseMediaQueryOptions, type UseMediaQueryResult, type UseScreenSizeResult, booleanToSelectValue, buttonVariants, cn, compareAlphanumeric, getColumnIdFromTable, renderContentSlot, selectValueToBoolean, useFormField, useGridSettingsStore, useHover, useIntersectionObserver, useMediaQuery, useScreenSize };
+export { AdvanceSearch, type Breakpoints, Button, type Column, type ContentSlot, DataTable, type DataTableChildrenKeyHandler, type DataTableColumnFilter, type DataTableColumnFilterProps, type DataTableColumnGrouping, type DataTableColumnOrdering, type DataTableColumnPinning, type DataTableColumnSorting, type DataTableColumnVisibility, type DataTableComponentProps, type DataTableFilterConfig, type DataTableFilters, type DataTableGlobalFilter, type DataTableHeaderCell, type DataTableProps, type DataTableRenderHeaderHandler, type DataTableRenderHeaderProps, type DataTableRenderRowHandler, type DataTableRenderRowProps, type DataTableRowCell, type DataTableRowClickHandler, type DataTableRowExpansion, type DataTableRowIdKeyHandler, type DataTableRowSelection, type DataTableScrollFetch, type DataTableStatusContent, type DatatableColumnResizing, ConfirmDialog as Dialog, type FieldSchema, FormErrorMessage, type FormErrorMessageProps, FormField, FormFieldContext, type FormFieldContextValue, type FormFieldProps, FormItem, FormItemContext, type FormItemContextValue, type FormItemProps, FormLabel, type FormLabelProps, type GridPayload, GridSettingsModal, type GridSettingsModalProps, HeaderCell, type HeaderCellProps, _default as Navbar, type NavbarProps, NumberInput, type NumberInputProps, PreventPageLeave, type SorterProps, TextInput, type TextInputProps, type UseFormFieldOptions, type UseFormFieldReturn, type UseHoverResult, type UseMediaQueryOptions, type UseMediaQueryResult, type UsePreventPageLeaveOptions, type UseScreenSizeResult, booleanToSelectValue, buttonVariants, cn, compareAlphanumeric, getColumnIdFromTable, renderContentSlot, selectValueToBoolean, useFormField, useGridSettingsStore, useHover, useIntersectionObserver, useMediaQuery, usePreventPageLeave, usePreventPageLeaveStore, useScreenSize };

package/dist/index.d.ts

@@ -3,10 +3,10 @@ import * as React$1 from 'react';
 import React__default, { CSSProperties, ReactNode } from 'react';
 import { FieldValues, FieldPath, ControllerProps, UseFormGetFieldState } from 'react-hook-form';
 import { Header, RowData as RowData$1, Column as Column$1, Table as Table$1, ColumnDef, ColumnFiltersState, OnChangeFn, FilterFnOption, SortingState, ColumnOrderState, VisibilityState, ColumnPinningState, GroupingState, GroupingOptions, ColumnResizeMode, RowSelectionState, Row, ExpandedState, HeaderGroup, Cell, HeaderContext } from '@tanstack/react-table';
+import * as zustand from 'zustand';
 import * as class_variance_authority_dist_types from 'class-variance-authority/dist/types';
 import { VariantProps } from 'class-variance-authority';
 import { ClassValue } from 'clsx';
-import * as zustand from 'zustand';
 
 type FormErrorMessageProps = React__default.ComponentProps<"p"> & {
     errorClassName?: string;
@@ -259,6 +259,19 @@ type HeaderCellProps<TData = any, TValue = any> = {
 };
 declare const HeaderCell: ({ rootClassName, labelClassName, context, label, sorterProps }: HeaderCellProps) => react_jsx_runtime.JSX.Element;
 
+declare const PreventPageLeave: ({ children }: React__default.PropsWithChildren) => React__default.ReactNode;
+
+type PreventPageLeaveStore = {
+    isPreventing: boolean;
+    setPreventing: (value: boolean) => void;
+};
+declare const usePreventPageLeaveStore: zustand.UseBoundStore<zustand.StoreApi<PreventPageLeaveStore>>;
+
+type UsePreventPageLeaveOptions = {
+    isPrevening: boolean;
+};
+declare const usePreventPageLeave: ({ isPrevening }: UsePreventPageLeaveOptions) => void;
+
 declare const buttonVariants: (props?: ({
     variant?: "link" | "default" | "outline" | "cancel" | "destructive" | "secondary" | "ghost" | "defaultSelect" | "defaultOutline" | null | undefined;
     size?: "default" | "option" | "icon" | "sm" | "lg" | "icon-xs" | "icon-sm" | "icon-md" | "icon-lg" | null | undefined;
@@ -473,4 +486,4 @@ type Breakpoints = {
 };
 declare const useScreenSize: (breakpoints?: Breakpoints) => UseScreenSizeResult;
 
-export { AdvanceSearch, type Breakpoints, Button, type Column, type ContentSlot, DataTable, type DataTableChildrenKeyHandler, type DataTableColumnFilter, type DataTableColumnFilterProps, type DataTableColumnGrouping, type DataTableColumnOrdering, type DataTableColumnPinning, type DataTableColumnSorting, type DataTableColumnVisibility, type DataTableComponentProps, type DataTableFilterConfig, type DataTableFilters, type DataTableGlobalFilter, type DataTableHeaderCell, type DataTableProps, type DataTableRenderHeaderHandler, type DataTableRenderHeaderProps, type DataTableRenderRowHandler, type DataTableRenderRowProps, type DataTableRowCell, type DataTableRowClickHandler, type DataTableRowExpansion, type DataTableRowIdKeyHandler, type DataTableRowSelection, type DataTableScrollFetch, type DataTableStatusContent, type DatatableColumnResizing, ConfirmDialog as Dialog, type FieldSchema, FormErrorMessage, type FormErrorMessageProps, FormField, FormFieldContext, type FormFieldContextValue, type FormFieldProps, FormItem, FormItemContext, type FormItemContextValue, type FormItemProps, FormLabel, type FormLabelProps, type GridPayload, GridSettingsModal, type GridSettingsModalProps, HeaderCell, type HeaderCellProps, _default as Navbar, type NavbarProps, NumberInput, type NumberInputProps, type SorterProps, TextInput, type TextInputProps, type UseFormFieldOptions, type UseFormFieldReturn, type UseHoverResult, type UseMediaQueryOptions, type UseMediaQueryResult, type UseScreenSizeResult, booleanToSelectValue, buttonVariants, cn, compareAlphanumeric, getColumnIdFromTable, renderContentSlot, selectValueToBoolean, useFormField, useGridSettingsStore, useHover, useIntersectionObserver, useMediaQuery, useScreenSize };
+export { AdvanceSearch, type Breakpoints, Button, type Column, type ContentSlot, DataTable, type DataTableChildrenKeyHandler, type DataTableColumnFilter, type DataTableColumnFilterProps, type DataTableColumnGrouping, type DataTableColumnOrdering, type DataTableColumnPinning, type DataTableColumnSorting, type DataTableColumnVisibility, type DataTableComponentProps, type DataTableFilterConfig, type DataTableFilters, type DataTableGlobalFilter, type DataTableHeaderCell, type DataTableProps, type DataTableRenderHeaderHandler, type DataTableRenderHeaderProps, type DataTableRenderRowHandler, type DataTableRenderRowProps, type DataTableRowCell, type DataTableRowClickHandler, type DataTableRowExpansion, type DataTableRowIdKeyHandler, type DataTableRowSelection, type DataTableScrollFetch, type DataTableStatusContent, type DatatableColumnResizing, ConfirmDialog as Dialog, type FieldSchema, FormErrorMessage, type FormErrorMessageProps, FormField, FormFieldContext, type FormFieldContextValue, type FormFieldProps, FormItem, FormItemContext, type FormItemContextValue, type FormItemProps, FormLabel, type FormLabelProps, type GridPayload, GridSettingsModal, type GridSettingsModalProps, HeaderCell, type HeaderCellProps, _default as Navbar, type NavbarProps, NumberInput, type NumberInputProps, PreventPageLeave, type SorterProps, TextInput, type TextInputProps, type UseFormFieldOptions, type UseFormFieldReturn, type UseHoverResult, type UseMediaQueryOptions, type UseMediaQueryResult, type UsePreventPageLeaveOptions, type UseScreenSizeResult, booleanToSelectValue, buttonVariants, cn, compareAlphanumeric, getColumnIdFromTable, renderContentSlot, selectValueToBoolean, useFormField, useGridSettingsStore, useHover, useIntersectionObserver, useMediaQuery, usePreventPageLeave, usePreventPageLeaveStore, useScreenSize };

package/dist/index.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var React3 = require('react');
+var React4 = require('react');
 var reactHookForm = require('react-hook-form');
 var jsxRuntime = require('react/jsx-runtime');
 var clsx3 = require('clsx');
@@ -41,7 +41,7 @@ function _interopNamespace(e) {
   return Object.freeze(n);
 }
 
-var React3__namespace = /*#__PURE__*/_interopNamespace(React3);
+var React4__namespace = /*#__PURE__*/_interopNamespace(React4);
 var clsx3__default = /*#__PURE__*/_interopDefault(clsx3);
 var LabelPrimitive2__namespace = /*#__PURE__*/_interopNamespace(LabelPrimitive2);
 var DialogPrimitive__namespace = /*#__PURE__*/_interopNamespace(DialogPrimitive);
@@ -50,20 +50,20 @@ var TooltipPrimitive__namespace = /*#__PURE__*/_interopNamespace(TooltipPrimitiv
 var PopoverPrimitive__namespace = /*#__PURE__*/_interopNamespace(PopoverPrimitive);
 
 // src/components/form/form-controls/use-form-field.ts
-var FormFieldContext = React3.createContext({});
+var FormFieldContext = React4.createContext({});
 function FormField(props) {
   return /* @__PURE__ */ jsxRuntime.jsx(FormFieldContext, { value: { name: props.name }, children: /* @__PURE__ */ jsxRuntime.jsx(reactHookForm.Controller, { ...props }) });
 }
-var FormItemContext = React3.createContext({});
+var FormItemContext = React4.createContext({});
 function FormItem({ children, ...props }) {
-  const formItemId = React3.useId();
+  const formItemId = React4.useId();
   return /* @__PURE__ */ jsxRuntime.jsx(FormItemContext, { value: { id: formItemId }, children: /* @__PURE__ */ jsxRuntime.jsx("div", { ...props, children }) });
 }
 
 // src/components/form/form-controls/use-form-field.ts
 function useFormField(options) {
-  const { name: formFieldName } = React3.useContext(FormFieldContext);
-  const { id: formItemId } = React3.useContext(FormItemContext);
+  const { name: formFieldName } = React4.useContext(FormFieldContext);
+  const { id: formItemId } = React4.useContext(FormItemContext);
   const formContext = reactHookForm.useFormContext();
   if ((!formFieldName || !formItemId || !formContext) && options?.skipValidationIfNoContext) {
     return {
@@ -245,11 +245,11 @@ function renderContentSlot(slot, defaultWrapperProps) {
   return /* @__PURE__ */ jsxRuntime.jsx("div", { ...mergedProps, children: content });
 }
 var useHover = () => {
-  const [hovering, setHovering] = React3.useState(false);
-  const prevRef = React3.useRef(null);
-  const onMouseEnter = React3.useCallback(() => setHovering(true), []);
-  const onMouseLeave = React3.useCallback(() => setHovering(false), []);
-  const nodeRefCallback = React3.useCallback(
+  const [hovering, setHovering] = React4.useState(false);
+  const prevRef = React4.useRef(null);
+  const onMouseEnter = React4.useCallback(() => setHovering(true), []);
+  const onMouseLeave = React4.useCallback(() => setHovering(false), []);
+  const nodeRefCallback = React4.useCallback(
     (node) => {
       if (prevRef.current) {
         prevRef.current.removeEventListener("mouseenter", onMouseEnter);
@@ -277,15 +277,15 @@ var useIntersectionObserver = ({
   initialIsIntersecting = false,
   onChange
 } = {}) => {
-  const [ref, setRef] = React3.useState(null);
-  const [state, setState] = React3.useState(() => ({
+  const [ref, setRef] = React4.useState(null);
+  const [state, setState] = React4.useState(() => ({
     isIntersecting: initialIsIntersecting,
     entry: void 0
   }));
-  const callbackRef = React3.useRef(null);
+  const callbackRef = React4.useRef(null);
   callbackRef.current = onChange;
   const frozen = state.entry?.isIntersecting && freezeOnceVisible;
-  React3.useEffect(() => {
+  React4.useEffect(() => {
     if (!ref) return;
     if (!("IntersectionObserver" in window)) return;
     if (frozen) return;
@@ -315,8 +315,8 @@ var useIntersectionObserver = ({
     frozen,
     freezeOnceVisible
   ]);
-  const prevRef = React3.useRef(null);
-  React3.useEffect(() => {
+  const prevRef = React4.useRef(null);
+  React4.useEffect(() => {
     if (!ref && state.entry?.target && !freezeOnceVisible && !frozen && prevRef.current !== state.entry.target) {
       prevRef.current = state.entry.target;
       setState({ isIntersecting: initialIsIntersecting, entry: void 0 });
@@ -333,8 +333,8 @@ var isValidMediaQueryString = (query) => {
   return query !== "not all";
 };
 var useMediaQuery = ({ query }) => {
-  const [matches, setMatches] = React3.useState(false);
-  React3.useEffect(() => {
+  const [matches, setMatches] = React4.useState(false);
+  React4.useEffect(() => {
     if (typeof window === "undefined") {
       return;
     }
@@ -582,9 +582,9 @@ var modelOptions = [
   "getCenterVisibleLeafColumns"
 ];
 var DataTableDevTool = ({ table }) => {
-  const [open, setOpen] = React3.useState(false);
-  const [visibleStates, setVisibleStates] = React3.useState([]);
-  const [visibleModels, setVisibleModels] = React3.useState([]);
+  const [open, setOpen] = React4.useState(false);
+  const [visibleStates, setVisibleStates] = React4.useState([]);
+  const [visibleModels, setVisibleModels] = React4.useState([]);
   const tableState = table.getState();
   const toggleValue = (arr, value) => arr.includes(value) ? arr.filter((v) => v !== value) : [...arr, value];
   const getCircularReplacer = () => {
@@ -826,14 +826,14 @@ var DataTable = ({
   if (isDefined(tableRef) && !isDefined(tableRef?.current)) {
     tableRef.current = table;
   }
-  const tableContainerRef = React3.useRef(null);
+  const tableContainerRef = React4.useRef(null);
   const isTableEmpty = table.getCoreRowModel().rows.length === 0;
   const isTableEmptyAfterFiltering = table.getRowModel().rows.length === 0;
   const isFiltering = table.getState().columnFilters.length > 0 || !!table.getState().globalFilter;
   const leftVisibleLeftColumns = table.getLeftVisibleLeafColumns();
   const centerVisibleLeafColumns = table.getCenterVisibleLeafColumns();
   const rightVisibleLeafColumns = table.getRightVisibleLeafColumns();
-  const { isSomeColumnsFilterable, filterableColumns } = React3.useMemo(() => {
+  const { isSomeColumnsFilterable, filterableColumns } = React4.useMemo(() => {
     const mergedColumns = [
       ...leftVisibleLeftColumns,
       ...centerVisibleLeafColumns,
@@ -844,7 +844,7 @@ var DataTable = ({
     );
     return { isSomeColumnsFilterable: isSomeColumnsFilterable2, filterableColumns: mergedColumns };
   }, [centerVisibleLeafColumns, leftVisibleLeftColumns, rightVisibleLeafColumns]);
-  const fetchMoreOnScrollReached = React3.useCallback(
+  const fetchMoreOnScrollReached = React4.useCallback(
     (containerRefElement) => {
       if (!scrollFetch?.enabled) {
         return;
@@ -860,7 +860,7 @@ var DataTable = ({
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [scrollFetch?.enabled, scrollFetch?.isFetchingMore, scrollFetch?.hasMore, scrollFetch?.fetchMore]
   );
-  React3.useEffect(() => {
+  React4.useEffect(() => {
     fetchMoreOnScrollReached(tableContainerRef.current);
   }, [fetchMoreOnScrollReached]);
   return /* @__PURE__ */ jsxRuntime.jsxs(
@@ -945,7 +945,7 @@ var DataTable = ({
             ),
             /* @__PURE__ */ jsxRuntime.jsx(TableBody, { ...components?.tableBodyProps, children: table.getRowModel().rows.map((row) => {
               const tableDataRowProps = typeof components?.tableDataRowProps === "function" ? components.tableDataRowProps({ row, table }) || {} : components?.tableDataRowProps || {};
-              return /* @__PURE__ */ React3.createElement(
+              return /* @__PURE__ */ React4.createElement(
                 TableRow,
                 {
                   ...tableDataRowProps,
@@ -1009,6 +1009,38 @@ var DataTable = ({
   );
 };
 var DataTable_default = DataTable;
+var usePreventPageLeaveStore = zustand.create((set) => ({
+  isPreventing: false,
+  setPreventing: (value) => set({ isPreventing: value })
+}));
+var usePreventPageLeaveStore_default = usePreventPageLeaveStore;
+
+// src/components/prevent-page-leave/PreventPageLeave.tsx
+var PreventPageLeave = ({ children }) => {
+  const { isPreventing } = usePreventPageLeaveStore();
+  React4.useEffect(() => {
+    if (!isPreventing || typeof window === "undefined") {
+      return;
+    }
+    function beforeUnload(event) {
+      event.preventDefault();
+      event.returnValue = true;
+    }
+    window.addEventListener("beforeunload", beforeUnload);
+    return () => {
+      window.removeEventListener("beforeunload", beforeUnload);
+    };
+  }, [isPreventing]);
+  return children;
+};
+var PreventPageLeave_default = PreventPageLeave;
+var usePreventPageLeave = ({ isPrevening }) => {
+  const setPreventing = usePreventPageLeaveStore_default((state) => state.setPreventing);
+  React4.useEffect(() => {
+    setPreventing(isPrevening);
+  }, [isPrevening, setPreventing]);
+};
+var usePreventPageLeave_default = usePreventPageLeave;
 var buttonVariants = classVarianceAuthority.cva(
   "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive cursor-pointer",
   {
@@ -1132,15 +1164,15 @@ var t2 = function(o3, t3, s2) {
   };
 };
 var Form = reactHookForm.FormProvider;
-var FormFieldContext2 = React3__namespace.createContext({});
+var FormFieldContext2 = React4__namespace.createContext({});
 var FormField2 = ({
   ...props
 }) => {
   return /* @__PURE__ */ jsxRuntime.jsx(FormFieldContext2.Provider, { value: { name: props.name }, children: /* @__PURE__ */ jsxRuntime.jsx(reactHookForm.Controller, { ...props }) });
 };
 var useFormField2 = () => {
-  const fieldContext = React3__namespace.useContext(FormFieldContext2);
-  const itemContext = React3__namespace.useContext(FormItemContext2);
+  const fieldContext = React4__namespace.useContext(FormFieldContext2);
+  const itemContext = React4__namespace.useContext(FormItemContext2);
   const { getFieldState } = reactHookForm.useFormContext();
   const formState = reactHookForm.useFormState({ name: fieldContext.name });
   const fieldState = getFieldState(fieldContext.name, formState);
@@ -1157,9 +1189,9 @@ var useFormField2 = () => {
     ...fieldState
   };
 };
-var FormItemContext2 = React3__namespace.createContext({});
+var FormItemContext2 = React4__namespace.createContext({});
 function FormItem2({ className, ...props }) {
-  const id = React3__namespace.useId();
+  const id = React4__namespace.useId();
   return /* @__PURE__ */ jsxRuntime.jsx(FormItemContext2.Provider, { value: { id }, children: /* @__PURE__ */ jsxRuntime.jsx("div", { "data-slot": "form-item", className: cn("grid gap-2", className), ...props }) });
 }
 function FormControl({ ...props }) {
@@ -1621,7 +1653,7 @@ var GridSettingsModal = ({
   onClose,
   onSaveColumns
 }) => {
-  const [isDragging, setIsDragging] = React3.useState(false);
+  const [isDragging, setIsDragging] = React4.useState(false);
   const form = reactHookForm.useForm({
     resolver: t2(GridSettingsSchema),
     defaultValues: { columns: currentColumns },
@@ -1633,7 +1665,7 @@ var GridSettingsModal = ({
     name: "columns",
     keyName: "fieldId"
   });
-  React3.useEffect(() => {
+  React4.useEffect(() => {
     if (isOpen) {
       form.reset({ columns: currentColumns });
     }
@@ -1799,7 +1831,7 @@ var InfoIcon = (props) => {
     }
   );
 };
-var InfoIcon_default = React3__namespace.default.memo(InfoIcon);
+var InfoIcon_default = React4__namespace.default.memo(InfoIcon);
 function TooltipProvider2({
   delayDuration = 0,
   ...props
@@ -1868,7 +1900,7 @@ var Navbar = ({
 }) => {
   const { isMobile, isTablet, isDesktop } = useScreenSize_default();
   const Icon3 = lucideReact.CircleHelp;
-  const shouldShowSeparator = !separatorDisable && React3.isValidElement(searchButton);
+  const shouldShowSeparator = !separatorDisable && React4.isValidElement(searchButton);
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "nav",
     {
@@ -1879,8 +1911,8 @@ var Navbar = ({
       children: [
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2.5", children: [
           headImageURL !== "" ? /* @__PURE__ */ jsxRuntime.jsx("img", { src: headImageURL, alt: "", className: cn("w-full h-full", headImageURLClassName) }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1", children: [
-            React3.isValidElement(title) ? title : /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "text-white text-4xl font-bold", children: title }),
-            React3.isValidElement(subTitle) ? subTitle : /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "text-white text-xl font-bold", children: subTitle })
+            React4.isValidElement(title) ? title : /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "text-white text-4xl font-bold", children: title }),
+            React4.isValidElement(subTitle) ? subTitle : /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "text-white text-xl font-bold", children: subTitle })
           ] }),
           tooltipTitle && /* @__PURE__ */ jsxRuntime.jsxs(Tooltip2, { children: [
             /* @__PURE__ */ jsxRuntime.jsx(TooltipTrigger2, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("button", { className: "text-white hover:opacity-80 ", children: /* @__PURE__ */ jsxRuntime.jsx(InfoIcon_default, { className: "w-4" }) }) }),
@@ -1908,10 +1940,10 @@ var Navbar = ({
                       className: cn("flex flex-col gap-4 max-w-sm text-sm text-gray-700", className),
                       children: [
                         tooltipTitle && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
-                          React3.isValidElement(tooltipIcon) ? tooltipIcon : /* @__PURE__ */ jsxRuntime.jsx(Icon3, { size: 32, "aria-hidden": "true" }),
+                          React4.isValidElement(tooltipIcon) ? tooltipIcon : /* @__PURE__ */ jsxRuntime.jsx(Icon3, { size: 32, "aria-hidden": "true" }),
                           /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-xl font-bold", children: tooltipTitle })
                         ] }),
-                        React3.isValidElement(tooltipdescription) ? tooltipdescription : ""
+                        React4.isValidElement(tooltipdescription) ? tooltipdescription : ""
                       ]
                     }
                   ),
@@ -1965,15 +1997,15 @@ var Navbar = ({
             }
           ),
           shouldShowSeparator && /* @__PURE__ */ jsxRuntime.jsx("div", { role: "separator", className: "ml-1 w-[1px] h-10 bg-white" }),
-          React3.isValidElement(searchButton) ? searchButton : ""
+          React4.isValidElement(searchButton) ? searchButton : ""
         ] })
       ]
     }
   );
 };
-var navbar_default = React3__namespace.default.memo(Navbar);
+var navbar_default = React4__namespace.default.memo(Navbar);
 var ExpandCollapse = ({ title, children, portalId }) => {
-  const [isOpen, setIsOpen] = React3.useState(false);
+  const [isOpen, setIsOpen] = React4.useState(false);
   const Panel = /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
@@ -2054,30 +2086,30 @@ function makeNewRow(fields) {
   return { id: crypto.randomUUID(), fieldName: first.name, operator: op, value: "" };
 }
 function useAdvanceSearch({ fields, limitRows }) {
-  const [rows, setRows] = React3.useState([makeNewRow(fields)]);
-  const updateRows = React3.useCallback((next) => {
+  const [rows, setRows] = React4.useState([makeNewRow(fields)]);
+  const updateRows = React4.useCallback((next) => {
     setRows(next);
   }, []);
-  const operatorsForField = React3.useCallback(
+  const operatorsForField = React4.useCallback(
     (fieldName) => {
       const t3 = getFieldType(fields, fieldName);
       return OPERATOR_MAP[t3];
     },
     [fields]
   );
-  const addRow = React3.useCallback(() => {
+  const addRow = React4.useCallback(() => {
     if (!limitRows || rows.length < limitRows) {
       updateRows([...rows, makeNewRow(fields)]);
     }
   }, [rows, fields, updateRows, limitRows]);
-  const removeRow = React3.useCallback(
+  const removeRow = React4.useCallback(
     (id) => {
       if (rows.length === 1) return;
       updateRows(rows.filter((r2) => r2.id !== id));
     },
     [rows, updateRows]
   );
-  const clearRow = React3.useCallback(
+  const clearRow = React4.useCallback(
     (id) => {
       updateRows(
         rows.map((r2) => {
@@ -2089,10 +2121,10 @@ function useAdvanceSearch({ fields, limitRows }) {
     },
     [rows, fields, updateRows]
   );
-  const clearAllRow = React3.useCallback(() => {
+  const clearAllRow = React4.useCallback(() => {
     updateRows([makeNewRow(fields)]);
   }, [fields, updateRows]);
-  const changeField = React3.useCallback(
+  const changeField = React4.useCallback(
     (id, fieldName) => {
       const nextOp = firstOperatorFor(fields, fieldName);
       updateRows(
@@ -2104,7 +2136,7 @@ function useAdvanceSearch({ fields, limitRows }) {
     },
     [rows, fields, updateRows]
   );
-  const changeOperator = React3.useCallback(
+  const changeOperator = React4.useCallback(
     (id, operator) => {
       updateRows(
         rows.map((r2) => {
@@ -2118,7 +2150,7 @@ function useAdvanceSearch({ fields, limitRows }) {
     },
     [rows, updateRows]
   );
-  const changeValue = React3.useCallback(
+  const changeValue = React4.useCallback(
     (id, which, val) => {
       updateRows(
         rows.map((r2) => {
@@ -2130,7 +2162,7 @@ function useAdvanceSearch({ fields, limitRows }) {
     },
     [rows, updateRows]
   );
-  const fieldOptions = React3.useMemo(
+  const fieldOptions = React4.useMemo(
     () => fields.map((f) => ({
       value: f.name,
       label: f.label ?? f.name
@@ -2182,7 +2214,7 @@ function useAdvanceSearch({ fields, limitRows }) {
         return { [row.fieldName]: row.value };
     }
   };
-  const buildParam = React3.useMemo(() => {
+  const buildParam = React4.useMemo(() => {
     const andConditions = rows.map((r2) => r2.value ? rowToFilter(r2) : null).filter(Boolean);
     return { AND: andConditions };
   }, [rows]);
@@ -2506,13 +2538,13 @@ function DatePicker({
   className,
   ...props
 }) {
-  const today = React3__namespace.useMemo(() => startOfDay(/* @__PURE__ */ new Date()), []);
-  const [displayed, setDisplayed] = React3__namespace.useState(
+  const today = React4__namespace.useMemo(() => startOfDay(/* @__PURE__ */ new Date()), []);
+  const [displayed, setDisplayed] = React4__namespace.useState(
     selectedDate ? new Date(selectedDate) : /* @__PURE__ */ new Date()
   );
   minDate = clampToDay(minDate);
   maxDate = clampToDay(maxDate);
-  const disabledSet = React3__namespace.useMemo(() => {
+  const disabledSet = React4__namespace.useMemo(() => {
     const s2 = /* @__PURE__ */ new Set();
     disabledDates?.forEach((d) => s2.add(startOfDay(d).toISOString()));
     return s2;
@@ -2521,7 +2553,7 @@ function DatePicker({
   const displayMonth = displayed.getMonth();
   const monthLabel = callbacks?.monthLabel?.(displayYear, displayMonth) ?? new Intl.DateTimeFormat(void 0, { month: "short" }).format(displayed);
   const yearLabel = callbacks?.yearLabel?.(displayYear) ?? String(displayYear);
-  const weekdays = React3__namespace.useMemo(() => {
+  const weekdays = React4__namespace.useMemo(() => {
     const labels = [];
     for (let i2 = 0; i2 < 7; i2++) {
       const idx = i2;
@@ -2530,7 +2562,7 @@ function DatePicker({
     }
     return labels;
   }, [callbacks]);
-  const grid = React3__namespace.useMemo(() => buildCalendarGrid(displayed, true), [displayed]);
+  const grid = React4__namespace.useMemo(() => buildCalendarGrid(displayed, true), [displayed]);
   const isDateDisabled = (date) => {
     const d = startOfDay(date);
     if (minDate && d < minDate) return true;
@@ -2609,7 +2641,7 @@ function DatePicker({
   ] });
 }
 var TagsInput = ({ value = [], onChange, onClear, error }) => {
-  const [inputValue, setInputValue] = React3.useState("");
+  const [inputValue, setInputValue] = React4.useState("");
   const addTag = (val) => {
     const trimmed = val.trim();
     if (!trimmed) return;
@@ -4413,15 +4445,15 @@ function Label4({ className, ...props }) {
   );
 }
 var Form2 = reactHookForm.FormProvider;
-var FormFieldContext3 = React3__namespace.createContext({});
+var FormFieldContext3 = React4__namespace.createContext({});
 var FormField3 = ({
   ...props
 }) => {
   return /* @__PURE__ */ jsxRuntime.jsx(FormFieldContext3.Provider, { value: { name: props.name }, children: /* @__PURE__ */ jsxRuntime.jsx(reactHookForm.Controller, { ...props }) });
 };
 var useFormField3 = () => {
-  const fieldContext = React3__namespace.useContext(FormFieldContext3);
-  const itemContext = React3__namespace.useContext(FormItemContext3);
+  const fieldContext = React4__namespace.useContext(FormFieldContext3);
+  const itemContext = React4__namespace.useContext(FormItemContext3);
   const { getFieldState } = reactHookForm.useFormContext();
   const formState = reactHookForm.useFormState({ name: fieldContext.name });
   const fieldState = getFieldState(fieldContext.name, formState);
@@ -4438,9 +4470,9 @@ var useFormField3 = () => {
     ...fieldState
   };
 };
-var FormItemContext3 = React3__namespace.createContext({});
+var FormItemContext3 = React4__namespace.createContext({});
 function FormItem3({ className, ...props }) {
-  const id = React3__namespace.useId();
+  const id = React4__namespace.useId();
   return /* @__PURE__ */ jsxRuntime.jsx(FormItemContext3.Provider, { value: { id }, children: /* @__PURE__ */ jsxRuntime.jsx("div", { "data-slot": "form-item", className: cn2("grid gap-2", className), ...props }) });
 }
 function FormControl2({ ...props }) {
@@ -4472,7 +4504,7 @@ var AdvanceSearchRow = ({
   const { control } = form;
   const fieldSchema = fields.find((f) => f.name === row.fieldName);
   const fieldType = fieldSchema?.type ?? "text";
-  React3__namespace.default.useEffect(() => {
+  React4__namespace.default.useEffect(() => {
     if (operators && operators.length > 0 && !operators.includes(row.operator)) {
       onChangeOperator(operators[0]);
     }
@@ -4483,8 +4515,8 @@ var AdvanceSearchRow = ({
   const isLookup = fieldType === "lookup";
   const isNumber = fieldType === "number";
   const isDate2 = fieldType === "date" || fieldType === "datetime";
-  const [openDateValue1, setOpenDateValue1] = React3__namespace.default.useState(false);
-  const [openDateValue2, setOpenDateValue2] = React3__namespace.default.useState(false);
+  const [openDateValue1, setOpenDateValue1] = React4__namespace.default.useState(false);
+  const [openDateValue2, setOpenDateValue2] = React4__namespace.default.useState(false);
   const toDateFromISO = (v) => {
     if (!v) return void 0;
     try {
@@ -4723,7 +4755,7 @@ var AdvanceSearch = ({
   onSearch,
   onClear
 }) => {
-  const fieldsData = React3.useMemo(() => fields || [], [fields]);
+  const fieldsData = React4.useMemo(() => fields || [], [fields]);
   const {
     rows,
     addRow,
@@ -4741,7 +4773,7 @@ var AdvanceSearch = ({
     defaultValues: {}
   });
   const { handleSubmit, unregister, resetField, getValues, setValue } = form;
-  const onSubmit = React3.useCallback(() => {
+  const onSubmit = React4.useCallback(() => {
     const currentValues = getValues();
     const param = {
       AND: rows.map((r2) => {
@@ -5057,6 +5089,7 @@ exports.GridSettingsModal = GridSettingsModal_default;
 exports.HeaderCell = HeaderCell_default;
 exports.Navbar = navbar_default;
 exports.NumberInput = NumberInput;
+exports.PreventPageLeave = PreventPageLeave_default;
 exports.TextInput = TextInput;
 exports.booleanToSelectValue = booleanToSelectValue;
 exports.buttonVariants = buttonVariants;
@@ -5070,6 +5103,8 @@ exports.useGridSettingsStore = useGridSettingsStore;
 exports.useHover = useHover_default;
 exports.useIntersectionObserver = useIntersectionObserver_default;
 exports.useMediaQuery = useMediaQuery_default;
+exports.usePreventPageLeave = usePreventPageLeave_default;
+exports.usePreventPageLeaveStore = usePreventPageLeaveStore_default;
 exports.useScreenSize = useScreenSize_default;
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map