{"_id":"@davidqhr/react-redux-i18n","_rev":"1-9f6685574ad997c9db9c883b337f9f25","name":"@davidqhr/react-redux-i18n","dist-tags":{"latest":"1.9.3"},"versions":{"1.9.3":{"name":"@davidqhr/react-redux-i18n","version":"1.9.3","author":{"name":"Artis Avotins"},"main":"./build/index.js","scripts":{"test":"echo \"Error: no test specified\" && exit 1","lint":"esw --ext .js src --color","lint:watch":"npm run lint -- --watch","lint:fix":"npm run lint -- --fix","clean":"rimraf build","build":"npm run lint && babel src -d build","prepublish":"npm run clean && npm run build"},"babel":{"presets":["react","es2015","stage-0"]},"repository":{"type":"git","url":"git://github.com/zoover/react-redux-i18n.git"},"dependencies":{"@davidqhr/react-i18nify":"1.11.14"},"devDependencies":{"babel-cli":"^6.22.2","babel-eslint":"^7.1.1","babel-preset-es2015":"^6.22.0","babel-preset-react":"^6.22.0","babel-preset-stage-0":"^6.22.0","eslint":"^3.15.0","eslint-config-airbnb":"^14.1.0","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^4.0.0","eslint-plugin-react":"^6.9.0","eslint-watch":"^2.1.14","rimraf":"^2.5.4"},"eslintConfig":{"parser":"babel-eslint","parserOptions":{"ecmaVersion":6,"sourceType":"module","ecmaFeatures":{"jsx":true,"impliedStrict":true}},"env":{"browser":true,"es6":true},"globals":{"moment":false,"intl":false,"global":false},"plugins":["react"],"extends":"airbnb","rules":{"arrow-parens":"off"}},"gitHead":"f777bd46b235837a87cfd8b505a38e81653fce4b","description":"A binding library for redux to react-i18nify","bugs":{"url":"https://github.com/zoover/react-redux-i18n/issues"},"homepage":"https://github.com/zoover/react-redux-i18n#readme","_id":"@davidqhr/react-redux-i18n@1.9.3","_npmVersion":"5.6.0","_nodeVersion":"9.11.2","_npmUser":{"name":"davidqhr","email":"davidqhr@gmail.com"},"dist":{"integrity":"sha512-j4NXhf0IWEnUmuUhIiCq9wlL5PSlVLNakXCwphOAPoN5F+7vK5xhQ8rFlJwOvu/2VelCnzCHfRWIDm1tJIbueQ==","shasum":"a4256e6ce3ab375a4e6c02ea4bfe89ae01a7d390","tarball":"https://registry.npmjs.org/@davidqhr/react-redux-i18n/-/react-redux-i18n-1.9.3.tgz","fileCount":6,"unpackedSize":11410,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJcE5+2CRA9TVsSAnZWagAAX5YP/i96v3RO8Pfknn0fnkLk\nrQR4W/1FjMeHK6CLHVPXD03q5uCtgXz2JpWPj2oq/nn8teLG9guOJtloSQAs\nEgvEenGW+YTl0oEcDIFaCaHg399h62nyD/42/LqadELhST9KfvFMFkLEHF/p\nBAerGFKvQc72xy0FYxSEXZxe5gP7fifhK+Vf+aocdauoJc2b9VhtFNcGs8rm\nb78V5NTpF6mA5OFdGZfnIOuPzNyZG0/G0I3HuDDyPPLbqgwVrAtjLnX4NIx5\nsmr2UJtYpWRTb0VoGDhJNB85ImVs5Qpwto4NVz/ynBIFxDQ4aLR9x+yIqFAc\nWTrwLW1O9ZaxXrqkDwtc19UcR+uEHE/MoGpHM9wcr0NePyQTJnXmpaiCmT9d\ntepue8Zpu3IXOEr8pSQ6JB6WsuGiGoD4bU1hZKeJPRLBg4fapoo1NGVQnKE5\n1Lu3ksqXVwtqFDLFLBSTq/9U80c7RlIPobv17l8jsxPPCGo9Vyce2+hXCI7e\n6aI8Ym+hPkPyo1Wz5KvB5kJ1dK63/RwefcO7O/QClCv8Xat2kfZlWm+WkNET\nSTvWggChKMqqqqpL3I+vVHEThCecqNYuSBT6l6w0WAF+xTIz6NMXsj+rsbYp\n67zUusWv4djesJjiMGBwCUKSKbpBiPDYeOXOIYXkA9h8b18ulgkwFaOJRsEn\n0N1a\r\n=YYv0\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIEFVDg3QmEAz9AV+Sl99YS9CEK7PFvjsAwcpSdeSJ+ZhAiBRUdYhhnQ8yWuLRjaf0NwADOSjf70Wm+5XNEViqkoPgA=="}]},"maintainers":[{"name":"davidqhr","email":"davidqhr@gmail.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-redux-i18n_1.9.3_1544789942029_0.3665160210426195"},"_hasShrinkwrap":false}},"time":{"created":"2018-12-14T12:19:01.842Z","1.9.3":"2018-12-14T12:19:02.196Z","modified":"2022-04-05T03:06:12.753Z"},"maintainers":[{"name":"davidqhr","email":"davidqhr@gmail.com"}],"description":"A binding library for redux to react-i18nify","homepage":"https://github.com/zoover/react-redux-i18n#readme","repository":{"type":"git","url":"git://github.com/zoover/react-redux-i18n.git"},"author":{"name":"Artis Avotins"},"bugs":{"url":"https://github.com/zoover/react-redux-i18n/issues"},"readme":"# react-redux-i18n\n\nA binding library for redux to react-i18nify\n\n## Usage\n\nFirst install the package.\n\nUsing `npm`:\n```\nnpm i react-redux-i18n --save\n```\n\nUsing `yarn`:\n```\nyarn add react-redux-i18n\n```\n\n`redux-thunk` is an implicit dependency, so you need it installed and included in your project.\n\nTo learn more about `redux-thunk`, refer to it's GitHub page:\nhttps://github.com/gaearon/redux-thunk\n\nNext, load the translations to be used, for example in `app.js` or in your apps entry point:\n\n```javascript\nimport { createStore, combineReducers, applyMiddleware } from 'redux';\nimport thunk from 'redux-thunk';\nimport { loadTranslations, setLocale, syncTranslationWithStore, i18nReducer } from 'react-redux-i18n';\nimport reducers from './reducers';\n\nconst translationsObject = {\n  en: {\n    application: {\n      title: 'Awesome app with i18n!',\n      hello: 'Hello, %{name}!'\n    },\n    date: {\n      long: 'MMMM Do, YYYY'\n    },\n    export: 'Export %{count} items',\n    export_0: 'Nothing to export',\n    export_1: 'Export %{count} item',\n    two_lines: 'Line 1<br />Line 2',\n    literal_two_lines: 'Line 1\\\nLine 2'\n  },\n  nl: {\n    application: {\n      title: 'Toffe app met i18n!',\n      hello: 'Hallo, %{name}!'\n    },\n    date: {\n      long: 'D MMMM YYYY'\n    },\n    export: 'Exporteer %{count} dingen',\n    export_0: 'Niks te exporteren',\n    export_1: 'Exporteer %{count} ding',\n    two_lines: 'Regel 1<br />Regel 2',\n    literal_two_lines: 'Regel 1\\\nRegel 2'\n  }\n};\n\nconst store =  createStore(\n  combineReducers({\n    ...reducers,\n    i18n: i18nReducer\n  }),\n  applyMiddleware(thunk)\n);\nsyncTranslationWithStore(store)\nstore.dispatch(loadTranslations(translationsObject));\nstore.dispatch(setLocale('en'));\n\n```\n\n**NB!** Please note that reducer's name must be `i18n`! Make sure your project's reducers don't clash with it.\n\n\n## Components\n\nThe easiest way to translate or localize in your React components is by using the `Translate` and `Localize` components,\ndirectly exported from `react-i18nify` package:\n\n```javascript\nvar React = require('react');\nvar Translate = require('react-redux-i18n').Translate;\nvar Localize = require('react-redux-i18n').Localize;\n\nvar AwesomeComponent = React.createClass({\n  render: function() {\n    return (\n      <div>\n        <Translate value=\"application.title\"/>\n          // => returns '<span>Toffe app met i18n!</span>' for locale 'nl'\n        <Translate value=\"application.title\" style={{ fontWeight: 'bold', fontSize: '14px' }} />\n        // => returns '<span style=\"font-weight:bold;font-size:14px;\">Toffe app met i18n!</span>' for locale 'nl'\n        <Translate value=\"application.hello\" name=\"Aad\"/>\n          // => returns '<span>Hallo, Aad!</span>' for locale 'nl'\n        <Localize value=\"2015-09-03\" dateFormat=\"date.long\"/>\n          // => returns '<span>3 september 2015</span> for locale 'nl'\n        <Localize value={10/3} options={{style: 'currency', currency: 'EUR', minimumFractionDigits: 2, maximumFractionDigits: 2}}/>\n          // => returns '<span>€ 3,33</span> for locale 'nl'\n        <Translate value=\"export\" count={1} />\n          // => returns '<span>Exporteer 1 ding</span> for locale 'nl'\n        <Translate value=\"export\" count={2} />\n          // => returns '<span>Exporteer 2 dingen</span> for locale 'nl'\n        <Translate value=\"two_lines\" dangerousHTML />\n          // => returns '<span>Regel 1<br />Regel 2</span>'\n      </div>\n    );\n  }\n});\n```\n\n## Keeping components updated\n\nWhen the translation object or locale values are set, all instances of `Translate` and `Localize` will be re-rendered to\nreflect the latest state. If you choose to use `I18n.l` or `I18n.t` then it up to you to handle state change.\n\nIf you'd rather not to re-render components after setting locale or translations object, then pass `false` as a second\nargument to `setLocale` and/or `setTranslations`.\n\n## Helpers\n\nIf for some reason, you cannot use the components, you can use the `I18n.t` and `I18n.l` helpers instead:\n\n```javascript\nvar I18n = require('react-redux-i18n').I18n;\n\nI18n.t('application.title'); // => returns 'Toffe app met i18n!' for locale 'nl'\nI18n.t('application.hello', {name: 'Aad'}); // => returns 'Hallo, Aad!' for locale 'nl'\nI18n.t('export', {count: 0}); // => returns 'Niks te exporteren' for locale 'nl'\nI18n.t('application.weird_key'); // => returns 'Weird key' as translation is missing\nI18n.t('application', {name: 'Aad'}); // => returns {hello: \"Hallo, Aad!\", title: \"Toffe app met i18n!\"} for locale 'nl'\n\nI18n.l(1385856000000, { dateFormat: 'date.long' }); // => returns '1 december 2013' for locale 'nl'\nI18n.l(Math.PI, { maximumFractionDigits: 2 }); // => returns '3,14' for locale 'nl'\n```\n\n## Supported localize options\n\nThe localize component and helper support all date formatting options as provided by the Javascript `moment` library. For the full list of options, see http://momentjs.com/docs/#/displaying/format/.\n\nFor number formatting, the localize component and helper support all options as provided by the Javascript built-in `Intl.NumberFormat` object. For the full list of options, see https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/NumberFormat.\n\n[downloads-image]: http://img.shields.io/npm/dm/react-redux-i18n.svg\n\n[npm-url]: https://npmjs.org/package/react-redux-i18n\n[npm-image]: http://img.shields.io/npm/v/react-redux-i18n.svg\n","readmeFilename":"README.md"}