@beppla/tapas-ui 1.0.66 → 1.0.68

package/module/Icons/smartFontLoader.js

@@ -1,32 +1,153 @@
-import React from 'react';
-import { Platform } from 'react-native';
+"use strict";
 
+var __awaiter = this && this.__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 = this && this.__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 = this && this.__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");
 /**
  * 智能字体加载器
  * 自动检测环境并选择合适的字体加载策略
  */
-class SmartFontLoader {
-  fontsLoaded = false;
-  loading = false;
-  listeners = [];
-  fontPaths = [];
-  constructor() {
+var SmartFontLoader = /** @class */function () {
+  function SmartFontLoader() {
+    this.fontsLoaded = false;
+    this.loading = false;
+    this.listeners = [];
+    this.fontPaths = [];
     this.initFontPaths();
     this.init();
   }
-  static getInstance() {
+  SmartFontLoader.getInstance = function () {
     if (!SmartFontLoader.instance) {
       SmartFontLoader.instance = new SmartFontLoader();
     }
     return SmartFontLoader.instance;
-  }
-
+  };
   /**
    * 初始化字体路径列表
    * 根据不同的构建环境提供多个可能的路径
    */
-  initFontPaths() {
-    if (Platform.OS === 'web') {
+  SmartFontLoader.prototype.initFontPaths = function () {
+    if (react_native_1.Platform.OS === 'web') {
       // Web 环境的可能路径
       this.fontPaths = [
       // Storybook 环境
@@ -44,191 +165,256 @@ class SmartFontLoader {
       // 字体应该由使用组件库的应用来加载
       this.fontPaths = [];
     }
-  }
-
+  };
   /**
    * 初始化字体加载器
    */
-  async init() {
-    if (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();
-    }
-  }
-
+  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*/];
+        }
+      });
+    });
+  };
   /**
    * 在 Web 环境中加载字体
    */
-  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();
+  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();
             doc.fonts.add(font);
             fontLoaded = true;
-            console.log(`字体加载成功: ${path}`);
-            break;
-          } catch (error) {
-            console.warn(`字体路径加载失败: ${path}`, error);
-            continue;
-          }
+            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:
+            // 如果所有路径都失败，尝试动态检测
+            _b.sent();
+            _b.label = 11;
+          case 11:
+            // 等待字体完全加载
+            return [4 /*yield*/, this.waitForFontLoad(doc)];
+          case 12:
+            // 等待字体完全加载
+            _b.sent();
+            this.fontsLoaded = true;
+            this.loading = false;
+            this.notifyListeners();
+            return [3 /*break*/, 14];
+          case 13:
+            error_3 = _b.sent();
+            this.loading = false;
+            throw error_3;
+          case 14:
+            return [2 /*return*/];
         }
-      } 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;
-              }
-            }
-          }
+  SmartFontLoader.prototype.detectAndLoadFont = function (doc) {
+    return __awaiter(this, void 0, void 0, function () {
+      var stylesheets, i, rules, j, rule, src, urlMatch, fontUrl, FontFace_1, font, error_4;
+      return __generator(this, function (_a) {
+        switch (_a.label) {
+          case 0:
+            stylesheets = doc.styleSheets;
+            i = 0;
+            _a.label = 1;
+          case 1:
+            if (!(i < stylesheets.length)) return [3 /*break*/, 9];
+            _a.label = 2;
+          case 2:
+            _a.trys.push([2, 7,, 8]);
+            rules = stylesheets[i].cssRules || stylesheets[i].rules;
+            j = 0;
+            _a.label = 3;
+          case 3:
+            if (!(j < rules.length)) return [3 /*break*/, 6];
+            rule = rules[j];
+            if (!(rule.type === CSSRule.FONT_FACE_RULE)) return [3 /*break*/, 5];
+            src = rule.style.getPropertyValue('src');
+            if (!(src && src.includes('customfont'))) return [3 /*break*/, 5];
+            urlMatch = src.match(/url\(['"]?([^'"]+)['"]?\)/);
+            if (!urlMatch) return [3 /*break*/, 5];
+            fontUrl = urlMatch[1];
+            FontFace_1 = globalThis.FontFace;
+            font = new FontFace_1('icomoon', "url(".concat(fontUrl, ")"));
+            return [4 /*yield*/, font.load()];
+          case 4:
+            _a.sent();
+            doc.fonts.add(font);
+            console.log("\u52A8\u6001\u68C0\u6D4B\u5B57\u4F53\u52A0\u8F7D\u6210\u529F: ".concat(fontUrl));
+            return [2 /*return*/];
+          case 5:
+            j++;
+            return [3 /*break*/, 3];
+          case 6:
+            return [3 /*break*/, 8];
+          case 7:
+            error_4 = _a.sent();
+            // 跨域或其他错误，继续尝试下一个
+            return [3 /*break*/, 8];
+          case 8:
+            i++;
+            return [3 /*break*/, 1];
+          case 9:
+            throw new Error('无法找到可用的字体文件');
         }
-      } 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));
-    }
-  }
-
+  SmartFontLoader.prototype.waitForFontLoad = function (doc) {
+    return __awaiter(this, void 0, void 0, function () {
+      return __generator(this, function (_a) {
+        switch (_a.label) {
+          case 0:
+            if (!(doc.fonts && doc.fonts.ready)) return [3 /*break*/, 2];
+            return [4 /*yield*/, doc.fonts.ready];
+          case 1:
+            _a.sent();
+            return [3 /*break*/, 4];
+          case 2:
+            // 降级处理，等待一段时间
+            return [4 /*yield*/, new Promise(function (resolve) {
+              return setTimeout(resolve, 1000);
+            })];
+          case 3:
+            // 降级处理，等待一段时间
+            _a.sent();
+            _a.label = 4;
+          case 4:
+            return [2 /*return*/];
+        }
+      });
+    });
+  };
   /**
    * 添加字体加载完成监听器
    */
