motionary 6.8.0 → 7.0.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.
- package/CHANGELOG.md +39 -0
- package/README.md +2 -2
- package/README_ja.md +2 -2
- package/README_zh.md +2 -2
- package/bin/usa-codemod-7.mjs +91 -0
- package/dist/chunks/{gpu-CsP2ZB3x.js → gpu-Bkw605Ds.js} +183 -5
- package/dist/chunks/gpu-Bkw605Ds.js.map +1 -0
- package/dist/chunks/{gpu-BBRLgEzM.cjs → gpu-Dx0H875w.cjs} +187 -4
- package/dist/chunks/gpu-Dx0H875w.cjs.map +1 -0
- package/dist/chunks/{index-tags-wv0R_vkO.cjs → index-tags-BTMwrfgV.cjs} +3 -3
- package/dist/chunks/index-tags-BTMwrfgV.cjs.map +1 -0
- package/dist/chunks/{index-tags-DucKMQr_.js → index-tags-C04JP8g4.js} +3 -3
- package/dist/chunks/index-tags-C04JP8g4.js.map +1 -0
- package/dist/chunks/player-C-TwEEy6.js +516 -0
- package/dist/chunks/player-C-TwEEy6.js.map +1 -0
- package/dist/chunks/player-PS6_FzNw.cjs +525 -0
- package/dist/chunks/player-PS6_FzNw.cjs.map +1 -0
- package/dist/components/a11y.cjs +1 -1
- package/dist/components/a11y.d.cts +2 -2
- package/dist/components/a11y.d.ts +2 -2
- package/dist/components/a11y.js +1 -1
- package/dist/components/angular.cjs +2 -2
- package/dist/components/angular.cjs.map +1 -1
- package/dist/components/angular.d.cts +5 -36
- package/dist/components/angular.d.ts +5 -36
- package/dist/components/angular.js +2 -2
- package/dist/components/angular.js.map +1 -1
- package/dist/components/effects.cjs +13 -522
- package/dist/components/effects.cjs.map +1 -1
- package/dist/components/effects.js +5 -513
- package/dist/components/effects.js.map +1 -1
- package/dist/components/fx-3d.cjs +2 -2
- package/dist/components/fx-3d.cjs.map +1 -1
- package/dist/components/fx-3d.d.cts +2 -2
- package/dist/components/fx-3d.d.ts +2 -2
- package/dist/components/fx-3d.js +2 -2
- package/dist/components/fx-3d.js.map +1 -1
- package/dist/components/fx-focus.cjs +125 -0
- package/dist/components/fx-focus.cjs.map +1 -0
- package/dist/components/fx-focus.d.cts +65 -0
- package/dist/components/fx-focus.d.ts +65 -0
- package/dist/components/fx-focus.js +122 -0
- package/dist/components/fx-focus.js.map +1 -0
- package/dist/components/fx-gpu.cjs +2 -2
- package/dist/components/fx-gpu.d.cts +2 -2
- package/dist/components/fx-gpu.d.ts +2 -2
- package/dist/components/fx-gpu.js +1 -1
- package/dist/components/fx-light.cjs +2 -2
- package/dist/components/fx-light.cjs.map +1 -1
- package/dist/components/fx-light.d.cts +2 -2
- package/dist/components/fx-light.d.ts +2 -2
- package/dist/components/fx-light.js +2 -2
- package/dist/components/fx-light.js.map +1 -1
- package/dist/components/fx-morph.cjs +2 -2
- package/dist/components/fx-morph.cjs.map +1 -1
- package/dist/components/fx-morph.d.cts +2 -2
- package/dist/components/fx-morph.d.ts +2 -2
- package/dist/components/fx-morph.js +2 -2
- package/dist/components/fx-morph.js.map +1 -1
- package/dist/components/fx-physics.cjs +2 -2
- package/dist/components/fx-physics.cjs.map +1 -1
- package/dist/components/fx-physics.d.cts +2 -2
- package/dist/components/fx-physics.d.ts +2 -2
- package/dist/components/fx-physics.js +2 -2
- package/dist/components/fx-physics.js.map +1 -1
- package/dist/components/fx-text.cjs +2 -2
- package/dist/components/fx-text.cjs.map +1 -1
- package/dist/components/fx-text.d.cts +2 -2
- package/dist/components/fx-text.d.ts +2 -2
- package/dist/components/fx-text.js +2 -2
- package/dist/components/fx-text.js.map +1 -1
- package/dist/components/fx-transitions.cjs +2 -2
- package/dist/components/fx-transitions.cjs.map +1 -1
- package/dist/components/fx-transitions.d.cts +2 -2
- package/dist/components/fx-transitions.d.ts +2 -2
- package/dist/components/fx-transitions.js +2 -2
- package/dist/components/fx-transitions.js.map +1 -1
- package/dist/components/fx-weather.cjs +2 -2
- package/dist/components/fx-weather.cjs.map +1 -1
- package/dist/components/fx-weather.d.cts +2 -2
- package/dist/components/fx-weather.d.ts +2 -2
- package/dist/components/fx-weather.js +2 -2
- package/dist/components/fx-weather.js.map +1 -1
- package/dist/components/fx2.cjs +37 -22
- package/dist/components/fx2.cjs.map +1 -1
- package/dist/components/fx2.d.cts +135 -14
- package/dist/components/fx2.d.ts +135 -14
- package/dist/components/fx2.js +25 -21
- package/dist/components/fx2.js.map +1 -1
- package/dist/components/interaction.cjs +11 -94
- package/dist/components/interaction.cjs.map +1 -1
- package/dist/components/interaction.css +0 -1
- package/dist/components/interaction.d.cts +3 -21
- package/dist/components/interaction.d.ts +3 -21
- package/dist/components/interaction.js +12 -94
- package/dist/components/interaction.js.map +1 -1
- package/dist/components/jsx.d.cts +2 -2
- package/dist/components/jsx.d.ts +2 -2
- package/dist/components/lazy.cjs +1 -1
- package/dist/components/lazy.d.cts +2 -2
- package/dist/components/lazy.d.ts +2 -2
- package/dist/components/lazy.js +1 -1
- package/dist/components/lite.cjs +115 -256
- package/dist/components/lite.cjs.map +1 -1
- package/dist/components/lite.js +116 -255
- package/dist/components/lite.js.map +1 -1
- package/dist/components/marketplace.cjs +82 -0
- package/dist/components/marketplace.cjs.map +1 -0
- package/dist/components/marketplace.d.cts +108 -0
- package/dist/components/marketplace.d.ts +108 -0
- package/dist/components/marketplace.js +77 -0
- package/dist/components/marketplace.js.map +1 -0
- package/dist/components/perf.cjs +1 -1
- package/dist/components/perf.d.cts +2 -2
- package/dist/components/perf.d.ts +2 -2
- package/dist/components/perf.js +1 -1
- package/dist/components/react.cjs +2 -2
- package/dist/components/react.cjs.map +1 -1
- package/dist/components/react.js +2 -2
- package/dist/components/react.js.map +1 -1
- package/dist/components/solid.cjs +2 -2
- package/dist/components/solid.cjs.map +1 -1
- package/dist/components/solid.d.cts +4 -35
- package/dist/components/solid.d.ts +4 -35
- package/dist/components/solid.js +2 -2
- package/dist/components/solid.js.map +1 -1
- package/dist/components/svelte.cjs +2 -2
- package/dist/components/svelte.cjs.map +1 -1
- package/dist/components/svelte.d.cts +5 -36
- package/dist/components/svelte.d.ts +5 -36
- package/dist/components/svelte.js +2 -2
- package/dist/components/svelte.js.map +1 -1
- package/dist/components/ui.cjs +16 -74
- package/dist/components/ui.cjs.map +1 -1
- package/dist/components/ui.css +0 -1
- package/dist/components/ui.d.cts +3 -18
- package/dist/components/ui.d.ts +3 -18
- package/dist/components/ui.js +17 -74
- package/dist/components/ui.js.map +1 -1
- package/dist/components/vue.cjs +2 -2
- package/dist/components/vue.cjs.map +1 -1
- package/dist/components/vue.d.cts +5 -36
- package/dist/components/vue.d.ts +5 -36
- package/dist/components/vue.js +2 -2
- package/dist/components/vue.js.map +1 -1
- package/dist/components/widgets.cjs +622 -53
- package/dist/components/widgets.cjs.map +1 -1
- package/dist/components/widgets.d.cts +106 -2
- package/dist/components/widgets.d.ts +106 -2
- package/dist/components/widgets.js +615 -54
- package/dist/components/widgets.js.map +1 -1
- package/dist/components.cjs +1 -3
- package/dist/components.cjs.map +1 -1
- package/dist/components.css +0 -2
- package/dist/components.d.cts +6 -39
- package/dist/components.d.ts +6 -39
- package/dist/components.js +3 -3
- package/dist/components.umd.js +2 -2
- package/dist/components.umd.js.map +1 -1
- package/dist/widgets.umd.js +1 -1
- package/dist/widgets.umd.js.map +1 -1
- package/docs/ROADMAP.md +12 -12
- package/docs/accessibility.md +2 -2
- package/docs/components.md +41 -2
- package/docs/deprecations.md +4 -0
- package/docs/frameworks-ssr.md +4 -4
- package/docs/hybrid-apps.md +2 -2
- package/docs/upgrading-7.md +43 -0
- package/docs/windows-apps.md +1 -1
- package/package.json +133 -2
- package/dist/chunks/gpu-BBRLgEzM.cjs.map +0 -1
- package/dist/chunks/gpu-CsP2ZB3x.js.map +0 -1
- package/dist/chunks/index-tags-DucKMQr_.js.map +0 -1
- package/dist/chunks/index-tags-wv0R_vkO.cjs.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"interaction.cjs","sources":["../../src/components/interaction/ripple.ts","../../src/components/interaction/magnetic.ts","../../src/components/interaction/tilt.ts","../../src/components/interaction/spotlight.ts","../../src/components/interaction/press.ts","../../src/components/interaction/toggle.ts","../../src/components/interaction/index.ts"],"sourcesContent":["import { defineElement, EASE_OUT, type UsaElement } from '../base';\nimport css from './ripple.css?raw';\n\n/**\n * `<usa-ripple>` — an ink ripple from the pointer (or the centre, for\n * keyboard presses) on whatever it wraps: buttons, list items, cards.\n *\n * Attributes: `color` (default `currentColor`), `opacity` (0.22),\n * `duration` (ms, 550), `centered`, `disabled`. Clips its content to its\n * own border radius. Reduced motion: a brief highlight instead of the wave.\n */\nexport interface UsaRippleElement extends UsaElement {\n /** Spawn a ripple at client coordinates (default: centre). */\n ripple(x?: number, y?: number): void;\n}\n\nexport function defineRipple(tag = 'usa-ripple'): CustomElementConstructor | undefined {\n return defineElement(\n tag,\n (Base) =>\n class UsaRipple extends Base {\n static get observedAttributes(): string[] {\n return [];\n }\n\n mount(): void {\n this.listen(this, 'pointerdown', (e: PointerEvent) => {\n if (e.button !== 0 && e.pointerType === 'mouse') return;\n this.ripple(e.clientX, e.clientY);\n });\n this.listen(this, 'keydown', (e: KeyboardEvent) => {\n if ((e.key === 'Enter' || e.key === ' ') && !e.repeat) this.ripple();\n });\n }\n\n ripple(x?: number, y?: number): void {\n if (this.flag('disabled')) return;\n const r = this.getBoundingClientRect();\n const centered = this.flag('centered') || x === undefined || y === undefined;\n const cx = centered ? r.width / 2 : (x as number) - r.left;\n const cy = centered ? r.height / 2 : (y as number) - r.top;\n const radius = Math.hypot(Math.max(cx, r.width - cx), Math.max(cy, r.height - cy));\n const wave = document.createElement('span');\n wave.className = 'usa-ripple-wave';\n wave.setAttribute('aria-hidden', 'true');\n const size = radius * 2;\n wave.style.cssText = `width:${size}px;height:${size}px;left:${cx - radius}px;top:${cy - radius}px;background:${this.str('color', 'currentColor')}`;\n this.append(wave);\n const opacity = this.num('opacity', 0.22);\n const duration = this.num('duration', 550);\n const frames = this.reduced\n ? [{ opacity }, { opacity: 0 }]\n : [\n { transform: 'scale(0)', opacity },\n { transform: 'scale(1)', opacity, offset: 0.7 },\n { transform: 'scale(1)', opacity: 0 },\n ];\n const a = this.motion(wave, frames, { duration: this.reduced ? 300 : duration, easing: EASE_OUT, fill: 'forwards' });\n if (a) a.onfinish = () => wave.remove();\n else setTimeout(() => wave.remove(), 0);\n }\n },\n { id: 'ripple', text: css }\n );\n}\n","import { defineElement, raf, caf, type UsaElement } from '../base';\nimport css from './magnetic.css?raw';\n\n/**\n * `<usa-magnetic>` — its content leans toward the pointer when the pointer\n * comes near, and springs back when it leaves (great for CTAs and icons).\n *\n * Attributes: `strength` (0–1 share of the pointer offset, 0.35), `radius`\n * (px of attraction beyond the element's edge, 60), `disabled`. Only on\n * devices with a fine pointer that hovers; off under reduced motion.\n * Writes one `transform` per frame through `--usa-mx` / `--usa-my`.\n */\nexport type UsaMagneticElement = UsaElement;\n\nexport function defineMagnetic(tag = 'usa-magnetic'): CustomElementConstructor | undefined {\n return defineElement(\n tag,\n (Base) =>\n class UsaMagnetic extends Base {\n static get observedAttributes(): string[] {\n return ['strength', 'radius', 'disabled'];\n }\n\n private _frame = 0;\n\n mount(): void {\n if (this.reduced || this.flag('disabled')) return;\n if (typeof matchMedia === 'function' && !matchMedia('(hover: hover) and (pointer: fine)').matches) return;\n const strength = this.num('strength', 0.35);\n const radius = this.num('radius', 60);\n let x = 0;\n let y = 0;\n let active = false;\n const apply = () => {\n this._frame = 0;\n const r = this.getBoundingClientRect();\n const dx = x - (r.left + r.width / 2);\n const dy = y - (r.top + r.height / 2);\n const near = Math.abs(dx) < r.width / 2 + radius && Math.abs(dy) < r.height / 2 + radius;\n if (near) {\n active = true;\n this.setAttribute('data-active', '');\n this.style.setProperty('--usa-mx', `${(dx * strength).toFixed(2)}px`);\n this.style.setProperty('--usa-my', `${(dy * strength).toFixed(2)}px`);\n } else if (active) this.release();\n };\n this.listen(\n document,\n 'pointermove',\n (e: PointerEvent) => {\n if (e.pointerType !== 'mouse' && e.pointerType !== 'pen') return;\n x = e.clientX;\n y = e.clientY;\n if (!this._frame) this._frame = raf(apply);\n },\n { passive: true }\n );\n this.listen(document, 'pointerleave', () => this.release());\n this.listen(window, 'blur', () => this.release());\n }\n\n private release(): void {\n this.removeAttribute('data-active');\n this.style.removeProperty('--usa-mx');\n this.style.removeProperty('--usa-my');\n }\n\n unmount(): void {\n caf(this._frame);\n this._frame = 0;\n this.release();\n }\n },\n { id: 'magnetic', text: css }\n );\n}\n","import { defineElement, raf, caf, clamp, type UsaElement } from '../base';\nimport css from './tilt.css?raw';\n\n/**\n * `<usa-tilt>` — a 3D card that tilts toward the pointer, with an optional\n * glare highlight that follows it.\n *\n * Attributes: `max` (deg, 10), `scale` (1.03 while hovered), `perspective`\n * (px, 900), `glare` (add the light reflection), `reverse` (tilt away),\n * `disabled`. Off under reduced motion. Exposes `--usa-tilt-x` /\n * `--usa-tilt-y` (−1…1) for parallax layers inside the card.\n */\nexport type UsaTiltElement = UsaElement;\n\nexport function defineTilt(tag = 'usa-tilt'): CustomElementConstructor | undefined {\n return defineElement(\n tag,\n (Base) =>\n class UsaTilt extends Base {\n static get observedAttributes(): string[] {\n return ['max', 'scale', 'perspective', 'glare', 'reverse', 'disabled'];\n }\n\n private _frame = 0;\n private _glare: HTMLElement | null = null;\n\n mount(): void {\n if (this.flag('glare') && !this._glare) {\n this._glare = document.createElement('span');\n this._glare.className = 'usa-tilt-glare';\n this._glare.setAttribute('aria-hidden', 'true');\n this.append(this._glare);\n } else if (!this.flag('glare') && this._glare) {\n this._glare.remove();\n this._glare = null;\n }\n if (this.reduced || this.flag('disabled')) return;\n const max = this.num('max', 10) * (this.flag('reverse') ? -1 : 1);\n const scale = this.num('scale', 1.03);\n const persp = this.num('perspective', 900);\n let px = 0.5;\n let py = 0.5;\n let rect: DOMRect | null = null;\n const apply = () => {\n this._frame = 0;\n const nx = clamp(px * 2 - 1, -1, 1);\n const ny = clamp(py * 2 - 1, -1, 1);\n this.style.transform = `perspective(${persp}px) rotateX(${(-ny * max).toFixed(2)}deg) rotateY(${(nx * max).toFixed(2)}deg) scale(${scale})`;\n this.style.setProperty('--usa-tilt-x', nx.toFixed(3));\n this.style.setProperty('--usa-tilt-y', ny.toFixed(3));\n this.style.setProperty('--usa-glare-x', `${(px * 100).toFixed(1)}%`);\n this.style.setProperty('--usa-glare-y', `${(py * 100).toFixed(1)}%`);\n };\n this.listen(this, 'pointerenter', (e: PointerEvent) => {\n if (e.pointerType === 'touch') return;\n rect = this.getBoundingClientRect();\n this.setAttribute('data-active', '');\n });\n this.listen(this, 'pointermove', (e: PointerEvent) => {\n if (e.pointerType === 'touch') return;\n rect = rect || this.getBoundingClientRect();\n px = (e.clientX - rect.left) / (rect.width || 1);\n py = (e.clientY - rect.top) / (rect.height || 1);\n if (!this._frame) this._frame = raf(apply);\n });\n this.listen(this, 'pointerleave', () => this.reset());\n }\n\n private reset(): void {\n caf(this._frame);\n this._frame = 0;\n this.removeAttribute('data-active');\n this.style.transform = '';\n this.style.setProperty('--usa-tilt-x', '0');\n this.style.setProperty('--usa-tilt-y', '0');\n }\n\n unmount(): void {\n this.reset();\n }\n },\n { id: 'tilt', text: css }\n );\n}\n","import { defineElement, raf, caf, type UsaElement } from '../base';\nimport css from './spotlight.css?raw';\n\n/**\n * `<usa-spotlight>` — the Windows Fluent \"Reveal highlight\": a soft light\n * follows the pointer across a group of items, lighting up their borders\n * (even of neighbours) and the background of the hovered one. Put buttons,\n * tiles or menu items inside; each direct child is an item (or mark items\n * with `data-spotlight` to pick them yourself).\n *\n * Attributes: `size` (px, radius of the light, 160), `color` (default a\n * translucent white), `border` (px width of the lit border, 1),\n * `no-fill` (only light the borders). Not a motion effect, so it stays on\n * under reduced motion; off on touch-only devices.\n */\nexport type UsaSpotlightElement = UsaElement;\n\nexport function defineSpotlight(tag = 'usa-spotlight'): CustomElementConstructor | undefined {\n return defineElement(\n tag,\n (Base) =>\n class UsaSpotlight extends Base {\n static get observedAttributes(): string[] {\n return ['size', 'color', 'border'];\n }\n\n private _frame = 0;\n\n private items(): HTMLElement[] {\n const marked = Array.from(this.querySelectorAll<HTMLElement>('[data-spotlight]'));\n const items = marked.length ? marked : (Array.from(this.children) as HTMLElement[]);\n items.forEach((el) => el.classList.add('usa-spotlight-item'));\n return items;\n }\n\n mount(): void {\n const size = this.getAttribute('size');\n if (size) this.style.setProperty('--usa-spot-size', `${Number(size)}px`);\n const color = this.getAttribute('color');\n if (color) this.style.setProperty('--usa-spot-color', color);\n const border = this.getAttribute('border');\n if (border) this.style.setProperty('--usa-spot-border', `${Number(border)}px`);\n let items = this.items();\n let x = 0;\n let y = 0;\n const apply = () => {\n this._frame = 0;\n // All reads, then all writes\n const rects = items.map((el) => el.getBoundingClientRect());\n rects.forEach((r, i) => {\n items[i].style.setProperty('--usa-spot-x', `${(x - r.left).toFixed(1)}px`);\n items[i].style.setProperty('--usa-spot-y', `${(y - r.top).toFixed(1)}px`);\n });\n };\n this.listen(this, 'pointerenter', (e: PointerEvent) => {\n if (e.pointerType === 'touch') return;\n items = this.items();\n this.setAttribute('data-lit', '');\n });\n this.listen(this, 'pointermove', (e: PointerEvent) => {\n if (e.pointerType === 'touch') return;\n x = e.clientX;\n y = e.clientY;\n if (!this.hasAttribute('data-lit')) this.setAttribute('data-lit', '');\n if (!this._frame) this._frame = raf(apply);\n });\n this.listen(this, 'pointerleave', () => this.removeAttribute('data-lit'));\n }\n\n unmount(): void {\n caf(this._frame);\n this._frame = 0;\n this.removeAttribute('data-lit');\n }\n },\n { id: 'spotlight', text: css }\n );\n}\n","import { defineElement, EASE_SPRING, type UsaElement } from '../base';\nimport css from './press.css?raw';\n\n/**\n * `<usa-press>` — tactile press feedback: content dips while pressed and\n * springs back on release (the Fluent \"pointer down\" scale), or bounces once\n * on click with `bounce`.\n *\n * Attributes: `scale` (pressed scale, 0.95), `bounce` (overshoot on\n * release), `disabled`. Works with mouse, touch, pen and Space/Enter.\n * Reduced motion: a subtle dim instead of scaling.\n */\nexport interface UsaPressElement extends UsaElement {\n readonly pressed: boolean;\n}\n\nexport function definePress(tag = 'usa-press'): CustomElementConstructor | undefined {\n return defineElement(\n tag,\n (Base) =>\n class UsaPress extends Base {\n static get observedAttributes(): string[] {\n return ['disabled'];\n }\n\n private _anim: Animation | null = null;\n private _down = false;\n\n get pressed(): boolean {\n return this._down;\n }\n\n private frame(down: boolean): Keyframe {\n if (this.reduced) return { opacity: down ? 0.7 : 1 };\n return { transform: down ? `scale(${this.num('scale', 0.95)})` : 'scale(1)' };\n }\n\n private down(): void {\n if (this._down || this.flag('disabled')) return;\n this._down = true;\n this.setAttribute('data-pressed', '');\n const from = this.currentFrame();\n this._anim?.cancel();\n this._anim = this.motion(this, [from, this.frame(true)], { duration: 120, easing: 'cubic-bezier(0.3, 0, 0.7, 1)', fill: 'forwards' });\n }\n\n private up(): void {\n if (!this._down) return;\n this._down = false;\n this.removeAttribute('data-pressed');\n const from = this.currentFrame();\n this._anim?.cancel();\n const frames: Keyframe[] =\n this.flag('bounce') && !this.reduced\n ? [from, { transform: 'scale(1.06)', offset: 0.45 }, { transform: 'scale(0.99)', offset: 0.75 }, this.frame(false)]\n : [from, this.frame(false)];\n const a = this.motion(this, frames, { duration: this.flag('bounce') ? 480 : 320, easing: EASE_SPRING });\n this._anim = a;\n if (a) a.onfinish = () => this._anim === a && (this._anim = null);\n }\n\n private currentFrame(): Keyframe {\n if (typeof getComputedStyle !== 'function') return this.frame(false);\n const cs = getComputedStyle(this);\n return this.reduced ? { opacity: cs.opacity || '1' } : { transform: cs.transform && cs.transform !== 'none' ? cs.transform : 'scale(1)' };\n }\n\n mount(): void {\n this.listen(this, 'pointerdown', (e: PointerEvent) => {\n if (e.pointerType === 'mouse' && e.button !== 0) return;\n this.down();\n });\n for (const t of ['pointerup', 'pointerleave', 'pointercancel', 'blur']) this.listen(this, t, () => this.up());\n this.listen(this, 'keydown', (e: KeyboardEvent) => (e.key === ' ' || e.key === 'Enter') && !e.repeat && this.down());\n this.listen(this, 'keyup', (e: KeyboardEvent) => (e.key === ' ' || e.key === 'Enter') && this.up());\n }\n\n unmount(): void {\n this._anim?.cancel();\n this._anim = null;\n this._down = false;\n }\n },\n { id: 'press', text: css }\n );\n}\n","import { defineElement, type UsaElement } from '../base';\nimport css from './toggle.css?raw';\n\n/**\n * `<usa-toggle>` — an accessible switch whose knob stretches while pressed\n * and glides across (the Windows 11 / iOS toggle). `role=\"switch\"`,\n * keyboard (Space / Enter), and form-associated where `ElementInternals`\n * exists (submits `value`, default `\"on\"`, under `name` when checked).\n *\n * Attributes: `checked`, `disabled`, `name`, `value`, `label`\n * (accessible name if there is no `aria-label` / `<label>`). Events:\n * `change` and `usa:change` (`detail.checked`). Reduced motion: no glide.\n */\nexport interface UsaToggleElement extends UsaElement {\n checked: boolean;\n disabled: boolean;\n toggle(force?: boolean): void;\n}\n\nexport function defineToggle(tag = 'usa-toggle'): CustomElementConstructor | undefined {\n return defineElement(\n tag,\n (Base) =>\n class UsaToggle extends Base {\n static formAssociated = true;\n static get observedAttributes(): string[] {\n return ['checked', 'disabled', 'label'];\n }\n\n private _internals: ElementInternals | null = null;\n\n constructor() {\n super();\n try {\n this._internals = typeof (this as any).attachInternals === 'function' ? (this as any).attachInternals() : null;\n } catch {\n this._internals = null;\n }\n }\n\n get checked(): boolean {\n return this.hasAttribute('checked');\n }\n set checked(v: boolean) {\n this.toggleAttribute('checked', !!v);\n }\n get disabled(): boolean {\n return this.hasAttribute('disabled');\n }\n set disabled(v: boolean) {\n this.toggleAttribute('disabled', !!v);\n }\n\n changed(): void {\n this.sync();\n }\n\n private sync(): void {\n this.setAttribute('aria-checked', String(this.checked));\n this.setAttribute('aria-disabled', String(this.disabled));\n this.tabIndex = this.disabled ? -1 : 0;\n const label = this.getAttribute('label');\n if (label && !this.hasAttribute('aria-label')) this.setAttribute('aria-label', label);\n this._internals?.setFormValue?.(this.checked ? this.str('value', 'on') : null);\n }\n\n mount(): void {\n if (!this.querySelector(':scope > .usa-toggle-track')) {\n const track = document.createElement('span');\n track.className = 'usa-toggle-track';\n track.setAttribute('aria-hidden', 'true');\n const knob = document.createElement('span');\n knob.className = 'usa-toggle-knob';\n track.append(knob);\n this.prepend(track);\n }\n this.setAttribute('role', 'switch');\n this.sync();\n this.listen(this, 'click', () => this.toggle());\n this.listen(this, 'keydown', (e: KeyboardEvent) => {\n if (e.key === ' ' || e.key === 'Enter') {\n e.preventDefault();\n if (!e.repeat) this.toggle();\n }\n });\n this.listen(this, 'pointerdown', () => !this.disabled && this.setAttribute('data-pressed', ''));\n for (const t of ['pointerup', 'pointerleave', 'pointercancel']) this.listen(this, t, () => this.removeAttribute('data-pressed'));\n }\n\n toggle(force?: boolean): void {\n if (this.disabled) return;\n const next = force === undefined ? !this.checked : force;\n if (next === this.checked) return;\n this.checked = next;\n this.sync();\n this.dispatchEvent(new Event('change', { bubbles: true }));\n this.emit('change', { checked: next });\n }\n },\n { id: 'toggle', text: css }\n );\n}\n","/**\n * motionary/components/interaction — micro-interactions.\n * `<usa-ripple>`, `<usa-magnetic>`, `<usa-tilt>`, `<usa-spotlight>`,\n * `<usa-press>`, `<usa-toggle>`.\n */\nimport { defineRipple, type UsaRippleElement } from './ripple';\nimport { defineMagnetic, type UsaMagneticElement } from './magnetic';\nimport { defineTilt, type UsaTiltElement } from './tilt';\nimport { defineSpotlight, type UsaSpotlightElement } from './spotlight';\nimport { definePress, type UsaPressElement } from './press';\nimport { defineToggle, type UsaToggleElement } from './toggle';\n\nexport { defineRipple, defineMagnetic, defineTilt, defineSpotlight, definePress, defineToggle };\nexport type { UsaRippleElement, UsaMagneticElement, UsaTiltElement, UsaSpotlightElement, UsaPressElement, UsaToggleElement };\n\n/** Register every component of this category under its default tag. */\nexport function defineInteractionComponents(): void {\n defineRipple();\n defineMagnetic();\n defineTilt();\n defineSpotlight();\n definePress();\n defineToggle();\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'usa-ripple': UsaRippleElement;\n 'usa-magnetic': UsaMagneticElement;\n 'usa-tilt': UsaTiltElement;\n 'usa-spotlight': UsaSpotlightElement;\n 'usa-press': UsaPressElement;\n 'usa-toggle': UsaToggleElement;\n }\n}\n"],"names":["defineElement","EASE_OUT","css","raf","caf","clamp","EASE_SPRING"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"interaction.cjs","sources":["../../src/components/interaction/ripple.ts","../../src/components/interaction/magnetic.ts","../../src/components/interaction/tilt.ts","../../src/components/interaction/spotlight.ts","../../src/components/interaction/press.ts","../../src/components/interaction/index.ts"],"sourcesContent":["import { defineElement, EASE_OUT, type UsaElement } from '../base';\nimport css from './ripple.css?raw';\n\n/**\n * `<usa-ripple>` — an ink ripple from the pointer (or the centre, for\n * keyboard presses) on whatever it wraps: buttons, list items, cards.\n *\n * Attributes: `color` (default `currentColor`), `opacity` (0.22),\n * `duration` (ms, 550), `centered`, `disabled`. Clips its content to its\n * own border radius. Reduced motion: a brief highlight instead of the wave.\n */\nexport interface UsaRippleElement extends UsaElement {\n /** Spawn a ripple at client coordinates (default: centre). */\n ripple(x?: number, y?: number): void;\n}\n\nexport function defineRipple(tag = 'usa-ripple'): CustomElementConstructor | undefined {\n return defineElement(\n tag,\n (Base) =>\n class UsaRipple extends Base {\n static get observedAttributes(): string[] {\n return [];\n }\n\n mount(): void {\n this.listen(this, 'pointerdown', (e: PointerEvent) => {\n if (e.button !== 0 && e.pointerType === 'mouse') return;\n this.ripple(e.clientX, e.clientY);\n });\n this.listen(this, 'keydown', (e: KeyboardEvent) => {\n if ((e.key === 'Enter' || e.key === ' ') && !e.repeat) this.ripple();\n });\n }\n\n ripple(x?: number, y?: number): void {\n if (this.flag('disabled')) return;\n const r = this.getBoundingClientRect();\n const centered = this.flag('centered') || x === undefined || y === undefined;\n const cx = centered ? r.width / 2 : (x as number) - r.left;\n const cy = centered ? r.height / 2 : (y as number) - r.top;\n const radius = Math.hypot(Math.max(cx, r.width - cx), Math.max(cy, r.height - cy));\n const wave = document.createElement('span');\n wave.className = 'usa-ripple-wave';\n wave.setAttribute('aria-hidden', 'true');\n const size = radius * 2;\n wave.style.cssText = `width:${size}px;height:${size}px;left:${cx - radius}px;top:${cy - radius}px;background:${this.str('color', 'currentColor')}`;\n this.append(wave);\n const opacity = this.num('opacity', 0.22);\n const duration = this.num('duration', 550);\n const frames = this.reduced\n ? [{ opacity }, { opacity: 0 }]\n : [\n { transform: 'scale(0)', opacity },\n { transform: 'scale(1)', opacity, offset: 0.7 },\n { transform: 'scale(1)', opacity: 0 },\n ];\n const a = this.motion(wave, frames, { duration: this.reduced ? 300 : duration, easing: EASE_OUT, fill: 'forwards' });\n if (a) a.onfinish = () => wave.remove();\n else setTimeout(() => wave.remove(), 0);\n }\n },\n { id: 'ripple', text: css }\n );\n}\n","import { defineElement, raf, caf, type UsaElement } from '../base';\nimport css from './magnetic.css?raw';\n\n/**\n * `<usa-magnetic>` — its content leans toward the pointer when the pointer\n * comes near, and springs back when it leaves (great for CTAs and icons).\n *\n * Attributes: `strength` (0–1 share of the pointer offset, 0.35), `radius`\n * (px of attraction beyond the element's edge, 60), `disabled`. Only on\n * devices with a fine pointer that hovers; off under reduced motion.\n * Writes one `transform` per frame through `--usa-mx` / `--usa-my`.\n */\nexport type UsaMagneticElement = UsaElement;\n\nexport function defineMagnetic(tag = 'usa-magnetic'): CustomElementConstructor | undefined {\n return defineElement(\n tag,\n (Base) =>\n class UsaMagnetic extends Base {\n static get observedAttributes(): string[] {\n return ['strength', 'radius', 'disabled'];\n }\n\n private _frame = 0;\n\n mount(): void {\n if (this.reduced || this.flag('disabled')) return;\n if (typeof matchMedia === 'function' && !matchMedia('(hover: hover) and (pointer: fine)').matches) return;\n const strength = this.num('strength', 0.35);\n const radius = this.num('radius', 60);\n let x = 0;\n let y = 0;\n let active = false;\n const apply = () => {\n this._frame = 0;\n const r = this.getBoundingClientRect();\n const dx = x - (r.left + r.width / 2);\n const dy = y - (r.top + r.height / 2);\n const near = Math.abs(dx) < r.width / 2 + radius && Math.abs(dy) < r.height / 2 + radius;\n if (near) {\n active = true;\n this.setAttribute('data-active', '');\n this.style.setProperty('--usa-mx', `${(dx * strength).toFixed(2)}px`);\n this.style.setProperty('--usa-my', `${(dy * strength).toFixed(2)}px`);\n } else if (active) this.release();\n };\n this.listen(\n document,\n 'pointermove',\n (e: PointerEvent) => {\n if (e.pointerType !== 'mouse' && e.pointerType !== 'pen') return;\n x = e.clientX;\n y = e.clientY;\n if (!this._frame) this._frame = raf(apply);\n },\n { passive: true }\n );\n this.listen(document, 'pointerleave', () => this.release());\n this.listen(window, 'blur', () => this.release());\n }\n\n private release(): void {\n this.removeAttribute('data-active');\n this.style.removeProperty('--usa-mx');\n this.style.removeProperty('--usa-my');\n }\n\n unmount(): void {\n caf(this._frame);\n this._frame = 0;\n this.release();\n }\n },\n { id: 'magnetic', text: css }\n );\n}\n","import { defineElement, raf, caf, clamp, type UsaElement } from '../base';\nimport css from './tilt.css?raw';\n\n/**\n * `<usa-tilt>` — a 3D card that tilts toward the pointer, with an optional\n * glare highlight that follows it.\n *\n * Attributes: `max` (deg, 10), `scale` (1.03 while hovered), `perspective`\n * (px, 900), `glare` (add the light reflection), `reverse` (tilt away),\n * `disabled`. Off under reduced motion. Exposes `--usa-tilt-x` /\n * `--usa-tilt-y` (−1…1) for parallax layers inside the card.\n */\nexport type UsaTiltElement = UsaElement;\n\nexport function defineTilt(tag = 'usa-tilt'): CustomElementConstructor | undefined {\n return defineElement(\n tag,\n (Base) =>\n class UsaTilt extends Base {\n static get observedAttributes(): string[] {\n return ['max', 'scale', 'perspective', 'glare', 'reverse', 'disabled'];\n }\n\n private _frame = 0;\n private _glare: HTMLElement | null = null;\n\n mount(): void {\n if (this.flag('glare') && !this._glare) {\n this._glare = document.createElement('span');\n this._glare.className = 'usa-tilt-glare';\n this._glare.setAttribute('aria-hidden', 'true');\n this.append(this._glare);\n } else if (!this.flag('glare') && this._glare) {\n this._glare.remove();\n this._glare = null;\n }\n if (this.reduced || this.flag('disabled')) return;\n const max = this.num('max', 10) * (this.flag('reverse') ? -1 : 1);\n const scale = this.num('scale', 1.03);\n const persp = this.num('perspective', 900);\n let px = 0.5;\n let py = 0.5;\n let rect: DOMRect | null = null;\n const apply = () => {\n this._frame = 0;\n const nx = clamp(px * 2 - 1, -1, 1);\n const ny = clamp(py * 2 - 1, -1, 1);\n this.style.transform = `perspective(${persp}px) rotateX(${(-ny * max).toFixed(2)}deg) rotateY(${(nx * max).toFixed(2)}deg) scale(${scale})`;\n this.style.setProperty('--usa-tilt-x', nx.toFixed(3));\n this.style.setProperty('--usa-tilt-y', ny.toFixed(3));\n this.style.setProperty('--usa-glare-x', `${(px * 100).toFixed(1)}%`);\n this.style.setProperty('--usa-glare-y', `${(py * 100).toFixed(1)}%`);\n };\n this.listen(this, 'pointerenter', (e: PointerEvent) => {\n if (e.pointerType === 'touch') return;\n rect = this.getBoundingClientRect();\n this.setAttribute('data-active', '');\n });\n this.listen(this, 'pointermove', (e: PointerEvent) => {\n if (e.pointerType === 'touch') return;\n rect = rect || this.getBoundingClientRect();\n px = (e.clientX - rect.left) / (rect.width || 1);\n py = (e.clientY - rect.top) / (rect.height || 1);\n if (!this._frame) this._frame = raf(apply);\n });\n this.listen(this, 'pointerleave', () => this.reset());\n }\n\n private reset(): void {\n caf(this._frame);\n this._frame = 0;\n this.removeAttribute('data-active');\n this.style.transform = '';\n this.style.setProperty('--usa-tilt-x', '0');\n this.style.setProperty('--usa-tilt-y', '0');\n }\n\n unmount(): void {\n this.reset();\n }\n },\n { id: 'tilt', text: css }\n );\n}\n","import { defineElement, raf, caf, type UsaElement } from '../base';\nimport css from './spotlight.css?raw';\n\n/**\n * `<usa-spotlight>` — the Windows Fluent \"Reveal highlight\": a soft light\n * follows the pointer across a group of items, lighting up their borders\n * (even of neighbours) and the background of the hovered one. Put buttons,\n * tiles or menu items inside; each direct child is an item (or mark items\n * with `data-spotlight` to pick them yourself).\n *\n * Attributes: `size` (px, radius of the light, 160), `color` (default a\n * translucent white), `border` (px width of the lit border, 1),\n * `no-fill` (only light the borders). Not a motion effect, so it stays on\n * under reduced motion; off on touch-only devices.\n */\nexport type UsaSpotlightElement = UsaElement;\n\nexport function defineSpotlight(tag = 'usa-spotlight'): CustomElementConstructor | undefined {\n return defineElement(\n tag,\n (Base) =>\n class UsaSpotlight extends Base {\n static get observedAttributes(): string[] {\n return ['size', 'color', 'border'];\n }\n\n private _frame = 0;\n\n private items(): HTMLElement[] {\n const marked = Array.from(this.querySelectorAll<HTMLElement>('[data-spotlight]'));\n const items = marked.length ? marked : (Array.from(this.children) as HTMLElement[]);\n items.forEach((el) => el.classList.add('usa-spotlight-item'));\n return items;\n }\n\n mount(): void {\n const size = this.getAttribute('size');\n if (size) this.style.setProperty('--usa-spot-size', `${Number(size)}px`);\n const color = this.getAttribute('color');\n if (color) this.style.setProperty('--usa-spot-color', color);\n const border = this.getAttribute('border');\n if (border) this.style.setProperty('--usa-spot-border', `${Number(border)}px`);\n let items = this.items();\n let x = 0;\n let y = 0;\n const apply = () => {\n this._frame = 0;\n // All reads, then all writes\n const rects = items.map((el) => el.getBoundingClientRect());\n rects.forEach((r, i) => {\n items[i].style.setProperty('--usa-spot-x', `${(x - r.left).toFixed(1)}px`);\n items[i].style.setProperty('--usa-spot-y', `${(y - r.top).toFixed(1)}px`);\n });\n };\n this.listen(this, 'pointerenter', (e: PointerEvent) => {\n if (e.pointerType === 'touch') return;\n items = this.items();\n this.setAttribute('data-lit', '');\n });\n this.listen(this, 'pointermove', (e: PointerEvent) => {\n if (e.pointerType === 'touch') return;\n x = e.clientX;\n y = e.clientY;\n if (!this.hasAttribute('data-lit')) this.setAttribute('data-lit', '');\n if (!this._frame) this._frame = raf(apply);\n });\n this.listen(this, 'pointerleave', () => this.removeAttribute('data-lit'));\n }\n\n unmount(): void {\n caf(this._frame);\n this._frame = 0;\n this.removeAttribute('data-lit');\n }\n },\n { id: 'spotlight', text: css }\n );\n}\n","import { defineElement, EASE_SPRING, type UsaElement } from '../base';\nimport css from './press.css?raw';\n\n/**\n * `<usa-press>` — tactile press feedback: content dips while pressed and\n * springs back on release (the Fluent \"pointer down\" scale), or bounces once\n * on click with `bounce`.\n *\n * Attributes: `scale` (pressed scale, 0.95), `bounce` (overshoot on\n * release), `disabled`. Works with mouse, touch, pen and Space/Enter.\n * Reduced motion: a subtle dim instead of scaling.\n */\nexport interface UsaPressElement extends UsaElement {\n readonly pressed: boolean;\n}\n\nexport function definePress(tag = 'usa-press'): CustomElementConstructor | undefined {\n return defineElement(\n tag,\n (Base) =>\n class UsaPress extends Base {\n static get observedAttributes(): string[] {\n return ['disabled'];\n }\n\n private _anim: Animation | null = null;\n private _down = false;\n\n get pressed(): boolean {\n return this._down;\n }\n\n private frame(down: boolean): Keyframe {\n if (this.reduced) return { opacity: down ? 0.7 : 1 };\n return { transform: down ? `scale(${this.num('scale', 0.95)})` : 'scale(1)' };\n }\n\n private down(): void {\n if (this._down || this.flag('disabled')) return;\n this._down = true;\n this.setAttribute('data-pressed', '');\n const from = this.currentFrame();\n this._anim?.cancel();\n this._anim = this.motion(this, [from, this.frame(true)], { duration: 120, easing: 'cubic-bezier(0.3, 0, 0.7, 1)', fill: 'forwards' });\n }\n\n private up(): void {\n if (!this._down) return;\n this._down = false;\n this.removeAttribute('data-pressed');\n const from = this.currentFrame();\n this._anim?.cancel();\n const frames: Keyframe[] =\n this.flag('bounce') && !this.reduced\n ? [from, { transform: 'scale(1.06)', offset: 0.45 }, { transform: 'scale(0.99)', offset: 0.75 }, this.frame(false)]\n : [from, this.frame(false)];\n const a = this.motion(this, frames, { duration: this.flag('bounce') ? 480 : 320, easing: EASE_SPRING });\n this._anim = a;\n if (a) a.onfinish = () => this._anim === a && (this._anim = null);\n }\n\n private currentFrame(): Keyframe {\n if (typeof getComputedStyle !== 'function') return this.frame(false);\n const cs = getComputedStyle(this);\n return this.reduced ? { opacity: cs.opacity || '1' } : { transform: cs.transform && cs.transform !== 'none' ? cs.transform : 'scale(1)' };\n }\n\n mount(): void {\n this.listen(this, 'pointerdown', (e: PointerEvent) => {\n if (e.pointerType === 'mouse' && e.button !== 0) return;\n this.down();\n });\n for (const t of ['pointerup', 'pointerleave', 'pointercancel', 'blur']) this.listen(this, t, () => this.up());\n this.listen(this, 'keydown', (e: KeyboardEvent) => (e.key === ' ' || e.key === 'Enter') && !e.repeat && this.down());\n this.listen(this, 'keyup', (e: KeyboardEvent) => (e.key === ' ' || e.key === 'Enter') && this.up());\n }\n\n unmount(): void {\n this._anim?.cancel();\n this._anim = null;\n this._down = false;\n }\n },\n { id: 'press', text: css }\n );\n}\n","/**\n * motionary/components/interaction — micro-interactions.\n * `<usa-ripple>`, `<usa-magnetic>`, `<usa-tilt>`, `<usa-spotlight>`,\n * `<usa-press>`.\n */\nimport { defineRipple, type UsaRippleElement } from './ripple';\nimport { defineMagnetic, type UsaMagneticElement } from './magnetic';\nimport { defineTilt, type UsaTiltElement } from './tilt';\nimport { defineSpotlight, type UsaSpotlightElement } from './spotlight';\nimport { definePress, type UsaPressElement } from './press';\n\nexport { defineRipple, defineMagnetic, defineTilt, defineSpotlight, definePress };\nexport type { UsaRippleElement, UsaMagneticElement, UsaTiltElement, UsaSpotlightElement, UsaPressElement };\n\n/** Register every component of this category under its default tag. */\nexport function defineInteractionComponents(): void {\n defineRipple();\n defineMagnetic();\n defineTilt();\n defineSpotlight();\n definePress();\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'usa-ripple': UsaRippleElement;\n 'usa-magnetic': UsaMagneticElement;\n 'usa-tilt': UsaTiltElement;\n 'usa-spotlight': UsaSpotlightElement;\n 'usa-press': UsaPressElement;\n }\n}\n"],"names":["defineElement","EASE_OUT","css","raf","caf","clamp","EASE_SPRING"],"mappings":"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"}
|
|
@@ -5,4 +5,3 @@ usa-press{display:inline-block;touch-action:manipulation;-webkit-tap-highlight-c
|
|
|
5
5
|
usa-ripple{position:relative;display:inline-block;overflow:hidden;isolation:isolate;border-radius:inherit;-webkit-tap-highlight-color:transparent}usa-ripple[block]{display:block}usa-ripple .usa-ripple-wave{position:absolute;border-radius:50%;pointer-events:none;transform:scale(0);z-index:-1;will-change:transform,opacity}
|
|
6
6
|
usa-spotlight{display:block;--usa-spot-size:160px;--usa-spot-color:rgb(255 255 255 / 0.55);--usa-spot-border:1px}usa-spotlight .usa-spotlight-item{position:relative;isolation:isolate}usa-spotlight .usa-spotlight-item::before,usa-spotlight .usa-spotlight-item::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity 0.25s ease}usa-spotlight .usa-spotlight-item::before{padding:var(--usa-spot-border);background:radial-gradient(var(--usa-spot-size) circle at var(--usa-spot-x,-999px) var(--usa-spot-y,-999px),var(--usa-spot-color),transparent 70%);-webkit-mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}usa-spotlight .usa-spotlight-item::after{z-index:-1;background:radial-gradient(calc(var(--usa-spot-size) * 0.9) circle at var(--usa-spot-x,-999px) var(--usa-spot-y,-999px),color-mix(in srgb,var(--usa-spot-color) 30%,transparent),transparent 70%)}usa-spotlight[data-lit] .usa-spotlight-item::before{opacity:1}usa-spotlight[data-lit] .usa-spotlight-item:hover::after{opacity:1}usa-spotlight[no-fill] .usa-spotlight-item::after{display:none}
|
|
7
7
|
usa-tilt{display:block;position:relative;transform-style:preserve-3d;transition:transform 0.5s cubic-bezier(0.22,1,0.36,1);will-change:transform}usa-tilt[data-active]{transition-duration:0.12s}usa-tilt .usa-tilt-glare{position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity 0.3s ease;background:radial-gradient(circle at var(--usa-glare-x,50%) var(--usa-glare-y,50%),rgb(255 255 255 / 0.35),transparent 55%);mix-blend-mode:soft-light}usa-tilt[data-active] .usa-tilt-glare{opacity:1}
|
|
8
|
-
usa-toggle{--usa-toggle-w:40px;--usa-toggle-h:20px;--usa-toggle-on:var(--usa-accent,#7c5cff);--usa-toggle-off:transparent;--usa-toggle-line:currentColor;display:inline-flex;align-items:center;gap:0.6em;cursor:pointer;user-select:none;-webkit-tap-highlight-color:transparent;vertical-align:middle}usa-toggle[disabled]{cursor:not-allowed;opacity:0.45}usa-toggle .usa-toggle-track{position:relative;flex:none;width:var(--usa-toggle-w);height:var(--usa-toggle-h);border-radius:999px;box-sizing:border-box;border:1px solid color-mix(in srgb,var(--usa-toggle-line) 60%,transparent);background:var(--usa-toggle-off);transition:background-color 0.2s ease,border-color 0.2s ease}usa-toggle .usa-toggle-knob{position:absolute;top:50%;left:3px;width:calc(var(--usa-toggle-h) - 8px);height:calc(var(--usa-toggle-h) - 8px);margin-top:calc((var(--usa-toggle-h) - 8px) / -2);border-radius:999px;background:color-mix(in srgb,var(--usa-toggle-line) 75%,transparent);transform-origin:left center;transition:transform 0.28s cubic-bezier(0.34,1.4,0.64,1),background-color 0.2s ease}usa-toggle:hover .usa-toggle-knob{transform:scale(1.15)}usa-toggle[data-pressed] .usa-toggle-knob{transform:scaleX(1.45)}usa-toggle[checked] .usa-toggle-track{background:var(--usa-toggle-on);border-color:var(--usa-toggle-on)}usa-toggle[checked] .usa-toggle-knob{background:#fff;transform:translateX(calc(var(--usa-toggle-w) - var(--usa-toggle-h)));transform-origin:right center}usa-toggle[checked]:hover .usa-toggle-knob{transform:translateX(calc(var(--usa-toggle-w) - var(--usa-toggle-h))) scale(1.15)}usa-toggle[checked][data-pressed] .usa-toggle-knob{transform:translateX(calc(var(--usa-toggle-w) - var(--usa-toggle-h) - 4px)) scaleX(1.45)}usa-toggle:focus-visible{outline:none}usa-toggle:focus-visible .usa-toggle-track{outline:2px solid var(--usa-toggle-on);outline-offset:2px}
|
|
@@ -75,27 +75,10 @@ interface UsaPressElement extends UsaElement {
|
|
|
75
75
|
}
|
|
76
76
|
declare function definePress(tag?: string): CustomElementConstructor | undefined;
|
|
77
77
|
|
|
78
|
-
/**
|
|
79
|
-
* `<usa-toggle>` — an accessible switch whose knob stretches while pressed
|
|
80
|
-
* and glides across (the Windows 11 / iOS toggle). `role="switch"`,
|
|
81
|
-
* keyboard (Space / Enter), and form-associated where `ElementInternals`
|
|
82
|
-
* exists (submits `value`, default `"on"`, under `name` when checked).
|
|
83
|
-
*
|
|
84
|
-
* Attributes: `checked`, `disabled`, `name`, `value`, `label`
|
|
85
|
-
* (accessible name if there is no `aria-label` / `<label>`). Events:
|
|
86
|
-
* `change` and `usa:change` (`detail.checked`). Reduced motion: no glide.
|
|
87
|
-
*/
|
|
88
|
-
interface UsaToggleElement extends UsaElement {
|
|
89
|
-
checked: boolean;
|
|
90
|
-
disabled: boolean;
|
|
91
|
-
toggle(force?: boolean): void;
|
|
92
|
-
}
|
|
93
|
-
declare function defineToggle(tag?: string): CustomElementConstructor | undefined;
|
|
94
|
-
|
|
95
78
|
/**
|
|
96
79
|
* motionary/components/interaction — micro-interactions.
|
|
97
80
|
* `<usa-ripple>`, `<usa-magnetic>`, `<usa-tilt>`, `<usa-spotlight>`,
|
|
98
|
-
* `<usa-press
|
|
81
|
+
* `<usa-press>`.
|
|
99
82
|
*/
|
|
100
83
|
|
|
101
84
|
/** Register every component of this category under its default tag. */
|
|
@@ -107,9 +90,8 @@ declare global {
|
|
|
107
90
|
'usa-tilt': UsaTiltElement;
|
|
108
91
|
'usa-spotlight': UsaSpotlightElement;
|
|
109
92
|
'usa-press': UsaPressElement;
|
|
110
|
-
'usa-toggle': UsaToggleElement;
|
|
111
93
|
}
|
|
112
94
|
}
|
|
113
95
|
|
|
114
|
-
export { defineInteractionComponents, defineMagnetic, definePress, defineRipple, defineSpotlight, defineTilt
|
|
115
|
-
export type { UsaMagneticElement, UsaPressElement, UsaRippleElement, UsaSpotlightElement, UsaTiltElement
|
|
96
|
+
export { defineInteractionComponents, defineMagnetic, definePress, defineRipple, defineSpotlight, defineTilt };
|
|
97
|
+
export type { UsaMagneticElement, UsaPressElement, UsaRippleElement, UsaSpotlightElement, UsaTiltElement };
|
|
@@ -75,27 +75,10 @@ interface UsaPressElement extends UsaElement {
|
|
|
75
75
|
}
|
|
76
76
|
declare function definePress(tag?: string): CustomElementConstructor | undefined;
|
|
77
77
|
|
|
78
|
-
/**
|
|
79
|
-
* `<usa-toggle>` — an accessible switch whose knob stretches while pressed
|
|
80
|
-
* and glides across (the Windows 11 / iOS toggle). `role="switch"`,
|
|
81
|
-
* keyboard (Space / Enter), and form-associated where `ElementInternals`
|
|
82
|
-
* exists (submits `value`, default `"on"`, under `name` when checked).
|
|
83
|
-
*
|
|
84
|
-
* Attributes: `checked`, `disabled`, `name`, `value`, `label`
|
|
85
|
-
* (accessible name if there is no `aria-label` / `<label>`). Events:
|
|
86
|
-
* `change` and `usa:change` (`detail.checked`). Reduced motion: no glide.
|
|
87
|
-
*/
|
|
88
|
-
interface UsaToggleElement extends UsaElement {
|
|
89
|
-
checked: boolean;
|
|
90
|
-
disabled: boolean;
|
|
91
|
-
toggle(force?: boolean): void;
|
|
92
|
-
}
|
|
93
|
-
declare function defineToggle(tag?: string): CustomElementConstructor | undefined;
|
|
94
|
-
|
|
95
78
|
/**
|
|
96
79
|
* motionary/components/interaction — micro-interactions.
|
|
97
80
|
* `<usa-ripple>`, `<usa-magnetic>`, `<usa-tilt>`, `<usa-spotlight>`,
|
|
98
|
-
* `<usa-press
|
|
81
|
+
* `<usa-press>`.
|
|
99
82
|
*/
|
|
100
83
|
|
|
101
84
|
/** Register every component of this category under its default tag. */
|
|
@@ -107,9 +90,8 @@ declare global {
|
|
|
107
90
|
'usa-tilt': UsaTiltElement;
|
|
108
91
|
'usa-spotlight': UsaSpotlightElement;
|
|
109
92
|
'usa-press': UsaPressElement;
|
|
110
|
-
'usa-toggle': UsaToggleElement;
|
|
111
93
|
}
|
|
112
94
|
}
|
|
113
95
|
|
|
114
|
-
export { defineInteractionComponents, defineMagnetic, definePress, defineRipple, defineSpotlight, defineTilt
|
|
115
|
-
export type { UsaMagneticElement, UsaPressElement, UsaRippleElement, UsaSpotlightElement, UsaTiltElement
|
|
96
|
+
export { defineInteractionComponents, defineMagnetic, definePress, defineRipple, defineSpotlight, defineTilt };
|
|
97
|
+
export type { UsaMagneticElement, UsaPressElement, UsaRippleElement, UsaSpotlightElement, UsaTiltElement };
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { y as defineElement, z as EASE_OUT, r as raf, l as caf, k as clamp, E as EASE_SPRING } from '../chunks/base-DchG4q_S.js';
|
|
2
2
|
|
|
3
|
-
var css$
|
|
3
|
+
var css$4 = "usa-ripple{position:relative;display:inline-block;overflow:hidden;isolation:isolate;border-radius:inherit;-webkit-tap-highlight-color:transparent}usa-ripple[block]{display:block}usa-ripple .usa-ripple-wave{position:absolute;border-radius:50%;pointer-events:none;transform:scale(0);z-index:-1;will-change:transform,opacity}";
|
|
4
4
|
|
|
5
5
|
function defineRipple(tag = 'usa-ripple') {
|
|
6
6
|
return defineElement(tag, (Base) => class UsaRipple extends Base {
|
|
@@ -47,10 +47,10 @@ function defineRipple(tag = 'usa-ripple') {
|
|
|
47
47
|
else
|
|
48
48
|
setTimeout(() => wave.remove(), 0);
|
|
49
49
|
}
|
|
50
|
-
}, { id: 'ripple', text: css$
|
|
50
|
+
}, { id: 'ripple', text: css$4 });
|
|
51
51
|
}
|
|
52
52
|
|
|
53
|
-
var css$
|
|
53
|
+
var css$3 = "usa-magnetic{display:inline-block}usa-magnetic>*{transform:translate3d(var(--usa-mx,0px),var(--usa-my,0px),0);transition:transform 0.6s cubic-bezier(0.34,1.56,0.64,1)}usa-magnetic[data-active]>*{transition-duration:0.15s;transition-timing-function:ease-out}@media (prefers-reduced-motion:reduce){usa-magnetic>*,usa-tilt,usa-toggle .usa-toggle-knob{transition:none}}";
|
|
54
54
|
|
|
55
55
|
function defineMagnetic(tag = 'usa-magnetic') {
|
|
56
56
|
return defineElement(tag, (Base) => class UsaMagnetic extends Base {
|
|
@@ -107,10 +107,10 @@ function defineMagnetic(tag = 'usa-magnetic') {
|
|
|
107
107
|
this._frame = 0;
|
|
108
108
|
this.release();
|
|
109
109
|
}
|
|
110
|
-
}, { id: 'magnetic', text: css$
|
|
110
|
+
}, { id: 'magnetic', text: css$3 });
|
|
111
111
|
}
|
|
112
112
|
|
|
113
|
-
var css$
|
|
113
|
+
var css$2 = "usa-tilt{display:block;position:relative;transform-style:preserve-3d;transition:transform 0.5s cubic-bezier(0.22,1,0.36,1);will-change:transform}usa-tilt[data-active]{transition-duration:0.12s}usa-tilt .usa-tilt-glare{position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity 0.3s ease;background:radial-gradient(circle at var(--usa-glare-x,50%) var(--usa-glare-y,50%),rgb(255 255 255 / 0.35),transparent 55%);mix-blend-mode:soft-light}usa-tilt[data-active] .usa-tilt-glare{opacity:1}";
|
|
114
114
|
|
|
115
115
|
function defineTilt(tag = 'usa-tilt') {
|
|
116
116
|
return defineElement(tag, (Base) => class UsaTilt extends Base {
|
|
@@ -179,10 +179,10 @@ function defineTilt(tag = 'usa-tilt') {
|
|
|
179
179
|
unmount() {
|
|
180
180
|
this.reset();
|
|
181
181
|
}
|
|
182
|
-
}, { id: 'tilt', text: css$
|
|
182
|
+
}, { id: 'tilt', text: css$2 });
|
|
183
183
|
}
|
|
184
184
|
|
|
185
|
-
var css$
|
|
185
|
+
var css$1 = "usa-spotlight{display:block;--usa-spot-size:160px;--usa-spot-color:rgb(255 255 255 / 0.55);--usa-spot-border:1px}usa-spotlight .usa-spotlight-item{position:relative;isolation:isolate}usa-spotlight .usa-spotlight-item::before,usa-spotlight .usa-spotlight-item::after{content:\"\";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity 0.25s ease}usa-spotlight .usa-spotlight-item::before{padding:var(--usa-spot-border);background:radial-gradient(var(--usa-spot-size) circle at var(--usa-spot-x,-999px) var(--usa-spot-y,-999px),var(--usa-spot-color),transparent 70%);-webkit-mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}usa-spotlight .usa-spotlight-item::after{z-index:-1;background:radial-gradient(calc(var(--usa-spot-size) * 0.9) circle at var(--usa-spot-x,-999px) var(--usa-spot-y,-999px),color-mix(in srgb,var(--usa-spot-color) 30%,transparent),transparent 70%)}usa-spotlight[data-lit] .usa-spotlight-item::before{opacity:1}usa-spotlight[data-lit] .usa-spotlight-item:hover::after{opacity:1}usa-spotlight[no-fill] .usa-spotlight-item::after{display:none}";
|
|
186
186
|
|
|
187
187
|
function defineSpotlight(tag = 'usa-spotlight') {
|
|
188
188
|
return defineElement(tag, (Base) => class UsaSpotlight extends Base {
|
|
@@ -244,10 +244,10 @@ function defineSpotlight(tag = 'usa-spotlight') {
|
|
|
244
244
|
this._frame = 0;
|
|
245
245
|
this.removeAttribute('data-lit');
|
|
246
246
|
}
|
|
247
|
-
}, { id: 'spotlight', text: css$
|
|
247
|
+
}, { id: 'spotlight', text: css$1 });
|
|
248
248
|
}
|
|
249
249
|
|
|
250
|
-
var css
|
|
250
|
+
var css = "usa-press{display:inline-block;touch-action:manipulation;-webkit-tap-highlight-color:transparent}usa-press[block]{display:block}";
|
|
251
251
|
|
|
252
252
|
function definePress(tag = 'usa-press') {
|
|
253
253
|
return defineElement(tag, (Base) => class UsaPress extends Base {
|
|
@@ -313,94 +313,13 @@ function definePress(tag = 'usa-press') {
|
|
|
313
313
|
this._anim = null;
|
|
314
314
|
this._down = false;
|
|
315
315
|
}
|
|
316
|
-
}, { id: 'press', text: css
|
|
317
|
-
}
|
|
318
|
-
|
|
319
|
-
var css = "usa-toggle{--usa-toggle-w:40px;--usa-toggle-h:20px;--usa-toggle-on:var(--usa-accent,#7c5cff);--usa-toggle-off:transparent;--usa-toggle-line:currentColor;display:inline-flex;align-items:center;gap:0.6em;cursor:pointer;user-select:none;-webkit-tap-highlight-color:transparent;vertical-align:middle}usa-toggle[disabled]{cursor:not-allowed;opacity:0.45}usa-toggle .usa-toggle-track{position:relative;flex:none;width:var(--usa-toggle-w);height:var(--usa-toggle-h);border-radius:999px;box-sizing:border-box;border:1px solid color-mix(in srgb,var(--usa-toggle-line) 60%,transparent);background:var(--usa-toggle-off);transition:background-color 0.2s ease,border-color 0.2s ease}usa-toggle .usa-toggle-knob{position:absolute;top:50%;left:3px;width:calc(var(--usa-toggle-h) - 8px);height:calc(var(--usa-toggle-h) - 8px);margin-top:calc((var(--usa-toggle-h) - 8px) / -2);border-radius:999px;background:color-mix(in srgb,var(--usa-toggle-line) 75%,transparent);transform-origin:left center;transition:transform 0.28s cubic-bezier(0.34,1.4,0.64,1),background-color 0.2s ease}usa-toggle:hover .usa-toggle-knob{transform:scale(1.15)}usa-toggle[data-pressed] .usa-toggle-knob{transform:scaleX(1.45)}usa-toggle[checked] .usa-toggle-track{background:var(--usa-toggle-on);border-color:var(--usa-toggle-on)}usa-toggle[checked] .usa-toggle-knob{background:#fff;transform:translateX(calc(var(--usa-toggle-w) - var(--usa-toggle-h)));transform-origin:right center}usa-toggle[checked]:hover .usa-toggle-knob{transform:translateX(calc(var(--usa-toggle-w) - var(--usa-toggle-h))) scale(1.15)}usa-toggle[checked][data-pressed] .usa-toggle-knob{transform:translateX(calc(var(--usa-toggle-w) - var(--usa-toggle-h) - 4px)) scaleX(1.45)}usa-toggle:focus-visible{outline:none}usa-toggle:focus-visible .usa-toggle-track{outline:2px solid var(--usa-toggle-on);outline-offset:2px}";
|
|
320
|
-
|
|
321
|
-
function defineToggle(tag = 'usa-toggle') {
|
|
322
|
-
return defineElement(tag, (Base) => { var _a; return _a = class UsaToggle extends Base {
|
|
323
|
-
static get observedAttributes() {
|
|
324
|
-
return ['checked', 'disabled', 'label'];
|
|
325
|
-
}
|
|
326
|
-
constructor() {
|
|
327
|
-
super();
|
|
328
|
-
this._internals = null;
|
|
329
|
-
try {
|
|
330
|
-
this._internals = typeof this.attachInternals === 'function' ? this.attachInternals() : null;
|
|
331
|
-
}
|
|
332
|
-
catch {
|
|
333
|
-
this._internals = null;
|
|
334
|
-
}
|
|
335
|
-
}
|
|
336
|
-
get checked() {
|
|
337
|
-
return this.hasAttribute('checked');
|
|
338
|
-
}
|
|
339
|
-
set checked(v) {
|
|
340
|
-
this.toggleAttribute('checked', !!v);
|
|
341
|
-
}
|
|
342
|
-
get disabled() {
|
|
343
|
-
return this.hasAttribute('disabled');
|
|
344
|
-
}
|
|
345
|
-
set disabled(v) {
|
|
346
|
-
this.toggleAttribute('disabled', !!v);
|
|
347
|
-
}
|
|
348
|
-
changed() {
|
|
349
|
-
this.sync();
|
|
350
|
-
}
|
|
351
|
-
sync() {
|
|
352
|
-
this.setAttribute('aria-checked', String(this.checked));
|
|
353
|
-
this.setAttribute('aria-disabled', String(this.disabled));
|
|
354
|
-
this.tabIndex = this.disabled ? -1 : 0;
|
|
355
|
-
const label = this.getAttribute('label');
|
|
356
|
-
if (label && !this.hasAttribute('aria-label'))
|
|
357
|
-
this.setAttribute('aria-label', label);
|
|
358
|
-
this._internals?.setFormValue?.(this.checked ? this.str('value', 'on') : null);
|
|
359
|
-
}
|
|
360
|
-
mount() {
|
|
361
|
-
if (!this.querySelector(':scope > .usa-toggle-track')) {
|
|
362
|
-
const track = document.createElement('span');
|
|
363
|
-
track.className = 'usa-toggle-track';
|
|
364
|
-
track.setAttribute('aria-hidden', 'true');
|
|
365
|
-
const knob = document.createElement('span');
|
|
366
|
-
knob.className = 'usa-toggle-knob';
|
|
367
|
-
track.append(knob);
|
|
368
|
-
this.prepend(track);
|
|
369
|
-
}
|
|
370
|
-
this.setAttribute('role', 'switch');
|
|
371
|
-
this.sync();
|
|
372
|
-
this.listen(this, 'click', () => this.toggle());
|
|
373
|
-
this.listen(this, 'keydown', (e) => {
|
|
374
|
-
if (e.key === ' ' || e.key === 'Enter') {
|
|
375
|
-
e.preventDefault();
|
|
376
|
-
if (!e.repeat)
|
|
377
|
-
this.toggle();
|
|
378
|
-
}
|
|
379
|
-
});
|
|
380
|
-
this.listen(this, 'pointerdown', () => !this.disabled && this.setAttribute('data-pressed', ''));
|
|
381
|
-
for (const t of ['pointerup', 'pointerleave', 'pointercancel'])
|
|
382
|
-
this.listen(this, t, () => this.removeAttribute('data-pressed'));
|
|
383
|
-
}
|
|
384
|
-
toggle(force) {
|
|
385
|
-
if (this.disabled)
|
|
386
|
-
return;
|
|
387
|
-
const next = force === undefined ? !this.checked : force;
|
|
388
|
-
if (next === this.checked)
|
|
389
|
-
return;
|
|
390
|
-
this.checked = next;
|
|
391
|
-
this.sync();
|
|
392
|
-
this.dispatchEvent(new Event('change', { bubbles: true }));
|
|
393
|
-
this.emit('change', { checked: next });
|
|
394
|
-
}
|
|
395
|
-
},
|
|
396
|
-
_a.formAssociated = true,
|
|
397
|
-
_a; }, { id: 'toggle', text: css });
|
|
316
|
+
}, { id: 'press', text: css });
|
|
398
317
|
}
|
|
399
318
|
|
|
400
319
|
/**
|
|
401
320
|
* motionary/components/interaction — micro-interactions.
|
|
402
321
|
* `<usa-ripple>`, `<usa-magnetic>`, `<usa-tilt>`, `<usa-spotlight>`,
|
|
403
|
-
* `<usa-press
|
|
322
|
+
* `<usa-press>`.
|
|
404
323
|
*/
|
|
405
324
|
/** Register every component of this category under its default tag. */
|
|
406
325
|
function defineInteractionComponents() {
|
|
@@ -409,8 +328,7 @@ function defineInteractionComponents() {
|
|
|
409
328
|
defineTilt();
|
|
410
329
|
defineSpotlight();
|
|
411
330
|
definePress();
|
|
412
|
-
defineToggle();
|
|
413
331
|
}
|
|
414
332
|
|
|
415
|
-
export { defineInteractionComponents, defineMagnetic, definePress, defineRipple, defineSpotlight, defineTilt
|
|
333
|
+
export { defineInteractionComponents, defineMagnetic, definePress, defineRipple, defineSpotlight, defineTilt };
|
|
416
334
|
//# sourceMappingURL=interaction.js.map
|