UNPKG

3.74 kBJavaScriptView Raw
1'use client';
2
3import _extends from "@babel/runtime/helpers/esm/extends";
4import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
5const _excluded = ["children", "disabled", "label", "slots", "slotProps", "focusableWhenDisabled"];
6import * as React from 'react';
7import PropTypes from 'prop-types';
8import { useSlotProps } from '../utils';
9import { useMenuButton } from '../useMenuButton';
10import { unstable_composeClasses as composeClasses } from '../composeClasses';
11import { useClassNamesOverride } from '../utils/ClassNameConfigurator';
12import { getMenuButtonUtilityClass } from './menuButtonClasses';
13import { jsx as _jsx } from "react/jsx-runtime";
14const useUtilityClasses = ownerState => {
15 const {
16 active,
17 disabled,
18 open
19 } = ownerState;
20 const slots = {
21 root: ['root', disabled && 'disabled', active && 'active', open && 'expanded']
22 };
23 return composeClasses(slots, useClassNamesOverride(getMenuButtonUtilityClass));
24};
25
26/**
27 *
28 * Demos:
29 *
30 * - [Menu](https://mui.com/base-ui/react-menu/)
31 *
32 * API:
33 *
34 * - [MenuButton API](https://mui.com/base-ui/react-menu/components-api/#menu-button)
35 */
36const MenuButton = /*#__PURE__*/React.forwardRef(function MenuButton(props, forwardedRef) {
37 const {
38 children,
39 disabled = false,
40 slots = {},
41 slotProps = {},
42 focusableWhenDisabled = false
43 } = props,
44 other = _objectWithoutPropertiesLoose(props, _excluded);
45 const {
46 getRootProps,
47 open,
48 active
49 } = useMenuButton({
50 disabled,
51 focusableWhenDisabled,
52 rootRef: forwardedRef
53 });
54 const ownerState = _extends({}, props, {
55 open,
56 active,
57 disabled,
58 focusableWhenDisabled
59 });
60 const classes = useUtilityClasses(ownerState);
61 const Root = slots.root || 'button';
62 const rootProps = useSlotProps({
63 elementType: Root,
64 getSlotProps: getRootProps,
65 externalForwardedProps: other,
66 externalSlotProps: slotProps.root,
67 additionalProps: {
68 ref: forwardedRef,
69 type: 'button'
70 },
71 ownerState,
72 className: classes.root
73 });
74 return /*#__PURE__*/_jsx(Root, _extends({}, rootProps, {
75 children: children
76 }));
77});
78process.env.NODE_ENV !== "production" ? MenuButton.propTypes /* remove-proptypes */ = {
79 // ┌────────────────────────────── Warning ──────────────────────────────┐
80 // │ These PropTypes are generated from the TypeScript type definitions. │
81 // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
82 // └─────────────────────────────────────────────────────────────────────┘
83 /**
84 * @ignore
85 */
86 children: PropTypes.node,
87 /**
88 * Class name applied to the root element.
89 */
90 className: PropTypes.string,
91 /**
92 * If `true`, the component is disabled.
93 * @default false
94 */
95 disabled: PropTypes.bool,
96 /**
97 * If `true`, allows a disabled button to receive focus.
98 * @default false
99 */
100 focusableWhenDisabled: PropTypes.bool,
101 /**
102 * Label of the button
103 */
104 label: PropTypes.string,
105 /**
106 * The components used for each slot inside the MenuButton.
107 * Either a string to use a HTML element or a component.
108 * @default {}
109 */
110 slotProps: PropTypes.shape({
111 root: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
112 }),
113 /**
114 * The props used for each slot inside the MenuButton.
115 * @default {}
116 */
117 slots: PropTypes.shape({
118 root: PropTypes.elementType
119 })
120} : void 0;
121export { MenuButton };
\No newline at end of file