real-time-gradient 1.0.0 → 1.0.2

package/README.md

@@ -176,56 +176,69 @@ gradient.triggerEffect({ hue: "gold", duration: 2000 });
 
 ```ts
 // index.d.ts
-declare module "real-time-gradient" {
-  type GradientType = "linear" | "radial";
+export type GradientType = "linear" | "radial";
 
-  type HuePreset = "white" | "black" | "gold" | "silver" | string;
-  // string allows custom hex codes "#RRGGBB"
+export type HuePreset = "white" | "black" | "gold" | "silver" | string;
 
-  interface ScheduleEntry {
-    time: string; // "HH:MM" in 24h format
-    colors: string[]; // array of CSS color values
-    type?: GradientType;
-    direction?: string;
+export interface ScheduleEntry {
+  time: string;
+  colors: string[];
+}
+
+export interface GradientOptions {
+  type?: GradientType;
+  direction?: string;
+  colors?: string[];
+  transitionDuration?: number;
+  schedule?: ScheduleEntry[];
+  textClip?: boolean;
+}
+
+export interface EffectOptions {
+  applyColors?: string[];
+  duration?: number;
+  hue?: HuePreset;
+}
+
+export class DynamicGradient {
+  private container: HTMLElement;
+  private options: GradientOptions;
+
+  constructor(container: string | HTMLElement, options: GradientOptions = {}) {
+    this.container =
+      typeof container === "string"
+        ? (document.querySelector(container) as HTMLElement)
+        : container;
+
+    this.options = options;
+  }
+
+  static init(container: string | HTMLElement, options?: GradientOptions) {
+    return new DynamicGradient(container, options);
   }
 
-  interface GradientOptions {
+  setGradient(options: {
+    colors: string[];
     type?: GradientType;
     direction?: string;
-    colors?: string[];
-    transitionDuration?: number;
-    schedule?: ScheduleEntry[];
-    textClip?: boolean;
+  }): void {
+    // implementation
   }
 
-  interface EffectOptions {
-    applyColors?: string[];
-    duration?: number;
-    hue?: HuePreset;
+  schedule(entries: ScheduleEntry[]): void {
+    // implementation
   }
 
-  export class DynamicGradient {
-    constructor(container: string | HTMLElement, options?: GradientOptions);
-
-    static init(
-      container: string | HTMLElement,
-      options?: GradientOptions
-    ): DynamicGradient;
-
-    setGradient(options: {
-      colors: string[];
-      type?: GradientType;
-      direction?: string;
-    }): void;
-
-    schedule(entries: ScheduleEntry[]): void;
-
-    triggerEffect(options?: EffectOptions): void;
+  triggerEffect(options?: EffectOptions): void {
+    // implementation
+  }
 
-    persistEffect(colors: string[], duration?: number): void;
+  persistEffect(colors: string[], duration?: number): void {
+    // implementation
+  }
 
-    stopEffects(): void;
-    destroy(): void;
+  stopEffects(): void {
+    // implementation
   }
 }
 ```

package/dist/index.d.ts

@@ -1 +1,25 @@
-export {}
+export type GradientType = "linear" | "radial";
+export interface ScheduleEntry {
+    time: string;
+    colors: string[];
+    type?: GradientType;
+    direction?: string;
+}
+export interface GradientOptions {
+    type?: GradientType;
+    direction?: string;
+    colors?: string[];
+    transitionDuration?: number;
+    schedule?: ScheduleEntry[];
+    textClip?: boolean;
+}
+export interface EffectOptions {
+    applyColors?: string[];
+    duration?: number;
+    hue?: "white" | "black" | "gold" | "silver" | string;
+    loop?: boolean;
+}
+export declare const DynamicGradient: {
+    new (container: string | HTMLElement, options?: GradientOptions): any;
+    init(container: string | HTMLElement, options?: GradientOptions): any;
+};

package/dist/index.es.js

@@ -16,7 +16,7 @@ function f(n, e, t) {
     transition: `opacity ${t}ms ease-in-out`
   }), n.appendChild(i), i;
 }
