@coreui/vue-pro 4.8.0 → 4.8.1

package/src/components/form/__tests__/__snapshots__/CFormInput.spec.ts.snap

@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Customize (two) CFormInput component renders correctly 1`] = `"<input class=\\"form-control form-control-color form-control-lg is-invalid is-valid\\" disabled=\\"\\" readonly=\\"\\" type=\\"color\\">"`;
+exports[`Customize (two) CFormInput component renders correctly 1`] = `"<input class="form-control form-control-color form-control-lg is-invalid is-valid" disabled="" readonly="" type="color">"`;
 
-exports[`Customize CFormInput component renders correctly 1`] = `"<input class=\\"form-control-plaintext form-control-color form-control-lg is-invalid is-valid\\" disabled=\\"\\" readonly=\\"\\" type=\\"color\\">"`;
+exports[`Customize CFormInput component renders correctly 1`] = `"<input class="form-control-plaintext form-control-color form-control-lg is-invalid is-valid" disabled="" readonly="" type="color">"`;
 
-exports[`Loads and display CFormInput component renders correctly 1`] = `"<input class=\\"form-control\\" type=\\"text\\">"`;
+exports[`Loads and display CFormInput component renders correctly 1`] = `"<input class="form-control" type="text">"`;

package/src/components/form/__tests__/__snapshots__/CFormLabel.spec.ts.snap

@@ -1,5 +1,5 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Customize CFormLabel component renders correctly 1`] = `"<label class=\\"bazinga\\">Default slot</label>"`;
+exports[`Customize CFormLabel component renders correctly 1`] = `"<label class="bazinga">Default slot</label>"`;
 
-exports[`Loads and display CFormLabel component renders correctly 1`] = `"<label class=\\"form-label\\">Default slot</label>"`;
+exports[`Loads and display CFormLabel component renders correctly 1`] = `"<label class="form-label">Default slot</label>"`;

package/src/components/form/__tests__/__snapshots__/CFormRange.spec.ts.snap

@@ -1,5 +1,5 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Customize CFormRange component renders correctly 1`] = `"<input class=\\"form-range\\" disabled=\\"\\" max=\\"400\\" min=\\"50\\" readonly=\\"\\" steps=\\"10\\" type=\\"range\\">"`;
+exports[`Customize CFormRange component renders correctly 1`] = `"<input class="form-range" disabled="" max="400" min="50" readonly="" steps="10" type="range">"`;
 
-exports[`Loads and display CFormRange component renders correctly 1`] = `"<input class=\\"form-range\\" type=\\"range\\">"`;
+exports[`Loads and display CFormRange component renders correctly 1`] = `"<input class="form-range" type="range">"`;

package/src/components/form/__tests__/__snapshots__/CFormSelect.spec.ts.snap

@@ -1,5 +1,5 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Customize CFormSelect component renders correctly 1`] = `"<select class=\\"form-select form-select-lg is-invalid is-valid\\" size=\\"200\\">Default slot</select>"`;
+exports[`Customize CFormSelect component renders correctly 1`] = `"<select class="form-select form-select-lg is-invalid is-valid" size="200">Default slot</select>"`;
 
-exports[`Loads and display CFormSelect component renders correctly 1`] = `"<select class=\\"form-select\\">Default slot</select>"`;
+exports[`Loads and display CFormSelect component renders correctly 1`] = `"<select class="form-select">Default slot</select>"`;

package/src/components/form/__tests__/__snapshots__/CFormSwitch.spec.ts.snap

@@ -1,9 +1,9 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Customize CFormSwitch component renders correctly 1`] = `"<div class=\\"form-check form-switch form-switch-lg is-invalid is-valid\\"><input class=\\"form-check-input is-invalid is-valid\\" id=\\"uniqueid\\" type=\\"radio\\"><label class=\\"form-label form-check-label\\" for=\\"uniqueid\\">some label</label></div>"`;
+exports[`Customize CFormSwitch component renders correctly 1`] = `"<div class="form-check form-switch form-switch-lg is-invalid is-valid"><input class="form-check-input is-invalid is-valid" id="uniqueid" type="radio"><label class="form-label form-check-label" for="uniqueid">some label</label></div>"`;
 
 exports[`Loads and display CFormSwitch component renders correctly 1`] = `
