@yqg/aminofx-css-kit 1.0.0

package/dist/esm/index.d.ts

@@ -0,0 +1,25 @@
+import type { IPlayerOptions } from './type';
+declare global {
+    interface Window {
+        createCssAnimationPlayer: typeof createCssAnimationPlayer;
+    }
+}
+declare class AnimationPlayer {
+    private container;
+    private options;
+    private isReady;
+    private readyPromise;
+    private loopTimerId;
+    constructor(container: HTMLElement, options: IPlayerOptions);
+    private init;
+    private replacePlaceholders;
+    private handleLoop;
+    ready(): Promise<void>;
+    play(): Promise<void>;
+    destroy(): void;
+    updateSchema(options: IPlayerOptions): void;
+}
+declare function createCssAnimationPlayer(containerId: string, options: IPlayerOptions): AnimationPlayer;
+export default createCssAnimationPlayer;
+export { AnimationPlayer };
+export * from './type';

package/dist/esm/index.js

@@ -0,0 +1,370 @@
+import _regeneratorRuntime from "@babel/runtime/helpers/esm/regeneratorRuntime";
+import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
+import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
+import _createClass from "@babel/runtime/helpers/esm/createClass";
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+// 扩展全局 Window 接口
+// 资源加载器
+var ResourceLoader = /*#__PURE__*/function () {
+  function ResourceLoader() {
+    _classCallCheck(this, ResourceLoader);
+  }
+  _createClass(ResourceLoader, null, [{
+    key: "loadImages",
+    value: function () {
+      var _loadImages = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(urls) {
+        var _this = this;
+        var loadPromises;
+        return _regeneratorRuntime().wrap(function _callee$(_context) {
+          while (1) switch (_context.prev = _context.next) {
+            case 0:
+              if (!(!Array.isArray(urls) || urls.length === 0)) {
+                _context.next = 2;
+                break;
+              }
+              return _context.abrupt("return", Promise.resolve());
+            case 2:
+              loadPromises = urls.map(function (url, index) {
+                if (!url.startsWith('http')) {
+                  return Promise.resolve();
+                }
+                if (_this.imageCache.has(url)) {
+                  console.log("aminofx:  \u2705 \u56FE\u7247 ".concat(index + 1, " \u5DF2\u7F13\u5B58: ").concat(url));
+                  return Promise.resolve();
+                }
+                if (_this.loadingQueue.has(url)) {
+                  return _this.loadingQueue.get(url);
+                }
+                var loadPromise = new Promise(function (resolve) {
+                  var img = new Image();
+                  img.onload = function () {
+                    _this.imageCache.set(url, true);
+                    _this.loadingQueue.delete(url);
+                    console.log("aminofx:  \u2705 \u56FE\u7247 ".concat(index + 1, " \u52A0\u8F7D\u6210\u529F: ").concat(url));
+
+                    // 确保图片资源在加载后能够被浏览器解码（decode），以提升渲染性能和避免闪烁。
+                    // 如果浏览器支持 Image.decode 方法，则异步等待 decode 完成后再进行后续处理；
+                    // decode 失败时也会继续后续流程，并做降级提示。
+                    // 对于不支持 decode 的环境，则直接进入兼容处理流程，保证流程不中断。
+                    if (typeof img.decode === 'function') {
+                      img.decode().then(function () {
+                        console.log("aminofx:  \uD83C\uDFA8 \u56FE\u7247 ".concat(index + 1, " \u89E3\u7801\u5B8C\u6210: ").concat(url));
+                        resolve();
+                      }).catch(function () {
+                        console.log("aminofx:  \u26A0\uFE0F \u56FE\u7247 ".concat(index + 1, " decode\u5931\u8D25\uFF0C\u4F7F\u7528fallback: ").concat(url));
+                        resolve();
+                      });
+                    } else {
+                      console.log("aminofx:  \uD83D\uDCF1 \u56FE\u7247 ".concat(index + 1, " \u4F7F\u7528\u517C\u5BB9\u6A21\u5F0F: ").concat(url));
+                      resolve();
+                    }
+                  };
+                  img.src = url;
+                  img.onerror = function () {
+                    _this.loadingQueue.delete(url);
+                    console.error("aminofx:  \u274C \u56FE\u7247 ".concat(index + 1, " \u52A0\u8F7D\u5931\u8D25: ").concat(url));
+                    // 失败时也要继续后续流程，保证流程不中断。后续图片会再加载一次
+                    resolve();
+                  };
+                });
+                _this.loadingQueue.set(url, loadPromise);
+                return loadPromise;
+              });
+              _context.prev = 3;
+              _context.next = 6;
+              return Promise.all(loadPromises);
+            case 6:
+              console.log('aminofx:  🎉 所有图片资源加载完成');
+              _context.next = 12;
+              break;
+            case 9:
+              _context.prev = 9;
+              _context.t0 = _context["catch"](3);
+              console.error('aminofx:  ❌ 图片加载过程中出现错误:', _context.t0);
+            case 12:
+            case "end":
+              return _context.stop();
+          }
+        }, _callee, null, [[3, 9]]);
+      }));
+      function loadImages(_x) {
+        return _loadImages.apply(this, arguments);
+      }
+      return loadImages;
+    }()
+  }]);
+  return ResourceLoader;
+}();
+_defineProperty(ResourceLoader, "imageCache", new Map());
+_defineProperty(ResourceLoader, "loadingQueue", new Map());
+var AnimationPlayer = /*#__PURE__*/function () {
+  // 保存定时器ID，用于清理
+
+  function AnimationPlayer(container, options) {
+    _classCallCheck(this, AnimationPlayer);
+    _defineProperty(this, "container", void 0);
+    _defineProperty(this, "options", void 0);
+    _defineProperty(this, "isReady", false);
+    _defineProperty(this, "readyPromise", null);
+    _defineProperty(this, "loopTimerId", null);
+    this.container = container;
+    this.options = options;
+    this.init();
+  }
+  _createClass(AnimationPlayer, [{
+    key: "init",
+    value: function () {
+      var _init = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2() {
+        var _this$options;
+        var _this$options2, _this$options$jsonSch, response, data;
+        return _regeneratorRuntime().wrap(function _callee2$(_context2) {
+          while (1) switch (_context2.prev = _context2.next) {
+            case 0:
+              if (!this.options.jsonSchema) {
+                _context2.next = 4;
+                break;
+              }
+              this.container.innerHTML = this.replacePlaceholders(this.options.jsonSchema.content);
+              _context2.next = 16;
+              break;
+            case 4:
+              if (!((_this$options = this.options) !== null && _this$options !== void 0 && _this$options.jsonUrl)) {
+                _context2.next = 15;
+                break;
+              }
+              _context2.next = 7;
+              return fetch((_this$options2 = this.options) === null || _this$options2 === void 0 ? void 0 : _this$options2.jsonUrl);
+            case 7:
+              response = _context2.sent;
+              _context2.next = 10;
+              return response.json();
+            case 10:
+              data = _context2.sent;
+              this.options.jsonSchema = data;
+              this.container.innerHTML = this.replacePlaceholders(((_this$options$jsonSch = this.options.jsonSchema) === null || _this$options$jsonSch === void 0 ? void 0 : _this$options$jsonSch.content) || '');
+              _context2.next = 16;
+              break;
+            case 15:
+              throw new Error('没有提供jsonSchema或jsonUrl');
+            case 16:
+              _context2.next = 18;
+              return this.ready();
+            case 18:
+            case "end":
+              return _context2.stop();
+          }
+        }, _callee2, this);
+      }));
+      function init() {
+        return _init.apply(this, arguments);
+      }
+      return init;
+    }()
+    /**
+     * 高性能占位符替换方法
+     * 支持格式：{{key}} 或 ${key}
+     * @param content - 需要替换的内容
+     * @returns 替换后的内容
+     */
+  }, {
+    key: "replacePlaceholders",
+    value: function replacePlaceholders(content) {
+      var _this2 = this;
+      if (!this.options.dynamicData || !content) {
+        return content;
+      }
+
+      // 使用正则表达式一次性匹配所有占位符 {{key}} 或 ${key}
+      // 采用惰性匹配，避免贪婪匹配导致的性能问题
+      return content.replace(/\{\{(\w+)\}\}|\$\{(\w+)\}/g, function (match, key1, key2) {
+        var _this2$options$dynami;
+        var key = key1 || key2;
+        return ((_this2$options$dynami = _this2.options.dynamicData) === null || _this2$options$dynami === void 0 ? void 0 : _this2$options$dynami[key]) !== undefined ? String(_this2.options.dynamicData[key]) : match;
+      });
+    }
+  }, {
+    key: "handleLoop",
+    value: function handleLoop() {
+      var _this$options$jsonSch2,
+        _this3 = this,
+        _this$options$jsonSch3,
+        _this$options$jsonSch4;
+      if (!this.options.autoLoop || !((_this$options$jsonSch2 = this.options.jsonSchema) !== null && _this$options$jsonSch2 !== void 0 && _this$options$jsonSch2.duration)) {
+        return;
+      }
+
+      // 清理旧的定时器，防止累积
+      if (this.loopTimerId !== null) {
+        clearTimeout(this.loopTimerId);
+        this.loopTimerId = null;
+        console.log('aminofx:  🧹 清理旧的循环定时器');
+      }
+
+      // 后续根据使用情况看是否调整为监听css动画结束事件
+      this.loopTimerId = window.setTimeout(function () {
+        _this3.container.style.display = 'none';
+        window.setTimeout(function () {
+          _this3.loopTimerId = null;
+          _this3.play();
+        }, 100);
+      }, (_this$options$jsonSch3 = this.options.jsonSchema) === null || _this$options$jsonSch3 === void 0 ? void 0 : _this$options$jsonSch3.duration);
+      console.log("aminofx:  \uD83D\uDD04 \u542F\u52A8\u5FAA\u73AF\u5B9A\u65F6\u5668\uFF0C\u65F6\u957F: ".concat((_this$options$jsonSch4 = this.options.jsonSchema) === null || _this$options$jsonSch4 === void 0 ? void 0 : _this$options$jsonSch4.duration, "ms"));
+    }
+  }, {
+    key: "ready",
+    value: function () {
+      var _ready = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee4() {
+        var _this4 = this;
+        return _regeneratorRuntime().wrap(function _callee4$(_context4) {
+          while (1) switch (_context4.prev = _context4.next) {
+            case 0:
+              if (!this.isReady) {
+                _context4.next = 3;
+                break;
+              }
+              console.log('aminofx:  ✅ 动画已准备就绪，直接返回');
+              return _context4.abrupt("return", Promise.resolve());
+            case 3:
+              if (!this.readyPromise) {
+                _context4.next = 6;
+                break;
+              }
+              console.log('aminofx:  ⏳ 正在准备中，等待现有Promise...');
+              return _context4.abrupt("return", this.readyPromise);
+            case 6:
+              this.readyPromise = new Promise( /*#__PURE__*/function () {
+                var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee3(resolve) {
+                  return _regeneratorRuntime().wrap(function _callee3$(_context3) {
+                    while (1) switch (_context3.prev = _context3.next) {
+                      case 0:
+                        _context3.prev = 0;
+                        _context3.next = 3;
+                        return ResourceLoader.loadImages(_this4.options.preloadImgList || []);
+                      case 3:
+                        _this4.isReady = true; // 设置准备完成状态
+                        console.log('aminofx:  🎉 动画准备完成，可以开始播放');
+                        _context3.next = 10;
+                        break;
+                      case 7:
+                        _context3.prev = 7;
+                        _context3.t0 = _context3["catch"](0);
+                        console.error('aminofx:  ❌ 动画准备失败:', _context3.t0);
+                      case 10:
+                        resolve();
+                      case 11:
+                      case "end":
+                        return _context3.stop();
+                    }
+                  }, _callee3, null, [[0, 7]]);
+                }));
+                return function (_x2) {
+                  return _ref.apply(this, arguments);
+                };
+              }());
+              return _context4.abrupt("return", this.readyPromise);
+            case 8:
+            case "end":
+              return _context4.stop();
+          }
+        }, _callee4, this);
+      }));
+      function ready() {
+        return _ready.apply(this, arguments);
+      }
+      return ready;
+    }()
+  }, {
+    key: "play",
+    value: function () {
+      var _play = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee5() {
+        return _regeneratorRuntime().wrap(function _callee5$(_context5) {
+          while (1) switch (_context5.prev = _context5.next) {
+            case 0:
+              if (this.isReady) {
+                _context5.next = 4;
+                break;
+              }
+              console.warn('aminofx:  ⚠️ 动画尚未准备就绪，自动调用ready()...');
+              _context5.next = 4;
+              return this.ready();
+            case 4:
+              this.container.style.display = 'flex';
+
+              // 只在循环未启动时才启动循环，防止重复调用
+              if (this.options.autoLoop && this.loopTimerId === null) {
+                this.handleLoop();
+              }
+            case 6:
+            case "end":
+              return _context5.stop();
+          }
+        }, _callee5, this);
+      }));
+      function play() {
+        return _play.apply(this, arguments);
+      }
+      return play;
+    }()
+  }, {
+    key: "destroy",
+    value: function destroy() {
+      // 清理循环定时器
+      if (this.loopTimerId !== null) {
+        clearTimeout(this.loopTimerId);
+        this.loopTimerId = null;
+        console.log('aminofx:  🧹 销毁时清理循环定时器');
+      }
+
+      // 重置状态
+      this.container.innerHTML = '';
+      this.isReady = false;
+      this.readyPromise = null;
+      console.log('aminofx:  🗑️ AnimationPlayer 已销毁');
+    }
+  }, {
+    key: "updateSchema",
+    value: function updateSchema(options) {
+      // 清理旧的循环定时器
+      if (this.loopTimerId !== null) {
+        clearTimeout(this.loopTimerId);
+        this.loopTimerId = null;
+        console.log('aminofx:  🧹 更新Schema时清理循环定时器');
+      }
+
+      // 重置状态
+      this.isReady = false;
+      this.readyPromise = null;
+
+      // 更新配置并重新初始化
+      this.options = options;
+      this.init();
+    }
+  }]);
+  return AnimationPlayer;
+}();
+function createCssAnimationPlayer(containerId, options) {
+  var container = document.getElementById(containerId);
+  if (!container) {
+    throw new Error("Container with id \"".concat(containerId, "\" not found"));
+  }
+
+  // 固定比例画布容器，通过设置container适配不同比例机型
+  var canvasContainer = document.createElement('div');
+  Object.assign(canvasContainer.style, {
+    display: 'none',
+    width: '100vw',
+    height: '100vh',
+    overflow: 'hidden',
+    alignItems: options.alignItems || 'center',
+    justifyContent: 'center',
+    backgroundColor: 'rgba(0, 0, 0, 0.85)',
+    backdropFilter: 'blur(10px)'
+  });
+  var instance = new AnimationPlayer(canvasContainer, options);
+  container.appendChild(canvasContainer);
+  return instance;
+}
+export default createCssAnimationPlayer;
+window.createCssAnimationPlayer = createCssAnimationPlayer;
+export { AnimationPlayer };
+export * from "./type";

