Carbon: [Research] Prop name consistency
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
All 12 comments
Initial prop data dump:
Components
Accordion
childrenclassName
AccordionItem
childrenclassNametitlerenderExpandoiconDescriptionopenonClickonHeadingClick
AccordionSkeleton
opencountuid
Breadcrumb
childrenclassNamenoTrailingSlash
BreadcrumbItem
childrenclassNamehref
Button
childrenasclassNamedisabledsmallkindhreftabIndextyperoleiconiconDescription
ButtonSkeleton
smallhref
ClickableTile
childrenclassNamehrefrel
CodeSnippet
typeclassNamechildrenfeedbackcopyLabelcopyButtonDescriptiononClickariaLabelshowMoreTextshowLessTextlight
CodeSnippetSkeleton
typeclassName
ComboBox
classNamedisabledidinitialSelectedItemitemsitemToStringonChangeplaceholdershouldFilterIteminvalidinvalidTexttranslateWithIdtypeonInputChangelight
ComposedModal
classNamecontainerClassNameonCloseonKeyDownopenselectorPrimaryFocus
ContentSwitcher
childrenclassNameonChangeselectedIndex
Copy
childrenclassNamefeedbackfeedbackTimeoutonClick
CopyButton
classNameiconDescriptionfeedbackfeedbackTimeoutonClick
DataTable
rowsheaderssortRowfilterRowslocaletranslateWithIdshortshouldShowBorderradio
DataTableSkeleton
rowCountcolumnCountzebracompactheaders
DatePicker
childrenclassNameshortlightdatePickerTypeiconDescriptiondateFormatlocalevalueappendToonChangeminDatemaxDate
DatePickerInput
idiconDescription
DatePickerSkeleton
range
Dropdown
ariaLabelchildrenclassNamedefaultTextvaluetabIndexonClickonChangeonOpenonCloseselectedTextopeniconDescriptiondisabledlight
DropdownItem
valueitemTextclassNameonClickonKeyPresshrefselected
DropdownSkeleton
inline
DropdownV2
disableditemsinitialSelectedItemitemToStringitemToElementonChangelabelariaLabeltypeselectedItemlighttitleTexthelperText
ExpandableTile
childrenclassNameexpandedtabIndextileCollapsedIconTexttileExpandedIconText
FileUploader
iconDescriptionbuttonLabelbuttonKindfilenameStatuslabelDescriptionlabelTitlemultiplenameonClickclassNameaccept
FileUploaderButton
classNamedisableLabelChangesidlabelTextlistFilesmultiplenameonChangeonClickroletabIndexbuttonKindacceptdisabled
Filename
stylestatusiconDescription
Footer
childrenclassNamelabelOnelinkTextOnelinkHrefOnelabelTwolinkTextTwolinkHrefTwobuttonText
Form
childrenclassName
FormGroup
childrenlegendTextclassNameinvalidmessagemessageText
FormItem
childrenclassName
FormLabel
childrenclassNameid
Icon
classNameiconTitledescriptionfillfillRuleheighticonnamerolestyleviewBoxwidthiconRef
IconSkeleton
style
InlineLoading
classNamesuccessdescriptiononSuccesssuccessDelay
InlineNotification
childrenclassNamekindtitlesubtitleroleonCloseButtonClickiconDescriptionnotificationTypehideCloseButton
Link
childrenclassNamehref
ListItem
childrenclassName
Loading
activeclassNamewithOverlaysmall
Modal
childrenclassNamepassiveModalonRequestCloseidmodalHeadingmodalLabelmodalAriaLabelsecondaryButtonTextprimaryButtonTextopenonRequestSubmitonKeyDowniconDescriptionprimaryButtonDisabledonSecondarySubmitdangershouldSubmitOnEnterselectorsFloatingMenusselectorPrimaryFocus
ModalBody
className
ModalFooter
classNameprimaryClassNameprimaryButtonTextprimaryButtonDisabledsecondaryClassNamesecondaryButtonTextonRequestCloseonRequestSubmitcloseModalchildren
ModalHeader
classNamelabelClassNametitleClassNamecloseClassNamecloseIconClassNamelabeltitlechildreniconDescriptioncloseModalbuttonOnClick
ModalWrapper
statushandleOpenchildrenidbuttonTriggerTextbuttonTriggerClassNamemodalLabelmodalHeadingmodalTextpassiveModalwithHeadermodalBeforeContentprimaryButtonTextsecondaryButtonTexthandleSubmitdisabledtriggerButtonIcontriggerButtonIconDescriptiontriggerButtonKindshouldCloseAfterSubmit
MultiSelect
compareItemssortItemsdisableditemsinitialSelectedItemsitemToStringlabellocaleonChangetypeuseTitleInItemlightinvalidinvalidTexttranslateWithId
Notification
childrenclassNamekindtitlesubtitlecaptiononCloseButtonClickiconDescriptionhideCloseButton
NotificationButton
classNameariaLabeltypeiconDescriptioniconnamenotificationType
NotificationTextDetails
childrentitlesubtitlecaptionnotificationType
NumberInput
classNamedisabledhideLabeliconDescriptionidlabelmaxminonChangeonClickstepvalueinvalidinvalidTexthelperTextlightallowEmptytranslateWithId
NumberInputSkeleton
hideLabel
OrderedList
childrenclassNamenested
OverflowMenu
opendirectionflippedfloatingMenuchildrenclassNametabIndexidariaLabelonClickonFocusonKeyDowniconDescriptioniconiconNamemenuOffsetmenuOffsetFlipiconClassrenderIcononCloseonOpen
OverflowMenuItem
classNamewrapperClassNameitemTexthrefhasDividerisDeletedisabledonBluronClickonFocusonKeyDownonKeyUponMouseDownonMouseEnteronMouseLeaveonMouseUpcloseMenuprimaryFocusfloatingMenurequireTitle
Pagination
backwardTextclassNameitemRangeTextforwardTextiditemsPerPageTextitemTextonChangepageNumberTextpageRangeTextpageTextpageSizestotalItemsdisabledpagepageSizepagesUnknownisLastPagepageInputDisabledonChangeIntervaldefaultPageTextdefaultItemText
PaginationV2
backwardTextclassNameitemRangeTextforwardTextiditemsPerPageTextitemsPerPageFollowsTextitemTextonChangepageNumberTextpageRangeTextpageTextpageSizestotalItemsdisabledpagepageSizepagesUnknownisLastPagepageInputDisabled
ProgressIndicator
childrenclassNamecurrentIndex
ProgressStep
labelclassNamecurrentcompletedescriptioninvalidsecondaryLabelrenderLabeloverflowTooltipPropsdisabledtooltipId
RadioButton
checkedclassNamedefaultCheckeddisabledidlabelTextnameonClickonChangevalue
RadioButtonGroup
childrenclassNamedefaultSelectednamedisabledonChangevalueSelected
RadioTile
checkedclassNamedefaultCheckedidnameiconDescriptiononChangevaluetabIndex
Search
classNametypesmallplaceHolderTextlabelTextidcloseButtonLabelTextlight
SearchFilterButton
labelTexticonDescription
SearchLayoutButton
formatlabelTexticonDescriptionListiconDescriptionGridonChangeFormat
SearchSkeleton
small
SelectItem
valueclassNamedisabledhiddentext
SelectItemGroup
childrenclassNamedisabledlabel
SelectSkeleton
hideLabel
SelectableTile
childrenclassNameselectedidvaluenametitleiconDescriptiontabIndex
SkeletonPlaceholder
className
SkeletonText
paragraphlineCountwidthheadingclassName
Slider
classNamehideTextInputidonChangeonReleasevalueminminLabelmaxmaxLabelformatLabellabelTextstepstepMuliplierchildrendisablednameinputTypeariaLabelInputlight
SliderSkeleton
hideLabel
StructuredListBody
childrenclassNameheadonKeyDown
StructuredListCell
childrenclassNameheadnoWrap
StructuredListHead
childrenclassName
StructuredListInput
classNameidvaluenametitledefaultCheckedonChange
StructuredListRow
childrenclassNameheadlabeltabIndexonKeyDown
StructuredListSkeleton
rowCountborder
StructuredListWrapper
childrenclassNameborderselectionariaLabel
Switch
classNameindexkindnameonClickonKeyDownselectedtexticonhref
Tab
classNamehandleTabClickhandleTabAnchorFocushandleTabKeyDownhrefindexlabelroleonClickonKeyDownselectedtabIndexrenderAnchor
TabContent
selectedchildren
Table
childrenclassNamecontainerClassName
TableBody
childrenclassName
TableData
childrenclassNameiconClassNameiconDescriptionexpanded
TableHead
childrenclassName
TableHeader
childrenclassNameiconClassNameiconDescriptionAscendingiconDescriptionDescendingsortDir
TableRow
headerclassNamechildreneven
TableRowExpanded
childrenclassNamecolSpanexpandedeven
Tabs
ariaLabelchildrenclassNamehiddenroleonClickonKeyDownonSelectionChangetriggerHrefselectediconDescriptiontabContentClassName
Tag
childrenclassNametype
TextArea
classNamecolsdefaultValuedisabledidlabelTextonChangeonClickplaceholderrowsvalueinvalidinvalidTexthelperTexthideLabellight
TextAreaSkeleton
hideLabel
TextInputSkeleton
hideLabel
Tile
childrenclassName
TileAboveTheFoldContent
children
TileBelowTheFoldContent
children
TileGroup
childrenclassNamedefaultSelectednamedisabledonChangevalueSelected
TimePicker
childrenclassNameidlabelTextonClickonChangeonBlurtypepatternplaceholdermaxLengthinvalidinvalidTexthideLabeldisabledvaluelight
TimePickerSelect
childrenclassNameidinlinedisableddefaultValueiconDescriptionhideLabellabelText
ToastNotification
childrenclassNamekindtitlesubtitlerolecaptiononCloseButtonClickiconDescriptionnotificationTypehideCloseButtontimeout
Toggle
classNamedefaultToggledonToggleidtoggledlabelAlabelB
ToggleSmall
classNamedefaultToggledonToggleidtoggledariaLabel
Toolbar
childrenclassName
ToolbarItem
childrentypeplaceHolderText
ToolbarOption
children
ToolbarSearch
childrenclassNametypesmalliconDescriptionplaceHolderTextlabelTextid
ToolbarTitle
title
Tooltip
triggerIdtooltipIdopenchildrenclassNametriggerClassNamedirectionmenuOffsettriggerTextrenderIconshowIconiconiconNameiconDescriptioniconTitleclickToOpentabIndex
TooltipDefinition
childrendirectionidtooltipText
TooltipIcon
childrendirectiontooltipText
TooltipSimple
childrenclassNamepositiontextshowIconiconiconNameiconDescription
UnorderedList
childrenclassNamenested
joshblack
on 25 Feb 2019
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 |
joshblack
on 25 Feb 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.
![stale[bot] picture](https://avatars3.githubusercontent.com/in/1724?v=4&s=40)
stale[bot]
on 1 May 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.
asudoh
on 2 May 2019
Hi there! :wave: 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!
carbon-bot
on 9 May 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[bot]
on 8 Jun 2019
As there's been no activity since this issue was marked as stale, we are auto-closing it.
stale[bot]
on 11 Jun 2019
I'd love to get a consistent naming convention across our React components. I know this has been a pain point for our users
tw15egan
on 18 Jun 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[bot]
on 18 Jul 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[bot]
on 17 Aug 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[bot]
on 16 Sep 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[bot]
on 16 Oct 2019
Related issues
JordanWSmith15
路
3Comments
ConradSchmidt
路
3Comments
ajdaniel
路
3Comments
mouadcherkaoui
路
3Comments
PatrickDuncan
路
3Comments
Most helpful comment
I'd love to get a consistent naming convention across our React components. I know this has been a pain point for our users