-function m(n, e, t) {
+function v(n, e, t) {
   const i = document.createElement("span");
   i.textContent = n.textContent, Object.assign(i.style, {
     position: "absolute",
@@ -36,21 +36,21 @@ function m(n, e, t) {
     zIndex: 20
   });
   const s = n.parentNode;
-  getComputedStyle(s).position === "static" && (s.style.position = "relative"), s.appendChild(i), requestAnimationFrame(() => {
+  return getComputedStyle(s).position === "static" && (s.style.position = "relative"), s.appendChild(i), requestAnimationFrame(() => {
     i.style.opacity = "1";
-  });
+  }), i;
 }
 function b(n, e) {
   if (n.__dgTextFx && n.__dgTextFx.duration !== e) {
-    const { a, b: o } = n.__dgTextFx;
-    return a.style.transition = o.style.transition = `opacity ${e}ms ease-in-out`, n.__dgTextFx.duration = e, n.__dgTextFx;
+    const { a: o, b: a } = n.__dgTextFx;
+    return o.style.transition = a.style.transition = `opacity ${e}ms ease-in-out`, n.__dgTextFx.duration = e, n.__dgTextFx;
   }
   if (n.__dgTextFx) return n.__dgTextFx;
   const t = n.parentNode;
   getComputedStyle(t).position === "static" && (t.style.position = "relative");
-  const i = (a) => {
-    const o = document.createElement("span");
-    return o.textContent = n.textContent, Object.assign(o.style, {
+  const i = (o) => {
+    const a = document.createElement("span");
+    return a.textContent = n.textContent, Object.assign(a.style, {
       position: "absolute",
       top: 0,
       left: 0,
@@ -64,9 +64,9 @@ function b(n, e) {
       pointerEvents: "none",
       opacity: "0",
       willChange: "opacity",
-      zIndex: a,
+      zIndex: o,
       transition: `opacity ${e}ms ease-in-out`
-    }), t.appendChild(o), o;
+    }), t.appendChild(a), a;
   }, s = i(20), r = i(21);
   return n.__dgTextFx = { a: s, b: r, visible: null, duration: e }, n.__dgTextFx;
 }
@@ -89,7 +89,7 @@ const p = {
   gold: "#ffe864ff",
   silver: "#d4d4d4ff"
 };
-class g {
+let I = class g {
   constructor(e, t = {}) {
     if (this.container = typeof e == "string" ? document.querySelector(e) : e, !this.container)
       throw new Error("DynamicGradient: container not found.");
@@ -97,27 +97,20 @@ class g {
   }
   /** Apply gradient with optional transition */
   applyGradient(e = this.colors, t = this.type, i = this.direction, s = !0) {
-    const r = c(e, t, i), a = this.container.style.background;
-    if (r !== a) {
-      if (this.textClip) {
-        const o = m(
-          this.container,
-          r,
-          this.duration
-        );
-        this.container.style.background = o, this.container.style.fontWeight = "inherit";
-      } else
-        s ? (this.transitionOverlay && this.transitionOverlay.remove(), this.transitionOverlay = f(
-          this.container,
-          r,
-          this.transitionDuration
-        ), requestAnimationFrame(() => {
-          this.transitionOverlay.style.opacity = "1";
-        }), setTimeout(() => {
-          this.container.style.background = r, this.transitionOverlay.remove(), this.transitionOverlay = null;
-        }, this.transitionDuration)) : this.container.style.background = r;
-      this.colors = e, this.type = t, this.direction = i;
-    }
+    const r = c(e, t, i), o = this.container.style.background;
+    r !== o && (this.textClip ? (v(
+      this.container,
+      r,
+      this.transitionDuration
+    ), this.container.style.fontWeight = "inherit") : s ? (this.transitionOverlay && this.transitionOverlay.remove(), this.transitionOverlay = f(
+      this.container,
+      r,
+      this.transitionDuration
+    ), requestAnimationFrame(() => {
+      this.transitionOverlay.style.opacity = "1";
+    }), setTimeout(() => {
+      this.container.style.background = r, this.transitionOverlay.remove(), this.transitionOverlay = null;
+    }, this.transitionDuration)) : this.container.style.background = r, this.colors = e, this.type = t, this.direction = i);
   }
   /** Allow toggling text-clip dynamically */
   setTextClip(e = !0) {
@@ -132,10 +125,10 @@ class g {
   } = {}) {
     let r;
     p[s] ? r = p[s] : /^#([0-9A-F]{3}){1,2}$/i.test(s) ? r = s : r = "#ffffff";
-    const a = e ? c(e, this.type, this.direction) : c([...this.colors, r], this.type, this.direction);
+    const o = e ? c(e, this.type, this.direction) : c([...this.colors, r], this.type, this.direction);
     if (this.textClip) {
       const y = b(this.container, t), d = () => {
-        const { a: h, b: v, visible: x } = y, l = x === "a" ? v : h, T = e ? c(e, this.type, this.direction) : c(
+        const { a: h, b: m, visible: x } = y, l = x === "a" ? m : h, T = e ? c(e, this.type, this.direction) : c(
           [...this.colors, p[s] || r],
           this.type,
           this.direction
@@ -152,7 +145,7 @@ class g {
             this.type,
             this.direction,
             !1
-          ), h.style.opacity = "0", v.style.opacity = "0";
+          ), h.style.opacity = "0", m.style.opacity = "0";
         }, t * 2);
       };
       d();
@@ -160,16 +153,16 @@ class g {
     }
     this.effectOverlay || (this.effectOverlay = f(
       this.container,
-      a,
+      o,
       t
     ));
-    const o = this.effectOverlay, u = () => {
-      o.style.background = a, o.style.opacity = "1", setTimeout(() => {
-        o.style.opacity = "0";
+    const a = this.effectOverlay, u = () => {
+      a.style.background = o, a.style.opacity = "1", setTimeout(() => {
+        a.style.opacity = "0";
       }, t);
     };
     this.effectRunning || (this.effectRunning = !0, u(), i ? (this.effectLoopInterval && clearInterval(this.effectLoopInterval), this.effectLoopInterval = setInterval(u, t * 2)) : setTimeout(() => {
-      o.remove(), this.effectOverlay = null;
+      a.remove(), this.effectOverlay = null;
     }, t * 2));
   }
   persistEffect(e = this.colors, t = this.transitionDuration) {
@@ -179,7 +172,7 @@ class g {
       this.direction
     );
     if (this.textClip) {
-      const s = m(
+      const s = v(
         this.container,
         i,
         t
@@ -206,8 +199,8 @@ class g {
     this.stopEffects(), this.currentInterval && (clearInterval(this.currentInterval), this.currentInterval = null), this.transitionOverlay && (this.transitionOverlay.remove(), this.transitionOverlay = null), this.effectOverlay && (this.effectOverlay.remove(), this.effectOverlay = null);
   }
   setGradient({ colors: e, type: t, direction: i }) {
-    const s = e || this.colors, r = t || this.type, a = i || this.direction;
-    s.join(",") === this.colors.join(",") && r === this.type && a === this.direction || this.applyGradient(s, r, a, !0);
+    const s = e || this.colors, r = t || this.type, o = i || this.direction;
+    s.join(",") === this.colors.join(",") && r === this.type && o === this.direction || this.applyGradient(s, r, o, !0);
   }
   schedule(e = []) {
     this.scheduleData = e.map((t) => ({
@@ -225,7 +218,8 @@ class g {
   static init(e, t) {
     return new g(e, t);
   }
-}
+};
+const O = I;
 export {
-  g as DynamicGradient
+  O as DynamicGradient
 };

package/dist/index.umd.js

@@ -1 +1 @@
-(function(h,l){typeof exports=="object"&&typeof module<"u"?l(exports):typeof define=="function"&&define.amd?define(["exports"],l):(h=typeof globalThis<"u"?globalThis:h||self,l(h.RealTimeGradient={}))})(this,function(h){"use strict";function l(n,e="linear",t="to right"){return e==="linear"?`linear-gradient(${t}, ${n.join(",")})`:`radial-gradient(circle, ${n.join(",")})`}function f(n,e,t){const i=document.createElement("div");return Object.assign(i.style,{position:"absolute",top:0,left:0,width:"100%",height:"100%",pointerEvents:"none",zIndex:0,background:e,opacity:"0",transition:`opacity ${t}ms ease-in-out`}),n.appendChild(i),i}function d(n,e,t){const i=document.createElement("span");i.textContent=n.textContent,Object.assign(i.style,{position:"absolute",top:0,left:0,width:"100%",height:"100%",display:"inline-block",background:e,WebkitBackgroundClip:"text",backgroundClip:"text",WebkitTextFillColor:"transparent",color:"transparent",pointerEvents:"none",opacity:"0",transition:`opacity ${t}ms ease-in-out`,zIndex:20});const s=n.parentNode;getComputedStyle(s).position==="static"&&(s.style.position="relative"),s.appendChild(i),requestAnimationFrame(()=>{i.style.opacity="1"})}function T(n,e){if(n.__dgTextFx&&n.__dgTextFx.duration!==e){const{a,b:o}=n.__dgTextFx;return a.style.transition=o.style.transition=`opacity ${e}ms ease-in-out`,n.__dgTextFx.duration=e,n.__dgTextFx}if(n.__dgTextFx)return n.__dgTextFx;const t=n.parentNode;getComputedStyle(t).position==="static"&&(t.style.position="relative");const i=a=>{const o=document.createElement("span");return o.textContent=n.textContent,Object.assign(o.style,{position:"absolute",top:0,left:0,width:"100%",height:"100%",display:"inline-block",WebkitBackgroundClip:"text",backgroundClip:"text",WebkitTextFillColor:"transparent",color:"transparent",pointerEvents:"none",opacity:"0",willChange:"opacity",zIndex:a,transition:`opacity ${e}ms ease-in-out`}),t.appendChild(o),o},s=i(20),r=i(21);return n.__dgTextFx={a:s,b:r,visible:null,duration:e},n.__dgTextFx}function b(){const n=new Date;return`${String(n.getHours()).padStart(2,"0")}:${String(n.getMinutes()).padStart(2,"0")}`}function k(n,e){if(!n.length)return null;let t=n[0];for(let i=0;i<n.length;i++)e>=n[i].time&&(t=n[i]);return e<n[0].time&&(t=n[n.length-1]),t}const u={white:"#ffffff",black:"#000000",gold:"#ffe864ff",silver:"#d4d4d4ff"};class p{constructor(e,t={}){if(this.container=typeof e=="string"?document.querySelector(e):e,!this.container)throw new Error("DynamicGradient: container not found.");this.type=t.type||"linear",this.direction=t.direction||"to right",this.colors=t.colors||["#1e3c72","#2a5298"],this.transitionDuration=t.transitionDuration??1500,this.textClip=t.textClip||!1,this.scheduleData=t.schedule||[],this.currentInterval=null,this.lastAppliedKey=null,this.container.style.position=this.container.style.position||"relative",this.applyGradient(this.colors,this.type,this.direction,!1),this.scheduleData.length>0&&this.schedule(this.scheduleData)}applyGradient(e=this.colors,t=this.type,i=this.direction,s=!0){const r=l(e,t,i),a=this.container.style.background;if(r!==a){if(this.textClip){const o=d(this.container,r,this.duration);this.container.style.background=o,this.container.style.fontWeight="inherit"}else s?(this.transitionOverlay&&this.transitionOverlay.remove(),this.transitionOverlay=f(this.container,r,this.transitionDuration),requestAnimationFrame(()=>{this.transitionOverlay.style.opacity="1"}),setTimeout(()=>{this.container.style.background=r,this.transitionOverlay.remove(),this.transitionOverlay=null},this.transitionDuration)):this.container.style.background=r;this.colors=e,this.type=t,this.direction=i}}setTextClip(e=!0){this.textClip=e,this.applyGradient(this.colors,this.type,this.direction,!1)}triggerEffect({applyColors:e=null,duration:t=this.transitionDuration,loop:i=!0,hue:s="white"}={}){let r;u[s]?r=u[s]:/^#([0-9A-F]{3}){1,2}$/i.test(s)?r=s:r="#ffffff";const a=e?l(e,this.type,this.direction):l([...this.colors,r],this.type,this.direction);if(this.textClip){const v=T(this.container,t),g=()=>{const{a:y,b:x,visible:C}=v,c=C==="a"?x:y,O=e?l(e,this.type,this.direction):l([...this.colors,u[s]||r],this.type,this.direction);c.style.background=O,c.style.backgroundClip="text",c.style.transition=`opacity ${t}ms ease-in-out`,c.style.opacity="0",requestAnimationFrame(()=>{requestAnimationFrame(()=>{c.style.opacity="1"})}),setTimeout(()=>{c.style.opacity="0"},t),v.visible=c===y?"a":"b",i?(this.effectLoopTimeout&&clearTimeout(this.effectLoopTimeout),this.effectLoopTimeout=setTimeout(g,t*2)):setTimeout(()=>{this.applyGradient(e||this.colors,this.type,this.direction,!1),y.style.opacity="0",x.style.opacity="0"},t*2)};g();return}this.effectOverlay||(this.effectOverlay=f(this.container,a,t));const o=this.effectOverlay,m=()=>{o.style.background=a,o.style.opacity="1",setTimeout(()=>{o.style.opacity="0"},t)};this.effectRunning||(this.effectRunning=!0,m(),i?(this.effectLoopInterval&&clearInterval(this.effectLoopInterval),this.effectLoopInterval=setInterval(m,t*2)):setTimeout(()=>{o.remove(),this.effectOverlay=null},t*2))}persistEffect(e=this.colors,t=this.transitionDuration){const i=l(e,this.type,this.direction);if(this.textClip){const s=d(this.container,i,t);requestAnimationFrame(()=>{s.style.opacity="1"}),setTimeout(()=>{this.applyGradient(e,this.type,this.direction,!1)},t)}else{const s=f(this.container,i,t);requestAnimationFrame(()=>{s.style.opacity="1"}),setTimeout(()=>{this.applyGradient(e,this.type,this.direction,!1),s.remove()},t)}}stopEffects(){this.effectLoopInterval&&(clearInterval(this.effectLoopInterval),this.effectLoopInterval=null),this.effectLoopTimeout&&(clearTimeout(this.effectLoopTimeout),this.effectLoopTimeout=null),this.effectRunning=!1}destroy(){this.stopEffects(),this.currentInterval&&(clearInterval(this.currentInterval),this.currentInterval=null),this.transitionOverlay&&(this.transitionOverlay.remove(),this.transitionOverlay=null),this.effectOverlay&&(this.effectOverlay.remove(),this.effectOverlay=null)}setGradient({colors:e,type:t,direction:i}){const s=e||this.colors,r=t||this.type,a=i||this.direction;s.join(",")===this.colors.join(",")&&r===this.type&&a===this.direction||this.applyGradient(s,r,a,!0)}schedule(e=[]){this.scheduleData=e.map(t=>({...t,time:t.time.padStart(5,"0")})).sort((t,i)=>t.time.localeCompare(i.time)),this.currentInterval&&clearInterval(this.currentInterval),this.checkSchedule(),this.currentInterval=setInterval(()=>this.checkSchedule(),60*1e3)}checkSchedule(){const e=b(),t=k(this.scheduleData,e);if(t){const i=`${t.time}-${t.colors.join(",")}`;i!==this.lastAppliedKey&&(this.setGradient(t),this.lastAppliedKey=i)}}static init(e,t){return new p(e,t)}}h.DynamicGradient=p,Object.defineProperty(h,Symbol.toStringTag,{value:"Module"})});
+(function(h,l){typeof exports=="object"&&typeof module<"u"?l(exports):typeof define=="function"&&define.amd?define(["exports"],l):(h=typeof globalThis<"u"?globalThis:h||self,l(h.RealTimeGradient={}))})(this,function(h){"use strict";function l(n,e="linear",t="to right"){return e==="linear"?`linear-gradient(${t}, ${n.join(",")})`:`radial-gradient(circle, ${n.join(",")})`}function f(n,e,t){const i=document.createElement("div");return Object.assign(i.style,{position:"absolute",top:0,left:0,width:"100%",height:"100%",pointerEvents:"none",zIndex:0,background:e,opacity:"0",transition:`opacity ${t}ms ease-in-out`}),n.appendChild(i),i}function y(n,e,t){const i=document.createElement("span");i.textContent=n.textContent,Object.assign(i.style,{position:"absolute",top:0,left:0,width:"100%",height:"100%",display:"inline-block",background:e,WebkitBackgroundClip:"text",backgroundClip:"text",WebkitTextFillColor:"transparent",color:"transparent",pointerEvents:"none",opacity:"0",transition:`opacity ${t}ms ease-in-out`,zIndex:20});const s=n.parentNode;return getComputedStyle(s).position==="static"&&(s.style.position="relative"),s.appendChild(i),requestAnimationFrame(()=>{i.style.opacity="1"}),i}function T(n,e){if(n.__dgTextFx&&n.__dgTextFx.duration!==e){const{a:o,b:a}=n.__dgTextFx;return o.style.transition=a.style.transition=`opacity ${e}ms ease-in-out`,n.__dgTextFx.duration=e,n.__dgTextFx}if(n.__dgTextFx)return n.__dgTextFx;const t=n.parentNode;getComputedStyle(t).position==="static"&&(t.style.position="relative");const i=o=>{const a=document.createElement("span");return a.textContent=n.textContent,Object.assign(a.style,{position:"absolute",top:0,left:0,width:"100%",height:"100%",display:"inline-block",WebkitBackgroundClip:"text",backgroundClip:"text",WebkitTextFillColor:"transparent",color:"transparent",pointerEvents:"none",opacity:"0",willChange:"opacity",zIndex:o,transition:`opacity ${e}ms ease-in-out`}),t.appendChild(a),a},s=i(20),r=i(21);return n.__dgTextFx={a:s,b:r,visible:null,duration:e},n.__dgTextFx}function b(){const n=new Date;return`${String(n.getHours()).padStart(2,"0")}:${String(n.getMinutes()).padStart(2,"0")}`}function k(n,e){if(!n.length)return null;let t=n[0];for(let i=0;i<n.length;i++)e>=n[i].time&&(t=n[i]);return e<n[0].time&&(t=n[n.length-1]),t}const u={white:"#ffffff",black:"#000000",gold:"#ffe864ff",silver:"#d4d4d4ff"},C=class x{constructor(e,t={}){if(this.container=typeof e=="string"?document.querySelector(e):e,!this.container)throw new Error("DynamicGradient: container not found.");this.type=t.type||"linear",this.direction=t.direction||"to right",this.colors=t.colors||["#1e3c72","#2a5298"],this.transitionDuration=t.transitionDuration??1500,this.textClip=t.textClip||!1,this.scheduleData=t.schedule||[],this.currentInterval=null,this.lastAppliedKey=null,this.container.style.position=this.container.style.position||"relative",this.applyGradient(this.colors,this.type,this.direction,!1),this.scheduleData.length>0&&this.schedule(this.scheduleData)}applyGradient(e=this.colors,t=this.type,i=this.direction,s=!0){const r=l(e,t,i),o=this.container.style.background;r!==o&&(this.textClip?(y(this.container,r,this.transitionDuration),this.container.style.fontWeight="inherit"):s?(this.transitionOverlay&&this.transitionOverlay.remove(),this.transitionOverlay=f(this.container,r,this.transitionDuration),requestAnimationFrame(()=>{this.transitionOverlay.style.opacity="1"}),setTimeout(()=>{this.container.style.background=r,this.transitionOverlay.remove(),this.transitionOverlay=null},this.transitionDuration)):this.container.style.background=r,this.colors=e,this.type=t,this.direction=i)}setTextClip(e=!0){this.textClip=e,this.applyGradient(this.colors,this.type,this.direction,!1)}triggerEffect({applyColors:e=null,duration:t=this.transitionDuration,loop:i=!0,hue:s="white"}={}){let r;u[s]?r=u[s]:/^#([0-9A-F]{3}){1,2}$/i.test(s)?r=s:r="#ffffff";const o=e?l(e,this.type,this.direction):l([...this.colors,r],this.type,this.direction);if(this.textClip){const m=T(this.container,t),v=()=>{const{a:p,b:g,visible:O}=m,c=O==="a"?g:p,I=e?l(e,this.type,this.direction):l([...this.colors,u[s]||r],this.type,this.direction);c.style.background=I,c.style.backgroundClip="text",c.style.transition=`opacity ${t}ms ease-in-out`,c.style.opacity="0",requestAnimationFrame(()=>{requestAnimationFrame(()=>{c.style.opacity="1"})}),setTimeout(()=>{c.style.opacity="0"},t),m.visible=c===p?"a":"b",i?(this.effectLoopTimeout&&clearTimeout(this.effectLoopTimeout),this.effectLoopTimeout=setTimeout(v,t*2)):setTimeout(()=>{this.applyGradient(e||this.colors,this.type,this.direction,!1),p.style.opacity="0",g.style.opacity="0"},t*2)};v();return}this.effectOverlay||(this.effectOverlay=f(this.container,o,t));const a=this.effectOverlay,d=()=>{a.style.background=o,a.style.opacity="1",setTimeout(()=>{a.style.opacity="0"},t)};this.effectRunning||(this.effectRunning=!0,d(),i?(this.effectLoopInterval&&clearInterval(this.effectLoopInterval),this.effectLoopInterval=setInterval(d,t*2)):setTimeout(()=>{a.remove(),this.effectOverlay=null},t*2))}persistEffect(e=this.colors,t=this.transitionDuration){const i=l(e,this.type,this.direction);if(this.textClip){const s=y(this.container,i,t);requestAnimationFrame(()=>{s.style.opacity="1"}),setTimeout(()=>{this.applyGradient(e,this.type,this.direction,!1)},t)}else{const s=f(this.container,i,t);requestAnimationFrame(()=>{s.style.opacity="1"}),setTimeout(()=>{this.applyGradient(e,this.type,this.direction,!1),s.remove()},t)}}stopEffects(){this.effectLoopInterval&&(clearInterval(this.effectLoopInterval),this.effectLoopInterval=null),this.effectLoopTimeout&&(clearTimeout(this.effectLoopTimeout),this.effectLoopTimeout=null),this.effectRunning=!1}destroy(){this.stopEffects(),this.currentInterval&&(clearInterval(this.currentInterval),this.currentInterval=null),this.transitionOverlay&&(this.transitionOverlay.remove(),this.transitionOverlay=null),this.effectOverlay&&(this.effectOverlay.remove(),this.effectOverlay=null)}setGradient({colors:e,type:t,direction:i}){const s=e||this.colors,r=t||this.type,o=i||this.direction;s.join(",")===this.colors.join(",")&&r===this.type&&o===this.direction||this.applyGradient(s,r,o,!0)}schedule(e=[]){this.scheduleData=e.map(t=>({...t,time:t.time.padStart(5,"0")})).sort((t,i)=>t.time.localeCompare(i.time)),this.currentInterval&&clearInterval(this.currentInterval),this.checkSchedule(),this.currentInterval=setInterval(()=>this.checkSchedule(),60*1e3)}checkSchedule(){const e=b(),t=k(this.scheduleData,e);if(t){const i=`${t.time}-${t.colors.join(",")}`;i!==this.lastAppliedKey&&(this.setGradient(t),this.lastAppliedKey=i)}}static init(e,t){return new x(e,t)}};h.DynamicGradient=C,Object.defineProperty(h,Symbol.toStringTag,{value:"Module"})});

package/package.json

@@ -1,10 +1,17 @@
 {
   "name": "real-time-gradient",
-  "version": "1.0.0",
+  "version": "1.0.2",
   "description": "A Dynamic Gradient background library.",
   "main": "dist/index.umd.js",
   "module": "dist/index.es.js",
   "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "import": "./dist/index.es.js",
+      "require": "./dist/index.umd.js",
+      "types": "./dist/index.d.ts"
+    }
+  },
   "scripts": {
     "build": "vite build"
   },