@doist/react-interpolate 0.2.0 → 0.3.8

package/.github/workflows/nodejs.yml

@@ -1,32 +0,0 @@
-# This workflow will do a clean install of node dependencies, build the source code and run tests across different versions of node
-# For more information see: https://help.github.com/actions/language-and-framework-guides/using-nodejs-with-github-actions
-
-name: CI
-
-on:
-  push:
-    branches: [ master ]
-  pull_request:
-    branches: [ master ]
-
-jobs:
-  build:
-
-    runs-on: ubuntu-latest
-
-    strategy:
-      matrix:
-        node-version: [12.x]
-
-    steps:
-    - uses: actions/checkout@v2
-    - name: Use Node.js ${{ matrix.node-version }}
-      uses: actions/setup-node@v1
-      with:
-        node-version: ${{ matrix.node-version }}
-    - run: npm ci
-    - run: npm run build
-    - run: npm test
-      env:
-        CI: true
-    - run: npm run lint

package/.prettierrc.json

@@ -1,9 +0,0 @@
-{
-    "printWidth": 80,
-    "tabWidth": 4,
-    "semi": false,
-    "trailingComma": "none",
-    "bracketSpacing": true,
-    "arrowParens": "avoid",
-    "proseWrap": "never"
-}

package/CONTRIBUTING.md

@@ -1,7 +0,0 @@
-## Dependencies and target environment
-
-One core goal this library is to deliver a lightweight solution. Therefore, it comes to critically when it comes to user of dependencies and also polyfill usage.
-
-- `react` should be its only dependencies.
-- No polyfill.
-

package/__test__/Interpolate.test.js

@@ -1,203 +0,0 @@
-/* eslint-disable react/display-name */
-import React from "react"
-import { render } from "@testing-library/react"
-import Interpolate, { SYNTAX_I18NEXT } from "../src"
-
-Interpolate.defaultProps = {
-    graceful: false
-}
-
-const surpressConsole = () => {
-    const w = jest.spyOn(console, "warn").mockImplementation()
-    const e = jest.spyOn(console, "error").mockImplementation()
-
-    return () => {
-        w.mockRestore()
-        e.mockRestore()
-    }
-}
-
-describe("Interpolate", () => {
-    function renderTest({ expected, ...props }) {
-        const { container } = render(<Interpolate {...props} />)
-        expect(container.innerHTML).toEqual(expected)
-    }
-
-    test("when no mapping is provide", () => {
-        const restore = surpressConsole() // Interpolate will output warning when no mapping is provided
-
-        renderTest({
-            string: "<h1>hello <b>{name}</b></h1><br/>. welcome to todoist",
-            expected: "<h1>hello <b>{name}</b></h1><br>. welcome to todoist"
-        })
-
-        restore()
-    })
-
-    test("tag mapping", () =>
-        renderTest({
-            string: "<h1>hello <b>steven</b></h1>. welcome to todoist",
-            mapping: {
-                b: child => <i>{child}</i>,
-                h1: child => <h2>{child}</h2>
-            },
-            expected: "<h2>hello <i>steven</i></h2>. welcome to todoist"
-        }))
-
-    test("tag mapping: should accept element directly", () =>
-        renderTest({
-            string: "<h1>hello <b>steven</b></h1>. welcome to todoist",
-            mapping: {
-                b: <i />,
-                h1: <h2 />
-            },
-            expected: "<h2>hello <i>steven</i></h2>. welcome to todoist"
-        }))
-
-    test("placholder mapping", () =>
-        renderTest({
-            string: "{greeting} <b>{name}</b>. welcome to todoist",
-            mapping: {
-                greeting: "hi",
-                name: () => <i>steven</i>
-            },
-            expected: "hi <b><i>steven</i></b>. welcome to todoist"
-        }))
-
-    test("void tag mapping", () =>
-        renderTest({
-            string: "hello <br/>",
-            mapping: {
-                br: <hr />
-            },
-            expected: "hello <hr>"
-        }))
-
-    test("combination of mapping", () =>
-        renderTest({
-            string: "<h1>hello <b>{name}</b></h1>.<br/> welcome to todoist",
-            mapping: {
-                h1: child => <h2>{child}</h2>,
-                b: child => <i>{child}</i>,
-                name: "steven",
-                br: <hr />
-            },
-            expected: "<h2>hello <i>steven</i></h2>.<hr> welcome to todoist"
-        }))
-
-    test("combination of mapping with function component", () => {
-        // eslint-disable-next-line
-        const Subheader = ({ children }) => {
-            return <h2 className="subheader">{children}</h2>
-        }
-
-        renderTest({
-            string: "<h1>hello <b>{name}</b></h1>.<br/> welcome to todoist",
-            mapping: {
-                h1: child => <Subheader>{child}</Subheader>,
-                b: child => <i>{child}</i>,
-                name: "steven",
-                br: <hr />
-            },
-            expected:
-                '<h2 class="subheader">hello <i>steven</i></h2>.<hr> welcome to todoist'
-        })
-    })
-
-    test("spacing in the void tag and placeholder should be allowed", () =>
-        renderTest({
-            string: "hello { name }<br /> welcome to todoist",
-            mapping: {
-                name: "steven",
-                br: <hr />
-            },
-            expected: "hello steven<hr> welcome to todoist"
-        }))
-
-    test("the mapping value should be interpolate corrected with proper html escape", () => {
-        renderTest({
-            string: "hello { name }<br /> welcome to todoist",
-            mapping: {
-                name: "<script>window.xss = 1</script>",
-                br: "<script>window.xss = 1</script>"
-            },
-            expected:
-                "hello &lt;script&gt;window.xss = 1&lt;/script&gt;&lt;script&gt;window.xss = 1&lt;/script&gt; welcome to todoist"
-        })
-
-        expect(window.css).toBeUndefined()
-    })
-
-    test("when graceful flag is on and string contains syntax error, interpolate should return the original string and should not throw error", () => {
-        const restore = surpressConsole()
-
-        renderTest({
-            string: "</h1>",
-            expected: "&lt;/h1&gt;",
-            graceful: true
-        })
-
-        restore()
-    })
-
-    test("using SYNTAX_I18NEXT", () => {
-        renderTest({
-            syntax: SYNTAX_I18NEXT,
-            string: "<0>hello <b>{{name}}</b></0>.<br/> welcome to todoist",
-            mapping: {
-                0: child => <h2 className="subheader">{child}</h2>,
-                b: child => <i>{child}</i>,
-                name: "steven",
-                br: <hr />
-            },
-            expected:
-                '<h2 class="subheader">hello <i>steven</i></h2>.<hr> welcome to todoist'
-        })
-    })
-})
-
-describe("Interpolate: error cases", () => {
-    let restore
-    beforeAll(() => {
-        restore = surpressConsole()
-    })
-    afterAll(() => {
-        restore()
-    })
-
-    function renderTest({ expectedError, ...props }) {
-        return () => {
-            expect(() => render(<Interpolate {...props} />)).toThrow(
-                expectedError
-            )
-        }
-    }
-
-    test(
-        "non-closing tag",
-        renderTest({
-            string: "<b>",
-            expectedError:
-                "Syntax error. Please check if each open tag is closed correctly"
-        })
-    )
-
-    test(
-        "mapping value for tag should always be a function",
-        renderTest({
-            string: "<h1>hello</h1>. welcome to todoist",
-            mapping: { h1: "hi" },
-            expectedError: "Invalid mapping value for"
-        })
-    )
-
-    test(
-        "when passing element as value but the element contains children, error should be thrown",
-        renderTest({
-            string: "<h1>hello</h1>. welcome to todoist",
-            mapping: { h1: <h1>hi</h1> },
-            expectedError:
-                "when passing an element as value, the element should not contains children"
-        })
-    )
-})

