@sustaina/shared-ui 1.3.0 → 1.4.0

package/dist/index.mjs

@@ -1,5 +1,5 @@
-import * as React3 from 'react';
-import React3__default, { createContext, isValidElement, useState, useEffect, useId, useContext, useRef, useCallback, useMemo, createElement } from 'react';
+import * as React4 from 'react';
+import React4__default, { createContext, isValidElement, useState, useEffect, useId, useContext, useRef, useCallback, useMemo, createElement } from 'react';
 import { Controller, useFormContext, useForm, useFieldArray, FormProvider, get, set, appendErrors, useFormState } from 'react-hook-form';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import clsx3, { clsx } from 'clsx';
@@ -980,6 +980,38 @@ var DataTable = ({
   );
 };
 var DataTable_default = DataTable;
+var usePreventPageLeaveStore = 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();
+  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);
+  useEffect(() => {
+    setPreventing(isPrevening);
+  }, [isPrevening, setPreventing]);
+};
+var usePreventPageLeave_default = usePreventPageLeave;
 var buttonVariants = 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",
   {
@@ -1103,15 +1135,15 @@ var t2 = function(o3, t3, s2) {
   };
 };
 var Form = FormProvider;
-var FormFieldContext2 = React3.createContext({});
+var FormFieldContext2 = React4.createContext({});
 var FormField2 = ({
   ...props
 }) => {
   return /* @__PURE__ */ jsx(FormFieldContext2.Provider, { value: { name: props.name }, children: /* @__PURE__ */ jsx(Controller, { ...props }) });
 };
 var useFormField2 = () => {
-  const fieldContext = React3.useContext(FormFieldContext2);
-  const itemContext = React3.useContext(FormItemContext2);
+  const fieldContext = React4.useContext(FormFieldContext2);
+  const itemContext = React4.useContext(FormItemContext2);
   const { getFieldState } = useFormContext();
   const formState = useFormState({ name: fieldContext.name });
   const fieldState = getFieldState(fieldContext.name, formState);
@@ -1128,9 +1160,9 @@ var useFormField2 = () => {
     ...fieldState
   };
 };
-var FormItemContext2 = React3.createContext({});
+var FormItemContext2 = React4.createContext({});
 function FormItem2({ className, ...props }) {
-  const id = React3.useId();
+  const id = React4.useId();
   return /* @__PURE__ */ jsx(FormItemContext2.Provider, { value: { id }, children: /* @__PURE__ */ jsx("div", { "data-slot": "form-item", className: cn("grid gap-2", className), ...props }) });
 }
 function FormControl({ ...props }) {
@@ -1770,7 +1802,7 @@ var InfoIcon = (props) => {
     }
   );
 };
