// Copyright 1999-2023. Plesk International GmbH. All rights reserved.

import { createRoot } from 'react-dom/client';
import { forwardRef, useImperativeHandle, useState } from 'react';
import classNames from 'classnames';
import { CLS_PREFIX, Z_INDEX_TOASTER } from '../../constants';
import Layer from '../Layer';
import ToastView from './ToastView';
import PanelView from './PanelView';
import { jsx as _jsx } from "react/jsx-runtime";
let toastId = 0;
const Toaster = /*#__PURE__*/forwardRef(function Toaster(_ref, ref) {
  let {
    baseClassName = `${CLS_PREFIX}toaster`,
    className,
    toasts: externalToasts,
    maxToastsNumber,
    position = 'top-end',
    view = 'toast',
    onToastClose,
    onToastGroupClose,
    groupConfigs,
    isPanelCollapsed,
    onPanelCollapseStateChange,
    ...props
  } = _ref;
  const getExternalToasts = () => (externalToasts ?? []).slice(0, maxToastsNumber);
  const isControlled = Boolean(externalToasts);
  const [internalToasts, setToasts] = useState(getExternalToasts);
  const toasts = isControlled ? getExternalToasts() : internalToasts;
  const remove = key => {
    setToasts(toasts => toasts.filter(toast => toast.key !== key));
  };
  useImperativeHandle(ref, () => ({
    add(props) {
      const key = `toast-${toastId++}`;
      setToasts(toasts => [{
        key,
        ...props
      }, ...toasts].slice(0, maxToastsNumber));
      return key;
    },
    update(key, props) {
      setToasts(toasts => toasts.map(toast => toast.key === key ? {
        ...props,
        key
      } : toast));
      return key;
    },
    remove,
    clear() {
      setToasts([]);
    }
  }), [maxToastsNumber]);
  const handleToastClose = toastProps => {
    if (!isControlled) {
      remove(toastProps.key);
    }
    toastProps.onClose?.();
    onToastClose?.(toastProps.key);
  };
  const handleToastGroupClose = keys => {
    if (!isControlled) {
      setToasts(toasts => toasts.filter(toast => !keys.includes(toast.key)));
    }
    onToastGroupClose?.(keys);
  };
  return /*#__PURE__*/_jsx(Layer, {
    level: Z_INDEX_TOASTER,
    children: /*#__PURE__*/_jsx("div", {
      className: classNames(baseClassName, className, `${baseClassName}--${view}-view`, {
        [`${baseClassName}--${position}`]: view === 'toast'
      }),
      ...props,
      children: view === 'toast' ? /*#__PURE__*/_jsx(ToastView, {
        toasts: toasts,
        position: position,
        onToastClose: handleToastClose,
        baseClassName: `${baseClassName}-toast-view`
      }) : /*#__PURE__*/_jsx(PanelView, {
        toasts: toasts,
        onToastClose: handleToastClose,
        onToastGroupClose: handleToastGroupClose,
        baseClassName: `${baseClassName}-panel-view`,
        groupConfigs: groupConfigs,
        isCollapsed: isPanelCollapsed,
        onCollapseStateChange: onPanelCollapseStateChange
      })
    })
  });
});
Toaster.create = function () {
  let props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
  let container = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : document.body;
  const containerElement = document.createElement('div');
  container.appendChild(containerElement);
  const toasterApi = {};
  const root = createRoot(containerElement);
  root.render(/*#__PURE__*/_jsx(Toaster, {
    ref: ref => Object.assign(toasterApi, ref),
    ...props
  }));
  return toasterApi;
};

/**
 * `Toaster` is used for notifying about events happened in the system. For example, about results of performed operations.
 * @since 0.0.42
 */
export default Toaster;