From d4064a16550c6e7c3986233b676e2db8ce43c5eb Mon Sep 17 00:00:00 2001 From: mrholek Date: Sat, 20 Jun 2026 01:53:59 +0200 Subject: [PATCH 01/14] feat(docs): migrate documentation to the shared Astro docs engine Replace the Gatsby-based docs site with the @coreui/astro-docs engine: Astro content collections, live component examples, generated API tables, and config-driven CDN/SRI placeholders. --- .gitignore | 3 +- packages/docs/.gitignore | 3 + packages/docs/api.config.mjs | 43 + packages/docs/astro.config.mjs | 42 + packages/docs/build/api.mjs | 382 - .../docs/content/components/accordion/api.mdx | 27 - .../components/accordion/bootstrap.mdx | 34 - .../content/components/accordion/index.mdx | 35 - .../docs/content/components/alert/api.mdx | 22 - .../content/components/alert/bootstrap.mdx | 70 - .../docs/content/components/alert/index.mdx | 70 - .../docs/content/components/avatar/api.mdx | 12 - .../content/components/avatar/bootstrap.mdx | 55 - .../avatar/examples/AvatarImage.tsx | 13 - .../docs/content/components/avatar/index.mdx | 56 - .../docs/content/components/badge/api.mdx | 12 - .../content/components/badge/bootstrap.mdx | 53 - .../docs/content/components/badge/index.mdx | 55 - .../content/components/breadcrumb/api.mdx | 17 - .../components/breadcrumb/bootstrap.mdx | 57 - .../content/components/button-group/api.mdx | 17 - .../components/button-group/bootstrap.mdx | 78 - .../content/components/button-group/index.mdx | 74 - .../docs/content/components/button/api.mdx | 12 - .../content/components/button/bootstrap.mdx | 103 - .../docs/content/components/button/index.mdx | 124 - .../docs/content/components/callout/api.mdx | 12 - .../docs/content/components/callout/index.mdx | 21 - packages/docs/content/components/card/api.mdx | 62 - .../content/components/card/bootstrap.mdx | 169 - .../docs/content/components/card/index.mdx | 201 - .../docs/content/components/carousel/api.mdx | 22 - .../content/components/carousel/bootstrap.mdx | 59 - .../examples/CarouselSlidesOnlyExample.tsx | 19 - .../content/components/carousel/index.mdx | 59 - .../content/components/carousel/styling.mdx | 10 - .../docs/content/components/chart/api.mdx | 12 - .../docs/content/components/chart/index.mdx | 73 - .../docs/content/components/chip-set/api.mdx | 12 - packages/docs/content/components/chip/api.mdx | 12 - .../content/components/chip/bootstrap.mdx | 131 - .../docs/content/components/chip/index.mdx | 115 - .../content/components/close-button/api.mdx | 12 - .../components/close-button/bootstrap.mdx | 31 - .../content/components/close-button/index.mdx | 31 - .../docs/content/components/collapse/api.mdx | 12 - .../content/components/collapse/bootstrap.mdx | 37 - .../content/components/collapse/index.mdx | 35 - .../docs/content/components/dropdown/api.mdx | 42 - .../content/components/dropdown/bootstrap.mdx | 143 - .../content/components/dropdown/index.mdx | 202 - .../content/components/focus-trap/api.mdx | 12 - packages/docs/content/components/icon.mdx | 379 - .../docs/content/components/image/api.mdx | 12 - .../content/components/image/bootstrap.mdx | 35 - .../image/examples/ImageAligningExample.tsx | 12 - .../image/examples/ImageThumbnailExample.tsx | 7 - .../docs/content/components/image/index.mdx | 35 - .../content/components/list-group/api.mdx | 17 - .../components/list-group/bootstrap.mdx | 82 - .../content/components/list-group/index.mdx | 88 - .../docs/content/components/modal/api.mdx | 32 - .../content/components/modal/bootstrap.mdx | 135 - .../docs/content/components/navbar/api.mdx | 32 - .../content/components/navbar/bootstrap.mdx | 105 - .../docs/content/components/navbar/index.mdx | 154 - .../docs/content/components/navs-tabs/api.mdx | 32 - .../components/navs-tabs/bootstrap.mdx | 102 - .../content/components/navs-tabs/index.mdx | 134 - .../docs/content/components/offcanvas/api.mdx | 27 - .../components/offcanvas/bootstrap.mdx | 91 - .../content/components/offcanvas/index.mdx | 97 - .../content/components/pagination/api.mdx | 17 - .../components/pagination/bootstrap.mdx | 48 - .../content/components/pagination/index.mdx | 52 - .../content/components/placeholder/api.mdx | 12 - .../components/placeholder/bootstrap.mdx | 63 - .../content/components/placeholder/index.mdx | 66 - .../components/placeholder/styling.mdx | 10 - .../docs/content/components/popover/api.mdx | 12 - .../content/components/popover/bootstrap.mdx | 49 - .../docs/content/components/popover/index.mdx | 47 - .../docs/content/components/progress/api.mdx | 17 - .../content/components/progress/bootstrap.mdx | 100 - .../content/components/progress/index.mdx | 96 - .../content/components/search-button/api.mdx | 12 - .../components/search-button/bootstrap.mdx | 31 - .../docs/content/components/sidebar/api.mdx | 38 - .../content/components/sidebar/bootstrap.mdx | 81 - .../docs/content/components/spinner/api.mdx | 12 - .../content/components/spinner/bootstrap.mdx | 82 - .../docs/content/components/spinner/index.mdx | 87 - .../docs/content/components/table/api.mdx | 42 - .../content/components/table/bootstrap.mdx | 1640 ---- .../docs/content/components/table/index.mdx | 1642 ---- .../docs/content/components/table/styling.mdx | 14 - packages/docs/content/components/tabs/api.mdx | 32 - .../content/components/tabs/bootstrap.mdx | 68 - .../docs/content/components/toast/api.mdx | 32 - .../content/components/toast/bootstrap.mdx | 53 - .../docs/content/components/toast/index.mdx | 66 - .../docs/content/components/tooltip/api.mdx | 12 - .../content/components/tooltip/bootstrap.mdx | 41 - .../docs/content/components/tooltip/index.mdx | 41 - .../docs/content/components/widgets/api.mdx | 38 - .../docs/content/components/widgets/index.mdx | 41 - packages/docs/content/forms/checkbox/api.mdx | 12 - .../docs/content/forms/checkbox/bootstrap.mdx | 71 - .../docs/content/forms/checkbox/index.mdx | 69 - .../docs/content/forms/checkbox/styling.mdx | 10 - .../docs/content/forms/chip-input/api.mdx | 12 - .../content/forms/chip-input/bootstrap.mdx | 63 - .../docs/content/forms/chip-input/index.mdx | 86 - .../content/forms/floating-labels/api.mdx | 12 - .../forms/floating-labels/bootstrap.mdx | 72 - .../content/forms/floating-labels/index.mdx | 63 - .../content/forms/floating-labels/styling.mdx | 10 - .../docs/content/forms/input-group/api.mdx | 17 - .../content/forms/input-group/bootstrap.mdx | 88 - .../docs/content/forms/input-group/index.mdx | 76 - .../content/forms/input-group/styling.mdx | 10 - packages/docs/content/forms/input/api.mdx | 27 - .../docs/content/forms/input/bootstrap.mdx | 79 - packages/docs/content/forms/input/index.mdx | 67 - .../docs/content/forms/layout/bootstrap.mdx | 80 - packages/docs/content/forms/radio/api.mdx | 12 - .../docs/content/forms/radio/bootstrap.mdx | 59 - packages/docs/content/forms/radio/index.mdx | 63 - packages/docs/content/forms/radio/styling.mdx | 10 - packages/docs/content/forms/range/api.mdx | 12 - .../docs/content/forms/range/bootstrap.mdx | 41 - packages/docs/content/forms/range/index.mdx | 37 - packages/docs/content/forms/range/styling.mdx | 10 - packages/docs/content/forms/select/api.mdx | 27 - .../docs/content/forms/select/bootstrap.mdx | 57 - packages/docs/content/forms/select/index.mdx | 51 - .../docs/content/forms/select/styling.mdx | 10 - packages/docs/content/forms/switch/api.mdx | 12 - .../docs/content/forms/switch/bootstrap.mdx | 35 - packages/docs/content/forms/switch/index.mdx | 35 - .../docs/content/forms/switch/styling.mdx | 10 - packages/docs/content/forms/textarea/api.mdx | 27 - .../docs/content/forms/textarea/bootstrap.mdx | 47 - .../docs/content/forms/textarea/index.mdx | 41 - .../content/forms/validation/bootstrap.mdx | 57 - .../docs/content/forms/validation/index.mdx | 47 - packages/docs/gatsby-browser.tsx | 18 - packages/docs/gatsby-config.mjs | 110 - packages/docs/gatsby-node.mjs | 103 - packages/docs/gatsby-ssr.tsx | 18 - packages/docs/package-lock.json | 6593 +++++++++++++++++ packages/docs/package.json | 79 +- packages/docs/scripts/gen-sidebar.mjs | 36 + packages/docs/scripts/migrate.mjs | Bin 0 -> 15382 bytes packages/docs/src/AppContext.tsx | 13 - .../api-includes}/CAccordion.api.mdx | 0 .../api-includes}/CAccordionBody.api.mdx | 0 .../api-includes}/CAccordionButton.api.mdx | 0 .../api-includes}/CAccordionHeader.api.mdx | 0 .../api-includes}/CAccordionItem.api.mdx | 0 .../api => src/api-includes}/CAlert.api.mdx | 0 .../api-includes}/CAlertHeading.api.mdx | 0 .../api-includes}/CAlertLink.api.mdx | 0 .../api => src/api-includes}/CAvatar.api.mdx | 0 .../api-includes}/CBackdrop.api.mdx | 0 .../api => src/api-includes}/CBadge.api.mdx | 0 .../api-includes}/CBreadcrumb.api.mdx | 0 .../api-includes}/CBreadcrumbItem.api.mdx | 0 .../api => src/api-includes}/CButton.api.mdx | 0 .../api-includes}/CButtonGroup.api.mdx | 0 .../api-includes}/CButtonToolbar.api.mdx | 0 .../api => src/api-includes}/CCallout.api.mdx | 0 .../api => src/api-includes}/CCard.api.mdx | 0 .../api-includes}/CCardBody.api.mdx | 0 .../api-includes}/CCardFooter.api.mdx | 0 .../api-includes}/CCardGroup.api.mdx | 0 .../api-includes}/CCardHeader.api.mdx | 0 .../api-includes}/CCardImage.api.mdx | 0 .../api-includes}/CCardImageOverlay.api.mdx | 0 .../api-includes}/CCardLink.api.mdx | 0 .../api-includes}/CCardSubtitle.api.mdx | 0 .../api-includes}/CCardText.api.mdx | 0 .../api-includes}/CCardTitle.api.mdx | 0 .../api-includes}/CCarousel.api.mdx | 0 .../api-includes}/CCarouselCaption.api.mdx | 0 .../api-includes}/CCarouselItem.api.mdx | 0 .../api => src/api-includes}/CChart.api.mdx | 0 .../api => src/api-includes}/CCharts.api.mdx | 0 .../api => src/api-includes}/CChip.api.mdx | 0 .../api-includes}/CChipInput.api.mdx | 0 .../api => src/api-includes}/CChipSet.api.mdx | 0 .../api-includes}/CCloseButton.api.mdx | 0 .../api => src/api-includes}/CCol.api.mdx | 0 .../api-includes}/CCollapse.api.mdx | 0 .../api-includes}/CConditionalPortal.api.mdx | 0 .../api-includes}/CContainer.api.mdx | 0 .../api-includes}/CDropdown.api.mdx | 0 .../api-includes}/CDropdownDivider.api.mdx | 0 .../api-includes}/CDropdownHeader.api.mdx | 0 .../api-includes}/CDropdownItem.api.mdx | 0 .../api-includes}/CDropdownItemPlain.api.mdx | 0 .../api-includes}/CDropdownMenu.api.mdx | 0 .../api-includes}/CDropdownToggle.api.mdx | 0 .../api-includes}/CFocusTrap.api.mdx | 0 .../api => src/api-includes}/CFooter.api.mdx | 0 .../api => src/api-includes}/CForm.api.mdx | 0 .../api-includes}/CFormCheck.api.mdx | 0 .../CFormControlValidation.api.mdx | 0 .../api-includes}/CFormControlWrapper.api.mdx | 0 .../api-includes}/CFormFeedback.api.mdx | 0 .../api-includes}/CFormFloating.api.mdx | 0 .../api-includes}/CFormInput.api.mdx | 0 .../api-includes}/CFormLabel.api.mdx | 0 .../api-includes}/CFormRange.api.mdx | 0 .../api-includes}/CFormSelect.api.mdx | 0 .../api-includes}/CFormSwitch.api.mdx | 0 .../api-includes}/CFormText.api.mdx | 0 .../api-includes}/CFormTextarea.api.mdx | 0 .../api => src/api-includes}/CHeader.api.mdx | 0 .../api-includes}/CHeaderBrand.api.mdx | 0 .../api-includes}/CHeaderDivider.api.mdx | 0 .../api-includes}/CHeaderNav.api.mdx | 0 .../api-includes}/CHeaderText.api.mdx | 0 .../api-includes}/CHeaderToggler.api.mdx | 0 .../api => src/api-includes}/CIcon.api.mdx | 0 .../api => src/api-includes}/CIconSvg.api.mdx | 0 .../api => src/api-includes}/CImage.api.mdx | 0 .../api-includes}/CInputGroup.api.mdx | 0 .../api-includes}/CInputGroupText.api.mdx | 0 .../api => src/api-includes}/CLink.api.mdx | 0 .../api-includes}/CListGroup.api.mdx | 0 .../api-includes}/CListGroupItem.api.mdx | 0 .../api => src/api-includes}/CModal.api.mdx | 0 .../api-includes}/CModalBody.api.mdx | 0 .../api-includes}/CModalContent.api.mdx | 0 .../api-includes}/CModalDialog.api.mdx | 0 .../api-includes}/CModalFooter.api.mdx | 0 .../api-includes}/CModalHeader.api.mdx | 0 .../api-includes}/CModalTitle.api.mdx | 0 .../api => src/api-includes}/CNav.api.mdx | 0 .../api-includes}/CNavGroup.api.mdx | 0 .../api-includes}/CNavGroupItems.api.mdx | 0 .../api => src/api-includes}/CNavItem.api.mdx | 0 .../api => src/api-includes}/CNavLink.api.mdx | 0 .../api-includes}/CNavTitle.api.mdx | 0 .../api => src/api-includes}/CNavbar.api.mdx | 0 .../api-includes}/CNavbarBrand.api.mdx | 0 .../api-includes}/CNavbarNav.api.mdx | 0 .../api-includes}/CNavbarText.api.mdx | 0 .../api-includes}/CNavbarToggler.api.mdx | 0 .../api-includes}/COffcanvas.api.mdx | 0 .../api-includes}/COffcanvasBody.api.mdx | 0 .../api-includes}/COffcanvasHeader.api.mdx | 0 .../api-includes}/COffcanvasTitle.api.mdx | 0 .../api-includes}/CPagination.api.mdx | 0 .../api-includes}/CPaginationItem.api.mdx | 0 .../api-includes}/CPlaceholder.api.mdx | 0 .../api => src/api-includes}/CPopover.api.mdx | 0 .../api-includes}/CProgress.api.mdx | 0 .../api-includes}/CProgressBar.api.mdx | 0 .../api-includes}/CProgressStacked.api.mdx | 0 .../api => src/api-includes}/CRow.api.mdx | 0 .../api-includes}/CSearchButton.api.mdx | 0 .../api => src/api-includes}/CSidebar.api.mdx | 0 .../api-includes}/CSidebarBrand.api.mdx | 0 .../api-includes}/CSidebarFooter.api.mdx | 0 .../api-includes}/CSidebarHeader.api.mdx | 0 .../api-includes}/CSidebarNav.api.mdx | 0 .../api-includes}/CSidebarToggler.api.mdx | 0 .../api => src/api-includes}/CSpinner.api.mdx | 0 .../api => src/api-includes}/CTab.api.mdx | 0 .../api-includes}/CTabContent.api.mdx | 0 .../api => src/api-includes}/CTabList.api.mdx | 0 .../api => src/api-includes}/CTabPane.api.mdx | 0 .../api-includes}/CTabPanel.api.mdx | 0 .../api => src/api-includes}/CTable.api.mdx | 0 .../api-includes}/CTableBody.api.mdx | 0 .../api-includes}/CTableCaption.api.mdx | 0 .../api-includes}/CTableDataCell.api.mdx | 0 .../api-includes}/CTableFoot.api.mdx | 0 .../api-includes}/CTableHead.api.mdx | 0 .../api-includes}/CTableHeaderCell.api.mdx | 0 .../CTableResponsiveWrapper.api.mdx | 0 .../api-includes}/CTableRow.api.mdx | 0 .../api => src/api-includes}/CTabs.api.mdx | 0 .../api => src/api-includes}/CToast.api.mdx | 0 .../api-includes}/CToastBody.api.mdx | 0 .../api-includes}/CToastClose.api.mdx | 0 .../api-includes}/CToastHeader.api.mdx | 0 .../api => src/api-includes}/CToaster.api.mdx | 0 .../api => src/api-includes}/CTooltip.api.mdx | 0 .../api-includes}/CWidgetStatsA.api.mdx | 0 .../api-includes}/CWidgetStatsB.api.mdx | 0 .../api-includes}/CWidgetStatsC.api.mdx | 0 .../api-includes}/CWidgetStatsD.api.mdx | 0 .../api-includes}/CWidgetStatsE.api.mdx | 0 .../api-includes}/CWidgetStatsF.api.mdx | 0 packages/docs/src/api/CAccordion.api.json | 38 + packages/docs/src/api/CAccordionBody.api.json | 14 + .../docs/src/api/CAccordionButton.api.json | 14 + .../docs/src/api/CAccordionHeader.api.json | 14 + packages/docs/src/api/CAccordionItem.api.json | 30 + packages/docs/src/api/CAlert.api.json | 54 + packages/docs/src/api/CAlertHeading.api.json | 22 + packages/docs/src/api/CAlertLink.api.json | 14 + packages/docs/src/api/CAvatar.api.json | 62 + packages/docs/src/api/CBackdrop.api.json | 22 + packages/docs/src/api/CBadge.api.json | 70 + packages/docs/src/api/CBreadcrumb.api.json | 14 + .../docs/src/api/CBreadcrumbItem.api.json | 38 + packages/docs/src/api/CButton.api.json | 94 + packages/docs/src/api/CButtonGroup.api.json | 30 + packages/docs/src/api/CButtonToolbar.api.json | 14 + packages/docs/src/api/CCallout.api.json | 22 + packages/docs/src/api/CCard.api.json | 38 + packages/docs/src/api/CCardBody.api.json | 14 + packages/docs/src/api/CCardFooter.api.json | 14 + packages/docs/src/api/CCardGroup.api.json | 14 + packages/docs/src/api/CCardHeader.api.json | 22 + packages/docs/src/api/CCardImage.api.json | 30 + .../docs/src/api/CCardImageOverlay.api.json | 14 + packages/docs/src/api/CCardLink.api.json | 22 + packages/docs/src/api/CCardSubtitle.api.json | 22 + packages/docs/src/api/CCardText.api.json | 22 + packages/docs/src/api/CCardTitle.api.json | 22 + packages/docs/src/api/CCarousel.api.json | 102 + .../docs/src/api/CCarouselCaption.api.json | 14 + packages/docs/src/api/CCarouselItem.api.json | 22 + packages/docs/src/api/CChart.api.json | 126 + packages/docs/src/api/CCharts.api.json | 118 + packages/docs/src/api/CChip.api.json | 166 + packages/docs/src/api/CChipInput.api.json | 198 + packages/docs/src/api/CChipSet.api.json | 134 + packages/docs/src/api/CCloseButton.api.json | 38 + packages/docs/src/api/CCol.api.json | 62 + packages/docs/src/api/CCollapse.api.json | 46 + .../docs/src/api/CConditionalPortal.api.json | 22 + packages/docs/src/api/CContainer.api.json | 62 + packages/docs/src/api/CDropdown.api.json | 142 + .../docs/src/api/CDropdownDivider.api.json | 14 + .../docs/src/api/CDropdownHeader.api.json | 22 + packages/docs/src/api/CDropdownItem.api.json | 46 + .../docs/src/api/CDropdownItemPlain.api.json | 22 + packages/docs/src/api/CDropdownMenu.api.json | 22 + .../docs/src/api/CDropdownToggle.api.json | 134 + packages/docs/src/api/CFocusTrap.api.json | 62 + packages/docs/src/api/CFooter.api.json | 22 + packages/docs/src/api/CForm.api.json | 22 + packages/docs/src/api/CFormCheck.api.json | 134 + .../src/api/CFormControlValidation.api.json | 62 + .../docs/src/api/CFormControlWrapper.api.json | 86 + packages/docs/src/api/CFormFeedback.api.json | 46 + packages/docs/src/api/CFormFloating.api.json | 14 + packages/docs/src/api/CFormInput.api.json | 158 + packages/docs/src/api/CFormLabel.api.json | 22 + packages/docs/src/api/CFormRange.api.json | 78 + packages/docs/src/api/CFormSelect.api.json | 134 + packages/docs/src/api/CFormSwitch.api.json | 70 + packages/docs/src/api/CFormText.api.json | 22 + packages/docs/src/api/CFormTextarea.api.json | 134 + packages/docs/src/api/CHeader.api.json | 30 + packages/docs/src/api/CHeaderBrand.api.json | 22 + packages/docs/src/api/CHeaderDivider.api.json | 14 + packages/docs/src/api/CHeaderNav.api.json | 22 + packages/docs/src/api/CHeaderText.api.json | 14 + packages/docs/src/api/CHeaderToggler.api.json | 14 + packages/docs/src/api/CIcon.api.json | 94 + packages/docs/src/api/CIconSvg.api.json | 54 + packages/docs/src/api/CImage.api.json | 46 + packages/docs/src/api/CInputGroup.api.json | 22 + .../docs/src/api/CInputGroupText.api.json | 22 + packages/docs/src/api/CLink.api.json | 46 + packages/docs/src/api/CListGroup.api.json | 38 + packages/docs/src/api/CListGroupItem.api.json | 46 + packages/docs/src/api/CModal.api.json | 134 + packages/docs/src/api/CModalBody.api.json | 14 + packages/docs/src/api/CModalContent.api.json | 14 + packages/docs/src/api/CModalDialog.api.json | 46 + packages/docs/src/api/CModalFooter.api.json | 14 + packages/docs/src/api/CModalHeader.api.json | 22 + packages/docs/src/api/CModalTitle.api.json | 22 + packages/docs/src/api/CNav.api.json | 38 + packages/docs/src/api/CNavGroup.api.json | 54 + packages/docs/src/api/CNavGroupItems.api.json | 22 + packages/docs/src/api/CNavItem.api.json | 46 + packages/docs/src/api/CNavLink.api.json | 46 + packages/docs/src/api/CNavTitle.api.json | 22 + packages/docs/src/api/CNavbar.api.json | 62 + packages/docs/src/api/CNavbarBrand.api.json | 30 + packages/docs/src/api/CNavbarNav.api.json | 22 + packages/docs/src/api/CNavbarText.api.json | 14 + packages/docs/src/api/CNavbarToggler.api.json | 14 + packages/docs/src/api/COffcanvas.api.json | 94 + packages/docs/src/api/COffcanvasBody.api.json | 14 + .../docs/src/api/COffcanvasHeader.api.json | 14 + .../docs/src/api/COffcanvasTitle.api.json | 22 + packages/docs/src/api/CPagination.api.json | 30 + .../docs/src/api/CPaginationItem.api.json | 30 + packages/docs/src/api/CPlaceholder.api.json | 94 + packages/docs/src/api/CPopover.api.json | 118 + packages/docs/src/api/CProgress.api.json | 78 + packages/docs/src/api/CProgressBar.api.json | 46 + .../docs/src/api/CProgressStacked.api.json | 14 + packages/docs/src/api/CRow.api.json | 62 + packages/docs/src/api/CSearchButton.api.json | 62 + packages/docs/src/api/CSidebar.api.json | 110 + packages/docs/src/api/CSidebarBrand.api.json | 22 + packages/docs/src/api/CSidebarFooter.api.json | 14 + packages/docs/src/api/CSidebarHeader.api.json | 14 + packages/docs/src/api/CSidebarNav.api.json | 38 + .../docs/src/api/CSidebarToggler.api.json | 14 + packages/docs/src/api/CSpinner.api.json | 54 + packages/docs/src/api/CTab.api.json | 30 + packages/docs/src/api/CTabContent.api.json | 14 + packages/docs/src/api/CTabList.api.json | 30 + packages/docs/src/api/CTabPane.api.json | 46 + packages/docs/src/api/CTabPanel.api.json | 54 + packages/docs/src/api/CTable.api.json | 150 + packages/docs/src/api/CTableBody.api.json | 22 + packages/docs/src/api/CTableCaption.api.json | 5 + packages/docs/src/api/CTableDataCell.api.json | 38 + packages/docs/src/api/CTableFoot.api.json | 22 + packages/docs/src/api/CTableHead.api.json | 22 + .../docs/src/api/CTableHeaderCell.api.json | 22 + .../src/api/CTableResponsiveWrapper.api.json | 14 + packages/docs/src/api/CTableRow.api.json | 38 + packages/docs/src/api/CTabs.api.json | 38 + packages/docs/src/api/CToast.api.json | 70 + packages/docs/src/api/CToastBody.api.json | 14 + packages/docs/src/api/CToastClose.api.json | 94 + packages/docs/src/api/CToastHeader.api.json | 22 + packages/docs/src/api/CToaster.api.json | 30 + packages/docs/src/api/CTooltip.api.json | 110 + packages/docs/src/api/CWidgetStatsA.api.json | 54 + packages/docs/src/api/CWidgetStatsB.api.json | 62 + packages/docs/src/api/CWidgetStatsC.api.json | 62 + packages/docs/src/api/CWidgetStatsD.api.json | 46 + packages/docs/src/api/CWidgetStatsE.api.json | 38 + packages/docs/src/api/CWidgetStatsF.api.json | 62 + packages/docs/src/assets/coreui-react.svg | 28 - .../docs/src/assets/images/brand/icon.png | Bin 18140 -> 0 bytes .../docs/src/assets/images/hex_bootstrap.png | Bin 222282 -> 0 bytes packages/docs/src/assets/images/hex_react.png | Bin 187632 -> 0 bytes packages/docs/src/components/AddedIn.tsx | 15 - packages/docs/src/components/Ads.tsx | 27 - packages/docs/src/components/Banner.tsx | 83 - packages/docs/src/components/Callout.tsx | 96 - .../docs/src/components/ClassNamesDocs.tsx | 134 - packages/docs/src/components/CodeBlock.tsx | 37 - .../docs/src/components/ComponentSubNav.tsx | 128 - packages/docs/src/components/Example.tsx | 20 - .../docs/src/components/ExampleSnippet.tsx | 193 - packages/docs/src/components/Footer.tsx | 47 - packages/docs/src/components/Header.tsx | 179 - packages/docs/src/components/JSXDocs.tsx | 36 - .../docs/src/components/OtherFrameworks.tsx | 88 - packages/docs/src/components/ScssDocs.tsx | 90 - packages/docs/src/components/Seo.tsx | 198 - packages/docs/src/components/Sidebar.tsx | 79 - packages/docs/src/components/SidebarNav.tsx | 69 - packages/docs/src/components/Toc.tsx | 77 - packages/docs/src/components/index.ts | 39 - packages/docs/src/content.config.ts | 26 + .../components/accordion/accessibility.mdx | 7 +- .../content/docs/components/accordion/api.mdx | 26 + .../docs/components/accordion/bootstrap.mdx | 46 + .../examples/AccordionAlwaysOpenExample.tsx | 0 .../accordion/examples/AccordionExample.tsx | 0 .../examples/AccordionFlushExample.tsx | 0 .../docs/components/accordion/index.mdx | 48 + .../docs}/components/accordion/styling.mdx | 7 +- .../src/content/docs/components/alert/api.mdx | 21 + .../docs/components/alert/bootstrap.mdx | 101 + .../AlertAdditionalContentExample.tsx | 0 .../alert/examples/AlertDismissingExample.tsx | 0 .../alert/examples/AlertExample.tsx | 0 .../alert/examples/AlertIcons1Example.tsx | 0 .../alert/examples/AlertIcons2Example.tsx | 0 .../alert/examples/AlertLinkColorExample.tsx | 0 .../alert/examples/AlertLiveExample.tsx | 0 .../alert/examples/AlertSolidExample.tsx | 0 .../content/docs/components/alert/index.mdx | 102 + .../docs}/components/alert/styling.mdx | 7 +- .../content/docs/components/avatar/api.mdx | 11 + .../docs/components/avatar/bootstrap.mdx | 83 + .../components/avatar/examples/AvatarIcon.tsx | 0 .../avatar/examples/AvatarImage.tsx | 12 + .../avatar/examples/AvatarLetter.tsx | 0 .../avatar/examples/AvatarRounded.tsx | 0 .../avatar/examples/AvatarSizes.tsx | 0 .../avatar/examples/AvatarSquare.tsx | 0 .../avatar/examples/AvatarWithStatus.tsx | 3 +- .../content/docs/components/avatar/index.mdx | 85 + .../docs}/components/avatar/styling.mdx | 7 +- .../src/content/docs/components/badge/api.mdx | 11 + .../docs/components/badge/bootstrap.mdx | 85 + .../badge/examples/Badge2Example.tsx | 0 .../badge/examples/Badge3Example.tsx | 0 .../examples/BadgeContextual2Variations.tsx | 0 .../examples/BadgeContextualVariations.tsx | 0 .../badge/examples/BadgeExample.tsx | 0 .../badge/examples/BadgePillExample.tsx | 0 .../examples/BadgePositioned2Example.tsx | 0 .../badge/examples/BadgePositionedExample.tsx | 0 .../content/docs/components/badge/index.mdx | 88 + .../docs}/components/badge/styling.mdx | 7 +- .../docs/components/breadcrumb/api.mdx | 16 + .../docs/components/breadcrumb/bootstrap.mdx | 76 + .../examples/BreadcrumbDividers2Example.jsx | 0 .../examples/BreadcrumbDividers2Example.tsx | 0 .../examples/BreadcrumbDividers3Example.jsx | 0 .../examples/BreadcrumbDividers3Example.tsx | 0 .../examples/BreadcrumbDividersExample.jsx | 0 .../examples/BreadcrumbDividersExample.tsx | 0 .../breadcrumb/examples/BreadcrumbExample.tsx | 0 .../docs}/components/breadcrumb/index.mdx | 38 +- .../docs}/components/breadcrumb/styling.mdx | 7 +- .../docs/components/button-group/api.mdx | 16 + .../components/button-group/bootstrap.mdx | 122 + .../examples/ButtonGroup2Example.tsx | 0 .../ButtonGroupCheckboxAndRadio2Example.tsx | 0 .../ButtonGroupCheckboxAndRadioExample.tsx | 0 .../examples/ButtonGroupExample.tsx | 0 .../ButtonGroupMixedStylesExample.tsx | 0 .../examples/ButtonGroupNestingExample.tsx | 0 .../ButtonGroupOutlinedStylesExample.tsx | 0 .../examples/ButtonGroupSizingExample.tsx | 0 .../examples/ButtonGroupVerticalExample.tsx | 0 .../examples/ButtonToolbar2Example.tsx | 0 .../examples/ButtonToolbarExample.tsx | 0 .../docs/components/button-group/index.mdx | 119 + .../content/docs/components/button/api.mdx | 11 + .../docs/components/button/bootstrap.mdx | 164 + .../button/examples/ButtonBlock2Example.tsx | 0 .../button/examples/ButtonBlock3Example.tsx | 0 .../button/examples/ButtonBlock4Example.tsx | 0 .../button/examples/ButtonBlockExample.tsx | 0 .../examples/ButtonComponentsExample.tsx | 0 .../examples/ButtonDisabled2Example.tsx | 0 .../button/examples/ButtonDisabledExample.tsx | 0 .../button/examples/ButtonExample.tsx | 0 .../examples/ButtonGhostBaseClassExample.tsx | 0 .../button/examples/ButtonGhostExample.tsx | 0 .../ButtonOutlineBaseClassExample.tsx | 0 .../button/examples/ButtonOutlineExample.tsx | 0 .../examples/ButtonShapePillExample.tsx | 0 .../examples/ButtonShapeSquareExample.tsx | 0 .../button/examples/ButtonSizes2Example.tsx | 0 .../button/examples/ButtonSizes3Example.jsx | 0 .../button/examples/ButtonSizes3Example.tsx | 0 .../button/examples/ButtonSizesExample.tsx | 0 .../content/docs/components/button/index.mdx | 194 + .../docs}/components/button/styling.mdx | 7 +- .../content/docs/components/callout/api.mdx | 11 + .../callout/examples/CalloutExample.tsx | 0 .../content/docs/components/callout/index.mdx | 26 + .../docs}/components/callout/styling.mdx | 7 +- .../src/content/docs/components/card/api.mdx | 61 + .../docs/components/card/bootstrap.mdx | 289 + .../card/examples/CardBodyExample.tsx | 0 .../components/card/examples/CardExample.tsx | 3 +- .../card/examples/CardGrid2Example.tsx | 9 +- .../card/examples/CardGrid3Example.tsx | 9 +- .../card/examples/CardGrid4Example.tsx | 7 +- .../card/examples/CardGridExample.tsx | 9 +- .../card/examples/CardGroups2Example.tsx | 7 +- .../card/examples/CardGroupsExample.tsx | 7 +- .../card/examples/CardHeader2Example.tsx | 0 .../card/examples/CardHeader3Example.tsx | 0 .../examples/CardHeaderAndFooterExample.tsx | 0 .../card/examples/CardHeaderExample.tsx | 0 .../card/examples/CardImageCapsExample.tsx | 5 +- .../examples/CardImageHorizontalExample.tsx | 3 +- .../examples/CardImageOverlaysExample.tsx | 3 +- .../card/examples/CardImagesExample.tsx | 3 +- .../card/examples/CardKitchenSinkExample.tsx | 3 +- .../card/examples/CardListGroups2Example.tsx | 0 .../card/examples/CardListGroups3Example.tsx | 0 .../card/examples/CardListGroupsExample.tsx | 0 .../card/examples/CardNavigation2Example.tsx | 0 .../card/examples/CardNavigationExample.tsx | 0 .../card/examples/CardSizing2Example.tsx | 0 .../card/examples/CardSizing3Example.tsx | 0 .../card/examples/CardSizingExample.tsx | 0 .../CardStylesBackgroundAndColorExample.tsx | 0 .../card/examples/CardStylesBorderExample.tsx | 0 .../examples/CardStylesTopBorderExample.tsx | 0 .../examples/CardTextAlignmentExample.tsx | 0 .../card/examples/CardTitleExample.tsx | 0 .../content/docs/components/card/index.mdx | 322 + .../content/docs}/components/card/styling.mdx | 7 +- .../content/docs/components/carousel/api.mdx | 21 + .../docs/components/carousel/bootstrap.mdx | 83 + .../examples/CarouselCrossfadeExample.tsx | 7 +- .../examples/CarouselDarkVariantExample.tsx | 7 +- .../examples/CarouselSlidesOnlyExample.tsx | 18 + .../examples/CarouselWithCaptionsExample.tsx | 7 +- .../examples/CarouselWithControlsExample.tsx | 7 +- .../CarouselWithIndicatorsExample.tsx | 7 +- .../docs/components/carousel/index.mdx | 84 + .../docs/components/carousel/styling.mdx | 9 + .../src/content/docs/components/chart/api.mdx | 11 + .../chart/examples/ChartBarExample.jsx | 0 .../chart/examples/ChartBarExample.tsx | 0 .../chart/examples/ChartBubbleExample.jsx | 0 .../chart/examples/ChartBubbleExample.tsx | 0 .../examples/ChartDoughnutAndPieExample.jsx | 0 .../examples/ChartDoughnutAndPieExample.tsx | 0 .../chart/examples/ChartLineExample.jsx | 0 .../chart/examples/ChartLineExample.tsx | 0 .../chart/examples/ChartPolarAreaExample.jsx | 0 .../chart/examples/ChartPolarAreaExample.tsx | 0 .../chart/examples/ChartRadarExample.jsx | 0 .../chart/examples/ChartRadarExample.tsx | 0 .../chart/examples/ChartScatterExample.jsx | 0 .../chart/examples/ChartScatterExample.tsx | 0 .../content/docs/components/chart/index.mdx | 108 + .../content/docs/components/chip-set/api.mdx | 11 + .../chip-set/examples/ChipSetExample.tsx | 0 .../examples/ChipSetFilterExample.tsx | 0 .../examples/ChipSetRemovableExample.tsx | 0 .../examples/ChipSetSelectableExample.tsx | 0 .../examples/ChipSetSingleExample.tsx | 0 .../docs}/components/chip-set/index.mdx | 40 +- .../docs}/components/chip-set/styling.mdx | 7 +- .../docs}/components/chip/accessibility.mdx | 7 +- .../src/content/docs/components/chip/api.mdx | 11 + .../docs/components/chip/bootstrap.mdx | 139 + .../chip/examples/ChipActiveStateExample.tsx | 0 .../chip/examples/ChipAvatarExample.tsx | 5 +- .../examples/ChipDismissButtonExample.tsx | 0 .../chip/examples/ChipDismissibleExample.tsx | 0 .../components/chip/examples/ChipExample.tsx | 0 .../chip/examples/ChipIconExample.tsx | 0 .../chip/examples/ChipInteractiveExample.tsx | 0 .../chip/examples/ChipOutlineExample.tsx | 0 .../examples/ChipOutlineVariantsExample.tsx | 0 .../chip/examples/ChipSizesExample.tsx | 7 +- .../chip/examples/ChipVariantsExample.tsx | 0 .../content/docs/components/chip/index.mdx | 156 + .../content/docs}/components/chip/styling.mdx | 7 +- .../docs/components/close-button/api.mdx | 11 + .../components/close-button/bootstrap.mdx | 43 + .../examples/CloseButtonDarkExample.tsx | 0 .../examples/CloseButtonDisabledExample.tsx | 0 .../examples/CloseButtonExample.tsx | 0 .../docs/components/close-button/index.mdx | 44 + .../content/docs/components/collapse/api.mdx | 11 + .../docs/components/collapse/bootstrap.mdx | 49 + .../collapse/examples/CollapseExample.tsx | 0 .../examples/CollapseHorizontalExample.tsx | 0 .../CollapseMultipleTargetsExample.tsx | 0 .../docs/components/collapse/index.mdx | 48 + .../content/docs/components/dropdown/api.mdx | 41 + .../docs/components/dropdown/bootstrap.mdx | 239 + .../examples/DropdownCenteredExample.tsx | 0 .../examples/DropdownDark2Example.tsx | 0 .../dropdown/examples/DropdownDarkExample.tsx | 0 .../examples/DropdownDropendExample.tsx | 0 .../examples/DropdownDropstartExample.tsx | 0 .../DropdownDropupCenteredExample.tsx | 0 .../examples/DropdownDropupExample.tsx | 0 .../examples/DropdownMenuAlignmentExample.tsx | 0 .../DropdownMenuContentDividersExample.tsx | 0 .../DropdownMenuContentFormsExample.tsx | 0 .../DropdownMenuContentHeadersExample.tsx | 0 .../DropdownMenuContentTextExample.tsx | 0 .../examples/DropdownMenuItems2Example.tsx | 0 .../DropdownMenuItemsActiveExample.tsx | 0 .../DropdownMenuItemsDisabledExample.tsx | 0 .../examples/DropdownMenuItemsExample.tsx | 0 ...ropdownOptionsAutoCloseBehaviorExample.tsx | 0 .../examples/DropdownOptionsExample.tsx | 0 .../DropdownResponsiveAlignment2Example.tsx | 0 .../DropdownResponsiveAlignmentExample.tsx | 0 .../examples/DropdownSingleButton2Example.tsx | 0 .../examples/DropdownSingleButton3Example.tsx | 0 .../examples/DropdownSingleButtonExample.tsx | 0 .../examples/DropdownSizingLargeExample.tsx | 0 .../examples/DropdownSizingSmallExample.tsx | 0 .../examples/DropdownSplitButtonExample.tsx | 0 .../docs/components/dropdown/index.mdx | 307 + .../docs}/components/dropdown/styling.mdx | 7 +- .../components/examples/BasicUsageExample.tsx | 70 + .../docs/components/examples/BrandExample.tsx | 29 + .../docs/components/examples/FlagsExample.tsx | 29 + .../docs/components/examples/IconDemo0.tsx | 19 + .../docs/components/examples/IconDemo1.tsx | 38 + .../components/examples/LinearExample.tsx | 29 + .../components/examples/TabPanesExample.tsx | 69 + .../components/focus-trap/accessibility.mdx | 7 +- .../docs/components/focus-trap/api.mdx | 11 + .../examples/FocusTrapBasicExample.tsx | 0 .../examples/FocusTrapConditionalExample.tsx | 0 .../examples/FocusTrapDropdownExample.tsx | 0 .../examples/FocusTrapEventsExample.jsx | 0 .../examples/FocusTrapEventsExample.tsx | 0 .../examples/FocusTrapFocusControlExample.tsx | 0 .../examples/FocusTrapModalExample.tsx | 0 .../examples/FocusTrapRestoreFocusExample.tsx | 0 .../examples/FocusTrapSidebarExample.tsx | 0 .../docs}/components/focus-trap/index.mdx | 57 +- .../content/docs}/components/footer.mdx | 15 +- .../content/docs}/components/header.mdx | 104 +- .../docs/src/content/docs/components/icon.mdx | 259 + .../src/content/docs/components/image/api.mdx | 11 + .../docs/components/image/bootstrap.mdx | 55 + .../image/examples/ImageAligning2Example.tsx | 3 +- .../image/examples/ImageAligning3Example.tsx | 3 +- .../image/examples/ImageAligningExample.tsx | 11 + .../image/examples/ImageResponsiveExample.tsx | 3 +- .../image/examples/ImageThumbnailExample.tsx | 6 + .../content/docs/components/image/index.mdx | 56 + .../docs/components/list-group/api.mdx | 16 + .../docs/components/list-group/bootstrap.mdx | 139 + .../examples/ListGroupActiveItemsExample.tsx | 0 .../ListGroupCheckboxesAndRadios2Example.tsx | 0 .../ListGroupCheckboxesAndRadios3Example.tsx | 0 .../ListGroupCheckboxesAndRadiosExample.tsx | 0 .../ListGroupContextualClasses2Example.tsx | 0 .../ListGroupContextualClassesExample.tsx | 0 .../ListGroupCustomContentExample.tsx | 0 .../ListGroupDisabledItemsExample.tsx | 0 .../list-group/examples/ListGroupExample.tsx | 0 .../examples/ListGroupFlushExample.tsx | 0 .../examples/ListGroupHorizontalExample.jsx | 0 .../examples/ListGroupHorizontalExample.tsx | 0 .../ListGroupLinksAndButtons2Example.tsx | 0 .../ListGroupLinksAndButtonsExample.tsx | 0 .../examples/ListGroupWithBadgesExample.tsx | 0 .../docs/components/list-group/index.mdx | 146 + .../docs}/components/list-group/styling.mdx | 7 +- .../src/content/docs/components/modal/api.mdx | 31 + .../docs/components/modal/bootstrap.mdx | 175 + .../modal/examples/ModalFullscreenExample.tsx | 0 .../modal/examples/ModalLiveDemoExample.tsx | 0 .../examples/ModalOptionalSizesExample.tsx | 0 .../ModalScrollingLongContent2Example.tsx | 0 .../ModalScrollingLongContentExample.tsx | 0 .../examples/ModalStaticBackdropExample.tsx | 0 .../ModalToggleBetweenModalsExample.tsx | 0 .../ModalTooltipsAndPopoversExample.tsx | 0 .../ModalVerticallyCenteredExample.tsx | 0 ...dalVerticallyCenteredScrollableExample.tsx | 0 .../content/docs}/components/modal/index.mdx | 71 +- .../docs}/components/modal/styling.mdx | 7 +- .../content/docs/components/navbar/api.mdx | 31 + .../docs/components/navbar/bootstrap.mdx | 205 + .../navbar/examples/NavbarBrand2Example.tsx | 3 +- .../navbar/examples/NavbarBrand3Example.tsx | 3 +- .../navbar/examples/NavbarBrandExample.tsx | 0 .../examples/NavbarColorSchemesExample.tsx | 0 .../examples/NavbarContainers2Example.tsx | 0 .../examples/NavbarContainersExample.tsx | 0 .../navbar/examples/NavbarExample.tsx | 0 .../navbar/examples/NavbarForms2Example.tsx | 0 .../navbar/examples/NavbarForms3Example.tsx | 0 .../navbar/examples/NavbarForms4Example.tsx | 0 .../navbar/examples/NavbarFormsExample.tsx | 0 .../navbar/examples/NavbarNav2Example.tsx | 0 .../navbar/examples/NavbarNav3Example.tsx | 0 .../navbar/examples/NavbarNavExample.tsx | 0 .../examples/NavbarPlacementExample.tsx | 0 .../NavbarPlacementFixedBottomExample.tsx | 0 .../NavbarPlacementFixedTopExample.tsx | 0 .../NavbarPlacementStickyTopExample.tsx | 0 ...NavbarResponsiveExternalContentExample.tsx | 0 .../NavbarResponsiveOffcanvas2Example.tsx | 0 .../NavbarResponsiveOffcanvasExample.tsx | 0 .../NavbarResponsiveToggler2Example.tsx | 0 .../NavbarResponsiveToggler3Example.tsx | 0 .../NavbarResponsiveTogglerExample.tsx | 0 .../components/navbar/examples/NavbarText.tsx | 0 .../content/docs/components/navbar/index.mdx | 255 + .../docs}/components/navbar/styling.mdx | 7 +- .../content/docs/components/navs-tabs/api.mdx | 31 + .../docs/components/navs-tabs/bootstrap.mdx | 166 + .../navs-tabs/examples/Nav2Example.tsx | 0 .../navs-tabs/examples/NavEnclosedExample.tsx | 0 .../examples/NavEnclosedPillsExample.tsx | 0 .../navs-tabs/examples/NavExample.tsx | 0 .../examples/NavFillAndJustify2Example.tsx | 0 .../examples/NavFillAndJustifyExample.tsx | 0 .../NavHorizontalAlignment2Example.tsx | 0 .../NavHorizontalAlignmentExample.tsx | 0 .../navs-tabs/examples/NavPillsExample.tsx | 0 .../examples/NavPillsWithDropdownExample.tsx | 0 .../examples/NavTabPanes2Example.tsx | 0 .../navs-tabs/examples/NavTabPanesExample.tsx | 0 .../navs-tabs/examples/NavTabsExample.tsx | 0 .../examples/NavTabsWithDropdownExample.tsx | 0 .../examples/NavUnderlineBorderExample.tsx | 0 .../examples/NavUnderlineExample.tsx | 0 .../navs-tabs/examples/NavVerticalExample.tsx | 0 .../NavWorkingWithFlexUtilitiesExample.tsx | 0 .../docs/components/navs-tabs/index.mdx | 207 + .../docs}/components/navs-tabs/styling.mdx | 7 +- .../content/docs/components/offcanvas/api.mdx | 26 + .../docs/components/offcanvas/bootstrap.mdx | 119 + ...fcanvasBodyScrollingAndBackdropExample.tsx | 0 .../OffcanvasBodyScrollingExample.tsx | 0 .../examples/OffcanvasDarkExample.tsx | 0 .../offcanvas/examples/OffcanvasExample.tsx | 0 .../examples/OffcanvasLiveExample.tsx | 0 .../OffcanvasPlacementBottomExample.tsx | 0 .../OffcanvasPlacementRightExample.tsx | 0 .../examples/OffcanvasPlacementTopExample.tsx | 0 .../examples/OffcanvasResponsiveExample.tsx | 0 .../OffcanvasStaticBackdropExample.tsx | 0 .../docs/components/offcanvas/index.mdx | 127 + .../docs}/components/offcanvas/styling.mdx | 7 +- .../docs/components/pagination/api.mdx | 16 + .../docs/components/pagination/bootstrap.mdx | 76 + .../examples/PaginationAlignment2Example.tsx | 0 .../examples/PaginationAlignmentExample.tsx | 0 .../PaginationDisabledAndActiveExample.tsx | 0 .../pagination/examples/PaginationExample.tsx | 0 .../examples/PaginationSizingLargeExample.tsx | 0 .../examples/PaginationSizingSmallExample.tsx | 0 .../PaginationWorkingWithIconsExample.tsx | 0 .../docs/components/pagination/index.mdx | 81 + .../docs}/components/pagination/styling.mdx | 7 +- .../docs/components/placeholder/api.mdx | 11 + .../docs/components/placeholder/bootstrap.mdx | 83 + .../examples/Placeholder2Example.tsx | 0 .../examples/PlaceholderAnimationExample.tsx | 0 .../examples/PlaceholderColorExample.tsx | 0 .../examples/PlaceholderExample.tsx | 3 +- .../examples/PlaceholderSizingExample.tsx | 0 .../examples/PlaceholderWidthExample.tsx | 0 .../docs/components/placeholder/index.mdx | 87 + .../docs/components/placeholder/styling.mdx | 9 + .../content/docs/components/popover/api.mdx | 11 + .../docs/components/popover/bootstrap.mdx | 70 + .../examples/PopoverCustomPopoversExample.jsx | 0 .../examples/PopoverCustomPopoversExample.tsx | 0 .../PopoverDisabledElementsExample.tsx | 0 .../examples/PopoverDismissExample.tsx | 0 .../examples/PopoverFourDirectionsExample.tsx | 0 .../popover/examples/PopoverLiveExample.tsx | 0 .../content/docs/components/popover/index.mdx | 69 + .../docs}/components/popover/styling.mdx | 7 +- .../content/docs/components/progress/api.mdx | 16 + .../docs/components/progress/bootstrap.mdx | 140 + .../ProgressAnimatedStripedExample.tsx | 0 .../examples/ProgressBackgrounds2Example.tsx | 0 .../examples/ProgressBackgroundsExample.tsx | 0 .../progress/examples/ProgressExample.tsx | 0 .../examples/ProgressHeight2Example.tsx | 0 .../examples/ProgressHeightExample.tsx | 0 .../examples/ProgressLabels2Example.tsx | 0 .../examples/ProgressLabelsExample.tsx | 0 .../examples/ProgressMultipleBarsExample.tsx | 0 .../examples/ProgressStripedExample.tsx | 0 .../docs/components/progress/index.mdx | 137 + .../docs}/components/progress/styling.mdx | 7 +- .../docs/components/search-button/api.mdx | 11 + .../components/search-button/bootstrap.mdx | 43 + .../SearchButtonCustomShortcutExample.tsx | 0 .../examples/SearchButtonExample.tsx | 0 .../examples/SearchButtonOffcanvasExample.tsx | 0 .../docs}/components/search-button/index.mdx | 31 +- .../components/search-button/styling.mdx | 7 +- .../content/docs/components/sidebar/api.mdx | 37 + .../docs/components/sidebar/bootstrap.mdx | 81 + .../examples/SidebarCompactExample.tsx | 0 .../SidebarControlledGroupExample.tsx | 0 .../SidebarCustomIndicatorExample.tsx | 0 .../sidebar/examples/SidebarDarkExample.tsx | 0 .../sidebar/examples/SidebarExample.tsx | 0 .../examples/SidebarGroupIndicatorExample.tsx | 0 .../sidebar/examples/SidebarNarrowExample.tsx | 0 .../sidebar/examples/SidebarTreeExample.tsx | 0 .../examples/SidebarUnfoldableExample.tsx | 0 .../docs}/components/sidebar/index.mdx | 102 +- .../docs}/components/sidebar/styling.mdx | 7 +- .../content/docs/components/spinner/api.mdx | 11 + .../docs/components/spinner/bootstrap.mdx | 134 + .../examples/SpinnerBorderColorsExample.tsx | 0 .../spinner/examples/SpinnerBorderExample.tsx | 0 .../examples/SpinnerBorderMarginExample.tsx | 0 .../SpinnerBorderPlacementFlex2Example.tsx | 0 .../SpinnerBorderPlacementFlexExample.tsx | 0 .../SpinnerBorderPlacementFloatsExample.tsx | 0 ...SpinnerBorderPlacementTextAlignExample.tsx | 0 .../examples/SpinnerButtons2Example.tsx | 0 .../examples/SpinnerButtonsExample.tsx | 0 .../examples/SpinnerGrowColorsExample.tsx | 0 .../spinner/examples/SpinnerGrowExample.tsx | 0 .../examples/SpinnerSizeCustomExample.tsx | 0 .../examples/SpinnerSizeSmallExample.tsx | 0 .../content/docs/components/spinner/index.mdx | 140 + .../docs}/components/spinner/styling.mdx | 7 +- .../src/content/docs/components/table/api.mdx | 41 + .../docs/components/table/bootstrap.mdx | 1003 +++ .../table/examples/ActiveTableDarkExample.tsx | 59 + .../table/examples/ActiveTableExample.tsx | 59 + .../table/examples/BootstrapDemo0.tsx | 69 + .../table/examples/BootstrapDemo1.tsx | 66 + .../table/examples/BootstrapDemo2.tsx | 66 + .../table/examples/BootstrapDemo3.tsx | 66 + .../table/examples/BootstrapDemo4.tsx | 66 + .../table/examples/BootstrapDemo5.tsx | 66 + .../table/examples/BootstrapDemo6.tsx | 66 + .../components/table/examples/TableDemo0.tsx | 69 + .../components/table/examples/TableDemo1.tsx | 66 + .../components/table/examples/TableDemo2.tsx | 66 + .../components/table/examples/TableDemo3.tsx | 66 + .../components/table/examples/TableDemo4.tsx | 66 + .../components/table/examples/TableDemo5.tsx | 66 + .../components/table/examples/TableDemo6.tsx | 66 + .../table/examples/TableExample.tsx | 18 +- .../table/examples/TableFoodExample.tsx | 64 + .../table/examples/TableVariantsExample.tsx | 0 .../table/examples/VariantExample.tsx | 84 + .../examples/VerticalAlignmentExample.tsx | 55 + .../content/docs/components/table/index.mdx | 1006 +++ .../content/docs/components/table/styling.mdx | 13 + .../src/content/docs/components/tabs/api.mdx | 31 + .../docs/components/tabs/bootstrap.mdx | 101 + .../tabs/examples/TabsControlledExample.jsx | 0 .../tabs/examples/TabsControlledExample.tsx | 0 .../tabs/examples/TabsEnclosedExample.tsx | 0 .../examples/TabsEnclosedPillsExample.tsx | 0 .../components/tabs/examples/TabsExample.tsx | 0 .../tabs/examples/TabsPillsExample.tsx | 0 .../examples/TabsUnderlineBorderExample.tsx | 0 .../tabs/examples/TabsUnderlineExample.tsx | 0 .../tabs/examples/TabsUnstyledExample.tsx | 0 .../TabsUnstyledFillAndJustify2Example.tsx | 0 .../TabsUnstyledFillAndJustifyExample.tsx | 0 .../content/docs}/components/tabs/index.mdx | 70 +- .../content/docs}/components/tabs/styling.mdx | 7 +- .../src/content/docs/components/toast/api.mdx | 31 + .../docs/components/toast/bootstrap.mdx | 82 + .../examples/ToastColorSchemesExample.tsx | 0 .../examples/ToastCustomContent2Example.tsx | 0 .../examples/ToastCustomContentExample.tsx | 0 .../toast/examples/ToastExample.tsx | 0 .../toast/examples/ToastLiveExample.jsx | 0 .../toast/examples/ToastLiveExample.tsx | 0 .../toast/examples/ToastStackingExample.tsx | 0 .../examples/ToastTranslucentExample.tsx | 0 .../content/docs/components/toast/index.mdx | 96 + .../docs}/components/toast/styling.mdx | 7 +- .../content/docs/components/tooltip/api.mdx | 11 + .../docs/components/tooltip/bootstrap.mdx | 58 + .../tooltip/examples/TooltipCustomExample.jsx | 0 .../tooltip/examples/TooltipCustomExample.tsx | 0 .../examples/TooltipDirectionsExample.tsx | 0 .../TooltipDisabledElementsExample.tsx | 0 .../examples/TooltipOnLinksExample.tsx | 0 .../content/docs/components/tooltip/index.mdx | 59 + .../docs}/components/tooltip/styling.mdx | 7 +- .../content/docs/components/widgets/api.mdx | 37 + .../widgets/examples/WidgetStatsAExample.tsx | 0 .../widgets/examples/WidgetStatsBExample.tsx | 0 .../widgets/examples/WidgetStatsCExample.tsx | 0 .../widgets/examples/WidgetStatsDExample.jsx | 0 .../widgets/examples/WidgetStatsDExample.tsx | 0 .../widgets/examples/WidgetStatsEExample.tsx | 0 .../widgets/examples/WidgetStatsFExample.tsx | 0 .../content/docs/components/widgets/index.mdx | 66 + .../content/docs}/customize/css-variables.mdx | 8 +- .../content/docs}/customize/options.mdx | 8 +- .../content/docs}/customize/sass.mdx | 8 +- .../src/content/docs/forms/checkbox/api.mdx | 11 + .../content/docs/forms/checkbox/bootstrap.mdx | 107 + .../examples/CheckboxDisabledExample.tsx | 0 .../checkbox/examples/CheckboxExample.tsx | 0 .../examples/CheckboxIndeterminateExample.tsx | 0 .../examples/CheckboxInlineExample.tsx | 0 .../examples/CheckboxReverseExample.tsx | 0 .../examples/CheckboxStackedExample.tsx | 0 .../examples/CheckboxToggleButtonsExample.tsx | 0 ...kboxToggleButtonsOutlinedStylesExample.tsx | 0 .../examples/CheckboxWithoutLabelsExample.tsx | 0 .../src/content/docs/forms/checkbox/index.mdx | 106 + .../content/docs/forms/checkbox/styling.mdx | 9 + .../content/docs}/forms/checks-radios.mdx | 23 +- .../docs}/forms/chip-input/accessibility.mdx | 7 +- .../src/content/docs/forms/chip-input/api.mdx | 11 + .../docs/forms/chip-input/bootstrap.mdx | 99 + .../examples/ChipInputClassNameExample.tsx | 0 .../examples/ChipInputControlledExample.tsx | 0 .../examples/ChipInputDisabledExample.tsx | 0 .../examples/ChipInputEmptyStateExample.tsx | 0 .../chip-input/examples/ChipInputExample.tsx | 0 .../examples/ChipInputMaxExample.tsx | 0 .../examples/ChipInputReadonlyExample.tsx | 0 .../examples/ChipInputSelectableExample.tsx | 0 .../examples/ChipInputSeparatorExample.tsx | 0 .../examples/ChipInputSizesExample.tsx | 0 .../examples/ChipInputVariantsExample.tsx | 0 .../examples/ChipInputWithLabelExample.tsx | 0 .../content/docs/forms/chip-input/index.mdx | 122 + .../docs}/forms/chip-input/styling.mdx | 7 +- .../docs/forms/examples/OverviewDemo0.tsx | 37 + .../docs/forms/examples/OverviewDemo1.tsx | 26 + .../docs/forms/examples/OverviewDemo2.tsx | 31 + .../docs/forms/examples/OverviewDemo3.tsx | 35 + .../docs/forms/floating-labels/api.mdx | 11 + .../docs/forms/floating-labels/bootstrap.mdx | 100 + .../examples/FloatingLabels2Example.tsx | 0 .../examples/FloatingLabelsExample.tsx | 0 .../examples/FloatingLabelsLayoutExample.tsx | 0 .../examples/FloatingLabelsSelectExample.tsx | 0 .../FloatingLabelsTextarea2Example.tsx | 0 .../FloatingLabelsTextareaExample.tsx | 0 .../FloatingLabelsValidationExample.tsx | 0 .../docs/forms/floating-labels/index.mdx | 92 + .../docs/forms/floating-labels/styling.mdx | 9 + .../content/docs}/forms/form-control.mdx | 23 +- .../content/docs/forms/input-group/api.mdx | 16 + .../docs/forms/input-group/bootstrap.mdx | 132 + .../InputGroupButtonAddonsExample.tsx | 0 .../InputGroupButtonsWithDropdownsExample.tsx | 0 .../InputGroupCheckboxesAndRadiosExample.tsx | 0 .../InputGroupCustomFileInputExample.tsx | 0 .../InputGroupCustomSelectExample.tsx | 0 .../examples/InputGroupExample.tsx | 0 .../InputGroupMultipleAddonsExample.tsx | 0 .../InputGroupMultipleInputsExample.tsx | 0 .../InputGroupSegmentedButtonsExample.tsx | 0 .../examples/InputGroupSizingExample.tsx | 0 .../examples/InputGroupWrappingExample.tsx | 0 .../content/docs/forms/input-group/index.mdx | 121 + .../docs/forms/input-group/styling.mdx | 9 + .../examples/InputMaskCreditCardExample.tsx | 0 .../input-mask/examples/InputMaskExample.tsx | 0 .../examples/InputMaskPhoneExample.tsx | 0 .../content/docs}/forms/input-mask/index.mdx | 26 +- .../docs/src/content/docs/forms/input/api.mdx | 26 + .../content/docs/forms/input/bootstrap.mdx | 111 + .../input/examples/FormInputColorExample.tsx | 0 .../FormInputCustomClassNamesExample.tsx | 0 .../examples/FormInputDisabledExample.tsx | 0 .../forms/input/examples/FormInputExample.tsx | 0 .../input/examples/FormInputFileExample.tsx | 0 .../examples/FormInputReadonlyExample.tsx | 0 .../FormInputReadonlyPlainText2Example.tsx | 0 .../FormInputReadonlyPlainTextExample.tsx | 0 .../input/examples/FormInputSizingExample.tsx | 0 .../src/content/docs/forms/input/index.mdx | 100 + .../content/docs}/forms/input/styling.mdx | 7 +- .../content/docs/forms/layout/bootstrap.mdx | 116 + .../examples/LayoutAutoSizing2Example.tsx | 0 .../examples/LayoutAutoSizingExample.tsx | 0 .../examples/LayoutColumnSizingExample.tsx | 0 .../layout/examples/LayoutFormGridExample.tsx | 0 .../layout/examples/LayoutGutters2Example.tsx | 0 .../layout/examples/LayoutGuttersExample.tsx | 0 .../examples/LayoutHorizontalFormExample.tsx | 0 ...LayoutHorizontalFormLabelSizingExample.tsx | 0 .../examples/LayoutInlineFormsExample.tsx | 0 .../content/docs}/forms/layout/index.mdx | 62 +- .../content/docs}/forms/overview.mdx | 96 +- .../docs/src/content/docs/forms/radio/api.mdx | 11 + .../content/docs/forms/radio/bootstrap.mdx | 87 + .../radio/examples/RadioDisabledExample.tsx | 0 .../forms/radio/examples/RadioExample.tsx | 0 .../radio/examples/RadioInlineExample.tsx | 0 .../radio/examples/RadioReverseExample.tsx | 0 .../radio/examples/RadioStackedExample.tsx | 0 .../examples/RadioToggleButtonsExample.tsx | 0 ...adioToggleButtonsOutlinedStylesExample.tsx | 0 .../examples/RadioWithoutLabelsExample.tsx | 0 .../src/content/docs/forms/radio/index.mdx | 96 + .../src/content/docs/forms/radio/styling.mdx | 9 + .../docs/src/content/docs/forms/range/api.mdx | 11 + .../content/docs/forms/range/bootstrap.mdx | 57 + .../examples/FormRangeDisabledExample.tsx | 0 .../forms/range/examples/FormRangeExample.tsx | 0 .../examples/FormRangeMinAndMaxExample.tsx | 0 .../range/examples/FormRangeStepsExample.tsx | 0 .../src/content/docs/forms/range/index.mdx | 54 + .../src/content/docs/forms/range/styling.mdx | 9 + .../src/content/docs/forms/select/api.mdx | 26 + .../content/docs/forms/select/bootstrap.mdx | 77 + .../examples/FormSelectDisabledExample.tsx | 0 .../select/examples/FormSelectExample.tsx | 0 .../examples/FormSelectSizing2Example.tsx | 0 .../examples/FormSelectSizing3Example.tsx | 0 .../examples/FormSelectSizingExample.tsx | 0 .../src/content/docs/forms/select/index.mdx | 72 + .../src/content/docs/forms/select/styling.mdx | 9 + .../src/content/docs/forms/switch/api.mdx | 11 + .../content/docs/forms/switch/bootstrap.mdx | 47 + .../switch/examples/FormSwitchExample.tsx | 0 .../examples/FormSwitchReverseExample.tsx | 0 .../examples/FormSwitchSizingExample.tsx | 0 .../src/content/docs/forms/switch/index.mdx | 48 + .../src/content/docs/forms/switch/styling.mdx | 9 + .../src/content/docs/forms/textarea/api.mdx | 26 + .../content/docs/forms/textarea/bootstrap.mdx | 60 + .../examples/FormTextareaDisabledExample.tsx | 0 .../textarea/examples/FormTextareaExample.tsx | 0 .../examples/FormTextareaReadonlyExample.tsx | 0 .../src/content/docs/forms/textarea/index.mdx | 53 + .../content/docs}/forms/textarea/styling.mdx | 7 +- .../docs/forms/validation/bootstrap.mdx | 79 + .../ValidationBrowserDefaultsExample.tsx | 0 .../examples/ValidationCustomExample.tsx | 0 .../validation/examples/ValidationExample.jsx | 0 .../validation/examples/ValidationExample.tsx | 0 .../ValidationSupportedElementsExample.tsx | 0 .../examples/ValidationTooltipsExample.jsx | 0 .../examples/ValidationTooltipsExample.tsx | 0 .../content/docs/forms/validation/index.mdx | 69 + .../docs}/forms/validation/styling.mdx | 7 +- .../docs}/getting-started/accessibility.mdx | 8 +- .../docs}/getting-started/introduction.mdx | 8 +- .../content/docs}/layout/breakpoints.mdx | 8 +- .../content/docs}/layout/columns.mdx | 12 +- .../content/docs}/layout/containers.mdx | 12 +- .../content/docs}/layout/grid.mdx | 18 +- .../content/docs}/layout/gutters.mdx | 18 +- .../content/docs}/migration/v4.mdx | 7 +- .../content/docs}/migration/v5.mdx | 7 +- .../docs/templates/admin-dashboard.mdx | 14 + .../content/docs}/templates/contents.mdx | 8 +- .../content/docs}/templates/customize.mdx | 8 +- .../content/docs}/templates/download.mdx | 7 +- .../examples/AdminDashboardDemo0.tsx} | 16 +- .../content/docs}/templates/installation.mdx | 8 +- packages/docs/src/data/config.yml | 38 + packages/docs/src/data/logo.svg | 10 + packages/docs/src/data/sidebar.yml | 178 + packages/docs/src/hooks/useStickyObserver.ts | 36 - packages/docs/src/images/gatsby-astronaut.png | Bin 167273 -> 0 bytes packages/docs/src/images/gatsby-icon.png | Bin 21212 -> 0 bytes packages/docs/src/index.ts | 1 - packages/docs/src/nav.tsx | 426 -- packages/docs/src/pages/404.tsx | 32 - packages/docs/src/sandbox.ts | 88 + packages/docs/src/styles/_ads.scss | 41 - packages/docs/src/styles/_anchor.scss | 20 - packages/docs/src/styles/_callouts.scss | 42 - .../docs/src/styles/_component-examples.scss | 508 -- .../docs/src/styles/_component-sub-nav.scss | 38 - packages/docs/src/styles/_footer.scss | 21 - packages/docs/src/styles/_header.scss | 9 - packages/docs/src/styles/_layout.scss | 57 - packages/docs/src/styles/_prism.scss | 176 - packages/docs/src/styles/_root.scss | 19 - packages/docs/src/styles/_scrolling.scss | 24 - packages/docs/src/styles/_sidebar.scss | 32 - packages/docs/src/styles/_table-api.scss | 52 - packages/docs/src/styles/_toc.scss | 93 - packages/docs/src/styles/_variables.scss | 10 - .../docs/src/styles/bootstrap-examples.scss | 538 -- packages/docs/src/styles/search.scss | 168 - packages/docs/src/styles/styles.scss | 22 - packages/docs/src/templates/DefaultLayout.tsx | 24 - packages/docs/src/templates/DocsLayout.tsx | 174 - packages/docs/src/templates/MdxLayout.tsx | 130 - packages/docs/src/utils/codesandbox.ts | 76 - packages/docs/src/utils/prism.ts | 6 - packages/docs/src/utils/prismGlobal.ts | 5 - packages/docs/src/utils/projectUtils.ts | 146 - packages/docs/src/utils/stackblitz.ts | 49 - packages/docs/static/images/angular.jpg | Bin 169234 -> 0 bytes packages/docs/static/images/avatars/1.jpg | Bin 13887 -> 0 bytes packages/docs/static/images/avatars/2.jpg | Bin 12870 -> 0 bytes packages/docs/static/images/avatars/3.jpg | Bin 13528 -> 0 bytes packages/docs/static/images/avatars/4.jpg | Bin 13725 -> 0 bytes packages/docs/static/images/avatars/5.jpg | Bin 12666 -> 0 bytes packages/docs/static/images/avatars/6.jpg | Bin 11918 -> 0 bytes packages/docs/static/images/avatars/7.jpg | Bin 14285 -> 0 bytes packages/docs/static/images/avatars/8.jpg | Bin 15146 -> 0 bytes packages/docs/static/images/avatars/9.jpg | Bin 12451 -> 0 bytes .../static/images/brand/coreui-signet.svg | 10 - packages/docs/static/images/react.jpg | Bin 199537 -> 0 bytes packages/docs/static/images/react400.jpg | Bin 5700 -> 0 bytes packages/docs/static/images/vue.jpg | Bin 170599 -> 0 bytes packages/docs/static/index.html | 3 - packages/docs/tsconfig.json | 7 + 1177 files changed, 27860 insertions(+), 16488 deletions(-) create mode 100644 packages/docs/.gitignore create mode 100644 packages/docs/api.config.mjs create mode 100644 packages/docs/astro.config.mjs delete mode 100644 packages/docs/build/api.mjs delete mode 100644 packages/docs/content/components/accordion/api.mdx delete mode 100644 packages/docs/content/components/accordion/bootstrap.mdx delete mode 100644 packages/docs/content/components/accordion/index.mdx delete mode 100644 packages/docs/content/components/alert/api.mdx delete mode 100644 packages/docs/content/components/alert/bootstrap.mdx delete mode 100644 packages/docs/content/components/alert/index.mdx delete mode 100644 packages/docs/content/components/avatar/api.mdx delete mode 100644 packages/docs/content/components/avatar/bootstrap.mdx delete mode 100644 packages/docs/content/components/avatar/examples/AvatarImage.tsx delete mode 100644 packages/docs/content/components/avatar/index.mdx delete mode 100644 packages/docs/content/components/badge/api.mdx delete mode 100644 packages/docs/content/components/badge/bootstrap.mdx delete mode 100644 packages/docs/content/components/badge/index.mdx delete mode 100644 packages/docs/content/components/breadcrumb/api.mdx delete mode 100644 packages/docs/content/components/breadcrumb/bootstrap.mdx delete mode 100644 packages/docs/content/components/button-group/api.mdx delete mode 100644 packages/docs/content/components/button-group/bootstrap.mdx delete mode 100644 packages/docs/content/components/button-group/index.mdx delete mode 100644 packages/docs/content/components/button/api.mdx delete mode 100644 packages/docs/content/components/button/bootstrap.mdx delete mode 100644 packages/docs/content/components/button/index.mdx delete mode 100644 packages/docs/content/components/callout/api.mdx delete mode 100644 packages/docs/content/components/callout/index.mdx delete mode 100644 packages/docs/content/components/card/api.mdx delete mode 100644 packages/docs/content/components/card/bootstrap.mdx delete mode 100644 packages/docs/content/components/card/index.mdx delete mode 100644 packages/docs/content/components/carousel/api.mdx delete mode 100644 packages/docs/content/components/carousel/bootstrap.mdx delete mode 100644 packages/docs/content/components/carousel/examples/CarouselSlidesOnlyExample.tsx delete mode 100644 packages/docs/content/components/carousel/index.mdx delete mode 100644 packages/docs/content/components/carousel/styling.mdx delete mode 100644 packages/docs/content/components/chart/api.mdx delete mode 100644 packages/docs/content/components/chart/index.mdx delete mode 100644 packages/docs/content/components/chip-set/api.mdx delete mode 100644 packages/docs/content/components/chip/api.mdx delete mode 100644 packages/docs/content/components/chip/bootstrap.mdx delete mode 100644 packages/docs/content/components/chip/index.mdx delete mode 100644 packages/docs/content/components/close-button/api.mdx delete mode 100644 packages/docs/content/components/close-button/bootstrap.mdx delete mode 100644 packages/docs/content/components/close-button/index.mdx delete mode 100644 packages/docs/content/components/collapse/api.mdx delete mode 100644 packages/docs/content/components/collapse/bootstrap.mdx delete mode 100644 packages/docs/content/components/collapse/index.mdx delete mode 100644 packages/docs/content/components/dropdown/api.mdx delete mode 100644 packages/docs/content/components/dropdown/bootstrap.mdx delete mode 100644 packages/docs/content/components/dropdown/index.mdx delete mode 100644 packages/docs/content/components/focus-trap/api.mdx delete mode 100644 packages/docs/content/components/icon.mdx delete mode 100644 packages/docs/content/components/image/api.mdx delete mode 100644 packages/docs/content/components/image/bootstrap.mdx delete mode 100644 packages/docs/content/components/image/examples/ImageAligningExample.tsx delete mode 100644 packages/docs/content/components/image/examples/ImageThumbnailExample.tsx delete mode 100644 packages/docs/content/components/image/index.mdx delete mode 100644 packages/docs/content/components/list-group/api.mdx delete mode 100644 packages/docs/content/components/list-group/bootstrap.mdx delete mode 100644 packages/docs/content/components/list-group/index.mdx delete mode 100644 packages/docs/content/components/modal/api.mdx delete mode 100644 packages/docs/content/components/modal/bootstrap.mdx delete mode 100644 packages/docs/content/components/navbar/api.mdx delete mode 100644 packages/docs/content/components/navbar/bootstrap.mdx delete mode 100644 packages/docs/content/components/navbar/index.mdx delete mode 100644 packages/docs/content/components/navs-tabs/api.mdx delete mode 100644 packages/docs/content/components/navs-tabs/bootstrap.mdx delete mode 100644 packages/docs/content/components/navs-tabs/index.mdx delete mode 100644 packages/docs/content/components/offcanvas/api.mdx delete mode 100644 packages/docs/content/components/offcanvas/bootstrap.mdx delete mode 100644 packages/docs/content/components/offcanvas/index.mdx delete mode 100644 packages/docs/content/components/pagination/api.mdx delete mode 100644 packages/docs/content/components/pagination/bootstrap.mdx delete mode 100644 packages/docs/content/components/pagination/index.mdx delete mode 100644 packages/docs/content/components/placeholder/api.mdx delete mode 100644 packages/docs/content/components/placeholder/bootstrap.mdx delete mode 100644 packages/docs/content/components/placeholder/index.mdx delete mode 100644 packages/docs/content/components/placeholder/styling.mdx delete mode 100644 packages/docs/content/components/popover/api.mdx delete mode 100644 packages/docs/content/components/popover/bootstrap.mdx delete mode 100644 packages/docs/content/components/popover/index.mdx delete mode 100644 packages/docs/content/components/progress/api.mdx delete mode 100644 packages/docs/content/components/progress/bootstrap.mdx delete mode 100644 packages/docs/content/components/progress/index.mdx delete mode 100644 packages/docs/content/components/search-button/api.mdx delete mode 100644 packages/docs/content/components/search-button/bootstrap.mdx delete mode 100644 packages/docs/content/components/sidebar/api.mdx delete mode 100644 packages/docs/content/components/sidebar/bootstrap.mdx delete mode 100644 packages/docs/content/components/spinner/api.mdx delete mode 100644 packages/docs/content/components/spinner/bootstrap.mdx delete mode 100644 packages/docs/content/components/spinner/index.mdx delete mode 100644 packages/docs/content/components/table/api.mdx delete mode 100644 packages/docs/content/components/table/bootstrap.mdx delete mode 100644 packages/docs/content/components/table/index.mdx delete mode 100644 packages/docs/content/components/table/styling.mdx delete mode 100644 packages/docs/content/components/tabs/api.mdx delete mode 100644 packages/docs/content/components/tabs/bootstrap.mdx delete mode 100644 packages/docs/content/components/toast/api.mdx delete mode 100644 packages/docs/content/components/toast/bootstrap.mdx delete mode 100644 packages/docs/content/components/toast/index.mdx delete mode 100644 packages/docs/content/components/tooltip/api.mdx delete mode 100644 packages/docs/content/components/tooltip/bootstrap.mdx delete mode 100644 packages/docs/content/components/tooltip/index.mdx delete mode 100644 packages/docs/content/components/widgets/api.mdx delete mode 100644 packages/docs/content/components/widgets/index.mdx delete mode 100644 packages/docs/content/forms/checkbox/api.mdx delete mode 100644 packages/docs/content/forms/checkbox/bootstrap.mdx delete mode 100644 packages/docs/content/forms/checkbox/index.mdx delete mode 100644 packages/docs/content/forms/checkbox/styling.mdx delete mode 100644 packages/docs/content/forms/chip-input/api.mdx delete mode 100644 packages/docs/content/forms/chip-input/bootstrap.mdx delete mode 100644 packages/docs/content/forms/chip-input/index.mdx delete mode 100644 packages/docs/content/forms/floating-labels/api.mdx delete mode 100644 packages/docs/content/forms/floating-labels/bootstrap.mdx delete mode 100644 packages/docs/content/forms/floating-labels/index.mdx delete mode 100644 packages/docs/content/forms/floating-labels/styling.mdx delete mode 100644 packages/docs/content/forms/input-group/api.mdx delete mode 100644 packages/docs/content/forms/input-group/bootstrap.mdx delete mode 100644 packages/docs/content/forms/input-group/index.mdx delete mode 100644 packages/docs/content/forms/input-group/styling.mdx delete mode 100644 packages/docs/content/forms/input/api.mdx delete mode 100644 packages/docs/content/forms/input/bootstrap.mdx delete mode 100644 packages/docs/content/forms/input/index.mdx delete mode 100644 packages/docs/content/forms/layout/bootstrap.mdx delete mode 100644 packages/docs/content/forms/radio/api.mdx delete mode 100644 packages/docs/content/forms/radio/bootstrap.mdx delete mode 100644 packages/docs/content/forms/radio/index.mdx delete mode 100644 packages/docs/content/forms/radio/styling.mdx delete mode 100644 packages/docs/content/forms/range/api.mdx delete mode 100644 packages/docs/content/forms/range/bootstrap.mdx delete mode 100644 packages/docs/content/forms/range/index.mdx delete mode 100644 packages/docs/content/forms/range/styling.mdx delete mode 100644 packages/docs/content/forms/select/api.mdx delete mode 100644 packages/docs/content/forms/select/bootstrap.mdx delete mode 100644 packages/docs/content/forms/select/index.mdx delete mode 100644 packages/docs/content/forms/select/styling.mdx delete mode 100644 packages/docs/content/forms/switch/api.mdx delete mode 100644 packages/docs/content/forms/switch/bootstrap.mdx delete mode 100644 packages/docs/content/forms/switch/index.mdx delete mode 100644 packages/docs/content/forms/switch/styling.mdx delete mode 100644 packages/docs/content/forms/textarea/api.mdx delete mode 100644 packages/docs/content/forms/textarea/bootstrap.mdx delete mode 100644 packages/docs/content/forms/textarea/index.mdx delete mode 100644 packages/docs/content/forms/validation/bootstrap.mdx delete mode 100644 packages/docs/content/forms/validation/index.mdx delete mode 100644 packages/docs/gatsby-browser.tsx delete mode 100644 packages/docs/gatsby-config.mjs delete mode 100644 packages/docs/gatsby-node.mjs delete mode 100644 packages/docs/gatsby-ssr.tsx create mode 100644 packages/docs/package-lock.json create mode 100644 packages/docs/scripts/gen-sidebar.mjs create mode 100644 packages/docs/scripts/migrate.mjs delete mode 100644 packages/docs/src/AppContext.tsx rename packages/docs/{content/api => src/api-includes}/CAccordion.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CAccordionBody.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CAccordionButton.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CAccordionHeader.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CAccordionItem.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CAlert.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CAlertHeading.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CAlertLink.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CAvatar.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CBackdrop.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CBadge.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CBreadcrumb.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CBreadcrumbItem.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CButton.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CButtonGroup.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CButtonToolbar.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CCallout.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CCard.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CCardBody.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CCardFooter.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CCardGroup.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CCardHeader.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CCardImage.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CCardImageOverlay.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CCardLink.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CCardSubtitle.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CCardText.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CCardTitle.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CCarousel.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CCarouselCaption.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CCarouselItem.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CChart.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CCharts.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CChip.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CChipInput.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CChipSet.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CCloseButton.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CCol.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CCollapse.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CConditionalPortal.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CContainer.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CDropdown.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CDropdownDivider.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CDropdownHeader.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CDropdownItem.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CDropdownItemPlain.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CDropdownMenu.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CDropdownToggle.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CFocusTrap.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CFooter.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CForm.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CFormCheck.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CFormControlValidation.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CFormControlWrapper.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CFormFeedback.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CFormFloating.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CFormInput.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CFormLabel.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CFormRange.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CFormSelect.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CFormSwitch.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CFormText.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CFormTextarea.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CHeader.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CHeaderBrand.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CHeaderDivider.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CHeaderNav.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CHeaderText.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CHeaderToggler.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CIcon.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CIconSvg.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CImage.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CInputGroup.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CInputGroupText.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CLink.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CListGroup.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CListGroupItem.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CModal.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CModalBody.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CModalContent.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CModalDialog.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CModalFooter.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CModalHeader.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CModalTitle.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CNav.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CNavGroup.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CNavGroupItems.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CNavItem.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CNavLink.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CNavTitle.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CNavbar.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CNavbarBrand.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CNavbarNav.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CNavbarText.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CNavbarToggler.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/COffcanvas.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/COffcanvasBody.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/COffcanvasHeader.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/COffcanvasTitle.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CPagination.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CPaginationItem.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CPlaceholder.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CPopover.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CProgress.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CProgressBar.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CProgressStacked.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CRow.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CSearchButton.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CSidebar.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CSidebarBrand.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CSidebarFooter.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CSidebarHeader.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CSidebarNav.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CSidebarToggler.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CSpinner.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CTab.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CTabContent.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CTabList.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CTabPane.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CTabPanel.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CTable.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CTableBody.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CTableCaption.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CTableDataCell.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CTableFoot.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CTableHead.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CTableHeaderCell.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CTableResponsiveWrapper.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CTableRow.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CTabs.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CToast.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CToastBody.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CToastClose.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CToastHeader.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CToaster.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CTooltip.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CWidgetStatsA.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CWidgetStatsB.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CWidgetStatsC.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CWidgetStatsD.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CWidgetStatsE.api.mdx (100%) rename packages/docs/{content/api => src/api-includes}/CWidgetStatsF.api.mdx (100%) create mode 100644 packages/docs/src/api/CAccordion.api.json create mode 100644 packages/docs/src/api/CAccordionBody.api.json create mode 100644 packages/docs/src/api/CAccordionButton.api.json create mode 100644 packages/docs/src/api/CAccordionHeader.api.json create mode 100644 packages/docs/src/api/CAccordionItem.api.json create mode 100644 packages/docs/src/api/CAlert.api.json create mode 100644 packages/docs/src/api/CAlertHeading.api.json create mode 100644 packages/docs/src/api/CAlertLink.api.json create mode 100644 packages/docs/src/api/CAvatar.api.json create mode 100644 packages/docs/src/api/CBackdrop.api.json create mode 100644 packages/docs/src/api/CBadge.api.json create mode 100644 packages/docs/src/api/CBreadcrumb.api.json create mode 100644 packages/docs/src/api/CBreadcrumbItem.api.json create mode 100644 packages/docs/src/api/CButton.api.json create mode 100644 packages/docs/src/api/CButtonGroup.api.json create mode 100644 packages/docs/src/api/CButtonToolbar.api.json create mode 100644 packages/docs/src/api/CCallout.api.json create mode 100644 packages/docs/src/api/CCard.api.json create mode 100644 packages/docs/src/api/CCardBody.api.json create mode 100644 packages/docs/src/api/CCardFooter.api.json create mode 100644 packages/docs/src/api/CCardGroup.api.json create mode 100644 packages/docs/src/api/CCardHeader.api.json create mode 100644 packages/docs/src/api/CCardImage.api.json create mode 100644 packages/docs/src/api/CCardImageOverlay.api.json create mode 100644 packages/docs/src/api/CCardLink.api.json create mode 100644 packages/docs/src/api/CCardSubtitle.api.json create mode 100644 packages/docs/src/api/CCardText.api.json create mode 100644 packages/docs/src/api/CCardTitle.api.json create mode 100644 packages/docs/src/api/CCarousel.api.json create mode 100644 packages/docs/src/api/CCarouselCaption.api.json create mode 100644 packages/docs/src/api/CCarouselItem.api.json create mode 100644 packages/docs/src/api/CChart.api.json create mode 100644 packages/docs/src/api/CCharts.api.json create mode 100644 packages/docs/src/api/CChip.api.json create mode 100644 packages/docs/src/api/CChipInput.api.json create mode 100644 packages/docs/src/api/CChipSet.api.json create mode 100644 packages/docs/src/api/CCloseButton.api.json create mode 100644 packages/docs/src/api/CCol.api.json create mode 100644 packages/docs/src/api/CCollapse.api.json create mode 100644 packages/docs/src/api/CConditionalPortal.api.json create mode 100644 packages/docs/src/api/CContainer.api.json create mode 100644 packages/docs/src/api/CDropdown.api.json create mode 100644 packages/docs/src/api/CDropdownDivider.api.json create mode 100644 packages/docs/src/api/CDropdownHeader.api.json create mode 100644 packages/docs/src/api/CDropdownItem.api.json create mode 100644 packages/docs/src/api/CDropdownItemPlain.api.json create mode 100644 packages/docs/src/api/CDropdownMenu.api.json create mode 100644 packages/docs/src/api/CDropdownToggle.api.json create mode 100644 packages/docs/src/api/CFocusTrap.api.json create mode 100644 packages/docs/src/api/CFooter.api.json create mode 100644 packages/docs/src/api/CForm.api.json create mode 100644 packages/docs/src/api/CFormCheck.api.json create mode 100644 packages/docs/src/api/CFormControlValidation.api.json create mode 100644 packages/docs/src/api/CFormControlWrapper.api.json create mode 100644 packages/docs/src/api/CFormFeedback.api.json create mode 100644 packages/docs/src/api/CFormFloating.api.json create mode 100644 packages/docs/src/api/CFormInput.api.json create mode 100644 packages/docs/src/api/CFormLabel.api.json create mode 100644 packages/docs/src/api/CFormRange.api.json create mode 100644 packages/docs/src/api/CFormSelect.api.json create mode 100644 packages/docs/src/api/CFormSwitch.api.json create mode 100644 packages/docs/src/api/CFormText.api.json create mode 100644 packages/docs/src/api/CFormTextarea.api.json create mode 100644 packages/docs/src/api/CHeader.api.json create mode 100644 packages/docs/src/api/CHeaderBrand.api.json create mode 100644 packages/docs/src/api/CHeaderDivider.api.json create mode 100644 packages/docs/src/api/CHeaderNav.api.json create mode 100644 packages/docs/src/api/CHeaderText.api.json create mode 100644 packages/docs/src/api/CHeaderToggler.api.json create mode 100644 packages/docs/src/api/CIcon.api.json create mode 100644 packages/docs/src/api/CIconSvg.api.json create mode 100644 packages/docs/src/api/CImage.api.json create mode 100644 packages/docs/src/api/CInputGroup.api.json create mode 100644 packages/docs/src/api/CInputGroupText.api.json create mode 100644 packages/docs/src/api/CLink.api.json create mode 100644 packages/docs/src/api/CListGroup.api.json create mode 100644 packages/docs/src/api/CListGroupItem.api.json create mode 100644 packages/docs/src/api/CModal.api.json create mode 100644 packages/docs/src/api/CModalBody.api.json create mode 100644 packages/docs/src/api/CModalContent.api.json create mode 100644 packages/docs/src/api/CModalDialog.api.json create mode 100644 packages/docs/src/api/CModalFooter.api.json create mode 100644 packages/docs/src/api/CModalHeader.api.json create mode 100644 packages/docs/src/api/CModalTitle.api.json create mode 100644 packages/docs/src/api/CNav.api.json create mode 100644 packages/docs/src/api/CNavGroup.api.json create mode 100644 packages/docs/src/api/CNavGroupItems.api.json create mode 100644 packages/docs/src/api/CNavItem.api.json create mode 100644 packages/docs/src/api/CNavLink.api.json create mode 100644 packages/docs/src/api/CNavTitle.api.json create mode 100644 packages/docs/src/api/CNavbar.api.json create mode 100644 packages/docs/src/api/CNavbarBrand.api.json create mode 100644 packages/docs/src/api/CNavbarNav.api.json create mode 100644 packages/docs/src/api/CNavbarText.api.json create mode 100644 packages/docs/src/api/CNavbarToggler.api.json create mode 100644 packages/docs/src/api/COffcanvas.api.json create mode 100644 packages/docs/src/api/COffcanvasBody.api.json create mode 100644 packages/docs/src/api/COffcanvasHeader.api.json create mode 100644 packages/docs/src/api/COffcanvasTitle.api.json create mode 100644 packages/docs/src/api/CPagination.api.json create mode 100644 packages/docs/src/api/CPaginationItem.api.json create mode 100644 packages/docs/src/api/CPlaceholder.api.json create mode 100644 packages/docs/src/api/CPopover.api.json create mode 100644 packages/docs/src/api/CProgress.api.json create mode 100644 packages/docs/src/api/CProgressBar.api.json create mode 100644 packages/docs/src/api/CProgressStacked.api.json create mode 100644 packages/docs/src/api/CRow.api.json create mode 100644 packages/docs/src/api/CSearchButton.api.json create mode 100644 packages/docs/src/api/CSidebar.api.json create mode 100644 packages/docs/src/api/CSidebarBrand.api.json create mode 100644 packages/docs/src/api/CSidebarFooter.api.json create mode 100644 packages/docs/src/api/CSidebarHeader.api.json create mode 100644 packages/docs/src/api/CSidebarNav.api.json create mode 100644 packages/docs/src/api/CSidebarToggler.api.json create mode 100644 packages/docs/src/api/CSpinner.api.json create mode 100644 packages/docs/src/api/CTab.api.json create mode 100644 packages/docs/src/api/CTabContent.api.json create mode 100644 packages/docs/src/api/CTabList.api.json create mode 100644 packages/docs/src/api/CTabPane.api.json create mode 100644 packages/docs/src/api/CTabPanel.api.json create mode 100644 packages/docs/src/api/CTable.api.json create mode 100644 packages/docs/src/api/CTableBody.api.json create mode 100644 packages/docs/src/api/CTableCaption.api.json create mode 100644 packages/docs/src/api/CTableDataCell.api.json create mode 100644 packages/docs/src/api/CTableFoot.api.json create mode 100644 packages/docs/src/api/CTableHead.api.json create mode 100644 packages/docs/src/api/CTableHeaderCell.api.json create mode 100644 packages/docs/src/api/CTableResponsiveWrapper.api.json create mode 100644 packages/docs/src/api/CTableRow.api.json create mode 100644 packages/docs/src/api/CTabs.api.json create mode 100644 packages/docs/src/api/CToast.api.json create mode 100644 packages/docs/src/api/CToastBody.api.json create mode 100644 packages/docs/src/api/CToastClose.api.json create mode 100644 packages/docs/src/api/CToastHeader.api.json create mode 100644 packages/docs/src/api/CToaster.api.json create mode 100644 packages/docs/src/api/CTooltip.api.json create mode 100644 packages/docs/src/api/CWidgetStatsA.api.json create mode 100644 packages/docs/src/api/CWidgetStatsB.api.json create mode 100644 packages/docs/src/api/CWidgetStatsC.api.json create mode 100644 packages/docs/src/api/CWidgetStatsD.api.json create mode 100644 packages/docs/src/api/CWidgetStatsE.api.json create mode 100644 packages/docs/src/api/CWidgetStatsF.api.json delete mode 100755 packages/docs/src/assets/coreui-react.svg delete mode 100644 packages/docs/src/assets/images/brand/icon.png delete mode 100755 packages/docs/src/assets/images/hex_bootstrap.png delete mode 100755 packages/docs/src/assets/images/hex_react.png delete mode 100644 packages/docs/src/components/AddedIn.tsx delete mode 100644 packages/docs/src/components/Ads.tsx delete mode 100644 packages/docs/src/components/Banner.tsx delete mode 100644 packages/docs/src/components/Callout.tsx delete mode 100644 packages/docs/src/components/ClassNamesDocs.tsx delete mode 100644 packages/docs/src/components/CodeBlock.tsx delete mode 100644 packages/docs/src/components/ComponentSubNav.tsx delete mode 100644 packages/docs/src/components/Example.tsx delete mode 100644 packages/docs/src/components/ExampleSnippet.tsx delete mode 100644 packages/docs/src/components/Footer.tsx delete mode 100644 packages/docs/src/components/Header.tsx delete mode 100644 packages/docs/src/components/JSXDocs.tsx delete mode 100644 packages/docs/src/components/OtherFrameworks.tsx delete mode 100644 packages/docs/src/components/ScssDocs.tsx delete mode 100644 packages/docs/src/components/Seo.tsx delete mode 100644 packages/docs/src/components/Sidebar.tsx delete mode 100644 packages/docs/src/components/SidebarNav.tsx delete mode 100644 packages/docs/src/components/Toc.tsx delete mode 100644 packages/docs/src/components/index.ts create mode 100644 packages/docs/src/content.config.ts rename packages/docs/{content => src/content/docs}/components/accordion/accessibility.mdx (91%) create mode 100644 packages/docs/src/content/docs/components/accordion/api.mdx create mode 100644 packages/docs/src/content/docs/components/accordion/bootstrap.mdx rename packages/docs/{content => src/content/docs}/components/accordion/examples/AccordionAlwaysOpenExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/accordion/examples/AccordionExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/accordion/examples/AccordionFlushExample.tsx (100%) create mode 100644 packages/docs/src/content/docs/components/accordion/index.mdx rename packages/docs/{content => src/content/docs}/components/accordion/styling.mdx (67%) create mode 100644 packages/docs/src/content/docs/components/alert/api.mdx create mode 100644 packages/docs/src/content/docs/components/alert/bootstrap.mdx rename packages/docs/{content => src/content/docs}/components/alert/examples/AlertAdditionalContentExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/alert/examples/AlertDismissingExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/alert/examples/AlertExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/alert/examples/AlertIcons1Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/alert/examples/AlertIcons2Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/alert/examples/AlertLinkColorExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/alert/examples/AlertLiveExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/alert/examples/AlertSolidExample.tsx (100%) create mode 100644 packages/docs/src/content/docs/components/alert/index.mdx rename packages/docs/{content => src/content/docs}/components/alert/styling.mdx (67%) create mode 100644 packages/docs/src/content/docs/components/avatar/api.mdx create mode 100644 packages/docs/src/content/docs/components/avatar/bootstrap.mdx rename packages/docs/{content => src/content/docs}/components/avatar/examples/AvatarIcon.tsx (100%) create mode 100644 packages/docs/src/content/docs/components/avatar/examples/AvatarImage.tsx rename packages/docs/{content => src/content/docs}/components/avatar/examples/AvatarLetter.tsx (100%) rename packages/docs/{content => src/content/docs}/components/avatar/examples/AvatarRounded.tsx (100%) rename packages/docs/{content => src/content/docs}/components/avatar/examples/AvatarSizes.tsx (100%) rename packages/docs/{content => src/content/docs}/components/avatar/examples/AvatarSquare.tsx (100%) rename packages/docs/{content => src/content/docs}/components/avatar/examples/AvatarWithStatus.tsx (65%) create mode 100644 packages/docs/src/content/docs/components/avatar/index.mdx rename packages/docs/{content => src/content/docs}/components/avatar/styling.mdx (67%) create mode 100644 packages/docs/src/content/docs/components/badge/api.mdx create mode 100644 packages/docs/src/content/docs/components/badge/bootstrap.mdx rename packages/docs/{content => src/content/docs}/components/badge/examples/Badge2Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/badge/examples/Badge3Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/badge/examples/BadgeContextual2Variations.tsx (100%) rename packages/docs/{content => src/content/docs}/components/badge/examples/BadgeContextualVariations.tsx (100%) rename packages/docs/{content => src/content/docs}/components/badge/examples/BadgeExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/badge/examples/BadgePillExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/badge/examples/BadgePositioned2Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/badge/examples/BadgePositionedExample.tsx (100%) create mode 100644 packages/docs/src/content/docs/components/badge/index.mdx rename packages/docs/{content => src/content/docs}/components/badge/styling.mdx (66%) create mode 100644 packages/docs/src/content/docs/components/breadcrumb/api.mdx create mode 100644 packages/docs/src/content/docs/components/breadcrumb/bootstrap.mdx rename packages/docs/{content => src/content/docs}/components/breadcrumb/examples/BreadcrumbDividers2Example.jsx (100%) rename packages/docs/{content => src/content/docs}/components/breadcrumb/examples/BreadcrumbDividers2Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/breadcrumb/examples/BreadcrumbDividers3Example.jsx (100%) rename packages/docs/{content => src/content/docs}/components/breadcrumb/examples/BreadcrumbDividers3Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/breadcrumb/examples/BreadcrumbDividersExample.jsx (100%) rename packages/docs/{content => src/content/docs}/components/breadcrumb/examples/BreadcrumbDividersExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/breadcrumb/examples/BreadcrumbExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/breadcrumb/index.mdx (55%) rename packages/docs/{content => src/content/docs}/components/breadcrumb/styling.mdx (66%) create mode 100644 packages/docs/src/content/docs/components/button-group/api.mdx create mode 100644 packages/docs/src/content/docs/components/button-group/bootstrap.mdx rename packages/docs/{content => src/content/docs}/components/button-group/examples/ButtonGroup2Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/button-group/examples/ButtonGroupCheckboxAndRadio2Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/button-group/examples/ButtonGroupCheckboxAndRadioExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/button-group/examples/ButtonGroupExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/button-group/examples/ButtonGroupMixedStylesExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/button-group/examples/ButtonGroupNestingExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/button-group/examples/ButtonGroupOutlinedStylesExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/button-group/examples/ButtonGroupSizingExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/button-group/examples/ButtonGroupVerticalExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/button-group/examples/ButtonToolbar2Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/button-group/examples/ButtonToolbarExample.tsx (100%) create mode 100644 packages/docs/src/content/docs/components/button-group/index.mdx create mode 100644 packages/docs/src/content/docs/components/button/api.mdx create mode 100644 packages/docs/src/content/docs/components/button/bootstrap.mdx rename packages/docs/{content => src/content/docs}/components/button/examples/ButtonBlock2Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/button/examples/ButtonBlock3Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/button/examples/ButtonBlock4Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/button/examples/ButtonBlockExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/button/examples/ButtonComponentsExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/button/examples/ButtonDisabled2Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/button/examples/ButtonDisabledExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/button/examples/ButtonExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/button/examples/ButtonGhostBaseClassExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/button/examples/ButtonGhostExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/button/examples/ButtonOutlineBaseClassExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/button/examples/ButtonOutlineExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/button/examples/ButtonShapePillExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/button/examples/ButtonShapeSquareExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/button/examples/ButtonSizes2Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/button/examples/ButtonSizes3Example.jsx (100%) rename packages/docs/{content => src/content/docs}/components/button/examples/ButtonSizes3Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/button/examples/ButtonSizesExample.tsx (100%) create mode 100644 packages/docs/src/content/docs/components/button/index.mdx rename packages/docs/{content => src/content/docs}/components/button/styling.mdx (67%) create mode 100644 packages/docs/src/content/docs/components/callout/api.mdx rename packages/docs/{content => src/content/docs}/components/callout/examples/CalloutExample.tsx (100%) create mode 100644 packages/docs/src/content/docs/components/callout/index.mdx rename packages/docs/{content => src/content/docs}/components/callout/styling.mdx (66%) create mode 100644 packages/docs/src/content/docs/components/card/api.mdx create mode 100644 packages/docs/src/content/docs/components/card/bootstrap.mdx rename packages/docs/{content => src/content/docs}/components/card/examples/CardBodyExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/card/examples/CardExample.tsx (82%) rename packages/docs/{content => src/content/docs}/components/card/examples/CardGrid2Example.tsx (86%) rename packages/docs/{content => src/content/docs}/components/card/examples/CardGrid3Example.tsx (83%) rename packages/docs/{content => src/content/docs}/components/card/examples/CardGrid4Example.tsx (86%) rename packages/docs/{content => src/content/docs}/components/card/examples/CardGridExample.tsx (86%) rename packages/docs/{content => src/content/docs}/components/card/examples/CardGroups2Example.tsx (85%) rename packages/docs/{content => src/content/docs}/components/card/examples/CardGroupsExample.tsx (84%) rename packages/docs/{content => src/content/docs}/components/card/examples/CardHeader2Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/card/examples/CardHeader3Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/card/examples/CardHeaderAndFooterExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/card/examples/CardHeaderExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/card/examples/CardImageCapsExample.tsx (84%) rename packages/docs/{content => src/content/docs}/components/card/examples/CardImageHorizontalExample.tsx (88%) rename packages/docs/{content => src/content/docs}/components/card/examples/CardImageOverlaysExample.tsx (87%) rename packages/docs/{content => src/content/docs}/components/card/examples/CardImagesExample.tsx (78%) rename packages/docs/{content => src/content/docs}/components/card/examples/CardKitchenSinkExample.tsx (88%) rename packages/docs/{content => src/content/docs}/components/card/examples/CardListGroups2Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/card/examples/CardListGroups3Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/card/examples/CardListGroupsExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/card/examples/CardNavigation2Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/card/examples/CardNavigationExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/card/examples/CardSizing2Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/card/examples/CardSizing3Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/card/examples/CardSizingExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/card/examples/CardStylesBackgroundAndColorExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/card/examples/CardStylesBorderExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/card/examples/CardStylesTopBorderExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/card/examples/CardTextAlignmentExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/card/examples/CardTitleExample.tsx (100%) create mode 100644 packages/docs/src/content/docs/components/card/index.mdx rename packages/docs/{content => src/content/docs}/components/card/styling.mdx (67%) create mode 100644 packages/docs/src/content/docs/components/carousel/api.mdx create mode 100644 packages/docs/src/content/docs/components/carousel/bootstrap.mdx rename packages/docs/{content => src/content/docs}/components/carousel/examples/CarouselCrossfadeExample.tsx (52%) rename packages/docs/{content => src/content/docs}/components/carousel/examples/CarouselDarkVariantExample.tsx (74%) create mode 100644 packages/docs/src/content/docs/components/carousel/examples/CarouselSlidesOnlyExample.tsx rename packages/docs/{content => src/content/docs}/components/carousel/examples/CarouselWithCaptionsExample.tsx (74%) rename packages/docs/{content => src/content/docs}/components/carousel/examples/CarouselWithControlsExample.tsx (50%) rename packages/docs/{content => src/content/docs}/components/carousel/examples/CarouselWithIndicatorsExample.tsx (51%) create mode 100644 packages/docs/src/content/docs/components/carousel/index.mdx create mode 100644 packages/docs/src/content/docs/components/carousel/styling.mdx create mode 100644 packages/docs/src/content/docs/components/chart/api.mdx rename packages/docs/{content => src/content/docs}/components/chart/examples/ChartBarExample.jsx (100%) rename packages/docs/{content => src/content/docs}/components/chart/examples/ChartBarExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/chart/examples/ChartBubbleExample.jsx (100%) rename packages/docs/{content => src/content/docs}/components/chart/examples/ChartBubbleExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/chart/examples/ChartDoughnutAndPieExample.jsx (100%) rename packages/docs/{content => src/content/docs}/components/chart/examples/ChartDoughnutAndPieExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/chart/examples/ChartLineExample.jsx (100%) rename packages/docs/{content => src/content/docs}/components/chart/examples/ChartLineExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/chart/examples/ChartPolarAreaExample.jsx (100%) rename packages/docs/{content => src/content/docs}/components/chart/examples/ChartPolarAreaExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/chart/examples/ChartRadarExample.jsx (100%) rename packages/docs/{content => src/content/docs}/components/chart/examples/ChartRadarExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/chart/examples/ChartScatterExample.jsx (100%) rename packages/docs/{content => src/content/docs}/components/chart/examples/ChartScatterExample.tsx (100%) create mode 100644 packages/docs/src/content/docs/components/chart/index.mdx create mode 100644 packages/docs/src/content/docs/components/chip-set/api.mdx rename packages/docs/{content => src/content/docs}/components/chip-set/examples/ChipSetExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/chip-set/examples/ChipSetFilterExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/chip-set/examples/ChipSetRemovableExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/chip-set/examples/ChipSetSelectableExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/chip-set/examples/ChipSetSingleExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/chip-set/index.mdx (68%) rename packages/docs/{content => src/content/docs}/components/chip-set/styling.mdx (68%) rename packages/docs/{content => src/content/docs}/components/chip/accessibility.mdx (93%) create mode 100644 packages/docs/src/content/docs/components/chip/api.mdx create mode 100644 packages/docs/src/content/docs/components/chip/bootstrap.mdx rename packages/docs/{content => src/content/docs}/components/chip/examples/ChipActiveStateExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/chip/examples/ChipAvatarExample.tsx (69%) rename packages/docs/{content => src/content/docs}/components/chip/examples/ChipDismissButtonExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/chip/examples/ChipDismissibleExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/chip/examples/ChipExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/chip/examples/ChipIconExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/chip/examples/ChipInteractiveExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/chip/examples/ChipOutlineExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/chip/examples/ChipOutlineVariantsExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/chip/examples/ChipSizesExample.tsx (83%) rename packages/docs/{content => src/content/docs}/components/chip/examples/ChipVariantsExample.tsx (100%) create mode 100644 packages/docs/src/content/docs/components/chip/index.mdx rename packages/docs/{content => src/content/docs}/components/chip/styling.mdx (70%) create mode 100644 packages/docs/src/content/docs/components/close-button/api.mdx create mode 100644 packages/docs/src/content/docs/components/close-button/bootstrap.mdx rename packages/docs/{content => src/content/docs}/components/close-button/examples/CloseButtonDarkExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/close-button/examples/CloseButtonDisabledExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/close-button/examples/CloseButtonExample.tsx (100%) create mode 100644 packages/docs/src/content/docs/components/close-button/index.mdx create mode 100644 packages/docs/src/content/docs/components/collapse/api.mdx create mode 100644 packages/docs/src/content/docs/components/collapse/bootstrap.mdx rename packages/docs/{content => src/content/docs}/components/collapse/examples/CollapseExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/collapse/examples/CollapseHorizontalExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/collapse/examples/CollapseMultipleTargetsExample.tsx (100%) create mode 100644 packages/docs/src/content/docs/components/collapse/index.mdx create mode 100644 packages/docs/src/content/docs/components/dropdown/api.mdx create mode 100644 packages/docs/src/content/docs/components/dropdown/bootstrap.mdx rename packages/docs/{content => src/content/docs}/components/dropdown/examples/DropdownCenteredExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/dropdown/examples/DropdownDark2Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/dropdown/examples/DropdownDarkExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/dropdown/examples/DropdownDropendExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/dropdown/examples/DropdownDropstartExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/dropdown/examples/DropdownDropupCenteredExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/dropdown/examples/DropdownDropupExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/dropdown/examples/DropdownMenuAlignmentExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/dropdown/examples/DropdownMenuContentDividersExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/dropdown/examples/DropdownMenuContentFormsExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/dropdown/examples/DropdownMenuContentHeadersExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/dropdown/examples/DropdownMenuContentTextExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/dropdown/examples/DropdownMenuItems2Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/dropdown/examples/DropdownMenuItemsActiveExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/dropdown/examples/DropdownMenuItemsDisabledExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/dropdown/examples/DropdownMenuItemsExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/dropdown/examples/DropdownOptionsAutoCloseBehaviorExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/dropdown/examples/DropdownOptionsExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/dropdown/examples/DropdownResponsiveAlignment2Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/dropdown/examples/DropdownResponsiveAlignmentExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/dropdown/examples/DropdownSingleButton2Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/dropdown/examples/DropdownSingleButton3Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/dropdown/examples/DropdownSingleButtonExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/dropdown/examples/DropdownSizingLargeExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/dropdown/examples/DropdownSizingSmallExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/dropdown/examples/DropdownSplitButtonExample.tsx (100%) create mode 100644 packages/docs/src/content/docs/components/dropdown/index.mdx rename packages/docs/{content => src/content/docs}/components/dropdown/styling.mdx (79%) create mode 100644 packages/docs/src/content/docs/components/examples/BasicUsageExample.tsx create mode 100644 packages/docs/src/content/docs/components/examples/BrandExample.tsx create mode 100644 packages/docs/src/content/docs/components/examples/FlagsExample.tsx create mode 100644 packages/docs/src/content/docs/components/examples/IconDemo0.tsx create mode 100644 packages/docs/src/content/docs/components/examples/IconDemo1.tsx create mode 100644 packages/docs/src/content/docs/components/examples/LinearExample.tsx create mode 100644 packages/docs/src/content/docs/components/examples/TabPanesExample.tsx rename packages/docs/{content => src/content/docs}/components/focus-trap/accessibility.mdx (96%) create mode 100644 packages/docs/src/content/docs/components/focus-trap/api.mdx rename packages/docs/{content => src/content/docs}/components/focus-trap/examples/FocusTrapBasicExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/focus-trap/examples/FocusTrapConditionalExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/focus-trap/examples/FocusTrapDropdownExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/focus-trap/examples/FocusTrapEventsExample.jsx (100%) rename packages/docs/{content => src/content/docs}/components/focus-trap/examples/FocusTrapEventsExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/focus-trap/examples/FocusTrapFocusControlExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/focus-trap/examples/FocusTrapModalExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/focus-trap/examples/FocusTrapRestoreFocusExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/focus-trap/examples/FocusTrapSidebarExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/focus-trap/index.mdx (58%) rename packages/docs/{content => src/content/docs}/components/footer.mdx (61%) rename packages/docs/{content => src/content/docs}/components/header.mdx (54%) create mode 100644 packages/docs/src/content/docs/components/icon.mdx create mode 100644 packages/docs/src/content/docs/components/image/api.mdx create mode 100644 packages/docs/src/content/docs/components/image/bootstrap.mdx rename packages/docs/{content => src/content/docs}/components/image/examples/ImageAligning2Example.tsx (54%) rename packages/docs/{content => src/content/docs}/components/image/examples/ImageAligning3Example.tsx (57%) create mode 100644 packages/docs/src/content/docs/components/image/examples/ImageAligningExample.tsx rename packages/docs/{content => src/content/docs}/components/image/examples/ImageResponsiveExample.tsx (53%) create mode 100644 packages/docs/src/content/docs/components/image/examples/ImageThumbnailExample.tsx create mode 100644 packages/docs/src/content/docs/components/image/index.mdx create mode 100644 packages/docs/src/content/docs/components/list-group/api.mdx create mode 100644 packages/docs/src/content/docs/components/list-group/bootstrap.mdx rename packages/docs/{content => src/content/docs}/components/list-group/examples/ListGroupActiveItemsExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/list-group/examples/ListGroupCheckboxesAndRadios2Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/list-group/examples/ListGroupCheckboxesAndRadios3Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/list-group/examples/ListGroupCheckboxesAndRadiosExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/list-group/examples/ListGroupContextualClasses2Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/list-group/examples/ListGroupContextualClassesExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/list-group/examples/ListGroupCustomContentExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/list-group/examples/ListGroupDisabledItemsExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/list-group/examples/ListGroupExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/list-group/examples/ListGroupFlushExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/list-group/examples/ListGroupHorizontalExample.jsx (100%) rename packages/docs/{content => src/content/docs}/components/list-group/examples/ListGroupHorizontalExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/list-group/examples/ListGroupLinksAndButtons2Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/list-group/examples/ListGroupLinksAndButtonsExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/list-group/examples/ListGroupWithBadgesExample.tsx (100%) create mode 100644 packages/docs/src/content/docs/components/list-group/index.mdx rename packages/docs/{content => src/content/docs}/components/list-group/styling.mdx (68%) create mode 100644 packages/docs/src/content/docs/components/modal/api.mdx create mode 100644 packages/docs/src/content/docs/components/modal/bootstrap.mdx rename packages/docs/{content => src/content/docs}/components/modal/examples/ModalFullscreenExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/modal/examples/ModalLiveDemoExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/modal/examples/ModalOptionalSizesExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/modal/examples/ModalScrollingLongContent2Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/modal/examples/ModalScrollingLongContentExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/modal/examples/ModalStaticBackdropExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/modal/examples/ModalToggleBetweenModalsExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/modal/examples/ModalTooltipsAndPopoversExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/modal/examples/ModalVerticallyCenteredExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/modal/examples/ModalVerticallyCenteredScrollableExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/modal/index.mdx (59%) rename packages/docs/{content => src/content/docs}/components/modal/styling.mdx (76%) create mode 100644 packages/docs/src/content/docs/components/navbar/api.mdx create mode 100644 packages/docs/src/content/docs/components/navbar/bootstrap.mdx rename packages/docs/{content => src/content/docs}/components/navbar/examples/NavbarBrand2Example.tsx (80%) rename packages/docs/{content => src/content/docs}/components/navbar/examples/NavbarBrand3Example.tsx (81%) rename packages/docs/{content => src/content/docs}/components/navbar/examples/NavbarBrandExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/navbar/examples/NavbarColorSchemesExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/navbar/examples/NavbarContainers2Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/navbar/examples/NavbarContainersExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/navbar/examples/NavbarExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/navbar/examples/NavbarForms2Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/navbar/examples/NavbarForms3Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/navbar/examples/NavbarForms4Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/navbar/examples/NavbarFormsExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/navbar/examples/NavbarNav2Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/navbar/examples/NavbarNav3Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/navbar/examples/NavbarNavExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/navbar/examples/NavbarPlacementExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/navbar/examples/NavbarPlacementFixedBottomExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/navbar/examples/NavbarPlacementFixedTopExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/navbar/examples/NavbarPlacementStickyTopExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/navbar/examples/NavbarResponsiveExternalContentExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/navbar/examples/NavbarResponsiveOffcanvas2Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/navbar/examples/NavbarResponsiveOffcanvasExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/navbar/examples/NavbarResponsiveToggler2Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/navbar/examples/NavbarResponsiveToggler3Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/navbar/examples/NavbarResponsiveTogglerExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/navbar/examples/NavbarText.tsx (100%) create mode 100644 packages/docs/src/content/docs/components/navbar/index.mdx rename packages/docs/{content => src/content/docs}/components/navbar/styling.mdx (84%) create mode 100644 packages/docs/src/content/docs/components/navs-tabs/api.mdx create mode 100644 packages/docs/src/content/docs/components/navs-tabs/bootstrap.mdx rename packages/docs/{content => src/content/docs}/components/navs-tabs/examples/Nav2Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/navs-tabs/examples/NavEnclosedExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/navs-tabs/examples/NavEnclosedPillsExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/navs-tabs/examples/NavExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/navs-tabs/examples/NavFillAndJustify2Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/navs-tabs/examples/NavFillAndJustifyExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/navs-tabs/examples/NavHorizontalAlignment2Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/navs-tabs/examples/NavHorizontalAlignmentExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/navs-tabs/examples/NavPillsExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/navs-tabs/examples/NavPillsWithDropdownExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/navs-tabs/examples/NavTabPanes2Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/navs-tabs/examples/NavTabPanesExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/navs-tabs/examples/NavTabsExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/navs-tabs/examples/NavTabsWithDropdownExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/navs-tabs/examples/NavUnderlineBorderExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/navs-tabs/examples/NavUnderlineExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/navs-tabs/examples/NavVerticalExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/navs-tabs/examples/NavWorkingWithFlexUtilitiesExample.tsx (100%) create mode 100644 packages/docs/src/content/docs/components/navs-tabs/index.mdx rename packages/docs/{content => src/content/docs}/components/navs-tabs/styling.mdx (80%) create mode 100644 packages/docs/src/content/docs/components/offcanvas/api.mdx create mode 100644 packages/docs/src/content/docs/components/offcanvas/bootstrap.mdx rename packages/docs/{content => src/content/docs}/components/offcanvas/examples/OffcanvasBodyScrollingAndBackdropExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/offcanvas/examples/OffcanvasBodyScrollingExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/offcanvas/examples/OffcanvasDarkExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/offcanvas/examples/OffcanvasExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/offcanvas/examples/OffcanvasLiveExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/offcanvas/examples/OffcanvasPlacementBottomExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/offcanvas/examples/OffcanvasPlacementRightExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/offcanvas/examples/OffcanvasPlacementTopExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/offcanvas/examples/OffcanvasResponsiveExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/offcanvas/examples/OffcanvasStaticBackdropExample.tsx (100%) create mode 100644 packages/docs/src/content/docs/components/offcanvas/index.mdx rename packages/docs/{content => src/content/docs}/components/offcanvas/styling.mdx (68%) create mode 100644 packages/docs/src/content/docs/components/pagination/api.mdx create mode 100644 packages/docs/src/content/docs/components/pagination/bootstrap.mdx rename packages/docs/{content => src/content/docs}/components/pagination/examples/PaginationAlignment2Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/pagination/examples/PaginationAlignmentExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/pagination/examples/PaginationDisabledAndActiveExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/pagination/examples/PaginationExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/pagination/examples/PaginationSizingLargeExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/pagination/examples/PaginationSizingSmallExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/pagination/examples/PaginationWorkingWithIconsExample.tsx (100%) create mode 100644 packages/docs/src/content/docs/components/pagination/index.mdx rename packages/docs/{content => src/content/docs}/components/pagination/styling.mdx (68%) create mode 100644 packages/docs/src/content/docs/components/placeholder/api.mdx create mode 100644 packages/docs/src/content/docs/components/placeholder/bootstrap.mdx rename packages/docs/{content => src/content/docs}/components/placeholder/examples/Placeholder2Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/placeholder/examples/PlaceholderAnimationExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/placeholder/examples/PlaceholderColorExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/placeholder/examples/PlaceholderExample.tsx (93%) rename packages/docs/{content => src/content/docs}/components/placeholder/examples/PlaceholderSizingExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/placeholder/examples/PlaceholderWidthExample.tsx (100%) create mode 100644 packages/docs/src/content/docs/components/placeholder/index.mdx create mode 100644 packages/docs/src/content/docs/components/placeholder/styling.mdx create mode 100644 packages/docs/src/content/docs/components/popover/api.mdx create mode 100644 packages/docs/src/content/docs/components/popover/bootstrap.mdx rename packages/docs/{content => src/content/docs}/components/popover/examples/PopoverCustomPopoversExample.jsx (100%) rename packages/docs/{content => src/content/docs}/components/popover/examples/PopoverCustomPopoversExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/popover/examples/PopoverDisabledElementsExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/popover/examples/PopoverDismissExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/popover/examples/PopoverFourDirectionsExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/popover/examples/PopoverLiveExample.tsx (100%) create mode 100644 packages/docs/src/content/docs/components/popover/index.mdx rename packages/docs/{content => src/content/docs}/components/popover/styling.mdx (67%) create mode 100644 packages/docs/src/content/docs/components/progress/api.mdx create mode 100644 packages/docs/src/content/docs/components/progress/bootstrap.mdx rename packages/docs/{content => src/content/docs}/components/progress/examples/ProgressAnimatedStripedExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/progress/examples/ProgressBackgrounds2Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/progress/examples/ProgressBackgroundsExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/progress/examples/ProgressExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/progress/examples/ProgressHeight2Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/progress/examples/ProgressHeightExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/progress/examples/ProgressLabels2Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/progress/examples/ProgressLabelsExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/progress/examples/ProgressMultipleBarsExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/progress/examples/ProgressStripedExample.tsx (100%) create mode 100644 packages/docs/src/content/docs/components/progress/index.mdx rename packages/docs/{content => src/content/docs}/components/progress/styling.mdx (67%) create mode 100644 packages/docs/src/content/docs/components/search-button/api.mdx create mode 100644 packages/docs/src/content/docs/components/search-button/bootstrap.mdx rename packages/docs/{content => src/content/docs}/components/search-button/examples/SearchButtonCustomShortcutExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/search-button/examples/SearchButtonExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/search-button/examples/SearchButtonOffcanvasExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/search-button/index.mdx (74%) rename packages/docs/{content => src/content/docs}/components/search-button/styling.mdx (73%) create mode 100644 packages/docs/src/content/docs/components/sidebar/api.mdx create mode 100644 packages/docs/src/content/docs/components/sidebar/bootstrap.mdx rename packages/docs/{content => src/content/docs}/components/sidebar/examples/SidebarCompactExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/sidebar/examples/SidebarControlledGroupExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/sidebar/examples/SidebarCustomIndicatorExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/sidebar/examples/SidebarDarkExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/sidebar/examples/SidebarExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/sidebar/examples/SidebarGroupIndicatorExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/sidebar/examples/SidebarNarrowExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/sidebar/examples/SidebarTreeExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/sidebar/examples/SidebarUnfoldableExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/sidebar/index.mdx (61%) rename packages/docs/{content => src/content/docs}/components/sidebar/styling.mdx (80%) create mode 100644 packages/docs/src/content/docs/components/spinner/api.mdx create mode 100644 packages/docs/src/content/docs/components/spinner/bootstrap.mdx rename packages/docs/{content => src/content/docs}/components/spinner/examples/SpinnerBorderColorsExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/spinner/examples/SpinnerBorderExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/spinner/examples/SpinnerBorderMarginExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/spinner/examples/SpinnerBorderPlacementFlex2Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/spinner/examples/SpinnerBorderPlacementFlexExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/spinner/examples/SpinnerBorderPlacementFloatsExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/spinner/examples/SpinnerBorderPlacementTextAlignExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/spinner/examples/SpinnerButtons2Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/spinner/examples/SpinnerButtonsExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/spinner/examples/SpinnerGrowColorsExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/spinner/examples/SpinnerGrowExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/spinner/examples/SpinnerSizeCustomExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/spinner/examples/SpinnerSizeSmallExample.tsx (100%) create mode 100644 packages/docs/src/content/docs/components/spinner/index.mdx rename packages/docs/{content => src/content/docs}/components/spinner/styling.mdx (82%) create mode 100644 packages/docs/src/content/docs/components/table/api.mdx create mode 100644 packages/docs/src/content/docs/components/table/bootstrap.mdx create mode 100644 packages/docs/src/content/docs/components/table/examples/ActiveTableDarkExample.tsx create mode 100644 packages/docs/src/content/docs/components/table/examples/ActiveTableExample.tsx create mode 100644 packages/docs/src/content/docs/components/table/examples/BootstrapDemo0.tsx create mode 100644 packages/docs/src/content/docs/components/table/examples/BootstrapDemo1.tsx create mode 100644 packages/docs/src/content/docs/components/table/examples/BootstrapDemo2.tsx create mode 100644 packages/docs/src/content/docs/components/table/examples/BootstrapDemo3.tsx create mode 100644 packages/docs/src/content/docs/components/table/examples/BootstrapDemo4.tsx create mode 100644 packages/docs/src/content/docs/components/table/examples/BootstrapDemo5.tsx create mode 100644 packages/docs/src/content/docs/components/table/examples/BootstrapDemo6.tsx create mode 100644 packages/docs/src/content/docs/components/table/examples/TableDemo0.tsx create mode 100644 packages/docs/src/content/docs/components/table/examples/TableDemo1.tsx create mode 100644 packages/docs/src/content/docs/components/table/examples/TableDemo2.tsx create mode 100644 packages/docs/src/content/docs/components/table/examples/TableDemo3.tsx create mode 100644 packages/docs/src/content/docs/components/table/examples/TableDemo4.tsx create mode 100644 packages/docs/src/content/docs/components/table/examples/TableDemo5.tsx create mode 100644 packages/docs/src/content/docs/components/table/examples/TableDemo6.tsx rename packages/docs/{content => src/content/docs}/components/table/examples/TableExample.tsx (75%) create mode 100644 packages/docs/src/content/docs/components/table/examples/TableFoodExample.tsx rename packages/docs/{content => src/content/docs}/components/table/examples/TableVariantsExample.tsx (100%) create mode 100644 packages/docs/src/content/docs/components/table/examples/VariantExample.tsx create mode 100644 packages/docs/src/content/docs/components/table/examples/VerticalAlignmentExample.tsx create mode 100644 packages/docs/src/content/docs/components/table/index.mdx create mode 100644 packages/docs/src/content/docs/components/table/styling.mdx create mode 100644 packages/docs/src/content/docs/components/tabs/api.mdx create mode 100644 packages/docs/src/content/docs/components/tabs/bootstrap.mdx rename packages/docs/{content => src/content/docs}/components/tabs/examples/TabsControlledExample.jsx (100%) rename packages/docs/{content => src/content/docs}/components/tabs/examples/TabsControlledExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/tabs/examples/TabsEnclosedExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/tabs/examples/TabsEnclosedPillsExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/tabs/examples/TabsExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/tabs/examples/TabsPillsExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/tabs/examples/TabsUnderlineBorderExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/tabs/examples/TabsUnderlineExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/tabs/examples/TabsUnstyledExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/tabs/examples/TabsUnstyledFillAndJustify2Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/tabs/examples/TabsUnstyledFillAndJustifyExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/tabs/index.mdx (62%) rename packages/docs/{content => src/content/docs}/components/tabs/styling.mdx (82%) create mode 100644 packages/docs/src/content/docs/components/toast/api.mdx create mode 100644 packages/docs/src/content/docs/components/toast/bootstrap.mdx rename packages/docs/{content => src/content/docs}/components/toast/examples/ToastColorSchemesExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/toast/examples/ToastCustomContent2Example.tsx (100%) rename packages/docs/{content => src/content/docs}/components/toast/examples/ToastCustomContentExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/toast/examples/ToastExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/toast/examples/ToastLiveExample.jsx (100%) rename packages/docs/{content => src/content/docs}/components/toast/examples/ToastLiveExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/toast/examples/ToastStackingExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/toast/examples/ToastTranslucentExample.tsx (100%) create mode 100644 packages/docs/src/content/docs/components/toast/index.mdx rename packages/docs/{content => src/content/docs}/components/toast/styling.mdx (67%) create mode 100644 packages/docs/src/content/docs/components/tooltip/api.mdx create mode 100644 packages/docs/src/content/docs/components/tooltip/bootstrap.mdx rename packages/docs/{content => src/content/docs}/components/tooltip/examples/TooltipCustomExample.jsx (100%) rename packages/docs/{content => src/content/docs}/components/tooltip/examples/TooltipCustomExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/tooltip/examples/TooltipDirectionsExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/tooltip/examples/TooltipDisabledElementsExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/tooltip/examples/TooltipOnLinksExample.tsx (100%) create mode 100644 packages/docs/src/content/docs/components/tooltip/index.mdx rename packages/docs/{content => src/content/docs}/components/tooltip/styling.mdx (67%) create mode 100644 packages/docs/src/content/docs/components/widgets/api.mdx rename packages/docs/{content => src/content/docs}/components/widgets/examples/WidgetStatsAExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/widgets/examples/WidgetStatsBExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/widgets/examples/WidgetStatsCExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/widgets/examples/WidgetStatsDExample.jsx (100%) rename packages/docs/{content => src/content/docs}/components/widgets/examples/WidgetStatsDExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/widgets/examples/WidgetStatsEExample.tsx (100%) rename packages/docs/{content => src/content/docs}/components/widgets/examples/WidgetStatsFExample.tsx (100%) create mode 100644 packages/docs/src/content/docs/components/widgets/index.mdx rename packages/docs/{content => src/content/docs}/customize/css-variables.mdx (96%) rename packages/docs/{content => src/content/docs}/customize/options.mdx (94%) rename packages/docs/{content => src/content/docs}/customize/sass.mdx (98%) create mode 100644 packages/docs/src/content/docs/forms/checkbox/api.mdx create mode 100644 packages/docs/src/content/docs/forms/checkbox/bootstrap.mdx rename packages/docs/{content => src/content/docs}/forms/checkbox/examples/CheckboxDisabledExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/checkbox/examples/CheckboxExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/checkbox/examples/CheckboxIndeterminateExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/checkbox/examples/CheckboxInlineExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/checkbox/examples/CheckboxReverseExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/checkbox/examples/CheckboxStackedExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/checkbox/examples/CheckboxToggleButtonsExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/checkbox/examples/CheckboxToggleButtonsOutlinedStylesExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/checkbox/examples/CheckboxWithoutLabelsExample.tsx (100%) create mode 100644 packages/docs/src/content/docs/forms/checkbox/index.mdx create mode 100644 packages/docs/src/content/docs/forms/checkbox/styling.mdx rename packages/docs/{content => src/content/docs}/forms/checks-radios.mdx (93%) rename packages/docs/{content => src/content/docs}/forms/chip-input/accessibility.mdx (93%) create mode 100644 packages/docs/src/content/docs/forms/chip-input/api.mdx create mode 100644 packages/docs/src/content/docs/forms/chip-input/bootstrap.mdx rename packages/docs/{content => src/content/docs}/forms/chip-input/examples/ChipInputClassNameExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/chip-input/examples/ChipInputControlledExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/chip-input/examples/ChipInputDisabledExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/chip-input/examples/ChipInputEmptyStateExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/chip-input/examples/ChipInputExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/chip-input/examples/ChipInputMaxExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/chip-input/examples/ChipInputReadonlyExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/chip-input/examples/ChipInputSelectableExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/chip-input/examples/ChipInputSeparatorExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/chip-input/examples/ChipInputSizesExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/chip-input/examples/ChipInputVariantsExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/chip-input/examples/ChipInputWithLabelExample.tsx (100%) create mode 100644 packages/docs/src/content/docs/forms/chip-input/index.mdx rename packages/docs/{content => src/content/docs}/forms/chip-input/styling.mdx (72%) create mode 100644 packages/docs/src/content/docs/forms/examples/OverviewDemo0.tsx create mode 100644 packages/docs/src/content/docs/forms/examples/OverviewDemo1.tsx create mode 100644 packages/docs/src/content/docs/forms/examples/OverviewDemo2.tsx create mode 100644 packages/docs/src/content/docs/forms/examples/OverviewDemo3.tsx create mode 100644 packages/docs/src/content/docs/forms/floating-labels/api.mdx create mode 100644 packages/docs/src/content/docs/forms/floating-labels/bootstrap.mdx rename packages/docs/{content => src/content/docs}/forms/floating-labels/examples/FloatingLabels2Example.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/floating-labels/examples/FloatingLabelsExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/floating-labels/examples/FloatingLabelsLayoutExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/floating-labels/examples/FloatingLabelsSelectExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/floating-labels/examples/FloatingLabelsTextarea2Example.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/floating-labels/examples/FloatingLabelsTextareaExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/floating-labels/examples/FloatingLabelsValidationExample.tsx (100%) create mode 100644 packages/docs/src/content/docs/forms/floating-labels/index.mdx create mode 100644 packages/docs/src/content/docs/forms/floating-labels/styling.mdx rename packages/docs/{content => src/content/docs}/forms/form-control.mdx (89%) create mode 100644 packages/docs/src/content/docs/forms/input-group/api.mdx create mode 100644 packages/docs/src/content/docs/forms/input-group/bootstrap.mdx rename packages/docs/{content => src/content/docs}/forms/input-group/examples/InputGroupButtonAddonsExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/input-group/examples/InputGroupButtonsWithDropdownsExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/input-group/examples/InputGroupCheckboxesAndRadiosExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/input-group/examples/InputGroupCustomFileInputExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/input-group/examples/InputGroupCustomSelectExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/input-group/examples/InputGroupExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/input-group/examples/InputGroupMultipleAddonsExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/input-group/examples/InputGroupMultipleInputsExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/input-group/examples/InputGroupSegmentedButtonsExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/input-group/examples/InputGroupSizingExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/input-group/examples/InputGroupWrappingExample.tsx (100%) create mode 100644 packages/docs/src/content/docs/forms/input-group/index.mdx create mode 100644 packages/docs/src/content/docs/forms/input-group/styling.mdx rename packages/docs/{content => src/content/docs}/forms/input-mask/examples/InputMaskCreditCardExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/input-mask/examples/InputMaskExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/input-mask/examples/InputMaskPhoneExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/input-mask/index.mdx (57%) create mode 100644 packages/docs/src/content/docs/forms/input/api.mdx create mode 100644 packages/docs/src/content/docs/forms/input/bootstrap.mdx rename packages/docs/{content => src/content/docs}/forms/input/examples/FormInputColorExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/input/examples/FormInputCustomClassNamesExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/input/examples/FormInputDisabledExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/input/examples/FormInputExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/input/examples/FormInputFileExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/input/examples/FormInputReadonlyExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/input/examples/FormInputReadonlyPlainText2Example.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/input/examples/FormInputReadonlyPlainTextExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/input/examples/FormInputSizingExample.tsx (100%) create mode 100644 packages/docs/src/content/docs/forms/input/index.mdx rename packages/docs/{content => src/content/docs}/forms/input/styling.mdx (67%) create mode 100644 packages/docs/src/content/docs/forms/layout/bootstrap.mdx rename packages/docs/{content => src/content/docs}/forms/layout/examples/LayoutAutoSizing2Example.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/layout/examples/LayoutAutoSizingExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/layout/examples/LayoutColumnSizingExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/layout/examples/LayoutFormGridExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/layout/examples/LayoutGutters2Example.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/layout/examples/LayoutGuttersExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/layout/examples/LayoutHorizontalFormExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/layout/examples/LayoutHorizontalFormLabelSizingExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/layout/examples/LayoutInlineFormsExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/layout/index.mdx (50%) rename packages/docs/{content => src/content/docs}/forms/overview.mdx (62%) create mode 100644 packages/docs/src/content/docs/forms/radio/api.mdx create mode 100644 packages/docs/src/content/docs/forms/radio/bootstrap.mdx rename packages/docs/{content => src/content/docs}/forms/radio/examples/RadioDisabledExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/radio/examples/RadioExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/radio/examples/RadioInlineExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/radio/examples/RadioReverseExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/radio/examples/RadioStackedExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/radio/examples/RadioToggleButtonsExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/radio/examples/RadioToggleButtonsOutlinedStylesExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/radio/examples/RadioWithoutLabelsExample.tsx (100%) create mode 100644 packages/docs/src/content/docs/forms/radio/index.mdx create mode 100644 packages/docs/src/content/docs/forms/radio/styling.mdx create mode 100644 packages/docs/src/content/docs/forms/range/api.mdx create mode 100644 packages/docs/src/content/docs/forms/range/bootstrap.mdx rename packages/docs/{content => src/content/docs}/forms/range/examples/FormRangeDisabledExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/range/examples/FormRangeExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/range/examples/FormRangeMinAndMaxExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/range/examples/FormRangeStepsExample.tsx (100%) create mode 100644 packages/docs/src/content/docs/forms/range/index.mdx create mode 100644 packages/docs/src/content/docs/forms/range/styling.mdx create mode 100644 packages/docs/src/content/docs/forms/select/api.mdx create mode 100644 packages/docs/src/content/docs/forms/select/bootstrap.mdx rename packages/docs/{content => src/content/docs}/forms/select/examples/FormSelectDisabledExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/select/examples/FormSelectExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/select/examples/FormSelectSizing2Example.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/select/examples/FormSelectSizing3Example.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/select/examples/FormSelectSizingExample.tsx (100%) create mode 100644 packages/docs/src/content/docs/forms/select/index.mdx create mode 100644 packages/docs/src/content/docs/forms/select/styling.mdx create mode 100644 packages/docs/src/content/docs/forms/switch/api.mdx create mode 100644 packages/docs/src/content/docs/forms/switch/bootstrap.mdx rename packages/docs/{content => src/content/docs}/forms/switch/examples/FormSwitchExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/switch/examples/FormSwitchReverseExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/switch/examples/FormSwitchSizingExample.tsx (100%) create mode 100644 packages/docs/src/content/docs/forms/switch/index.mdx create mode 100644 packages/docs/src/content/docs/forms/switch/styling.mdx create mode 100644 packages/docs/src/content/docs/forms/textarea/api.mdx create mode 100644 packages/docs/src/content/docs/forms/textarea/bootstrap.mdx rename packages/docs/{content => src/content/docs}/forms/textarea/examples/FormTextareaDisabledExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/textarea/examples/FormTextareaExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/textarea/examples/FormTextareaReadonlyExample.tsx (100%) create mode 100644 packages/docs/src/content/docs/forms/textarea/index.mdx rename packages/docs/{content => src/content/docs}/forms/textarea/styling.mdx (61%) create mode 100644 packages/docs/src/content/docs/forms/validation/bootstrap.mdx rename packages/docs/{content => src/content/docs}/forms/validation/examples/ValidationBrowserDefaultsExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/validation/examples/ValidationCustomExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/validation/examples/ValidationExample.jsx (100%) rename packages/docs/{content => src/content/docs}/forms/validation/examples/ValidationExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/validation/examples/ValidationSupportedElementsExample.tsx (100%) rename packages/docs/{content => src/content/docs}/forms/validation/examples/ValidationTooltipsExample.jsx (100%) rename packages/docs/{content => src/content/docs}/forms/validation/examples/ValidationTooltipsExample.tsx (100%) create mode 100644 packages/docs/src/content/docs/forms/validation/index.mdx rename packages/docs/{content => src/content/docs}/forms/validation/styling.mdx (71%) rename packages/docs/{content => src/content/docs}/getting-started/accessibility.mdx (96%) rename packages/docs/{content => src/content/docs}/getting-started/introduction.mdx (82%) rename packages/docs/{content => src/content/docs}/layout/breakpoints.mdx (96%) rename packages/docs/{content => src/content/docs}/layout/columns.mdx (96%) rename packages/docs/{content => src/content/docs}/layout/containers.mdx (92%) rename packages/docs/{content => src/content/docs}/layout/grid.mdx (95%) rename packages/docs/{content => src/content/docs}/layout/gutters.mdx (93%) rename packages/docs/{content => src/content/docs}/migration/v4.mdx (98%) rename packages/docs/{content => src/content/docs}/migration/v5.mdx (97%) create mode 100644 packages/docs/src/content/docs/templates/admin-dashboard.mdx rename packages/docs/{content => src/content/docs}/templates/contents.mdx (78%) rename packages/docs/{content => src/content/docs}/templates/customize.mdx (91%) rename packages/docs/{content => src/content/docs}/templates/download.mdx (73%) rename packages/docs/{content/templates/admin-dashboard.mdx => src/content/docs/templates/examples/AdminDashboardDemo0.tsx} (88%) rename packages/docs/{content => src/content/docs}/templates/installation.mdx (91%) create mode 100644 packages/docs/src/data/config.yml create mode 100644 packages/docs/src/data/logo.svg create mode 100644 packages/docs/src/data/sidebar.yml delete mode 100644 packages/docs/src/hooks/useStickyObserver.ts delete mode 100644 packages/docs/src/images/gatsby-astronaut.png delete mode 100644 packages/docs/src/images/gatsby-icon.png delete mode 100644 packages/docs/src/index.ts delete mode 100644 packages/docs/src/nav.tsx delete mode 100644 packages/docs/src/pages/404.tsx create mode 100644 packages/docs/src/sandbox.ts delete mode 100644 packages/docs/src/styles/_ads.scss delete mode 100644 packages/docs/src/styles/_anchor.scss delete mode 100644 packages/docs/src/styles/_callouts.scss delete mode 100644 packages/docs/src/styles/_component-examples.scss delete mode 100644 packages/docs/src/styles/_component-sub-nav.scss delete mode 100644 packages/docs/src/styles/_footer.scss delete mode 100644 packages/docs/src/styles/_header.scss delete mode 100644 packages/docs/src/styles/_layout.scss delete mode 100644 packages/docs/src/styles/_prism.scss delete mode 100644 packages/docs/src/styles/_root.scss delete mode 100644 packages/docs/src/styles/_scrolling.scss delete mode 100644 packages/docs/src/styles/_sidebar.scss delete mode 100644 packages/docs/src/styles/_table-api.scss delete mode 100644 packages/docs/src/styles/_toc.scss delete mode 100644 packages/docs/src/styles/_variables.scss delete mode 100644 packages/docs/src/styles/bootstrap-examples.scss delete mode 100644 packages/docs/src/styles/search.scss delete mode 100644 packages/docs/src/styles/styles.scss delete mode 100644 packages/docs/src/templates/DefaultLayout.tsx delete mode 100644 packages/docs/src/templates/DocsLayout.tsx delete mode 100644 packages/docs/src/templates/MdxLayout.tsx delete mode 100644 packages/docs/src/utils/codesandbox.ts delete mode 100644 packages/docs/src/utils/prism.ts delete mode 100644 packages/docs/src/utils/prismGlobal.ts delete mode 100644 packages/docs/src/utils/projectUtils.ts delete mode 100644 packages/docs/src/utils/stackblitz.ts delete mode 100755 packages/docs/static/images/angular.jpg delete mode 100644 packages/docs/static/images/avatars/1.jpg delete mode 100644 packages/docs/static/images/avatars/2.jpg delete mode 100644 packages/docs/static/images/avatars/3.jpg delete mode 100644 packages/docs/static/images/avatars/4.jpg delete mode 100644 packages/docs/static/images/avatars/5.jpg delete mode 100644 packages/docs/static/images/avatars/6.jpg delete mode 100644 packages/docs/static/images/avatars/7.jpg delete mode 100644 packages/docs/static/images/avatars/8.jpg delete mode 100644 packages/docs/static/images/avatars/9.jpg delete mode 100644 packages/docs/static/images/brand/coreui-signet.svg delete mode 100755 packages/docs/static/images/react.jpg delete mode 100644 packages/docs/static/images/react400.jpg delete mode 100755 packages/docs/static/images/vue.jpg delete mode 100644 packages/docs/static/index.html create mode 100644 packages/docs/tsconfig.json diff --git a/.gitignore b/.gitignore index 70f24f47..462ee19a 100644 --- a/.gitignore +++ b/.gitignore @@ -30,4 +30,5 @@ Thumbs.db *.swp *.vi *.zip -*~ \ No newline at end of file +*~ +.gstack/ diff --git a/packages/docs/.gitignore b/packages/docs/.gitignore new file mode 100644 index 00000000..ddce69b6 --- /dev/null +++ b/packages/docs/.gitignore @@ -0,0 +1,3 @@ +node_modules/ +dist/ +.astro/ diff --git a/packages/docs/api.config.mjs b/packages/docs/api.config.mjs new file mode 100644 index 00000000..b4e03560 --- /dev/null +++ b/packages/docs/api.config.mjs @@ -0,0 +1,43 @@ +// Components to document. The @coreui/astro-docs-api-generator CLI (`yarn api`) runs +// the React extractor (react-docgen-typescript) and writes one .api.json per +// component into outDir — the shared ApiData shape the engine's renders. The +// list is scanned from source (every `C*.tsx` that isn't a test); extra entries are +// harmless (a page only imports the JSON it references). +import { readdirSync } from 'node:fs' +import { join, dirname, basename, relative } from 'node:path' +import { fileURLToPath } from 'node:url' + +const here = dirname(fileURLToPath(import.meta.url)) +const ROOTS = [ + '../coreui-react/src/components', + '../coreui-react-chartjs/src', + '../coreui-icons-react/src', +] + +const isComponent = (name) => /^C[A-Z].*\.tsx$/.test(name) && !/\.(d|spec|test)\.tsx$/.test(name) + +function scan(dir, out) { + let entries + try { + entries = readdirSync(dir, { withFileTypes: true }) + } catch { + return out + } + for (const e of entries) { + if (e.name === '__tests__' || e.name.startsWith('.')) continue + const p = join(dir, e.name) + if (e.isDirectory()) scan(p, out) + else if (isComponent(e.name)) out[basename(e.name, '.tsx')] = `./${relative(here, p)}` + } + return out +} + +const components = {} +for (const root of ROOTS) scan(join(here, root), components) + +export default { + framework: 'react', + outDir: 'src/api', + importPackage: '@coreui/react', + components, +} diff --git a/packages/docs/astro.config.mjs b/packages/docs/astro.config.mjs new file mode 100644 index 00000000..ceb01848 --- /dev/null +++ b/packages/docs/astro.config.mjs @@ -0,0 +1,42 @@ +import { defineConfig } from 'astro/config' +import react from '@astrojs/react' +import mdx from '@astrojs/mdx' +import { coreuiDocs } from '@coreui/astro-docs/integration' +import { fileURLToPath } from 'node:url' + +// Live-src: point @coreui/react and its icon/chart submodules at their source in this +// repo. The icon data set (@coreui/icons) and chart.js stay published deps. +const reactSrc = fileURLToPath(new URL('../coreui-react/src/index.ts', import.meta.url)) +const iconsReactSrc = fileURLToPath(new URL('../coreui-icons-react/src/index.ts', import.meta.url)) +const reactChartjsSrc = fileURLToPath(new URL('../coreui-react-chartjs/src/index.ts', import.meta.url)) +// @coreui/chartjs ships CJS `main` + a separate esm build; point imports at the esm +// so the named `customTooltips` export resolves under SSR. +const chartjsEsm = fileURLToPath(new URL('./node_modules/@coreui/chartjs/dist/js/coreui-chartjs.esm.js', import.meta.url)) +// Depth-independent imports for example + generated API data, so docs pages can +// move freely without rewriting relative paths. +const examples = fileURLToPath(new URL('./src/examples', import.meta.url)) +const api = fileURLToPath(new URL('./src/api', import.meta.url)) + +export default defineConfig({ + // Publish URL (site + base) is config-driven: coreuiDocs() reads `seo.url` from + // src/data/config.yml and sets Astro's `site` + `base` from it, so the versioned + // (…/react/docs/5.x) and current (…/react/docs) builds differ by one config value. + // coreuiDocs() detects the edition + wires styling; it returns an array (incl. + // global component auto-import), so spread it — and place it before mdx(). + integrations: [react(), ...coreuiDocs(), mdx()], + vite: { + resolve: { + // Array form: the icons-react `/src/index` subpath import must match before the + // bare `@coreui/icons-react` entry. + alias: [ + { find: '@coreui/icons-react/src/index', replacement: iconsReactSrc }, + { find: '@coreui/icons-react', replacement: iconsReactSrc }, + { find: '@coreui/react-chartjs', replacement: reactChartjsSrc }, + { find: '@coreui/chartjs', replacement: chartjsEsm }, + { find: '@coreui/react', replacement: reactSrc }, + { find: '@examples', replacement: examples }, + { find: '@api', replacement: api }, + ], + }, + }, +}) diff --git a/packages/docs/build/api.mjs b/packages/docs/build/api.mjs deleted file mode 100644 index 41eee41b..00000000 --- a/packages/docs/build/api.mjs +++ /dev/null @@ -1,382 +0,0 @@ -#!/usr/bin/env node - -'use strict' - -import { globby } from 'globby' -import { writeFile, mkdir } from 'node:fs/promises' -import path from 'node:path' -import { fileURLToPath } from 'node:url' -import { parse } from 'react-docgen-typescript' -import showdown from 'showdown' - -/** - * Derive __dirname in ESM - */ -const __filename = fileURLToPath(import.meta.url) -const __dirname = path.dirname(__filename) -const converter = new showdown.Converter({ simpleLineBreaks: true }) - -/** - * Glob patterns to locate .tsx files for documentation. - */ -const GLOB_PATTERNS = [ - '**/src/**/*.tsx', - '../node_modules/@coreui/icons-react/src/**/*.tsx', - '../node_modules/@coreui/react-chartjs/src/**/*.tsx', -] - -/** - * Options for globby to control file matching behavior. - */ -const GLOBBY_OPTIONS = { - absolute: true, - cwd: path.join(__dirname, '..', '..'), - gitignore: false, - ignore: ['**/docs/**', '**/__tests__/**'], -} - -/** - * Excluded files list (currently unused). - */ -const EXCLUDED_FILES = [] // Currently unused, but can be utilized if needed - -/** - * Options for react-docgen-typescript parser. - */ -const DOCGEN_OPTIONS = { - shouldIncludePropTagMap: true, -} - -/** - * List of pro components that require special handling. - */ -const PRO_COMPONENTS = [ - 'CCalendar', - 'CDatePicker', - 'CDateRangePicker', - 'CFormMask', - 'CLoadingButton', - 'CMultiSelect', - 'CRating', - 'CRangeSlider', - 'CRating', - 'CSmartPagination', - 'CSmartTable', - 'CTimePicker', - 'CVirtualScroller', -] - -/** - * Text replacements for certain components. - */ -const TEXT_REPLACEMENTS = { - CDatePicker: { - description: [{ 'React Calendar': 'React Date Picker' }], - example: [{ CCalendar: 'CDatePicker' }], - }, - CDateRangePicker: { - description: [{ 'React Calendar': 'React Date Range Picker' }], - example: [{ CCalendar: 'CDateRangePicker' }], - }, - CFormInput: { - example: [{ CFormControlValidation: 'CFormInput' }, { CFormControlWrapper: 'CFormInput' }], - }, - CFormTextarea: { - example: [ - { CFormControlValidation: 'CFormTextarea' }, - { CFormControlWrapper: 'CFormTextarea' }, - ], - }, -} - -/** - * Escapes special characters in text to prevent Markdown rendering issues. - * - * @param {string} text - The text to escape. - * @returns {string} - The escaped text. - */ -const escInsideCode = (s) => - s - .replaceAll(/\\/g, '\\\\') - .replaceAll(/`/g, '\\`') - .replaceAll(/\$\{/g, '\\${') - .replaceAll(/[{}]/g, (m) => '\\' + m) - -const escapeMarkdown = (text) => { - if (typeof text !== 'string') return text - - let out = text - - // 1) przypadek template literal: `... `...`` - out = out.replace(/`([\s\S]*?)``/g, (_, raw) => { - const safe = escInsideCode(raw) - return `{\`${safe}\`}` - }) - - // 2) przypadek listowych wartości: `...` przed przecinkiem albo końcem - out = out.replace(/`([^`]+?)`(?=\s*,|\s*$)/g, '{`$1`}') - - return out -} - -/** - * Generates the relative filename based on the file path. - * - * @param {string} file - The absolute file path. - * @returns {string} - The relative filename. - */ -const getRelativeFilename = (file) => { - let relativePath = file.includes('node_modules') - ? file.split('node_modules/@coreui/')[1] - : path.relative(GLOBBY_OPTIONS.cwd, file).replace('coreui-', '') - - // Remove '-pro' from the filename if not a pro component - const isPro = PRO_COMPONENTS.some((component) => file.includes(component)) - if (!isPro) { - relativePath = relativePath.replace('-pro', '') - } - - return relativePath -} - -/** - * Splits the input string by the '|' character, but only when the '|' is outside of any curly braces {} and parentheses (). - * - * @param {string} input - The string to be split. - * @returns {string[]} An array of split parts, trimmed of whitespace. - * @throws {Error} Throws an error if there are unmatched braces or parentheses in the input. - */ -const splitOutsideBracesAndParentheses = (input) => { - if (input.endsWith('...')) { - return [input] - } - - const parts = [] - let currentPart = '' - let braceDepth = 0 - let parenthesisDepth = 0 - - for (const char of input) { - switch (char) { - case '{': { - braceDepth++ - break - } - case '}': { - braceDepth-- - if (braceDepth < 0) { - throw new Error('Unmatched closing curly brace detected.') - } - break - } - case '(': { - parenthesisDepth++ - break - } - case ')': { - parenthesisDepth-- - if (parenthesisDepth < 0) { - throw new Error('Unmatched closing parenthesis detected.') - } - break - } - case '|': { - // Split only if not inside any braces or parentheses - if (braceDepth === 0 && parenthesisDepth === 0 && currentPart.trim()) { - parts.push(currentPart.trim()) - currentPart = '' - continue - } - break - } - default: { - break - } - } - currentPart += char - } - - if (braceDepth !== 0) { - throw new Error('Unmatched opening curly brace detected.') - } - if (parenthesisDepth !== 0) { - throw new Error('Unmatched opening parenthesis detected.') - } - - if (currentPart.trim()) { - parts.push(currentPart.trim()) - } - - return parts -} - -/** - * Replaces specified text within component documentation. - * - * @param {string} componenName - The name of the component. - * @param {string} keyName - The key of the text replacement (e.g., 'description', 'example'). - * @param {string} text - The text to be replaced. - * @returns {string} The replaced text. - */ -const replaceText = (componenName, keyName, text) => { - const keyNames = Object.keys(TEXT_REPLACEMENTS) - - if (keyNames.includes(componenName) && TEXT_REPLACEMENTS[componenName][keyName]) { - const replacements = TEXT_REPLACEMENTS[componenName][keyName] - for (const replacement of replacements) { - for (const [key, value] of Object.entries(replacement)) { - if (text && key && value) { - return text.replaceAll(key, value) - } - } - } - } else { - return text - } -} - -/** - * Creates an MDX file with the component's API documentation. - * - * @param {string} file - The absolute path to the component file. - * @param {object} component - The component info extracted by react-docgen-typescript. - */ -const createMdx = async (file, component) => { - if (!component) return - - const filename = path.basename(file, '.tsx') - const relativeFilename = getRelativeFilename(file) - - let content = `\n\`\`\`jsx\n` - const importPathParts = relativeFilename.split('/') - if (importPathParts.length > 1) { - content += `import { ${component.displayName} } from '@coreui/${importPathParts[0]}'\n` - } - content += `// or\n` - content += `import ${component.displayName} from '@coreui/${relativeFilename.replace('.tsx', '')}'\n` - content += `\`\`\`\n\n` - - const filteredProps = Object.entries(component.props) - .filter(([_, value]) => { - if (!value.parent?.fileName) return true - return ( - !value.parent.fileName.includes('@types/react/index.d.ts') && - !value.parent.fileName.includes('@types/react/ts5.0/index.d.ts') - ) - }) - .sort(([a], [b]) => a.localeCompare(b)) - - for (const [index, [propName, propInfo]] of filteredProps.entries()) { - if (index === 0) { - content += `
\n` - content += ` \n` - content += ` \n` - content += ` \n` - content += ` \n` - content += ` \n` - content += ` \n` - content += ` \n` - content += ` \n` - content += ` \n` - } - - // Skip props marked to be ignored - if (propInfo.tags?.ignore === '') { - continue - } - - const displayName = propInfo.name || '' - const since = propInfo.tags?.since - ? `${propInfo.tags.since}+` - : '' - const deprecated = propInfo.tags?.deprecated - ? `Deprecated ${propInfo.tags.deprecated}` - : '' - const description = propInfo.description - ? replaceText(component.displayName, 'description', propInfo.description).replace(/\n(?![\n-])/g, ' ').replace(/\n\n/g, '\n') - : '-' - const type = propInfo.type - ? propInfo.type.name.includes('ReactElement') - ? 'ReactElement' - : propInfo.type.name - : '' - const defaultValue = propInfo.defaultValue ? `\`${propInfo.defaultValue.value}\`` : '-' - const example = propInfo.tags?.example - ? replaceText(component.displayName, 'example', propInfo.tags.example) - : false - - // Format types as inline code - const types = splitOutsideBracesAndParentheses(type) - .map((_type) => `\`${_type.trim().replaceAll('"', "'")}\``) - .join(', ') - - const id = `${component.displayName.toLowerCase()}-${propName.replaceAll(/([a-z])([A-Z])/g, '$1-$2').toLowerCase()}` - const anchor = `#` - - content += ` \n` - content += ` \n` - content += ` \n` - content += ` \n` - content += ` \n` - content += ` \n` - content += ` \n` - content += ` \n` - } - - content += ` \n` - content += `
PropertyDefaultType
${displayName}${anchor}${since}${deprecated}${escapeMarkdown(defaultValue)}${escapeMarkdown(types)}
\n` - content += ` ${converter - .makeHtml(description) - .replaceAll(/(.*?)<\/code>/g, '{`$1`}') - .replaceAll(/{`<(.*?)>`}<\/code>/g, '{`<$1>`}')}\n` - - if (example) { - content += ` \n` - } - - content += `
\n` - content += `
\n` - - const outputDir = path.join('content', 'api') - const outputPath = path.join(outputDir, `${filename}.api.mdx`) - - try { - await mkdir(outputDir, { recursive: true }) - await writeFile(outputPath, content, { encoding: 'utf8' }) - console.log(`File created: ${filename}.api.mdx`) - } catch (error) { - console.error(`Failed to write file ${outputPath}:`, error) - } -} - -/** - * Main execution function. - */ -const main = async () => { - try { - const files = await globby(GLOB_PATTERNS, GLOBBY_OPTIONS) - - for (const file of files) { - console.log(`Processing file: ${file}`) - let components - try { - components = parse(file, DOCGEN_OPTIONS) - } catch (parseError) { - console.error(`Failed to parse ${file}:`, parseError) - continue // Skip to the next file - } - - if (components && components.length > 0) { - for (const component of components) { - await createMdx(file, component) // Sequentially create MDX files - } - } - } - } catch (error) { - console.error('An error occurred:', error) - process.exit(1) - } -} - -// Execute the main function -main() diff --git a/packages/docs/content/components/accordion/api.mdx b/packages/docs/content/components/accordion/api.mdx deleted file mode 100644 index e2257eb1..00000000 --- a/packages/docs/content/components/accordion/api.mdx +++ /dev/null @@ -1,27 +0,0 @@ ---- -title: React Accordion Component API -name: Accordion API -description: Explore the API reference for the React Accordion component and discover how to effectively utilize its props for customization. -route: /components/accordion/ ---- - -import CAccordionAPI from '../../api/CAccordion.api.mdx' -import CAccordionBodyAPI from '../../api/CAccordionBody.api.mdx' -import CAccordionHeaderAPI from '../../api/CAccordionHeader.api.mdx' -import CAccordionItemAPI from '../../api/CAccordionItem.api.mdx' - -## CAccordion - - - -## CAccordionBody - - - -## CAccordionHeader - - - -## CAccordionItem - - diff --git a/packages/docs/content/components/accordion/bootstrap.mdx b/packages/docs/content/components/accordion/bootstrap.mdx deleted file mode 100644 index 59c789e9..00000000 --- a/packages/docs/content/components/accordion/bootstrap.mdx +++ /dev/null @@ -1,34 +0,0 @@ ---- -title: React Bootstrap Accordion Component -name: Accordion with Bootstrap Styling -description: Learn how to create vertically collapsing Bootstrap-style accordions using CoreUI’s React components. -route: /components/accordion/ -bootstrap_component: true ---- - -## How to use React Bootstrap Accordion component - -Use CoreUI's React components styled with Bootstrap to build interactive and collapsible accordion sections. - - - -### Flush style - -Add the `flush` prop to remove default borders, background colors, and border radius — making the accordion items align flush with their container, following Bootstrap’s visual style. - - - -### Always open behavior - -Use the `alwaysOpen` property to keep multiple accordion items expanded at the same time, mimicking Bootstrap’s multiple-item open functionality. - - - -## API reference - -Refer to the API documentation for detailed descriptions of all the available props and components used to create Bootstrap-styled accordions in React. - -- [<CAccordion />](../api/#caccordion) -- [<CAccordionBody />](../api/#caccordionbody) -- [<CAccordionHeader />](../api/#caccordionheader) -- [<CAccordionItem />](../api/#caccordionitem) \ No newline at end of file diff --git a/packages/docs/content/components/accordion/index.mdx b/packages/docs/content/components/accordion/index.mdx deleted file mode 100644 index 6bacb217..00000000 --- a/packages/docs/content/components/accordion/index.mdx +++ /dev/null @@ -1,35 +0,0 @@ ---- -title: React Accordion Component -name: Accordion -description: Build vertically collapsing accordions in combination with our React Accordion component. -route: /components/accordion/ -other_frameworks: accordion ---- - -## How to use React Accordion component. - -Click the accordions below to expand/collapse the accordion content. - - - -### Flush - -Add `flush` to remove the default `background-color`, some borders, and some rounded corners to render accordions edge-to-edge with their parent container. - - - -### Always open - -Add `alwaysOpen` property to make react accordion items stay open when another item is opened. - - - -## API - -Check out the documentation below for a comprehensive guide to all the props you can use with the components mentioned here. - -- [<CAccordion />](./api/#caccordion) -- [<CAccordionBody />](./api/#caccordionbody) -- [<CAccordionHeader />](./api/#caccordionheader) -- [<CAccordionItem />](./api/#caccordionitem) - diff --git a/packages/docs/content/components/alert/api.mdx b/packages/docs/content/components/alert/api.mdx deleted file mode 100644 index 287df6f8..00000000 --- a/packages/docs/content/components/alert/api.mdx +++ /dev/null @@ -1,22 +0,0 @@ ---- -title: React Alert Component API -name: Alert API -description: Explore the API reference for the React Alert component and discover how to effectively utilize its props for customization. -route: /components/alert/ ---- - -import CAlertAPI from '../../api/CAlert.api.mdx' -import CAlertHeadingAPI from '../../api/CAlertHeading.api.mdx' -import CAlertLinkAPI from '../../api/CAlertLink.api.mdx' - -## CAlert - - - -## CAlertHeading - - - -## CAlertLink - - diff --git a/packages/docs/content/components/alert/bootstrap.mdx b/packages/docs/content/components/alert/bootstrap.mdx deleted file mode 100644 index 225a0735..00000000 --- a/packages/docs/content/components/alert/bootstrap.mdx +++ /dev/null @@ -1,70 +0,0 @@ ---- -title: React Bootstrap Alert Component -name: Alert with Bootstrap Styling -description: Learn how to use CoreUI’s React Alert component styled with Bootstrap for contextual feedback messages and dismissible UI alerts. -menu: Components -route: /components/alert/ -bootstrap_component: true ---- - -## How to use React Bootstrap Alert component - -CoreUI’s React Bootstrap Alerts provide contextual feedback messages for typical user interactions. Each alert supports Bootstrap-based colors and can include additional content and dismiss functionality. - - - - - -### Live example - -Click the button below to display an alert (initially hidden), then dismiss it using the built-in close button — styled the Bootstrap way. - - - -### Link color - -To include links inside your alert, use the `` component — it automatically adopts the contextual Bootstrap color of the parent alert. - - - -### Additional content - -React Bootstrap Alerts can include extra structured content such as headings, paragraphs, and horizontal rules for enhanced readability. - - - -### Icons - -Use CoreUI Icons and flexbox utilities to add icons to your alerts. Combine them with spacing utilities for precise layout control. - - - -Need more than one icon in your alert? CoreUI Icons can be stacked or arranged using flex utilities. - - - -### Solid style - -Add `variant="solid"` to give the alert a solid background color, in line with Bootstrap’s solid alert variants. - - - -### Dismissing - -Use the `dismissible` prop to allow users to close the alert. This will completely remove it from the DOM. - - - - - 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. - - -## API reference - -Review the API documentation for detailed information about the props available in the Bootstrap-styled React Alert component. - -- [<CAlert />](../api/#calert) -- [<CAlertHeading />](../api/#calertheading) -- [<CAlertLink />](../api/#calertlink) diff --git a/packages/docs/content/components/alert/index.mdx b/packages/docs/content/components/alert/index.mdx deleted file mode 100644 index d6e4064a..00000000 --- a/packages/docs/content/components/alert/index.mdx +++ /dev/null @@ -1,70 +0,0 @@ ---- -title: React Alert Component -name: Alert -description: React alert component gives contextual feedback information for common user operations. The alert component is delivered with a bunch of usable and adjustable alert messages. -menu: Components -route: /components/alert/ -other_frameworks: alert ---- - -## How to use React Alert Component. - -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). - - - - - -### Live example - -Click the button below to show an alert (hidden with inline styles to start), then dismiss (and destroy) it with the built-in close button. - - - -### Link color - -Use the `` component to immediately give matching colored links inside any react alert component. - - - -### Additional content - -React Alert can also incorporate supplementary components & elements like heading, paragraph, and divider. - - - -### Icons - -Similarly, you can use [flexbox utilities](https//coreui.io/docs/4.0/utilities/flex") and [CoreUI Icons](https://coreui.io/icons/) to create react alerts with icons. Depending on your icons and content, you may want to add more utilities or custom styles. - - - -Need more than one icon for your react alerts? Consider using [CoreUI Icons](https://coreui.io/icons/). - - - -### Solid - -Use `variant="solid"` to change contextual colors to solid. - - - -### Dismissing - -React Alert component can also be easily dismissed. Just add the `dismissible` prop. - - - - - 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. - - -## API - -Check out the documentation below for a comprehensive guide to all the props you can use with the components mentioned here. - -- [<CAlert />](./api/#calert) -- [<CAlertHeading />](./api/#calertheading) -- [<CAlertLink />](./api/#calertlink) diff --git a/packages/docs/content/components/avatar/api.mdx b/packages/docs/content/components/avatar/api.mdx deleted file mode 100644 index 43f01720..00000000 --- a/packages/docs/content/components/avatar/api.mdx +++ /dev/null @@ -1,12 +0,0 @@ ---- -title: React Avatar Component API -name: Avatar API -description: Explore the API reference for the React Avatar component and discover how to effectively utilize its props for customization. -route: /components/avatar/ ---- - -import CAvatarAPI from '../../api/CAvatar.api.mdx' - -## CAvatar - - diff --git a/packages/docs/content/components/avatar/bootstrap.mdx b/packages/docs/content/components/avatar/bootstrap.mdx deleted file mode 100644 index 4dfa9db8..00000000 --- a/packages/docs/content/components/avatar/bootstrap.mdx +++ /dev/null @@ -1,55 +0,0 @@ ---- -title: React Bootstrap Avatar Component -name: Avatar with Bootstrap Styling -description: Learn how to use CoreUI’s React Avatar component styled with Bootstrap to display profile images, icons, initials, and status indicators in a consistent and responsive design. -route: /components/avatar/ -bootstrap_component: true ---- - -## Image avatars - -Use Bootstrap-styled React avatars to display user profile images in a circular format — ideal for representing user accounts and contacts. - - - -## Letter avatars - -Display user initials using letter-based avatars. A perfect fallback when images aren’t available, and still visually consistent with Bootstrap styling. - - - -## Icon avatars - -Insert icons into avatars for representing roles, objects, or placeholder users. Supports vector icons with Bootstrap-friendly layout. - - - -## Rounded avatars - -Use the `shape="rounded"` prop to apply Bootstrap’s rounded corners to the avatar, giving it a subtle square-rounded appearance. - - - -## Square avatars - -To make avatars fully square with no border radius, apply `shape="rounded-0"`, matching Bootstrap’s `rounded-0` utility style. - - - -## Sizes - -Customize avatar size using the `size` prop. Available options include `xl`, `lg`, `md`, and `sm`, aligning with Bootstrap’s scalable design system. - - - -## Avatars with status - -Add a small status indicator (e.g. online, offline) to avatars using the `status` prop — useful for chat interfaces or user dashboards. - - - -## API reference - -Refer to the API below for all configurable props used with the Bootstrap-styled React Avatar component. - -- [<CAvatar />](../api/#cavatar) diff --git a/packages/docs/content/components/avatar/examples/AvatarImage.tsx b/packages/docs/content/components/avatar/examples/AvatarImage.tsx deleted file mode 100644 index 266a306e..00000000 --- a/packages/docs/content/components/avatar/examples/AvatarImage.tsx +++ /dev/null @@ -1,13 +0,0 @@ -import React from 'react' -import { withPrefix } from 'gatsby' -import { CAvatar } from '@coreui/react' - -export const AvatarImage = () => { - return ( - <> - - - - - ) -} diff --git a/packages/docs/content/components/avatar/index.mdx b/packages/docs/content/components/avatar/index.mdx deleted file mode 100644 index 2789b003..00000000 --- a/packages/docs/content/components/avatar/index.mdx +++ /dev/null @@ -1,56 +0,0 @@ ---- -title: React Avatar Component -name: Avatar -description: The React Avatar component is used to display circular user profile pictures. React avatars can portray people or objects and support images, icons, or letters. -route: /components/avatar/ -other_frameworks: avatar ---- - -## Image avatars - -Showcase React avatars using images. These avatars are typically circular and can display user profile pictures. - - - -## Letter avatars - -Use letters inside avatars to represent users or objects when images are not available. This can be useful for displaying initials. - - - -## Icons avatars - -Incorporate icons within React avatars, allowing for a visual representation using scalable vector graphics (SVG). - - - -## Rounded avatars - -Use the `shape="rounded"` prop to make react avatars squared with rounded corners. - - - -## Square avatars - -Use the `shape="rounded-0"` prop to make react avatars squared. - - - -## Sizes - -Fancy larger or smaller react avatar component? Add `size="xl"`, `size="lg"`, `size="md"` or `size="sm"` for additional sizes. - - - -## Avatars with status - -Add a status indicator to avatars using the `status` property to show online or offline status. - - - -## API - -Check out the documentation below for a comprehensive guide to all the props you can use with the components mentioned here. - -- [<CAvatar />](./api/#cavatar) - diff --git a/packages/docs/content/components/badge/api.mdx b/packages/docs/content/components/badge/api.mdx deleted file mode 100644 index 0cf7ef43..00000000 --- a/packages/docs/content/components/badge/api.mdx +++ /dev/null @@ -1,12 +0,0 @@ ---- -title: React Badge Component API -name: Badge API -description: Explore the API reference for the React Badge component and discover how to effectively utilize its props for customization. -route: /components/badge/ ---- - -import CBadgeAPI from '../../api/CBadge.api.mdx' - -## CBadge - - diff --git a/packages/docs/content/components/badge/bootstrap.mdx b/packages/docs/content/components/badge/bootstrap.mdx deleted file mode 100644 index 26481218..00000000 --- a/packages/docs/content/components/badge/bootstrap.mdx +++ /dev/null @@ -1,53 +0,0 @@ ---- -title: React Bootstrap Badge Component -name: Badge with Bootstrap Styling -description: Learn how to use CoreUI’s React Badge component with Bootstrap styles to display counters, labels, and indicators within buttons, links, and UI elements. -route: /components/badge/ -bootstrap_component: true ---- - -## How to use React Bootstrap Badge component - -React Bootstrap Badges scale based on their parent using `em` units, making them easy to embed inside headings, buttons, or navigation items. - - - -You can also use badges inside buttons and links to display counters or notifications. - - - -Keep in mind that depending on usage, badges might be challenging for screen reader users. Add visually hidden helper text when needed to improve accessibility. - - - -### Positioned badges - -Use the `position` prop to place the badge in the corner of a button or link, mimicking the Bootstrap positioning helpers. - - - -You can also create generic status indicators without a number by combining badges with utility classes. - - - -## Contextual variations - -Apply `color` props like `primary`, `danger`, or `success` to control the background color of the badge in a Bootstrap-consistent way. - - - -Use `textBgColor` to automatically set contrasting text and background colors according to WCAG accessibility standards. - - - -## Pill badges - -To make badges more rounded, use the `shape="rounded-pill"` prop. This mirrors Bootstrap’s pill-style badge appearance. - - - -## API reference - -See below for the full API reference for all available props for the Bootstrap-styled React Badge component. - -- [<CBadge />](../api/#cbadge) diff --git a/packages/docs/content/components/badge/index.mdx b/packages/docs/content/components/badge/index.mdx deleted file mode 100644 index a0cda7bd..00000000 --- a/packages/docs/content/components/badge/index.mdx +++ /dev/null @@ -1,55 +0,0 @@ ---- -title: React Badge Component -name: Badge -description: React badge component is small count and labeling component. -route: /components/badge/ -other_frameworks: badge ---- - -## How to use React Badge Component. - -React badge component scales to suit the size of the parent element by using relative font sizing and `em` units. - - - -React badges can be used as part of links or buttons to provide a counter. - - - -Remark that depending on how you use them, react badges may be complicated for users of screen readers and related assistive technologies. - -Unless the context is clear, consider including additional context with a visually hidden piece of additional text. - - - -### Positioned - -Use `position` prop to modify a component and position it in the corner of a link or button. - - - -You can also create more generic indicators without a counter using a few more utilities. - - - -## Contextual variations - -Add any of the below-mentioned `color` props to modify the presentation of a react badge. - - - -You can also apply contextual variations with the `textBgColor` property, which automatically sets the text color to ensure compliance with the WCAG 4.5:1 contrast ratio standard for enhanced accessibility. - - - -## Pill badges - -Apply the `shape="rounded-pill"` prop to make badges rounded. - - - -## API - -Check out the documentation below for a comprehensive guide to all the props you can use with the components mentioned here. - -- [<CBadge />](./api/#cbadge) diff --git a/packages/docs/content/components/breadcrumb/api.mdx b/packages/docs/content/components/breadcrumb/api.mdx deleted file mode 100644 index a2f37b3f..00000000 --- a/packages/docs/content/components/breadcrumb/api.mdx +++ /dev/null @@ -1,17 +0,0 @@ ---- -title: React Breadcrumb Component API -name: Breadcrumb API -description: Explore the API reference for the React Breadcrumb component and discover how to effectively utilize its props for customization. -route: /components/breadcrumb/ ---- - -import CBreadcrumbAPI from '../../api/CBreadcrumb.api.mdx' -import CBreadcrumbItemAPI from '../../api/CBreadcrumbItem.api.mdx' - -## CBreadcrumb - - - -## CBreadcrumbItem - - diff --git a/packages/docs/content/components/breadcrumb/bootstrap.mdx b/packages/docs/content/components/breadcrumb/bootstrap.mdx deleted file mode 100644 index 56b1f06d..00000000 --- a/packages/docs/content/components/breadcrumb/bootstrap.mdx +++ /dev/null @@ -1,57 +0,0 @@ ---- -title: React Bootstrap Breadcrumb Component -name: Breadcrumb with Bootstrap Styling -description: Learn how to use CoreUI’s React Breadcrumb component styled with Bootstrap to indicate navigation hierarchy and enhance user orientation within your app or website. -route: /components/breadcrumb/ -bootstrap_component: true ---- - -## How to use React Bootstrap Breadcrumb component - -The React Bootstrap Breadcrumb navigation component shows users where they are in the application hierarchy. It automatically inserts visual separators via CSS, so you don’t have to manually include them. - - - -## Custom dividers - -Separators between breadcrumb items are automatically inserted using CSS via [`::before`](https://developer.mozilla.org/en-US/docs/Web/CSS/::before) and the [`content`](https://developer.mozilla.org/en-US/docs/Web/CSS/content) property. - -You can customize the divider using the CSS variable `--cui-breadcrumb-divider` or the Sass variable `$breadcrumb-divider`. For RTL support, there’s also `$breadcrumb-divider-flipped`. - - - -To change the divider in Sass, use the `quote` function. For example, to use a `>` character: - -```scss -$breadcrumb-divider: quote('>'); -``` - -It’s also possible to use an **embedded SVG icon** as a divider by assigning it to the custom property or Sass variable: - - - -```scss -$breadcrumb-divider: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' -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='currentColor'/%3E%3C/svg%3E"); -``` - -To remove dividers entirely, set the CSS custom property to an empty string or the Sass variable to `none`. - - - -```scss -$breadcrumb-divider: none; -``` - -## Accessibility - -React Bootstrap Breadcrumbs are accessible by default. CoreUI adds `aria-label="breadcrumb"` to the navigation container and `aria-current="page"` to the active item to ensure proper screen reader behavior. - -For best practices, refer to the [WAI-ARIA Authoring Practices: Breadcrumb Pattern](https://www.w3.org/TR/wai-aria-practices/#breadcrumb). - -## API reference - -Check the API reference below for full details on all available props for the Bootstrap-styled React Breadcrumb component. - -- [<CBreadcrumb />](../api/#cbreadcrumb) -- [<CBreadcrumbItem />](../api/#cbreadcrumbitem) diff --git a/packages/docs/content/components/button-group/api.mdx b/packages/docs/content/components/button-group/api.mdx deleted file mode 100644 index dcf5b538..00000000 --- a/packages/docs/content/components/button-group/api.mdx +++ /dev/null @@ -1,17 +0,0 @@ ---- -title: React Button Group Component API -name: Button Group API -description: Explore the API reference for the React Button Group component and discover how to effectively utilize its props for customization. -route: /components/button-group/ ---- - -import CButtonGroupAPI from '../../api/CButtonGroup.api.mdx' -import CButtonToolbarAPI from '../../api/CButtonToolbar.api.mdx' - -## CButtonGroup - - - -## CButtonToolbar - - diff --git a/packages/docs/content/components/button-group/bootstrap.mdx b/packages/docs/content/components/button-group/bootstrap.mdx deleted file mode 100644 index 71728df0..00000000 --- a/packages/docs/content/components/button-group/bootstrap.mdx +++ /dev/null @@ -1,78 +0,0 @@ ---- -title: React Bootstrap Button Group Component -name: Button Group with Bootstrap Styling -description: Learn how to group buttons using the React Bootstrap Button Group component from CoreUI. Create accessible, styled toolbars and button sets with ease. -route: /components/button-group/ -bootstrap_component: true ---- - -## How to use React Bootstrap Button Group component - -The React Bootstrap Button Group component allows you to group multiple buttons together into a single toolbar-like unit. Wrap a series of `` components in a `` to get started. - - - -Ensure the correct role and provide a label}> - For assistive technologies (e.g. screen readers) to identify a set of buttons as grouped, use `role="group"` for button groups and `role="toolbar"` for toolbars. - - Always include an accessible label using `aria-label` or `aria-labelledby` to clarify the purpose of the group. - - -React Bootstrap Button Groups can also be applied to a group of links instead of using the [`CNav`](./../navs-tabs/#base-nav) component. - - - -## Mixed styles in React Bootstrap Button Groups - -Combine buttons with different styles within a single group for more flexible UI designs. - - - -## Outlined button styles - -Use `variant="outline"` on grouped buttons to apply Bootstrap's outline button style across the group. - - - -## Checkbox and radio button groups - -Create interactive grouped controls by combining button-style checkboxes and radio buttons inside a React Bootstrap Button Group. - - - - - -## React Bootstrap Button Toolbar - -Group multiple button groups together into a toolbar using ``. Combine with layout utilities to control spacing and alignment. - - - -You can also combine input groups with button groups to create interactive toolbars. - - - -## Sizing React Bootstrap Button Groups - -Instead of setting size on individual buttons, apply the `size` prop to the `` to make all buttons within it uniformly sized. - - - -## Nesting button groups - -Nest a `` inside another to combine dropdowns with standard buttons, as supported in React Bootstrap Button Group usage. - - - -## Vertical React Bootstrap Button Groups - -Stack buttons vertically using the vertical variation of React Bootstrap Button Group. Note: split dropdowns are not supported in vertical mode. - - - -## API reference - -Explore the API documentation for available props and configuration for the React Bootstrap Button Group component and toolbars. - -- [<CButtonGroup />](../api/#cbuttongroup) -- [<CButtonToolbar />]() diff --git a/packages/docs/content/components/button-group/index.mdx b/packages/docs/content/components/button-group/index.mdx deleted file mode 100644 index 78b875ad..00000000 --- a/packages/docs/content/components/button-group/index.mdx +++ /dev/null @@ -1,74 +0,0 @@ ---- -title: React Button Group Component -name: Button group -description: React button group component allows to group a series of buttons and power them with JavaScript. -route: /components/button-group/ -other_frameworks: button-group ---- - -## How to use React Button Group Component. - -Wrap a series of `` components in ``. - - - -Ensure the correct role and provide a label}> - For assistive technologies (ex. screen readers) to communicate that a series of buttons are grouped, a proper `role` attribute has to be provided. For button groups, this should be `role="group"`, while toolbars should have a `role="toolbar"`. - - Besides, groups and toolbars should be provided an understandable label, as most assistive technologies will otherwise not declare them, despite the appearance of the specific role attribute. In the following examples provided here, we apply `aria-label`, but options such as `aria-labelledby` can also be used. - - -These classes can also be added to groups of links, as an alternative to the [`CNav`](./../navs-tabs/#base-nav) components. - - - -## Mixed styles - - - -## Outlined styles - - - -## Checkbox and radio button groups - -Combine button-like checkbox and radio toggle buttons into a seamless looking button group. - - - - - -## Button toolbar - -Join sets of button groups into button toolbars for more complicated components. Use utility classes as needed to space out groups, buttons, and more. - - - -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. - - - -## Sizing - -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. - - - -## Nesting - -Put a `` inside another `` when you need dropdown menus combined with a series of buttons. - - - -## Vertical variation - -Create a set of buttons that appear vertically stacked rather than horizontally. **Split button dropdowns are not supported here.** - - - -## API - -Check out the documentation below for a comprehensive guide to all the props you can use with the components mentioned here. - -- [<CButtonGroup />](./api/#cbuttongroup) -- [<CButtonToolbar />](./api/#cbuttontoolbar) diff --git a/packages/docs/content/components/button/api.mdx b/packages/docs/content/components/button/api.mdx deleted file mode 100644 index 532898de..00000000 --- a/packages/docs/content/components/button/api.mdx +++ /dev/null @@ -1,12 +0,0 @@ ---- -title: React Button Component API -name: Button API -description: Explore the API reference for the React Button component and discover how to effectively utilize its props for customization. -route: /components/button/ ---- - -import CButtonAPI from '../../api/CButton.api.mdx' - -## CButton - - diff --git a/packages/docs/content/components/button/bootstrap.mdx b/packages/docs/content/components/button/bootstrap.mdx deleted file mode 100644 index 12bb09e1..00000000 --- a/packages/docs/content/components/button/bootstrap.mdx +++ /dev/null @@ -1,103 +0,0 @@ ---- -title: React Bootstrap Button Component -name: Buttons with Bootstrap Styling -description: Learn how to use CoreUI’s React Button component with Bootstrap styling to build interactive, accessible, and responsive buttons for forms, tables, modals, and more. -route: /components/button/ -bootstrap_component: true ---- - -## How to use React Bootstrap Button component - -CoreUI provides a set of prebuilt React Button components styled with Bootstrap. Buttons signal actions to users and can initiate events both in the UI and behind the scenes. - - - - - -## Disable text wrapping - -To prevent text wrapping inside a button, apply the `.text-nowrap` class to the ``. Alternatively, set `$btn-white-space: nowrap` in Sass to apply it globally. - -## Button components - -The `` component can render as a ` -``` - -#### Semantic icons - -The description that you must set using the title property will be used by CoreUI React Icon Component to generate alternative text for the semantic icon. - -Thus, if your markup appears as follows: - -```jsx - - - -``` - -CoreUI React Icon Component will make the necessary adjustments so that only screenreaders can "see" the supporting elements that convey the message. - -```html - -``` - -## Available react icons - -The CoreUI React Icons package includes a comprehensive library of more than 1500 icons, available in various formats such as SVG, PNG, and Webfonts. These popular icons are meticulously crafted symbols representing common actions and items. You can utilize them in your digital products, whether they are web or mobile applications, to enhance their visual appeal and user experience. - -By leveraging the capabilities of the React Icons component from CoreUI, you can easily incorporate visually appealing icons into their React applications, allowing for more engaging and intuitive user interfaces. - -export const LinearExample = () => { - const icons = ['cilAccountLogout', 'cilActionRedo', 'cilActionUndo', 'cilAddressBook', 'cilAirplaneModeOff', 'cilAirplaneMode', 'cilAirplay', 'cilAlarm', 'cilAlbum', 'cilAlignCenter', 'cilAlignLeft', 'cilAlignRight', 'cilAmericanFootball', 'cilAnimal', 'cilAperture', 'cilApple', 'cilApplicationsSettings', 'cilApplications', 'cilAppsSettings', 'cilApps', 'cilArrowBottom', 'cilArrowCircleBottom', 'cilArrowCircleLeft', 'cilArrowCircleRight', 'cilArrowCircleTop', 'cilArrowLeft', 'cilArrowRight', 'cilArrowThickBottom', 'cilArrowThickFromBottom', 'cilArrowThickFromLeft', 'cilArrowThickFromRight', 'cilArrowThickFromTop', 'cilArrowThickLeft', 'cilArrowThickRight', 'cilArrowThickToBottom', 'cilArrowThickToLeft', 'cilArrowThickToRight', 'cilArrowThickToTop', 'cilArrowThickTop', 'cilArrowTop', 'cilAssistiveListeningSystem', 'cilAsteriskCircle', 'cilAsterisk', 'cilAt', 'cilAudioDescription', 'cilAudioSpectrum', 'cilAudio', 'cilAvTimer', 'cilBabyCarriage', 'cilBaby', 'cilBackspace', 'cilBadge', 'cilBalanceScale', 'cilBan', 'cilBank', 'cilBarChart', 'cilBarcode', 'cilBaseball', 'cilBasket', 'cilBasketball', 'cilBath', 'cilBathroom', 'cilBattery0', 'cilBattery3', 'cilBattery5', 'cilBatteryAlert', 'cilBatteryEmpty', 'cilBatteryFull', 'cilBatterySlash', 'cilBeachAccess', 'cilBeaker', 'cilBed', 'cilBellExclamation', 'cilBell', 'cilBike', 'cilBirthdayCake', 'cilBlind', 'cilBluetooth', 'cilBlurCircular', 'cilBlurLinear', 'cilBlur', 'cilBoatAlt', 'cilBold', 'cilBoltCircle', 'cilBolt', 'cilBook', 'cilBookmark', 'cilBorderAll', 'cilBorderBottom', 'cilBorderClear', 'cilBorderHorizontal', 'cilBorderInner', 'cilBorderLeft', 'cilBorderOuter', 'cilBorderRight', 'cilBorderStyle', 'cilBorderTop', 'cilBorderVertical', 'cilBowling', 'cilBraille', 'cilBriefcase', 'cilBrightness', 'cilBritishPound', 'cilBrowser', 'cilBrushAlt', 'cilBrush', 'cilBug', 'cilBuilding', 'cilBullhorn', 'cilBurger', 'cilBurn', 'cilBusAlt', 'cilCalculator', 'cilCalendarCheck', 'cilCalendar', 'cilCameraControl', 'cilCameraRoll', 'cilCamera', 'cilCarAlt', 'cilCaretBottom', 'cilCaretLeft', 'cilCaretRight', 'cilCaretTop', 'cilCart', 'cilCash', 'cilCasino', 'cilCast', 'cilCat', 'cilCc', 'cilCenterFocus', 'cilChartLine', 'cilChartPie', 'cilChart', 'cilChatBubble', 'cilCheckAlt', 'cilCheckCircle', 'cilCheck', 'cilChevronBottom', 'cilChevronCircleDownAlt', 'cilChevronCircleLeftAlt', 'cilChevronCircleRightAlt', 'cilChevronCircleUpAlt', 'cilChevronDoubleDown', 'cilChevronDoubleLeft', 'cilChevronDoubleRight', 'cilChevronDoubleUp', 'cilChevronLeft', 'cilChevronRight', 'cilChevronTop', 'cilChildFriendly', 'cilChild', 'cilCircle', 'cilClearAll', 'cilClipboard', 'cilClock', 'cilClone', 'cilClosedCaptioning', 'cilCloudDownload', 'cilCloudUpload', 'cilCloud', 'cilCloudy', 'cilCode', 'cilCoffee', 'cilCog', 'cilColorBorder', 'cilColorFill', 'cilColorPalette', 'cilColumns', 'cilCommand', 'cilCommentBubble', 'cilCommentSquare', 'cilCompass', 'cilCompress', 'cilContact', 'cilContrast', 'cilControl', 'cilCopy', 'cilCouch', 'cilCreditCard', 'cilCropRotate', 'cilCrop', 'cilCursorMove', 'cilCursor', 'cilCut', 'cilDataTransferDown', 'cilDataTransferUp', 'cilDeaf', 'cilDelete', 'cilDescription', 'cilDevices', 'cilDialpad', 'cilDiamond', 'cilDinner', 'cilDisabled', 'cilDog', 'cilDollar', 'cilDoor', 'cilDoubleQuoteSansLeft', 'cilDoubleQuoteSansRight', 'cilDrinkAlcohol', 'cilDrink', 'cilDrop', 'cilEco', 'cilEducation', 'cilElevator', 'cilEnvelopeClosed', 'cilEnvelopeLetter', 'cilEnvelopeOpen', 'cilEqualizer', 'cilEthernet', 'cilEuro', 'cilExcerpt', 'cilExitToApp', 'cilExpandDown', 'cilExpandLeft', 'cilExpandRight', 'cilExpandUp', 'cilExposure', 'cilExternalLink', 'cilEyedropper', 'cilFaceDead', 'cilFace', 'cilFactorySlash', 'cilFactory', 'cilFastfood', 'cilFax', 'cilFeaturedPlaylist', 'cilFile', 'cilFilterFrames', 'cilFilterPhoto', 'cilFilterSquare', 'cilFilterX', 'cilFilter', 'cilFindInPage', 'cilFingerprint', 'cilFire', 'cilFlagAlt', 'cilFlightTakeoff', 'cilFlipToBack', 'cilFlipToFront', 'cilFlip', 'cilFlower', 'cilFolderOpen', 'cilFolder', 'cilFont', 'cilFootball', 'cilFork', 'cilFridge', 'cilFrown', 'cilFullscreenExit', 'cilFullscreen', 'cilFunctionsAlt', 'cilFunctions', 'cilGamepad', 'cilGarage', 'cilGem', 'cilGif', 'cilGift', 'cilGlobeAlt', 'cilGolfAlt', 'cilGolf', 'cilGradient', 'cilGrain', 'cilGraph', 'cilGridSlash', 'cilGrid', 'cilGroup', 'cilHamburgerMenu', 'cilHandPointDown', 'cilHandPointLeft', 'cilHandPointRight', 'cilHandPointUp', 'cilHappy', 'cilHd', 'cilHdr', 'cilHeader', 'cilHeadphones', 'cilHealing', 'cilHeart', 'cilHighlighter', 'cilHighligt', 'cilHistory', 'cilHome', 'cilHospital', 'cilHotTub', 'cilHouse', 'cilHttps', 'cilImageBroken', 'cilImagePlus', 'cilImage', 'cilInbox', 'cilIndentDecrease', 'cilIndentIncrease', 'cilIndustrySlash', 'cilIndustry', 'cilInfinity', 'cilInfo', 'cilInputHdmi', 'cilInputPower', 'cilInput', 'cilInstitution', 'cilItalic', 'cilJustifyCenter', 'cilJustifyLeft', 'cilJustifyRight', 'cilKeyboard', 'cilLan', 'cilLanguage', 'cilLaptop', 'cilLayers', 'cilLeaf', 'cilLemon', 'cilLevelDown', 'cilLevelUp', 'cilLibraryAdd', 'cilLibraryBuilding', 'cilLibrary', 'cilLifeRing', 'cilLightbulb', 'cilLineSpacing', 'cilLineStyle', 'cilLineWeight', 'cilLinkAlt', 'cilLinkBroken', 'cilLink', 'cilListFilter', 'cilListHighPriority', 'cilListLowPriority', 'cilListNumberedRtl', 'cilListNumbered', 'cilListRich', 'cilList', 'cilLocationPin', 'cilLockLocked', 'cilLockUnlocked', 'cilLocomotive', 'cilLoop1', 'cilLoopCircular', 'cilLoop', 'cilLowVision', 'cilMagnifyingGlass', 'cilMap', 'cilMediaEject', 'cilMediaPause', 'cilMediaPlay', 'cilMediaRecord', 'cilMediaSkipBackward', 'cilMediaSkipForward', 'cilMediaStepBackward', 'cilMediaStepForward', 'cilMediaStop', 'cilMedicalCross', 'cilMeh', 'cilMemory', 'cilMenu', 'cilMic', 'cilMicrophone', 'cilMinus', 'cilMobileLandscape', 'cilMobile', 'cilMoney', 'cilMonitor', 'cilMoodBad', 'cilMoodGood', 'cilMoodVeryBad', 'cilMoodVeryGood', 'cilMoon', 'cilMouse', 'cilMouthSlash', 'cilMove', 'cilMovie', 'cilMugTea', 'cilMug', 'cilMusicNote', 'cilNewspaper', 'cilNoteAdd', 'cilNotes', 'cilObjectGroup', 'cilObjectUngroup', 'cilOpacity', 'cilOpentype', 'cilOptions', 'cilPaintBucket', 'cilPaint', 'cilPaperPlane', 'cilPaperclip', 'cilParagraph', 'cilPaw', 'cilPenAlt', 'cilPenNib', 'cilPen', 'cilPencil', 'cilPeople', 'cilPhone', 'cilPin', 'cilPizza', 'cilPlant', 'cilPlaylistAdd', 'cilPlus', 'cilPool', 'cilPowerStandby', 'cilPregnant', 'cilPrint', 'cilPushchair', 'cilPuzzle', 'cilQrCode', 'cilRain', 'cilRectangle', 'cilRecycle', 'cilReload', 'cilReportSlash', 'cilResizeBoth', 'cilResizeHeight', 'cilResizeWidth', 'cilRestaurant', 'cilRoom', 'cilRouter', 'cilRowing', 'cilRss', 'cilRuble', 'cilRunning', 'cilSad', 'cilSatelite', 'cilSave', 'cilSchool', 'cilScreenDesktop', 'cilScreenSmartphone', 'cilScrubber', 'cilSearch', 'cilSend', 'cilSettings', 'cilShareAll', 'cilShareAlt', 'cilShareBoxed', 'cilShare', 'cilShieldAlt', 'cilShortText', 'cilShower', 'cilSignLanguage', 'cilSignalCellular0', 'cilSignalCellular3', 'cilSignalCellular4', 'cilSim', 'cilSitemap', 'cilSmilePlus', 'cilSmile', 'cilSmokeFree', 'cilSmokeSlash', 'cilSmoke', 'cilSmokingRoom', 'cilSnowflake', 'cilSoccer', 'cilSofa', 'cilSortAlphaDown', 'cilSortAlphaUp', 'cilSortAscending', 'cilSortDescending', 'cilSortNumericDown', 'cilSortNumericUp', 'cilSpa', 'cilSpaceBar', 'cilSpeak', 'cilSpeaker', 'cilSpeech', 'cilSpeedometer', 'cilSpreadsheet', 'cilSquare', 'cilStarHalf', 'cilStar', 'cilStorage', 'cilStream', 'cilStrikethrough', 'cilSun', 'cilSwapHorizontal', 'cilSwapVertical', 'cilSwimming', 'cilSync', 'cilTablet', 'cilTag', 'cilTags', 'cilTask', 'cilTaxi', 'cilTennisBall', 'cilTennis', 'cilTerminal', 'cilTerrain', 'cilTextShapes', 'cilTextSize', 'cilTextSquare', 'cilTextStrike', 'cilText', 'cilThumbDown', 'cilThumbUp', 'cilToggleOff', 'cilToggleOn', 'cilToilet', 'cilTouchApp', 'cilTransfer', 'cilTranslate', 'cilTrash', 'cilTriangle', 'cilTruck', 'cilTv', 'cilUnderline', 'cilUsb', 'cilUserFemale', 'cilUserFollow', 'cilUserPlus', 'cilUserUnfollow', 'cilUserX', 'cilUser', 'cilVector', 'cilVerticalAlignBottom', 'cilVerticalAlignCenter', 'cilVerticalAlignTop', 'cilVideo', 'cilVideogame', 'cilViewColumn', 'cilViewModule', 'cilViewQuilt', 'cilViewStream', 'cilVoiceOverRecord', 'cilVoice', 'cilVolumeHigh', 'cilVolumeLow', 'cilVolumeOff', 'cilWalk', 'cilWallet', 'cilWallpaper', 'cilWarning', 'cilWatch', 'cilWc', 'cilWeightlifitng', 'cilWheelchair', 'cilWifiSignal0', 'cilWifiSignal1', 'cilWifiSignal2', 'cilWifiSignal3', 'cilWifiSignal4', 'cilWifiSignalOff', 'cilWindowMaximize', 'cilWindowMinimize', 'cilWindowRestore', 'cilWindow', 'cilWrapText', 'cilXCircle', 'cilX', 'cilYen', 'cilZoomIn', 'cilZoomOut', 'cilZoom'] - return ( - - {icons.map((i, idx) => { - return ( - -
- -
-
{i}
- ) - })} - - ) -} - -export const BrandExample = () => { - const icons = ['cib500px5', 'cib500px', 'cibAboutMe', 'cibAbstract', 'cibAcm', 'cibAddthis', 'cibAdguard', 'cibAdobeAcrobatReader', 'cibAdobeAfterEffects', 'cibAdobeAudition', 'cibAdobeCreativeCloud', 'cibAdobeDreamweaver', 'cibAdobeIllustrator', 'cibAdobeIndesign', 'cibAdobeLightroomClassic', 'cibAdobeLightroom', 'cibAdobePhotoshop', 'cibAdobePremiere', 'cibAdobeTypekit', 'cibAdobeXd', 'cibAdobe', 'cibAirbnb', 'cibAlgolia', 'cibAlipay', 'cibAllocine', 'cibAmazonAws', 'cibAmazonPay', 'cibAmazon', 'cibAmd', 'cibAmericanExpress', 'cibAnaconda', 'cibAnalogue', 'cibAndroidAlt', 'cibAndroid', 'cibAngellist', 'cibAngularUniversal', 'cibAngular', 'cibAnsible', 'cibApacheAirflow', 'cibApacheFlink', 'cibApacheSpark', 'cibApache', 'cibAppStoreIos', 'cibAppStore', 'cibAppleMusic', 'cibApplePay', 'cibApplePodcasts', 'cibApple', 'cibAppveyor', 'cibAral', 'cibArchLinux', 'cibArchiveOfOurOwn', 'cibArduino', 'cibArtstation', 'cibArxiv', 'cibAsana', 'cibAtAndT', 'cibAtlassian', 'cibAtom', 'cibAudible', 'cibAurelia', 'cibAuth0', 'cibAutomatic', 'cibAutotask', 'cibAventrix', 'cibAzureArtifacts', 'cibAzureDevops', 'cibAzurePipelines', 'cibBabel', 'cibBaidu', 'cibBamboo', 'cibBancontact', 'cibBandcamp', 'cibBasecamp', 'cibBathasu', 'cibBehance', 'cibBigCartel', 'cibBing', 'cibBit', 'cibBitbucket', 'cibBitcoin', 'cibBitdefender', 'cibBitly', 'cibBlackberry', 'cibBlender', 'cibBloggerB', 'cibBlogger', 'cibBluetoothB', 'cibBluetooth', 'cibBoeing', 'cibBoost', 'cibBootstrap', 'cibBower', 'cibBrandAi', 'cibBrave', 'cibBtc', 'cibBuddy', 'cibBuffer', 'cibBuyMeACoffee', 'cibBuysellads', 'cibBuzzfeed', 'cibC', 'cibCakephp', 'cibCampaignMonitor', 'cibCanva', 'cibCashapp', 'cibCassandra', 'cibCastro', 'cibCcAmazonPay', 'cibCcAmex', 'cibCcApplePay', 'cibCcDinersClub', 'cibCcDiscover', 'cibCcJcb', 'cibCcMastercard', 'cibCcPaypal', 'cibCcStripe', 'cibCcVisa', 'cibCentos', 'cibCevo', 'cibChase', 'cibChef', 'cibChromecast', 'cibCircle', 'cibCircleci', 'cibCirrusci', 'cibCisco', 'cibCivicrm', 'cibClockify', 'cibClojure', 'cibCloudbees', 'cibCloudflare', 'cibCmake', 'cibCoOp', 'cibCodacy', 'cibCodeClimate', 'cibCodecademy', 'cibCodecov', 'cibCodeigniter', 'cibCodepen', 'cibCoderwall', 'cibCodesandbox', 'cibCodeship', 'cibCodewars', 'cibCodio', 'cibCoffeescript', 'cibCommonWorkflowLanguage', 'cibComposer', 'cibCondaForge', 'cibConekta', 'cibConfluence', 'cibCoreuiC', 'cibCoreui', 'cibCoursera', 'cibCoveralls', 'cibCpanel', 'cibCplusplus', 'cibCreativeCommonsBy', 'cibCreativeCommonsNcEu', 'cibCreativeCommonsNcJp', 'cibCreativeCommonsNc', 'cibCreativeCommonsNd', 'cibCreativeCommonsPdAlt', 'cibCreativeCommonsPd', 'cibCreativeCommonsRemix', 'cibCreativeCommonsSa', 'cibCreativeCommonsSamplingPlus', 'cibCreativeCommonsSampling', 'cibCreativeCommonsShare', 'cibCreativeCommonsZero', 'cibCreativeCommons', 'cibCrunchbase', 'cibCrunchyroll', 'cibCss3Shiled', 'cibCss3', 'cibCsswizardry', 'cibD3Js', 'cibDailymotion', 'cibDashlane', 'cibDazn', 'cibDblp', 'cibDebian', 'cibDeepin', 'cibDeezer', 'cibDelicious', 'cibDell', 'cibDeno', 'cibDependabot', 'cibDesignerNews', 'cibDevTo', 'cibDeviantart', 'cibDevrant', 'cibDiaspora', 'cibDigg', 'cibDigitalOcean', 'cibDiscord', 'cibDiscourse', 'cibDiscover', 'cibDisqus', 'cibDisroot', 'cibDjango', 'cibDocker', 'cibDocusign', 'cibDotNet', 'cibDraugiemLv', 'cibDribbble', 'cibDrone', 'cibDropbox', 'cibDrupal', 'cibDtube', 'cibDuckduckgo', 'cibDynatrace', 'cibEbay', 'cibEclipseide', 'cibElasticCloud', 'cibElasticSearch', 'cibElasticStack', 'cibElastic', 'cibElectron', 'cibElementary', 'cibEleventy', 'cibEllo', 'cibElsevier', 'cibEmlakjet', 'cibEmpirekred', 'cibEnvato', 'cibEpicGames', 'cibEpson', 'cibEsea', 'cibEslint', 'cibEthereum', 'cibEtsy', 'cibEventStore', 'cibEventbrite', 'cibEvernote', 'cibEverplaces', 'cibEvry', 'cibExercism', 'cibExpertsExchange', 'cibExpo', 'cibEyeem', 'cibFSecure', 'cibFacebookF', 'cibFacebook', 'cibFaceit', 'cibFandango', 'cibFavro', 'cibFeathub', 'cibFedex', 'cibFedora', 'cibFeedly', 'cibFidoAlliance', 'cibFigma', 'cibFilezilla', 'cibFirebase', 'cibFitbit', 'cibFlask', 'cibFlattr', 'cibFlickr', 'cibFlipboard', 'cibFlutter', 'cibFnac', 'cibFoursquare', 'cibFramer', 'cibFreebsd', 'cibFreecodecamp', 'cibFurAffinity', 'cibFurryNetwork', 'cibGarmin', 'cibGatsby', 'cibGauges', 'cibGenius', 'cibGentoo', 'cibGeocaching', 'cibGerrit', 'cibGg', 'cibGhost', 'cibGimp', 'cibGit', 'cibGitea', 'cibGithub', 'cibGitkraken', 'cibGitlab', 'cibGitpod', 'cibGitter', 'cibGlassdoor', 'cibGlitch', 'cibGmail', 'cibGnuPrivacyGuard', 'cibGnuSocial', 'cibGnu', 'cibGo', 'cibGodotEngine', 'cibGogCom', 'cibGoldenline', 'cibGoodreads', 'cibGoogleAds', 'cibGoogleAllo', 'cibGoogleAnalytics', 'cibGoogleChrome', 'cibGoogleCloud', 'cibGoogleKeep', 'cibGooglePay', 'cibGooglePlay', 'cibGooglePodcasts', 'cibGoogle', 'cibGooglesCholar', 'cibGovUk', 'cibGradle', 'cibGrafana', 'cibGraphcool', 'cibGraphql', 'cibGrav', 'cibGravatar', 'cibGreenkeeper', 'cibGreensock', 'cibGroovy', 'cibGroupon', 'cibGrunt', 'cibGulp', 'cibGumroad', 'cibGumtree', 'cibHabr', 'cibHackaday', 'cibHackerearth', 'cibHackerone', 'cibHackerrank', 'cibHackhands', 'cibHackster', 'cibHappycow', 'cibHashnode', 'cibHaskell', 'cibHatenaBookmark', 'cibHaxe', 'cibHelm', 'cibHere', 'cibHeroku', 'cibHexo', 'cibHighly', 'cibHipchat', 'cibHitachi', 'cibHockeyapp', 'cibHomify', 'cibHootsuite', 'cibHotjar', 'cibHouzz', 'cibHp', 'cibHtml5Shield', 'cibHtml5', 'cibHtmlacademy', 'cibHuawei', 'cibHubspot', 'cibHulu', 'cibHumbleBundle', 'cibIata', 'cibIbm', 'cibIcloud', 'cibIconjar', 'cibIcq', 'cibIdeal', 'cibIfixit', 'cibImdb', 'cibIndeed', 'cibInkscape', 'cibInstacart', 'cibInstagram', 'cibInstapaper', 'cibIntel', 'cibIntellijidea', 'cibIntercom', 'cibInternetExplorer', 'cibInvision', 'cibIonic', 'cibIssuu', 'cibItchIo', 'cibJabber', 'cibJava', 'cibJavascript', 'cibJekyll', 'cibJenkins', 'cibJest', 'cibJet', 'cibJetbrains', 'cibJira', 'cibJoomla', 'cibJquery', 'cibJs', 'cibJsdelivr', 'cibJsfiddle', 'cibJson', 'cibJupyter', 'cibJustgiving', 'cibKaggle', 'cibKaios', 'cibKaspersky', 'cibKentico', 'cibKeras', 'cibKeybase', 'cibKeycdn', 'cibKhanAcademy', 'cibKibana', 'cibKickstarter', 'cibKik', 'cibKirby', 'cibKlout', 'cibKnown', 'cibKoFi', 'cibKodi', 'cibKoding', 'cibKotlin', 'cibKrita', 'cibKubernetes', 'cibLanyrd', 'cibLaravelHorizon', 'cibLaravelNova', 'cibLaravel', 'cibLastFm', 'cibLatex', 'cibLaunchpad', 'cibLeetcode', 'cibLenovo', 'cibLess', 'cibLetsEncrypt', 'cibLetterboxd', 'cibLgtm', 'cibLiberapay', 'cibLibrarything', 'cibLibreoffice', 'cibLine', 'cibLinkedinIn', 'cibLinkedin', 'cibLinuxFoundation', 'cibLinuxMint', 'cibLinux', 'cibLivejournal', 'cibLivestream', 'cibLogstash', 'cibLua', 'cibLumen', 'cibLyft', 'cibMacys', 'cibMagento', 'cibMagisk', 'cibMailRu', 'cibMailchimp', 'cibMakerbot', 'cibManjaro', 'cibMarkdown', 'cibMarketo', 'cibMastercard', 'cibMastodon', 'cibMaterialDesign', 'cibMathworks', 'cibMatrix', 'cibMattermost', 'cibMatternet', 'cibMaxcdn', 'cibMcafee', 'cibMediaTemple', 'cibMediafire', 'cibMediumM', 'cibMedium', 'cibMeetup', 'cibMega', 'cibMendeley', 'cibMessenger', 'cibMeteor', 'cibMicroBlog', 'cibMicrogenetics', 'cibMicrosoftEdge', 'cibMicrosoft', 'cibMinetest', 'cibMinutemailer', 'cibMix', 'cibMixcloud', 'cibMixer', 'cibMojang', 'cibMonero', 'cibMongodb', 'cibMonkeytie', 'cibMonogram', 'cibMonzo', 'cibMoo', 'cibMozillaFirefox', 'cibMozilla', 'cibMusescore', 'cibMxlinux', 'cibMyspace', 'cibMysql', 'cibNativescript', 'cibNec', 'cibNeo4J', 'cibNetflix', 'cibNetlify', 'cibNextJs', 'cibNextcloud', 'cibNextdoor', 'cibNginx', 'cibNim', 'cibNintendo3Ds', 'cibNintendoGamecube', 'cibNintendoSwitch', 'cibNintendo', 'cibNodeJs', 'cibNodeRed', 'cibNodemon', 'cibNokia', 'cibNotion', 'cibNpm', 'cibNucleo', 'cibNuget', 'cibNuxtJs', 'cibNvidia', 'cibOcaml', 'cibOctave', 'cibOctopusDeploy', 'cibOculus', 'cibOdnoklassniki', 'cibOpenAccess', 'cibOpenCollective', 'cibOpenId', 'cibOpenSourceInitiative', 'cibOpenstreetmap', 'cibOpensuse', 'cibOpenvpn', 'cibOpera', 'cibOpsgenie', 'cibOracle', 'cibOrcid', 'cibOrigin', 'cibOsi', 'cibOsmc', 'cibOvercast', 'cibOverleaf', 'cibOvh', 'cibPagekit', 'cibPalantir', 'cibPandora', 'cibPantheon', 'cibPatreon', 'cibPaypal', 'cibPeriscope', 'cibPhp', 'cibPicartoTv', 'cibPinboard', 'cibPingdom', 'cibPingup', 'cibPinterestP', 'cibPinterest', 'cibPivotaltracker', 'cibPlangrid', 'cibPlayerMe', 'cibPlayerfm', 'cibPlaystation', 'cibPlaystation3', 'cibPlaystation4', 'cibPlesk', 'cibPlex', 'cibPluralsight', 'cibPlurk', 'cibPocket', 'cibPostgresql', 'cibPostman', 'cibPostwoman', 'cibPowershell', 'cibPrettier', 'cibPrismic', 'cibProbot', 'cibProcesswire', 'cibProductHunt', 'cibProtoIo', 'cibProtonmail', 'cibProxmox', 'cibPypi', 'cibPython', 'cibPytorch', 'cibQgis', 'cibQiita', 'cibQq', 'cibQualcomm', 'cibQuantcast', 'cibQuantopian', 'cibQuarkus', 'cibQuora', 'cibQwiklabs', 'cibQzone', 'cibR', 'cibRadiopublic', 'cibRails', 'cibRaspberryPi', 'cibReact', 'cibReadTheDocs', 'cibReadme', 'cibRealm', 'cibReason', 'cibRedbubble', 'cibRedditAlt', 'cibReddit', 'cibRedhat', 'cibRedis', 'cibRedux', 'cibRenren', 'cibReverbnation', 'cibRiot', 'cibRipple', 'cibRiseup', 'cibRollupJs', 'cibRoots', 'cibRoundcube', 'cibRss', 'cibRstudio', 'cibRuby', 'cibRubygems', 'cibRunkeeper', 'cibRust', 'cibSafari', 'cibSahibinden', 'cibSalesforce', 'cibSaltstack', 'cibSamsungPay', 'cibSamsung', 'cibSap', 'cibSassAlt', 'cibSass', 'cibSaucelabs', 'cibScala', 'cibScaleway', 'cibScribd', 'cibScrutinizerci', 'cibSeagate', 'cibSega', 'cibSellfy', 'cibSemaphoreci', 'cibSensu', 'cibSentry', 'cibServerFault', 'cibShazam', 'cibShell', 'cibShopify', 'cibShowpad', 'cibSiemens', 'cibSignal', 'cibSinaWeibo', 'cibSitepoint', 'cibSketch', 'cibSkillshare', 'cibSkyliner', 'cibSkype', 'cibSlack', 'cibSlashdot', 'cibSlickpic', 'cibSlides', 'cibSlideshare', 'cibSmashingmagazine', 'cibSnapchat', 'cibSnapcraft', 'cibSnyk', 'cibSociety6', 'cibSocketIo', 'cibSogou', 'cibSolus', 'cibSongkick', 'cibSonos', 'cibSoundcloud', 'cibSourceforge', 'cibSourcegraph', 'cibSpacemacs', 'cibSpacex', 'cibSparkfun', 'cibSparkpost', 'cibSpdx', 'cibSpeakerDeck', 'cibSpectrum', 'cibSpotify', 'cibSpotlight', 'cibSpreaker', 'cibSpring', 'cibSprint', 'cibSquarespace', 'cibStackbit', 'cibStackexchange', 'cibStackoverflow', 'cibStackpath', 'cibStackshare', 'cibStadia', 'cibStatamic', 'cibStaticman', 'cibStatuspage', 'cibSteam', 'cibSteem', 'cibSteemit', 'cibStitcher', 'cibStorify', 'cibStorybook', 'cibStrapi', 'cibStrava', 'cibStripeS', 'cibStripe', 'cibStubhub', 'cibStumbleupon', 'cibStyleshare', 'cibStylus', 'cibSublimeText', 'cibSubversion', 'cibSuperuser', 'cibSvelte', 'cibSvg', 'cibSwagger', 'cibSwarm', 'cibSwift', 'cibSymantec', 'cibSymfony', 'cibSynology', 'cibTMobile', 'cibTableau', 'cibTails', 'cibTapas', 'cibTeamviewer', 'cibTed', 'cibTeespring', 'cibTelegramPlane', 'cibTelegram', 'cibTencentQq', 'cibTencentWeibo', 'cibTensorflow', 'cibTerraform', 'cibTesla', 'cibTheMighty', 'cibTheMovieDatabase', 'cibTidal', 'cibTiktok', 'cibTinder', 'cibTodoist', 'cibToggl', 'cibTopcoder', 'cibToptal', 'cibTor', 'cibToshiba', 'cibTrainerroad', 'cibTrakt', 'cibTravisci', 'cibTreehouse', 'cibTrello', 'cibTripadvisor', 'cibTrulia', 'cibTumblr', 'cibTwilio', 'cibTwitch', 'cibTwitter', 'cibTwoo', 'cibTypescript', 'cibTypo3', 'cibUber', 'cibUbisoft', 'cibUblockOrigin', 'cibUbuntu', 'cibUdacity', 'cibUdemy', 'cibUikit', 'cibUmbraco', 'cibUnity', 'cibUnrealEngine', 'cibUnsplash', 'cibUntappd', 'cibUpwork', 'cibUsb', 'cibV8', 'cibVagrant', 'cibVenmo', 'cibVerizon', 'cibViadeo', 'cibViber', 'cibVim', 'cibVimeoV', 'cibVimeo', 'cibVine', 'cibVirb', 'cibVisa', 'cibVisualStudioCode', 'cibVisualStudio', 'cibVk', 'cibVlc', 'cibVsco', 'cibVueJs', 'cibWattpad', 'cibWeasyl', 'cibWebcomponentsOrg', 'cibWebpack', 'cibWebstorm', 'cibWechat', 'cibWhatsapp', 'cibWhenIWork', 'cibWii', 'cibWiiu', 'cibWikipedia', 'cibWindows', 'cibWire', 'cibWireguard', 'cibWix', 'cibWolframLanguage', 'cibWolframMathematica', 'cibWolfram', 'cibWordpress', 'cibWpengine', 'cibXPack', 'cibXbox', 'cibXcode', 'cibXero', 'cibXiaomi', 'cibXing', 'cibXrp', 'cibXsplit', 'cibYCombinator', 'cibYahoo', 'cibYammer', 'cibYandex', 'cibYarn', 'cibYelp', 'cibYoutube', 'cibZalando', 'cibZapier', 'cibZeit', 'cibZendesk', 'cibZerply', 'cibZillow', 'cibZingat', 'cibZoom', 'cibZorin', 'cibZulip'] - return ( - - {icons.map((i, idx) => { - return ( - -
- -
-
{i}
- ) - })} - - ) -} - -export const FlagsExample = () => { - const icons = ['cifAd', 'cifAe', 'cifAf', 'cifAg', 'cifAl', 'cifAm', 'cifAo', 'cifAr', 'cifAt', 'cifAu', 'cifAz', 'cifBa', 'cifBb', 'cifBd', 'cifBe', 'cifBf', 'cifBg', 'cifBh', 'cifBi', 'cifBj', 'cifBn', 'cifBo', 'cifBr', 'cifBs', 'cifBt', 'cifBw', 'cifBy', 'cifBz', 'cifCa', 'cifCd', 'cifCf', 'cifCg', 'cifCh', 'cifCi', 'cifCl', 'cifCm', 'cifCn', 'cifCo', 'cifCr', 'cifCu', 'cifCv', 'cifCy', 'cifCz', 'cifDe', 'cifDj', 'cifDk', 'cifDm', 'cifDo', 'cifDz', 'cifEc', 'cifEe', 'cifEg', 'cifEr', 'cifEs', 'cifEt', 'cifFi', 'cifFj', 'cifFm', 'cifFr', 'cifGa', 'cifGb', 'cifGd', 'cifGe', 'cifGh', 'cifGm', 'cifGn', 'cifGq', 'cifGr', 'cifGt', 'cifGw', 'cifGy', 'cifHk', 'cifHn', 'cifHr', 'cifHt', 'cifHu', 'cifId', 'cifIe', 'cifIl', 'cifIn', 'cifIq', 'cifIr', 'cifIs', 'cifIt', 'cifJm', 'cifJo', 'cifJp', 'cifKe', 'cifKg', 'cifKh', 'cifKi', 'cifKm', 'cifKn', 'cifKp', 'cifKr', 'cifKw', 'cifKz', 'cifLa', 'cifLb', 'cifLc', 'cifLi', 'cifLk', 'cifLr', 'cifLs', 'cifLt', 'cifLu', 'cifLv', 'cifLy', 'cifMa', 'cifMc', 'cifMd', 'cifMe', 'cifMg', 'cifMh', 'cifMk', 'cifMl', 'cifMm', 'cifMn', 'cifMr', 'cifMt', 'cifMu', 'cifMv', 'cifMw', 'cifMx', 'cifMy', 'cifMz', 'cifNa', 'cifNe', 'cifNg', 'cifNi', 'cifNl', 'cifNo', 'cifNp', 'cifNr', 'cifNu', 'cifNz', 'cifOm', 'cifPa', 'cifPe', 'cifPg', 'cifPh', 'cifPk', 'cifPl', 'cifPt', 'cifPw', 'cifPy', 'cifQa', 'cifRo', 'cifRs', 'cifRu', 'cifRw', 'cifSa', 'cifSb', 'cifSc', 'cifSd', 'cifSe', 'cifSg', 'cifSi', 'cifSk', 'cifSl', 'cifSm', 'cifSn', 'cifSo', 'cifSr', 'cifSs', 'cifSt', 'cifSv', 'cifSy', 'cifSz', 'cifTd', 'cifTg', 'cifTh', 'cifTj', 'cifTl', 'cifTm', 'cifTn', 'cifTo', 'cifTr', 'cifTt', 'cifTv', 'cifTw', 'cifTz', 'cifUa', 'cifUg', 'cifUs', 'cifUy', 'cifUz', 'cifVa', 'cifVc', 'cifVe', 'cifVn', 'cifWs', 'cifXk', 'cifYe', 'cifZa', 'cifZm', 'cifZw'] - return ( - - {icons.map((i, idx) => { - return ( - -
- -
-
{i}
- ) - })} - - ) -} - -export const TabPanesExample = () => { - const [activeKey, setActiveKey] = useState(1) - return ( - <> - - - { - e.preventDefault() - setActiveKey(1) - }} - > - Linear - - - - { - e.preventDefault() - setActiveKey(2) - }} - > - Brand - - - - { - e.preventDefault() - setActiveKey(3) - }} - > - Flags - - - - - - {activeKey === 1 && } - - - {activeKey === 2 && } - - - {activeKey === 3 && } - - - - ) -} - - - -React Icons also provides a variety of customization options, such as the ability to change the size, color, and style of the icons, as well as the ability to add additional CSS classes to the icons. You can find more information on these customization options in the documentation. - -## Premium icons - -If you find yourself in need of a greater selection of icons, we've got you covered with our [premium icon pack](https://coreui.io/icons/all/). This incredible package boasts an extensive collection of over 4,000 meticulously crafted icons, ensuring that you'll find the perfect representation for any concept or idea. Explore the vast range of options and unlock a world of visual possibilities. - -So if you need more icons our PRO package will be a great choice for you. - -## API - -### CIcon - -`markdown:CIcon.api.mdx` - -### CIconSvg - -`markdown:CIconSvg.api.mdx` \ No newline at end of file diff --git a/packages/docs/content/components/image/api.mdx b/packages/docs/content/components/image/api.mdx deleted file mode 100644 index 816292ef..00000000 --- a/packages/docs/content/components/image/api.mdx +++ /dev/null @@ -1,12 +0,0 @@ ---- -title: React Image Component API -name: Image API -description: Explore the API reference for the React Image component and discover how to effectively utilize its props for customization. -route: /components/image/ ---- - -import CImageAPI from '../../api/CImage.api.mdx' - -## CImage - - diff --git a/packages/docs/content/components/image/bootstrap.mdx b/packages/docs/content/components/image/bootstrap.mdx deleted file mode 100644 index e9d09fec..00000000 --- a/packages/docs/content/components/image/bootstrap.mdx +++ /dev/null @@ -1,35 +0,0 @@ ---- -title: React Bootstrap Image Component -name: Image with Bootstrap Styling -description: Learn how to use the React Bootstrap Image component from CoreUI to create responsive, aligned, and styled images using Bootstrap-friendly utilities and props. -route: /components/image/ -bootstrap_component: true ---- - -## Responsive React Bootstrap Images - -The React Bootstrap Image component supports responsive behavior using the `fluid` prop. This applies `max-width: 100%` and `height: auto` to ensure images scale with their parent container. - - - -## React Bootstrap Image thumbnails - -Use the `thumbnail` prop to give an image a subtle border and padding, resulting in a thumbnail-style appearance. You can combine it with [border-radius utilities](https://coreui.io/bootstrap/docs/utilities/borders) for rounded corners. - - - -## Aligning React Bootstrap Images - -Use the `align` prop to control image alignment within the container. This allows you to float images left, right, or center them using Bootstrap-aligned values. - - - - - - - -## API reference - -Explore all available props and customization options for the React Bootstrap Image component below: - -- [<CImage />](../api/#cimage) diff --git a/packages/docs/content/components/image/examples/ImageAligningExample.tsx b/packages/docs/content/components/image/examples/ImageAligningExample.tsx deleted file mode 100644 index 3e0ce6bd..00000000 --- a/packages/docs/content/components/image/examples/ImageAligningExample.tsx +++ /dev/null @@ -1,12 +0,0 @@ -import React from 'react' -import { withPrefix } from 'gatsby' -import { CImage } from '@coreui/react' - -export const ImageAligningExample = () => { - return ( -
- - -
- ) -} diff --git a/packages/docs/content/components/image/examples/ImageThumbnailExample.tsx b/packages/docs/content/components/image/examples/ImageThumbnailExample.tsx deleted file mode 100644 index 1e40391b..00000000 --- a/packages/docs/content/components/image/examples/ImageThumbnailExample.tsx +++ /dev/null @@ -1,7 +0,0 @@ -import React from 'react' -import { withPrefix } from 'gatsby' -import { CImage } from '@coreui/react' - -export const ImageThumbnailExample = () => { - return -} diff --git a/packages/docs/content/components/image/index.mdx b/packages/docs/content/components/image/index.mdx deleted file mode 100644 index 4a8b5d25..00000000 --- a/packages/docs/content/components/image/index.mdx +++ /dev/null @@ -1,35 +0,0 @@ ---- -title: React Image Component -name: Image -description: React image component with responsive behavior (so it's never become larger than their parent element) and special styles. -route: /components/image/ -other_frameworks: image ---- - -## Responsive images - -Images in CoreUI for React.js are made responsive with `fluid` property. This applies `max-width: 100%;` and `height: auto;` to the image so that it scales with the parent element. - - - -## Image thumbnails - -In addition to our [border-radius utilities](https://coreui.io/bootstrap/docs/utilities/borders), you can use prop`thumbnail` to give an image a rounded 1px border appearance. - - - -## Aligning images - -Align images with the `align` property. - - - - - - - -## API - -Check out the documentation below for a comprehensive guide to all the props you can use with the components mentioned here. - -- [<CImage />](./api/#cimage) \ No newline at end of file diff --git a/packages/docs/content/components/list-group/api.mdx b/packages/docs/content/components/list-group/api.mdx deleted file mode 100644 index ba8b36e6..00000000 --- a/packages/docs/content/components/list-group/api.mdx +++ /dev/null @@ -1,17 +0,0 @@ ---- -title: React List Group Component API -name: List Group API -description: Explore the API reference for the React List Group component and discover how to effectively utilize its props for customization. -route: /components/list-group/ ---- - -import CListGroupAPI from '../../api/CListGroup.api.mdx' -import CListGroupItemAPI from '../../api/CListGroupItem.api.mdx' - -## CListGroup - - - -## CListGroupItem - - diff --git a/packages/docs/content/components/list-group/bootstrap.mdx b/packages/docs/content/components/list-group/bootstrap.mdx deleted file mode 100644 index 7632d5be..00000000 --- a/packages/docs/content/components/list-group/bootstrap.mdx +++ /dev/null @@ -1,82 +0,0 @@ ---- -title: React Bootstrap List Group Component -name: List Group with Bootstrap Styling -description: Learn how to use the React Bootstrap List Group component from CoreUI to display flexible and interactive lists with badges, buttons, contextual styles, and more. -route: /components/list-group/ -bootstrap_component: true ---- - -## Basic usage of React Bootstrap List Group - -The React Bootstrap List Group component allows you to display a list of content using Bootstrap-styled list items. The default setup uses an unordered list with proper classes. - - - -## Active items - -Add the `active` prop to a `` to visually mark it as the selected item. - - - -## Disabled items - -Use the `disabled` prop to disable interaction with a list item. - - - -## List group as links or buttons - -You can use `` or ` - -
-

React Modal body text goes here.

-
-
- - -
- - - - - -```jsx - - - React Modal title - - -

React Modal body text goes here.

- - - Close - Save changes - - -``` - -### Live demo - - - -### Static backdrop - - - -### Scrolling long content - - - - - -### Vertically centered modals - - - - -### Tooltips and popovers in modals - - - -### Toggle between modals - - - -### Change modal animation - -Use Sass variables like `$modal-fade-transform` and `$modal-show-transform` to customize animation. For example: - -```scss -$modal-fade-transform: scale(0.8); -``` - -### Remove modal animation - -Disable animation with: - -```jsx -... -``` - -### Accessibility tips - -Use `aria-labelledby` and `aria-describedby` on `` for improved screen reader support. CoreUI adds required roles and aria attributes automatically. - -## React Bootstrap Modal sizes - -Modals come in predefined sizes via the `size` prop. - -| Size | Prop | Max width | -|-------------|----------|-----------| -| Small | `'sm'` | 300px | -| Default | — | 500px | -| Large | `'lg'` | 800px | -| Extra large | `'xl'` | 1140px | - - - -## Fullscreen React Bootstrap Modals - -Use the `fullscreen` prop to make modals expand to full viewport width/height. You can apply it conditionally based on breakpoints. - -| Fullscreen prop | Breakpoint | -|------------------|--------------------| -| `true` | Always | -| `'sm'` | Below 576px | -| `'md'` | Below 768px | -| `'lg'` | Below 992px | -| `'xl'` | Below 1200px | -| `'xxl'` | Below 1400px | - - - -## API reference - -Explore the API for the React Bootstrap Modal component and its related parts: - -- [<CModal />](../api/#cmodal) -- [<CModalBody />](../api/#cmodalbody) -- [<CModalFooter />](../api/#cmodalfooter) -- [<CModalHeader />](../api/#cmodalheader) -- [<CModalTitle />](../api/#cmodaltitle) \ No newline at end of file diff --git a/packages/docs/content/components/navbar/api.mdx b/packages/docs/content/components/navbar/api.mdx deleted file mode 100644 index 5170c089..00000000 --- a/packages/docs/content/components/navbar/api.mdx +++ /dev/null @@ -1,32 +0,0 @@ ---- -title: React Navbar Component API -name: Navbar API -description: Explore the API reference for the React Navbar component and discover how to effectively utilize its props for customization. -route: /components/navbar/ ---- - -import CNavbarAPI from '../../api/CNavbar.api.mdx' -import CNavbarBrandAPI from '../../api/CNavbarBrand.api.mdx' -import CNavbarNavAPI from '../../api/CNavbarNav.api.mdx' -import CNavbarTextAPI from '../../api/CNavbarText.api.mdx' -import CNavbarTogglerAPI from '../../api/CNavbarToggler.api.mdx' - -## CNavbar - - - -## CNavbarBrand - - - -## CNavbarNav - - - -## CNavbarText - - - -## CNavbarToggler - - diff --git a/packages/docs/content/components/navbar/bootstrap.mdx b/packages/docs/content/components/navbar/bootstrap.mdx deleted file mode 100644 index 7d383817..00000000 --- a/packages/docs/content/components/navbar/bootstrap.mdx +++ /dev/null @@ -1,105 +0,0 @@ ---- -title: React Bootstrap Navbar Component -name: Navbar with Bootstrap Styling -description: Learn how to use the React Bootstrap Navbar component from CoreUI to create responsive navigation headers with branding, dropdowns, collapsible content, and placement options. -route: /components/navbar/ -bootstrap_component: true ---- - -## Supported subcomponents in React Bootstrap Navbar - -The React Bootstrap Navbar component includes flexible subcomponents for building responsive headers: - -- `` – branding/logo. -- `` – navigation links and dropdowns. -- `` – toggles content collapse. -- `` – inline text. -- `` – groups and hides navbar content. - -## Basic usage of React Bootstrap Navbar - - - -### Branding - -Use `` to display your brand name or logo. - - - - - -### Navigation links and dropdowns - -Navigation inside the React Bootstrap Navbar uses ``. - - - - - -### Forms in navbars - -Include inputs, buttons, or entire forms in your navbar layout. - - - - - - -### Text in navbars - -Use `` for inline text blocks. - - - -## React Bootstrap Navbar color schemes - -Use `colorScheme="light"` or `colorScheme="dark"` combined with `.bg-*` utilities for full control of background and text colors. - - - -## Containers - -Wrap your navbar in a `` to center its content or apply spacing. - - - - -## Navbar placement - -Use the `placement` prop to fix navbars to the top or bottom or make them sticky. - - - - - - -## Responsive behaviors in React Bootstrap Navbar - -Use `expand` prop to control when the navbar collapses: - - - - - -### External content - -You can toggle external containers using collapse plugins. - - - -### Offcanvas navbars - -Turn the responsive navbar into an offcanvas drawer with `expand="*"` or `expand="xxl"`. - - - - -## API reference - -Explore the full API for React Bootstrap Navbar components: - -- [<CNavbar />](../api/#cnavbar) -- [<CNavbarBrand />](../api/#cnavbarbrand) -- [<CNavbarNav />](../api/#cnavbarnav) -- [<CNavbarText />](../api/#cnavbartext) -- [<CNavbarToggler />](../api/#cnavbartoggler) diff --git a/packages/docs/content/components/navbar/index.mdx b/packages/docs/content/components/navbar/index.mdx deleted file mode 100644 index 6356d37c..00000000 --- a/packages/docs/content/components/navbar/index.mdx +++ /dev/null @@ -1,154 +0,0 @@ ---- -title: React Navbar Component -name: Navbar -description: Documentation and examples for the React navbar powerful, responsive navigation header component. Includes support for branding, links, dropdowns, and more. -route: /components/navbar/ -other_frameworks: navbar ---- - -## Supported content - -`` come with built-in support for a handful of sub-components. Choose from the following as needed: - -- `` for your company, product, or project name. -- `` for a full-height and lightweight navigation (including support for dropdowns). -- `` for use with our collapse plugin and other [navigation toggling](#responsive-behaviors) behaviors. -- Flex and spacing utilities for any form controls and actions. -- `` for adding vertically centered strings of text. -- `` for grouping and hiding navbar contents by a parent breakpoint. - -Here's an example of all the sub-components included in a responsive light-themed navbar that automatically collapses at the `lg` (large) breakpoint. - -## Basic usage - - - -### Brand - -The `` can be applied to most elements, but an anchor works best, as some elements might require utility classes or custom styles. - - - -Adding images to the `` will likely always require custom styles or utilities to properly size. Here are some examples to demonstrate. - - - - - -### Nav - -`` navigation is based on ``. **Navigation in navbars will also grow to occupy as much horizontal space as possible** to keep your navbar contents securely aligned. - - - -And because we use classes for our navs, you can avoid the list-based approach entirely if you like. - - - -You can also use dropdowns in your navbar. Please note that `` component requires `variant="nav-item"`. - - - -### Forms - -Place various form controls and components within a navbar: - - - -Immediate child elements of `` use flex layout and will default to `justify-content: space-between`. Use additional [flex utilities](https://coreui.io/bootstrap/docs/utilities/flex/) as needed to adjust this behavior. - - - -Input groups work, too. If your navbar is an entire form, or mostly a form, you can use the `` element as the container and save some HTML. - - - -Various buttons are supported as part of these navbar forms, too. This is also a great reminder that vertical alignment utilities can be used to align different sized elements. - - - -### Text - -Navbars may contain bits of text with the help of ``. This class adjusts vertical alignment and horizontal spacing for strings of text. - - - -## Color schemes - -Theming the navbar has never been easier thanks to the combination of theming classes and `background-color` utilities. Set `colorScheme="light"` for use with light background colors, or `colorScheme="dark"` for dark background colors. Then, customize with `.bg-*` utilities. - - - -## Containers - -Although it's not required, you can wrap a `` in a `` to center it on a page–though note that an inner container is still required. Or you can add a container inside the `` to only center the contents of a [fixed or static top navbar](#placement). - - - -Use any of the responsive containers to change how wide the content in your navbar is presented. - - - -## Placement - -Use our `placement` properly to place navbars in non-static positions. Choose from fixed to the top, fixed to the bottom, or stickied to the top (scrolls with the page until it reaches the top, then stays there). Fixed navbars use `position: fixed`, meaning they're pulled from the normal flow of the DOM and may require custom CSS (e.g., `padding-top` on the ``) to prevent overlap with other elements. - -Also note that **`.sticky-top` uses `position: sticky`, which [isn't fully supported in every browser](https://caniuse.com/css-sticky)**. - - - - - - - - - -## Responsive behaviors - -Navbars can use ``, ``, and `expand="{sm|md|lg|xl|xxl}"` property to determine when their content collapses behind a button. In combination with other utilities, you can easily choose when to show or hide particular elements. - -For navbars that never collapse, add the `expand` boolean property on the ``. For navbars that always collapse, don't add any property. - -### Toggler - -Navbar togglers are left-aligned by default, but should they follow a sibling element like a ``, they'll automatically be aligned to the far right. Reversing your markup will reverse the placement of the toggler. Below are examples of different toggle styles. - -With no `` shown at the smallest breakpoint: - - - -With a brand name shown on the left and toggler on the right: - - - -With a toggler on the left and brand name on the right: - - - -### External content - -Sometimes you want to use the collapse plugin to trigger a container element for content that structurally sits outside of the ``. - - - -### Offcanvas - -Transform your expanding and collapsing navbar into an offcanvas drawer with the offcanvas plugin. We extend both the offcanvas default styles and use our `expand="*"` prop to create a dynamic and flexible navigation sidebar. - -In the example below, to create an offcanvas navbar that is always collapsed across all breakpoints, omit the `expand="*"` prop entirely. - - - -To create an offcanvas navbar that expands into a normal navbar at a specific breakpoint like `xxl`, use `expand="xxl"` property. - - - -## API - -Check out the documentation below for a comprehensive guide to all the props you can use with the components mentioned here. - -- [<CNavbar />](./api/#cnavbar) -- [<CNavbarBrand />](./api/#cnavbarbrand) -- [<CNavbarNav />](./api/#cnavbarnav) -- [<CNavbarText />](./api/#cnavbartext) -- [<CNavbarToggler />](./api/#cnavbartoggler) \ No newline at end of file diff --git a/packages/docs/content/components/navs-tabs/api.mdx b/packages/docs/content/components/navs-tabs/api.mdx deleted file mode 100644 index 4c78c048..00000000 --- a/packages/docs/content/components/navs-tabs/api.mdx +++ /dev/null @@ -1,32 +0,0 @@ ---- -title: React Navs & Tabs Components API -name: Navs & Tabs API -description: Explore the API reference for the React Navs & Tabs components and discover how to effectively utilize its props for customization. -route: /components/navs-tabs/ ---- - -import CNavAPI from '../../api/CNav.api.mdx' -import CNavItemAPI from '../../api/CNavItem.api.mdx' -import CNavLinkAPI from '../../api/CNavLink.api.mdx' -import CTabContentAPI from '../../api/CTabContent.api.mdx' -import CTabPaneAPI from '../../api/CTabPane.api.mdx' - -## CNav - - - -## CNavItem - - - -## CNavLink - - - -## CTabContent - - - -## CTabPane - - diff --git a/packages/docs/content/components/navs-tabs/bootstrap.mdx b/packages/docs/content/components/navs-tabs/bootstrap.mdx deleted file mode 100644 index 655db31b..00000000 --- a/packages/docs/content/components/navs-tabs/bootstrap.mdx +++ /dev/null @@ -1,102 +0,0 @@ ---- -title: React Bootstrap Navs and Tabs Component -name: Navs and Tabs with Bootstrap Styling -description: Learn how to use the React Bootstrap Navs and Tabs component from CoreUI to build navigations, tabbed interfaces, dropdowns, and more with responsive and accessible markup. -route: /components/navs-tabs/ -bootstrap_component: true ---- - -## React Bootstrap Base Nav - -The React Bootstrap Navs and Tabs component provides a flexible base for building navigations. The `` component is built with flexbox and supports active, disabled, tabbed, and pill-styled variations. - - - -You can structure navigation with `