feat: add css bezier function

razorpay · Sep 18, 2024 · d24bcdd · d24bcdd
1 parent cfa5f14
commit d24bcdd
Showing 1 changed file with 24 additions and 0 deletions.
diff --git a/packages/blade/src/utils/cssBezierToMotionFn.ts b/packages/blade/src/utils/cssBezierToMotionFn.ts
@@ -0,0 +1,24 @@
+const cssBezierToMotionFn = <
+  X1 extends number,
+  Y1 extends number,
+  X2 extends number,
+  Y2 extends number
+>(
+  cssCubicBezierString: `cubic-bezier(${X1}, ${Y1}, ${X2}, ${Y2})`,
+): [X1, Y1, X2, Y2] => {
+  const indexOfFirstBracket = cssCubicBezierString.indexOf('(');
+  const indexOfLastBracket = cssCubicBezierString.lastIndexOf(')');
+  const bezierValuesString = cssCubicBezierString.slice(
+    indexOfFirstBracket + 1,
+    indexOfLastBracket,
+  );
+  const bezierValuesArray = bezierValuesString.split(',').map((val) => Number(val)) as [
+    X1,
+    Y1,
+    X2,
+    Y2,
+  ];
+  return bezierValuesArray;
+};
+
+export { cssBezierToMotionFn };