@razorpay/blade
Version:
The Design System that powers Razorpay
106 lines (103 loc) • 3.32 kB
JavaScript
import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
import React__default from 'react';
import { useControllableState } from '../../../utils/useControllable.js';
import '../../BladeProvider/index.js';
import { useFormId } from '../../Form/useFormId.js';
import useTheme from '../../BladeProvider/useTheme.js';
var useCheckboxGroup = function useCheckboxGroup(_ref) {
var value = _ref.value,
defaultValue = _ref.defaultValue,
isDisabled = _ref.isDisabled,
isRequired = _ref.isRequired,
labelPosition = _ref.labelPosition,
_onChange = _ref.onChange,
validationState = _ref.validationState,
name = _ref.name,
necessityIndicator = _ref.necessityIndicator,
size = _ref.size;
var _useTheme = useTheme(),
platform = _useTheme.platform;
var _useFormId = useFormId('checkbox-group'),
labelId = _useFormId.labelId;
var _useControllableState = useControllableState({
value: value,
defaultValue: defaultValue || [],
// eslint-disable-next-line @typescript-eslint/no-unnecessary-type-assertion
onChange: function onChange(values) {
return _onChange === null || _onChange === void 0 ? void 0 : _onChange({
values: values,
name: name
});
}
}),
_useControllableState2 = _slicedToArray(_useControllableState, 2),
checkedValues = _useControllableState2[0],
setValue = _useControllableState2[1];
var state = React__default.useMemo(function () {
return {
value: checkedValues,
setValue: function (_setValue) {
function setValue(_x) {
return _setValue.apply(this, arguments);
}
setValue.toString = function () {
return _setValue.toString();
};
return setValue;
}(function (value) {
if (isDisabled) {
return;
}
setValue(function () {
return value;
});
}),
isChecked: function isChecked(value) {
return checkedValues.includes(value);
},
addValue: function addValue(value) {
if (isDisabled) {
return;
}
if (!checkedValues.includes(value)) {
setValue(function () {
return checkedValues.concat(value);
});
}
},
removeValue: function removeValue(value) {
if (isDisabled) {
return;
}
if (checkedValues.includes(value)) {
setValue(function () {
return checkedValues.filter(function (existingValue) {
return existingValue !== value;
});
});
}
}
};
}, [checkedValues, isDisabled, setValue]);
var contextValue = React__default.useMemo(function () {
return {
validationState: validationState,
isDisabled: isDisabled,
isRequired: isRequired,
labelPosition: platform === 'onMobile' ? 'top' : labelPosition,
name: name,
necessityIndicator: necessityIndicator,
state: state,
size: size
};
}, [validationState, isDisabled, isRequired, platform, labelPosition, name, necessityIndicator, state, size]);
return {
state: state,
contextValue: contextValue,
ids: {
labelId: labelId
}
};
};
export { useCheckboxGroup };
//# sourceMappingURL=useCheckboxGroup.js.map