Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[Research] Prop name consistency #2529

Closed
joshblack opened this issue Feb 25, 2019 · 12 comments
Closed

[Research] Prop name consistency #2529

joshblack opened this issue Feb 25, 2019 · 12 comments
Labels
package: react carbon-components-react proposal: accepted This request has gone through triaging and we are accepting PR's against it. role: dev 🤖 type: discussion 💬 version: 11 Issues pertaining to Carbon v11

Comments

@joshblack
Copy link
Contributor

This issue is for investigating our prop naming conventions and determining if we need to update any major discrepancies for Carbon X.

Initial issue: https://github.com/carbon-design-system/carbon-components-react/issues/371
@joshblack
Copy link
Contributor Author

Initial prop data dump:

Components

Accordion

  • children
  • className

AccordionItem

  • children
  • className
  • title
  • renderExpando
  • iconDescription
  • open
  • onClick
  • onHeadingClick

AccordionSkeleton

  • open
  • count
  • uid

Breadcrumb

  • children
  • className
  • noTrailingSlash

BreadcrumbItem

  • children
  • className
  • href

Button

  • children
  • as
  • className
  • disabled
  • small
  • kind
  • href
  • tabIndex
  • type
  • role
  • icon
  • iconDescription

ButtonSkeleton

  • small
  • href

ClickableTile

  • children
  • className
  • href
  • rel

CodeSnippet

  • type
  • className
  • children
  • feedback
  • copyLabel
  • copyButtonDescription
  • onClick
  • ariaLabel
  • showMoreText
  • showLessText
  • light

CodeSnippetSkeleton

  • type
  • className

ComboBox

  • className
  • disabled
  • id
  • initialSelectedItem
  • items
  • itemToString
  • onChange
  • placeholder
  • shouldFilterItem
  • invalid
  • invalidText
  • translateWithId
  • type
  • onInputChange
  • light

ComposedModal

  • className
  • containerClassName
  • onClose
  • onKeyDown
  • open
  • selectorPrimaryFocus

ContentSwitcher

  • children
  • className
  • onChange
  • selectedIndex

Copy

  • children
  • className
  • feedback
  • feedbackTimeout
  • onClick

CopyButton

  • className
  • iconDescription
  • feedback
  • feedbackTimeout
  • onClick

DataTable

  • rows
  • headers
  • sortRow
  • filterRows
  • locale
  • translateWithId
  • short
  • shouldShowBorder
  • radio

DataTableSkeleton

  • rowCount
  • columnCount
  • zebra
  • compact
  • headers

DatePicker

  • children
  • className
  • short
  • light
  • datePickerType
  • iconDescription
  • dateFormat
  • locale
  • value
  • appendTo
  • onChange
  • minDate
  • maxDate

DatePickerInput

  • id
  • iconDescription

DatePickerSkeleton

  • range

Dropdown

  • ariaLabel
  • children
  • className
  • defaultText
  • value
  • tabIndex
  • onClick
  • onChange
  • onOpen
  • onClose
  • selectedText
  • open
  • iconDescription
  • disabled
  • light

DropdownItem

  • value
  • itemText
  • className
  • onClick
  • onKeyPress
  • href
  • selected

DropdownSkeleton

  • inline

DropdownV2

  • disabled
  • items
  • initialSelectedItem
  • itemToString
  • itemToElement
  • onChange
  • label
  • ariaLabel
  • type
  • selectedItem
  • light
  • titleText
  • helperText

ExpandableTile

  • children
  • className
  • expanded
  • tabIndex
  • tileCollapsedIconText
  • tileExpandedIconText

FileUploader

  • iconDescription
  • buttonLabel
  • buttonKind
  • filenameStatus
  • labelDescription
  • labelTitle
  • multiple
  • name
  • onClick
  • className
  • accept

FileUploaderButton

  • className
  • disableLabelChanges
  • id
  • labelText
  • listFiles
  • multiple
  • name
  • onChange
  • onClick
  • role
  • tabIndex
  • buttonKind
  • accept
  • disabled

Filename

  • style
  • status
  • iconDescription

