{"_id":"@4react/localize","_rev":"1-a5112d5c4f0b2a7724b6c82162b40dee","name":"@4react/localize","dist-tags":{"latest":"2020.1.2"},"versions":{"2020.1.2":{"name":"@4react/localize","version":"2020.1.2","author":{"name":"Matteo Zanoncello"},"license":"ISC","main":"lib/localize.js","module":"lib/localize.module.js","types":"lib/types","scripts":{"clean":"rimraf lib","rollup":"rollup -c","build":"npm run clean && npm run rollup","story":"start-storybook -p 9009 -s .storybook/public","prepublish":"npm run build"},"dependencies":{"i18next-browser-languagedetector":"^4.0.2","i18next-xhr-backend":"^3.2.2","lodash":"^4.17.15","react":"^16.10.2","react-i18next":"^11.3.3","i18next":"^19.0.0"},"peerDependencies":{"i18next-browser-languagedetector":"^4.0.2","i18next-xhr-backend":"^3.2.2","lodash":"^4.17.15","react":"^16.10.2","react-i18next":"^11.3.3","i18next":"^19.0.0"},"devDependencies":{"@4react/eslint-config":"^2020.1.3","@babel/polyfill":"latest","@babel/preset-env":"^7.7.1","@babel/preset-react":"^7.7.0","@babel/preset-typescript":"^7.7.0","@storybook/addon-actions":"^5.3.17","@storybook/addon-knobs":"^5.3.17","@storybook/addon-viewport":"^5.3.17","@storybook/preset-typescript":"^1.2.0","@storybook/react":"^5.3.17","@types/i18next":"^13.0.0","@types/lodash":"^4.14.149","@typescript-eslint/parser":"^2.26.0","babel-loader":"^8.0.6","eslint":"^6.6.0","react-docgen-typescript-loader":"^3.6.0","rimraf":"^3.0.0","rollup":"^1.26.3","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-eslint":"^7.0.0","rollup-plugin-postcss":"^2.0.3","rollup-plugin-typescript2":"^0.25.2","ts-loader":"^6.2.1","typescript":"^3.7.5"},"gitHead":"b67fd68e9e972cf6ff2b00bc2edad1a90cb576d1","description":"React-to-use **i18n** configuration and components for React Applications.","_id":"@4react/localize@2020.1.2","_npmVersion":"6.2.0","_nodeVersion":"10.15.3","_npmUser":{"name":"matteozanoncello","email":"zanomate@gmail.com"},"dist":{"integrity":"sha512-JBNfCVZTwic/lP4LZ9JnpBCxC8GUh/LCtHhIRPjbh/bNQNoXZS4nkoMB/2O1dXl1pSWV5pWMZUcd5CRPU1cSug==","shasum":"58aa8f68af31cff40c17671f6a44ab4672c89499","tarball":"https://registry.npmjs.org/@4react/localize/-/localize-2020.1.2.tgz","fileCount":9,"unpackedSize":20684,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJehfWECRA9TVsSAnZWagAAyGgP/0YjF8yDiA33ZKVFX9X5\nbA2ShqJBvWflhb2ZGwBz5yoD484nJX05mCwNhVxye3cVIRsfTWwO1BGSQIiz\nUK4YxlFJosqJ6pCsjCIXnYgHhvJTREIRA6/dEcK0E/i7/Dr6u7hnJKlI6wWB\nCr/Q7oDHplV09wXw91vreszxlHC4Lcth/tSKbYuZdpsdPyiS12C0ogur9ebY\ntH16k0hAiTC+TKkgFtU8aMlR7zzg1iKkUtzDQAcbCWfkvYtmbRWLi6tMuun4\nl4zTyys8YgixZEBCW0MZpURjJwZCDCUIrgVWmFpsdMQaS8CuXD2OCV8joche\nRca3p/UGGT1Qq8e4KFLnheiEdekQ47dtJBplZneJZSVIgD3PpVoOD8VgCrV6\nLJGafQXSTofTDNnhh9+bbl92zUbW9+izLn89tqOW59KiYZpXAEmnWbetEtH6\nNgbNeVr5oneYihq6AL34UGVzb+Dh8OOquLMrs4+S+479a/6KhiFi9dUtoJav\n9torb34qYtZBCY8ITlQBMdMU3Rqiw3JCmoyWIj4wVlH2UX/lfA9EiVyffWBk\nGUeOWKzvJBMFzbo9LSaa8uLcOj/EJfaXDqSHXEGj+BIzVz2XBoHHCHs+uu4/\ni1PzqZKRIEVci59vfgKJzWr1LbmytDzmGUv3/1/abEg5BWrSOUX6bhZjqJYS\nSREJ\r\n=cTH4\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCX3+E9lg2tx2wU+bd63j/bLtQ3Su0e1qZ9iwY18qR14AIhAKNiYfOK7hPdMIDLiHIO4/wXKXtHZaWZv+UWe0/CsrnN"}]},"maintainers":[{"name":"matteozanoncello","email":"zanomate@gmail.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/localize_2020.1.2_1585837444487_0.025166639249413647"},"_hasShrinkwrap":false}},"time":{"created":"2020-04-02T14:24:04.242Z","2020.1.2":"2020-04-02T14:24:04.639Z","modified":"2022-04-04T10:47:21.600Z"},"maintainers":[{"name":"matteozanoncello","email":"zanomate@gmail.com"}],"description":"React-to-use **i18n** configuration and components for React Applications.","author":{"name":"Matteo Zanoncello"},"license":"ISC","readme":"# @4react / localize\r\n\r\nReact-to-use **i18n** configuration and components for React Applications.\r\n\r\n#### NOTE\r\nThe purpose of this package is to provide a simple and standard solution for the largest amount of projects.\r\n\r\nIt is mainly based on [***react-i18next***](https://github.com/i18next/react-i18next). Please consider to support their work.\r\n\r\n## Usage\r\n\r\n### Import dependency\r\n\r\n```\r\nnpm i @4react/localize\r\n```\r\n\r\n### Init i18n\r\n\r\nInitialize i18n with **initI18n**, optionally specifying *languages* and *namespaces*.\r\n```js\r\nimport { initI18n } from '@4react/localize'\r\n\r\ninitI18n(\r\n  ['en', 'it', 'es'], // languages\r\n  ['common', 'profile'] // namespaces\r\n)\r\n```\r\n\r\n### Provide localization\r\nUse the `Localization` component to provide translations over the application.\r\n```js\r\nimport { Localization } from '@4react/localize'\r\n\r\nconst App = () => (\r\n  <Localization>\r\n    // content\r\n  </Localization>\r\n)\r\n```\r\n\r\n### Translate labels\r\nUse the `Localized` component to translate labels.\r\n\r\n```js\r\nimport { Localized } from '@4react/localize'\r\n\r\nconst CustomComponent = () => (\r\n  <Localized label=\"awesome\" />\r\n)\r\n```\r\n\r\n#### ...and use any kind of filler (also components)\r\n\r\n```js\r\nconst CustomComponent = () => (\r\n  <Localized\r\n    label=\"my-fillable-label\"\r\n    fillers={{\r\n      name: 'Matteo',\r\n      age: 28,\r\n      component: <MyCustomFiller />\r\n    }}\r\n  />\r\n)\r\n\r\n// Hi, I'm {{name}} and I'm {{age}} years old. Look at this {{component}}!\r\n```\r\nTranslations are rendered as simple text with no additional style or structure.\r\n\r\n## Documentation\r\n\r\n#### initI18n()\r\n\r\n| Parameter | Type | Default | Description |\r\n| --- | --- | --- | --- |\r\n| languages | string[] | ['en'] | ***[optional]*** Set of supported languages. The first element is considered as fallback. |\r\n| namespaces | string[] | ['translations'] | ***[optional]*** Set of supported namespaces. |\r\n\r\n#### <Localization\\>\r\n\r\n| Props | Type | Default | Description |\r\n| --- | --- | --- | --- |\r\n| defaultNS | string | 'translations' | ***[optional]*** Specify the default namespace. |\r\n\r\n#### <Localized\\>\r\n\r\n| Props | Type | Default | Description |\r\n| --- | --- | --- | --- |\r\n| label | string | - | Label to localize. |\r\n| ns | string | - | ***[optional]*** Namespace to witch the label belongs. In case of no namespace specified, the `defaultNS` of the `Localization` component is used. |\r\n| fillers | object | - | ***[optional]*** Maps of elements to fills placeholders in label. Fillers could be of type **string, number or components**. |\r\n| lang | string | - | ***[optional]*** Language to override the current selected one. |\r\n","readmeFilename":"README.md"}