@custardui/custardui 2.1.2-beta.0 → 2.2.0

package/dist/custardui.js

@@ -1,5 +1,5 @@
 /*!
- * @custardui/custardui v2.1.2-beta.0
+ * @custardui/custardui v2.2.0
  * (c) 2026 Chan Ger Teck
  * Released under the MIT License.
  */
@@ -28,58 +28,61 @@
         return cleanbaseUrl + cleanPath;
     }
 
+    const SCRIPT_ATTRIBUTE_DEFAULTS = {
+        baseURL: '/',
+        configPath: '/custardui.config.json',
+    };
+    const FALLBACK_CONFIG = {
+        config: {},
+        settings: { enabled: false },
+    };
     /**
      * Finds the script tag that loaded the library and extracts configuration attributes.
      * Looks for `data-base-url` and `data-config-path`.
      */
     function getScriptAttributes() {
-        let scriptTag = document.currentScript;
-        const defaults = { baseURL: '/', configPath: '/custardui.config.json' };
-        if (!scriptTag || !scriptTag.hasAttribute('data-base-url')) {
-            const dataAttrMatch = document.querySelector('script[data-base-url]');
-            if (dataAttrMatch) {
-                scriptTag = dataAttrMatch;
-            }
-            else {
-                // Fallback: try to find script by src pattern
-                for (const script of document.scripts) {
-                    const src = script.src || '';
-                    if (/(?:custard(?:ui)?|@custardui\/custard(?:ui)?)(?:\.min)?\.(?:esm\.)?js($|\?)/i.test(src)) {
-                        scriptTag = script;
-                        break;
-                    }
-                }
+        const scriptTag = findScriptTag();
+        if (!scriptTag)
+            return SCRIPT_ATTRIBUTE_DEFAULTS;
+        return {
+            baseURL: scriptTag.getAttribute('data-base-url') || SCRIPT_ATTRIBUTE_DEFAULTS.baseURL,
+            configPath: scriptTag.getAttribute('data-config-path') || SCRIPT_ATTRIBUTE_DEFAULTS.configPath,
+        };
+    }
+    function findScriptTag() {
+        const current = document.currentScript;
+        if (current?.hasAttribute('data-base-url'))
+            return current;
+        const byAttr = document.querySelector('script[data-base-url]');
+        if (byAttr)
+            return byAttr;
+        // Fallback: find script by src pattern
+        for (const script of document.scripts) {
+            if (/(?:custard(?:ui)?|@custardui\/custard(?:ui)?)(?:\.min)?\.(?:esm\.)?js($|\?)/i.test(script.src)) {
+                return script;
             }
         }
-        if (scriptTag) {
-            return {
-                baseURL: scriptTag.getAttribute('data-base-url') || defaults.baseURL,
-                configPath: scriptTag.getAttribute('data-config-path') || defaults.configPath,
-            };
-        }
-        return defaults;
+        return null;
     }
     /**
      * Fetches and parses the configuration file.
+     * Returns the fallback config silently if the file is not found (404),
+     * since operating without a config file is a valid use case.
      */
     async function fetchConfig(configPath, baseURL) {
-        const fallbackMinimalConfig = {
-            config: {},
-            settings: { enabled: true },
-        };
         try {
             const fullConfigPath = prependBaseUrl(configPath, baseURL);
             const response = await fetch(fullConfigPath);
-            if (!response.ok) {
-                console.warn(`[CustardUI] Config file not found at ${fullConfigPath}. Using defaults.`);
-                return fallbackMinimalConfig;
-            }
-            const config = await response.json();
-            return config;
+            if (!response.ok)
+                return FALLBACK_CONFIG;
+            const text = await response.text();
+            if (!text.trim())
+                return FALLBACK_CONFIG;
+            return JSON.parse(text);
         }
         catch (error) {
             console.error('[CustardUI] Error loading config file:', error);
-            return fallbackMinimalConfig;
+            return FALLBACK_CONFIG;
         }
     }
 
@@ -12210,33 +12213,45 @@
         return getStableTextContent(el).trim().replace(/\s+/g, ' ');
     }
 
+    /**
+     * Walks the ancestor chain of `el` to find the first element with a non-empty
+     * `id` attribute. Returns both the id string and the ancestor element so the
+     * caller can use the element itself as a query scope.
+     * Returns `ancestorEl: null` when no id-bearing ancestor exists.
+     */
+    function findNearestIdAncestor(el) {
+        let node = el.parentElement;
+        while (node) {
+            if (node.id)
+                return { parentId: node.id, ancestorEl: node };
+            node = node.parentElement;
+        }
+        return { parentId: undefined, ancestorEl: null };
+    }
     /**
      * Creates an AnchorDescriptor for a given DOM element.
      */
     function createDescriptor(el) {
         const tag = el.tagName;
         const normalizedText = getStableNormalizedText(el);
-        // Find nearest parent with an ID
-        let parentId;
-        let parent = el.parentElement;
-        while (parent) {
-            if (parent.id) {
-                parentId = parent.id;
-                break;
-            }
-            parent = parent.parentElement;
-        }
-        // Calculate index relative to the container
-        const container = parent || document.body;
+        const { parentId, ancestorEl: idAncestor } = findNearestIdAncestor(el);
+        const container = idAncestor ?? document.body;
         const siblings = Array.from(container.querySelectorAll(tag));
-        const index = siblings.indexOf(el);
+        const rawIndex = siblings.indexOf(el);
+        if (rawIndex === -1) {
+            console.error('[CustardUI] createDescriptor: element not found in container, ' +
+                'element may be detached from the DOM. Please open an issue.', el);
+        }
+        const index = rawIndex !== -1 ? rawIndex : 0;
         const descriptor = {
             tag,
-            index: index !== -1 ? index : 0,
+            index,
             textSnippet: normalizedText.substring(0, 32),
             textHash: hashCode(normalizedText),
-            elementId: el.id,
         };
+        if (el.id) {
+            descriptor.elementId = el.id;
+        }
         if (parentId) {
             descriptor.parentId = parentId;
         }
@@ -12438,7 +12453,7 @@
      * Returns an array of elements. For specific descriptors, usually contains 0 or 1 element.
      * For ID-only descriptors (tag='ANY'), may return multiple if duplicates exist.
      */
-    function resolve(root, descriptor) {
+    function resolve(descriptor) {
         // 0. Direct ID Shortcut
         if (descriptor.elementId) {
             // Always support duplicate IDs for consistency, even if technically invalid HTML.
@@ -12450,19 +12465,15 @@
                 return [];
         }
         // 1. Determine Scope
-        let scope = root;
-        // Optimization: If parentId exists, try to narrow scope immediately
+        // Default to document.body so index pool matches descriptor.ts,
+        // which also falls back to document.body when no id-bearing ancestor is found.
+        let scope = document.body;
+        // Optimization: If parentId exists, try to narrow scope immediately.
         if (descriptor.parentId) {
-            const foundParent = root.querySelector(`#${descriptor.parentId}`);
+            const foundParent = document.getElementById(descriptor.parentId);
             if (foundParent instanceof HTMLElement) {
                 scope = foundParent;
             }
-            else {
-                const globalParent = document.getElementById(descriptor.parentId);
-                if (globalParent) {
-                    scope = globalParent;
-                }
-            }
         }
         // 2. Candidate Search & Scoring
         const candidates = scope.querySelectorAll(descriptor.tag);
@@ -14567,7 +14578,8 @@
      * Initializes the UI manager (settings and share UI) using the provided config.
      */
     function initUIManager(runtime, config) {
-        const settingsEnabled = config.settings?.enabled === true;
+        const { enabled, ...widgetSettings } = config.settings ?? {};
+        const settingsEnabled = enabled === true;
         const callbacks = {
             resetToDefault: () => runtime.resetToDefault(),
             iconSettings: runtime.iconSettingsStore,
@@ -14576,7 +14588,7 @@
         const uiManager = new CustardUIManager({
             callbacks,
             settingsEnabled,
-            ...config.settings,
+            ...widgetSettings,
         });
         uiManager.render();
         return uiManager;
@@ -15728,7 +15740,6 @@
     }
 
     class HighlightService {
-    	rootEl;
     	overlayApp;
     	state = new HighlightState();
     	resizeObserver;
@@ -15737,9 +15748,7 @@
     	activeAnnotations = new Map();
     	onWindowResize = () => this.updatePositions();
 
-    	constructor(rootEl) {
-    		this.rootEl = rootEl;
-
+    	constructor() {
     		this.resizeObserver = new ResizeObserver(() => {
     			this.updatePositions();
     		});
@@ -15753,7 +15762,7 @@
     		const targets = [];
 
     		descriptors.forEach((desc) => {
-    			const matchingEls = resolve(this.rootEl, desc);
+    			const matchingEls = resolve(desc);
 
     			if (matchingEls && matchingEls.length > 0) targets.push(...matchingEls);
     		});
@@ -15771,7 +15780,7 @@
     		const annotations = new Map();
 
     		descriptors.forEach((desc) => {
-    			const matchingEls = resolve(this.rootEl, desc);
+    			const matchingEls = resolve(desc);
 
     			if (matchingEls && matchingEls.length > 0) {
     				targets.push(...matchingEls);
@@ -15937,7 +15946,6 @@
     const SHOW_ELEMENT_CLASS = 'cv-show-element';
 
     class FocusService {
-    	rootEl;
     	hiddenElements = new SvelteSet();
     	dividers = new SvelteSet(); // Store Svelte App instances
     	excludedTags;
@@ -15948,15 +15956,13 @@
 
     	highlightService;
 
-    	constructor(rootEl, options) {
-    		this.rootEl = rootEl;
-
+    	constructor(options) {
     		const userTags = options.shareExclusions?.tags || [];
     		const userIds = options.shareExclusions?.ids || [];
 
     		this.excludedTags = new SvelteSet([...DEFAULT_EXCLUDED_TAGS, ...userTags].map((t) => t.toUpperCase()));
     		this.excludedIds = new SvelteSet([...DEFAULT_EXCLUDED_IDS, ...userIds]);
-    		this.highlightService = new HighlightService(this.rootEl);
+    		this.highlightService = new HighlightService();
 
     		// Subscribe to store for exit signal
     		this.unsubscribe = effect_root(() => {
@@ -16048,7 +16054,7 @@
     		const targets = [];
 
     		descriptors.forEach((desc) => {
-    			const matchingEls = resolve(this.rootEl, desc);
+    			const matchingEls = resolve(desc);
 
     			if (matchingEls && matchingEls.length > 0) {
     				targets.push(...matchingEls);
@@ -16087,7 +16093,7 @@
     		const targets = [];
 
     		descriptors.forEach((desc) => {
-    			const matchingEls = resolve(this.rootEl, desc);
+    			const matchingEls = resolve(desc);
 
     			if (matchingEls && matchingEls.length > 0) {
     				targets.push(...matchingEls);
@@ -16779,7 +16785,7 @@
     		this.resolveInitialState(opt.adaptationConfig ?? null);
 
     		// Resolve Exclusions
-    		this.focusService = new FocusService(this.rootEl, {
+    		this.focusService = new FocusService({
     			shareExclusions: opt.configFile.config?.shareExclusions || {}
     		});
     	}