Footer

  • children
  • className
  • labelOne
  • linkTextOne
  • linkHrefOne
  • labelTwo
  • linkTextTwo
  • linkHrefTwo
  • buttonText

Form

  • children
  • className

FormGroup

  • children
  • legendText
  • className
  • invalid
  • message
  • messageText

FormItem

  • children
  • className

FormLabel

  • children
  • className
  • id

Icon

  • className
  • iconTitle
  • description
  • fill
  • fillRule
  • height
  • icon
  • name
  • role
  • style
  • viewBox
  • width
  • iconRef

IconSkeleton

  • style

InlineLoading

  • className
  • success
  • description
  • onSuccess
  • successDelay

InlineNotification

  • children
  • className
  • kind
  • title
  • subtitle
  • role
  • onCloseButtonClick
  • iconDescription
  • notificationType
  • hideCloseButton

Link

  • children
  • className
  • href

ListItem

  • children
  • className

Loading

  • active
  • className
  • withOverlay
  • small

Modal

  • children
  • className
  • passiveModal
  • onRequestClose
  • id
  • modalHeading
  • modalLabel
  • modalAriaLabel
  • secondaryButtonText
  • primaryButtonText
  • open
  • onRequestSubmit
  • onKeyDown
  • iconDescription
  • primaryButtonDisabled
  • onSecondarySubmit
  • danger
  • shouldSubmitOnEnter
  • selectorsFloatingMenus
  • selectorPrimaryFocus

ModalBody

  • className

ModalFooter

  • className
  • primaryClassName
  • primaryButtonText
  • primaryButtonDisabled
  • secondaryClassName
  • secondaryButtonText
  • onRequestClose
  • onRequestSubmit
  • closeModal
  • children

ModalHeader

  • className
  • labelClassName
  • titleClassName
  • closeClassName
  • closeIconClassName
  • label
  • title
  • children
  • iconDescription
  • closeModal
  • buttonOnClick

ModalWrapper

  • status
  • handleOpen
  • children
  • id
  • buttonTriggerText
  • buttonTriggerClassName
  • modalLabel
  • modalHeading
  • modalText
  • passiveModal
  • withHeader
  • modalBeforeContent
  • primaryButtonText
  • secondaryButtonText
  • handleSubmit
  • disabled
  • triggerButtonIcon
  • triggerButtonIconDescription
  • triggerButtonKind
  • shouldCloseAfterSubmit

MultiSelect

  • compareItems
  • sortItems
  • disabled
  • items
  • initialSelectedItems
  • itemToString
  • label
  • locale
  • onChange
  • type
  • useTitleInItem
  • light
  • invalid
  • invalidText
  • translateWithId

Notification

  • children
  • className
  • kind
  • title
  • subtitle
  • caption
  • onCloseButtonClick
  • iconDescription
  • hideCloseButton

NotificationButton

  • className
  • ariaLabel
  • type
  • iconDescription
  • icon
  • name
  • notificationType

NotificationTextDetails

  • children
  • title
  • subtitle
  • caption
  • notificationType

NumberInput

  • className
  • disabled
  • hideLabel
  • iconDescription
  • id
  • label
  • max
  • min
  • onChange
  • onClick
  • step
  • value
  • invalid
  • invalidText
  • helperText
  • light
  • allowEmpty
  • translateWithId

NumberInputSkeleton

  • hideLabel

OrderedList

  • children
  • className
  • nested

OverflowMenu

  • open
  • direction
  • flipped
  • floatingMenu
  • children
  • className
  • tabIndex
  • id
  • ariaLabel
  • onClick
  • onFocus
  • onKeyDown
  • iconDescription
  • icon
  • iconName
  • menuOffset
  • menuOffsetFlip
  • iconClass
  • renderIcon
  • onClose
  • onOpen

OverflowMenuItem

  • className
  • wrapperClassName
  • itemText
  • href
  • hasDivider
  • isDelete
  • disabled
  • onBlur
  • onClick
  • onFocus
  • onKeyDown
  • onKeyUp
  • onMouseDown
  • onMouseEnter
  • onMouseLeave
  • onMouseUp
  • closeMenu
  • primaryFocus
  • floatingMenu
  • requireTitle

