pxcube-ui 0.2.2 → 0.2.3

package/components/message/index.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const $=require("../../components/message/src/message.vue.js"),r=require("vue"),p=require("../../components/message/src/message.js"),_=require("../../utils/get-props.js");;/* empty css                                         */require("animate.css");const h=r.ref(35),m=r.ref(30),v=r.ref(10),L=r.ref("animate__flipOutX"),g=r.ref(0),E=e=>{e.offset&&(m.value=e.offset),g.value+=1,e.messageID=g.value;const t=r.h($.default,{...e}),s=q(e.position??_.getPropsDefault(p.messageProps.position),e.duration??_.getPropsDefault(p.messageProps.duration));if(s)r.render(t,s);else throw new Error("not found node")},q=(e="top",t)=>{const s=document.getElementsByClassName("px-message__container--"+e),a="px-message--"+g.value,n=document.createElement("div");n.classList.add(`px-message__container--${e}`),n.classList.add("px-message__container--item"),n.id=a;const o=h.value+v.value,l=m.value,i=()=>e=="center"?s.length?(Array.from(s).forEach(u=>{var d=u;d.style.top=`calc(${d.style.top} - ${o/2}px)`}),`calc(${s[s.length-1].style.top} + ${o}px)`):`calc(50% - ${o/2}px)`:`calc(${s.length} * ${o}px + ${l}px)`;return Object.assign(n.style,{top:i(),left:e=="right"?"auto":"0",right:e=="right"?"30px":"0",margin:e!=="right"?"auto auto":"none"}),n.classList.remove("animate__flipInX"),document.body.appendChild(n),t>0&&N(e,a,t+s.length*150),n},N=(e,t,s)=>{if(!t||!s)return!1;const a=document.querySelector(`#${t}`);if(!a)return!1;var n=setTimeout(()=>{x(a,e),clearTimeout(n)},s)},x=(e,t)=>{e.classList.add(L.value),e.classList.add("px-message-animate-exit");const s=()=>{r.render(null,e),e.parentNode&&e.parentNode.removeChild(e),w(t),e.removeEventListener("animationend",s),e.removeEventListener("transitionend",s)};e.addEventListener("animationend",s),e.addEventListener("transitionend",s)},w=e=>{const t=document.getElementsByClassName("px-message__container--"+e),s=t.length,a=h.value,n=v.value;Array.from(t).forEach((o,l)=>{const i=o;if(e=="center"){const f=s*a+(s-1)*n,u=window.innerHeight,y=Math.max(0,(u-f)/2)+(a+n)*l;i.style.top=`${y/u*100}%`}else i.style.top=`${m.value+l*(a+n)}px`})},C=(e,t)=>{var s="px-message--"+e,a=document.querySelector(`#${s}`);return x(a,t)},c={__create:(e,t,s)=>{var a={message:t,type:e};return typeof s=="object"&&(a={...a,...s}),E(a)},success:(e,t)=>c.__create("success",e,t),default:(e,t)=>c.__create("default",e,t),warning:(e,t)=>c.__create("warning",e,t),error:(e,t)=>c.__create("error",e,t),danger:(e,t)=>c.__create("danger",e,t)};exports.__activeCloseMessage=C;exports.pxMessage=c;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const $=require("../../components/message/src/message.vue.js"),r=require("vue"),p=require("../../components/message/src/message.js"),_=require("../../utils/get-props.js");;/* empty css                                         */const h=r.ref(35),m=r.ref(30),v=r.ref(10),E=r.ref("animate__flipOutX"),g=r.ref(0),L=e=>{e.offset&&(m.value=e.offset),g.value+=1,e.messageID=g.value;const t=r.h($.default,{...e}),s=N(e.position??_.getPropsDefault(p.messageProps.position),e.duration??_.getPropsDefault(p.messageProps.duration));if(s)r.render(t,s);else throw new Error("not found node")},N=(e="top",t)=>{const s=document.getElementsByClassName("px-message__container--"+e),n="px-message--"+g.value,a=document.createElement("div");a.classList.add(`px-message__container--${e}`),a.classList.add("px-message__container--item"),a.id=n;const o=h.value+v.value,l=m.value,u=()=>e=="center"?s.length?(Array.from(s).forEach(i=>{var d=i;d.style.top=`calc(${d.style.top} - ${o/2}px)`}),`calc(${s[s.length-1].style.top} + ${o}px)`):`calc(50% - ${o/2}px)`:`calc(${s.length} * ${o}px + ${l}px)`;return Object.assign(a.style,{top:u(),left:e=="right"?"auto":"0",right:e=="right"?"30px":"0",margin:e!=="right"?"auto auto":"none"}),a.classList.remove("animate__flipInX"),document.body.appendChild(a),t>0&&q(e,n,t+s.length*150),a},q=(e,t,s)=>{if(!t||!s)return!1;const n=document.querySelector(`#${t}`);if(!n)return!1;var a=setTimeout(()=>{y(n,e),clearTimeout(a)},s)},y=(e,t)=>{e.classList.add(E.value);const s=()=>{r.render(null,e),e.parentNode&&e.parentNode.removeChild(e),w(t),e.removeEventListener("animationend",s),e.removeEventListener("transitionend",s)};e.addEventListener("animationend",s),e.addEventListener("transitionend",s)},w=e=>{const t=document.getElementsByClassName("px-message__container--"+e),s=t.length,n=h.value,a=v.value;Array.from(t).forEach((o,l)=>{const u=o;if(e=="center"){const f=s*n+(s-1)*a,i=window.innerHeight,x=Math.max(0,(i-f)/2)+(n+a)*l;u.style.top=`${x/i*100}%`}else u.style.top=`${m.value+l*(n+a)}px`})},C=(e,t)=>{var s="px-message--"+e,n=document.querySelector(`#${s}`);return y(n,t)},c={__create:(e,t,s)=>{var n={message:t,type:e};return typeof s=="object"&&(n={...n,...s}),L(n)},success:(e,t)=>c.__create("success",e,t),default:(e,t)=>c.__create("default",e,t),warning:(e,t)=>c.__create("warning",e,t),error:(e,t)=>c.__create("error",e,t),danger:(e,t)=>c.__create("danger",e,t)};exports.__activeCloseMessage=C;exports.pxMessage=c;

