@majapisoftwares/ui 4.3.16 → 5.0.0

package/components/Notifications/index.jsx

@@ -1,6 +0,0 @@
-import Notifications from "./Notifications";
-export * from "./Notifications";
-export default Notifications;
-// noinspection JSUnusedGlobalSymbols
-export { default as notificationsState } from "./notifications.state";
-export * from "./notifications.state";

package/components/Notifications/notifications.state.d.ts

@@ -1,24 +0,0 @@
-import { type StringValue } from "ms";
-import type { CSSProperties, ReactElement, ReactNode } from "react";
-type Notification = {
-    _id: string;
-    message: string | ReactElement;
-    title?: string;
-    timeout?: number | StringValue;
-    icon?: "success" | "error" | ReactElement;
-    dismissable?: boolean;
-    actions?: ReactNode;
-    suppress?: boolean;
-    style?: CSSProperties;
-    className?: string;
-};
-declare const notificationsState: {
-    rendered: boolean;
-    setRendered(rendered: boolean): void;
-    notifications: Notification[];
-    add({ _id, dismissable, timeout, ...notification }: Pick<Partial<Notification>, "_id"> & Omit<Notification, "_id">): void;
-    remove(_id: string): void;
-};
-export declare function showNotification(notification: string | (Pick<Partial<Notification>, "_id"> & Omit<Notification, "_id">)): void;
-export declare function removeNotification(_id: string): void;
-export default notificationsState;

package/components/Notifications/notifications.state.js

@@ -1,41 +0,0 @@
-import { proxy, ref } from "valtio";
-import isomorphicObjectId from "@majapisoftwares/next/utils/isomorphicObjectId";
-import ms, {} from "ms";
-const notificationsState = proxy({
-    rendered: false,
-    setRendered(rendered) {
-        notificationsState.rendered = rendered;
-    },
-    notifications: [],
-    add({ _id = isomorphicObjectId().toString(), dismissable = true, timeout, ...notification }) {
-        if (!notificationsState.rendered) {
-            console.error("<Notifications /> is not rendered. The notification will be ignored.");
-        }
-        notificationsState.notifications.push(ref({
-            ...notification,
-            dismissable,
-            _id,
-        }));
-        if (timeout) {
-            setTimeout(() => {
-                notificationsState.remove(_id);
-            }, typeof timeout !== "number" ? ms(timeout) : timeout);
-        }
-    },
-    remove(_id) {
-        notificationsState.notifications.splice(notificationsState.notifications.findIndex((n) => n._id === _id), 1);
-    },
-});
-export function showNotification(notification) {
-    const notificationObject = typeof notification === "string" ? { message: notification } : notification;
-    if (notificationObject.suppress &&
-        notificationsState.notifications.find((n) => n.message === notificationObject.message &&
-            n.title === notificationObject.title)) {
-        return;
-    }
-    notificationsState.add(notificationObject);
-}
-export function removeNotification(_id) {
-    notificationsState.remove(_id);
-}
-export default notificationsState;

package/components/Orb/Orb.d.ts

@@ -1,8 +0,0 @@
-interface OrbProps {
-    hue?: number;
-    hoverIntensity?: number;
-    rotateOnHover?: boolean;
-    forceHoverState?: boolean;
-}
-export default function Orb({ hue, hoverIntensity, rotateOnHover, forceHoverState, }: OrbProps): import("react").JSX.Element;
-export {};

package/components/Orb/Orb.jsx

