Default slot
"`; 4 | 5 | exports[`Loads and display CCardText component renders correctly 1`] = `"Default slot
"`; 6 | -------------------------------------------------------------------------------- /packages/coreui-vue/src/components/offcanvas/COffcanvasBody.ts: -------------------------------------------------------------------------------- 1 | import { defineComponent, h } from 'vue' 2 | 3 | const COffcanvasBody = defineComponent({ 4 | name: 'COffcanvasBody', 5 | setup(_, { slots }) { 6 | return () => h('div', { class: 'offcanvas-body' }, slots.default && slots.default()) 7 | }, 8 | }) 9 | 10 | export { COffcanvasBody } 11 | -------------------------------------------------------------------------------- /packages/coreui-vue/src/components/card/__tests__/__snapshots__/CCard.spec.ts.snap: -------------------------------------------------------------------------------- 1 | // Jest Snapshot v1, https://goo.gl/fbAQLP 2 | 3 | exports[`Customize CCard component renders correctly 1`] = `"Default slot
"`;
4 |
5 | exports[`Loads and display CCard component renders correctly 1`] = `"Default slot
"`;
6 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/form/__tests__/__snapshots__/CFormText.spec.ts.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Customize CFormText component renders correctly 1`] = `"Default slot
"`; 4 | 5 | exports[`Loads and display CFormText component renders correctly 1`] = `"Default slot
"`;
6 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/sidebar/CSidebarToggler.ts:
--------------------------------------------------------------------------------
1 | import { defineComponent, h } from 'vue'
2 |
3 | const CSidebarToggler = defineComponent({
4 | name: 'CSidebarToggler',
5 | setup(_, { slots }) {
6 | return () => h('button', { class: 'sidebar-toggler' }, slots.default && slots.default())
7 | },
8 | })
9 |
10 | export { CSidebarToggler }
11 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/card/__tests__/__snapshots__/CCardTitle.spec.ts.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Customize CCardTitle component renders correctly 1`] = `"Default slot
"`; 4 | 5 | exports[`Loads and display CCardTitle component renders correctly 1`] = `"Default slot
"`; 6 | -------------------------------------------------------------------------------- /packages/coreui-vue/src/components/footer/__tests__/__snapshots__/CFooter.spec.ts.snap: -------------------------------------------------------------------------------- 1 | // Jest Snapshot v1, https://goo.gl/fbAQLP 2 | 3 | exports[`Customize CFooter component renders correctly 1`] = `""`; 4 | 5 | exports[`Loads and display CFooter component renders correctly 1`] = `""`; 6 | -------------------------------------------------------------------------------- /packages/coreui-vue/src/components/offcanvas/COffcanvasHeader.ts: -------------------------------------------------------------------------------- 1 | import { defineComponent, h } from 'vue' 2 | 3 | const COffcanvasHeader = defineComponent({ 4 | name: 'COffcanvasHeader', 5 | setup(_, { slots }) { 6 | return () => h('div', { class: 'offcanvas-header' }, slots.default && slots.default()) 7 | }, 8 | }) 9 | 10 | export { COffcanvasHeader } 11 | -------------------------------------------------------------------------------- /packages/coreui-vue/src/components/alert/CAlertLink.ts: -------------------------------------------------------------------------------- 1 | import { defineComponent, h } from 'vue' 2 | 3 | export const CAlertLink = defineComponent({ 4 | name: 'CAlertLink', 5 | setup(_, { slots }) { 6 | return () => 7 | h( 8 | 'a', 9 | { 10 | class: 'alert-link', 11 | }, 12 | slots, 13 | ) 14 | }, 15 | }) 16 | -------------------------------------------------------------------------------- /packages/coreui-vue/src/components/modal/__tests__/__snapshots__/CModalTitle.spec.ts.snap: -------------------------------------------------------------------------------- 1 | // Jest Snapshot v1, https://goo.gl/fbAQLP 2 | 3 | exports[`Customize CModalTitle component renders correctly 1`] = `"Default slot
"`;
4 |
5 | exports[`Loads and display CModalTitle component renders correctly 1`] = `"Default slot
"`; 6 | -------------------------------------------------------------------------------- /packages/coreui-vue/src/components/table/__tests__/__snapshots__/CTableBody.spec.ts.snap: -------------------------------------------------------------------------------- 1 | // Jest Snapshot v1, https://goo.gl/fbAQLP 2 | 3 | exports[`Customize CTableBody component renders correctly 1`] = `"Default slot"`; 4 | 5 | exports[`Loads and display CTableBody component renders correctly 1`] = `"Default slot"`; 6 | -------------------------------------------------------------------------------- /packages/coreui-vue/src/components/table/__tests__/__snapshots__/CTableFoot.spec.ts.snap: -------------------------------------------------------------------------------- 1 | // Jest Snapshot v1, https://goo.gl/fbAQLP 2 | 3 | exports[`Customize CTableFoot component renders correctly 1`] = `"Default slot"`; 4 | 5 | exports[`Loads and display CTableFoot component renders correctly 1`] = `"Default slot"`; 6 | -------------------------------------------------------------------------------- /packages/coreui-vue/src/components/table/__tests__/__snapshots__/CTableHead.spec.ts.snap: -------------------------------------------------------------------------------- 1 | // Jest Snapshot v1, https://goo.gl/fbAQLP 2 | 3 | exports[`Customize CTableHead component renders correctly 1`] = `"Default slot"`; 4 | 5 | exports[`Loads and display CTableHead component renders correctly 1`] = `"Default slot"`; 6 | -------------------------------------------------------------------------------- /packages/coreui-vue/src/utils/isRTL.ts: -------------------------------------------------------------------------------- 1 | const isRTL = (element?: HTMLElement | HTMLDivElement | null) => { 2 | if (typeof document !== 'undefined' && document.documentElement.dir === 'rtl') { 3 | return true 4 | } 5 | 6 | if (element) { 7 | return element.closest('[dir="rtl"]') !== null 8 | } 9 | 10 | return false 11 | } 12 | 13 | export default isRTL 14 | -------------------------------------------------------------------------------- /packages/coreui-vue/src/components/callout/__tests__/__snapshots__/CCallout.spec.ts.snap: -------------------------------------------------------------------------------- 1 | // Jest Snapshot v1, https://goo.gl/fbAQLP 2 | 3 | exports[`Customize CCallout component renders correctly 1`] = `"Default slot
"`;
4 |
5 | exports[`Loads and display CCallout component renders correctly 1`] = `"Default slot
"`;
6 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/card/__tests__/__snapshots__/CCardHeader.spec.ts.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Customize CCardHeader component renders correctly 1`] = `"Default slot"`;
4 |
5 | exports[`Loads and display CCardHeader component renders correctly 1`] = `"Default slot
"`;
6 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/form/__tests__/__snapshots__/CFormLabel.spec.ts.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Customize CFormLabel component renders correctly 1`] = `""`;
4 |
5 | exports[`Loads and display CFormLabel component renders correctly 1`] = `""`;
6 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/grid/__tests__/__snapshots__/CRow.spec.ts.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Customize CRow component renders correctly 1`] = `"Default slot
"`;
4 |
5 | exports[`Loads and display CRow component renders correctly 1`] = `"Default slot
"`;
6 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/header/__tests__/__snapshots__/CHeaderBrand.spec.ts.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Customize CHeaderBrand component renders correctly 1`] = `"Default slot
"`;
4 |
5 | exports[`Loads and display CHeaderBrand component renders correctly 1`] = `"Default slot"`;
6 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/table/__tests__/__snapshots__/CTableHeaderCell.spec.ts.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Customize CTableHeaderCell component renders correctly 1`] = `"Default slot
"`; 4 | 5 | exports[`Loads and display CAlertHeading component renders correctly 1`] = `"Default slot
"`; 6 | -------------------------------------------------------------------------------- /packages/coreui-vue/src/components/card/__tests__/__snapshots__/CCardSubtitle.spec.ts.snap: -------------------------------------------------------------------------------- 1 | // Jest Snapshot v1, https://goo.gl/fbAQLP 2 | 3 | exports[`Customize CCardSubtitle component renders correctly 1`] = `"Default slot
"`; 4 | 5 | exports[`Loads and display CCardSubtitle component renders correctly 1`] = `"Default slot
"`; 6 | -------------------------------------------------------------------------------- /packages/coreui-vue/src/components/table/__tests__/__snapshots__/CTableRow.spec.ts.snap: -------------------------------------------------------------------------------- 1 | // Jest Snapshot v1, https://goo.gl/fbAQLP 2 | 3 | exports[`Customize CTableRow component renders correctly 1`] = `"Default slot
"`;
4 |
5 | exports[`Loads and display CCol component renders correctly 1`] = `"Default slot
"`;
6 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/form/__tests__/__snapshots__/CInputGroup.spec.ts.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Customize CInputGroup component renders correctly 1`] = `"Default slot
"`;
4 |
5 | exports[`Loads and display CInputGroup component renders correctly 1`] = `"Default slot
"`;
6 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/nav/__tests__/__snapshots__/CNav.spec.ts.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Customize CNav component renders correctly 1`] = `""`;
4 |
5 | exports[`Loads and display CNav component renders correctly 1`] = `""`;
6 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/carousel/__tests__/__snapshots__/CCarouselItem.spec.ts.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Customize CCarouselItem component renders correctly 1`] = `"Default slot
"`;
4 |
5 | exports[`Loads and display CCarouselItem component renders correctly 1`] = `"Default slot
"`;
6 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/dropdown/__tests__/__snapshots__/CDropdownHeader.spec.ts.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Customize CDropdownHeader component renders correctly 1`] = `"Default slot
"`; 4 | 5 | exports[`Loads and display CDropdownHeader component renders correctly 1`] = `"Default slot
"`; 6 | -------------------------------------------------------------------------------- /packages/coreui-vue/src/components/form/__tests__/__snapshots__/CInputGroupText.spec.ts.snap: -------------------------------------------------------------------------------- 1 | // Jest Snapshot v1, https://goo.gl/fbAQLP 2 | 3 | exports[`Customize CInputGroupText component renders correctly 1`] = `"Default slot
"`;
4 |
5 | exports[`Loads and display CInputGroupText component renders correctly 1`] = `"Default slot"`;
6 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/offcanvas/__tests__/__snapshots__/COffcanvasTitle.spec.ts.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Customize COffcanvasTitle component renders correctly 1`] = `"Default slot
"`;
4 |
5 | exports[`Loads and display COffcanvasTitle component renders correctly 1`] = `"Default slot
"`; 6 | -------------------------------------------------------------------------------- /packages/coreui-vue/src/components/table/__tests__/__snapshots__/CTableDataCell.spec.ts.snap: -------------------------------------------------------------------------------- 1 | // Jest Snapshot v1, https://goo.gl/fbAQLP 2 | 3 | exports[`Customize CTableDataCell component renders correctly 1`] = `"Default slot
"`;
4 |
5 | exports[`Loads and display CButtonGroup component renders correctly 1`] = `"Default slot
"`;
6 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/grid/__tests__/__snapshots__/CContainer.spec.ts.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Customize CContainer component renders correctly 1`] = `"Default slot
"`;
4 |
5 | exports[`Loads and display CContainer component renders correctly 1`] = `"Default slot
"`;
6 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/conditional-teleport/index.ts:
--------------------------------------------------------------------------------
1 | import { App } from 'vue'
2 | import { CConditionalTeleport } from './CConditionalTeleport'
3 |
4 | const CConditionalTeleportPlugin = {
5 | install: (app: App): void => {
6 | app.component(CConditionalTeleport.name as string, CConditionalTeleport)
7 | },
8 | }
9 |
10 | export { CConditionalTeleport, CConditionalTeleportPlugin }
11 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/header/__tests__/__snapshots__/CHeaderNav.spec.ts.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Customize CHeaderNav component renders correctly 1`] = `""`;
4 |
5 | exports[`Loads and display CHeaderNav component renders correctly 1`] = `""`;
6 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/nav/__tests__/__snapshots__/CNavLink.spec.ts.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Customize CNavLink component renders correctly 1`] = `"Default slot
"`;
4 |
5 | exports[`Loads and display CNavLink component renders correctly 1`] = `"Default slot"`;
6 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/navbar/__tests__/__snapshots__/CNavbarNav.spec.ts.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Customize CNavbarNav component renders correctly 1`] = `""`;
4 |
5 | exports[`Loads and display CNavbarNav component renders correctly 1`] = `""`;
6 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/form/__tests__/__snapshots__/CFormRange.spec.ts.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Customize CFormRange component renders correctly 1`] = `""`;
4 |
5 | exports[`Loads and display CFormRange component renders correctly 1`] = `""`;
6 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/list-group/__tests__/__snapshots__/CListGroup.spec.ts.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Customize CListGroup component renders correctly 1`] = `"Default slot
"`;
4 |
5 | exports[`Loads and display CListGroup component renders correctly 1`] = `"- Default slot
Default slot
"`;
4 |
5 | exports[`Loads and display CToaster component renders correctly 1`] = `"Default slot
"`;
6 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/dropdown/__tests__/__snapshots__/CDropdownMenu.spec.ts.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Customize CDropdownMenu component renders correctly 1`] = `
4 | "
5 | "
6 | `;
7 |
8 | exports[`Loads and display CDropdownMenu component renders correctly 1`] = `
9 | "
10 | "
11 | `;
12 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/link/__tests__/__snapshots__/CLink.spec.ts.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Customize CLink component renders correctly 1`] = `"Default slot
"`;
4 |
5 | exports[`Loads and display CLink component renders correctly 1`] = `"Default slot"`;
6 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/form/__tests__/__snapshots__/CFormSelect.spec.ts.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Customize CFormSelect component renders correctly 1`] = `""`;
4 |
5 | exports[`Loads and display CFormSelect component renders correctly 1`] = `""`;
6 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/header/__tests__/__snapshots__/CHeader.spec.ts.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Customize CHeader component renders correctly 1`] = `
4 | "
5 |
"
7 | `;
8 |
9 | exports[`Loads and display CHeader component renders correctly 1`] = `"Default slot
6 | Default slot
"`;
10 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/navbar/__tests__/__snapshots__/CNavbarToggler.spec.ts.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Customize CNavbarToggler component renders correctly 1`] = `""`;
4 |
5 | exports[`Loads and display CNavbarToggler component renders correctly 1`] = `""`;
6 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/toast/__tests__/__snapshots__/CToastClose.spec.ts.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Customize CToastClose component renders correctly 1`] = `""`;
4 |
5 | exports[`Loads and display CToastClose component renders correctly 1`] = `""`;
6 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/badge/__tests__/__snapshots__/CBadge.spec.ts.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Loads and display CBadge component renders correctly 1`] = `
4 |
7 | `;
8 |
9 | exports[`Loads and display CBadge component renders correctly with slot 1`] = `
10 |
13 | Hello World!
14 |
15 | `;
16 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/dropdown/__tests__/__snapshots__/CDropdownItem.spec.ts.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Customize CDropdownItem component renders correctly 1`] = `"Default slot
"`;
4 |
5 | exports[`Loads and display CDropdownItem component renders correctly 1`] = `"Default slot"`;
6 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/form/CFormFloating.ts:
--------------------------------------------------------------------------------
1 | import { defineComponent, h } from 'vue'
2 |
3 | const CFormFloating = defineComponent({
4 | name: 'CFormFloating',
5 | setup(_, { slots }) {
6 | return () =>
7 | h(
8 | 'div',
9 | {
10 | class: 'form-floating',
11 | },
12 | slots.default && slots.default(),
13 | )
14 | },
15 | })
16 |
17 | export { CFormFloating }
18 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/accordion/__tests__/__snapshots__/CAccordionBody.spec.ts.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Loads and display CAccordionBody component renders correctly 1`] = `
4 | "
6 |
8 | Default slot
7 | Default slot
6 |
5 |
"
10 | `;
11 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/close-button/__tests__/__snapshots__/CCloseButton.spec.ts.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Customize CCloseButton component renders correctly 1`] = `""`;
4 |
5 | exports[`Loads and display CCloseButton component renders correctly 1`] = `""`;
6 |
--------------------------------------------------------------------------------
/packages/docs/.vuepress/src/client/components/Callout.vue:
--------------------------------------------------------------------------------
1 |
14 |
15 |
16 |
6 |
9 | title
7 | value
chartdefault
8 |
17 |
20 |
21 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/breadcrumb/index.ts:
--------------------------------------------------------------------------------
1 | import { App } from 'vue'
2 | import { CBreadcrumbItem } from './CBreadcrumbItem'
3 | import { CBreadcrumb } from './CBreadcrumb'
4 |
5 | const CBreadcrumbPlugin = {
6 | install: (app: App): void => {
7 | app.component(CBreadcrumb.name as string, CBreadcrumb)
8 | app.component(CBreadcrumbItem.name as string, CBreadcrumbItem)
9 | },
10 | }
11 |
12 | export { CBreadcrumbPlugin, CBreadcrumb, CBreadcrumbItem }
13 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/pagination/index.ts:
--------------------------------------------------------------------------------
1 | import { App } from 'vue'
2 | import { CPagination } from './CPagination'
3 | import { CPaginationItem } from './CPaginationItem'
4 |
5 | const CPaginationPlugin = {
6 | install: (app: App): void => {
7 | app.component(CPagination.name as string, CPagination)
8 | app.component(CPaginationItem.name as string, CPaginationItem)
9 | },
10 | }
11 |
12 | export { CPaginationPlugin, CPagination, CPaginationItem }
13 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/button-group/index.ts:
--------------------------------------------------------------------------------
1 | import { App } from 'vue'
2 | import { CButtonToolbar } from './CButtonToolbar'
3 | import { CButtonGroup } from './CButtonGroup'
4 |
5 | const CButtonGroupPlugin = {
6 | install: (app: App): void => {
7 | app.component(CButtonToolbar.name as string, CButtonToolbar)
8 | app.component(CButtonGroup.name as string, CButtonGroup)
9 | },
10 | }
11 |
12 | export { CButtonGroupPlugin, CButtonToolbar, CButtonGroup }
13 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/utils/isInViewport.ts:
--------------------------------------------------------------------------------
1 | const isInViewport = (element: HTMLElement) => {
2 | const rect = element.getBoundingClientRect()
3 | return (
4 | Math.floor(rect.top) >= 0 &&
5 | Math.floor(rect.left) >= 0 &&
6 | Math.floor(rect.bottom) <= (window.innerHeight || document.documentElement.clientHeight) &&
7 | Math.floor(rect.right) <= (window.innerWidth || document.documentElement.clientWidth)
8 | )
9 | }
10 |
11 | export default isInViewport
12 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/grid/index.ts:
--------------------------------------------------------------------------------
1 | import { App } from 'vue'
2 | import { CCol } from './CCol'
3 | import { CContainer } from './CContainer'
4 | import { CRow } from './CRow'
5 |
6 | const CGridPlugin = {
7 | install: (app: App): void => {
8 | app.component(CCol.name as string, CCol)
9 | app.component(CContainer.name as string, CContainer)
10 | app.component(CRow.name as string, CRow)
11 | },
12 | }
13 | export { CGridPlugin, CCol, CContainer, CRow }
14 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/navbar/__tests__/__snapshots__/CNavbar.spec.ts.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Customize CNavbar component renders correctly 1`] = `
4 | ""
7 | `;
8 |
9 | exports[`Loads and display CNavbar component renders correctly 1`] = `""`;
10 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/progress/__tests__/__snapshots__/CProgressBar.spec.ts.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Customize CProgressBar component renders correctly 1`] = `""`;
4 |
5 | exports[`Loads and display CProgressBar component renders correctly 1`] = `""`;
6 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/toast/__tests__/__snapshots__/CToastHeader.spec.ts.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Customize CToastHeader component renders correctly 1`] = `"{{ props.title }}
18 |Default slot
"`;
4 |
5 | exports[`Loads and display CToastHeader component renders correctly 1`] = `
6 | "Default slot
7 |
8 |
"
9 | `;
10 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/dropdown/__tests__/__snapshots__/CDropdown.spec.ts.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Customize (variant number two) CDropdown component renders correctly 1`] = `"Default slot"`;
4 |
5 | exports[`Customize CDropdown component renders correctly 1`] = `""`;
6 |
7 | exports[`Loads and display CDropdown component renders correctly 1`] = `"Default slot
"`;
8 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/navbar/CNavbarToggler.ts:
--------------------------------------------------------------------------------
1 | import { defineComponent, h } from 'vue'
2 |
3 | const CNavbarToggler = defineComponent({
4 | name: 'CNavbarToggler',
5 | setup(_, { slots }) {
6 | return () =>
7 | h(
8 | 'button',
9 | {
10 | class: 'navbar-toggler',
11 | },
12 | slots.default ? slots.default() : h('span', { class: ['navbar-toggler-icon'] }),
13 | )
14 | },
15 | })
16 |
17 | export { CNavbarToggler }
18 |
--------------------------------------------------------------------------------
/packages/docs/.vuepress/src/client/styles/_footer.scss:
--------------------------------------------------------------------------------
1 | @use "@coreui/coreui/scss/vendor/rfs" as *;
2 | @use "@coreui/coreui/scss/variables" as *;
3 |
4 | //
5 | // Footer
6 | //
7 |
8 | .footer {
9 | --cui-footer-bg: var(--cui-tertiary-bg);
10 | @include font-size(.875rem);
11 |
12 | a {
13 | color: var(--#{$prefix}secondary-color);
14 | // text-decoration: none;
15 |
16 | &:hover,
17 | &:focus {
18 | color: var(--cui-link-hover-color);
19 | }
20 | }
21 | }
22 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/placeholder/__tests__/__snapshots__/CPlaceholder.spec.ts.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Loads and display CPlaceholder component renders correctly 1`] = `
4 |
7 | `;
8 |
9 | exports[`Loads and display CPlaceholder component renders correctly with slot 1`] = `
10 |
13 | Hello World!
14 |
15 | `;
16 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/spinner/__tests__/__snapshots__/CSpinner.spec.ts.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Customize CSpinner component renders correctly 1`] = `"visuallyHiddenLabel
"`; 4 | 5 | exports[`Loads and display CSpinner component renders correctly 1`] = `"Loading...
"`;
6 |
--------------------------------------------------------------------------------
/packages/docs/api/form/CInputGroup.api.md:
--------------------------------------------------------------------------------
1 | ### CInputGroup
2 |
3 | ```jsx
4 | import { CInputGroup } from '@coreui/vue'
5 | // or
6 | import CInputGroup from '@coreui/vue/src/components/form/CInputGroup'
7 | ```
8 |
9 | #### Props
10 |
11 | | Prop name | Description | Type | Values | Default |
12 | | --------- | ---------------------------------- | ------ | -------------- | ------- |
13 | | **size** | Size the component small or large. | string | `'sm'`, `'lg'` | - |
14 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/progress/CProgressStacked.ts:
--------------------------------------------------------------------------------
1 | import { defineComponent, h, provide } from 'vue'
2 |
3 | const CProgressStacked = defineComponent({
4 | name: 'CProgressStacked',
5 | props: {},
6 | setup(_, { slots }) {
7 | provide('stacked', true)
8 | return () =>
9 | h(
10 | 'div',
11 | {
12 | class: 'progress-stacked',
13 | },
14 | slots.default && slots.default(),
15 | )
16 | },
17 | })
18 |
19 | export { CProgressStacked }
20 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/widgets/__tests__/__snapshots__/CWidgetStatsA.spec.ts.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Loads and display CWidgetStatsA component renders correctly 1`] = `
4 | "
5 |
"
12 | `;
13 |
--------------------------------------------------------------------------------
/packages/docs/api/backdrop/CBackdrop.api.md:
--------------------------------------------------------------------------------
1 | ### CBackdrop
2 |
3 | ```jsx
4 | import { CBackdrop } from '@coreui/vue'
5 | // or
6 | import CBackdrop from '@coreui/vue/src/components/backdrop/CBackdrop'
7 | ```
8 |
9 | #### Props
10 |
11 | | Prop name | Description | Type | Values | Default |
12 | | ----------- | ----------------------------------------- | ------- | ------ | ------- |
13 | | **visible** | Toggle the visibility of modal component. | boolean | - | false |
14 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/header/__tests__/__snapshots__/CHeaderToggler.spec.ts.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Customize CHeaderToggler component renders correctly 1`] = `""`;
4 |
5 | exports[`Loads and display CHeaderToggler component renders correctly 1`] = `""`;
6 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/breadcrumb/CBreadcrumb.ts:
--------------------------------------------------------------------------------
1 | import { defineComponent, h } from 'vue'
2 |
3 | const CBreadcrumb = defineComponent({
4 | name: 'CBreadcrumb',
5 | inheritAttrs: false,
6 | setup(_, { slots, attrs }) {
7 | return () =>
8 | h(
9 | 'nav',
10 | {
11 | 'aria-label': 'breadcrumb',
12 | },
13 | h('ol', { class: ['breadcrumb', attrs.class] }, slots.default && slots.default()),
14 | )
15 | },
16 | })
17 |
18 | export { CBreadcrumb }
19 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/modal/__tests__/__snapshots__/CModalHeader.spec.ts.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Customize CModalHeader component renders correctly 1`] = `"Default slot"`;
4 |
5 | exports[`Loads and display CModalHeader component renders correctly 1`] = `"Default slot"`;
6 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/avatar/__tests__/__snapshots__/CAvatar.spec.ts.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Loads and display CAvatar component renders correctly 1`] = `
4 | "
6 |
chartDefault slot
11 |
7 |
action
10 | 75
8 | title
9 | Default slot
5 |
6 |
"
7 | `;
8 |
9 | exports[`Loads and display CAvatar component renders correctly 2`] = `"Default slot
"`; 4 | 5 | exports[`Customize CFormFeedback component renders correctly 1`] = `"Default slot
"`; 6 | 7 | exports[`Loads and display CFormFeedback component renders correctly 1`] = `"Default slot
"`;
8 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/navbar/__tests__/__snapshots__/CNavbarBrand.spec.ts.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Customize (two) CNavbarBrand component renders correctly 1`] = `"Default slot"`;
4 |
5 | exports[`Customize CNavbarBrand component renders correctly 1`] = `""`;
6 |
7 | exports[`Loads and display CNavbarBrand component renders correctly 1`] = `"Default slot"`;
8 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/alert/index.ts:
--------------------------------------------------------------------------------
1 | import { App } from 'vue'
2 | import { CAlert } from './CAlert'
3 | import { CAlertHeading } from './CAlertHeading'
4 | import { CAlertLink } from './CAlertLink'
5 |
6 | const CAlertPlugin = {
7 | install: (app: App): void => {
8 | app.component(CAlert.name as string, CAlert)
9 | app.component(CAlertHeading.name as string, CAlertHeading)
10 | app.component(CAlertLink.name as string, CAlertLink)
11 | },
12 | }
13 |
14 | export { CAlertPlugin, CAlert, CAlertHeading, CAlertLink }
15 |
--------------------------------------------------------------------------------
/packages/docs/api/modal/CModalHeader.api.md:
--------------------------------------------------------------------------------
1 | ### CModalHeader
2 |
3 | ```jsx
4 | import { CModalHeader } from '@coreui/vue'
5 | // or
6 | import CModalHeader from '@coreui/vue/src/components/modal/CModalHeader'
7 | ```
8 |
9 | #### Props
10 |
11 | | Prop name | Description | Type | Values | Default |
12 | | ---------------- | ------------------------------------------- | ------- | ------ | ------- |
13 | | **close-button** | Add a close button component to the header. | boolean | - | true |
14 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/utils/getRTLPlacement.ts:
--------------------------------------------------------------------------------
1 | import { Placement } from '@popperjs/core'
2 | import isRTL from './isRTL'
3 |
4 | const getRTLPlacement = (placement: string, element: HTMLDivElement | null): Placement => {
5 | switch (placement) {
6 | case 'right': {
7 | return isRTL(element) ? 'left' : 'right'
8 | }
9 | case 'left': {
10 | return isRTL(element) ? 'right' : 'left'
11 | }
12 | default: {
13 | return placement as Placement
14 | }
15 | }
16 | }
17 |
18 | export default getRTLPlacement
19 |
--------------------------------------------------------------------------------
/packages/docs/api/toast/CToastHeader.api.md:
--------------------------------------------------------------------------------
1 | ### CToastHeader
2 |
3 | ```jsx
4 | import { CToastHeader } from '@coreui/vue'
5 | // or
6 | import CToastHeader from '@coreui/vue/src/components/toast/CToastHeader'
7 | ```
8 |
9 | #### Props
10 |
11 | | Prop name | Description | Type | Values | Default |
12 | | ---------------- | ----------------------------------------------- | ------- | ------ | ------- |
13 | | **close-button** | Automatically add a close button to the header. | boolean | - | - |
14 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/card/CCardText.ts:
--------------------------------------------------------------------------------
1 | import { defineComponent, h } from 'vue'
2 |
3 | const CCardText = defineComponent({
4 | name: 'CCardText',
5 | props: {
6 | /**
7 | * Component used for the root node. Either a string to use a HTML element or a component.
8 | */
9 | as: {
10 | type: String,
11 | default: 'p',
12 | },
13 | },
14 | setup(props, { slots }) {
15 | return () => h(props.as, { class: 'card-text' }, slots.default && slots.default())
16 | },
17 | })
18 |
19 | export { CCardText }
20 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/form/CFormText.ts:
--------------------------------------------------------------------------------
1 | import { defineComponent, h } from 'vue'
2 |
3 | const CFormText = defineComponent({
4 | name: 'CFormText',
5 | props: {
6 | /**
7 | * Component used for the root node. Either a string to use a HTML element or a component.
8 | */
9 | as: {
10 | type: String,
11 | default: 'div',
12 | },
13 | },
14 | setup(props, { slots }) {
15 | return () => h(props.as, { class: 'form-text' }, slots.default && slots.default())
16 | },
17 | })
18 |
19 | export { CFormText }
20 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/nav/CNavTitle.ts:
--------------------------------------------------------------------------------
1 | import { defineComponent, h } from 'vue'
2 |
3 | const CNavTitle = defineComponent({
4 | name: 'CNavTitle',
5 | props: {
6 | /**
7 | * Component used for the root node. Either a string to use a HTML element or a component.
8 | */
9 | as: {
10 | type: String,
11 | default: 'li',
12 | },
13 | },
14 | setup(props, { slots }) {
15 | return () => h(props.as, { class: 'nav-title' }, slots.default && slots.default())
16 | },
17 | })
18 |
19 | export { CNavTitle }
20 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/card/CCardTitle.ts:
--------------------------------------------------------------------------------
1 | import { defineComponent, h } from 'vue'
2 |
3 | const CCardTitle = defineComponent({
4 | name: 'CCardTitle',
5 | props: {
6 | /**
7 | * Component used for the root node. Either a string to use a HTML element or a component.
8 | */
9 | as: {
10 | type: String,
11 | default: 'h5',
12 | },
13 | },
14 | setup(props, { slots }) {
15 | return () => h(props.as, { class: 'card-title' }, slots.default && slots.default())
16 | },
17 | })
18 |
19 | export { CCardTitle }
20 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/card/CCardHeader.ts:
--------------------------------------------------------------------------------
1 | import { defineComponent, h } from 'vue'
2 |
3 | const CCardHeader = defineComponent({
4 | name: 'CCardHeader',
5 | props: {
6 | /**
7 | * Component used for the root node. Either a string to use a HTML element or a component.
8 | */
9 | as: {
10 | type: String,
11 | default: 'div',
12 | },
13 | },
14 | setup(props, { slots }) {
15 | return () => h(props.as, { class: 'card-header' }, slots.default && slots.default())
16 | },
17 | })
18 |
19 | export { CCardHeader }
20 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/modal/CModalTitle.ts:
--------------------------------------------------------------------------------
1 | import { defineComponent, h } from 'vue'
2 |
3 | const CModalTitle = defineComponent({
4 | name: 'CModalTitle',
5 | props: {
6 | /**
7 | * Component used for the root node. Either a string to use a HTML element or a component.
8 | */
9 | as: {
10 | type: String,
11 | default: 'h5',
12 | },
13 | },
14 | setup(props, { slots }) {
15 | return () => h(props.as, { class: 'modal-title' }, slots.default && slots.default())
16 | },
17 | })
18 |
19 | export { CModalTitle }
20 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/card/CCardSubtitle.ts:
--------------------------------------------------------------------------------
1 | import { defineComponent, h } from 'vue'
2 |
3 | const CCardSubtitle = defineComponent({
4 | name: 'CCardSubtitle',
5 | props: {
6 | /**
7 | * Component used for the root node. Either a string to use a HTML element or a component.
8 | */
9 | as: {
10 | type: String,
11 | default: 'h6',
12 | },
13 | },
14 | setup(props, { slots }) {
15 | return () => h(props.as, { class: 'card-subtitle' }, slots.default && slots.default())
16 | },
17 | })
18 | export { CCardSubtitle }
19 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/header/CHeaderBrand.ts:
--------------------------------------------------------------------------------
1 | import { defineComponent, h } from 'vue'
2 |
3 | const CHeaderBrand = defineComponent({
4 | name: 'CHeaderBrand',
5 | props: {
6 | /**
7 | * Component used for the root node. Either a string to use a HTML element or a component.
8 | */
9 | as: {
10 | type: String,
11 | default: 'a',
12 | },
13 | },
14 | setup(props, { slots }) {
15 | return () => h(props.as, { class: 'header-brand' }, slots.default && slots.default())
16 | },
17 | })
18 |
19 | export { CHeaderBrand }
20 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/header/CHeaderToggler.ts:
--------------------------------------------------------------------------------
1 | import { defineComponent, h } from 'vue'
2 |
3 | const CHeaderToggler = defineComponent({
4 | name: 'CHeaderToggler',
5 | setup(_, { slots }) {
6 | return () =>
7 | h(
8 | 'button',
9 | {
10 | class: 'header-toggler',
11 | type: 'button',
12 | 'aria-label': 'Toggle navigation',
13 | },
14 | slots.default ? slots.default() : h('span', { class: ['header-toggler-icon'] }),
15 | )
16 | },
17 | })
18 |
19 | export { CHeaderToggler }
20 |
--------------------------------------------------------------------------------
/packages/docs/api/card/CCardLink.api.md:
--------------------------------------------------------------------------------
1 | ### CCardLink
2 |
3 | ```jsx
4 | import { CCardLink } from '@coreui/vue'
5 | // or
6 | import CCardLink from '@coreui/vue/src/components/card/CCardLink'
7 | ```
8 |
9 | #### Props
10 |
11 | | Prop name | Description | Type | Values | Default |
12 | | --------- | ------------------------------------------------------------------ | ------ | ------ | ------- |
13 | | **href** | The href attribute specifies the URL of the page the link goes to. | string | - | '#' |
14 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/collapse/__test__/__snapshots__/CCollapse.spec.ts.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Loads and display CCollapse component renders correctly 1`] = `
4 | "Default slot
6 | Default slot
12 | Default slot
6 |
5 |
"
14 | `;
15 |
--------------------------------------------------------------------------------
/packages/docs/.vuepress/src/client/composables/useThemeData.ts:
--------------------------------------------------------------------------------
1 | import {
2 | useThemeData as _useThemeData,
3 | useThemeLocaleData as _useThemeLocaleData,
4 | } from '@vuepress/plugin-theme-data/client'
5 | import type {
6 | ThemeDataRef,
7 | ThemeLocaleDataRef,
8 | } from '@vuepress/plugin-theme-data/client'
9 | import type { DefaultThemeData } from '../../shared/index.js'
10 |
11 | export const useThemeData = (): ThemeDataRef
6 |
12 |
13 | default
7 |
8 |
11 | 75
9 | title
10 |
7 |
8 |
"
9 | `;
10 |
--------------------------------------------------------------------------------
/packages/docs/api/modal/CModalTitle.api.md:
--------------------------------------------------------------------------------
1 | ### CModalTitle
2 |
3 | ```jsx
4 | import { CModalTitle } from '@coreui/vue'
5 | // or
6 | import CModalTitle from '@coreui/vue/src/components/modal/CModalTitle'
7 | ```
8 |
9 | #### Props
10 |
11 | | Prop name | Description | Type | Values | Default |
12 | | --------- | --------------------------------------------------------------------------------------- | ------ | ------ | ------- |
13 | | **as** | Component used for the root node. Either a string to use a HTML element or a component. | string | - | 'h5' |
14 |
--------------------------------------------------------------------------------
/packages/docs/.vuepress/src/client/styles/index.scss:
--------------------------------------------------------------------------------
1 | @use "@coreui/coreui/scss/coreui" with (
2 | $enable-deprecation-messages: false
3 | );
4 |
5 | @forward "ads";
6 | @forward "anchor";
7 | @forward "callouts";
8 | @forward "component-examples";
9 | @forward "footer";
10 | @forward "layout";
11 | @forward "prism";
12 | @forward "scrolling";
13 | @forward "search";
14 | @forward "sidebar";
15 | @forward "table-api";
16 | @forward "toc";
17 | @forward "custom-container";
18 |
19 | .back-to-top {
20 | --c-brand: #3eaf7c;
21 | --c-brand-light: #4abf8a;
22 | --back-to-top-color: var(--c-brand);
23 | --back-to-top-color-hover: var(--c-brand-light);
24 | }
--------------------------------------------------------------------------------
/packages/docs/api/card/CCardSubtitle.api.md:
--------------------------------------------------------------------------------
1 | ### CCardSubtitle
2 |
3 | ```jsx
4 | import { CCardSubtitle } from '@coreui/vue'
5 | // or
6 | import CCardSubtitle from '@coreui/vue/src/components/card/CCardSubtitle'
7 | ```
8 |
9 | #### Props
10 |
11 | | Prop name | Description | Type | Values | Default |
12 | | --------- | --------------------------------------------------------------------------------------- | ------ | ------ | ------- |
13 | | **as** | Component used for the root node. Either a string to use a HTML element or a component. | string | - | 'h6' |
14 |
--------------------------------------------------------------------------------
/packages/docs/api/header/CHeaderBrand.api.md:
--------------------------------------------------------------------------------
1 | ### CHeaderBrand
2 |
3 | ```jsx
4 | import { CHeaderBrand } from '@coreui/vue'
5 | // or
6 | import CHeaderBrand from '@coreui/vue/src/components/header/CHeaderBrand'
7 | ```
8 |
9 | #### Props
10 |
11 | | Prop name | Description | Type | Values | Default |
12 | | --------- | --------------------------------------------------------------------------------------- | ------ | ------ | ------- |
13 | | **as** | Component used for the root node. Either a string to use a HTML element or a component. | string | - | 'a' |
14 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/button/__tests__/__snapshots__/CButton.spec.ts.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Customize (number two) CButton component renders correctly 1`] = `"Default slot"`;
4 |
5 | exports[`Customize CButton component renders correctly 1`] = `"Default slot"`;
6 |
7 | exports[`Loads and display CButton component renders correctly 1`] = `""`;
8 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/form/__tests__/__snapshots__/CFormInput.spec.ts.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Customize (two) CFormInput component renders correctly 1`] = `""`;
4 |
5 | exports[`Customize CFormInput component renders correctly 1`] = `""`;
6 |
7 | exports[`Loads and display CFormInput component renders correctly 1`] = `""`;
8 |
--------------------------------------------------------------------------------
/packages/docs/api/alert/CAlertHeading.api.md:
--------------------------------------------------------------------------------
1 | ### CAlertHeading
2 |
3 | ```jsx
4 | import { CAlertHeading } from '@coreui/vue'
5 | // or
6 | import CAlertHeading from '@coreui/vue/src/components/alert/CAlertHeading'
7 | ```
8 |
9 | #### Props
10 |
11 | | Prop name | Description | Type | Values | Default |
12 | | --------- | --------------------------------------------------------------------------------------- | ------ | ------ | ------- |
13 | | **as** | Component used for the root node. Either a string to use a HTML element or a component. | string | - | 'h4' |
14 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/form/CFormLabel.ts:
--------------------------------------------------------------------------------
1 | import { defineComponent, h } from 'vue'
2 |
3 | const CFormLabel = defineComponent({
4 | name: 'CFormLabel',
5 | props: {
6 | /**
7 | * A string of all className you want to be applied to the component, and override standard className value.
8 | */
9 | customClassName: [Array, String],
10 | },
11 | setup(props, { slots }) {
12 | return () =>
13 | h(
14 | 'label',
15 | {
16 | class: props.customClassName ?? 'form-label',
17 | },
18 | slots.default && slots.default(),
19 | )
20 | },
21 | })
22 |
23 | export { CFormLabel }
24 |
--------------------------------------------------------------------------------
/packages/docs/api/form/CInputGroupText.api.md:
--------------------------------------------------------------------------------
1 | ### CInputGroupText
2 |
3 | ```jsx
4 | import { CInputGroupText } from '@coreui/vue'
5 | // or
6 | import CInputGroupText from '@coreui/vue/src/components/form/CInputGroupText'
7 | ```
8 |
9 | #### Props
10 |
11 | | Prop name | Description | Type | Values | Default |
12 | | --------- | --------------------------------------------------------------------------------------- | ------ | ------ | ------- |
13 | | **as** | Component used for the root node. Either a string to use a HTML element or a component. | string | - | 'span' |
14 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/dropdown/__tests__/__snapshots__/CDropdownToggle.spec.ts.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Customize CDropdownToggle component renders correctly 1`] = `"Default slot"`;
4 |
5 | exports[`Loads and display CDropdownToggle component renders correctly 1`] = `""`;
6 |
--------------------------------------------------------------------------------
/packages/docs/.vuepress/src/client/composables/useScrollPromise.ts:
--------------------------------------------------------------------------------
1 | export interface ScrollPromise {
2 | wait(): Promise
5 |
6 |
7 |
8 | Default slot
9 |
10 |
11 |
"
12 | `;
13 |
14 | exports[`Loads and display CTable component renders correctly 1`] = `
15 | "Default slot
"`;
6 |
7 | exports[`Loads and display CListGroupItem component renders correctly 1`] = `"
5 |
"
15 | `;
16 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/composables/usePopper.ts:
--------------------------------------------------------------------------------
1 | import { ref } from 'vue'
2 | import { createPopper } from '@popperjs/core'
3 | import type { Instance, Options } from '@popperjs/core'
4 |
5 | export const usePopper = () => {
6 | const _popper = ref
6 |
14 | 75
7 | title
8 |
9 |
12 |
text
13 |
5 |
6 |
"
7 | `;
8 |
9 | exports[`Loads and display CProgress component renders correctly 1`] = `
10 | "
11 |
12 |
"
13 | `;
14 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/offcanvas/index.ts:
--------------------------------------------------------------------------------
1 | import { App } from 'vue'
2 | import { COffcanvas } from './COffcanvas'
3 | import { COffcanvasBody } from './COffcanvasBody'
4 | import { COffcanvasHeader } from './COffcanvasHeader'
5 | import { COffcanvasTitle } from './COffcanvasTitle'
6 |
7 | const COffcanvasPlugin = {
8 | install: (app: App): void => {
9 | app.component(COffcanvas.name as string, COffcanvas)
10 | app.component(COffcanvasBody.name as string, COffcanvasBody)
11 | app.component(COffcanvasHeader.name as string, COffcanvasHeader)
12 | app.component(COffcanvasTitle.name as string, COffcanvasTitle)
13 | },
14 | }
15 |
16 | export { COffcanvasPlugin, COffcanvas, COffcanvasBody, COffcanvasHeader, COffcanvasTitle }
17 |
--------------------------------------------------------------------------------
/.github/.stale.yml:
--------------------------------------------------------------------------------
1 | # Number of days of inactivity before an issue becomes stale
2 | daysUntilStale: 360
3 | # Number of days of inactivity before a stale issue is closed
4 | daysUntilClose: 7
5 | # Issues with these labels will never be considered stale
6 | exemptLabels:
7 | - pinned
8 | - security
9 | # Label to use when marking an issue as stale
10 | staleLabel: wontfix
11 | # Comment to post when marking an issue as stale. Set to `false` to disable
12 | markComment: >
13 | This issue has been automatically marked as stale because it has not had
14 | recent activity. It will be closed if no further activity occurs. Thank you
15 | for your contributions.
16 | # Comment to post when closing a stale issue. Set to `false` to disable
17 | closeComment: false
--------------------------------------------------------------------------------
/packages/docs/api/stepper/CStepper.api.md:
--------------------------------------------------------------------------------
1 | ### CStepper
2 |
3 | ```jsx
4 | import { CStepper } from '@coreui/vue'
5 | // or
6 | import CStepper from '@coreui/vue/src/components/stepper/CStepper'
7 | ```
8 |
9 | #### Props
10 |
11 | | Prop name | Description | Type | Values | Default |
12 | | --------- | ----------- | ---- | ------ | ------- |
13 |
14 | #### Events
15 |
16 | | Event name | Description | Properties |
17 | | ---------------------------- | ----------- | ---------- |
18 | | **update:modelValue** | |
19 | | **finish** | |
20 | | **reset** | |
21 | | **step-change** | |
22 | | **step-validation-complete** | |
23 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/toast/index.ts:
--------------------------------------------------------------------------------
1 | import { App } from 'vue'
2 | import { CToast } from './CToast'
3 | import { CToastBody } from './CToastBody'
4 | import { CToastClose } from './CToastClose'
5 | import { CToaster } from './CToaster'
6 | import { CToastHeader } from './CToastHeader'
7 |
8 | const CToastPlugin = {
9 | install: (app: App): void => {
10 | app.component(CToast.name as string, CToast)
11 | app.component(CToastBody.name as string, CToastBody)
12 | app.component(CToastClose.name as string, CToastClose)
13 | app.component(CToaster.name as string, CToaster)
14 | app.component(CToastHeader.name as string, CToastHeader)
15 | },
16 | }
17 |
18 | export { CToastPlugin, CToast, CToastBody, CToastClose, CToaster, CToastHeader }
19 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/widgets/__tests__/CWidgetStatsA.spec.ts:
--------------------------------------------------------------------------------
1 | import { mount } from '@vue/test-utils'
2 | import { CWidgetStatsA as Component } from '../../../index'
3 |
4 | const ComponentName = 'CWidgetStatsA'
5 |
6 | const defaultWrapper = mount(Component, {
7 | propsData: {
8 | color: 'warning',
9 | title: 'title',
10 | value: 75,
11 | },
12 | slots: {
13 | action: 'action',
14 | chart: 'chart',
15 | default: 'Default slot',
16 | },
17 | })
18 |
19 | describe(`Loads and display ${ComponentName} component`, () => {
20 | it('has a name', () => {
21 | expect(Component.name).toMatch(ComponentName)
22 | })
23 | it('renders correctly', () => {
24 | expect(defaultWrapper.html()).toMatchSnapshot()
25 | })
26 | })
27 |
--------------------------------------------------------------------------------
/packages/docs/api/navbar/CNavbarBrand.api.md:
--------------------------------------------------------------------------------
1 | ### CNavbarBrand
2 |
3 | ```jsx
4 | import { CNavbarBrand } from '@coreui/vue'
5 | // or
6 | import CNavbarBrand from '@coreui/vue/src/components/navbar/CNavbarBrand'
7 | ```
8 |
9 | #### Props
10 |
11 | | Prop name | Description | Type | Values | Default |
12 | | --------- | --------------------------------------------------------------------------------------- | ------ | ------ | ------- |
13 | | **as** | Component used for the root node. Either a string to use a HTML element or a component. | string | - | 'a' |
14 | | **href** | The href attribute specifies the URL of the page the link goes to. | string | - | - |
15 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/backdrop/__tests__/CBackdrop.spec.ts:
--------------------------------------------------------------------------------
1 | import { mount } from '@vue/test-utils'
2 | import { CBackdrop as Component } from '../../../index'
3 |
4 | const ComponentName = 'CBackdrop'
5 |
6 | const defaultWrapper = mount(Component, {
7 | propsData: {
8 | visible: true,
9 | },
10 | slots: {
11 | default: 'Default slot',
12 | },
13 | })
14 |
15 | describe(`Loads and display ${ComponentName} component`, () => {
16 | it('has a name', () => {
17 | expect(Component.name).toMatch(ComponentName)
18 | })
19 | it('renders correctly', () => {
20 | expect(defaultWrapper.html()).toMatchSnapshot()
21 | })
22 | it('contain slots and classes', () => {
23 | expect(defaultWrapper.find('div').classes('fade')).toBe(true)
24 | })
25 | })
26 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/modal/index.ts:
--------------------------------------------------------------------------------
1 | import { App } from 'vue'
2 | import { CModal } from './CModal'
3 | import { CModalBody } from './CModalBody'
4 | import { CModalFooter } from './CModalFooter'
5 | import { CModalHeader } from './CModalHeader'
6 | import { CModalTitle } from './CModalTitle'
7 |
8 | const CModalPlugin = {
9 | install: (app: App): void => {
10 | app.component(CModal.name as string, CModal)
11 | app.component(CModalBody.name as string, CModalBody)
12 | app.component(CModalFooter.name as string, CModalFooter)
13 | app.component(CModalHeader.name as string, CModalHeader)
14 | app.component(CModalTitle.name as string, CModalTitle)
15 | },
16 | }
17 |
18 | export { CModalPlugin, CModal, CModalBody, CModalFooter, CModalHeader, CModalTitle }
19 |
--------------------------------------------------------------------------------
/packages/docs/api/sidebar/CSidebarBrand.api.md:
--------------------------------------------------------------------------------
1 | ### CSidebarBrand
2 |
3 | ```jsx
4 | import { CSidebarBrand } from '@coreui/vue'
5 | // or
6 | import CSidebarBrand from '@coreui/vue/src/components/sidebar/CSidebarBrand'
7 | ```
8 |
9 | #### Props
10 |
11 | | Prop name | Description | Type | Values | Default |
12 | | --------- | --------------------------------------------------------------------------------------- | ------ | ------ | ------- |
13 | | **as** | Component used for the root node. Either a string to use a HTML element or a component. | string | - | 'div' |
14 | | **href** | The href attribute specifies the URL of the page the link goes to. | string | - | - |
15 |
--------------------------------------------------------------------------------
/.github/workflows/daily-project-check.yml:
--------------------------------------------------------------------------------
1 | name: Daily project check
2 |
3 | on:
4 | schedule:
5 | # build runs every weekday at 6AM UTC
6 | - cron: '0 6 * * 1-5'
7 |
8 | jobs:
9 | build:
10 |
11 | runs-on: ubuntu-latest
12 |
13 | strategy:
14 | matrix:
15 | node-version: [12.x]
16 | os: [ubuntu-latest, windows-latest, macOS-latest]
17 |
18 | steps:
19 | - uses: actions/checkout@v1
20 | - name: Use Node.js ${{ matrix.node-version }}
21 | uses: actions/setup-node@v1
22 | with:
23 | node-version: ${{ matrix.node-version }}
24 | - name: npm install, build, test and lint
25 | run: |
26 | npm i
27 | npm run build
28 | npm run jest:test
29 | npm run lint
30 | env:
31 | CI: true
32 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/widgets/__tests__/CWidgetStatsD.spec.ts:
--------------------------------------------------------------------------------
1 | import { mount } from '@vue/test-utils'
2 | import { CWidgetStatsD as Component } from '../../../index'
3 |
4 | const ComponentName = 'CWidgetStatsD'
5 |
6 | const defaultWrapper = mount(Component, {
7 | propsData: {
8 | color: 'warning',
9 | values: [
10 | { title: 'aa', value: 'bb' },
11 | { title: 'cc', value: 'dd' },
12 | ],
13 | },
14 | slots: {
15 | icon: 'icon',
16 | chart: 'chart',
17 | },
18 | })
19 |
20 | describe(`Loads and display ${ComponentName} component`, () => {
21 | it('has a name', () => {
22 | expect(Component.name).toMatch(ComponentName)
23 | })
24 | it('renders correctly', () => {
25 | expect(defaultWrapper.html()).toMatchSnapshot()
26 | })
27 | })
28 |
--------------------------------------------------------------------------------
/packages/docs/api/tabs/CTab.api.md:
--------------------------------------------------------------------------------
1 | ### CTab
2 |
3 | ```jsx
4 | import { CTab } from '@coreui/vue'
5 | // or
6 | import CTab from '@coreui/vue/src/components/tabs/CTab'
7 | ```
8 |
9 | #### Props
10 |
11 | | Prop name | Description | Type | Values | Default |
12 | | ----------------------------------------------------------- | -------------------------------------------- | -------------- | ------ | ------- |
13 | | **disabled** 5.4.0+
| Toggle the disabled state for the component. | boolean | - | - |
14 | | **item-key** | Item key. | number\|string | - | - |
15 |
--------------------------------------------------------------------------------
/.github/workflows/project-check.yml:
--------------------------------------------------------------------------------
1 | name: Project check
2 |
3 | on:
4 | push:
5 | branches:
6 | - master
7 | pull_request:
8 | branches:
9 | - master
10 |
11 | jobs:
12 | build:
13 |
14 | runs-on: ubuntu-latest
15 |
16 | strategy:
17 | matrix:
18 | node-version: [12.x]
19 | os: [ubuntu-latest, windows-latest, macOS-latest]
20 |
21 | steps:
22 | - uses: actions/checkout@v1
23 | - name: Use Node.js ${{ matrix.node-version }}
24 | uses: actions/setup-node@v1
25 | with:
26 | node-version: ${{ matrix.node-version }}
27 | - name: npm install, build, test and lint
28 | run: |
29 | npm i
30 | npm run build
31 | npm run jest:test
32 | npm run lint
33 | env:
34 | CI: true
35 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/navbar/index.ts:
--------------------------------------------------------------------------------
1 | import { App } from 'vue'
2 | import { CNavbar } from './CNavbar'
3 | import { CNavbarBrand } from './CNavbarBrand'
4 | import { CNavbarNav } from './CNavbarNav'
5 | import { CNavbarText } from './CNavbarText'
6 | import { CNavbarToggler } from './CNavbarToggler'
7 |
8 | const CNavbarPlugin = {
9 | install: (app: App): void => {
10 | app.component(CNavbar.name as string, CNavbar)
11 | app.component(CNavbarBrand.name as string, CNavbarBrand)
12 | app.component(CNavbarNav.name as string, CNavbarNav)
13 | app.component(CNavbarText.name as string, CNavbarText)
14 | app.component(CNavbarToggler.name as string, CNavbarToggler)
15 | },
16 | }
17 |
18 | export { CNavbarPlugin, CNavbar, CNavbarBrand, CNavbarNav, CNavbarText, CNavbarToggler }
19 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/widgets/__tests__/CWidgetStatsB.spec.ts:
--------------------------------------------------------------------------------
1 | import { mount } from '@vue/test-utils'
2 | import { CWidgetStatsB as Component } from '../../../index'
3 |
4 | const ComponentName = 'CWidgetStatsB'
5 |
6 | const defaultWrapper = mount(Component, {
7 | propsData: {
8 | color: 'warning',
9 | inverse: true,
10 | progress: {
11 | color: 'info',
12 | value: 75,
13 | },
14 | text: 'text',
15 | title: 'title',
16 | value: 75,
17 | },
18 | slots: {},
19 | })
20 |
21 | describe(`Loads and display ${ComponentName} component`, () => {
22 | it('has a name', () => {
23 | expect(Component.name).toMatch(ComponentName)
24 | })
25 | it('renders correctly', () => {
26 | expect(defaultWrapper.html()).toMatchSnapshot()
27 | })
28 | })
29 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/widgets/__tests__/__snapshots__/CWidgetStatsC.spec.ts.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Loads and display CWidgetStatsC component renders correctly 1`] = `
4 | "
5 |
"
16 | `;
17 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/card/__tests__/CCardBody.spec.ts:
--------------------------------------------------------------------------------
1 | import { mount } from '@vue/test-utils'
2 | import { CCardBody as Component } from '../../../index'
3 |
4 | const ComponentName = 'CCardBody'
5 |
6 | const defaultWrapper = mount(Component, {
7 | propsData: {},
8 | slots: {
9 | default: 'Default slot',
10 | },
11 | })
12 |
13 | describe(`Loads and display ${ComponentName} component`, () => {
14 | it('has a name', () => {
15 | expect(Component.name).toMatch(ComponentName)
16 | })
17 | it('renders correctly', () => {
18 | expect(defaultWrapper.html()).toMatchSnapshot()
19 | })
20 | it('contain slots and classes', () => {
21 | expect(defaultWrapper.text()).toContain('Default slot')
22 | expect(defaultWrapper.classes('card-body')).toBe(true)
23 | })
24 | })
25 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/nav/__tests__/CNavTitle.spec.ts:
--------------------------------------------------------------------------------
1 | import { mount } from '@vue/test-utils'
2 | import { CNavTitle as Component } from '../../../index'
3 |
4 | const ComponentName = 'CNavTitle'
5 |
6 | const defaultWrapper = mount(Component, {
7 | propsData: {},
8 | slots: {
9 | default: 'Default slot',
10 | },
11 | })
12 |
13 | describe(`Loads and display ${ComponentName} component`, () => {
14 | it('has a name', () => {
15 | expect(Component.name).toMatch(ComponentName)
16 | })
17 | it('renders correctly', () => {
18 | expect(defaultWrapper.html()).toMatchSnapshot()
19 | })
20 | it('contain slots and classes', () => {
21 | expect(defaultWrapper.text()).toContain('Default slot')
22 | expect(defaultWrapper.classes('nav-title')).toBe(true)
23 | })
24 | })
25 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/widgets/__tests__/CWidgetStatsC.spec.ts:
--------------------------------------------------------------------------------
1 | import { mount } from '@vue/test-utils'
2 | import { CWidgetStatsC as Component } from '../../../index'
3 |
4 | const ComponentName = 'CWidgetStatsC'
5 |
6 | const defaultWrapper = mount(Component, {
7 | propsData: {
8 | color: 'warning',
9 | inverse: true,
10 | progress: {
11 | color: 'info',
12 | value: 75,
13 | },
14 | title: 'title',
15 | value: 75,
16 | },
17 | slots: {
18 | icon: 'icon',
19 | },
20 | })
21 |
22 | describe(`Loads and display ${ComponentName} component`, () => {
23 | it('has a name', () => {
24 | expect(Component.name).toMatch(ComponentName)
25 | })
26 | it('renders correctly', () => {
27 | expect(defaultWrapper.html()).toMatchSnapshot()
28 | })
29 | })
30 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/widgets/__tests__/CWidgetStatsF.spec.ts:
--------------------------------------------------------------------------------
1 | import { mount } from '@vue/test-utils'
2 | import { CWidgetStatsF as Component } from '../../../index'
3 |
4 | const ComponentName = 'CWidgetStatsF'
5 |
6 | const defaultWrapper = mount(Component, {
7 | propsData: {
8 | color: 'warning',
9 | padding: true,
10 | title: 'title',
11 | text: 'text',
12 | value: 75,
13 | },
14 | slots: {
15 | icon: 'icon',
16 | default: 'default',
17 | footer: 'footer',
18 | },
19 | })
20 |
21 | describe(`Loads and display ${ComponentName} component`, () => {
22 | it('has a name', () => {
23 | expect(Component.name).toMatch(ComponentName)
24 | })
25 | it('renders correctly', () => {
26 | expect(defaultWrapper.html()).toMatchSnapshot()
27 | })
28 | })
29 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/alert/__tests__/CAlertLink.spec.ts:
--------------------------------------------------------------------------------
1 | import { mount } from '@vue/test-utils'
2 | import { CAlertLink as Component } from '../../../index'
3 |
4 | const ComponentName = 'CAlertLink'
5 |
6 | const defaultWrapper = mount(Component, {
7 | propsData: {},
8 | slots: {
9 | default: 'Default slot',
10 | },
11 | })
12 |
13 | describe(`Loads and display ${ComponentName} component`, () => {
14 | it('has a name', () => {
15 | expect(Component.name).toMatch(ComponentName)
16 | })
17 | it('renders correctly', () => {
18 | expect(defaultWrapper.html()).toMatchSnapshot()
19 | })
20 | it('contain slots and classes', () => {
21 | expect(defaultWrapper.text()).toContain('Default slot')
22 | expect(defaultWrapper.classes('alert-link')).toBe(true)
23 | })
24 | })
25 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/card/__tests__/CCardFooter.spec.ts:
--------------------------------------------------------------------------------
1 | import { mount } from '@vue/test-utils'
2 | import { CCardFooter as Component } from '../../../index'
3 |
4 | const ComponentName = 'CCardFooter'
5 |
6 | const defaultWrapper = mount(Component, {
7 | propsData: {},
8 | slots: {
9 | default: 'Default slot',
10 | },
11 | })
12 |
13 | describe(`Loads and display ${ComponentName} component`, () => {
14 | it('has a name', () => {
15 | expect(Component.name).toMatch(ComponentName)
16 | })
17 | it('renders correctly', () => {
18 | expect(defaultWrapper.html()).toMatchSnapshot()
19 | })
20 | it('contain slots and classes', () => {
21 | expect(defaultWrapper.text()).toContain('Default slot')
22 | expect(defaultWrapper.classes('card-footer')).toBe(true)
23 | })
24 | })
25 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/card/__tests__/CCardGroup.spec.ts:
--------------------------------------------------------------------------------
1 | import { mount } from '@vue/test-utils'
2 | import { CCardGroup as Component } from '../../../index'
3 |
4 | const ComponentName = 'CCardGroup'
5 |
6 | const defaultWrapper = mount(Component, {
7 | propsData: {},
8 | slots: {
9 | default: 'Default slot',
10 | },
11 | })
12 |
13 | describe(`Loads and display ${ComponentName} component`, () => {
14 | it('has a name', () => {
15 | expect(Component.name).toMatch(ComponentName)
16 | })
17 | it('renders correctly', () => {
18 | expect(defaultWrapper.html()).toMatchSnapshot()
19 | })
20 | it('contain slots and classes', () => {
21 | expect(defaultWrapper.text()).toContain('Default slot')
22 | expect(defaultWrapper.classes('card-group')).toBe(true)
23 | })
24 | })
25 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/form/__tests__/__snapshots__/CFormCheck.spec.ts.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Customize with label - CFormCheck component renders correctly 1`] = `
4 | "
5 | "
6 | `;
7 |
8 | exports[`Customize with label in slot - CFormCheck component renders correctly 1`] = `
9 | "
10 | "
11 | `;
12 |
13 | exports[`Loads and display CFormCheck component renders correctly 1`] = `""`;
14 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/modal/__tests__/CModalBody.spec.ts:
--------------------------------------------------------------------------------
1 | import { mount } from '@vue/test-utils'
2 | import { CModalBody as Component } from '../../../index'
3 |
4 | const ComponentName = 'CModalBody'
5 |
6 | const defaultWrapper = mount(Component, {
7 | propsData: {},
8 | slots: {
9 | default: 'Default slot',
10 | },
11 | })
12 |
13 | describe(`Loads and display ${ComponentName} component`, () => {
14 | it('has a name', () => {
15 | expect(Component.name).toMatch(ComponentName)
16 | })
17 | it('renders correctly', () => {
18 | expect(defaultWrapper.html()).toMatchSnapshot()
19 | })
20 | it('contain slots and classes', () => {
21 | expect(defaultWrapper.text()).toContain('Default slot')
22 | expect(defaultWrapper.classes('modal-body')).toBe(true)
23 | })
24 | })
25 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/tabs/__tests__/CTabContent.spec.ts:
--------------------------------------------------------------------------------
1 | import { mount } from '@vue/test-utils'
2 | import { CTabContent as Component } from '../../../index'
3 |
4 | const ComponentName = 'CTabContent'
5 |
6 | const defaultWrapper = mount(Component, {
7 | propsData: {},
8 | slots: {
9 | default: 'Default slot',
10 | },
11 | })
12 |
13 | describe(`Loads and display ${ComponentName} component`, () => {
14 | it('has a name', () => {
15 | expect(Component.name).toMatch(ComponentName)
16 | })
17 | it('renders correctly', () => {
18 | expect(defaultWrapper.html()).toMatchSnapshot()
19 | })
20 | it('contain slots and classes', () => {
21 | expect(defaultWrapper.text()).toContain('Default slot')
22 | expect(defaultWrapper.classes('tab-content')).toBe(true)
23 | })
24 | })
25 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/toast/__tests__/CToastBody.spec.ts:
--------------------------------------------------------------------------------
1 | import { mount } from '@vue/test-utils'
2 | import { CToastBody as Component } from '../../../index'
3 |
4 | const ComponentName = 'CToastBody'
5 |
6 | const defaultWrapper = mount(Component, {
7 | propsData: {},
8 | slots: {
9 | default: 'Default slot',
10 | },
11 | })
12 |
13 | describe(`Loads and display ${ComponentName} component`, () => {
14 | it('has a name', () => {
15 | expect(Component.name).toMatch(ComponentName)
16 | })
17 | it('renders correctly', () => {
18 | expect(defaultWrapper.html()).toMatchSnapshot()
19 | })
20 | it('contain slots and classes', () => {
21 | expect(defaultWrapper.text()).toContain('Default slot')
22 | expect(defaultWrapper.classes('toast-body')).toBe(true)
23 | })
24 | })
25 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/header/__tests__/CHeaderText.spec.ts:
--------------------------------------------------------------------------------
1 | import { mount } from '@vue/test-utils'
2 | import { CHeaderText as Component } from '../../../index'
3 |
4 | const ComponentName = 'CHeaderText'
5 |
6 | const defaultWrapper = mount(Component, {
7 | propsData: {},
8 | slots: {
9 | default: 'Default slot',
10 | },
11 | })
12 |
13 | describe(`Loads and display ${ComponentName} component`, () => {
14 | it('has a name', () => {
15 | expect(Component.name).toMatch(ComponentName)
16 | })
17 | it('renders correctly', () => {
18 | expect(defaultWrapper.html()).toMatchSnapshot()
19 | })
20 | it('contain slots and classes', () => {
21 | expect(defaultWrapper.text()).toContain('Default slot')
22 | expect(defaultWrapper.classes('header-text')).toBe(true)
23 | })
24 | })
25 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/modal/__tests__/CModalFooter.spec.ts:
--------------------------------------------------------------------------------
1 | import { mount } from '@vue/test-utils'
2 | import { CModalFooter as Component } from '../../../index'
3 |
4 | const ComponentName = 'CModalFooter'
5 |
6 | const defaultWrapper = mount(Component, {
7 | propsData: {},
8 | slots: {
9 | default: 'Default slot',
10 | },
11 | })
12 |
13 | describe(`Loads and display ${ComponentName} component`, () => {
14 | it('has a name', () => {
15 | expect(Component.name).toMatch(ComponentName)
16 | })
17 | it('renders correctly', () => {
18 | expect(defaultWrapper.html()).toMatchSnapshot()
19 | })
20 | it('contain slots and classes', () => {
21 | expect(defaultWrapper.text()).toContain('Default slot')
22 | expect(defaultWrapper.classes('modal-footer')).toBe(true)
23 | })
24 | })
25 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/navbar/__tests__/CNavbarText.spec.ts:
--------------------------------------------------------------------------------
1 | import { mount } from '@vue/test-utils'
2 | import { CNavbarText as Component } from '../../../index'
3 |
4 | const ComponentName = 'CNavbarText'
5 |
6 | const defaultWrapper = mount(Component, {
7 | propsData: {},
8 | slots: {
9 | default: 'Default slot',
10 | },
11 | })
12 |
13 | describe(`Loads and display ${ComponentName} component`, () => {
14 | it('has a name', () => {
15 | expect(Component.name).toMatch(ComponentName)
16 | })
17 | it('renders correctly', () => {
18 | expect(defaultWrapper.html()).toMatchSnapshot()
19 | })
20 | it('contain slots and classes', () => {
21 | expect(defaultWrapper.text()).toContain('Default slot')
22 | expect(defaultWrapper.classes('navbar-text')).toBe(true)
23 | })
24 | })
25 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/form/__tests__/CFormFloating.spec.ts:
--------------------------------------------------------------------------------
1 | import { mount } from '@vue/test-utils'
2 | import { CFormFloating as Component } from '../../../index'
3 |
4 | const ComponentName = 'CFormFloating'
5 |
6 | const defaultWrapper = mount(Component, {
7 | propsData: {},
8 | slots: {
9 | default: 'Default slot',
10 | },
11 | })
12 |
13 | describe(`Loads and display ${ComponentName} component`, () => {
14 | it('has a name', () => {
15 | expect(Component.name).toMatch(ComponentName)
16 | })
17 | it('renders correctly', () => {
18 | expect(defaultWrapper.html()).toMatchSnapshot()
19 | })
20 | it('contain slots and classes', () => {
21 | expect(defaultWrapper.text()).toContain('Default slot')
22 | expect(defaultWrapper.classes('form-floating')).toBe(true)
23 | })
24 | })
25 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/sidebar/CSidebarBrand.ts:
--------------------------------------------------------------------------------
1 | import { defineComponent, h } from 'vue'
2 |
3 | const CSidebarBrand = defineComponent({
4 | name: 'CSidebarBrand',
5 | props: {
6 | /**
7 | * Component used for the root node. Either a string to use a HTML element or a component.
8 | *
9 | */
10 | as: {
11 | type: String,
12 | default: 'div',
13 | },
14 | /**
15 | * The href attribute specifies the URL of the page the link goes to.
16 | */
17 | href: String,
18 | },
19 | setup(props, { slots }) {
20 | return () =>
21 | h(
22 | props.as ?? (props.href ? 'a' : 'div'),
23 | { class: 'sidebar-brand', href: props.href },
24 | slots.default && slots.default(),
25 | )
26 | },
27 | })
28 |
29 | export { CSidebarBrand }
30 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/tabs/index.ts:
--------------------------------------------------------------------------------
1 | import { App } from 'vue'
2 | import { CTab } from './CTab'
3 | import { CTabContent } from './CTabContent'
4 | import { CTabList } from './CTabList'
5 | import { CTabPane } from './CTabPane'
6 | import { CTabPanel } from './CTabPanel'
7 | import { CTabs } from './CTabs'
8 |
9 | const CTabsPlugin = {
10 | install: (app: App): void => {
11 | app.component(CTab.name as string, CTab)
12 | app.component(CTabContent.name as string, CTabContent)
13 | app.component(CTabList.name as string, CTabList)
14 | app.component(CTabPane.name as string, CTabPane)
15 | app.component(CTabPanel.name as string, CTabPanel)
16 | app.component(CTabs.name as string, CTabs)
17 | },
18 | }
19 |
20 | export { CTabsPlugin, CTab, CTabContent, CTabList, CTabPane, CTabPanel, CTabs }
21 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/header/__tests__/CHeaderDivider.spec.ts:
--------------------------------------------------------------------------------
1 | import { mount } from '@vue/test-utils'
2 | import { CHeaderDivider as Component } from '../../../index'
3 |
4 | const ComponentName = 'CHeaderDivider'
5 |
6 | const defaultWrapper = mount(Component, {
7 | propsData: {},
8 | slots: {
9 | default: 'Default slot',
10 | },
11 | })
12 |
13 | describe(`Loads and display ${ComponentName} component`, () => {
14 | it('has a name', () => {
15 | expect(Component.name).toMatch(ComponentName)
16 | })
17 | it('renders correctly', () => {
18 | expect(defaultWrapper.html()).toMatchSnapshot()
19 | })
20 | it('contain slots and classes', () => {
21 | expect(defaultWrapper.text()).toContain('Default slot')
22 | expect(defaultWrapper.classes('header-divider')).toBe(true)
23 | })
24 | })
25 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/nav/__tests__/CNavGroupItems.spec.ts:
--------------------------------------------------------------------------------
1 | import { mount } from '@vue/test-utils'
2 | import { CNavGroupItems as Component } from '../../../index'
3 |
4 | const ComponentName = 'CNavGroupItems'
5 |
6 | const defaultWrapper = mount(Component, {
7 | propsData: {},
8 | slots: {
9 | default: 'Default slot',
10 | },
11 | })
12 |
13 | describe(`Loads and display ${ComponentName} component`, () => {
14 | it('has a name', () => {
15 | expect(Component.name).toMatch(ComponentName)
16 | })
17 | it('renders correctly', () => {
18 | expect(defaultWrapper.html()).toMatchSnapshot()
19 | })
20 | it('contain slots and classes', () => {
21 | expect(defaultWrapper.text()).toContain('Default slot')
22 | expect(defaultWrapper.classes('nav-group-items')).toBe(true)
23 | })
24 | })
25 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/sidebar/__tests__/CSidebarBrand.spec.ts:
--------------------------------------------------------------------------------
1 | import { mount } from '@vue/test-utils'
2 | import { CSidebarBrand as Component } from '../../../index'
3 |
4 | const ComponentName = 'CSidebarBrand'
5 |
6 | const defaultWrapper = mount(Component, {
7 | propsData: {},
8 | slots: {
9 | default: 'Default slot',
10 | },
11 | })
12 |
13 | describe(`Loads and display ${ComponentName} component`, () => {
14 | it('has a name', () => {
15 | expect(Component.name).toMatch(ComponentName)
16 | })
17 | it('renders correctly', () => {
18 | expect(defaultWrapper.html()).toMatchSnapshot()
19 | })
20 | it('contain slots and classes', () => {
21 | expect(defaultWrapper.text()).toContain('Default slot')
22 | expect(defaultWrapper.classes('sidebar-brand')).toBe(true)
23 | })
24 | })
25 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/sidebar/__tests__/CSidebarFooter.spec.ts:
--------------------------------------------------------------------------------
1 | import { mount } from '@vue/test-utils'
2 | import { CSidebarFooter as Component } from '../../../index'
3 |
4 | const ComponentName = 'CSidebarFooter'
5 |
6 | const defaultWrapper = mount(Component, {
7 | propsData: {},
8 | slots: {
9 | default: 'Default slot',
10 | },
11 | })
12 |
13 | describe(`Loads and display ${ComponentName} component`, () => {
14 | it('has a name', () => {
15 | expect(Component.name).toMatch(ComponentName)
16 | })
17 | it('renders correctly', () => {
18 | expect(defaultWrapper.html()).toMatchSnapshot()
19 | })
20 | it('contain slots and classes', () => {
21 | expect(defaultWrapper.text()).toContain('Default slot')
22 | expect(defaultWrapper.classes('sidebar-footer')).toBe(true)
23 | })
24 | })
25 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/sidebar/__tests__/CSidebarHeader.spec.ts:
--------------------------------------------------------------------------------
1 | import { mount } from '@vue/test-utils'
2 | import { CSidebarHeader as Component } from '../../../index'
3 |
4 | const ComponentName = 'CSidebarHeader'
5 |
6 | const defaultWrapper = mount(Component, {
7 | propsData: {},
8 | slots: {
9 | default: 'Default slot',
10 | },
11 | })
12 |
13 | describe(`Loads and display ${ComponentName} component`, () => {
14 | it('has a name', () => {
15 | expect(Component.name).toMatch(ComponentName)
16 | })
17 | it('renders correctly', () => {
18 | expect(defaultWrapper.html()).toMatchSnapshot()
19 | })
20 | it('contain slots and classes', () => {
21 | expect(defaultWrapper.text()).toContain('Default slot')
22 | expect(defaultWrapper.classes('sidebar-header')).toBe(true)
23 | })
24 | })
25 |
--------------------------------------------------------------------------------
/packages/docs/api/footer/CFooter.api.md:
--------------------------------------------------------------------------------
1 | ### CFooter
2 |
3 | ```jsx
4 | import { CFooter } from '@coreui/vue'
5 | // or
6 | import CFooter from '@coreui/vue/src/components/footer/CFooter'
7 | ```
8 |
9 | #### Props
10 |
11 | | Prop name | Description | Type | Values | Default |
12 | | ------------ | --------------------------------------------------------------------------------------- | ------ | --------------------- | ------- |
13 | | **as** | Component used for the root node. Either a string to use a HTML element or a component. | string | - | 'div' |
14 | | **position** | Place footer in non-static positions. | string | `'fixed'`, `'sticky'` | - |
15 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/button-group/__tests__/CButtonToolbar.spec.ts:
--------------------------------------------------------------------------------
1 | import { mount } from '@vue/test-utils'
2 | import { CButtonToolbar as Component } from '../../../index'
3 |
4 | const ComponentName = 'CButtonToolbar'
5 |
6 | const defaultWrapper = mount(Component, {
7 | propsData: {},
8 | slots: {
9 | default: 'Default slot',
10 | },
11 | })
12 |
13 | describe(`Loads and display ${ComponentName} component`, () => {
14 | it('has a name', () => {
15 | expect(Component.name).toMatch(ComponentName)
16 | })
17 | it('renders correctly', () => {
18 | expect(defaultWrapper.html()).toMatchSnapshot()
19 | })
20 | it('contain slots and classes', () => {
21 | expect(defaultWrapper.text()).toContain('Default slot')
22 | expect(defaultWrapper.classes('btn-toolbar')).toBe(true)
23 | })
24 | })
25 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/offcanvas/__tests__/COffcanvasBody.spec.ts:
--------------------------------------------------------------------------------
1 | import { mount } from '@vue/test-utils'
2 | import { COffcanvasBody as Component } from '../../../index'
3 |
4 | const ComponentName = 'COffcanvasBody'
5 |
6 | const defaultWrapper = mount(Component, {
7 | propsData: {},
8 | slots: {
9 | default: 'Default slot',
10 | },
11 | })
12 |
13 | describe(`Loads and display ${ComponentName} component`, () => {
14 | it('has a name', () => {
15 | expect(Component.name).toMatch(ComponentName)
16 | })
17 | it('renders correctly', () => {
18 | expect(defaultWrapper.html()).toMatchSnapshot()
19 | })
20 | it('contain slots and classes', () => {
21 | expect(defaultWrapper.text()).toContain('Default slot')
22 | expect(defaultWrapper.classes('offcanvas-body')).toBe(true)
23 | })
24 | })
25 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/sidebar/__tests__/CSidebarToggler.spec.ts:
--------------------------------------------------------------------------------
1 | import { mount } from '@vue/test-utils'
2 | import { CSidebarToggler as Component } from '../../../index'
3 |
4 | const ComponentName = 'CSidebarToggler'
5 |
6 | const defaultWrapper = mount(Component, {
7 | propsData: {},
8 | slots: {
9 | default: 'Default slot',
10 | },
11 | })
12 |
13 | describe(`Loads and display ${ComponentName} component`, () => {
14 | it('has a name', () => {
15 | expect(Component.name).toMatch(ComponentName)
16 | })
17 | it('renders correctly', () => {
18 | expect(defaultWrapper.html()).toMatchSnapshot()
19 | })
20 | it('contain slots and classes', () => {
21 | expect(defaultWrapper.text()).toContain('Default slot')
22 | expect(defaultWrapper.classes('sidebar-toggler')).toBe(true)
23 | })
24 | })
25 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/widgets/__tests__/__snapshots__/CWidgetStatsD.spec.ts.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`Loads and display CWidgetStatsD component renders correctly 1`] = `
4 | "
6 |
15 | icon
7 | 75
8 | title
9 |
10 |
13 |
14 |
5 |
"
19 | `;
20 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/index.ts:
--------------------------------------------------------------------------------
1 | /* eslint-disable @typescript-eslint/no-explicit-any */
2 | import { App } from 'vue'
3 | import * as Components from './components'
4 | import * as Directives from './directives'
5 |
6 | const CoreuiVue = {
7 | install: (app: App): void => {
8 | for (const key in Components) {
9 | app.component(key, (Components as { [key: string]: any })[key])
10 | }
11 |
12 | for (const key in Directives) {
13 | app.directive(
14 | (Directives as { [key: string]: any })[key]['name'],
15 | (Directives as { [key: string]: any })[key],
16 | )
17 | }
18 | },
19 | }
20 |
21 | // Export library
22 | export default CoreuiVue
23 |
24 | // Export components & directives
25 | export * from './components'
26 | export * from './composables'
27 | export * from './directives'
28 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/card/__tests__/CCardImageOverlay.spec.ts:
--------------------------------------------------------------------------------
1 | import { mount } from '@vue/test-utils'
2 | import { CCardImageOverlay as Component } from '../../../index'
3 |
4 | const ComponentName = 'CCardImageOverlay'
5 |
6 | const defaultWrapper = mount(Component, {
7 | propsData: {},
8 | slots: {
9 | default: 'Default slot',
10 | },
11 | })
12 |
13 | describe(`Loads and display ${ComponentName} component`, () => {
14 | it('has a name', () => {
15 | expect(Component.name).toMatch(ComponentName)
16 | })
17 | it('renders correctly', () => {
18 | expect(defaultWrapper.html()).toMatchSnapshot()
19 | })
20 | it('contain slots and classes', () => {
21 | expect(defaultWrapper.text()).toContain('Default slot')
22 | expect(defaultWrapper.classes('card-img-overlay')).toBe(true)
23 | })
24 | })
25 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/carousel/__tests__/CCarouselCaption.spec.ts:
--------------------------------------------------------------------------------
1 | import { mount } from '@vue/test-utils'
2 | import { CCarouselCaption as Component } from '../../../index'
3 |
4 | const ComponentName = 'CCarouselCaption'
5 |
6 | const defaultWrapper = mount(Component, {
7 | propsData: {},
8 | slots: {
9 | default: 'Default slot',
10 | },
11 | })
12 |
13 | describe(`Loads and display ${ComponentName} component`, () => {
14 | it('has a name', () => {
15 | expect(Component.name).toMatch(ComponentName)
16 | })
17 | it('renders correctly', () => {
18 | expect(defaultWrapper.html()).toMatchSnapshot()
19 | })
20 | it('contain slots and classes', () => {
21 | expect(defaultWrapper.text()).toContain('Default slot')
22 | expect(defaultWrapper.classes('carousel-caption')).toBe(true)
23 | })
24 | })
25 |
--------------------------------------------------------------------------------
/packages/coreui-vue/src/components/modal/CModalHeader.ts:
--------------------------------------------------------------------------------
1 | import { defineComponent, h, inject, Ref } from 'vue'
2 |
3 | import { CCloseButton } from '../close-button/CCloseButton'
4 |
5 | const CModalHeader = defineComponent({
6 | name: 'CModalHeader',
7 | props: {
8 | /**
9 | * Add a close button component to the header.
10 | */
11 | closeButton: {
12 | type: Boolean,
13 | default: true,
14 | },
15 | },
16 | setup(props, { slots }) {
17 | const visible = injecticonchart
6 |
7 |
8 |
18 |
9 |
12 |
13 | bb
10 | aa
11 |
14 |
17 | dd
15 | cc
16 |