@arolariu/components/dist/cjs/components/ui/counting-number.cjs.map

🎨 60+ beautiful, accessible React components built on Radix UI. TypeScript-first, tree-shakeable, SSR-ready. Perfect for modern web apps, design systems & rapid prototyping. Zero config, maximum flexibility! ⚡

{"version":3,"file":"components\\ui\\counting-number.cjs","sources":["webpack://@arolariu/components/webpack/runtime/define_property_getters","webpack://@arolariu/components/webpack/runtime/has_own_property","webpack://@arolariu/components/webpack/runtime/make_namespace_object","webpack://@arolariu/components/./src/components/ui/counting-number.tsx"],"sourcesContent":["__webpack_require__.d = (exports, definition) => {\n\tfor(var key in definition) {\n        if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {\n            Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });\n        }\n    }\n};","__webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))","// define __esModule on exports\n__webpack_require__.r = (exports) => {\n\tif(typeof Symbol !== 'undefined' && Symbol.toStringTag) {\n\t\tObject.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });\n\t}\n\tObject.defineProperty(exports, '__esModule', { value: true });\n};","\n\nimport * as React from \"react\";\nimport {\n  type SpringOptions,\n  type UseInViewOptions,\n  useInView,\n  useMotionValue,\n  useSpring,\n} from \"motion/react\";\n\ninterface CountingNumberProps extends React.HTMLAttributes<HTMLSpanElement> {\n  number: number;\n  fromNumber?: number;\n  padStart?: boolean;\n  inView?: boolean;\n  inViewMargin?: UseInViewOptions[\"margin\"];\n  inViewOnce?: boolean;\n  decimalSeparator?: string;\n  transition?: SpringOptions;\n  decimalPlaces?: number;\n}\n\nconst CountingNumber = React.forwardRef<HTMLSpanElement, CountingNumberProps>(\n  (\n    {\n      number,\n      fromNumber = 0,\n      padStart = false,\n      inView = false,\n      inViewMargin = \"0px\",\n      inViewOnce = true,\n      decimalSeparator = \".\",\n      transition = { stiffness: 90, damping: 50 },\n      decimalPlaces = 0,\n      className,\n      ...props\n    },\n    ref,\n  ) => {\n    const localRef = React.useRef<HTMLSpanElement>(null);\n    React.useImperativeHandle(ref, () => localRef.current as HTMLSpanElement);\n\n    const numberStr = number.toString();\n    const decimals =\n      typeof decimalPlaces === \"number\"\n        ? decimalPlaces\n        : numberStr.includes(\".\")\n          ? numberStr.split(\".\")[1].length\n          : 0;\n\n    const motionVal = useMotionValue(fromNumber);\n    const springVal = useSpring(motionVal, transition);\n    const inViewResult = useInView(localRef, {\n      once: inViewOnce,\n      margin: inViewMargin,\n    });\n    const isInView = !inView || inViewResult;\n\n    React.useEffect(() => {\n      if (isInView) motionVal.set(number);\n    }, [isInView, number, motionVal]);\n\n    React.useEffect(() => {\n      const unsubscribe = springVal.on(\"change\", (latest) => {\n        if (localRef.current) {\n          let formatted =\n            decimals > 0\n              ? latest.toFixed(decimals)\n              : Math.round(latest).toString();\n\n          if (decimals > 0) {\n            formatted = formatted.replace(\".\", decimalSeparator);\n          }\n\n          if (padStart) {\n            const finalIntLength = Math.floor(Math.abs(number)).toString()\n              .length;\n            const [intPart, fracPart] = formatted.split(decimalSeparator);\n            const paddedInt = intPart.padStart(finalIntLength, \"0\");\n            formatted = fracPart\n              ? `${paddedInt}${decimalSeparator}${fracPart}`\n              : paddedInt;\n          }\n\n          localRef.current.textContent = formatted;\n        }\n      });\n      return () => unsubscribe();\n    }, [springVal, decimals, padStart, number, decimalSeparator]);\n\n    const finalIntLength = Math.floor(Math.abs(number)).toString().length;\n    const initialText = padStart\n      ? \"0\".padStart(finalIntLength, \"0\") +\n        (decimals > 0 ? decimalSeparator + \"0\".repeat(decimals) : \"\")\n      : \"0\" + (decimals > 0 ? decimalSeparator + \"0\".repeat(decimals) : \"\");\n\n    return (\n      <span ref={localRef} className={className} {...props}>\n        {initialText}\n      </span>\n    );\n  },\n);\n\nCountingNumber.displayName = \"CountingNumber\";\n\nexport { CountingNumber, type CountingNumberProps };\n"],"names":["__webpack_require__","definition","key","Object","obj","prop","Symbol","CountingNumber","React","number","fromNumber","padStart","inView","inViewMargin","inViewOnce","decimalSeparator","transition","decimalPlaces","className","props","ref","localRef","numberStr","decimals","motionVal","useMotionValue","springVal","useSpring","inViewResult","useInView","isInView","unsubscribe","latest","formatted","Math","finalIntLength","intPart","fracPart","paddedInt","initialText"],"mappings":"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"}