Pagination

  • backwardText
  • className
  • itemRangeText
  • forwardText
  • id
  • itemsPerPageText
  • itemText
  • onChange
  • pageNumberText
  • pageRangeText
  • pageText
  • pageSizes
  • totalItems
  • disabled
  • page
  • pageSize
  • pagesUnknown
  • isLastPage
  • pageInputDisabled
  • onChangeInterval
  • defaultPageText
  • defaultItemText

PaginationV2

  • backwardText
  • className
  • itemRangeText
  • forwardText
  • id
  • itemsPerPageText
  • itemsPerPageFollowsText
  • itemText
  • onChange
  • pageNumberText
  • pageRangeText
  • pageText
  • pageSizes
  • totalItems
  • disabled
  • page
  • pageSize
  • pagesUnknown
  • isLastPage
  • pageInputDisabled

ProgressIndicator

  • children
  • className
  • currentIndex

ProgressStep

  • label
  • className
  • current
  • complete
  • description
  • invalid
  • secondaryLabel
  • renderLabel
  • overflowTooltipProps
  • disabled
  • tooltipId

RadioButton

  • checked
  • className
  • defaultChecked
  • disabled
  • id
  • labelText
  • name
  • onClick
  • onChange
  • value

RadioButtonGroup

  • children
  • className
  • defaultSelected
  • name
  • disabled
  • onChange
  • valueSelected

RadioTile

  • checked
  • className
  • defaultChecked
  • id
  • name
  • iconDescription
  • onChange
  • value
  • tabIndex

Search

  • className
  • type
  • small
  • placeHolderText
  • labelText
  • id
  • closeButtonLabelText
  • light

SearchFilterButton

  • labelText
  • iconDescription

SearchLayoutButton

  • format
  • labelText
  • iconDescriptionList
  • iconDescriptionGrid
  • onChangeFormat

SearchSkeleton

  • small

SelectItem

  • value
  • className
  • disabled
  • hidden
  • text

SelectItemGroup

  • children
  • className
  • disabled
  • label

SelectSkeleton

  • hideLabel

SelectableTile

  • children
  • className
  • selected
  • id
  • value
  • name
  • title
  • iconDescription
  • tabIndex

SkeletonPlaceholder

  • className

SkeletonText

  • paragraph
  • lineCount
  • width
  • heading
  • className

Slider

  • className
  • hideTextInput
  • id
  • onChange
  • onRelease
  • value
  • min
  • minLabel
  • max
  • maxLabel
  • formatLabel
  • labelText
  • step
  • stepMuliplier
  • children
  • disabled
  • name
  • inputType
  • ariaLabelInput
  • light

SliderSkeleton

  • hideLabel

StructuredListBody

  • children
  • className
  • head
  • onKeyDown

StructuredListCell

  • children
  • className
  • head
  • noWrap

StructuredListHead

  • children
  • className

StructuredListInput

  • className
  • id
  • value
  • name
  • title
  • defaultChecked
  • onChange

StructuredListRow

  • children
  • className
  • head
  • label
  • tabIndex
  • onKeyDown

StructuredListSkeleton

  • rowCount
  • border

StructuredListWrapper

  • children
  • className
  • border
  • selection
  • ariaLabel

Switch

  • className
  • index
  • kind
  • name
  • onClick
  • onKeyDown
  • selected
  • text
  • icon
  • href

Tab

  • className
  • handleTabClick
  • handleTabAnchorFocus
  • handleTabKeyDown
  • href
  • index
  • label
  • role
  • onClick
  • onKeyDown
  • selected
  • tabIndex
  • renderAnchor

TabContent

  • selected
  • children

Table

  • children
  • className
  • containerClassName

TableBody

  • children
  • className

TableData

  • children
  • className
  • iconClassName
  • iconDescription
  • expanded

TableHead

  • children
  • className

TableHeader

  • children
  • className
  • iconClassName
  • iconDescriptionAscending
  • iconDescriptionDescending
  • sortDir

TableRow

  • header
  • className
  • children
  • even

