diff --git a/src/components/Checkbox/Checkbox.test.tsx b/src/components/Checkbox/Checkbox.test.tsx
index aae96c8c..a06180d2 100644
--- a/src/components/Checkbox/Checkbox.test.tsx
+++ b/src/components/Checkbox/Checkbox.test.tsx
@@ -6,6 +6,7 @@ import { CheckboxTestWrapper } from './Checkbox.utils';
const id = 'default';
const label = 'this is a label';
const testId = `${id}-container`;
+const inputTestId = `${id}-input`;
const attributeAria = 'aria-checked';
const attributeClass = 'class';
@@ -18,7 +19,7 @@ describe('Checkbox', () => {
const testTitle = 'test-title';
render();
- const checkbox = screen.getByTestId(testId);
+ const checkbox = screen.getByTestId(inputTestId);
expect(checkbox).toBeInTheDocument();
expect(checkbox).toHaveAttribute(attributeTitle, testTitle);
diff --git a/src/components/Checkbox/Checkbox.tsx b/src/components/Checkbox/Checkbox.tsx
index 727108a8..d483fcc9 100644
--- a/src/components/Checkbox/Checkbox.tsx
+++ b/src/components/Checkbox/Checkbox.tsx
@@ -38,7 +38,7 @@ export interface CheckboxProperties {
/** An event handler function that will be called when the checkbox's value is changed */
onChange?: (event: ChangeEvent) => void;
/** Border status */
- status: 'success' | 'warning' | 'error';
+ status: 'error' | 'success' | 'warning';
}
const containerBaseStyles = ['m-form-field m-form-field__checkbox'];
@@ -65,7 +65,7 @@ export const Checkbox = ({
onChange,
status,
...properties
-}: CheckboxProperties): ReactElement => {
+}: CheckboxProperties & JSX.IntrinsicElements['input']): ReactElement => {
const onChangeHandler = useCallback(
(event: ChangeEvent): void => {
onChange?.(event);
@@ -84,7 +84,6 @@ export const Checkbox = ({