{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "motion",
  "type": "registry:lib",
  "title": "Motion presets",
  "description": "The spring, duration and easing presets FewTone UI components animate with, for motion/react.",
  "author": "FewTone <https://fewtone.com>",
  "dependencies": [
    "motion@^14.0.0"
  ],
  "files": [
    {
      "path": "registry/fewtone/lib/motion.ts",
      "type": "registry:lib",
      "content": "import type { Transition } from \"motion/react\";\n\n/*\n * Motion tokens for JavaScript animations (motion/react).\n * Durations and easings mirror the CSS tokens in src/styles/tokens.css;\n * `pnpm check:tokens` fails if the two drift apart.\n */\n\n/** Durations in seconds. Mirrors --duration-* in tokens.css. */\nexport const duration = {\n  instant: 0.08,\n  fast: 0.15,\n  base: 0.22,\n  slow: 0.35,\n  slower: 0.5,\n} as const;\n\n/** Cubic-bezier easings. Mirrors --ease-* in tokens.css. */\nexport const ease = {\n  out: [0.22, 1, 0.36, 1],\n  in: [0.55, 0, 1, 0.45],\n  inOut: [0.65, 0, 0.35, 1],\n} as const;\n\n/**\n * Named springs: the library's motion voice.\n * - snappy: quick, almost no overshoot. Toggles, tabs, small controls.\n * - smooth: slow and settled. Panels, sidebars, page sections.\n * - bouncy: playful overshoot. Rare, for moments of delight.\n */\nexport const spring = {\n  snappy: { type: \"spring\", stiffness: 520, damping: 38, mass: 1 },\n  smooth: { type: \"spring\", stiffness: 120, damping: 20, mass: 1 },\n  bouncy: { type: \"spring\", stiffness: 300, damping: 15, mass: 1 },\n} as const satisfies Record<string, Transition>;\n\nexport type SpringName = keyof typeof spring;\n\n/**\n * The blur (owner, 2026-10-15): content that appears, leaves or swaps sharpens in from a 6px blur as it\n * fades, instead of only fading. Pair it with the movement the pattern already has. Not for fills,\n * highlights, hover or anything full-screen (those still fade), and with reduced motion it's opacity only.\n * The CSS keyframes in tokens.css use the same 6px (checked by `pnpm check:tokens`).\n */\nexport const blur = { hidden: \"blur(6px)\", shown: \"blur(0px)\" } as const;\n\n/** Swapping content in place (Loading Button, Copy Button): the new rises 6px from blurred; the old lifts away blurring */\nexport const swap = {\n  initial: { opacity: 0, filter: blur.hidden, y: 6 },\n  animate: { opacity: 1, filter: blur.shown, y: 0 },\n  exit: { opacity: 0, filter: blur.hidden, y: -6 },\n} as const;\n\n/**\n * The flow of a changing number (Number Ticker): a spring for the characters' moves, the width and the digits'\n * spin, sampled into CSS linear(), and a fade for characters coming and going. Web Animations timings, in\n * milliseconds. The curve is from number-flow, © 2024 Maxwell Barvian, MIT licence (its full notice is in\n * components/number-ticker/number-ticker.tsx).\n */\nexport const flow = {\n  transform: {\n    duration: 900,\n    easing:\n      \"linear(0,.005,.019,.039,.066,.096,.129,.165,.202,.24,.278,.316,.354,.39,.426,.461,.494,.526,.557,.586,.614,.64,.665,.689,.711,.731,.751,.769,.786,.802,.817,.831,.844,.856,.867,.877,.887,.896,.904,.912,.919,.925,.931,.937,.942,.947,.951,.955,.959,.962,.965,.968,.971,.973,.976,.978,.98,.981,.983,.984,.986,.987,.988,.989,.99,.991,.992,.992,.993,.994,.994,.995,.995,.996,.996,.9963,.9967,.9969,.9972,.9975,.9977,.9979,.9981,.9982,.9984,.9985,.9987,.9988,.9989,1)\",\n  },\n  opacity: { duration: 450, easing: \"ease-out\" },\n} as const satisfies Record<string, EffectTiming>;\n"
    }
  ]
}