feat: create fns package (#1838)

.changeset/light-rockets-drum.md

@@ -0,0 +1,9 @@
+---
+'@react-pdf/fns': major
+'@react-pdf/layout': patch
+'@react-pdf/render': patch
+'@react-pdf/stylesheet': patch
+'@react-pdf/textkit': patch
+---
+
+feat: create fns package

jest.config.js

@@ -1,6 +1,7 @@
 module.exports = {
   setupFiles: ['<rootDir>setupTests.js'],
   projects: [
+    '<rootDir>packages/fns',
     '<rootDir>packages/yoga',
     '<rootDir>packages/font',
     '<rootDir>packages/image',

packages/fns/.gitignore

@@ -0,0 +1 @@
+lib

packages/fns/README.md

@@ -0,0 +1,12 @@
+<p align="center">
+  <img src="https://user-images.githubusercontent.com/5600341/27505816-c8bc37aa-587f-11e7-9a86-08a2d081a8b9.png" height="280px">
+</p>
+
+# @react-pdf/fns
+
+> React-pdf helper functions
+
+## How to install
+```sh
+yarn add @react-pdf/fns
+```

packages/fns/babel.config.js

@@ -0,0 +1 @@
+module.exports = { extends: '../../babel.config.js' };

packages/fns/jest.config.js

@@ -0,0 +1,3 @@
+module.exports = {
+  testRegex: 'tests/.*?(test)\\.js$',
+};

packages/fns/package.json

@@ -0,0 +1,22 @@
+{
+  "name": "@react-pdf/fns",
+  "version": "0.0.0",
+  "license": "MIT",
+  "description": "React-pdf helper functions",
+  "author": "Diego Muracciole <diegomuracciole@gmail.com>",
+  "homepage": "https://github.com/diegomura/react-pdf#readme",
+  "main": "lib/index.js",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/diegomura/react-pdf.git",
+    "directory": "packages/fns"
+  },
+  "scripts": {
+    "test": "jest",
+    "build": "rimraf ./lib && babel src --out-dir lib",
+    "watch": "rimraf ./lib && babel src --out-dir lib --watch"
+  },
+  "files": [
+    "lib"
+  ]
+}

packages/fns/adjust.js → packages/fns/src/adjust.js

@@ -1,3 +1,11 @@
+/**
+ * Applies a function to the value at the given index of an array
+
+ * @param {number} index
+ * @param {function} fn
+ * @param {array} collection
+ * @returns copy of the array with the element at the given index replaced with the result of the function application.
+ */
 const adjust = (index, fn, collection) => {
   if (index >= 0 && index >= collection.length) return collection;
   if (index < 0 && Math.abs(index) > collection.length) return collection;

packages/fns/src/index.js

@@ -0,0 +1,16 @@
+export { default as adjust } from './adjust';
+export { default as asyncCompose } from './asyncCompose';
+export { default as capitalize } from './capitalize';
+export { default as castArray } from './castArray';
+export { default as compose } from './compose';
+export { default as dropLast } from './dropLast';
+export { default as evolve } from './evolve';
+export { default as get } from './get';
+export { default as isNil } from './isNil';
+export { default as last } from './last';
+export { default as mapValues } from './mapValues';
+export { default as matchPercent } from './matchPercent';
+export { default as omit } from './omit';
+export { default as pick } from './pick';
+export { default as reverse } from './reverse';
+export { default as upperFirst } from './upperFirst';

packages/fns/adjust.test.js → packages/fns/tests/adjust.test.js

@@ -1,4 +1,4 @@
-import adjust from './adjust';
+import adjust from '../src/adjust';
 
 const add = v => v + 1;
 

packages/fns/capitalize.test.js → packages/fns/tests/capitalize.test.js

@@ -1,4 +1,4 @@
-import capitalize from './capitalize';
+import capitalize from '../src/capitalize';
 
 describe('capitalize', () => {
   test('should return undefined for undefined', () => {

packages/fns/tests/castArray.test.js

@@ -0,0 +1,19 @@
+import castArray from '../src/castArray';
+
+describe('castArray', () => {
+  test('should return [undefined] for undefined', () => {
+    expect(castArray(undefined)).toEqual([undefined]);
+  });
+
+  test('should return [null] for null', () => {
+    expect(castArray(null)).toEqual([null]);
+  });
+
+  test('should cast passed value in an array', () => {
+    expect(castArray('test')).toEqual(['test']);
+  });
+
+  test('should return array if passed array', () => {
+    expect(castArray(['reactpdf'])).toEqual(['reactpdf']);
+  });
+});

packages/fns/tests/compose.test.js

@@ -0,0 +1,12 @@
+import compose from '../src/compose';
+
+describe('compose', () => {
+  test('performs right-to-left function composition', () => {
+    const multiply = a => b => a * b;
+    const map = fn => collection => collection.map(fn);
+    const f = compose(map, multiply, parseInt);
+
+    expect(f('10')([1, 2, 3])).toEqual([10, 20, 30]);
+    expect(f('10', 2)([1, 2, 3])).toEqual([2, 4, 6]);
+  });
+});

packages/fns/dropLast.test.js → packages/fns/tests/dropLast.test.js

@@ -1,4 +1,4 @@
-import dropLast from './dropLast';
+import dropLast from '../src/dropLast';
 
 describe('dropLast', () => {
   test('skips the last element from a list, returning the remainder', () => {

packages/fns/tests/evolve.test.js

@@ -0,0 +1,39 @@
+import evolve from '../src/evolve';
+
+const add = a => b => a + b;
+
+describe('evolve', () => {
+  test('creates a new object by evolving the `object` according to the `transformation` functions', () => {
+    const transf = { elapsed: add(1), remaining: add(-1) };
+    const object = { name: 'Tomato', elapsed: 100, remaining: 1400 };
+    const expected = { name: 'Tomato', elapsed: 101, remaining: 1399 };
+
+    expect(evolve(transf, object)).toEqual(expected);
+  });
+
+  test('does not invoke function if object does not contain the key', () => {
+    const transf = { n: add(1), m: add(1) };
+    const object = { m: 3 };
+    const expected = { m: 4 };
+
+    expect(evolve(transf, object)).toEqual(expected);
+  });
+
+  test('is not destructive', () => {
+    const transf = { elapsed: add(1), remaining: add(-1) };
+    const object = { name: 'Tomato', elapsed: 100, remaining: 1400 };
+    const expected = { name: 'Tomato', elapsed: 100, remaining: 1400 };
+
+    evolve(transf, object);
+
+    expect(object).toEqual(expected);
+  });
+
+  test('creates a new array by evolving the `array` according to the `transformation` functions', () => {
+    const transf = [add(1), add(-1)];
+    const object = [100, 1400];
+    const expected = [101, 1399];
+
+    expect(evolve(transf, object)).toEqual(expected);
+  });
+});

packages/fns/get.test.js → packages/fns/tests/get.test.js

@@ -1,4 +1,4 @@
-import get from './get';
+import get from '../src/get';
 
 describe('get', () => {
   const deepObject = {

packages/fns/isNil.test.js → packages/fns/tests/isNil.test.js

@@ -1,6 +1,6 @@
 /* eslint-disable no-void */
 
-import isNil from './isNil';
+import isNil from '../src/isNil';
 
 describe('isNil', () => {
   test('tests a value for `null` or `undefined`', () => {

packages/fns/last.test.js → packages/fns/tests/last.test.js

@@ -1,4 +1,4 @@
-import last from './last';
+import last from '../src/last';
 
 describe('last', () => {
   test('returns the last element of an ordered collection', () => {

packages/fns/matchPercent.test.js → packages/fns/tests/matchPercent.test.js

@@ -1,4 +1,4 @@
-import matchPercent from './matchPercent';
+import matchPercent from '../src/matchPercent';
 
 describe('match percent', () => {
   test('should return null for null input', () => {

packages/fns/omit.test.js → packages/fns/tests/omit.test.js

@@ -1,13 +1,13 @@
-import omit from './omit';
+import omit from '../src/omit';
 
 describe('omit', () => {
   const obj = { a: 1, b: 2, c: 3 };
 
   test('copies an object omitting the listed property', () => {
-    expect(omit('a', obj), { b: 2, c: 3 });
+    expect(omit('a', obj)).toEqual({ b: 2, c: 3 });
   });
 
   test('copies an object omitting the listed properties', () => {
-    expect(omit(['a', 'c'], obj), { c: 3 });
+    expect(omit(['a', 'c'], obj)).toEqual({ b: 2 });
   });
 });

packages/fns/tests/pick.test.js

@@ -0,0 +1,17 @@
+import pick from '../src/pick';
+
+describe('pick', () => {
+  const obj = { a: 1, b: 2, c: 3, d: 4, e: 5, f: 6, 1: 7 };
+
+  test('copies the named properties of an object to the new object', () => {
+    expect(pick(['a', 'c', 'f'], obj)).toEqual({ a: 1, c: 3, f: 6 });
+  });
+
+  test('handles numbers as properties', () => {
+    expect(pick([1], obj)).toEqual({ 1: 7 });
+  });
+
+  test('ignores properties not included', () => {
+    expect(pick(['a', 'c', 'g'], obj)).toEqual({ a: 1, c: 3 });
+  });
+});

packages/fns/tests/reverse.test.js

@@ -0,0 +1,10 @@
+import reverse from '../src/reverse';
+
+describe('reverse', () => {
+  test('reverses arrays', () => {
+    expect(reverse([])).toEqual([]);
+    expect(reverse([1])).toEqual([1]);
+    expect(reverse([1, 2])).toEqual([2, 1]);
+    expect(reverse([1, 2, 3])).toEqual([3, 2, 1]);
+  });
+});

packages/fns/upperFirst.test.js → packages/fns/tests/upperFirst.test.js

@@ -1,4 +1,4 @@
-import upperFirst from './upperFirst';
+import upperFirst from '../src/upperFirst';
 
 describe('upperFirst', () => {
   test('should return undefined for undefined', () => {

packages/layout/package.json

@@ -18,6 +18,7 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.16.4",
+    "@react-pdf/fns": "0.0.0",
     "@react-pdf/image": "^2.1.1",
     "@react-pdf/pdfkit": "^2.1.0",
     "@react-pdf/primitives": "^2.0.2",

packages/layout/src/index.js

@@ -1,4 +1,5 @@
-import asyncCompose from '../../fns/asyncCompose';
+import { asyncCompose } from '@react-pdf/fns';
+
 import resolveSvg from './steps/resolveSvg';
 import resolveZIndex from './steps/resolveZIndex';
 import resolveAssets from './steps/resolveAssets';

packages/layout/src/node/createInstance.js

@@ -1,7 +1,6 @@
+import { castArray } from '@react-pdf/fns';
 import { TextInstance } from '@react-pdf/primitives';
 
-import castArray from '../../../fns/castArray';
-
 const isString = value => typeof value === 'string';
 
 const isNumber = value => typeof value === 'number';

packages/layout/src/node/getOrigin.js

@@ -1,5 +1,4 @@
-import isNil from '../../../fns/isNil';
-import matchPercent from '../../../fns/matchPercent';
+import { isNil, matchPercent } from '@react-pdf/fns';
 
 const getTransformStyle = s => node =>
   isNil(node.style?.[s]) ? '50%' : node.style?.[s];

packages/layout/src/node/getWrap.js

@@ -1,6 +1,5 @@
 import * as P from '@react-pdf/primitives';
-
-import isNil from '../../../fns/isNil';
+import { isNil } from '@react-pdf/fns';
 
 const NON_WRAP_TYPES = [P.Svg, P.Note, P.Image, P.Canvas];
 

packages/layout/src/node/removePaddings.js

@@ -1,5 +1,6 @@
+import { omit } from '@react-pdf/fns';
+
 import setPadding from './setPadding';
-import omit from '../../../fns/omit';
 
 const PADDING_PROPS = [
   'padding',

packages/layout/src/node/setAlign.js

@@ -1,6 +1,5 @@
 import Yoga from '@react-pdf/yoga';
-
-import upperFirst from '../../../fns/upperFirst';
+import { upperFirst } from '@react-pdf/fns';
 
 const ALIGN = {
   'flex-start': Yoga.ALIGN_FLEX_START,

packages/layout/src/node/setAspectRatio.js

@@ -1,4 +1,4 @@
-import isNil from '../../../fns/isNil';
+import { isNil } from '@react-pdf/fns';
 
 /**
  * Set aspect ratio attribute to node's Yoga instance

packages/layout/src/node/setJustifyContent.js

@@ -1,6 +1,5 @@
 import Yoga from '@react-pdf/yoga';
-
-import isNil from '../../../fns/isNil';
+import { isNil } from '@react-pdf/fns';
 
 const JUSTIFY_CONTENT = {
   center: Yoga.JUSTIFY_CENTER,

packages/layout/src/node/setOverflow.js

@@ -1,6 +1,5 @@
 import Yoga from '@react-pdf/yoga';
-
-import isNil from '../../../fns/isNil';
+import { isNil } from '@react-pdf/fns';
 
 const OVERFLOW = {
   hidden: Yoga.OVERFLOW_HIDDEN,

packages/layout/src/node/setPositionType.js

@@ -1,6 +1,5 @@
 import Yoga from '@react-pdf/yoga';
-
-import isNil from '../../../fns/isNil';
+import { isNil } from '@react-pdf/fns';
 
 /**
  * Set position type attribute to node's Yoga instance

packages/layout/src/node/setYogaValue.js

@@ -1,9 +1,6 @@
 /* eslint-disable no-unused-expressions */
 import Yoga from '@react-pdf/yoga';
-
-import isNil from '../../../fns/isNil';
-import upperFirst from '../../../fns/upperFirst';
-import matchPercent from '../../../fns/matchPercent';
+import { isNil, upperFirst, matchPercent } from '@react-pdf/fns';
 
 /**
  * Set generic yoga attribute to node's Yoga instance, handing `auto`, edges and percentage cases

packages/layout/src/node/splitNode.js

@@ -1,4 +1,4 @@
-import isNil from '../../../fns/isNil';
+import { isNil } from '@react-pdf/fns';
 
 const getTop = node => node.box?.top || 0;
 

packages/layout/src/page/isHeightAuto.js

@@ -1,4 +1,4 @@
-import isNil from '../../../fns/isNil';
+import { isNil } from '@react-pdf/fns';
 
 /**
  * Checks if page has auto height

packages/layout/src/steps/resolveDimensions.js

@@ -1,8 +1,7 @@
 import Yoga from '@react-pdf/yoga';
 import * as P from '@react-pdf/primitives';
+import { isNil, compose } from '@react-pdf/fns';
 
-import isNil from '../../../fns/isNil';
-import compose from '../../../fns/compose';
 import getMargin from '../node/getMargin';
 import getPadding from '../node/getPadding';
 import getPosition from '../node/getPosition';

packages/layout/src/steps/resolveInheritance.js

@@ -1,7 +1,5 @@
 import * as P from '@react-pdf/primitives';
-
-import pick from '../../../fns/pick';
-import compose from '../../../fns/compose';
+import { pick, compose } from '@react-pdf/fns';
 
 const INHERITED_PROPERTIES = [
   'color',

packages/layout/src/steps/resolveLinkSubstitution.js

@@ -1,6 +1,5 @@
 import * as P from '@react-pdf/primitives';
-
-import compose from '../../../fns/compose';
+import { compose } from '@react-pdf/fns';
 
 const isType = type => node => node.type === type;