@@ -1,258 +0,0 @@
-import { useEffect, useRef } from "react";
-import { Mesh, Program, Renderer, Triangle, Vec3 } from "ogl";
-export default function Orb({ hue = 0, hoverIntensity = 0.2, rotateOnHover = true, forceHoverState = false, }) {
-    const ctnDom = useRef(null);
-    const vert = /* glsl */ `
-    precision highp float;
-    attribute vec2 position;
-    attribute vec2 uv;
-    varying vec2 vUv;
-    void main() {
-      vUv = uv;
-      gl_Position = vec4(position, 0.0, 1.0);
-    }
-  `;
-    const frag = /* glsl */ `
-    precision highp float;
-
-    uniform float iTime;
-    uniform vec3 iResolution;
-    uniform float hue;
-    uniform float hover;
-    uniform float rot;
-    uniform float hoverIntensity;
-    varying vec2 vUv;
-
-    vec3 rgb2yiq(vec3 c) {
-      float y = dot(c, vec3(0.299, 0.587, 0.114));
-      float i = dot(c, vec3(0.596, -0.274, -0.322));
-      float q = dot(c, vec3(0.211, -0.523, 0.312));
-      return vec3(y, i, q);
-    }
-    
-    vec3 yiq2rgb(vec3 c) {
-      float r = c.x + 0.956 * c.y + 0.621 * c.z;
-      float g = c.x - 0.272 * c.y - 0.647 * c.z;
-      float b = c.x - 1.106 * c.y + 1.703 * c.z;
-      return vec3(r, g, b);
-    }
-    
-    vec3 adjustHue(vec3 color, float hueDeg) {
-      float hueRad = hueDeg * 3.14159265 / 180.0;
-      vec3 yiq = rgb2yiq(color);
-      float cosA = cos(hueRad);
-      float sinA = sin(hueRad);
-      float i = yiq.y * cosA - yiq.z * sinA;
-      float q = yiq.y * sinA + yiq.z * cosA;
-      yiq.y = i;
-      yiq.z = q;
-      return yiq2rgb(yiq);
-    }
-    
-    vec3 hash33(vec3 p3) {
-      p3 = fract(p3 * vec3(0.1031, 0.11369, 0.13787));
-      p3 += dot(p3, p3.yxz + 19.19);
-      return -1.0 + 2.0 * fract(vec3(
-        p3.x + p3.y,
-        p3.x + p3.z,
-        p3.y + p3.z
-      ) * p3.zyx);
-    }
-    
-    float snoise3(vec3 p) {
-      const float K1 = 0.333333333;
-      const float K2 = 0.166666667;
-      vec3 i = floor(p + (p.x + p.y + p.z) * K1);
-      vec3 d0 = p - (i - (i.x + i.y + i.z) * K2);
-      vec3 e = step(vec3(0.0), d0 - d0.yzx);
-      vec3 i1 = e * (1.0 - e.zxy);
-      vec3 i2 = 1.0 - e.zxy * (1.0 - e);
-      vec3 d1 = d0 - (i1 - K2);
-      vec3 d2 = d0 - (i2 - K1);
-      vec3 d3 = d0 - 0.5;
-      vec4 h = max(0.6 - vec4(
-        dot(d0, d0),
-        dot(d1, d1),
-        dot(d2, d2),
-        dot(d3, d3)
-      ), 0.0);
-      vec4 n = h * h * h * h * vec4(
-        dot(d0, hash33(i)),
-        dot(d1, hash33(i + i1)),
-        dot(d2, hash33(i + i2)),
-        dot(d3, hash33(i + 1.0))
-      );
-      return dot(vec4(31.316), n);
-    }
-    
-    vec4 extractAlpha(vec3 colorIn) {
-      float a = max(max(colorIn.r, colorIn.g), colorIn.b);
-      return vec4(colorIn.rgb / (a + 1e-5), a);
-    }
-    
-    const vec3 baseColor1 = vec3(0.611765, 0.262745, 0.996078);
-    const vec3 baseColor2 = vec3(0.298039, 0.760784, 0.913725);
-    const vec3 baseColor3 = vec3(0.062745, 0.078431, 0.600000);
-    const float innerRadius = 0.6;
-    const float noiseScale = 0.65;
-    
-    float light1(float intensity, float attenuation, float dist) {
-      return intensity / (1.0 + dist * attenuation);
-    }
-    
-    float light2(float intensity, float attenuation, float dist) {
-      return intensity / (1.0 + dist * dist * attenuation);
-    }
-    
-    vec4 draw(vec2 uv) {
-      vec3 color1 = adjustHue(baseColor1, hue);
-      vec3 color2 = adjustHue(baseColor2, hue);
-      vec3 color3 = adjustHue(baseColor3, hue);
-      
-      float ang = atan(uv.y, uv.x);
-      float len = length(uv);
-      float invLen = len > 0.0 ? 1.0 / len : 0.0;
-      
-      float n0 = snoise3(vec3(uv * noiseScale, iTime * 0.5)) * 0.5 + 0.5;
-      float r0 = mix(mix(innerRadius, 1.0, 0.4), mix(innerRadius, 1.0, 0.6), n0);
-      float d0 = distance(uv, (r0 * invLen) * uv);
-      float v0 = light1(1.0, 10.0, d0);
-      v0 *= smoothstep(r0 * 1.05, r0, len);
-      float cl = cos(ang + iTime * 2.0) * 0.5 + 0.5;
-      
-      float a = iTime * -1.0;
-      vec2 pos = vec2(cos(a), sin(a)) * r0;
-      float d = distance(uv, pos);
-      float v1 = light2(1.5, 5.0, d);
-      v1 *= light1(1.0, 50.0, d0);
-      
-      float v2 = smoothstep(1.0, mix(innerRadius, 1.0, n0 * 0.5), len);
-      float v3 = smoothstep(innerRadius, mix(innerRadius, 1.0, 0.5), len);
-      
-      vec3 col = mix(color1, color2, cl);
-      col = mix(color3, col, v0);
-      col = (col + v1) * v2 * v3;
-      col = clamp(col, 0.0, 1.0);
-      
-      return extractAlpha(col);
-    }
-    
-    vec4 mainImage(vec2 fragCoord) {
-      vec2 center = iResolution.xy * 0.5;
-      float size = min(iResolution.x, iResolution.y);
-      vec2 uv = (fragCoord - center) / size * 2.0;
-      
-      float angle = rot;
-      float s = sin(angle);
-      float c = cos(angle);
-      uv = vec2(c * uv.x - s * uv.y, s * uv.x + c * uv.y);
-      
-      uv.x += hover * hoverIntensity * 0.1 * sin(uv.y * 10.0 + iTime);
-      uv.y += hover * hoverIntensity * 0.1 * sin(uv.x * 10.0 + iTime);
-      
-      return draw(uv);
-    }
-    
-    void main() {
-      vec2 fragCoord = vUv * iResolution.xy;
-      vec4 col = mainImage(fragCoord);
-      gl_FragColor = vec4(col.rgb * col.a, col.a);
-    }
-  `;
-    useEffect(() => {
-        const container = ctnDom.current;
-        if (!container)
-            return;
-        const renderer = new Renderer({ alpha: true, premultipliedAlpha: false });
-        const gl = renderer.gl;
-        gl.clearColor(0, 0, 0, 0);
-        container.appendChild(gl.canvas);
-        const geometry = new Triangle(gl);
-        const program = new Program(gl, {
-            vertex: vert,
-            fragment: frag,
-            uniforms: {
-                iTime: { value: 0 },
-                iResolution: {
-                    value: new Vec3(gl.canvas.width, gl.canvas.height, gl.canvas.width / gl.canvas.height),
-                },
-                hue: { value: hue },
-                hover: { value: 0 },
-                rot: { value: 0 },
-                hoverIntensity: { value: hoverIntensity },
-            },
-        });
-        const mesh = new Mesh(gl, { geometry, program });
-        function resize() {
-            if (!container)
-                return;
-            const dpr = window.devicePixelRatio || 1;
-            const width = container.clientWidth;
-            const height = container.clientHeight;
-            renderer.setSize(width * dpr, height * dpr);
-            gl.canvas.style.width = width + "px";
-            gl.canvas.style.height = height + "px";
-            program.uniforms.iResolution.value.set(gl.canvas.width, gl.canvas.height, gl.canvas.width / gl.canvas.height);
-        }
-        window.addEventListener("resize", resize);
-        resize();
-        let targetHover = 0;
-        let lastTime = 0;
-        let currentRot = 0;
-        const rotationSpeed = 0.3; // radians per second
-        const handleMouseMove = (e) => {
-            const rect = container.getBoundingClientRect();
-            const x = e.clientX - rect.left;
-            const y = e.clientY - rect.top;
-            const width = rect.width;
-            const height = rect.height;
-            const size = Math.min(width, height);
-            const centerX = width / 2;
-            const centerY = height / 2;
-            const uvX = ((x - centerX) / size) * 2.0;
-            const uvY = ((y - centerY) / size) * 2.0;
-            if (Math.sqrt(uvX * uvX + uvY * uvY) < 0.8) {
-                targetHover = 1;
-            }
-            else {
-                targetHover = 0;
-            }
-        };
-        const handleMouseLeave = () => {
-            targetHover = 0;
-        };
-        if (hoverIntensity) {
-            container.addEventListener("mousemove", handleMouseMove);
-            container.addEventListener("mouseleave", handleMouseLeave);
-        }
-        let rafId;
-        const update = (t) => {
-            rafId = requestAnimationFrame(update);
-            const dt = (t - lastTime) * 0.001;
-            lastTime = t;
-            program.uniforms.iTime.value = t * 0.001;
-            program.uniforms.hue.value = hue;
-            program.uniforms.hoverIntensity.value = hoverIntensity;
-            const effectiveHover = forceHoverState ? 1 : targetHover;
-            program.uniforms.hover.value +=
-                (effectiveHover - program.uniforms.hover.value) * 0.1;
-            if (rotateOnHover && effectiveHover > 0.5) {
-                currentRot += dt * rotationSpeed;
-            }
-            program.uniforms.rot.value = currentRot;
-            renderer.render({ scene: mesh });
-        };
-        rafId = requestAnimationFrame(update);
-        return () => {
-            cancelAnimationFrame(rafId);
-            window.removeEventListener("resize", resize);
-            if (hoverIntensity) {
-                container.removeEventListener("mousemove", handleMouseMove);
-                container.removeEventListener("mouseleave", handleMouseLeave);
-            }
-            container.removeChild(gl.canvas);
-            gl.getExtension("WEBGL_lose_context")?.loseContext();
-        };
-    }, [hue, hoverIntensity, rotateOnHover, forceHoverState, vert, frag]);
-    return <div ref={ctnDom} className="h-full w-full"/>;
-}

