Skip to content
This repository was archived by the owner on Mar 4, 2020. It is now read-only.

RFC: drop content prop #2205

Closed
wants to merge 1 commit into from
Closed

RFC: drop content prop #2205

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
17 changes: 5 additions & 12 deletions packages/react/src/components/Header/Header.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,8 +8,6 @@ import {
createShorthandFactory,
UIComponent,
UIComponentProps,
ChildrenComponentProps,
ContentComponentProps,
commonPropTypes,
ColorComponentProps,
rtlTextContainer,
Expand All @@ -24,11 +22,7 @@ export interface HeaderSlotClassNames {
description: string
}

export interface HeaderProps
extends UIComponentProps,
ChildrenComponentProps,
ContentComponentProps,
ColorComponentProps {
export interface HeaderProps extends UIComponentProps, ColorComponentProps {
/**
* Accessibility behavior if overridden by the user.
*/
Expand Down Expand Up @@ -66,22 +60,21 @@ class Header extends UIComponent<WithAsProp<HeaderProps>, any> {
static Description = HeaderDescription

renderComponent({ accessibility, ElementType, classes, variables: v, unhandledProps }) {
const { children, description, content } = this.props
const { children, description } = this.props

const hasChildren = childrenExist(children)
const contentElement = childrenExist(children) ? children : content

return (
<ElementType
{...rtlTextContainer.getAttributes({
forElements: [children, content],
forElements: [children],
condition: !description,
})}
{...accessibility.attributes.root}
{...unhandledProps}
className={classes.root}
>
{rtlTextContainer.createFor({ element: contentElement, condition: !!description })}
{rtlTextContainer.createFor({ element: children, condition: !!description })}
{!hasChildren &&
HeaderDescription.create(description, {
defaultProps: () => ({
Expand All @@ -96,7 +89,7 @@ class Header extends UIComponent<WithAsProp<HeaderProps>, any> {
}
}

Header.create = createShorthandFactory({ Component: Header, mappedProp: 'content' })
Header.create = createShorthandFactory({ Component: Header, mappedProp: 'children' })

/**
* A Header organises the content by declaring a content's topic.
Expand Down
18 changes: 6 additions & 12 deletions packages/react/src/components/Header/HeaderDescription.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,12 +2,9 @@ import { Accessibility } from '@fluentui/accessibility'
import * as React from 'react'

import {
childrenExist,
createShorthandFactory,
UIComponent,
UIComponentProps,
ChildrenComponentProps,
ContentComponentProps,
commonPropTypes,
ColorComponentProps,
rtlTextContainer,
Expand All @@ -16,11 +13,7 @@ import {

import { WithAsProp, withSafeTypeForAs } from '../../types'

export interface HeaderDescriptionProps
extends UIComponentProps,
ChildrenComponentProps,
ContentComponentProps,
ColorComponentProps {
export interface HeaderDescriptionProps extends UIComponentProps, ColorComponentProps {
/**
* Accessibility behavior if overridden by the user.
*/
Expand All @@ -43,23 +36,24 @@ class HeaderDescription extends UIComponent<WithAsProp<HeaderDescriptionProps>,
}

renderComponent({ accessibility, ElementType, classes, unhandledProps }) {
const { children, content } = this.props
const { children } = this.props

return (
<ElementType
{...rtlTextContainer.getAttributes({ forElements: [children, content] })}
{...rtlTextContainer.getAttributes({ forElements: [children] })}
{...accessibility.attributes.root}
{...unhandledProps}
className={classes.root}
>
{childrenExist(children) ? children : content}
{children}
</ElementType>
)
}
}

HeaderDescription.create = createShorthandFactory({
Component: HeaderDescription,
mappedProp: 'content',
mappedProp: 'children',
})

/**
Expand Down
5 changes: 0 additions & 5 deletions packages/react/src/utils/commonPropTypes.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,6 @@ export const createCommon = (config: CreateCommonConfig = {}) => {
children = 'node',
className = true,
color = false,
content = 'node',
styled = true,
} = config
return {
Expand All @@ -42,10 +41,6 @@ export const createCommon = (config: CreateCommonConfig = {}) => {
...(color && {
color: PropTypes.string,
}),
...(content && {
content:
content === 'shorthand' ? customPropTypes.itemShorthand : customPropTypes.nodeContent,
}),
...(styled && {
styles: PropTypes.oneOfType([PropTypes.object, PropTypes.func]),
variables: PropTypes.oneOfType([PropTypes.object, PropTypes.func]),
Expand Down