'use client';
import { randomId, useForceUpdate, useReducedMotion, useDidUpdate } from '@mantine/hooks';
import { createStore, useStore } from '@mantine/store';
import { jsx } from 'react/jsx-runtime';
import { c } from 'react/compiler-runtime';
import { forwardRef, useRef, useEffect } from 'react';
import { Transition as Transition$1, TransitionGroup } from 'react-transition-group';
import { Notification, getDefaultZIndex, createVarsResolver, rem, factory, useProps, useMantineTheme, useStyles, Box, OptionalPortal } from '@mantine/core';

const createNotificationsStore = () => createStore({
  notifications: [],
  queue: [],
  limit: 5
});
const notificationsStore = createNotificationsStore();
const useNotifications = (t0) => {
  const store = t0 === void 0 ? notificationsStore : t0;
  return useStore(store);
};
function updateNotificationsState(store, update) {
  const state = store.getState();
  const notifications2 = update([...state.notifications, ...state.queue]);
  store.setState({
    notifications: notifications2.slice(0, state.limit),
    queue: notifications2.slice(state.limit),
    limit: state.limit
  });
}
function showNotification(notification, store = notificationsStore) {
  const id = notification.id || randomId();
  updateNotificationsState(store, (notifications2) => {
    if (notification.id && notifications2.some((n) => n.id === notification.id)) {
      return notifications2;
    }
    return [...notifications2, { ...notification, id }];
  });
  return id;
}
function hideNotification(id, store = notificationsStore) {
  updateNotificationsState(
    store,
    (notifications2) => notifications2.filter((notification) => {
      if (notification.id === id) {
        notification.onClose?.(notification);
        return false;
      }
      return true;
    })
  );
  return id;
}
function updateNotification(notification, store = notificationsStore) {
  updateNotificationsState(
    store,
    (notifications2) => notifications2.map((item) => {
      if (item.id === notification.id) {
        return { ...item, ...notification };
      }
      return item;
    })
  );
  return notification.id;
}
function cleanNotifications(store = notificationsStore) {
  updateNotificationsState(store, () => []);
}
function cleanNotificationsQueue(store = notificationsStore) {
  updateNotificationsState(
    store,
    (notifications2) => notifications2.slice(0, store.getState().limit)
  );
}
const notifications = {
  show: showNotification,
  hide: hideNotification,
  update: updateNotification,
  clean: cleanNotifications,
  cleanQueue: cleanNotificationsQueue,
  updateState: updateNotificationsState
};

const transforms = {
  left: "translateX(-100%)",
  right: "translateX(100%)",
  "top-center": "translateY(-100%)",
  "bottom-center": "translateY(100%)"
};
const noTransform = {
  left: "translateX(0)",
  right: "translateX(0)",
  "top-center": "translateY(0)",
  "bottom-center": "translateY(0)"
};
function getNotificationStateStyles({
  state,
  maxHeight,
  position,
  transitionDuration
}) {
  const [vertical, horizontal] = position.split("-");
  const property = horizontal === "center" ? `${vertical}-center` : horizontal;
  const commonStyles = {
    opacity: 0,
    maxHeight,
    transform: transforms[property],
    transitionDuration: `${transitionDuration}ms, ${transitionDuration}ms, ${transitionDuration}ms`,
    transitionTimingFunction: "cubic-bezier(.51,.3,0,1.21), cubic-bezier(.51,.3,0,1.21), linear",
    transitionProperty: "opacity, transform, max-height"
  };
  const inState = {
    opacity: 1,
    transform: noTransform[property]
  };
  const outState = {
    opacity: 0,
    maxHeight: 0,
    transform: transforms[property]
  };
  const transitionStyles = {
    entering: inState,
    entered: inState,
    exiting: outState,
    exited: outState
  };
  return { ...commonStyles, ...transitionStyles[state] };
}

function getAutoClose(autoClose, notificationAutoClose) {
  if (typeof notificationAutoClose === "number") {
    return notificationAutoClose;
  }
  if (notificationAutoClose === false || autoClose === false) {
    return false;
  }
  return autoClose;
}

