UNPKG

4.15 kBJavaScriptView Raw
1import _extends from "@babel/runtime/helpers/esm/extends";
2import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
3import * as React from 'react';
4import { unstable_useControlled as useControlled, unstable_useForkRef as useForkRef, unstable_useIsFocusVisible as useIsFocusVisible } from '@mui/utils';
5/**
6 * The basic building block for creating custom switches.
7 *
8 * Demos:
9 *
10 * - [Switch](https://mui.com/base/react-switch/#hook)
11 *
12 * API:
13 *
14 * - [useSwitch API](https://mui.com/base/react-switch/hooks-api/#use-switch)
15 */
16export default function useSwitch(props) {
17 var checkedProp = props.checked,
18 defaultChecked = props.defaultChecked,
19 disabled = props.disabled,
20 onBlur = props.onBlur,
21 onChange = props.onChange,
22 onFocus = props.onFocus,
23 onFocusVisible = props.onFocusVisible,
24 readOnly = props.readOnly,
25 required = props.required;
26 var _useControlled = useControlled({
27 controlled: checkedProp,
28 default: Boolean(defaultChecked),
29 name: 'Switch',
30 state: 'checked'
31 }),
32 _useControlled2 = _slicedToArray(_useControlled, 2),
33 checked = _useControlled2[0],
34 setCheckedState = _useControlled2[1];
35 var createHandleInputChange = function createHandleInputChange(otherProps) {
36 return function (event) {
37 var _otherProps$onChange;
38 // Workaround for https://github.com/facebook/react/issues/9023
39 if (event.nativeEvent.defaultPrevented) {
40 return;
41 }
42 setCheckedState(event.target.checked);
43 onChange == null ? void 0 : onChange(event);
44 (_otherProps$onChange = otherProps.onChange) == null ? void 0 : _otherProps$onChange.call(otherProps, event);
45 };
46 };
47 var _useIsFocusVisible = useIsFocusVisible(),
48 isFocusVisibleRef = _useIsFocusVisible.isFocusVisibleRef,
49 handleBlurVisible = _useIsFocusVisible.onBlur,
50 handleFocusVisible = _useIsFocusVisible.onFocus,
51 focusVisibleRef = _useIsFocusVisible.ref;
52 var _React$useState = React.useState(false),
53 focusVisible = _React$useState[0],
54 setFocusVisible = _React$useState[1];
55 if (disabled && focusVisible) {
56 setFocusVisible(false);
57 }
58 React.useEffect(function () {
59 isFocusVisibleRef.current = focusVisible;
60 }, [focusVisible, isFocusVisibleRef]);
61 var inputRef = React.useRef(null);
62 var createHandleFocus = function createHandleFocus(otherProps) {
63 return function (event) {
64 var _otherProps$onFocus;
65 // Fix for https://github.com/facebook/react/issues/7769
66 if (!inputRef.current) {
67 inputRef.current = event.currentTarget;
68 }
69 handleFocusVisible(event);
70 if (isFocusVisibleRef.current === true) {
71 setFocusVisible(true);
72 onFocusVisible == null ? void 0 : onFocusVisible(event);
73 }
74 onFocus == null ? void 0 : onFocus(event);
75 (_otherProps$onFocus = otherProps.onFocus) == null ? void 0 : _otherProps$onFocus.call(otherProps, event);
76 };
77 };
78 var createHandleBlur = function createHandleBlur(otherProps) {
79 return function (event) {
80 var _otherProps$onBlur;
81 handleBlurVisible(event);
82 if (isFocusVisibleRef.current === false) {
83 setFocusVisible(false);
84 }
85 onBlur == null ? void 0 : onBlur(event);
86 (_otherProps$onBlur = otherProps.onBlur) == null ? void 0 : _otherProps$onBlur.call(otherProps, event);
87 };
88 };
89 var handleInputRef = useForkRef(focusVisibleRef, inputRef);
90 var getInputProps = function getInputProps() {
91 var otherProps = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
92 return _extends({
93 checked: checkedProp,
94 defaultChecked: defaultChecked,
95 disabled: disabled,
96 readOnly: readOnly,
97 ref: handleInputRef,
98 required: required,
99 type: 'checkbox'
100 }, otherProps, {
101 onChange: createHandleInputChange(otherProps),
102 onFocus: createHandleFocus(otherProps),
103 onBlur: createHandleBlur(otherProps)
104 });
105 };
106 return {
107 checked: checked,
108 disabled: Boolean(disabled),
109 focusVisible: focusVisible,
110 getInputProps: getInputProps,
111 inputRef: handleInputRef,
112 readOnly: Boolean(readOnly)
113 };
114}
\No newline at end of file