Skip to content

Commit

Permalink
[core] Use immutable refs (mui#38762)
Browse files Browse the repository at this point in the history
  • Loading branch information
oliviertassinari authored and xcode-it committed Sep 11, 2023
1 parent c045c5a commit 4f76d57
Showing 12 changed files with 15 additions and 15 deletions.
4 changes: 2 additions & 2 deletions docs/src/modules/components/DemoEditor.tsx
Original file line number Diff line number Diff line change
@@ -81,8 +81,8 @@ export default function DemoEditor(props: DemoEditorProps) {
const { language, value, onChange, copyButtonProps, children, id, ...other } = props;
const t = useTranslate();
const contextTheme = useTheme();
const wrapperRef = React.useRef<HTMLElement | null>(null);
const enterRef = React.useRef<HTMLElement | null>(null);
const wrapperRef = React.useRef<HTMLElement>(null);
const enterRef = React.useRef<HTMLElement>(null);
const handlers = useCodeCopy();

React.useEffect(() => {
2 changes: 1 addition & 1 deletion packages/mui-base/src/Popper/Popper.tsx
Original file line number Diff line number Diff line change
@@ -96,7 +96,7 @@ const PopperTooltip = React.forwardRef(function PopperTooltip<
...other
} = props;

const tooltipRef = React.useRef<HTMLElement | null>(null);
const tooltipRef = React.useRef<HTMLElement>(null);
const ownRef = useForkRef(tooltipRef, forwardedRef);

const popperRef = React.useRef<Instance | null>(null);
2 changes: 1 addition & 1 deletion packages/mui-base/src/Select/Select.tsx
Original file line number Diff line number Diff line change
@@ -96,7 +96,7 @@ const Select = React.forwardRef(function Select<
renderValueProp ?? defaultRenderValue;

const [buttonDefined, setButtonDefined] = React.useState(false);
const buttonRef = React.useRef<HTMLElement | null>(null);
const buttonRef = React.useRef<HTMLElement>(null);
const listboxRef = React.useRef<HTMLElement>(null);

const Button = slots.root ?? 'button';
2 changes: 1 addition & 1 deletion packages/mui-base/src/useMenu/useMenu.ts
Original file line number Diff line number Diff line change
@@ -38,7 +38,7 @@ const FALLBACK_MENU_CONTEXT: DropdownContextValue = {
export function useMenu(parameters: UseMenuParameters = {}): UseMenuReturnValue {
const { listboxRef: listboxRefProp, onItemsChange, id: idParam } = parameters;

const rootRef = React.useRef<HTMLElement | null>(null);
const rootRef = React.useRef<HTMLElement>(null);
const handleRef = useForkRef(rootRef, listboxRefProp);

const listboxId = useId(idParam) ?? '';
2 changes: 1 addition & 1 deletion packages/mui-base/src/useSelect/useSelect.ts
Original file line number Diff line number Diff line change
@@ -107,7 +107,7 @@ function useSelect<OptionValue, Multiple extends boolean = false>(
const buttonRef = React.useRef<HTMLElement>(null);
const handleButtonRef = useForkRef(buttonRefProp, buttonRef);

const listboxRef = React.useRef<HTMLElement | null>(null);
const listboxRef = React.useRef<HTMLElement>(null);
const listboxId = useId(listboxIdProp);

let defaultValue: OptionValue[] | undefined;
2 changes: 1 addition & 1 deletion packages/mui-joy/src/Button/Button.tsx
Original file line number Diff line number Diff line change
@@ -217,7 +217,7 @@ const Button = React.forwardRef(function Button(inProps, ref) {
const color = getColor(inProps.color, buttonGroup.color || colorProp);
const disabled = inProps.disabled ?? (buttonGroup.disabled || disabledProp || loading);

const buttonRef = React.useRef<HTMLElement | null>(null);
const buttonRef = React.useRef<HTMLElement>(null);
const handleRef = useForkRef(buttonRef, ref);

const { focusVisible, setFocusVisible, getRootProps } = useButton({
2 changes: 1 addition & 1 deletion packages/mui-joy/src/Chip/Chip.tsx
Original file line number Diff line number Diff line change
@@ -248,7 +248,7 @@ const Chip = React.forwardRef(function Chip(inProps, ref) {

const resolvedActionProps =
typeof slotProps.action === 'function' ? slotProps.action(ownerState) : slotProps.action;
const actionRef = React.useRef<HTMLElement | null>(null);
const actionRef = React.useRef<HTMLElement>(null);
const { focusVisible, getRootProps } = useButton({
...resolvedActionProps,
disabled,
2 changes: 1 addition & 1 deletion packages/mui-joy/src/ChipDelete/ChipDelete.tsx
Original file line number Diff line number Diff line change
@@ -82,7 +82,7 @@ const ChipDelete = React.forwardRef(function ChipDelete(inProps, ref) {
const color = getColor(inProps.color, inheritedColor);
const disabled = disabledProp ?? chipContext.disabled;

const buttonRef = React.useRef<HTMLElement | null>(null);
const buttonRef = React.useRef<HTMLElement>(null);
const handleRef = useForkRef(buttonRef, ref);

const { focusVisible, getRootProps } = useButton({
2 changes: 1 addition & 1 deletion packages/mui-joy/src/FormHelperText/FormHelperText.tsx
Original file line number Diff line number Diff line change
@@ -58,7 +58,7 @@ const FormHelperText = React.forwardRef(function FormHelperText(inProps, ref) {
});

const { children, component, slots = {}, slotProps = {}, ...other } = props;
const rootRef = React.useRef<HTMLElement | null>(null);
const rootRef = React.useRef<HTMLElement>(null);
const handleRef = useForkRef(rootRef, ref);
const formControl = React.useContext(FormControlContext);
const setHelperText = formControl?.setHelperText;
2 changes: 1 addition & 1 deletion packages/mui-joy/src/IconButton/IconButton.tsx
Original file line number Diff line number Diff line change
@@ -147,7 +147,7 @@ const IconButton = React.forwardRef(function IconButton(inProps, ref) {
const color = getColor(inProps.color, buttonGroup.color || colorProp);
const disabled = inProps.disabled ?? (buttonGroup.disabled || disabledProp);

const buttonRef = React.useRef<HTMLElement | null>(null);
const buttonRef = React.useRef<HTMLElement>(null);
const handleRef = useForkRef(buttonRef, ref);

const { focusVisible, setFocusVisible, getRootProps } = useButton({
2 changes: 1 addition & 1 deletion packages/mui-joy/src/ListItemButton/ListItemButton.tsx
Original file line number Diff line number Diff line change
@@ -154,7 +154,7 @@ const ListItemButton = React.forwardRef(function ListItemButton(inProps, ref) {
const { getColor } = useColorInversion(variant);
const color = getColor(inProps.color, colorProp);

const buttonRef = React.useRef<HTMLElement | null>(null);
const buttonRef = React.useRef<HTMLElement>(null);
const handleRef = useForkRef(buttonRef, ref);

const { focusVisible, setFocusVisible, getRootProps } = useButton({
6 changes: 3 additions & 3 deletions packages/mui-joy/src/Select/Select.tsx
Original file line number Diff line number Diff line change
@@ -386,9 +386,9 @@ const Select = React.forwardRef(function Select<TValue extends {}>(
const renderValue = renderValueProp ?? defaultRenderSingleValue;
const [anchorEl, setAnchorEl] = React.useState<HTMLElement | null>(null);

const rootRef = React.useRef<HTMLElement | null>(null);
const buttonRef = React.useRef<HTMLElement | null>(null);
const listboxRef = React.useRef<HTMLElement | null>(null);
const rootRef = React.useRef<HTMLElement>(null);
const buttonRef = React.useRef<HTMLElement>(null);
const listboxRef = React.useRef<HTMLElement>(null);

const handleRef = useForkRef(ref, rootRef);

0 comments on commit 4f76d57

Please sign in to comment.