vce/src/adapters/svelte/stores/configuration.svelte.ts

/**
 * ============================================================================
 * SVELTE 5 CONFIGURATION STORE
 * ============================================================================
 *
 * Adapter que expone ConfigurationState usando Svelte 5 runes.
 */

import type {
    ConfigurableObject,
    ConfigurationCatalog,
    AttrID,
    OptionID,
    SectionID,
    ViewID,
    Section,
    SectionView
} from '@/types';
import {
    ConfigurationState,
    type ConfigurationStateOptions
} from '@/state/ConfigurationState';
import type { ValidationResult } from '@/state/ValidationState';
import type { SelectionStateData } from '@/state/SelectionState';

// ============================================================================
// STORE STATE INTERFACE
// ============================================================================

export interface ConfigurationStoreState {
    catalog         : ConfigurationCatalog;
    object          : ConfigurableObject;
    selection       : SelectionStateData;
    validation      : ValidationResult | null;
    currentSection  : Section | null;
    currentSectionId: SectionID | null;
    currentView     : SectionView | null;
    currentViewId   : ViewID | null;
    isValid         : boolean;
    locale          : string;  // Idioma actual
}

// ============================================================================
// CONFIGURATION STORE (SVELTE 5 RUNES)
// ============================================================================

/**
 * Crea un store de configuración reactivo para Svelte 5
 */
export function createConfigurationStore(options: ConfigurationStateOptions) {
    // Estado core (framework agnostic)
    const coreState = new ConfigurationState(options);

    // Función helper para obtener el estado actual
    function getStoreState(): ConfigurationStoreState {
        return {
            catalog         : coreState.getCatalog(),
            object          : coreState.getObject(),
            selection       : coreState.getAllSelections(),
            validation      : coreState.getValidationResult(),
            currentSection  : coreState.getCurrentSection(),
            currentSectionId: coreState.getCurrentSectionId(),
            currentView     : coreState.getCurrentView(),
            currentViewId   : coreState.getCurrentViewId(),
            isValid         : coreState.isValid(),
            locale          : coreState.getLocale()
        };
    }

    // ✅ SVELTE 5: Usar $state() para reactividad
    let state = $state<ConfigurationStoreState>(getStoreState());

    // Suscribirse a cambios del estado core
    coreState.subscribe(() => {
        state = getStoreState();
    });

    // ========================================================================
    // PUBLIC API
    // ========================================================================

    return {
        // ✅ SVELTE 5: Getter reactivo
        get current() {
            return state;
        },

        // Selection actions
        selectOption(attrId: AttrID, optionId: OptionID) {
            coreState.selectOption(attrId, optionId);
        },

        clearSelection(attrId: AttrID) {
            coreState.clearSelection(attrId);
        },

        // Navigation actions
        setCurrentSection(sectionId: SectionID) {
            coreState.setCurrentSection(sectionId);
        },

        setCurrentView(viewId: ViewID) {
            coreState.setCurrentView(viewId);
        },

        // Locale actions
        getLocale() {
            return coreState.getLocale();
        },

        setLocale(locale: string) {
            coreState.setLocale(locale as any);
        },

        // Translation helper
        t(i18nString: any) {
            const locale = coreState.getLocale();
            if (typeof i18nString === 'string') return i18nString;
            return i18nString[locale] || i18nString.es || i18nString.en || '';
        },

        // Validation actions
        validate() {
            return coreState.validate();
        },

        // Helpers
        getSelection(attrId: AttrID) {
            return coreState.getSelection(attrId);
        },

        getAllowedValues(attrId: AttrID) {
            return coreState.getAllowedValues(attrId);
        },

        isRequired(attrId: AttrID) {
            return coreState.isRequired(attrId);
        },

        hasErrorsForAttribute(attrId: AttrID) {
            return coreState.hasErrorsForAttribute(attrId);
        },

        getViolationsForAttribute(attrId: AttrID) {
            return coreState.getViolationsForAttribute(attrId);
        },

        // Persistence
        toJSON() {
            return coreState.toJSON();
        },

        fromJSON(data: ReturnType<typeof coreState.toJSON>) {
            coreState.fromJSON(data);
        },

        // Utilities
        reset() {
            coreState.reset();
        },

        undo() {
            return coreState.undo();
        },

        // Direct access to state (for advanced use)
        _coreState: coreState
    };
}

// ============================================================================
// DERIVED VALUES (SVELTE 5 $DERIVED)
// ============================================================================

/**
 * Helper para crear valores derivados en Svelte 5
 *
 * Uso en componentes:
 * ```ts
 * const config = createConfigurationStore({...});
 * const currentSection = $derived(config.current.currentSection);
 * const isValid = $derived(config.current.isValid);
 * ```
 */

// ============================================================================
// TYPE EXPORTS
// ============================================================================

export type ConfigurationStore = ReturnType<typeof createConfigurationStore>;