@yqg/aminofx-css-kit 1.0.1 → 1.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/README.md +23 -20
  2. package/dist/esm/index.js +2 -2
  3. package/dist/umd/aminofx-css-kit.min.js +1 -1
  4. package/package.json +1 -1
  5. package/src/index.ts +2 -2
package/README.md CHANGED
@@ -19,7 +19,6 @@
19
19
  npm install aminofx-css-kit
20
20
  ```
21
21
 
22
-
23
22
  ## 🏗️ 核心接口
24
23
 
25
24
  ### IJsonSchema
@@ -43,19 +42,19 @@ interface IJsonSchema {
43
42
  interface IPlayerOptions {
44
43
  /** 弹窗垂直对齐方式 */
45
44
  alignItems?: 'center' | 'flex-start' | 'flex-end';
46
-
45
+
47
46
  /** 直接传入 JSON Schema 数据 */
48
47
  jsonSchema?: IJsonSchema;
49
-
48
+
50
49
  /** 通过 URL 加载 JSON Schema（jsonSchema 优先级更高） */
51
50
  jsonUrl?: string;
52
-
51
+
53
52
  /** 需要预加载的图片列表 */
54
53
  preloadImgList?: string[];
55
-
54
+
56
55
  /** 是否自动循环播放 */
57
56
  autoLoop?: boolean;
58
-
57
+
59
58
  /** 动态数据，用于替换模板变量 */
60
59
  dynamicData?: Record<string, string | number | boolean>;
61
60
  }
@@ -69,12 +68,12 @@ interface IPlayerOptions {
69
68
 
70
69
  #### 方法列表
71
70
 
72
- | 方法 | 描述 | 参数 | 返回值 |
73
- |------|------|------|--------|
74
- | `play()` | 开始播放动画 | - | `Promise<void>` |
75
- | `ready()` | 等待资源加载完成 | - | `Promise<void>` |
76
- | `destroy()` | 销毁播放器，清理资源 | - | `void` |
77
- | `updateSchema(options)` | 更新动画配置并重新初始化 | `options: IPlayerOptions` | `void` |
71
+ | 方法 | 描述 | 参数 | 返回值 |
72
+ | ----------------------- | ------------------------ | ------------------------- | --------------- |
73
+ | `play()` | 开始播放动画 | - | `Promise<void>` |
74
+ | `ready()` | 等待资源加载完成 | - | `Promise<void>` |
75
+ | `destroy()` | 销毁播放器，清理资源 | - | `void` |
76
+ | `updateSchema(options)` | 更新动画配置并重新初始化 | `options: IPlayerOptions` | `void` |
78
77
 
79
78
  ## 🏭 工厂函数
80
79
 
@@ -85,7 +84,7 @@ interface IPlayerOptions {
85
84
  ```typescript
86
85
  function createCssAnimationPlayer(
87
86
  containerId: string,
88
- options: IPlayerOptions
87
+ options: IPlayerOptions,
89
88
  ): AnimationPlayer;
90
89
  ```
91
90
 
@@ -113,7 +112,7 @@ function createCssAnimationPlayer(
113
112
  </head>
114
113
  <body>
115
114
  <div id="demo-container"></div>
116
-
115
+
117
116
  <script>
118
117
  const player = window.createCssAnimationPlayer('demo-container', {
119
118
  jsonUrl: 'https://example.com/animation.json',
@@ -154,9 +153,7 @@ const player = createCssAnimationPlayer('demo-container', {
154
153
  <div class="animation-box"></div>
155
154
  `,
156
155
  },
157
- preloadImgList: [
158
- 'https://example.com/bg.png',
159
- ],
156
+ preloadImgList: ['https://example.com/bg.png'],
160
157
  });
161
158
 
162
159
  // 播放动画
