import type { Accessor } from "solid-js";
import type { NumberFieldRootState } from "../root/number-field-root.tsx";

/**
 * Reactive `data-*` getter bag shared by every `<NumberField.*>` part. Each
 * key is a live getter reading through the supplied `state` accessor — safe
 * to spread into `mergeRootProps` without losing reactivity.
 */
export function numberFieldDataAttrs(
	state: Accessor<NumberFieldRootState>,
): Record<string, string | undefined> {
	return {
		get "data-valid"(): "" | undefined {
			return state().valid === true ? "" : undefined;
		},
		get "data-invalid"(): "" | undefined {
			return state().valid === false ? "" : undefined;
		},
		get "data-touched"(): "" | undefined {
			return state().touched ? "" : undefined;
		},
		get "data-dirty"(): "" | undefined {
			return state().dirty ? "" : undefined;
		},
		get "data-filled"(): "" | undefined {
			return state().filled ? "" : undefined;
		},
		get "data-focused"(): "" | undefined {
			return state().focused ? "" : undefined;
		},
		get "data-disabled"(): "" | undefined {
			return state().disabled ? "" : undefined;
		},
		get "data-readonly"(): "" | undefined {
			return state().readOnly ? "" : undefined;
		},
		get "data-required"(): "" | undefined {
			return state().required ? "" : undefined;
		},
		get "data-scrubbing"(): "" | undefined {
			return state().scrubbing ? "" : undefined;
		},
	};
}