From 0476b666e4127f7de73371a16d85c6a072bc7383 Mon Sep 17 00:00:00 2001 From: sai chand <60743144+sai6855@users.noreply.github.com> Date: Fri, 28 Apr 2023 17:04:41 +0530 Subject: [PATCH] [TabsList] Drop component prop (#37042) --- docs/pages/base/api/tabs-list.json | 1 - .../api-docs-base/tabs-list/tabs-list.json | 1 - packages/mui-base/src/TabsList/TabsList.spec.tsx | 16 ++++++++++------ packages/mui-base/src/TabsList/TabsList.test.tsx | 1 + packages/mui-base/src/TabsList/TabsList.tsx | 14 ++++---------- packages/mui-base/src/TabsList/TabsList.types.ts | 8 +++----- 6 files changed, 18 insertions(+), 23 deletions(-) diff --git a/docs/pages/base/api/tabs-list.json b/docs/pages/base/api/tabs-list.json index e888c35fb22d1b..44664ef547e1de 100644 --- a/docs/pages/base/api/tabs-list.json +++ b/docs/pages/base/api/tabs-list.json @@ -1,7 +1,6 @@ { "props": { "children": { "type": { "name": "node" } }, - "component": { "type": { "name": "elementType" } }, "slotProps": { "type": { "name": "shape", "description": "{ root?: func
| object }" }, "default": "{}" diff --git a/docs/translations/api-docs-base/tabs-list/tabs-list.json b/docs/translations/api-docs-base/tabs-list/tabs-list.json index 0067df3d304aa5..9d459303149ef5 100644 --- a/docs/translations/api-docs-base/tabs-list/tabs-list.json +++ b/docs/translations/api-docs-base/tabs-list/tabs-list.json @@ -2,7 +2,6 @@ "componentDescription": "", "propDescriptions": { "children": "The content of the component.", - "component": "The component used for the root node. Either a string to use a HTML element or a component.", "slotProps": "The props used for each slot inside the TabsList.", "slots": "The components used for each slot inside the TabsList. Either a string to use a HTML element or a component. See Slots API below for more details." }, diff --git a/packages/mui-base/src/TabsList/TabsList.spec.tsx b/packages/mui-base/src/TabsList/TabsList.spec.tsx index fed31f225b8814..665323c1571114 100644 --- a/packages/mui-base/src/TabsList/TabsList.spec.tsx +++ b/packages/mui-base/src/TabsList/TabsList.spec.tsx @@ -20,19 +20,23 @@ const polymorphicComponentTest = () => { {/* @ts-expect-error */} - + slots={{ root: 'a' }} href="#" /> - + + slots={{ root: CustomComponent }} + stringProp="test" + numberProp={0} + /> {/* @ts-expect-error */} - + slots={{ root: CustomComponent }} /> - + slots={{ root: 'button' }} onClick={(e: React.MouseEvent) => e.currentTarget.checkValidity()} /> - component="button" + slots={{ root: 'button' }} ref={(elem) => { expectType(elem); }} diff --git a/packages/mui-base/src/TabsList/TabsList.test.tsx b/packages/mui-base/src/TabsList/TabsList.test.tsx index d004e1b04601a3..858ac44140b579 100644 --- a/packages/mui-base/src/TabsList/TabsList.test.tsx +++ b/packages/mui-base/src/TabsList/TabsList.test.tsx @@ -52,6 +52,7 @@ describe('', () => { }, skip: [ 'reactTestRenderer', // Need to be wrapped with TabsContext + 'componentProp', ], })); }); diff --git a/packages/mui-base/src/TabsList/TabsList.tsx b/packages/mui-base/src/TabsList/TabsList.tsx index b49e0b7eb63d41..2fc5a8fed7f8b9 100644 --- a/packages/mui-base/src/TabsList/TabsList.tsx +++ b/packages/mui-base/src/TabsList/TabsList.tsx @@ -1,8 +1,7 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import { OverridableComponent } from '@mui/types'; import composeClasses from '../composeClasses'; -import { useSlotProps, WithOptionalOwnerState } from '../utils'; +import { PolymorphicComponent, useSlotProps, WithOptionalOwnerState } from '../utils'; import { getTabsListUtilityClass } from './tabsListClasses'; import { TabsListOwnerState, @@ -38,7 +37,7 @@ const TabsList = React.forwardRef(function TabsList, forwardedRef: React.ForwardedRef, ) { - const { children, component, slotProps = {}, slots = {}, ...other } = props; + const { children, slotProps = {}, slots = {}, ...other } = props; const { isRtl, orientation, getRootProps, contextValue } = useTabsList({ rootRef: forwardedRef, @@ -52,7 +51,7 @@ const TabsList = React.forwardRef(function TabsList = useSlotProps({ elementType: TabsListRoot, getSlotProps: getRootProps, @@ -67,7 +66,7 @@ const TabsList = React.forwardRef(function TabsList{children} ); -}) as OverridableComponent; +}) as PolymorphicComponent; TabsList.propTypes /* remove-proptypes */ = { // ----------------------------- Warning -------------------------------- @@ -78,11 +77,6 @@ TabsList.propTypes /* remove-proptypes */ = { * The content of the component. */ children: PropTypes.node, - /** - * The component used for the root node. - * Either a string to use a HTML element or a component. - */ - component: PropTypes.elementType, /** * The props used for each slot inside the TabsList. * @default {} diff --git a/packages/mui-base/src/TabsList/TabsList.types.ts b/packages/mui-base/src/TabsList/TabsList.types.ts index 8b1e4a4475b67b..f96d9695ee312e 100644 --- a/packages/mui-base/src/TabsList/TabsList.types.ts +++ b/packages/mui-base/src/TabsList/TabsList.types.ts @@ -1,7 +1,7 @@ import * as React from 'react'; -import { OverrideProps, Simplify } from '@mui/types'; +import { Simplify } from '@mui/types'; import { UseTabsListRootSlotProps } from '../useTabsList'; -import { SlotComponentProps } from '../utils'; +import { PolymorphicProps, SlotComponentProps } from '../utils'; export interface TabsListRootSlotPropsOverrides {} @@ -44,9 +44,7 @@ export interface TabsListTypeMap< export type TabsListProps< RootComponentType extends React.ElementType = TabsListTypeMap['defaultComponent'], -> = OverrideProps, RootComponentType> & { - component?: RootComponentType; -}; +> = PolymorphicProps, RootComponentType>; export type TabsListOwnerState = Simplify< TabsListOwnProps & {