{"_rev":"3-19499c895b41702d314d9c84a7d93b7d","time":{"created":"2024-11-07T08:40:03.083Z","modified":"2024-11-07T08:40:03.697Z","3.21.1--fix":"2024-11-07T08:19:03.459Z","3.21.1":"2024-11-07T08:40:03.396Z"},"_id":"@apad/use-intl","name":"@apad/use-intl","dist-tags":{"latest":"3.21.1"},"versions":{"3.21.1":{"name":"@apad/use-intl","version":"3.21.1","sideEffects":false,"author":{"name":"Jan Amann","email":"jan@amann.work"},"description":"Internationalization (i18n) for React","license":"MIT","homepage":"https://next-intl-docs.vercel.app/","repository":{"type":"git","url":"git+https://github.com/amannn/next-intl.git#main"},"scripts":{"build":"rm -rf dist && rollup -c","test":"TZ=Europe/Berlin vitest","lint":"pnpm run lint:source && pnpm run lint:package","lint:source":"eslint src test && tsc --noEmit","lint:package":"publint && attw --pack","size":"size-limit"},"main":"./dist/index.js","module":"dist/esm/index.js","typings":"./dist/types/src/index.d.ts","exports":{".":{"types":"./dist/types/src/index.d.ts","default":"./dist/index.js"},"./core":{"types":"./core.d.ts","default":"./dist/core.js"},"./react":{"types":"./react.d.ts","default":"./dist/react.js"},"./_useLocale":{"types":"./_useLocale.d.ts","default":"./dist/_useLocale.js"},"./_IntlProvider":{"types":"./_IntlProvider.d.ts","default":"./dist/_IntlProvider.js"}},"keywords":["react","intl","i18n","internationalization","localization","translate","translation","format","formatting"],"dependencies":{"@formatjs/fast-memoize":"^2.2.0","intl-messageformat":"^10.5.14"},"peerDependencies":{"react":"^16.8.0 || ^17.0.0 || ^18.0.0"},"devDependencies":{"@arethetypeswrong/cli":"^0.15.3","@size-limit/preset-big-lib":"^11.1.4","@testing-library/react":"^16.0.0","@types/node":"^20.14.5","@types/react":"^18.3.3","@types/react-dom":"^18.3.0","date-fns":"^3.6.0","eslint":"^8.56.0","eslint-config-molindo":"^7.0.0","eslint-plugin-react-compiler":"0.0.0-experimental-8e3b87c-20240822","publint":"^0.2.8","react":"^18.3.1","react-dom":"^18.3.1","rollup":"^4.18.0","size-limit":"^11.1.4","tinyspy":"^3.0.0","typescript":"^5.5.3","vitest":"^2.0.2"},"prettier":"../../.prettierrc.json","_id":"@apad/use-intl@3.21.1","gitHead":"9c34b8eea89760e6e9efdda1008bd42bb1683a5f","bugs":{"url":"https://github.com/amannn/next-intl/issues"},"_nodeVersion":"18.20.4","_npmVersion":"10.7.0","dist":{"integrity":"sha512-udzhpoikPzNlIbX8VdbuSieKYwkAY3W/Ncv4BTG6JT/WRmLIKn07tnnh7w+SMm3PLT0F9UGGRXyt3WRnwdydgw==","shasum":"7234bed3c9fc746a603324eca7b358fe72c81201","tarball":"https://registry.npmjs.org/@apad/use-intl/-/use-intl-3.21.1.tgz","fileCount":90,"unpackedSize":109907,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIAMdNSJN1N8rVlEJ9/I9jRoyCeZ8u/llHM/SQyJcB7ObAiBI0QjMlbAlJzYHmLm6fLQP3T0f6czI0OHJ26iuZ823uw=="}]},"_npmUser":{"name":"apades","email":"a13258267680@gmail.com"},"directories":{},"maintainers":[{"name":"apades","email":"a13258267680@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/use-intl_3.21.1_1730968803210_0.7041583046696271"},"_hasShrinkwrap":false}},"maintainers":[{"name":"apades","email":"a13258267680@gmail.com"}],"description":"Internationalization (i18n) for React","homepage":"https://next-intl-docs.vercel.app/","keywords":["react","intl","i18n","internationalization","localization","translate","translation","format","formatting"],"repository":{"type":"git","url":"git+https://github.com/amannn/next-intl.git#main"},"author":{"name":"Jan Amann","email":"jan@amann.work"},"bugs":{"url":"https://github.com/amannn/next-intl/issues"},"license":"MIT","readme":"# 🌐 use-intl\n\n> Internationalization (i18n) for React\n\n## Features\n\nInternationalization (i18n) is an essential part of the user experience, therefore `use-intl` gives you all the parts you need to get language nuances right.\n\n- 🌟 **ICU message syntax**: Localize your messages with interpolation, cardinal & ordinal plurals, enum-based label selection and rich text.\n- 📅 **Dates, times & numbers**: Apply appropriate formatting without worrying about server/client differences like time zones.\n- ✅ **Type-safe**: Speed up development with autocompletion for message keys and catch typos early with compile-time checks.\n- 💡 **Hooks-based API**: Learn a single API that can be used across your code base to turn translations into plain strings or rich text.\n- ⚔️ **Standards-based**: Use the best parts of built-in JavaScript APIs and supplemental lower-level APIs from Format.JS.\n\n## What does it look like?\n\n```jsx\n// UserProfile.tsx\nimport {useTranslations} from 'use-intl';\n \nexport default function UserProfile({user}) {\n const t = useTranslations('UserProfile');\n \n return (\n \n
\n \n );\n}\n```\n\n```js\n// en.json\n{\n \"UserProfile\": {\n \"title\": \"{username}'s profile\",\n \"membership\": \"Member since {memberSince, date, short}\",\n \"followers\": \"{count, plural, ↵\n =0 {No followers yet} ↵\n =1 {One follower} ↵\n other {# followers} ↵\n }\"\n }\n}\n```\n\n## Installation\n\n1. `npm install use-intl`\n2. Add the provider\n3. Use internationalization in components\n\n```jsx\nimport {IntlProvider, useTranslations} from 'use-intl';\n\n// You can get the messages from anywhere you like. You can also\n// fetch them from within a component and then render the provider \n// along with your app once you have the messages.\nconst messages = {\n \"App\": {\n \"hello\": 'Hello {username}!'\n }\n};\n\nfunction Root() {\n return (\n \n \n \n );\n}\n\nfunction App({user}) {\n const t = useTranslations('App');\n return
{t('hello', {username: user.name})}
;\n}\n```\n\nHave a look at [the minimal setup example](https://github.com/amannn/next-intl/tree/main/examples/example-use-intl) to explore a working app.\n\n### [→ Read the docs](https://next-intl-docs.vercel.app/docs/environments/core-library)\n","readmeFilename":"README.md"}