@arbetsformedlingen/yrkesvaljaren 2.0.5

package/dist/esm/digi-service-job-selector.entry.js

@@ -0,0 +1,1617 @@
+import { a as getElement, r as registerInstance, c as createEvent, h, F as Fragment } from './index-CGXZllj2.js';
+import { T as TaxonomySearchEngine, D as DEBOUNCE_TIME, L as LabelFormatter, s as segmentsToHtml, M as MAX_RESULTS, a as TaxonomyAdapter, P as PLACEHOLDER_TEXT, b as MIN_INPUT_LENGTH, c as styleParentheticalText } from './search.engine-nZ7AcXba.js';
+import { l as log, g as getRegisteredTaxonomy, i as isTaxonomyRegistration, r as registerTaxonomy } from './taxonomy-registry-Dw0VR9Aw.js';
+import { I as InvalidSelectionError } from './types-DHUftoZJ.js';
+import { A as AfValidationMessage } from './af-validation-message-F8NIH2rC.js';
+import './fuse-BPnhMTul.js';
+
+let memoryCache = null;
+const HistoryService = {
+    saveHistory(history) {
+        memoryCache = history; // Omedelbar uppdatering av UI-state
+        try {
+            localStorage.setItem('job-selector_history', JSON.stringify(history));
+            log.debug('[HistoryService] saveHistory - History saved.');
+        }
+        catch (e) {
+            log.error('Kunde inte spara historik.', e);
+        }
+    },
+    loadHistory() {
+        if (memoryCache) {
+            return memoryCache;
+        }
+        try {
+            const historyString = localStorage.getItem('job-selector_history');
+            if (historyString) {
+                memoryCache = JSON.parse(historyString);
+                return memoryCache;
+            }
+        }
+        catch (e) {
+            log.error('Kunde inte läsa historik.', e);
+        }
+        memoryCache = [];
+        return memoryCache;
+    },
+    clearHistory() {
+        memoryCache = [];
+        try {
+            localStorage.removeItem('job-selector_history');
+            log.debug('[HistoryService] clearHistory - History cleared.');
+        }
+        catch (e) {
+            log.error('Kunde inte rensa historik.', e);
+        }
+    }
+};
+
+class JobSelectorController {
+    callbacks;
+    config;
+    state = { status: 'loading' };
+    taxonomyData = [];
+    popularItems = [];
+    // REPLACED: private fuseInstance: Fuse<TaxonomyItem> | null = null;
+    searchEngine = null;
+    debounceTimer;
+    validationTimer;
+    isTouched = false;
+    activeErrorType = null;
+    constructor(callbacks, config) {
+        this.callbacks = callbacks;
+        this.config = config;
+    }
+    // --- PUBLIC API ---
+    getState() {
+        return this.state;
+    }
+    getActiveErrorType() {
+        return this.activeErrorType;
+    }
+    // --- CONFIG UPDATE ---
+    updateConfig(newConfig) {
+        this.config = { ...this.config, ...newConfig };
+        // Kör validering om reglerna för obligatoriskt fält eller fritext ändras.
+        if (newConfig.required !== undefined || newConfig.requireSelection !== undefined) {
+            this.runValidation();
+        }
+    }
+    getTaxonomyData() {
+        // Return internal data if already loaded
+        if (this.taxonomyData.length > 0)
+            return this.taxonomyData;
+        // Try to fetch from registry (handles late registration)
+        const registeredData = getRegisteredTaxonomy();
+        if (registeredData && registeredData.length > 0) {
+            log.debug('[Controller] getTaxonomyData - Late initializing from registry');
+            this.taxonomyData = registeredData;
+            this.popularItems = this.computePopularItems(this.taxonomyData);
+            this.searchEngine = new TaxonomySearchEngine(this.taxonomyData);
+        }
+        return this.taxonomyData;
+    }
+    destroy() {
+        if (this.debounceTimer) {
+            clearTimeout(this.debounceTimer);
+            this.debounceTimer = undefined;
+        }
+        if (this.validationTimer) {
+            clearTimeout(this.validationTimer);
+            this.validationTimer = undefined;
+        }
+    }
+    // --- INITIALIZATION ---
+    async initialize(initialData) {
+        log.debug('[Controller] initialize - START', { hasInitialData: !!initialData });
+        this.updateState({ status: 'loading' });
+        const registeredData = (initialData && initialData.length > 0) ? initialData : getRegisteredTaxonomy();
+        if (registeredData && registeredData.length > 0) {
+            log.debug('[Controller] initialize - Loaded taxonomy from registry');
+            this.setStateToActive(registeredData, 'registry', new Date().toISOString());
+        }
+        else {
+            log.warn('[Controller] initialize - No taxonomy found in registry. Has registerTaxonomy() been called?');
+            this.updateState({ status: 'error', message: 'Kunde inte hitta yrkesdata. Kontrollera att komponenten är initierad korrekt.' });
+        }
+    }
+    handleFocus() {
+        this.isTouched = true;
+    }
+    setStateToActive(data, source, sourceDate) {
+        this.taxonomyData = data;
+        this.popularItems = this.computePopularItems(this.taxonomyData);
+        // NEW: Initialize the separated SearchEngine
+        this.searchEngine = new TaxonomySearchEngine(this.taxonomyData);
+        // OLD: this.fuseInstance = new Fuse(this.taxonomyData, FUSE_OPTIONS);
+        const commonState = { dataSource: source, dataSourceDate: sourceDate };
+        if (this.config.enableMultiple) {
+            this.updateState({
+                status: 'multiSelect',
+                inputValue: '',
+                selectedItems: [],
+                suggestions: [],
+                validation: 'idle',
+                ...commonState
+            });
+            return;
+        }
+        this.updateState({ status: 'searching', inputValue: '', suggestions: [], validation: 'idle', ...commonState });
+    }
+    // --- SEARCH ---
+    handleInput(value) {
+        this.isTouched = true;
+        log.debug('[Controller] handleInput - Value:', value);
+        // Reset validation on input
+        const wasInError = this.state.validation === 'error';
+        const validationContext = wasInError || this.state.validationContext === 'from-error' ? 'from-error' : undefined;
+        clearTimeout(this.debounceTimer);
+        if (value.trim() === '') {
+            if (this.config.enableMultiple) {
+                const currentSelected = 'selectedItems' in this.state ? this.state.selectedItems : [];
+                this.updateState({
+                    status: 'multiSelect',
+                    inputValue: '',
+                    selectedItems: currentSelected,
+                    suggestions: [],
+                    validation: 'idle',
+                    validationContext, // BEVARA CONTEXT
+                    ...this.getCommonState()
+                });
+            }
+            else {
+                this.updateState({
+                    status: 'searching',
+                    inputValue: '',
+                    suggestions: [],
+                    validation: 'idle',
+                    validationContext, // BEVARA CONTEXT
+                    ...this.getCommonState()
+                });
+            }
+            this.showHistory();
+            return;
+        }
+        switch (this.state.status) {
+            case 'multiSelect':
+            case 'multiSelectShowingHistory': {
+                const selectedItems = 'selectedItems' in this.state ? this.state.selectedItems : [];
+                this.updateState({
+                    status: 'multiSelect',
+                    inputValue: value,
+                    selectedItems,
+                    suggestions: 'suggestions' in this.state ? this.state.suggestions : ('historyItems' in this.state ? this.state.historyItems : []),
+                    validation: 'idle',
+                    validationContext,
+                    dataSource: 'dataSource' in this.state ? this.state.dataSource : undefined,
+                    dataSourceDate: 'dataSourceDate' in this.state ? this.state.dataSourceDate : undefined
+                });
+                break;
+            }
+            case 'itemSelected':
+            case 'searching':
+            case 'showingHistory': {
+                this.updateState({
+                    status: 'searching',
+                    inputValue: value,
+                    suggestions: 'suggestions' in this.state ? this.state.suggestions : ('historyItems' in this.state ? this.state.historyItems : []),
+                    validation: 'idle',
+                    validationContext,
+                    dataSource: 'dataSource' in this.state ? this.state.dataSource : undefined,
+                    dataSourceDate: 'dataSourceDate' in this.state ? this.state.dataSourceDate : undefined
+                });
+                break;
+            }
+            case 'loading':
+            case 'error':
+                return; // Interaction not allowed or ignored
+            default: {
+                const _exhaustive = this.state;
+                return _exhaustive;
+            }
+        }
+        if (value.length >= this.config.minLength) {
+            this.debounceTimer = setTimeout(() => this.performSearch(value), DEBOUNCE_TIME);
+        }
+    }
+    performSearch(value) {
+        if (!this.searchEngine)
+            return;
+        switch (this.state.status) {
+            case 'searching':
+            case 'multiSelect': {
+                const genericResults = this.searchEngine.searchAsGeneric(value, this.config.maxResults);
+                const results = genericResults.flatMap(g => g.metadata?.originalResult ? [g.metadata.originalResult] : []);
+                // Do not filter out selected items here - allow UI to handle grey-out
+                this.updateState({ ...this.state, suggestions: results });
+                break;
+            }
+            case 'loading':
+            case 'error':
+            case 'itemSelected':
+            case 'showingHistory':
+            case 'multiSelectShowingHistory':
+                return; // Nothing to search from here
+            default: {
+                const _exhaustive = this.state;
+                return _exhaustive;
+            }
+        }
+    }
+    // --- HISTORY HANDLING ---
+    addToHistory(item) {
+        if (!this.config.history)
+            return;
+        // Reload history from cache to ensure we have the latest state from other instances
+        const historyItems = HistoryService.loadHistory();
+        // Clone item and reset highlightedLabel to displayLabel (removes bolding)
+        // AND apply grey styling to parenthesis (via DisplaySegments)
+        const unhighlightedSegments = LabelFormatter.format(item.rawLabel, '', item.occupationLabel);
+        const historyItem = {
+            ...item,
+            displaySegments: unhighlightedSegments,
+            // Legacy support: construct HTML string for fallback
+            highlightedLabel: segmentsToHtml(unhighlightedSegments)
+        };
+        // Filter out existing item with same ID (to move it to top)
+        const filtered = historyItems.filter((h) => {
+            if (h.id && historyItem.id)
+                return h.id !== historyItem.id;
+            return h.rawLabel !== historyItem.rawLabel;
+        });
+        // Add to top and limit
+        const newHistory = [historyItem, ...filtered].slice(0, this.config.maxHistoryItems);
+        HistoryService.saveHistory(newHistory);
+    }
+    clearHistory() {
+        HistoryService.clearHistory();
+        this.showHistory(true);
+    }
+    computePopularItems(data, limit = this.config.maxResults || MAX_RESULTS) {
+        if (!data || data.length === 0)
+            return [];
+        const hasWeights = data.some(t => typeof t.weight === 'number' && t.weight > 0);
+        if (!hasWeights) {
+            return data.slice(0, limit);
+        }
+        const sorted = [...data].sort((a, b) => (b.weight ?? 0) - (a.weight ?? 0));
+        const seen = new Set();
+        const popular = [];
+        for (const item of sorted) {
+            const key = item.occupation_name_preferred_label || item.preferred_label;
+            if (!seen.has(key)) {
+                seen.add(key);
+                popular.push(item);
+            }
+            if (popular.length === limit)
+                break;
+        }
+        return popular;
+    }
+    showHistory(force = false) {
+        if (this.state.status === 'loading' || this.state.status === 'error')
+            return;
+        if (!this.config.history)
+            return;
+        const historyItems = HistoryService.loadHistory();
+        let displayItems = historyItems;
+        let isPopular = false;
+        if (historyItems.length === 0) {
+            if (this.config.popular === false) {
+                displayItems = [];
+            }
+            else {
+                if (this.popularItems.length === 0 && this.taxonomyData.length > 0) {
+                    this.popularItems = this.computePopularItems(this.taxonomyData);
+                }
+                // Provide some popular items if history is empty (and we have taxonomy data)
+                displayItems = this.popularItems.map(t => this.toSearchResult(t));
+                isPopular = true;
+            }
+        }
+        // Lazy Validation: Filter items against current taxonomy and config
+        const validatedHistory = displayItems.filter((item) => {
+            // 1. Check if it's a ManualInput item
+            if (item.type === 'ManualInput') {
+                return !this.config.requireSelection;
+            }
+            // 2. Check if it's a valid Taxonomy item (must exist in current data)
+            // Note: We use this.taxonomyData which is already loaded
+            const exists = this.taxonomyData.some(t => t.id === item.id);
+            return exists;
+        });
+        const filteredHistory = validatedHistory.map((item) => {
+            const unhighlightedSegments = LabelFormatter.format(item.rawLabel, '', item.occupationLabel);
+            return {
+                ...item,
+                displaySegments: unhighlightedSegments,
+                highlightedLabel: segmentsToHtml(unhighlightedSegments)
+            };
+        });
+        const { dataSource, dataSourceDate } = this.getCommonState();
+        const currentInputValue = 'inputValue' in this.state ? this.state.inputValue : '';
+        // If we have input text, we don't want to show history unless explicitly in a history state
+        // OR if we are forcing it (e.g. from editSelection)
+        if (!force && currentInputValue.trim() !== '' && this.state.status !== 'showingHistory' && this.state.status !== 'multiSelectShowingHistory') {
+            return;
+        }
+        if (this.config.enableMultiple) {
+            const selectedItems = 'selectedItems' in this.state ? this.state.selectedItems : [];
+            const wasInError = this.state.validation === 'error' || this.state.validationContext === 'from-error';
+            const validationContext = wasInError ? 'from-error' : undefined;
+            const validation = 'validation' in this.state ? this.state.validation : 'idle';
+            this.updateState({
+                status: 'multiSelectShowingHistory',
+                selectedItems,
+                historyItems: filteredHistory,
+                inputValue: currentInputValue,
+                validation,
+                validationContext,
+                dataSource,
+                dataSourceDate,
+                isPopularView: isPopular // Flag for view
+            });
+        }
+        else {
+            const wasInError = this.state.validation === 'error' || this.state.validationContext === 'from-error';
+            const validationContext = wasInError ? 'from-error' : undefined;
+            const validation = 'validation' in this.state ? this.state.validation : 'idle';
+            this.updateState({
+                status: 'showingHistory',
+                historyItems: filteredHistory,
+                inputValue: currentInputValue,
+                validation,
+                validationContext,
+                dataSource,
+                dataSourceDate,
+                isPopularView: isPopular // Flag for view
+            });
+        }
+    }
+    // --- SELECTION ---
+    selectItem(item) {
+        log.debug('[Controller] selectItem', item);
+        // Add to history
+        this.isTouched = true;
+        this.addToHistory(item);
+        // Standardized Success Message Logic:
+        // Check for error state before update to allow transition to success.
+        // This applies to ALL selection events (Single, Multi, History, Search).
+        const wasInError = this.state.validation === 'error' || this.state.validationContext === 'from-error';
+        const nextValidationContext = wasInError ? 'from-error' : undefined;
+        switch (this.state.status) {
+            case 'multiSelect':
+            case 'multiSelectShowingHistory': {
+                const dataSource = 'dataSource' in this.state ? this.state.dataSource : undefined;
+                const dataSourceDate = 'dataSourceDate' in this.state ? this.state.dataSourceDate : undefined;
+                const currentSelected = 'selectedItems' in this.state ? this.state.selectedItems : [];
+                // Prevent duplicates
+                const existingIndex = currentSelected.findIndex(existing => {
+                    if (existing.id && item.id)
+                        return existing.id === item.id;
+                    return existing.rawLabel === item.rawLabel;
+                });
+                if (existingIndex > -1) {
+                    // Already selected - skip to avoid double addition or accidental removal in this context
+                    return;
+                }
+                const newItems = [...currentSelected, item];
+                // Uppdatera state: rensa input och förslag
+                this.updateState({
+                    ...this.state,
+                    status: 'multiSelect',
+                    selectedItems: newItems,
+                    inputValue: '',
+                    suggestions: [],
+                    validation: 'idle',
+                    validationContext: nextValidationContext, // Use centralized context
+                    dataSource,
+                    dataSourceDate
+                });
+                this.callbacks.onEmitSelection(newItems.map(i => this.toPublicSelection(i)));
+                this.showHistory(true);
+                break;
+            }
+            case 'searching':
+            case 'showingHistory': {
+                const dataSource = 'dataSource' in this.state ? this.state.dataSource : undefined;
+                const dataSourceDate = 'dataSourceDate' in this.state ? this.state.dataSourceDate : undefined;
+                this.updateState({
+                    status: 'itemSelected',
+                    selectedItem: item,
+                    inputValue: item.preferred_label, // Keep label as text
+                    validation: 'idle',
+                    validationContext: nextValidationContext, // Use centralized context
+                    dataSource,
+                    dataSourceDate,
+                });
+                this.callbacks.onEmitSelection(this.toPublicSelection(item));
+                if (this.config.enableMultiple) {
+                    this.showHistory(true);
+                }
+                break;
+            }
+            case 'loading':
+            case 'error':
+                // Do nothing in these states
+                break;
+            case 'itemSelected': {
+                const dataSource = 'dataSource' in this.state ? this.state.dataSource : undefined;
+                const dataSourceDate = 'dataSourceDate' in this.state ? this.state.dataSourceDate : undefined;
+                this.updateState({
+                    ...this.state,
+                    status: 'itemSelected',
+                    selectedItem: item,
+                    inputValue: item.preferred_label,
+                    validation: 'idle',
+                    validationContext: nextValidationContext,
+                    dataSource,
+                    dataSourceDate,
+                });
+                this.callbacks.onEmitSelection(this.toPublicSelection(item));
+                break;
+            }
+            default: {
+                const _exhaustive = this.state;
+                log.warn('[Controller] selectItem - Unexpected state:', _exhaustive);
+            }
+        }
+        this.runValidation();
+    }
+    clearSelection() {
+        if (this.state.status !== 'itemSelected')
+            return;
+        this.isTouched = true;
+        const currentInputValue = this.state.inputValue || '';
+        this.updateState({
+            status: 'searching',
+            inputValue: currentInputValue,
+            suggestions: [],
+            validation: 'idle',
+            ...this.getCommonState()
+        });
+        this.callbacks.onEmitSelection([]); // Empty array instead of null
+        // Try to show history if enabled
+        this.showHistory();
+        this.runValidation();
+    }
+    removeItem(item) {
+        switch (this.state.status) {
+            case 'multiSelect':
+            case 'multiSelectShowingHistory': {
+                const newItems = this.state.selectedItems.filter(i => {
+                    if (i.id && item.id)
+                        return i.id !== item.id;
+                    return i.rawLabel !== item.rawLabel;
+                });
+                this.isTouched = true;
+                this.updateState({ ...this.state, selectedItems: newItems });
+                this.callbacks.onEmitSelection(newItems.map(i => this.toPublicSelection(i)));
+                // Try to show history if enabled (since we are likely still focused)
+                const inputValue = 'inputValue' in this.state ? this.state.inputValue : '';
+                if (inputValue === '') {
+                    this.showHistory();
+                }
+                this.runValidation();
+                break;
+            }
+        }
+    }
+    // --- BLUR & VALIDATION ---
+    handleBlur() {
+        this.isTouched = true;
+        if (this.state.status === 'searching') {
+            const trimmedValue = (this.state.inputValue || '').trim();
+            if (trimmedValue !== '') {
+                const exactMatch = this.findExactMatch(trimmedValue);
+                if (exactMatch) {
+                    this.selectItem(this.toSearchResult(exactMatch));
+                    return;
+                }
+            }
+        }
+        // In TEA/FSM, handleBlur should focus on state transitions and validation,
+        // rather than side-effects like clearing UI data.
+        // We transition back to primary states (searching/multiSelect) but KEEP suggestions.
+        switch (this.state.status) {
+            case 'searching':
+            case 'showingHistory':
+                this.updateState({
+                    ...this.state,
+                    status: 'searching',
+                    inputValue: 'inputValue' in this.state ? this.state.inputValue : '',
+                    suggestions: []
+                });
+                break;
+            case 'multiSelect':
+            case 'multiSelectShowingHistory': {
+                this.updateState({
+                    ...this.state,
+                    status: 'multiSelect',
+                    inputValue: 'inputValue' in this.state ? this.state.inputValue : '',
+                    suggestions: []
+                });
+                break;
+            }
+            case 'loading':
+            case 'error':
+            case 'itemSelected':
+                break;
+            default: {
+                const _exhaustive = this.state;
+                return _exhaustive;
+            }
+        }
+        this.runValidation();
+    }
+    /**
+     * Validerar nuvarande värde och sätter eventuella valideringsfel.
+     * @param forceTouch - Tvingar valideringen att köras (och därmed visa fel) även om fältet inte tidigare blivit rört (touched). Default är false.
+     */
+    runValidation(forceTouch = false) {
+        if (forceTouch) {
+            this.isTouched = true;
+        }
+        if (!this.isTouched)
+            return true;
+        if (this.state.status === 'loading' || this.state.status === 'error')
+            return true;
+        const hasValue = this.checkHasValue();
+        let isValid = true;
+        let newErrorType = null;
+        // Check for invalid input (text that doesn't match a selection)
+        // This applies in both single 'searching' mode and 'multiSelect' mode
+        const isSearchingOrMulti = this.state.status === 'searching' || this.state.status === 'multiSelect' || this.state.status === 'multiSelectShowingHistory';
+        const inputValue = 'inputValue' in this.state ? this.state.inputValue : '';
+        const hasInputText = inputValue.trim() !== '';
+        if (isSearchingOrMulti && hasInputText) {
+            // New rule: If there is text in the box that isn't confirmed as a selection, it's ALWAYS an error
+            // regardless of whether manual input is enabled or not.
+            // The user MUST confirm by selecting the manual input option.
+            isValid = false;
+            newErrorType = 'invalidInput';
+        }
+        else if (this.config.required && !hasValue) {
+            isValid = false;
+            newErrorType = 'required';
+        }
+        this.activeErrorType = newErrorType;
+        // Strict FSM for validation state
+        // Rules:
+        // 1. Error only if invalid.
+        // 2. Idle if valid (never use success to avoid aggressive green checks).
+        // Valid state: only show success if recovering from an error (Red -> Green pattern) AND we actually have a value.
+        const wasInError = this.state.validation === 'error' || this.state.validationContext === 'from-error';
+        let validationState;
+        if (!isValid) {
+            validationState = newErrorType === 'invalidInput' || forceTouch || wasInError ? 'error' : 'idle';
+        }
+        else if (wasInError && hasValue) {
+            validationState = 'success';
+        }
+        else {
+            validationState = 'idle';
+        }
+        if (validationState === 'success') {
+            clearTimeout(this.validationTimer);
+            this.validationTimer = setTimeout(() => {
+                // Only clear if still success (user hasn't messed up again)
+                const isSuccess = 'validation' in this.state && this.state.validation === 'success';
+                const allowedStatus = ['itemSelected', 'multiSelect', 'multiSelectShowingHistory'].includes(this.state.status);
+                if (allowedStatus && isSuccess) {
+                    this.updateState({ ...this.state, validation: 'idle', validationContext: undefined });
+                }
+                this.validationTimer = undefined;
+            }, 3000);
+        }
+        // Update state based on current status (respecting type definitions)
+        switch (this.state.status) {
+            case 'searching':
+                this.updateState({ ...this.state, validation: validationState });
+                break;
+            case 'showingHistory':
+                this.updateState({ ...this.state, validation: validationState });
+                break;
+            case 'multiSelect':
+                // Allow error AND success states for multiSelect
+                this.updateState({ ...this.state, validation: validationState });
+                break;
+            case 'multiSelectShowingHistory':
+                this.updateState({ ...this.state, validation: validationState });
+                break;
+            case 'itemSelected':
+                // ItemSelected does not support 'error'. But checkHasValue() returns true, so isValid is true.
+                if (validationState !== 'error') {
+                    this.updateState({ ...this.state, validation: validationState });
+                }
+                break;
+            default: {
+                // If we reach here, we must have handled all states that aren't 'loading' or 'error'
+                // But TypeScript needs to know that.
+                const _exhaustive = this.state;
+                return _exhaustive;
+            }
+        }
+        this.callbacks.onEmitValidation({ isValid, errorType: newErrorType });
+        return isValid;
+    }
+    selectItemById(id) {
+        if (!id || this.config.enableMultiple || !this.taxonomyData)
+            return;
+        const itemToSelect = this.taxonomyData.find(t => t.id === id);
+        if (itemToSelect) {
+            const searchResult = this.toSearchResult(itemToSelect);
+            const dataSource = 'dataSource' in this.state ? this.state.dataSource : undefined;
+            const dataSourceDate = 'dataSourceDate' in this.state ? this.state.dataSourceDate : undefined;
+            this.updateState({
+                status: 'itemSelected',
+                selectedItem: searchResult,
+                inputValue: searchResult.preferred_label,
+                validation: 'idle',
+                dataSource,
+                dataSourceDate,
+            });
+        }
+        this.runValidation();
+    }
+    selectItemsByIds(ids) {
+        if (!ids || !this.config.enableMultiple || !this.taxonomyData)
+            return;
+        const taxonomyItems = ids.map(id => this.taxonomyData.find(item => item.id === id));
+        if (taxonomyItems.some((item) => !item))
+            return;
+        const newSelectedItems = taxonomyItems
+            .filter((item) => !!item)
+            .map(item => this.toSearchResult(item));
+        switch (this.state.status) {
+            case 'multiSelect':
+            case 'multiSelectShowingHistory':
+                this.updateState({
+                    ...this.state,
+                    selectedItems: newSelectedItems
+                });
+                break;
+        }
+        this.runValidation();
+    }
+    setSelection(selection) {
+        const invalidIds = [];
+        const selectedItems = selection.map((item) => {
+            if (item.id !== null) {
+                const taxonomyItem = this.taxonomyData.find((taxonomy) => taxonomy.id === item.id);
+                if (!taxonomyItem) {
+                    invalidIds.push(item.id);
+                    return undefined;
+                }
+                return this.toSearchResult(taxonomyItem);
+            }
+            return this.createManualInputItem(item.preferred_label);
+        });
+        if (invalidIds.length > 0) {
+            return { ok: false, invalidIds };
+        }
+        const resolvedItems = selectedItems;
+        const commonState = this.getCommonState();
+        if (this.config.enableMultiple) {
+            this.updateState({
+                ...this.state,
+                status: 'multiSelect',
+                selectedItems: resolvedItems,
+                inputValue: '',
+                suggestions: [],
+                validation: 'idle',
+                ...commonState
+            });
+        }
+        else if (resolvedItems.length === 1) {
+            const selectedItem = resolvedItems[0];
+            this.updateState({
+                status: 'itemSelected',
+                selectedItem,
+                inputValue: selectedItem.preferred_label,
+                validation: 'idle',
+                ...commonState
+            });
+        }
+        else {
+            this.updateState({
+                status: 'searching',
+                inputValue: '',
+                suggestions: [],
+                validation: 'idle',
+                ...commonState
+            });
+        }
+        this.runValidation();
+        return { ok: true, selection: resolvedItems.map((item) => this.toPublicSelection(item)) };
+    }
+    editSelection() {
+        const selectedItem = this.state.selectedItem;
+        if (this.state.status !== 'itemSelected' || !selectedItem || !this.searchEngine)
+            return;
+        // Transition to searching first to ensure input shows up
+        const professionLabel = selectedItem.displayLabel;
+        const { dataSource, dataSourceDate } = this.state;
+        // Rule: On activation, show search results for the current string instead of history
+        const genericResults = this.searchEngine.searchAsGeneric(professionLabel, this.config.maxResults);
+        const searchResults = genericResults.flatMap(g => g.metadata?.originalResult ? [g.metadata.originalResult] : []);
+        this.updateState({
+            status: 'searching',
+            inputValue: professionLabel,
+            suggestions: searchResults,
+            validation: 'idle',
+            dataSource,
+            dataSourceDate
+        });
+    }
+    checkHasValue() {
+        switch (this.state.status) {
+            case 'itemSelected':
+                return true;
+            case 'multiSelect':
+            case 'multiSelectShowingHistory':
+                return this.state.selectedItems.length > 0;
+            case 'searching':
+            case 'showingHistory': {
+                const inputValue = 'inputValue' in this.state ? this.state.inputValue : '';
+                return !this.config.requireSelection && inputValue.trim() !== '';
+            }
+            case 'loading':
+            case 'error':
+                return false;
+            default: {
+                const _exhaustive = this.state;
+                return _exhaustive;
+            }
+        }
+    }
+    getCommonState() {
+        return {
+            dataSource: 'dataSource' in this.state ? this.state.dataSource : undefined,
+            dataSourceDate: 'dataSourceDate' in this.state ? this.state.dataSourceDate : undefined
+        };
+    }
+    resetMultiSelection() {
+        const commonState = this.getCommonState();
+        this.updateState({
+            ...this.state,
+            status: 'multiSelect',
+            selectedItems: [],
+            inputValue: '',
+            suggestions: [],
+            validation: 'idle',
+            ...commonState
+        });
+        this.callbacks.onEmitSelection([]);
+    }
+    // --- HELPERS ---
+    updateState(newState) {
+        this.state = newState;
+        this.callbacks.onStateChange(newState);
+    }
+    toSearchResult(item) {
+        return {
+            ...item,
+            rawLabel: item.preferred_label,
+            displayLabel: item.occupation_name_preferred_label
+                ? `${item.preferred_label} (${item.occupation_name_preferred_label})`
+                : item.preferred_label,
+            highlightedLabel: item.preferred_label,
+            score: 3.0,
+            // Map v2 fields to match SearchResult interface expectations if needed
+            occupationLabel: item.occupation_name_preferred_label,
+            occupationId: item.occupation_name_id,
+            ssyk_level_4_id: item.ssyk_level_4_id,
+            ssyk_code_2012: item.ssyk_code_2012
+        };
+    }
+    toPublicSelection(item) {
+        return TaxonomyAdapter.toPublicSelection(item);
+    }
+    createManualInputItem(value) {
+        return {
+            id: '',
+            type: 'ManualInput',
+            preferred_label: value,
+            rawLabel: value,
+            displayLabel: value,
+            highlightedLabel: value,
+            score: 1.0
+        };
+    }
+    findExactMatch(value) {
+        return this.taxonomyData.find(item => {
+            const displayLabel = item.occupation_name_preferred_label
+                ? `${item.preferred_label} (${item.occupation_name_preferred_label})`
+                : item.preferred_label;
+            return displayLabel.toLowerCase() === value.toLowerCase() || item.preferred_label.toLowerCase() === value.toLowerCase();
+        });
+    }
+    // --- FREETEXT HANDLING (used by keyboard handler) ---
+    handleFreeTextSelection(value) {
+        if (!value)
+            return;
+        this.isTouched = true;
+        const exactMatch = this.findExactMatch(value);
+        if (exactMatch) {
+            this.selectItem(this.toSearchResult(exactMatch));
+        }
+        else {
+            this.selectItem(this.createManualInputItem(value));
+        }
+    }
+    loadMore() {
+        // Increment maxResults or handle paging if supported by searchEngine
+        this.config.maxResults += 10;
+        const inputValue = 'inputValue' in this.state ? this.state.inputValue : '';
+        if (inputValue) {
+            this.performSearch(inputValue);
+        }
+    }
+    resetSearch() {
+        switch (this.state.status) {
+            case 'searching':
+            case 'multiSelect':
+                this.updateState({ ...this.state, inputValue: '', suggestions: [] });
+                this.showHistory(true);
+                break;
+            case 'showingHistory':
+            case 'multiSelectShowingHistory':
+                // Already showing history, just ensure input is empty
+                this.updateState({ ...this.state, inputValue: '' });
+                break;
+            case 'itemSelected':
+                this.clearSelection();
+                break;
+        }
+    }
+}
+
+const jobSelectorCss = () => `:host{--digi--grayscale-0:#ffffff;--digi--grayscale-50:#fbfbfb;--digi--grayscale-100:#f4f4f4;--digi--grayscale-200:#ededed;--digi--grayscale-300:#e4e4e4;--digi--grayscale-400:#dddddd;--digi--grayscale-500:#cacaca;--digi--grayscale-600:#acacac;--digi--grayscale-700:#757575;--digi--grayscale-800:#5c5c5c;--digi--grayscale-900:#333333;--digi--grayscale-1000:#000000;--digi--global--color--cta--link--base:#1616b2;--digi--global--color--function--danger--base:#da0000;--digi--global--color--function--success--base:#008a20;--digi--global--color--function--success--lightest-3:#d4edda;--digi--global--color--function--warning--base:#ffe200;--digi--color--text--primary:var(--digi--grayscale-900);--digi--color--text--secondary:var(--digi--grayscale-700);--digi--color--text--link:var(--digi--global--color--cta--link--base);--digi--color--icons--success:var(--digi--global--color--function--success--base);--digi--color--icons--warning:#8a7a00;--digi--color--icons--danger:var(--digi--global--color--function--danger--base);--digi--global--typography--font-family--default:"Open Sans", Arial, sans-serif;--digi--global--typography--font-size--base:1rem;--digi--global--typography--font-size--small:0.875rem;--digi--global--typography--font-weight--regular:400;--digi--global--typography--font-weight--semibold:600;--digi--global--typography--font-weight--bold:700;--digi--global--typography--line-height--base:1.5;--digi--typography--label--font-size--desktop:1rem;--digi--typography--label--font-weight--desktop:600;--digi--typography--label--line-height--desktop:1.5;--digi--typography--label-description--font-size--desktop:1rem;--digi--typography--label-description--line-height--desktop:1.5;--digi--typography--tag--font-size--desktop:0.875rem;--digi--gutter--icon:0.625rem;--digi--gutter--smaller:0.75rem;--digi--gutter--small:0.875rem;--digi--gutter--medium:1rem;--digi--border-width--primary:1px;--digi--border-style--primary:solid;--digi--border-radius--primary:0;--digi--border-radius--secondary:6px;--af-tag-color:#091d54;--af-tag-hover-background:#ddf1fc}.af-form-label{color:var(--digi--color--text--primary);display:flex;flex-direction:column;font-family:var(--digi--global--typography--font-family--default);font-size:var(--digi--typography--label--font-size--desktop);margin-bottom:0.5rem}.af-form-label__label{cursor:pointer;display:block;font-weight:var(--digi--typography--label--font-weight--desktop);line-height:var(--digi--typography--label--line-height--desktop)}.af-form-label__description{display:block;font-size:var(--digi--typography--label-description--font-size--desktop);line-height:var(--digi--typography--label-description--line-height--desktop);max-width:35rem}.af-validation-message{align-items:center;display:flex;flex-wrap:wrap}.af-validation-message__icon{flex:0 0 auto;height:1.25em;margin-inline-end:var(--digi--gutter--icon);width:1.25em}.af-validation-message__icon--success,.af-validation-message__icon--error{background-color:var(--af-validation-icon-color, currentColor);-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:contain;mask-size:contain}.af-validation-message__icon--success{--af-validation-icon-color:var(--digi--color--icons--success);-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 25 25'%3E%3Cpath d='M25 12.5C25 19.404 19.404 25 12.5 25S0 19.404 0 12.5 5.596 0 12.5 0 25 5.596 25 12.5zm-13.946 6.619l9.274-9.275a.806.806 0 000-1.14l-1.14-1.14a.806.806 0 00-1.14 0l-7.564 7.563-3.531-3.531a.807.807 0 00-1.14 0l-1.141 1.14a.806.806 0 000 1.14l5.242 5.243a.806.806 0 001.14 0z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 25 25'%3E%3Cpath d='M25 12.5C25 19.404 19.404 25 12.5 25S0 19.404 0 12.5 5.596 0 12.5 0 25 5.596 25 12.5zm-13.946 6.619l9.274-9.275a.806.806 0 000-1.14l-1.14-1.14a.806.806 0 00-1.14 0l-7.564 7.563-3.531-3.531a.807.807 0 00-1.14 0l-1.141 1.14a.806.806 0 000 1.14l5.242 5.243a.806.806 0 001.14 0z'/%3E%3C/svg%3E")}.af-validation-message__icon--error{--af-validation-icon-color:var(--digi--color--icons--danger);-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Cpath d='M34.4328058,0 C35.5494848,0 36.5900526,0.609146757 37.1483921,1.58958113 L47.5812454,19.9104189 C48.1395849,20.8909496 48.1395849,22.1090504 47.5812454,23.0895811 L37.1483921,41.4104189 C36.5900526,42.3908532 35.5494848,43 34.4328058,43 L13.5671942,43 C12.4505152,43 11.4099474,42.3908532 10.8516079,41.4104189 L0.41875464,23.0895811 C-0.13958488,22.1090504 -0.13958488,20.8909496 0.41875464,19.9104189 L10.8516079,1.58958113 C11.4099474,0.609146757 12.4505152,0 13.5671942,0 Z M18.6736823,12.3728178 C18.2711762,11.964729 17.6203819,11.964729 17.2178757,12.3728178 L15.2825964,14.334939 C14.8800903,14.7430278 14.8800903,15.4028485 15.2825964,15.8109373 L20.6089616,21.2111779 L15.2825964,26.6114185 C14.8800903,27.0195074 14.8800903,27.6793281 15.2825964,28.0874169 L17.2178757,30.049538 C17.6203819,30.4576269 18.2711762,30.4576269 18.6736823,30.049538 L24.0000475,24.6492974 L29.3264127,30.049538 C29.7289188,30.4576269 30.3797132,30.4576269 30.7822193,30.049538 L32.7174986,28.0874169 C33.1200048,27.6793281 33.1200048,27.0195074 32.7174986,26.6114185 L27.3911334,21.2111779 L32.7174986,15.8109373 C33.1200048,15.4028485 33.1200048,14.7430278 32.7174986,14.334939 L30.7822193,12.3728178 C30.3797132,11.964729 29.7289188,11.964729 29.3264127,12.3728178 L24.0000475,17.7730584 Z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Cpath d='M34.4328058,0 C35.5494848,0 36.5900526,0.609146757 37.1483921,1.58958113 L47.5812454,19.9104189 C48.1395849,20.8909496 48.1395849,22.1090504 47.5812454,23.0895811 L37.1483921,41.4104189 C36.5900526,42.3908532 35.5494848,43 34.4328058,43 L13.5671942,43 C12.4505152,43 11.4099474,42.3908532 10.8516079,41.4104189 L0.41875464,23.0895811 C-0.13958488,22.1090504 -0.13958488,20.8909496 0.41875464,19.9104189 L10.8516079,1.58958113 C11.4099474,0.609146757 12.4505152,0 13.5671942,0 Z M18.6736823,12.3728178 C18.2711762,11.964729 17.6203819,11.964729 17.2178757,12.3728178 L15.2825964,14.334939 C14.8800903,14.7430278 14.8800903,15.4028485 15.2825964,15.8109373 L20.6089616,21.2111779 L15.2825964,26.6114185 C14.8800903,27.0195074 14.8800903,27.6793281 15.2825964,28.0874169 L17.2178757,30.049538 C17.6203819,30.4576269 18.2711762,30.4576269 18.6736823,30.049538 L24.0000475,24.6492974 L29.3264127,30.049538 C29.7289188,30.4576269 30.3797132,30.4576269 30.7822193,30.049538 L32.7174986,28.0874169 C33.1200048,27.6793281 33.1200048,27.0195074 32.7174986,26.6114185 L27.3911334,21.2111779 L32.7174986,15.8109373 C33.1200048,15.4028485 33.1200048,14.7430278 32.7174986,14.334939 L30.7822193,12.3728178 C30.3797132,11.964729 29.7289188,11.964729 29.3264127,12.3728178 L24.0000475,17.7730584 Z'/%3E%3C/svg%3E")}.af-validation-message__icon--warning{background:center / contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Ccircle cx='9' cy='9' r='6.75' fill='%23333'/%3E%3Cpath d='m18 9c0 4.9717-4.0298 9-9 9-4.9702 0-9-4.0283-9-9 0-4.9688 4.0298-9 9-9 4.9702 0 9 4.0312 9 9zm-9 1.8145c-0.92196 0-1.6694 0.7474-1.6694 1.6694 0 0.92196 0.7474 1.6694 1.6694 1.6694s1.6694-0.7474 1.6694-1.6694c0-0.92196-0.7474-1.6694-1.6694-1.6694zm-1.3157-1.065c0.012593 0.23095 0.20355 0.41175 0.43483 0.41175h1.7618c0.23128 0 0.42224-0.1808 0.43483-0.41175l0.2692-4.9355c0.013609-0.24946-0.18501-0.45922-0.43483-0.45922h-2.3002c-0.24982 0-0.4484 0.20976-0.43479 0.45922l0.2692 4.9355z' fill='%23FFE200'/%3E%3C/svg%3E");position:relative;top:3px}.af-validation-message__text{color:var(--digi--color--text--primary);flex:1;font-family:var(--digi--global--typography--font-family--default);font-size:var(--digi--typography--tag--font-size--desktop);transform:translateY(1px)}.af-tag{display:block;max-width:100%;min-width:0}.af-tag__button{align-items:center;background:var(--digi--grayscale-0);border:var(--digi--border-width--primary) var(--digi--border-style--primary) var(--af-tag-color);border-radius:var(--digi--border-radius--secondary);color:var(--af-tag-color);cursor:pointer;display:inline-flex;font-family:var(--digi--global--typography--font-family--default);font-size:0.875rem;font-weight:var(--digi--global--typography--font-weight--semibold);gap:10px;height:auto;max-width:100%;min-height:unset;min-width:0;padding:6px 8px;text-align:left;white-space:normal}.af-tag__button:hover{background:var(--af-tag-hover-background)}.af-tag__button:focus-visible{background:var(--af-tag-hover-background);border-color:var(--af-tag-color);outline:2px solid var(--digi--grayscale-1000);outline-offset:2px;box-shadow:0 0 0 5px var(--digi--grayscale-0)}.af-tag__button:active{background:var(--af-tag-hover-background)}.af-tag__text{display:inline-block;max-width:100%;min-width:0;white-space:normal}.af-tag__text--break{overflow-wrap:anywhere;word-break:break-word}.af-tag__remove-icon{flex:0 0 auto;height:1em;min-height:0 !important;width:1em}:host{--yrkesvaljaren-width:var(--af-width, 100%);--yrkesvaljaren-min-width:var(--af-min-width, 200px);--yrkesvaljaren-max-width:var(--af-max-width, none);--yrkesvaljaren-height:var(--af-height, auto);--yrkesvaljaren-min-height:var(--af-min-height, auto);--yrkesvaljaren-max-height:var(--af-max-height, none);--selector-width:var(--yrkesvaljaren-width);--selector-min-width:var(--yrkesvaljaren-min-width);--selector-max-width:var(--yrkesvaljaren-max-width);--selector-height:var(--yrkesvaljaren-height);--selector-min-height:var(--yrkesvaljaren-min-height);--selector-max-height:var(--yrkesvaljaren-max-height);--selector-font-family:var(--global-font-family, 'Open Sans', sans-serif);--selector-font-size:var(--sok-font-size, 1rem);--selector-text-color:var(--sok-text-color, #212529);--selector-placeholder-color:var(--sok-placeholder-color, #6c757d);--selector-border-color:var(--sok-border-color, #d1d5db);--selector-focus-border-color:var(--sok-focus-border-color, #86b7fe);--selector-focus-shadow:var(--sok-focus-shadow, 0 0 0 0.25rem rgba(13, 110, 253, 0.25));--selector-background-color:var(--sok-background-color, #fff);--selector-icon-color:var(--sok-icon-color, #6c757d);--selector-clear-button-color:var(--sok-clear-button-color, #6c757d);--selector-clear-button-hover-color:var(--sok-clear-button-hover-color, #212529);--selector-suggestion-background-color:var(--sok-suggestion-background-color, #fff);--selector-suggestion-border-color:var(--sok-suggestion-border-color, #ced4da);--selector-suggestion-hover-background:var(--sok-suggestion-hover-background, #e9ecef);--selector-suggestion-active-background:var(--sok-suggestion-active-background, #dde4eb);--selector-suggestion-text-color:var(--sok-suggestion-text-color, #212529);--selector-suggestion-highlight-weight:var(--sok-suggestion-highlight-weight, bold);--selector-error-color:var(--sok-error-color, #dc3545);--selector-loading-color:var(--sok-loading-color, #6c757d);display:flex;flex-direction:column;width:var(--yrkesvaljaren-width);min-width:var(--yrkesvaljaren-min-width);max-width:var(--yrkesvaljaren-max-width);height:var(--yrkesvaljaren-height);min-height:var(--yrkesvaljaren-min-height);max-height:var(--yrkesvaljaren-max-height);position:relative}:host([af-size="small"]){--cs-size:small;--selector-container-min-height:32px;--selector-padding-y:2px;--selector-icon-size:1em;--selector-gap:4px}:host([af-size="medium"]){--selector-container-min-height:40px;--selector-padding-y:6px}:host([af-size="large"]){--selector-container-min-height:48px;--selector-padding-y:10px;--selector-icon-size:1.25em;--selector-gap:8px}*{box-sizing:border-box}.yrkesvaljaren-wrapper{display:flex;flex-direction:column;flex:1;min-height:inherit}core-selector{margin-top:0.5rem}.status-message{margin-top:0.5rem;font-size:0.9em;font-style:italic;color:var(--sok-loading-color, #6c757d)}.history-header{font-size:0.875rem;color:var(--digi--grayscale-700, #757575);border-bottom:1px solid var(--selector-suggestion-border-color, #ced4da);margin-bottom:0px}.history-header a{color:inherit;text-decoration:underline}.history-header a:hover{color:var(--digi--global--color--cta--link--base, #1616B2)}`;
+
+{
+    log.setLevel(log.levels.SILENT);
+}
+const YV_LATEST_DATA_URL = 'https://d3hng02m5bee8m.cloudfront.net/yrkesvaljaren/latest.json';
+const CONCEPT_ID_PATTERN = /^[123456789abcdefghijkmnopqrstuvwxyzABCDEFGHJKLMNPQRSTUVWXYZ]{4}_[123456789abcdefghijkmnopqrstuvwxyzABCDEFGHJKLMNPQRSTUVWXYZ]{3}_[123456789abcdefghijkmnopqrstuvwxyzABCDEFGHJKLMNPQRSTUVWXYZ]{3}$/;
+const JobSelector = class {
+    get hostElement() { return getElement(this); }
+    internals;
+    /**
+     * HTML-formulärets fältnamn. Följer standardattributet `name`, på samma sätt som
+     * `<input name="...">`, och används som nyckel när värdet läses via `FormData`.
+     */
+    name = 'yrkesvaljaren';
+    /**
+     * Fullständig, explicit URL till en egenhostad datafil.
+     * Utelämna attributet för att använda senaste data automatiskt.
+     */
+    taxonomyUrl;
+    placeholder = PLACEHOLDER_TEXT;
+    label = 'Välj yrke';
+    /** Om satt till true kan väljaren inte användas med mus eller tangentbord. */
+    disabled = false;
+    enableMultiple = false;
+    showSearchIcon = true;
+    errorMessage;
+    labelDescription;
+    /** Om satt till `true` måste fältet ha ett värde för att vara giltigt. */
+    required = false;
+    /** Om satt till `true` tillåts fritext som inte finns i taxonomin. */
+    manualInput = false;
+    /**
+     * Aktiverar historiken.
+     * Använder Local Storage för att spara valda yrken i webbläsaren.
+     * Integritet: Data lagras bara lokalt i webbläsaren.
+     * Räckvidd: Historiken delas mellan sidor på samma domän.
+     */
+    history = true;
+    /**
+     * Om satt till true visas populära yrken initialt när historiken är tom.
+     */
+    popular = true;
+    // Interna konstanter och inställningar som inte exponeras för klienten
+    maxHistoryItems = 10;
+    enableSelectionAnimation = false;
+    afFocused = false;
+    populateInputOnSelect = false;
+    maxVisibleRows;
+    minLength = MIN_INPUT_LENGTH;
+    maxResults = 10;
+    get requireSelection() {
+        return !this.manualInput;
+    }
+    /**
+     * Storleken på inputfältet.
+     * 'small' | 'medium' | 'large'
+     */
+    size = 'medium';
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.afJobSelectedEmitter = createEvent(this, "afJobSelected");
+        this.dataLoadFailedEmitter = createEvent(this, "afJobDataLoadFailed");
+        this.validationChangeEmitter = createEvent(this, "afJobValidationChange");
+        if (hostRef.$hostElement$["s-ei"]) {
+            this.internals = hostRef.$hostElement$["s-ei"];
+        }
+        else {
+            this.internals = hostRef.$hostElement$.attachInternals();
+            hostRef.$hostElement$["s-ei"] = this.internals;
+        }
+        log.debug('[JobSelector] Constructor - enableMultiple:', this.enableMultiple);
+    }
+    state = { status: 'loading' };
+    /**
+     * Spårar vilken typ av fel som är aktivt,
+     * för att kunna visa rätt meddelande.
+     */
+    activeErrorType = null;
+    animatingItemId = null;
+    animationTimer;
+    cloneSelection(selection) {
+        return selection.map((item) => item.id === null
+            ? { ...item }
+            : {
+                ...item,
+                related: item.related ? { ...item.related } : undefined,
+            });
+    }
+    rebuildValidJobIds() {
+        const taxonomyData = this.controller?.getTaxonomyData?.() ?? this.taxonomyData ?? [];
+        this.validJobIds = new Set(taxonomyData.map((item) => item.id).filter(Boolean));
+    }
+    validateSelectionCandidate(candidate) {
+        const values = typeof candidate === 'string'
+            ? [candidate]
+            : Array.isArray(candidate)
+                ? candidate
+                : null;
+        if (!values) {
+            return { ok: false, reason: 'invalid-input' };
+        }
+        const hasStrings = values.some((item) => typeof item === 'string');
+        const hasObjects = values.some((item) => typeof item === 'object' && item !== null);
+        if ((hasStrings && hasObjects) || values.some((item) => typeof item !== 'string' && (typeof item !== 'object' || item === null))) {
+            return { ok: false, reason: 'invalid-input' };
+        }
+        const selection = [];
+        const taxonomyIds = [];
+        const manualLabels = [];
+        for (const item of values) {
+            if (typeof item === 'string') {
+                const value = item.trim();
+                if (!value) {
+                    return { ok: false, reason: 'invalid-input' };
+                }
+                if (CONCEPT_ID_PATTERN.test(value)) {
+                    taxonomyIds.push(value);
+                    selection.push({ id: value });
+                }
+                else {
+                    if (!this.manualInput) {
+                        return { ok: false, reason: 'manual-input-disabled' };
+                    }
+                    manualLabels.push(value);
+                    selection.push({ type: 'manual-input', id: null, preferred_label: value });
+                }
+                continue;
+            }
+            if (!item || typeof item !== 'object') {
+                return { ok: false, reason: 'invalid-input' };
+            }
+            const candidateItem = item;
+            if (typeof candidateItem.id === 'string') {
+                const id = candidateItem.id.trim();
+                if (!id
+                    || (candidateItem.type !== 'job-title'
+                        && candidateItem.type !== 'occupation-name')
+                    || typeof candidateItem.preferred_label !== 'string'
+                    || !candidateItem.preferred_label.trim()) {
+                    return { ok: false, reason: 'invalid-input' };
+                }
+                if (candidateItem.related !== undefined) {
+                    const related = candidateItem.related;
+                    if (!related
+                        || related.type !== 'occupation-name'
+                        || typeof related.id !== 'string'
+                        || !related.id.trim()
+                        || typeof related.preferred_label !== 'string'
+                        || !related.preferred_label.trim()) {
+                        return { ok: false, reason: 'invalid-input' };
+                    }
+                }
+                taxonomyIds.push(id);
+                selection.push({ id });
+            }
+            else if (candidateItem.id === null && candidateItem.type === 'manual-input') {
+                if (typeof candidateItem.preferred_label !== 'string' || !candidateItem.preferred_label.trim()) {
+                    return { ok: false, reason: 'invalid-input' };
+                }
+                if (!this.manualInput) {
+                    return { ok: false, reason: 'manual-input-disabled' };
+                }
+                const label = candidateItem.preferred_label.trim();
+                manualLabels.push(label);
+                selection.push({ type: 'manual-input', id: null, preferred_label: label });
+            }
+            else {
+                return { ok: false, reason: 'invalid-input' };
+            }
+        }
+        if (!this.enableMultiple && selection.length > 1) {
+            return { ok: false, reason: 'multiple-disabled' };
+        }
+        if (new Set(taxonomyIds).size !== taxonomyIds.length) {
+            return { ok: false, reason: 'duplicate-taxonomy-id' };
+        }
+        if (new Set(manualLabels).size !== manualLabels.length) {
+            return { ok: false, reason: 'duplicate-manual-label' };
+        }
+        const invalidIds = taxonomyIds.filter((id) => !this.validJobIds.has(id));
+        if (invalidIds.length > 0) {
+            return { ok: false, reason: 'unknown-id', invalidIds };
+        }
+        return { ok: true, selection };
+    }
+    describeSelectionRejection(rejection) {
+        switch (rejection.reason) {
+            case 'invalid-input':
+                return 'setSelection accepterar en sträng, en homogen strängarray eller en array med fullständiga JobSelectionItem-objekt.';
+            case 'data-unavailable':
+                return 'setSelection kan inte användas eftersom yrkesdata inte kunde laddas.';
+            case 'duplicate-taxonomy-id':
+                return 'selection får inte innehålla dubbla taxonomi-id:n.';
+            case 'duplicate-manual-label':
+                return 'selection får inte innehålla dubbla manuella labels.';
+            case 'multiple-disabled':
+                return 'flera värden kräver af-enable-multiple="true".';
+            case 'manual-input-disabled':
+                return 'manual-val kräver af-manual-input="true".';
+            case 'unknown-id':
+                return `okända Concept ID:n: ${rejection.invalidIds?.join(', ')}`;
+        }
+    }
+    errorCodeForRejection(reason) {
+        switch (reason) {
+            case 'unknown-id':
+                return 'unknown-id';
+            case 'manual-input-disabled':
+                return 'manual-input-disabled';
+            case 'multiple-disabled':
+                return 'multiple-disabled';
+            default:
+                return 'invalid-input';
+        }
+    }
+    rejectSelection(candidate, rejection) {
+        const message = this.describeSelectionRejection(rejection);
+        console.error(`[Yrkesväljaren] Ogiltig selection: ${message} Värdet accepterades inte; senaste giltiga val behålls.`, { selection: candidate, previousSelection: this.lastAcceptedSelection });
+        this.activeErrorType = 'invalidInput';
+        this.validationChangeEmitter.emit({ isValid: false, errorType: 'invalidInput' });
+        this.updateValidity(false);
+        return new InvalidSelectionError(message, this.errorCodeForRejection(rejection.reason), rejection.invalidIds);
+    }
+    syncAcceptedSelection(selection) {
+        const nextSelection = this.cloneSelection(selection);
+        this.lastAcceptedSelection = nextSelection;
+        if (this.activeErrorType === 'invalidInput') {
+            const hasAcceptedSelection = nextSelection.length > 0;
+            const isValid = hasAcceptedSelection || !this.required;
+            const errorType = isValid ? null : 'required';
+            this.activeErrorType = errorType;
+            this.validationChangeEmitter.emit({ isValid, errorType });
+            this.updateValidity(isValid);
+        }
+    }
+    applySelection(candidate) {
+        if (!this.controller) {
+            throw this.rejectSelection(candidate, { ok: false, reason: 'data-unavailable' });
+        }
+        const validation = this.validateSelectionCandidate(candidate);
+        if (!validation.ok) {
+            throw this.rejectSelection(candidate, validation);
+        }
+        const result = this.controller.setSelection(validation.selection);
+        if (!result.ok) {
+            throw this.rejectSelection(candidate, { ok: false, reason: 'unknown-id', invalidIds: result.invalidIds });
+        }
+        this.syncAcceptedSelection(result.selection);
+        return this.cloneSelection(result.selection);
+    }
+    watchRequired(newValue) {
+        this.controller.updateConfig({ required: newValue });
+    }
+    watchManualInput(newValue) {
+        this.controller.updateConfig({ requireSelection: !newValue });
+    }
+    watchHistory(newValue) {
+        this.controller.updateConfig({ history: newValue });
+    }
+    watchPopular(newValue) {
+        this.controller.updateConfig({ popular: newValue });
+    }
+    watchEnableMultiple(newValue) {
+        this.controller.updateConfig({ enableMultiple: newValue });
+    }
+    watchDisabled(newValue) {
+        if (newValue)
+            this.afFocused = false;
+    }
+    watchTaxonomyData(newValue) {
+        if (this.controller && newValue && newValue.length > 0) {
+            this.controller.initialize(newValue).then(() => {
+                this.rebuildValidJobIds();
+                this.restoreAcceptedSelectionAfterDataUpdate();
+            });
+        }
+    }
+    /**
+     * Yrkesdata (taxonomi). Kan injiceras av integratören för deterministisk laddning (t.ex. i testmiljöer).
+     * Om den lämnas tom populeras den internt via det globala registret eller auto-fetch för att exponera aktuell data.
+     */
+    taxonomyData = [];
+    afJobSelectedEmitter;
+    syncFormValue() {
+        if (!this.state)
+            return;
+        if (this.enableMultiple) {
+            const selected = (this.state.status === 'multiSelect' || this.state.status === 'multiSelectShowingHistory')
+                ? this.state.selectedItems
+                : [];
+            const formData = new FormData();
+            selected.forEach(item => {
+                formData.append(this.name, item.id || item.rawLabel);
+            });
+            this.internals.setFormValue(formData);
+        }
+        else {
+            const selected = this.state.status === 'itemSelected' ? this.state.selectedItem : null;
+            this.internals.setFormValue(selected ? selected.id || selected.rawLabel : null);
+        }
+    }
+    handleFormValidationSync(event) {
+        this.updateValidity(event.detail.isValid);
+    }
+    dataLoadFailedEmitter;
+    validationChangeEmitter;
+    static nextId = 0;
+    componentId = `job-selector-${JobSelector.nextId++}`;
+    observer;
+    controller;
+    validJobIds = new Set();
+    lastAcceptedSelection = [];
+    restoreAcceptedSelectionAfterDataUpdate() {
+        if (this.lastAcceptedSelection.length === 0) {
+            return;
+        }
+        const result = this.controller.setSelection(this.lastAcceptedSelection);
+        if (result.ok) {
+            this.syncAcceptedSelection(result.selection);
+            return;
+        }
+        this.rejectSelection(this.lastAcceptedSelection, {
+            ok: false,
+            reason: 'unknown-id',
+            invalidIds: result.invalidIds,
+        });
+    }
+    // --- LIVSCYKEL-METODER ---
+    async componentWillLoad() {
+        log.setLevel(log.levels.WARN);
+        // Använd registrerad data om den finns. Annars används en explicit URL
+        // eller senaste publicerade data.
+        const registeredData = getRegisteredTaxonomy();
+        const hasData = (this.taxonomyData && this.taxonomyData.length > 0) || (registeredData && registeredData.length > 0);
+        if (!hasData) {
+            this.state = { status: 'loading' };
+            try {
+                const dataUrl = this.taxonomyUrl ?? YV_LATEST_DATA_URL;
+                log.debug(`[JobSelector] Hämtar yrkesdata från: ${dataUrl}`);
+                const response = await fetch(dataUrl);
+                if (!response.ok) {
+                    throw new Error(`Kunde inte ladda yrkesdata från ${dataUrl}: ${response.status} ${response.statusText}`);
+                }
+                const data = await response.json();
+                if (!isTaxonomyRegistration(data)) {
+                    throw new Error('Yrkesdatan har ett ogiltigt format.');
+                }
+                registerTaxonomy(data);
+                log.debug('[JobSelector] Data-laddning lyckades.');
+            }
+            catch (error) {
+                log.error('[JobSelector] Fel vid data-laddning:', error);
+                this.state = { status: 'error', message: 'Kunde inte ladda yrkesdata.' };
+                this.dataLoadFailedEmitter.emit({ error: error instanceof Error ? error : new Error(String(error)) });
+                return;
+            }
+        }
+        this.controller = new JobSelectorController({
+            onStateChange: (state) => {
+                this.state = { ...state };
+                this.syncFormValue();
+            },
+            onEmitSelection: (selection) => {
+                const nextSelection = selection
+                    ? (Array.isArray(selection) ? selection : [selection])
+                    : [];
+                this.syncAcceptedSelection(nextSelection);
+                this.afJobSelectedEmitter.emit(nextSelection);
+            },
+            onEmitValidation: (payload) => {
+                this.activeErrorType = payload.errorType;
+                this.validationChangeEmitter.emit(payload);
+            },
+            onEmitDataLoadFailed: (error) => { this.dataLoadFailedEmitter.emit({ error }); },
+            onEmitStatusChange: () => { },
+        }, {
+            enableMultiple: this.enableMultiple,
+            required: this.required,
+            requireSelection: this.requireSelection,
+            history: this.history,
+            popular: this.popular,
+            maxHistoryItems: this.maxHistoryItems,
+            minLength: this.minLength,
+            maxResults: this.maxResults,
+        });
+        // Initialisera controller (den läser in data från registret eller använder injicerad data)
+        await this.controller.initialize(this.taxonomyData);
+        this.taxonomyData = this.controller.getTaxonomyData();
+        this.rebuildValidJobIds();
+        // Sätt initial valideringsstatus för FACE
+        if (this.activeErrorType === 'invalidInput') {
+            this.updateValidity(false);
+        }
+        else if (this.required && this.lastAcceptedSelection.length === 0) {
+            this.internals.setValidity({ customError: true }, this.errorMessage || 'Välj ett yrke från listan.');
+        }
+        else {
+            this.internals.setValidity({});
+        }
+    }
+    componentDidLoad() {
+        this.handleHashFocus();
+    }
+    disconnectedCallback() {
+        if (this.observer) {
+            this.observer.disconnect();
+        }
+        if (this.controller) {
+            this.controller.destroy();
+        }
+        clearTimeout(this.animationTimer);
+        this.animationTimer = undefined;
+    }
+    handleHashFocus() {
+        const hash = window.location.hash;
+        if (!hash)
+            return;
+        const targetId = hash.substring(1);
+        const hostId = this.hostElement.getAttribute('id');
+        if (hostId && targetId === hostId) {
+            this.setFocus();
+            this.hostElement.scrollIntoView({ behavior: 'smooth', block: 'center' });
+            history.replaceState(null, '', window.location.pathname + window.location.search);
+        }
+    }
+    // --- ANVÄNDARINTERAKTIONER OCH LOGIK (Delegerat till Controller via CoreSelector events) ---
+    handleInput(event) {
+        this.afFocused = true;
+        this.controller.handleInput(event.detail);
+    }
+    handleCsSelect(event) {
+        this.afFocused = true;
+        const genericItem = event.detail;
+        if (this.enableSelectionAnimation) {
+            this.animatingItemId = genericItem.id;
+            clearTimeout(this.animationTimer);
+            this.animationTimer = setTimeout(() => {
+                this.animatingItemId = null;
+                this.animationTimer = undefined;
+            }, 600);
+        }
+        // Hämta originalobjektet från metadata om det finns, annars bygg ett baserat på genericItem
+        const originalItem = genericItem.metadata?.original;
+        if (originalItem && 'displayLabel' in originalItem) {
+            this.controller.selectItem(originalItem);
+        }
+        else {
+            // Fallback för manuell inmatning eller om metadata saknas
+            if (genericItem.metadata?.type === 'ManualInput') {
+                this.controller.handleFreeTextSelection(genericItem.label);
+            }
+            else {
+                // Detta borde inte hända med data från suggestions, men för säkerhets skull
+                const searchResult = {
+                    id: genericItem.id,
+                    type: 'unknown',
+                    preferred_label: genericItem.label,
+                    rawLabel: genericItem.label,
+                    displayLabel: genericItem.label,
+                    highlightedLabel: genericItem.highlightedLabel || genericItem.label,
+                    score: 1.0
+                };
+                this.controller.selectItem(searchResult);
+            }
+        }
+    }
+    handleCsClear() {
+        this.controller.resetSearch();
+    }
+    handleCsClearHistory() {
+        this.controller.clearHistory();
+    }
+    handleCsRequestHistory() {
+        this.controller.showHistory();
+    }
+    handleCsLoadMore() {
+        this.controller.loadMore();
+    }
+    handleCsRemoveItem(event) {
+        const genericItem = event.detail;
+        const originalItem = genericItem.metadata?.original;
+        if (originalItem && 'displayLabel' in originalItem) {
+            this.controller.removeItem(originalItem);
+        }
+    }
+    handleCsFocus() {
+        this.afFocused = true;
+        this.controller.handleFocus();
+    }
+    handleCsBlur() {
+        this.afFocused = false;
+        this.controller.handleBlur();
+        this.validate(); // Ensure events are emitted on blur
+    }
+    handleCsEditSelection() {
+        this.afFocused = true;
+        this.controller.editSelection();
+    }
+    /**
+     * Uppdaterar taxonomidatan genom att läsa om från registret.
+     * Används efter att registerTaxonomy() har anropats med ny data.
+     */
+    async updateData() {
+        log.debug('[JobSelector] updateData called');
+        await this.controller.initialize();
+        this.taxonomyData = this.controller.getTaxonomyData();
+        this.rebuildValidJobIds();
+        this.restoreAcceptedSelectionAfterDataUpdate();
+    }
+    /**
+     * Sätter ett programatiskt val och returnerar YV:s normaliserade, rika selection.
+     * Strängar som matchar Concept ID-formatet tolkas som taxonomi-id:n; övriga som fritext.
+     */
+    async setSelection(input) {
+        return this.applySelection(input);
+    }
+    async setFocus() {
+        const coreSelector = this.hostElement.shadowRoot?.querySelector('core-selector');
+        if (coreSelector && typeof coreSelector.setFocus === 'function') {
+            await coreSelector.setFocus();
+        }
+    }
+    /**
+     * Validerar komponenten manuellt.
+     * @param forceTouch - Om true, tvingas valideringsfel att visas även om användaren inte interagerat med fältet.
+     */
+    async validate(forceTouch = false) {
+        const isValid = await this.controller.runValidation(forceTouch);
+        this.updateValidity(isValid);
+        return isValid;
+    }
+    async checkValidity() {
+        return this.internals.checkValidity();
+    }
+    async reportValidity() {
+        return this.internals.reportValidity();
+    }
+    async getValidity() {
+        return this.internals.validity;
+    }
+    async getValidationMessage() {
+        return this.internals.validationMessage;
+    }
+    updateValidity(isValid) {
+        if (!isValid) {
+            const message = this.activeErrorType === 'invalidInput'
+                ? this.errorMessage || 'Komponenten har fått ett ogiltigt värde.'
+                : this.errorMessage || 'Välj ett yrke från listan.';
+            this.internals.setValidity({ customError: true }, message);
+        }
+        else {
+            this.internals.setValidity({});
+        }
+    }
+    // --- MAPPING HELPERS ---
+    _mapSearchResultToGenericItem(item) {
+        const isSelectedResult = this.enableMultiple
+            ? (this.state.status === 'multiSelect' || this.state.status === 'multiSelectShowingHistory') &&
+                this.state.selectedItems.some(si => {
+                    if (si.id && item.id)
+                        return si.id === item.id;
+                    return si.rawLabel === item.rawLabel;
+                })
+            : this.state.status === 'itemSelected' && this.state.selectedItem?.id === item.id;
+        return {
+            id: item.id,
+            label: item.displayLabel, // Use the formatted label
+            isSelected: this.animatingItemId === item.id || isSelectedResult,
+            highlightedLabel: item.highlightedLabel,
+            displaySegments: item.displaySegments, // Pass structured segments
+            group: item.type === 'occupation-name' ? 'Yrkesgrupper' : 'Yrkesbenämningar',
+            metadata: {
+                original: item // Store the full object for retrieval
+            }
+        };
+    }
+    _mapStateToSelectorState(componentState) {
+        let coreStatus = 'loading';
+        let inputValue = '';
+        let suggestions = [];
+        let selectedItem;
+        let selectedItems = [];
+        let validation = 'idle';
+        let message = this.errorMessage || '';
+        let validationContext = undefined;
+        let listHeader;
+        let showHistoryHeader;
+        // Map Validation
+        if ('validation' in componentState && componentState.validation) {
+            validation = componentState.validation;
+            if (componentState.validation === 'error') {
+                if (this.activeErrorType === 'required') {
+                    message = this.errorMessage || 'Välj ett yrke från listan.';
+                }
+                else if (this.activeErrorType === 'invalidInput') {
+                    message = this.errorMessage || 'Välj ett yrke från listan.';
+                }
+                else if (this.errorMessage) {
+                    message = this.errorMessage;
+                }
+            }
+            else if (componentState.validation === 'success') {
+                message = 'Tack!';
+            }
+        }
+        if ('message' in componentState && componentState.message) {
+            message = componentState.message;
+        }
+        if ('validationContext' in componentState) {
+            validationContext = componentState.validationContext;
+        }
+        // Map Status & Data
+        switch (componentState.status) {
+            case 'loading':
+                coreStatus = 'loading';
+                break;
+            case 'error':
+                coreStatus = 'error';
+                break;
+            case 'searching':
+                coreStatus = 'searching';
+                inputValue = componentState.inputValue;
+                suggestions = componentState.suggestions.map(s => this._mapSearchResultToGenericItem(s));
+                break;
+            case 'showingHistory':
+                coreStatus = 'searching';
+                inputValue = componentState.inputValue || '';
+                suggestions = componentState.historyItems.map(s => this._mapSearchResultToGenericItem(s));
+                break;
+            case 'itemSelected':
+                coreStatus = 'itemSelected';
+                selectedItem = this._mapSearchResultToGenericItem(componentState.selectedItem);
+                selectedItem.highlightedLabel = styleParentheticalText(selectedItem.label);
+                inputValue = componentState.inputValue || '';
+                break;
+            case 'multiSelect':
+                coreStatus = 'multiSelect';
+                inputValue = componentState.inputValue;
+                suggestions = componentState.suggestions.map(s => this._mapSearchResultToGenericItem(s));
+                selectedItems = componentState.selectedItems.map(s => this._mapSearchResultToGenericItem(s));
+                break;
+            case 'multiSelectShowingHistory':
+                coreStatus = 'multiSelect';
+                inputValue = componentState.inputValue || '';
+                suggestions = componentState.historyItems.map(s => this._mapSearchResultToGenericItem(s));
+                selectedItems = componentState.selectedItems.map(s => this._mapSearchResultToGenericItem(s));
+                break;
+        }
+        const isHistoryView = componentState.status === 'showingHistory' || componentState.status === 'multiSelectShowingHistory';
+        if (coreStatus === 'multiSelect' || coreStatus === 'itemSelected' || coreStatus === 'searching') {
+            // 1. Hide already selected items from the dropdown (YV specific requirement)
+            if (selectedItems.length > 0) {
+                suggestions = suggestions.filter(s => {
+                    return !selectedItems.some(si => (si.id && s.id) ? si.id === s.id : si.label === s.label);
+                });
+            }
+            // 1. Set dynamic list header
+            if (isHistoryView && suggestions.length > 0) {
+                if (componentState.isPopularView) {
+                    listHeader = 'Populära sökningar';
+                    showHistoryHeader = false; // Hide Rensa link
+                }
+                else {
+                    // Rule: Historik should show "Din privata historik - Rensa".
+                    // We let CoreSelector's default HistoryHeader handle this
+                    showHistoryHeader = true;
+                    listHeader = undefined;
+                }
+            }
+            else {
+                // Reset when searching or when no suggestions
+                listHeader = undefined;
+                showHistoryHeader = false;
+            }
+        }
+        else {
+            // Not in a state that should show a list header
+            listHeader = undefined;
+            showHistoryHeader = false;
+        }
+        return {
+            status: coreStatus,
+            inputValue,
+            suggestions,
+            selectedItem,
+            selectedItems,
+            validation,
+            validationContext,
+            message,
+            listHeader,
+            showHistoryHeader,
+            isHistoryView
+        };
+    }
+    render() {
+        const selectorState = this._mapStateToSelectorState(this.state);
+        // Explicitly construct config to match SelectorConfig interface
+        const config = {
+            disabled: this.disabled,
+            placeholder: this.placeholder,
+            minLength: this.minLength,
+            maxResults: this.maxResults,
+            enableMultiple: this.enableMultiple,
+            showSearchIcon: this.showSearchIcon,
+            requireSelection: this.requireSelection,
+            size: this.size,
+            enableSelectionAnimation: this.enableSelectionAnimation,
+            populateInputOnSelect: this.populateInputOnSelect,
+            maxVisibleRows: this.maxVisibleRows,
+            manualInputBehavior: 'select',
+            showHistoryHeader: this.history && !selectorState.listHeader, // Only show default if not override
+            listHeader: selectorState.listHeader,
+            enableInfiniteScroll: true
+        };
+        // Pass external error message if present and we are not in loading/error state
+        // (This logic is now moved to _mapStateToSelectorState to respect validation state)
+        return (h("div", { key: '11b208182109be21dcf759010cb87f1bbd10b618', class: "job-selector-wrapper" }, this.state.status === 'error' ? (h("div", { class: "error-message" }, h(AfValidationMessage, { variant: "error", role: "alert" }, this.state.message || 'Ett fel uppstod.'))) : (h(Fragment, null, h("core-selector", { id: this.componentId, componentId: this.componentId, state: selectorState, config: config, label: this.label, labelDescription: this.labelDescription, size: this.size, afFocused: this.afFocused })))));
+    }
+    static get delegatesFocus() { return true; }
+    static get formAssociated() { return true; }
+    static get watchers() { return {
+        "required": [{
+                "watchRequired": 0
+            }],
+        "manualInput": [{
+                "watchManualInput": 0
+            }],
+        "history": [{
+                "watchHistory": 0
+            }],
+        "popular": [{
+                "watchPopular": 0
+            }],
+        "enableMultiple": [{
+                "watchEnableMultiple": 0
+            }],
+        "disabled": [{
+                "watchDisabled": 0
+            }],
+        "taxonomyData": [{
+                "watchTaxonomyData": 0
+            }]
+    }; }
+};
+JobSelector.style = jobSelectorCss();
+
+export { JobSelector as digi_service_job_selector };