-"<div class=\\"form-check form-switch\\"><input class=\\"form-check-input\\" type=\\"checkbox\\">
+"<div class="form-check form-switch"><input class="form-check-input" type="checkbox">
   <!---->
 </div>"
 `;

package/src/components/form/__tests__/__snapshots__/CFormText.spec.ts.snap

@@ -1,5 +1,5 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Customize CFormText component renders correctly 1`] = `"<p class=\\"form-text\\">Default slot</p>"`;
+exports[`Customize CFormText component renders correctly 1`] = `"<p class="form-text">Default slot</p>"`;
 
-exports[`Loads and display CFormText component renders correctly 1`] = `"<div class=\\"form-text\\">Default slot</div>"`;
+exports[`Loads and display CFormText component renders correctly 1`] = `"<div class="form-text">Default slot</div>"`;

package/src/components/form/__tests__/__snapshots__/CFormTextarea.spec.ts.snap

@@ -1,5 +1,5 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Customize CFormTextarea component renders correctly 1`] = `"<textarea disabled=\\"\\" readonly=\\"\\" class=\\"form-control-plaintext is-invalid is-valid\\">Default slot</textarea>"`;
+exports[`Customize CFormTextarea component renders correctly 1`] = `"<textarea disabled="" readonly="" class="form-control-plaintext is-invalid is-valid">Default slot</textarea>"`;
 
-exports[`Loads and display CFormTextarea component renders correctly 1`] = `"<textarea class=\\"form-control\\">Default slot</textarea>"`;
+exports[`Loads and display CFormTextarea component renders correctly 1`] = `"<textarea class="form-control">Default slot</textarea>"`;

package/src/components/form/__tests__/__snapshots__/CInputGroup.spec.ts.snap

@@ -1,5 +1,5 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Customize CInputGroup component renders correctly 1`] = `"<div class=\\"input-group input-group-lg\\">Default slot</div>"`;
+exports[`Customize CInputGroup component renders correctly 1`] = `"<div class="input-group input-group-lg">Default slot</div>"`;
 
-exports[`Loads and display CInputGroup component renders correctly 1`] = `"<div class=\\"input-group\\">Default slot</div>"`;
+exports[`Loads and display CInputGroup component renders correctly 1`] = `"<div class="input-group">Default slot</div>"`;

package/src/components/form/__tests__/__snapshots__/CInputGroupText.spec.ts.snap

