@bagelink/vue 1.5.15 → 1.5.20

package/src/composables/useAddToCalendar.ts

@@ -14,7 +14,7 @@ export type CalendarProvider = 'google' | 'apple' | 'outlook' | 'outlookcom' | '
 export function useAddToCalendar(event: CalendarEvent) {
 	// Parse dates if they're strings
 	const parseDate = (date: Date | string): Date => {
-		return typeof date === 'string' ? new Date(date) : date
+		return 'string' === typeof date ? new Date(date) : date
 	}
 
 	const eventStartDate = parseDate(event.startDate)
@@ -33,7 +33,7 @@ export function useAddToCalendar(event: CalendarEvent) {
 
 	// Check if location is a URL
 	const isUrl = (text?: string): boolean => {
-		if (!text || text.length === 0) {
+		if (!text || 0 === text.length) {
 			return false
 		}
 		return /^https?:\/\/.+/.test(text.trim())
@@ -77,13 +77,13 @@ export function useAddToCalendar(event: CalendarEvent) {
 			`SUMMARY:${event.title}`,
 		]
 
-		if (event.description && event.description.length > 0) {
+		if (event.description && 0 < event.description.length) {
 			// ICS descriptions need special handling of newlines and character limits
 			const description = event.description.replace(/\n/g, '\\n')
 			icsContent.push(`DESCRIPTION:${description}`)
 		}
 
-		if (event.location && event.location.length > 0) {
+		if (event.location && 0 < event.location.length) {
 			icsContent.push(`LOCATION:${event.location}`)
 			// If location is a URL, also add it as the URL field
 			if (locationIsUrl) {
@@ -104,11 +104,11 @@ export function useAddToCalendar(event: CalendarEvent) {
 			dates: `${formatDateISO(eventStartDate)}/${formatDateISO(eventEndDate)}`,
 		})
 
-		if (event.description && event.description.length > 0) {
+		if (event.description && 0 < event.description.length) {
 			params.append('details', event.description)
 		}
 
-		if (event.location && event.location.length > 0) {
+		if (event.location && 0 < event.location.length) {
 			params.append('location', event.location)
 		}
 
@@ -125,11 +125,11 @@ export function useAddToCalendar(event: CalendarEvent) {
 			enddt: eventEndDate.toISOString(),
 		})
 
-		if (event.description && event.description.length > 0) {
+		if (event.description && 0 < event.description.length) {
 			params.append('body', event.description)
 		}
 
-		if (event.location && event.location.length > 0) {
+		if (event.location && 0 < event.location.length) {
 			params.append('location', event.location)
 		}
 
@@ -146,11 +146,11 @@ export function useAddToCalendar(event: CalendarEvent) {
 			enddt: eventEndDate.toISOString(),
 		})
 
-		if (event.description && event.description.length > 0) {
+		if (event.description && 0 < event.description.length) {
 			params.append('body', event.description)
 		}
 
-		if (event.location && event.location.length > 0) {
+		if (event.location && 0 < event.location.length) {
 			params.append('location', event.location)
 		}
 
@@ -168,11 +168,11 @@ export function useAddToCalendar(event: CalendarEvent) {
 			dur: duration.toString(),
 		})
 
-		if (event.description && event.description.length > 0) {
+		if (event.description && 0 < event.description.length) {
 			params.append('desc', event.description)
 		}
 
-		if (event.location && event.location.length > 0) {
+		if (event.location && 0 < event.location.length) {
 			params.append('in_loc', event.location)
 		}
 
@@ -214,7 +214,7 @@ export function useAddToCalendar(event: CalendarEvent) {
 
 	// Add to calendar action
 	const addToCalendar = (provider: CalendarProvider) => {
-		if (provider === 'apple' || provider === 'ics') {
+		if ('apple' === provider || 'ics' === provider) {
 			downloadICS()
 		} else {
 			const url = getCalendarUrl(provider)

package/src/composables/useDevice.ts

@@ -2,7 +2,7 @@ import { onMounted, onUnmounted, ref } from 'vue'
 
 export function useDevice() {
 	const innerWidth = ref(window.innerWidth)
-	const isMobile = ref(window.innerWidth < 768)
+	const isMobile = ref(768 > window.innerWidth)
 	const scrollY = ref(window.scrollY)
 	const scrollX = ref(window.scrollX)
 	const innerHeight = ref(window.innerHeight)
@@ -20,7 +20,7 @@ export function useDevice() {
 
 		// Update current values
 		innerWidth.value = window.innerWidth
-		isMobile.value = window.innerWidth < 768
+		isMobile.value = 768 > window.innerWidth
 		scrollY.value = window.scrollY
 		scrollX.value = window.scrollX
 		innerHeight.value = window.innerHeight

package/src/composables/useExcel.ts

@@ -65,7 +65,7 @@ export function useExcel() {
 		const XLSX = await ensureXLSXLoaded()
 
 		const formattedData = formatData(data, schema)
-		const headers = schema.length > 0
+		const headers = 0 < schema.length
 			? schema.map((sf) => {
 				const { id, label } = sf as unknown as Field<T>
 				return { v: (label as any) || (id as any), t: 's' }
@@ -73,7 +73,7 @@ export function useExcel() {
 			: []
 		const ws = XLSX.utils.json_to_sheet(formattedData)
 
-		if (headers.length > 0) {
+		if (0 < headers.length) {
 			XLSX.utils.sheet_add_aoa(ws, [headers.map(h => h.v)], { origin: 'A1' })
 		}
 
@@ -124,7 +124,7 @@ export function useExcel() {
 		// Read the raw sheet data as arrays
 		const rawSheetData = XLSX.utils.sheet_to_json(worksheet, { header: 1 }) as any[][]
 
-		if (rawSheetData.length === 0) {
+		if (0 === rawSheetData.length) {
 			return { headers: [], data: [] }
 		}
 
@@ -196,10 +196,10 @@ export function useExcel() {
 	// Helper function for date detection and conversion
 	function isExcelSerialDate(value: any): boolean {
 		return (
-			typeof value === 'number'
+			 'number' === typeof value
 			&& Number.isInteger(value)
-			&& value >= 20000
-			&& value <= 50000
+			&& 20000 <= value 
+			&& 50000 >= value 
 		)
 	}
 

package/src/composables/useFormField.ts

@@ -12,21 +12,17 @@ export function useFormField<T>(props: {
 
 	const fieldData = computed({
 		get: () => {
-			if (!props.fieldID || !formState) return props.modelValue ?? props.field.defaultValue ?? ''
+			if (!props.fieldID || !formState) {return props.modelValue ?? props.field.defaultValue ?? ''}
 			const value = formState.getFieldData(props.fieldID)
 			// For nested form containers, default to empty object
-			if (props.field.$el === 'form' && !value) return {}
-			// If no value is set yet and a defaultValue exists, write it into form state once
-			if ((value === undefined || value === null || value === '') && props.field.defaultValue !== undefined) {
-				formState.updateField(props.fieldID, props.field.defaultValue)
-				return props.field.defaultValue
-			}
+			if ('form' === props.field.$el && !value) {return {}}
+			// Don't auto-restore defaultValue - let user control their content
 			return value ?? ''
 		},
 		set: (val: any) => {
-			if (!props.fieldID || !formState) return
+			if (!props.fieldID || !formState) {return}
 			const currentValue = formState.getFieldData(props.fieldID)
-			if (JSON.stringify(val) === JSON.stringify(currentValue)) return
+			if (JSON.stringify(val) === JSON.stringify(currentValue)) {return}
 
 			if (props.field.onUpdate) {
 				props.field.onUpdate(val, currentValue)

package/src/composables/usePolling.ts

@@ -25,13 +25,13 @@ export function usePolling(
 	const pollingId = ref<number | null>(null)
 
 	const isTabActive = () => {
-		return !pauseInBackground || document.visibilityState === 'visible'
+		return !pauseInBackground || 'visible' === document.visibilityState
 	}
 
 	// Stop polling permanently - cannot be resumed
 	const stopPolling = () => {
 		isPolling.value = false // Permanently set to false
-		if (pollingId.value !== null) {
+		if (null !== pollingId.value) {
 			clearTimeout(pollingId.value)
 			pollingId.value = null
 		}
@@ -39,7 +39,7 @@ export function usePolling(
 
 	// Pause polling temporarily - can be resumed
 	const pausePolling = () => {
-		if (pollingId.value !== null) {
+		if (null !== pollingId.value) {
 			clearTimeout(pollingId.value)
 			pollingId.value = null
 		}
@@ -49,7 +49,7 @@ export function usePolling(
 	// Start polling with intelligent checks
 	const startPolling = () => {
 		// Clear any existing polling timeout
-		if (pollingId.value !== null) {
+		if (null !== pollingId.value) {
 			clearTimeout(pollingId.value)
 			pollingId.value = null
 		}
@@ -70,13 +70,13 @@ export function usePolling(
 	}
 
 	const resumePolling = () => {
-		if (isPolling.value) startPolling()
-		else console.warn('Cannot resume polling that was stopped')
+		if (isPolling.value) {startPolling()}
+		else {console.warn('Cannot resume polling that was stopped')}
 	}
 
 	function updateVisibility() {
-		if (document.visibilityState === 'visible') {
-			if (isPolling.value) startPolling()
+		if ('visible' === document.visibilityState) {
+			if (isPolling.value) {startPolling()}
 		} else if (pauseInBackground) {
 			pausePolling()
 		}

package/src/composables/useSchemaField.ts

@@ -40,19 +40,19 @@ export function useSchemaField<T extends { [key: string]: any }>(optns: UseSchem
 
 	// Helper function to render objects recursively
 	function renderObject(obj: T, depth = 0): string {
-		if (obj === null || obj === undefined) return ''
-		if (typeof obj !== 'object') return String(obj)
-		if (Array.isArray(obj)) return obj.map(item => renderObject(item, depth + 1)).join(', ')
+		if (null === obj || obj === undefined) {return ''}
+		if ('object' !== typeof obj) {return String(obj)}
+		if (Array.isArray(obj)) {return obj.map(item => renderObject(item, depth + 1)).join(', ')}
 
 		// For objects, format as key: value pairs
-		const indent = depth > 0 ? '  '.repeat(depth) : ''
+		const indent = 0 < depth ? '  '.repeat(depth) : ''
 		const nextIndent = '  '.repeat(depth + 1)
 
 		const entries = Object.entries(obj)
-		if (entries.length === 0) return '{}'
+		if (0 === entries.length) {return '{}'}
 
 		// For nested objects, format with newlines and indentation
-		if (depth > 0) {
+		if (0 < depth) {
 			return `{\n${entries
 				.map(([key, value]) => `${nextIndent}${key}: ${renderObject(value, depth + 1)}`)
 				.join(',\n')}\n${indent}}`
@@ -61,7 +61,7 @@ export function useSchemaField<T extends { [key: string]: any }>(optns: UseSchem
 		// For top-level objects, format as a flat list
 		return entries
 			.map(([key, value]) => {
-				const valueStr = typeof value === 'object' && value !== null
+				const valueStr = 'object' === typeof value && null !== value 
 					? renderObject(value, depth + 1)
 					: String(value)
 				return `${key}: ${valueStr}`
@@ -90,18 +90,18 @@ export function useSchemaField<T extends { [key: string]: any }>(optns: UseSchem
 			email: EmailInput
 		}
 
-		if (field.$el === 'textarea' && !field.attrs?.multiline) {
+		if ('textarea' === field.$el && !field.attrs?.multiline) {
 			field.attrs = { ...field.attrs, multiline: true }
 		}
 
-		return typeof field.$el === 'object'
+		return 'object' === typeof field.$el
 			? field.$el
 			: (componentMap[field.$el as keyof typeof componentMap] ?? field.$el ?? 'div')
 	}
 
 	function renderChild(child: SchemaChild<T, Path<T>>, slots?: BaseBagelField<T, Path<T>>['slots']) {
-		if (typeof child === 'string') return child
-		if (isVNode(child)) return child
+		if ('string' === typeof child) {return child}
+		if (isVNode(child)) {return child}
 		return renderField(
 			child as BaseBagelField<T, Path<T>>,
 			slots
@@ -113,14 +113,14 @@ export function useSchemaField<T extends { [key: string]: any }>(optns: UseSchem
 		slots?: BaseBagelField<T, Path<T>>['slots']
 	): VNode | undefined {
 		const Component = getComponent(field as Field<T>)
-		if (!Component) return
+		if (!Component) {return}
 
 		const rowData = (getFormData?.() || {}) as T | undefined
 
 		// Check vIf condition first
 		const condition = field.vIf ?? field['v-if']
 		if (condition !== undefined) {
-			if (typeof condition === 'function') {
+			if ('function' === typeof condition) {
 				// Compute currentValue for the vIf check
 				const vIfCurrentValue = field.id
 					? ('get' in (rowData || {})
@@ -134,7 +134,7 @@ export function useSchemaField<T extends { [key: string]: any }>(optns: UseSchem
 				if (!vIfResult) {
 					return
 				}
-			} else if (typeof condition === 'string') {
+			} else if ('string' === typeof condition) {
 				if (!getNestedValue(rowData, condition)) {
 					return
 				}
@@ -156,6 +156,7 @@ export function useSchemaField<T extends { [key: string]: any }>(optns: UseSchem
 			label,
 			placeholder,
 			disabled,
+			defaultValue,
 			...fieldProps
 		} = field
 
@@ -177,9 +178,9 @@ export function useSchemaField<T extends { [key: string]: any }>(optns: UseSchem
 		const boundFieldProps = bindAttrs(fieldProps as Attributes<T, Path<T>> | undefined, currentValue, rowData)
 
 		// Check if this component should receive value as slot
-		const isSlotValueComponent = typeof Component === 'string' && SLOT_VALUE_COMPONENTS.has(Component)
+		const isSlotValueComponent = 'string' === typeof Component && SLOT_VALUE_COMPONENTS.has(Component)
 		// Check if this component should receive value as src
-		const isSrcValueComponent = typeof Component === 'string' && SRC_VALUE_COMPONENTS.has(Component)
+		const isSrcValueComponent = 'string' === typeof Component && SRC_VALUE_COMPONENTS.has(Component)
 
 		const props: { [key: string]: any } = {
 			...boundFieldProps,
@@ -191,10 +192,24 @@ export function useSchemaField<T extends { [key: string]: any }>(optns: UseSchem
 			id,
 			getFormData,
 			onUpdate,
+			defaultValue,
+		}
+
+		// Special handling for FieldArray component to pass attrs.schema as schema prop
+		if (Component === FieldArray && field.attrs?.schema) {
+			props.schema = field.attrs.schema
+		}
+		// Special handling for FieldArray component to pass attrs.type as type prop
+		if (Component === FieldArray && field.attrs?.type) {
+			props.type = field.attrs.type
+		}
+		// Special handling for FieldArray component to pass collapsed prop
+		if (Component === FieldArray && 'collapsed' in field) {
+			props.collapsed = (field as any).collapsed
 		}
 
 		// Wire top-level onClick with conditional args
-		if (typeof (field as any).onClick === 'function') {
+		if ('function' === typeof (field as any).onClick) {
 			const original = (field as any).onClick as (val?: any, row?: T) => void
 			props.onClick = () => {
 				if (id) {
@@ -206,7 +221,7 @@ export function useSchemaField<T extends { [key: string]: any }>(optns: UseSchem
 		}
 
 		// For form mode, always use the original value for modelValue
-		if (mode === 'form') {
+		if ('form' === mode) {
 			props.modelValue = currentValue
 			props['onUpdate:modelValue'] = (value: any) => {
 				onUpdateModelValue?.(field, value)
@@ -233,7 +248,7 @@ export function useSchemaField<T extends { [key: string]: any }>(optns: UseSchem
 		if (field.options) {
 			if (Array.isArray(field.options)) {
 				props.options = field.options
-			} else if (typeof field.options === 'function') {
+			} else if ('function' === typeof field.options) {
 				const fn = field.options as any
 				// Component-aware mapping
 				if (Component === SelectInput) {
@@ -241,18 +256,18 @@ export function useSchemaField<T extends { [key: string]: any }>(optns: UseSchem
 						const row = getFormData?.()
 						const val = currentValue
 						// If author expects (query) only, call directly
-						if (typeof fn === 'function' && fn.length === 1) {
+						if ('function' === typeof fn && 1 === fn.length) {
 							return fn(query)
 						}
 						// If author expects (query, val, row), pass it directly
-						if (typeof fn === 'function' && fn.length >= 3) {
+						if ('function' === typeof fn && 3 <= fn.length) {
 							return fn(query, val, row)
 						}
 						// Otherwise evaluate (val,row) → array | (query)=>Promise | Promise
 						const out = fn(val, row)
-						if (Array.isArray(out)) return out
-						if (typeof out === 'function') return out(query)
-						if (out && typeof out.then === 'function') return out
+						if (Array.isArray(out)) {return out}
+						if ('function' === typeof out) {return out(query)}
+						if (out && 'function' === typeof out.then) {return out}
 						return []
 					}
 				} else {
@@ -261,10 +276,10 @@ export function useSchemaField<T extends { [key: string]: any }>(optns: UseSchem
 						const row = getFormData?.()
 						const val = currentValue
 						const out = fn(val, row)
-						if (Array.isArray(out)) return out
-						if (typeof out === 'function') return await out('')
-						if (out && typeof out.then === 'function') return await out
-						if (fn.length >= 3) return await fn('', val, row)
+						if (Array.isArray(out)) {return out}
+						if ('function' === typeof out) {return await out('')}
+						if (out && 'function' === typeof out.then) {return await out}
+						if (3 <= fn.length) {return await fn('', val, row)}
 						return []
 					}
 				}
@@ -278,10 +293,10 @@ export function useSchemaField<T extends { [key: string]: any }>(optns: UseSchem
 			const boundAttrs = bindAttrs(field.attrs, currentValue, rowData)
 			Object.entries(boundAttrs).forEach(([key, value]) => {
 				// Skip $el as it's not a DOM attribute
-				if (key === '$el') return
+				if ('$el' === key) {return}
 
-				if (typeof value === 'function') {
-					if (key === 'onClick') {
+				if ('function' === typeof value) {
+					if ('onClick' === key) {
 						const original = value as (val?: any, row?: T) => void
 						props.onClick = () => {
 							if (id) {
@@ -309,7 +324,7 @@ export function useSchemaField<T extends { [key: string]: any }>(optns: UseSchem
 		const componentSlots: Parameters<typeof h>[1] = {}
 
 		// Add default slot if there are children
-		if (children && children.length > 0) {
+		if (children && 0 < children.length) {
 			componentSlots.default = () => children
 				.map(child => renderChild(child, slots))
 				.filter(Boolean) // Filter out null results from vIf
@@ -327,7 +342,7 @@ export function useSchemaField<T extends { [key: string]: any }>(optns: UseSchem
 					if (Array.isArray(slot)) {
 						// Handle BglFormSchemaT array
 						return slot.map((schemaField) => {
-							if (typeof schemaField === 'function') {
+							if ('function' === typeof schemaField) {
 								// Handle function slot
 								const slotFn = schemaField
 								return slotFn({ row: rowData, field })
@@ -354,19 +369,19 @@ export function useSchemaField<T extends { [key: string]: any }>(optns: UseSchem
 		// 			? (slots[field.id])({ row: rowData, field })
 		// 			: undefined
 
-		if (mode === 'preview') {
+		if ('preview' === mode) {
 			// Skip rendering if value is unset and includeUnset is false
-			if (!includeUnset && (transformedValue === undefined || transformedValue === null
-				|| (typeof transformedValue === 'string' && transformedValue.length === 0))) {
+			if (!includeUnset && (transformedValue === undefined || null === transformedValue 
+				|| ('string' === typeof transformedValue && 0 === transformedValue.length))) {
 				return
 			}
 
 			return h('div', { class: 'preview-field' }, [
 				h('div', { class: 'field-label' }, `${field.label || keyToLabel(field.id || '')}:`),
 				h('div', { class: 'field-value' }, [
-					slotContent || (typeof field.$el === 'object'
+					slotContent || ('object' === typeof field.$el
 						? h(Component as any, props, componentSlots)
-						: typeof transformedValue === 'object' && transformedValue !== null
+						: 'object' === typeof transformedValue && null !== transformedValue 
 							? h('pre', {
 								style: 'margin: 0; white-space: pre-wrap; font-family: inherit; font-size: inherit;'
 							}, renderObject(transformedValue))

package/src/composables/useTheme.ts

@@ -50,17 +50,17 @@ function applyTheme(themeValue: string) {
 
 	// Remove all theme classes
 	themeOptions.value.forEach((t) => {
-		if (t.class !== 'system') {
+		if ('system' !== t.class) {
 			root.classList.remove(t.class)
 		}
 	})
 
 	// Handle system theme
-	if (themeValue === 'system') {
+	if ('system' === themeValue) {
 		const systemIsDark = getSystemPrefersDark()
 		isDark.value = systemIsDark
-		const darkTheme = themeOptions.value.find(t => t.value === 'dark')
-		const lightTheme = themeOptions.value.find(t => t.value === 'light')
+		const darkTheme = themeOptions.value.find(t => 'dark' === t.value)
+		const lightTheme = themeOptions.value.find(t => 'light' === t.value)
 		const themeToApply = systemIsDark ? darkTheme : lightTheme
 		if (themeToApply) {
 			root.classList.add(themeToApply.class)
@@ -77,9 +77,9 @@ function applyTheme(themeValue: string) {
 
 function toggleTheme() {
 	// Get all non-system themes
-	const cyclableThemes = themeOptions.value.filter(t => t.value !== 'system')
+	const cyclableThemes = themeOptions.value.filter(t => 'system' !== t.value)
 
-	if (cyclableThemes.length === 0) return
+	if (0 === cyclableThemes.length) {return}
 
 	const currentIndex = cyclableThemes.findIndex(t => t.value === colorMode.value)
 	const nextIndex = (currentIndex + 1) % cyclableThemes.length
@@ -91,8 +91,8 @@ function addTheme(theme: ThemeOption) {
 	const exists = themeOptions.value.some(t => t.value === theme.value)
 	if (!exists) {
 		// Add before 'system' option
-		const systemIndex = themeOptions.value.findIndex(t => t.value === 'system')
-		if (systemIndex > -1) {
+		const systemIndex = themeOptions.value.findIndex(t => 'system' === t.value)
+		if (-1 < systemIndex) {
 			themeOptions.value.splice(systemIndex, 0, theme)
 		} else {
 			themeOptions.value.push(theme)
@@ -130,7 +130,7 @@ export function useTheme() {
 		// React to system changes when in "system" mode
 		const mq = window.matchMedia('(prefers-color-scheme: dark)')
 		const handler = (e: MediaQueryListEvent) => {
-			if (colorMode.value === 'system') {
+			if ('system' === colorMode.value) {
 				applyTheme('system')
 			}
 		}

package/src/composables/useValidateFieldValue.ts

@@ -12,9 +12,9 @@ export function useValidateFieldValue(
 		inputVal,
 		(newVal, oldVal) => {
 			getInput?.()?.setCustomValidity('')
-			if (!validateFn || newVal === oldVal || !newVal) return
+			if (!validateFn || newVal === oldVal || !newVal) {return}
 			const isValid = validateFn(newVal, getFormData?.())
-			if (typeof isValid === 'string') getInput?.()?.setCustomValidity(isValid)
+			if ('string' === typeof isValid) {getInput?.()?.setCustomValidity(isValid)}
 		},
 		{ debounce: 500 },
 	)