@beppla/tapas-ui 1.0.68 → 1.0.70

package/commonjs/Icons/smartFontLoader.js

@@ -1,153 +1,39 @@
 "use strict";
 
-var __awaiter = void 0 && (void 0).__awaiter || function (thisArg, _arguments, P, generator) {
-  function adopt(value) {
-    return value instanceof P ? value : new P(function (resolve) {
-      resolve(value);
-    });
-  }
-  return new (P || (P = Promise))(function (resolve, reject) {
-    function fulfilled(value) {
-      try {
-        step(generator.next(value));
-      } catch (e) {
-        reject(e);
-      }
-    }
-    function rejected(value) {
-      try {
-        step(generator["throw"](value));
-      } catch (e) {
-        reject(e);
-      }
-    }
-    function step(result) {
-      result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected);
-    }
-    step((generator = generator.apply(thisArg, _arguments || [])).next());
-  });
-};
-var __generator = void 0 && (void 0).__generator || function (thisArg, body) {
-  var _ = {
-      label: 0,
-      sent: function () {
-        if (t[0] & 1) throw t[1];
-        return t[1];
-      },
-      trys: [],
-      ops: []
-    },
-    f,
-    y,
-    t,
-    g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
-  return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function () {
-    return this;
-  }), g;
-  function verb(n) {
-    return function (v) {
-      return step([n, v]);
-    };
-  }
-  function step(op) {
-    if (f) throw new TypeError("Generator is already executing.");
-    while (g && (g = 0, op[0] && (_ = 0)), _) try {
-      if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
-      if (y = 0, t) op = [op[0] & 2, t.value];
-      switch (op[0]) {
-        case 0:
-        case 1:
-          t = op;
-          break;
-        case 4:
-          _.label++;
-          return {
-            value: op[1],
-            done: false
-          };
-        case 5:
-          _.label++;
-          y = op[1];
-          op = [0];
-          continue;
-        case 7:
-          op = _.ops.pop();
-          _.trys.pop();
-          continue;
-        default:
-          if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) {
-            _ = 0;
-            continue;
-          }
-          if (op[0] === 3 && (!t || op[1] > t[0] && op[1] < t[3])) {
-            _.label = op[1];
-            break;
-          }
-          if (op[0] === 6 && _.label < t[1]) {
-            _.label = t[1];
-            t = op;
-            break;
-          }
-          if (t && _.label < t[2]) {
-            _.label = t[2];
-            _.ops.push(op);
-            break;
-          }
-          if (t[2]) _.ops.pop();
-          _.trys.pop();
-          continue;
-      }
-      op = body.call(thisArg, _);
-    } catch (e) {
-      op = [6, e];
-      y = 0;
-    } finally {
-      f = t = 0;
-    }
-    if (op[0] & 5) throw op[1];
-    return {
-      value: op[0] ? op[1] : void 0,
-      done: true
-    };
-  }
-};
-var __importDefault = void 0 && (void 0).__importDefault || function (mod) {
-  return mod && mod.__esModule ? mod : {
-    "default": mod
-  };
-};
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.smartFontLoader = void 0;
 exports.useSmartFontLoader = useSmartFontLoader;
-var react_1 = __importDefault(require("react"));
-var react_native_1 = require("react-native");
+var _react = _interopRequireDefault(require("react"));
+var _reactNative = require("react-native");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 /**
  * 智能字体加载器
  * 自动检测环境并选择合适的字体加载策略
  */
