From 36a8bb43b4f62681a074d62d2293753db3fb09c6 Mon Sep 17 00:00:00 2001 From: sai6855 <60743144+sai6855@users.noreply.github.com> Date: Tue, 29 Aug 2023 10:22:27 +0530 Subject: [PATCH 1/4] Fix classname --- .../src/AccordionGroup/AccordionGroup.test.tsx | 17 +++++++++++++++++ .../src/AccordionGroup/AccordionGroup.tsx | 2 +- .../src/AccordionGroup/accordionGroupClasses.ts | 9 +++++++++ 3 files changed, 27 insertions(+), 1 deletion(-) diff --git a/packages/mui-joy/src/AccordionGroup/AccordionGroup.test.tsx b/packages/mui-joy/src/AccordionGroup/AccordionGroup.test.tsx index fcb6aaf45d5ed5..98ed44bc54d821 100644 --- a/packages/mui-joy/src/AccordionGroup/AccordionGroup.test.tsx +++ b/packages/mui-joy/src/AccordionGroup/AccordionGroup.test.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { expect } from 'chai'; import { createRenderer, describeConformance } from 'test/utils'; import { ThemeProvider } from '@mui/joy/styles'; import AccordionGroup, { accordionGroupClasses as classes } from '@mui/joy/AccordionGroup'; @@ -21,4 +22,20 @@ describe('', () => { }, }, })); + + describe('classes', () => { + ( + [ + { size: 'sm', class: classes.sizeSm }, + { size: 'md', class: classes.sizeMd }, + { size: 'lg', class: classes.sizeLg }, + ] as const + ).forEach((size) => { + it(`should have ${size.class} class for ${size.size} size `, () => { + const { getByTestId } = render(); + + expect(getByTestId('root')).to.have.class(size.class); + }); + }); + }); }); diff --git a/packages/mui-joy/src/AccordionGroup/AccordionGroup.tsx b/packages/mui-joy/src/AccordionGroup/AccordionGroup.tsx index 6ce32712ea8e44..66f57b0845664a 100644 --- a/packages/mui-joy/src/AccordionGroup/AccordionGroup.tsx +++ b/packages/mui-joy/src/AccordionGroup/AccordionGroup.tsx @@ -25,7 +25,7 @@ const useUtilityClasses = (ownerState: AccordionGroupOwnerState) => { 'root', variant && `variant${capitalize(variant)}`, color && `color${capitalize(color)}`, - size && `size${capitalize(size)}}`, + size && `size${capitalize(size)}`, ], }; diff --git a/packages/mui-joy/src/AccordionGroup/accordionGroupClasses.ts b/packages/mui-joy/src/AccordionGroup/accordionGroupClasses.ts index d559f8b5c4d2f9..346d24a87f6675 100644 --- a/packages/mui-joy/src/AccordionGroup/accordionGroupClasses.ts +++ b/packages/mui-joy/src/AccordionGroup/accordionGroupClasses.ts @@ -3,6 +3,12 @@ import { generateUtilityClass, generateUtilityClasses } from '../className'; export interface AccordionGroupClasses { /** Class name applied to the root element. */ root: string; + /** Class name applied to the root element if `size="sm"`. */ + sizeSm: string; + /** Class name applied to the root element if `size="md"`. */ + sizeMd: string; + /** Class name applied to the root element if `size="lg"`. */ + sizeLg: string; } export type AccordionGroupClassKey = keyof AccordionGroupClasses; @@ -13,6 +19,9 @@ export function getAccordionGroupUtilityClass(slot: string): string { const accordionGroupClasses: AccordionGroupClasses = generateUtilityClasses('MuiAccordionGroup', [ 'root', + 'sizeSm', + 'sizeMd', + 'sizeLg', ]); export default accordionGroupClasses; From 99177edc3249822bd8a574cdeecaed2fab2142b7 Mon Sep 17 00:00:00 2001 From: sai6855 <60743144+sai6855@users.noreply.github.com> Date: Tue, 29 Aug 2023 10:32:33 +0530 Subject: [PATCH 2/4] docs:Api --- docs/pages/joy-ui/api/accordion-group.json | 3 ++- .../accordion-group/accordion-group.json | 19 ++++++++++++++++++- 2 files changed, 20 insertions(+), 2 deletions(-) diff --git a/docs/pages/joy-ui/api/accordion-group.json b/docs/pages/joy-ui/api/accordion-group.json index 4b02e45dc7425f..15517683f2ae85 100644 --- a/docs/pages/joy-ui/api/accordion-group.json +++ b/docs/pages/joy-ui/api/accordion-group.json @@ -53,7 +53,7 @@ "import AccordionGroup from '@mui/joy/AccordionGroup';", "import { AccordionGroup } from '@mui/joy';" ], - "styles": { "classes": ["root"], "globalClasses": {}, "name": "MuiAccordionGroup" }, + "styles": { "classes": [], "globalClasses": {}, "name": "MuiAccordionGroup" }, "slots": [ { "name": "root", @@ -62,6 +62,7 @@ "class": ".MuiAccordionGroup-root" } ], + "classes": { "classes": ["sizeLg", "sizeMd", "sizeSm"], "globalClasses": {} }, "spread": true, "themeDefaultProps": true, "muiName": "JoyAccordionGroup", diff --git a/docs/translations/api-docs-joy/accordion-group/accordion-group.json b/docs/translations/api-docs-joy/accordion-group/accordion-group.json index 5d0ba0be29f2cd..880f29343d65ef 100644 --- a/docs/translations/api-docs-joy/accordion-group/accordion-group.json +++ b/docs/translations/api-docs-joy/accordion-group/accordion-group.json @@ -24,6 +24,23 @@ "description": "The global variant to use." } }, - "classDescriptions": { "root": { "description": "Class name applied to the root element." } }, + "classDescriptions": { + "root": { "description": "Class name applied to the root element." }, + "sizeSm": { + "description": "Class name applied to {{nodeName}} if {{conditions}}.", + "nodeName": "the root element", + "conditions": "size=\"sm\"" + }, + "sizeMd": { + "description": "Class name applied to {{nodeName}} if {{conditions}}.", + "nodeName": "the root element", + "conditions": "size=\"md\"" + }, + "sizeLg": { + "description": "Class name applied to {{nodeName}} if {{conditions}}.", + "nodeName": "the root element", + "conditions": "size=\"lg\"" + } + }, "slotDescriptions": { "root": "The component that renders the root." } } From 3b84a296ec104f52f9ae293d3d27d6bcc7baa39c Mon Sep 17 00:00:00 2001 From: sai6855 <60743144+sai6855@users.noreply.github.com> Date: Tue, 29 Aug 2023 11:22:29 +0530 Subject: [PATCH 3/4] change variable name --- .../mui-joy/src/AccordionGroup/AccordionGroup.test.tsx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/mui-joy/src/AccordionGroup/AccordionGroup.test.tsx b/packages/mui-joy/src/AccordionGroup/AccordionGroup.test.tsx index 98ed44bc54d821..5459b5a8dca184 100644 --- a/packages/mui-joy/src/AccordionGroup/AccordionGroup.test.tsx +++ b/packages/mui-joy/src/AccordionGroup/AccordionGroup.test.tsx @@ -30,11 +30,11 @@ describe('', () => { { size: 'md', class: classes.sizeMd }, { size: 'lg', class: classes.sizeLg }, ] as const - ).forEach((size) => { - it(`should have ${size.class} class for ${size.size} size `, () => { - const { getByTestId } = render(); + ).forEach((sizeConfig) => { + it(`should have ${sizeConfig.class} class for ${sizeConfig.size} size `, () => { + const { getByTestId } = render(); - expect(getByTestId('root')).to.have.class(size.class); + expect(getByTestId('root')).to.have.class(sizeConfig.class); }); }); }); From a2a767a366061b6d421fa800021c738c4aa6525a Mon Sep 17 00:00:00 2001 From: sai6855 <60743144+sai6855@users.noreply.github.com> Date: Tue, 29 Aug 2023 11:29:23 +0530 Subject: [PATCH 4/4] prettier --- packages/mui-joy/src/AccordionGroup/AccordionGroup.test.tsx | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/packages/mui-joy/src/AccordionGroup/AccordionGroup.test.tsx b/packages/mui-joy/src/AccordionGroup/AccordionGroup.test.tsx index 5459b5a8dca184..40b605bb372a9c 100644 --- a/packages/mui-joy/src/AccordionGroup/AccordionGroup.test.tsx +++ b/packages/mui-joy/src/AccordionGroup/AccordionGroup.test.tsx @@ -32,7 +32,9 @@ describe('', () => { ] as const ).forEach((sizeConfig) => { it(`should have ${sizeConfig.class} class for ${sizeConfig.size} size `, () => { - const { getByTestId } = render(); + const { getByTestId } = render( + , + ); expect(getByTestId('root')).to.have.class(sizeConfig.class); });