TableRowExpanded

  • children
  • className
  • colSpan
  • expanded
  • even

Tabs

  • ariaLabel
  • children
  • className
  • hidden
  • role
  • onClick
  • onKeyDown
  • onSelectionChange
  • triggerHref
  • selected
  • iconDescription
  • tabContentClassName

Tag

  • children
  • className
  • type

TextArea

  • className
  • cols
  • defaultValue
  • disabled
  • id
  • labelText
  • onChange
  • onClick
  • placeholder
  • rows
  • value
  • invalid
  • invalidText
  • helperText
  • hideLabel
  • light

TextAreaSkeleton

  • hideLabel

TextInputSkeleton

  • hideLabel

Tile

  • children
  • className

TileAboveTheFoldContent

  • children

TileBelowTheFoldContent

  • children

TileGroup

  • children
  • className
  • defaultSelected
  • name
  • disabled
  • onChange
  • valueSelected

TimePicker

  • children
  • className
  • id
  • labelText
  • onClick
  • onChange
  • onBlur
  • type
  • pattern
  • placeholder
  • maxLength
  • invalid
  • invalidText
  • hideLabel
  • disabled
  • value
  • light

TimePickerSelect

  • children
  • className
  • id
  • inline
  • disabled
  • defaultValue
  • iconDescription
  • hideLabel
  • labelText

ToastNotification

  • children
  • className
  • kind
  • title
  • subtitle
  • role
  • caption
  • onCloseButtonClick
  • iconDescription
  • notificationType
  • hideCloseButton
  • timeout

Toggle

  • className
  • defaultToggled
  • onToggle
  • id
  • toggled
  • labelA
  • labelB

ToggleSmall

  • className
  • defaultToggled
  • onToggle
  • id
  • toggled
  • ariaLabel

Toolbar

  • children
  • className

ToolbarItem

  • children
  • type
  • placeHolderText

ToolbarOption

  • children

ToolbarSearch

  • children
  • className
  • type
  • small
  • iconDescription
  • placeHolderText
  • labelText
  • id

ToolbarTitle

  • title

Tooltip

  • triggerId
  • tooltipId
  • open
  • children
  • className
  • triggerClassName
  • direction
  • menuOffset
  • triggerText
  • renderIcon
  • showIcon
  • icon
  • iconName
  • iconDescription
  • iconTitle
  • clickToOpen
  • tabIndex

TooltipDefinition

  • children
  • direction
  • id
  • tooltipText

TooltipIcon

  • children
  • direction
  • tooltipText

TooltipSimple

  • children
  • className
  • position
  • text
  • showIcon
  • icon
  • iconName
  • iconDescription

UnorderedList

  • children
  • className
  • nested

@joshblack
Copy link
Contributor Author

Frequency

