@kupola/kupola 1.4.9 → 1.5.1

package/js/depends.js

@@ -1,4 +1,5 @@
 import { ref } from './data-bind.js';
+import { getConfig } from './kupola-config.js';
 
 // ============================================================
 // Scheduler - 批量更新、去重、微任务调度
@@ -273,6 +274,11 @@ class FetchedSource extends DependsSource {
 
     async fetch(params) {
         let url = this.config.source;
+        const httpConfig = getConfig('http');
+        
+        if (httpConfig?.baseURL && !url.startsWith('http://') && !url.startsWith('https://')) {
+            url = httpConfig.baseURL + url.replace(/^\//, '');
+        }
 
         // Replace path params (:id -> value)
         for (const key in params) {

package/js/i18n.js

@@ -1,8 +1,11 @@
+import { getConfig } from './kupola-config.js';
+
 class KupolaI18n {
   constructor(options = {}) {
+    const config = getConfig();
     this.locales = options.locales || {};
-    this.currentLocale = options.defaultLocale || 'zh-CN';
-    this.fallbackLocale = options.fallbackLocale || 'zh-CN';
+    this.currentLocale = options.defaultLocale || config.i18n?.locale || 'zh-CN';
+    this.fallbackLocale = options.fallbackLocale || config.i18n?.fallbackLocale || 'en-US';
     this.delimiter = options.delimiter || '.';
     this.missingHandler = options.missingHandler || ((key) => {
       console.warn(`Missing translation: ${key}`);

package/js/kupola-config.js

@@ -0,0 +1,69 @@
+const config = {
+  paths: {
+    icons: '/icons/',
+    base: '/'
+  },
+  theme: {
+    default: 'dark',
+    brand: 'zengqing'
+  },
+  i18n: {
+    locale: 'zh-CN',
+    fallbackLocale: 'en-US'
+  },
+  http: {
+    baseURL: '',
+    timeout: 10000
+  },
+  components: {
+    autoInit: true,
+    silentErrors: false
+  },
+  store: {
+    persist: true,
+    prefix: 'kupola-'
+  },
+  events: {
+    global: true
+  }
+};
+
+export function setConfig(options) {
+  mergeDeep(config, options);
+}
+
+export function getConfig(key) {
+  if (!key) return config;
+  return getNestedValue(config, key);
+}
+
+export function getIconsPath() {
+  return config.paths.base + config.paths.icons.replace(/^\//, '');
+}
+
+export function getBasePath() {
+  return config.paths.base;
+}
+
+export function getDefaultTheme() {
+  return config.theme.default;
+}
+
+export function getDefaultBrand() {
+  return config.theme.brand;
+}
+
+function mergeDeep(target, source) {
+  for (const key in source) {
+    if (source[key] instanceof Object && key in target && target[key] instanceof Object) {
+      mergeDeep(target[key], source[key]);
+    } else {
+      target[key] = source[key];
+    }
+  }
+  return target;
+}
+
+function getNestedValue(obj, key) {
+  return key.split('.').reduce((o, k) => (o && o[k]) !== undefined ? o[k] : undefined, obj);
+}

package/js/kupola-core.js

@@ -9,6 +9,7 @@ import { KupolaLifecycle } from './kupola-lifecycle.js';
 import { kupolaInitializer } from './initializer.js';
 import { kupolaData } from './data-bind.js';
 import { initTheme } from './theme.js';
+import { getConfig } from './kupola-config.js';
 
 let kupolaRegistry = null;
 
@@ -19,16 +20,20 @@ if (typeof window !== 'undefined') {
 /** Bootstrap the Kupola component system (data binding, theme, component discovery). */
 async function kupolaBootstrap() {
   if (typeof window !== 'undefined') {
+    const config = getConfig();
     // Load persisted data and bind data-bind elements
     kupolaData.loadPersisted();
     kupolaData.bind();
     // Initialize theme
     initTheme();
-    // Initialize function-based components first
-    await kupolaInitializer.initializeAll();
-    // Then bootstrap class-based components
-    if (kupolaRegistry) {
-      await kupolaRegistry.bootstrap();
+    
+    if (config.components?.autoInit !== false) {
+      // Initialize function-based components first
+      await kupolaInitializer.initializeAll();
+      // Then bootstrap class-based components
+      if (kupolaRegistry) {
+        await kupolaRegistry.bootstrap();
+      }
     }
   }
 }

package/js/theme.js

@@ -1,3 +1,5 @@
+import { getIconsPath, getDefaultTheme, getDefaultBrand } from './kupola-config.js';
+
 const THEME_KEY = 'kupola-theme';
 const BRAND_KEY = 'kupola-brand';
 
@@ -16,7 +18,7 @@ const BRAND_OPTIONS = [
 ];
 
 function getTheme() {
-  return localStorage.getItem(THEME_KEY) || 'dark';
+  return localStorage.getItem(THEME_KEY) || getDefaultTheme();
 }
 
 function setTheme(theme) {
@@ -39,7 +41,7 @@ function setTheme(theme) {
 }
 
 function getBrand() {
-  return localStorage.getItem(BRAND_KEY) || 'zengqing';
+  return localStorage.getItem(BRAND_KEY) || getDefaultBrand();
 }
 
 function setBrand(brandId) {
@@ -76,7 +78,8 @@ function updateThemeIcon(toggleBtn) {
   const iconEl = toggleBtn.querySelector('.theme-icon');
   if (iconEl) {
     const currentTheme = getTheme();
-    iconEl.src = currentTheme === 'dark' ? '/icons/sun.svg' : '/icons/moon.svg';
+    const iconsPath = getIconsPath();
+    iconEl.src = currentTheme === 'dark' ? iconsPath + 'sun.svg' : iconsPath + 'moon.svg';
   }
 }
 
@@ -203,12 +206,10 @@ function createThemeToggle() {
   
   const icon = document.createElement('img');
   icon.className = 'theme-icon';
-  const scripts = document.getElementsByTagName('script');
-  const currentScript = scripts[scripts.length - 1];
-  const scriptPath = currentScript.src.substring(0, currentScript.src.lastIndexOf('/') + 1);
+  const iconsPath = getIconsPath();
   icon.src = getTheme() === 'dark' 
-    ? scriptPath + '../icons/sun.svg' 
-    : scriptPath + '../icons/moon.svg';
+    ? iconsPath + 'sun.svg' 
+    : iconsPath + 'moon.svg';
   icon.width = 14;
   icon.height = 14;
   icon.alt = 'Toggle theme';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kupola/kupola",
-  "version": "1.4.9",
+  "version": "1.5.1",
   "description": "A lightweight UI toolkit for any web project. No heavy frontend frameworks required.",
   "main": "dist/kupola.cjs.js",
   "module": "dist/kupola.esm.js",