Skip to content
Permalink

Comparing changes

Choose two branches to see what’s changed or to start a new pull request. If you need to, you can also or learn more about diff comparisons.

Open a pull request

Create a new pull request by comparing changes across two branches. If you need to, you can also . Learn more about diff comparisons here.
base repository: okta/odyssey
Failed to load repositories. Confirm that selected base ref is valid, then try again.
Loading
base: v1.0.5
Choose a base ref
...
head repository: okta/odyssey
Failed to load repositories. Confirm that selected head ref is valid, then try again.
Loading
compare: v1.1.0
Choose a head ref
  • 15 commits
  • 61 files changed
  • 5 contributors

Commits on Sep 12, 2023

  1. Verified

    This commit was created on GitHub.com and signed with GitHub’s verified signature. The key has expired.
    Copy the full SHA
    1c424b9 View commit details

Commits on Sep 13, 2023

  1. Verified

    This commit was signed with the committer’s verified signature.
    benschell-okta Ben Schell
    Copy the full SHA
    5df3006 View commit details
  2. Verified

    This commit was signed with the committer’s verified signature.
    benschell-okta Ben Schell
    Copy the full SHA
    cd7111c View commit details
  3. Verified

    This commit was signed with the committer’s verified signature.
    benschell-okta Ben Schell
    Copy the full SHA
    4c48230 View commit details
  4. Adds testId prop to odyssey-react-mui components (#1960)

    * adds testprops type and applies it to Box
    
    * renames types file, updates tsdoc
    
    * adds testid to Autocomplete, reorders Box props
    
    * adds testid to Banner
    
    * adds testid to Button
    
    * adds testid to Callout
    
    * adds testid to Checkbox
    
    * adds testid to CheckboxGroup and Field
    
    * adds testid to CircularProgress
    
    * adds testid to Dialog
    
    * adds testid to FieldError, FieldHint, FieldLabel
    
    * adds testid to Fieldset
    
    * adds testid to Form
    
    * adds testid to Link
    
    * adds testid to MenuButton, MenuItem
    
    * adds testid to nativeselect
    
    * adds testid to PasswordField
    
    * adds testid to Radio, RadioGroup
    
    * adds testid to SearchField
    
    * adds testid to Select
    
    * adds testid to Status
    
    * adds testid to Tabs
    
    * adds testid to Tag, TagList
    
    * adds testid to TextField
    
    * adds testid to Toast
    
    * adds testid to Tooltip
    
    * adds testid to Typography
    
    * commits yarn cache change
    
    * runs prettier
    
    * moves testid within MenuButton
    
    * removes testId from TabPanel and TabList
    
    * moves testid on Field to renderFieldComponent, updates CheckboxGroup
    
    * removes testid from Field, move to directly use it in associated components
    shawyu-okta authored Sep 13, 2023

    Verified

    This commit was created on GitHub.com and signed with GitHub’s verified signature. The key has expired.
    Copy the full SHA
    5a98b1c View commit details
  5. Verified

    This commit was created on GitHub.com and signed with GitHub’s verified signature. The key has expired.
    Copy the full SHA
    c1ba21c View commit details

Commits on Sep 14, 2023

  1. Verified

    This commit was signed with the committer’s verified signature.
    benschell-okta Ben Schell
    Copy the full SHA
    8294649 View commit details
  2. Merge pull request #1971 from okta/bs-OKTA-647142-fix-filtering-in-table

    fix: make global + column filtering work in Tables (@okta/odyssey-react-mui/labs)
    benschell-okta authored Sep 14, 2023

    Verified

    This commit was created on GitHub.com and signed with GitHub’s verified signature. The key has expired.
    Copy the full SHA
    4817a51 View commit details
  3. Merge pull request #1973 from okta/bs-OKTA-647925-fix-missing-dependency

    fix: add @mui/system as dependency
    benschell-okta authored Sep 14, 2023

    Verified

    This commit was created on GitHub.com and signed with GitHub’s verified signature. The key has expired.
    Copy the full SHA
    afc8f55 View commit details
  4. chore: update CODEOWNERS (#1974)

    * chore: update CODEOWNERS
    
    Adding Ben Schell from UI Core.
    
    * chore: update CODEOWNERS
    
    * chore: remove @odyssey-okta from CODEOWNERS as it doesn't exist
    KevinGhadyani-Okta authored Sep 14, 2023

    Verified

    This commit was created on GitHub.com and signed with GitHub’s verified signature. The key has expired.
    Copy the full SHA
    61e58b3 View commit details
  5. fix: static tables to always have virtualization enabled (#1967)

    fix: static tables always have virtualization enabled
    KevinGhadyani-Okta authored Sep 14, 2023

    Verified

    This commit was created on GitHub.com and signed with GitHub’s verified signature. The key has expired.
    Copy the full SHA
    f4362ce View commit details
  6. fix: html required attribute removed when adding isOptional prop (#…

    …1965)
    
    fix: html `required` attribute removed when adding `isOptional` prop to input fields
    KevinGhadyani-Okta authored Sep 14, 2023

    Verified

    This commit was created on GitHub.com and signed with GitHub’s verified signature. The key has expired.
    Copy the full SHA
    793210d View commit details
  7. chore: update PR template (#1964)

    * chore: adds PR template
    
    * chore: updates PR template
    KevinGhadyani-Okta authored Sep 14, 2023

    Verified

    This commit was created on GitHub.com and signed with GitHub’s verified signature. The key has expired.
    Copy the full SHA
    5ab0181 View commit details
  8. Partially verified

    This commit was created on GitHub.com and signed with GitHub’s verified signature. The key has expired.
    We cannot verify signatures from co-authors, and some of the co-authors attributed to this commit require their commits to be signed.
    Copy the full SHA
    45ae220 View commit details
  9. Release/v1.1.0 (#1975)

    * build: bump versions for v1.1.0
    
    * docs: update CHANGELOG for v1.1.0
    KevinGhadyani-Okta authored Sep 14, 2023

    Verified

    This commit was created on GitHub.com and signed with GitHub’s verified signature. The key has expired.
    Copy the full SHA
    4dd867b View commit details
Showing with 574 additions and 115 deletions.
  1. +1 −1 .github/CODEOWNERS
  2. +12 −3 .github/PULL_REQUEST_TEMPLATE.md
  3. BIN .yarn/cache/@babel-runtime-npm-7.22.15-b21c55a700-793296df1e.zip
  4. BIN .yarn/cache/@mui-private-theming-npm-5.14.9-ad958d7f29-03d65a750e.zip
  5. BIN .yarn/cache/@mui-styled-engine-npm-5.14.9-2784132a15-535f5e7c65.zip
  6. BIN .yarn/cache/@mui-system-npm-5.14.9-3a28b6cb35-c0091b4c1f.zip
  7. BIN .yarn/cache/@mui-utils-npm-5.14.9-4bdbc186a0-99a46dc2c4.zip
  8. BIN .yarn/cache/@nx-nx-darwin-arm64-npm-16.6.0-f3f3a13093-8.zip
  9. BIN .yarn/cache/clsx-npm-2.0.0-afafbbe44a-a2cfb2351b.zip
  10. BIN .yarn/cache/react-npm-18.2.0-1eae08fee2-88e38092da.zip
  11. BIN .yarn/cache/regenerator-runtime-npm-0.14.0-e060897cf7-1c977ad82a.zip
  12. +16 −0 CHANGELOG.md
  13. +1 −1 lerna.json
  14. +16 −0 packages/odyssey-react-mui/CHANGELOG.md
  15. +2 −1 packages/odyssey-react-mui/package.json
  16. +12 −2 packages/odyssey-react-mui/src/Autocomplete.tsx
  17. +11 −2 packages/odyssey-react-mui/src/Banner.tsx
  18. +5 −2 packages/odyssey-react-mui/src/Box.tsx
  19. +6 −1 packages/odyssey-react-mui/src/Button.tsx
  20. +5 −3 packages/odyssey-react-mui/src/Callout.tsx
  21. +14 −4 packages/odyssey-react-mui/src/Checkbox.tsx
  22. +6 −10 packages/odyssey-react-mui/src/CheckboxGroup.tsx
  23. +5 −1 packages/odyssey-react-mui/src/CircularProgress.tsx
  24. +5 −2 packages/odyssey-react-mui/src/Dialog.tsx
  25. +2 −0 packages/odyssey-react-mui/src/Field.tsx
  26. +5 −3 packages/odyssey-react-mui/src/FieldError.tsx
  27. +9 −3 packages/odyssey-react-mui/src/FieldHint.tsx
  28. +5 −3 packages/odyssey-react-mui/src/FieldLabel.tsx
  29. +4 −1 packages/odyssey-react-mui/src/Fieldset.tsx
  30. +7 −4 packages/odyssey-react-mui/src/Form.tsx
  31. +18 −3 packages/odyssey-react-mui/src/Link.tsx
  32. +5 −1 packages/odyssey-react-mui/src/MenuButton.tsx
  33. +8 −5 packages/odyssey-react-mui/src/MenuItem.tsx
  34. +7 −2 packages/odyssey-react-mui/src/NativeSelect.tsx
  35. +12 −2 packages/odyssey-react-mui/src/PasswordField.tsx
  36. +5 −1 packages/odyssey-react-mui/src/Radio.tsx
  37. +12 −4 packages/odyssey-react-mui/src/RadioGroup.tsx
  38. +16 −6 packages/odyssey-react-mui/src/SearchField.tsx
  39. +14 −4 packages/odyssey-react-mui/src/Select.tsx
  40. +20 −0 packages/odyssey-react-mui/src/SeleniumProps.ts
  41. +15 −3 packages/odyssey-react-mui/src/Status.tsx
  42. +3 −1 packages/odyssey-react-mui/src/Tabs.tsx
  43. +12 −3 packages/odyssey-react-mui/src/Tag.tsx
  44. +4 −2 packages/odyssey-react-mui/src/TagList.tsx
  45. +14 −2 packages/odyssey-react-mui/src/TextField.tsx
  46. +4 −1 packages/odyssey-react-mui/src/Toast.tsx
  47. +4 −1 packages/odyssey-react-mui/src/Tooltip.tsx
  48. +24 −1 packages/odyssey-react-mui/src/Typography.tsx
  49. +15 −7 packages/odyssey-react-mui/src/labs/DatePicker.tsx
  50. +12 −3 packages/odyssey-react-mui/src/labs/PaginatedTable.tsx
  51. +13 −3 packages/odyssey-react-mui/src/labs/StaticTable.tsx
  52. +0 −1 packages/odyssey-react-mui/src/theme/components.tsx
  53. +6 −0 packages/odyssey-storybook/CHANGELOG.md
  54. +1 −1 packages/odyssey-storybook/package.json
  55. +11 −1 packages/odyssey-storybook/src/components/odyssey-mui/Checkbox/Checkbox.stories.tsx
  56. +0 −10 packages/odyssey-storybook/src/components/odyssey-mui/CheckboxGroup/CheckboxGroup.stories.tsx
  57. +10 −0 packages/odyssey-storybook/src/components/odyssey-mui/SearchField/SearchField.stories.tsx
  58. +10 −0 packages/odyssey-storybook/src/components/odyssey-mui/Select/Select.stories.tsx
  59. +10 −0 packages/odyssey-storybook/src/components/odyssey-mui/TextField/TextField.stories.tsx
  60. +22 −0 packages/odyssey-storybook/src/components/odyssey-mui/Typography/Typography.stories.tsx
  61. +118 −0 yarn.lock
2 changes: 1 addition & 1 deletion .github/CODEOWNERS
Original file line number Diff line number Diff line change
@@ -9,4 +9,4 @@
# Resources
# - [CODEOWNERS] https://help.github.com/articles/about-codeowners

* @okta/design-system @ganeshsomasundaram-okta @KevinGhadyani-Okta @odyssey-okta @kamronbatmanghelich-okta
* @okta/design-system @ganeshsomasundaram-okta @KevinGhadyani-Okta @benschell-okta @chrispulsinelli-okta
15 changes: 12 additions & 3 deletions .github/PULL_REQUEST_TEMPLATE.md
Original file line number Diff line number Diff line change
@@ -1,15 +1,24 @@
<!--
Thank you for contributing! Please follow the steps below to help us process your PR quickly.
- 📝 Use a meaningful title for the pull request and include the name of the package modified.
- 📓 Ensure each of your commit messages adhere to the conventional commit specification.
- ✅ Add or edit tests to reflect the change (run `yarn test`).
- 🔍 Add or edit Storybook examples to reflect the change (run `yarn start`).
- 🙏 Please review your own PR to check for anything you may have missed.
-->

[REPLACE_WITH_JIRA_TICKET_NUMBER](https://oktainc.atlassian.net/browse/REPLACE_WITH_JIRA_TICKET_NUMBER)

## Summary

<!--
Add a description with these talking points:
1. Figma link if applicable.
2. A brief description of the work and why it was done in this particular way.
-->

### Description
## Testing & Screenshots

<!-- Describe the change you are introducing -->
- [ ] I have confirmed this change with my designer and the Odyssey Design Team.
<!-- Please include screenshots if it has visuals; otherwise, put "N/A". -->
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
16 changes: 16 additions & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
@@ -3,6 +3,22 @@
All notable changes to this project will be documented in this file.
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.

## [1.1.0](https://github.com/okta/odyssey/compare/v1.0.5...v1.1.0) (2023-09-14)

### Features

- enable name in all form fields ([#1969](https://github.com/okta/odyssey/issues/1969)) ([45ae220](https://github.com/okta/odyssey/commit/45ae220ca8a2bce0af484a52001e5477cf253147))

### Bug Fixes

- add @mui/system as dependency ([8294649](https://github.com/okta/odyssey/commit/8294649debb136a2c92733b8427aedf838200a07))
- flip ordering of state to allow consumer to override ([4c48230](https://github.com/okta/odyssey/commit/4c482302d8ca74fa8566afcf66989064dd397d8a))
- html `required` attribute removed when adding `isOptional` prop ([#1965](https://github.com/okta/odyssey/issues/1965)) ([793210d](https://github.com/okta/odyssey/commit/793210d8c3f3aa4aea3df815e30cb1029c71d511))
- make global + column filtering work ([5df3006](https://github.com/okta/odyssey/commit/5df30067887a456fc3ad373ef8e548e4386590b1))
- onGlobalFilterChange should fire when string removed ([#1970](https://github.com/okta/odyssey/issues/1970)) ([1c424b9](https://github.com/okta/odyssey/commit/1c424b9ac86547f4fb55b955f240f24fac83cb2b))
- prettier adjustments ([cd7111c](https://github.com/okta/odyssey/commit/cd7111c9c510591db866831c58db3ed6f8e6466f))
- static tables to always have virtualization enabled ([#1967](https://github.com/okta/odyssey/issues/1967)) ([f4362ce](https://github.com/okta/odyssey/commit/f4362ce45e7f70aa3667b361f4696af063a78612))

## [1.0.5](https://github.com/okta/odyssey/compare/v1.0.4...v1.0.5) (2023-09-11)

### Bug Fixes
2 changes: 1 addition & 1 deletion lerna.json
Original file line number Diff line number Diff line change
@@ -4,5 +4,5 @@
"npmClient": "yarn",
"packages": ["packages/*"],
"useNx": false,
"version": "1.0.5"
"version": "1.1.0"
}
16 changes: 16 additions & 0 deletions packages/odyssey-react-mui/CHANGELOG.md
Original file line number Diff line number Diff line change
@@ -3,6 +3,22 @@
All notable changes to this project will be documented in this file.
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.

## [1.1.0](https://github.com/okta/odyssey/compare/v1.0.5...v1.1.0) (2023-09-14)

### Features

- enable name in all form fields ([#1969](https://github.com/okta/odyssey/issues/1969)) ([45ae220](https://github.com/okta/odyssey/commit/45ae220ca8a2bce0af484a52001e5477cf253147))

### Bug Fixes

- add @mui/system as dependency ([8294649](https://github.com/okta/odyssey/commit/8294649debb136a2c92733b8427aedf838200a07))
- flip ordering of state to allow consumer to override ([4c48230](https://github.com/okta/odyssey/commit/4c482302d8ca74fa8566afcf66989064dd397d8a))
- html `required` attribute removed when adding `isOptional` prop ([#1965](https://github.com/okta/odyssey/issues/1965)) ([793210d](https://github.com/okta/odyssey/commit/793210d8c3f3aa4aea3df815e30cb1029c71d511))
- make global + column filtering work ([5df3006](https://github.com/okta/odyssey/commit/5df30067887a456fc3ad373ef8e548e4386590b1))
- onGlobalFilterChange should fire when string removed ([#1970](https://github.com/okta/odyssey/issues/1970)) ([1c424b9](https://github.com/okta/odyssey/commit/1c424b9ac86547f4fb55b955f240f24fac83cb2b))
- prettier adjustments ([cd7111c](https://github.com/okta/odyssey/commit/cd7111c9c510591db866831c58db3ed6f8e6466f))
- static tables to always have virtualization enabled ([#1967](https://github.com/okta/odyssey/issues/1967)) ([f4362ce](https://github.com/okta/odyssey/commit/f4362ce45e7f70aa3667b361f4696af063a78612))

## [1.0.5](https://github.com/okta/odyssey/compare/v1.0.4...v1.0.5) (2023-09-11)

**Note:** Version bump only for package @okta/odyssey-react-mui
3 changes: 2 additions & 1 deletion packages/odyssey-react-mui/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@okta/odyssey-react-mui",
"version": "1.0.5",
"version": "1.1.0",
"description": "React MUI components for Odyssey, Okta's design system",
"author": "Okta, Inc.",
"license": "Apache-2.0",
@@ -67,6 +67,7 @@
"@mui/icons-material": "^5.11.0",
"@mui/lab": "^5.0.0-alpha.117",
"@mui/material": "^5.12.3",
"@mui/system": "^5.14.9",
"@mui/utils": "^5.11.2",
"@mui/x-date-pickers": "^5.0.15",
"@okta/odyssey-design-tokens": "workspace:*",
14 changes: 12 additions & 2 deletions packages/odyssey-react-mui/src/Autocomplete.tsx
Original file line number Diff line number Diff line change
@@ -18,6 +18,7 @@ import {
import { memo, useCallback } from "react";

import { Field } from "./Field";
import type { SeleniumProps } from "./SeleniumProps";

export type AutocompleteProps<
OptionType,
@@ -64,6 +65,10 @@ export type AutocompleteProps<
undefined,
IsCustomValueAllowed
>["loading"];
/**
* If `true`, the `input` element is not required.
*/
isOptional?: boolean;
/**
* Makes the Autocomplete input read-only
*/
@@ -113,7 +118,7 @@ export type AutocompleteProps<
undefined,
IsCustomValueAllowed
>["value"];
};
} & SeleniumProps;

const Autocomplete = <
OptionType,
@@ -124,13 +129,15 @@ const Autocomplete = <
isCustomValueAllowed,
isDisabled,
isLoading,
isOptional = false,
isReadOnly,
hint,
label,
onChange,
onInputChange,
options,
value,
testId,
}: AutocompleteProps<OptionType, HasMultipleChoices, IsCustomValueAllowed>) => {
const renderInput = useCallback(
({ InputLabelProps, InputProps, ...params }) => (
@@ -140,23 +147,26 @@ const Autocomplete = <
id={InputLabelProps.htmlFor}
hint={hint}
label={label}
isOptional={isOptional}
renderFieldComponent={({ ariaDescribedBy, id }) => (
<InputBase
{...params}
{...InputProps}
aria-describedby={ariaDescribedBy}
id={id}
required={!isOptional}
/>
)}
/>
),
[hint, label]
[hint, isOptional, label]
);

return (
<MuiAutocomplete
// AutoComplete is wrapped in a div within MUI which does not get the disabled attr. So this aria-disabled gets set in the div
aria-disabled={isDisabled}
data-se={testId}
disableCloseOnSelect={hasMultipleChoices}
disabled={isDisabled}
freeSolo={isCustomValueAllowed}
13 changes: 11 additions & 2 deletions packages/odyssey-react-mui/src/Banner.tsx
Original file line number Diff line number Diff line change
@@ -16,6 +16,8 @@ import { ScreenReaderText } from "./ScreenReaderText";
import { memo } from "react";
import { useTranslation } from "react-i18next";

import type { SeleniumProps } from "./SeleniumProps";

export const bannerRoleValues = ["status", "alert"] as const;
export const bannerSeverityValues: AlertColor[] = [
"success",
@@ -54,7 +56,7 @@ export type BannerProps = {
* The text content of the alert
*/
text: string;
};
} & SeleniumProps;

const Banner = ({
linkUrl,
@@ -63,11 +65,18 @@ const Banner = ({
role,
severity,
text,
testId,
}: BannerProps) => {
const { t } = useTranslation();

return (
<Alert onClose={onClose} role={role} severity={severity} variant="banner">
<Alert
data-se={testId}
onClose={onClose}
role={role}
severity={severity}
variant="banner"
>
<ScreenReaderText>{t(`severity.${severity}`)}:</ScreenReaderText>
<AlertTitle>{text}</AlertTitle>
{linkUrl && (
7 changes: 5 additions & 2 deletions packages/odyssey-react-mui/src/Box.tsx
Original file line number Diff line number Diff line change
@@ -13,19 +13,22 @@
import { Box as MuiBox, BoxProps as MuiBoxProps } from "@mui/material";
import { ReactNode, forwardRef, memo } from "react";

import type { SeleniumProps } from "./SeleniumProps";

export type BoxProps = {
children?: ReactNode;
component?: MuiBoxProps["component"];
id?: MuiBoxProps["id"];
sx?: MuiBoxProps["sx"];
};
} & SeleniumProps;

const Box = forwardRef<HTMLElement, BoxProps>(
({ children, component, id, sx }, ref) => (
({ children, component, id, sx, testId }, ref) => (
<MuiBox
ref={ref}
children={children}
component={component}
data-se={testId}
id={id}
sx={sx}
/>
7 changes: 6 additions & 1 deletion packages/odyssey-react-mui/src/Button.tsx
Original file line number Diff line number Diff line change
@@ -16,6 +16,7 @@ import { memo, ReactElement, useCallback } from "react";

import { MuiPropsContext, useMuiProps } from "./MuiPropsContext";
import { Tooltip } from "./Tooltip";
import type { SeleniumProps } from "./SeleniumProps";

export const buttonSizeValues = ["small", "medium", "large"] as const;
export const buttonTypeValues = ["button", "submit", "reset"] as const;
@@ -100,7 +101,8 @@ export type ButtonProps = {
label?: "" | undefined;
startIcon?: ReactElement;
}
);
) &
SeleniumProps;

const Button = ({
ariaDescribedBy,
@@ -114,6 +116,7 @@ const Button = ({
onClick,
size = "medium",
startIcon,
testId,
tooltipText,
type = "button",
variant,
@@ -127,6 +130,7 @@ const Button = ({
aria-label={ariaLabel}
aria-labelledby={ariaLabelledBy}
aria-describedby={ariaDescribedBy}
data-se={testId}
disabled={isDisabled}
endIcon={endIcon}
fullWidth={isFullWidth}
@@ -152,6 +156,7 @@ const Button = ({
onClick,
size,
startIcon,
testId,
type,
variant,
]
8 changes: 5 additions & 3 deletions packages/odyssey-react-mui/src/Callout.tsx
Original file line number Diff line number Diff line change
@@ -15,6 +15,8 @@ import { Alert, AlertTitle, Box } from "@mui/material";
import { ScreenReaderText } from "./ScreenReaderText";
import { useTranslation } from "react-i18next";

import type { SeleniumProps } from "./SeleniumProps";

export const calloutRoleValues = ["status", "alert"] as const;
export const calloutSeverityValues = [
"success",
@@ -42,13 +44,13 @@ export type CalloutProps = {
* The title of the Callout
*/
title?: string;
};
} & SeleniumProps;

const Callout = ({ children, role, severity, title }: CalloutProps) => {
const Callout = ({ children, role, severity, testId, title }: CalloutProps) => {
const { t } = useTranslation();

return (
<Alert role={role} severity={severity} variant="callout">
<Alert data-se={testId} role={role} severity={severity} variant="callout">
<ScreenReaderText>{t(`severity.${severity}`)}: </ScreenReaderText>
{title && <AlertTitle>{title}</AlertTitle>}
<Box component="div">{children}</Box>
18 changes: 14 additions & 4 deletions packages/odyssey-react-mui/src/Checkbox.tsx
Original file line number Diff line number Diff line change
@@ -19,6 +19,8 @@ import { Typography } from "./Typography";
import { memo, useCallback, useMemo, useState } from "react";
import { useTranslation } from "react-i18next";

import type { SeleniumProps } from "./SeleniumProps";

export const checkboxValidityValues = ["valid", "invalid", "inherit"] as const;

export type CheckboxProps = {
@@ -30,6 +32,10 @@ export type CheckboxProps = {
* The ID of the element that labels the Checkbox
*/
ariaLabelledBy?: string;
/**
* The id of the `input` element.
*/
id?: string;
/**
* Determines whether the Checkbox is checked
*/
@@ -51,7 +57,7 @@ export type CheckboxProps = {
*/
label?: string;
/**
* The name attribute of the Checkbox
* The name of the `input` element. Defaults to the `id` if not set.
*/
name?: string;
/**
@@ -66,18 +72,20 @@ export type CheckboxProps = {
* The value attribute of the Checkbox
*/
value?: string;
};
} & SeleniumProps;

const Checkbox = ({
ariaLabel,
ariaLabelledBy,
id: idOverride,
isDefaultChecked = false,
isDisabled,
isIndeterminate,
isRequired,
label: labelProp,
name,
name: nameOverride,
onChange: onChangeProp,
testId,
validity = "inherit",
value,
}: CheckboxProps) => {
@@ -122,9 +130,11 @@ const Checkbox = ({
control={
<MuiCheckbox indeterminate={isIndeterminate} required={isRequired} />
}
data-se={testId}
disabled={isDisabled}
id={idOverride}
label={label}
name={name}
name={nameOverride ?? idOverride}
onChange={onChange}
value={value}
required={isRequired}
Loading