diff --git a/.babelrc b/.babelrc deleted file mode 100644 index 6fba9da..0000000 --- a/.babelrc +++ /dev/null @@ -1,8 +0,0 @@ -{ - "presets": ["@babel/preset-env", "@babel/preset-react"], - "env": { - "test": { - "plugins": ["transform-es2015-modules-commonjs"] - } - } -} diff --git a/.editorconfig b/.editorconfig index ec332d1..9d08a1a 100644 --- a/.editorconfig +++ b/.editorconfig @@ -1,19 +1,9 @@ -# This file is for unifying the coding style for different editors and IDEs. -# More information at http://editorconfig.org - -# No .editorconfig files above the root directory -root = true - -[*] -indent_style = space -end_of_line = lf -charset = utf-8 -trim_trailing_whitespace = true -insert_final_newline = true -max_line_length = 100 - -[*.{html,hbs,mustache,ejs,js,jsx,rb,scss,xml,svg}] -indent_size = 4 - -[*.md] -indent_size = 4 \ No newline at end of file +root = true + +[*] +charset = utf-8 +indent_style = space +indent_size = 2 +end_of_line = lf +insert_final_newline = true +trim_trailing_whitespace = true diff --git a/.env b/.env deleted file mode 100644 index 7d910f1..0000000 --- a/.env +++ /dev/null @@ -1 +0,0 @@ -SKIP_PREFLIGHT_CHECK=true \ No newline at end of file diff --git a/.eslintignore b/.eslintignore index efbd0e5..a804767 100644 --- a/.eslintignore +++ b/.eslintignore @@ -1,2 +1,5 @@ -/coverage/* -/dist/* \ No newline at end of file +build/ +dist/ +node_modules/ +.snapshots/ +*.min.js \ No newline at end of file diff --git a/.eslintrc b/.eslintrc new file mode 100644 index 0000000..175d390 --- /dev/null +++ b/.eslintrc @@ -0,0 +1,35 @@ +{ + "parser": "@typescript-eslint/parser", + "extends": [ + "standard", + "standard-react", + "plugin:prettier/recommended", + "prettier/standard", + "prettier/react", + "plugin:@typescript-eslint/eslint-recommended" + ], + "env": { + "node": true + }, + "parserOptions": { + "ecmaVersion": 2020, + "ecmaFeatures": { + "legacyDecorators": true, + "jsx": true + } + }, + "settings": { + "react": { + "version": "16" + } + }, + "rules": { + "space-before-function-paren": 0, + "react/prop-types": 0, + "react/jsx-handler-names": 0, + "react/jsx-fragments": 0, + "react/no-unused-prop-types": 0, + "import/export": 0, + "no-unused-vars": 0 + } +} diff --git a/.eslintrc.json b/.eslintrc.json deleted file mode 100644 index ffe5803..0000000 --- a/.eslintrc.json +++ /dev/null @@ -1,22 +0,0 @@ -{ - "parserOptions": { - "ecmaVersion": 7, - "sourceType": "module", - "ecmaFeatures": { - "impliedStrict": true, - "jsx": true, - "modules": true - } - }, - "parser": "babel-eslint", - "env": { - "browser": true, - "node": true, - "commonjs": true, - "es6": true, - "jest": true - }, - "rules": { - "react/jsx-filename-extension": "off" - } -} diff --git a/.github/workflows/generate_docs.yml b/.github/workflows/generate_docs.yml deleted file mode 100644 index d3e5735..0000000 --- a/.github/workflows/generate_docs.yml +++ /dev/null @@ -1,27 +0,0 @@ -name: Generate docs - -on: - push: - branches: - - master - -jobs: - generate_doc: - runs-on: ubuntu-latest - steps: - - name: Checkout 🛎️ - uses: actions/checkout@v2 # If you're using actions/checkout@v2 you must set persist-credentials to false in most cases for the deployment to work correctly. - with: - persist-credentials: false - - - name: Install and Generate 🔧 # This example project is built using npm and outputs the result to the 'build' folder. Replace with the commands required to build your project, or remove this step entirely if your site is pre-built. - run: | - yarn - yarn test - yarn docs - - name: Deploy 🚀 - uses: JamesIves/github-pages-deploy-action@releases/v3 - with: - ACCESS_TOKEN: ${{ secrets.ACCESS_TOKEN }} - BRANCH: gh-pages # The branch the action should deploy to. - FOLDER: docs # The folder the action should deploy. \ No newline at end of file diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml index 859c8dd..0697ffd 100644 --- a/.github/workflows/test.yml +++ b/.github/workflows/test.yml @@ -12,8 +12,9 @@ jobs: with: persist-credentials: false - - name: Test ✅ # This example project is built using npm and outputs the result to the 'build' folder. Replace with the commands required to build your project, or remove this step entirely if your site is pre-built. + - name: Install 🔧 run: | yarn - yarn typecheck + - name: Test ✅ # This example project is built using npm and outputs the result to the 'build' folder. Replace with the commands required to build your project, or remove this step entirely if your site is pre-built. + run: | yarn test diff --git a/.gitignore b/.gitignore index 2216c43..e5c0332 100644 --- a/.gitignore +++ b/.gitignore @@ -1,4 +1,3 @@ -/node_modules -/dist -/coverage -/docs \ No newline at end of file +**/node_modules/ +**/dist/ +**/coverage/ \ No newline at end of file diff --git a/.npmignore b/.npmignore index 7750b87..4428f3e 100644 --- a/.npmignore +++ b/.npmignore @@ -1,5 +1,4 @@ -/coverage -/docs -/src -/.vscode -/types \ No newline at end of file +**/src +**/.vscode +**/example +**/coverage \ No newline at end of file diff --git a/.prettierrc b/.prettierrc new file mode 100644 index 0000000..4c0a8d4 --- /dev/null +++ b/.prettierrc @@ -0,0 +1,11 @@ +{ + "singleQuote": true, + "jsxSingleQuote": true, + "semi": false, + "tabWidth": 2, + "bracketSpacing": true, + "jsxBracketSameLine": false, + "arrowParens": "always", + "trailingComma": "none", + "endOfLine":"auto" +} diff --git a/.travis.yml b/.travis.yml new file mode 100644 index 0000000..c66a67b --- /dev/null +++ b/.travis.yml @@ -0,0 +1,4 @@ +language: node_js +node_js: + - 12 + - 10 diff --git a/.vscode/settings.json b/.vscode/settings.json index cfbc68f..f695ff1 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -1,8 +1,9 @@ { "search.exclude": { "**/node_modules": true, - "**/dist": true, + "**/dist": false, "**/out": true, + "**/coverage": false, ".awcache": true }, "files.exclude": { @@ -12,9 +13,14 @@ "**/.DS_Store": true, "**/node_modules": true, "**/out": false, + "**/dist": false, + "**/coverage": false, "tslint-rules/**/*.js": true, ".awcache": true, ".eslintcache": true }, "editor.tabSize": 2, + "editor.codeActionsOnSave": { + "source.fixAll": true + } } \ No newline at end of file diff --git a/CNAME b/CNAME deleted file mode 100644 index 4afda3c..0000000 --- a/CNAME +++ /dev/null @@ -1 +0,0 @@ -littera.mike-eling.dev diff --git a/LICENSE b/LICENSE deleted file mode 100644 index fd571d7..0000000 --- a/LICENSE +++ /dev/null @@ -1,21 +0,0 @@ -MIT License - -Copyright (c) 2018 Mike Eling - -Permission is hereby granted, free of charge, to any person obtaining a copy -of this software and associated documentation files (the "Software"), to deal -in the Software without restriction, including without limitation the rights -to use, copy, modify, merge, publish, distribute, sublicense, and/or sell -copies of the Software, and to permit persons to whom the Software is -furnished to do so, subject to the following conditions: - -The above copyright notice and this permission notice shall be included in all -copies or substantial portions of the Software. - -THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR -IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, -FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE -AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER -LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, -OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE -SOFTWARE. \ No newline at end of file diff --git a/README.md b/README.md index 7179375..455e88a 100644 --- a/README.md +++ b/README.md @@ -10,42 +10,45 @@ [![npm bundle size](https://img.shields.io/bundlephobia/min/react-littera?style=for-the-badge)](https://www.npmjs.com/package/@assembless/react-littera) ![GitHub last commit](https://img.shields.io/github/last-commit/Assembless/react-littera?style=for-the-badge) [![](https://img.shields.io/github/license/Assembless/react-littera.svg?style=for-the-badge)](https://github.com/Assembless/react-littera) -[![Website](https://img.shields.io/website?down_message=offline&label=documentation&style=for-the-badge&up_message=online&url=https%3A%2F%2Fdrfr0st.github.io%2Freact-littera)](https://assembless.github.io/react-littera) ## Features - ⚡ Lightning fast -- 🧩 Variable translations +- 🔃 Variable translations - 🗃️ User defined presets - 👶 Shallow learning curve +- 🪝 Hooks support +- 🧩 Common format - ♻️ Reusable ## About -Littera was created to make maintaining and managing translations easier. It allows placing translations right beside your component as well as storing translations globally. Littera's structure was inspired by [react-jss](https://github.com/cssinjs/jss/tree/master/packages/react-jss). +Littera was created to make maintaining and managing translations more React-y. The lib isolates your translations by storing it right besides your component. It provides tools to manipulate translations, detects missing strings, injects presets and more. No more files with thousands of lines of translations. Littera's structure was inspired by [react-jss](https://github.com/cssinjs/jss/tree/master/packages/react-jss). + +Below we have a **translations** object which is accepted by the core `translate` function, which then returns the translated string for the correct language. -Here below we have a **translations** object which is accepted by the core `translate` function, which then returns the translated string for the correct language. It can be passed to the `useLittera` hook or `withLittera` HOC. ```javascript { - welcome: { - en_US: "Welcome", - pl_PL: "Witamy", - de_DE: "Willkommen" + en_US: { + welcome: "Welcome" + }, + de_DE: { + welcome: "Willkommen" + }, + pl_PL: { + welcome: "Witaj" } } ``` Let's say the active language is `en_US` (English), the output will be: + ```javascript { - welcome: "Welcome" + welcome: 'Welcome' } ``` -## Simply explained - -Let's assume you want to have a translations system in your React app that updates all the text when the language changes. Bam! All you need to do is: define a simple object that lists all translated strings for each language. Then pass it to a hook and it will return a reduced object with translations only for active language. Display it like any other string. Ready. - ## Installation via npm @@ -62,357 +65,173 @@ yarn add @assembless/react-littera or clone/download the repository. -## Usage - -First you have to wrap your components with a provider and feed it with a list of available languages. +## Installation -```javascript -import React, { useState } from "react"; -import ReactDOM from "react-dom"; +In order to initialize Littera, we recommend creating a separate file for the setup. The file will be used by your project to import key methods. -import { LitteraProvider } from "@assembless/react-littera"; +An example of the setup file: -function App() { - return ( -
- - - -
- ); +```javascript +import { createLittera } from "@assembless/react-littera" + +const LOCALES = [ "en_US", "de_DE" ] as const; + +const PRESET = { + "en_US": { + "language": "Language", + yes: "Yes", + no: "No", + }, + "de_DE": { + "language": "Sprache", + yes: "Ja", + no: "Nein", + }, } +const { LitteraService, makeTranslations, useLitteraMethods} = createLittera(LOCALES, PRESET); -const rootElement = document.getElementById("root"); -ReactDOM.render(, rootElement); +export { LitteraService, makeTranslations, useLitteraMethods } +// or simply just: export createLittera(LOCALES, PRESET); ``` -Now you can make use of Littera by adding translations directly into your component. - -Here we have two options: - -- **Hooks** (recommended) -- **HOC** (deprecated) - -#### Hooks Example +The next, and final step is to wrap your app with the `LitteraService` component. This will provide the context for the rest of the app. -##### Basic -```javascript -import React from "react"; -import { useLittera } from "@assembless/react-littera"; - -// Object containing translations for each key... -const translations = { - example: { - en_US: "Example", - pl_PL: "Przykład", - de_DE: "Beispiel" - } -}; - -const ExampleComponent = () => { - // Obtain our translated object. - const translated = useLittera(translations); - // Get access to global littera methods for currect context. - const methods = useLitteraMethods(); - - const handleLocaleChange = () => { - // Change language to German. - methods.setLocale("de_DE"); - } - - return ; -}; - -export default ExampleComponent; -``` - -##### Variable translations ```javascript -import React from "react"; -import { useLittera } from "@assembless/react-littera"; +import React, { useState } from 'react' +import ReactDOM from 'react-dom' -const translations = { - // Use a function for variable translations. - hello: (name) => ({ - en_US: `Hello ${name}`, - pl_PL: `Cześć ${name}`, - de_DE: `Hallo ${name}` - }) -}; - -const ExampleComponent = () => { - // Obtain our translated object. - const translated = useLittera(translations); - - // Call the method obtained from our translated object with required arguments. - const varTranslation = translated.hello("Mike"); +import { LitteraProvider } from '@assembless/react-littera' - return ; -}; +function App() { + return ( +
+ + + +
+ ) +} -export default ExampleComponent; +const rootElement = document.getElementById('root') +ReactDOM.render(, rootElement) ``` -##### Array translations -```javascript -import React from "react"; -import { useLittera } from "@assembless/react-littera"; - -const translations = { - greetings: [ - { - de_DE: "Guten Tag", - en_US: "Good morning" - }, - { - de_DE: "Hallo", - en_US: "Hello" - }, - ] -}; - -const ExampleComponent = () => { - // Obtain our translated object. - const translated = useLittera(translations); - - // Get the translated strings from the array. - const varTranslation = translated[0]; // => Good morning - - return ; -}; +Now Littera is setup and you can start taking advantage of the library by adding translations directly into your component (We recommend creating a trans.ts file for each component). -export default ExampleComponent; -``` +#### Example -#### HOC Example +##### Basic ```javascript -import React from "react"; -import { withLittera } from "@assembless/react-littera"; +import React from 'react' +import { useLittera } from '@assembless/react-littera' // Object containing translations for each key... -const translations = { - example: { - en_US: "Example", - pl_PL: "Przykład", - de_DE: "Beispiel" - } -}; - -class ExampleComponent extends React.Component { - - handleLocaleChange() { - const { setLocale } = this.props; - - setLocale("de_DE"); - } +const useTrans = makeTranslations({ + en_US: { + example: 'Example' + }, + de_DE: { + example: 'Beispiel' + } +}) - render() { - const { translated } = this.props; +const ExampleComponent = () => { + // Obtain our translated object. + const translated = useTrans() - return ; - } + return

{translated.example}

} -export default withLittera(translation)(ExampleComponent); +export default ExampleComponent ``` -## API - - #### LitteraProvider - type: `ReactContext` - - Component providing the core context. To use `withLittera` and `useLittera` properly, you have to wrap your components with this provider. +You can also use the variable and array translations: -| Key | Description | Type | Default | -|-----------|---------------------------------------------|--------------------------|-------------------------| -| initialLocale | Initial language. | string | | -| locales | List of available languages. | Array | `[ "en_US" ]` | -| setLocale | Callback called when active language changes. | (locale: string) => void | | -| preset | Preset of translations. | { [key: string]: { [locale: string]: string } } | `{}` | -| pattern | Locale pattern. Default format is xx_XX. | RegExp | `/[a-z]{2}_[A-Z]{2}/gi` | -| detectLocale | Tries to detect the browser language. Overriding initialLocale if detected. Not available yet for React Native! | boolean | false - - #### withLittera - HOC - type: `(translations: ITranslations) => (Component: React.FunctionComponent) => JSX.Element` - -A HOC, you feed it with `translations`(ITranslations) and a component which then gets the `translated` object passed via prop (e.g. `withLittera(translations)(Component)`). - -| Key | Description | Type | Default | -|-----------|---------------------------------------------|--------------------------|-------------------------| -| translated | Translated object | ITranslated | | -| setLocale | Changes active language | (locale: string) => void | | -| preset | Preset of translations | { [key: string]: { [locale: string]: string } } | `{}` | -| locale | Active language | string | `en_US` | - - #### useLittera - Hook - type: `(translations: ITranslations) => ITranslated` - - A Hook, you feed it with `translations`(ITranslations) and it returns `translated`(ITranslated). - - #### useLitteraMethods - Hook - type: `() => { see methods below }` +##### Variable translations -This hook exposes following methods: -| Key | Description | Type | -|-----------|---------------------------------------------|--------------------------| -| locale | Active language | `string` | -| locales | List of all locales | `string[]` | -| setLocale | Changes active language | `(locale: string) => void` | -| validateLocale | Validates locale with pattern | `(locale: string, pattern?: RegExp) => boolean` | -| preset | Preset object previously passed to the provider | `ITranslations` | -| translate | Core translate method | `(translations: T, locale: string) => ITranslated` | -| translateSingle | Core method for translating a single key | `(translation: T, locale: string) => ISingleTranslated` | +```javascript +const useTrans = makeTranslations({ + en_US: { + example: 'Example', + hello: (name) => `Hello ${name}` + }, + de_DE: { + example: 'Beispiel', + hello: (name) => `Hallo ${name}` + } +}) -### Types +const ExampleComponent = () => { + // Obtain our translated object. + const translated = useTrans() -#### ITranslation -`{ [locale: string]: string }` + // Call the method obtained from our translated object with required arguments. + const varTranslation = translated.hello('Mike') // => "Hello Mike" -```javascript -{ - de_DE: "Einfach", - en_US: "Simple" + return

