import P from "./index-objectWithoutPropertiesLoose.js";
import n from "./index-extends.js";
import * as R from "react";
import o from "./index-_virtual16.js";
import { clsx as x } from "./index-clsx.js";
import { useRtl as v } from "./index-RtlProvider.js";
import O from "./index-KeyboardArrowLeft.js";
import g from "./index-KeyboardArrowRight.js";
import j from "./index-styled.js";
import w, { getTabScrollButtonUtilityClass as E } from "./index-tabScrollButtonClasses.js";
import { jsx as a } from "react/jsx-runtime";
import { useDefaultProps as N } from "./index-DefaultPropsProvider.js";
import f from "./index-useSlotProps.js";
import _ from "./index-composeClasses.js";
import C from "./index-ButtonBase.js";
const $ = ["className", "slots", "slotProps", "direction", "orientation", "disabled"], z = (t) => {
  const {
    classes: r,
    orientation: e,
    disabled: s
  } = t;
  return _({
    root: ["root", e, s && "disabled"]
  }, E, r);
}, q = j(C, {
  name: "MuiTabScrollButton",
  slot: "Root",
  overridesResolver: (t, r) => {
    const {
      ownerState: e
    } = t;
    return [r.root, e.orientation && r[e.orientation]];
  }
})(({
  ownerState: t
}) => n({
  width: 40,
  flexShrink: 0,
  opacity: 0.8,
  [`&.${w.disabled}`]: {
    opacity: 0
  }
}, t.orientation === "vertical" && {
  width: "100%",
  height: 40,
  "& svg": {
    transform: `rotate(${t.isRtl ? -90 : 90}deg)`
  }
})), A = /* @__PURE__ */ R.forwardRef(function(r, e) {
  var s, c;
  const i = N({
    props: r,
    name: "MuiTabScrollButton"
  }), {
    className: S,
    slots: p = {},
    slotProps: u = {},
    direction: b
  } = i, B = P(i, $), y = v(), l = n({
    isRtl: y
  }, i), T = z(l), d = (s = p.StartScrollButtonIcon) != null ? s : O, m = (c = p.EndScrollButtonIcon) != null ? c : g, h = f({
    elementType: d,
    externalSlotProps: u.startScrollButtonIcon,
    additionalProps: {
      fontSize: "small"
    },
    ownerState: l
  }), I = f({
    elementType: m,
    externalSlotProps: u.endScrollButtonIcon,
    additionalProps: {
      fontSize: "small"
    },
    ownerState: l
  });
  return /* @__PURE__ */ a(q, n({
    component: "div",
    className: x(T.root, S),
    ref: e,
    role: null,
    ownerState: l,
    tabIndex: null
  }, B, {
    children: b === "left" ? /* @__PURE__ */ a(d, n({}, h)) : /* @__PURE__ */ a(m, n({}, I))
  }));
});
process.env.NODE_ENV !== "production" && (A.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: o.node,
  /**
   * Override or extend the styles applied to the component.
   */
  classes: o.object,
  /**
   * @ignore
   */
  className: o.string,
  /**
   * The direction the button should indicate.
   */
  direction: o.oneOf(["left", "right"]).isRequired,
  /**
   * If `true`, the component is disabled.
   * @default false
   */
  disabled: o.bool,
  /**
   * The component orientation (layout flow direction).
   */
  orientation: o.oneOf(["horizontal", "vertical"]).isRequired,
  /**
   * The extra props for the slot components.
   * You can override the existing props or add new ones.
   * @default {}
   */
  slotProps: o.shape({
    endScrollButtonIcon: o.oneOfType([o.func, o.object]),
    startScrollButtonIcon: o.oneOfType([o.func, o.object])
  }),
  /**
   * The components used for each slot inside.
   * @default {}
   */
  slots: o.shape({
    EndScrollButtonIcon: o.elementType,
    StartScrollButtonIcon: o.elementType
  }),
  /**
   * The system prop that allows defining system overrides as well as additional CSS styles.
   */
  sx: o.oneOfType([o.arrayOf(o.oneOfType([o.func, o.object, o.bool])), o.func, o.object])
});
export {
  A as default
};