@@ -1,5 +1,5 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Customize CInputGroupText component renders correctly 1`] = `"<div class=\\"input-group-text\\">Default slot</div>"`;
+exports[`Customize CInputGroupText component renders correctly 1`] = `"<div class="input-group-text">Default slot</div>"`;
 
-exports[`Loads and display CInputGroupText component renders correctly 1`] = `"<span class=\\"input-group-text\\">Default slot</span>"`;
+exports[`Loads and display CInputGroupText component renders correctly 1`] = `"<span class="input-group-text">Default slot</span>"`;

package/src/components/grid/CCol.ts

@@ -29,8 +29,6 @@ const CCol = defineComponent({
      */
     xs: {
       type: [Boolean, Number, String, Object] as PropType<Col>,
-      default: undefined,
-      require: false,
     },
     /**
      * The number of columns/offset/order on small devices (<768px).
@@ -39,8 +37,6 @@ const CCol = defineComponent({
      */
     sm: {
       type: [Boolean, Number, String, Object] as PropType<Col>,
-      default: undefined,
-      require: false,
     },
     /**
      * The number of columns/offset/order on medium devices (<992px).
@@ -49,8 +45,6 @@ const CCol = defineComponent({
      */
     md: {
       type: [Boolean, Number, String, Object] as PropType<Col>,
-      default: undefined,
-      require: false,
     },
     /**
      * The number of columns/offset/order on large devices (<1200px).
@@ -59,8 +53,6 @@ const CCol = defineComponent({
      */
     lg: {
       type: [Boolean, Number, String, Object] as PropType<Col>,
-      default: undefined,
-      require: false,
     },
     /**
      * The number of columns/offset/order on X-Large devices (<1400px).
@@ -69,8 +61,6 @@ const CCol = defineComponent({
      */
     xl: {
       type: [Boolean, Number, String, Object] as PropType<Col>,
-      default: undefined,
-      require: false,
     },
     /**
      * The number of columns/offset/order on XX-Large devices (≥1400px).
@@ -79,8 +69,6 @@ const CCol = defineComponent({
      */
     xxl: {
       type: [Boolean, Number, String, Object] as PropType<Col>,
-      default: undefined,
-      require: false,
     },
   },
   setup(props, { slots }) {

package/src/components/grid/CContainer.ts

@@ -15,45 +15,27 @@ const CContainer = defineComponent({
     /**
      * Set container 100% wide until small breakpoint.
      */
-    sm: {
-      type: Boolean,
-      required: false,
-    },
+    sm: Boolean,
     /**
      * Set container 100% wide until medium breakpoint.
      */
-    md: {
-      type: Boolean,
-      required: false,
-    },
+    md: Boolean,
     /**
      * Set container 100% wide until large breakpoint.
      */
-    lg: {
-      type: Boolean,
-      required: false,
-    },
+    lg: Boolean,
     /**
      * Set container 100% wide until X-large breakpoint.
      */
-    xl: {
-      type: Boolean,
-      required: false,
-    },
+    xl: Boolean,
     /**
      * Set container 100% wide until XX-large breakpoint.
      */
-    xxl: {
-      type: Boolean,
-      required: false,
-    },
+    xxl: Boolean,
     /**
      * Set container 100% wide, spanning the entire width of the viewport.
      */
-    fluid: {
-      type: Boolean,
-      required: false,
-    },
+    fluid: Boolean,
   },
   setup(props, { slots }) {
     const repsonsiveClassNames: string[] = []

package/src/components/grid/CRow.ts

@@ -24,61 +24,37 @@ const CRow = defineComponent({
      *
      * @values { cols: 'auto' | number | string } | { gutter: number | string } | { gutterX: number | string } | { gutterY: number | string }
      */
-    xs: {
-      type: Object as () => BPObject,
-      default: undefined,
-      required: false,
-    },
+    xs: Object as () => BPObject,
     /**
      * The number of columns/offset/order on small devices (<768px).
      *
      * @values { cols: 'auto' | number | string } | { gutter: number | string } | { gutterX: number | string } | { gutterY: number | string }
      */
-    sm: {
-      type: Object as () => BPObject,
-      default: undefined,
-      required: false,
-      /**
-       * The number of columns/offset/order on medium devices (<992px).
-       *
-       * @values { cols: 'auto' | number | string } | { gutter: number | string } | { gutterX: number | string } | { gutterY: number | string }
-       */
-    },
-    md: {
-      type: Object as () => BPObject,
-      default: undefined,
-      required: false,
-    },
+    sm: Object as () => BPObject,
+    /**
+     * The number of columns/offset/order on medium devices (<992px).
+     *
+     * @values { cols: 'auto' | number | string } | { gutter: number | string } | { gutterX: number | string } | { gutterY: number | string }
+     */
+    md: Object as () => BPObject,
     /**
      * The number of columns/offset/order on large devices (<1200px).
      *
      * @values { cols: 'auto' | number | string } | { gutter: number | string } | { gutterX: number | string } | { gutterY: number | string }
      */
-    lg: {
-      type: Object as () => BPObject,
-      default: undefined,
-      required: false,
-    },
+    lg: Object as () => BPObject,
     /**
      * The number of columns/offset/order on X-Large devices (<1400px).
      *
      * @values { cols: 'auto' | number | string } | { gutter: number | string } | { gutterX: number | string } | { gutterY: number | string }
      */
-    xl: {
-      type: Object as () => BPObject,
-      default: undefined,
-      required: false,
-    },
+    xl: Object as () => BPObject,
     /**
      * The number of columns/offset/order on XX-Large devices (≥1400px).
      *
      * @values { cols: 'auto' | number | string } | { gutter: number | string } | { gutterX: number | string } | { gutterY: number | string }
      */
-    xxl: {
-      type: Object as () => BPObject,
-      default: undefined,
-      required: false,
-    },
+    xxl: Object as () => BPObject,
   },
   setup(props, { slots }) {
     const repsonsiveClassNames: string[] = []

package/src/components/grid/__tests__/__snapshots__/CCol.spec.ts.snap

@@ -1,5 +1,5 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Customize CCol component renders correctly 1`] = `"<div class=\\"col-xl col-lg-4 col-md-auto order-md-last offset-md-3\\">Default slot</div>"`;
+exports[`Customize CCol component renders correctly 1`] = `"<div class="col-xl col-lg-4 col-md-auto order-md-last offset-md-3">Default slot</div>"`;
 
