import * as l from "react";
import { useContext as E, useState as S, useEffect as h, useRef as K } from "react";
import Q from "../../../@ant-design/icons/es/icons/BarsOutlined.mjs";
import N from "../../../@ant-design/icons/es/icons/LeftOutlined.mjs";
import j from "../../../@ant-design/icons/es/icons/RightOutlined.mjs";
import k from "../../../classnames/index.mjs";
import U from "../../../rc-util/es/omit.mjs";
import X from "../_util/isNumeric.mjs";
import "../config-provider/index.mjs";
import { LayoutContext as Y } from "./context.mjs";
import { ConfigContext as Z } from "../config-provider/context.mjs";
var q = globalThis && globalThis.__rest || function(t, c) {
  var d = {};
  for (var o in t)
    Object.prototype.hasOwnProperty.call(t, o) && c.indexOf(o) < 0 && (d[o] = t[o]);
  if (t != null && typeof Object.getOwnPropertySymbols == "function")
    for (var n = 0, o = Object.getOwnPropertySymbols(t); n < o.length; n++)
      c.indexOf(o[n]) < 0 && Object.prototype.propertyIsEnumerable.call(t, o[n]) && (d[o[n]] = t[o[n]]);
  return d;
};
const W = {
  xs: "479.98px",
  sm: "575.98px",
  md: "767.98px",
  lg: "991.98px",
  xl: "1199.98px",
  xxl: "1599.98px"
}, ee = /* @__PURE__ */ l.createContext({}), te = (() => {
  let t = 0;
  return function() {
    let c = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : "";
    return t += 1, `${c}${t}`;
  };
})(), P = /* @__PURE__ */ l.forwardRef((t, c) => {
  const {
    prefixCls: d,
    className: o,
    trigger: n,
    children: z,
    defaultCollapsed: T = !1,
    theme: L = "dark",
    style: R = {},
    collapsible: x = !1,
    reverseArrow: p = !1,
    width: _ = 200,
    collapsedWidth: v = 80,
    zeroWidthTriggerStyle: B,
    breakpoint: m,
    onCollapse: u,
    onBreakpoint: f
  } = t, M = q(t, ["prefixCls", "className", "trigger", "children", "defaultCollapsed", "theme", "style", "collapsible", "reverseArrow", "width", "collapsedWidth", "zeroWidthTriggerStyle", "breakpoint", "onCollapse", "onBreakpoint"]), {
    siderHook: y
  } = E(Y), [s, w] = S("collapsed" in t ? t.collapsed : T), [C, H] = S(!1);
  h(() => {
    "collapsed" in t && w(t.collapsed);
  }, [t.collapsed]);
  const b = (e, r) => {
    "collapsed" in t || w(e), u == null || u(e, r);
  }, O = K();
  O.current = (e) => {
    H(e.matches), f == null || f(e.matches), s !== e.matches && b(e.matches, "responsive");
  }, h(() => {
    function e(i) {
      return O.current(i);
    }
    let r;
    if (typeof window < "u") {
      const {
        matchMedia: i
      } = window;
      if (i && m && m in W) {
        r = i(`(max-width: ${W[m]})`);
        try {
          r.addEventListener("change", e);
        } catch {
          r.addListener(e);
        }
        e(r);
      }
    }
    return () => {
      try {
        r == null || r.removeEventListener("change", e);
      } catch {
        r == null || r.removeListener(e);
      }
    };
  }, [m]), h(() => {
    const e = te("ant-sider-");
    return y.addSider(e), () => y.removeSider(e);
  }, []);
  const $ = () => {
    b(!s, "clickTrigger");
  }, {
    getPrefixCls: I
  } = E(Z), A = () => {
    const e = I("layout-sider", d), r = U(M, ["collapsed"]), i = s ? v : _, a = X(i) ? `${i}px` : String(i), g = parseFloat(String(v || 0)) === 0 ? /* @__PURE__ */ l.createElement("span", {
      onClick: $,
      className: k(`${e}-zero-width-trigger`, `${e}-zero-width-trigger-${p ? "right" : "left"}`),
      style: B
    }, n || /* @__PURE__ */ l.createElement(Q, null)) : null, F = {
      expanded: p ? /* @__PURE__ */ l.createElement(j, null) : /* @__PURE__ */ l.createElement(N, null),
      collapsed: p ? /* @__PURE__ */ l.createElement(N, null) : /* @__PURE__ */ l.createElement(j, null)
    }[s ? "collapsed" : "expanded"], V = n !== null ? g || /* @__PURE__ */ l.createElement("div", {
      className: `${e}-trigger`,
      onClick: $,
      style: {
        width: a
      }
    }, n || F) : null, G = Object.assign(Object.assign({}, R), {
      flex: `0 0 ${a}`,
      maxWidth: a,
      minWidth: a,
      width: a
    }), J = k(e, `${e}-${L}`, {
      [`${e}-collapsed`]: !!s,
      [`${e}-has-trigger`]: x && n !== null && !g,
      [`${e}-below`]: !!C,
      [`${e}-zero-width`]: parseFloat(a) === 0
    }, o);
    return /* @__PURE__ */ l.createElement("aside", Object.assign({
      className: J
    }, r, {
      style: G,
      ref: c
    }), /* @__PURE__ */ l.createElement("div", {
      className: `${e}-children`
    }, z), x || C && g ? V : null);
  }, D = l.useMemo(() => ({
    siderCollapsed: s
  }), [s]);
  return /* @__PURE__ */ l.createElement(ee.Provider, {
    value: D
  }, A());
});
process.env.NODE_ENV !== "production" && (P.displayName = "Sider");
const fe = P;
export {
  ee as SiderContext,
  fe as default
};
