use-scroll-animate 2.1.0 → 2.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (70) hide show
  1. package/CHANGELOG.md +33 -0
  2. package/README.md +31 -2
  3. package/README_ja.md +19 -0
  4. package/README_zh.md +30 -0
  5. package/dist/chunks/base-CJ7XfidP.cjs +233 -0
  6. package/dist/chunks/base-CJ7XfidP.cjs.map +1 -0
  7. package/dist/chunks/base-CuvCgqLy.js +219 -0
  8. package/dist/chunks/base-CuvCgqLy.js.map +1 -0
  9. package/dist/components/background.cjs +395 -0
  10. package/dist/components/background.cjs.map +1 -0
  11. package/dist/components/background.css +7 -0
  12. package/dist/components/background.d.cts +132 -0
  13. package/dist/components/background.d.ts +132 -0
  14. package/dist/components/background.js +387 -0
  15. package/dist/components/background.js.map +1 -0
  16. package/dist/components/feedback.cjs +444 -0
  17. package/dist/components/feedback.cjs.map +1 -0
  18. package/dist/components/feedback.css +7 -0
  19. package/dist/components/feedback.d.cts +170 -0
  20. package/dist/components/feedback.d.ts +170 -0
  21. package/dist/components/feedback.js +434 -0
  22. package/dist/components/feedback.js.map +1 -0
  23. package/dist/components/interaction.cjs +426 -0
  24. package/dist/components/interaction.cjs.map +1 -0
  25. package/dist/components/interaction.css +8 -0
  26. package/dist/components/interaction.d.cts +142 -0
  27. package/dist/components/interaction.d.ts +142 -0
  28. package/dist/components/interaction.js +417 -0
  29. package/dist/components/interaction.js.map +1 -0
  30. package/dist/components/physics.cjs +664 -0
  31. package/dist/components/physics.cjs.map +1 -0
  32. package/dist/components/physics.css +5 -0
  33. package/dist/components/physics.d.cts +216 -0
  34. package/dist/components/physics.d.ts +216 -0
  35. package/dist/components/physics.js +644 -0
  36. package/dist/components/physics.js.map +1 -0
  37. package/dist/components/reveal.cjs +360 -0
  38. package/dist/components/reveal.cjs.map +1 -0
  39. package/dist/components/reveal.css +5 -0
  40. package/dist/components/reveal.d.cts +132 -0
  41. package/dist/components/reveal.d.ts +132 -0
  42. package/dist/components/reveal.js +350 -0
  43. package/dist/components/reveal.js.map +1 -0
  44. package/dist/components/text.cjs +528 -0
  45. package/dist/components/text.cjs.map +1 -0
  46. package/dist/components/text.css +7 -0
  47. package/dist/components/text.d.cts +164 -0
  48. package/dist/components/text.d.ts +164 -0
  49. package/dist/components/text.js +517 -0
  50. package/dist/components/text.js.map +1 -0
  51. package/dist/components/transitions.cjs +546 -0
  52. package/dist/components/transitions.cjs.map +1 -0
  53. package/dist/components/transitions.css +6 -0
  54. package/dist/components/transitions.d.cts +180 -0
  55. package/dist/components/transitions.d.ts +180 -0
  56. package/dist/components/transitions.js +536 -0
  57. package/dist/components/transitions.js.map +1 -0
  58. package/dist/components.cjs +127 -0
  59. package/dist/components.cjs.map +1 -0
  60. package/dist/components.css +33 -0
  61. package/dist/components.d.cts +919 -0
  62. package/dist/components.d.ts +919 -0
  63. package/dist/components.js +65 -0
  64. package/dist/components.js.map +1 -0
  65. package/dist/components.umd.js +22 -0
  66. package/dist/components.umd.js.map +1 -0
  67. package/docs/API.md +2 -0
  68. package/docs/components.md +169 -0
  69. package/docs/windows-apps.md +108 -0
  70. package/package.json +105 -5