package/dist/esm/type.d.ts

@@ -0,0 +1,13 @@
+type IJsonSchema = {
+    duration: number;
+    content: string;
+};
+interface IPlayerOptions {
+    alignItems?: 'center' | 'flex-start' | 'flex-end';
+    jsonSchema?: IJsonSchema;
+    jsonUrl?: string;
+    preloadImgList?: string[];
+    autoLoop?: boolean;
+    dynamicData?: Record<string, string | number | boolean>;
+}
+export type { IPlayerOptions, IJsonSchema };

package/dist/esm/type.js

@@ -0,0 +1 @@
+export {};

package/dist/umd/aminofx-css-kit.min.js

@@ -0,0 +1 @@
+!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports["@yqg/aminofx-css-kit"]=e():t["@yqg/aminofx-css-kit"]=e()}(self,(function(){return function(){var t={506:function(){},365:function(t){function e(t,e,r,n,o,i,a){try{var s=t[i](a),c=s.value}catch(t){return void r(t)}s.done?e(c):Promise.resolve(c).then(n,o)}t.exports=function(t){return function(){var r=this,n=arguments;return new Promise((function(o,i){var a=t.apply(r,n);function s(t){e(a,o,i,s,c,"next",t)}function c(t){e(a,o,i,s,c,"throw",t)}s(void 0)}))}},t.exports.__esModule=!0,t.exports.default=t.exports},156:function(t){t.exports=function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")},t.exports.__esModule=!0,t.exports.default=t.exports},499:function(t,e,r){var n=r(714);function o(t,e){for(var r=0;r<e.length;r++){var o=e[r];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(t,n(o.key),o)}}t.exports=function(t,e,r){return e&&o(t.prototype,e),r&&o(t,r),Object.defineProperty(t,"prototype",{writable:!1}),t},t.exports.__esModule=!0,t.exports.default=t.exports},173:function(t,e,r){var n=r(714);t.exports=function(t,e,r){return(e=n(e))in t?Object.defineProperty(t,e,{value:r,enumerable:!0,configurable:!0,writable:!0}):t[e]=r,t},t.exports.__esModule=!0,t.exports.default=t.exports},298:function(t,e,r){var n=r(241).default;function o(){"use strict";t.exports=o=function(){return r},t.exports.__esModule=!0,t.exports.default=t.exports;var e,r={},i=Object.prototype,a=i.hasOwnProperty,s=Object.defineProperty||function(t,e,r){t[e]=r.value},c="function"==typeof Symbol?Symbol:{},u=c.iterator||"@@iterator",l=c.asyncIterator||"@@asyncIterator",f=c.toStringTag||"@@toStringTag";function p(t,e,r){return Object.defineProperty(t,e,{value:r,enumerable:!0,configurable:!0,writable:!0}),t[e]}try{p({},"")}catch(e){p=function(t,e,r){return t[e]=r}}function h(t,e,r,n){var o=e&&e.prototype instanceof g?e:g,i=Object.create(o.prototype),a=new M(n||[]);return s(i,"_invoke",{value:S(t,r,a)}),i}function d(t,e,r){try{return{type:"normal",arg:t.call(e,r)}}catch(t){return{type:"throw",arg:t}}}r.wrap=h;var y="suspendedStart",v="executing",m="completed",x={};function g(){}function w(){}function b(){}var P={};p(P,u,(function(){return this}));var j=Object.getPrototypeOf,_=j&&j(j(C([])));_&&_!==i&&a.call(_,u)&&(P=_);var k=b.prototype=g.prototype=Object.create(P);function L(t){["next","throw","return"].forEach((function(e){p(t,e,(function(t){return this._invoke(e,t)}))}))}function T(t,e){function r(o,i,s,c){var u=d(t[o],t,i);if("throw"!==u.type){var l=u.arg,f=l.value;return f&&"object"==n(f)&&a.call(f,"__await")?e.resolve(f.__await).then((function(t){r("next",t,s,c)}),(function(t){r("throw",t,s,c)})):e.resolve(f).then((function(t){l.value=t,s(l)}),(function(t){return r("throw",t,s,c)}))}c(u.arg)}var o;s(this,"_invoke",{value:function(t,n){function i(){return new e((function(e,o){r(t,n,e,o)}))}return o=o?o.then(i,i):i()}})}function S(t,r,n){var o=y;return function(i,a){if(o===v)throw new Error("Generator is already running");if(o===m){if("throw"===i)throw a;return{value:e,done:!0}}for(n.method=i,n.arg=a;;){var s=n.delegate;if(s){var c=E(s,n);if(c){if(c===x)continue;return c}}if("next"===n.method)n.sent=n._sent=n.arg;else if("throw"===n.method){if(o===y)throw o=m,n.arg;n.dispatchException(n.arg)}else"return"===n.method&&n.abrupt("return",n.arg);o=v;var u=d(t,r,n);if("normal"===u.type){if(o=n.done?m:"suspendedYield",u.arg===x)continue;return{value:u.arg,done:n.done}}"throw"===u.type&&(o=m,n.method="throw",n.arg=u.arg)}}}function E(t,r){var n=r.method,o=t.iterator[n];if(o===e)return r.delegate=null,"throw"===n&&t.iterator.return&&(r.method="return",r.arg=e,E(t,r),"throw"===r.method)||"return"!==n&&(r.method="throw",r.arg=new TypeError("The iterator does not provide a '"+n+"' method")),x;var i=d(o,t.iterator,r.arg);if("throw"===i.type)return r.method="throw",r.arg=i.arg,r.delegate=null,x;var a=i.arg;return a?a.done?(r[t.resultName]=a.value,r.next=t.nextLoc,"return"!==r.method&&(r.method="next",r.arg=e),r.delegate=null,x):a:(r.method="throw",r.arg=new TypeError("iterator result is not an object"),r.delegate=null,x)}function O(t){var e={tryLoc:t[0]};1 in t&&(e.catchLoc=t[1]),2 in t&&(e.finallyLoc=t[2],e.afterLoc=t[3]),this.tryEntries.push(e)}function I(t){var e=t.completion||{};e.type="normal",delete e.arg,t.completion=e}function M(t){this.tryEntries=[{tryLoc:"root"}],t.forEach(O,this),this.reset(!0)}function C(t){if(t||""===t){var r=t[u];if(r)return r.call(t);if("function"==typeof t.next)return t;if(!isNaN(t.length)){var o=-1,i=function r(){for(;++o<t.length;)if(a.call(t,o))return r.value=t[o],r.done=!1,r;return r.value=e,r.done=!0,r};return i.next=i}}throw new TypeError(n(t)+" is not iterable")}return w.prototype=b,s(k,"constructor",{value:b,configurable:!0}),s(b,"constructor",{value:w,configurable:!0}),w.displayName=p(b,f,"GeneratorFunction"),r.isGeneratorFunction=function(t){var e="function"==typeof t&&t.constructor;return!!e&&(e===w||"GeneratorFunction"===(e.displayName||e.name))},r.mark=function(t){return Object.setPrototypeOf?Object.setPrototypeOf(t,b):(t.__proto__=b,p(t,f,"GeneratorFunction")),t.prototype=Object.create(k),t},r.awrap=function(t){return{__await:t}},L(T.prototype),p(T.prototype,l,(function(){return this})),r.AsyncIterator=T,r.async=function(t,e,n,o,i){void 0===i&&(i=Promise);var a=new T(h(t,e,n,o),i);return r.isGeneratorFunction(e)?a:a.next().then((function(t){return t.done?t.value:a.next()}))},L(k),p(k,f,"Generator"),p(k,u,(function(){return this})),p(k,"toString",(function(){return"[object Generator]"})),r.keys=function(t){var e=Object(t),r=[];for(var n in e)r.push(n);return r.reverse(),function t(){for(;r.length;){var n=r.pop();if(n in e)return t.value=n,t.done=!1,t}return t.done=!0,t}},r.values=C,M.prototype={constructor:M,reset:function(t){if(this.prev=0,this.next=0,this.sent=this._sent=e,this.done=!1,this.delegate=null,this.method="next",this.arg=e,this.tryEntries.forEach(I),!t)for(var r in this)"t"===r.charAt(0)&&a.call(this,r)&&!isNaN(+r.slice(1))&&(this[r]=e)},stop:function(){this.done=!0;var t=this.tryEntries[0].completion;if("throw"===t.type)throw t.arg;return this.rval},dispatchException:function(t){if(this.done)throw t;var r=this;function n(n,o){return s.type="throw",s.arg=t,r.next=n,o&&(r.method="next",r.arg=e),!!o}for(var o=this.tryEntries.length-1;o>=0;--o){var i=this.tryEntries[o],s=i.completion;if("root"===i.tryLoc)return n("end");if(i.tryLoc<=this.prev){var c=a.call(i,"catchLoc"),u=a.call(i,"finallyLoc");if(c&&u){if(this.prev<i.catchLoc)return n(i.catchLoc,!0);if(this.prev<i.finallyLoc)return n(i.finallyLoc)}else if(c){if(this.prev<i.catchLoc)return n(i.catchLoc,!0)}else{if(!u)throw new Error("try statement without catch or finally");if(this.prev<i.finallyLoc)return n(i.finallyLoc)}}}},abrupt:function(t,e){for(var r=this.tryEntries.length-1;r>=0;--r){var n=this.tryEntries[r];if(n.tryLoc<=this.prev&&a.call(n,"finallyLoc")&&this.prev<n.finallyLoc){var o=n;break}}o&&("break"===t||"continue"===t)&&o.tryLoc<=e&&e<=o.finallyLoc&&(o=null);var i=o?o.completion:{};return i.type=t,i.arg=e,o?(this.method="next",this.next=o.finallyLoc,x):this.complete(i)},complete:function(t,e){if("throw"===t.type)throw t.arg;return"break"===t.type||"continue"===t.type?this.next=t.arg:"return"===t.type?(this.rval=this.arg=t.arg,this.method="return",this.next="end"):"normal"===t.type&&e&&(this.next=e),x},finish:function(t){for(var e=this.tryEntries.length-1;e>=0;--e){var r=this.tryEntries[e];if(r.finallyLoc===t)return this.complete(r.completion,r.afterLoc),I(r),x}},catch:function(t){for(var e=this.tryEntries.length-1;e>=0;--e){var r=this.tryEntries[e];if(r.tryLoc===t){var n=r.completion;if("throw"===n.type){var o=n.arg;I(r)}return o}}throw new Error("illegal catch attempt")},delegateYield:function(t,r,n){return this.delegate={iterator:C(t),resultName:r,nextLoc:n},"next"===this.method&&(this.arg=e),x}},r}t.exports=o,t.exports.__esModule=!0,t.exports.default=t.exports},569:function(t,e,r){var n=r(241).default;t.exports=function(t,e){if("object"!=n(t)||!t)return t;var r=t[Symbol.toPrimitive];if(void 0!==r){var o=r.call(t,e||"default");if("object"!=n(o))return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===e?String:Number)(t)},t.exports.__esModule=!0,t.exports.default=t.exports},714:function(t,e,r){var n=r(241).default,o=r(569);t.exports=function(t){var e=o(t,"string");return"symbol"==n(e)?e:String(e)},t.exports.__esModule=!0,t.exports.default=t.exports},241:function(t){function e(r){return t.exports=e="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},t.exports.__esModule=!0,t.exports.default=t.exports,e(r)}t.exports=e,t.exports.__esModule=!0,t.exports.default=t.exports}},e={};function r(n){var o=e[n];if(void 0!==o)return o.exports;var i=e[n]={exports:{}};return t[n](i,i.exports,r),i.exports}r.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return r.d(e,{a:e}),e},r.d=function(t,e){for(var n in e)r.o(e,n)&&!r.o(t,n)&&Object.defineProperty(t,n,{enumerable:!0,get:e[n]})},r.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},r.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})};var n={};return function(){"use strict";r.r(n),r.d(n,{AnimationPlayer:function(){return v}});var t=r(298),e=r.n(t),o=r(365),i=r.n(o),a=r(156),s=r.n(a),c=r(499),u=r.n(c),l=r(173),f=r.n(l),p=r(506),h={};for(var d in p)["default","AnimationPlayer"].indexOf(d)<0&&(h[d]=function(t){return p[t]}.bind(0,d));r.d(n,h);var y=function(){function t(){s()(this,t)}var r;return u()(t,null,[{key:"loadImages",value:(r=i()(e()().mark((function t(r){var n,o=this;return e()().wrap((function(t){for(;;)switch(t.prev=t.next){case 0:if(Array.isArray(r)&&0!==r.length){t.next=2;break}return t.abrupt("return",Promise.resolve());case 2:return n=r.map((function(t,e){if(!t.startsWith("http"))return Promise.resolve();if(o.imageCache.has(t))return console.log("aminofx:  ✅ 图片 ".concat(e+1," 已缓存: ").concat(t)),Promise.resolve();if(o.loadingQueue.has(t))return o.loadingQueue.get(t);var r=new Promise((function(r){var n=new Image;n.onload=function(){o.imageCache.set(t,!0),o.loadingQueue.delete(t),console.log("aminofx:  ✅ 图片 ".concat(e+1," 加载成功: ").concat(t)),"function"==typeof n.decode?n.decode().then((function(){console.log("aminofx:  🎨 图片 ".concat(e+1," 解码完成: ").concat(t)),r()})).catch((function(){console.log("aminofx:  ⚠️ 图片 ".concat(e+1," decode失败，使用fallback: ").concat(t)),r()})):(console.log("aminofx:  📱 图片 ".concat(e+1," 使用兼容模式: ").concat(t)),r())},n.src=t,n.onerror=function(){o.loadingQueue.delete(t),console.error("aminofx:  ❌ 图片 ".concat(e+1," 加载失败: ").concat(t)),r()}}));return o.loadingQueue.set(t,r),r})),t.prev=3,t.next=6,Promise.all(n);case 6:console.log("aminofx:  🎉 所有图片资源加载完成"),t.next=12;break;case 9:t.prev=9,t.t0=t.catch(3),console.error("aminofx:  ❌ 图片加载过程中出现错误:",t.t0);case 12:case"end":return t.stop()}}),t,null,[[3,9]])}))),function(t){return r.apply(this,arguments)})}]),t}();f()(y,"imageCache",new Map),f()(y,"loadingQueue",new Map);var v=function(){function t(e,r){s()(this,t),f()(this,"container",void 0),f()(this,"options",void 0),f()(this,"isReady",!1),f()(this,"readyPromise",null),f()(this,"loopTimerId",null),this.container=e,this.options=r,this.init()}var r,n,o;return u()(t,[{key:"init",value:(o=i()(e()().mark((function t(){var r,n,o,i,a;return e()().wrap((function(t){for(;;)switch(t.prev=t.next){case 0:if(!this.options.jsonSchema){t.next=4;break}this.container.innerHTML=this.replacePlaceholders(this.options.jsonSchema.content),t.next=16;break;case 4:if(null===(r=this.options)||void 0===r||!r.jsonUrl){t.next=15;break}return t.next=7,fetch(null===(n=this.options)||void 0===n?void 0:n.jsonUrl);case 7:return i=t.sent,t.next=10,i.json();case 10:a=t.sent,this.options.jsonSchema=a,this.container.innerHTML=this.replacePlaceholders((null===(o=this.options.jsonSchema)||void 0===o?void 0:o.content)||""),t.next=16;break;case 15:throw new Error("没有提供jsonSchema或jsonUrl");case 16:return t.next=18,this.ready();case 18:case"end":return t.stop()}}),t,this)}))),function(){return o.apply(this,arguments)})},{key:"replacePlaceholders",value:function(t){var e=this;return this.options.dynamicData&&t?t.replace(/\{\{(\w+)\}\}|\$\{(\w+)\}/g,(function(t,r,n){var o,i=r||n;return void 0!==(null===(o=e.options.dynamicData)||void 0===o?void 0:o[i])?String(e.options.dynamicData[i]):t})):t}},{key:"handleLoop",value:function(){var t,e,r,n=this;this.options.autoLoop&&null!==(t=this.options.jsonSchema)&&void 0!==t&&t.duration&&(null!==this.loopTimerId&&(clearTimeout(this.loopTimerId),this.loopTimerId=null,console.log("aminofx:  🧹 清理旧的循环定时器")),this.loopTimerId=window.setTimeout((function(){n.container.style.display="none",window.setTimeout((function(){n.loopTimerId=null,n.play()}),100)}),null===(e=this.options.jsonSchema)||void 0===e?void 0:e.duration),console.log("aminofx:  🔄 启动循环定时器，时长: ".concat(null===(r=this.options.jsonSchema)||void 0===r?void 0:r.duration,"ms")))}},{key:"ready",value:(n=i()(e()().mark((function t(){var r=this;return e()().wrap((function(t){for(;;)switch(t.prev=t.next){case 0:if(!this.isReady){t.next=3;break}return console.log("aminofx:  ✅ 动画已准备就绪，直接返回"),t.abrupt("return",Promise.resolve());case 3:if(!this.readyPromise){t.next=6;break}return console.log("aminofx:  ⏳ 正在准备中，等待现有Promise..."),t.abrupt("return",this.readyPromise);case 6:return this.readyPromise=new Promise(function(){var t=i()(e()().mark((function t(n){return e()().wrap((function(t){for(;;)switch(t.prev=t.next){case 0:return t.prev=0,t.next=3,y.loadImages(r.options.preloadImgList||[]);case 3:r.isReady=!0,console.log("aminofx:  🎉 动画准备完成，可以开始播放"),t.next=10;break;case 7:t.prev=7,t.t0=t.catch(0),console.error("aminofx:  ❌ 动画准备失败:",t.t0);case 10:n();case 11:case"end":return t.stop()}}),t,null,[[0,7]])})));return function(e){return t.apply(this,arguments)}}()),t.abrupt("return",this.readyPromise);case 8:case"end":return t.stop()}}),t,this)}))),function(){return n.apply(this,arguments)})},{key:"play",value:(r=i()(e()().mark((function t(){return e()().wrap((function(t){for(;;)switch(t.prev=t.next){case 0:if(this.isReady){t.next=4;break}return console.warn("aminofx:  ⚠️ 动画尚未准备就绪，自动调用ready()..."),t.next=4,this.ready();case 4:this.container.style.display="flex",this.options.autoLoop&&null===this.loopTimerId&&this.handleLoop();case 6:case"end":return t.stop()}}),t,this)}))),function(){return r.apply(this,arguments)})},{key:"destroy",value:function(){null!==this.loopTimerId&&(clearTimeout(this.loopTimerId),this.loopTimerId=null,console.log("aminofx:  🧹 销毁时清理循环定时器")),this.container.innerHTML="",this.isReady=!1,this.readyPromise=null,console.log("aminofx:  🗑️ AnimationPlayer 已销毁")}},{key:"updateSchema",value:function(t){null!==this.loopTimerId&&(clearTimeout(this.loopTimerId),this.loopTimerId=null,console.log("aminofx:  🧹 更新Schema时清理循环定时器")),this.isReady=!1,this.readyPromise=null,this.options=t,this.init()}}]),t}();function m(t,e){var r=document.getElementById(t);if(!r)throw new Error('Container with id "'.concat(t,'" not found'));var n=document.createElement("div");Object.assign(n.style,{display:"none",width:"100vw",height:"100vh",overflow:"hidden",alignItems:e.alignItems||"center",justifyContent:"center",backgroundColor:"rgba(0, 0, 0, 0.85)",backdropFilter:"blur(10px)"});var o=new v(n,e);return r.appendChild(n),o}n.default=m,window.createCssAnimationPlayer=m}(),n}()}));

package/package.json

@@ -0,0 +1,32 @@
+{
+  "name": "@yqg/aminofx-css-kit",
+  "version": "1.0.0",
+  "description": "YQG AminoFX CSS animation kit - Core animation utilities and effects",
+  "main": "dist/esm/index.js",
+  "module": "dist/esm/index.js",
+  "types": "dist/esm/index.d.ts",
+  "exports": {
+    ".": {
+      "import": "./src/index",
+      "require": "./dist/cjs/index.js"
+    }
+  },
+  "files": [
+    "dist",
+    "src"
+  ],
+  "scripts": {
+    "build": "max build --target=bundle",
+    "dev": "max dev --target=docs"
+  },
+  "keywords": [
+    "css",
+    "animation",
+    "effects",
+    "aminofx",
+    "web-animations"
+  ],
+  "publishConfig": {
+    "access": "public"
+  }
+}