Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[docs] Explain the usage of Select's onOpen/onClose in the uncontrolled mode #34755

Merged
merged 1 commit into from
Nov 3, 2022
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
6 changes: 3 additions & 3 deletions docs/translations/api-docs/select/select.json
Original file line number Diff line number Diff line change
Expand Up @@ -16,9 +16,9 @@
"MenuProps": "Props applied to the <a href=\"/material-ui/api/menu/\"><code>Menu</code></a> element.",
"multiple": "If <code>true</code>, <code>value</code> must be an array and the menu will support multiple selections.",
"native": "If <code>true</code>, the component uses a native <code>select</code> element.",
"onChange": "Callback fired when a menu item is selected.<br><br><strong>Signature:</strong><br><code>function(event: SelectChangeEvent&lt;T&gt;, child?: object) =&gt; void</code><br><em>event:</em> The event source of the callback. You can pull out the new value by accessing <code>event.target.value</code> (any). <strong>Warning</strong>: This is a generic event not a change event unless the change event is caused by browser autofill.<br><em>child:</em> The react element that was selected when <code>native</code> is <code>false</code> (default).",
"onClose": "Callback fired when the component requests to be closed. Use in controlled mode (see open).<br><br><strong>Signature:</strong><br><code>function(event: object) =&gt; void</code><br><em>event:</em> The event source of the callback.",
"onOpen": "Callback fired when the component requests to be opened. Use in controlled mode (see open).<br><br><strong>Signature:</strong><br><code>function(event: object) =&gt; void</code><br><em>event:</em> The event source of the callback.",
"onChange": "Callback fired when a menu item is selected.<br><br><strong>Signature:</strong><br><code>function(event: SelectChangeEvent&lt;T&gt;, child?: object) =&gt; void</code><br><em>event:</em> The event source of the callback. You can pull out the new value by accessing <code>event.target.value</code> (any). <strong>Warning</strong>: This is a generic event, not a change event, unless the change event is caused by browser autofill.<br><em>child:</em> The react element that was selected when <code>native</code> is <code>false</code> (default).",
"onClose": "Callback fired when the component requests to be closed. Use it in either controlled (see the <code>open</code> prop), or uncontrolled mode (to detect when the Select collapes).<br><br><strong>Signature:</strong><br><code>function(event: object) =&gt; void</code><br><em>event:</em> The event source of the callback.",
"onOpen": "Callback fired when the component requests to be opened. Use it in either controlled (see the <code>open</code> prop), or uncontrolled mode (to detect when the Select expands).<br><br><strong>Signature:</strong><br><code>function(event: object) =&gt; void</code><br><em>event:</em> The event source of the callback.",
"open": "If <code>true</code>, the component is shown. You can only use it when the <code>native</code> prop is <code>false</code> (default).",
"renderValue": "Render the selected value. You can only use it when the <code>native</code> prop is <code>false</code> (default).<br><br><strong>Signature:</strong><br><code>function(value: any) =&gt; ReactNode</code><br><em>value:</em> The <code>value</code> provided to the component.",
"SelectDisplayProps": "Props applied to the clickable div element.",
Expand Down
6 changes: 3 additions & 3 deletions packages/mui-material/src/Select/Select.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -98,20 +98,20 @@ export interface SelectProps<T = unknown>
*
* @param {SelectChangeEvent<T>} event The event source of the callback.
* You can pull out the new value by accessing `event.target.value` (any).
* **Warning**: This is a generic event not a change event unless the change event is caused by browser autofill.
* **Warning**: This is a generic event, not a change event, unless the change event is caused by browser autofill.
* @param {object} [child] The react element that was selected when `native` is `false` (default).
*/
onChange?: SelectInputProps<T>['onChange'];
/**
* Callback fired when the component requests to be closed.
* Use in controlled mode (see open).
* Use it in either controlled (see the `open` prop), or uncontrolled mode (to detect when the Select collapes).
*
* @param {object} event The event source of the callback.
*/
onClose?: (event: React.SyntheticEvent) => void;
/**
* Callback fired when the component requests to be opened.
* Use in controlled mode (see open).
* Use it in either controlled (see the `open` prop), or uncontrolled mode (to detect when the Select expands).
*
* @param {object} event The event source of the callback.
*/
Expand Down
6 changes: 3 additions & 3 deletions packages/mui-material/src/Select/Select.js
Original file line number Diff line number Diff line change
Expand Up @@ -218,20 +218,20 @@ Select.propTypes /* remove-proptypes */ = {
*
* @param {SelectChangeEvent<T>} event The event source of the callback.
* You can pull out the new value by accessing `event.target.value` (any).
* **Warning**: This is a generic event not a change event unless the change event is caused by browser autofill.
* **Warning**: This is a generic event, not a change event, unless the change event is caused by browser autofill.
* @param {object} [child] The react element that was selected when `native` is `false` (default).
*/
onChange: PropTypes.func,
/**
* Callback fired when the component requests to be closed.
* Use in controlled mode (see open).
* Use it in either controlled (see the `open` prop), or uncontrolled mode (to detect when the Select collapes).
*
* @param {object} event The event source of the callback.
*/
onClose: PropTypes.func,
/**
* Callback fired when the component requests to be opened.
* Use in controlled mode (see open).
* Use it in either controlled (see the `open` prop), or uncontrolled mode (to detect when the Select expands).
*
* @param {object} event The event source of the callback.
*/
Expand Down