import { readFileSync } from 'node:fs'
import { join } from 'node:path'
import { describe, expect, it } from 'vitest'

const COMPONENTS_DIR = 'src/uix/eidos/components'

const VISUAL_ATTRS = [
	['accordion/accordion.svelte', ['data-size', 'data-variant']],
	['accordion/accordion-content.svelte', ['data-size']],
	['accordion/accordion-header.svelte', ['data-size']],
	['accordion/accordion-trigger.svelte', ['data-size', 'data-indicator-placement']],
	['avatar/avatar.svelte', ['data-size', 'data-variant', 'data-color']],
	['checkbox/checkbox.svelte', ['data-size', 'data-variant', 'data-color']],
	['checkbox/checkbox-group.svelte', ['data-columns']],
	['dialog/dialog-close.svelte', ['data-position', 'data-icon-only']],
	['dialog/dialog-content.svelte', ['data-size', 'data-position', 'data-sheet']],
	['drawer/drawer-close.svelte', ['data-icon-only']],
	['drawer/drawer-content.svelte', ['data-size']],
	['popover/popover-close.svelte', ['data-icon-only']],
	['popover/popover-content.svelte', ['data-size']],
	['radio-group/radio-group.svelte', ['data-size', 'data-variant', 'data-color', 'data-columns']],
	['switch/switch.svelte', ['data-size']],
	['tabs/tabs.svelte', ['data-size', 'data-variant', 'data-fitted', 'data-collapsed', 'data-motion']],
	['tabs/tabs-content.svelte', ['data-motion']],
	['tabs/tabs-indicator.svelte', ['data-ready']],
	['toast/toast-viewport.svelte', ['data-position']],
	['toggle/toggle.svelte', ['data-size', 'data-variant', 'data-block', 'data-icon-only']],
	['tooltip/tooltip-content.svelte', ['data-size', 'data-variant']],
	['svg/svg-check.svelte', ['data-svg']],
	['svg/svg-chevron.svelte', ['data-svg', 'data-svg-direction']],
	['svg/svg-dash.svelte', ['data-svg']],
	['svg/svg-dot.svelte', ['data-svg']]
] as const

function stripComments(source: string): string {
	return source.replace(/\/\*[\s\S]*?\*\//g, '').replace(/(^|[^:])\/\/.*$/gm, '$1')
}

function readComponentSource(relativePath: string): string {
	return stripComments(readFileSync(join(COMPONENTS_DIR, relativePath), 'utf8'))
}

function attrPattern(attr: string): RegExp {
	return new RegExp(`${attr.replaceAll('-', '\\-')}\\s*=`)
}

describe('Eidos component visual attrs', () => {
	it('keeps visual recipe attrs wired in their wrappers', () => {
		const missing: string[] = []

		for (const [relativePath, attrs] of VISUAL_ATTRS) {
			const source = readComponentSource(relativePath)
			for (const attr of attrs) {
				if (!attrPattern(attr).test(source)) {
					missing.push(`${relativePath}: ${attr}`)
				}
			}
		}

		expect(missing).toEqual([])
	})
})