@coreui/vue-pro 5.8.1 → 5.10.0

package/src/components/date-range-picker/CDateRangePicker.ts

@@ -12,6 +12,8 @@ import { getInputIdOrName, getLocalDateFromString } from './utils'
 import { useDebouncedCallback } from '../../composables'
 import { Color } from '../props'
 
+import type { DisabledDate } from '../calendar/types'
+
 const CDateRangePicker = defineComponent({
   name: 'CDateRangePicker',
   props: {
@@ -187,7 +189,7 @@ const CDateRangePicker = defineComponent({
     /**
      * Specify the list of dates that cannot be selected.
      */
-    disabledDates: Array as PropType<Date[] | Date[][]>,
+    disabledDates: [Array, Date, Function] as PropType<DisabledDate | DisabledDate[]>,
     /**
      * Initial selected to date (range).
      */

package/src/components/multi-select/CMultiSelect.ts

@@ -8,7 +8,7 @@ import { CMultiSelectOptions } from './CMultiSelectOptions'
 import { CMultiSelectSelection } from './CMultiSelectSelection'
 
 import { useDropdownWithPopper } from '../../composables'
-import { getNextActiveElement } from '../../utils'
+import { getNextActiveElement, isEqual } from '../../utils'
 
 import {
   createOption,
@@ -401,7 +401,15 @@ const CMultiSelect = defineComponent({
         ) as Option[]
 
         if (_selected.length > 0) {
-          selected.value = selectOptions(props.multiple, _selected, selected.value, deselected)
+          const newSelectedValue = selectOptions(
+            props.multiple,
+            _selected,
+            selected.value,
+            deselected,
+          )
+          if (!isEqual(newSelectedValue, selected.value)) {
+            selected.value = newSelectedValue
+          }
         }
       },
       { immediate: true },

package/src/components/nav/CNavGroup.ts

@@ -41,7 +41,10 @@ const CNavGroup = defineComponent({
 
     onMounted(() => {
       visible.value = props.visible
-      props.visible && navGroupRef.value.classList.add('show')
+      if (props.visible) {
+        navGroupRef.value.classList.add('show')
+      }
+
       emit('visible-change', visible.value)
     })
 
@@ -60,7 +63,8 @@ const CNavGroup = defineComponent({
       emit('visible-change', visible.value)
     })
 
-    const handleTogglerClick = () => {
+    const handleTogglerClick = (event: Event) => {
+      event.preventDefault()
       visible.value = !visible.value
       emit('visible-change', visible.value)
     }
@@ -111,6 +115,7 @@ const CNavGroup = defineComponent({
               'a',
               {
                 class: ['nav-link', 'nav-group-toggle'],
+                href: '#',
                 onClick: handleTogglerClick,
               },
               slots.togglerContent && slots.togglerContent(),

package/src/components/range-slider/CRangeSlider.ts

@@ -240,7 +240,12 @@ const CRangeSlider = defineComponent({
     }
 
     const handleInputsContainerMouseDown = (event: MouseEvent) => {
-      if (!trackRef.value || event.button !== 0) return
+      if (!trackRef.value || event.button !== 0 || props.disabled) return
+
+      const target = event.target as HTMLDivElement | HTMLInputElement
+      if (!(target instanceof HTMLInputElement) && target !== trackRef.value) {
+        return
+      }
 
       const clickValue = calculateClickValue(
         event,
@@ -266,7 +271,7 @@ const CRangeSlider = defineComponent({
     }
 
     const handleMouseMove = (event: MouseEvent) => {
-      if (!isDragging.value || !trackRef.value) return
+      if (!isDragging.value || !trackRef.value || props.disabled) return
 
       const moveValue = calculateMoveValue(
         event,

package/src/utils/index.ts

@@ -1,8 +1,17 @@
 import getNextActiveElement from './getNextActiveElement'
 import getRTLPlacement from './getRTLPlacement'
 import getUID from './getUID'
+import isEqual from './isEqual'
 import isInViewport from './isInViewport'
 import isObjectInArray from './isObjectInArray'
 import isRTL from './isRTL'
 
-export { getNextActiveElement, getRTLPlacement, getUID, isInViewport, isObjectInArray, isRTL }
+export {
+  getNextActiveElement,
+  getRTLPlacement,
+  getUID,
+  isEqual,
+  isInViewport,
+  isObjectInArray,
+  isRTL,
+}

package/src/utils/isEqual.ts

@@ -0,0 +1,75 @@
+const isEqual = (a: unknown, b: unknown): boolean => {
+  if (a === b) return true
+
+  // Handle cases where either a or b is null or not an object
+  if (a === null || b === null || typeof a !== 'object' || typeof b !== 'object') {
+    // Handle NaN case
+    return a !== a && b !== b
+  }
+
+  // Different constructors mean objects are not equal
+  if (a.constructor !== b.constructor) return false
+
+  // Handle Arrays
+  if (Array.isArray(a) && Array.isArray(b)) {
+    if (a.length !== b.length) return false
+    for (const [i, element] of a.entries()) {
+      const element2 = typeof b[i] === 'object' ? { ...b[i] } : b[i]
+      if (!isEqual(element, element2)) return false
+    }
+    return true
+  }
+
+  // Handle Maps
+  if (a instanceof Map && b instanceof Map) {
+    if (a.size !== b.size) return false
+    for (const [key, value] of a) {
+      if (!b.has(key) || !isEqual(value, b.get(key))) return false
+    }
+    return true
+  }
+
+  // Handle Sets
+  if (a instanceof Set && b instanceof Set) {
+    if (a.size !== b.size) return false
+    for (const value of a) {
+      if (!b.has(value)) return false
+    }
+    return true
+  }
+
+  // Handle RegExp
+  if (a instanceof RegExp && b instanceof RegExp) {
+    return a.source === b.source && a.flags === b.flags
+  }
+
+  // Handle objects with custom valueOf or toString
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  if (a.valueOf !== Object.prototype.valueOf && a.valueOf() !== (b as any).valueOf()) return false
+
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  if (a.toString !== Object.prototype.toString && a.toString() !== (b as any).toString())
+    return false
+
+  // Compare object keys
+  const aKeys = Object.keys(a)
+  const bKeys = Object.keys(b)
+
+  if (aKeys.length !== bKeys.length) return false
+
+  // Ensure all keys in a are present in b
+  for (const key of aKeys) {
+    if (!Object.prototype.hasOwnProperty.call(b, key)) return false
+  }
+
+  // Deep compare each property
+  for (const key of aKeys) {
+    if (!isEqual((a as Record<string, unknown>)[key], (b as Record<string, unknown>)[key])) {
+      return false
+    }
+  }
+
+  return true
+}
+
+export default isEqual