package/__test__/parser.test.js

@@ -1,45 +0,0 @@
-import parser from "../src/parser"
-
-describe("parser", () => {
-    const tests = [
-        "hello",
-        "{steven}",
-        "<br />",
-        "<div></div>",
-        "hello {steven} from taiwan",
-        "hello {steven} from taiwan <br/>",
-        "<div>hello</div>",
-        "<div>hello {steven}</div>",
-        "<div>hello <b>{steven}</b></div>",
-        "<div>hello <b>mr {steven} from taiwan</b></div>",
-        "<div>hello <b>mr {steven} from taiwan</b><br /></div>",
-        "<div>hello</div><b>steven</b>"
-    ]
-
-    tests.forEach(string => {
-        test(string, () => {
-            parser(string)
-        })
-    })
-})
-
-describe("parser: error handling", () => {
-    const invalids = [
-        "<div>hello",
-        "hello<div>",
-        "<br>",
-        "hello {steven}</div>",
-        "<div>hello <b>{steven}</div></b>",
-        "<div>hello <b>{steven}</b></b></div>"
-    ]
-
-    invalids.forEach(string => {
-        test(`invalid syntax: ${string}`, () => {
-            expect(() => {
-                parser(string)
-            }).toThrow(
-                "Syntax error. Please check if each open tag is closed correctly"
-            )
-        })
-    })
-})

package/babel.config.js

@@ -1,18 +0,0 @@
-module.exports = function(api) {
-    api.cache(true)
-
-    return {
-        presets: [
-            [
-                "@babel/preset-env",
-                {
-                    targets: {
-                        browsers: ["IE 11"]
-                    }
-                }
-            ],
-            "@babel/react"
-        ],
-        plugins: ["@babel/plugin-transform-runtime"]
-    }
-}

package/rollup.config.js

@@ -1,17 +0,0 @@
-import babel from "rollup-plugin-babel"
-import pkg from "./package.json"
-
-export default {
-    input: "src/index.js",
-    output: [
-        {
-            file: pkg.main,
-            format: "cjs"
-        },
-        {
-            file: pkg.module,
-            format: "es"
-        }
-    ],
-    plugins: [babel({ runtimeHelpers: true })]
-}