Skip to content

Commit 51f5a9a

Browse files
committed
Refactor #403
1 parent ccbd7ec commit 51f5a9a

File tree

1 file changed

+6
-18
lines changed

1 file changed

+6
-18
lines changed

src/Select.tsx

+6-18
Original file line numberDiff line numberDiff line change
@@ -65,13 +65,11 @@ export const Select = memo(
6565

6666
const messagesGroupId = `${selectId}-messages-group`;
6767

68-
const selectStateDescriptionId = useId();
69-
const stateIsDefault = state === "default";
70-
71-
const stateDescriptionId = getStateDescriptionId(stateIsDefault, selectStateDescriptionId);
72-
const nativeDescription = getSelectNativeDescription(nativeSelectProps["aria-describedby"]);
68+
const stateDescriptionId = (function useClosure() {
69+
const id = useId();
7370

74-
const selectAriaDescribedBy = `${stateDescriptionId} ${nativeDescription}`.trim();
71+
return state === "default" ? undefined : `select-${id}-desc`;
72+
})();
7573

7674
return (
7775
<div
@@ -111,13 +109,13 @@ export const Select = memo(
111109
{...nativeSelectProps}
112110
className={cx(fr.cx("fr-select"), nativeSelectProps.className)}
113111
id={selectId}
114-
aria-describedby={selectAriaDescribedBy}
112+
aria-describedby={cx(stateDescriptionId, nativeSelectProps["aria-describedby"])}
115113
disabled={disabled}
116114
>
117115
{children}
118116
</select>
119117
<div id={messagesGroupId} className={fr.cx("fr-messages-group")} aria-live="polite">
120-
{!stateIsDefault && (
118+
{state !== "default" && (
121119
<p
122120
id={stateDescriptionId}
123121
className={fr.cx(
@@ -143,16 +141,6 @@ export const Select = memo(
143141
})
144142
);
145143

146-
function getStateDescriptionId(stateIsDefault: boolean, selectStateDescriptionId: string) {
147-
return stateIsDefault ? "" : `select-${selectStateDescriptionId}-desc`;
148-
}
149-
150-
function getSelectNativeDescription(
151-
nativeSelectPropsAriaDescribedBy: React.SelectHTMLAttributes<HTMLSelectElement>["aria-describedby"]
152-
) {
153-
return nativeSelectPropsAriaDescribedBy !== undefined ? nativeSelectPropsAriaDescribedBy : "";
154-
}
155-
156144
Select.displayName = symToStr({ Select });
157145

158146
export default Select;

0 commit comments

Comments
 (0)