From c5763ce038d908b1efcb430772e673b5a6872f61 Mon Sep 17 00:00:00 2001
From: Arthurk12 <arthur_bockmann@hotmail.com>
Date: Wed, 30 Sep 2026 18:24:19 -0300
Subject: [PATCH] fix(BBBCheckbox)!: apply ariaLabel to the input element

The aria-label prop is passed to the MUI Checkbox root, which forwards
it to the ButtonBase span instead of the <input>, so a BBBCheckbox
without a visible label has no accessible name. dataTest and the
consumer's inputProps reach the <input>, but through inputProps, which
is deprecated in MUI and removed in v7.

Pass aria-label and data-test through slotProps.input so they land on
the <input>, merging any slotProps.input supplied by the consumer
(object or function form).

MUI does not merge inputProps and slotProps.input (a slotProps.input
replaces inputProps entirely), so a consumer's inputProps would be
silently dropped; remove it from CheckboxProps instead, turning that
into a compile error. Keeping a library-owned inputProps and
forwarding it to slotProps.input was discarded to avoid maintaining a
second API for the same purpose.

BREAKING CHANGE: BBBCheckbox no longer accepts inputProps; use
slotProps.input to set attributes on the underlying <input>.
---
 src/components/Checkbox/README.md     |  2 +-
 src/components/Checkbox/component.tsx | 12 ++++++++----
 src/components/Checkbox/types.ts      |  2 +-
 3 files changed, 10 insertions(+), 6 deletions(-)

diff --git a/src/components/Checkbox/README.md b/src/components/Checkbox/README.md
index 4464c4a..9770aad 100644
--- a/src/components/Checkbox/README.md
+++ b/src/components/Checkbox/README.md
@@ -29,4 +29,4 @@ import { BBBCheckbox } from 'bbb-ui-components';
 | `round`      | `boolean`              | `false`   | If `true`, the checkbox will be rendered as a round radio-style button.     |
 | `ariaLabel`| `string`               |           | The accessible name for the checkbox.                                       |
 | `dataTest` | `string`               |           | The `data-test` attribute on the underlying `<input>` element.              |
-| `...props` | `any`                  |           | Any other props will be passed down to the underlying Material-UI Checkbox component. |
+| `...props` | `Omit<CheckboxProps, 'inputProps'>` |  | Any other props will be passed down to the underlying Material-UI Checkbox component. Use `slotProps.input` to set attributes on the `<input>`. |
diff --git a/src/components/Checkbox/component.tsx b/src/components/Checkbox/component.tsx
index 4e52e96..87e74d3 100644
--- a/src/components/Checkbox/component.tsx
+++ b/src/components/Checkbox/component.tsx
@@ -1,4 +1,5 @@
 import React, { JSX, useId } from 'react';
+import { CheckboxOwnerState } from '@mui/material';
 import { CheckboxProps } from './types';
 import * as Styled from './styles';
 import { DEFAULT_LAYOUT, LAYOUTS } from './constants';
@@ -19,20 +20,23 @@ function Checkbox({
   ariaLabel,
   id,
   dataTest,
-  inputProps,
+  slotProps,
   ...props
 }: CheckboxProps): JSX.Element {
   const generatedId = useId();
   const checkboxId = id ?? generatedId;
-  const mergedInputProps = { 'data-test': dataTest, ...inputProps };
+  const ownInputProps = { 'aria-label': ariaLabel, 'data-test': dataTest };
+  const { input: consumerInputSlotProps, ...otherSlotProps } = slotProps ?? {};
+  const inputSlotProps = typeof consumerInputSlotProps === 'function'
+    ? (ownerState: CheckboxOwnerState) => ({ ...ownInputProps, ...consumerInputSlotProps(ownerState) })
+    : { ...ownInputProps, ...consumerInputSlotProps };
   const checkbox = (
     <Styled.StyledCheckbox
       {...props}
       id={checkboxId}
-      aria-label={ariaLabel}
       icon={round ? <RadioButtonUnchecked /> : undefined}
       checkedIcon={round ? <RadioButtonChecked /> : undefined}
-      inputProps={mergedInputProps}
+      slotProps={{ ...otherSlotProps, input: inputSlotProps }}
     />
   );
 
diff --git a/src/components/Checkbox/types.ts b/src/components/Checkbox/types.ts
index c61e065..b8f7df1 100644
--- a/src/components/Checkbox/types.ts
+++ b/src/components/Checkbox/types.ts
@@ -3,7 +3,7 @@ import { LAYOUTS } from './constants';
 
 type Layout = typeof LAYOUTS[keyof typeof LAYOUTS];
 
-export interface CheckboxProps extends MuiCheckboxProps {
+export interface CheckboxProps extends Omit<MuiCheckboxProps, 'inputProps'> {
   /** Text label displayed next to the checkbox. */
   label?: string;