77 lines
3.7 KiB
Plaintext
77 lines
3.7 KiB
Plaintext
import {useEffect as $jNP0e$useEffect, useMemo as $jNP0e$useMemo} from "react";
|
|
import {mergeProps as $jNP0e$mergeProps} from "@react-aria/utils";
|
|
import {useFormValidationState as $jNP0e$useFormValidationState, privateValidationStateProp as $jNP0e$privateValidationStateProp} from "@react-stately/form";
|
|
import {useFormValidation as $jNP0e$useFormValidation} from "@react-aria/form";
|
|
import {usePress as $jNP0e$usePress} from "@react-aria/interactions";
|
|
import {useToggle as $jNP0e$useToggle} from "@react-aria/toggle";
|
|
|
|
/*
|
|
* Copyright 2020 Adobe. All rights reserved.
|
|
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
*
|
|
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
* governing permissions and limitations under the License.
|
|
*/
|
|
|
|
|
|
|
|
|
|
|
|
function $406796ff087fe49b$export$e375f10ce42261c5(props, state, inputRef) {
|
|
// Create validation state here because it doesn't make sense to add to general useToggleState.
|
|
let validationState = (0, $jNP0e$useFormValidationState)({
|
|
...props,
|
|
value: state.isSelected
|
|
});
|
|
let { isInvalid: isInvalid, validationErrors: validationErrors, validationDetails: validationDetails } = validationState.displayValidation;
|
|
let { labelProps: labelProps, inputProps: inputProps, isSelected: isSelected, isPressed: isPressed, isDisabled: isDisabled, isReadOnly: isReadOnly } = (0, $jNP0e$useToggle)({
|
|
...props,
|
|
isInvalid: isInvalid
|
|
}, state, inputRef);
|
|
(0, $jNP0e$useFormValidation)(props, validationState, inputRef);
|
|
let { isIndeterminate: isIndeterminate, isRequired: isRequired, validationBehavior: validationBehavior = 'aria' } = props;
|
|
(0, $jNP0e$useEffect)(()=>{
|
|
// indeterminate is a property, but it can only be set via javascript
|
|
// https://css-tricks.com/indeterminate-checkboxes/
|
|
if (inputRef.current) inputRef.current.indeterminate = !!isIndeterminate;
|
|
});
|
|
// Reset validation state on label press for checkbox with a hidden input.
|
|
let { pressProps: pressProps } = (0, $jNP0e$usePress)({
|
|
isDisabled: isDisabled || isReadOnly,
|
|
onPress () {
|
|
// @ts-expect-error
|
|
let { [(0, $jNP0e$privateValidationStateProp)]: groupValidationState } = props;
|
|
let { commitValidation: commitValidation } = groupValidationState ? groupValidationState : validationState;
|
|
commitValidation();
|
|
}
|
|
});
|
|
return {
|
|
labelProps: (0, $jNP0e$mergeProps)(labelProps, pressProps, (0, $jNP0e$useMemo)(()=>({
|
|
// Prevent label from being focused when mouse down on it.
|
|
// Note, this does not prevent the input from being focused in the `click` event.
|
|
onMouseDown: (e)=>e.preventDefault()
|
|
}), [])),
|
|
inputProps: {
|
|
...inputProps,
|
|
checked: isSelected,
|
|
'aria-required': isRequired && validationBehavior === 'aria' || undefined,
|
|
required: isRequired && validationBehavior === 'native'
|
|
},
|
|
isSelected: isSelected,
|
|
isPressed: isPressed,
|
|
isDisabled: isDisabled,
|
|
isReadOnly: isReadOnly,
|
|
isInvalid: isInvalid,
|
|
validationErrors: validationErrors,
|
|
validationDetails: validationDetails
|
|
};
|
|
}
|
|
|
|
|
|
export {$406796ff087fe49b$export$e375f10ce42261c5 as useCheckbox};
|
|
//# sourceMappingURL=useCheckbox.module.js.map
|