From 078030b7dcf4391c8d5db61aa0ec46d5f66eea94 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Korhan=20=C3=96ZBEK?= Date: Sun, 8 Jan 2023 22:46:08 +0300 Subject: [PATCH 001/452] feat: add backdrop static option support --- .../src/components/offcanvas/COffcanvas.tsx | 13 +++++++++---- 1 file changed, 9 insertions(+), 4 deletions(-) diff --git a/packages/coreui-react/src/components/offcanvas/COffcanvas.tsx b/packages/coreui-react/src/components/offcanvas/COffcanvas.tsx index a504903b..d1598751 100644 --- a/packages/coreui-react/src/components/offcanvas/COffcanvas.tsx +++ b/packages/coreui-react/src/components/offcanvas/COffcanvas.tsx @@ -11,7 +11,7 @@ export interface COffcanvasProps extends HTMLAttributes { /** * Apply a backdrop on body while offcanvas is open. */ - backdrop?: boolean + backdrop?: boolean | string /** * A string of all className you want applied to the base component. */ @@ -105,6 +105,11 @@ export const COffcanvas = forwardRef( const handleDismiss = () => { setVisible(false) } + const handleBackdropDismiss = () => { + if (backdrop !== 'static') { + setVisible(false) + } + } const handleKeyDown = useCallback( (event: React.KeyboardEvent) => { @@ -154,7 +159,7 @@ export const COffcanvas = forwardRef( createPortal( , document.body, @@ -162,7 +167,7 @@ export const COffcanvas = forwardRef( : backdrop && ( )} @@ -172,7 +177,7 @@ export const COffcanvas = forwardRef( ) COffcanvas.propTypes = { - backdrop: PropTypes.bool, + backdrop: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]), children: PropTypes.node, className: PropTypes.string, keyboard: PropTypes.bool, From 164469704fba5efe6918f2cba7c796754234ef1f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=81ukasz=20Holeczek?= Date: Wed, 18 Jan 2023 16:27:16 +0100 Subject: [PATCH 002/452] refactor: remove duplicated code --- .../components/form/CFormControlWrapper.tsx | 34 ++++++++----------- 1 file changed, 14 insertions(+), 20 deletions(-) diff --git a/packages/coreui-react/src/components/form/CFormControlWrapper.tsx b/packages/coreui-react/src/components/form/CFormControlWrapper.tsx index c74fba26..f26456a5 100644 --- a/packages/coreui-react/src/components/form/CFormControlWrapper.tsx +++ b/packages/coreui-react/src/components/form/CFormControlWrapper.tsx @@ -57,37 +57,31 @@ export const CFormControlWrapper: FC = ({ tooltipFeedback, valid, }) => { + const formControlValidation = () => ( + + ) return floatingLabel ? ( {children} {label || floatingLabel} {text && {text}} - + {formControlValidation()} ) : ( <> {label && {label}} {children} {text && {text}} - + {formControlValidation()} ) } From 207b60058d94e5202ea83901614a1bd3a1287d0a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=81ukasz=20Holeczek?= Date: Wed, 18 Jan 2023 21:25:21 +0100 Subject: [PATCH 003/452] fix: change wrong class name --- .../coreui-react/src/components/accordion/CAccordionBody.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/coreui-react/src/components/accordion/CAccordionBody.tsx b/packages/coreui-react/src/components/accordion/CAccordionBody.tsx index 4e224adb..5299ad16 100644 --- a/packages/coreui-react/src/components/accordion/CAccordionBody.tsx +++ b/packages/coreui-react/src/components/accordion/CAccordionBody.tsx @@ -18,7 +18,7 @@ export const CAccordionBody = forwardRef( const _className = classNames('accordion-body', className) return ( - +
{children}
From 481cb1d200b666efa3db4061081be14b030432ef Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=81ukasz=20Holeczek?= Date: Thu, 19 Jan 2023 19:17:53 +0100 Subject: [PATCH 004/452] refactor(CTable): change default value of `items` property --- packages/coreui-react/src/components/table/CTable.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/coreui-react/src/components/table/CTable.tsx b/packages/coreui-react/src/components/table/CTable.tsx index 822dddb8..0fb870a1 100644 --- a/packages/coreui-react/src/components/table/CTable.tsx +++ b/packages/coreui-react/src/components/table/CTable.tsx @@ -155,7 +155,7 @@ export const CTable = forwardRef( columns, footer, hover, - items = [], + items, responsive, small, striped, @@ -188,7 +188,7 @@ export const CTable = forwardRef( if (typeof column === 'object') return column.key else return column }) - : Object.keys(items[0] || {}).filter((el) => el.charAt(0) !== '_') + : Object.keys((items && items[0]) || {}).filter((el) => el.charAt(0) !== '_') const pretifyName = (name: string) => { return name From 30c10017d4431588961e55c0aa6c63d7e0a524b0 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=81ukasz=20Holeczek?= Date: Thu, 19 Jan 2023 20:32:36 +0100 Subject: [PATCH 005/452] docs: move content to another folder --- packages/docs/build/api.js | 3 +-- .../docs/content/{4.5 => }/api/CAccordion.api.mdx | 0 .../content/{4.5 => }/api/CAccordionBody.api.mdx | 0 .../content/{4.5 => }/api/CAccordionButton.api.mdx | 0 .../{4.5 => }/api/CAccordionCollapse.api.mdx | 0 .../content/{4.5 => }/api/CAccordionHeader.api.mdx | 0 .../content/{4.5 => }/api/CAccordionItem.api.mdx | 0 packages/docs/content/{4.5 => }/api/CAlert.api.mdx | 0 .../content/{4.5 => }/api/CAlertHeading.api.mdx | 0 .../docs/content/{4.5 => }/api/CAlertLink.api.mdx | 0 packages/docs/content/{4.5 => }/api/CAvatar.api.mdx | 0 .../docs/content/{4.5 => }/api/CBackdrop.api.mdx | 0 packages/docs/content/{4.5 => }/api/CBadge.api.mdx | 0 .../docs/content/{4.5 => }/api/CBreadcrumb.api.mdx | 0 .../content/{4.5 => }/api/CBreadcrumbItem.api.mdx | 0 packages/docs/content/{4.5 => }/api/CButton.api.mdx | 0 .../docs/content/{4.5 => }/api/CButtonGroup.api.mdx | 0 .../content/{4.5 => }/api/CButtonToolbar.api.mdx | 0 .../docs/content/{4.5 => }/api/CCallout.api.mdx | 0 packages/docs/content/{4.5 => }/api/CCard.api.mdx | 0 .../docs/content/{4.5 => }/api/CCardBody.api.mdx | 0 .../docs/content/{4.5 => }/api/CCardFooter.api.mdx | 0 .../docs/content/{4.5 => }/api/CCardGroup.api.mdx | 0 .../docs/content/{4.5 => }/api/CCardHeader.api.mdx | 0 .../docs/content/{4.5 => }/api/CCardImage.api.mdx | 0 .../content/{4.5 => }/api/CCardImageOverlay.api.mdx | 0 .../docs/content/{4.5 => }/api/CCardLink.api.mdx | 0 .../content/{4.5 => }/api/CCardSubtitle.api.mdx | 0 .../docs/content/{4.5 => }/api/CCardText.api.mdx | 0 .../docs/content/{4.5 => }/api/CCardTitle.api.mdx | 0 .../docs/content/{4.5 => }/api/CCarousel.api.mdx | 0 .../content/{4.5 => }/api/CCarouselCaption.api.mdx | 0 .../content/{4.5 => }/api/CCarouselItem.api.mdx | 0 packages/docs/content/{4.5 => }/api/CChart.api.mdx | 0 packages/docs/content/{4.5 => }/api/CCharts.api.mdx | 0 .../docs/content/{4.5 => }/api/CCloseButton.api.mdx | 0 packages/docs/content/{4.5 => }/api/CCol.api.mdx | 0 .../docs/content/{4.5 => }/api/CCollapse.api.mdx | 0 .../docs/content/{4.5 => }/api/CContainer.api.mdx | 0 .../docs/content/{4.5 => }/api/CDropdown.api.mdx | 0 .../content/{4.5 => }/api/CDropdownDivider.api.mdx | 0 .../content/{4.5 => }/api/CDropdownHeader.api.mdx | 0 .../content/{4.5 => }/api/CDropdownItem.api.mdx | 0 .../{4.5 => }/api/CDropdownItemPlain.api.mdx | 0 .../content/{4.5 => }/api/CDropdownMenu.api.mdx | 0 .../content/{4.5 => }/api/CDropdownToggle.api.mdx | 0 packages/docs/content/{4.5 => }/api/CFooter.api.mdx | 0 packages/docs/content/{4.5 => }/api/CForm.api.mdx | 0 .../docs/content/{4.5 => }/api/CFormCheck.api.mdx | 0 .../{4.5 => }/api/CFormControlValidation.api.mdx | 0 .../{4.5 => }/api/CFormControlWrapper.api.mdx | 0 .../content/{4.5 => }/api/CFormFeedback.api.mdx | 0 .../content/{4.5 => }/api/CFormFloating.api.mdx | 0 .../docs/content/{4.5 => }/api/CFormInput.api.mdx | 0 .../docs/content/{4.5 => }/api/CFormLabel.api.mdx | 0 .../docs/content/{4.5 => }/api/CFormRange.api.mdx | 0 .../docs/content/{4.5 => }/api/CFormSelect.api.mdx | 0 .../docs/content/{4.5 => }/api/CFormSwitch.api.mdx | 0 .../docs/content/{4.5 => }/api/CFormText.api.mdx | 0 .../content/{4.5 => }/api/CFormTextarea.api.mdx | 0 packages/docs/content/{4.5 => }/api/CHeader.api.mdx | 0 .../docs/content/{4.5 => }/api/CHeaderBrand.api.mdx | 0 .../content/{4.5 => }/api/CHeaderDivider.api.mdx | 0 .../docs/content/{4.5 => }/api/CHeaderNav.api.mdx | 0 .../docs/content/{4.5 => }/api/CHeaderText.api.mdx | 0 .../content/{4.5 => }/api/CHeaderToggler.api.mdx | 0 packages/docs/content/{4.5 => }/api/CIcon.api.mdx | 0 packages/docs/content/{4.5 => }/api/CImage.api.mdx | 0 .../docs/content/{4.5 => }/api/CInputGroup.api.mdx | 0 .../content/{4.5 => }/api/CInputGroupText.api.mdx | 0 packages/docs/content/{4.5 => }/api/CLink.api.mdx | 0 .../docs/content/{4.5 => }/api/CListGroup.api.mdx | 0 .../content/{4.5 => }/api/CListGroupItem.api.mdx | 0 packages/docs/content/{4.5 => }/api/CModal.api.mdx | 0 .../docs/content/{4.5 => }/api/CModalBody.api.mdx | 0 .../content/{4.5 => }/api/CModalContent.api.mdx | 0 .../docs/content/{4.5 => }/api/CModalDialog.api.mdx | 0 .../docs/content/{4.5 => }/api/CModalFooter.api.mdx | 0 .../docs/content/{4.5 => }/api/CModalHeader.api.mdx | 0 .../docs/content/{4.5 => }/api/CModalTitle.api.mdx | 0 packages/docs/content/{4.5 => }/api/CNav.api.mdx | 0 .../docs/content/{4.5 => }/api/CNavGroup.api.mdx | 0 .../content/{4.5 => }/api/CNavGroupItems.api.mdx | 0 .../docs/content/{4.5 => }/api/CNavItem.api.mdx | 0 .../docs/content/{4.5 => }/api/CNavLink.api.mdx | 0 .../docs/content/{4.5 => }/api/CNavTitle.api.mdx | 0 packages/docs/content/{4.5 => }/api/CNavbar.api.mdx | 0 .../docs/content/{4.5 => }/api/CNavbarBrand.api.mdx | 0 .../docs/content/{4.5 => }/api/CNavbarNav.api.mdx | 0 .../docs/content/{4.5 => }/api/CNavbarText.api.mdx | 0 .../content/{4.5 => }/api/CNavbarToggler.api.mdx | 0 .../docs/content/{4.5 => }/api/COffcanvas.api.mdx | 0 .../content/{4.5 => }/api/COffcanvasBody.api.mdx | 0 .../content/{4.5 => }/api/COffcanvasHeader.api.mdx | 0 .../content/{4.5 => }/api/COffcanvasTitle.api.mdx | 0 .../docs/content/{4.5 => }/api/CPagination.api.mdx | 0 .../content/{4.5 => }/api/CPaginationItem.api.mdx | 0 .../docs/content/{4.5 => }/api/CPlaceholder.api.mdx | 0 .../docs/content/{4.5 => }/api/CPopover.api.mdx | 0 .../docs/content/{4.5 => }/api/CProgress.api.mdx | 0 .../docs/content/{4.5 => }/api/CProgressBar.api.mdx | 0 packages/docs/content/{4.5 => }/api/CRow.api.mdx | 0 .../docs/content/{4.5 => }/api/CSidebar.api.mdx | 0 .../content/{4.5 => }/api/CSidebarBrand.api.mdx | 0 .../content/{4.5 => }/api/CSidebarFooter.api.mdx | 0 .../content/{4.5 => }/api/CSidebarHeader.api.mdx | 0 .../docs/content/{4.5 => }/api/CSidebarNav.api.mdx | 0 .../content/{4.5 => }/api/CSidebarToggler.api.mdx | 0 .../docs/content/{4.5 => }/api/CSpinner.api.mdx | 0 .../docs/content/{4.5 => }/api/CTabContent.api.mdx | 0 .../docs/content/{4.5 => }/api/CTabPane.api.mdx | 0 packages/docs/content/{4.5 => }/api/CTable.api.mdx | 2 +- .../docs/content/{4.5 => }/api/CTableBody.api.mdx | 0 .../content/{4.5 => }/api/CTableCaption.api.mdx | 0 .../content/{4.5 => }/api/CTableDataCell.api.mdx | 0 .../docs/content/{4.5 => }/api/CTableFoot.api.mdx | 0 .../docs/content/{4.5 => }/api/CTableHead.api.mdx | 0 .../content/{4.5 => }/api/CTableHeaderCell.api.mdx | 0 .../{4.5 => }/api/CTableResponsiveWrapper.api.mdx | 0 .../docs/content/{4.5 => }/api/CTableRow.api.mdx | 0 packages/docs/content/{4.5 => }/api/CToast.api.mdx | 0 .../docs/content/{4.5 => }/api/CToastBody.api.mdx | 0 .../docs/content/{4.5 => }/api/CToastClose.api.mdx | 0 .../docs/content/{4.5 => }/api/CToastHeader.api.mdx | 0 .../docs/content/{4.5 => }/api/CToaster.api.mdx | 0 .../docs/content/{4.5 => }/api/CTooltip.api.mdx | 0 .../content/{4.5 => }/api/CWidgetStatsA.api.mdx | 0 .../content/{4.5 => }/api/CWidgetStatsB.api.mdx | 0 .../content/{4.5 => }/api/CWidgetStatsC.api.mdx | 0 .../content/{4.5 => }/api/CWidgetStatsD.api.mdx | 0 .../content/{4.5 => }/api/CWidgetStatsE.api.mdx | 0 .../content/{4.5 => }/api/CWidgetStatsF.api.mdx | 0 .../content/{4.5 => }/assets/images/angular.jpg | Bin .../content/{4.5 => }/assets/images/avatars/1.jpg | Bin .../content/{4.5 => }/assets/images/avatars/2.jpg | Bin .../content/{4.5 => }/assets/images/avatars/3.jpg | Bin .../content/{4.5 => }/assets/images/avatars/4.jpg | Bin .../content/{4.5 => }/assets/images/avatars/5.jpg | Bin .../content/{4.5 => }/assets/images/avatars/6.jpg | Bin .../content/{4.5 => }/assets/images/avatars/7.jpg | Bin .../content/{4.5 => }/assets/images/avatars/8.jpg | Bin .../content/{4.5 => }/assets/images/avatars/9.jpg | Bin .../{4.5 => }/assets/images/brand/coreui-signet.svg | 0 .../docs/content/{4.5 => }/assets/images/react.jpg | Bin .../content/{4.5 => }/assets/images/react400.jpg | Bin .../docs/content/{4.5 => }/assets/images/vue.jpg | Bin .../docs/content/{4.5 => }/components/accordion.mdx | 0 .../docs/content/{4.5 => }/components/alert.mdx | 0 .../docs/content/{4.5 => }/components/avatar.mdx | 0 .../docs/content/{4.5 => }/components/badge.mdx | 0 .../content/{4.5 => }/components/breadcrumb.mdx | 0 .../content/{4.5 => }/components/button-group.mdx | 0 .../docs/content/{4.5 => }/components/button.mdx | 0 .../docs/content/{4.5 => }/components/callout.mdx | 0 packages/docs/content/{4.5 => }/components/card.mdx | 0 .../docs/content/{4.5 => }/components/carousel.mdx | 0 .../docs/content/{4.5 => }/components/chart.mdx | 0 .../content/{4.5 => }/components/close-button.mdx | 0 .../docs/content/{4.5 => }/components/collapse.mdx | 0 .../docs/content/{4.5 => }/components/dropdown.mdx | 0 .../docs/content/{4.5 => }/components/footer.mdx | 0 .../docs/content/{4.5 => }/components/header.mdx | 0 packages/docs/content/{4.5 => }/components/icon.mdx | 0 .../docs/content/{4.5 => }/components/image.mdx | 0 .../content/{4.5 => }/components/list-group.mdx | 0 .../docs/content/{4.5 => }/components/modal.mdx | 0 .../docs/content/{4.5 => }/components/navbar.mdx | 0 .../docs/content/{4.5 => }/components/navs-tabs.mdx | 0 .../docs/content/{4.5 => }/components/offcanvas.mdx | 0 .../content/{4.5 => }/components/pagination.mdx | 0 .../content/{4.5 => }/components/placeholder.mdx | 0 .../docs/content/{4.5 => }/components/popover.mdx | 0 .../docs/content/{4.5 => }/components/progress.mdx | 0 .../docs/content/{4.5 => }/components/sidebar.mdx | 0 .../docs/content/{4.5 => }/components/spinner.mdx | 0 .../docs/content/{4.5 => }/components/table.mdx | 0 .../docs/content/{4.5 => }/components/toast.mdx | 0 .../docs/content/{4.5 => }/components/tooltip.mdx | 0 .../docs/content/{4.5 => }/components/widgets.mdx | 0 .../content/{4.5 => }/customize/css-variables.mdx | 0 .../docs/content/{4.5 => }/customize/options.mdx | 0 packages/docs/content/{4.5 => }/customize/sass.mdx | 0 packages/docs/content/{4.5 => }/forms/checkbox.mdx | 0 .../docs/content/{4.5 => }/forms/checks-radios.mdx | 0 .../content/{4.5 => }/forms/floating-labels.mdx | 0 .../docs/content/{4.5 => }/forms/form-control.mdx | 0 .../docs/content/{4.5 => }/forms/input-group.mdx | 0 packages/docs/content/{4.5 => }/forms/input.mdx | 0 packages/docs/content/{4.5 => }/forms/layout.mdx | 0 packages/docs/content/{4.5 => }/forms/overview.mdx | 0 packages/docs/content/{4.5 => }/forms/radio.mdx | 0 packages/docs/content/{4.5 => }/forms/range.mdx | 0 packages/docs/content/{4.5 => }/forms/select.mdx | 0 packages/docs/content/{4.5 => }/forms/switch.mdx | 0 packages/docs/content/{4.5 => }/forms/textarea.mdx | 0 .../docs/content/{4.5 => }/forms/validation.mdx | 0 .../{4.5 => }/getting-started/accessibility.mdx | 0 .../{4.5 => }/getting-started/introduction.mdx | 0 .../docs/content/{4.5 => }/layout/breakpoints.mdx | 0 packages/docs/content/{4.5 => }/layout/columns.mdx | 0 .../docs/content/{4.5 => }/layout/containers.mdx | 0 packages/docs/content/{4.5 => }/layout/grid.mdx | 0 packages/docs/content/{4.5 => }/layout/gutters.mdx | 0 packages/docs/content/{4.5 => }/migration/v4.mdx | 0 .../content/{4.5 => }/templates/admin-dashboard.mdx | 0 .../docs/content/{4.5 => }/templates/contents.mdx | 0 .../docs/content/{4.5 => }/templates/customize.mdx | 0 .../docs/content/{4.5 => }/templates/download.mdx | 0 .../content/{4.5 => }/templates/installation.mdx | 0 packages/docs/gatsby-config.js | 7 ++----- packages/docs/package.json | 5 +---- 211 files changed, 5 insertions(+), 12 deletions(-) rename packages/docs/content/{4.5 => }/api/CAccordion.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CAccordionBody.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CAccordionButton.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CAccordionCollapse.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CAccordionHeader.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CAccordionItem.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CAlert.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CAlertHeading.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CAlertLink.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CAvatar.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CBackdrop.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CBadge.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CBreadcrumb.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CBreadcrumbItem.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CButton.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CButtonGroup.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CButtonToolbar.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CCallout.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CCard.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CCardBody.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CCardFooter.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CCardGroup.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CCardHeader.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CCardImage.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CCardImageOverlay.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CCardLink.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CCardSubtitle.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CCardText.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CCardTitle.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CCarousel.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CCarouselCaption.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CCarouselItem.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CChart.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CCharts.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CCloseButton.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CCol.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CCollapse.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CContainer.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CDropdown.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CDropdownDivider.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CDropdownHeader.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CDropdownItem.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CDropdownItemPlain.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CDropdownMenu.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CDropdownToggle.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CFooter.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CForm.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CFormCheck.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CFormControlValidation.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CFormControlWrapper.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CFormFeedback.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CFormFloating.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CFormInput.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CFormLabel.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CFormRange.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CFormSelect.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CFormSwitch.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CFormText.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CFormTextarea.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CHeader.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CHeaderBrand.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CHeaderDivider.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CHeaderNav.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CHeaderText.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CHeaderToggler.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CIcon.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CImage.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CInputGroup.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CInputGroupText.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CLink.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CListGroup.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CListGroupItem.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CModal.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CModalBody.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CModalContent.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CModalDialog.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CModalFooter.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CModalHeader.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CModalTitle.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CNav.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CNavGroup.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CNavGroupItems.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CNavItem.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CNavLink.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CNavTitle.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CNavbar.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CNavbarBrand.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CNavbarNav.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CNavbarText.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CNavbarToggler.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/COffcanvas.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/COffcanvasBody.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/COffcanvasHeader.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/COffcanvasTitle.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CPagination.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CPaginationItem.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CPlaceholder.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CPopover.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CProgress.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CProgressBar.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CRow.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CSidebar.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CSidebarBrand.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CSidebarFooter.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CSidebarHeader.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CSidebarNav.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CSidebarToggler.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CSpinner.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CTabContent.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CTabPane.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CTable.api.mdx (99%) rename packages/docs/content/{4.5 => }/api/CTableBody.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CTableCaption.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CTableDataCell.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CTableFoot.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CTableHead.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CTableHeaderCell.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CTableResponsiveWrapper.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CTableRow.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CToast.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CToastBody.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CToastClose.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CToastHeader.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CToaster.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CTooltip.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CWidgetStatsA.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CWidgetStatsB.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CWidgetStatsC.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CWidgetStatsD.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CWidgetStatsE.api.mdx (100%) rename packages/docs/content/{4.5 => }/api/CWidgetStatsF.api.mdx (100%) rename packages/docs/content/{4.5 => }/assets/images/angular.jpg (100%) rename packages/docs/content/{4.5 => }/assets/images/avatars/1.jpg (100%) rename packages/docs/content/{4.5 => }/assets/images/avatars/2.jpg (100%) rename packages/docs/content/{4.5 => }/assets/images/avatars/3.jpg (100%) rename packages/docs/content/{4.5 => }/assets/images/avatars/4.jpg (100%) rename packages/docs/content/{4.5 => }/assets/images/avatars/5.jpg (100%) rename packages/docs/content/{4.5 => }/assets/images/avatars/6.jpg (100%) rename packages/docs/content/{4.5 => }/assets/images/avatars/7.jpg (100%) rename packages/docs/content/{4.5 => }/assets/images/avatars/8.jpg (100%) rename packages/docs/content/{4.5 => }/assets/images/avatars/9.jpg (100%) rename packages/docs/content/{4.5 => }/assets/images/brand/coreui-signet.svg (100%) rename packages/docs/content/{4.5 => }/assets/images/react.jpg (100%) rename packages/docs/content/{4.5 => }/assets/images/react400.jpg (100%) rename packages/docs/content/{4.5 => }/assets/images/vue.jpg (100%) rename packages/docs/content/{4.5 => }/components/accordion.mdx (100%) rename packages/docs/content/{4.5 => }/components/alert.mdx (100%) rename packages/docs/content/{4.5 => }/components/avatar.mdx (100%) rename packages/docs/content/{4.5 => }/components/badge.mdx (100%) rename packages/docs/content/{4.5 => }/components/breadcrumb.mdx (100%) rename packages/docs/content/{4.5 => }/components/button-group.mdx (100%) rename packages/docs/content/{4.5 => }/components/button.mdx (100%) rename packages/docs/content/{4.5 => }/components/callout.mdx (100%) rename packages/docs/content/{4.5 => }/components/card.mdx (100%) rename packages/docs/content/{4.5 => }/components/carousel.mdx (100%) rename packages/docs/content/{4.5 => }/components/chart.mdx (100%) rename packages/docs/content/{4.5 => }/components/close-button.mdx (100%) rename packages/docs/content/{4.5 => }/components/collapse.mdx (100%) rename packages/docs/content/{4.5 => }/components/dropdown.mdx (100%) rename packages/docs/content/{4.5 => }/components/footer.mdx (100%) rename packages/docs/content/{4.5 => }/components/header.mdx (100%) rename packages/docs/content/{4.5 => }/components/icon.mdx (100%) rename packages/docs/content/{4.5 => }/components/image.mdx (100%) rename packages/docs/content/{4.5 => }/components/list-group.mdx (100%) rename packages/docs/content/{4.5 => }/components/modal.mdx (100%) rename packages/docs/content/{4.5 => }/components/navbar.mdx (100%) rename packages/docs/content/{4.5 => }/components/navs-tabs.mdx (100%) rename packages/docs/content/{4.5 => }/components/offcanvas.mdx (100%) rename packages/docs/content/{4.5 => }/components/pagination.mdx (100%) rename packages/docs/content/{4.5 => }/components/placeholder.mdx (100%) rename packages/docs/content/{4.5 => }/components/popover.mdx (100%) rename packages/docs/content/{4.5 => }/components/progress.mdx (100%) rename packages/docs/content/{4.5 => }/components/sidebar.mdx (100%) rename packages/docs/content/{4.5 => }/components/spinner.mdx (100%) rename packages/docs/content/{4.5 => }/components/table.mdx (100%) rename packages/docs/content/{4.5 => }/components/toast.mdx (100%) rename packages/docs/content/{4.5 => }/components/tooltip.mdx (100%) rename packages/docs/content/{4.5 => }/components/widgets.mdx (100%) rename packages/docs/content/{4.5 => }/customize/css-variables.mdx (100%) rename packages/docs/content/{4.5 => }/customize/options.mdx (100%) rename packages/docs/content/{4.5 => }/customize/sass.mdx (100%) rename packages/docs/content/{4.5 => }/forms/checkbox.mdx (100%) rename packages/docs/content/{4.5 => }/forms/checks-radios.mdx (100%) rename packages/docs/content/{4.5 => }/forms/floating-labels.mdx (100%) rename packages/docs/content/{4.5 => }/forms/form-control.mdx (100%) rename packages/docs/content/{4.5 => }/forms/input-group.mdx (100%) rename packages/docs/content/{4.5 => }/forms/input.mdx (100%) rename packages/docs/content/{4.5 => }/forms/layout.mdx (100%) rename packages/docs/content/{4.5 => }/forms/overview.mdx (100%) rename packages/docs/content/{4.5 => }/forms/radio.mdx (100%) rename packages/docs/content/{4.5 => }/forms/range.mdx (100%) rename packages/docs/content/{4.5 => }/forms/select.mdx (100%) rename packages/docs/content/{4.5 => }/forms/switch.mdx (100%) rename packages/docs/content/{4.5 => }/forms/textarea.mdx (100%) rename packages/docs/content/{4.5 => }/forms/validation.mdx (100%) rename packages/docs/content/{4.5 => }/getting-started/accessibility.mdx (100%) rename packages/docs/content/{4.5 => }/getting-started/introduction.mdx (100%) rename packages/docs/content/{4.5 => }/layout/breakpoints.mdx (100%) rename packages/docs/content/{4.5 => }/layout/columns.mdx (100%) rename packages/docs/content/{4.5 => }/layout/containers.mdx (100%) rename packages/docs/content/{4.5 => }/layout/grid.mdx (100%) rename packages/docs/content/{4.5 => }/layout/gutters.mdx (100%) rename packages/docs/content/{4.5 => }/migration/v4.mdx (100%) rename packages/docs/content/{4.5 => }/templates/admin-dashboard.mdx (100%) rename packages/docs/content/{4.5 => }/templates/contents.mdx (100%) rename packages/docs/content/{4.5 => }/templates/customize.mdx (100%) rename packages/docs/content/{4.5 => }/templates/download.mdx (100%) rename packages/docs/content/{4.5 => }/templates/installation.mdx (100%) diff --git a/packages/docs/build/api.js b/packages/docs/build/api.js index 67ef5271..3d7508c0 100644 --- a/packages/docs/build/api.js +++ b/packages/docs/build/api.js @@ -6,7 +6,6 @@ const docgen = require('react-docgen-typescript') const fs = require('fs').promises const path = require('path') const globby = require('globby') -const pkg = require('../package.json') const GLOB = ['**/src/**/*.tsx'] const GLOBBY_OPTIONS = { @@ -76,7 +75,7 @@ import ${name} from '@coreui${relativeFilename.replace('.tsx', '')}' } await fs - .writeFile(`content/${pkg.config.version_short}/api/${filename}.api.mdx`, content, { + .writeFile(`content/api/${filename}.api.mdx`, content, { encoding: 'utf8', }) .then(() => { diff --git a/packages/docs/content/4.5/api/CAccordion.api.mdx b/packages/docs/content/api/CAccordion.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CAccordion.api.mdx rename to packages/docs/content/api/CAccordion.api.mdx diff --git a/packages/docs/content/4.5/api/CAccordionBody.api.mdx b/packages/docs/content/api/CAccordionBody.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CAccordionBody.api.mdx rename to packages/docs/content/api/CAccordionBody.api.mdx diff --git a/packages/docs/content/4.5/api/CAccordionButton.api.mdx b/packages/docs/content/api/CAccordionButton.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CAccordionButton.api.mdx rename to packages/docs/content/api/CAccordionButton.api.mdx diff --git a/packages/docs/content/4.5/api/CAccordionCollapse.api.mdx b/packages/docs/content/api/CAccordionCollapse.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CAccordionCollapse.api.mdx rename to packages/docs/content/api/CAccordionCollapse.api.mdx diff --git a/packages/docs/content/4.5/api/CAccordionHeader.api.mdx b/packages/docs/content/api/CAccordionHeader.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CAccordionHeader.api.mdx rename to packages/docs/content/api/CAccordionHeader.api.mdx diff --git a/packages/docs/content/4.5/api/CAccordionItem.api.mdx b/packages/docs/content/api/CAccordionItem.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CAccordionItem.api.mdx rename to packages/docs/content/api/CAccordionItem.api.mdx diff --git a/packages/docs/content/4.5/api/CAlert.api.mdx b/packages/docs/content/api/CAlert.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CAlert.api.mdx rename to packages/docs/content/api/CAlert.api.mdx diff --git a/packages/docs/content/4.5/api/CAlertHeading.api.mdx b/packages/docs/content/api/CAlertHeading.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CAlertHeading.api.mdx rename to packages/docs/content/api/CAlertHeading.api.mdx diff --git a/packages/docs/content/4.5/api/CAlertLink.api.mdx b/packages/docs/content/api/CAlertLink.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CAlertLink.api.mdx rename to packages/docs/content/api/CAlertLink.api.mdx diff --git a/packages/docs/content/4.5/api/CAvatar.api.mdx b/packages/docs/content/api/CAvatar.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CAvatar.api.mdx rename to packages/docs/content/api/CAvatar.api.mdx diff --git a/packages/docs/content/4.5/api/CBackdrop.api.mdx b/packages/docs/content/api/CBackdrop.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CBackdrop.api.mdx rename to packages/docs/content/api/CBackdrop.api.mdx diff --git a/packages/docs/content/4.5/api/CBadge.api.mdx b/packages/docs/content/api/CBadge.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CBadge.api.mdx rename to packages/docs/content/api/CBadge.api.mdx diff --git a/packages/docs/content/4.5/api/CBreadcrumb.api.mdx b/packages/docs/content/api/CBreadcrumb.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CBreadcrumb.api.mdx rename to packages/docs/content/api/CBreadcrumb.api.mdx diff --git a/packages/docs/content/4.5/api/CBreadcrumbItem.api.mdx b/packages/docs/content/api/CBreadcrumbItem.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CBreadcrumbItem.api.mdx rename to packages/docs/content/api/CBreadcrumbItem.api.mdx diff --git a/packages/docs/content/4.5/api/CButton.api.mdx b/packages/docs/content/api/CButton.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CButton.api.mdx rename to packages/docs/content/api/CButton.api.mdx diff --git a/packages/docs/content/4.5/api/CButtonGroup.api.mdx b/packages/docs/content/api/CButtonGroup.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CButtonGroup.api.mdx rename to packages/docs/content/api/CButtonGroup.api.mdx diff --git a/packages/docs/content/4.5/api/CButtonToolbar.api.mdx b/packages/docs/content/api/CButtonToolbar.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CButtonToolbar.api.mdx rename to packages/docs/content/api/CButtonToolbar.api.mdx diff --git a/packages/docs/content/4.5/api/CCallout.api.mdx b/packages/docs/content/api/CCallout.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CCallout.api.mdx rename to packages/docs/content/api/CCallout.api.mdx diff --git a/packages/docs/content/4.5/api/CCard.api.mdx b/packages/docs/content/api/CCard.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CCard.api.mdx rename to packages/docs/content/api/CCard.api.mdx diff --git a/packages/docs/content/4.5/api/CCardBody.api.mdx b/packages/docs/content/api/CCardBody.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CCardBody.api.mdx rename to packages/docs/content/api/CCardBody.api.mdx diff --git a/packages/docs/content/4.5/api/CCardFooter.api.mdx b/packages/docs/content/api/CCardFooter.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CCardFooter.api.mdx rename to packages/docs/content/api/CCardFooter.api.mdx diff --git a/packages/docs/content/4.5/api/CCardGroup.api.mdx b/packages/docs/content/api/CCardGroup.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CCardGroup.api.mdx rename to packages/docs/content/api/CCardGroup.api.mdx diff --git a/packages/docs/content/4.5/api/CCardHeader.api.mdx b/packages/docs/content/api/CCardHeader.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CCardHeader.api.mdx rename to packages/docs/content/api/CCardHeader.api.mdx diff --git a/packages/docs/content/4.5/api/CCardImage.api.mdx b/packages/docs/content/api/CCardImage.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CCardImage.api.mdx rename to packages/docs/content/api/CCardImage.api.mdx diff --git a/packages/docs/content/4.5/api/CCardImageOverlay.api.mdx b/packages/docs/content/api/CCardImageOverlay.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CCardImageOverlay.api.mdx rename to packages/docs/content/api/CCardImageOverlay.api.mdx diff --git a/packages/docs/content/4.5/api/CCardLink.api.mdx b/packages/docs/content/api/CCardLink.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CCardLink.api.mdx rename to packages/docs/content/api/CCardLink.api.mdx diff --git a/packages/docs/content/4.5/api/CCardSubtitle.api.mdx b/packages/docs/content/api/CCardSubtitle.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CCardSubtitle.api.mdx rename to packages/docs/content/api/CCardSubtitle.api.mdx diff --git a/packages/docs/content/4.5/api/CCardText.api.mdx b/packages/docs/content/api/CCardText.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CCardText.api.mdx rename to packages/docs/content/api/CCardText.api.mdx diff --git a/packages/docs/content/4.5/api/CCardTitle.api.mdx b/packages/docs/content/api/CCardTitle.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CCardTitle.api.mdx rename to packages/docs/content/api/CCardTitle.api.mdx diff --git a/packages/docs/content/4.5/api/CCarousel.api.mdx b/packages/docs/content/api/CCarousel.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CCarousel.api.mdx rename to packages/docs/content/api/CCarousel.api.mdx diff --git a/packages/docs/content/4.5/api/CCarouselCaption.api.mdx b/packages/docs/content/api/CCarouselCaption.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CCarouselCaption.api.mdx rename to packages/docs/content/api/CCarouselCaption.api.mdx diff --git a/packages/docs/content/4.5/api/CCarouselItem.api.mdx b/packages/docs/content/api/CCarouselItem.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CCarouselItem.api.mdx rename to packages/docs/content/api/CCarouselItem.api.mdx diff --git a/packages/docs/content/4.5/api/CChart.api.mdx b/packages/docs/content/api/CChart.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CChart.api.mdx rename to packages/docs/content/api/CChart.api.mdx diff --git a/packages/docs/content/4.5/api/CCharts.api.mdx b/packages/docs/content/api/CCharts.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CCharts.api.mdx rename to packages/docs/content/api/CCharts.api.mdx diff --git a/packages/docs/content/4.5/api/CCloseButton.api.mdx b/packages/docs/content/api/CCloseButton.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CCloseButton.api.mdx rename to packages/docs/content/api/CCloseButton.api.mdx diff --git a/packages/docs/content/4.5/api/CCol.api.mdx b/packages/docs/content/api/CCol.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CCol.api.mdx rename to packages/docs/content/api/CCol.api.mdx diff --git a/packages/docs/content/4.5/api/CCollapse.api.mdx b/packages/docs/content/api/CCollapse.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CCollapse.api.mdx rename to packages/docs/content/api/CCollapse.api.mdx diff --git a/packages/docs/content/4.5/api/CContainer.api.mdx b/packages/docs/content/api/CContainer.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CContainer.api.mdx rename to packages/docs/content/api/CContainer.api.mdx diff --git a/packages/docs/content/4.5/api/CDropdown.api.mdx b/packages/docs/content/api/CDropdown.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CDropdown.api.mdx rename to packages/docs/content/api/CDropdown.api.mdx diff --git a/packages/docs/content/4.5/api/CDropdownDivider.api.mdx b/packages/docs/content/api/CDropdownDivider.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CDropdownDivider.api.mdx rename to packages/docs/content/api/CDropdownDivider.api.mdx diff --git a/packages/docs/content/4.5/api/CDropdownHeader.api.mdx b/packages/docs/content/api/CDropdownHeader.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CDropdownHeader.api.mdx rename to packages/docs/content/api/CDropdownHeader.api.mdx diff --git a/packages/docs/content/4.5/api/CDropdownItem.api.mdx b/packages/docs/content/api/CDropdownItem.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CDropdownItem.api.mdx rename to packages/docs/content/api/CDropdownItem.api.mdx diff --git a/packages/docs/content/4.5/api/CDropdownItemPlain.api.mdx b/packages/docs/content/api/CDropdownItemPlain.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CDropdownItemPlain.api.mdx rename to packages/docs/content/api/CDropdownItemPlain.api.mdx diff --git a/packages/docs/content/4.5/api/CDropdownMenu.api.mdx b/packages/docs/content/api/CDropdownMenu.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CDropdownMenu.api.mdx rename to packages/docs/content/api/CDropdownMenu.api.mdx diff --git a/packages/docs/content/4.5/api/CDropdownToggle.api.mdx b/packages/docs/content/api/CDropdownToggle.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CDropdownToggle.api.mdx rename to packages/docs/content/api/CDropdownToggle.api.mdx diff --git a/packages/docs/content/4.5/api/CFooter.api.mdx b/packages/docs/content/api/CFooter.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CFooter.api.mdx rename to packages/docs/content/api/CFooter.api.mdx diff --git a/packages/docs/content/4.5/api/CForm.api.mdx b/packages/docs/content/api/CForm.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CForm.api.mdx rename to packages/docs/content/api/CForm.api.mdx diff --git a/packages/docs/content/4.5/api/CFormCheck.api.mdx b/packages/docs/content/api/CFormCheck.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CFormCheck.api.mdx rename to packages/docs/content/api/CFormCheck.api.mdx diff --git a/packages/docs/content/4.5/api/CFormControlValidation.api.mdx b/packages/docs/content/api/CFormControlValidation.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CFormControlValidation.api.mdx rename to packages/docs/content/api/CFormControlValidation.api.mdx diff --git a/packages/docs/content/4.5/api/CFormControlWrapper.api.mdx b/packages/docs/content/api/CFormControlWrapper.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CFormControlWrapper.api.mdx rename to packages/docs/content/api/CFormControlWrapper.api.mdx diff --git a/packages/docs/content/4.5/api/CFormFeedback.api.mdx b/packages/docs/content/api/CFormFeedback.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CFormFeedback.api.mdx rename to packages/docs/content/api/CFormFeedback.api.mdx diff --git a/packages/docs/content/4.5/api/CFormFloating.api.mdx b/packages/docs/content/api/CFormFloating.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CFormFloating.api.mdx rename to packages/docs/content/api/CFormFloating.api.mdx diff --git a/packages/docs/content/4.5/api/CFormInput.api.mdx b/packages/docs/content/api/CFormInput.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CFormInput.api.mdx rename to packages/docs/content/api/CFormInput.api.mdx diff --git a/packages/docs/content/4.5/api/CFormLabel.api.mdx b/packages/docs/content/api/CFormLabel.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CFormLabel.api.mdx rename to packages/docs/content/api/CFormLabel.api.mdx diff --git a/packages/docs/content/4.5/api/CFormRange.api.mdx b/packages/docs/content/api/CFormRange.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CFormRange.api.mdx rename to packages/docs/content/api/CFormRange.api.mdx diff --git a/packages/docs/content/4.5/api/CFormSelect.api.mdx b/packages/docs/content/api/CFormSelect.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CFormSelect.api.mdx rename to packages/docs/content/api/CFormSelect.api.mdx diff --git a/packages/docs/content/4.5/api/CFormSwitch.api.mdx b/packages/docs/content/api/CFormSwitch.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CFormSwitch.api.mdx rename to packages/docs/content/api/CFormSwitch.api.mdx diff --git a/packages/docs/content/4.5/api/CFormText.api.mdx b/packages/docs/content/api/CFormText.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CFormText.api.mdx rename to packages/docs/content/api/CFormText.api.mdx diff --git a/packages/docs/content/4.5/api/CFormTextarea.api.mdx b/packages/docs/content/api/CFormTextarea.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CFormTextarea.api.mdx rename to packages/docs/content/api/CFormTextarea.api.mdx diff --git a/packages/docs/content/4.5/api/CHeader.api.mdx b/packages/docs/content/api/CHeader.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CHeader.api.mdx rename to packages/docs/content/api/CHeader.api.mdx diff --git a/packages/docs/content/4.5/api/CHeaderBrand.api.mdx b/packages/docs/content/api/CHeaderBrand.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CHeaderBrand.api.mdx rename to packages/docs/content/api/CHeaderBrand.api.mdx diff --git a/packages/docs/content/4.5/api/CHeaderDivider.api.mdx b/packages/docs/content/api/CHeaderDivider.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CHeaderDivider.api.mdx rename to packages/docs/content/api/CHeaderDivider.api.mdx diff --git a/packages/docs/content/4.5/api/CHeaderNav.api.mdx b/packages/docs/content/api/CHeaderNav.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CHeaderNav.api.mdx rename to packages/docs/content/api/CHeaderNav.api.mdx diff --git a/packages/docs/content/4.5/api/CHeaderText.api.mdx b/packages/docs/content/api/CHeaderText.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CHeaderText.api.mdx rename to packages/docs/content/api/CHeaderText.api.mdx diff --git a/packages/docs/content/4.5/api/CHeaderToggler.api.mdx b/packages/docs/content/api/CHeaderToggler.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CHeaderToggler.api.mdx rename to packages/docs/content/api/CHeaderToggler.api.mdx diff --git a/packages/docs/content/4.5/api/CIcon.api.mdx b/packages/docs/content/api/CIcon.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CIcon.api.mdx rename to packages/docs/content/api/CIcon.api.mdx diff --git a/packages/docs/content/4.5/api/CImage.api.mdx b/packages/docs/content/api/CImage.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CImage.api.mdx rename to packages/docs/content/api/CImage.api.mdx diff --git a/packages/docs/content/4.5/api/CInputGroup.api.mdx b/packages/docs/content/api/CInputGroup.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CInputGroup.api.mdx rename to packages/docs/content/api/CInputGroup.api.mdx diff --git a/packages/docs/content/4.5/api/CInputGroupText.api.mdx b/packages/docs/content/api/CInputGroupText.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CInputGroupText.api.mdx rename to packages/docs/content/api/CInputGroupText.api.mdx diff --git a/packages/docs/content/4.5/api/CLink.api.mdx b/packages/docs/content/api/CLink.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CLink.api.mdx rename to packages/docs/content/api/CLink.api.mdx diff --git a/packages/docs/content/4.5/api/CListGroup.api.mdx b/packages/docs/content/api/CListGroup.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CListGroup.api.mdx rename to packages/docs/content/api/CListGroup.api.mdx diff --git a/packages/docs/content/4.5/api/CListGroupItem.api.mdx b/packages/docs/content/api/CListGroupItem.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CListGroupItem.api.mdx rename to packages/docs/content/api/CListGroupItem.api.mdx diff --git a/packages/docs/content/4.5/api/CModal.api.mdx b/packages/docs/content/api/CModal.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CModal.api.mdx rename to packages/docs/content/api/CModal.api.mdx diff --git a/packages/docs/content/4.5/api/CModalBody.api.mdx b/packages/docs/content/api/CModalBody.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CModalBody.api.mdx rename to packages/docs/content/api/CModalBody.api.mdx diff --git a/packages/docs/content/4.5/api/CModalContent.api.mdx b/packages/docs/content/api/CModalContent.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CModalContent.api.mdx rename to packages/docs/content/api/CModalContent.api.mdx diff --git a/packages/docs/content/4.5/api/CModalDialog.api.mdx b/packages/docs/content/api/CModalDialog.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CModalDialog.api.mdx rename to packages/docs/content/api/CModalDialog.api.mdx diff --git a/packages/docs/content/4.5/api/CModalFooter.api.mdx b/packages/docs/content/api/CModalFooter.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CModalFooter.api.mdx rename to packages/docs/content/api/CModalFooter.api.mdx diff --git a/packages/docs/content/4.5/api/CModalHeader.api.mdx b/packages/docs/content/api/CModalHeader.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CModalHeader.api.mdx rename to packages/docs/content/api/CModalHeader.api.mdx diff --git a/packages/docs/content/4.5/api/CModalTitle.api.mdx b/packages/docs/content/api/CModalTitle.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CModalTitle.api.mdx rename to packages/docs/content/api/CModalTitle.api.mdx diff --git a/packages/docs/content/4.5/api/CNav.api.mdx b/packages/docs/content/api/CNav.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CNav.api.mdx rename to packages/docs/content/api/CNav.api.mdx diff --git a/packages/docs/content/4.5/api/CNavGroup.api.mdx b/packages/docs/content/api/CNavGroup.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CNavGroup.api.mdx rename to packages/docs/content/api/CNavGroup.api.mdx diff --git a/packages/docs/content/4.5/api/CNavGroupItems.api.mdx b/packages/docs/content/api/CNavGroupItems.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CNavGroupItems.api.mdx rename to packages/docs/content/api/CNavGroupItems.api.mdx diff --git a/packages/docs/content/4.5/api/CNavItem.api.mdx b/packages/docs/content/api/CNavItem.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CNavItem.api.mdx rename to packages/docs/content/api/CNavItem.api.mdx diff --git a/packages/docs/content/4.5/api/CNavLink.api.mdx b/packages/docs/content/api/CNavLink.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CNavLink.api.mdx rename to packages/docs/content/api/CNavLink.api.mdx diff --git a/packages/docs/content/4.5/api/CNavTitle.api.mdx b/packages/docs/content/api/CNavTitle.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CNavTitle.api.mdx rename to packages/docs/content/api/CNavTitle.api.mdx diff --git a/packages/docs/content/4.5/api/CNavbar.api.mdx b/packages/docs/content/api/CNavbar.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CNavbar.api.mdx rename to packages/docs/content/api/CNavbar.api.mdx diff --git a/packages/docs/content/4.5/api/CNavbarBrand.api.mdx b/packages/docs/content/api/CNavbarBrand.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CNavbarBrand.api.mdx rename to packages/docs/content/api/CNavbarBrand.api.mdx diff --git a/packages/docs/content/4.5/api/CNavbarNav.api.mdx b/packages/docs/content/api/CNavbarNav.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CNavbarNav.api.mdx rename to packages/docs/content/api/CNavbarNav.api.mdx diff --git a/packages/docs/content/4.5/api/CNavbarText.api.mdx b/packages/docs/content/api/CNavbarText.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CNavbarText.api.mdx rename to packages/docs/content/api/CNavbarText.api.mdx diff --git a/packages/docs/content/4.5/api/CNavbarToggler.api.mdx b/packages/docs/content/api/CNavbarToggler.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CNavbarToggler.api.mdx rename to packages/docs/content/api/CNavbarToggler.api.mdx diff --git a/packages/docs/content/4.5/api/COffcanvas.api.mdx b/packages/docs/content/api/COffcanvas.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/COffcanvas.api.mdx rename to packages/docs/content/api/COffcanvas.api.mdx diff --git a/packages/docs/content/4.5/api/COffcanvasBody.api.mdx b/packages/docs/content/api/COffcanvasBody.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/COffcanvasBody.api.mdx rename to packages/docs/content/api/COffcanvasBody.api.mdx diff --git a/packages/docs/content/4.5/api/COffcanvasHeader.api.mdx b/packages/docs/content/api/COffcanvasHeader.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/COffcanvasHeader.api.mdx rename to packages/docs/content/api/COffcanvasHeader.api.mdx diff --git a/packages/docs/content/4.5/api/COffcanvasTitle.api.mdx b/packages/docs/content/api/COffcanvasTitle.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/COffcanvasTitle.api.mdx rename to packages/docs/content/api/COffcanvasTitle.api.mdx diff --git a/packages/docs/content/4.5/api/CPagination.api.mdx b/packages/docs/content/api/CPagination.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CPagination.api.mdx rename to packages/docs/content/api/CPagination.api.mdx diff --git a/packages/docs/content/4.5/api/CPaginationItem.api.mdx b/packages/docs/content/api/CPaginationItem.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CPaginationItem.api.mdx rename to packages/docs/content/api/CPaginationItem.api.mdx diff --git a/packages/docs/content/4.5/api/CPlaceholder.api.mdx b/packages/docs/content/api/CPlaceholder.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CPlaceholder.api.mdx rename to packages/docs/content/api/CPlaceholder.api.mdx diff --git a/packages/docs/content/4.5/api/CPopover.api.mdx b/packages/docs/content/api/CPopover.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CPopover.api.mdx rename to packages/docs/content/api/CPopover.api.mdx diff --git a/packages/docs/content/4.5/api/CProgress.api.mdx b/packages/docs/content/api/CProgress.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CProgress.api.mdx rename to packages/docs/content/api/CProgress.api.mdx diff --git a/packages/docs/content/4.5/api/CProgressBar.api.mdx b/packages/docs/content/api/CProgressBar.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CProgressBar.api.mdx rename to packages/docs/content/api/CProgressBar.api.mdx diff --git a/packages/docs/content/4.5/api/CRow.api.mdx b/packages/docs/content/api/CRow.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CRow.api.mdx rename to packages/docs/content/api/CRow.api.mdx diff --git a/packages/docs/content/4.5/api/CSidebar.api.mdx b/packages/docs/content/api/CSidebar.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CSidebar.api.mdx rename to packages/docs/content/api/CSidebar.api.mdx diff --git a/packages/docs/content/4.5/api/CSidebarBrand.api.mdx b/packages/docs/content/api/CSidebarBrand.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CSidebarBrand.api.mdx rename to packages/docs/content/api/CSidebarBrand.api.mdx diff --git a/packages/docs/content/4.5/api/CSidebarFooter.api.mdx b/packages/docs/content/api/CSidebarFooter.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CSidebarFooter.api.mdx rename to packages/docs/content/api/CSidebarFooter.api.mdx diff --git a/packages/docs/content/4.5/api/CSidebarHeader.api.mdx b/packages/docs/content/api/CSidebarHeader.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CSidebarHeader.api.mdx rename to packages/docs/content/api/CSidebarHeader.api.mdx diff --git a/packages/docs/content/4.5/api/CSidebarNav.api.mdx b/packages/docs/content/api/CSidebarNav.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CSidebarNav.api.mdx rename to packages/docs/content/api/CSidebarNav.api.mdx diff --git a/packages/docs/content/4.5/api/CSidebarToggler.api.mdx b/packages/docs/content/api/CSidebarToggler.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CSidebarToggler.api.mdx rename to packages/docs/content/api/CSidebarToggler.api.mdx diff --git a/packages/docs/content/4.5/api/CSpinner.api.mdx b/packages/docs/content/api/CSpinner.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CSpinner.api.mdx rename to packages/docs/content/api/CSpinner.api.mdx diff --git a/packages/docs/content/4.5/api/CTabContent.api.mdx b/packages/docs/content/api/CTabContent.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CTabContent.api.mdx rename to packages/docs/content/api/CTabContent.api.mdx diff --git a/packages/docs/content/4.5/api/CTabPane.api.mdx b/packages/docs/content/api/CTabPane.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CTabPane.api.mdx rename to packages/docs/content/api/CTabPane.api.mdx diff --git a/packages/docs/content/4.5/api/CTable.api.mdx b/packages/docs/content/api/CTable.api.mdx similarity index 99% rename from packages/docs/content/4.5/api/CTable.api.mdx rename to packages/docs/content/api/CTable.api.mdx index a94c5064..ce29a9d1 100644 --- a/packages/docs/content/4.5/api/CTable.api.mdx +++ b/packages/docs/content/api/CTable.api.mdx @@ -18,7 +18,7 @@ import CTable from '@coreui/react/src/components/table/CTable' | **columns**
4.3.0+
| Prop for table columns configuration. If prop is not defined, table will display columns based on the first item keys, omitting keys that begins with underscore (e.g. '_props')

In columns prop each array item represents one column. Item might be specified in two ways:
String: each item define column name equal to item value.
Object: item is object with following keys available as column configuration:
- key (required)(String) - define column name equal to item key.
- label (String) - define visible label of column. If not defined, label will be generated automatically based on column name, by converting kebab-case and snake_case to individual words and capitalization of each word.
- _props (Object) - adds classes to all cels in column, ex. _props: { scope: 'col', className: 'custom-class' },
- _style (Object) - adds styles to the column header (useful for defining widths) | `(string` \| `Column)[]` | - | | **footer**
4.3.0+
| Array of objects or strings, where each element represents one cell in the table footer.

Example items:
['FooterCell', 'FooterCell', 'FooterCell']
or
[{ label: 'FooterCell', _props: { color: 'success' }, ...] | `FooterItem[]` | - | | **hover** | Enable a hover state on table rows within a ``. | `boolean` | - | -| **items**
4.3.0+
| Array of objects, where each object represents one item - row in table. Additionally, you can add style classes to each row by passing them by '_props' key and to single cell by '_cellProps'.

Example item:
{ name: 'John' , age: 12, _props: { color: 'success' }, _cellProps: { age: { className: 'fw-bold'}}} | `Item[]` | [] | +| **items**
4.3.0+
| Array of objects, where each object represents one item - row in table. Additionally, you can add style classes to each row by passing them by '_props' key and to single cell by '_cellProps'.

Example item:
{ name: 'John' , age: 12, _props: { color: 'success' }, _cellProps: { age: { className: 'fw-bold'}}} | `Item[]` | - | | **responsive** | Make any table responsive across all viewports or pick a maximum breakpoint with which to have a responsive table up to. | `boolean` \| `'sm'` \| `'md'` \| `'lg'` \| `'xl'` \| `'xxl'` | - | | **small** | Make table more compact by cutting all cell `padding` in half. | `boolean` | - | | **striped** | Add zebra-striping to any table row within the ``. | `boolean` | - | diff --git a/packages/docs/content/4.5/api/CTableBody.api.mdx b/packages/docs/content/api/CTableBody.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CTableBody.api.mdx rename to packages/docs/content/api/CTableBody.api.mdx diff --git a/packages/docs/content/4.5/api/CTableCaption.api.mdx b/packages/docs/content/api/CTableCaption.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CTableCaption.api.mdx rename to packages/docs/content/api/CTableCaption.api.mdx diff --git a/packages/docs/content/4.5/api/CTableDataCell.api.mdx b/packages/docs/content/api/CTableDataCell.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CTableDataCell.api.mdx rename to packages/docs/content/api/CTableDataCell.api.mdx diff --git a/packages/docs/content/4.5/api/CTableFoot.api.mdx b/packages/docs/content/api/CTableFoot.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CTableFoot.api.mdx rename to packages/docs/content/api/CTableFoot.api.mdx diff --git a/packages/docs/content/4.5/api/CTableHead.api.mdx b/packages/docs/content/api/CTableHead.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CTableHead.api.mdx rename to packages/docs/content/api/CTableHead.api.mdx diff --git a/packages/docs/content/4.5/api/CTableHeaderCell.api.mdx b/packages/docs/content/api/CTableHeaderCell.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CTableHeaderCell.api.mdx rename to packages/docs/content/api/CTableHeaderCell.api.mdx diff --git a/packages/docs/content/4.5/api/CTableResponsiveWrapper.api.mdx b/packages/docs/content/api/CTableResponsiveWrapper.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CTableResponsiveWrapper.api.mdx rename to packages/docs/content/api/CTableResponsiveWrapper.api.mdx diff --git a/packages/docs/content/4.5/api/CTableRow.api.mdx b/packages/docs/content/api/CTableRow.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CTableRow.api.mdx rename to packages/docs/content/api/CTableRow.api.mdx diff --git a/packages/docs/content/4.5/api/CToast.api.mdx b/packages/docs/content/api/CToast.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CToast.api.mdx rename to packages/docs/content/api/CToast.api.mdx diff --git a/packages/docs/content/4.5/api/CToastBody.api.mdx b/packages/docs/content/api/CToastBody.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CToastBody.api.mdx rename to packages/docs/content/api/CToastBody.api.mdx diff --git a/packages/docs/content/4.5/api/CToastClose.api.mdx b/packages/docs/content/api/CToastClose.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CToastClose.api.mdx rename to packages/docs/content/api/CToastClose.api.mdx diff --git a/packages/docs/content/4.5/api/CToastHeader.api.mdx b/packages/docs/content/api/CToastHeader.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CToastHeader.api.mdx rename to packages/docs/content/api/CToastHeader.api.mdx diff --git a/packages/docs/content/4.5/api/CToaster.api.mdx b/packages/docs/content/api/CToaster.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CToaster.api.mdx rename to packages/docs/content/api/CToaster.api.mdx diff --git a/packages/docs/content/4.5/api/CTooltip.api.mdx b/packages/docs/content/api/CTooltip.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CTooltip.api.mdx rename to packages/docs/content/api/CTooltip.api.mdx diff --git a/packages/docs/content/4.5/api/CWidgetStatsA.api.mdx b/packages/docs/content/api/CWidgetStatsA.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CWidgetStatsA.api.mdx rename to packages/docs/content/api/CWidgetStatsA.api.mdx diff --git a/packages/docs/content/4.5/api/CWidgetStatsB.api.mdx b/packages/docs/content/api/CWidgetStatsB.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CWidgetStatsB.api.mdx rename to packages/docs/content/api/CWidgetStatsB.api.mdx diff --git a/packages/docs/content/4.5/api/CWidgetStatsC.api.mdx b/packages/docs/content/api/CWidgetStatsC.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CWidgetStatsC.api.mdx rename to packages/docs/content/api/CWidgetStatsC.api.mdx diff --git a/packages/docs/content/4.5/api/CWidgetStatsD.api.mdx b/packages/docs/content/api/CWidgetStatsD.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CWidgetStatsD.api.mdx rename to packages/docs/content/api/CWidgetStatsD.api.mdx diff --git a/packages/docs/content/4.5/api/CWidgetStatsE.api.mdx b/packages/docs/content/api/CWidgetStatsE.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CWidgetStatsE.api.mdx rename to packages/docs/content/api/CWidgetStatsE.api.mdx diff --git a/packages/docs/content/4.5/api/CWidgetStatsF.api.mdx b/packages/docs/content/api/CWidgetStatsF.api.mdx similarity index 100% rename from packages/docs/content/4.5/api/CWidgetStatsF.api.mdx rename to packages/docs/content/api/CWidgetStatsF.api.mdx diff --git a/packages/docs/content/4.5/assets/images/angular.jpg b/packages/docs/content/assets/images/angular.jpg similarity index 100% rename from packages/docs/content/4.5/assets/images/angular.jpg rename to packages/docs/content/assets/images/angular.jpg diff --git a/packages/docs/content/4.5/assets/images/avatars/1.jpg b/packages/docs/content/assets/images/avatars/1.jpg similarity index 100% rename from packages/docs/content/4.5/assets/images/avatars/1.jpg rename to packages/docs/content/assets/images/avatars/1.jpg diff --git a/packages/docs/content/4.5/assets/images/avatars/2.jpg b/packages/docs/content/assets/images/avatars/2.jpg similarity index 100% rename from packages/docs/content/4.5/assets/images/avatars/2.jpg rename to packages/docs/content/assets/images/avatars/2.jpg diff --git a/packages/docs/content/4.5/assets/images/avatars/3.jpg b/packages/docs/content/assets/images/avatars/3.jpg similarity index 100% rename from packages/docs/content/4.5/assets/images/avatars/3.jpg rename to packages/docs/content/assets/images/avatars/3.jpg diff --git a/packages/docs/content/4.5/assets/images/avatars/4.jpg b/packages/docs/content/assets/images/avatars/4.jpg similarity index 100% rename from packages/docs/content/4.5/assets/images/avatars/4.jpg rename to packages/docs/content/assets/images/avatars/4.jpg diff --git a/packages/docs/content/4.5/assets/images/avatars/5.jpg b/packages/docs/content/assets/images/avatars/5.jpg similarity index 100% rename from packages/docs/content/4.5/assets/images/avatars/5.jpg rename to packages/docs/content/assets/images/avatars/5.jpg diff --git a/packages/docs/content/4.5/assets/images/avatars/6.jpg b/packages/docs/content/assets/images/avatars/6.jpg similarity index 100% rename from packages/docs/content/4.5/assets/images/avatars/6.jpg rename to packages/docs/content/assets/images/avatars/6.jpg diff --git a/packages/docs/content/4.5/assets/images/avatars/7.jpg b/packages/docs/content/assets/images/avatars/7.jpg similarity index 100% rename from packages/docs/content/4.5/assets/images/avatars/7.jpg rename to packages/docs/content/assets/images/avatars/7.jpg diff --git a/packages/docs/content/4.5/assets/images/avatars/8.jpg b/packages/docs/content/assets/images/avatars/8.jpg similarity index 100% rename from packages/docs/content/4.5/assets/images/avatars/8.jpg rename to packages/docs/content/assets/images/avatars/8.jpg diff --git a/packages/docs/content/4.5/assets/images/avatars/9.jpg b/packages/docs/content/assets/images/avatars/9.jpg similarity index 100% rename from packages/docs/content/4.5/assets/images/avatars/9.jpg rename to packages/docs/content/assets/images/avatars/9.jpg diff --git a/packages/docs/content/4.5/assets/images/brand/coreui-signet.svg b/packages/docs/content/assets/images/brand/coreui-signet.svg similarity index 100% rename from packages/docs/content/4.5/assets/images/brand/coreui-signet.svg rename to packages/docs/content/assets/images/brand/coreui-signet.svg diff --git a/packages/docs/content/4.5/assets/images/react.jpg b/packages/docs/content/assets/images/react.jpg similarity index 100% rename from packages/docs/content/4.5/assets/images/react.jpg rename to packages/docs/content/assets/images/react.jpg diff --git a/packages/docs/content/4.5/assets/images/react400.jpg b/packages/docs/content/assets/images/react400.jpg similarity index 100% rename from packages/docs/content/4.5/assets/images/react400.jpg rename to packages/docs/content/assets/images/react400.jpg diff --git a/packages/docs/content/4.5/assets/images/vue.jpg b/packages/docs/content/assets/images/vue.jpg similarity index 100% rename from packages/docs/content/4.5/assets/images/vue.jpg rename to packages/docs/content/assets/images/vue.jpg diff --git a/packages/docs/content/4.5/components/accordion.mdx b/packages/docs/content/components/accordion.mdx similarity index 100% rename from packages/docs/content/4.5/components/accordion.mdx rename to packages/docs/content/components/accordion.mdx diff --git a/packages/docs/content/4.5/components/alert.mdx b/packages/docs/content/components/alert.mdx similarity index 100% rename from packages/docs/content/4.5/components/alert.mdx rename to packages/docs/content/components/alert.mdx diff --git a/packages/docs/content/4.5/components/avatar.mdx b/packages/docs/content/components/avatar.mdx similarity index 100% rename from packages/docs/content/4.5/components/avatar.mdx rename to packages/docs/content/components/avatar.mdx diff --git a/packages/docs/content/4.5/components/badge.mdx b/packages/docs/content/components/badge.mdx similarity index 100% rename from packages/docs/content/4.5/components/badge.mdx rename to packages/docs/content/components/badge.mdx diff --git a/packages/docs/content/4.5/components/breadcrumb.mdx b/packages/docs/content/components/breadcrumb.mdx similarity index 100% rename from packages/docs/content/4.5/components/breadcrumb.mdx rename to packages/docs/content/components/breadcrumb.mdx diff --git a/packages/docs/content/4.5/components/button-group.mdx b/packages/docs/content/components/button-group.mdx similarity index 100% rename from packages/docs/content/4.5/components/button-group.mdx rename to packages/docs/content/components/button-group.mdx diff --git a/packages/docs/content/4.5/components/button.mdx b/packages/docs/content/components/button.mdx similarity index 100% rename from packages/docs/content/4.5/components/button.mdx rename to packages/docs/content/components/button.mdx diff --git a/packages/docs/content/4.5/components/callout.mdx b/packages/docs/content/components/callout.mdx similarity index 100% rename from packages/docs/content/4.5/components/callout.mdx rename to packages/docs/content/components/callout.mdx diff --git a/packages/docs/content/4.5/components/card.mdx b/packages/docs/content/components/card.mdx similarity index 100% rename from packages/docs/content/4.5/components/card.mdx rename to packages/docs/content/components/card.mdx diff --git a/packages/docs/content/4.5/components/carousel.mdx b/packages/docs/content/components/carousel.mdx similarity index 100% rename from packages/docs/content/4.5/components/carousel.mdx rename to packages/docs/content/components/carousel.mdx diff --git a/packages/docs/content/4.5/components/chart.mdx b/packages/docs/content/components/chart.mdx similarity index 100% rename from packages/docs/content/4.5/components/chart.mdx rename to packages/docs/content/components/chart.mdx diff --git a/packages/docs/content/4.5/components/close-button.mdx b/packages/docs/content/components/close-button.mdx similarity index 100% rename from packages/docs/content/4.5/components/close-button.mdx rename to packages/docs/content/components/close-button.mdx diff --git a/packages/docs/content/4.5/components/collapse.mdx b/packages/docs/content/components/collapse.mdx similarity index 100% rename from packages/docs/content/4.5/components/collapse.mdx rename to packages/docs/content/components/collapse.mdx diff --git a/packages/docs/content/4.5/components/dropdown.mdx b/packages/docs/content/components/dropdown.mdx similarity index 100% rename from packages/docs/content/4.5/components/dropdown.mdx rename to packages/docs/content/components/dropdown.mdx diff --git a/packages/docs/content/4.5/components/footer.mdx b/packages/docs/content/components/footer.mdx similarity index 100% rename from packages/docs/content/4.5/components/footer.mdx rename to packages/docs/content/components/footer.mdx diff --git a/packages/docs/content/4.5/components/header.mdx b/packages/docs/content/components/header.mdx similarity index 100% rename from packages/docs/content/4.5/components/header.mdx rename to packages/docs/content/components/header.mdx diff --git a/packages/docs/content/4.5/components/icon.mdx b/packages/docs/content/components/icon.mdx similarity index 100% rename from packages/docs/content/4.5/components/icon.mdx rename to packages/docs/content/components/icon.mdx diff --git a/packages/docs/content/4.5/components/image.mdx b/packages/docs/content/components/image.mdx similarity index 100% rename from packages/docs/content/4.5/components/image.mdx rename to packages/docs/content/components/image.mdx diff --git a/packages/docs/content/4.5/components/list-group.mdx b/packages/docs/content/components/list-group.mdx similarity index 100% rename from packages/docs/content/4.5/components/list-group.mdx rename to packages/docs/content/components/list-group.mdx diff --git a/packages/docs/content/4.5/components/modal.mdx b/packages/docs/content/components/modal.mdx similarity index 100% rename from packages/docs/content/4.5/components/modal.mdx rename to packages/docs/content/components/modal.mdx diff --git a/packages/docs/content/4.5/components/navbar.mdx b/packages/docs/content/components/navbar.mdx similarity index 100% rename from packages/docs/content/4.5/components/navbar.mdx rename to packages/docs/content/components/navbar.mdx diff --git a/packages/docs/content/4.5/components/navs-tabs.mdx b/packages/docs/content/components/navs-tabs.mdx similarity index 100% rename from packages/docs/content/4.5/components/navs-tabs.mdx rename to packages/docs/content/components/navs-tabs.mdx diff --git a/packages/docs/content/4.5/components/offcanvas.mdx b/packages/docs/content/components/offcanvas.mdx similarity index 100% rename from packages/docs/content/4.5/components/offcanvas.mdx rename to packages/docs/content/components/offcanvas.mdx diff --git a/packages/docs/content/4.5/components/pagination.mdx b/packages/docs/content/components/pagination.mdx similarity index 100% rename from packages/docs/content/4.5/components/pagination.mdx rename to packages/docs/content/components/pagination.mdx diff --git a/packages/docs/content/4.5/components/placeholder.mdx b/packages/docs/content/components/placeholder.mdx similarity index 100% rename from packages/docs/content/4.5/components/placeholder.mdx rename to packages/docs/content/components/placeholder.mdx diff --git a/packages/docs/content/4.5/components/popover.mdx b/packages/docs/content/components/popover.mdx similarity index 100% rename from packages/docs/content/4.5/components/popover.mdx rename to packages/docs/content/components/popover.mdx diff --git a/packages/docs/content/4.5/components/progress.mdx b/packages/docs/content/components/progress.mdx similarity index 100% rename from packages/docs/content/4.5/components/progress.mdx rename to packages/docs/content/components/progress.mdx diff --git a/packages/docs/content/4.5/components/sidebar.mdx b/packages/docs/content/components/sidebar.mdx similarity index 100% rename from packages/docs/content/4.5/components/sidebar.mdx rename to packages/docs/content/components/sidebar.mdx diff --git a/packages/docs/content/4.5/components/spinner.mdx b/packages/docs/content/components/spinner.mdx similarity index 100% rename from packages/docs/content/4.5/components/spinner.mdx rename to packages/docs/content/components/spinner.mdx diff --git a/packages/docs/content/4.5/components/table.mdx b/packages/docs/content/components/table.mdx similarity index 100% rename from packages/docs/content/4.5/components/table.mdx rename to packages/docs/content/components/table.mdx diff --git a/packages/docs/content/4.5/components/toast.mdx b/packages/docs/content/components/toast.mdx similarity index 100% rename from packages/docs/content/4.5/components/toast.mdx rename to packages/docs/content/components/toast.mdx diff --git a/packages/docs/content/4.5/components/tooltip.mdx b/packages/docs/content/components/tooltip.mdx similarity index 100% rename from packages/docs/content/4.5/components/tooltip.mdx rename to packages/docs/content/components/tooltip.mdx diff --git a/packages/docs/content/4.5/components/widgets.mdx b/packages/docs/content/components/widgets.mdx similarity index 100% rename from packages/docs/content/4.5/components/widgets.mdx rename to packages/docs/content/components/widgets.mdx diff --git a/packages/docs/content/4.5/customize/css-variables.mdx b/packages/docs/content/customize/css-variables.mdx similarity index 100% rename from packages/docs/content/4.5/customize/css-variables.mdx rename to packages/docs/content/customize/css-variables.mdx diff --git a/packages/docs/content/4.5/customize/options.mdx b/packages/docs/content/customize/options.mdx similarity index 100% rename from packages/docs/content/4.5/customize/options.mdx rename to packages/docs/content/customize/options.mdx diff --git a/packages/docs/content/4.5/customize/sass.mdx b/packages/docs/content/customize/sass.mdx similarity index 100% rename from packages/docs/content/4.5/customize/sass.mdx rename to packages/docs/content/customize/sass.mdx diff --git a/packages/docs/content/4.5/forms/checkbox.mdx b/packages/docs/content/forms/checkbox.mdx similarity index 100% rename from packages/docs/content/4.5/forms/checkbox.mdx rename to packages/docs/content/forms/checkbox.mdx diff --git a/packages/docs/content/4.5/forms/checks-radios.mdx b/packages/docs/content/forms/checks-radios.mdx similarity index 100% rename from packages/docs/content/4.5/forms/checks-radios.mdx rename to packages/docs/content/forms/checks-radios.mdx diff --git a/packages/docs/content/4.5/forms/floating-labels.mdx b/packages/docs/content/forms/floating-labels.mdx similarity index 100% rename from packages/docs/content/4.5/forms/floating-labels.mdx rename to packages/docs/content/forms/floating-labels.mdx diff --git a/packages/docs/content/4.5/forms/form-control.mdx b/packages/docs/content/forms/form-control.mdx similarity index 100% rename from packages/docs/content/4.5/forms/form-control.mdx rename to packages/docs/content/forms/form-control.mdx diff --git a/packages/docs/content/4.5/forms/input-group.mdx b/packages/docs/content/forms/input-group.mdx similarity index 100% rename from packages/docs/content/4.5/forms/input-group.mdx rename to packages/docs/content/forms/input-group.mdx diff --git a/packages/docs/content/4.5/forms/input.mdx b/packages/docs/content/forms/input.mdx similarity index 100% rename from packages/docs/content/4.5/forms/input.mdx rename to packages/docs/content/forms/input.mdx diff --git a/packages/docs/content/4.5/forms/layout.mdx b/packages/docs/content/forms/layout.mdx similarity index 100% rename from packages/docs/content/4.5/forms/layout.mdx rename to packages/docs/content/forms/layout.mdx diff --git a/packages/docs/content/4.5/forms/overview.mdx b/packages/docs/content/forms/overview.mdx similarity index 100% rename from packages/docs/content/4.5/forms/overview.mdx rename to packages/docs/content/forms/overview.mdx diff --git a/packages/docs/content/4.5/forms/radio.mdx b/packages/docs/content/forms/radio.mdx similarity index 100% rename from packages/docs/content/4.5/forms/radio.mdx rename to packages/docs/content/forms/radio.mdx diff --git a/packages/docs/content/4.5/forms/range.mdx b/packages/docs/content/forms/range.mdx similarity index 100% rename from packages/docs/content/4.5/forms/range.mdx rename to packages/docs/content/forms/range.mdx diff --git a/packages/docs/content/4.5/forms/select.mdx b/packages/docs/content/forms/select.mdx similarity index 100% rename from packages/docs/content/4.5/forms/select.mdx rename to packages/docs/content/forms/select.mdx diff --git a/packages/docs/content/4.5/forms/switch.mdx b/packages/docs/content/forms/switch.mdx similarity index 100% rename from packages/docs/content/4.5/forms/switch.mdx rename to packages/docs/content/forms/switch.mdx diff --git a/packages/docs/content/4.5/forms/textarea.mdx b/packages/docs/content/forms/textarea.mdx similarity index 100% rename from packages/docs/content/4.5/forms/textarea.mdx rename to packages/docs/content/forms/textarea.mdx diff --git a/packages/docs/content/4.5/forms/validation.mdx b/packages/docs/content/forms/validation.mdx similarity index 100% rename from packages/docs/content/4.5/forms/validation.mdx rename to packages/docs/content/forms/validation.mdx diff --git a/packages/docs/content/4.5/getting-started/accessibility.mdx b/packages/docs/content/getting-started/accessibility.mdx similarity index 100% rename from packages/docs/content/4.5/getting-started/accessibility.mdx rename to packages/docs/content/getting-started/accessibility.mdx diff --git a/packages/docs/content/4.5/getting-started/introduction.mdx b/packages/docs/content/getting-started/introduction.mdx similarity index 100% rename from packages/docs/content/4.5/getting-started/introduction.mdx rename to packages/docs/content/getting-started/introduction.mdx diff --git a/packages/docs/content/4.5/layout/breakpoints.mdx b/packages/docs/content/layout/breakpoints.mdx similarity index 100% rename from packages/docs/content/4.5/layout/breakpoints.mdx rename to packages/docs/content/layout/breakpoints.mdx diff --git a/packages/docs/content/4.5/layout/columns.mdx b/packages/docs/content/layout/columns.mdx similarity index 100% rename from packages/docs/content/4.5/layout/columns.mdx rename to packages/docs/content/layout/columns.mdx diff --git a/packages/docs/content/4.5/layout/containers.mdx b/packages/docs/content/layout/containers.mdx similarity index 100% rename from packages/docs/content/4.5/layout/containers.mdx rename to packages/docs/content/layout/containers.mdx diff --git a/packages/docs/content/4.5/layout/grid.mdx b/packages/docs/content/layout/grid.mdx similarity index 100% rename from packages/docs/content/4.5/layout/grid.mdx rename to packages/docs/content/layout/grid.mdx diff --git a/packages/docs/content/4.5/layout/gutters.mdx b/packages/docs/content/layout/gutters.mdx similarity index 100% rename from packages/docs/content/4.5/layout/gutters.mdx rename to packages/docs/content/layout/gutters.mdx diff --git a/packages/docs/content/4.5/migration/v4.mdx b/packages/docs/content/migration/v4.mdx similarity index 100% rename from packages/docs/content/4.5/migration/v4.mdx rename to packages/docs/content/migration/v4.mdx diff --git a/packages/docs/content/4.5/templates/admin-dashboard.mdx b/packages/docs/content/templates/admin-dashboard.mdx similarity index 100% rename from packages/docs/content/4.5/templates/admin-dashboard.mdx rename to packages/docs/content/templates/admin-dashboard.mdx diff --git a/packages/docs/content/4.5/templates/contents.mdx b/packages/docs/content/templates/contents.mdx similarity index 100% rename from packages/docs/content/4.5/templates/contents.mdx rename to packages/docs/content/templates/contents.mdx diff --git a/packages/docs/content/4.5/templates/customize.mdx b/packages/docs/content/templates/customize.mdx similarity index 100% rename from packages/docs/content/4.5/templates/customize.mdx rename to packages/docs/content/templates/customize.mdx diff --git a/packages/docs/content/4.5/templates/download.mdx b/packages/docs/content/templates/download.mdx similarity index 100% rename from packages/docs/content/4.5/templates/download.mdx rename to packages/docs/content/templates/download.mdx diff --git a/packages/docs/content/4.5/templates/installation.mdx b/packages/docs/content/templates/installation.mdx similarity index 100% rename from packages/docs/content/4.5/templates/installation.mdx rename to packages/docs/content/templates/installation.mdx diff --git a/packages/docs/gatsby-config.js b/packages/docs/gatsby-config.js index 82ece888..fb9353c3 100644 --- a/packages/docs/gatsby-config.js +++ b/packages/docs/gatsby-config.js @@ -1,6 +1,3 @@ -/* eslint-disable @typescript-eslint/no-var-requires */ -const pkg = require(`./package.json`) - module.exports = { siteMetadata: { title: `CoreUI for React.js`, @@ -41,7 +38,7 @@ module.exports = { resolve: `gatsby-source-filesystem`, options: { name: `docs`, - path: `${__dirname}/content/${pkg.config.version_short}/`, + path: `${__dirname}/content/`, }, }, { @@ -54,7 +51,7 @@ module.exports = { { resolve: require.resolve(`./src/plugins/gatsby-remark-import-markdown`), options: { - directory: `${__dirname}/content/${pkg.config.version_short}/api/`, + directory: `${__dirname}/content/api/`, }, }, { diff --git a/packages/docs/package.json b/packages/docs/package.json index 27ea3f1a..5c650ebc 100644 --- a/packages/docs/package.json +++ b/packages/docs/package.json @@ -14,7 +14,7 @@ "license": "MIT", "author": "The CoreUI Team (https://github.com/orgs/coreui/people)", "scripts": { - "api": "rimraf \"content/$npm_package_config_version_short/api/*\" & node build/api.js", + "api": "rimraf \"content/api/*\" & node build/api.js", "build": "gatsby build", "develop": "gatsby develop", "dist": "run-s api build", @@ -23,9 +23,6 @@ "serve": "gatsby serve", "clean": "gatsby clean" }, - "config": { - "version_short": "4.5" - }, "dependencies": { "@coreui/chartjs": "^3.0.0", "@coreui/coreui": "^4.2.4", From f8ddcdbc957a96a361a58a31e6eae431978cfb92 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=81ukasz=20Holeczek?= Date: Mon, 23 Jan 2023 17:28:27 +0100 Subject: [PATCH 006/452] chore: clean-up --- .../gatsby-remark-import-markdown/index.js | 49 ------------------- .../package.json | 4 -- 2 files changed, 53 deletions(-) delete mode 100755 packages/docs/src/plugins/gatsby-remark-import-markdown/index.js delete mode 100644 packages/docs/src/plugins/gatsby-remark-import-markdown/package.json diff --git a/packages/docs/src/plugins/gatsby-remark-import-markdown/index.js b/packages/docs/src/plugins/gatsby-remark-import-markdown/index.js deleted file mode 100755 index f36b2f95..00000000 --- a/packages/docs/src/plugins/gatsby-remark-import-markdown/index.js +++ /dev/null @@ -1,49 +0,0 @@ -/* eslint-disable @typescript-eslint/no-var-requires */ -'use strict' - -const fs = require('fs') -const normalizePath = require('normalize-path') -const visit = require('unist-util-visit') -const unified = require('unified') -const parse = require('remark-parse') -const html = require('remark-html') - -module.exports = function (_ref, _temp) { - var markdownAST = _ref.markdownAST - - let _ref2 = _temp === void 0 ? {} : _temp, - directory = _ref2.directory - - if (!directory) { - throw Error(`Required option \"directory\" not specified`) - } else if (!fs.existsSync(directory)) { - throw Error(`Invalid directory specified \"${directory}\"`) - } else if (!directory.endsWith('/')) { - directory += '/' - } - - visit(markdownAST, 'inlineCode', function (node, index, parent) { - const value = node.value - - if (value.startsWith('markdown:')) { - const file = value.substr(9) - const path = normalizePath('' + directory + file) - - if (!fs.existsSync(path)) { - throw Error(`Invalid fragment specified; no such file "${path}"`) - } - - const code = fs.readFileSync(path, 'utf8') - - const markdown = unified().use(parse).use(html, { sanitize: false }) - - try { - parent.value = `
${markdown.processSync(code)}
` - parent.type = 'html' - } catch (e) { - throw Error(`${e.message} \nFile: ${file}`) - } - } - }) - return markdownAST -} diff --git a/packages/docs/src/plugins/gatsby-remark-import-markdown/package.json b/packages/docs/src/plugins/gatsby-remark-import-markdown/package.json deleted file mode 100644 index 1e3f2817..00000000 --- a/packages/docs/src/plugins/gatsby-remark-import-markdown/package.json +++ /dev/null @@ -1,4 +0,0 @@ -{ - "name": "", - "main": "index.js" -} From a88ef96bffc842a5fcf777d53c38b5e43e085677 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=81ukasz=20Holeczek?= Date: Mon, 23 Jan 2023 17:30:41 +0100 Subject: [PATCH 007/452] docs: update API documantation --- packages/docs/content/api/CCarousel.api.mdx | 2 +- packages/docs/content/api/CFormCheck.api.mdx | 10 +++++----- .../content/api/CFormControlValidation.api.mdx | 10 +++++----- .../docs/content/api/CFormControlWrapper.api.mdx | 16 ++++++++-------- packages/docs/content/api/CFormInput.api.mdx | 16 ++++++++-------- packages/docs/content/api/CFormRange.api.mdx | 2 +- packages/docs/content/api/CFormSelect.api.mdx | 16 ++++++++-------- packages/docs/content/api/CFormTextarea.api.mdx | 16 ++++++++-------- packages/docs/content/api/CIcon.api.mdx | 4 ++-- packages/docs/content/api/CTable.api.mdx | 14 +++++++------- 10 files changed, 53 insertions(+), 53 deletions(-) diff --git a/packages/docs/content/api/CCarousel.api.mdx b/packages/docs/content/api/CCarousel.api.mdx index ed3fa126..6a2f8cdf 100644 --- a/packages/docs/content/api/CCarousel.api.mdx +++ b/packages/docs/content/api/CCarousel.api.mdx @@ -16,6 +16,6 @@ import CCarousel from '@coreui/react/src/components/carousel/CCarousel' | **onSlid** | Callback fired when a slide transition end. | `(active: number, direction: string) => void` | - | | **onSlide** | Callback fired when a slide transition starts. | `(active: number, direction: string) => void` | - | | **pause** | If set to 'hover', pauses the cycling of the carousel on mouseenter and resumes the cycling of the carousel on mouseleave. If set to false, hovering over the carousel won't pause it. | `boolean` \| `'hover'` | hover | -| **touch**
4.5.0+
| Set whether the carousel should support left/right swipe interactions on touchscreen devices. | `boolean` | true | +| **touch** **_4.5.0+_** | Set whether the carousel should support left/right swipe interactions on touchscreen devices. | `boolean` | true | | **transition** | Set type of the transition. | `'slide'` \| `'crossfade'` | - | | **wrap** | Set whether the carousel should cycle continuously or have hard stops. | `boolean` | true | diff --git a/packages/docs/content/api/CFormCheck.api.mdx b/packages/docs/content/api/CFormCheck.api.mdx index cd1242c7..c758d23f 100644 --- a/packages/docs/content/api/CFormCheck.api.mdx +++ b/packages/docs/content/api/CFormCheck.api.mdx @@ -9,16 +9,16 @@ import CFormCheck from '@coreui/react/src/components/form/CFormCheck' | --- | --- | --- | --- | | **button** | Create button-like checkboxes and radio buttons. | `ButtonObject` | - | | **className** | A string of all className you want applied to the component. | `string` | - | -| **feedback**
4.2.0+
| Provide valuable, actionable feedback. | `ReactNode` | - | -| **feedbackInvalid**
4.2.0+
| Provide valuable, actionable feedback. | `ReactNode` | - | -| **feedbackValid**
4.2.0+
| Provide valuable, actionable invalid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`. | `ReactNode` | - | -| **floatingLabel**
4.2.0+
| Provide valuable, actionable valid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`. | `ReactNode` | - | +| **feedback** **_4.2.0+_** | Provide valuable, actionable feedback. | `ReactNode` | - | +| **feedbackInvalid** **_4.2.0+_** | Provide valuable, actionable feedback. | `ReactNode` | - | +| **feedbackValid** **_4.2.0+_** | Provide valuable, actionable invalid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`. | `ReactNode` | - | +| **floatingLabel** **_4.2.0+_** | Provide valuable, actionable valid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`. | `ReactNode` | - | | **hitArea** | Sets hit area to the full area of the component. | `'full'` | - | | **id** | The id global attribute defines an identifier (ID) that must be unique in the whole document. | `string` | - | | **indeterminate** | Input Checkbox indeterminate Property. | `boolean` | - | | **inline** | Group checkboxes or radios on the same horizontal row by adding. | `boolean` | - | | **invalid** | Set component validation state to invalid. | `boolean` | - | | **label** | The element represents a caption for a component. | `ReactNode` | - | -| **tooltipFeedback**
4.2.0+
| Display validation feedback in a styled tooltip. | `boolean` | - | +| **tooltipFeedback** **_4.2.0+_** | Display validation feedback in a styled tooltip. | `boolean` | - | | **type** | Specifies the type of component. | `'checkbox'` \| `'radio'` | checkbox | | **valid** | Set component validation state to valid. | `boolean` | - | diff --git a/packages/docs/content/api/CFormControlValidation.api.mdx b/packages/docs/content/api/CFormControlValidation.api.mdx index bd06c65d..371e9918 100644 --- a/packages/docs/content/api/CFormControlValidation.api.mdx +++ b/packages/docs/content/api/CFormControlValidation.api.mdx @@ -7,10 +7,10 @@ import CFormControlValidation from '@coreui/react/src/components/form/CFormContr | Property | Description | Type | Default | | --- | --- | --- | --- | -| **feedback**
4.2.0+
| Provide valuable, actionable feedback. | `ReactNode` | - | -| **feedbackInvalid**
4.2.0+
| Provide valuable, actionable feedback. | `ReactNode` | - | -| **feedbackValid**
4.2.0+
| Provide valuable, actionable invalid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`. | `ReactNode` | - | -| **floatingLabel**
4.2.0+
| Provide valuable, actionable valid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`. | `ReactNode` | - | +| **feedback** **_4.2.0+_** | Provide valuable, actionable feedback. | `ReactNode` | - | +| **feedbackInvalid** **_4.2.0+_** | Provide valuable, actionable feedback. | `ReactNode` | - | +| **feedbackValid** **_4.2.0+_** | Provide valuable, actionable invalid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`. | `ReactNode` | - | +| **floatingLabel** **_4.2.0+_** | Provide valuable, actionable valid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`. | `ReactNode` | - | | **invalid** | Set component validation state to invalid. | `boolean` | - | -| **tooltipFeedback**
4.2.0+
| Display validation feedback in a styled tooltip. | `boolean` | - | +| **tooltipFeedback** **_4.2.0+_** | Display validation feedback in a styled tooltip. | `boolean` | - | | **valid** | Set component validation state to valid. | `boolean` | - | diff --git a/packages/docs/content/api/CFormControlWrapper.api.mdx b/packages/docs/content/api/CFormControlWrapper.api.mdx index c303da39..4f412d96 100644 --- a/packages/docs/content/api/CFormControlWrapper.api.mdx +++ b/packages/docs/content/api/CFormControlWrapper.api.mdx @@ -7,13 +7,13 @@ import CFormControlWrapper from '@coreui/react/src/components/form/CFormControlW | Property | Description | Type | Default | | --- | --- | --- | --- | -| **feedback**
4.2.0+
| Provide valuable, actionable feedback. | `ReactNode` | - | -| **feedbackInvalid**
4.2.0+
| Provide valuable, actionable feedback. | `ReactNode` | - | -| **feedbackValid**
4.2.0+
| Provide valuable, actionable invalid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`. | `ReactNode` | - | -| **floatingClassName**
4.5.0+
| A string of all className you want applied to the floating label wrapper. | `string` | - | -| **floatingLabel**
4.2.0+
| Provide valuable, actionable valid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`. | `ReactNode` | - | +| **feedback** **_4.2.0+_** | Provide valuable, actionable feedback. | `ReactNode` | - | +| **feedbackInvalid** **_4.2.0+_** | Provide valuable, actionable feedback. | `ReactNode` | - | +| **feedbackValid** **_4.2.0+_** | Provide valuable, actionable invalid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`. | `ReactNode` | - | +| **floatingClassName** **_4.5.0+_** | A string of all className you want applied to the floating label wrapper. | `string` | - | +| **floatingLabel** **_4.2.0+_** | Provide valuable, actionable valid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`. | `ReactNode` | - | | **invalid** | Set component validation state to invalid. | `boolean` | - | -| **label**
4.2.0+
| Add a caption for a component. | `ReactNode` | - | -| **text**
4.2.0+
| Add helper text to the component. | `ReactNode` | - | -| **tooltipFeedback**
4.2.0+
| Display validation feedback in a styled tooltip. | `boolean` | - | +| **label** **_4.2.0+_** | Add a caption for a component. | `ReactNode` | - | +| **text** **_4.2.0+_** | Add helper text to the component. | `ReactNode` | - | +| **tooltipFeedback** **_4.2.0+_** | Display validation feedback in a styled tooltip. | `boolean` | - | | **valid** | Set component validation state to valid. | `boolean` | - | diff --git a/packages/docs/content/api/CFormInput.api.mdx b/packages/docs/content/api/CFormInput.api.mdx index 36b44cfd..281e6e35 100644 --- a/packages/docs/content/api/CFormInput.api.mdx +++ b/packages/docs/content/api/CFormInput.api.mdx @@ -10,19 +10,19 @@ import CFormInput from '@coreui/react/src/components/form/CFormInput' | **className** | A string of all className you want applied to the component. | `string` | - | | **delay** | Delay onChange event while typing. If set to true onChange event will be delayed 500ms, you can also provide the number of milliseconds you want to delay the onChange event. | `number` \| `boolean` | false | | **disabled** | Toggle the disabled state for the component. | `boolean` | - | -| **feedback**
4.2.0+
| Provide valuable, actionable feedback. | `ReactNode` | - | -| **feedbackInvalid**
4.2.0+
| Provide valuable, actionable feedback. | `ReactNode` | - | -| **feedbackValid**
4.2.0+
| Provide valuable, actionable invalid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`. | `ReactNode` | - | -| **floatingClassName**
4.5.0+
| A string of all className you want applied to the floating label wrapper. | `string` | - | -| **floatingLabel**
4.2.0+
| Provide valuable, actionable valid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`. | `ReactNode` | - | +| **feedback** **_4.2.0+_** | Provide valuable, actionable feedback. | `ReactNode` | - | +| **feedbackInvalid** **_4.2.0+_** | Provide valuable, actionable feedback. | `ReactNode` | - | +| **feedbackValid** **_4.2.0+_** | Provide valuable, actionable invalid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`. | `ReactNode` | - | +| **floatingClassName** **_4.5.0+_** | A string of all className you want applied to the floating label wrapper. | `string` | - | +| **floatingLabel** **_4.2.0+_** | Provide valuable, actionable valid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`. | `ReactNode` | - | | **invalid** | Set component validation state to invalid. | `boolean` | - | -| **label**
4.2.0+
| Add a caption for a component. | `ReactNode` | - | +| **label** **_4.2.0+_** | Add a caption for a component. | `ReactNode` | - | | **onChange** | Method called immediately after the `value` prop changes. | `ChangeEventHandler` | - | | **plainText** | Render the component styled as plain text. Removes the default form field styling and preserve the correct margin and padding. Recommend to use only along side `readonly` | `boolean` | - | | **readOnly** | Toggle the readonly state for the component. | `boolean` | - | | **size** | Size the component small or large. | `'sm'` \| `'lg'` | - | -| **text**
4.2.0+
| Add helper text to the component. | `ReactNode` | - | -| **tooltipFeedback**
4.2.0+
| Display validation feedback in a styled tooltip. | `boolean` | - | +| **text** **_4.2.0+_** | Add helper text to the component. | `ReactNode` | - | +| **tooltipFeedback** **_4.2.0+_** | Display validation feedback in a styled tooltip. | `boolean` | - | | **type** | Specifies the type of component. | `string` | text | | **valid** | Set component validation state to valid. | `boolean` | - | | **value** | The `value` attribute of component. | `string` \| `number` \| `string[]` | - | diff --git a/packages/docs/content/api/CFormRange.api.mdx b/packages/docs/content/api/CFormRange.api.mdx index b7310578..f2b5a83f 100644 --- a/packages/docs/content/api/CFormRange.api.mdx +++ b/packages/docs/content/api/CFormRange.api.mdx @@ -9,7 +9,7 @@ import CFormRange from '@coreui/react/src/components/form/CFormRange' | --- | --- | --- | --- | | **className** | A string of all className you want applied to the component. | `string` | - | | **disabled** | Toggle the disabled state for the component. | `boolean` | - | -| **label**
4.2.0+
| Add a caption for a component. | `ReactNode` | - | +| **label** **_4.2.0+_** | Add a caption for a component. | `ReactNode` | - | | **max** | Specifies the maximum value for the component. | `number` | - | | **min** | Specifies the minimum value for the component. | `number` | - | | **onChange** | Method called immediately after the `value` prop changes. | `ChangeEventHandler` | - | diff --git a/packages/docs/content/api/CFormSelect.api.mdx b/packages/docs/content/api/CFormSelect.api.mdx index 9dbafea4..f507ca9f 100644 --- a/packages/docs/content/api/CFormSelect.api.mdx +++ b/packages/docs/content/api/CFormSelect.api.mdx @@ -8,18 +8,18 @@ import CFormSelect from '@coreui/react/src/components/form/CFormSelect' | Property | Description | Type | Default | | --- | --- | --- | --- | | **className** | A string of all className you want applied to the component. | `string` | - | -| **feedback**
4.2.0+
| Provide valuable, actionable feedback. | `ReactNode` | - | -| **feedbackInvalid**
4.2.0+
| Provide valuable, actionable feedback. | `ReactNode` | - | -| **feedbackValid**
4.2.0+
| Provide valuable, actionable invalid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`. | `ReactNode` | - | -| **floatingClassName**
4.5.0+
| A string of all className you want applied to the floating label wrapper. | `string` | - | -| **floatingLabel**
4.2.0+
| Provide valuable, actionable valid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`. | `ReactNode` | - | +| **feedback** **_4.2.0+_** | Provide valuable, actionable feedback. | `ReactNode` | - | +| **feedbackInvalid** **_4.2.0+_** | Provide valuable, actionable feedback. | `ReactNode` | - | +| **feedbackValid** **_4.2.0+_** | Provide valuable, actionable invalid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`. | `ReactNode` | - | +| **floatingClassName** **_4.5.0+_** | A string of all className you want applied to the floating label wrapper. | `string` | - | +| **floatingLabel** **_4.2.0+_** | Provide valuable, actionable valid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`. | `ReactNode` | - | | **htmlSize** | Specifies the number of visible options in a drop-down list. | `number` | - | | **invalid** | Set component validation state to invalid. | `boolean` | - | -| **label**
4.2.0+
| Add a caption for a component. | `ReactNode` | - | +| **label** **_4.2.0+_** | Add a caption for a component. | `ReactNode` | - | | **onChange** | Method called immediately after the `value` prop changes. | `ChangeEventHandler` | - | | **options** | Options list of the select component. Available keys: `label`, `value`, `disabled`.
Examples:
- `options={[{ value: 'js', label: 'JavaScript' }, { value: 'html', label: 'HTML', disabled: true }]}`
- `options={['js', 'html']}` | `Option[]` \| `string[]` | - | | **size** | Size the component small or large. | `'sm'` \| `'lg'` | - | -| **text**
4.2.0+
| Add helper text to the component. | `ReactNode` | - | -| **tooltipFeedback**
4.2.0+
| Display validation feedback in a styled tooltip. | `boolean` | - | +| **text** **_4.2.0+_** | Add helper text to the component. | `ReactNode` | - | +| **tooltipFeedback** **_4.2.0+_** | Display validation feedback in a styled tooltip. | `boolean` | - | | **valid** | Set component validation state to valid. | `boolean` | - | | **value** | The `value` attribute of component. | `string` \| `number` \| `string[]` | - | diff --git a/packages/docs/content/api/CFormTextarea.api.mdx b/packages/docs/content/api/CFormTextarea.api.mdx index c6fe4065..552a328a 100644 --- a/packages/docs/content/api/CFormTextarea.api.mdx +++ b/packages/docs/content/api/CFormTextarea.api.mdx @@ -9,17 +9,17 @@ import CFormTextarea from '@coreui/react/src/components/form/CFormTextarea' | --- | --- | --- | --- | | **className** | A string of all className you want applied to the component. | `string` | - | | **disabled** | Toggle the disabled state for the component. | `boolean` | - | -| **feedback**
4.2.0+
| Provide valuable, actionable feedback. | `ReactNode` | - | -| **feedbackInvalid**
4.2.0+
| Provide valuable, actionable feedback. | `ReactNode` | - | -| **feedbackValid**
4.2.0+
| Provide valuable, actionable invalid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`. | `ReactNode` | - | -| **floatingClassName**
4.5.0+
| A string of all className you want applied to the floating label wrapper. | `string` | - | -| **floatingLabel**
4.2.0+
| Provide valuable, actionable valid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`. | `ReactNode` | - | +| **feedback** **_4.2.0+_** | Provide valuable, actionable feedback. | `ReactNode` | - | +| **feedbackInvalid** **_4.2.0+_** | Provide valuable, actionable feedback. | `ReactNode` | - | +| **feedbackValid** **_4.2.0+_** | Provide valuable, actionable invalid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`. | `ReactNode` | - | +| **floatingClassName** **_4.5.0+_** | A string of all className you want applied to the floating label wrapper. | `string` | - | +| **floatingLabel** **_4.2.0+_** | Provide valuable, actionable valid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`. | `ReactNode` | - | | **invalid** | Set component validation state to invalid. | `boolean` | - | -| **label**
4.2.0+
| Add a caption for a component. | `ReactNode` | - | +| **label** **_4.2.0+_** | Add a caption for a component. | `ReactNode` | - | | **onChange** | Method called immediately after the `value` prop changes. | `ChangeEventHandler` | - | | **plainText** | Render the component styled as plain text. Removes the default form field styling and preserve the correct margin and padding. Recommend to use only along side `readonly`. | `boolean` | - | | **readOnly** | Toggle the readonly state for the component. | `boolean` | - | -| **text**
4.2.0+
| Add helper text to the component. | `ReactNode` | - | -| **tooltipFeedback**
4.2.0+
| Display validation feedback in a styled tooltip. | `boolean` | - | +| **text** **_4.2.0+_** | Add helper text to the component. | `ReactNode` | - | +| **tooltipFeedback** **_4.2.0+_** | Display validation feedback in a styled tooltip. | `boolean` | - | | **valid** | Set component validation state to valid. | `boolean` | - | | **value** | The `value` attribute of component. | `string` \| `number` \| `string[]` | - | diff --git a/packages/docs/content/api/CIcon.api.mdx b/packages/docs/content/api/CIcon.api.mdx index cc750cdb..ca7da70f 100644 --- a/packages/docs/content/api/CIcon.api.mdx +++ b/packages/docs/content/api/CIcon.api.mdx @@ -8,11 +8,11 @@ import CIcon from '@coreui/icons-react/src/CIcon' | Property | Description | Type | Default | | --- | --- | --- | --- | | **className** | A string of all className you want applied to the component. | `string` | - | -| **content**
Deprecated 3.0+
| Use `icon={...}` instead of | `string` \| `string[]` | - | +| **content** **_Deprecated 3.0+_** | Use `icon={...}` instead of | `string` \| `string[]` | - | | **customClassName** | Use for replacing default CIcon component classes. Prop is overriding the 'size' prop. | `string` \| `object` \| `string[]` | - | | **height** | The height attribute defines the vertical length of an icon. | `number` | - | | **icon** | Name of the icon placed in React object or SVG content. | `string` \| `string[]` | - | -| **name**
Deprecated 3.0+
| Use `icon="..."` instead of | `string` | - | +| **name** **_Deprecated 3.0+_** | Use `icon="..."` instead of | `string` | - | | **size** | Size of the icon. Available sizes: 'sm', 'lg', 'xl', 'xxl', '3xl...9xl', 'custom', 'custom-size'. | `'custom'` \| `'custom-size'` \| `'sm'` \| `'lg'` \| `'xl'` \| `'xxl'` \| `'3xl'` \| `'4xl'` \| `'5xl'` \| `'6xl'` \| `'7xl'` \| `'8xl'` \| `'9xl'` | - | | **title** | Title tag content. | `string` | - | | **use** | If defined component will be rendered using 'use' tag. | `string` | - | diff --git a/packages/docs/content/api/CTable.api.mdx b/packages/docs/content/api/CTable.api.mdx index ce29a9d1..86b34953 100644 --- a/packages/docs/content/api/CTable.api.mdx +++ b/packages/docs/content/api/CTable.api.mdx @@ -12,16 +12,16 @@ import CTable from '@coreui/react/src/components/table/CTable' | **bordered** | Add borders on all sides of the table and cells. | `boolean` | - | | **borderless** | Remove borders on all sides of the table and cells. | `boolean` | - | | **caption** | Put the caption on the top if you set `caption="top"` of the table or set the text of the table caption. | `string` | - | -| **captionTop**
4.3.0+
| Set the text of the table caption and the caption on the top of the table. | `string` | - | +| **captionTop** **_4.3.0+_** | Set the text of the table caption and the caption on the top of the table. | `string` | - | | **className** | A string of all className you want applied to the component. | `string` | - | | **color** | Sets the color context of the component to one of CoreUI’s themed colors. | `'primary'` \| `'secondary'` \| `'success'` \| `'danger'` \| `'warning'` \| `'info'` \| `'dark'` \| `'light'` \| `string` | - | -| **columns**
4.3.0+
| Prop for table columns configuration. If prop is not defined, table will display columns based on the first item keys, omitting keys that begins with underscore (e.g. '_props')

In columns prop each array item represents one column. Item might be specified in two ways:
String: each item define column name equal to item value.
Object: item is object with following keys available as column configuration:
- key (required)(String) - define column name equal to item key.
- label (String) - define visible label of column. If not defined, label will be generated automatically based on column name, by converting kebab-case and snake_case to individual words and capitalization of each word.
- _props (Object) - adds classes to all cels in column, ex. _props: { scope: 'col', className: 'custom-class' },
- _style (Object) - adds styles to the column header (useful for defining widths) | `(string` \| `Column)[]` | - | -| **footer**
4.3.0+
| Array of objects or strings, where each element represents one cell in the table footer.

Example items:
['FooterCell', 'FooterCell', 'FooterCell']
or
[{ label: 'FooterCell', _props: { color: 'success' }, ...] | `FooterItem[]` | - | +| **columns** **_4.3.0+_** | Prop for table columns configuration. If prop is not defined, table will display columns based on the first item keys, omitting keys that begins with underscore (e.g. '_props')

In columns prop each array item represents one column. Item might be specified in two ways:
String: each item define column name equal to item value.
Object: item is object with following keys available as column configuration:
- key (required)(String) - define column name equal to item key.
- label (String) - define visible label of column. If not defined, label will be generated automatically based on column name, by converting kebab-case and snake_case to individual words and capitalization of each word.
- _props (Object) - adds classes to all cels in column, ex. _props: { scope: 'col', className: 'custom-class' },
- _style (Object) - adds styles to the column header (useful for defining widths) | `(string` \| `Column)[]` | - | +| **footer** **_4.3.0+_** | Array of objects or strings, where each element represents one cell in the table footer.

Example items:
['FooterCell', 'FooterCell', 'FooterCell']
or
[{ label: 'FooterCell', _props: { color: 'success' }, ...] | `FooterItem[]` | - | | **hover** | Enable a hover state on table rows within a ``. | `boolean` | - | -| **items**
4.3.0+
| Array of objects, where each object represents one item - row in table. Additionally, you can add style classes to each row by passing them by '_props' key and to single cell by '_cellProps'.

Example item:
{ name: 'John' , age: 12, _props: { color: 'success' }, _cellProps: { age: { className: 'fw-bold'}}} | `Item[]` | - | +| **items** **_4.3.0+_** | Array of objects, where each object represents one item - row in table. Additionally, you can add style classes to each row by passing them by '_props' key and to single cell by '_cellProps'.

Example item:
{ name: 'John' , age: 12, _props: { color: 'success' }, _cellProps: { age: { className: 'fw-bold'}}} | `Item[]` | - | | **responsive** | Make any table responsive across all viewports or pick a maximum breakpoint with which to have a responsive table up to. | `boolean` \| `'sm'` \| `'md'` \| `'lg'` \| `'xl'` \| `'xxl'` | - | | **small** | Make table more compact by cutting all cell `padding` in half. | `boolean` | - | | **striped** | Add zebra-striping to any table row within the ``. | `boolean` | - | -| **stripedColumns**
4.3.0+
| Add zebra-striping to any table column. | `boolean` | - | -| **tableFootProps**
4.3.0+
| Properties that will be passed to the table footer component. | `CTableFootProps` | - | -| **tableHeadProps**
4.3.0+
| Properties that will be passed to the table head component. | `CTableHeadProps` | - | +| **stripedColumns** **_4.3.0+_** | Add zebra-striping to any table column. | `boolean` | - | +| **tableFootProps** **_4.3.0+_** | Properties that will be passed to the table footer component. | `CTableFootProps` | - | +| **tableHeadProps** **_4.3.0+_** | Properties that will be passed to the table head component. | `CTableHeadProps` | - | From 501bbc492ca9fda18518d1893b0e36673b5d2480 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=81ukasz=20Holeczek?= Date: Mon, 23 Jan 2023 18:05:17 +0100 Subject: [PATCH 008/452] docs: update theme --- packages/docs/gatsby-config.js | 16 ++- packages/docs/gatsby-node.js | 25 ++-- packages/docs/package.json | 35 +++--- packages/docs/src/components/Ads.tsx | 7 +- packages/docs/src/components/Banner.tsx | 55 +++++++++ packages/docs/src/components/CodeBlock.tsx | 8 +- packages/docs/src/components/Example.tsx | 9 +- packages/docs/src/components/Seo.tsx | 14 ++- packages/docs/src/components/Toc.tsx | 22 ++-- packages/docs/src/components/index.ts | 3 +- .../{templates => data}/other_frameworks.json | 0 packages/docs/src/styles/_example.scss | 11 ++ packages/docs/src/templates/Docs.tsx | 108 +++++++----------- .../gatsby-remark-import-markdown/index.js | 86 ++++++++++++++ .../package.json | 31 +++++ packages/gatsby-remark-jsx-preview/index.js | 47 ++++++++ .../gatsby-remark-jsx-preview/package.json | 26 +++++ 17 files changed, 381 insertions(+), 122 deletions(-) create mode 100644 packages/docs/src/components/Banner.tsx rename packages/docs/src/{templates => data}/other_frameworks.json (100%) create mode 100755 packages/gatsby-remark-import-markdown/index.js create mode 100644 packages/gatsby-remark-import-markdown/package.json create mode 100755 packages/gatsby-remark-jsx-preview/index.js create mode 100644 packages/gatsby-remark-jsx-preview/package.json diff --git a/packages/docs/gatsby-config.js b/packages/docs/gatsby-config.js index fb9353c3..49945b9e 100644 --- a/packages/docs/gatsby-config.js +++ b/packages/docs/gatsby-config.js @@ -44,16 +44,14 @@ module.exports = { { resolve: `gatsby-plugin-mdx`, options: { - defaultLayouts: { - docs: require.resolve(`./src/templates/Docs.tsx`), - }, gatsbyRemarkPlugins: [ { - resolve: require.resolve(`./src/plugins/gatsby-remark-import-markdown`), + resolve: `gatsby-remark-import-markdown`, options: { directory: `${__dirname}/content/api/`, }, }, + `gatsby-remark-jsx-preview`, { resolve: `gatsby-remark-autolink-headers`, options: { @@ -63,12 +61,12 @@ module.exports = { }, }, { - resolve: "gatsby-remark-external-links", + resolve: 'gatsby-remark-external-links', options: { - target: "_blank", - rel: "nofollow" - } - } + target: '_blank', + rel: 'nofollow', + }, + }, ], }, }, diff --git a/packages/docs/gatsby-node.js b/packages/docs/gatsby-node.js index dfe3afdf..9d7f1cd8 100644 --- a/packages/docs/gatsby-node.js +++ b/packages/docs/gatsby-node.js @@ -36,6 +36,9 @@ exports.createPages = async ({ graphql, actions, reporter }) => { slug } tableOfContents(maxDepth: 10) + internal { + contentFilePath + } } } } @@ -46,18 +49,20 @@ exports.createPages = async ({ graphql, actions, reporter }) => { } // Create blog post pages. const posts = result.data.allMdx.edges + const docsTemplate = path.resolve(`./src/templates/Docs.tsx`) // you'll call `createPage` for each result posts.forEach(({ node }, index) => { - createPage({ - // This is the slug you created before - // (or `node.frontmatter.slug`) - path: node.fields.slug, - // This component will wrap our MDX content - component: path.resolve(`./src/templates/Docs.tsx`), - // You can use the values in this context in - // our page layout component - context: { id: node.id }, - }) + !node.internal.contentFilePath.includes('api') && + createPage({ + // This is the slug you created before + // (or `node.frontmatter.slug`) + path: node.fields.slug, + // This component will wrap our MDX content + component: `${docsTemplate}?__contentFilePath=${node.internal.contentFilePath}`, + // You can use the values in this context in + // our page layout component + context: { id: node.id }, + }) }) createRedirect({ fromPath: `/`, diff --git a/packages/docs/package.json b/packages/docs/package.json index 5c650ebc..e9f821db 100644 --- a/packages/docs/package.json +++ b/packages/docs/package.json @@ -16,7 +16,7 @@ "scripts": { "api": "rimraf \"content/api/*\" & node build/api.js", "build": "gatsby build", - "develop": "gatsby develop", + "develop": "NODE_OPTIONS=--max-old-space-size=8192 gatsby develop", "dist": "run-s api build", "format": "prettier --write \"**/*.{js,jsx,ts,tsx,json,md}\"", "start": "gatsby develop", @@ -26,26 +26,26 @@ "dependencies": { "@coreui/chartjs": "^3.0.0", "@coreui/coreui": "^4.2.4", - "@coreui/icons": "^2.1.0", + "@coreui/icons": "^3.0.0-0", "@coreui/icons-react": "^2.0.0", "@coreui/react-chartjs": "^2.0.0", - "@mdx-js/mdx": "^1.6.22", - "@mdx-js/react": "^1.6.22", + "@mdx-js/mdx": "^2.2.1", + "@mdx-js/react": "^2.2.1", "@types/react-helmet": "^6.1.6", - "gatsby": "^4.25.0", - "gatsby-plugin-google-gtag": "^4.25.0", - "gatsby-plugin-image": "^2.25.0", - "gatsby-plugin-manifest": "^4.25.0", - "gatsby-plugin-mdx": "^3.18.0", - "gatsby-plugin-offline": "^5.25.0", - "gatsby-plugin-react-helmet": "^5.25.0", - "gatsby-plugin-sass": "^5.25.0", - "gatsby-plugin-sharp": "^4.25.0", - "gatsby-plugin-sitemap": "^5.25.0", - "gatsby-remark-autolink-headers": "^5.25.0", + "gatsby": "^5.4.2", + "gatsby-plugin-google-gtag": "^5.4.0", + "gatsby-plugin-image": "^3.4.0", + "gatsby-plugin-manifest": "^5.4.0", + "gatsby-plugin-mdx": "^5.4.0", + "gatsby-plugin-offline": "^6.4.0", + "gatsby-plugin-react-helmet": "^6.4.0", + "gatsby-plugin-sass": "^6.4.0", + "gatsby-plugin-sharp": "^5.4.0", + "gatsby-plugin-sitemap": "^6.4.0", + "gatsby-remark-autolink-headers": "^6.4.0", "gatsby-remark-external-links": "^0.0.4", - "gatsby-source-filesystem": "^4.25.0", - "gatsby-transformer-sharp": "^4.25.0", + "gatsby-source-filesystem": "^5.4.0", + "gatsby-transformer-sharp": "^5.4.0", "glob": "^7.2.0", "globby": "^11.0.4", "prism-react-renderer": "^1.3.5", @@ -55,7 +55,6 @@ "react-docgen-typescript": "^2.2.2", "react-dom": "^18.2.0", "react-helmet": "^6.1.0", - "remark-html": "^13.0.2", "rimraf": "^3.0.2", "sass": "^1.57.0" }, diff --git a/packages/docs/src/components/Ads.tsx b/packages/docs/src/components/Ads.tsx index 859a2aa9..b784e957 100644 --- a/packages/docs/src/components/Ads.tsx +++ b/packages/docs/src/components/Ads.tsx @@ -1,6 +1,11 @@ import React, { FC, useEffect, useRef } from 'react' -const Ads: FC = ({ code, placement }: { code: string; placement: string }) => { +interface AdsProps { + code: string + placement: string +} + +export const Ads: FC = ({ code, placement }) => { const ref = useRef(null) useEffect(() => { diff --git a/packages/docs/src/components/Banner.tsx b/packages/docs/src/components/Banner.tsx new file mode 100644 index 00000000..0d72e99b --- /dev/null +++ b/packages/docs/src/components/Banner.tsx @@ -0,0 +1,55 @@ +import React, { FC } from 'react' +import { CLink } from '@coreui/react/src/index' + +interface BannerProps { + pro: boolean +} + +const Banner: FC = ({ pro }) => { + return pro ? ( +
+

CoreUI PRO Component

+

+ To use this component you must have a CoreUI PRO license. Buy the{' '} + CoreUI PRO{' '} + and get access to all PRO components, features, templates, and dedicated support. +

+
+ ) : ( +
+

Support CoreUI Development

+

+ 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:

+
    +
  • + Buy the{' '} + + CoreUI PRO + + , and get access to PRO components, and dedicated support. +
    • +
  • + + Became a sponsor + + , and get your logo on BACKERS.md/README.md files or each site of this documentation +
    • +
  • + Give us a star ⭐️ on{' '} + + Github + + . +
    • +
+
+ ) +} + +Banner.displayName = 'Banner' + +export default Banner diff --git a/packages/docs/src/components/CodeBlock.tsx b/packages/docs/src/components/CodeBlock.tsx index 310e0c48..ad8a457f 100644 --- a/packages/docs/src/components/CodeBlock.tsx +++ b/packages/docs/src/components/CodeBlock.tsx @@ -2,8 +2,12 @@ import React, { FC } from 'react' import PropTypes from 'prop-types' import Highlight, { defaultProps } from 'prism-react-renderer' -const CodeBlock: FC = ({ children }) => { - const _children = children.props.children +interface CodeBlockProps { + children: any +} + +const CodeBlock: FC = ({ children }) => { + const _children = children && children.props.children const language = children.props.className ? children.props.className.replace(/language-/, '') : 'jsx' diff --git a/packages/docs/src/components/Example.tsx b/packages/docs/src/components/Example.tsx index 07f32a1c..ffbae0d4 100644 --- a/packages/docs/src/components/Example.tsx +++ b/packages/docs/src/components/Example.tsx @@ -1,7 +1,6 @@ -import React, { FC } from 'react' -import PropTypes from 'prop-types' - +import React, { FC, ReactNode } from 'react' interface ExampleProps { + children: ReactNode className: string } @@ -18,10 +17,6 @@ const Example: FC = ({ children, className, ...rest }) => { ) } -Example.propTypes = { - className: PropTypes.string, -} - Example.displayName = 'Example' export default Example diff --git a/packages/docs/src/components/Seo.tsx b/packages/docs/src/components/Seo.tsx index 5320ad6c..14ed6cbb 100644 --- a/packages/docs/src/components/Seo.tsx +++ b/packages/docs/src/components/Seo.tsx @@ -4,7 +4,19 @@ import { Helmet } from 'react-helmet' import { useLocation } from '@reach/router' import { useStaticQuery, graphql } from 'gatsby' -const SEO = ({ title, description, name, image, article }) => { +const SEO = ({ + title, + description, + name, + image, + article, +}: { + title: string + description: string + name: string + image: string + article: string +}) => { const { pathname } = useLocation() const { site } = useStaticQuery(query) diff --git a/packages/docs/src/components/Toc.tsx b/packages/docs/src/components/Toc.tsx index 3db66854..f2a2cb7c 100644 --- a/packages/docs/src/components/Toc.tsx +++ b/packages/docs/src/components/Toc.tsx @@ -1,11 +1,19 @@ import React, { FC } from 'react' -import PropTypes from 'prop-types' import { CNav } from '@coreui/react/src/index' -const Toc: FC = (props) => { - const { items } = props +type TocItem = { + url: string + title: string + items: TocItem[] +} + +interface TocProps { + items: TocItem[] +} - const toc = (items) => { +const Toc: FC = ({ items }) => { + console.log(items) + const toc = (items: TocItem[]) => { return ( items && items.map((item, index) => { @@ -30,14 +38,10 @@ const Toc: FC = (props) => {
On this page -
    {toc(items.items)}
+
    {toc(items)}
) } -Toc.propTypes = { - item: PropTypes.node, -} - export default Toc diff --git a/packages/docs/src/components/index.ts b/packages/docs/src/components/index.ts index 8e7d482f..b38bdbf0 100644 --- a/packages/docs/src/components/index.ts +++ b/packages/docs/src/components/index.ts @@ -1,4 +1,5 @@ import Ads from './Ads' +import Banner from './Banner' import CodeBlock from './CodeBlock' import Example from './Example' import Footer from './Footer' @@ -9,4 +10,4 @@ import Sidebar from './Sidebar' import { SidebarNav } from './SidebarNav' import Toc from './Toc' -export { Ads, CodeBlock, Example, Footer, Header, ScssDocs, Seo, Sidebar, SidebarNav, Toc } +export { Ads, Banner, CodeBlock, Example, Footer, Header, ScssDocs, Seo, Sidebar, SidebarNav, Toc } diff --git a/packages/docs/src/templates/other_frameworks.json b/packages/docs/src/data/other_frameworks.json similarity index 100% rename from packages/docs/src/templates/other_frameworks.json rename to packages/docs/src/data/other_frameworks.json diff --git a/packages/docs/src/styles/_example.scss b/packages/docs/src/styles/_example.scss index 22dc00ff..52b17199 100644 --- a/packages/docs/src/styles/_example.scss +++ b/packages/docs/src/styles/_example.scss @@ -135,6 +135,17 @@ margin-left: .5rem; } + // Badges + > .btn + .btn { + margin-left: .25rem; + } + > br + .btn { + margin-top: .25rem; + } + > .badge + .badge { + margin-left: .25rem; + } + // Buttons > .btn, > .btn-group { diff --git a/packages/docs/src/templates/Docs.tsx b/packages/docs/src/templates/Docs.tsx index aae88290..9fc53fb2 100644 --- a/packages/docs/src/templates/Docs.tsx +++ b/packages/docs/src/templates/Docs.tsx @@ -2,20 +2,26 @@ import React, { FC, useState } from 'react' import PropTypes from 'prop-types' import { graphql } from 'gatsby' import { MDXProvider } from '@mdx-js/react' -import { MDXRenderer } from 'gatsby-plugin-mdx' -import { Ads, CodeBlock, Example, Footer, Header, Seo, Sidebar, Toc } from './../components/' -import { CCol, CContainer, CLink, CRow, CTable } from '@coreui/react' +import { CBadge, CCol, CContainer, CRow, CTable } from '@coreui/react/src/index' +import { + Ads, + Banner, + CodeBlock, + Example, + Footer, + Header, + Seo, + Sidebar, + Toc, +} from './../components/' import './../styles/styles.scss' -import jsonData from './other_frameworks.json' +import jsonData from './../data/other_frameworks.json' import { AppContext } from './../AppContext' -const components = { - // eslint-disable-next-line react/display-name - pre: (props: any) => , - // eslint-disable-next-line react/display-name - table: (props: any) => , - Example, +interface DocsLayoutProps { + data: any + children: any } const humanize = (text: string) => { @@ -28,7 +34,7 @@ const humanize = (text: string) => { return string[0].toUpperCase() + string.slice(1) } -const DocsLayout: FC = ({ data: { mdx } }: { data: any }) => { +const DocsLayout: FC = ({ data: { mdx }, children }) => { const [sidebarVisible, setSidebarVisible] = useState() const frameworks = mdx.frontmatter.other_frameworks ? mdx.frontmatter.other_frameworks.split(', ') @@ -39,7 +45,6 @@ const DocsLayout: FC = ({ data: { mdx } }: { data: any }) => { return ( { - {mdx.frontmatter.pro_component ? ( -
-

CoreUI PRO Component

-

- To use this component you must have a CoreUI PRO license. Buy the{' '} - - CoreUI PRO - {' '} - and get access to all PRO components, features, templates, and dedicated - support. -

-
- ) : ( -
-

Support CoreUI Development

-

- 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: -

-
    -
  • - Buy the{' '} - - CoreUI PRO - - , and get access to PRO components, and dedicated support. -
    • -
  • - - Became a sponsor - - , and get your logo on BACKERS.md/README.md files or each site of this - documentation -
    • -
  • - Give us a star ⭐️ on{' '} - - Github - - . -
    • -
-
- )} +

{mdx.frontmatter.title}

{mdx.frontmatter.description}

@@ -134,12 +92,35 @@ const DocsLayout: FC = ({ data: { mdx } }: { data: any }) => { )} - - {mdx.body} + { + if (props.children.type == 'em') { + const color = props.children.props.children.includes('Deprecated') + ? 'warning' + : 'primary' + return ( + <> +
+ + + ) + } else { + return {props.children} + } + }, + pre: (props: any) => , + table: (props: any) => ( + + ), + Example, + }} + > + {children} - + @@ -168,7 +149,6 @@ export const pageQuery = graphql` } mdx(id: { eq: $id }) { id - body frontmatter { title description diff --git a/packages/gatsby-remark-import-markdown/index.js b/packages/gatsby-remark-import-markdown/index.js new file mode 100755 index 00000000..d1688bfe --- /dev/null +++ b/packages/gatsby-remark-import-markdown/index.js @@ -0,0 +1,86 @@ +/* eslint-disable @typescript-eslint/no-var-requires */ +'use strict' + +const fs = require('fs') +const normalizePath = require('normalize-path') +const visit = require('unist-util-visit') +const unified = require('unified') +const parse = require('remark-parse') +const remarkGfm = require('remark-gfm') +const html = require('remark-html') + +module.exports = ({ markdownAST }, pluginOptions = {}) => { + const directory = pluginOptions.directory + + if (!directory) { + throw Error(`Required option \"directory\" not specified`) + } else if (!fs.existsSync(directory)) { + throw Error(`Invalid directory specified \"${directory}\"`) + } else if (!directory.endsWith('/')) { + directory += '/' + } + + visit(markdownAST, 'inlineCode', (node, _, parent) => { + const value = node.value + + if (value.startsWith('markdown:')) { + const file = value.substr(9) + const path = normalizePath('' + directory + file) + + if (!fs.existsSync(path)) { + throw Error(`Invalid fragment specified; no such file "${path}"`) + } + + const code = fs.readFileSync(path, 'utf8') + const markdown = unified() + .use(parse) + .use(remarkGfm) + .use(html, { sanitize: false }) + .parse(code) + + parent.type = 'div' + parent.children = [] + + markdown.children.forEach((child) => { + delete child.position + parent.children.push(child) + }) + } + }) + + // visit(markdownAST, 'code', (node) => { + // if (node.meta && node.meta.includes('preview')) { + // const value = node.value + // const className = /className="(.*)"/.test(node.meta) ? RegExp.$1 : '' + // const tree = fromMarkdown(value.replace(/(\r\n|\n|\r)/gm, ''), { + // extensions: [syntax({ acorn: acorn, addResult: true }), mdxMd], + // mdastExtensions: [mdxJsx.fromMarkdown], + // }) + + // delete node.value + // delete node.position + // delete node.lang + // delete node.meta + + // node.type = 'div' + // node.children = [ + // { + // type: 'mdxJsxFlowElement', + // name: 'Example', + // attributes: [{ type: 'mdxJsxAttribute', name: 'className', value: className }], + // children: + // tree.children[0].type === 'paragraph' + // ? tree.children[0].children.map((child) => child) + // : tree.children.map((child) => child), + // }, + // { + // type: 'code', + // lang: 'jsx', + // value: value, + // }, + // ] + // } + // }) + + return markdownAST +} diff --git a/packages/gatsby-remark-import-markdown/package.json b/packages/gatsby-remark-import-markdown/package.json new file mode 100644 index 00000000..84f9c71d --- /dev/null +++ b/packages/gatsby-remark-import-markdown/package.json @@ -0,0 +1,31 @@ +{ + "name": "gatsby-remark-import-markdown", + "license": "MIT", + "version": "1.0.0", + "author": "Łukasz Holeczek ", + "repository": "", + "keywords": [ + "markdown", + "embed", + "gatsby", + "gatsby-plugin", + "remark" + ], + "description": "Gatsby plugin to embed markdown fragments within markdown", + "dependencies": { + "normalize-path": "^2.1.1", + "unist-util-map": "^1.0.3", + "unist-util-visit": "^2.0.3", + "unified": "^9.2.1", + "remark-gfm": "^1.0.0", + "remark-html": "^13.0.2", + "remark-parse": "^9.0.0", + "remark-rehype": "^8.1.0", + "rehype-stringify": "^8.0.0" + }, + "scripts": {}, + "peerDependencies": { + "gatsby": ">=5.0.0" + }, + "main": "index.js" +} diff --git a/packages/gatsby-remark-jsx-preview/index.js b/packages/gatsby-remark-jsx-preview/index.js new file mode 100755 index 00000000..48dc85cb --- /dev/null +++ b/packages/gatsby-remark-jsx-preview/index.js @@ -0,0 +1,47 @@ +/* eslint-disable @typescript-eslint/no-var-requires */ +'use strict' + +const acorn = require('acorn') +const fromMarkdown = require('mdast-util-from-markdown') +const mdxJsx = require('mdast-util-mdx-jsx') +const mdxMd = require('micromark-extension-mdx-md') +const syntax = require('micromark-extension-mdx-jsx') +const visit = require('unist-util-visit') + +module.exports = ({ markdownAST }) => { + visit(markdownAST, 'code', (node) => { + if (node.meta && node.meta.includes('preview')) { + const value = node.value + const className = /className="(.*)"/.test(node.meta) ? RegExp.$1 : '' + const tree = fromMarkdown(value.replace(/(\r\n|\n|\r)/gm, ''), { + extensions: [syntax({ acorn: acorn, addResult: true }), mdxMd], + mdastExtensions: [mdxJsx.fromMarkdown], + }) + + delete node.value + delete node.position + delete node.lang + delete node.meta + + node.type = 'div' + node.children = [ + { + type: 'mdxJsxFlowElement', + name: 'Example', + attributes: [{ type: 'mdxJsxAttribute', name: 'className', value: className }], + children: + tree.children[0].type === 'paragraph' + ? tree.children[0].children.map((child) => child) + : tree.children.map((child) => child), + }, + { + type: 'code', + lang: 'jsx', + value: value, + }, + ] + } + }) + + return markdownAST +} diff --git a/packages/gatsby-remark-jsx-preview/package.json b/packages/gatsby-remark-jsx-preview/package.json new file mode 100644 index 00000000..f21a9d2f --- /dev/null +++ b/packages/gatsby-remark-jsx-preview/package.json @@ -0,0 +1,26 @@ +{ + "name": "gatsby-remark-jsx-preview", + "license": "MIT", + "version": "1.0.0", + "author": "Łukasz Holeczek ", + "repository": "", + "keywords": [ + "code", + "jsx", + "gatsby", + "gatsby-plugin", + "remark" + ], + "description": "Gatsby plugin to embed jsx code preview", + "dependencies": { + "mdast-util-from-markdown": "^0.8.5", + "micromark-extension-mdx-jsx": "^0.3.3", + "micromark-extension-mdx-md": "^0.1.1", + "mdast-util-mdx-jsx": "^0.1.4", + "unist-util-visit": "^2.0.3" + }, + "peerDependencies": { + "gatsby": ">=5.0.0" + }, + "main": "index.js" +} From 048ec104fa4a0fb0f1f3041e486639015c8b2d6c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=81ukasz=20Holeczek?= Date: Mon, 23 Jan 2023 18:06:30 +0100 Subject: [PATCH 009/452] docs: update examples --- .../docs/content/components/accordion.mdx | 120 +-- packages/docs/content/components/alert.mdx | 225 ++--- packages/docs/content/components/avatar.mdx | 81 +- packages/docs/content/components/badge.mdx | 107 +-- .../docs/content/components/breadcrumb.mdx | 46 +- .../docs/content/components/button-group.mdx | 400 +------- packages/docs/content/components/button.mdx | 240 +---- packages/docs/content/components/callout.mdx | 37 +- packages/docs/content/components/card.mdx | 856 ++---------------- packages/docs/content/components/carousel.mdx | 100 +- packages/docs/content/components/chart.mdx | 182 +--- .../docs/content/components/close-button.mdx | 19 +- packages/docs/content/components/dropdown.mdx | 405 +-------- packages/docs/content/components/footer.mdx | 17 +- packages/docs/content/components/icon.mdx | 1 + packages/docs/content/components/image.mdx | 49 +- .../docs/content/components/list-group.mdx | 190 +--- packages/docs/content/components/modal.mdx | 21 +- packages/docs/content/components/navbar.mdx | 194 +--- .../docs/content/components/navs-tabs.mdx | 270 +----- .../docs/content/components/offcanvas.mdx | 15 +- .../docs/content/components/pagination.mdx | 92 +- .../docs/content/components/placeholder.mdx | 101 +-- packages/docs/content/components/progress.mdx | 214 ++--- packages/docs/content/components/sidebar.mdx | 29 +- packages/docs/content/components/spinner.mdx | 69 +- packages/docs/content/components/toast.mdx | 131 +-- packages/docs/content/forms/checkbox.mdx | 96 +- packages/docs/content/forms/checks-radios.mdx | 274 +----- .../docs/content/forms/floating-labels.mdx | 135 +-- packages/docs/content/forms/form-control.mdx | 116 +-- packages/docs/content/forms/input-group.mdx | 322 +------ packages/docs/content/forms/input.mdx | 177 +--- packages/docs/content/forms/layout.mdx | 230 +---- packages/docs/content/forms/radio.mdx | 158 +--- packages/docs/content/forms/range.mdx | 24 +- packages/docs/content/forms/select.mdx | 68 +- packages/docs/content/forms/switch.mdx | 22 +- packages/docs/content/forms/textarea.mdx | 33 +- packages/docs/content/forms/validation.mdx | 224 +---- packages/docs/content/layout/columns.mdx | 233 +---- packages/docs/content/layout/containers.mdx | 20 - packages/docs/content/layout/grid.mdx | 16 +- packages/docs/content/layout/gutters.mdx | 122 +-- 44 files changed, 596 insertions(+), 5885 deletions(-) diff --git a/packages/docs/content/components/accordion.mdx b/packages/docs/content/components/accordion.mdx index e78c74b6..951d9523 100644 --- a/packages/docs/content/components/accordion.mdx +++ b/packages/docs/content/components/accordion.mdx @@ -22,45 +22,7 @@ import { Click the accordions below to expand/collapse the accordion content. - - - - Accordion Item #1 - - This is the first item's accordion body. It is hidden by default, until the - collapse plugin adds the appropriate classes that we use to style each element. These - classes control the overall appearance, as well as the showing and hiding via CSS - transitions. You can modify any of this with custom CSS or overriding our default variables. - It's also worth noting that just about any HTML can go within the{' '} - .accordion-body, though the transition does limit overflow. - - - - Accordion Item #2 - - This is the second item's accordion body. It is hidden by default, until - the collapse plugin adds the appropriate classes that we use to style each element. These - classes control the overall appearance, as well as the showing and hiding via CSS - transitions. You can modify any of this with custom CSS or overriding our default variables. - It's also worth noting that just about any HTML can go within the{' '} - .accordion-body, though the transition does limit overflow. - - - - Accordion Item #3 - - This is the second item's accordion body. It is hidden by default, until - the collapse plugin adds the appropriate classes that we use to style each element. These - classes control the overall appearance, as well as the showing and hiding via CSS - transitions. You can modify any of this with custom CSS or overriding our default variables. - It's also worth noting that just about any HTML can go within the{' '} - .accordion-body, though the transition does limit overflow. - - - - - -```jsx +```jsx preview Accordion Item #1 @@ -102,45 +64,7 @@ Click the accordions below to expand/collapse the accordion content. Add `flush` to remove the default `background-color`, some borders, and some rounded corners to render accordions edge-to-edge with their parent container. - - - - Accordion Item #1 - - This is the first item's accordion body. It is hidden by default, until the - collapse plugin adds the appropriate classes that we use to style each element. These - classes control the overall appearance, as well as the showing and hiding via CSS - transitions. You can modify any of this with custom CSS or overriding our default variables. - It's also worth noting that just about any HTML can go within the{' '} - .accordion-body, though the transition does limit overflow. - - - - Accordion Item #2 - - This is the second item's accordion body. It is hidden by default, until - the collapse plugin adds the appropriate classes that we use to style each element. These - classes control the overall appearance, as well as the showing and hiding via CSS - transitions. You can modify any of this with custom CSS or overriding our default variables. - It's also worth noting that just about any HTML can go within the{' '} - .accordion-body, though the transition does limit overflow. - - - - Accordion Item #3 - - This is the third item's accordion body. It is hidden by default, until the - collapse plugin adds the appropriate classes that we use to style each element. These - classes control the overall appearance, as well as the showing and hiding via CSS - transitions. You can modify any of this with custom CSS or overriding our default variables. - It's also worth noting that just about any HTML can go within the{' '} - .accordion-body, though the transition does limit overflow. - - - - - -```jsx +```jsx preview Accordion Item #1 @@ -182,45 +106,7 @@ Add `flush` to remove the default `background-color`, some borders, and some rou Add `alwaysOpen` property to make react accordion items stay open when another item is opened. - - - - Accordion Item #1 - - This is the first item's accordion body. It is hidden by default, until the - collapse plugin adds the appropriate classes that we use to style each element. These - classes control the overall appearance, as well as the showing and hiding via CSS - transitions. You can modify any of this with custom CSS or overriding our default variables. - It's also worth noting that just about any HTML can go within the{' '} - .accordion-body, though the transition does limit overflow. - - - - Accordion Item #2 - - This is the second item's accordion body. It is hidden by default, until - the collapse plugin adds the appropriate classes that we use to style each element. These - classes control the overall appearance, as well as the showing and hiding via CSS - transitions. You can modify any of this with custom CSS or overriding our default variables. - It's also worth noting that just about any HTML can go within the{' '} - .accordion-body, though the transition does limit overflow. - - - - Accordion Item #3 - - This is the second item's accordion body. It is hidden by default, until - the collapse plugin adds the appropriate classes that we use to style each element. These - classes control the overall appearance, as well as the showing and hiding via CSS - transitions. You can modify any of this with custom CSS or overriding our default variables. - It's also worth noting that just about any HTML can go within the{' '} - .accordion-body, though the transition does limit overflow. - - - - - -```jsx +```jsx preview Accordion Item #1 diff --git a/packages/docs/content/components/alert.mdx b/packages/docs/content/components/alert.mdx index 33e857dd..8976dc28 100644 --- a/packages/docs/content/components/alert.mdx +++ b/packages/docs/content/components/alert.mdx @@ -8,13 +8,7 @@ other_frameworks: alert --- import { useState } from 'react' -import { - CAlert, - CAlertHeading, - CAlertLink, - CButton, - CCallout, -} from '@coreui/react/src/index' +import { CAlert, CAlertHeading, CAlertLink, CButton, CCallout } from '@coreui/react/src/index' import CIcon from '@coreui/icons-react' @@ -24,34 +18,7 @@ import { cilBurn, cilCheckCircle, cilInfo, cilWarning } from '@coreui/icons' React Alert is prepared for any length of text, as well as an optional close button. For a styling, use one of the **required** contextual `color` props (e.g., `primary`). For inline dismissal, use the [dismissing prop](#dismissing). - - - A simple primary alert—check it out! - - - A simple secondary alert—check it out! - - - A simple success alert—check it out! - - - A simple danger alert—check it out! - - - A simple warning alert—check it out! - - - A simple info alert—check it out! - - - A simple light alert—check it out! - - - A simple dark alert—check it out! - - - -```jsx +```jsx preview A simple primary alert—check it out! @@ -81,7 +48,10 @@ React Alert is prepared for any length of text, as well as an optional close but
Conveying meaning to assistive technologies

- Using color to add meaning only provides a visual indication, which will not be conveyed to users of assistive technologies – such as screen readers. Ensure that information denoted by the color is either obvious from the content itself (e.g. the visible text), or is included through alternative means, such as additional text hidden with the `.visually-hidden` class. + Using color to add meaning only provides a visual indication, which will not be conveyed to + users of assistive technologies – such as screen readers. Ensure that information denoted by the + color is either obvious from the content itself (e.g. the visible text), or is included through + alternative means, such as additional text hidden with the `.visually-hidden` class.

@@ -93,7 +63,8 @@ export const LiveExample = () => { const [visible, setVisible] = useState(false) return ( <> - setVisible(false)}>A simple primary alert—check it out! + setVisible(false)}>A simple primary alert—check it out! + setVisible(true)}>Show live alert ) @@ -107,8 +78,12 @@ export const LiveExample = () => { const [visible, setVisible] = useState(false) return ( <> - setVisible(false)}>A simple primary alert—check it out! - setVisible(true)}>Show live alert + setVisible(false)}> + A simple primary alert—check it out! + + setVisible(true)}> + Show live alert + ) ``` @@ -117,34 +92,7 @@ return ( Use the `` component to immediately give matching colored links inside any react alert component. - - - A simple primary alert with an example link. Give it a click if you like. - - - A simple secondary alert with an example link. Give it a click if you like. - - - A simple success alert with an example link. Give it a click if you like. - - - A simple danger alert with an example link. Give it a click if you like. - - - A simple warning alert with an example link. Give it a click if you like. - - - A simple info alert with an example link. Give it a click if you like. - - - A simple light alert with an example link. Give it a click if you like. - - - A simple dark alert with an example link. Give it a click if you like. - - - -```jsx +```jsx preview A simple primary alert with an example link. Give it a click if you like. @@ -175,21 +123,17 @@ Use the `` component to immediately give matching colored links insi React Alert can also incorporate supplementary components & elements like heading, paragraph, and divider. - - - Well done! -

Aww yeah, you successfully read this important alert message. This example text is going to run a bit longer so that you can see how spacing within an alert works with this kind of content.

-
-

Whenever you need to, be sure to use margin utilities to keep things nice and tidy.

- - - -```jsx +```jsx preview Well done! -

Aww yeah, you successfully read this important alert message. This example text is going to run a bit longer so that you can see how spacing within an alert works with this kind of content.

+

+ Aww yeah, you successfully read this important alert message. This example text is going to run + a bit longer so that you can see how spacing within an alert works with this kind of content. +

-

Whenever you need to, be sure to use margin utilities to keep things nice and tidy.

+

+ Whenever you need to, be sure to use margin utilities to keep things nice and tidy. +

``` @@ -197,81 +141,53 @@ React Alert can also incorporate supplementary components & elements like he Similarly, you can use [flexbox utilities](https//coreui.io/docs/4.0/utilities/flex") and [CoreUI Icons](https://icons.coreui.io) to create react alerts with icons. Depending on your icons and content, you may want to add more utilities or custom styles. - - - - - -
- An example alert with an icon -
- - - -```jsx +```jsx preview - + + + -
- An example alert with an icon -
+
An example alert with an icon
 ``` Need more than one icon for your react alerts? Consider using [CoreUI Icons](https://icons.coreui.io). - - - -
- An example alert with an icon -
- - - -
- An example success alert with an icon -
- - - -
- An example warning alert with an icon -
- - - -
- An example danger alert with an icon -
- - - -```jsx +```jsx preview -
- An example alert with an icon -
+
An example alert with an icon
 -
- An example success alert with an icon -
+
An example success alert with an icon
 -
- An example warning alert with an icon -
+
An example warning alert with an icon
 -
- An example danger alert with an icon -
+
An example danger alert with an icon
 ``` @@ -279,18 +195,7 @@ Need more than one icon for your react alerts? Consider using [CoreUI Icons](htt Use `variant="solid"` to change contextual colors to solid. - - A simple solid primary alert—check it out! - A simple solid secondary alert—check it out! - A simple solid success alert—check it out! - A simple solid danger alert—check it out! - A simple solid warning alert—check it out! - A simple solid info alert—check it out! - A simple solid light alert—check it out! - A simple solid dark alert—check it out! - - -```jsx +```jsx preview A simple solid primary alert—check it out! A simple solid secondary alert—check it out! A simple solid success alert—check it out! @@ -305,24 +210,12 @@ Use `variant="solid"` to change contextual colors to solid. React Alert component can also be easily dismissed. Just add the `dismissible` prop. - - { - alert("👋 Well, hi there! Thanks for dismissing me."); - }} - > - Go right ahead and click that dimiss over there on the right. - - - -```jsx +```jsx preview { - alert("👋 Well, hi there! Thanks for dismissing me."); + alert('👋 Well, hi there! Thanks for dismissing me.') }} > Go right ahead and click that dimiss over there on the right. @@ -331,7 +224,9 @@ React Alert component can also be easily dismissed. Just add the `dismissible` p

- When an alert is dismissed, the element is completely removed from the page structure. If a keyboard user dismisses the alert using the close button, their focus will suddenly be lost and, depending on the browser, reset to the start of the page/document. + When an alert is dismissed, the element is completely removed from the page structure. If a + keyboard user dismisses the alert using the close button, their focus will suddenly be lost and, + depending on the browser, reset to the start of the page/document.

@@ -355,9 +250,9 @@ React alerts use local CSS variables on `.alert` for enhanced real-time customiz #### How to use CSS variables ```jsx -const vars = { +const vars = { '--my-css-var': 10, - '--my-another-css-var': "red" + '--my-another-css-var': 'red', } return ... ``` @@ -389,4 +284,4 @@ $alert-dismissible-padding-r: $alert-padding-x * 3; // 3x covers width of x pl ### CAlertLink -`markdown:CAlertLink.api.mdx` \ No newline at end of file +`markdown:CAlertLink.api.mdx` diff --git a/packages/docs/content/components/avatar.mdx b/packages/docs/content/components/avatar.mdx index adbe64e0..0e06b6ec 100644 --- a/packages/docs/content/components/avatar.mdx +++ b/packages/docs/content/components/avatar.mdx @@ -15,32 +15,15 @@ import Avatar3 from './../assets/images/avatars/3.jpg' ## Image avatars - - - - - - -```jsx - - - +```jsx preview + + + ``` ## Letter avatars - - - CUI - - CUI - - CUI - - - - -```jsx +```jsx preview CUI CUI CUI @@ -50,19 +33,7 @@ import Avatar3 from './../assets/images/avatars/3.jpg' Use the `shape="rounded"` prop to make react avatars squared with rounded corners. - - - CUI - - - CUI - - - CUI - - - -```jsx +```jsx preview CUI CUI CUI @@ -72,19 +43,7 @@ Use the `shape="rounded"` prop to make react avatars squared with rounded corner Use the `shape="rounded-0"` prop to make react avatars squared. - - - CUI - - - CUI - - - CUI - - - -```jsx +```jsx preview CUI CUI CUI @@ -94,20 +53,7 @@ Use the `shape="rounded-0"` prop to make react avatars squared. Fancy larger or smaller react avatar component? Add `size="xl"`, `size="lg"` or `size="sm"` for additional sizes. - - - CUI - - - CUI - - CUI - - CUI - - - -```jsx +```jsx preview CUI CUI CUI @@ -116,15 +62,8 @@ Fancy larger or smaller react avatar component? Add `size="xl"`, `size="lg"` or ## Avatars with status - - - - CUI - - - -```jsx - +```jsx preview + CUI ``` diff --git a/packages/docs/content/components/badge.mdx b/packages/docs/content/components/badge.mdx index 741fc8cc..894a7959 100644 --- a/packages/docs/content/components/badge.mdx +++ b/packages/docs/content/components/badge.mdx @@ -13,16 +13,7 @@ import { CBadge, CButton } from '@coreui/react/src/index' React badge component scales to suit the size of the parent element by using relative font sizing and `em` units. - -

Example heading New

-

Example heading New

-

Example heading New

-

Example heading New

-
Example heading New
-
Example heading New
- - -```jsx +```jsx preview

Example heading New

Example heading New

Example heading New

@@ -33,13 +24,7 @@ React badge component scales to suit the size of the parent element by using rel React badges can be used as part of links or buttons to provide a counter. - - - Notifications 4 - - - -```jsx +```jsx preview Notifications 4 @@ -49,14 +34,7 @@ Remark that depending on how you use them, react badges may be complicated for u Unless the context is clear, consider including additional context with a visually hidden piece of additional text. - - - Profile 9 - unread messages - - - -```jsx +```jsx preview Profile 9 unread messages @@ -67,35 +45,7 @@ Unless the context is clear, consider including additional context with a visual Use `position` prop to modify a component and position it in the corner of a link or button. - - - Profile - - 99+ unread messages - - - - Profile - - 99+ unread messages - - -
- - Profile - - 99+ unread messages - - - - Profile - - 99+ unread messages - - - - -```jsx +```jsx preview Profile @@ -108,6 +58,7 @@ Use `position` prop to modify a component and position it in the corner of a lin 99+ unread messages +
Profile @@ -124,19 +75,15 @@ Use `position` prop to modify a component and position it in the corner of a lin You can also create more generic indicators without a counter using a few more utilities. - - - Profile - - New alerts - - - - -```jsx +```jsx preview Profile - + New alerts @@ -146,17 +93,7 @@ You can also create more generic indicators without a counter using a few more u Add any of the below-mentioned `color` props to modify the presentation of a react badge. - - primary - success - danger - warning - info - light - dark - - -```jsx +```jsx preview primary success danger @@ -170,17 +107,7 @@ Add any of the below-mentioned `color` props to modify the presentation of a rea Apply the `shape="rounded-pill"` prop to make badges rounded. - - primary - success - danger - warning - info - light - dark - - -```jsx +```jsx preview primary success danger @@ -208,9 +135,9 @@ React badges use local CSS variables on `.badges` for enhanced real-time customi #### How to use CSS variables ```jsx -const vars = { +const vars = { '--my-css-var': 10, - '--my-another-css-var': "red" + '--my-another-css-var': 'red', } return ... ``` @@ -234,4 +161,4 @@ $badge-padding-x-sm: .5em; ### CBadge -`markdown:CBadge.api.mdx` \ No newline at end of file +`markdown:CBadge.api.mdx` diff --git a/packages/docs/content/components/breadcrumb.mdx b/packages/docs/content/components/breadcrumb.mdx index cb09d251..6c27a8a6 100644 --- a/packages/docs/content/components/breadcrumb.mdx +++ b/packages/docs/content/components/breadcrumb.mdx @@ -13,24 +13,7 @@ import { CBreadcrumb, CBreadcrumbItem } from '@coreui/react/src/index' The react breadcrumb navigation provides links back to each previous page the user navigated through and shows the current location in a website or an application. You don’t have to add separators, because they automatically added in CSS through ::before and content. - - - Home - - - - Home - Library - - - - Home - Library - Data - - - -```jsx +```jsx preview Home @@ -51,14 +34,7 @@ The react breadcrumb navigation provides links back to each previous page the us Dividers are automatically added in CSS through [`::before`](https://developer.mozilla.org/en-US/docs/Web/CSS/::before) and [`content`](https://developer.mozilla.org/en-US/docs/Web/CSS/content). They can be changed by modifying a local CSS custom property `--coreui-breadcrumb-divider`, or through the `$breadcrumb-divider` Sass variable — and `$breadcrumb-divider-flipped` for its RTL counterpart, if needed. We default to our Sass variable, which is set as a fallback to the custom property. This way, you get a global divider that you can override without recompiling CSS at any time. - - '"}}> - Home - Library - - - -```jsx +```jsx preview '"}}> Home Library @@ -73,14 +49,7 @@ $breadcrumb-divider: quote(">"); It's also possible to use an **embedded SVG icon**. Apply it via our CSS custom property, or use the Sass variable. - - - Home - Library - - - -```jsx +```jsx preview Home Library @@ -94,14 +63,7 @@ width='8' height='8'%3E%3Cpath d='M2.5 0L1 1.5 3.5 4 1 6.5 2.5 8l4-4-4-4z' fill= You can also remove the divider setting `--cui-breadcrumb-divider: '';` (empty strings in CSS custom properties counts as a value), or setting the Sass variable to `$breadcrumb-divider: none;`. - - - Home - Library - - - -```jsx +```jsx preview Home Library diff --git a/packages/docs/content/components/button-group.mdx b/packages/docs/content/components/button-group.mdx index 81a74d81..9e018419 100644 --- a/packages/docs/content/components/button-group.mdx +++ b/packages/docs/content/components/button-group.mdx @@ -28,15 +28,7 @@ import { Wrap a series of `` components in ``. - - - Left - Middle - Right - - - -```jsx +```jsx preview Left Middle @@ -52,45 +44,17 @@ Besides, groups and toolbars should be provided an understandable label, as most These classes can also be added to groups of links, as an alternative to the `` components. - - - - Active link - - - Link - - - Link - - - - -```jsx +```jsx preview - - Active link - - - Link - - - Link - + Active link + Link + Link ``` ## Mixed styles - - - Left - Middle - Right - - - -```jsx +```jsx preview Left Middle @@ -100,31 +64,11 @@ These classes can also be added to groups of links, as an alternative to the ` - - - Left - - - Middle - - - Right - - - - -```jsx +```jsx preview - - Left - - - Middle - - - Right - + Left + Middle + Right ``` @@ -132,30 +76,7 @@ These classes can also be added to groups of links, as an alternative to the ` - - - - - - - -```jsx +```jsx preview ``` - - - - - - - - -```jsx +```jsx preview - - - 1 - 2 - 3 - 4 - - - 5 - 6 - 7 - - - 8 - - - - -```jsx +```jsx preview 1 @@ -280,62 +153,7 @@ Join sets of button groups into button toolbars for more complicated components. Feel free to combine input groups with button groups in your toolbars. Similar to the example above, you’ll likely need some utilities through to space items correctly. - - - - - 1 - - - 2 - - - 3 - - - 4 - - - - @ - - - - - - - 1 - - - 2 - - - 3 - - - 4 - - - - @ - - - - - -```jsx +```jsx preview 1 @@ -366,86 +184,31 @@ Feel free to combine input groups with button groups in your toolbars. Similar t Alternatively, of implementing button sizing classes to each button in a group, set `size` property to all ``'s, including each one when nesting multiple groups. - - - - Left - - - Middle - - - Right - - -
- - - Left - - - Middle - - - Right - - -
- - - Left - - - Middle - - - Right - - - - -```jsx - - Left - Middle - Right - -
- - Left - Middle - Right - -
- - Left - Middle - Right - +```jsx preview + + Left + Middle + Right + +
+ + Left + Middle + Right + +
+ + Left + Middle + Right + ``` ## Nesting Put a `` inside another `` when you need dropdown menus combined with a series of buttons. - - - 1 - 2 - - Dropdown - - Action - Another action - Something else here - - Separated link - - - - - -```jsx +```jsx preview 1 2 @@ -466,19 +229,7 @@ Put a `` inside another `` when you need dropdown me Create a set of buttons that appear vertically stacked rather than horizontally. **Split button dropdowns are not supported here.** - - - Button - Button - Button - Button - Button - Button - Button - - - -```jsx +```jsx preview Button Button @@ -490,56 +241,7 @@ Create a set of buttons that appear vertically stacked rather than horizontally. ``` - - - Button - Button - - Dropdown - - Action - Another action - Something else here - - Separated link - - - Button - Button - - Dropdown - - Action - Another action - Something else here - - Separated link - - - - Dropdown - - Action - Another action - Something else here - - Separated link - - - - Dropdown - - Action - Another action - Something else here - - Separated link - - - - - -```jsx +```jsx preview Button Button @@ -588,37 +290,7 @@ Create a set of buttons that appear vertically stacked rather than horizontally. ``` - - - - - - - - -```jsx +```jsx preview - - Primary - - Secondary - Success - Danger - Warning - Info - Light - Dark - Link - - -```jsx -Primary +```jsx preview +Primary Secondary Success Danger @@ -59,19 +45,7 @@ The `` component are designed for ` + +
+

React Modal body text goes here.

+
+
+ + +
+ + + + +```jsx + React Modal title - React Modal body text goes here. + +

React Modal body text goes here.

+ Close Save changes @@ -58,7 +73,9 @@ export const LiveDemoExample = () => { Modal title - Woohoo, you're reading this text in a modal! + +

Woohoo, you're reading this text in a modal!

+ setVisible(false)}> Close @@ -83,7 +100,9 @@ return ( setVisible(false)}> Modal title - Woohoo, you're reading this text in a modal! + +

Woohoo, you're reading this text in a modal!

+ setVisible(false)}> Close From 81ef1ed7ce06704332002925399bec9e460e9662 Mon Sep 17 00:00:00 2001 From: mrholek Date: Tue, 6 Jun 2023 13:11:15 +0200 Subject: [PATCH 128/452] chore: clean-up --- packages/coreui-react/src/components/popover/CPopover.tsx | 1 - packages/coreui-react/src/components/tooltip/CTooltip.tsx | 1 - 2 files changed, 2 deletions(-) diff --git a/packages/coreui-react/src/components/popover/CPopover.tsx b/packages/coreui-react/src/components/popover/CPopover.tsx index a7408d58..9b887bbf 100644 --- a/packages/coreui-react/src/components/popover/CPopover.tsx +++ b/packages/coreui-react/src/components/popover/CPopover.tsx @@ -51,7 +51,6 @@ export interface CPopoverProps extends Omit, 'tit } const getPlacement = (placement: string, element: HTMLDivElement | null): Placement => { - console.log(element) switch (placement) { case 'right': { return isRTL(element) ? 'left' : 'right' diff --git a/packages/coreui-react/src/components/tooltip/CTooltip.tsx b/packages/coreui-react/src/components/tooltip/CTooltip.tsx index db6e7cea..ae025e44 100644 --- a/packages/coreui-react/src/components/tooltip/CTooltip.tsx +++ b/packages/coreui-react/src/components/tooltip/CTooltip.tsx @@ -47,7 +47,6 @@ export interface CTooltipProps extends Omit, 'con } const getPlacement = (placement: string, element: HTMLDivElement | null): Placement => { - console.log(element) switch (placement) { case 'right': { return isRTL(element) ? 'left' : 'right' From eafc6ceee9a633891edcc3730e06dbd4edca4832 Mon Sep 17 00:00:00 2001 From: mrholek Date: Tue, 6 Jun 2023 14:10:03 +0200 Subject: [PATCH 129/452] refactor(CSpinner): improve class names --- packages/coreui-react/src/components/spinner/CSpinner.tsx | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/packages/coreui-react/src/components/spinner/CSpinner.tsx b/packages/coreui-react/src/components/spinner/CSpinner.tsx index c031f08a..81fb7c1e 100644 --- a/packages/coreui-react/src/components/spinner/CSpinner.tsx +++ b/packages/coreui-react/src/components/spinner/CSpinner.tsx @@ -51,8 +51,10 @@ export const CSpinner = forwardRef Date: Tue, 6 Jun 2023 14:17:07 +0200 Subject: [PATCH 130/452] build: update eslint configuration --- .eslintrc.js | 44 +++++++++---------- .../src/components/accordion/index.ts | 8 +--- 2 files changed, 22 insertions(+), 30 deletions(-) diff --git a/.eslintrc.js b/.eslintrc.js index ade1db98..82fef581 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -18,7 +18,7 @@ module.exports = { 'plugin:react/recommended', 'plugin:@typescript-eslint/recommended', 'plugin:prettier/recommended', - "plugin:unicorn/recommended", + 'plugin:unicorn/recommended', ], parser: '@typescript-eslint/parser', parserOptions: { @@ -36,32 +36,30 @@ module.exports = { }, }, rules: { - "unicorn/filename-case": "off", - "unicorn/no-array-for-each": "off", - "unicorn/no-null": "off", - "unicorn/prefer-dom-node-append": "off", - "unicorn/prefer-export-from": "off", - "unicorn/prefer-query-selector": "off", - "unicorn/prevent-abbreviations": "off", + 'unicorn/filename-case': 'off', + 'unicorn/no-array-for-each': 'off', + 'unicorn/no-null': 'off', + 'unicorn/prefer-dom-node-append': 'off', + 'unicorn/prefer-export-from': 'off', + 'unicorn/prefer-query-selector': 'off', + 'unicorn/prevent-abbreviations': 'off', }, overrides: [ { - "files": [ - "packages/docs/build/**" - ], - "env": { - "browser": false, - "node": true + files: ['packages/docs/build/**'], + env: { + browser: false, + node: true, }, - "parserOptions": { - "sourceType": "script" + parserOptions: { + sourceType: 'script', + }, + rules: { + '@typescript-eslint/no-var-requires': 'off', + 'no-console': 'off', + 'unicorn/prefer-module': 'off', + 'unicorn/prefer-top-level-await': 'off', }, - "rules": { - "@typescript-eslint/no-var-requires": "off", - "no-console": "off", - "unicorn/prefer-module": "off", - "unicorn/prefer-top-level-await": "off" - } }, - ] + ], } diff --git a/packages/coreui-react/src/components/accordion/index.ts b/packages/coreui-react/src/components/accordion/index.ts index aef81e77..e1cc95ee 100644 --- a/packages/coreui-react/src/components/accordion/index.ts +++ b/packages/coreui-react/src/components/accordion/index.ts @@ -4,10 +4,4 @@ import { CAccordionButton } from './CAccordionButton' import { CAccordionHeader } from './CAccordionHeader' import { CAccordionItem } from './CAccordionItem' -export { - CAccordion, - CAccordionBody, - CAccordionButton, - CAccordionHeader, - CAccordionItem, -} +export { CAccordion, CAccordionBody, CAccordionButton, CAccordionHeader, CAccordionItem } From 76126f99d2ceb06dbb14dfd04f7ca3d79e174927 Mon Sep 17 00:00:00 2001 From: mrholek Date: Tue, 6 Jun 2023 14:17:21 +0200 Subject: [PATCH 131/452] chore: add comments --- packages/coreui-react/src/components/progress/CProgress.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/coreui-react/src/components/progress/CProgress.tsx b/packages/coreui-react/src/components/progress/CProgress.tsx index 2be506cc..9e49ad8f 100644 --- a/packages/coreui-react/src/components/progress/CProgress.tsx +++ b/packages/coreui-react/src/components/progress/CProgress.tsx @@ -29,6 +29,7 @@ export interface CProgressProps white?: boolean } +// TODO: update markup and add '.progress-stacked' in v5 export const CProgress = forwardRef( ({ children, className, height, thin, value = 0, white, ...rest }, ref) => { return ( From eaab23654a7d910c25d93c9171162b1fbf0cc532 Mon Sep 17 00:00:00 2001 From: mrholek Date: Wed, 7 Jun 2023 00:18:01 +0200 Subject: [PATCH 132/452] docs: update SCSS docs --- .../docs/content/components/accordion.mdx | 59 +---- packages/docs/content/components/alert.mdx | 24 +-- packages/docs/content/components/badge.mdx | 22 +- .../docs/content/components/breadcrumb.mdx | 26 +-- packages/docs/content/components/button.mdx | 87 +------- packages/docs/content/components/callout.mdx | 34 +-- packages/docs/content/components/card.mdx | 40 +--- packages/docs/content/components/carousel.mdx | 34 +-- packages/docs/content/components/dropdown.mdx | 87 +------- packages/docs/content/components/footer.mdx | 20 +- packages/docs/content/components/header.mdx | 69 +----- .../docs/content/components/list-group.mdx | 59 +---- packages/docs/content/components/modal.mdx | 73 +------ packages/docs/content/components/navbar.mdx | 87 ++------ .../docs/content/components/navs-tabs.mdx | 55 +---- .../docs/content/components/offcanvas.mdx | 28 +-- .../docs/content/components/pagination.mdx | 63 +----- .../docs/content/components/placeholder.mdx | 6 + packages/docs/content/components/popover.mdx | 133 +++++++----- packages/docs/content/components/progress.mdx | 26 +-- packages/docs/content/components/sidebar.mdx | 203 +----------------- packages/docs/content/components/spinner.mdx | 35 +-- packages/docs/content/components/toast.mdx | 35 +-- packages/docs/content/components/tooltip.mdx | 72 ++++--- packages/docs/gatsby-config.js | 7 + packages/docs/gatsby-node.js | 43 ++-- packages/docs/src/components/ScssDocs.tsx | 69 ++++-- packages/docs/src/templates/MdxLayout.tsx | 3 +- 28 files changed, 292 insertions(+), 1207 deletions(-) diff --git a/packages/docs/content/components/accordion.mdx b/packages/docs/content/components/accordion.mdx index 951d9523..3dd6c723 100644 --- a/packages/docs/content/components/accordion.mdx +++ b/packages/docs/content/components/accordion.mdx @@ -150,30 +150,7 @@ Add `alwaysOpen` property to make react accordion items stay open when another i React accordions use local CSS variables on `.accordion` for enhanced real-time customization. Values for the CSS variables are set via Sass, so Sass customization is still supported, too. -```sass ---cui-accordion-color: #{color-contrast($accordion-bg)}; ---cui-accordion-bg: #{$accordion-bg}; ---cui-accordion-transition: #{$accordion-transition}; ---cui-accordion-border-color: #{$accordion-border-color}; ---cui-accordion-border-width: #{$accordion-border-width}; ---cui-accordion-border-radius: #{$accordion-border-radius}; ---cui-accordion-inner-border-radius: #{$accordion-inner-border-radius}; ---cui-accordion-btn-padding-x: #{$accordion-button-padding-x}; ---cui-accordion-btn-padding-y: #{$accordion-button-padding-y}; ---cui-accordion-btn-color: #{$accordion-color}; ---cui-accordion-btn-bg: #{$accordion-button-bg}; ---cui-accordion-btn-icon: #{escape-svg($accordion-button-icon)}; ---cui-accordion-btn-icon-width: #{$accordion-icon-width}; ---cui-accordion-btn-icon-transform: #{$accordion-icon-transform}; ---cui-accordion-btn-icon-transition: #{$accordion-icon-transition}; ---cui-accordion-btn-active-icon: #{escape-svg($accordion-button-active-icon)}; ---cui-accordion-btn-focus-border-color: #{$accordion-button-focus-border-color}; ---cui-accordion-btn-focus-box-shadow: #{$accordion-button-focus-box-shadow}; ---cui-accordion-body-padding-x: #{$accordion-body-padding-x}; ---cui-accordion-body-padding-y: #{$accordion-body-padding-y}; ---cui-accordion-active-color: #{$accordion-button-active-color}; ---cui-accordion-active-bg: #{$accordion-button-active-bg}; -``` + #### How to use CSS variables @@ -187,39 +164,7 @@ return ... ### SASS variables -```sass -$accordion-padding-y: 1rem; -$accordion-padding-x: 1.25rem; -$accordion-color: var(--cui-body-color); -$accordion-bg: $body-bg; -$accordion-border-width: $border-width; -$accordion-border-color: var(--cui-border-color); -$accordion-border-radius: $border-radius; -$accordion-inner-border-radius: subtract($accordion-border-radius, $accordion-border-width); - -$accordion-body-padding-y: $accordion-padding-y; -$accordion-body-padding-x: $accordion-padding-x; - -$accordion-button-padding-y: $accordion-padding-y; -$accordion-button-padding-x: $accordion-padding-x; -$accordion-button-color: $accordion-color; -$accordion-button-bg: var(--cui-accordion-bg); -$accordion-transition: $btn-transition, border-radius .15s ease; -$accordion-button-active-bg: tint-color($component-active-bg, 90%); -$accordion-button-active-color: shade-color($primary, 10%); - -$accordion-button-focus-border-color: $input-focus-border-color; -$accordion-button-focus-box-shadow: $btn-focus-box-shadow; - -$accordion-icon-width: 1.25rem; -$accordion-icon-color: $accordion-button-color; -$accordion-icon-active-color: $accordion-button-active-color; -$accordion-icon-transition: transform .2s ease-in-out; -$accordion-icon-transform: rotate(-180deg); - -$accordion-button-icon: url("data:image/svg+xml,"); -$accordion-button-active-icon: url("data:image/svg+xml,"); -``` + ## API diff --git a/packages/docs/content/components/alert.mdx b/packages/docs/content/components/alert.mdx index 68971f76..dee0b432 100644 --- a/packages/docs/content/components/alert.mdx +++ b/packages/docs/content/components/alert.mdx @@ -231,16 +231,7 @@ React Alert component can also be easily dismissed. Just add the `dismissible` p React alerts use local CSS variables on `.alert` for enhanced real-time customization. Values for the CSS variables are set via Sass, so Sass customization is still supported, too. -```sass ---cui-alert-bg: transparent; ---cui-alert-padding-x: #{$alert-padding-x}; ---cui-alert-padding-y: #{$alert-padding-y}; ---cui-alert-margin-bottom: #{$alert-margin-bottom}; ---cui-alert-color: inherit; ---cui-alert-border-color: transparent; ---cui-alert-border: #{$alert-border-width} solid var(--cui-alert-border-color); ---cui-alert-border-radius: #{$alert-border-radius}; -``` + #### How to use CSS variables @@ -254,18 +245,7 @@ return ... ### SASS variables -```sass -$alert-padding-y: $spacer; -$alert-padding-x: $spacer; -$alert-margin-bottom: 1rem; -$alert-border-radius: $border-radius; -$alert-link-font-weight: $font-weight-bold; -$alert-border-width: $border-width; -$alert-bg-scale: -80%; -$alert-border-scale: -70%; -$alert-color-scale: 40%; -$alert-dismissible-padding-r: $alert-padding-x * 3; // 3x covers width of x plus default padding on either side -``` + ## API diff --git a/packages/docs/content/components/badge.mdx b/packages/docs/content/components/badge.mdx index 894a7959..e7efa268 100644 --- a/packages/docs/content/components/badge.mdx +++ b/packages/docs/content/components/badge.mdx @@ -123,14 +123,7 @@ Apply the `shape="rounded-pill"` prop to make badges rounded. React badges use local CSS variables on `.badges` for enhanced real-time customization. Values for the CSS variables are set via Sass, so Sass customization is still supported, too. -```sass ---cui-badge-padding-x: #{$badge-padding-x}; ---cui-badge-padding-y: #{$badge-padding-y}; ---cui-badge-font-size: #{$badge-font-size}; ---cui-badge-font-weight: #{$badge-font-weight}; ---cui-badge-color: #{$badge-color}; ---cui-badge-border-radius: #{$badge-border-radius}; -``` + #### How to use CSS variables @@ -144,18 +137,7 @@ return ... ### SASS variables -```sass -$badge-font-size: .75em; -$badge-font-weight: $font-weight-bold; -$badge-color: $high-emphasis-inverse; -$badge-padding-y: .35em; -$badge-padding-x: .65em; -$badge-border-radius: $border-radius; - -$badge-font-size-sm: .65em; -$badge-padding-y-sm: .3em; -$badge-padding-x-sm: .5em; -``` + ## API diff --git a/packages/docs/content/components/breadcrumb.mdx b/packages/docs/content/components/breadcrumb.mdx index 6c27a8a6..96c0d6df 100644 --- a/packages/docs/content/components/breadcrumb.mdx +++ b/packages/docs/content/components/breadcrumb.mdx @@ -86,17 +86,7 @@ For more information, see the [WAI-ARIA Authoring Practices for the breadcrumb p React breadcrumbs use local CSS variables on `.breadcrumb` for enhanced real-time customization. Values for the CSS variables are set via Sass, so Sass customization is still supported, too. -```sass ---cui-breadcrumb-padding-x: #{$breadcrumb-padding-x}; ---cui-breadcrumb-padding-y: #{$breadcrumb-padding-y}; ---cui-breadcrumb-margin-bottom: #{$breadcrumb-margin-bottom}; ---cui-breadcrumb-font-size: #{$breadcrumb-font-size}; ---cui-breadcrumb-bg: #{$breadcrumb-bg}; ---cui-breadcrumb-border-radius: #{$breadcrumb-border-radius}; ---cui-breadcrumb-divider-color: #{$breadcrumb-divider-color}; ---cui-breadcrumb-item-padding-x: #{$breadcrumb-item-padding-x}; ---cui-breadcrumb-item-active-color: #{$breadcrumb-active-color}; -``` + #### How to use CSS variables @@ -110,19 +100,7 @@ return ... ### SASS variables -```sass -$breadcrumb-font-size: null; -$breadcrumb-padding-y: 0; -$breadcrumb-padding-x: 0; -$breadcrumb-item-padding-x: .5rem; -$breadcrumb-margin-bottom: 1rem; -$breadcrumb-bg: unset; -$breadcrumb-divider-color: $gray-600; -$breadcrumb-active-color: $gray-600; -$breadcrumb-divider: quote("/"); -$breadcrumb-divider-flipped: $breadcrumb-divider; -$breadcrumb-border-radius: null; -``` + ## API diff --git a/packages/docs/content/components/button.mdx b/packages/docs/content/components/button.mdx index 75ef6ecb..4543fb55 100644 --- a/packages/docs/content/components/button.mdx +++ b/packages/docs/content/components/button.mdx @@ -193,22 +193,7 @@ Additional utilities can be used to adjust the alignment of buttons when horizon React buttons use local CSS variables on `.btn` for enhanced real-time customization. Values for the CSS variables are set via Sass, so Sass customization is still supported, too. -```sass ---cui-btn-padding-x: #{$btn-padding-x}; ---cui-btn-padding-y: #{$btn-padding-y}; ---cui-btn-font-family: #{$btn-font-family}; ---cui-btn-font-size: #{$btn-font-size}; ---cui-btn-font-weight: #{$btn-font-weight}; ---cui-btn-line-height: #{$btn-line-height}; ---cui-btn-color: #{$body-color}; ---cui-btn-bg: transparent; ---cui-btn-border-width: #{$btn-border-width}; ---cui-btn-border-color: transparent; ---cui-btn-border-radius: #{$btn-border-radius}; ---cui-btn-box-shadow: #{$btn-box-shadow}; ---cui-btn-disabled-opacity: #{$btn-disabled-opacity}; ---cui-btn-focus-box-shadow: 0 0 0 #{$btn-focus-width} rgba(var(--cui-btn-focus-shadow-rgb), .5); -``` + #### How to use CSS variables @@ -222,75 +207,7 @@ return ... ### SASS variables -```sass -$btn-padding-y: $input-btn-padding-y; -$btn-padding-x: $input-btn-padding-x; -$btn-font-family: $input-btn-font-family; -$btn-font-size: $input-btn-font-size; -$btn-line-height: $input-btn-line-height; -$btn-white-space: null; // Set to `nowrap` to prevent text wrapping - -$btn-padding-y-sm: $input-btn-padding-y-sm; -$btn-padding-x-sm: $input-btn-padding-x-sm; -$btn-font-size-sm: $input-btn-font-size-sm; - -$btn-padding-y-lg: $input-btn-padding-y-lg; -$btn-padding-x-lg: $input-btn-padding-x-lg; -$btn-font-size-lg: $input-btn-font-size-lg; - -$btn-border-width: $input-btn-border-width; - -$btn-font-weight: $font-weight-normal; -$btn-box-shadow: inset 0 1px 0 rgba($white, .15), 0 1px 1px rgba($black, .075); -$btn-focus-width: $input-btn-focus-width; -$btn-focus-box-shadow: $input-btn-focus-box-shadow; -$btn-disabled-opacity: .65; -$btn-active-box-shadow: inset 0 3px 5px rgba($black, .125); - -$btn-link-color: var(--cui-link-color); -$btn-link-hover-color: var(--cui-link-hover-color); -$btn-link-disabled-color: $gray-600; - -// Allows for customizing button radius independently from global border radius -$btn-border-radius: $border-radius; -$btn-border-radius-sm: $border-radius-sm; -$btn-border-radius-lg: $border-radius-lg; - -$btn-transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out; - -$btn-hover-bg-shade-amount: 15%; -$btn-hover-bg-tint-amount: 15%; -$btn-hover-border-shade-amount: 20%; -$btn-hover-border-tint-amount: 10%; -$btn-active-bg-shade-amount: 20%; -$btn-active-bg-tint-amount: 20%; -$btn-active-border-shade-amount: 25%; -$btn-active-border-tint-amount: 10%; - -// scss-docs-start button-variants -$button-variants: ( - "primary": btn-color-map($primary, $primary), - "secondary": btn-color-map($secondary, $secondary), - "success": btn-color-map($success, $success), - "danger": btn-color-map($danger, $danger), - "warning": btn-color-map($warning, $warning), - "info": btn-color-map($info, $info), - "light": btn-color-map($light, $light), - "dark": btn-color-map($dark, $dark) -); - -$button-outline-ghost-variants: ( - "primary": btn-outline-color-map($primary), - "secondary": btn-outline-color-map($secondary), - "success": btn-outline-color-map($success), - "danger": btn-outline-color-map($danger), - "warning": btn-outline-color-map($warning), - "info": btn-outline-color-map($info), - "light": btn-outline-color-map($light), - "dark": btn-outline-color-map($dark) -); -// scss-docs-end button-variants -``` + ## API diff --git a/packages/docs/content/components/callout.mdx b/packages/docs/content/components/callout.mdx index f40b8428..71ef0099 100644 --- a/packages/docs/content/components/callout.mdx +++ b/packages/docs/content/components/callout.mdx @@ -61,16 +61,7 @@ Callout component is prepared for any length of text, as well as an optional ele React callouts use local CSS variables on `.callout` for enhanced real-time customization. Values for the CSS variables are set via Sass, so Sass customization is still supported, too. -```sass ---cui-callout-padding-x: #{$callout-padding-x}; ---cui-callout-padding-y: #{$callout-padding-y}; ---cui-callout-margin-x: #{$callout-margin-x}; ---cui-callout-margin-y: #{$callout-margin-y}; ---cui-callout-border-width: #{$callout-border-width}; ---cui-callout-border-color: #{$callout-border-color}; ---cui-callout-border-left-width: #{$callout-border-left-width}; ---cui-callout-border-radius: #{$callout-border-radius}; -``` + #### How to use CSS variables @@ -84,28 +75,7 @@ return ... ### SASS variables -```sass -$callout-padding-y: $spacer; -$callout-padding-x: $spacer; -$callout-margin-y: $spacer; -$callout-margin-x: 0; -$callout-border-radius: $border-radius; -$callout-border-width: $border-width; -$callout-border-color: $border-color; -$callout-border-left-width: (4 * $callout-border-width); - -$callout-variants: ( - "primary": $primary, - "secondary": $secondary, - "success": $success, - "danger": $danger, - "warning": $warning, - "info": $info, - "light": $light, - "dark": $dark -); -``` - + ## API diff --git a/packages/docs/content/components/card.mdx b/packages/docs/content/components/card.mdx index 59c55761..fc44c610 100644 --- a/packages/docs/content/components/card.mdx +++ b/packages/docs/content/components/card.mdx @@ -972,25 +972,7 @@ Just like with card groups, card footers will automatically line up. React cards use local CSS variables on `.card` for enhanced real-time customization. Values for the CSS variables are set via Sass, so Sass customization is still supported, too. -```sass ---cui-card-spacer-y: #{$card-spacer-y}; ---cui-card-spacer-x: #{$card-spacer-x}; ---cui-card-title-spacer-y: #{$card-title-spacer-y}; ---cui-card-border-width: #{$card-border-width}; ---cui-card-border-color: #{$card-border-color}; ---cui-card-border-radius: #{$card-border-radius}; ---cui-card-box-shadow: #{$card-box-shadow}; ---cui-card-inner-border-radius: #{$card-inner-border-radius}; ---cui-card-cap-padding-y: #{$card-cap-padding-y}; ---cui-card-cap-padding-x: #{$card-cap-padding-x}; ---cui-card-cap-bg: #{$card-cap-bg}; ---cui-card-cap-color: #{$card-cap-color}; ---cui-card-height: #{$card-height}; ---cui-card-color: #{$card-color}; ---cui-card-bg: #{$card-bg}; ---cui-card-img-overlay-padding: #{$card-img-overlay-padding}; ---cui-card-group-margin: #{$card-group-margin}; -``` + #### How to use CSS variables @@ -1004,25 +986,7 @@ return ... ### SASS variables -```sass -$card-spacer-y: $spacer; -$card-spacer-x: $spacer; -$card-title-spacer-y: $spacer * .5; -$card-border-width: $border-width; -$card-border-color: var(--cui-border-color-translucent); -$card-border-radius: $border-radius; -$card-box-shadow: null; -$card-inner-border-radius: subtract($card-border-radius, $card-border-width); -$card-cap-padding-y: $card-spacer-y * .5; -$card-cap-padding-x: $card-spacer-x; -$card-cap-bg: rgba($black, .03); -$card-cap-color: unset; -$card-height: null; -$card-color: unset; -$card-bg: $white; -$card-img-overlay-padding: $spacer; -$card-group-margin: $grid-gutter-width * .5; -``` + ## API diff --git a/packages/docs/content/components/carousel.mdx b/packages/docs/content/components/carousel.mdx index 8d90f360..a79a0ed2 100644 --- a/packages/docs/content/components/carousel.mdx +++ b/packages/docs/content/components/carousel.mdx @@ -215,39 +215,7 @@ Add `dark` property to the `CCarousel` for darker controls, indicators, and capt ### SASS variables -```sass -$carousel-control-color: $high-emphasis-inverse; -$carousel-control-width: 15%; -$carousel-control-opacity: .5; -$carousel-control-hover-opacity: .9; -$carousel-control-transition: opacity .15s ease; - -$carousel-indicator-width: 30px; -$carousel-indicator-height: 3px; -$carousel-indicator-hit-area-height: 10px; -$carousel-indicator-spacer: 3px; -$carousel-indicator-opacity: .5; -$carousel-indicator-active-bg: $white; -$carousel-indicator-active-opacity: 1; -$carousel-indicator-transition: opacity .6s ease; - -$carousel-caption-width: 70%; -$carousel-caption-color: $high-emphasis-inverse; -$carousel-caption-padding-y: 1.25rem; -$carousel-caption-spacer: 1.25rem; - -$carousel-control-icon-width: 2rem; - -$carousel-control-prev-icon-bg: url("data:image/svg+xml,"); -$carousel-control-next-icon-bg: url("data:image/svg+xml,"); - -$carousel-transition-duration: .6s; -$carousel-transition: transform $carousel-transition-duration ease-in-out; // Define transform transition first if using multiple transitions (e.g., `transform 2s ease, opacity .5s ease-out`) - -$carousel-dark-indicator-active-bg: $black; -$carousel-dark-caption-color: $high-emphasis; -$carousel-dark-control-icon-filter: invert(1) grayscale(100); -``` + ## API diff --git a/packages/docs/content/components/dropdown.mdx b/packages/docs/content/components/dropdown.mdx index 5e7a3c57..88299603 100644 --- a/packages/docs/content/components/dropdown.mdx +++ b/packages/docs/content/components/dropdown.mdx @@ -578,50 +578,11 @@ Put a form within a dropdown menu, or make it into a dropdown menu. React dropdowns use local CSS variables on `.dropdown` for enhanced real-time customization. Values for the CSS variables are set via Sass, so Sass customization is still supported, too. -```sass ---cui-dropdown-min-width: #{$dropdown-min-width}; ---cui-dropdown-padding-x: #{$dropdown-padding-x}; ---cui-dropdown-padding-y: #{$dropdown-padding-y}; ---cui-dropdown-spacer: #{$dropdown-spacer}; ---cui-dropdown-font-size: #{$dropdown-font-size}; ---cui-dropdown-color: #{$dropdown-color}; ---cui-dropdown-bg: #{$dropdown-bg}; ---cui-dropdown-border-color: #{$dropdown-border-color}; ---cui-dropdown-border-radius: #{$dropdown-border-radius}; ---cui-dropdown-border-width: #{$dropdown-border-width}; ---cui-dropdown-inner-border-radius: #{$dropdown-inner-border-radius}; ---cui-dropdown-divider-bg: #{$dropdown-divider-bg}; ---cui-dropdown-divider-margin-y: #{$dropdown-divider-margin-y}; ---cui-dropdown-box-shadow: #{$dropdown-box-shadow}; ---cui-dropdown-link-color: #{$dropdown-link-color}; ---cui-dropdown-link-hover-color: #{$dropdown-link-hover-color}; ---cui-dropdown-link-hover-bg: #{$dropdown-link-hover-bg}; ---cui-dropdown-link-active-color: #{$dropdown-link-active-color}; ---cui-dropdown-link-active-bg: #{$dropdown-link-active-bg}; ---cui-dropdown-link-disabled-color: #{$dropdown-link-disabled-color}; ---cui-dropdown-item-padding-x: #{$dropdown-item-padding-x}; ---cui-dropdown-item-padding-y: #{$dropdown-item-padding-y}; ---cui-dropdown-header-color: #{$dropdown-header-color}; ---cui-dropdown-header-padding-x: #{$dropdown-header-padding-x}; ---cui-dropdown-header-padding-y: #{$dropdown-header-padding-y}; -``` + Customization through CSS variables can be seen on the `.dropdown-menu-dark` class where we override specific values without adding duplicate CSS selectors. -```sass ---cui-dropdown-color: #{$dropdown-dark-color}; ---cui-dropdown-bg: #{$dropdown-dark-bg}; ---cui-dropdown-border-color: #{$dropdown-dark-border-color}; ---cui-dropdown-box-shadow: #{$dropdown-dark-box-shadow}; ---cui-dropdown-link-color: #{$dropdown-dark-link-color}; ---cui-dropdown-link-hover-color: #{$dropdown-dark-link-hover-color}; ---cui-dropdown-divider-bg: #{$dropdown-dark-divider-bg}; ---cui-dropdown-link-hover-bg: #{$dropdown-dark-link-hover-bg}; ---cui-dropdown-link-active-color: #{$dropdown-dark-link-active-color}; ---cui-dropdown-link-active-bg: #{$dropdown-dark-link-active-bg}; ---cui-dropdown-link-disabled-color: #{$dropdown-dark-link-disabled-color}; ---cui-dropdown-header-color: #{$dropdown-dark-header-color}; -``` + #### How to use CSS variables @@ -635,41 +596,15 @@ return ... ### SASS variables -```sass -$dropdown-min-width: 10rem; -$dropdown-padding-x: 0; -$dropdown-padding-y: .5rem; -$dropdown-spacer: .125rem; -$dropdown-font-size: $font-size-base; -$dropdown-color: $body-color; -$dropdown-bg: $white; -$dropdown-border-color: var(--cui-border-color-translucent); -$dropdown-border-radius: $border-radius; -$dropdown-border-width: $border-width; -$dropdown-inner-border-radius: subtract($dropdown-border-radius, $dropdown-border-width); -$dropdown-divider-bg: $dropdown-border-color; -$dropdown-divider-margin-y: $spacer * .5; -$dropdown-box-shadow: $box-shadow; - -$dropdown-link-color: $gray-900; -$dropdown-link-hover-color: shade-color($dropdown-link-color, 10%); -$dropdown-link-hover-bg: $gray-200; - -$dropdown-link-active-color: $component-active-color; -$dropdown-link-active-bg: $component-active-bg; - -$dropdown-link-disabled-color: $gray-500; - -$dropdown-item-padding-y: $spacer * .25; -$dropdown-item-padding-x: $spacer; - -$dropdown-header-color: $gray-600; -$dropdown-header-padding-x: $dropdown-item-padding-x; -$dropdown-header-padding-y: $dropdown-padding-y; -// fusv-disable -$dropdown-header-padding: $dropdown-header-padding-y $dropdown-header-padding-x; // Deprecated in v4.2.0 -// fusv-enable -``` + + +Variables for the dark dropdown: + + + +Variables for the CSS-based carets that indicate a dropdown's interactivity: + + ## API diff --git a/packages/docs/content/components/footer.mdx b/packages/docs/content/components/footer.mdx index 01a25590..a1b380c8 100644 --- a/packages/docs/content/components/footer.mdx +++ b/packages/docs/content/components/footer.mdx @@ -30,15 +30,7 @@ import { CFooter, CLink } from '@coreui/react/src/index' React footers use local CSS variables on `.footer` for enhanced real-time customization. Values for the CSS variables are set via Sass, so Sass customization is still supported, too. -```sass ---cui-footer-min-height: #{$footer-min-height}; ---cui-footer-padding-x: #{$footer-padding-x}; ---cui-footer-padding-y: #{$footer-padding-y}; ---cui-footer-color: #{$footer-color}; ---cui-footer-bg: #{$footer-bg}; ---cui-footer-border-color: #{$footer-border-color}; ---cui-footer-border: #{$footer-border-width} solid var(--cui-footer-border-color); -``` + #### How to use CSS variables @@ -52,15 +44,7 @@ return ... ### SASS variables -```sass -$footer-min-height: 3rem; -$footer-padding-y: $spacer * .5; -$footer-padding-x: $spacer; -$footer-bg: $gray-100; -$footer-color: $body-color; -$footer-border-width: 1px; -$footer-border-color: $border-color; -``` + ## API diff --git a/packages/docs/content/components/header.mdx b/packages/docs/content/components/header.mdx index dc97f09b..d19e7c7b 100644 --- a/packages/docs/content/components/header.mdx +++ b/packages/docs/content/components/header.mdx @@ -150,34 +150,7 @@ return ( React headers use local CSS variables on `.header` for enhanced real-time customization. Values for the CSS variables are set via Sass, so Sass customization is still supported, too. -```sass ---cui-header-min-height: #{$header-min-height}; ---cui-header-padding-x: #{$header-padding-x}; ---cui-header-padding-y: #{$header-padding-y}; ---cui-header-bg: #{$header-bg}; ---cui-header-color: #{$header-color}; ---cui-header-border-color: #{$header-border-color}; ---cui-header-border: #{$header-border-width} solid var(--cui-header-border-color); ---cui-header-hover-color: #{$header-hover-color}; ---cui-header-disabled-color: #{$header-disabled-color}; ---cui-header-active-color: #{$header-active-color}; ---cui-header-brand-padding-y: #{$header-brand-padding-y}; ---cui-header-brand-color: #{$header-brand-color}; ---cui-header-brand-hover-color: #{$header-brand-hover-color}; ---cui-header-toggler-padding-x: #{$header-toggler-padding-x}; ---cui-header-toggler-padding-y: #{$header-toggler-padding-y}; ---cui-header-toggler-bg: #{$header-toggler-bg}; ---cui-header-toggler-color: #{$header-toggler-color}; ---cui-header-toggler-border-radius: #{$header-toggler-border-radius}; ---cui-header-toggler-hover-color: #{$header-toggler-hover-color}; ---cui-header-toggler-icon-bg: #{escape-svg($header-toggler-icon-bg)}; ---cui-header-toggler-hover-icon-bg: #{escape-svg($header-toggler-hover-icon-bg)}; ---cui-header-nav-link-padding-x: #{$header-nav-link-padding-x}; ---cui-header-nav-link-padding-y: #{$header-nav-link-padding-y}; ---cui-header-divider-border-color: #{$header-divider-border-color}; ---cui-header-divider-border: #{$header-divider-border-width} solid var(--cui-header-divider-border-color); ---cui-subheader-min-height: #{$subheader-min-height}; -``` + #### How to use CSS variables @@ -191,45 +164,7 @@ return ... ### SASS variables -```sass -$header-min-height: 4rem; -$header-padding-y: $spacer * .5; -$header-padding-x: $spacer * .5; -$header-brand-font-size: $font-size-lg; -$header-color: $medium-emphasis; -$header-bg: $white; -$header-border-color: $border-color; -$header-border-width: 1px; -$header-hover-color: $high-emphasis; -$header-active-color: $high-emphasis; -$header-disabled-color: $disabled; - -// Compute the header-brand padding-y so the header-brand will have the same height as header-text and nav-link -$nav-link-height: $font-size-base * $line-height-base + $nav-link-padding-y * 2; -$header-brand-height: $header-brand-font-size * $line-height-base; -$header-brand-padding-y: ($nav-link-height - $header-brand-height) * .5; -$header-brand-margin-end: 1rem; -$header-brand-font-size: $font-size-lg; -$header-brand-color: $gray-900; -$header-brand-hover-color: shade-color($gray-900, 10%); - -$header-toggler-padding-y: .25rem; -$header-toggler-padding-x: .75rem; -$header-toggler-font-size: $font-size-lg; -$header-toggler-color: $header-color; -$header-toggler-bg: transparent; -$header-toggler-border-radius: $btn-border-radius; -$header-toggler-hover-color: $header-active-color; - -$header-toggler-icon-bg: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='#{$header-color}' stroke-width='2.25' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E"); -$header-toggler-hover-icon-bg: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='#{$header-hover-color}' stroke-width='2.25' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E"); - -$header-nav-link-padding-x: .5rem; -$header-nav-link-padding-y: .5rem; - -$header-divider-border-width: 1px; -$header-divider-border-color: $header-border-color; -``` + ## API diff --git a/packages/docs/content/components/list-group.mdx b/packages/docs/content/components/list-group.mdx index 021966f3..5127f7c0 100644 --- a/packages/docs/content/components/list-group.mdx +++ b/packages/docs/content/components/list-group.mdx @@ -318,25 +318,7 @@ And if you want `