@cnamts/synapse 1.0.3 → 1.0.4

package/src/directives/Toolbar.ts

@@ -0,0 +1,172 @@
+import type { Directive } from 'vue'
+
+type Instance = {
+	tools: HTMLElement[]
+	lastElementFocused?: HTMLElement
+}
+
+const toolbarInstances = new WeakMap<HTMLElement, Instance>()
+
+/**
+ * This directive implements the "roving tabindex" pattern for accessible toolbars.
+ *
+ * example usage:
+ * <div v-toolbar role="toolbar">
+ *   <button>Tool 1</button>
+ *   <button>Tool 2</button>
+ *   <a href="#">Tool 3</a>
+ * </div>
+ *
+ * The directive allows keyboard navigation through the toolbar's tools using arrow keys,
+ * home, and end keys, while managing focus and tabindex attributes for accessibility.
+ */
+export const vToolbar: Directive = {
+	mounted(el: HTMLElement) {
+		el.setAttribute('role', 'toolbar') // Required on firefox to capture arrow keys!
+		el.setAttribute('tabindex', '0')
+
+		const tools = Array.from(el.querySelectorAll<HTMLElement>('button:not([disabled]), a:not([disabled]), input:not([disabled])') || [])
+
+		toolbarInstances.set(el, {
+			tools: tools,
+			lastElementFocused: undefined,
+		})
+
+		tools.forEach((el) => {
+			el.setAttribute('tabindex', '-1')
+		})
+
+		el.addEventListener('keydown', (event: KeyboardEvent) => {
+			const instance = toolbarInstances.get(el)
+
+			if (!instance) {
+				return
+			}
+
+			switch (event.key) {
+				case 'ArrowRight':
+				case 'ArrowDown':
+					selectNextElement(event as KeyboardEvent & { target: HTMLElement }, instance.tools)
+					break
+				case 'ArrowLeft':
+				case 'ArrowUp':
+					selectPrevElement(event as KeyboardEvent & { target: HTMLElement }, instance.tools)
+					break
+				case 'Home':
+					selectFirstElement(instance.tools)
+					break
+				case 'End':
+					selectLastElement(instance.tools)
+					break
+			}
+		})
+
+		el.addEventListener('focus', () => {
+			const instance = toolbarInstances.get(el)
+
+			if (!instance) {
+				return
+			}
+
+			setupFocus(el, instance)
+		})
+
+		el.addEventListener('focusin', (e: FocusEvent) => {
+			const instance = toolbarInstances.get(el)
+			if (!instance) {
+				return
+			}
+
+			saveFocus(e, instance)
+		})
+
+		el.addEventListener('focusout', (e: FocusEvent) => {
+			const instance = toolbarInstances.get(el)
+			if (!instance) {
+				return
+			}
+
+			blurToolbar(e, el)
+		})
+	},
+
+	unmounted(el: HTMLElement) {
+		toolbarInstances.delete(el)
+	},
+}
+
+function selectNextElement(e: Event & { target: HTMLElement }, tools: HTMLElement[]) {
+	const currentIndex = tools.findIndex(tool => tool === e.target)
+
+	const nextIndex = currentIndex < tools.length - 1 ? currentIndex + 1 : 0
+
+	const nextElem = tools.at(nextIndex)
+
+	e.target.setAttribute('tabindex', '-1')
+	nextElem?.setAttribute('tabindex', '0')
+	nextElem?.focus()
+}
+
+function selectPrevElement(e: Event & { target: HTMLElement }, tools: HTMLElement[]) {
+	const currentIndex = tools.findIndex(tool => tool === e.target)
+
+	const prevIndex = currentIndex > 0 ? currentIndex - 1 : tools.length - 1
+
+	const nextElem = tools.at(prevIndex)
+
+	e.target.setAttribute('tabindex', '-1')
+	nextElem?.setAttribute('tabindex', '0')
+	nextElem?.focus()
+}
+
+function selectFirstElement(tools: HTMLElement[]) {
+	const firstElement = tools.at(0)
+	if (!firstElement) {
+		return
+	}
+	document.activeElement?.setAttribute('tabindex', '-1')
+	firstElement.setAttribute('tabindex', '0')
+	firstElement.focus()
+}
+
+function selectLastElement(tools: HTMLElement[]) {
+	const lastElement = tools.at(-1)
+	if (!lastElement) {
+		return
+	}
+	document.activeElement?.setAttribute('tabindex', '-1')
+	lastElement.setAttribute('tabindex', '0')
+	lastElement.focus()
+}
+
+function setupFocus(toolbar: HTMLElement, instance: Instance) {
+	// Remove the ability to tab into the toolbar to be able to shift focus to previous focusable element
+	toolbar?.setAttribute('tabindex', '-1')
+
+	if (instance.lastElementFocused) {
+		// If there is a last focused element, restore focus to it
+		instance.lastElementFocused.setAttribute('tabindex', '0')
+		instance.lastElementFocused.focus()
+	}
+	else {
+		selectFirstElement(instance.tools)
+	}
+}
+
+function saveFocus(e: FocusEvent, instance: Instance) {
+	// Save the last focused element to restore focus later
+	if (e.target !== e.currentTarget) {
+		instance.lastElementFocused = e.target as HTMLElement
+	}
+}
+
+function blurToolbar(e: FocusEvent, toolbar: HTMLElement) {
+	// When an item of the toolbar is blured it should not be focusable anymore
+	(e.target as HTMLElement)?.setAttribute('tabindex', '-1')
+
+	// When the toolbar loses focus, we need to set its focusable
+	if (toolbar?.contains(e.relatedTarget as HTMLElement)) {
+		return
+	}
+	toolbar?.setAttribute('tabindex', '0')
+}