Prop name Frequency
className 84
children 64
iconDescription 25
id 23
disabled 21
onChange 18
onClick 17
type 12
name 12
value 12
light 11
tabIndex 10
labelText 10
title 9
onKeyDown 9
href 9
hideLabel 9
ariaLabel 8
label 8
icon 7
open 7
invalid 7
role 7
selected 6
small 6
invalidText 5
kind 5
direction 4
itemText 4
translateWithId 4
notificationType 4
subtitle 4
locale 3
placeholder 3
caption 3
hideCloseButton 3
head 3
items 3
text 3
primaryButtonText 3
onClose 3
helperText 3
expanded 3
secondaryButtonText 3
itemToString 3
placeHolderText 3
defaultChecked 3
iconName 3
style 3
onCloseButtonClick 3
feedback 3
description 3
forwardText 2
width 2
status 2
accept 2
multiple 2
passiveModal 2
onRequestClose 2
modalHeading 2
modalLabel 2
buttonKind 2
inline 2
onRequestSubmit 2
primaryButtonDisabled 2
onOpen 2
closeModal 2
rowCount 2
short 2
max 2
min 2
step 2
nested 2
headers 2
floatingMenu 2
onFocus 2
rows 2
menuOffset 2
renderIcon 2
onBlur 2
backwardText 2
itemRangeText 2
iconTitle 2
itemsPerPageText 2
pageNumberText 2
pageRangeText 2
pageText 2
pageSizes 2
totalItems 2
page 2
pageSize 2
pagesUnknown 2
isLastPage 2
pageInputDisabled 2
tooltipId 2
checked 2
feedbackTimeout 2
defaultSelected 2
valueSelected 2
selectorPrimaryFocus 2
hidden 2
containerClassName 2
initialSelectedItem 2
border 2
index 2
iconClassName 2
even 2
defaultValue 2
defaultToggled 2
onToggle 2
toggled 2
showIcon 2
tooltipText 2
shouldFilterItem 1
columnCount 1
zebra 1
compact 1
active 1
withOverlay 1
datePickerType 1
dateFormat 1
copyLabel 1
appendTo 1
modalAriaLabel 1
minDate 1
maxDate 1
range 1
defaultText 1
onSecondarySubmit 1
danger 1
shouldSubmitOnEnter 1
selectorsFloatingMenus 1
primaryClassName 1
copyButtonDescription 1
selectedText 1
labelClassName 1
titleClassName 1
closeClassName 1
closeIconClassName 1
buttonOnClick 1
handleOpen 1
buttonTriggerText 1
buttonTriggerClassName 1
modalText 1
withHeader 1
modalBeforeContent 1
handleSubmit 1
triggerButtonIcon 1
triggerButtonIconDescription 1
triggerButtonKind 1
shouldCloseAfterSubmit 1
compareItems 1
sortItems 1
initialSelectedItems 1
useTitleInItem 1
onHeadingClick 1
onKeyPress 1
onInputChange 1
showMoreText 1
itemToElement 1
allowEmpty 1
showLessText 1
selectedItem 1
flipped 1
titleText 1
count 1
uid 1
tileCollapsedIconText 1
menuOffsetFlip 1
iconClass 1
tileExpandedIconText 1
wrapperClassName 1
hasDivider 1
isDelete 1
buttonLabel 1
onKeyUp 1
onMouseDown 1
onMouseEnter 1
onMouseLeave 1
onMouseUp 1
closeMenu 1
primaryFocus 1
requireTitle 1
selectedIndex 1
filenameStatus 1
labelDescription 1
labelTitle 1
noTrailingSlash 1
renderExpando 1
as 1
disableLabelChanges 1
sortRow 1
listFiles 1
filterRows 1
rel 1
labelOne 1
linkTextOne 1
onChangeInterval 1
defaultPageText 1
defaultItemText 1
itemsPerPageFollowsText 1
currentIndex 1
current 1
complete 1
secondaryLabel 1
renderLabel 1
overflowTooltipProps 1
linkHrefOne 1
labelTwo 1
linkTextTwo 1
linkHrefTwo 1
buttonText 1
legendText 1
closeButtonLabelText 1
format 1
iconDescriptionList 1
iconDescriptionGrid 1
onChangeFormat 1
message 1
messageText 1
paragraph 1
lineCount 1
heading 1
hideTextInput 1
onRelease 1
minLabel 1
maxLabel 1
formatLabel 1
stepMuliplier 1
inputType 1
ariaLabelInput 1
position 1
noWrap 1
shouldShowBorder 1
selection 1
fill 1
handleTabClick 1
handleTabAnchorFocus 1
handleTabKeyDown 1
renderAnchor 1
fillRule 1
iconDescriptionAscending 1
iconDescriptionDescending 1
sortDir 1
header 1
height 1
colSpan 1
onSelectionChange 1
triggerHref 1
tabContentClassName 1
cols 1
viewBox 1
pattern 1
maxLength 1
timeout 1
radio 1
iconRef 1
success 1
labelA 1
labelB 1
triggerId 1
triggerClassName 1
triggerText 1
onSuccess 1
clickToOpen 1
successDelay 1
secondaryClassName 1

@stale
Copy link

stale bot commented May 1, 2019

We've marked this issue as stale because there hasn't been any activity for a couple of weeks. If there's no further activity on this issue in the next three days then we'll close it. Thanks for your contributions.

@asudoh
Copy link
Contributor

asudoh commented May 2, 2019