@@ -289,7 +286,7 @@ export const AnimationComponent: React.FC = () => {
289
286
 
290
287
  return (
291
288
  <div>
292
- <div id="animation-container" ref={containerRef} />
289
+ <div id='animation-container' ref={containerRef} />
293
290
  <button onClick={handlePlay} disabled={!isReady}>
294
291
  {isReady ? '播放动画' : '加载中...'}
295
292
  </button>
@@ -313,6 +310,7 @@ await player.play();
313
310
  #### ready()
314
311
 
315
312
  等待所有资源（特别是图片）加载完成。此方法会：
313
+
316
314
  - 预加载所有指定的图片
317
315
  - 确保图片解码完成
318
316
  - 返回 Promise，资源准备完成后 resolve
@@ -325,6 +323,7 @@ console.log('所有资源已加载完成');
325
323
  #### destroy()
326
324
 
327
325
  销毁播放器，清理所有资源：
326
+
328
327
  - 清除循环定时器
329
328
  - 清空容器内容
330
329
  - 重置内部状态
@@ -336,6 +335,7 @@ player.destroy();
336
335
  #### updateSchema(options)
337
336
 
338
337
  更新动画配置并重新初始化。会：
338
+
339
339
  - 清理旧的定时器
340
340
  - 重置播放器状态
341
341
  - 加载新的动画配置
@@ -376,7 +376,7 @@ player.play();
376
376
  // React
377
377
  useEffect(() => {
378
378
  const player = createCssAnimationPlayer('container', options);
379
-
379
+
380
380
  return () => {
381
381
  player.destroy(); // 清理资源
382
382
  };
@@ -417,6 +417,7 @@ const player = createCssAnimationPlayer('container', {
417
417
  ### Q: 动画不显示？
418
418
 
419
419
  **A:** 检查以下几点：
420
+
420
421
  - 容器元素是否存在（`document.getElementById(containerId)` 不为 null）
421
422
  - JSON Schema 的 `content` 字段是否包含有效的 HTML 和 CSS
422
423
  - 检查浏览器控制台是否有错误信息
@@ -424,7 +425,8 @@ const player = createCssAnimationPlayer('container', {
424
425
 
425
426
  ### Q: 图片加载失败？
426
427
 
427
- **A:**
428
+ **A:**
429
+
428
430
  - 检查图片 URL 是否正确
429
431
  - 确认服务器是否配置了正确的 CORS 头
430
432
  - 查看浏览器网络面板，确认图片请求状态
@@ -433,6 +435,7 @@ const player = createCssAnimationPlayer('container', {
433
435
  ### Q: 循环播放不工作？
434
436
 
435
437
  **A:**
438
+
436
439
  - 确保 `autoLoop` 设置为 `true`
437
440
  - 检查 `jsonSchema.duration` 是否正确设置
438
441
  - 循环播放基于定时器实现，确保页面未被挂起
package/dist/esm/index.js CHANGED
@@ -199,7 +199,7 @@ var AnimationPlayer = /*#__PURE__*/function () {
199
199
  _this3 = this,
200
200
  _this$options$jsonSch3,
201
201
  _this$options$jsonSch4;
202
- if (!this.options.autoLoop || !((_this$options$jsonSch2 = this.options.jsonSchema) !== null && _this$options$jsonSch2 !== void 0 && _this$options$jsonSch2.duration)) {
202
+ if (!this.options.autoLoop || !Number((_this$options$jsonSch2 = this.options.jsonSchema) === null || _this$options$jsonSch2 === void 0 ? void 0 : _this$options$jsonSch2.duration)) {
203
203
  return;
204
204
  }
205
205
 
@@ -217,7 +217,7 @@ var AnimationPlayer = /*#__PURE__*/function () {
217
217
  _this3.loopTimerId = null;
218
218
  _this3.play();
219
219
  }, 100);
220
- }, (_this$options$jsonSch3 = this.options.jsonSchema) === null || _this$options$jsonSch3 === void 0 ? void 0 : _this$options$jsonSch3.duration);
220
+ }, Number((_this$options$jsonSch3 = this.options.jsonSchema) === null || _this$options$jsonSch3 === void 0 ? void 0 : _this$options$jsonSch3.duration));
221
221
  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"));
222
222
  }
223
223
  }, {
package/dist/umd/aminofx-css-kit.min.js CHANGED
@@ -1 +1 @@
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 j={};p(j,u,(function(){return this}));var P=Object.getPrototypeOf,_=P&&P(P(C([])));_&&_!==i&&a.call(_,u)&&(j=_);var k=b.prototype=g.prototype=Object.create(j);function L(t){["next","throw","return"].forEach((function(e){p(t,e,(function(t){return this._invoke(e,t)}))}))}function E(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=T(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 T(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,T(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(E.prototype),p(E.prototype,l,(function(){return this})),r.AsyncIterator=E,r.async=function(t,e,n,o,i){void 0===i&&(i=Promise);var a=new E(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(Object.assign(this.container.style,{display:"none",width:"100vw",height:"100vh",overflow:"hidden",alignItems:this.options.alignItems||"center",justifyContent:"center",backgroundColor:"rgba(0, 0, 0, 0.85)",backdropFilter:"blur(10px)"}),!this.options.jsonSchema){t.next=5;break}this.container.innerHTML=this.replacePlaceholders(this.options.jsonSchema.content),t.next=17;break;case 5:if(null===(r=this.options)||void 0===r||!r.jsonUrl){t.next=16;break}return t.next=8,fetch(null===(n=this.options)||void 0===n?void 0:n.jsonUrl);case 8:return i=t.sent,t.next=11,i.json();case 11: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=17;break;case 16:throw new Error("没有提供jsonSchema或jsonUrl");case 17:return t.next=19,this.ready();case 19: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){this.destroy(),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"),o=new v(n,e);return r.appendChild(n),o}n.default=m,window.createCssAnimationPlayer=m}(),n}()}));
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 j={};p(j,u,(function(){return this}));var P=Object.getPrototypeOf,_=P&&P(P(N([])));_&&_!==i&&a.call(_,u)&&(j=_);var k=b.prototype=g.prototype=Object.create(j);function L(t){["next","throw","return"].forEach((function(e){p(t,e,(function(t){return this._invoke(e,t)}))}))}function E(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=T(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 T(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,T(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 N(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(E.prototype),p(E.prototype,l,(function(){return this})),r.AsyncIterator=E,r.async=function(t,e,n,o,i){void 0===i&&(i=Promise);var a=new E(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=N,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:N(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(Object.assign(this.container.style,{display:"none",width:"100vw",height:"100vh",overflow:"hidden",alignItems:this.options.alignItems||"center",justifyContent:"center",backgroundColor:"rgba(0, 0, 0, 0.85)",backdropFilter:"blur(10px)"}),!this.options.jsonSchema){t.next=5;break}this.container.innerHTML=this.replacePlaceholders(this.options.jsonSchema.content),t.next=17;break;case 5:if(null===(r=this.options)||void 0===r||!r.jsonUrl){t.next=16;break}return t.next=8,fetch(null===(n=this.options)||void 0===n?void 0:n.jsonUrl);case 8:return i=t.sent,t.next=11,i.json();case 11: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=17;break;case 16:throw new Error("没有提供jsonSchema或jsonUrl");case 17:return t.next=19,this.ready();case 19: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&&Number(null===(t=this.options.jsonSchema)||void 0===t?void 0: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)}),Number(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){this.destroy(),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"),o=new v(n,e);return r.appendChild(n),o}n.default=m,window.createCssAnimationPlayer=m}(),n}()}));
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@yqg/aminofx-css-kit",
3
- "version": "1.0.1",
3
+ "version": "1.0.2",
4
4
  "description": "YQG AminoFX CSS animation kit - Core animation utilities and effects",
5
5
  "main": "dist/esm/index.js",
6
6
  "module": "dist/esm/index.js",
package/src/index.ts CHANGED
@@ -153,7 +153,7 @@ class AnimationPlayer {
153
153
  }
154
154
 
155
155
  private handleLoop() {
156
- if (!this.options.autoLoop || !this.options.jsonSchema?.duration) {
156
+ if (!this.options.autoLoop || !Number(this.options.jsonSchema?.duration)) {
157
157
  return;
158
158
  }
159
159
 
@@ -171,7 +171,7 @@ class AnimationPlayer {
171
171
  this.loopTimerId = null;
172
172
  this.play();
173
173
  }, 100);
174
- }, this.options.jsonSchema?.duration);
174
+ }, Number(this.options.jsonSchema?.duration));
175
175
 
176
176
  console.log(
177
177
  `aminofx: 🔄 启动循环定时器，时长: ${this.options.jsonSchema?.duration}ms`,