package/src/directives/letterSpacing.ts

@@ -0,0 +1,233 @@
+import type { Directive, DirectiveBinding } from 'vue'
+
+interface LetterSpacingOptions {
+	/**
+	 * Whether to apply to all typography elements or only specific selectors
+	 * @default true
+	 */
+	applyToAll?: boolean
+	/**
+	 * Specific selectors to target (if applyToAll is false)
+	 */
+	selectors?: string[]
+	/**
+	 * Whether to observe DOM changes for dynamic content
+	 * @default true
+	 */
+	observeChanges?: boolean
+}
+
+/**
+ * Find and modify Vuetify's CSS rules to remove !important from letter-spacing
+ */
+function modifyVuetifyStylesheets(): void {
+	try {
+		// Get all stylesheets
+		const stylesheets = Array.from(document.styleSheets)
+
+		stylesheets.forEach((stylesheet, index) => {
+			try {
+				// Try to access rules (may fail for cross-origin stylesheets)
+				const rules = Array.from(stylesheet.cssRules || stylesheet.rules || [])
+
+				rules.forEach((rule) => {
+					if (rule instanceof CSSStyleRule) {
+						// Check if this rule affects typography classes
+						const typographyClasses = ['.text-h1', '.text-h2', '.text-h3', '.text-h4', '.text-h5', '.text-h6', '.text-body-1', '.text-body-2', '.text-subtitle-1', '.text-subtitle-2', '.text-caption', '.text-overline', '.text-button']
+
+						const matchesTypography = typographyClasses.some(cls => rule.selectorText?.includes(cls))
+
+						if (matchesTypography && rule.style.letterSpacing) {
+							// Try to modify the rule
+							try {
+								rule.style.setProperty('letter-spacing', '0px', '')
+							}
+							catch (modifyError) {
+								console.log(`Could not modify rule: ${rule.selectorText}`, modifyError)
+							}
+						}
+					}
+				})
+			}
+			catch (accessError: unknown) {
+				// Stylesheet is cross-origin or inaccessible
+				const errorMessage = accessError instanceof Error ? accessError.message : String(accessError)
+				console.log(`Cannot access stylesheet ${index}:`, errorMessage)
+			}
+		})
+	}
+	catch (error) {
+		console.error('Error modifying Vuetify stylesheets:', error)
+	}
+}
+
+/**
+ * Inject CSS with !important to override Vuetify, but using CSS custom properties
+ */
+function injectOverrideCSS(): void {
+	const styleId = 'letter-spacing-override-styles'
+
+	// Remove existing style element if it exists
+	const existingStyle = document.getElementById(styleId)
+	if (existingStyle) {
+		existingStyle.remove()
+	}
+
+	// Create new style element
+	const styleElement = document.createElement('style')
+	styleElement.id = styleId
+	styleElement.type = 'text/css'
+
+	// Use high specificity selectors without !important
+	const cssRules = `
+		/* Override Vuetify letter-spacing with high specificity and CSS custom properties */
+		.v-application .v-application .text-h1 { letter-spacing: var(--v-typography-h1-letter-spacing, 0px); }
+		.v-application .v-application .text-h2 { letter-spacing: var(--v-typography-h2-letter-spacing, 0px); }
+		.v-application .v-application .text-h3 { letter-spacing: var(--v-typography-h3-letter-spacing, 0px); }
+		.v-application .v-application .text-h4 { letter-spacing: var(--v-typography-h4-letter-spacing, 0px); }
+		.v-application .v-application .text-h5 { letter-spacing: var(--v-typography-h5-letter-spacing, 0px); }
+		.v-application .v-application .text-h6 { letter-spacing: var(--v-typography-h6-letter-spacing, 0px); }
+		.v-application .v-application .text-body-1 { letter-spacing: var(--v-typography-body1-letter-spacing, 0px); }
+		.v-application .v-application .text-body-2 { letter-spacing: var(--v-typography-body2-letter-spacing, 0px); }
+		.v-application .v-application .text-subtitle-1 { letter-spacing: var(--v-typography-subtitle1-letter-spacing, 0px); }
+		.v-application .v-application .text-subtitle-2 { letter-spacing: var(--v-typography-subtitle2-letter-spacing, 0px); }
+		.v-application .v-application .text-caption { letter-spacing: var(--v-typography-caption-letter-spacing, 0px); }
+		.v-application .v-application .text-overline { letter-spacing: var(--v-typography-overline-letter-spacing, 0px); }
+		.v-application .v-application .text-button { letter-spacing: var(--v-typography-button-letter-spacing, 0px); }
+		.v-application .v-application h1 { letter-spacing: var(--v-typography-h1-letter-spacing, 0px); }
+		.v-application .v-application h2 { letter-spacing: var(--v-typography-h2-letter-spacing, 0px); }
+		.v-application .v-application h3 { letter-spacing: var(--v-typography-h3-letter-spacing, 0px); }
+		.v-application .v-application h4 { letter-spacing: var(--v-typography-h4-letter-spacing, 0px); }
+		.v-application .v-application h5 { letter-spacing: var(--v-typography-h5-letter-spacing, 0px); }
+		.v-application .v-application h6 { letter-spacing: var(--v-typography-h6-letter-spacing, 0px); }
+	`
+
+	styleElement.textContent = cssRules
+
+	// Append to head
+	document.head.appendChild(styleElement)
+}
+
+/**
+ * Apply design token letter-spacing values using multiple approaches
+ */
+function applyTokenLetterSpacing(element: HTMLElement): void {
+	// Try to modify existing Vuetify stylesheets first
+	modifyVuetifyStylesheets()
+
+	// Inject override CSS with !important but using CSS custom properties
+	injectOverrideCSS()
+
+	// Set CSS variables with design token values
+	const rootElement = document.documentElement
+	const rootStyle = getComputedStyle(rootElement)
+
+	// List of all typography CSS variables to set
+	const typographyVars = [
+		'--v-typography-h1-letter-spacing',
+		'--v-typography-h2-letter-spacing',
+		'--v-typography-h3-letter-spacing',
+		'--v-typography-h4-letter-spacing',
+		'--v-typography-h5-letter-spacing',
+		'--v-typography-h6-letter-spacing',
+		'--v-typography-body1-letter-spacing',
+		'--v-typography-body2-letter-spacing',
+		'--v-typography-subtitle1-letter-spacing',
+		'--v-typography-subtitle2-letter-spacing',
+		'--v-typography-caption-letter-spacing',
+		'--v-typography-overline-letter-spacing',
+		'--v-typography-button-letter-spacing',
+	]
+
+	// Set each CSS variable with design token values
+	typographyVars.forEach((cssVar) => {
+		const tokenValue = rootStyle.getPropertyValue(cssVar).trim()
+		const finalValue = tokenValue || '0px'
+
+		rootElement.style.setProperty(cssVar, finalValue)
+	})
+
+	// Add debugging attributes
+	element.setAttribute('data-letter-spacing-override', 'multi-approach')
+	element.setAttribute('data-letter-spacing-timestamp', Date.now().toString())
+}
+
+/**
+ * Vue directive to override Vuetify's !important letter-spacing with design token values
+ *
+ * Usage:
+ * - v-letter-spacing (applies to all typography elements)
+ * - v-letter-spacing="{ applyToAll: false, selectors: ['.text-h1', '.text-h2'] }"
+ * - v-letter-spacing="{ observeChanges: false }" (disable mutation observer)
+ */
+export const vLetterSpacing: Directive<HTMLElement, LetterSpacingOptions | boolean> = {
+	mounted(el: HTMLElement, binding: DirectiveBinding<LetterSpacingOptions | boolean>) {
+		const options: LetterSpacingOptions = typeof binding.value === 'boolean'
+			? { applyToAll: binding.value }
+			: { applyToAll: true, observeChanges: true, ...binding.value }
+
+		// Apply letter-spacing override immediately
+		applyTokenLetterSpacing(el)
+
+		// Set up mutation observer if enabled
+		if (options.observeChanges !== false) {
+			const observer = new MutationObserver((mutations) => {
+				let shouldReapply = false
+
+				mutations.forEach((mutation) => {
+					// Check if new nodes were added
+					if (mutation.type === 'childList' && mutation.addedNodes.length > 0) {
+						shouldReapply = true
+					}
+					// Check if class attributes changed
+					if (mutation.type === 'attributes' && mutation.attributeName === 'class') {
+						shouldReapply = true
+					}
+				})
+
+				if (shouldReapply) {
+					applyTokenLetterSpacing(el)
+				}
+			})
+
+			observer.observe(el, {
+				childList: true,
+				subtree: true,
+				attributes: true,
+				attributeFilter: ['class'],
+			})
+
+			// Store observer reference for cleanup
+			;(el as HTMLElement & { _letterSpacingObserver?: MutationObserver })._letterSpacingObserver = observer
+		}
+	},
+
+	updated(el: HTMLElement) {
+		// Reapply letter-spacing override when component updates
+		applyTokenLetterSpacing(el)
+	},
+
+	beforeUnmount(el: HTMLElement) {
+		// Clean up mutation observer
+		const observer = (el as HTMLElement & { _letterSpacingObserver?: MutationObserver })._letterSpacingObserver
+		if (observer) {
+			observer.disconnect()
+			delete (el as HTMLElement & { _letterSpacingObserver?: MutationObserver })._letterSpacingObserver
+		}
+
+		// Remove override attributes
+		const elements = el.querySelectorAll('[data-letter-spacing-override]')
+		elements.forEach((element) => {
+			element.removeAttribute('data-letter-spacing-override')
+			element.removeAttribute('data-letter-spacing-timestamp')
+		})
+
+		// Clean up the main element if it has the override
+		if (el.hasAttribute('data-letter-spacing-override')) {
+			el.removeAttribute('data-letter-spacing-override')
+			el.removeAttribute('data-letter-spacing-timestamp')
+		}
+	},
+}
+
+export default vLetterSpacing

