{"$schema":"https://ui.shadcn.com/schema/registry-item.json","name":"core-particles","type":"registry:ui","title":"Particles","description":"Tailark core particles component","dependencies":["@tsparticles/engine","@tsparticles/react","@tsparticles/slim"],"files":[{"path":"core/ui/particles.tsx","type":"registry:ui","target":"@ui/particles.tsx","content":"'use client'\nimport { useEffect, useState } from 'react'\nimport Particles, { initParticlesEngine } from '@tsparticles/react'\nimport { type Container, type ISourceOptions, MoveDirection } from '@tsparticles/engine'\nimport { loadSlim } from '@tsparticles/slim'\n\nconst particlesOptions: ISourceOptions = {\n background: {\n color: {\n value: 'transparent',\n },\n },\n fullScreen: {\n enable: false,\n zIndex: 10,\n },\n fpsLimit: 120,\n interactivity: {\n events: {\n onClick: {\n enable: true,\n mode: 'push',\n },\n onHover: {\n enable: false,\n mode: 'repulse',\n },\n resize: { enable: true },\n },\n modes: {\n push: {\n quantity: 4,\n },\n repulse: {\n distance: 200,\n duration: 0.4,\n },\n },\n },\n particles: {\n bounce: {\n horizontal: {\n value: 1,\n },\n vertical: {\n value: 1,\n },\n },\n collisions: {\n absorb: {\n speed: 2,\n },\n bounce: {\n horizontal: {\n value: 1,\n },\n vertical: {\n value: 1,\n },\n },\n enable: false,\n maxSpeed: 50,\n mode: 'bounce',\n overlap: {\n enable: true,\n retries: 0,\n },\n },\n color: {\n value: '#ffffff',\n animation: {\n h: {\n count: 0,\n enable: false,\n speed: 1,\n decay: 0,\n delay: 0,\n sync: true,\n offset: 0,\n },\n s: {\n count: 0,\n enable: false,\n speed: 1,\n decay: 0,\n delay: 0,\n sync: true,\n offset: 0,\n },\n l: {\n count: 0,\n enable: false,\n speed: 1,\n decay: 0,\n delay: 0,\n sync: true,\n offset: 0,\n },\n },\n },\n effect: {\n close: true,\n fill: true,\n options: {},\n type: undefined,\n },\n groups: {},\n move: {\n angle: {\n offset: 0,\n value: 90,\n },\n attract: {\n distance: 200,\n enable: false,\n rotate: {\n x: 3000,\n y: 3000,\n },\n },\n center: {\n x: 50,\n y: 50,\n mode: 'percent',\n radius: 0,\n },\n decay: 0,\n distance: {},\n direction: MoveDirection.none, // Set move direction to right\n drift: 0,\n enable: true,\n gravity: {\n acceleration: 9.81,\n enable: false,\n inverse: false,\n maxSpeed: 50,\n },\n path: {\n clamp: true,\n delay: {\n value: 0,\n },\n enable: false,\n options: {},\n },\n outModes: {\n default: 'out',\n },\n random: false,\n size: false,\n speed: {\n min: 0.1,\n max: 1,\n },\n spin: {\n acceleration: 0,\n enable: false,\n },\n straight: false,\n trail: {\n enable: false,\n length: 10,\n fill: {},\n },\n vibrate: false,\n warp: false,\n },\n number: {\n density: {\n enable: true,\n width: 400,\n height: 400,\n },\n limit: {\n mode: 'delete',\n value: 0,\n },\n value: 120,\n },\n opacity: {\n value: {\n min: 0.1,\n max: 1,\n },\n animation: {\n count: 0,\n enable: true,\n speed: 4,\n decay: 0,\n delay: 0,\n sync: false,\n mode: 'auto',\n startValue: 'random',\n destroy: 'none',\n },\n },\n reduceDuplicates: false,\n shadow: {\n blur: 0,\n color: {\n value: '#000',\n },\n enable: false,\n offset: {\n x: 0,\n y: 0,\n },\n },\n shape: {\n close: true,\n fill: true,\n options: {},\n type: 'circle',\n },\n size: {\n value: {\n min: 0.25,\n max: 1.5,\n },\n animation: {\n count: 0,\n enable: false,\n speed: 5,\n decay: 0,\n delay: 0,\n sync: false,\n mode: 'auto',\n startValue: 'random',\n destroy: 'none',\n },\n },\n stroke: {\n width: 0.25,\n },\n zIndex: {\n value: 0,\n opacityRate: 1,\n sizeRate: 1,\n velocityRate: 1,\n },\n destroy: {\n bounds: {},\n mode: 'none',\n split: {\n count: 1,\n factor: {\n value: 3,\n },\n rate: {\n value: {\n min: 4,\n max: 9,\n },\n },\n sizeOffset: true,\n },\n },\n roll: {\n darken: {\n enable: false,\n value: 0,\n },\n enable: false,\n enlighten: {\n enable: false,\n value: 0,\n },\n mode: 'vertical',\n speed: 25,\n },\n tilt: {\n value: 0,\n animation: {\n enable: false,\n speed: 0,\n decay: 0,\n sync: false,\n },\n direction: 'clockwise',\n enable: false,\n },\n twinkle: {\n lines: {\n enable: false,\n frequency: 0.05,\n opacity: 1,\n },\n particles: {\n enable: false,\n frequency: 0.05,\n opacity: 1,\n },\n },\n wobble: {\n distance: 5,\n enable: false,\n speed: {\n angle: 50,\n move: 10,\n },\n },\n life: {\n count: 0,\n delay: {\n value: 0,\n sync: false,\n },\n duration: {\n value: 0,\n sync: false,\n },\n },\n rotate: {\n value: 0,\n animation: {\n enable: false,\n speed: 0,\n decay: 0,\n sync: false,\n },\n direction: 'clockwise',\n path: false,\n },\n orbit: {\n animation: {\n count: 0,\n enable: false,\n speed: 1,\n decay: 0,\n delay: 0,\n sync: false,\n },\n enable: false,\n opacity: 1,\n rotation: {\n value: 45,\n },\n width: 1,\n },\n links: {\n blink: false,\n color: {\n value: '#ffffff',\n },\n consent: false,\n distance: 80,\n enable: true,\n frequency: 1,\n opacity: 0.4,\n shadow: {\n blur: 5,\n color: {\n value: '#000',\n },\n enable: false,\n },\n triangles: {\n enable: false,\n frequency: 1,\n },\n width: 0.5,\n warp: false,\n maxConnections: 2,\n },\n repulse: {\n value: 0,\n enabled: false,\n distance: 1,\n duration: 1,\n factor: 1,\n speed: 1,\n },\n },\n detectRetina: true,\n}\n\n\nconst particlesLoaded = async (container?: Container): Promise => {\n console.log(container)\n}\n\nexport const LightDarkParticles = ({ id }: { id: string }) => {\n const [init, setInit] = useState(true)\n\n useEffect(() => {\n initParticlesEngine(async (engine) => {\n await loadSlim(engine)\n }).then(() => {\n setInit(true)\n })\n }, [])\n\n if (init) {\n return (\n \n )\n }\n\n return <>\n}\n"}]}