I thought there is a similar issue to this, but completely slipped off my mind. Anyhow ping @emyarod to see if this topic is of his interest.

@carbon-bot carbon-bot transferred this issue from carbon-design-system/carbon-components-react May 9, 2019
@carbon-bot
Copy link
Contributor

Hi there! 👋 If you're wondering why this issue was moved, we're currently updating our repo structure so that every package is found in the same project.

This should not have any impact for you, but we wanted to give you a heads up in case you were wondering what is going on. If you have any questions, feel free to reach out to us on Slack or contact us at: [email protected]. Thanks!

@stale
Copy link

stale bot commented Jun 8, 2019

We've marked this issue as stale because there hasn't been any activity for a couple of weeks. If there's no further activity on this issue in the next three days then we'll close it. You can keep the conversation going with just a short comment. Thanks for your contributions.

@stale stale bot added the status: inactive Will close if there's no further activity within a given time label Jun 8, 2019
@stale
Copy link

stale bot commented Jun 11, 2019

As there's been no activity since this issue was marked as stale, we are auto-closing it.

@stale stale bot closed this as completed Jun 11, 2019
@joshblack joshblack reopened this Jun 14, 2019
@stale stale bot removed the status: inactive Will close if there's no further activity within a given time label Jun 14, 2019
@tw15egan
Copy link
Collaborator

I'd love to get a consistent naming convention across our React components. I know this has been a pain point for our users

@stale
Copy link

stale bot commented Jul 18, 2019

We've marked this issue as stale because there hasn't been any activity for a couple of weeks. If there's no further activity on this issue in the next three days then we'll close it. You can keep the conversation going with just a short comment. Thanks for your contributions.

@stale stale bot added the status: inactive Will close if there's no further activity within a given time label Jul 18, 2019
@joshblack joshblack removed the status: inactive Will close if there's no further activity within a given time label Jul 18, 2019
@stale
Copy link

stale bot commented Aug 17, 2019

We've marked this issue as stale because there hasn't been any activity for a couple of weeks. If there's no further activity on this issue in the next three days then we'll close it. You can keep the conversation going with just a short comment. Thanks for your contributions.

@stale stale bot added the status: inactive Will close if there's no further activity within a given time label Aug 17, 2019
@joshblack joshblack removed the status: inactive Will close if there's no further activity within a given time label Aug 17, 2019
@stale
Copy link

stale bot commented Sep 16, 2019

We've marked this issue as stale because there hasn't been any activity for a couple of weeks. If there's no further activity on this issue in the next three days then we'll close it. You can keep the conversation going with just a short comment. Thanks for your contributions.

@stale stale bot added the status: inactive Will close if there's no further activity within a given time label Sep 16, 2019
@joshblack joshblack removed the status: inactive Will close if there's no further activity within a given time label Sep 16, 2019
@stale
Copy link

stale bot commented Oct 16, 2019

We've marked this issue as stale because there hasn't been any activity for a couple of weeks. If there's no further activity on this issue in the next three days then we'll close it. You can keep the conversation going with just a short comment. Thanks for your contributions.

@stale stale bot added the status: inactive Will close if there's no further activity within a given time label Oct 16, 2019
@joshblack joshblack added version: 11 Issues pertaining to Carbon v11 and removed status: inactive Will close if there's no further activity within a given time labels Oct 16, 2019
@mattrosno mattrosno added squad: system proposal: open This request has gone through triaging. We're determining whether we take this on or not. labels Dec 17, 2019
@designertyler designertyler added proposal: accepted This request has gone through triaging and we are accepting PR's against it. and removed proposal: open This request has gone through triaging. We're determining whether we take this on or not. labels Mar 6, 2020
@emyarod emyarod mentioned this issue Apr 14, 2020
Closed
2 tasks
@joshblack joshblack mentioned this issue Aug 30, 2021
Closed
20 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
package: react carbon-components-react proposal: accepted This request has gone through triaging and we are accepting PR's against it. role: dev 🤖 type: discussion 💬 version: 11 Issues pertaining to Carbon v11
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
6 participants
@asudoh @mattrosno @joshblack @tw15egan @designertyler @carbon-bot