Skip to content
zidane
UI kit reference

motion/shimmer

import { … } from 'zidane-ui'ui/src/motion/shimmer.ts

Functions#

syncShimmerFunction#

Ref callback for a .zg-shimmer label: starts its sweep on a shared phase (the page clock), so a label swapped in mid-sweep carries the band on from where the outgoing one had it, instead of restarting it.

TypeScript
function syncShimmer(el: HTMLElement | null): void

Parameters

Parameters
NameTypeDescription
elHTMLElement | null

The label element, or null when the ref detaches, which does nothing.

ui/src/motion/shimmer.ts:13

Constants#

SHIMMER_MSConstant#

One sweep of .zg-shimmer; must match its animation in styles/motion.css.

TypeScript
const SHIMMER_MS = 1800

ui/src/motion/shimmer.ts:4