{varTranslation}

} ``` -#### ITranslationVarFn -`(...args: (string | number)[]) => ITranslation` +##### Array translations ```javascript -(name) => ({ - de_DE: `Hallo ${name}`, - en_US: `Hello ${name}` -}) -``` - -#### ITranslationsArr -`ITranslation[]` +const translations = { + en_US: { + example: 'Example', + hello: (name) => `Hello ${name}`, + greetings: ['Good morning', 'Hello'] + }, + de_DE: { + example: 'Beispiel', + hello: (name) => `Hallo ${name}`, + greetings: ['Guten Morgen', 'Hallo'] + } +} -```javascript -[ - { - de_DE: "Beispiel", - en_US: "Example" - }, -] -``` +const ExampleComponent = () => { + // Obtain our translated object. + const translated = useLittera(translations) -#### ITranslations -`{ [key: string]: ITranslation | ITranslationVarFn }` + // Get the translated strings from the array. + const varTranslation = translated[0] // => Good morning -```javascript -{ - simple: { - de_DE: "Einfach", - en_US: "Simple" - }, - hello: (name) => ({ - de_DE: `Hallo ${name}`, - en_US: `Hello ${name}` - }), - greetings: [ - { - de_DE: "Guten Tag", - en_US: "Good morning" - }, - { - de_DE: "Hallo", - en_US: "Hello" - }, - ] + return

{varTranslation}

} ``` -#### ITranslated -`{ [key: string]: string | ((...args: (string | number)[]) => string) | string[] }` +## API -```javascript -{ - simple: "Simple", - hello: (name) => "Hello Mike", // Run this function to get variable translation. - greetings: [ "Good morning", "Hello" ] -} -``` +### TODO: Write API docs. ## Build instructions -After cloning the repo, install all dependencies using `npm install`. +After cloning the repo, install all dependencies using `yarn install`. Build: -`npm run build` +`yarn build` Test the library: -`npm test` +`yarn test` ## Migration 1.X => 2.X -The migration process is straightforward. You have to rename some properties and change the way you use `useLittera`. - -### Changed naming -- `language` => `locale` -- `setLanguage` => `setLocale` - -Mainly pay attention to `LitteraProvider` and `withLittera` props naming. - -### LitteraProvider changes -The provider accepts 2 new props `locales: string[]` and `initialLocale?: string`. You don't need to use your own state from now, the provider will handle it by itself. That makes the `locale` and `setLocale` props not required. - -```javascript -// v1.X -import LitteraProvider from "react-littera"; - -const App = () => { - const [language, setLanguage] = useState("en_US"); - - return - ... - -} - -// v2.X -import { LitteraProvider } from "@assembless/react-littera"; - -const App = () => { - - return - ... - -} -``` - -### useLittera changes -The hook returns only the translated object now. Use `useLitteraMethods` to get/set locale, set pattern etc. - -```javascript -// The translations object remains the same. -const translations = { - example: { - "en_US": "Example", - "de_DE": "Beispiel", - "pl_PL": "Przykład" - } -} - -// v1.X -const [translated, locale, setLanguage] = useLittera(translations) - -// v2.X -const translated = useLittera(translations); -const { locale, setLocale, pattern, setPattern, validateLocale } = useLitteraMethods(); -``` +ℹ Migration from 2.X to 3.X coming soon! ## FAQ #### Will I need to type all the translations by myself? + Yes, we have not implemented a translator to keep this package simple and lightweight also providing the translations manually guarantees a better user experience. #### Does react-littera work with React Native? -React Native compatibility has not been tested but the community reported 100% usability. + +Littera is fully compatible with React Native. It was tested with React Native CLI. #### You can easily transfer translations with a component. -Just define the translations object in your components file or directory. It will travel with your component, just remember to add @assembless/react-littera as a dependency! + +Just define the translations object in your components file or directory. It will travel with your component, just remember to add `@assembless/react-littera` as a dependency! ## License -[MIT License](https://github.com/Assembless/react-littera/blob/master/LICENSE) +[MIT](https://github.com/Assembless/react-littera/blob/master/LICENSE) © [Assembless](https://github.com/Assembless) diff --git a/example/README.md b/example/README.md new file mode 100644 index 0000000..3318f50 --- /dev/null +++ b/example/README.md @@ -0,0 +1,5 @@ +This example was bootstrapped with [Create React App](https://github.com/facebook/create-react-app). + +It is linked to the @assembless/react-littera package in the parent directory for development purposes. + +You can run `yarn install` and then `yarn start` to test your package. diff --git a/example/build/asset-manifest.json b/example/build/asset-manifest.json new file mode 100644 index 0000000..166e12d --- /dev/null +++ b/example/build/asset-manifest.json @@ -0,0 +1,22 @@ +{ + "files": { + "main.css": "./static/css/main.be601951.chunk.css", + "main.js": "./static/js/main.b1bae71c.chunk.js", + "main.js.map": "./static/js/main.b1bae71c.chunk.js.map", + "runtime-main.js": "./static/js/runtime-main.e00f317c.js", + "runtime-main.js.map": "./static/js/runtime-main.e00f317c.js.map", + "static/js/2.a265bb38.chunk.js": "./static/js/2.a265bb38.chunk.js", + "static/js/2.a265bb38.chunk.js.map": "./static/js/2.a265bb38.chunk.js.map", + "index.html": "./index.html", + "precache-manifest.df71066ea084ec049648dad1319fd809.js": "./precache-manifest.df71066ea084ec049648dad1319fd809.js", + "service-worker.js": "./service-worker.js", + "static/css/main.be601951.chunk.css.map": "./static/css/main.be601951.chunk.css.map", + "static/js/2.a265bb38.chunk.js.LICENSE.txt": "./static/js/2.a265bb38.chunk.js.LICENSE.txt" + }, + "entrypoints": [ + "static/js/runtime-main.e00f317c.js", + "static/js/2.a265bb38.chunk.js", + "static/css/main.be601951.chunk.css", + "static/js/main.b1bae71c.chunk.js" + ] +} \ No newline at end of file diff --git a/example/build/favicon.ico b/example/build/favicon.ico new file mode 100644 index 0000000..a11777c Binary files /dev/null and b/example/build/favicon.ico differ diff --git a/example/build/index.html b/example/build/index.html new file mode 100644 index 0000000..90175e0 --- /dev/null +++ b/example/build/index.html @@ -0,0 +1 @@ +@assembless/react-littera
\ No newline at end of file diff --git a/example/build/manifest.json b/example/build/manifest.json new file mode 100644 index 0000000..ca37d7f --- /dev/null +++ b/example/build/manifest.json @@ -0,0 +1,15 @@ +{ + "short_name": "@assembless/react-littera", + "name": "@assembless/react-littera", + "icons": [ + { + "src": "favicon.ico", + "sizes": "64x64 32x32 24x24 16x16", + "type": "image/x-icon" + } + ], + "start_url": ".", + "display": "standalone", + "theme_color": "#000000", + "background_color": "#ffffff" +} diff --git a/example/build/precache-manifest.df71066ea084ec049648dad1319fd809.js b/example/build/precache-manifest.df71066ea084ec049648dad1319fd809.js new file mode 100644 index 0000000..badc1b6 --- /dev/null +++ b/example/build/precache-manifest.df71066ea084ec049648dad1319fd809.js @@ -0,0 +1,26 @@ +self.__precacheManifest = (self.__precacheManifest || []).concat([ + { + "revision": "63ef858b08789ee6772e7a53451142c5", + "url": "./index.html" + }, + { + "revision": "82db846eca88d847739f", + "url": "./static/css/main.be601951.chunk.css" + }, + { + "revision": "ca65eb758ab06cd74ed7", + "url": "./static/js/2.a265bb38.chunk.js" + }, + { + "revision": "570d362d673dab785e62d2b8563e1118", + "url": "./static/js/2.a265bb38.chunk.js.LICENSE.txt" + }, + { + "revision": "82db846eca88d847739f", + "url": "./static/js/main.b1bae71c.chunk.js" + }, + { + "revision": "125d5a29df8290ee6109", + "url": "./static/js/runtime-main.e00f317c.js" + } +]); \ No newline at end of file diff --git a/example/build/service-worker.js b/example/build/service-worker.js new file mode 100644 index 0000000..8fbfd1b --- /dev/null +++ b/example/build/service-worker.js @@ -0,0 +1,39 @@ +/** + * Welcome to your Workbox-powered service worker! + * + * You'll need to register this file in your web app and you should + * disable HTTP caching for this file too. + * See https://goo.gl/nhQhGp + * + * The rest of the code is auto-generated. Please don't update this file + * directly; instead, make changes to your Workbox build configuration + * and re-run your build process. + * See https://goo.gl/2aRDsh + */ + +importScripts("https://storage.googleapis.com/workbox-cdn/releases/4.3.1/workbox-sw.js"); + +importScripts( + "./precache-manifest.df71066ea084ec049648dad1319fd809.js" +); + +self.addEventListener('message', (event) => { + if (event.data && event.data.type === 'SKIP_WAITING') { + self.skipWaiting(); + } +}); + +workbox.core.clientsClaim(); + +/** + * The workboxSW.precacheAndRoute() method efficiently caches and responds to + * requests for URLs in the manifest. + * See https://goo.gl/S9QRab + */ +self.__precacheManifest = [].concat(self.__precacheManifest || []); +workbox.precaching.precacheAndRoute(self.__precacheManifest, {}); + +workbox.routing.registerNavigationRoute(workbox.precaching.getCacheKeyForURL("./index.html"), { + + blacklist: [/^\/_/,/\/[^/?]+\.[^/]+$/], +}); diff --git a/example/build/static/css/main.be601951.chunk.css b/example/build/static/css/main.be601951.chunk.css new file mode 100644 index 0000000..742f955 --- /dev/null +++ b/example/build/static/css/main.be601951.chunk.css @@ -0,0 +1,2 @@ +body{margin:0;padding:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,"Courier New",monospace} +/*# sourceMappingURL=main.be601951.chunk.css.map */ \ No newline at end of file diff --git a/example/build/static/css/main.be601951.chunk.css.map b/example/build/static/css/main.be601951.chunk.css.map new file mode 100644 index 0000000..038f871 --- /dev/null +++ b/example/build/static/css/main.be601951.chunk.css.map @@ -0,0 +1 @@ +{"version":3,"sources":["index.css"],"names":[],"mappings":"AAAA,KACE,QAAS,CACT,SAAU,CACV,mJAEY,CACZ,kCAAmC,CACnC,iCACF,CAEA,KACE,yEAEF","file":"main.be601951.chunk.css","sourcesContent":["body {\r\n margin: 0;\r\n padding: 0;\r\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',\r\n 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',\r\n sans-serif;\r\n -webkit-font-smoothing: antialiased;\r\n -moz-osx-font-smoothing: grayscale;\r\n}\r\n\r\ncode {\r\n font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',\r\n monospace;\r\n}\r\n"]} \ No newline at end of file diff --git a/example/build/static/js/2.a265bb38.chunk.js b/example/build/static/js/2.a265bb38.chunk.js new file mode 100644 index 0000000..f64a1c1 --- /dev/null +++ b/example/build/static/js/2.a265bb38.chunk.js @@ -0,0 +1,3 @@ +/*! For license information please see 2.a265bb38.chunk.js.LICENSE.txt */ +(this["webpackJsonp@assembless/react-littera-example"]=this["webpackJsonp@assembless/react-littera-example"]||[]).push([[2],[function(e,t,n){"use strict";e.exports=n(5)},function(e,t,n){"use strict";var r=Object.getOwnPropertySymbols,l=Object.prototype.hasOwnProperty,i=Object.prototype.propertyIsEnumerable;function a(e){if(null===e||void 0===e)throw new TypeError("Object.assign cannot be called with null or undefined");return Object(e)}e.exports=function(){try{if(!Object.assign)return!1;var e=new String("abc");if(e[5]="de","5"===Object.getOwnPropertyNames(e)[0])return!1;for(var t={},n=0;n<10;n++)t["_"+String.fromCharCode(n)]=n;if("0123456789"!==Object.getOwnPropertyNames(t).map((function(e){return t[e]})).join(""))return!1;var r={};return"abcdefghijklmnopqrst".split("").forEach((function(e){r[e]=e})),"abcdefghijklmnopqrst"===Object.keys(Object.assign({},r)).join("")}catch(l){return!1}}()?Object.assign:function(e,t){for(var n,o,u=a(e),c=1;cz.length&&z.push(e)}function R(e,t,n){return null==e?0:function e(t,n,r,l){var o=typeof t;"undefined"!==o&&"boolean"!==o||(t=null);var u=!1;if(null===t)u=!0;else switch(o){case"string":case"number":u=!0;break;case"object":switch(t.$$typeof){case i:case a:u=!0}}if(u)return r(l,t,""===n?"."+I(t,0):n),1;if(u=0,n=""===n?".":n+":",Array.isArray(t))for(var c=0;c