package/src/stories/Accessibilite/Avancement/Avancement.mdx

@@ -187,11 +187,11 @@ import * as AvancementStories from './Avancement.stories';
     }
     
     .stat-success {
-      color: #56c271;
+      color: #56C271;
     }
     
-    .stat-warning {
-      color: #f0b323;
+    .stat-wip {
+      color: #A05BB6;
     }
     
     .stat-info {
@@ -513,12 +513,12 @@ import * as AvancementStories from './Avancement.stories';
         <p className="stat-label">Progression dans l'audit des composants du Design System</p>
         <div className="progress-stats">
           <div className="stat-item">
-            <span className="stat-value stat-success">15</span>
+            <span className="stat-value stat-success">21</span>
             <span className="stat-label">Composants audités</span>
           </div>
           <div className="stat-item">
-            <span className="stat-value stat-warning">39</span>
-            <span className="stat-label">Composants en attente</span>
+            <span className="stat-value stat-wip">3</span>
+            <span className="stat-label">En cours</span>
           </div>
           <div className="stat-item">
             <span className="stat-value stat-info">60</span>

package/src/stories/Accessibilite/Avancement/Avancement.stories.ts

@@ -42,9 +42,9 @@ export const Manuel: StoryObj = {
 					{ composant: 'PageContainer', status: 'Audité' },
 					{ composant: 'SkipLink', status: 'Audité' },
 					{ composant: 'Alerts', status: 'Audité' },
-					{ composant: 'NotificationBar', status: 'Audité' },
+					{ composant: 'NotificationBar', status: 'Non audité' },
 					{ composant: 'BackBtn', status: 'Audité' },
-					{ composant: 'BackToTopBtn', status: 'Non audité' },
+					{ composant: 'BackToTopBtn', status: 'Audité' },
 					{ composant: 'CopyBtn', status: 'Audité' },
 					{ composant: 'LangBtn', status: 'Audité' },
 					{ composant: 'DownloadBtn', status: 'Audité' },
@@ -52,7 +52,7 @@ export const Manuel: StoryObj = {
 					{ composant: 'SyTextField', status: 'Audité' },
 					{ composant: 'HeaderBar', status: 'Non audité' },
 					{ composant: 'HeaderNavigationBar', status: 'Non audité' },
-					{ composant: 'LogoBrandSection', status: 'Non audité' },
+					{ composant: 'LogoBrandSection', status: 'En cours' },
 					{ composant: 'SubHeader', status: 'Non audité' },
 					{ composant: 'HeaderLoading', status: 'Non audité' },
 					{ composant: 'HeaderToolbar', status: 'Non audité' },
@@ -65,9 +65,8 @@ export const Manuel: StoryObj = {
 					{ composant: 'DataListItem', status: 'Non audité' },
 					{ composant: 'DataListLoading', status: 'Non audité' },
 					{ composant: 'ErrorPage', status: 'Audité' },
-					{ composant: 'CookieBanner', status: 'Non audité' },
-					{ composant: 'ExternalLinks', status: 'Non audité' },
-					{ composant: 'ContextualMenu', status: 'En cours' },
+					{ composant: 'CookieBanner', status: 'Audité' },
+					{ composant: 'ContextualMenu', status: 'Audité' },
 					{ composant: 'DialogBox', status: 'Non audité' },
 					{ composant: 'PasswordField', status: 'Non audité' },
 					{ composant: 'PhoneField', status: 'Non audité' },
@@ -92,9 +91,11 @@ export const Manuel: StoryObj = {
 					{ composant: 'ErrorPage', status: 'Audité' },
 					{ composant: 'NotFoundPage', status: 'Audité' },
 					{ composant: 'MaintenancePage', status: 'Audité' },
-					{ composant: 'ContextualMenu', status: 'En cours' },
-					{ composant: 'ExternalLinks', status: 'En cours' },
+					{ composant: 'ContextualMenu', status: 'Audité' },
+					{ composant: 'ExternalLinks', status: 'Audité' },
 					{ composant: 'SyIcon', status: 'Non audité' },
+					{ composant: 'SocialMediaLinks', status: 'Audité' },
+					{ composant: 'CollapsibleList', status: 'Audité' },
 				]
 
 				// Options de filtrage par statut
@@ -225,7 +226,7 @@ export const Manuel: StoryObj = {
 						</div>
 
 						<div class="pa-2 text-caption text-right">
-							Dernière mise à jour: 11/07/2025
+							Dernière mise à jour: 18/07/2025
 						</div>
 					</div>
 				</div>

package/src/utils/functions/throttleDisplayFn/tests/throttleDisplayFn.spec.ts

@@ -2,15 +2,31 @@ import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
 import throttleDisplayFn from '../throttleDisplayFn'
 
 describe('throttleDisplayFn', () => {
-	vi.stubGlobal('requestAnimationFrame', (fn: () => void) => fn())
+	let mockPerformanceNow: ReturnType<typeof vi.fn>
+	let mockRequestAnimationFrame: ReturnType<typeof vi.fn>
 
 	beforeEach(() => {
 		vi.useFakeTimers()
+
+		// Mock performance.now to return a controllable time
+		mockPerformanceNow = vi.fn(() => 0)
+		vi.stubGlobal('performance', { now: mockPerformanceNow })
+
+		// Mock window.requestAnimationFrame to execute immediately
+		mockRequestAnimationFrame = vi.fn((fn: () => void) => {
+			fn()
+			return 1
+		})
+		Object.defineProperty(window, 'requestAnimationFrame', {
+			value: mockRequestAnimationFrame,
+			writable: true,
+		})
 	})
 
 	afterEach(() => {
 		vi.restoreAllMocks()
 		vi.clearAllTimers()
+		vi.useRealTimers()
 	})
 
 	it('should call the function immediately if delay has passed', () => {
@@ -18,10 +34,13 @@ describe('throttleDisplayFn', () => {
 		const delay = 100
 		const throttledFn = throttleDisplayFn(mockFn, delay)
 
+		// First call should execute immediately (lastCalled starts at 0)
+		mockPerformanceNow.mockReturnValue(delay + 1) // Ensure delay condition is met
 		throttledFn()
 		expect(mockFn).toHaveBeenCalledTimes(1)
 
-		vi.spyOn(performance, 'now').mockReturnValue(performance.now() + delay + 1)
+		// Simulate more time passing beyond the delay
+		mockPerformanceNow.mockReturnValue(delay * 2 + 1)
 		throttledFn()
 		expect(mockFn).toHaveBeenCalledTimes(2)
 	})
@@ -31,17 +50,23 @@ describe('throttleDisplayFn', () => {
 		const delay = 100
 		const throttledFn = throttleDisplayFn(mockFn, delay)
 
+		// First call should execute immediately (lastCalled starts at 0)
+		mockPerformanceNow.mockReturnValue(delay + 1) // Ensure delay condition is met
 		throttledFn()
 		expect(mockFn).toHaveBeenCalledTimes(1)
 
+		// Subsequent calls within delay should be throttled
+		mockPerformanceNow.mockReturnValue(delay + 50) // Still within delay from last call
 		throttledFn()
 		throttledFn()
 
+		// Should still only have been called once
 		expect(mockFn).toHaveBeenCalledTimes(1)
 
 		// Advance timers to trigger the setTimeout
 		vi.advanceTimersByTime(delay)
 
+		// Now the setTimeout should have executed the function
 		expect(mockFn).toHaveBeenCalledTimes(2)
 	})
 })

package/src/utils/rules/isHolidayDay/IsHolidayDay.stories.ts

@@ -1,6 +1,6 @@
 import type { Meta, StoryObj } from '@storybook/vue3'
 import { ref } from 'vue'
-import DatePicker from '@/components/DatePicker/DatePicker/DatePicker.vue'
+import DatePicker from '@/components/DatePicker/CalendarMode/DatePicker.vue'
 import { useHolidayDay } from '@/composables/date/useHolidayDay'
 
 const meta: Meta<typeof DatePicker> = {
@@ -17,7 +17,7 @@ export default meta
 type Story = StoryObj<typeof DatePicker>
 
 /**
- * Exemple d'utilisation de la règle isHolidayDay avec un DatePicker
+ * Exemple d'utilisation de la règle isHolidayDay avec un CalendarMode
  */
 export const Default: Story = {
 	render: () => ({

package/dist/DateFilter-DFKfon7L.js

@@ -1,98 +0,0 @@
-import { defineComponent as h, computed as D, createBlock as k, openBlock as p } from "vue";
-import { u as C, D as F, _ as V } from "./main-DoYCrS2Q.js";
-const v = /* @__PURE__ */ h({
-  __name: "DateFilter",
-  props: {
-    header: {
-      type: Object,
-      required: !0
-    },
-    filters: {
-      type: Array,
-      default: () => []
-    },
-    filterValue: {
-      type: [String, Date, Object, null],
-      default: null
-    },
-    inputConfig: {
-      type: Object,
-      default: () => ({})
-    },
-    disableErrorHandling: {
-      type: Boolean,
-      default: !1
-    },
-    variant: {
-      type: String,
-      default: "outlined"
-    },
-    hideDetails: {
-      type: Boolean,
-      default: !0
-    },
-    density: {
-      type: String,
-      default: "compact"
-    },
-    backgroundColor: {
-      type: String,
-      default: "white"
-    },
-    clearable: {
-      type: Boolean,
-      default: !0
-    }
-  },
-  emits: ["update:filters"],
-  setup(e, { emit: g }) {
-    const { parseDate: y } = C(), t = e, u = g;
-    function s() {
-      return String(t.header.key || t.header.value || (t.header.title ? `filter_${t.header.title}` : `filter_${Date.now()}`));
-    }
-    const f = D({
-      get: () => t.filterValue,
-      set: (a) => {
-        const i = s();
-        if (!i) return;
-        if (a === null) {
-          const r = t.filters.filter((o) => o.key !== i);
-          u("update:filters", r);
-          return;
-        }
-        const l = t.filters.findIndex((r) => r.key === i), n = [...t.filters];
-        let d = a;
-        typeof a == "string" && a.trim() !== "" && y(a, t.header.dateFormat || "DD/MM/YYYY") && (d = a), l >= 0 ? n[l].value = d : n.push({
-          key: i,
-          value: d,
-          type: "date"
-        }), u("update:filters", n);
-      }
-    });
-    function m() {
-      const a = s(), i = t.filters.filter((l) => l.key !== a);
-      u("update:filters", i);
-    }
-    return (a, i) => {
-      var l, n, d, r, o, c;
-      return p(), k(F, {
-        modelValue: f.value,
-        "onUpdate:modelValue": i[0] || (i[0] = (b) => f.value = b),
-        label: e.header.title,
-        clearable: ((l = e.inputConfig) == null ? void 0 : l.clearable) ?? e.clearable,
-        density: ((n = e.inputConfig) == null ? void 0 : n.density) ?? e.density,
-        "hide-details": ((d = e.inputConfig) == null ? void 0 : d.hideDetails) ?? e.hideDetails,
-        "hide-messages": e.header.hideMessages,
-        variant: ((r = e.inputConfig) == null ? void 0 : r.variant) ?? e.variant,
-        "disable-error-handling": ((o = e.inputConfig) == null ? void 0 : o.disableErrorHandling) ?? e.disableErrorHandling,
-        "bg-color": ((c = e.inputConfig) == null ? void 0 : c.backgroundColor) ?? e.backgroundColor,
-        format: e.header.dateFormat,
-        class: "filter-input",
-        "onClick:clear": m
-      }, null, 8, ["modelValue", "label", "clearable", "density", "hide-details", "hide-messages", "variant", "disable-error-handling", "bg-color", "format"]);
-    };
-  }
-}), B = /* @__PURE__ */ V(v, [["__scopeId", "data-v-1676b500"]]);
-export {
-  B as default
-};