@@ -0,0 +1 @@
1
+ {"version":3,"file":"background.cjs","sources":["../../src/components/background/aurora.ts","../../src/components/background/particles.ts","../../src/components/background/grain.ts","../../src/components/background/marquee.ts","../../src/components/background/acrylic.ts","../../src/components/background/index.ts"],"sourcesContent":["import { defineElement, type UsaElement } from '../base';\nimport css from './aurora.css?raw';\n\n/**\n * `<usa-aurora>` — a slow, drifting aurora / gradient-mesh backdrop behind\n * its content. Soft radial gradients moved with `transform` only (no\n * animated blur), paused while off-screen.\n *\n * Attributes: `colors` (comma-separated, default violet / cyan / pink),\n * `speed` (multiplier, 1), `intensity` (0–1 opacity, 0.7), `paused`.\n * Reduced motion: a still gradient.\n */\nexport type UsaAuroraElement = UsaElement;\n\nexport function defineAurora(tag = 'usa-aurora'): CustomElementConstructor | undefined {\n return defineElement(\n tag,\n (Base) =>\n class UsaAurora extends Base {\n static get observedAttributes(): string[] {\n return ['colors', 'speed', 'intensity'];\n }\n\n private _layer: HTMLElement | null = null;\n\n mount(): void {\n if (!this._layer) {\n this._layer = document.createElement('div');\n this._layer.className = 'usa-aurora-layer';\n this._layer.setAttribute('aria-hidden', 'true');\n this._layer.innerHTML = '<i></i><i></i><i></i><i></i>';\n this.prepend(this._layer);\n }\n const colors = this.str('colors', '#7c5cff,#22d3ee,#f472b6,#34d399').split(',').map((c) => c.trim()).filter(Boolean);\n Array.from(this._layer.children).forEach((blob, i) => {\n (blob as HTMLElement).style.setProperty('--c', colors[i % colors.length]);\n });\n const speed = this.num('speed', 1);\n this.style.setProperty('--usa-aurora-speed', `${(18 / Math.max(0.05, speed)).toFixed(2)}s`);\n this.style.setProperty('--usa-aurora-opacity', String(this.num('intensity', 0.7)));\n this.inView((v) => this.toggleAttribute('data-offscreen', !v));\n }\n },\n { id: 'aurora', text: css }\n );\n}\n","import { defineElement, raf, caf, type UsaElement } from '../base';\nimport css from './particles.css?raw';\n\n/**\n * `<usa-particles>` — a canvas of drifting particles, optionally linked by\n * lines when close (a \"constellation\"), that drift away from the pointer.\n * Fills its own box (place it as a background with\n * `position: absolute; inset: 0`, or give it a height).\n *\n * Attributes: `count` (60; scaled down on small boxes), `color`\n * (default `currentColor`), `size` (max radius px, 2.2), `speed` (0.35),\n * `links` (max link distance px, 110; `0` disables), `interactive`,\n * `paused`. Renders only while visible and the tab is shown, at device\n * pixel ratio ≤ 2. Reduced motion: one still frame.\n */\nexport interface UsaParticlesElement extends UsaElement {\n /** Re-seed the particles. */\n reset(): void;\n}\n\ninterface P {\n x: number;\n y: number;\n vx: number;\n vy: number;\n r: number;\n}\n\nexport function defineParticles(tag = 'usa-particles'): CustomElementConstructor | undefined {\n return defineElement(\n tag,\n (Base) =>\n class UsaParticles extends Base {\n static get observedAttributes(): string[] {\n return ['count', 'color', 'size', 'speed', 'links', 'interactive', 'paused'];\n }\n\n private _canvas: HTMLCanvasElement | null = null;\n private _ctx: CanvasRenderingContext2D | null = null;\n private _ps: P[] = [];\n private _frame = 0;\n private _w = 0;\n private _h = 0;\n private _visible = false;\n private _mx = -1e4;\n private _color = '#888';\n private _my = -1e4;\n\n mount(): void {\n if (!this._canvas) {\n this._canvas = document.createElement('canvas');\n this._canvas.setAttribute('aria-hidden', 'true');\n this.prepend(this._canvas);\n }\n this._ctx = this._canvas.getContext?.('2d') ?? null;\n if (!this._ctx) return;\n this.resize();\n if (typeof ResizeObserver !== 'undefined') {\n const ro = new ResizeObserver(() => {\n this.resize();\n if (!this._frame) this.draw();\n });\n ro.observe(this);\n this.onCleanup(() => ro.disconnect());\n }\n this.inView((v) => {\n this._visible = v;\n this.loop();\n });\n this.listen(document, 'visibilitychange', () => this.loop());\n if (this.flag('interactive')) {\n this.listen(window, 'pointermove', (e: PointerEvent) => {\n const r = this.getBoundingClientRect();\n this._mx = e.clientX - r.left;\n this._my = e.clientY - r.top;\n }, { passive: true });\n }\n this.draw();\n }\n\n unmount(): void {\n caf(this._frame);\n this._frame = 0;\n }\n\n reset(): void {\n this._ps = [];\n this.resize();\n this.draw();\n }\n\n private resize(): void {\n const c = this._canvas;\n if (!c || !this._ctx) return;\n const w = this.clientWidth || 300;\n const h = this.clientHeight || 150;\n const dpr = Math.min(2, (typeof devicePixelRatio === 'number' && devicePixelRatio) || 1);\n c.width = Math.round(w * dpr);\n c.height = Math.round(h * dpr);\n this._ctx.setTransform(dpr, 0, 0, dpr, 0, 0);\n this._w = w;\n this._h = h;\n this._color = this.getAttribute('color') || (typeof getComputedStyle === 'function' ? getComputedStyle(this).color : '') || '#888';\n const want = Math.round(Math.min(1, (w * h) / (900 * 500)) * Math.max(1, this.num('count', 60))) || 1;\n const speed = this.num('speed', 0.35);\n const size = this.num('size', 2.2);\n while (this._ps.length < want) {\n const a = Math.random() * Math.PI * 2;\n const s = speed * (0.3 + Math.random() * 0.7);\n this._ps.push({ x: Math.random() * w, y: Math.random() * h, vx: Math.cos(a) * s, vy: Math.sin(a) * s, r: 0.6 + Math.random() * (size - 0.6) });\n }\n this._ps.length = want;\n }\n\n private loop(): void {\n const run = this._visible && !this.reduced && !this.flag('paused') && !(typeof document !== 'undefined' && document.hidden);\n if (run && !this._frame) {\n const tick = () => {\n this.step();\n this.draw();\n this._frame = raf(tick);\n };\n this._frame = raf(tick);\n } else if (!run && this._frame) {\n caf(this._frame);\n this._frame = 0;\n }\n }\n\n private step(): void {\n const { _w: w, _h: h } = this;\n for (const p of this._ps) {\n const dx = p.x - this._mx;\n const dy = p.y - this._my;\n const d2 = dx * dx + dy * dy;\n if (d2 < 8100 && d2 > 0.01) {\n const f = (1 - Math.sqrt(d2) / 90) * 0.6;\n p.x += (dx / Math.sqrt(d2)) * f;\n p.y += (dy / Math.sqrt(d2)) * f;\n }\n p.x += p.vx;\n p.y += p.vy;\n if (p.x < -5) p.x = w + 5;\n else if (p.x > w + 5) p.x = -5;\n if (p.y < -5) p.y = h + 5;\n else if (p.y > h + 5) p.y = -5;\n }\n }\n\n private draw(): void {\n const ctx = this._ctx;\n if (!ctx) return;\n const color = this._color;\n ctx.clearRect(0, 0, this._w, this._h);\n ctx.fillStyle = color;\n ctx.strokeStyle = color;\n const ps = this._ps;\n const link = this.num('links', 110);\n if (link > 0) {\n const l2 = link * link;\n ctx.lineWidth = 0.6;\n for (let i = 0; i < ps.length; i++) {\n for (let j = i + 1; j < ps.length; j++) {\n const dx = ps[i].x - ps[j].x;\n const dy = ps[i].y - ps[j].y;\n const d2 = dx * dx + dy * dy;\n if (d2 < l2) {\n ctx.globalAlpha = (1 - d2 / l2) * 0.35;\n ctx.beginPath();\n ctx.moveTo(ps[i].x, ps[i].y);\n ctx.lineTo(ps[j].x, ps[j].y);\n ctx.stroke();\n }\n }\n }\n }\n ctx.globalAlpha = 0.85;\n for (const p of ps) {\n ctx.beginPath();\n ctx.arc(p.x, p.y, p.r, 0, Math.PI * 2);\n ctx.fill();\n }\n ctx.globalAlpha = 1;\n }\n },\n { id: 'particles', text: css }\n );\n}\n","import { defineElement, type UsaElement } from '../base';\nimport css from './grain.css?raw';\n\n/**\n * `<usa-grain>` — a film-grain / noise overlay on top of its content\n * (SVG `feTurbulence` texture, no images to ship). With `animated`, the\n * grain jitters like film (stepped `transform`, ~12 fps).\n *\n * Attributes: `opacity` (0.12), `animated`, `blend` (`mix-blend-mode`,\n * default `overlay`), `scale` (texture size px, 180). Never intercepts\n * pointer events. Reduced motion: static grain.\n */\nexport type UsaGrainElement = UsaElement;\n\nconst noise = (freq: number) =>\n `url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='256' height='256'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='${freq}' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0.5 0 0 0 0 0.5 0 0 0 0 0.5 0 0 0 1.6 -0.3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E\")`;\n\nexport function defineGrain(tag = 'usa-grain'): CustomElementConstructor | undefined {\n return defineElement(\n tag,\n (Base) =>\n class UsaGrain extends Base {\n static get observedAttributes(): string[] {\n return ['opacity', 'blend', 'scale'];\n }\n\n private _layer: HTMLElement | null = null;\n\n mount(): void {\n if (!this._layer) {\n this._layer = document.createElement('div');\n this._layer.className = 'usa-grain-layer';\n this._layer.setAttribute('aria-hidden', 'true');\n this.append(this._layer);\n }\n const s = this._layer.style;\n s.backgroundImage = noise(0.8);\n s.backgroundSize = `${this.num('scale', 180)}px`;\n s.opacity = String(this.num('opacity', 0.12));\n s.mixBlendMode = this.str('blend', 'overlay');\n }\n },\n { id: 'grain', text: css }\n );\n}\n","import { defineElement, type UsaElement } from '../base';\nimport css from './marquee.css?raw';\n\n/**\n * `<usa-marquee>` — an infinite, seamless ticker of its children (logos,\n * testimonials, tags). The content is cloned (clones are `aria-hidden` and\n * `inert`) and the track slides with one WAAPI `transform` animation whose\n * duration follows the measured width, so the speed is constant.\n *\n * Attributes: `speed` (px/s, 50), `direction` (`left` default | `right` |\n * `up` | `down`), `gap` (px, 32), `pause-on-hover`, `fade` (soft edges),\n * `paused`. Pauses off-screen. Reduced motion: no movement; the row\n * becomes scrollable instead.\n */\nexport interface UsaMarqueeElement extends UsaElement {\n pause(): void;\n resume(): void;\n}\n\nexport function defineMarquee(tag = 'usa-marquee'): CustomElementConstructor | undefined {\n return defineElement(\n tag,\n (Base) =>\n class UsaMarquee extends Base {\n static get observedAttributes(): string[] {\n return ['speed', 'direction', 'gap', 'paused'];\n }\n\n private _track: HTMLElement | null = null;\n private _anim: Animation | null = null;\n private _hover = false;\n private _visible = true;\n private _size = 0;\n\n private get vertical(): boolean {\n const d = this.str('direction', 'left');\n return d === 'up' || d === 'down';\n }\n\n mount(): void {\n if (!this._track) {\n const track = document.createElement('div');\n track.className = 'usa-marquee-track';\n const group = document.createElement('div');\n group.className = 'usa-marquee-group';\n group.append(...Array.from(this.childNodes));\n track.append(group);\n this.append(track);\n this._track = track;\n }\n this.toggleAttribute('data-vertical', this.vertical);\n this.style.setProperty('--usa-marquee-gap', `${this.num('gap', 32)}px`);\n if (this.reduced) {\n this.setAttribute('data-static', '');\n this.syncClones(1);\n return;\n }\n this.removeAttribute('data-static');\n this.build();\n if (typeof ResizeObserver !== 'undefined') {\n const ro = new ResizeObserver(() => this.build());\n ro.observe(this._track.firstElementChild as Element);\n this.onCleanup(() => ro.disconnect());\n }\n this.inView((v) => {\n this._visible = v;\n this.sync();\n });\n this.listen(this, 'pointerenter', () => ((this._hover = true), this.sync()));\n this.listen(this, 'pointerleave', () => ((this._hover = false), this.sync()));\n this.listen(this, 'focusin', () => ((this._hover = true), this.sync()));\n this.listen(this, 'focusout', () => ((this._hover = false), this.sync()));\n }\n\n unmount(): void {\n this._anim?.cancel();\n this._anim = null;\n this._size = 0;\n }\n\n private syncClones(n: number): void {\n const track = this._track!;\n const group = track.firstElementChild as HTMLElement;\n while (track.children.length > n) track.lastElementChild!.remove();\n while (track.children.length < n) {\n const clone = group.cloneNode(true) as HTMLElement;\n clone.setAttribute('aria-hidden', 'true');\n clone.setAttribute('inert', '');\n track.append(clone);\n }\n }\n\n private build(): void {\n const track = this._track!;\n const group = track.firstElementChild as HTMLElement;\n const vertical = this.vertical;\n const gap = this.num('gap', 32);\n const measured = vertical ? group.offsetHeight : group.offsetWidth;\n if (!measured) return; // not laid out yet: the ResizeObserver calls back\n const size = measured + gap;\n if (this._anim && this._size === size) return;\n this._size = size;\n const box = (vertical ? this.clientHeight : this.clientWidth) || size;\n // Enough copies to cover the box twice\n this.syncClones(Math.min(50, Math.max(2, Math.ceil(box / size) + 1)));\n const progress = this._anim?.effect?.getComputedTiming().progress ?? 0;\n this._anim?.cancel();\n const axis = vertical ? 'Y' : 'X';\n const reverse = ['right', 'down'].includes(this.str('direction', 'left'));\n const frames = [{ transform: `translate${axis}(0)` }, { transform: `translate${axis}(${-size}px)` }];\n this._anim = this.motion(track, reverse ? frames.reverse() : frames, {\n duration: (Math.max(1, size) / Math.max(1, this.num('speed', 50))) * 1000,\n iterations: Infinity,\n });\n if (this._anim && progress) this._anim.currentTime = progress * Number(this._anim.effect?.getTiming().duration || 0);\n this.sync();\n }\n\n private sync(): void {\n const a = this._anim;\n if (!a) return;\n const stop = this.flag('paused') || !this._visible || (this._hover && this.flag('pause-on-hover'));\n if (stop && a.playState === 'running') a.pause();\n else if (!stop && a.playState === 'paused') a.play();\n }\n\n pause(): void {\n this.setAttribute('paused', '');\n }\n resume(): void {\n this.removeAttribute('paused');\n }\n\n changed(name: string): void {\n if (name === 'paused') this.sync();\n else super.changed(name);\n }\n },\n { id: 'marquee', text: css }\n );\n}\n","import { defineElement, type UsaElement } from '../base';\nimport css from './acrylic.css?raw';\n\n/**\n * `<usa-acrylic>` — Windows Fluent materials for the web: `acrylic`\n * (frosted glass: backdrop blur + saturation + tint + subtle noise) and\n * `mica` (an opaque, wallpaper-tinted base for app backgrounds; on the web it\n * tints from `--usa-mica-source`, a gradient you control). Optional\n * `shimmer` adds a light sweep when it appears or on hover.\n *\n * Attributes: `variant` (`acrylic` default | `mica`), `tint` (colour),\n * `tint-opacity` (0–1, 0.55), `blur` (px, 30), `shimmer`\n * (`hover` | `load` | `none`, default `none`). Falls back to a solid tint\n * without `backdrop-filter` and under `prefers-reduced-transparency` or\n * forced colours, like Windows does when transparency effects are off.\n */\nexport type UsaAcrylicElement = UsaElement;\n\nexport function defineAcrylic(tag = 'usa-acrylic'): CustomElementConstructor | undefined {\n return defineElement(\n tag,\n (Base) =>\n class UsaAcrylic extends Base {\n static get observedAttributes(): string[] {\n return ['tint', 'tint-opacity', 'blur', 'shimmer'];\n }\n\n mount(): void {\n const tint = this.getAttribute('tint');\n if (tint) this.style.setProperty('--usa-acrylic-tint', tint);\n else this.style.removeProperty('--usa-acrylic-tint');\n this.style.setProperty('--usa-acrylic-opacity', `${Math.round(this.num('tint-opacity', 0.55) * 100)}%`);\n this.style.setProperty('--usa-acrylic-blur', `${this.num('blur', 30)}px`);\n if (this.str('shimmer') === 'load' && !this.reduced) {\n this.removeAttribute('data-shine');\n void this.offsetWidth;\n this.setAttribute('data-shine', '');\n }\n }\n },\n { id: 'acrylic', text: css }\n );\n}\n","/**\n * use-scroll-animate/components/background — backgrounds & decoration.\n * `<usa-aurora>`, `<usa-particles>`, `<usa-grain>`, `<usa-marquee>`,\n * `<usa-acrylic>`.\n */\nimport { defineAurora, type UsaAuroraElement } from './aurora';\nimport { defineParticles, type UsaParticlesElement } from './particles';\nimport { defineGrain, type UsaGrainElement } from './grain';\nimport { defineMarquee, type UsaMarqueeElement } from './marquee';\nimport { defineAcrylic, type UsaAcrylicElement } from './acrylic';\n\nexport { defineAurora, defineParticles, defineGrain, defineMarquee, defineAcrylic };\nexport type { UsaAuroraElement, UsaParticlesElement, UsaGrainElement, UsaMarqueeElement, UsaAcrylicElement };\nexport { configureComponents, prefersReducedMotion } from '../base';\nexport type { ComponentsConfig, UsaElement } from '../base';\n\n/** Register every component of this category under its default tag. */\nexport function defineBackgroundComponents(): void {\n defineAurora();\n defineParticles();\n defineGrain();\n defineMarquee();\n defineAcrylic();\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'usa-aurora': UsaAuroraElement;\n 'usa-particles': UsaParticlesElement;\n 'usa-grain': UsaGrainElement;\n 'usa-marquee': UsaMarqueeElement;\n 'usa-acrylic': UsaAcrylicElement;\n }\n}\n"],"names":["defineElement","css","caf","raf"],"mappings":"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"}
@@ -0,0 +1,7 @@
1
+ /* use-scroll-animate/components/background */
2
+ .usa-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
3
+ usa-acrylic{--usa-acrylic-tint:#f3f3f3;--usa-acrylic-opacity:55%;--usa-acrylic-blur:30px;position:relative;display:block;isolation:isolate;overflow:hidden;background-color:color-mix(in srgb,var(--usa-acrylic-tint) var(--usa-acrylic-opacity),transparent);-webkit-backdrop-filter:blur(var(--usa-acrylic-blur)) saturate(1.6);backdrop-filter:blur(var(--usa-acrylic-blur)) saturate(1.6);border:1px solid color-mix(in srgb,#fff 22%,transparent)}@media (prefers-color-scheme:dark){usa-acrylic{--usa-acrylic-tint:#2c2c2c}}usa-acrylic::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:0.035;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='128' height='128'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}usa-acrylic::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;transform:translateX(-120%);background:linear-gradient(105deg,transparent 30%,rgb(255 255 255 / 0.28) 50%,transparent 70%)}usa-acrylic[shimmer="hover"]:hover::after,usa-acrylic[data-shine]::after{animation:usa-acrylic-shine 1.1s cubic-bezier(0.22,1,0.36,1) both}@keyframes usa-acrylic-shine{from{transform:translateX(-120%)}to{transform:translateX(120%)}}usa-acrylic[variant="mica"]{--usa-acrylic-opacity:80%;-webkit-backdrop-filter:none;backdrop-filter:none;background:linear-gradient(color-mix(in srgb,var(--usa-acrylic-tint) var(--usa-acrylic-opacity),transparent),color-mix(in srgb,var(--usa-acrylic-tint) var(--usa-acrylic-opacity),transparent)),var(--usa-mica-source,linear-gradient(135deg,#b8c6ff,#ffd6e8));border-color:transparent}@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){usa-acrylic{background-color:var(--usa-acrylic-tint)}}@media (prefers-reduced-transparency:reduce){usa-acrylic{background:var(--usa-acrylic-tint);-webkit-backdrop-filter:none;backdrop-filter:none}}@media (forced-colors:active){usa-acrylic{background:Canvas;-webkit-backdrop-filter:none;backdrop-filter:none;border-color:CanvasText}usa-acrylic::before,usa-acrylic::after{display:none}}
4
+ usa-aurora{position:relative;display:block;isolation:isolate;overflow:hidden}usa-aurora .usa-aurora-layer{position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:var(--usa-aurora-opacity,0.7);overflow:hidden;contain:strict}usa-aurora .usa-aurora-layer i{position:absolute;display:block;width:70%;aspect-ratio:1;border-radius:50%;background:radial-gradient(closest-side,var(--c),transparent);will-change:transform;animation:usa-aurora-a var(--usa-aurora-speed,18s) ease-in-out infinite alternate}usa-aurora .usa-aurora-layer i:nth-child(1){left:-15%;top:-30%}usa-aurora .usa-aurora-layer i:nth-child(2){right:-20%;top:-10%;animation-name:usa-aurora-b;animation-duration:calc(var(--usa-aurora-speed,18s) * 1.3)}usa-aurora .usa-aurora-layer i:nth-child(3){left:10%;bottom:-45%;animation-name:usa-aurora-c;animation-duration:calc(var(--usa-aurora-speed,18s) * 0.9)}usa-aurora .usa-aurora-layer i:nth-child(4){right:0;bottom:-30%;width:50%;animation-name:usa-aurora-b;animation-direction:alternate-reverse}usa-aurora[paused] .usa-aurora-layer i,usa-aurora[data-offscreen] .usa-aurora-layer i{animation-play-state:paused}@keyframes usa-aurora-a{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(30%,20%,0) scale(1.25)}}@keyframes usa-aurora-b{from{transform:translate3d(0,0,0) scale(1.1)}to{transform:translate3d(-35%,25%,0) scale(0.85)}}@keyframes usa-aurora-c{from{transform:translate3d(0,0,0) rotate(0deg) scale(1)}to{transform:translate3d(25%,-30%,0) rotate(40deg) scale(1.2)}}@media (prefers-reduced-motion:reduce){usa-aurora .usa-aurora-layer i,usa-grain .usa-grain-layer,usa-acrylic::after{animation:none !important}}
5
+ usa-grain{position:relative;display:block;isolation:isolate;overflow:hidden}usa-grain .usa-grain-layer{position:absolute;inset:-100%;z-index:1;pointer-events:none}usa-grain[animated] .usa-grain-layer{animation:usa-grain 0.8s steps(10) infinite}@keyframes usa-grain{0%,100%{transform:translate(0,0)}10%{transform:translate(-5%,-8%)}20%{transform:translate(-12%,4%)}30%{transform:translate(6%,-16%)}40%{transform:translate(-4%,18%)}50%{transform:translate(-12%,8%)}60%{transform:translate(14%,0)}70%{transform:translate(0,12%)}80%{transform:translate(3%,25%)}90%{transform:translate(-8%,8%)}}
6
+ usa-marquee{--usa-marquee-gap:32px;display:block;overflow:hidden;contain:content}usa-marquee[fade]{-webkit-mask:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);mask:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}usa-marquee[fade][data-vertical]{-webkit-mask:linear-gradient(180deg,transparent,#000 12%,#000 88%,transparent);mask:linear-gradient(180deg,transparent,#000 12%,#000 88%,transparent)}usa-marquee .usa-marquee-track{display:flex;width:max-content;gap:var(--usa-marquee-gap);will-change:transform}usa-marquee .usa-marquee-group{display:flex;flex:none;align-items:center;gap:var(--usa-marquee-gap)}usa-marquee[data-vertical] .usa-marquee-track,usa-marquee[data-vertical] .usa-marquee-group{flex-direction:column;width:auto}usa-marquee[data-vertical]{height:var(--usa-marquee-height,240px)}usa-marquee[data-static]{overflow:auto;scrollbar-width:thin}
7
+ usa-particles{position:relative;display:block;min-height:120px;overflow:hidden}usa-particles>canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
@@ -0,0 +1,132 @@
1
+ /**
2
+ * use-scroll-animate/components — shared base for the `<usa-*>` custom elements.
3
+ *
4
+ * Everything here is lazy: nothing touches `window`, `document`,
5
+ * `HTMLElement` or `matchMedia` at import time, so the components can be
6
+ * imported during SSR (Next, Nuxt, Astro…) and in Electron/Tauri preload
7
+ * scripts. Classes are created the first time a `define*()` function runs.
8
+ */
9
+ interface ComponentsConfig {
10
+ /**
11
+ * Inject each component's CSS when it is defined (default `true`). Uses a
12
+ * constructable stylesheet (`document.adoptedStyleSheets`, which a strict
13
+ * `style-src` CSP does not block) and falls back to a `<style>` tag. Set
14
+ * to `false` when you load `use-scroll-animate/components.css` yourself.
15
+ */
16
+ injectStyles?: boolean;
17
+ /**
18
+ * `'user'` (default) follows `prefers-reduced-motion`; `'reduce'` always
19
+ * uses the reduced variants (e.g. a kiosk / battery-saver mode);
20
+ * `'no-preference'` ignores the OS setting (only for demos — respect your users).
21
+ */
22
+ reducedMotion?: 'user' | 'reduce' | 'no-preference';
23
+ }
24
+ /** Change global component settings (call before `define*()` for `injectStyles`). */
25
+ declare function configureComponents(options: ComponentsConfig): void;
26
+ /** `true` when animations should be reduced (OS setting or `configureComponents`). */
27
+ declare function prefersReducedMotion(): boolean;
28
+ /**
29
+ * Members shared by every `<usa-*>` element. Attribute helpers, a cleanup
30
+ * bag that is emptied on disconnect, and motion helpers that degrade to the
31
+ * final state without WAAPI or under reduced motion.
32
+ */
33
+ interface UsaElement extends HTMLElement {
34
+ /** `true` while reduced motion applies to this element. */
35
+ readonly reduced: boolean;
36
+ }
37
+
38
+ /**
39
+ * `<usa-aurora>` — a slow, drifting aurora / gradient-mesh backdrop behind
40
+ * its content. Soft radial gradients moved with `transform` only (no
41
+ * animated blur), paused while off-screen.
42
+ *
43
+ * Attributes: `colors` (comma-separated, default violet / cyan / pink),
44
+ * `speed` (multiplier, 1), `intensity` (0–1 opacity, 0.7), `paused`.
45
+ * Reduced motion: a still gradient.
46
+ */
47
+ type UsaAuroraElement = UsaElement;
48
+ declare function defineAurora(tag?: string): CustomElementConstructor | undefined;
49
+
50
+ /**
51
+ * `<usa-particles>` — a canvas of drifting particles, optionally linked by
52
+ * lines when close (a "constellation"), that drift away from the pointer.
53
+ * Fills its own box (place it as a background with
54
+ * `position: absolute; inset: 0`, or give it a height).
55
+ *
56
+ * Attributes: `count` (60; scaled down on small boxes), `color`
57
+ * (default `currentColor`), `size` (max radius px, 2.2), `speed` (0.35),
58
+ * `links` (max link distance px, 110; `0` disables), `interactive`,
59
+ * `paused`. Renders only while visible and the tab is shown, at device
60
+ * pixel ratio ≤ 2. Reduced motion: one still frame.
61
+ */
62
+ interface UsaParticlesElement extends UsaElement {
63
+ /** Re-seed the particles. */
64
+ reset(): void;
65
+ }
66
+ declare function defineParticles(tag?: string): CustomElementConstructor | undefined;
67
+
68
+ /**
69
+ * `<usa-grain>` — a film-grain / noise overlay on top of its content
70
+ * (SVG `feTurbulence` texture, no images to ship). With `animated`, the
71
+ * grain jitters like film (stepped `transform`, ~12 fps).
72
+ *
73
+ * Attributes: `opacity` (0.12), `animated`, `blend` (`mix-blend-mode`,
74
+ * default `overlay`), `scale` (texture size px, 180). Never intercepts
75
+ * pointer events. Reduced motion: static grain.
76
+ */
77
+ type UsaGrainElement = UsaElement;
78
+ declare function defineGrain(tag?: string): CustomElementConstructor | undefined;
79
+
80
+ /**
81
+ * `<usa-marquee>` — an infinite, seamless ticker of its children (logos,
82
+ * testimonials, tags). The content is cloned (clones are `aria-hidden` and
83
+ * `inert`) and the track slides with one WAAPI `transform` animation whose
84
+ * duration follows the measured width, so the speed is constant.
85
+ *
86
+ * Attributes: `speed` (px/s, 50), `direction` (`left` default | `right` |
87
+ * `up` | `down`), `gap` (px, 32), `pause-on-hover`, `fade` (soft edges),
88
+ * `paused`. Pauses off-screen. Reduced motion: no movement; the row
89
+ * becomes scrollable instead.
90
+ */
91
+ interface UsaMarqueeElement extends UsaElement {
92
+ pause(): void;
93
+ resume(): void;
94
+ }
95
+ declare function defineMarquee(tag?: string): CustomElementConstructor | undefined;
96
+
97
+ /**
98
+ * `<usa-acrylic>` — Windows Fluent materials for the web: `acrylic`
99
+ * (frosted glass: backdrop blur + saturation + tint + subtle noise) and
100
+ * `mica` (an opaque, wallpaper-tinted base for app backgrounds; on the web it
101
+ * tints from `--usa-mica-source`, a gradient you control). Optional
102
+ * `shimmer` adds a light sweep when it appears or on hover.
103
+ *
104
+ * Attributes: `variant` (`acrylic` default | `mica`), `tint` (colour),
105
+ * `tint-opacity` (0–1, 0.55), `blur` (px, 30), `shimmer`
106
+ * (`hover` | `load` | `none`, default `none`). Falls back to a solid tint
107
+ * without `backdrop-filter` and under `prefers-reduced-transparency` or
108
+ * forced colours, like Windows does when transparency effects are off.
109
+ */
110
+ type UsaAcrylicElement = UsaElement;
111
+ declare function defineAcrylic(tag?: string): CustomElementConstructor | undefined;
112
+
113
+ /**
114
+ * use-scroll-animate/components/background — backgrounds & decoration.
115
+ * `<usa-aurora>`, `<usa-particles>`, `<usa-grain>`, `<usa-marquee>`,
116
+ * `<usa-acrylic>`.
117
+ */
118
+
119
+ /** Register every component of this category under its default tag. */
120
+ declare function defineBackgroundComponents(): void;
121
+ declare global {
122
+ interface HTMLElementTagNameMap {
123
+ 'usa-aurora': UsaAuroraElement;
124
+ 'usa-particles': UsaParticlesElement;
125
+ 'usa-grain': UsaGrainElement;
126
+ 'usa-marquee': UsaMarqueeElement;
127
+ 'usa-acrylic': UsaAcrylicElement;
128
+ }
129
+ }
130
+
131
+ export { configureComponents, defineAcrylic, defineAurora, defineBackgroundComponents, defineGrain, defineMarquee, defineParticles, prefersReducedMotion };
132
+ export type { ComponentsConfig, UsaAcrylicElement, UsaAuroraElement, UsaElement, UsaGrainElement, UsaMarqueeElement, UsaParticlesElement };
@@ -0,0 +1,132 @@
1
+ /**
2
+ * use-scroll-animate/components — shared base for the `<usa-*>` custom elements.
3
+ *
4
+ * Everything here is lazy: nothing touches `window`, `document`,
5
+ * `HTMLElement` or `matchMedia` at import time, so the components can be
6
+ * imported during SSR (Next, Nuxt, Astro…) and in Electron/Tauri preload
7
+ * scripts. Classes are created the first time a `define*()` function runs.
8
+ */
9
+ interface ComponentsConfig {
10
+ /**
11
+ * Inject each component's CSS when it is defined (default `true`). Uses a
12
+ * constructable stylesheet (`document.adoptedStyleSheets`, which a strict
13
+ * `style-src` CSP does not block) and falls back to a `<style>` tag. Set
14
+ * to `false` when you load `use-scroll-animate/components.css` yourself.
15
+ */
16
+ injectStyles?: boolean;
17
+ /**
18
+ * `'user'` (default) follows `prefers-reduced-motion`; `'reduce'` always
19
+ * uses the reduced variants (e.g. a kiosk / battery-saver mode);
20
+ * `'no-preference'` ignores the OS setting (only for demos — respect your users).
21
+ */
22
+ reducedMotion?: 'user' | 'reduce' | 'no-preference';
23
+ }
24
+ /** Change global component settings (call before `define*()` for `injectStyles`). */
25
+ declare function configureComponents(options: ComponentsConfig): void;
26
+ /** `true` when animations should be reduced (OS setting or `configureComponents`). */
27
+ declare function prefersReducedMotion(): boolean;
28
+ /**
29
+ * Members shared by every `<usa-*>` element. Attribute helpers, a cleanup
30
+ * bag that is emptied on disconnect, and motion helpers that degrade to the
31
+ * final state without WAAPI or under reduced motion.
32
+ */
33
+ interface UsaElement extends HTMLElement {
34
+ /** `true` while reduced motion applies to this element. */
35
+ readonly reduced: boolean;
36
+ }
37
+
38
+ /**
39
+ * `<usa-aurora>` — a slow, drifting aurora / gradient-mesh backdrop behind
40
+ * its content. Soft radial gradients moved with `transform` only (no
41
+ * animated blur), paused while off-screen.
42
+ *
43
+ * Attributes: `colors` (comma-separated, default violet / cyan / pink),
44
+ * `speed` (multiplier, 1), `intensity` (0–1 opacity, 0.7), `paused`.
45
+ * Reduced motion: a still gradient.
46
+ */
47
+ type UsaAuroraElement = UsaElement;
48
+ declare function defineAurora(tag?: string): CustomElementConstructor | undefined;
49
+
50
+ /**
51
+ * `<usa-particles>` — a canvas of drifting particles, optionally linked by
52
+ * lines when close (a "constellation"), that drift away from the pointer.
53
+ * Fills its own box (place it as a background with
54
+ * `position: absolute; inset: 0`, or give it a height).
55
+ *
56
+ * Attributes: `count` (60; scaled down on small boxes), `color`
57
+ * (default `currentColor`), `size` (max radius px, 2.2), `speed` (0.35),
58
+ * `links` (max link distance px, 110; `0` disables), `interactive`,
59
+ * `paused`. Renders only while visible and the tab is shown, at device
60
+ * pixel ratio ≤ 2. Reduced motion: one still frame.
61
+ */
62
+ interface UsaParticlesElement extends UsaElement {
63
+ /** Re-seed the particles. */
64
+ reset(): void;
65
+ }
66
+ declare function defineParticles(tag?: string): CustomElementConstructor | undefined;
67
+
68
+ /**
69
+ * `<usa-grain>` — a film-grain / noise overlay on top of its content
70
+ * (SVG `feTurbulence` texture, no images to ship). With `animated`, the
71
+ * grain jitters like film (stepped `transform`, ~12 fps).
72
+ *
73
+ * Attributes: `opacity` (0.12), `animated`, `blend` (`mix-blend-mode`,
74
+ * default `overlay`), `scale` (texture size px, 180). Never intercepts
75
+ * pointer events. Reduced motion: static grain.
76
+ */
77
+ type UsaGrainElement = UsaElement;
78
+ declare function defineGrain(tag?: string): CustomElementConstructor | undefined;
79
+
80
+ /**
81
+ * `<usa-marquee>` — an infinite, seamless ticker of its children (logos,
82
+ * testimonials, tags). The content is cloned (clones are `aria-hidden` and
83
+ * `inert`) and the track slides with one WAAPI `transform` animation whose
84
+ * duration follows the measured width, so the speed is constant.
85
+ *
86
+ * Attributes: `speed` (px/s, 50), `direction` (`left` default | `right` |
87
+ * `up` | `down`), `gap` (px, 32), `pause-on-hover`, `fade` (soft edges),
88
+ * `paused`. Pauses off-screen. Reduced motion: no movement; the row
89
+ * becomes scrollable instead.
90
+ */
91
+ interface UsaMarqueeElement extends UsaElement {
92
+ pause(): void;
93
+ resume(): void;
94
+ }
95
+ declare function defineMarquee(tag?: string): CustomElementConstructor | undefined;
96
+
97
+ /**
98
+ * `<usa-acrylic>` — Windows Fluent materials for the web: `acrylic`
99
+ * (frosted glass: backdrop blur + saturation + tint + subtle noise) and
100
+ * `mica` (an opaque, wallpaper-tinted base for app backgrounds; on the web it
101
+ * tints from `--usa-mica-source`, a gradient you control). Optional
102
+ * `shimmer` adds a light sweep when it appears or on hover.
103
+ *
104
+ * Attributes: `variant` (`acrylic` default | `mica`), `tint` (colour),
105
+ * `tint-opacity` (0–1, 0.55), `blur` (px, 30), `shimmer`
106
+ * (`hover` | `load` | `none`, default `none`). Falls back to a solid tint
107
+ * without `backdrop-filter` and under `prefers-reduced-transparency` or
108
+ * forced colours, like Windows does when transparency effects are off.
109
+ */
110
+ type UsaAcrylicElement = UsaElement;
111
+ declare function defineAcrylic(tag?: string): CustomElementConstructor | undefined;
112
+
113
+ /**
114
+ * use-scroll-animate/components/background — backgrounds & decoration.
115
+ * `<usa-aurora>`, `<usa-particles>`, `<usa-grain>`, `<usa-marquee>`,
116
+ * `<usa-acrylic>`.
117
+ */
118
+
119
+ /** Register every component of this category under its default tag. */
120
+ declare function defineBackgroundComponents(): void;
121
+ declare global {
122
+ interface HTMLElementTagNameMap {
123
+ 'usa-aurora': UsaAuroraElement;
124
+ 'usa-particles': UsaParticlesElement;
125
+ 'usa-grain': UsaGrainElement;
126
+ 'usa-marquee': UsaMarqueeElement;
127
+ 'usa-acrylic': UsaAcrylicElement;
128
+ }
129
+ }
130
+
131
+ export { configureComponents, defineAcrylic, defineAurora, defineBackgroundComponents, defineGrain, defineMarquee, defineParticles, prefersReducedMotion };
132
+ export type { ComponentsConfig, UsaAcrylicElement, UsaAuroraElement, UsaElement, UsaGrainElement, UsaMarqueeElement, UsaParticlesElement };