@volverjs/ui-vue 0.0.14 → 0.0.15

package/src/composables/useDefaults.ts

@@ -10,6 +10,53 @@ type VueProp
         | BooleanConstructor
         | PropType<unknown>
 
+type PropDefinition
+    = | VueProp
+        | VueProp[]
+        | { type: VueProp | VueProp[], default?: unknown }
+
+/**
+ * Returns the value a prop should take: either the provided `propValue` or the
+ * `componentDefault` when `propValue` still matches the prop definition default.
+ * The three checks are intentionally independent (an array definition satisfies
+ * both `Array.isArray` and `typeof === 'object'`).
+ */
+function resolveDefaultedProp(
+    definition: PropDefinition,
+    propValue: unknown,
+    componentDefault: unknown,
+): unknown {
+    let value = propValue
+    // array of types
+    if (Array.isArray(definition) && definition.length) {
+        const typeFunction = definition[0] as <T>() => T
+        if (typeFunction() === propValue) {
+            value = componentDefault
+        }
+    }
+    // single type
+    if (typeof definition === 'function') {
+        const typeFunction = definition as <T>() => T
+        if (typeFunction() === propValue) {
+            value = componentDefault
+        }
+    }
+    // object with type and default
+    if (typeof definition === 'object') {
+        let defaultValue = (definition as { default: unknown }).default
+        if (typeof defaultValue === 'function') {
+            defaultValue = defaultValue()
+        }
+        const matches = typeof defaultValue === 'object'
+            ? JSON.stringify(defaultValue) === JSON.stringify(propValue)
+            : defaultValue === propValue
+        if (matches) {
+            value = componentDefault
+        }
+    }
+    return value
+}
+
 export function useDefaults<Definition>(
     componentName: string,
     propsDefinition: Definition,
@@ -18,7 +65,7 @@ export function useDefaults<Definition>(
     const volver = useVolver()
 
     const volverComponentDefaults = computed(() => {
-        if (!volver || !volver.defaults.value?.[componentName]) {
+        if (!volver?.defaults.value?.[componentName]) {
             return undefined
         }
         return volver.defaults.value[componentName]
@@ -38,49 +85,13 @@ export function useDefaults<Definition>(
         const simplifiedProps = props as Record<string, unknown>
         return Object.keys(simplifiedPropsDefinition).reduce((acc, key) => {
             const propValue = simplifiedProps[key]
-            acc[key] = propValue
-            if (key in componentDefaults) {
-                // array of types
-                if (Array.isArray(simplifiedPropsDefinition[key])) {
-                    const typeArray = simplifiedPropsDefinition[
-                        key
-                    ] as VueProp[]
-                    if (typeArray.length) {
-                        const typeFunction = typeArray[0] as <T>() => T
-                        if (typeFunction === propValue) {
-                            acc[key] = componentDefaults[key]
-                        }
-                    }
-                }
-                // single type
-                if (typeof simplifiedPropsDefinition[key] === 'function') {
-                    const typeFunction = simplifiedPropsDefinition[key] as <
-                        T,
-                    >() => T
-                    if (typeFunction() === propValue) {
-                        acc[key] = componentDefaults[key]
-                    }
-                }
-                // object with type and default
-                if (typeof simplifiedPropsDefinition[key] === 'object') {
-                    let defaultValue = (
-                        simplifiedPropsDefinition[key] as { default: unknown }
-                    ).default
-                    if (typeof defaultValue === 'function') {
-                        defaultValue = defaultValue()
-                    }
-                    if (typeof defaultValue === 'object') {
-                        if (
-                            JSON.stringify(defaultValue)
-                            === JSON.stringify(propValue)
-                        ) {
-                            acc[key] = componentDefaults[key]
-                        }
-                    } else if (defaultValue === propValue) {
-                        acc[key] = componentDefaults[key]
-                    }
-                }
-            }
+            acc[key] = key in componentDefaults
+                ? resolveDefaultedProp(
+                        simplifiedPropsDefinition[key],
+                        propValue,
+                        componentDefaults[key],
+                    )
+                : propValue
             return acc
         }, {} as Record<string, unknown>) as Readonly<
             ExtractPropTypes<Definition>

package/src/composables/useModifiers.ts

@@ -2,7 +2,7 @@ import type { Ref } from 'vue'
 
 export function useModifiers(
     prefix: string,
-    modifiers?: Ref<string | string[] | unknown | unknown[] | undefined>,
+    modifiers?: Ref<unknown>,
     others?: Ref<Record<string, boolean>>,
 ) {
     return computed(() => {

package/src/index.ts

@@ -1,9 +1,9 @@
-import type { Volver, VolverOptions } from './Volver'
+import type { Volver } from './Volver'
 import VolverPlugin from './Volver'
 
 export { VolverPlugin }
 export * from './types'
-export type { Volver, VolverOptions }
+export type { Volver, VolverOptions } from './Volver'
 
 // https://vuejs.org/guide/typescript/options-api.html#augmenting-global-properties
 // Add custom property and extend vue type definition

package/src/resolvers/unplugin.ts

@@ -35,12 +35,12 @@ export interface VolverResolverOptions {
     cherryPick?: boolean
 }
 
-const STYLE_EXCLUDE = ['vv-icon', 'vv-action']
+const STYLE_EXCLUDE = new Set(['vv-icon', 'vv-action'])
 const VOLVER_PREFIX = 'vv'
-const DIRECTIVES = ['v-tooltip', 'v-contextmenu']
+const DIRECTIVES = new Set(['v-tooltip', 'v-contextmenu'])
 
 export function getStyleNames(kebabName: string) {
-    if (STYLE_EXCLUDE.includes(kebabName)) {
+    if (STYLE_EXCLUDE.has(kebabName)) {
         return undefined
     }
     if (kebabName === 'vv-dropdown') {
@@ -125,7 +125,7 @@ export function VolverResolver({
                     `${VOLVER_PREFIX}-`,
                 )
 
-                if (ignore && ignore.includes(kebabName)) {
+                if (ignore?.includes(kebabName)) {
                     return
                 }
 
@@ -153,11 +153,11 @@ export function VolverResolver({
                 const kebabName = `v-${kebabCase(name)}`
 
                 // filter directive
-                if (!DIRECTIVES.includes(kebabName)) {
+                if (!DIRECTIVES.has(kebabName)) {
                     return
                 }
 
-                if (ignore && ignore.includes(kebabName)) {
+                if (ignore?.includes(kebabName)) {
                     return
                 }
 

package/src/types/alert.ts

@@ -8,7 +8,7 @@ export type AlertModifier
         | 'danger'
         | 'brand'
         | 'accent'
-        | string
+        | (string & {})
 
 export type Alert = {
     id: string | number

package/src/types/nav.ts

@@ -9,7 +9,7 @@ export type NavItem = {
     disabled?: boolean
     current?: boolean
     class?: string | string[]
-    on?: Record<'click' | string, () => void>
+    on?: Record<'click' | (string & {}), () => void>
     data?: Record<string, unknown>
 }
 

package/src/utils/DateUtilities.ts

@@ -12,14 +12,14 @@ const padTwoDigits = (num: number) => num.toString().padStart(2, '0')
  * @param dateString
  * @returns True if valid ISO date string
  * @example
- * isDateIsoString('2021-12-31T23:59:59') // true
+ * isDateIsoString('2021-12-31T23:59:59.000Z') // true
  */
-const ISO_DATE_REGEX = /^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}(?:\.\d{1,3})?(?:Z|[+-]\d{2}:?\d{2})?$/
+// Canonical UTC form, matching what `Date.prototype.toISOString()` produces.
+const ISO_DATE_REGEX = /^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}\.\d{3}Z$/
 export function isDateIsoString(dateString: unknown) {
     if (typeof dateString !== 'string') {
         return false
     }
-    // Support both with/without milliseconds and timezone variations
     if (!ISO_DATE_REGEX.test(dateString)) {
         return false
     }

package/src/utils/DomUtilities.ts

@@ -2,9 +2,15 @@ export function findScrollContainer(element: HTMLElement | null) {
     if (!element) {
         return undefined
     }
+    if (
+        typeof globalThis.getComputedStyle !== 'function'
+        || typeof document === 'undefined'
+    ) {
+        return undefined
+    }
     let parent = element.parentElement
     while (parent) {
-        const { overflow } = window.getComputedStyle(parent)
+        const { overflow } = globalThis.getComputedStyle(parent)
         if (overflow.split(' ').every(item => item === 'auto' || item === 'scroll')) {
             return parent
         }

package/src/utils/ObjectUtilities.ts

@@ -22,67 +22,69 @@ export function equals(obj1: any, obj2: any, field?: string) {
  * @returns {boolean}
  */
 
-export function deepEquals(a: any, b: any) {
-    if (a === b)
-        return true
+function deepEqualsArray(a: any[], b: any[]) {
+    if (a.length !== b.length)
+        return false
+    for (let i = a.length; i-- !== 0;) {
+        if (!deepEquals(a[i], b[i]))
+            return false
+    }
+    return true
+}
 
-    if (a && b && typeof a == 'object' && typeof b == 'object') {
-        const arrA = Array.isArray(a)
-        const arrB = Array.isArray(b)
-        let i, length, key
-
-        if (arrA && arrB) {
-            length = a.length
-            if (length !== b.length)
-                return false
-            for (i = length; i-- !== 0;) {
-                if (!deepEquals(a[i], b[i]))
-                    return false
-            }
+function deepEqualsObject(a: any, b: any) {
+    const keys = Object.keys(a)
+    const { length } = keys
 
-            return true
-        }
+    if (length !== Object.keys(b).length)
+        return false
 
-        if (arrA !== arrB)
+    for (let i = length; i-- !== 0;) {
+        if (!Object.hasOwn(b, keys[i]))
             return false
+    }
 
-        const dateA = a instanceof Date
-        const dateB = b instanceof Date
-
-        if (dateA !== dateB)
+    for (let i = length; i-- !== 0;) {
+        const key = keys[i]
+        if (!deepEquals(a[key], b[key]))
             return false
-        if (dateA && dateB)
-            return a.getTime() === b.getTime()
+    }
 
-        const regexpA = a instanceof RegExp
-        const regexpB = b instanceof RegExp
+    return true
+}
 
-        if (regexpA !== regexpB)
-            return false
-        if (regexpA && regexpB)
-            return a.toString() === b.toString()
+export function deepEquals(a: any, b: any) {
+    if (a === b)
+        return true
 
-        const keys = Object.keys(a)
+    if (!a || !b || typeof a !== 'object' || typeof b !== 'object')
+        return Number.isNaN(a) && Number.isNaN(b)
 
-        length = keys.length
+    const arrA = Array.isArray(a)
+    const arrB = Array.isArray(b)
 
-        if (length !== Object.keys(b).length)
-            return false
+    if (arrA !== arrB)
+        return false
+    if (arrA && arrB)
+        return deepEqualsArray(a, b)
 
-        for (i = length; i-- !== 0;) {
-            if (!Object.hasOwn(b, keys[i]))
-                return false
-        }
+    const dateA = a instanceof Date
+    const dateB = b instanceof Date
 
-        for (i = length; i-- !== 0;) {
-            key = keys[i]
-            if (!deepEquals(a[key], b[key]))
-                return false
-        }
+    if (dateA !== dateB)
+        return false
+    if (dateA && dateB)
+        return a.getTime() === b.getTime()
 
-        return true
-    }
-    return Number.isNaN(a) && Number.isNaN(b)
+    const regexpA = a instanceof RegExp
+    const regexpB = b instanceof RegExp
+
+    if (regexpA !== regexpB)
+        return false
+    if (regexpA && regexpB)
+        return a.toString() === b.toString()
+
+    return deepEqualsObject(a, b)
 }
 
 /**
@@ -95,20 +97,19 @@ export function resolveFieldData(data: Record<string, unknown>, field: string) {
     if (data && Object.keys(data).length && field) {
         if (!field.includes('.')) {
             return data[field]
-        } else {
-            const fields = field.split('.')
-            let value = data
-
-            for (let i = 0, len = fields.length; i < len; ++i) {
-                if (data == null) {
-                    return null
-                }
+        }
+        const fields = field.split('.')
+        let value = data
 
-                value = value[fields[i]] as Record<string, unknown>
+        for (let i = 0, len = fields.length; i < len; ++i) {
+            if (value == null) {
+                return null
             }
 
-            return value
+            value = value[fields[i]] as Record<string, unknown>
         }
+
+        return value
     } else {
         return null
     }
@@ -120,7 +121,7 @@ export function resolveFieldData(data: Record<string, unknown>, field: string) {
  */
 
 export function isFunction(obj: any) {
-    return !!(obj && obj.constructor && obj.call && obj.apply)
+    return !!(obj?.constructor && obj.call && obj.apply)
 }
 
 /**
@@ -151,7 +152,7 @@ export function findIndexInList<Type = unknown>(value: Type, list: Type[]) {
  * @returns {boolean} the index
  */
 export function contains<Type = unknown>(value: Type, list: Type[]) {
-    if (value != null && list && list.length) {
+    if (value != null && list?.length) {
         for (const val of list) {
             if (equals(value, val)) {
                 return true