import { jsx as e, jsxs as d } from "react/jsx-runtime";
import { createContext as H, useState as y, useRef as E, useEffect as x } from "react";
import { useReducedMotion as T, AnimatePresence as b, motion as C } from "motion/react";
import q from "../../utils/classNames.js";
import D from "../card/Card.js";
import m from "../button/Button.js";
import F from "./BannerActions.js";
import G from "./BannerContent.js";
import J from "./BannerIcon.js";
import K from "./BannerPage.js";
const L = H(void 0), o = (N) => {
  const {
    show: n = !0,
    dismissible: P = !0,
    onClose: w = () => {
    },
    pageTimeout: h = 2e4,
    showPageNavigation: B = !0,
    border: A = !0,
    initialAnimation: R = !0,
    className: S = "",
    children: a,
    ...O
  } = N, u = Array.isArray(a) ? a : [a], i = u.length, s = i > 1, [r, g] = y(0), p = !T() && R, c = E(null), [z, I] = y(0);
  x(() => {
    if (!n || i === 1)
      return;
    const t = setInterval(() => {
      l();
    }, h);
    return () => clearInterval(t);
  }, [i, h, n, r]), x(() => {
    if (!c.current)
      return;
    const t = new ResizeObserver((M) => {
      const v = M[0];
      if (v) {
        const j = v.target.getBoundingClientRect().height;
        I(j);
      }
    });
    return t.observe(c.current), () => t.disconnect();
  }, [n, r]);
  const l = () => {
    s && g((t) => (t + 1) % i);
  }, f = () => {
    s && g((t) => (t - 1 + i) % i);
  }, k = q(
    "Banner display-flex text-color-darker overflow-hidden",
    "position-relative",
    !A && "border-color-white",
    S
  );
  return /* @__PURE__ */ e(L.Provider, { value: { nextPage: l, prevPage: f }, children: /* @__PURE__ */ e(b, { children: n && /* @__PURE__ */ e(
    C.div,
    {
      initial: { height: 0, opacity: 0 },
      animate: { height: z, opacity: 1 },
      exit: { height: 0, opacity: 0 },
      transition: {
        height: { duration: 0.2 },
        opacity: { duration: 0.2 },
        ease: "easeInOut"
      },
      children: /* @__PURE__ */ e("div", { ref: c, style: { position: "relative" }, children: /* @__PURE__ */ d(D, { className: k, padding: 20, ...O, children: [
        /* @__PURE__ */ d("div", { className: "flex-1-1 overflow-hidden", children: [
          /* @__PURE__ */ e(b, { mode: "wait", children: /* @__PURE__ */ e(
            C.div,
            {
              initial: p ? { opacity: 0, x: 100 } : !1,
              animate: { opacity: 1, x: 0 },
              exit: p ? { opacity: 0, x: -100 } : void 0,
              transition: {
                duration: 1.5,
                ease: [0.25, 1, 0.5, 1]
              },
              children: u[r]
            },
            r
          ) }),
          s && B && /* @__PURE__ */ e("div", { className: "margin-5", children: /* @__PURE__ */ e("div", { className: "position-absolute bottom-5", style: { right: "45px" }, children: /* @__PURE__ */ d("div", { className: "display-flex", children: [
            /* @__PURE__ */ e(
              m,
              {
                bsStyle: "muted",
                bsSize: "xs",
                onClick: f,
                iconName: "rioglyph-arrow-left",
                iconOnly: !0
              }
            ),
            /* @__PURE__ */ e(
              m,
              {
                bsStyle: "muted",
                bsSize: "xs",
                onClick: l,
                iconName: "rioglyph-arrow-right",
                iconOnly: !0
              }
            )
          ] }) }) })
        ] }),
        P && /* @__PURE__ */ e("div", { className: "flex-0 margin-left-10 margin-right--5 margin-top--5 margin-top-0-ls align-self-start align-self-center-ls", children: /* @__PURE__ */ e(
          m,
          {
            bsStyle: "muted",
            bsSize: "sm",
            onClick: w,
            iconName: "rioglyph-remove",
            iconOnly: !0
          }
        ) })
      ] }) })
    }
  ) }) });
};
o.Page = K;
o.Icon = J;
o.Content = G;
o.Actions = F;
export {
  o as default
};
//# sourceMappingURL=Banner.js.map