const NotificationContainer = forwardRef(
  (t0, ref) => {
    const $ = c(35);
    let data;
    let autoClose;
    let onHide;
    let others;
    if ($[0] !== t0) {
      ({ data, onHide, autoClose, ...others } = t0);
      $[0] = t0;
      $[1] = data;
      $[2] = autoClose;
      $[3] = onHide;
      $[4] = others;
    } else {
      data = $[1];
      autoClose = $[2];
      onHide = $[3];
      others = $[4];
    }
    let notificationProps;
    let message;
    if ($[5] !== data) {
      const { autoClose: _autoClose, message: t12, ...t22 } = data;
      message = t12;
      notificationProps = t22;
      $[5] = data;
      $[6] = notificationProps;
      $[7] = message;
    } else {
      notificationProps = $[6];
      message = $[7];
    }
    let t1;
    if ($[8] !== autoClose || $[9] !== data.autoClose) {
      t1 = getAutoClose(autoClose, data.autoClose);
      $[8] = autoClose;
      $[9] = data.autoClose;
      $[10] = t1;
    } else {
      t1 = $[10];
    }
    const autoCloseDuration = t1;
    const autoCloseTimeout = useRef();
    let t2;
    if ($[11] === Symbol.for("react.memo_cache_sentinel")) {
      t2 = () => window.clearTimeout(autoCloseTimeout.current);
      $[11] = t2;
    } else {
      t2 = $[11];
    }
    const cancelAutoClose = t2;
    let t3;
    if ($[12] !== onHide || $[13] !== data.id || $[14] !== cancelAutoClose) {
      t3 = () => {
        onHide(data.id);
        cancelAutoClose();
      };
      $[12] = onHide;
      $[13] = data.id;
      $[14] = cancelAutoClose;
      $[15] = t3;
    } else {
      t3 = $[15];
    }
    const handleHide = t3;
    let t4;
    if ($[16] !== autoCloseDuration || $[17] !== handleHide) {
      t4 = () => {
        if (typeof autoCloseDuration === "number") {
          autoCloseTimeout.current = window.setTimeout(handleHide, autoCloseDuration);
        }
      };
      $[16] = autoCloseDuration;
      $[17] = handleHide;
      $[18] = t4;
    } else {
      t4 = $[18];
    }
    const handleAutoClose = t4;
    let t5;
    if ($[19] !== data) {
      t5 = () => {
        data.onOpen?.(data);
      };
      $[19] = data;
      $[20] = t5;
    } else {
      t5 = $[20];
    }
    let t6;
    if ($[21] === Symbol.for("react.memo_cache_sentinel")) {
      t6 = [];
      $[21] = t6;
    } else {
      t6 = $[21];
    }
    useEffect(t5, t6);
    let t7;
    if ($[22] !== handleAutoClose || $[23] !== cancelAutoClose) {
      t7 = () => {
        handleAutoClose();
        return cancelAutoClose;
      };
      $[22] = handleAutoClose;
      $[23] = cancelAutoClose;
      $[24] = t7;
    } else {
      t7 = $[24];
    }
    let t8;
    if ($[25] !== autoCloseDuration) {
      t8 = [autoCloseDuration];
      $[25] = autoCloseDuration;
      $[26] = t8;
    } else {
      t8 = $[26];
    }
    useEffect(t7, t8);
    let t9;
    if ($[27] !== others || $[28] !== notificationProps || $[29] !== handleHide || $[30] !== ref || $[31] !== cancelAutoClose || $[32] !== handleAutoClose || $[33] !== message) {
      t9 = /* @__PURE__ */ jsx(
        Notification,
        {
          ...others,
          ...notificationProps,
          onClose: handleHide,
          ref,
          onMouseEnter: cancelAutoClose,
          onMouseLeave: handleAutoClose,
          children: message
        }
      );
      $[27] = others;
      $[28] = notificationProps;
      $[29] = handleHide;
      $[30] = ref;
      $[31] = cancelAutoClose;
      $[32] = handleAutoClose;
      $[33] = message;
      $[34] = t9;
    } else {
      t9 = $[34];
    }
    return t9;
  }
);
NotificationContainer.displayName = "@mantine/notifications/NotificationContainer";

