← All changes
|
js/components/EditMenu/EditorSidebar/controls/PriorityInput.tsx
+5
-4
4.0.0-beta.1
→
trunk
View file →
| @@ -1,5 +1,5 @@ | ||
| 1 | -import React from 'react' | |
| 1 | +import React, { useId } from 'react' | |
| 2 | 2 | import { __ } from '@wordpress/i18n' |
| 3 | 3 | import { useSnippetForm } from '../../SnippetForm/WithSnippetFormContext' |
| 4 | 4 | import { Tooltip } from '../../../common/Tooltip' |
| 5 | 5 | |
| @@ -4,22 +4,23 @@ | ||
| 4 | 4 | import { Tooltip } from '../../../common/Tooltip' |
| 5 | 5 | |
| 6 | 6 | export const PriorityInput = () => { |
| 7 | 7 | const { snippet, isReadOnly, setSnippet } = useSnippetForm() |
| 8 | + const priorityId = useId() | |
| 8 | 9 | |
| 9 | 10 | return ( |
| 10 | 11 | <div className="snippet-priority inline-form-field"> |
| 11 | - <label htmlFor="snippet-priority" id="snippet-priority-label"> | |
| 12 | + <label htmlFor={priorityId} id="snippet-priority-label"> | |
| 12 | 13 | {__('Priority', 'code-snippets')} |
| 13 | 14 | </label> |
| 14 | 15 | |
| 15 | - <Tooltip block end className="priority-input-tooltip"> | |
| 16 | + <Tooltip inline end className="priority-input-tooltip"> | |
| 16 | 17 | {__('Snippets with a lower priority number will run before those with a higher number.', 'code-snippets')} |
| 17 | 18 | </Tooltip> |
| 18 | 19 | |
| 19 | 20 | <input |
| 20 | 21 | type="number" |
| 21 | - id="snippet-priority" | |
| 22 | + id={priorityId} | |
| 22 | 23 | name="snippet_priority" |
| 23 | 24 | value={snippet.priority} |
| 24 | 25 | disabled={isReadOnly} |
| 25 | 26 | aria-labelledby="snippet-priority-label" |