CoreUI is an MIT-licensed open source project and is completely free to use. However, the amount of effort needed to maintain and develop new features for the project is not sustainable without proper financial backing.
You can support our Open Source software development in the following ways:
Track and review changes to the CoreUI for React.js components to help you migrate from v3 to v4.
CoreUI for React is the React.js version of CoreUI components library, so before read this migration guide, please check also CoreUI 3 to 4 migration guide.
innerRef
.fade
.onShowChange
.closeButton
, use dismissible
instead of.show
, use visible
instead of.innerRef
.tag
, use component
instead of.innerRef
.innerRef
.block
.innerRef
.pressed
.tag
, use component
instead of.innerRef
.innerRef
.accentColor
, use utilities className="border-top-{#color} border-top-3"
instead of.innerRef
.innerRef
.columns
.deck
.innerRef
.innerRef
.tag
, use component
instead of.CCardImg
variant
, use orientation
instead of.CCardImgOverlay
innerRef
.tag
.innerRef
.tag
, use component
instead of.innerRef
.tag
, use component
instead of.innerRef
.tag
, use component
instead of.autoSlide
.innerRef
.activeIndex
, use index
instead of.<CCarousel controls>
instead of.<CCarousel indicators>
instead of.innerRef
.navbar
.show
, use visible
instead of.innerRef
.inNav
, use variant="nav-item"
instead of.tag
, use component
instead of.color
.divider
.innerRef
.header
.onClick
.tag
, use component
instead of.innerRef
.modifiers
.placement
, use <CDropdown placement="...">
instead of.show
, use <CDropdown visible>
instead of.innerRef
.tag
, use component
instead of.withSubheader
.CHeaderNavItem
, use CNavItem
instead of.CHeaderNavLink
, use CNavLink
instead of.CImage
block
.innerRef
.fluidGrow
.placeholderColor
.shape
.tag
.accent
.horizontal
, use layout
instead of.innerRef
.tag
, use component
instead of.accent
.action
, use property component="a"
or component="button"
instead of.innerRef
.tag
, use component
instead of.addContentClass
.borderColor
, use utilities className="border border-{#color}"
instead of.centered
.closeOnBackdrop
.fade
, use transition
instead of.innerRef
.onClosed
.onOpened
.show
, use visible
instead of.innerRef
.tag
.innerRef
.tag
.innerRef
.tag
.inCard
.innerRef
.fill
, use layout="fill"
instead of.justified
, use layout="justified"
instead of.tag
, use component
instead of.innerRef
.tag
, use component
instead of.innerRef
.expandable
, use expand
instead of.fixed
, use placement="fixed-top"
instead of.innerRef
.light
, use colorScheme="light"
instead of.sticky
, use placement="sticky-top"
instead of.tag
, use component
instead of.innerRef
.tag
, use component
instead of.innerRef
.tag
, use component
instead of.CPagination
and to CSmartPagination
components.header
, use title
instead of.innerRef
.max
.precision
.showPercentage
.showValue
.size
, use height
instead of.striped
, use variant="striped"
instead of.innerRef
.max
.precision
.showPercentage
.showValue
.size
, use height
instead of.striped
, use variant="striped"
instead of.minimize
use narrow
instead of.dropdownMode
.CSidebarForm
, use CForm
instead of.CSidebarNavDivider
, use CNavDivider
instead of.CSidebarNavDropdown
, use CNavGroup
instead of.CSidebarNavLink
, use CNavLink
instead of.CSidebarNavItem
, use CNavItem
instead of.CSidebarNavTitile
, use CNavTitle
instead of.CFormSwitch
instead of.innerRef
.grow
, use variant="grow"
instead of.tag
, use component
instead of.<CNav variant="tabs" role="tablist">
instead ofinnerRef
.fade
.active
, use visible
instead of.innerRef
.innerRef
.fade
, use animation
instead of.show
, use visible
instead of.onStateChange
.innerRef
.innerRef
.interactive
.advancedOptions
.CFormInput
plaintext
, use plainText
instead of.<CFormCheck>
instead of.<CFormInput type="file">
instead of.<CFormCheck type="radio">
instead of.innerRef
.CInputGroupText
instead of.<CFormSelect>
instead of.<CFormFeedback valid>
instead of.<CCFormFeedback invalid>
instead of.tag
.innerRef
.tag
.width
, use xs
, sm
, md
, lg
, xl
, xxl
.alignHorizontal
.alignVertical
.form
.gutters
.tag
.width
, use xs
, sm
, md
, lg
, xl
, xxl
.