-  addListener(listener) {
+  SmartFontLoader.prototype.addListener = function (listener) {
+    var _this = this;
     this.listeners.push(listener);
-
     // 如果字体已经加载，立即调用监听器
     if (this.fontsLoaded) {
       listener();
     }
-
     // 返回取消监听的函数
-    return () => {
-      const index = this.listeners.indexOf(listener);
+    return function () {
+      var index = _this.listeners.indexOf(listener);
       if (index > -1) {
-        this.listeners.splice(index, 1);
+        _this.listeners.splice(index, 1);
       }
     };
-  }
-
+  };
   /**
    * 使用 CSS @font-face 加载字体
    */
-  loadFontWithCSS(doc) {
+  SmartFontLoader.prototype.loadFontWithCSS = function (doc) {
+    var _this = this;
     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;
-        }
-      `;
+      var style = doc.createElement('style');
+      style.textContent = "\n        @font-face {\n          font-family: 'icomoon';\n          src: url('/assets/fonts/customfont.ttf') format('truetype');\n          font-weight: normal;\n          font-style: normal;\n          font-display: swap;\n        }\n      ";
       doc.head.appendChild(style);
-
       // 监听字体加载完成
       if (doc.fonts && doc.fonts.ready) {
-        doc.fonts.ready.then(() => {
-          this.fontsLoaded = true;
-          this.notifyListeners();
+        doc.fonts.ready.then(function () {
+          _this.fontsLoaded = true;
+          _this.notifyListeners();
           console.log('字体加载成功 (CSS方式)');
-        }).catch(error => {
+        }).catch(function (error) {
           console.warn('CSS字体加载失败，将使用备用图标:', error);
-          this.fontsLoaded = true;
-          this.notifyListeners();
+          _this.fontsLoaded = true;
+          _this.notifyListeners();
         });
       } else {
         // 降级处理
-        setTimeout(() => {
-          this.fontsLoaded = true;
-          this.notifyListeners();
+        setTimeout(function () {
+          _this.fontsLoaded = true;
+          _this.notifyListeners();
         }, 1000);
       }
     } catch (error) {
@@ -236,71 +422,80 @@ class SmartFontLoader {
       this.fontsLoaded = true;
       this.notifyListeners();
     }
-  }
-
+  };
   /**
    * 通知所有监听器
    */
-  notifyListeners() {
-    this.listeners.forEach(listener => {
+  SmartFontLoader.prototype.notifyListeners = function () {
+    this.listeners.forEach(function (listener) {
       try {
         listener();
       } catch (error) {
         console.warn('字体加载监听器执行失败:', error);
       }
     });
-  }
-
+  };
   /**
    * 检查字体是否已加载
    */
-  isFontLoaded() {
+  SmartFontLoader.prototype.isFontLoaded = function () {
     return this.fontsLoaded;
-  }
-
+  };
   /**
    * 检查是否正在加载
    */
-  isLoading() {
+  SmartFontLoader.prototype.isLoading = function () {
     return this.loading;
-  }
-
+  };
   /**
    * 重新加载字体
    */
-  async reload() {
-    this.fontsLoaded = false;
-    this.loading = false;
-    await this.init();
-  }
-
+  SmartFontLoader.prototype.reload = function () {
+    return __awaiter(this, void 0, void 0, function () {
+      return __generator(this, function (_a) {
+        switch (_a.label) {
+          case 0:
+            this.fontsLoaded = false;
+            this.loading = false;
+            return [4 /*yield*/, this.init()];
+          case 1:
+            _a.sent();
+            return [2 /*return*/];
+        }
+      });
+    });
+  };
   /**
    * 添加自定义字体路径
    */
-  addFontPath(path) {
+  SmartFontLoader.prototype.addFontPath = function (path) {
     if (!this.fontPaths.includes(path)) {
       this.fontPaths.unshift(path); // 添加到最前面，优先尝试
     }
-  }
-}
-export const smartFontLoader = SmartFontLoader.getInstance();
-
+  };
+  return SmartFontLoader;
+}();
+exports.smartFontLoader = SmartFontLoader.getInstance();
 /**
  * 智能字体加载 Hook
  */
-export function useSmartFontLoader() {
-  const [fontsLoaded, setFontsLoaded] = React.useState(smartFontLoader.isFontLoaded());
-  const [loading, setLoading] = React.useState(smartFontLoader.isLoading());
-  React.useEffect(() => {
-    const unsubscribe = smartFontLoader.addListener(() => {
+function useSmartFontLoader() {
+  var _a = react_1.default.useState(exports.smartFontLoader.isFontLoaded()),
+    fontsLoaded = _a[0],
+    setFontsLoaded = _a[1];
+  var _b = react_1.default.useState(exports.smartFontLoader.isLoading()),
+    loading = _b[0],
+    setLoading = _b[1];
+  react_1.default.useEffect(function () {
+    var unsubscribe = exports.smartFontLoader.addListener(function () {
       setFontsLoaded(true);
       setLoading(false);
     });
     return unsubscribe;
   }, []);
   return {
-    fontsLoaded,
-    loading
+    fontsLoaded: fontsLoaded,
+    loading: loading
   };
 }
 //# sourceMappingURL=smartFontLoader.js.map