var classes = {"root":"m_b37d9ac7","notification":"m_5ed0edd0"};

const Transition = Transition$1;
const defaultProps = {
  position: "bottom-right",
  autoClose: 4e3,
  transitionDuration: 250,
  containerWidth: 440,
  notificationMaxHeight: 200,
  limit: 5,
  zIndex: getDefaultZIndex("overlay"),
  store: notificationsStore,
  withinPortal: true
};
const varsResolver = createVarsResolver(
  (_, { zIndex, position, containerWidth }) => {
    const [vertical, horizontal] = position.split("-");
    return {
      root: {
        "--notifications-z-index": zIndex?.toString(),
        "--notifications-top": vertical === "top" ? "var(--mantine-spacing-md)" : void 0,
        "--notifications-bottom": vertical === "bottom" ? "var(--mantine-spacing-md)" : void 0,
        "--notifications-left": horizontal === "left" ? "var(--mantine-spacing-md)" : horizontal === "center" ? "50%" : void 0,
        "--notifications-right": horizontal === "right" ? "var(--mantine-spacing-md)" : void 0,
        "--notifications-transform": horizontal === "center" ? "translateX(-50%)" : void 0,
        "--notifications-container-width": rem(containerWidth)
      }
    };
  }
);
const NotificationsImpl = (_props, ref) => {
  const $ = c(47);
  const props = useProps("Notifications", defaultProps, _props);
  let store;
  let transitionDuration;
  let className;
  let style;
  let classNames;
  let styles;
  let unstyled;
  let vars;
  let limit;
  let autoClose;
  let position;
  let notificationMaxHeight;
  let others;
  let withinPortal;
  let portalProps;
  if ($[0] !== props) {
    const { classNames: t02, className: t12, style: t22, styles: t32, unstyled: t42, vars: t5, position: t62, autoClose: t72, transitionDuration: t82, containerWidth, notificationMaxHeight: t92, limit: t10, zIndex, store: t11, portalProps: t122, withinPortal: t13, ...t14 } = props;
    classNames = t02;
    className = t12;
    style = t22;
    styles = t32;
    unstyled = t42;
    vars = t5;
    position = t62;
    autoClose = t72;
    transitionDuration = t82;
    notificationMaxHeight = t92;
    limit = t10;
    store = t11;
    portalProps = t122;
    withinPortal = t13;
    others = t14;
    $[0] = props;
    $[1] = store;
    $[2] = transitionDuration;
    $[3] = className;
    $[4] = style;
    $[5] = classNames;
    $[6] = styles;
    $[7] = unstyled;
    $[8] = vars;
    $[9] = limit;
    $[10] = autoClose;
    $[11] = position;
    $[12] = notificationMaxHeight;
    $[13] = others;
    $[14] = withinPortal;
    $[15] = portalProps;
  } else {
    store = $[1];
    transitionDuration = $[2];
    className = $[3];
    style = $[4];
    classNames = $[5];
    styles = $[6];
    unstyled = $[7];
    vars = $[8];
    limit = $[9];
    autoClose = $[10];
    position = $[11];
    notificationMaxHeight = $[12];
    others = $[13];
    withinPortal = $[14];
    portalProps = $[15];
  }
  const theme = useMantineTheme();
  const data = useNotifications(store);
  const forceUpdate = useForceUpdate();
  const shouldReduceMotion = useReducedMotion();
  const refs = useRef({});
  const previousLength = useRef(0);
  const reduceMotion = theme.respectReducedMotion ? shouldReduceMotion : false;
  const duration = reduceMotion ? 1 : transitionDuration;
  let t0;
  if ($[16] !== props || $[17] !== className || $[18] !== style || $[19] !== classNames || $[20] !== styles || $[21] !== unstyled || $[22] !== vars) {
    t0 = { name: "Notifications", classes, props, className, style, classNames, styles, unstyled, vars, varsResolver };
    $[16] = props;
    $[17] = className;
    $[18] = style;
    $[19] = classNames;
    $[20] = styles;
    $[21] = unstyled;
    $[22] = vars;
    $[23] = t0;
  } else {
    t0 = $[23];
  }
  const getStyles = useStyles(
    t0
  );
  let t1;
  if ($[24] !== store || $[25] !== limit) {
    t1 = () => {
      store?.updateState((current) => ({ ...current, limit: limit || 5 }));
    };
    $[24] = store;
    $[25] = limit;
    $[26] = t1;
  } else {
    t1 = $[26];
  }
  let t2;
  if ($[27] !== limit) {
    t2 = [limit];
    $[27] = limit;
    $[28] = t2;
  } else {
    t2 = $[28];
  }
  useEffect(t1, t2);
  let t3;
  if ($[29] !== data.notifications.length || $[30] !== forceUpdate) {
    t3 = () => {
      if (data.notifications.length > previousLength.current) {
        setTimeout(() => forceUpdate(), 0);
      }
      previousLength.current = data.notifications.length;
    };
    $[29] = data.notifications.length;
    $[30] = forceUpdate;
    $[31] = t3;
  } else {
    t3 = $[31];
  }
  let t4;
  if ($[32] !== data.notifications) {
    t4 = [data.notifications];
    $[32] = data.notifications;
    $[33] = t4;
  } else {
    t4 = $[33];
  }
  useDidUpdate(t3, t4);
  const items = data.notifications.map(
    (t5) => {
      const { style: notificationStyle, ...notification } = t5;
      return /* @__PURE__ */ jsx(
        Transition,
        {
          timeout: duration,
          onEnter: () => refs.current[notification.id].offsetHeight,
          nodeRef: { current: refs.current[notification.id] },
          children: (state) => /* @__PURE__ */ jsx(
            NotificationContainer,
            {
              ref: (node) => {
                refs.current[notification.id] = node;
              },
              data: notification,
              onHide: (id) => hideNotification(id, store),
              autoClose,
              ...getStyles(
                "notification",
                { style: { ...getNotificationStateStyles(
                  { state, position, transitionDuration: duration, maxHeight: notificationMaxHeight }
                ), ...notificationStyle } }
              )
            }
          )
        },
        notification.id
      );
    }
  );
  let t6;
  if ($[34] !== getStyles) {
    t6 = getStyles("root");
    $[34] = getStyles;
    $[35] = t6;
  } else {
    t6 = $[35];
  }
  let t7;
  if ($[36] !== items) {
    t7 = /* @__PURE__ */ jsx(TransitionGroup, { children: items });
    $[36] = items;
    $[37] = t7;
  } else {
    t7 = $[37];
  }
  let t8;
  if ($[38] !== t6 || $[39] !== ref || $[40] !== others || $[41] !== t7) {
    t8 = /* @__PURE__ */ jsx(Box, { ...t6, ref, ...others, children: t7 });
    $[38] = t6;
    $[39] = ref;
    $[40] = others;
    $[41] = t7;
    $[42] = t8;
  } else {
    t8 = $[42];
  }
  let t9;
  if ($[43] !== withinPortal || $[44] !== portalProps || $[45] !== t8) {
    t9 = /* @__PURE__ */ jsx(OptionalPortal, { withinPortal, ...portalProps, children: t8 });
    $[43] = withinPortal;
    $[44] = portalProps;
    $[45] = t8;
    $[46] = t9;
  } else {
    t9 = $[46];
  }
  return t9;
};
const Notifications = factory(NotificationsImpl);
Notifications.classes = classes;
Notifications.displayName = "@mantine/notifications/Notifications";
Notifications.show = notifications.show;
Notifications.hide = notifications.hide;
Notifications.update = notifications.update;
Notifications.clean = notifications.clean;
Notifications.cleanQueue = notifications.cleanQueue;
Notifications.updateState = notifications.updateState;

export { Notifications, cleanNotifications, cleanNotificationsQueue, createNotificationsStore, hideNotification, notifications, notificationsStore, showNotification, updateNotification, updateNotificationsState, useNotifications };