-var InfoIcon_default = React3__default.memo(InfoIcon);
+var InfoIcon_default = React4__default.memo(InfoIcon);
 function TooltipProvider2({
   delayDuration = 0,
   ...props
@@ -1942,7 +1974,7 @@ var Navbar = ({
     }
   );
 };
-var navbar_default = React3__default.memo(Navbar);
+var navbar_default = React4__default.memo(Navbar);
 var ExpandCollapse = ({ title, children, portalId }) => {
   const [isOpen, setIsOpen] = useState(false);
   const Panel = /* @__PURE__ */ jsx(
@@ -2477,13 +2509,13 @@ function DatePicker({
   className,
   ...props
 }) {
-  const today = React3.useMemo(() => startOfDay(/* @__PURE__ */ new Date()), []);
-  const [displayed, setDisplayed] = React3.useState(
+  const today = React4.useMemo(() => startOfDay(/* @__PURE__ */ new Date()), []);
+  const [displayed, setDisplayed] = React4.useState(
     selectedDate ? new Date(selectedDate) : /* @__PURE__ */ new Date()
   );
   minDate = clampToDay(minDate);
   maxDate = clampToDay(maxDate);
-  const disabledSet = React3.useMemo(() => {
+  const disabledSet = React4.useMemo(() => {
     const s2 = /* @__PURE__ */ new Set();
     disabledDates?.forEach((d) => s2.add(startOfDay(d).toISOString()));
     return s2;
@@ -2492,7 +2524,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.useMemo(() => {
+  const weekdays = React4.useMemo(() => {
     const labels = [];
     for (let i2 = 0; i2 < 7; i2++) {
       const idx = i2;
@@ -2501,7 +2533,7 @@ function DatePicker({
     }
     return labels;
   }, [callbacks]);
-  const grid = React3.useMemo(() => buildCalendarGrid(displayed, true), [displayed]);
+  const grid = React4.useMemo(() => buildCalendarGrid(displayed, true), [displayed]);
   const isDateDisabled = (date) => {
     const d = startOfDay(date);
     if (minDate && d < minDate) return true;
@@ -4384,15 +4416,15 @@ function Label4({ className, ...props }) {
   );
 }
 var Form2 = FormProvider;
-var FormFieldContext3 = React3.createContext({});
+var FormFieldContext3 = React4.createContext({});
 var FormField3 = ({
   ...props
 }) => {
   return /* @__PURE__ */ jsx(FormFieldContext3.Provider, { value: { name: props.name }, children: /* @__PURE__ */ jsx(Controller, { ...props }) });
 };
 var useFormField3 = () => {
-  const fieldContext = React3.useContext(FormFieldContext3);
-  const itemContext = React3.useContext(FormItemContext3);
+  const fieldContext = React4.useContext(FormFieldContext3);
+  const itemContext = React4.useContext(FormItemContext3);
   const { getFieldState } = useFormContext();
   const formState = useFormState({ name: fieldContext.name });
   const fieldState = getFieldState(fieldContext.name, formState);
@@ -4409,9 +4441,9 @@ var useFormField3 = () => {
     ...fieldState
   };
 };
-var FormItemContext3 = React3.createContext({});
+var FormItemContext3 = React4.createContext({});
 function FormItem3({ className, ...props }) {
-  const id = React3.useId();
+  const id = React4.useId();
   return /* @__PURE__ */ jsx(FormItemContext3.Provider, { value: { id }, children: /* @__PURE__ */ jsx("div", { "data-slot": "form-item", className: cn2("grid gap-2", className), ...props }) });
 }
 function FormControl2({ ...props }) {
@@ -4443,7 +4475,7 @@ var AdvanceSearchRow = ({
   const { control } = form;
   const fieldSchema = fields.find((f) => f.name === row.fieldName);
   const fieldType = fieldSchema?.type ?? "text";
-  React3__default.useEffect(() => {
+  React4__default.useEffect(() => {
     if (operators && operators.length > 0 && !operators.includes(row.operator)) {
       onChangeOperator(operators[0]);
     }
@@ -4454,8 +4486,8 @@ var AdvanceSearchRow = ({
   const isLookup = fieldType === "lookup";
   const isNumber = fieldType === "number";
   const isDate2 = fieldType === "date" || fieldType === "datetime";
-  const [openDateValue1, setOpenDateValue1] = React3__default.useState(false);
-  const [openDateValue2, setOpenDateValue2] = React3__default.useState(false);
+  const [openDateValue1, setOpenDateValue1] = React4__default.useState(false);
+  const [openDateValue2, setOpenDateValue2] = React4__default.useState(false);
   const toDateFromISO = (v) => {
     if (!v) return void 0;
     try {
@@ -5014,6 +5046,6 @@ function ConfirmDialog({ dialogData, setDialog, onClose }) {
   ] }) });
 }
 
-export { AdvanceSearch_default as AdvanceSearch, Button, DataTable_default as DataTable, ConfirmDialog as Dialog, FormErrorMessage, FormField, FormFieldContext, FormItem, FormItemContext, FormLabel, GridSettingsModal_default as GridSettingsModal, HeaderCell_default as HeaderCell, navbar_default as Navbar, NumberInput, TextInput, booleanToSelectValue, buttonVariants, cn, compareAlphanumeric, getColumnIdFromTable, renderContentSlot, selectValueToBoolean, useFormField, useGridSettingsStore, useHover_default as useHover, useIntersectionObserver_default as useIntersectionObserver, useMediaQuery_default as useMediaQuery, useScreenSize_default as useScreenSize };
+export { AdvanceSearch_default as AdvanceSearch, Button, DataTable_default as DataTable, ConfirmDialog as Dialog, FormErrorMessage, FormField, FormFieldContext, FormItem, FormItemContext, FormLabel, GridSettingsModal_default as GridSettingsModal, HeaderCell_default as HeaderCell, navbar_default as Navbar, NumberInput, PreventPageLeave_default as PreventPageLeave, TextInput, booleanToSelectValue, buttonVariants, cn, compareAlphanumeric, getColumnIdFromTable, renderContentSlot, selectValueToBoolean, useFormField, useGridSettingsStore, useHover_default as useHover, useIntersectionObserver_default as useIntersectionObserver, useMediaQuery_default as useMediaQuery, usePreventPageLeave_default as usePreventPageLeave, usePreventPageLeaveStore_default as usePreventPageLeaveStore, useScreenSize_default as useScreenSize };
 //# sourceMappingURL=index.mjs.map
 //# sourceMappingURL=index.mjs.map