-exports[`Loads and display CCol component renders correctly 1`] = `"<div class=\\"col\\">Default slot</div>"`;
+exports[`Loads and display CCol component renders correctly 1`] = `"<div class="col">Default slot</div>"`;

package/src/components/grid/__tests__/__snapshots__/CContainer.spec.ts.snap

@@ -1,5 +1,5 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Customize CContainer component renders correctly 1`] = `"<div class=\\"container-xl container-md container-fluid\\">Default slot</div>"`;
+exports[`Customize CContainer component renders correctly 1`] = `"<div class="container-xl container-md container-fluid">Default slot</div>"`;
 
-exports[`Loads and display CContainer component renders correctly 1`] = `"<div class=\\"container\\">Default slot</div>"`;
+exports[`Loads and display CContainer component renders correctly 1`] = `"<div class="container">Default slot</div>"`;

package/src/components/grid/__tests__/__snapshots__/CRow.spec.ts.snap

@@ -1,5 +1,5 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Customize CRow component renders correctly 1`] = `"<div class=\\"row row-cols-md-4 g-md-10 gx-md-11 gy-md-12\\">Default slot</div>"`;
+exports[`Customize CRow component renders correctly 1`] = `"<div class="row row-cols-md-4 g-md-10 gx-md-11 gy-md-12">Default slot</div>"`;
 
-exports[`Loads and display CRow component renders correctly 1`] = `"<div class=\\"row\\">Default slot</div>"`;
+exports[`Loads and display CRow component renders correctly 1`] = `"<div class="row">Default slot</div>"`;

package/src/components/header/CHeader.ts

