import y from "./index-extends.js";
import R from "./index-objectWithoutPropertiesLoose.js";
import * as g from "react";
import s from "./index-_virtual16.js";
import { clsx as C } from "./index-clsx.js";
import V from "./index-AccordionContext.js";
import t, { getAccordionSummaryUtilityClass as h } from "./index-accordionSummaryClasses.js";
import { jsxs as W, jsx as v } from "react/jsx-runtime";
import { useDefaultProps as j } from "./index-DefaultPropsProvider.js";
import k from "./index-composeClasses.js";
import d from "./index-styled.js";
import w from "./index-ButtonBase.js";
const G = ["children", "className", "expandIcon", "focusVisibleClassName", "onClick"], $ = (o) => {
  const {
    classes: e,
    expanded: r,
    disabled: n,
    disableGutters: a
  } = o;
  return k({
    root: ["root", r && "expanded", n && "disabled", !a && "gutters"],
    focusVisible: ["focusVisible"],
    content: ["content", r && "expanded", !a && "contentGutters"],
    expandIconWrapper: ["expandIconWrapper", r && "expanded"]
  }, h, e);
}, O = d(w, {
  name: "MuiAccordionSummary",
  slot: "Root",
  overridesResolver: (o, e) => e.root
})(({
  theme: o
}) => {
  const e = {
    duration: o.transitions.duration.shortest
  };
  return {
    display: "flex",
    minHeight: 48,
    padding: o.spacing(0, 2),
    transition: o.transitions.create(["min-height", "background-color"], e),
    [`&.${t.focusVisible}`]: {
      backgroundColor: (o.vars || o).palette.action.focus
    },
    [`&.${t.disabled}`]: {
      opacity: (o.vars || o).palette.action.disabledOpacity
    },
    [`&:hover:not(.${t.disabled})`]: {
      cursor: "pointer"
    },
    variants: [{
      props: (r) => !r.disableGutters,
      style: {
        [`&.${t.expanded}`]: {
          minHeight: 64
        }
      }
    }]
  };
}), E = d("div", {
  name: "MuiAccordionSummary",
  slot: "Content",
  overridesResolver: (o, e) => e.content
})(({
  theme: o
}) => ({
  display: "flex",
  flexGrow: 1,
  margin: "12px 0",
  variants: [{
    props: (e) => !e.disableGutters,
    style: {
      transition: o.transitions.create(["margin"], {
        duration: o.transitions.duration.shortest
      }),
      [`&.${t.expanded}`]: {
        margin: "20px 0"
      }
    }
  }]
})), M = d("div", {
  name: "MuiAccordionSummary",
  slot: "ExpandIconWrapper",
  overridesResolver: (o, e) => e.expandIconWrapper
})(({
  theme: o
}) => ({
  display: "flex",
  color: (o.vars || o).palette.action.active,
  transform: "rotate(0deg)",
  transition: o.transitions.create("transform", {
    duration: o.transitions.duration.shortest
  }),
  [`&.${t.expanded}`]: {
    transform: "rotate(180deg)"
  }
})), T = /* @__PURE__ */ g.forwardRef(function(e, r) {
  const n = j({
    props: e,
    name: "MuiAccordionSummary"
  }), {
    children: a,
    className: p,
    expandIcon: l,
    focusVisibleClassName: S,
    onClick: m
  } = n, N = R(n, G), {
    disabled: u = !1,
    disableGutters: A,
    expanded: f,
    toggle: x
  } = g.useContext(V), I = (b) => {
    x && x(b), m && m(b);
  }, i = y({}, n, {
    expanded: f,
    disabled: u,
    disableGutters: A
  }), c = $(i);
  return /* @__PURE__ */ W(O, y({
    focusRipple: !1,
    disableRipple: !0,
    disabled: u,
    component: "div",
    "aria-expanded": f,
    className: C(c.root, p),
    focusVisibleClassName: C(c.focusVisible, S),
    onClick: I,
    ref: r,
    ownerState: i
  }, N, {
    children: [/* @__PURE__ */ v(E, {
      className: c.content,
      ownerState: i,
      children: a
    }), l && /* @__PURE__ */ v(M, {
      className: c.expandIconWrapper,
      ownerState: i,
      children: l
    })]
  }));
});
process.env.NODE_ENV !== "production" && (T.propTypes = {
  // ┌────────────────────────────── Warning ──────────────────────────────┐
  // │ These PropTypes are generated from the TypeScript type definitions. │
  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
  // └─────────────────────────────────────────────────────────────────────┘
  /**
   * The content of the component.
   */
  children: s.node,
  /**
   * Override or extend the styles applied to the component.
   */
  classes: s.object,
  /**
   * @ignore
   */
  className: s.string,
  /**
   * The icon to display as the expand indicator.
   */
  expandIcon: s.node,
  /**
   * This prop can help identify which element has keyboard focus.
   * The class name will be applied when the element gains the focus through keyboard interaction.
   * It's a polyfill for the [CSS :focus-visible selector](https://drafts.csswg.org/selectors-4/#the-focus-visible-pseudo).
   * The rationale for using this feature [is explained here](https://github.com/WICG/focus-visible/blob/HEAD/explainer.md).
   * A [polyfill can be used](https://github.com/WICG/focus-visible) to apply a `focus-visible` class to other components
   * if needed.
   */
  focusVisibleClassName: s.string,
  /**
   * @ignore
   */
  onClick: s.func,
  /**
   * The system prop that allows defining system overrides as well as additional CSS styles.
   */
  sx: s.oneOfType([s.arrayOf(s.oneOfType([s.func, s.object, s.bool])), s.func, s.object])
});
export {
  T as default
};
