v0.1.2

package.json

@@ -1,6 +1,6 @@
 {
   "name": "fxsvg",
-  "version": "0.1.1",
+  "version": "0.1.2",
   "description": "Functional SVG Handling Library",
   "type": "module",
   "main": "./src/index.js",

src/appendRotateTransform/appendRotateTransform.index.js

@@ -1,15 +1,11 @@
-import { isNil } from "fxjs2";
 import { $$isRotateSVGTransform } from "../isRotateSVGTransform/isRotateSVGTransform.index.js";
 
-export const $$appendRotateTransform = (transform, { angle }) => {
+export const $$appendRotateTransform = (transform, { angle = 0 }) => {
   if (!$$isRotateSVGTransform(transform)) {
     return transform;
   }
 
-  if (isNil(angle)) {
-    throw new Error("There is no angle.");
-  }
-
-  transform.setRotate(transform.angle + angle, 0, 0);
+  const { angle: prev_angle } = transform;
+  transform.setRotate(prev_angle + angle, 0, 0);
   return transform;
 };

src/appendRotateTransform/appendRotateTransform.spec.js

@@ -40,9 +40,18 @@ describe(`$$appendRotateTransform`, function () {
     expect(t.matrix.f).to.equal(0);
   });
 
-  it(`If no angle or second argument, the function will throw an error.`, function () {
+  it(`If no second argument, the function will throw an error.`, function () {
     expect(() => $$appendRotateTransform(t)).to.throw();
-    expect(() => $$appendRotateTransform(t, {})).to.throw();
+  });
+
+  it(`If no input angle value, SVGTransform keep original angle value.`, function () {
+    const { angle: before_angle } = t;
+
+    $$appendRotateTransform(t, {});
+
+    const { angle: after_angle } = t;
+
+    expect(after_angle).to.equal(before_angle);
   });
 
   describe(`If the SVGTransform is not a rotate transform, the function will do nothing but return the transform.`, function () {

src/controlRotateTransform/controlRotateTransform.index.js

@@ -18,7 +18,7 @@ export const $$controlRotateTransform = ($svg = $$getSVG()) => (
     return controller;
   };
   controller.append = ({ angle }) => {
-    $$appendRotateTransform(transform, { angle, cx: 0, cy: 0 });
+    $$appendRotateTransform(transform, { angle });
     return controller;
   };
   controller.end = () => {

src/getBoxPoints/getBoxPoints.index.js

@@ -1,4 +1,4 @@
-import { go, map, mapL } from "fxjs2";
+import { go, go1, map, mapL, rangeL, reduce } from "fxjs2";
 import { $$createSVGPoint } from "../createSVGPoint/createSVGPoint.index.js";
 import { $$getBaseTransformList } from "../getBaseTransformList/getBaseTransformList.index.js";
 import { $$getSVG } from "../getSetSVG/getSetSVG.index.js";
@@ -30,7 +30,7 @@ const $$getTransformedBoxPoints = ($svg = $$getSVG()) => (
   $el,
   original_box_points
 ) => {
-  const t = $$getBaseTransformList($el).consolidate();
+  const transform_list = $$getBaseTransformList($el);
   const [top_left, top_right, bottom_left, bottom_right] = go(
     [
       original_box_points.top_left,
@@ -39,7 +39,14 @@ const $$getTransformedBoxPoints = ($svg = $$getSVG()) => (
       original_box_points.bottom_right,
     ],
     mapL($$createSVGPoint($svg)),
-    mapL((p) => (t ? p.matrixTransform(t.matrix) : p))
+    mapL((p) =>
+      go(
+        rangeL(transform_list.numberOfItems),
+        mapL((i) => transform_list.getItem(i)),
+        mapL(({ matrix: m }) => m),
+        (iter) => reduce((p, m) => p.matrixTransform(m), p, iter)
+      )
+    )
   );
 
   return {
@@ -60,14 +67,12 @@ const $$getBoundingBoxPoints = ($svg = $$getSVG()) => (
     transformed_box_points.bottom_left,
     transformed_box_points.bottom_right,
   ];
-  const [min_x, max_x] = go(
-    l,
-    map(({ x }) => x),
+  const [min_x, max_x] = go1(
+    map(({ x }) => x, l),
     (xs) => [Math.min(...xs), Math.max(...xs)]
   );
-  const [min_y, max_y] = go(
-    l,
-    map(({ y }) => y),
+  const [min_y, max_y] = go1(
+    map(({ y }) => y, l),
     (ys) => [Math.min(...ys), Math.max(...ys)]
   );
   const [min, max] = mapL($$createSVGPoint($svg), [

src/initRotateTransform/initRotateTransform.index.js

@@ -7,17 +7,20 @@ export const $$initRotateTransform = ($svg = $$getSVG()) => (
   $el,
   { angle = 0, cx = 0, cy = 0 } = {}
 ) => {
-  $$getBaseTransformList($el).insertItemBefore(
+  const transform_list = $$getBaseTransformList($el);
+
+  transform_list.insertItemBefore(
     $$createSVGTransformTranslate($svg)({ tx: -cx, ty: -cy }),
     0
   );
-  const transform = $$getBaseTransformList($el).insertItemBefore(
+  const transform = transform_list.insertItemBefore(
     $$createSVGTransformRotate($svg)({ angle }),
     0
   );
-  $$getBaseTransformList($el).insertItemBefore(
+  transform_list.insertItemBefore(
     $$createSVGTransformTranslate($svg)({ tx: cx, ty: cy }),
     0
   );
+
   return transform;
 };

src/mergeRotateTransform/mergeRotateTransform.index.js

@@ -44,5 +44,6 @@ export const $$mergeRotateTransform = ($svg = $$getSVG()) => ($el) => {
     }),
     0
   );
+
   return $el;
 };

src/updateRotateTransform/updateRotateTransform.index.js

@@ -2,12 +2,12 @@ import { $$isRotateSVGTransform } from "../isRotateSVGTransform/isRotateSVGTrans
 
 export const $$updateRotateTransform = (
   transform,
-  { angle, cx = 0, cy = 0 } = {}
+  { angle = transform.angle, cx = 0, cy = 0 } = {}
 ) => {
   if (!$$isRotateSVGTransform(transform)) {
     return transform;
   }
 
-  transform.setRotate(angle == null ? transform.angle : angle, cx, cy);
+  transform.setRotate(angle, cx, cy);
   return transform;
 };

src/updateRotateTransform/updateRotateTransform.spec.js

@@ -33,9 +33,14 @@ describe(`$$updateRotateTransform`, function () {
 
     $$updateRotateTransform(t);
 
-    const { angle: after_angle } = t;
+    const {
+      angle: after_angle,
+      matrix: { e: after_cx, f: after_cy },
+    } = t;
 
     expect(after_angle).to.equal(before_angle);
+    expect(after_cx).to.equal(0);
+    expect(after_cy).to.equal(0);
   });
 
   it(`If no cx, cy values, The cx, cy values will be reset to 0.`, function () {

src/updateScaleTransform/updateScaleTransform.index.js

@@ -1,13 +1,13 @@
 import { $$isScaleSVGTransform } from "../isScaleSVGTransform/isScaleSVGTransform.index.js";
 
-export const $$updateScaleTransform = (transform, { sx, sy } = {}) => {
+export const $$updateScaleTransform = (
+  transform,
+  { sx = transform.matrix.a, sy = transform.matrix.d } = {}
+) => {
   if (!$$isScaleSVGTransform(transform)) {
     return transform;
   }
 
-  transform.setScale(
-    sx == null ? transform.matrix.a : sx,
-    sy == null ? transform.matrix.d : sy
-  );
+  transform.setScale(sx, sy);
   return transform;
 };

src/updateTranslateTransform/updateTranslateTransform.index.js

@@ -1,13 +1,13 @@
 import { $$isTranslateSVGTransform } from "../isTranslateSVGTransform/isTranslateSVGTransform.index.js";
 
-export const $$updateTranslateTransform = (transform, { tx, ty } = {}) => {
+export const $$updateTranslateTransform = (
+  transform,
+  { tx = transform.matrix.e, ty = transform.matrix.f } = {}
+) => {
   if (!$$isTranslateSVGTransform(transform)) {
     return transform;
   }
 
-  transform.setTranslate(
-    tx == null ? transform.matrix.e : tx,
-    ty == null ? transform.matrix.f : ty
-  );
+  transform.setTranslate(tx, ty);
   return transform;
 };