package/components/message/index.mjs

@@ -1,63 +1,62 @@
-import L from "../../components/message/src/message.vue.mjs";
-import { ref as c, h as E, render as h } from "vue";
+import E from "../../components/message/src/message.vue.mjs";
+import { ref as c, h as L, render as h } from "vue";
 import { messageProps as p } from "../../components/message/src/message.mjs";
 import { getPropsDefault as _ } from "../../utils/get-props.mjs";
 /* empty css                                         */
-import "animate.css";
 const v = c(35), g = c(30), x = c(10), N = c("animate__flipOutX"), u = c(0), w = (e) => {
   e.offset && (g.value = e.offset), u.value += 1, e.messageID = u.value;
-  const t = E(L, { ...e }), s = C(
+  const t = L(E, { ...e }), n = C(
     e.position ?? _(p.position),
     e.duration ?? _(p.duration)
   );
-  if (s)
-    h(t, s);
+  if (n)
+    h(t, n);
   else
     throw new Error("not found node");
 }, C = (e = "top", t) => {
-  const s = document.getElementsByClassName("px-message__container--" + e), a = "px-message--" + u.value, n = document.createElement("div");
-  n.classList.add(`px-message__container--${e}`), n.classList.add("px-message__container--item"), n.id = a;
-  const o = v.value + x.value, l = g.value, i = () => e == "center" ? s.length ? (Array.from(s).forEach((m) => {
+  const n = document.getElementsByClassName("px-message__container--" + e), s = "px-message--" + u.value, a = document.createElement("div");
+  a.classList.add(`px-message__container--${e}`), a.classList.add("px-message__container--item"), a.id = s;
+  const o = v.value + x.value, l = g.value, i = () => e == "center" ? n.length ? (Array.from(n).forEach((m) => {
     var d = m;
     d.style.top = `calc(${d.style.top} - ${o / 2}px)`;
-  }), `calc(${s[s.length - 1].style.top} + ${o}px)`) : `calc(50% - ${o / 2}px)` : `calc(${s.length} * ${o}px + ${l}px)`;
-  return Object.assign(n.style, {
+  }), `calc(${n[n.length - 1].style.top} + ${o}px)`) : `calc(50% - ${o / 2}px)` : `calc(${n.length} * ${o}px + ${l}px)`;
+  return Object.assign(a.style, {
     top: i(),
     left: e == "right" ? "auto" : "0",
     right: e == "right" ? "30px" : "0",
     margin: e !== "right" ? "auto auto" : "none"
-  }), n.classList.remove("animate__flipInX"), document.body.appendChild(n), t > 0 && M(e, a, t + s.length * 150), n;
-}, M = (e, t, s) => {
-  if (!t || !s) return !1;
-  const a = document.querySelector(`#${t}`);
-  if (!a) return !1;
-  var n = setTimeout(() => {
-    y(a, e), clearTimeout(n);
-  }, s);
+  }), a.classList.remove("animate__flipInX"), document.body.appendChild(a), t > 0 && M(e, s, t + n.length * 150), a;
+}, M = (e, t, n) => {
+  if (!t || !n) return !1;
+  const s = document.querySelector(`#${t}`);
+  if (!s) return !1;
+  var a = setTimeout(() => {
+    y(s, e), clearTimeout(a);
+  }, n);
 }, y = (e, t) => {
-  e.classList.add(N.value), e.classList.add("px-message-animate-exit");
-  const s = () => {
-    h(null, e), e.parentNode && e.parentNode.removeChild(e), b(t), e.removeEventListener("animationend", s), e.removeEventListener("transitionend", s);
+  e.classList.add(N.value);
+  const n = () => {
+    h(null, e), e.parentNode && e.parentNode.removeChild(e), b(t), e.removeEventListener("animationend", n), e.removeEventListener("transitionend", n);
   };
-  e.addEventListener("animationend", s), e.addEventListener("transitionend", s);
+  e.addEventListener("animationend", n), e.addEventListener("transitionend", n);
 }, b = (e) => {
-  const t = document.getElementsByClassName("px-message__container--" + e), s = t.length, a = v.value, n = x.value;
+  const t = document.getElementsByClassName("px-message__container--" + e), n = t.length, s = v.value, a = x.value;
   Array.from(t).forEach((o, l) => {
     const i = o;
     if (e == "center") {
-      const f = s * a + (s - 1) * n, m = window.innerHeight, $ = Math.max(0, (m - f) / 2) + (a + n) * l;
+      const f = n * s + (n - 1) * a, m = window.innerHeight, $ = Math.max(0, (m - f) / 2) + (s + a) * l;
       i.style.top = `${$ / m * 100}%`;
     } else
-      i.style.top = `${g.value + l * (a + n)}px`;
+      i.style.top = `${g.value + l * (s + a)}px`;
   });
-}, S = (e, t) => {
-  var s = "px-message--" + e, a = document.querySelector(`#${s}`);
-  return y(a, t);
+}, B = (e, t) => {
+  var n = "px-message--" + e, s = document.querySelector(`#${n}`);
+  return y(s, t);
 }, r = {
   //生产消息弹窗的内部方法
-  __create: (e, t, s) => {
-    var a = { message: t, type: e };
-    return typeof s == "object" && (a = { ...a, ...s }), w(a);
+  __create: (e, t, n) => {
+    var s = { message: t, type: e };
+    return typeof n == "object" && (s = { ...s, ...n }), w(s);
   },
   success: (e, t) => r.__create("success", e, t),
   default: (e, t) => r.__create("default", e, t),
@@ -66,6 +65,6 @@ const v = c(35), g = c(30), x = c(10), N = c("animate__flipOutX"), u = c(0), w =
   danger: (e, t) => r.__create("danger", e, t)
 };
 export {
-  S as __activeCloseMessage,
+  B as __activeCloseMessage,
   r as pxMessage
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pxcube-ui",
-  "version": "0.2.2",
+  "version": "0.2.3",
   "description": "Pixel Cube UI 组件库",
   "type": "commonjs",
   "main": "./pixel-ui/index.js",
@@ -28,8 +28,5 @@
   ],
   "peerDependencies": {
     "vue": ">=3.5.0"
-  },
-  "dependencies": {
-    "animate.css": "^4.1.1"
   }
 }

package/pixel-ui/version.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e="0.2.2",t="2026-09-20";exports.updateDate=t;exports.version=e;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e="0.2.3",t="2026-09-20";exports.updateDate=t;exports.version=e;

package/pixel-ui/version.mjs

@@ -1,4 +1,4 @@
-const t = "0.2.2", e = "2026-09-20";
+const t = "0.2.3", e = "2026-09-20";
 export {
   e as updateDate,
   t as version

package/styles/components/message.css

@@ -94,11 +94,6 @@
   animation: slideOutToTopElastic 0.45s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
 }
 
-.px-message-animate-exit {
-  animation: bounce;
-  animation-duration: 0.45s;
-}
-
 @keyframes slideOutToTopElastic {
   0% {
     opacity: 1;