import * as l from "react";
import { useContext as $, useState as S, useEffect as h, useRef as J } from "react";
import K 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 Q from "../../../rc-util/es/omit.mjs";
import U from "../_util/isNumeric.mjs";
import "../config-provider/index.mjs";
import { LayoutContext as X } from "./context.mjs";
import { ConfigContext as Y } from "../config-provider/context.mjs";
var Z = 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"
}, q = /* @__PURE__ */ l.createContext({}), ee = (() => {
  let t = 0;
  return function() {
    let c = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : "";
    return t += 1, `${c}${t}`;
  };
})(), te = /* @__PURE__ */ l.forwardRef((t, c) => {
  const {
    prefixCls: d,
    className: o,
    trigger: n,
    children: P,
    defaultCollapsed: z = !1,
    theme: T = "dark",
    style: L = {},
    collapsible: x = !1,
    reverseArrow: p = !1,
    width: R = 200,
    collapsedWidth: v = 80,
    zeroWidthTriggerStyle: _,
    breakpoint: m,
    onCollapse: u,
    onBreakpoint: f
  } = t, B = Z(t, ["prefixCls", "className", "trigger", "children", "defaultCollapsed", "theme", "style", "collapsible", "reverseArrow", "width", "collapsedWidth", "zeroWidthTriggerStyle", "breakpoint", "onCollapse", "onBreakpoint"]), {
    siderHook: y
  } = $(X), [s, w] = S("collapsed" in t ? t.collapsed : z), [C, M] = 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 = J();
  O.current = (e) => {
    M(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 = ee("ant-sider-");
    return y.addSider(e), () => y.removeSider(e);
  }, []);
  const E = () => {
    b(!s, "clickTrigger");
  }, {
    getPrefixCls: H
  } = $(Y), I = () => {
    const e = H("layout-sider", d), r = Q(B, ["collapsed"]), i = s ? v : R, a = U(i) ? `${i}px` : String(i), g = parseFloat(String(v || 0)) === 0 ? /* @__PURE__ */ l.createElement("span", {
      onClick: E,
      className: k(`${e}-zero-width-trigger`, `${e}-zero-width-trigger-${p ? "right" : "left"}`),
      style: _
    }, n || /* @__PURE__ */ l.createElement(K, null)) : null, D = {
      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"], F = n !== null ? g || /* @__PURE__ */ l.createElement("div", {
      className: `${e}-trigger`,
      onClick: E,
      style: {
        width: a
      }
    }, n || D) : null, V = Object.assign(Object.assign({}, L), {
      flex: `0 0 ${a}`,
      maxWidth: a,
      minWidth: a,
      width: a
    }), G = k(e, `${e}-${T}`, {
      [`${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: G
    }, r, {
      style: V,
      ref: c
    }), /* @__PURE__ */ l.createElement("div", {
      className: `${e}-children`
    }, P), x || C && g ? F : null);
  }, A = l.useMemo(() => ({
    siderCollapsed: s
  }), [s]);
  return /* @__PURE__ */ l.createElement(q.Provider, {
    value: A
  }, I());
});
process.env.NODE_ENV !== "production" && (te.displayName = "Sider");
export {
  q as SiderContext,
  te as default
};
