@coreui/vue-pro 4.8.0 → 4.8.2

package/src/components/footer/__tests__/__snapshots__/CFooter.spec.ts.snap

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

package/src/components/form/CForm.ts

@@ -6,10 +6,7 @@ const CForm = defineComponent({
     /**
      * Mark a form as validated. If you set it `true`, all validation styles will be applied to the forms component.
      */
-    validated: {
-      type: Boolean,
-      required: false,
-    },
+    validated: Boolean,
   },
   setup(props, { slots }) {
     return () =>

package/src/components/form/CFormCheck.ts

@@ -13,33 +13,25 @@ const CFormCheck = defineComponent({
      *
      * @see http://coreui.io/vue/docs/components/button.html
      */
-    button: {
-      type: Object,
-    },
+    button: Object,
     /**
      * Provide valuable, actionable feedback.
      *
      * @since 4.3.0
      */
-    feedback: {
-      type: String,
-    },
+    feedback: String,
     /**
      * Provide valuable, actionable feedback.
      *
      * @since 4.3.0
      */
-    feedbackInvalid: {
-      type: String,
-    },
+    feedbackInvalid: String,
     /**
      * Provide valuable, actionable invalid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`.
      *
      * @since 4.3.0
      */
-    feedbackValid: {
-      type: String,
-    },
+    feedbackValid: String,
     /**
      * Sets hit area to the full area of the component.
      */
@@ -53,9 +45,7 @@ const CFormCheck = defineComponent({
     /**
      * The id global attribute defines an identifier (ID) that must be unique in the whole document.
      */
-    id: {
-      type: String,
-    },
+    id: String,
     /**
      * Input Checkbox indeterminate Property
      */
@@ -63,9 +53,7 @@ const CFormCheck = defineComponent({
     /**
      * Group checkboxes or radios on the same horizontal row by adding.
      */
-    inline: {
-      type: Boolean,
-    },
+    inline: Boolean,
     /**
      * Set component validation state to invalid.
      */
@@ -73,9 +61,7 @@ const CFormCheck = defineComponent({
     /**
      * The element represents a caption for a component.
      */
-    label: {
-      type: String,
-    },
+    label: String,
     /**
      * The default name for a value passed using v-model.
      */
@@ -86,7 +72,7 @@ const CFormCheck = defineComponent({
     /**
      * Put checkboxes or radios on the opposite side.
      *
-     * @sinve 4.8.0
+     * @since 4.8.0
      */
     reverse: Boolean,
     /**
@@ -107,9 +93,7 @@ const CFormCheck = defineComponent({
     /**
      * Set component validation state to valid.
      */
-    valid: {
-      type: Boolean,
-    },
+    valid: Boolean,
   },
   emits: [
     /**

package/src/components/form/CFormControlValidation.ts

@@ -8,33 +8,25 @@ const CFormControlValidation = defineComponent({
     /**
      * @ignore
      */
-    describedby: {
-      type: String,
-    },
+    describedby: String,
     /**
      * Provide valuable, actionable feedback.
      *
      * @since 4.3.0
      */
-    feedback: {
-      type: String,
-    },
+    feedback: String,
     /**
      * Provide valuable, actionable feedback.
      *
      * @since 4.3.0
      */
-    feedbackInvalid: {
-      type: String,
-    },
+    feedbackInvalid: String,
     /**
      * Provide valuable, actionable invalid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`.
      *
      * @since 4.3.0
      */
-    feedbackValid: {
-      type: String,
-    },
+    feedbackValid: String,
     /**
      * Set component validation state to invalid.
      */

package/src/components/form/CFormControlWrapper.ts

@@ -14,31 +14,23 @@ const CFormControlWrapper = defineComponent({
      *
      * @since 4.3.0
      */
-    floatingLabel: {
-      type: String,
-    },
+    floatingLabel: String,
     /**
      * @ignore
      */
-    id: {
-      type: String,
-    },
+    id: String,
     /**
      * Add a caption for a component.
      *
      * @since 4.3.0
      */
-    label: {
-      type: String,
-    },
+    label: String,
     /**
      * Add helper text to the component.
      *
      * @since 4.3.0
      */
-    text: {
-      type: String,
-    },
+    text: String,
   },
   setup(props, { slots }) {
     const formControlValidation = () =>

package/src/components/form/CFormFeedback.ts

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

package/src/components/form/CFormInput.ts

@@ -9,10 +9,7 @@ const CFormInput = defineComponent({
     /**
      * Toggle the disabled state for the component.
      */
-    disabled: {
-      type: Boolean,
-      required: false,
-    },
+    disabled: Boolean,
 
     // Inherited Props from CFormControlWrapper
     /**
@@ -20,39 +17,29 @@ const CFormInput = defineComponent({
      *
      * @since 4.3.0
      */
-    feedback: {
-      type: String,
-    },
+    feedback: String,
     /**
      * Provide valuable, actionable feedback.
      *
      * @since 4.3.0
      */
-    feedbackInvalid: {
-      type: String,
-    },
+    feedbackInvalid: String,
     /**
      * Provide valuable, actionable invalid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`.
      *
      * @since 4.3.0
      */
-    feedbackValid: {
-      type: String,
-    },
+    feedbackValid: String,
     /**
      * Provide valuable, actionable valid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`.
      *
      * @since 4.3.0
      */
-    floatingLabel: {
-      type: String,
-    },
+    floatingLabel: String,
     /**
      * The id global attribute defines an identifier (ID) that must be unique in the whole document.
      */
-    id: {
-      type: String,
-    },
+    id: String,
     /**
      * Set component validation state to invalid.
      */
@@ -62,30 +49,19 @@ const CFormInput = defineComponent({
      *
      * @since 4.3.0
      */
-    label: {
-      type: String,
-    },
+    label: String,
     /**
      * The default name for a value passed using v-model.
      */
-    modelValue: {
-      type: [File, Number, String],
-      default: undefined,
-    },
+    modelValue: [File, Number, String],
     /**
      * Render the component styled as plain text. Removes the default form field styling and preserve the correct margin and padding. Recommend to use only along side `readonly`.
      */
-    plainText: {
-      type: Boolean,
-      required: false,
-    },
+    plainText: Boolean,
     /**
      * Toggle the readonly state for the component.
      */
-    readonly: {
-      type: Boolean,
-      required: false,
-    },
+    readonly: Boolean,
     /**
      * Size the component small or large.
      *
@@ -102,9 +78,7 @@ const CFormInput = defineComponent({
      *
      * @since 4.3.0
      */
-    text: {
-      type: String,
-    },
+    text: String,
     /**
      * Display validation feedback in a styled tooltip.
      *

package/src/components/form/CFormLabel.ts

@@ -6,11 +6,7 @@ const CFormLabel = defineComponent({
     /**
      * A string of all className you want to be applied to the component, and override standard className value.
      */
-    customClassName: {
-      type: [Array, String],
-      default: undefined,
-      required: false,
-    },
+    customClassName: [Array, String],
   },
   setup(props, { slots }) {
     return () =>

package/src/components/form/CFormRange.ts

@@ -7,61 +7,39 @@ const CFormRange = defineComponent({
     /**
      * Toggle the disabled state for the component.
      */
-    disabled: {
-      type: Boolean,
-      default: undefined,
-    },
+    disabled: Boolean,
     /**
      * Add a caption for a component.
      *
      * @since 4.3.0
      */
-    label: {
-      type: String,
-    },
+    label: String,
     /**
      * Specifies the maximum value for the component.
      */
-    max: {
-      type: Number,
-      default: undefined,
-    },
+    max: Number,
     /**
      * Specifies the minimum value for the component.
      */
-    min: {
-      type: Number,
-      default: undefined,
-    },
+    min: Number,
     /**
      * The default name for a value passed using v-model.
      */
-    modelValue: {
-      type: String,
-      value: undefined,
-    },
+    modelValue: String,
     /**
      * Toggle the readonly state for the component.
      */
-    readonly: {
-      type: Boolean,
-    },
+    readonly: Boolean,
     /**
      * Specifies the interval between legal numbers in the component.
      */
-    steps: {
-      type: Number,
-      default: undefined,
-    },
+    steps: Number,
     /**
      * The `value` attribute of component.
      *
      * @controllable onChange
      * */
-    value: {
-      type: Number,
-      default: undefined,
-    },
+    value: Number,
   },
   emits: [
     /**

package/src/components/form/CFormSelect.ts

@@ -16,47 +16,33 @@ const CFormSelect = defineComponent({
      *
      * @since 4.3.0
      */
-    feedback: {
-      type: String,
-    },
+    feedback: String,
     /**
      * Provide valuable, actionable feedback.
      *
      * @since 4.3.0
      */
-    feedbackInvalid: {
-      type: String,
-    },
+    feedbackInvalid: String,
     /**
      * Provide valuable, actionable invalid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`.
      *
      * @since 4.3.0
      */
-    feedbackValid: {
-      type: String,
-    },
+    feedbackValid: String,
     /**
      * Provide valuable, actionable valid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`.
      *
      * @since 4.3.0
      */
-    floatingLabel: {
-      type: String,
-    },
+    floatingLabel: String,
     /**
      * Specifies the number of visible options in a drop-down list.
      */
-    htmlSize: {
-      type: Number,
-      default: undefined,
-      required: false,
-    },
+    htmlSize: Number,
     /**
      * The id global attribute defines an identifier (ID) that must be unique in the whole document.
      */
-    id: {
-      type: String,
-    },
+    id: String,
     /**
      * Set component validation state to invalid.
      */
@@ -66,32 +52,21 @@ const CFormSelect = defineComponent({
      *
      * @since 4.3.0
      */
-    label: {
-      type: String,
-    },
+    label: String,
     /**
      * The default name for a value passed using v-model.
      */
     modelValue: {
       type: [String, Array] as PropType<string | string[]>,
-      default: undefined,
-      require: false,
-    },
-    multiple: {
-      type: Boolean,
-      required: false,
     },
+    multiple: Boolean,
     /**
      * Options list of the select component. Available keys: `label`, `value`, `disabled`.
      * Examples:
      * - `:options="[{ value: 'js', label: 'JavaScript' }, { value: 'html', label: 'HTML', disabled: true }]"`
      * - `:options="['js', 'html']"`
      */
-    options: {
-      type: Array as PropType<Option[] | string[]>,
-      default: undefined,
-      required: false,
-    },
+    options: Array as PropType<Option[] | string[]>,
     /**
      * Size the component small or large.
      *
@@ -99,8 +74,6 @@ const CFormSelect = defineComponent({
      */
     size: {
       type: String,
-      default: undefined,
-      require: false,
       validator: (value: string) => {
         return ['sm', 'lg'].includes(value)
       },
@@ -110,9 +83,7 @@ const CFormSelect = defineComponent({
      *
      * @since 4.3.0
      */
-    text: {
-      type: String,
-    },
+    text: String,
     /**
      * Display validation feedback in a styled tooltip.
      *

package/src/components/form/CFormSwitch.ts

@@ -9,32 +9,23 @@ const CFormSwitch = defineComponent({
     /**
      * The id global attribute defines an identifier (ID) that must be unique in the whole document
      */
-    id: {
-      type: String,
-    },
+    id: String,
     /**
      * Set component validation state to invalid.
      */
-    invalid: {
-      type: Boolean,
-    },
+    invalid: Boolean,
     /**
      * The element represents a caption for a component.
      */
-    label: {
-      type: String,
-    },
+    label: String,
     /**
      * The default name for a value passed using v-model.
      */
-    modelValue: {
-      type: [Boolean, String],
-      value: undefined,
-    },
+    modelValue: [Boolean, String],
     /**
      * Put checkboxes or radios on the opposite side.
      *
-     * @sinve 4.8.0
+     * @since 4.8.0
      */
     reverse: Boolean,
     /**
@@ -60,9 +51,7 @@ const CFormSwitch = defineComponent({
     /**
      * Set component validation state to valid.
      */
-    valid: {
-      type: Boolean,
-    },
+    valid: Boolean,
   },
   emits: [
     /**

package/src/components/form/CFormText.ts

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

package/src/components/form/CFormTextarea.ts

@@ -7,47 +7,35 @@ const CFormTextarea = defineComponent({
     /**
      * Toggle the disabled state for the component.
      */
-    disabled: {
-      type: Boolean,
-    },
+    disabled: Boolean,
     /**
      * Provide valuable, actionable feedback.
      *
      * @since 4.3.0
      */
-    feedback: {
-      type: String,
-    },
+    feedback: String,
     /**
      * Provide valuable, actionable feedback.
      *
      * @since 4.3.0
      */
-    feedbackInvalid: {
-      type: String,
-    },
+    feedbackInvalid: String,
     /**
      * Provide valuable, actionable invalid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`.
      *
      * @since 4.3.0
      */
-    feedbackValid: {
-      type: String,
-    },
+    feedbackValid: String,
     /**
      * Provide valuable, actionable valid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`.
      *
      * @since 4.3.0
      */
-    floatingLabel: {
-      type: String,
-    },
+    floatingLabel: String,
     /**
      * The id global attribute defines an identifier (ID) that must be unique in the whole document.
      */
-    id: {
-      type: String,
-    },
+    id: String,
     /**
      * Set component validation state to invalid.
      */
@@ -57,36 +45,25 @@ const CFormTextarea = defineComponent({
      *
      * @since 4.3.0
      */
-    label: {
-      type: String,
-    },
+    label: String,
     /**
      * The default name for a value passed using v-model.
      */
-    modelValue: {
-      type: String,
-      default: undefined,
-    },
+    modelValue: String,
     /**
      * Render the component styled as plain text. Removes the default form field styling and preserve the correct margin and padding. Recommend to use only along side `readonly`.
      */
-    plainText: {
-      type: Boolean,
-    },
+    plainText: Boolean,
     /**
      * Toggle the readonly state for the component.
      */
-    readonly: {
-      type: Boolean,
-    },
+    readonly: Boolean,
     /**
      * Add helper text to the component.
      *
      * @since 4.3.0
      */
-    text: {
-      type: String,
-    },
+    text: String,
     /**
      * Display validation feedback in a styled tooltip.
      *

package/src/components/form/CInputGroup.ts

@@ -10,8 +10,6 @@ const CInputGroup = defineComponent({
      */
     size: {
       type: String,
-      default: undefined,
-      required: false,
       validator: (value: string) => {
         return ['sm', 'lg'].includes(value)
       },

package/src/components/form/CInputGroupText.ts

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

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

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