-var SmartFontLoader = /** @class */function () {
-  function SmartFontLoader() {
-    this.fontsLoaded = false;
-    this.loading = false;
-    this.listeners = [];
-    this.fontPaths = [];
+class SmartFontLoader {
+  fontsLoaded = false;
+  loading = false;
+  listeners = [];
+  fontPaths = [];
+  constructor() {
     this.initFontPaths();
     this.init();
   }
-  SmartFontLoader.getInstance = function () {
+  static getInstance() {
     if (!SmartFontLoader.instance) {
       SmartFontLoader.instance = new SmartFontLoader();
     }
     return SmartFontLoader.instance;
-  };
+  }
+
   /**
    * 初始化字体路径列表
    * 根据不同的构建环境提供多个可能的路径
    */
-  SmartFontLoader.prototype.initFontPaths = function () {
-    if (react_native_1.Platform.OS === 'web') {
+  initFontPaths() {
+    if (_reactNative.Platform.OS === 'web') {
       // Web 环境的可能路径
       this.fontPaths = [
       // Storybook 环境
@@ -165,108 +51,266 @@ var SmartFontLoader = /** @class */function () {
       // 字体应该由使用组件库的应用来加载
       this.fontPaths = [];
     }
-  };
+  }
+
   /**
    * 初始化字体加载器
    */
-  SmartFontLoader.prototype.init = function () {
-    return __awaiter(this, void 0, void 0, function () {
-      var error_1;
-      return __generator(this, function (_a) {
-        switch (_a.label) {
-          case 0:
-            if (react_native_1.Platform.OS !== 'web') {
-              // React Native 环境，组件库不直接加载字体
-              // 字体应该由使用组件库的应用来加载
-              console.log('TapasIcon: 字体加载应由应用端处理，请确保在应用中加载 icomoon 字体');
-              this.fontsLoaded = true;
-              this.notifyListeners();
-              return [2 /*return*/];
-            }
-            _a.label = 1;
-          case 1:
-            _a.trys.push([1, 3,, 4]);
-            return [4 /*yield*/, this.loadWebFont()];
-          case 2:
-            _a.sent();
-            return [3 /*break*/, 4];
-          case 3:
-            error_1 = _a.sent();
-            console.warn('字体加载失败，将使用备用图标:', error_1);
-            // 即使失败也标记为已加载，使用备用图标
-            this.fontsLoaded = true;
-            this.notifyListeners();
-            return [3 /*break*/, 4];
-          case 4:
-            return [2 /*return*/];
-        }
-      });
-    });
-  };
+  async init() {
+    if (_reactNative.Platform.OS !== 'web') {
+      // React Native 环境，组件库不直接加载字体
+      // 字体应该由使用组件库的应用来加载
+      console.log('TapasIcon: 字体加载应由应用端处理，请确保在应用中加载 icomoon 字体');
+      this.fontsLoaded = true;
+      this.notifyListeners();
+      return;
+    }
+    try {
+      await this.loadWebFont();
+    } catch (error) {
+      console.warn('字体加载失败，将使用备用图标:', error);
+      // 即使失败也标记为已加载，使用备用图标
+      this.fontsLoaded = true;
+      this.notifyListeners();
+    }
+  }
+
   /**
    * 在 Web 环境中加载字体
    */
-  SmartFontLoader.prototype.loadWebFont = function () {
-    return __awaiter(this, void 0, void 0, function () {
-      var doc, fontLoaded, _i, _a, path, font, error_2, error_3;
-      return __generator(this, function (_b) {
-        switch (_b.label) {
-          case 0:
-            // 检查 Web 环境是否可用
-            if (typeof window === 'undefined' || typeof document === 'undefined') {
-              console.warn('Web环境不可用，跳过字体加载');
-              this.fontsLoaded = true;
-              this.notifyListeners();
-              return [2 /*return*/];
-            }
-            doc = document;
-            // 检查字体是否已经加载
-            if (doc.fonts && doc.fonts.check('1em icomoon')) {
-              this.fontsLoaded = true;
-              this.notifyListeners();
-              return [2 /*return*/];
-            }
-            this.loading = true;
-            _b.label = 1;
-          case 1:
-            _b.trys.push([1, 13,, 14]);
-            fontLoaded = false;
-            if (!(typeof FontFace !== 'undefined')) return [3 /*break*/, 8];
-            _i = 0, _a = this.fontPaths;
-            _b.label = 2;
-          case 2:
-            if (!(_i < _a.length)) return [3 /*break*/, 7];
-            path = _a[_i];
-            _b.label = 3;
-          case 3:
-            _b.trys.push([3, 5,, 6]);
-            font = new FontFace('icomoon', "url(".concat(path, ")"));
-            return [4 /*yield*/, font.load()];
-          case 4:
-            _b.sent();
+  async loadWebFont() {
+    // 检查 Web 环境是否可用
+    if (typeof window === 'undefined' || typeof document === 'undefined') {
+      console.warn('Web环境不可用，跳过字体加载');
+      this.fontsLoaded = true;
+      this.notifyListeners();
+      return;
+    }
+    const doc = document;
+
+    // 检查字体是否已经加载
+    if (doc.fonts && doc.fonts.check('1em icomoon')) {
+      this.fontsLoaded = true;
+      this.notifyListeners();
+      return;
+    }
+    this.loading = true;
+    try {
+      let fontLoaded = false;
+
+      // 检查FontFace API是否可用
+      if (typeof FontFace !== 'undefined') {
+        // 尝试所有可能的字体路径
+        for (const path of this.fontPaths) {
+          try {
+            const font = new FontFace('icomoon', `url(${path})`);
+            await font.load();
             doc.fonts.add(font);
             fontLoaded = true;
-            console.log("\u5B57\u4F53\u52A0\u8F7D\u6210\u529F: ".concat(path));
-            return [3 /*break*/, 7];
-          case 5:
-            error_2 = _b.sent();
-            console.warn("\u5B57\u4F53\u8DEF\u5F84\u52A0\u8F7D\u5931\u8D25: ".concat(path), error_2);
-            return [3 /*break*/, 6];
-          case 6:
-            _i++;
-            return [3 /*break*/, 2];
-          case 7:
-            return [3 /*break*/, 9];
-          case 8:
-            console.warn('FontFace API不可用，使用CSS方式加载字体');
-            this.loadFontWithCSS(doc);
-            return [2 /*return*/];
-          case 9:
-            if (!!fontLoaded) return [3 /*break*/, 11];
-            // 如果所有路径都失败，尝试动态检测
-            return [4 /*yield*/, this.detectAndLoadFont(doc)];
-          case 10:
-            // 如果所有路径都失败，尝试动态检测
+            console.log(`字体加载成功: ${path}`);
+            break;
+          } catch (error) {
+            console.warn(`字体路径加载失败: ${path}`, error);
+            continue;
+          }
+        }
+      } else {
+        console.warn('FontFace API不可用，使用CSS方式加载字体');
+        this.loadFontWithCSS(doc);
+        return;
+      }
+      if (!fontLoaded) {
+        // 如果所有路径都失败，尝试动态检测
+        await this.detectAndLoadFont(doc);
+      }
+
+      // 等待字体完全加载
+      await this.waitForFontLoad(doc);
+      this.fontsLoaded = true;
+      this.loading = false;
+      this.notifyListeners();
+    } catch (error) {
+      this.loading = false;
+      throw error;
+    }
+  }
+
+  /**
+   * 动态检测并加载字体
+   */
+  async detectAndLoadFont(doc) {
+    // 尝试从已加载的样式中检测字体路径
+    const stylesheets = doc.styleSheets;
+    for (let i = 0; i < stylesheets.length; i++) {
+      try {
+        const rules = stylesheets[i].cssRules || stylesheets[i].rules;
+        for (let j = 0; j < rules.length; j++) {
+          const rule = rules[j];
+          if (rule.type === CSSRule.FONT_FACE_RULE) {
+            const src = rule.style.getPropertyValue('src');
+            if (src && src.includes('customfont')) {
+              // 提取字体URL
+              const urlMatch = src.match(/url\(['"]?([^'"]+)['"]?\)/);
+              if (urlMatch) {
+                const fontUrl = urlMatch[1];
+                const FontFace = globalThis.FontFace;
+                const font = new FontFace('icomoon', `url(${fontUrl})`);
+                await font.load();
+                doc.fonts.add(font);
+                console.log(`动态检测字体加载成功: ${fontUrl}`);
+                return;
+              }
+            }
+          }
+        }
+      } catch (error) {
+        // 跨域或其他错误，继续尝试下一个
+        continue;
+      }
+    }
+    throw new Error('无法找到可用的字体文件');
+  }
+
+  /**
+   * 等待字体完全加载
+   */
+  async waitForFontLoad(doc) {
+    if (doc.fonts && doc.fonts.ready) {
+      await doc.fonts.ready;
+    } else {
+      // 降级处理，等待一段时间
+      await new Promise(resolve => setTimeout(resolve, 1000));
+    }
+  }
+
+  /**
+   * 添加字体加载完成监听器
+   */
+  addListener(listener) {
+    this.listeners.push(listener);
+
+    // 如果字体已经加载，立即调用监听器
+    if (this.fontsLoaded) {
+      listener();
+    }
+
+    // 返回取消监听的函数
+    return () => {
+      const index = this.listeners.indexOf(listener);
+      if (index > -1) {
+        this.listeners.splice(index, 1);
+      }
+    };
+  }
+
+  /**
+   * 使用 CSS @font-face 加载字体
+   */
+  loadFontWithCSS(doc) {
+    try {
+      const style = doc.createElement('style');
+      style.textContent = `
+        @font-face {
+          font-family: 'icomoon';
+          src: url('/assets/fonts/customfont.ttf') format('truetype');
+          font-weight: normal;
+          font-style: normal;
+          font-display: swap;
+        }
+      `;
+      doc.head.appendChild(style);
+
+      // 监听字体加载完成
+      if (doc.fonts && doc.fonts.ready) {
+        doc.fonts.ready.then(() => {
+          this.fontsLoaded = true;
+          this.notifyListeners();
+          console.log('字体加载成功 (CSS方式)');
+        }).catch(error => {
+          console.warn('CSS字体加载失败，将使用备用图标:', error);
+          this.fontsLoaded = true;
+          this.notifyListeners();
+        });
+      } else {
+        // 降级处理
+        setTimeout(() => {
+          this.fontsLoaded = true;
+          this.notifyListeners();
+        }, 1000);
+      }
+    } catch (error) {
+      console.warn('CSS字体加载过程中出错，将使用备用图标:', error);
+      this.fontsLoaded = true;
+      this.notifyListeners();
+    }
+  }
+
+  /**
+   * 通知所有监听器
+   */
+  notifyListeners() {
+    this.listeners.forEach(listener => {
+      try {
+        listener();
+      } catch (error) {
+        console.warn('字体加载监听器执行失败:', error);
+      }
+    });
+  }
+
+  /**
+   * 检查字体是否已加载
+   */
+  isFontLoaded() {
+    return this.fontsLoaded;
+  }
+
+  /**
+   * 检查是否正在加载
+   */
+  isLoading() {
+    return this.loading;
+  }
+
+  /**
+   * 重新加载字体
+   */
+  async reload() {
+    this.fontsLoaded = false;
+    this.loading = false;
+    await this.init();
+  }
+
+  /**
+   * 添加自定义字体路径
+   */
+  addFontPath(path) {
+    if (!this.fontPaths.includes(path)) {
+      this.fontPaths.unshift(path); // 添加到最前面，优先尝试
+    }
+  }
+}
+const smartFontLoader = exports.smartFontLoader = SmartFontLoader.getInstance();
+
+/**
+ * 智能字体加载 Hook
+ */
+function useSmartFontLoader() {
+  const [fontsLoaded, setFontsLoaded] = _react.default.useState(smartFontLoader.isFontLoaded());
+  const [loading, setLoading] = _react.default.useState(smartFontLoader.isLoading());
+  _react.default.useEffect(() => {
+    const unsubscribe = smartFontLoader.addListener(() => {
+      setFontsLoaded(true);
+      setLoading(false);
+    });
+    return unsubscribe;
+  }, []);
+  return {
+    fontsLoaded,
+    loading
+  };
+}
+//# sourceMappingURL=smartFontLoader.js.map     // 如果所有路径都失败，尝试动态检测
             _b.sent();
             _b.label = 11;
           case 11: