diff --git a/docs/src/pages/premium-themes/onepirate/modules/components/TextField.js b/docs/src/pages/premium-themes/onepirate/modules/components/TextField.js index 7c27f14bbd73c4..574fb4c5ac4e04 100644 --- a/docs/src/pages/premium-themes/onepirate/modules/components/TextField.js +++ b/docs/src/pages/premium-themes/onepirate/modules/components/TextField.js @@ -124,6 +124,7 @@ TextField.propTypes = { classes: PropTypes.object.isRequired, /** * Props applied to the [`InputLabel`](/api/input-label/) element. + * Pointer events like `onClick` are enabled if and only if `shrink` is `true`. */ InputLabelProps: PropTypes.object, /** diff --git a/docs/translations/api-docs/text-field/text-field.json b/docs/translations/api-docs/text-field/text-field.json index 2ee7a2ea6b1b8d..077c2d8167ca1a 100644 --- a/docs/translations/api-docs/text-field/text-field.json +++ b/docs/translations/api-docs/text-field/text-field.json @@ -12,7 +12,7 @@ "fullWidth": "If true, the input will take up the full width of its container.", "helperText": "The helper text content.", "id": "The id of the input element. Use this prop to make label and helperText accessible for screen readers.", - "InputLabelProps": "Props applied to the InputLabel element.", + "InputLabelProps": "Props applied to the InputLabel element. Pointer events like onClick are enabled if and only if shrink is true.", "inputProps": "Attributes applied to the input element.", "InputProps": "Props applied to the Input element. It will be a FilledInput, OutlinedInput or Input component depending on the variant prop value.", "inputRef": "Pass a ref to the input element.", diff --git a/packages/mui-material/src/InputLabel/InputLabel.js b/packages/mui-material/src/InputLabel/InputLabel.js index 923d5c03e80852..6dad4ef8f2b839 100644 --- a/packages/mui-material/src/InputLabel/InputLabel.js +++ b/packages/mui-material/src/InputLabel/InputLabel.js @@ -88,6 +88,8 @@ const InputLabelRoot = styled(FormLabel, { transform: 'translate(12px, 13px) scale(1)', }), ...(ownerState.shrink && { + userSelect: 'none', + pointerEvents: 'auto', transform: 'translate(12px, 7px) scale(0.75)', maxWidth: 'calc(133% - 24px)', ...(ownerState.size === 'small' && { @@ -105,6 +107,8 @@ const InputLabelRoot = styled(FormLabel, { transform: 'translate(14px, 9px) scale(1)', }), ...(ownerState.shrink && { + userSelect: 'none', + pointerEvents: 'auto', maxWidth: 'calc(133% - 24px)', transform: 'translate(14px, -9px) scale(0.75)', }), diff --git a/packages/mui-material/src/TextField/TextField.d.ts b/packages/mui-material/src/TextField/TextField.d.ts index 4b2f6af6633b29..1a70c8215645c2 100644 --- a/packages/mui-material/src/TextField/TextField.d.ts +++ b/packages/mui-material/src/TextField/TextField.d.ts @@ -83,6 +83,7 @@ export interface BaseTextFieldProps id?: string; /** * Props applied to the [`InputLabel`](/api/input-label/) element. + * Pointer events like `onClick` are enabled if and only if `shrink` is `true`. */ InputLabelProps?: Partial; /** diff --git a/packages/mui-material/src/TextField/TextField.js b/packages/mui-material/src/TextField/TextField.js index ffdab8da31099c..beaf672af83c09 100644 --- a/packages/mui-material/src/TextField/TextField.js +++ b/packages/mui-material/src/TextField/TextField.js @@ -288,6 +288,7 @@ TextField.propTypes /* remove-proptypes */ = { id: PropTypes.string, /** * Props applied to the [`InputLabel`](/api/input-label/) element. + * Pointer events like `onClick` are enabled if and only if `shrink` is `true`. */ InputLabelProps: PropTypes.object, /**