{"_id":"@b4uti4gd/tslash","_rev":"2-9b019a337a4d3a6ef83332b2e915a32a","name":"@b4uti4gd/tslash","dist-tags":{"latest":"1.0.1"},"versions":{"1.0.0":{"name":"@b4uti4gd/tslash","version":"1.0.0","author":{"name":"b4uti4gd"},"_id":"@b4uti4gd/tslash@1.0.0","maintainers":[{"name":"b4uti4gd","email":"bautielcyerborgshitpost@gmail.com"}],"dist":{"shasum":"58d11dc07bb97f4890052476feffd90deabd2da8","tarball":"https://registry.npmjs.org/@b4uti4gd/tslash/-/tslash-1.0.0.tgz","fileCount":6,"integrity":"sha512-QcB67RJePhUhDzTaoC9odGuGsRDDla4QoHoNbm3fQ/MdRMojuVJLZdY669HSfCdYoQDzUsRR6JGOQ7h4A9S2Yw==","signatures":[{"sig":"MEYCIQC3M2Ce32JOaNT0CvxD01I37xNGhWrLd7RHpke0mk547wIhAPVAa0PwP2elW5kMt/hMYpCl6+6OxEgibT6d0sT64THP","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":52158},"main":"tslash.tsx","types":"./dist/tslash.d.ts","unpkg":"./dist/tslash.global.js","gitHead":"7216ad6b21f7892a019fcdc56488fdaddfe20f33","scripts":{"dev":"tsup tslash.tsx --format iife --global-name tslash --watch","build":"tsup tslash.tsx --format iife --global-name tslash --minify --dts-resolve"},"_npmUser":{"name":"b4uti4gd","email":"bautielcyerborgshitpost@gmail.com"},"_npmVersion":"11.6.2","description":"A high-performance library to use HTML & JS like Flash","directories":{},"_nodeVersion":"25.2.1","dependencies":{"@chenglou/pretext":"^0.0.4"},"_hasShrinkwrap":false,"devDependencies":{"tsx":"^4.21.0","tsup":"^8.5.1","typescript":"^6.0.2"},"_npmOperationalInternal":{"tmp":"tmp/tslash_1.0.0_1775192835631_0.6315129563535968","host":"s3://npm-registry-packages-npm-production"}},"1.0.1":{"name":"@b4uti4gd/tslash","author":{"name":"b4uti4gd"},"version":"1.0.1","description":"A high-performance library to use HTML & JS like Flash","main":"tslash.tsx","types":"./dist/tslash.d.ts","unpkg":"./dist/tslash.global.js","scripts":{"dev":"tsup tslash.tsx --format iife --global-name tslash --watch","build":"tsup tslash.tsx --format iife --global-name tslash --minify --dts-resolve"},"devDependencies":{"tsup":"^8.5.1","tsx":"^4.21.0","typescript":"^6.0.2"},"dependencies":{"@chenglou/pretext":"^0.0.4"},"gitHead":"17738d26f0d8d54420489ee411460644d52c75c0","_id":"@b4uti4gd/tslash@1.0.1","_nodeVersion":"25.2.1","_npmVersion":"11.6.2","dist":{"integrity":"sha512-JeIrMP+Vwv3wzWpQcJWLb+FN8xCoz29Rtwa0t/86GtZsnmTTk3wWmoYfZ7QsUEhqHLlKgaGmQWifj96d7LnVuw==","shasum":"3c518486b60654e763899906a4d8e09191042b3b","tarball":"https://registry.npmjs.org/@b4uti4gd/tslash/-/tslash-1.0.1.tgz","fileCount":6,"unpackedSize":46870,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEQCIDInJcIFaz6ktdwiiUgpy/NzlR6BuNdGNqSbyu51CK/yAiBuX07As0g2WGuzFX4ePBlwLPCMckOmWu9MUSGUwOYohQ=="}]},"_npmUser":{"name":"b4uti4gd","email":"bautielcyerborgshitpost@gmail.com"},"directories":{},"maintainers":[{"name":"b4uti4gd","email":"bautielcyerborgshitpost@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/tslash_1.0.1_1775193384102_0.1715332533130003"},"_hasShrinkwrap":false}},"time":{"created":"2026-04-03T05:07:15.508Z","modified":"2026-04-03T05:16:24.404Z","1.0.0":"2026-04-03T05:07:15.785Z","1.0.1":"2026-04-03T05:16:24.260Z"},"author":{"name":"b4uti4gd"},"description":"A high-performance library to use HTML & JS like Flash","maintainers":[{"name":"b4uti4gd","email":"bautielcyerborgshitpost@gmail.com"}],"readme":"# TSlash ⚡\r\n\r\nA high-performance library to use **HTML & JS like Flash** with modern automatizations.  \r\nBuilt with **TSX**, **Pretext**, **Tsub**, and the power of **TypeScript**.\r\n\r\n---\r\n\r\n## Why TSlash? 🚀\r\n\r\nTSlash isn't just another UI framework; it's a **native visualization engine** that brings the fun of Flash back to the modern web, without the bloat of a Virtual DOM.\r\n\r\n### 1. Zero-Overhead Reactivity\r\nIn modern frameworks, a state change forces a comparison of entire component trees (diffing). In **TSlash**, when you set `sprite.x = 100`, the change goes **straight to the Browser** via native CSS. No middleman, no lag.\r\n\r\n### 2. The Power of \"Living Objects\"\r\nUnlike React, where components are constantly destroyed and recreated, TSlash Sprites and Texts are **persistent instances in memory**.\r\n- **No reference loss:** Your objects stay alive.\r\n- **Persistent Animation:** Motion doesn't snap or reset on \"re-renders\".\r\n- **Dynamic Hierarchy:** Use `.append()` to move objects between containers seamlessly.\r\n\r\n### 3. Native DOM Inheritance\r\nEvery `Sprite` **is** a `HTMLDivElement` and every `Text` **is** a `HTMLSpanElement`.\r\n- Use your favorite tools: Browser Inspector, external CSS, and native ~~AS3~~ JS events.\r\n- 100% compatible with third-party libraries (Tailwind, GSAP, etc.).\r\n\r\n### 4. The Missing Flash API on HTML5\r\nHTML5 elements are static by nature. TSlash fills that gap by injecting the missing high-level manipulation API directly into the DOM:\r\n- **Transformations:** `x`, `y`, `rotation`, `scaleX`, `scaleY`, `skewX`, `skewY`.\r\n- **Real-time Filters:** `hue`, `saturation`, `brightness`, `contrast`.\r\n- **Smart Typography:** `BetterText` uses the Pretext JS engine to ensure fluid text doesn't tank performance.\r\n\r\n### 5. Native DOM DisplayList\r\nTSlash doesn't reinvent the DisplayList; it **unlocks** the one already built into your browser. By turning native DIVs into persistent Flash-like objects, you get the performance of the DOM with the mental model of ActionScript.\r\n\r\n---\r\n\r\n\r\n## Examples:\r\n\r\n### Normal Version\r\n```html\r\n<script src=\"https://unpkg.com/@b4uti4gd/tslash@1.0.0/dist/tslash.global.js\"></script>\r\n<script>\r\n        const { Sprite, BetterText } = window.tslash;\r\n\r\n        // 1. El Contenedor (Padre)\r\n        const contenedor = new Sprite();\r\n        contenedor.x = 100;\r\n        contenedor.y = 100;\r\n        contenedor.style.border = \"1px solid rgba(255,255,255,0.2)\";\r\n        document.body.append(contenedor);\r\n\r\n        // 2. BetterText con Pretext (Hijo)\r\n        const textoLargo = \"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.\";\r\n        const etiqueta = new BetterText(\"\"); \r\n        etiqueta.x = 20;\r\n        etiqueta.y = 20;\r\n        etiqueta.width = 300; // El ancho que activará el reflow de Pretext\r\n        etiqueta.style.color = \"#000000ff\";\r\n        etiqueta.style.fontFamily = \"Arial, sans-serif\";\r\n\r\n        contenedor.append(etiqueta);\r\n\r\n        // 3. Lógica de Typewriter + Yoyo\r\n        let charIndex = 0;\r\n        let isDeleting = false;\r\n\r\n        setInterval(() => {\r\n            // Si estamos escribiendo, sumamos 1 letra. Si borramos, restamos.\r\n            if (!isDeleting) {\r\n                charIndex++;\r\n                if (charIndex > textoLargo.length) isDeleting = true;\r\n            } else {\r\n                charIndex--;\r\n                if (charIndex === 0) isDeleting = false;\r\n            }\r\n\r\n            // Actualizamos el .text (BetterText ejecutará el layout rápido de Pretext)\r\n            etiqueta.text = textoLargo.substring(0, charIndex);\r\n\r\n            // Animación suave del padre para ver que el texto no \"tiembla\"\r\n            contenedor.x += 0.5;\r\n            contenedor.rotation += 0.2;\r\n        }, 50); // Velocidad de la máquina de escribir\r\n\r\n</script>\r\n```","readmeFilename":"README.md"}