@raex-ui/ink-bloom 0.1.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.
@@ -0,0 +1,9 @@
1
+ import * as react_jsx_runtime from 'react/jsx-runtime';
2
+
3
+ interface Props {
4
+ value: number;
5
+ size: number;
6
+ }
7
+ declare function InkBloom({ value, size }: Props): react_jsx_runtime.JSX.Element;
8
+
9
+ export { InkBloom };
@@ -0,0 +1,9 @@
1
+ import * as react_jsx_runtime from 'react/jsx-runtime';
2
+
3
+ interface Props {
4
+ value: number;
5
+ size: number;
6
+ }
7
+ declare function InkBloom({ value, size }: Props): react_jsx_runtime.JSX.Element;
8
+
9
+ export { InkBloom };
package/dist/index.js ADDED
@@ -0,0 +1,90 @@
1
+ "use client";
2
+ "use strict";
3
+ var __defProp = Object.defineProperty;
4
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
+ var __getOwnPropNames = Object.getOwnPropertyNames;
6
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
7
+ var __export = (target, all) => {
8
+ for (var name in all)
9
+ __defProp(target, name, { get: all[name], enumerable: true });
10
+ };
11
+ var __copyProps = (to, from, except, desc) => {
12
+ if (from && typeof from === "object" || typeof from === "function") {
13
+ for (let key of __getOwnPropNames(from))
14
+ if (!__hasOwnProp.call(to, key) && key !== except)
15
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
16
+ }
17
+ return to;
18
+ };
19
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
20
+
21
+ // src/index.ts
22
+ var index_exports = {};
23
+ __export(index_exports, {
24
+ InkBloom: () => InkBloom
25
+ });
26
+ module.exports = __toCommonJS(index_exports);
27
+
28
+ // src/ink-bloom.tsx
29
+ var import_react = require("react");
30
+ var import_framer_motion = require("framer-motion");
31
+
32
+ // src/digit-paths.ts
33
+ var DIGIT_PATHS = {
34
+ 0: "M32.5,6 L32.5,6 Q40,6 45.7,11.1 Q51.4,16.1 54.7,25.3 Q58,34.4 58,46.7 L58,46.7 Q58,59 54.7,68.8 Q51.4,78.6 45.4,84.3 Q39.5,90 31.5,90 L31.5,90 Q24.2,90 18.4,84.9 Q12.6,79.9 9.3,70.7 Q6,61.4 6,49.2 L6,49.2 Q6,37 9.3,27.3 Q12.6,17.5 18.5,11.8 Q24.5,6 32.5,6 Z M31.7,8.8 L31.7,8.8 Q27.7,8.8 25,19.4 Q22.3,30 22.3,48.7 L22.3,48.7 Q22.3,62.5 23.7,71 Q25.1,79.6 27.4,83.4 Q29.7,87.2 32.3,87.2 L32.3,87.2 Q36.4,87.2 39,76.6 Q41.7,65.9 41.7,47.2 L41.7,47.2 Q41.7,33.3 40.3,24.9 Q38.9,16.4 36.6,12.6 Q34.4,8.8 31.7,8.8 Z",
35
+ 1: "M48.6,6 L48.6,6 L48.6,75.3 Q48.6,81.9 50.6,84.3 Q52.6,86.7 57.5,86.7 L57.5,86.7 L57.5,90 Q54.3,89.8 48.2,89.6 Q42.1,89.4 35.6,89.4 L35.6,89.4 Q26.9,89.4 18.9,89.6 Q10.9,89.8 6.5,90 L6.5,90 L6.5,86.7 Q13,86.7 16.5,84.1 Q20.1,81.4 20.1,73.7 L20.1,73.7 L20.1,34.7 Q20.1,27.1 18.9,23.4 Q17.7,19.8 14.7,18.7 Q11.7,17.6 6.5,17.6 L6.5,17.6 L6.5,14.1 Q21.5,13.8 31.4,12 Q41.2,10.3 48.6,6 Z",
36
+ 2: "M34.2,6 L34.2,6 Q43.2,6 48.4,11.2 Q53.6,16.5 53.6,26 L53.6,26 Q53.6,31.9 51.4,36.6 Q49.2,41.3 45.6,45.3 Q42,49.2 37.9,52.7 Q33.7,56.1 29.9,59.4 Q26,62.7 23.2,66.3 L23.2,66.3 L47.8,66.3 Q52.2,66.3 53.4,64.9 Q54.6,63.5 55.1,59.9 L55.1,59.9 L57.6,59.9 Q57.6,71.7 57.7,78.4 Q57.8,85 58,90 L58,90 Q57,89.7 54.4,89.5 Q51.8,89.4 48.4,89.3 Q45.1,89.2 41.8,89.2 L41.8,89.2 L6,89.2 L6,85.9 Q8.9,81.7 13.3,76.3 Q17.7,70.8 22,64 Q26.3,57.2 29.3,49.2 Q32.2,41.3 32.2,32.2 L32.2,32.2 Q32.2,24.3 29.8,20.6 Q27.4,16.9 22.5,16.9 L22.5,16.9 Q17.7,16.9 14.3,19.7 Q10.8,22.4 8,27.4 L8,27.4 L6.1,25.5 Q8.7,20.1 12.4,15.6 Q16,11.2 21.3,8.6 Q26.7,6 34.2,6 Z",
37
+ 3: "M32.6,6 L32.6,6 Q38.7,6 43.5,7.7 Q48.4,9.4 51.2,12.6 Q53.9,15.7 53.9,20.2 L53.9,20.2 Q53.9,24.8 50.9,28.9 Q47.8,33 41.8,36.1 Q35.8,39.2 26.9,40.5 L26.9,40.5 Q36.2,39.9 43.2,42 Q50.2,44.1 54.1,48.5 Q58,52.9 58,59.3 L58,59.3 Q58,64.9 54.9,69.7 Q51.9,74.5 46.7,78.3 Q41.5,82 34.8,84.7 Q28,87.3 20.7,88.6 Q13.3,90 6,90 L6,90 L6,87.4 Q11,87.2 16.4,85.3 Q21.8,83.5 26.5,80 Q31.2,76.5 34.1,71.3 Q37.1,66.2 37.1,59.4 L37.1,59.4 Q37.1,52.2 34,47.6 Q30.9,43 25.3,42.5 L25.3,42.5 Q23.6,43.3 22.2,43.9 Q20.7,44.6 19.1,44.6 L19.1,44.6 Q18.1,44.6 17.5,44.2 Q16.9,43.8 16.9,42.6 L16.9,42.6 Q16.9,41 18.1,40.4 Q19.3,39.8 20.9,39.8 L20.9,39.8 Q21.8,39.8 22.8,39.9 Q23.7,40 24.9,40.1 L24.9,40.1 Q29.9,36.6 31.7,32.6 Q33.6,28.6 33.6,24.5 L33.6,24.5 Q33.6,19.1 30.9,16.5 Q28.2,13.9 23.4,13.9 L23.4,13.9 Q19.1,13.9 15.3,16.1 Q11.4,18.3 8.8,22.6 L8.8,22.6 L6.8,21.4 Q9.1,17.3 12.3,13.8 Q15.5,10.3 20.4,8.1 Q25.3,6 32.6,6 Z",
38
+ 4: "M6,66.8 L46.4,6 L46.8,9.2 L13.7,59.3 L16,53.6 L48.6,53.6 Q52.7,53.6 53.8,52.5 Q54.9,51.4 55.3,48.5 L55.3,48.5 L57.6,48.5 Q57.6,57 57.7,61.7 Q57.8,66.4 58,70.1 L58,70.1 Q57.3,69.8 55.2,69.7 Q53,69.7 50.1,69.6 Q47.2,69.4 44.3,69.4 Q41.4,69.4 39.1,69.4 L39.1,69.4 L6,69.4 L6,66.8 Z M46.4,6 L48,6 L48,90 L34,90 L34,26.6 L46.4,6 Z",
39
+ 5: "M50.4,6 L53.2,6 Q53.2,14.7 53.3,19.5 Q53.4,24.3 53.6,28.1 L53.6,28.1 Q52.7,27.8 50,27.7 Q47.4,27.6 43.9,27.5 Q40.5,27.5 37.2,27.5 L37.2,27.5 L15.2,27.5 L13,46.3 Q16,43.8 21.2,42.3 Q26.4,40.7 33.5,40.7 L33.5,40.7 Q41.9,40.7 47.4,43.3 Q52.8,45.9 55.4,50.3 Q58,54.7 58,60 L58,60 Q58,67 53.5,72.5 Q48.9,78.1 41.3,82 Q33.8,85.9 24.6,88 Q15.3,90 6,90 L6,90 L6,87.8 Q11.7,87.8 17.1,86 Q22.4,84.1 26.7,80.6 Q31.1,77.1 33.6,72 Q36.1,67 36.1,60.5 L36.1,60.5 Q36.1,53 32.9,49 Q29.8,45 23.5,45 L23.5,45 Q19.8,45 17.2,46.3 Q14.5,47.5 12.1,49.5 L12.1,49.5 L10.3,48.2 L15,9.3 Q16.3,9.5 18,9.6 Q19.7,9.7 21.4,9.7 L21.4,9.7 L44.9,9.7 Q47.5,9.7 48.8,8.9 Q50.2,8 50.4,6 L50.4,6 Z",
40
+ 6: "M49.6,6 L49.6,6 L50,8.3 Q46.2,9.6 42.5,11.6 Q38.8,13.6 35.6,17 Q32.3,20.4 29.8,25.7 Q27.3,31.1 25.9,39.1 Q24.6,47.1 24.6,58.7 L24.6,58.7 Q24.6,69.5 25.7,75.9 Q26.9,82.2 28.8,85 Q30.6,87.7 32.4,87.7 L32.4,87.7 Q34.2,87.7 35.8,85.3 Q37.5,82.9 38.5,77.6 Q39.4,72.3 39.4,63.7 L39.4,63.7 Q39.4,55.5 38.5,50.6 Q37.6,45.7 36,43.5 Q34.5,41.3 32.5,41.3 L32.5,41.3 Q31.2,41.3 29.4,42.5 Q27.6,43.6 26.1,46.1 Q24.7,48.5 24,52.7 L24,52.7 L23.1,51.6 Q23.7,46.7 25.7,43.7 Q27.7,40.8 30.8,39.4 Q33.9,38 37.5,38 L37.5,38 Q43.2,38 47.8,41 Q52.4,44.1 55.2,49.5 Q58,55 58,62.6 L58,62.6 Q58,71.4 54.3,77.6 Q50.7,83.7 44.6,86.9 Q38.5,90 31.3,90 L31.3,90 Q19.5,90 12.7,81.5 Q6,73 6,57.5 L6,57.5 Q6,47.3 8.8,39.3 Q11.7,31.3 16.3,25.4 Q21,19.6 26.7,15.6 Q32.5,11.6 38.5,9.2 Q44.4,6.9 49.6,6 Z",
41
+ 7: "M6,6 L6,6 Q7,6.3 9.6,6.4 Q12.3,6.5 15.7,6.6 Q19.1,6.6 22.5,6.6 L22.5,6.6 L58,6.6 L58,9.3 Q55.9,14.4 52.6,20.7 Q49.4,27 46.1,34.5 Q42.8,41.9 40.6,50.5 Q38.3,59.1 38.3,68.7 L38.3,68.7 Q38.3,68.7 38.5,70.8 Q38.7,73 38.8,75.4 Q38.9,77.9 38.9,79 L38.9,79 Q38.9,83 36.5,86.5 Q34.2,90 28.9,90 L28.9,90 Q23.8,90 21.3,86.2 Q18.8,82.5 18.8,76.4 L18.8,76.4 Q18.8,70.5 21.2,64.5 Q23.6,58.5 27.4,52.4 Q31.3,46.4 35.6,40.7 Q40,35 44.1,29.9 Q48.3,24.8 51,20.5 L51,20.5 L48.9,25 L16.4,25 Q11.9,25 10.6,26.2 Q9.4,27.3 9,30.2 L9,30.2 L6.4,30.2 Q6.4,20.6 6.3,15.3 Q6.2,10 6,6 Z",
42
+ 8: "M32.6,6 L32.6,6 Q39.2,6 44.1,8.1 Q48.9,10.2 51.7,13.9 Q54.4,17.5 54.4,22.2 L54.4,22.2 Q54.4,27.8 50.4,31.7 Q46.4,35.7 39,39.3 L39,39.3 L38.2,37.7 Q39.1,35.7 39.5,32.8 Q40,30 40.1,27.2 Q40.3,24.5 40.3,22.8 L40.3,22.8 Q40.3,15.7 38,11.9 Q35.8,8.1 31.9,8.1 L31.9,8.1 Q29,8.1 27.6,10.2 Q26.2,12.4 26.2,15.7 L26.2,15.7 Q26.2,20.3 28.5,24.6 Q30.8,28.9 34.5,33 Q38.1,37.2 42.1,41.3 Q46.1,45.5 49.8,49.8 Q53.4,54.2 55.7,58.8 Q58,63.4 58,68.7 L58,68.7 Q58,74.8 54.5,79.6 Q51.1,84.4 45.1,87.2 Q39.1,90 31.3,90 L31.3,90 Q24.6,90 18.8,87.8 Q13,85.5 9.5,81.1 Q6,76.6 6,70.3 L6,70.3 Q6,65 8.3,61.1 Q10.6,57.1 14.6,54.2 Q18.6,51.3 23.5,49.1 L23.5,49.1 L24.3,50.7 Q22.3,54.3 21.6,59 Q20.9,63.6 20.9,68 L20.9,68 Q20.9,73.5 21.9,78 Q22.9,82.6 25.3,85.3 Q27.6,87.9 31.8,87.9 L31.8,87.9 Q36.5,87.9 38.4,84.8 Q40.4,81.7 40.4,77.4 L40.4,77.4 Q40.4,72.3 38.1,68 Q35.9,63.6 32.4,59.7 Q28.8,55.8 24.9,51.9 Q20.9,48 17.4,43.9 Q13.8,39.9 11.6,35.3 Q9.3,30.7 9.3,25.1 L9.3,25.1 Q9.3,18.3 12.6,14.1 Q16,9.9 21.3,7.9 Q26.6,6 32.6,6 Z",
43
+ 9: "M32.7,6 L32.7,6 Q44.5,6 51.3,15.1 Q58,24.2 58,40.8 L58,40.8 Q58,50.5 55.3,58.1 Q52.5,65.8 47.9,71.4 Q43.3,77 37.7,80.9 Q32.1,84.7 26.3,87 Q20.5,89.3 15.4,90 L15.4,90 L15,87.6 Q19.6,86 23.9,83.3 Q28.2,80.6 31.8,75.5 Q35.3,70.4 37.4,61.8 Q39.4,53.2 39.4,39.6 L39.4,39.6 Q39.4,27.9 38.3,21.1 Q37.1,14.3 35.3,11.4 Q33.5,8.4 31.6,8.4 L31.6,8.4 Q29.8,8.4 28.2,11 Q26.6,13.6 25.6,19.3 Q24.6,25 24.6,34.2 L24.6,34.2 Q24.6,42.9 25.5,48.2 Q26.4,53.6 28,55.9 Q29.6,58.2 31.5,58.2 L31.5,58.2 Q32.9,58.2 34.6,57 Q36.4,55.8 37.9,53.1 Q39.4,50.4 40,46 L40,46 L40.9,47.2 Q40.4,52.5 38.4,55.6 Q36.3,58.8 33.2,60.3 Q30.1,61.8 26.5,61.8 L26.5,61.8 Q20.9,61.8 16.2,58.5 Q11.6,55.3 8.8,49.3 Q6,43.4 6,35.3 L6,35.3 Q6,25.8 9.7,19.3 Q13.4,12.7 19.5,9.4 Q25.5,6 32.7,6 Z"
44
+ };
45
+
46
+ // src/ink-bloom.tsx
47
+ var import_jsx_runtime = require("react/jsx-runtime");
48
+ function InkBloom({ value, size }) {
49
+ const width = size;
50
+ const height = size * 1.5;
51
+ const [key, setKey] = (0, import_react.useState)(0);
52
+ const prevValue = (0, import_react.useRef)(value);
53
+ (0, import_react.useEffect)(() => {
54
+ if (prevValue.current !== value) {
55
+ prevValue.current = value;
56
+ setKey((k) => k + 1);
57
+ }
58
+ }, [value]);
59
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("svg", { width, height, viewBox: "0 0 64 96", style: { overflow: "visible" }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_framer_motion.AnimatePresence, { mode: "popLayout", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
60
+ import_framer_motion.motion.g,
61
+ {
62
+ initial: {
63
+ opacity: 0,
64
+ filter: "blur(12px)",
65
+ scale: 1.3
66
+ },
67
+ animate: {
68
+ opacity: 1,
69
+ filter: "blur(0px)",
70
+ scale: 1
71
+ },
72
+ exit: {
73
+ opacity: 0,
74
+ filter: "blur(16px)",
75
+ scale: 1.5
76
+ },
77
+ transition: {
78
+ duration: 0.5,
79
+ ease: [0.22, 1, 0.36, 1]
80
+ },
81
+ style: { transformOrigin: "32px 48px" },
82
+ children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: DIGIT_PATHS[value], fill: "#c084fc" })
83
+ },
84
+ `${value}-${key}`
85
+ ) }) });
86
+ }
87
+ // Annotate the CommonJS export names for ESM import in node:
88
+ 0 && (module.exports = {
89
+ InkBloom
90
+ });
package/dist/index.mjs ADDED
@@ -0,0 +1,64 @@
1
+ "use client";
2
+
3
+ // src/ink-bloom.tsx
4
+ import { useEffect, useRef, useState } from "react";
5
+ import { motion, AnimatePresence } from "framer-motion";
6
+
7
+ // src/digit-paths.ts
8
+ var DIGIT_PATHS = {
9
+ 0: "M32.5,6 L32.5,6 Q40,6 45.7,11.1 Q51.4,16.1 54.7,25.3 Q58,34.4 58,46.7 L58,46.7 Q58,59 54.7,68.8 Q51.4,78.6 45.4,84.3 Q39.5,90 31.5,90 L31.5,90 Q24.2,90 18.4,84.9 Q12.6,79.9 9.3,70.7 Q6,61.4 6,49.2 L6,49.2 Q6,37 9.3,27.3 Q12.6,17.5 18.5,11.8 Q24.5,6 32.5,6 Z M31.7,8.8 L31.7,8.8 Q27.7,8.8 25,19.4 Q22.3,30 22.3,48.7 L22.3,48.7 Q22.3,62.5 23.7,71 Q25.1,79.6 27.4,83.4 Q29.7,87.2 32.3,87.2 L32.3,87.2 Q36.4,87.2 39,76.6 Q41.7,65.9 41.7,47.2 L41.7,47.2 Q41.7,33.3 40.3,24.9 Q38.9,16.4 36.6,12.6 Q34.4,8.8 31.7,8.8 Z",
10
+ 1: "M48.6,6 L48.6,6 L48.6,75.3 Q48.6,81.9 50.6,84.3 Q52.6,86.7 57.5,86.7 L57.5,86.7 L57.5,90 Q54.3,89.8 48.2,89.6 Q42.1,89.4 35.6,89.4 L35.6,89.4 Q26.9,89.4 18.9,89.6 Q10.9,89.8 6.5,90 L6.5,90 L6.5,86.7 Q13,86.7 16.5,84.1 Q20.1,81.4 20.1,73.7 L20.1,73.7 L20.1,34.7 Q20.1,27.1 18.9,23.4 Q17.7,19.8 14.7,18.7 Q11.7,17.6 6.5,17.6 L6.5,17.6 L6.5,14.1 Q21.5,13.8 31.4,12 Q41.2,10.3 48.6,6 Z",
11
+ 2: "M34.2,6 L34.2,6 Q43.2,6 48.4,11.2 Q53.6,16.5 53.6,26 L53.6,26 Q53.6,31.9 51.4,36.6 Q49.2,41.3 45.6,45.3 Q42,49.2 37.9,52.7 Q33.7,56.1 29.9,59.4 Q26,62.7 23.2,66.3 L23.2,66.3 L47.8,66.3 Q52.2,66.3 53.4,64.9 Q54.6,63.5 55.1,59.9 L55.1,59.9 L57.6,59.9 Q57.6,71.7 57.7,78.4 Q57.8,85 58,90 L58,90 Q57,89.7 54.4,89.5 Q51.8,89.4 48.4,89.3 Q45.1,89.2 41.8,89.2 L41.8,89.2 L6,89.2 L6,85.9 Q8.9,81.7 13.3,76.3 Q17.7,70.8 22,64 Q26.3,57.2 29.3,49.2 Q32.2,41.3 32.2,32.2 L32.2,32.2 Q32.2,24.3 29.8,20.6 Q27.4,16.9 22.5,16.9 L22.5,16.9 Q17.7,16.9 14.3,19.7 Q10.8,22.4 8,27.4 L8,27.4 L6.1,25.5 Q8.7,20.1 12.4,15.6 Q16,11.2 21.3,8.6 Q26.7,6 34.2,6 Z",
12
+ 3: "M32.6,6 L32.6,6 Q38.7,6 43.5,7.7 Q48.4,9.4 51.2,12.6 Q53.9,15.7 53.9,20.2 L53.9,20.2 Q53.9,24.8 50.9,28.9 Q47.8,33 41.8,36.1 Q35.8,39.2 26.9,40.5 L26.9,40.5 Q36.2,39.9 43.2,42 Q50.2,44.1 54.1,48.5 Q58,52.9 58,59.3 L58,59.3 Q58,64.9 54.9,69.7 Q51.9,74.5 46.7,78.3 Q41.5,82 34.8,84.7 Q28,87.3 20.7,88.6 Q13.3,90 6,90 L6,90 L6,87.4 Q11,87.2 16.4,85.3 Q21.8,83.5 26.5,80 Q31.2,76.5 34.1,71.3 Q37.1,66.2 37.1,59.4 L37.1,59.4 Q37.1,52.2 34,47.6 Q30.9,43 25.3,42.5 L25.3,42.5 Q23.6,43.3 22.2,43.9 Q20.7,44.6 19.1,44.6 L19.1,44.6 Q18.1,44.6 17.5,44.2 Q16.9,43.8 16.9,42.6 L16.9,42.6 Q16.9,41 18.1,40.4 Q19.3,39.8 20.9,39.8 L20.9,39.8 Q21.8,39.8 22.8,39.9 Q23.7,40 24.9,40.1 L24.9,40.1 Q29.9,36.6 31.7,32.6 Q33.6,28.6 33.6,24.5 L33.6,24.5 Q33.6,19.1 30.9,16.5 Q28.2,13.9 23.4,13.9 L23.4,13.9 Q19.1,13.9 15.3,16.1 Q11.4,18.3 8.8,22.6 L8.8,22.6 L6.8,21.4 Q9.1,17.3 12.3,13.8 Q15.5,10.3 20.4,8.1 Q25.3,6 32.6,6 Z",
13
+ 4: "M6,66.8 L46.4,6 L46.8,9.2 L13.7,59.3 L16,53.6 L48.6,53.6 Q52.7,53.6 53.8,52.5 Q54.9,51.4 55.3,48.5 L55.3,48.5 L57.6,48.5 Q57.6,57 57.7,61.7 Q57.8,66.4 58,70.1 L58,70.1 Q57.3,69.8 55.2,69.7 Q53,69.7 50.1,69.6 Q47.2,69.4 44.3,69.4 Q41.4,69.4 39.1,69.4 L39.1,69.4 L6,69.4 L6,66.8 Z M46.4,6 L48,6 L48,90 L34,90 L34,26.6 L46.4,6 Z",
14
+ 5: "M50.4,6 L53.2,6 Q53.2,14.7 53.3,19.5 Q53.4,24.3 53.6,28.1 L53.6,28.1 Q52.7,27.8 50,27.7 Q47.4,27.6 43.9,27.5 Q40.5,27.5 37.2,27.5 L37.2,27.5 L15.2,27.5 L13,46.3 Q16,43.8 21.2,42.3 Q26.4,40.7 33.5,40.7 L33.5,40.7 Q41.9,40.7 47.4,43.3 Q52.8,45.9 55.4,50.3 Q58,54.7 58,60 L58,60 Q58,67 53.5,72.5 Q48.9,78.1 41.3,82 Q33.8,85.9 24.6,88 Q15.3,90 6,90 L6,90 L6,87.8 Q11.7,87.8 17.1,86 Q22.4,84.1 26.7,80.6 Q31.1,77.1 33.6,72 Q36.1,67 36.1,60.5 L36.1,60.5 Q36.1,53 32.9,49 Q29.8,45 23.5,45 L23.5,45 Q19.8,45 17.2,46.3 Q14.5,47.5 12.1,49.5 L12.1,49.5 L10.3,48.2 L15,9.3 Q16.3,9.5 18,9.6 Q19.7,9.7 21.4,9.7 L21.4,9.7 L44.9,9.7 Q47.5,9.7 48.8,8.9 Q50.2,8 50.4,6 L50.4,6 Z",
15
+ 6: "M49.6,6 L49.6,6 L50,8.3 Q46.2,9.6 42.5,11.6 Q38.8,13.6 35.6,17 Q32.3,20.4 29.8,25.7 Q27.3,31.1 25.9,39.1 Q24.6,47.1 24.6,58.7 L24.6,58.7 Q24.6,69.5 25.7,75.9 Q26.9,82.2 28.8,85 Q30.6,87.7 32.4,87.7 L32.4,87.7 Q34.2,87.7 35.8,85.3 Q37.5,82.9 38.5,77.6 Q39.4,72.3 39.4,63.7 L39.4,63.7 Q39.4,55.5 38.5,50.6 Q37.6,45.7 36,43.5 Q34.5,41.3 32.5,41.3 L32.5,41.3 Q31.2,41.3 29.4,42.5 Q27.6,43.6 26.1,46.1 Q24.7,48.5 24,52.7 L24,52.7 L23.1,51.6 Q23.7,46.7 25.7,43.7 Q27.7,40.8 30.8,39.4 Q33.9,38 37.5,38 L37.5,38 Q43.2,38 47.8,41 Q52.4,44.1 55.2,49.5 Q58,55 58,62.6 L58,62.6 Q58,71.4 54.3,77.6 Q50.7,83.7 44.6,86.9 Q38.5,90 31.3,90 L31.3,90 Q19.5,90 12.7,81.5 Q6,73 6,57.5 L6,57.5 Q6,47.3 8.8,39.3 Q11.7,31.3 16.3,25.4 Q21,19.6 26.7,15.6 Q32.5,11.6 38.5,9.2 Q44.4,6.9 49.6,6 Z",
16
+ 7: "M6,6 L6,6 Q7,6.3 9.6,6.4 Q12.3,6.5 15.7,6.6 Q19.1,6.6 22.5,6.6 L22.5,6.6 L58,6.6 L58,9.3 Q55.9,14.4 52.6,20.7 Q49.4,27 46.1,34.5 Q42.8,41.9 40.6,50.5 Q38.3,59.1 38.3,68.7 L38.3,68.7 Q38.3,68.7 38.5,70.8 Q38.7,73 38.8,75.4 Q38.9,77.9 38.9,79 L38.9,79 Q38.9,83 36.5,86.5 Q34.2,90 28.9,90 L28.9,90 Q23.8,90 21.3,86.2 Q18.8,82.5 18.8,76.4 L18.8,76.4 Q18.8,70.5 21.2,64.5 Q23.6,58.5 27.4,52.4 Q31.3,46.4 35.6,40.7 Q40,35 44.1,29.9 Q48.3,24.8 51,20.5 L51,20.5 L48.9,25 L16.4,25 Q11.9,25 10.6,26.2 Q9.4,27.3 9,30.2 L9,30.2 L6.4,30.2 Q6.4,20.6 6.3,15.3 Q6.2,10 6,6 Z",
17
+ 8: "M32.6,6 L32.6,6 Q39.2,6 44.1,8.1 Q48.9,10.2 51.7,13.9 Q54.4,17.5 54.4,22.2 L54.4,22.2 Q54.4,27.8 50.4,31.7 Q46.4,35.7 39,39.3 L39,39.3 L38.2,37.7 Q39.1,35.7 39.5,32.8 Q40,30 40.1,27.2 Q40.3,24.5 40.3,22.8 L40.3,22.8 Q40.3,15.7 38,11.9 Q35.8,8.1 31.9,8.1 L31.9,8.1 Q29,8.1 27.6,10.2 Q26.2,12.4 26.2,15.7 L26.2,15.7 Q26.2,20.3 28.5,24.6 Q30.8,28.9 34.5,33 Q38.1,37.2 42.1,41.3 Q46.1,45.5 49.8,49.8 Q53.4,54.2 55.7,58.8 Q58,63.4 58,68.7 L58,68.7 Q58,74.8 54.5,79.6 Q51.1,84.4 45.1,87.2 Q39.1,90 31.3,90 L31.3,90 Q24.6,90 18.8,87.8 Q13,85.5 9.5,81.1 Q6,76.6 6,70.3 L6,70.3 Q6,65 8.3,61.1 Q10.6,57.1 14.6,54.2 Q18.6,51.3 23.5,49.1 L23.5,49.1 L24.3,50.7 Q22.3,54.3 21.6,59 Q20.9,63.6 20.9,68 L20.9,68 Q20.9,73.5 21.9,78 Q22.9,82.6 25.3,85.3 Q27.6,87.9 31.8,87.9 L31.8,87.9 Q36.5,87.9 38.4,84.8 Q40.4,81.7 40.4,77.4 L40.4,77.4 Q40.4,72.3 38.1,68 Q35.9,63.6 32.4,59.7 Q28.8,55.8 24.9,51.9 Q20.9,48 17.4,43.9 Q13.8,39.9 11.6,35.3 Q9.3,30.7 9.3,25.1 L9.3,25.1 Q9.3,18.3 12.6,14.1 Q16,9.9 21.3,7.9 Q26.6,6 32.6,6 Z",
18
+ 9: "M32.7,6 L32.7,6 Q44.5,6 51.3,15.1 Q58,24.2 58,40.8 L58,40.8 Q58,50.5 55.3,58.1 Q52.5,65.8 47.9,71.4 Q43.3,77 37.7,80.9 Q32.1,84.7 26.3,87 Q20.5,89.3 15.4,90 L15.4,90 L15,87.6 Q19.6,86 23.9,83.3 Q28.2,80.6 31.8,75.5 Q35.3,70.4 37.4,61.8 Q39.4,53.2 39.4,39.6 L39.4,39.6 Q39.4,27.9 38.3,21.1 Q37.1,14.3 35.3,11.4 Q33.5,8.4 31.6,8.4 L31.6,8.4 Q29.8,8.4 28.2,11 Q26.6,13.6 25.6,19.3 Q24.6,25 24.6,34.2 L24.6,34.2 Q24.6,42.9 25.5,48.2 Q26.4,53.6 28,55.9 Q29.6,58.2 31.5,58.2 L31.5,58.2 Q32.9,58.2 34.6,57 Q36.4,55.8 37.9,53.1 Q39.4,50.4 40,46 L40,46 L40.9,47.2 Q40.4,52.5 38.4,55.6 Q36.3,58.8 33.2,60.3 Q30.1,61.8 26.5,61.8 L26.5,61.8 Q20.9,61.8 16.2,58.5 Q11.6,55.3 8.8,49.3 Q6,43.4 6,35.3 L6,35.3 Q6,25.8 9.7,19.3 Q13.4,12.7 19.5,9.4 Q25.5,6 32.7,6 Z"
19
+ };
20
+
21
+ // src/ink-bloom.tsx
22
+ import { jsx } from "react/jsx-runtime";
23
+ function InkBloom({ value, size }) {
24
+ const width = size;
25
+ const height = size * 1.5;
26
+ const [key, setKey] = useState(0);
27
+ const prevValue = useRef(value);
28
+ useEffect(() => {
29
+ if (prevValue.current !== value) {
30
+ prevValue.current = value;
31
+ setKey((k) => k + 1);
32
+ }
33
+ }, [value]);
34
+ return /* @__PURE__ */ jsx("svg", { width, height, viewBox: "0 0 64 96", style: { overflow: "visible" }, children: /* @__PURE__ */ jsx(AnimatePresence, { mode: "popLayout", children: /* @__PURE__ */ jsx(
35
+ motion.g,
36
+ {
37
+ initial: {
38
+ opacity: 0,
39
+ filter: "blur(12px)",
40
+ scale: 1.3
41
+ },
42
+ animate: {
43
+ opacity: 1,
44
+ filter: "blur(0px)",
45
+ scale: 1
46
+ },
47
+ exit: {
48
+ opacity: 0,
49
+ filter: "blur(16px)",
50
+ scale: 1.5
51
+ },
52
+ transition: {
53
+ duration: 0.5,
54
+ ease: [0.22, 1, 0.36, 1]
55
+ },
56
+ style: { transformOrigin: "32px 48px" },
57
+ children: /* @__PURE__ */ jsx("path", { d: DIGIT_PATHS[value], fill: "#c084fc" })
58
+ },
59
+ `${value}-${key}`
60
+ ) }) });
61
+ }
62
+ export {
63
+ InkBloom
64
+ };
package/package.json ADDED
@@ -0,0 +1,33 @@
1
+ {
2
+ "name": "@raex-ui/ink-bloom",
3
+ "version": "0.1.0",
4
+ "description": "Ink-in-water dissolve effect where digits bloom in with blur and scale. Animated digit transition component for React.",
5
+ "main": "dist/index.cjs",
6
+ "module": "dist/index.js",
7
+ "types": "dist/index.d.ts",
8
+ "exports": {
9
+ ".": {
10
+ "types": "./dist/index.d.ts",
11
+ "import": "./dist/index.js",
12
+ "require": "./dist/index.cjs"
13
+ }
14
+ },
15
+ "files": ["dist"],
16
+ "sideEffects": false,
17
+ "license": "MIT",
18
+ "keywords": ["react", "animation", "digit", "transition", "framer-motion", "svg", "ink", "bloom"],
19
+ "peerDependencies": {
20
+ "react": ">=18",
21
+ "react-dom": ">=18",
22
+ "framer-motion": ">=10"
23
+ },
24
+ "devDependencies": {
25
+ "tsup": "^8.5.1",
26
+ "typescript": "^5",
27
+ "react": "^19",
28
+ "@types/react": "^19"
29
+ },
30
+ "scripts": {
31
+ "build": "tsup"
32
+ }
33
+ }