From 3df4e29bbc231d17f2453b341a00a3a0ac62b1cf Mon Sep 17 00:00:00 2001 From: sai6855 Date: Tue, 22 Oct 2024 13:13:56 +0530 Subject: [PATCH 01/13] add missing defaults to Collapsible* components --- .../mui-base/src/Collapsible/Content/CollapsibleContent.tsx | 2 +- packages/mui-base/src/Collapsible/Root/CollapsibleRoot.tsx | 6 +++--- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/mui-base/src/Collapsible/Content/CollapsibleContent.tsx b/packages/mui-base/src/Collapsible/Content/CollapsibleContent.tsx index 3aa9f21a7a..f7662a964d 100644 --- a/packages/mui-base/src/Collapsible/Content/CollapsibleContent.tsx +++ b/packages/mui-base/src/Collapsible/Content/CollapsibleContent.tsx @@ -22,7 +22,7 @@ const CollapsibleContent = React.forwardRef(function CollapsibleContent( props: CollapsibleContent.Props, forwardedRef: React.ForwardedRef, ) { - const { className, htmlHidden, render, ...otherProps } = props; + const { className, htmlHidden = 'hidden', render, ...otherProps } = props; const { animated, mounted, open, contentId, setContentId, setMounted, setOpen, ownerState } = useCollapsibleContext(); diff --git a/packages/mui-base/src/Collapsible/Root/CollapsibleRoot.tsx b/packages/mui-base/src/Collapsible/Root/CollapsibleRoot.tsx index 89959db2ef..6e475fbc7b 100644 --- a/packages/mui-base/src/Collapsible/Root/CollapsibleRoot.tsx +++ b/packages/mui-base/src/Collapsible/Root/CollapsibleRoot.tsx @@ -22,11 +22,11 @@ const CollapsibleRoot = React.forwardRef(function CollapsibleRoot( forwardedRef: React.ForwardedRef, ) { const { - animated, + animated = true, children, className, - defaultOpen, - disabled, + defaultOpen = true, + disabled = false, onOpenChange, open, render: renderProp, From e5410ceb655fb079169cbb9fd45df0f85670b221 Mon Sep 17 00:00:00 2001 From: sai6855 Date: Sat, 30 Nov 2024 19:48:41 +0530 Subject: [PATCH 02/13] make parmas in required --- .../collapsible/panel/CollapsiblePanel.tsx | 2 +- .../collapsible/panel/useCollapsiblePanel.ts | 12 +++++------ .../collapsible/root/useCollapsibleRoot.ts | 21 ++++++------------- 3 files changed, 12 insertions(+), 23 deletions(-) diff --git a/packages/react/src/collapsible/panel/CollapsiblePanel.tsx b/packages/react/src/collapsible/panel/CollapsiblePanel.tsx index c56aa5df7c..5a3f039fc3 100644 --- a/packages/react/src/collapsible/panel/CollapsiblePanel.tsx +++ b/packages/react/src/collapsible/panel/CollapsiblePanel.tsx @@ -22,7 +22,7 @@ const CollapsiblePanel = React.forwardRef(function CollapsiblePanel( props: CollapsiblePanel.Props, forwardedRef: React.ForwardedRef, ) { - const { className, hiddenUntilFound, render, ...otherProps } = props; + const { className, hiddenUntilFound=false, render, ...otherProps } = props; const { animated, mounted, open, panelId, setPanelId, setMounted, setOpen, state } = useCollapsibleRootContext(); diff --git a/packages/react/src/collapsible/panel/useCollapsiblePanel.ts b/packages/react/src/collapsible/panel/useCollapsiblePanel.ts index d5d824fc25..f6d19ad68c 100644 --- a/packages/react/src/collapsible/panel/useCollapsiblePanel.ts +++ b/packages/react/src/collapsible/panel/useCollapsiblePanel.ts @@ -57,8 +57,8 @@ export function useCollapsiblePanel( parameters: useCollapsiblePanel.Parameters, ): useCollapsiblePanel.ReturnValue { const { - animated = false, - hiddenUntilFound = false, + animated, + hiddenUntilFound, id: idParam, open, mounted: contextMounted, @@ -295,16 +295,14 @@ export namespace useCollapsiblePanel { export interface Parameters { /** * If `true`, the component supports CSS/JS-based animations and transitions. - * @default false */ - animated?: boolean; + animated: boolean; /** * If `true`, sets `hidden="until-found"` when closed. * If `false`, sets `hidden` when closed. - * @default false */ - hiddenUntilFound?: boolean; - id?: React.HTMLAttributes['id']; + hiddenUntilFound: boolean; + id: React.HTMLAttributes['id']; mounted: boolean; /** * The open state of the Collapsible diff --git a/packages/react/src/collapsible/root/useCollapsibleRoot.ts b/packages/react/src/collapsible/root/useCollapsibleRoot.ts index ce7f7e026b..65efcfc291 100644 --- a/packages/react/src/collapsible/root/useCollapsibleRoot.ts +++ b/packages/react/src/collapsible/root/useCollapsibleRoot.ts @@ -8,13 +8,7 @@ import { useId } from '../../utils/useId'; export function useCollapsibleRoot( parameters: useCollapsibleRoot.Parameters, ): useCollapsibleRoot.ReturnValue { - const { - animated = true, - open: openParam, - defaultOpen = true, - onOpenChange, - disabled = false, - } = parameters; + const { animated, open: openParam, defaultOpen, onOpenChange, disabled } = parameters; const [open, setOpenState] = useControlled({ controlled: openParam, @@ -52,29 +46,26 @@ export namespace useCollapsibleRoot { export interface Parameters { /** * If `true`, the component supports CSS/JS-based animations and transitions. - * @default true */ - animated?: boolean; + animated: boolean; /** * If `true`, the Collapsible is initially open. * This is the controlled counterpart of `defaultOpen`. */ - open?: boolean; + open: boolean; /** * If `true`, the Collapsible is initially open. * This is the uncontrolled counterpart of `open`. - * @default true */ - defaultOpen?: boolean; + defaultOpen: boolean; /** * Callback fired when the Collapsible is opened or closed. */ - onOpenChange?: (open: boolean) => void; + onOpenChange: (open: boolean) => void; /** * If `true`, the component is disabled. - * @default false */ - disabled?: boolean; + disabled: boolean; } export interface ReturnValue { From 91d11498ef42b246c7d093925334730144729a89 Mon Sep 17 00:00:00 2001 From: sai6855 Date: Sat, 30 Nov 2024 19:52:22 +0530 Subject: [PATCH 03/13] pnpm prettier --- packages/react/src/collapsible/panel/CollapsiblePanel.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/src/collapsible/panel/CollapsiblePanel.tsx b/packages/react/src/collapsible/panel/CollapsiblePanel.tsx index 5a3f039fc3..8db14e47a7 100644 --- a/packages/react/src/collapsible/panel/CollapsiblePanel.tsx +++ b/packages/react/src/collapsible/panel/CollapsiblePanel.tsx @@ -22,7 +22,7 @@ const CollapsiblePanel = React.forwardRef(function CollapsiblePanel( props: CollapsiblePanel.Props, forwardedRef: React.ForwardedRef, ) { - const { className, hiddenUntilFound=false, render, ...otherProps } = props; + const { className, hiddenUntilFound = false, render, ...otherProps } = props; const { animated, mounted, open, panelId, setPanelId, setMounted, setOpen, state } = useCollapsibleRootContext(); From afeadebc49cba81294406e8d00c1e9a517e5ab84 Mon Sep 17 00:00:00 2001 From: sai6855 Date: Sat, 30 Nov 2024 20:00:56 +0530 Subject: [PATCH 04/13] fix accordion item --- packages/react/src/accordion/item/AccordionItem.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/react/src/accordion/item/AccordionItem.tsx b/packages/react/src/accordion/item/AccordionItem.tsx index 2189025519..bf73e005b4 100644 --- a/packages/react/src/accordion/item/AccordionItem.tsx +++ b/packages/react/src/accordion/item/AccordionItem.tsx @@ -78,6 +78,7 @@ const AccordionItem = React.forwardRef(function AccordionItem( open: isOpen, onOpenChange, disabled, + defaultOpen: true, }); const collapsibleState: CollapsibleRoot.State = React.useMemo( From 84aaecbd7c126f0ae3a6f6ffe32228795e14aa72 Mon Sep 17 00:00:00 2001 From: sai6855 Date: Sat, 30 Nov 2024 20:05:36 +0530 Subject: [PATCH 05/13] fix accordion item types --- packages/react/src/accordion/item/AccordionItem.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/src/accordion/item/AccordionItem.tsx b/packages/react/src/accordion/item/AccordionItem.tsx index bf73e005b4..401b65d19c 100644 --- a/packages/react/src/accordion/item/AccordionItem.tsx +++ b/packages/react/src/accordion/item/AccordionItem.tsx @@ -150,7 +150,7 @@ export namespace AccordionItem { export interface Props extends BaseUIComponentProps<'div', State>, - Pick { + Partial> { value?: Value; } } From d65b67427ab56d4d09f9408dd0f5c380dcc0fbc2 Mon Sep 17 00:00:00 2001 From: sai6855 Date: Sat, 30 Nov 2024 20:11:35 +0530 Subject: [PATCH 06/13] fix accordion panel props --- packages/react/src/accordion/panel/AccordionPanel.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/src/accordion/panel/AccordionPanel.tsx b/packages/react/src/accordion/panel/AccordionPanel.tsx index 157d3a740b..e89dab48fc 100644 --- a/packages/react/src/accordion/panel/AccordionPanel.tsx +++ b/packages/react/src/accordion/panel/AccordionPanel.tsx @@ -76,7 +76,7 @@ const AccordionPanel = React.forwardRef(function AccordionPanel( export namespace AccordionPanel { export interface Props extends BaseUIComponentProps<'div', AccordionItem.State>, - Pick {} + Partial> {} } export { AccordionPanel }; From 6e47ab1e6c9175d4bd3fd57c1b8a26672b944a2b Mon Sep 17 00:00:00 2001 From: sai6855 Date: Sat, 30 Nov 2024 20:14:56 +0530 Subject: [PATCH 07/13] make types partial --- packages/react/src/collapsible/panel/CollapsiblePanel.tsx | 2 +- packages/react/src/collapsible/root/CollapsibleRoot.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/react/src/collapsible/panel/CollapsiblePanel.tsx b/packages/react/src/collapsible/panel/CollapsiblePanel.tsx index 8db14e47a7..640cf10458 100644 --- a/packages/react/src/collapsible/panel/CollapsiblePanel.tsx +++ b/packages/react/src/collapsible/panel/CollapsiblePanel.tsx @@ -63,7 +63,7 @@ export { CollapsiblePanel }; namespace CollapsiblePanel { export interface Props extends BaseUIComponentProps<'div', CollapsibleRoot.State>, - Pick {} + Partial> {} } CollapsiblePanel.propTypes /* remove-proptypes */ = { diff --git a/packages/react/src/collapsible/root/CollapsibleRoot.tsx b/packages/react/src/collapsible/root/CollapsibleRoot.tsx index 7130d271a1..c933002343 100644 --- a/packages/react/src/collapsible/root/CollapsibleRoot.tsx +++ b/packages/react/src/collapsible/root/CollapsibleRoot.tsx @@ -86,7 +86,7 @@ export { CollapsibleRoot }; export namespace CollapsibleRoot { export interface State - extends Pick {} + extends Partial> {} export interface Props extends useCollapsibleRoot.Parameters, From 24b9ccd9d3e952dafbc98d2c9d4e6d1a3b9cf219 Mon Sep 17 00:00:00 2001 From: sai6855 Date: Sat, 30 Nov 2024 20:24:51 +0530 Subject: [PATCH 08/13] fix collapslble trigger --- packages/react/src/collapsible/root/CollapsibleRoot.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/packages/react/src/collapsible/root/CollapsibleRoot.tsx b/packages/react/src/collapsible/root/CollapsibleRoot.tsx index c933002343..9aad676024 100644 --- a/packages/react/src/collapsible/root/CollapsibleRoot.tsx +++ b/packages/react/src/collapsible/root/CollapsibleRoot.tsx @@ -86,7 +86,8 @@ export { CollapsibleRoot }; export namespace CollapsibleRoot { export interface State - extends Partial> {} + extends Pick, + Partial> {} export interface Props extends useCollapsibleRoot.Parameters, From 082cb0969d20087a8a05b7faf41c1985d671160e Mon Sep 17 00:00:00 2001 From: sai6855 Date: Mon, 2 Dec 2024 10:36:03 +0530 Subject: [PATCH 09/13] fix root types --- packages/react/src/collapsible/root/CollapsibleRoot.tsx | 5 +++-- packages/react/src/collapsible/root/useCollapsibleRoot.ts | 2 +- 2 files changed, 4 insertions(+), 3 deletions(-) diff --git a/packages/react/src/collapsible/root/CollapsibleRoot.tsx b/packages/react/src/collapsible/root/CollapsibleRoot.tsx index 9aad676024..f9bafbbe57 100644 --- a/packages/react/src/collapsible/root/CollapsibleRoot.tsx +++ b/packages/react/src/collapsible/root/CollapsibleRoot.tsx @@ -3,6 +3,7 @@ import * as React from 'react'; import PropTypes from 'prop-types'; import { BaseUIComponentProps } from '../../utils/types'; import { useComponentRenderer } from '../../utils/useComponentRenderer'; +import { NOOP } from '../../utils/noop'; import { useCollapsibleRoot } from './useCollapsibleRoot'; import { CollapsibleRootContext } from './CollapsibleRootContext'; import { collapsibleStyleHookMapping } from './styleHooks'; @@ -27,7 +28,7 @@ const CollapsibleRoot = React.forwardRef(function CollapsibleRoot( className, defaultOpen = true, disabled = false, - onOpenChange, + onOpenChange =NOOP, open, render: renderProp, ...otherProps @@ -90,7 +91,7 @@ export namespace CollapsibleRoot { Partial> {} export interface Props - extends useCollapsibleRoot.Parameters, + extends Partial, BaseUIComponentProps<'div', State> {} } diff --git a/packages/react/src/collapsible/root/useCollapsibleRoot.ts b/packages/react/src/collapsible/root/useCollapsibleRoot.ts index 65efcfc291..fd760050bc 100644 --- a/packages/react/src/collapsible/root/useCollapsibleRoot.ts +++ b/packages/react/src/collapsible/root/useCollapsibleRoot.ts @@ -52,7 +52,7 @@ export namespace useCollapsibleRoot { * If `true`, the Collapsible is initially open. * This is the controlled counterpart of `defaultOpen`. */ - open: boolean; + open: boolean | undefined; /** * If `true`, the Collapsible is initially open. * This is the uncontrolled counterpart of `open`. From 366befc5ac167921923cc94f993d99dcb0017eb9 Mon Sep 17 00:00:00 2001 From: sai6855 Date: Mon, 2 Dec 2024 10:40:45 +0530 Subject: [PATCH 10/13] fix acc item --- packages/react/src/accordion/item/AccordionItem.tsx | 2 +- packages/react/src/collapsible/root/CollapsibleRoot.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/react/src/accordion/item/AccordionItem.tsx b/packages/react/src/accordion/item/AccordionItem.tsx index 401b65d19c..cf5f445b73 100644 --- a/packages/react/src/accordion/item/AccordionItem.tsx +++ b/packages/react/src/accordion/item/AccordionItem.tsx @@ -78,7 +78,7 @@ const AccordionItem = React.forwardRef(function AccordionItem( open: isOpen, onOpenChange, disabled, - defaultOpen: true, + defaultOpen: false, }); const collapsibleState: CollapsibleRoot.State = React.useMemo( diff --git a/packages/react/src/collapsible/root/CollapsibleRoot.tsx b/packages/react/src/collapsible/root/CollapsibleRoot.tsx index f9bafbbe57..5c491b5fdc 100644 --- a/packages/react/src/collapsible/root/CollapsibleRoot.tsx +++ b/packages/react/src/collapsible/root/CollapsibleRoot.tsx @@ -28,7 +28,7 @@ const CollapsibleRoot = React.forwardRef(function CollapsibleRoot( className, defaultOpen = true, disabled = false, - onOpenChange =NOOP, + onOpenChange = NOOP, open, render: renderProp, ...otherProps From 812dffef5e954fc9509b8f6b55dabc5826e7733a Mon Sep 17 00:00:00 2001 From: sai6855 Date: Mon, 2 Dec 2024 10:53:20 +0530 Subject: [PATCH 11/13] docs:api --- docs/data/api/collapsible-root.json | 2 +- packages/react/src/collapsible/root/CollapsibleRoot.tsx | 4 +++- 2 files changed, 4 insertions(+), 2 deletions(-) diff --git a/docs/data/api/collapsible-root.json b/docs/data/api/collapsible-root.json index 07e96140d0..3b776d193f 100644 --- a/docs/data/api/collapsible-root.json +++ b/docs/data/api/collapsible-root.json @@ -4,7 +4,7 @@ "className": { "type": { "name": "union", "description": "func
| string" } }, "defaultOpen": { "type": { "name": "bool" }, "default": "true" }, "disabled": { "type": { "name": "bool" }, "default": "false" }, - "onOpenChange": { "type": { "name": "func" } }, + "onOpenChange": { "type": { "name": "func" }, "default": "() => {}" }, "open": { "type": { "name": "bool" } }, "render": { "type": { "name": "union", "description": "element
| func" } } }, diff --git a/packages/react/src/collapsible/root/CollapsibleRoot.tsx b/packages/react/src/collapsible/root/CollapsibleRoot.tsx index 5c491b5fdc..bd0d06f0ee 100644 --- a/packages/react/src/collapsible/root/CollapsibleRoot.tsx +++ b/packages/react/src/collapsible/root/CollapsibleRoot.tsx @@ -3,11 +3,12 @@ import * as React from 'react'; import PropTypes from 'prop-types'; import { BaseUIComponentProps } from '../../utils/types'; import { useComponentRenderer } from '../../utils/useComponentRenderer'; -import { NOOP } from '../../utils/noop'; import { useCollapsibleRoot } from './useCollapsibleRoot'; import { CollapsibleRootContext } from './CollapsibleRootContext'; import { collapsibleStyleHookMapping } from './styleHooks'; +const NOOP = () => {}; + /** * * Demos: @@ -126,6 +127,7 @@ CollapsibleRoot.propTypes /* remove-proptypes */ = { disabled: PropTypes.bool, /** * Callback fired when the Collapsible is opened or closed. + * @default () => {} */ onOpenChange: PropTypes.func, /** From bcdebd114e88b45c561439a08c9b648862a915b9 Mon Sep 17 00:00:00 2001 From: sai6855 Date: Mon, 2 Dec 2024 10:59:50 +0530 Subject: [PATCH 12/13] prettier --- packages/react/src/collapsible/root/CollapsibleRoot.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/src/collapsible/root/CollapsibleRoot.tsx b/packages/react/src/collapsible/root/CollapsibleRoot.tsx index bd0d06f0ee..0ba22664b8 100644 --- a/packages/react/src/collapsible/root/CollapsibleRoot.tsx +++ b/packages/react/src/collapsible/root/CollapsibleRoot.tsx @@ -127,7 +127,7 @@ CollapsibleRoot.propTypes /* remove-proptypes */ = { disabled: PropTypes.bool, /** * Callback fired when the Collapsible is opened or closed. - * @default () => {} + * @default () => {} */ onOpenChange: PropTypes.func, /** From 1482bbccf0d202e60514507fcf9db7ae0e053142 Mon Sep 17 00:00:00 2001 From: sai6855 Date: Mon, 2 Dec 2024 11:15:17 +0530 Subject: [PATCH 13/13] fix acc item --- docs/reference/generated/collapsible-root.json | 1 + 1 file changed, 1 insertion(+) diff --git a/docs/reference/generated/collapsible-root.json b/docs/reference/generated/collapsible-root.json index 060f5a225d..0957dc5e73 100644 --- a/docs/reference/generated/collapsible-root.json +++ b/docs/reference/generated/collapsible-root.json @@ -23,6 +23,7 @@ }, "onOpenChange": { "type": "(open) => void", + "default": "() => {}", "description": "Callback fired when the Collapsible is opened or closed." }, "open": {