{"version":3,"file":"index.js","names":["rtlLanguages","React","useCallback","useMemo","RenderCustomComponent","FieldDescription","FieldError","useForm","useField","withCondition","useEditDepth","useTranslation","generateFieldID","mergeFieldStyles","fieldBaseClass","CheckboxInput","baseClass","CheckboxFieldComponent","props","id","checked","checkedFromProps","disableFormData","field","admin","className","description","label","required","onChange","onChangeFromProps","partialChecked","path","pathFromProps","readOnly","validate","uuid","editDepth","i18n","language","isRTL","includes","memoizedValidate","value","options","customComponents","AfterInput","BeforeInput","Description","Error","Label","disabled","setValue","showError","potentiallyStalePath","onToggle","Boolean","fieldID","styles","_jsxs","filter","join","style","_jsx","CustomComponent","Fallback","alignCaret","inputRef","name","CheckboxField"],"sources":["../../../src/fields/Checkbox/index.tsx"],"sourcesContent":["'use client'\nimport type {\n CheckboxFieldClientComponent,\n CheckboxFieldClientProps,\n CheckboxFieldValidation,\n} from 'payload'\n\nimport { rtlLanguages } from '@payloadcms/translations'\nimport React, { useCallback, useMemo } from 'react'\n\nimport type { CheckboxInputProps } from './Input.js'\n\nimport { RenderCustomComponent } from '../../elements/RenderCustomComponent/index.js'\nimport { FieldDescription } from '../../fields/FieldDescription/index.js'\nimport { FieldError } from '../../fields/FieldError/index.js'\nimport { useForm } from '../../forms/Form/context.js'\nimport { useField } from '../../forms/useField/index.js'\nimport { withCondition } from '../../forms/withCondition/index.js'\nimport { useEditDepth } from '../../providers/EditDepth/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { generateFieldID } from '../../utilities/generateFieldID.js'\nimport { mergeFieldStyles } from '../mergeFieldStyles.js'\nimport { fieldBaseClass } from '../shared/index.js'\nimport { CheckboxInput } from './Input.js'\nimport './index.scss'\n\nconst baseClass = 'checkbox'\n\nexport { CheckboxFieldClientProps, CheckboxInput, type CheckboxInputProps }\n\nconst CheckboxFieldComponent: CheckboxFieldClientComponent = (props) => {\n const {\n id,\n checked: checkedFromProps,\n disableFormData,\n field,\n field: {\n admin: { className, description } = {} as CheckboxFieldClientProps['field']['admin'],\n label,\n required,\n } = {} as CheckboxFieldClientProps['field'],\n onChange: onChangeFromProps,\n partialChecked,\n path: pathFromProps,\n readOnly,\n validate,\n } = props\n\n const { uuid } = useForm()\n\n const editDepth = useEditDepth()\n\n const {\n i18n: { language },\n } = useTranslation()\n const isRTL = (rtlLanguages as readonly string[]).includes(language)\n\n const memoizedValidate: CheckboxFieldValidation = useCallback(\n (value, options) => {\n if (typeof validate === 'function') {\n return validate(value, { ...options, required })\n }\n },\n [validate, required],\n )\n\n const {\n customComponents: { AfterInput, BeforeInput, Description, Error, Label } = {},\n disabled,\n path,\n setValue,\n showError,\n value,\n } = useField({\n disableFormData,\n potentiallyStalePath: pathFromProps,\n validate: memoizedValidate,\n })\n\n const onToggle = useCallback(() => {\n if (!readOnly) {\n setValue(!value)\n if (typeof onChangeFromProps === 'function') {\n onChangeFromProps(!value)\n }\n }\n }, [onChangeFromProps, readOnly, setValue, value])\n\n const checked = checkedFromProps || Boolean(value)\n\n const fieldID = id || generateFieldID(path, editDepth, uuid)\n\n const styles = useMemo(() => mergeFieldStyles(field), [field])\n\n return (\n