@@ -10,8 +10,6 @@ const CHeader = defineComponent({
      */
     container: {
       type: [Boolean, String],
-      default: undefined,
-      required: false,
       validator: (value: boolean | string) => {
         return (
           typeof value === 'boolean' || ['sm', 'md', 'lg', 'xl', 'xxl', 'fluid'].includes(value)
@@ -25,8 +23,6 @@ const CHeader = defineComponent({
      */
     position: {
       type: String,
-      default: undefined,
-      required: false,
       validator: (value: string) => {
         return ['fixed', 'sticky'].includes(value)
       },

package/src/components/header/CHeaderBrand.ts

@@ -8,7 +8,6 @@ const CHeaderBrand = defineComponent({
      */
     component: {
       type: String,
-      required: false,
       default: 'a',
     },
   },

package/src/components/header/CHeaderNav.ts

@@ -8,7 +8,6 @@ const CHeaderNav = defineComponent({
      */
     component: {
       type: String,
-      required: false,
       default: 'ul',
     },
   },

package/src/components/header/__tests__/__snapshots__/CHeader.spec.ts.snap

@@ -1,9 +1,9 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Customize CHeader component renders correctly 1`] = `
-"<div class=\\"header header-fixed\\">
-  <div class=\\"container-lg\\">Default slot</div>
+"<div class="header header-fixed">
+  <div class="container-lg">Default slot</div>
 </div>"
 `;
 
-exports[`Loads and display CHeader component renders correctly 1`] = `"<div class=\\"header\\">Default slot</div>"`;
+exports[`Loads and display CHeader component renders correctly 1`] = `"<div class="header">Default slot</div>"`;

package/src/components/header/__tests__/__snapshots__/CHeaderBrand.spec.ts.snap

@@ -1,5 +1,5 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Customize CHeaderBrand component renders correctly 1`] = `"<div class=\\"header-brand\\">Default slot</div>"`;
+exports[`Customize CHeaderBrand component renders correctly 1`] = `"<div class="header-brand">Default slot</div>"`;
 
-exports[`Loads and display CHeaderBrand component renders correctly 1`] = `"<a class=\\"header-brand\\">Default slot</a>"`;
+exports[`Loads and display CHeaderBrand component renders correctly 1`] = `"<a class="header-brand">Default slot</a>"`;

package/src/components/header/__tests__/__snapshots__/CHeaderDivider.spec.ts.snap

@@ -1,3 +1,3 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Loads and display CHeaderDivider component renders correctly 1`] = `"<div class=\\"header-divider\\">Default slot</div>"`;
+exports[`Loads and display CHeaderDivider component renders correctly 1`] = `"<div class="header-divider">Default slot</div>"`;

package/src/components/header/__tests__/__snapshots__/CHeaderNav.spec.ts.snap

@@ -1,5 +1,5 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Customize CHeaderNav component renders correctly 1`] = `"<div class=\\"header-nav\\" role=\\"navigation\\">Default slot</div>"`;
+exports[`Customize CHeaderNav component renders correctly 1`] = `"<div class="header-nav" role="navigation">Default slot</div>"`;
 
-exports[`Loads and display CHeaderNav component renders correctly 1`] = `"<ul class=\\"header-nav\\" role=\\"navigation\\">Default slot</ul>"`;
+exports[`Loads and display CHeaderNav component renders correctly 1`] = `"<ul class="header-nav" role="navigation">Default slot</ul>"`;

package/src/components/header/__tests__/__snapshots__/CHeaderText.spec.ts.snap

@@ -1,3 +1,3 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Loads and display CHeaderText component renders correctly 1`] = `"<span class=\\"header-text\\">Default slot</span>"`;
+exports[`Loads and display CHeaderText component renders correctly 1`] = `"<span class="header-text">Default slot</span>"`;

package/src/components/header/__tests__/__snapshots__/CHeaderToggler.spec.ts.snap

@@ -1,5 +1,5 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Customize CHeaderToggler component renders correctly 1`] = `"<button class=\\"header-toggler\\" type=\\"button\\" aria-label=\\"Toggle navigation\\"><span class=\\"header-toggler-icon\\"></span></button>"`;
+exports[`Customize CHeaderToggler component renders correctly 1`] = `"<button class="header-toggler" type="button" aria-label="Toggle navigation"><span class="header-toggler-icon"></span></button>"`;
 
-exports[`Loads and display CHeaderToggler component renders correctly 1`] = `"<button class=\\"header-toggler\\" type=\\"button\\" aria-label=\\"Toggle navigation\\">Default slot</button>"`;
+exports[`Loads and display CHeaderToggler component renders correctly 1`] = `"<button class="header-toggler" type="button" aria-label="Toggle navigation">Default slot</button>"`;

package/src/components/image/CImage.ts

@@ -10,8 +10,6 @@ const CImage = defineComponent({
      */
     align: {
       type: String,
-      default: undefined,
-      required: false,
       validator: (value: string) => {
         return ['start', 'center', 'end'].includes(value)
       },
@@ -19,24 +17,15 @@ const CImage = defineComponent({
     /**
      * Make image responsive.
      */
-    fluid: {
-      type: Boolean,
-      required: false,
-    },
+    fluid: Boolean,
     /**
      * Make image rounded.
      */
-    rounded: {
-      type: Boolean,
-      required: false,
-    },
+    rounded: Boolean,
     /**
      * Give an image a rounded 1px border appearance.
      */
-    thumbnail: {
-      type: Boolean,
-      required: false,
-    },
+    thumbnail: Boolean,
   },
   setup(props) {
     return () =>

package/src/components/image/__tests__/__snapshots__/CImage.spec.ts.snap

@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Customize (two) CImage component renders correctly 1`] = `"<img class=\\"d-block mx-auto\\">"`;
+exports[`Customize (two) CImage component renders correctly 1`] = `"<img class="d-block mx-auto">"`;
 
-exports[`Customize CImage component renders correctly 1`] = `"<img class=\\"float-end img-fluid rounded img-thumbnail\\">"`;
+exports[`Customize CImage component renders correctly 1`] = `"<img class="float-end img-fluid rounded img-thumbnail">"`;
 
-exports[`Loads and display CImage component renders correctly 1`] = `"<img class=\\"\\">"`;
+exports[`Loads and display CImage component renders correctly 1`] = `"<img class="">"`;

package/src/components/link/CLink.ts

@@ -6,33 +6,22 @@ const CLink = defineComponent({
     /**
      * Toggle the active state for the component.
      */
-    active: {
-      type: Boolean,
-      required: false,
-    },
+    active: Boolean,
     /**
      * Component used for the root node. Either a string to use a HTML element or a component.
      */
     component: {
       type: String,
-      required: false,
       default: 'a',
     },
     /**
      * Toggle the disabled state for the component.
      */
-    disabled: {
-      type: Boolean,
-      required: false,
-    },
+    disabled: Boolean,
     /**
      * The href attribute specifies the URL of the page the link goes to.
      */
-    href: {
-      type: String,
-      default: undefined,
-      required: false,
-    },
+    href: String,
   },
   emits: [
     /**

package/src/components/link/__tests__/__snapshots__/CLink.spec.ts.snap

@@ -1,5 +1,5 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Customize CLink component renders correctly 1`] = `"<div class=\\"active disabled\\" aria-current=\\"page\\" href=\\"/bazinga\\">Default slot</div>"`;
+exports[`Customize CLink component renders correctly 1`] = `"<div class="active disabled" aria-current="page" href="/bazinga">Default slot</div>"`;
 
-exports[`Loads and display CLink component renders correctly 1`] = `"<a class=\\"disabled\\" aria-disabled=\\"true\\" tabindex=\\"-1\\">Default slot</a>"`;
+exports[`Loads and display CLink component renders correctly 1`] = `"<a class="disabled" aria-disabled="true" tabindex="-1">Default slot</a>"`;

package/src/components/list-group/CListGroup.ts

@@ -8,16 +8,12 @@ const CListGroup = defineComponent({
      */
     component: {
       type: String,
-      required: false,
       default: 'ul',
     },
     /**
      * Remove some borders and rounded corners to render list group items edge-to-edge in a parent component (e.g., `<CCard>`)
      */
-    flush: {
-      type: Boolean,
-      required: false,
-    },
+    flush: Boolean,
     /**
      * Specify a layout type.
      *
@@ -25,8 +21,6 @@ const CListGroup = defineComponent({
      */
     layout: {
       type: String,
-      default: undefined,
-      required: false,
       validator: (value: string) => {
         return [
           'horizontal',

package/src/components/list-group/CListGroupItem.ts

@@ -1,6 +1,6 @@
 import { defineComponent, h } from 'vue'
 
-import { Color } from '../props'
+import { Color } from '../../props'
 
 const CListGroupItem = defineComponent({
   name: 'CListGroupItem',
@@ -8,10 +8,7 @@ const CListGroupItem = defineComponent({
     /**
      * Toggle the active state for the component.
      */
-    active: {
-      type: Boolean,
-      required: false,
-    },
+    active: Boolean,
     /**
      * Sets the color context of the component to one of CoreUI’s themed colors.
      *
@@ -21,16 +18,12 @@ const CListGroupItem = defineComponent({
     /**
      * Toggle the disabled state for the component.
      */
-    disabled: {
-      type: Boolean,
-      required: false,
-    },
+    disabled: Boolean,
     /**
      * Component used for the root node. Either a string to use a HTML element or a component.
      */
     component: {
       type: String,
-      required: false,
       default: 'li',
     },
   },

package/src/components/list-group/__tests__/__snapshots__/CListGroup.spec.ts.snap

@@ -1,5 +1,5 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Customize CListGroup component renders correctly 1`] = `"<div class=\\"list-group list-group-flush list-group-horizontal-lg\\">Default slot</div>"`;
+exports[`Customize CListGroup component renders correctly 1`] = `"<div class="list-group list-group-flush list-group-horizontal-lg">Default slot</div>"`;
 
-exports[`Loads and display CListGroup component renders correctly 1`] = `"<ul class=\\"list-group\\">Default slot</ul>"`;
+exports[`Loads and display CListGroup component renders correctly 1`] = `"<ul class="list-group">Default slot</ul>"`;

package/src/components/list-group/__tests__/__snapshots__/CListGroupItem.spec.ts.snap

@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Customize (two) CListGroupItem component renders correctly 1`] = `"<button class=\\"list-group-item list-group-item-action active disabled\\" active=\\"true\\" disabled=\\"\\" aria-current=\\"true\\" aria-disabled=\\"true\\">Default slot</button>"`;
+exports[`Customize (two) CListGroupItem component renders correctly 1`] = `"<button class="list-group-item list-group-item-action active disabled" active="true" disabled="" aria-current="true" aria-disabled="true">Default slot</button>"`;
 
-exports[`Customize CListGroupItem component renders correctly 1`] = `"<div class=\\"list-group-item list-group-item-warning active disabled\\" aria-current=\\"true\\" aria-disabled=\\"true\\">Default slot</div>"`;
+exports[`Customize CListGroupItem component renders correctly 1`] = `"<div class="list-group-item list-group-item-warning active disabled" aria-current="true" aria-disabled="true">Default slot</div>"`;
 
-exports[`Loads and display CListGroupItem component renders correctly 1`] = `"<li class=\\"list-group-item\\">Default slot</li>"`;
+exports[`Loads and display CListGroupItem component renders correctly 1`] = `"<li class="list-group-item">Default slot</li>"`;

package/src/components/modal/CModal.ts

@@ -10,9 +10,9 @@ import {
   withDirectives,
 } from 'vue'
 
-import { CBackdrop } from './../backdrop/CBackdrop'
+import { CBackdrop } from '../backdrop/CBackdrop'
 
-import { executeAfterTransition } from './../../utils/transition'
+import { executeAfterTransition } from '../../utils/transition'
 
 const CModal = defineComponent({
   name: 'CModal',
@@ -50,10 +50,7 @@ const CModal = defineComponent({
     /**
      * A string of all className you want applied to the modal content component.
      */
-    contentClassName: {
-      type: String,
-      default: undefined,
-    },
+    contentClassName: String,
     /**
      * Set modal to covers the entire user viewport
      *
@@ -61,7 +58,6 @@ const CModal = defineComponent({
      */
     fullscreen: {
       type: [Boolean, String],
-      default: undefined,
       validator: (value: boolean | string) => {
         if (typeof value == 'string') {
           return ['sm', 'md', 'lg', 'xl', 'xxl'].includes(value)
@@ -82,9 +78,7 @@ const CModal = defineComponent({
     /**
      * Create a scrollable modal that allows scrolling the modal body.
      */
-    scrollable: {
-      type: Boolean,
-    },
+    scrollable: Boolean,
     /**
      * Size the component small, large, or extra large.
      *
@@ -92,7 +86,6 @@ const CModal = defineComponent({
      */
     size: {
       type: String,
-      default: undefined,
       validator: (value: string) => {
         return ['sm', 'lg', 'xl'].includes(value)
       },

package/src/components/modal/CModalHeader.ts

@@ -10,7 +10,6 @@ const CModalHeader = defineComponent({
      */
     closeButton: {
       type: Boolean,
-      required: false,
       default: true,
     },
   },