package/components/Orb/index.d.ts

@@ -1,3 +0,0 @@
-import Orb from "./Orb";
-export * from "./Orb";
-export default Orb;

package/components/Orb/index.jsx

@@ -1,3 +0,0 @@
-import Orb from "./Orb";
-export * from "./Orb";
-export default Orb;

package/components/Pagination/Pagination.d.ts

@@ -1,13 +0,0 @@
-export interface PaginationProps {
-    totalItems?: number;
-    itemsPerPage?: number;
-    currentPage: number;
-    onChangePage?: (page: number) => void;
-    className?: string;
-    pageHref?: (page: number) => string;
-    paginationText?: string;
-    previousText?: string;
-    nextText?: string;
-    pagesToClickAmount?: number;
-}
-export default function Pagination({ totalItems, itemsPerPage, currentPage, onChangePage, className, pageHref, paginationText, previousText, nextText, pagesToClickAmount, }: PaginationProps): import("react").JSX.Element;

package/components/Pagination/Pagination.jsx

@@ -1,64 +0,0 @@
-import { ChevronLeftIcon, ChevronRightIcon } from "@heroicons/react/20/solid";
-import { useCallback, useEffect, useMemo, useState, } from "react";
-import clsx from "../../utils/clsx";
-import { range } from "lodash-es";
-import UnstyledButton from "../Button/UnstyledButton";
-export default function Pagination({ totalItems, itemsPerPage, currentPage, onChangePage, className, pageHref, paginationText = "Pagination", previousText = "Previous", nextText = "Next", pagesToClickAmount = 7, }) {
-    const [page, setPage] = useState(currentPage);
-    useEffect(() => {
-        if (page !== currentPage) {
-            setPage(currentPage);
-        }
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [currentPage]);
-    useEffect(() => {
-        if (onChangePage) {
-            onChangePage(page);
-        }
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [page]);
-    const [previousTotalItems, setPreviousTotalItems] = useState(totalItems || 0);
-    useEffect(() => {
-        if (totalItems !== undefined) {
-            setPreviousTotalItems(totalItems);
-        }
-    }, [totalItems]);
-    const pageCount = itemsPerPage !== undefined
-        ? Math.ceil(previousTotalItems / itemsPerPage) || 1
-        : 0;
-    const pages = useMemo(() => {
-        if (pageCount < pagesToClickAmount) {
-            return range(1, pageCount + 1);
-        }
-        if (page < pagesToClickAmount - 2) {
-            return [...range(1, pagesToClickAmount - 1), "...1", pageCount];
-        }
-        if (page > pageCount - (pagesToClickAmount - 3)) {
-            return [
-                1,
-                "...1",
-                ...range(pageCount - (pagesToClickAmount - 3), pageCount + 1),
-            ];
-        }
-        return [1, "...1", page - 1, page, page + 1, "...2", pageCount];
-    }, [page, pageCount, pagesToClickAmount]);
-    const handlePageClick = useCallback((page) => (e) => {
-        e.preventDefault();
-        setPage(page);
-    }, []);
-    return (<nav className={clsx("ui-pagination", className)} aria-label={paginationText}>
-      <UnstyledButton disabled={page === 1} onClick={handlePageClick(page - 1)} href={page !== 1 && pageHref ? pageHref(page - 1) : undefined}>
-        <span className="sr-only">{previousText}</span>
-        <ChevronLeftIcon className="h-5 w-5" aria-hidden="true"/>
-      </UnstyledButton>
-      {pages.map((p) => typeof p === "number" ? (<UnstyledButton key={p} onClick={handlePageClick(p)} data-active={page === p ? "" : undefined} href={pageHref ? pageHref(p) : undefined}>
-            {p}
-          </UnstyledButton>) : (<button key={p} disabled>
-            ...
-          </button>))}
-      <UnstyledButton disabled={page === pageCount} onClick={handlePageClick(page + 1)} href={page !== pageCount && pageHref ? pageHref(page + 1) : undefined}>
-        <span className="sr-only">{nextText}</span>
-        <ChevronRightIcon className="h-5 w-5" aria-hidden="true"/>
-      </UnstyledButton>
-    </nav>);
-}

package/components/Pagination/index.d.ts

@@ -1,3 +0,0 @@
-import Pagination from "./Pagination";
-export * from "./Pagination";
-export default Pagination;

package/components/Pagination/index.jsx

@@ -1,3 +0,0 @@
-import Pagination from "./Pagination";
-export * from "./Pagination";
-export default Pagination;

package/components/Particles/Particles.d.ts

@@ -1,18 +0,0 @@
-import React from "react";
-interface ParticlesProps {
-    particleCount?: number;
-    particleSpread?: number;
-    speed?: number;
-    particleColors?: string[];
-    moveParticlesOnHover?: boolean;
-    particleHoverFactor?: number;
-    alphaParticles?: boolean;
-    particleBaseSize?: number;
-    sizeRandomness?: number;
-    cameraDistance?: number;
-    disableRotation?: boolean;
-    className?: string;
-    useWindowMouseMove?: boolean;
-}
-declare const Particles: React.FC<ParticlesProps>;
-export default Particles;

package/components/Particles/Particles.jsx

@@ -1,205 +0,0 @@
-import React, { useEffect, useRef } from "react";
-import { Camera, Geometry, Mesh, Program, Renderer } from "ogl";
-const defaultColors = ["#ffffff", "#ffffff", "#ffffff"];
-const hexToRgb = (hex) => {
-    hex = hex.replace(/^#/, "");
-    if (hex.length === 3) {
-        hex = hex
-            .split("")
-            .map((c) => c + c)
-            .join("");
-    }
-    const int = parseInt(hex, 16);
-    const r = ((int >> 16) & 255) / 255;
-    const g = ((int >> 8) & 255) / 255;
-    const b = (int & 255) / 255;
-    return [r, g, b];
-};
-const vertex = /* glsl */ `
-  attribute vec3 position;
-  attribute vec4 random;
-  attribute vec3 color;
-  
-  uniform mat4 modelMatrix;
-  uniform mat4 viewMatrix;
-  uniform mat4 projectionMatrix;
-  uniform float uTime;
-  uniform float uSpread;
-  uniform float uBaseSize;
-  uniform float uSizeRandomness;
-  
-  varying vec4 vRandom;
-  varying vec3 vColor;
-  
-  void main() {
-    vRandom = random;
-    vColor = color;
-    
-    vec3 pos = position * uSpread;
-    pos.z *= 10.0;
-    
-    vec4 mPos = modelMatrix * vec4(pos, 1.0);
-    float t = uTime;
-    mPos.x += sin(t * random.z + 6.28 * random.w) * mix(0.1, 1.5, random.x);
-    mPos.y += sin(t * random.y + 6.28 * random.x) * mix(0.1, 1.5, random.w);
-    mPos.z += sin(t * random.w + 6.28 * random.y) * mix(0.1, 1.5, random.z);
-    
-    vec4 mvPos = viewMatrix * mPos;
-    gl_PointSize = (uBaseSize * (1.0 + uSizeRandomness * (random.x - 0.5))) / length(mvPos.xyz);
-    gl_Position = projectionMatrix * mvPos;
-  }
-`;
-const fragment = /* glsl */ `
-  precision highp float;
-  
-  uniform float uTime;
-  uniform float uAlphaParticles;
-  varying vec4 vRandom;
-  varying vec3 vColor;
-  
-  void main() {
-    vec2 uv = gl_PointCoord.xy;
-    float d = length(uv - vec2(0.5));
-    
-    if(uAlphaParticles < 0.5) {
-      if(d > 0.5) {
-        discard;
-      }
-      gl_FragColor = vec4(vColor + 0.2 * sin(uv.yxx + uTime + vRandom.y * 6.28), 1.0);
-    } else {
-      float circle = smoothstep(0.5, 0.4, d) * 0.8;
-      gl_FragColor = vec4(vColor + 0.2 * sin(uv.yxx + uTime + vRandom.y * 6.28), circle);
-    }
-  }
-`;
-const Particles = ({ particleCount = 200, particleSpread = 10, speed = 0.1, particleColors, moveParticlesOnHover = false, particleHoverFactor = 1, alphaParticles = false, particleBaseSize = 100, sizeRandomness = 1, cameraDistance = 20, disableRotation = false, className, useWindowMouseMove = false, }) => {
-    const containerRef = useRef(null);
-    const mouseRef = useRef({ x: 0, y: 0 });
-    useEffect(() => {
-        const container = containerRef.current;
-        if (!container)
-            return;
-        const renderer = new Renderer({ depth: false, alpha: true });
-        const gl = renderer.gl;
-        container.appendChild(gl.canvas);
-        gl.clearColor(0, 0, 0, 0);
-        const camera = new Camera(gl, { fov: 15 });
-        camera.position.set(0, 0, cameraDistance);
-        const resize = () => {
-            const width = container.clientWidth;
-            const height = container.clientHeight;
-            renderer.setSize(width, height);
-            camera.perspective({ aspect: gl.canvas.width / gl.canvas.height });
-        };
-        window.addEventListener("resize", resize, false);
-        resize();
-        const handleMouseMove = (e) => {
-            const rect = container.getBoundingClientRect();
-            const x = ((e.clientX - rect.left) / rect.width) * 2 - 1;
-            const y = -(((e.clientY - rect.top) / rect.height) * 2 - 1);
-            mouseRef.current = { x, y };
-        };
-        if (moveParticlesOnHover) {
-            if (useWindowMouseMove) {
-                window.addEventListener("mousemove", handleMouseMove);
-            }
-            else {
-                container.addEventListener("mousemove", handleMouseMove);
-            }
-        }
-        const count = particleCount;
-        const positions = new Float32Array(count * 3);
-        const randoms = new Float32Array(count * 4);
-        const colors = new Float32Array(count * 3);
-        const palette = particleColors && particleColors.length > 0
-            ? particleColors
-            : defaultColors;
-        for (let i = 0; i < count; i++) {
-            let x, y, z, len;
-            do {
-                x = Math.random() * 2 - 1;
-                y = Math.random() * 2 - 1;
-                z = Math.random() * 2 - 1;
-                len = x * x + y * y + z * z;
-            } while (len > 1 || len === 0);
-            const r = Math.cbrt(Math.random());
-            positions.set([x * r, y * r, z * r], i * 3);
-            randoms.set([Math.random(), Math.random(), Math.random(), Math.random()], i * 4);
-            const col = hexToRgb(palette[Math.floor(Math.random() * palette.length)]);
-            colors.set(col, i * 3);
-        }
-        const geometry = new Geometry(gl, {
-            position: { size: 3, data: positions },
-            random: { size: 4, data: randoms },
-            color: { size: 3, data: colors },
-        });
-        const program = new Program(gl, {
-            vertex,
-            fragment,
-            uniforms: {
-                uTime: { value: 0 },
-                uSpread: { value: particleSpread },
-                uBaseSize: { value: particleBaseSize },
-                uSizeRandomness: { value: sizeRandomness },
-                uAlphaParticles: { value: alphaParticles ? 1 : 0 },
-            },
-            transparent: true,
-            depthTest: false,
-        });
-        const particles = new Mesh(gl, { mode: gl.POINTS, geometry, program });
-        let animationFrameId;
-        let lastTime = performance.now();
-        let elapsed = 0;
-        const update = (t) => {
-            animationFrameId = requestAnimationFrame(update);
-            const delta = t - lastTime;
-            lastTime = t;
-            elapsed += delta * speed;
-            program.uniforms.uTime.value = elapsed * 0.001;
-            if (moveParticlesOnHover) {
-                particles.position.x = -mouseRef.current.x * particleHoverFactor;
-                particles.position.y = -mouseRef.current.y * particleHoverFactor;
-            }
-            else {
-                particles.position.x = 0;
-                particles.position.y = 0;
-            }
-            if (!disableRotation) {
-                particles.rotation.x = Math.sin(elapsed * 0.0002) * 0.1;
-                particles.rotation.y = Math.cos(elapsed * 0.0005) * 0.15;
-                particles.rotation.z += 0.01 * speed;
-            }
-            renderer.render({ scene: particles, camera });
-        };
-        animationFrameId = requestAnimationFrame(update);
-        return () => {
-            window.removeEventListener("resize", resize);
-            if (moveParticlesOnHover) {
-                if (useWindowMouseMove) {
-                    window.removeEventListener("mousemove", handleMouseMove);
-                }
-                else {
-                    container.removeEventListener("mousemove", handleMouseMove);
-                }
-            }
-            cancelAnimationFrame(animationFrameId);
-            if (container.contains(gl.canvas)) {
-                container.removeChild(gl.canvas);
-            }
-        };
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [
-        particleCount,
-        particleSpread,
-        speed,
-        moveParticlesOnHover,
-        particleHoverFactor,
-        alphaParticles,
-        particleBaseSize,
-        sizeRandomness,
-        cameraDistance,
-        disableRotation,
-    ]);
-    return (<div ref={containerRef} className={`relative h-full w-full ${className}`}/>);
-};
-export default Particles;

package/components/Particles/index.d.ts

@@ -1,3 +0,0 @@
-import Particles from "./Particles";
-export * from "./Particles";
-export default Particles;

package/components/Particles/index.jsx

@@ -1,3 +0,0 @@
-import Particles from "./Particles";
-export * from "./Particles";
-export default Particles;