[
  {
    "path": ".all-contributorsrc",
    "content": "{\n  \"projectName\": \"react-i18next\",\n  \"projectOwner\": \"i18next\",\n  \"repoType\": \"github\",\n  \"repoHost\": \"https://github.com\",\n  \"files\": [\"README.md\"],\n  \"imageSize\": 100,\n  \"commit\": false,\n  \"contributors\": [\n    {\n      \"login\": \"jamuhl\",\n      \"name\": \"Jan Mühlemann\",\n      \"avatar_url\": \"https://avatars3.githubusercontent.com/u/977772?v=4\",\n      \"profile\": \"http://twitter.com/jamuhl\",\n      \"contributions\": [\"code\", \"example\", \"doc\", \"question\"]\n    },\n    {\n      \"login\": \"adrai\",\n      \"name\": \"Adriano Raiano\",\n      \"avatar_url\": \"https://avatars0.githubusercontent.com/u/1086194?v=4\",\n      \"profile\": \"http://twitter.com/#!/adrirai\",\n      \"contributions\": [\"code\", \"example\", \"doc\", \"question\"]\n    },\n    {\n      \"login\": \"tigerabrodi\",\n      \"name\": \"Tiger Abrodi\",\n      \"avatar_url\": \"https://avatars1.githubusercontent.com/u/49603590?v=4\",\n      \"profile\": \"https://tigerabrodi.dev/\",\n      \"contributions\": [\"question\", \"code\", \"review\"]\n    },\n    {\n      \"login\": \"pedrodurek\",\n      \"name\": \"Pedro Durek\",\n      \"avatar_url\": \"https://avatars1.githubusercontent.com/u/12190482?v=4\",\n      \"profile\": \"https://github.com/pedrodurek\",\n      \"contributions\": [\"code\", \"example\"]\n    }\n  ],\n  \"commitConvention\": \"none\"\n}\n"
  },
  {
    "path": ".babelrc",
    "content": "{\n  \"env\": {\n    \"development\": {\n      \"presets\": [\n        [\n          \"@babel/env\",\n          {\n            \"targets\": { \"browsers\": [\"defaults\"] }\n          }\n        ],\n        \"@babel/react\"\n      ],\n      \"plugins\": [\"@babel/plugin-transform-runtime\"]\n    },\n    \"jsnext\": {\n      \"presets\": [\n        [\n          \"@babel/env\",\n          {\n            \"targets\": { \"browsers\": [\"defaults\"] },\n            \"modules\": false,\n            \"useBuiltIns\": false\n          }\n        ],\n        \"@babel/react\"\n      ],\n      \"plugins\": [\"@babel/plugin-transform-runtime\"]\n    }\n  },\n  \"comments\": false\n}\n"
  },
  {
    "path": ".codeclimate.yml",
    "content": "engines:\n  duplication:\n    enabled: true\n    config:\n      languages:\n        - ruby\n        - javascript:\n            mass_threshold: 58\n        - python\n        - php\n  eslint:\n    # Disabled since this engine used a different set of version of\n    # `@typescript/eslint` and `typescript`\n    #\n    # @see https://github.com/i18next/i18next/pull/2098\n    enabled: false\n    channel: 'eslint-8'\n  fixme:\n    enabled: true\nratings:\n  paths:\n    - 'src/**/*'\nexclude_paths:\n  - test/\n  - coverage/\n  - dist/\n  - example/\n  - 'react-i18next.js'\n  - 'react-i18next.min.js'\n  - 'rollup.config.js'\n  - 'src/shallowEqual.js'\n"
  },
  {
    "path": ".coveralls.yml",
    "content": "repo_token: a7NPPsDW6jNJ3x23jBgWuO6KxV3Eq0mF2\n"
  },
  {
    "path": ".editorconfig",
    "content": "# EditorConfig is awesome: http://EditorConfig.org\nroot = true\n\n[*]\ncharset = utf-8\nend_of_line = lf\nindent_size = 2\nindent_style = space\ninsert_final_newline = true\ntrim_trailing_whitespace = true\n"
  },
  {
    "path": ".eslintignore",
    "content": "**/dist/\n**/node_modules/\nexample/**/*\n**/react-i18next.js\n**/react-i18next.min.js\n"
  },
  {
    "path": ".eslintrc.json",
    "content": "{\n  \"extends\": [\"airbnb\", \"prettier\"],\n  \"parser\": \"@babel/eslint-parser\",\n  \"parserOptions\": {\n    \"ecmaVersion\": 8,\n    \"ecmaFeatures\": {\n      \"experimentalObjectRestSpread\": true,\n      \"impliedStrict\": true,\n      \"classes\": true\n    }\n  },\n  \"env\": {\n    \"browser\": true,\n    \"node\": true\n  },\n  \"reportUnusedDisableDirectives\": true,\n  \"rules\": {\n    \"no-debugger\": 0,\n    \"no-alert\": 0,\n    \"no-unused-vars\": [1, { \"argsIgnorePattern\": \"res|next|^err\" }],\n    \"prefer-arrow-callback\": [\"error\", { \"allowNamedFunctions\": true }],\n    \"prefer-const\": [\"error\", { \"destructuring\": \"all\" }],\n    \"arrow-body-style\": [2, \"as-needed\"],\n    \"no-unused-expressions\": [2, { \"allowTaggedTemplates\": true }],\n    \"no-param-reassign\": [2, { \"props\": false }],\n    \"no-console\": 0,\n    \"no-use-before-define\": 0,\n    \"no-nested-ternary\": 0,\n    \"import/prefer-default-export\": 0,\n    \"import/no-extraneous-dependencies\": 1,\n    \"import/no-named-as-default-member\": 1,\n    \"import\": 0,\n    \"func-names\": 0,\n    \"space-before-function-paren\": 0,\n    \"comma-dangle\": 0,\n    \"max-len\": 0,\n    \"import/extensions\": 0,\n    \"no-underscore-dangle\": 0,\n    \"consistent-return\": 0,\n    \"react/display-name\": 1,\n    \"react/no-array-index-key\": 0,\n    \"react/jsx-no-useless-fragment\": [\"error\", { \"allowExpressions\": true }],\n    \"react/react-in-jsx-scope\": 0,\n    \"react/prefer-stateless-function\": 0,\n    \"react/forbid-prop-types\": 0,\n    \"react/no-unescaped-entities\": 0,\n    \"react/prop-types\": 0,\n    \"jsx-a11y/accessible-emoji\": 0,\n    \"react/jsx-filename-extension\": [1, { \"extensions\": [\".js\", \".jsx\"] }],\n    \"react/no-unknown-property\": [\"error\", { \"ignore\": [\"i18nIsDynamicList\"] }],\n    \"radix\": 0,\n    \"no-shadow\": [\n      2,\n      { \"hoist\": \"all\", \"allow\": [\"resolve\", \"reject\", \"done\", \"next\", \"err\", \"error\"] }\n    ],\n    \"quotes\": [2, \"single\", { \"avoidEscape\": true, \"allowTemplateLiterals\": true }],\n    \"jsx-a11y/href-no-hash\": \"off\",\n    \"jsx-a11y/anchor-is-valid\": [\"warn\", { \"aspects\": [\"invalidHref\"] }],\n    \"react/jsx-props-no-spreading\": 0\n  },\n  \"overrides\": [\n    {\n      \"files\": [\"test/*\"],\n      \"extends\": [\"plugin:testing-library/react\", \"plugin:jest-dom/recommended\"],\n      \"globals\": {\n        \"globalThis\": false\n      },\n      \"rules\": {\n        \"testing-library/no-node-access\": [\"error\", { \"allowContainerFirstChild\": true }],\n        \"testing-library/no-manual-cleanup\": \"off\"\n      }\n    }\n  ]\n}\n"
  },
  {
    "path": ".github/stale.yml",
    "content": "# Number of days of inactivity before an issue becomes stale\ndaysUntilStale: 7\n# Number of days of inactivity before a stale issue is closed\ndaysUntilClose: 7\n# Issues with these labels will never be considered stale\nexemptLabels:\n  - 'discussion'\n  - 'feature request'\n  - 'bug'\n  - 'breaking change'\n  - 'doc'\n  - 'issue'\n  - 'help wanted'\n  - 'good first issue'\n  - 'pr hold'\n# Label to use when marking an issue as stale\nstaleLabel: stale\n# Comment to post when marking an issue as stale. Set to `false` to disable\nmarkComment: >\n  This issue has been automatically marked as stale because it has not had\n  recent activity. It will be closed if no further activity occurs. Thank you\n  for your contributions.\n# Comment to post when closing a stale issue. Set to `false` to disable\ncloseComment: false\n"
  },
  {
    "path": ".github/workflows/CI.yml",
    "content": "name: CI\n\non:\n  push:\n    branches:\n      - master\n  pull_request:\n    # types: [opened, synchronize, reopened, ready_for_review]\n    branches:\n      - '**'\n\njobs:\n  codeQuality:\n    name: Check code quality (lint and format)\n    runs-on: ubuntu-latest\n    steps:\n      - uses: actions/checkout@v4\n\n      - name: Setup Node.js\n        uses: actions/setup-node@v4\n        with:\n          node-version: 20\n          cache: 'npm'\n\n      - name: Install dependencies\n        run: npm install\n\n      - name: Format check\n        run: npm run format\n\n      - name: Lint\n        run: npm run lint\n\n  build:\n    name: Build\n    runs-on: ubuntu-latest\n    steps:\n      - uses: actions/checkout@v4\n\n      - name: Setup Node.js\n        uses: actions/setup-node@v4\n        with:\n          node-version: 20\n          cache: 'npm'\n\n      - name: Install dependencies\n        run: npm install\n\n      - name: Build\n        run: npm run build\n\n  test:\n    name: Test on node ${{ matrix.node }} and ${{ matrix.os }}\n    runs-on: ${{ matrix.os }}\n    strategy:\n      matrix:\n        node: ['22.x', '20.x', '18.x']\n        os: [ubuntu-latest]\n        # Collect coverage only for node 20 and ubuntu-latest, no need to run it twice\n        # @see https://docs.github.com/en/actions/using-jobs/using-a-matrix-for-your-jobs#expanding-or-adding-matrix-configurations\n        include:\n          - collectCoverage: true\n            node: '20.x'\n            os: ubuntu-latest\n    steps:\n      - uses: actions/checkout@v4\n\n      - name: Setup Node.js\n        uses: actions/setup-node@v4\n        with:\n          node-version: ${{ matrix.node }}\n          cache: 'npm'\n\n      - name: Install dependencies\n        run: npm install\n\n      - name: Test\n        if: ${{ !matrix.collectCoverage }}\n        run: npm test\n\n      - name: Test with coverage\n        if: ${{ matrix.collectCoverage }}\n        run: npm run test:coverage\n\n      - name: Coveralls\n        if: ${{ matrix.collectCoverage }}\n        uses: coverallsapp/github-action@v2\n\n  testTypescript:\n    name: Test typescript\n    runs-on: ubuntu-latest\n    steps:\n      - uses: actions/checkout@v4\n\n      - name: Setup Node.js\n        uses: actions/setup-node@v4\n        with:\n          node-version: 20\n          cache: 'npm'\n\n      - name: Install dependencies\n        run: npm install\n\n      - name: Test\n        run: npm run test:typescript\n"
  },
  {
    "path": ".gitignore",
    "content": "# Ignore specific files\n.settings.xml\n.monitor\n.DS_Store\n*.orig\nnpm-debug.log\nnpm-debug.log.*\n*.dat\n.idea\n.vscode\n.eslintcache\n\n# Ignore various temporary files\n*~\n*.swp\n\n\n# Ignore various Node.js related directories and files\nnode_modules\nnode_modules/**/*\ncoverage/**/*\nexample/build/**/*\ndist/**/*\n.next\nyarn.lock\nout\n\n# ignore packaged releases\n*.tgz\n\n# vitest temp / cache files\ntsconfig.vitest-temp.json\n"
  },
  {
    "path": ".husky/pre-commit",
    "content": "npm exec lint-staged\n"
  },
  {
    "path": ".npmignore",
    "content": "test/\ncoverage/\nexample/\nbin/\n.babelrc\n.editorconfig\n.eslintignore\n.eslintrc\n.gitignore\nbower.json\n.github\n.circleci\n.vscode\nrollup.config.js\nrollup.config.mjs\n.all-contributorsrc\n.codeclimate.yml\n.coveralls.yml\ntsconfig*.json\n.prettierrc.json\nvitest.config.mts\nvitest.workspace.mts"
  },
  {
    "path": ".prettierignore",
    "content": "**/dist/\n**/react-i18next.js\n**/react-i18next.min.js\n**/example/\n"
  },
  {
    "path": ".prettierrc.json",
    "content": "{\n  \"$schema\": \"https://json.schemastore.org/prettierrc.json\",\n  \"bracketSpacing\": true,\n  \"bracketSameLine\": false,\n  \"printWidth\": 100,\n  \"semi\": true,\n  \"singleQuote\": true,\n  \"trailingComma\": \"all\"\n}\n"
  },
  {
    "path": "CHANGELOG.md",
    "content": "### 16.5.8\n\n- A selector function cannot be resolved without an i18n instance... returning empty string is safer than leaking the raw function reference. [1907](https://github.com/i18next/react-i18next/issues/1907)\n\n### 16.5.7\n\n- fix: `<Trans>` component with `enableSelector: true` does not support multiple selectors for fallbacks [1907](https://github.com/i18next/react-i18next/issues/1907)\n\n### 16.5.6\n\n- fix: prevent crash in `useSSR` when `init()` hasn't been called before `useSSR` — now logs a warning instead of throwing [1604](https://github.com/i18next/react-i18next/discussions/1604)\n\n### 16.5.5\n\n- fix: prevent crash in `useSSR`, `getInitialProps` and `Translation` when no i18next instance is available (e.g. in monorepo setups with duplicate `react-i18next` copies) — now logs a clear warning instead of throwing [1604](https://github.com/i18next/react-i18next/discussions/1604)\n\n### 16.5.4\n\n- fix: Overriding React component props not working [1902](https://github.com/i18next/react-i18next/pull/1902)\n\n### 16.5.3\n\n- fix: Trans named tags with underscore [1901](https://github.com/i18next/react-i18next/pull/1901)\n\n### 16.5.2\n\n- fix: Type errors when you've declared a resources type [1899](https://github.com/i18next/react-i18next/issues/1899) via [1900](https://github.com/i18next/react-i18next/pull/1900)\n\n### 16.5.1\n\n- fix: export `nodesToString` (runtime + TypeScript typings) to support `i18next-cli` ([i18next/i18next-cli#155](https://github.com/i18next/i18next-cli/pull/155))\n\n### 16.5.0\n\n- Add configuration option `transDefaultProps` to set default props for the Trans component (e.g. `tOptions`, `shouldUnescape`, `values`) [1895](https://github.com/i18next/react-i18next/issues/1895)\n\n### 16.4.1\n\n- fix(Trans): prevent double-escaping of interpolated values in component props (e.g. title). Unescape HTML entities before passing prop values to React to avoid rendered output like `&amp;quot;` / `&amp;#39;`. [1893](https://github.com/i18next/react-i18next/issues/1893)\n\n### 16.4.0\n\n- `<Trans count>` prop: optional - infer count from children [1891](https://github.com/i18next/react-i18next/issues/1891)\n\n### 16.3.5\n\n- fix runaway effect in useTranslation [1888](https://github.com/i18next/react-i18next/issues/1888) by [1889](https://github.com/i18next/react-i18next/pull/1889)\n\n### 16.3.4\n\n- Fix: avoid the \"ref is not a prop\" warning when a user ref is placed on an element inside `<Trans>` [1887](https://github.com/i18next/react-i18next/issues/1887), by still trying to fix element.ref access issue with react 19 [1846](https://github.com/i18next/react-i18next/pull/1846)\n\n### 16.3.3\n\n- improve useTranslation to fix \"Maximum update depth exceeded\" but still support new react-compiler [1885](https://github.com/i18next/react-i18next/issues/1885) [1863](https://github.com/i18next/react-i18next/issues/1863#issuecomment-3491246391)\n\n### 16.3.2\n\n- fix: avoid \"Uncaught TypeError: Cannot redefine property: \\_\\_original\"\n\n### 16.3.1\n\n- revert fix: Incosistent behaviour of Trans and t. Trans set defaultValue when t call doesn't set the field. [1876](https://github.com/i18next/react-i18next/issues/1876) [f22d478](https://github.com/i18next/react-i18next/commit/f22d4787187e6cfc54d57f5fbede1c816ea19565)\n\n### 16.3.0\n\n- fix: add i18n wrapper for React Compiler and React.memo compatibility [1884](https://github.com/i18next/react-i18next/pull/1884)\n\n### 16.2.4\n\n- try to fix \"Trans component do not render anymore children as default value in test environment\" [1883](https://github.com/i18next/react-i18next/issues/1883) by also respecting [1876](https://github.com/i18next/react-i18next/issues/1876)\n\n### 16.2.3\n\n- fix hyphened component break issue [1882](https://github.com/i18next/react-i18next/pull/1882)\n\n### 16.2.2\n\n- fix trans component break with less than sign [1880](https://github.com/i18next/react-i18next/pull/1880), closes [1734](https://github.com/i18next/react-i18next/issues/1734)\n\n### 16.2.1\n\n- fix regression in v16.2.0: bindI18nStore does not work correctly [1879](https://github.com/i18next/react-i18next/issues/1879)\n\n### 16.2.0\n\n- try to address: useTranslation hook violates React's rules of hooks by conditionally calling inner hooks [1863](https://github.com/i18next/react-i18next/issues/1863)\n\n### 16.1.6\n\n- fix: fix: handle spread props for inner components in Trans (icu) [1877](https://github.com/i18next/react-i18next/pull/1877)\n\n### 16.1.5\n\n- fix: Incosistent behaviour of Trans and t. Trans set defaultValue when t call doesn't set the field. [1876](https://github.com/i18next/react-i18next/issues/1876)\n- Trans: use also defaultValue via tOptions as fallback\n\n### 16.1.4\n\n- fix: detect pre-transformation use of interpolation like number/date/etc. [1875](https://github.com/i18next/react-i18next/pull/1875)\n\n### 16.1.3\n\n- fix: ensure invalid identifiers are quoted in the props object [1874](https://github.com/i18next/react-i18next/pull/1874)\n\n### 16.1.2\n\n- missing.js extensions for Icu imports\n\n### 16.1.1\n\n- exports for `IcuTrans` component [1873](https://github.com/i18next/react-i18next/pull/1873)\n\n### 16.1.0\n\n- Introduce `IcuTrans` component [1869](https://github.com/i18next/react-i18next/issues/1869)\n\n### 16.0.1\n\n- fix: Using <Trans> component with named tags throws error when Selector API is enabled [1867](https://github.com/i18next/react-i18next/issues/1867) with [1868](https://github.com/i18next/react-i18next/pull/1868)\n\n### 16.0.0\n\n- major upgrade i18next dep to address [1865](https://github.com/i18next/react-i18next/issues/1865)\n\n### 15.7.4\n\n- downgrade i18next dep to address [1865](https://github.com/i18next/react-i18next/issues/1865)\n\n### 15.7.3\n\n- exports TransSelectorProps [1862](https://github.com/i18next/react-i18next/pull/1862) to address [1861](https://github.com/i18next/react-i18next/issues/1861)\n\n### 15.7.2\n\n- update i18next dependency\n\n### 15.7.1\n\n- Fix: \\_EnableSelector type (for compatibility, enableSelector does not exist in TypeOptions) [1858](https://github.com/i18next/react-i18next/pull/1858)\n\n### 15.7.0\n\n- add new selector API to improve TypeScript IDE performance [1852](https://github.com/i18next/react-i18next/pull/1852)\n  - read more about it [here](https://github.com/i18next/i18next/blob/master/CHANGELOG.md#2540)\n\n### 15.6.1\n\navoid exception when passing bindI18n: false [1856](https://github.com/i18next/react-i18next/pull/1856)\n\n### 15.6.0\n\nfix: passing components as object should still allow for indexed matching of children [1854](https://github.com/i18next/react-i18next/pull/1854)\n\n### 15.5.3\n\nchore: update `@babel/runtime` [1851](https://github.com/i18next/react-i18next/pull/1851)\n\n### 15.5.2\n\nfix element.ref access issue with react 19 [1846](https://github.com/i18next/react-i18next/pull/1846)\n\n### 15.5.1\n\nadd typescript as optional peer dependency [1843](https://github.com/i18next/react-i18next/pull/1843)\n\n### 15.5.0\n\nfeat: use const type parameters for useTranslation() [1842](https://github.com/i18next/react-i18next/pull/1842)\n\n### 15.4.1\n\nfix: unique key warning on componentized element [1835](https://github.com/i18next/react-i18next/pull/1835)\n\n### 15.4.0\n\nfeat: add meta with codes on warnings to allow conditional logging [1826](https://github.com/i18next/react-i18next/pull/1826)\n\n### 15.3.0\n\nUses the i18next logger instead of the default console logger, if there is a valid i18next instance. Now the debug i18next option is respected, and you can also inject your own logger module: https://www.i18next.com/misc/creating-own-plugins#logger\n\n### 15.2.0\n\nThis version may be breaking if you still use React < v18 with TypeScript.\nFor JS users this version is equal to v15.1.4\n\n- fix: Global JSX namespace is deprecated [1823](https://github.com/i18next/react-i18next/issues/1823) with [1822](https://github.com/i18next/react-i18next/pull/1822)\n\n### 15.1.4\n\n- Fix: warning each child should have a unique key [1820](https://github.com/i18next/react-i18next/pull/1820)\n\n### 15.1.3\n\n- fix: Self-closing REACT components in translation strings should not attempt to replace the component's children [1815](https://github.com/i18next/react-i18next/issues/1815) [1816](https://github.com/i18next/react-i18next/pull/1816)\n\n### 15.1.2\n\n- fix: Attempted to assign to readonly property [1813](https://github.com/i18next/react-i18next/pull/1813)\n\n### 15.1.1\n\n- fix: Not all namespaces are loaded when passing the lng option to useTranslate [1809](https://github.com/i18next/react-i18next/issues/1809)\n\n### 15.1.0\n\n- fix: `<Trans />` warns 'Each child in a list should have a unique \"key\" prop.' for react 19 [1806](https://github.com/i18next/react-i18next/pull/1806)\n\n### 15.0.3\n\n- try to fix [unexpected token issue](https://github.com/i18next/next-i18next/issues/2302)\n\n### 15.0.2\n\n- try to fix Trans handling with alwaysFormat set to true [1801](https://github.com/i18next/react-i18next/issues/1801)\n\n### 15.0.1\n\n- revert arrow function in class property to address [this](https://github.com/i18next/react-i18next/commit/46e8ea5ff69325b73087811a2ce6a2b1faffa971#r145061161)\n\n### 15.0.0\n\n- use optional chaining, nullish coalescing and nullish coalescing assignment [1774](https://github.com/i18next/react-i18next/pull/1774)\n- Build config and optimizations [1769](https://github.com/i18next/react-i18next/pull/1769)\n- some dependency updates [1768](https://github.com/i18next/react-i18next/pull/1768)\n- use modern hasLoadedNamespace code (now requires at least i18next > v19.4.5 (introduced in june 2020))\n\n### 14.1.3\n\n- create a isObject helper function [1766](https://github.com/i18next/react-i18next/pull/1766)\n- optimize nodesToString [1765](https://github.com/i18next/react-i18next/pull/1765)\n- Simplifies hasValidReactChildren [1764](https://github.com/i18next/react-i18next/pull/1764)\n- create a isString helper to avoid code duplication [1763](https://github.com/i18next/react-i18next/pull/1763)\n- use arrow functions where possible [1762](https://github.com/i18next/react-i18next/pull/1762)\n- use the commented out async code [1761](https://github.com/i18next/react-i18next/pull/1761)\n\n### 14.1.2\n\n- bring back internal interpolationOverride handling for Trans component (if there are childrens), fixes [1754](https://github.com/i18next/react-i18next/issues/1754)\n\n### 14.1.1\n\n- do not modify passed tOptions context property to address [1745](https://github.com/i18next/react-i18next/issues/1745)\n\n### 14.1.0\n\n- types(`Trans`): add typechecking on context prop [1732](https://github.com/i18next/react-i18next/pull/1732) (might break if using \"internal\" `Trans` or `TransProps`)\n\n### 14.0.8\n\n- fix: issue [1728](https://github.com/i18next/react-i18next/issues/1728) when useSuspense is false and default ns [1731](https://github.com/i18next/react-i18next/pull/1731)\n\n### 14.0.7\n\n- try to get rid of internal interpolationOverride handling for Trans component, fixes [1729](https://github.com/i18next/react-i18next/issues/1729)\n\n### 14.0.6\n\n- align context handling of Trans component with t function, fixes [1729](https://github.com/i18next/react-i18next/issues/1729)\n\n### 14.0.5\n\n- Fix [1691](https://github.com/i18next/react-i18next/issues/1691) for strict mode, by preserving change language binding [1720](https://github.com/i18next/react-i18next/pull/1720)\n\n### 14.0.4\n\n- fix interpolation of the count prop [1719](https://github.com/i18next/react-i18next/issues/1719)\n\n### 14.0.3\n\n- revert changes done in v14.0.2 since it breaks normal language change render updates\n\n### 14.0.2\n\n- Fix/bug [1691](https://github.com/i18next/react-i18next/issues/1691) make returned t function identical upon second effect run in strict mode [1716](https://github.com/i18next/react-i18next/pull/1716)\n\n### 14.0.1\n\n- types: fix typo in `CustomInstanceExtensions` [1713](https://github.com/i18next/react-i18next/pull/1713)\n\n### 14.0.0\n\n- types: reportNamespaces is now optional, should fix [1693](https://github.com/i18next/react-i18next/issues/1693)\n\n### 13.5.0\n\n- self-closing components in translation strings should not attempt to replace the component's children [1695](https://github.com/i18next/react-i18next/issues/1695)\n\n### 13.4.1\n\n- types: use CustomInstanceExtenstions to extend reportNamespaces\n\n### 13.4.0\n\n- fix: separate cjs and mjs typings\n\n### 13.3.2\n\n- types: fix consider importing '\\*.js'\n\n### 13.3.1\n\n- optimize defaultVariables feature introduced in last release\n\n### 13.3.0\n\n- Respect defaultVariables in the interpolation options [1685](https://github.com/i18next/react-i18next/issues/1685)\n\n### 13.2.2\n\n- Fix missing TransWithoutContext type [1672](https://github.com/i18next/react-i18next/pull/1672)\n\n### 13.2.1\n\n- types: Allow iterable ReactI18NextChildren as children [1669](https://github.com/i18next/react-i18next/pull/1669)\n\n### 13.2.0\n\n- Don't use defaults prop as default key [1664](https://github.com/i18next/react-i18next/pull/1664)\n\n### 13.1.2\n\n- postpone usage of newer ES syntax\n\n### 13.1.1\n\n- Render all children regardless of type when using i18nIsDynamicList prop [1661](https://github.com/i18next/react-i18next/pull/1661)\n\n### 13.1.0\n\n- Fix non-list dynamic content in Trans component [1660](https://github.com/i18next/react-i18next/pull/1660)\n\n### 13.0.3\n\n- fix unescape is not consistently called for all values [1657](https://github.com/i18next/react-i18next/issues/1657)\n\n### 13.0.2\n\n- export icu.macro [1652](https://github.com/i18next/react-i18next/issues/1652)\n\n### 13.0.1\n\n- types: Fix performance issue in Trans component [1646](https://github.com/i18next/react-i18next/pull/1646)\n\n### 13.0.0\n\n- Update types to support t function redesign [1615](https://github.com/i18next/react-i18next/pull/1615)\n- requires i18next >= v23.0.1\n\n### 12.3.1\n\n- optimization for optional lng prop for useTranslation, should now prevent missings when lazy loading translations [1637](https://github.com/i18next/react-i18next/issues/1637)\n\n### 12.3.0\n\n- optional lng prop for useTranslation (helping on server side [1637](https://github.com/i18next/react-i18next/issues/1637))\n\n### 12.2.2\n\n- try to fix conditional exports in package.json\n\n### 12.2.1\n\n- type fix: the type of defaultNS in I18nextProvider should support string[] [1633](https://github.com/i18next/react-i18next/pull/1633)\n\n### 12.2.0\n\n- if defaultValue is passed in not ready t functio (via useTranslation) return that instead of the key, even though the user-land could should be fixed [1618](https://github.com/i18next/react-i18next/issues/1618)\n\n### 12.1.5\n\n- fix react merged types [1606](https://github.com/i18next/react-i18next/pull/1606) originally introduced with #1531 to address #1506\n\n### 12.1.4\n\n- fix crash in gatsby [1594](https://github.com/i18next/react-i18next/issues/1594)\n\n### 12.1.3\n\n- fix fallback of t function in Trans component\n\n### 12.1.2\n\n- fix crash in gatsby [1594](https://github.com/i18next/react-i18next/issues/1594)\n\n### 12.1.1\n\n- fix for node resolution [1589](https://github.com/i18next/react-i18next/issues/1589)\n\n### 12.1.0\n\n- context-less version of Trans component to be used for environments without react context [1588](https://github.com/i18next/react-i18next/pull/1588)\n\n### 12.0.0\n\n- Update t function types to rely on types coming from i18next [1501](https://github.com/i18next/react-i18next/pull/1501)\n\n### 11.18.6\n\n- types: nsMode [1554](https://github.com/i18next/react-i18next/issues/1554)\n\n### 11.18.5\n\n- support unescaping forward slash [1548](https://github.com/i18next/react-i18next/pull/1548)\n\n### 11.18.4\n\n- fix: reset t when keyPrefix is updated [1544](https://github.com/i18next/react-i18next/pull/1544)\n\n### 11.18.3\n\n- types: bindI18n option for UseTranslationOptions\n\n### 11.18.2\n\n- more html entities to unescape by default [1538](https://github.com/i18next/react-i18next/pull/1538)\n\n### 11.18.1\n\n- types: allow iterable with objects as children [1531](https://github.com/i18next/react-i18next/pull/1531)\n\n### 11.18.0\n\n- ability to add custom unescape function [1529](https://github.com/i18next/react-i18next/pull/1529)\n\n### 11.17.4\n\n- fix: UMD build [1527](https://github.com/i18next/react-i18next/issues/1527)\n\n### 11.17.3\n\n- style: explicit React imports [1525](https://github.com/i18next/react-i18next/pull/1525)\n\n### 11.17.2\n\n- reset t if ns changes in useTranslation [1518](https://github.com/i18next/react-i18next/pull/1518)\n\n### 11.17.1\n\n- Stricter typescript type for Trans components prop [1516](https://github.com/i18next/react-i18next/pull/1516)\n\n### 11.17.0\n\n- Add support for keyPrefix in withTranslation [1512](https://github.com/i18next/react-i18next/pull/1512)\n\n### 11.16.11\n\n- types: fix Translation component types regression [1511](https://github.com/i18next/react-i18next/pull/1511)\n\n### 11.16.10\n\n- types: translation component types [1509](https://github.com/i18next/react-i18next/pull/1509)\n\n### 11.16.9\n\n- types: fix missing generic type for HTMLAttributes [1499](https://github.com/i18next/react-i18next/pull/1499)\n\n### 11.16.8\n\n- types: fix Trans component to support react 18 types, by introducing allowObjectInHTMLChildren TS option [1492](https://github.com/i18next/react-i18next/pull/1492)\n\n### 11.16.7\n\n- types: Added objects explicitly to Trans children [1486](https://github.com/i18next/react-i18next/pull/1486)\n\n### 11.16.6\n\n- fix: warn just once 'i18n.languages were undefined or empty' and return true, like before\n\n### 11.16.5\n\n- types: ReactNode should be prefixed with React [1481](https://github.com/i18next/react-i18next/pull/1481)\n\n### 11.16.4\n\n- fix type 'TFunctionResult' is not assignable to type 'ReactNode' on React 18 [1480](https://github.com/i18next/react-i18next/pull/1480)\n\n### 11.16.3\n\n- types: children fix for React v18 [1478](https://github.com/i18next/react-i18next/pull/1478)\n- fix: apply [same fix](https://github.com/i18next/i18next/commit/0dcf7fdede9d58e16f82179b41b09f10eda5aeea) for local hasLoadedNamespace function\n\n### 11.16.2\n\n- update macro to wrap defaults in brackets when necessary [1472](https://github.com/i18next/react-i18next/pull/1472)\n\n### 11.16.1\n\n- types: for context prop of Trans component\n\n### 11.16.0\n\n- fix: transSupportBasicHtmlNodes for keepArray check [1470](https://github.com/i18next/react-i18next/pull/1470)\n- feat: add context prop to Trans component [1464](https://github.com/i18next/react-i18next/issues/1464)\n\n### 11.15.7\n\n- types: add nsSeparator to CustomTypeOptions [1471](https://github.com/i18next/react-i18next/pull/1471)\n\n### 11.15.6\n\n- fix error for typescript 4.6 [1453](https://github.com/i18next/react-i18next/pull/1463)\n\n### 11.15.5\n\n- types: fix never return type when using plurals [1453](https://github.com/i18next/react-i18next/pull/1453)\n\n### 11.15.4\n\n- types: add values field to Plural component in macros [1446](https://github.com/i18next/react-i18next/pull/1446)\n\n### 11.15.3\n\n- types: fix for issue introduced with type extension for react-native [1436](https://github.com/i18next/react-i18next/pull/1436)\n\n### 11.15.2\n\n- types: TypeScript interface for the Trans component does now accept react-native props [1418](https://github.com/i18next/react-i18next/pull/1418)\n\n### 11.15.1\n\n- add missing types for shouldUnescape and useTranslation [1429](https://github.com/i18next/react-i18next/pull/1429)\n\n### 11.15.0\n\n- option to unescape html in Trans [1426](https://github.com/i18next/react-i18next/pull/1426)\n\n### 11.14.3\n\n- types: remove undefined from conditional type [1410](https://github.com/i18next/react-i18next/pull/1410)\n\n### 11.14.2\n\n- Add type-safe support to deep keyPrefix [1403](https://github.com/i18next/react-i18next/pull/1403)\n\n### 11.14.1\n\n- Rollback [1402](https://github.com/i18next/react-i18next/pull/1402): Remove generics from Trans component to suppress warning issue [1400](https://github.com/i18next/react-i18next/pull/1400)\n\n### 11.14.0\n\n- Remove generics from Trans component to suppress warning issue [1400](https://github.com/i18next/react-i18next/pull/1400)\n- Add type support to plurals [1399](https://github.com/i18next/react-i18next/pull/1399)\n\n### 11.13.0\n\n- feat(types): add type-safe support to keyPrefix option [1390](https://github.com/i18next/react-i18next/pull/1390)\n- feat(types): allow key separator augmentation [1367](https://github.com/i18next/react-i18next/pull/1367)\n\n### 11.12.0\n\n- feature: add key prefix support to useTranslation hook [1371](https://github.com/i18next/react-i18next/pull/1371)\n\n### 11.11.4\n\n- typescript: add returnNull and returnEptyString options to TypeOptions interface [1341](https://github.com/i18next/react-i18next/pull/1341)\n\n### 11.11.3\n\n- Trans: parse first, then interpolate [1345](https://github.com/i18next/react-i18next/pull/1345)\n\n### 11.11.2\n\n- feat(typings): support readonly namespaces in TFuncKey [1340](https://github.com/i18next/react-i18next/pull/1340)\n\n### 11.11.1\n\n- feat(types): allow readonly namespaces in useTranslation [1339](https://github.com/i18next/react-i18next/pull/1339)\n\n### 11.11.0\n\n- introduce `CustomTypeOptions` type definition and deprecate the `Resources` type definition [1328](https://github.com/i18next/react-i18next/pull/1328)\n\n### 11.10.0\n\n- add transWrapTextNodes option [1324](https://github.com/i18next/react-i18next/pull/1324) to prevent a well-known Google Translate issue with React apps [1323](https://github.com/i18next/react-i18next/issues/1323), thanks to [feross](https://github.com/feross)\n\n### 11.9.0\n\n- typescript/icu macro: add new syntax for interpolation of complex types [1316](https://github.com/i18next/react-i18next/pull/1316) -> [docs for template usage](https://react.i18next.com/misc/using-with-icu-format#tagged-template-for-icu)\n\n### 11.8.15\n\n- ignore null children in Trans component [1307](https://github.com/i18next/react-i18next/issues/1307)\n\n### 11.8.14\n\n- update html-parse-stringify to fix uppercase elements in Trans component [1304](https://github.com/i18next/react-i18next/issues/1304)\n\n### 11.8.13\n\n- Replace html-parse-stringify2 with html-parse-stringify [1283](https://github.com/i18next/react-i18next/pull/1283) to prevent [CVE-2021-23346](https://github.com/i18next/react-i18next/issues/1275)\n\n### 11.8.12\n\n- refactor: remove unneeded object [1286](https://github.com/i18next/react-i18next/pull/1286)\n\n### 11.8.11\n\n- typescript: Bug fixes [1284](https://github.com/i18next/react-i18next/pull/1284)\n\n### 11.8.10\n\n- typescript: Move type definition files [1276](https://github.com/i18next/react-i18next/pull/1276)\n\n### 11.8.9\n\n- Fix allow to replace i18n in provider with useTranslation hook [1273](https://github.com/i18next/react-i18next/pull/1273)\n\n### 11.8.8\n\n- typescript: Allow `TFuncKey` to be used without specifying the namespace, in the same way TFunction and useTranslation work [1262](https://github.com/i18next/react-i18next/pull/1262)\n\n### 11.8.7\n\n- warning for old wait usage\n\n### 11.8.6\n\n- typescript: Updated TS definitions (adding useSuspense option in TranslationProps) [1247](https://github.com/i18next/react-i18next/pull/1247)\n\n### 11.8.5\n\n- typescript: fix: Inference for specific keys ts 4.1 [1230](https://github.com/i18next/react-i18next/pull/1230)\n\n### 11.8.4\n\n- typescript: Add workaround to suppress infinite instantiation warning [1227](https://github.com/i18next/react-i18next/pull/1227)\n- typescript: withTranslation() typing fix for defaultProps [1226](https://github.com/i18next/react-i18next/pull/1226)\n- typescript: Accept const components prop for Trans [1224](https://github.com/i18next/react-i18next/pull/1224)\n\n### 11.8.3\n\n- Fix: Return type inference for t function (typescript 4.1) [1221](https://github.com/i18next/react-i18next/pull/1221)\n\n### 11.8.2\n\n- fix: type definitions for typescript 4.1 [1220](https://github.com/i18next/react-i18next/pull/1220)\n\n### 11.8.1\n\n- fix: typescript definitions for t function without namespaces [1214](https://github.com/i18next/react-i18next/pull/1214)\n\n### 11.8.0\n\n- typescript: Make the translation function fully type-safe [1193](https://github.com/i18next/react-i18next/pull/1193)\n- trans should work with misleading overloaded empty elements in components [1206](https://github.com/i18next/react-i18next/pull/1206)\n\n### 11.7.4\n\n- fixes passing interpolations options via Trans components tOptions prop [1204](https://github.com/i18next/react-i18next/pull/1204)\n\n### 11.7.3\n\n- Avoid redundant re-rendering in I18nextProvider [1174](https://github.com/i18next/react-i18next/pull/1174)\n\n### 11.7.2\n\n- Avoid setState while react is rendering [1165](https://github.com/i18next/react-i18next/pull/1165)\n\n### 11.7.1\n\n- typescript: fix: typescript definition of context object [1160](https://github.com/i18next/react-i18next/pull/1160)\n\n### 11.7.0\n\n- Trans interpolating self-closing tags in components prop(object) [1140](https://github.com/i18next/react-i18next/pull/1140)\n\n### 11.6.0\n\n- Trans allow components props to be an object containing named interpolation elements\n\n### 11.5.1\n\n- providing filename when running babel.parse in icu.macro [1133](https://github.com/i18next/react-i18next/pull/1133)\n\n### 11.5.0\n\n- Trans: merge option in mapAST [1120](https://github.com/i18next/react-i18next/pull/1120)\n\n### 11.4.0\n\n- Add sideEffects false to package json to allow tree shaking [1097](https://github.com/i18next/react-i18next/pull/1097)\n\n### 11.3.5\n\n- fix returning defaultValue for Trans component [1092](https://github.com/i18next/react-i18next/pull/1092)\n\n### 11.3.4\n\n- [useTranslation] Avoid setting the new `t` function if the component is unmounted. (1051)[https://github.com/i18next/react-i18next/pull/1051]\n\n### 11.3.3\n\n- fixes copying ns in useSSR\n\n### 11.3.2\n\n- typescript: Add optional defaultN [1050](https://github.com/i18next/react-i18next/pull/1050)\n\n### 11.3.1\n\n- typescript: Translation component's ready parameter is missing in TypeScript definition [1044](https://github.com/i18next/react-i18next/pull/1044)\n- change hook condition in Trans to equal useTranslations implementation\n\n### 11.3.0\n\n- useSSR: add namespaces to init options options.ns [1031](https://github.com/i18next/react-i18next/issues/1031)\n- typescript: Fix the type of the components props of Trans [1036](https://github.com/i18next/react-i18next/pull/1036)\n\n### 11.2.7\n\n- typescript: Allow ComponentType for Trans' `parent` type [1021](https://github.com/i18next/react-i18next/pull/1021)\n\n### 11.2.6\n\n- typescript: Allow html props on Trans, fix `parent` prop type [1019](https://github.com/i18next/react-i18next/pull/1019)\n\n### 11.2.5\n\n- handle array fallback on wrongly configured app ;) [1010](https://github.com/i18next/react-i18next/pull/1010)\n\n### 11.2.4\n\n- typescript: Extend withTranslation tests to include optional props [1009](https://github.com/i18next/react-i18next/pull/1009)\n\n### 11.2.3\n\n- Store should be initialized after useSSR [1008](https://github.com/i18next/react-i18next/pull/1008)\n\n### 11.2.2\n\n- Only pass forwardedRef to children if options.withRef is false [999](https://github.com/i18next/react-i18next/pull/999)\n\n### 11.2.1\n\n- remove used jsx in withTranslation to avoid issues while compiling [994](https://github.com/i18next/react-i18next/pull/994)\n\n### 11.2.0\n\n- withTranslation allow not only passing a ref with option withRef but also passing a forwardedRef from outside as props (before forwardedRef was only added to wrapped component if the withRef option was set) [992](https://github.com/i18next/react-i18next/pull/992)\n\n### 11.1.0\n\n- Update `rollup.config.js` for IE11 Transpilations [988](https://github.com/i18next/react-i18next/pull/988)\n\n### 11.0.1\n\n- typescript: Use updated ts export default from i18next [984](https://github.com/i18next/react-i18next/pull/984)\n\n### 11.0.0\n\n- **Breaking** based on i18next changes made in [v18.0.0](https://github.com/i18next/i18next/blob/master/CHANGELOG.md#1800) changing the language should not trigger a Suspense anylonger. The state will be ready and `t` bound to the previous language until `languageChanged` get triggered -> this results in a nicer experience for users (no flickering Suspense while changing the language). Based on issue \"Suspence is fired during lang change when useTranslation called in between\" [975](https://github.com/i18next/react-i18next/issues/975)\n- the default bindI18n is now `languageChanged` and `languageChanging` was removed from that default\n- Adding `languageChanging` to bindI18n will bring back old behaviour where a language change will trigger a Suspense / ready: false while loading those new translations\n- You can now override the defaults in i18next.options.react for `bindI18n`, `bindI18nStore` and `useSuspense` in the hook by `useTranslation(ns, { bindI18n, bindI18nStore, useSuspense})` or in the HOC by passing those as props.\n\n### 10.13.2\n\n- typescript: Add t function to TransProps types [969](https://github.com/i18next/react-i18next/pull/969)\n- lint: Fix linter errors [966](https://github.com/i18next/react-i18next/pull/966)\n\n### 10.13.1\n\n- avoid conditional hook call in edge case (was only issue in wrong setup useContext outside I18nextProvider) [951](https://github.com/i18next/react-i18next/pull/951)\n\n### 10.13.0\n\n- also use count from `values` object passed to Trans if passed - else use the one on props [947](https://github.com/i18next/react-i18next/pull/947)\n\n### 10.12.5\n\n- typescript: Update types for reportNamespaces [945](https://github.com/i18next/react-i18next/pull/945)\n- typescript: Improve withSSR type definition [943](https://github.com/i18next/react-i18next/pull/943)\n\n### 10.12.4\n\n- ICU: Fixes macro to support count prop and expressions better [939](https://github.com/i18next/react-i18next/pull/939)\n\n### 10.12.3\n\n- avoid conditional hook call in edge case (wrong setup) [935](https://github.com/i18next/react-i18next/pull/935)\n\n### 10.12.2\n\n- Trans: do not replace html tags in translation strings that are not in the transKeepBasicHtmlNodesFor array [919](https://github.com/i18next/react-i18next/issues/919)\n\n### 10.12.1\n\n- Set ready flag to false when i18n instance has not been initialised [918](https://github.com/i18next/react-i18next/pull/918)\n\n### 10.12.0\n\n- fix / extend icu.macro: ICU: Trans macro will parse defaults as alternate to children [917](https://github.com/i18next/react-i18next/pull/917)\n\n### 10.11.5\n\n- typescript: fix types for use() [912](https://github.com/i18next/react-i18next/pull/912)\n\n### 10.11.4\n\n- assert edge case trans component get set a key\n- assert context get destructed of empty object if context gets used falsely on a component got pulled out of main tree from react-portal or similar\n\n### 10.11.3\n\n- only apply initial values in useSSR, withSSR on i18next instances not being a clone (eg. created by express middleware on server) ==> don't apply on serverside\n\n### 10.11.2\n\n- Reload translations whenever namespaces passed to useTranslation() change [878](https://github.com/i18next/react-i18next/pull/878)\n\n### 10.11.1\n\n- fixes a regression in Trans component taking namespace from passed t function [867](https://github.com/i18next/react-i18next/issues/867#issuecomment-502395958)\n\n### 10.11.0\n\n- Restore support passing the defaultNS via I18nextProvider prop [860](https://github.com/i18next/react-i18next/pull/860)\n\n### 10.10.0\n\n- HOC: expose wrapped component as WrappedComponent property [853](https://github.com/i18next/react-i18next/pull/853)\n\n### 10.9.1\n\n- Fix useEffect mount/unmount usage [852](https://github.com/i18next/react-i18next/pull/852)\n\n### 10.9.0\n\n- trigger suspense on languageChanging by add listening to that event too (new in i18next@15.1.0) - if you do not like this behaviour of suspending during languageChange - remove it from bindI18n\n\n### 10.8.1\n\n- expose context [829](https://github.com/i18next/react-i18next/pull/829)\n\n### 10.8.0\n\n- Support taking values for interpolation not only from content but the props count, values too: Replace count prop from <Trans> in translation string automatically [826](https://github.com/i18next/react-i18next/issues/826)\n\n### 10.7.0\n\n- brings back nsMode=default|fallback [822](https://github.com/i18next/react-i18next/pull/822)\n- typescript: Add missing type definition for withTranslation options [821](https://github.com/i18next/react-i18next/pull/821)\n\n### 10.6.2\n\n- Fix Trans component ignore default options [818](https://github.com/i18next/react-i18next/pull/818)\n\n### 10.6.1\n\n- useTranslation useEffect also guard against unmounted for bound events...seems unmount and actual call to useEffect cleanup are not in correct order (component is first unmounted and then unbound - should be vice versa)\n\n### 10.6.0\n\n- use forwardRef for withTranslation [802](https://github.com/i18next/react-i18next/pull/802)\n- fixes Translation reset after component is unmounted with useTranslation [801](https://github.com/i18next/react-i18next/issues/801)\n\n### 10.5.3\n\n- Fix the displayName of HOC components [798](https://github.com/i18next/react-i18next/pull/798)\n\n### 10.5.2\n\n- fixes: transSupportBasicHtmlNodes doesn't work with self-closing Trans [790](https://github.com/i18next/react-i18next/issues/790)\n\n### 10.5.1\n\n- ReferenceError: setImmediate is not defined [787](https://github.com/i18next/react-i18next/issues/787)\n\n### 10.5.0\n\n- Adding support for nested component inside Trans that are a list.map like `<ul>{['a', 'b'].map(item => ( <li key={item}>{item}</li> ))}</ul>` [784](https://github.com/i18next/react-i18next/pull/784) (Adding `<ul i18nIsDynamicList>` will also create correct missing string)\n\n### 10.4.2\n\n- typescript: updated typescript definition of the UseTranslationOptions interface, added the useSuspense configuration property [778](https://github.com/i18next/react-i18next/pull/778)\n\n### 10.4.1\n\n- allow p in Trans\n\n### 10.4.0\n\n- allow br, strong, i tags be used for translations handled by Trans\n\n### 10.3.1\n\n- IE11 sending console as the first argument to apply [774](https://github.com/i18next/react-i18next/pull/774)\n\n### 10.3.0\n\n- Allow to enable/disable useSuspense at a hook or component level [769](https://github.com/i18next/react-i18next/pull/769)\n- typescript: Add ready/tReady type definitions [753](https://github.com/i18next/react-i18next/pull/753)\n\n### 10.2.1\n\n- fix cimode won't load therefore won't be ready [768](https://github.com/i18next/react-i18next/issues/768)\n\n### 10.2.0\n\n- Add bindI18nStore event options to listen to store changes if needed [749](https://github.com/i18next/react-i18next/pull/749)\n\n### 10.1.2\n\n- allow passing ready if i18next not initialized yet but initialStore set (timing issue in razzle)\n\n### 10.1.1\n\n- forward ready state in withTranslation, Translation\n\n### 10.1.0\n\n- better naming for Wrappers in HOC for easier use of react debugger in console\n- allow setting options react.useSuspense to false on i18next.init to avoid usage of suspense\n\n### 10.0.5\n\n- fixes namespace loading for false inital state undefined\n- typescript: Make children optional within TransProps [728](https://github.com/i18next/react-i18next/pull/728)\n\n### 10.0.4\n\n- try avoiding pull in of regenerator runtime for async usage -> use Promise for now\n\n### 10.0.3\n\n- fix initial props on withSSR\n\n### 10.0.2\n\n- refactor ready state in useTranslation\n\n### 10.0.1\n\n- allow object spread `const { t } = useTranslation()` [714](https://github.com/i18next/react-i18next/pull/714)\n- typescript: add types for I18nextProvider [721](https://github.com/i18next/react-i18next/pull/721)\n\n### 10.0.0\n\n- released to npm\n- for MIGRATION READ [https://react.i18next.com/latest/migrating-v9-to-v10](https://react.i18next.com/latest/migrating-v9-to-v10)\n\n### 10.0.0-alpha.3\n\n- hooks: make reportNS bound to the i18n instance - so report is per request [711](https://github.com/i18next/react-i18next/issues/711)\n\n### 10.0.0-alpha.2\n\n- hooks: add Translation render prop [708](https://github.com/i18next/react-i18next/issues/708)\n- hooks: add I18nextProvider for passing i18n instance via context\n- hooks: might fix infinit loop issue on undefined language (set ready to true anyway) [673](https://github.com/i18next/react-i18next/issues/673)\n\n### 10.0.0-alpha.1\n\n- hooks: initial alpha version with all build targets -> preparing v10 release\n\n### 9.0.10\n\n- typescript: Add TS definition for reportNS prop [699](https://github.com/i18next/react-i18next/pull/699)\n\n### 9.0.9\n\n- typescript: fix: useTranslation hooks typing [698](https://github.com/i18next/react-i18next/pull/698)\n\n### 9.0.8\n\n- typescript: TFunction usage inside NamespacesConsumer should behave [694](https://github.com/i18next/react-i18next/pull/694)\n\n### 9.0.7\n\n- fixing react-i18next throwing webpack error when initializeing using @babel/runtime 7.3.0 [685](https://github.com/i18next/react-i18next/issues/685)\n\n### 9.0.6\n\n- updated all deps\n\n### 9.0.5\n\n- UMD: Environment optimization with rollup-plugin-replace support [683](https://github.com/i18next/react-i18next/pull/683)\n\n### 9.0.4\n\n- typescript: add generic type to t function and the tests [665](https://github.com/i18next/react-i18next/pull/665)\n- hooks: enable passing in i18n to useTranslation hook so we could wrap that with a useContext enabled hook\n\n### 9.0.3\n\n- fix useSSR for hooks storing state on i18n instance and not globally [671](https://github.com/i18next/react-i18next/issues/671)\n- should fix case where fallbackLng is set false and invalid lng is loaded in hooks -> never ready [677](https://github.com/i18next/react-i18next/issues/677)\n- multiple typescript improvements\n\n### 9.0.2\n\n- fix hooks ts [658](https://github.com/i18next/react-i18next/pull/658)\n\n### 9.0.1\n\n- fix ts [655](https://github.com/i18next/react-i18next/pull/655)\n\n### 9.0.0\n\n- allow defining `transEmptyNodeValue` in i18next.options.react to set a default fallback value for empty nodes to allow i18next fallback flow [462](https://github.com/i18next/react-i18next/pull/462)\n- Warn if i18next instance is a promise [652](https://github.com/i18next/react-i18next/pull/652)\n- keeping legacy names (no deprecation on them as this will be last version using those -> v10 will be based on hooks)\n\n**BREAKING**\n\n- out of licensing reasons the ponyfill for react-context had to be removed [635](https://github.com/i18next/react-i18next/issues/635)\n\nUsing react >= 16.3.0 will be save - in other cases you will need to polyfill react.createContext yourself!!\n\n### 8.4.0\n\n- update typescript definitions for i18next v13 [631](https://github.com/i18next/react-i18next/pull/631)\n\n### 8.3.9\n\n- try fixing hooks ready algorithm [642](https://github.com/i18next/react-i18next/issues/642)\n\n### 8.3.8\n\n- try fixing edge case of unset state: [615](https://github.com/i18next/react-i18next/issues/615)\n\n### 8.3.7\n\n- handle initial SSR props only once\n\n### 8.3.6\n\n- remove componentWillReceiveProps call in I18nextProvider to comply with react strict mode [596](https://github.com/i18next/react-i18next/pull/596)\n\n### 8.3.5\n\n- rename named export to window.ReactI18next for standalone js\n\n### 8.3.4\n\n- try fixing standalone browser build\n\n### 8.3.3\n\n- remove wait option in hooks code (not used anylonger)\n\n### 8.3.2\n\n- use react suspense in hooks experimental code [learn more](https://react.i18next.com/experimental/using-with-hooks)\n\n### 8.3.1\n\n- make export in ./hooks.js explicit\n\n### 8.3.0\n\n- Ensure withI18n hoists static members. [584](https://github.com/i18next/react-i18next/pull/584)\n\n### 8.2.0\n\n- comes with support for hooks that are experimental in react v16.7.0-alpha [learn more](https://react.i18next.com/experimental/using-with-hooks)\n\n### 8.1.2\n\n- publish changes to typescript definitions [567](https://github.com/i18next/react-i18next/pull/567)\n\n### 8.1.1\n\n- persisting generated i18nOptions on withI18n hoc to avoid rerenders on pure components\n\n### 8.1.0\n\n- add typedefinitions [557](https://github.com/i18next/react-i18next/pull/557)\n\n### 8.0.8\n\n- add innerRefs support to withContext, withI18n\n\n### 8.0.7\n\n- replaces getWrappedInstance on withNamespaces / translate with passing a innerRef https://github.com/facebook/react/issues/13456 [534](https://github.com/i18next/react-i18next/issues/534)\n\n### 8.0.6\n\n- fix SSR cases\n\n### 8.0.5\n\n- fix issue with context not applied when merging i18n options\n\n### 8.0.4\n\n- add prop-types to peer deps as long we use the ponyfill create-react-context\n\n### 8.0.3\n\n- remove prop-types in tests\n\n### 8.0.2\n\n- remove proptypes dependency - not needed anylonger as we do not define old context\n- move out ssr stuff to utils\n- move reportNS to the NamespacesConsumer\n\n### 8.0.1\n\n- use @babel/plugin-transform-runtime\n\n### 8.0.0\n\n- translate HOC was renamed to \"withNamespaces\" as it controls which namespaces should be loaded\n- I18n render prop was renamed to \"NamespacesConsumer\" as it controls which namespaces should be \"consumed\"\n- there is a new context.consuming HOC \"withI18n\" adds i18n, t to component props (without the extra options of withNamespaces)\n\n- there is a simplification for interpolation in translations\n\n`'Hello <1><0>{{name}}</0></1>, you have <3>{{count}}</3> message. Open <5>hear</5>.'`\n\ncan be written as:\n\n`'Hello <1>{{name}}</1>, you have {{count}} message. Open <5>hear</5>.'`\n\n=> there is no need to add `<0>...</0>` around interpolated values anylonger\n=> your old files having those extra pseudo tags will still work without needing to change them\n\n- there is a new I18nContext -> I18nContext.provider, I18next.consumer using new react context api\n\n**Using react's new context api**\n\nshould be non breaking in most cases, with following exceptions:\n\n- using preact you will have to use preact.createContext plugin (or eventual hope the provided polyfill works for preact too)\n- you used the translate.getWrappedInstance function -> you will need to use instance.getWrappedInstance().getWrappedInstance() now as the translate hoc is now wrapped in an additional I18nContext.Consumer\n\nstill we prefer to increase this to a **major version** as beside the described egde cases there might be other effects we not have covered with our tests\n\n### 7.13.0\n\n- Load missing namespaces when updating ns prop on I18n component [523](https://github.com/i18next/react-i18next/pull/523)\n\n### 7.12.0\n\n- pass down lng via props in I18n and translate HOC - for use cases like [508](https://github.com/i18next/react-i18next/issues/508)\n\n### 7.11.1\n\n- fix related to issue #504: also report default Namespace with translate() [506](https://github.com/i18next/react-i18next/pull/506)\n\n### 7.11.0\n\n- Added reportNS function to I18NextProvider to report used namespaces [500](https://github.com/i18next/react-i18next/pull/500)\n\n### 7.10.1\n\n- fix small issue in icu.macro introduced on refactoring\n\n### 7.10.0\n\n- Adds import { Trans, Plural, Select } from `react-i18next/icu.macro` a babel macro to allow nicer components used with ICU format (which as default would result in invalid JSX). [discussion](https://github.com/i18next/react-i18next/issues/439)\n\n### 7.9.1\n\n- Skip custom html tags in Trans component translation [PR482](https://github.com/i18next/react-i18next/pull/482)\n\n### 7.9.0\n\n- Support defaultNS from I18nextProvider props [PR478](https://github.com/i18next/react-i18next/pull/478)\n- Don't polyfill Object.entries globally [476](https://github.com/i18next/react-i18next/pull/476)\n\n### 7.8.1\n\n- i18n in context is optional as it can be passed via props too [474](https://github.com/i18next/react-i18next/pull/474)\n\n### 7.8.0\n\n- avoid rerenders triggered by bound i18next events while I18n or translate hoc are not ready yet (omitBoundRerender: true --- is default) [456](https://github.com/i18next/react-i18next/issues/456)\n\n### 7.7.0\n\n- Allow Trans component to be used with props only for icu use case (next step babel makro) [439](https://github.com/i18next/react-i18next/issues/439)\n\n### 7.6.1\n\n- Allow to pass a function as parent for <Trans /> component [PR424](https://github.com/i18next/react-i18next/pull/424)\n\n### 7.6.0\n\n- adds tOptions to Trans component to support ICU\n- removes componentWillMount lifecycle method from I18n.js render props as it will get deprecated on react 16.3 [404](https://github.com/i18next/react-i18next/issues/404)\n\n### 7.5.1\n\n- Fix reference to props in constructor [PR411](https://github.com/i18next/react-i18next/pull/411)\n\n### 7.5.0\n\n- passes down tReady from translate hoc for cases you prefer showing a placeholder instead of default return null in case of wait: true and not yet loaded translations [PR400](https://github.com/i18next/react-i18next/pull/400)\n- I18n render prop calls with ready as third param\n\n### 7.4.0\n\n- enables setting prop `ns` on Trans component to override namespace passed by render prop or hoc\n- allows trans component with no children just returning the string getting from translations\n\n### 7.3.6\n\n- reorder selection of i18n in I18n render prop\n\n### 7.3.5\n\n- reorder selection of i18n in I18n render prop\n\n### 7.3.4\n\n- more save access to options in general\n\n### 7.3.3\n\n- more save access to options.react\n\n### 7.3.2\n\n- replace Interpolate PureComponent with Component to assert it gets rerendered on lng change\n\n### 7.3.1\n\n- remove react-dom from peer dependencies as module is used in react-native too\n\n### 7.3.0\n\n- Allow translate HOC to take a function for getting namespaces [372](https://github.com/i18next/react-i18next/pull/372)\n\n### 7.2.0\n\n- Add usePureComponent option [PR357](https://github.com/i18next/react-i18next/pull/357)\n- Render empty string on empty string as Trans child [PR364](https://github.com/i18next/react-i18next/pull/364)\n\n### 7.1.1\n\n- fixes: bring back Trans component t fc from context\n\n### 7.1.0\n\n- optional take i18n.t in Trans component if non t function passed in via props or context\n\n### 7.0.2\n\n- fixes rendering in Trans component in case of no parent\n\n### 7.0.1\n\n- working Trans component without the need of setting options.react\n\n### 7.0.0\n\n- **[BREAKING]** As with react 16 you can return multiple elements from render - based on that we do not need to return a wrapper any longer from Trans component.\n\nStarting with v7.0.0 Trans component per default won't add a parent div around content passed as children. It will just return it's children.\n\nYou still got the option to set a parent if you prefer content being wrapped.\n\nIf you prefer wrapping for all your Trans components (or for backwards compatibility) you can set option `react.defaultTransParent` to an element on i18next init.\n\n### 6.2.0\n\n- adds hashTransKey function for custom key generation in case of not passing a key to Trans component and not like having the source value as key\n\n### 6.1.0\n\n- pre-check namespaces to avoid unnecessary initial `null` render [PR336](https://github.com/i18next/react-i18next/pull/336)\n\n### 6.0.6\n\n- remove PureComponent from Trans\n\n### 6.0.5\n\n- fixes support passing i18n and t to Trans as props [PR315](https://github.com/i18next/react-i18next/pull/315)\n\n### 6.0.4\n\n- fixes translate hoc build\n\n### 6.0.3\n\n- stop using PureComponent and use Component again...seems we get an issue with react-router v4 if using PureComponents\n- recreate t function on i18next updates so PureComponents relying on t get an update triggered\n\n### 6.0.2\n\n- rebuild needed cause of uppercasing for components name was not reflected in last build\n\n### 6.0.1\n\n- remove react from dependencies - not sure how that came into the package.json\n\n### 6.0.0\n\n- **[BREAKING]** removes options to set translateFuncName in translate hoc (was not supported in Trans and Interpolate component anyway)\n- setting i18n instance and defaults can now be done by i18next.use(reactI18nextModule) making I18nextProvider obsolete\n- As an alternative to the translate hoc you now can use the I18n component supporting a render props (for details about render props https://www.youtube.com/watch?v=BcVAq3YFiuc)\n\n### 5.4.1\n\n- fixes AST implementation for preact\n\n### 5.4.0\n\n- replaces regex used to parse nodes from string to an ast implementation solving [#298](https://github.com/i18next/react-i18next/issues/298)\n\n### 5.3.0\n\n- Pass extra parameters to Trans parent component\n\n### 5.2.0\n\n- adds module export in package.json pointing to es dist files.\n\n### 5.1.0\n\n- you now can set i18n instance on translate hoc once using setI18n:\n\n```\nimport translate from 'react-i18next';\nimport i18n from './i18n';\n\ntranslate.setI18n(i18n);\n```\n\n### 5.0.0\n\n- **[BREAKING]** we no longer accept wait to be specified on i18next init options like `{ wait: true }` -> all overrides for the translate hoc now have to be in child `react` like `{ react: { wait: true } }`\n- you now can override all the default options for translate hoc by setting them on i18next.init (excluding `translateFuncName` as we need that upfront to define childContextTypes)\n\n```\ni18next.init({\n  // ... other options\n  react: {\n    wait: false,\n    withRef: false,\n    bindI18n: 'languageChanged loaded',\n    bindStore: 'added removed',\n    nsMode: 'default'\n  }\n});\n```\n\n- you now can override all defaults for translate hoc options (including `translateFuncName`) by using:\n\n```\nimport translate from 'react-i18next';\n\ntranslate.setDefaults({\n  wait: false,\n  withRef: false,\n  bindI18n: 'languageChanged loaded',\n  bindStore: 'added removed',\n  nsMode: 'default',\n  translateFuncName: 't'\n});\n```\n\n### 4.8.0\n\n- make trans component work with preact and preact-compat\n- add preact example\n\n### 4.7.0\n\n- Trans component parent element configurable [PR278](https://github.com/i18next/react-i18next/pull/278)\n\n### 4.6.4\n\n- optimize generated defaultValue for components not having children\n\n### 4.6.3\n\n- move react, prop-types, ... to peerDependency again\n\n### 4.6.2\n\n- optimize trans component output\n\n### 4.6.1\n\n- fixes issue in changeLanguage on set via translate hoc ssr\n\n### 4.6.0\n\n- allow passing initialI18nStore and initialLanguage to I18nextProvider via props to support simpler ssr\n- adds a serverside rendering sample based on razzle\n\n### 4.5.0\n\n- pass i18n instance to context inside translate hoc to simplify usage in nextjs\n- options.react.exposeNamespace will expose namespace on data-i18next-options for consuming in editors\n\n### 4.4.0\n\n- introduces Trans component which enables you to translate nested components incl. interpolation by resulting in one translatable string. [learn more](https://react.i18next.com/components/trans-component.html)\n\n### 4.3.0\n\n- allow passing down initialI18nStore and initialLanguage to translate hoc to support ssr scenario better see example/nextjs\n\n### 4.2.0\n\n- allow passing i18next instance in translate hoc options makes integration in nextjs easier\n\n### 4.1.2\n\n- Remove workaround to set ready if there was no initialized signal [PR263](https://github.com/i18next/react-i18next/pull/263)\n\n### 4.1.1\n\n- Fix react-i18next to work with TypeScript [PR261](https://github.com/i18next/react-i18next/pull/261)\n\n### 4.1.0\n\n- eslint cleanup\n- a lot more tests\n- flag nsMode: 'fallback' -> uses namespaces passed to translate hoc as fallbacks [#254](https://github.com/i18next/react-i18next/issues/254)\n\n### 4.0.0\n\n- deploys 3.1.1 as possible breaking: fixes issue in fixing t function - pass only first namespace not an array of namespaces (access other namespaces like: this.props.t('namespace:key'))\n\n### 3.1.2\n\n- reverts last change\n\n### 3.1.1\n\n- fixes issue in fixing t function - pass only first namespace not an array of namespaces\n\n### 3.1.0\n\n- fixes wrong warning of missing prop on interpolate with format\n- the wait flag on translate hoc can now be set globally on i18next options `i18next.init({ wait: true })`\n\n### 3.0.0\n\n- [BREAKING] assert you install prop-types as a peerDependency based on changes in react >= 15.5.x\n- update react to 15.5.x use prop-types module to remove react warnings [PR248](https://github.com/i18next/react-i18next/pull/248)\n- update all dependencies\n- move react, prop-types to peerDependencies\n\n### 2.2.3\n\n- try not access store if undefined for hmr\n\n### 2.2.1\n\n- fixes validation for missing prop in interpolate component\n\n### 2.2.0\n\n- support formatting inside interpolate component\n\n### 2.1.0\n\n- tanslate hoc: expose the i18n instance via props\n\n### 2.0.0\n\n- translate hoc wait option asserts now that i18next is initialized before rendering (waits for lng detection)\n- [BREAKING] needs i18next >= 4.2.0\n\n### 1.11.0\n\n- pass style prop to interpolate component\n- define i18next as a peerDependency\n\n### 1.10.1\n\n- Suppresses required context type warning if passing i18n as a prop [PR205](https://github.com/i18next/react-i18next/pull/205)\n\n### 1.10.0\n\n- allow passing i18next instance via props to translate hoc [PR203](https://github.com/i18next/react-i18next/pull/203)\n\n### 1.9.0\n\n- adds options bindI18n, bindStore can be set to false or string of events to bind for triggering updates\n\n### 1.8.0\n\n- allows to set a className on interpolate component\n- update all dependencies and devDependencies\n\n### 1.7.0\n\n- add option to change t function name to something else [PR196](https://github.com/i18next/react-i18next/pull/196)\n- Added an option of using the <Interpolate /> with a raw HTML [PR195](https://github.com/i18next/react-i18next/pull/195)\n\n### 1.6.3\n\n- only trigger loaded namespaces if mounted\n\n### 1.6.2\n\n- update for react 15.2, eliminates Unknown Prop Warning\n\n### 1.6.1\n\n- Added conditional warning on unmatched variable during interpolation [PR 160](https://github.com/i18next/react-i18next/pull/160\n\n### 1.6.0\n\n- Hoist non react statics [PR 150](https://github.com/i18next/react-i18next/pull/150\n\n### 1.5.3\n\n- Handle i18next added and removed resource events [PR 150](https://github.com/i18next/react-i18next/pull/150\n\n### 1.5.2\n\n- move ns loading to did mount\n\n### 1.5.1\n\n- possible fix for HRM issues\n\n### 1.5.0\n\n- adds wait option, which delays initial rendering until translations are loaded\n\n### 1.4.2\n\n- possible fix for HRM issues\n\n### 1.4.1\n\n- change global name\n\n### 1.4.0\n\n- adds getWrappedInstance() to translate wrapper\n\n### 1.3.0\n\n- Support for universal apps / server-side rendering [PR 52](https://github.com/i18next/react-i18next/pull/52)\n\n### 1.2.2\n\n- fixes bower json - bower publish only\n\n### 1.2.0\n\n- change build to rollup\n\n### 1.1.0\n\n- added WrappedComponent property to translate wrapper [PR 15](https://github.com/i18next/react-i18next/pull/15)\n\n### 1.0.1\n\n- fixing export of index\n\n### 1.0.0\n\n- change package.json main to `/lib/index.js`\n- move build from gulp to npm run script\n"
  },
  {
    "path": "LICENSE",
    "content": "The MIT License (MIT)\n\nCopyright (c) 2015-present i18next\n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.\n\n"
  },
  {
    "path": "README.md",
    "content": "# react-i18next [![Tweet](https://img.shields.io/twitter/url/http/shields.io.svg?style=social)](https://twitter.com/intent/tweet?text=Awesome%20react-i18next%20for%20react.js%20based%20on%20i18next%20internationalization%20ecosystem%20&url=https://github.com/i18next/react-i18next&via=jamuhl&hashtags=i18n,reactjs,js,dev)\n\n[![CI](https://github.com/i18next/react-i18next/actions/workflows/CI.yml/badge.svg)](https://github.com/i18next/react-i18next/actions/workflows/CI.yml)\n[![Coverage Status](https://coveralls.io/repos/github/i18next/react-i18next/badge.svg)](https://coveralls.io/github/i18next/react-i18next)\n[![Quality][quality-badge]][quality-url]\n[![npm][npm-dl-badge]][npm-url]\n\n[npm-icon]: https://nodei.co/npm/react-i18next.png?downloads=true\n[npm-url]: https://npmjs.org/package/react-i18next\n[quality-badge]: https://npm.packagequality.com/shield/react-i18next.svg\n[quality-url]: https://packagequality.com/#?package=react-i18next\n[npm-dl-badge]: https://img.shields.io/npm/dw/react-i18next\n\n### IMPORTANT:\n\nMaster Branch is the newest version using hooks (>= v10).\n\n```bash\n$ >=v10.0.0\nnpm i react-i18next\n```\n\n**react-native: To use hooks within react-native, you must use react-native v0.59.0 or higher**\n\nFor the legacy version please use the [v9.x.x Branch](https://github.com/i18next/react-i18next/tree/v9.x.x)\n\n```bash\n$ v9.0.10 (legacy)\nnpm i react-i18next@legacy\n```\n\n### Documentation\n\nThe documentation is published on [react.i18next.com](https://react.i18next.com) and PR changes can be supplied [here](https://github.com/i18next/react-i18next-gitbook).\n\nThe general i18next documentation is published on [www.i18next.com](https://www.i18next.com) and PR changes can be supplied [here](https://github.com/i18next/i18next-gitbook).\n\n### What will my code look like?\n\n**Before:** Your react code would have looked something like:\n\n```html\n...\n<div>Just simple content</div>\n<div>\n  Hello <strong title=\"this is your name\">{name}</strong>, you have {count} unread message(s). <Link to=\"/msgs\">Go to messages</Link>.\n</div>\n...\n```\n\n**After:** With the trans component just change it to:\n\n```html\n...\n<div>{t('simpleContent')}</div>\n<Trans i18nKey=\"userMessagesUnread\" count={count}>\n  Hello <strong title={t('nameTitle')}>{{name}}</strong>, you have {{count}} unread message. <Link to=\"/msgs\">Go to messages</Link>.\n</Trans>\n...\n```\n\n### 📖 What others say\n\n- [How to properly internationalize a React application using i18next](https://locize.com/blog/react-i18next/) by Adriano Raiano\n- [I18n with React and i18next](https://alligator.io/react/i18n-with-react-and-i18next) via Alligator.io by Danny Hurlburt\n- [Ultimate Localization of React (Mobx) App with i18next](https://itnext.io/ultimate-localization-of-react-mobx-app-with-i18next-efab77712149) via itnext.io by Viktor Shevchenko\n- [Internationalization for react done right Using the i18next i18n ecosystem](https://reactjsexample.com/internationalization-for-react-done-right-using-the-i18next-i18n-ecosystem/) via reactjsexample.com\n- [How to translate React application with react-i18next](https://codetain.com/blog/how-to-translate-react-application-with-react-i18next/) via codetain.co by Norbert Suski\n- [Building i18n with Gatsby](https://www.gatsbyjs.org/blog/2017-10-17-building-i18n-with-gatsby/) via gatsbyjs.org by Samuel Goudie\n- [Get your react.js application translated with style](https://medium.com/@jamuhl/get-your-react-js-application-translated-with-style-4ad090aefc2c) by Jan Mühlemann\n- [Translate your expo.io / react-native mobile application](https://medium.com/@jamuhl/translate-your-expo-io-react-native-mobile-application-aa220b2362d2) by Jan Mühlemann\n- You're welcome to share your story...\n\n### Why i18next?\n\n- **Simplicity:** no need to change your webpack configuration or add additional babel transpilers, just use create-react-app and go.\n- **Production ready** we know there are more needs for production than just doing i18n on the clientside, so we offer wider support on [serverside](https://www.i18next.com/overview/supported-frameworks) too (nodejs, php, ruby, .net, ...). **Learn once - translate everywhere**.\n- **Beyond i18n** comes with [Locize](https://locize.com) bridging the gap between development and translations - covering the whole translation process. Now with a **Free plan** for your side projects!\n\n![ecosystem](https://raw.githubusercontent.com/i18next/i18next/master/assets/i18next-ecosystem.jpg)\n\n### Localization workflow\n\nWant to learn more about how seamless your internationalization and translation process can be?\n\n[![video](example/locize/video_sample.png)](https://youtu.be/osScyaGMVqo)\n\n[watch the video](https://youtu.be/osScyaGMVqo)\n\n### Installation\n\nSource can be loaded via [npm](https://www.npmjs.com/package/react-i18next) or [downloaded](https://github.com/i18next/react-i18next/blob/master/react-i18next.min.js) from this repo.\n\n```\n# npm package\n$ npm install react-i18next\n```\n\n- If you don't use a module loader it will be added to `window.reactI18next`\n\n### Do you like to read a more complete step by step tutorial?\n\n[Here](https://locize.com/blog/react-i18next/) you'll find a simple tutorial on how to best use react-i18next.\nSome basics of i18next and some cool possibilities on how to optimize your localization workflow.\n\n### Examples\n\n- [Example react](https://github.com/i18next/react-i18next/tree/master/example/react)\n- [React examples with typescript](https://github.com/i18next/react-i18next/tree/master/example/react-typescript)\n- [Example locize.com](https://github.com/i18next/react-i18next/tree/master/example/locize)\n\n#### v9 samples\n\n- [Example react](https://github.com/i18next/react-i18next/tree/v9.x.x/example/react)\n- [Example preact](https://github.com/i18next/react-i18next/tree/v9.x.x/example/preact)\n- [Example react-native](https://github.com/i18next/react-i18next/tree/v9.x.x/example/reactnative-expo)\n- [Example expo.io](https://github.com/i18next/react-i18next/tree/v9.x.x/example/reactnative-expo)\n- [Example next.js](https://github.com/i18next/react-i18next/tree/v9.x.x/example/nextjs)\n- [Example razzle](https://github.com/i18next/react-i18next/tree/v9.x.x/example/razzle-ssr)\n- [Example hashbase / beaker browser](https://github.com/i18next/react-i18next/tree/v9.x.x/example/dat)\n- [Example storybook](https://github.com/i18next/react-i18next/tree/v9.x.x/example/storybook)\n- [Example locize.com](https://github.com/i18next/react-i18next/tree/v9.x.x/example/locize)\n- [Example test with jest](https://github.com/i18next/react-i18next/tree/v9.x.x/example/test-jest)\n\n### Requirements\n\n- react >= **16.8.0**\n- react-dom >= **16.8.0**\n- react-native >= **0.59.0**\n- i18next >= **10.0.0** (typescript users: >=17.0.9)\n\n#### v9\n\n- react >= **0.14.0** (in case of < v16 or preact you will need to define parent in [Trans component](https://react.i18next.com/legacy-v9/trans-component#trans-props) or globally in [i18next.react options](https://react.i18next.com/legacy-v9/trans-component#additional-options-on-i-18-next-init))\n- i18next >= **2.0.0**\n\n## Core Contributors\n\nThanks goes to these wonderful people ([emoji key](https://github.com/kentcdodds/all-contributors#emoji-key)):\n\n<!-- ALL-CONTRIBUTORS-LIST:START - Do not remove or modify this section -->\n<!-- prettier-ignore-start -->\n<!-- markdownlint-disable -->\n<table>\n  <tr>\n    <td align=\"center\"><a href=\"http://twitter.com/jamuhl\"><img src=\"https://avatars3.githubusercontent.com/u/977772?v=4?s=100\" width=\"100px;\" alt=\"\"/><br /><sub><b>Jan Mühlemann</b></sub></a><br /><a href=\"https://github.com/i18next/react-i18next/commits?author=jamuhl\" title=\"Code\">💻</a> <a href=\"#example-jamuhl\" title=\"Examples\">💡</a> <a href=\"https://github.com/i18next/react-i18next/pulls?q=is%3Apr+reviewed-by%3Ajamuhl+\" title=\"Reviewed Pull Requests\">👀</a> <a href=\"https://github.com/i18next/react-i18next/commits?author=jamuhl\" title=\"Documentation\">📖</a> <a href=\"#question-jamuhl\" title=\"Answering Questions\">💬</a></td>\n    <td align=\"center\"><a href=\"http://twitter.com/#!/adrirai\"><img src=\"https://avatars0.githubusercontent.com/u/1086194?v=4?s=100\" width=\"100px;\" alt=\"\"/><br /><sub><b>Adriano Raiano</b></sub></a><br /><a href=\"https://github.com/i18next/react-i18next/commits?author=adrai\" title=\"Code\">💻</a> <a href=\"#example-adrai\" title=\"Examples\">💡</a> <a href=\"https://github.com/i18next/react-i18next/pulls?q=is%3Apr+reviewed-by%3Aadrai+\" title=\"Reviewed Pull Requests\">👀</a> <a href=\"https://github.com/i18next/react-i18next/commits?author=adrai\" title=\"Documentation\">📖</a> <a href=\"#question-adrai\" title=\"Answering Questions\">💬</a></td>\n    <td align=\"center\"><a href=\"https://github.com/pedrodurek\"><img src=\"https://avatars1.githubusercontent.com/u/12190482?v=4?s=100\" width=\"100px;\" alt=\"\"/><br /><sub><b>Pedro Durek</b></sub></a><br /><a href=\"https://github.com/i18next/react-i18next/commits?author=pedrodurek\" title=\"Code\">💻</a> <a href=\"#example-pedrodurek\" title=\"Examples\">💡</a> <a href=\"https://github.com/i18next/react-i18next/pulls?q=is%3Apr+reviewed-by%3Apedrodurek+\" title=\"Reviewed Pull Requests\">👀</a> <a href=\"#question-pedrodurek\" title=\"Answering Questions\">💬</a></td>\n    <td align=\"center\"><a href=\"https://tigerabrodi.dev/\"><img src=\"https://avatars1.githubusercontent.com/u/49603590?v=4?s=100\" width=\"100px;\" alt=\"\"/><br /><sub><b>Tiger Abrodi</b></sub></a><br /><a href=\"https://github.com/i18next/react-i18next/commits?author=tigerabrodi\" title=\"Code\">💻</a> <a href=\"https://github.com/i18next/react-i18next/pulls?q=is%3Apr+reviewed-by%3Atigerabrodi\" title=\"Reviewed Pull Requests\">👀</a></td>\n  </tr>\n</table>\n\n<!-- markdownlint-restore -->\n<!-- prettier-ignore-end -->\n\n<!-- ALL-CONTRIBUTORS-LIST:END -->\n\nThis project follows the [all-contributors](https://github.com/kentcdodds/all-contributors) specification. Contributions of any kind are welcome!\n\n---\n\n<h3 align=\"center\">Gold Sponsors</h3>\n\n<p align=\"center\">\n  <a href=\"https://locize.com/\" target=\"_blank\">\n    <img src=\"https://raw.githubusercontent.com/i18next/i18next/master/assets/locize_sponsor_240.gif\" width=\"240px\">\n  </a>\n</p>\n\n---\n\n**localization as a service - [Locize](https://www.locize.com)**\n\nNeeding a translation management? Want to edit your translations with an InContext Editor? Use the original provided to you by the maintainers of i18next!\n\n**Now with a [Free plan](https://www.locize.com/pricing) for small projects!** Perfect for hobbyists or getting started.\n\n![Locize](https://www.locize.com/img/ads/github_locize.png)\n\nBy using [Locize](http://www.locize.com/?utm_source=react_i18next_readme&utm_medium=github) you directly support the future of i18next and react-i18next.\n\n---\n"
  },
  {
    "path": "TransWithoutContext.d.mts",
    "content": "export * from './TransWithoutContext.js';\n"
  },
  {
    "path": "TransWithoutContext.d.ts",
    "content": "import type {\n  i18n,\n  ReactOptions,\n  ApplyTarget,\n  ConstrainTarget,\n  GetSource,\n  ParseKeys,\n  Namespace,\n  SelectorFn,\n  TypeOptions,\n  TOptions,\n  TFunction,\n} from 'i18next';\nimport * as React from 'react';\n\ntype _DefaultNamespace = TypeOptions['defaultNS'];\ntype _EnableSelector = TypeOptions['enableSelector'];\n\ntype TransChild = React.ReactNode | Record<string, unknown>;\ntype $NoInfer<T> = [T][T extends T ? 0 : never];\n\nexport type TransProps<\n  Key extends ParseKeys<Ns, TOpt, KPrefix>,\n  Ns extends Namespace = _DefaultNamespace,\n  KPrefix = undefined,\n  TContext extends string | undefined = undefined,\n  TOpt extends TOptions & { context?: TContext } = { context: TContext },\n  E = React.HTMLProps<HTMLDivElement>,\n> = E & {\n  children?: TransChild | readonly TransChild[];\n  components?: readonly React.ReactElement[] | { readonly [tagName: string]: React.ReactElement };\n  count?: number;\n  context?: TContext;\n  defaults?: string;\n  i18n?: i18n;\n  i18nKey?: Key | Key[];\n  ns?: Ns;\n  parent?: string | React.ComponentType<any> | null; // used in React.createElement if not null\n  tOptions?: TOpt;\n  values?: {};\n  shouldUnescape?: boolean;\n  t?: TFunction<Ns, KPrefix>;\n};\n\nexport interface TransLegacy {\n  <\n    Key extends ParseKeys<Ns, TOpt, KPrefix>,\n    Ns extends Namespace = _DefaultNamespace,\n    KPrefix = undefined,\n    TContext extends string | undefined = undefined,\n    TOpt extends TOptions & { context?: TContext } = { context: TContext },\n    E = React.HTMLProps<HTMLDivElement>,\n  >(\n    props: TransProps<Key, Ns, KPrefix, TContext, TOpt, E>,\n  ): React.ReactElement;\n}\n\nexport interface TransSelectorProps<\n  Key,\n  Ns extends Namespace = _DefaultNamespace,\n  KPrefix = undefined,\n  TContext extends string | undefined = undefined,\n  TOpt extends TOptions & { context?: TContext } = { context: TContext },\n> {\n  children?: TransChild | readonly TransChild[];\n  components?: readonly React.ReactElement[] | { readonly [tagName: string]: React.ReactElement };\n  count?: number;\n  context?: TContext;\n  defaults?: string | Key;\n  i18n?: i18n;\n  i18nKey?: Key | readonly Key[];\n  ns?: Ns;\n  parent?: string | React.ComponentType<any> | null; // used in React.createElement if not null\n  tOptions?: TOpt;\n  values?: {};\n  shouldUnescape?: boolean;\n  t?: TFunction<Ns, KPrefix>;\n}\n\nexport interface TransSelector {\n  <\n    Target extends ConstrainTarget<TOpt>,\n    Key extends SelectorFn<GetSource<$NoInfer<Ns>, KPrefix>, ApplyTarget<Target, TOpt>, TOpt>,\n    const Ns extends Namespace = _DefaultNamespace,\n    KPrefix = undefined,\n    TContext extends string | undefined = undefined,\n    TOpt extends TOptions & { context?: TContext } = { context: TContext },\n    E = React.HTMLProps<HTMLDivElement>,\n  >(\n    props: TransSelectorProps<Key, Ns, KPrefix, TContext, TOpt> & E,\n  ): React.ReactElement;\n}\n\nexport const Trans: _EnableSelector extends true | 'optimize' ? TransSelector : TransLegacy;\n\nexport function nodesToString(\n  children: React.ReactNode,\n  i18nOptions?: ReactOptions,\n  i18n?: i18n,\n  i18nKey?: string,\n): string;\n\nexport type ErrorCode =\n  | 'NO_I18NEXT_INSTANCE'\n  | 'NO_LANGUAGES'\n  | 'DEPRECATED_OPTION'\n  | 'TRANS_NULL_VALUE'\n  | 'TRANS_INVALID_OBJ'\n  | 'TRANS_INVALID_VAR'\n  | 'TRANS_INVALID_COMPONENTS';\n\nexport type ErrorMeta = {\n  code: ErrorCode;\n  i18nKey?: string;\n  [x: string]: any;\n};\n\n/**\n * Use to type the logger arguments\n * @example\n * ```\n * import type { ErrorArgs } from 'react-i18next';\n *\n * const logger = {\n *   // ....\n *   warn: function (...args: ErrorArgs) {\n *      if (args[1]?.code === 'TRANS_INVALID_OBJ') {\n *        const [msg, { i18nKey, ...rest }] = args;\n *        return log(i18nKey, msg, rest);\n *      }\n *      log(...args);\n *   }\n * }\n * i18n.use(logger).use(i18nReactPlugin).init({...});\n * ```\n */\nexport type ErrorArgs = readonly [string, ErrorMeta | undefined, ...any[]];\n"
  },
  {
    "path": "example/ReactNativeLocizeProject/.bundle/config",
    "content": "BUNDLE_PATH: \"vendor/bundle\"\nBUNDLE_FORCE_RUBY_PLATFORM: 1\n"
  },
  {
    "path": "example/ReactNativeLocizeProject/.eslintrc.js",
    "content": "module.exports = {\n  root: true,\n  extends: '@react-native',\n};\n"
  },
  {
    "path": "example/ReactNativeLocizeProject/.gitignore",
    "content": "# OSX\n#\n.DS_Store\n\n# Xcode\n#\nbuild/\n*.pbxuser\n!default.pbxuser\n*.mode1v3\n!default.mode1v3\n*.mode2v3\n!default.mode2v3\n*.perspectivev3\n!default.perspectivev3\nxcuserdata\n*.xccheckout\n*.moved-aside\nDerivedData\n*.hmap\n*.ipa\n*.xcuserstate\n**/.xcode.env.local\n\n# Android/IntelliJ\n#\nbuild/\n.idea\n.gradle\nlocal.properties\n*.iml\n*.hprof\n.cxx/\n*.keystore\n!debug.keystore\n.kotlin/\n\n# node.js\n#\nnode_modules/\nnpm-debug.log\nyarn-error.log\n\n# fastlane\n#\n# It is recommended to not store the screenshots in the git repo. Instead, use fastlane to re-generate the\n# screenshots whenever they are needed.\n# For more information about the recommended setup visit:\n# https://docs.fastlane.tools/best-practices/source-control/\n\n**/fastlane/report.xml\n**/fastlane/Preview.html\n**/fastlane/screenshots\n**/fastlane/test_output\n\n# Bundle artifact\n*.jsbundle\n\n# Ruby / CocoaPods\n**/Pods/\n/vendor/bundle/\n\n# Temporary files created by Metro to check the health of the file watcher\n.metro-health-check*\n\n# testing\n/coverage\n\n# Yarn\n.yarn/*\n!.yarn/patches\n!.yarn/plugins\n!.yarn/releases\n!.yarn/sdks\n!.yarn/versions\n"
  },
  {
    "path": "example/ReactNativeLocizeProject/.prettierrc.js",
    "content": "module.exports = {\n  arrowParens: 'avoid',\n  bracketSameLine: true,\n  bracketSpacing: false,\n  singleQuote: true,\n  trailingComma: 'all',\n};\n"
  },
  {
    "path": "example/ReactNativeLocizeProject/.watchmanconfig",
    "content": "{}\n"
  },
  {
    "path": "example/ReactNativeLocizeProject/App.tsx",
    "content": "import {Suspense, Component} from 'react';\nimport {Text, Button, View} from 'react-native';\nimport {useTranslation, withTranslation, Trans} from 'react-i18next';\nimport type {TFunction} from 'i18next';\n\n// use hoc for class based components\nclass LegacyWelcomeClass extends Component<{t: TFunction}> {\n  render() {\n    const {t} = this.props;\n    return <Text>{t('title')}</Text>;\n  }\n}\nconst Welcome = withTranslation()(LegacyWelcomeClass);\n\n// Component using the Trans component\nfunction MyComponent() {\n  return (\n    <Text>\n      <Trans i18nKey=\"description.part1\">\n        To get started, edit <Text>src/App.js</Text> and save to reload.\n      </Trans>\n    </Text>\n  );\n}\n\nfunction AppInner() {\n  const {t, i18n} = useTranslation();\n\n  const changeLanguage = (lng: string) => {\n    i18n.changeLanguage(lng);\n  };\n\n  return (\n    <View style={{flex: 1, justifyContent: 'center', alignItems: 'center'}}>\n      <Welcome />\n\n      <Button\n        onPress={() => changeLanguage('en')}\n        title=\"en\"\n        disabled={i18n.resolvedLanguage === 'en'}\n      />\n      <Button\n        onPress={() => changeLanguage('de')}\n        title=\"de\"\n        disabled={i18n.resolvedLanguage === 'de'}\n      />\n\n      <MyComponent />\n      <Text>{t('description.part2')}</Text>\n    </View>\n  );\n}\n\nexport default function App() {\n  return (\n    <Suspense fallback={<Text>loading...</Text>}>\n      <AppInner />\n    </Suspense>\n  );\n}\n"
  },
  {
    "path": "example/ReactNativeLocizeProject/Gemfile",
    "content": "source 'https://rubygems.org'\n\n# You may use http://rbenv.org/ or https://rvm.io/ to install and use this version\nruby \">= 2.6.10\"\n\n# Exclude problematic versions of cocoapods and activesupport that causes build failures.\ngem 'cocoapods', '>= 1.13', '!= 1.15.0', '!= 1.15.1'\ngem 'activesupport', '>= 6.1.7.5', '!= 7.1.0'\ngem 'xcodeproj', '< 1.26.0'\ngem 'concurrent-ruby', '< 1.3.4'\n\n# Ruby 3.4.0 has removed some libraries from the standard library.\ngem 'bigdecimal'\ngem 'logger'\ngem 'benchmark'\ngem 'mutex_m'\n"
  },
  {
    "path": "example/ReactNativeLocizeProject/README.md",
    "content": "This is a new [**React Native**](https://reactnative.dev) project, bootstrapped using [`@react-native-community/cli`](https://github.com/react-native-community/cli).\n\n# Getting Started\n\n> **Note**: Make sure you have completed the [Set Up Your Environment](https://reactnative.dev/docs/set-up-your-environment) guide before proceeding.\n\n## Step 1: Start Metro\n\nFirst, you will need to run **Metro**, the JavaScript build tool for React Native.\n\nTo start the Metro dev server, run the following command from the root of your React Native project:\n\n```sh\n# Using npm\nnpm start\n\n# OR using Yarn\nyarn start\n```\n\n## Step 2: Build and run your app\n\nWith Metro running, open a new terminal window/pane from the root of your React Native project, and use one of the following commands to build and run your Android or iOS app:\n\n### Android\n\n```sh\n# Using npm\nnpm run android\n\n# OR using Yarn\nyarn android\n```\n\n### iOS\n\nFor iOS, remember to install CocoaPods dependencies (this only needs to be run on first clone or after updating native deps).\n\nThe first time you create a new project, run the Ruby bundler to install CocoaPods itself:\n\n```sh\nbundle install\n```\n\nThen, and every time you update your native dependencies, run:\n\n```sh\nbundle exec pod install\n```\n\nFor more information, please visit [CocoaPods Getting Started guide](https://guides.cocoapods.org/using/getting-started.html).\n\n```sh\n# Using npm\nnpm run ios\n\n# OR using Yarn\nyarn ios\n```\n\nIf everything is set up correctly, you should see your new app running in the Android Emulator, iOS Simulator, or your connected device.\n\nThis is one way to run your app — you can also build it directly from Android Studio or Xcode.\n\n## Step 3: Modify your app\n\nNow that you have successfully run the app, let's make changes!\n\nOpen `App.tsx` in your text editor of choice and make some changes. When you save, your app will automatically update and reflect these changes — this is powered by [Fast Refresh](https://reactnative.dev/docs/fast-refresh).\n\nWhen you want to forcefully reload, for example to reset the state of your app, you can perform a full reload:\n\n- **Android**: Press the <kbd>R</kbd> key twice or select **\"Reload\"** from the **Dev Menu**, accessed via <kbd>Ctrl</kbd> + <kbd>M</kbd> (Windows/Linux) or <kbd>Cmd ⌘</kbd> + <kbd>M</kbd> (macOS).\n- **iOS**: Press <kbd>R</kbd> in iOS Simulator.\n\n## Congratulations! :tada:\n\nYou've successfully run and modified your React Native App. :partying_face:\n\n### Now what?\n\n- If you want to add this new React Native code to an existing application, check out the [Integration guide](https://reactnative.dev/docs/integration-with-existing-apps).\n- If you're curious to learn more about React Native, check out the [docs](https://reactnative.dev/docs/getting-started).\n\n# Troubleshooting\n\nIf you're having issues getting the above steps to work, see the [Troubleshooting](https://reactnative.dev/docs/troubleshooting) page.\n\n# Learn More\n\nTo learn more about React Native, take a look at the following resources:\n\n- [React Native Website](https://reactnative.dev) - learn more about React Native.\n- [Getting Started](https://reactnative.dev/docs/environment-setup) - an **overview** of React Native and how setup your environment.\n- [Learn the Basics](https://reactnative.dev/docs/getting-started) - a **guided tour** of the React Native **basics**.\n- [Blog](https://reactnative.dev/blog) - read the latest official React Native **Blog** posts.\n- [`@facebook/react-native`](https://github.com/facebook/react-native) - the Open Source; GitHub **repository** for React Native.\n"
  },
  {
    "path": "example/ReactNativeLocizeProject/__tests__/App.test.tsx",
    "content": "/**\n * @format\n */\n\nimport React from 'react';\nimport ReactTestRenderer from 'react-test-renderer';\nimport App from '../App';\n\ntest('renders correctly', async () => {\n  await ReactTestRenderer.act(() => {\n    ReactTestRenderer.create(<App />);\n  });\n});\n"
  },
  {
    "path": "example/ReactNativeLocizeProject/android/app/build.gradle",
    "content": "apply plugin: \"com.android.application\"\napply plugin: \"org.jetbrains.kotlin.android\"\napply plugin: \"com.facebook.react\"\n\n/**\n * This is the configuration block to customize your React Native Android app.\n * By default you don't need to apply any configuration, just uncomment the lines you need.\n */\nreact {\n    /* Folders */\n    //   The root of your project, i.e. where \"package.json\" lives. Default is '../..'\n    // root = file(\"../../\")\n    //   The folder where the react-native NPM package is. Default is ../../node_modules/react-native\n    // reactNativeDir = file(\"../../node_modules/react-native\")\n    //   The folder where the react-native Codegen package is. Default is ../../node_modules/@react-native/codegen\n    // codegenDir = file(\"../../node_modules/@react-native/codegen\")\n    //   The cli.js file which is the React Native CLI entrypoint. Default is ../../node_modules/react-native/cli.js\n    // cliFile = file(\"../../node_modules/react-native/cli.js\")\n\n    /* Variants */\n    //   The list of variants to that are debuggable. For those we're going to\n    //   skip the bundling of the JS bundle and the assets. By default is just 'debug'.\n    //   If you add flavors like lite, prod, etc. you'll have to list your debuggableVariants.\n    // debuggableVariants = [\"liteDebug\", \"prodDebug\"]\n\n    /* Bundling */\n    //   A list containing the node command and its flags. Default is just 'node'.\n    // nodeExecutableAndArgs = [\"node\"]\n    //\n    //   The command to run when bundling. By default is 'bundle'\n    // bundleCommand = \"ram-bundle\"\n    //\n    //   The path to the CLI configuration file. Default is empty.\n    // bundleConfig = file(../rn-cli.config.js)\n    //\n    //   The name of the generated asset file containing your JS bundle\n    // bundleAssetName = \"MyApplication.android.bundle\"\n    //\n    //   The entry file for bundle generation. Default is 'index.android.js' or 'index.js'\n    // entryFile = file(\"../js/MyApplication.android.js\")\n    //\n    //   A list of extra flags to pass to the 'bundle' commands.\n    //   See https://github.com/react-native-community/cli/blob/main/docs/commands.md#bundle\n    // extraPackagerArgs = []\n\n    /* Hermes Commands */\n    //   The hermes compiler command to run. By default it is 'hermesc'\n    // hermesCommand = \"$rootDir/my-custom-hermesc/bin/hermesc\"\n    //\n    //   The list of flags to pass to the Hermes compiler. By default is \"-O\", \"-output-source-map\"\n    // hermesFlags = [\"-O\", \"-output-source-map\"]\n\n    /* Autolinking */\n    autolinkLibrariesWithApp()\n}\n\n/**\n * Set this to true to Run Proguard on Release builds to minify the Java bytecode.\n */\ndef enableProguardInReleaseBuilds = false\n\n/**\n * The preferred build flavor of JavaScriptCore (JSC)\n *\n * For example, to use the international variant, you can use:\n * `def jscFlavor = io.github.react-native-community:jsc-android-intl:2026004.+`\n *\n * The international variant includes ICU i18n library and necessary data\n * allowing to use e.g. `Date.toLocaleString` and `String.localeCompare` that\n * give correct results when using with locales other than en-US. Note that\n * this variant is about 6MiB larger per architecture than default.\n */\ndef jscFlavor = 'io.github.react-native-community:jsc-android:2026004.+'\n\nandroid {\n    ndkVersion rootProject.ext.ndkVersion\n    buildToolsVersion rootProject.ext.buildToolsVersion\n    compileSdk rootProject.ext.compileSdkVersion\n\n    namespace \"com.reactnativelocizeproject\"\n    defaultConfig {\n        applicationId \"com.reactnativelocizeproject\"\n        minSdkVersion rootProject.ext.minSdkVersion\n        targetSdkVersion rootProject.ext.targetSdkVersion\n        versionCode 1\n        versionName \"1.0\"\n    }\n    signingConfigs {\n        debug {\n            storeFile file('debug.keystore')\n            storePassword 'android'\n            keyAlias 'androiddebugkey'\n            keyPassword 'android'\n        }\n    }\n    buildTypes {\n        debug {\n            signingConfig signingConfigs.debug\n        }\n        release {\n            // Caution! In production, you need to generate your own keystore file.\n            // see https://reactnative.dev/docs/signed-apk-android.\n            signingConfig signingConfigs.debug\n            minifyEnabled enableProguardInReleaseBuilds\n            proguardFiles getDefaultProguardFile(\"proguard-android.txt\"), \"proguard-rules.pro\"\n        }\n    }\n}\n\ndependencies {\n    // The version of react-native is set by the React Native Gradle Plugin\n    implementation(\"com.facebook.react:react-android\")\n\n    if (hermesEnabled.toBoolean()) {\n        implementation(\"com.facebook.react:hermes-android\")\n    } else {\n        implementation jscFlavor\n    }\n}\n"
  },
  {
    "path": "example/ReactNativeLocizeProject/android/app/proguard-rules.pro",
    "content": "# Add project specific ProGuard rules here.\n# By default, the flags in this file are appended to flags specified\n# in /usr/local/Cellar/android-sdk/24.3.3/tools/proguard/proguard-android.txt\n# You can edit the include path and order by changing the proguardFiles\n# directive in build.gradle.\n#\n# For more details, see\n#   http://developer.android.com/guide/developing/tools/proguard.html\n\n# Add any project specific keep options here:\n"
  },
  {
    "path": "example/ReactNativeLocizeProject/android/app/src/debug/AndroidManifest.xml",
    "content": "<?xml version=\"1.0\" encoding=\"utf-8\"?>\n<manifest xmlns:android=\"http://schemas.android.com/apk/res/android\"\n    xmlns:tools=\"http://schemas.android.com/tools\">\n\n    <application\n        android:usesCleartextTraffic=\"true\"\n        tools:targetApi=\"28\"\n        tools:ignore=\"GoogleAppIndexingWarning\"/>\n</manifest>\n"
  },
  {
    "path": "example/ReactNativeLocizeProject/android/app/src/main/AndroidManifest.xml",
    "content": "<manifest xmlns:android=\"http://schemas.android.com/apk/res/android\">\n\n    <uses-permission android:name=\"android.permission.INTERNET\" />\n\n    <application\n      android:name=\".MainApplication\"\n      android:label=\"@string/app_name\"\n      android:icon=\"@mipmap/ic_launcher\"\n      android:roundIcon=\"@mipmap/ic_launcher_round\"\n      android:allowBackup=\"false\"\n      android:theme=\"@style/AppTheme\"\n      android:supportsRtl=\"true\">\n      <activity\n        android:name=\".MainActivity\"\n        android:label=\"@string/app_name\"\n        android:configChanges=\"keyboard|keyboardHidden|orientation|screenLayout|screenSize|smallestScreenSize|uiMode\"\n        android:launchMode=\"singleTask\"\n        android:windowSoftInputMode=\"adjustResize\"\n        android:exported=\"true\">\n        <intent-filter>\n            <action android:name=\"android.intent.action.MAIN\" />\n            <category android:name=\"android.intent.category.LAUNCHER\" />\n        </intent-filter>\n      </activity>\n    </application>\n</manifest>\n"
  },
  {
    "path": "example/ReactNativeLocizeProject/android/app/src/main/java/com/reactnativelocizeproject/MainActivity.kt",
    "content": "package com.reactnativelocizeproject\n\nimport com.facebook.react.ReactActivity\nimport com.facebook.react.ReactActivityDelegate\nimport com.facebook.react.defaults.DefaultNewArchitectureEntryPoint.fabricEnabled\nimport com.facebook.react.defaults.DefaultReactActivityDelegate\n\nclass MainActivity : ReactActivity() {\n\n  /**\n   * Returns the name of the main component registered from JavaScript. This is used to schedule\n   * rendering of the component.\n   */\n  override fun getMainComponentName(): String = \"ReactNativeLocizeProject\"\n\n  /**\n   * Returns the instance of the [ReactActivityDelegate]. We use [DefaultReactActivityDelegate]\n   * which allows you to enable New Architecture with a single boolean flags [fabricEnabled]\n   */\n  override fun createReactActivityDelegate(): ReactActivityDelegate =\n      DefaultReactActivityDelegate(this, mainComponentName, fabricEnabled)\n}\n"
  },
  {
    "path": "example/ReactNativeLocizeProject/android/app/src/main/java/com/reactnativelocizeproject/MainApplication.kt",
    "content": "package com.reactnativelocizeproject\n\nimport android.app.Application\nimport com.facebook.react.PackageList\nimport com.facebook.react.ReactApplication\nimport com.facebook.react.ReactHost\nimport com.facebook.react.ReactNativeHost\nimport com.facebook.react.ReactPackage\nimport com.facebook.react.defaults.DefaultNewArchitectureEntryPoint.load\nimport com.facebook.react.defaults.DefaultReactHost.getDefaultReactHost\nimport com.facebook.react.defaults.DefaultReactNativeHost\nimport com.facebook.react.soloader.OpenSourceMergedSoMapping\nimport com.facebook.soloader.SoLoader\n\nclass MainApplication : Application(), ReactApplication {\n\n  override val reactNativeHost: ReactNativeHost =\n      object : DefaultReactNativeHost(this) {\n        override fun getPackages(): List<ReactPackage> =\n            PackageList(this).packages.apply {\n              // Packages that cannot be autolinked yet can be added manually here, for example:\n              // add(MyReactNativePackage())\n            }\n\n        override fun getJSMainModuleName(): String = \"index\"\n\n        override fun getUseDeveloperSupport(): Boolean = BuildConfig.DEBUG\n\n        override val isNewArchEnabled: Boolean = BuildConfig.IS_NEW_ARCHITECTURE_ENABLED\n        override val isHermesEnabled: Boolean = BuildConfig.IS_HERMES_ENABLED\n      }\n\n  override val reactHost: ReactHost\n    get() = getDefaultReactHost(applicationContext, reactNativeHost)\n\n  override fun onCreate() {\n    super.onCreate()\n    SoLoader.init(this, OpenSourceMergedSoMapping)\n    if (BuildConfig.IS_NEW_ARCHITECTURE_ENABLED) {\n      // If you opted-in for the New Architecture, we load the native entry point for this app.\n      load()\n    }\n  }\n}\n"
  },
  {
    "path": "example/ReactNativeLocizeProject/android/app/src/main/res/drawable/rn_edit_text_material.xml",
    "content": "<?xml version=\"1.0\" encoding=\"utf-8\"?>\n<!-- Copyright (C) 2014 The Android Open Source Project\n\n     Licensed under the Apache License, Version 2.0 (the \"License\");\n     you may not use this file except in compliance with the License.\n     You may obtain a copy of the License at\n\n          http://www.apache.org/licenses/LICENSE-2.0\n\n     Unless required by applicable law or agreed to in writing, software\n     distributed under the License is distributed on an \"AS IS\" BASIS,\n     WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n     See the License for the specific language governing permissions and\n     limitations under the License.\n-->\n<inset xmlns:android=\"http://schemas.android.com/apk/res/android\"\n       android:insetLeft=\"@dimen/abc_edit_text_inset_horizontal_material\"\n       android:insetRight=\"@dimen/abc_edit_text_inset_horizontal_material\"\n       android:insetTop=\"@dimen/abc_edit_text_inset_top_material\"\n       android:insetBottom=\"@dimen/abc_edit_text_inset_bottom_material\"\n       >\n\n    <selector>\n        <!--\n          This file is a copy of abc_edit_text_material (https://bit.ly/3k8fX7I).\n          The item below with state_pressed=\"false\" and state_focused=\"false\" causes a NullPointerException.\n          NullPointerException:tempt to invoke virtual method 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable$ConstantState.newDrawable(android.content.res.Resources)'\n\n          <item android:state_pressed=\"false\" android:state_focused=\"false\" android:drawable=\"@drawable/abc_textfield_default_mtrl_alpha\"/>\n\n          For more info, see https://bit.ly/3CdLStv (react-native/pull/29452) and https://bit.ly/3nxOMoR.\n        -->\n        <item android:state_enabled=\"false\" android:drawable=\"@drawable/abc_textfield_default_mtrl_alpha\"/>\n        <item android:drawable=\"@drawable/abc_textfield_activated_mtrl_alpha\"/>\n    </selector>\n\n</inset>\n"
  },
  {
    "path": "example/ReactNativeLocizeProject/android/app/src/main/res/values/strings.xml",
    "content": "<resources>\n    <string name=\"app_name\">ReactNativeLocizeProject</string>\n</resources>\n"
  },
  {
    "path": "example/ReactNativeLocizeProject/android/app/src/main/res/values/styles.xml",
    "content": "<resources>\n\n    <!-- Base application theme. -->\n    <style name=\"AppTheme\" parent=\"Theme.AppCompat.DayNight.NoActionBar\">\n        <!-- Customize your theme here. -->\n        <item name=\"android:editTextBackground\">@drawable/rn_edit_text_material</item>\n    </style>\n\n</resources>\n"
  },
  {
    "path": "example/ReactNativeLocizeProject/android/build.gradle",
    "content": "buildscript {\n    ext {\n        buildToolsVersion = \"35.0.0\"\n        minSdkVersion = 24\n        compileSdkVersion = 35\n        targetSdkVersion = 35\n        ndkVersion = \"27.1.12297006\"\n        kotlinVersion = \"2.0.21\"\n    }\n    repositories {\n        google()\n        mavenCentral()\n    }\n    dependencies {\n        classpath(\"com.android.tools.build:gradle\")\n        classpath(\"com.facebook.react:react-native-gradle-plugin\")\n        classpath(\"org.jetbrains.kotlin:kotlin-gradle-plugin\")\n    }\n}\n\napply plugin: \"com.facebook.react.rootproject\"\n"
  },
  {
    "path": "example/ReactNativeLocizeProject/android/gradle/wrapper/gradle-wrapper.properties",
    "content": "distributionBase=GRADLE_USER_HOME\ndistributionPath=wrapper/dists\ndistributionUrl=https\\://services.gradle.org/distributions/gradle-8.13-bin.zip\nnetworkTimeout=10000\nvalidateDistributionUrl=true\nzipStoreBase=GRADLE_USER_HOME\nzipStorePath=wrapper/dists\n"
  },
  {
    "path": "example/ReactNativeLocizeProject/android/gradle.properties",
    "content": "# Project-wide Gradle settings.\n\n# IDE (e.g. Android Studio) users:\n# Gradle settings configured through the IDE *will override*\n# any settings specified in this file.\n\n# For more details on how to configure your build environment visit\n# http://www.gradle.org/docs/current/userguide/build_environment.html\n\n# Specifies the JVM arguments used for the daemon process.\n# The setting is particularly useful for tweaking memory settings.\n# Default value: -Xmx512m -XX:MaxMetaspaceSize=256m\norg.gradle.jvmargs=-Xmx2048m -XX:MaxMetaspaceSize=512m\n\n# When configured, Gradle will run in incubating parallel mode.\n# This option should only be used with decoupled projects. More details, visit\n# http://www.gradle.org/docs/current/userguide/multi_project_builds.html#sec:decoupled_projects\n# org.gradle.parallel=true\n\n# AndroidX package structure to make it clearer which packages are bundled with the\n# Android operating system, and which are packaged with your app's APK\n# https://developer.android.com/topic/libraries/support-library/androidx-rn\nandroid.useAndroidX=true\n\n# Use this property to specify which architecture you want to build.\n# You can also override it from the CLI using\n# ./gradlew <task> -PreactNativeArchitectures=x86_64\nreactNativeArchitectures=armeabi-v7a,arm64-v8a,x86,x86_64\n\n# Use this property to enable support to the new architecture.\n# This will allow you to use TurboModules and the Fabric render in\n# your application. You should enable this flag either if you want\n# to write custom TurboModules/Fabric components OR use libraries that\n# are providing them.\nnewArchEnabled=true\n\n# Use this property to enable or disable the Hermes JS engine.\n# If set to false, you will be using JSC instead.\nhermesEnabled=true\n"
  },
  {
    "path": "example/ReactNativeLocizeProject/android/gradlew",
    "content": "#!/bin/sh\n\n#\n# Copyright © 2015-2021 the original authors.\n#\n# Licensed under the Apache License, Version 2.0 (the \"License\");\n# you may not use this file except in compliance with the License.\n# You may obtain a copy of the License at\n#\n#      https://www.apache.org/licenses/LICENSE-2.0\n#\n# Unless required by applicable law or agreed to in writing, software\n# distributed under the License is distributed on an \"AS IS\" BASIS,\n# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n# See the License for the specific language governing permissions and\n# limitations under the License.\n#\n# SPDX-License-Identifier: Apache-2.0\n#\n\n##############################################################################\n#\n#   Gradle start up script for POSIX generated by Gradle.\n#\n#   Important for running:\n#\n#   (1) You need a POSIX-compliant shell to run this script. If your /bin/sh is\n#       noncompliant, but you have some other compliant shell such as ksh or\n#       bash, then to run this script, type that shell name before the whole\n#       command line, like:\n#\n#           ksh Gradle\n#\n#       Busybox and similar reduced shells will NOT work, because this script\n#       requires all of these POSIX shell features:\n#         * functions;\n#         * expansions «$var», «${var}», «${var:-default}», «${var+SET}»,\n#           «${var#prefix}», «${var%suffix}», and «$( cmd )»;\n#         * compound commands having a testable exit status, especially «case»;\n#         * various built-in commands including «command», «set», and «ulimit».\n#\n#   Important for patching:\n#\n#   (2) This script targets any POSIX shell, so it avoids extensions provided\n#       by Bash, Ksh, etc; in particular arrays are avoided.\n#\n#       The \"traditional\" practice of packing multiple parameters into a\n#       space-separated string is a well documented source of bugs and security\n#       problems, so this is (mostly) avoided, by progressively accumulating\n#       options in \"$@\", and eventually passing that to Java.\n#\n#       Where the inherited environment variables (DEFAULT_JVM_OPTS, JAVA_OPTS,\n#       and GRADLE_OPTS) rely on word-splitting, this is performed explicitly;\n#       see the in-line comments for details.\n#\n#       There are tweaks for specific operating systems such as AIX, CygWin,\n#       Darwin, MinGW, and NonStop.\n#\n#   (3) This script is generated from the Groovy template\n#       https://github.com/gradle/gradle/blob/HEAD/platforms/jvm/plugins-application/src/main/resources/org/gradle/api/internal/plugins/unixStartScript.txt\n#       within the Gradle project.\n#\n#       You can find Gradle at https://github.com/gradle/gradle/.\n#\n##############################################################################\n\n# Attempt to set APP_HOME\n\n# Resolve links: $0 may be a link\napp_path=$0\n\n# Need this for daisy-chained symlinks.\nwhile\n    APP_HOME=${app_path%\"${app_path##*/}\"}  # leaves a trailing /; empty if no leading path\n    [ -h \"$app_path\" ]\ndo\n    ls=$( ls -ld \"$app_path\" )\n    link=${ls#*' -> '}\n    case $link in             #(\n      /*)   app_path=$link ;; #(\n      *)    app_path=$APP_HOME$link ;;\n    esac\ndone\n\n# This is normally unused\n# shellcheck disable=SC2034\nAPP_BASE_NAME=${0##*/}\n# Discard cd standard output in case $CDPATH is set (https://github.com/gradle/gradle/issues/25036)\nAPP_HOME=$( cd -P \"${APP_HOME:-./}\" > /dev/null && printf '%s\\n' \"$PWD\" ) || exit\n\n# Use the maximum available, or set MAX_FD != -1 to use that value.\nMAX_FD=maximum\n\nwarn () {\n    echo \"$*\"\n} >&2\n\ndie () {\n    echo\n    echo \"$*\"\n    echo\n    exit 1\n} >&2\n\n# OS specific support (must be 'true' or 'false').\ncygwin=false\nmsys=false\ndarwin=false\nnonstop=false\ncase \"$( uname )\" in                #(\n  CYGWIN* )         cygwin=true  ;; #(\n  Darwin* )         darwin=true  ;; #(\n  MSYS* | MINGW* )  msys=true    ;; #(\n  NONSTOP* )        nonstop=true ;;\nesac\n\nCLASSPATH=$APP_HOME/gradle/wrapper/gradle-wrapper.jar\n\n\n# Determine the Java command to use to start the JVM.\nif [ -n \"$JAVA_HOME\" ] ; then\n    if [ -x \"$JAVA_HOME/jre/sh/java\" ] ; then\n        # IBM's JDK on AIX uses strange locations for the executables\n        JAVACMD=$JAVA_HOME/jre/sh/java\n    else\n        JAVACMD=$JAVA_HOME/bin/java\n    fi\n    if [ ! -x \"$JAVACMD\" ] ; then\n        die \"ERROR: JAVA_HOME is set to an invalid directory: $JAVA_HOME\n\nPlease set the JAVA_HOME variable in your environment to match the\nlocation of your Java installation.\"\n    fi\nelse\n    JAVACMD=java\n    if ! command -v java >/dev/null 2>&1\n    then\n        die \"ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH.\n\nPlease set the JAVA_HOME variable in your environment to match the\nlocation of your Java installation.\"\n    fi\nfi\n\n# Increase the maximum file descriptors if we can.\nif ! \"$cygwin\" && ! \"$darwin\" && ! \"$nonstop\" ; then\n    case $MAX_FD in #(\n      max*)\n        # In POSIX sh, ulimit -H is undefined. That's why the result is checked to see if it worked.\n        # shellcheck disable=SC2039,SC3045\n        MAX_FD=$( ulimit -H -n ) ||\n            warn \"Could not query maximum file descriptor limit\"\n    esac\n    case $MAX_FD in  #(\n      '' | soft) :;; #(\n      *)\n        # In POSIX sh, ulimit -n is undefined. That's why the result is checked to see if it worked.\n        # shellcheck disable=SC2039,SC3045\n        ulimit -n \"$MAX_FD\" ||\n            warn \"Could not set maximum file descriptor limit to $MAX_FD\"\n    esac\nfi\n\n# Collect all arguments for the java command, stacking in reverse order:\n#   * args from the command line\n#   * the main class name\n#   * -classpath\n#   * -D...appname settings\n#   * --module-path (only if needed)\n#   * DEFAULT_JVM_OPTS, JAVA_OPTS, and GRADLE_OPTS environment variables.\n\n# For Cygwin or MSYS, switch paths to Windows format before running java\nif \"$cygwin\" || \"$msys\" ; then\n    APP_HOME=$( cygpath --path --mixed \"$APP_HOME\" )\n    CLASSPATH=$( cygpath --path --mixed \"$CLASSPATH\" )\n\n    JAVACMD=$( cygpath --unix \"$JAVACMD\" )\n\n    # Now convert the arguments - kludge to limit ourselves to /bin/sh\n    for arg do\n        if\n            case $arg in                                #(\n              -*)   false ;;                            # don't mess with options #(\n              /?*)  t=${arg#/} t=/${t%%/*}              # looks like a POSIX filepath\n                    [ -e \"$t\" ] ;;                      #(\n              *)    false ;;\n            esac\n        then\n            arg=$( cygpath --path --ignore --mixed \"$arg\" )\n        fi\n        # Roll the args list around exactly as many times as the number of\n        # args, so each arg winds up back in the position where it started, but\n        # possibly modified.\n        #\n        # NB: a `for` loop captures its iteration list before it begins, so\n        # changing the positional parameters here affects neither the number of\n        # iterations, nor the values presented in `arg`.\n        shift                   # remove old arg\n        set -- \"$@\" \"$arg\"      # push replacement arg\n    done\nfi\n\n\n# Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script.\nDEFAULT_JVM_OPTS='\"-Xmx64m\" \"-Xms64m\"'\n\n# Collect all arguments for the java command:\n#   * DEFAULT_JVM_OPTS, JAVA_OPTS, and optsEnvironmentVar are not allowed to contain shell fragments,\n#     and any embedded shellness will be escaped.\n#   * For example: A user cannot expect ${Hostname} to be expanded, as it is an environment variable and will be\n#     treated as '${Hostname}' itself on the command line.\n\nset -- \\\n        \"-Dorg.gradle.appname=$APP_BASE_NAME\" \\\n        -classpath \"$CLASSPATH\" \\\n        org.gradle.wrapper.GradleWrapperMain \\\n        \"$@\"\n\n# Stop when \"xargs\" is not available.\nif ! command -v xargs >/dev/null 2>&1\nthen\n    die \"xargs is not available\"\nfi\n\n# Use \"xargs\" to parse quoted args.\n#\n# With -n1 it outputs one arg per line, with the quotes and backslashes removed.\n#\n# In Bash we could simply go:\n#\n#   readarray ARGS < <( xargs -n1 <<<\"$var\" ) &&\n#   set -- \"${ARGS[@]}\" \"$@\"\n#\n# but POSIX shell has neither arrays nor command substitution, so instead we\n# post-process each arg (as a line of input to sed) to backslash-escape any\n# character that might be a shell metacharacter, then use eval to reverse\n# that process (while maintaining the separation between arguments), and wrap\n# the whole thing up as a single \"set\" statement.\n#\n# This will of course break if any of these variables contains a newline or\n# an unmatched quote.\n#\n\neval \"set -- $(\n        printf '%s\\n' \"$DEFAULT_JVM_OPTS $JAVA_OPTS $GRADLE_OPTS\" |\n        xargs -n1 |\n        sed ' s~[^-[:alnum:]+,./:=@_]~\\\\&~g; ' |\n        tr '\\n' ' '\n    )\" '\"$@\"'\n\nexec \"$JAVACMD\" \"$@\"\n"
  },
  {
    "path": "example/ReactNativeLocizeProject/android/gradlew.bat",
    "content": "@rem\r\n@rem Copyright 2015 the original author or authors.\r\n@rem\r\n@rem Licensed under the Apache License, Version 2.0 (the \"License\");\r\n@rem you may not use this file except in compliance with the License.\r\n@rem You may obtain a copy of the License at\r\n@rem\r\n@rem      https://www.apache.org/licenses/LICENSE-2.0\r\n@rem\r\n@rem Unless required by applicable law or agreed to in writing, software\r\n@rem distributed under the License is distributed on an \"AS IS\" BASIS,\r\n@rem WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r\n@rem See the License for the specific language governing permissions and\r\n@rem limitations under the License.\r\n@rem\r\n@rem SPDX-License-Identifier: Apache-2.0\r\n@rem\r\n\r\n@if \"%DEBUG%\"==\"\" @echo off\r\n@rem ##########################################################################\r\n@rem\r\n@rem  Gradle startup script for Windows\r\n@rem\r\n@rem ##########################################################################\r\n\r\n@rem Set local scope for the variables with windows NT shell\r\nif \"%OS%\"==\"Windows_NT\" setlocal\r\n\r\nset DIRNAME=%~dp0\r\nif \"%DIRNAME%\"==\"\" set DIRNAME=.\r\n@rem This is normally unused\r\nset APP_BASE_NAME=%~n0\r\nset APP_HOME=%DIRNAME%\r\n\r\n@rem Resolve any \".\" and \"..\" in APP_HOME to make it shorter.\r\nfor %%i in (\"%APP_HOME%\") do set APP_HOME=%%~fi\r\n\r\n@rem Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script.\r\nset DEFAULT_JVM_OPTS=\"-Xmx64m\" \"-Xms64m\"\r\n\r\n@rem Find java.exe\r\nif defined JAVA_HOME goto findJavaFromJavaHome\r\n\r\nset JAVA_EXE=java.exe\r\n%JAVA_EXE% -version >NUL 2>&1\r\nif %ERRORLEVEL% equ 0 goto execute\r\n\r\necho. 1>&2\r\necho ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH. 1>&2\r\necho. 1>&2\r\necho Please set the JAVA_HOME variable in your environment to match the 1>&2\r\necho location of your Java installation. 1>&2\r\n\r\ngoto fail\r\n\r\n:findJavaFromJavaHome\r\nset JAVA_HOME=%JAVA_HOME:\"=%\r\nset JAVA_EXE=%JAVA_HOME%/bin/java.exe\r\n\r\nif exist \"%JAVA_EXE%\" goto execute\r\n\r\necho. 1>&2\r\necho ERROR: JAVA_HOME is set to an invalid directory: %JAVA_HOME% 1>&2\r\necho. 1>&2\r\necho Please set the JAVA_HOME variable in your environment to match the 1>&2\r\necho location of your Java installation. 1>&2\r\n\r\ngoto fail\r\n\r\n:execute\r\n@rem Setup the command line\r\n\r\nset CLASSPATH=%APP_HOME%\\gradle\\wrapper\\gradle-wrapper.jar\r\n\r\n\r\n@rem Execute Gradle\r\n\"%JAVA_EXE%\" %DEFAULT_JVM_OPTS% %JAVA_OPTS% %GRADLE_OPTS% \"-Dorg.gradle.appname=%APP_BASE_NAME%\" -classpath \"%CLASSPATH%\" org.gradle.wrapper.GradleWrapperMain %*\r\n\r\n:end\r\n@rem End local scope for the variables with windows NT shell\r\nif %ERRORLEVEL% equ 0 goto mainEnd\r\n\r\n:fail\r\nrem Set variable GRADLE_EXIT_CONSOLE if you need the _script_ return code instead of\r\nrem the _cmd.exe /c_ return code!\r\nset EXIT_CODE=%ERRORLEVEL%\r\nif %EXIT_CODE% equ 0 set EXIT_CODE=1\r\nif not \"\"==\"%GRADLE_EXIT_CONSOLE%\" exit %EXIT_CODE%\r\nexit /b %EXIT_CODE%\r\n\r\n:mainEnd\r\nif \"%OS%\"==\"Windows_NT\" endlocal\r\n\r\n:omega\r\n"
  },
  {
    "path": "example/ReactNativeLocizeProject/android/settings.gradle",
    "content": "pluginManagement { includeBuild(\"../node_modules/@react-native/gradle-plugin\") }\nplugins { id(\"com.facebook.react.settings\") }\nextensions.configure(com.facebook.react.ReactSettingsExtension){ ex -> ex.autolinkLibrariesFromCommand() }\nrootProject.name = 'ReactNativeLocizeProject'\ninclude ':app'\nincludeBuild('../node_modules/@react-native/gradle-plugin')\n"
  },
  {
    "path": "example/ReactNativeLocizeProject/app.json",
    "content": "{\n  \"name\": \"ReactNativeLocizeProject\",\n  \"displayName\": \"ReactNativeLocizeProject\"\n}\n"
  },
  {
    "path": "example/ReactNativeLocizeProject/babel.config.js",
    "content": "module.exports = {\n  presets: ['module:@react-native/babel-preset'],\n};\n"
  },
  {
    "path": "example/ReactNativeLocizeProject/i18n.js",
    "content": "import 'intl-pluralrules';\nimport i18n from 'i18next';\nimport {initReactI18next} from 'react-i18next';\nimport RNLanguageDetector from '@os-team/i18next-react-native-language-detector';\nimport ChainedBackend from 'i18next-chained-backend';\nimport LocizeBackend from 'i18next-locize-backend';\nimport LocalStorageBackend from 'i18next-localstorage-backend';\n\ni18n\n  .use(ChainedBackend)\n  .use(RNLanguageDetector)\n  .use(initReactI18next)\n  .init({\n    debug: true,\n    fallbackLng: 'en',\n    supportedLngs: ['en', 'de'],\n    backend: {\n      backends: [LocalStorageBackend, LocizeBackend],\n      backendOptions: [\n        {\n          expirationTime: 7 * 24 * 60 * 60 * 1000, // 7 days\n        },\n        {\n          projectId: 'ce0cf818-32e5-44a5-b7f0-4ea9e840d962',\n        },\n      ],\n    },\n  });\n\nexport default i18n;\n"
  },
  {
    "path": "example/ReactNativeLocizeProject/index.js",
    "content": "/**\n * @format\n */\n\nimport {AppRegistry} from 'react-native';\nimport App from './App';\nimport {name as appName} from './app.json';\n\n// import i18n (needs to be bundled ;))\nimport './i18n';\n\nAppRegistry.registerComponent(appName, () => App);\n"
  },
  {
    "path": "example/ReactNativeLocizeProject/ios/.xcode.env",
    "content": "# This `.xcode.env` file is versioned and is used to source the environment\n# used when running script phases inside Xcode.\n# To customize your local environment, you can create an `.xcode.env.local`\n# file that is not versioned.\n\n# NODE_BINARY variable contains the PATH to the node executable.\n#\n# Customize the NODE_BINARY variable here.\n# For example, to use nvm with brew, add the following line\n# . \"$(brew --prefix nvm)/nvm.sh\" --no-use\nexport NODE_BINARY=$(command -v node)\n"
  },
  {
    "path": "example/ReactNativeLocizeProject/ios/Podfile",
    "content": "# Resolve react_native_pods.rb with node to allow for hoisting\nrequire Pod::Executable.execute_command('node', ['-p',\n  'require.resolve(\n    \"react-native/scripts/react_native_pods.rb\",\n    {paths: [process.argv[1]]},\n  )', __dir__]).strip\n\nplatform :ios, min_ios_version_supported\nprepare_react_native_project!\n\nlinkage = ENV['USE_FRAMEWORKS']\nif linkage != nil\n  Pod::UI.puts \"Configuring Pod with #{linkage}ally linked Frameworks\".green\n  use_frameworks! :linkage => linkage.to_sym\nend\n\ntarget 'ReactNativeLocizeProject' do\n  config = use_native_modules!\n\n  use_react_native!(\n    :path => config[:reactNativePath],\n    # An absolute path to your application root.\n    :app_path => \"#{Pod::Config.instance.installation_root}/..\"\n  )\n\n  post_install do |installer|\n    # https://github.com/facebook/react-native/blob/main/packages/react-native/scripts/react_native_pods.rb#L197-L202\n    react_native_post_install(\n      installer,\n      config[:reactNativePath],\n      :mac_catalyst_enabled => false,\n      # :ccache_enabled => true\n    )\n  end\nend\n"
  },
  {
    "path": "example/ReactNativeLocizeProject/ios/ReactNativeLocizeProject/AppDelegate.swift",
    "content": "import UIKit\nimport React\nimport React_RCTAppDelegate\nimport ReactAppDependencyProvider\n\n@main\nclass AppDelegate: UIResponder, UIApplicationDelegate {\n  var window: UIWindow?\n\n  var reactNativeDelegate: ReactNativeDelegate?\n  var reactNativeFactory: RCTReactNativeFactory?\n\n  func application(\n    _ application: UIApplication,\n    didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]? = nil\n  ) -> Bool {\n    let delegate = ReactNativeDelegate()\n    let factory = RCTReactNativeFactory(delegate: delegate)\n    delegate.dependencyProvider = RCTAppDependencyProvider()\n\n    reactNativeDelegate = delegate\n    reactNativeFactory = factory\n\n    window = UIWindow(frame: UIScreen.main.bounds)\n\n    factory.startReactNative(\n      withModuleName: \"ReactNativeLocizeProject\",\n      in: window,\n      launchOptions: launchOptions\n    )\n\n    return true\n  }\n}\n\nclass ReactNativeDelegate: RCTDefaultReactNativeFactoryDelegate {\n  override func sourceURL(for bridge: RCTBridge) -> URL? {\n    self.bundleURL()\n  }\n\n  override func bundleURL() -> URL? {\n#if DEBUG\n    RCTBundleURLProvider.sharedSettings().jsBundleURL(forBundleRoot: \"index\")\n#else\n    Bundle.main.url(forResource: \"main\", withExtension: \"jsbundle\")\n#endif\n  }\n}\n"
  },
  {
    "path": "example/ReactNativeLocizeProject/ios/ReactNativeLocizeProject/Images.xcassets/AppIcon.appiconset/Contents.json",
    "content": "{\n  \"images\": [\n    {\n      \"idiom\": \"iphone\",\n      \"scale\": \"2x\",\n      \"size\": \"20x20\"\n    },\n    {\n      \"idiom\": \"iphone\",\n      \"scale\": \"3x\",\n      \"size\": \"20x20\"\n    },\n    {\n      \"idiom\": \"iphone\",\n      \"scale\": \"2x\",\n      \"size\": \"29x29\"\n    },\n    {\n      \"idiom\": \"iphone\",\n      \"scale\": \"3x\",\n      \"size\": \"29x29\"\n    },\n    {\n      \"idiom\": \"iphone\",\n      \"scale\": \"2x\",\n      \"size\": \"40x40\"\n    },\n    {\n      \"idiom\": \"iphone\",\n      \"scale\": \"3x\",\n      \"size\": \"40x40\"\n    },\n    {\n      \"idiom\": \"iphone\",\n      \"scale\": \"2x\",\n      \"size\": \"60x60\"\n    },\n    {\n      \"idiom\": \"iphone\",\n      \"scale\": \"3x\",\n      \"size\": \"60x60\"\n    },\n    {\n      \"idiom\": \"ios-marketing\",\n      \"scale\": \"1x\",\n      \"size\": \"1024x1024\"\n    }\n  ],\n  \"info\": {\n    \"author\": \"xcode\",\n    \"version\": 1\n  }\n}\n"
  },
  {
    "path": "example/ReactNativeLocizeProject/ios/ReactNativeLocizeProject/Images.xcassets/Contents.json",
    "content": "{\n  \"info\": {\n    \"version\": 1,\n    \"author\": \"xcode\"\n  }\n}\n"
  },
  {
    "path": "example/ReactNativeLocizeProject/ios/ReactNativeLocizeProject/Info.plist",
    "content": "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<!DOCTYPE plist PUBLIC \"-//Apple//DTD PLIST 1.0//EN\" \"http://www.apple.com/DTDs/PropertyList-1.0.dtd\">\n<plist version=\"1.0\">\n<dict>\n\t<key>CFBundleDevelopmentRegion</key>\n\t<string>en</string>\n\t<key>CFBundleDisplayName</key>\n\t<string>ReactNativeLocizeProject</string>\n\t<key>CFBundleExecutable</key>\n\t<string>$(EXECUTABLE_NAME)</string>\n\t<key>CFBundleIdentifier</key>\n\t<string>$(PRODUCT_BUNDLE_IDENTIFIER)</string>\n\t<key>CFBundleInfoDictionaryVersion</key>\n\t<string>6.0</string>\n\t<key>CFBundleName</key>\n\t<string>$(PRODUCT_NAME)</string>\n\t<key>CFBundlePackageType</key>\n\t<string>APPL</string>\n\t<key>CFBundleShortVersionString</key>\n\t<string>$(MARKETING_VERSION)</string>\n\t<key>CFBundleSignature</key>\n\t<string>????</string>\n\t<key>CFBundleVersion</key>\n\t<string>$(CURRENT_PROJECT_VERSION)</string>\n\t<key>LSRequiresIPhoneOS</key>\n\t<true/>\n\t<key>NSAppTransportSecurity</key>\n\t<dict>\n\t  <!-- Do not change NSAllowsArbitraryLoads to true, or you will risk app rejection! -->\n\t\t<key>NSAllowsArbitraryLoads</key>\n\t\t<false/>\n\t\t<key>NSAllowsLocalNetworking</key>\n\t\t<true/>\n\t</dict>\n\t<key>NSLocationWhenInUseUsageDescription</key>\n\t<string></string>\n\t<key>UILaunchStoryboardName</key>\n\t<string>LaunchScreen</string>\n\t<key>UIRequiredDeviceCapabilities</key>\n\t<array>\n\t\t<string>arm64</string>\n\t</array>\n\t<key>UISupportedInterfaceOrientations</key>\n\t<array>\n\t\t<string>UIInterfaceOrientationPortrait</string>\n\t\t<string>UIInterfaceOrientationLandscapeLeft</string>\n\t\t<string>UIInterfaceOrientationLandscapeRight</string>\n\t</array>\n\t<key>UIViewControllerBasedStatusBarAppearance</key>\n\t<false/>\n</dict>\n</plist>\n"
  },
  {
    "path": "example/ReactNativeLocizeProject/ios/ReactNativeLocizeProject/LaunchScreen.storyboard",
    "content": "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<document type=\"com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB\" version=\"3.0\" toolsVersion=\"15702\" targetRuntime=\"iOS.CocoaTouch\" propertyAccessControl=\"none\" useAutolayout=\"YES\" launchScreen=\"YES\" useTraitCollections=\"YES\" useSafeAreas=\"YES\" colorMatched=\"YES\" initialViewController=\"01J-lp-oVM\">\n    <device id=\"retina4_7\" orientation=\"portrait\" appearance=\"light\"/>\n    <dependencies>\n        <deployment identifier=\"iOS\"/>\n        <plugIn identifier=\"com.apple.InterfaceBuilder.IBCocoaTouchPlugin\" version=\"15704\"/>\n        <capability name=\"Safe area layout guides\" minToolsVersion=\"9.0\"/>\n        <capability name=\"documents saved in the Xcode 8 format\" minToolsVersion=\"8.0\"/>\n    </dependencies>\n    <scenes>\n        <!--View Controller-->\n        <scene sceneID=\"EHf-IW-A2E\">\n            <objects>\n                <viewController id=\"01J-lp-oVM\" sceneMemberID=\"viewController\">\n                    <view key=\"view\" contentMode=\"scaleToFill\" id=\"Ze5-6b-2t3\">\n                        <rect key=\"frame\" x=\"0.0\" y=\"0.0\" width=\"375\" height=\"667\"/>\n                        <autoresizingMask key=\"autoresizingMask\" widthSizable=\"YES\" heightSizable=\"YES\"/>\n                        <subviews>\n                            <label opaque=\"NO\" clipsSubviews=\"YES\" userInteractionEnabled=\"NO\" contentMode=\"left\" horizontalHuggingPriority=\"251\" verticalHuggingPriority=\"251\" text=\"ReactNativeLocizeProject\" textAlignment=\"center\" lineBreakMode=\"middleTruncation\" baselineAdjustment=\"alignBaselines\" minimumFontSize=\"18\" translatesAutoresizingMaskIntoConstraints=\"NO\" id=\"GJd-Yh-RWb\">\n                                <rect key=\"frame\" x=\"0.0\" y=\"202\" width=\"375\" height=\"43\"/>\n                                <fontDescription key=\"fontDescription\" type=\"boldSystem\" pointSize=\"36\"/>\n                                <nil key=\"highlightedColor\"/>\n                            </label>\n                            <label opaque=\"NO\" clipsSubviews=\"YES\" userInteractionEnabled=\"NO\" contentMode=\"left\" horizontalHuggingPriority=\"251\" verticalHuggingPriority=\"251\" text=\"Powered by React Native\" textAlignment=\"center\" lineBreakMode=\"tailTruncation\" baselineAdjustment=\"alignBaselines\" minimumFontSize=\"9\" translatesAutoresizingMaskIntoConstraints=\"NO\" id=\"MN2-I3-ftu\">\n                                <rect key=\"frame\" x=\"0.0\" y=\"626\" width=\"375\" height=\"21\"/>\n                                <fontDescription key=\"fontDescription\" type=\"system\" pointSize=\"17\"/>\n                                <nil key=\"highlightedColor\"/>\n                            </label>\n                        </subviews>\n                        <color key=\"backgroundColor\" systemColor=\"systemBackgroundColor\" cocoaTouchSystemColor=\"whiteColor\"/>\n                        <constraints>\n                            <constraint firstItem=\"Bcu-3y-fUS\" firstAttribute=\"bottom\" secondItem=\"MN2-I3-ftu\" secondAttribute=\"bottom\" constant=\"20\" id=\"OZV-Vh-mqD\"/>\n                            <constraint firstItem=\"Bcu-3y-fUS\" firstAttribute=\"centerX\" secondItem=\"GJd-Yh-RWb\" secondAttribute=\"centerX\" id=\"Q3B-4B-g5h\"/>\n                            <constraint firstItem=\"MN2-I3-ftu\" firstAttribute=\"centerX\" secondItem=\"Bcu-3y-fUS\" secondAttribute=\"centerX\" id=\"akx-eg-2ui\"/>\n                            <constraint firstItem=\"MN2-I3-ftu\" firstAttribute=\"leading\" secondItem=\"Bcu-3y-fUS\" secondAttribute=\"leading\" id=\"i1E-0Y-4RG\"/>\n                            <constraint firstItem=\"GJd-Yh-RWb\" firstAttribute=\"centerY\" secondItem=\"Ze5-6b-2t3\" secondAttribute=\"bottom\" multiplier=\"1/3\" constant=\"1\" id=\"moa-c2-u7t\"/>\n                            <constraint firstItem=\"GJd-Yh-RWb\" firstAttribute=\"leading\" secondItem=\"Bcu-3y-fUS\" secondAttribute=\"leading\" symbolic=\"YES\" id=\"x7j-FC-K8j\"/>\n                        </constraints>\n                        <viewLayoutGuide key=\"safeArea\" id=\"Bcu-3y-fUS\"/>\n                    </view>\n                </viewController>\n                <placeholder placeholderIdentifier=\"IBFirstResponder\" id=\"iYj-Kq-Ea1\" userLabel=\"First Responder\" sceneMemberID=\"firstResponder\"/>\n            </objects>\n            <point key=\"canvasLocation\" x=\"52.173913043478265\" y=\"375\"/>\n        </scene>\n    </scenes>\n</document>\n"
  },
  {
    "path": "example/ReactNativeLocizeProject/ios/ReactNativeLocizeProject/PrivacyInfo.xcprivacy",
    "content": "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<!DOCTYPE plist PUBLIC \"-//Apple//DTD PLIST 1.0//EN\" \"http://www.apple.com/DTDs/PropertyList-1.0.dtd\">\n<plist version=\"1.0\">\n<dict>\n\t<key>NSPrivacyAccessedAPITypes</key>\n\t<array>\n\t\t<dict>\n\t\t\t<key>NSPrivacyAccessedAPIType</key>\n\t\t\t<string>NSPrivacyAccessedAPICategoryFileTimestamp</string>\n\t\t\t<key>NSPrivacyAccessedAPITypeReasons</key>\n\t\t\t<array>\n\t\t\t\t<string>C617.1</string>\n\t\t\t</array>\n\t\t</dict>\n\t\t<dict>\n\t\t\t<key>NSPrivacyAccessedAPIType</key>\n\t\t\t<string>NSPrivacyAccessedAPICategoryUserDefaults</string>\n\t\t\t<key>NSPrivacyAccessedAPITypeReasons</key>\n\t\t\t<array>\n\t\t\t\t<string>CA92.1</string>\n\t\t\t</array>\n\t\t</dict>\n\t\t<dict>\n\t\t\t<key>NSPrivacyAccessedAPIType</key>\n\t\t\t<string>NSPrivacyAccessedAPICategorySystemBootTime</string>\n\t\t\t<key>NSPrivacyAccessedAPITypeReasons</key>\n\t\t\t<array>\n\t\t\t\t<string>35F9.1</string>\n\t\t\t</array>\n\t\t</dict>\n\t</array>\n\t<key>NSPrivacyCollectedDataTypes</key>\n\t<array/>\n\t<key>NSPrivacyTracking</key>\n\t<false/>\n</dict>\n</plist>\n"
  },
  {
    "path": "example/ReactNativeLocizeProject/ios/ReactNativeLocizeProject.xcodeproj/project.pbxproj",
    "content": "// !$*UTF8*$!\n{\n\tarchiveVersion = 1;\n\tclasses = {\n\t};\n\tobjectVersion = 54;\n\tobjects = {\n\n/* Begin PBXBuildFile section */\n\t\t0AB566CA96D05C5E95B08959 /* PrivacyInfo.xcprivacy in Resources */ = {isa = PBXBuildFile; fileRef = 13B07FB81A68108700A75B9A /* PrivacyInfo.xcprivacy */; };\n\t\t0C80B921A6F3F58F76C31292 /* libPods-ReactNativeLocizeProject.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 5DCACB8F33CDC322A6C60F78 /* libPods-ReactNativeLocizeProject.a */; };\n\t\t13B07FBF1A68108700A75B9A /* Images.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 13B07FB51A68108700A75B9A /* Images.xcassets */; };\n\t\t761780ED2CA45674006654EE /* AppDelegate.swift in Sources */ = {isa = PBXBuildFile; fileRef = 761780EC2CA45674006654EE /* AppDelegate.swift */; };\n\t\t81AB9BB82411601600AC10FF /* LaunchScreen.storyboard in Resources */ = {isa = PBXBuildFile; fileRef = 81AB9BB72411601600AC10FF /* LaunchScreen.storyboard */; };\n/* End PBXBuildFile section */\n\n/* Begin PBXFileReference section */\n\t\t13B07F961A680F5B00A75B9A /* ReactNativeLocizeProject.app */ = {isa = PBXFileReference; explicitFileType = wrapper.application; includeInIndex = 0; path = ReactNativeLocizeProject.app; sourceTree = BUILT_PRODUCTS_DIR; };\n\t\t13B07FB51A68108700A75B9A /* Images.xcassets */ = {isa = PBXFileReference; lastKnownFileType = folder.assetcatalog; name = Images.xcassets; path = ReactNativeLocizeProject/Images.xcassets; sourceTree = \"<group>\"; };\n\t\t13B07FB61A68108700A75B9A /* Info.plist */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.plist.xml; name = Info.plist; path = ReactNativeLocizeProject/Info.plist; sourceTree = \"<group>\"; };\n\t\t13B07FB81A68108700A75B9A /* PrivacyInfo.xcprivacy */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.plist.xml; name = PrivacyInfo.xcprivacy; path = ReactNativeLocizeProject/PrivacyInfo.xcprivacy; sourceTree = \"<group>\"; };\n\t\t3B4392A12AC88292D35C810B /* Pods-ReactNativeLocizeProject.debug.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = \"Pods-ReactNativeLocizeProject.debug.xcconfig\"; path = \"Target Support Files/Pods-ReactNativeLocizeProject/Pods-ReactNativeLocizeProject.debug.xcconfig\"; sourceTree = \"<group>\"; };\n\t\t5709B34CF0A7D63546082F79 /* Pods-ReactNativeLocizeProject.release.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = \"Pods-ReactNativeLocizeProject.release.xcconfig\"; path = \"Target Support Files/Pods-ReactNativeLocizeProject/Pods-ReactNativeLocizeProject.release.xcconfig\"; sourceTree = \"<group>\"; };\n\t\t5DCACB8F33CDC322A6C60F78 /* libPods-ReactNativeLocizeProject.a */ = {isa = PBXFileReference; explicitFileType = archive.ar; includeInIndex = 0; path = \"libPods-ReactNativeLocizeProject.a\"; sourceTree = BUILT_PRODUCTS_DIR; };\n\t\t761780EC2CA45674006654EE /* AppDelegate.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; name = AppDelegate.swift; path = ReactNativeLocizeProject/AppDelegate.swift; sourceTree = \"<group>\"; };\n\t\t81AB9BB72411601600AC10FF /* LaunchScreen.storyboard */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = file.storyboard; name = LaunchScreen.storyboard; path = ReactNativeLocizeProject/LaunchScreen.storyboard; sourceTree = \"<group>\"; };\n\t\tED297162215061F000B7C4FE /* JavaScriptCore.framework */ = {isa = PBXFileReference; lastKnownFileType = wrapper.framework; name = JavaScriptCore.framework; path = System/Library/Frameworks/JavaScriptCore.framework; sourceTree = SDKROOT; };\n/* End PBXFileReference section */\n\n/* Begin PBXFrameworksBuildPhase section */\n\t\t13B07F8C1A680F5B00A75B9A /* Frameworks */ = {\n\t\t\tisa = PBXFrameworksBuildPhase;\n\t\t\tbuildActionMask = 2147483647;\n\t\t\tfiles = (\n\t\t\t\t0C80B921A6F3F58F76C31292 /* libPods-ReactNativeLocizeProject.a in Frameworks */,\n\t\t\t);\n\t\t\trunOnlyForDeploymentPostprocessing = 0;\n\t\t};\n/* End PBXFrameworksBuildPhase section */\n\n/* Begin PBXGroup section */\n\t\t13B07FAE1A68108700A75B9A /* ReactNativeLocizeProject */ = {\n\t\t\tisa = PBXGroup;\n\t\t\tchildren = (\n\t\t\t\t13B07FB51A68108700A75B9A /* Images.xcassets */,\n\t\t\t\t761780EC2CA45674006654EE /* AppDelegate.swift */,\n\t\t\t\t13B07FB61A68108700A75B9A /* Info.plist */,\n\t\t\t\t81AB9BB72411601600AC10FF /* LaunchScreen.storyboard */,\n\t\t\t\t13B07FB81A68108700A75B9A /* PrivacyInfo.xcprivacy */,\n\t\t\t);\n\t\t\tname = ReactNativeLocizeProject;\n\t\t\tsourceTree = \"<group>\";\n\t\t};\n\t\t2D16E6871FA4F8E400B85C8A /* Frameworks */ = {\n\t\t\tisa = PBXGroup;\n\t\t\tchildren = (\n\t\t\t\tED297162215061F000B7C4FE /* JavaScriptCore.framework */,\n\t\t\t\t5DCACB8F33CDC322A6C60F78 /* libPods-ReactNativeLocizeProject.a */,\n\t\t\t);\n\t\t\tname = Frameworks;\n\t\t\tsourceTree = \"<group>\";\n\t\t};\n\t\t832341AE1AAA6A7D00B99B32 /* Libraries */ = {\n\t\t\tisa = PBXGroup;\n\t\t\tchildren = (\n\t\t\t);\n\t\t\tname = Libraries;\n\t\t\tsourceTree = \"<group>\";\n\t\t};\n\t\t83CBB9F61A601CBA00E9B192 = {\n\t\t\tisa = PBXGroup;\n\t\t\tchildren = (\n\t\t\t\t13B07FAE1A68108700A75B9A /* ReactNativeLocizeProject */,\n\t\t\t\t832341AE1AAA6A7D00B99B32 /* Libraries */,\n\t\t\t\t83CBBA001A601CBA00E9B192 /* Products */,\n\t\t\t\t2D16E6871FA4F8E400B85C8A /* Frameworks */,\n\t\t\t\tBBD78D7AC51CEA395F1C20DB /* Pods */,\n\t\t\t);\n\t\t\tindentWidth = 2;\n\t\t\tsourceTree = \"<group>\";\n\t\t\ttabWidth = 2;\n\t\t\tusesTabs = 0;\n\t\t};\n\t\t83CBBA001A601CBA00E9B192 /* Products */ = {\n\t\t\tisa = PBXGroup;\n\t\t\tchildren = (\n\t\t\t\t13B07F961A680F5B00A75B9A /* ReactNativeLocizeProject.app */,\n\t\t\t);\n\t\t\tname = Products;\n\t\t\tsourceTree = \"<group>\";\n\t\t};\n\t\tBBD78D7AC51CEA395F1C20DB /* Pods */ = {\n\t\t\tisa = PBXGroup;\n\t\t\tchildren = (\n\t\t\t\t3B4392A12AC88292D35C810B /* Pods-ReactNativeLocizeProject.debug.xcconfig */,\n\t\t\t\t5709B34CF0A7D63546082F79 /* Pods-ReactNativeLocizeProject.release.xcconfig */,\n\t\t\t);\n\t\t\tpath = Pods;\n\t\t\tsourceTree = \"<group>\";\n\t\t};\n/* End PBXGroup section */\n\n/* Begin PBXNativeTarget section */\n\t\t13B07F861A680F5B00A75B9A /* ReactNativeLocizeProject */ = {\n\t\t\tisa = PBXNativeTarget;\n\t\t\tbuildConfigurationList = 13B07F931A680F5B00A75B9A /* Build configuration list for PBXNativeTarget \"ReactNativeLocizeProject\" */;\n\t\t\tbuildPhases = (\n\t\t\t\tC38B50BA6285516D6DCD4F65 /* [CP] Check Pods Manifest.lock */,\n\t\t\t\t13B07F871A680F5B00A75B9A /* Sources */,\n\t\t\t\t13B07F8C1A680F5B00A75B9A /* Frameworks */,\n\t\t\t\t13B07F8E1A680F5B00A75B9A /* Resources */,\n\t\t\t\t00DD1BFF1BD5951E006B06BC /* Bundle React Native code and images */,\n\t\t\t\t00EEFC60759A1932668264C0 /* [CP] Embed Pods Frameworks */,\n\t\t\t\tE235C05ADACE081382539298 /* [CP] Copy Pods Resources */,\n\t\t\t);\n\t\t\tbuildRules = (\n\t\t\t);\n\t\t\tdependencies = (\n\t\t\t);\n\t\t\tname = ReactNativeLocizeProject;\n\t\t\tproductName = ReactNativeLocizeProject;\n\t\t\tproductReference = 13B07F961A680F5B00A75B9A /* ReactNativeLocizeProject.app */;\n\t\t\tproductType = \"com.apple.product-type.application\";\n\t\t};\n/* End PBXNativeTarget section */\n\n/* Begin PBXProject section */\n\t\t83CBB9F71A601CBA00E9B192 /* Project object */ = {\n\t\t\tisa = PBXProject;\n\t\t\tattributes = {\n\t\t\t\tLastUpgradeCheck = 1210;\n\t\t\t\tTargetAttributes = {\n\t\t\t\t\t13B07F861A680F5B00A75B9A = {\n\t\t\t\t\t\tLastSwiftMigration = 1120;\n\t\t\t\t\t};\n\t\t\t\t};\n\t\t\t};\n\t\t\tbuildConfigurationList = 83CBB9FA1A601CBA00E9B192 /* Build configuration list for PBXProject \"ReactNativeLocizeProject\" */;\n\t\t\tcompatibilityVersion = \"Xcode 12.0\";\n\t\t\tdevelopmentRegion = en;\n\t\t\thasScannedForEncodings = 0;\n\t\t\tknownRegions = (\n\t\t\t\ten,\n\t\t\t\tBase,\n\t\t\t);\n\t\t\tmainGroup = 83CBB9F61A601CBA00E9B192;\n\t\t\tproductRefGroup = 83CBBA001A601CBA00E9B192 /* Products */;\n\t\t\tprojectDirPath = \"\";\n\t\t\tprojectRoot = \"\";\n\t\t\ttargets = (\n\t\t\t\t13B07F861A680F5B00A75B9A /* ReactNativeLocizeProject */,\n\t\t\t);\n\t\t};\n/* End PBXProject section */\n\n/* Begin PBXResourcesBuildPhase section */\n\t\t13B07F8E1A680F5B00A75B9A /* Resources */ = {\n\t\t\tisa = PBXResourcesBuildPhase;\n\t\t\tbuildActionMask = 2147483647;\n\t\t\tfiles = (\n\t\t\t\t81AB9BB82411601600AC10FF /* LaunchScreen.storyboard in Resources */,\n\t\t\t\t13B07FBF1A68108700A75B9A /* Images.xcassets in Resources */,\n\t\t\t\t0AB566CA96D05C5E95B08959 /* PrivacyInfo.xcprivacy in Resources */,\n\t\t\t);\n\t\t\trunOnlyForDeploymentPostprocessing = 0;\n\t\t};\n/* End PBXResourcesBuildPhase section */\n\n/* Begin PBXShellScriptBuildPhase section */\n\t\t00DD1BFF1BD5951E006B06BC /* Bundle React Native code and images */ = {\n\t\t\tisa = PBXShellScriptBuildPhase;\n\t\t\tbuildActionMask = 2147483647;\n\t\t\tfiles = (\n\t\t\t);\n\t\t\tinputPaths = (\n\t\t\t\t\"$(SRCROOT)/.xcode.env.local\",\n\t\t\t\t\"$(SRCROOT)/.xcode.env\",\n\t\t\t);\n\t\t\tname = \"Bundle React Native code and images\";\n\t\t\toutputPaths = (\n\t\t\t);\n\t\t\trunOnlyForDeploymentPostprocessing = 0;\n\t\t\tshellPath = /bin/sh;\n\t\t\tshellScript = \"set -e\\n\\nWITH_ENVIRONMENT=\\\"$REACT_NATIVE_PATH/scripts/xcode/with-environment.sh\\\"\\nREACT_NATIVE_XCODE=\\\"$REACT_NATIVE_PATH/scripts/react-native-xcode.sh\\\"\\n\\n/bin/sh -c \\\"$WITH_ENVIRONMENT $REACT_NATIVE_XCODE\\\"\\n\";\n\t\t};\n\t\t00EEFC60759A1932668264C0 /* [CP] Embed Pods Frameworks */ = {\n\t\t\tisa = PBXShellScriptBuildPhase;\n\t\t\tbuildActionMask = 2147483647;\n\t\t\tfiles = (\n\t\t\t);\n\t\t\tinputFileListPaths = (\n\t\t\t\t\"${PODS_ROOT}/Target Support Files/Pods-ReactNativeLocizeProject/Pods-ReactNativeLocizeProject-frameworks-${CONFIGURATION}-input-files.xcfilelist\",\n\t\t\t);\n\t\t\tname = \"[CP] Embed Pods Frameworks\";\n\t\t\toutputFileListPaths = (\n\t\t\t\t\"${PODS_ROOT}/Target Support Files/Pods-ReactNativeLocizeProject/Pods-ReactNativeLocizeProject-frameworks-${CONFIGURATION}-output-files.xcfilelist\",\n\t\t\t);\n\t\t\trunOnlyForDeploymentPostprocessing = 0;\n\t\t\tshellPath = /bin/sh;\n\t\t\tshellScript = \"\\\"${PODS_ROOT}/Target Support Files/Pods-ReactNativeLocizeProject/Pods-ReactNativeLocizeProject-frameworks.sh\\\"\\n\";\n\t\t\tshowEnvVarsInLog = 0;\n\t\t};\n\t\tC38B50BA6285516D6DCD4F65 /* [CP] Check Pods Manifest.lock */ = {\n\t\t\tisa = PBXShellScriptBuildPhase;\n\t\t\tbuildActionMask = 2147483647;\n\t\t\tfiles = (\n\t\t\t);\n\t\t\tinputFileListPaths = (\n\t\t\t);\n\t\t\tinputPaths = (\n\t\t\t\t\"${PODS_PODFILE_DIR_PATH}/Podfile.lock\",\n\t\t\t\t\"${PODS_ROOT}/Manifest.lock\",\n\t\t\t);\n\t\t\tname = \"[CP] Check Pods Manifest.lock\";\n\t\t\toutputFileListPaths = (\n\t\t\t);\n\t\t\toutputPaths = (\n\t\t\t\t\"$(DERIVED_FILE_DIR)/Pods-ReactNativeLocizeProject-checkManifestLockResult.txt\",\n\t\t\t);\n\t\t\trunOnlyForDeploymentPostprocessing = 0;\n\t\t\tshellPath = /bin/sh;\n\t\t\tshellScript = \"diff \\\"${PODS_PODFILE_DIR_PATH}/Podfile.lock\\\" \\\"${PODS_ROOT}/Manifest.lock\\\" > /dev/null\\nif [ $? != 0 ] ; then\\n    # print error to STDERR\\n    echo \\\"error: The sandbox is not in sync with the Podfile.lock. Run 'pod install' or update your CocoaPods installation.\\\" >&2\\n    exit 1\\nfi\\n# This output is used by Xcode 'outputs' to avoid re-running this script phase.\\necho \\\"SUCCESS\\\" > \\\"${SCRIPT_OUTPUT_FILE_0}\\\"\\n\";\n\t\t\tshowEnvVarsInLog = 0;\n\t\t};\n\t\tE235C05ADACE081382539298 /* [CP] Copy Pods Resources */ = {\n\t\t\tisa = PBXShellScriptBuildPhase;\n\t\t\tbuildActionMask = 2147483647;\n\t\t\tfiles = (\n\t\t\t);\n\t\t\tinputFileListPaths = (\n\t\t\t\t\"${PODS_ROOT}/Target Support Files/Pods-ReactNativeLocizeProject/Pods-ReactNativeLocizeProject-resources-${CONFIGURATION}-input-files.xcfilelist\",\n\t\t\t);\n\t\t\tname = \"[CP] Copy Pods Resources\";\n\t\t\toutputFileListPaths = (\n\t\t\t\t\"${PODS_ROOT}/Target Support Files/Pods-ReactNativeLocizeProject/Pods-ReactNativeLocizeProject-resources-${CONFIGURATION}-output-files.xcfilelist\",\n\t\t\t);\n\t\t\trunOnlyForDeploymentPostprocessing = 0;\n\t\t\tshellPath = /bin/sh;\n\t\t\tshellScript = \"\\\"${PODS_ROOT}/Target Support Files/Pods-ReactNativeLocizeProject/Pods-ReactNativeLocizeProject-resources.sh\\\"\\n\";\n\t\t\tshowEnvVarsInLog = 0;\n\t\t};\n/* End PBXShellScriptBuildPhase section */\n\n/* Begin PBXSourcesBuildPhase section */\n\t\t13B07F871A680F5B00A75B9A /* Sources */ = {\n\t\t\tisa = PBXSourcesBuildPhase;\n\t\t\tbuildActionMask = 2147483647;\n\t\t\tfiles = (\n\t\t\t\t761780ED2CA45674006654EE /* AppDelegate.swift in Sources */,\n\t\t\t);\n\t\t\trunOnlyForDeploymentPostprocessing = 0;\n\t\t};\n/* End PBXSourcesBuildPhase section */\n\n/* Begin XCBuildConfiguration section */\n\t\t13B07F941A680F5B00A75B9A /* Debug */ = {\n\t\t\tisa = XCBuildConfiguration;\n\t\t\tbaseConfigurationReference = 3B4392A12AC88292D35C810B /* Pods-ReactNativeLocizeProject.debug.xcconfig */;\n\t\t\tbuildSettings = {\n\t\t\t\tASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;\n\t\t\t\tCLANG_ENABLE_MODULES = YES;\n\t\t\t\tCURRENT_PROJECT_VERSION = 1;\n\t\t\t\tENABLE_BITCODE = NO;\n\t\t\t\tINFOPLIST_FILE = ReactNativeLocizeProject/Info.plist;\n\t\t\t\tIPHONEOS_DEPLOYMENT_TARGET = 15.1;\n\t\t\t\tLD_RUNPATH_SEARCH_PATHS = (\n\t\t\t\t\t\"$(inherited)\",\n\t\t\t\t\t\"@executable_path/Frameworks\",\n\t\t\t\t);\n\t\t\t\tMARKETING_VERSION = 1.0;\n\t\t\t\tOTHER_LDFLAGS = (\n\t\t\t\t\t\"$(inherited)\",\n\t\t\t\t\t\"-ObjC\",\n\t\t\t\t\t\"-lc++\",\n\t\t\t\t);\n\t\t\t\tPRODUCT_BUNDLE_IDENTIFIER = \"org.reactjs.native.example.$(PRODUCT_NAME:rfc1034identifier)\";\n\t\t\t\tPRODUCT_NAME = ReactNativeLocizeProject;\n\t\t\t\tSWIFT_OPTIMIZATION_LEVEL = \"-Onone\";\n\t\t\t\tSWIFT_VERSION = 5.0;\n\t\t\t\tVERSIONING_SYSTEM = \"apple-generic\";\n\t\t\t};\n\t\t\tname = Debug;\n\t\t};\n\t\t13B07F951A680F5B00A75B9A /* Release */ = {\n\t\t\tisa = XCBuildConfiguration;\n\t\t\tbaseConfigurationReference = 5709B34CF0A7D63546082F79 /* Pods-ReactNativeLocizeProject.release.xcconfig */;\n\t\t\tbuildSettings = {\n\t\t\t\tASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;\n\t\t\t\tCLANG_ENABLE_MODULES = YES;\n\t\t\t\tCURRENT_PROJECT_VERSION = 1;\n\t\t\t\tINFOPLIST_FILE = ReactNativeLocizeProject/Info.plist;\n\t\t\t\tIPHONEOS_DEPLOYMENT_TARGET = 15.1;\n\t\t\t\tLD_RUNPATH_SEARCH_PATHS = (\n\t\t\t\t\t\"$(inherited)\",\n\t\t\t\t\t\"@executable_path/Frameworks\",\n\t\t\t\t);\n\t\t\t\tMARKETING_VERSION = 1.0;\n\t\t\t\tOTHER_LDFLAGS = (\n\t\t\t\t\t\"$(inherited)\",\n\t\t\t\t\t\"-ObjC\",\n\t\t\t\t\t\"-lc++\",\n\t\t\t\t);\n\t\t\t\tPRODUCT_BUNDLE_IDENTIFIER = \"org.reactjs.native.example.$(PRODUCT_NAME:rfc1034identifier)\";\n\t\t\t\tPRODUCT_NAME = ReactNativeLocizeProject;\n\t\t\t\tSWIFT_VERSION = 5.0;\n\t\t\t\tVERSIONING_SYSTEM = \"apple-generic\";\n\t\t\t};\n\t\t\tname = Release;\n\t\t};\n\t\t83CBBA201A601CBA00E9B192 /* Debug */ = {\n\t\t\tisa = XCBuildConfiguration;\n\t\t\tbuildSettings = {\n\t\t\t\tALWAYS_SEARCH_USER_PATHS = NO;\n\t\t\t\tCLANG_ANALYZER_LOCALIZABILITY_NONLOCALIZED = YES;\n\t\t\t\tCLANG_CXX_LANGUAGE_STANDARD = \"c++20\";\n\t\t\t\tCLANG_CXX_LIBRARY = \"libc++\";\n\t\t\t\tCLANG_ENABLE_MODULES = YES;\n\t\t\t\tCLANG_ENABLE_OBJC_ARC = YES;\n\t\t\t\tCLANG_WARN_BLOCK_CAPTURE_AUTORELEASING = YES;\n\t\t\t\tCLANG_WARN_BOOL_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_COMMA = YES;\n\t\t\t\tCLANG_WARN_CONSTANT_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_DEPRECATED_OBJC_IMPLEMENTATIONS = YES;\n\t\t\t\tCLANG_WARN_DIRECT_OBJC_ISA_USAGE = YES_ERROR;\n\t\t\t\tCLANG_WARN_EMPTY_BODY = YES;\n\t\t\t\tCLANG_WARN_ENUM_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_INFINITE_RECURSION = YES;\n\t\t\t\tCLANG_WARN_INT_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_NON_LITERAL_NULL_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_OBJC_IMPLICIT_RETAIN_SELF = YES;\n\t\t\t\tCLANG_WARN_OBJC_LITERAL_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_OBJC_ROOT_CLASS = YES_ERROR;\n\t\t\t\tCLANG_WARN_QUOTED_INCLUDE_IN_FRAMEWORK_HEADER = YES;\n\t\t\t\tCLANG_WARN_RANGE_LOOP_ANALYSIS = YES;\n\t\t\t\tCLANG_WARN_STRICT_PROTOTYPES = YES;\n\t\t\t\tCLANG_WARN_SUSPICIOUS_MOVE = YES;\n\t\t\t\tCLANG_WARN_UNREACHABLE_CODE = YES;\n\t\t\t\tCLANG_WARN__DUPLICATE_METHOD_MATCH = YES;\n\t\t\t\t\"CODE_SIGN_IDENTITY[sdk=iphoneos*]\" = \"iPhone Developer\";\n\t\t\t\tCOPY_PHASE_STRIP = NO;\n\t\t\t\tENABLE_STRICT_OBJC_MSGSEND = YES;\n\t\t\t\tENABLE_TESTABILITY = YES;\n\t\t\t\t\"EXCLUDED_ARCHS[sdk=iphonesimulator*]\" = \"\";\n\t\t\t\tGCC_C_LANGUAGE_STANDARD = gnu99;\n\t\t\t\tGCC_DYNAMIC_NO_PIC = NO;\n\t\t\t\tGCC_NO_COMMON_BLOCKS = YES;\n\t\t\t\tGCC_OPTIMIZATION_LEVEL = 0;\n\t\t\t\tGCC_PREPROCESSOR_DEFINITIONS = (\n\t\t\t\t\t\"DEBUG=1\",\n\t\t\t\t\t\"$(inherited)\",\n\t\t\t\t);\n\t\t\t\tGCC_SYMBOLS_PRIVATE_EXTERN = NO;\n\t\t\t\tGCC_WARN_64_TO_32_BIT_CONVERSION = YES;\n\t\t\t\tGCC_WARN_ABOUT_RETURN_TYPE = YES_ERROR;\n\t\t\t\tGCC_WARN_UNDECLARED_SELECTOR = YES;\n\t\t\t\tGCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE;\n\t\t\t\tGCC_WARN_UNUSED_FUNCTION = YES;\n\t\t\t\tGCC_WARN_UNUSED_VARIABLE = YES;\n\t\t\t\tIPHONEOS_DEPLOYMENT_TARGET = 15.1;\n\t\t\t\tLD_RUNPATH_SEARCH_PATHS = (\n\t\t\t\t\t/usr/lib/swift,\n\t\t\t\t\t\"$(inherited)\",\n\t\t\t\t);\n\t\t\t\tLIBRARY_SEARCH_PATHS = (\n\t\t\t\t\t\"\\\"$(SDKROOT)/usr/lib/swift\\\"\",\n\t\t\t\t\t\"\\\"$(TOOLCHAIN_DIR)/usr/lib/swift/$(PLATFORM_NAME)\\\"\",\n\t\t\t\t\t\"\\\"$(inherited)\\\"\",\n\t\t\t\t);\n\t\t\t\tMTL_ENABLE_DEBUG_INFO = YES;\n\t\t\t\tONLY_ACTIVE_ARCH = YES;\n\t\t\t\tOTHER_CPLUSPLUSFLAGS = (\n\t\t\t\t\t\"$(OTHER_CFLAGS)\",\n\t\t\t\t\t\"-DFOLLY_NO_CONFIG\",\n\t\t\t\t\t\"-DFOLLY_MOBILE=1\",\n\t\t\t\t\t\"-DFOLLY_USE_LIBCPP=1\",\n\t\t\t\t\t\"-DFOLLY_CFG_NO_COROUTINES=1\",\n\t\t\t\t\t\"-DFOLLY_HAVE_CLOCK_GETTIME=1\",\n\t\t\t\t);\n\t\t\t\tOTHER_LDFLAGS = (\n\t\t\t\t\t\"$(inherited)\",\n\t\t\t\t\t\" \",\n\t\t\t\t);\n\t\t\t\tREACT_NATIVE_PATH = \"${PODS_ROOT}/../../node_modules/react-native\";\n\t\t\t\tSDKROOT = iphoneos;\n\t\t\t\tSWIFT_ACTIVE_COMPILATION_CONDITIONS = \"$(inherited) DEBUG\";\n\t\t\t\tUSE_HERMES = true;\n\t\t\t};\n\t\t\tname = Debug;\n\t\t};\n\t\t83CBBA211A601CBA00E9B192 /* Release */ = {\n\t\t\tisa = XCBuildConfiguration;\n\t\t\tbuildSettings = {\n\t\t\t\tALWAYS_SEARCH_USER_PATHS = NO;\n\t\t\t\tCLANG_ANALYZER_LOCALIZABILITY_NONLOCALIZED = YES;\n\t\t\t\tCLANG_CXX_LANGUAGE_STANDARD = \"c++20\";\n\t\t\t\tCLANG_CXX_LIBRARY = \"libc++\";\n\t\t\t\tCLANG_ENABLE_MODULES = YES;\n\t\t\t\tCLANG_ENABLE_OBJC_ARC = YES;\n\t\t\t\tCLANG_WARN_BLOCK_CAPTURE_AUTORELEASING = YES;\n\t\t\t\tCLANG_WARN_BOOL_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_COMMA = YES;\n\t\t\t\tCLANG_WARN_CONSTANT_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_DEPRECATED_OBJC_IMPLEMENTATIONS = YES;\n\t\t\t\tCLANG_WARN_DIRECT_OBJC_ISA_USAGE = YES_ERROR;\n\t\t\t\tCLANG_WARN_EMPTY_BODY = YES;\n\t\t\t\tCLANG_WARN_ENUM_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_INFINITE_RECURSION = YES;\n\t\t\t\tCLANG_WARN_INT_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_NON_LITERAL_NULL_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_OBJC_IMPLICIT_RETAIN_SELF = YES;\n\t\t\t\tCLANG_WARN_OBJC_LITERAL_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_OBJC_ROOT_CLASS = YES_ERROR;\n\t\t\t\tCLANG_WARN_QUOTED_INCLUDE_IN_FRAMEWORK_HEADER = YES;\n\t\t\t\tCLANG_WARN_RANGE_LOOP_ANALYSIS = YES;\n\t\t\t\tCLANG_WARN_STRICT_PROTOTYPES = YES;\n\t\t\t\tCLANG_WARN_SUSPICIOUS_MOVE = YES;\n\t\t\t\tCLANG_WARN_UNREACHABLE_CODE = YES;\n\t\t\t\tCLANG_WARN__DUPLICATE_METHOD_MATCH = YES;\n\t\t\t\t\"CODE_SIGN_IDENTITY[sdk=iphoneos*]\" = \"iPhone Developer\";\n\t\t\t\tCOPY_PHASE_STRIP = YES;\n\t\t\t\tENABLE_NS_ASSERTIONS = NO;\n\t\t\t\tENABLE_STRICT_OBJC_MSGSEND = YES;\n\t\t\t\t\"EXCLUDED_ARCHS[sdk=iphonesimulator*]\" = \"\";\n\t\t\t\tGCC_C_LANGUAGE_STANDARD = gnu99;\n\t\t\t\tGCC_NO_COMMON_BLOCKS = YES;\n\t\t\t\tGCC_WARN_64_TO_32_BIT_CONVERSION = YES;\n\t\t\t\tGCC_WARN_ABOUT_RETURN_TYPE = YES_ERROR;\n\t\t\t\tGCC_WARN_UNDECLARED_SELECTOR = YES;\n\t\t\t\tGCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE;\n\t\t\t\tGCC_WARN_UNUSED_FUNCTION = YES;\n\t\t\t\tGCC_WARN_UNUSED_VARIABLE = YES;\n\t\t\t\tIPHONEOS_DEPLOYMENT_TARGET = 15.1;\n\t\t\t\tLD_RUNPATH_SEARCH_PATHS = (\n\t\t\t\t\t/usr/lib/swift,\n\t\t\t\t\t\"$(inherited)\",\n\t\t\t\t);\n\t\t\t\tLIBRARY_SEARCH_PATHS = (\n\t\t\t\t\t\"\\\"$(SDKROOT)/usr/lib/swift\\\"\",\n\t\t\t\t\t\"\\\"$(TOOLCHAIN_DIR)/usr/lib/swift/$(PLATFORM_NAME)\\\"\",\n\t\t\t\t\t\"\\\"$(inherited)\\\"\",\n\t\t\t\t);\n\t\t\t\tMTL_ENABLE_DEBUG_INFO = NO;\n\t\t\t\tOTHER_CPLUSPLUSFLAGS = (\n\t\t\t\t\t\"$(OTHER_CFLAGS)\",\n\t\t\t\t\t\"-DFOLLY_NO_CONFIG\",\n\t\t\t\t\t\"-DFOLLY_MOBILE=1\",\n\t\t\t\t\t\"-DFOLLY_USE_LIBCPP=1\",\n\t\t\t\t\t\"-DFOLLY_CFG_NO_COROUTINES=1\",\n\t\t\t\t\t\"-DFOLLY_HAVE_CLOCK_GETTIME=1\",\n\t\t\t\t);\n\t\t\t\tOTHER_LDFLAGS = (\n\t\t\t\t\t\"$(inherited)\",\n\t\t\t\t\t\" \",\n\t\t\t\t);\n\t\t\t\tREACT_NATIVE_PATH = \"${PODS_ROOT}/../../node_modules/react-native\";\n\t\t\t\tSDKROOT = iphoneos;\n\t\t\t\tUSE_HERMES = true;\n\t\t\t\tVALIDATE_PRODUCT = YES;\n\t\t\t};\n\t\t\tname = Release;\n\t\t};\n/* End XCBuildConfiguration section */\n\n/* Begin XCConfigurationList section */\n\t\t13B07F931A680F5B00A75B9A /* Build configuration list for PBXNativeTarget \"ReactNativeLocizeProject\" */ = {\n\t\t\tisa = XCConfigurationList;\n\t\t\tbuildConfigurations = (\n\t\t\t\t13B07F941A680F5B00A75B9A /* Debug */,\n\t\t\t\t13B07F951A680F5B00A75B9A /* Release */,\n\t\t\t);\n\t\t\tdefaultConfigurationIsVisible = 0;\n\t\t\tdefaultConfigurationName = Release;\n\t\t};\n\t\t83CBB9FA1A601CBA00E9B192 /* Build configuration list for PBXProject \"ReactNativeLocizeProject\" */ = {\n\t\t\tisa = XCConfigurationList;\n\t\t\tbuildConfigurations = (\n\t\t\t\t83CBBA201A601CBA00E9B192 /* Debug */,\n\t\t\t\t83CBBA211A601CBA00E9B192 /* Release */,\n\t\t\t);\n\t\t\tdefaultConfigurationIsVisible = 0;\n\t\t\tdefaultConfigurationName = Release;\n\t\t};\n/* End XCConfigurationList section */\n\t};\n\trootObject = 83CBB9F71A601CBA00E9B192 /* Project object */;\n}\n"
  },
  {
    "path": "example/ReactNativeLocizeProject/ios/ReactNativeLocizeProject.xcodeproj/xcshareddata/xcschemes/ReactNativeLocizeProject.xcscheme",
    "content": "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<Scheme\n   LastUpgradeVersion = \"1210\"\n   version = \"1.3\">\n   <BuildAction\n      parallelizeBuildables = \"YES\"\n      buildImplicitDependencies = \"YES\">\n      <BuildActionEntries>\n         <BuildActionEntry\n            buildForTesting = \"YES\"\n            buildForRunning = \"YES\"\n            buildForProfiling = \"YES\"\n            buildForArchiving = \"YES\"\n            buildForAnalyzing = \"YES\">\n            <BuildableReference\n               BuildableIdentifier = \"primary\"\n               BlueprintIdentifier = \"13B07F861A680F5B00A75B9A\"\n               BuildableName = \"ReactNativeLocizeProject.app\"\n               BlueprintName = \"ReactNativeLocizeProject\"\n               ReferencedContainer = \"container:ReactNativeLocizeProject.xcodeproj\">\n            </BuildableReference>\n         </BuildActionEntry>\n      </BuildActionEntries>\n   </BuildAction>\n   <TestAction\n      buildConfiguration = \"Debug\"\n      selectedDebuggerIdentifier = \"Xcode.DebuggerFoundation.Debugger.LLDB\"\n      selectedLauncherIdentifier = \"Xcode.DebuggerFoundation.Launcher.LLDB\"\n      shouldUseLaunchSchemeArgsEnv = \"YES\">\n      <Testables>\n         <TestableReference\n            skipped = \"NO\">\n            <BuildableReference\n               BuildableIdentifier = \"primary\"\n               BlueprintIdentifier = \"00E356ED1AD99517003FC87E\"\n               BuildableName = \"ReactNativeLocizeProjectTests.xctest\"\n               BlueprintName = \"ReactNativeLocizeProjectTests\"\n               ReferencedContainer = \"container:ReactNativeLocizeProject.xcodeproj\">\n            </BuildableReference>\n         </TestableReference>\n      </Testables>\n   </TestAction>\n   <LaunchAction\n      buildConfiguration = \"Debug\"\n      selectedDebuggerIdentifier = \"Xcode.DebuggerFoundation.Debugger.LLDB\"\n      selectedLauncherIdentifier = \"Xcode.DebuggerFoundation.Launcher.LLDB\"\n      launchStyle = \"0\"\n      useCustomWorkingDirectory = \"NO\"\n      ignoresPersistentStateOnLaunch = \"NO\"\n      debugDocumentVersioning = \"YES\"\n      debugServiceExtension = \"internal\"\n      allowLocationSimulation = \"YES\">\n      <BuildableProductRunnable\n         runnableDebuggingMode = \"0\">\n         <BuildableReference\n            BuildableIdentifier = \"primary\"\n            BlueprintIdentifier = \"13B07F861A680F5B00A75B9A\"\n            BuildableName = \"ReactNativeLocizeProject.app\"\n            BlueprintName = \"ReactNativeLocizeProject\"\n            ReferencedContainer = \"container:ReactNativeLocizeProject.xcodeproj\">\n         </BuildableReference>\n      </BuildableProductRunnable>\n   </LaunchAction>\n   <ProfileAction\n      buildConfiguration = \"Release\"\n      shouldUseLaunchSchemeArgsEnv = \"YES\"\n      savedToolIdentifier = \"\"\n      useCustomWorkingDirectory = \"NO\"\n      debugDocumentVersioning = \"YES\">\n      <BuildableProductRunnable\n         runnableDebuggingMode = \"0\">\n         <BuildableReference\n            BuildableIdentifier = \"primary\"\n            BlueprintIdentifier = \"13B07F861A680F5B00A75B9A\"\n            BuildableName = \"ReactNativeLocizeProject.app\"\n            BlueprintName = \"ReactNativeLocizeProject\"\n            ReferencedContainer = \"container:ReactNativeLocizeProject.xcodeproj\">\n         </BuildableReference>\n      </BuildableProductRunnable>\n   </ProfileAction>\n   <AnalyzeAction\n      buildConfiguration = \"Debug\">\n   </AnalyzeAction>\n   <ArchiveAction\n      buildConfiguration = \"Release\"\n      revealArchiveInOrganizer = \"YES\">\n   </ArchiveAction>\n</Scheme>\n"
  },
  {
    "path": "example/ReactNativeLocizeProject/ios/ReactNativeLocizeProject.xcworkspace/contents.xcworkspacedata",
    "content": "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<Workspace\n   version = \"1.0\">\n   <FileRef\n      location = \"group:ReactNativeLocizeProject.xcodeproj\">\n   </FileRef>\n   <FileRef\n      location = \"group:Pods/Pods.xcodeproj\">\n   </FileRef>\n</Workspace>\n"
  },
  {
    "path": "example/ReactNativeLocizeProject/jest.config.js",
    "content": "module.exports = {\n  preset: 'react-native',\n};\n"
  },
  {
    "path": "example/ReactNativeLocizeProject/metro.config.js",
    "content": "const {getDefaultConfig, mergeConfig} = require('@react-native/metro-config');\n\n/**\n * Metro configuration\n * https://reactnative.dev/docs/metro\n *\n * @type {import('@react-native/metro-config').MetroConfig}\n */\nconst config = {};\n\nmodule.exports = mergeConfig(getDefaultConfig(__dirname), config);\n"
  },
  {
    "path": "example/ReactNativeLocizeProject/package.json",
    "content": "{\n  \"name\": \"ReactNativeLocizeProject\",\n  \"version\": \"0.0.1\",\n  \"private\": true,\n  \"scripts\": {\n    \"android\": \"react-native run-android\",\n    \"ios\": \"react-native run-ios\",\n    \"lint\": \"eslint .\",\n    \"start\": \"react-native start\",\n    \"test\": \"jest\"\n  },\n  \"dependencies\": {\n    \"@os-team/i18next-react-native-language-detector\": \"1.1.6\",\n    \"i18next\": \"25.1.1\",\n    \"i18next-chained-backend\": \"4.6.2\",\n    \"i18next-localstorage-backend\": \"4.2.0\",\n    \"i18next-locize-backend\": \"7.0.4\",\n    \"intl-pluralrules\": \"2.0.1\",\n    \"react\": \"19.0.0\",\n    \"react-i18next\": \"15.5.1\",\n    \"react-native\": \"0.79.2\",\n    \"react-native-localize\": \"3.4.1\"\n  },\n  \"devDependencies\": {\n    \"@babel/core\": \"^7.25.2\",\n    \"@babel/preset-env\": \"^7.25.3\",\n    \"@babel/runtime\": \"^7.25.0\",\n    \"@react-native-community/cli\": \"18.0.0\",\n    \"@react-native-community/cli-platform-android\": \"18.0.0\",\n    \"@react-native-community/cli-platform-ios\": \"18.0.0\",\n    \"@react-native/babel-preset\": \"0.79.2\",\n    \"@react-native/eslint-config\": \"0.79.2\",\n    \"@react-native/metro-config\": \"0.79.2\",\n    \"@react-native/typescript-config\": \"0.79.2\",\n    \"@types/jest\": \"^29.5.13\",\n    \"@types/react\": \"^19.0.0\",\n    \"@types/react-test-renderer\": \"^19.0.0\",\n    \"eslint\": \"^8.19.0\",\n    \"jest\": \"^29.6.3\",\n    \"prettier\": \"2.8.8\",\n    \"react-test-renderer\": \"19.0.0\",\n    \"typescript\": \"5.0.4\"\n  },\n  \"engines\": {\n    \"node\": \">=18\"\n  }\n}\n"
  },
  {
    "path": "example/ReactNativeLocizeProject/tsconfig.json",
    "content": "{\n  \"extends\": \"@react-native/typescript-config/tsconfig.json\"\n}\n"
  },
  {
    "path": "example/ReactNativeProject/.bundle/config",
    "content": "BUNDLE_PATH: \"vendor/bundle\"\nBUNDLE_FORCE_RUBY_PLATFORM: 1\n"
  },
  {
    "path": "example/ReactNativeProject/.eslintrc.js",
    "content": "module.exports = {\n  root: true,\n  extends: '@react-native',\n};\n"
  },
  {
    "path": "example/ReactNativeProject/.gitignore",
    "content": "# OSX\n#\n.DS_Store\n\n# Xcode\n#\nbuild/\n*.pbxuser\n!default.pbxuser\n*.mode1v3\n!default.mode1v3\n*.mode2v3\n!default.mode2v3\n*.perspectivev3\n!default.perspectivev3\nxcuserdata\n*.xccheckout\n*.moved-aside\nDerivedData\n*.hmap\n*.ipa\n*.xcuserstate\n**/.xcode.env.local\n\n# Android/IntelliJ\n#\nbuild/\n.idea\n.gradle\nlocal.properties\n*.iml\n*.hprof\n.cxx/\n*.keystore\n!debug.keystore\n.kotlin/\n\n# node.js\n#\nnode_modules/\nnpm-debug.log\nyarn-error.log\n\n# fastlane\n#\n# It is recommended to not store the screenshots in the git repo. Instead, use fastlane to re-generate the\n# screenshots whenever they are needed.\n# For more information about the recommended setup visit:\n# https://docs.fastlane.tools/best-practices/source-control/\n\n**/fastlane/report.xml\n**/fastlane/Preview.html\n**/fastlane/screenshots\n**/fastlane/test_output\n\n# Bundle artifact\n*.jsbundle\n\n# Ruby / CocoaPods\n**/Pods/\n/vendor/bundle/\n\n# Temporary files created by Metro to check the health of the file watcher\n.metro-health-check*\n\n# testing\n/coverage\n\n# Yarn\n.yarn/*\n!.yarn/patches\n!.yarn/plugins\n!.yarn/releases\n!.yarn/sdks\n!.yarn/versions\n"
  },
  {
    "path": "example/ReactNativeProject/.prettierrc.js",
    "content": "module.exports = {\n  arrowParens: 'avoid',\n  bracketSameLine: true,\n  bracketSpacing: false,\n  singleQuote: true,\n  trailingComma: 'all',\n};\n"
  },
  {
    "path": "example/ReactNativeProject/.watchmanconfig",
    "content": "{}\n"
  },
  {
    "path": "example/ReactNativeProject/App.tsx",
    "content": "import {Suspense, Component} from 'react';\nimport {Text, Button, View} from 'react-native';\nimport {useTranslation, withTranslation, Trans} from 'react-i18next';\nimport type {TFunction} from 'i18next';\n\n// use hoc for class based components\nclass LegacyWelcomeClass extends Component<{t: TFunction}> {\n  render() {\n    const {t} = this.props;\n    return <Text>{t('title')}</Text>;\n  }\n}\nconst Welcome = withTranslation()(LegacyWelcomeClass);\n\n// Component using the Trans component\nfunction MyComponent() {\n  return (\n    <Text>\n      <Trans i18nKey=\"description.part1\">\n        To get started, edit <Text>src/App.js</Text> and save to reload.\n      </Trans>\n    </Text>\n  );\n}\n\nfunction AppInner() {\n  const {t, i18n} = useTranslation();\n\n  const changeLanguage = (lng: string) => {\n    i18n.changeLanguage(lng);\n  };\n\n  return (\n    <View style={{flex: 1, justifyContent: 'center', alignItems: 'center'}}>\n      <Welcome />\n\n      <Button\n        onPress={() => changeLanguage('en')}\n        title=\"en\"\n        disabled={i18n.resolvedLanguage === 'en'}\n      />\n      <Button\n        onPress={() => changeLanguage('de')}\n        title=\"de\"\n        disabled={i18n.resolvedLanguage === 'de'}\n      />\n\n      <MyComponent />\n      <Text>{t('description.part2')}</Text>\n    </View>\n  );\n}\n\nexport default function App() {\n  return (\n    <Suspense fallback={<Text>loading...</Text>}>\n      <AppInner />\n    </Suspense>\n  );\n}\n"
  },
  {
    "path": "example/ReactNativeProject/Gemfile",
    "content": "source 'https://rubygems.org'\n\n# You may use http://rbenv.org/ or https://rvm.io/ to install and use this version\nruby \">= 2.6.10\"\n\n# Exclude problematic versions of cocoapods and activesupport that causes build failures.\ngem 'cocoapods', '>= 1.13', '!= 1.15.0', '!= 1.15.1'\ngem 'activesupport', '>= 6.1.7.5', '!= 7.1.0'\ngem 'xcodeproj', '< 1.26.0'\ngem 'concurrent-ruby', '< 1.3.4'\n\n# Ruby 3.4.0 has removed some libraries from the standard library.\ngem 'bigdecimal'\ngem 'logger'\ngem 'benchmark'\ngem 'mutex_m'\n"
  },
  {
    "path": "example/ReactNativeProject/README.md",
    "content": "This is a new [**React Native**](https://reactnative.dev) project, bootstrapped using [`@react-native-community/cli`](https://github.com/react-native-community/cli).\n\n# Getting Started\n\n> **Note**: Make sure you have completed the [Set Up Your Environment](https://reactnative.dev/docs/set-up-your-environment) guide before proceeding.\n\n## Step 1: Start Metro\n\nFirst, you will need to run **Metro**, the JavaScript build tool for React Native.\n\nTo start the Metro dev server, run the following command from the root of your React Native project:\n\n```sh\n# Using npm\nnpm start\n\n# OR using Yarn\nyarn start\n```\n\n## Step 2: Build and run your app\n\nWith Metro running, open a new terminal window/pane from the root of your React Native project, and use one of the following commands to build and run your Android or iOS app:\n\n### Android\n\n```sh\n# Using npm\nnpm run android\n\n# OR using Yarn\nyarn android\n```\n\n### iOS\n\nFor iOS, remember to install CocoaPods dependencies (this only needs to be run on first clone or after updating native deps).\n\nThe first time you create a new project, run the Ruby bundler to install CocoaPods itself:\n\n```sh\nbundle install\n```\n\nThen, and every time you update your native dependencies, run:\n\n```sh\nbundle exec pod install\n```\n\nFor more information, please visit [CocoaPods Getting Started guide](https://guides.cocoapods.org/using/getting-started.html).\n\n```sh\n# Using npm\nnpm run ios\n\n# OR using Yarn\nyarn ios\n```\n\nIf everything is set up correctly, you should see your new app running in the Android Emulator, iOS Simulator, or your connected device.\n\nThis is one way to run your app — you can also build it directly from Android Studio or Xcode.\n\n## Step 3: Modify your app\n\nNow that you have successfully run the app, let's make changes!\n\nOpen `App.tsx` in your text editor of choice and make some changes. When you save, your app will automatically update and reflect these changes — this is powered by [Fast Refresh](https://reactnative.dev/docs/fast-refresh).\n\nWhen you want to forcefully reload, for example to reset the state of your app, you can perform a full reload:\n\n- **Android**: Press the <kbd>R</kbd> key twice or select **\"Reload\"** from the **Dev Menu**, accessed via <kbd>Ctrl</kbd> + <kbd>M</kbd> (Windows/Linux) or <kbd>Cmd ⌘</kbd> + <kbd>M</kbd> (macOS).\n- **iOS**: Press <kbd>R</kbd> in iOS Simulator.\n\n## Congratulations! :tada:\n\nYou've successfully run and modified your React Native App. :partying_face:\n\n### Now what?\n\n- If you want to add this new React Native code to an existing application, check out the [Integration guide](https://reactnative.dev/docs/integration-with-existing-apps).\n- If you're curious to learn more about React Native, check out the [docs](https://reactnative.dev/docs/getting-started).\n\n# Troubleshooting\n\nIf you're having issues getting the above steps to work, see the [Troubleshooting](https://reactnative.dev/docs/troubleshooting) page.\n\n# Learn More\n\nTo learn more about React Native, take a look at the following resources:\n\n- [React Native Website](https://reactnative.dev) - learn more about React Native.\n- [Getting Started](https://reactnative.dev/docs/environment-setup) - an **overview** of React Native and how setup your environment.\n- [Learn the Basics](https://reactnative.dev/docs/getting-started) - a **guided tour** of the React Native **basics**.\n- [Blog](https://reactnative.dev/blog) - read the latest official React Native **Blog** posts.\n- [`@facebook/react-native`](https://github.com/facebook/react-native) - the Open Source; GitHub **repository** for React Native.\n"
  },
  {
    "path": "example/ReactNativeProject/__tests__/App.test.tsx",
    "content": "/**\n * @format\n */\n\nimport React from 'react';\nimport ReactTestRenderer from 'react-test-renderer';\nimport App from '../App';\n\ntest('renders correctly', async () => {\n  await ReactTestRenderer.act(() => {\n    ReactTestRenderer.create(<App />);\n  });\n});\n"
  },
  {
    "path": "example/ReactNativeProject/android/app/build.gradle",
    "content": "apply plugin: \"com.android.application\"\napply plugin: \"org.jetbrains.kotlin.android\"\napply plugin: \"com.facebook.react\"\n\n/**\n * This is the configuration block to customize your React Native Android app.\n * By default you don't need to apply any configuration, just uncomment the lines you need.\n */\nreact {\n    /* Folders */\n    //   The root of your project, i.e. where \"package.json\" lives. Default is '../..'\n    // root = file(\"../../\")\n    //   The folder where the react-native NPM package is. Default is ../../node_modules/react-native\n    // reactNativeDir = file(\"../../node_modules/react-native\")\n    //   The folder where the react-native Codegen package is. Default is ../../node_modules/@react-native/codegen\n    // codegenDir = file(\"../../node_modules/@react-native/codegen\")\n    //   The cli.js file which is the React Native CLI entrypoint. Default is ../../node_modules/react-native/cli.js\n    // cliFile = file(\"../../node_modules/react-native/cli.js\")\n\n    /* Variants */\n    //   The list of variants to that are debuggable. For those we're going to\n    //   skip the bundling of the JS bundle and the assets. By default is just 'debug'.\n    //   If you add flavors like lite, prod, etc. you'll have to list your debuggableVariants.\n    // debuggableVariants = [\"liteDebug\", \"prodDebug\"]\n\n    /* Bundling */\n    //   A list containing the node command and its flags. Default is just 'node'.\n    // nodeExecutableAndArgs = [\"node\"]\n    //\n    //   The command to run when bundling. By default is 'bundle'\n    // bundleCommand = \"ram-bundle\"\n    //\n    //   The path to the CLI configuration file. Default is empty.\n    // bundleConfig = file(../rn-cli.config.js)\n    //\n    //   The name of the generated asset file containing your JS bundle\n    // bundleAssetName = \"MyApplication.android.bundle\"\n    //\n    //   The entry file for bundle generation. Default is 'index.android.js' or 'index.js'\n    // entryFile = file(\"../js/MyApplication.android.js\")\n    //\n    //   A list of extra flags to pass to the 'bundle' commands.\n    //   See https://github.com/react-native-community/cli/blob/main/docs/commands.md#bundle\n    // extraPackagerArgs = []\n\n    /* Hermes Commands */\n    //   The hermes compiler command to run. By default it is 'hermesc'\n    // hermesCommand = \"$rootDir/my-custom-hermesc/bin/hermesc\"\n    //\n    //   The list of flags to pass to the Hermes compiler. By default is \"-O\", \"-output-source-map\"\n    // hermesFlags = [\"-O\", \"-output-source-map\"]\n\n    /* Autolinking */\n    autolinkLibrariesWithApp()\n}\n\n/**\n * Set this to true to Run Proguard on Release builds to minify the Java bytecode.\n */\ndef enableProguardInReleaseBuilds = false\n\n/**\n * The preferred build flavor of JavaScriptCore (JSC)\n *\n * For example, to use the international variant, you can use:\n * `def jscFlavor = io.github.react-native-community:jsc-android-intl:2026004.+`\n *\n * The international variant includes ICU i18n library and necessary data\n * allowing to use e.g. `Date.toLocaleString` and `String.localeCompare` that\n * give correct results when using with locales other than en-US. Note that\n * this variant is about 6MiB larger per architecture than default.\n */\ndef jscFlavor = 'io.github.react-native-community:jsc-android:2026004.+'\n\nandroid {\n    ndkVersion rootProject.ext.ndkVersion\n    buildToolsVersion rootProject.ext.buildToolsVersion\n    compileSdk rootProject.ext.compileSdkVersion\n\n    namespace \"com.reactnativeproject\"\n    defaultConfig {\n        applicationId \"com.reactnativeproject\"\n        minSdkVersion rootProject.ext.minSdkVersion\n        targetSdkVersion rootProject.ext.targetSdkVersion\n        versionCode 1\n        versionName \"1.0\"\n    }\n    signingConfigs {\n        debug {\n            storeFile file('debug.keystore')\n            storePassword 'android'\n            keyAlias 'androiddebugkey'\n            keyPassword 'android'\n        }\n    }\n    buildTypes {\n        debug {\n            signingConfig signingConfigs.debug\n        }\n        release {\n            // Caution! In production, you need to generate your own keystore file.\n            // see https://reactnative.dev/docs/signed-apk-android.\n            signingConfig signingConfigs.debug\n            minifyEnabled enableProguardInReleaseBuilds\n            proguardFiles getDefaultProguardFile(\"proguard-android.txt\"), \"proguard-rules.pro\"\n        }\n    }\n}\n\ndependencies {\n    // The version of react-native is set by the React Native Gradle Plugin\n    implementation(\"com.facebook.react:react-android\")\n\n    if (hermesEnabled.toBoolean()) {\n        implementation(\"com.facebook.react:hermes-android\")\n    } else {\n        implementation jscFlavor\n    }\n}\n"
  },
  {
    "path": "example/ReactNativeProject/android/app/proguard-rules.pro",
    "content": "# Add project specific ProGuard rules here.\n# By default, the flags in this file are appended to flags specified\n# in /usr/local/Cellar/android-sdk/24.3.3/tools/proguard/proguard-android.txt\n# You can edit the include path and order by changing the proguardFiles\n# directive in build.gradle.\n#\n# For more details, see\n#   http://developer.android.com/guide/developing/tools/proguard.html\n\n# Add any project specific keep options here:\n"
  },
  {
    "path": "example/ReactNativeProject/android/app/src/debug/AndroidManifest.xml",
    "content": "<?xml version=\"1.0\" encoding=\"utf-8\"?>\n<manifest xmlns:android=\"http://schemas.android.com/apk/res/android\"\n    xmlns:tools=\"http://schemas.android.com/tools\">\n\n    <application\n        android:usesCleartextTraffic=\"true\"\n        tools:targetApi=\"28\"\n        tools:ignore=\"GoogleAppIndexingWarning\"/>\n</manifest>\n"
  },
  {
    "path": "example/ReactNativeProject/android/app/src/main/AndroidManifest.xml",
    "content": "<manifest xmlns:android=\"http://schemas.android.com/apk/res/android\">\n\n    <uses-permission android:name=\"android.permission.INTERNET\" />\n\n    <application\n      android:name=\".MainApplication\"\n      android:label=\"@string/app_name\"\n      android:icon=\"@mipmap/ic_launcher\"\n      android:roundIcon=\"@mipmap/ic_launcher_round\"\n      android:allowBackup=\"false\"\n      android:theme=\"@style/AppTheme\"\n      android:supportsRtl=\"true\">\n      <activity\n        android:name=\".MainActivity\"\n        android:label=\"@string/app_name\"\n        android:configChanges=\"keyboard|keyboardHidden|orientation|screenLayout|screenSize|smallestScreenSize|uiMode\"\n        android:launchMode=\"singleTask\"\n        android:windowSoftInputMode=\"adjustResize\"\n        android:exported=\"true\">\n        <intent-filter>\n            <action android:name=\"android.intent.action.MAIN\" />\n            <category android:name=\"android.intent.category.LAUNCHER\" />\n        </intent-filter>\n      </activity>\n    </application>\n</manifest>\n"
  },
  {
    "path": "example/ReactNativeProject/android/app/src/main/java/com/reactnativeproject/MainActivity.kt",
    "content": "package com.reactnativeproject\n\nimport com.facebook.react.ReactActivity\nimport com.facebook.react.ReactActivityDelegate\nimport com.facebook.react.defaults.DefaultNewArchitectureEntryPoint.fabricEnabled\nimport com.facebook.react.defaults.DefaultReactActivityDelegate\n\nclass MainActivity : ReactActivity() {\n\n  /**\n   * Returns the name of the main component registered from JavaScript. This is used to schedule\n   * rendering of the component.\n   */\n  override fun getMainComponentName(): String = \"ReactNativeProject\"\n\n  /**\n   * Returns the instance of the [ReactActivityDelegate]. We use [DefaultReactActivityDelegate]\n   * which allows you to enable New Architecture with a single boolean flags [fabricEnabled]\n   */\n  override fun createReactActivityDelegate(): ReactActivityDelegate =\n      DefaultReactActivityDelegate(this, mainComponentName, fabricEnabled)\n}\n"
  },
  {
    "path": "example/ReactNativeProject/android/app/src/main/java/com/reactnativeproject/MainApplication.kt",
    "content": "package com.reactnativeproject\n\nimport android.app.Application\nimport com.facebook.react.PackageList\nimport com.facebook.react.ReactApplication\nimport com.facebook.react.ReactHost\nimport com.facebook.react.ReactNativeHost\nimport com.facebook.react.ReactPackage\nimport com.facebook.react.defaults.DefaultNewArchitectureEntryPoint.load\nimport com.facebook.react.defaults.DefaultReactHost.getDefaultReactHost\nimport com.facebook.react.defaults.DefaultReactNativeHost\nimport com.facebook.react.soloader.OpenSourceMergedSoMapping\nimport com.facebook.soloader.SoLoader\n\nclass MainApplication : Application(), ReactApplication {\n\n  override val reactNativeHost: ReactNativeHost =\n      object : DefaultReactNativeHost(this) {\n        override fun getPackages(): List<ReactPackage> =\n            PackageList(this).packages.apply {\n              // Packages that cannot be autolinked yet can be added manually here, for example:\n              // add(MyReactNativePackage())\n            }\n\n        override fun getJSMainModuleName(): String = \"index\"\n\n        override fun getUseDeveloperSupport(): Boolean = BuildConfig.DEBUG\n\n        override val isNewArchEnabled: Boolean = BuildConfig.IS_NEW_ARCHITECTURE_ENABLED\n        override val isHermesEnabled: Boolean = BuildConfig.IS_HERMES_ENABLED\n      }\n\n  override val reactHost: ReactHost\n    get() = getDefaultReactHost(applicationContext, reactNativeHost)\n\n  override fun onCreate() {\n    super.onCreate()\n    SoLoader.init(this, OpenSourceMergedSoMapping)\n    if (BuildConfig.IS_NEW_ARCHITECTURE_ENABLED) {\n      // If you opted-in for the New Architecture, we load the native entry point for this app.\n      load()\n    }\n  }\n}\n"
  },
  {
    "path": "example/ReactNativeProject/android/app/src/main/res/drawable/rn_edit_text_material.xml",
    "content": "<?xml version=\"1.0\" encoding=\"utf-8\"?>\n<!-- Copyright (C) 2014 The Android Open Source Project\n\n     Licensed under the Apache License, Version 2.0 (the \"License\");\n     you may not use this file except in compliance with the License.\n     You may obtain a copy of the License at\n\n          http://www.apache.org/licenses/LICENSE-2.0\n\n     Unless required by applicable law or agreed to in writing, software\n     distributed under the License is distributed on an \"AS IS\" BASIS,\n     WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n     See the License for the specific language governing permissions and\n     limitations under the License.\n-->\n<inset xmlns:android=\"http://schemas.android.com/apk/res/android\"\n       android:insetLeft=\"@dimen/abc_edit_text_inset_horizontal_material\"\n       android:insetRight=\"@dimen/abc_edit_text_inset_horizontal_material\"\n       android:insetTop=\"@dimen/abc_edit_text_inset_top_material\"\n       android:insetBottom=\"@dimen/abc_edit_text_inset_bottom_material\"\n       >\n\n    <selector>\n        <!--\n          This file is a copy of abc_edit_text_material (https://bit.ly/3k8fX7I).\n          The item below with state_pressed=\"false\" and state_focused=\"false\" causes a NullPointerException.\n          NullPointerException:tempt to invoke virtual method 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable$ConstantState.newDrawable(android.content.res.Resources)'\n\n          <item android:state_pressed=\"false\" android:state_focused=\"false\" android:drawable=\"@drawable/abc_textfield_default_mtrl_alpha\"/>\n\n          For more info, see https://bit.ly/3CdLStv (react-native/pull/29452) and https://bit.ly/3nxOMoR.\n        -->\n        <item android:state_enabled=\"false\" android:drawable=\"@drawable/abc_textfield_default_mtrl_alpha\"/>\n        <item android:drawable=\"@drawable/abc_textfield_activated_mtrl_alpha\"/>\n    </selector>\n\n</inset>\n"
  },
  {
    "path": "example/ReactNativeProject/android/app/src/main/res/values/strings.xml",
    "content": "<resources>\n    <string name=\"app_name\">ReactNativeProject</string>\n</resources>\n"
  },
  {
    "path": "example/ReactNativeProject/android/app/src/main/res/values/styles.xml",
    "content": "<resources>\n\n    <!-- Base application theme. -->\n    <style name=\"AppTheme\" parent=\"Theme.AppCompat.DayNight.NoActionBar\">\n        <!-- Customize your theme here. -->\n        <item name=\"android:editTextBackground\">@drawable/rn_edit_text_material</item>\n    </style>\n\n</resources>\n"
  },
  {
    "path": "example/ReactNativeProject/android/build.gradle",
    "content": "buildscript {\n    ext {\n        buildToolsVersion = \"35.0.0\"\n        minSdkVersion = 24\n        compileSdkVersion = 35\n        targetSdkVersion = 35\n        ndkVersion = \"27.1.12297006\"\n        kotlinVersion = \"2.0.21\"\n    }\n    repositories {\n        google()\n        mavenCentral()\n    }\n    dependencies {\n        classpath(\"com.android.tools.build:gradle\")\n        classpath(\"com.facebook.react:react-native-gradle-plugin\")\n        classpath(\"org.jetbrains.kotlin:kotlin-gradle-plugin\")\n    }\n}\n\napply plugin: \"com.facebook.react.rootproject\"\n"
  },
  {
    "path": "example/ReactNativeProject/android/gradle/wrapper/gradle-wrapper.properties",
    "content": "distributionBase=GRADLE_USER_HOME\ndistributionPath=wrapper/dists\ndistributionUrl=https\\://services.gradle.org/distributions/gradle-8.13-bin.zip\nnetworkTimeout=10000\nvalidateDistributionUrl=true\nzipStoreBase=GRADLE_USER_HOME\nzipStorePath=wrapper/dists\n"
  },
  {
    "path": "example/ReactNativeProject/android/gradle.properties",
    "content": "# Project-wide Gradle settings.\n\n# IDE (e.g. Android Studio) users:\n# Gradle settings configured through the IDE *will override*\n# any settings specified in this file.\n\n# For more details on how to configure your build environment visit\n# http://www.gradle.org/docs/current/userguide/build_environment.html\n\n# Specifies the JVM arguments used for the daemon process.\n# The setting is particularly useful for tweaking memory settings.\n# Default value: -Xmx512m -XX:MaxMetaspaceSize=256m\norg.gradle.jvmargs=-Xmx2048m -XX:MaxMetaspaceSize=512m\n\n# When configured, Gradle will run in incubating parallel mode.\n# This option should only be used with decoupled projects. More details, visit\n# http://www.gradle.org/docs/current/userguide/multi_project_builds.html#sec:decoupled_projects\n# org.gradle.parallel=true\n\n# AndroidX package structure to make it clearer which packages are bundled with the\n# Android operating system, and which are packaged with your app's APK\n# https://developer.android.com/topic/libraries/support-library/androidx-rn\nandroid.useAndroidX=true\n\n# Use this property to specify which architecture you want to build.\n# You can also override it from the CLI using\n# ./gradlew <task> -PreactNativeArchitectures=x86_64\nreactNativeArchitectures=armeabi-v7a,arm64-v8a,x86,x86_64\n\n# Use this property to enable support to the new architecture.\n# This will allow you to use TurboModules and the Fabric render in\n# your application. You should enable this flag either if you want\n# to write custom TurboModules/Fabric components OR use libraries that\n# are providing them.\nnewArchEnabled=true\n\n# Use this property to enable or disable the Hermes JS engine.\n# If set to false, you will be using JSC instead.\nhermesEnabled=true\n"
  },
  {
    "path": "example/ReactNativeProject/android/gradlew",
    "content": "#!/bin/sh\n\n#\n# Copyright © 2015-2021 the original authors.\n#\n# Licensed under the Apache License, Version 2.0 (the \"License\");\n# you may not use this file except in compliance with the License.\n# You may obtain a copy of the License at\n#\n#      https://www.apache.org/licenses/LICENSE-2.0\n#\n# Unless required by applicable law or agreed to in writing, software\n# distributed under the License is distributed on an \"AS IS\" BASIS,\n# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n# See the License for the specific language governing permissions and\n# limitations under the License.\n#\n# SPDX-License-Identifier: Apache-2.0\n#\n\n##############################################################################\n#\n#   Gradle start up script for POSIX generated by Gradle.\n#\n#   Important for running:\n#\n#   (1) You need a POSIX-compliant shell to run this script. If your /bin/sh is\n#       noncompliant, but you have some other compliant shell such as ksh or\n#       bash, then to run this script, type that shell name before the whole\n#       command line, like:\n#\n#           ksh Gradle\n#\n#       Busybox and similar reduced shells will NOT work, because this script\n#       requires all of these POSIX shell features:\n#         * functions;\n#         * expansions «$var», «${var}», «${var:-default}», «${var+SET}»,\n#           «${var#prefix}», «${var%suffix}», and «$( cmd )»;\n#         * compound commands having a testable exit status, especially «case»;\n#         * various built-in commands including «command», «set», and «ulimit».\n#\n#   Important for patching:\n#\n#   (2) This script targets any POSIX shell, so it avoids extensions provided\n#       by Bash, Ksh, etc; in particular arrays are avoided.\n#\n#       The \"traditional\" practice of packing multiple parameters into a\n#       space-separated string is a well documented source of bugs and security\n#       problems, so this is (mostly) avoided, by progressively accumulating\n#       options in \"$@\", and eventually passing that to Java.\n#\n#       Where the inherited environment variables (DEFAULT_JVM_OPTS, JAVA_OPTS,\n#       and GRADLE_OPTS) rely on word-splitting, this is performed explicitly;\n#       see the in-line comments for details.\n#\n#       There are tweaks for specific operating systems such as AIX, CygWin,\n#       Darwin, MinGW, and NonStop.\n#\n#   (3) This script is generated from the Groovy template\n#       https://github.com/gradle/gradle/blob/HEAD/platforms/jvm/plugins-application/src/main/resources/org/gradle/api/internal/plugins/unixStartScript.txt\n#       within the Gradle project.\n#\n#       You can find Gradle at https://github.com/gradle/gradle/.\n#\n##############################################################################\n\n# Attempt to set APP_HOME\n\n# Resolve links: $0 may be a link\napp_path=$0\n\n# Need this for daisy-chained symlinks.\nwhile\n    APP_HOME=${app_path%\"${app_path##*/}\"}  # leaves a trailing /; empty if no leading path\n    [ -h \"$app_path\" ]\ndo\n    ls=$( ls -ld \"$app_path\" )\n    link=${ls#*' -> '}\n    case $link in             #(\n      /*)   app_path=$link ;; #(\n      *)    app_path=$APP_HOME$link ;;\n    esac\ndone\n\n# This is normally unused\n# shellcheck disable=SC2034\nAPP_BASE_NAME=${0##*/}\n# Discard cd standard output in case $CDPATH is set (https://github.com/gradle/gradle/issues/25036)\nAPP_HOME=$( cd -P \"${APP_HOME:-./}\" > /dev/null && printf '%s\\n' \"$PWD\" ) || exit\n\n# Use the maximum available, or set MAX_FD != -1 to use that value.\nMAX_FD=maximum\n\nwarn () {\n    echo \"$*\"\n} >&2\n\ndie () {\n    echo\n    echo \"$*\"\n    echo\n    exit 1\n} >&2\n\n# OS specific support (must be 'true' or 'false').\ncygwin=false\nmsys=false\ndarwin=false\nnonstop=false\ncase \"$( uname )\" in                #(\n  CYGWIN* )         cygwin=true  ;; #(\n  Darwin* )         darwin=true  ;; #(\n  MSYS* | MINGW* )  msys=true    ;; #(\n  NONSTOP* )        nonstop=true ;;\nesac\n\nCLASSPATH=$APP_HOME/gradle/wrapper/gradle-wrapper.jar\n\n\n# Determine the Java command to use to start the JVM.\nif [ -n \"$JAVA_HOME\" ] ; then\n    if [ -x \"$JAVA_HOME/jre/sh/java\" ] ; then\n        # IBM's JDK on AIX uses strange locations for the executables\n        JAVACMD=$JAVA_HOME/jre/sh/java\n    else\n        JAVACMD=$JAVA_HOME/bin/java\n    fi\n    if [ ! -x \"$JAVACMD\" ] ; then\n        die \"ERROR: JAVA_HOME is set to an invalid directory: $JAVA_HOME\n\nPlease set the JAVA_HOME variable in your environment to match the\nlocation of your Java installation.\"\n    fi\nelse\n    JAVACMD=java\n    if ! command -v java >/dev/null 2>&1\n    then\n        die \"ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH.\n\nPlease set the JAVA_HOME variable in your environment to match the\nlocation of your Java installation.\"\n    fi\nfi\n\n# Increase the maximum file descriptors if we can.\nif ! \"$cygwin\" && ! \"$darwin\" && ! \"$nonstop\" ; then\n    case $MAX_FD in #(\n      max*)\n        # In POSIX sh, ulimit -H is undefined. That's why the result is checked to see if it worked.\n        # shellcheck disable=SC2039,SC3045\n        MAX_FD=$( ulimit -H -n ) ||\n            warn \"Could not query maximum file descriptor limit\"\n    esac\n    case $MAX_FD in  #(\n      '' | soft) :;; #(\n      *)\n        # In POSIX sh, ulimit -n is undefined. That's why the result is checked to see if it worked.\n        # shellcheck disable=SC2039,SC3045\n        ulimit -n \"$MAX_FD\" ||\n            warn \"Could not set maximum file descriptor limit to $MAX_FD\"\n    esac\nfi\n\n# Collect all arguments for the java command, stacking in reverse order:\n#   * args from the command line\n#   * the main class name\n#   * -classpath\n#   * -D...appname settings\n#   * --module-path (only if needed)\n#   * DEFAULT_JVM_OPTS, JAVA_OPTS, and GRADLE_OPTS environment variables.\n\n# For Cygwin or MSYS, switch paths to Windows format before running java\nif \"$cygwin\" || \"$msys\" ; then\n    APP_HOME=$( cygpath --path --mixed \"$APP_HOME\" )\n    CLASSPATH=$( cygpath --path --mixed \"$CLASSPATH\" )\n\n    JAVACMD=$( cygpath --unix \"$JAVACMD\" )\n\n    # Now convert the arguments - kludge to limit ourselves to /bin/sh\n    for arg do\n        if\n            case $arg in                                #(\n              -*)   false ;;                            # don't mess with options #(\n              /?*)  t=${arg#/} t=/${t%%/*}              # looks like a POSIX filepath\n                    [ -e \"$t\" ] ;;                      #(\n              *)    false ;;\n            esac\n        then\n            arg=$( cygpath --path --ignore --mixed \"$arg\" )\n        fi\n        # Roll the args list around exactly as many times as the number of\n        # args, so each arg winds up back in the position where it started, but\n        # possibly modified.\n        #\n        # NB: a `for` loop captures its iteration list before it begins, so\n        # changing the positional parameters here affects neither the number of\n        # iterations, nor the values presented in `arg`.\n        shift                   # remove old arg\n        set -- \"$@\" \"$arg\"      # push replacement arg\n    done\nfi\n\n\n# Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script.\nDEFAULT_JVM_OPTS='\"-Xmx64m\" \"-Xms64m\"'\n\n# Collect all arguments for the java command:\n#   * DEFAULT_JVM_OPTS, JAVA_OPTS, and optsEnvironmentVar are not allowed to contain shell fragments,\n#     and any embedded shellness will be escaped.\n#   * For example: A user cannot expect ${Hostname} to be expanded, as it is an environment variable and will be\n#     treated as '${Hostname}' itself on the command line.\n\nset -- \\\n        \"-Dorg.gradle.appname=$APP_BASE_NAME\" \\\n        -classpath \"$CLASSPATH\" \\\n        org.gradle.wrapper.GradleWrapperMain \\\n        \"$@\"\n\n# Stop when \"xargs\" is not available.\nif ! command -v xargs >/dev/null 2>&1\nthen\n    die \"xargs is not available\"\nfi\n\n# Use \"xargs\" to parse quoted args.\n#\n# With -n1 it outputs one arg per line, with the quotes and backslashes removed.\n#\n# In Bash we could simply go:\n#\n#   readarray ARGS < <( xargs -n1 <<<\"$var\" ) &&\n#   set -- \"${ARGS[@]}\" \"$@\"\n#\n# but POSIX shell has neither arrays nor command substitution, so instead we\n# post-process each arg (as a line of input to sed) to backslash-escape any\n# character that might be a shell metacharacter, then use eval to reverse\n# that process (while maintaining the separation between arguments), and wrap\n# the whole thing up as a single \"set\" statement.\n#\n# This will of course break if any of these variables contains a newline or\n# an unmatched quote.\n#\n\neval \"set -- $(\n        printf '%s\\n' \"$DEFAULT_JVM_OPTS $JAVA_OPTS $GRADLE_OPTS\" |\n        xargs -n1 |\n        sed ' s~[^-[:alnum:]+,./:=@_]~\\\\&~g; ' |\n        tr '\\n' ' '\n    )\" '\"$@\"'\n\nexec \"$JAVACMD\" \"$@\"\n"
  },
  {
    "path": "example/ReactNativeProject/android/gradlew.bat",
    "content": "@rem\r\n@rem Copyright 2015 the original author or authors.\r\n@rem\r\n@rem Licensed under the Apache License, Version 2.0 (the \"License\");\r\n@rem you may not use this file except in compliance with the License.\r\n@rem You may obtain a copy of the License at\r\n@rem\r\n@rem      https://www.apache.org/licenses/LICENSE-2.0\r\n@rem\r\n@rem Unless required by applicable law or agreed to in writing, software\r\n@rem distributed under the License is distributed on an \"AS IS\" BASIS,\r\n@rem WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r\n@rem See the License for the specific language governing permissions and\r\n@rem limitations under the License.\r\n@rem\r\n@rem SPDX-License-Identifier: Apache-2.0\r\n@rem\r\n\r\n@if \"%DEBUG%\"==\"\" @echo off\r\n@rem ##########################################################################\r\n@rem\r\n@rem  Gradle startup script for Windows\r\n@rem\r\n@rem ##########################################################################\r\n\r\n@rem Set local scope for the variables with windows NT shell\r\nif \"%OS%\"==\"Windows_NT\" setlocal\r\n\r\nset DIRNAME=%~dp0\r\nif \"%DIRNAME%\"==\"\" set DIRNAME=.\r\n@rem This is normally unused\r\nset APP_BASE_NAME=%~n0\r\nset APP_HOME=%DIRNAME%\r\n\r\n@rem Resolve any \".\" and \"..\" in APP_HOME to make it shorter.\r\nfor %%i in (\"%APP_HOME%\") do set APP_HOME=%%~fi\r\n\r\n@rem Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script.\r\nset DEFAULT_JVM_OPTS=\"-Xmx64m\" \"-Xms64m\"\r\n\r\n@rem Find java.exe\r\nif defined JAVA_HOME goto findJavaFromJavaHome\r\n\r\nset JAVA_EXE=java.exe\r\n%JAVA_EXE% -version >NUL 2>&1\r\nif %ERRORLEVEL% equ 0 goto execute\r\n\r\necho. 1>&2\r\necho ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH. 1>&2\r\necho. 1>&2\r\necho Please set the JAVA_HOME variable in your environment to match the 1>&2\r\necho location of your Java installation. 1>&2\r\n\r\ngoto fail\r\n\r\n:findJavaFromJavaHome\r\nset JAVA_HOME=%JAVA_HOME:\"=%\r\nset JAVA_EXE=%JAVA_HOME%/bin/java.exe\r\n\r\nif exist \"%JAVA_EXE%\" goto execute\r\n\r\necho. 1>&2\r\necho ERROR: JAVA_HOME is set to an invalid directory: %JAVA_HOME% 1>&2\r\necho. 1>&2\r\necho Please set the JAVA_HOME variable in your environment to match the 1>&2\r\necho location of your Java installation. 1>&2\r\n\r\ngoto fail\r\n\r\n:execute\r\n@rem Setup the command line\r\n\r\nset CLASSPATH=%APP_HOME%\\gradle\\wrapper\\gradle-wrapper.jar\r\n\r\n\r\n@rem Execute Gradle\r\n\"%JAVA_EXE%\" %DEFAULT_JVM_OPTS% %JAVA_OPTS% %GRADLE_OPTS% \"-Dorg.gradle.appname=%APP_BASE_NAME%\" -classpath \"%CLASSPATH%\" org.gradle.wrapper.GradleWrapperMain %*\r\n\r\n:end\r\n@rem End local scope for the variables with windows NT shell\r\nif %ERRORLEVEL% equ 0 goto mainEnd\r\n\r\n:fail\r\nrem Set variable GRADLE_EXIT_CONSOLE if you need the _script_ return code instead of\r\nrem the _cmd.exe /c_ return code!\r\nset EXIT_CODE=%ERRORLEVEL%\r\nif %EXIT_CODE% equ 0 set EXIT_CODE=1\r\nif not \"\"==\"%GRADLE_EXIT_CONSOLE%\" exit %EXIT_CODE%\r\nexit /b %EXIT_CODE%\r\n\r\n:mainEnd\r\nif \"%OS%\"==\"Windows_NT\" endlocal\r\n\r\n:omega\r\n"
  },
  {
    "path": "example/ReactNativeProject/android/settings.gradle",
    "content": "pluginManagement { includeBuild(\"../node_modules/@react-native/gradle-plugin\") }\nplugins { id(\"com.facebook.react.settings\") }\nextensions.configure(com.facebook.react.ReactSettingsExtension){ ex -> ex.autolinkLibrariesFromCommand() }\nrootProject.name = 'ReactNativeProject'\ninclude ':app'\nincludeBuild('../node_modules/@react-native/gradle-plugin')\n"
  },
  {
    "path": "example/ReactNativeProject/app.json",
    "content": "{\n  \"name\": \"ReactNativeProject\",\n  \"displayName\": \"ReactNativeProject\"\n}\n"
  },
  {
    "path": "example/ReactNativeProject/babel.config.js",
    "content": "module.exports = {\n  presets: ['module:@react-native/babel-preset'],\n};\n"
  },
  {
    "path": "example/ReactNativeProject/i18n.js",
    "content": "import 'intl-pluralrules';\nimport i18n from 'i18next';\nimport {initReactI18next} from 'react-i18next';\nimport RNLanguageDetector from '@os-team/i18next-react-native-language-detector';\n\nimport enTranslation from './locales/en/translation.json';\nimport deTranslation from './locales/de/translation.json';\n\ni18n\n  .use(RNLanguageDetector)\n  .use(initReactI18next)\n  .init({\n    debug: true,\n    fallbackLng: 'en',\n    supportedLngs: ['en', 'de'],\n    resources: {\n      en: {\n        translation: enTranslation,\n      },\n      de: {\n        translation: deTranslation,\n      },\n    },\n  });\n"
  },
  {
    "path": "example/ReactNativeProject/index.js",
    "content": "/**\n * @format\n */\n\nimport {AppRegistry} from 'react-native';\nimport App from './App';\nimport {name as appName} from './app.json';\n\n// import i18n (needs to be bundled ;))\nimport './i18n';\n\nAppRegistry.registerComponent(appName, () => App);\n"
  },
  {
    "path": "example/ReactNativeProject/ios/.xcode.env",
    "content": "# This `.xcode.env` file is versioned and is used to source the environment\n# used when running script phases inside Xcode.\n# To customize your local environment, you can create an `.xcode.env.local`\n# file that is not versioned.\n\n# NODE_BINARY variable contains the PATH to the node executable.\n#\n# Customize the NODE_BINARY variable here.\n# For example, to use nvm with brew, add the following line\n# . \"$(brew --prefix nvm)/nvm.sh\" --no-use\nexport NODE_BINARY=$(command -v node)\n"
  },
  {
    "path": "example/ReactNativeProject/ios/Podfile",
    "content": "# Resolve react_native_pods.rb with node to allow for hoisting\nrequire Pod::Executable.execute_command('node', ['-p',\n  'require.resolve(\n    \"react-native/scripts/react_native_pods.rb\",\n    {paths: [process.argv[1]]},\n  )', __dir__]).strip\n\nplatform :ios, min_ios_version_supported\nprepare_react_native_project!\n\nlinkage = ENV['USE_FRAMEWORKS']\nif linkage != nil\n  Pod::UI.puts \"Configuring Pod with #{linkage}ally linked Frameworks\".green\n  use_frameworks! :linkage => linkage.to_sym\nend\n\ntarget 'ReactNativeProject' do\n  config = use_native_modules!\n\n  use_react_native!(\n    :path => config[:reactNativePath],\n    # An absolute path to your application root.\n    :app_path => \"#{Pod::Config.instance.installation_root}/..\"\n  )\n\n  post_install do |installer|\n    # https://github.com/facebook/react-native/blob/main/packages/react-native/scripts/react_native_pods.rb#L197-L202\n    react_native_post_install(\n      installer,\n      config[:reactNativePath],\n      :mac_catalyst_enabled => false,\n      # :ccache_enabled => true\n    )\n  end\nend\n"
  },
  {
    "path": "example/ReactNativeProject/ios/ReactNativeProject/AppDelegate.swift",
    "content": "import UIKit\nimport React\nimport React_RCTAppDelegate\nimport ReactAppDependencyProvider\n\n@main\nclass AppDelegate: UIResponder, UIApplicationDelegate {\n  var window: UIWindow?\n\n  var reactNativeDelegate: ReactNativeDelegate?\n  var reactNativeFactory: RCTReactNativeFactory?\n\n  func application(\n    _ application: UIApplication,\n    didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]? = nil\n  ) -> Bool {\n    let delegate = ReactNativeDelegate()\n    let factory = RCTReactNativeFactory(delegate: delegate)\n    delegate.dependencyProvider = RCTAppDependencyProvider()\n\n    reactNativeDelegate = delegate\n    reactNativeFactory = factory\n\n    window = UIWindow(frame: UIScreen.main.bounds)\n\n    factory.startReactNative(\n      withModuleName: \"ReactNativeProject\",\n      in: window,\n      launchOptions: launchOptions\n    )\n\n    return true\n  }\n}\n\nclass ReactNativeDelegate: RCTDefaultReactNativeFactoryDelegate {\n  override func sourceURL(for bridge: RCTBridge) -> URL? {\n    self.bundleURL()\n  }\n\n  override func bundleURL() -> URL? {\n#if DEBUG\n    RCTBundleURLProvider.sharedSettings().jsBundleURL(forBundleRoot: \"index\")\n#else\n    Bundle.main.url(forResource: \"main\", withExtension: \"jsbundle\")\n#endif\n  }\n}\n"
  },
  {
    "path": "example/ReactNativeProject/ios/ReactNativeProject/Images.xcassets/AppIcon.appiconset/Contents.json",
    "content": "{\n  \"images\": [\n    {\n      \"idiom\": \"iphone\",\n      \"scale\": \"2x\",\n      \"size\": \"20x20\"\n    },\n    {\n      \"idiom\": \"iphone\",\n      \"scale\": \"3x\",\n      \"size\": \"20x20\"\n    },\n    {\n      \"idiom\": \"iphone\",\n      \"scale\": \"2x\",\n      \"size\": \"29x29\"\n    },\n    {\n      \"idiom\": \"iphone\",\n      \"scale\": \"3x\",\n      \"size\": \"29x29\"\n    },\n    {\n      \"idiom\": \"iphone\",\n      \"scale\": \"2x\",\n      \"size\": \"40x40\"\n    },\n    {\n      \"idiom\": \"iphone\",\n      \"scale\": \"3x\",\n      \"size\": \"40x40\"\n    },\n    {\n      \"idiom\": \"iphone\",\n      \"scale\": \"2x\",\n      \"size\": \"60x60\"\n    },\n    {\n      \"idiom\": \"iphone\",\n      \"scale\": \"3x\",\n      \"size\": \"60x60\"\n    },\n    {\n      \"idiom\": \"ios-marketing\",\n      \"scale\": \"1x\",\n      \"size\": \"1024x1024\"\n    }\n  ],\n  \"info\": {\n    \"author\": \"xcode\",\n    \"version\": 1\n  }\n}\n"
  },
  {
    "path": "example/ReactNativeProject/ios/ReactNativeProject/Images.xcassets/Contents.json",
    "content": "{\n  \"info\": {\n    \"version\": 1,\n    \"author\": \"xcode\"\n  }\n}\n"
  },
  {
    "path": "example/ReactNativeProject/ios/ReactNativeProject/Info.plist",
    "content": "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<!DOCTYPE plist PUBLIC \"-//Apple//DTD PLIST 1.0//EN\" \"http://www.apple.com/DTDs/PropertyList-1.0.dtd\">\n<plist version=\"1.0\">\n<dict>\n\t<key>CFBundleDevelopmentRegion</key>\n\t<string>en</string>\n\t<key>CFBundleDisplayName</key>\n\t<string>ReactNativeProject</string>\n\t<key>CFBundleExecutable</key>\n\t<string>$(EXECUTABLE_NAME)</string>\n\t<key>CFBundleIdentifier</key>\n\t<string>$(PRODUCT_BUNDLE_IDENTIFIER)</string>\n\t<key>CFBundleInfoDictionaryVersion</key>\n\t<string>6.0</string>\n\t<key>CFBundleName</key>\n\t<string>$(PRODUCT_NAME)</string>\n\t<key>CFBundlePackageType</key>\n\t<string>APPL</string>\n\t<key>CFBundleShortVersionString</key>\n\t<string>$(MARKETING_VERSION)</string>\n\t<key>CFBundleSignature</key>\n\t<string>????</string>\n\t<key>CFBundleVersion</key>\n\t<string>$(CURRENT_PROJECT_VERSION)</string>\n\t<key>LSRequiresIPhoneOS</key>\n\t<true/>\n\t<key>NSAppTransportSecurity</key>\n\t<dict>\n\t  <!-- Do not change NSAllowsArbitraryLoads to true, or you will risk app rejection! -->\n\t\t<key>NSAllowsArbitraryLoads</key>\n\t\t<false/>\n\t\t<key>NSAllowsLocalNetworking</key>\n\t\t<true/>\n\t</dict>\n\t<key>NSLocationWhenInUseUsageDescription</key>\n\t<string></string>\n\t<key>UILaunchStoryboardName</key>\n\t<string>LaunchScreen</string>\n\t<key>UIRequiredDeviceCapabilities</key>\n\t<array>\n\t\t<string>arm64</string>\n\t</array>\n\t<key>UISupportedInterfaceOrientations</key>\n\t<array>\n\t\t<string>UIInterfaceOrientationPortrait</string>\n\t\t<string>UIInterfaceOrientationLandscapeLeft</string>\n\t\t<string>UIInterfaceOrientationLandscapeRight</string>\n\t</array>\n\t<key>UIViewControllerBasedStatusBarAppearance</key>\n\t<false/>\n</dict>\n</plist>\n"
  },
  {
    "path": "example/ReactNativeProject/ios/ReactNativeProject/LaunchScreen.storyboard",
    "content": "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<document type=\"com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB\" version=\"3.0\" toolsVersion=\"15702\" targetRuntime=\"iOS.CocoaTouch\" propertyAccessControl=\"none\" useAutolayout=\"YES\" launchScreen=\"YES\" useTraitCollections=\"YES\" useSafeAreas=\"YES\" colorMatched=\"YES\" initialViewController=\"01J-lp-oVM\">\n    <device id=\"retina4_7\" orientation=\"portrait\" appearance=\"light\"/>\n    <dependencies>\n        <deployment identifier=\"iOS\"/>\n        <plugIn identifier=\"com.apple.InterfaceBuilder.IBCocoaTouchPlugin\" version=\"15704\"/>\n        <capability name=\"Safe area layout guides\" minToolsVersion=\"9.0\"/>\n        <capability name=\"documents saved in the Xcode 8 format\" minToolsVersion=\"8.0\"/>\n    </dependencies>\n    <scenes>\n        <!--View Controller-->\n        <scene sceneID=\"EHf-IW-A2E\">\n            <objects>\n                <viewController id=\"01J-lp-oVM\" sceneMemberID=\"viewController\">\n                    <view key=\"view\" contentMode=\"scaleToFill\" id=\"Ze5-6b-2t3\">\n                        <rect key=\"frame\" x=\"0.0\" y=\"0.0\" width=\"375\" height=\"667\"/>\n                        <autoresizingMask key=\"autoresizingMask\" widthSizable=\"YES\" heightSizable=\"YES\"/>\n                        <subviews>\n                            <label opaque=\"NO\" clipsSubviews=\"YES\" userInteractionEnabled=\"NO\" contentMode=\"left\" horizontalHuggingPriority=\"251\" verticalHuggingPriority=\"251\" text=\"ReactNativeProject\" textAlignment=\"center\" lineBreakMode=\"middleTruncation\" baselineAdjustment=\"alignBaselines\" minimumFontSize=\"18\" translatesAutoresizingMaskIntoConstraints=\"NO\" id=\"GJd-Yh-RWb\">\n                                <rect key=\"frame\" x=\"0.0\" y=\"202\" width=\"375\" height=\"43\"/>\n                                <fontDescription key=\"fontDescription\" type=\"boldSystem\" pointSize=\"36\"/>\n                                <nil key=\"highlightedColor\"/>\n                            </label>\n                            <label opaque=\"NO\" clipsSubviews=\"YES\" userInteractionEnabled=\"NO\" contentMode=\"left\" horizontalHuggingPriority=\"251\" verticalHuggingPriority=\"251\" text=\"Powered by React Native\" textAlignment=\"center\" lineBreakMode=\"tailTruncation\" baselineAdjustment=\"alignBaselines\" minimumFontSize=\"9\" translatesAutoresizingMaskIntoConstraints=\"NO\" id=\"MN2-I3-ftu\">\n                                <rect key=\"frame\" x=\"0.0\" y=\"626\" width=\"375\" height=\"21\"/>\n                                <fontDescription key=\"fontDescription\" type=\"system\" pointSize=\"17\"/>\n                                <nil key=\"highlightedColor\"/>\n                            </label>\n                        </subviews>\n                        <color key=\"backgroundColor\" systemColor=\"systemBackgroundColor\" cocoaTouchSystemColor=\"whiteColor\"/>\n                        <constraints>\n                            <constraint firstItem=\"Bcu-3y-fUS\" firstAttribute=\"bottom\" secondItem=\"MN2-I3-ftu\" secondAttribute=\"bottom\" constant=\"20\" id=\"OZV-Vh-mqD\"/>\n                            <constraint firstItem=\"Bcu-3y-fUS\" firstAttribute=\"centerX\" secondItem=\"GJd-Yh-RWb\" secondAttribute=\"centerX\" id=\"Q3B-4B-g5h\"/>\n                            <constraint firstItem=\"MN2-I3-ftu\" firstAttribute=\"centerX\" secondItem=\"Bcu-3y-fUS\" secondAttribute=\"centerX\" id=\"akx-eg-2ui\"/>\n                            <constraint firstItem=\"MN2-I3-ftu\" firstAttribute=\"leading\" secondItem=\"Bcu-3y-fUS\" secondAttribute=\"leading\" id=\"i1E-0Y-4RG\"/>\n                            <constraint firstItem=\"GJd-Yh-RWb\" firstAttribute=\"centerY\" secondItem=\"Ze5-6b-2t3\" secondAttribute=\"bottom\" multiplier=\"1/3\" constant=\"1\" id=\"moa-c2-u7t\"/>\n                            <constraint firstItem=\"GJd-Yh-RWb\" firstAttribute=\"leading\" secondItem=\"Bcu-3y-fUS\" secondAttribute=\"leading\" symbolic=\"YES\" id=\"x7j-FC-K8j\"/>\n                        </constraints>\n                        <viewLayoutGuide key=\"safeArea\" id=\"Bcu-3y-fUS\"/>\n                    </view>\n                </viewController>\n                <placeholder placeholderIdentifier=\"IBFirstResponder\" id=\"iYj-Kq-Ea1\" userLabel=\"First Responder\" sceneMemberID=\"firstResponder\"/>\n            </objects>\n            <point key=\"canvasLocation\" x=\"52.173913043478265\" y=\"375\"/>\n        </scene>\n    </scenes>\n</document>\n"
  },
  {
    "path": "example/ReactNativeProject/ios/ReactNativeProject/PrivacyInfo.xcprivacy",
    "content": "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<!DOCTYPE plist PUBLIC \"-//Apple//DTD PLIST 1.0//EN\" \"http://www.apple.com/DTDs/PropertyList-1.0.dtd\">\n<plist version=\"1.0\">\n<dict>\n\t<key>NSPrivacyAccessedAPITypes</key>\n\t<array>\n\t\t<dict>\n\t\t\t<key>NSPrivacyAccessedAPIType</key>\n\t\t\t<string>NSPrivacyAccessedAPICategoryFileTimestamp</string>\n\t\t\t<key>NSPrivacyAccessedAPITypeReasons</key>\n\t\t\t<array>\n\t\t\t\t<string>C617.1</string>\n\t\t\t</array>\n\t\t</dict>\n\t\t<dict>\n\t\t\t<key>NSPrivacyAccessedAPIType</key>\n\t\t\t<string>NSPrivacyAccessedAPICategoryUserDefaults</string>\n\t\t\t<key>NSPrivacyAccessedAPITypeReasons</key>\n\t\t\t<array>\n\t\t\t\t<string>CA92.1</string>\n\t\t\t</array>\n\t\t</dict>\n\t\t<dict>\n\t\t\t<key>NSPrivacyAccessedAPIType</key>\n\t\t\t<string>NSPrivacyAccessedAPICategorySystemBootTime</string>\n\t\t\t<key>NSPrivacyAccessedAPITypeReasons</key>\n\t\t\t<array>\n\t\t\t\t<string>35F9.1</string>\n\t\t\t</array>\n\t\t</dict>\n\t</array>\n\t<key>NSPrivacyCollectedDataTypes</key>\n\t<array/>\n\t<key>NSPrivacyTracking</key>\n\t<false/>\n</dict>\n</plist>\n"
  },
  {
    "path": "example/ReactNativeProject/ios/ReactNativeProject.xcodeproj/project.pbxproj",
    "content": "// !$*UTF8*$!\n{\n\tarchiveVersion = 1;\n\tclasses = {\n\t};\n\tobjectVersion = 54;\n\tobjects = {\n\n/* Begin PBXBuildFile section */\n\t\t0C80B921A6F3F58F76C31292 /* libPods-ReactNativeProject.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 5DCACB8F33CDC322A6C60F78 /* libPods-ReactNativeProject.a */; };\n\t\t13B07FBF1A68108700A75B9A /* Images.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 13B07FB51A68108700A75B9A /* Images.xcassets */; };\n\t\t761780ED2CA45674006654EE /* AppDelegate.swift in Sources */ = {isa = PBXBuildFile; fileRef = 761780EC2CA45674006654EE /* AppDelegate.swift */; };\n\t\t81AB9BB82411601600AC10FF /* LaunchScreen.storyboard in Resources */ = {isa = PBXBuildFile; fileRef = 81AB9BB72411601600AC10FF /* LaunchScreen.storyboard */; };\n\t\t9D77CA5BE337EC21A7EE4073 /* PrivacyInfo.xcprivacy in Resources */ = {isa = PBXBuildFile; fileRef = 13B07FB81A68108700A75B9A /* PrivacyInfo.xcprivacy */; };\n/* End PBXBuildFile section */\n\n/* Begin PBXFileReference section */\n\t\t13B07F961A680F5B00A75B9A /* ReactNativeProject.app */ = {isa = PBXFileReference; explicitFileType = wrapper.application; includeInIndex = 0; path = ReactNativeProject.app; sourceTree = BUILT_PRODUCTS_DIR; };\n\t\t13B07FB51A68108700A75B9A /* Images.xcassets */ = {isa = PBXFileReference; lastKnownFileType = folder.assetcatalog; name = Images.xcassets; path = ReactNativeProject/Images.xcassets; sourceTree = \"<group>\"; };\n\t\t13B07FB61A68108700A75B9A /* Info.plist */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.plist.xml; name = Info.plist; path = ReactNativeProject/Info.plist; sourceTree = \"<group>\"; };\n\t\t13B07FB81A68108700A75B9A /* PrivacyInfo.xcprivacy */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.plist.xml; name = PrivacyInfo.xcprivacy; path = ReactNativeProject/PrivacyInfo.xcprivacy; sourceTree = \"<group>\"; };\n\t\t3B4392A12AC88292D35C810B /* Pods-ReactNativeProject.debug.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = \"Pods-ReactNativeProject.debug.xcconfig\"; path = \"Target Support Files/Pods-ReactNativeProject/Pods-ReactNativeProject.debug.xcconfig\"; sourceTree = \"<group>\"; };\n\t\t5709B34CF0A7D63546082F79 /* Pods-ReactNativeProject.release.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = \"Pods-ReactNativeProject.release.xcconfig\"; path = \"Target Support Files/Pods-ReactNativeProject/Pods-ReactNativeProject.release.xcconfig\"; sourceTree = \"<group>\"; };\n\t\t5DCACB8F33CDC322A6C60F78 /* libPods-ReactNativeProject.a */ = {isa = PBXFileReference; explicitFileType = archive.ar; includeInIndex = 0; path = \"libPods-ReactNativeProject.a\"; sourceTree = BUILT_PRODUCTS_DIR; };\n\t\t761780EC2CA45674006654EE /* AppDelegate.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; name = AppDelegate.swift; path = ReactNativeProject/AppDelegate.swift; sourceTree = \"<group>\"; };\n\t\t81AB9BB72411601600AC10FF /* LaunchScreen.storyboard */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = file.storyboard; name = LaunchScreen.storyboard; path = ReactNativeProject/LaunchScreen.storyboard; sourceTree = \"<group>\"; };\n\t\tED297162215061F000B7C4FE /* JavaScriptCore.framework */ = {isa = PBXFileReference; lastKnownFileType = wrapper.framework; name = JavaScriptCore.framework; path = System/Library/Frameworks/JavaScriptCore.framework; sourceTree = SDKROOT; };\n/* End PBXFileReference section */\n\n/* Begin PBXFrameworksBuildPhase section */\n\t\t13B07F8C1A680F5B00A75B9A /* Frameworks */ = {\n\t\t\tisa = PBXFrameworksBuildPhase;\n\t\t\tbuildActionMask = 2147483647;\n\t\t\tfiles = (\n\t\t\t\t0C80B921A6F3F58F76C31292 /* libPods-ReactNativeProject.a in Frameworks */,\n\t\t\t);\n\t\t\trunOnlyForDeploymentPostprocessing = 0;\n\t\t};\n/* End PBXFrameworksBuildPhase section */\n\n/* Begin PBXGroup section */\n\t\t13B07FAE1A68108700A75B9A /* ReactNativeProject */ = {\n\t\t\tisa = PBXGroup;\n\t\t\tchildren = (\n\t\t\t\t13B07FB51A68108700A75B9A /* Images.xcassets */,\n\t\t\t\t761780EC2CA45674006654EE /* AppDelegate.swift */,\n\t\t\t\t13B07FB61A68108700A75B9A /* Info.plist */,\n\t\t\t\t81AB9BB72411601600AC10FF /* LaunchScreen.storyboard */,\n\t\t\t\t13B07FB81A68108700A75B9A /* PrivacyInfo.xcprivacy */,\n\t\t\t);\n\t\t\tname = ReactNativeProject;\n\t\t\tsourceTree = \"<group>\";\n\t\t};\n\t\t2D16E6871FA4F8E400B85C8A /* Frameworks */ = {\n\t\t\tisa = PBXGroup;\n\t\t\tchildren = (\n\t\t\t\tED297162215061F000B7C4FE /* JavaScriptCore.framework */,\n\t\t\t\t5DCACB8F33CDC322A6C60F78 /* libPods-ReactNativeProject.a */,\n\t\t\t);\n\t\t\tname = Frameworks;\n\t\t\tsourceTree = \"<group>\";\n\t\t};\n\t\t832341AE1AAA6A7D00B99B32 /* Libraries */ = {\n\t\t\tisa = PBXGroup;\n\t\t\tchildren = (\n\t\t\t);\n\t\t\tname = Libraries;\n\t\t\tsourceTree = \"<group>\";\n\t\t};\n\t\t83CBB9F61A601CBA00E9B192 = {\n\t\t\tisa = PBXGroup;\n\t\t\tchildren = (\n\t\t\t\t13B07FAE1A68108700A75B9A /* ReactNativeProject */,\n\t\t\t\t832341AE1AAA6A7D00B99B32 /* Libraries */,\n\t\t\t\t83CBBA001A601CBA00E9B192 /* Products */,\n\t\t\t\t2D16E6871FA4F8E400B85C8A /* Frameworks */,\n\t\t\t\tBBD78D7AC51CEA395F1C20DB /* Pods */,\n\t\t\t);\n\t\t\tindentWidth = 2;\n\t\t\tsourceTree = \"<group>\";\n\t\t\ttabWidth = 2;\n\t\t\tusesTabs = 0;\n\t\t};\n\t\t83CBBA001A601CBA00E9B192 /* Products */ = {\n\t\t\tisa = PBXGroup;\n\t\t\tchildren = (\n\t\t\t\t13B07F961A680F5B00A75B9A /* ReactNativeProject.app */,\n\t\t\t);\n\t\t\tname = Products;\n\t\t\tsourceTree = \"<group>\";\n\t\t};\n\t\tBBD78D7AC51CEA395F1C20DB /* Pods */ = {\n\t\t\tisa = PBXGroup;\n\t\t\tchildren = (\n\t\t\t\t3B4392A12AC88292D35C810B /* Pods-ReactNativeProject.debug.xcconfig */,\n\t\t\t\t5709B34CF0A7D63546082F79 /* Pods-ReactNativeProject.release.xcconfig */,\n\t\t\t);\n\t\t\tpath = Pods;\n\t\t\tsourceTree = \"<group>\";\n\t\t};\n/* End PBXGroup section */\n\n/* Begin PBXNativeTarget section */\n\t\t13B07F861A680F5B00A75B9A /* ReactNativeProject */ = {\n\t\t\tisa = PBXNativeTarget;\n\t\t\tbuildConfigurationList = 13B07F931A680F5B00A75B9A /* Build configuration list for PBXNativeTarget \"ReactNativeProject\" */;\n\t\t\tbuildPhases = (\n\t\t\t\tC38B50BA6285516D6DCD4F65 /* [CP] Check Pods Manifest.lock */,\n\t\t\t\t13B07F871A680F5B00A75B9A /* Sources */,\n\t\t\t\t13B07F8C1A680F5B00A75B9A /* Frameworks */,\n\t\t\t\t13B07F8E1A680F5B00A75B9A /* Resources */,\n\t\t\t\t00DD1BFF1BD5951E006B06BC /* Bundle React Native code and images */,\n\t\t\t\t00EEFC60759A1932668264C0 /* [CP] Embed Pods Frameworks */,\n\t\t\t\tE235C05ADACE081382539298 /* [CP] Copy Pods Resources */,\n\t\t\t);\n\t\t\tbuildRules = (\n\t\t\t);\n\t\t\tdependencies = (\n\t\t\t);\n\t\t\tname = ReactNativeProject;\n\t\t\tproductName = ReactNativeProject;\n\t\t\tproductReference = 13B07F961A680F5B00A75B9A /* ReactNativeProject.app */;\n\t\t\tproductType = \"com.apple.product-type.application\";\n\t\t};\n/* End PBXNativeTarget section */\n\n/* Begin PBXProject section */\n\t\t83CBB9F71A601CBA00E9B192 /* Project object */ = {\n\t\t\tisa = PBXProject;\n\t\t\tattributes = {\n\t\t\t\tLastUpgradeCheck = 1210;\n\t\t\t\tTargetAttributes = {\n\t\t\t\t\t13B07F861A680F5B00A75B9A = {\n\t\t\t\t\t\tLastSwiftMigration = 1120;\n\t\t\t\t\t};\n\t\t\t\t};\n\t\t\t};\n\t\t\tbuildConfigurationList = 83CBB9FA1A601CBA00E9B192 /* Build configuration list for PBXProject \"ReactNativeProject\" */;\n\t\t\tcompatibilityVersion = \"Xcode 12.0\";\n\t\t\tdevelopmentRegion = en;\n\t\t\thasScannedForEncodings = 0;\n\t\t\tknownRegions = (\n\t\t\t\ten,\n\t\t\t\tBase,\n\t\t\t);\n\t\t\tmainGroup = 83CBB9F61A601CBA00E9B192;\n\t\t\tproductRefGroup = 83CBBA001A601CBA00E9B192 /* Products */;\n\t\t\tprojectDirPath = \"\";\n\t\t\tprojectRoot = \"\";\n\t\t\ttargets = (\n\t\t\t\t13B07F861A680F5B00A75B9A /* ReactNativeProject */,\n\t\t\t);\n\t\t};\n/* End PBXProject section */\n\n/* Begin PBXResourcesBuildPhase section */\n\t\t13B07F8E1A680F5B00A75B9A /* Resources */ = {\n\t\t\tisa = PBXResourcesBuildPhase;\n\t\t\tbuildActionMask = 2147483647;\n\t\t\tfiles = (\n\t\t\t\t81AB9BB82411601600AC10FF /* LaunchScreen.storyboard in Resources */,\n\t\t\t\t13B07FBF1A68108700A75B9A /* Images.xcassets in Resources */,\n\t\t\t\t9D77CA5BE337EC21A7EE4073 /* PrivacyInfo.xcprivacy in Resources */,\n\t\t\t);\n\t\t\trunOnlyForDeploymentPostprocessing = 0;\n\t\t};\n/* End PBXResourcesBuildPhase section */\n\n/* Begin PBXShellScriptBuildPhase section */\n\t\t00DD1BFF1BD5951E006B06BC /* Bundle React Native code and images */ = {\n\t\t\tisa = PBXShellScriptBuildPhase;\n\t\t\tbuildActionMask = 2147483647;\n\t\t\tfiles = (\n\t\t\t);\n\t\t\tinputPaths = (\n\t\t\t\t\"$(SRCROOT)/.xcode.env.local\",\n\t\t\t\t\"$(SRCROOT)/.xcode.env\",\n\t\t\t);\n\t\t\tname = \"Bundle React Native code and images\";\n\t\t\toutputPaths = (\n\t\t\t);\n\t\t\trunOnlyForDeploymentPostprocessing = 0;\n\t\t\tshellPath = /bin/sh;\n\t\t\tshellScript = \"set -e\\n\\nWITH_ENVIRONMENT=\\\"$REACT_NATIVE_PATH/scripts/xcode/with-environment.sh\\\"\\nREACT_NATIVE_XCODE=\\\"$REACT_NATIVE_PATH/scripts/react-native-xcode.sh\\\"\\n\\n/bin/sh -c \\\"$WITH_ENVIRONMENT $REACT_NATIVE_XCODE\\\"\\n\";\n\t\t};\n\t\t00EEFC60759A1932668264C0 /* [CP] Embed Pods Frameworks */ = {\n\t\t\tisa = PBXShellScriptBuildPhase;\n\t\t\tbuildActionMask = 2147483647;\n\t\t\tfiles = (\n\t\t\t);\n\t\t\tinputFileListPaths = (\n\t\t\t\t\"${PODS_ROOT}/Target Support Files/Pods-ReactNativeProject/Pods-ReactNativeProject-frameworks-${CONFIGURATION}-input-files.xcfilelist\",\n\t\t\t);\n\t\t\tname = \"[CP] Embed Pods Frameworks\";\n\t\t\toutputFileListPaths = (\n\t\t\t\t\"${PODS_ROOT}/Target Support Files/Pods-ReactNativeProject/Pods-ReactNativeProject-frameworks-${CONFIGURATION}-output-files.xcfilelist\",\n\t\t\t);\n\t\t\trunOnlyForDeploymentPostprocessing = 0;\n\t\t\tshellPath = /bin/sh;\n\t\t\tshellScript = \"\\\"${PODS_ROOT}/Target Support Files/Pods-ReactNativeProject/Pods-ReactNativeProject-frameworks.sh\\\"\\n\";\n\t\t\tshowEnvVarsInLog = 0;\n\t\t};\n\t\tC38B50BA6285516D6DCD4F65 /* [CP] Check Pods Manifest.lock */ = {\n\t\t\tisa = PBXShellScriptBuildPhase;\n\t\t\tbuildActionMask = 2147483647;\n\t\t\tfiles = (\n\t\t\t);\n\t\t\tinputFileListPaths = (\n\t\t\t);\n\t\t\tinputPaths = (\n\t\t\t\t\"${PODS_PODFILE_DIR_PATH}/Podfile.lock\",\n\t\t\t\t\"${PODS_ROOT}/Manifest.lock\",\n\t\t\t);\n\t\t\tname = \"[CP] Check Pods Manifest.lock\";\n\t\t\toutputFileListPaths = (\n\t\t\t);\n\t\t\toutputPaths = (\n\t\t\t\t\"$(DERIVED_FILE_DIR)/Pods-ReactNativeProject-checkManifestLockResult.txt\",\n\t\t\t);\n\t\t\trunOnlyForDeploymentPostprocessing = 0;\n\t\t\tshellPath = /bin/sh;\n\t\t\tshellScript = \"diff \\\"${PODS_PODFILE_DIR_PATH}/Podfile.lock\\\" \\\"${PODS_ROOT}/Manifest.lock\\\" > /dev/null\\nif [ $? != 0 ] ; then\\n    # print error to STDERR\\n    echo \\\"error: The sandbox is not in sync with the Podfile.lock. Run 'pod install' or update your CocoaPods installation.\\\" >&2\\n    exit 1\\nfi\\n# This output is used by Xcode 'outputs' to avoid re-running this script phase.\\necho \\\"SUCCESS\\\" > \\\"${SCRIPT_OUTPUT_FILE_0}\\\"\\n\";\n\t\t\tshowEnvVarsInLog = 0;\n\t\t};\n\t\tE235C05ADACE081382539298 /* [CP] Copy Pods Resources */ = {\n\t\t\tisa = PBXShellScriptBuildPhase;\n\t\t\tbuildActionMask = 2147483647;\n\t\t\tfiles = (\n\t\t\t);\n\t\t\tinputFileListPaths = (\n\t\t\t\t\"${PODS_ROOT}/Target Support Files/Pods-ReactNativeProject/Pods-ReactNativeProject-resources-${CONFIGURATION}-input-files.xcfilelist\",\n\t\t\t);\n\t\t\tname = \"[CP] Copy Pods Resources\";\n\t\t\toutputFileListPaths = (\n\t\t\t\t\"${PODS_ROOT}/Target Support Files/Pods-ReactNativeProject/Pods-ReactNativeProject-resources-${CONFIGURATION}-output-files.xcfilelist\",\n\t\t\t);\n\t\t\trunOnlyForDeploymentPostprocessing = 0;\n\t\t\tshellPath = /bin/sh;\n\t\t\tshellScript = \"\\\"${PODS_ROOT}/Target Support Files/Pods-ReactNativeProject/Pods-ReactNativeProject-resources.sh\\\"\\n\";\n\t\t\tshowEnvVarsInLog = 0;\n\t\t};\n/* End PBXShellScriptBuildPhase section */\n\n/* Begin PBXSourcesBuildPhase section */\n\t\t13B07F871A680F5B00A75B9A /* Sources */ = {\n\t\t\tisa = PBXSourcesBuildPhase;\n\t\t\tbuildActionMask = 2147483647;\n\t\t\tfiles = (\n\t\t\t\t761780ED2CA45674006654EE /* AppDelegate.swift in Sources */,\n\t\t\t);\n\t\t\trunOnlyForDeploymentPostprocessing = 0;\n\t\t};\n/* End PBXSourcesBuildPhase section */\n\n/* Begin XCBuildConfiguration section */\n\t\t13B07F941A680F5B00A75B9A /* Debug */ = {\n\t\t\tisa = XCBuildConfiguration;\n\t\t\tbaseConfigurationReference = 3B4392A12AC88292D35C810B /* Pods-ReactNativeProject.debug.xcconfig */;\n\t\t\tbuildSettings = {\n\t\t\t\tASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;\n\t\t\t\tCLANG_ENABLE_MODULES = YES;\n\t\t\t\tCURRENT_PROJECT_VERSION = 1;\n\t\t\t\tENABLE_BITCODE = NO;\n\t\t\t\tINFOPLIST_FILE = ReactNativeProject/Info.plist;\n\t\t\t\tIPHONEOS_DEPLOYMENT_TARGET = 15.1;\n\t\t\t\tLD_RUNPATH_SEARCH_PATHS = (\n\t\t\t\t\t\"$(inherited)\",\n\t\t\t\t\t\"@executable_path/Frameworks\",\n\t\t\t\t);\n\t\t\t\tMARKETING_VERSION = 1.0;\n\t\t\t\tOTHER_LDFLAGS = (\n\t\t\t\t\t\"$(inherited)\",\n\t\t\t\t\t\"-ObjC\",\n\t\t\t\t\t\"-lc++\",\n\t\t\t\t);\n\t\t\t\tPRODUCT_BUNDLE_IDENTIFIER = \"org.reactjs.native.example.$(PRODUCT_NAME:rfc1034identifier)\";\n\t\t\t\tPRODUCT_NAME = ReactNativeProject;\n\t\t\t\tSWIFT_OPTIMIZATION_LEVEL = \"-Onone\";\n\t\t\t\tSWIFT_VERSION = 5.0;\n\t\t\t\tVERSIONING_SYSTEM = \"apple-generic\";\n\t\t\t};\n\t\t\tname = Debug;\n\t\t};\n\t\t13B07F951A680F5B00A75B9A /* Release */ = {\n\t\t\tisa = XCBuildConfiguration;\n\t\t\tbaseConfigurationReference = 5709B34CF0A7D63546082F79 /* Pods-ReactNativeProject.release.xcconfig */;\n\t\t\tbuildSettings = {\n\t\t\t\tASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;\n\t\t\t\tCLANG_ENABLE_MODULES = YES;\n\t\t\t\tCURRENT_PROJECT_VERSION = 1;\n\t\t\t\tINFOPLIST_FILE = ReactNativeProject/Info.plist;\n\t\t\t\tIPHONEOS_DEPLOYMENT_TARGET = 15.1;\n\t\t\t\tLD_RUNPATH_SEARCH_PATHS = (\n\t\t\t\t\t\"$(inherited)\",\n\t\t\t\t\t\"@executable_path/Frameworks\",\n\t\t\t\t);\n\t\t\t\tMARKETING_VERSION = 1.0;\n\t\t\t\tOTHER_LDFLAGS = (\n\t\t\t\t\t\"$(inherited)\",\n\t\t\t\t\t\"-ObjC\",\n\t\t\t\t\t\"-lc++\",\n\t\t\t\t);\n\t\t\t\tPRODUCT_BUNDLE_IDENTIFIER = \"org.reactjs.native.example.$(PRODUCT_NAME:rfc1034identifier)\";\n\t\t\t\tPRODUCT_NAME = ReactNativeProject;\n\t\t\t\tSWIFT_VERSION = 5.0;\n\t\t\t\tVERSIONING_SYSTEM = \"apple-generic\";\n\t\t\t};\n\t\t\tname = Release;\n\t\t};\n\t\t83CBBA201A601CBA00E9B192 /* Debug */ = {\n\t\t\tisa = XCBuildConfiguration;\n\t\t\tbuildSettings = {\n\t\t\t\tALWAYS_SEARCH_USER_PATHS = NO;\n\t\t\t\tCLANG_ANALYZER_LOCALIZABILITY_NONLOCALIZED = YES;\n\t\t\t\tCLANG_CXX_LANGUAGE_STANDARD = \"c++20\";\n\t\t\t\tCLANG_CXX_LIBRARY = \"libc++\";\n\t\t\t\tCLANG_ENABLE_MODULES = YES;\n\t\t\t\tCLANG_ENABLE_OBJC_ARC = YES;\n\t\t\t\tCLANG_WARN_BLOCK_CAPTURE_AUTORELEASING = YES;\n\t\t\t\tCLANG_WARN_BOOL_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_COMMA = YES;\n\t\t\t\tCLANG_WARN_CONSTANT_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_DEPRECATED_OBJC_IMPLEMENTATIONS = YES;\n\t\t\t\tCLANG_WARN_DIRECT_OBJC_ISA_USAGE = YES_ERROR;\n\t\t\t\tCLANG_WARN_EMPTY_BODY = YES;\n\t\t\t\tCLANG_WARN_ENUM_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_INFINITE_RECURSION = YES;\n\t\t\t\tCLANG_WARN_INT_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_NON_LITERAL_NULL_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_OBJC_IMPLICIT_RETAIN_SELF = YES;\n\t\t\t\tCLANG_WARN_OBJC_LITERAL_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_OBJC_ROOT_CLASS = YES_ERROR;\n\t\t\t\tCLANG_WARN_QUOTED_INCLUDE_IN_FRAMEWORK_HEADER = YES;\n\t\t\t\tCLANG_WARN_RANGE_LOOP_ANALYSIS = YES;\n\t\t\t\tCLANG_WARN_STRICT_PROTOTYPES = YES;\n\t\t\t\tCLANG_WARN_SUSPICIOUS_MOVE = YES;\n\t\t\t\tCLANG_WARN_UNREACHABLE_CODE = YES;\n\t\t\t\tCLANG_WARN__DUPLICATE_METHOD_MATCH = YES;\n\t\t\t\t\"CODE_SIGN_IDENTITY[sdk=iphoneos*]\" = \"iPhone Developer\";\n\t\t\t\tCOPY_PHASE_STRIP = NO;\n\t\t\t\tENABLE_STRICT_OBJC_MSGSEND = YES;\n\t\t\t\tENABLE_TESTABILITY = YES;\n\t\t\t\t\"EXCLUDED_ARCHS[sdk=iphonesimulator*]\" = \"\";\n\t\t\t\tGCC_C_LANGUAGE_STANDARD = gnu99;\n\t\t\t\tGCC_DYNAMIC_NO_PIC = NO;\n\t\t\t\tGCC_NO_COMMON_BLOCKS = YES;\n\t\t\t\tGCC_OPTIMIZATION_LEVEL = 0;\n\t\t\t\tGCC_PREPROCESSOR_DEFINITIONS = (\n\t\t\t\t\t\"DEBUG=1\",\n\t\t\t\t\t\"$(inherited)\",\n\t\t\t\t);\n\t\t\t\tGCC_SYMBOLS_PRIVATE_EXTERN = NO;\n\t\t\t\tGCC_WARN_64_TO_32_BIT_CONVERSION = YES;\n\t\t\t\tGCC_WARN_ABOUT_RETURN_TYPE = YES_ERROR;\n\t\t\t\tGCC_WARN_UNDECLARED_SELECTOR = YES;\n\t\t\t\tGCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE;\n\t\t\t\tGCC_WARN_UNUSED_FUNCTION = YES;\n\t\t\t\tGCC_WARN_UNUSED_VARIABLE = YES;\n\t\t\t\tIPHONEOS_DEPLOYMENT_TARGET = 15.1;\n\t\t\t\tLD_RUNPATH_SEARCH_PATHS = (\n\t\t\t\t\t/usr/lib/swift,\n\t\t\t\t\t\"$(inherited)\",\n\t\t\t\t);\n\t\t\t\tLIBRARY_SEARCH_PATHS = (\n\t\t\t\t\t\"\\\"$(SDKROOT)/usr/lib/swift\\\"\",\n\t\t\t\t\t\"\\\"$(TOOLCHAIN_DIR)/usr/lib/swift/$(PLATFORM_NAME)\\\"\",\n\t\t\t\t\t\"\\\"$(inherited)\\\"\",\n\t\t\t\t);\n\t\t\t\tMTL_ENABLE_DEBUG_INFO = YES;\n\t\t\t\tONLY_ACTIVE_ARCH = YES;\n\t\t\t\tOTHER_CPLUSPLUSFLAGS = (\n\t\t\t\t\t\"$(OTHER_CFLAGS)\",\n\t\t\t\t\t\"-DFOLLY_NO_CONFIG\",\n\t\t\t\t\t\"-DFOLLY_MOBILE=1\",\n\t\t\t\t\t\"-DFOLLY_USE_LIBCPP=1\",\n\t\t\t\t\t\"-DFOLLY_CFG_NO_COROUTINES=1\",\n\t\t\t\t\t\"-DFOLLY_HAVE_CLOCK_GETTIME=1\",\n\t\t\t\t);\n\t\t\t\tOTHER_LDFLAGS = (\n\t\t\t\t\t\"$(inherited)\",\n\t\t\t\t\t\" \",\n\t\t\t\t);\n\t\t\t\tREACT_NATIVE_PATH = \"${PODS_ROOT}/../../node_modules/react-native\";\n\t\t\t\tSDKROOT = iphoneos;\n\t\t\t\tSWIFT_ACTIVE_COMPILATION_CONDITIONS = \"$(inherited) DEBUG\";\n\t\t\t\tUSE_HERMES = true;\n\t\t\t};\n\t\t\tname = Debug;\n\t\t};\n\t\t83CBBA211A601CBA00E9B192 /* Release */ = {\n\t\t\tisa = XCBuildConfiguration;\n\t\t\tbuildSettings = {\n\t\t\t\tALWAYS_SEARCH_USER_PATHS = NO;\n\t\t\t\tCLANG_ANALYZER_LOCALIZABILITY_NONLOCALIZED = YES;\n\t\t\t\tCLANG_CXX_LANGUAGE_STANDARD = \"c++20\";\n\t\t\t\tCLANG_CXX_LIBRARY = \"libc++\";\n\t\t\t\tCLANG_ENABLE_MODULES = YES;\n\t\t\t\tCLANG_ENABLE_OBJC_ARC = YES;\n\t\t\t\tCLANG_WARN_BLOCK_CAPTURE_AUTORELEASING = YES;\n\t\t\t\tCLANG_WARN_BOOL_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_COMMA = YES;\n\t\t\t\tCLANG_WARN_CONSTANT_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_DEPRECATED_OBJC_IMPLEMENTATIONS = YES;\n\t\t\t\tCLANG_WARN_DIRECT_OBJC_ISA_USAGE = YES_ERROR;\n\t\t\t\tCLANG_WARN_EMPTY_BODY = YES;\n\t\t\t\tCLANG_WARN_ENUM_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_INFINITE_RECURSION = YES;\n\t\t\t\tCLANG_WARN_INT_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_NON_LITERAL_NULL_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_OBJC_IMPLICIT_RETAIN_SELF = YES;\n\t\t\t\tCLANG_WARN_OBJC_LITERAL_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_OBJC_ROOT_CLASS = YES_ERROR;\n\t\t\t\tCLANG_WARN_QUOTED_INCLUDE_IN_FRAMEWORK_HEADER = YES;\n\t\t\t\tCLANG_WARN_RANGE_LOOP_ANALYSIS = YES;\n\t\t\t\tCLANG_WARN_STRICT_PROTOTYPES = YES;\n\t\t\t\tCLANG_WARN_SUSPICIOUS_MOVE = YES;\n\t\t\t\tCLANG_WARN_UNREACHABLE_CODE = YES;\n\t\t\t\tCLANG_WARN__DUPLICATE_METHOD_MATCH = YES;\n\t\t\t\t\"CODE_SIGN_IDENTITY[sdk=iphoneos*]\" = \"iPhone Developer\";\n\t\t\t\tCOPY_PHASE_STRIP = YES;\n\t\t\t\tENABLE_NS_ASSERTIONS = NO;\n\t\t\t\tENABLE_STRICT_OBJC_MSGSEND = YES;\n\t\t\t\t\"EXCLUDED_ARCHS[sdk=iphonesimulator*]\" = \"\";\n\t\t\t\tGCC_C_LANGUAGE_STANDARD = gnu99;\n\t\t\t\tGCC_NO_COMMON_BLOCKS = YES;\n\t\t\t\tGCC_WARN_64_TO_32_BIT_CONVERSION = YES;\n\t\t\t\tGCC_WARN_ABOUT_RETURN_TYPE = YES_ERROR;\n\t\t\t\tGCC_WARN_UNDECLARED_SELECTOR = YES;\n\t\t\t\tGCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE;\n\t\t\t\tGCC_WARN_UNUSED_FUNCTION = YES;\n\t\t\t\tGCC_WARN_UNUSED_VARIABLE = YES;\n\t\t\t\tIPHONEOS_DEPLOYMENT_TARGET = 15.1;\n\t\t\t\tLD_RUNPATH_SEARCH_PATHS = (\n\t\t\t\t\t/usr/lib/swift,\n\t\t\t\t\t\"$(inherited)\",\n\t\t\t\t);\n\t\t\t\tLIBRARY_SEARCH_PATHS = (\n\t\t\t\t\t\"\\\"$(SDKROOT)/usr/lib/swift\\\"\",\n\t\t\t\t\t\"\\\"$(TOOLCHAIN_DIR)/usr/lib/swift/$(PLATFORM_NAME)\\\"\",\n\t\t\t\t\t\"\\\"$(inherited)\\\"\",\n\t\t\t\t);\n\t\t\t\tMTL_ENABLE_DEBUG_INFO = NO;\n\t\t\t\tOTHER_CPLUSPLUSFLAGS = (\n\t\t\t\t\t\"$(OTHER_CFLAGS)\",\n\t\t\t\t\t\"-DFOLLY_NO_CONFIG\",\n\t\t\t\t\t\"-DFOLLY_MOBILE=1\",\n\t\t\t\t\t\"-DFOLLY_USE_LIBCPP=1\",\n\t\t\t\t\t\"-DFOLLY_CFG_NO_COROUTINES=1\",\n\t\t\t\t\t\"-DFOLLY_HAVE_CLOCK_GETTIME=1\",\n\t\t\t\t);\n\t\t\t\tOTHER_LDFLAGS = (\n\t\t\t\t\t\"$(inherited)\",\n\t\t\t\t\t\" \",\n\t\t\t\t);\n\t\t\t\tREACT_NATIVE_PATH = \"${PODS_ROOT}/../../node_modules/react-native\";\n\t\t\t\tSDKROOT = iphoneos;\n\t\t\t\tUSE_HERMES = true;\n\t\t\t\tVALIDATE_PRODUCT = YES;\n\t\t\t};\n\t\t\tname = Release;\n\t\t};\n/* End XCBuildConfiguration section */\n\n/* Begin XCConfigurationList section */\n\t\t13B07F931A680F5B00A75B9A /* Build configuration list for PBXNativeTarget \"ReactNativeProject\" */ = {\n\t\t\tisa = XCConfigurationList;\n\t\t\tbuildConfigurations = (\n\t\t\t\t13B07F941A680F5B00A75B9A /* Debug */,\n\t\t\t\t13B07F951A680F5B00A75B9A /* Release */,\n\t\t\t);\n\t\t\tdefaultConfigurationIsVisible = 0;\n\t\t\tdefaultConfigurationName = Release;\n\t\t};\n\t\t83CBB9FA1A601CBA00E9B192 /* Build configuration list for PBXProject \"ReactNativeProject\" */ = {\n\t\t\tisa = XCConfigurationList;\n\t\t\tbuildConfigurations = (\n\t\t\t\t83CBBA201A601CBA00E9B192 /* Debug */,\n\t\t\t\t83CBBA211A601CBA00E9B192 /* Release */,\n\t\t\t);\n\t\t\tdefaultConfigurationIsVisible = 0;\n\t\t\tdefaultConfigurationName = Release;\n\t\t};\n/* End XCConfigurationList section */\n\t};\n\trootObject = 83CBB9F71A601CBA00E9B192 /* Project object */;\n}\n"
  },
  {
    "path": "example/ReactNativeProject/ios/ReactNativeProject.xcodeproj/xcshareddata/xcschemes/ReactNativeProject.xcscheme",
    "content": "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<Scheme\n   LastUpgradeVersion = \"1210\"\n   version = \"1.3\">\n   <BuildAction\n      parallelizeBuildables = \"YES\"\n      buildImplicitDependencies = \"YES\">\n      <BuildActionEntries>\n         <BuildActionEntry\n            buildForTesting = \"YES\"\n            buildForRunning = \"YES\"\n            buildForProfiling = \"YES\"\n            buildForArchiving = \"YES\"\n            buildForAnalyzing = \"YES\">\n            <BuildableReference\n               BuildableIdentifier = \"primary\"\n               BlueprintIdentifier = \"13B07F861A680F5B00A75B9A\"\n               BuildableName = \"ReactNativeProject.app\"\n               BlueprintName = \"ReactNativeProject\"\n               ReferencedContainer = \"container:ReactNativeProject.xcodeproj\">\n            </BuildableReference>\n         </BuildActionEntry>\n      </BuildActionEntries>\n   </BuildAction>\n   <TestAction\n      buildConfiguration = \"Debug\"\n      selectedDebuggerIdentifier = \"Xcode.DebuggerFoundation.Debugger.LLDB\"\n      selectedLauncherIdentifier = \"Xcode.DebuggerFoundation.Launcher.LLDB\"\n      shouldUseLaunchSchemeArgsEnv = \"YES\">\n      <Testables>\n         <TestableReference\n            skipped = \"NO\">\n            <BuildableReference\n               BuildableIdentifier = \"primary\"\n               BlueprintIdentifier = \"00E356ED1AD99517003FC87E\"\n               BuildableName = \"ReactNativeProjectTests.xctest\"\n               BlueprintName = \"ReactNativeProjectTests\"\n               ReferencedContainer = \"container:ReactNativeProject.xcodeproj\">\n            </BuildableReference>\n         </TestableReference>\n      </Testables>\n   </TestAction>\n   <LaunchAction\n      buildConfiguration = \"Debug\"\n      selectedDebuggerIdentifier = \"Xcode.DebuggerFoundation.Debugger.LLDB\"\n      selectedLauncherIdentifier = \"Xcode.DebuggerFoundation.Launcher.LLDB\"\n      launchStyle = \"0\"\n      useCustomWorkingDirectory = \"NO\"\n      ignoresPersistentStateOnLaunch = \"NO\"\n      debugDocumentVersioning = \"YES\"\n      debugServiceExtension = \"internal\"\n      allowLocationSimulation = \"YES\">\n      <BuildableProductRunnable\n         runnableDebuggingMode = \"0\">\n         <BuildableReference\n            BuildableIdentifier = \"primary\"\n            BlueprintIdentifier = \"13B07F861A680F5B00A75B9A\"\n            BuildableName = \"ReactNativeProject.app\"\n            BlueprintName = \"ReactNativeProject\"\n            ReferencedContainer = \"container:ReactNativeProject.xcodeproj\">\n         </BuildableReference>\n      </BuildableProductRunnable>\n   </LaunchAction>\n   <ProfileAction\n      buildConfiguration = \"Release\"\n      shouldUseLaunchSchemeArgsEnv = \"YES\"\n      savedToolIdentifier = \"\"\n      useCustomWorkingDirectory = \"NO\"\n      debugDocumentVersioning = \"YES\">\n      <BuildableProductRunnable\n         runnableDebuggingMode = \"0\">\n         <BuildableReference\n            BuildableIdentifier = \"primary\"\n            BlueprintIdentifier = \"13B07F861A680F5B00A75B9A\"\n            BuildableName = \"ReactNativeProject.app\"\n            BlueprintName = \"ReactNativeProject\"\n            ReferencedContainer = \"container:ReactNativeProject.xcodeproj\">\n         </BuildableReference>\n      </BuildableProductRunnable>\n   </ProfileAction>\n   <AnalyzeAction\n      buildConfiguration = \"Debug\">\n   </AnalyzeAction>\n   <ArchiveAction\n      buildConfiguration = \"Release\"\n      revealArchiveInOrganizer = \"YES\">\n   </ArchiveAction>\n</Scheme>\n"
  },
  {
    "path": "example/ReactNativeProject/ios/ReactNativeProject.xcworkspace/contents.xcworkspacedata",
    "content": "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<Workspace\n   version = \"1.0\">\n   <FileRef\n      location = \"group:ReactNativeProject.xcodeproj\">\n   </FileRef>\n   <FileRef\n      location = \"group:Pods/Pods.xcodeproj\">\n   </FileRef>\n</Workspace>\n"
  },
  {
    "path": "example/ReactNativeProject/jest.config.js",
    "content": "module.exports = {\n  preset: 'react-native',\n};\n"
  },
  {
    "path": "example/ReactNativeProject/locales/de/translation.json",
    "content": "{\n  \"description\": {\n    \"part1\": \"Um loszulegen, ändere <1>src/App(DE).js</1> speichern und neu laden.\",\n    \"part2\": \"Ändere die Sprachen zwischen deutsch und englisch mit Hilfe der beiden Buttons.\"\n  },\n  \"new\": {\n    \"key\": \"Dies wird automatisch hinzugefügt\"\n  },\n  \"title\": \"Willkommen zu React\"\n}\n"
  },
  {
    "path": "example/ReactNativeProject/locales/en/translation.json",
    "content": "{\n  \"description\": {\n    \"part1\": \"To get started, edit <1>src/App.js</1> and save to reload.\",\n    \"part2\": \"Switch language between english and german using buttons above.\"\n  },\n  \"new\": {\n    \"key\": \"This will be added automatically!!!\"\n  },\n  \"title\": \"Welcome to React\"\n}\n"
  },
  {
    "path": "example/ReactNativeProject/metro.config.js",
    "content": "const {getDefaultConfig, mergeConfig} = require('@react-native/metro-config');\n\n/**\n * Metro configuration\n * https://reactnative.dev/docs/metro\n *\n * @type {import('@react-native/metro-config').MetroConfig}\n */\nconst config = {};\n\nmodule.exports = mergeConfig(getDefaultConfig(__dirname), config);\n"
  },
  {
    "path": "example/ReactNativeProject/package.json",
    "content": "{\n  \"name\": \"ReactNativeProject\",\n  \"version\": \"0.0.1\",\n  \"private\": true,\n  \"scripts\": {\n    \"android\": \"react-native run-android\",\n    \"ios\": \"react-native run-ios\",\n    \"lint\": \"eslint .\",\n    \"start\": \"react-native start\",\n    \"test\": \"jest\"\n  },\n  \"dependencies\": {\n    \"@os-team/i18next-react-native-language-detector\": \"1.1.6\",\n    \"i18next\": \"25.1.1\",\n    \"intl-pluralrules\": \"2.0.1\",\n    \"react\": \"19.0.0\",\n    \"react-i18next\": \"15.5.1\",\n    \"react-native\": \"0.79.2\",\n    \"react-native-localize\": \"3.4.1\"\n  },\n  \"devDependencies\": {\n    \"@babel/core\": \"^7.25.2\",\n    \"@babel/preset-env\": \"^7.25.3\",\n    \"@babel/runtime\": \"^7.25.0\",\n    \"@react-native-community/cli\": \"18.0.0\",\n    \"@react-native-community/cli-platform-android\": \"18.0.0\",\n    \"@react-native-community/cli-platform-ios\": \"18.0.0\",\n    \"@react-native/babel-preset\": \"0.79.2\",\n    \"@react-native/eslint-config\": \"0.79.2\",\n    \"@react-native/metro-config\": \"0.79.2\",\n    \"@react-native/typescript-config\": \"0.79.2\",\n    \"@types/jest\": \"^29.5.13\",\n    \"@types/react\": \"^19.0.0\",\n    \"@types/react-test-renderer\": \"^19.0.0\",\n    \"eslint\": \"^8.19.0\",\n    \"jest\": \"^29.6.3\",\n    \"prettier\": \"2.8.8\",\n    \"react-test-renderer\": \"19.0.0\",\n    \"typescript\": \"5.0.4\"\n  },\n  \"engines\": {\n    \"node\": \">=18\"\n  }\n}\n"
  },
  {
    "path": "example/ReactNativeProject/tsconfig.json",
    "content": "{\n  \"extends\": \"@react-native/typescript-config/tsconfig.json\"\n}\n"
  },
  {
    "path": "example/devserver-save-missing/.gitignore",
    "content": "# See https://help.github.com/ignore-files/ for more about ignoring files.\n\n# dependencies\n/node_modules\n\n# testing\n/coverage\n\n# production\n/build\n\n# misc\n.DS_Store\n.env.local\n.env.development.local\n.env.test.local\n.env.production.local\n\nnpm-debug.log*\nyarn-debug.log*\nyarn-error.log*\n"
  },
  {
    "path": "example/devserver-save-missing/README.md",
    "content": "example using web-dev-server to save missing translations\n"
  },
  {
    "path": "example/devserver-save-missing/config-overrides.js",
    "content": "const i18next = require('i18next');\nconst Backend = require('i18next-fs-backend');\nconst i18nextMiddleware = require('i18next-http-middleware');\nconst bodyParser = require('body-parser');\n\ni18next\n  .use(Backend)\n  .use(i18nextMiddleware.LanguageDetector)\n  .init({\n    backend: {\n      loadPath: __dirname + '/public/locales/{{lng}}/{{ns}}.json',\n      addPath: __dirname + '/public/locales/{{lng}}/{{ns}}.missing.json',\n    },\n    fallbackLng: 'en',\n    // debug: true,\n    saveMissing: true,\n  });\n\nmodule.exports = {\n  devServer: (configFunction) => (proxy, allowedHost) => {\n    const config = configFunction(proxy, allowedHost);\n    config.setupMiddlewares = (middlewares, devServer) => {\n      if (!devServer) throw new Error('webpack-dev-server is not defined');\n\n      devServer.app.post(\n        '/locales/:lng/:ns',\n        bodyParser.json(),\n        i18nextMiddleware.missingKeyHandler(i18next),\n      );\n      // addPath for client: http://localhost:3000/locales/{{lng}}/{{ns}}\n\n      return middlewares;\n    };\n    return config;\n  },\n};\n"
  },
  {
    "path": "example/devserver-save-missing/package.json",
    "content": "{\n  \"name\": \"react_usinghooks\",\n  \"version\": \"0.1.0\",\n  \"private\": true,\n  \"dependencies\": {\n    \"body-parser\": \"^1.20.2\",\n    \"i18next\": \"^23.12.3\",\n    \"i18next-browser-languagedetector\": \"^8.0.0\",\n    \"i18next-fs-backend\": \"^2.3.2\",\n    \"i18next-http-backend\": \"^2.5.2\",\n    \"i18next-http-middleware\": \"^3.6.0\",\n    \"react\": \"^18.3.1\",\n    \"react-app-rewired\": \"^2.2.1\",\n    \"react-dom\": \"^18.3.1\",\n    \"react-i18next\": \"^15.0.1\",\n    \"react-scripts\": \"^5.0.1\"\n  },\n  \"scripts\": {\n    \"start\": \"react-app-rewired start\",\n    \"build\": \"react-app-rewired build\",\n    \"test\": \"react-app-rewired test --env=jsdom\",\n    \"eject\": \"react-scripts eject\"\n  },\n  \"eslintConfig\": {\n    \"extends\": [\n      \"react-app\",\n      \"react-app/jest\"\n    ]\n  },\n  \"browserslist\": {\n    \"development\": [\n      \"last 2 chrome versions\",\n      \"last 2 firefox versions\",\n      \"last 2 edge versions\"\n    ],\n    \"production\": [\n      \">1%\",\n      \"last 4 versions\",\n      \"Firefox ESR\",\n      \"not ie < 11\"\n    ]\n  }\n}\n"
  },
  {
    "path": "example/devserver-save-missing/public/index.html",
    "content": "<!doctype html>\n<html lang=\"en\">\n  <head>\n    <meta charset=\"utf-8\" />\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\" />\n    <meta name=\"theme-color\" content=\"#000000\" />\n    <!--\n      manifest.json provides metadata used when your web app is added to the\n      homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/\n    -->\n    <link rel=\"manifest\" href=\"%PUBLIC_URL%/manifest.json\" />\n    <link rel=\"shortcut icon\" href=\"%PUBLIC_URL%/favicon.ico\" />\n    <!--\n      Notice the use of %PUBLIC_URL% in the tags above.\n      It will be replaced with the URL of the `public` folder during the build.\n      Only files inside the `public` folder can be referenced from the HTML.\n\n      Unlike \"/favicon.ico\" or \"favicon.ico\", \"%PUBLIC_URL%/favicon.ico\" will\n      work correctly both with client-side routing and a non-root public URL.\n      Learn how to configure a non-root public URL by running `npm run build`.\n    -->\n    <title>React App</title>\n  </head>\n  <body>\n    <noscript>You need to enable JavaScript to run this app.</noscript>\n    <div id=\"root\"></div>\n    <!--\n      This HTML file is a template.\n      If you open it directly in the browser, you will see an empty page.\n\n      You can add webfonts, meta tags, or analytics to this file.\n      The build step will place the bundled scripts into the <body> tag.\n\n      To begin the development, run `npm start` or `yarn start`.\n      To create a production bundle, use `npm run build` or `yarn build`.\n    -->\n  </body>\n</html>\n"
  },
  {
    "path": "example/devserver-save-missing/public/locales/de/translation.json",
    "content": "{\n  \"title\": \"Willkommen zu react und react-i18next\",\n  \"description\": {\n    \"part1\": \"Um loszulegen, ändere <1>src/App(DE).js</1> und speichere um neuzuladen.\",\n    \"part2\": \"Wechsle die Sprache zwischen deutsch und englisch mit Hilfe der beiden Schalter.\"\n  }\n}\n"
  },
  {
    "path": "example/devserver-save-missing/public/locales/en/translation.json",
    "content": "{\n  \"title\": \"Welcome to react using react-i18next\",\n  \"description\": {\n    \"part1\": \"To get started, edit <1>src/App.js</1> and save to reload.\",\n    \"part2\": \"Switch language between english and german using buttons above.\"\n  }\n}\n"
  },
  {
    "path": "example/devserver-save-missing/public/manifest.json",
    "content": "{\n  \"short_name\": \"React App\",\n  \"name\": \"Create React App Sample\",\n  \"icons\": [\n    {\n      \"src\": \"favicon.ico\",\n      \"sizes\": \"192x192\",\n      \"type\": \"image/png\"\n    }\n  ],\n  \"start_url\": \"./index.html\",\n  \"display\": \"standalone\",\n  \"theme_color\": \"#000000\",\n  \"background_color\": \"#ffffff\"\n}\n"
  },
  {
    "path": "example/devserver-save-missing/src/App.css",
    "content": ".App {\n  text-align: center;\n}\n\n.App-logo {\n  animation: App-logo-spin infinite 20s linear;\n  height: 80px;\n}\n\n.App-header {\n  background-color: #222;\n  height: 150px;\n  padding: 20px;\n  color: white;\n}\n\n.App-intro {\n  font-size: large;\n}\n\n@keyframes App-logo-spin {\n  from {\n    transform: rotate(0deg);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n}\n"
  },
  {
    "path": "example/devserver-save-missing/src/App.js",
    "content": "import React, { Component, Suspense } from 'react';\nimport { useTranslation, withTranslation, Trans } from 'react-i18next';\nimport logo from './logo.svg';\nimport './App.css';\n\n// use hoc for class based components\nclass LegacyWelcomeClass extends Component {\n  render() {\n    const { t } = this.props;\n    return <h2>{t('title')}</h2>;\n  }\n}\nconst Welcome = withTranslation()(LegacyWelcomeClass);\n\n// Component using the Trans component\nfunction MyComponent() {\n  return (\n    <Trans i18nKey=\"description.part1\">\n      To get started, edit <code>src/App.js</code> and save to reload.\n    </Trans>\n  );\n}\n\n// page uses the hook\nfunction Page() {\n  const { t, i18n } = useTranslation();\n\n  const changeLanguage = (lng) => {\n    i18n.changeLanguage(lng);\n  };\n\n  return (\n    <div className=\"App\">\n      <div className=\"App-header\">\n        <img src={logo} className=\"App-logo\" alt=\"logo\" />\n        <Welcome />\n        <button type=\"button\" onClick={() => changeLanguage('de')}>\n          de\n        </button>\n        <button type=\"button\" onClick={() => changeLanguage('en')}>\n          en\n        </button>\n      </div>\n      <div className=\"App-intro\">\n        <MyComponent />\n      </div>\n      <div>{t('description.part2')}</div>\n      <div>{t('description.part3', 'some new translations....')}</div>\n    </div>\n  );\n}\n\n// loading component for suspense fallback\nconst Loader = () => (\n  <div className=\"App\">\n    <img src={logo} className=\"App-logo\" alt=\"logo\" />\n    <div>loading...</div>\n  </div>\n);\n\n// here app catches the suspense from page in case translations are not yet loaded\nexport default function App() {\n  return (\n    <Suspense fallback={<Loader />}>\n      <Page />\n    </Suspense>\n  );\n}\n"
  },
  {
    "path": "example/devserver-save-missing/src/i18n.js",
    "content": "import i18n from 'i18next';\nimport Backend from 'i18next-http-backend';\nimport LanguageDetector from 'i18next-browser-languagedetector';\nimport { initReactI18next } from 'react-i18next';\n\ni18n\n  // load translation using http -> see /public/locales\n  // learn more: https://github.com/i18next/i18next-http-backend\n  .use(Backend)\n  // detect user language\n  // learn more: https://github.com/i18next/i18next-browser-languageDetector\n  .use(LanguageDetector)\n  // pass the i18n instance to react-i18next.\n  .use(initReactI18next)\n  // init i18next\n  // for all options read: https://www.i18next.com/overview/configuration-options\n  .init({\n    fallbackLng: 'en',\n    debug: true,\n\n    interpolation: {\n      escapeValue: false, // not needed for react as it escapes by default\n    },\n    saveMissing: true,\n    backend: {\n      addPath: 'http://localhost:3000/locales/{{lng}}/{{ns}}',\n    },\n  });\n\nexport default i18n;\n"
  },
  {
    "path": "example/devserver-save-missing/src/index.css",
    "content": "body {\n  margin: 0;\n  padding: 0;\n  font-family: sans-serif;\n}\n"
  },
  {
    "path": "example/devserver-save-missing/src/index.js",
    "content": "import React from 'react';\nimport { createRoot } from 'react-dom/client';\nimport './index.css';\nimport App from './App';\n\n// import i18n (needs to be bundled ;))\nimport './i18n';\n\nconst root = createRoot(document.getElementById('root'));\nroot.render(\n  <React.StrictMode>\n    <App />\n  </React.StrictMode>,\n);\n"
  },
  {
    "path": "example/devserver-save-missing/webpack.config.js",
    "content": "module.exports = {\n  // ...\n  devServer: {\n    setupMiddlewares: (middlewares, devServer) => {\n      if (!devServer) {\n        throw new Error('webpack-dev-server is not defined');\n      }\n\n      devServer.app.get('/setup-middleware/some/path', (_, response) => {\n        response.send('setup-middlewares option GET');\n      });\n\n      // Use the `unshift` method if you want to run a middleware before all other middlewares\n      // or when you are migrating from the `onBeforeSetupMiddleware` option\n      middlewares.unshift({\n        name: 'first-in-array',\n        // `path` is optional\n        path: '/foo/path',\n        middleware: (req, res) => {\n          res.send('Foo!');\n        },\n      });\n\n      // Use the `push` method if you want to run a middleware after all other middlewares\n      // or when you are migrating from the `onAfterSetupMiddleware` option\n      middlewares.push({\n        name: 'hello-world-test-one',\n        // `path` is optional\n        path: '/foo/bar',\n        middleware: (req, res) => {\n          res.send('Foo Bar!');\n        },\n      });\n\n      middlewares.push((req, res) => {\n        res.send('Hello World!');\n      });\n\n      return middlewares;\n    },\n  },\n};\n"
  },
  {
    "path": "example/locize/.eslintrc.js",
    "content": "module.exports = {\n  root: true,\n};\n"
  },
  {
    "path": "example/locize/.gitignore",
    "content": "# See https://help.github.com/ignore-files/ for more about ignoring files.\n\n# dependencies\n/node_modules\n\n# testing\n/coverage\n\n# production\n/build\n\n# misc\n.DS_Store\n.env.local\n.env.development.local\n.env.test.local\n.env.production.local\n\nnpm-debug.log*\nyarn-debug.log*\nyarn-error.log*\n.eslintcache"
  },
  {
    "path": "example/locize/README.md",
    "content": "**A step by step tutorial can also be found [here](https://github.com/locize/react-tutorial).**\n\nThis project was bootstrapped with [Create React App](https://github.com/facebookincubator/create-react-app).\n\n[![video](video_sample.png)](https://youtu.be/osScyaGMVqo)\n[watch the video](https://youtu.be/osScyaGMVqo)\n\n[![video](video_sample_old.png)](https://www.youtube.com/watch?v=9NOzJhgmyQE)\n[watch the video (old client)](https://www.youtube.com/watch?v=9NOzJhgmyQE)\n\n## using with locize\n\nWe added our translation management [locize.com](http://locize.com).\n\nInContext Editing:\n\n- [locize](https://github.com/locize/locize)\n- [locize-editor](https://github.com/locize/locize-editor) (old client)\n\ni18next Backend: loading translations, save new segments during runtime\n\n- [i18next-locize-backend](https://github.com/locize/i18next-locize-backend)\n\nlast used: sets a timestamp on every key touched -> safely remove old/unused keys\n\n- [locize-lastused](https://github.com/locize/locize-lastused)\n\nYou will find your project informations like projectId and apiKey on your locize projects settings. (Signup add a new project for testing).\n\nSet projectId and apiKey in `/src/i18n.js`.\n\n## start\n\n```bash\n# npm start\n```\n\ninsert `http://localhost:3000` in the locize client to open your application with the locize incontext editor.\n\n### for old locize client:\n\nopen `http://localhost:3000?locize=true` to open your application with the locize incontext editor.\n"
  },
  {
    "path": "example/locize/package.json",
    "content": "{\n  \"name\": \"locize\",\n  \"version\": \"0.1.0\",\n  \"private\": true,\n  \"dependencies\": {\n    \"i18next\": \"^23.12.3\",\n    \"i18next-browser-languagedetector\": \"^8.0.0\",\n    \"i18next-locize-backend\": \"^6.4.3\",\n    \"locize\": \"^3.3.0\",\n    \"locize-lastused\": \"^3.4.1\",\n    \"react\": \"^18.3.1\",\n    \"react-dom\": \"^18.3.1\",\n    \"react-i18next\": \"^15.0.1\",\n    \"react-scripts\": \"^5.0.1\"\n  },\n  \"scripts\": {\n    \"start\": \"react-scripts start\",\n    \"build\": \"react-scripts build\",\n    \"test\": \"react-scripts test --env=jsdom\",\n    \"eject\": \"react-scripts eject\"\n  },\n  \"browserslist\": {\n    \"development\": [\n      \"last 2 chrome versions\",\n      \"last 2 firefox versions\",\n      \"last 2 edge versions\"\n    ],\n    \"production\": [\n      \">1%\",\n      \"last 4 versions\",\n      \"Firefox ESR\",\n      \"not ie < 11\"\n    ]\n  }\n}\n"
  },
  {
    "path": "example/locize/public/index.html",
    "content": "<!doctype html>\n<html lang=\"en\">\n  <head>\n    <meta charset=\"utf-8\" />\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\" />\n    <meta name=\"theme-color\" content=\"#000000\" />\n    <!--\n      manifest.json provides metadata used when your web app is added to the\n      homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/\n    -->\n    <link rel=\"manifest\" href=\"%PUBLIC_URL%/manifest.json\" />\n    <link rel=\"shortcut icon\" href=\"%PUBLIC_URL%/favicon.ico\" />\n    <!--\n      Notice the use of %PUBLIC_URL% in the tags above.\n      It will be replaced with the URL of the `public` folder during the build.\n      Only files inside the `public` folder can be referenced from the HTML.\n\n      Unlike \"/favicon.ico\" or \"favicon.ico\", \"%PUBLIC_URL%/favicon.ico\" will\n      work correctly both with client-side routing and a non-root public URL.\n      Learn how to configure a non-root public URL by running `npm run build`.\n    -->\n    <title>React App</title>\n  </head>\n  <body>\n    <noscript>You need to enable JavaScript to run this app.</noscript>\n    <div id=\"root\"></div>\n    <!--\n      This HTML file is a template.\n      If you open it directly in the browser, you will see an empty page.\n\n      You can add webfonts, meta tags, or analytics to this file.\n      The build step will place the bundled scripts into the <body> tag.\n\n      To begin the development, run `npm start` or `yarn start`.\n      To create a production bundle, use `npm run build` or `yarn build`.\n    -->\n  </body>\n</html>\n"
  },
  {
    "path": "example/locize/public/manifest.json",
    "content": "{\n  \"short_name\": \"React App\",\n  \"name\": \"Create React App Sample\",\n  \"icons\": [\n    {\n      \"src\": \"favicon.ico\",\n      \"sizes\": \"192x192\",\n      \"type\": \"image/png\"\n    }\n  ],\n  \"start_url\": \"./index.html\",\n  \"display\": \"standalone\",\n  \"theme_color\": \"#000000\",\n  \"background_color\": \"#ffffff\"\n}\n"
  },
  {
    "path": "example/locize/src/App.css",
    "content": ".App {\n  text-align: center;\n}\n\n.App-logo {\n  animation: App-logo-spin infinite 20s linear;\n  height: 80px;\n}\n\n.App-header {\n  background-color: #222;\n  height: 150px;\n  padding: 20px;\n  color: white;\n}\n\n.App-intro {\n  font-size: large;\n}\n\n@keyframes App-logo-spin {\n  from {\n    transform: rotate(0deg);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n}\n"
  },
  {
    "path": "example/locize/src/App.js",
    "content": "import React, { Component, Suspense } from 'react';\nimport { useTranslation, withTranslation, Trans } from 'react-i18next';\nimport logo from './logo.svg';\nimport './App.css';\n\n// use hoc for class based components\nclass LegacyWelcomeClass extends Component {\n  render() {\n    const { t } = this.props;\n    return <h2>{t('title')}</h2>;\n  }\n}\nconst Welcome = withTranslation()(LegacyWelcomeClass);\n\n// Component using the Trans component\nfunction MyComponent() {\n  return (\n    <Trans i18nKey=\"description.part1\">\n      To get started, edit <code>src/App.js</code> and save to reload.\n    </Trans>\n  );\n}\n\n// page uses the hook\nfunction Page() {\n  const { t, i18n } = useTranslation();\n\n  const changeLanguage = (lng) => {\n    i18n.changeLanguage(lng);\n  };\n\n  return (\n    <div className=\"App\">\n      <div className=\"App-header\">\n        <img src={logo} className=\"App-logo\" alt=\"logo\" />\n        <Welcome />\n      </div>\n      <div className=\"App-intro\">\n        <div>\n          <button type=\"submit\" onClick={() => changeLanguage('de')}>\n            de\n          </button>\n          <button type=\"submit\" onClick={() => changeLanguage('en')}>\n            en\n          </button>\n        </div>\n        <MyComponent />\n      </div>\n      <div>{t('description.part2')}</div>\n    </div>\n  );\n}\n\n// loading component for suspence fallback\nconst Loader = () => (\n  <div className=\"App\">\n    <img src={logo} className=\"App-logo\" alt=\"logo\" />\n    <div>loading...</div>\n  </div>\n);\n\n// here app catches the suspense from page in case translations are not yet loaded\nexport default function App() {\n  return (\n    <Suspense fallback={<Loader />}>\n      <Page />\n    </Suspense>\n  );\n}\n"
  },
  {
    "path": "example/locize/src/i18n.js",
    "content": "import i18n from 'i18next';\nimport { initReactI18next } from 'react-i18next';\nimport LanguageDetector from 'i18next-browser-languagedetector';\nimport Backend from 'i18next-locize-backend';\nimport LastUsed from 'locize-lastused';\nimport { locizePlugin } from 'locize';\n\n// OPTIONAL IF YOU LIKE TO SEE ALL (LOGIN TO TRANSLATION MANAGEMENT EDITOR)\n// 1) signup at https://locize.com/register and login\n// 2) create a new project\n// 3) copy/paste your projectId, apiKey below\n// 4) add de as additional language\n// 5a) import en from: http://api.locize.app/ce0cf818-32e5-44a5-b7f0-4ea9e840d962/latest/en/translation\n// 5b) import de from: http://api.locize.app/ce0cf818-32e5-44a5-b7f0-4ea9e840d962/latest/de/translation\nconst locizeOptions = {\n  projectId: 'ce0cf818-32e5-44a5-b7f0-4ea9e840d962',\n  apiKey: '5c2bbc21-027d-4f41-995a-e8beb451cdef', // YOU should not expose your apps API key to production!!!\n  referenceLng: 'en',\n};\n\ni18n\n  // i18next-locize-backend\n  // loads translations from your project, saves new keys to it (saveMissing: true)\n  // https://github.com/locize/i18next-locize-backend\n  .use(Backend)\n  // locize-lastused\n  // sets a timestamp of last access on every translation segment on locize\n  // -> safely remove the ones not being touched for weeks/months\n  // https://github.com/locize/locize-lastused\n  .use(LastUsed)\n  // locize-editor\n  // InContext Editor of locize\n  .use(locizePlugin) // will show the incontext editor only if passing ?incontext=true\n  // detect user language\n  // learn more: https://github.com/i18next/i18next-browser-languageDetector\n  .use(LanguageDetector)\n  // pass the i18n instance to react-i18next.\n  .use(initReactI18next)\n  // init i18next\n  // for all options read: https://www.i18next.com/overview/configuration-options\n  .init({\n    fallbackLng: 'en',\n    debug: true,\n    saveMissing: true,\n    // keySeparator: false,\n\n    interpolation: {\n      escapeValue: false, // not needed for react as it escapes by default\n    },\n    backend: locizeOptions,\n    locizeLastUsed: locizeOptions,\n    react: {\n      bindI18n: 'languageChanged editorSaved',\n    },\n  });\n\nexport default i18n;\n"
  },
  {
    "path": "example/locize/src/index.css",
    "content": "body {\n  margin: 0;\n  padding: 0;\n  font-family: sans-serif;\n}\n"
  },
  {
    "path": "example/locize/src/index.js",
    "content": "import React from 'react';\nimport { createRoot } from 'react-dom/client';\nimport './index.css';\nimport App from './App';\n\n// import i18n (needs to be bundled ;))\nimport './i18n';\n\nconst root = createRoot(document.getElementById('root'));\nroot.render(<App />);\n"
  },
  {
    "path": "example/razzle-ssr/.gitignore",
    "content": "logs\n*.log\nnpm-debug.log*\n.DS_Store\n\ncoverage\nnode_modules\nbuild\ncache\n.env.local\n.env.development.local\n.env.test.local\n.env.production.local\nyarn.lock\n"
  },
  {
    "path": "example/razzle-ssr/README.md",
    "content": "# Getting started\n\nBuild with [razzle](https://github.com/jaredpalmer/razzle) using its react ssr.\n\n```bash\n# npm start\n```\n\n**open:**\n\nwill detect language: [http://localhost:3000](http://localhost:3000)\n\ngerman: [http://localhost:3000/?lng=de](http://localhost:3000/?lng=de)\n\nenglish: [http://localhost:3000/?lng=en](http://localhost:3000/?lng=en)\n\n## production\n\n```bash\n# npm run build\n# npm run start:prod\n```\n\n## Learn more\n\n- Uses express to also serve translations for clientside\n- Translations are passed down to client on initial serverside render -> no reload of translations, no flickering\n- Uses _i18next-http-middleware_ on the serverside to assert that every request gets his own instance of i18next (no race condition conflicts when user b overrides set language in i18next singleton of user a!!!)\n- completely allows saveMissing feature of i18next -> added content will be pushed to server and stored in `xyz.missing.json`\n"
  },
  {
    "path": "example/razzle-ssr/package.json",
    "content": "{\n  \"name\": \"my-razzle-app\",\n  \"version\": \"0.1.0\",\n  \"license\": \"MIT\",\n  \"scripts\": {\n    \"start\": \"razzle start\",\n    \"build\": \"razzle build\",\n    \"test\": \"razzle test --env=jsdom\",\n    \"start:static\": \"serve -s build/public\",\n    \"start:prod\": \"NODE_ENV=production node build/server.js\"\n  },\n  \"dependencies\": {\n    \"babel-preset-razzle\": \"^4.2.18\",\n    \"express\": \"^4.19.2\",\n    \"html-webpack-plugin\": \"^5.6.0\",\n    \"i18next\": \"^23.12.3\",\n    \"i18next-browser-languagedetector\": \"^8.0.0\",\n    \"i18next-fs-backend\": \"^2.3.2\",\n    \"i18next-http-backend\": \"^2.5.2\",\n    \"i18next-http-middleware\": \"^3.6.0\",\n    \"mini-css-extract-plugin\": \"^0.12.0\",\n    \"razzle\": \"^4.2.18\",\n    \"razzle-dev-utils\": \"^4.2.18\",\n    \"react\": \"^17.0.2\",\n    \"react-dom\": \"^17.0.2\",\n    \"react-i18next\": \"^15.0.1\",\n    \"react-router-dom\": \"^5.3.4\",\n    \"serve\": \"^14.2.3\",\n    \"webpack\": \"^5.93.0\",\n    \"webpack-dev-server\": \"^3.11.3\"\n  }\n}\n"
  },
  {
    "path": "example/razzle-ssr/public/robots.txt",
    "content": "User-agent: *\n\n"
  },
  {
    "path": "example/razzle-ssr/src/App.css",
    "content": "body {\n  margin: 0;\n  padding: 0;\n  font-family: sans-serif;\n}\n"
  },
  {
    "path": "example/razzle-ssr/src/App.js",
    "content": "import React from 'react';\nimport { Route, Switch } from 'react-router-dom';\nimport Home from './Home';\nimport './App.css';\n\nfunction App() {\n  return (\n    <Switch>\n      <Route exact path=\"/\" component={Home} />\n    </Switch>\n  );\n}\n\nexport default App;\n"
  },
  {
    "path": "example/razzle-ssr/src/Home.css",
    "content": ".Home {\n  text-align: center;\n}\n\n.Home-logo {\n  animation: Home-logo-spin infinite 20s linear;\n  height: 80px;\n}\n\n.Home-header {\n  background-color: #222;\n  height: 150px;\n  padding: 20px;\n  color: white;\n}\n\n.Home-intro {\n  margin-top: 30px;\n  font-size: large;\n}\n\n.Home-resources {\n  list-style: none;\n}\n\n.Home-resources > li {\n  display: inline-block;\n  padding: 1rem;\n}\n\n@keyframes Home-logo-spin {\n  from {\n    transform: rotate(0deg);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n}\n"
  },
  {
    "path": "example/razzle-ssr/src/Home.js",
    "content": "import React from 'react';\nimport { Trans, useTranslation } from 'react-i18next';\nimport logo from './react.svg';\nimport './Home.css';\n\nfunction Home() {\n  const [t] = useTranslation('translations');\n\n  return (\n    <div className=\"Home\">\n      <div className=\"Home-header\">\n        <img src={logo} className=\"Home-logo\" alt=\"logo\" />\n        <h2>{t('message.welcome')}</h2>\n      </div>\n      <div className=\"Home-intro\">\n        <Trans i18nKey=\"guideline\">\n          To get started, edit <code>src/App.js</code> or <code>src/Home.js</code> and save to\n          reload.\n        </Trans>\n      </div>\n      <ul className=\"Home-resources\">\n        <li>\n          <a href=\"https://github.com/jaredpalmer/razzle\">Docs</a>\n        </li>\n        <li>\n          <a href=\"https://github.com/jaredpalmer/razzle/issues\">Issues</a>\n        </li>\n        <li>\n          <a href=\"https://palmer.chat\">Community Slack</a>\n        </li>\n      </ul>\n    </div>\n  );\n}\n\nexport default Home;\n"
  },
  {
    "path": "example/razzle-ssr/src/client.js",
    "content": "import { BrowserRouter } from 'react-router-dom';\nimport React, { Suspense } from 'react';\nimport { hydrate } from 'react-dom';\nimport { useSSR } from 'react-i18next';\nimport App from './App';\nimport './i18n';\n\nconst BaseApp = () => {\n  useSSR(window.initialI18nStore, window.initialLanguage);\n  return (\n    <Suspense fallback={<div>Still loading i18n...</div>}>\n      <BrowserRouter>\n        <App />\n      </BrowserRouter>\n    </Suspense>\n  );\n};\n\nhydrate(<BaseApp />, document.getElementById('root'));\n\nif (module.hot) {\n  module.hot.accept();\n}\n"
  },
  {
    "path": "example/razzle-ssr/src/i18n.js",
    "content": "import i18n from 'i18next';\nimport { initReactI18next } from 'react-i18next';\nimport Backend from 'i18next-http-backend';\nimport LanguageDetector from 'i18next-browser-languagedetector';\n\nconst options = {\n  fallbackLng: 'en',\n  supportedLngs: ['en', 'de'],\n  load: 'languageOnly', // we only provide en, de -> no region specific locals like en-US, de-DE\n  // have a common namespace used around the full app\n  ns: ['translations'],\n  defaultNS: 'translations',\n\n  saveMissing: true,\n  debug: true,\n\n  interpolation: {\n    escapeValue: false, // not needed for react!!\n    formatSeparator: ',',\n    format: (value, format, lng) => {\n      if (format === 'uppercase') return value.toUpperCase();\n      return value;\n    },\n  },\n  useSuspense: process && !process.release,\n};\n\n// for browser use http backend to load translations and browser lng detector\nif (process && !process.release) {\n  i18n.use(Backend).use(initReactI18next).use(LanguageDetector);\n}\n\n// initialize if not already initialized\nif (!i18n.isInitialized) {\n  i18n.init(options);\n}\n\nexport default i18n;\n"
  },
  {
    "path": "example/razzle-ssr/src/index.js",
    "content": "import express from 'express';\nimport app from './server';\n\nif (module.hot) {\n  module.hot.accept('./server', function () {\n    console.log('🔁  HMR Reloading `./server`...');\n  });\n  console.info('✅  Server-side HMR Enabled!');\n}\n\nconst port = process.env.PORT || 3000;\n\nexport default express()\n  .use((req, res) => app.handle(req, res))\n  .listen(port, function (err) {\n    if (err) {\n      console.error(err);\n      return;\n    }\n    console.log(`> Started on port ${port}`);\n  });\n"
  },
  {
    "path": "example/razzle-ssr/src/locales/de/translations.json",
    "content": "{\n  \"message\": {\n    \"welcome\": \"Willkommen zu Razzle mit i18n\"\n  },\n  \"guideline\": \"Um zu beginnen, ändere <1>src/App.js</1> oder <3>src/Home.js</3> und speichere deine Änderungen um neu zu laden.\"\n}\n"
  },
  {
    "path": "example/razzle-ssr/src/locales/en/translations.json",
    "content": "{\n  \"message\": {\n    \"welcome\": \"Welcome to Razzle with i18n\"\n  },\n  \"guideline\": \"To get started, edit <1>src/App.js</1> or <3>src/Home.js</3> and save to reload.\"\n}\n"
  },
  {
    "path": "example/razzle-ssr/src/server.js",
    "content": "/* eslint-disable import/no-dynamic-require */\nimport React from 'react';\nimport { StaticRouter, matchPath } from 'react-router-dom';\n\nimport express from 'express';\nimport path from 'path';\nimport fs from 'fs';\nimport { renderToString } from 'react-dom/server';\n\nimport { I18nextProvider } from 'react-i18next'; // has no proper import yet\nimport Backend from 'i18next-fs-backend';\nimport App from './App';\nimport i18n from './i18n';\n\n// Make sure any symlinks in the project folder are resolved:\n// https://github.com/facebookincubator/create-react-app/issues/637\nconst appDirectory = fs.realpathSync(process.cwd());\nconst resolveApp = (relativePath) => path.resolve(appDirectory, relativePath);\nconst appSrc = resolveApp('src');\n\nconst assets = require(process.env.RAZZLE_ASSETS_MANIFEST);\nconst i18nextMiddleware = require('i18next-http-middleware');\n\nconst server = express();\n\ni18n\n  .use(Backend)\n  .use(i18nextMiddleware.LanguageDetector)\n  .init(\n    {\n      debug: false,\n      preload: ['en', 'de'],\n      ns: ['translations'],\n      defaultNS: 'translations',\n      backend: {\n        loadPath: `${appSrc}/locales/{{lng}}/{{ns}}.json`,\n        addPath: `${appSrc}/locales/{{lng}}/{{ns}}.missing.json`,\n      },\n    },\n    () => {\n      server\n        .disable('x-powered-by')\n        .use(i18nextMiddleware.handle(i18n))\n        .use('/locales', express.static(`${appSrc}/locales`))\n        .use(express.static(process.env.RAZZLE_PUBLIC_DIR))\n        .get('/*', (req, res) => {\n          const context = {};\n          const markup = renderToString(\n            <I18nextProvider i18n={req.i18n}>\n              <StaticRouter context={context} location={req.url}>\n                <App />\n              </StaticRouter>\n            </I18nextProvider>,\n          );\n          // This line must be placed after renderToString method\n          // otherwise context won't be populated by App\n          const { url } = context;\n          if (url) {\n            res.redirect(url);\n          } else {\n            // First preferred language\n            const initialLanguage = req.i18n.languages[0];\n\n            // Fill initialI18nStore with only the necessary namespaces.\n            const initialI18nStore = {};\n            const usedNamespaces = req.i18n.reportNamespaces.getUsedNamespaces();\n\n            req.i18n.languages.forEach((language) => {\n              initialI18nStore[language] = {};\n\n              usedNamespaces.forEach((namespace) => {\n                initialI18nStore[language][namespace] =\n                  req.i18n.services.resourceStore.data[language][namespace];\n              });\n            });\n\n            res.status(200).send(\n              `<!doctype html>\n        <html lang=\"\">\n        <head>\n            <meta httpEquiv=\"X-UA-Compatible\" content=\"IE=edge\" />\n            <meta charSet='utf-8' />\n            <title>Welcome to Razzle</title>\n            <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\n            ${assets.client.css ? `<link rel=\"stylesheet\" href=\"${assets.client.css}\">` : ''}\n            <script src=\"${assets.client.js}\" defer></script>\n            <script>\n              window.initialI18nStore = JSON.parse('${JSON.stringify(initialI18nStore)}');\n              window.initialLanguage = '${initialLanguage}';\n            </script>\n        </head>\n        <body>\n            <div id=\"root\">${markup}</div>\n        </body>\n    </html>`,\n            );\n          }\n        });\n    },\n  );\n\nexport default server;\n"
  },
  {
    "path": "example/react/.gitignore",
    "content": "# See https://help.github.com/ignore-files/ for more about ignoring files.\n\n# dependencies\n/node_modules\n\n# testing\n/coverage\n\n# production\n/build\n\n# misc\n.DS_Store\n.env.local\n.env.development.local\n.env.test.local\n.env.production.local\n\nnpm-debug.log*\nyarn-debug.log*\nyarn-error.log*\n"
  },
  {
    "path": "example/react/README.md",
    "content": "# [Ready to take i18next to the next level?](http://locize.com/?utm_source=react_i18next_readme&utm_medium=github)\n\nNeeding a translation management? Want to edit your translations with an InContext Editor? Use the original provided to you by the maintainers of i18next!\n\n![locize](https://www.locize.com/img/ads/github_locize.png)\n\nWith using [locize](http://locize.com/?utm_source=react_i18next_readme&utm_medium=github) you directly support the future of i18next and react-i18next.\n\n## Here you find a react example for locize:\n\n[EXAMPLE](../locize)\n\n[![video](../locize/video_sample.png)](https://youtu.be/osScyaGMVqo)\n[watch the video](https://youtu.be/osScyaGMVqo)\n\n---\n\nThis project was bootstrapped with [Create React App](https://github.com/facebookincubator/create-react-app).\n\nBelow you will find some information on how to perform common tasks.<br>\nYou can find the most recent version of this guide [here](https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md).\n\n## Table of Contents\n\n- [Updating to New Releases](#updating-to-new-releases)\n- [Sending Feedback](#sending-feedback)\n- [Folder Structure](#folder-structure)\n- [Available Scripts](#available-scripts)\n  - [npm start](#npm-start)\n  - [npm test](#npm-test)\n  - [npm run build](#npm-run-build)\n  - [npm run eject](#npm-run-eject)\n- [Supported Language Features and Polyfills](#supported-language-features-and-polyfills)\n- [Syntax Highlighting in the Editor](#syntax-highlighting-in-the-editor)\n- [Displaying Lint Output in the Editor](#displaying-lint-output-in-the-editor)\n- [Debugging in the Editor](#debugging-in-the-editor)\n- [Formatting Code Automatically](#formatting-code-automatically)\n- [Changing the Page `<title>`](#changing-the-page-title)\n- [Installing a Dependency](#installing-a-dependency)\n- [Importing a Component](#importing-a-component)\n- [Code Splitting](#code-splitting)\n- [Adding a Stylesheet](#adding-a-stylesheet)\n- [Post-Processing CSS](#post-processing-css)\n- [Adding a CSS Preprocessor (Sass, Less etc.)](#adding-a-css-preprocessor-sass-less-etc)\n- [Adding Images, Fonts, and Files](#adding-images-fonts-and-files)\n- [Using the `public` Folder](#using-the-public-folder)\n  - [Changing the HTML](#changing-the-html)\n  - [Adding Assets Outside of the Module System](#adding-assets-outside-of-the-module-system)\n  - [When to Use the `public` Folder](#when-to-use-the-public-folder)\n- [Using Global Variables](#using-global-variables)\n- [Adding Bootstrap](#adding-bootstrap)\n  - [Using a Custom Theme](#using-a-custom-theme)\n- [Adding Flow](#adding-flow)\n- [Adding Custom Environment Variables](#adding-custom-environment-variables)\n  - [Referencing Environment Variables in the HTML](#referencing-environment-variables-in-the-html)\n  - [Adding Temporary Environment Variables In Your Shell](#adding-temporary-environment-variables-in-your-shell)\n  - [Adding Development Environment Variables In `.env`](#adding-development-environment-variables-in-env)\n- [Can I Use Decorators?](#can-i-use-decorators)\n- [Integrating with an API Backend](#integrating-with-an-api-backend)\n  - [Node](#node)\n  - [Ruby on Rails](#ruby-on-rails)\n- [Proxying API Requests in Development](#proxying-api-requests-in-development)\n  - [\"Invalid Host Header\" Errors After Configuring Proxy](#invalid-host-header-errors-after-configuring-proxy)\n  - [Configuring the Proxy Manually](#configuring-the-proxy-manually)\n  - [Configuring a WebSocket Proxy](#configuring-a-websocket-proxy)\n- [Using HTTPS in Development](#using-https-in-development)\n- [Generating Dynamic `<meta>` Tags on the Server](#generating-dynamic-meta-tags-on-the-server)\n- [Pre-Rendering into Static HTML Files](#pre-rendering-into-static-html-files)\n- [Injecting Data from the Server into the Page](#injecting-data-from-the-server-into-the-page)\n- [Running Tests](#running-tests)\n  - [Filename Conventions](#filename-conventions)\n  - [Command Line Interface](#command-line-interface)\n  - [Version Control Integration](#version-control-integration)\n  - [Writing Tests](#writing-tests)\n  - [Testing Components](#testing-components)\n  - [Using Third Party Assertion Libraries](#using-third-party-assertion-libraries)\n  - [Initializing Test Environment](#initializing-test-environment)\n  - [Focusing and Excluding Tests](#focusing-and-excluding-tests)\n  - [Coverage Reporting](#coverage-reporting)\n  - [Continuous Integration](#continuous-integration)\n  - [Disabling jsdom](#disabling-jsdom)\n  - [Snapshot Testing](#snapshot-testing)\n  - [Editor Integration](#editor-integration)\n- [Developing Components in Isolation](#developing-components-in-isolation)\n  - [Getting Started with Storybook](#getting-started-with-storybook)\n  - [Getting Started with Styleguidist](#getting-started-with-styleguidist)\n- [Making a Progressive Web App](#making-a-progressive-web-app)\n  - [Opting Out of Caching](#opting-out-of-caching)\n  - [Offline-First Considerations](#offline-first-considerations)\n  - [Progressive Web App Metadata](#progressive-web-app-metadata)\n- [Analyzing the Bundle Size](#analyzing-the-bundle-size)\n- [Deployment](#deployment)\n  - [Static Server](#static-server)\n  - [Other Solutions](#other-solutions)\n  - [Serving Apps with Client-Side Routing](#serving-apps-with-client-side-routing)\n  - [Building for Relative Paths](#building-for-relative-paths)\n  - [Azure](#azure)\n  - [Firebase](#firebase)\n  - [GitHub Pages](#github-pages)\n  - [Heroku](#heroku)\n  - [Netlify](#netlify)\n  - [Now](#now)\n  - [S3 and CloudFront](#s3-and-cloudfront)\n  - [Surge](#surge)\n- [Advanced Configuration](#advanced-configuration)\n- [Troubleshooting](#troubleshooting)\n  - [`npm start` doesn’t detect changes](#npm-start-doesnt-detect-changes)\n  - [`npm test` hangs on macOS Sierra](#npm-test-hangs-on-macos-sierra)\n  - [`npm run build` exits too early](#npm-run-build-exits-too-early)\n  - [`npm run build` fails on Heroku](#npm-run-build-fails-on-heroku)\n  - [`npm run build` fails to minify](#npm-run-build-fails-to-minify)\n  - [Moment.js locales are missing](#momentjs-locales-are-missing)\n- [Something Missing?](#something-missing)\n\n## Updating to New Releases\n\nCreate React App is divided into two packages:\n\n- `create-react-app` is a global command-line utility that you use to create new projects.\n- `react-scripts` is a development dependency in the generated projects (including this one).\n\nYou almost never need to update `create-react-app` itself: it delegates all the setup to `react-scripts`.\n\nWhen you run `create-react-app`, it always creates the project with the latest version of `react-scripts` so you’ll get all the new features and improvements in newly created apps automatically.\n\nTo update an existing project to a new version of `react-scripts`, [open the changelog](https://github.com/facebookincubator/create-react-app/blob/master/CHANGELOG.md), find the version you’re currently on (check `package.json` in this folder if you’re not sure), and apply the migration instructions for the newer versions.\n\nIn most cases bumping the `react-scripts` version in `package.json` and running `npm install` in this folder should be enough, but it’s good to consult the [changelog](https://github.com/facebookincubator/create-react-app/blob/master/CHANGELOG.md) for potential breaking changes.\n\nWe commit to keeping the breaking changes minimal so you can upgrade `react-scripts` painlessly.\n\n## Sending Feedback\n\nWe are always open to [your feedback](https://github.com/facebookincubator/create-react-app/issues).\n\n## Folder Structure\n\nAfter creation, your project should look like this:\n\n```\nmy-app/\n  README.md\n  node_modules/\n  package.json\n  public/\n    index.html\n    favicon.ico\n  src/\n    App.css\n    App.js\n    App.test.js\n    index.css\n    index.js\n    logo.svg\n```\n\nFor the project to build, **these files must exist with exact filenames**:\n\n- `public/index.html` is the page template;\n- `src/index.js` is the JavaScript entry point.\n\nYou can delete or rename the other files.\n\nYou may create subdirectories inside `src`. For faster rebuilds, only files inside `src` are processed by Webpack.<br>\nYou need to **put any JS and CSS files inside `src`**, otherwise Webpack won’t see them.\n\nOnly files inside `public` can be used from `public/index.html`.<br>\nRead instructions below for using assets from JavaScript and HTML.\n\nYou can, however, create more top-level directories.<br>\nThey will not be included in the production build so you can use them for things like documentation.\n\n## Available Scripts\n\nIn the project directory, you can run:\n\n### `npm start`\n\nRuns the app in the development mode.<br>\nOpen [http://localhost:3000](http://localhost:3000) to view it in the browser.\n\nThe page will reload if you make edits.<br>\nYou will also see any lint errors in the console.\n\n### `npm test`\n\nLaunches the test runner in the interactive watch mode.<br>\nSee the section about [running tests](#running-tests) for more information.\n\n### `npm run build`\n\nBuilds the app for production to the `build` folder.<br>\nIt correctly bundles React in production mode and optimizes the build for the best performance.\n\nThe build is minified and the filenames include the hashes.<br>\nYour app is ready to be deployed!\n\nSee the section about [deployment](#deployment) for more information.\n\n### `npm run eject`\n\n**Note: this is a one-way operation. Once you `eject`, you can’t go back!**\n\nIf you aren’t satisfied with the build tool and configuration choices, you can `eject` at any time. This command will remove the single build dependency from your project.\n\nInstead, it will copy all the configuration files and the transitive dependencies (Webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except `eject` will still work, but they will point to the copied scripts so you can tweak them. At this point you’re on your own.\n\nYou don’t have to ever use `eject`. The curated feature set is suitable for small and middle deployments, and you shouldn’t feel obligated to use this feature. However we understand that this tool wouldn’t be useful if you couldn’t customize it when you are ready for it.\n\n## Supported Language Features and Polyfills\n\nThis project supports a superset of the latest JavaScript standard.<br>\nIn addition to [ES6](https://github.com/lukehoban/es6features) syntax features, it also supports:\n\n- [Exponentiation Operator](https://github.com/rwaldron/exponentiation-operator) (ES2016).\n- [Async/await](https://github.com/tc39/ecmascript-asyncawait) (ES2017).\n- [Object Rest/Spread Properties](https://github.com/sebmarkbage/ecmascript-rest-spread) (stage 3 proposal).\n- [Dynamic import()](https://github.com/tc39/proposal-dynamic-import) (stage 3 proposal)\n- [Class Fields and Static Properties](https://github.com/tc39/proposal-class-public-fields) (stage 2 proposal).\n- [JSX](https://facebook.github.io/react/docs/introducing-jsx.html) and [Flow](https://flowtype.org/) syntax.\n\nLearn more about [different proposal stages](https://babeljs.io/docs/plugins/#presets-stage-x-experimental-presets-).\n\nWhile we recommend to use experimental proposals with some caution, Facebook heavily uses these features in the product code, so we intend to provide [codemods](https://medium.com/@cpojer/effective-javascript-codemods-5a6686bb46fb) if any of these proposals change in the future.\n\nNote that **the project only includes a few ES6 [polyfills](https://en.wikipedia.org/wiki/Polyfill)**:\n\n- [`Object.assign()`](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Object/assign) via [`object-assign`](https://github.com/sindresorhus/object-assign).\n- [`Promise`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise) via [`promise`](https://github.com/then/promise).\n- [`fetch()`](https://developer.mozilla.org/en/docs/Web/API/Fetch_API) via [`whatwg-fetch`](https://github.com/github/fetch).\n\nIf you use any other ES6+ features that need **runtime support** (such as `Array.from()` or `Symbol`), make sure you are including the appropriate polyfills manually, or that the browsers you are targeting already support them.\n\n## Syntax Highlighting in the Editor\n\nTo configure the syntax highlighting in your favorite text editor, head to the [relevant Babel documentation page](https://babeljs.io/docs/editors) and follow the instructions. Some of the most popular editors are covered.\n\n## Displaying Lint Output in the Editor\n\n> Note: this feature is available with `react-scripts@0.2.0` and higher.<br>\n> It also only works with npm 3 or higher.\n\nSome editors, including Sublime Text, Atom, and Visual Studio Code, provide plugins for ESLint.\n\nThey are not required for linting. You should see the linter output right in your terminal as well as the browser console. However, if you prefer the lint results to appear right in your editor, there are some extra steps you can do.\n\nYou would need to install an ESLint plugin for your editor first. Then, add a file called `.eslintrc` to the project root:\n\n```js\n{\n  \"extends\": \"react-app\"\n}\n```\n\nNow your editor should report the linting warnings.\n\nNote that even if you edit your `.eslintrc` file further, these changes will **only affect the editor integration**. They won’t affect the terminal and in-browser lint output. This is because Create React App intentionally provides a minimal set of rules that find common mistakes.\n\nIf you want to enforce a coding style for your project, consider using [Prettier](https://github.com/jlongster/prettier) instead of ESLint style rules.\n\n## Debugging in the Editor\n\n**This feature is currently only supported by [Visual Studio Code](https://code.visualstudio.com) and [WebStorm](https://www.jetbrains.com/webstorm/).**\n\nVisual Studio Code and WebStorm support debugging out of the box with Create React App. This enables you as a developer to write and debug your React code without leaving the editor, and most importantly it enables you to have a continuous development workflow, where context switching is minimal, as you don’t have to switch between tools.\n\n### Visual Studio Code\n\nYou would need to have the latest version of [VS Code](https://code.visualstudio.com) and VS Code [Chrome Debugger Extension](https://marketplace.visualstudio.com/items?itemName=msjsdiag.debugger-for-chrome) installed.\n\nThen add the block below to your `launch.json` file and put it inside the `.vscode` folder in your app’s root directory.\n\n```json\n{\n  \"version\": \"0.2.0\",\n  \"configurations\": [\n    {\n      \"name\": \"Chrome\",\n      \"type\": \"chrome\",\n      \"request\": \"launch\",\n      \"url\": \"http://localhost:3000\",\n      \"webRoot\": \"${workspaceRoot}/src\",\n      \"userDataDir\": \"${workspaceRoot}/.vscode/chrome\",\n      \"sourceMapPathOverrides\": {\n        \"webpack:///src/*\": \"${webRoot}/*\"\n      }\n    }\n  ]\n}\n```\n\n> Note: the URL may be different if you've made adjustments via the [HOST or PORT environment variables](#advanced-configuration).\n\nStart your app by running `npm start`, and start debugging in VS Code by pressing `F5` or by clicking the green debug icon. You can now write code, set breakpoints, make changes to the code, and debug your newly modified code—all from your editor.\n\n### WebStorm\n\nYou would need to have [WebStorm](https://www.jetbrains.com/webstorm/) and [JetBrains IDE Support](https://chrome.google.com/webstore/detail/jetbrains-ide-support/hmhgeddbohgjknpmjagkdomcpobmllji) Chrome extension installed.\n\nIn the WebStorm menu `Run` select `Edit Configurations...`. Then click `+` and select `JavaScript Debug`. Paste `http://localhost:3000` into the URL field and save the configuration.\n\n> Note: the URL may be different if you've made adjustments via the [HOST or PORT environment variables](#advanced-configuration).\n\nStart your app by running `npm start`, then press `^D` on macOS or `F9` on Windows and Linux or click the green debug icon to start debugging in WebStorm.\n\nThe same way you can debug your application in IntelliJ IDEA Ultimate, PhpStorm, PyCharm Pro, and RubyMine.\n\n## Formatting Code Automatically\n\nPrettier is an opinionated code formatter with support for JavaScript, CSS and JSON. With Prettier you can format the code you write automatically to ensure a code style within your project. See the [Prettier's GitHub page](https://github.com/prettier/prettier) for more information, and look at this [page to see it in action](https://prettier.github.io/prettier/).\n\nTo format our code whenever we make a commit in git, we need to install the following dependencies:\n\n```sh\nnpm install --save husky lint-staged prettier\n```\n\nAlternatively you may use `yarn`:\n\n```sh\nyarn add husky lint-staged prettier\n```\n\n- `husky` makes it easy to use githooks as if they are npm scripts.\n- `lint-staged` allows us to run scripts on staged files in git. See this [blog post about lint-staged to learn more about it](https://medium.com/@okonetchnikov/make-linting-great-again-f3890e1ad6b8).\n- `prettier` is the JavaScript formatter we will run before commits.\n\nNow we can make sure every file is formatted correctly by adding a few lines to the `package.json` in the project root.\n\nAdd the following line to `scripts` section:\n\n```diff\n  \"scripts\": {\n+   \"precommit\": \"lint-staged\",\n    \"start\": \"react-scripts start\",\n    \"build\": \"react-scripts build\",\n```\n\nNext we add a 'lint-staged' field to the `package.json`, for example:\n\n```diff\n  \"dependencies\": {\n    // ...\n  },\n+ \"lint-staged\": {\n+   \"src/**/*.{js,jsx,json,css}\": [\n+     \"prettier --single-quote --write\",\n+     \"git add\"\n+   ]\n+ },\n  \"scripts\": {\n```\n\nNow, whenever you make a commit, Prettier will format the changed files automatically. You can also run `./node_modules/.bin/prettier --single-quote --write \"src/**/*.{js,jsx}\"` to format your entire project for the first time.\n\nNext you might want to integrate Prettier in your favorite editor. Read the section on [Editor Integration](https://github.com/prettier/prettier#editor-integration) on the Prettier GitHub page.\n\n## Changing the Page `<title>`\n\nYou can find the source HTML file in the `public` folder of the generated project. You may edit the `<title>` tag in it to change the title from “React App” to anything else.\n\nNote that normally you wouldn’t edit files in the `public` folder very often. For example, [adding a stylesheet](#adding-a-stylesheet) is done without touching the HTML.\n\nIf you need to dynamically update the page title based on the content, you can use the browser [`document.title`](https://developer.mozilla.org/en-US/docs/Web/API/Document/title) API. For more complex scenarios when you want to change the title from React components, you can use [React Helmet](https://github.com/nfl/react-helmet), a third party library.\n\nIf you use a custom server for your app in production and want to modify the title before it gets sent to the browser, you can follow advice in [this section](#generating-dynamic-meta-tags-on-the-server). Alternatively, you can pre-build each page as a static HTML file which then loads the JavaScript bundle, which is covered [here](#pre-rendering-into-static-html-files).\n\n## Installing a Dependency\n\nThe generated project includes React and ReactDOM as dependencies. It also includes a set of scripts used by Create React App as a development dependency. You may install other dependencies (for example, React Router) with `npm`:\n\n```sh\nnpm install --save react-router\n```\n\nAlternatively you may use `yarn`:\n\n```sh\nyarn add react-router\n```\n\nThis works for any library, not just `react-router`.\n\n## Importing a Component\n\nThis project setup supports ES6 modules thanks to Babel.<br>\nWhile you can still use `require()` and `module.exports`, we encourage you to use [`import` and `export`](http://exploringjs.com/es6/ch_modules.html) instead.\n\nFor example:\n\n### `Button.js`\n\n```js\nimport React, { Component } from 'react';\n\nclass Button extends Component {\n  render() {\n    // ...\n  }\n}\n\nexport default Button; // Don’t forget to use export default!\n```\n\n### `DangerButton.js`\n\n```js\nimport React, { Component } from 'react';\nimport Button from './Button'; // Import a component from another file\n\nclass DangerButton extends Component {\n  render() {\n    return <Button color=\"red\" />;\n  }\n}\n\nexport default DangerButton;\n```\n\nBe aware of the [difference between default and named exports](http://stackoverflow.com/questions/36795819/react-native-es-6-when-should-i-use-curly-braces-for-import/36796281#36796281). It is a common source of mistakes.\n\nWe suggest that you stick to using default imports and exports when a module only exports a single thing (for example, a component). That’s what you get when you use `export default Button` and `import Button from './Button'`.\n\nNamed exports are useful for utility modules that export several functions. A module may have at most one default export and as many named exports as you like.\n\nLearn more about ES6 modules:\n\n- [When to use the curly braces?](http://stackoverflow.com/questions/36795819/react-native-es-6-when-should-i-use-curly-braces-for-import/36796281#36796281)\n- [Exploring ES6: Modules](http://exploringjs.com/es6/ch_modules.html)\n- [Understanding ES6: Modules](https://leanpub.com/understandinges6/read#leanpub-auto-encapsulating-code-with-modules)\n\n## Code Splitting\n\nInstead of downloading the entire app before users can use it, code splitting allows you to split your code into small chunks which you can then load on demand.\n\nThis project setup supports code splitting via [dynamic `import()`](http://2ality.com/2017/01/import-operator.html#loading-code-on-demand). Its [proposal](https://github.com/tc39/proposal-dynamic-import) is in stage 3. The `import()` function-like form takes the module name as an argument and returns a [`Promise`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise) which always resolves to the namespace object of the module.\n\nHere is an example:\n\n### `moduleA.js`\n\n```js\nconst moduleA = 'Hello';\n\nexport { moduleA };\n```\n\n### `App.js`\n\n```js\nimport React, { Component } from 'react';\n\nclass App extends Component {\n  handleClick = () => {\n    import('./moduleA')\n      .then(({ moduleA }) => {\n        // Use moduleA\n      })\n      .catch((err) => {\n        // Handle failure\n      });\n  };\n\n  render() {\n    return (\n      <div>\n        <button onClick={this.handleClick}>Load</button>\n      </div>\n    );\n  }\n}\n\nexport default App;\n```\n\nThis will make `moduleA.js` and all its unique dependencies as a separate chunk that only loads after the user clicks the 'Load' button.\n\nYou can also use it with `async` / `await` syntax if you prefer it.\n\n### With React Router\n\nIf you are using React Router check out [this tutorial](http://serverless-stack.com/chapters/code-splitting-in-create-react-app.html) on how to use code splitting with it. You can find the companion GitHub repository [here](https://github.com/AnomalyInnovations/serverless-stack-demo-client/tree/code-splitting-in-create-react-app).\n\n## Adding a Stylesheet\n\nThis project setup uses [Webpack](https://webpack.js.org/) for handling all assets. Webpack offers a custom way of “extending” the concept of `import` beyond JavaScript. To express that a JavaScript file depends on a CSS file, you need to **import the CSS from the JavaScript file**:\n\n### `Button.css`\n\n```css\n.Button {\n  padding: 20px;\n}\n```\n\n### `Button.js`\n\n```js\nimport React, { Component } from 'react';\nimport './Button.css'; // Tell Webpack that Button.js uses these styles\n\nclass Button extends Component {\n  render() {\n    // You can use them as regular CSS styles\n    return <div className=\"Button\" />;\n  }\n}\n```\n\n**This is not required for React** but many people find this feature convenient. You can read about the benefits of this approach [here](https://medium.com/seek-ui-engineering/block-element-modifying-your-javascript-components-d7f99fcab52b). However you should be aware that this makes your code less portable to other build tools and environments than Webpack.\n\nIn development, expressing dependencies this way allows your styles to be reloaded on the fly as you edit them. In production, all CSS files will be concatenated into a single minified `.css` file in the build output.\n\nIf you are concerned about using Webpack-specific semantics, you can put all your CSS right into `src/index.css`. It would still be imported from `src/index.js`, but you could always remove that import if you later migrate to a different build tool.\n\n## Post-Processing CSS\n\nThis project setup minifies your CSS and adds vendor prefixes to it automatically through [Autoprefixer](https://github.com/postcss/autoprefixer) so you don’t need to worry about it.\n\nFor example, this:\n\n```css\n.App {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n}\n```\n\nbecomes this:\n\n```css\n.App {\n  display: -webkit-box;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-box-orient: horizontal;\n  -webkit-box-direction: normal;\n  -ms-flex-direction: row;\n  flex-direction: row;\n  -webkit-box-align: center;\n  -ms-flex-align: center;\n  align-items: center;\n}\n```\n\nIf you need to disable autoprefixing for some reason, [follow this section](https://github.com/postcss/autoprefixer#disabling).\n\n## Adding a CSS Preprocessor (Sass, Less etc.)\n\nGenerally, we recommend that you don’t reuse the same CSS classes across different components. For example, instead of using a `.Button` CSS class in `<AcceptButton>` and `<RejectButton>` components, we recommend creating a `<Button>` component with its own `.Button` styles, that both `<AcceptButton>` and `<RejectButton>` can render (but [not inherit](https://facebook.github.io/react/docs/composition-vs-inheritance.html)).\n\nFollowing this rule often makes CSS preprocessors less useful, as features like mixins and nesting are replaced by component composition. You can, however, integrate a CSS preprocessor if you find it valuable. In this walkthrough, we will be using Sass, but you can also use Less, or another alternative.\n\nFirst, let’s install the command-line interface for Sass:\n\n```sh\nnpm install --save node-sass-chokidar\n```\n\nAlternatively you may use `yarn`:\n\n```sh\nyarn add node-sass-chokidar\n```\n\nThen in `package.json`, add the following lines to `scripts`:\n\n```diff\n   \"scripts\": {\n+    \"build-css\": \"node-sass-chokidar src/ -o src/\",\n+    \"watch-css\": \"npm run build-css && node-sass-chokidar src/ -o src/ --watch --recursive\",\n     \"start\": \"react-scripts start\",\n     \"build\": \"react-scripts build\",\n     \"test\": \"react-scripts test --env=jsdom\",\n```\n\n> Note: To use a different preprocessor, replace `build-css` and `watch-css` commands according to your preprocessor’s documentation.\n\nNow you can rename `src/App.css` to `src/App.scss` and run `npm run watch-css`. The watcher will find every Sass file in `src` subdirectories, and create a corresponding CSS file next to it, in our case overwriting `src/App.css`. Since `src/App.js` still imports `src/App.css`, the styles become a part of your application. You can now edit `src/App.scss`, and `src/App.css` will be regenerated.\n\nTo share variables between Sass files, you can use Sass imports. For example, `src/App.scss` and other component style files could include `@import \"./shared.scss\";` with variable definitions.\n\nTo enable importing files without using relative paths, you can add the `--include-path` option to the command in `package.json`.\n\n```\n\"build-css\": \"node-sass-chokidar --include-path ./src --include-path ./node_modules src/ -o src/\",\n\"watch-css\": \"npm run build-css && node-sass-chokidar --include-path ./src --include-path ./node_modules src/ -o src/ --watch --recursive\",\n```\n\nThis will allow you to do imports like\n\n```scss\n@import 'styles/_colors.scss'; // assuming a styles directory under src/\n@import 'nprogress/nprogress'; // importing a css file from the nprogress node module\n```\n\nAt this point you might want to remove all CSS files from the source control, and add `src/**/*.css` to your `.gitignore` file. It is generally a good practice to keep the build products outside of the source control.\n\nAs a final step, you may find it convenient to run `watch-css` automatically with `npm start`, and run `build-css` as a part of `npm run build`. You can use the `&&` operator to execute two scripts sequentially. However, there is no cross-platform way to run two scripts in parallel, so we will install a package for this:\n\n```sh\nnpm install --save npm-run-all\n```\n\nAlternatively you may use `yarn`:\n\n```sh\nyarn add npm-run-all\n```\n\nThen we can change `start` and `build` scripts to include the CSS preprocessor commands:\n\n```diff\n   \"scripts\": {\n     \"build-css\": \"node-sass-chokidar src/ -o src/\",\n     \"watch-css\": \"npm run build-css && node-sass-chokidar src/ -o src/ --watch --recursive\",\n-    \"start\": \"react-scripts start\",\n-    \"build\": \"react-scripts build\",\n+    \"start-js\": \"react-scripts start\",\n+    \"start\": \"npm-run-all -p watch-css start-js\",\n+    \"build\": \"npm run build-css && react-scripts build\",\n     \"test\": \"react-scripts test --env=jsdom\",\n     \"eject\": \"react-scripts eject\"\n   }\n```\n\nNow running `npm start` and `npm run build` also builds Sass files.\n\n**Why `node-sass-chokidar`?**\n\n`node-sass` has been reported as having the following issues:\n\n- `node-sass --watch` has been reported to have _performance issues_ in certain conditions when used in a virtual machine or with docker.\n\n- Infinite styles compiling [#1939](https://github.com/facebookincubator/create-react-app/issues/1939)\n\n- `node-sass` has been reported as having issues with detecting new files in a directory [#1891](https://github.com/sass/node-sass/issues/1891)\n\n`node-sass-chokidar` is used here as it addresses these issues.\n\n## Adding Images, Fonts, and Files\n\nWith Webpack, using static assets like images and fonts works similarly to CSS.\n\nYou can **`import` a file right in a JavaScript module**. This tells Webpack to include that file in the bundle. Unlike CSS imports, importing a file gives you a string value. This value is the final path you can reference in your code, e.g. as the `src` attribute of an image or the `href` of a link to a PDF.\n\nTo reduce the number of requests to the server, importing images that are less than 10,000 bytes returns a [data URI](https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/Data_URIs) instead of a path. This applies to the following file extensions: bmp, gif, jpg, jpeg, and png. SVG files are excluded due to [#1153](https://github.com/facebookincubator/create-react-app/issues/1153).\n\nHere is an example:\n\n```js\nimport React from 'react';\nimport logo from './logo.png'; // Tell Webpack this JS file uses this image\n\nconsole.log(logo); // /logo.84287d09.png\n\nfunction Header() {\n  // Import result is the URL of your image\n  return <img src={logo} alt=\"Logo\" />;\n}\n\nexport default Header;\n```\n\nThis ensures that when the project is built, Webpack will correctly move the images into the build folder, and provide us with correct paths.\n\nThis works in CSS too:\n\n```css\n.Logo {\n  background-image: url(./logo.png);\n}\n```\n\nWebpack finds all relative module references in CSS (they start with `./`) and replaces them with the final paths from the compiled bundle. If you make a typo or accidentally delete an important file, you will see a compilation error, just like when you import a non-existent JavaScript module. The final filenames in the compiled bundle are generated by Webpack from content hashes. If the file content changes in the future, Webpack will give it a different name in production so you don’t need to worry about long-term caching of assets.\n\nPlease be advised that this is also a custom feature of Webpack.\n\n**It is not required for React** but many people enjoy it (and React Native uses a similar mechanism for images).<br>\nAn alternative way of handling static assets is described in the next section.\n\n## Using the `public` Folder\n\n> Note: this feature is available with `react-scripts@0.5.0` and higher.\n\n### Changing the HTML\n\nThe `public` folder contains the HTML file so you can tweak it, for example, to [set the page title](#changing-the-page-title).\nThe `<script>` tag with the compiled code will be added to it automatically during the build process.\n\n### Adding Assets Outside of the Module System\n\nYou can also add other assets to the `public` folder.\n\nNote that we normally encourage you to `import` assets in JavaScript files instead.\nFor example, see the sections on [adding a stylesheet](#adding-a-stylesheet) and [adding images and fonts](#adding-images-fonts-and-files).\nThis mechanism provides a number of benefits:\n\n- Scripts and stylesheets get minified and bundled together to avoid extra network requests.\n- Missing files cause compilation errors instead of 404 errors for your users.\n- Result filenames include content hashes so you don’t need to worry about browsers caching their old versions.\n\nHowever there is an **escape hatch** that you can use to add an asset outside of the module system.\n\nIf you put a file into the `public` folder, it will **not** be processed by Webpack. Instead it will be copied into the build folder untouched. To reference assets in the `public` folder, you need to use a special variable called `PUBLIC_URL`.\n\nInside `index.html`, you can use it like this:\n\n```html\n<link rel=\"shortcut icon\" href=\"%PUBLIC_URL%/favicon.ico\" />\n```\n\nOnly files inside the `public` folder will be accessible by `%PUBLIC_URL%` prefix. If you need to use a file from `src` or `node_modules`, you’ll have to copy it there to explicitly specify your intention to make this file a part of the build.\n\nWhen you run `npm run build`, Create React App will substitute `%PUBLIC_URL%` with a correct absolute path so your project works even if you use client-side routing or host it at a non-root URL.\n\nIn JavaScript code, you can use `process.env.PUBLIC_URL` for similar purposes:\n\n```js\nrender() {\n  // Note: this is an escape hatch and should be used sparingly!\n  // Normally we recommend using `import` for getting asset URLs\n  // as described in “Adding Images and Fonts” above this section.\n  return <img src={process.env.PUBLIC_URL + '/img/logo.png'} />;\n}\n```\n\nKeep in mind the downsides of this approach:\n\n- None of the files in `public` folder get post-processed or minified.\n- Missing files will not be called at compilation time, and will cause 404 errors for your users.\n- Result filenames won’t include content hashes so you’ll need to add query arguments or rename them every time they change.\n\n### When to Use the `public` Folder\n\nNormally we recommend importing [stylesheets](#adding-a-stylesheet), [images, and fonts](#adding-images-fonts-and-files) from JavaScript.\nThe `public` folder is useful as a workaround for a number of less common cases:\n\n- You need a file with a specific name in the build output, such as [`manifest.webmanifest`](https://developer.mozilla.org/en-US/docs/Web/Manifest).\n- You have thousands of images and need to dynamically reference their paths.\n- You want to include a small script like [`pace.js`](http://github.hubspot.com/pace/docs/welcome/) outside of the bundled code.\n- Some library may be incompatible with Webpack and you have no other option but to include it as a `<script>` tag.\n\nNote that if you add a `<script>` that declares global variables, you also need to read the next section on using them.\n\n## Using Global Variables\n\nWhen you include a script in the HTML file that defines global variables and try to use one of these variables in the code, the linter will complain because it cannot see the definition of the variable.\n\nYou can avoid this by reading the global variable explicitly from the `window` object, for example:\n\n```js\nconst $ = window.$;\n```\n\nThis makes it obvious you are using a global variable intentionally rather than because of a typo.\n\nAlternatively, you can force the linter to ignore any line by adding `// eslint-disable-line` after it.\n\n## Adding Bootstrap\n\nYou don’t have to use [React Bootstrap](https://react-bootstrap.github.io) together with React but it is a popular library for integrating Bootstrap with React apps. If you need it, you can integrate it with Create React App by following these steps:\n\nInstall React Bootstrap and Bootstrap from npm. React Bootstrap does not include Bootstrap CSS so this needs to be installed as well:\n\n```sh\nnpm install --save react-bootstrap bootstrap@3\n```\n\nAlternatively you may use `yarn`:\n\n```sh\nyarn add react-bootstrap bootstrap@3\n```\n\nImport Bootstrap CSS and optionally Bootstrap theme CSS in the beginning of your `src/index.js` file:\n\n```js\nimport 'bootstrap/dist/css/bootstrap.css';\nimport 'bootstrap/dist/css/bootstrap-theme.css';\n// Put any other imports below so that CSS from your\n// components takes precedence over default styles.\n```\n\nImport required React Bootstrap components within `src/App.js` file or your custom component files:\n\n```js\nimport { Navbar, Jumbotron, Button } from 'react-bootstrap';\n```\n\nNow you are ready to use the imported React Bootstrap components within your component hierarchy defined in the render method. Here is an example [`App.js`](https://gist.githubusercontent.com/gaearon/85d8c067f6af1e56277c82d19fd4da7b/raw/6158dd991b67284e9fc8d70b9d973efe87659d72/App.js) redone using React Bootstrap.\n\n### Using a Custom Theme\n\nSometimes you might need to tweak the visual styles of Bootstrap (or equivalent package).<br>\nWe suggest the following approach:\n\n- Create a new package that depends on the package you wish to customize, e.g. Bootstrap.\n- Add the necessary build steps to tweak the theme, and publish your package on npm.\n- Install your own theme npm package as a dependency of your app.\n\nHere is an example of adding a [customized Bootstrap](https://medium.com/@tacomanator/customizing-create-react-app-aa9ffb88165) that follows these steps.\n\n## Adding Flow\n\nFlow is a static type checker that helps you write code with fewer bugs. Check out this [introduction to using static types in JavaScript](https://medium.com/@preethikasireddy/why-use-static-types-in-javascript-part-1-8382da1e0adb) if you are new to this concept.\n\nRecent versions of [Flow](http://flowtype.org/) work with Create React App projects out of the box.\n\nTo add Flow to a Create React App project, follow these steps:\n\n1. Run `npm install --save flow-bin` (or `yarn add flow-bin`).\n2. Add `\"flow\": \"flow\"` to the `scripts` section of your `package.json`.\n3. Run `npm run flow init` (or `yarn flow init`) to create a [`.flowconfig` file](https://flowtype.org/docs/advanced-configuration.html) in the root directory.\n4. Add `// @flow` to any files you want to type check (for example, to `src/App.js`).\n\nNow you can run `npm run flow` (or `yarn flow`) to check the files for type errors.\nYou can optionally use an IDE like [Nuclide](https://nuclide.io/docs/languages/flow/) for a better integrated experience.\nIn the future we plan to integrate it into Create React App even more closely.\n\nTo learn more about Flow, check out [its documentation](https://flowtype.org/).\n\n## Adding Custom Environment Variables\n\n> Note: this feature is available with `react-scripts@0.2.3` and higher.\n\nYour project can consume variables declared in your environment as if they were declared locally in your JS files. By\ndefault you will have `NODE_ENV` defined for you, and any other environment variables starting with\n`REACT_APP_`.\n\n**The environment variables are embedded during the build time**. Since Create React App produces a static HTML/CSS/JS bundle, it can’t possibly read them at runtime. To read them at runtime, you would need to load HTML into memory on the server and replace placeholders in runtime, just like [described here](#injecting-data-from-the-server-into-the-page). Alternatively you can rebuild the app on the server anytime you change them.\n\n> Note: You must create custom environment variables beginning with `REACT_APP_`. Any other variables except `NODE_ENV` will be ignored to avoid accidentally [exposing a private key on the machine that could have the same name](https://github.com/facebookincubator/create-react-app/issues/865#issuecomment-252199527). Changing any environment variables will require you to restart the development server if it is running.\n\nThese environment variables will be defined for you on `process.env`. For example, having an environment\nvariable named `REACT_APP_SECRET_CODE` will be exposed in your JS as `process.env.REACT_APP_SECRET_CODE`.\n\nThere is also a special built-in environment variable called `NODE_ENV`. You can read it from `process.env.NODE_ENV`. When you run `npm start`, it is always equal to `'development'`, when you run `npm test` it is always equal to `'test'`, and when you run `npm run build` to make a production bundle, it is always equal to `'production'`. **You cannot override `NODE_ENV` manually.** This prevents developers from accidentally deploying a slow development build to production.\n\nThese environment variables can be useful for displaying information conditionally based on where the project is\ndeployed or consuming sensitive data that lives outside of version control.\n\nFirst, you need to have environment variables defined. For example, let’s say you wanted to consume a secret defined\nin the environment inside a `<form>`:\n\n```jsx\nrender() {\n  return (\n    <div>\n      <small>You are running this application in <b>{process.env.NODE_ENV}</b> mode.</small>\n      <form>\n        <input type=\"hidden\" defaultValue={process.env.REACT_APP_SECRET_CODE} />\n      </form>\n    </div>\n  );\n}\n```\n\nDuring the build, `process.env.REACT_APP_SECRET_CODE` will be replaced with the current value of the `REACT_APP_SECRET_CODE` environment variable. Remember that the `NODE_ENV` variable will be set for you automatically.\n\nWhen you load the app in the browser and inspect the `<input>`, you will see its value set to `abcdef`, and the bold text will show the environment provided when using `npm start`:\n\n```html\n<div>\n  <small>You are running this application in <b>development</b> mode.</small>\n  <form>\n    <input type=\"hidden\" value=\"abcdef\" />\n  </form>\n</div>\n```\n\nThe above form is looking for a variable called `REACT_APP_SECRET_CODE` from the environment. In order to consume this\nvalue, we need to have it defined in the environment. This can be done using two ways: either in your shell or in\na `.env` file. Both of these ways are described in the next few sections.\n\nHaving access to the `NODE_ENV` is also useful for performing actions conditionally:\n\n```js\nif (process.env.NODE_ENV !== 'production') {\n  analytics.disable();\n}\n```\n\nWhen you compile the app with `npm run build`, the minification step will strip out this condition, and the resulting bundle will be smaller.\n\n### Referencing Environment Variables in the HTML\n\n> Note: this feature is available with `react-scripts@0.9.0` and higher.\n\nYou can also access the environment variables starting with `REACT_APP_` in the `public/index.html`. For example:\n\n```html\n<title>%REACT_APP_WEBSITE_NAME%</title>\n```\n\nNote that the caveats from the above section apply:\n\n- Apart from a few built-in variables (`NODE_ENV` and `PUBLIC_URL`), variable names must start with `REACT_APP_` to work.\n- The environment variables are injected at build time. If you need to inject them at runtime, [follow this approach instead](#generating-dynamic-meta-tags-on-the-server).\n\n### Adding Temporary Environment Variables In Your Shell\n\nDefining environment variables can vary between OSes. It’s also important to know that this manner is temporary for the\nlife of the shell session.\n\n#### Windows (cmd.exe)\n\n```cmd\nset REACT_APP_SECRET_CODE=abcdef&&npm start\n```\n\n(Note: the lack of whitespace is intentional.)\n\n#### Linux, macOS (Bash)\n\n```bash\nREACT_APP_SECRET_CODE=abcdef npm start\n```\n\n### Adding Development Environment Variables In `.env`\n\n> Note: this feature is available with `react-scripts@0.5.0` and higher.\n\nTo define permanent environment variables, create a file called `.env` in the root of your project:\n\n```\nREACT_APP_SECRET_CODE=abcdef\n```\n\n`.env` files **should be** checked into source control (with the exclusion of `.env*.local`).\n\n#### What other `.env` files can be used?\n\n> Note: this feature is **available with `react-scripts@1.0.0` and higher**.\n\n- `.env`: Default.\n- `.env.local`: Local overrides. **This file is loaded for all environments except test.**\n- `.env.development`, `.env.test`, `.env.production`: Environment-specific settings.\n- `.env.development.local`, `.env.test.local`, `.env.production.local`: Local overrides of environment-specific settings.\n\nFiles on the left have more priority than files on the right:\n\n- `npm start`: `.env.development.local`, `.env.development`, `.env.local`, `.env`\n- `npm run build`: `.env.production.local`, `.env.production`, `.env.local`, `.env`\n- `npm test`: `.env.test.local`, `.env.test`, `.env` (note `.env.local` is missing)\n\nThese variables will act as the defaults if the machine does not explicitly set them.<br>\nPlease refer to the [dotenv documentation](https://github.com/motdotla/dotenv) for more details.\n\n> Note: If you are defining environment variables for development, your CI and/or hosting platform will most likely need\n> these are defined as well. Consult their documentation how to do this. For example, see the documentation for [Travis CI](https://docs.travis-ci.com/user/environment-variables/) or [Heroku](https://devcenter.heroku.com/articles/config-vars).\n\n## Can I Use Decorators?\n\nMany popular libraries use [decorators](https://medium.com/google-developers/exploring-es7-decorators-76ecb65fb841) in their documentation.<br>\nCreate React App doesn’t support decorator syntax at the moment because:\n\n- It is an experimental proposal and is subject to change.\n- The current specification version is not officially supported by Babel.\n- If the specification changes, we won’t be able to write a codemod because we don’t use them internally at Facebook.\n\nHowever in many cases you can rewrite decorator-based code without decorators just as fine.<br>\nPlease refer to these two threads for reference:\n\n- [#214](https://github.com/facebookincubator/create-react-app/issues/214)\n- [#411](https://github.com/facebookincubator/create-react-app/issues/411)\n\nCreate React App will add decorator support when the specification advances to a stable stage.\n\n## Integrating with an API Backend\n\nThese tutorials will help you to integrate your app with an API backend running on another port,\nusing `fetch()` to access it.\n\n### Node\n\nCheck out [this tutorial](https://www.fullstackreact.com/articles/using-create-react-app-with-a-server/).\nYou can find the companion GitHub repository [here](https://github.com/fullstackreact/food-lookup-demo).\n\n### Ruby on Rails\n\nCheck out [this tutorial](https://www.fullstackreact.com/articles/how-to-get-create-react-app-to-work-with-your-rails-api/).\nYou can find the companion GitHub repository [here](https://github.com/fullstackreact/food-lookup-demo-rails).\n\n## Proxying API Requests in Development\n\n> Note: this feature is available with `react-scripts@0.2.3` and higher.\n\nPeople often serve the front-end React app from the same host and port as their backend implementation.<br>\nFor example, a production setup might look like this after the app is deployed:\n\n```\n/             - static server returns index.html with React app\n/todos        - static server returns index.html with React app\n/api/todos    - server handles any /api/* requests using the backend implementation\n```\n\nSuch setup is **not** required. However, if you **do** have a setup like this, it is convenient to write requests like `fetch('/api/todos')` without worrying about redirecting them to another host or port during development.\n\nTo tell the development server to proxy any unknown requests to your API server in development, add a `proxy` field to your `package.json`, for example:\n\n```js\n  \"proxy\": \"http://localhost:4000\",\n```\n\nThis way, when you `fetch('/api/todos')` in development, the development server will recognize that it’s not a static asset, and will proxy your request to `http://localhost:4000/api/todos` as a fallback. The development server will only attempt to send requests without a `text/html` accept header to the proxy.\n\nConveniently, this avoids [CORS issues](http://stackoverflow.com/questions/21854516/understanding-ajax-cors-and-security-considerations) and error messages like this in development:\n\n```\nFetch API cannot load http://localhost:4000/api/todos. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:3000' is therefore not allowed access. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.\n```\n\nKeep in mind that `proxy` only has effect in development (with `npm start`), and it is up to you to ensure that URLs like `/api/todos` point to the right thing in production. You don’t have to use the `/api` prefix. Any unrecognized request without a `text/html` accept header will be redirected to the specified `proxy`.\n\nThe `proxy` option supports HTTP, HTTPS and WebSocket connections.<br>\nIf the `proxy` option is **not** flexible enough for you, alternatively you can:\n\n- [Configure the proxy yourself](#configuring-the-proxy-manually)\n- Enable CORS on your server ([here’s how to do it for Express](http://enable-cors.org/server_expressjs.html)).\n- Use [environment variables](#adding-custom-environment-variables) to inject the right server host and port into your app.\n\n### \"Invalid Host Header\" Errors After Configuring Proxy\n\nWhen you enable the `proxy` option, you opt into a more strict set of host checks. This is necessary because leaving the backend open to remote hosts makes your computer vulnerable to DNS rebinding attacks. The issue is explained in [this article](https://medium.com/webpack/webpack-dev-server-middleware-security-issues-1489d950874a) and [this issue](https://github.com/webpack/webpack-dev-server/issues/887).\n\nThis shouldn’t affect you when developing on `localhost`, but if you develop remotely like [described here](https://github.com/facebookincubator/create-react-app/issues/2271), you will see this error in the browser after enabling the `proxy` option:\n\n> Invalid Host header\n\nTo work around it, you can specify your public development host in a file called `.env.development` in the root of your project:\n\n```\nHOST=mypublicdevhost.com\n```\n\nIf you restart the development server now and load the app from the specified host, it should work.\n\nIf you are still having issues or if you’re using a more exotic environment like a cloud editor, you can bypass the host check completely by adding a line to `.env.development.local`. **Note that this is dangerous and exposes your machine to remote code execution from malicious websites:**\n\n```\n# NOTE: THIS IS DANGEROUS!\n# It exposes your machine to attacks from the websites you visit.\nDANGEROUSLY_DISABLE_HOST_CHECK=true\n```\n\nWe don’t recommend this approach.\n\n### Configuring the Proxy Manually\n\n> Note: this feature is available with `react-scripts@1.0.0` and higher.\n\nIf the `proxy` option is **not** flexible enough for you, you can specify an object in the following form (in `package.json`).<br>\nYou may also specify any configuration value [`http-proxy-middleware`](https://github.com/chimurai/http-proxy-middleware#options) or [`http-proxy`](https://github.com/nodejitsu/node-http-proxy#options) supports.\n\n```js\n{\n  // ...\n  \"proxy\": {\n    \"/api\": {\n      \"target\": \"<url>\",\n      \"ws\": true\n      // ...\n    }\n  }\n  // ...\n}\n```\n\nAll requests matching this path will be proxies, no exceptions. This includes requests for `text/html`, which the standard `proxy` option does not proxy.\n\nIf you need to specify multiple proxies, you may do so by specifying additional entries.\nYou may also narrow down matches using `*` and/or `**`, to match the path exactly or any subpath.\n\n```js\n{\n  // ...\n  \"proxy\": {\n    // Matches any request starting with /api\n    \"/api\": {\n      \"target\": \"<url_1>\",\n      \"ws\": true\n      // ...\n    },\n    // Matches any request starting with /foo\n    \"/foo\": {\n      \"target\": \"<url_2>\",\n      \"ssl\": true,\n      \"pathRewrite\": {\n        \"^/foo\": \"/foo/beta\"\n      }\n      // ...\n    },\n    // Matches /bar/abc.html but not /bar/sub/def.html\n    \"/bar/*.html\": {\n      \"target\": \"<url_3>\",\n      // ...\n    },\n    // Matches /baz/abc.html and /baz/sub/def.html\n    \"/baz/**/*.html\": {\n      \"target\": \"<url_4>\"\n      // ...\n    }\n  }\n  // ...\n}\n```\n\n### Configuring a WebSocket Proxy\n\nWhen setting up a WebSocket proxy, there are some extra considerations to be aware of.\n\nIf you’re using a WebSocket engine like [Socket.io](https://socket.io/), you must have a Socket.io server running that you can use as the proxy target. Socket.io will not work with a standard WebSocket server. Specifically, don't expect Socket.io to work with [the websocket.org echo test](http://websocket.org/echo.html).\n\nThere’s some good documentation available for [setting up a Socket.io server](https://socket.io/docs/).\n\nStandard WebSockets **will** work with a standard WebSocket server as well as the websocket.org echo test. You can use libraries like [ws](https://github.com/websockets/ws) for the server, with [native WebSockets in the browser](https://developer.mozilla.org/en-US/docs/Web/API/WebSocket).\n\nEither way, you can proxy WebSocket requests manually in `package.json`:\n\n```js\n{\n  // ...\n  \"proxy\": {\n    \"/socket\": {\n      // Your compatible WebSocket server\n      \"target\": \"ws://<socket_url>\",\n      // Tell http-proxy-middleware that this is a WebSocket proxy.\n      // Also allows you to proxy WebSocket requests without an additional HTTP request\n      // https://github.com/chimurai/http-proxy-middleware#external-websocket-upgrade\n      \"ws\": true\n      // ...\n    }\n  }\n  // ...\n}\n```\n\n## Using HTTPS in Development\n\n> Note: this feature is available with `react-scripts@0.4.0` and higher.\n\nYou may require the dev server to serve pages over HTTPS. One particular case where this could be useful is when using [the \"proxy\" feature](#proxying-api-requests-in-development) to proxy requests to an API server when that API server is itself serving HTTPS.\n\nTo do this, set the `HTTPS` environment variable to `true`, then start the dev server as usual with `npm start`:\n\n#### Windows (cmd.exe)\n\n```cmd\nset HTTPS=true&&npm start\n```\n\n(Note: the lack of whitespace is intentional.)\n\n#### Linux, macOS (Bash)\n\n```bash\nHTTPS=true npm start\n```\n\nNote that the server will use a self-signed certificate, so your web browser will almost definitely display a warning upon accessing the page.\n\n## Generating Dynamic `<meta>` Tags on the Server\n\nSince Create React App doesn’t support server rendering, you might be wondering how to make `<meta>` tags dynamic and reflect the current URL. To solve this, we recommend to add placeholders into the HTML, like this:\n\n```html\n<!doctype html>\n<html lang=\"en\">\n  <head>\n    <meta property=\"og:title\" content=\"__OG_TITLE__\" />\n    <meta property=\"og:description\" content=\"__OG_DESCRIPTION__\" />\n  </head>\n</html>\n```\n\nThen, on the server, regardless of the backend you use, you can read `index.html` into memory and replace `__OG_TITLE__`, `__OG_DESCRIPTION__`, and any other placeholders with values depending on the current URL. Just make sure to sanitize and escape the interpolated values so that they are safe to embed into HTML!\n\nIf you use a Node server, you can even share the route matching logic between the client and the server. However duplicating it also works fine in simple cases.\n\n## Pre-Rendering into Static HTML Files\n\nIf you’re hosting your `build` with a static hosting provider you can use [react-snapshot](https://www.npmjs.com/package/react-snapshot) to generate HTML pages for each route, or relative link, in your application. These pages will then seamlessly become active, or “hydrated”, when the JavaScript bundle has loaded.\n\nThere are also opportunities to use this outside of static hosting, to take the pressure off the server when generating and caching routes.\n\nThe primary benefit of pre-rendering is that you get the core content of each page _with_ the HTML payload—regardless of whether or not your JavaScript bundle successfully downloads. It also increases the likelihood that each route of your application will be picked up by search engines.\n\nYou can read more about [zero-configuration pre-rendering (also called snapshotting) here](https://medium.com/superhighfives/an-almost-static-stack-6df0a2791319).\n\n## Injecting Data from the Server into the Page\n\nSimilarly to the previous section, you can leave some placeholders in the HTML that inject global variables, for example:\n\n```js\n<!doctype html>\n<html lang=\"en\">\n  <head>\n    <script>\n      window.SERVER_DATA = __SERVER_DATA__;\n    </script>\n```\n\nThen, on the server, you can replace `__SERVER_DATA__` with a JSON of real data right before sending the response. The client code can then read `window.SERVER_DATA` to use it. **Make sure to [sanitize the JSON before sending it to the client](https://medium.com/node-security/the-most-common-xss-vulnerability-in-react-js-applications-2bdffbcc1fa0) as it makes your app vulnerable to XSS attacks.**\n\n## Running Tests\n\n> Note: this feature is available with `react-scripts@0.3.0` and higher.<br> >[Read the migration guide to learn how to enable it in older projects!](https://github.com/facebookincubator/create-react-app/blob/master/CHANGELOG.md#migrating-from-023-to-030)\n\nCreate React App uses [Jest](https://facebook.github.io/jest/) as its test runner. To prepare for this integration, we did a [major revamp](https://facebook.github.io/jest/blog/2016/09/01/jest-15.html) of Jest so if you heard bad things about it years ago, give it another try.\n\nJest is a Node-based runner. This means that the tests always run in a Node environment and not in a real browser. This lets us enable fast iteration speed and prevent flakiness.\n\nWhile Jest provides browser globals such as `window` thanks to [jsdom](https://github.com/tmpvar/jsdom), they are only approximations of the real browser behavior. Jest is intended to be used for unit tests of your logic and your components rather than the DOM quirks.\n\nWe recommend that you use a separate tool for browser end-to-end tests if you need them. They are beyond the scope of Create React App.\n\n### Filename Conventions\n\nJest will look for test files with any of the following popular naming conventions:\n\n- Files with `.js` suffix in `__tests__` folders.\n- Files with `.test.js` suffix.\n- Files with `.spec.js` suffix.\n\nThe `.test.js` / `.spec.js` files (or the `__tests__` folders) can be located at any depth under the `src` top level folder.\n\nWe recommend to put the test files (or `__tests__` folders) next to the code they are testing so that relative imports appear shorter. For example, if `App.test.js` and `App.js` are in the same folder, the test just needs to `import App from './App'` instead of a long relative path. Colocation also helps find tests more quickly in larger projects.\n\n### Command Line Interface\n\nWhen you run `npm test`, Jest will launch in the watch mode. Every time you save a file, it will re-run the tests, just like `npm start` recompiles the code.\n\nThe watcher includes an interactive command-line interface with the ability to run all tests, or focus on a search pattern. It is designed this way so that you can keep it open and enjoy fast re-runs. You can learn the commands from the “Watch Usage” note that the watcher prints after every run:\n\n![Jest watch mode](http://facebook.github.io/jest/img/blog/15-watch.gif)\n\n### Version Control Integration\n\nBy default, when you run `npm test`, Jest will only run the tests related to files changed since the last commit. This is an optimization designed to make your tests run fast regardless of how many tests you have. However it assumes that you don’t often commit the code that doesn’t pass the tests.\n\nJest will always explicitly mention that it only ran tests related to the files changed since the last commit. You can also press `a` in the watch mode to force Jest to run all tests.\n\nJest will always run all tests on a [continuous integration](#continuous-integration) server or if the project is not inside a Git or Mercurial repository.\n\n### Writing Tests\n\nTo create tests, add `it()` (or `test()`) blocks with the name of the test and its code. You may optionally wrap them in `describe()` blocks for logical grouping but this is neither required nor recommended.\n\nJest provides a built-in `expect()` global function for making assertions. A basic test could look like this:\n\n```js\nimport sum from './sum';\n\nit('sums numbers', () => {\n  expect(sum(1, 2)).toEqual(3);\n  expect(sum(2, 2)).toEqual(4);\n});\n```\n\nAll `expect()` matchers supported by Jest are [extensively documented here](http://facebook.github.io/jest/docs/expect.html).<br>\nYou can also use [`jest.fn()` and `expect(fn).toBeCalled()`](http://facebook.github.io/jest/docs/expect.html#tohavebeencalled) to create “spies” or mock functions.\n\n### Testing Components\n\nThere is a broad spectrum of component testing techniques. They range from a “smoke test” verifying that a component renders without throwing, to shallow rendering and testing some of the output, to full rendering and testing component lifecycle and state changes.\n\nDifferent projects choose different testing tradeoffs based on how often components change, and how much logic they contain. If you haven’t decided on a testing strategy yet, we recommend that you start with creating simple smoke tests for your components:\n\n```js\nimport React from 'react';\nimport ReactDOM from 'react-dom';\nimport App from './App';\n\nit('renders without crashing', () => {\n  const div = document.createElement('div');\n  ReactDOM.render(<App />, div);\n});\n```\n\nThis test mounts a component and makes sure that it didn’t throw during rendering. Tests like this provide a lot value with very little effort so they are great as a starting point, and this is the test you will find in `src/App.test.js`.\n\nWhen you encounter bugs caused by changing components, you will gain a deeper insight into which parts of them are worth testing in your application. This might be a good time to introduce more specific tests asserting specific expected output or behavior.\n\nIf you’d like to test components in isolation from the child components they render, we recommend using [`shallow()` rendering API](http://airbnb.io/enzyme/docs/api/shallow.html) from [Enzyme](http://airbnb.io/enzyme/). To install it, run:\n\n```sh\nnpm install --save enzyme react-test-renderer\n```\n\nAlternatively you may use `yarn`:\n\n```sh\nyarn add enzyme react-test-renderer\n```\n\nYou can write a smoke test with it too:\n\n```js\nimport React from 'react';\nimport { shallow } from 'enzyme';\nimport App from './App';\n\nit('renders without crashing', () => {\n  shallow(<App />);\n});\n```\n\nUnlike the previous smoke test using `ReactDOM.render()`, this test only renders `<App>` and doesn’t go deeper. For example, even if `<App>` itself renders a `<Button>` that throws, this test will pass. Shallow rendering is great for isolated unit tests, but you may still want to create some full rendering tests to ensure the components integrate correctly. Enzyme supports [full rendering with `mount()`](http://airbnb.io/enzyme/docs/api/mount.html), and you can also use it for testing state changes and component lifecycle.\n\nYou can read the [Enzyme documentation](http://airbnb.io/enzyme/) for more testing techniques. Enzyme documentation uses Chai and Sinon for assertions but you don’t have to use them because Jest provides built-in `expect()` and `jest.fn()` for spies.\n\nHere is an example from Enzyme documentation that asserts specific output, rewritten to use Jest matchers:\n\n```js\nimport React from 'react';\nimport { shallow } from 'enzyme';\nimport App from './App';\n\nit('renders welcome message', () => {\n  const wrapper = shallow(<App />);\n  const welcome = <h2>Welcome to React</h2>;\n  // expect(wrapper.contains(welcome)).to.equal(true);\n  expect(wrapper.contains(welcome)).toEqual(true);\n});\n```\n\nAll Jest matchers are [extensively documented here](http://facebook.github.io/jest/docs/expect.html).<br>\nNevertheless you can use a third-party assertion library like [Chai](http://chaijs.com/) if you want to, as described below.\n\nAdditionally, you might find [jest-enzyme](https://github.com/blainekasten/enzyme-matchers) helpful to simplify your tests with readable matchers. The above `contains` code can be written simpler with jest-enzyme.\n\n```js\nexpect(wrapper).toContainReact(welcome);\n```\n\nTo enable this, install `jest-enzyme`:\n\n```sh\nnpm install --save jest-enzyme\n```\n\nAlternatively you may use `yarn`:\n\n```sh\nyarn add jest-enzyme\n```\n\nImport it in [`src/setupTests.js`](#initializing-test-environment) to make its matchers available in every test:\n\n```js\nimport 'jest-enzyme';\n```\n\n### Using Third Party Assertion Libraries\n\nWe recommend that you use `expect()` for assertions and `jest.fn()` for spies. If you are having issues with them please [file those against Jest](https://github.com/facebook/jest/issues/new), and we’ll fix them. We intend to keep making them better for React, supporting, for example, [pretty-printing React elements as JSX](https://github.com/facebook/jest/pull/1566).\n\nHowever, if you are used to other libraries, such as [Chai](http://chaijs.com/) and [Sinon](http://sinonjs.org/), or if you have existing code using them that you’d like to port over, you can import them normally like this:\n\n```js\nimport sinon from 'sinon';\nimport { expect } from 'chai';\n```\n\nand then use them in your tests like you normally do.\n\n### Initializing Test Environment\n\n> Note: this feature is available with `react-scripts@0.4.0` and higher.\n\nIf your app uses a browser API that you need to mock in your tests or if you just need a global setup before running your tests, add a `src/setupTests.js` to your project. It will be automatically executed before running your tests.\n\nFor example:\n\n#### `src/setupTests.js`\n\n```js\nconst localStorageMock = {\n  getItem: jest.fn(),\n  setItem: jest.fn(),\n  clear: jest.fn(),\n};\nglobal.localStorage = localStorageMock;\n```\n\n### Focusing and Excluding Tests\n\nYou can replace `it()` with `xit()` to temporarily exclude a test from being executed.<br>\nSimilarly, `fit()` lets you focus on a specific test without running any other tests.\n\n### Coverage Reporting\n\nJest has an integrated coverage reporter that works well with ES6 and requires no configuration.<br>\nRun `npm test -- --coverage` (note extra `--` in the middle) to include a coverage report like this:\n\n![coverage report](http://i.imgur.com/5bFhnTS.png)\n\nNote that tests run much slower with coverage so it is recommended to run it separately from your normal workflow.\n\n### Continuous Integration\n\nBy default `npm test` runs the watcher with interactive CLI. However, you can force it to run tests once and finish the process by setting an environment variable called `CI`.\n\nWhen creating a build of your application with `npm run build` linter warnings are not checked by default. Like `npm test`, you can force the build to perform a linter warning check by setting the environment variable `CI`. If any warnings are encountered then the build fails.\n\nPopular CI servers already set the environment variable `CI` by default but you can do this yourself too:\n\n### On CI servers\n\n#### Travis CI\n\n1. Following the [Travis Getting started](https://docs.travis-ci.com/user/getting-started/) guide for syncing your GitHub repository with Travis. You may need to initialize some settings manually in your [profile](https://travis-ci.org/profile) page.\n1. Add a `.travis.yml` file to your git repository.\n\n```\nlanguage: node_js\nnode_js:\n  - 6\ncache:\n  directories:\n    - node_modules\nscript:\n  - npm run build\n  - npm test\n```\n\n1. Trigger your first build with a git push.\n1. [Customize your Travis CI Build](https://docs.travis-ci.com/user/customizing-the-build/) if needed.\n\n#### CircleCI\n\nFollow [this article](https://medium.com/@knowbody/circleci-and-zeits-now-sh-c9b7eebcd3c1) to set up CircleCI with a Create React App project.\n\n### On your own environment\n\n##### Windows (cmd.exe)\n\n```cmd\nset CI=true&&npm test\n```\n\n```cmd\nset CI=true&&npm run build\n```\n\n(Note: the lack of whitespace is intentional.)\n\n##### Linux, macOS (Bash)\n\n```bash\nCI=true npm test\n```\n\n```bash\nCI=true npm run build\n```\n\nThe test command will force Jest to run tests once instead of launching the watcher.\n\n> If you find yourself doing this often in development, please [file an issue](https://github.com/facebookincubator/create-react-app/issues/new) to tell us about your use case because we want to make watcher the best experience and are open to changing how it works to accommodate more workflows.\n\nThe build command will check for linter warnings and fail if any are found.\n\n### Disabling jsdom\n\nBy default, the `package.json` of the generated project looks like this:\n\n```js\n  \"scripts\": {\n    \"start\": \"react-scripts start\",\n    \"build\": \"react-scripts build\",\n    \"test\": \"react-scripts test --env=jsdom\"\n```\n\nIf you know that none of your tests depend on [jsdom](https://github.com/tmpvar/jsdom), you can safely remove `--env=jsdom`, and your tests will run faster:\n\n```diff\n  \"scripts\": {\n    \"start\": \"react-scripts start\",\n    \"build\": \"react-scripts build\",\n-   \"test\": \"react-scripts test --env=jsdom\"\n+   \"test\": \"react-scripts test\"\n```\n\nTo help you make up your mind, here is a list of APIs that **need jsdom**:\n\n- Any browser globals like `window` and `document`\n- [`ReactDOM.render()`](https://facebook.github.io/react/docs/top-level-api.html#reactdom.render)\n- [`TestUtils.renderIntoDocument()`](https://facebook.github.io/react/docs/test-utils.html#renderintodocument) ([a shortcut](https://github.com/facebook/react/blob/34761cf9a252964abfaab6faf74d473ad95d1f21/src/test/ReactTestUtils.js#L83-L91) for the above)\n- [`mount()`](http://airbnb.io/enzyme/docs/api/mount.html) in [Enzyme](http://airbnb.io/enzyme/index.html)\n\nIn contrast, **jsdom is not needed** for the following APIs:\n\n- [`TestUtils.createRenderer()`](https://facebook.github.io/react/docs/test-utils.html#shallow-rendering) (shallow rendering)\n- [`shallow()`](http://airbnb.io/enzyme/docs/api/shallow.html) in [Enzyme](http://airbnb.io/enzyme/index.html)\n\nFinally, jsdom is also not needed for [snapshot testing](http://facebook.github.io/jest/blog/2016/07/27/jest-14.html).\n\n### Snapshot Testing\n\nSnapshot testing is a feature of Jest that automatically generates text snapshots of your components and saves them on the disk so if the UI output changes, you get notified without manually writing any assertions on the component output. [Read more about snapshot testing.](http://facebook.github.io/jest/blog/2016/07/27/jest-14.html)\n\n### Editor Integration\n\nIf you use [Visual Studio Code](https://code.visualstudio.com), there is a [Jest extension](https://github.com/orta/vscode-jest) which works with Create React App out of the box. This provides a lot of IDE-like features while using a text editor: showing the status of a test run with potential fail messages inline, starting and stopping the watcher automatically, and offering one-click snapshot updates.\n\n![VS Code Jest Preview](https://cloud.githubusercontent.com/assets/49038/20795349/a032308a-b7c8-11e6-9b34-7eeac781003f.png)\n\n## Developing Components in Isolation\n\nUsually, in an app, you have a lot of UI components, and each of them has many different states.\nFor an example, a simple button component could have following states:\n\n- In a regular state, with a text label.\n- In the disabled mode.\n- In a loading state.\n\nUsually, it’s hard to see these states without running a sample app or some examples.\n\nCreate React App doesn’t include any tools for this by default, but you can easily add [Storybook for React](https://storybook.js.org) ([source](https://github.com/storybooks/storybook)) or [React Styleguidist](https://react-styleguidist.js.org/) ([source](https://github.com/styleguidist/react-styleguidist)) to your project. **These are third-party tools that let you develop components and see all their states in isolation from your app**.\n\n![Storybook for React Demo](http://i.imgur.com/7CIAWpB.gif)\n\nYou can also deploy your Storybook or style guide as a static app. This way, everyone in your team can view and review different states of UI components without starting a backend server or creating an account in your app.\n\n### Getting Started with Storybook\n\nStorybook is a development environment for React UI components. It allows you to browse a component library, view the different states of each component, and interactively develop and test components.\n\nFirst, install the following npm package globally:\n\n```sh\nnpm install -g @storybook/cli\n```\n\nThen, run the following command inside your app’s directory:\n\n```sh\ngetstorybook\n```\n\nAfter that, follow the instructions on the screen.\n\nLearn more about React Storybook:\n\n- Screencast: [Getting Started with React Storybook](https://egghead.io/lessons/react-getting-started-with-react-storybook)\n- [GitHub Repo](https://github.com/storybooks/storybook)\n- [Documentation](https://storybook.js.org/basics/introduction/)\n- [Snapshot Testing UI](https://github.com/storybooks/storybook/tree/master/addons/storyshots) with Storybook + addon/storyshot\n\n### Getting Started with Styleguidist\n\nStyleguidist combines a style guide, where all your components are presented on a single page with their props documentation and usage examples, with an environment for developing components in isolation, similar to Storybook. In Styleguidist you write examples in Markdown, where each code snippet is rendered as a live editable playground.\n\nFirst, install Styleguidist:\n\n```sh\nnpm install --save react-styleguidist\n```\n\nAlternatively you may use `yarn`:\n\n```sh\nyarn add react-styleguidist\n```\n\nThen, add these scripts to your `package.json`:\n\n```diff\n   \"scripts\": {\n+    \"styleguide\": \"styleguidist server\",\n+    \"styleguide:build\": \"styleguidist build\",\n     \"start\": \"react-scripts start\",\n```\n\nThen, run the following command inside your app’s directory:\n\n```sh\nnpm run styleguide\n```\n\nAfter that, follow the instructions on the screen.\n\nLearn more about React Styleguidist:\n\n- [GitHub Repo](https://github.com/styleguidist/react-styleguidist)\n- [Documentation](https://react-styleguidist.js.org/docs/getting-started.html)\n\n## Making a Progressive Web App\n\nBy default, the production build is a fully functional, offline-first\n[Progressive Web App](https://developers.google.com/web/progressive-web-apps/).\n\nProgressive Web Apps are faster and more reliable than traditional web pages, and provide an engaging mobile experience:\n\n- All static site assets are cached so that your page loads fast on subsequent visits, regardless of network connectivity (such as 2G or 3G). Updates are downloaded in the background.\n- Your app will work regardless of network state, even if offline. This means your users will be able to use your app at 10,000 feet and on the Subway.\n- On mobile devices, your app can be added directly to the user's home screen, app icon and all. You can also re-engage users using web **push notifications**. This eliminates the need for the app store.\n\nThe [`sw-precache-webpack-plugin`](https://github.com/goldhand/sw-precache-webpack-plugin)\nis integrated into production configuration,\nand it will take care of generating a service worker file that will automatically\nprecache all of your local assets and keep them up to date as you deploy updates.\nThe service worker will use a [cache-first strategy](https://developers.google.com/web/fundamentals/instant-and-offline/offline-cookbook/#cache-falling-back-to-network)\nfor handling all requests for local assets, including the initial HTML, ensuring\nthat your web app is reliably fast, even on a slow or unreliable network.\n\n### Opting Out of Caching\n\nIf you would prefer not to enable service workers prior to your initial\nproduction deployment, then remove the call to `serviceWorkerRegistration.register()`\nfrom [`src/index.js`](src/index.js).\n\nIf you had previously enabled service workers in your production deployment and\nhave decided that you would like to disable them for all your existing users,\nyou can swap out the call to `serviceWorkerRegistration.register()` in\n[`src/index.js`](src/index.js) with a call to `serviceWorkerRegistration.unregister()`.\nAfter the user visits a page that has `serviceWorkerRegistration.unregister()`,\nthe service worker will be uninstalled. Note that depending on how `/service-worker.js` is served,\nit may take up to 24 hours for the cache to be invalidated.\n\n### Offline-First Considerations\n\n1. Service workers [require HTTPS](https://developers.google.com/web/fundamentals/getting-started/primers/service-workers#you_need_https),\n   although to facilitate local testing, that policy\n   [does not apply to `localhost`](http://stackoverflow.com/questions/34160509/options-for-testing-service-workers-via-http/34161385#34161385).\n   If your production web server does not support HTTPS, then the service worker\n   registration will fail, but the rest of your web app will remain functional.\n\n1. Service workers are [not currently supported](https://jakearchibald.github.io/isserviceworkerready/)\n   in all web browsers. Service worker registration [won't be attempted](src/registerServiceWorker.js)\n   on browsers that lack support.\n\n1. The service worker is only enabled in the [production environment](#deployment),\n   e.g. the output of `npm run build`. It's recommended that you do not enable an\n   offline-first service worker in a development environment, as it can lead to\n   frustration when previously cached assets are used and do not include the latest\n   changes you've made locally.\n\n1. If you _need_ to test your offline-first service worker locally, build\n   the application (using `npm run build`) and run a simple http server from your\n   build directory. After running the build script, `create-react-app` will give\n   instructions for one way to test your production build locally and the [deployment instructions](#deployment) have\n   instructions for using other methods. _Be sure to always use an\n   incognito window to avoid complications with your browser cache._\n\n1. If possible, configure your production environment to serve the generated\n   `service-worker.js` [with HTTP caching disabled](http://stackoverflow.com/questions/38843970/service-worker-javascript-update-frequency-every-24-hours).\n   If that's not possible—[GitHub Pages](#github-pages), for instance, does not\n   allow you to change the default 10 minute HTTP cache lifetime—then be aware\n   that if you visit your production site, and then revisit again before\n   `service-worker.js` has expired from your HTTP cache, you'll continue to get\n   the previously cached assets from the service worker. If you have an immediate\n   need to view your updated production deployment, performing a shift-refresh\n   will temporarily disable the service worker and retrieve all assets from the\n   network.\n\n1. Users aren't always familiar with offline-first web apps. It can be useful to\n   [let the user know](https://developers.google.com/web/fundamentals/instant-and-offline/offline-ux#inform_the_user_when_the_app_is_ready_for_offline_consumption)\n   when the service worker has finished populating your caches (showing a \"This web\n   app works offline!\" message) and also let them know when the service worker has\n   fetched the latest updates that will be available the next time they load the\n   page (showing a \"New content is available; please refresh.\" message). Showing\n   this messages is currently left as an exercise to the developer, but as a\n   starting point, you can make use of the logic included in [`src/registerServiceWorker.js`](src/registerServiceWorker.js), which\n   demonstrates which service worker lifecycle events to listen for to detect each\n   scenario, and which as a default, just logs appropriate messages to the\n   JavaScript console.\n\n1. By default, the generated service worker file will not intercept or cache any\n   cross-origin traffic, like HTTP [API requests](#integrating-with-an-api-backend),\n   images, or embeds loaded from a different domain. If you would like to use a\n   runtime caching strategy for those requests, you can [`eject`](#npm-run-eject)\n   and then configure the\n   [`runtimeCaching`](https://github.com/GoogleChrome/sw-precache#runtimecaching-arrayobject)\n   option in the `SWPrecacheWebpackPlugin` section of\n   [`webpack.config.prod.js`](../config/webpack.config.prod.js).\n\n### Progressive Web App Metadata\n\nThe default configuration includes a web app manifest located at\n[`public/manifest.json`](public/manifest.json), that you can customize with\ndetails specific to your web application.\n\nWhen a user adds a web app to their homescreen using Chrome or Firefox on\nAndroid, the metadata in [`manifest.json`](public/manifest.json) determines what\nicons, names, and branding colors to use when the web app is displayed.\n[The Web App Manifest guide](https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/)\nprovides more context about what each field means, and how your customizations\nwill affect your users' experience.\n\n## Analyzing the Bundle Size\n\n[Source map explorer](https://www.npmjs.com/package/source-map-explorer) analyzes\nJavaScript bundles using the source maps. This helps you understand where code\nbloat is coming from.\n\nTo add Source map explorer to a Create React App project, follow these steps:\n\n```sh\nnpm install --save source-map-explorer\n```\n\nAlternatively you may use `yarn`:\n\n```sh\nyarn add source-map-explorer\n```\n\nThen in `package.json`, add the following line to `scripts`:\n\n```diff\n   \"scripts\": {\n+    \"analyze\": \"source-map-explorer build/static/js/main.*\",\n     \"start\": \"react-scripts start\",\n     \"build\": \"react-scripts build\",\n     \"test\": \"react-scripts test --env=jsdom\",\n```\n\nThen to analyze the bundle run the production build then run the analyze\nscript.\n\n```\nnpm run build\nnpm run analyze\n```\n\n## Deployment\n\n`npm run build` creates a `build` directory with a production build of your app. Set up your favourite HTTP server so that a visitor to your site is served `index.html`, and requests to static paths like `/static/js/main.<hash>.js` are served with the contents of the `/static/js/main.<hash>.js` file.\n\n### Static Server\n\nFor environments using [Node](https://nodejs.org/), the easiest way to handle this would be to install [serve](https://github.com/zeit/serve) and let it handle the rest:\n\n```sh\nnpm install -g serve\nserve -s build\n```\n\nThe last command shown above will serve your static site on the port **5000**. Like many of [serve](https://github.com/zeit/serve)’s internal settings, the port can be adjusted using the `-p` or `--port` flags.\n\nRun this command to get a full list of the options available:\n\n```sh\nserve -h\n```\n\n### Other Solutions\n\nYou don’t necessarily need a static server in order to run a Create React App project in production. It works just as fine integrated into an existing dynamic one.\n\nHere’s a programmatic example using [Node](https://nodejs.org/) and [Express](http://expressjs.com/):\n\n```javascript\nconst express = require('express');\nconst path = require('path');\nconst app = express();\n\napp.use(express.static(path.join(__dirname, 'build')));\n\napp.get('/', function (req, res) {\n  res.sendFile(path.join(__dirname, 'build', 'index.html'));\n});\n\napp.listen(9000);\n```\n\nThe choice of your server software isn’t important either. Since Create React App is completely platform-agnostic, there’s no need to explicitly use Node.\n\nThe `build` folder with static assets is the only output produced by Create React App.\n\nHowever this is not quite enough if you use client-side routing. Read the next section if you want to support URLs like `/todos/42` in your single-page app.\n\n### Serving Apps with Client-Side Routing\n\nIf you use routers that use the HTML5 [`pushState` history API](https://developer.mozilla.org/en-US/docs/Web/API/History_API#Adding_and_modifying_history_entries) under the hood (for example, [React Router](https://github.com/ReactTraining/react-router) with `browserHistory`), many static file servers will fail. For example, if you used React Router with a route for `/todos/42`, the development server will respond to `localhost:3000/todos/42` properly, but an Express serving a production build as above will not.\n\nThis is because when there is a fresh page load for a `/todos/42`, the server looks for the file `build/todos/42` and does not find it. The server needs to be configured to respond to a request to `/todos/42` by serving `index.html`. For example, we can amend our Express example above to serve `index.html` for any unknown paths:\n\n```diff\n app.use(express.static(path.join(__dirname, 'build')));\n\n-app.get('/', function (req, res) {\n+app.get('/*', function (req, res) {\n   res.sendFile(path.join(__dirname, 'build', 'index.html'));\n });\n```\n\nIf you’re using [Apache HTTP Server](https://httpd.apache.org/), you need to create a `.htaccess` file in the `public` folder that looks like this:\n\n```\n    Options -MultiViews\n    RewriteEngine On\n    RewriteCond %{REQUEST_FILENAME} !-f\n    RewriteRule ^ index.html [QSA,L]\n```\n\nIt will get copied to the `build` folder when you run `npm run build`.\n\nIf you’re using [Apache Tomcat](http://tomcat.apache.org/), you need to follow [this Stack Overflow answer](https://stackoverflow.com/a/41249464/4878474).\n\nNow requests to `/todos/42` will be handled correctly both in development and in production.\n\nOn a production build, and in a browser that supports [service workers](https://developers.google.com/web/fundamentals/getting-started/primers/service-workers),\nthe service worker will automatically handle all navigation requests, like for\n`/todos/42`, by serving the cached copy of your `index.html`. This\nservice worker navigation routing can be configured or disabled by\n[`eject`ing](#npm-run-eject) and then modifying the\n[`navigateFallback`](https://github.com/GoogleChrome/sw-precache#navigatefallback-string)\nand [`navigateFallbackWhitelist`](https://github.com/GoogleChrome/sw-precache#navigatefallbackwhitelist-arrayregexp)\noptions of the `SWPreachePlugin` [configuration](../config/webpack.config.prod.js).\n\n### Building for Relative Paths\n\nBy default, Create React App produces a build assuming your app is hosted at the server root.<br>\nTo override this, specify the `homepage` in your `package.json`, for example:\n\n```js\n  \"homepage\": \"http://mywebsite.com/relativepath\",\n```\n\nThis will let Create React App correctly infer the root path to use in the generated HTML file.\n\n**Note**: If you are using `react-router@^4`, you can root `<Link>`s using the `basename` prop on any `<Router>`.<br>\nMore information [here](https://reacttraining.com/react-router/web/api/BrowserRouter/basename-string).<br>\n<br>\nFor example:\n\n```js\n<BrowserRouter basename=\"/calendar\"/>\n<Link to=\"/today\"/> // renders <a href=\"/calendar/today\">\n```\n\n#### Serving the Same Build from Different Paths\n\n> Note: this feature is available with `react-scripts@0.9.0` and higher.\n\nIf you are not using the HTML5 `pushState` history API or not using client-side routing at all, it is unnecessary to specify the URL from which your app will be served. Instead, you can put this in your `package.json`:\n\n```js\n  \"homepage\": \".\",\n```\n\nThis will make sure that all the asset paths are relative to `index.html`. You will then be able to move your app from `http://mywebsite.com` to `http://mywebsite.com/relativepath` or even `http://mywebsite.com/relative/path` without having to rebuild it.\n\n### Azure\n\nSee [this](https://medium.com/@to_pe/deploying-create-react-app-on-microsoft-azure-c0f6686a4321) blog post on how to deploy your React app to [Microsoft Azure](https://azure.microsoft.com/).\n\n### Firebase\n\nInstall the Firebase CLI if you haven’t already by running `npm install -g firebase-tools`. Sign up for a [Firebase account](https://console.firebase.google.com/) and create a new project. Run `firebase login` and login with your previous created Firebase account.\n\nThen run the `firebase init` command from your project’s root. You need to choose the **Hosting: Configure and deploy Firebase Hosting sites** and choose the Firebase project you created in the previous step. You will need to agree with `database.rules.json` being created, choose `build` as the public directory, and also agree to **Configure as a single-page app** by replying with `y`.\n\n```sh\n    === Project Setup\n\n    First, let's associate this project directory with a Firebase project.\n    You can create multiple project aliases by running firebase use --add,\n    but for now we'll just set up a default project.\n\n    ? What Firebase project do you want to associate as default? Example app (example-app-fd690)\n\n    === Database Setup\n\n    Firebase Realtime Database Rules allow you to define how your data should be\n    structured and when your data can be read from and written to.\n\n    ? What file should be used for Database Rules? database.rules.json\n    ✔  Database Rules for example-app-fd690 have been downloaded to database.rules.json.\n    Future modifications to database.rules.json will update Database Rules when you run\n    firebase deploy.\n\n    === Hosting Setup\n\n    Your public directory is the folder (relative to your project directory) that\n    will contain Hosting assets to uploaded with firebase deploy. If you\n    have a build process for your assets, use your build's output directory.\n\n    ? What do you want to use as your public directory? build\n    ? Configure as a single-page app (rewrite all urls to /index.html)? Yes\n    ✔  Wrote build/index.html\n\n    i  Writing configuration info to firebase.json...\n    i  Writing project information to .firebaserc...\n\n    ✔  Firebase initialization complete!\n```\n\nNow, after you create a production build with `npm run build`, you can deploy it by running `firebase deploy`.\n\n```sh\n    === Deploying to 'example-app-fd690'...\n\n    i  deploying database, hosting\n    ✔  database: rules ready to deploy.\n    i  hosting: preparing build directory for upload...\n    Uploading: [==============================          ] 75%✔  hosting: build folder uploaded successfully\n    ✔  hosting: 8 files uploaded successfully\n    i  starting release process (may take several minutes)...\n\n    ✔  Deploy complete!\n\n    Project Console: https://console.firebase.google.com/project/example-app-fd690/overview\n    Hosting URL: https://example-app-fd690.firebaseapp.com\n```\n\nFor more information see [Add Firebase to your JavaScript Project](https://firebase.google.com/docs/web/setup).\n\n### GitHub Pages\n\n> Note: this feature is available with `react-scripts@0.2.0` and higher.\n\n#### Step 1: Add `homepage` to `package.json`\n\n**The step below is important!**<br>\n**If you skip it, your app will not deploy correctly.**\n\nOpen your `package.json` and add a `homepage` field:\n\n```js\n  \"homepage\": \"https://myusername.github.io/my-app\",\n```\n\nCreate React App uses the `homepage` field to determine the root URL in the built HTML file.\n\n#### Step 2: Install `gh-pages` and add `deploy` to `scripts` in `package.json`\n\nNow, whenever you run `npm run build`, you will see a cheat sheet with instructions on how to deploy to GitHub Pages.\n\nTo publish it at [https://myusername.github.io/my-app](https://myusername.github.io/my-app), run:\n\n```sh\nnpm install --save gh-pages\n```\n\nAlternatively you may use `yarn`:\n\n```sh\nyarn add gh-pages\n```\n\nAdd the following scripts in your `package.json`:\n\n```diff\n  \"scripts\": {\n+   \"predeploy\": \"npm run build\",\n+   \"deploy\": \"gh-pages -d build\",\n    \"start\": \"react-scripts start\",\n    \"build\": \"react-scripts build\",\n```\n\nThe `predeploy` script will run automatically before `deploy` is run.\n\n#### Step 3: Deploy the site by running `npm run deploy`\n\nThen run:\n\n```sh\nnpm run deploy\n```\n\n#### Step 4: Ensure your project’s settings use `gh-pages`\n\nFinally, make sure **GitHub Pages** option in your GitHub project settings is set to use the `gh-pages` branch:\n\n<img src=\"http://i.imgur.com/HUjEr9l.png\" width=\"500\" alt=\"gh-pages branch setting\">\n\n#### Step 5: Optionally, configure the domain\n\nYou can configure a custom domain with GitHub Pages by adding a `CNAME` file to the `public/` folder.\n\n#### Notes on client-side routing\n\nGitHub Pages doesn’t support routers that use the HTML5 `pushState` history API under the hood (for example, React Router using `browserHistory`). This is because when there is a fresh page load for a url like `http://user.github.io/todomvc/todos/42`, where `/todos/42` is a frontend route, the GitHub Pages server returns 404 because it knows nothing of `/todos/42`. If you want to add a router to a project hosted on GitHub Pages, here are a couple of solutions:\n\n- You could switch from using HTML5 history API to routing with hashes. If you use React Router, you can switch to `hashHistory` for this effect, but the URL will be longer and more verbose (for example, `http://user.github.io/todomvc/#/todos/42?_k=yknaj`). [Read more](https://reacttraining.com/react-router/web/api/Router) about different history implementations in React Router.\n- Alternatively, you can use a trick to teach GitHub Pages to handle 404 by redirecting to your `index.html` page with a special redirect parameter. You would need to add a `404.html` file with the redirection code to the `build` folder before deploying your project, and you’ll need to add code handling the redirect parameter to `index.html`. You can find a detailed explanation of this technique [in this guide](https://github.com/rafrex/spa-github-pages).\n\n### Heroku\n\nUse the [Heroku Buildpack for Create React App](https://github.com/mars/create-react-app-buildpack).<br>\nYou can find instructions in [Deploying React with Zero Configuration](https://blog.heroku.com/deploying-react-with-zero-configuration).\n\n#### Resolving Heroku Deployment Errors\n\nSometimes `npm run build` works locally but fails during deploy via Heroku. Following are the most common cases.\n\n##### \"Module not found: Error: Cannot resolve 'file' or 'directory'\"\n\nIf you get something like this:\n\n```\nremote: Failed to create a production build. Reason:\nremote: Module not found: Error: Cannot resolve 'file' or 'directory'\nMyDirectory in /tmp/build_1234/src\n```\n\nIt means you need to ensure that the lettercase of the file or directory you `import` matches the one you see on your filesystem or on GitHub.\n\nThis is important because Linux (the operating system used by Heroku) is case sensitive. So `MyDirectory` and `mydirectory` are two distinct directories and thus, even though the project builds locally, the difference in case breaks the `import` statements on Heroku remotes.\n\n##### \"Could not find a required file.\"\n\nIf you exclude or ignore necessary files from the package you will see a error similar this one:\n\n```\nremote: Could not find a required file.\nremote:   Name: `index.html`\nremote:   Searched in: /tmp/build_a2875fc163b209225122d68916f1d4df/public\nremote:\nremote: npm ERR! Linux 3.13.0-105-generic\nremote: npm ERR! argv \"/tmp/build_a2875fc163b209225122d68916f1d4df/.heroku/node/bin/node\" \"/tmp/build_a2875fc163b209225122d68916f1d4df/.heroku/node/bin/npm\" \"run\" \"build\"\n```\n\nIn this case, ensure that the file is there with the proper lettercase and that’s not ignored on your local `.gitignore` or `~/.gitignore_global`.\n\n### Netlify\n\n**To do a manual deploy to Netlify’s CDN:**\n\n```sh\nnpm install netlify-cli\nnetlify deploy\n```\n\nChoose `build` as the path to deploy.\n\n**To setup continuous delivery:**\n\nWith this setup Netlify will build and deploy when you push to git or open a pull request:\n\n1. [Start a new netlify project](https://app.netlify.com/signup)\n2. Pick your Git hosting service and select your repository\n3. Click `Build your site`\n\n**Support for client-side routing:**\n\nTo support `pushState`, make sure to create a `public/_redirects` file with the following rewrite rules:\n\n```\n/*  /index.html  200\n```\n\nWhen you build the project, Create React App will place the `public` folder contents into the build output.\n\n### Now\n\n[now](https://zeit.co/now) offers a zero-configuration single-command deployment. You can use `now` to deploy your app for free.\n\n1. Install the `now` command-line tool either via the recommended [desktop tool](https://zeit.co/download) or via node with `npm install -g now`.\n\n2. Build your app by running `npm run build`.\n\n3. Move into the build directory by running `cd build`.\n\n4. Run `now --name your-project-name` from within the build directory. You will see a **now.sh** URL in your output like this:\n\n   ```\n   > Ready! https://your-project-name-tpspyhtdtk.now.sh (copied to clipboard)\n   ```\n\n   Paste that URL into your browser when the build is complete, and you will see your deployed app.\n\nDetails are available in [this article.](https://zeit.co/blog/unlimited-static)\n\n### S3 and CloudFront\n\nSee this [blog post](https://medium.com/@omgwtfmarc/deploying-create-react-app-to-s3-or-cloudfront-48dae4ce0af) on how to deploy your React app to Amazon Web Services [S3](https://aws.amazon.com/s3) and [CloudFront](https://aws.amazon.com/cloudfront/).\n\n### Surge\n\nInstall the Surge CLI if you haven’t already by running `npm install -g surge`. Run the `surge` command and log in you or create a new account.\n\nWhen asked about the project path, make sure to specify the `build` folder, for example:\n\n```sh\n       project path: /path/to/project/build\n```\n\nNote that in order to support routers that use HTML5 `pushState` API, you may want to rename the `index.html` in your build folder to `200.html` before deploying to Surge. This [ensures that every URL falls back to that file](https://surge.sh/help/adding-a-200-page-for-client-side-routing).\n\n## Advanced Configuration\n\nYou can adjust various development and production settings by setting environment variables in your shell or with [.env](#adding-development-environment-variables-in-env).\n\n| Variable            |      Development       |     Production     | Usage                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                     |\n| :------------------ | :--------------------: | :----------------: | :------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |\n| BROWSER             |   :white_check_mark:   |        :x:         | By default, Create React App will open the default system browser, favoring Chrome on macOS. Specify a [browser](https://github.com/sindresorhus/opn#app) to override this behavior, or set it to `none` to disable it completely. If you need to customize the way the browser is launched, you can specify a node script instead. Any arguments passed to `npm start` will also be passed to this script, and the url where your app is served will be the last argument. Your script's file name must have the `.js` extension.                                                                                        |\n| HOST                |   :white_check_mark:   |        :x:         | By default, the development web server binds to `localhost`. You may use this variable to specify a different host.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                       |\n| PORT                |   :white_check_mark:   |        :x:         | By default, the development web server will attempt to listen on port 3000 or prompt you to attempt the next available port. You may use this variable to specify a different port.                                                                                                                                                                                                                                                                                                                                                                                                                                       |\n| HTTPS               |   :white_check_mark:   |        :x:         | When set to `true`, Create React App will run the development server in `https` mode.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                     |\n| PUBLIC_URL          |          :x:           | :white_check_mark: | Create React App assumes your application is hosted at the serving web server's root or a subpath as specified in [`package.json` (`homepage`)](#building-for-relative-paths). Normally, Create React App ignores the hostname. You may use this variable to force assets to be referenced verbatim to the url you provide (hostname included). This may be particularly useful when using a CDN to host your application.                                                                                                                                                                                                |\n| CI                  | :large_orange_diamond: | :white_check_mark: | When set to `true`, Create React App treats warnings as failures in the build. It also makes the test runner non-watching. Most CIs set this flag by default.                                                                                                                                                                                                                                                                                                                                                                                                                                                             |\n| REACT_EDITOR        |   :white_check_mark:   |        :x:         | When an app crashes in development, you will see an error overlay with clickable stack trace. When you click on it, Create React App will try to determine the editor you are using based on currently running processes, and open the relevant source file. You can [send a pull request to detect your editor of choice](https://github.com/facebookincubator/create-react-app/issues/2636). Setting this environment variable overrides the automatic detection. If you do it, make sure your systems [PATH](<https://en.wikipedia.org/wiki/PATH_(variable)>) environment variable points to your editor’s bin folder. |\n| CHOKIDAR_USEPOLLING |   :white_check_mark:   |        :x:         | When set to `true`, the watcher runs in polling mode, as necessary inside a VM. Use this option if `npm start` isn't detecting changes.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                   |\n| GENERATE_SOURCEMAP  |          :x:           | :white_check_mark: | When set to `false`, source maps are not generated for a production build. This solves OOM issues on some smaller machines.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                               |\n\n## Troubleshooting\n\n### `npm start` doesn’t detect changes\n\nWhen you save a file while `npm start` is running, the browser should refresh with the updated code.<br>\nIf this doesn’t happen, try one of the following workarounds:\n\n- If your project is in a Dropbox folder, try moving it out.\n- If the watcher doesn’t see a file called `index.js` and you’re referencing it by the folder name, you [need to restart the watcher](https://github.com/facebookincubator/create-react-app/issues/1164) due to a Webpack bug.\n- Some editors like Vim and IntelliJ have a “safe write” feature that currently breaks the watcher. You will need to disable it. Follow the instructions in [“Adjusting Your Text Editor”](https://webpack.js.org/guides/development/#adjusting-your-text-editor).\n- If your project path contains parentheses, try moving the project to a path without them. This is caused by a [Webpack watcher bug](https://github.com/webpack/watchpack/issues/42).\n- On Linux and macOS, you might need to [tweak system settings](https://webpack.github.io/docs/troubleshooting.html#not-enough-watchers) to allow more watchers.\n- If the project runs inside a virtual machine such as (a Vagrant provisioned) VirtualBox, create an `.env` file in your project directory if it doesn’t exist, and add `CHOKIDAR_USEPOLLING=true` to it. This ensures that the next time you run `npm start`, the watcher uses the polling mode, as necessary inside a VM.\n\nIf none of these solutions help please leave a comment [in this thread](https://github.com/facebookincubator/create-react-app/issues/659).\n\n### `npm test` hangs on macOS Sierra\n\nIf you run `npm test` and the console gets stuck after printing `react-scripts test --env=jsdom` to the console there might be a problem with your [Watchman](https://facebook.github.io/watchman/) installation as described in [facebookincubator/create-react-app#713](https://github.com/facebookincubator/create-react-app/issues/713).\n\nWe recommend deleting `node_modules` in your project and running `npm install` (or `yarn` if you use it) first. If it doesn't help, you can try one of the numerous workarounds mentioned in these issues:\n\n- [facebook/jest#1767](https://github.com/facebook/jest/issues/1767)\n- [facebook/watchman#358](https://github.com/facebook/watchman/issues/358)\n- [ember-cli/ember-cli#6259](https://github.com/ember-cli/ember-cli/issues/6259)\n\nIt is reported that installing Watchman 4.7.0 or newer fixes the issue. If you use [Homebrew](http://brew.sh/), you can run these commands to update it:\n\n```\nwatchman shutdown-server\nbrew update\nbrew reinstall watchman\n```\n\nYou can find [other installation methods](https://facebook.github.io/watchman/docs/install.html#build-install) on the Watchman documentation page.\n\nIf this still doesn’t help, try running `launchctl unload -F ~/Library/LaunchAgents/com.github.facebook.watchman.plist`.\n\nThere are also reports that _uninstalling_ Watchman fixes the issue. So if nothing else helps, remove it from your system and try again.\n\n### `npm run build` exits too early\n\nIt is reported that `npm run build` can fail on machines with limited memory and no swap space, which is common in cloud environments. Even with small projects this command can increase RAM usage in your system by hundreds of megabytes, so if you have less than 1 GB of available memory your build is likely to fail with the following message:\n\n> The build failed because the process exited too early. This probably means the system ran out of memory or someone called `kill -9` on the process.\n\nIf you are completely sure that you didn't terminate the process, consider [adding some swap space](https://www.digitalocean.com/community/tutorials/how-to-add-swap-on-ubuntu-14-04) to the machine you’re building on, or build the project locally.\n\n### `npm run build` fails on Heroku\n\nThis may be a problem with case sensitive filenames.\nPlease refer to [this section](#resolving-heroku-deployment-errors).\n\n### Moment.js locales are missing\n\nIf you use a [Moment.js](https://momentjs.com/), you might notice that only the English locale is available by default. This is because the locale files are large, and you probably only need a subset of [all the locales provided by Moment.js](https://momentjs.com/#multiple-locale-support).\n\nTo add a specific Moment.js locale to your bundle, you need to import it explicitly.<br>\nFor example:\n\n```js\nimport moment from 'moment';\nimport 'moment/locale/fr';\n```\n\nIf import multiple locales this way, you can later switch between them by calling `moment.locale()` with the locale name:\n\n```js\nimport moment from 'moment';\nimport 'moment/locale/fr';\nimport 'moment/locale/es';\n\n// ...\n\nmoment.locale('fr');\n```\n\nThis will only work for locales that have been explicitly imported before.\n\n### `npm run build` fails to minify\n\nYou may occasionally find a package you depend on needs compiled or ships code for a non-browser environment.<br>\nThis is considered poor practice in the ecosystem and does not have an escape hatch in Create React App.<br>\n<br>\nTo resolve this:\n\n1. Open an issue on the dependency's issue tracker and ask that the package be published pre-compiled (retaining ES6 Modules).\n2. Fork the package and publish a corrected version yourself.\n3. If the dependency is small enough, copy it to your `src/` folder and treat it as application code.\n\n## Something Missing?\n\nIf you have ideas for more “How To” recipes that should be on this page, [let us know](https://github.com/facebookincubator/create-react-app/issues) or [contribute some!](https://github.com/facebookincubator/create-react-app/edit/master/packages/react-scripts/template/README.md)\n"
  },
  {
    "path": "example/react/package.json",
    "content": "{\n  \"name\": \"react_usinghooks\",\n  \"version\": \"0.1.0\",\n  \"private\": true,\n  \"dependencies\": {\n    \"i18next\": \"^24.2.0\",\n    \"i18next-browser-languagedetector\": \"^8.0.2\",\n    \"i18next-http-backend\": \"^3.0.1\",\n    \"react\": \"^19.0.0\",\n    \"react-dom\": \"^19.0.0\",\n    \"react-i18next\": \"^15.2.0\",\n    \"react-scripts\": \"^5.0.1\"\n  },\n  \"overrides\": {\n    \"typescript\": \"5.7.2\"\n  },\n  \"scripts\": {\n    \"start\": \"react-scripts start\",\n    \"build\": \"react-scripts build\",\n    \"test\": \"react-scripts test --env=jsdom\",\n    \"eject\": \"react-scripts eject\"\n  },\n  \"eslintConfig\": {\n    \"extends\": [\n      \"react-app\",\n      \"react-app/jest\"\n    ]\n  },\n  \"browserslist\": {\n    \"development\": [\n      \"last 2 chrome versions\",\n      \"last 2 firefox versions\",\n      \"last 2 edge versions\"\n    ],\n    \"production\": [\n      \">1%\",\n      \"last 4 versions\",\n      \"Firefox ESR\",\n      \"not ie < 11\"\n    ]\n  }\n}\n"
  },
  {
    "path": "example/react/public/index.html",
    "content": "<!doctype html>\n<html lang=\"en\">\n  <head>\n    <meta charset=\"utf-8\" />\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\" />\n    <meta name=\"theme-color\" content=\"#000000\" />\n    <!--\n      manifest.json provides metadata used when your web app is added to the\n      homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/\n    -->\n    <link rel=\"manifest\" href=\"%PUBLIC_URL%/manifest.json\" />\n    <link rel=\"shortcut icon\" href=\"%PUBLIC_URL%/favicon.ico\" />\n    <!--\n      Notice the use of %PUBLIC_URL% in the tags above.\n      It will be replaced with the URL of the `public` folder during the build.\n      Only files inside the `public` folder can be referenced from the HTML.\n\n      Unlike \"/favicon.ico\" or \"favicon.ico\", \"%PUBLIC_URL%/favicon.ico\" will\n      work correctly both with client-side routing and a non-root public URL.\n      Learn how to configure a non-root public URL by running `npm run build`.\n    -->\n    <title>React App</title>\n  </head>\n  <body>\n    <noscript>You need to enable JavaScript to run this app.</noscript>\n    <div id=\"root\"></div>\n    <!--\n      This HTML file is a template.\n      If you open it directly in the browser, you will see an empty page.\n\n      You can add webfonts, meta tags, or analytics to this file.\n      The build step will place the bundled scripts into the <body> tag.\n\n      To begin the development, run `npm start` or `yarn start`.\n      To create a production bundle, use `npm run build` or `yarn build`.\n    -->\n  </body>\n</html>\n"
  },
  {
    "path": "example/react/public/locales/de/translation.json",
    "content": "{\n  \"title\": \"Willkommen zu react und react-i18next\",\n  \"description\": {\n    \"part1\": \"Um loszulegen, ändere <1>src/App(DE).js</1> und speichere um neuzuladen.\",\n    \"part2\": \"Wechsle die Sprache zwischen deutsch und englisch mit Hilfe der beiden Schalter.\"\n  }\n}\n"
  },
  {
    "path": "example/react/public/locales/en/translation.json",
    "content": "{\n  \"title\": \"Welcome to react using react-i18next\",\n  \"description\": {\n    \"part1\": \"To get started, edit <1>src/App.js</1> and save to reload.\",\n    \"part2\": \"Switch language between english and german using buttons above.\"\n  }\n}\n"
  },
  {
    "path": "example/react/public/manifest.json",
    "content": "{\n  \"short_name\": \"React App\",\n  \"name\": \"Create React App Sample\",\n  \"icons\": [\n    {\n      \"src\": \"favicon.ico\",\n      \"sizes\": \"192x192\",\n      \"type\": \"image/png\"\n    }\n  ],\n  \"start_url\": \"./index.html\",\n  \"display\": \"standalone\",\n  \"theme_color\": \"#000000\",\n  \"background_color\": \"#ffffff\"\n}\n"
  },
  {
    "path": "example/react/src/App.css",
    "content": ".App {\n  text-align: center;\n}\n\n.App-logo {\n  animation: App-logo-spin infinite 20s linear;\n  height: 80px;\n}\n\n.App-header {\n  background-color: #222;\n  height: 150px;\n  padding: 20px;\n  color: white;\n}\n\n.App-intro {\n  font-size: large;\n}\n\n@keyframes App-logo-spin {\n  from {\n    transform: rotate(0deg);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n}\n"
  },
  {
    "path": "example/react/src/App.js",
    "content": "import React, { Component, Suspense } from 'react';\nimport { useTranslation, withTranslation, Trans } from 'react-i18next';\nimport logo from './logo.svg';\nimport './App.css';\n\n// use hoc for class based components\nclass LegacyWelcomeClass extends Component {\n  render() {\n    const { t } = this.props;\n    return <h2>{t('title')}</h2>;\n  }\n}\nconst Welcome = withTranslation()(LegacyWelcomeClass);\n\n// Component using the Trans component\nfunction MyComponent() {\n  return (\n    <Trans i18nKey=\"description.part1\">\n      To get started, edit <code>src/App.js</code> and save to reload.\n    </Trans>\n  );\n}\n\n// page uses the hook\nfunction Page() {\n  const { t, i18n } = useTranslation();\n\n  const changeLanguage = (lng) => {\n    i18n.changeLanguage(lng);\n  };\n\n  return (\n    <div className=\"App\">\n      <div className=\"App-header\">\n        <img src={logo} className=\"App-logo\" alt=\"logo\" />\n        <Welcome />\n        <button type=\"button\" onClick={() => changeLanguage('de')}>\n          de\n        </button>\n        <button type=\"button\" onClick={() => changeLanguage('en')}>\n          en\n        </button>\n      </div>\n      <div className=\"App-intro\">\n        <MyComponent />\n      </div>\n      <div>{t('description.part2')}</div>\n    </div>\n  );\n}\n\n// loading component for suspense fallback\nconst Loader = () => (\n  <div className=\"App\">\n    <img src={logo} className=\"App-logo\" alt=\"logo\" />\n    <div>loading...</div>\n  </div>\n);\n\n// here app catches the suspense from page in case translations are not yet loaded\nexport default function App() {\n  return (\n    <Suspense fallback={<Loader />}>\n      <Page />\n    </Suspense>\n  );\n}\n"
  },
  {
    "path": "example/react/src/i18n.js",
    "content": "import i18n from 'i18next';\nimport Backend from 'i18next-http-backend';\nimport LanguageDetector from 'i18next-browser-languagedetector';\nimport { initReactI18next } from 'react-i18next';\n\ni18n\n  // load translation using http -> see /public/locales\n  // learn more: https://github.com/i18next/i18next-http-backend\n  .use(Backend)\n  // detect user language\n  // learn more: https://github.com/i18next/i18next-browser-languageDetector\n  .use(LanguageDetector)\n  // pass the i18n instance to react-i18next.\n  .use(initReactI18next)\n  // init i18next\n  // for all options read: https://www.i18next.com/overview/configuration-options\n  .init({\n    fallbackLng: 'en',\n    debug: true,\n  });\n\nexport default i18n;\n"
  },
  {
    "path": "example/react/src/index.css",
    "content": "body {\n  margin: 0;\n  padding: 0;\n  font-family: sans-serif;\n}\n"
  },
  {
    "path": "example/react/src/index.js",
    "content": "import React from 'react';\nimport { createRoot } from 'react-dom/client';\nimport './index.css';\nimport App from './App';\n\n// import i18n (needs to be bundled ;))\nimport './i18n';\n\nconst root = createRoot(document.getElementById('root'));\nroot.render(\n  <React.StrictMode>\n    <App />\n  </React.StrictMode>,\n);\n"
  },
  {
    "path": "example/react-component-lib/.gitignore",
    "content": "# See https://help.github.com/ignore-files/ for more about ignoring files.\n\n# dependencies\n/node_modules\n\n# testing\n/coverage\n\n# production\n/build\n\n# misc\n.DS_Store\n.env.local\n.env.development.local\n.env.test.local\n.env.production.local\n\nnpm-debug.log*\nyarn-debug.log*\nyarn-error.log*\n"
  },
  {
    "path": "example/react-component-lib/README.md",
    "content": "# [Ready to take i18next to the next level?](http://locize.com/?utm_source=react_i18next_readme&utm_medium=github)\n\nNeeding a translation management? Want to edit your translations with an InContext Editor? Use the original provided to you by the maintainers of i18next!\n\n![locize](https://www.locize.com/img/ads/github_locize.png)\n\nWith using [locize](http://locize.com/?utm_source=react_i18next_readme&utm_medium=github) you directly support the future of i18next and react-i18next.\n\n## Here you find a react example for locize:\n\n[EXAMPLE](../locize)\n\n[![video](../locize/video_sample.png)](https://youtu.be/osScyaGMVqo)\n[watch the video](https://youtu.be/osScyaGMVqo)\n\n---\n\nThis project was bootstrapped with [Create React App](https://github.com/facebookincubator/create-react-app).\n\nBelow you will find some information on how to perform common tasks.<br>\nYou can find the most recent version of this guide [here](https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md).\n\n## Table of Contents\n\n- [Updating to New Releases](#updating-to-new-releases)\n- [Sending Feedback](#sending-feedback)\n- [Folder Structure](#folder-structure)\n- [Available Scripts](#available-scripts)\n  - [npm start](#npm-start)\n  - [npm test](#npm-test)\n  - [npm run build](#npm-run-build)\n  - [npm run eject](#npm-run-eject)\n- [Supported Language Features and Polyfills](#supported-language-features-and-polyfills)\n- [Syntax Highlighting in the Editor](#syntax-highlighting-in-the-editor)\n- [Displaying Lint Output in the Editor](#displaying-lint-output-in-the-editor)\n- [Debugging in the Editor](#debugging-in-the-editor)\n- [Formatting Code Automatically](#formatting-code-automatically)\n- [Changing the Page `<title>`](#changing-the-page-title)\n- [Installing a Dependency](#installing-a-dependency)\n- [Importing a Component](#importing-a-component)\n- [Code Splitting](#code-splitting)\n- [Adding a Stylesheet](#adding-a-stylesheet)\n- [Post-Processing CSS](#post-processing-css)\n- [Adding a CSS Preprocessor (Sass, Less etc.)](#adding-a-css-preprocessor-sass-less-etc)\n- [Adding Images, Fonts, and Files](#adding-images-fonts-and-files)\n- [Using the `public` Folder](#using-the-public-folder)\n  - [Changing the HTML](#changing-the-html)\n  - [Adding Assets Outside of the Module System](#adding-assets-outside-of-the-module-system)\n  - [When to Use the `public` Folder](#when-to-use-the-public-folder)\n- [Using Global Variables](#using-global-variables)\n- [Adding Bootstrap](#adding-bootstrap)\n  - [Using a Custom Theme](#using-a-custom-theme)\n- [Adding Flow](#adding-flow)\n- [Adding Custom Environment Variables](#adding-custom-environment-variables)\n  - [Referencing Environment Variables in the HTML](#referencing-environment-variables-in-the-html)\n  - [Adding Temporary Environment Variables In Your Shell](#adding-temporary-environment-variables-in-your-shell)\n  - [Adding Development Environment Variables In `.env`](#adding-development-environment-variables-in-env)\n- [Can I Use Decorators?](#can-i-use-decorators)\n- [Integrating with an API Backend](#integrating-with-an-api-backend)\n  - [Node](#node)\n  - [Ruby on Rails](#ruby-on-rails)\n- [Proxying API Requests in Development](#proxying-api-requests-in-development)\n  - [\"Invalid Host Header\" Errors After Configuring Proxy](#invalid-host-header-errors-after-configuring-proxy)\n  - [Configuring the Proxy Manually](#configuring-the-proxy-manually)\n  - [Configuring a WebSocket Proxy](#configuring-a-websocket-proxy)\n- [Using HTTPS in Development](#using-https-in-development)\n- [Generating Dynamic `<meta>` Tags on the Server](#generating-dynamic-meta-tags-on-the-server)\n- [Pre-Rendering into Static HTML Files](#pre-rendering-into-static-html-files)\n- [Injecting Data from the Server into the Page](#injecting-data-from-the-server-into-the-page)\n- [Running Tests](#running-tests)\n  - [Filename Conventions](#filename-conventions)\n  - [Command Line Interface](#command-line-interface)\n  - [Version Control Integration](#version-control-integration)\n  - [Writing Tests](#writing-tests)\n  - [Testing Components](#testing-components)\n  - [Using Third Party Assertion Libraries](#using-third-party-assertion-libraries)\n  - [Initializing Test Environment](#initializing-test-environment)\n  - [Focusing and Excluding Tests](#focusing-and-excluding-tests)\n  - [Coverage Reporting](#coverage-reporting)\n  - [Continuous Integration](#continuous-integration)\n  - [Disabling jsdom](#disabling-jsdom)\n  - [Snapshot Testing](#snapshot-testing)\n  - [Editor Integration](#editor-integration)\n- [Developing Components in Isolation](#developing-components-in-isolation)\n  - [Getting Started with Storybook](#getting-started-with-storybook)\n  - [Getting Started with Styleguidist](#getting-started-with-styleguidist)\n- [Making a Progressive Web App](#making-a-progressive-web-app)\n  - [Opting Out of Caching](#opting-out-of-caching)\n  - [Offline-First Considerations](#offline-first-considerations)\n  - [Progressive Web App Metadata](#progressive-web-app-metadata)\n- [Analyzing the Bundle Size](#analyzing-the-bundle-size)\n- [Deployment](#deployment)\n  - [Static Server](#static-server)\n  - [Other Solutions](#other-solutions)\n  - [Serving Apps with Client-Side Routing](#serving-apps-with-client-side-routing)\n  - [Building for Relative Paths](#building-for-relative-paths)\n  - [Azure](#azure)\n  - [Firebase](#firebase)\n  - [GitHub Pages](#github-pages)\n  - [Heroku](#heroku)\n  - [Netlify](#netlify)\n  - [Now](#now)\n  - [S3 and CloudFront](#s3-and-cloudfront)\n  - [Surge](#surge)\n- [Advanced Configuration](#advanced-configuration)\n- [Troubleshooting](#troubleshooting)\n  - [`npm start` doesn’t detect changes](#npm-start-doesnt-detect-changes)\n  - [`npm test` hangs on macOS Sierra](#npm-test-hangs-on-macos-sierra)\n  - [`npm run build` exits too early](#npm-run-build-exits-too-early)\n  - [`npm run build` fails on Heroku](#npm-run-build-fails-on-heroku)\n  - [`npm run build` fails to minify](#npm-run-build-fails-to-minify)\n  - [Moment.js locales are missing](#momentjs-locales-are-missing)\n- [Something Missing?](#something-missing)\n\n## Updating to New Releases\n\nCreate React App is divided into two packages:\n\n- `create-react-app` is a global command-line utility that you use to create new projects.\n- `react-scripts` is a development dependency in the generated projects (including this one).\n\nYou almost never need to update `create-react-app` itself: it delegates all the setup to `react-scripts`.\n\nWhen you run `create-react-app`, it always creates the project with the latest version of `react-scripts` so you’ll get all the new features and improvements in newly created apps automatically.\n\nTo update an existing project to a new version of `react-scripts`, [open the changelog](https://github.com/facebookincubator/create-react-app/blob/master/CHANGELOG.md), find the version you’re currently on (check `package.json` in this folder if you’re not sure), and apply the migration instructions for the newer versions.\n\nIn most cases bumping the `react-scripts` version in `package.json` and running `npm install` in this folder should be enough, but it’s good to consult the [changelog](https://github.com/facebookincubator/create-react-app/blob/master/CHANGELOG.md) for potential breaking changes.\n\nWe commit to keeping the breaking changes minimal so you can upgrade `react-scripts` painlessly.\n\n## Sending Feedback\n\nWe are always open to [your feedback](https://github.com/facebookincubator/create-react-app/issues).\n\n## Folder Structure\n\nAfter creation, your project should look like this:\n\n```\nmy-app/\n  README.md\n  node_modules/\n  package.json\n  public/\n    index.html\n    favicon.ico\n  src/\n    App.css\n    App.js\n    App.test.js\n    index.css\n    index.js\n    logo.svg\n```\n\nFor the project to build, **these files must exist with exact filenames**:\n\n- `public/index.html` is the page template;\n- `src/index.js` is the JavaScript entry point.\n\nYou can delete or rename the other files.\n\nYou may create subdirectories inside `src`. For faster rebuilds, only files inside `src` are processed by Webpack.<br>\nYou need to **put any JS and CSS files inside `src`**, otherwise Webpack won’t see them.\n\nOnly files inside `public` can be used from `public/index.html`.<br>\nRead instructions below for using assets from JavaScript and HTML.\n\nYou can, however, create more top-level directories.<br>\nThey will not be included in the production build so you can use them for things like documentation.\n\n## Available Scripts\n\nIn the project directory, you can run:\n\n### `npm start`\n\nRuns the app in the development mode.<br>\nOpen [http://localhost:3000](http://localhost:3000) to view it in the browser.\n\nThe page will reload if you make edits.<br>\nYou will also see any lint errors in the console.\n\n### `npm test`\n\nLaunches the test runner in the interactive watch mode.<br>\nSee the section about [running tests](#running-tests) for more information.\n\n### `npm run build`\n\nBuilds the app for production to the `build` folder.<br>\nIt correctly bundles React in production mode and optimizes the build for the best performance.\n\nThe build is minified and the filenames include the hashes.<br>\nYour app is ready to be deployed!\n\nSee the section about [deployment](#deployment) for more information.\n\n### `npm run eject`\n\n**Note: this is a one-way operation. Once you `eject`, you can’t go back!**\n\nIf you aren’t satisfied with the build tool and configuration choices, you can `eject` at any time. This command will remove the single build dependency from your project.\n\nInstead, it will copy all the configuration files and the transitive dependencies (Webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except `eject` will still work, but they will point to the copied scripts so you can tweak them. At this point you’re on your own.\n\nYou don’t have to ever use `eject`. The curated feature set is suitable for small and middle deployments, and you shouldn’t feel obligated to use this feature. However we understand that this tool wouldn’t be useful if you couldn’t customize it when you are ready for it.\n\n## Supported Language Features and Polyfills\n\nThis project supports a superset of the latest JavaScript standard.<br>\nIn addition to [ES6](https://github.com/lukehoban/es6features) syntax features, it also supports:\n\n- [Exponentiation Operator](https://github.com/rwaldron/exponentiation-operator) (ES2016).\n- [Async/await](https://github.com/tc39/ecmascript-asyncawait) (ES2017).\n- [Object Rest/Spread Properties](https://github.com/sebmarkbage/ecmascript-rest-spread) (stage 3 proposal).\n- [Dynamic import()](https://github.com/tc39/proposal-dynamic-import) (stage 3 proposal)\n- [Class Fields and Static Properties](https://github.com/tc39/proposal-class-public-fields) (stage 2 proposal).\n- [JSX](https://facebook.github.io/react/docs/introducing-jsx.html) and [Flow](https://flowtype.org/) syntax.\n\nLearn more about [different proposal stages](https://babeljs.io/docs/plugins/#presets-stage-x-experimental-presets-).\n\nWhile we recommend to use experimental proposals with some caution, Facebook heavily uses these features in the product code, so we intend to provide [codemods](https://medium.com/@cpojer/effective-javascript-codemods-5a6686bb46fb) if any of these proposals change in the future.\n\nNote that **the project only includes a few ES6 [polyfills](https://en.wikipedia.org/wiki/Polyfill)**:\n\n- [`Object.assign()`](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Object/assign) via [`object-assign`](https://github.com/sindresorhus/object-assign).\n- [`Promise`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise) via [`promise`](https://github.com/then/promise).\n- [`fetch()`](https://developer.mozilla.org/en/docs/Web/API/Fetch_API) via [`whatwg-fetch`](https://github.com/github/fetch).\n\nIf you use any other ES6+ features that need **runtime support** (such as `Array.from()` or `Symbol`), make sure you are including the appropriate polyfills manually, or that the browsers you are targeting already support them.\n\n## Syntax Highlighting in the Editor\n\nTo configure the syntax highlighting in your favorite text editor, head to the [relevant Babel documentation page](https://babeljs.io/docs/editors) and follow the instructions. Some of the most popular editors are covered.\n\n## Displaying Lint Output in the Editor\n\n> Note: this feature is available with `react-scripts@0.2.0` and higher.<br>\n> It also only works with npm 3 or higher.\n\nSome editors, including Sublime Text, Atom, and Visual Studio Code, provide plugins for ESLint.\n\nThey are not required for linting. You should see the linter output right in your terminal as well as the browser console. However, if you prefer the lint results to appear right in your editor, there are some extra steps you can do.\n\nYou would need to install an ESLint plugin for your editor first. Then, add a file called `.eslintrc` to the project root:\n\n```js\n{\n  \"extends\": \"react-app\"\n}\n```\n\nNow your editor should report the linting warnings.\n\nNote that even if you edit your `.eslintrc` file further, these changes will **only affect the editor integration**. They won’t affect the terminal and in-browser lint output. This is because Create React App intentionally provides a minimal set of rules that find common mistakes.\n\nIf you want to enforce a coding style for your project, consider using [Prettier](https://github.com/jlongster/prettier) instead of ESLint style rules.\n\n## Debugging in the Editor\n\n**This feature is currently only supported by [Visual Studio Code](https://code.visualstudio.com) and [WebStorm](https://www.jetbrains.com/webstorm/).**\n\nVisual Studio Code and WebStorm support debugging out of the box with Create React App. This enables you as a developer to write and debug your React code without leaving the editor, and most importantly it enables you to have a continuous development workflow, where context switching is minimal, as you don’t have to switch between tools.\n\n### Visual Studio Code\n\nYou would need to have the latest version of [VS Code](https://code.visualstudio.com) and VS Code [Chrome Debugger Extension](https://marketplace.visualstudio.com/items?itemName=msjsdiag.debugger-for-chrome) installed.\n\nThen add the block below to your `launch.json` file and put it inside the `.vscode` folder in your app’s root directory.\n\n```json\n{\n  \"version\": \"0.2.0\",\n  \"configurations\": [\n    {\n      \"name\": \"Chrome\",\n      \"type\": \"chrome\",\n      \"request\": \"launch\",\n      \"url\": \"http://localhost:3000\",\n      \"webRoot\": \"${workspaceRoot}/src\",\n      \"userDataDir\": \"${workspaceRoot}/.vscode/chrome\",\n      \"sourceMapPathOverrides\": {\n        \"webpack:///src/*\": \"${webRoot}/*\"\n      }\n    }\n  ]\n}\n```\n\n> Note: the URL may be different if you've made adjustments via the [HOST or PORT environment variables](#advanced-configuration).\n\nStart your app by running `npm start`, and start debugging in VS Code by pressing `F5` or by clicking the green debug icon. You can now write code, set breakpoints, make changes to the code, and debug your newly modified code—all from your editor.\n\n### WebStorm\n\nYou would need to have [WebStorm](https://www.jetbrains.com/webstorm/) and [JetBrains IDE Support](https://chrome.google.com/webstore/detail/jetbrains-ide-support/hmhgeddbohgjknpmjagkdomcpobmllji) Chrome extension installed.\n\nIn the WebStorm menu `Run` select `Edit Configurations...`. Then click `+` and select `JavaScript Debug`. Paste `http://localhost:3000` into the URL field and save the configuration.\n\n> Note: the URL may be different if you've made adjustments via the [HOST or PORT environment variables](#advanced-configuration).\n\nStart your app by running `npm start`, then press `^D` on macOS or `F9` on Windows and Linux or click the green debug icon to start debugging in WebStorm.\n\nThe same way you can debug your application in IntelliJ IDEA Ultimate, PhpStorm, PyCharm Pro, and RubyMine.\n\n## Formatting Code Automatically\n\nPrettier is an opinionated code formatter with support for JavaScript, CSS and JSON. With Prettier you can format the code you write automatically to ensure a code style within your project. See the [Prettier's GitHub page](https://github.com/prettier/prettier) for more information, and look at this [page to see it in action](https://prettier.github.io/prettier/).\n\nTo format our code whenever we make a commit in git, we need to install the following dependencies:\n\n```sh\nnpm install --save husky lint-staged prettier\n```\n\nAlternatively you may use `yarn`:\n\n```sh\nyarn add husky lint-staged prettier\n```\n\n- `husky` makes it easy to use githooks as if they are npm scripts.\n- `lint-staged` allows us to run scripts on staged files in git. See this [blog post about lint-staged to learn more about it](https://medium.com/@okonetchnikov/make-linting-great-again-f3890e1ad6b8).\n- `prettier` is the JavaScript formatter we will run before commits.\n\nNow we can make sure every file is formatted correctly by adding a few lines to the `package.json` in the project root.\n\nAdd the following line to `scripts` section:\n\n```diff\n  \"scripts\": {\n+   \"precommit\": \"lint-staged\",\n    \"start\": \"react-scripts start\",\n    \"build\": \"react-scripts build\",\n```\n\nNext we add a 'lint-staged' field to the `package.json`, for example:\n\n```diff\n  \"dependencies\": {\n    // ...\n  },\n+ \"lint-staged\": {\n+   \"src/**/*.{js,jsx,json,css}\": [\n+     \"prettier --single-quote --write\",\n+     \"git add\"\n+   ]\n+ },\n  \"scripts\": {\n```\n\nNow, whenever you make a commit, Prettier will format the changed files automatically. You can also run `./node_modules/.bin/prettier --single-quote --write \"src/**/*.{js,jsx}\"` to format your entire project for the first time.\n\nNext you might want to integrate Prettier in your favorite editor. Read the section on [Editor Integration](https://github.com/prettier/prettier#editor-integration) on the Prettier GitHub page.\n\n## Changing the Page `<title>`\n\nYou can find the source HTML file in the `public` folder of the generated project. You may edit the `<title>` tag in it to change the title from “React App” to anything else.\n\nNote that normally you wouldn’t edit files in the `public` folder very often. For example, [adding a stylesheet](#adding-a-stylesheet) is done without touching the HTML.\n\nIf you need to dynamically update the page title based on the content, you can use the browser [`document.title`](https://developer.mozilla.org/en-US/docs/Web/API/Document/title) API. For more complex scenarios when you want to change the title from React components, you can use [React Helmet](https://github.com/nfl/react-helmet), a third party library.\n\nIf you use a custom server for your app in production and want to modify the title before it gets sent to the browser, you can follow advice in [this section](#generating-dynamic-meta-tags-on-the-server). Alternatively, you can pre-build each page as a static HTML file which then loads the JavaScript bundle, which is covered [here](#pre-rendering-into-static-html-files).\n\n## Installing a Dependency\n\nThe generated project includes React and ReactDOM as dependencies. It also includes a set of scripts used by Create React App as a development dependency. You may install other dependencies (for example, React Router) with `npm`:\n\n```sh\nnpm install --save react-router\n```\n\nAlternatively you may use `yarn`:\n\n```sh\nyarn add react-router\n```\n\nThis works for any library, not just `react-router`.\n\n## Importing a Component\n\nThis project setup supports ES6 modules thanks to Babel.<br>\nWhile you can still use `require()` and `module.exports`, we encourage you to use [`import` and `export`](http://exploringjs.com/es6/ch_modules.html) instead.\n\nFor example:\n\n### `Button.js`\n\n```js\nimport React, { Component } from 'react';\n\nclass Button extends Component {\n  render() {\n    // ...\n  }\n}\n\nexport default Button; // Don’t forget to use export default!\n```\n\n### `DangerButton.js`\n\n```js\nimport React, { Component } from 'react';\nimport Button from './Button'; // Import a component from another file\n\nclass DangerButton extends Component {\n  render() {\n    return <Button color=\"red\" />;\n  }\n}\n\nexport default DangerButton;\n```\n\nBe aware of the [difference between default and named exports](http://stackoverflow.com/questions/36795819/react-native-es-6-when-should-i-use-curly-braces-for-import/36796281#36796281). It is a common source of mistakes.\n\nWe suggest that you stick to using default imports and exports when a module only exports a single thing (for example, a component). That’s what you get when you use `export default Button` and `import Button from './Button'`.\n\nNamed exports are useful for utility modules that export several functions. A module may have at most one default export and as many named exports as you like.\n\nLearn more about ES6 modules:\n\n- [When to use the curly braces?](http://stackoverflow.com/questions/36795819/react-native-es-6-when-should-i-use-curly-braces-for-import/36796281#36796281)\n- [Exploring ES6: Modules](http://exploringjs.com/es6/ch_modules.html)\n- [Understanding ES6: Modules](https://leanpub.com/understandinges6/read#leanpub-auto-encapsulating-code-with-modules)\n\n## Code Splitting\n\nInstead of downloading the entire app before users can use it, code splitting allows you to split your code into small chunks which you can then load on demand.\n\nThis project setup supports code splitting via [dynamic `import()`](http://2ality.com/2017/01/import-operator.html#loading-code-on-demand). Its [proposal](https://github.com/tc39/proposal-dynamic-import) is in stage 3. The `import()` function-like form takes the module name as an argument and returns a [`Promise`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise) which always resolves to the namespace object of the module.\n\nHere is an example:\n\n### `moduleA.js`\n\n```js\nconst moduleA = 'Hello';\n\nexport { moduleA };\n```\n\n### `App.js`\n\n```js\nimport React, { Component } from 'react';\n\nclass App extends Component {\n  handleClick = () => {\n    import('./moduleA')\n      .then(({ moduleA }) => {\n        // Use moduleA\n      })\n      .catch((err) => {\n        // Handle failure\n      });\n  };\n\n  render() {\n    return (\n      <div>\n        <button onClick={this.handleClick}>Load</button>\n      </div>\n    );\n  }\n}\n\nexport default App;\n```\n\nThis will make `moduleA.js` and all its unique dependencies as a separate chunk that only loads after the user clicks the 'Load' button.\n\nYou can also use it with `async` / `await` syntax if you prefer it.\n\n### With React Router\n\nIf you are using React Router check out [this tutorial](http://serverless-stack.com/chapters/code-splitting-in-create-react-app.html) on how to use code splitting with it. You can find the companion GitHub repository [here](https://github.com/AnomalyInnovations/serverless-stack-demo-client/tree/code-splitting-in-create-react-app).\n\n## Adding a Stylesheet\n\nThis project setup uses [Webpack](https://webpack.js.org/) for handling all assets. Webpack offers a custom way of “extending” the concept of `import` beyond JavaScript. To express that a JavaScript file depends on a CSS file, you need to **import the CSS from the JavaScript file**:\n\n### `Button.css`\n\n```css\n.Button {\n  padding: 20px;\n}\n```\n\n### `Button.js`\n\n```js\nimport React, { Component } from 'react';\nimport './Button.css'; // Tell Webpack that Button.js uses these styles\n\nclass Button extends Component {\n  render() {\n    // You can use them as regular CSS styles\n    return <div className=\"Button\" />;\n  }\n}\n```\n\n**This is not required for React** but many people find this feature convenient. You can read about the benefits of this approach [here](https://medium.com/seek-ui-engineering/block-element-modifying-your-javascript-components-d7f99fcab52b). However you should be aware that this makes your code less portable to other build tools and environments than Webpack.\n\nIn development, expressing dependencies this way allows your styles to be reloaded on the fly as you edit them. In production, all CSS files will be concatenated into a single minified `.css` file in the build output.\n\nIf you are concerned about using Webpack-specific semantics, you can put all your CSS right into `src/index.css`. It would still be imported from `src/index.js`, but you could always remove that import if you later migrate to a different build tool.\n\n## Post-Processing CSS\n\nThis project setup minifies your CSS and adds vendor prefixes to it automatically through [Autoprefixer](https://github.com/postcss/autoprefixer) so you don’t need to worry about it.\n\nFor example, this:\n\n```css\n.App {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n}\n```\n\nbecomes this:\n\n```css\n.App {\n  display: -webkit-box;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-box-orient: horizontal;\n  -webkit-box-direction: normal;\n  -ms-flex-direction: row;\n  flex-direction: row;\n  -webkit-box-align: center;\n  -ms-flex-align: center;\n  align-items: center;\n}\n```\n\nIf you need to disable autoprefixing for some reason, [follow this section](https://github.com/postcss/autoprefixer#disabling).\n\n## Adding a CSS Preprocessor (Sass, Less etc.)\n\nGenerally, we recommend that you don’t reuse the same CSS classes across different components. For example, instead of using a `.Button` CSS class in `<AcceptButton>` and `<RejectButton>` components, we recommend creating a `<Button>` component with its own `.Button` styles, that both `<AcceptButton>` and `<RejectButton>` can render (but [not inherit](https://facebook.github.io/react/docs/composition-vs-inheritance.html)).\n\nFollowing this rule often makes CSS preprocessors less useful, as features like mixins and nesting are replaced by component composition. You can, however, integrate a CSS preprocessor if you find it valuable. In this walkthrough, we will be using Sass, but you can also use Less, or another alternative.\n\nFirst, let’s install the command-line interface for Sass:\n\n```sh\nnpm install --save node-sass-chokidar\n```\n\nAlternatively you may use `yarn`:\n\n```sh\nyarn add node-sass-chokidar\n```\n\nThen in `package.json`, add the following lines to `scripts`:\n\n```diff\n   \"scripts\": {\n+    \"build-css\": \"node-sass-chokidar src/ -o src/\",\n+    \"watch-css\": \"npm run build-css && node-sass-chokidar src/ -o src/ --watch --recursive\",\n     \"start\": \"react-scripts start\",\n     \"build\": \"react-scripts build\",\n     \"test\": \"react-scripts test --env=jsdom\",\n```\n\n> Note: To use a different preprocessor, replace `build-css` and `watch-css` commands according to your preprocessor’s documentation.\n\nNow you can rename `src/App.css` to `src/App.scss` and run `npm run watch-css`. The watcher will find every Sass file in `src` subdirectories, and create a corresponding CSS file next to it, in our case overwriting `src/App.css`. Since `src/App.js` still imports `src/App.css`, the styles become a part of your application. You can now edit `src/App.scss`, and `src/App.css` will be regenerated.\n\nTo share variables between Sass files, you can use Sass imports. For example, `src/App.scss` and other component style files could include `@import \"./shared.scss\";` with variable definitions.\n\nTo enable importing files without using relative paths, you can add the `--include-path` option to the command in `package.json`.\n\n```\n\"build-css\": \"node-sass-chokidar --include-path ./src --include-path ./node_modules src/ -o src/\",\n\"watch-css\": \"npm run build-css && node-sass-chokidar --include-path ./src --include-path ./node_modules src/ -o src/ --watch --recursive\",\n```\n\nThis will allow you to do imports like\n\n```scss\n@import 'styles/_colors.scss'; // assuming a styles directory under src/\n@import 'nprogress/nprogress'; // importing a css file from the nprogress node module\n```\n\nAt this point you might want to remove all CSS files from the source control, and add `src/**/*.css` to your `.gitignore` file. It is generally a good practice to keep the build products outside of the source control.\n\nAs a final step, you may find it convenient to run `watch-css` automatically with `npm start`, and run `build-css` as a part of `npm run build`. You can use the `&&` operator to execute two scripts sequentially. However, there is no cross-platform way to run two scripts in parallel, so we will install a package for this:\n\n```sh\nnpm install --save npm-run-all\n```\n\nAlternatively you may use `yarn`:\n\n```sh\nyarn add npm-run-all\n```\n\nThen we can change `start` and `build` scripts to include the CSS preprocessor commands:\n\n```diff\n   \"scripts\": {\n     \"build-css\": \"node-sass-chokidar src/ -o src/\",\n     \"watch-css\": \"npm run build-css && node-sass-chokidar src/ -o src/ --watch --recursive\",\n-    \"start\": \"react-scripts start\",\n-    \"build\": \"react-scripts build\",\n+    \"start-js\": \"react-scripts start\",\n+    \"start\": \"npm-run-all -p watch-css start-js\",\n+    \"build\": \"npm run build-css && react-scripts build\",\n     \"test\": \"react-scripts test --env=jsdom\",\n     \"eject\": \"react-scripts eject\"\n   }\n```\n\nNow running `npm start` and `npm run build` also builds Sass files.\n\n**Why `node-sass-chokidar`?**\n\n`node-sass` has been reported as having the following issues:\n\n- `node-sass --watch` has been reported to have _performance issues_ in certain conditions when used in a virtual machine or with docker.\n\n- Infinite styles compiling [#1939](https://github.com/facebookincubator/create-react-app/issues/1939)\n\n- `node-sass` has been reported as having issues with detecting new files in a directory [#1891](https://github.com/sass/node-sass/issues/1891)\n\n`node-sass-chokidar` is used here as it addresses these issues.\n\n## Adding Images, Fonts, and Files\n\nWith Webpack, using static assets like images and fonts works similarly to CSS.\n\nYou can **`import` a file right in a JavaScript module**. This tells Webpack to include that file in the bundle. Unlike CSS imports, importing a file gives you a string value. This value is the final path you can reference in your code, e.g. as the `src` attribute of an image or the `href` of a link to a PDF.\n\nTo reduce the number of requests to the server, importing images that are less than 10,000 bytes returns a [data URI](https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/Data_URIs) instead of a path. This applies to the following file extensions: bmp, gif, jpg, jpeg, and png. SVG files are excluded due to [#1153](https://github.com/facebookincubator/create-react-app/issues/1153).\n\nHere is an example:\n\n```js\nimport React from 'react';\nimport logo from './logo.png'; // Tell Webpack this JS file uses this image\n\nconsole.log(logo); // /logo.84287d09.png\n\nfunction Header() {\n  // Import result is the URL of your image\n  return <img src={logo} alt=\"Logo\" />;\n}\n\nexport default Header;\n```\n\nThis ensures that when the project is built, Webpack will correctly move the images into the build folder, and provide us with correct paths.\n\nThis works in CSS too:\n\n```css\n.Logo {\n  background-image: url(./logo.png);\n}\n```\n\nWebpack finds all relative module references in CSS (they start with `./`) and replaces them with the final paths from the compiled bundle. If you make a typo or accidentally delete an important file, you will see a compilation error, just like when you import a non-existent JavaScript module. The final filenames in the compiled bundle are generated by Webpack from content hashes. If the file content changes in the future, Webpack will give it a different name in production so you don’t need to worry about long-term caching of assets.\n\nPlease be advised that this is also a custom feature of Webpack.\n\n**It is not required for React** but many people enjoy it (and React Native uses a similar mechanism for images).<br>\nAn alternative way of handling static assets is described in the next section.\n\n## Using the `public` Folder\n\n> Note: this feature is available with `react-scripts@0.5.0` and higher.\n\n### Changing the HTML\n\nThe `public` folder contains the HTML file so you can tweak it, for example, to [set the page title](#changing-the-page-title).\nThe `<script>` tag with the compiled code will be added to it automatically during the build process.\n\n### Adding Assets Outside of the Module System\n\nYou can also add other assets to the `public` folder.\n\nNote that we normally encourage you to `import` assets in JavaScript files instead.\nFor example, see the sections on [adding a stylesheet](#adding-a-stylesheet) and [adding images and fonts](#adding-images-fonts-and-files).\nThis mechanism provides a number of benefits:\n\n- Scripts and stylesheets get minified and bundled together to avoid extra network requests.\n- Missing files cause compilation errors instead of 404 errors for your users.\n- Result filenames include content hashes so you don’t need to worry about browsers caching their old versions.\n\nHowever there is an **escape hatch** that you can use to add an asset outside of the module system.\n\nIf you put a file into the `public` folder, it will **not** be processed by Webpack. Instead it will be copied into the build folder untouched. To reference assets in the `public` folder, you need to use a special variable called `PUBLIC_URL`.\n\nInside `index.html`, you can use it like this:\n\n```html\n<link rel=\"shortcut icon\" href=\"%PUBLIC_URL%/favicon.ico\" />\n```\n\nOnly files inside the `public` folder will be accessible by `%PUBLIC_URL%` prefix. If you need to use a file from `src` or `node_modules`, you’ll have to copy it there to explicitly specify your intention to make this file a part of the build.\n\nWhen you run `npm run build`, Create React App will substitute `%PUBLIC_URL%` with a correct absolute path so your project works even if you use client-side routing or host it at a non-root URL.\n\nIn JavaScript code, you can use `process.env.PUBLIC_URL` for similar purposes:\n\n```js\nrender() {\n  // Note: this is an escape hatch and should be used sparingly!\n  // Normally we recommend using `import` for getting asset URLs\n  // as described in “Adding Images and Fonts” above this section.\n  return <img src={process.env.PUBLIC_URL + '/img/logo.png'} />;\n}\n```\n\nKeep in mind the downsides of this approach:\n\n- None of the files in `public` folder get post-processed or minified.\n- Missing files will not be called at compilation time, and will cause 404 errors for your users.\n- Result filenames won’t include content hashes so you’ll need to add query arguments or rename them every time they change.\n\n### When to Use the `public` Folder\n\nNormally we recommend importing [stylesheets](#adding-a-stylesheet), [images, and fonts](#adding-images-fonts-and-files) from JavaScript.\nThe `public` folder is useful as a workaround for a number of less common cases:\n\n- You need a file with a specific name in the build output, such as [`manifest.webmanifest`](https://developer.mozilla.org/en-US/docs/Web/Manifest).\n- You have thousands of images and need to dynamically reference their paths.\n- You want to include a small script like [`pace.js`](http://github.hubspot.com/pace/docs/welcome/) outside of the bundled code.\n- Some library may be incompatible with Webpack and you have no other option but to include it as a `<script>` tag.\n\nNote that if you add a `<script>` that declares global variables, you also need to read the next section on using them.\n\n## Using Global Variables\n\nWhen you include a script in the HTML file that defines global variables and try to use one of these variables in the code, the linter will complain because it cannot see the definition of the variable.\n\nYou can avoid this by reading the global variable explicitly from the `window` object, for example:\n\n```js\nconst $ = window.$;\n```\n\nThis makes it obvious you are using a global variable intentionally rather than because of a typo.\n\nAlternatively, you can force the linter to ignore any line by adding `// eslint-disable-line` after it.\n\n## Adding Bootstrap\n\nYou don’t have to use [React Bootstrap](https://react-bootstrap.github.io) together with React but it is a popular library for integrating Bootstrap with React apps. If you need it, you can integrate it with Create React App by following these steps:\n\nInstall React Bootstrap and Bootstrap from npm. React Bootstrap does not include Bootstrap CSS so this needs to be installed as well:\n\n```sh\nnpm install --save react-bootstrap bootstrap@3\n```\n\nAlternatively you may use `yarn`:\n\n```sh\nyarn add react-bootstrap bootstrap@3\n```\n\nImport Bootstrap CSS and optionally Bootstrap theme CSS in the beginning of your `src/index.js` file:\n\n```js\nimport 'bootstrap/dist/css/bootstrap.css';\nimport 'bootstrap/dist/css/bootstrap-theme.css';\n// Put any other imports below so that CSS from your\n// components takes precedence over default styles.\n```\n\nImport required React Bootstrap components within `src/App.js` file or your custom component files:\n\n```js\nimport { Navbar, Jumbotron, Button } from 'react-bootstrap';\n```\n\nNow you are ready to use the imported React Bootstrap components within your component hierarchy defined in the render method. Here is an example [`App.js`](https://gist.githubusercontent.com/gaearon/85d8c067f6af1e56277c82d19fd4da7b/raw/6158dd991b67284e9fc8d70b9d973efe87659d72/App.js) redone using React Bootstrap.\n\n### Using a Custom Theme\n\nSometimes you might need to tweak the visual styles of Bootstrap (or equivalent package).<br>\nWe suggest the following approach:\n\n- Create a new package that depends on the package you wish to customize, e.g. Bootstrap.\n- Add the necessary build steps to tweak the theme, and publish your package on npm.\n- Install your own theme npm package as a dependency of your app.\n\nHere is an example of adding a [customized Bootstrap](https://medium.com/@tacomanator/customizing-create-react-app-aa9ffb88165) that follows these steps.\n\n## Adding Flow\n\nFlow is a static type checker that helps you write code with fewer bugs. Check out this [introduction to using static types in JavaScript](https://medium.com/@preethikasireddy/why-use-static-types-in-javascript-part-1-8382da1e0adb) if you are new to this concept.\n\nRecent versions of [Flow](http://flowtype.org/) work with Create React App projects out of the box.\n\nTo add Flow to a Create React App project, follow these steps:\n\n1. Run `npm install --save flow-bin` (or `yarn add flow-bin`).\n2. Add `\"flow\": \"flow\"` to the `scripts` section of your `package.json`.\n3. Run `npm run flow init` (or `yarn flow init`) to create a [`.flowconfig` file](https://flowtype.org/docs/advanced-configuration.html) in the root directory.\n4. Add `// @flow` to any files you want to type check (for example, to `src/App.js`).\n\nNow you can run `npm run flow` (or `yarn flow`) to check the files for type errors.\nYou can optionally use an IDE like [Nuclide](https://nuclide.io/docs/languages/flow/) for a better integrated experience.\nIn the future we plan to integrate it into Create React App even more closely.\n\nTo learn more about Flow, check out [its documentation](https://flowtype.org/).\n\n## Adding Custom Environment Variables\n\n> Note: this feature is available with `react-scripts@0.2.3` and higher.\n\nYour project can consume variables declared in your environment as if they were declared locally in your JS files. By\ndefault you will have `NODE_ENV` defined for you, and any other environment variables starting with\n`REACT_APP_`.\n\n**The environment variables are embedded during the build time**. Since Create React App produces a static HTML/CSS/JS bundle, it can’t possibly read them at runtime. To read them at runtime, you would need to load HTML into memory on the server and replace placeholders in runtime, just like [described here](#injecting-data-from-the-server-into-the-page). Alternatively you can rebuild the app on the server anytime you change them.\n\n> Note: You must create custom environment variables beginning with `REACT_APP_`. Any other variables except `NODE_ENV` will be ignored to avoid accidentally [exposing a private key on the machine that could have the same name](https://github.com/facebookincubator/create-react-app/issues/865#issuecomment-252199527). Changing any environment variables will require you to restart the development server if it is running.\n\nThese environment variables will be defined for you on `process.env`. For example, having an environment\nvariable named `REACT_APP_SECRET_CODE` will be exposed in your JS as `process.env.REACT_APP_SECRET_CODE`.\n\nThere is also a special built-in environment variable called `NODE_ENV`. You can read it from `process.env.NODE_ENV`. When you run `npm start`, it is always equal to `'development'`, when you run `npm test` it is always equal to `'test'`, and when you run `npm run build` to make a production bundle, it is always equal to `'production'`. **You cannot override `NODE_ENV` manually.** This prevents developers from accidentally deploying a slow development build to production.\n\nThese environment variables can be useful for displaying information conditionally based on where the project is\ndeployed or consuming sensitive data that lives outside of version control.\n\nFirst, you need to have environment variables defined. For example, let’s say you wanted to consume a secret defined\nin the environment inside a `<form>`:\n\n```jsx\nrender() {\n  return (\n    <div>\n      <small>You are running this application in <b>{process.env.NODE_ENV}</b> mode.</small>\n      <form>\n        <input type=\"hidden\" defaultValue={process.env.REACT_APP_SECRET_CODE} />\n      </form>\n    </div>\n  );\n}\n```\n\nDuring the build, `process.env.REACT_APP_SECRET_CODE` will be replaced with the current value of the `REACT_APP_SECRET_CODE` environment variable. Remember that the `NODE_ENV` variable will be set for you automatically.\n\nWhen you load the app in the browser and inspect the `<input>`, you will see its value set to `abcdef`, and the bold text will show the environment provided when using `npm start`:\n\n```html\n<div>\n  <small>You are running this application in <b>development</b> mode.</small>\n  <form>\n    <input type=\"hidden\" value=\"abcdef\" />\n  </form>\n</div>\n```\n\nThe above form is looking for a variable called `REACT_APP_SECRET_CODE` from the environment. In order to consume this\nvalue, we need to have it defined in the environment. This can be done using two ways: either in your shell or in\na `.env` file. Both of these ways are described in the next few sections.\n\nHaving access to the `NODE_ENV` is also useful for performing actions conditionally:\n\n```js\nif (process.env.NODE_ENV !== 'production') {\n  analytics.disable();\n}\n```\n\nWhen you compile the app with `npm run build`, the minification step will strip out this condition, and the resulting bundle will be smaller.\n\n### Referencing Environment Variables in the HTML\n\n> Note: this feature is available with `react-scripts@0.9.0` and higher.\n\nYou can also access the environment variables starting with `REACT_APP_` in the `public/index.html`. For example:\n\n```html\n<title>%REACT_APP_WEBSITE_NAME%</title>\n```\n\nNote that the caveats from the above section apply:\n\n- Apart from a few built-in variables (`NODE_ENV` and `PUBLIC_URL`), variable names must start with `REACT_APP_` to work.\n- The environment variables are injected at build time. If you need to inject them at runtime, [follow this approach instead](#generating-dynamic-meta-tags-on-the-server).\n\n### Adding Temporary Environment Variables In Your Shell\n\nDefining environment variables can vary between OSes. It’s also important to know that this manner is temporary for the\nlife of the shell session.\n\n#### Windows (cmd.exe)\n\n```cmd\nset REACT_APP_SECRET_CODE=abcdef&&npm start\n```\n\n(Note: the lack of whitespace is intentional.)\n\n#### Linux, macOS (Bash)\n\n```bash\nREACT_APP_SECRET_CODE=abcdef npm start\n```\n\n### Adding Development Environment Variables In `.env`\n\n> Note: this feature is available with `react-scripts@0.5.0` and higher.\n\nTo define permanent environment variables, create a file called `.env` in the root of your project:\n\n```\nREACT_APP_SECRET_CODE=abcdef\n```\n\n`.env` files **should be** checked into source control (with the exclusion of `.env*.local`).\n\n#### What other `.env` files can be used?\n\n> Note: this feature is **available with `react-scripts@1.0.0` and higher**.\n\n- `.env`: Default.\n- `.env.local`: Local overrides. **This file is loaded for all environments except test.**\n- `.env.development`, `.env.test`, `.env.production`: Environment-specific settings.\n- `.env.development.local`, `.env.test.local`, `.env.production.local`: Local overrides of environment-specific settings.\n\nFiles on the left have more priority than files on the right:\n\n- `npm start`: `.env.development.local`, `.env.development`, `.env.local`, `.env`\n- `npm run build`: `.env.production.local`, `.env.production`, `.env.local`, `.env`\n- `npm test`: `.env.test.local`, `.env.test`, `.env` (note `.env.local` is missing)\n\nThese variables will act as the defaults if the machine does not explicitly set them.<br>\nPlease refer to the [dotenv documentation](https://github.com/motdotla/dotenv) for more details.\n\n> Note: If you are defining environment variables for development, your CI and/or hosting platform will most likely need\n> these are defined as well. Consult their documentation how to do this. For example, see the documentation for [Travis CI](https://docs.travis-ci.com/user/environment-variables/) or [Heroku](https://devcenter.heroku.com/articles/config-vars).\n\n## Can I Use Decorators?\n\nMany popular libraries use [decorators](https://medium.com/google-developers/exploring-es7-decorators-76ecb65fb841) in their documentation.<br>\nCreate React App doesn’t support decorator syntax at the moment because:\n\n- It is an experimental proposal and is subject to change.\n- The current specification version is not officially supported by Babel.\n- If the specification changes, we won’t be able to write a codemod because we don’t use them internally at Facebook.\n\nHowever in many cases you can rewrite decorator-based code without decorators just as fine.<br>\nPlease refer to these two threads for reference:\n\n- [#214](https://github.com/facebookincubator/create-react-app/issues/214)\n- [#411](https://github.com/facebookincubator/create-react-app/issues/411)\n\nCreate React App will add decorator support when the specification advances to a stable stage.\n\n## Integrating with an API Backend\n\nThese tutorials will help you to integrate your app with an API backend running on another port,\nusing `fetch()` to access it.\n\n### Node\n\nCheck out [this tutorial](https://www.fullstackreact.com/articles/using-create-react-app-with-a-server/).\nYou can find the companion GitHub repository [here](https://github.com/fullstackreact/food-lookup-demo).\n\n### Ruby on Rails\n\nCheck out [this tutorial](https://www.fullstackreact.com/articles/how-to-get-create-react-app-to-work-with-your-rails-api/).\nYou can find the companion GitHub repository [here](https://github.com/fullstackreact/food-lookup-demo-rails).\n\n## Proxying API Requests in Development\n\n> Note: this feature is available with `react-scripts@0.2.3` and higher.\n\nPeople often serve the front-end React app from the same host and port as their backend implementation.<br>\nFor example, a production setup might look like this after the app is deployed:\n\n```\n/             - static server returns index.html with React app\n/todos        - static server returns index.html with React app\n/api/todos    - server handles any /api/* requests using the backend implementation\n```\n\nSuch setup is **not** required. However, if you **do** have a setup like this, it is convenient to write requests like `fetch('/api/todos')` without worrying about redirecting them to another host or port during development.\n\nTo tell the development server to proxy any unknown requests to your API server in development, add a `proxy` field to your `package.json`, for example:\n\n```js\n  \"proxy\": \"http://localhost:4000\",\n```\n\nThis way, when you `fetch('/api/todos')` in development, the development server will recognize that it’s not a static asset, and will proxy your request to `http://localhost:4000/api/todos` as a fallback. The development server will only attempt to send requests without a `text/html` accept header to the proxy.\n\nConveniently, this avoids [CORS issues](http://stackoverflow.com/questions/21854516/understanding-ajax-cors-and-security-considerations) and error messages like this in development:\n\n```\nFetch API cannot load http://localhost:4000/api/todos. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:3000' is therefore not allowed access. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.\n```\n\nKeep in mind that `proxy` only has effect in development (with `npm start`), and it is up to you to ensure that URLs like `/api/todos` point to the right thing in production. You don’t have to use the `/api` prefix. Any unrecognized request without a `text/html` accept header will be redirected to the specified `proxy`.\n\nThe `proxy` option supports HTTP, HTTPS and WebSocket connections.<br>\nIf the `proxy` option is **not** flexible enough for you, alternatively you can:\n\n- [Configure the proxy yourself](#configuring-the-proxy-manually)\n- Enable CORS on your server ([here’s how to do it for Express](http://enable-cors.org/server_expressjs.html)).\n- Use [environment variables](#adding-custom-environment-variables) to inject the right server host and port into your app.\n\n### \"Invalid Host Header\" Errors After Configuring Proxy\n\nWhen you enable the `proxy` option, you opt into a more strict set of host checks. This is necessary because leaving the backend open to remote hosts makes your computer vulnerable to DNS rebinding attacks. The issue is explained in [this article](https://medium.com/webpack/webpack-dev-server-middleware-security-issues-1489d950874a) and [this issue](https://github.com/webpack/webpack-dev-server/issues/887).\n\nThis shouldn’t affect you when developing on `localhost`, but if you develop remotely like [described here](https://github.com/facebookincubator/create-react-app/issues/2271), you will see this error in the browser after enabling the `proxy` option:\n\n> Invalid Host header\n\nTo work around it, you can specify your public development host in a file called `.env.development` in the root of your project:\n\n```\nHOST=mypublicdevhost.com\n```\n\nIf you restart the development server now and load the app from the specified host, it should work.\n\nIf you are still having issues or if you’re using a more exotic environment like a cloud editor, you can bypass the host check completely by adding a line to `.env.development.local`. **Note that this is dangerous and exposes your machine to remote code execution from malicious websites:**\n\n```\n# NOTE: THIS IS DANGEROUS!\n# It exposes your machine to attacks from the websites you visit.\nDANGEROUSLY_DISABLE_HOST_CHECK=true\n```\n\nWe don’t recommend this approach.\n\n### Configuring the Proxy Manually\n\n> Note: this feature is available with `react-scripts@1.0.0` and higher.\n\nIf the `proxy` option is **not** flexible enough for you, you can specify an object in the following form (in `package.json`).<br>\nYou may also specify any configuration value [`http-proxy-middleware`](https://github.com/chimurai/http-proxy-middleware#options) or [`http-proxy`](https://github.com/nodejitsu/node-http-proxy#options) supports.\n\n```js\n{\n  // ...\n  \"proxy\": {\n    \"/api\": {\n      \"target\": \"<url>\",\n      \"ws\": true\n      // ...\n    }\n  }\n  // ...\n}\n```\n\nAll requests matching this path will be proxies, no exceptions. This includes requests for `text/html`, which the standard `proxy` option does not proxy.\n\nIf you need to specify multiple proxies, you may do so by specifying additional entries.\nYou may also narrow down matches using `*` and/or `**`, to match the path exactly or any subpath.\n\n```js\n{\n  // ...\n  \"proxy\": {\n    // Matches any request starting with /api\n    \"/api\": {\n      \"target\": \"<url_1>\",\n      \"ws\": true\n      // ...\n    },\n    // Matches any request starting with /foo\n    \"/foo\": {\n      \"target\": \"<url_2>\",\n      \"ssl\": true,\n      \"pathRewrite\": {\n        \"^/foo\": \"/foo/beta\"\n      }\n      // ...\n    },\n    // Matches /bar/abc.html but not /bar/sub/def.html\n    \"/bar/*.html\": {\n      \"target\": \"<url_3>\",\n      // ...\n    },\n    // Matches /baz/abc.html and /baz/sub/def.html\n    \"/baz/**/*.html\": {\n      \"target\": \"<url_4>\"\n      // ...\n    }\n  }\n  // ...\n}\n```\n\n### Configuring a WebSocket Proxy\n\nWhen setting up a WebSocket proxy, there are some extra considerations to be aware of.\n\nIf you’re using a WebSocket engine like [Socket.io](https://socket.io/), you must have a Socket.io server running that you can use as the proxy target. Socket.io will not work with a standard WebSocket server. Specifically, don't expect Socket.io to work with [the websocket.org echo test](http://websocket.org/echo.html).\n\nThere’s some good documentation available for [setting up a Socket.io server](https://socket.io/docs/).\n\nStandard WebSockets **will** work with a standard WebSocket server as well as the websocket.org echo test. You can use libraries like [ws](https://github.com/websockets/ws) for the server, with [native WebSockets in the browser](https://developer.mozilla.org/en-US/docs/Web/API/WebSocket).\n\nEither way, you can proxy WebSocket requests manually in `package.json`:\n\n```js\n{\n  // ...\n  \"proxy\": {\n    \"/socket\": {\n      // Your compatible WebSocket server\n      \"target\": \"ws://<socket_url>\",\n      // Tell http-proxy-middleware that this is a WebSocket proxy.\n      // Also allows you to proxy WebSocket requests without an additional HTTP request\n      // https://github.com/chimurai/http-proxy-middleware#external-websocket-upgrade\n      \"ws\": true\n      // ...\n    }\n  }\n  // ...\n}\n```\n\n## Using HTTPS in Development\n\n> Note: this feature is available with `react-scripts@0.4.0` and higher.\n\nYou may require the dev server to serve pages over HTTPS. One particular case where this could be useful is when using [the \"proxy\" feature](#proxying-api-requests-in-development) to proxy requests to an API server when that API server is itself serving HTTPS.\n\nTo do this, set the `HTTPS` environment variable to `true`, then start the dev server as usual with `npm start`:\n\n#### Windows (cmd.exe)\n\n```cmd\nset HTTPS=true&&npm start\n```\n\n(Note: the lack of whitespace is intentional.)\n\n#### Linux, macOS (Bash)\n\n```bash\nHTTPS=true npm start\n```\n\nNote that the server will use a self-signed certificate, so your web browser will almost definitely display a warning upon accessing the page.\n\n## Generating Dynamic `<meta>` Tags on the Server\n\nSince Create React App doesn’t support server rendering, you might be wondering how to make `<meta>` tags dynamic and reflect the current URL. To solve this, we recommend to add placeholders into the HTML, like this:\n\n```html\n<!doctype html>\n<html lang=\"en\">\n  <head>\n    <meta property=\"og:title\" content=\"__OG_TITLE__\" />\n    <meta property=\"og:description\" content=\"__OG_DESCRIPTION__\" />\n  </head>\n</html>\n```\n\nThen, on the server, regardless of the backend you use, you can read `index.html` into memory and replace `__OG_TITLE__`, `__OG_DESCRIPTION__`, and any other placeholders with values depending on the current URL. Just make sure to sanitize and escape the interpolated values so that they are safe to embed into HTML!\n\nIf you use a Node server, you can even share the route matching logic between the client and the server. However duplicating it also works fine in simple cases.\n\n## Pre-Rendering into Static HTML Files\n\nIf you’re hosting your `build` with a static hosting provider you can use [react-snapshot](https://www.npmjs.com/package/react-snapshot) to generate HTML pages for each route, or relative link, in your application. These pages will then seamlessly become active, or “hydrated”, when the JavaScript bundle has loaded.\n\nThere are also opportunities to use this outside of static hosting, to take the pressure off the server when generating and caching routes.\n\nThe primary benefit of pre-rendering is that you get the core content of each page _with_ the HTML payload—regardless of whether or not your JavaScript bundle successfully downloads. It also increases the likelihood that each route of your application will be picked up by search engines.\n\nYou can read more about [zero-configuration pre-rendering (also called snapshotting) here](https://medium.com/superhighfives/an-almost-static-stack-6df0a2791319).\n\n## Injecting Data from the Server into the Page\n\nSimilarly to the previous section, you can leave some placeholders in the HTML that inject global variables, for example:\n\n```js\n<!doctype html>\n<html lang=\"en\">\n  <head>\n    <script>\n      window.SERVER_DATA = __SERVER_DATA__;\n    </script>\n```\n\nThen, on the server, you can replace `__SERVER_DATA__` with a JSON of real data right before sending the response. The client code can then read `window.SERVER_DATA` to use it. **Make sure to [sanitize the JSON before sending it to the client](https://medium.com/node-security/the-most-common-xss-vulnerability-in-react-js-applications-2bdffbcc1fa0) as it makes your app vulnerable to XSS attacks.**\n\n## Running Tests\n\n> Note: this feature is available with `react-scripts@0.3.0` and higher.<br> >[Read the migration guide to learn how to enable it in older projects!](https://github.com/facebookincubator/create-react-app/blob/master/CHANGELOG.md#migrating-from-023-to-030)\n\nCreate React App uses [Jest](https://facebook.github.io/jest/) as its test runner. To prepare for this integration, we did a [major revamp](https://facebook.github.io/jest/blog/2016/09/01/jest-15.html) of Jest so if you heard bad things about it years ago, give it another try.\n\nJest is a Node-based runner. This means that the tests always run in a Node environment and not in a real browser. This lets us enable fast iteration speed and prevent flakiness.\n\nWhile Jest provides browser globals such as `window` thanks to [jsdom](https://github.com/tmpvar/jsdom), they are only approximations of the real browser behavior. Jest is intended to be used for unit tests of your logic and your components rather than the DOM quirks.\n\nWe recommend that you use a separate tool for browser end-to-end tests if you need them. They are beyond the scope of Create React App.\n\n### Filename Conventions\n\nJest will look for test files with any of the following popular naming conventions:\n\n- Files with `.js` suffix in `__tests__` folders.\n- Files with `.test.js` suffix.\n- Files with `.spec.js` suffix.\n\nThe `.test.js` / `.spec.js` files (or the `__tests__` folders) can be located at any depth under the `src` top level folder.\n\nWe recommend to put the test files (or `__tests__` folders) next to the code they are testing so that relative imports appear shorter. For example, if `App.test.js` and `App.js` are in the same folder, the test just needs to `import App from './App'` instead of a long relative path. Colocation also helps find tests more quickly in larger projects.\n\n### Command Line Interface\n\nWhen you run `npm test`, Jest will launch in the watch mode. Every time you save a file, it will re-run the tests, just like `npm start` recompiles the code.\n\nThe watcher includes an interactive command-line interface with the ability to run all tests, or focus on a search pattern. It is designed this way so that you can keep it open and enjoy fast re-runs. You can learn the commands from the “Watch Usage” note that the watcher prints after every run:\n\n![Jest watch mode](http://facebook.github.io/jest/img/blog/15-watch.gif)\n\n### Version Control Integration\n\nBy default, when you run `npm test`, Jest will only run the tests related to files changed since the last commit. This is an optimization designed to make your tests run fast regardless of how many tests you have. However it assumes that you don’t often commit the code that doesn’t pass the tests.\n\nJest will always explicitly mention that it only ran tests related to the files changed since the last commit. You can also press `a` in the watch mode to force Jest to run all tests.\n\nJest will always run all tests on a [continuous integration](#continuous-integration) server or if the project is not inside a Git or Mercurial repository.\n\n### Writing Tests\n\nTo create tests, add `it()` (or `test()`) blocks with the name of the test and its code. You may optionally wrap them in `describe()` blocks for logical grouping but this is neither required nor recommended.\n\nJest provides a built-in `expect()` global function for making assertions. A basic test could look like this:\n\n```js\nimport sum from './sum';\n\nit('sums numbers', () => {\n  expect(sum(1, 2)).toEqual(3);\n  expect(sum(2, 2)).toEqual(4);\n});\n```\n\nAll `expect()` matchers supported by Jest are [extensively documented here](http://facebook.github.io/jest/docs/expect.html).<br>\nYou can also use [`jest.fn()` and `expect(fn).toBeCalled()`](http://facebook.github.io/jest/docs/expect.html#tohavebeencalled) to create “spies” or mock functions.\n\n### Testing Components\n\nThere is a broad spectrum of component testing techniques. They range from a “smoke test” verifying that a component renders without throwing, to shallow rendering and testing some of the output, to full rendering and testing component lifecycle and state changes.\n\nDifferent projects choose different testing tradeoffs based on how often components change, and how much logic they contain. If you haven’t decided on a testing strategy yet, we recommend that you start with creating simple smoke tests for your components:\n\n```js\nimport React from 'react';\nimport ReactDOM from 'react-dom';\nimport App from './App';\n\nit('renders without crashing', () => {\n  const div = document.createElement('div');\n  ReactDOM.render(<App />, div);\n});\n```\n\nThis test mounts a component and makes sure that it didn’t throw during rendering. Tests like this provide a lot value with very little effort so they are great as a starting point, and this is the test you will find in `src/App.test.js`.\n\nWhen you encounter bugs caused by changing components, you will gain a deeper insight into which parts of them are worth testing in your application. This might be a good time to introduce more specific tests asserting specific expected output or behavior.\n\nIf you’d like to test components in isolation from the child components they render, we recommend using [`shallow()` rendering API](http://airbnb.io/enzyme/docs/api/shallow.html) from [Enzyme](http://airbnb.io/enzyme/). To install it, run:\n\n```sh\nnpm install --save enzyme react-test-renderer\n```\n\nAlternatively you may use `yarn`:\n\n```sh\nyarn add enzyme react-test-renderer\n```\n\nYou can write a smoke test with it too:\n\n```js\nimport React from 'react';\nimport { shallow } from 'enzyme';\nimport App from './App';\n\nit('renders without crashing', () => {\n  shallow(<App />);\n});\n```\n\nUnlike the previous smoke test using `ReactDOM.render()`, this test only renders `<App>` and doesn’t go deeper. For example, even if `<App>` itself renders a `<Button>` that throws, this test will pass. Shallow rendering is great for isolated unit tests, but you may still want to create some full rendering tests to ensure the components integrate correctly. Enzyme supports [full rendering with `mount()`](http://airbnb.io/enzyme/docs/api/mount.html), and you can also use it for testing state changes and component lifecycle.\n\nYou can read the [Enzyme documentation](http://airbnb.io/enzyme/) for more testing techniques. Enzyme documentation uses Chai and Sinon for assertions but you don’t have to use them because Jest provides built-in `expect()` and `jest.fn()` for spies.\n\nHere is an example from Enzyme documentation that asserts specific output, rewritten to use Jest matchers:\n\n```js\nimport React from 'react';\nimport { shallow } from 'enzyme';\nimport App from './App';\n\nit('renders welcome message', () => {\n  const wrapper = shallow(<App />);\n  const welcome = <h2>Welcome to React</h2>;\n  // expect(wrapper.contains(welcome)).to.equal(true);\n  expect(wrapper.contains(welcome)).toEqual(true);\n});\n```\n\nAll Jest matchers are [extensively documented here](http://facebook.github.io/jest/docs/expect.html).<br>\nNevertheless you can use a third-party assertion library like [Chai](http://chaijs.com/) if you want to, as described below.\n\nAdditionally, you might find [jest-enzyme](https://github.com/blainekasten/enzyme-matchers) helpful to simplify your tests with readable matchers. The above `contains` code can be written simpler with jest-enzyme.\n\n```js\nexpect(wrapper).toContainReact(welcome);\n```\n\nTo enable this, install `jest-enzyme`:\n\n```sh\nnpm install --save jest-enzyme\n```\n\nAlternatively you may use `yarn`:\n\n```sh\nyarn add jest-enzyme\n```\n\nImport it in [`src/setupTests.js`](#initializing-test-environment) to make its matchers available in every test:\n\n```js\nimport 'jest-enzyme';\n```\n\n### Using Third Party Assertion Libraries\n\nWe recommend that you use `expect()` for assertions and `jest.fn()` for spies. If you are having issues with them please [file those against Jest](https://github.com/facebook/jest/issues/new), and we’ll fix them. We intend to keep making them better for React, supporting, for example, [pretty-printing React elements as JSX](https://github.com/facebook/jest/pull/1566).\n\nHowever, if you are used to other libraries, such as [Chai](http://chaijs.com/) and [Sinon](http://sinonjs.org/), or if you have existing code using them that you’d like to port over, you can import them normally like this:\n\n```js\nimport sinon from 'sinon';\nimport { expect } from 'chai';\n```\n\nand then use them in your tests like you normally do.\n\n### Initializing Test Environment\n\n> Note: this feature is available with `react-scripts@0.4.0` and higher.\n\nIf your app uses a browser API that you need to mock in your tests or if you just need a global setup before running your tests, add a `src/setupTests.js` to your project. It will be automatically executed before running your tests.\n\nFor example:\n\n#### `src/setupTests.js`\n\n```js\nconst localStorageMock = {\n  getItem: jest.fn(),\n  setItem: jest.fn(),\n  clear: jest.fn(),\n};\nglobal.localStorage = localStorageMock;\n```\n\n### Focusing and Excluding Tests\n\nYou can replace `it()` with `xit()` to temporarily exclude a test from being executed.<br>\nSimilarly, `fit()` lets you focus on a specific test without running any other tests.\n\n### Coverage Reporting\n\nJest has an integrated coverage reporter that works well with ES6 and requires no configuration.<br>\nRun `npm test -- --coverage` (note extra `--` in the middle) to include a coverage report like this:\n\n![coverage report](http://i.imgur.com/5bFhnTS.png)\n\nNote that tests run much slower with coverage so it is recommended to run it separately from your normal workflow.\n\n### Continuous Integration\n\nBy default `npm test` runs the watcher with interactive CLI. However, you can force it to run tests once and finish the process by setting an environment variable called `CI`.\n\nWhen creating a build of your application with `npm run build` linter warnings are not checked by default. Like `npm test`, you can force the build to perform a linter warning check by setting the environment variable `CI`. If any warnings are encountered then the build fails.\n\nPopular CI servers already set the environment variable `CI` by default but you can do this yourself too:\n\n### On CI servers\n\n#### Travis CI\n\n1. Following the [Travis Getting started](https://docs.travis-ci.com/user/getting-started/) guide for syncing your GitHub repository with Travis. You may need to initialize some settings manually in your [profile](https://travis-ci.org/profile) page.\n1. Add a `.travis.yml` file to your git repository.\n\n```\nlanguage: node_js\nnode_js:\n  - 6\ncache:\n  directories:\n    - node_modules\nscript:\n  - npm run build\n  - npm test\n```\n\n1. Trigger your first build with a git push.\n1. [Customize your Travis CI Build](https://docs.travis-ci.com/user/customizing-the-build/) if needed.\n\n#### CircleCI\n\nFollow [this article](https://medium.com/@knowbody/circleci-and-zeits-now-sh-c9b7eebcd3c1) to set up CircleCI with a Create React App project.\n\n### On your own environment\n\n##### Windows (cmd.exe)\n\n```cmd\nset CI=true&&npm test\n```\n\n```cmd\nset CI=true&&npm run build\n```\n\n(Note: the lack of whitespace is intentional.)\n\n##### Linux, macOS (Bash)\n\n```bash\nCI=true npm test\n```\n\n```bash\nCI=true npm run build\n```\n\nThe test command will force Jest to run tests once instead of launching the watcher.\n\n> If you find yourself doing this often in development, please [file an issue](https://github.com/facebookincubator/create-react-app/issues/new) to tell us about your use case because we want to make watcher the best experience and are open to changing how it works to accommodate more workflows.\n\nThe build command will check for linter warnings and fail if any are found.\n\n### Disabling jsdom\n\nBy default, the `package.json` of the generated project looks like this:\n\n```js\n  \"scripts\": {\n    \"start\": \"react-scripts start\",\n    \"build\": \"react-scripts build\",\n    \"test\": \"react-scripts test --env=jsdom\"\n```\n\nIf you know that none of your tests depend on [jsdom](https://github.com/tmpvar/jsdom), you can safely remove `--env=jsdom`, and your tests will run faster:\n\n```diff\n  \"scripts\": {\n    \"start\": \"react-scripts start\",\n    \"build\": \"react-scripts build\",\n-   \"test\": \"react-scripts test --env=jsdom\"\n+   \"test\": \"react-scripts test\"\n```\n\nTo help you make up your mind, here is a list of APIs that **need jsdom**:\n\n- Any browser globals like `window` and `document`\n- [`ReactDOM.render()`](https://facebook.github.io/react/docs/top-level-api.html#reactdom.render)\n- [`TestUtils.renderIntoDocument()`](https://facebook.github.io/react/docs/test-utils.html#renderintodocument) ([a shortcut](https://github.com/facebook/react/blob/34761cf9a252964abfaab6faf74d473ad95d1f21/src/test/ReactTestUtils.js#L83-L91) for the above)\n- [`mount()`](http://airbnb.io/enzyme/docs/api/mount.html) in [Enzyme](http://airbnb.io/enzyme/index.html)\n\nIn contrast, **jsdom is not needed** for the following APIs:\n\n- [`TestUtils.createRenderer()`](https://facebook.github.io/react/docs/test-utils.html#shallow-rendering) (shallow rendering)\n- [`shallow()`](http://airbnb.io/enzyme/docs/api/shallow.html) in [Enzyme](http://airbnb.io/enzyme/index.html)\n\nFinally, jsdom is also not needed for [snapshot testing](http://facebook.github.io/jest/blog/2016/07/27/jest-14.html).\n\n### Snapshot Testing\n\nSnapshot testing is a feature of Jest that automatically generates text snapshots of your components and saves them on the disk so if the UI output changes, you get notified without manually writing any assertions on the component output. [Read more about snapshot testing.](http://facebook.github.io/jest/blog/2016/07/27/jest-14.html)\n\n### Editor Integration\n\nIf you use [Visual Studio Code](https://code.visualstudio.com), there is a [Jest extension](https://github.com/orta/vscode-jest) which works with Create React App out of the box. This provides a lot of IDE-like features while using a text editor: showing the status of a test run with potential fail messages inline, starting and stopping the watcher automatically, and offering one-click snapshot updates.\n\n![VS Code Jest Preview](https://cloud.githubusercontent.com/assets/49038/20795349/a032308a-b7c8-11e6-9b34-7eeac781003f.png)\n\n## Developing Components in Isolation\n\nUsually, in an app, you have a lot of UI components, and each of them has many different states.\nFor an example, a simple button component could have following states:\n\n- In a regular state, with a text label.\n- In the disabled mode.\n- In a loading state.\n\nUsually, it’s hard to see these states without running a sample app or some examples.\n\nCreate React App doesn’t include any tools for this by default, but you can easily add [Storybook for React](https://storybook.js.org) ([source](https://github.com/storybooks/storybook)) or [React Styleguidist](https://react-styleguidist.js.org/) ([source](https://github.com/styleguidist/react-styleguidist)) to your project. **These are third-party tools that let you develop components and see all their states in isolation from your app**.\n\n![Storybook for React Demo](http://i.imgur.com/7CIAWpB.gif)\n\nYou can also deploy your Storybook or style guide as a static app. This way, everyone in your team can view and review different states of UI components without starting a backend server or creating an account in your app.\n\n### Getting Started with Storybook\n\nStorybook is a development environment for React UI components. It allows you to browse a component library, view the different states of each component, and interactively develop and test components.\n\nFirst, install the following npm package globally:\n\n```sh\nnpm install -g @storybook/cli\n```\n\nThen, run the following command inside your app’s directory:\n\n```sh\ngetstorybook\n```\n\nAfter that, follow the instructions on the screen.\n\nLearn more about React Storybook:\n\n- Screencast: [Getting Started with React Storybook](https://egghead.io/lessons/react-getting-started-with-react-storybook)\n- [GitHub Repo](https://github.com/storybooks/storybook)\n- [Documentation](https://storybook.js.org/basics/introduction/)\n- [Snapshot Testing UI](https://github.com/storybooks/storybook/tree/master/addons/storyshots) with Storybook + addon/storyshot\n\n### Getting Started with Styleguidist\n\nStyleguidist combines a style guide, where all your components are presented on a single page with their props documentation and usage examples, with an environment for developing components in isolation, similar to Storybook. In Styleguidist you write examples in Markdown, where each code snippet is rendered as a live editable playground.\n\nFirst, install Styleguidist:\n\n```sh\nnpm install --save react-styleguidist\n```\n\nAlternatively you may use `yarn`:\n\n```sh\nyarn add react-styleguidist\n```\n\nThen, add these scripts to your `package.json`:\n\n```diff\n   \"scripts\": {\n+    \"styleguide\": \"styleguidist server\",\n+    \"styleguide:build\": \"styleguidist build\",\n     \"start\": \"react-scripts start\",\n```\n\nThen, run the following command inside your app’s directory:\n\n```sh\nnpm run styleguide\n```\n\nAfter that, follow the instructions on the screen.\n\nLearn more about React Styleguidist:\n\n- [GitHub Repo](https://github.com/styleguidist/react-styleguidist)\n- [Documentation](https://react-styleguidist.js.org/docs/getting-started.html)\n\n## Making a Progressive Web App\n\nBy default, the production build is a fully functional, offline-first\n[Progressive Web App](https://developers.google.com/web/progressive-web-apps/).\n\nProgressive Web Apps are faster and more reliable than traditional web pages, and provide an engaging mobile experience:\n\n- All static site assets are cached so that your page loads fast on subsequent visits, regardless of network connectivity (such as 2G or 3G). Updates are downloaded in the background.\n- Your app will work regardless of network state, even if offline. This means your users will be able to use your app at 10,000 feet and on the Subway.\n- On mobile devices, your app can be added directly to the user's home screen, app icon and all. You can also re-engage users using web **push notifications**. This eliminates the need for the app store.\n\nThe [`sw-precache-webpack-plugin`](https://github.com/goldhand/sw-precache-webpack-plugin)\nis integrated into production configuration,\nand it will take care of generating a service worker file that will automatically\nprecache all of your local assets and keep them up to date as you deploy updates.\nThe service worker will use a [cache-first strategy](https://developers.google.com/web/fundamentals/instant-and-offline/offline-cookbook/#cache-falling-back-to-network)\nfor handling all requests for local assets, including the initial HTML, ensuring\nthat your web app is reliably fast, even on a slow or unreliable network.\n\n### Opting Out of Caching\n\nIf you would prefer not to enable service workers prior to your initial\nproduction deployment, then remove the call to `serviceWorkerRegistration.register()`\nfrom [`src/index.js`](src/index.js).\n\nIf you had previously enabled service workers in your production deployment and\nhave decided that you would like to disable them for all your existing users,\nyou can swap out the call to `serviceWorkerRegistration.register()` in\n[`src/index.js`](src/index.js) with a call to `serviceWorkerRegistration.unregister()`.\nAfter the user visits a page that has `serviceWorkerRegistration.unregister()`,\nthe service worker will be uninstalled. Note that depending on how `/service-worker.js` is served,\nit may take up to 24 hours for the cache to be invalidated.\n\n### Offline-First Considerations\n\n1. Service workers [require HTTPS](https://developers.google.com/web/fundamentals/getting-started/primers/service-workers#you_need_https),\n   although to facilitate local testing, that policy\n   [does not apply to `localhost`](http://stackoverflow.com/questions/34160509/options-for-testing-service-workers-via-http/34161385#34161385).\n   If your production web server does not support HTTPS, then the service worker\n   registration will fail, but the rest of your web app will remain functional.\n\n1. Service workers are [not currently supported](https://jakearchibald.github.io/isserviceworkerready/)\n   in all web browsers. Service worker registration [won't be attempted](src/registerServiceWorker.js)\n   on browsers that lack support.\n\n1. The service worker is only enabled in the [production environment](#deployment),\n   e.g. the output of `npm run build`. It's recommended that you do not enable an\n   offline-first service worker in a development environment, as it can lead to\n   frustration when previously cached assets are used and do not include the latest\n   changes you've made locally.\n\n1. If you _need_ to test your offline-first service worker locally, build\n   the application (using `npm run build`) and run a simple http server from your\n   build directory. After running the build script, `create-react-app` will give\n   instructions for one way to test your production build locally and the [deployment instructions](#deployment) have\n   instructions for using other methods. _Be sure to always use an\n   incognito window to avoid complications with your browser cache._\n\n1. If possible, configure your production environment to serve the generated\n   `service-worker.js` [with HTTP caching disabled](http://stackoverflow.com/questions/38843970/service-worker-javascript-update-frequency-every-24-hours).\n   If that's not possible—[GitHub Pages](#github-pages), for instance, does not\n   allow you to change the default 10 minute HTTP cache lifetime—then be aware\n   that if you visit your production site, and then revisit again before\n   `service-worker.js` has expired from your HTTP cache, you'll continue to get\n   the previously cached assets from the service worker. If you have an immediate\n   need to view your updated production deployment, performing a shift-refresh\n   will temporarily disable the service worker and retrieve all assets from the\n   network.\n\n1. Users aren't always familiar with offline-first web apps. It can be useful to\n   [let the user know](https://developers.google.com/web/fundamentals/instant-and-offline/offline-ux#inform_the_user_when_the_app_is_ready_for_offline_consumption)\n   when the service worker has finished populating your caches (showing a \"This web\n   app works offline!\" message) and also let them know when the service worker has\n   fetched the latest updates that will be available the next time they load the\n   page (showing a \"New content is available; please refresh.\" message). Showing\n   this messages is currently left as an exercise to the developer, but as a\n   starting point, you can make use of the logic included in [`src/registerServiceWorker.js`](src/registerServiceWorker.js), which\n   demonstrates which service worker lifecycle events to listen for to detect each\n   scenario, and which as a default, just logs appropriate messages to the\n   JavaScript console.\n\n1. By default, the generated service worker file will not intercept or cache any\n   cross-origin traffic, like HTTP [API requests](#integrating-with-an-api-backend),\n   images, or embeds loaded from a different domain. If you would like to use a\n   runtime caching strategy for those requests, you can [`eject`](#npm-run-eject)\n   and then configure the\n   [`runtimeCaching`](https://github.com/GoogleChrome/sw-precache#runtimecaching-arrayobject)\n   option in the `SWPrecacheWebpackPlugin` section of\n   [`webpack.config.prod.js`](../config/webpack.config.prod.js).\n\n### Progressive Web App Metadata\n\nThe default configuration includes a web app manifest located at\n[`public/manifest.json`](public/manifest.json), that you can customize with\ndetails specific to your web application.\n\nWhen a user adds a web app to their homescreen using Chrome or Firefox on\nAndroid, the metadata in [`manifest.json`](public/manifest.json) determines what\nicons, names, and branding colors to use when the web app is displayed.\n[The Web App Manifest guide](https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/)\nprovides more context about what each field means, and how your customizations\nwill affect your users' experience.\n\n## Analyzing the Bundle Size\n\n[Source map explorer](https://www.npmjs.com/package/source-map-explorer) analyzes\nJavaScript bundles using the source maps. This helps you understand where code\nbloat is coming from.\n\nTo add Source map explorer to a Create React App project, follow these steps:\n\n```sh\nnpm install --save source-map-explorer\n```\n\nAlternatively you may use `yarn`:\n\n```sh\nyarn add source-map-explorer\n```\n\nThen in `package.json`, add the following line to `scripts`:\n\n```diff\n   \"scripts\": {\n+    \"analyze\": \"source-map-explorer build/static/js/main.*\",\n     \"start\": \"react-scripts start\",\n     \"build\": \"react-scripts build\",\n     \"test\": \"react-scripts test --env=jsdom\",\n```\n\nThen to analyze the bundle run the production build then run the analyze\nscript.\n\n```\nnpm run build\nnpm run analyze\n```\n\n## Deployment\n\n`npm run build` creates a `build` directory with a production build of your app. Set up your favourite HTTP server so that a visitor to your site is served `index.html`, and requests to static paths like `/static/js/main.<hash>.js` are served with the contents of the `/static/js/main.<hash>.js` file.\n\n### Static Server\n\nFor environments using [Node](https://nodejs.org/), the easiest way to handle this would be to install [serve](https://github.com/zeit/serve) and let it handle the rest:\n\n```sh\nnpm install -g serve\nserve -s build\n```\n\nThe last command shown above will serve your static site on the port **5000**. Like many of [serve](https://github.com/zeit/serve)’s internal settings, the port can be adjusted using the `-p` or `--port` flags.\n\nRun this command to get a full list of the options available:\n\n```sh\nserve -h\n```\n\n### Other Solutions\n\nYou don’t necessarily need a static server in order to run a Create React App project in production. It works just as fine integrated into an existing dynamic one.\n\nHere’s a programmatic example using [Node](https://nodejs.org/) and [Express](http://expressjs.com/):\n\n```javascript\nconst express = require('express');\nconst path = require('path');\nconst app = express();\n\napp.use(express.static(path.join(__dirname, 'build')));\n\napp.get('/', function (req, res) {\n  res.sendFile(path.join(__dirname, 'build', 'index.html'));\n});\n\napp.listen(9000);\n```\n\nThe choice of your server software isn’t important either. Since Create React App is completely platform-agnostic, there’s no need to explicitly use Node.\n\nThe `build` folder with static assets is the only output produced by Create React App.\n\nHowever this is not quite enough if you use client-side routing. Read the next section if you want to support URLs like `/todos/42` in your single-page app.\n\n### Serving Apps with Client-Side Routing\n\nIf you use routers that use the HTML5 [`pushState` history API](https://developer.mozilla.org/en-US/docs/Web/API/History_API#Adding_and_modifying_history_entries) under the hood (for example, [React Router](https://github.com/ReactTraining/react-router) with `browserHistory`), many static file servers will fail. For example, if you used React Router with a route for `/todos/42`, the development server will respond to `localhost:3000/todos/42` properly, but an Express serving a production build as above will not.\n\nThis is because when there is a fresh page load for a `/todos/42`, the server looks for the file `build/todos/42` and does not find it. The server needs to be configured to respond to a request to `/todos/42` by serving `index.html`. For example, we can amend our Express example above to serve `index.html` for any unknown paths:\n\n```diff\n app.use(express.static(path.join(__dirname, 'build')));\n\n-app.get('/', function (req, res) {\n+app.get('/*', function (req, res) {\n   res.sendFile(path.join(__dirname, 'build', 'index.html'));\n });\n```\n\nIf you’re using [Apache HTTP Server](https://httpd.apache.org/), you need to create a `.htaccess` file in the `public` folder that looks like this:\n\n```\n    Options -MultiViews\n    RewriteEngine On\n    RewriteCond %{REQUEST_FILENAME} !-f\n    RewriteRule ^ index.html [QSA,L]\n```\n\nIt will get copied to the `build` folder when you run `npm run build`.\n\nIf you’re using [Apache Tomcat](http://tomcat.apache.org/), you need to follow [this Stack Overflow answer](https://stackoverflow.com/a/41249464/4878474).\n\nNow requests to `/todos/42` will be handled correctly both in development and in production.\n\nOn a production build, and in a browser that supports [service workers](https://developers.google.com/web/fundamentals/getting-started/primers/service-workers),\nthe service worker will automatically handle all navigation requests, like for\n`/todos/42`, by serving the cached copy of your `index.html`. This\nservice worker navigation routing can be configured or disabled by\n[`eject`ing](#npm-run-eject) and then modifying the\n[`navigateFallback`](https://github.com/GoogleChrome/sw-precache#navigatefallback-string)\nand [`navigateFallbackWhitelist`](https://github.com/GoogleChrome/sw-precache#navigatefallbackwhitelist-arrayregexp)\noptions of the `SWPreachePlugin` [configuration](../config/webpack.config.prod.js).\n\n### Building for Relative Paths\n\nBy default, Create React App produces a build assuming your app is hosted at the server root.<br>\nTo override this, specify the `homepage` in your `package.json`, for example:\n\n```js\n  \"homepage\": \"http://mywebsite.com/relativepath\",\n```\n\nThis will let Create React App correctly infer the root path to use in the generated HTML file.\n\n**Note**: If you are using `react-router@^4`, you can root `<Link>`s using the `basename` prop on any `<Router>`.<br>\nMore information [here](https://reacttraining.com/react-router/web/api/BrowserRouter/basename-string).<br>\n<br>\nFor example:\n\n```js\n<BrowserRouter basename=\"/calendar\"/>\n<Link to=\"/today\"/> // renders <a href=\"/calendar/today\">\n```\n\n#### Serving the Same Build from Different Paths\n\n> Note: this feature is available with `react-scripts@0.9.0` and higher.\n\nIf you are not using the HTML5 `pushState` history API or not using client-side routing at all, it is unnecessary to specify the URL from which your app will be served. Instead, you can put this in your `package.json`:\n\n```js\n  \"homepage\": \".\",\n```\n\nThis will make sure that all the asset paths are relative to `index.html`. You will then be able to move your app from `http://mywebsite.com` to `http://mywebsite.com/relativepath` or even `http://mywebsite.com/relative/path` without having to rebuild it.\n\n### Azure\n\nSee [this](https://medium.com/@to_pe/deploying-create-react-app-on-microsoft-azure-c0f6686a4321) blog post on how to deploy your React app to [Microsoft Azure](https://azure.microsoft.com/).\n\n### Firebase\n\nInstall the Firebase CLI if you haven’t already by running `npm install -g firebase-tools`. Sign up for a [Firebase account](https://console.firebase.google.com/) and create a new project. Run `firebase login` and login with your previous created Firebase account.\n\nThen run the `firebase init` command from your project’s root. You need to choose the **Hosting: Configure and deploy Firebase Hosting sites** and choose the Firebase project you created in the previous step. You will need to agree with `database.rules.json` being created, choose `build` as the public directory, and also agree to **Configure as a single-page app** by replying with `y`.\n\n```sh\n    === Project Setup\n\n    First, let's associate this project directory with a Firebase project.\n    You can create multiple project aliases by running firebase use --add,\n    but for now we'll just set up a default project.\n\n    ? What Firebase project do you want to associate as default? Example app (example-app-fd690)\n\n    === Database Setup\n\n    Firebase Realtime Database Rules allow you to define how your data should be\n    structured and when your data can be read from and written to.\n\n    ? What file should be used for Database Rules? database.rules.json\n    ✔  Database Rules for example-app-fd690 have been downloaded to database.rules.json.\n    Future modifications to database.rules.json will update Database Rules when you run\n    firebase deploy.\n\n    === Hosting Setup\n\n    Your public directory is the folder (relative to your project directory) that\n    will contain Hosting assets to uploaded with firebase deploy. If you\n    have a build process for your assets, use your build's output directory.\n\n    ? What do you want to use as your public directory? build\n    ? Configure as a single-page app (rewrite all urls to /index.html)? Yes\n    ✔  Wrote build/index.html\n\n    i  Writing configuration info to firebase.json...\n    i  Writing project information to .firebaserc...\n\n    ✔  Firebase initialization complete!\n```\n\nNow, after you create a production build with `npm run build`, you can deploy it by running `firebase deploy`.\n\n```sh\n    === Deploying to 'example-app-fd690'...\n\n    i  deploying database, hosting\n    ✔  database: rules ready to deploy.\n    i  hosting: preparing build directory for upload...\n    Uploading: [==============================          ] 75%✔  hosting: build folder uploaded successfully\n    ✔  hosting: 8 files uploaded successfully\n    i  starting release process (may take several minutes)...\n\n    ✔  Deploy complete!\n\n    Project Console: https://console.firebase.google.com/project/example-app-fd690/overview\n    Hosting URL: https://example-app-fd690.firebaseapp.com\n```\n\nFor more information see [Add Firebase to your JavaScript Project](https://firebase.google.com/docs/web/setup).\n\n### GitHub Pages\n\n> Note: this feature is available with `react-scripts@0.2.0` and higher.\n\n#### Step 1: Add `homepage` to `package.json`\n\n**The step below is important!**<br>\n**If you skip it, your app will not deploy correctly.**\n\nOpen your `package.json` and add a `homepage` field:\n\n```js\n  \"homepage\": \"https://myusername.github.io/my-app\",\n```\n\nCreate React App uses the `homepage` field to determine the root URL in the built HTML file.\n\n#### Step 2: Install `gh-pages` and add `deploy` to `scripts` in `package.json`\n\nNow, whenever you run `npm run build`, you will see a cheat sheet with instructions on how to deploy to GitHub Pages.\n\nTo publish it at [https://myusername.github.io/my-app](https://myusername.github.io/my-app), run:\n\n```sh\nnpm install --save gh-pages\n```\n\nAlternatively you may use `yarn`:\n\n```sh\nyarn add gh-pages\n```\n\nAdd the following scripts in your `package.json`:\n\n```diff\n  \"scripts\": {\n+   \"predeploy\": \"npm run build\",\n+   \"deploy\": \"gh-pages -d build\",\n    \"start\": \"react-scripts start\",\n    \"build\": \"react-scripts build\",\n```\n\nThe `predeploy` script will run automatically before `deploy` is run.\n\n#### Step 3: Deploy the site by running `npm run deploy`\n\nThen run:\n\n```sh\nnpm run deploy\n```\n\n#### Step 4: Ensure your project’s settings use `gh-pages`\n\nFinally, make sure **GitHub Pages** option in your GitHub project settings is set to use the `gh-pages` branch:\n\n<img src=\"http://i.imgur.com/HUjEr9l.png\" width=\"500\" alt=\"gh-pages branch setting\">\n\n#### Step 5: Optionally, configure the domain\n\nYou can configure a custom domain with GitHub Pages by adding a `CNAME` file to the `public/` folder.\n\n#### Notes on client-side routing\n\nGitHub Pages doesn’t support routers that use the HTML5 `pushState` history API under the hood (for example, React Router using `browserHistory`). This is because when there is a fresh page load for a url like `http://user.github.io/todomvc/todos/42`, where `/todos/42` is a frontend route, the GitHub Pages server returns 404 because it knows nothing of `/todos/42`. If you want to add a router to a project hosted on GitHub Pages, here are a couple of solutions:\n\n- You could switch from using HTML5 history API to routing with hashes. If you use React Router, you can switch to `hashHistory` for this effect, but the URL will be longer and more verbose (for example, `http://user.github.io/todomvc/#/todos/42?_k=yknaj`). [Read more](https://reacttraining.com/react-router/web/api/Router) about different history implementations in React Router.\n- Alternatively, you can use a trick to teach GitHub Pages to handle 404 by redirecting to your `index.html` page with a special redirect parameter. You would need to add a `404.html` file with the redirection code to the `build` folder before deploying your project, and you’ll need to add code handling the redirect parameter to `index.html`. You can find a detailed explanation of this technique [in this guide](https://github.com/rafrex/spa-github-pages).\n\n### Heroku\n\nUse the [Heroku Buildpack for Create React App](https://github.com/mars/create-react-app-buildpack).<br>\nYou can find instructions in [Deploying React with Zero Configuration](https://blog.heroku.com/deploying-react-with-zero-configuration).\n\n#### Resolving Heroku Deployment Errors\n\nSometimes `npm run build` works locally but fails during deploy via Heroku. Following are the most common cases.\n\n##### \"Module not found: Error: Cannot resolve 'file' or 'directory'\"\n\nIf you get something like this:\n\n```\nremote: Failed to create a production build. Reason:\nremote: Module not found: Error: Cannot resolve 'file' or 'directory'\nMyDirectory in /tmp/build_1234/src\n```\n\nIt means you need to ensure that the lettercase of the file or directory you `import` matches the one you see on your filesystem or on GitHub.\n\nThis is important because Linux (the operating system used by Heroku) is case sensitive. So `MyDirectory` and `mydirectory` are two distinct directories and thus, even though the project builds locally, the difference in case breaks the `import` statements on Heroku remotes.\n\n##### \"Could not find a required file.\"\n\nIf you exclude or ignore necessary files from the package you will see a error similar this one:\n\n```\nremote: Could not find a required file.\nremote:   Name: `index.html`\nremote:   Searched in: /tmp/build_a2875fc163b209225122d68916f1d4df/public\nremote:\nremote: npm ERR! Linux 3.13.0-105-generic\nremote: npm ERR! argv \"/tmp/build_a2875fc163b209225122d68916f1d4df/.heroku/node/bin/node\" \"/tmp/build_a2875fc163b209225122d68916f1d4df/.heroku/node/bin/npm\" \"run\" \"build\"\n```\n\nIn this case, ensure that the file is there with the proper lettercase and that’s not ignored on your local `.gitignore` or `~/.gitignore_global`.\n\n### Netlify\n\n**To do a manual deploy to Netlify’s CDN:**\n\n```sh\nnpm install netlify-cli\nnetlify deploy\n```\n\nChoose `build` as the path to deploy.\n\n**To setup continuous delivery:**\n\nWith this setup Netlify will build and deploy when you push to git or open a pull request:\n\n1. [Start a new netlify project](https://app.netlify.com/signup)\n2. Pick your Git hosting service and select your repository\n3. Click `Build your site`\n\n**Support for client-side routing:**\n\nTo support `pushState`, make sure to create a `public/_redirects` file with the following rewrite rules:\n\n```\n/*  /index.html  200\n```\n\nWhen you build the project, Create React App will place the `public` folder contents into the build output.\n\n### Now\n\n[now](https://zeit.co/now) offers a zero-configuration single-command deployment. You can use `now` to deploy your app for free.\n\n1. Install the `now` command-line tool either via the recommended [desktop tool](https://zeit.co/download) or via node with `npm install -g now`.\n\n2. Build your app by running `npm run build`.\n\n3. Move into the build directory by running `cd build`.\n\n4. Run `now --name your-project-name` from within the build directory. You will see a **now.sh** URL in your output like this:\n\n   ```\n   > Ready! https://your-project-name-tpspyhtdtk.now.sh (copied to clipboard)\n   ```\n\n   Paste that URL into your browser when the build is complete, and you will see your deployed app.\n\nDetails are available in [this article.](https://zeit.co/blog/unlimited-static)\n\n### S3 and CloudFront\n\nSee this [blog post](https://medium.com/@omgwtfmarc/deploying-create-react-app-to-s3-or-cloudfront-48dae4ce0af) on how to deploy your React app to Amazon Web Services [S3](https://aws.amazon.com/s3) and [CloudFront](https://aws.amazon.com/cloudfront/).\n\n### Surge\n\nInstall the Surge CLI if you haven’t already by running `npm install -g surge`. Run the `surge` command and log in you or create a new account.\n\nWhen asked about the project path, make sure to specify the `build` folder, for example:\n\n```sh\n       project path: /path/to/project/build\n```\n\nNote that in order to support routers that use HTML5 `pushState` API, you may want to rename the `index.html` in your build folder to `200.html` before deploying to Surge. This [ensures that every URL falls back to that file](https://surge.sh/help/adding-a-200-page-for-client-side-routing).\n\n## Advanced Configuration\n\nYou can adjust various development and production settings by setting environment variables in your shell or with [.env](#adding-development-environment-variables-in-env).\n\n| Variable            |      Development       |     Production     | Usage                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                     |\n| :------------------ | :--------------------: | :----------------: | :------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |\n| BROWSER             |   :white_check_mark:   |        :x:         | By default, Create React App will open the default system browser, favoring Chrome on macOS. Specify a [browser](https://github.com/sindresorhus/opn#app) to override this behavior, or set it to `none` to disable it completely. If you need to customize the way the browser is launched, you can specify a node script instead. Any arguments passed to `npm start` will also be passed to this script, and the url where your app is served will be the last argument. Your script's file name must have the `.js` extension.                                                                                        |\n| HOST                |   :white_check_mark:   |        :x:         | By default, the development web server binds to `localhost`. You may use this variable to specify a different host.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                       |\n| PORT                |   :white_check_mark:   |        :x:         | By default, the development web server will attempt to listen on port 3000 or prompt you to attempt the next available port. You may use this variable to specify a different port.                                                                                                                                                                                                                                                                                                                                                                                                                                       |\n| HTTPS               |   :white_check_mark:   |        :x:         | When set to `true`, Create React App will run the development server in `https` mode.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                     |\n| PUBLIC_URL          |          :x:           | :white_check_mark: | Create React App assumes your application is hosted at the serving web server's root or a subpath as specified in [`package.json` (`homepage`)](#building-for-relative-paths). Normally, Create React App ignores the hostname. You may use this variable to force assets to be referenced verbatim to the url you provide (hostname included). This may be particularly useful when using a CDN to host your application.                                                                                                                                                                                                |\n| CI                  | :large_orange_diamond: | :white_check_mark: | When set to `true`, Create React App treats warnings as failures in the build. It also makes the test runner non-watching. Most CIs set this flag by default.                                                                                                                                                                                                                                                                                                                                                                                                                                                             |\n| REACT_EDITOR        |   :white_check_mark:   |        :x:         | When an app crashes in development, you will see an error overlay with clickable stack trace. When you click on it, Create React App will try to determine the editor you are using based on currently running processes, and open the relevant source file. You can [send a pull request to detect your editor of choice](https://github.com/facebookincubator/create-react-app/issues/2636). Setting this environment variable overrides the automatic detection. If you do it, make sure your systems [PATH](<https://en.wikipedia.org/wiki/PATH_(variable)>) environment variable points to your editor’s bin folder. |\n| CHOKIDAR_USEPOLLING |   :white_check_mark:   |        :x:         | When set to `true`, the watcher runs in polling mode, as necessary inside a VM. Use this option if `npm start` isn't detecting changes.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                   |\n| GENERATE_SOURCEMAP  |          :x:           | :white_check_mark: | When set to `false`, source maps are not generated for a production build. This solves OOM issues on some smaller machines.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                               |\n\n## Troubleshooting\n\n### `npm start` doesn’t detect changes\n\nWhen you save a file while `npm start` is running, the browser should refresh with the updated code.<br>\nIf this doesn’t happen, try one of the following workarounds:\n\n- If your project is in a Dropbox folder, try moving it out.\n- If the watcher doesn’t see a file called `index.js` and you’re referencing it by the folder name, you [need to restart the watcher](https://github.com/facebookincubator/create-react-app/issues/1164) due to a Webpack bug.\n- Some editors like Vim and IntelliJ have a “safe write” feature that currently breaks the watcher. You will need to disable it. Follow the instructions in [“Adjusting Your Text Editor”](https://webpack.js.org/guides/development/#adjusting-your-text-editor).\n- If your project path contains parentheses, try moving the project to a path without them. This is caused by a [Webpack watcher bug](https://github.com/webpack/watchpack/issues/42).\n- On Linux and macOS, you might need to [tweak system settings](https://webpack.github.io/docs/troubleshooting.html#not-enough-watchers) to allow more watchers.\n- If the project runs inside a virtual machine such as (a Vagrant provisioned) VirtualBox, create an `.env` file in your project directory if it doesn’t exist, and add `CHOKIDAR_USEPOLLING=true` to it. This ensures that the next time you run `npm start`, the watcher uses the polling mode, as necessary inside a VM.\n\nIf none of these solutions help please leave a comment [in this thread](https://github.com/facebookincubator/create-react-app/issues/659).\n\n### `npm test` hangs on macOS Sierra\n\nIf you run `npm test` and the console gets stuck after printing `react-scripts test --env=jsdom` to the console there might be a problem with your [Watchman](https://facebook.github.io/watchman/) installation as described in [facebookincubator/create-react-app#713](https://github.com/facebookincubator/create-react-app/issues/713).\n\nWe recommend deleting `node_modules` in your project and running `npm install` (or `yarn` if you use it) first. If it doesn't help, you can try one of the numerous workarounds mentioned in these issues:\n\n- [facebook/jest#1767](https://github.com/facebook/jest/issues/1767)\n- [facebook/watchman#358](https://github.com/facebook/watchman/issues/358)\n- [ember-cli/ember-cli#6259](https://github.com/ember-cli/ember-cli/issues/6259)\n\nIt is reported that installing Watchman 4.7.0 or newer fixes the issue. If you use [Homebrew](http://brew.sh/), you can run these commands to update it:\n\n```\nwatchman shutdown-server\nbrew update\nbrew reinstall watchman\n```\n\nYou can find [other installation methods](https://facebook.github.io/watchman/docs/install.html#build-install) on the Watchman documentation page.\n\nIf this still doesn’t help, try running `launchctl unload -F ~/Library/LaunchAgents/com.github.facebook.watchman.plist`.\n\nThere are also reports that _uninstalling_ Watchman fixes the issue. So if nothing else helps, remove it from your system and try again.\n\n### `npm run build` exits too early\n\nIt is reported that `npm run build` can fail on machines with limited memory and no swap space, which is common in cloud environments. Even with small projects this command can increase RAM usage in your system by hundreds of megabytes, so if you have less than 1 GB of available memory your build is likely to fail with the following message:\n\n> The build failed because the process exited too early. This probably means the system ran out of memory or someone called `kill -9` on the process.\n\nIf you are completely sure that you didn't terminate the process, consider [adding some swap space](https://www.digitalocean.com/community/tutorials/how-to-add-swap-on-ubuntu-14-04) to the machine you’re building on, or build the project locally.\n\n### `npm run build` fails on Heroku\n\nThis may be a problem with case sensitive filenames.\nPlease refer to [this section](#resolving-heroku-deployment-errors).\n\n### Moment.js locales are missing\n\nIf you use a [Moment.js](https://momentjs.com/), you might notice that only the English locale is available by default. This is because the locale files are large, and you probably only need a subset of [all the locales provided by Moment.js](https://momentjs.com/#multiple-locale-support).\n\nTo add a specific Moment.js locale to your bundle, you need to import it explicitly.<br>\nFor example:\n\n```js\nimport moment from 'moment';\nimport 'moment/locale/fr';\n```\n\nIf import multiple locales this way, you can later switch between them by calling `moment.locale()` with the locale name:\n\n```js\nimport moment from 'moment';\nimport 'moment/locale/fr';\nimport 'moment/locale/es';\n\n// ...\n\nmoment.locale('fr');\n```\n\nThis will only work for locales that have been explicitly imported before.\n\n### `npm run build` fails to minify\n\nYou may occasionally find a package you depend on needs compiled or ships code for a non-browser environment.<br>\nThis is considered poor practice in the ecosystem and does not have an escape hatch in Create React App.<br>\n<br>\nTo resolve this:\n\n1. Open an issue on the dependency's issue tracker and ask that the package be published pre-compiled (retaining ES6 Modules).\n2. Fork the package and publish a corrected version yourself.\n3. If the dependency is small enough, copy it to your `src/` folder and treat it as application code.\n\n## Something Missing?\n\nIf you have ideas for more “How To” recipes that should be on this page, [let us know](https://github.com/facebookincubator/create-react-app/issues) or [contribute some!](https://github.com/facebookincubator/create-react-app/edit/master/packages/react-scripts/template/README.md)\n"
  },
  {
    "path": "example/react-component-lib/package.json",
    "content": "{\n  \"name\": \"react_usinghooks\",\n  \"version\": \"0.1.0\",\n  \"private\": true,\n  \"dependencies\": {\n    \"i18next\": \"^23.12.3\",\n    \"i18next-browser-languagedetector\": \"^8.0.0\",\n    \"i18next-http-backend\": \"^2.5.2\",\n    \"react\": \"^18.3.1\",\n    \"react-dom\": \"^18.3.1\",\n    \"react-i18next\": \"^15.0.1\",\n    \"react-scripts\": \"^5.0.1\"\n  },\n  \"scripts\": {\n    \"start\": \"react-scripts start\",\n    \"build\": \"react-scripts build\",\n    \"test\": \"react-scripts test --env=jsdom\",\n    \"eject\": \"react-scripts eject\"\n  },\n  \"eslintConfig\": {\n    \"extends\": [\n      \"react-app\",\n      \"react-app/jest\"\n    ]\n  },\n  \"browserslist\": {\n    \"development\": [\n      \"last 2 chrome versions\",\n      \"last 2 firefox versions\",\n      \"last 2 edge versions\"\n    ],\n    \"production\": [\n      \">1%\",\n      \"last 4 versions\",\n      \"Firefox ESR\",\n      \"not ie < 11\"\n    ]\n  }\n}\n"
  },
  {
    "path": "example/react-component-lib/public/index.html",
    "content": "<!doctype html>\n<html lang=\"en\">\n  <head>\n    <meta charset=\"utf-8\" />\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\" />\n    <meta name=\"theme-color\" content=\"#000000\" />\n    <!--\n      manifest.json provides metadata used when your web app is added to the\n      homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/\n    -->\n    <link rel=\"manifest\" href=\"%PUBLIC_URL%/manifest.json\" />\n    <link rel=\"shortcut icon\" href=\"%PUBLIC_URL%/favicon.ico\" />\n    <!--\n      Notice the use of %PUBLIC_URL% in the tags above.\n      It will be replaced with the URL of the `public` folder during the build.\n      Only files inside the `public` folder can be referenced from the HTML.\n\n      Unlike \"/favicon.ico\" or \"favicon.ico\", \"%PUBLIC_URL%/favicon.ico\" will\n      work correctly both with client-side routing and a non-root public URL.\n      Learn how to configure a non-root public URL by running `npm run build`.\n    -->\n    <title>React App</title>\n  </head>\n  <body>\n    <noscript>You need to enable JavaScript to run this app.</noscript>\n    <div id=\"root\"></div>\n    <!--\n      This HTML file is a template.\n      If you open it directly in the browser, you will see an empty page.\n\n      You can add webfonts, meta tags, or analytics to this file.\n      The build step will place the bundled scripts into the <body> tag.\n\n      To begin the development, run `npm start` or `yarn start`.\n      To create a production bundle, use `npm run build` or `yarn build`.\n    -->\n  </body>\n</html>\n"
  },
  {
    "path": "example/react-component-lib/public/locales/de/translation.json",
    "content": "{\n  \"title\": \"Willkommen zu react und react-i18next\",\n  \"description\": {\n    \"part1\": \"Um loszulegen, ändere <1>src/App(DE).js</1> und speichere um neuzuladen.\",\n    \"part2\": \"Wechsle die Sprache zwischen deutsch und englisch mit Hilfe der beiden Schalter.\"\n  }\n}\n"
  },
  {
    "path": "example/react-component-lib/public/locales/en/translation.json",
    "content": "{\n  \"title\": \"Welcome to react using react-i18next\",\n  \"description\": {\n    \"part1\": \"To get started, edit <1>src/App.js</1> and save to reload.\",\n    \"part2\": \"Switch language between english and german using buttons above.\"\n  }\n}\n"
  },
  {
    "path": "example/react-component-lib/public/manifest.json",
    "content": "{\n  \"short_name\": \"React App\",\n  \"name\": \"Create React App Sample\",\n  \"icons\": [\n    {\n      \"src\": \"favicon.ico\",\n      \"sizes\": \"192x192\",\n      \"type\": \"image/png\"\n    }\n  ],\n  \"start_url\": \"./index.html\",\n  \"display\": \"standalone\",\n  \"theme_color\": \"#000000\",\n  \"background_color\": \"#ffffff\"\n}\n"
  },
  {
    "path": "example/react-component-lib/src/App.css",
    "content": ".App {\n  text-align: center;\n}\n\n.App-logo {\n  animation: App-logo-spin infinite 20s linear;\n  height: 80px;\n}\n\n.App-header {\n  background-color: #222;\n  height: 150px;\n  padding: 20px;\n  color: white;\n}\n\n.App-intro {\n  font-size: large;\n}\n\n@keyframes App-logo-spin {\n  from {\n    transform: rotate(0deg);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n}\n"
  },
  {
    "path": "example/react-component-lib/src/App.js",
    "content": "import React, { Component, Suspense } from 'react';\nimport { useTranslation, withTranslation, Trans } from 'react-i18next';\nimport './App.css';\n\nimport { MyCompFromOtherLib } from './other-lib/component';\n\n// use hoc for class based components\nclass LegacyWelcomeClass extends Component {\n  render() {\n    const { t } = this.props;\n    return <h2>{t('title')}</h2>;\n  }\n}\nconst Welcome = withTranslation()(LegacyWelcomeClass);\n\n// Component using the Trans component\nfunction MyComponent() {\n  return (\n    <Trans i18nKey=\"description.part1\">\n      To get started, edit <code>src/App.js</code> and save to reload.\n    </Trans>\n  );\n}\n\n// page uses the hook\nfunction Page() {\n  const { t, i18n } = useTranslation();\n\n  const changeLanguage = (lng) => {\n    i18n.changeLanguage(lng);\n  };\n\n  return (\n    <div className=\"App\">\n      <div className=\"App-header\">\n        <img src=\"logo.svg\" className=\"App-logo\" alt=\"logo\" />\n        <Welcome />\n        <button type=\"button\" onClick={() => changeLanguage('de')}>\n          de\n        </button>\n        <button type=\"button\" onClick={() => changeLanguage('en')}>\n          en\n        </button>\n      </div>\n      <div className=\"App-intro\">\n        <MyComponent />\n      </div>\n      <div>{t('description.part2')}</div>\n      <hr />\n      <MyCompFromOtherLib />\n    </div>\n  );\n}\n\n// loading component for suspense fallback\nconst Loader = () => (\n  <div className=\"App\">\n    <img src=\"logo.svg\" className=\"App-logo\" alt=\"logo\" />\n    <div>loading...</div>\n  </div>\n);\n\n// here app catches the suspense from page in case translations are not yet loaded\nexport default function App() {\n  return (\n    <Suspense fallback={<Loader />}>\n      <Page />\n    </Suspense>\n  );\n}\n"
  },
  {
    "path": "example/react-component-lib/src/i18n.js",
    "content": "import i18n from 'i18next';\nimport Backend from 'i18next-http-backend';\nimport LanguageDetector from 'i18next-browser-languagedetector';\nimport { initReactI18next } from 'react-i18next';\nimport { i18n as i18nOtherLib } from './other-lib/component';\n\ni18n\n  // load translation using http -> see /public/locales\n  // learn more: https://github.com/i18next/i18next-http-backend\n  .use(Backend)\n  // detect user language\n  // learn more: https://github.com/i18next/i18next-browser-languageDetector\n  .use(LanguageDetector)\n  // pass the i18n instance to react-i18next.\n  .use(initReactI18next)\n  // init i18next\n  // for all options read: https://www.i18next.com/overview/configuration-options\n  .init({\n    fallbackLng: 'en',\n    debug: true,\n\n    interpolation: {\n      escapeValue: false, // not needed for react as it escapes by default\n    },\n  });\n\ni18n.on('languageChanged', (lng) => {\n  i18nOtherLib.changeLanguage(lng);\n});\n\nexport default i18n;\n"
  },
  {
    "path": "example/react-component-lib/src/index.css",
    "content": "body {\n  margin: 0;\n  padding: 0;\n  font-family: sans-serif;\n}\n"
  },
  {
    "path": "example/react-component-lib/src/index.js",
    "content": "import React from 'react';\nimport { createRoot } from 'react-dom/client';\nimport './index.css';\nimport App from './App';\n\n// import i18n (needs to be bundled ;))\nimport './i18n';\n\nconst root = createRoot(document.getElementById('root'));\nroot.render(\n  <React.StrictMode>\n    <App />\n  </React.StrictMode>,\n);\n"
  },
  {
    "path": "example/react-component-lib/src/other-lib/component.js",
    "content": "import { I18nextProvider, useTranslation } from 'react-i18next';\nimport i18next from './i18n';\n\nexport const i18n = i18next;\n\nfunction Comp() {\n  const { t } = useTranslation();\n\n  return <div>{t('hello')}</div>;\n}\n\nexport function MyCompFromOtherLib() {\n  return (\n    <I18nextProvider i18n={i18n}>\n      <Comp />\n    </I18nextProvider>\n  );\n}\n"
  },
  {
    "path": "example/react-component-lib/src/other-lib/i18n.js",
    "content": "import { createInstance } from 'i18next';\n\nconst i18n = createInstance({\n  fallbackLng: 'en',\n  debug: true,\n\n  interpolation: {\n    escapeValue: false, // not needed for react as it escapes by default\n  },\n\n  resources: {\n    en: {\n      translation: {\n        hello: 'Hello from other i18n instance',\n      },\n    },\n    de: {\n      translation: {\n        hello: 'Hallo aus einer anderen i18n Instanz',\n      },\n    },\n  },\n});\n\ni18n.init();\n\nexport default i18n;\n"
  },
  {
    "path": "example/react-fluent/.gitignore",
    "content": "# See https://help.github.com/ignore-files/ for more about ignoring files.\n\n# dependencies\n/node_modules\n\n# testing\n/coverage\n\n# production\n/build\n\n# misc\n.DS_Store\n.env.local\n.env.development.local\n.env.test.local\n.env.production.local\n\nnpm-debug.log*\nyarn-debug.log*\nyarn-error.log*\n"
  },
  {
    "path": "example/react-fluent/package.json",
    "content": "{\n  \"name\": \"react_fluent_withhoc\",\n  \"version\": \"0.1.0\",\n  \"private\": true,\n  \"dependencies\": {\n    \"i18next\": \"^23.12.3\",\n    \"i18next-browser-languagedetector\": \"^8.0.0\",\n    \"i18next-fluent\": \"^2.0.0\",\n    \"i18next-fluent-backend\": \"^1.0.0\",\n    \"react\": \"^18.3.1\",\n    \"react-dom\": \"^18.3.1\",\n    \"react-i18next\": \"^15.0.1\",\n    \"react-scripts\": \"^5.0.1\"\n  },\n  \"devDependencies\": {\n    \"babel-plugin-macros\": \"^3.1.0\"\n  },\n  \"scripts\": {\n    \"start\": \"react-scripts start\",\n    \"build\": \"react-scripts build\",\n    \"test\": \"react-scripts test --env=jsdom\",\n    \"eject\": \"react-scripts eject\"\n  },\n  \"eslintConfig\": {\n    \"extends\": [\n      \"react-app\",\n      \"react-app/jest\"\n    ]\n  },\n  \"browserslist\": {\n    \"development\": [\n      \"last 2 chrome versions\",\n      \"last 2 firefox versions\",\n      \"last 2 edge versions\"\n    ],\n    \"production\": [\n      \">1%\",\n      \"last 4 versions\",\n      \"Firefox ESR\",\n      \"not ie < 11\"\n    ]\n  }\n}\n"
  },
  {
    "path": "example/react-fluent/public/index.html",
    "content": "<!doctype html>\n<html lang=\"en\">\n  <head>\n    <meta charset=\"utf-8\" />\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\" />\n    <meta name=\"theme-color\" content=\"#000000\" />\n    <!--\n      manifest.json provides metadata used when your web app is added to the\n      homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/\n    -->\n    <link rel=\"manifest\" href=\"%PUBLIC_URL%/manifest.json\" />\n    <link rel=\"shortcut icon\" href=\"%PUBLIC_URL%/favicon.ico\" />\n    <!--\n      Notice the use of %PUBLIC_URL% in the tags above.\n      It will be replaced with the URL of the `public` folder during the build.\n      Only files inside the `public` folder can be referenced from the HTML.\n\n      Unlike \"/favicon.ico\" or \"favicon.ico\", \"%PUBLIC_URL%/favicon.ico\" will\n      work correctly both with client-side routing and a non-root public URL.\n      Learn how to configure a non-root public URL by running `npm run build`.\n    -->\n    <title>React App</title>\n  </head>\n  <body>\n    <noscript>You need to enable JavaScript to run this app.</noscript>\n    <div id=\"root\"></div>\n    <!--\n      This HTML file is a template.\n      If you open it directly in the browser, you will see an empty page.\n\n      You can add webfonts, meta tags, or analytics to this file.\n      The build step will place the bundled scripts into the <body> tag.\n\n      To begin the development, run `npm start` or `yarn start`.\n      To create a production bundle, use `npm run build` or `yarn build`.\n    -->\n  </body>\n</html>\n"
  },
  {
    "path": "example/react-fluent/public/locales/de/translations.ftl",
    "content": "title = Willkommen zu react und react-i18next mit fluent\n\ndescription_1 = Um loszulegen, ändere <1>src/App(DE).js</1> speicheren und neuladen.\ndescription_2 = Ändere die Sprachen zwischen deutsch und englisch mit Hilfe der beiden Schalter.\n\nemails =\n    { $unreadEmails ->\n        [one] Du hast <1>eine</1> ungelesene Email.\n       *[other] Du hast <1>{ $unreadEmails }</1> ungelesene Emails.\n    }"
  },
  {
    "path": "example/react-fluent/public/locales/en/translations.ftl",
    "content": "title = Welcome to react using react-i18next with fluent\n\ndescription_1 = To get started, edit <1>src/App.js</1> and save to reload.\ndescription_2 = Switch language between english and german using buttons above.\n\nemails =\n    { $unreadEmails ->\n        [one] You have <1>one</1> unread email.\n       *[other] You have <1>{ $unreadEmails }</1> unread emails.\n    }"
  },
  {
    "path": "example/react-fluent/public/manifest.json",
    "content": "{\n  \"short_name\": \"React App\",\n  \"name\": \"Create React App Sample\",\n  \"icons\": [\n    {\n      \"src\": \"favicon.ico\",\n      \"sizes\": \"192x192\",\n      \"type\": \"image/png\"\n    }\n  ],\n  \"start_url\": \"./index.html\",\n  \"display\": \"standalone\",\n  \"theme_color\": \"#000000\",\n  \"background_color\": \"#ffffff\"\n}\n"
  },
  {
    "path": "example/react-fluent/src/App.css",
    "content": ".App {\n  text-align: center;\n}\n\n.App-logo {\n  animation: App-logo-spin infinite 20s linear;\n  height: 80px;\n}\n\n.App-header {\n  background-color: #222;\n  height: 150px;\n  padding: 20px;\n  color: white;\n}\n\n.App-intro {\n  font-size: large;\n}\n\n@keyframes App-logo-spin {\n  from {\n    transform: rotate(0deg);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n}\n"
  },
  {
    "path": "example/react-fluent/src/App.js",
    "content": "import React, { Suspense } from 'react';\nimport { useTranslation, Trans } from 'react-i18next';\nimport logo from './logo.svg';\nimport './App.css';\n\n// page uses the hook\nfunction Page() {\n  const { t, i18n } = useTranslation('translations');\n  console.log(JSON.stringify(i18n.store.data), null, 2);\n\n  const changeLanguage = (lng) => {\n    i18n.changeLanguage(lng);\n  };\n\n  return (\n    <div className=\"App\">\n      <div className=\"App-header\">\n        <img src={logo} className=\"App-logo\" alt=\"logo\" />\n        <h2>{t('title')}</h2>\n        <button onClick={() => changeLanguage('de')}>de</button>\n        <button onClick={() => changeLanguage('en')}>en</button>\n      </div>\n      <div className=\"App-intro\">\n        <Trans i18nKey=\"description_1\">\n          To get started, edit <code>src/App.js</code> and save to reload.\n        </Trans>\n      </div>\n      <div>{t('description_2')}</div>\n      <Trans i18nKey=\"emails\" values={{ unreadEmails: 5 }}>\n        You have <strong>one</strong> unread email.\n      </Trans>\n    </div>\n  );\n}\n\n// loading component for suspense fallback\nconst Loader = () => (\n  <div className=\"App\">\n    <img src={logo} className=\"App-logo\" alt=\"logo\" />\n    <div>loading...</div>\n  </div>\n);\n\n// here app catches the suspense from page in case translations are not yet loaded\nexport default function App() {\n  return (\n    <Suspense fallback={<Loader />}>\n      <Page />\n    </Suspense>\n  );\n}\n"
  },
  {
    "path": "example/react-fluent/src/i18n.js",
    "content": "import i18n from 'i18next';\nimport Backend from 'i18next-fluent-backend';\nimport LanguageDetector from 'i18next-browser-languagedetector';\nimport { initReactI18next } from 'react-i18next';\n\nimport Fluent from 'i18next-fluent';\ni18n\n  .use(Fluent)\n  .use(Backend)\n  .use(LanguageDetector)\n  .use(initReactI18next)\n  .init({\n    fallbackLng: 'en',\n\n    // have a common namespace used around the full app\n    ns: ['translations'],\n    defaultNS: 'translations',\n\n    debug: true,\n\n    interpolation: {\n      escapeValue: false, // not needed for react!!\n    },\n\n    // resources: { // or use inline resources\n    //   en: {\n    //     translations: {\n    //       description_1: 'To get started, edit <1>src/App.js</1> and save to reload.',\n    //       description_2: 'Switch language between english and german using buttons above.',\n    //       emails: '{ $unreadEmails ->\\n  [one] You have <1>one</1> unread email.\\n *[other] You have <1>{ $unreadEmails }</1> unread emails.\\n}',\n    //       title: 'Welcome to react using react-i18next with fluent'\n    //     }\n    //   },\n    //   de: {\n    //     translations: {\n    //       title: 'Willkommen zu react und react-i18next mit fluent',\n    //       description_1: 'Um loszulegen, ändere <1>src/App(DE).js</1> speicheren und neuladen.',\n    //       description_2: 'Ändere die Sprachen zwischen deutsch und englisch mit Hilfe der beiden Schalter.',\n    //       emails: '{ $unreadEmails ->\\n  [one] Du hast <1>eine</1> ungelesene Email.\\n *[other] Du hast <1>{ $unreadEmails }</1> ungelesene Emails.\\n}'\n    //     }\n    //   }\n    // }\n  });\n\nexport default i18n;\n"
  },
  {
    "path": "example/react-fluent/src/index.css",
    "content": "body {\n  margin: 0;\n  padding: 0;\n  font-family: sans-serif;\n}\n"
  },
  {
    "path": "example/react-fluent/src/index.js",
    "content": "import React from 'react';\nimport { createRoot } from 'react-dom/client';\nimport './index.css';\nimport App from './App';\n\n// import i18n (needs to be bundled ;))\nimport './i18n';\n\nconst root = createRoot(document.getElementById('root'));\nroot.render(\n  <React.StrictMode>\n    <App />\n  </React.StrictMode>,\n);\n"
  },
  {
    "path": "example/react-icu/.gitignore",
    "content": "# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.\n\n# dependencies\n/node_modules\n/.pnp\n.pnp.js\n\n# testing\n/coverage\n\n# production\n/build\n\n# misc\n.DS_Store\n.env.local\n.env.development.local\n.env.test.local\n.env.production.local\n\nnpm-debug.log*\nyarn-debug.log*\nyarn-error.log*\n"
  },
  {
    "path": "example/react-icu/README.md",
    "content": "This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).\n\n## Available Scripts\n\nIn the project directory, you can run:\n\n### `yarn start`\n\nRuns the app in the development mode.<br />\nOpen [http://localhost:3000](http://localhost:3000) to view it in the browser.\n\nThe page will reload if you make edits.<br />\nYou will also see any lint errors in the console.\n\n### `yarn test`\n\nLaunches the test runner in the interactive watch mode.<br />\nSee the section about [running tests](https://facebook.github.io/create-react-app/docs/running-tests) for more information.\n\n### `yarn build`\n\nBuilds the app for production to the `build` folder.<br />\nIt correctly bundles React in production mode and optimizes the build for the best performance.\n\nThe build is minified and the filenames include the hashes.<br />\nYour app is ready to be deployed!\n\nSee the section about [deployment](https://facebook.github.io/create-react-app/docs/deployment) for more information.\n\n### `yarn eject`\n\n**Note: this is a one-way operation. Once you `eject`, you can’t go back!**\n\nIf you aren’t satisfied with the build tool and configuration choices, you can `eject` at any time. This command will remove the single build dependency from your project.\n\nInstead, it will copy all the configuration files and the transitive dependencies (webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except `eject` will still work, but they will point to the copied scripts so you can tweak them. At this point you’re on your own.\n\nYou don’t have to ever use `eject`. The curated feature set is suitable for small and middle deployments, and you shouldn’t feel obligated to use this feature. However we understand that this tool wouldn’t be useful if you couldn’t customize it when you are ready for it.\n\n## Learn More\n\nYou can learn more in the [Create React App documentation](https://facebook.github.io/create-react-app/docs/getting-started).\n\nTo learn React, check out the [React documentation](https://reactjs.org/).\n\n### Code Splitting\n\nThis section has moved here: https://facebook.github.io/create-react-app/docs/code-splitting\n\n### Analyzing the Bundle Size\n\nThis section has moved here: https://facebook.github.io/create-react-app/docs/analyzing-the-bundle-size\n\n### Making a Progressive Web App\n\nThis section has moved here: https://facebook.github.io/create-react-app/docs/making-a-progressive-web-app\n\n### Advanced Configuration\n\nThis section has moved here: https://facebook.github.io/create-react-app/docs/advanced-configuration\n\n### Deployment\n\nThis section has moved here: https://facebook.github.io/create-react-app/docs/deployment\n\n### `yarn build` fails to minify\n\nThis section has moved here: https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify\n"
  },
  {
    "path": "example/react-icu/package.json",
    "content": "{\n  \"name\": \"react_icu\",\n  \"version\": \"0.1.0\",\n  \"private\": true,\n  \"dependencies\": {\n    \"@testing-library/jest-dom\": \"^6.4.8\",\n    \"@testing-library/react\": \"^16.0.0\",\n    \"@testing-library/user-event\": \"^14.5.2\",\n    \"i18next\": \"^23.12.3\",\n    \"i18next-browser-languagedetector\": \"^8.0.0\",\n    \"i18next-http-backend\": \"^2.5.2\",\n    \"i18next-icu\": \"^2.3.0\",\n    \"intl-messageformat\": \"^10.5.14\",\n    \"react\": \"^18.3.1\",\n    \"react-dom\": \"^18.3.1\",\n    \"react-i18next\": \"^15.0.1\",\n    \"react-scripts\": \"^5.0.1\"\n  },\n  \"scripts\": {\n    \"start\": \"react-scripts start\",\n    \"build\": \"react-scripts build\",\n    \"test\": \"react-scripts test\",\n    \"eject\": \"react-scripts eject\"\n  },\n  \"eslintConfig\": {\n    \"extends\": \"react-app\"\n  },\n  \"browserslist\": {\n    \"production\": [\n      \">0.2%\",\n      \"not dead\",\n      \"not op_mini all\"\n    ],\n    \"development\": [\n      \"last 1 chrome version\",\n      \"last 1 firefox version\",\n      \"last 1 safari version\"\n    ]\n  },\n  \"devDependencies\": {\n    \"babel-plugin-macros\": \"^3.1.0\"\n  }\n}\n"
  },
  {
    "path": "example/react-icu/public/index.html",
    "content": "<!doctype html>\n<html lang=\"en\">\n  <head>\n    <meta charset=\"utf-8\" />\n    <link rel=\"icon\" href=\"%PUBLIC_URL%/favicon.ico\" />\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\" />\n    <meta name=\"theme-color\" content=\"#000000\" />\n    <meta name=\"description\" content=\"Web site created using create-react-app\" />\n    <link rel=\"apple-touch-icon\" href=\"%PUBLIC_URL%/logo192.png\" />\n    <!--\n      manifest.json provides metadata used when your web app is installed on a\n      user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/\n    -->\n    <link rel=\"manifest\" href=\"%PUBLIC_URL%/manifest.json\" />\n    <!--\n      Notice the use of %PUBLIC_URL% in the tags above.\n      It will be replaced with the URL of the `public` folder during the build.\n      Only files inside the `public` folder can be referenced from the HTML.\n\n      Unlike \"/favicon.ico\" or \"favicon.ico\", \"%PUBLIC_URL%/favicon.ico\" will\n      work correctly both with client-side routing and a non-root public URL.\n      Learn how to configure a non-root public URL by running `npm run build`.\n    -->\n    <title>React App</title>\n  </head>\n  <body>\n    <noscript>You need to enable JavaScript to run this app.</noscript>\n    <div id=\"root\"></div>\n    <!--\n      This HTML file is a template.\n      If you open it directly in the browser, you will see an empty page.\n\n      You can add webfonts, meta tags, or analytics to this file.\n      The build step will place the bundled scripts into the <body> tag.\n\n      To begin the development, run `npm start` or `yarn start`.\n      To create a production bundle, use `npm run build` or `yarn build`.\n    -->\n  </body>\n</html>\n"
  },
  {
    "path": "example/react-icu/public/locales/de/translations.json",
    "content": "{\n  \"title\": \"Willkommen zu react und react-i18next\",\n  \"description.part1\": \"Um loszulegen, ändere <1>src/App.js</1> speicheren und neuladen.\",\n  \"description.part2\": \"Ändere die Sprachen zwischen deutsch und englisch mit Hilfe der beiden Schalter.\",\n  \"icu\": \"{numPersons, plural, =0 {keine Person} =1 {eine Person} other {# Personen}}\",\n  \"icu_and_trans\": \"Wir haben <0>{numPersons, plural, =0 {keine Person} =1 {eine Person} other {# Personen}}</0> eingeladen.\",\n  \"Welcome, {name}!\": \"Willkommen, {name}!\",\n  \"Welcome, <0>{name}</0>!\": \"Willkommen, <0>{name}</0>!\",\n  \"Trainers: {trainersCount, number}\": \"Trainer: {trainersCount, number}\",\n  \"Trainers: <0>{trainersCount, number}</0>!\": \"Trainer: <0>{trainersCount, number}</0>!\",\n  \"Caught on {catchDate, date, full}\": \"Gefangen am {catchDate, date, full}\",\n  \"Caught on <0>{catchDate, date, full}</0>!\": \"Gefangen am <0>{catchDate, date, full}</0>!\",\n  \"{gender, select,  male {He avoids bugs.} female {She avoids bugs.} other {They avoid bugs.}}\": \"{gender, select,  male {Er vermeidet Fehler.} female {Sie vermeidet Fehler.} other {Sie vermeiden Fehler.}}\",\n  \"{gender, select,  male {<0>He</0> avoids bugs.} female {<1>She</1> avoids bugs.} other {<2>They</2> avoid bugs.}}\": \"{gender, select,  male {<0>Er</0> vermeidet Fehler. } female {<1>Sie</1> vermeidet Fehler. } other {<2>Sie</2> vermeiden Fehler. }}\",\n  \"{itemsCount1, plural,  =0 {There is no item.} one {There is # item.} other {There are # items.}}\": \"{itemsCount1, plural,  =0 {Es hat keinen Gegenstand.} one {Es hat # Gegenstand.} other {Es hat # Gegenstände.}}\",\n  \"{itemsCount2, plural,  =0 {There is no item.} one {There is # item.} other {There are # items.}}\": \"{itemsCount2, plural,  =0 {Es hat keinen Gegenstand.} one {Es hat # Gegenstand.} other {Es hat # Gegenstände.}}\",\n  \"{itemsCount3, plural,  =0 {There is no item.} one {There is # item.} other {There are # items.}}\": \"{itemsCount3, plural,  =0 {Es hat keinen Gegenstand.} one {Es hat # Gegenstand.} other {Es hat # Gegenstände.}}\",\n  \"testKey\": \"{itemsCount3, plural,  =0 { Es hat <0>keinen</0> Gegenstand. } one { Es hat <1>#</1> Gegenstand. } other { Es het <2>#</2> Gegenstände. }}\"\n}\n"
  },
  {
    "path": "example/react-icu/public/locales/en/translations.json",
    "content": "{\n  \"title\": \"Welcome to react using react-i18next\",\n  \"description.part1\": \"To get started, edit <1>src/App.js</1> and save to reload.\",\n  \"description.part2\": \"Switch language between english and german using buttons above.\",\n  \"icu\": \"{numPersons, plural, =0 {no persons} =1 {one person} other {# persons}}\",\n  \"icu_and_trans\": \"We invited <0>{numPersons, plural, =0 {no persons} =1 {one person} other {# persons}}</0>.\",\n  \"Welcome, {name}!\": \"Welcome, {name}!\",\n  \"Welcome, <0>{name}</0>!\": \"Welcome, <0>{name}</0>!\",\n  \"Trainers: {trainersCount, number}\": \"Trainers: {trainersCount, number}\",\n  \"Trainers: <0>{trainersCount, number}</0>!\": \"Trainers: <0>{trainersCount, number}</0>!\",\n  \"Caught on {catchDate, date, full}\": \"Caught on {catchDate, date, full}\",\n  \"Caught on <0>{catchDate, date, full}</0>!\": \"Caught on <0>{catchDate, date, full}</0>!\",\n  \"{gender, select,  male {He avoids bugs.} female {She avoids bugs.} other {They avoid bugs.}}\": \"{gender, select,  male {He avoids bugs.} female {She avoids bugs.} other {They avoid bugs.}}\",\n  \"{gender, select,  male {<0>He</0> avoids bugs.} female {<1>She</1> avoids bugs.} other {<2>They</2> avoid bugs.}}\": \"{gender, select,  male {<0>He</0> avoids bugs.} female {<1>She</1> avoids bugs.} other {<2>They</2> avoid bugs.}}\",\n  \"{itemsCount1, plural,  =0 {There is no item.} one {There is # item.} other {There are # items.}}\": \"{itemsCount1, plural,  =0 {There is no item.} one {There is # item.} other {There are # items.}}\",\n  \"{itemsCount2, plural,  =0 {There is no item.} one {There is # item.} other {There are # items.}}\": \"{itemsCount2, plural,  =0 {There is no item.} one {There is # item.} other {There are # items.}}\",\n  \"{itemsCount3, plural,  =0 {There is no item.} one {There is # item.} other {There are # items.}}\": \"{itemsCount3, plural,  =0 {There is no item.} one {There is # item.} other {There are # items.}}\",\n  \"testKey\": \"{itemsCount3, plural,  =0 { There is <0>no</0> item. } one { There is <1>#</1> item. } other { There are <2>#</2> items. }}\"\n}\n"
  },
  {
    "path": "example/react-icu/public/locales/ru/translations.json",
    "content": "{\n  \"title\": \"Добро пожаловать в React и react-i18next\",\n  \"description.part1\": \"Что би начать, отредактируйте <1>src/App.js</1> и сохраните, что бы обновилось.\",\n  \"description.part2\": \"Переключайте языки между английским, немецким и русским чуть выше.\",\n  \"icu\": \"{numPersons, plural, =0 {\\nнет людей} one {# персона} few {# персоны} many {# персон} other {# персон}}\",\n  \"icu_and_trans\": \"Мы пригласили <0>{numPersons, plural, =0 {никого} one {# персону} few {# персоны} many {# персон} other {# персон}}</0>.\",\n  \"Welcome, {name}!\": \"Добро пожаловать, {name}!\",\n  \"Welcome, <0>{name}</0>!\": \"Добро пожаловать, <0>{name}</0>!\",\n  \"Trainers: {trainersCount, number}\": \"Тренера: {trainersCount, number}\",\n  \"Trainers: <0>{trainersCount, number}</0>!\": \"Тренера: <0>{trainersCount, number}</0>!\",\n  \"Caught on {catchDate, date, full}\": \"Пойман в {catchDate, date, full}\",\n  \"Caught on <0>{catchDate, date, full}</0>!\": \"Пойман в <0>{catchDate, date, full}</0>!\",\n  \"{gender, select,  male {He avoids bugs.} female {She avoids bugs.} other {They avoid bugs.}}\": \"{gender, select,  male {Он избегает ошибок.} female {Она избегает ошибок.} other {Они избегают ошибок.}}\",\n  \"{gender, select,  male {<0>He</0> avoids bugs.} female {<1>She</1> avoids bugs.} other {<2>They</2> avoid bugs.}}\": \"{gender, select,  male {<0>Он</0> избегает ошибок.} female {<1>Она</1> избегает ошибок.} other {<2>Они</2> избегают ошибок.}}\",\n  \"{itemsCount1, plural,  =0 {There is no item.} one {There is # item.} other {There are # items.}}\": \"{itemsCount1, plural,  =0 {Нет ни одной штуки} one {Есть # штука.} few {Есть # штуки.} many {Есть # штук.} other {Есть # штук.}}\",\n  \"{itemsCount2, plural,  =0 {There is no item.} one {There is # item.} other {There are # items.}}\": \"{itemsCount2, plural,  =0 {Нет ни одной штуки} one {Есть # штука.} few {Есть # штуки.} many {Есть # штук.} other {Есть # штук.}}\",\n  \"{itemsCount3, plural,  =0 {There is no item.} one {There is # item.} other {There are # items.}}\": \"{itemsCount3, plural,  =0 {Нет ни одной штуки} one {Есть # штука.} few {Есть # штуки.} many {Есть # штук.} other {Есть # штук.}}\",\n  \"testKey\": \"{itemsCount3, plural,  =0 {Нет <0>ни одной</0> штуки. } one {Есть <0>#</0> штука.} few {Есть <0>#</0> штуки.} many {Есть <0>#</0> штук.} other {Есть <0>#</0> штук.}}\"\n}\n"
  },
  {
    "path": "example/react-icu/public/manifest.json",
    "content": "{\n  \"short_name\": \"React App\",\n  \"name\": \"Create React App Sample\",\n  \"icons\": [\n    {\n      \"src\": \"favicon.ico\",\n      \"sizes\": \"64x64 32x32 24x24 16x16\",\n      \"type\": \"image/x-icon\"\n    },\n    {\n      \"src\": \"logo192.png\",\n      \"type\": \"image/png\",\n      \"sizes\": \"192x192\"\n    },\n    {\n      \"src\": \"logo512.png\",\n      \"type\": \"image/png\",\n      \"sizes\": \"512x512\"\n    }\n  ],\n  \"start_url\": \".\",\n  \"display\": \"standalone\",\n  \"theme_color\": \"#000000\",\n  \"background_color\": \"#ffffff\"\n}\n"
  },
  {
    "path": "example/react-icu/public/robots.txt",
    "content": "# https://www.robotstxt.org/robotstxt.html\nUser-agent: *\nDisallow:\n"
  },
  {
    "path": "example/react-icu/src/App.css",
    "content": ".App {\n  text-align: center;\n}\n\n.App-logo {\n  height: 40vmin;\n  pointer-events: none;\n}\n\n@media (prefers-reduced-motion: no-preference) {\n  .App-logo {\n    animation: App-logo-spin infinite 20s linear;\n  }\n}\n\n.App-header {\n  background-color: #282c34;\n  min-height: 100vh;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  font-size: calc(10px + 2vmin);\n  color: white;\n}\n\n.App-link {\n  color: #61dafb;\n}\n\n@keyframes App-logo-spin {\n  from {\n    transform: rotate(0deg);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n}\n"
  },
  {
    "path": "example/react-icu/src/App.js",
    "content": "import React, { Component, Suspense } from 'react';\nimport { withTranslation, Trans } from 'react-i18next';\nimport logo from './logo.svg';\nimport './App.css';\n\nimport ComponentUsingMacro from './ComponentUsingMacro';\nimport ComponentUsingMacroInterpolated from './ComponentUsingMacroInterpolated';\n\nclass Page extends Component {\n  render() {\n    const { t, i18n } = this.props;\n\n    const changeLanguage = (lng) => {\n      i18n.changeLanguage(lng);\n    };\n\n    return (\n      <div className=\"App\">\n        <div className=\"App-header\">\n          <img src={logo} className=\"App-logo\" alt=\"logo\" />\n          <h2>{t('title')}</h2>\n          <button onClick={() => changeLanguage('de')}>de</button>\n          <button onClick={() => changeLanguage('en')}>en</button>\n          <button onClick={() => changeLanguage('ru')}>ru</button>\n        </div>\n        <div className=\"App-intro\">\n          <Trans i18nKey=\"description.part1\">\n            To get started, edit <code>src/App.js</code> and save to reload.\n          </Trans>\n        </div>\n        <div>{t('description.part2')}</div>\n        <hr />\n        <Trans\n          i18nKey=\"icu_and_trans\"\n          defaults=\"We have <0>0 persons</0> invited.\"\n          components={[<strong>dummy</strong>]}\n          values={{ numPersons: 1003 }}\n        />\n        <div>{t('icu', { numPersons: 501 })}</div>\n        <ComponentUsingMacro />\n        <ComponentUsingMacroInterpolated />\n      </div>\n    );\n  }\n}\n\nconst PageWithTranslation = withTranslation('translations')(Page);\n\n// here app catches the suspense from page in case translations are not yet loaded\nexport default function App() {\n  return (\n    <Suspense fallback=\"Loading...\">\n      <PageWithTranslation />\n    </Suspense>\n  );\n}\n"
  },
  {
    "path": "example/react-icu/src/App.test.js",
    "content": "import React from 'react';\nimport { render } from '@testing-library/react';\nimport App from './App';\n\nimport './i18n';\n\ntest('renders learn react link', () => {\n  const { container } = render(<App />);\n\n  expect(container).toBeInTheDocument();\n});\n"
  },
  {
    "path": "example/react-icu/src/ComponentUsingMacro.js",
    "content": "import React from 'react';\nimport { withTranslation } from 'react-i18next';\n\n// importing the macro components from react-i18next\nimport { Trans, Plural, Select } from 'react-i18next/icu.macro';\n\n// as we \"bend\" some es-lint rules we need to disable those\n// this let us write \"{ trainersCount, number }\" or \"{ catchDate, date, short }\"\n// inside Trans -> other option would be an additional component which transforms\n// to needed string, eg. <FormattedNumber count={count} />\n/* eslint-disable no-undef, no-sequences */\n// prettier-ignore\nexport function ComponentUsingMacro() {\n  const name = 'John Doe';\n  const itemsCount1 = 0;\n  const itemsCount2 = 1;\n  const itemsCount3 = 199;\n  const trainersCount = 134567;\n\n  const catchDate = new Date();\n  const gender = 'female';\n\n\n  return (\n    <div>\n      <hr />\n      <p><i>Using babel macro plugin to transpile icu containing nodes into valid Trans component:</i></p>\n\n\n      <p><i>interpolation:</i></p>\n      <Trans>Welcome, { name }!</Trans>\n      <br />\n      <Trans>Welcome, <strong>{ name }</strong>!</Trans>\n      <br />\n      <Trans>Trainers: { trainersCount, number }</Trans>\n      <br />\n      <Trans>Trainers: <strong>{ trainersCount, number }</strong>!</Trans>\n      <br />\n      <Trans>Caught on { catchDate, date, full }</Trans>\n      <br />\n      <Trans>Caught on <strong>{ catchDate, date, full }</strong>!</Trans>\n\n      <p><i>select:</i></p>\n      <Select\n        switch={gender}\n        male=\"He avoids bugs.\"\n        female=\"She avoids bugs.\"\n        other=\"They avoid bugs.\"\n      />\n      <br />\n      <Select\n        switch={gender}\n        male={<Trans><strong>He</strong> avoids bugs.</Trans>}\n        female={<Trans><strong>She</strong> avoids bugs.</Trans>}\n        other={<Trans><strong>They</strong> avoid bugs.</Trans>}\n      />\n\n      <p><i>plurals:</i></p>\n      <Plural\n        count={itemsCount1}\n        $0=\"There is no item.\"\n        one=\"There is # item.\"\n        other=\"There are # items.\"\n      />\n      <br />\n      <Plural\n        count={itemsCount2}\n        $0=\"There is no item.\"\n        one=\"There is # item.\"\n        other=\"There are # items.\"\n      />\n      <br />\n      <Plural\n        count={itemsCount3}\n        $0=\"There is no item.\"\n        one=\"There is # item.\"\n        other=\"There are # items.\"\n      />\n      <br />\n      <Plural\n        i18nKey=\"testKey\"\n        count={itemsCount3}\n        $0={<Trans>There is <strong>no</strong> item.</Trans>}\n        one={<Trans>There is <strong>#</strong> item.</Trans>}\n        other={<Trans>There are <strong>#</strong> items.</Trans>}\n      />\n    </div>\n  );\n}\n/* eslint-enable no-undef, no-sequences */\n\nexport default withTranslation('translations')(ComponentUsingMacro);\n"
  },
  {
    "path": "example/react-icu/src/ComponentUsingMacroInterpolated.js",
    "content": "import React from 'react';\nimport { withTranslation } from 'react-i18next';\n\n// importing the macro components from react-i18next\nimport { Trans, plural, select, date, number } from 'react-i18next/icu.macro';\n\n// with this syntax, we don't need to \"bend\" some es-lint rules, as we do inside ComponentUsingMacro\nexport function ComponentUsingMacro() {\n  const name = 'John Doe';\n  const itemsCount1 = 0;\n  const itemsCount2 = 1;\n  const itemsCount3 = 199;\n  const trainersCount = 134567;\n\n  const catchDate = new Date();\n  const gender = 'female';\n\n  return (\n    <div>\n      <hr />\n      <p>\n        <i>\n          Using babel macro plugin to transpile icu, using syntax like date`${'{'}varname{'}'}`:\n        </i>\n      </p>\n\n      <p>\n        <i>interpolation:</i>\n      </p>\n      <Trans>Welcome, {name}!</Trans>\n      <br />\n      <Trans>\n        Welcome, <strong>{name}</strong>!\n      </Trans>\n      <br />\n      <Trans>Trainers: {`number${trainersCount}`}</Trans>\n      <br />\n      <Trans>\n        Trainers: <strong>{number`${trainersCount}`}</strong>!\n      </Trans>\n      <br />\n      <Trans>Caught on {date`${catchDate}, full`}</Trans>\n      <br />\n      <Trans>\n        Caught on <strong>{date`${catchDate}, full`}</strong>!\n      </Trans>\n\n      <p>\n        <i>select:</i>\n      </p>\n      <Trans>{select`${gender}\n       male {He avoids bugs.}\n       female {She avoids bugs.}\n       other {They avoid bugs.}\n      `}</Trans>\n      <br />\n      <Trans>{select`${gender}\n       male {${(<strong>He</strong>)} avoids bugs.}\n       female {${(<strong>She</strong>)} avoids bugs.}\n       other {${(<strong>They</strong>)} avoid bugs.}\n      `}</Trans>\n      <p>\n        <i>plurals:</i>\n      </p>\n      <Trans>{plural`${itemsCount1},\n        =0 {There is no item.}\n        one {There is # item.}\n        other {There are # items.}\n      `}</Trans>\n      <br />\n      <Trans>{plural`${itemsCount2},\n        =0 {There is no item.}\n        one {There is # item.}\n        other {There are # items.}\n      `}</Trans>\n      <br />\n      <Trans>{plural`${itemsCount3},\n        =0 {There is no item.}\n        one {There is # item.}\n        other {There are # items.}\n      `}</Trans>\n      <br />\n      <Trans i18nKey=\"testKey\">{plural`${itemsCount1},\n        =0 {There is ${(<strong>no</strong>)} item.}\n        one {There is ${(<strong>#</strong>)} item.}\n        other {There are ${(<strong>#</strong>)} items.}\n      `}</Trans>\n    </div>\n  );\n}\n/* eslint-enable no-undef, no-sequences */\n\nexport default withTranslation('translations')(ComponentUsingMacro);\n"
  },
  {
    "path": "example/react-icu/src/i18n.js",
    "content": "import i18n from 'i18next';\nimport Backend from 'i18next-http-backend';\nimport LanguageDetector from 'i18next-browser-languagedetector';\nimport { initReactI18next } from 'react-i18next';\n\nimport ICU from 'i18next-icu';\n\ni18n\n  .use(ICU)\n  .use(Backend)\n  .use(LanguageDetector)\n  .use(initReactI18next)\n  .init({\n    fallbackLng: 'en',\n\n    // have a common namespace used around the full app\n    ns: ['translations'],\n    defaultNS: 'translations',\n\n    nsSeparator: false,\n    keySeparator: false,\n\n    debug: true,\n\n    interpolation: {\n      escapeValue: false, // not needed for react!!\n    },\n\n    react: {\n      useSuspense: true,\n    },\n  });\n\nexport default i18n;\n"
  },
  {
    "path": "example/react-icu/src/index.css",
    "content": "body {\n  margin: 0;\n  font-family:\n    -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell',\n    'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n}\n\ncode {\n  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', monospace;\n}\n"
  },
  {
    "path": "example/react-icu/src/index.js",
    "content": "import React from 'react';\nimport { createRoot } from 'react-dom/client';\nimport './index.css';\nimport App from './App';\nimport * as serviceWorker from './serviceWorker';\n\nimport './i18n';\n\nconst root = createRoot(document.getElementById('root'));\nroot.render(\n  <React.StrictMode>\n    <App />\n  </React.StrictMode>,\n);\n\n// If you want your app to work offline and load faster, you can change\n// unregister() to register() below. Note this comes with some pitfalls.\n// Learn more about service workers: https://bit.ly/CRA-PWA\nserviceWorker.unregister();\n"
  },
  {
    "path": "example/react-icu/src/serviceWorker.js",
    "content": "// This optional code is used to register a service worker.\n// register() is not called by default.\n\n// This lets the app load faster on subsequent visits in production, and gives\n// it offline capabilities. However, it also means that developers (and users)\n// will only see deployed updates on subsequent visits to a page, after all the\n// existing tabs open on the page have been closed, since previously cached\n// resources are updated in the background.\n\n// To learn more about the benefits of this model and instructions on how to\n// opt-in, read https://bit.ly/CRA-PWA\n\nconst isLocalhost = Boolean(\n  window.location.hostname === 'localhost' ||\n    // [::1] is the IPv6 localhost address.\n    window.location.hostname === '[::1]' ||\n    // 127.0.0.0/8 are considered localhost for IPv4.\n    window.location.hostname.match(/^127(?:\\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/),\n);\n\nexport function register(config) {\n  if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {\n    // The URL constructor is available in all browsers that support SW.\n    const publicUrl = new URL(process.env.PUBLIC_URL, window.location.href);\n    if (publicUrl.origin !== window.location.origin) {\n      // Our service worker won't work if PUBLIC_URL is on a different origin\n      // from what our page is served on. This might happen if a CDN is used to\n      // serve assets; see https://github.com/facebook/create-react-app/issues/2374\n      return;\n    }\n\n    window.addEventListener('load', () => {\n      const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;\n\n      if (isLocalhost) {\n        // This is running on localhost. Let's check if a service worker still exists or not.\n        checkValidServiceWorker(swUrl, config);\n\n        // Add some additional logging to localhost, pointing developers to the\n        // service worker/PWA documentation.\n        navigator.serviceWorker.ready.then(() => {\n          console.log(\n            'This web app is being served cache-first by a service ' +\n              'worker. To learn more, visit https://bit.ly/CRA-PWA',\n          );\n        });\n      } else {\n        // Is not localhost. Just register service worker\n        registerValidSW(swUrl, config);\n      }\n    });\n  }\n}\n\nfunction registerValidSW(swUrl, config) {\n  navigator.serviceWorker\n    .register(swUrl)\n    .then((registration) => {\n      registration.onupdatefound = () => {\n        const installingWorker = registration.installing;\n        if (installingWorker == null) {\n          return;\n        }\n        installingWorker.onstatechange = () => {\n          if (installingWorker.state === 'installed') {\n            if (navigator.serviceWorker.controller) {\n              // At this point, the updated precached content has been fetched,\n              // but the previous service worker will still serve the older\n              // content until all client tabs are closed.\n              console.log(\n                'New content is available and will be used when all ' +\n                  'tabs for this page are closed. See https://bit.ly/CRA-PWA.',\n              );\n\n              // Execute callback\n              if (config && config.onUpdate) {\n                config.onUpdate(registration);\n              }\n            } else {\n              // At this point, everything has been precached.\n              // It's the perfect time to display a\n              // \"Content is cached for offline use.\" message.\n              console.log('Content is cached for offline use.');\n\n              // Execute callback\n              if (config && config.onSuccess) {\n                config.onSuccess(registration);\n              }\n            }\n          }\n        };\n      };\n    })\n    .catch((error) => {\n      console.error('Error during service worker registration:', error);\n    });\n}\n\nfunction checkValidServiceWorker(swUrl, config) {\n  // Check if the service worker can be found. If it can't reload the page.\n  fetch(swUrl, {\n    headers: { 'Service-Worker': 'script' },\n  })\n    .then((response) => {\n      // Ensure service worker exists, and that we really are getting a JS file.\n      const contentType = response.headers.get('content-type');\n      if (\n        response.status === 404 ||\n        (contentType != null && contentType.indexOf('javascript') === -1)\n      ) {\n        // No service worker found. Probably a different app. Reload the page.\n        navigator.serviceWorker.ready.then((registration) => {\n          registration.unregister().then(() => {\n            window.location.reload();\n          });\n        });\n      } else {\n        // Service worker found. Proceed as normal.\n        registerValidSW(swUrl, config);\n      }\n    })\n    .catch(() => {\n      console.log('No internet connection found. App is running in offline mode.');\n    });\n}\n\nexport function unregister() {\n  if ('serviceWorker' in navigator) {\n    navigator.serviceWorker.ready\n      .then((registration) => {\n        registration.unregister();\n      })\n      .catch((error) => {\n        console.error(error.message);\n      });\n  }\n}\n"
  },
  {
    "path": "example/react-icu/src/setupTests.js",
    "content": "// jest-dom adds custom jest matchers for asserting on DOM nodes.\n// allows you to do things like:\n// expect(element).toHaveTextContent(/react/i)\n// learn more: https://github.com/testing-library/jest-dom\nimport '@testing-library/jest-dom/extend-expect';\n"
  },
  {
    "path": "example/react-localstorage/.gitignore",
    "content": "# See https://help.github.com/ignore-files/ for more about ignoring files.\n\n# dependencies\n/node_modules\n\n# testing\n/coverage\n\n# production\n/build\n\n# misc\n.DS_Store\n.env.local\n.env.development.local\n.env.test.local\n.env.production.local\n\nnpm-debug.log*\nyarn-debug.log*\nyarn-error.log*\n"
  },
  {
    "path": "example/react-localstorage/README.md",
    "content": "# [Ready to take i18next to the next level?](http://locize.com/?utm_source=react_i18next_readme&utm_medium=github)\n\nNeeding a translation management? Want to edit your translations with an InContext Editor? Use the original provided to you by the maintainers of i18next!\n\n![locize](https://www.locize.com/img/ads/github_locize.png)\n\nWith using [locize](http://locize.com/?utm_source=react_i18next_readme&utm_medium=github) you directly support the future of i18next and react-i18next.\n\n## Here you find a react example for locize:\n\n[EXAMPLE](../locize)\n\n[![video](../locize/video_sample.png)](https://youtu.be/osScyaGMVqo)\n[watch the video](https://youtu.be/osScyaGMVqo)\n\n---\n\nThis project was bootstrapped with [Create React App](https://github.com/facebookincubator/create-react-app).\n\nBelow you will find some information on how to perform common tasks.<br>\nYou can find the most recent version of this guide [here](https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md).\n\n## Table of Contents\n\n- [Updating to New Releases](#updating-to-new-releases)\n- [Sending Feedback](#sending-feedback)\n- [Folder Structure](#folder-structure)\n- [Available Scripts](#available-scripts)\n  - [npm start](#npm-start)\n  - [npm test](#npm-test)\n  - [npm run build](#npm-run-build)\n  - [npm run eject](#npm-run-eject)\n- [Supported Language Features and Polyfills](#supported-language-features-and-polyfills)\n- [Syntax Highlighting in the Editor](#syntax-highlighting-in-the-editor)\n- [Displaying Lint Output in the Editor](#displaying-lint-output-in-the-editor)\n- [Debugging in the Editor](#debugging-in-the-editor)\n- [Formatting Code Automatically](#formatting-code-automatically)\n- [Changing the Page `<title>`](#changing-the-page-title)\n- [Installing a Dependency](#installing-a-dependency)\n- [Importing a Component](#importing-a-component)\n- [Code Splitting](#code-splitting)\n- [Adding a Stylesheet](#adding-a-stylesheet)\n- [Post-Processing CSS](#post-processing-css)\n- [Adding a CSS Preprocessor (Sass, Less etc.)](#adding-a-css-preprocessor-sass-less-etc)\n- [Adding Images, Fonts, and Files](#adding-images-fonts-and-files)\n- [Using the `public` Folder](#using-the-public-folder)\n  - [Changing the HTML](#changing-the-html)\n  - [Adding Assets Outside of the Module System](#adding-assets-outside-of-the-module-system)\n  - [When to Use the `public` Folder](#when-to-use-the-public-folder)\n- [Using Global Variables](#using-global-variables)\n- [Adding Bootstrap](#adding-bootstrap)\n  - [Using a Custom Theme](#using-a-custom-theme)\n- [Adding Flow](#adding-flow)\n- [Adding Custom Environment Variables](#adding-custom-environment-variables)\n  - [Referencing Environment Variables in the HTML](#referencing-environment-variables-in-the-html)\n  - [Adding Temporary Environment Variables In Your Shell](#adding-temporary-environment-variables-in-your-shell)\n  - [Adding Development Environment Variables In `.env`](#adding-development-environment-variables-in-env)\n- [Can I Use Decorators?](#can-i-use-decorators)\n- [Integrating with an API Backend](#integrating-with-an-api-backend)\n  - [Node](#node)\n  - [Ruby on Rails](#ruby-on-rails)\n- [Proxying API Requests in Development](#proxying-api-requests-in-development)\n  - [\"Invalid Host Header\" Errors After Configuring Proxy](#invalid-host-header-errors-after-configuring-proxy)\n  - [Configuring the Proxy Manually](#configuring-the-proxy-manually)\n  - [Configuring a WebSocket Proxy](#configuring-a-websocket-proxy)\n- [Using HTTPS in Development](#using-https-in-development)\n- [Generating Dynamic `<meta>` Tags on the Server](#generating-dynamic-meta-tags-on-the-server)\n- [Pre-Rendering into Static HTML Files](#pre-rendering-into-static-html-files)\n- [Injecting Data from the Server into the Page](#injecting-data-from-the-server-into-the-page)\n- [Running Tests](#running-tests)\n  - [Filename Conventions](#filename-conventions)\n  - [Command Line Interface](#command-line-interface)\n  - [Version Control Integration](#version-control-integration)\n  - [Writing Tests](#writing-tests)\n  - [Testing Components](#testing-components)\n  - [Using Third Party Assertion Libraries](#using-third-party-assertion-libraries)\n  - [Initializing Test Environment](#initializing-test-environment)\n  - [Focusing and Excluding Tests](#focusing-and-excluding-tests)\n  - [Coverage Reporting](#coverage-reporting)\n  - [Continuous Integration](#continuous-integration)\n  - [Disabling jsdom](#disabling-jsdom)\n  - [Snapshot Testing](#snapshot-testing)\n  - [Editor Integration](#editor-integration)\n- [Developing Components in Isolation](#developing-components-in-isolation)\n  - [Getting Started with Storybook](#getting-started-with-storybook)\n  - [Getting Started with Styleguidist](#getting-started-with-styleguidist)\n- [Making a Progressive Web App](#making-a-progressive-web-app)\n  - [Opting Out of Caching](#opting-out-of-caching)\n  - [Offline-First Considerations](#offline-first-considerations)\n  - [Progressive Web App Metadata](#progressive-web-app-metadata)\n- [Analyzing the Bundle Size](#analyzing-the-bundle-size)\n- [Deployment](#deployment)\n  - [Static Server](#static-server)\n  - [Other Solutions](#other-solutions)\n  - [Serving Apps with Client-Side Routing](#serving-apps-with-client-side-routing)\n  - [Building for Relative Paths](#building-for-relative-paths)\n  - [Azure](#azure)\n  - [Firebase](#firebase)\n  - [GitHub Pages](#github-pages)\n  - [Heroku](#heroku)\n  - [Netlify](#netlify)\n  - [Now](#now)\n  - [S3 and CloudFront](#s3-and-cloudfront)\n  - [Surge](#surge)\n- [Advanced Configuration](#advanced-configuration)\n- [Troubleshooting](#troubleshooting)\n  - [`npm start` doesn’t detect changes](#npm-start-doesnt-detect-changes)\n  - [`npm test` hangs on macOS Sierra](#npm-test-hangs-on-macos-sierra)\n  - [`npm run build` exits too early](#npm-run-build-exits-too-early)\n  - [`npm run build` fails on Heroku](#npm-run-build-fails-on-heroku)\n  - [`npm run build` fails to minify](#npm-run-build-fails-to-minify)\n  - [Moment.js locales are missing](#momentjs-locales-are-missing)\n- [Something Missing?](#something-missing)\n\n## Updating to New Releases\n\nCreate React App is divided into two packages:\n\n- `create-react-app` is a global command-line utility that you use to create new projects.\n- `react-scripts` is a development dependency in the generated projects (including this one).\n\nYou almost never need to update `create-react-app` itself: it delegates all the setup to `react-scripts`.\n\nWhen you run `create-react-app`, it always creates the project with the latest version of `react-scripts` so you’ll get all the new features and improvements in newly created apps automatically.\n\nTo update an existing project to a new version of `react-scripts`, [open the changelog](https://github.com/facebookincubator/create-react-app/blob/master/CHANGELOG.md), find the version you’re currently on (check `package.json` in this folder if you’re not sure), and apply the migration instructions for the newer versions.\n\nIn most cases bumping the `react-scripts` version in `package.json` and running `npm install` in this folder should be enough, but it’s good to consult the [changelog](https://github.com/facebookincubator/create-react-app/blob/master/CHANGELOG.md) for potential breaking changes.\n\nWe commit to keeping the breaking changes minimal so you can upgrade `react-scripts` painlessly.\n\n## Sending Feedback\n\nWe are always open to [your feedback](https://github.com/facebookincubator/create-react-app/issues).\n\n## Folder Structure\n\nAfter creation, your project should look like this:\n\n```\nmy-app/\n  README.md\n  node_modules/\n  package.json\n  public/\n    index.html\n    favicon.ico\n  src/\n    App.css\n    App.js\n    App.test.js\n    index.css\n    index.js\n    logo.svg\n```\n\nFor the project to build, **these files must exist with exact filenames**:\n\n- `public/index.html` is the page template;\n- `src/index.js` is the JavaScript entry point.\n\nYou can delete or rename the other files.\n\nYou may create subdirectories inside `src`. For faster rebuilds, only files inside `src` are processed by Webpack.<br>\nYou need to **put any JS and CSS files inside `src`**, otherwise Webpack won’t see them.\n\nOnly files inside `public` can be used from `public/index.html`.<br>\nRead instructions below for using assets from JavaScript and HTML.\n\nYou can, however, create more top-level directories.<br>\nThey will not be included in the production build so you can use them for things like documentation.\n\n## Available Scripts\n\nIn the project directory, you can run:\n\n### `npm start`\n\nRuns the app in the development mode.<br>\nOpen [http://localhost:3000](http://localhost:3000) to view it in the browser.\n\nThe page will reload if you make edits.<br>\nYou will also see any lint errors in the console.\n\n### `npm test`\n\nLaunches the test runner in the interactive watch mode.<br>\nSee the section about [running tests](#running-tests) for more information.\n\n### `npm run build`\n\nBuilds the app for production to the `build` folder.<br>\nIt correctly bundles React in production mode and optimizes the build for the best performance.\n\nThe build is minified and the filenames include the hashes.<br>\nYour app is ready to be deployed!\n\nSee the section about [deployment](#deployment) for more information.\n\n### `npm run eject`\n\n**Note: this is a one-way operation. Once you `eject`, you can’t go back!**\n\nIf you aren’t satisfied with the build tool and configuration choices, you can `eject` at any time. This command will remove the single build dependency from your project.\n\nInstead, it will copy all the configuration files and the transitive dependencies (Webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except `eject` will still work, but they will point to the copied scripts so you can tweak them. At this point you’re on your own.\n\nYou don’t have to ever use `eject`. The curated feature set is suitable for small and middle deployments, and you shouldn’t feel obligated to use this feature. However we understand that this tool wouldn’t be useful if you couldn’t customize it when you are ready for it.\n\n## Supported Language Features and Polyfills\n\nThis project supports a superset of the latest JavaScript standard.<br>\nIn addition to [ES6](https://github.com/lukehoban/es6features) syntax features, it also supports:\n\n- [Exponentiation Operator](https://github.com/rwaldron/exponentiation-operator) (ES2016).\n- [Async/await](https://github.com/tc39/ecmascript-asyncawait) (ES2017).\n- [Object Rest/Spread Properties](https://github.com/sebmarkbage/ecmascript-rest-spread) (stage 3 proposal).\n- [Dynamic import()](https://github.com/tc39/proposal-dynamic-import) (stage 3 proposal)\n- [Class Fields and Static Properties](https://github.com/tc39/proposal-class-public-fields) (stage 2 proposal).\n- [JSX](https://facebook.github.io/react/docs/introducing-jsx.html) and [Flow](https://flowtype.org/) syntax.\n\nLearn more about [different proposal stages](https://babeljs.io/docs/plugins/#presets-stage-x-experimental-presets-).\n\nWhile we recommend to use experimental proposals with some caution, Facebook heavily uses these features in the product code, so we intend to provide [codemods](https://medium.com/@cpojer/effective-javascript-codemods-5a6686bb46fb) if any of these proposals change in the future.\n\nNote that **the project only includes a few ES6 [polyfills](https://en.wikipedia.org/wiki/Polyfill)**:\n\n- [`Object.assign()`](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Object/assign) via [`object-assign`](https://github.com/sindresorhus/object-assign).\n- [`Promise`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise) via [`promise`](https://github.com/then/promise).\n- [`fetch()`](https://developer.mozilla.org/en/docs/Web/API/Fetch_API) via [`whatwg-fetch`](https://github.com/github/fetch).\n\nIf you use any other ES6+ features that need **runtime support** (such as `Array.from()` or `Symbol`), make sure you are including the appropriate polyfills manually, or that the browsers you are targeting already support them.\n\n## Syntax Highlighting in the Editor\n\nTo configure the syntax highlighting in your favorite text editor, head to the [relevant Babel documentation page](https://babeljs.io/docs/editors) and follow the instructions. Some of the most popular editors are covered.\n\n## Displaying Lint Output in the Editor\n\n> Note: this feature is available with `react-scripts@0.2.0` and higher.<br>\n> It also only works with npm 3 or higher.\n\nSome editors, including Sublime Text, Atom, and Visual Studio Code, provide plugins for ESLint.\n\nThey are not required for linting. You should see the linter output right in your terminal as well as the browser console. However, if you prefer the lint results to appear right in your editor, there are some extra steps you can do.\n\nYou would need to install an ESLint plugin for your editor first. Then, add a file called `.eslintrc` to the project root:\n\n```js\n{\n  \"extends\": \"react-app\"\n}\n```\n\nNow your editor should report the linting warnings.\n\nNote that even if you edit your `.eslintrc` file further, these changes will **only affect the editor integration**. They won’t affect the terminal and in-browser lint output. This is because Create React App intentionally provides a minimal set of rules that find common mistakes.\n\nIf you want to enforce a coding style for your project, consider using [Prettier](https://github.com/jlongster/prettier) instead of ESLint style rules.\n\n## Debugging in the Editor\n\n**This feature is currently only supported by [Visual Studio Code](https://code.visualstudio.com) and [WebStorm](https://www.jetbrains.com/webstorm/).**\n\nVisual Studio Code and WebStorm support debugging out of the box with Create React App. This enables you as a developer to write and debug your React code without leaving the editor, and most importantly it enables you to have a continuous development workflow, where context switching is minimal, as you don’t have to switch between tools.\n\n### Visual Studio Code\n\nYou would need to have the latest version of [VS Code](https://code.visualstudio.com) and VS Code [Chrome Debugger Extension](https://marketplace.visualstudio.com/items?itemName=msjsdiag.debugger-for-chrome) installed.\n\nThen add the block below to your `launch.json` file and put it inside the `.vscode` folder in your app’s root directory.\n\n```json\n{\n  \"version\": \"0.2.0\",\n  \"configurations\": [\n    {\n      \"name\": \"Chrome\",\n      \"type\": \"chrome\",\n      \"request\": \"launch\",\n      \"url\": \"http://localhost:3000\",\n      \"webRoot\": \"${workspaceRoot}/src\",\n      \"userDataDir\": \"${workspaceRoot}/.vscode/chrome\",\n      \"sourceMapPathOverrides\": {\n        \"webpack:///src/*\": \"${webRoot}/*\"\n      }\n    }\n  ]\n}\n```\n\n> Note: the URL may be different if you've made adjustments via the [HOST or PORT environment variables](#advanced-configuration).\n\nStart your app by running `npm start`, and start debugging in VS Code by pressing `F5` or by clicking the green debug icon. You can now write code, set breakpoints, make changes to the code, and debug your newly modified code—all from your editor.\n\n### WebStorm\n\nYou would need to have [WebStorm](https://www.jetbrains.com/webstorm/) and [JetBrains IDE Support](https://chrome.google.com/webstore/detail/jetbrains-ide-support/hmhgeddbohgjknpmjagkdomcpobmllji) Chrome extension installed.\n\nIn the WebStorm menu `Run` select `Edit Configurations...`. Then click `+` and select `JavaScript Debug`. Paste `http://localhost:3000` into the URL field and save the configuration.\n\n> Note: the URL may be different if you've made adjustments via the [HOST or PORT environment variables](#advanced-configuration).\n\nStart your app by running `npm start`, then press `^D` on macOS or `F9` on Windows and Linux or click the green debug icon to start debugging in WebStorm.\n\nThe same way you can debug your application in IntelliJ IDEA Ultimate, PhpStorm, PyCharm Pro, and RubyMine.\n\n## Formatting Code Automatically\n\nPrettier is an opinionated code formatter with support for JavaScript, CSS and JSON. With Prettier you can format the code you write automatically to ensure a code style within your project. See the [Prettier's GitHub page](https://github.com/prettier/prettier) for more information, and look at this [page to see it in action](https://prettier.github.io/prettier/).\n\nTo format our code whenever we make a commit in git, we need to install the following dependencies:\n\n```sh\nnpm install --save husky lint-staged prettier\n```\n\nAlternatively you may use `yarn`:\n\n```sh\nyarn add husky lint-staged prettier\n```\n\n- `husky` makes it easy to use githooks as if they are npm scripts.\n- `lint-staged` allows us to run scripts on staged files in git. See this [blog post about lint-staged to learn more about it](https://medium.com/@okonetchnikov/make-linting-great-again-f3890e1ad6b8).\n- `prettier` is the JavaScript formatter we will run before commits.\n\nNow we can make sure every file is formatted correctly by adding a few lines to the `package.json` in the project root.\n\nAdd the following line to `scripts` section:\n\n```diff\n  \"scripts\": {\n+   \"precommit\": \"lint-staged\",\n    \"start\": \"react-scripts start\",\n    \"build\": \"react-scripts build\",\n```\n\nNext we add a 'lint-staged' field to the `package.json`, for example:\n\n```diff\n  \"dependencies\": {\n    // ...\n  },\n+ \"lint-staged\": {\n+   \"src/**/*.{js,jsx,json,css}\": [\n+     \"prettier --single-quote --write\",\n+     \"git add\"\n+   ]\n+ },\n  \"scripts\": {\n```\n\nNow, whenever you make a commit, Prettier will format the changed files automatically. You can also run `./node_modules/.bin/prettier --single-quote --write \"src/**/*.{js,jsx}\"` to format your entire project for the first time.\n\nNext you might want to integrate Prettier in your favorite editor. Read the section on [Editor Integration](https://github.com/prettier/prettier#editor-integration) on the Prettier GitHub page.\n\n## Changing the Page `<title>`\n\nYou can find the source HTML file in the `public` folder of the generated project. You may edit the `<title>` tag in it to change the title from “React App” to anything else.\n\nNote that normally you wouldn’t edit files in the `public` folder very often. For example, [adding a stylesheet](#adding-a-stylesheet) is done without touching the HTML.\n\nIf you need to dynamically update the page title based on the content, you can use the browser [`document.title`](https://developer.mozilla.org/en-US/docs/Web/API/Document/title) API. For more complex scenarios when you want to change the title from React components, you can use [React Helmet](https://github.com/nfl/react-helmet), a third party library.\n\nIf you use a custom server for your app in production and want to modify the title before it gets sent to the browser, you can follow advice in [this section](#generating-dynamic-meta-tags-on-the-server). Alternatively, you can pre-build each page as a static HTML file which then loads the JavaScript bundle, which is covered [here](#pre-rendering-into-static-html-files).\n\n## Installing a Dependency\n\nThe generated project includes React and ReactDOM as dependencies. It also includes a set of scripts used by Create React App as a development dependency. You may install other dependencies (for example, React Router) with `npm`:\n\n```sh\nnpm install --save react-router\n```\n\nAlternatively you may use `yarn`:\n\n```sh\nyarn add react-router\n```\n\nThis works for any library, not just `react-router`.\n\n## Importing a Component\n\nThis project setup supports ES6 modules thanks to Babel.<br>\nWhile you can still use `require()` and `module.exports`, we encourage you to use [`import` and `export`](http://exploringjs.com/es6/ch_modules.html) instead.\n\nFor example:\n\n### `Button.js`\n\n```js\nimport React, { Component } from 'react';\n\nclass Button extends Component {\n  render() {\n    // ...\n  }\n}\n\nexport default Button; // Don’t forget to use export default!\n```\n\n### `DangerButton.js`\n\n```js\nimport React, { Component } from 'react';\nimport Button from './Button'; // Import a component from another file\n\nclass DangerButton extends Component {\n  render() {\n    return <Button color=\"red\" />;\n  }\n}\n\nexport default DangerButton;\n```\n\nBe aware of the [difference between default and named exports](http://stackoverflow.com/questions/36795819/react-native-es-6-when-should-i-use-curly-braces-for-import/36796281#36796281). It is a common source of mistakes.\n\nWe suggest that you stick to using default imports and exports when a module only exports a single thing (for example, a component). That’s what you get when you use `export default Button` and `import Button from './Button'`.\n\nNamed exports are useful for utility modules that export several functions. A module may have at most one default export and as many named exports as you like.\n\nLearn more about ES6 modules:\n\n- [When to use the curly braces?](http://stackoverflow.com/questions/36795819/react-native-es-6-when-should-i-use-curly-braces-for-import/36796281#36796281)\n- [Exploring ES6: Modules](http://exploringjs.com/es6/ch_modules.html)\n- [Understanding ES6: Modules](https://leanpub.com/understandinges6/read#leanpub-auto-encapsulating-code-with-modules)\n\n## Code Splitting\n\nInstead of downloading the entire app before users can use it, code splitting allows you to split your code into small chunks which you can then load on demand.\n\nThis project setup supports code splitting via [dynamic `import()`](http://2ality.com/2017/01/import-operator.html#loading-code-on-demand). Its [proposal](https://github.com/tc39/proposal-dynamic-import) is in stage 3. The `import()` function-like form takes the module name as an argument and returns a [`Promise`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise) which always resolves to the namespace object of the module.\n\nHere is an example:\n\n### `moduleA.js`\n\n```js\nconst moduleA = 'Hello';\n\nexport { moduleA };\n```\n\n### `App.js`\n\n```js\nimport React, { Component } from 'react';\n\nclass App extends Component {\n  handleClick = () => {\n    import('./moduleA')\n      .then(({ moduleA }) => {\n        // Use moduleA\n      })\n      .catch((err) => {\n        // Handle failure\n      });\n  };\n\n  render() {\n    return (\n      <div>\n        <button onClick={this.handleClick}>Load</button>\n      </div>\n    );\n  }\n}\n\nexport default App;\n```\n\nThis will make `moduleA.js` and all its unique dependencies as a separate chunk that only loads after the user clicks the 'Load' button.\n\nYou can also use it with `async` / `await` syntax if you prefer it.\n\n### With React Router\n\nIf you are using React Router check out [this tutorial](http://serverless-stack.com/chapters/code-splitting-in-create-react-app.html) on how to use code splitting with it. You can find the companion GitHub repository [here](https://github.com/AnomalyInnovations/serverless-stack-demo-client/tree/code-splitting-in-create-react-app).\n\n## Adding a Stylesheet\n\nThis project setup uses [Webpack](https://webpack.js.org/) for handling all assets. Webpack offers a custom way of “extending” the concept of `import` beyond JavaScript. To express that a JavaScript file depends on a CSS file, you need to **import the CSS from the JavaScript file**:\n\n### `Button.css`\n\n```css\n.Button {\n  padding: 20px;\n}\n```\n\n### `Button.js`\n\n```js\nimport React, { Component } from 'react';\nimport './Button.css'; // Tell Webpack that Button.js uses these styles\n\nclass Button extends Component {\n  render() {\n    // You can use them as regular CSS styles\n    return <div className=\"Button\" />;\n  }\n}\n```\n\n**This is not required for React** but many people find this feature convenient. You can read about the benefits of this approach [here](https://medium.com/seek-ui-engineering/block-element-modifying-your-javascript-components-d7f99fcab52b). However you should be aware that this makes your code less portable to other build tools and environments than Webpack.\n\nIn development, expressing dependencies this way allows your styles to be reloaded on the fly as you edit them. In production, all CSS files will be concatenated into a single minified `.css` file in the build output.\n\nIf you are concerned about using Webpack-specific semantics, you can put all your CSS right into `src/index.css`. It would still be imported from `src/index.js`, but you could always remove that import if you later migrate to a different build tool.\n\n## Post-Processing CSS\n\nThis project setup minifies your CSS and adds vendor prefixes to it automatically through [Autoprefixer](https://github.com/postcss/autoprefixer) so you don’t need to worry about it.\n\nFor example, this:\n\n```css\n.App {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n}\n```\n\nbecomes this:\n\n```css\n.App {\n  display: -webkit-box;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-box-orient: horizontal;\n  -webkit-box-direction: normal;\n  -ms-flex-direction: row;\n  flex-direction: row;\n  -webkit-box-align: center;\n  -ms-flex-align: center;\n  align-items: center;\n}\n```\n\nIf you need to disable autoprefixing for some reason, [follow this section](https://github.com/postcss/autoprefixer#disabling).\n\n## Adding a CSS Preprocessor (Sass, Less etc.)\n\nGenerally, we recommend that you don’t reuse the same CSS classes across different components. For example, instead of using a `.Button` CSS class in `<AcceptButton>` and `<RejectButton>` components, we recommend creating a `<Button>` component with its own `.Button` styles, that both `<AcceptButton>` and `<RejectButton>` can render (but [not inherit](https://facebook.github.io/react/docs/composition-vs-inheritance.html)).\n\nFollowing this rule often makes CSS preprocessors less useful, as features like mixins and nesting are replaced by component composition. You can, however, integrate a CSS preprocessor if you find it valuable. In this walkthrough, we will be using Sass, but you can also use Less, or another alternative.\n\nFirst, let’s install the command-line interface for Sass:\n\n```sh\nnpm install --save node-sass-chokidar\n```\n\nAlternatively you may use `yarn`:\n\n```sh\nyarn add node-sass-chokidar\n```\n\nThen in `package.json`, add the following lines to `scripts`:\n\n```diff\n   \"scripts\": {\n+    \"build-css\": \"node-sass-chokidar src/ -o src/\",\n+    \"watch-css\": \"npm run build-css && node-sass-chokidar src/ -o src/ --watch --recursive\",\n     \"start\": \"react-scripts start\",\n     \"build\": \"react-scripts build\",\n     \"test\": \"react-scripts test --env=jsdom\",\n```\n\n> Note: To use a different preprocessor, replace `build-css` and `watch-css` commands according to your preprocessor’s documentation.\n\nNow you can rename `src/App.css` to `src/App.scss` and run `npm run watch-css`. The watcher will find every Sass file in `src` subdirectories, and create a corresponding CSS file next to it, in our case overwriting `src/App.css`. Since `src/App.js` still imports `src/App.css`, the styles become a part of your application. You can now edit `src/App.scss`, and `src/App.css` will be regenerated.\n\nTo share variables between Sass files, you can use Sass imports. For example, `src/App.scss` and other component style files could include `@import \"./shared.scss\";` with variable definitions.\n\nTo enable importing files without using relative paths, you can add the `--include-path` option to the command in `package.json`.\n\n```\n\"build-css\": \"node-sass-chokidar --include-path ./src --include-path ./node_modules src/ -o src/\",\n\"watch-css\": \"npm run build-css && node-sass-chokidar --include-path ./src --include-path ./node_modules src/ -o src/ --watch --recursive\",\n```\n\nThis will allow you to do imports like\n\n```scss\n@import 'styles/_colors.scss'; // assuming a styles directory under src/\n@import 'nprogress/nprogress'; // importing a css file from the nprogress node module\n```\n\nAt this point you might want to remove all CSS files from the source control, and add `src/**/*.css` to your `.gitignore` file. It is generally a good practice to keep the build products outside of the source control.\n\nAs a final step, you may find it convenient to run `watch-css` automatically with `npm start`, and run `build-css` as a part of `npm run build`. You can use the `&&` operator to execute two scripts sequentially. However, there is no cross-platform way to run two scripts in parallel, so we will install a package for this:\n\n```sh\nnpm install --save npm-run-all\n```\n\nAlternatively you may use `yarn`:\n\n```sh\nyarn add npm-run-all\n```\n\nThen we can change `start` and `build` scripts to include the CSS preprocessor commands:\n\n```diff\n   \"scripts\": {\n     \"build-css\": \"node-sass-chokidar src/ -o src/\",\n     \"watch-css\": \"npm run build-css && node-sass-chokidar src/ -o src/ --watch --recursive\",\n-    \"start\": \"react-scripts start\",\n-    \"build\": \"react-scripts build\",\n+    \"start-js\": \"react-scripts start\",\n+    \"start\": \"npm-run-all -p watch-css start-js\",\n+    \"build\": \"npm run build-css && react-scripts build\",\n     \"test\": \"react-scripts test --env=jsdom\",\n     \"eject\": \"react-scripts eject\"\n   }\n```\n\nNow running `npm start` and `npm run build` also builds Sass files.\n\n**Why `node-sass-chokidar`?**\n\n`node-sass` has been reported as having the following issues:\n\n- `node-sass --watch` has been reported to have _performance issues_ in certain conditions when used in a virtual machine or with docker.\n\n- Infinite styles compiling [#1939](https://github.com/facebookincubator/create-react-app/issues/1939)\n\n- `node-sass` has been reported as having issues with detecting new files in a directory [#1891](https://github.com/sass/node-sass/issues/1891)\n\n`node-sass-chokidar` is used here as it addresses these issues.\n\n## Adding Images, Fonts, and Files\n\nWith Webpack, using static assets like images and fonts works similarly to CSS.\n\nYou can **`import` a file right in a JavaScript module**. This tells Webpack to include that file in the bundle. Unlike CSS imports, importing a file gives you a string value. This value is the final path you can reference in your code, e.g. as the `src` attribute of an image or the `href` of a link to a PDF.\n\nTo reduce the number of requests to the server, importing images that are less than 10,000 bytes returns a [data URI](https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/Data_URIs) instead of a path. This applies to the following file extensions: bmp, gif, jpg, jpeg, and png. SVG files are excluded due to [#1153](https://github.com/facebookincubator/create-react-app/issues/1153).\n\nHere is an example:\n\n```js\nimport React from 'react';\nimport logo from './logo.png'; // Tell Webpack this JS file uses this image\n\nconsole.log(logo); // /logo.84287d09.png\n\nfunction Header() {\n  // Import result is the URL of your image\n  return <img src={logo} alt=\"Logo\" />;\n}\n\nexport default Header;\n```\n\nThis ensures that when the project is built, Webpack will correctly move the images into the build folder, and provide us with correct paths.\n\nThis works in CSS too:\n\n```css\n.Logo {\n  background-image: url(./logo.png);\n}\n```\n\nWebpack finds all relative module references in CSS (they start with `./`) and replaces them with the final paths from the compiled bundle. If you make a typo or accidentally delete an important file, you will see a compilation error, just like when you import a non-existent JavaScript module. The final filenames in the compiled bundle are generated by Webpack from content hashes. If the file content changes in the future, Webpack will give it a different name in production so you don’t need to worry about long-term caching of assets.\n\nPlease be advised that this is also a custom feature of Webpack.\n\n**It is not required for React** but many people enjoy it (and React Native uses a similar mechanism for images).<br>\nAn alternative way of handling static assets is described in the next section.\n\n## Using the `public` Folder\n\n> Note: this feature is available with `react-scripts@0.5.0` and higher.\n\n### Changing the HTML\n\nThe `public` folder contains the HTML file so you can tweak it, for example, to [set the page title](#changing-the-page-title).\nThe `<script>` tag with the compiled code will be added to it automatically during the build process.\n\n### Adding Assets Outside of the Module System\n\nYou can also add other assets to the `public` folder.\n\nNote that we normally encourage you to `import` assets in JavaScript files instead.\nFor example, see the sections on [adding a stylesheet](#adding-a-stylesheet) and [adding images and fonts](#adding-images-fonts-and-files).\nThis mechanism provides a number of benefits:\n\n- Scripts and stylesheets get minified and bundled together to avoid extra network requests.\n- Missing files cause compilation errors instead of 404 errors for your users.\n- Result filenames include content hashes so you don’t need to worry about browsers caching their old versions.\n\nHowever there is an **escape hatch** that you can use to add an asset outside of the module system.\n\nIf you put a file into the `public` folder, it will **not** be processed by Webpack. Instead it will be copied into the build folder untouched. To reference assets in the `public` folder, you need to use a special variable called `PUBLIC_URL`.\n\nInside `index.html`, you can use it like this:\n\n```html\n<link rel=\"shortcut icon\" href=\"%PUBLIC_URL%/favicon.ico\" />\n```\n\nOnly files inside the `public` folder will be accessible by `%PUBLIC_URL%` prefix. If you need to use a file from `src` or `node_modules`, you’ll have to copy it there to explicitly specify your intention to make this file a part of the build.\n\nWhen you run `npm run build`, Create React App will substitute `%PUBLIC_URL%` with a correct absolute path so your project works even if you use client-side routing or host it at a non-root URL.\n\nIn JavaScript code, you can use `process.env.PUBLIC_URL` for similar purposes:\n\n```js\nrender() {\n  // Note: this is an escape hatch and should be used sparingly!\n  // Normally we recommend using `import` for getting asset URLs\n  // as described in “Adding Images and Fonts” above this section.\n  return <img src={process.env.PUBLIC_URL + '/img/logo.png'} />;\n}\n```\n\nKeep in mind the downsides of this approach:\n\n- None of the files in `public` folder get post-processed or minified.\n- Missing files will not be called at compilation time, and will cause 404 errors for your users.\n- Result filenames won’t include content hashes so you’ll need to add query arguments or rename them every time they change.\n\n### When to Use the `public` Folder\n\nNormally we recommend importing [stylesheets](#adding-a-stylesheet), [images, and fonts](#adding-images-fonts-and-files) from JavaScript.\nThe `public` folder is useful as a workaround for a number of less common cases:\n\n- You need a file with a specific name in the build output, such as [`manifest.webmanifest`](https://developer.mozilla.org/en-US/docs/Web/Manifest).\n- You have thousands of images and need to dynamically reference their paths.\n- You want to include a small script like [`pace.js`](http://github.hubspot.com/pace/docs/welcome/) outside of the bundled code.\n- Some library may be incompatible with Webpack and you have no other option but to include it as a `<script>` tag.\n\nNote that if you add a `<script>` that declares global variables, you also need to read the next section on using them.\n\n## Using Global Variables\n\nWhen you include a script in the HTML file that defines global variables and try to use one of these variables in the code, the linter will complain because it cannot see the definition of the variable.\n\nYou can avoid this by reading the global variable explicitly from the `window` object, for example:\n\n```js\nconst $ = window.$;\n```\n\nThis makes it obvious you are using a global variable intentionally rather than because of a typo.\n\nAlternatively, you can force the linter to ignore any line by adding `// eslint-disable-line` after it.\n\n## Adding Bootstrap\n\nYou don’t have to use [React Bootstrap](https://react-bootstrap.github.io) together with React but it is a popular library for integrating Bootstrap with React apps. If you need it, you can integrate it with Create React App by following these steps:\n\nInstall React Bootstrap and Bootstrap from npm. React Bootstrap does not include Bootstrap CSS so this needs to be installed as well:\n\n```sh\nnpm install --save react-bootstrap bootstrap@3\n```\n\nAlternatively you may use `yarn`:\n\n```sh\nyarn add react-bootstrap bootstrap@3\n```\n\nImport Bootstrap CSS and optionally Bootstrap theme CSS in the beginning of your `src/index.js` file:\n\n```js\nimport 'bootstrap/dist/css/bootstrap.css';\nimport 'bootstrap/dist/css/bootstrap-theme.css';\n// Put any other imports below so that CSS from your\n// components takes precedence over default styles.\n```\n\nImport required React Bootstrap components within `src/App.js` file or your custom component files:\n\n```js\nimport { Navbar, Jumbotron, Button } from 'react-bootstrap';\n```\n\nNow you are ready to use the imported React Bootstrap components within your component hierarchy defined in the render method. Here is an example [`App.js`](https://gist.githubusercontent.com/gaearon/85d8c067f6af1e56277c82d19fd4da7b/raw/6158dd991b67284e9fc8d70b9d973efe87659d72/App.js) redone using React Bootstrap.\n\n### Using a Custom Theme\n\nSometimes you might need to tweak the visual styles of Bootstrap (or equivalent package).<br>\nWe suggest the following approach:\n\n- Create a new package that depends on the package you wish to customize, e.g. Bootstrap.\n- Add the necessary build steps to tweak the theme, and publish your package on npm.\n- Install your own theme npm package as a dependency of your app.\n\nHere is an example of adding a [customized Bootstrap](https://medium.com/@tacomanator/customizing-create-react-app-aa9ffb88165) that follows these steps.\n\n## Adding Flow\n\nFlow is a static type checker that helps you write code with fewer bugs. Check out this [introduction to using static types in JavaScript](https://medium.com/@preethikasireddy/why-use-static-types-in-javascript-part-1-8382da1e0adb) if you are new to this concept.\n\nRecent versions of [Flow](http://flowtype.org/) work with Create React App projects out of the box.\n\nTo add Flow to a Create React App project, follow these steps:\n\n1. Run `npm install --save flow-bin` (or `yarn add flow-bin`).\n2. Add `\"flow\": \"flow\"` to the `scripts` section of your `package.json`.\n3. Run `npm run flow init` (or `yarn flow init`) to create a [`.flowconfig` file](https://flowtype.org/docs/advanced-configuration.html) in the root directory.\n4. Add `// @flow` to any files you want to type check (for example, to `src/App.js`).\n\nNow you can run `npm run flow` (or `yarn flow`) to check the files for type errors.\nYou can optionally use an IDE like [Nuclide](https://nuclide.io/docs/languages/flow/) for a better integrated experience.\nIn the future we plan to integrate it into Create React App even more closely.\n\nTo learn more about Flow, check out [its documentation](https://flowtype.org/).\n\n## Adding Custom Environment Variables\n\n> Note: this feature is available with `react-scripts@0.2.3` and higher.\n\nYour project can consume variables declared in your environment as if they were declared locally in your JS files. By\ndefault you will have `NODE_ENV` defined for you, and any other environment variables starting with\n`REACT_APP_`.\n\n**The environment variables are embedded during the build time**. Since Create React App produces a static HTML/CSS/JS bundle, it can’t possibly read them at runtime. To read them at runtime, you would need to load HTML into memory on the server and replace placeholders in runtime, just like [described here](#injecting-data-from-the-server-into-the-page). Alternatively you can rebuild the app on the server anytime you change them.\n\n> Note: You must create custom environment variables beginning with `REACT_APP_`. Any other variables except `NODE_ENV` will be ignored to avoid accidentally [exposing a private key on the machine that could have the same name](https://github.com/facebookincubator/create-react-app/issues/865#issuecomment-252199527). Changing any environment variables will require you to restart the development server if it is running.\n\nThese environment variables will be defined for you on `process.env`. For example, having an environment\nvariable named `REACT_APP_SECRET_CODE` will be exposed in your JS as `process.env.REACT_APP_SECRET_CODE`.\n\nThere is also a special built-in environment variable called `NODE_ENV`. You can read it from `process.env.NODE_ENV`. When you run `npm start`, it is always equal to `'development'`, when you run `npm test` it is always equal to `'test'`, and when you run `npm run build` to make a production bundle, it is always equal to `'production'`. **You cannot override `NODE_ENV` manually.** This prevents developers from accidentally deploying a slow development build to production.\n\nThese environment variables can be useful for displaying information conditionally based on where the project is\ndeployed or consuming sensitive data that lives outside of version control.\n\nFirst, you need to have environment variables defined. For example, let’s say you wanted to consume a secret defined\nin the environment inside a `<form>`:\n\n```jsx\nrender() {\n  return (\n    <div>\n      <small>You are running this application in <b>{process.env.NODE_ENV}</b> mode.</small>\n      <form>\n        <input type=\"hidden\" defaultValue={process.env.REACT_APP_SECRET_CODE} />\n      </form>\n    </div>\n  );\n}\n```\n\nDuring the build, `process.env.REACT_APP_SECRET_CODE` will be replaced with the current value of the `REACT_APP_SECRET_CODE` environment variable. Remember that the `NODE_ENV` variable will be set for you automatically.\n\nWhen you load the app in the browser and inspect the `<input>`, you will see its value set to `abcdef`, and the bold text will show the environment provided when using `npm start`:\n\n```html\n<div>\n  <small>You are running this application in <b>development</b> mode.</small>\n  <form>\n    <input type=\"hidden\" value=\"abcdef\" />\n  </form>\n</div>\n```\n\nThe above form is looking for a variable called `REACT_APP_SECRET_CODE` from the environment. In order to consume this\nvalue, we need to have it defined in the environment. This can be done using two ways: either in your shell or in\na `.env` file. Both of these ways are described in the next few sections.\n\nHaving access to the `NODE_ENV` is also useful for performing actions conditionally:\n\n```js\nif (process.env.NODE_ENV !== 'production') {\n  analytics.disable();\n}\n```\n\nWhen you compile the app with `npm run build`, the minification step will strip out this condition, and the resulting bundle will be smaller.\n\n### Referencing Environment Variables in the HTML\n\n> Note: this feature is available with `react-scripts@0.9.0` and higher.\n\nYou can also access the environment variables starting with `REACT_APP_` in the `public/index.html`. For example:\n\n```html\n<title>%REACT_APP_WEBSITE_NAME%</title>\n```\n\nNote that the caveats from the above section apply:\n\n- Apart from a few built-in variables (`NODE_ENV` and `PUBLIC_URL`), variable names must start with `REACT_APP_` to work.\n- The environment variables are injected at build time. If you need to inject them at runtime, [follow this approach instead](#generating-dynamic-meta-tags-on-the-server).\n\n### Adding Temporary Environment Variables In Your Shell\n\nDefining environment variables can vary between OSes. It’s also important to know that this manner is temporary for the\nlife of the shell session.\n\n#### Windows (cmd.exe)\n\n```cmd\nset REACT_APP_SECRET_CODE=abcdef&&npm start\n```\n\n(Note: the lack of whitespace is intentional.)\n\n#### Linux, macOS (Bash)\n\n```bash\nREACT_APP_SECRET_CODE=abcdef npm start\n```\n\n### Adding Development Environment Variables In `.env`\n\n> Note: this feature is available with `react-scripts@0.5.0` and higher.\n\nTo define permanent environment variables, create a file called `.env` in the root of your project:\n\n```\nREACT_APP_SECRET_CODE=abcdef\n```\n\n`.env` files **should be** checked into source control (with the exclusion of `.env*.local`).\n\n#### What other `.env` files can be used?\n\n> Note: this feature is **available with `react-scripts@1.0.0` and higher**.\n\n- `.env`: Default.\n- `.env.local`: Local overrides. **This file is loaded for all environments except test.**\n- `.env.development`, `.env.test`, `.env.production`: Environment-specific settings.\n- `.env.development.local`, `.env.test.local`, `.env.production.local`: Local overrides of environment-specific settings.\n\nFiles on the left have more priority than files on the right:\n\n- `npm start`: `.env.development.local`, `.env.development`, `.env.local`, `.env`\n- `npm run build`: `.env.production.local`, `.env.production`, `.env.local`, `.env`\n- `npm test`: `.env.test.local`, `.env.test`, `.env` (note `.env.local` is missing)\n\nThese variables will act as the defaults if the machine does not explicitly set them.<br>\nPlease refer to the [dotenv documentation](https://github.com/motdotla/dotenv) for more details.\n\n> Note: If you are defining environment variables for development, your CI and/or hosting platform will most likely need\n> these are defined as well. Consult their documentation how to do this. For example, see the documentation for [Travis CI](https://docs.travis-ci.com/user/environment-variables/) or [Heroku](https://devcenter.heroku.com/articles/config-vars).\n\n## Can I Use Decorators?\n\nMany popular libraries use [decorators](https://medium.com/google-developers/exploring-es7-decorators-76ecb65fb841) in their documentation.<br>\nCreate React App doesn’t support decorator syntax at the moment because:\n\n- It is an experimental proposal and is subject to change.\n- The current specification version is not officially supported by Babel.\n- If the specification changes, we won’t be able to write a codemod because we don’t use them internally at Facebook.\n\nHowever in many cases you can rewrite decorator-based code without decorators just as fine.<br>\nPlease refer to these two threads for reference:\n\n- [#214](https://github.com/facebookincubator/create-react-app/issues/214)\n- [#411](https://github.com/facebookincubator/create-react-app/issues/411)\n\nCreate React App will add decorator support when the specification advances to a stable stage.\n\n## Integrating with an API Backend\n\nThese tutorials will help you to integrate your app with an API backend running on another port,\nusing `fetch()` to access it.\n\n### Node\n\nCheck out [this tutorial](https://www.fullstackreact.com/articles/using-create-react-app-with-a-server/).\nYou can find the companion GitHub repository [here](https://github.com/fullstackreact/food-lookup-demo).\n\n### Ruby on Rails\n\nCheck out [this tutorial](https://www.fullstackreact.com/articles/how-to-get-create-react-app-to-work-with-your-rails-api/).\nYou can find the companion GitHub repository [here](https://github.com/fullstackreact/food-lookup-demo-rails).\n\n## Proxying API Requests in Development\n\n> Note: this feature is available with `react-scripts@0.2.3` and higher.\n\nPeople often serve the front-end React app from the same host and port as their backend implementation.<br>\nFor example, a production setup might look like this after the app is deployed:\n\n```\n/             - static server returns index.html with React app\n/todos        - static server returns index.html with React app\n/api/todos    - server handles any /api/* requests using the backend implementation\n```\n\nSuch setup is **not** required. However, if you **do** have a setup like this, it is convenient to write requests like `fetch('/api/todos')` without worrying about redirecting them to another host or port during development.\n\nTo tell the development server to proxy any unknown requests to your API server in development, add a `proxy` field to your `package.json`, for example:\n\n```js\n  \"proxy\": \"http://localhost:4000\",\n```\n\nThis way, when you `fetch('/api/todos')` in development, the development server will recognize that it’s not a static asset, and will proxy your request to `http://localhost:4000/api/todos` as a fallback. The development server will only attempt to send requests without a `text/html` accept header to the proxy.\n\nConveniently, this avoids [CORS issues](http://stackoverflow.com/questions/21854516/understanding-ajax-cors-and-security-considerations) and error messages like this in development:\n\n```\nFetch API cannot load http://localhost:4000/api/todos. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:3000' is therefore not allowed access. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.\n```\n\nKeep in mind that `proxy` only has effect in development (with `npm start`), and it is up to you to ensure that URLs like `/api/todos` point to the right thing in production. You don’t have to use the `/api` prefix. Any unrecognized request without a `text/html` accept header will be redirected to the specified `proxy`.\n\nThe `proxy` option supports HTTP, HTTPS and WebSocket connections.<br>\nIf the `proxy` option is **not** flexible enough for you, alternatively you can:\n\n- [Configure the proxy yourself](#configuring-the-proxy-manually)\n- Enable CORS on your server ([here’s how to do it for Express](http://enable-cors.org/server_expressjs.html)).\n- Use [environment variables](#adding-custom-environment-variables) to inject the right server host and port into your app.\n\n### \"Invalid Host Header\" Errors After Configuring Proxy\n\nWhen you enable the `proxy` option, you opt into a more strict set of host checks. This is necessary because leaving the backend open to remote hosts makes your computer vulnerable to DNS rebinding attacks. The issue is explained in [this article](https://medium.com/webpack/webpack-dev-server-middleware-security-issues-1489d950874a) and [this issue](https://github.com/webpack/webpack-dev-server/issues/887).\n\nThis shouldn’t affect you when developing on `localhost`, but if you develop remotely like [described here](https://github.com/facebookincubator/create-react-app/issues/2271), you will see this error in the browser after enabling the `proxy` option:\n\n> Invalid Host header\n\nTo work around it, you can specify your public development host in a file called `.env.development` in the root of your project:\n\n```\nHOST=mypublicdevhost.com\n```\n\nIf you restart the development server now and load the app from the specified host, it should work.\n\nIf you are still having issues or if you’re using a more exotic environment like a cloud editor, you can bypass the host check completely by adding a line to `.env.development.local`. **Note that this is dangerous and exposes your machine to remote code execution from malicious websites:**\n\n```\n# NOTE: THIS IS DANGEROUS!\n# It exposes your machine to attacks from the websites you visit.\nDANGEROUSLY_DISABLE_HOST_CHECK=true\n```\n\nWe don’t recommend this approach.\n\n### Configuring the Proxy Manually\n\n> Note: this feature is available with `react-scripts@1.0.0` and higher.\n\nIf the `proxy` option is **not** flexible enough for you, you can specify an object in the following form (in `package.json`).<br>\nYou may also specify any configuration value [`http-proxy-middleware`](https://github.com/chimurai/http-proxy-middleware#options) or [`http-proxy`](https://github.com/nodejitsu/node-http-proxy#options) supports.\n\n```js\n{\n  // ...\n  \"proxy\": {\n    \"/api\": {\n      \"target\": \"<url>\",\n      \"ws\": true\n      // ...\n    }\n  }\n  // ...\n}\n```\n\nAll requests matching this path will be proxies, no exceptions. This includes requests for `text/html`, which the standard `proxy` option does not proxy.\n\nIf you need to specify multiple proxies, you may do so by specifying additional entries.\nYou may also narrow down matches using `*` and/or `**`, to match the path exactly or any subpath.\n\n```js\n{\n  // ...\n  \"proxy\": {\n    // Matches any request starting with /api\n    \"/api\": {\n      \"target\": \"<url_1>\",\n      \"ws\": true\n      // ...\n    },\n    // Matches any request starting with /foo\n    \"/foo\": {\n      \"target\": \"<url_2>\",\n      \"ssl\": true,\n      \"pathRewrite\": {\n        \"^/foo\": \"/foo/beta\"\n      }\n      // ...\n    },\n    // Matches /bar/abc.html but not /bar/sub/def.html\n    \"/bar/*.html\": {\n      \"target\": \"<url_3>\",\n      // ...\n    },\n    // Matches /baz/abc.html and /baz/sub/def.html\n    \"/baz/**/*.html\": {\n      \"target\": \"<url_4>\"\n      // ...\n    }\n  }\n  // ...\n}\n```\n\n### Configuring a WebSocket Proxy\n\nWhen setting up a WebSocket proxy, there are some extra considerations to be aware of.\n\nIf you’re using a WebSocket engine like [Socket.io](https://socket.io/), you must have a Socket.io server running that you can use as the proxy target. Socket.io will not work with a standard WebSocket server. Specifically, don't expect Socket.io to work with [the websocket.org echo test](http://websocket.org/echo.html).\n\nThere’s some good documentation available for [setting up a Socket.io server](https://socket.io/docs/).\n\nStandard WebSockets **will** work with a standard WebSocket server as well as the websocket.org echo test. You can use libraries like [ws](https://github.com/websockets/ws) for the server, with [native WebSockets in the browser](https://developer.mozilla.org/en-US/docs/Web/API/WebSocket).\n\nEither way, you can proxy WebSocket requests manually in `package.json`:\n\n```js\n{\n  // ...\n  \"proxy\": {\n    \"/socket\": {\n      // Your compatible WebSocket server\n      \"target\": \"ws://<socket_url>\",\n      // Tell http-proxy-middleware that this is a WebSocket proxy.\n      // Also allows you to proxy WebSocket requests without an additional HTTP request\n      // https://github.com/chimurai/http-proxy-middleware#external-websocket-upgrade\n      \"ws\": true\n      // ...\n    }\n  }\n  // ...\n}\n```\n\n## Using HTTPS in Development\n\n> Note: this feature is available with `react-scripts@0.4.0` and higher.\n\nYou may require the dev server to serve pages over HTTPS. One particular case where this could be useful is when using [the \"proxy\" feature](#proxying-api-requests-in-development) to proxy requests to an API server when that API server is itself serving HTTPS.\n\nTo do this, set the `HTTPS` environment variable to `true`, then start the dev server as usual with `npm start`:\n\n#### Windows (cmd.exe)\n\n```cmd\nset HTTPS=true&&npm start\n```\n\n(Note: the lack of whitespace is intentional.)\n\n#### Linux, macOS (Bash)\n\n```bash\nHTTPS=true npm start\n```\n\nNote that the server will use a self-signed certificate, so your web browser will almost definitely display a warning upon accessing the page.\n\n## Generating Dynamic `<meta>` Tags on the Server\n\nSince Create React App doesn’t support server rendering, you might be wondering how to make `<meta>` tags dynamic and reflect the current URL. To solve this, we recommend to add placeholders into the HTML, like this:\n\n```html\n<!doctype html>\n<html lang=\"en\">\n  <head>\n    <meta property=\"og:title\" content=\"__OG_TITLE__\" />\n    <meta property=\"og:description\" content=\"__OG_DESCRIPTION__\" />\n  </head>\n</html>\n```\n\nThen, on the server, regardless of the backend you use, you can read `index.html` into memory and replace `__OG_TITLE__`, `__OG_DESCRIPTION__`, and any other placeholders with values depending on the current URL. Just make sure to sanitize and escape the interpolated values so that they are safe to embed into HTML!\n\nIf you use a Node server, you can even share the route matching logic between the client and the server. However duplicating it also works fine in simple cases.\n\n## Pre-Rendering into Static HTML Files\n\nIf you’re hosting your `build` with a static hosting provider you can use [react-snapshot](https://www.npmjs.com/package/react-snapshot) to generate HTML pages for each route, or relative link, in your application. These pages will then seamlessly become active, or “hydrated”, when the JavaScript bundle has loaded.\n\nThere are also opportunities to use this outside of static hosting, to take the pressure off the server when generating and caching routes.\n\nThe primary benefit of pre-rendering is that you get the core content of each page _with_ the HTML payload—regardless of whether or not your JavaScript bundle successfully downloads. It also increases the likelihood that each route of your application will be picked up by search engines.\n\nYou can read more about [zero-configuration pre-rendering (also called snapshotting) here](https://medium.com/superhighfives/an-almost-static-stack-6df0a2791319).\n\n## Injecting Data from the Server into the Page\n\nSimilarly to the previous section, you can leave some placeholders in the HTML that inject global variables, for example:\n\n```js\n<!doctype html>\n<html lang=\"en\">\n  <head>\n    <script>\n      window.SERVER_DATA = __SERVER_DATA__;\n    </script>\n```\n\nThen, on the server, you can replace `__SERVER_DATA__` with a JSON of real data right before sending the response. The client code can then read `window.SERVER_DATA` to use it. **Make sure to [sanitize the JSON before sending it to the client](https://medium.com/node-security/the-most-common-xss-vulnerability-in-react-js-applications-2bdffbcc1fa0) as it makes your app vulnerable to XSS attacks.**\n\n## Running Tests\n\n> Note: this feature is available with `react-scripts@0.3.0` and higher.<br> >[Read the migration guide to learn how to enable it in older projects!](https://github.com/facebookincubator/create-react-app/blob/master/CHANGELOG.md#migrating-from-023-to-030)\n\nCreate React App uses [Jest](https://facebook.github.io/jest/) as its test runner. To prepare for this integration, we did a [major revamp](https://facebook.github.io/jest/blog/2016/09/01/jest-15.html) of Jest so if you heard bad things about it years ago, give it another try.\n\nJest is a Node-based runner. This means that the tests always run in a Node environment and not in a real browser. This lets us enable fast iteration speed and prevent flakiness.\n\nWhile Jest provides browser globals such as `window` thanks to [jsdom](https://github.com/tmpvar/jsdom), they are only approximations of the real browser behavior. Jest is intended to be used for unit tests of your logic and your components rather than the DOM quirks.\n\nWe recommend that you use a separate tool for browser end-to-end tests if you need them. They are beyond the scope of Create React App.\n\n### Filename Conventions\n\nJest will look for test files with any of the following popular naming conventions:\n\n- Files with `.js` suffix in `__tests__` folders.\n- Files with `.test.js` suffix.\n- Files with `.spec.js` suffix.\n\nThe `.test.js` / `.spec.js` files (or the `__tests__` folders) can be located at any depth under the `src` top level folder.\n\nWe recommend to put the test files (or `__tests__` folders) next to the code they are testing so that relative imports appear shorter. For example, if `App.test.js` and `App.js` are in the same folder, the test just needs to `import App from './App'` instead of a long relative path. Colocation also helps find tests more quickly in larger projects.\n\n### Command Line Interface\n\nWhen you run `npm test`, Jest will launch in the watch mode. Every time you save a file, it will re-run the tests, just like `npm start` recompiles the code.\n\nThe watcher includes an interactive command-line interface with the ability to run all tests, or focus on a search pattern. It is designed this way so that you can keep it open and enjoy fast re-runs. You can learn the commands from the “Watch Usage” note that the watcher prints after every run:\n\n![Jest watch mode](http://facebook.github.io/jest/img/blog/15-watch.gif)\n\n### Version Control Integration\n\nBy default, when you run `npm test`, Jest will only run the tests related to files changed since the last commit. This is an optimization designed to make your tests run fast regardless of how many tests you have. However it assumes that you don’t often commit the code that doesn’t pass the tests.\n\nJest will always explicitly mention that it only ran tests related to the files changed since the last commit. You can also press `a` in the watch mode to force Jest to run all tests.\n\nJest will always run all tests on a [continuous integration](#continuous-integration) server or if the project is not inside a Git or Mercurial repository.\n\n### Writing Tests\n\nTo create tests, add `it()` (or `test()`) blocks with the name of the test and its code. You may optionally wrap them in `describe()` blocks for logical grouping but this is neither required nor recommended.\n\nJest provides a built-in `expect()` global function for making assertions. A basic test could look like this:\n\n```js\nimport sum from './sum';\n\nit('sums numbers', () => {\n  expect(sum(1, 2)).toEqual(3);\n  expect(sum(2, 2)).toEqual(4);\n});\n```\n\nAll `expect()` matchers supported by Jest are [extensively documented here](http://facebook.github.io/jest/docs/expect.html).<br>\nYou can also use [`jest.fn()` and `expect(fn).toBeCalled()`](http://facebook.github.io/jest/docs/expect.html#tohavebeencalled) to create “spies” or mock functions.\n\n### Testing Components\n\nThere is a broad spectrum of component testing techniques. They range from a “smoke test” verifying that a component renders without throwing, to shallow rendering and testing some of the output, to full rendering and testing component lifecycle and state changes.\n\nDifferent projects choose different testing tradeoffs based on how often components change, and how much logic they contain. If you haven’t decided on a testing strategy yet, we recommend that you start with creating simple smoke tests for your components:\n\n```js\nimport React from 'react';\nimport ReactDOM from 'react-dom';\nimport App from './App';\n\nit('renders without crashing', () => {\n  const div = document.createElement('div');\n  ReactDOM.render(<App />, div);\n});\n```\n\nThis test mounts a component and makes sure that it didn’t throw during rendering. Tests like this provide a lot value with very little effort so they are great as a starting point, and this is the test you will find in `src/App.test.js`.\n\nWhen you encounter bugs caused by changing components, you will gain a deeper insight into which parts of them are worth testing in your application. This might be a good time to introduce more specific tests asserting specific expected output or behavior.\n\nIf you’d like to test components in isolation from the child components they render, we recommend using [`shallow()` rendering API](http://airbnb.io/enzyme/docs/api/shallow.html) from [Enzyme](http://airbnb.io/enzyme/). To install it, run:\n\n```sh\nnpm install --save enzyme react-test-renderer\n```\n\nAlternatively you may use `yarn`:\n\n```sh\nyarn add enzyme react-test-renderer\n```\n\nYou can write a smoke test with it too:\n\n```js\nimport React from 'react';\nimport { shallow } from 'enzyme';\nimport App from './App';\n\nit('renders without crashing', () => {\n  shallow(<App />);\n});\n```\n\nUnlike the previous smoke test using `ReactDOM.render()`, this test only renders `<App>` and doesn’t go deeper. For example, even if `<App>` itself renders a `<Button>` that throws, this test will pass. Shallow rendering is great for isolated unit tests, but you may still want to create some full rendering tests to ensure the components integrate correctly. Enzyme supports [full rendering with `mount()`](http://airbnb.io/enzyme/docs/api/mount.html), and you can also use it for testing state changes and component lifecycle.\n\nYou can read the [Enzyme documentation](http://airbnb.io/enzyme/) for more testing techniques. Enzyme documentation uses Chai and Sinon for assertions but you don’t have to use them because Jest provides built-in `expect()` and `jest.fn()` for spies.\n\nHere is an example from Enzyme documentation that asserts specific output, rewritten to use Jest matchers:\n\n```js\nimport React from 'react';\nimport { shallow } from 'enzyme';\nimport App from './App';\n\nit('renders welcome message', () => {\n  const wrapper = shallow(<App />);\n  const welcome = <h2>Welcome to React</h2>;\n  // expect(wrapper.contains(welcome)).to.equal(true);\n  expect(wrapper.contains(welcome)).toEqual(true);\n});\n```\n\nAll Jest matchers are [extensively documented here](http://facebook.github.io/jest/docs/expect.html).<br>\nNevertheless you can use a third-party assertion library like [Chai](http://chaijs.com/) if you want to, as described below.\n\nAdditionally, you might find [jest-enzyme](https://github.com/blainekasten/enzyme-matchers) helpful to simplify your tests with readable matchers. The above `contains` code can be written simpler with jest-enzyme.\n\n```js\nexpect(wrapper).toContainReact(welcome);\n```\n\nTo enable this, install `jest-enzyme`:\n\n```sh\nnpm install --save jest-enzyme\n```\n\nAlternatively you may use `yarn`:\n\n```sh\nyarn add jest-enzyme\n```\n\nImport it in [`src/setupTests.js`](#initializing-test-environment) to make its matchers available in every test:\n\n```js\nimport 'jest-enzyme';\n```\n\n### Using Third Party Assertion Libraries\n\nWe recommend that you use `expect()` for assertions and `jest.fn()` for spies. If you are having issues with them please [file those against Jest](https://github.com/facebook/jest/issues/new), and we’ll fix them. We intend to keep making them better for React, supporting, for example, [pretty-printing React elements as JSX](https://github.com/facebook/jest/pull/1566).\n\nHowever, if you are used to other libraries, such as [Chai](http://chaijs.com/) and [Sinon](http://sinonjs.org/), or if you have existing code using them that you’d like to port over, you can import them normally like this:\n\n```js\nimport sinon from 'sinon';\nimport { expect } from 'chai';\n```\n\nand then use them in your tests like you normally do.\n\n### Initializing Test Environment\n\n> Note: this feature is available with `react-scripts@0.4.0` and higher.\n\nIf your app uses a browser API that you need to mock in your tests or if you just need a global setup before running your tests, add a `src/setupTests.js` to your project. It will be automatically executed before running your tests.\n\nFor example:\n\n#### `src/setupTests.js`\n\n```js\nconst localStorageMock = {\n  getItem: jest.fn(),\n  setItem: jest.fn(),\n  clear: jest.fn(),\n};\nglobal.localStorage = localStorageMock;\n```\n\n### Focusing and Excluding Tests\n\nYou can replace `it()` with `xit()` to temporarily exclude a test from being executed.<br>\nSimilarly, `fit()` lets you focus on a specific test without running any other tests.\n\n### Coverage Reporting\n\nJest has an integrated coverage reporter that works well with ES6 and requires no configuration.<br>\nRun `npm test -- --coverage` (note extra `--` in the middle) to include a coverage report like this:\n\n![coverage report](http://i.imgur.com/5bFhnTS.png)\n\nNote that tests run much slower with coverage so it is recommended to run it separately from your normal workflow.\n\n### Continuous Integration\n\nBy default `npm test` runs the watcher with interactive CLI. However, you can force it to run tests once and finish the process by setting an environment variable called `CI`.\n\nWhen creating a build of your application with `npm run build` linter warnings are not checked by default. Like `npm test`, you can force the build to perform a linter warning check by setting the environment variable `CI`. If any warnings are encountered then the build fails.\n\nPopular CI servers already set the environment variable `CI` by default but you can do this yourself too:\n\n### On CI servers\n\n#### Travis CI\n\n1. Following the [Travis Getting started](https://docs.travis-ci.com/user/getting-started/) guide for syncing your GitHub repository with Travis. You may need to initialize some settings manually in your [profile](https://travis-ci.org/profile) page.\n1. Add a `.travis.yml` file to your git repository.\n\n```\nlanguage: node_js\nnode_js:\n  - 6\ncache:\n  directories:\n    - node_modules\nscript:\n  - npm run build\n  - npm test\n```\n\n1. Trigger your first build with a git push.\n1. [Customize your Travis CI Build](https://docs.travis-ci.com/user/customizing-the-build/) if needed.\n\n#### CircleCI\n\nFollow [this article](https://medium.com/@knowbody/circleci-and-zeits-now-sh-c9b7eebcd3c1) to set up CircleCI with a Create React App project.\n\n### On your own environment\n\n##### Windows (cmd.exe)\n\n```cmd\nset CI=true&&npm test\n```\n\n```cmd\nset CI=true&&npm run build\n```\n\n(Note: the lack of whitespace is intentional.)\n\n##### Linux, macOS (Bash)\n\n```bash\nCI=true npm test\n```\n\n```bash\nCI=true npm run build\n```\n\nThe test command will force Jest to run tests once instead of launching the watcher.\n\n> If you find yourself doing this often in development, please [file an issue](https://github.com/facebookincubator/create-react-app/issues/new) to tell us about your use case because we want to make watcher the best experience and are open to changing how it works to accommodate more workflows.\n\nThe build command will check for linter warnings and fail if any are found.\n\n### Disabling jsdom\n\nBy default, the `package.json` of the generated project looks like this:\n\n```js\n  \"scripts\": {\n    \"start\": \"react-scripts start\",\n    \"build\": \"react-scripts build\",\n    \"test\": \"react-scripts test --env=jsdom\"\n```\n\nIf you know that none of your tests depend on [jsdom](https://github.com/tmpvar/jsdom), you can safely remove `--env=jsdom`, and your tests will run faster:\n\n```diff\n  \"scripts\": {\n    \"start\": \"react-scripts start\",\n    \"build\": \"react-scripts build\",\n-   \"test\": \"react-scripts test --env=jsdom\"\n+   \"test\": \"react-scripts test\"\n```\n\nTo help you make up your mind, here is a list of APIs that **need jsdom**:\n\n- Any browser globals like `window` and `document`\n- [`ReactDOM.render()`](https://facebook.github.io/react/docs/top-level-api.html#reactdom.render)\n- [`TestUtils.renderIntoDocument()`](https://facebook.github.io/react/docs/test-utils.html#renderintodocument) ([a shortcut](https://github.com/facebook/react/blob/34761cf9a252964abfaab6faf74d473ad95d1f21/src/test/ReactTestUtils.js#L83-L91) for the above)\n- [`mount()`](http://airbnb.io/enzyme/docs/api/mount.html) in [Enzyme](http://airbnb.io/enzyme/index.html)\n\nIn contrast, **jsdom is not needed** for the following APIs:\n\n- [`TestUtils.createRenderer()`](https://facebook.github.io/react/docs/test-utils.html#shallow-rendering) (shallow rendering)\n- [`shallow()`](http://airbnb.io/enzyme/docs/api/shallow.html) in [Enzyme](http://airbnb.io/enzyme/index.html)\n\nFinally, jsdom is also not needed for [snapshot testing](http://facebook.github.io/jest/blog/2016/07/27/jest-14.html).\n\n### Snapshot Testing\n\nSnapshot testing is a feature of Jest that automatically generates text snapshots of your components and saves them on the disk so if the UI output changes, you get notified without manually writing any assertions on the component output. [Read more about snapshot testing.](http://facebook.github.io/jest/blog/2016/07/27/jest-14.html)\n\n### Editor Integration\n\nIf you use [Visual Studio Code](https://code.visualstudio.com), there is a [Jest extension](https://github.com/orta/vscode-jest) which works with Create React App out of the box. This provides a lot of IDE-like features while using a text editor: showing the status of a test run with potential fail messages inline, starting and stopping the watcher automatically, and offering one-click snapshot updates.\n\n![VS Code Jest Preview](https://cloud.githubusercontent.com/assets/49038/20795349/a032308a-b7c8-11e6-9b34-7eeac781003f.png)\n\n## Developing Components in Isolation\n\nUsually, in an app, you have a lot of UI components, and each of them has many different states.\nFor an example, a simple button component could have following states:\n\n- In a regular state, with a text label.\n- In the disabled mode.\n- In a loading state.\n\nUsually, it’s hard to see these states without running a sample app or some examples.\n\nCreate React App doesn’t include any tools for this by default, but you can easily add [Storybook for React](https://storybook.js.org) ([source](https://github.com/storybooks/storybook)) or [React Styleguidist](https://react-styleguidist.js.org/) ([source](https://github.com/styleguidist/react-styleguidist)) to your project. **These are third-party tools that let you develop components and see all their states in isolation from your app**.\n\n![Storybook for React Demo](http://i.imgur.com/7CIAWpB.gif)\n\nYou can also deploy your Storybook or style guide as a static app. This way, everyone in your team can view and review different states of UI components without starting a backend server or creating an account in your app.\n\n### Getting Started with Storybook\n\nStorybook is a development environment for React UI components. It allows you to browse a component library, view the different states of each component, and interactively develop and test components.\n\nFirst, install the following npm package globally:\n\n```sh\nnpm install -g @storybook/cli\n```\n\nThen, run the following command inside your app’s directory:\n\n```sh\ngetstorybook\n```\n\nAfter that, follow the instructions on the screen.\n\nLearn more about React Storybook:\n\n- Screencast: [Getting Started with React Storybook](https://egghead.io/lessons/react-getting-started-with-react-storybook)\n- [GitHub Repo](https://github.com/storybooks/storybook)\n- [Documentation](https://storybook.js.org/basics/introduction/)\n- [Snapshot Testing UI](https://github.com/storybooks/storybook/tree/master/addons/storyshots) with Storybook + addon/storyshot\n\n### Getting Started with Styleguidist\n\nStyleguidist combines a style guide, where all your components are presented on a single page with their props documentation and usage examples, with an environment for developing components in isolation, similar to Storybook. In Styleguidist you write examples in Markdown, where each code snippet is rendered as a live editable playground.\n\nFirst, install Styleguidist:\n\n```sh\nnpm install --save react-styleguidist\n```\n\nAlternatively you may use `yarn`:\n\n```sh\nyarn add react-styleguidist\n```\n\nThen, add these scripts to your `package.json`:\n\n```diff\n   \"scripts\": {\n+    \"styleguide\": \"styleguidist server\",\n+    \"styleguide:build\": \"styleguidist build\",\n     \"start\": \"react-scripts start\",\n```\n\nThen, run the following command inside your app’s directory:\n\n```sh\nnpm run styleguide\n```\n\nAfter that, follow the instructions on the screen.\n\nLearn more about React Styleguidist:\n\n- [GitHub Repo](https://github.com/styleguidist/react-styleguidist)\n- [Documentation](https://react-styleguidist.js.org/docs/getting-started.html)\n\n## Making a Progressive Web App\n\nBy default, the production build is a fully functional, offline-first\n[Progressive Web App](https://developers.google.com/web/progressive-web-apps/).\n\nProgressive Web Apps are faster and more reliable than traditional web pages, and provide an engaging mobile experience:\n\n- All static site assets are cached so that your page loads fast on subsequent visits, regardless of network connectivity (such as 2G or 3G). Updates are downloaded in the background.\n- Your app will work regardless of network state, even if offline. This means your users will be able to use your app at 10,000 feet and on the Subway.\n- On mobile devices, your app can be added directly to the user's home screen, app icon and all. You can also re-engage users using web **push notifications**. This eliminates the need for the app store.\n\nThe [`sw-precache-webpack-plugin`](https://github.com/goldhand/sw-precache-webpack-plugin)\nis integrated into production configuration,\nand it will take care of generating a service worker file that will automatically\nprecache all of your local assets and keep them up to date as you deploy updates.\nThe service worker will use a [cache-first strategy](https://developers.google.com/web/fundamentals/instant-and-offline/offline-cookbook/#cache-falling-back-to-network)\nfor handling all requests for local assets, including the initial HTML, ensuring\nthat your web app is reliably fast, even on a slow or unreliable network.\n\n### Opting Out of Caching\n\nIf you would prefer not to enable service workers prior to your initial\nproduction deployment, then remove the call to `serviceWorkerRegistration.register()`\nfrom [`src/index.js`](src/index.js).\n\nIf you had previously enabled service workers in your production deployment and\nhave decided that you would like to disable them for all your existing users,\nyou can swap out the call to `serviceWorkerRegistration.register()` in\n[`src/index.js`](src/index.js) with a call to `serviceWorkerRegistration.unregister()`.\nAfter the user visits a page that has `serviceWorkerRegistration.unregister()`,\nthe service worker will be uninstalled. Note that depending on how `/service-worker.js` is served,\nit may take up to 24 hours for the cache to be invalidated.\n\n### Offline-First Considerations\n\n1. Service workers [require HTTPS](https://developers.google.com/web/fundamentals/getting-started/primers/service-workers#you_need_https),\n   although to facilitate local testing, that policy\n   [does not apply to `localhost`](http://stackoverflow.com/questions/34160509/options-for-testing-service-workers-via-http/34161385#34161385).\n   If your production web server does not support HTTPS, then the service worker\n   registration will fail, but the rest of your web app will remain functional.\n\n1. Service workers are [not currently supported](https://jakearchibald.github.io/isserviceworkerready/)\n   in all web browsers. Service worker registration [won't be attempted](src/registerServiceWorker.js)\n   on browsers that lack support.\n\n1. The service worker is only enabled in the [production environment](#deployment),\n   e.g. the output of `npm run build`. It's recommended that you do not enable an\n   offline-first service worker in a development environment, as it can lead to\n   frustration when previously cached assets are used and do not include the latest\n   changes you've made locally.\n\n1. If you _need_ to test your offline-first service worker locally, build\n   the application (using `npm run build`) and run a simple http server from your\n   build directory. After running the build script, `create-react-app` will give\n   instructions for one way to test your production build locally and the [deployment instructions](#deployment) have\n   instructions for using other methods. _Be sure to always use an\n   incognito window to avoid complications with your browser cache._\n\n1. If possible, configure your production environment to serve the generated\n   `service-worker.js` [with HTTP caching disabled](http://stackoverflow.com/questions/38843970/service-worker-javascript-update-frequency-every-24-hours).\n   If that's not possible—[GitHub Pages](#github-pages), for instance, does not\n   allow you to change the default 10 minute HTTP cache lifetime—then be aware\n   that if you visit your production site, and then revisit again before\n   `service-worker.js` has expired from your HTTP cache, you'll continue to get\n   the previously cached assets from the service worker. If you have an immediate\n   need to view your updated production deployment, performing a shift-refresh\n   will temporarily disable the service worker and retrieve all assets from the\n   network.\n\n1. Users aren't always familiar with offline-first web apps. It can be useful to\n   [let the user know](https://developers.google.com/web/fundamentals/instant-and-offline/offline-ux#inform_the_user_when_the_app_is_ready_for_offline_consumption)\n   when the service worker has finished populating your caches (showing a \"This web\n   app works offline!\" message) and also let them know when the service worker has\n   fetched the latest updates that will be available the next time they load the\n   page (showing a \"New content is available; please refresh.\" message). Showing\n   this messages is currently left as an exercise to the developer, but as a\n   starting point, you can make use of the logic included in [`src/registerServiceWorker.js`](src/registerServiceWorker.js), which\n   demonstrates which service worker lifecycle events to listen for to detect each\n   scenario, and which as a default, just logs appropriate messages to the\n   JavaScript console.\n\n1. By default, the generated service worker file will not intercept or cache any\n   cross-origin traffic, like HTTP [API requests](#integrating-with-an-api-backend),\n   images, or embeds loaded from a different domain. If you would like to use a\n   runtime caching strategy for those requests, you can [`eject`](#npm-run-eject)\n   and then configure the\n   [`runtimeCaching`](https://github.com/GoogleChrome/sw-precache#runtimecaching-arrayobject)\n   option in the `SWPrecacheWebpackPlugin` section of\n   [`webpack.config.prod.js`](../config/webpack.config.prod.js).\n\n### Progressive Web App Metadata\n\nThe default configuration includes a web app manifest located at\n[`public/manifest.json`](public/manifest.json), that you can customize with\ndetails specific to your web application.\n\nWhen a user adds a web app to their homescreen using Chrome or Firefox on\nAndroid, the metadata in [`manifest.json`](public/manifest.json) determines what\nicons, names, and branding colors to use when the web app is displayed.\n[The Web App Manifest guide](https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/)\nprovides more context about what each field means, and how your customizations\nwill affect your users' experience.\n\n## Analyzing the Bundle Size\n\n[Source map explorer](https://www.npmjs.com/package/source-map-explorer) analyzes\nJavaScript bundles using the source maps. This helps you understand where code\nbloat is coming from.\n\nTo add Source map explorer to a Create React App project, follow these steps:\n\n```sh\nnpm install --save source-map-explorer\n```\n\nAlternatively you may use `yarn`:\n\n```sh\nyarn add source-map-explorer\n```\n\nThen in `package.json`, add the following line to `scripts`:\n\n```diff\n   \"scripts\": {\n+    \"analyze\": \"source-map-explorer build/static/js/main.*\",\n     \"start\": \"react-scripts start\",\n     \"build\": \"react-scripts build\",\n     \"test\": \"react-scripts test --env=jsdom\",\n```\n\nThen to analyze the bundle run the production build then run the analyze\nscript.\n\n```\nnpm run build\nnpm run analyze\n```\n\n## Deployment\n\n`npm run build` creates a `build` directory with a production build of your app. Set up your favourite HTTP server so that a visitor to your site is served `index.html`, and requests to static paths like `/static/js/main.<hash>.js` are served with the contents of the `/static/js/main.<hash>.js` file.\n\n### Static Server\n\nFor environments using [Node](https://nodejs.org/), the easiest way to handle this would be to install [serve](https://github.com/zeit/serve) and let it handle the rest:\n\n```sh\nnpm install -g serve\nserve -s build\n```\n\nThe last command shown above will serve your static site on the port **5000**. Like many of [serve](https://github.com/zeit/serve)’s internal settings, the port can be adjusted using the `-p` or `--port` flags.\n\nRun this command to get a full list of the options available:\n\n```sh\nserve -h\n```\n\n### Other Solutions\n\nYou don’t necessarily need a static server in order to run a Create React App project in production. It works just as fine integrated into an existing dynamic one.\n\nHere’s a programmatic example using [Node](https://nodejs.org/) and [Express](http://expressjs.com/):\n\n```javascript\nconst express = require('express');\nconst path = require('path');\nconst app = express();\n\napp.use(express.static(path.join(__dirname, 'build')));\n\napp.get('/', function (req, res) {\n  res.sendFile(path.join(__dirname, 'build', 'index.html'));\n});\n\napp.listen(9000);\n```\n\nThe choice of your server software isn’t important either. Since Create React App is completely platform-agnostic, there’s no need to explicitly use Node.\n\nThe `build` folder with static assets is the only output produced by Create React App.\n\nHowever this is not quite enough if you use client-side routing. Read the next section if you want to support URLs like `/todos/42` in your single-page app.\n\n### Serving Apps with Client-Side Routing\n\nIf you use routers that use the HTML5 [`pushState` history API](https://developer.mozilla.org/en-US/docs/Web/API/History_API#Adding_and_modifying_history_entries) under the hood (for example, [React Router](https://github.com/ReactTraining/react-router) with `browserHistory`), many static file servers will fail. For example, if you used React Router with a route for `/todos/42`, the development server will respond to `localhost:3000/todos/42` properly, but an Express serving a production build as above will not.\n\nThis is because when there is a fresh page load for a `/todos/42`, the server looks for the file `build/todos/42` and does not find it. The server needs to be configured to respond to a request to `/todos/42` by serving `index.html`. For example, we can amend our Express example above to serve `index.html` for any unknown paths:\n\n```diff\n app.use(express.static(path.join(__dirname, 'build')));\n\n-app.get('/', function (req, res) {\n+app.get('/*', function (req, res) {\n   res.sendFile(path.join(__dirname, 'build', 'index.html'));\n });\n```\n\nIf you’re using [Apache HTTP Server](https://httpd.apache.org/), you need to create a `.htaccess` file in the `public` folder that looks like this:\n\n```\n    Options -MultiViews\n    RewriteEngine On\n    RewriteCond %{REQUEST_FILENAME} !-f\n    RewriteRule ^ index.html [QSA,L]\n```\n\nIt will get copied to the `build` folder when you run `npm run build`.\n\nIf you’re using [Apache Tomcat](http://tomcat.apache.org/), you need to follow [this Stack Overflow answer](https://stackoverflow.com/a/41249464/4878474).\n\nNow requests to `/todos/42` will be handled correctly both in development and in production.\n\nOn a production build, and in a browser that supports [service workers](https://developers.google.com/web/fundamentals/getting-started/primers/service-workers),\nthe service worker will automatically handle all navigation requests, like for\n`/todos/42`, by serving the cached copy of your `index.html`. This\nservice worker navigation routing can be configured or disabled by\n[`eject`ing](#npm-run-eject) and then modifying the\n[`navigateFallback`](https://github.com/GoogleChrome/sw-precache#navigatefallback-string)\nand [`navigateFallbackWhitelist`](https://github.com/GoogleChrome/sw-precache#navigatefallbackwhitelist-arrayregexp)\noptions of the `SWPreachePlugin` [configuration](../config/webpack.config.prod.js).\n\n### Building for Relative Paths\n\nBy default, Create React App produces a build assuming your app is hosted at the server root.<br>\nTo override this, specify the `homepage` in your `package.json`, for example:\n\n```js\n  \"homepage\": \"http://mywebsite.com/relativepath\",\n```\n\nThis will let Create React App correctly infer the root path to use in the generated HTML file.\n\n**Note**: If you are using `react-router@^4`, you can root `<Link>`s using the `basename` prop on any `<Router>`.<br>\nMore information [here](https://reacttraining.com/react-router/web/api/BrowserRouter/basename-string).<br>\n<br>\nFor example:\n\n```js\n<BrowserRouter basename=\"/calendar\"/>\n<Link to=\"/today\"/> // renders <a href=\"/calendar/today\">\n```\n\n#### Serving the Same Build from Different Paths\n\n> Note: this feature is available with `react-scripts@0.9.0` and higher.\n\nIf you are not using the HTML5 `pushState` history API or not using client-side routing at all, it is unnecessary to specify the URL from which your app will be served. Instead, you can put this in your `package.json`:\n\n```js\n  \"homepage\": \".\",\n```\n\nThis will make sure that all the asset paths are relative to `index.html`. You will then be able to move your app from `http://mywebsite.com` to `http://mywebsite.com/relativepath` or even `http://mywebsite.com/relative/path` without having to rebuild it.\n\n### Azure\n\nSee [this](https://medium.com/@to_pe/deploying-create-react-app-on-microsoft-azure-c0f6686a4321) blog post on how to deploy your React app to [Microsoft Azure](https://azure.microsoft.com/).\n\n### Firebase\n\nInstall the Firebase CLI if you haven’t already by running `npm install -g firebase-tools`. Sign up for a [Firebase account](https://console.firebase.google.com/) and create a new project. Run `firebase login` and login with your previous created Firebase account.\n\nThen run the `firebase init` command from your project’s root. You need to choose the **Hosting: Configure and deploy Firebase Hosting sites** and choose the Firebase project you created in the previous step. You will need to agree with `database.rules.json` being created, choose `build` as the public directory, and also agree to **Configure as a single-page app** by replying with `y`.\n\n```sh\n    === Project Setup\n\n    First, let's associate this project directory with a Firebase project.\n    You can create multiple project aliases by running firebase use --add,\n    but for now we'll just set up a default project.\n\n    ? What Firebase project do you want to associate as default? Example app (example-app-fd690)\n\n    === Database Setup\n\n    Firebase Realtime Database Rules allow you to define how your data should be\n    structured and when your data can be read from and written to.\n\n    ? What file should be used for Database Rules? database.rules.json\n    ✔  Database Rules for example-app-fd690 have been downloaded to database.rules.json.\n    Future modifications to database.rules.json will update Database Rules when you run\n    firebase deploy.\n\n    === Hosting Setup\n\n    Your public directory is the folder (relative to your project directory) that\n    will contain Hosting assets to uploaded with firebase deploy. If you\n    have a build process for your assets, use your build's output directory.\n\n    ? What do you want to use as your public directory? build\n    ? Configure as a single-page app (rewrite all urls to /index.html)? Yes\n    ✔  Wrote build/index.html\n\n    i  Writing configuration info to firebase.json...\n    i  Writing project information to .firebaserc...\n\n    ✔  Firebase initialization complete!\n```\n\nNow, after you create a production build with `npm run build`, you can deploy it by running `firebase deploy`.\n\n```sh\n    === Deploying to 'example-app-fd690'...\n\n    i  deploying database, hosting\n    ✔  database: rules ready to deploy.\n    i  hosting: preparing build directory for upload...\n    Uploading: [==============================          ] 75%✔  hosting: build folder uploaded successfully\n    ✔  hosting: 8 files uploaded successfully\n    i  starting release process (may take several minutes)...\n\n    ✔  Deploy complete!\n\n    Project Console: https://console.firebase.google.com/project/example-app-fd690/overview\n    Hosting URL: https://example-app-fd690.firebaseapp.com\n```\n\nFor more information see [Add Firebase to your JavaScript Project](https://firebase.google.com/docs/web/setup).\n\n### GitHub Pages\n\n> Note: this feature is available with `react-scripts@0.2.0` and higher.\n\n#### Step 1: Add `homepage` to `package.json`\n\n**The step below is important!**<br>\n**If you skip it, your app will not deploy correctly.**\n\nOpen your `package.json` and add a `homepage` field:\n\n```js\n  \"homepage\": \"https://myusername.github.io/my-app\",\n```\n\nCreate React App uses the `homepage` field to determine the root URL in the built HTML file.\n\n#### Step 2: Install `gh-pages` and add `deploy` to `scripts` in `package.json`\n\nNow, whenever you run `npm run build`, you will see a cheat sheet with instructions on how to deploy to GitHub Pages.\n\nTo publish it at [https://myusername.github.io/my-app](https://myusername.github.io/my-app), run:\n\n```sh\nnpm install --save gh-pages\n```\n\nAlternatively you may use `yarn`:\n\n```sh\nyarn add gh-pages\n```\n\nAdd the following scripts in your `package.json`:\n\n```diff\n  \"scripts\": {\n+   \"predeploy\": \"npm run build\",\n+   \"deploy\": \"gh-pages -d build\",\n    \"start\": \"react-scripts start\",\n    \"build\": \"react-scripts build\",\n```\n\nThe `predeploy` script will run automatically before `deploy` is run.\n\n#### Step 3: Deploy the site by running `npm run deploy`\n\nThen run:\n\n```sh\nnpm run deploy\n```\n\n#### Step 4: Ensure your project’s settings use `gh-pages`\n\nFinally, make sure **GitHub Pages** option in your GitHub project settings is set to use the `gh-pages` branch:\n\n<img src=\"http://i.imgur.com/HUjEr9l.png\" width=\"500\" alt=\"gh-pages branch setting\">\n\n#### Step 5: Optionally, configure the domain\n\nYou can configure a custom domain with GitHub Pages by adding a `CNAME` file to the `public/` folder.\n\n#### Notes on client-side routing\n\nGitHub Pages doesn’t support routers that use the HTML5 `pushState` history API under the hood (for example, React Router using `browserHistory`). This is because when there is a fresh page load for a url like `http://user.github.io/todomvc/todos/42`, where `/todos/42` is a frontend route, the GitHub Pages server returns 404 because it knows nothing of `/todos/42`. If you want to add a router to a project hosted on GitHub Pages, here are a couple of solutions:\n\n- You could switch from using HTML5 history API to routing with hashes. If you use React Router, you can switch to `hashHistory` for this effect, but the URL will be longer and more verbose (for example, `http://user.github.io/todomvc/#/todos/42?_k=yknaj`). [Read more](https://reacttraining.com/react-router/web/api/Router) about different history implementations in React Router.\n- Alternatively, you can use a trick to teach GitHub Pages to handle 404 by redirecting to your `index.html` page with a special redirect parameter. You would need to add a `404.html` file with the redirection code to the `build` folder before deploying your project, and you’ll need to add code handling the redirect parameter to `index.html`. You can find a detailed explanation of this technique [in this guide](https://github.com/rafrex/spa-github-pages).\n\n### Heroku\n\nUse the [Heroku Buildpack for Create React App](https://github.com/mars/create-react-app-buildpack).<br>\nYou can find instructions in [Deploying React with Zero Configuration](https://blog.heroku.com/deploying-react-with-zero-configuration).\n\n#### Resolving Heroku Deployment Errors\n\nSometimes `npm run build` works locally but fails during deploy via Heroku. Following are the most common cases.\n\n##### \"Module not found: Error: Cannot resolve 'file' or 'directory'\"\n\nIf you get something like this:\n\n```\nremote: Failed to create a production build. Reason:\nremote: Module not found: Error: Cannot resolve 'file' or 'directory'\nMyDirectory in /tmp/build_1234/src\n```\n\nIt means you need to ensure that the lettercase of the file or directory you `import` matches the one you see on your filesystem or on GitHub.\n\nThis is important because Linux (the operating system used by Heroku) is case sensitive. So `MyDirectory` and `mydirectory` are two distinct directories and thus, even though the project builds locally, the difference in case breaks the `import` statements on Heroku remotes.\n\n##### \"Could not find a required file.\"\n\nIf you exclude or ignore necessary files from the package you will see a error similar this one:\n\n```\nremote: Could not find a required file.\nremote:   Name: `index.html`\nremote:   Searched in: /tmp/build_a2875fc163b209225122d68916f1d4df/public\nremote:\nremote: npm ERR! Linux 3.13.0-105-generic\nremote: npm ERR! argv \"/tmp/build_a2875fc163b209225122d68916f1d4df/.heroku/node/bin/node\" \"/tmp/build_a2875fc163b209225122d68916f1d4df/.heroku/node/bin/npm\" \"run\" \"build\"\n```\n\nIn this case, ensure that the file is there with the proper lettercase and that’s not ignored on your local `.gitignore` or `~/.gitignore_global`.\n\n### Netlify\n\n**To do a manual deploy to Netlify’s CDN:**\n\n```sh\nnpm install netlify-cli\nnetlify deploy\n```\n\nChoose `build` as the path to deploy.\n\n**To setup continuous delivery:**\n\nWith this setup Netlify will build and deploy when you push to git or open a pull request:\n\n1. [Start a new netlify project](https://app.netlify.com/signup)\n2. Pick your Git hosting service and select your repository\n3. Click `Build your site`\n\n**Support for client-side routing:**\n\nTo support `pushState`, make sure to create a `public/_redirects` file with the following rewrite rules:\n\n```\n/*  /index.html  200\n```\n\nWhen you build the project, Create React App will place the `public` folder contents into the build output.\n\n### Now\n\n[now](https://zeit.co/now) offers a zero-configuration single-command deployment. You can use `now` to deploy your app for free.\n\n1. Install the `now` command-line tool either via the recommended [desktop tool](https://zeit.co/download) or via node with `npm install -g now`.\n\n2. Build your app by running `npm run build`.\n\n3. Move into the build directory by running `cd build`.\n\n4. Run `now --name your-project-name` from within the build directory. You will see a **now.sh** URL in your output like this:\n\n   ```\n   > Ready! https://your-project-name-tpspyhtdtk.now.sh (copied to clipboard)\n   ```\n\n   Paste that URL into your browser when the build is complete, and you will see your deployed app.\n\nDetails are available in [this article.](https://zeit.co/blog/unlimited-static)\n\n### S3 and CloudFront\n\nSee this [blog post](https://medium.com/@omgwtfmarc/deploying-create-react-app-to-s3-or-cloudfront-48dae4ce0af) on how to deploy your React app to Amazon Web Services [S3](https://aws.amazon.com/s3) and [CloudFront](https://aws.amazon.com/cloudfront/).\n\n### Surge\n\nInstall the Surge CLI if you haven’t already by running `npm install -g surge`. Run the `surge` command and log in you or create a new account.\n\nWhen asked about the project path, make sure to specify the `build` folder, for example:\n\n```sh\n       project path: /path/to/project/build\n```\n\nNote that in order to support routers that use HTML5 `pushState` API, you may want to rename the `index.html` in your build folder to `200.html` before deploying to Surge. This [ensures that every URL falls back to that file](https://surge.sh/help/adding-a-200-page-for-client-side-routing).\n\n## Advanced Configuration\n\nYou can adjust various development and production settings by setting environment variables in your shell or with [.env](#adding-development-environment-variables-in-env).\n\n| Variable            |      Development       |     Production     | Usage                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                     |\n| :------------------ | :--------------------: | :----------------: | :------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |\n| BROWSER             |   :white_check_mark:   |        :x:         | By default, Create React App will open the default system browser, favoring Chrome on macOS. Specify a [browser](https://github.com/sindresorhus/opn#app) to override this behavior, or set it to `none` to disable it completely. If you need to customize the way the browser is launched, you can specify a node script instead. Any arguments passed to `npm start` will also be passed to this script, and the url where your app is served will be the last argument. Your script's file name must have the `.js` extension.                                                                                        |\n| HOST                |   :white_check_mark:   |        :x:         | By default, the development web server binds to `localhost`. You may use this variable to specify a different host.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                       |\n| PORT                |   :white_check_mark:   |        :x:         | By default, the development web server will attempt to listen on port 3000 or prompt you to attempt the next available port. You may use this variable to specify a different port.                                                                                                                                                                                                                                                                                                                                                                                                                                       |\n| HTTPS               |   :white_check_mark:   |        :x:         | When set to `true`, Create React App will run the development server in `https` mode.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                     |\n| PUBLIC_URL          |          :x:           | :white_check_mark: | Create React App assumes your application is hosted at the serving web server's root or a subpath as specified in [`package.json` (`homepage`)](#building-for-relative-paths). Normally, Create React App ignores the hostname. You may use this variable to force assets to be referenced verbatim to the url you provide (hostname included). This may be particularly useful when using a CDN to host your application.                                                                                                                                                                                                |\n| CI                  | :large_orange_diamond: | :white_check_mark: | When set to `true`, Create React App treats warnings as failures in the build. It also makes the test runner non-watching. Most CIs set this flag by default.                                                                                                                                                                                                                                                                                                                                                                                                                                                             |\n| REACT_EDITOR        |   :white_check_mark:   |        :x:         | When an app crashes in development, you will see an error overlay with clickable stack trace. When you click on it, Create React App will try to determine the editor you are using based on currently running processes, and open the relevant source file. You can [send a pull request to detect your editor of choice](https://github.com/facebookincubator/create-react-app/issues/2636). Setting this environment variable overrides the automatic detection. If you do it, make sure your systems [PATH](<https://en.wikipedia.org/wiki/PATH_(variable)>) environment variable points to your editor’s bin folder. |\n| CHOKIDAR_USEPOLLING |   :white_check_mark:   |        :x:         | When set to `true`, the watcher runs in polling mode, as necessary inside a VM. Use this option if `npm start` isn't detecting changes.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                   |\n| GENERATE_SOURCEMAP  |          :x:           | :white_check_mark: | When set to `false`, source maps are not generated for a production build. This solves OOM issues on some smaller machines.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                               |\n\n## Troubleshooting\n\n### `npm start` doesn’t detect changes\n\nWhen you save a file while `npm start` is running, the browser should refresh with the updated code.<br>\nIf this doesn’t happen, try one of the following workarounds:\n\n- If your project is in a Dropbox folder, try moving it out.\n- If the watcher doesn’t see a file called `index.js` and you’re referencing it by the folder name, you [need to restart the watcher](https://github.com/facebookincubator/create-react-app/issues/1164) due to a Webpack bug.\n- Some editors like Vim and IntelliJ have a “safe write” feature that currently breaks the watcher. You will need to disable it. Follow the instructions in [“Adjusting Your Text Editor”](https://webpack.js.org/guides/development/#adjusting-your-text-editor).\n- If your project path contains parentheses, try moving the project to a path without them. This is caused by a [Webpack watcher bug](https://github.com/webpack/watchpack/issues/42).\n- On Linux and macOS, you might need to [tweak system settings](https://webpack.github.io/docs/troubleshooting.html#not-enough-watchers) to allow more watchers.\n- If the project runs inside a virtual machine such as (a Vagrant provisioned) VirtualBox, create an `.env` file in your project directory if it doesn’t exist, and add `CHOKIDAR_USEPOLLING=true` to it. This ensures that the next time you run `npm start`, the watcher uses the polling mode, as necessary inside a VM.\n\nIf none of these solutions help please leave a comment [in this thread](https://github.com/facebookincubator/create-react-app/issues/659).\n\n### `npm test` hangs on macOS Sierra\n\nIf you run `npm test` and the console gets stuck after printing `react-scripts test --env=jsdom` to the console there might be a problem with your [Watchman](https://facebook.github.io/watchman/) installation as described in [facebookincubator/create-react-app#713](https://github.com/facebookincubator/create-react-app/issues/713).\n\nWe recommend deleting `node_modules` in your project and running `npm install` (or `yarn` if you use it) first. If it doesn't help, you can try one of the numerous workarounds mentioned in these issues:\n\n- [facebook/jest#1767](https://github.com/facebook/jest/issues/1767)\n- [facebook/watchman#358](https://github.com/facebook/watchman/issues/358)\n- [ember-cli/ember-cli#6259](https://github.com/ember-cli/ember-cli/issues/6259)\n\nIt is reported that installing Watchman 4.7.0 or newer fixes the issue. If you use [Homebrew](http://brew.sh/), you can run these commands to update it:\n\n```\nwatchman shutdown-server\nbrew update\nbrew reinstall watchman\n```\n\nYou can find [other installation methods](https://facebook.github.io/watchman/docs/install.html#build-install) on the Watchman documentation page.\n\nIf this still doesn’t help, try running `launchctl unload -F ~/Library/LaunchAgents/com.github.facebook.watchman.plist`.\n\nThere are also reports that _uninstalling_ Watchman fixes the issue. So if nothing else helps, remove it from your system and try again.\n\n### `npm run build` exits too early\n\nIt is reported that `npm run build` can fail on machines with limited memory and no swap space, which is common in cloud environments. Even with small projects this command can increase RAM usage in your system by hundreds of megabytes, so if you have less than 1 GB of available memory your build is likely to fail with the following message:\n\n> The build failed because the process exited too early. This probably means the system ran out of memory or someone called `kill -9` on the process.\n\nIf you are completely sure that you didn't terminate the process, consider [adding some swap space](https://www.digitalocean.com/community/tutorials/how-to-add-swap-on-ubuntu-14-04) to the machine you’re building on, or build the project locally.\n\n### `npm run build` fails on Heroku\n\nThis may be a problem with case sensitive filenames.\nPlease refer to [this section](#resolving-heroku-deployment-errors).\n\n### Moment.js locales are missing\n\nIf you use a [Moment.js](https://momentjs.com/), you might notice that only the English locale is available by default. This is because the locale files are large, and you probably only need a subset of [all the locales provided by Moment.js](https://momentjs.com/#multiple-locale-support).\n\nTo add a specific Moment.js locale to your bundle, you need to import it explicitly.<br>\nFor example:\n\n```js\nimport moment from 'moment';\nimport 'moment/locale/fr';\n```\n\nIf import multiple locales this way, you can later switch between them by calling `moment.locale()` with the locale name:\n\n```js\nimport moment from 'moment';\nimport 'moment/locale/fr';\nimport 'moment/locale/es';\n\n// ...\n\nmoment.locale('fr');\n```\n\nThis will only work for locales that have been explicitly imported before.\n\n### `npm run build` fails to minify\n\nYou may occasionally find a package you depend on needs compiled or ships code for a non-browser environment.<br>\nThis is considered poor practice in the ecosystem and does not have an escape hatch in Create React App.<br>\n<br>\nTo resolve this:\n\n1. Open an issue on the dependency's issue tracker and ask that the package be published pre-compiled (retaining ES6 Modules).\n2. Fork the package and publish a corrected version yourself.\n3. If the dependency is small enough, copy it to your `src/` folder and treat it as application code.\n\n## Something Missing?\n\nIf you have ideas for more “How To” recipes that should be on this page, [let us know](https://github.com/facebookincubator/create-react-app/issues) or [contribute some!](https://github.com/facebookincubator/create-react-app/edit/master/packages/react-scripts/template/README.md)\n"
  },
  {
    "path": "example/react-localstorage/package.json",
    "content": "{\n  \"name\": \"react_usinghooks\",\n  \"version\": \"0.1.0\",\n  \"private\": true,\n  \"dependencies\": {\n    \"i18next\": \"^23.12.3\",\n    \"i18next-browser-languagedetector\": \"^8.0.0\",\n    \"i18next-chained-backend\": \"^4.6.2\",\n    \"i18next-http-backend\": \"^2.5.2\",\n    \"i18next-localstorage-backend\": \"^4.2.0\",\n    \"react\": \"^18.3.1\",\n    \"react-dom\": \"^18.3.1\",\n    \"react-i18next\": \"^15.0.1\",\n    \"react-scripts\": \"^5.0.1\"\n  },\n  \"scripts\": {\n    \"start\": \"react-scripts start\",\n    \"build\": \"react-scripts build\",\n    \"test\": \"react-scripts test --env=jsdom\",\n    \"eject\": \"react-scripts eject\"\n  },\n  \"eslintConfig\": {\n    \"extends\": [\n      \"react-app\",\n      \"react-app/jest\"\n    ]\n  },\n  \"browserslist\": {\n    \"development\": [\n      \"last 2 chrome versions\",\n      \"last 2 firefox versions\",\n      \"last 2 edge versions\"\n    ],\n    \"production\": [\n      \">1%\",\n      \"last 4 versions\",\n      \"Firefox ESR\",\n      \"not ie < 11\"\n    ]\n  }\n}\n"
  },
  {
    "path": "example/react-localstorage/public/index.html",
    "content": "<!doctype html>\n<html lang=\"en\">\n  <head>\n    <meta charset=\"utf-8\" />\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\" />\n    <meta name=\"theme-color\" content=\"#000000\" />\n    <!--\n      manifest.json provides metadata used when your web app is added to the\n      homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/\n    -->\n    <link rel=\"manifest\" href=\"%PUBLIC_URL%/manifest.json\" />\n    <link rel=\"shortcut icon\" href=\"%PUBLIC_URL%/favicon.ico\" />\n    <!--\n      Notice the use of %PUBLIC_URL% in the tags above.\n      It will be replaced with the URL of the `public` folder during the build.\n      Only files inside the `public` folder can be referenced from the HTML.\n\n      Unlike \"/favicon.ico\" or \"favicon.ico\", \"%PUBLIC_URL%/favicon.ico\" will\n      work correctly both with client-side routing and a non-root public URL.\n      Learn how to configure a non-root public URL by running `npm run build`.\n    -->\n    <title>React App</title>\n  </head>\n  <body>\n    <noscript>You need to enable JavaScript to run this app.</noscript>\n    <div id=\"root\"></div>\n    <!--\n      This HTML file is a template.\n      If you open it directly in the browser, you will see an empty page.\n\n      You can add webfonts, meta tags, or analytics to this file.\n      The build step will place the bundled scripts into the <body> tag.\n\n      To begin the development, run `npm start` or `yarn start`.\n      To create a production bundle, use `npm run build` or `yarn build`.\n    -->\n  </body>\n</html>\n"
  },
  {
    "path": "example/react-localstorage/public/locales/de/translation.json",
    "content": "{\n  \"title\": \"Willkommen zu react und react-i18next\",\n  \"description\": {\n    \"part1\": \"Um loszulegen, ändere <1>src/App(DE).js</1> und speichere um neuzuladen.\",\n    \"part2\": \"Wechsle die Sprache zwischen deutsch und englisch mit Hilfe der beiden Schalter.\"\n  }\n}\n"
  },
  {
    "path": "example/react-localstorage/public/locales/en/translation.json",
    "content": "{\n  \"title\": \"Welcome to react using react-i18next\",\n  \"description\": {\n    \"part1\": \"To get started, edit <1>src/App.js</1> and save to reload.\",\n    \"part2\": \"Switch language between english and german using buttons above.\"\n  }\n}\n"
  },
  {
    "path": "example/react-localstorage/public/manifest.json",
    "content": "{\n  \"short_name\": \"React App\",\n  \"name\": \"Create React App Sample\",\n  \"icons\": [\n    {\n      \"src\": \"favicon.ico\",\n      \"sizes\": \"192x192\",\n      \"type\": \"image/png\"\n    }\n  ],\n  \"start_url\": \"./index.html\",\n  \"display\": \"standalone\",\n  \"theme_color\": \"#000000\",\n  \"background_color\": \"#ffffff\"\n}\n"
  },
  {
    "path": "example/react-localstorage/src/App.css",
    "content": ".App {\n  text-align: center;\n}\n\n.App-logo {\n  animation: App-logo-spin infinite 20s linear;\n  height: 80px;\n}\n\n.App-header {\n  background-color: #222;\n  height: 150px;\n  padding: 20px;\n  color: white;\n}\n\n.App-intro {\n  font-size: large;\n}\n\n@keyframes App-logo-spin {\n  from {\n    transform: rotate(0deg);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n}\n"
  },
  {
    "path": "example/react-localstorage/src/App.js",
    "content": "import React, { Component, Suspense } from 'react';\nimport { useTranslation, withTranslation, Trans } from 'react-i18next';\nimport logo from './logo.svg';\nimport './App.css';\n\n// use hoc for class based components\nclass LegacyWelcomeClass extends Component {\n  render() {\n    const { t } = this.props;\n    return <h2>{t('title')}</h2>;\n  }\n}\nconst Welcome = withTranslation()(LegacyWelcomeClass);\n\n// Component using the Trans component\nfunction MyComponent() {\n  return (\n    <Trans i18nKey=\"description.part1\">\n      To get started, edit <code>src/App.js</code> and save to reload.\n    </Trans>\n  );\n}\n\n// page uses the hook\nfunction Page() {\n  const { t, i18n } = useTranslation();\n\n  const changeLanguage = (lng) => {\n    i18n.changeLanguage(lng);\n  };\n\n  return (\n    <div className=\"App\">\n      <div className=\"App-header\">\n        <img src={logo} className=\"App-logo\" alt=\"logo\" />\n        <Welcome />\n        <button type=\"button\" onClick={() => changeLanguage('de')}>\n          de\n        </button>\n        <button type=\"button\" onClick={() => changeLanguage('en')}>\n          en\n        </button>\n      </div>\n      <div className=\"App-intro\">\n        <MyComponent />\n      </div>\n      <div>{t('description.part2')}</div>\n    </div>\n  );\n}\n\n// loading component for suspense fallback\nconst Loader = () => (\n  <div className=\"App\">\n    <img src={logo} className=\"App-logo\" alt=\"logo\" />\n    <div>loading...</div>\n  </div>\n);\n\n// here app catches the suspense from page in case translations are not yet loaded\nexport default function App() {\n  return (\n    <Suspense fallback={<Loader />}>\n      <Page />\n    </Suspense>\n  );\n}\n"
  },
  {
    "path": "example/react-localstorage/src/i18n.js",
    "content": "import i18n from 'i18next';\nimport HttpBackend from 'i18next-http-backend';\nimport LanguageDetector from 'i18next-browser-languagedetector';\nimport { initReactI18next } from 'react-i18next';\nimport ChainedBackend from 'i18next-chained-backend';\nimport LocalStorageBackend from 'i18next-localstorage-backend';\n\ni18n\n  // load translation using http -> see /public/locales\n  // learn more: https://github.com/i18next/i18next-http-backend\n  .use(ChainedBackend)\n  // detect user language\n  // learn more: https://github.com/i18next/i18next-browser-languageDetector\n  .use(LanguageDetector)\n  // pass the i18n instance to react-i18next.\n  .use(initReactI18next)\n  // init i18next\n  // for all options read: https://www.i18next.com/overview/configuration-options\n  .init({\n    fallbackLng: 'en',\n    debug: true,\n\n    backend: {\n      backends: [LocalStorageBackend, HttpBackend],\n      backendOptions: [],\n      cacheHitMode: 'refreshAndUpdateStore',\n    },\n\n    react: {\n      bindI18nStore: 'added', // this way, when the HttpBackend delivers new translations (thanks to refreshAndUpdateStore), the UI gets updated\n    },\n  });\n\nexport default i18n;\n"
  },
  {
    "path": "example/react-localstorage/src/index.css",
    "content": "body {\n  margin: 0;\n  padding: 0;\n  font-family: sans-serif;\n}\n"
  },
  {
    "path": "example/react-localstorage/src/index.js",
    "content": "import React from 'react';\nimport { createRoot } from 'react-dom/client';\nimport './index.css';\nimport App from './App';\n\n// import i18n (needs to be bundled ;))\nimport './i18n';\n\nconst root = createRoot(document.getElementById('root'));\nroot.render(\n  <React.StrictMode>\n    <App />\n  </React.StrictMode>,\n);\n"
  },
  {
    "path": "example/react-typescript/simple/.gitignore",
    "content": "# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.\n\n# dependencies\n/node_modules\n/.pnp\n.pnp.js\n\n# testing\n/coverage\n\n# production\n/build\n\n# misc\n.DS_Store\n.env.local\n.env.development.local\n.env.test.local\n.env.production.local\n\nnpm-debug.log*\nyarn-debug.log*\nyarn-error.log*\n"
  },
  {
    "path": "example/react-typescript/simple/README.md",
    "content": "# Getting Started with Create React App\n\nThis project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).\n\n## Available Scripts\n\nIn the project directory, you can run:\n\n### `npm start`\n\nRuns the app in the development mode.\\\nOpen [http://localhost:3000](http://localhost:3000) to view it in the browser.\n\nThe page will reload if you make edits.\\\nYou will also see any lint errors in the console.\n\n### `npm test`\n\nLaunches the test runner in the interactive watch mode.\\\nSee the section about [running tests](https://facebook.github.io/create-react-app/docs/running-tests) for more information.\n\n### `npm run build`\n\nBuilds the app for production to the `build` folder.\\\nIt correctly bundles React in production mode and optimizes the build for the best performance.\n\nThe build is minified and the filenames include the hashes.\\\nYour app is ready to be deployed!\n\nSee the section about [deployment](https://facebook.github.io/create-react-app/docs/deployment) for more information.\n\n### `npm run eject`\n\n**Note: this is a one-way operation. Once you `eject`, you can’t go back!**\n\nIf you aren’t satisfied with the build tool and configuration choices, you can `eject` at any time. This command will remove the single build dependency from your project.\n\nInstead, it will copy all the configuration files and the transitive dependencies (webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except `eject` will still work, but they will point to the copied scripts so you can tweak them. At this point you’re on your own.\n\nYou don’t have to ever use `eject`. The curated feature set is suitable for small and middle deployments, and you shouldn’t feel obligated to use this feature. However we understand that this tool wouldn’t be useful if you couldn’t customize it when you are ready for it.\n\n## Learn More\n\nYou can learn more in the [Create React App documentation](https://facebook.github.io/create-react-app/docs/getting-started).\n\nTo learn React, check out the [React documentation](https://reactjs.org/).\n"
  },
  {
    "path": "example/react-typescript/simple/package.json",
    "content": "{\n  \"name\": \"simple\",\n  \"version\": \"1.0.0\",\n  \"private\": true,\n  \"dependencies\": {\n    \"i18next\": \"^23.12.3\",\n    \"react\": \"^18.3.1\",\n    \"react-dom\": \"^18.3.1\",\n    \"react-i18next\": \"^15.0.1\"\n  },\n  \"devDependencies\": {\n    \"@types/react\": \"^18.3.3\",\n    \"@types/react-dom\": \"^18.3.0\",\n    \"i18next-resources-for-ts\": \"^1.5.0\",\n    \"react-scripts\": \"^5.0.1\",\n    \"typescript\": \"^5.5.4\"\n  },\n  \"scripts\": {\n    \"start\": \"react-scripts start\",\n    \"build\": \"react-scripts build\",\n    \"eject\": \"react-scripts eject\",\n    \"i18next-resources-for-ts\": \"i18next-resources-for-ts toc -i ./src/i18n/en -o ./src/@types/resources.ts\"\n  },\n  \"eslintConfig\": {\n    \"extends\": [\n      \"react-app\"\n    ]\n  },\n  \"browserslist\": {\n    \"production\": [\n      \">0.2%\",\n      \"not dead\",\n      \"not op_mini all\"\n    ],\n    \"development\": [\n      \"last 1 chrome version\",\n      \"last 1 firefox version\",\n      \"last 1 safari version\"\n    ]\n  }\n}\n"
  },
  {
    "path": "example/react-typescript/simple/public/index.html",
    "content": "<!doctype html>\n<html lang=\"en\">\n  <head>\n    <meta charset=\"utf-8\" />\n    <link rel=\"icon\" href=\"%PUBLIC_URL%/favicon.ico\" />\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\" />\n    <meta name=\"theme-color\" content=\"#000000\" />\n    <meta name=\"description\" content=\"Web site created using create-react-app\" />\n    <link rel=\"apple-touch-icon\" href=\"%PUBLIC_URL%/logo192.png\" />\n    <!--\n      manifest.json provides metadata used when your web app is installed on a\n      user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/\n    -->\n    <link rel=\"manifest\" href=\"%PUBLIC_URL%/manifest.json\" />\n    <!--\n      Notice the use of %PUBLIC_URL% in the tags above.\n      It will be replaced with the URL of the `public` folder during the build.\n      Only files inside the `public` folder can be referenced from the HTML.\n\n      Unlike \"/favicon.ico\" or \"favicon.ico\", \"%PUBLIC_URL%/favicon.ico\" will\n      work correctly both with client-side routing and a non-root public URL.\n      Learn how to configure a non-root public URL by running `npm run build`.\n    -->\n    <title>React App</title>\n  </head>\n  <body>\n    <noscript>You need to enable JavaScript to run this app.</noscript>\n    <div id=\"root\"></div>\n    <!--\n      This HTML file is a template.\n      If you open it directly in the browser, you will see an empty page.\n\n      You can add webfonts, meta tags, or analytics to this file.\n      The build step will place the bundled scripts into the <body> tag.\n\n      To begin the development, run `npm start` or `yarn start`.\n      To create a production bundle, use `npm run build` or `yarn build`.\n    -->\n  </body>\n</html>\n"
  },
  {
    "path": "example/react-typescript/simple/public/manifest.json",
    "content": "{\n  \"short_name\": \"React App\",\n  \"name\": \"Create React App Sample\",\n  \"icons\": [\n    {\n      \"src\": \"favicon.ico\",\n      \"sizes\": \"64x64 32x32 24x24 16x16\",\n      \"type\": \"image/x-icon\"\n    },\n    {\n      \"src\": \"logo192.png\",\n      \"type\": \"image/png\",\n      \"sizes\": \"192x192\"\n    },\n    {\n      \"src\": \"logo512.png\",\n      \"type\": \"image/png\",\n      \"sizes\": \"512x512\"\n    }\n  ],\n  \"start_url\": \".\",\n  \"display\": \"standalone\",\n  \"theme_color\": \"#000000\",\n  \"background_color\": \"#ffffff\"\n}\n"
  },
  {
    "path": "example/react-typescript/simple/public/robots.txt",
    "content": "# https://www.robotstxt.org/robotstxt.html\nUser-agent: *\nDisallow:\n"
  },
  {
    "path": "example/react-typescript/simple/src/@types/i18next.d.ts",
    "content": "import resources from './resources';\n\ndeclare module 'i18next' {\n  interface CustomTypeOptions {\n    resources: typeof resources;\n    // if you see an error like: \"Argument of type 'DefaultTFuncReturn' is not assignable to parameter of type xyz\"\n    // set returnNull to false (and also in the i18next init options)\n    // returnNull: false;\n  }\n}\n"
  },
  {
    "path": "example/react-typescript/simple/src/@types/react-app-env.d.ts",
    "content": "/// <reference types=\"react-scripts\" />\n"
  },
  {
    "path": "example/react-typescript/simple/src/@types/resources.ts",
    "content": "import translation from '../i18n/en/translation.json';\n\nconst resources = {\n  translation,\n} as const;\n\nexport default resources;\n"
  },
  {
    "path": "example/react-typescript/simple/src/App.tsx",
    "content": "import './i18n/config';\nimport { useTranslation, Trans } from 'react-i18next';\n\nfunction App() {\n  const { t } = useTranslation();\n\n  const count = 3;\n\n  return (\n    <div className=\"App\">\n      <p>{t('title', { name: 'John' })}</p>\n      <p>{t('description.part1')}</p>\n      <p>{t('description.part2')}</p>\n      <Trans i18nKey=\"userMessagesUnread\" count={count}>\n        You have {{ count }} unread message.\n      </Trans>\n    </div>\n  );\n}\n\nexport default App;\n"
  },
  {
    "path": "example/react-typescript/simple/src/i18n/config.ts",
    "content": "import i18next from 'i18next';\nimport { initReactI18next } from 'react-i18next';\nimport translation from './en/translation.json';\n\ni18next.use(initReactI18next).init({\n  lng: 'en', // if you're using a language detector, do not define the lng option\n  debug: true,\n  resources: {\n    en: {\n      translation,\n    },\n  },\n  // if you see an error like: \"Argument of type 'DefaultTFuncReturn' is not assignable to parameter of type xyz\"\n  // set returnNull to false (and also in the i18next.d.ts options)\n  // returnNull: false,\n});\n"
  },
  {
    "path": "example/react-typescript/simple/src/i18n/en/translation.json",
    "content": "{\n  \"title\": \"Welcome {{name}}, to react using react-i18next fully type-safe\",\n  \"description\": {\n    \"part1\": \"This is a simple example.\",\n    \"part2\": \"😉\"\n  },\n  \"userMessagesUnread_one\": \"You have {{count}} unread message.\",\n  \"userMessagesUnread_other\": \"You have {{count}} unread messages.\"\n}\n"
  },
  {
    "path": "example/react-typescript/simple/src/index.css",
    "content": "body {\n  margin: 0;\n  font-family:\n    -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell',\n    'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n}\n\ncode {\n  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', monospace;\n}\n"
  },
  {
    "path": "example/react-typescript/simple/src/index.tsx",
    "content": "import React from 'react';\nimport ReactDOM from 'react-dom/client';\nimport './index.css';\nimport App from './App';\n\nconst root = ReactDOM.createRoot(document.getElementById('root') as HTMLElement);\nroot.render(\n  <React.StrictMode>\n    <App />\n  </React.StrictMode>,\n);\n"
  },
  {
    "path": "example/react-typescript/simple/tsconfig.json",
    "content": "{\n  \"compilerOptions\": {\n    \"target\": \"es5\",\n    \"lib\": [\"dom\", \"dom.iterable\", \"esnext\"],\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"allowSyntheticDefaultImports\": true,\n    \"strict\": true,\n    \"forceConsistentCasingInFileNames\": true,\n    \"noFallthroughCasesInSwitch\": true,\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"resolveJsonModule\": true,\n    \"isolatedModules\": true,\n    \"noEmit\": true,\n    \"jsx\": \"react-jsx\"\n  },\n  \"include\": [\"src\"]\n}\n"
  },
  {
    "path": "example/react-typescript/simple-multi-namespaces/.gitignore",
    "content": "# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.\n\n# dependencies\n/node_modules\n/.pnp\n.pnp.js\n\n# testing\n/coverage\n\n# production\n/build\n\n# misc\n.DS_Store\n.env.local\n.env.development.local\n.env.test.local\n.env.production.local\n\nnpm-debug.log*\nyarn-debug.log*\nyarn-error.log*\n"
  },
  {
    "path": "example/react-typescript/simple-multi-namespaces/README.md",
    "content": "# Getting Started with Create React App\n\nThis project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).\n\n## Available Scripts\n\nIn the project directory, you can run:\n\n### `npm start`\n\nRuns the app in the development mode.\\\nOpen [http://localhost:3000](http://localhost:3000) to view it in the browser.\n\nThe page will reload if you make edits.\\\nYou will also see any lint errors in the console.\n\n### `npm test`\n\nLaunches the test runner in the interactive watch mode.\\\nSee the section about [running tests](https://facebook.github.io/create-react-app/docs/running-tests) for more information.\n\n### `npm run build`\n\nBuilds the app for production to the `build` folder.\\\nIt correctly bundles React in production mode and optimizes the build for the best performance.\n\nThe build is minified and the filenames include the hashes.\\\nYour app is ready to be deployed!\n\nSee the section about [deployment](https://facebook.github.io/create-react-app/docs/deployment) for more information.\n\n### `npm run eject`\n\n**Note: this is a one-way operation. Once you `eject`, you can’t go back!**\n\nIf you aren’t satisfied with the build tool and configuration choices, you can `eject` at any time. This command will remove the single build dependency from your project.\n\nInstead, it will copy all the configuration files and the transitive dependencies (webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except `eject` will still work, but they will point to the copied scripts so you can tweak them. At this point you’re on your own.\n\nYou don’t have to ever use `eject`. The curated feature set is suitable for small and middle deployments, and you shouldn’t feel obligated to use this feature. However we understand that this tool wouldn’t be useful if you couldn’t customize it when you are ready for it.\n\n## Learn More\n\nYou can learn more in the [Create React App documentation](https://facebook.github.io/create-react-app/docs/getting-started).\n\nTo learn React, check out the [React documentation](https://reactjs.org/).\n"
  },
  {
    "path": "example/react-typescript/simple-multi-namespaces/package.json",
    "content": "{\n  \"name\": \"simple-multi-namespaces\",\n  \"version\": \"1.0.0\",\n  \"private\": true,\n  \"dependencies\": {\n    \"i18next\": \"^23.12.3\",\n    \"react\": \"^18.3.1\",\n    \"react-dom\": \"^18.3.1\",\n    \"react-i18next\": \"^15.0.1\"\n  },\n  \"devDependencies\": {\n    \"@types/react\": \"^18.3.3\",\n    \"@types/react-dom\": \"^18.3.0\",\n    \"i18next-resources-for-ts\": \"^1.5.0\",\n    \"react-scripts\": \"^5.0.1\",\n    \"typescript\": \"^5.5.4\"\n  },\n  \"scripts\": {\n    \"start\": \"react-scripts start\",\n    \"build\": \"react-scripts build\",\n    \"eject\": \"react-scripts eject\",\n    \"i18next-resources-for-ts\": \"i18next-resources-for-ts toc -i ./src/i18n/en -o ./src/@types/resources.ts\"\n  },\n  \"eslintConfig\": {\n    \"extends\": [\n      \"react-app\"\n    ]\n  },\n  \"browserslist\": {\n    \"production\": [\n      \">0.2%\",\n      \"not dead\",\n      \"not op_mini all\"\n    ],\n    \"development\": [\n      \"last 1 chrome version\",\n      \"last 1 firefox version\",\n      \"last 1 safari version\"\n    ]\n  }\n}\n"
  },
  {
    "path": "example/react-typescript/simple-multi-namespaces/public/index.html",
    "content": "<!doctype html>\n<html lang=\"en\">\n  <head>\n    <meta charset=\"utf-8\" />\n    <link rel=\"icon\" href=\"%PUBLIC_URL%/favicon.ico\" />\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\" />\n    <meta name=\"theme-color\" content=\"#000000\" />\n    <meta name=\"description\" content=\"Web site created using create-react-app\" />\n    <link rel=\"apple-touch-icon\" href=\"%PUBLIC_URL%/logo192.png\" />\n    <!--\n      manifest.json provides metadata used when your web app is installed on a\n      user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/\n    -->\n    <link rel=\"manifest\" href=\"%PUBLIC_URL%/manifest.json\" />\n    <!--\n      Notice the use of %PUBLIC_URL% in the tags above.\n      It will be replaced with the URL of the `public` folder during the build.\n      Only files inside the `public` folder can be referenced from the HTML.\n\n      Unlike \"/favicon.ico\" or \"favicon.ico\", \"%PUBLIC_URL%/favicon.ico\" will\n      work correctly both with client-side routing and a non-root public URL.\n      Learn how to configure a non-root public URL by running `npm run build`.\n    -->\n    <title>React App</title>\n  </head>\n  <body>\n    <noscript>You need to enable JavaScript to run this app.</noscript>\n    <div id=\"root\"></div>\n    <!--\n      This HTML file is a template.\n      If you open it directly in the browser, you will see an empty page.\n\n      You can add webfonts, meta tags, or analytics to this file.\n      The build step will place the bundled scripts into the <body> tag.\n\n      To begin the development, run `npm start` or `yarn start`.\n      To create a production bundle, use `npm run build` or `yarn build`.\n    -->\n  </body>\n</html>\n"
  },
  {
    "path": "example/react-typescript/simple-multi-namespaces/public/manifest.json",
    "content": "{\n  \"short_name\": \"React App\",\n  \"name\": \"Create React App Sample\",\n  \"icons\": [\n    {\n      \"src\": \"favicon.ico\",\n      \"sizes\": \"64x64 32x32 24x24 16x16\",\n      \"type\": \"image/x-icon\"\n    },\n    {\n      \"src\": \"logo192.png\",\n      \"type\": \"image/png\",\n      \"sizes\": \"192x192\"\n    },\n    {\n      \"src\": \"logo512.png\",\n      \"type\": \"image/png\",\n      \"sizes\": \"512x512\"\n    }\n  ],\n  \"start_url\": \".\",\n  \"display\": \"standalone\",\n  \"theme_color\": \"#000000\",\n  \"background_color\": \"#ffffff\"\n}\n"
  },
  {
    "path": "example/react-typescript/simple-multi-namespaces/public/robots.txt",
    "content": "# https://www.robotstxt.org/robotstxt.html\nUser-agent: *\nDisallow:\n"
  },
  {
    "path": "example/react-typescript/simple-multi-namespaces/src/@types/i18next.d.ts",
    "content": "import resources from './resources';\nimport { defaultNS } from '../i18n/config';\n\ndeclare module 'i18next' {\n  interface CustomTypeOptions {\n    defaultNS: typeof defaultNS;\n    resources: typeof resources;\n  }\n}\n"
  },
  {
    "path": "example/react-typescript/simple-multi-namespaces/src/@types/react-app-env.d.ts",
    "content": "/// <reference types=\"react-scripts\" />\n"
  },
  {
    "path": "example/react-typescript/simple-multi-namespaces/src/@types/resources.ts",
    "content": "import ns1 from '../i18n/en/ns1.json';\nimport ns2 from '../i18n/en/ns2.json';\n\nconst resources = {\n  ns1,\n  ns2,\n} as const;\n\nexport default resources;\n"
  },
  {
    "path": "example/react-typescript/simple-multi-namespaces/src/App.tsx",
    "content": "import './i18n/config';\nimport Comp1 from './components/Comp1';\nimport Comp2 from './components/Comp2';\nimport Comp3 from './components/Comp3';\n\nfunction App() {\n  return (\n    <div className=\"App\">\n      <Comp1 />\n      <hr />\n      <Comp2 />\n      <hr />\n      <Comp3 />\n    </div>\n  );\n}\n\nexport default App;\n"
  },
  {
    "path": "example/react-typescript/simple-multi-namespaces/src/components/Comp1.tsx",
    "content": "import { useTranslation } from 'react-i18next';\n\nfunction Comp1() {\n  const { t } = useTranslation();\n\n  return (\n    <div className=\"App\">\n      <p>{t('title')}</p>\n      <p>{t('description.part1')}</p>\n      <p>{t('description.part2')}</p>\n    </div>\n  );\n}\n\nexport default Comp1;\n"
  },
  {
    "path": "example/react-typescript/simple-multi-namespaces/src/components/Comp2.tsx",
    "content": "import { useTranslation } from 'react-i18next';\n\nfunction Comp2() {\n  const { t } = useTranslation('ns2');\n\n  return (\n    <div className=\"App\">\n      <p>{t('description.part1')}</p>\n      <p>{t('description.part2')}</p>\n    </div>\n  );\n}\n\nexport default Comp2;\n"
  },
  {
    "path": "example/react-typescript/simple-multi-namespaces/src/components/Comp3.tsx",
    "content": "import { useTranslation } from 'react-i18next';\n\nfunction Comp2() {\n  const { t } = useTranslation(['ns1', 'ns2']);\n\n  return (\n    <div className=\"App\">\n      <p>{t('description.part1', { ns: 'ns1' })}</p>\n      <p>{t('description.part2', { ns: 'ns2' })}</p>\n    </div>\n  );\n}\n\nexport default Comp2;\n"
  },
  {
    "path": "example/react-typescript/simple-multi-namespaces/src/i18n/config.ts",
    "content": "import i18next from 'i18next';\nimport { initReactI18next } from 'react-i18next';\nimport ns1 from './en/ns1.json';\nimport ns2 from './en/ns2.json';\n\nexport const defaultNS = 'ns1';\n\ni18next.use(initReactI18next).init({\n  lng: 'en', // if you're using a language detector, do not define the lng option\n  debug: true,\n  resources: {\n    en: {\n      ns1,\n      ns2,\n    },\n  },\n  defaultNS,\n});\n"
  },
  {
    "path": "example/react-typescript/simple-multi-namespaces/src/i18n/en/ns1.json",
    "content": "{\n  \"title\": \"Welcome to react using react-i18next fully type-safe\",\n  \"description\": {\n    \"part1\": \"This is a simple example.\",\n    \"part2\": \"😉\"\n  }\n}\n"
  },
  {
    "path": "example/react-typescript/simple-multi-namespaces/src/i18n/en/ns2.json",
    "content": "{\n  \"description\": {\n    \"part1\": \"In order to infer the appropriate type for t function, you should use type augmentation to override the Resources type.\",\n    \"part2\": \"Check out the @types/i18next to see an example.\"\n  }\n}\n"
  },
  {
    "path": "example/react-typescript/simple-multi-namespaces/src/index.css",
    "content": "body {\n  margin: 0;\n  font-family:\n    -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell',\n    'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n}\n\ncode {\n  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', monospace;\n}\n"
  },
  {
    "path": "example/react-typescript/simple-multi-namespaces/src/index.tsx",
    "content": "import React from 'react';\nimport ReactDOM from 'react-dom/client';\nimport './index.css';\nimport App from './App';\n\nconst root = ReactDOM.createRoot(document.getElementById('root') as HTMLElement);\nroot.render(\n  <React.StrictMode>\n    <App />\n  </React.StrictMode>,\n);\n"
  },
  {
    "path": "example/react-typescript/simple-multi-namespaces/tsconfig.json",
    "content": "{\n  \"compilerOptions\": {\n    \"target\": \"es5\",\n    \"lib\": [\"dom\", \"dom.iterable\", \"esnext\"],\n    \"allowJs\": true,\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"allowSyntheticDefaultImports\": true,\n    \"strict\": true,\n    \"forceConsistentCasingInFileNames\": true,\n    \"noFallthroughCasesInSwitch\": true,\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"resolveJsonModule\": true,\n    \"isolatedModules\": true,\n    \"noEmit\": true,\n    \"jsx\": \"react-jsx\"\n  },\n  \"include\": [\"src\"]\n}\n"
  },
  {
    "path": "example/react_native_windows/.buckconfig",
    "content": "\n[android]\n  target = Google Inc.:Google APIs:23\n\n[maven_repositories]\n  central = https://repo1.maven.org/maven2\n"
  },
  {
    "path": "example/react_native_windows/.eslintrc.js",
    "content": "module.exports = {\n  root: true,\n  extends: '@react-native-community',\n};\n"
  },
  {
    "path": "example/react_native_windows/.flowconfig",
    "content": "[ignore]\n; We fork some components by platform\n.*/*[.]android.js\n\n; Ignore \"BUCK\" generated dirs\n<PROJECT_ROOT>/\\.buckd/\n\n; Ignore polyfills\nnode_modules/react-native/Libraries/polyfills/.*\n\n; These should not be required directly\n; require from fbjs/lib instead: require('fbjs/lib/warning')\nnode_modules/warning/.*\n\n; Flow doesn't support platforms\n.*/Libraries/Utilities/LoadingView.js\n\n[untyped]\n.*/node_modules/@react-native-community/cli/.*/.*\n\n[include]\n\n[libs]\nnode_modules/react-native/interface.js\nnode_modules/react-native/flow/\n\n[options]\nemoji=true\n\nesproposal.optional_chaining=enable\nesproposal.nullish_coalescing=enable\n\nmodule.file_ext=.js\nmodule.file_ext=.json\nmodule.file_ext=.ios.js\n\nmunge_underscores=true\n\nmodule.name_mapper='^react-native/\\(.*\\)$' -> '<PROJECT_ROOT>/node_modules/react-native/\\1'\nmodule.name_mapper='^@?[./a-zA-Z0-9$_-]+\\.\\(bmp\\|gif\\|jpg\\|jpeg\\|png\\|psd\\|svg\\|webp\\|m4v\\|mov\\|mp4\\|mpeg\\|mpg\\|webm\\|aac\\|aiff\\|caf\\|m4a\\|mp3\\|wav\\|html\\|pdf\\)$' -> '<PROJECT_ROOT>/node_modules/react-native/Libraries/Image/RelativeImageStub'\n\nsuppress_type=$FlowIssue\nsuppress_type=$FlowFixMe\nsuppress_type=$FlowFixMeProps\nsuppress_type=$FlowFixMeState\n\nsuppress_comment=\\\\(.\\\\|\\n\\\\)*\\\\$FlowFixMe\\\\($\\\\|[^(]\\\\|(\\\\(<VERSION>\\\\)? *\\\\(site=[a-z,_]*react_native\\\\(_ios\\\\)?_\\\\(oss\\\\|fb\\\\)[a-z,_]*\\\\)?)\\\\)\nsuppress_comment=\\\\(.\\\\|\\n\\\\)*\\\\$FlowIssue\\\\((\\\\(<VERSION>\\\\)? *\\\\(site=[a-z,_]*react_native\\\\(_ios\\\\)?_\\\\(oss\\\\|fb\\\\)[a-z,_]*\\\\)?)\\\\)?:? #[0-9]+\nsuppress_comment=\\\\(.\\\\|\\n\\\\)*\\\\$FlowExpectedError\n\n[lints]\nsketchy-null-number=warn\nsketchy-null-mixed=warn\nsketchy-number=warn\nuntyped-type-import=warn\nnonstrict-import=warn\ndeprecated-type=warn\nunsafe-getters-setters=warn\nunnecessary-invariant=warn\nsignature-verification-failure=warn\ndeprecated-utility=error\n\n[strict]\ndeprecated-type\nnonstrict-import\nsketchy-null\nunclear-type\nunsafe-getters-setters\nuntyped-import\nuntyped-type-import\n\n[version]\n^0.122.0\n"
  },
  {
    "path": "example/react_native_windows/.gitattributes",
    "content": "*.pbxproj -text\n"
  },
  {
    "path": "example/react_native_windows/.gitignore",
    "content": "# OSX\n#\n.DS_Store\n\n# Xcode\n#\nbuild/\n*.pbxuser\n!default.pbxuser\n*.mode1v3\n!default.mode1v3\n*.mode2v3\n!default.mode2v3\n*.perspectivev3\n!default.perspectivev3\nxcuserdata\n*.xccheckout\n*.moved-aside\nDerivedData\n*.hmap\n*.ipa\n*.xcuserstate\n\n# Android/IntelliJ\n#\nbuild/\n.idea\n.gradle\nlocal.properties\n*.iml\n\n# node.js\n#\nnode_modules/\nnpm-debug.log\nyarn-error.log\n\n# BUCK\nbuck-out/\n\\.buckd/\n*.keystore\n!debug.keystore\n\n# fastlane\n#\n# It is recommended to not store the screenshots in the git repo. Instead, use fastlane to re-generate the\n# screenshots whenever they are needed.\n# For more information about the recommended setup visit:\n# https://docs.fastlane.tools/best-practices/source-control/\n\n*/fastlane/report.xml\n*/fastlane/Preview.html\n*/fastlane/screenshots\n\n# Bundle artifact\n*.jsbundle\n\n# CocoaPods\n/ios/Pods/\n"
  },
  {
    "path": "example/react_native_windows/.prettierrc.json",
    "content": "{\n  \"$schema\": \"https://json.schemastore.org/prettierrc.json\",\n  \"bracketSpacing\": false,\n  \"bracketSameLine\": true,\n  \"singleQuote\": true,\n  \"trailingComma\": \"all\"\n}\n"
  },
  {
    "path": "example/react_native_windows/.watchmanconfig",
    "content": "{}\n"
  },
  {
    "path": "example/react_native_windows/App.js",
    "content": "/**\n * Sample React Native App\n * https://github.com/facebook/react-native\n *\n * @format\n * @flow strict-local\n */\n\nimport React, {Suspense} from 'react';\nimport {\n  SafeAreaView,\n  StyleSheet,\n  ScrollView,\n  View,\n  Text,\n  StatusBar,\n  Button,\n} from 'react-native';\n\nimport {Colors} from 'react-native/Libraries/NewAppScreen';\n\nimport i18next from 'i18next';\nimport {initReactI18next, useTranslation} from 'react-i18next';\n\nconst languageDetector = {\n  type: 'languageDetector',\n  async: true,\n  detect: (cb) => cb('en'),\n  init: () => {},\n  cacheUserLanguage: () => {},\n};\n\ni18next\n  .use(languageDetector)\n  .use(initReactI18next)\n  .init({\n    fallbackLng: 'en',\n    debug: true,\n    resources: {\n      en: {\n        translation: {\n          hello: 'Hello world',\n          change: 'Change language',\n        },\n      },\n      de: {\n        translation: {\n          hello: 'Hallo welt',\n          change: 'Sprache wechseln',\n        },\n      },\n    },\n  });\n\n// page uses the hook\nfunction Content() {\n  const {t, i18n} = useTranslation();\n\n  return (\n    <>\n      <StatusBar barStyle=\"dark-content\" />\n      <SafeAreaView>\n        <ScrollView\n          contentInsetAdjustmentBehavior=\"automatic\"\n          style={styles.scrollView}>\n          <View style={styles.body}>\n            <View style={styles.sectionContainer}>\n              <Text style={styles.sectionTitle}>{t('hello')}</Text>\n              <Button\n                onPress={() =>\n                  i18n.changeLanguage(i18n.language === 'de' ? 'en' : 'de')\n                }\n                title={t('change')}\n              />\n            </View>\n          </View>\n        </ScrollView>\n      </SafeAreaView>\n    </>\n  );\n}\n\n// loading component for suspense fallback\nconst Loader = () => (\n  <View style={styles.body}>\n    <Text style={styles.sectionTitle}>loading...</Text>\n  </View>\n);\n\nconst App: () => React$Node = () => {\n  return (\n    <Suspense fallback={<Loader />}>\n      <Content />\n    </Suspense>\n  );\n};\n\nconst styles = StyleSheet.create({\n  scrollView: {\n    backgroundColor: Colors.lighter,\n  },\n  engine: {\n    position: 'absolute',\n    right: 0,\n  },\n  body: {\n    backgroundColor: Colors.white,\n  },\n  sectionContainer: {\n    marginTop: 32,\n    paddingHorizontal: 24,\n  },\n  sectionTitle: {\n    fontSize: 24,\n    fontWeight: '600',\n    color: Colors.black,\n  },\n  sectionDescription: {\n    marginTop: 8,\n    fontSize: 18,\n    fontWeight: '400',\n    color: Colors.dark,\n  },\n  highlight: {\n    fontWeight: '700',\n  },\n  footer: {\n    color: Colors.dark,\n    fontSize: 12,\n    fontWeight: '600',\n    padding: 4,\n    paddingRight: 12,\n    textAlign: 'right',\n  },\n});\n\nexport default App;\n"
  },
  {
    "path": "example/react_native_windows/__tests__/App-test.js",
    "content": "/**\n * @format\n */\n\nimport 'react-native';\nimport React from 'react';\nimport App from '../App';\n\n// Note: test renderer must be required after react-native.\nimport renderer from 'react-test-renderer';\n\nit('renders correctly', () => {\n  renderer.create(<App />);\n});\n"
  },
  {
    "path": "example/react_native_windows/android/app/BUCK",
    "content": "# To learn about Buck see [Docs](https://buckbuild.com/).\n# To run your application with Buck:\n# - install Buck\n# - `npm start` - to start the packager\n# - `cd android`\n# - `keytool -genkey -v -keystore keystores/debug.keystore -storepass android -alias androiddebugkey -keypass android -dname \"CN=Android Debug,O=Android,C=US\"`\n# - `./gradlew :app:copyDownloadableDepsToLibs` - make all Gradle compile dependencies available to Buck\n# - `buck install -r android/app` - compile, install and run application\n#\n\nload(\":build_defs.bzl\", \"create_aar_targets\", \"create_jar_targets\")\n\nlib_deps = []\n\ncreate_aar_targets(glob([\"libs/*.aar\"]))\n\ncreate_jar_targets(glob([\"libs/*.jar\"]))\n\nandroid_library(\n    name = \"all-libs\",\n    exported_deps = lib_deps,\n)\n\nandroid_library(\n    name = \"app-code\",\n    srcs = glob([\n        \"src/main/java/**/*.java\",\n    ]),\n    deps = [\n        \":all-libs\",\n        \":build_config\",\n        \":res\",\n    ],\n)\n\nandroid_build_config(\n    name = \"build_config\",\n    package = \"com.react_native_windows\",\n)\n\nandroid_resource(\n    name = \"res\",\n    package = \"com.react_native_windows\",\n    res = \"src/main/res\",\n)\n\nandroid_binary(\n    name = \"app\",\n    keystore = \"//android/keystores:debug\",\n    manifest = \"src/main/AndroidManifest.xml\",\n    package_type = \"debug\",\n    deps = [\n        \":app-code\",\n    ],\n)\n"
  },
  {
    "path": "example/react_native_windows/android/app/build.gradle",
    "content": "apply plugin: \"com.android.application\"\n\nimport com.android.build.OutputFile\n\n/**\n * The react.gradle file registers a task for each build variant (e.g. bundleDebugJsAndAssets\n * and bundleReleaseJsAndAssets).\n * These basically call `react-native bundle` with the correct arguments during the Android build\n * cycle. By default, bundleDebugJsAndAssets is skipped, as in debug/dev mode we prefer to load the\n * bundle directly from the development server. Below you can see all the possible configurations\n * and their defaults. If you decide to add a configuration block, make sure to add it before the\n * `apply from: \"../../node_modules/react-native/react.gradle\"` line.\n *\n * project.ext.react = [\n *   // the name of the generated asset file containing your JS bundle\n *   bundleAssetName: \"index.android.bundle\",\n *\n *   // the entry file for bundle generation. If none specified and\n *   // \"index.android.js\" exists, it will be used. Otherwise \"index.js\" is\n *   // default. Can be overridden with ENTRY_FILE environment variable.\n *   entryFile: \"index.android.js\",\n *\n *   // https://reactnative.dev/docs/performance#enable-the-ram-format\n *   bundleCommand: \"ram-bundle\",\n *\n *   // whether to bundle JS and assets in debug mode\n *   bundleInDebug: false,\n *\n *   // whether to bundle JS and assets in release mode\n *   bundleInRelease: true,\n *\n *   // whether to bundle JS and assets in another build variant (if configured).\n *   // See http://tools.android.com/tech-docs/new-build-system/user-guide#TOC-Build-Variants\n *   // The configuration property can be in the following formats\n *   //         'bundleIn${productFlavor}${buildType}'\n *   //         'bundleIn${buildType}'\n *   // bundleInFreeDebug: true,\n *   // bundleInPaidRelease: true,\n *   // bundleInBeta: true,\n *\n *   // whether to disable dev mode in custom build variants (by default only disabled in release)\n *   // for example: to disable dev mode in the staging build type (if configured)\n *   devDisabledInStaging: true,\n *   // The configuration property can be in the following formats\n *   //         'devDisabledIn${productFlavor}${buildType}'\n *   //         'devDisabledIn${buildType}'\n *\n *   // the root of your project, i.e. where \"package.json\" lives\n *   root: \"../../\",\n *\n *   // where to put the JS bundle asset in debug mode\n *   jsBundleDirDebug: \"$buildDir/intermediates/assets/debug\",\n *\n *   // where to put the JS bundle asset in release mode\n *   jsBundleDirRelease: \"$buildDir/intermediates/assets/release\",\n *\n *   // where to put drawable resources / React Native assets, e.g. the ones you use via\n *   // require('./image.png')), in debug mode\n *   resourcesDirDebug: \"$buildDir/intermediates/res/merged/debug\",\n *\n *   // where to put drawable resources / React Native assets, e.g. the ones you use via\n *   // require('./image.png')), in release mode\n *   resourcesDirRelease: \"$buildDir/intermediates/res/merged/release\",\n *\n *   // by default the gradle tasks are skipped if none of the JS files or assets change; this means\n *   // that we don't look at files in android/ or ios/ to determine whether the tasks are up to\n *   // date; if you have any other folders that you want to ignore for performance reasons (gradle\n *   // indexes the entire tree), add them here. Alternatively, if you have JS files in android/\n *   // for example, you might want to remove it from here.\n *   inputExcludes: [\"android/**\", \"ios/**\"],\n *\n *   // override which node gets called and with what additional arguments\n *   nodeExecutableAndArgs: [\"node\"],\n *\n *   // supply additional arguments to the packager\n *   extraPackagerArgs: []\n * ]\n */\n\nproject.ext.react = [\n    enableHermes: false,  // clean and rebuild if changing\n]\n\napply from: \"../../node_modules/react-native/react.gradle\"\n\n/**\n * Set this to true to create two separate APKs instead of one:\n *   - An APK that only works on ARM devices\n *   - An APK that only works on x86 devices\n * The advantage is the size of the APK is reduced by about 4MB.\n * Upload all the APKs to the Play Store and people will download\n * the correct one based on the CPU architecture of their device.\n */\ndef enableSeparateBuildPerCPUArchitecture = false\n\n/**\n * Run Proguard to shrink the Java bytecode in release builds.\n */\ndef enableProguardInReleaseBuilds = false\n\n/**\n * The preferred build flavor of JavaScriptCore.\n *\n * For example, to use the international variant, you can use:\n * `def jscFlavor = 'org.webkit:android-jsc-intl:+'`\n *\n * The international variant includes ICU i18n library and necessary data\n * allowing to use e.g. `Date.toLocaleString` and `String.localeCompare` that\n * give correct results when using with locales other than en-US.  Note that\n * this variant is about 6MiB larger per architecture than default.\n */\ndef jscFlavor = 'org.webkit:android-jsc:+'\n\n/**\n * Whether to enable the Hermes VM.\n *\n * This should be set on project.ext.react and mirrored here.  If it is not set\n * on project.ext.react, JavaScript will not be compiled to Hermes Bytecode\n * and the benefits of using Hermes will therefore be sharply reduced.\n */\ndef enableHermes = project.ext.react.get(\"enableHermes\", false);\n\nandroid {\n    compileSdkVersion rootProject.ext.compileSdkVersion\n\n    compileOptions {\n        sourceCompatibility JavaVersion.VERSION_1_8\n        targetCompatibility JavaVersion.VERSION_1_8\n    }\n\n    defaultConfig {\n        applicationId \"com.react_native_windows\"\n        minSdkVersion rootProject.ext.minSdkVersion\n        targetSdkVersion rootProject.ext.targetSdkVersion\n        versionCode 1\n        versionName \"1.0\"\n    }\n    splits {\n        abi {\n            reset()\n            enable enableSeparateBuildPerCPUArchitecture\n            universalApk false  // If true, also generate a universal APK\n            include \"armeabi-v7a\", \"x86\", \"arm64-v8a\", \"x86_64\"\n        }\n    }\n    signingConfigs {\n        debug {\n            storeFile file('debug.keystore')\n            storePassword 'android'\n            keyAlias 'androiddebugkey'\n            keyPassword 'android'\n        }\n    }\n    buildTypes {\n        debug {\n            signingConfig signingConfigs.debug\n        }\n        release {\n            // Caution! In production, you need to generate your own keystore file.\n            // see https://reactnative.dev/docs/signed-apk-android.\n            signingConfig signingConfigs.debug\n            minifyEnabled enableProguardInReleaseBuilds\n            proguardFiles getDefaultProguardFile(\"proguard-android.txt\"), \"proguard-rules.pro\"\n        }\n    }\n\n    // applicationVariants are e.g. debug, release\n    applicationVariants.all { variant ->\n        variant.outputs.each { output ->\n            // For each separate APK per architecture, set a unique version code as described here:\n            // https://developer.android.com/studio/build/configure-apk-splits.html\n            def versionCodes = [\"armeabi-v7a\": 1, \"x86\": 2, \"arm64-v8a\": 3, \"x86_64\": 4]\n            def abi = output.getFilter(OutputFile.ABI)\n            if (abi != null) {  // null for the universal-debug, universal-release variants\n                output.versionCodeOverride =\n                        versionCodes.get(abi) * 1048576 + defaultConfig.versionCode\n            }\n\n        }\n    }\n}\n\ndependencies {\n    implementation fileTree(dir: \"libs\", include: [\"*.jar\"])\n    //noinspection GradleDynamicVersion\n    implementation \"com.facebook.react:react-native:+\"  // From node_modules\n\n    implementation \"androidx.swiperefreshlayout:swiperefreshlayout:1.0.0\"\n\n    debugImplementation(\"com.facebook.flipper:flipper:${FLIPPER_VERSION}\") {\n      exclude group:'com.facebook.fbjni'\n    }\n\n    debugImplementation(\"com.facebook.flipper:flipper-network-plugin:${FLIPPER_VERSION}\") {\n        exclude group:'com.facebook.flipper'\n        exclude group:'com.squareup.okhttp3', module:'okhttp'\n    }\n\n    debugImplementation(\"com.facebook.flipper:flipper-fresco-plugin:${FLIPPER_VERSION}\") {\n        exclude group:'com.facebook.flipper'\n    }\n\n    if (enableHermes) {\n        def hermesPath = \"../../node_modules/hermes-engine/android/\";\n        debugImplementation files(hermesPath + \"hermes-debug.aar\")\n        releaseImplementation files(hermesPath + \"hermes-release.aar\")\n    } else {\n        implementation jscFlavor\n    }\n}\n\n// Run this once to be able to run the application with BUCK\n// puts all compile dependencies into folder libs for BUCK to use\ntask copyDownloadableDepsToLibs(type: Copy) {\n    from configurations.compile\n    into 'libs'\n}\n\napply from: file(\"../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle\"); applyNativeModulesAppBuildGradle(project)\n"
  },
  {
    "path": "example/react_native_windows/android/app/build_defs.bzl",
    "content": "\"\"\"Helper definitions to glob .aar and .jar targets\"\"\"\n\ndef create_aar_targets(aarfiles):\n    for aarfile in aarfiles:\n        name = \"aars__\" + aarfile[aarfile.rindex(\"/\") + 1:aarfile.rindex(\".aar\")]\n        lib_deps.append(\":\" + name)\n        android_prebuilt_aar(\n            name = name,\n            aar = aarfile,\n        )\n\ndef create_jar_targets(jarfiles):\n    for jarfile in jarfiles:\n        name = \"jars__\" + jarfile[jarfile.rindex(\"/\") + 1:jarfile.rindex(\".jar\")]\n        lib_deps.append(\":\" + name)\n        prebuilt_jar(\n            name = name,\n            binary_jar = jarfile,\n        )\n"
  },
  {
    "path": "example/react_native_windows/android/app/proguard-rules.pro",
    "content": "# Add project specific ProGuard rules here.\n# By default, the flags in this file are appended to flags specified\n# in /usr/local/Cellar/android-sdk/24.3.3/tools/proguard/proguard-android.txt\n# You can edit the include path and order by changing the proguardFiles\n# directive in build.gradle.\n#\n# For more details, see\n#   http://developer.android.com/guide/developing/tools/proguard.html\n\n# Add any project specific keep options here:\n"
  },
  {
    "path": "example/react_native_windows/android/app/src/debug/AndroidManifest.xml",
    "content": "<?xml version=\"1.0\" encoding=\"utf-8\"?>\n<manifest xmlns:android=\"http://schemas.android.com/apk/res/android\"\n    xmlns:tools=\"http://schemas.android.com/tools\">\n\n    <uses-permission android:name=\"android.permission.SYSTEM_ALERT_WINDOW\"/>\n\n    <application android:usesCleartextTraffic=\"true\" tools:targetApi=\"28\" tools:ignore=\"GoogleAppIndexingWarning\" />\n</manifest>\n"
  },
  {
    "path": "example/react_native_windows/android/app/src/debug/java/com/react_native_windows/ReactNativeFlipper.java",
    "content": "/**\n * Copyright (c) Facebook, Inc. and its affiliates.\n *\n * <p>This source code is licensed under the MIT license found in the LICENSE file in the root\n * directory of this source tree.\n */\npackage com.react_native_windows;\n\nimport android.content.Context;\nimport com.facebook.flipper.android.AndroidFlipperClient;\nimport com.facebook.flipper.android.utils.FlipperUtils;\nimport com.facebook.flipper.core.FlipperClient;\nimport com.facebook.flipper.plugins.crashreporter.CrashReporterPlugin;\nimport com.facebook.flipper.plugins.databases.DatabasesFlipperPlugin;\nimport com.facebook.flipper.plugins.fresco.FrescoFlipperPlugin;\nimport com.facebook.flipper.plugins.inspector.DescriptorMapping;\nimport com.facebook.flipper.plugins.inspector.InspectorFlipperPlugin;\nimport com.facebook.flipper.plugins.network.FlipperOkhttpInterceptor;\nimport com.facebook.flipper.plugins.network.NetworkFlipperPlugin;\nimport com.facebook.flipper.plugins.react.ReactFlipperPlugin;\nimport com.facebook.flipper.plugins.sharedpreferences.SharedPreferencesFlipperPlugin;\nimport com.facebook.react.ReactInstanceManager;\nimport com.facebook.react.bridge.ReactContext;\nimport com.facebook.react.modules.network.NetworkingModule;\nimport okhttp3.OkHttpClient;\n\npublic class ReactNativeFlipper {\n  public static void initializeFlipper(Context context, ReactInstanceManager reactInstanceManager) {\n    if (FlipperUtils.shouldEnableFlipper(context)) {\n      final FlipperClient client = AndroidFlipperClient.getInstance(context);\n\n      client.addPlugin(new InspectorFlipperPlugin(context, DescriptorMapping.withDefaults()));\n      client.addPlugin(new ReactFlipperPlugin());\n      client.addPlugin(new DatabasesFlipperPlugin(context));\n      client.addPlugin(new SharedPreferencesFlipperPlugin(context));\n      client.addPlugin(CrashReporterPlugin.getInstance());\n\n      NetworkFlipperPlugin networkFlipperPlugin = new NetworkFlipperPlugin();\n      NetworkingModule.setCustomClientBuilder(\n          new NetworkingModule.CustomClientBuilder() {\n            @Override\n            public void apply(OkHttpClient.Builder builder) {\n              builder.addNetworkInterceptor(new FlipperOkhttpInterceptor(networkFlipperPlugin));\n            }\n          });\n      client.addPlugin(networkFlipperPlugin);\n      client.start();\n\n      // Fresco Plugin needs to ensure that ImagePipelineFactory is initialized\n      // Hence we run if after all native modules have been initialized\n      ReactContext reactContext = reactInstanceManager.getCurrentReactContext();\n      if (reactContext == null) {\n        reactInstanceManager.addReactInstanceEventListener(\n            new ReactInstanceManager.ReactInstanceEventListener() {\n              @Override\n              public void onReactContextInitialized(ReactContext reactContext) {\n                reactInstanceManager.removeReactInstanceEventListener(this);\n                reactContext.runOnNativeModulesQueueThread(\n                    new Runnable() {\n                      @Override\n                      public void run() {\n                        client.addPlugin(new FrescoFlipperPlugin());\n                      }\n                    });\n              }\n            });\n      } else {\n        client.addPlugin(new FrescoFlipperPlugin());\n      }\n    }\n  }\n}\n"
  },
  {
    "path": "example/react_native_windows/android/app/src/main/AndroidManifest.xml",
    "content": "<manifest xmlns:android=\"http://schemas.android.com/apk/res/android\"\n  package=\"com.react_native_windows\">\n\n    <uses-permission android:name=\"android.permission.INTERNET\" />\n\n    <application\n      android:name=\".MainApplication\"\n      android:label=\"@string/app_name\"\n      android:icon=\"@mipmap/ic_launcher\"\n      android:roundIcon=\"@mipmap/ic_launcher_round\"\n      android:allowBackup=\"false\"\n      android:theme=\"@style/AppTheme\">\n      <activity\n        android:name=\".MainActivity\"\n        android:label=\"@string/app_name\"\n        android:configChanges=\"keyboard|keyboardHidden|orientation|screenSize|uiMode\"\n        android:launchMode=\"singleTask\"\n        android:windowSoftInputMode=\"adjustResize\">\n        <intent-filter>\n            <action android:name=\"android.intent.action.MAIN\" />\n            <category android:name=\"android.intent.category.LAUNCHER\" />\n        </intent-filter>\n      </activity>\n      <activity android:name=\"com.facebook.react.devsupport.DevSettingsActivity\" />\n    </application>\n\n</manifest>\n"
  },
  {
    "path": "example/react_native_windows/android/app/src/main/java/com/react_native_windows/MainActivity.java",
    "content": "package com.react_native_windows;\n\nimport com.facebook.react.ReactActivity;\n\npublic class MainActivity extends ReactActivity {\n\n  /**\n   * Returns the name of the main component registered from JavaScript. This is used to schedule\n   * rendering of the component.\n   */\n  @Override\n  protected String getMainComponentName() {\n    return \"react_native_windows\";\n  }\n}\n"
  },
  {
    "path": "example/react_native_windows/android/app/src/main/java/com/react_native_windows/MainApplication.java",
    "content": "package com.react_native_windows;\n\nimport android.app.Application;\nimport android.content.Context;\nimport com.facebook.react.PackageList;\nimport com.facebook.react.ReactApplication;\nimport com.facebook.react.ReactInstanceManager;\nimport com.facebook.react.ReactNativeHost;\nimport com.facebook.react.ReactPackage;\nimport com.facebook.soloader.SoLoader;\nimport java.lang.reflect.InvocationTargetException;\nimport java.util.List;\n\npublic class MainApplication extends Application implements ReactApplication {\n\n  private final ReactNativeHost mReactNativeHost =\n      new ReactNativeHost(this) {\n        @Override\n        public boolean getUseDeveloperSupport() {\n          return BuildConfig.DEBUG;\n        }\n\n        @Override\n        protected List<ReactPackage> getPackages() {\n          @SuppressWarnings(\"UnnecessaryLocalVariable\")\n          List<ReactPackage> packages = new PackageList(this).getPackages();\n          // Packages that cannot be autolinked yet can be added manually here, for example:\n          // packages.add(new MyReactNativePackage());\n          return packages;\n        }\n\n        @Override\n        protected String getJSMainModuleName() {\n          return \"index\";\n        }\n      };\n\n  @Override\n  public ReactNativeHost getReactNativeHost() {\n    return mReactNativeHost;\n  }\n\n  @Override\n  public void onCreate() {\n    super.onCreate();\n    SoLoader.init(this, /* native exopackage */ false);\n    initializeFlipper(this, getReactNativeHost().getReactInstanceManager());\n  }\n\n  /**\n   * Loads Flipper in React Native templates. Call this in the onCreate method with something like\n   * initializeFlipper(this, getReactNativeHost().getReactInstanceManager());\n   *\n   * @param context\n   * @param reactInstanceManager\n   */\n  private static void initializeFlipper(\n      Context context, ReactInstanceManager reactInstanceManager) {\n    if (BuildConfig.DEBUG) {\n      try {\n        /*\n         We use reflection here to pick up the class that initializes Flipper,\n        since Flipper library is not available in release mode\n        */\n        Class<?> aClass = Class.forName(\"com.react_native_windows.ReactNativeFlipper\");\n        aClass\n            .getMethod(\"initializeFlipper\", Context.class, ReactInstanceManager.class)\n            .invoke(null, context, reactInstanceManager);\n      } catch (ClassNotFoundException e) {\n        e.printStackTrace();\n      } catch (NoSuchMethodException e) {\n        e.printStackTrace();\n      } catch (IllegalAccessException e) {\n        e.printStackTrace();\n      } catch (InvocationTargetException e) {\n        e.printStackTrace();\n      }\n    }\n  }\n}\n"
  },
  {
    "path": "example/react_native_windows/android/app/src/main/res/values/strings.xml",
    "content": "<resources>\n    <string name=\"app_name\">react_native_windows</string>\n</resources>\n"
  },
  {
    "path": "example/react_native_windows/android/app/src/main/res/values/styles.xml",
    "content": "<resources>\n\n    <!-- Base application theme. -->\n    <style name=\"AppTheme\" parent=\"Theme.AppCompat.Light.NoActionBar\">\n        <!-- Customize your theme here. -->\n        <item name=\"android:textColor\">#000000</item>\n    </style>\n\n</resources>\n"
  },
  {
    "path": "example/react_native_windows/android/build.gradle",
    "content": "// Top-level build file where you can add configuration options common to all sub-projects/modules.\n\nbuildscript {\n    ext {\n        buildToolsVersion = \"29.0.2\"\n        minSdkVersion = 16\n        compileSdkVersion = 29\n        targetSdkVersion = 29\n    }\n    repositories {\n        google()\n        jcenter()\n    }\n    dependencies {\n        classpath(\"com.android.tools.build:gradle:3.5.3\")\n        // NOTE: Do not place your application dependencies here; they belong\n        // in the individual module build.gradle files\n    }\n}\n\nallprojects {\n    repositories {\n        mavenLocal()\n        maven {\n            // All of React Native (JS, Obj-C sources, Android binaries) is installed from npm\n            url(\"$rootDir/../node_modules/react-native/android\")\n        }\n        maven {\n            // Android JSC is installed from npm\n            url(\"$rootDir/../node_modules/jsc-android/dist\")\n        }\n\n        google()\n        jcenter()\n        maven { url 'https://www.jitpack.io' }\n    }\n}\n"
  },
  {
    "path": "example/react_native_windows/android/gradle/wrapper/gradle-wrapper.properties",
    "content": "distributionBase=GRADLE_USER_HOME\ndistributionPath=wrapper/dists\ndistributionUrl=https\\://services.gradle.org/distributions/gradle-6.2-all.zip\nzipStoreBase=GRADLE_USER_HOME\nzipStorePath=wrapper/dists\n"
  },
  {
    "path": "example/react_native_windows/android/gradle.properties",
    "content": "# Project-wide Gradle settings.\n\n# IDE (e.g. Android Studio) users:\n# Gradle settings configured through the IDE *will override*\n# any settings specified in this file.\n\n# For more details on how to configure your build environment visit\n# http://www.gradle.org/docs/current/userguide/build_environment.html\n\n# Specifies the JVM arguments used for the daemon process.\n# The setting is particularly useful for tweaking memory settings.\n# Default value: -Xmx10248m -XX:MaxPermSize=256m\n# org.gradle.jvmargs=-Xmx2048m -XX:MaxPermSize=512m -XX:+HeapDumpOnOutOfMemoryError -Dfile.encoding=UTF-8\n\n# When configured, Gradle will run in incubating parallel mode.\n# This option should only be used with decoupled projects. More details, visit\n# http://www.gradle.org/docs/current/userguide/multi_project_builds.html#sec:decoupled_projects\n# org.gradle.parallel=true\n\n# AndroidX package structure to make it clearer which packages are bundled with the\n# Android operating system, and which are packaged with your app's APK\n# https://developer.android.com/topic/libraries/support-library/androidx-rn\nandroid.useAndroidX=true\n# Automatically convert third-party libraries to use AndroidX\nandroid.enableJetifier=true\n\n# Version of flipper SDK to use with React Native\nFLIPPER_VERSION=0.54.0\n"
  },
  {
    "path": "example/react_native_windows/android/gradlew",
    "content": "#!/usr/bin/env sh\n\n#\n# Copyright 2015 the original author or authors.\n#\n# Licensed under the Apache License, Version 2.0 (the \"License\");\n# you may not use this file except in compliance with the License.\n# You may obtain a copy of the License at\n#\n#      https://www.apache.org/licenses/LICENSE-2.0\n#\n# Unless required by applicable law or agreed to in writing, software\n# distributed under the License is distributed on an \"AS IS\" BASIS,\n# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n# See the License for the specific language governing permissions and\n# limitations under the License.\n#\n\n##############################################################################\n##\n##  Gradle start up script for UN*X\n##\n##############################################################################\n\n# Attempt to set APP_HOME\n# Resolve links: $0 may be a link\nPRG=\"$0\"\n# Need this for relative symlinks.\nwhile [ -h \"$PRG\" ] ; do\n    ls=`ls -ld \"$PRG\"`\n    link=`expr \"$ls\" : '.*-> \\(.*\\)$'`\n    if expr \"$link\" : '/.*' > /dev/null; then\n        PRG=\"$link\"\n    else\n        PRG=`dirname \"$PRG\"`\"/$link\"\n    fi\ndone\nSAVED=\"`pwd`\"\ncd \"`dirname \\\"$PRG\\\"`/\" >/dev/null\nAPP_HOME=\"`pwd -P`\"\ncd \"$SAVED\" >/dev/null\n\nAPP_NAME=\"Gradle\"\nAPP_BASE_NAME=`basename \"$0\"`\n\n# Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script.\nDEFAULT_JVM_OPTS='\"-Xmx64m\" \"-Xms64m\"'\n\n# Use the maximum available, or set MAX_FD != -1 to use that value.\nMAX_FD=\"maximum\"\n\nwarn () {\n    echo \"$*\"\n}\n\ndie () {\n    echo\n    echo \"$*\"\n    echo\n    exit 1\n}\n\n# OS specific support (must be 'true' or 'false').\ncygwin=false\nmsys=false\ndarwin=false\nnonstop=false\ncase \"`uname`\" in\n  CYGWIN* )\n    cygwin=true\n    ;;\n  Darwin* )\n    darwin=true\n    ;;\n  MINGW* )\n    msys=true\n    ;;\n  NONSTOP* )\n    nonstop=true\n    ;;\nesac\n\nCLASSPATH=$APP_HOME/gradle/wrapper/gradle-wrapper.jar\n\n# Determine the Java command to use to start the JVM.\nif [ -n \"$JAVA_HOME\" ] ; then\n    if [ -x \"$JAVA_HOME/jre/sh/java\" ] ; then\n        # IBM's JDK on AIX uses strange locations for the executables\n        JAVACMD=\"$JAVA_HOME/jre/sh/java\"\n    else\n        JAVACMD=\"$JAVA_HOME/bin/java\"\n    fi\n    if [ ! -x \"$JAVACMD\" ] ; then\n        die \"ERROR: JAVA_HOME is set to an invalid directory: $JAVA_HOME\n\nPlease set the JAVA_HOME variable in your environment to match the\nlocation of your Java installation.\"\n    fi\nelse\n    JAVACMD=\"java\"\n    which java >/dev/null 2>&1 || die \"ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH.\n\nPlease set the JAVA_HOME variable in your environment to match the\nlocation of your Java installation.\"\nfi\n\n# Increase the maximum file descriptors if we can.\nif [ \"$cygwin\" = \"false\" -a \"$darwin\" = \"false\" -a \"$nonstop\" = \"false\" ] ; then\n    MAX_FD_LIMIT=`ulimit -H -n`\n    if [ $? -eq 0 ] ; then\n        if [ \"$MAX_FD\" = \"maximum\" -o \"$MAX_FD\" = \"max\" ] ; then\n            MAX_FD=\"$MAX_FD_LIMIT\"\n        fi\n        ulimit -n $MAX_FD\n        if [ $? -ne 0 ] ; then\n            warn \"Could not set maximum file descriptor limit: $MAX_FD\"\n        fi\n    else\n        warn \"Could not query maximum file descriptor limit: $MAX_FD_LIMIT\"\n    fi\nfi\n\n# For Darwin, add options to specify how the application appears in the dock\nif $darwin; then\n    GRADLE_OPTS=\"$GRADLE_OPTS \\\"-Xdock:name=$APP_NAME\\\" \\\"-Xdock:icon=$APP_HOME/media/gradle.icns\\\"\"\nfi\n\n# For Cygwin or MSYS, switch paths to Windows format before running java\nif [ \"$cygwin\" = \"true\" -o \"$msys\" = \"true\" ] ; then\n    APP_HOME=`cygpath --path --mixed \"$APP_HOME\"`\n    CLASSPATH=`cygpath --path --mixed \"$CLASSPATH\"`\n    JAVACMD=`cygpath --unix \"$JAVACMD\"`\n\n    # We build the pattern for arguments to be converted via cygpath\n    ROOTDIRSRAW=`find -L / -maxdepth 1 -mindepth 1 -type d 2>/dev/null`\n    SEP=\"\"\n    for dir in $ROOTDIRSRAW ; do\n        ROOTDIRS=\"$ROOTDIRS$SEP$dir\"\n        SEP=\"|\"\n    done\n    OURCYGPATTERN=\"(^($ROOTDIRS))\"\n    # Add a user-defined pattern to the cygpath arguments\n    if [ \"$GRADLE_CYGPATTERN\" != \"\" ] ; then\n        OURCYGPATTERN=\"$OURCYGPATTERN|($GRADLE_CYGPATTERN)\"\n    fi\n    # Now convert the arguments - kludge to limit ourselves to /bin/sh\n    i=0\n    for arg in \"$@\" ; do\n        CHECK=`echo \"$arg\"|egrep -c \"$OURCYGPATTERN\" -`\n        CHECK2=`echo \"$arg\"|egrep -c \"^-\"`                                 ### Determine if an option\n\n        if [ $CHECK -ne 0 ] && [ $CHECK2 -eq 0 ] ; then                    ### Added a condition\n            eval `echo args$i`=`cygpath --path --ignore --mixed \"$arg\"`\n        else\n            eval `echo args$i`=\"\\\"$arg\\\"\"\n        fi\n        i=`expr $i + 1`\n    done\n    case $i in\n        0) set -- ;;\n        1) set -- \"$args0\" ;;\n        2) set -- \"$args0\" \"$args1\" ;;\n        3) set -- \"$args0\" \"$args1\" \"$args2\" ;;\n        4) set -- \"$args0\" \"$args1\" \"$args2\" \"$args3\" ;;\n        5) set -- \"$args0\" \"$args1\" \"$args2\" \"$args3\" \"$args4\" ;;\n        6) set -- \"$args0\" \"$args1\" \"$args2\" \"$args3\" \"$args4\" \"$args5\" ;;\n        7) set -- \"$args0\" \"$args1\" \"$args2\" \"$args3\" \"$args4\" \"$args5\" \"$args6\" ;;\n        8) set -- \"$args0\" \"$args1\" \"$args2\" \"$args3\" \"$args4\" \"$args5\" \"$args6\" \"$args7\" ;;\n        9) set -- \"$args0\" \"$args1\" \"$args2\" \"$args3\" \"$args4\" \"$args5\" \"$args6\" \"$args7\" \"$args8\" ;;\n    esac\nfi\n\n# Escape application args\nsave () {\n    for i do printf %s\\\\n \"$i\" | sed \"s/'/'\\\\\\\\''/g;1s/^/'/;\\$s/\\$/' \\\\\\\\/\" ; done\n    echo \" \"\n}\nAPP_ARGS=`save \"$@\"`\n\n# Collect all arguments for the java command, following the shell quoting and substitution rules\neval set -- $DEFAULT_JVM_OPTS $JAVA_OPTS $GRADLE_OPTS \"\\\"-Dorg.gradle.appname=$APP_BASE_NAME\\\"\" -classpath \"\\\"$CLASSPATH\\\"\" org.gradle.wrapper.GradleWrapperMain \"$APP_ARGS\"\n\nexec \"$JAVACMD\" \"$@\"\n"
  },
  {
    "path": "example/react_native_windows/android/gradlew.bat",
    "content": "@rem\n@rem Copyright 2015 the original author or authors.\n@rem\n@rem Licensed under the Apache License, Version 2.0 (the \"License\");\n@rem you may not use this file except in compliance with the License.\n@rem You may obtain a copy of the License at\n@rem\n@rem      https://www.apache.org/licenses/LICENSE-2.0\n@rem\n@rem Unless required by applicable law or agreed to in writing, software\n@rem distributed under the License is distributed on an \"AS IS\" BASIS,\n@rem WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n@rem See the License for the specific language governing permissions and\n@rem limitations under the License.\n@rem\n\n@if \"%DEBUG%\" == \"\" @echo off\n@rem ##########################################################################\n@rem\n@rem  Gradle startup script for Windows\n@rem\n@rem ##########################################################################\n\n@rem Set local scope for the variables with windows NT shell\nif \"%OS%\"==\"Windows_NT\" setlocal\n\nset DIRNAME=%~dp0\nif \"%DIRNAME%\" == \"\" set DIRNAME=.\nset APP_BASE_NAME=%~n0\nset APP_HOME=%DIRNAME%\n\n@rem Resolve any \".\" and \"..\" in APP_HOME to make it shorter.\nfor %%i in (\"%APP_HOME%\") do set APP_HOME=%%~fi\n\n@rem Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script.\nset DEFAULT_JVM_OPTS=\"-Xmx64m\" \"-Xms64m\"\n\n@rem Find java.exe\nif defined JAVA_HOME goto findJavaFromJavaHome\n\nset JAVA_EXE=java.exe\n%JAVA_EXE% -version >NUL 2>&1\nif \"%ERRORLEVEL%\" == \"0\" goto init\n\necho.\necho ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH.\necho.\necho Please set the JAVA_HOME variable in your environment to match the\necho location of your Java installation.\n\ngoto fail\n\n:findJavaFromJavaHome\nset JAVA_HOME=%JAVA_HOME:\"=%\nset JAVA_EXE=%JAVA_HOME%/bin/java.exe\n\nif exist \"%JAVA_EXE%\" goto init\n\necho.\necho ERROR: JAVA_HOME is set to an invalid directory: %JAVA_HOME%\necho.\necho Please set the JAVA_HOME variable in your environment to match the\necho location of your Java installation.\n\ngoto fail\n\n:init\n@rem Get command-line arguments, handling Windows variants\n\nif not \"%OS%\" == \"Windows_NT\" goto win9xME_args\n\n:win9xME_args\n@rem Slurp the command line arguments.\nset CMD_LINE_ARGS=\nset _SKIP=2\n\n:win9xME_args_slurp\nif \"x%~1\" == \"x\" goto execute\n\nset CMD_LINE_ARGS=%*\n\n:execute\n@rem Setup the command line\n\nset CLASSPATH=%APP_HOME%\\gradle\\wrapper\\gradle-wrapper.jar\n\n@rem Execute Gradle\n\"%JAVA_EXE%\" %DEFAULT_JVM_OPTS% %JAVA_OPTS% %GRADLE_OPTS% \"-Dorg.gradle.appname=%APP_BASE_NAME%\" -classpath \"%CLASSPATH%\" org.gradle.wrapper.GradleWrapperMain %CMD_LINE_ARGS%\n\n:end\n@rem End local scope for the variables with windows NT shell\nif \"%ERRORLEVEL%\"==\"0\" goto mainEnd\n\n:fail\nrem Set variable GRADLE_EXIT_CONSOLE if you need the _script_ return code instead of\nrem the _cmd.exe /c_ return code!\nif  not \"\" == \"%GRADLE_EXIT_CONSOLE%\" exit 1\nexit /b 1\n\n:mainEnd\nif \"%OS%\"==\"Windows_NT\" endlocal\n\n:omega\n"
  },
  {
    "path": "example/react_native_windows/android/settings.gradle",
    "content": "rootProject.name = 'react_native_windows'\napply from: file(\"../node_modules/@react-native-community/cli-platform-android/native_modules.gradle\"); applyNativeModulesSettingsGradle(settings)\ninclude ':app'\n"
  },
  {
    "path": "example/react_native_windows/app.json",
    "content": "{\n  \"name\": \"react_native_windows\",\n  \"displayName\": \"react_native_windows\"\n}\n"
  },
  {
    "path": "example/react_native_windows/babel.config.js",
    "content": "module.exports = {\n  presets: ['module:metro-react-native-babel-preset'],\n};\n"
  },
  {
    "path": "example/react_native_windows/index.js",
    "content": "/**\n * @format\n */\n\nimport {AppRegistry} from 'react-native';\nimport App from './App';\nimport {name as appName} from './app.json';\n\nAppRegistry.registerComponent(appName, () => App);\n"
  },
  {
    "path": "example/react_native_windows/ios/Podfile",
    "content": "require_relative '../node_modules/react-native/scripts/react_native_pods'\nrequire_relative '../node_modules/@react-native-community/cli-platform-ios/native_modules'\n\nplatform :ios, '10.0'\n\ntarget 'react_native_windows' do\n  config = use_native_modules!\n\n  use_react_native!(:path => config[\"reactNativePath\"])\n\n  target 'react_native_windowsTests' do\n    inherit! :complete\n    # Pods for testing\n  end\n\n  # Enables Flipper.\n  #\n  # Note that if you have use_frameworks! enabled, Flipper will not work and\n  # you should disable these next few lines.\n  use_flipper!\n  post_install do |installer|\n    flipper_post_install(installer)\n  end\nend\n\ntarget 'react_native_windows-tvOS' do\n  # Pods for react_native_windows-tvOS\n\n  target 'react_native_windows-tvOSTests' do\n    inherit! :search_paths\n    # Pods for testing\n  end\nend\n"
  },
  {
    "path": "example/react_native_windows/ios/react_native_windows/AppDelegate.h",
    "content": "#import <React/RCTBridgeDelegate.h>\n#import <UIKit/UIKit.h>\n\n@interface AppDelegate : UIResponder <UIApplicationDelegate, RCTBridgeDelegate>\n\n@property (nonatomic, strong) UIWindow *window;\n\n@end\n"
  },
  {
    "path": "example/react_native_windows/ios/react_native_windows/AppDelegate.m",
    "content": "#import \"AppDelegate.h\"\n\n#import <React/RCTBridge.h>\n#import <React/RCTBundleURLProvider.h>\n#import <React/RCTRootView.h>\n\n#ifdef FB_SONARKIT_ENABLED\n#import <FlipperKit/FlipperClient.h>\n#import <FlipperKitLayoutPlugin/FlipperKitLayoutPlugin.h>\n#import <FlipperKitUserDefaultsPlugin/FKUserDefaultsPlugin.h>\n#import <FlipperKitNetworkPlugin/FlipperKitNetworkPlugin.h>\n#import <SKIOSNetworkPlugin/SKIOSNetworkAdapter.h>\n#import <FlipperKitReactPlugin/FlipperKitReactPlugin.h>\n\nstatic void InitializeFlipper(UIApplication *application) {\n  FlipperClient *client = [FlipperClient sharedClient];\n  SKDescriptorMapper *layoutDescriptorMapper = [[SKDescriptorMapper alloc] initWithDefaults];\n  [client addPlugin:[[FlipperKitLayoutPlugin alloc] initWithRootNode:application withDescriptorMapper:layoutDescriptorMapper]];\n  [client addPlugin:[[FKUserDefaultsPlugin alloc] initWithSuiteName:nil]];\n  [client addPlugin:[FlipperKitReactPlugin new]];\n  [client addPlugin:[[FlipperKitNetworkPlugin alloc] initWithNetworkAdapter:[SKIOSNetworkAdapter new]]];\n  [client start];\n}\n#endif\n\n@implementation AppDelegate\n\n- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions\n{\n#ifdef FB_SONARKIT_ENABLED\n  InitializeFlipper(application);\n#endif\n\n  RCTBridge *bridge = [[RCTBridge alloc] initWithDelegate:self launchOptions:launchOptions];\n  RCTRootView *rootView = [[RCTRootView alloc] initWithBridge:bridge\n                                                   moduleName:@\"react_native_windows\"\n                                            initialProperties:nil];\n\n  rootView.backgroundColor = [[UIColor alloc] initWithRed:1.0f green:1.0f blue:1.0f alpha:1];\n\n  self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds];\n  UIViewController *rootViewController = [UIViewController new];\n  rootViewController.view = rootView;\n  self.window.rootViewController = rootViewController;\n  [self.window makeKeyAndVisible];\n  return YES;\n}\n\n- (NSURL *)sourceURLForBridge:(RCTBridge *)bridge\n{\n#if DEBUG\n  return [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@\"index\" fallbackResource:nil];\n#else\n  return [[NSBundle mainBundle] URLForResource:@\"main\" withExtension:@\"jsbundle\"];\n#endif\n}\n\n@end\n"
  },
  {
    "path": "example/react_native_windows/ios/react_native_windows/Images.xcassets/AppIcon.appiconset/Contents.json",
    "content": "{\n  \"images\": [\n    {\n      \"idiom\": \"iphone\",\n      \"size\": \"29x29\",\n      \"scale\": \"2x\"\n    },\n    {\n      \"idiom\": \"iphone\",\n      \"size\": \"29x29\",\n      \"scale\": \"3x\"\n    },\n    {\n      \"idiom\": \"iphone\",\n      \"size\": \"40x40\",\n      \"scale\": \"2x\"\n    },\n    {\n      \"idiom\": \"iphone\",\n      \"size\": \"40x40\",\n      \"scale\": \"3x\"\n    },\n    {\n      \"idiom\": \"iphone\",\n      \"size\": \"60x60\",\n      \"scale\": \"2x\"\n    },\n    {\n      \"idiom\": \"iphone\",\n      \"size\": \"60x60\",\n      \"scale\": \"3x\"\n    }\n  ],\n  \"info\": {\n    \"version\": 1,\n    \"author\": \"xcode\"\n  }\n}\n"
  },
  {
    "path": "example/react_native_windows/ios/react_native_windows/Images.xcassets/Contents.json",
    "content": "{\n  \"info\": {\n    \"version\": 1,\n    \"author\": \"xcode\"\n  }\n}\n"
  },
  {
    "path": "example/react_native_windows/ios/react_native_windows/Info.plist",
    "content": "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<!DOCTYPE plist PUBLIC \"-//Apple//DTD PLIST 1.0//EN\" \"http://www.apple.com/DTDs/PropertyList-1.0.dtd\">\n<plist version=\"1.0\">\n<dict>\n\t<key>CFBundleDevelopmentRegion</key>\n\t<string>en</string>\n\t<key>CFBundleDisplayName</key>\n\t<string>react_native_windows</string>\n\t<key>CFBundleExecutable</key>\n\t<string>$(EXECUTABLE_NAME)</string>\n\t<key>CFBundleIdentifier</key>\n\t<string>$(PRODUCT_BUNDLE_IDENTIFIER)</string>\n\t<key>CFBundleInfoDictionaryVersion</key>\n\t<string>6.0</string>\n\t<key>CFBundleName</key>\n\t<string>$(PRODUCT_NAME)</string>\n\t<key>CFBundlePackageType</key>\n\t<string>APPL</string>\n\t<key>CFBundleShortVersionString</key>\n\t<string>1.0</string>\n\t<key>CFBundleSignature</key>\n\t<string>????</string>\n\t<key>CFBundleVersion</key>\n\t<string>1</string>\n\t<key>LSRequiresIPhoneOS</key>\n\t<true/>\n\t<key>NSAppTransportSecurity</key>\n\t<dict>\n\t\t<key>NSAllowsArbitraryLoads</key>\n\t\t<true/>\n\t\t<key>NSExceptionDomains</key>\n\t\t<dict>\n\t\t\t<key>localhost</key>\n\t\t\t<dict>\n\t\t\t\t<key>NSExceptionAllowsInsecureHTTPLoads</key>\n\t\t\t\t<true/>\n\t\t\t</dict>\n\t\t</dict>\n\t</dict>\n\t<key>NSLocationWhenInUseUsageDescription</key>\n\t<string></string>\n\t<key>UILaunchStoryboardName</key>\n\t<string>LaunchScreen</string>\n\t<key>UIRequiredDeviceCapabilities</key>\n\t<array>\n\t\t<string>armv7</string>\n\t</array>\n\t<key>UISupportedInterfaceOrientations</key>\n\t<array>\n\t\t<string>UIInterfaceOrientationPortrait</string>\n\t\t<string>UIInterfaceOrientationLandscapeLeft</string>\n\t\t<string>UIInterfaceOrientationLandscapeRight</string>\n\t</array>\n\t<key>UIViewControllerBasedStatusBarAppearance</key>\n\t<false/>\n</dict>\n</plist>\n"
  },
  {
    "path": "example/react_native_windows/ios/react_native_windows/LaunchScreen.storyboard",
    "content": "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<document type=\"com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB\" version=\"3.0\" toolsVersion=\"15702\" targetRuntime=\"iOS.CocoaTouch\" propertyAccessControl=\"none\" useAutolayout=\"YES\" launchScreen=\"YES\" useTraitCollections=\"YES\" useSafeAreas=\"YES\" colorMatched=\"YES\" initialViewController=\"01J-lp-oVM\">\n    <device id=\"retina4_7\" orientation=\"portrait\" appearance=\"light\"/>\n    <dependencies>\n        <deployment identifier=\"iOS\"/>\n        <plugIn identifier=\"com.apple.InterfaceBuilder.IBCocoaTouchPlugin\" version=\"15704\"/>\n        <capability name=\"Safe area layout guides\" minToolsVersion=\"9.0\"/>\n        <capability name=\"documents saved in the Xcode 8 format\" minToolsVersion=\"8.0\"/>\n    </dependencies>\n    <scenes>\n        <!--View Controller-->\n        <scene sceneID=\"EHf-IW-A2E\">\n            <objects>\n                <viewController id=\"01J-lp-oVM\" sceneMemberID=\"viewController\">\n                    <view key=\"view\" contentMode=\"scaleToFill\" id=\"Ze5-6b-2t3\">\n                        <rect key=\"frame\" x=\"0.0\" y=\"0.0\" width=\"375\" height=\"667\"/>\n                        <autoresizingMask key=\"autoresizingMask\" widthSizable=\"YES\" heightSizable=\"YES\"/>\n                        <subviews>\n                            <label opaque=\"NO\" clipsSubviews=\"YES\" userInteractionEnabled=\"NO\" contentMode=\"left\" horizontalHuggingPriority=\"251\" verticalHuggingPriority=\"251\" text=\"\" textAlignment=\"center\" lineBreakMode=\"tailTruncation\" baselineAdjustment=\"alignBaselines\" minimumFontSize=\"9\" translatesAutoresizingMaskIntoConstraints=\"NO\" id=\"obG-Y5-kRd\">\n                                <rect key=\"frame\" x=\"0.0\" y=\"647\" width=\"375\" height=\"0.0\"/>\n                                <fontDescription key=\"fontDescription\" type=\"system\" pointSize=\"17\"/>\n                                <color key=\"textColor\" red=\"0.0\" green=\"0.0\" blue=\"0.0\" alpha=\"1\" colorSpace=\"custom\" customColorSpace=\"sRGB\"/>\n                                <nil key=\"highlightedColor\"/>\n                            </label>\n                            <label opaque=\"NO\" clipsSubviews=\"YES\" userInteractionEnabled=\"NO\" contentMode=\"left\" horizontalHuggingPriority=\"251\" verticalHuggingPriority=\"251\" text=\"react_native_windows\" textAlignment=\"center\" lineBreakMode=\"middleTruncation\" baselineAdjustment=\"alignBaselines\" minimumFontSize=\"18\" translatesAutoresizingMaskIntoConstraints=\"NO\" id=\"GJd-Yh-RWb\">\n                                <rect key=\"frame\" x=\"0.0\" y=\"202\" width=\"375\" height=\"43\"/>\n                                <fontDescription key=\"fontDescription\" type=\"boldSystem\" pointSize=\"36\"/>\n                                <color key=\"textColor\" red=\"0.0\" green=\"0.0\" blue=\"0.0\" alpha=\"1\" colorSpace=\"custom\" customColorSpace=\"sRGB\"/>\n                                <nil key=\"highlightedColor\"/>\n                            </label>\n                            <label opaque=\"NO\" clipsSubviews=\"YES\" userInteractionEnabled=\"NO\" contentMode=\"left\" horizontalHuggingPriority=\"251\" verticalHuggingPriority=\"251\" text=\"Powered by React Native\" textAlignment=\"center\" lineBreakMode=\"tailTruncation\" baselineAdjustment=\"alignBaselines\" minimumFontSize=\"9\" translatesAutoresizingMaskIntoConstraints=\"NO\" id=\"MN2-I3-ftu\">\n                                <rect key=\"frame\" x=\"0.0\" y=\"626\" width=\"375\" height=\"21\"/>\n                                <fontDescription key=\"fontDescription\" type=\"system\" pointSize=\"17\"/>\n                                <color key=\"textColor\" cocoaTouchSystemColor=\"darkTextColor\"/>\n                                <nil key=\"highlightedColor\"/>\n                            </label>\n                        </subviews>\n                        <color key=\"backgroundColor\" red=\"1\" green=\"1\" blue=\"1\" alpha=\"1\" colorSpace=\"custom\" customColorSpace=\"sRGB\"/>\n                        <constraints>\n                            <constraint firstItem=\"Bcu-3y-fUS\" firstAttribute=\"centerX\" secondItem=\"obG-Y5-kRd\" secondAttribute=\"centerX\" id=\"5cz-MP-9tL\"/>\n                            <constraint firstItem=\"Bcu-3y-fUS\" firstAttribute=\"bottom\" secondItem=\"MN2-I3-ftu\" secondAttribute=\"bottom\" constant=\"20\" id=\"OZV-Vh-mqD\"/>\n                            <constraint firstItem=\"Bcu-3y-fUS\" firstAttribute=\"centerX\" secondItem=\"GJd-Yh-RWb\" secondAttribute=\"centerX\" id=\"Q3B-4B-g5h\"/>\n                            <constraint firstItem=\"obG-Y5-kRd\" firstAttribute=\"leading\" secondItem=\"Bcu-3y-fUS\" secondAttribute=\"leading\" symbolic=\"YES\" id=\"SfN-ll-jLj\"/>\n                            <constraint firstAttribute=\"bottom\" secondItem=\"obG-Y5-kRd\" secondAttribute=\"bottom\" constant=\"20\" id=\"Y44-ml-fuU\"/>\n                            <constraint firstItem=\"MN2-I3-ftu\" firstAttribute=\"centerX\" secondItem=\"Bcu-3y-fUS\" secondAttribute=\"centerX\" id=\"akx-eg-2ui\"/>\n                            <constraint firstItem=\"MN2-I3-ftu\" firstAttribute=\"leading\" secondItem=\"Bcu-3y-fUS\" secondAttribute=\"leading\" id=\"i1E-0Y-4RG\"/>\n                            <constraint firstItem=\"GJd-Yh-RWb\" firstAttribute=\"centerY\" secondItem=\"Ze5-6b-2t3\" secondAttribute=\"bottom\" multiplier=\"1/3\" constant=\"1\" id=\"moa-c2-u7t\"/>\n                            <constraint firstItem=\"GJd-Yh-RWb\" firstAttribute=\"leading\" secondItem=\"Bcu-3y-fUS\" secondAttribute=\"leading\" symbolic=\"YES\" id=\"x7j-FC-K8j\"/>\n                        </constraints>\n                        <viewLayoutGuide key=\"safeArea\" id=\"Bcu-3y-fUS\"/>\n                    </view>\n                </viewController>\n                <placeholder placeholderIdentifier=\"IBFirstResponder\" id=\"iYj-Kq-Ea1\" userLabel=\"First Responder\" sceneMemberID=\"firstResponder\"/>\n            </objects>\n            <point key=\"canvasLocation\" x=\"52.173913043478265\" y=\"375\"/>\n        </scene>\n    </scenes>\n</document>\n"
  },
  {
    "path": "example/react_native_windows/ios/react_native_windows/main.m",
    "content": "#import <UIKit/UIKit.h>\n\n#import \"AppDelegate.h\"\n\nint main(int argc, char * argv[]) {\n  @autoreleasepool {\n    return UIApplicationMain(argc, argv, nil, NSStringFromClass([AppDelegate class]));\n  }\n}\n"
  },
  {
    "path": "example/react_native_windows/ios/react_native_windows-tvOS/Info.plist",
    "content": "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<!DOCTYPE plist PUBLIC \"-//Apple//DTD PLIST 1.0//EN\" \"http://www.apple.com/DTDs/PropertyList-1.0.dtd\">\n<plist version=\"1.0\">\n<dict>\n\t<key>CFBundleDevelopmentRegion</key>\n\t<string>en</string>\n\t<key>CFBundleExecutable</key>\n\t<string>$(EXECUTABLE_NAME)</string>\n\t<key>CFBundleIdentifier</key>\n\t<string>$(PRODUCT_BUNDLE_IDENTIFIER)</string>\n\t<key>CFBundleInfoDictionaryVersion</key>\n\t<string>6.0</string>\n\t<key>CFBundleName</key>\n\t<string>$(PRODUCT_NAME)</string>\n\t<key>CFBundlePackageType</key>\n\t<string>APPL</string>\n\t<key>CFBundleShortVersionString</key>\n\t<string>1.0</string>\n\t<key>CFBundleSignature</key>\n\t<string>????</string>\n\t<key>CFBundleVersion</key>\n\t<string>1</string>\n\t<key>LSRequiresIPhoneOS</key>\n\t<true/>\n\t<key>NSAppTransportSecurity</key>\n\t<dict>\n\t\t<key>NSExceptionDomains</key>\n\t\t<dict>\n\t\t\t<key>localhost</key>\n\t\t\t<dict>\n\t\t\t\t<key>NSExceptionAllowsInsecureHTTPLoads</key>\n\t\t\t\t<true/>\n\t\t\t</dict>\n\t\t</dict>\n\t</dict>\n\t<key>NSLocationWhenInUseUsageDescription</key>\n\t<string></string>\n\t<key>UILaunchStoryboardName</key>\n\t<string>LaunchScreen</string>\n\t<key>UIRequiredDeviceCapabilities</key>\n\t<array>\n\t\t<string>armv7</string>\n\t</array>\n\t<key>UISupportedInterfaceOrientations</key>\n\t<array>\n\t\t<string>UIInterfaceOrientationPortrait</string>\n\t\t<string>UIInterfaceOrientationLandscapeLeft</string>\n\t\t<string>UIInterfaceOrientationLandscapeRight</string>\n\t</array>\n\t<key>UIViewControllerBasedStatusBarAppearance</key>\n\t<false/>\n</dict>\n</plist>\n"
  },
  {
    "path": "example/react_native_windows/ios/react_native_windows-tvOSTests/Info.plist",
    "content": "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<!DOCTYPE plist PUBLIC \"-//Apple//DTD PLIST 1.0//EN\" \"http://www.apple.com/DTDs/PropertyList-1.0.dtd\">\n<plist version=\"1.0\">\n<dict>\n\t<key>CFBundleDevelopmentRegion</key>\n\t<string>en</string>\n\t<key>CFBundleExecutable</key>\n\t<string>$(EXECUTABLE_NAME)</string>\n\t<key>CFBundleIdentifier</key>\n\t<string>$(PRODUCT_BUNDLE_IDENTIFIER)</string>\n\t<key>CFBundleInfoDictionaryVersion</key>\n\t<string>6.0</string>\n\t<key>CFBundleName</key>\n\t<string>$(PRODUCT_NAME)</string>\n\t<key>CFBundlePackageType</key>\n\t<string>BNDL</string>\n\t<key>CFBundleShortVersionString</key>\n\t<string>1.0</string>\n\t<key>CFBundleSignature</key>\n\t<string>????</string>\n\t<key>CFBundleVersion</key>\n\t<string>1</string>\n</dict>\n</plist>\n"
  },
  {
    "path": "example/react_native_windows/ios/react_native_windows.xcodeproj/project.pbxproj",
    "content": "// !$*UTF8*$!\n{\n\tarchiveVersion = 1;\n\tclasses = {\n\t};\n\tobjectVersion = 46;\n\tobjects = {\n\n/* Begin PBXBuildFile section */\n\t\t00E356F31AD99517003FC87E /* react_native_windowsTests.m in Sources */ = {isa = PBXBuildFile; fileRef = 00E356F21AD99517003FC87E /* react_native_windowsTests.m */; };\n\t\t13B07FBC1A68108700A75B9A /* AppDelegate.m in Sources */ = {isa = PBXBuildFile; fileRef = 13B07FB01A68108700A75B9A /* AppDelegate.m */; };\n\t\t13B07FBF1A68108700A75B9A /* Images.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 13B07FB51A68108700A75B9A /* Images.xcassets */; };\n\t\t13B07FC11A68108700A75B9A /* main.m in Sources */ = {isa = PBXBuildFile; fileRef = 13B07FB71A68108700A75B9A /* main.m */; };\n\t\t2D02E4BC1E0B4A80006451C7 /* AppDelegate.m in Sources */ = {isa = PBXBuildFile; fileRef = 13B07FB01A68108700A75B9A /* AppDelegate.m */; };\n\t\t2D02E4BD1E0B4A84006451C7 /* Images.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 13B07FB51A68108700A75B9A /* Images.xcassets */; };\n\t\t2D02E4BF1E0B4AB3006451C7 /* main.m in Sources */ = {isa = PBXBuildFile; fileRef = 13B07FB71A68108700A75B9A /* main.m */; };\n\t\t2DCD954D1E0B4F2C00145EB5 /* react_native_windowsTests.m in Sources */ = {isa = PBXBuildFile; fileRef = 00E356F21AD99517003FC87E /* react_native_windowsTests.m */; };\n\t\t81AB9BB82411601600AC10FF /* LaunchScreen.storyboard in Resources */ = {isa = PBXBuildFile; fileRef = 81AB9BB72411601600AC10FF /* LaunchScreen.storyboard */; };\n/* End PBXBuildFile section */\n\n/* Begin PBXContainerItemProxy section */\n\t\t00E356F41AD99517003FC87E /* PBXContainerItemProxy */ = {\n\t\t\tisa = PBXContainerItemProxy;\n\t\t\tcontainerPortal = 83CBB9F71A601CBA00E9B192 /* Project object */;\n\t\t\tproxyType = 1;\n\t\t\tremoteGlobalIDString = 13B07F861A680F5B00A75B9A;\n\t\t\tremoteInfo = react_native_windows;\n\t\t};\n\t\t2D02E4911E0B4A5D006451C7 /* PBXContainerItemProxy */ = {\n\t\t\tisa = PBXContainerItemProxy;\n\t\t\tcontainerPortal = 83CBB9F71A601CBA00E9B192 /* Project object */;\n\t\t\tproxyType = 1;\n\t\t\tremoteGlobalIDString = 2D02E47A1E0B4A5D006451C7;\n\t\t\tremoteInfo = \"react_native_windows-tvOS\";\n\t\t};\n/* End PBXContainerItemProxy section */\n\n/* Begin PBXFileReference section */\n\t\t008F07F21AC5B25A0029DE68 /* main.jsbundle */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text; path = main.jsbundle; sourceTree = \"<group>\"; };\n\t\t00E356EE1AD99517003FC87E /* react_native_windowsTests.xctest */ = {isa = PBXFileReference; explicitFileType = wrapper.cfbundle; includeInIndex = 0; path = react_native_windowsTests.xctest; sourceTree = BUILT_PRODUCTS_DIR; };\n\t\t00E356F11AD99517003FC87E /* Info.plist */ = {isa = PBXFileReference; lastKnownFileType = text.plist.xml; path = Info.plist; sourceTree = \"<group>\"; };\n\t\t00E356F21AD99517003FC87E /* react_native_windowsTests.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = react_native_windowsTests.m; sourceTree = \"<group>\"; };\n\t\t13B07F961A680F5B00A75B9A /* react_native_windows.app */ = {isa = PBXFileReference; explicitFileType = wrapper.application; includeInIndex = 0; path = react_native_windows.app; sourceTree = BUILT_PRODUCTS_DIR; };\n\t\t13B07FAF1A68108700A75B9A /* AppDelegate.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; name = AppDelegate.h; path = react_native_windows/AppDelegate.h; sourceTree = \"<group>\"; };\n\t\t13B07FB01A68108700A75B9A /* AppDelegate.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; name = AppDelegate.m; path = react_native_windows/AppDelegate.m; sourceTree = \"<group>\"; };\n\t\t13B07FB51A68108700A75B9A /* Images.xcassets */ = {isa = PBXFileReference; lastKnownFileType = folder.assetcatalog; name = Images.xcassets; path = react_native_windows/Images.xcassets; sourceTree = \"<group>\"; };\n\t\t13B07FB61A68108700A75B9A /* Info.plist */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.plist.xml; name = Info.plist; path = react_native_windows/Info.plist; sourceTree = \"<group>\"; };\n\t\t13B07FB71A68108700A75B9A /* main.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; name = main.m; path = react_native_windows/main.m; sourceTree = \"<group>\"; };\n\t\t2D02E47B1E0B4A5D006451C7 /* react_native_windows-tvOS.app */ = {isa = PBXFileReference; explicitFileType = wrapper.application; includeInIndex = 0; path = \"react_native_windows-tvOS.app\"; sourceTree = BUILT_PRODUCTS_DIR; };\n\t\t2D02E4901E0B4A5D006451C7 /* react_native_windows-tvOSTests.xctest */ = {isa = PBXFileReference; explicitFileType = wrapper.cfbundle; includeInIndex = 0; path = \"react_native_windows-tvOSTests.xctest\"; sourceTree = BUILT_PRODUCTS_DIR; };\n\t\t81AB9BB72411601600AC10FF /* LaunchScreen.storyboard */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = file.storyboard; name = LaunchScreen.storyboard; path = react_native_windows/LaunchScreen.storyboard; sourceTree = \"<group>\"; };\n\t\tED297162215061F000B7C4FE /* JavaScriptCore.framework */ = {isa = PBXFileReference; lastKnownFileType = wrapper.framework; name = JavaScriptCore.framework; path = System/Library/Frameworks/JavaScriptCore.framework; sourceTree = SDKROOT; };\n\t\tED2971642150620600B7C4FE /* JavaScriptCore.framework */ = {isa = PBXFileReference; lastKnownFileType = wrapper.framework; name = JavaScriptCore.framework; path = Platforms/AppleTVOS.platform/Developer/SDKs/AppleTVOS12.0.sdk/System/Library/Frameworks/JavaScriptCore.framework; sourceTree = DEVELOPER_DIR; };\n/* End PBXFileReference section */\n\n/* Begin PBXFrameworksBuildPhase section */\n\t\t00E356EB1AD99517003FC87E /* Frameworks */ = {\n\t\t\tisa = PBXFrameworksBuildPhase;\n\t\t\tbuildActionMask = 2147483647;\n\t\t\tfiles = (\n\t\t\t);\n\t\t\trunOnlyForDeploymentPostprocessing = 0;\n\t\t};\n\t\t13B07F8C1A680F5B00A75B9A /* Frameworks */ = {\n\t\t\tisa = PBXFrameworksBuildPhase;\n\t\t\tbuildActionMask = 2147483647;\n\t\t\tfiles = (\n\t\t\t);\n\t\t\trunOnlyForDeploymentPostprocessing = 0;\n\t\t};\n\t\t2D02E4781E0B4A5D006451C7 /* Frameworks */ = {\n\t\t\tisa = PBXFrameworksBuildPhase;\n\t\t\tbuildActionMask = 2147483647;\n\t\t\tfiles = (\n\t\t\t);\n\t\t\trunOnlyForDeploymentPostprocessing = 0;\n\t\t};\n\t\t2D02E48D1E0B4A5D006451C7 /* Frameworks */ = {\n\t\t\tisa = PBXFrameworksBuildPhase;\n\t\t\tbuildActionMask = 2147483647;\n\t\t\tfiles = (\n\t\t\t);\n\t\t\trunOnlyForDeploymentPostprocessing = 0;\n\t\t};\n/* End PBXFrameworksBuildPhase section */\n\n/* Begin PBXGroup section */\n\t\t00E356EF1AD99517003FC87E /* react_native_windowsTests */ = {\n\t\t\tisa = PBXGroup;\n\t\t\tchildren = (\n\t\t\t\t00E356F21AD99517003FC87E /* react_native_windowsTests.m */,\n\t\t\t\t00E356F01AD99517003FC87E /* Supporting Files */,\n\t\t\t);\n\t\t\tpath = react_native_windowsTests;\n\t\t\tsourceTree = \"<group>\";\n\t\t};\n\t\t00E356F01AD99517003FC87E /* Supporting Files */ = {\n\t\t\tisa = PBXGroup;\n\t\t\tchildren = (\n\t\t\t\t00E356F11AD99517003FC87E /* Info.plist */,\n\t\t\t);\n\t\t\tname = \"Supporting Files\";\n\t\t\tsourceTree = \"<group>\";\n\t\t};\n\t\t13B07FAE1A68108700A75B9A /* react_native_windows */ = {\n\t\t\tisa = PBXGroup;\n\t\t\tchildren = (\n\t\t\t\t008F07F21AC5B25A0029DE68 /* main.jsbundle */,\n\t\t\t\t13B07FAF1A68108700A75B9A /* AppDelegate.h */,\n\t\t\t\t13B07FB01A68108700A75B9A /* AppDelegate.m */,\n\t\t\t\t13B07FB51A68108700A75B9A /* Images.xcassets */,\n\t\t\t\t13B07FB61A68108700A75B9A /* Info.plist */,\n\t\t\t\t81AB9BB72411601600AC10FF /* LaunchScreen.storyboard */,\n\t\t\t\t13B07FB71A68108700A75B9A /* main.m */,\n\t\t\t);\n\t\t\tname = react_native_windows;\n\t\t\tsourceTree = \"<group>\";\n\t\t};\n\t\t2D16E6871FA4F8E400B85C8A /* Frameworks */ = {\n\t\t\tisa = PBXGroup;\n\t\t\tchildren = (\n\t\t\t\tED297162215061F000B7C4FE /* JavaScriptCore.framework */,\n\t\t\t\tED2971642150620600B7C4FE /* JavaScriptCore.framework */,\n\t\t\t);\n\t\t\tname = Frameworks;\n\t\t\tsourceTree = \"<group>\";\n\t\t};\n\t\t832341AE1AAA6A7D00B99B32 /* Libraries */ = {\n\t\t\tisa = PBXGroup;\n\t\t\tchildren = (\n\t\t\t);\n\t\t\tname = Libraries;\n\t\t\tsourceTree = \"<group>\";\n\t\t};\n\t\t83CBB9F61A601CBA00E9B192 = {\n\t\t\tisa = PBXGroup;\n\t\t\tchildren = (\n\t\t\t\t13B07FAE1A68108700A75B9A /* react_native_windows */,\n\t\t\t\t832341AE1AAA6A7D00B99B32 /* Libraries */,\n\t\t\t\t00E356EF1AD99517003FC87E /* react_native_windowsTests */,\n\t\t\t\t83CBBA001A601CBA00E9B192 /* Products */,\n\t\t\t\t2D16E6871FA4F8E400B85C8A /* Frameworks */,\n\t\t\t);\n\t\t\tindentWidth = 2;\n\t\t\tsourceTree = \"<group>\";\n\t\t\ttabWidth = 2;\n\t\t\tusesTabs = 0;\n\t\t};\n\t\t83CBBA001A601CBA00E9B192 /* Products */ = {\n\t\t\tisa = PBXGroup;\n\t\t\tchildren = (\n\t\t\t\t13B07F961A680F5B00A75B9A /* react_native_windows.app */,\n\t\t\t\t00E356EE1AD99517003FC87E /* react_native_windowsTests.xctest */,\n\t\t\t\t2D02E47B1E0B4A5D006451C7 /* react_native_windows-tvOS.app */,\n\t\t\t\t2D02E4901E0B4A5D006451C7 /* react_native_windows-tvOSTests.xctest */,\n\t\t\t);\n\t\t\tname = Products;\n\t\t\tsourceTree = \"<group>\";\n\t\t};\n/* End PBXGroup section */\n\n/* Begin PBXNativeTarget section */\n\t\t00E356ED1AD99517003FC87E /* react_native_windowsTests */ = {\n\t\t\tisa = PBXNativeTarget;\n\t\t\tbuildConfigurationList = 00E357021AD99517003FC87E /* Build configuration list for PBXNativeTarget \"react_native_windowsTests\" */;\n\t\t\tbuildPhases = (\n\t\t\t\t00E356EA1AD99517003FC87E /* Sources */,\n\t\t\t\t00E356EB1AD99517003FC87E /* Frameworks */,\n\t\t\t\t00E356EC1AD99517003FC87E /* Resources */,\n\t\t\t);\n\t\t\tbuildRules = (\n\t\t\t);\n\t\t\tdependencies = (\n\t\t\t\t00E356F51AD99517003FC87E /* PBXTargetDependency */,\n\t\t\t);\n\t\t\tname = react_native_windowsTests;\n\t\t\tproductName = react_native_windowsTests;\n\t\t\tproductReference = 00E356EE1AD99517003FC87E /* react_native_windowsTests.xctest */;\n\t\t\tproductType = \"com.apple.product-type.bundle.unit-test\";\n\t\t};\n\t\t13B07F861A680F5B00A75B9A /* react_native_windows */ = {\n\t\t\tisa = PBXNativeTarget;\n\t\t\tbuildConfigurationList = 13B07F931A680F5B00A75B9A /* Build configuration list for PBXNativeTarget \"react_native_windows\" */;\n\t\t\tbuildPhases = (\n\t\t\t\tFD10A7F022414F080027D42C /* Start Packager */,\n\t\t\t\t13B07F871A680F5B00A75B9A /* Sources */,\n\t\t\t\t13B07F8C1A680F5B00A75B9A /* Frameworks */,\n\t\t\t\t13B07F8E1A680F5B00A75B9A /* Resources */,\n\t\t\t\t00DD1BFF1BD5951E006B06BC /* Bundle React Native code and images */,\n\t\t\t);\n\t\t\tbuildRules = (\n\t\t\t);\n\t\t\tdependencies = (\n\t\t\t);\n\t\t\tname = react_native_windows;\n\t\t\tproductName = react_native_windows;\n\t\t\tproductReference = 13B07F961A680F5B00A75B9A /* react_native_windows.app */;\n\t\t\tproductType = \"com.apple.product-type.application\";\n\t\t};\n\t\t2D02E47A1E0B4A5D006451C7 /* react_native_windows-tvOS */ = {\n\t\t\tisa = PBXNativeTarget;\n\t\t\tbuildConfigurationList = 2D02E4BA1E0B4A5E006451C7 /* Build configuration list for PBXNativeTarget \"react_native_windows-tvOS\" */;\n\t\t\tbuildPhases = (\n\t\t\t\tFD10A7F122414F3F0027D42C /* Start Packager */,\n\t\t\t\t2D02E4771E0B4A5D006451C7 /* Sources */,\n\t\t\t\t2D02E4781E0B4A5D006451C7 /* Frameworks */,\n\t\t\t\t2D02E4791E0B4A5D006451C7 /* Resources */,\n\t\t\t\t2D02E4CB1E0B4B27006451C7 /* Bundle React Native Code And Images */,\n\t\t\t);\n\t\t\tbuildRules = (\n\t\t\t);\n\t\t\tdependencies = (\n\t\t\t);\n\t\t\tname = \"react_native_windows-tvOS\";\n\t\t\tproductName = \"react_native_windows-tvOS\";\n\t\t\tproductReference = 2D02E47B1E0B4A5D006451C7 /* react_native_windows-tvOS.app */;\n\t\t\tproductType = \"com.apple.product-type.application\";\n\t\t};\n\t\t2D02E48F1E0B4A5D006451C7 /* react_native_windows-tvOSTests */ = {\n\t\t\tisa = PBXNativeTarget;\n\t\t\tbuildConfigurationList = 2D02E4BB1E0B4A5E006451C7 /* Build configuration list for PBXNativeTarget \"react_native_windows-tvOSTests\" */;\n\t\t\tbuildPhases = (\n\t\t\t\t2D02E48C1E0B4A5D006451C7 /* Sources */,\n\t\t\t\t2D02E48D1E0B4A5D006451C7 /* Frameworks */,\n\t\t\t\t2D02E48E1E0B4A5D006451C7 /* Resources */,\n\t\t\t);\n\t\t\tbuildRules = (\n\t\t\t);\n\t\t\tdependencies = (\n\t\t\t\t2D02E4921E0B4A5D006451C7 /* PBXTargetDependency */,\n\t\t\t);\n\t\t\tname = \"react_native_windows-tvOSTests\";\n\t\t\tproductName = \"react_native_windows-tvOSTests\";\n\t\t\tproductReference = 2D02E4901E0B4A5D006451C7 /* react_native_windows-tvOSTests.xctest */;\n\t\t\tproductType = \"com.apple.product-type.bundle.unit-test\";\n\t\t};\n/* End PBXNativeTarget section */\n\n/* Begin PBXProject section */\n\t\t83CBB9F71A601CBA00E9B192 /* Project object */ = {\n\t\t\tisa = PBXProject;\n\t\t\tattributes = {\n\t\t\t\tLastUpgradeCheck = 1130;\n\t\t\t\tTargetAttributes = {\n\t\t\t\t\t00E356ED1AD99517003FC87E = {\n\t\t\t\t\t\tCreatedOnToolsVersion = 6.2;\n\t\t\t\t\t\tTestTargetID = 13B07F861A680F5B00A75B9A;\n\t\t\t\t\t};\n\t\t\t\t\t13B07F861A680F5B00A75B9A = {\n\t\t\t\t\t\tLastSwiftMigration = 1120;\n\t\t\t\t\t};\n\t\t\t\t\t2D02E47A1E0B4A5D006451C7 = {\n\t\t\t\t\t\tCreatedOnToolsVersion = 8.2.1;\n\t\t\t\t\t\tProvisioningStyle = Automatic;\n\t\t\t\t\t};\n\t\t\t\t\t2D02E48F1E0B4A5D006451C7 = {\n\t\t\t\t\t\tCreatedOnToolsVersion = 8.2.1;\n\t\t\t\t\t\tProvisioningStyle = Automatic;\n\t\t\t\t\t\tTestTargetID = 2D02E47A1E0B4A5D006451C7;\n\t\t\t\t\t};\n\t\t\t\t};\n\t\t\t};\n\t\t\tbuildConfigurationList = 83CBB9FA1A601CBA00E9B192 /* Build configuration list for PBXProject \"react_native_windows\" */;\n\t\t\tcompatibilityVersion = \"Xcode 3.2\";\n\t\t\tdevelopmentRegion = en;\n\t\t\thasScannedForEncodings = 0;\n\t\t\tknownRegions = (\n\t\t\t\ten,\n\t\t\t\tBase,\n\t\t\t);\n\t\t\tmainGroup = 83CBB9F61A601CBA00E9B192;\n\t\t\tproductRefGroup = 83CBBA001A601CBA00E9B192 /* Products */;\n\t\t\tprojectDirPath = \"\";\n\t\t\tprojectRoot = \"\";\n\t\t\ttargets = (\n\t\t\t\t13B07F861A680F5B00A75B9A /* react_native_windows */,\n\t\t\t\t00E356ED1AD99517003FC87E /* react_native_windowsTests */,\n\t\t\t\t2D02E47A1E0B4A5D006451C7 /* react_native_windows-tvOS */,\n\t\t\t\t2D02E48F1E0B4A5D006451C7 /* react_native_windows-tvOSTests */,\n\t\t\t);\n\t\t};\n/* End PBXProject section */\n\n/* Begin PBXResourcesBuildPhase section */\n\t\t00E356EC1AD99517003FC87E /* Resources */ = {\n\t\t\tisa = PBXResourcesBuildPhase;\n\t\t\tbuildActionMask = 2147483647;\n\t\t\tfiles = (\n\t\t\t);\n\t\t\trunOnlyForDeploymentPostprocessing = 0;\n\t\t};\n\t\t13B07F8E1A680F5B00A75B9A /* Resources */ = {\n\t\t\tisa = PBXResourcesBuildPhase;\n\t\t\tbuildActionMask = 2147483647;\n\t\t\tfiles = (\n\t\t\t\t81AB9BB82411601600AC10FF /* LaunchScreen.storyboard in Resources */,\n\t\t\t\t13B07FBF1A68108700A75B9A /* Images.xcassets in Resources */,\n\t\t\t);\n\t\t\trunOnlyForDeploymentPostprocessing = 0;\n\t\t};\n\t\t2D02E4791E0B4A5D006451C7 /* Resources */ = {\n\t\t\tisa = PBXResourcesBuildPhase;\n\t\t\tbuildActionMask = 2147483647;\n\t\t\tfiles = (\n\t\t\t\t2D02E4BD1E0B4A84006451C7 /* Images.xcassets in Resources */,\n\t\t\t);\n\t\t\trunOnlyForDeploymentPostprocessing = 0;\n\t\t};\n\t\t2D02E48E1E0B4A5D006451C7 /* Resources */ = {\n\t\t\tisa = PBXResourcesBuildPhase;\n\t\t\tbuildActionMask = 2147483647;\n\t\t\tfiles = (\n\t\t\t);\n\t\t\trunOnlyForDeploymentPostprocessing = 0;\n\t\t};\n/* End PBXResourcesBuildPhase section */\n\n/* Begin PBXShellScriptBuildPhase section */\n\t\t00DD1BFF1BD5951E006B06BC /* Bundle React Native code and images */ = {\n\t\t\tisa = PBXShellScriptBuildPhase;\n\t\t\tbuildActionMask = 2147483647;\n\t\t\tfiles = (\n\t\t\t);\n\t\t\tinputPaths = (\n\t\t\t);\n\t\t\tname = \"Bundle React Native code and images\";\n\t\t\toutputPaths = (\n\t\t\t);\n\t\t\trunOnlyForDeploymentPostprocessing = 0;\n\t\t\tshellPath = /bin/sh;\n\t\t\tshellScript = \"export NODE_BINARY=node\\n../node_modules/react-native/scripts/react-native-xcode.sh\";\n\t\t};\n\t\t2D02E4CB1E0B4B27006451C7 /* Bundle React Native Code And Images */ = {\n\t\t\tisa = PBXShellScriptBuildPhase;\n\t\t\tbuildActionMask = 2147483647;\n\t\t\tfiles = (\n\t\t\t);\n\t\t\tinputPaths = (\n\t\t\t);\n\t\t\tname = \"Bundle React Native Code And Images\";\n\t\t\toutputPaths = (\n\t\t\t);\n\t\t\trunOnlyForDeploymentPostprocessing = 0;\n\t\t\tshellPath = /bin/sh;\n\t\t\tshellScript = \"export NODE_BINARY=node\\n../node_modules/react-native/scripts/react-native-xcode.sh\";\n\t\t};\n\t\tFD10A7F022414F080027D42C /* Start Packager */ = {\n\t\t\tisa = PBXShellScriptBuildPhase;\n\t\t\tbuildActionMask = 2147483647;\n\t\t\tfiles = (\n\t\t\t);\n\t\t\tinputFileListPaths = (\n\t\t\t);\n\t\t\tinputPaths = (\n\t\t\t);\n\t\t\tname = \"Start Packager\";\n\t\t\toutputFileListPaths = (\n\t\t\t);\n\t\t\toutputPaths = (\n\t\t\t);\n\t\t\trunOnlyForDeploymentPostprocessing = 0;\n\t\t\tshellPath = /bin/sh;\n\t\t\tshellScript = \"export RCT_METRO_PORT=\\\"${RCT_METRO_PORT:=8081}\\\"\\necho \\\"export RCT_METRO_PORT=${RCT_METRO_PORT}\\\" > \\\"${SRCROOT}/../node_modules/react-native/scripts/.packager.env\\\"\\nif [ -z \\\"${RCT_NO_LAUNCH_PACKAGER+xxx}\\\" ] ; then\\n  if nc -w 5 -z localhost ${RCT_METRO_PORT} ; then\\n    if ! curl -s \\\"http://localhost:${RCT_METRO_PORT}/status\\\" | grep -q \\\"packager-status:running\\\" ; then\\n      echo \\\"Port ${RCT_METRO_PORT} already in use, packager is either not running or not running correctly\\\"\\n      exit 2\\n    fi\\n  else\\n    open \\\"$SRCROOT/../node_modules/react-native/scripts/launchPackager.command\\\" || echo \\\"Can't start packager automatically\\\"\\n  fi\\nfi\\n\";\n\t\t\tshowEnvVarsInLog = 0;\n\t\t};\n\t\tFD10A7F122414F3F0027D42C /* Start Packager */ = {\n\t\t\tisa = PBXShellScriptBuildPhase;\n\t\t\tbuildActionMask = 2147483647;\n\t\t\tfiles = (\n\t\t\t);\n\t\t\tinputFileListPaths = (\n\t\t\t);\n\t\t\tinputPaths = (\n\t\t\t);\n\t\t\tname = \"Start Packager\";\n\t\t\toutputFileListPaths = (\n\t\t\t);\n\t\t\toutputPaths = (\n\t\t\t);\n\t\t\trunOnlyForDeploymentPostprocessing = 0;\n\t\t\tshellPath = /bin/sh;\n\t\t\tshellScript = \"export RCT_METRO_PORT=\\\"${RCT_METRO_PORT:=8081}\\\"\\necho \\\"export RCT_METRO_PORT=${RCT_METRO_PORT}\\\" > \\\"${SRCROOT}/../node_modules/react-native/scripts/.packager.env\\\"\\nif [ -z \\\"${RCT_NO_LAUNCH_PACKAGER+xxx}\\\" ] ; then\\n  if nc -w 5 -z localhost ${RCT_METRO_PORT} ; then\\n    if ! curl -s \\\"http://localhost:${RCT_METRO_PORT}/status\\\" | grep -q \\\"packager-status:running\\\" ; then\\n      echo \\\"Port ${RCT_METRO_PORT} already in use, packager is either not running or not running correctly\\\"\\n      exit 2\\n    fi\\n  else\\n    open \\\"$SRCROOT/../node_modules/react-native/scripts/launchPackager.command\\\" || echo \\\"Can't start packager automatically\\\"\\n  fi\\nfi\\n\";\n\t\t\tshowEnvVarsInLog = 0;\n\t\t};\n/* End PBXShellScriptBuildPhase section */\n\n/* Begin PBXSourcesBuildPhase section */\n\t\t00E356EA1AD99517003FC87E /* Sources */ = {\n\t\t\tisa = PBXSourcesBuildPhase;\n\t\t\tbuildActionMask = 2147483647;\n\t\t\tfiles = (\n\t\t\t\t00E356F31AD99517003FC87E /* react_native_windowsTests.m in Sources */,\n\t\t\t);\n\t\t\trunOnlyForDeploymentPostprocessing = 0;\n\t\t};\n\t\t13B07F871A680F5B00A75B9A /* Sources */ = {\n\t\t\tisa = PBXSourcesBuildPhase;\n\t\t\tbuildActionMask = 2147483647;\n\t\t\tfiles = (\n\t\t\t\t13B07FBC1A68108700A75B9A /* AppDelegate.m in Sources */,\n\t\t\t\t13B07FC11A68108700A75B9A /* main.m in Sources */,\n\t\t\t);\n\t\t\trunOnlyForDeploymentPostprocessing = 0;\n\t\t};\n\t\t2D02E4771E0B4A5D006451C7 /* Sources */ = {\n\t\t\tisa = PBXSourcesBuildPhase;\n\t\t\tbuildActionMask = 2147483647;\n\t\t\tfiles = (\n\t\t\t\t2D02E4BF1E0B4AB3006451C7 /* main.m in Sources */,\n\t\t\t\t2D02E4BC1E0B4A80006451C7 /* AppDelegate.m in Sources */,\n\t\t\t);\n\t\t\trunOnlyForDeploymentPostprocessing = 0;\n\t\t};\n\t\t2D02E48C1E0B4A5D006451C7 /* Sources */ = {\n\t\t\tisa = PBXSourcesBuildPhase;\n\t\t\tbuildActionMask = 2147483647;\n\t\t\tfiles = (\n\t\t\t\t2DCD954D1E0B4F2C00145EB5 /* react_native_windowsTests.m in Sources */,\n\t\t\t);\n\t\t\trunOnlyForDeploymentPostprocessing = 0;\n\t\t};\n/* End PBXSourcesBuildPhase section */\n\n/* Begin PBXTargetDependency section */\n\t\t00E356F51AD99517003FC87E /* PBXTargetDependency */ = {\n\t\t\tisa = PBXTargetDependency;\n\t\t\ttarget = 13B07F861A680F5B00A75B9A /* react_native_windows */;\n\t\t\ttargetProxy = 00E356F41AD99517003FC87E /* PBXContainerItemProxy */;\n\t\t};\n\t\t2D02E4921E0B4A5D006451C7 /* PBXTargetDependency */ = {\n\t\t\tisa = PBXTargetDependency;\n\t\t\ttarget = 2D02E47A1E0B4A5D006451C7 /* react_native_windows-tvOS */;\n\t\t\ttargetProxy = 2D02E4911E0B4A5D006451C7 /* PBXContainerItemProxy */;\n\t\t};\n/* End PBXTargetDependency section */\n\n/* Begin XCBuildConfiguration section */\n\t\t00E356F61AD99517003FC87E /* Debug */ = {\n\t\t\tisa = XCBuildConfiguration;\n\t\t\tbuildSettings = {\n\t\t\t\tBUNDLE_LOADER = \"$(TEST_HOST)\";\n\t\t\t\tGCC_PREPROCESSOR_DEFINITIONS = (\n\t\t\t\t\t\"DEBUG=1\",\n\t\t\t\t\t\"$(inherited)\",\n\t\t\t\t);\n\t\t\t\tINFOPLIST_FILE = react_native_windowsTests/Info.plist;\n\t\t\t\tIPHONEOS_DEPLOYMENT_TARGET = 10.0;\n\t\t\t\tLD_RUNPATH_SEARCH_PATHS = \"$(inherited) @executable_path/Frameworks @loader_path/Frameworks\";\n\t\t\t\tOTHER_LDFLAGS = (\n\t\t\t\t\t\"-ObjC\",\n\t\t\t\t\t\"-lc++\",\n\t\t\t\t\t\"$(inherited)\",\n\t\t\t\t);\n\t\t\t\tPRODUCT_BUNDLE_IDENTIFIER = \"org.reactjs.native.example.$(PRODUCT_NAME:rfc1034identifier)\";\n\t\t\t\tPRODUCT_NAME = \"$(TARGET_NAME)\";\n\t\t\t\tTEST_HOST = \"$(BUILT_PRODUCTS_DIR)/react_native_windows.app/react_native_windows\";\n\t\t\t};\n\t\t\tname = Debug;\n\t\t};\n\t\t00E356F71AD99517003FC87E /* Release */ = {\n\t\t\tisa = XCBuildConfiguration;\n\t\t\tbuildSettings = {\n\t\t\t\tBUNDLE_LOADER = \"$(TEST_HOST)\";\n\t\t\t\tCOPY_PHASE_STRIP = NO;\n\t\t\t\tINFOPLIST_FILE = react_native_windowsTests/Info.plist;\n\t\t\t\tIPHONEOS_DEPLOYMENT_TARGET = 10.0;\n\t\t\t\tLD_RUNPATH_SEARCH_PATHS = \"$(inherited) @executable_path/Frameworks @loader_path/Frameworks\";\n\t\t\t\tOTHER_LDFLAGS = (\n\t\t\t\t\t\"-ObjC\",\n\t\t\t\t\t\"-lc++\",\n\t\t\t\t\t\"$(inherited)\",\n\t\t\t\t);\n\t\t\t\tPRODUCT_BUNDLE_IDENTIFIER = \"org.reactjs.native.example.$(PRODUCT_NAME:rfc1034identifier)\";\n\t\t\t\tPRODUCT_NAME = \"$(TARGET_NAME)\";\n\t\t\t\tTEST_HOST = \"$(BUILT_PRODUCTS_DIR)/react_native_windows.app/react_native_windows\";\n\t\t\t};\n\t\t\tname = Release;\n\t\t};\n\t\t13B07F941A680F5B00A75B9A /* Debug */ = {\n\t\t\tisa = XCBuildConfiguration;\n\t\t\tbuildSettings = {\n\t\t\t\tASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;\n\t\t\t\tCLANG_ENABLE_MODULES = YES;\n\t\t\t\tCURRENT_PROJECT_VERSION = 1;\n\t\t\t\tENABLE_BITCODE = NO;\n\t\t\t\tINFOPLIST_FILE = react_native_windows/Info.plist;\n\t\t\t\tLD_RUNPATH_SEARCH_PATHS = \"$(inherited) @executable_path/Frameworks\";\n\t\t\t\tOTHER_LDFLAGS = (\n\t\t\t\t\t\"$(inherited)\",\n\t\t\t\t\t\"-ObjC\",\n\t\t\t\t\t\"-lc++\",\n\t\t\t\t);\n\t\t\t\tPRODUCT_BUNDLE_IDENTIFIER = \"org.reactjs.native.example.$(PRODUCT_NAME:rfc1034identifier)\";\n\t\t\t\tPRODUCT_NAME = react_native_windows;\n\t\t\t\tSWIFT_OPTIMIZATION_LEVEL = \"-Onone\";\n\t\t\t\tSWIFT_VERSION = 5.0;\n\t\t\t\tVERSIONING_SYSTEM = \"apple-generic\";\n\t\t\t};\n\t\t\tname = Debug;\n\t\t};\n\t\t13B07F951A680F5B00A75B9A /* Release */ = {\n\t\t\tisa = XCBuildConfiguration;\n\t\t\tbuildSettings = {\n\t\t\t\tASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;\n\t\t\t\tCLANG_ENABLE_MODULES = YES;\n\t\t\t\tCURRENT_PROJECT_VERSION = 1;\n\t\t\t\tINFOPLIST_FILE = react_native_windows/Info.plist;\n\t\t\t\tLD_RUNPATH_SEARCH_PATHS = \"$(inherited) @executable_path/Frameworks\";\n\t\t\t\tOTHER_LDFLAGS = (\n\t\t\t\t\t\"$(inherited)\",\n\t\t\t\t\t\"-ObjC\",\n\t\t\t\t\t\"-lc++\",\n\t\t\t\t);\n\t\t\t\tPRODUCT_BUNDLE_IDENTIFIER = \"org.reactjs.native.example.$(PRODUCT_NAME:rfc1034identifier)\";\n\t\t\t\tPRODUCT_NAME = react_native_windows;\n\t\t\t\tSWIFT_VERSION = 5.0;\n\t\t\t\tVERSIONING_SYSTEM = \"apple-generic\";\n\t\t\t};\n\t\t\tname = Release;\n\t\t};\n\t\t2D02E4971E0B4A5E006451C7 /* Debug */ = {\n\t\t\tisa = XCBuildConfiguration;\n\t\t\tbuildSettings = {\n\t\t\t\tASSETCATALOG_COMPILER_APPICON_NAME = \"App Icon & Top Shelf Image\";\n\t\t\t\tASSETCATALOG_COMPILER_LAUNCHIMAGE_NAME = LaunchImage;\n\t\t\t\tCLANG_ANALYZER_NONNULL = YES;\n\t\t\t\tCLANG_WARN_DOCUMENTATION_COMMENTS = YES;\n\t\t\t\tCLANG_WARN_INFINITE_RECURSION = YES;\n\t\t\t\tCLANG_WARN_SUSPICIOUS_MOVE = YES;\n\t\t\t\tDEBUG_INFORMATION_FORMAT = dwarf;\n\t\t\t\tENABLE_TESTABILITY = YES;\n\t\t\t\tGCC_NO_COMMON_BLOCKS = YES;\n\t\t\t\tINFOPLIST_FILE = \"react_native_windows-tvOS/Info.plist\";\n\t\t\t\tLD_RUNPATH_SEARCH_PATHS = \"$(inherited) @executable_path/Frameworks\";\n\t\t\t\tOTHER_LDFLAGS = (\n\t\t\t\t\t\"$(inherited)\",\n\t\t\t\t\t\"-ObjC\",\n\t\t\t\t\t\"-lc++\",\n\t\t\t\t);\n\t\t\t\tPRODUCT_BUNDLE_IDENTIFIER = \"org.reactjs.native.example.react_native_windows-tvOS\";\n\t\t\t\tPRODUCT_NAME = \"$(TARGET_NAME)\";\n\t\t\t\tSDKROOT = appletvos;\n\t\t\t\tTARGETED_DEVICE_FAMILY = 3;\n\t\t\t\tTVOS_DEPLOYMENT_TARGET = 10.0;\n\t\t\t};\n\t\t\tname = Debug;\n\t\t};\n\t\t2D02E4981E0B4A5E006451C7 /* Release */ = {\n\t\t\tisa = XCBuildConfiguration;\n\t\t\tbuildSettings = {\n\t\t\t\tASSETCATALOG_COMPILER_APPICON_NAME = \"App Icon & Top Shelf Image\";\n\t\t\t\tASSETCATALOG_COMPILER_LAUNCHIMAGE_NAME = LaunchImage;\n\t\t\t\tCLANG_ANALYZER_NONNULL = YES;\n\t\t\t\tCLANG_WARN_DOCUMENTATION_COMMENTS = YES;\n\t\t\t\tCLANG_WARN_INFINITE_RECURSION = YES;\n\t\t\t\tCLANG_WARN_SUSPICIOUS_MOVE = YES;\n\t\t\t\tCOPY_PHASE_STRIP = NO;\n\t\t\t\tDEBUG_INFORMATION_FORMAT = \"dwarf-with-dsym\";\n\t\t\t\tGCC_NO_COMMON_BLOCKS = YES;\n\t\t\t\tINFOPLIST_FILE = \"react_native_windows-tvOS/Info.plist\";\n\t\t\t\tLD_RUNPATH_SEARCH_PATHS = \"$(inherited) @executable_path/Frameworks\";\n\t\t\t\tOTHER_LDFLAGS = (\n\t\t\t\t\t\"$(inherited)\",\n\t\t\t\t\t\"-ObjC\",\n\t\t\t\t\t\"-lc++\",\n\t\t\t\t);\n\t\t\t\tPRODUCT_BUNDLE_IDENTIFIER = \"org.reactjs.native.example.react_native_windows-tvOS\";\n\t\t\t\tPRODUCT_NAME = \"$(TARGET_NAME)\";\n\t\t\t\tSDKROOT = appletvos;\n\t\t\t\tTARGETED_DEVICE_FAMILY = 3;\n\t\t\t\tTVOS_DEPLOYMENT_TARGET = 10.0;\n\t\t\t};\n\t\t\tname = Release;\n\t\t};\n\t\t2D02E4991E0B4A5E006451C7 /* Debug */ = {\n\t\t\tisa = XCBuildConfiguration;\n\t\t\tbuildSettings = {\n\t\t\t\tBUNDLE_LOADER = \"$(TEST_HOST)\";\n\t\t\t\tCLANG_ANALYZER_NONNULL = YES;\n\t\t\t\tCLANG_WARN_DOCUMENTATION_COMMENTS = YES;\n\t\t\t\tCLANG_WARN_INFINITE_RECURSION = YES;\n\t\t\t\tCLANG_WARN_SUSPICIOUS_MOVE = YES;\n\t\t\t\tDEBUG_INFORMATION_FORMAT = dwarf;\n\t\t\t\tENABLE_TESTABILITY = YES;\n\t\t\t\tGCC_NO_COMMON_BLOCKS = YES;\n\t\t\t\tINFOPLIST_FILE = \"react_native_windows-tvOSTests/Info.plist\";\n\t\t\t\tLD_RUNPATH_SEARCH_PATHS = \"$(inherited) @executable_path/Frameworks @loader_path/Frameworks\";\n\t\t\t\tOTHER_LDFLAGS = (\n\t\t\t\t\t\"$(inherited)\",\n\t\t\t\t\t\"-ObjC\",\n\t\t\t\t\t\"-lc++\",\n\t\t\t\t);\n\t\t\t\tPRODUCT_BUNDLE_IDENTIFIER = \"org.reactjs.native.example.react_native_windows-tvOSTests\";\n\t\t\t\tPRODUCT_NAME = \"$(TARGET_NAME)\";\n\t\t\t\tSDKROOT = appletvos;\n\t\t\t\tTEST_HOST = \"$(BUILT_PRODUCTS_DIR)/react_native_windows-tvOS.app/react_native_windows-tvOS\";\n\t\t\t\tTVOS_DEPLOYMENT_TARGET = 10.1;\n\t\t\t};\n\t\t\tname = Debug;\n\t\t};\n\t\t2D02E49A1E0B4A5E006451C7 /* Release */ = {\n\t\t\tisa = XCBuildConfiguration;\n\t\t\tbuildSettings = {\n\t\t\t\tBUNDLE_LOADER = \"$(TEST_HOST)\";\n\t\t\t\tCLANG_ANALYZER_NONNULL = YES;\n\t\t\t\tCLANG_WARN_DOCUMENTATION_COMMENTS = YES;\n\t\t\t\tCLANG_WARN_INFINITE_RECURSION = YES;\n\t\t\t\tCLANG_WARN_SUSPICIOUS_MOVE = YES;\n\t\t\t\tCOPY_PHASE_STRIP = NO;\n\t\t\t\tDEBUG_INFORMATION_FORMAT = \"dwarf-with-dsym\";\n\t\t\t\tGCC_NO_COMMON_BLOCKS = YES;\n\t\t\t\tINFOPLIST_FILE = \"react_native_windows-tvOSTests/Info.plist\";\n\t\t\t\tLD_RUNPATH_SEARCH_PATHS = \"$(inherited) @executable_path/Frameworks @loader_path/Frameworks\";\n\t\t\t\tOTHER_LDFLAGS = (\n\t\t\t\t\t\"$(inherited)\",\n\t\t\t\t\t\"-ObjC\",\n\t\t\t\t\t\"-lc++\",\n\t\t\t\t);\n\t\t\t\tPRODUCT_BUNDLE_IDENTIFIER = \"org.reactjs.native.example.react_native_windows-tvOSTests\";\n\t\t\t\tPRODUCT_NAME = \"$(TARGET_NAME)\";\n\t\t\t\tSDKROOT = appletvos;\n\t\t\t\tTEST_HOST = \"$(BUILT_PRODUCTS_DIR)/react_native_windows-tvOS.app/react_native_windows-tvOS\";\n\t\t\t\tTVOS_DEPLOYMENT_TARGET = 10.1;\n\t\t\t};\n\t\t\tname = Release;\n\t\t};\n\t\t83CBBA201A601CBA00E9B192 /* Debug */ = {\n\t\t\tisa = XCBuildConfiguration;\n\t\t\tbuildSettings = {\n\t\t\t\tALWAYS_SEARCH_USER_PATHS = NO;\n\t\t\t\tCLANG_ANALYZER_LOCALIZABILITY_NONLOCALIZED = YES;\n\t\t\t\tCLANG_CXX_LANGUAGE_STANDARD = \"gnu++0x\";\n\t\t\t\tCLANG_CXX_LIBRARY = \"libc++\";\n\t\t\t\tCLANG_ENABLE_MODULES = YES;\n\t\t\t\tCLANG_ENABLE_OBJC_ARC = YES;\n\t\t\t\tCLANG_WARN_BLOCK_CAPTURE_AUTORELEASING = YES;\n\t\t\t\tCLANG_WARN_BOOL_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_COMMA = YES;\n\t\t\t\tCLANG_WARN_CONSTANT_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_DEPRECATED_OBJC_IMPLEMENTATIONS = YES;\n\t\t\t\tCLANG_WARN_DIRECT_OBJC_ISA_USAGE = YES_ERROR;\n\t\t\t\tCLANG_WARN_EMPTY_BODY = YES;\n\t\t\t\tCLANG_WARN_ENUM_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_INFINITE_RECURSION = YES;\n\t\t\t\tCLANG_WARN_INT_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_NON_LITERAL_NULL_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_OBJC_IMPLICIT_RETAIN_SELF = YES;\n\t\t\t\tCLANG_WARN_OBJC_LITERAL_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_OBJC_ROOT_CLASS = YES_ERROR;\n\t\t\t\tCLANG_WARN_RANGE_LOOP_ANALYSIS = YES;\n\t\t\t\tCLANG_WARN_STRICT_PROTOTYPES = YES;\n\t\t\t\tCLANG_WARN_SUSPICIOUS_MOVE = YES;\n\t\t\t\tCLANG_WARN_UNREACHABLE_CODE = YES;\n\t\t\t\tCLANG_WARN__DUPLICATE_METHOD_MATCH = YES;\n\t\t\t\t\"CODE_SIGN_IDENTITY[sdk=iphoneos*]\" = \"iPhone Developer\";\n\t\t\t\tCOPY_PHASE_STRIP = NO;\n\t\t\t\tENABLE_STRICT_OBJC_MSGSEND = YES;\n\t\t\t\tENABLE_TESTABILITY = YES;\n\t\t\t\tGCC_C_LANGUAGE_STANDARD = gnu99;\n\t\t\t\tGCC_DYNAMIC_NO_PIC = NO;\n\t\t\t\tGCC_NO_COMMON_BLOCKS = YES;\n\t\t\t\tGCC_OPTIMIZATION_LEVEL = 0;\n\t\t\t\tGCC_PREPROCESSOR_DEFINITIONS = (\n\t\t\t\t\t\"DEBUG=1\",\n\t\t\t\t\t\"$(inherited)\",\n\t\t\t\t);\n\t\t\t\tGCC_SYMBOLS_PRIVATE_EXTERN = NO;\n\t\t\t\tGCC_WARN_64_TO_32_BIT_CONVERSION = YES;\n\t\t\t\tGCC_WARN_ABOUT_RETURN_TYPE = YES_ERROR;\n\t\t\t\tGCC_WARN_UNDECLARED_SELECTOR = YES;\n\t\t\t\tGCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE;\n\t\t\t\tGCC_WARN_UNUSED_FUNCTION = YES;\n\t\t\t\tGCC_WARN_UNUSED_VARIABLE = YES;\n\t\t\t\tIPHONEOS_DEPLOYMENT_TARGET = 10.0;\n\t\t\t\tLD_RUNPATH_SEARCH_PATHS = \"/usr/lib/swift $(inherited)\";\n\t\t\t\tLIBRARY_SEARCH_PATHS = (\n\t\t\t\t\t\"\\\"$(TOOLCHAIN_DIR)/usr/lib/swift/$(PLATFORM_NAME)\\\"\",\n\t\t\t\t\t\"\\\"$(TOOLCHAIN_DIR)/usr/lib/swift-5.0/$(PLATFORM_NAME)\\\"\",\n\t\t\t\t\t\"\\\"$(inherited)\\\"\",\n\t\t\t\t);\n\t\t\t\tMTL_ENABLE_DEBUG_INFO = YES;\n\t\t\t\tONLY_ACTIVE_ARCH = YES;\n\t\t\t\tSDKROOT = iphoneos;\n\t\t\t};\n\t\t\tname = Debug;\n\t\t};\n\t\t83CBBA211A601CBA00E9B192 /* Release */ = {\n\t\t\tisa = XCBuildConfiguration;\n\t\t\tbuildSettings = {\n\t\t\t\tALWAYS_SEARCH_USER_PATHS = NO;\n\t\t\t\tCLANG_ANALYZER_LOCALIZABILITY_NONLOCALIZED = YES;\n\t\t\t\tCLANG_CXX_LANGUAGE_STANDARD = \"gnu++0x\";\n\t\t\t\tCLANG_CXX_LIBRARY = \"libc++\";\n\t\t\t\tCLANG_ENABLE_MODULES = YES;\n\t\t\t\tCLANG_ENABLE_OBJC_ARC = YES;\n\t\t\t\tCLANG_WARN_BLOCK_CAPTURE_AUTORELEASING = YES;\n\t\t\t\tCLANG_WARN_BOOL_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_COMMA = YES;\n\t\t\t\tCLANG_WARN_CONSTANT_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_DEPRECATED_OBJC_IMPLEMENTATIONS = YES;\n\t\t\t\tCLANG_WARN_DIRECT_OBJC_ISA_USAGE = YES_ERROR;\n\t\t\t\tCLANG_WARN_EMPTY_BODY = YES;\n\t\t\t\tCLANG_WARN_ENUM_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_INFINITE_RECURSION = YES;\n\t\t\t\tCLANG_WARN_INT_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_NON_LITERAL_NULL_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_OBJC_IMPLICIT_RETAIN_SELF = YES;\n\t\t\t\tCLANG_WARN_OBJC_LITERAL_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_OBJC_ROOT_CLASS = YES_ERROR;\n\t\t\t\tCLANG_WARN_RANGE_LOOP_ANALYSIS = YES;\n\t\t\t\tCLANG_WARN_STRICT_PROTOTYPES = YES;\n\t\t\t\tCLANG_WARN_SUSPICIOUS_MOVE = YES;\n\t\t\t\tCLANG_WARN_UNREACHABLE_CODE = YES;\n\t\t\t\tCLANG_WARN__DUPLICATE_METHOD_MATCH = YES;\n\t\t\t\t\"CODE_SIGN_IDENTITY[sdk=iphoneos*]\" = \"iPhone Developer\";\n\t\t\t\tCOPY_PHASE_STRIP = YES;\n\t\t\t\tENABLE_NS_ASSERTIONS = NO;\n\t\t\t\tENABLE_STRICT_OBJC_MSGSEND = YES;\n\t\t\t\tGCC_C_LANGUAGE_STANDARD = gnu99;\n\t\t\t\tGCC_NO_COMMON_BLOCKS = YES;\n\t\t\t\tGCC_WARN_64_TO_32_BIT_CONVERSION = YES;\n\t\t\t\tGCC_WARN_ABOUT_RETURN_TYPE = YES_ERROR;\n\t\t\t\tGCC_WARN_UNDECLARED_SELECTOR = YES;\n\t\t\t\tGCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE;\n\t\t\t\tGCC_WARN_UNUSED_FUNCTION = YES;\n\t\t\t\tGCC_WARN_UNUSED_VARIABLE = YES;\n\t\t\t\tIPHONEOS_DEPLOYMENT_TARGET = 10.0;\n\t\t\t\tLD_RUNPATH_SEARCH_PATHS = \"/usr/lib/swift $(inherited)\";\n\t\t\t\tLIBRARY_SEARCH_PATHS = (\n\t\t\t\t\t\"\\\"$(TOOLCHAIN_DIR)/usr/lib/swift/$(PLATFORM_NAME)\\\"\",\n\t\t\t\t\t\"\\\"$(TOOLCHAIN_DIR)/usr/lib/swift-5.0/$(PLATFORM_NAME)\\\"\",\n\t\t\t\t\t\"\\\"$(inherited)\\\"\",\n\t\t\t\t);\n\t\t\t\tMTL_ENABLE_DEBUG_INFO = NO;\n\t\t\t\tSDKROOT = iphoneos;\n\t\t\t\tVALIDATE_PRODUCT = YES;\n\t\t\t};\n\t\t\tname = Release;\n\t\t};\n/* End XCBuildConfiguration section */\n\n/* Begin XCConfigurationList section */\n\t\t00E357021AD99517003FC87E /* Build configuration list for PBXNativeTarget \"react_native_windowsTests\" */ = {\n\t\t\tisa = XCConfigurationList;\n\t\t\tbuildConfigurations = (\n\t\t\t\t00E356F61AD99517003FC87E /* Debug */,\n\t\t\t\t00E356F71AD99517003FC87E /* Release */,\n\t\t\t);\n\t\t\tdefaultConfigurationIsVisible = 0;\n\t\t\tdefaultConfigurationName = Release;\n\t\t};\n\t\t13B07F931A680F5B00A75B9A /* Build configuration list for PBXNativeTarget \"react_native_windows\" */ = {\n\t\t\tisa = XCConfigurationList;\n\t\t\tbuildConfigurations = (\n\t\t\t\t13B07F941A680F5B00A75B9A /* Debug */,\n\t\t\t\t13B07F951A680F5B00A75B9A /* Release */,\n\t\t\t);\n\t\t\tdefaultConfigurationIsVisible = 0;\n\t\t\tdefaultConfigurationName = Release;\n\t\t};\n\t\t2D02E4BA1E0B4A5E006451C7 /* Build configuration list for PBXNativeTarget \"react_native_windows-tvOS\" */ = {\n\t\t\tisa = XCConfigurationList;\n\t\t\tbuildConfigurations = (\n\t\t\t\t2D02E4971E0B4A5E006451C7 /* Debug */,\n\t\t\t\t2D02E4981E0B4A5E006451C7 /* Release */,\n\t\t\t);\n\t\t\tdefaultConfigurationIsVisible = 0;\n\t\t\tdefaultConfigurationName = Release;\n\t\t};\n\t\t2D02E4BB1E0B4A5E006451C7 /* Build configuration list for PBXNativeTarget \"react_native_windows-tvOSTests\" */ = {\n\t\t\tisa = XCConfigurationList;\n\t\t\tbuildConfigurations = (\n\t\t\t\t2D02E4991E0B4A5E006451C7 /* Debug */,\n\t\t\t\t2D02E49A1E0B4A5E006451C7 /* Release */,\n\t\t\t);\n\t\t\tdefaultConfigurationIsVisible = 0;\n\t\t\tdefaultConfigurationName = Release;\n\t\t};\n\t\t83CBB9FA1A601CBA00E9B192 /* Build configuration list for PBXProject \"react_native_windows\" */ = {\n\t\t\tisa = XCConfigurationList;\n\t\t\tbuildConfigurations = (\n\t\t\t\t83CBBA201A601CBA00E9B192 /* Debug */,\n\t\t\t\t83CBBA211A601CBA00E9B192 /* Release */,\n\t\t\t);\n\t\t\tdefaultConfigurationIsVisible = 0;\n\t\t\tdefaultConfigurationName = Release;\n\t\t};\n/* End XCConfigurationList section */\n\t};\n\trootObject = 83CBB9F71A601CBA00E9B192 /* Project object */;\n}\n"
  },
  {
    "path": "example/react_native_windows/ios/react_native_windows.xcodeproj/xcshareddata/xcschemes/react_native_windows-tvOS.xcscheme",
    "content": "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<Scheme\n   LastUpgradeVersion = \"1130\"\n   version = \"1.3\">\n   <BuildAction\n      parallelizeBuildables = \"YES\"\n      buildImplicitDependencies = \"YES\">\n      <BuildActionEntries>\n         <BuildActionEntry\n            buildForTesting = \"YES\"\n            buildForRunning = \"YES\"\n            buildForProfiling = \"YES\"\n            buildForArchiving = \"YES\"\n            buildForAnalyzing = \"YES\">\n            <BuildableReference\n               BuildableIdentifier = \"primary\"\n               BlueprintIdentifier = \"2D02E47A1E0B4A5D006451C7\"\n               BuildableName = \"react_native_windows-tvOS.app\"\n               BlueprintName = \"react_native_windows-tvOS\"\n               ReferencedContainer = \"container:react_native_windows.xcodeproj\">\n            </BuildableReference>\n         </BuildActionEntry>\n      </BuildActionEntries>\n   </BuildAction>\n   <TestAction\n      buildConfiguration = \"Debug\"\n      selectedDebuggerIdentifier = \"Xcode.DebuggerFoundation.Debugger.LLDB\"\n      selectedLauncherIdentifier = \"Xcode.DebuggerFoundation.Launcher.LLDB\"\n      shouldUseLaunchSchemeArgsEnv = \"YES\">\n      <Testables>\n         <TestableReference\n            skipped = \"NO\">\n            <BuildableReference\n               BuildableIdentifier = \"primary\"\n               BlueprintIdentifier = \"2D02E48F1E0B4A5D006451C7\"\n               BuildableName = \"react_native_windows-tvOSTests.xctest\"\n               BlueprintName = \"react_native_windows-tvOSTests\"\n               ReferencedContainer = \"container:react_native_windows.xcodeproj\">\n            </BuildableReference>\n         </TestableReference>\n      </Testables>\n   </TestAction>\n   <LaunchAction\n      buildConfiguration = \"Debug\"\n      selectedDebuggerIdentifier = \"Xcode.DebuggerFoundation.Debugger.LLDB\"\n      selectedLauncherIdentifier = \"Xcode.DebuggerFoundation.Launcher.LLDB\"\n      launchStyle = \"0\"\n      useCustomWorkingDirectory = \"NO\"\n      ignoresPersistentStateOnLaunch = \"NO\"\n      debugDocumentVersioning = \"YES\"\n      debugServiceExtension = \"internal\"\n      allowLocationSimulation = \"YES\">\n      <BuildableProductRunnable\n         runnableDebuggingMode = \"0\">\n         <BuildableReference\n            BuildableIdentifier = \"primary\"\n            BlueprintIdentifier = \"2D02E47A1E0B4A5D006451C7\"\n            BuildableName = \"react_native_windows-tvOS.app\"\n            BlueprintName = \"react_native_windows-tvOS\"\n            ReferencedContainer = \"container:react_native_windows.xcodeproj\">\n         </BuildableReference>\n      </BuildableProductRunnable>\n   </LaunchAction>\n   <ProfileAction\n      buildConfiguration = \"Release\"\n      shouldUseLaunchSchemeArgsEnv = \"YES\"\n      savedToolIdentifier = \"\"\n      useCustomWorkingDirectory = \"NO\"\n      debugDocumentVersioning = \"YES\">\n      <BuildableProductRunnable\n         runnableDebuggingMode = \"0\">\n         <BuildableReference\n            BuildableIdentifier = \"primary\"\n            BlueprintIdentifier = \"2D02E47A1E0B4A5D006451C7\"\n            BuildableName = \"react_native_windows-tvOS.app\"\n            BlueprintName = \"react_native_windows-tvOS\"\n            ReferencedContainer = \"container:react_native_windows.xcodeproj\">\n         </BuildableReference>\n      </BuildableProductRunnable>\n   </ProfileAction>\n   <AnalyzeAction\n      buildConfiguration = \"Debug\">\n   </AnalyzeAction>\n   <ArchiveAction\n      buildConfiguration = \"Release\"\n      revealArchiveInOrganizer = \"YES\">\n   </ArchiveAction>\n</Scheme>\n"
  },
  {
    "path": "example/react_native_windows/ios/react_native_windows.xcodeproj/xcshareddata/xcschemes/react_native_windows.xcscheme",
    "content": "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<Scheme\n   LastUpgradeVersion = \"1130\"\n   version = \"1.3\">\n   <BuildAction\n      parallelizeBuildables = \"YES\"\n      buildImplicitDependencies = \"YES\">\n      <BuildActionEntries>\n         <BuildActionEntry\n            buildForTesting = \"YES\"\n            buildForRunning = \"YES\"\n            buildForProfiling = \"YES\"\n            buildForArchiving = \"YES\"\n            buildForAnalyzing = \"YES\">\n            <BuildableReference\n               BuildableIdentifier = \"primary\"\n               BlueprintIdentifier = \"13B07F861A680F5B00A75B9A\"\n               BuildableName = \"react_native_windows.app\"\n               BlueprintName = \"react_native_windows\"\n               ReferencedContainer = \"container:react_native_windows.xcodeproj\">\n            </BuildableReference>\n         </BuildActionEntry>\n      </BuildActionEntries>\n   </BuildAction>\n   <TestAction\n      buildConfiguration = \"Debug\"\n      selectedDebuggerIdentifier = \"Xcode.DebuggerFoundation.Debugger.LLDB\"\n      selectedLauncherIdentifier = \"Xcode.DebuggerFoundation.Launcher.LLDB\"\n      shouldUseLaunchSchemeArgsEnv = \"YES\">\n      <Testables>\n         <TestableReference\n            skipped = \"NO\">\n            <BuildableReference\n               BuildableIdentifier = \"primary\"\n               BlueprintIdentifier = \"00E356ED1AD99517003FC87E\"\n               BuildableName = \"react_native_windowsTests.xctest\"\n               BlueprintName = \"react_native_windowsTests\"\n               ReferencedContainer = \"container:react_native_windows.xcodeproj\">\n            </BuildableReference>\n         </TestableReference>\n      </Testables>\n   </TestAction>\n   <LaunchAction\n      buildConfiguration = \"Debug\"\n      selectedDebuggerIdentifier = \"Xcode.DebuggerFoundation.Debugger.LLDB\"\n      selectedLauncherIdentifier = \"Xcode.DebuggerFoundation.Launcher.LLDB\"\n      launchStyle = \"0\"\n      useCustomWorkingDirectory = \"NO\"\n      ignoresPersistentStateOnLaunch = \"NO\"\n      debugDocumentVersioning = \"YES\"\n      debugServiceExtension = \"internal\"\n      allowLocationSimulation = \"YES\">\n      <BuildableProductRunnable\n         runnableDebuggingMode = \"0\">\n         <BuildableReference\n            BuildableIdentifier = \"primary\"\n            BlueprintIdentifier = \"13B07F861A680F5B00A75B9A\"\n            BuildableName = \"react_native_windows.app\"\n            BlueprintName = \"react_native_windows\"\n            ReferencedContainer = \"container:react_native_windows.xcodeproj\">\n         </BuildableReference>\n      </BuildableProductRunnable>\n   </LaunchAction>\n   <ProfileAction\n      buildConfiguration = \"Release\"\n      shouldUseLaunchSchemeArgsEnv = \"YES\"\n      savedToolIdentifier = \"\"\n      useCustomWorkingDirectory = \"NO\"\n      debugDocumentVersioning = \"YES\">\n      <BuildableProductRunnable\n         runnableDebuggingMode = \"0\">\n         <BuildableReference\n            BuildableIdentifier = \"primary\"\n            BlueprintIdentifier = \"13B07F861A680F5B00A75B9A\"\n            BuildableName = \"react_native_windows.app\"\n            BlueprintName = \"react_native_windows\"\n            ReferencedContainer = \"container:react_native_windows.xcodeproj\">\n         </BuildableReference>\n      </BuildableProductRunnable>\n   </ProfileAction>\n   <AnalyzeAction\n      buildConfiguration = \"Debug\">\n   </AnalyzeAction>\n   <ArchiveAction\n      buildConfiguration = \"Release\"\n      revealArchiveInOrganizer = \"YES\">\n   </ArchiveAction>\n</Scheme>\n"
  },
  {
    "path": "example/react_native_windows/ios/react_native_windowsTests/Info.plist",
    "content": "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<!DOCTYPE plist PUBLIC \"-//Apple//DTD PLIST 1.0//EN\" \"http://www.apple.com/DTDs/PropertyList-1.0.dtd\">\n<plist version=\"1.0\">\n<dict>\n\t<key>CFBundleDevelopmentRegion</key>\n\t<string>en</string>\n\t<key>CFBundleExecutable</key>\n\t<string>$(EXECUTABLE_NAME)</string>\n\t<key>CFBundleIdentifier</key>\n\t<string>$(PRODUCT_BUNDLE_IDENTIFIER)</string>\n\t<key>CFBundleInfoDictionaryVersion</key>\n\t<string>6.0</string>\n\t<key>CFBundleName</key>\n\t<string>$(PRODUCT_NAME)</string>\n\t<key>CFBundlePackageType</key>\n\t<string>BNDL</string>\n\t<key>CFBundleShortVersionString</key>\n\t<string>1.0</string>\n\t<key>CFBundleSignature</key>\n\t<string>????</string>\n\t<key>CFBundleVersion</key>\n\t<string>1</string>\n</dict>\n</plist>\n"
  },
  {
    "path": "example/react_native_windows/ios/react_native_windowsTests/react_native_windowsTests.m",
    "content": "#import <UIKit/UIKit.h>\n#import <XCTest/XCTest.h>\n\n#import <React/RCTLog.h>\n#import <React/RCTRootView.h>\n\n#define TIMEOUT_SECONDS 600\n#define TEXT_TO_LOOK_FOR @\"Welcome to React\"\n\n@interface react_native_windowsTests : XCTestCase\n\n@end\n\n@implementation react_native_windowsTests\n\n- (BOOL)findSubviewInView:(UIView *)view matching:(BOOL(^)(UIView *view))test\n{\n  if (test(view)) {\n    return YES;\n  }\n  for (UIView *subview in [view subviews]) {\n    if ([self findSubviewInView:subview matching:test]) {\n      return YES;\n    }\n  }\n  return NO;\n}\n\n- (void)testRendersWelcomeScreen\n{\n  UIViewController *vc = [[[RCTSharedApplication() delegate] window] rootViewController];\n  NSDate *date = [NSDate dateWithTimeIntervalSinceNow:TIMEOUT_SECONDS];\n  BOOL foundElement = NO;\n\n  __block NSString *redboxError = nil;\n#ifdef DEBUG\n  RCTSetLogFunction(^(RCTLogLevel level, RCTLogSource source, NSString *fileName, NSNumber *lineNumber, NSString *message) {\n    if (level >= RCTLogLevelError) {\n      redboxError = message;\n    }\n  });\n#endif\n\n  while ([date timeIntervalSinceNow] > 0 && !foundElement && !redboxError) {\n    [[NSRunLoop mainRunLoop] runMode:NSDefaultRunLoopMode beforeDate:[NSDate dateWithTimeIntervalSinceNow:0.1]];\n    [[NSRunLoop mainRunLoop] runMode:NSRunLoopCommonModes beforeDate:[NSDate dateWithTimeIntervalSinceNow:0.1]];\n\n    foundElement = [self findSubviewInView:vc.view matching:^BOOL(UIView *view) {\n      if ([view.accessibilityLabel isEqualToString:TEXT_TO_LOOK_FOR]) {\n        return YES;\n      }\n      return NO;\n    }];\n  }\n\n#ifdef DEBUG\n  RCTSetLogFunction(RCTDefaultLogFunction);\n#endif\n\n  XCTAssertNil(redboxError, @\"RedBox error: %@\", redboxError);\n  XCTAssertTrue(foundElement, @\"Couldn't find element with text '%@' in %d seconds\", TEXT_TO_LOOK_FOR, TIMEOUT_SECONDS);\n}\n\n\n@end\n"
  },
  {
    "path": "example/react_native_windows/macos/.gitignore",
    "content": "# CocoaPods\r\nPods/\r\n"
  },
  {
    "path": "example/react_native_windows/macos/Podfile",
    "content": "require_relative '../node_modules/@react-native-community/cli-platform-ios/native_modules'\n\ndef add_flipper_pods!(versions = {})\n  versions['Flipper'] ||= '~> 0.33.1'\n  versions['DoubleConversion'] ||= '1.1.7'\n  versions['Flipper-Folly'] ||= '~> 2.1'\n  versions['Flipper-Glog'] ||= '0.3.6'\n  versions['Flipper-PeerTalk'] ||= '~> 0.0.4'\n  versions['Flipper-RSocket'] ||= '~> 1.0'\n\n  pod 'FlipperKit', versions['Flipper'], :configuration => 'Debug'\n  pod 'FlipperKit/FlipperKitLayoutPlugin', versions['Flipper'], :configuration => 'Debug'\n  pod 'FlipperKit/SKIOSNetworkPlugin', versions['Flipper'], :configuration => 'Debug'\n  pod 'FlipperKit/FlipperKitUserDefaultsPlugin', versions['Flipper'], :configuration => 'Debug'\n  pod 'FlipperKit/FlipperKitReactPlugin', versions['Flipper'], :configuration => 'Debug'\n\n  # List all transitive dependencies for FlipperKit pods\n  # to avoid them being linked in Release builds\n  pod 'Flipper', versions['Flipper'], :configuration => 'Debug'\n  pod 'Flipper-DoubleConversion', versions['DoubleConversion'], :configuration => 'Debug'\n  pod 'Flipper-Folly', versions['Flipper-Folly'], :configuration => 'Debug'\n  pod 'Flipper-Glog', versions['Flipper-Glog'], :configuration => 'Debug'\n  pod 'Flipper-PeerTalk', versions['Flipper-PeerTalk'], :configuration => 'Debug'\n  pod 'Flipper-RSocket', versions['Flipper-RSocket'], :configuration => 'Debug'\n  pod 'FlipperKit/Core', versions['Flipper'], :configuration => 'Debug'\n  pod 'FlipperKit/CppBridge', versions['Flipper'], :configuration => 'Debug'\n  pod 'FlipperKit/FBCxxFollyDynamicConvert', versions['Flipper'], :configuration => 'Debug'\n  pod 'FlipperKit/FBDefines', versions['Flipper'], :configuration => 'Debug'\n  pod 'FlipperKit/FKPortForwarding', versions['Flipper'], :configuration => 'Debug'\n  pod 'FlipperKit/FlipperKitHighlightOverlay', versions['Flipper'], :configuration => 'Debug'\n  pod 'FlipperKit/FlipperKitLayoutTextSearchable', versions['Flipper'], :configuration => 'Debug'\n  pod 'FlipperKit/FlipperKitNetworkPlugin', versions['Flipper'], :configuration => 'Debug'\nend\n\n# Post Install processing for Flipper\ndef flipper_post_install(installer)\n  installer.pods_project.targets.each do |target|\n    if target.name == 'YogaKit'\n      target.build_configurations.each do |config|\n        config.build_settings['SWIFT_VERSION'] = '4.1'\n      end\n    end\n  end\nend\n\nabstract_target 'Shared' do\n  # Pods for react_native_windows\n  pod 'FBLazyVector', :path => '../node_modules/react-native-macos/Libraries/FBLazyVector'\n  pod 'FBReactNativeSpec', :path => '../node_modules/react-native-macos/Libraries/FBReactNativeSpec'\n  pod 'RCTRequired', :path => '../node_modules/react-native-macos/Libraries/RCTRequired'\n  pod 'RCTTypeSafety', :path => '../node_modules/react-native-macos/Libraries/TypeSafety'\n  pod 'React', :path => '../node_modules/react-native-macos/'\n  pod 'React-Core', :path => '../node_modules/react-native-macos/'\n  pod 'React-CoreModules', :path => '../node_modules/react-native-macos/React/CoreModules'\n  pod 'React-Core/DevSupport', :path => '../node_modules/react-native-macos/'\n  pod 'React-RCTActionSheet', :path => '../node_modules/react-native-macos/Libraries/ActionSheetIOS'\n  pod 'React-RCTAnimation', :path => '../node_modules/react-native-macos/Libraries/NativeAnimation'\n  pod 'React-RCTBlob', :path => '../node_modules/react-native-macos/Libraries/Blob'\n  pod 'React-RCTImage', :path => '../node_modules/react-native-macos/Libraries/Image'\n  pod 'React-RCTLinking', :path => '../node_modules/react-native-macos/Libraries/LinkingIOS'\n  pod 'React-RCTNetwork', :path => '../node_modules/react-native-macos/Libraries/Network'\n  pod 'React-RCTSettings', :path => '../node_modules/react-native-macos/Libraries/Settings'\n  pod 'React-RCTText', :path => '../node_modules/react-native-macos/Libraries/Text'\n  pod 'React-RCTVibration', :path => '../node_modules/react-native-macos/Libraries/Vibration'\n  pod 'React-Core/RCTWebSocket', :path => '../node_modules/react-native-macos/'\n\n  pod 'React-cxxreact', :path => '../node_modules/react-native-macos/ReactCommon/cxxreact'\n  pod 'React-jsi', :path => '../node_modules/react-native-macos/ReactCommon/jsi'\n  pod 'React-jsiexecutor', :path => '../node_modules/react-native-macos/ReactCommon/jsiexecutor'\n  pod 'React-jsinspector', :path => '../node_modules/react-native-macos/ReactCommon/jsinspector'\n  pod 'ReactCommon/callinvoker', :path => '../node_modules/react-native-macos/ReactCommon'\n  pod 'ReactCommon/turbomodule/core', :path => '../node_modules/react-native-macos/ReactCommon'\n  pod 'Yoga', :path => '../node_modules/react-native-macos/ReactCommon/yoga', :modular_headers => true\n\n  pod 'DoubleConversion', :podspec => '../node_modules/react-native-macos/third-party-podspecs/DoubleConversion.podspec'\n  pod 'glog', :podspec => '../node_modules/react-native-macos/third-party-podspecs/glog.podspec'\n  pod 'RCT-Folly', :podspec => '../node_modules/react-native-macos/third-party-podspecs/RCT-Folly.podspec'\n  pod 'boost-for-react-native', :podspec => '../node_modules/react-native-macos/third-party-podspecs/boost-for-react-native.podspec'\n\n  target 'react_native_windows-macOS' do\n    platform :macos, '10.13'\n    use_native_modules!\n\n    # Enables Hermes\n    #\n    # Be sure to first install the `hermes-engine-darwin` npm package, e.g.:\n    #\n    #   $ yarn add 'hermes-engine-darwin@^0.4.3'\n    #\n    # pod 'React-Core/Hermes', :path => '../node_modules/react-native-macos/'\n    # pod 'hermes', :path => '../node_modules/hermes-engine-darwin'\n    # pod 'libevent', :podspec => '../node_modules/react-native-macos/third-party-podspecs/libevent.podspec'\n\n    # Pods specifically for macOS target\n  end\n\n  target 'react_native_windows-iOS' do\n    platform :ios, '9'\n    use_native_modules!\n\n    # Enables Flipper.\n    #\n    # Note that if you have use_frameworks! enabled, Flipper will not work and\n    # you should disable these next few lines.\n    add_flipper_pods!\n    post_install do |installer|\n      flipper_post_install(installer)\n    end\n\n    # Pods specifically for iOS target\n  end\nend\n"
  },
  {
    "path": "example/react_native_windows/macos/react_native_windows-iOS/AppDelegate.h",
    "content": "#import <React/RCTBridgeDelegate.h>\n#import <UIKit/UIKit.h>\n\n@interface AppDelegate : UIResponder <UIApplicationDelegate, RCTBridgeDelegate>\n\n@property (nonatomic, strong) UIWindow *window;\n\n@end\n"
  },
  {
    "path": "example/react_native_windows/macos/react_native_windows-iOS/AppDelegate.m",
    "content": "#import \"AppDelegate.h\"\n\n#import <React/RCTBridge.h>\n#import <React/RCTBundleURLProvider.h>\n#import <React/RCTRootView.h>\n\n@implementation AppDelegate\n\n- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions\n{\n  RCTBridge *bridge = [[RCTBridge alloc] initWithDelegate:self launchOptions:launchOptions];\n  RCTRootView *rootView = [[RCTRootView alloc] initWithBridge:bridge\n                                                   moduleName:@\"react_native_windows\"\n                                            initialProperties:nil];\n\n  rootView.backgroundColor = [[UIColor alloc] initWithRed:1.0f green:1.0f blue:1.0f alpha:1];\n\n  self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds];\n  UIViewController *rootViewController = [UIViewController new];\n  rootViewController.view = rootView;\n  self.window.rootViewController = rootViewController;\n  [self.window makeKeyAndVisible];\n  return YES;\n}\n\n- (NSURL *)sourceURLForBridge:(RCTBridge *)bridge\n{\n#if DEBUG\n  return [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@\"index\" fallbackResource:nil];\n#else\n  return [[NSBundle mainBundle] URLForResource:@\"main\" withExtension:@\"jsbundle\"];\n#endif\n}\n\n@end\n"
  },
  {
    "path": "example/react_native_windows/macos/react_native_windows-iOS/Base.lproj/LaunchScreen.xib",
    "content": "<?xml version=\"1.0\" encoding=\"UTF-8\" standalone=\"no\"?>\n<document type=\"com.apple.InterfaceBuilder3.CocoaTouch.XIB\" version=\"3.0\" toolsVersion=\"7702\" systemVersion=\"14D136\" targetRuntime=\"iOS.CocoaTouch\" propertyAccessControl=\"none\" useAutolayout=\"YES\" launchScreen=\"YES\" useTraitCollections=\"YES\">\n    <dependencies>\n        <deployment identifier=\"iOS\"/>\n        <plugIn identifier=\"com.apple.InterfaceBuilder.IBCocoaTouchPlugin\" version=\"7701\"/>\n        <capability name=\"Constraints with non-1.0 multipliers\" minToolsVersion=\"5.1\"/>\n    </dependencies>\n    <objects>\n        <placeholder placeholderIdentifier=\"IBFilesOwner\" id=\"-1\" userLabel=\"File's Owner\"/>\n        <placeholder placeholderIdentifier=\"IBFirstResponder\" id=\"-2\" customClass=\"UIResponder\"/>\n        <view contentMode=\"scaleToFill\" id=\"iN0-l3-epB\">\n            <rect key=\"frame\" x=\"0.0\" y=\"0.0\" width=\"480\" height=\"480\"/>\n            <autoresizingMask key=\"autoresizingMask\" widthSizable=\"YES\" heightSizable=\"YES\"/>\n            <subviews>\n                <label opaque=\"NO\" clipsSubviews=\"YES\" userInteractionEnabled=\"NO\" contentMode=\"left\" horizontalHuggingPriority=\"251\" verticalHuggingPriority=\"251\" text=\"Powered by React Native\" textAlignment=\"center\" lineBreakMode=\"tailTruncation\" baselineAdjustment=\"alignBaselines\" minimumFontSize=\"9\" translatesAutoresizingMaskIntoConstraints=\"NO\" id=\"8ie-xW-0ye\">\n                    <rect key=\"frame\" x=\"20\" y=\"439\" width=\"441\" height=\"21\"/>\n                    <fontDescription key=\"fontDescription\" type=\"system\" pointSize=\"17\"/>\n                    <color key=\"textColor\" cocoaTouchSystemColor=\"darkTextColor\"/>\n                    <nil key=\"highlightedColor\"/>\n                </label>\n                <label opaque=\"NO\" clipsSubviews=\"YES\" userInteractionEnabled=\"NO\" contentMode=\"left\" horizontalHuggingPriority=\"251\" verticalHuggingPriority=\"251\" text=\"react_native_windows\" textAlignment=\"center\" lineBreakMode=\"middleTruncation\" baselineAdjustment=\"alignBaselines\" minimumFontSize=\"18\" translatesAutoresizingMaskIntoConstraints=\"NO\" id=\"kId-c2-rCX\">\n                    <rect key=\"frame\" x=\"20\" y=\"140\" width=\"441\" height=\"43\"/>\n                    <fontDescription key=\"fontDescription\" type=\"boldSystem\" pointSize=\"36\"/>\n                    <color key=\"textColor\" cocoaTouchSystemColor=\"darkTextColor\"/>\n                    <nil key=\"highlightedColor\"/>\n                </label>\n            </subviews>\n            <color key=\"backgroundColor\" white=\"1\" alpha=\"1\" colorSpace=\"custom\" customColorSpace=\"calibratedWhite\"/>\n            <constraints>\n                <constraint firstItem=\"kId-c2-rCX\" firstAttribute=\"centerY\" secondItem=\"iN0-l3-epB\" secondAttribute=\"bottom\" multiplier=\"1/3\" constant=\"1\" id=\"5cJ-9S-tgC\"/>\n                <constraint firstAttribute=\"centerX\" secondItem=\"kId-c2-rCX\" secondAttribute=\"centerX\" id=\"Koa-jz-hwk\"/>\n                <constraint firstAttribute=\"bottom\" secondItem=\"8ie-xW-0ye\" secondAttribute=\"bottom\" constant=\"20\" id=\"Kzo-t9-V3l\"/>\n                <constraint firstItem=\"8ie-xW-0ye\" firstAttribute=\"leading\" secondItem=\"iN0-l3-epB\" secondAttribute=\"leading\" constant=\"20\" symbolic=\"YES\" id=\"MfP-vx-nX0\"/>\n                <constraint firstAttribute=\"centerX\" secondItem=\"8ie-xW-0ye\" secondAttribute=\"centerX\" id=\"ZEH-qu-HZ9\"/>\n                <constraint firstItem=\"kId-c2-rCX\" firstAttribute=\"leading\" secondItem=\"iN0-l3-epB\" secondAttribute=\"leading\" constant=\"20\" symbolic=\"YES\" id=\"fvb-Df-36g\"/>\n            </constraints>\n            <nil key=\"simulatedStatusBarMetrics\"/>\n            <freeformSimulatedSizeMetrics key=\"simulatedDestinationMetrics\"/>\n            <point key=\"canvasLocation\" x=\"548\" y=\"455\"/>\n        </view>\n    </objects>\n</document>\n"
  },
  {
    "path": "example/react_native_windows/macos/react_native_windows-iOS/Images.xcassets/AppIcon.appiconset/Contents.json",
    "content": "{\n  \"images\": [\n    {\n      \"idiom\": \"iphone\",\n      \"size\": \"29x29\",\n      \"scale\": \"2x\"\n    },\n    {\n      \"idiom\": \"iphone\",\n      \"size\": \"29x29\",\n      \"scale\": \"3x\"\n    },\n    {\n      \"idiom\": \"iphone\",\n      \"size\": \"40x40\",\n      \"scale\": \"2x\"\n    },\n    {\n      \"idiom\": \"iphone\",\n      \"size\": \"40x40\",\n      \"scale\": \"3x\"\n    },\n    {\n      \"idiom\": \"iphone\",\n      \"size\": \"60x60\",\n      \"scale\": \"2x\"\n    },\n    {\n      \"idiom\": \"iphone\",\n      \"size\": \"60x60\",\n      \"scale\": \"3x\"\n    }\n  ],\n  \"info\": {\n    \"version\": 1,\n    \"author\": \"xcode\"\n  }\n}\n"
  },
  {
    "path": "example/react_native_windows/macos/react_native_windows-iOS/Images.xcassets/Contents.json",
    "content": "{\n  \"info\": {\n    \"version\": 1,\n    \"author\": \"xcode\"\n  }\n}\n"
  },
  {
    "path": "example/react_native_windows/macos/react_native_windows-iOS/Info.plist",
    "content": "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<!DOCTYPE plist PUBLIC \"-//Apple//DTD PLIST 1.0//EN\" \"http://www.apple.com/DTDs/PropertyList-1.0.dtd\">\n<plist version=\"1.0\">\n<dict>\n\t<key>CFBundleDevelopmentRegion</key>\n\t<string>en</string>\n\t<key>CFBundleDisplayName</key>\n\t<string>$(PRODUCT_NAME)</string>\n\t<key>CFBundleExecutable</key>\n\t<string>$(EXECUTABLE_NAME)</string>\n\t<key>CFBundleIdentifier</key>\n\t<string>$(PRODUCT_BUNDLE_IDENTIFIER)</string>\n\t<key>CFBundleInfoDictionaryVersion</key>\n\t<string>6.0</string>\n\t<key>CFBundleName</key>\n\t<string>$(PRODUCT_NAME)</string>\n\t<key>CFBundlePackageType</key>\n\t<string>APPL</string>\n\t<key>CFBundleShortVersionString</key>\n\t<string>1.0</string>\n\t<key>CFBundleSignature</key>\n\t<string>????</string>\n\t<key>CFBundleVersion</key>\n\t<string>1</string>\n\t<key>LSRequiresIPhoneOS</key>\n\t<true/>\n\t<key>NSAppTransportSecurity</key>\n\t<dict>\n\t\t<key>NSAllowsArbitraryLoads</key>\n\t\t<true/>\n\t\t<key>NSExceptionDomains</key>\n\t\t<dict>\n\t\t\t<key>localhost</key>\n\t\t\t<dict>\n\t\t\t\t<key>NSExceptionAllowsInsecureHTTPLoads</key>\n\t\t\t\t<true/>\n\t\t\t</dict>\n\t\t</dict>\n\t</dict>\n\t<key>NSLocationWhenInUseUsageDescription</key>\n\t<string></string>\n\t<key>UILaunchStoryboardName</key>\n\t<string>LaunchScreen</string>\n\t<key>UIRequiredDeviceCapabilities</key>\n\t<array>\n\t\t<string>armv7</string>\n\t</array>\n\t<key>UISupportedInterfaceOrientations</key>\n\t<array>\n\t\t<string>UIInterfaceOrientationPortrait</string>\n\t\t<string>UIInterfaceOrientationLandscapeLeft</string>\n\t\t<string>UIInterfaceOrientationLandscapeRight</string>\n\t</array>\n\t<key>UIViewControllerBasedStatusBarAppearance</key>\n\t<false/>\n</dict>\n</plist>\n"
  },
  {
    "path": "example/react_native_windows/macos/react_native_windows-iOS/main.m",
    "content": "#import <UIKit/UIKit.h>\n\n#import \"AppDelegate.h\"\n\nint main(int argc, char * argv[]) {\n  @autoreleasepool {\n    return UIApplicationMain(argc, argv, nil, NSStringFromClass([AppDelegate class]));\n  }\n}\n"
  },
  {
    "path": "example/react_native_windows/macos/react_native_windows-macOS/AppDelegate.h",
    "content": "#import <Cocoa/Cocoa.h>\n\n@class RCTBridge;\n\n@interface AppDelegate : NSObject <NSApplicationDelegate>\n\n@property (nonatomic, readonly) RCTBridge *bridge;\n\n@end\n"
  },
  {
    "path": "example/react_native_windows/macos/react_native_windows-macOS/AppDelegate.m",
    "content": "#import \"AppDelegate.h\"\n\n#import <React/RCTBridge.h>\n#import <React/RCTBundleURLProvider.h>\n\n@interface AppDelegate () <RCTBridgeDelegate>\n\n@end\n\n@implementation AppDelegate\n\n- (void)awakeFromNib {\n  [super awakeFromNib];\n\n  _bridge = [[RCTBridge alloc] initWithDelegate:self launchOptions:nil];\n}\n\n- (void)applicationDidFinishLaunching:(NSNotification *)aNotification {\n  // Insert code here to initialize your application\n}\n\n- (void)applicationWillTerminate:(NSNotification *)aNotification {\n  // Insert code here to tear down your application\n}\n\n#pragma mark - RCTBridgeDelegate Methods\n\n- (NSURL *)sourceURLForBridge:(__unused RCTBridge *)bridge {\n  return [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@\"index\" fallbackResource:@\"main\"]; // .jsbundle;\n}\n\n@end\n"
  },
  {
    "path": "example/react_native_windows/macos/react_native_windows-macOS/Assets.xcassets/AppIcon.appiconset/Contents.json",
    "content": "{\n  \"images\": [\n    {\n      \"idiom\": \"mac\",\n      \"scale\": \"1x\",\n      \"size\": \"16x16\"\n    },\n    {\n      \"idiom\": \"mac\",\n      \"scale\": \"2x\",\n      \"size\": \"16x16\"\n    },\n    {\n      \"idiom\": \"mac\",\n      \"scale\": \"1x\",\n      \"size\": \"32x32\"\n    },\n    {\n      \"idiom\": \"mac\",\n      \"scale\": \"2x\",\n      \"size\": \"32x32\"\n    },\n    {\n      \"idiom\": \"mac\",\n      \"scale\": \"1x\",\n      \"size\": \"128x128\"\n    },\n    {\n      \"idiom\": \"mac\",\n      \"scale\": \"2x\",\n      \"size\": \"128x128\"\n    },\n    {\n      \"idiom\": \"mac\",\n      \"scale\": \"1x\",\n      \"size\": \"256x256\"\n    },\n    {\n      \"idiom\": \"mac\",\n      \"scale\": \"2x\",\n      \"size\": \"256x256\"\n    },\n    {\n      \"idiom\": \"mac\",\n      \"scale\": \"1x\",\n      \"size\": \"512x512\"\n    },\n    {\n      \"idiom\": \"mac\",\n      \"scale\": \"2x\",\n      \"size\": \"512x512\"\n    }\n  ],\n  \"info\": {\n    \"author\": \"xcode\",\n    \"version\": 1\n  }\n}\n"
  },
  {
    "path": "example/react_native_windows/macos/react_native_windows-macOS/Assets.xcassets/Contents.json",
    "content": "{\n  \"info\": {\n    \"author\": \"xcode\",\n    \"version\": 1\n  }\n}\n"
  },
  {
    "path": "example/react_native_windows/macos/react_native_windows-macOS/Base.lproj/Main.storyboard",
    "content": "<?xml version=\"1.0\" encoding=\"UTF-8\" standalone=\"no\"?>\n<document type=\"com.apple.InterfaceBuilder3.Cocoa.Storyboard.XIB\" version=\"3.0\" toolsVersion=\"11134\" targetRuntime=\"MacOSX.Cocoa\" propertyAccessControl=\"none\" useAutolayout=\"YES\" initialViewController=\"B8D-0N-5wS\">\n    <dependencies>\n        <plugIn identifier=\"com.apple.InterfaceBuilder.CocoaPlugin\" version=\"11134\"/>\n    </dependencies>\n    <scenes>\n        <!--Application-->\n        <scene sceneID=\"JPo-4y-FX3\">\n            <objects>\n                <application id=\"hnw-xV-0zn\" sceneMemberID=\"viewController\">\n                    <menu key=\"mainMenu\" title=\"Main Menu\" systemMenu=\"main\" id=\"AYu-sK-qS6\">\n                        <items>\n                            <menuItem title=\"react_native_windows\" id=\"1Xt-HY-uBw\">\n                                <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                <menu key=\"submenu\" title=\"react_native_windows\" systemMenu=\"apple\" id=\"uQy-DD-JDr\">\n                                    <items>\n                                        <menuItem title=\"About react_native_windows\" id=\"5kV-Vb-QxS\">\n                                            <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                            <connections>\n                                                <action selector=\"orderFrontStandardAboutPanel:\" target=\"Ady-hI-5gd\" id=\"Exp-CZ-Vem\"/>\n                                            </connections>\n                                        </menuItem>\n                                        <menuItem isSeparatorItem=\"YES\" id=\"VOq-y0-SEH\"/>\n                                        <menuItem title=\"Preferences…\" keyEquivalent=\",\" id=\"BOF-NM-1cW\"/>\n                                        <menuItem isSeparatorItem=\"YES\" id=\"wFC-TO-SCJ\"/>\n                                        <menuItem title=\"Services\" id=\"NMo-om-nkz\">\n                                            <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                            <menu key=\"submenu\" title=\"Services\" systemMenu=\"services\" id=\"hz9-B4-Xy5\"/>\n                                        </menuItem>\n                                        <menuItem isSeparatorItem=\"YES\" id=\"4je-JR-u6R\"/>\n                                        <menuItem title=\"Hide react_native_windows\" keyEquivalent=\"h\" id=\"Olw-nP-bQN\">\n                                            <connections>\n                                                <action selector=\"hide:\" target=\"Ady-hI-5gd\" id=\"PnN-Uc-m68\"/>\n                                            </connections>\n                                        </menuItem>\n                                        <menuItem title=\"Hide Others\" keyEquivalent=\"h\" id=\"Vdr-fp-XzO\">\n                                            <modifierMask key=\"keyEquivalentModifierMask\" option=\"YES\" command=\"YES\"/>\n                                            <connections>\n                                                <action selector=\"hideOtherApplications:\" target=\"Ady-hI-5gd\" id=\"VT4-aY-XCT\"/>\n                                            </connections>\n                                        </menuItem>\n                                        <menuItem title=\"Show All\" id=\"Kd2-mp-pUS\">\n                                            <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                            <connections>\n                                                <action selector=\"unhideAllApplications:\" target=\"Ady-hI-5gd\" id=\"Dhg-Le-xox\"/>\n                                            </connections>\n                                        </menuItem>\n                                        <menuItem isSeparatorItem=\"YES\" id=\"kCx-OE-vgT\"/>\n                                        <menuItem title=\"Quit react_native_windows\" keyEquivalent=\"q\" id=\"4sb-4s-VLi\">\n                                            <connections>\n                                                <action selector=\"terminate:\" target=\"Ady-hI-5gd\" id=\"Te7-pn-YzF\"/>\n                                            </connections>\n                                        </menuItem>\n                                    </items>\n                                </menu>\n                            </menuItem>\n                            <menuItem title=\"File\" id=\"dMs-cI-mzQ\">\n                                <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                <menu key=\"submenu\" title=\"File\" id=\"bib-Uj-vzu\">\n                                    <items>\n                                        <menuItem title=\"New\" keyEquivalent=\"n\" id=\"Was-JA-tGl\">\n                                            <connections>\n                                                <action selector=\"newDocument:\" target=\"Ady-hI-5gd\" id=\"4Si-XN-c54\"/>\n                                            </connections>\n                                        </menuItem>\n                                        <menuItem title=\"Open…\" keyEquivalent=\"o\" id=\"IAo-SY-fd9\">\n                                            <connections>\n                                                <action selector=\"openDocument:\" target=\"Ady-hI-5gd\" id=\"bVn-NM-KNZ\"/>\n                                            </connections>\n                                        </menuItem>\n                                        <menuItem title=\"Open Recent\" id=\"tXI-mr-wws\">\n                                            <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                            <menu key=\"submenu\" title=\"Open Recent\" systemMenu=\"recentDocuments\" id=\"oas-Oc-fiZ\">\n                                                <items>\n                                                    <menuItem title=\"Clear Menu\" id=\"vNY-rz-j42\">\n                                                        <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                                        <connections>\n                                                            <action selector=\"clearRecentDocuments:\" target=\"Ady-hI-5gd\" id=\"Daa-9d-B3U\"/>\n                                                        </connections>\n                                                    </menuItem>\n                                                </items>\n                                            </menu>\n                                        </menuItem>\n                                        <menuItem isSeparatorItem=\"YES\" id=\"m54-Is-iLE\"/>\n                                        <menuItem title=\"Close\" keyEquivalent=\"w\" id=\"DVo-aG-piG\">\n                                            <connections>\n                                                <action selector=\"performClose:\" target=\"Ady-hI-5gd\" id=\"HmO-Ls-i7Q\"/>\n                                            </connections>\n                                        </menuItem>\n                                        <menuItem title=\"Save…\" keyEquivalent=\"s\" id=\"pxx-59-PXV\">\n                                            <connections>\n                                                <action selector=\"saveDocument:\" target=\"Ady-hI-5gd\" id=\"teZ-XB-qJY\"/>\n                                            </connections>\n                                        </menuItem>\n                                        <menuItem title=\"Save As…\" keyEquivalent=\"S\" id=\"Bw7-FT-i3A\">\n                                            <connections>\n                                                <action selector=\"saveDocumentAs:\" target=\"Ady-hI-5gd\" id=\"mDf-zr-I0C\"/>\n                                            </connections>\n                                        </menuItem>\n                                        <menuItem title=\"Revert to Saved\" keyEquivalent=\"r\" id=\"KaW-ft-85H\">\n                                            <connections>\n                                                <action selector=\"revertDocumentToSaved:\" target=\"Ady-hI-5gd\" id=\"iJ3-Pv-kwq\"/>\n                                            </connections>\n                                        </menuItem>\n                                        <menuItem isSeparatorItem=\"YES\" id=\"aJh-i4-bef\"/>\n                                        <menuItem title=\"Page Setup…\" keyEquivalent=\"P\" id=\"qIS-W8-SiK\">\n                                            <modifierMask key=\"keyEquivalentModifierMask\" shift=\"YES\" command=\"YES\"/>\n                                            <connections>\n                                                <action selector=\"runPageLayout:\" target=\"Ady-hI-5gd\" id=\"Din-rz-gC5\"/>\n                                            </connections>\n                                        </menuItem>\n                                        <menuItem title=\"Print…\" keyEquivalent=\"p\" id=\"aTl-1u-JFS\">\n                                            <connections>\n                                                <action selector=\"print:\" target=\"Ady-hI-5gd\" id=\"qaZ-4w-aoO\"/>\n                                            </connections>\n                                        </menuItem>\n                                    </items>\n                                </menu>\n                            </menuItem>\n                            <menuItem title=\"Edit\" id=\"5QF-Oa-p0T\">\n                                <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                <menu key=\"submenu\" title=\"Edit\" id=\"W48-6f-4Dl\">\n                                    <items>\n                                        <menuItem title=\"Undo\" keyEquivalent=\"z\" id=\"dRJ-4n-Yzg\">\n                                            <connections>\n                                                <action selector=\"undo:\" target=\"Ady-hI-5gd\" id=\"M6e-cu-g7V\"/>\n                                            </connections>\n                                        </menuItem>\n                                        <menuItem title=\"Redo\" keyEquivalent=\"Z\" id=\"6dh-zS-Vam\">\n                                            <connections>\n                                                <action selector=\"redo:\" target=\"Ady-hI-5gd\" id=\"oIA-Rs-6OD\"/>\n                                            </connections>\n                                        </menuItem>\n                                        <menuItem isSeparatorItem=\"YES\" id=\"WRV-NI-Exz\"/>\n                                        <menuItem title=\"Cut\" keyEquivalent=\"x\" id=\"uRl-iY-unG\">\n                                            <connections>\n                                                <action selector=\"cut:\" target=\"Ady-hI-5gd\" id=\"YJe-68-I9s\"/>\n                                            </connections>\n                                        </menuItem>\n                                        <menuItem title=\"Copy\" keyEquivalent=\"c\" id=\"x3v-GG-iWU\">\n                                            <connections>\n                                                <action selector=\"copy:\" target=\"Ady-hI-5gd\" id=\"G1f-GL-Joy\"/>\n                                            </connections>\n                                        </menuItem>\n                                        <menuItem title=\"Paste\" keyEquivalent=\"v\" id=\"gVA-U4-sdL\">\n                                            <connections>\n                                                <action selector=\"paste:\" target=\"Ady-hI-5gd\" id=\"UvS-8e-Qdg\"/>\n                                            </connections>\n                                        </menuItem>\n                                        <menuItem title=\"Paste and Match Style\" keyEquivalent=\"V\" id=\"WeT-3V-zwk\">\n                                            <modifierMask key=\"keyEquivalentModifierMask\" option=\"YES\" command=\"YES\"/>\n                                            <connections>\n                                                <action selector=\"pasteAsPlainText:\" target=\"Ady-hI-5gd\" id=\"cEh-KX-wJQ\"/>\n                                            </connections>\n                                        </menuItem>\n                                        <menuItem title=\"Delete\" id=\"pa3-QI-u2k\">\n                                            <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                            <connections>\n                                                <action selector=\"delete:\" target=\"Ady-hI-5gd\" id=\"0Mk-Ml-PaM\"/>\n                                            </connections>\n                                        </menuItem>\n                                        <menuItem title=\"Select All\" keyEquivalent=\"a\" id=\"Ruw-6m-B2m\">\n                                            <connections>\n                                                <action selector=\"selectAll:\" target=\"Ady-hI-5gd\" id=\"VNm-Mi-diN\"/>\n                                            </connections>\n                                        </menuItem>\n                                        <menuItem isSeparatorItem=\"YES\" id=\"uyl-h8-XO2\"/>\n                                        <menuItem title=\"Find\" id=\"4EN-yA-p0u\">\n                                            <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                            <menu key=\"submenu\" title=\"Find\" id=\"1b7-l0-nxx\">\n                                                <items>\n                                                    <menuItem title=\"Find…\" tag=\"1\" keyEquivalent=\"f\" id=\"Xz5-n4-O0W\">\n                                                        <connections>\n                                                            <action selector=\"performFindPanelAction:\" target=\"Ady-hI-5gd\" id=\"cD7-Qs-BN4\"/>\n                                                        </connections>\n                                                    </menuItem>\n                                                    <menuItem title=\"Find and Replace…\" tag=\"12\" keyEquivalent=\"f\" id=\"YEy-JH-Tfz\">\n                                                        <modifierMask key=\"keyEquivalentModifierMask\" option=\"YES\" command=\"YES\"/>\n                                                        <connections>\n                                                            <action selector=\"performFindPanelAction:\" target=\"Ady-hI-5gd\" id=\"WD3-Gg-5AJ\"/>\n                                                        </connections>\n                                                    </menuItem>\n                                                    <menuItem title=\"Find Next\" tag=\"2\" keyEquivalent=\"g\" id=\"q09-fT-Sye\">\n                                                        <connections>\n                                                            <action selector=\"performFindPanelAction:\" target=\"Ady-hI-5gd\" id=\"NDo-RZ-v9R\"/>\n                                                        </connections>\n                                                    </menuItem>\n                                                    <menuItem title=\"Find Previous\" tag=\"3\" keyEquivalent=\"G\" id=\"OwM-mh-QMV\">\n                                                        <connections>\n                                                            <action selector=\"performFindPanelAction:\" target=\"Ady-hI-5gd\" id=\"HOh-sY-3ay\"/>\n                                                        </connections>\n                                                    </menuItem>\n                                                    <menuItem title=\"Use Selection for Find\" tag=\"7\" keyEquivalent=\"e\" id=\"buJ-ug-pKt\">\n                                                        <connections>\n                                                            <action selector=\"performFindPanelAction:\" target=\"Ady-hI-5gd\" id=\"U76-nv-p5D\"/>\n                                                        </connections>\n                                                    </menuItem>\n                                                    <menuItem title=\"Jump to Selection\" keyEquivalent=\"j\" id=\"S0p-oC-mLd\">\n                                                        <connections>\n                                                            <action selector=\"centerSelectionInVisibleArea:\" target=\"Ady-hI-5gd\" id=\"IOG-6D-g5B\"/>\n                                                        </connections>\n                                                    </menuItem>\n                                                </items>\n                                            </menu>\n                                        </menuItem>\n                                        <menuItem title=\"Spelling and Grammar\" id=\"Dv1-io-Yv7\">\n                                            <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                            <menu key=\"submenu\" title=\"Spelling\" id=\"3IN-sU-3Bg\">\n                                                <items>\n                                                    <menuItem title=\"Show Spelling and Grammar\" keyEquivalent=\":\" id=\"HFo-cy-zxI\">\n                                                        <connections>\n                                                            <action selector=\"showGuessPanel:\" target=\"Ady-hI-5gd\" id=\"vFj-Ks-hy3\"/>\n                                                        </connections>\n                                                    </menuItem>\n                                                    <menuItem title=\"Check Document Now\" keyEquivalent=\";\" id=\"hz2-CU-CR7\">\n                                                        <connections>\n                                                            <action selector=\"checkSpelling:\" target=\"Ady-hI-5gd\" id=\"fz7-VC-reM\"/>\n                                                        </connections>\n                                                    </menuItem>\n                                                    <menuItem isSeparatorItem=\"YES\" id=\"bNw-od-mp5\"/>\n                                                    <menuItem title=\"Check Spelling While Typing\" id=\"rbD-Rh-wIN\">\n                                                        <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                                        <connections>\n                                                            <action selector=\"toggleContinuousSpellChecking:\" target=\"Ady-hI-5gd\" id=\"7w6-Qz-0kB\"/>\n                                                        </connections>\n                                                    </menuItem>\n                                                    <menuItem title=\"Check Grammar With Spelling\" id=\"mK6-2p-4JG\">\n                                                        <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                                        <connections>\n                                                            <action selector=\"toggleGrammarChecking:\" target=\"Ady-hI-5gd\" id=\"muD-Qn-j4w\"/>\n                                                        </connections>\n                                                    </menuItem>\n                                                    <menuItem title=\"Correct Spelling Automatically\" id=\"78Y-hA-62v\">\n                                                        <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                                        <connections>\n                                                            <action selector=\"toggleAutomaticSpellingCorrection:\" target=\"Ady-hI-5gd\" id=\"2lM-Qi-WAP\"/>\n                                                        </connections>\n                                                    </menuItem>\n                                                </items>\n                                            </menu>\n                                        </menuItem>\n                                        <menuItem title=\"Substitutions\" id=\"9ic-FL-obx\">\n                                            <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                            <menu key=\"submenu\" title=\"Substitutions\" id=\"FeM-D8-WVr\">\n                                                <items>\n                                                    <menuItem title=\"Show Substitutions\" id=\"z6F-FW-3nz\">\n                                                        <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                                        <connections>\n                                                            <action selector=\"orderFrontSubstitutionsPanel:\" target=\"Ady-hI-5gd\" id=\"oku-mr-iSq\"/>\n                                                        </connections>\n                                                    </menuItem>\n                                                    <menuItem isSeparatorItem=\"YES\" id=\"gPx-C9-uUO\"/>\n                                                    <menuItem title=\"Smart Copy/Paste\" id=\"9yt-4B-nSM\">\n                                                        <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                                        <connections>\n                                                            <action selector=\"toggleSmartInsertDelete:\" target=\"Ady-hI-5gd\" id=\"3IJ-Se-DZD\"/>\n                                                        </connections>\n                                                    </menuItem>\n                                                    <menuItem title=\"Smart Quotes\" id=\"hQb-2v-fYv\">\n                                                        <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                                        <connections>\n                                                            <action selector=\"toggleAutomaticQuoteSubstitution:\" target=\"Ady-hI-5gd\" id=\"ptq-xd-QOA\"/>\n                                                        </connections>\n                                                    </menuItem>\n                                                    <menuItem title=\"Smart Dashes\" id=\"rgM-f4-ycn\">\n                                                        <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                                        <connections>\n                                                            <action selector=\"toggleAutomaticDashSubstitution:\" target=\"Ady-hI-5gd\" id=\"oCt-pO-9gS\"/>\n                                                        </connections>\n                                                    </menuItem>\n                                                    <menuItem title=\"Smart Links\" id=\"cwL-P1-jid\">\n                                                        <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                                        <connections>\n                                                            <action selector=\"toggleAutomaticLinkDetection:\" target=\"Ady-hI-5gd\" id=\"Gip-E3-Fov\"/>\n                                                        </connections>\n                                                    </menuItem>\n                                                    <menuItem title=\"Data Detectors\" id=\"tRr-pd-1PS\">\n                                                        <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                                        <connections>\n                                                            <action selector=\"toggleAutomaticDataDetection:\" target=\"Ady-hI-5gd\" id=\"R1I-Nq-Kbl\"/>\n                                                        </connections>\n                                                    </menuItem>\n                                                    <menuItem title=\"Text Replacement\" id=\"HFQ-gK-NFA\">\n                                                        <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                                        <connections>\n                                                            <action selector=\"toggleAutomaticTextReplacement:\" target=\"Ady-hI-5gd\" id=\"DvP-Fe-Py6\"/>\n                                                        </connections>\n                                                    </menuItem>\n                                                </items>\n                                            </menu>\n                                        </menuItem>\n                                        <menuItem title=\"Transformations\" id=\"2oI-Rn-ZJC\">\n                                            <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                            <menu key=\"submenu\" title=\"Transformations\" id=\"c8a-y6-VQd\">\n                                                <items>\n                                                    <menuItem title=\"Make Upper Case\" id=\"vmV-6d-7jI\">\n                                                        <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                                        <connections>\n                                                            <action selector=\"uppercaseWord:\" target=\"Ady-hI-5gd\" id=\"sPh-Tk-edu\"/>\n                                                        </connections>\n                                                    </menuItem>\n                                                    <menuItem title=\"Make Lower Case\" id=\"d9M-CD-aMd\">\n                                                        <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                                        <connections>\n                                                            <action selector=\"lowercaseWord:\" target=\"Ady-hI-5gd\" id=\"iUZ-b5-hil\"/>\n                                                        </connections>\n                                                    </menuItem>\n                                                    <menuItem title=\"Capitalize\" id=\"UEZ-Bs-lqG\">\n                                                        <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                                        <connections>\n                                                            <action selector=\"capitalizeWord:\" target=\"Ady-hI-5gd\" id=\"26H-TL-nsh\"/>\n                                                        </connections>\n                                                    </menuItem>\n                                                </items>\n                                            </menu>\n                                        </menuItem>\n                                        <menuItem title=\"Speech\" id=\"xrE-MZ-jX0\">\n                                            <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                            <menu key=\"submenu\" title=\"Speech\" id=\"3rS-ZA-NoH\">\n                                                <items>\n                                                    <menuItem title=\"Start Speaking\" id=\"Ynk-f8-cLZ\">\n                                                        <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                                        <connections>\n                                                            <action selector=\"startSpeaking:\" target=\"Ady-hI-5gd\" id=\"654-Ng-kyl\"/>\n                                                        </connections>\n                                                    </menuItem>\n                                                    <menuItem title=\"Stop Speaking\" id=\"Oyz-dy-DGm\">\n                                                        <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                                        <connections>\n                                                            <action selector=\"stopSpeaking:\" target=\"Ady-hI-5gd\" id=\"dX8-6p-jy9\"/>\n                                                        </connections>\n                                                    </menuItem>\n                                                </items>\n                                            </menu>\n                                        </menuItem>\n                                    </items>\n                                </menu>\n                            </menuItem>\n                            <menuItem title=\"Format\" id=\"jxT-CU-nIS\">\n                                <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                <menu key=\"submenu\" title=\"Format\" id=\"GEO-Iw-cKr\">\n                                    <items>\n                                        <menuItem title=\"Font\" id=\"Gi5-1S-RQB\">\n                                            <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                            <menu key=\"submenu\" title=\"Font\" systemMenu=\"font\" id=\"aXa-aM-Jaq\">\n                                                <items>\n                                                    <menuItem title=\"Show Fonts\" keyEquivalent=\"t\" id=\"Q5e-8K-NDq\">\n                                                        <connections>\n                                                            <action selector=\"orderFrontFontPanel:\" target=\"YLy-65-1bz\" id=\"WHr-nq-2xA\"/>\n                                                        </connections>\n                                                    </menuItem>\n                                                    <menuItem title=\"Bold\" tag=\"2\" keyEquivalent=\"b\" id=\"GB9-OM-e27\">\n                                                        <connections>\n                                                            <action selector=\"addFontTrait:\" target=\"YLy-65-1bz\" id=\"hqk-hr-sYV\"/>\n                                                        </connections>\n                                                    </menuItem>\n                                                    <menuItem title=\"Italic\" tag=\"1\" keyEquivalent=\"i\" id=\"Vjx-xi-njq\">\n                                                        <connections>\n                                                            <action selector=\"addFontTrait:\" target=\"YLy-65-1bz\" id=\"IHV-OB-c03\"/>\n                                                        </connections>\n                                                    </menuItem>\n                                                    <menuItem title=\"Underline\" keyEquivalent=\"u\" id=\"WRG-CD-K1S\">\n                                                        <connections>\n                                                            <action selector=\"underline:\" target=\"Ady-hI-5gd\" id=\"FYS-2b-JAY\"/>\n                                                        </connections>\n                                                    </menuItem>\n                                                    <menuItem isSeparatorItem=\"YES\" id=\"5gT-KC-WSO\"/>\n                                                    <menuItem title=\"Bigger\" tag=\"3\" keyEquivalent=\"+\" id=\"Ptp-SP-VEL\">\n                                                        <connections>\n                                                            <action selector=\"modifyFont:\" target=\"YLy-65-1bz\" id=\"Uc7-di-UnL\"/>\n                                                        </connections>\n                                                    </menuItem>\n                                                    <menuItem title=\"Smaller\" tag=\"4\" keyEquivalent=\"-\" id=\"i1d-Er-qST\">\n                                                        <connections>\n                                                            <action selector=\"modifyFont:\" target=\"YLy-65-1bz\" id=\"HcX-Lf-eNd\"/>\n                                                        </connections>\n                                                    </menuItem>\n                                                    <menuItem isSeparatorItem=\"YES\" id=\"kx3-Dk-x3B\"/>\n                                                    <menuItem title=\"Kern\" id=\"jBQ-r6-VK2\">\n                                                        <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                                        <menu key=\"submenu\" title=\"Kern\" id=\"tlD-Oa-oAM\">\n                                                            <items>\n                                                                <menuItem title=\"Use Default\" id=\"GUa-eO-cwY\">\n                                                                    <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                                                    <connections>\n                                                                        <action selector=\"useStandardKerning:\" target=\"Ady-hI-5gd\" id=\"6dk-9l-Ckg\"/>\n                                                                    </connections>\n                                                                </menuItem>\n                                                                <menuItem title=\"Use None\" id=\"cDB-IK-hbR\">\n                                                                    <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                                                    <connections>\n                                                                        <action selector=\"turnOffKerning:\" target=\"Ady-hI-5gd\" id=\"U8a-gz-Maa\"/>\n                                                                    </connections>\n                                                                </menuItem>\n                                                                <menuItem title=\"Tighten\" id=\"46P-cB-AYj\">\n                                                                    <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                                                    <connections>\n                                                                        <action selector=\"tightenKerning:\" target=\"Ady-hI-5gd\" id=\"hr7-Nz-8ro\"/>\n                                                                    </connections>\n                                                                </menuItem>\n                                                                <menuItem title=\"Loosen\" id=\"ogc-rX-tC1\">\n                                                                    <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                                                    <connections>\n                                                                        <action selector=\"loosenKerning:\" target=\"Ady-hI-5gd\" id=\"8i4-f9-FKE\"/>\n                                                                    </connections>\n                                                                </menuItem>\n                                                            </items>\n                                                        </menu>\n                                                    </menuItem>\n                                                    <menuItem title=\"Ligatures\" id=\"o6e-r0-MWq\">\n                                                        <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                                        <menu key=\"submenu\" title=\"Ligatures\" id=\"w0m-vy-SC9\">\n                                                            <items>\n                                                                <menuItem title=\"Use Default\" id=\"agt-UL-0e3\">\n                                                                    <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                                                    <connections>\n                                                                        <action selector=\"useStandardLigatures:\" target=\"Ady-hI-5gd\" id=\"7uR-wd-Dx6\"/>\n                                                                    </connections>\n                                                                </menuItem>\n                                                                <menuItem title=\"Use None\" id=\"J7y-lM-qPV\">\n                                                                    <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                                                    <connections>\n                                                                        <action selector=\"turnOffLigatures:\" target=\"Ady-hI-5gd\" id=\"iX2-gA-Ilz\"/>\n                                                                    </connections>\n                                                                </menuItem>\n                                                                <menuItem title=\"Use All\" id=\"xQD-1f-W4t\">\n                                                                    <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                                                    <connections>\n                                                                        <action selector=\"useAllLigatures:\" target=\"Ady-hI-5gd\" id=\"KcB-kA-TuK\"/>\n                                                                    </connections>\n                                                                </menuItem>\n                                                            </items>\n                                                        </menu>\n                                                    </menuItem>\n                                                    <menuItem title=\"Baseline\" id=\"OaQ-X3-Vso\">\n                                                        <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                                        <menu key=\"submenu\" title=\"Baseline\" id=\"ijk-EB-dga\">\n                                                            <items>\n                                                                <menuItem title=\"Use Default\" id=\"3Om-Ey-2VK\">\n                                                                    <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                                                    <connections>\n                                                                        <action selector=\"unscript:\" target=\"Ady-hI-5gd\" id=\"0vZ-95-Ywn\"/>\n                                                                    </connections>\n                                                                </menuItem>\n                                                                <menuItem title=\"Superscript\" id=\"Rqc-34-cIF\">\n                                                                    <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                                                    <connections>\n                                                                        <action selector=\"superscript:\" target=\"Ady-hI-5gd\" id=\"3qV-fo-wpU\"/>\n                                                                    </connections>\n                                                                </menuItem>\n                                                                <menuItem title=\"Subscript\" id=\"I0S-gh-46l\">\n                                                                    <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                                                    <connections>\n                                                                        <action selector=\"subscript:\" target=\"Ady-hI-5gd\" id=\"Q6W-4W-IGz\"/>\n                                                                    </connections>\n                                                                </menuItem>\n                                                                <menuItem title=\"Raise\" id=\"2h7-ER-AoG\">\n                                                                    <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                                                    <connections>\n                                                                        <action selector=\"raiseBaseline:\" target=\"Ady-hI-5gd\" id=\"4sk-31-7Q9\"/>\n                                                                    </connections>\n                                                                </menuItem>\n                                                                <menuItem title=\"Lower\" id=\"1tx-W0-xDw\">\n                                                                    <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                                                    <connections>\n                                                                        <action selector=\"lowerBaseline:\" target=\"Ady-hI-5gd\" id=\"OF1-bc-KW4\"/>\n                                                                    </connections>\n                                                                </menuItem>\n                                                            </items>\n                                                        </menu>\n                                                    </menuItem>\n                                                    <menuItem isSeparatorItem=\"YES\" id=\"Ndw-q3-faq\"/>\n                                                    <menuItem title=\"Show Colors\" keyEquivalent=\"C\" id=\"bgn-CT-cEk\">\n                                                        <connections>\n                                                            <action selector=\"orderFrontColorPanel:\" target=\"Ady-hI-5gd\" id=\"mSX-Xz-DV3\"/>\n                                                        </connections>\n                                                    </menuItem>\n                                                    <menuItem isSeparatorItem=\"YES\" id=\"iMs-zA-UFJ\"/>\n                                                    <menuItem title=\"Copy Style\" keyEquivalent=\"c\" id=\"5Vv-lz-BsD\">\n                                                        <modifierMask key=\"keyEquivalentModifierMask\" option=\"YES\" command=\"YES\"/>\n                                                        <connections>\n                                                            <action selector=\"copyFont:\" target=\"Ady-hI-5gd\" id=\"GJO-xA-L4q\"/>\n                                                        </connections>\n                                                    </menuItem>\n                                                    <menuItem title=\"Paste Style\" keyEquivalent=\"v\" id=\"vKC-jM-MkH\">\n                                                        <modifierMask key=\"keyEquivalentModifierMask\" option=\"YES\" command=\"YES\"/>\n                                                        <connections>\n                                                            <action selector=\"pasteFont:\" target=\"Ady-hI-5gd\" id=\"JfD-CL-leO\"/>\n                                                        </connections>\n                                                    </menuItem>\n                                                </items>\n                                            </menu>\n                                        </menuItem>\n                                        <menuItem title=\"Text\" id=\"Fal-I4-PZk\">\n                                            <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                            <menu key=\"submenu\" title=\"Text\" id=\"d9c-me-L2H\">\n                                                <items>\n                                                    <menuItem title=\"Align Left\" keyEquivalent=\"{\" id=\"ZM1-6Q-yy1\">\n                                                        <connections>\n                                                            <action selector=\"alignLeft:\" target=\"Ady-hI-5gd\" id=\"zUv-R1-uAa\"/>\n                                                        </connections>\n                                                    </menuItem>\n                                                    <menuItem title=\"Center\" keyEquivalent=\"|\" id=\"VIY-Ag-zcb\">\n                                                        <connections>\n                                                            <action selector=\"alignCenter:\" target=\"Ady-hI-5gd\" id=\"spX-mk-kcS\"/>\n                                                        </connections>\n                                                    </menuItem>\n                                                    <menuItem title=\"Justify\" id=\"J5U-5w-g23\">\n                                                        <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                                        <connections>\n                                                            <action selector=\"alignJustified:\" target=\"Ady-hI-5gd\" id=\"ljL-7U-jND\"/>\n                                                        </connections>\n                                                    </menuItem>\n                                                    <menuItem title=\"Align Right\" keyEquivalent=\"}\" id=\"wb2-vD-lq4\">\n                                                        <connections>\n                                                            <action selector=\"alignRight:\" target=\"Ady-hI-5gd\" id=\"r48-bG-YeY\"/>\n                                                        </connections>\n                                                    </menuItem>\n                                                    <menuItem isSeparatorItem=\"YES\" id=\"4s2-GY-VfK\"/>\n                                                    <menuItem title=\"Writing Direction\" id=\"H1b-Si-o9J\">\n                                                        <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                                        <menu key=\"submenu\" title=\"Writing Direction\" id=\"8mr-sm-Yjd\">\n                                                            <items>\n                                                                <menuItem title=\"Paragraph\" enabled=\"NO\" id=\"ZvO-Gk-QUH\">\n                                                                    <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                                                </menuItem>\n                                                                <menuItem id=\"YGs-j5-SAR\">\n                                                                    <string key=\"title\">\tDefault</string>\n                                                                    <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                                                    <connections>\n                                                                        <action selector=\"makeBaseWritingDirectionNatural:\" target=\"Ady-hI-5gd\" id=\"qtV-5e-UBP\"/>\n                                                                    </connections>\n                                                                </menuItem>\n                                                                <menuItem id=\"Lbh-J2-qVU\">\n                                                                    <string key=\"title\">\tLeft to Right</string>\n                                                                    <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                                                    <connections>\n                                                                        <action selector=\"makeBaseWritingDirectionLeftToRight:\" target=\"Ady-hI-5gd\" id=\"S0X-9S-QSf\"/>\n                                                                    </connections>\n                                                                </menuItem>\n                                                                <menuItem id=\"jFq-tB-4Kx\">\n                                                                    <string key=\"title\">\tRight to Left</string>\n                                                                    <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                                                    <connections>\n                                                                        <action selector=\"makeBaseWritingDirectionRightToLeft:\" target=\"Ady-hI-5gd\" id=\"5fk-qB-AqJ\"/>\n                                                                    </connections>\n                                                                </menuItem>\n                                                                <menuItem isSeparatorItem=\"YES\" id=\"swp-gr-a21\"/>\n                                                                <menuItem title=\"Selection\" enabled=\"NO\" id=\"cqv-fj-IhA\">\n                                                                    <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                                                </menuItem>\n                                                                <menuItem id=\"Nop-cj-93Q\">\n                                                                    <string key=\"title\">\tDefault</string>\n                                                                    <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                                                    <connections>\n                                                                        <action selector=\"makeTextWritingDirectionNatural:\" target=\"Ady-hI-5gd\" id=\"lPI-Se-ZHp\"/>\n                                                                    </connections>\n                                                                </menuItem>\n                                                                <menuItem id=\"BgM-ve-c93\">\n                                                                    <string key=\"title\">\tLeft to Right</string>\n                                                                    <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                                                    <connections>\n                                                                        <action selector=\"makeTextWritingDirectionLeftToRight:\" target=\"Ady-hI-5gd\" id=\"caW-Bv-w94\"/>\n                                                                    </connections>\n                                                                </menuItem>\n                                                                <menuItem id=\"RB4-Sm-HuC\">\n                                                                    <string key=\"title\">\tRight to Left</string>\n                                                                    <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                                                    <connections>\n                                                                        <action selector=\"makeTextWritingDirectionRightToLeft:\" target=\"Ady-hI-5gd\" id=\"EXD-6r-ZUu\"/>\n                                                                    </connections>\n                                                                </menuItem>\n                                                            </items>\n                                                        </menu>\n                                                    </menuItem>\n                                                    <menuItem isSeparatorItem=\"YES\" id=\"fKy-g9-1gm\"/>\n                                                    <menuItem title=\"Show Ruler\" id=\"vLm-3I-IUL\">\n                                                        <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                                        <connections>\n                                                            <action selector=\"toggleRuler:\" target=\"Ady-hI-5gd\" id=\"FOx-HJ-KwY\"/>\n                                                        </connections>\n                                                    </menuItem>\n                                                    <menuItem title=\"Copy Ruler\" keyEquivalent=\"c\" id=\"MkV-Pr-PK5\">\n                                                        <modifierMask key=\"keyEquivalentModifierMask\" control=\"YES\" command=\"YES\"/>\n                                                        <connections>\n                                                            <action selector=\"copyRuler:\" target=\"Ady-hI-5gd\" id=\"71i-fW-3W2\"/>\n                                                        </connections>\n                                                    </menuItem>\n                                                    <menuItem title=\"Paste Ruler\" keyEquivalent=\"v\" id=\"LVM-kO-fVI\">\n                                                        <modifierMask key=\"keyEquivalentModifierMask\" control=\"YES\" command=\"YES\"/>\n                                                        <connections>\n                                                            <action selector=\"pasteRuler:\" target=\"Ady-hI-5gd\" id=\"cSh-wd-qM2\"/>\n                                                        </connections>\n                                                    </menuItem>\n                                                </items>\n                                            </menu>\n                                        </menuItem>\n                                    </items>\n                                </menu>\n                            </menuItem>\n                            <menuItem title=\"View\" id=\"H8h-7b-M4v\">\n                                <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                <menu key=\"submenu\" title=\"View\" id=\"HyV-fh-RgO\">\n                                    <items>\n                                        <menuItem title=\"Show Toolbar\" keyEquivalent=\"t\" id=\"snW-S8-Cw5\">\n                                            <modifierMask key=\"keyEquivalentModifierMask\" option=\"YES\" command=\"YES\"/>\n                                            <connections>\n                                                <action selector=\"toggleToolbarShown:\" target=\"Ady-hI-5gd\" id=\"BXY-wc-z0C\"/>\n                                            </connections>\n                                        </menuItem>\n                                        <menuItem title=\"Customize Toolbar…\" id=\"1UK-8n-QPP\">\n                                            <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                            <connections>\n                                                <action selector=\"runToolbarCustomizationPalette:\" target=\"Ady-hI-5gd\" id=\"pQI-g3-MTW\"/>\n                                            </connections>\n                                        </menuItem>\n                                        <menuItem isSeparatorItem=\"YES\" id=\"hB3-LF-h0Y\"/>\n                                        <menuItem title=\"Show Sidebar\" keyEquivalent=\"s\" id=\"kIP-vf-haE\">\n                                            <modifierMask key=\"keyEquivalentModifierMask\" control=\"YES\" command=\"YES\"/>\n                                            <connections>\n                                                <action selector=\"toggleSidebar:\" target=\"Ady-hI-5gd\" id=\"iwa-gc-5KM\"/>\n                                            </connections>\n                                        </menuItem>\n                                        <menuItem title=\"Enter Full Screen\" keyEquivalent=\"f\" id=\"4J7-dP-txa\">\n                                            <modifierMask key=\"keyEquivalentModifierMask\" control=\"YES\" command=\"YES\"/>\n                                            <connections>\n                                                <action selector=\"toggleFullScreen:\" target=\"Ady-hI-5gd\" id=\"dU3-MA-1Rq\"/>\n                                            </connections>\n                                        </menuItem>\n                                    </items>\n                                </menu>\n                            </menuItem>\n                            <menuItem title=\"Window\" id=\"aUF-d1-5bR\">\n                                <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                <menu key=\"submenu\" title=\"Window\" systemMenu=\"window\" id=\"Td7-aD-5lo\">\n                                    <items>\n                                        <menuItem title=\"Minimize\" keyEquivalent=\"m\" id=\"OY7-WF-poV\">\n                                            <connections>\n                                                <action selector=\"performMiniaturize:\" target=\"Ady-hI-5gd\" id=\"VwT-WD-YPe\"/>\n                                            </connections>\n                                        </menuItem>\n                                        <menuItem title=\"Zoom\" id=\"R4o-n2-Eq4\">\n                                            <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                            <connections>\n                                                <action selector=\"performZoom:\" target=\"Ady-hI-5gd\" id=\"DIl-cC-cCs\"/>\n                                            </connections>\n                                        </menuItem>\n                                        <menuItem isSeparatorItem=\"YES\" id=\"eu3-7i-yIM\"/>\n                                        <menuItem title=\"Bring All to Front\" id=\"LE2-aR-0XJ\">\n                                            <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                            <connections>\n                                                <action selector=\"arrangeInFront:\" target=\"Ady-hI-5gd\" id=\"DRN-fu-gQh\"/>\n                                            </connections>\n                                        </menuItem>\n                                    </items>\n                                </menu>\n                            </menuItem>\n                            <menuItem title=\"Help\" id=\"wpr-3q-Mcd\">\n                                <modifierMask key=\"keyEquivalentModifierMask\"/>\n                                <menu key=\"submenu\" title=\"Help\" systemMenu=\"help\" id=\"F2S-fz-NVQ\">\n                                    <items>\n                                        <menuItem title=\"react_native_windows Help\" keyEquivalent=\"?\" id=\"FKE-Sm-Kum\">\n                                            <connections>\n                                                <action selector=\"showHelp:\" target=\"Ady-hI-5gd\" id=\"y7X-2Q-9no\"/>\n                                            </connections>\n                                        </menuItem>\n                                    </items>\n                                </menu>\n                            </menuItem>\n                        </items>\n                    </menu>\n                    <connections>\n                        <outlet property=\"delegate\" destination=\"Voe-Tx-rLC\" id=\"PrD-fu-P6m\"/>\n                    </connections>\n                </application>\n                <customObject id=\"Voe-Tx-rLC\" customClass=\"AppDelegate\" customModuleProvider=\"\"/>\n                <customObject id=\"YLy-65-1bz\" customClass=\"NSFontManager\"/>\n                <customObject id=\"Ady-hI-5gd\" userLabel=\"First Responder\" customClass=\"NSResponder\" sceneMemberID=\"firstResponder\"/>\n            </objects>\n            <point key=\"canvasLocation\" x=\"75\" y=\"0.0\"/>\n        </scene>\n        <!--Window Controller-->\n        <scene sceneID=\"R2V-B0-nI4\">\n            <objects>\n                <windowController id=\"B8D-0N-5wS\" sceneMemberID=\"viewController\">\n                    <window key=\"window\" title=\"react_native_windows\" allowsToolTipsWhenApplicationIsInactive=\"NO\" autorecalculatesKeyViewLoop=\"YES\" releasedWhenClosed=\"NO\" visibleAtLaunch=\"NO\" animationBehavior=\"default\" id=\"IQv-IB-iLA\">\n                        <windowStyleMask key=\"styleMask\" titled=\"YES\" closable=\"YES\" miniaturizable=\"YES\" resizable=\"YES\"/>\n                        <windowPositionMask key=\"initialPositionMask\" leftStrut=\"YES\" rightStrut=\"YES\" topStrut=\"YES\" bottomStrut=\"YES\"/>\n                        <rect key=\"contentRect\" x=\"196\" y=\"240\" width=\"480\" height=\"270\"/>\n                        <rect key=\"screenRect\" x=\"0.0\" y=\"0.0\" width=\"1680\" height=\"1027\"/>\n                        <connections>\n                            <outlet property=\"delegate\" destination=\"B8D-0N-5wS\" id=\"98r-iN-zZc\"/>\n                        </connections>\n                    </window>\n                    <connections>\n                        <segue destination=\"XfG-lQ-9wD\" kind=\"relationship\" relationship=\"window.shadowedContentViewController\" id=\"cq2-FE-JQM\"/>\n                    </connections>\n                </windowController>\n                <customObject id=\"Oky-zY-oP4\" userLabel=\"First Responder\" customClass=\"NSResponder\" sceneMemberID=\"firstResponder\"/>\n            </objects>\n            <point key=\"canvasLocation\" x=\"75\" y=\"250\"/>\n        </scene>\n        <!--View Controller-->\n        <scene sceneID=\"hIz-AP-VOD\">\n            <objects>\n                <viewController id=\"XfG-lQ-9wD\" customClass=\"ViewController\" customModuleProvider=\"\" sceneMemberID=\"viewController\">\n                    <view key=\"view\" id=\"m2S-Jp-Qdl\">\n                        <rect key=\"frame\" x=\"0.0\" y=\"0.0\" width=\"480\" height=\"270\"/>\n                        <autoresizingMask key=\"autoresizingMask\"/>\n                    </view>\n                </viewController>\n                <customObject id=\"rPt-NT-nkU\" userLabel=\"First Responder\" customClass=\"NSResponder\" sceneMemberID=\"firstResponder\"/>\n            </objects>\n            <point key=\"canvasLocation\" x=\"75\" y=\"655\"/>\n        </scene>\n    </scenes>\n</document>\n"
  },
  {
    "path": "example/react_native_windows/macos/react_native_windows-macOS/Info.plist",
    "content": "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<!DOCTYPE plist PUBLIC \"-//Apple//DTD PLIST 1.0//EN\" \"http://www.apple.com/DTDs/PropertyList-1.0.dtd\">\n<plist version=\"1.0\">\n<dict>\n\t<key>CFBundleDevelopmentRegion</key>\n\t<string>$(DEVELOPMENT_LANGUAGE)</string>\n\t<key>CFBundleExecutable</key>\n\t<string>$(EXECUTABLE_NAME)</string>\n\t<key>CFBundleIconFile</key>\n\t<string></string>\n\t<key>CFBundleIdentifier</key>\n\t<string>$(PRODUCT_BUNDLE_IDENTIFIER)</string>\n\t<key>CFBundleInfoDictionaryVersion</key>\n\t<string>6.0</string>\n\t<key>CFBundleName</key>\n\t<string>$(PRODUCT_NAME)</string>\n\t<key>CFBundlePackageType</key>\n\t<string>$(PRODUCT_BUNDLE_PACKAGE_TYPE)</string>\n\t<key>CFBundleShortVersionString</key>\n\t<string>1.0</string>\n\t<key>CFBundleVersion</key>\n\t<string>1</string>\n\t<key>LSMinimumSystemVersion</key>\n\t<string>$(MACOSX_DEPLOYMENT_TARGET)</string>\n\t<key>NSAppTransportSecurity</key>\n \t<dict>\n \t\t<key>NSAllowsArbitraryLoads</key>\n \t\t<true/>\n \t\t<key>NSExceptionDomains</key>\n \t\t<dict>\n \t\t\t<key>localhost</key>\n \t\t\t<dict>\n \t\t\t\t<key>NSExceptionAllowsInsecureHTTPLoads</key>\n \t\t\t\t<true/>\n \t\t\t</dict>\n \t\t</dict>\n \t</dict>\n\t<key>NSMainStoryboardFile</key>\n\t<string>Main</string>\n\t<key>NSPrincipalClass</key>\n\t<string>NSApplication</string>\n\t<key>NSSupportsAutomaticTermination</key>\n\t<true/>\n\t<key>NSSupportsSuddenTermination</key>\n\t<true/>\n</dict>\n</plist>\n"
  },
  {
    "path": "example/react_native_windows/macos/react_native_windows-macOS/ViewController.h",
    "content": "#import <Cocoa/Cocoa.h>\n\n@interface ViewController : NSViewController\n\n@end\n"
  },
  {
    "path": "example/react_native_windows/macos/react_native_windows-macOS/ViewController.m",
    "content": "#import \"ViewController.h\"\n#import \"AppDelegate.h\"\n\n#import <React/RCTRootView.h>\n\n@implementation ViewController\n\n- (void)viewDidLoad {\n  [super viewDidLoad];\n\n  RCTBridge *bridge = [((AppDelegate *)[NSApp delegate])bridge];\n  RCTRootView *rootView = [[RCTRootView alloc] initWithBridge:bridge moduleName:@\"react_native_windows\" initialProperties:nil];\n\n  NSView *view = [self view];\n\n  [view addSubview:rootView];\n  [rootView setBackgroundColor:[NSColor windowBackgroundColor]];\n  [rootView setFrame:[view bounds]];\n  [rootView setAutoresizingMask:(NSViewMinXMargin | NSViewMinXMargin | NSViewMinYMargin | NSViewMaxYMargin | NSViewWidthSizable | NSViewHeightSizable)];\n}\n\n@end\n"
  },
  {
    "path": "example/react_native_windows/macos/react_native_windows-macOS/main.m",
    "content": "#import <Cocoa/Cocoa.h>\n\nint main(int argc, const char *argv[]) {\n  return NSApplicationMain(argc, argv);\n}\n"
  },
  {
    "path": "example/react_native_windows/macos/react_native_windows-macOS/react_native_windows.entitlements",
    "content": "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<!DOCTYPE plist PUBLIC \"-//Apple//DTD PLIST 1.0//EN\" \"http://www.apple.com/DTDs/PropertyList-1.0.dtd\">\n<plist version=\"1.0\">\n<dict>\n\t<key>com.apple.security.app-sandbox</key>\n\t<true/>\n\t<key>com.apple.security.files.user-selected.read-only</key>\n\t<true/>\n\t<key>com.apple.security.network.client</key>\n\t<true/>\n</dict>\n</plist>\n"
  },
  {
    "path": "example/react_native_windows/macos/react_native_windows.xcodeproj/project.pbxproj",
    "content": "// !$*UTF8*$!\n{\n\tarchiveVersion = 1;\n\tclasses = {\n\t};\n\tobjectVersion = 46;\n\tobjects = {\n\n/* Begin PBXBuildFile section */\n\t\t0496A360A6F874C295C73D4B /* libPods-Shared-react_native_windows-macOS.a in Frameworks */ = {isa = PBXBuildFile; fileRef = C8DBC48FD7C3AEF576C57B21 /* libPods-Shared-react_native_windows-macOS.a */; };\n\t\t13B07FBC1A68108700A75B9A /* AppDelegate.m in Sources */ = {isa = PBXBuildFile; fileRef = 13B07FB01A68108700A75B9A /* AppDelegate.m */; };\n\t\t13B07FBD1A68108700A75B9A /* LaunchScreen.xib in Resources */ = {isa = PBXBuildFile; fileRef = 13B07FB11A68108700A75B9A /* LaunchScreen.xib */; };\n\t\t13B07FBF1A68108700A75B9A /* Images.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 13B07FB51A68108700A75B9A /* Images.xcassets */; };\n\t\t13B07FC11A68108700A75B9A /* main.m in Sources */ = {isa = PBXBuildFile; fileRef = 13B07FB71A68108700A75B9A /* main.m */; };\n\t\t5142014D2437B4B30078DB4F /* AppDelegate.m in Sources */ = {isa = PBXBuildFile; fileRef = 5142014C2437B4B30078DB4F /* AppDelegate.m */; };\n\t\t514201502437B4B30078DB4F /* ViewController.m in Sources */ = {isa = PBXBuildFile; fileRef = 5142014F2437B4B30078DB4F /* ViewController.m */; };\n\t\t514201522437B4B40078DB4F /* Assets.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 514201512437B4B40078DB4F /* Assets.xcassets */; };\n\t\t514201552437B4B40078DB4F /* Main.storyboard in Resources */ = {isa = PBXBuildFile; fileRef = 514201532437B4B40078DB4F /* Main.storyboard */; };\n\t\t514201582437B4B40078DB4F /* main.m in Sources */ = {isa = PBXBuildFile; fileRef = 514201572437B4B40078DB4F /* main.m */; };\n\t\tB5C72D9C27A1E1D711C050EF /* libPods-Shared-react_native_windows-iOS.a in Frameworks */ = {isa = PBXBuildFile; fileRef = FB6EED1BDEABADF047CC5223 /* libPods-Shared-react_native_windows-iOS.a */; };\n/* End PBXBuildFile section */\n\n/* Begin PBXFileReference section */\n\t\t008F07F21AC5B25A0029DE68 /* main.jsbundle */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text; path = main.jsbundle; sourceTree = \"<group>\"; };\n\t\t02422F9FB6FF5F34B4E63E6F /* Pods-Shared-react_native_windows-macOS.debug.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = \"Pods-Shared-react_native_windows-macOS.debug.xcconfig\"; path = \"Target Support Files/Pods-Shared-react_native_windows-macOS/Pods-Shared-react_native_windows-macOS.debug.xcconfig\"; sourceTree = \"<group>\"; };\n\t\t13B07F961A680F5B00A75B9A /* react_native_windows.app */ = {isa = PBXFileReference; explicitFileType = wrapper.application; includeInIndex = 0; path = react_native_windows.app; sourceTree = BUILT_PRODUCTS_DIR; };\n\t\t13B07FAF1A68108700A75B9A /* AppDelegate.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; path = AppDelegate.h; sourceTree = \"<group>\"; };\n\t\t13B07FB01A68108700A75B9A /* AppDelegate.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = AppDelegate.m; sourceTree = \"<group>\"; };\n\t\t13B07FB21A68108700A75B9A /* Base */ = {isa = PBXFileReference; lastKnownFileType = file.xib; name = Base; path = Base.lproj/LaunchScreen.xib; sourceTree = \"<group>\"; };\n\t\t13B07FB51A68108700A75B9A /* Images.xcassets */ = {isa = PBXFileReference; lastKnownFileType = folder.assetcatalog; path = Images.xcassets; sourceTree = \"<group>\"; };\n\t\t13B07FB61A68108700A75B9A /* Info.plist */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.plist.xml; name = Info.plist; path = react_native_windows/Info.plist; sourceTree = \"<group>\"; };\n\t\t13B07FB71A68108700A75B9A /* main.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = main.m; sourceTree = \"<group>\"; };\n\t\t38423A3E24576CBC00BC2EAC /* main.jsbundle */ = {isa = PBXFileReference; lastKnownFileType = text; path = main.jsbundle; sourceTree = \"<group>\"; };\n\t\t514201492437B4B30078DB4F /* react_native_windows.app */ = {isa = PBXFileReference; explicitFileType = wrapper.application; includeInIndex = 0; path = react_native_windows.app; sourceTree = BUILT_PRODUCTS_DIR; };\n\t\t5142014B2437B4B30078DB4F /* AppDelegate.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = AppDelegate.h; sourceTree = \"<group>\"; };\n\t\t5142014C2437B4B30078DB4F /* AppDelegate.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = AppDelegate.m; sourceTree = \"<group>\"; };\n\t\t5142014E2437B4B30078DB4F /* ViewController.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = ViewController.h; sourceTree = \"<group>\"; };\n\t\t5142014F2437B4B30078DB4F /* ViewController.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = ViewController.m; sourceTree = \"<group>\"; };\n\t\t514201512437B4B40078DB4F /* Assets.xcassets */ = {isa = PBXFileReference; lastKnownFileType = folder.assetcatalog; path = Assets.xcassets; sourceTree = \"<group>\"; };\n\t\t514201542437B4B40078DB4F /* Base */ = {isa = PBXFileReference; lastKnownFileType = file.storyboard; name = Base; path = Base.lproj/Main.storyboard; sourceTree = \"<group>\"; };\n\t\t514201562437B4B40078DB4F /* Info.plist */ = {isa = PBXFileReference; lastKnownFileType = text.plist.xml; path = Info.plist; sourceTree = \"<group>\"; };\n\t\t514201572437B4B40078DB4F /* main.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = main.m; sourceTree = \"<group>\"; };\n\t\t514201592437B4B40078DB4F /* react_native_windows.entitlements */ = {isa = PBXFileReference; lastKnownFileType = text.plist.entitlements; path = react_native_windows.entitlements; sourceTree = \"<group>\"; };\n\t\t9D32DFD059D5DB6DDEF38881 /* Pods-Shared-react_native_windows-iOS.debug.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = \"Pods-Shared-react_native_windows-iOS.debug.xcconfig\"; path = \"Target Support Files/Pods-Shared-react_native_windows-iOS/Pods-Shared-react_native_windows-iOS.debug.xcconfig\"; sourceTree = \"<group>\"; };\n\t\tA82DFB63B157C65E5D698CA2 /* Pods-Shared-react_native_windows-iOS.release.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = \"Pods-Shared-react_native_windows-iOS.release.xcconfig\"; path = \"Target Support Files/Pods-Shared-react_native_windows-iOS/Pods-Shared-react_native_windows-iOS.release.xcconfig\"; sourceTree = \"<group>\"; };\n\t\tC8DBC48FD7C3AEF576C57B21 /* libPods-Shared-react_native_windows-macOS.a */ = {isa = PBXFileReference; explicitFileType = archive.ar; includeInIndex = 0; path = \"libPods-Shared-react_native_windows-macOS.a\"; sourceTree = BUILT_PRODUCTS_DIR; };\n\t\tCE0E74F571E1F48FF00A8324 /* Pods-Shared-react_native_windows-macOS.release.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = \"Pods-Shared-react_native_windows-macOS.release.xcconfig\"; path = \"Target Support Files/Pods-Shared-react_native_windows-macOS/Pods-Shared-react_native_windows-macOS.release.xcconfig\"; sourceTree = \"<group>\"; };\n\t\tED297162215061F000B7C4FE /* JavaScriptCore.framework */ = {isa = PBXFileReference; lastKnownFileType = wrapper.framework; name = JavaScriptCore.framework; path = System/Library/Frameworks/JavaScriptCore.framework; sourceTree = SDKROOT; };\n\t\tED2971642150620600B7C4FE /* JavaScriptCore.framework */ = {isa = PBXFileReference; lastKnownFileType = wrapper.framework; name = JavaScriptCore.framework; path = Platforms/AppleTVOS.platform/Developer/SDKs/AppleTVOS12.0.sdk/System/Library/Frameworks/JavaScriptCore.framework; sourceTree = DEVELOPER_DIR; };\n\t\tFB6EED1BDEABADF047CC5223 /* libPods-Shared-react_native_windows-iOS.a */ = {isa = PBXFileReference; explicitFileType = archive.ar; includeInIndex = 0; path = \"libPods-Shared-react_native_windows-iOS.a\"; sourceTree = BUILT_PRODUCTS_DIR; };\n/* End PBXFileReference section */\n\n/* Begin PBXFrameworksBuildPhase section */\n\t\t13B07F8C1A680F5B00A75B9A /* Frameworks */ = {\n\t\t\tisa = PBXFrameworksBuildPhase;\n\t\t\tbuildActionMask = 2147483647;\n\t\t\tfiles = (\n\t\t\t\tB5C72D9C27A1E1D711C050EF /* libPods-Shared-react_native_windows-iOS.a in Frameworks */,\n\t\t\t);\n\t\t\trunOnlyForDeploymentPostprocessing = 0;\n\t\t};\n\t\t514201462437B4B30078DB4F /* Frameworks */ = {\n\t\t\tisa = PBXFrameworksBuildPhase;\n\t\t\tbuildActionMask = 2147483647;\n\t\t\tfiles = (\n\t\t\t\t0496A360A6F874C295C73D4B /* libPods-Shared-react_native_windows-macOS.a in Frameworks */,\n\t\t\t);\n\t\t\trunOnlyForDeploymentPostprocessing = 0;\n\t\t};\n/* End PBXFrameworksBuildPhase section */\n\n/* Begin PBXGroup section */\n\t\t13B07FAE1A68108700A75B9A /* react_native_windows-iOS */ = {\n\t\t\tisa = PBXGroup;\n\t\t\tchildren = (\n\t\t\t\t008F07F21AC5B25A0029DE68 /* main.jsbundle */,\n\t\t\t\t13B07FAF1A68108700A75B9A /* AppDelegate.h */,\n\t\t\t\t13B07FB01A68108700A75B9A /* AppDelegate.m */,\n\t\t\t\t13B07FB51A68108700A75B9A /* Images.xcassets */,\n\t\t\t\t13B07FB61A68108700A75B9A /* Info.plist */,\n\t\t\t\t13B07FB11A68108700A75B9A /* LaunchScreen.xib */,\n\t\t\t\t13B07FB71A68108700A75B9A /* main.m */,\n\t\t\t);\n\t\t\tpath = \"react_native_windows-iOS\";\n\t\t\tsourceTree = \"<group>\";\n\t\t};\n\t\t1986A43FA6A91CFACDF0A798 /* Pods */ = {\n\t\t\tisa = PBXGroup;\n\t\t\tchildren = (\n\t\t\t\t9D32DFD059D5DB6DDEF38881 /* Pods-Shared-react_native_windows-iOS.debug.xcconfig */,\n\t\t\t\tA82DFB63B157C65E5D698CA2 /* Pods-Shared-react_native_windows-iOS.release.xcconfig */,\n\t\t\t\t02422F9FB6FF5F34B4E63E6F /* Pods-Shared-react_native_windows-macOS.debug.xcconfig */,\n\t\t\t\tCE0E74F571E1F48FF00A8324 /* Pods-Shared-react_native_windows-macOS.release.xcconfig */,\n\t\t\t);\n\t\t\tpath = Pods;\n\t\t\tsourceTree = \"<group>\";\n\t\t};\n\t\t2D16E6871FA4F8E400B85C8A /* Frameworks */ = {\n\t\t\tisa = PBXGroup;\n\t\t\tchildren = (\n\t\t\t\tED297162215061F000B7C4FE /* JavaScriptCore.framework */,\n\t\t\t\tED2971642150620600B7C4FE /* JavaScriptCore.framework */,\n\t\t\t\tFB6EED1BDEABADF047CC5223 /* libPods-Shared-react_native_windows-iOS.a */,\n\t\t\t\tC8DBC48FD7C3AEF576C57B21 /* libPods-Shared-react_native_windows-macOS.a */,\n\t\t\t);\n\t\t\tname = Frameworks;\n\t\t\tsourceTree = \"<group>\";\n\t\t};\n\t\t5142014A2437B4B30078DB4F /* react_native_windows-macOS */ = {\n\t\t\tisa = PBXGroup;\n\t\t\tchildren = (\n\t\t\t\t38423A3E24576CBC00BC2EAC /* main.jsbundle */,\n\t\t\t\t5142014B2437B4B30078DB4F /* AppDelegate.h */,\n\t\t\t\t5142014C2437B4B30078DB4F /* AppDelegate.m */,\n\t\t\t\t5142014E2437B4B30078DB4F /* ViewController.h */,\n\t\t\t\t5142014F2437B4B30078DB4F /* ViewController.m */,\n\t\t\t\t514201512437B4B40078DB4F /* Assets.xcassets */,\n\t\t\t\t514201532437B4B40078DB4F /* Main.storyboard */,\n\t\t\t\t514201562437B4B40078DB4F /* Info.plist */,\n\t\t\t\t514201572437B4B40078DB4F /* main.m */,\n\t\t\t\t514201592437B4B40078DB4F /* react_native_windows.entitlements */,\n\t\t\t);\n\t\t\tpath = \"react_native_windows-macOS\";\n\t\t\tsourceTree = \"<group>\";\n\t\t};\n\t\t832341AE1AAA6A7D00B99B32 /* Libraries */ = {\n\t\t\tisa = PBXGroup;\n\t\t\tchildren = (\n\t\t\t);\n\t\t\tname = Libraries;\n\t\t\tsourceTree = \"<group>\";\n\t\t};\n\t\t83CBB9F61A601CBA00E9B192 = {\n\t\t\tisa = PBXGroup;\n\t\t\tchildren = (\n\t\t\t\t5142014A2437B4B30078DB4F /* react_native_windows-macOS */,\n\t\t\t\t13B07FAE1A68108700A75B9A /* react_native_windows-iOS */,\n\t\t\t\t832341AE1AAA6A7D00B99B32 /* Libraries */,\n\t\t\t\t83CBBA001A601CBA00E9B192 /* Products */,\n\t\t\t\t2D16E6871FA4F8E400B85C8A /* Frameworks */,\n\t\t\t\t1986A43FA6A91CFACDF0A798 /* Pods */,\n\t\t\t);\n\t\t\tindentWidth = 2;\n\t\t\tsourceTree = \"<group>\";\n\t\t\ttabWidth = 2;\n\t\t\tusesTabs = 0;\n\t\t};\n\t\t83CBBA001A601CBA00E9B192 /* Products */ = {\n\t\t\tisa = PBXGroup;\n\t\t\tchildren = (\n\t\t\t\t13B07F961A680F5B00A75B9A /* react_native_windows.app */,\n\t\t\t\t514201492437B4B30078DB4F /* react_native_windows.app */,\n\t\t\t);\n\t\t\tname = Products;\n\t\t\tsourceTree = \"<group>\";\n\t\t};\n/* End PBXGroup section */\n\n/* Begin PBXNativeTarget section */\n\t\t13B07F861A680F5B00A75B9A /* react_native_windows-iOS */ = {\n\t\t\tisa = PBXNativeTarget;\n\t\t\tbuildConfigurationList = 13B07F931A680F5B00A75B9A /* Build configuration list for PBXNativeTarget \"react_native_windows-iOS\" */;\n\t\t\tbuildPhases = (\n\t\t\t\t7BC40D98CAD1562CFD247217 /* [CP] Check Pods Manifest.lock */,\n\t\t\t\tFD10A7F022414F080027D42C /* Start Packager */,\n\t\t\t\t13B07F871A680F5B00A75B9A /* Sources */,\n\t\t\t\t13B07F8C1A680F5B00A75B9A /* Frameworks */,\n\t\t\t\t13B07F8E1A680F5B00A75B9A /* Resources */,\n\t\t\t\t00DD1BFF1BD5951E006B06BC /* Bundle React Native code and images */,\n\t\t\t);\n\t\t\tbuildRules = (\n\t\t\t);\n\t\t\tdependencies = (\n\t\t\t);\n\t\t\tname = \"react_native_windows-iOS\";\n\t\t\tproductName = react_native_windows;\n\t\t\tproductReference = 13B07F961A680F5B00A75B9A /* react_native_windows.app */;\n\t\t\tproductType = \"com.apple.product-type.application\";\n\t\t};\n\t\t514201482437B4B30078DB4F /* react_native_windows-macOS */ = {\n\t\t\tisa = PBXNativeTarget;\n\t\t\tbuildConfigurationList = 5142015A2437B4B40078DB4F /* Build configuration list for PBXNativeTarget \"react_native_windows-macOS\" */;\n\t\t\tbuildPhases = (\n\t\t\t\t1A938104A937498D81B3BD3B /* [CP] Check Pods Manifest.lock */,\n\t\t\t\t381D8A6F24576A6C00465D17 /* Start Packager */,\n\t\t\t\t514201452437B4B30078DB4F /* Sources */,\n\t\t\t\t514201462437B4B30078DB4F /* Frameworks */,\n\t\t\t\t514201472437B4B30078DB4F /* Resources */,\n\t\t\t\t381D8A6E24576A4E00465D17 /* Bundle React Native code and images */,\n\t\t\t);\n\t\t\tbuildRules = (\n\t\t\t);\n\t\t\tdependencies = (\n\t\t\t);\n\t\t\tname = \"react_native_windows-macOS\";\n\t\t\tproductName = react_native_windows;\n\t\t\tproductReference = 514201492437B4B30078DB4F /* react_native_windows.app */;\n\t\t\tproductType = \"com.apple.product-type.application\";\n\t\t};\n/* End PBXNativeTarget section */\n\n/* Begin PBXProject section */\n\t\t83CBB9F71A601CBA00E9B192 /* Project object */ = {\n\t\t\tisa = PBXProject;\n\t\t\tattributes = {\n\t\t\t\tLastUpgradeCheck = 1130;\n\t\t\t\tTargetAttributes = {\n\t\t\t\t\t13B07F861A680F5B00A75B9A = {\n\t\t\t\t\t\tLastSwiftMigration = 1120;\n\t\t\t\t\t};\n\t\t\t\t\t514201482437B4B30078DB4F = {\n\t\t\t\t\t\tCreatedOnToolsVersion = 11.4;\n\t\t\t\t\t\tProvisioningStyle = Automatic;\n\t\t\t\t\t};\n\t\t\t\t};\n\t\t\t};\n\t\t\tbuildConfigurationList = 83CBB9FA1A601CBA00E9B192 /* Build configuration list for PBXProject \"react_native_windows\" */;\n\t\t\tcompatibilityVersion = \"Xcode 3.2\";\n\t\t\tdevelopmentRegion = en;\n\t\t\thasScannedForEncodings = 0;\n\t\t\tknownRegions = (\n\t\t\t\ten,\n\t\t\t\tBase,\n\t\t\t);\n\t\t\tmainGroup = 83CBB9F61A601CBA00E9B192;\n\t\t\tproductRefGroup = 83CBBA001A601CBA00E9B192 /* Products */;\n\t\t\tprojectDirPath = \"\";\n\t\t\tprojectRoot = \"\";\n\t\t\ttargets = (\n\t\t\t\t13B07F861A680F5B00A75B9A /* react_native_windows-iOS */,\n\t\t\t\t514201482437B4B30078DB4F /* react_native_windows-macOS */,\n\t\t\t);\n\t\t};\n/* End PBXProject section */\n\n/* Begin PBXResourcesBuildPhase section */\n\t\t13B07F8E1A680F5B00A75B9A /* Resources */ = {\n\t\t\tisa = PBXResourcesBuildPhase;\n\t\t\tbuildActionMask = 2147483647;\n\t\t\tfiles = (\n\t\t\t\t13B07FBF1A68108700A75B9A /* Images.xcassets in Resources */,\n\t\t\t\t13B07FBD1A68108700A75B9A /* LaunchScreen.xib in Resources */,\n\t\t\t);\n\t\t\trunOnlyForDeploymentPostprocessing = 0;\n\t\t};\n\t\t514201472437B4B30078DB4F /* Resources */ = {\n\t\t\tisa = PBXResourcesBuildPhase;\n\t\t\tbuildActionMask = 2147483647;\n\t\t\tfiles = (\n\t\t\t\t514201522437B4B40078DB4F /* Assets.xcassets in Resources */,\n\t\t\t\t514201552437B4B40078DB4F /* Main.storyboard in Resources */,\n\t\t\t);\n\t\t\trunOnlyForDeploymentPostprocessing = 0;\n\t\t};\n/* End PBXResourcesBuildPhase section */\n\n/* Begin PBXShellScriptBuildPhase section */\n\t\t00DD1BFF1BD5951E006B06BC /* Bundle React Native code and images */ = {\n\t\t\tisa = PBXShellScriptBuildPhase;\n\t\t\tbuildActionMask = 2147483647;\n\t\t\tfiles = (\n\t\t\t);\n\t\t\tinputPaths = (\n\t\t\t);\n\t\t\tname = \"Bundle React Native code and images\";\n\t\t\toutputPaths = (\n\t\t\t);\n\t\t\trunOnlyForDeploymentPostprocessing = 0;\n\t\t\tshellPath = /bin/sh;\n\t\t\tshellScript = \"export NODE_BINARY=node\\n../node_modules/react-native-macos/scripts/react-native-xcode.sh\\n\";\n\t\t};\n\t\t1A938104A937498D81B3BD3B /* [CP] Check Pods Manifest.lock */ = {\n\t\t\tisa = PBXShellScriptBuildPhase;\n\t\t\tbuildActionMask = 2147483647;\n\t\t\tfiles = (\n\t\t\t);\n\t\t\tinputFileListPaths = (\n\t\t\t);\n\t\t\tinputPaths = (\n\t\t\t\t\"${PODS_PODFILE_DIR_PATH}/Podfile.lock\",\n\t\t\t\t\"${PODS_ROOT}/Manifest.lock\",\n\t\t\t);\n\t\t\tname = \"[CP] Check Pods Manifest.lock\";\n\t\t\toutputFileListPaths = (\n\t\t\t);\n\t\t\toutputPaths = (\n\t\t\t\t\"$(DERIVED_FILE_DIR)/Pods-Shared-react_native_windows-macOS-checkManifestLockResult.txt\",\n\t\t\t);\n\t\t\trunOnlyForDeploymentPostprocessing = 0;\n\t\t\tshellPath = /bin/sh;\n\t\t\tshellScript = \"diff \\\"${PODS_PODFILE_DIR_PATH}/Podfile.lock\\\" \\\"${PODS_ROOT}/Manifest.lock\\\" > /dev/null\\nif [ $? != 0 ] ; then\\n    # print error to STDERR\\n    echo \\\"error: The sandbox is not in sync with the Podfile.lock. Run 'pod install' or update your CocoaPods installation.\\\" >&2\\n    exit 1\\nfi\\n# This output is used by Xcode 'outputs' to avoid re-running this script phase.\\necho \\\"SUCCESS\\\" > \\\"${SCRIPT_OUTPUT_FILE_0}\\\"\\n\";\n\t\t\tshowEnvVarsInLog = 0;\n\t\t};\n\t\t381D8A6E24576A4E00465D17 /* Bundle React Native code and images */ = {\n\t\t\tisa = PBXShellScriptBuildPhase;\n\t\t\tbuildActionMask = 2147483647;\n\t\t\tfiles = (\n\t\t\t);\n\t\t\tinputFileListPaths = (\n\t\t\t);\n\t\t\tinputPaths = (\n\t\t\t);\n\t\t\tname = \"Bundle React Native code and images\";\n\t\t\toutputFileListPaths = (\n\t\t\t);\n\t\t\toutputPaths = (\n\t\t\t);\n\t\t\trunOnlyForDeploymentPostprocessing = 0;\n\t\t\tshellPath = /bin/sh;\n\t\t\tshellScript = \"export NODE_BINARY=node\\n../node_modules/react-native-macos/scripts/react-native-xcode.sh\\n\";\n\t\t};\n\t\t381D8A6F24576A6C00465D17 /* Start Packager */ = {\n\t\t\tisa = PBXShellScriptBuildPhase;\n\t\t\tbuildActionMask = 2147483647;\n\t\t\tfiles = (\n\t\t\t);\n\t\t\tinputFileListPaths = (\n\t\t\t);\n\t\t\tinputPaths = (\n\t\t\t);\n\t\t\tname = \"Start Packager\";\n\t\t\toutputFileListPaths = (\n\t\t\t);\n\t\t\toutputPaths = (\n\t\t\t);\n\t\t\trunOnlyForDeploymentPostprocessing = 0;\n\t\t\tshellPath = /bin/sh;\n\t\t\tshellScript = \"export RCT_METRO_PORT=\\\"${RCT_METRO_PORT:=8081}\\\"\\necho \\\"export RCT_METRO_PORT=${RCT_METRO_PORT}\\\" > \\\"${SRCROOT}/../node_modules/react-native-macos/scripts/.packager.env\\\"\\nif [ -z \\\"${RCT_NO_LAUNCH_PACKAGER+xxx}\\\" ] ; then\\n  if nc -w 5 -z localhost ${RCT_METRO_PORT} ; then\\n    if ! curl -s \\\"http://localhost:${RCT_METRO_PORT}/status\\\" | grep -q \\\"packager-status:running\\\" ; then\\n      echo \\\"Port ${RCT_METRO_PORT} already in use, packager is either not running or not running correctly\\\"\\n      exit 2\\n    fi\\n  else\\n    open \\\"$SRCROOT/../node_modules/react-native-macos/scripts/launchPackager.command\\\" || echo \\\"Can't start packager automatically\\\"\\n  fi\\nfi\\n\";\n\t\t};\n\t\t7BC40D98CAD1562CFD247217 /* [CP] Check Pods Manifest.lock */ = {\n\t\t\tisa = PBXShellScriptBuildPhase;\n\t\t\tbuildActionMask = 2147483647;\n\t\t\tfiles = (\n\t\t\t);\n\t\t\tinputFileListPaths = (\n\t\t\t);\n\t\t\tinputPaths = (\n\t\t\t\t\"${PODS_PODFILE_DIR_PATH}/Podfile.lock\",\n\t\t\t\t\"${PODS_ROOT}/Manifest.lock\",\n\t\t\t);\n\t\t\tname = \"[CP] Check Pods Manifest.lock\";\n\t\t\toutputFileListPaths = (\n\t\t\t);\n\t\t\toutputPaths = (\n\t\t\t\t\"$(DERIVED_FILE_DIR)/Pods-Shared-react_native_windows-iOS-checkManifestLockResult.txt\",\n\t\t\t);\n\t\t\trunOnlyForDeploymentPostprocessing = 0;\n\t\t\tshellPath = /bin/sh;\n\t\t\tshellScript = \"diff \\\"${PODS_PODFILE_DIR_PATH}/Podfile.lock\\\" \\\"${PODS_ROOT}/Manifest.lock\\\" > /dev/null\\nif [ $? != 0 ] ; then\\n    # print error to STDERR\\n    echo \\\"error: The sandbox is not in sync with the Podfile.lock. Run 'pod install' or update your CocoaPods installation.\\\" >&2\\n    exit 1\\nfi\\n# This output is used by Xcode 'outputs' to avoid re-running this script phase.\\necho \\\"SUCCESS\\\" > \\\"${SCRIPT_OUTPUT_FILE_0}\\\"\\n\";\n\t\t\tshowEnvVarsInLog = 0;\n\t\t};\n\t\tFD10A7F022414F080027D42C /* Start Packager */ = {\n\t\t\tisa = PBXShellScriptBuildPhase;\n\t\t\tbuildActionMask = 2147483647;\n\t\t\tfiles = (\n\t\t\t);\n\t\t\tinputFileListPaths = (\n\t\t\t);\n\t\t\tinputPaths = (\n\t\t\t);\n\t\t\tname = \"Start Packager\";\n\t\t\toutputFileListPaths = (\n\t\t\t);\n\t\t\toutputPaths = (\n\t\t\t);\n\t\t\trunOnlyForDeploymentPostprocessing = 0;\n\t\t\tshellPath = /bin/sh;\n\t\t\tshellScript = \"export RCT_METRO_PORT=\\\"${RCT_METRO_PORT:=8081}\\\"\\necho \\\"export RCT_METRO_PORT=${RCT_METRO_PORT}\\\" > \\\"${SRCROOT}/../node_modules/react-native-macos/scripts/.packager.env\\\"\\nif [ -z \\\"${RCT_NO_LAUNCH_PACKAGER+xxx}\\\" ] ; then\\n  if nc -w 5 -z localhost ${RCT_METRO_PORT} ; then\\n    if ! curl -s \\\"http://localhost:${RCT_METRO_PORT}/status\\\" | grep -q \\\"packager-status:running\\\" ; then\\n      echo \\\"Port ${RCT_METRO_PORT} already in use, packager is either not running or not running correctly\\\"\\n      exit 2\\n    fi\\n  else\\n    open \\\"$SRCROOT/../node_modules/react-native-macos/scripts/launchPackager.command\\\" || echo \\\"Can't start packager automatically\\\"\\n  fi\\nfi\\n\";\n\t\t\tshowEnvVarsInLog = 0;\n\t\t};\n/* End PBXShellScriptBuildPhase section */\n\n/* Begin PBXSourcesBuildPhase section */\n\t\t13B07F871A680F5B00A75B9A /* Sources */ = {\n\t\t\tisa = PBXSourcesBuildPhase;\n\t\t\tbuildActionMask = 2147483647;\n\t\t\tfiles = (\n\t\t\t\t13B07FBC1A68108700A75B9A /* AppDelegate.m in Sources */,\n\t\t\t\t13B07FC11A68108700A75B9A /* main.m in Sources */,\n\t\t\t);\n\t\t\trunOnlyForDeploymentPostprocessing = 0;\n\t\t};\n\t\t514201452437B4B30078DB4F /* Sources */ = {\n\t\t\tisa = PBXSourcesBuildPhase;\n\t\t\tbuildActionMask = 2147483647;\n\t\t\tfiles = (\n\t\t\t\t514201502437B4B30078DB4F /* ViewController.m in Sources */,\n\t\t\t\t514201582437B4B40078DB4F /* main.m in Sources */,\n\t\t\t\t5142014D2437B4B30078DB4F /* AppDelegate.m in Sources */,\n\t\t\t);\n\t\t\trunOnlyForDeploymentPostprocessing = 0;\n\t\t};\n/* End PBXSourcesBuildPhase section */\n\n/* Begin PBXVariantGroup section */\n\t\t13B07FB11A68108700A75B9A /* LaunchScreen.xib */ = {\n\t\t\tisa = PBXVariantGroup;\n\t\t\tchildren = (\n\t\t\t\t13B07FB21A68108700A75B9A /* Base */,\n\t\t\t);\n\t\t\tname = LaunchScreen.xib;\n\t\t\tsourceTree = \"<group>\";\n\t\t};\n\t\t514201532437B4B40078DB4F /* Main.storyboard */ = {\n\t\t\tisa = PBXVariantGroup;\n\t\t\tchildren = (\n\t\t\t\t514201542437B4B40078DB4F /* Base */,\n\t\t\t);\n\t\t\tname = Main.storyboard;\n\t\t\tsourceTree = \"<group>\";\n\t\t};\n/* End PBXVariantGroup section */\n\n/* Begin XCBuildConfiguration section */\n\t\t13B07F941A680F5B00A75B9A /* Debug */ = {\n\t\t\tisa = XCBuildConfiguration;\n\t\t\tbaseConfigurationReference = 9D32DFD059D5DB6DDEF38881 /* Pods-Shared-react_native_windows-iOS.debug.xcconfig */;\n\t\t\tbuildSettings = {\n\t\t\t\tASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;\n\t\t\t\tCLANG_ENABLE_MODULES = YES;\n\t\t\t\tCURRENT_PROJECT_VERSION = 1;\n\t\t\t\tENABLE_BITCODE = NO;\n\t\t\t\tINFOPLIST_FILE = \"react_native_windows-iOS/Info.plist\";\n\t\t\t\tLD_RUNPATH_SEARCH_PATHS = \"$(inherited) @executable_path/Frameworks\";\n\t\t\t\tOTHER_LDFLAGS = (\n\t\t\t\t\t\"$(inherited)\",\n\t\t\t\t\t\"-ObjC\",\n\t\t\t\t\t\"-lc++\",\n\t\t\t\t);\n\t\t\t\tPRODUCT_BUNDLE_IDENTIFIER = \"org.reactjs.native.$(PRODUCT_NAME:rfc1034identifier)\";\n\t\t\t\tPRODUCT_NAME = react_native_windows;\n\t\t\t\tSWIFT_OPTIMIZATION_LEVEL = \"-Onone\";\n\t\t\t\tSWIFT_VERSION = 5.0;\n\t\t\t\tVERSIONING_SYSTEM = \"apple-generic\";\n\t\t\t};\n\t\t\tname = Debug;\n\t\t};\n\t\t13B07F951A680F5B00A75B9A /* Release */ = {\n\t\t\tisa = XCBuildConfiguration;\n\t\t\tbaseConfigurationReference = A82DFB63B157C65E5D698CA2 /* Pods-Shared-react_native_windows-iOS.release.xcconfig */;\n\t\t\tbuildSettings = {\n\t\t\t\tASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;\n\t\t\t\tCLANG_ENABLE_MODULES = YES;\n\t\t\t\tCURRENT_PROJECT_VERSION = 1;\n\t\t\t\tINFOPLIST_FILE = \"react_native_windows-iOS/Info.plist\";\n\t\t\t\tLD_RUNPATH_SEARCH_PATHS = \"$(inherited) @executable_path/Frameworks\";\n\t\t\t\tOTHER_LDFLAGS = (\n\t\t\t\t\t\"$(inherited)\",\n\t\t\t\t\t\"-ObjC\",\n\t\t\t\t\t\"-lc++\",\n\t\t\t\t);\n\t\t\t\tPRODUCT_BUNDLE_IDENTIFIER = \"org.reactjs.native.$(PRODUCT_NAME:rfc1034identifier)\";\n\t\t\t\tPRODUCT_NAME = react_native_windows;\n\t\t\t\tSWIFT_VERSION = 5.0;\n\t\t\t\tVERSIONING_SYSTEM = \"apple-generic\";\n\t\t\t};\n\t\t\tname = Release;\n\t\t};\n\t\t5142015B2437B4B40078DB4F /* Debug */ = {\n\t\t\tisa = XCBuildConfiguration;\n\t\t\tbaseConfigurationReference = 02422F9FB6FF5F34B4E63E6F /* Pods-Shared-react_native_windows-macOS.debug.xcconfig */;\n\t\t\tbuildSettings = {\n\t\t\t\tASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;\n\t\t\t\tCURRENT_PROJECT_VERSION = 1;\n\t\t\t\tDEAD_CODE_STRIPPING = NO;\n\t\t\t\tINFOPLIST_FILE = \"react_native_windows-macos/Info.plist\";\n\t\t\t\tLD_RUNPATH_SEARCH_PATHS = \"$(inherited) @executable_path/Frameworks\";\n\t\t\t\tMACOSX_DEPLOYMENT_TARGET = 10.13;\n\t\t\t\tOTHER_LDFLAGS = (\n\t\t\t\t\t\"$(inherited)\",\n\t\t\t\t\t\"-ObjC\",\n\t\t\t\t\t\"-lc++\",\n\t\t\t\t);\n\t\t\t\tPRODUCT_BUNDLE_IDENTIFIER = \"org.reactjs.native.$(PRODUCT_NAME:rfc1034identifier)\";\n\t\t\t\tPRODUCT_NAME = react_native_windows;\n\t\t\t\tSDKROOT = macosx;\n\t\t\t};\n\t\t\tname = Debug;\n\t\t};\n\t\t5142015C2437B4B40078DB4F /* Release */ = {\n\t\t\tisa = XCBuildConfiguration;\n\t\t\tbaseConfigurationReference = CE0E74F571E1F48FF00A8324 /* Pods-Shared-react_native_windows-macOS.release.xcconfig */;\n\t\t\tbuildSettings = {\n\t\t\t\tASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;\n\t\t\t\tCURRENT_PROJECT_VERSION = 1;\n\t\t\t\tINFOPLIST_FILE = \"react_native_windows-macos/Info.plist\";\n\t\t\t\tLD_RUNPATH_SEARCH_PATHS = \"$(inherited) @executable_path/Frameworks\";\n\t\t\t\tMACOSX_DEPLOYMENT_TARGET = 10.13;\n\t\t\t\tOTHER_LDFLAGS = (\n\t\t\t\t\t\"$(inherited)\",\n\t\t\t\t\t\"-ObjC\",\n\t\t\t\t\t\"-lc++\",\n\t\t\t\t);\n\t\t\t\tPRODUCT_BUNDLE_IDENTIFIER = \"org.reactjs.native.$(PRODUCT_NAME:rfc1034identifier)\";\n\t\t\t\tPRODUCT_NAME = react_native_windows;\n\t\t\t\tSDKROOT = macosx;\n\t\t\t};\n\t\t\tname = Release;\n\t\t};\n\t\t83CBBA201A601CBA00E9B192 /* Debug */ = {\n\t\t\tisa = XCBuildConfiguration;\n\t\t\tbuildSettings = {\n\t\t\t\tALWAYS_SEARCH_USER_PATHS = NO;\n\t\t\t\tCLANG_ANALYZER_LOCALIZABILITY_NONLOCALIZED = YES;\n\t\t\t\tCLANG_CXX_LANGUAGE_STANDARD = \"gnu++0x\";\n\t\t\t\tCLANG_CXX_LIBRARY = \"libc++\";\n\t\t\t\tCLANG_ENABLE_MODULES = YES;\n\t\t\t\tCLANG_ENABLE_OBJC_ARC = YES;\n\t\t\t\tCLANG_WARN_BLOCK_CAPTURE_AUTORELEASING = YES;\n\t\t\t\tCLANG_WARN_BOOL_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_COMMA = YES;\n\t\t\t\tCLANG_WARN_CONSTANT_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_DEPRECATED_OBJC_IMPLEMENTATIONS = YES;\n\t\t\t\tCLANG_WARN_DIRECT_OBJC_ISA_USAGE = YES_ERROR;\n\t\t\t\tCLANG_WARN_EMPTY_BODY = YES;\n\t\t\t\tCLANG_WARN_ENUM_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_INFINITE_RECURSION = YES;\n\t\t\t\tCLANG_WARN_INT_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_NON_LITERAL_NULL_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_OBJC_IMPLICIT_RETAIN_SELF = YES;\n\t\t\t\tCLANG_WARN_OBJC_LITERAL_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_OBJC_ROOT_CLASS = YES_ERROR;\n\t\t\t\tCLANG_WARN_RANGE_LOOP_ANALYSIS = YES;\n\t\t\t\tCLANG_WARN_STRICT_PROTOTYPES = YES;\n\t\t\t\tCLANG_WARN_SUSPICIOUS_MOVE = YES;\n\t\t\t\tCLANG_WARN_UNREACHABLE_CODE = YES;\n\t\t\t\tCLANG_WARN__DUPLICATE_METHOD_MATCH = YES;\n\t\t\t\t\"CODE_SIGN_IDENTITY[sdk=iphoneos*]\" = \"iPhone Developer\";\n\t\t\t\tCOPY_PHASE_STRIP = NO;\n\t\t\t\tENABLE_STRICT_OBJC_MSGSEND = YES;\n\t\t\t\tENABLE_TESTABILITY = YES;\n\t\t\t\tGCC_C_LANGUAGE_STANDARD = gnu99;\n\t\t\t\tGCC_DYNAMIC_NO_PIC = NO;\n\t\t\t\tGCC_NO_COMMON_BLOCKS = YES;\n\t\t\t\tGCC_OPTIMIZATION_LEVEL = 0;\n\t\t\t\tGCC_PREPROCESSOR_DEFINITIONS = (\n\t\t\t\t\t\"DEBUG=1\",\n\t\t\t\t\t\"$(inherited)\",\n\t\t\t\t);\n\t\t\t\tGCC_SYMBOLS_PRIVATE_EXTERN = NO;\n\t\t\t\tGCC_WARN_64_TO_32_BIT_CONVERSION = YES;\n\t\t\t\tGCC_WARN_ABOUT_RETURN_TYPE = YES_ERROR;\n\t\t\t\tGCC_WARN_UNDECLARED_SELECTOR = YES;\n\t\t\t\tGCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE;\n\t\t\t\tGCC_WARN_UNUSED_FUNCTION = YES;\n\t\t\t\tGCC_WARN_UNUSED_VARIABLE = YES;\n\t\t\t\tIPHONEOS_DEPLOYMENT_TARGET = 9.0;\n\t\t\t\tLD_RUNPATH_SEARCH_PATHS = \"/usr/lib/swift $(inherited)\";\n\t\t\t\tLIBRARY_SEARCH_PATHS = (\n\t\t\t\t\t\"\\\"$(TOOLCHAIN_DIR)/usr/lib/swift/$(PLATFORM_NAME)\\\"\",\n\t\t\t\t\t\"\\\"$(TOOLCHAIN_DIR)/usr/lib/swift-5.0/$(PLATFORM_NAME)\\\"\",\n\t\t\t\t\t\"\\\"$(inherited)\\\"\",\n\t\t\t\t);\n\t\t\t\tMTL_ENABLE_DEBUG_INFO = YES;\n\t\t\t\tONLY_ACTIVE_ARCH = YES;\n\t\t\t\tSDKROOT = iphoneos;\n\t\t\t};\n\t\t\tname = Debug;\n\t\t};\n\t\t83CBBA211A601CBA00E9B192 /* Release */ = {\n\t\t\tisa = XCBuildConfiguration;\n\t\t\tbuildSettings = {\n\t\t\t\tALWAYS_SEARCH_USER_PATHS = NO;\n\t\t\t\tCLANG_ANALYZER_LOCALIZABILITY_NONLOCALIZED = YES;\n\t\t\t\tCLANG_CXX_LANGUAGE_STANDARD = \"gnu++0x\";\n\t\t\t\tCLANG_CXX_LIBRARY = \"libc++\";\n\t\t\t\tCLANG_ENABLE_MODULES = YES;\n\t\t\t\tCLANG_ENABLE_OBJC_ARC = YES;\n\t\t\t\tCLANG_WARN_BLOCK_CAPTURE_AUTORELEASING = YES;\n\t\t\t\tCLANG_WARN_BOOL_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_COMMA = YES;\n\t\t\t\tCLANG_WARN_CONSTANT_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_DEPRECATED_OBJC_IMPLEMENTATIONS = YES;\n\t\t\t\tCLANG_WARN_DIRECT_OBJC_ISA_USAGE = YES_ERROR;\n\t\t\t\tCLANG_WARN_EMPTY_BODY = YES;\n\t\t\t\tCLANG_WARN_ENUM_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_INFINITE_RECURSION = YES;\n\t\t\t\tCLANG_WARN_INT_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_NON_LITERAL_NULL_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_OBJC_IMPLICIT_RETAIN_SELF = YES;\n\t\t\t\tCLANG_WARN_OBJC_LITERAL_CONVERSION = YES;\n\t\t\t\tCLANG_WARN_OBJC_ROOT_CLASS = YES_ERROR;\n\t\t\t\tCLANG_WARN_RANGE_LOOP_ANALYSIS = YES;\n\t\t\t\tCLANG_WARN_STRICT_PROTOTYPES = YES;\n\t\t\t\tCLANG_WARN_SUSPICIOUS_MOVE = YES;\n\t\t\t\tCLANG_WARN_UNREACHABLE_CODE = YES;\n\t\t\t\tCLANG_WARN__DUPLICATE_METHOD_MATCH = YES;\n\t\t\t\t\"CODE_SIGN_IDENTITY[sdk=iphoneos*]\" = \"iPhone Developer\";\n\t\t\t\tCOPY_PHASE_STRIP = YES;\n\t\t\t\tENABLE_NS_ASSERTIONS = NO;\n\t\t\t\tENABLE_STRICT_OBJC_MSGSEND = YES;\n\t\t\t\tGCC_C_LANGUAGE_STANDARD = gnu99;\n\t\t\t\tGCC_NO_COMMON_BLOCKS = YES;\n\t\t\t\tGCC_WARN_64_TO_32_BIT_CONVERSION = YES;\n\t\t\t\tGCC_WARN_ABOUT_RETURN_TYPE = YES_ERROR;\n\t\t\t\tGCC_WARN_UNDECLARED_SELECTOR = YES;\n\t\t\t\tGCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE;\n\t\t\t\tGCC_WARN_UNUSED_FUNCTION = YES;\n\t\t\t\tGCC_WARN_UNUSED_VARIABLE = YES;\n\t\t\t\tIPHONEOS_DEPLOYMENT_TARGET = 9.0;\n\t\t\t\tLD_RUNPATH_SEARCH_PATHS = \"/usr/lib/swift $(inherited)\";\n\t\t\t\tLIBRARY_SEARCH_PATHS = (\n\t\t\t\t\t\"\\\"$(TOOLCHAIN_DIR)/usr/lib/swift/$(PLATFORM_NAME)\\\"\",\n\t\t\t\t\t\"\\\"$(TOOLCHAIN_DIR)/usr/lib/swift-5.0/$(PLATFORM_NAME)\\\"\",\n\t\t\t\t\t\"\\\"$(inherited)\\\"\",\n\t\t\t\t);\n\t\t\t\tMTL_ENABLE_DEBUG_INFO = NO;\n\t\t\t\tSDKROOT = iphoneos;\n\t\t\t\tVALIDATE_PRODUCT = YES;\n\t\t\t};\n\t\t\tname = Release;\n\t\t};\n/* End XCBuildConfiguration section */\n\n/* Begin XCConfigurationList section */\n\t\t13B07F931A680F5B00A75B9A /* Build configuration list for PBXNativeTarget \"react_native_windows-iOS\" */ = {\n\t\t\tisa = XCConfigurationList;\n\t\t\tbuildConfigurations = (\n\t\t\t\t13B07F941A680F5B00A75B9A /* Debug */,\n\t\t\t\t13B07F951A680F5B00A75B9A /* Release */,\n\t\t\t);\n\t\t\tdefaultConfigurationIsVisible = 0;\n\t\t\tdefaultConfigurationName = Release;\n\t\t};\n\t\t5142015A2437B4B40078DB4F /* Build configuration list for PBXNativeTarget \"react_native_windows-macOS\" */ = {\n\t\t\tisa = XCConfigurationList;\n\t\t\tbuildConfigurations = (\n\t\t\t\t5142015B2437B4B40078DB4F /* Debug */,\n\t\t\t\t5142015C2437B4B40078DB4F /* Release */,\n\t\t\t);\n\t\t\tdefaultConfigurationIsVisible = 0;\n\t\t\tdefaultConfigurationName = Release;\n\t\t};\n\t\t83CBB9FA1A601CBA00E9B192 /* Build configuration list for PBXProject \"react_native_windows\" */ = {\n\t\t\tisa = XCConfigurationList;\n\t\t\tbuildConfigurations = (\n\t\t\t\t83CBBA201A601CBA00E9B192 /* Debug */,\n\t\t\t\t83CBBA211A601CBA00E9B192 /* Release */,\n\t\t\t);\n\t\t\tdefaultConfigurationIsVisible = 0;\n\t\t\tdefaultConfigurationName = Release;\n\t\t};\n/* End XCConfigurationList section */\n\t};\n\trootObject = 83CBB9F71A601CBA00E9B192 /* Project object */;\n}\n"
  },
  {
    "path": "example/react_native_windows/macos/react_native_windows.xcodeproj/xcshareddata/xcschemes/react_native_windows-iOS.xcscheme",
    "content": "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<Scheme\n   LastUpgradeVersion = \"1140\"\n   version = \"1.3\">\n   <BuildAction\n      parallelizeBuildables = \"YES\"\n      buildImplicitDependencies = \"YES\">\n      <BuildActionEntries>\n         <BuildActionEntry\n            buildForTesting = \"YES\"\n            buildForRunning = \"YES\"\n            buildForProfiling = \"YES\"\n            buildForArchiving = \"YES\"\n            buildForAnalyzing = \"YES\">\n            <BuildableReference\n               BuildableIdentifier = \"primary\"\n               BlueprintIdentifier = \"13B07F861A680F5B00A75B9A\"\n               BuildableName = \"react_native_windows.app\"\n               BlueprintName = \"react_native_windows-iOS\"\n               ReferencedContainer = \"container:react_native_windows.xcodeproj\">\n            </BuildableReference>\n         </BuildActionEntry>\n      </BuildActionEntries>\n   </BuildAction>\n   <TestAction\n      buildConfiguration = \"Debug\"\n      selectedDebuggerIdentifier = \"Xcode.DebuggerFoundation.Debugger.LLDB\"\n      selectedLauncherIdentifier = \"Xcode.DebuggerFoundation.Launcher.LLDB\"\n      shouldUseLaunchSchemeArgsEnv = \"YES\">\n      <Testables>\n      </Testables>\n   </TestAction>\n   <LaunchAction\n      buildConfiguration = \"Debug\"\n      selectedDebuggerIdentifier = \"Xcode.DebuggerFoundation.Debugger.LLDB\"\n      selectedLauncherIdentifier = \"Xcode.DebuggerFoundation.Launcher.LLDB\"\n      launchStyle = \"0\"\n      useCustomWorkingDirectory = \"NO\"\n      ignoresPersistentStateOnLaunch = \"NO\"\n      debugDocumentVersioning = \"YES\"\n      debugServiceExtension = \"internal\"\n      allowLocationSimulation = \"YES\">\n      <BuildableProductRunnable\n         runnableDebuggingMode = \"0\">\n         <BuildableReference\n            BuildableIdentifier = \"primary\"\n            BlueprintIdentifier = \"13B07F861A680F5B00A75B9A\"\n            BuildableName = \"react_native_windows.app\"\n            BlueprintName = \"react_native_windows-iOS\"\n            ReferencedContainer = \"container:react_native_windows.xcodeproj\">\n         </BuildableReference>\n      </BuildableProductRunnable>\n   </LaunchAction>\n   <ProfileAction\n      buildConfiguration = \"Release\"\n      shouldUseLaunchSchemeArgsEnv = \"YES\"\n      savedToolIdentifier = \"\"\n      useCustomWorkingDirectory = \"NO\"\n      debugDocumentVersioning = \"YES\">\n      <BuildableProductRunnable\n         runnableDebuggingMode = \"0\">\n         <BuildableReference\n            BuildableIdentifier = \"primary\"\n            BlueprintIdentifier = \"13B07F861A680F5B00A75B9A\"\n            BuildableName = \"react_native_windows.app\"\n            BlueprintName = \"react_native_windows-iOS\"\n            ReferencedContainer = \"container:react_native_windows.xcodeproj\">\n         </BuildableReference>\n      </BuildableProductRunnable>\n   </ProfileAction>\n   <AnalyzeAction\n      buildConfiguration = \"Debug\">\n   </AnalyzeAction>\n   <ArchiveAction\n      buildConfiguration = \"Release\"\n      revealArchiveInOrganizer = \"YES\">\n   </ArchiveAction>\n</Scheme>\n"
  },
  {
    "path": "example/react_native_windows/macos/react_native_windows.xcodeproj/xcshareddata/xcschemes/react_native_windows-macOS.xcscheme",
    "content": "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<Scheme\n   LastUpgradeVersion = \"1140\"\n   version = \"1.3\">\n   <BuildAction\n      parallelizeBuildables = \"YES\"\n      buildImplicitDependencies = \"YES\">\n      <BuildActionEntries>\n         <BuildActionEntry\n            buildForTesting = \"YES\"\n            buildForRunning = \"YES\"\n            buildForProfiling = \"YES\"\n            buildForArchiving = \"YES\"\n            buildForAnalyzing = \"YES\">\n            <BuildableReference\n               BuildableIdentifier = \"primary\"\n               BlueprintIdentifier = \"514201482437B4B30078DB4F\"\n               BuildableName = \"react_native_windows.app\"\n               BlueprintName = \"react_native_windows-macOS\"\n               ReferencedContainer = \"container:react_native_windows.xcodeproj\">\n            </BuildableReference>\n         </BuildActionEntry>\n      </BuildActionEntries>\n   </BuildAction>\n   <TestAction\n      buildConfiguration = \"Debug\"\n      selectedDebuggerIdentifier = \"Xcode.DebuggerFoundation.Debugger.LLDB\"\n      selectedLauncherIdentifier = \"Xcode.DebuggerFoundation.Launcher.LLDB\"\n      shouldUseLaunchSchemeArgsEnv = \"YES\">\n      <Testables>\n      </Testables>\n   </TestAction>\n   <LaunchAction\n      buildConfiguration = \"Debug\"\n      selectedDebuggerIdentifier = \"Xcode.DebuggerFoundation.Debugger.LLDB\"\n      selectedLauncherIdentifier = \"Xcode.DebuggerFoundation.Launcher.LLDB\"\n      launchStyle = \"0\"\n      useCustomWorkingDirectory = \"NO\"\n      ignoresPersistentStateOnLaunch = \"NO\"\n      debugDocumentVersioning = \"YES\"\n      debugServiceExtension = \"internal\"\n      allowLocationSimulation = \"YES\">\n      <BuildableProductRunnable\n         runnableDebuggingMode = \"0\">\n         <BuildableReference\n            BuildableIdentifier = \"primary\"\n            BlueprintIdentifier = \"514201482437B4B30078DB4F\"\n            BuildableName = \"react_native_windows.app\"\n            BlueprintName = \"react_native_windows-macOS\"\n            ReferencedContainer = \"container:react_native_windows.xcodeproj\">\n         </BuildableReference>\n      </BuildableProductRunnable>\n   </LaunchAction>\n   <ProfileAction\n      buildConfiguration = \"Release\"\n      shouldUseLaunchSchemeArgsEnv = \"YES\"\n      savedToolIdentifier = \"\"\n      useCustomWorkingDirectory = \"NO\"\n      debugDocumentVersioning = \"YES\">\n      <BuildableProductRunnable\n         runnableDebuggingMode = \"0\">\n         <BuildableReference\n            BuildableIdentifier = \"primary\"\n            BlueprintIdentifier = \"514201482437B4B30078DB4F\"\n            BuildableName = \"react_native_windows.app\"\n            BlueprintName = \"react_native_windows-macOS\"\n            ReferencedContainer = \"container:react_native_windows.xcodeproj\">\n         </BuildableReference>\n      </BuildableProductRunnable>\n   </ProfileAction>\n   <AnalyzeAction\n      buildConfiguration = \"Debug\">\n   </AnalyzeAction>\n   <ArchiveAction\n      buildConfiguration = \"Release\"\n      revealArchiveInOrganizer = \"YES\">\n   </ArchiveAction>\n</Scheme>\n"
  },
  {
    "path": "example/react_native_windows/macos/react_native_windows.xcworkspace/contents.xcworkspacedata",
    "content": "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<Workspace\n   version = \"1.0\">\n   <FileRef\n      location = \"group:react_native_windows.xcodeproj\">\n   </FileRef>\n   <FileRef\n      location = \"group:Pods/Pods.xcodeproj\">\n   </FileRef>\n</Workspace>\n"
  },
  {
    "path": "example/react_native_windows/metro.config.js",
    "content": "/**\n * Metro configuration for React Native\n * https://github.com/facebook/react-native\n *\n * @format\n */\nconst path = require('path');\nconst blacklist = require('metro-config/src/defaults/blacklist');\n\nmodule.exports = {\n  resolver: {\n    blacklistRE: blacklist([\n      // This stops \"react-native run-windows\" from causing the metro server to crash if its already running\n      new RegExp(\n        `${path.resolve(__dirname, 'windows').replace(/[/\\\\]/g, '/')}.*`,\n      ),\n      // This prevents \"react-native run-windows\" from hitting: EBUSY: resource busy or locked, open msbuild.ProjectImports.zip\n      /.*\\.ProjectImports\\.zip/,\n    ]),\n  },\n  transformer: {\n    getTransformOptions: async () => ({\n      transform: {\n        experimentalImportSupport: false,\n        inlineRequires: false,\n      },\n    }),\n  },\n};\n"
  },
  {
    "path": "example/react_native_windows/metro.config.macos.js",
    "content": "/**\n * This cli config is needed for development purposes, e.g. for running\n * integration tests during local development or on CI services.\n */\n\nconst path = require('path');\nconst blacklist = require('metro-config/src/defaults/blacklist');\n\nconst rnmPath = path.resolve(__dirname, 'node_modules/react-native-macos');\n\nmodule.exports = {\n  resolver: {\n    extraNodeModules: {\n      'react-native': rnmPath,\n    },\n    platforms: ['macos', 'ios', 'android'],\n    blacklistRE: blacklist([/node_modules\\/react-native\\/.*/]),\n  },\n};\n"
  },
  {
    "path": "example/react_native_windows/package.json",
    "content": "{\n  \"name\": \"react_native_windows\",\n  \"version\": \"0.0.1\",\n  \"private\": true,\n  \"scripts\": {\n    \"android\": \"react-native run-android\",\n    \"ios\": \"react-native run-ios\",\n    \"start\": \"react-native start\",\n    \"start:macos\": \"react-native run-macos\",\n    \"start:windows\": \"react-native run-macos\",\n    \"test\": \"jest\",\n    \"lint\": \"eslint .\"\n  },\n  \"dependencies\": {\n    \"i18next\": \"20.0.0\",\n    \"react\": \"16.13.1\",\n    \"react-i18next\": \"11.7.3\",\n    \"react-native\": \"0.63.3\",\n    \"react-native-macos\": \"^0.62.0-0\",\n    \"react-native-windows\": \"^0.63.0-0\"\n  },\n  \"devDependencies\": {\n    \"@babel/core\": \"^7.8.4\",\n    \"@babel/runtime\": \"^7.8.4\",\n    \"@react-native-community/eslint-config\": \"^1.1.0\",\n    \"babel-jest\": \"^25.1.0\",\n    \"eslint\": \"^6.5.1\",\n    \"jest\": \"^25.1.0\",\n    \"metro-react-native-babel-preset\": \"^0.59.0\",\n    \"react-test-renderer\": \"16.13.1\"\n  },\n  \"jest\": {\n    \"preset\": \"react-native\"\n  }\n}\n"
  },
  {
    "path": "example/react_native_windows/react-native.config.js",
    "content": "const macSwitch = '--use-react-native-macos';\n\nif (process.argv.includes(macSwitch)) {\n  process.argv = process.argv.filter((arg) => arg !== macSwitch);\n  process.argv.push('--config=metro.config.macos.js');\n  module.exports = {\n    reactNativePath: 'node_modules/react-native-macos',\n  };\n}\n"
  },
  {
    "path": "example/react_native_windows/windows/.gitignore",
    "content": "*AppPackages*\r\n*BundleArtifacts*\r\n\r\n#OS junk files\r\n[Tt]humbs.db\r\n*.DS_Store\r\n\r\n#Visual Studio files\r\n*.[Oo]bj\r\n*.user\r\n*.aps\r\n*.pch\r\n*.vspscc\r\n*.vssscc\r\n*_i.c\r\n*_p.c\r\n*.ncb\r\n*.suo\r\n*.tlb\r\n*.tlh\r\n*.bak\r\n*.[Cc]ache\r\n*.ilk\r\n*.log\r\n*.lib\r\n*.sbr\r\n*.sdf\r\n*.opensdf\r\n*.opendb\r\n*.unsuccessfulbuild\r\nipch/\r\n[Oo]bj/\r\n[Bb]in\r\n[Dd]ebug*/\r\n[Rr]elease*/\r\nAnkh.NoLoad\r\n\r\n# Visual C++ cache files\r\nipch/\r\n*.aps\r\n*.ncb\r\n*.opendb\r\n*.opensdf\r\n*.sdf\r\n*.cachefile\r\n*.VC.db\r\n*.VC.VC.opendb\r\n\r\n#MonoDevelop\r\n*.pidb\r\n*.userprefs\r\n\r\n#Tooling\r\n_ReSharper*/\r\n*.resharper\r\n[Tt]est[Rr]esult*\r\n*.sass-cache\r\n\r\n#Project files\r\n[Bb]uild/\r\n\r\n#Subversion files\r\n.svn\r\n\r\n# Office Temp Files\r\n~$*\r\n\r\n# vim Temp Files\r\n*~\r\n\r\n#NuGet\r\npackages/\r\n*.nupkg\r\n\r\n#ncrunch\r\n*ncrunch*\r\n*crunch*.local.xml\r\n\r\n# visual studio database projects\r\n*.dbmdl\r\n\r\n#Test files\r\n*.testsettings\r\n\r\n#Other files\r\n*.DotSettings\r\n.vs/\r\n*project.lock.json\r\n\r\n#Files generated by the VS build\r\n**/Generated Files/**\r\n\r\n"
  },
  {
    "path": "example/react_native_windows/windows/react_native_windows/.gitignore",
    "content": "/Bundle\r\n"
  },
  {
    "path": "example/react_native_windows/windows/react_native_windows/App.cpp",
    "content": "#include \"pch.h\"\r\n\r\n#include \"App.h\"\r\n\r\n#include \"AutolinkedNativeModules.g.h\"\r\n#include \"ReactPackageProvider.h\"\r\n\r\n\nusing namespace winrt::react_native_windows;\r\nusing namespace winrt::react_native_windows::implementation;\r\nusing namespace winrt;\r\nusing namespace Windows::UI::Xaml;\r\nusing namespace Windows::UI::Xaml::Controls;\r\nusing namespace Windows::UI::Xaml::Navigation;\r\nusing namespace Windows::ApplicationModel;\r\n\r\n/// <summary>\r\n/// Initializes the singleton application object.  This is the first line of\r\n/// authored code executed, and as such is the logical equivalent of main() or\r\n/// WinMain().\r\n/// </summary>\r\nApp::App() noexcept\r\n{\r\n#if BUNDLE\r\n    JavaScriptBundleFile(L\"index.windows\");\r\n    InstanceSettings().UseWebDebugger(false);\r\n    InstanceSettings().UseFastRefresh(false);\r\n#else\r\n    JavaScriptMainModuleName(L\"index\");\r\n    InstanceSettings().UseWebDebugger(true);\r\n    InstanceSettings().UseFastRefresh(true);\r\n#endif\r\n\r\n#if _DEBUG\r\n    InstanceSettings().UseDeveloperSupport(true);\r\n#else\r\n    InstanceSettings().UseDeveloperSupport(false);\r\n#endif\r\n\r\n    RegisterAutolinkedNativeModulePackages(PackageProviders()); // Includes any autolinked modules\r\n\r\n    PackageProviders().Append(make<ReactPackageProvider>()); // Includes all modules in this project\r\n\r\n    InitializeComponent();\r\n}\r\n\r\n/// <summary>\r\n/// Invoked when the application is launched normally by the end user.  Other entry points\r\n/// will be used such as when the application is launched to open a specific file.\r\n/// </summary>\r\n/// <param name=\"e\">Details about the launch request and process.</param>\r\nvoid App::OnLaunched(activation::LaunchActivatedEventArgs const& e)\r\n{\r\n    super::OnLaunched(e);\r\n\r\n    Frame rootFrame = Window::Current().Content().as<Frame>();\r\n    rootFrame.Navigate(xaml_typename<react_native_windows::MainPage>(), box_value(e.Arguments()));\r\n}\r\n\r\n/// <summary>\r\n/// Invoked when application execution is being suspended.  Application state is saved\r\n/// without knowing whether the application will be terminated or resumed with the contents\r\n/// of memory still intact.\r\n/// </summary>\r\n/// <param name=\"sender\">The source of the suspend request.</param>\r\n/// <param name=\"e\">Details about the suspend request.</param>\r\nvoid App::OnSuspending([[maybe_unused]] IInspectable const& sender, [[maybe_unused]] SuspendingEventArgs const& e)\r\n{\r\n    // Save application state and stop any background activity\r\n}\r\n\r\n/// <summary>\r\n/// Invoked when Navigation to a certain page fails\r\n/// </summary>\r\n/// <param name=\"sender\">The Frame which failed navigation</param>\r\n/// <param name=\"e\">Details about the navigation failure</param>\r\nvoid App::OnNavigationFailed(IInspectable const&, NavigationFailedEventArgs const& e)\r\n{\r\n    throw hresult_error(E_FAIL, hstring(L\"Failed to load Page \") + e.SourcePageType().Name);\r\n}\r\n"
  },
  {
    "path": "example/react_native_windows/windows/react_native_windows/App.h",
    "content": "#pragma once\r\n\r\n#include \"App.xaml.g.h\"\r\n\nnamespace activation = winrt::Windows::ApplicationModel::Activation;\r\n\r\nnamespace winrt::react_native_windows::implementation\r\n{\r\n    struct App : AppT<App>\r\n    {\r\n        App() noexcept;\r\n        void OnLaunched(activation::LaunchActivatedEventArgs const&);\r\n        void OnSuspending(IInspectable const&, Windows::ApplicationModel::SuspendingEventArgs const&);\r\n        void OnNavigationFailed(IInspectable const&, Windows::UI::Xaml::Navigation::NavigationFailedEventArgs const&);\r\n      private:\r\n        using super = AppT<App>;\r\n    };\r\n} // namespace winrt::react_native_windows::implementation\r\n\r\n\n"
  },
  {
    "path": "example/react_native_windows/windows/react_native_windows/App.idl",
    "content": "namespace react_native_windows\r\n{\r\n}\r\n"
  },
  {
    "path": "example/react_native_windows/windows/react_native_windows/App.xaml",
    "content": "﻿<react:ReactApplication\r\n    x:Class=\"react_native_windows.App\"\r\n    xmlns=\"http://schemas.microsoft.com/winfx/2006/xaml/presentation\"\r\n    xmlns:x=\"http://schemas.microsoft.com/winfx/2006/xaml\"\r\n    xmlns:local=\"using:react_native_windows\"\r\n    xmlns:react=\"using:Microsoft.ReactNative\">\r\n    <Application.Resources>\r\n        <XamlControlsResources xmlns=\"using:Microsoft.UI.Xaml.Controls\" />\r\n    </Application.Resources>\r\n</react:ReactApplication>\r\n"
  },
  {
    "path": "example/react_native_windows/windows/react_native_windows/AutolinkedNativeModules.g.cpp",
    "content": "// AutolinkedNativeModules.g.cpp contents generated by \"react-native autolink-windows\"\r\n// clang-format off\r\n#include \"pch.h\"\r\n#include \"AutolinkedNativeModules.g.h\"\r\n\r\nnamespace winrt::Microsoft::ReactNative\r\n{\r\n\r\nvoid RegisterAutolinkedNativeModulePackages(winrt::Windows::Foundation::Collections::IVector<winrt::Microsoft::ReactNative::IReactPackageProvider> const& packageProviders)\r\n{ \r\n    UNREFERENCED_PARAMETER(packageProviders);\r\n}\r\n\r\n}\r\n"
  },
  {
    "path": "example/react_native_windows/windows/react_native_windows/AutolinkedNativeModules.g.h",
    "content": "// AutolinkedNativeModules.g.h contents generated by \"react-native autolink-windows\"\r\n\n#pragma once\r\n\r\nnamespace winrt::Microsoft::ReactNative\r\n{\r\n\r\nvoid RegisterAutolinkedNativeModulePackages(winrt::Windows::Foundation::Collections::IVector<winrt::Microsoft::ReactNative::IReactPackageProvider> const& packageProviders);\r\n\r\n}\r\n"
  },
  {
    "path": "example/react_native_windows/windows/react_native_windows/AutolinkedNativeModules.g.targets",
    "content": "<?xml version=\"1.0\" encoding=\"utf-8\"?>\r\n<Project xmlns=\"http://schemas.microsoft.com/developer/msbuild/2003\">\r\n  <!-- AutolinkedNativeModules.g.targets contents generated by \"react-native autolink-windows\" -->\r\n  <ItemGroup>\r\n  </ItemGroup>\r\n</Project>\r\n"
  },
  {
    "path": "example/react_native_windows/windows/react_native_windows/MainPage.cpp",
    "content": "﻿#include \"pch.h\"\r\n#include \"MainPage.h\"\r\n#if __has_include(\"MainPage.g.cpp\")\r\n#include \"MainPage.g.cpp\"\r\n#endif\r\n\r\n#include \"App.h\"\r\n\r\n\n\r\nusing namespace winrt;\r\nusing namespace Windows::UI::Xaml;\r\n\r\nnamespace winrt::react_native_windows::implementation\r\n{\r\n    MainPage::MainPage()\r\n    {\r\n        InitializeComponent();\r\n        auto app = Application::Current().as<App>();\r\n        ReactRootView().ReactNativeHost(app->Host());\r\n    }\r\n}\r\n\r\n\n"
  },
  {
    "path": "example/react_native_windows/windows/react_native_windows/MainPage.h",
    "content": "﻿#pragma once\r\n#include \"MainPage.g.h\"\r\n#include <winrt/Microsoft.ReactNative.h>\r\n\r\n\nnamespace winrt::react_native_windows::implementation\r\n{\r\n    struct MainPage : MainPageT<MainPage>\r\n    {\r\n        MainPage();\r\n    };\r\n}\r\n\r\nnamespace winrt::react_native_windows::factory_implementation\r\n{\r\n    struct MainPage : MainPageT<MainPage, implementation::MainPage>\r\n    {\r\n    };\r\n}\r\n\r\n\n"
  },
  {
    "path": "example/react_native_windows/windows/react_native_windows/MainPage.idl",
    "content": "namespace react_native_windows\r\n{\r\n    [default_interface]\r\n    runtimeclass MainPage : Windows.UI.Xaml.Controls.Page\r\n    {\r\n        MainPage();\r\n    }\r\n}\r\n"
  },
  {
    "path": "example/react_native_windows/windows/react_native_windows/MainPage.xaml",
    "content": "<Page\r\n    x:Class=\"react_native_windows.MainPage\"\r\n    xmlns=\"http://schemas.microsoft.com/winfx/2006/xaml/presentation\"\r\n    xmlns:x=\"http://schemas.microsoft.com/winfx/2006/xaml\"\r\n    xmlns:local=\"using:react_native_windows\"\r\n    xmlns:react=\"using:Microsoft.ReactNative\"\r\n    xmlns:d=\"http://schemas.microsoft.com/expression/blend/2008\"\r\n    xmlns:mc=\"http://schemas.openxmlformats.org/markup-compatibility/2006\"\r\n    mc:Ignorable=\"d\"\r\n    Background=\"{ThemeResource ApplicationPageBackgroundThemeBrush}\">\r\n    <react:ReactRootView \r\n        x:Name=\"ReactRootView\"\r\n        ComponentName=\"react_native_windows\"\r\n        Background=\"{ThemeResource ApplicationPageBackgroundThemeBrush}\"\r\n        MinHeight=\"400\"/>\r\n</Page>\r\n"
  },
  {
    "path": "example/react_native_windows/windows/react_native_windows/Package.appxmanifest",
    "content": "﻿<?xml version=\"1.0\" encoding=\"utf-8\"?>\r\n\r\n<Package\r\n  xmlns=\"http://schemas.microsoft.com/appx/manifest/foundation/windows10\"\r\n  xmlns:mp=\"http://schemas.microsoft.com/appx/2014/phone/manifest\"\r\n  xmlns:uap=\"http://schemas.microsoft.com/appx/manifest/uap/windows10\"\r\n  IgnorableNamespaces=\"uap mp\">\r\n\r\n  <Identity\r\n    Name=\"74142ed3-4ca0-4942-8b51-759eada5204d\"\r\n    Publisher=\"CN=adrai\"\r\n    Version=\"1.0.0.0\" />\r\n\r\n  <mp:PhoneIdentity PhoneProductId=\"74142ed3-4ca0-4942-8b51-759eada5204d\" PhonePublisherId=\"00000000-0000-0000-0000-000000000000\"/>\r\n\r\n  <Properties>\r\n    <DisplayName>react_native_windows</DisplayName>\r\n    <PublisherDisplayName>adrai</PublisherDisplayName>\r\n    <Logo>Assets\\StoreLogo.png</Logo>\r\n  </Properties>\r\n\r\n  <Dependencies>\r\n    <TargetDeviceFamily Name=\"Windows.Universal\" MinVersion=\"10.0.0.0\" MaxVersionTested=\"10.0.0.0\" />\r\n  </Dependencies>\r\n\r\n  <Resources>\r\n    <Resource Language=\"x-generate\"/>\r\n  </Resources>\r\n\r\n  <Applications>\r\n    <Application\r\n      Id=\"App\"\r\n      Executable=\"$targetnametoken$.exe\"\r\n      EntryPoint=\"react_native_windows.App\">\r\n      <uap:VisualElements\r\n        DisplayName=\"react_native_windows\"\r\n        Square150x150Logo=\"Assets\\Square150x150Logo.png\"\r\n        Square44x44Logo=\"Assets\\Square44x44Logo.png\"\r\n        Description=\"react_native_windows\"\r\n        BackgroundColor=\"transparent\">\r\n        <uap:DefaultTile Wide310x150Logo=\"Assets\\Wide310x150Logo.png\"/>\r\n        <uap:SplashScreen Image=\"Assets\\SplashScreen.png\" />\r\n      </uap:VisualElements>\r\n    </Application>\r\n  </Applications>\r\n\r\n  <Capabilities>\r\n    <Capability Name=\"internetClient\" />\r\n  </Capabilities>\r\n</Package>"
  },
  {
    "path": "example/react_native_windows/windows/react_native_windows/PropertySheet.props",
    "content": "<?xml version=\"1.0\" encoding=\"utf-8\"?>\r\n<Project ToolsVersion=\"4.0\" xmlns=\"http://schemas.microsoft.com/developer/msbuild/2003\">\r\n  <ImportGroup Label=\"PropertySheets\" />\r\n  <PropertyGroup Label=\"UserMacros\" />\r\n  <!--\r\n    To customize common C++/WinRT project properties: \r\n    * right-click the project node\r\n    * expand the Common Properties item\r\n    * select the C++/WinRT property page\r\n\r\n    For more advanced scenarios, and complete documentation, please see:\r\n    https://github.com/Microsoft/xlang/tree/master/src/package/cppwinrt/nuget \r\n    -->\r\n  <PropertyGroup />\r\n  <ItemDefinitionGroup />\r\n</Project>"
  },
  {
    "path": "example/react_native_windows/windows/react_native_windows/ReactPackageProvider.cpp",
    "content": "#include \"pch.h\"\r\n#include \"ReactPackageProvider.h\"\r\n#include \"NativeModules.h\"\r\n\r\n\nusing namespace winrt::Microsoft::ReactNative;\r\n\r\nnamespace winrt::react_native_windows::implementation\r\n{\r\n\r\nvoid ReactPackageProvider::CreatePackage(IReactPackageBuilder const &packageBuilder) noexcept\r\n{\r\n    AddAttributedModules(packageBuilder);\r\n}\r\n\r\n} // namespace winrt::react_native_windows::implementation\r\n\r\n\n"
  },
  {
    "path": "example/react_native_windows/windows/react_native_windows/ReactPackageProvider.h",
    "content": "#pragma once\r\n\r\n#include \"winrt/Microsoft.ReactNative.h\"\r\n\r\n\nnamespace winrt::react_native_windows::implementation\r\n{\r\n    struct ReactPackageProvider : winrt::implements<ReactPackageProvider, winrt::Microsoft::ReactNative::IReactPackageProvider>\r\n    {\r\n    public: // IReactPackageProvider\r\n        void CreatePackage(winrt::Microsoft::ReactNative::IReactPackageBuilder const &packageBuilder) noexcept;\r\n    };\r\n} // namespace winrt::react_native_windows::implementation\r\n\r\n\n"
  },
  {
    "path": "example/react_native_windows/windows/react_native_windows/packages.config",
    "content": "﻿<?xml version=\"1.0\" encoding=\"utf-8\"?>\r\n<packages>\r\n  <package id=\"Microsoft.Windows.CppWinRT\" version=\"2.0.200615.7\" targetFramework=\"native\" />\r\n  <package id=\"Microsoft.UI.Xaml\" version=\"2.3.191129002\" targetFramework=\"native\" />\r\n</packages>"
  },
  {
    "path": "example/react_native_windows/windows/react_native_windows/pch.cpp",
    "content": "﻿#include \"pch.h\"\r\n"
  },
  {
    "path": "example/react_native_windows/windows/react_native_windows/pch.h",
    "content": "﻿#pragma once\r\n\r\n#define NOMINMAX\r\n\r\n#include <hstring.h>\r\n#include <restrictederrorinfo.h>\r\n#include <unknwn.h>\r\n#include <windows.h>\r\n#include <winrt/Windows.ApplicationModel.Activation.h>\r\n#include <winrt/Windows.Foundation.Collections.h>\r\n#include <winrt/Windows.Foundation.h>\r\n#include <winrt/Windows.UI.Xaml.Controls.Primitives.h>\r\n#include <winrt/Windows.UI.Xaml.Controls.h>\r\n#include <winrt/Windows.UI.Xaml.Data.h>\r\n#include <winrt/Windows.UI.Xaml.Interop.h>\r\n#include <winrt/Windows.UI.Xaml.Markup.h>\r\n#include <winrt/Windows.UI.Xaml.Navigation.h>\r\n#include <winrt/Windows.UI.Xaml.h>\r\n\r\n#include <winrt/Microsoft.ReactNative.h>\r\n\r\n#include <winrt/Microsoft.UI.Xaml.Automation.Peers.h>\r\n#include <winrt/Microsoft.UI.Xaml.Controls.Primitives.h>\r\n#include <winrt/Microsoft.UI.Xaml.Controls.h>\r\n#include <winrt/Microsoft.UI.Xaml.Media.h>\r\n#include <winrt/Microsoft.UI.Xaml.XamlTypeInfo.h>\r\n"
  },
  {
    "path": "example/react_native_windows/windows/react_native_windows/react_native_windows.vcxproj",
    "content": "<?xml version=\"1.0\" encoding=\"utf-8\"?>\r\n<Project ToolsVersion=\"16.0\" DefaultTargets=\"Build\" xmlns=\"http://schemas.microsoft.com/developer/msbuild/2003\">\r\n  <Import Project=\"..\\packages\\Microsoft.Windows.CppWinRT.2.0.200615.7\\build\\native\\Microsoft.Windows.CppWinRT.props\" Condition=\"Exists('..\\packages\\Microsoft.Windows.CppWinRT.2.0.200615.7\\build\\native\\Microsoft.Windows.CppWinRT.props')\" />\r\n  <PropertyGroup Label=\"Globals\">\r\n    <CppWinRTOptimized>true</CppWinRTOptimized>\r\n    <CppWinRTRootNamespaceAutoMerge>true</CppWinRTRootNamespaceAutoMerge>\r\n    <MinimalCoreWin>true</MinimalCoreWin>\r\n    <ProjectGuid>{8fe8eae3-a280-472d-9db2-e3fa4f303e81}</ProjectGuid>\r\n    <ProjectName>react_native_windows</ProjectName>\r\n    <RootNamespace>react_native_windows</RootNamespace>\r\n    <DefaultLanguage>en-US</DefaultLanguage>\r\n    <MinimumVisualStudioVersion>16.0</MinimumVisualStudioVersion>\r\n    <AppContainerApplication>true</AppContainerApplication>\r\n    <ApplicationType>Windows Store</ApplicationType>\r\n    <ApplicationTypeRevision>10.0</ApplicationTypeRevision>\r\n    <WindowsTargetPlatformVersion Condition=\" '$(WindowsTargetPlatformVersion)' == '' \">10.0.18362.0</WindowsTargetPlatformVersion>\r\n    <WindowsTargetPlatformMinVersion>10.0.16299.0</WindowsTargetPlatformMinVersion>\r\n    <PackageCertificateKeyFile>react_native_windows_TemporaryKey.pfx</PackageCertificateKeyFile>\r\n    <PackageCertificatePassword>password</PackageCertificatePassword>\r\n  </PropertyGroup>\r\n  <Import Project=\"$(VCTargetsPath)\\Microsoft.Cpp.Default.props\" />\r\n  <PropertyGroup Label=\"ReactNativeWindowsProps\">\r\n    <ReactNativeWindowsDir Condition=\"'$(ReactNativeWindowsDir)' == ''\">$([MSBuild]::GetDirectoryNameOfFileAbove($(MSBuildThisFileDirectory), 'node_modules\\react-native-windows\\package.json'))\\node_modules\\react-native-windows\\</ReactNativeWindowsDir>\r\n  </PropertyGroup>\r\n  <ItemGroup Label=\"ProjectConfigurations\">\r\n    <ProjectConfiguration Include=\"Debug|ARM\">\r\n      <Configuration>Debug</Configuration>\r\n      <Platform>ARM</Platform>\r\n    </ProjectConfiguration>\r\n    <ProjectConfiguration Include=\"Debug|ARM64\">\r\n      <Configuration>Debug</Configuration>\r\n      <Platform>ARM64</Platform>\r\n    </ProjectConfiguration>\r\n    <ProjectConfiguration Include=\"Debug|Win32\">\r\n      <Configuration>Debug</Configuration>\r\n      <Platform>Win32</Platform>\r\n    </ProjectConfiguration>\r\n    <ProjectConfiguration Include=\"Debug|x64\">\r\n      <Configuration>Debug</Configuration>\r\n      <Platform>x64</Platform>\r\n    </ProjectConfiguration>\r\n    <ProjectConfiguration Include=\"Release|ARM\">\r\n      <Configuration>Release</Configuration>\r\n      <Platform>ARM</Platform>\r\n    </ProjectConfiguration>\r\n    <ProjectConfiguration Include=\"Release|ARM64\">\r\n      <Configuration>Release</Configuration>\r\n      <Platform>ARM64</Platform>\r\n    </ProjectConfiguration>\r\n    <ProjectConfiguration Include=\"Release|Win32\">\r\n      <Configuration>Release</Configuration>\r\n      <Platform>Win32</Platform>\r\n    </ProjectConfiguration>\r\n    <ProjectConfiguration Include=\"Release|x64\">\r\n      <Configuration>Release</Configuration>\r\n      <Platform>x64</Platform>\r\n    </ProjectConfiguration>\r\n  </ItemGroup>\r\n  <PropertyGroup Label=\"Configuration\">\r\n    <ConfigurationType>Application</ConfigurationType>\r\n    <CharacterSet>Unicode</CharacterSet>\r\n  </PropertyGroup>\r\n  <PropertyGroup Condition=\"'$(Configuration)'=='Debug'\" Label=\"Configuration\">\r\n    <UseDebugLibraries>true</UseDebugLibraries>\r\n    <LinkIncremental>true</LinkIncremental>\r\n  </PropertyGroup>\r\n  <PropertyGroup Condition=\"'$(Configuration)'=='Release'\" Label=\"Configuration\">\r\n    <UseDebugLibraries>false</UseDebugLibraries>\r\n    <WholeProgramOptimization>true</WholeProgramOptimization>\r\n    <LinkIncremental>false</LinkIncremental>\r\n  </PropertyGroup>\r\n  <Import Project=\"$(VCTargetsPath)\\Microsoft.Cpp.props\" />\r\n  <ImportGroup Label=\"ExtensionSettings\"></ImportGroup>\r\n  <ImportGroup Label=\"PropertySheets\">\r\n    <Import Project=\"$(UserRootDir)\\Microsoft.Cpp.$(Platform).user.props\" Condition=\"exists('$(UserRootDir)\\Microsoft.Cpp.$(Platform).user.props')\" Label=\"LocalAppDataPlatform\" />\r\n  </ImportGroup>\r\n  <ImportGroup Label=\"PropertySheets\">\r\n    <Import Project=\"PropertySheet.props\" />\r\n  </ImportGroup>\r\n  <ImportGroup Label=\"ReactNativeWindowsPropertySheets\">\r\n    <Import Project=\"$(ReactNativeWindowsDir)\\PropertySheets\\external\\Microsoft.ReactNative.Uwp.CppApp.props\" Condition=\"Exists('$(ReactNativeWindowsDir)\\PropertySheets\\External\\Microsoft.ReactNative.Uwp.CppApp.props')\" />\r\n    <Import Project=\"..\\packages\\$(WinUIPackageProps)\" Condition=\"'$(WinUIPackageProps)'!='' And Exists('..\\packages\\$(WinUIPackageProps)')\" />\r\n  </ImportGroup>\r\n  <PropertyGroup Label=\"UserMacros\" />\r\n  <ItemDefinitionGroup>\r\n    <ClCompile>\r\n      <PrecompiledHeader>Use</PrecompiledHeader>\r\n      <PrecompiledHeaderFile>pch.h</PrecompiledHeaderFile>\r\n      <PrecompiledHeaderOutputFile>$(IntDir)pch.pch</PrecompiledHeaderOutputFile>\r\n      <WarningLevel>Level4</WarningLevel>\r\n      <AdditionalOptions>%(AdditionalOptions) /bigobj</AdditionalOptions>\r\n      <DisableSpecificWarnings>4453;28204</DisableSpecificWarnings>\r\n    </ClCompile>\r\n  </ItemDefinitionGroup>\r\n  <ItemDefinitionGroup Condition=\"'$(Configuration)'=='Debug'\">\r\n    <ClCompile>\r\n      <PreprocessorDefinitions>_DEBUG;%(PreprocessorDefinitions)</PreprocessorDefinitions>\r\n    </ClCompile>\r\n  </ItemDefinitionGroup>\r\n  <ItemDefinitionGroup Condition=\"'$(Configuration)'=='Release'\">\r\n    <ClCompile>\r\n      <PreprocessorDefinitions>NDEBUG;%(PreprocessorDefinitions)</PreprocessorDefinitions>\r\n    </ClCompile>\r\n  </ItemDefinitionGroup>\r\n  <ItemGroup>\r\n    <ClInclude Include=\"MainPage.h\">\r\n      <DependentUpon>MainPage.xaml</DependentUpon>\r\n      <SubType>Code</SubType>\r\n    </ClInclude>\r\n    <ClInclude Include=\"ReactPackageProvider.h\" />\r\n    <ClInclude Include=\"AutolinkedNativeModules.g.h\" />\r\n    <ClInclude Include=\"pch.h\" />\r\n    <ClInclude Include=\"App.h\">\r\n      <DependentUpon>App.xaml</DependentUpon>\r\n    </ClInclude>\r\n  </ItemGroup>\r\n  <ItemGroup>\r\n    <ApplicationDefinition Include=\"App.xaml\">\r\n      <SubType>Designer</SubType>\r\n    </ApplicationDefinition>\r\n  </ItemGroup>\r\n  <ItemGroup>\r\n    <AppxManifest Include=\"Package.appxmanifest\">\r\n      <SubType>Designer</SubType>\r\n    </AppxManifest>\r\n  </ItemGroup>\r\n  <ItemGroup>\r\n    <Image Include=\"Assets\\LockScreenLogo.scale-200.png\" />\r\n    <Image Include=\"Assets\\SplashScreen.scale-200.png\" />\r\n    <Image Include=\"Assets\\Square150x150Logo.scale-200.png\" />\r\n    <Image Include=\"Assets\\Square44x44Logo.scale-200.png\" />\r\n    <Image Include=\"Assets\\Square44x44Logo.targetsize-24_altform-unplated.png\" />\r\n    <Image Include=\"Assets\\StoreLogo.png\" />\r\n    <Image Include=\"Assets\\Wide310x150Logo.scale-200.png\" />\r\n  </ItemGroup>\r\n  <ItemGroup>\r\n    <ClCompile Include=\"MainPage.cpp\">\r\n      <DependentUpon>MainPage.xaml</DependentUpon>\r\n      <SubType>Code</SubType>\r\n    </ClCompile>\r\n    <ClCompile Include=\"ReactPackageProvider.cpp\" />\r\n    <ClCompile Include=\"AutolinkedNativeModules.g.cpp\" />\r\n    <ClCompile Include=\"pch.cpp\">\r\n      <PrecompiledHeader>Create</PrecompiledHeader>\r\n    </ClCompile>\r\n    <ClCompile Include=\"App.cpp\">\r\n      <DependentUpon>App.xaml</DependentUpon>\r\n    </ClCompile>\r\n    <ClCompile Include=\"$(GeneratedFilesDir)module.g.cpp\" />\r\n  </ItemGroup>\r\n  <ItemGroup>\r\n    <Midl Include=\"App.idl\">\r\n      <DependentUpon>App.xaml</DependentUpon>\r\n    </Midl>\r\n    <Midl Include=\"MainPage.idl\">\r\n      <DependentUpon>MainPage.xaml</DependentUpon>\r\n      <SubType>Code</SubType>\r\n    </Midl>\r\n  </ItemGroup>\r\n  <ItemGroup>\r\n    <None Include=\"packages.config\" />\r\n    <None Include=\"PropertySheet.props\" />\r\n    <Text Include=\"readme.txt\">\r\n      <DeploymentContent>false</DeploymentContent>\r\n    </Text>\r\n  </ItemGroup>\r\n  <ItemGroup>\r\n    <Page Include=\"MainPage.xaml\">\r\n      <SubType>Designer</SubType>\r\n    </Page>\r\n  </ItemGroup>\r\n  <Import Project=\"$(VCTargetsPath)\\Microsoft.Cpp.targets\" />\r\n  <ImportGroup Label=\"ReactNativeWindowsTargets\">\r\n    <Import Project=\"$(ReactNativeWindowsDir)\\PropertySheets\\External\\Microsoft.ReactNative.Uwp.CppApp.targets\" Condition=\"Exists('$(ReactNativeWindowsDir)\\PropertySheets\\External\\Microsoft.ReactNative.Uwp.CppApp.targets')\" />\r\n  </ImportGroup>\r\n  <Target Name=\"EnsureReactNativeWindowsTargets\" BeforeTargets=\"PrepareForBuild\">\r\n    <PropertyGroup>\r\n      <ErrorText>This project references targets in your node_modules\\react-native-windows folder. The missing file is {0}.</ErrorText>\r\n    </PropertyGroup>\r\n    <Error Condition=\"!Exists('$(ReactNativeWindowsDir)\\PropertySheets\\External\\Microsoft.ReactNative.Uwp.CppApp.props')\" Text=\"$([System.String]::Format('$(ErrorText)', '$(ReactNativeWindowsDir)\\PropertySheets\\External\\Microsoft.ReactNative.Uwp.CppApp.props'))\" />\r\n    <Error Condition=\"!Exists('$(ReactNativeWindowsDir)\\PropertySheets\\External\\Microsoft.ReactNative.Uwp.CppApp.targets')\" Text=\"$([System.String]::Format('$(ErrorText)', '$(ReactNativeWindowsDir)\\PropertySheets\\External\\Microsoft.ReactNative.Uwp.CppApp.targets'))\" />\r\n  </Target>\r\n  <ImportGroup Label=\"ExtensionTargets\">\r\n    <Import Project=\"..\\packages\\Microsoft.Windows.CppWinRT.2.0.200615.7\\build\\native\\Microsoft.Windows.CppWinRT.targets\" Condition=\"Exists('..\\packages\\Microsoft.Windows.CppWinRT.2.0.200615.7\\build\\native\\Microsoft.Windows.CppWinRT.targets')\" />\r\n    <Import Project=\"..\\packages\\$(WinUIPackageName).$(WinUIPackageVersion)\\build\\native\\$(WinUIPackageName).targets\" Condition=\"Exists('..\\packages\\$(WinUIPackageName).$(WinUIPackageVersion)\\build\\native\\$(WinUIPackageName).targets')\" />\r\n  </ImportGroup>\r\n  <Target Name=\"EnsureNuGetPackageBuildImports\" BeforeTargets=\"PrepareForBuild\">\r\n    <PropertyGroup>\r\n      <ErrorText>This project references NuGet package(s) that are missing on this computer. Use NuGet Package Restore to download them.  For more information, see http://go.microsoft.com/fwlink/?LinkID=322105. The missing file is {0}.</ErrorText>\r\n    </PropertyGroup>\r\n    <Error Condition=\"!Exists('..\\packages\\Microsoft.Windows.CppWinRT.2.0.200615.7\\build\\native\\Microsoft.Windows.CppWinRT.props')\" Text=\"$([System.String]::Format('$(ErrorText)', '..\\packages\\Microsoft.Windows.CppWinRT.2.0.200615.7\\build\\native\\Microsoft.Windows.CppWinRT.props'))\" />\r\n    <Error Condition=\"!Exists('..\\packages\\Microsoft.Windows.CppWinRT.2.0.200615.7\\build\\native\\Microsoft.Windows.CppWinRT.targets')\" Text=\"$([System.String]::Format('$(ErrorText)', '..\\packages\\Microsoft.Windows.CppWinRT.2.0.200615.7\\build\\native\\Microsoft.Windows.CppWinRT.targets'))\" />\r\n    <Error Condition=\"!Exists('..\\packages\\$(WinUIPackageName).$(WinUIPackageVersion)\\build\\native\\$(WinUIPackageName).targets')\" Text=\"$([System.String]::Format('$(ErrorText)', '..\\packages\\$(WinUIPackageName).$(WinUIPackageVersion)\\build\\native\\$(WinUIPackageName).targets'))\" />\r\n  </Target>\r\n</Project>\r\n"
  },
  {
    "path": "example/react_native_windows/windows/react_native_windows/react_native_windows.vcxproj.filters",
    "content": "﻿<?xml version=\"1.0\" encoding=\"utf-8\"?>\r\n<Project ToolsVersion=\"4.0\" xmlns=\"http://schemas.microsoft.com/developer/msbuild/2003\">\r\n  <ItemGroup>\r\n    <ApplicationDefinition Include=\"App.xaml\" />\r\n  </ItemGroup>\r\n  <ItemGroup>\r\n    <Midl Include=\"App.idl\" />\r\n  </ItemGroup>\r\n  <ItemGroup>\r\n    <ClCompile Include=\"pch.cpp\" />\r\n    <ClCompile Include=\"App.cpp\" />\r\n    <ClCompile Include=\"$(GeneratedFilesDir)module.g.cpp\" />\r\n    <ClCompile Include=\"ReactPackageProvider.cpp\" />\r\n    <ClCompile Include=\"AutolinkedNativeModules.g.cpp\" />\r\n  </ItemGroup>\r\n  <ItemGroup>\r\n    <ClInclude Include=\"pch.h\" />\r\n    <ClInclude Include=\"App.h\" />\r\n    <ClInclude Include=\"ReactPackageProvider.h\" />\r\n    <ClInclude Include=\"AutolinkedNativeModules.g.h\" />\r\n  </ItemGroup>\r\n  <ItemGroup>\r\n    <Image Include=\"Assets\\Wide310x150Logo.scale-200.png\">\r\n      <Filter>Assets</Filter>\r\n    </Image>\r\n    <Image Include=\"Assets\\StoreLogo.png\">\r\n      <Filter>Assets</Filter>\r\n    </Image>\r\n    <Image Include=\"Assets\\Square150x150Logo.scale-200.png\">\r\n      <Filter>Assets</Filter>\r\n    </Image>\r\n    <Image Include=\"Assets\\Square44x44Logo.targetsize-24_altform-unplated.png\">\r\n      <Filter>Assets</Filter>\r\n    </Image>\r\n    <Image Include=\"Assets\\Square44x44Logo.scale-200.png\">\r\n      <Filter>Assets</Filter>\r\n    </Image>\r\n    <Image Include=\"Assets\\SplashScreen.scale-200.png\">\r\n      <Filter>Assets</Filter>\r\n    </Image>\r\n    <Image Include=\"Assets\\LockScreenLogo.scale-200.png\">\r\n      <Filter>Assets</Filter>\r\n    </Image>\r\n  </ItemGroup>\r\n  <ItemGroup>\r\n    <AppxManifest Include=\"Package.appxmanifest\" />\r\n  </ItemGroup>\r\n  <ItemGroup>\r\n    <Filter Include=\"Assets\">\r\n      <UniqueIdentifier>{e48dc53e-40b1-40cb-970a-f89935452892}</UniqueIdentifier>\r\n    </Filter>\r\n  </ItemGroup>\r\n  <ItemGroup>\r\n    <None Include=\"PropertySheet.props\" />\r\n    <None Include=\"packages.config\" />\r\n  </ItemGroup>\r\n  <ItemGroup>\r\n    <Text Include=\"readme.txt\" />\r\n  </ItemGroup>\r\n  <ItemGroup>\r\n    <Page Include=\"MainPage.xaml\" />\r\n  </ItemGroup>\r\n</Project>"
  },
  {
    "path": "example/react_native_windows/windows/react_native_windows.sln",
    "content": "﻿\r\nMicrosoft Visual Studio Solution File, Format Version 12.00\r\n# Visual Studio Version 16\r\nVisualStudioVersion = 16.0.29215.179\r\nMinimumVisualStudioVersion = 10.0.40219.1\r\nProject(\"{8BC9CEB8-8B4A-11D0-8D11-00A0C91BC942}\") = \"react_native_windows\", \"react_native_windows\\react_native_windows.vcxproj\", \"{8FE8EAE3-A280-472D-9DB2-E3FA4F303E81}\"\r\n\tProjectSection(ProjectDependencies) = postProject\r\n\t\t{F7D32BD0-2749-483E-9A0D-1635EF7E3136} = {F7D32BD0-2749-483E-9A0D-1635EF7E3136}\r\n\tEndProjectSection\r\nEndProject\r\nProject(\"{8BC9CEB8-8B4A-11D0-8D11-00A0C91BC942}\") = \"Folly\", \"..\\node_modules\\react-native-windows\\Folly\\Folly.vcxproj\", \"{A990658C-CE31-4BCC-976F-0FC6B1AF693D}\"\r\nEndProject\r\nProject(\"{8BC9CEB8-8B4A-11D0-8D11-00A0C91BC942}\") = \"ReactCommon\", \"..\\node_modules\\react-native-windows\\ReactCommon\\ReactCommon.vcxproj\", \"{A9D95A91-4DB7-4F72-BEB6-FE8A5C89BFBD}\"\r\n\tProjectSection(ProjectDependencies) = postProject\r\n\t\t{A990658C-CE31-4BCC-976F-0FC6B1AF693D} = {A990658C-CE31-4BCC-976F-0FC6B1AF693D}\r\n\tEndProjectSection\r\nEndProject\r\nProject(\"{8BC9CEB8-8B4A-11D0-8D11-00A0C91BC942}\") = \"Chakra\", \"..\\node_modules\\react-native-windows\\Chakra\\Chakra.vcxitems\", \"{C38970C0-5FBF-4D69-90D8-CBAC225AE895}\"\r\nEndProject\r\nProject(\"{8BC9CEB8-8B4A-11D0-8D11-00A0C91BC942}\") = \"Microsoft.ReactNative\", \"..\\node_modules\\react-native-windows\\Microsoft.ReactNative\\Microsoft.ReactNative.vcxproj\", \"{F7D32BD0-2749-483E-9A0D-1635EF7E3136}\"\r\nEndProject\r\nProject(\"{8BC9CEB8-8B4A-11D0-8D11-00A0C91BC942}\") = \"JSI.Shared\", \"..\\node_modules\\react-native-windows\\JSI\\Shared\\JSI.Shared.vcxitems\", \"{0CC28589-39E4-4288-B162-97B959F8B843}\"\r\nEndProject\r\nProject(\"{8BC9CEB8-8B4A-11D0-8D11-00A0C91BC942}\") = \"JSI.Universal\", \"..\\node_modules\\react-native-windows\\JSI\\Universal\\JSI.Universal.vcxproj\", \"{A62D504A-16B8-41D2-9F19-E2E86019E5E4}\"\r\nEndProject\r\nProject(\"{8BC9CEB8-8B4A-11D0-8D11-00A0C91BC942}\") = \"Microsoft.ReactNative.Cxx\", \"..\\node_modules\\react-native-windows\\Microsoft.ReactNative.Cxx\\Microsoft.ReactNative.Cxx.vcxitems\", \"{DA8B35B3-DA00-4B02-BDE6-6A397B3FD46B}\"\r\nEndProject\r\nProject(\"{8BC9CEB8-8B4A-11D0-8D11-00A0C91BC942}\") = \"Common\", \"..\\node_modules\\react-native-windows\\Common\\Common.vcxproj\", \"{FCA38F3C-7C73-4C47-BE4E-32F77FA8538D}\"\r\nEndProject\r\nProject(\"{2150E333-8FDC-42A3-9474-1A3956D46DE8}\") = \"ReactNative\", \"ReactNative\", \"{5EA20F54-880A-49F3-99FA-4B3FE54E8AB1}\"\r\nEndProject\r\nProject(\"{8BC9CEB8-8B4A-11D0-8D11-00A0C91BC942}\") = \"Microsoft.ReactNative.Shared\", \"..\\node_modules\\react-native-windows\\Shared\\Shared.vcxitems\", \"{2049DBE9-8D13-42C9-AE4B-413AE38FFFD0}\"\r\nEndProject\r\nProject(\"{8BC9CEB8-8B4A-11D0-8D11-00A0C91BC942}\") = \"Mso\", \"..\\node_modules\\react-native-windows\\Mso\\Mso.vcxitems\", \"{84E05BFA-CBAF-4F0D-BFB6-4CE85742A57E}\"\r\nEndProject\r\nProject(\"{8BC9CEB8-8B4A-11D0-8D11-00A0C91BC942}\") = \"Include\", \"..\\node_modules\\react-native-windows\\include\\Include.vcxitems\", \"{EF074BA1-2D54-4D49-A28E-5E040B47CD2E}\"\r\nEndProject\r\nProject(\"{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}\") = \"Microsoft.ReactNative.Managed\", \"..\\node_modules\\react-native-windows\\Microsoft.ReactNative.Managed\\Microsoft.ReactNative.Managed.csproj\", \"{F2824844-CE15-4242-9420-308923CD76C3}\"\r\nEndProject\r\nProject(\"{9A19103F-16F7-4668-BE54-9A1E7A4F7556}\") = \"Microsoft.ReactNative.Managed.CodeGen\", \"..\\node_modules\\react-native-windows\\Microsoft.ReactNative.Managed.CodeGen\\Microsoft.ReactNative.Managed.CodeGen.csproj\", \"{ADED4FBE-887D-4271-AF24-F0823BCE7961}\"\r\nEndProject\r\nGlobal\r\n\tGlobalSection(SharedMSBuildProjectFiles) = preSolution\r\n\t\t..\\node_modules\\react-native-windows\\JSI\\Shared\\JSI.Shared.vcxitems*{0cc28589-39e4-4288-b162-97b959f8b843}*SharedItemsImports = 9\r\n\t\t..\\node_modules\\react-native-windows\\Shared\\Shared.vcxitems*{2049dbe9-8d13-42c9-ae4b-413ae38fffd0}*SharedItemsImports = 9\r\n\t\t..\\node_modules\\react-native-windows\\Mso\\Mso.vcxitems*{84e05bfa-cbaf-4f0d-bfb6-4ce85742a57e}*SharedItemsImports = 9\r\n\t\t..\\node_modules\\react-native-windows\\JSI\\Shared\\JSI.Shared.vcxitems*{a62d504a-16b8-41d2-9f19-e2e86019e5e4}*SharedItemsImports = 4\r\n\t\t..\\node_modules\\react-native-windows\\Chakra\\Chakra.vcxitems*{c38970c0-5fbf-4d69-90d8-cbac225ae895}*SharedItemsImports = 9\r\n\t\t..\\node_modules\\react-native-windows\\Microsoft.ReactNative.Cxx\\Microsoft.ReactNative.Cxx.vcxitems*{da8b35b3-da00-4b02-bde6-6a397b3fd46b}*SharedItemsImports = 9\r\n\t\t..\\node_modules\\react-native-windows\\include\\Include.vcxitems*{ef074ba1-2d54-4d49-a28e-5e040b47cd2e}*SharedItemsImports = 9\r\n\t\t..\\node_modules\\react-native-windows\\Chakra\\Chakra.vcxitems*{f7d32bd0-2749-483e-9a0d-1635ef7e3136}*SharedItemsImports = 4\r\n\t\t..\\node_modules\\react-native-windows\\Microsoft.ReactNative.Cxx\\Microsoft.ReactNative.Cxx.vcxitems*{f7d32bd0-2749-483e-9a0d-1635ef7e3136}*SharedItemsImports = 4\r\n\t\t..\\node_modules\\react-native-windows\\Mso\\Mso.vcxitems*{f7d32bd0-2749-483e-9a0d-1635ef7e3136}*SharedItemsImports = 4\r\n\t\t..\\node_modules\\react-native-windows\\Shared\\Shared.vcxitems*{f7d32bd0-2749-483e-9a0d-1635ef7e3136}*SharedItemsImports = 4\r\n\tEndGlobalSection\r\n\tGlobalSection(SolutionConfigurationPlatforms) = preSolution\r\n\t\tDebug|ARM = Debug|ARM\r\n\t\tDebug|ARM64 = Debug|ARM64\r\n\t\tDebug|x64 = Debug|x64\r\n\t\tDebug|x86 = Debug|x86\r\n\t\tRelease|ARM = Release|ARM\r\n\t\tRelease|ARM64 = Release|ARM64\r\n\t\tRelease|x64 = Release|x64\r\n\t\tRelease|x86 = Release|x86\r\n\tEndGlobalSection\r\n\tGlobalSection(ProjectConfigurationPlatforms) = postSolution\r\n\t\t{8FE8EAE3-A280-472D-9DB2-E3FA4F303E81}.Debug|ARM.ActiveCfg = Debug|ARM\r\n\t\t{8FE8EAE3-A280-472D-9DB2-E3FA4F303E81}.Debug|ARM.Build.0 = Debug|ARM\r\n\t\t{8FE8EAE3-A280-472D-9DB2-E3FA4F303E81}.Debug|ARM.Deploy.0 = Debug|ARM\r\n\t\t{8FE8EAE3-A280-472D-9DB2-E3FA4F303E81}.Debug|ARM64.ActiveCfg = Debug|ARM64\r\n\t\t{8FE8EAE3-A280-472D-9DB2-E3FA4F303E81}.Debug|ARM64.Build.0 = Debug|ARM64\r\n\t\t{8FE8EAE3-A280-472D-9DB2-E3FA4F303E81}.Debug|ARM64.Deploy.0 = Debug|ARM64\r\n\t\t{8FE8EAE3-A280-472D-9DB2-E3FA4F303E81}.Debug|x64.ActiveCfg = Debug|x64\r\n\t\t{8FE8EAE3-A280-472D-9DB2-E3FA4F303E81}.Debug|x64.Build.0 = Debug|x64\r\n\t\t{8FE8EAE3-A280-472D-9DB2-E3FA4F303E81}.Debug|x64.Deploy.0 = Debug|x64\r\n\t\t{8FE8EAE3-A280-472D-9DB2-E3FA4F303E81}.Debug|x86.ActiveCfg = Debug|Win32\r\n\t\t{8FE8EAE3-A280-472D-9DB2-E3FA4F303E81}.Debug|x86.Build.0 = Debug|Win32\r\n\t\t{8FE8EAE3-A280-472D-9DB2-E3FA4F303E81}.Debug|x86.Deploy.0 = Debug|Win32\r\n\t\t{8FE8EAE3-A280-472D-9DB2-E3FA4F303E81}.Release|ARM.ActiveCfg = Release|ARM\r\n\t\t{8FE8EAE3-A280-472D-9DB2-E3FA4F303E81}.Release|ARM.Build.0 = Release|ARM\r\n\t\t{8FE8EAE3-A280-472D-9DB2-E3FA4F303E81}.Release|ARM.Deploy.0 = Release|ARM\r\n\t\t{8FE8EAE3-A280-472D-9DB2-E3FA4F303E81}.Release|ARM64.ActiveCfg = Release|ARM64\r\n\t\t{8FE8EAE3-A280-472D-9DB2-E3FA4F303E81}.Release|ARM64.Build.0 = Release|ARM64\r\n\t\t{8FE8EAE3-A280-472D-9DB2-E3FA4F303E81}.Release|ARM64.Deploy.0 = Release|ARM64\r\n\t\t{8FE8EAE3-A280-472D-9DB2-E3FA4F303E81}.Release|x64.ActiveCfg = Release|x64\r\n\t\t{8FE8EAE3-A280-472D-9DB2-E3FA4F303E81}.Release|x64.Build.0 = Release|x64\r\n\t\t{8FE8EAE3-A280-472D-9DB2-E3FA4F303E81}.Release|x64.Deploy.0 = Release|x64\r\n\t\t{8FE8EAE3-A280-472D-9DB2-E3FA4F303E81}.Release|x86.ActiveCfg = Release|Win32\r\n\t\t{8FE8EAE3-A280-472D-9DB2-E3FA4F303E81}.Release|x86.Build.0 = Release|Win32\r\n\t\t{8FE8EAE3-A280-472D-9DB2-E3FA4F303E81}.Release|x86.Deploy.0 = Release|Win32\r\n\t\t{A990658C-CE31-4BCC-976F-0FC6B1AF693D}.Debug|ARM.ActiveCfg = Debug|ARM\r\n\t\t{A990658C-CE31-4BCC-976F-0FC6B1AF693D}.Debug|ARM.Build.0 = Debug|ARM\r\n\t\t{A990658C-CE31-4BCC-976F-0FC6B1AF693D}.Debug|ARM64.ActiveCfg = Debug|ARM64\r\n\t\t{A990658C-CE31-4BCC-976F-0FC6B1AF693D}.Debug|ARM64.Build.0 = Debug|ARM64\r\n\t\t{A990658C-CE31-4BCC-976F-0FC6B1AF693D}.Debug|x64.ActiveCfg = Debug|x64\r\n\t\t{A990658C-CE31-4BCC-976F-0FC6B1AF693D}.Debug|x64.Build.0 = Debug|x64\r\n\t\t{A990658C-CE31-4BCC-976F-0FC6B1AF693D}.Debug|x86.ActiveCfg = Debug|Win32\r\n\t\t{A990658C-CE31-4BCC-976F-0FC6B1AF693D}.Debug|x86.Build.0 = Debug|Win32\r\n\t\t{A990658C-CE31-4BCC-976F-0FC6B1AF693D}.Release|ARM.ActiveCfg = Release|ARM\r\n\t\t{A990658C-CE31-4BCC-976F-0FC6B1AF693D}.Release|ARM.Build.0 = Release|ARM\r\n\t\t{A990658C-CE31-4BCC-976F-0FC6B1AF693D}.Release|ARM64.ActiveCfg = Release|ARM64\r\n\t\t{A990658C-CE31-4BCC-976F-0FC6B1AF693D}.Release|ARM64.Build.0 = Release|ARM64\r\n\t\t{A990658C-CE31-4BCC-976F-0FC6B1AF693D}.Release|x64.ActiveCfg = Release|x64\r\n\t\t{A990658C-CE31-4BCC-976F-0FC6B1AF693D}.Release|x64.Build.0 = Release|x64\r\n\t\t{A990658C-CE31-4BCC-976F-0FC6B1AF693D}.Release|x86.ActiveCfg = Release|Win32\r\n\t\t{A990658C-CE31-4BCC-976F-0FC6B1AF693D}.Release|x86.Build.0 = Release|Win32\r\n\t\t{A9D95A91-4DB7-4F72-BEB6-FE8A5C89BFBD}.Debug|ARM.ActiveCfg = Debug|ARM\r\n\t\t{A9D95A91-4DB7-4F72-BEB6-FE8A5C89BFBD}.Debug|ARM.Build.0 = Debug|ARM\r\n\t\t{A9D95A91-4DB7-4F72-BEB6-FE8A5C89BFBD}.Debug|ARM64.ActiveCfg = Debug|ARM64\r\n\t\t{A9D95A91-4DB7-4F72-BEB6-FE8A5C89BFBD}.Debug|ARM64.Build.0 = Debug|ARM64\r\n\t\t{A9D95A91-4DB7-4F72-BEB6-FE8A5C89BFBD}.Debug|x64.ActiveCfg = Debug|x64\r\n\t\t{A9D95A91-4DB7-4F72-BEB6-FE8A5C89BFBD}.Debug|x64.Build.0 = Debug|x64\r\n\t\t{A9D95A91-4DB7-4F72-BEB6-FE8A5C89BFBD}.Debug|x86.ActiveCfg = Debug|Win32\r\n\t\t{A9D95A91-4DB7-4F72-BEB6-FE8A5C89BFBD}.Debug|x86.Build.0 = Debug|Win32\r\n\t\t{A9D95A91-4DB7-4F72-BEB6-FE8A5C89BFBD}.Release|ARM.ActiveCfg = Release|ARM\r\n\t\t{A9D95A91-4DB7-4F72-BEB6-FE8A5C89BFBD}.Release|ARM.Build.0 = Release|ARM\r\n\t\t{A9D95A91-4DB7-4F72-BEB6-FE8A5C89BFBD}.Release|ARM64.ActiveCfg = Release|ARM64\r\n\t\t{A9D95A91-4DB7-4F72-BEB6-FE8A5C89BFBD}.Release|ARM64.Build.0 = Release|ARM64\r\n\t\t{A9D95A91-4DB7-4F72-BEB6-FE8A5C89BFBD}.Release|x64.ActiveCfg = Release|x64\r\n\t\t{A9D95A91-4DB7-4F72-BEB6-FE8A5C89BFBD}.Release|x64.Build.0 = Release|x64\r\n\t\t{A9D95A91-4DB7-4F72-BEB6-FE8A5C89BFBD}.Release|x86.ActiveCfg = Release|Win32\r\n\t\t{A9D95A91-4DB7-4F72-BEB6-FE8A5C89BFBD}.Release|x86.Build.0 = Release|Win32\r\n\t\t{F7D32BD0-2749-483E-9A0D-1635EF7E3136}.Debug|ARM.ActiveCfg = Debug|ARM\r\n\t\t{F7D32BD0-2749-483E-9A0D-1635EF7E3136}.Debug|ARM.Build.0 = Debug|ARM\r\n\t\t{F7D32BD0-2749-483E-9A0D-1635EF7E3136}.Debug|ARM64.ActiveCfg = Debug|ARM64\r\n\t\t{F7D32BD0-2749-483E-9A0D-1635EF7E3136}.Debug|ARM64.Build.0 = Debug|ARM64\r\n\t\t{F7D32BD0-2749-483E-9A0D-1635EF7E3136}.Debug|x64.ActiveCfg = Debug|x64\r\n\t\t{F7D32BD0-2749-483E-9A0D-1635EF7E3136}.Debug|x64.Build.0 = Debug|x64\r\n\t\t{F7D32BD0-2749-483E-9A0D-1635EF7E3136}.Debug|x86.ActiveCfg = Debug|Win32\r\n\t\t{F7D32BD0-2749-483E-9A0D-1635EF7E3136}.Debug|x86.Build.0 = Debug|Win32\r\n\t\t{F7D32BD0-2749-483E-9A0D-1635EF7E3136}.Release|ARM.ActiveCfg = Release|ARM\r\n\t\t{F7D32BD0-2749-483E-9A0D-1635EF7E3136}.Release|ARM.Build.0 = Release|ARM\r\n\t\t{F7D32BD0-2749-483E-9A0D-1635EF7E3136}.Release|ARM64.ActiveCfg = Release|ARM64\r\n\t\t{F7D32BD0-2749-483E-9A0D-1635EF7E3136}.Release|ARM64.Build.0 = Release|ARM64\r\n\t\t{F7D32BD0-2749-483E-9A0D-1635EF7E3136}.Release|x64.ActiveCfg = Release|x64\r\n\t\t{F7D32BD0-2749-483E-9A0D-1635EF7E3136}.Release|x64.Build.0 = Release|x64\r\n\t\t{F7D32BD0-2749-483E-9A0D-1635EF7E3136}.Release|x86.ActiveCfg = Release|Win32\r\n\t\t{F7D32BD0-2749-483E-9A0D-1635EF7E3136}.Release|x86.Build.0 = Release|Win32\r\n\t\t{A62D504A-16B8-41D2-9F19-E2E86019E5E4}.Debug|ARM.ActiveCfg = Debug|ARM\r\n\t\t{A62D504A-16B8-41D2-9F19-E2E86019E5E4}.Debug|ARM.Build.0 = Debug|ARM\r\n\t\t{A62D504A-16B8-41D2-9F19-E2E86019E5E4}.Debug|ARM64.ActiveCfg = Debug|ARM64\r\n\t\t{A62D504A-16B8-41D2-9F19-E2E86019E5E4}.Debug|ARM64.Build.0 = Debug|ARM64\r\n\t\t{A62D504A-16B8-41D2-9F19-E2E86019E5E4}.Debug|x64.ActiveCfg = Debug|x64\r\n\t\t{A62D504A-16B8-41D2-9F19-E2E86019E5E4}.Debug|x64.Build.0 = Debug|x64\r\n\t\t{A62D504A-16B8-41D2-9F19-E2E86019E5E4}.Debug|x86.ActiveCfg = Debug|Win32\r\n\t\t{A62D504A-16B8-41D2-9F19-E2E86019E5E4}.Debug|x86.Build.0 = Debug|Win32\r\n\t\t{A62D504A-16B8-41D2-9F19-E2E86019E5E4}.Release|ARM.ActiveCfg = Release|ARM\r\n\t\t{A62D504A-16B8-41D2-9F19-E2E86019E5E4}.Release|ARM.Build.0 = Release|ARM\r\n\t\t{A62D504A-16B8-41D2-9F19-E2E86019E5E4}.Release|ARM64.ActiveCfg = Release|ARM64\r\n\t\t{A62D504A-16B8-41D2-9F19-E2E86019E5E4}.Release|ARM64.Build.0 = Release|ARM64\r\n\t\t{A62D504A-16B8-41D2-9F19-E2E86019E5E4}.Release|x64.ActiveCfg = Release|x64\r\n\t\t{A62D504A-16B8-41D2-9F19-E2E86019E5E4}.Release|x64.Build.0 = Release|x64\r\n\t\t{A62D504A-16B8-41D2-9F19-E2E86019E5E4}.Release|x86.ActiveCfg = Release|Win32\r\n\t\t{A62D504A-16B8-41D2-9F19-E2E86019E5E4}.Release|x86.Build.0 = Release|Win32\r\n\t\t{FCA38F3C-7C73-4C47-BE4E-32F77FA8538D}.Debug|ARM.ActiveCfg = Debug|ARM\r\n\t\t{FCA38F3C-7C73-4C47-BE4E-32F77FA8538D}.Debug|ARM.Build.0 = Debug|ARM\r\n\t\t{FCA38F3C-7C73-4C47-BE4E-32F77FA8538D}.Debug|ARM64.ActiveCfg = Debug|ARM64\r\n\t\t{FCA38F3C-7C73-4C47-BE4E-32F77FA8538D}.Debug|ARM64.Build.0 = Debug|ARM64\r\n\t\t{FCA38F3C-7C73-4C47-BE4E-32F77FA8538D}.Debug|x64.ActiveCfg = Debug|x64\r\n\t\t{FCA38F3C-7C73-4C47-BE4E-32F77FA8538D}.Debug|x64.Build.0 = Debug|x64\r\n\t\t{FCA38F3C-7C73-4C47-BE4E-32F77FA8538D}.Debug|x86.ActiveCfg = Debug|Win32\r\n\t\t{FCA38F3C-7C73-4C47-BE4E-32F77FA8538D}.Debug|x86.Build.0 = Debug|Win32\r\n\t\t{FCA38F3C-7C73-4C47-BE4E-32F77FA8538D}.Release|ARM.ActiveCfg = Release|ARM\r\n\t\t{FCA38F3C-7C73-4C47-BE4E-32F77FA8538D}.Release|ARM.Build.0 = Release|ARM\r\n\t\t{FCA38F3C-7C73-4C47-BE4E-32F77FA8538D}.Release|ARM64.ActiveCfg = Release|ARM64\r\n\t\t{FCA38F3C-7C73-4C47-BE4E-32F77FA8538D}.Release|ARM64.Build.0 = Release|ARM64\r\n\t\t{FCA38F3C-7C73-4C47-BE4E-32F77FA8538D}.Release|x64.ActiveCfg = Release|x64\r\n\t\t{FCA38F3C-7C73-4C47-BE4E-32F77FA8538D}.Release|x64.Build.0 = Release|x64\r\n\t\t{FCA38F3C-7C73-4C47-BE4E-32F77FA8538D}.Release|x86.ActiveCfg = Release|Win32\r\n\t\t{FCA38F3C-7C73-4C47-BE4E-32F77FA8538D}.Release|x86.Build.0 = Release|Win32\r\n\t\t{F2824844-CE15-4242-9420-308923CD76C3}.Debug|ARM.ActiveCfg = Debug|ARM\r\n\t\t{F2824844-CE15-4242-9420-308923CD76C3}.Debug|ARM.Build.0 = Debug|ARM\r\n\t\t{F2824844-CE15-4242-9420-308923CD76C3}.Debug|ARM64.ActiveCfg = Debug|ARM64\r\n\t\t{F2824844-CE15-4242-9420-308923CD76C3}.Debug|ARM64.Build.0 = Debug|ARM64\r\n\t\t{F2824844-CE15-4242-9420-308923CD76C3}.Debug|x64.ActiveCfg = Debug|x64\r\n\t\t{F2824844-CE15-4242-9420-308923CD76C3}.Debug|x64.Build.0 = Debug|x64\r\n\t\t{F2824844-CE15-4242-9420-308923CD76C3}.Debug|x86.ActiveCfg = Debug|x86\r\n\t\t{F2824844-CE15-4242-9420-308923CD76C3}.Debug|x86.Build.0 = Debug|x86\r\n\t\t{F2824844-CE15-4242-9420-308923CD76C3}.Release|ARM.ActiveCfg = Release|ARM\r\n\t\t{F2824844-CE15-4242-9420-308923CD76C3}.Release|ARM.Build.0 = Release|ARM\r\n\t\t{F2824844-CE15-4242-9420-308923CD76C3}.Release|ARM64.ActiveCfg = Release|ARM64\r\n\t\t{F2824844-CE15-4242-9420-308923CD76C3}.Release|ARM64.Build.0 = Release|ARM64\r\n\t\t{F2824844-CE15-4242-9420-308923CD76C3}.Release|x64.ActiveCfg = Release|x64\r\n\t\t{F2824844-CE15-4242-9420-308923CD76C3}.Release|x64.Build.0 = Release|x64\r\n\t\t{F2824844-CE15-4242-9420-308923CD76C3}.Release|x86.ActiveCfg = Release|x86\r\n\t\t{F2824844-CE15-4242-9420-308923CD76C3}.Release|x86.Build.0 = Release|x86\r\n\t\t{ADED4FBE-887D-4271-AF24-F0823BCE7961}.Debug|ARM.ActiveCfg = Debug|ARM\r\n\t\t{ADED4FBE-887D-4271-AF24-F0823BCE7961}.Debug|ARM.Build.0 = Debug|ARM\r\n\t\t{ADED4FBE-887D-4271-AF24-F0823BCE7961}.Debug|ARM64.ActiveCfg = Debug|ARM64\r\n\t\t{ADED4FBE-887D-4271-AF24-F0823BCE7961}.Debug|ARM64.Build.0 = Debug|ARM64\r\n\t\t{ADED4FBE-887D-4271-AF24-F0823BCE7961}.Debug|x64.ActiveCfg = Debug|x64\r\n\t\t{ADED4FBE-887D-4271-AF24-F0823BCE7961}.Debug|x64.Build.0 = Debug|x64\r\n\t\t{ADED4FBE-887D-4271-AF24-F0823BCE7961}.Debug|x86.ActiveCfg = Debug|x86\r\n\t\t{ADED4FBE-887D-4271-AF24-F0823BCE7961}.Debug|x86.Build.0 = Debug|x86\r\n\t\t{ADED4FBE-887D-4271-AF24-F0823BCE7961}.Release|ARM.ActiveCfg = Release|ARM\r\n\t\t{ADED4FBE-887D-4271-AF24-F0823BCE7961}.Release|ARM.Build.0 = Release|ARM\r\n\t\t{ADED4FBE-887D-4271-AF24-F0823BCE7961}.Release|ARM64.ActiveCfg = Release|ARM64\r\n\t\t{ADED4FBE-887D-4271-AF24-F0823BCE7961}.Release|ARM64.Build.0 = Release|ARM64\r\n\t\t{ADED4FBE-887D-4271-AF24-F0823BCE7961}.Release|x64.ActiveCfg = Release|x64\r\n\t\t{ADED4FBE-887D-4271-AF24-F0823BCE7961}.Release|x64.Build.0 = Release|x64\r\n\t\t{ADED4FBE-887D-4271-AF24-F0823BCE7961}.Release|x86.ActiveCfg = Release|x86\r\n\t\t{ADED4FBE-887D-4271-AF24-F0823BCE7961}.Release|x86.Build.0 = Release|x86\r\n\tEndGlobalSection\r\n\tGlobalSection(SolutionProperties) = preSolution\r\n\t\tHideSolutionNode = FALSE\r\n\tEndGlobalSection\r\n\tGlobalSection(NestedProjects) = preSolution\r\n\t\t{A990658C-CE31-4BCC-976F-0FC6B1AF693D} = {5EA20F54-880A-49F3-99FA-4B3FE54E8AB1}\r\n\t\t{A9D95A91-4DB7-4F72-BEB6-FE8A5C89BFBD} = {5EA20F54-880A-49F3-99FA-4B3FE54E8AB1}\r\n\t\t{C38970C0-5FBF-4D69-90D8-CBAC225AE895} = {5EA20F54-880A-49F3-99FA-4B3FE54E8AB1}\r\n\t\t{F7D32BD0-2749-483E-9A0D-1635EF7E3136} = {5EA20F54-880A-49F3-99FA-4B3FE54E8AB1}\r\n\t\t{0CC28589-39E4-4288-B162-97B959F8B843} = {5EA20F54-880A-49F3-99FA-4B3FE54E8AB1}\r\n\t\t{A62D504A-16B8-41D2-9F19-E2E86019E5E4} = {5EA20F54-880A-49F3-99FA-4B3FE54E8AB1}\r\n\t\t{DA8B35B3-DA00-4B02-BDE6-6A397B3FD46B} = {5EA20F54-880A-49F3-99FA-4B3FE54E8AB1}\r\n\t\t{FCA38F3C-7C73-4C47-BE4E-32F77FA8538D} = {5EA20F54-880A-49F3-99FA-4B3FE54E8AB1}\r\n\t\t{2049DBE9-8D13-42C9-AE4B-413AE38FFFD0} = {5EA20F54-880A-49F3-99FA-4B3FE54E8AB1}\r\n\t\t{84E05BFA-CBAF-4F0D-BFB6-4CE85742A57E} = {5EA20F54-880A-49F3-99FA-4B3FE54E8AB1}\r\n\t\t{EF074BA1-2D54-4D49-A28E-5E040B47CD2E} = {5EA20F54-880A-49F3-99FA-4B3FE54E8AB1}\r\n\t\t{F2824844-CE15-4242-9420-308923CD76C3} = {5EA20F54-880A-49F3-99FA-4B3FE54E8AB1}\r\n\t\t{ADED4FBE-887D-4271-AF24-F0823BCE7961} = {5EA20F54-880A-49F3-99FA-4B3FE54E8AB1}\r\n\tEndGlobalSection\r\n\tGlobalSection(ExtensibilityGlobals) = postSolution\r\n\t\tSolutionGuid = {D43FAD39-F619-437D-BB40-04A3982ACB6A}\r\n\tEndGlobalSection\r\nEndGlobal\r\n"
  },
  {
    "path": "example/storybook/.gitignore",
    "content": "# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.\n\n# dependencies\n/node_modules\n/.pnp\n.pnp.js\n\n# testing\n/coverage\n\n# production\n/build\n\n# misc\n.DS_Store\n.env.local\n.env.development.local\n.env.test.local\n.env.production.local\n\nnpm-debug.log*\nyarn-debug.log*\nyarn-error.log*\n"
  },
  {
    "path": "example/storybook/.storybook/main.js",
    "content": "module.exports = {\n  stories: ['../src/**/*.stories.mdx', '../src/**/*.stories.@(js|jsx|ts|tsx)'],\n  addons: ['@storybook/addon-links', '@storybook/addon-essentials'],\n};\n"
  },
  {
    "path": "example/storybook/.storybook/preview.js",
    "content": "import { useEffect, Suspense } from 'react';\nimport { I18nextProvider } from 'react-i18next';\n\nimport i18n from '../src/i18n';\n\n// Create a global variable called locale in storybook\n// and add a dropdown in the toolbar to change your locale\nexport const globalTypes = {\n  locale: {\n    name: 'Locale',\n    description: 'Internationalization locale',\n    toolbar: {\n      icon: 'globe',\n      items: [\n        { value: 'en', right: '🇺🇸', title: 'English' },\n        { value: 'de', right: '🇩🇪', title: 'Deutsch' },\n        { value: 'ar', right: '🇦🇪', title: 'عربي' },\n      ],\n      showName: true,\n    },\n  },\n};\n\n// When The language changes, set the document direction\ni18n.on('languageChanged', (locale) => {\n  const direction = i18n.dir(locale);\n  document.dir = direction;\n});\n\n// Wrap your stories in the I18nextProvider component\nconst i18nextStoryDecorator = (Story, context) => {\n  const { locale } = context.globals;\n\n  // When the locale global changes\n  // Set the new locale in i18n\n  useEffect(() => {\n    i18n.changeLanguage(locale);\n  }, [locale]);\n\n  return (\n    // here catches the suspense from components not yet ready (still loading translations)\n    // alternative set useSuspense false on i18next.options.react when initializing i18next\n    <Suspense fallback={<div>loading translations...</div>}>\n      <I18nextProvider i18n={i18n}>\n        <Story />\n      </I18nextProvider>\n    </Suspense>\n  );\n};\n\n// export decorators for storybook to wrap your stories in\nexport const decorators = [i18nextStoryDecorator];\n"
  },
  {
    "path": "example/storybook/README.md",
    "content": "# react-i18next in Storybook\n\nThis is an example application using `react-i18next` in Storybook including a menu in the toolbar to change the\nlocale of your stories.\n\n![Storybook example](./docs/storybook-example.gif)\n\n## 🏁 Getting started\n\n```bash\n# Install dependencies\nyarn install\n\n# Start the React app\nyarn start\n\n# Start Storybook\nyarn storybook\n```\n"
  },
  {
    "path": "example/storybook/package.json",
    "content": "{\n  \"name\": \"storybook\",\n  \"version\": \"0.1.0\",\n  \"private\": true,\n  \"dependencies\": {\n    \"i18next\": \"20.3.1\",\n    \"i18next-browser-languagedetector\": \"6.1.1\",\n    \"i18next-http-backend\": \"1.2.6\",\n    \"react\": \"^17.0.2\",\n    \"react-dom\": \"^17.0.2\",\n    \"react-i18next\": \"^11.10.0\",\n    \"react-scripts\": \"4.0.3\"\n  },\n  \"scripts\": {\n    \"start\": \"react-scripts start\",\n    \"build\": \"react-scripts build\",\n    \"test\": \"react-scripts test\",\n    \"eject\": \"react-scripts eject\",\n    \"storybook\": \"start-storybook -p 9009 -s public\",\n    \"build-storybook\": \"build-storybook -s public\"\n  },\n  \"eslintConfig\": {\n    \"extends\": \"react-app\"\n  },\n  \"browserslist\": [\n    \">0.2%\",\n    \"not dead\",\n    \"not ie <= 11\",\n    \"not op_mini all\"\n  ],\n  \"devDependencies\": {\n    \"@babel/core\": \"^7.14.3\",\n    \"@storybook/addon-actions\": \"^6.5.10\",\n    \"@storybook/addon-essentials\": \"^6.5.10\",\n    \"@storybook/addon-links\": \"^6.5.10\",\n    \"@storybook/addons\": \"^6.5.10\",\n    \"@storybook/react\": \"^6.5.10\",\n    \"babel-loader\": \"8.1.0\"\n  }\n}\n"
  },
  {
    "path": "example/storybook/public/index.html",
    "content": "<!doctype html>\n<html lang=\"en\">\n  <head>\n    <meta charset=\"utf-8\" />\n    <link rel=\"shortcut icon\" href=\"%PUBLIC_URL%/favicon.ico\" />\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\" />\n    <meta name=\"theme-color\" content=\"#000000\" />\n    <!--\n      manifest.json provides metadata used when your web app is installed on a\n      user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/\n    -->\n    <link rel=\"manifest\" href=\"%PUBLIC_URL%/manifest.json\" />\n    <!--\n      Notice the use of %PUBLIC_URL% in the tags above.\n      It will be replaced with the URL of the `public` folder during the build.\n      Only files inside the `public` folder can be referenced from the HTML.\n\n      Unlike \"/favicon.ico\" or \"favicon.ico\", \"%PUBLIC_URL%/favicon.ico\" will\n      work correctly both with client-side routing and a non-root public URL.\n      Learn how to configure a non-root public URL by running `npm run build`.\n    -->\n    <title>React App</title>\n  </head>\n  <body>\n    <noscript>You need to enable JavaScript to run this app.</noscript>\n    <div id=\"root\"></div>\n    <!--\n      This HTML file is a template.\n      If you open it directly in the browser, you will see an empty page.\n\n      You can add webfonts, meta tags, or analytics to this file.\n      The build step will place the bundled scripts into the <body> tag.\n\n      To begin the development, run `npm start` or `yarn start`.\n      To create a production bundle, use `npm run build` or `yarn build`.\n    -->\n  </body>\n</html>\n"
  },
  {
    "path": "example/storybook/public/locales/ar/translation.json",
    "content": "{\n  \"title\": \"مرحبًا بكم في التفاعل باستخدام رد فعل i18next\",\n  \"description\": {\n    \"part1\": \"للبدء ، قم بتحرير <1> src / App.js </1> وحفظه لإعادة التحميل.\",\n    \"part2\": \"قم بتبديل اللغة بين الإنجليزية والألمانية والعربية باستخدام الأزرار أعلاه.\"\n  }\n}\n"
  },
  {
    "path": "example/storybook/public/locales/de/translation.json",
    "content": "{\n  \"title\": \"Willkommen zu react und react-i18next\",\n  \"description\": {\n    \"part1\": \"Um loszulegen, ändere <1>src/App(DE).js</1> speicheren und neuladen.\",\n    \"part2\": \"Wechseln Sie mit den Schaltflächen oben zwischen Englisch, Deutsch und Arabisch.\"\n  }\n}\n"
  },
  {
    "path": "example/storybook/public/locales/en/translation.json",
    "content": "{\n  \"title\": \"Welcome to react using react-i18next\",\n  \"description\": {\n    \"part1\": \"To get started, edit <1>src/App.js</1> and save to reload.\",\n    \"part2\": \"Switch language between English, German, and Arabic using buttons above.\"\n  }\n}\n"
  },
  {
    "path": "example/storybook/public/manifest.json",
    "content": "{\n  \"short_name\": \"React App\",\n  \"name\": \"Create React App Sample\",\n  \"icons\": [\n    {\n      \"src\": \"favicon.ico\",\n      \"sizes\": \"64x64 32x32 24x24 16x16\",\n      \"type\": \"image/x-icon\"\n    }\n  ],\n  \"start_url\": \".\",\n  \"display\": \"standalone\",\n  \"theme_color\": \"#000000\",\n  \"background_color\": \"#ffffff\"\n}\n"
  },
  {
    "path": "example/storybook/src/App.css",
    "content": ".App {\n  text-align: center;\n}\n\n.App-logo {\n  animation: App-logo-spin infinite 20s linear;\n  height: 40vmin;\n  pointer-events: none;\n}\n\n.App-header {\n  background-color: #282c34;\n  min-height: 50vh;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  font-size: calc(10px + 2vmin);\n  color: white;\n}\n\n.App-link {\n  color: #61dafb;\n}\n\n@keyframes App-logo-spin {\n  from {\n    transform: rotate(0deg);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n}\n"
  },
  {
    "path": "example/storybook/src/App.js",
    "content": "import React, { Component, Suspense } from 'react';\nimport { useTranslation, withTranslation, Trans } from 'react-i18next';\nimport logo from './logo.svg';\nimport './App.css';\n\n// use hoc for class based components\nclass LegacyWelcomeClass extends Component {\n  render() {\n    const { t, i18n } = this.props;\n    return <h2>{t('title')}</h2>;\n  }\n}\nconst Welcome = withTranslation()(LegacyWelcomeClass);\n\n// Component using the Trans component\nfunction MyComponent() {\n  return (\n    <Trans i18nKey=\"description.part1\">\n      To get started, edit <code>src/App.js</code> and save to reload.\n    </Trans>\n  );\n}\n\n// page uses the hook\nfunction Page() {\n  const { t, i18n } = useTranslation();\n\n  const changeLanguage = (lng) => {\n    i18n.changeLanguage(lng);\n  };\n\n  return (\n    <div className=\"App\">\n      <div className=\"App-header\">\n        <img src={logo} className=\"App-logo\" alt=\"logo\" />\n        <Welcome />\n        <button onClick={() => changeLanguage('ar')}>ar</button>\n        <button onClick={() => changeLanguage('de')}>de</button>\n        <button onClick={() => changeLanguage('en')}>en</button>\n      </div>\n      <div className=\"App-intro\">\n        <MyComponent />\n      </div>\n      <div>{t('description.part2')}</div>\n    </div>\n  );\n}\n\n// loading component for suspense fallback\nconst Loader = () => (\n  <div className=\"App\">\n    <img src={logo} className=\"App-logo\" alt=\"logo\" />\n    <div>loading...</div>\n  </div>\n);\n\n// here app catches the suspense from page in case translations are not yet loaded\nexport default function App() {\n  return (\n    <Suspense fallback={<Loader />}>\n      <Page />\n    </Suspense>\n  );\n}\n"
  },
  {
    "path": "example/storybook/src/i18n.js",
    "content": "import i18n from 'i18next';\nimport Backend from 'i18next-http-backend';\nimport LanguageDetector from 'i18next-browser-languagedetector';\nimport { initReactI18next } from 'react-i18next';\n\ni18n\n  // load translation using http -> see /public/locales\n  // learn more: https://github.com/i18next/i18next-http-backend\n  .use(Backend)\n  // detect user language\n  // learn more: https://github.com/i18next/i18next-browser-languageDetector\n  .use(LanguageDetector)\n  // pass the i18n instance to react-i18next.\n  .use(initReactI18next)\n  // init i18next\n  // for all options read: https://www.i18next.com/overview/configuration-options\n  .init({\n    fallbackLng: 'en',\n    debug: true,\n    interpolation: {\n      escapeValue: false, // not needed for react as it escapes by default\n    },\n  });\n\nexport default i18n;\n"
  },
  {
    "path": "example/storybook/src/index.css",
    "content": "body {\n  margin: 0;\n  padding: 0;\n  font-family:\n    -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell',\n    'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n}\n\ncode {\n  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', monospace;\n}\n"
  },
  {
    "path": "example/storybook/src/index.js",
    "content": "import React from 'react';\nimport ReactDOM from 'react-dom';\nimport './index.css';\nimport App from './App';\n\n// import i18n (needs to be bundled ;))\nimport './i18n';\n\nReactDOM.render(<App />, document.getElementById('root'));\n"
  },
  {
    "path": "example/storybook/src/stories/app.stories.js",
    "content": "import React from 'react';\nimport App from '../App';\n\n// for this case we have set i18n.use(initReactI18next) in '../src/i18n' so no I18nextProvicer is needed to pass i18n down via context api\nexport default {\n  title: 'Full App',\n  component: App,\n};\n\nexport const Default = () => <App />;\n\n// learn more:\n// https://react.i18next.com/components/overview#getting-the-t-function\n"
  },
  {
    "path": "example/storybook/src/stories/components.stories.js",
    "content": "import React, { Component, Suspense } from 'react';\nimport { useTranslation, withTranslation, Trans } from 'react-i18next';\n\nclass ClassComponent extends Component {\n  render() {\n    const { t } = this.props;\n    return <h2>{t('title')}</h2>;\n  }\n}\n\nconst ComponentUsingHOC = withTranslation()(ClassComponent);\n\nfunction ComponentUsingHook() {\n  const { t } = useTranslation();\n  return <div>{t('description.part2')}</div>;\n}\n\nfunction ComponentUsingTrans() {\n  return (\n    <Trans i18nKey=\"description.part1\">\n      To get started, edit <code>src/App.js</code> and save to reload.\n    </Trans>\n  );\n}\n\nexport default {\n  title: 'Components',\n};\nexport const Mocking = () => <ClassComponent t={(k) => k} />;\nMocking.storyName = 'Mocking t()';\n\nexport const UsingHOC = () => <ComponentUsingHOC />;\nexport const UsingHook = () => <ComponentUsingHook />;\nexport const UsingTransComponent = () => <ComponentUsingTrans />;\n"
  },
  {
    "path": "example/test-jest/.gitignore",
    "content": "# See https://help.github.com/ignore-files/ for more about ignoring files.\n\n# dependencies\n/node_modules\n\n# testing\n/coverage\n\n# production\n/build\n\n# misc\n.DS_Store\n.env.local\n.env.development.local\n.env.test.local\n.env.production.local\n\nnpm-debug.log*\nyarn-debug.log*\nyarn-error.log*\n"
  },
  {
    "path": "example/test-jest/README.md",
    "content": "### Intro\n\n`./__mocks__` contains the react-i18next mock (mocks translate and Trans; mock other components as needed!!!)\n\n`./src/setupTests.js` sets adapter for using enzyme\n\n`./src/App.test.js` basic test from create-react-app\n`./src/MyComponent.test.js` test using enzyme\n"
  },
  {
    "path": "example/test-jest/package.json",
    "content": "{\n  \"name\": \"test-jest\",\n  \"version\": \"0.1.0\",\n  \"private\": true,\n  \"dependencies\": {\n    \"enzyme\": \"3.11.0\",\n    \"@cfaester/enzyme-adapter-react-18\": \"0.6.0\",\n    \"i18next\": \"22.4.11\",\n    \"i18next-browser-languagedetector\": \"7.0.1\",\n    \"i18next-http-backend\": \"2.1.1\",\n    \"react\": \"18.2.0\",\n    \"react-dom\": \"18.2.0\",\n    \"react-i18next\": \"12.2.0\",\n    \"react-scripts\": \"5.0.1\"\n  },\n  \"scripts\": {\n    \"start\": \"react-scripts start\",\n    \"build\": \"react-scripts build\",\n    \"test\": \"react-scripts test --env=jsdom\",\n    \"eject\": \"react-scripts eject\"\n  }\n}\n"
  },
  {
    "path": "example/test-jest/public/index.html",
    "content": "<!doctype html>\n<html lang=\"en\">\n  <head>\n    <meta charset=\"utf-8\" />\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, shrink-to-fit=no\" />\n    <meta name=\"theme-color\" content=\"#000000\" />\n    <!--\n      manifest.json provides metadata used when your web app is added to the\n      homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/\n    -->\n    <link rel=\"manifest\" href=\"%PUBLIC_URL%/manifest.json\" />\n    <link rel=\"shortcut icon\" href=\"%PUBLIC_URL%/favicon.ico\" />\n    <!--\n      Notice the use of %PUBLIC_URL% in the tags above.\n      It will be replaced with the URL of the `public` folder during the build.\n      Only files inside the `public` folder can be referenced from the HTML.\n\n      Unlike \"/favicon.ico\" or \"favicon.ico\", \"%PUBLIC_URL%/favicon.ico\" will\n      work correctly both with client-side routing and a non-root public URL.\n      Learn how to configure a non-root public URL by running `npm run build`.\n    -->\n    <title>React App</title>\n  </head>\n  <body>\n    <noscript>You need to enable JavaScript to run this app.</noscript>\n    <div id=\"root\"></div>\n    <!--\n      This HTML file is a template.\n      If you open it directly in the browser, you will see an empty page.\n\n      You can add webfonts, meta tags, or analytics to this file.\n      The build step will place the bundled scripts into the <body> tag.\n\n      To begin the development, run `npm start` or `yarn start`.\n      To create a production bundle, use `npm run build` or `yarn build`.\n    -->\n  </body>\n</html>\n"
  },
  {
    "path": "example/test-jest/public/locales/de/translations.json",
    "content": "{\n  \"title\": \"Willkommen zu react und react-i18next\",\n  \"description\": {\n    \"part1\": \"Um loszulegen, ändere <1>src/App(DE).js</1> speicheren und neuladen.\",\n    \"part2\": \"Ändere die Sprachen zwischen deutsch und englisch mit Hilfe der beiden Schalter.\"\n  }\n}\n"
  },
  {
    "path": "example/test-jest/public/locales/en/translations.json",
    "content": "{\n  \"title\": \"Welcome to react using react-i18next\",\n  \"description\": {\n    \"part1\": \"To get started, edit <1>src/App.js</1> and save to reload.\",\n    \"part2\": \"Switch language between english and german using buttons above.\"\n  }\n}\n"
  },
  {
    "path": "example/test-jest/public/manifest.json",
    "content": "{\n  \"short_name\": \"React App\",\n  \"name\": \"Create React App Sample\",\n  \"icons\": [\n    {\n      \"src\": \"favicon.ico\",\n      \"sizes\": \"64x64 32x32 24x24 16x16\",\n      \"type\": \"image/x-icon\"\n    }\n  ],\n  \"start_url\": \"./index.html\",\n  \"display\": \"standalone\",\n  \"theme_color\": \"#000000\",\n  \"background_color\": \"#ffffff\"\n}\n"
  },
  {
    "path": "example/test-jest/src/App.css",
    "content": ".App {\n  text-align: center;\n}\n\n.App-logo {\n  animation: App-logo-spin infinite 20s linear;\n  height: 80px;\n}\n\n.App-header {\n  background-color: #222;\n  height: 150px;\n  padding: 20px;\n  color: white;\n}\n\n.App-title {\n  font-size: 1.5em;\n}\n\n.App-intro {\n  font-size: large;\n}\n\n@keyframes App-logo-spin {\n  from {\n    transform: rotate(0deg);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n}\n"
  },
  {
    "path": "example/test-jest/src/App.js",
    "content": "import React, { Component, Suspense } from 'react';\nimport { withTranslation, Trans } from 'react-i18next';\nimport logo from './logo.svg';\nimport './App.css';\n\nimport ComponentUseTranslation from './UseTranslation';\n\nclass AppPage extends Component {\n  render() {\n    const { t, i18n } = this.props;\n\n    const changeLanguage = (lng) => {\n      i18n.changeLanguage(lng);\n    };\n\n    return (\n      <div className=\"App\">\n        <div className=\"App-header\">\n          <img src={logo} className=\"App-logo\" alt=\"logo\" />\n          <h2>{t('title')}</h2>\n          <button onClick={() => changeLanguage('de')}>de</button>\n          <button onClick={() => changeLanguage('en')}>en</button>\n        </div>\n        <div className=\"App-intro\">\n          <Trans i18nKey=\"description.part1\">\n            To get started, edit <code>src/App.js</code> and save to reload.\n          </Trans>\n        </div>\n        <ComponentUseTranslation />\n      </div>\n    );\n  }\n}\n\nconst Page = withTranslation('translations')(AppPage);\n\n// here app catches the suspense from page in case translations are not yet loaded\nexport default function App() {\n  return (\n    <Suspense fallback={<div>loading...</div>}>\n      <Page />\n    </Suspense>\n  );\n}\n"
  },
  {
    "path": "example/test-jest/src/App.test.js",
    "content": "import React from 'react';\nimport { createRoot } from 'react-dom/client';\nimport App from './App';\n\nit('renders without crashing', () => {\n  const root = createRoot(document.createElement('div'));\n  root.render(<App />);\n  root.unmount();\n});\n"
  },
  {
    "path": "example/test-jest/src/Trans.js",
    "content": "import React from 'react';\nimport { useTranslation, Trans } from 'react-i18next';\n\nexport default function CustomComponent() {\n  const { t } = useTranslation();\n\n  return (\n    <div>\n      <Trans t={t}>\n        description.part5 <strong>description.bold</strong>\n      </Trans>\n    </div>\n  );\n}\n"
  },
  {
    "path": "example/test-jest/src/Trans.test.js",
    "content": "import React from 'react';\nimport { mount } from 'enzyme';\nimport ComponentTrans from './Trans';\n\nit('test render', () => {\n  const mounted = mount(<ComponentTrans />);\n\n  // console.log(mounted.debug());\n  expect(mounted.contains(<strong>description.bold</strong>)).toBe(true);\n});\n"
  },
  {
    "path": "example/test-jest/src/Translation.js",
    "content": "import React from 'react';\nimport { Translation } from 'react-i18next';\n\nexport default function CustomComponent() {\n  return <Translation>{(t) => <div>{t('description.part4')}</div>}</Translation>;\n}\n"
  },
  {
    "path": "example/test-jest/src/Translation.test.js",
    "content": "import React from 'react';\nimport { mount } from 'enzyme';\nimport ComponentTranslation from './Translation';\n\nit('test render', () => {\n  const mounted = mount(<ComponentTranslation />);\n\n  // console.log(mounted.debug());\n  expect(mounted.contains(<div>description.part4</div>)).toBe(true);\n});\n"
  },
  {
    "path": "example/test-jest/src/UseTranslation.js",
    "content": "import React from 'react';\nimport { useTranslation } from 'react-i18next';\n\nexport default function CustomComponent() {\n  const { t } = useTranslation();\n\n  return <div>{t('description.part2')}</div>;\n}\n"
  },
  {
    "path": "example/test-jest/src/UseTranslation.test.js",
    "content": "import React from 'react';\nimport { mount } from 'enzyme';\nimport ComponentUseTranslation from './UseTranslation';\n\nit('test render', () => {\n  const mounted = mount(<ComponentUseTranslation />);\n\n  // console.log(mounted.debug());\n  expect(mounted.contains(<div>description.part2</div>)).toBe(true);\n});\n"
  },
  {
    "path": "example/test-jest/src/UseTranslationWithInterpolation.js",
    "content": "import React from 'react';\nimport { useTranslation } from 'react-i18next';\n\nexport default function CustomComponent() {\n  const { t } = useTranslation();\n\n  return <div>{t('some.key', { some: 'variable' })}</div>;\n}\n"
  },
  {
    "path": "example/test-jest/src/UseTranslationWithInterpolation.test.js",
    "content": "import React from 'react';\nimport { mount } from 'enzyme';\nimport UseTranslationWithInterpolation from './UseTranslationWithInterpolation';\nimport { useTranslation } from 'react-i18next';\n\njest.mock('react-i18next', () => ({\n  useTranslation: jest.fn(),\n}));\n\nit('test render', () => {\n  const useTranslationSpy = useTranslation;\n  const tSpy = jest.fn((str) => str);\n  useTranslationSpy.mockReturnValue({\n    t: tSpy,\n    i18n: {\n      changeLanguage: () => new Promise(() => {}),\n    },\n  });\n\n  const mounted = mount(<UseTranslationWithInterpolation />);\n\n  // console.log(mounted.debug());\n  expect(mounted.contains(<div>some.key</div>)).toBe(true);\n\n  // If you want you can also check how the t function has been called,\n  // but basically this is testing your mock and not the actual code.\n  expect(tSpy).toHaveBeenCalledTimes(1);\n  expect(tSpy).toHaveBeenLastCalledWith('some.key', { some: 'variable' });\n});\n"
  },
  {
    "path": "example/test-jest/src/WithTranslation.js",
    "content": "import React from 'react';\nimport { withTranslation } from 'react-i18next';\n\nexport function CustomComponent({ t }) {\n  return <div>{t('description.part3')}</div>;\n}\n\nexport default withTranslation()(CustomComponent);\n"
  },
  {
    "path": "example/test-jest/src/WithTranslation.test.js",
    "content": "import React from 'react';\nimport { mount } from 'enzyme';\nimport ComponentWithTranslation from './WithTranslation';\n\nit('test render', () => {\n  const mounted = mount(<ComponentWithTranslation />);\n\n  // console.log(mounted.debug());\n  expect(mounted.contains(<div>description.part3</div>)).toBe(true);\n});\n"
  },
  {
    "path": "example/test-jest/src/__mocks__/react-i18next.js",
    "content": "const React = require('react');\nconst reactI18next = require('react-i18next');\n\nconst hasChildren = node => node && (node.children || (node.props && node.props.children));\n\nconst getChildren = node =>\n  node && node.children ? node.children : node.props && node.props.children;\n\nconst renderNodes = reactNodes => {\n  if (typeof reactNodes === 'string') {\n    return reactNodes;\n  }\n\n  return Object.keys(reactNodes).map((key, i) => {\n    const child = reactNodes[key];\n    const isElement = React.isValidElement(child);\n\n    if (typeof child === 'string') {\n      return child;\n    }\n    if (hasChildren(child)) {\n      const inner = renderNodes(getChildren(child));\n      return React.cloneElement(child, { ...child.props, key: i }, inner);\n    }\n    if (typeof child === 'object' && !isElement) {\n      return Object.keys(child).reduce((str, childKey) => `${str}${child[childKey]}`, '');\n    }\n\n    return child;\n  });\n};\n\nconst useMock = [k => k, { changeLanguage: () => new Promise(() => {}) }];\nuseMock.t = k => k;\nuseMock.i18n = { changeLanguage: () => new Promise(() => {}) };\n\nmodule.exports = {\n  // this mock makes sure any components using the translate HoC receive the t function as a prop\n  withTranslation: () => Component => props => <Component t={k => k} {...props} />,\n  Trans: ({ children, i18nKey }) => !children ? i18nKey :\n    Array.isArray(children) ? renderNodes(children) : renderNodes([children]),\n  Translation: ({ children }) => children(k => k, { i18n: {} }),\n  useTranslation: () => useMock,\n\n  // mock if needed\n  I18nextProvider: reactI18next.I18nextProvider,\n  initReactI18next: reactI18next.initReactI18next,\n  setDefaults: reactI18next.setDefaults,\n  getDefaults: reactI18next.getDefaults,\n  setI18n: reactI18next.setI18n,\n  getI18n: reactI18next.getI18n,\n};\n"
  },
  {
    "path": "example/test-jest/src/i18n.js",
    "content": "import i18n from 'i18next';\nimport Backend from 'i18next-http-backend';\nimport LanguageDetector from 'i18next-browser-languagedetector';\nimport { initReactI18next } from 'react-i18next';\n\ni18n\n  .use(Backend)\n  .use(LanguageDetector)\n  .use(initReactI18next)\n  .init({\n    fallbackLng: 'en',\n\n    // have a common namespace used around the full app\n    ns: ['translations'],\n    defaultNS: 'translations',\n\n    debug: true,\n\n    interpolation: {\n      escapeValue: false, // not needed for react!!\n    },\n  });\n\nexport default i18n;\n"
  },
  {
    "path": "example/test-jest/src/index.css",
    "content": "body {\n  margin: 0;\n  padding: 0;\n  font-family: sans-serif;\n}\n"
  },
  {
    "path": "example/test-jest/src/index.js",
    "content": "import React from 'react';\nimport { createRoot } from 'react-dom/client';\nimport './index.css';\nimport App from './App';\n\nimport './i18n';\n\nconst root = createRoot(document.getElementById('root'));\nroot.render(<App />);\n"
  },
  {
    "path": "example/test-jest/src/setupTests.js",
    "content": "import Enzyme from 'enzyme';\nimport Adapter from '@cfaester/enzyme-adapter-react-18';\n\n// without stubbing do this:\n// import i18n from 'i18next';\n// import { initReactI18next } from 'react-i18next';\n\n// i18n.use(initReactI18next).init({\n//   lng: 'en',\n//   fallbackLng: 'en',\n\n//   // have a common namespace used around the full app\n//   ns: ['translations'],\n//   defaultNS: 'translations',\n\n//   // debug: true,\n\n//   interpolation: {\n//     escapeValue: false, // not needed for react!!\n//   },\n\n//   resources: { en: { translations: {} } },\n// });\n\nEnzyme.configure({ adapter: new Adapter() });\n"
  },
  {
    "path": "helpers.d.ts",
    "content": "// Internal Helpers\nexport type $Tuple<T> = readonly [T?, ...T[]];\nexport type $Subtract<T extends K, K> = Omit<T, keyof K>;\n"
  },
  {
    "path": "icu.macro.d.mts",
    "content": "export * from './icu.macro.js';\n"
  },
  {
    "path": "icu.macro.d.ts",
    "content": "import { ReactElement } from 'react';\nimport { Trans } from './index.js';\nimport type { Namespace, TypeOptions, i18n, ParseKeys } from 'i18next';\n\nexport { Trans };\n\ntype _DefaultNamespace = TypeOptions['defaultNS'];\ndeclare module 'react-i18next/icu.macro' {\n  export interface PluralSubProps<\n    Key extends ParseKeys<Ns, {}, ''>,\n    Ns extends Namespace = _DefaultNamespace,\n  > {\n    children?: never;\n    i18nKey?: Key;\n    i18n?: i18n;\n    ns?: Ns;\n    count: number;\n    values?: {};\n    zero?: string | ReactElement;\n    one?: string | ReactElement;\n    two?: string | ReactElement;\n    few?: string | ReactElement;\n    many?: string | ReactElement;\n    other: string | ReactElement;\n  }\n\n  type PluralProps<\n    T,\n    Key extends ParseKeys<Ns, {}, ''>,\n    Ns extends Namespace = _DefaultNamespace,\n  > = {\n    [P in keyof T]: P extends keyof PluralSubProps<Key, Ns>\n      ? // support the standard properties of Plural\n        PluralSubProps<Key, Ns>[P]\n      : // this supports infinite $0={..} or $123={..}\n        // technically it also supports $-1={..} and $2.3={..} but we don't need to\n        // worry since that's invalid syntax.\n        P extends `$${number}`\n        ? string | ReactElement\n        : never;\n  };\n\n  interface SelectSubProps {\n    [key: string]: string | ReactElement;\n  }\n\n  interface NoChildren {\n    children?: never;\n  }\n\n  interface SelectRequiredProps<\n    Key extends ParseKeys<Ns, {}, ''>,\n    Ns extends Namespace = _DefaultNamespace,\n  > extends NoChildren {\n    i18nKey?: Key;\n    i18n?: i18n;\n    ns?: Ns;\n    other: string | ReactElement;\n  }\n\n  // defining it this way ensures that `other` is always defined, but allows\n  // unlimited other select types.\n  type SelectProps<\n    Key extends ParseKeys<Ns, {}, ''>,\n    Ns extends Namespace = _DefaultNamespace,\n  > = SelectSubProps & SelectRequiredProps<Key, Ns>;\n\n  function Plural<T, Key extends ParseKeys<Ns, {}, ''>, Ns extends Namespace = _DefaultNamespace>(\n    props: PluralProps<T, Key, Ns> & NoChildren,\n  ): ReactElement;\n\n  function SelectOrdinal<\n    T,\n    Key extends ParseKeys<Ns, {}, ''>,\n    Ns extends Namespace = _DefaultNamespace,\n  >(props: PluralProps<T, Key, Ns> & NoChildren): ReactElement;\n\n  function Select<Key extends ParseKeys<Ns, {}, ''>, Ns extends Namespace = _DefaultNamespace>(\n    props: SelectProps<Key, Ns>,\n  ): ReactElement;\n\n  function date(strings: TemplateStringsArray, variable: Date): string;\n  function time(strings: TemplateStringsArray, variable: Date): string;\n  function number(strings: TemplateStringsArray, variable: number): string;\n\n  type ValidInterpolations = ReactElement | string;\n\n  function plural(\n    strings: TemplateStringsArray,\n    variable: number,\n    ...args: ValidInterpolations[]\n  ): string;\n  function selectOrdinal(\n    strings: TemplateStringsArray,\n    variable: number,\n    ...args: ValidInterpolations[]\n  ): string;\n  function select(\n    strings: TemplateStringsArray,\n    variable: string,\n    ...args: ValidInterpolations[]\n  ): string;\n}\n"
  },
  {
    "path": "icu.macro.js",
    "content": "const { createMacro } = require('babel-plugin-macros');\n\n// copy to:\n// https://astexplorer.net/#/gist/642aebbb9e449e959f4ad8907b4adf3a/4a65742e2a3e926eb55eaa3d657d1472b9ac7970\nmodule.exports = createMacro(ICUMacro);\n\nfunction ICUMacro({ references, state, babel }) {\n  const {\n    Trans = [],\n    Plural = [],\n    Select = [],\n    SelectOrdinal = [],\n    number = [],\n    date = [],\n    select = [],\n    selectOrdinal = [],\n    plural = [],\n    time = [],\n  } = references;\n\n  // assert we have the react-i18next IcuTrans component imported\n  addNeededImports(state, babel, references);\n\n  // transform Plural and SelectOrdinal\n  [...Plural, ...SelectOrdinal].forEach((referencePath) => {\n    if (referencePath.parentPath.type === 'JSXOpeningElement') {\n      pluralAsJSX(\n        referencePath.parentPath,\n        {\n          attributes: referencePath.parentPath.get('attributes'),\n          children: referencePath.parentPath.parentPath.get('children'),\n        },\n        babel,\n      );\n    } else {\n      // throw a helpful error message or something :)\n    }\n  });\n\n  // transform Select\n  Select.forEach((referencePath) => {\n    if (referencePath.parentPath.type === 'JSXOpeningElement') {\n      selectAsJSX(\n        referencePath.parentPath,\n        {\n          attributes: referencePath.parentPath.get('attributes'),\n          children: referencePath.parentPath.parentPath.get('children'),\n        },\n        babel,\n      );\n    } else {\n      // throw a helpful error message or something :)\n    }\n  });\n\n  // transform Trans\n  Trans.forEach((referencePath) => {\n    if (referencePath.parentPath.type === 'JSXOpeningElement') {\n      transAsJSX(\n        referencePath.parentPath,\n        {\n          attributes: referencePath.parentPath.get('attributes'),\n          children: referencePath.parentPath.parentPath.get('children'),\n        },\n        babel,\n      );\n    } else {\n      // throw a helpful error message or something :)\n    }\n  });\n\n  // check for number`` and others outside of <Trans>\n  Object.entries({\n    number,\n    date,\n    time,\n    select,\n    plural,\n    selectOrdinal,\n  }).forEach(([name, node]) => {\n    node.forEach((item) => {\n      let f = item.parentPath;\n      while (f) {\n        if (babel.types.isJSXElement(f.node)) {\n          const { openingElement } = f.node;\n          const elementName = openingElement.name;\n          const isMemberExpression = babel.types.isJSXMemberExpression(elementName);\n\n          if (\n            !isMemberExpression &&\n            (elementName.name === 'IcuTrans' || elementName.name === 'Trans')\n          ) {\n            // this is a valid use of number/date/time/etc.\n            // Check for both IcuTrans (after transformation) and Trans (during transformation)\n            return;\n          }\n        }\n        f = f.parentPath;\n      }\n      const { loc } = item.node;\n      if (!loc) {\n        throw new Error(`\"${name}\\`\\`\" can only be used inside <Trans> in \"unknown file\"`);\n      }\n      throw new Error(\n        `\"${name}\\`\\`\" can only be used inside <Trans> in \"${loc.filename}\" on line ${loc.start.line}`,\n      );\n    });\n  });\n}\n\nfunction pluralAsJSX(parentPath, { attributes }, babel) {\n  const t = babel.types;\n  const toObjectProperty = (name, value) =>\n    t.objectProperty(t.identifier(name), t.identifier(name), false, !value);\n\n  // plural or selectordinal\n  const nodeName = parentPath.node.name.name.toLocaleLowerCase();\n\n  // will need to merge count attribute with existing values attribute in some cases\n  const existingValuesAttribute = findAttribute('values', attributes);\n  const existingValues = existingValuesAttribute\n    ? existingValuesAttribute.node.value.expression.properties\n    : [];\n\n  let componentStartIndex = 0;\n  const extracted = attributes.reduce(\n    (mem, attr) => {\n      if (attr.node.name.name === 'i18nKey') {\n        // copy the i18nKey\n        mem.attributesToCopy.push(attr.node);\n      } else if (attr.node.name.name === 'count') {\n        // take the count for element\n        let exprName = attr.node.value.expression.name;\n        if (!exprName) {\n          exprName = 'count';\n        }\n        if (exprName === 'count') {\n          // if the prop expression name is also \"count\", copy it instead: <Plural count={count} --> <IcuTrans count={count}\n          mem.attributesToCopy.push(attr.node);\n        } else {\n          mem.values.unshift(toObjectProperty(exprName));\n        }\n        mem.defaults = `{${exprName}, ${nodeName}, ${mem.defaults}`;\n      } else if (attr.node.name.name === 'values') {\n        // skip the values attribute, as it has already been processed into mem from existingValues\n      } else if (attr.node.value.type === 'StringLiteral') {\n        // take any string node as plural option\n        let pluralForm = attr.node.name.name;\n        if (pluralForm.indexOf('$') === 0) pluralForm = pluralForm.replace('$', '=');\n        mem.defaults = `${mem.defaults} ${pluralForm} {${attr.node.value.value}}`;\n      } else if (attr.node.value.type === 'JSXExpressionContainer') {\n        // convert any Trans component to plural option extracting any values and components\n        const children = attr.node.value.expression.children || [];\n        const thisTrans = processTrans(children, babel, componentStartIndex);\n\n        let pluralForm = attr.node.name.name;\n        if (pluralForm.indexOf('$') === 0) pluralForm = pluralForm.replace('$', '=');\n\n        mem.defaults = `${mem.defaults} ${pluralForm} {${thisTrans.defaults}}`;\n        mem.components = mem.components.concat(thisTrans.components);\n\n        componentStartIndex += thisTrans.components.length;\n      }\n      return mem;\n    },\n    { attributesToCopy: [], values: existingValues, components: [], defaults: '' },\n  );\n\n  // replace the node with the new IcuTrans\n  parentPath.replaceWith(buildTransElement(extracted, extracted.attributesToCopy, t, true));\n}\n\nfunction selectAsJSX(parentPath, { attributes }, babel) {\n  const t = babel.types;\n  const toObjectProperty = (name, value) =>\n    t.objectProperty(t.identifier(name), t.identifier(name), false, !value);\n\n  // will need to merge switch attribute with existing values attribute\n  const existingValuesAttribute = findAttribute('values', attributes);\n  const existingValues = existingValuesAttribute\n    ? existingValuesAttribute.node.value.expression.properties\n    : [];\n\n  let componentStartIndex = 0;\n\n  const extracted = attributes.reduce(\n    (mem, attr) => {\n      if (attr.node.name.name === 'i18nKey') {\n        // copy the i18nKey\n        mem.attributesToCopy.push(attr.node);\n      } else if (attr.node.name.name === 'switch') {\n        // take the switch for select element\n        let exprName = attr.node.value.expression.name;\n        if (!exprName) {\n          exprName = 'selectKey';\n          mem.values.unshift(t.objectProperty(t.identifier(exprName), attr.node.value.expression));\n        } else {\n          mem.values.unshift(toObjectProperty(exprName));\n        }\n        mem.defaults = `{${exprName}, select, ${mem.defaults}`;\n      } else if (attr.node.name.name === 'values') {\n        // skip the values attribute, as it has already been processed into mem as existingValues\n      } else if (attr.node.value.type === 'StringLiteral') {\n        // take any string node as select option\n        mem.defaults = `${mem.defaults} ${attr.node.name.name} {${attr.node.value.value}}`;\n      } else if (attr.node.value.type === 'JSXExpressionContainer') {\n        // convert any Trans component to select option extracting any values and components\n        const children = attr.node.value.expression.children || [];\n        const thisTrans = processTrans(children, babel, componentStartIndex);\n\n        mem.defaults = `${mem.defaults} ${attr.node.name.name} {${thisTrans.defaults}}`;\n        mem.components = mem.components.concat(thisTrans.components);\n\n        componentStartIndex += thisTrans.components.length;\n      }\n      return mem;\n    },\n    { attributesToCopy: [], values: existingValues, components: [], defaults: '' },\n  );\n\n  // replace the node with the new IcuTrans\n  parentPath.replaceWith(buildTransElement(extracted, extracted.attributesToCopy, t, true));\n}\n\nfunction transAsJSX(parentPath, { attributes, children }, babel) {\n  const defaultsAttr = findAttribute('defaults', attributes);\n  const contentAttr = findAttribute('content', attributes);\n  const componentsAttr = findAttribute('components', attributes);\n  // if there is \"defaults\" attribute and no \"content\"/\"components\" attribute, parse defaults and extract from the parsed defaults instead of children\n  // if a \"content\" or \"components\" attribute has been provided, we assume they have already constructed a valid \"defaults\" and it does not need to be parsed\n  const parseDefaults = defaultsAttr && !contentAttr && !componentsAttr;\n\n  let extracted;\n  if (parseDefaults) {\n    const defaultsExpression = defaultsAttr.node.value.value;\n    const parsed = babel.parse(`<>${defaultsExpression}</>`, {\n      presets: ['@babel/react'],\n      filename: babel.state?.filename || 'unknown',\n    }).program.body[0].expression.children;\n\n    extracted = processTrans(parsed, babel);\n  } else {\n    extracted = processTrans(children, babel);\n  }\n\n  let clonedAttributes = cloneExistingAttributes(attributes);\n  if (parseDefaults) {\n    // remove existing defaults so it can be replaced later with the new parsed defaults\n    clonedAttributes = clonedAttributes.filter((node) => node.name.name !== 'defaults');\n  }\n\n  // replace the node with the new IcuTrans\n  const replacePath = children.length ? children[0].parentPath : parentPath;\n  replacePath.replaceWith(\n    buildTransElement(extracted, clonedAttributes, babel.types, false, !!children.length),\n  );\n}\n\nfunction buildTransElement(\n  extracted,\n  finalAttributes,\n  t,\n  closeDefaults = false,\n  wasElementWithChildren = false,\n) {\n  const nodeName = t.jSXIdentifier('IcuTrans');\n\n  // plural, select open { but do not close it while reduce\n  if (closeDefaults) extracted.defaults += '}';\n\n  // convert JSX elements to declaration objects: { type: Component, props: {...} }\n  const contentDeclarations = extracted.components.map((component) =>\n    jsxElementToDeclaration(component, t),\n  );\n\n  const content = t.arrayExpression(contentDeclarations);\n  const values = t.objectExpression(extracted.values);\n\n  // add generated IcuTrans attributes\n  if (!attributeExistsAlready('defaultTranslation', finalAttributes)) {\n    if (extracted.defaults.includes('\"')) {\n      // wrap defaultTranslation that contains double quotes in expression container\n      finalAttributes.push(\n        t.jSXAttribute(\n          t.jSXIdentifier('defaultTranslation'),\n          t.jSXExpressionContainer(t.stringLiteral(extracted.defaults)),\n        ),\n      );\n    } else {\n      finalAttributes.push(\n        t.jSXAttribute(t.jSXIdentifier('defaultTranslation'), t.stringLiteral(extracted.defaults)),\n      );\n    }\n  }\n\n  if (!attributeExistsAlready('content', finalAttributes))\n    finalAttributes.push(\n      t.jSXAttribute(t.jSXIdentifier('content'), t.jSXExpressionContainer(content)),\n    );\n\n  if (!attributeExistsAlready('values', finalAttributes))\n    finalAttributes.push(\n      t.jSXAttribute(t.jSXIdentifier('values'), t.jSXExpressionContainer(values)),\n    );\n\n  // create selfclosing IcuTrans component\n  const openElement = t.jSXOpeningElement(nodeName, finalAttributes, true);\n  if (!wasElementWithChildren) return openElement;\n\n  return t.jSXElement(openElement, null, [], true);\n}\n\n/**\n * Convert a JSX element to a declaration object: { type: Component, props: {...} }\n */\nfunction jsxElementToDeclaration(jsxElement, t) {\n  // Handle case where jsxElement is not actually a JSXElement\n  if (!jsxElement || !jsxElement.openingElement) {\n    console.error('Invalid JSXElement passed to jsxElementToDeclaration:', jsxElement);\n    return t.objectExpression([t.objectProperty(t.identifier('type'), t.stringLiteral('div'))]);\n  }\n\n  const elementName = jsxElement.openingElement.name;\n\n  // Get the type - either a string for HTML elements or identifier for components\n  let typeValue;\n\n  if (t.isJSXIdentifier(elementName)) {\n    // For HTML elements like 'div', 'strong', use string literal\n    if (elementName.name.toLowerCase() === elementName.name) {\n      typeValue = t.stringLiteral(elementName.name);\n    } else {\n      // For React components, use identifier\n      typeValue = t.identifier(elementName.name);\n    }\n  } else if (t.isJSXMemberExpression(elementName)) {\n    // For member expressions like Icon.Svg\n    const objectName = t.isJSXIdentifier(elementName.object) ? elementName.object.name : 'unknown';\n    const propertyName = elementName.property.name;\n\n    typeValue = t.memberExpression(t.identifier(objectName), t.identifier(propertyName));\n  } else {\n    // Fallback\n    typeValue = t.stringLiteral('div');\n  }\n\n  const properties = [t.objectProperty(t.identifier('type'), typeValue)];\n\n  // Convert JSX attributes to props object\n  const propsProperties = [];\n\n  jsxElement.openingElement.attributes.forEach((attr) => {\n    if (t.isJSXAttribute(attr)) {\n      const propName = t.isJSXIdentifier(attr.name) ? attr.name.name : String(attr.name);\n\n      let propValue;\n\n      if (attr.value === null) {\n        // Boolean prop like <Component disabled />\n        propValue = t.booleanLiteral(true);\n      } else if (t.isStringLiteral(attr.value)) {\n        propValue = attr.value;\n      } else if (t.isJSXExpressionContainer(attr.value)) {\n        propValue = attr.value.expression;\n      } else {\n        // fallback\n        propValue = t.nullLiteral();\n      }\n\n      // Use string literal for keys that aren't valid identifiers (e.g., contain hyphens)\n      const propKey = /^[a-zA-Z_$][a-zA-Z0-9_$]*$/.test(propName)\n        ? t.identifier(propName)\n        : t.stringLiteral(propName);\n\n      propsProperties.push(t.objectProperty(propKey, propValue));\n    } else if (t.isJSXSpreadAttribute(attr)) {\n      // Handle spread attributes like {...spreadProps}\n      propsProperties.push(t.spreadElement(attr.argument));\n    }\n  });\n\n  // Handle nested children if any\n  if (jsxElement.children && jsxElement.children.length > 0) {\n    const childDeclarations = jsxElement.children\n      .filter((child) =>\n        // Only include JSXElements in the declaration tree\n        // JSXText content is already captured in the defaults string\n        t.isJSXElement(child),\n      )\n      .map((child) => jsxElementToDeclaration(child, t));\n\n    if (childDeclarations.length > 0) {\n      propsProperties.push(\n        t.objectProperty(t.identifier('children'), t.arrayExpression(childDeclarations)),\n      );\n    }\n  }\n\n  if (propsProperties.length > 0) {\n    properties.push(t.objectProperty(t.identifier('props'), t.objectExpression(propsProperties)));\n  }\n\n  return t.objectExpression(properties);\n}\n\nfunction cloneExistingAttributes(attributes) {\n  return attributes.reduce((mem, attr) => {\n    const node = attr.node ? attr.node : attr;\n\n    // Skip 'defaults' attribute as we're replacing it with 'defaultTranslation'\n    if (node.type === 'JSXAttribute' && node.name && node.name.name === 'defaults') {\n      return mem;\n    }\n\n    // Skip 'components' attribute as we're replacing it with 'content'\n    if (node.type === 'JSXAttribute' && node.name && node.name.name === 'components') {\n      return mem;\n    }\n\n    mem.push(node);\n    return mem;\n  }, []);\n}\n\nfunction findAttribute(name, attributes) {\n  return attributes.find((child) => {\n    const ele = child.node ? child.node : child;\n    return ele.name.name === name;\n  });\n}\n\nfunction attributeExistsAlready(name, attributes) {\n  return !!findAttribute(name, attributes);\n}\n\nfunction processTrans(children, babel, componentStartIndex = 0) {\n  const res = {};\n\n  res.defaults = mergeChildren(children, babel, componentStartIndex);\n  res.components = getComponents(children, babel);\n  res.values = getValues(children, babel);\n\n  return res;\n}\n\nconst leadingNewLineAndWhitespace = /^\\n\\s+/g;\nconst trailingNewLineAndWhitespace = /\\n\\s+$/g;\nfunction trimIndent(text) {\n  const newText = text\n    .replace(leadingNewLineAndWhitespace, '')\n    .replace(trailingNewLineAndWhitespace, '');\n  return newText;\n}\n\n/**\n * add comma-delimited expressions like `{ val, number }`\n */\nfunction mergeCommaExpressions(ele) {\n  if (ele.expression && ele.expression.expressions) {\n    return `{${ele.expression.expressions\n      .reduce((m, i) => {\n        m.push(i.name || i.value);\n        return m;\n      }, [])\n      .join(', ')}}`;\n  }\n  return '';\n}\n\n/**\n * this is for supporting complex icu type interpolations\n * date`${variable}` and number`{${varName}, ::percent}`\n * also, plural`{${count}, one { ... } other { ... }}\n */\nfunction mergeTaggedTemplateExpressions(ele, componentFoundIndex, t, babel) {\n  if (t.isTaggedTemplateExpression(ele.expression)) {\n    const [, text, index] = getTextAndInterpolatedVariables(\n      ele.expression.tag.name,\n      ele.expression,\n      componentFoundIndex,\n      babel,\n    );\n    return [text, index];\n  }\n  return ['', componentFoundIndex];\n}\n\nfunction mergeChildren(children, babel, componentStartIndex = 0) {\n  const t = babel.types;\n  let componentFoundIndex = componentStartIndex;\n\n  return children.reduce((mem, child) => {\n    const ele = child.node ? child.node : child;\n    let result = mem;\n\n    // add text, but trim indentation whitespace\n    if (t.isJSXText(ele) && ele.value) result += trimIndent(ele.value);\n    // add ?!? forgot\n    if (ele.expression && ele.expression.value) result += ele.expression.value;\n    // add `{ val }`\n    if (ele.expression && ele.expression.name) result += `{${ele.expression.name}}`;\n    // add `{ val, number }`\n    result += mergeCommaExpressions(ele);\n    const [nextText, newIndex] = mergeTaggedTemplateExpressions(ele, componentFoundIndex, t, babel);\n    result += nextText;\n    componentFoundIndex = newIndex;\n    // add <strong>...</strong> with replace to <0>inner string</0>\n    if (t.isJSXElement(ele)) {\n      result += `<${componentFoundIndex}>${mergeChildren(\n        ele.children,\n        babel,\n      )}</${componentFoundIndex}>`;\n      componentFoundIndex += 1;\n    }\n\n    return result;\n  }, '');\n}\n\nconst extractTaggedTemplateValues = (ele, babel, toObjectProperty) => {\n  // date`${variable}` and so on\n  if (ele.expression && ele.expression.type === 'TaggedTemplateExpression') {\n    const [variables] = getTextAndInterpolatedVariables(\n      ele.expression.tag.name,\n      ele.expression,\n      0,\n      babel,\n    );\n    return variables.map((vari) => toObjectProperty(vari));\n  }\n  return [];\n};\n\n/**\n * Extract the names of interpolated value as object properties to pass to IcuTrans\n */\nfunction getValues(children, babel) {\n  const t = babel.types;\n  const toObjectProperty = (name, value) =>\n    t.objectProperty(t.identifier(name), t.identifier(name), false, !value);\n\n  return children.reduce((mem, child) => {\n    const ele = child.node ? child.node : child;\n    let result = mem;\n\n    // add `{ var }` to values\n    if (ele.expression && ele.expression.name) mem.push(toObjectProperty(ele.expression.name));\n    // add `{ var, number }` to values\n    if (ele.expression && ele.expression.expressions)\n      result.push(\n        toObjectProperty(ele.expression.expressions[0].name || ele.expression.expressions[0].value),\n      );\n    // add `{ var: 'bar' }` to values\n    if (ele.expression && ele.expression.properties)\n      result = result.concat(ele.expression.properties);\n    // date`${variable}` and so on\n    result = result.concat(extractTaggedTemplateValues(ele, babel, toObjectProperty));\n    // recursive add inner elements stuff to values\n    if (t.isJSXElement(ele)) {\n      result = result.concat(getValues(ele.children, babel));\n    }\n\n    return result;\n  }, []);\n}\n\n/**\n * Common logic for adding a child element of Trans to the list of components to hydrate the translation\n * @param {JSXElement} jsxElement\n * @param {JSXElement[]} mem\n */\nconst processJSXElement = (jsxElement, mem, t) => {\n  const clone = t.clone(jsxElement);\n  clone.children = clone.children.reduce((clonedMem, clonedChild) => {\n    const clonedEle = clonedChild.node ? clonedChild.node : clonedChild;\n\n    // clean out invalid definitions by replacing `{ catchDate, date, short }` with `{ catchDate }`\n    if (clonedEle.expression && clonedEle.expression.expressions)\n      clonedEle.expression.expressions = [clonedEle.expression.expressions[0]];\n\n    clonedMem.push(clonedChild);\n    return clonedMem;\n  }, []);\n\n  mem.push(jsxElement);\n};\n\n/**\n * Extract the React components to pass to IcuTrans as content\n */\nfunction getComponents(children, babel) {\n  const t = babel.types;\n\n  return children.reduce((mem, child) => {\n    const ele = child.node ? child.node : child;\n\n    if (t.isJSXExpressionContainer(ele)) {\n      // check for date`` and so on\n      if (t.isTaggedTemplateExpression(ele.expression)) {\n        ele.expression.quasi.expressions.forEach((expr) => {\n          // check for sub-expressions. This can happen with plural`` or select`` or selectOrdinal``\n          // these can have nested components\n          if (t.isTaggedTemplateExpression(expr) && expr.quasi.expressions.length) {\n            mem.push(...getComponents(expr.quasi.expressions, babel));\n          }\n          if (!t.isJSXElement(expr)) {\n            // ignore anything that is not a component\n            return;\n          }\n          processJSXElement(expr, mem, t);\n        });\n      }\n    }\n    if (t.isJSXElement(ele)) {\n      processJSXElement(ele, mem, t);\n    }\n\n    return mem;\n  }, []);\n}\n\nconst icuInterpolators = ['date', 'time', 'number', 'plural', 'select', 'selectOrdinal'];\nconst importsToAdd = ['IcuTrans'];\n\n/**\n * helper split out of addNeededImports to make codeclimate happy\n *\n * This does the work of amending an existing import from \"react-i18next\", or\n * creating a new one if it doesn't exist\n */\nfunction addImports(state, existingImport, allImportsToAdd, t) {\n  // append imports to existing or add a new react-i18next import for the IcuTrans and icu tagged template literals\n  if (existingImport) {\n    allImportsToAdd.forEach((name) => {\n      if (\n        existingImport.specifiers.findIndex(\n          (specifier) => specifier.imported && specifier.imported.name === name,\n        ) === -1\n      ) {\n        existingImport.specifiers.push(t.importSpecifier(t.identifier(name), t.identifier(name)));\n      }\n    });\n  } else {\n    state.file.path.node.body.unshift(\n      t.importDeclaration(\n        allImportsToAdd.map((name) => t.importSpecifier(t.identifier(name), t.identifier(name))),\n        t.stringLiteral('react-i18next'),\n      ),\n    );\n  }\n}\n\n/**\n * Add `import { IcuTrans, number, date, <etc.> } from \"react-i18next\"` as needed\n */\nfunction addNeededImports(state, babel, references) {\n  const t = babel.types;\n\n  // check if there is an existing react-i18next import\n  const existingImport = state.file.path.node.body.find(\n    (importNode) =>\n      t.isImportDeclaration(importNode) && importNode.source.value === 'react-i18next',\n  );\n  // check for any of the tagged template literals that are used in the source, and add them\n  const usedRefs = Object.keys(references).filter((importName) => {\n    if (!icuInterpolators.includes(importName)) {\n      return false;\n    }\n    return references[importName].length;\n  });\n\n  // combine IcuTrans + any tagged template literals\n  const allImportsToAdd = importsToAdd.concat(usedRefs);\n\n  addImports(state, existingImport, allImportsToAdd, t);\n}\n\n/**\n * iterate over a node detected inside a tagged template literal\n *\n * This is a helper function for `extractVariableNamesFromQuasiNodes` defined below\n *\n * this is called using reduce as a way of tricking what would be `.map()`\n * into passing in the parameters needed to both modify `componentFoundIndex`,\n * `stringOutput`, and `interpolatedVariableNames`\n * and to pass in the dependencies babel, and type. Type is the template type.\n * For \"date``\" the type will be `date`. for \"number``\" the type is `number`, etc.\n */\nconst extractNestedTemplatesAndComponents = (\n  { componentFoundIndex: lastIndex, babel, stringOutput, type, interpolatedVariableNames },\n  node,\n) => {\n  let componentFoundIndex = lastIndex;\n  if (node.type === 'JSXElement') {\n    // perform the interpolation of components just as we do in a normal Trans setting\n    const subText = `<${componentFoundIndex}>${mergeChildren(\n      node.children,\n      babel,\n    )}</${componentFoundIndex}>`;\n    componentFoundIndex += 1;\n    stringOutput.push(subText);\n  } else if (node.type === 'TaggedTemplateExpression') {\n    // a nested date``/number``/plural`` etc., extract whatever is inside of it\n    const tagName = babel.types.isIdentifier(node.tag) && node.tag.name ? node.tag.name : 'unknown';\n    const [variableNames, childText, newIndex] = getTextAndInterpolatedVariables(\n      tagName,\n      node,\n      componentFoundIndex,\n      babel,\n    );\n    interpolatedVariableNames.push(...variableNames);\n    componentFoundIndex = newIndex;\n    stringOutput.push(childText);\n  } else if (node.type === 'Identifier') {\n    // turn date`${thing}` into `thing, date`\n    const nodeName = node.name || 'unknown';\n    stringOutput.push(`${nodeName}, ${type}`);\n  } else if (node.type === 'TemplateElement') {\n    // convert all whitespace into a single space for the text in the tagged template literal\n    const cookedValue = node.value.cooked || '';\n    stringOutput.push(cookedValue.replace(/\\s+/g, ' '));\n  } else {\n    // unknown node type, ignore\n  }\n  return { componentFoundIndex, babel, stringOutput, type, interpolatedVariableNames };\n};\n\n/**\n * filter the list of nodes within a tagged template literal to the 4 types we can process,\n * and ignore anything else.\n *\n * this is a helper function for `extractVariableNamesFromQuasiNodes`\n */\nconst filterNodes = (node) => {\n  if (node.type === 'Identifier') {\n    // if the node has a name, keep it\n    return node.name;\n  }\n  if (node.type === 'JSXElement' || node.type === 'TaggedTemplateExpression') {\n    // always keep interpolated elements or other tagged template literals like a nested date`` inside a plural``\n    return true;\n  }\n  if (node.type === 'TemplateElement') {\n    // return the \"cooked\" (escaped) text for the text in the template literal (`, ::percent` in number`${varname}, ::percent`)\n    return node.value.cooked;\n  }\n  // unknown node type, ignore\n  return false;\n};\n\nconst errorOnInvalidQuasiNodes = (primaryNode) => {\n  const noInterpolationError = !primaryNode.quasi.expressions.length;\n  const wrongOrderError = primaryNode.quasi.quasis[0].value.raw.length;\n  const tagName = primaryNode.tag.name || 'unknown';\n  const message = `${tagName} argument must be interpolated ${\n    noInterpolationError ? 'in' : 'at the beginning of'\n  } \"${tagName}\\`\\`\" in \"${primaryNode.loc?.filename}\" on line ${primaryNode.loc?.start.line}`;\n  if (noInterpolationError || wrongOrderError) {\n    throw new Error(message);\n  }\n};\n\nconst extractNodeVariableNames = (varNode, babel) => {\n  const interpolatedVariableNames = [];\n  if (varNode.type === 'JSXElement') {\n    // extract inner interpolated variables and add to the list\n    interpolatedVariableNames.push(\n      ...getValues(varNode.children, babel).map((value) => {\n        if (babel.types.isIdentifier(value.value)) {\n          return value.value.name;\n        }\n        return String(value.value);\n      }),\n    );\n  } else if (varNode.type === 'Identifier') {\n    // the name of the interpolated variable\n    interpolatedVariableNames.push(varNode.name);\n  }\n  return interpolatedVariableNames;\n};\n\nconst extractVariableNamesFromQuasiNodes = (primaryNode, babel) => {\n  errorOnInvalidQuasiNodes(primaryNode);\n  // this will contain all the nodes to convert to the ICU messageformat text\n  // at first they are unsorted, but will be ordered correctly at the end of the function\n  const text = [];\n  // the variable names. These are converted to object references as required for the IcuTrans values\n  // in getValues() (toObjectProperty helper function)\n  const interpolatedVariableNames = [];\n  primaryNode.quasi.expressions.forEach((varNode) => {\n    if (\n      !babel.types.isIdentifier(varNode) &&\n      !babel.types.isTaggedTemplateExpression(varNode) &&\n      !babel.types.isJSXElement(varNode)\n    ) {\n      const tagName = primaryNode.tag.name || 'unknown';\n      throw new Error(\n        `Must pass a variable, not an expression to \"${tagName}\\`\\`\" in \"${primaryNode.loc?.filename}\" on line ${primaryNode.loc?.start.line}`,\n      );\n    }\n    text.push(varNode);\n    interpolatedVariableNames.push(...extractNodeVariableNames(varNode, babel));\n  });\n  primaryNode.quasi.quasis.forEach((quasiNode) => {\n    // these are the text surrounding the variable interpolation\n    // so in date`${varname}, short` it would be `''` and `, short`.\n    // (the empty string before `${varname}` and the stuff after it)\n    text.push(quasiNode);\n  });\n  return { text, interpolatedVariableNames };\n};\n\nconst throwOnInvalidType = (type, primaryNode) => {\n  if (!icuInterpolators.includes(type)) {\n    throw new Error(\n      `Unsupported tagged template literal \"${type}\", must be one of date, time, number, plural, select, selectOrdinal in \"${primaryNode.loc?.filename}\" on line ${primaryNode.loc?.start.line}`,\n    );\n  }\n};\n\n/**\n * Retrieve the new text to use, and any interpolated variables\n *\n * This is used to process tagged template literals like date`${variable}` and number`${num}, ::percent`\n *\n * for the data example, it will return text of `{variable, date}` with a variable of `variable`\n * for the number example, it will return text of `{num, number, ::percent}` with a variable of `num`\n * @param {string} type the name of the tagged template (`date`, `number`, `plural`, etc. - any valid complex ICU type)\n * @param {TaggedTemplateExpression} primaryNode the template expression node\n * @param {int} index starting index number of components to be used for interpolations like <0>\n * @param {*} babel\n */\nfunction getTextAndInterpolatedVariables(type, primaryNode, index, babel) {\n  throwOnInvalidType(type, primaryNode);\n  const componentFoundIndex = index;\n  const { text, interpolatedVariableNames } = extractVariableNamesFromQuasiNodes(\n    primaryNode,\n    babel,\n  );\n  const { stringOutput, componentFoundIndex: newIndex } = text\n    .filter(filterNodes)\n    // sort by the order they appear in the source code\n    .sort((a, b) => {\n      const aStart = a.start != null ? a.start : null;\n      const bStart = b.start != null ? b.start : null;\n      if (aStart != null && bStart != null && aStart > bStart) return 1;\n      return -1;\n    })\n    .reduce(extractNestedTemplatesAndComponents, {\n      babel,\n      componentFoundIndex,\n      stringOutput: [],\n      type,\n      interpolatedVariableNames,\n    });\n  return [\n    interpolatedVariableNames,\n    `{${stringOutput.join('')}}`,\n    // return the new component interpolation index\n    newIndex,\n  ];\n}\n"
  },
  {
    "path": "index.d.mts",
    "content": "export * from './index.js';\n"
  },
  {
    "path": "index.d.ts",
    "content": "import type { $Subtract, $Tuple } from './helpers.js';\nimport type {\n  ReactOptions,\n  i18n,\n  Resource,\n  FlatNamespace,\n  Namespace,\n  TypeOptions,\n  TFunction,\n  KeyPrefix,\n  ParseKeys,\n  TOptions,\n} from 'i18next';\nimport * as React from 'react';\nimport {\n  Trans,\n  TransProps,\n  TransSelectorProps,\n  ErrorCode,\n  ErrorArgs,\n} from './TransWithoutContext.js';\nexport { initReactI18next } from './initReactI18next.js';\n\nexport function nodesToString(\n  children: React.ReactNode,\n  i18nOptions?: ReactOptions,\n  i18n?: i18n,\n  i18nKey?: string,\n): string;\n\nexport const TransWithoutContext: typeof Trans;\nexport { Trans, TransProps, TransSelectorProps, ErrorArgs, ErrorCode };\n\n/**\n * Content declaration for IcuTrans component\n * Describes React components as type + props blueprints that will be rendered\n */\nexport interface IcuTransContentDeclaration {\n  type: string | React.ComponentType<any>;\n  props?: {\n    children?: IcuTransContentDeclaration | IcuTransContentDeclaration[];\n    [key: string]: any;\n  };\n}\n\n/**\n * Props for IcuTransWithoutContext component (no React context)\n */\nexport type IcuTransWithoutContextProps<\n  Key extends ParseKeys<Ns, TOpt, KPrefix>,\n  Ns extends Namespace = _DefaultNamespace,\n  KPrefix = undefined,\n  TContext extends string | undefined = undefined,\n  TOpt extends TOptions & { context?: TContext } = { context: TContext },\n> = {\n  /** The i18n key to look up the translation */\n  i18nKey: Key;\n  /** The default translation in ICU format with numbered tags (e.g., \"<0>Click here</0>\") */\n  defaultTranslation: string;\n  /** Declaration tree describing React components and their props */\n  content: IcuTransContentDeclaration[];\n  /** Optional namespace(s) for the translation */\n  ns?: Ns;\n  /** Optional values for ICU variable interpolation */\n  values?: Record<string, any>;\n  /** i18next instance. If not provided, uses global instance */\n  i18n?: i18n;\n  /** Custom translation function */\n  t?: TFunction<Ns, KPrefix>;\n};\n\n/**\n * Props for IcuTrans component (with React context support)\n */\nexport type IcuTransProps<\n  Key extends ParseKeys<Ns, TOpt, KPrefix>,\n  Ns extends Namespace = _DefaultNamespace,\n  KPrefix = undefined,\n  TContext extends string | undefined = undefined,\n  TOpt extends TOptions & { context?: TContext } = { context: TContext },\n> = IcuTransWithoutContextProps<Key, Ns, KPrefix, TContext, TOpt>;\n\n/**\n * IcuTrans component for rendering ICU MessageFormat translations\n * This is the context-aware version that works with I18nextProvider\n *\n * @example\n * ```tsx\n * // Type-safe usage with namespace\n * <IcuTrans<'welcome.message', 'common'>\n *   i18nKey=\"welcome.message\"\n *   defaultTranslation=\"Welcome <0>friend</0>!\"\n *   content={[{ type: 'strong', props: {} }]}\n * />\n * ```\n */\nexport interface IcuTransComponent {\n  <\n    Key extends ParseKeys<Ns, TOpt, KPrefix>,\n    Ns extends Namespace = _DefaultNamespace,\n    KPrefix = undefined,\n    TContext extends string | undefined = undefined,\n    TOpt extends TOptions & { context?: TContext } = { context: TContext },\n  >(\n    props: IcuTransProps<Key, Ns, KPrefix, TContext, TOpt>,\n  ): React.ReactElement;\n}\n\n/**\n * IcuTransWithoutContext component for rendering ICU MessageFormat translations\n * This version does not use React context and requires explicit i18n instance\n *\n * @example\n * ```tsx\n * // Type-safe usage with namespace\n * <IcuTransWithoutContext<'welcome.message', 'common'>\n *   i18nKey=\"welcome.message\"\n *   defaultTranslation=\"Welcome <0>back</0>!\"\n *   content={[{ type: 'strong', props: {} }]}\n *   i18n={i18nInstance}\n * />\n * ```\n */\nexport interface IcuTransWithoutContextComponent {\n  <\n    Key extends ParseKeys<Ns, TOpt, KPrefix>,\n    Ns extends Namespace = _DefaultNamespace,\n    KPrefix = undefined,\n    TContext extends string | undefined = undefined,\n    TOpt extends TOptions & { context?: TContext } = { context: TContext },\n  >(\n    props: IcuTransWithoutContextProps<Key, Ns, KPrefix, TContext, TOpt>,\n  ): React.ReactElement;\n}\n\nexport const IcuTrans: IcuTransComponent;\nexport const IcuTransWithoutContext: IcuTransWithoutContextComponent;\n\nexport function setDefaults(options: ReactOptions): void;\nexport function getDefaults(): ReactOptions;\nexport function setI18n(instance: i18n): void;\nexport function getI18n(): i18n;\nexport function composeInitialProps(ForComponent: any): (ctx: unknown) => Promise<any>;\nexport function getInitialProps(): {\n  initialI18nStore: {\n    [ns: string]: {};\n  };\n  initialLanguage: string;\n};\n\nexport interface ReportNamespaces {\n  addUsedNamespaces(namespaces: Namespace): void;\n  getUsedNamespaces(): string[];\n}\n\ndeclare module 'i18next' {\n  // interface i18n {\n  //   reportNamespaces?: ReportNamespaces;\n  // }\n  interface CustomInstanceExtensions {\n    reportNamespaces?: ReportNamespaces;\n  }\n}\n\ntype ObjectOrNever = TypeOptions['allowObjectInHTMLChildren'] extends true\n  ? Record<string, unknown>\n  : never;\n\ntype ReactI18NextChildren = React.ReactNode | ObjectOrNever;\n\ndeclare module 'react' {\n  namespace JSX {\n    interface IntrinsicAttributes {\n      i18nIsDynamicList?: boolean;\n    }\n  }\n\n  interface HTMLAttributes<T> {\n    // This union is inspired by the typings for React.ReactNode. We do this to fix \"This JSX tag's 'children' prop\n    // expects a single child of type 'ReactI18NextChildren', but multiple children were provided\":\n    // https://github.com/DefinitelyTyped/DefinitelyTyped/blob/5a1e9f91ed0143adede394adb3f540e650455f71/types/react/index.d.ts#L268\n    children?: ReactI18NextChildren | Iterable<ReactI18NextChildren>;\n  }\n}\n\ntype _DefaultNamespace = TypeOptions['defaultNS'];\n\nexport function useSSR(initialI18nStore: Resource, initialLanguage: string): void;\n\n// If the version is earlier than i18next v25.4.0, enableSelector does not exist in TypeOptions, so a conditional type is used to maintain type compatibility.\ntype _EnableSelector = TypeOptions extends { enableSelector: infer U } ? U : false;\n\nexport type UseTranslationOptions<KPrefix> = {\n  i18n?: i18n;\n  useSuspense?: boolean;\n  keyPrefix?: KPrefix;\n  bindI18n?: string | false;\n  nsMode?: 'fallback' | 'default';\n  lng?: string;\n  // other of these options might also work: https://github.com/i18next/i18next/blob/master/index.d.ts#L127\n};\n\nexport type UseTranslationResponse<Ns extends Namespace, KPrefix> = [\n  t: TFunction<Ns, KPrefix>,\n  i18n: i18n,\n  ready: boolean,\n] & {\n  t: TFunction<Ns, KPrefix>;\n  i18n: i18n;\n  ready: boolean;\n};\n\n// Workaround to make code completion to work when suggesting namespaces.\n// This is a typescript limitation when using generics with default values,\n// it'll be addressed in this issue: https://github.com/microsoft/TypeScript/issues/52516\nexport type FallbackNs<Ns> = Ns extends undefined\n  ? _DefaultNamespace\n  : Ns extends Namespace\n    ? Ns\n    : _DefaultNamespace;\n\nexport const useTranslation: _EnableSelector extends true | 'optimize'\n  ? UseTranslationSelector\n  : UseTranslationLegacy;\n\ninterface UseTranslationLegacy {\n  <\n    const Ns extends FlatNamespace | $Tuple<FlatNamespace> | undefined = undefined,\n    const KPrefix extends KeyPrefix<FallbackNs<Ns>> = undefined,\n  >(\n    ns?: Ns,\n    options?: UseTranslationOptions<KPrefix>,\n  ): UseTranslationResponse<FallbackNs<Ns>, KPrefix>;\n}\n\ninterface UseTranslationSelector {\n  <\n    const Ns extends FlatNamespace | $Tuple<FlatNamespace> | undefined = undefined,\n    const KPrefix = undefined,\n  >(\n    ns?: Ns,\n    options?: UseTranslationOptions<KPrefix>,\n  ): UseTranslationResponse<FallbackNs<Ns>, KPrefix>;\n}\n\n// Need to see usage to improve this\nexport function withSSR(): <Props>(WrappedComponent: React.ComponentType<Props>) => {\n  ({\n    initialI18nStore,\n    initialLanguage,\n    ...rest\n  }: {\n    initialI18nStore: Resource;\n    initialLanguage: string;\n  } & Props): React.FunctionComponentElement<Props>;\n  getInitialProps: (ctx: unknown) => Promise<any>;\n};\n\nexport interface WithTranslation<\n  Ns extends FlatNamespace | $Tuple<FlatNamespace> | undefined = undefined,\n  KPrefix extends KeyPrefix<FallbackNs<Ns>> = undefined,\n> {\n  t: TFunction<FallbackNs<Ns>, KPrefix>;\n  i18n: i18n;\n  tReady: boolean;\n}\n\nexport interface WithTranslationProps {\n  i18n?: i18n;\n  useSuspense?: boolean;\n}\n\nexport function withTranslation<\n  Ns extends FlatNamespace | $Tuple<FlatNamespace> | undefined = undefined,\n  KPrefix extends KeyPrefix<FallbackNs<Ns>> = undefined,\n>(\n  ns?: Ns,\n  options?: {\n    withRef?: boolean;\n    keyPrefix?: KPrefix;\n  },\n): <\n  C extends React.ComponentType<React.ComponentProps<any> & WithTranslationProps>,\n  ResolvedProps = React.JSX.LibraryManagedAttributes<\n    C,\n    $Subtract<React.ComponentProps<C>, WithTranslationProps>\n  >,\n>(\n  component: C,\n) => React.ComponentType<Omit<ResolvedProps, keyof WithTranslation<Ns>> & WithTranslationProps>;\n\nexport interface I18nextProviderProps {\n  children?: React.ReactNode;\n  i18n: i18n;\n  defaultNS?: string | string[];\n}\n\nexport const I18nextProvider: React.FunctionComponent<I18nextProviderProps>;\nexport const I18nContext: React.Context<{ i18n: i18n }>;\n\nexport interface TranslationProps<\n  Ns extends FlatNamespace | $Tuple<FlatNamespace> | undefined = undefined,\n  KPrefix extends KeyPrefix<FallbackNs<Ns>> = undefined,\n> {\n  children: (\n    t: TFunction<FallbackNs<Ns>, KPrefix>,\n    options: {\n      i18n: i18n;\n      lng: string;\n    },\n    ready: boolean,\n  ) => React.ReactNode;\n  ns?: Ns;\n  i18n?: i18n;\n  useSuspense?: boolean;\n  keyPrefix?: KPrefix;\n  nsMode?: 'fallback' | 'default';\n}\n\nexport function Translation<\n  Ns extends FlatNamespace | $Tuple<FlatNamespace> | undefined = undefined,\n  KPrefix extends KeyPrefix<FallbackNs<Ns>> = undefined,\n>(props: TranslationProps<Ns, KPrefix>): any;\n"
  },
  {
    "path": "initReactI18next.d.mts",
    "content": "export * from './initReactI18next.js';\n"
  },
  {
    "path": "initReactI18next.d.ts",
    "content": "import type { ThirdPartyModule } from 'i18next';\n\nexport const initReactI18next: ThirdPartyModule;\n"
  },
  {
    "path": "lint-staged.config.mjs",
    "content": "export default {\n  '!*.?(c|m){js,ts}?(x)': ['prettier --write --ignore-unknown'],\n  '*.?(c|m){js,ts}?(x)': ['prettier --write --ignore-unknown', 'eslint --cache --fix --env-info'],\n};\n"
  },
  {
    "path": "package.json",
    "content": "{\n  \"name\": \"react-i18next\",\n  \"version\": \"16.5.8\",\n  \"description\": \"Internationalization for react done right. Using the i18next i18n ecosystem.\",\n  \"main\": \"dist/commonjs/index.js\",\n  \"types\": \"./index.d.mts\",\n  \"jsnext:main\": \"dist/es/index.js\",\n  \"module\": \"dist/es/index.js\",\n  \"keywords\": [\n    \"i18next\",\n    \"internationalization\",\n    \"i18n\",\n    \"translation\",\n    \"localization\",\n    \"l10n\",\n    \"globalization\",\n    \"react\",\n    \"reactjs\"\n  ],\n  \"exports\": {\n    \"./package.json\": \"./package.json\",\n    \".\": {\n      \"types\": {\n        \"require\": \"./index.d.ts\",\n        \"import\": \"./index.d.mts\"\n      },\n      \"module\": \"./dist/es/index.js\",\n      \"import\": \"./dist/es/index.js\",\n      \"require\": \"./dist/commonjs/index.js\",\n      \"default\": \"./dist/es/index.js\"\n    },\n    \"./TransWithoutContext\": {\n      \"types\": {\n        \"require\": \"./TransWithoutContext.d.ts\",\n        \"import\": \"./TransWithoutContext.d.mts\"\n      },\n      \"module\": \"./dist/es/TransWithoutContext.js\",\n      \"import\": \"./dist/es/TransWithoutContext.js\",\n      \"require\": \"./dist/commonjs/TransWithoutContext.js\",\n      \"default\": \"./dist/es/TransWithoutContext.js\"\n    },\n    \"./initReactI18next\": {\n      \"types\": {\n        \"require\": \"./initReactI18next.d.ts\",\n        \"import\": \"./initReactI18next.d.mts\"\n      },\n      \"module\": \"./dist/es/initReactI18next.js\",\n      \"import\": \"./dist/es/initReactI18next.js\",\n      \"require\": \"./dist/commonjs/initReactI18next.js\",\n      \"default\": \"./dist/es/initReactI18next.js\"\n    },\n    \"./icu.macro\": {\n      \"types\": {\n        \"require\": \"./icu.macro.d.ts\",\n        \"import\": \"./icu.macro.d.mts\"\n      },\n      \"module\": \"./icu.macro.js\",\n      \"import\": \"./icu.macro.js\",\n      \"require\": \"./icu.macro.js\",\n      \"default\": \"./icu.macro.js\"\n    }\n  },\n  \"homepage\": \"https://github.com/i18next/react-i18next\",\n  \"bugs\": \"https://github.com/i18next/react-i18next/issues\",\n  \"repository\": {\n    \"type\": \"git\",\n    \"url\": \"https://github.com/i18next/react-i18next.git\"\n  },\n  \"dependencies\": {\n    \"@babel/runtime\": \"^7.28.4\",\n    \"html-parse-stringify\": \"^3.0.1\",\n    \"use-sync-external-store\": \"^1.6.0\"\n  },\n  \"peerDependencies\": {\n    \"i18next\": \">= 25.6.2\",\n    \"react\": \">= 16.8.0\",\n    \"typescript\": \"^5\"\n  },\n  \"peerDependenciesMeta\": {\n    \"react-dom\": {\n      \"optional\": true\n    },\n    \"react-native\": {\n      \"optional\": true\n    },\n    \"typescript\": {\n      \"optional\": true\n    }\n  },\n  \"devDependencies\": {\n    \"@babel/cli\": \"^7.28.3\",\n    \"@babel/core\": \"^7.28.5\",\n    \"@babel/eslint-parser\": \"^7.28.5\",\n    \"@babel/plugin-proposal-async-generator-functions\": \"^7.20.7\",\n    \"@babel/plugin-proposal-object-rest-spread\": \"^7.20.7\",\n    \"@babel/plugin-transform-modules-commonjs\": \"^7.27.1\",\n    \"@babel/plugin-transform-runtime\": \"^7.28.5\",\n    \"@babel/polyfill\": \"^7.12.1\",\n    \"@babel/preset-env\": \"^7.28.5\",\n    \"@babel/preset-react\": \"^7.28.5\",\n    \"@babel/register\": \"^7.28.3\",\n    \"@rollup/plugin-babel\": \"^6.1.0\",\n    \"@rollup/plugin-commonjs\": \"^26.0.3\",\n    \"@rollup/plugin-node-resolve\": \"^15.3.1\",\n    \"@rollup/plugin-replace\": \"^5.0.7\",\n    \"@rollup/plugin-terser\": \"0.4.4\",\n    \"@testing-library/dom\": \"^10.4.1\",\n    \"@testing-library/jest-dom\": \"^6.9.1\",\n    \"@testing-library/react\": \"^16.3.1\",\n    \"@types/jest\": \"^29.5.12\",\n    \"@types/react\": \"^19.2.7\",\n    \"@vitest/coverage-v8\": \"^2.0.5\",\n    \"all-contributors-cli\": \"^6.26.1\",\n    \"babel-core\": \"^7.0.0-bridge.0\",\n    \"babel-plugin-macros\": \"^3.1.0\",\n    \"babel-plugin-tester\": \"^11.0.4\",\n    \"coveralls\": \"^3.1.1\",\n    \"cpy-cli\": \"^5.0.0\",\n    \"cross-env\": \"^7.0.3\",\n    \"eslint\": \"^8.57.0\",\n    \"eslint-config-airbnb\": \"19.0.4\",\n    \"eslint-config-prettier\": \"^9.1.0\",\n    \"eslint-plugin-import\": \"^2.32.0\",\n    \"eslint-plugin-jest-dom\": \"^5.5.0\",\n    \"eslint-plugin-jsx-a11y\": \"^6.10.2\",\n    \"eslint-plugin-react\": \"^7.37.5\",\n    \"eslint-plugin-testing-library\": \"^6.5.0\",\n    \"happy-dom\": \"^14.12.3\",\n    \"husky\": \"^9.1.7\",\n    \"i18next\": \"^25.7.3\",\n    \"lint-staged\": \"^15.5.2\",\n    \"mkdirp\": \"^3.0.1\",\n    \"prettier\": \"^3.7.4\",\n    \"react\": \"^19.2.3\",\n    \"react-dom\": \"^19.2.3\",\n    \"react-test-renderer\": \"^19.2.3\",\n    \"rimraf\": \"^6.1.2\",\n    \"rollup\": \"^4.54.0\",\n    \"typescript\": \"~5.9.3\",\n    \"vitest\": \"^2.0.5\",\n    \"yargs\": \"^17.7.2\"\n  },\n  \"scripts\": {\n    \"clean\": \"rimraf dist && mkdirp dist\",\n    \"lint\": \"eslint --cache .\",\n    \"lint:fix\": \"eslint --cache --fix .\",\n    \"format\": \"prettier . --check\",\n    \"format:fix\": \"prettier . --write --list-different\",\n    \"copy\": \"cpy ./dist/umd/react-i18next.min.js ./dist/umd/react-i18next.js . --flat && echo '{\\\"type\\\":\\\"module\\\"}' > dist/es/package.json\",\n    \"build:es\": \"cross-env BABEL_ENV=ESNext babel src --out-dir dist/es\",\n    \"build:cjs\": \"babel src --out-dir dist/commonjs\",\n    \"build:umd\": \"rollup -c rollup.config.mjs --format umd && rollup -c rollup.config.mjs --format umd --uglify\",\n    \"build:amd\": \"rollup -c rollup.config.mjs --format amd && rollup -c rollup.config.mjs --format amd --uglify\",\n    \"build:iife\": \"rollup -c rollup.config.mjs --format iife && rollup -c rollup.config.mjs --format iife --uglify\",\n    \"build\": \"npm run clean && npm run build:cjs && npm run build:es && npm run build:umd && npm run build:amd && npm run copy\",\n    \"fix_dist_package\": \"node -e 'console.log(`{\\\"type\\\":\\\"module\\\",\\\"version\\\":\\\"${process.env.npm_package_version}\\\"}`)' > dist/es/package.json\",\n    \"preversion\": \"npm run build && git push\",\n    \"postversion\": \"npm run fix_dist_package && git push && git push --tags\",\n    \"test\": \"vitest\",\n    \"test:coverage\": \"npm run test -- --coverage --run\",\n    \"test:typescript\": \"npm run test:typescript:issue-1899 && vitest --workspace vitest.workspace.typescript.mts\",\n    \"test:typescript:issue-1899\": \"bash test/typescript/issue-1899/check-types.sh\",\n    \"contributors:add\": \"all-contributors add\",\n    \"contributors:generate\": \"all-contributors generate\",\n    \"prepare\": \"husky\"\n  },\n  \"author\": \"Jan Mühlemann <jan.muehlemann@gmail.com> (https://github.com/jamuhl)\",\n  \"license\": \"MIT\",\n  \"lock\": false,\n  \"sideEffects\": false,\n  \"packageManager\": \"yarn@1.22.22+sha512.a6b2f7906b721bba3d67d4aff083df04dad64c399707841b7acf00f6b133b7ac24255f2652fa22ae3534329dc6180534e98d17432037ff6fd140556e2bb3137e\"\n}\n"
  },
  {
    "path": "react-i18next.js",
    "content": "(function (global, factory) {\n  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react')) :\n  typeof define === 'function' && define.amd ? define(['exports', 'react'], factory) :\n  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.ReactI18next = {}, global.React));\n})(this, (function (exports, React) { 'use strict';\n\n  const isString$1 = obj => typeof obj === 'string';\n  const defer = () => {\n    let res;\n    let rej;\n    const promise = new Promise((resolve, reject) => {\n      res = resolve;\n      rej = reject;\n    });\n    promise.resolve = res;\n    promise.reject = rej;\n    return promise;\n  };\n  const makeString = object => {\n    if (object == null) return '';\n    return '' + object;\n  };\n  const copy = (a, s, t) => {\n    a.forEach(m => {\n      if (s[m]) t[m] = s[m];\n    });\n  };\n  const lastOfPathSeparatorRegExp = /###/g;\n  const cleanKey = key => key && key.indexOf('###') > -1 ? key.replace(lastOfPathSeparatorRegExp, '.') : key;\n  const canNotTraverseDeeper = object => !object || isString$1(object);\n  const getLastOfPath = (object, path, Empty) => {\n    const stack = !isString$1(path) ? path : path.split('.');\n    let stackIndex = 0;\n    while (stackIndex < stack.length - 1) {\n      if (canNotTraverseDeeper(object)) return {};\n      const key = cleanKey(stack[stackIndex]);\n      if (!object[key] && Empty) object[key] = new Empty();\n      if (Object.prototype.hasOwnProperty.call(object, key)) {\n        object = object[key];\n      } else {\n        object = {};\n      }\n      ++stackIndex;\n    }\n    if (canNotTraverseDeeper(object)) return {};\n    return {\n      obj: object,\n      k: cleanKey(stack[stackIndex])\n    };\n  };\n  const setPath = (object, path, newValue) => {\n    const {\n      obj,\n      k\n    } = getLastOfPath(object, path, Object);\n    if (obj !== undefined || path.length === 1) {\n      obj[k] = newValue;\n      return;\n    }\n    let e = path[path.length - 1];\n    let p = path.slice(0, path.length - 1);\n    let last = getLastOfPath(object, p, Object);\n    while (last.obj === undefined && p.length) {\n      e = `${p[p.length - 1]}.${e}`;\n      p = p.slice(0, p.length - 1);\n      last = getLastOfPath(object, p, Object);\n      if (last?.obj && typeof last.obj[`${last.k}.${e}`] !== 'undefined') {\n        last.obj = undefined;\n      }\n    }\n    last.obj[`${last.k}.${e}`] = newValue;\n  };\n  const pushPath = (object, path, newValue, concat) => {\n    const {\n      obj,\n      k\n    } = getLastOfPath(object, path, Object);\n    obj[k] = obj[k] || [];\n    obj[k].push(newValue);\n  };\n  const getPath = (object, path) => {\n    const {\n      obj,\n      k\n    } = getLastOfPath(object, path);\n    if (!obj) return undefined;\n    if (!Object.prototype.hasOwnProperty.call(obj, k)) return undefined;\n    return obj[k];\n  };\n  const getPathWithDefaults = (data, defaultData, key) => {\n    const value = getPath(data, key);\n    if (value !== undefined) {\n      return value;\n    }\n    return getPath(defaultData, key);\n  };\n  const deepExtend = (target, source, overwrite) => {\n    for (const prop in source) {\n      if (prop !== '__proto__' && prop !== 'constructor') {\n        if (prop in target) {\n          if (isString$1(target[prop]) || target[prop] instanceof String || isString$1(source[prop]) || source[prop] instanceof String) {\n            if (overwrite) target[prop] = source[prop];\n          } else {\n            deepExtend(target[prop], source[prop], overwrite);\n          }\n        } else {\n          target[prop] = source[prop];\n        }\n      }\n    }\n    return target;\n  };\n  const regexEscape = str => str.replace(/[\\-\\[\\]\\/\\{\\}\\(\\)\\*\\+\\?\\.\\\\\\^\\$\\|]/g, '\\\\$&');\n  var _entityMap = {\n    '&': '&amp;',\n    '<': '&lt;',\n    '>': '&gt;',\n    '\"': '&quot;',\n    \"'\": '&#39;',\n    '/': '&#x2F;'\n  };\n  const escape = data => {\n    if (isString$1(data)) {\n      return data.replace(/[&<>\"'\\/]/g, s => _entityMap[s]);\n    }\n    return data;\n  };\n  class RegExpCache {\n    constructor(capacity) {\n      this.capacity = capacity;\n      this.regExpMap = new Map();\n      this.regExpQueue = [];\n    }\n    getRegExp(pattern) {\n      const regExpFromCache = this.regExpMap.get(pattern);\n      if (regExpFromCache !== undefined) {\n        return regExpFromCache;\n      }\n      const regExpNew = new RegExp(pattern);\n      if (this.regExpQueue.length === this.capacity) {\n        this.regExpMap.delete(this.regExpQueue.shift());\n      }\n      this.regExpMap.set(pattern, regExpNew);\n      this.regExpQueue.push(pattern);\n      return regExpNew;\n    }\n  }\n  const chars = [' ', ',', '?', '!', ';'];\n  const looksLikeObjectPathRegExpCache = new RegExpCache(20);\n  const looksLikeObjectPath = (key, nsSeparator, keySeparator) => {\n    nsSeparator = nsSeparator || '';\n    keySeparator = keySeparator || '';\n    const possibleChars = chars.filter(c => nsSeparator.indexOf(c) < 0 && keySeparator.indexOf(c) < 0);\n    if (possibleChars.length === 0) return true;\n    const r = looksLikeObjectPathRegExpCache.getRegExp(`(${possibleChars.map(c => c === '?' ? '\\\\?' : c).join('|')})`);\n    let matched = !r.test(key);\n    if (!matched) {\n      const ki = key.indexOf(keySeparator);\n      if (ki > 0 && !r.test(key.substring(0, ki))) {\n        matched = true;\n      }\n    }\n    return matched;\n  };\n  const deepFind = (obj, path, keySeparator = '.') => {\n    if (!obj) return undefined;\n    if (obj[path]) {\n      if (!Object.prototype.hasOwnProperty.call(obj, path)) return undefined;\n      return obj[path];\n    }\n    const tokens = path.split(keySeparator);\n    let current = obj;\n    for (let i = 0; i < tokens.length;) {\n      if (!current || typeof current !== 'object') {\n        return undefined;\n      }\n      let next;\n      let nextPath = '';\n      for (let j = i; j < tokens.length; ++j) {\n        if (j !== i) {\n          nextPath += keySeparator;\n        }\n        nextPath += tokens[j];\n        next = current[nextPath];\n        if (next !== undefined) {\n          if (['string', 'number', 'boolean'].indexOf(typeof next) > -1 && j < tokens.length - 1) {\n            continue;\n          }\n          i += j - i + 1;\n          break;\n        }\n      }\n      current = next;\n    }\n    return current;\n  };\n  const getCleanedCode = code => code?.replace('_', '-');\n  const consoleLogger = {\n    type: 'logger',\n    log(args) {\n      this.output('log', args);\n    },\n    warn(args) {\n      this.output('warn', args);\n    },\n    error(args) {\n      this.output('error', args);\n    },\n    output(type, args) {\n      console?.[type]?.apply?.(console, args);\n    }\n  };\n  class Logger {\n    constructor(concreteLogger, options = {}) {\n      this.init(concreteLogger, options);\n    }\n    init(concreteLogger, options = {}) {\n      this.prefix = options.prefix || 'i18next:';\n      this.logger = concreteLogger || consoleLogger;\n      this.options = options;\n      this.debug = options.debug;\n    }\n    log(...args) {\n      return this.forward(args, 'log', '', true);\n    }\n    warn(...args) {\n      return this.forward(args, 'warn', '', true);\n    }\n    error(...args) {\n      return this.forward(args, 'error', '');\n    }\n    deprecate(...args) {\n      return this.forward(args, 'warn', 'WARNING DEPRECATED: ', true);\n    }\n    forward(args, lvl, prefix, debugOnly) {\n      if (debugOnly && !this.debug) return null;\n      if (isString$1(args[0])) args[0] = `${prefix}${this.prefix} ${args[0]}`;\n      return this.logger[lvl](args);\n    }\n    create(moduleName) {\n      return new Logger(this.logger, {\n        ...{\n          prefix: `${this.prefix}:${moduleName}:`\n        },\n        ...this.options\n      });\n    }\n    clone(options) {\n      options = options || this.options;\n      options.prefix = options.prefix || this.prefix;\n      return new Logger(this.logger, options);\n    }\n  }\n  var baseLogger = new Logger();\n  class EventEmitter {\n    constructor() {\n      this.observers = {};\n    }\n    on(events, listener) {\n      events.split(' ').forEach(event => {\n        if (!this.observers[event]) this.observers[event] = new Map();\n        const numListeners = this.observers[event].get(listener) || 0;\n        this.observers[event].set(listener, numListeners + 1);\n      });\n      return this;\n    }\n    off(event, listener) {\n      if (!this.observers[event]) return;\n      if (!listener) {\n        delete this.observers[event];\n        return;\n      }\n      this.observers[event].delete(listener);\n    }\n    emit(event, ...args) {\n      if (this.observers[event]) {\n        const cloned = Array.from(this.observers[event].entries());\n        cloned.forEach(([observer, numTimesAdded]) => {\n          for (let i = 0; i < numTimesAdded; i++) {\n            observer(...args);\n          }\n        });\n      }\n      if (this.observers['*']) {\n        const cloned = Array.from(this.observers['*'].entries());\n        cloned.forEach(([observer, numTimesAdded]) => {\n          for (let i = 0; i < numTimesAdded; i++) {\n            observer.apply(observer, [event, ...args]);\n          }\n        });\n      }\n    }\n  }\n  class ResourceStore extends EventEmitter {\n    constructor(data, options = {\n      ns: ['translation'],\n      defaultNS: 'translation'\n    }) {\n      super();\n      this.data = data || {};\n      this.options = options;\n      if (this.options.keySeparator === undefined) {\n        this.options.keySeparator = '.';\n      }\n      if (this.options.ignoreJSONStructure === undefined) {\n        this.options.ignoreJSONStructure = true;\n      }\n    }\n    addNamespaces(ns) {\n      if (this.options.ns.indexOf(ns) < 0) {\n        this.options.ns.push(ns);\n      }\n    }\n    removeNamespaces(ns) {\n      const index = this.options.ns.indexOf(ns);\n      if (index > -1) {\n        this.options.ns.splice(index, 1);\n      }\n    }\n    getResource(lng, ns, key, options = {}) {\n      const keySeparator = options.keySeparator !== undefined ? options.keySeparator : this.options.keySeparator;\n      const ignoreJSONStructure = options.ignoreJSONStructure !== undefined ? options.ignoreJSONStructure : this.options.ignoreJSONStructure;\n      let path;\n      if (lng.indexOf('.') > -1) {\n        path = lng.split('.');\n      } else {\n        path = [lng, ns];\n        if (key) {\n          if (Array.isArray(key)) {\n            path.push(...key);\n          } else if (isString$1(key) && keySeparator) {\n            path.push(...key.split(keySeparator));\n          } else {\n            path.push(key);\n          }\n        }\n      }\n      const result = getPath(this.data, path);\n      if (!result && !ns && !key && lng.indexOf('.') > -1) {\n        lng = path[0];\n        ns = path[1];\n        key = path.slice(2).join('.');\n      }\n      if (result || !ignoreJSONStructure || !isString$1(key)) return result;\n      return deepFind(this.data?.[lng]?.[ns], key, keySeparator);\n    }\n    addResource(lng, ns, key, value, options = {\n      silent: false\n    }) {\n      const keySeparator = options.keySeparator !== undefined ? options.keySeparator : this.options.keySeparator;\n      let path = [lng, ns];\n      if (key) path = path.concat(keySeparator ? key.split(keySeparator) : key);\n      if (lng.indexOf('.') > -1) {\n        path = lng.split('.');\n        value = ns;\n        ns = path[1];\n      }\n      this.addNamespaces(ns);\n      setPath(this.data, path, value);\n      if (!options.silent) this.emit('added', lng, ns, key, value);\n    }\n    addResources(lng, ns, resources, options = {\n      silent: false\n    }) {\n      for (const m in resources) {\n        if (isString$1(resources[m]) || Array.isArray(resources[m])) this.addResource(lng, ns, m, resources[m], {\n          silent: true\n        });\n      }\n      if (!options.silent) this.emit('added', lng, ns, resources);\n    }\n    addResourceBundle(lng, ns, resources, deep, overwrite, options = {\n      silent: false,\n      skipCopy: false\n    }) {\n      let path = [lng, ns];\n      if (lng.indexOf('.') > -1) {\n        path = lng.split('.');\n        deep = resources;\n        resources = ns;\n        ns = path[1];\n      }\n      this.addNamespaces(ns);\n      let pack = getPath(this.data, path) || {};\n      if (!options.skipCopy) resources = JSON.parse(JSON.stringify(resources));\n      if (deep) {\n        deepExtend(pack, resources, overwrite);\n      } else {\n        pack = {\n          ...pack,\n          ...resources\n        };\n      }\n      setPath(this.data, path, pack);\n      if (!options.silent) this.emit('added', lng, ns, resources);\n    }\n    removeResourceBundle(lng, ns) {\n      if (this.hasResourceBundle(lng, ns)) {\n        delete this.data[lng][ns];\n      }\n      this.removeNamespaces(ns);\n      this.emit('removed', lng, ns);\n    }\n    hasResourceBundle(lng, ns) {\n      return this.getResource(lng, ns) !== undefined;\n    }\n    getResourceBundle(lng, ns) {\n      if (!ns) ns = this.options.defaultNS;\n      return this.getResource(lng, ns);\n    }\n    getDataByLanguage(lng) {\n      return this.data[lng];\n    }\n    hasLanguageSomeTranslations(lng) {\n      const data = this.getDataByLanguage(lng);\n      const n = data && Object.keys(data) || [];\n      return !!n.find(v => data[v] && Object.keys(data[v]).length > 0);\n    }\n    toJSON() {\n      return this.data;\n    }\n  }\n  var postProcessor = {\n    processors: {},\n    addPostProcessor(module) {\n      this.processors[module.name] = module;\n    },\n    handle(processors, value, key, options, translator) {\n      processors.forEach(processor => {\n        value = this.processors[processor]?.process(value, key, options, translator) ?? value;\n      });\n      return value;\n    }\n  };\n  const PATH_KEY = Symbol('i18next/PATH_KEY');\n  function createProxy() {\n    const state = [];\n    const handler = Object.create(null);\n    let proxy;\n    handler.get = (target, key) => {\n      proxy?.revoke?.();\n      if (key === PATH_KEY) return state;\n      state.push(key);\n      proxy = Proxy.revocable(target, handler);\n      return proxy.proxy;\n    };\n    return Proxy.revocable(Object.create(null), handler).proxy;\n  }\n  function keysFromSelector(selector, opts) {\n    const {\n      [PATH_KEY]: path\n    } = selector(createProxy());\n    return path.join(opts?.keySeparator ?? '.');\n  }\n  const checkedLoadedFor = {};\n  const shouldHandleAsObject = res => !isString$1(res) && typeof res !== 'boolean' && typeof res !== 'number';\n  class Translator extends EventEmitter {\n    constructor(services, options = {}) {\n      super();\n      copy(['resourceStore', 'languageUtils', 'pluralResolver', 'interpolator', 'backendConnector', 'i18nFormat', 'utils'], services, this);\n      this.options = options;\n      if (this.options.keySeparator === undefined) {\n        this.options.keySeparator = '.';\n      }\n      this.logger = baseLogger.create('translator');\n    }\n    changeLanguage(lng) {\n      if (lng) this.language = lng;\n    }\n    exists(key, o = {\n      interpolation: {}\n    }) {\n      const opt = {\n        ...o\n      };\n      if (key == null) return false;\n      const resolved = this.resolve(key, opt);\n      if (resolved?.res === undefined) return false;\n      const isObject = shouldHandleAsObject(resolved.res);\n      if (opt.returnObjects === false && isObject) {\n        return false;\n      }\n      return true;\n    }\n    extractFromKey(key, opt) {\n      let nsSeparator = opt.nsSeparator !== undefined ? opt.nsSeparator : this.options.nsSeparator;\n      if (nsSeparator === undefined) nsSeparator = ':';\n      const keySeparator = opt.keySeparator !== undefined ? opt.keySeparator : this.options.keySeparator;\n      let namespaces = opt.ns || this.options.defaultNS || [];\n      const wouldCheckForNsInKey = nsSeparator && key.indexOf(nsSeparator) > -1;\n      const seemsNaturalLanguage = !this.options.userDefinedKeySeparator && !opt.keySeparator && !this.options.userDefinedNsSeparator && !opt.nsSeparator && !looksLikeObjectPath(key, nsSeparator, keySeparator);\n      if (wouldCheckForNsInKey && !seemsNaturalLanguage) {\n        const m = key.match(this.interpolator.nestingRegexp);\n        if (m && m.length > 0) {\n          return {\n            key,\n            namespaces: isString$1(namespaces) ? [namespaces] : namespaces\n          };\n        }\n        const parts = key.split(nsSeparator);\n        if (nsSeparator !== keySeparator || nsSeparator === keySeparator && this.options.ns.indexOf(parts[0]) > -1) namespaces = parts.shift();\n        key = parts.join(keySeparator);\n      }\n      return {\n        key,\n        namespaces: isString$1(namespaces) ? [namespaces] : namespaces\n      };\n    }\n    translate(keys, o, lastKey) {\n      let opt = typeof o === 'object' ? {\n        ...o\n      } : o;\n      if (typeof opt !== 'object' && this.options.overloadTranslationOptionHandler) {\n        opt = this.options.overloadTranslationOptionHandler(arguments);\n      }\n      if (typeof opt === 'object') opt = {\n        ...opt\n      };\n      if (!opt) opt = {};\n      if (keys == null) return '';\n      if (typeof keys === 'function') keys = keysFromSelector(keys, {\n        ...this.options,\n        ...opt\n      });\n      if (!Array.isArray(keys)) keys = [String(keys)];\n      const returnDetails = opt.returnDetails !== undefined ? opt.returnDetails : this.options.returnDetails;\n      const keySeparator = opt.keySeparator !== undefined ? opt.keySeparator : this.options.keySeparator;\n      const {\n        key,\n        namespaces\n      } = this.extractFromKey(keys[keys.length - 1], opt);\n      const namespace = namespaces[namespaces.length - 1];\n      let nsSeparator = opt.nsSeparator !== undefined ? opt.nsSeparator : this.options.nsSeparator;\n      if (nsSeparator === undefined) nsSeparator = ':';\n      const lng = opt.lng || this.language;\n      const appendNamespaceToCIMode = opt.appendNamespaceToCIMode || this.options.appendNamespaceToCIMode;\n      if (lng?.toLowerCase() === 'cimode') {\n        if (appendNamespaceToCIMode) {\n          if (returnDetails) {\n            return {\n              res: `${namespace}${nsSeparator}${key}`,\n              usedKey: key,\n              exactUsedKey: key,\n              usedLng: lng,\n              usedNS: namespace,\n              usedParams: this.getUsedParamsDetails(opt)\n            };\n          }\n          return `${namespace}${nsSeparator}${key}`;\n        }\n        if (returnDetails) {\n          return {\n            res: key,\n            usedKey: key,\n            exactUsedKey: key,\n            usedLng: lng,\n            usedNS: namespace,\n            usedParams: this.getUsedParamsDetails(opt)\n          };\n        }\n        return key;\n      }\n      const resolved = this.resolve(keys, opt);\n      let res = resolved?.res;\n      const resUsedKey = resolved?.usedKey || key;\n      const resExactUsedKey = resolved?.exactUsedKey || key;\n      const noObject = ['[object Number]', '[object Function]', '[object RegExp]'];\n      const joinArrays = opt.joinArrays !== undefined ? opt.joinArrays : this.options.joinArrays;\n      const handleAsObjectInI18nFormat = !this.i18nFormat || this.i18nFormat.handleAsObject;\n      const needsPluralHandling = opt.count !== undefined && !isString$1(opt.count);\n      const hasDefaultValue = Translator.hasDefaultValue(opt);\n      const defaultValueSuffix = needsPluralHandling ? this.pluralResolver.getSuffix(lng, opt.count, opt) : '';\n      const defaultValueSuffixOrdinalFallback = opt.ordinal && needsPluralHandling ? this.pluralResolver.getSuffix(lng, opt.count, {\n        ordinal: false\n      }) : '';\n      const needsZeroSuffixLookup = needsPluralHandling && !opt.ordinal && opt.count === 0;\n      const defaultValue = needsZeroSuffixLookup && opt[`defaultValue${this.options.pluralSeparator}zero`] || opt[`defaultValue${defaultValueSuffix}`] || opt[`defaultValue${defaultValueSuffixOrdinalFallback}`] || opt.defaultValue;\n      let resForObjHndl = res;\n      if (handleAsObjectInI18nFormat && !res && hasDefaultValue) {\n        resForObjHndl = defaultValue;\n      }\n      const handleAsObject = shouldHandleAsObject(resForObjHndl);\n      const resType = Object.prototype.toString.apply(resForObjHndl);\n      if (handleAsObjectInI18nFormat && resForObjHndl && handleAsObject && noObject.indexOf(resType) < 0 && !(isString$1(joinArrays) && Array.isArray(resForObjHndl))) {\n        if (!opt.returnObjects && !this.options.returnObjects) {\n          if (!this.options.returnedObjectHandler) {\n            this.logger.warn('accessing an object - but returnObjects options is not enabled!');\n          }\n          const r = this.options.returnedObjectHandler ? this.options.returnedObjectHandler(resUsedKey, resForObjHndl, {\n            ...opt,\n            ns: namespaces\n          }) : `key '${key} (${this.language})' returned an object instead of string.`;\n          if (returnDetails) {\n            resolved.res = r;\n            resolved.usedParams = this.getUsedParamsDetails(opt);\n            return resolved;\n          }\n          return r;\n        }\n        if (keySeparator) {\n          const resTypeIsArray = Array.isArray(resForObjHndl);\n          const copy = resTypeIsArray ? [] : {};\n          const newKeyToUse = resTypeIsArray ? resExactUsedKey : resUsedKey;\n          for (const m in resForObjHndl) {\n            if (Object.prototype.hasOwnProperty.call(resForObjHndl, m)) {\n              const deepKey = `${newKeyToUse}${keySeparator}${m}`;\n              if (hasDefaultValue && !res) {\n                copy[m] = this.translate(deepKey, {\n                  ...opt,\n                  defaultValue: shouldHandleAsObject(defaultValue) ? defaultValue[m] : undefined,\n                  ...{\n                    joinArrays: false,\n                    ns: namespaces\n                  }\n                });\n              } else {\n                copy[m] = this.translate(deepKey, {\n                  ...opt,\n                  ...{\n                    joinArrays: false,\n                    ns: namespaces\n                  }\n                });\n              }\n              if (copy[m] === deepKey) copy[m] = resForObjHndl[m];\n            }\n          }\n          res = copy;\n        }\n      } else if (handleAsObjectInI18nFormat && isString$1(joinArrays) && Array.isArray(res)) {\n        res = res.join(joinArrays);\n        if (res) res = this.extendTranslation(res, keys, opt, lastKey);\n      } else {\n        let usedDefault = false;\n        let usedKey = false;\n        if (!this.isValidLookup(res) && hasDefaultValue) {\n          usedDefault = true;\n          res = defaultValue;\n        }\n        if (!this.isValidLookup(res)) {\n          usedKey = true;\n          res = key;\n        }\n        const missingKeyNoValueFallbackToKey = opt.missingKeyNoValueFallbackToKey || this.options.missingKeyNoValueFallbackToKey;\n        const resForMissing = missingKeyNoValueFallbackToKey && usedKey ? undefined : res;\n        const updateMissing = hasDefaultValue && defaultValue !== res && this.options.updateMissing;\n        if (usedKey || usedDefault || updateMissing) {\n          this.logger.log(updateMissing ? 'updateKey' : 'missingKey', lng, namespace, key, updateMissing ? defaultValue : res);\n          if (keySeparator) {\n            const fk = this.resolve(key, {\n              ...opt,\n              keySeparator: false\n            });\n            if (fk && fk.res) this.logger.warn('Seems the loaded translations were in flat JSON format instead of nested. Either set keySeparator: false on init or make sure your translations are published in nested format.');\n          }\n          let lngs = [];\n          const fallbackLngs = this.languageUtils.getFallbackCodes(this.options.fallbackLng, opt.lng || this.language);\n          if (this.options.saveMissingTo === 'fallback' && fallbackLngs && fallbackLngs[0]) {\n            for (let i = 0; i < fallbackLngs.length; i++) {\n              lngs.push(fallbackLngs[i]);\n            }\n          } else if (this.options.saveMissingTo === 'all') {\n            lngs = this.languageUtils.toResolveHierarchy(opt.lng || this.language);\n          } else {\n            lngs.push(opt.lng || this.language);\n          }\n          const send = (l, k, specificDefaultValue) => {\n            const defaultForMissing = hasDefaultValue && specificDefaultValue !== res ? specificDefaultValue : resForMissing;\n            if (this.options.missingKeyHandler) {\n              this.options.missingKeyHandler(l, namespace, k, defaultForMissing, updateMissing, opt);\n            } else if (this.backendConnector?.saveMissing) {\n              this.backendConnector.saveMissing(l, namespace, k, defaultForMissing, updateMissing, opt);\n            }\n            this.emit('missingKey', l, namespace, k, res);\n          };\n          if (this.options.saveMissing) {\n            if (this.options.saveMissingPlurals && needsPluralHandling) {\n              lngs.forEach(language => {\n                const suffixes = this.pluralResolver.getSuffixes(language, opt);\n                if (needsZeroSuffixLookup && opt[`defaultValue${this.options.pluralSeparator}zero`] && suffixes.indexOf(`${this.options.pluralSeparator}zero`) < 0) {\n                  suffixes.push(`${this.options.pluralSeparator}zero`);\n                }\n                suffixes.forEach(suffix => {\n                  send([language], key + suffix, opt[`defaultValue${suffix}`] || defaultValue);\n                });\n              });\n            } else {\n              send(lngs, key, defaultValue);\n            }\n          }\n        }\n        res = this.extendTranslation(res, keys, opt, resolved, lastKey);\n        if (usedKey && res === key && this.options.appendNamespaceToMissingKey) {\n          res = `${namespace}${nsSeparator}${key}`;\n        }\n        if ((usedKey || usedDefault) && this.options.parseMissingKeyHandler) {\n          res = this.options.parseMissingKeyHandler(this.options.appendNamespaceToMissingKey ? `${namespace}${nsSeparator}${key}` : key, usedDefault ? res : undefined, opt);\n        }\n      }\n      if (returnDetails) {\n        resolved.res = res;\n        resolved.usedParams = this.getUsedParamsDetails(opt);\n        return resolved;\n      }\n      return res;\n    }\n    extendTranslation(res, key, opt, resolved, lastKey) {\n      if (this.i18nFormat?.parse) {\n        res = this.i18nFormat.parse(res, {\n          ...this.options.interpolation.defaultVariables,\n          ...opt\n        }, opt.lng || this.language || resolved.usedLng, resolved.usedNS, resolved.usedKey, {\n          resolved\n        });\n      } else if (!opt.skipInterpolation) {\n        if (opt.interpolation) this.interpolator.init({\n          ...opt,\n          ...{\n            interpolation: {\n              ...this.options.interpolation,\n              ...opt.interpolation\n            }\n          }\n        });\n        const skipOnVariables = isString$1(res) && (opt?.interpolation?.skipOnVariables !== undefined ? opt.interpolation.skipOnVariables : this.options.interpolation.skipOnVariables);\n        let nestBef;\n        if (skipOnVariables) {\n          const nb = res.match(this.interpolator.nestingRegexp);\n          nestBef = nb && nb.length;\n        }\n        let data = opt.replace && !isString$1(opt.replace) ? opt.replace : opt;\n        if (this.options.interpolation.defaultVariables) data = {\n          ...this.options.interpolation.defaultVariables,\n          ...data\n        };\n        res = this.interpolator.interpolate(res, data, opt.lng || this.language || resolved.usedLng, opt);\n        if (skipOnVariables) {\n          const na = res.match(this.interpolator.nestingRegexp);\n          const nestAft = na && na.length;\n          if (nestBef < nestAft) opt.nest = false;\n        }\n        if (!opt.lng && resolved && resolved.res) opt.lng = this.language || resolved.usedLng;\n        if (opt.nest !== false) res = this.interpolator.nest(res, (...args) => {\n          if (lastKey?.[0] === args[0] && !opt.context) {\n            this.logger.warn(`It seems you are nesting recursively key: ${args[0]} in key: ${key[0]}`);\n            return null;\n          }\n          return this.translate(...args, key);\n        }, opt);\n        if (opt.interpolation) this.interpolator.reset();\n      }\n      const postProcess = opt.postProcess || this.options.postProcess;\n      const postProcessorNames = isString$1(postProcess) ? [postProcess] : postProcess;\n      if (res != null && postProcessorNames?.length && opt.applyPostProcessor !== false) {\n        res = postProcessor.handle(postProcessorNames, res, key, this.options && this.options.postProcessPassResolved ? {\n          i18nResolved: {\n            ...resolved,\n            usedParams: this.getUsedParamsDetails(opt)\n          },\n          ...opt\n        } : opt, this);\n      }\n      return res;\n    }\n    resolve(keys, opt = {}) {\n      let found;\n      let usedKey;\n      let exactUsedKey;\n      let usedLng;\n      let usedNS;\n      if (isString$1(keys)) keys = [keys];\n      keys.forEach(k => {\n        if (this.isValidLookup(found)) return;\n        const extracted = this.extractFromKey(k, opt);\n        const key = extracted.key;\n        usedKey = key;\n        let namespaces = extracted.namespaces;\n        if (this.options.fallbackNS) namespaces = namespaces.concat(this.options.fallbackNS);\n        const needsPluralHandling = opt.count !== undefined && !isString$1(opt.count);\n        const needsZeroSuffixLookup = needsPluralHandling && !opt.ordinal && opt.count === 0;\n        const needsContextHandling = opt.context !== undefined && (isString$1(opt.context) || typeof opt.context === 'number') && opt.context !== '';\n        const codes = opt.lngs ? opt.lngs : this.languageUtils.toResolveHierarchy(opt.lng || this.language, opt.fallbackLng);\n        namespaces.forEach(ns => {\n          if (this.isValidLookup(found)) return;\n          usedNS = ns;\n          if (!checkedLoadedFor[`${codes[0]}-${ns}`] && this.utils?.hasLoadedNamespace && !this.utils?.hasLoadedNamespace(usedNS)) {\n            checkedLoadedFor[`${codes[0]}-${ns}`] = true;\n            this.logger.warn(`key \"${usedKey}\" for languages \"${codes.join(', ')}\" won't get resolved as namespace \"${usedNS}\" was not yet loaded`, 'This means something IS WRONG in your setup. You access the t function before i18next.init / i18next.loadNamespace / i18next.changeLanguage was done. Wait for the callback or Promise to resolve before accessing it!!!');\n          }\n          codes.forEach(code => {\n            if (this.isValidLookup(found)) return;\n            usedLng = code;\n            const finalKeys = [key];\n            if (this.i18nFormat?.addLookupKeys) {\n              this.i18nFormat.addLookupKeys(finalKeys, key, code, ns, opt);\n            } else {\n              let pluralSuffix;\n              if (needsPluralHandling) pluralSuffix = this.pluralResolver.getSuffix(code, opt.count, opt);\n              const zeroSuffix = `${this.options.pluralSeparator}zero`;\n              const ordinalPrefix = `${this.options.pluralSeparator}ordinal${this.options.pluralSeparator}`;\n              if (needsPluralHandling) {\n                if (opt.ordinal && pluralSuffix.indexOf(ordinalPrefix) === 0) {\n                  finalKeys.push(key + pluralSuffix.replace(ordinalPrefix, this.options.pluralSeparator));\n                }\n                finalKeys.push(key + pluralSuffix);\n                if (needsZeroSuffixLookup) {\n                  finalKeys.push(key + zeroSuffix);\n                }\n              }\n              if (needsContextHandling) {\n                const contextKey = `${key}${this.options.contextSeparator || '_'}${opt.context}`;\n                finalKeys.push(contextKey);\n                if (needsPluralHandling) {\n                  if (opt.ordinal && pluralSuffix.indexOf(ordinalPrefix) === 0) {\n                    finalKeys.push(contextKey + pluralSuffix.replace(ordinalPrefix, this.options.pluralSeparator));\n                  }\n                  finalKeys.push(contextKey + pluralSuffix);\n                  if (needsZeroSuffixLookup) {\n                    finalKeys.push(contextKey + zeroSuffix);\n                  }\n                }\n              }\n            }\n            let possibleKey;\n            while (possibleKey = finalKeys.pop()) {\n              if (!this.isValidLookup(found)) {\n                exactUsedKey = possibleKey;\n                found = this.getResource(code, ns, possibleKey, opt);\n              }\n            }\n          });\n        });\n      });\n      return {\n        res: found,\n        usedKey,\n        exactUsedKey,\n        usedLng,\n        usedNS\n      };\n    }\n    isValidLookup(res) {\n      return res !== undefined && !(!this.options.returnNull && res === null) && !(!this.options.returnEmptyString && res === '');\n    }\n    getResource(code, ns, key, options = {}) {\n      if (this.i18nFormat?.getResource) return this.i18nFormat.getResource(code, ns, key, options);\n      return this.resourceStore.getResource(code, ns, key, options);\n    }\n    getUsedParamsDetails(options = {}) {\n      const optionsKeys = ['defaultValue', 'ordinal', 'context', 'replace', 'lng', 'lngs', 'fallbackLng', 'ns', 'keySeparator', 'nsSeparator', 'returnObjects', 'returnDetails', 'joinArrays', 'postProcess', 'interpolation'];\n      const useOptionsReplaceForData = options.replace && !isString$1(options.replace);\n      let data = useOptionsReplaceForData ? options.replace : options;\n      if (useOptionsReplaceForData && typeof options.count !== 'undefined') {\n        data.count = options.count;\n      }\n      if (this.options.interpolation.defaultVariables) {\n        data = {\n          ...this.options.interpolation.defaultVariables,\n          ...data\n        };\n      }\n      if (!useOptionsReplaceForData) {\n        data = {\n          ...data\n        };\n        for (const key of optionsKeys) {\n          delete data[key];\n        }\n      }\n      return data;\n    }\n    static hasDefaultValue(options) {\n      const prefix = 'defaultValue';\n      for (const option in options) {\n        if (Object.prototype.hasOwnProperty.call(options, option) && prefix === option.substring(0, prefix.length) && undefined !== options[option]) {\n          return true;\n        }\n      }\n      return false;\n    }\n  }\n  class LanguageUtil {\n    constructor(options) {\n      this.options = options;\n      this.supportedLngs = this.options.supportedLngs || false;\n      this.logger = baseLogger.create('languageUtils');\n    }\n    getScriptPartFromCode(code) {\n      code = getCleanedCode(code);\n      if (!code || code.indexOf('-') < 0) return null;\n      const p = code.split('-');\n      if (p.length === 2) return null;\n      p.pop();\n      if (p[p.length - 1].toLowerCase() === 'x') return null;\n      return this.formatLanguageCode(p.join('-'));\n    }\n    getLanguagePartFromCode(code) {\n      code = getCleanedCode(code);\n      if (!code || code.indexOf('-') < 0) return code;\n      const p = code.split('-');\n      return this.formatLanguageCode(p[0]);\n    }\n    formatLanguageCode(code) {\n      if (isString$1(code) && code.indexOf('-') > -1) {\n        let formattedCode;\n        try {\n          formattedCode = Intl.getCanonicalLocales(code)[0];\n        } catch (e) {}\n        if (formattedCode && this.options.lowerCaseLng) {\n          formattedCode = formattedCode.toLowerCase();\n        }\n        if (formattedCode) return formattedCode;\n        if (this.options.lowerCaseLng) {\n          return code.toLowerCase();\n        }\n        return code;\n      }\n      return this.options.cleanCode || this.options.lowerCaseLng ? code.toLowerCase() : code;\n    }\n    isSupportedCode(code) {\n      if (this.options.load === 'languageOnly' || this.options.nonExplicitSupportedLngs) {\n        code = this.getLanguagePartFromCode(code);\n      }\n      return !this.supportedLngs || !this.supportedLngs.length || this.supportedLngs.indexOf(code) > -1;\n    }\n    getBestMatchFromCodes(codes) {\n      if (!codes) return null;\n      let found;\n      codes.forEach(code => {\n        if (found) return;\n        const cleanedLng = this.formatLanguageCode(code);\n        if (!this.options.supportedLngs || this.isSupportedCode(cleanedLng)) found = cleanedLng;\n      });\n      if (!found && this.options.supportedLngs) {\n        codes.forEach(code => {\n          if (found) return;\n          const lngScOnly = this.getScriptPartFromCode(code);\n          if (this.isSupportedCode(lngScOnly)) return found = lngScOnly;\n          const lngOnly = this.getLanguagePartFromCode(code);\n          if (this.isSupportedCode(lngOnly)) return found = lngOnly;\n          found = this.options.supportedLngs.find(supportedLng => {\n            if (supportedLng === lngOnly) return supportedLng;\n            if (supportedLng.indexOf('-') < 0 && lngOnly.indexOf('-') < 0) return;\n            if (supportedLng.indexOf('-') > 0 && lngOnly.indexOf('-') < 0 && supportedLng.substring(0, supportedLng.indexOf('-')) === lngOnly) return supportedLng;\n            if (supportedLng.indexOf(lngOnly) === 0 && lngOnly.length > 1) return supportedLng;\n          });\n        });\n      }\n      if (!found) found = this.getFallbackCodes(this.options.fallbackLng)[0];\n      return found;\n    }\n    getFallbackCodes(fallbacks, code) {\n      if (!fallbacks) return [];\n      if (typeof fallbacks === 'function') fallbacks = fallbacks(code);\n      if (isString$1(fallbacks)) fallbacks = [fallbacks];\n      if (Array.isArray(fallbacks)) return fallbacks;\n      if (!code) return fallbacks.default || [];\n      let found = fallbacks[code];\n      if (!found) found = fallbacks[this.getScriptPartFromCode(code)];\n      if (!found) found = fallbacks[this.formatLanguageCode(code)];\n      if (!found) found = fallbacks[this.getLanguagePartFromCode(code)];\n      if (!found) found = fallbacks.default;\n      return found || [];\n    }\n    toResolveHierarchy(code, fallbackCode) {\n      const fallbackCodes = this.getFallbackCodes((fallbackCode === false ? [] : fallbackCode) || this.options.fallbackLng || [], code);\n      const codes = [];\n      const addCode = c => {\n        if (!c) return;\n        if (this.isSupportedCode(c)) {\n          codes.push(c);\n        } else {\n          this.logger.warn(`rejecting language code not found in supportedLngs: ${c}`);\n        }\n      };\n      if (isString$1(code) && (code.indexOf('-') > -1 || code.indexOf('_') > -1)) {\n        if (this.options.load !== 'languageOnly') addCode(this.formatLanguageCode(code));\n        if (this.options.load !== 'languageOnly' && this.options.load !== 'currentOnly') addCode(this.getScriptPartFromCode(code));\n        if (this.options.load !== 'currentOnly') addCode(this.getLanguagePartFromCode(code));\n      } else if (isString$1(code)) {\n        addCode(this.formatLanguageCode(code));\n      }\n      fallbackCodes.forEach(fc => {\n        if (codes.indexOf(fc) < 0) addCode(this.formatLanguageCode(fc));\n      });\n      return codes;\n    }\n  }\n  const suffixesOrder = {\n    zero: 0,\n    one: 1,\n    two: 2,\n    few: 3,\n    many: 4,\n    other: 5\n  };\n  const dummyRule = {\n    select: count => count === 1 ? 'one' : 'other',\n    resolvedOptions: () => ({\n      pluralCategories: ['one', 'other']\n    })\n  };\n  class PluralResolver {\n    constructor(languageUtils, options = {}) {\n      this.languageUtils = languageUtils;\n      this.options = options;\n      this.logger = baseLogger.create('pluralResolver');\n      this.pluralRulesCache = {};\n    }\n    addRule(lng, obj) {\n      this.rules[lng] = obj;\n    }\n    clearCache() {\n      this.pluralRulesCache = {};\n    }\n    getRule(code, options = {}) {\n      const cleanedCode = getCleanedCode(code === 'dev' ? 'en' : code);\n      const type = options.ordinal ? 'ordinal' : 'cardinal';\n      const cacheKey = JSON.stringify({\n        cleanedCode,\n        type\n      });\n      if (cacheKey in this.pluralRulesCache) {\n        return this.pluralRulesCache[cacheKey];\n      }\n      let rule;\n      try {\n        rule = new Intl.PluralRules(cleanedCode, {\n          type\n        });\n      } catch (err) {\n        if (!Intl) {\n          this.logger.error('No Intl support, please use an Intl polyfill!');\n          return dummyRule;\n        }\n        if (!code.match(/-|_/)) return dummyRule;\n        const lngPart = this.languageUtils.getLanguagePartFromCode(code);\n        rule = this.getRule(lngPart, options);\n      }\n      this.pluralRulesCache[cacheKey] = rule;\n      return rule;\n    }\n    needsPlural(code, options = {}) {\n      let rule = this.getRule(code, options);\n      if (!rule) rule = this.getRule('dev', options);\n      return rule?.resolvedOptions().pluralCategories.length > 1;\n    }\n    getPluralFormsOfKey(code, key, options = {}) {\n      return this.getSuffixes(code, options).map(suffix => `${key}${suffix}`);\n    }\n    getSuffixes(code, options = {}) {\n      let rule = this.getRule(code, options);\n      if (!rule) rule = this.getRule('dev', options);\n      if (!rule) return [];\n      return rule.resolvedOptions().pluralCategories.sort((pluralCategory1, pluralCategory2) => suffixesOrder[pluralCategory1] - suffixesOrder[pluralCategory2]).map(pluralCategory => `${this.options.prepend}${options.ordinal ? `ordinal${this.options.prepend}` : ''}${pluralCategory}`);\n    }\n    getSuffix(code, count, options = {}) {\n      const rule = this.getRule(code, options);\n      if (rule) {\n        return `${this.options.prepend}${options.ordinal ? `ordinal${this.options.prepend}` : ''}${rule.select(count)}`;\n      }\n      this.logger.warn(`no plural rule found for: ${code}`);\n      return this.getSuffix('dev', count, options);\n    }\n  }\n  const deepFindWithDefaults = (data, defaultData, key, keySeparator = '.', ignoreJSONStructure = true) => {\n    let path = getPathWithDefaults(data, defaultData, key);\n    if (!path && ignoreJSONStructure && isString$1(key)) {\n      path = deepFind(data, key, keySeparator);\n      if (path === undefined) path = deepFind(defaultData, key, keySeparator);\n    }\n    return path;\n  };\n  const regexSafe = val => val.replace(/\\$/g, '$$$$');\n  class Interpolator {\n    constructor(options = {}) {\n      this.logger = baseLogger.create('interpolator');\n      this.options = options;\n      this.format = options?.interpolation?.format || (value => value);\n      this.init(options);\n    }\n    init(options = {}) {\n      if (!options.interpolation) options.interpolation = {\n        escapeValue: true\n      };\n      const {\n        escape: escape$1,\n        escapeValue,\n        useRawValueToEscape,\n        prefix,\n        prefixEscaped,\n        suffix,\n        suffixEscaped,\n        formatSeparator,\n        unescapeSuffix,\n        unescapePrefix,\n        nestingPrefix,\n        nestingPrefixEscaped,\n        nestingSuffix,\n        nestingSuffixEscaped,\n        nestingOptionsSeparator,\n        maxReplaces,\n        alwaysFormat\n      } = options.interpolation;\n      this.escape = escape$1 !== undefined ? escape$1 : escape;\n      this.escapeValue = escapeValue !== undefined ? escapeValue : true;\n      this.useRawValueToEscape = useRawValueToEscape !== undefined ? useRawValueToEscape : false;\n      this.prefix = prefix ? regexEscape(prefix) : prefixEscaped || '{{';\n      this.suffix = suffix ? regexEscape(suffix) : suffixEscaped || '}}';\n      this.formatSeparator = formatSeparator || ',';\n      this.unescapePrefix = unescapeSuffix ? '' : unescapePrefix || '-';\n      this.unescapeSuffix = this.unescapePrefix ? '' : unescapeSuffix || '';\n      this.nestingPrefix = nestingPrefix ? regexEscape(nestingPrefix) : nestingPrefixEscaped || regexEscape('$t(');\n      this.nestingSuffix = nestingSuffix ? regexEscape(nestingSuffix) : nestingSuffixEscaped || regexEscape(')');\n      this.nestingOptionsSeparator = nestingOptionsSeparator || ',';\n      this.maxReplaces = maxReplaces || 1000;\n      this.alwaysFormat = alwaysFormat !== undefined ? alwaysFormat : false;\n      this.resetRegExp();\n    }\n    reset() {\n      if (this.options) this.init(this.options);\n    }\n    resetRegExp() {\n      const getOrResetRegExp = (existingRegExp, pattern) => {\n        if (existingRegExp?.source === pattern) {\n          existingRegExp.lastIndex = 0;\n          return existingRegExp;\n        }\n        return new RegExp(pattern, 'g');\n      };\n      this.regexp = getOrResetRegExp(this.regexp, `${this.prefix}(.+?)${this.suffix}`);\n      this.regexpUnescape = getOrResetRegExp(this.regexpUnescape, `${this.prefix}${this.unescapePrefix}(.+?)${this.unescapeSuffix}${this.suffix}`);\n      this.nestingRegexp = getOrResetRegExp(this.nestingRegexp, `${this.nestingPrefix}((?:[^()\"']+|\"[^\"]*\"|'[^']*'|\\\\((?:[^()]|\"[^\"]*\"|'[^']*')*\\\\))*?)${this.nestingSuffix}`);\n    }\n    interpolate(str, data, lng, options) {\n      let match;\n      let value;\n      let replaces;\n      const defaultData = this.options && this.options.interpolation && this.options.interpolation.defaultVariables || {};\n      const handleFormat = key => {\n        if (key.indexOf(this.formatSeparator) < 0) {\n          const path = deepFindWithDefaults(data, defaultData, key, this.options.keySeparator, this.options.ignoreJSONStructure);\n          return this.alwaysFormat ? this.format(path, undefined, lng, {\n            ...options,\n            ...data,\n            interpolationkey: key\n          }) : path;\n        }\n        const p = key.split(this.formatSeparator);\n        const k = p.shift().trim();\n        const f = p.join(this.formatSeparator).trim();\n        return this.format(deepFindWithDefaults(data, defaultData, k, this.options.keySeparator, this.options.ignoreJSONStructure), f, lng, {\n          ...options,\n          ...data,\n          interpolationkey: k\n        });\n      };\n      this.resetRegExp();\n      const missingInterpolationHandler = options?.missingInterpolationHandler || this.options.missingInterpolationHandler;\n      const skipOnVariables = options?.interpolation?.skipOnVariables !== undefined ? options.interpolation.skipOnVariables : this.options.interpolation.skipOnVariables;\n      const todos = [{\n        regex: this.regexpUnescape,\n        safeValue: val => regexSafe(val)\n      }, {\n        regex: this.regexp,\n        safeValue: val => this.escapeValue ? regexSafe(this.escape(val)) : regexSafe(val)\n      }];\n      todos.forEach(todo => {\n        replaces = 0;\n        while (match = todo.regex.exec(str)) {\n          const matchedVar = match[1].trim();\n          value = handleFormat(matchedVar);\n          if (value === undefined) {\n            if (typeof missingInterpolationHandler === 'function') {\n              const temp = missingInterpolationHandler(str, match, options);\n              value = isString$1(temp) ? temp : '';\n            } else if (options && Object.prototype.hasOwnProperty.call(options, matchedVar)) {\n              value = '';\n            } else if (skipOnVariables) {\n              value = match[0];\n              continue;\n            } else {\n              this.logger.warn(`missed to pass in variable ${matchedVar} for interpolating ${str}`);\n              value = '';\n            }\n          } else if (!isString$1(value) && !this.useRawValueToEscape) {\n            value = makeString(value);\n          }\n          const safeValue = todo.safeValue(value);\n          str = str.replace(match[0], safeValue);\n          if (skipOnVariables) {\n            todo.regex.lastIndex += value.length;\n            todo.regex.lastIndex -= match[0].length;\n          } else {\n            todo.regex.lastIndex = 0;\n          }\n          replaces++;\n          if (replaces >= this.maxReplaces) {\n            break;\n          }\n        }\n      });\n      return str;\n    }\n    nest(str, fc, options = {}) {\n      let match;\n      let value;\n      let clonedOptions;\n      const handleHasOptions = (key, inheritedOptions) => {\n        const sep = this.nestingOptionsSeparator;\n        if (key.indexOf(sep) < 0) return key;\n        const c = key.split(new RegExp(`${sep}[ ]*{`));\n        let optionsString = `{${c[1]}`;\n        key = c[0];\n        optionsString = this.interpolate(optionsString, clonedOptions);\n        const matchedSingleQuotes = optionsString.match(/'/g);\n        const matchedDoubleQuotes = optionsString.match(/\"/g);\n        if ((matchedSingleQuotes?.length ?? 0) % 2 === 0 && !matchedDoubleQuotes || matchedDoubleQuotes.length % 2 !== 0) {\n          optionsString = optionsString.replace(/'/g, '\"');\n        }\n        try {\n          clonedOptions = JSON.parse(optionsString);\n          if (inheritedOptions) clonedOptions = {\n            ...inheritedOptions,\n            ...clonedOptions\n          };\n        } catch (e) {\n          this.logger.warn(`failed parsing options string in nesting for key ${key}`, e);\n          return `${key}${sep}${optionsString}`;\n        }\n        if (clonedOptions.defaultValue && clonedOptions.defaultValue.indexOf(this.prefix) > -1) delete clonedOptions.defaultValue;\n        return key;\n      };\n      while (match = this.nestingRegexp.exec(str)) {\n        let formatters = [];\n        clonedOptions = {\n          ...options\n        };\n        clonedOptions = clonedOptions.replace && !isString$1(clonedOptions.replace) ? clonedOptions.replace : clonedOptions;\n        clonedOptions.applyPostProcessor = false;\n        delete clonedOptions.defaultValue;\n        const keyEndIndex = /{.*}/.test(match[1]) ? match[1].lastIndexOf('}') + 1 : match[1].indexOf(this.formatSeparator);\n        if (keyEndIndex !== -1) {\n          formatters = match[1].slice(keyEndIndex).split(this.formatSeparator).map(elem => elem.trim()).filter(Boolean);\n          match[1] = match[1].slice(0, keyEndIndex);\n        }\n        value = fc(handleHasOptions.call(this, match[1].trim(), clonedOptions), clonedOptions);\n        if (value && match[0] === str && !isString$1(value)) return value;\n        if (!isString$1(value)) value = makeString(value);\n        if (!value) {\n          this.logger.warn(`missed to resolve ${match[1]} for nesting ${str}`);\n          value = '';\n        }\n        if (formatters.length) {\n          value = formatters.reduce((v, f) => this.format(v, f, options.lng, {\n            ...options,\n            interpolationkey: match[1].trim()\n          }), value.trim());\n        }\n        str = str.replace(match[0], value);\n        this.regexp.lastIndex = 0;\n      }\n      return str;\n    }\n  }\n  const parseFormatStr = formatStr => {\n    let formatName = formatStr.toLowerCase().trim();\n    const formatOptions = {};\n    if (formatStr.indexOf('(') > -1) {\n      const p = formatStr.split('(');\n      formatName = p[0].toLowerCase().trim();\n      const optStr = p[1].substring(0, p[1].length - 1);\n      if (formatName === 'currency' && optStr.indexOf(':') < 0) {\n        if (!formatOptions.currency) formatOptions.currency = optStr.trim();\n      } else if (formatName === 'relativetime' && optStr.indexOf(':') < 0) {\n        if (!formatOptions.range) formatOptions.range = optStr.trim();\n      } else {\n        const opts = optStr.split(';');\n        opts.forEach(opt => {\n          if (opt) {\n            const [key, ...rest] = opt.split(':');\n            const val = rest.join(':').trim().replace(/^'+|'+$/g, '');\n            const trimmedKey = key.trim();\n            if (!formatOptions[trimmedKey]) formatOptions[trimmedKey] = val;\n            if (val === 'false') formatOptions[trimmedKey] = false;\n            if (val === 'true') formatOptions[trimmedKey] = true;\n            if (!isNaN(val)) formatOptions[trimmedKey] = parseInt(val, 10);\n          }\n        });\n      }\n    }\n    return {\n      formatName,\n      formatOptions\n    };\n  };\n  const createCachedFormatter = fn => {\n    const cache = {};\n    return (v, l, o) => {\n      let optForCache = o;\n      if (o && o.interpolationkey && o.formatParams && o.formatParams[o.interpolationkey] && o[o.interpolationkey]) {\n        optForCache = {\n          ...optForCache,\n          [o.interpolationkey]: undefined\n        };\n      }\n      const key = l + JSON.stringify(optForCache);\n      let frm = cache[key];\n      if (!frm) {\n        frm = fn(getCleanedCode(l), o);\n        cache[key] = frm;\n      }\n      return frm(v);\n    };\n  };\n  const createNonCachedFormatter = fn => (v, l, o) => fn(getCleanedCode(l), o)(v);\n  class Formatter {\n    constructor(options = {}) {\n      this.logger = baseLogger.create('formatter');\n      this.options = options;\n      this.init(options);\n    }\n    init(services, options = {\n      interpolation: {}\n    }) {\n      this.formatSeparator = options.interpolation.formatSeparator || ',';\n      const cf = options.cacheInBuiltFormats ? createCachedFormatter : createNonCachedFormatter;\n      this.formats = {\n        number: cf((lng, opt) => {\n          const formatter = new Intl.NumberFormat(lng, {\n            ...opt\n          });\n          return val => formatter.format(val);\n        }),\n        currency: cf((lng, opt) => {\n          const formatter = new Intl.NumberFormat(lng, {\n            ...opt,\n            style: 'currency'\n          });\n          return val => formatter.format(val);\n        }),\n        datetime: cf((lng, opt) => {\n          const formatter = new Intl.DateTimeFormat(lng, {\n            ...opt\n          });\n          return val => formatter.format(val);\n        }),\n        relativetime: cf((lng, opt) => {\n          const formatter = new Intl.RelativeTimeFormat(lng, {\n            ...opt\n          });\n          return val => formatter.format(val, opt.range || 'day');\n        }),\n        list: cf((lng, opt) => {\n          const formatter = new Intl.ListFormat(lng, {\n            ...opt\n          });\n          return val => formatter.format(val);\n        })\n      };\n    }\n    add(name, fc) {\n      this.formats[name.toLowerCase().trim()] = fc;\n    }\n    addCached(name, fc) {\n      this.formats[name.toLowerCase().trim()] = createCachedFormatter(fc);\n    }\n    format(value, format, lng, options = {}) {\n      const formats = format.split(this.formatSeparator);\n      if (formats.length > 1 && formats[0].indexOf('(') > 1 && formats[0].indexOf(')') < 0 && formats.find(f => f.indexOf(')') > -1)) {\n        const lastIndex = formats.findIndex(f => f.indexOf(')') > -1);\n        formats[0] = [formats[0], ...formats.splice(1, lastIndex)].join(this.formatSeparator);\n      }\n      const result = formats.reduce((mem, f) => {\n        const {\n          formatName,\n          formatOptions\n        } = parseFormatStr(f);\n        if (this.formats[formatName]) {\n          let formatted = mem;\n          try {\n            const valOptions = options?.formatParams?.[options.interpolationkey] || {};\n            const l = valOptions.locale || valOptions.lng || options.locale || options.lng || lng;\n            formatted = this.formats[formatName](mem, l, {\n              ...formatOptions,\n              ...options,\n              ...valOptions\n            });\n          } catch (error) {\n            this.logger.warn(error);\n          }\n          return formatted;\n        } else {\n          this.logger.warn(`there was no format function for ${formatName}`);\n        }\n        return mem;\n      }, value);\n      return result;\n    }\n  }\n  const removePending = (q, name) => {\n    if (q.pending[name] !== undefined) {\n      delete q.pending[name];\n      q.pendingCount--;\n    }\n  };\n  class Connector extends EventEmitter {\n    constructor(backend, store, services, options = {}) {\n      super();\n      this.backend = backend;\n      this.store = store;\n      this.services = services;\n      this.languageUtils = services.languageUtils;\n      this.options = options;\n      this.logger = baseLogger.create('backendConnector');\n      this.waitingReads = [];\n      this.maxParallelReads = options.maxParallelReads || 10;\n      this.readingCalls = 0;\n      this.maxRetries = options.maxRetries >= 0 ? options.maxRetries : 5;\n      this.retryTimeout = options.retryTimeout >= 1 ? options.retryTimeout : 350;\n      this.state = {};\n      this.queue = [];\n      this.backend?.init?.(services, options.backend, options);\n    }\n    queueLoad(languages, namespaces, options, callback) {\n      const toLoad = {};\n      const pending = {};\n      const toLoadLanguages = {};\n      const toLoadNamespaces = {};\n      languages.forEach(lng => {\n        let hasAllNamespaces = true;\n        namespaces.forEach(ns => {\n          const name = `${lng}|${ns}`;\n          if (!options.reload && this.store.hasResourceBundle(lng, ns)) {\n            this.state[name] = 2;\n          } else if (this.state[name] < 0) ;else if (this.state[name] === 1) {\n            if (pending[name] === undefined) pending[name] = true;\n          } else {\n            this.state[name] = 1;\n            hasAllNamespaces = false;\n            if (pending[name] === undefined) pending[name] = true;\n            if (toLoad[name] === undefined) toLoad[name] = true;\n            if (toLoadNamespaces[ns] === undefined) toLoadNamespaces[ns] = true;\n          }\n        });\n        if (!hasAllNamespaces) toLoadLanguages[lng] = true;\n      });\n      if (Object.keys(toLoad).length || Object.keys(pending).length) {\n        this.queue.push({\n          pending,\n          pendingCount: Object.keys(pending).length,\n          loaded: {},\n          errors: [],\n          callback\n        });\n      }\n      return {\n        toLoad: Object.keys(toLoad),\n        pending: Object.keys(pending),\n        toLoadLanguages: Object.keys(toLoadLanguages),\n        toLoadNamespaces: Object.keys(toLoadNamespaces)\n      };\n    }\n    loaded(name, err, data) {\n      const s = name.split('|');\n      const lng = s[0];\n      const ns = s[1];\n      if (err) this.emit('failedLoading', lng, ns, err);\n      if (!err && data) {\n        this.store.addResourceBundle(lng, ns, data, undefined, undefined, {\n          skipCopy: true\n        });\n      }\n      this.state[name] = err ? -1 : 2;\n      if (err && data) this.state[name] = 0;\n      const loaded = {};\n      this.queue.forEach(q => {\n        pushPath(q.loaded, [lng], ns);\n        removePending(q, name);\n        if (err) q.errors.push(err);\n        if (q.pendingCount === 0 && !q.done) {\n          Object.keys(q.loaded).forEach(l => {\n            if (!loaded[l]) loaded[l] = {};\n            const loadedKeys = q.loaded[l];\n            if (loadedKeys.length) {\n              loadedKeys.forEach(n => {\n                if (loaded[l][n] === undefined) loaded[l][n] = true;\n              });\n            }\n          });\n          q.done = true;\n          if (q.errors.length) {\n            q.callback(q.errors);\n          } else {\n            q.callback();\n          }\n        }\n      });\n      this.emit('loaded', loaded);\n      this.queue = this.queue.filter(q => !q.done);\n    }\n    read(lng, ns, fcName, tried = 0, wait = this.retryTimeout, callback) {\n      if (!lng.length) return callback(null, {});\n      if (this.readingCalls >= this.maxParallelReads) {\n        this.waitingReads.push({\n          lng,\n          ns,\n          fcName,\n          tried,\n          wait,\n          callback\n        });\n        return;\n      }\n      this.readingCalls++;\n      const resolver = (err, data) => {\n        this.readingCalls--;\n        if (this.waitingReads.length > 0) {\n          const next = this.waitingReads.shift();\n          this.read(next.lng, next.ns, next.fcName, next.tried, next.wait, next.callback);\n        }\n        if (err && data && tried < this.maxRetries) {\n          setTimeout(() => {\n            this.read.call(this, lng, ns, fcName, tried + 1, wait * 2, callback);\n          }, wait);\n          return;\n        }\n        callback(err, data);\n      };\n      const fc = this.backend[fcName].bind(this.backend);\n      if (fc.length === 2) {\n        try {\n          const r = fc(lng, ns);\n          if (r && typeof r.then === 'function') {\n            r.then(data => resolver(null, data)).catch(resolver);\n          } else {\n            resolver(null, r);\n          }\n        } catch (err) {\n          resolver(err);\n        }\n        return;\n      }\n      return fc(lng, ns, resolver);\n    }\n    prepareLoading(languages, namespaces, options = {}, callback) {\n      if (!this.backend) {\n        this.logger.warn('No backend was added via i18next.use. Will not load resources.');\n        return callback && callback();\n      }\n      if (isString$1(languages)) languages = this.languageUtils.toResolveHierarchy(languages);\n      if (isString$1(namespaces)) namespaces = [namespaces];\n      const toLoad = this.queueLoad(languages, namespaces, options, callback);\n      if (!toLoad.toLoad.length) {\n        if (!toLoad.pending.length) callback();\n        return null;\n      }\n      toLoad.toLoad.forEach(name => {\n        this.loadOne(name);\n      });\n    }\n    load(languages, namespaces, callback) {\n      this.prepareLoading(languages, namespaces, {}, callback);\n    }\n    reload(languages, namespaces, callback) {\n      this.prepareLoading(languages, namespaces, {\n        reload: true\n      }, callback);\n    }\n    loadOne(name, prefix = '') {\n      const s = name.split('|');\n      const lng = s[0];\n      const ns = s[1];\n      this.read(lng, ns, 'read', undefined, undefined, (err, data) => {\n        if (err) this.logger.warn(`${prefix}loading namespace ${ns} for language ${lng} failed`, err);\n        if (!err && data) this.logger.log(`${prefix}loaded namespace ${ns} for language ${lng}`, data);\n        this.loaded(name, err, data);\n      });\n    }\n    saveMissing(languages, namespace, key, fallbackValue, isUpdate, options = {}, clb = () => {}) {\n      if (this.services?.utils?.hasLoadedNamespace && !this.services?.utils?.hasLoadedNamespace(namespace)) {\n        this.logger.warn(`did not save key \"${key}\" as the namespace \"${namespace}\" was not yet loaded`, 'This means something IS WRONG in your setup. You access the t function before i18next.init / i18next.loadNamespace / i18next.changeLanguage was done. Wait for the callback or Promise to resolve before accessing it!!!');\n        return;\n      }\n      if (key === undefined || key === null || key === '') return;\n      if (this.backend?.create) {\n        const opts = {\n          ...options,\n          isUpdate\n        };\n        const fc = this.backend.create.bind(this.backend);\n        if (fc.length < 6) {\n          try {\n            let r;\n            if (fc.length === 5) {\n              r = fc(languages, namespace, key, fallbackValue, opts);\n            } else {\n              r = fc(languages, namespace, key, fallbackValue);\n            }\n            if (r && typeof r.then === 'function') {\n              r.then(data => clb(null, data)).catch(clb);\n            } else {\n              clb(null, r);\n            }\n          } catch (err) {\n            clb(err);\n          }\n        } else {\n          fc(languages, namespace, key, fallbackValue, clb, opts);\n        }\n      }\n      if (!languages || !languages[0]) return;\n      this.store.addResource(languages[0], namespace, key, fallbackValue);\n    }\n  }\n  const get = () => ({\n    debug: false,\n    initAsync: true,\n    ns: ['translation'],\n    defaultNS: ['translation'],\n    fallbackLng: ['dev'],\n    fallbackNS: false,\n    supportedLngs: false,\n    nonExplicitSupportedLngs: false,\n    load: 'all',\n    preload: false,\n    simplifyPluralSuffix: true,\n    keySeparator: '.',\n    nsSeparator: ':',\n    pluralSeparator: '_',\n    contextSeparator: '_',\n    partialBundledLanguages: false,\n    saveMissing: false,\n    updateMissing: false,\n    saveMissingTo: 'fallback',\n    saveMissingPlurals: true,\n    missingKeyHandler: false,\n    missingInterpolationHandler: false,\n    postProcess: false,\n    postProcessPassResolved: false,\n    returnNull: false,\n    returnEmptyString: true,\n    returnObjects: false,\n    joinArrays: false,\n    returnedObjectHandler: false,\n    parseMissingKeyHandler: false,\n    appendNamespaceToMissingKey: false,\n    appendNamespaceToCIMode: false,\n    overloadTranslationOptionHandler: args => {\n      let ret = {};\n      if (typeof args[1] === 'object') ret = args[1];\n      if (isString$1(args[1])) ret.defaultValue = args[1];\n      if (isString$1(args[2])) ret.tDescription = args[2];\n      if (typeof args[2] === 'object' || typeof args[3] === 'object') {\n        const options = args[3] || args[2];\n        Object.keys(options).forEach(key => {\n          ret[key] = options[key];\n        });\n      }\n      return ret;\n    },\n    interpolation: {\n      escapeValue: true,\n      format: value => value,\n      prefix: '{{',\n      suffix: '}}',\n      formatSeparator: ',',\n      unescapePrefix: '-',\n      nestingPrefix: '$t(',\n      nestingSuffix: ')',\n      nestingOptionsSeparator: ',',\n      maxReplaces: 1000,\n      skipOnVariables: true\n    },\n    cacheInBuiltFormats: true\n  });\n  const transformOptions = options => {\n    if (isString$1(options.ns)) options.ns = [options.ns];\n    if (isString$1(options.fallbackLng)) options.fallbackLng = [options.fallbackLng];\n    if (isString$1(options.fallbackNS)) options.fallbackNS = [options.fallbackNS];\n    if (options.supportedLngs?.indexOf?.('cimode') < 0) {\n      options.supportedLngs = options.supportedLngs.concat(['cimode']);\n    }\n    if (typeof options.initImmediate === 'boolean') options.initAsync = options.initImmediate;\n    return options;\n  };\n  const noop = () => {};\n  const bindMemberFunctions = inst => {\n    const mems = Object.getOwnPropertyNames(Object.getPrototypeOf(inst));\n    mems.forEach(mem => {\n      if (typeof inst[mem] === 'function') {\n        inst[mem] = inst[mem].bind(inst);\n      }\n    });\n  };\n  class I18n extends EventEmitter {\n    constructor(options = {}, callback) {\n      super();\n      this.options = transformOptions(options);\n      this.services = {};\n      this.logger = baseLogger;\n      this.modules = {\n        external: []\n      };\n      bindMemberFunctions(this);\n      if (callback && !this.isInitialized && !options.isClone) {\n        if (!this.options.initAsync) {\n          this.init(options, callback);\n          return this;\n        }\n        setTimeout(() => {\n          this.init(options, callback);\n        }, 0);\n      }\n    }\n    init(options = {}, callback) {\n      this.isInitializing = true;\n      if (typeof options === 'function') {\n        callback = options;\n        options = {};\n      }\n      if (options.defaultNS == null && options.ns) {\n        if (isString$1(options.ns)) {\n          options.defaultNS = options.ns;\n        } else if (options.ns.indexOf('translation') < 0) {\n          options.defaultNS = options.ns[0];\n        }\n      }\n      const defOpts = get();\n      this.options = {\n        ...defOpts,\n        ...this.options,\n        ...transformOptions(options)\n      };\n      this.options.interpolation = {\n        ...defOpts.interpolation,\n        ...this.options.interpolation\n      };\n      if (options.keySeparator !== undefined) {\n        this.options.userDefinedKeySeparator = options.keySeparator;\n      }\n      if (options.nsSeparator !== undefined) {\n        this.options.userDefinedNsSeparator = options.nsSeparator;\n      }\n      if (typeof this.options.overloadTranslationOptionHandler !== 'function') {\n        this.options.overloadTranslationOptionHandler = defOpts.overloadTranslationOptionHandler;\n      }\n      const createClassOnDemand = ClassOrObject => {\n        if (!ClassOrObject) return null;\n        if (typeof ClassOrObject === 'function') return new ClassOrObject();\n        return ClassOrObject;\n      };\n      if (!this.options.isClone) {\n        if (this.modules.logger) {\n          baseLogger.init(createClassOnDemand(this.modules.logger), this.options);\n        } else {\n          baseLogger.init(null, this.options);\n        }\n        let formatter;\n        if (this.modules.formatter) {\n          formatter = this.modules.formatter;\n        } else {\n          formatter = Formatter;\n        }\n        const lu = new LanguageUtil(this.options);\n        this.store = new ResourceStore(this.options.resources, this.options);\n        const s = this.services;\n        s.logger = baseLogger;\n        s.resourceStore = this.store;\n        s.languageUtils = lu;\n        s.pluralResolver = new PluralResolver(lu, {\n          prepend: this.options.pluralSeparator,\n          simplifyPluralSuffix: this.options.simplifyPluralSuffix\n        });\n        const usingLegacyFormatFunction = this.options.interpolation.format && this.options.interpolation.format !== defOpts.interpolation.format;\n        if (usingLegacyFormatFunction) {\n          this.logger.deprecate(`init: you are still using the legacy format function, please use the new approach: https://www.i18next.com/translation-function/formatting`);\n        }\n        if (formatter && (!this.options.interpolation.format || this.options.interpolation.format === defOpts.interpolation.format)) {\n          s.formatter = createClassOnDemand(formatter);\n          if (s.formatter.init) s.formatter.init(s, this.options);\n          this.options.interpolation.format = s.formatter.format.bind(s.formatter);\n        }\n        s.interpolator = new Interpolator(this.options);\n        s.utils = {\n          hasLoadedNamespace: this.hasLoadedNamespace.bind(this)\n        };\n        s.backendConnector = new Connector(createClassOnDemand(this.modules.backend), s.resourceStore, s, this.options);\n        s.backendConnector.on('*', (event, ...args) => {\n          this.emit(event, ...args);\n        });\n        if (this.modules.languageDetector) {\n          s.languageDetector = createClassOnDemand(this.modules.languageDetector);\n          if (s.languageDetector.init) s.languageDetector.init(s, this.options.detection, this.options);\n        }\n        if (this.modules.i18nFormat) {\n          s.i18nFormat = createClassOnDemand(this.modules.i18nFormat);\n          if (s.i18nFormat.init) s.i18nFormat.init(this);\n        }\n        this.translator = new Translator(this.services, this.options);\n        this.translator.on('*', (event, ...args) => {\n          this.emit(event, ...args);\n        });\n        this.modules.external.forEach(m => {\n          if (m.init) m.init(this);\n        });\n      }\n      this.format = this.options.interpolation.format;\n      if (!callback) callback = noop;\n      if (this.options.fallbackLng && !this.services.languageDetector && !this.options.lng) {\n        const codes = this.services.languageUtils.getFallbackCodes(this.options.fallbackLng);\n        if (codes.length > 0 && codes[0] !== 'dev') this.options.lng = codes[0];\n      }\n      if (!this.services.languageDetector && !this.options.lng) {\n        this.logger.warn('init: no languageDetector is used and no lng is defined');\n      }\n      const storeApi = ['getResource', 'hasResourceBundle', 'getResourceBundle', 'getDataByLanguage'];\n      storeApi.forEach(fcName => {\n        this[fcName] = (...args) => this.store[fcName](...args);\n      });\n      const storeApiChained = ['addResource', 'addResources', 'addResourceBundle', 'removeResourceBundle'];\n      storeApiChained.forEach(fcName => {\n        this[fcName] = (...args) => {\n          this.store[fcName](...args);\n          return this;\n        };\n      });\n      const deferred = defer();\n      const load = () => {\n        const finish = (err, t) => {\n          this.isInitializing = false;\n          if (this.isInitialized && !this.initializedStoreOnce) this.logger.warn('init: i18next is already initialized. You should call init just once!');\n          this.isInitialized = true;\n          if (!this.options.isClone) this.logger.log('initialized', this.options);\n          this.emit('initialized', this.options);\n          deferred.resolve(t);\n          callback(err, t);\n        };\n        if (this.languages && !this.isInitialized) return finish(null, this.t.bind(this));\n        this.changeLanguage(this.options.lng, finish);\n      };\n      if (this.options.resources || !this.options.initAsync) {\n        load();\n      } else {\n        setTimeout(load, 0);\n      }\n      return deferred;\n    }\n    loadResources(language, callback = noop) {\n      let usedCallback = callback;\n      const usedLng = isString$1(language) ? language : this.language;\n      if (typeof language === 'function') usedCallback = language;\n      if (!this.options.resources || this.options.partialBundledLanguages) {\n        if (usedLng?.toLowerCase() === 'cimode' && (!this.options.preload || this.options.preload.length === 0)) return usedCallback();\n        const toLoad = [];\n        const append = lng => {\n          if (!lng) return;\n          if (lng === 'cimode') return;\n          const lngs = this.services.languageUtils.toResolveHierarchy(lng);\n          lngs.forEach(l => {\n            if (l === 'cimode') return;\n            if (toLoad.indexOf(l) < 0) toLoad.push(l);\n          });\n        };\n        if (!usedLng) {\n          const fallbacks = this.services.languageUtils.getFallbackCodes(this.options.fallbackLng);\n          fallbacks.forEach(l => append(l));\n        } else {\n          append(usedLng);\n        }\n        this.options.preload?.forEach?.(l => append(l));\n        this.services.backendConnector.load(toLoad, this.options.ns, e => {\n          if (!e && !this.resolvedLanguage && this.language) this.setResolvedLanguage(this.language);\n          usedCallback(e);\n        });\n      } else {\n        usedCallback(null);\n      }\n    }\n    reloadResources(lngs, ns, callback) {\n      const deferred = defer();\n      if (typeof lngs === 'function') {\n        callback = lngs;\n        lngs = undefined;\n      }\n      if (typeof ns === 'function') {\n        callback = ns;\n        ns = undefined;\n      }\n      if (!lngs) lngs = this.languages;\n      if (!ns) ns = this.options.ns;\n      if (!callback) callback = noop;\n      this.services.backendConnector.reload(lngs, ns, err => {\n        deferred.resolve();\n        callback(err);\n      });\n      return deferred;\n    }\n    use(module) {\n      if (!module) throw new Error('You are passing an undefined module! Please check the object you are passing to i18next.use()');\n      if (!module.type) throw new Error('You are passing a wrong module! Please check the object you are passing to i18next.use()');\n      if (module.type === 'backend') {\n        this.modules.backend = module;\n      }\n      if (module.type === 'logger' || module.log && module.warn && module.error) {\n        this.modules.logger = module;\n      }\n      if (module.type === 'languageDetector') {\n        this.modules.languageDetector = module;\n      }\n      if (module.type === 'i18nFormat') {\n        this.modules.i18nFormat = module;\n      }\n      if (module.type === 'postProcessor') {\n        postProcessor.addPostProcessor(module);\n      }\n      if (module.type === 'formatter') {\n        this.modules.formatter = module;\n      }\n      if (module.type === '3rdParty') {\n        this.modules.external.push(module);\n      }\n      return this;\n    }\n    setResolvedLanguage(l) {\n      if (!l || !this.languages) return;\n      if (['cimode', 'dev'].indexOf(l) > -1) return;\n      for (let li = 0; li < this.languages.length; li++) {\n        const lngInLngs = this.languages[li];\n        if (['cimode', 'dev'].indexOf(lngInLngs) > -1) continue;\n        if (this.store.hasLanguageSomeTranslations(lngInLngs)) {\n          this.resolvedLanguage = lngInLngs;\n          break;\n        }\n      }\n      if (!this.resolvedLanguage && this.languages.indexOf(l) < 0 && this.store.hasLanguageSomeTranslations(l)) {\n        this.resolvedLanguage = l;\n        this.languages.unshift(l);\n      }\n    }\n    changeLanguage(lng, callback) {\n      this.isLanguageChangingTo = lng;\n      const deferred = defer();\n      this.emit('languageChanging', lng);\n      const setLngProps = l => {\n        this.language = l;\n        this.languages = this.services.languageUtils.toResolveHierarchy(l);\n        this.resolvedLanguage = undefined;\n        this.setResolvedLanguage(l);\n      };\n      const done = (err, l) => {\n        if (l) {\n          if (this.isLanguageChangingTo === lng) {\n            setLngProps(l);\n            this.translator.changeLanguage(l);\n            this.isLanguageChangingTo = undefined;\n            this.emit('languageChanged', l);\n            this.logger.log('languageChanged', l);\n          }\n        } else {\n          this.isLanguageChangingTo = undefined;\n        }\n        deferred.resolve((...args) => this.t(...args));\n        if (callback) callback(err, (...args) => this.t(...args));\n      };\n      const setLng = lngs => {\n        if (!lng && !lngs && this.services.languageDetector) lngs = [];\n        const fl = isString$1(lngs) ? lngs : lngs && lngs[0];\n        const l = this.store.hasLanguageSomeTranslations(fl) ? fl : this.services.languageUtils.getBestMatchFromCodes(isString$1(lngs) ? [lngs] : lngs);\n        if (l) {\n          if (!this.language) {\n            setLngProps(l);\n          }\n          if (!this.translator.language) this.translator.changeLanguage(l);\n          this.services.languageDetector?.cacheUserLanguage?.(l);\n        }\n        this.loadResources(l, err => {\n          done(err, l);\n        });\n      };\n      if (!lng && this.services.languageDetector && !this.services.languageDetector.async) {\n        setLng(this.services.languageDetector.detect());\n      } else if (!lng && this.services.languageDetector && this.services.languageDetector.async) {\n        if (this.services.languageDetector.detect.length === 0) {\n          this.services.languageDetector.detect().then(setLng);\n        } else {\n          this.services.languageDetector.detect(setLng);\n        }\n      } else {\n        setLng(lng);\n      }\n      return deferred;\n    }\n    getFixedT(lng, ns, keyPrefix) {\n      const fixedT = (key, opts, ...rest) => {\n        let o;\n        if (typeof opts !== 'object') {\n          o = this.options.overloadTranslationOptionHandler([key, opts].concat(rest));\n        } else {\n          o = {\n            ...opts\n          };\n        }\n        o.lng = o.lng || fixedT.lng;\n        o.lngs = o.lngs || fixedT.lngs;\n        o.ns = o.ns || fixedT.ns;\n        if (o.keyPrefix !== '') o.keyPrefix = o.keyPrefix || keyPrefix || fixedT.keyPrefix;\n        const keySeparator = this.options.keySeparator || '.';\n        let resultKey;\n        if (o.keyPrefix && Array.isArray(key)) {\n          resultKey = key.map(k => {\n            if (typeof k === 'function') k = keysFromSelector(k, {\n              ...this.options,\n              ...opts\n            });\n            return `${o.keyPrefix}${keySeparator}${k}`;\n          });\n        } else {\n          if (typeof key === 'function') key = keysFromSelector(key, {\n            ...this.options,\n            ...opts\n          });\n          resultKey = o.keyPrefix ? `${o.keyPrefix}${keySeparator}${key}` : key;\n        }\n        return this.t(resultKey, o);\n      };\n      if (isString$1(lng)) {\n        fixedT.lng = lng;\n      } else {\n        fixedT.lngs = lng;\n      }\n      fixedT.ns = ns;\n      fixedT.keyPrefix = keyPrefix;\n      return fixedT;\n    }\n    t(...args) {\n      return this.translator?.translate(...args);\n    }\n    exists(...args) {\n      return this.translator?.exists(...args);\n    }\n    setDefaultNamespace(ns) {\n      this.options.defaultNS = ns;\n    }\n    hasLoadedNamespace(ns, options = {}) {\n      if (!this.isInitialized) {\n        this.logger.warn('hasLoadedNamespace: i18next was not initialized', this.languages);\n        return false;\n      }\n      if (!this.languages || !this.languages.length) {\n        this.logger.warn('hasLoadedNamespace: i18n.languages were undefined or empty', this.languages);\n        return false;\n      }\n      const lng = options.lng || this.resolvedLanguage || this.languages[0];\n      const fallbackLng = this.options ? this.options.fallbackLng : false;\n      const lastLng = this.languages[this.languages.length - 1];\n      if (lng.toLowerCase() === 'cimode') return true;\n      const loadNotPending = (l, n) => {\n        const loadState = this.services.backendConnector.state[`${l}|${n}`];\n        return loadState === -1 || loadState === 0 || loadState === 2;\n      };\n      if (options.precheck) {\n        const preResult = options.precheck(this, loadNotPending);\n        if (preResult !== undefined) return preResult;\n      }\n      if (this.hasResourceBundle(lng, ns)) return true;\n      if (!this.services.backendConnector.backend || this.options.resources && !this.options.partialBundledLanguages) return true;\n      if (loadNotPending(lng, ns) && (!fallbackLng || loadNotPending(lastLng, ns))) return true;\n      return false;\n    }\n    loadNamespaces(ns, callback) {\n      const deferred = defer();\n      if (!this.options.ns) {\n        if (callback) callback();\n        return Promise.resolve();\n      }\n      if (isString$1(ns)) ns = [ns];\n      ns.forEach(n => {\n        if (this.options.ns.indexOf(n) < 0) this.options.ns.push(n);\n      });\n      this.loadResources(err => {\n        deferred.resolve();\n        if (callback) callback(err);\n      });\n      return deferred;\n    }\n    loadLanguages(lngs, callback) {\n      const deferred = defer();\n      if (isString$1(lngs)) lngs = [lngs];\n      const preloaded = this.options.preload || [];\n      const newLngs = lngs.filter(lng => preloaded.indexOf(lng) < 0 && this.services.languageUtils.isSupportedCode(lng));\n      if (!newLngs.length) {\n        if (callback) callback();\n        return Promise.resolve();\n      }\n      this.options.preload = preloaded.concat(newLngs);\n      this.loadResources(err => {\n        deferred.resolve();\n        if (callback) callback(err);\n      });\n      return deferred;\n    }\n    dir(lng) {\n      if (!lng) lng = this.resolvedLanguage || (this.languages?.length > 0 ? this.languages[0] : this.language);\n      if (!lng) return 'rtl';\n      try {\n        const l = new Intl.Locale(lng);\n        if (l && l.getTextInfo) {\n          const ti = l.getTextInfo();\n          if (ti && ti.direction) return ti.direction;\n        }\n      } catch (e) {}\n      const rtlLngs = ['ar', 'shu', 'sqr', 'ssh', 'xaa', 'yhd', 'yud', 'aao', 'abh', 'abv', 'acm', 'acq', 'acw', 'acx', 'acy', 'adf', 'ads', 'aeb', 'aec', 'afb', 'ajp', 'apc', 'apd', 'arb', 'arq', 'ars', 'ary', 'arz', 'auz', 'avl', 'ayh', 'ayl', 'ayn', 'ayp', 'bbz', 'pga', 'he', 'iw', 'ps', 'pbt', 'pbu', 'pst', 'prp', 'prd', 'ug', 'ur', 'ydd', 'yds', 'yih', 'ji', 'yi', 'hbo', 'men', 'xmn', 'fa', 'jpr', 'peo', 'pes', 'prs', 'dv', 'sam', 'ckb'];\n      const languageUtils = this.services?.languageUtils || new LanguageUtil(get());\n      if (lng.toLowerCase().indexOf('-latn') > 1) return 'ltr';\n      return rtlLngs.indexOf(languageUtils.getLanguagePartFromCode(lng)) > -1 || lng.toLowerCase().indexOf('-arab') > 1 ? 'rtl' : 'ltr';\n    }\n    static createInstance(options = {}, callback) {\n      const instance = new I18n(options, callback);\n      instance.createInstance = I18n.createInstance;\n      return instance;\n    }\n    cloneInstance(options = {}, callback = noop) {\n      const forkResourceStore = options.forkResourceStore;\n      if (forkResourceStore) delete options.forkResourceStore;\n      const mergedOptions = {\n        ...this.options,\n        ...options,\n        ...{\n          isClone: true\n        }\n      };\n      const clone = new I18n(mergedOptions);\n      if (options.debug !== undefined || options.prefix !== undefined) {\n        clone.logger = clone.logger.clone(options);\n      }\n      const membersToCopy = ['store', 'services', 'language'];\n      membersToCopy.forEach(m => {\n        clone[m] = this[m];\n      });\n      clone.services = {\n        ...this.services\n      };\n      clone.services.utils = {\n        hasLoadedNamespace: clone.hasLoadedNamespace.bind(clone)\n      };\n      if (forkResourceStore) {\n        const clonedData = Object.keys(this.store.data).reduce((prev, l) => {\n          prev[l] = {\n            ...this.store.data[l]\n          };\n          prev[l] = Object.keys(prev[l]).reduce((acc, n) => {\n            acc[n] = {\n              ...prev[l][n]\n            };\n            return acc;\n          }, prev[l]);\n          return prev;\n        }, {});\n        clone.store = new ResourceStore(clonedData, mergedOptions);\n        clone.services.resourceStore = clone.store;\n      }\n      if (options.interpolation) clone.services.interpolator = new Interpolator(mergedOptions);\n      clone.translator = new Translator(clone.services, mergedOptions);\n      clone.translator.on('*', (event, ...args) => {\n        clone.emit(event, ...args);\n      });\n      clone.init(mergedOptions, callback);\n      clone.translator.options = mergedOptions;\n      clone.translator.backendConnector.services.utils = {\n        hasLoadedNamespace: clone.hasLoadedNamespace.bind(clone)\n      };\n      return clone;\n    }\n    toJSON() {\n      return {\n        options: this.options,\n        store: this.store,\n        language: this.language,\n        languages: this.languages,\n        resolvedLanguage: this.resolvedLanguage\n      };\n    }\n  }\n  const instance = I18n.createInstance();\n  instance.createInstance;\n  instance.dir;\n  instance.init;\n  instance.loadResources;\n  instance.reloadResources;\n  instance.use;\n  instance.changeLanguage;\n  instance.getFixedT;\n  instance.t;\n  instance.exists;\n  instance.setDefaultNamespace;\n  instance.hasLoadedNamespace;\n  instance.loadNamespaces;\n  instance.loadLanguages;\n\n  function getDefaultExportFromCjs (x) {\n  \treturn x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;\n  }\n\n  var voidElements = {\n    \"area\": true,\n    \"base\": true,\n    \"br\": true,\n    \"col\": true,\n    \"embed\": true,\n    \"hr\": true,\n    \"img\": true,\n    \"input\": true,\n    \"link\": true,\n    \"meta\": true,\n    \"param\": true,\n    \"source\": true,\n    \"track\": true,\n    \"wbr\": true\n  };\n\n  var e = /*@__PURE__*/getDefaultExportFromCjs(voidElements);\n\n  var t = /\\s([^'\"/\\s><]+?)[\\s/>]|([^\\s=]+)=\\s?(\".*?\"|'.*?')/g;\n  function n(n) {\n    var r = {\n        type: \"tag\",\n        name: \"\",\n        voidElement: false,\n        attrs: {},\n        children: []\n      },\n      i = n.match(/<\\/?([^\\s]+?)[/\\s>]/);\n    if (i && (r.name = i[1], (e[i[1]] || \"/\" === n.charAt(n.length - 2)) && (r.voidElement = true), r.name.startsWith(\"!--\"))) {\n      var s = n.indexOf(\"--\\x3e\");\n      return {\n        type: \"comment\",\n        comment: -1 !== s ? n.slice(4, s) : \"\"\n      };\n    }\n    for (var a = new RegExp(t), c = null; null !== (c = a.exec(n));) if (c[0].trim()) if (c[1]) {\n      var o = c[1].trim(),\n        l = [o, \"\"];\n      o.indexOf(\"=\") > -1 && (l = o.split(\"=\")), r.attrs[l[0]] = l[1], a.lastIndex--;\n    } else c[2] && (r.attrs[c[2]] = c[3].trim().substring(1, c[3].length - 1));\n    return r;\n  }\n  var r = /<[a-zA-Z0-9\\-\\!\\/](?:\"[^\"]*\"|'[^']*'|[^'\">])*>/g,\n    i = /^\\s*$/,\n    s = Object.create(null);\n  function a(e, t) {\n    switch (t.type) {\n      case \"text\":\n        return e + t.content;\n      case \"tag\":\n        return e += \"<\" + t.name + (t.attrs ? function (e) {\n          var t = [];\n          for (var n in e) t.push(n + '=\"' + e[n] + '\"');\n          return t.length ? \" \" + t.join(\" \") : \"\";\n        }(t.attrs) : \"\") + (t.voidElement ? \"/>\" : \">\"), t.voidElement ? e : e + t.children.reduce(a, \"\") + \"</\" + t.name + \">\";\n      case \"comment\":\n        return e + \"\\x3c!--\" + t.comment + \"--\\x3e\";\n    }\n  }\n  var c = {\n    parse: function (e, t) {\n      t || (t = {}), t.components || (t.components = s);\n      var a,\n        c = [],\n        o = [],\n        l = -1,\n        m = false;\n      if (0 !== e.indexOf(\"<\")) {\n        var u = e.indexOf(\"<\");\n        c.push({\n          type: \"text\",\n          content: -1 === u ? e : e.substring(0, u)\n        });\n      }\n      return e.replace(r, function (r, s) {\n        if (m) {\n          if (r !== \"</\" + a.name + \">\") return;\n          m = false;\n        }\n        var u,\n          f = \"/\" !== r.charAt(1),\n          h = r.startsWith(\"\\x3c!--\"),\n          p = s + r.length,\n          d = e.charAt(p);\n        if (h) {\n          var v = n(r);\n          return l < 0 ? (c.push(v), c) : ((u = o[l]).children.push(v), c);\n        }\n        if (f && (l++, \"tag\" === (a = n(r)).type && t.components[a.name] && (a.type = \"component\", m = true), a.voidElement || m || !d || \"<\" === d || a.children.push({\n          type: \"text\",\n          content: e.slice(p, e.indexOf(\"<\", p))\n        }), 0 === l && c.push(a), (u = o[l - 1]) && u.children.push(a), o[l] = a), (!f || a.voidElement) && (l > -1 && (a.voidElement || a.name === r.slice(2, -1)) && (l--, a = -1 === l ? c : o[l]), !m && \"<\" !== d && d)) {\n          u = -1 === l ? c : o[l].children;\n          var x = e.indexOf(\"<\", p),\n            g = e.slice(p, -1 === x ? void 0 : x);\n          i.test(g) && (g = \" \"), (x > -1 && l + u.length >= 0 || \" \" !== g) && u.push({\n            type: \"text\",\n            content: g\n          });\n        }\n      }), c;\n    },\n    stringify: function (e) {\n      return e.reduce(function (e, t) {\n        return e + a(\"\", t);\n      }, \"\");\n    }\n  };\n\n  const warn = (i18n, code, msg, rest) => {\n    const args = [msg, {\n      code,\n      ...(rest || {})\n    }];\n    if (i18n?.services?.logger?.forward) {\n      return i18n.services.logger.forward(args, 'warn', 'react-i18next::', true);\n    }\n    if (isString(args[0])) args[0] = `react-i18next:: ${args[0]}`;\n    if (i18n?.services?.logger?.warn) {\n      i18n.services.logger.warn(...args);\n    } else if (console?.warn) {\n      console.warn(...args);\n    }\n  };\n  const alreadyWarned = {};\n  const warnOnce = (i18n, code, msg, rest) => {\n    if (isString(msg) && alreadyWarned[msg]) return;\n    if (isString(msg)) alreadyWarned[msg] = new Date();\n    warn(i18n, code, msg, rest);\n  };\n  const loadedClb = (i18n, cb) => () => {\n    if (i18n.isInitialized) {\n      cb();\n    } else {\n      const initialized = () => {\n        setTimeout(() => {\n          i18n.off('initialized', initialized);\n        }, 0);\n        cb();\n      };\n      i18n.on('initialized', initialized);\n    }\n  };\n  const loadNamespaces = (i18n, ns, cb) => {\n    i18n.loadNamespaces(ns, loadedClb(i18n, cb));\n  };\n  const loadLanguages = (i18n, lng, ns, cb) => {\n    if (isString(ns)) ns = [ns];\n    if (i18n.options.preload && i18n.options.preload.indexOf(lng) > -1) return loadNamespaces(i18n, ns, cb);\n    ns.forEach(n => {\n      if (i18n.options.ns.indexOf(n) < 0) i18n.options.ns.push(n);\n    });\n    i18n.loadLanguages(lng, loadedClb(i18n, cb));\n  };\n  const hasLoadedNamespace = (ns, i18n, options = {}) => {\n    if (!i18n.languages || !i18n.languages.length) {\n      warnOnce(i18n, 'NO_LANGUAGES', 'i18n.languages were undefined or empty', {\n        languages: i18n.languages\n      });\n      return true;\n    }\n    return i18n.hasLoadedNamespace(ns, {\n      lng: options.lng,\n      precheck: (i18nInstance, loadNotPending) => {\n        if (options.bindI18n && options.bindI18n.indexOf('languageChanging') > -1 && i18nInstance.services.backendConnector.backend && i18nInstance.isLanguageChangingTo && !loadNotPending(i18nInstance.isLanguageChangingTo, ns)) return false;\n      }\n    });\n  };\n  const getDisplayName = Component => Component.displayName || Component.name || (isString(Component) && Component.length > 0 ? Component : 'Unknown');\n  const isString = obj => typeof obj === 'string';\n  const isObject = obj => typeof obj === 'object' && obj !== null;\n\n  const matchHtmlEntity = /&(?:amp|#38|lt|#60|gt|#62|apos|#39|quot|#34|nbsp|#160|copy|#169|reg|#174|hellip|#8230|#x2F|#47);/g;\n  const htmlEntities = {\n    '&amp;': '&',\n    '&#38;': '&',\n    '&lt;': '<',\n    '&#60;': '<',\n    '&gt;': '>',\n    '&#62;': '>',\n    '&apos;': \"'\",\n    '&#39;': \"'\",\n    '&quot;': '\"',\n    '&#34;': '\"',\n    '&nbsp;': ' ',\n    '&#160;': ' ',\n    '&copy;': '©',\n    '&#169;': '©',\n    '&reg;': '®',\n    '&#174;': '®',\n    '&hellip;': '…',\n    '&#8230;': '…',\n    '&#x2F;': '/',\n    '&#47;': '/'\n  };\n  const unescapeHtmlEntity = m => htmlEntities[m];\n  const unescape = text => text.replace(matchHtmlEntity, unescapeHtmlEntity);\n\n  let defaultOptions = {\n    bindI18n: 'languageChanged',\n    bindI18nStore: '',\n    transEmptyNodeValue: '',\n    transSupportBasicHtmlNodes: true,\n    transWrapTextNodes: '',\n    transKeepBasicHtmlNodesFor: ['br', 'strong', 'i', 'p'],\n    useSuspense: true,\n    unescape,\n    transDefaultProps: undefined\n  };\n  const setDefaults = (options = {}) => {\n    defaultOptions = {\n      ...defaultOptions,\n      ...options\n    };\n  };\n  const getDefaults = () => defaultOptions;\n\n  let i18nInstance;\n  const setI18n = instance => {\n    i18nInstance = instance;\n  };\n  const getI18n = () => i18nInstance;\n\n  const hasChildren = (node, checkLength) => {\n    if (!node) return false;\n    const base = node.props?.children ?? node.children;\n    if (checkLength) return base.length > 0;\n    return !!base;\n  };\n  const getChildren = node => {\n    if (!node) return [];\n    const children = node.props?.children ?? node.children;\n    return node.props?.i18nIsDynamicList ? getAsArray(children) : children;\n  };\n  const hasValidReactChildren = children => Array.isArray(children) && children.every(React.isValidElement);\n  const getAsArray = data => Array.isArray(data) ? data : [data];\n  const mergeProps = (source, target) => {\n    const newTarget = {\n      ...target\n    };\n    newTarget.props = {\n      ...target.props,\n      ...source.props\n    };\n    return newTarget;\n  };\n  const getValuesFromChildren = children => {\n    const values = {};\n    if (!children) return values;\n    const getData = childs => {\n      const childrenArray = getAsArray(childs);\n      childrenArray.forEach(child => {\n        if (isString(child)) return;\n        if (hasChildren(child)) getData(getChildren(child));else if (isObject(child) && !React.isValidElement(child)) Object.assign(values, child);\n      });\n    };\n    getData(children);\n    return values;\n  };\n  const nodesToString = (children, i18nOptions, i18n, i18nKey) => {\n    if (!children) return '';\n    let stringNode = '';\n    const childrenArray = getAsArray(children);\n    const keepArray = i18nOptions?.transSupportBasicHtmlNodes ? i18nOptions.transKeepBasicHtmlNodesFor ?? [] : [];\n    childrenArray.forEach((child, childIndex) => {\n      if (isString(child)) {\n        stringNode += `${child}`;\n        return;\n      }\n      if (React.isValidElement(child)) {\n        const {\n          props,\n          type\n        } = child;\n        const childPropsCount = Object.keys(props).length;\n        const shouldKeepChild = keepArray.indexOf(type) > -1;\n        const childChildren = props.children;\n        if (!childChildren && shouldKeepChild && !childPropsCount) {\n          stringNode += `<${type}/>`;\n          return;\n        }\n        if (!childChildren && (!shouldKeepChild || childPropsCount) || props.i18nIsDynamicList) {\n          stringNode += `<${childIndex}></${childIndex}>`;\n          return;\n        }\n        if (shouldKeepChild && childPropsCount === 1 && isString(childChildren)) {\n          stringNode += `<${type}>${childChildren}</${type}>`;\n          return;\n        }\n        const content = nodesToString(childChildren, i18nOptions, i18n, i18nKey);\n        stringNode += `<${childIndex}>${content}</${childIndex}>`;\n        return;\n      }\n      if (child === null) {\n        warn(i18n, 'TRANS_NULL_VALUE', `Passed in a null value as child`, {\n          i18nKey\n        });\n        return;\n      }\n      if (isObject(child)) {\n        const {\n          format,\n          ...clone\n        } = child;\n        const keys = Object.keys(clone);\n        if (keys.length === 1) {\n          const value = format ? `${keys[0]}, ${format}` : keys[0];\n          stringNode += `{{${value}}}`;\n          return;\n        }\n        warn(i18n, 'TRANS_INVALID_OBJ', `Invalid child - Object should only have keys {{ value, format }} (format is optional).`, {\n          i18nKey,\n          child\n        });\n        return;\n      }\n      warn(i18n, 'TRANS_INVALID_VAR', `Passed in a variable like {number} - pass variables for interpolation as full objects like {{number}}.`, {\n        i18nKey,\n        child\n      });\n    });\n    return stringNode;\n  };\n  const escapeLiteralLessThan = (str, keepArray = [], knownComponentsMap = {}) => {\n    if (!str) return str;\n    const knownNames = Object.keys(knownComponentsMap);\n    const allValidNames = [...keepArray, ...knownNames];\n    let result = '';\n    let i = 0;\n    while (i < str.length) {\n      if (str[i] === '<') {\n        let isValidTag = false;\n        const closingMatch = str.slice(i).match(/^<\\/(\\d+|[a-zA-Z][a-zA-Z0-9_-]*)>/);\n        if (closingMatch) {\n          const tagName = closingMatch[1];\n          if (/^\\d+$/.test(tagName) || allValidNames.includes(tagName)) {\n            isValidTag = true;\n            result += closingMatch[0];\n            i += closingMatch[0].length;\n          }\n        }\n        if (!isValidTag) {\n          const openingMatch = str.slice(i).match(/^<(\\d+|[a-zA-Z][a-zA-Z0-9_-]*)(\\s+[\\w-]+(?:=(?:\"[^\"]*\"|'[^']*'|[^\\s>]+))?)*\\s*(\\/)?>/);\n          if (openingMatch) {\n            const tagName = openingMatch[1];\n            if (/^\\d+$/.test(tagName) || allValidNames.includes(tagName)) {\n              isValidTag = true;\n              result += openingMatch[0];\n              i += openingMatch[0].length;\n            }\n          }\n        }\n        if (!isValidTag) {\n          result += '&lt;';\n          i += 1;\n        }\n      } else {\n        result += str[i];\n        i += 1;\n      }\n    }\n    return result;\n  };\n  const renderNodes = (children, knownComponentsMap, targetString, i18n, i18nOptions, combinedTOpts, shouldUnescape) => {\n    if (targetString === '') return [];\n    const keepArray = i18nOptions.transKeepBasicHtmlNodesFor || [];\n    const emptyChildrenButNeedsHandling = targetString && new RegExp(keepArray.map(keep => `<${keep}`).join('|')).test(targetString);\n    if (!children && !knownComponentsMap && !emptyChildrenButNeedsHandling && !shouldUnescape) return [targetString];\n    const data = knownComponentsMap ?? {};\n    const getData = childs => {\n      const childrenArray = getAsArray(childs);\n      childrenArray.forEach(child => {\n        if (isString(child)) return;\n        if (hasChildren(child)) getData(getChildren(child));else if (isObject(child) && !React.isValidElement(child)) Object.assign(data, child);\n      });\n    };\n    getData(children);\n    const escapedString = escapeLiteralLessThan(targetString, keepArray, data);\n    const ast = c.parse(`<0>${escapedString}</0>`);\n    const opts = {\n      ...data,\n      ...combinedTOpts\n    };\n    const renderInner = (child, node, rootReactNode) => {\n      const childs = getChildren(child);\n      const mappedChildren = mapAST(childs, node.children, rootReactNode);\n      return hasValidReactChildren(childs) && mappedChildren.length === 0 || child.props?.i18nIsDynamicList ? childs : mappedChildren;\n    };\n    const pushTranslatedJSX = (child, inner, mem, i, isVoid) => {\n      if (child.dummy) {\n        child.children = inner;\n        mem.push(React.cloneElement(child, {\n          key: i\n        }, isVoid ? undefined : inner));\n      } else {\n        mem.push(...React.Children.map([child], c => {\n          const INTERNAL_DYNAMIC_MARKER = 'data-i18n-is-dynamic-list';\n          const override = {\n            key: i,\n            [INTERNAL_DYNAMIC_MARKER]: undefined\n          };\n          if (c && c.props) {\n            Object.keys(c.props).forEach(k => {\n              if (k === 'ref' || k === 'children' || k === 'i18nIsDynamicList' || k === INTERNAL_DYNAMIC_MARKER) return;\n              override[k] = c.props[k];\n            });\n          }\n          return React.cloneElement(c, override, isVoid ? null : inner);\n        }));\n      }\n    };\n    const mapAST = (reactNode, astNode, rootReactNode) => {\n      const reactNodes = getAsArray(reactNode);\n      const astNodes = getAsArray(astNode);\n      return astNodes.reduce((mem, node, i) => {\n        const translationContent = node.children?.[0]?.content && i18n.services.interpolator.interpolate(node.children[0].content, opts, i18n.language);\n        if (node.type === 'tag') {\n          let tmp = reactNodes[parseInt(node.name, 10)];\n          if (!tmp && knownComponentsMap) tmp = knownComponentsMap[node.name];\n          if (rootReactNode.length === 1 && !tmp) tmp = rootReactNode[0][node.name];\n          if (!tmp) tmp = {};\n          const props = {\n            ...node.attrs\n          };\n          if (shouldUnescape) {\n            Object.keys(props).forEach(p => {\n              const val = props[p];\n              if (isString(val)) {\n                props[p] = unescape(val);\n              }\n            });\n          }\n          const child = Object.keys(props).length !== 0 ? mergeProps({\n            props\n          }, tmp) : tmp;\n          const isElement = React.isValidElement(child);\n          const isValidTranslationWithChildren = isElement && hasChildren(node, true) && !node.voidElement;\n          const isEmptyTransWithHTML = emptyChildrenButNeedsHandling && isObject(child) && child.dummy && !isElement;\n          const isKnownComponent = isObject(knownComponentsMap) && Object.hasOwnProperty.call(knownComponentsMap, node.name);\n          if (isString(child)) {\n            const value = i18n.services.interpolator.interpolate(child, opts, i18n.language);\n            mem.push(value);\n          } else if (hasChildren(child) || isValidTranslationWithChildren) {\n            const inner = renderInner(child, node, rootReactNode);\n            pushTranslatedJSX(child, inner, mem, i);\n          } else if (isEmptyTransWithHTML) {\n            const inner = mapAST(reactNodes, node.children, rootReactNode);\n            pushTranslatedJSX(child, inner, mem, i);\n          } else if (Number.isNaN(parseFloat(node.name))) {\n            if (isKnownComponent) {\n              const inner = renderInner(child, node, rootReactNode);\n              pushTranslatedJSX(child, inner, mem, i, node.voidElement);\n            } else if (i18nOptions.transSupportBasicHtmlNodes && keepArray.indexOf(node.name) > -1) {\n              if (node.voidElement) {\n                mem.push(React.createElement(node.name, {\n                  key: `${node.name}-${i}`\n                }));\n              } else {\n                const inner = mapAST(reactNodes, node.children, rootReactNode);\n                mem.push(React.createElement(node.name, {\n                  key: `${node.name}-${i}`\n                }, inner));\n              }\n            } else if (node.voidElement) {\n              mem.push(`<${node.name} />`);\n            } else {\n              const inner = mapAST(reactNodes, node.children, rootReactNode);\n              mem.push(`<${node.name}>${inner}</${node.name}>`);\n            }\n          } else if (isObject(child) && !isElement) {\n            const content = node.children[0] ? translationContent : null;\n            if (content) mem.push(content);\n          } else {\n            pushTranslatedJSX(child, translationContent, mem, i, node.children.length !== 1 || !translationContent);\n          }\n        } else if (node.type === 'text') {\n          const wrapTextNodes = i18nOptions.transWrapTextNodes;\n          const unescapeFn = typeof i18nOptions.unescape === 'function' ? i18nOptions.unescape : getDefaults().unescape;\n          const content = shouldUnescape ? unescapeFn(i18n.services.interpolator.interpolate(node.content, opts, i18n.language)) : i18n.services.interpolator.interpolate(node.content, opts, i18n.language);\n          if (wrapTextNodes) {\n            mem.push(React.createElement(wrapTextNodes, {\n              key: `${node.name}-${i}`\n            }, content));\n          } else {\n            mem.push(content);\n          }\n        }\n        return mem;\n      }, []);\n    };\n    const result = mapAST([{\n      dummy: true,\n      children: children || []\n    }], ast, getAsArray(children || []));\n    return getChildren(result[0]);\n  };\n  const fixComponentProps = (component, index, translation) => {\n    const componentKey = component.key || index;\n    const comp = React.cloneElement(component, {\n      key: componentKey\n    });\n    if (!comp.props || !comp.props.children || translation.indexOf(`${index}/>`) < 0 && translation.indexOf(`${index} />`) < 0) {\n      return comp;\n    }\n    function Componentized() {\n      return React.createElement(React.Fragment, null, comp);\n    }\n    return React.createElement(Componentized, {\n      key: componentKey\n    });\n  };\n  const generateArrayComponents = (components, translation) => components.map((c, index) => fixComponentProps(c, index, translation));\n  const generateObjectComponents = (components, translation) => {\n    const componentMap = {};\n    Object.keys(components).forEach(c => {\n      Object.assign(componentMap, {\n        [c]: fixComponentProps(components[c], c, translation)\n      });\n    });\n    return componentMap;\n  };\n  const generateComponents = (components, translation, i18n, i18nKey) => {\n    if (!components) return null;\n    if (Array.isArray(components)) {\n      return generateArrayComponents(components, translation);\n    }\n    if (isObject(components)) {\n      return generateObjectComponents(components, translation);\n    }\n    warnOnce(i18n, 'TRANS_INVALID_COMPONENTS', `<Trans /> \"components\" prop expects an object or array`, {\n      i18nKey\n    });\n    return null;\n  };\n  const isComponentsMap = object => {\n    if (!isObject(object)) return false;\n    if (Array.isArray(object)) return false;\n    return Object.keys(object).reduce((acc, key) => acc && Number.isNaN(Number.parseFloat(key)), true);\n  };\n  function Trans$1({\n    children,\n    count,\n    parent,\n    i18nKey,\n    context,\n    tOptions = {},\n    values,\n    defaults,\n    components,\n    ns,\n    i18n: i18nFromProps,\n    t: tFromProps,\n    shouldUnescape,\n    ...additionalProps\n  }) {\n    const i18n = i18nFromProps || getI18n();\n    if (!i18n) {\n      warnOnce(i18n, 'NO_I18NEXT_INSTANCE', `Trans: You need to pass in an i18next instance using i18nextReactModule`, {\n        i18nKey\n      });\n      return children;\n    }\n    const t = tFromProps || i18n.t.bind(i18n) || (k => k);\n    const reactI18nextOptions = {\n      ...getDefaults(),\n      ...i18n.options?.react\n    };\n    let namespaces = ns || t.ns || i18n.options?.defaultNS;\n    namespaces = isString(namespaces) ? [namespaces] : namespaces || ['translation'];\n    const {\n      transDefaultProps\n    } = reactI18nextOptions;\n    const mergedTOptions = transDefaultProps?.tOptions ? {\n      ...transDefaultProps.tOptions,\n      ...tOptions\n    } : tOptions;\n    const mergedShouldUnescape = shouldUnescape ?? transDefaultProps?.shouldUnescape;\n    const mergedValues = transDefaultProps?.values ? {\n      ...transDefaultProps.values,\n      ...values\n    } : values;\n    const mergedComponents = transDefaultProps?.components ? {\n      ...transDefaultProps.components,\n      ...components\n    } : components;\n    const nodeAsString = nodesToString(children, reactI18nextOptions, i18n, i18nKey);\n    const defaultValue = defaults || mergedTOptions?.defaultValue || nodeAsString || reactI18nextOptions.transEmptyNodeValue || (typeof i18nKey === 'function' ? keysFromSelector(i18nKey) : i18nKey);\n    const {\n      hashTransKey\n    } = reactI18nextOptions;\n    const key = i18nKey || (hashTransKey ? hashTransKey(nodeAsString || defaultValue) : nodeAsString || defaultValue);\n    if (i18n.options?.interpolation?.defaultVariables) {\n      values = mergedValues && Object.keys(mergedValues).length > 0 ? {\n        ...mergedValues,\n        ...i18n.options.interpolation.defaultVariables\n      } : {\n        ...i18n.options.interpolation.defaultVariables\n      };\n    } else {\n      values = mergedValues;\n    }\n    const valuesFromChildren = getValuesFromChildren(children);\n    if (valuesFromChildren && typeof valuesFromChildren.count === 'number' && count === undefined) {\n      count = valuesFromChildren.count;\n    }\n    const interpolationOverride = values || count !== undefined && !i18n.options?.interpolation?.alwaysFormat || !children ? mergedTOptions.interpolation : {\n      interpolation: {\n        ...mergedTOptions.interpolation,\n        prefix: '#$?',\n        suffix: '?$#'\n      }\n    };\n    const combinedTOpts = {\n      ...mergedTOptions,\n      context: context || mergedTOptions.context,\n      count,\n      ...values,\n      ...interpolationOverride,\n      defaultValue,\n      ns: namespaces\n    };\n    let translation = key ? t(key, combinedTOpts) : defaultValue;\n    if (translation === key && defaultValue) translation = defaultValue;\n    const generatedComponents = generateComponents(mergedComponents, translation, i18n, i18nKey);\n    let indexedChildren = generatedComponents || children;\n    let componentsMap = null;\n    if (isComponentsMap(generatedComponents)) {\n      componentsMap = generatedComponents;\n      indexedChildren = children;\n    }\n    const content = renderNodes(indexedChildren, componentsMap, translation, i18n, reactI18nextOptions, combinedTOpts, mergedShouldUnescape);\n    const useAsParent = parent ?? reactI18nextOptions.defaultTransParent;\n    return useAsParent ? React.createElement(useAsParent, additionalProps, content) : content;\n  }\n\n  const initReactI18next = {\n    type: '3rdParty',\n    init(instance) {\n      setDefaults(instance.options.react);\n      setI18n(instance);\n    }\n  };\n\n  const I18nContext = React.createContext();\n  class ReportNamespaces {\n    constructor() {\n      this.usedNamespaces = {};\n    }\n    addUsedNamespaces(namespaces) {\n      namespaces.forEach(ns => {\n        if (!this.usedNamespaces[ns]) this.usedNamespaces[ns] = true;\n      });\n    }\n    getUsedNamespaces() {\n      return Object.keys(this.usedNamespaces);\n    }\n  }\n  const composeInitialProps = ForComponent => async ctx => {\n    const componentsInitialProps = (await ForComponent.getInitialProps?.(ctx)) ?? {};\n    const i18nInitialProps = getInitialProps();\n    return {\n      ...componentsInitialProps,\n      ...i18nInitialProps\n    };\n  };\n  const getInitialProps = () => {\n    const i18n = getI18n();\n    if (!i18n) {\n      console.warn('react-i18next:: getInitialProps: You will need to pass in an i18next instance by using initReactI18next');\n      return {};\n    }\n    const namespaces = i18n.reportNamespaces?.getUsedNamespaces() ?? [];\n    const ret = {};\n    const initialI18nStore = {};\n    i18n.languages.forEach(l => {\n      initialI18nStore[l] = {};\n      namespaces.forEach(ns => {\n        initialI18nStore[l][ns] = i18n.getResourceBundle(l, ns) || {};\n      });\n    });\n    ret.initialI18nStore = initialI18nStore;\n    ret.initialLanguage = i18n.language;\n    return ret;\n  };\n\n  function Trans({\n    children,\n    count,\n    parent,\n    i18nKey,\n    context,\n    tOptions = {},\n    values,\n    defaults,\n    components,\n    ns,\n    i18n: i18nFromProps,\n    t: tFromProps,\n    shouldUnescape,\n    ...additionalProps\n  }) {\n    const {\n      i18n: i18nFromContext,\n      defaultNS: defaultNSFromContext\n    } = React.useContext(I18nContext) || {};\n    const i18n = i18nFromProps || i18nFromContext || getI18n();\n    const t = tFromProps || i18n?.t.bind(i18n);\n    return Trans$1({\n      children,\n      count,\n      parent,\n      i18nKey,\n      context,\n      tOptions,\n      values,\n      defaults,\n      components,\n      ns: ns || t?.ns || defaultNSFromContext || i18n?.options?.defaultNS,\n      i18n,\n      t: tFromProps,\n      shouldUnescape,\n      ...additionalProps\n    });\n  }\n\n  class TranslationParserError extends Error {\n    constructor(message, position, translationString) {\n      super(message);\n      this.name = 'TranslationParserError';\n      this.position = position;\n      this.translationString = translationString;\n      if (Error.captureStackTrace) {\n        Error.captureStackTrace(this, TranslationParserError);\n      }\n    }\n  }\n\n  const commonEntities = {\n    '&nbsp;': '\\u00A0',\n    '&amp;': '&',\n    '&lt;': '<',\n    '&gt;': '>',\n    '&quot;': '\"',\n    '&apos;': \"'\",\n    '&copy;': '©',\n    '&reg;': '®',\n    '&trade;': '™',\n    '&hellip;': '…',\n    '&ndash;': '–',\n    '&mdash;': '—',\n    '&lsquo;': '\\u2018',\n    '&rsquo;': '\\u2019',\n    '&sbquo;': '\\u201A',\n    '&ldquo;': '\\u201C',\n    '&rdquo;': '\\u201D',\n    '&bdquo;': '\\u201E',\n    '&dagger;': '†',\n    '&Dagger;': '‡',\n    '&bull;': '•',\n    '&prime;': '′',\n    '&Prime;': '″',\n    '&lsaquo;': '‹',\n    '&rsaquo;': '›',\n    '&sect;': '§',\n    '&para;': '¶',\n    '&middot;': '·',\n    '&ensp;': '\\u2002',\n    '&emsp;': '\\u2003',\n    '&thinsp;': '\\u2009',\n    '&euro;': '€',\n    '&pound;': '£',\n    '&yen;': '¥',\n    '&cent;': '¢',\n    '&curren;': '¤',\n    '&times;': '×',\n    '&divide;': '÷',\n    '&minus;': '−',\n    '&plusmn;': '±',\n    '&ne;': '≠',\n    '&le;': '≤',\n    '&ge;': '≥',\n    '&asymp;': '≈',\n    '&equiv;': '≡',\n    '&infin;': '∞',\n    '&int;': '∫',\n    '&sum;': '∑',\n    '&prod;': '∏',\n    '&radic;': '√',\n    '&part;': '∂',\n    '&permil;': '‰',\n    '&deg;': '°',\n    '&micro;': 'µ',\n    '&larr;': '←',\n    '&uarr;': '↑',\n    '&rarr;': '→',\n    '&darr;': '↓',\n    '&harr;': '↔',\n    '&crarr;': '↵',\n    '&lArr;': '⇐',\n    '&uArr;': '⇑',\n    '&rArr;': '⇒',\n    '&dArr;': '⇓',\n    '&hArr;': '⇔',\n    '&alpha;': 'α',\n    '&beta;': 'β',\n    '&gamma;': 'γ',\n    '&delta;': 'δ',\n    '&epsilon;': 'ε',\n    '&zeta;': 'ζ',\n    '&eta;': 'η',\n    '&theta;': 'θ',\n    '&iota;': 'ι',\n    '&kappa;': 'κ',\n    '&lambda;': 'λ',\n    '&mu;': 'μ',\n    '&nu;': 'ν',\n    '&xi;': 'ξ',\n    '&omicron;': 'ο',\n    '&pi;': 'π',\n    '&rho;': 'ρ',\n    '&sigma;': 'σ',\n    '&tau;': 'τ',\n    '&upsilon;': 'υ',\n    '&phi;': 'φ',\n    '&chi;': 'χ',\n    '&psi;': 'ψ',\n    '&omega;': 'ω',\n    '&Alpha;': 'Α',\n    '&Beta;': 'Β',\n    '&Gamma;': 'Γ',\n    '&Delta;': 'Δ',\n    '&Epsilon;': 'Ε',\n    '&Zeta;': 'Ζ',\n    '&Eta;': 'Η',\n    '&Theta;': 'Θ',\n    '&Iota;': 'Ι',\n    '&Kappa;': 'Κ',\n    '&Lambda;': 'Λ',\n    '&Mu;': 'Μ',\n    '&Nu;': 'Ν',\n    '&Xi;': 'Ξ',\n    '&Omicron;': 'Ο',\n    '&Pi;': 'Π',\n    '&Rho;': 'Ρ',\n    '&Sigma;': 'Σ',\n    '&Tau;': 'Τ',\n    '&Upsilon;': 'Υ',\n    '&Phi;': 'Φ',\n    '&Chi;': 'Χ',\n    '&Psi;': 'Ψ',\n    '&Omega;': 'Ω',\n    '&Agrave;': 'À',\n    '&Aacute;': 'Á',\n    '&Acirc;': 'Â',\n    '&Atilde;': 'Ã',\n    '&Auml;': 'Ä',\n    '&Aring;': 'Å',\n    '&AElig;': 'Æ',\n    '&Ccedil;': 'Ç',\n    '&Egrave;': 'È',\n    '&Eacute;': 'É',\n    '&Ecirc;': 'Ê',\n    '&Euml;': 'Ë',\n    '&Igrave;': 'Ì',\n    '&Iacute;': 'Í',\n    '&Icirc;': 'Î',\n    '&Iuml;': 'Ï',\n    '&ETH;': 'Ð',\n    '&Ntilde;': 'Ñ',\n    '&Ograve;': 'Ò',\n    '&Oacute;': 'Ó',\n    '&Ocirc;': 'Ô',\n    '&Otilde;': 'Õ',\n    '&Ouml;': 'Ö',\n    '&Oslash;': 'Ø',\n    '&Ugrave;': 'Ù',\n    '&Uacute;': 'Ú',\n    '&Ucirc;': 'Û',\n    '&Uuml;': 'Ü',\n    '&Yacute;': 'Ý',\n    '&THORN;': 'Þ',\n    '&szlig;': 'ß',\n    '&agrave;': 'à',\n    '&aacute;': 'á',\n    '&acirc;': 'â',\n    '&atilde;': 'ã',\n    '&auml;': 'ä',\n    '&aring;': 'å',\n    '&aelig;': 'æ',\n    '&ccedil;': 'ç',\n    '&egrave;': 'è',\n    '&eacute;': 'é',\n    '&ecirc;': 'ê',\n    '&euml;': 'ë',\n    '&igrave;': 'ì',\n    '&iacute;': 'í',\n    '&icirc;': 'î',\n    '&iuml;': 'ï',\n    '&eth;': 'ð',\n    '&ntilde;': 'ñ',\n    '&ograve;': 'ò',\n    '&oacute;': 'ó',\n    '&ocirc;': 'ô',\n    '&otilde;': 'õ',\n    '&ouml;': 'ö',\n    '&oslash;': 'ø',\n    '&ugrave;': 'ù',\n    '&uacute;': 'ú',\n    '&ucirc;': 'û',\n    '&uuml;': 'ü',\n    '&yacute;': 'ý',\n    '&thorn;': 'þ',\n    '&yuml;': 'ÿ',\n    '&iexcl;': '¡',\n    '&iquest;': '¿',\n    '&fnof;': 'ƒ',\n    '&circ;': 'ˆ',\n    '&tilde;': '˜',\n    '&OElig;': 'Œ',\n    '&oelig;': 'œ',\n    '&Scaron;': 'Š',\n    '&scaron;': 'š',\n    '&Yuml;': 'Ÿ',\n    '&ordf;': 'ª',\n    '&ordm;': 'º',\n    '&macr;': '¯',\n    '&acute;': '´',\n    '&cedil;': '¸',\n    '&sup1;': '¹',\n    '&sup2;': '²',\n    '&sup3;': '³',\n    '&frac14;': '¼',\n    '&frac12;': '½',\n    '&frac34;': '¾',\n    '&spades;': '♠',\n    '&clubs;': '♣',\n    '&hearts;': '♥',\n    '&diams;': '♦',\n    '&loz;': '◊',\n    '&oline;': '‾',\n    '&frasl;': '⁄',\n    '&weierp;': '℘',\n    '&image;': 'ℑ',\n    '&real;': 'ℜ',\n    '&alefsym;': 'ℵ'\n  };\n  const entityPattern = new RegExp(Object.keys(commonEntities).map(entity => entity.replace(/[.*+?^${}()|[\\]\\\\]/g, '\\\\$&')).join('|'), 'g');\n  const decodeHtmlEntities = text => text.replace(entityPattern, match => commonEntities[match]).replace(/&#(\\d+);/g, (_, num) => String.fromCharCode(parseInt(num, 10))).replace(/&#x([0-9a-fA-F]+);/g, (_, hex) => String.fromCharCode(parseInt(hex, 16)));\n\n  const tokenize = translation => {\n    const tokens = [];\n    let position = 0;\n    let currentText = '';\n    const flushText = () => {\n      if (currentText) {\n        tokens.push({\n          type: 'Text',\n          value: currentText,\n          position: position - currentText.length\n        });\n        currentText = '';\n      }\n    };\n    while (position < translation.length) {\n      const char = translation[position];\n      if (char === '<') {\n        const tagMatch = translation.slice(position).match(/^<(\\d+)>/);\n        if (tagMatch) {\n          flushText();\n          tokens.push({\n            type: 'TagOpen',\n            value: tagMatch[0],\n            position,\n            tagNumber: parseInt(tagMatch[1], 10)\n          });\n          position += tagMatch[0].length;\n        } else {\n          const closeTagMatch = translation.slice(position).match(/^<\\/(\\d+)>/);\n          if (closeTagMatch) {\n            flushText();\n            tokens.push({\n              type: 'TagClose',\n              value: closeTagMatch[0],\n              position,\n              tagNumber: parseInt(closeTagMatch[1], 10)\n            });\n            position += closeTagMatch[0].length;\n          } else {\n            currentText += char;\n            position += 1;\n          }\n        }\n      } else {\n        currentText += char;\n        position += 1;\n      }\n    }\n    flushText();\n    return tokens;\n  };\n\n  const renderDeclarationNode = (declaration, children, childDeclarations) => {\n    const {\n      type,\n      props = {}\n    } = declaration;\n    if (props.children && Array.isArray(props.children) && childDeclarations) {\n      const {\n        children: _childrenToRemove,\n        ...propsWithoutChildren\n      } = props;\n      return React.createElement(type, propsWithoutChildren, ...children);\n    }\n    if (children.length === 0) {\n      return React.createElement(type, props);\n    }\n    if (children.length === 1) {\n      return React.createElement(type, props, children[0]);\n    }\n    return React.createElement(type, props, ...children);\n  };\n  const renderTranslation = (translation, declarations = []) => {\n    if (!translation) {\n      return [];\n    }\n    const tokens = tokenize(translation);\n    const result = [];\n    const stack = [];\n    const literalTagNumbers = new Set();\n    const getCurrentDeclarations = () => {\n      if (stack.length === 0) {\n        return declarations;\n      }\n      const parentFrame = stack[stack.length - 1];\n      if (parentFrame.declaration.props?.children && Array.isArray(parentFrame.declaration.props.children)) {\n        return parentFrame.declaration.props.children;\n      }\n      return parentFrame.declarations;\n    };\n    tokens.forEach(token => {\n      switch (token.type) {\n        case 'Text':\n          {\n            const decoded = decodeHtmlEntities(token.value);\n            const targetArray = stack.length > 0 ? stack[stack.length - 1].children : result;\n            targetArray.push(decoded);\n          }\n          break;\n        case 'TagOpen':\n          {\n            const {\n              tagNumber\n            } = token;\n            const currentDeclarations = getCurrentDeclarations();\n            const declaration = currentDeclarations[tagNumber];\n            if (!declaration) {\n              literalTagNumbers.add(tagNumber);\n              const literalText = `<${tagNumber}>`;\n              const targetArray = stack.length > 0 ? stack[stack.length - 1].children : result;\n              targetArray.push(literalText);\n              break;\n            }\n            stack.push({\n              tagNumber,\n              children: [],\n              position: token.position,\n              declaration,\n              declarations: currentDeclarations\n            });\n          }\n          break;\n        case 'TagClose':\n          {\n            const {\n              tagNumber\n            } = token;\n            if (literalTagNumbers.has(tagNumber)) {\n              const literalText = `</${tagNumber}>`;\n              const literalTargetArray = stack.length > 0 ? stack[stack.length - 1].children : result;\n              literalTargetArray.push(literalText);\n              literalTagNumbers.delete(tagNumber);\n              break;\n            }\n            if (stack.length === 0) {\n              throw new TranslationParserError(`Unexpected closing tag </${tagNumber}> at position ${token.position}`, token.position, translation);\n            }\n            const frame = stack.pop();\n            if (frame.tagNumber !== tagNumber) {\n              throw new TranslationParserError(`Mismatched tags: expected </${frame.tagNumber}> but got </${tagNumber}> at position ${token.position}`, token.position, translation);\n            }\n            const element = renderDeclarationNode(frame.declaration, frame.children, frame.declarations);\n            const elementTargetArray = stack.length > 0 ? stack[stack.length - 1].children : result;\n            elementTargetArray.push(element);\n          }\n          break;\n      }\n    });\n    if (stack.length > 0) {\n      const unclosed = stack[stack.length - 1];\n      throw new TranslationParserError(`Unclosed tag <${unclosed.tagNumber}> at position ${unclosed.position}`, unclosed.position, translation);\n    }\n    return result;\n  };\n\n  function IcuTransWithoutContext({\n    i18nKey,\n    defaultTranslation,\n    content,\n    ns,\n    values = {},\n    i18n: i18nFromProps,\n    t: tFromProps\n  }) {\n    const i18n = i18nFromProps || getI18n();\n    if (!i18n) {\n      warnOnce(i18n, 'NO_I18NEXT_INSTANCE', `IcuTrans: You need to pass in an i18next instance using i18nextReactModule`, {\n        i18nKey\n      });\n      return React.createElement(React.Fragment, {}, defaultTranslation);\n    }\n    const t = tFromProps || i18n.t?.bind(i18n) || (k => k);\n    let namespaces = ns || t.ns || i18n.options?.defaultNS;\n    namespaces = isString(namespaces) ? [namespaces] : namespaces || ['translation'];\n    let mergedValues = values;\n    if (i18n.options?.interpolation?.defaultVariables) {\n      mergedValues = values && Object.keys(values).length > 0 ? {\n        ...values,\n        ...i18n.options.interpolation.defaultVariables\n      } : {\n        ...i18n.options.interpolation.defaultVariables\n      };\n    }\n    const translation = t(i18nKey, {\n      defaultValue: defaultTranslation,\n      ...mergedValues,\n      ns: namespaces\n    });\n    try {\n      const rendered = renderTranslation(translation, content);\n      return React.createElement(React.Fragment, {}, ...rendered);\n    } catch (error) {\n      warn(i18n, 'ICU_TRANS_RENDER_ERROR', `IcuTrans component error for key \"${i18nKey}\": ${error.message}`, {\n        i18nKey,\n        error\n      });\n      return React.createElement(React.Fragment, {}, translation);\n    }\n  }\n  IcuTransWithoutContext.displayName = 'IcuTransWithoutContext';\n\n  function IcuTrans({\n    i18nKey,\n    defaultTranslation,\n    content,\n    ns,\n    values = {},\n    i18n: i18nFromProps,\n    t: tFromProps\n  }) {\n    const {\n      i18n: i18nFromContext,\n      defaultNS: defaultNSFromContext\n    } = React.useContext(I18nContext) || {};\n    const i18n = i18nFromProps || i18nFromContext || getI18n();\n    const t = tFromProps || i18n?.t.bind(i18n);\n    return IcuTransWithoutContext({\n      i18nKey,\n      defaultTranslation,\n      content,\n      ns: ns || t?.ns || defaultNSFromContext || i18n?.options?.defaultNS,\n      values,\n      i18n,\n      t: tFromProps\n    });\n  }\n  IcuTrans.displayName = 'IcuTrans';\n\n  var shim = {exports: {}};\n\n  var useSyncExternalStoreShim_development = {};\n\n  /**\n   * @license React\n   * use-sync-external-store-shim.development.js\n   *\n   * Copyright (c) Meta Platforms, Inc. and affiliates.\n   *\n   * This source code is licensed under the MIT license found in the\n   * LICENSE file in the root directory of this source tree.\n   */\n\n  (function () {\n    function is(x, y) {\n      return x === y && (0 !== x || 1 / x === 1 / y) || x !== x && y !== y;\n    }\n    function useSyncExternalStore$2(subscribe, getSnapshot) {\n      didWarnOld18Alpha || void 0 === React$1.startTransition || (didWarnOld18Alpha = true, console.error(\"You are using an outdated, pre-release alpha of React 18 that does not support useSyncExternalStore. The use-sync-external-store shim will not work correctly. Upgrade to a newer pre-release.\"));\n      var value = getSnapshot();\n      if (!didWarnUncachedGetSnapshot) {\n        var cachedValue = getSnapshot();\n        objectIs(value, cachedValue) || (console.error(\"The result of getSnapshot should be cached to avoid an infinite loop\"), didWarnUncachedGetSnapshot = true);\n      }\n      cachedValue = useState({\n        inst: {\n          value: value,\n          getSnapshot: getSnapshot\n        }\n      });\n      var inst = cachedValue[0].inst,\n        forceUpdate = cachedValue[1];\n      useLayoutEffect(function () {\n        inst.value = value;\n        inst.getSnapshot = getSnapshot;\n        checkIfSnapshotChanged(inst) && forceUpdate({\n          inst: inst\n        });\n      }, [subscribe, value, getSnapshot]);\n      useEffect(function () {\n        checkIfSnapshotChanged(inst) && forceUpdate({\n          inst: inst\n        });\n        return subscribe(function () {\n          checkIfSnapshotChanged(inst) && forceUpdate({\n            inst: inst\n          });\n        });\n      }, [subscribe]);\n      useDebugValue(value);\n      return value;\n    }\n    function checkIfSnapshotChanged(inst) {\n      var latestGetSnapshot = inst.getSnapshot;\n      inst = inst.value;\n      try {\n        var nextValue = latestGetSnapshot();\n        return !objectIs(inst, nextValue);\n      } catch (error) {\n        return true;\n      }\n    }\n    function useSyncExternalStore$1(subscribe, getSnapshot) {\n      return getSnapshot();\n    }\n    \"undefined\" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ && \"function\" === typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(Error());\n    var React$1 = React,\n      objectIs = \"function\" === typeof Object.is ? Object.is : is,\n      useState = React$1.useState,\n      useEffect = React$1.useEffect,\n      useLayoutEffect = React$1.useLayoutEffect,\n      useDebugValue = React$1.useDebugValue,\n      didWarnOld18Alpha = false,\n      didWarnUncachedGetSnapshot = false,\n      shim = \"undefined\" === typeof window || \"undefined\" === typeof window.document || \"undefined\" === typeof window.document.createElement ? useSyncExternalStore$1 : useSyncExternalStore$2;\n    useSyncExternalStoreShim_development.useSyncExternalStore = void 0 !== React$1.useSyncExternalStore ? React$1.useSyncExternalStore : shim;\n    \"undefined\" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ && \"function\" === typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(Error());\n  })();\n\n  {\n    shim.exports = useSyncExternalStoreShim_development;\n  }\n\n  var shimExports = shim.exports;\n\n  const notReadyT = (k, optsOrDefaultValue) => {\n    if (isString(optsOrDefaultValue)) return optsOrDefaultValue;\n    if (isObject(optsOrDefaultValue) && isString(optsOrDefaultValue.defaultValue)) return optsOrDefaultValue.defaultValue;\n    if (typeof k === 'function') return '';\n    if (Array.isArray(k)) {\n      const last = k[k.length - 1];\n      return typeof last === 'function' ? '' : last;\n    }\n    return k;\n  };\n  const notReadySnapshot = {\n    t: notReadyT,\n    ready: false\n  };\n  const dummySubscribe = () => () => {};\n  const useTranslation = (ns, props = {}) => {\n    const {\n      i18n: i18nFromProps\n    } = props;\n    const {\n      i18n: i18nFromContext,\n      defaultNS: defaultNSFromContext\n    } = React.useContext(I18nContext) || {};\n    const i18n = i18nFromProps || i18nFromContext || getI18n();\n    if (i18n && !i18n.reportNamespaces) i18n.reportNamespaces = new ReportNamespaces();\n    if (!i18n) {\n      warnOnce(i18n, 'NO_I18NEXT_INSTANCE', 'useTranslation: You will need to pass in an i18next instance by using initReactI18next');\n    }\n    const i18nOptions = React.useMemo(() => ({\n      ...getDefaults(),\n      ...i18n?.options?.react,\n      ...props\n    }), [i18n, props]);\n    const {\n      useSuspense,\n      keyPrefix\n    } = i18nOptions;\n    const nsOrContext = ns || defaultNSFromContext || i18n?.options?.defaultNS;\n    const unstableNamespaces = isString(nsOrContext) ? [nsOrContext] : nsOrContext || ['translation'];\n    const namespaces = React.useMemo(() => unstableNamespaces, unstableNamespaces);\n    i18n?.reportNamespaces?.addUsedNamespaces?.(namespaces);\n    const revisionRef = React.useRef(0);\n    const subscribe = React.useCallback(callback => {\n      if (!i18n) return dummySubscribe;\n      const {\n        bindI18n,\n        bindI18nStore\n      } = i18nOptions;\n      const wrappedCallback = () => {\n        revisionRef.current += 1;\n        callback();\n      };\n      if (bindI18n) i18n.on(bindI18n, wrappedCallback);\n      if (bindI18nStore) i18n.store.on(bindI18nStore, wrappedCallback);\n      return () => {\n        if (bindI18n) bindI18n.split(' ').forEach(e => i18n.off(e, wrappedCallback));\n        if (bindI18nStore) bindI18nStore.split(' ').forEach(e => i18n.store.off(e, wrappedCallback));\n      };\n    }, [i18n, i18nOptions]);\n    const snapshotRef = React.useRef();\n    const getSnapshot = React.useCallback(() => {\n      if (!i18n) {\n        return notReadySnapshot;\n      }\n      const calculatedReady = !!(i18n.isInitialized || i18n.initializedStoreOnce) && namespaces.every(n => hasLoadedNamespace(n, i18n, i18nOptions));\n      const currentLng = props.lng || i18n.language;\n      const currentRevision = revisionRef.current;\n      const lastSnapshot = snapshotRef.current;\n      if (lastSnapshot && lastSnapshot.ready === calculatedReady && lastSnapshot.lng === currentLng && lastSnapshot.keyPrefix === keyPrefix && lastSnapshot.revision === currentRevision) {\n        return lastSnapshot;\n      }\n      const calculatedT = i18n.getFixedT(currentLng, i18nOptions.nsMode === 'fallback' ? namespaces : namespaces[0], keyPrefix);\n      const newSnapshot = {\n        t: calculatedT,\n        ready: calculatedReady,\n        lng: currentLng,\n        keyPrefix,\n        revision: currentRevision\n      };\n      snapshotRef.current = newSnapshot;\n      return newSnapshot;\n    }, [i18n, namespaces, keyPrefix, i18nOptions, props.lng]);\n    const [loadCount, setLoadCount] = React.useState(0);\n    const {\n      t,\n      ready\n    } = shimExports.useSyncExternalStore(subscribe, getSnapshot, getSnapshot);\n    React.useEffect(() => {\n      if (i18n && !ready && !useSuspense) {\n        const onLoaded = () => setLoadCount(c => c + 1);\n        if (props.lng) {\n          loadLanguages(i18n, props.lng, namespaces, onLoaded);\n        } else {\n          loadNamespaces(i18n, namespaces, onLoaded);\n        }\n      }\n    }, [i18n, props.lng, namespaces, ready, useSuspense, loadCount]);\n    const finalI18n = i18n || {};\n    const wrapperRef = React.useRef(null);\n    const wrapperLangRef = React.useRef();\n    const createI18nWrapper = original => {\n      const descriptors = Object.getOwnPropertyDescriptors(original);\n      if (descriptors.__original) delete descriptors.__original;\n      const wrapper = Object.create(Object.getPrototypeOf(original), descriptors);\n      if (!Object.prototype.hasOwnProperty.call(wrapper, '__original')) {\n        try {\n          Object.defineProperty(wrapper, '__original', {\n            value: original,\n            writable: false,\n            enumerable: false,\n            configurable: false\n          });\n        } catch (_) {}\n      }\n      return wrapper;\n    };\n    const ret = React.useMemo(() => {\n      const original = finalI18n;\n      const lang = original?.language;\n      let i18nWrapper = original;\n      if (original) {\n        if (wrapperRef.current && wrapperRef.current.__original === original) {\n          if (wrapperLangRef.current !== lang) {\n            i18nWrapper = createI18nWrapper(original);\n            wrapperRef.current = i18nWrapper;\n            wrapperLangRef.current = lang;\n          } else {\n            i18nWrapper = wrapperRef.current;\n          }\n        } else {\n          i18nWrapper = createI18nWrapper(original);\n          wrapperRef.current = i18nWrapper;\n          wrapperLangRef.current = lang;\n        }\n      }\n      const arr = [t, i18nWrapper, ready];\n      arr.t = t;\n      arr.i18n = i18nWrapper;\n      arr.ready = ready;\n      return arr;\n    }, [t, finalI18n, ready, finalI18n.resolvedLanguage, finalI18n.language, finalI18n.languages]);\n    if (i18n && useSuspense && !ready) {\n      throw new Promise(resolve => {\n        const onLoaded = () => resolve();\n        if (props.lng) {\n          loadLanguages(i18n, props.lng, namespaces, onLoaded);\n        } else {\n          loadNamespaces(i18n, namespaces, onLoaded);\n        }\n      });\n    }\n    return ret;\n  };\n\n  const withTranslation = (ns, options = {}) => function Extend(WrappedComponent) {\n    function I18nextWithTranslation({\n      forwardedRef,\n      ...rest\n    }) {\n      const [t, i18n, ready] = useTranslation(ns, {\n        ...rest,\n        keyPrefix: options.keyPrefix\n      });\n      const passDownProps = {\n        ...rest,\n        t,\n        i18n,\n        tReady: ready\n      };\n      if (options.withRef && forwardedRef) {\n        passDownProps.ref = forwardedRef;\n      } else if (!options.withRef && forwardedRef) {\n        passDownProps.forwardedRef = forwardedRef;\n      }\n      return React.createElement(WrappedComponent, passDownProps);\n    }\n    I18nextWithTranslation.displayName = `withI18nextTranslation(${getDisplayName(WrappedComponent)})`;\n    I18nextWithTranslation.WrappedComponent = WrappedComponent;\n    const forwardRef = (props, ref) => React.createElement(I18nextWithTranslation, Object.assign({}, props, {\n      forwardedRef: ref\n    }));\n    return options.withRef ? React.forwardRef(forwardRef) : I18nextWithTranslation;\n  };\n\n  const Translation = ({\n    ns,\n    children,\n    ...options\n  }) => {\n    const [t, i18n, ready] = useTranslation(ns, options);\n    return children(t, {\n      i18n,\n      lng: i18n?.language\n    }, ready);\n  };\n\n  function I18nextProvider({\n    i18n,\n    defaultNS,\n    children\n  }) {\n    const value = React.useMemo(() => ({\n      i18n,\n      defaultNS\n    }), [i18n, defaultNS]);\n    return React.createElement(I18nContext.Provider, {\n      value\n    }, children);\n  }\n\n  const useSSR = (initialI18nStore, initialLanguage, props = {}) => {\n    const {\n      i18n: i18nFromProps\n    } = props;\n    const {\n      i18n: i18nFromContext\n    } = React.useContext(I18nContext) || {};\n    const i18n = i18nFromProps || i18nFromContext || getI18n();\n    if (!i18n) {\n      warnOnce(i18n, 'NO_I18NEXT_INSTANCE', 'useSSR: You will need to pass in an i18next instance by using initReactI18next or by passing it via props or context. In monorepo setups, make sure there is only one instance of react-i18next.');\n      return;\n    }\n    if (i18n.options?.isClone) return;\n    if (initialI18nStore && !i18n.initializedStoreOnce) {\n      if (!i18n.services?.resourceStore) {\n        warnOnce(i18n, 'I18N_NOT_INITIALIZED', 'useSSR: i18n instance was found but not initialized (services.resourceStore is missing). Make sure you call i18next.init() before using useSSR — e.g. at module level, not only in getStaticProps/getServerSideProps.');\n        return;\n      }\n      i18n.services.resourceStore.data = initialI18nStore;\n      i18n.options.ns = Object.values(initialI18nStore).reduce((mem, lngResources) => {\n        Object.keys(lngResources).forEach(ns => {\n          if (mem.indexOf(ns) < 0) mem.push(ns);\n        });\n        return mem;\n      }, i18n.options.ns);\n      i18n.initializedStoreOnce = true;\n      i18n.isInitialized = true;\n    }\n    if (initialLanguage && !i18n.initializedLanguageOnce) {\n      i18n.changeLanguage(initialLanguage);\n      i18n.initializedLanguageOnce = true;\n    }\n  };\n\n  const withSSR = () => function Extend(WrappedComponent) {\n    function I18nextWithSSR({\n      initialI18nStore,\n      initialLanguage,\n      ...rest\n    }) {\n      useSSR(initialI18nStore, initialLanguage);\n      return React.createElement(WrappedComponent, {\n        ...rest\n      });\n    }\n    I18nextWithSSR.getInitialProps = composeInitialProps(WrappedComponent);\n    I18nextWithSSR.displayName = `withI18nextSSR(${getDisplayName(WrappedComponent)})`;\n    I18nextWithSSR.WrappedComponent = WrappedComponent;\n    return I18nextWithSSR;\n  };\n\n  const date = () => '';\n  const time = () => '';\n  const number = () => '';\n  const select = () => '';\n  const plural = () => '';\n  const selectOrdinal = () => '';\n\n  exports.I18nContext = I18nContext;\n  exports.I18nextProvider = I18nextProvider;\n  exports.IcuTrans = IcuTrans;\n  exports.IcuTransWithoutContext = IcuTransWithoutContext;\n  exports.Trans = Trans;\n  exports.TransWithoutContext = Trans$1;\n  exports.Translation = Translation;\n  exports.composeInitialProps = composeInitialProps;\n  exports.date = date;\n  exports.getDefaults = getDefaults;\n  exports.getI18n = getI18n;\n  exports.getInitialProps = getInitialProps;\n  exports.initReactI18next = initReactI18next;\n  exports.nodesToString = nodesToString;\n  exports.number = number;\n  exports.plural = plural;\n  exports.select = select;\n  exports.selectOrdinal = selectOrdinal;\n  exports.setDefaults = setDefaults;\n  exports.setI18n = setI18n;\n  exports.time = time;\n  exports.useSSR = useSSR;\n  exports.useTranslation = useTranslation;\n  exports.withSSR = withSSR;\n  exports.withTranslation = withTranslation;\n\n}));\n"
  },
  {
    "path": "rollup.config.mjs",
    "content": "import babel from '@rollup/plugin-babel';\nimport nodeResolve from '@rollup/plugin-node-resolve';\nimport commonjs from '@rollup/plugin-commonjs';\nimport replace from '@rollup/plugin-replace';\nimport terser from '@rollup/plugin-terser';\nimport yargs from 'yargs';\n\nconst { argv } = yargs(process.argv);\n\nconst format = argv.format || argv.f || 'iife';\nconst compress = argv.uglify;\n\nconst babelOptions = {\n  presets: [\n    [\n      '@babel/preset-env',\n      {\n        targets: {\n          browsers: ['defaults'],\n        },\n      },\n    ],\n    '@babel/react',\n  ],\n  babelrc: false,\n  comments: false,\n};\n\nconst file = {\n  amd: `dist/amd/react-i18next${compress ? '.min' : ''}.js`,\n  umd: `dist/umd/react-i18next${compress ? '.min' : ''}.js`,\n  iife: `dist/iife/react-i18next${compress ? '.min' : ''}.js`,\n}[format];\n\nexport default {\n  input: 'src/index.js',\n  plugins: [\n    babel(babelOptions),\n    replace({\n      'process.env.NODE_ENV': JSON.stringify(compress ? 'production' : 'development'),\n    }),\n    nodeResolve({ jsnext: true, main: true }),\n    commonjs({}),\n  ].concat(compress ? terser() : []),\n  external: ['react', 'react-dom'],\n  // moduleId: 'react-i18next',\n  output: {\n    name: 'ReactI18next',\n    format,\n    file,\n    globals: {\n      react: 'React',\n      'react-dom': 'ReactDOM',\n    },\n  },\n};\n"
  },
  {
    "path": "src/I18nextProvider.js",
    "content": "import { createElement, useMemo } from 'react';\nimport { I18nContext } from './context.js';\n\nexport function I18nextProvider({ i18n, defaultNS, children }) {\n  const value = useMemo(() => ({ i18n, defaultNS }), [i18n, defaultNS]);\n  return createElement(I18nContext.Provider, { value }, children);\n}\n"
  },
  {
    "path": "src/IcuTrans.js",
    "content": "import { useContext } from 'react';\nimport { IcuTransWithoutContext } from './IcuTransWithoutContext.js';\nimport { getI18n, I18nContext } from './context.js';\n\n/**\n * IcuTrans component for rendering ICU MessageFormat translations with React components\n *\n * This component provides a context-aware wrapper around IcuTransWithoutContext,\n * automatically retrieving the i18n instance from React context when used within\n * an I18nextProvider. It uses a declaration tree approach where components are\n * defined as type + props blueprints, fetches the translated string, and reconstructs\n * the React element tree by replacing numbered tags with actual components.\n *\n * Key features:\n * - Supports React Context (I18nextProvider)\n * - Falls back to global i18n instance\n * - ICU MessageFormat compatible\n * - Type-safe component declarations\n * - Automatic HTML entity decoding\n *\n * @param {Object} props - Component props\n * @param {string} props.i18nKey - The i18n key to look up the translation\n * @param {string} props.defaultTranslation - The default translation in ICU format with numbered tags (e.g., \"<0>Click here</0>\")\n * @param {Array<{type: string|React.ComponentType, props?: Object}>} props.content - Declaration tree describing React components and their props\n * @param {string|string[]} [props.ns] - Optional namespace(s) for the translation\n * @param {Object} [props.values] - Optional values for ICU variable interpolation\n * @param {Object} [props.i18n] - Optional i18next instance (overrides context)\n * @param {Function} [props.t] - Optional translation function (overrides context)\n * @returns {React.ReactElement} React fragment containing the rendered translation\n *\n * @example\n * ```jsx\n * // Basic usage with context\n * <I18nextProvider i18n={i18n}>\n *   <IcuTrans\n *     i18nKey=\"welcome.message\"\n *     defaultTranslation=\"Welcome <0>friend</0>!\"\n *     content={[\n *       { type: 'strong', props: { className: 'highlight' } }\n *     ]}\n *   />\n * </I18nextProvider>\n * ```\n *\n * @example\n * ```jsx\n * // With custom components and nested structure\n * <IcuTrans\n *   i18nKey=\"docs.link\"\n *   defaultTranslation=\"Read the <0>documentation <1></1></0> for more info\"\n *   content={[\n *     { type: 'a', props: { href: '/docs' } },\n *     { type: Icon, props: { name: 'external' } }\n *   ]}\n * />\n * ```\n *\n * @example\n * ```jsx\n * // With nested children in declarations\n * <IcuTrans\n *   i18nKey=\"list.items\"\n *   defaultTranslation=\"<0><0>First item</0><1>Second item</1></0>\"\n *   content={[\n *     {\n *       type: 'ul',\n *       props: {\n *         children: [\n *           { type: 'li', props: {} },\n *           { type: 'li', props: {} }\n *         ]\n *       }\n *     }\n *   ]}\n * />\n * ```\n */\nexport function IcuTrans({\n  i18nKey,\n  defaultTranslation,\n  content,\n  ns,\n  values = {},\n  i18n: i18nFromProps,\n  t: tFromProps,\n}) {\n  const { i18n: i18nFromContext, defaultNS: defaultNSFromContext } = useContext(I18nContext) || {};\n  const i18n = i18nFromProps || i18nFromContext || getI18n();\n\n  const t = tFromProps || i18n?.t.bind(i18n);\n\n  return IcuTransWithoutContext({\n    i18nKey,\n    defaultTranslation,\n    content,\n    ns: ns || t?.ns || defaultNSFromContext || i18n?.options?.defaultNS,\n    values,\n    i18n,\n    t: tFromProps,\n  });\n}\n\nIcuTrans.displayName = 'IcuTrans';\n"
  },
  {
    "path": "src/IcuTransUtils/TranslationParserError.js",
    "content": "/**\n * Error thrown during translation parsing\n */\nexport class TranslationParserError extends Error {\n  /**\n   * @param {string} message - Error message\n   * @param {number} [position] - Position in the translation string where the error occurred\n   * @param {string} [translationString] - The full translation string being parsed\n   */\n  constructor(message, position, translationString) {\n    super(message);\n\n    this.name = 'TranslationParserError';\n\n    this.position = position;\n\n    this.translationString = translationString;\n\n    // Maintains proper stack trace for where our error was thrown (only available on V8)\n    if (Error.captureStackTrace) {\n      Error.captureStackTrace(this, TranslationParserError);\n    }\n  }\n}\n"
  },
  {
    "path": "src/IcuTransUtils/htmlEntityDecoder.js",
    "content": "/**\n * Common HTML entities map for fast lookup\n */\nconst commonEntities = {\n  // Basic entities\n  '&nbsp;': '\\u00A0', // Non-breaking space\n  '&amp;': '&',\n  '&lt;': '<',\n  '&gt;': '>',\n  '&quot;': '\"',\n  '&apos;': \"'\",\n\n  // Copyright, trademark, and registration\n  '&copy;': '©',\n  '&reg;': '®',\n  '&trade;': '™',\n\n  // Punctuation\n  '&hellip;': '…',\n  '&ndash;': '–',\n  '&mdash;': '—',\n  '&lsquo;': '\\u2018',\n  '&rsquo;': '\\u2019',\n  '&sbquo;': '\\u201A',\n  '&ldquo;': '\\u201C',\n  '&rdquo;': '\\u201D',\n  '&bdquo;': '\\u201E',\n  '&dagger;': '†',\n  '&Dagger;': '‡',\n  '&bull;': '•',\n  '&prime;': '′',\n  '&Prime;': '″',\n  '&lsaquo;': '‹',\n  '&rsaquo;': '›',\n  '&sect;': '§',\n  '&para;': '¶',\n  '&middot;': '·',\n\n  // Spaces\n  '&ensp;': '\\u2002',\n  '&emsp;': '\\u2003',\n  '&thinsp;': '\\u2009',\n\n  // Currency\n  '&euro;': '€',\n  '&pound;': '£',\n  '&yen;': '¥',\n  '&cent;': '¢',\n  '&curren;': '¤',\n\n  // Math symbols\n  '&times;': '×',\n  '&divide;': '÷',\n  '&minus;': '−',\n  '&plusmn;': '±',\n  '&ne;': '≠',\n  '&le;': '≤',\n  '&ge;': '≥',\n  '&asymp;': '≈',\n  '&equiv;': '≡',\n  '&infin;': '∞',\n  '&int;': '∫',\n  '&sum;': '∑',\n  '&prod;': '∏',\n  '&radic;': '√',\n  '&part;': '∂',\n  '&permil;': '‰',\n  '&deg;': '°',\n  '&micro;': 'µ',\n\n  // Arrows\n  '&larr;': '←',\n  '&uarr;': '↑',\n  '&rarr;': '→',\n  '&darr;': '↓',\n  '&harr;': '↔',\n  '&crarr;': '↵',\n  '&lArr;': '⇐',\n  '&uArr;': '⇑',\n  '&rArr;': '⇒',\n  '&dArr;': '⇓',\n  '&hArr;': '⇔',\n\n  // Greek letters (lowercase)\n  '&alpha;': 'α',\n  '&beta;': 'β',\n  '&gamma;': 'γ',\n  '&delta;': 'δ',\n  '&epsilon;': 'ε',\n  '&zeta;': 'ζ',\n  '&eta;': 'η',\n  '&theta;': 'θ',\n  '&iota;': 'ι',\n  '&kappa;': 'κ',\n  '&lambda;': 'λ',\n  '&mu;': 'μ',\n  '&nu;': 'ν',\n  '&xi;': 'ξ',\n  '&omicron;': 'ο',\n  '&pi;': 'π',\n  '&rho;': 'ρ',\n  '&sigma;': 'σ',\n  '&tau;': 'τ',\n  '&upsilon;': 'υ',\n  '&phi;': 'φ',\n  '&chi;': 'χ',\n  '&psi;': 'ψ',\n  '&omega;': 'ω',\n\n  // Greek letters (uppercase)\n  '&Alpha;': 'Α',\n  '&Beta;': 'Β',\n  '&Gamma;': 'Γ',\n  '&Delta;': 'Δ',\n  '&Epsilon;': 'Ε',\n  '&Zeta;': 'Ζ',\n  '&Eta;': 'Η',\n  '&Theta;': 'Θ',\n  '&Iota;': 'Ι',\n  '&Kappa;': 'Κ',\n  '&Lambda;': 'Λ',\n  '&Mu;': 'Μ',\n  '&Nu;': 'Ν',\n  '&Xi;': 'Ξ',\n  '&Omicron;': 'Ο',\n  '&Pi;': 'Π',\n  '&Rho;': 'Ρ',\n  '&Sigma;': 'Σ',\n  '&Tau;': 'Τ',\n  '&Upsilon;': 'Υ',\n  '&Phi;': 'Φ',\n  '&Chi;': 'Χ',\n  '&Psi;': 'Ψ',\n  '&Omega;': 'Ω',\n\n  // Latin extended\n  '&Agrave;': 'À',\n  '&Aacute;': 'Á',\n  '&Acirc;': 'Â',\n  '&Atilde;': 'Ã',\n  '&Auml;': 'Ä',\n  '&Aring;': 'Å',\n  '&AElig;': 'Æ',\n  '&Ccedil;': 'Ç',\n  '&Egrave;': 'È',\n  '&Eacute;': 'É',\n  '&Ecirc;': 'Ê',\n  '&Euml;': 'Ë',\n  '&Igrave;': 'Ì',\n  '&Iacute;': 'Í',\n  '&Icirc;': 'Î',\n  '&Iuml;': 'Ï',\n  '&ETH;': 'Ð',\n  '&Ntilde;': 'Ñ',\n  '&Ograve;': 'Ò',\n  '&Oacute;': 'Ó',\n  '&Ocirc;': 'Ô',\n  '&Otilde;': 'Õ',\n  '&Ouml;': 'Ö',\n  '&Oslash;': 'Ø',\n  '&Ugrave;': 'Ù',\n  '&Uacute;': 'Ú',\n  '&Ucirc;': 'Û',\n  '&Uuml;': 'Ü',\n  '&Yacute;': 'Ý',\n  '&THORN;': 'Þ',\n  '&szlig;': 'ß',\n  '&agrave;': 'à',\n  '&aacute;': 'á',\n  '&acirc;': 'â',\n  '&atilde;': 'ã',\n  '&auml;': 'ä',\n  '&aring;': 'å',\n  '&aelig;': 'æ',\n  '&ccedil;': 'ç',\n  '&egrave;': 'è',\n  '&eacute;': 'é',\n  '&ecirc;': 'ê',\n  '&euml;': 'ë',\n  '&igrave;': 'ì',\n  '&iacute;': 'í',\n  '&icirc;': 'î',\n  '&iuml;': 'ï',\n  '&eth;': 'ð',\n  '&ntilde;': 'ñ',\n  '&ograve;': 'ò',\n  '&oacute;': 'ó',\n  '&ocirc;': 'ô',\n  '&otilde;': 'õ',\n  '&ouml;': 'ö',\n  '&oslash;': 'ø',\n  '&ugrave;': 'ù',\n  '&uacute;': 'ú',\n  '&ucirc;': 'û',\n  '&uuml;': 'ü',\n  '&yacute;': 'ý',\n  '&thorn;': 'þ',\n  '&yuml;': 'ÿ',\n\n  // Special characters\n  '&iexcl;': '¡',\n  '&iquest;': '¿',\n  '&fnof;': 'ƒ',\n  '&circ;': 'ˆ',\n  '&tilde;': '˜',\n  '&OElig;': 'Œ',\n  '&oelig;': 'œ',\n  '&Scaron;': 'Š',\n  '&scaron;': 'š',\n  '&Yuml;': 'Ÿ',\n  '&ordf;': 'ª',\n  '&ordm;': 'º',\n  '&macr;': '¯',\n  '&acute;': '´',\n  '&cedil;': '¸',\n  '&sup1;': '¹',\n  '&sup2;': '²',\n  '&sup3;': '³',\n  '&frac14;': '¼',\n  '&frac12;': '½',\n  '&frac34;': '¾',\n\n  // Card suits\n  '&spades;': '♠',\n  '&clubs;': '♣',\n  '&hearts;': '♥',\n  '&diams;': '♦',\n\n  // Miscellaneous\n  '&loz;': '◊',\n  '&oline;': '‾',\n  '&frasl;': '⁄',\n  '&weierp;': '℘',\n  '&image;': 'ℑ',\n  '&real;': 'ℜ',\n  '&alefsym;': 'ℵ',\n};\n\n// Create regex pattern for all entities\nconst entityPattern = new RegExp(\n  Object.keys(commonEntities)\n    .map((entity) => entity.replace(/[.*+?^${}()|[\\]\\\\]/g, '\\\\$&'))\n    .join('|'),\n  'g',\n);\n\n/**\n * Decode HTML entities in text\n *\n * Uses a hybrid approach:\n * 1. First pass: decode common named entities using a map\n * 2. Second pass: decode numeric entities (decimal and hexadecimal)\n *\n * @param {string} text - Text with HTML entities\n * @returns {string} Decoded text\n */\nexport const decodeHtmlEntities = (text) =>\n  text\n    // First pass: common named entities\n    .replace(entityPattern, (match) => commonEntities[match])\n    // Second pass: numeric entities (decimal)\n    .replace(/&#(\\d+);/g, (_, num) => String.fromCharCode(parseInt(num, 10)))\n    // Third pass: numeric entities (hexadecimal)\n    .replace(/&#x([0-9a-fA-F]+);/g, (_, hex) => String.fromCharCode(parseInt(hex, 16)));\n"
  },
  {
    "path": "src/IcuTransUtils/index.js",
    "content": "export * from './TranslationParserError.js';\nexport * from './htmlEntityDecoder.js';\nexport * from './tokenizer.js';\nexport * from './renderTranslation.js';\n"
  },
  {
    "path": "src/IcuTransUtils/renderTranslation.js",
    "content": "import React from 'react';\n\nimport { TranslationParserError } from './TranslationParserError.js';\nimport { tokenize } from './tokenizer.js';\nimport { decodeHtmlEntities } from './htmlEntityDecoder.js';\n\n/**\n * Render a React element tree from a declaration node and its children\n *\n * @param {Object} declaration - The component declaration (type + props)\n * @param {Array<React.ReactNode>} children - Array of child nodes (text, numbers, React elements)\n * @param {Array<Object>} [childDeclarations] - Optional array of child declarations to use for nested rendering\n * @returns {React.ReactElement} A React element\n */\nconst renderDeclarationNode = (declaration, children, childDeclarations) => {\n  const { type, props = {} } = declaration;\n\n  // If props contain a children declaration AND we have childDeclarations to work with,\n  // we need to recursively render the content with those child declarations\n  if (props.children && Array.isArray(props.children) && childDeclarations) {\n    // The children array contains the parsed content from inside this tag\n    // We need to rebuild the translation string and re-parse it with child declarations\n    // For now, we'll use the children directly as they're already parsed\n    // This happens when renderTranslation is called recursively\n\n    // Remove children from props since we'll pass them as the third argument\n    // eslint-disable-next-line no-unused-vars\n    const { children: _childrenToRemove, ...propsWithoutChildren } = props;\n\n    return React.createElement(type, propsWithoutChildren, ...children);\n  }\n\n  // Standard rendering with children from translation\n  if (children.length === 0) {\n    return React.createElement(type, props);\n  }\n  if (children.length === 1) {\n    return React.createElement(type, props, children[0]);\n  }\n  return React.createElement(type, props, ...children);\n};\n\n/**\n * Render translation string with declaration tree to create React elements\n *\n * This function parses an ICU format translation string and reconstructs\n * a React element tree using the provided declaration tree. It replaces\n * numbered tags (e.g., <0>, <1>) with the corresponding components from\n * the declaration array and fills them with the translated text.\n *\n * @param {string} translation - ICU format string (e.g., \"<0>Click here</0>\")\n * @param {Array<Object>} [declarations=[]] - Array of component declarations matching tag numbers\n * @returns {Array<React.ReactNode>} Array of React nodes (elements and text)\n *\n * @example\n * ```jsx\n * const result = renderTranslation(\n *   \"<0>bonjour</0> monde\",\n *   [{ type: 'strong', props: { className: 'bold' } }]\n * );\n * // Returns: [<strong className=\"bold\">bonjour</strong>, \" monde\"]\n * ```\n *\n * @example\n * ```jsx\n * // With nested children in declaration\n * const result = renderTranslation(\n *   \"<0>Click <1>here</1></0>\",\n *   [\n *     {\n *       type: 'div',\n *       props: {\n *         children: [{ type: 'span', props: {} }]\n *       }\n *     }\n *   ]\n * );\n * ```\n */\nexport const renderTranslation = (translation, declarations = []) => {\n  if (!translation) {\n    return [];\n  }\n\n  const tokens = tokenize(translation);\n  const result = [];\n  const stack = [];\n\n  // Track tag numbers that should be treated as literal text (no declaration found)\n  const literalTagNumbers = new Set();\n\n  // Helper to get the current declarations array based on context\n  const getCurrentDeclarations = () => {\n    if (stack.length === 0) {\n      return declarations;\n    }\n\n    const parentFrame = stack[stack.length - 1];\n\n    // If the parent declaration has children declarations, use those\n    if (\n      parentFrame.declaration.props?.children &&\n      Array.isArray(parentFrame.declaration.props.children)\n    ) {\n      return parentFrame.declaration.props.children;\n    }\n\n    // Otherwise, use the parent's declarations array\n    return parentFrame.declarations;\n  };\n\n  tokens.forEach((token) => {\n    // eslint-disable-next-line default-case\n    switch (token.type) {\n      case 'Text':\n        {\n          const decoded = decodeHtmlEntities(token.value);\n          const targetArray = stack.length > 0 ? stack[stack.length - 1].children : result;\n\n          targetArray.push(decoded);\n        }\n\n        break;\n\n      case 'TagOpen':\n        {\n          const { tagNumber } = token;\n          const currentDeclarations = getCurrentDeclarations();\n          const declaration = currentDeclarations[tagNumber];\n\n          if (!declaration) {\n            // No declaration found - treat this tag as literal text\n            literalTagNumbers.add(tagNumber);\n\n            const literalText = `<${tagNumber}>`;\n            const targetArray = stack.length > 0 ? stack[stack.length - 1].children : result;\n\n            targetArray.push(literalText);\n\n            break;\n          }\n\n          stack.push({\n            tagNumber,\n            children: [],\n            position: token.position,\n            declaration,\n            declarations: currentDeclarations,\n          });\n        }\n\n        break;\n\n      case 'TagClose':\n        {\n          const { tagNumber } = token;\n\n          // If this tag was treated as literal, output the closing tag as literal text\n          if (literalTagNumbers.has(tagNumber)) {\n            const literalText = `</${tagNumber}>`;\n            const literalTargetArray = stack.length > 0 ? stack[stack.length - 1].children : result;\n\n            literalTargetArray.push(literalText);\n\n            literalTagNumbers.delete(tagNumber);\n\n            break;\n          }\n\n          if (stack.length === 0) {\n            throw new TranslationParserError(\n              `Unexpected closing tag </${tagNumber}> at position ${token.position}`,\n              token.position,\n              translation,\n            );\n          }\n\n          const frame = stack.pop();\n\n          if (frame.tagNumber !== tagNumber) {\n            throw new TranslationParserError(\n              `Mismatched tags: expected </${frame.tagNumber}> but got </${tagNumber}> at position ${token.position}`,\n              token.position,\n              translation,\n            );\n          }\n\n          // Render the element using the declaration and collected children\n          const element = renderDeclarationNode(\n            frame.declaration,\n            frame.children,\n            frame.declarations,\n          );\n\n          const elementTargetArray = stack.length > 0 ? stack[stack.length - 1].children : result;\n\n          elementTargetArray.push(element);\n        }\n\n        break;\n    }\n  });\n\n  if (stack.length > 0) {\n    const unclosed = stack[stack.length - 1];\n\n    throw new TranslationParserError(\n      `Unclosed tag <${unclosed.tagNumber}> at position ${unclosed.position}`,\n      unclosed.position,\n      translation,\n    );\n  }\n\n  return result;\n};\n"
  },
  {
    "path": "src/IcuTransUtils/tokenizer.js",
    "content": "/**\n * Tokenize a translation string with numbered tags\n * Note: Variables are already interpolated by the i18n system before we receive the string\n *\n * @param {string} translation - Translation string with numbered tags\n * @returns {Array<Token>} Array of tokens\n */\nexport const tokenize = (translation) => {\n  const tokens = [];\n\n  let position = 0;\n\n  let currentText = '';\n\n  const flushText = () => {\n    if (currentText) {\n      tokens.push({\n        type: 'Text',\n        value: currentText,\n        position: position - currentText.length,\n      });\n\n      currentText = '';\n    }\n  };\n\n  while (position < translation.length) {\n    const char = translation[position];\n\n    // Check for opening tag: <0>, <1>, etc.\n    if (char === '<') {\n      const tagMatch = translation.slice(position).match(/^<(\\d+)>/);\n\n      if (tagMatch) {\n        flushText();\n\n        tokens.push({\n          type: 'TagOpen',\n          value: tagMatch[0],\n          position,\n          tagNumber: parseInt(tagMatch[1], 10),\n        });\n\n        position += tagMatch[0].length;\n      } else {\n        // Check for closing tag: </0>, </1>, etc.\n        const closeTagMatch = translation.slice(position).match(/^<\\/(\\d+)>/);\n\n        if (closeTagMatch) {\n          flushText();\n\n          tokens.push({\n            type: 'TagClose',\n            value: closeTagMatch[0],\n            position,\n            tagNumber: parseInt(closeTagMatch[1], 10),\n          });\n\n          position += closeTagMatch[0].length;\n        } else {\n          // Regular text (including any { } characters that aren't our tags)\n          currentText += char;\n\n          position += 1;\n        }\n      }\n    } else {\n      // Regular text (including any { } characters that aren't our tags)\n      currentText += char;\n\n      position += 1;\n    }\n  }\n\n  flushText();\n\n  return tokens;\n};\n"
  },
  {
    "path": "src/IcuTransWithoutContext.js",
    "content": "import React from 'react';\nimport { warn, warnOnce, isString } from './utils.js';\nimport { getI18n } from './i18nInstance.js';\nimport { renderTranslation } from './IcuTransUtils/index.js';\n\n/**\n * IcuTrans component for rendering ICU MessageFormat translations (without React Context)\n *\n * This is the core implementation without React hooks or context dependencies,\n * making it suitable for use in any environment. It uses a declaration tree\n * approach where components are defined as type + props blueprints, fetches\n * the translated string via i18next, and reconstructs the React element tree\n * by replacing numbered tags (<0>, <1>) with actual components.\n *\n * Key features:\n * - No React hooks or context (can be used anywhere)\n * - ICU MessageFormat compatible\n * - Supports nested component declarations\n * - Automatic HTML entity decoding\n * - Graceful error handling with fallbacks\n * - Merges default interpolation variables\n *\n * Note: Users should typically use the IcuTrans export which provides automatic\n * context support. This component is exposed for advanced use cases where direct\n * i18n instance control is needed, or for use outside of React Context.\n *\n * @param {Object} props - Component props\n * @param {string} props.i18nKey - The i18n key to look up the translation\n * @param {string} props.defaultTranslation - The default translation in ICU format with numbered tags (e.g., \"<0>Click here</0>\")\n * @param {Array<{type: string|React.ComponentType, props?: Object}>} props.content - Declaration tree describing React components and their props\n * @param {string|string[]} [props.ns] - Optional namespace(s) for the translation. Falls back to t.ns, then i18n.options.defaultNS, then 'translation'\n * @param {Object} [props.values={}] - Optional values for ICU variable interpolation (merged with i18n.options.interpolation.defaultVariables if present)\n * @param {Object} [props.i18n] - i18next instance. If not provided, uses global instance from getI18n()\n * @param {Function} [props.t] - Custom translation function. If not provided, uses i18n.t.bind(i18n)\n * @returns {React.ReactElement} React fragment containing the rendered translation\n *\n * @example\n * ```jsx\n * // Direct usage with i18n instance\n * <IcuTransWithoutContext\n *   i18nKey=\"welcome.message\"\n *   defaultTranslation=\"Welcome <0>back</0>!\"\n *   content={[\n *     { type: 'strong', props: { className: 'highlight' } }\n *   ]}\n *   i18n={i18nInstance}\n * />\n * ```\n *\n * @example\n * ```jsx\n * // With nested declarations for list rendering\n * <IcuTransWithoutContext\n *   i18nKey=\"features.list\"\n *   defaultTranslation=\"Features: <0><0>Fast</0><1>Reliable</1><2>Secure</2></0>\"\n *   content={[\n *     {\n *       type: 'ul',\n *       props: {\n *         children: [\n *           { type: 'li', props: {} },\n *           { type: 'li', props: {} },\n *           { type: 'li', props: {} }\n *         ]\n *       }\n *     }\n *   ]}\n *   i18n={i18nInstance}\n * />\n * ```\n *\n * @example\n * ```jsx\n * // With values for ICU variable interpolation\n * <IcuTransWithoutContext\n *   i18nKey=\"greeting\"\n *   defaultTranslation=\"Hello <0>{name}</0>!\"\n *   content={[{ type: 'strong', props: {} }]}\n *   values={{ name: 'Alice' }}\n *   i18n={i18nInstance}\n * />\n * ```\n */\nexport function IcuTransWithoutContext({\n  i18nKey,\n  defaultTranslation,\n  content,\n  ns,\n  values = {},\n  i18n: i18nFromProps,\n  t: tFromProps,\n}) {\n  const i18n = i18nFromProps || getI18n();\n\n  if (!i18n) {\n    warnOnce(\n      i18n,\n      'NO_I18NEXT_INSTANCE',\n      `IcuTrans: You need to pass in an i18next instance using i18nextReactModule`,\n      { i18nKey },\n    );\n    return React.createElement(React.Fragment, {}, defaultTranslation);\n  }\n\n  const t = tFromProps || i18n.t?.bind(i18n) || ((k) => k);\n\n  // prepare having a namespace\n  let namespaces = ns || t.ns || i18n.options?.defaultNS;\n  namespaces = isString(namespaces) ? [namespaces] : namespaces || ['translation'];\n\n  // Merge default interpolation variables if they exist\n  let mergedValues = values;\n  if (i18n.options?.interpolation?.defaultVariables) {\n    mergedValues =\n      values && Object.keys(values).length > 0\n        ? { ...values, ...i18n.options.interpolation.defaultVariables }\n        : { ...i18n.options.interpolation.defaultVariables };\n  }\n\n  // Get the translation, falling back to defaultTranslation\n  const translation = t(i18nKey, {\n    defaultValue: defaultTranslation,\n    ...mergedValues,\n    ns: namespaces,\n  });\n\n  // Render the translation with the declaration tree\n  try {\n    const rendered = renderTranslation(translation, content);\n\n    // Return as a React fragment to avoid extra wrapper\n    return React.createElement(React.Fragment, {}, ...rendered);\n  } catch (error) {\n    // If rendering fails, warn and fall back to the translation string\n    warn(\n      i18n,\n      'ICU_TRANS_RENDER_ERROR',\n      `IcuTrans component error for key \"${i18nKey}\": ${error.message}`,\n      { i18nKey, error },\n    );\n\n    return React.createElement(React.Fragment, {}, translation);\n  }\n}\n\nIcuTransWithoutContext.displayName = 'IcuTransWithoutContext';\n"
  },
  {
    "path": "src/Trans.js",
    "content": "import { useContext } from 'react';\nimport { nodesToString, Trans as TransWithoutContext } from './TransWithoutContext.js';\nimport { getI18n, I18nContext } from './context.js';\n\nexport { nodesToString };\n\nexport function Trans({\n  children,\n  count,\n  parent,\n  i18nKey,\n  context,\n  tOptions = {},\n  values,\n  defaults,\n  components,\n  ns,\n  i18n: i18nFromProps,\n  t: tFromProps,\n  shouldUnescape,\n  ...additionalProps\n}) {\n  const { i18n: i18nFromContext, defaultNS: defaultNSFromContext } = useContext(I18nContext) || {};\n  const i18n = i18nFromProps || i18nFromContext || getI18n();\n\n  const t = tFromProps || i18n?.t.bind(i18n);\n\n  return TransWithoutContext({\n    children,\n    count,\n    parent,\n    i18nKey,\n    context,\n    tOptions,\n    values,\n    defaults,\n    components,\n    // prepare having a namespace\n    ns: ns || t?.ns || defaultNSFromContext || i18n?.options?.defaultNS,\n    i18n,\n    t: tFromProps,\n    shouldUnescape,\n    ...additionalProps,\n  });\n}\n"
  },
  {
    "path": "src/TransWithoutContext.js",
    "content": "import { Fragment, isValidElement, cloneElement, createElement, Children } from 'react';\nimport { keyFromSelector } from 'i18next';\nimport HTML from 'html-parse-stringify';\nimport { isObject, isString, warn, warnOnce } from './utils.js';\nimport { getDefaults } from './defaults.js';\nimport { getI18n } from './i18nInstance.js';\nimport { unescape } from './unescape.js';\n\nconst hasChildren = (node, checkLength) => {\n  if (!node) return false;\n  const base = node.props?.children ?? node.children;\n  if (checkLength) return base.length > 0;\n  return !!base;\n};\n\nconst getChildren = (node) => {\n  if (!node) return [];\n  const children = node.props?.children ?? node.children;\n  return node.props?.i18nIsDynamicList ? getAsArray(children) : children;\n};\n\nconst hasValidReactChildren = (children) =>\n  Array.isArray(children) && children.every(isValidElement);\n\nconst getAsArray = (data) => (Array.isArray(data) ? data : [data]);\n\nconst mergeProps = (source, target) => {\n  const newTarget = { ...target };\n  // translation props (source.props) should override component props (target.props)\n  newTarget.props = { ...target.props, ...source.props };\n  return newTarget;\n};\n\nconst getValuesFromChildren = (children) => {\n  const values = {};\n  if (!children) return values;\n  const getData = (childs) => {\n    const childrenArray = getAsArray(childs);\n    childrenArray.forEach((child) => {\n      if (isString(child)) return;\n      if (hasChildren(child)) getData(getChildren(child));\n      else if (isObject(child) && !isValidElement(child)) Object.assign(values, child);\n    });\n  };\n  getData(children);\n  return values;\n};\n\nexport const nodesToString = (children, i18nOptions, i18n, i18nKey) => {\n  if (!children) return '';\n  let stringNode = '';\n\n  // do not use `React.Children.toArray`, will fail at object children\n  const childrenArray = getAsArray(children);\n  const keepArray = i18nOptions?.transSupportBasicHtmlNodes\n    ? (i18nOptions.transKeepBasicHtmlNodesFor ?? [])\n    : [];\n\n  // e.g. lorem <br/> ipsum {{ messageCount, format }} dolor <strong>bold</strong> amet\n  childrenArray.forEach((child, childIndex) => {\n    if (isString(child)) {\n      // actual e.g. lorem\n      // expected e.g. lorem\n      stringNode += `${child}`;\n      return;\n    }\n    if (isValidElement(child)) {\n      const { props, type } = child;\n      const childPropsCount = Object.keys(props).length;\n      const shouldKeepChild = keepArray.indexOf(type) > -1;\n      const childChildren = props.children;\n\n      if (!childChildren && shouldKeepChild && !childPropsCount) {\n        // actual e.g. lorem <br/> ipsum\n        // expected e.g. lorem <br/> ipsum\n        stringNode += `<${type}/>`;\n        return;\n      }\n      if ((!childChildren && (!shouldKeepChild || childPropsCount)) || props.i18nIsDynamicList) {\n        // actual e.g. lorem <hr className=\"test\" /> ipsum\n        // expected e.g. lorem <0></0> ipsum\n        // or\n        // we got a dynamic list like\n        // e.g. <ul i18nIsDynamicList>{['a', 'b'].map(item => ( <li key={item}>{item}</li> ))}</ul>\n        // expected e.g. \"<0></0>\", not e.g. \"<0><0>a</0><1>b</1></0>\"\n        stringNode += `<${childIndex}></${childIndex}>`;\n        return;\n      }\n      if (shouldKeepChild && childPropsCount === 1 && isString(childChildren)) {\n        // actual e.g. dolor <strong>bold</strong> amet\n        // expected e.g. dolor <strong>bold</strong> amet\n        stringNode += `<${type}>${childChildren}</${type}>`;\n        return;\n      }\n      // regular case mapping the inner children\n      const content = nodesToString(childChildren, i18nOptions, i18n, i18nKey);\n      stringNode += `<${childIndex}>${content}</${childIndex}>`;\n      return;\n    }\n    if (child === null) {\n      warn(i18n, 'TRANS_NULL_VALUE', `Passed in a null value as child`, { i18nKey });\n      return;\n    }\n    if (isObject(child)) {\n      // e.g. lorem {{ value, format }} ipsum\n      const { format, ...clone } = child;\n      const keys = Object.keys(clone);\n\n      if (keys.length === 1) {\n        const value = format ? `${keys[0]}, ${format}` : keys[0];\n        stringNode += `{{${value}}}`;\n        return;\n      }\n      warn(\n        i18n,\n        'TRANS_INVALID_OBJ',\n        `Invalid child - Object should only have keys {{ value, format }} (format is optional).`,\n        { i18nKey, child },\n      );\n      return;\n    }\n    warn(\n      i18n,\n      'TRANS_INVALID_VAR',\n      `Passed in a variable like {number} - pass variables for interpolation as full objects like {{number}}.`,\n      { i18nKey, child },\n    );\n  });\n\n  return stringNode;\n};\n\n/**\n * Escape literal < characters that are not part of valid tags\n * Valid tags are: numbered tags like <0>, </0> or named tags from keepArray/knownComponents\n * @param {string} str - The string to escape\n * @param {Array<string>} keepArray - Array of HTML tag names to keep\n * @param {Object} knownComponentsMap - Map of known component names\n * @returns {string} String with literal < characters escaped\n */\nconst escapeLiteralLessThan = (str, keepArray = [], knownComponentsMap = {}) => {\n  if (!str) return str;\n\n  // Build a list of valid tag names (numbered indices and known component names)\n  const knownNames = Object.keys(knownComponentsMap);\n  const allValidNames = [...keepArray, ...knownNames];\n\n  // Pattern to match:\n  // 1. Opening tags: <number> or <name> where name is in allValidNames\n  // 2. Closing tags: </number> or </name> where name is in allValidNames\n  // 3. Self-closing tags: <name/> or <name /> where name is in keepArray\n  // Everything else starting with < should be escaped\n\n  let result = '';\n  let i = 0;\n\n  while (i < str.length) {\n    if (str[i] === '<') {\n      // Check if this is a valid tag\n      let isValidTag = false;\n\n      // Check for closing tag: </number> or </name>\n      const closingMatch = str.slice(i).match(/^<\\/(\\d+|[a-zA-Z][a-zA-Z0-9_-]*)>/);\n      if (closingMatch) {\n        const tagName = closingMatch[1];\n        // Valid if it's a number or in our valid names list\n        if (/^\\d+$/.test(tagName) || allValidNames.includes(tagName)) {\n          isValidTag = true;\n          result += closingMatch[0];\n          i += closingMatch[0].length;\n        }\n      }\n\n      // Check for opening tag: <number> or <name> or <name/> or <name />\n      // Also handle tags with attributes: <0 href=\"...\"> or <name class=\"...\">\n      if (!isValidTag) {\n        // Match: <tagName [attributes] [/]>\n        // Attributes pattern: name=\"value\" or name='value' or name (boolean)\n        const openingMatch = str\n          .slice(i)\n          .match(\n            /^<(\\d+|[a-zA-Z][a-zA-Z0-9_-]*)(\\s+[\\w-]+(?:=(?:\"[^\"]*\"|'[^']*'|[^\\s>]+))?)*\\s*(\\/)?>/,\n          );\n        if (openingMatch) {\n          const tagName = openingMatch[1];\n          // Valid if it's a number or in our valid names list\n          if (/^\\d+$/.test(tagName) || allValidNames.includes(tagName)) {\n            isValidTag = true;\n            result += openingMatch[0];\n            i += openingMatch[0].length;\n          }\n        }\n      }\n\n      // If not a valid tag, escape the <\n      if (!isValidTag) {\n        result += '&lt;';\n        i += 1;\n      }\n    } else {\n      result += str[i];\n      i += 1;\n    }\n  }\n\n  return result;\n};\n\nconst renderNodes = (\n  children,\n  knownComponentsMap,\n  targetString,\n  i18n,\n  i18nOptions,\n  combinedTOpts,\n  shouldUnescape,\n) => {\n  if (targetString === '') return [];\n\n  // check if contains tags we need to replace from html string to react nodes\n  const keepArray = i18nOptions.transKeepBasicHtmlNodesFor || [];\n  const emptyChildrenButNeedsHandling =\n    targetString && new RegExp(keepArray.map((keep) => `<${keep}`).join('|')).test(targetString);\n\n  // no need to replace tags in the targetstring\n  if (!children && !knownComponentsMap && !emptyChildrenButNeedsHandling && !shouldUnescape)\n    return [targetString];\n\n  // v2 -> interpolates upfront no need for \"some <0>{{var}}</0>\"\" -> will be just \"some {{var}}\" in translation file\n  const data = knownComponentsMap ?? {};\n\n  const getData = (childs) => {\n    const childrenArray = getAsArray(childs);\n\n    childrenArray.forEach((child) => {\n      if (isString(child)) return;\n      if (hasChildren(child)) getData(getChildren(child));\n      else if (isObject(child) && !isValidElement(child)) Object.assign(data, child);\n    });\n  };\n\n  getData(children);\n\n  // Escape literal < characters that are not part of valid tags before parsing\n  const escapedString = escapeLiteralLessThan(targetString, keepArray, data);\n\n  // parse ast from string with additional wrapper tag\n  // -> avoids issues in parser removing prepending text nodes\n  const ast = HTML.parse(`<0>${escapedString}</0>`);\n  const opts = { ...data, ...combinedTOpts };\n\n  const renderInner = (child, node, rootReactNode) => {\n    const childs = getChildren(child);\n    const mappedChildren = mapAST(childs, node.children, rootReactNode);\n    // `mappedChildren` will always be empty if using the `i18nIsDynamicList` prop,\n    // but the children might not necessarily be react components\n    return (hasValidReactChildren(childs) && mappedChildren.length === 0) ||\n      child.props?.i18nIsDynamicList\n      ? childs\n      : mappedChildren;\n  };\n\n  const pushTranslatedJSX = (child, inner, mem, i, isVoid) => {\n    if (child.dummy) {\n      child.children = inner; // needed on preact!\n      mem.push(cloneElement(child, { key: i }, isVoid ? undefined : inner));\n    } else {\n      mem.push(\n        ...Children.map([child], (c) => {\n          // Build an override props object while deliberately NOT reading c.ref or c.props.ref\n          // use a DOM-safe marker name and never forward it to DOM nodes\n          const INTERNAL_DYNAMIC_MARKER = 'data-i18n-is-dynamic-list';\n          const override = { key: i, [INTERNAL_DYNAMIC_MARKER]: undefined };\n\n          if (c && c.props) {\n            Object.keys(c.props).forEach((k) => {\n              // skip special/internal props and the dynamic-list marker so it never reaches DOM\n              if (\n                k === 'ref' ||\n                k === 'children' ||\n                k === 'i18nIsDynamicList' ||\n                k === INTERNAL_DYNAMIC_MARKER\n              )\n                return;\n              override[k] = c.props[k];\n            });\n          }\n\n          // Use cloneElement for all element types so React preserves/forwards refs internally\n          // and we don't access element.ref nor c.props.ref ourselves.\n          return cloneElement(c, override, isVoid ? null : inner);\n        }),\n      );\n    }\n  };\n\n  // reactNode (the jsx root element or child)\n  // astNode (the translation string as html ast)\n  // rootReactNode (the most outer jsx children array or trans components prop)\n  const mapAST = (reactNode, astNode, rootReactNode) => {\n    const reactNodes = getAsArray(reactNode);\n    const astNodes = getAsArray(astNode);\n\n    return astNodes.reduce((mem, node, i) => {\n      const translationContent =\n        node.children?.[0]?.content &&\n        i18n.services.interpolator.interpolate(node.children[0].content, opts, i18n.language);\n\n      if (node.type === 'tag') {\n        // regular array (components or children)\n        let tmp = reactNodes[parseInt(node.name, 10)];\n        if (!tmp && knownComponentsMap) tmp = knownComponentsMap[node.name];\n\n        // trans components is an object\n        if (rootReactNode.length === 1 && !tmp) tmp = rootReactNode[0][node.name];\n\n        // neither\n        if (!tmp) tmp = {};\n\n        // should fix #1893\n        const props = { ...node.attrs };\n        if (shouldUnescape) {\n          Object.keys(props).forEach((p) => {\n            const val = props[p];\n            if (isString(val)) {\n              props[p] = unescape(val);\n            }\n          });\n        }\n\n        const child = Object.keys(props).length !== 0 ? mergeProps({ props }, tmp) : tmp;\n\n        const isElement = isValidElement(child);\n\n        const isValidTranslationWithChildren =\n          isElement && hasChildren(node, true) && !node.voidElement;\n\n        const isEmptyTransWithHTML =\n          emptyChildrenButNeedsHandling && isObject(child) && child.dummy && !isElement;\n\n        const isKnownComponent =\n          isObject(knownComponentsMap) && Object.hasOwnProperty.call(knownComponentsMap, node.name);\n\n        if (isString(child)) {\n          const value = i18n.services.interpolator.interpolate(child, opts, i18n.language);\n          mem.push(value);\n        } else if (\n          hasChildren(child) || // the jsx element has children -> loop\n          isValidTranslationWithChildren // valid jsx element with no children but the translation has -> loop\n        ) {\n          const inner = renderInner(child, node, rootReactNode);\n          pushTranslatedJSX(child, inner, mem, i);\n        } else if (isEmptyTransWithHTML) {\n          // we have a empty Trans node (the dummy element) with a targetstring that contains html tags needing\n          // conversion to react nodes\n          // so we just need to map the inner stuff\n          const inner = mapAST(\n            reactNodes /* wrong but we need something */,\n            node.children,\n            rootReactNode,\n          );\n          pushTranslatedJSX(child, inner, mem, i);\n        } else if (Number.isNaN(parseFloat(node.name))) {\n          if (isKnownComponent) {\n            const inner = renderInner(child, node, rootReactNode);\n            pushTranslatedJSX(child, inner, mem, i, node.voidElement);\n          } else if (i18nOptions.transSupportBasicHtmlNodes && keepArray.indexOf(node.name) > -1) {\n            if (node.voidElement) {\n              mem.push(createElement(node.name, { key: `${node.name}-${i}` }));\n            } else {\n              const inner = mapAST(\n                reactNodes /* wrong but we need something */,\n                node.children,\n                rootReactNode,\n              );\n\n              mem.push(createElement(node.name, { key: `${node.name}-${i}` }, inner));\n            }\n          } else if (node.voidElement) {\n            mem.push(`<${node.name} />`);\n          } else {\n            const inner = mapAST(\n              reactNodes /* wrong but we need something */,\n              node.children,\n              rootReactNode,\n            );\n\n            mem.push(`<${node.name}>${inner}</${node.name}>`);\n          }\n        } else if (isObject(child) && !isElement) {\n          const content = node.children[0] ? translationContent : null;\n\n          // v1\n          // as interpolation was done already we just have a regular content node\n          // in the translation AST while having an object in reactNodes\n          // -> push the content no need to interpolate again\n          if (content) mem.push(content);\n        } else {\n          // If component does not have children, but translation - has\n          // with this in component could be components={[<span class='make-beautiful'/>]} and in translation - 'some text <0>some highlighted message</0>'\n          pushTranslatedJSX(\n            child,\n            translationContent,\n            mem,\n            i,\n            node.children.length !== 1 || !translationContent,\n          );\n        }\n      } else if (node.type === 'text') {\n        const wrapTextNodes = i18nOptions.transWrapTextNodes;\n        const unescapeFn =\n          typeof i18nOptions.unescape === 'function'\n            ? i18nOptions.unescape\n            : getDefaults().unescape;\n        const content = shouldUnescape\n          ? unescapeFn(i18n.services.interpolator.interpolate(node.content, opts, i18n.language))\n          : i18n.services.interpolator.interpolate(node.content, opts, i18n.language);\n        if (wrapTextNodes) {\n          mem.push(createElement(wrapTextNodes, { key: `${node.name}-${i}` }, content));\n        } else {\n          mem.push(content);\n        }\n      }\n      return mem;\n    }, []);\n  };\n\n  // call mapAST with having react nodes nested into additional node like\n  // we did for the string ast from translation\n  // return the children of that extra node to get expected result\n  const result = mapAST(\n    [{ dummy: true, children: children || [] }],\n    ast,\n    getAsArray(children || []),\n  );\n  return getChildren(result[0]);\n};\n\nconst fixComponentProps = (component, index, translation) => {\n  const componentKey = component.key || index;\n  const comp = cloneElement(component, { key: componentKey });\n  if (\n    !comp.props ||\n    !comp.props.children ||\n    (translation.indexOf(`${index}/>`) < 0 && translation.indexOf(`${index} />`) < 0)\n  ) {\n    return comp;\n  }\n\n  function Componentized() {\n    // <>{comp}</>\n    return createElement(Fragment, null, comp);\n  }\n  // <Componentized />\n  return createElement(Componentized, { key: componentKey });\n};\n\nconst generateArrayComponents = (components, translation) =>\n  components.map((c, index) => fixComponentProps(c, index, translation));\n\nconst generateObjectComponents = (components, translation) => {\n  const componentMap = {};\n\n  Object.keys(components).forEach((c) => {\n    Object.assign(componentMap, {\n      [c]: fixComponentProps(components[c], c, translation),\n    });\n  });\n\n  return componentMap;\n};\n\nconst generateComponents = (components, translation, i18n, i18nKey) => {\n  if (!components) return null;\n\n  // components could be either an array or an object\n\n  if (Array.isArray(components)) {\n    return generateArrayComponents(components, translation);\n  }\n\n  if (isObject(components)) {\n    return generateObjectComponents(components, translation);\n  }\n\n  // if components is not an array or an object, warn the user\n  // and return null\n  warnOnce(\n    i18n,\n    'TRANS_INVALID_COMPONENTS',\n    `<Trans /> \"components\" prop expects an object or array`,\n    { i18nKey },\n  );\n  return null;\n};\n\n// A component map is an object like: { Button: <button> }, but not an object like { 1: <button> }\nconst isComponentsMap = (object) => {\n  if (!isObject(object)) return false;\n  if (Array.isArray(object)) return false;\n  return Object.keys(object).reduce(\n    (acc, key) => acc && Number.isNaN(Number.parseFloat(key)),\n    true,\n  );\n};\n\nexport function Trans({\n  children,\n  count,\n  parent,\n  i18nKey,\n  context,\n  tOptions = {},\n  values,\n  defaults,\n  components,\n  ns,\n  i18n: i18nFromProps,\n  t: tFromProps,\n  shouldUnescape,\n  ...additionalProps\n}) {\n  const i18n = i18nFromProps || getI18n();\n\n  if (!i18n) {\n    warnOnce(\n      i18n,\n      'NO_I18NEXT_INSTANCE',\n      `Trans: You need to pass in an i18next instance using i18nextReactModule`,\n      { i18nKey },\n    );\n    return children;\n  }\n\n  const t = tFromProps || i18n.t.bind(i18n) || ((k) => k);\n\n  const reactI18nextOptions = { ...getDefaults(), ...i18n.options?.react };\n\n  // prepare having a namespace\n  let namespaces = ns || t.ns || i18n.options?.defaultNS;\n  namespaces = isString(namespaces) ? [namespaces] : namespaces || ['translation'];\n\n  const { transDefaultProps } = reactI18nextOptions;\n  const mergedTOptions = transDefaultProps?.tOptions\n    ? { ...transDefaultProps.tOptions, ...tOptions }\n    : tOptions;\n\n  const mergedShouldUnescape = shouldUnescape ?? transDefaultProps?.shouldUnescape;\n\n  const mergedValues = transDefaultProps?.values\n    ? { ...transDefaultProps.values, ...values }\n    : values;\n\n  const mergedComponents = transDefaultProps?.components\n    ? { ...transDefaultProps.components, ...components }\n    : components;\n\n  const nodeAsString = nodesToString(children, reactI18nextOptions, i18n, i18nKey);\n  const defaultValue =\n    defaults ||\n    mergedTOptions?.defaultValue ||\n    nodeAsString ||\n    reactI18nextOptions.transEmptyNodeValue ||\n    (typeof i18nKey === 'function' ? keyFromSelector(i18nKey) : i18nKey);\n  const { hashTransKey } = reactI18nextOptions;\n  const key =\n    i18nKey ||\n    (hashTransKey ? hashTransKey(nodeAsString || defaultValue) : nodeAsString || defaultValue);\n  if (i18n.options?.interpolation?.defaultVariables) {\n    // eslint-disable-next-line no-param-reassign\n    values =\n      mergedValues && Object.keys(mergedValues).length > 0\n        ? { ...mergedValues, ...i18n.options.interpolation.defaultVariables }\n        : { ...i18n.options.interpolation.defaultVariables };\n  } else {\n    // eslint-disable-next-line no-param-reassign\n    values = mergedValues;\n  }\n\n  const valuesFromChildren = getValuesFromChildren(children);\n\n  if (valuesFromChildren && typeof valuesFromChildren.count === 'number' && count === undefined) {\n    // eslint-disable-next-line no-param-reassign\n    count = valuesFromChildren.count;\n  }\n\n  const interpolationOverride =\n    values ||\n    (count !== undefined && !i18n.options?.interpolation?.alwaysFormat) || // https://github.com/i18next/react-i18next/issues/1719 + https://github.com/i18next/react-i18next/issues/1801\n    !children // if !children gets problems in future, undo that fix: https://github.com/i18next/react-i18next/issues/1729 by removing !children from this condition\n      ? mergedTOptions.interpolation\n      : { interpolation: { ...mergedTOptions.interpolation, prefix: '#$?', suffix: '?$#' } };\n  const combinedTOpts = {\n    ...mergedTOptions,\n    context: context || mergedTOptions.context, // Add `context` from the props or fallback to the value from `tOptions`\n    count,\n    ...values,\n    ...interpolationOverride,\n    defaultValue,\n    ns: namespaces,\n  };\n  let translation = key ? t(key, combinedTOpts) : defaultValue;\n  if (translation === key && defaultValue) translation = defaultValue;\n\n  const generatedComponents = generateComponents(mergedComponents, translation, i18n, i18nKey);\n  let indexedChildren = generatedComponents || children;\n  let componentsMap = null;\n  if (isComponentsMap(generatedComponents)) {\n    componentsMap = generatedComponents;\n    indexedChildren = children;\n  }\n\n  const content = renderNodes(\n    indexedChildren,\n    componentsMap,\n    translation,\n    i18n,\n    reactI18nextOptions,\n    combinedTOpts,\n    mergedShouldUnescape,\n  );\n\n  // allows user to pass `null` to `parent`\n  // and override `defaultTransParent` if is present\n  const useAsParent = parent ?? reactI18nextOptions.defaultTransParent;\n\n  return useAsParent ? createElement(useAsParent, additionalProps, content) : content;\n}\n"
  },
  {
    "path": "src/Translation.js",
    "content": "import { useTranslation } from './useTranslation.js';\n\nexport const Translation = ({ ns, children, ...options }) => {\n  const [t, i18n, ready] = useTranslation(ns, options);\n\n  return children(\n    t,\n    {\n      i18n,\n      lng: i18n?.language,\n    },\n    ready,\n  );\n};\n"
  },
  {
    "path": "src/context.js",
    "content": "import { createContext } from 'react';\nimport { getDefaults, setDefaults } from './defaults.js';\nimport { getI18n, setI18n } from './i18nInstance.js';\nimport { initReactI18next } from './initReactI18next.js';\n\nexport { getDefaults, setDefaults, getI18n, setI18n, initReactI18next };\n\nexport const I18nContext = createContext();\n\nexport class ReportNamespaces {\n  constructor() {\n    this.usedNamespaces = {};\n  }\n\n  addUsedNamespaces(namespaces) {\n    namespaces.forEach((ns) => {\n      if (!this.usedNamespaces[ns]) this.usedNamespaces[ns] = true;\n    });\n  }\n\n  getUsedNamespaces() {\n    return Object.keys(this.usedNamespaces);\n  }\n}\n\nexport const composeInitialProps = (ForComponent) => async (ctx) => {\n  const componentsInitialProps = (await ForComponent.getInitialProps?.(ctx)) ?? {};\n\n  const i18nInitialProps = getInitialProps();\n\n  return {\n    ...componentsInitialProps,\n    ...i18nInitialProps,\n  };\n};\n\nexport const getInitialProps = () => {\n  const i18n = getI18n();\n  if (!i18n) {\n    console.warn(\n      'react-i18next:: getInitialProps: You will need to pass in an i18next instance by using initReactI18next',\n    );\n    return {};\n  }\n  const namespaces = i18n.reportNamespaces?.getUsedNamespaces() ?? [];\n\n  const ret = {};\n  const initialI18nStore = {};\n  i18n.languages.forEach((l) => {\n    initialI18nStore[l] = {};\n    namespaces.forEach((ns) => {\n      initialI18nStore[l][ns] = i18n.getResourceBundle(l, ns) || {};\n    });\n  });\n\n  ret.initialI18nStore = initialI18nStore;\n  ret.initialLanguage = i18n.language;\n\n  return ret;\n};\n"
  },
  {
    "path": "src/defaults.js",
    "content": "import { unescape } from './unescape.js';\n\nlet defaultOptions = {\n  bindI18n: 'languageChanged',\n  bindI18nStore: '',\n  // nsMode: 'fallback' // loop through all namespaces given to hook, HOC, render prop for key lookup\n  transEmptyNodeValue: '',\n  transSupportBasicHtmlNodes: true,\n  transWrapTextNodes: '',\n  transKeepBasicHtmlNodesFor: ['br', 'strong', 'i', 'p'],\n  // hashTransKey: key => key // calculate a key for Trans component based on defaultValue\n  useSuspense: true,\n  unescape,\n  transDefaultProps: undefined, // { tOptions: {}, shouldUnescape: false, values: {}, components: [] }\n};\n\nexport const setDefaults = (options = {}) => {\n  defaultOptions = { ...defaultOptions, ...options };\n};\n\nexport const getDefaults = () => defaultOptions;\n"
  },
  {
    "path": "src/i18nInstance.js",
    "content": "let i18nInstance;\n\nexport const setI18n = (instance) => {\n  i18nInstance = instance;\n};\n\nexport const getI18n = () => i18nInstance;\n"
  },
  {
    "path": "src/index.js",
    "content": "export { Trans } from './Trans.js';\nexport { Trans as TransWithoutContext } from './TransWithoutContext.js';\nexport { IcuTrans } from './IcuTrans.js';\nexport { IcuTransWithoutContext } from './IcuTransWithoutContext.js';\nexport { useTranslation } from './useTranslation.js';\nexport { withTranslation } from './withTranslation.js';\nexport { Translation } from './Translation.js';\nexport { I18nextProvider } from './I18nextProvider.js';\nexport { withSSR } from './withSSR.js';\nexport { useSSR } from './useSSR.js';\nexport { initReactI18next } from './initReactI18next.js';\nexport { setDefaults, getDefaults } from './defaults.js';\nexport { setI18n, getI18n } from './i18nInstance.js';\n\nexport { nodesToString } from './Trans.js';\n\nexport { I18nContext, composeInitialProps, getInitialProps } from './context.js';\n\n// dummy functions for icu.macro support\n\nexport const date = () => '';\nexport const time = () => '';\nexport const number = () => '';\nexport const select = () => '';\nexport const plural = () => '';\nexport const selectOrdinal = () => '';\n"
  },
  {
    "path": "src/initReactI18next.js",
    "content": "import { setDefaults } from './defaults.js';\nimport { setI18n } from './i18nInstance.js';\n\nexport const initReactI18next = {\n  type: '3rdParty',\n\n  init(instance) {\n    setDefaults(instance.options.react);\n    setI18n(instance);\n  },\n};\n"
  },
  {
    "path": "src/unescape.js",
    "content": "// unescape common html entities\n\nconst matchHtmlEntity =\n  /&(?:amp|#38|lt|#60|gt|#62|apos|#39|quot|#34|nbsp|#160|copy|#169|reg|#174|hellip|#8230|#x2F|#47);/g;\n\nconst htmlEntities = {\n  '&amp;': '&',\n  '&#38;': '&',\n  '&lt;': '<',\n  '&#60;': '<',\n  '&gt;': '>',\n  '&#62;': '>',\n  '&apos;': \"'\",\n  '&#39;': \"'\",\n  '&quot;': '\"',\n  '&#34;': '\"',\n  '&nbsp;': ' ',\n  '&#160;': ' ',\n  '&copy;': '©',\n  '&#169;': '©',\n  '&reg;': '®',\n  '&#174;': '®',\n  '&hellip;': '…',\n  '&#8230;': '…',\n  '&#x2F;': '/',\n  '&#47;': '/',\n};\n\nconst unescapeHtmlEntity = (m) => htmlEntities[m];\n\nexport const unescape = (text) => text.replace(matchHtmlEntity, unescapeHtmlEntity);\n"
  },
  {
    "path": "src/useSSR.js",
    "content": "import { useContext } from 'react';\nimport { getI18n, I18nContext } from './context.js';\nimport { warnOnce } from './utils.js';\n\nexport const useSSR = (initialI18nStore, initialLanguage, props = {}) => {\n  const { i18n: i18nFromProps } = props;\n  const { i18n: i18nFromContext } = useContext(I18nContext) || {};\n  const i18n = i18nFromProps || i18nFromContext || getI18n();\n\n  if (!i18n) {\n    warnOnce(\n      i18n,\n      'NO_I18NEXT_INSTANCE',\n      'useSSR: You will need to pass in an i18next instance by using initReactI18next or by passing it via props or context. In monorepo setups, make sure there is only one instance of react-i18next.',\n    );\n    return;\n  }\n\n  // opt out if is a cloned instance, eg. created by i18next-http-middleware on request\n  // -> do not set initial stuff on server side\n  if (i18n.options?.isClone) return;\n\n  // nextjs / SSR: getting data from next.js or other ssr stack\n  if (initialI18nStore && !i18n.initializedStoreOnce) {\n    if (!i18n.services?.resourceStore) {\n      warnOnce(\n        i18n,\n        'I18N_NOT_INITIALIZED',\n        'useSSR: i18n instance was found but not initialized (services.resourceStore is missing). Make sure you call i18next.init() before using useSSR — e.g. at module level, not only in getStaticProps/getServerSideProps.',\n      );\n      return;\n    }\n    i18n.services.resourceStore.data = initialI18nStore;\n\n    // add namespaces to the config - so a languageChange call loads all namespaces needed\n    i18n.options.ns = Object.values(initialI18nStore).reduce((mem, lngResources) => {\n      Object.keys(lngResources).forEach((ns) => {\n        if (mem.indexOf(ns) < 0) mem.push(ns);\n      });\n      return mem;\n    }, i18n.options.ns);\n\n    i18n.initializedStoreOnce = true;\n    i18n.isInitialized = true;\n  }\n\n  if (initialLanguage && !i18n.initializedLanguageOnce) {\n    i18n.changeLanguage(initialLanguage);\n    i18n.initializedLanguageOnce = true;\n  }\n};\n"
  },
  {
    "path": "src/useTranslation.js",
    "content": "import { useContext, useCallback, useMemo, useEffect, useRef, useState } from 'react';\n// eslint-disable-next-line import/no-extraneous-dependencies\nimport { useSyncExternalStore } from 'use-sync-external-store/shim';\nimport { getI18n, getDefaults, ReportNamespaces, I18nContext } from './context.js';\nimport {\n  warnOnce,\n  loadNamespaces,\n  loadLanguages,\n  hasLoadedNamespace,\n  isString,\n  isObject,\n} from './utils.js';\n\nconst notReadyT = (k, optsOrDefaultValue) => {\n  if (isString(optsOrDefaultValue)) return optsOrDefaultValue;\n  if (isObject(optsOrDefaultValue) && isString(optsOrDefaultValue.defaultValue))\n    return optsOrDefaultValue.defaultValue;\n  // Selector functions and arrays of selector functions cannot be meaningfully resolved\n  // before i18n is ready — return empty string rather than leaking a function reference.\n  if (typeof k === 'function') return '';\n  if (Array.isArray(k)) {\n    const last = k[k.length - 1];\n    return typeof last === 'function' ? '' : last;\n  }\n  return k;\n};\n\nconst notReadySnapshot = { t: notReadyT, ready: false };\nconst dummySubscribe = () => () => {};\n\nexport const useTranslation = (ns, props = {}) => {\n  const { i18n: i18nFromProps } = props;\n  const { i18n: i18nFromContext, defaultNS: defaultNSFromContext } = useContext(I18nContext) || {};\n  const i18n = i18nFromProps || i18nFromContext || getI18n();\n\n  if (i18n && !i18n.reportNamespaces) i18n.reportNamespaces = new ReportNamespaces();\n\n  if (!i18n) {\n    warnOnce(\n      i18n,\n      'NO_I18NEXT_INSTANCE',\n      'useTranslation: You will need to pass in an i18next instance by using initReactI18next',\n    );\n  }\n\n  const i18nOptions = useMemo(\n    () => ({ ...getDefaults(), ...i18n?.options?.react, ...props }),\n    [i18n, props],\n  );\n\n  const { useSuspense, keyPrefix } = i18nOptions;\n\n  const nsOrContext = ns || defaultNSFromContext || i18n?.options?.defaultNS;\n  const unstableNamespaces = isString(nsOrContext) ? [nsOrContext] : nsOrContext || ['translation'];\n  const namespaces = useMemo(() => unstableNamespaces, unstableNamespaces);\n\n  i18n?.reportNamespaces?.addUsedNamespaces?.(namespaces);\n\n  const revisionRef = useRef(0);\n  const subscribe = useCallback(\n    (callback) => {\n      if (!i18n) return dummySubscribe;\n      const { bindI18n, bindI18nStore } = i18nOptions;\n\n      const wrappedCallback = () => {\n        revisionRef.current += 1;\n        callback();\n      };\n\n      if (bindI18n) i18n.on(bindI18n, wrappedCallback);\n      if (bindI18nStore) i18n.store.on(bindI18nStore, wrappedCallback);\n      return () => {\n        if (bindI18n) bindI18n.split(' ').forEach((e) => i18n.off(e, wrappedCallback));\n        if (bindI18nStore)\n          bindI18nStore.split(' ').forEach((e) => i18n.store.off(e, wrappedCallback));\n      };\n    },\n    [i18n, i18nOptions],\n  );\n\n  const snapshotRef = useRef();\n  const getSnapshot = useCallback(() => {\n    if (!i18n) {\n      return notReadySnapshot;\n    }\n    const calculatedReady =\n      !!(i18n.isInitialized || i18n.initializedStoreOnce) &&\n      namespaces.every((n) => hasLoadedNamespace(n, i18n, i18nOptions));\n    const currentLng = props.lng || i18n.language;\n    const currentRevision = revisionRef.current;\n\n    const lastSnapshot = snapshotRef.current;\n    if (\n      lastSnapshot &&\n      lastSnapshot.ready === calculatedReady &&\n      lastSnapshot.lng === currentLng &&\n      lastSnapshot.keyPrefix === keyPrefix &&\n      lastSnapshot.revision === currentRevision // Check revision\n    ) {\n      return lastSnapshot;\n    }\n\n    const calculatedT = i18n.getFixedT(\n      currentLng,\n      i18nOptions.nsMode === 'fallback' ? namespaces : namespaces[0],\n      keyPrefix,\n    );\n\n    const newSnapshot = {\n      t: calculatedT,\n      ready: calculatedReady,\n      lng: currentLng,\n      keyPrefix,\n      revision: currentRevision, // Store revision\n    };\n    snapshotRef.current = newSnapshot;\n    return newSnapshot;\n  }, [i18n, namespaces, keyPrefix, i18nOptions, props.lng]);\n\n  // We still need a state to manually trigger a re-render on load when the store doesn't emit an event.\n  const [loadCount, setLoadCount] = useState(0);\n  const { t, ready } = useSyncExternalStore(subscribe, getSnapshot, getSnapshot);\n\n  useEffect(() => {\n    if (i18n && !ready && !useSuspense) {\n      const onLoaded = () => setLoadCount((c) => c + 1);\n      if (props.lng) {\n        loadLanguages(i18n, props.lng, namespaces, onLoaded);\n      } else {\n        loadNamespaces(i18n, namespaces, onLoaded);\n      }\n    }\n  }, [i18n, props.lng, namespaces, ready, useSuspense, loadCount]);\n\n  const finalI18n = i18n || {};\n\n  // cache one wrapper per hook caller and only recreate it when language changes\n  const wrapperRef = useRef(null);\n  const wrapperLangRef = useRef();\n\n  // helper to create a wrapper instance (avoid duplicating descriptor logic)\n  const createI18nWrapper = (original) => {\n    const descriptors = Object.getOwnPropertyDescriptors(original);\n    if (descriptors.__original) delete descriptors.__original;\n    const wrapper = Object.create(Object.getPrototypeOf(original), descriptors);\n\n    if (!Object.prototype.hasOwnProperty.call(wrapper, '__original')) {\n      try {\n        Object.defineProperty(wrapper, '__original', {\n          value: original,\n          writable: false,\n          enumerable: false,\n          configurable: false,\n        });\n      } catch (_) {\n        /* ignore */\n      }\n    }\n\n    return wrapper;\n  };\n\n  const ret = useMemo(() => {\n    const original = finalI18n;\n    const lang = original?.language;\n\n    let i18nWrapper = original;\n\n    if (original) {\n      // if we already created a wrapper for this original instance\n      if (wrapperRef.current && wrapperRef.current.__original === original) {\n        // language changed -> create fresh wrapper so identity changes\n        if (wrapperLangRef.current !== lang) {\n          i18nWrapper = createI18nWrapper(original);\n\n          wrapperRef.current = i18nWrapper;\n          wrapperLangRef.current = lang;\n        } else {\n          // reuse existing wrapper when language didn't change\n          i18nWrapper = wrapperRef.current;\n        }\n      } else {\n        // first time for this original instance -> create wrapper\n        i18nWrapper = createI18nWrapper(original);\n\n        wrapperRef.current = i18nWrapper;\n        wrapperLangRef.current = lang;\n      }\n    }\n\n    const arr = [t, i18nWrapper, ready];\n    arr.t = t;\n    arr.i18n = i18nWrapper;\n    arr.ready = ready;\n    return arr;\n  }, [t, finalI18n, ready, finalI18n.resolvedLanguage, finalI18n.language, finalI18n.languages]);\n\n  if (i18n && useSuspense && !ready) {\n    throw new Promise((resolve) => {\n      const onLoaded = () => resolve();\n      if (props.lng) {\n        loadLanguages(i18n, props.lng, namespaces, onLoaded);\n      } else {\n        loadNamespaces(i18n, namespaces, onLoaded);\n      }\n    });\n  }\n\n  return ret;\n};\n"
  },
  {
    "path": "src/utils.js",
    "content": "/** @type {(i18n:any,code:import('../TransWithoutContext').ErrorCode,msg?:string, rest?:{[key:string]: any})=>void} */\nexport const warn = (i18n, code, msg, rest) => {\n  const args = [msg, { code, ...(rest || {}) }];\n  if (i18n?.services?.logger?.forward) {\n    return i18n.services.logger.forward(args, 'warn', 'react-i18next::', true);\n  }\n  if (isString(args[0])) args[0] = `react-i18next:: ${args[0]}`;\n  if (i18n?.services?.logger?.warn) {\n    i18n.services.logger.warn(...args);\n  } else if (console?.warn) {\n    console.warn(...args);\n  }\n};\nconst alreadyWarned = {};\n/** @type {typeof warn} */\nexport const warnOnce = (i18n, code, msg, rest) => {\n  if (isString(msg) && alreadyWarned[msg]) return;\n  if (isString(msg)) alreadyWarned[msg] = new Date();\n  warn(i18n, code, msg, rest);\n};\n\n// not needed right now\n//\n// export const deprecated = (i18n, ...args) => {\n//   if (process && process.env && (!process.env.NODE_ENV || process.env.NODE_ENV === 'development')) {\n//     if (isString(args[0])) args[0] = `deprecation warning -> ${args[0]}`;\n//     warnOnce(i18n, ...args);\n//   }\n// }\n\nconst loadedClb = (i18n, cb) => () => {\n  // delay ready if not yet initialized i18n instance\n  if (i18n.isInitialized) {\n    cb();\n  } else {\n    const initialized = () => {\n      // due to emitter removing issue in i18next we need to delay remove\n      setTimeout(() => {\n        i18n.off('initialized', initialized);\n      }, 0);\n      cb();\n    };\n    i18n.on('initialized', initialized);\n  }\n};\n\nexport const loadNamespaces = (i18n, ns, cb) => {\n  i18n.loadNamespaces(ns, loadedClb(i18n, cb));\n};\n\n// should work with I18NEXT >= v22.5.0\nexport const loadLanguages = (i18n, lng, ns, cb) => {\n  // eslint-disable-next-line no-param-reassign\n  if (isString(ns)) ns = [ns];\n  if (i18n.options.preload && i18n.options.preload.indexOf(lng) > -1)\n    return loadNamespaces(i18n, ns, cb);\n  ns.forEach((n) => {\n    if (i18n.options.ns.indexOf(n) < 0) i18n.options.ns.push(n);\n  });\n  i18n.loadLanguages(lng, loadedClb(i18n, cb));\n};\n\nexport const hasLoadedNamespace = (ns, i18n, options = {}) => {\n  if (!i18n.languages || !i18n.languages.length) {\n    warnOnce(i18n, 'NO_LANGUAGES', 'i18n.languages were undefined or empty', {\n      languages: i18n.languages,\n    });\n    return true;\n  }\n\n  return i18n.hasLoadedNamespace(ns, {\n    lng: options.lng,\n    precheck: (i18nInstance, loadNotPending) => {\n      if (\n        options.bindI18n &&\n        options.bindI18n.indexOf('languageChanging') > -1 &&\n        i18nInstance.services.backendConnector.backend &&\n        i18nInstance.isLanguageChangingTo &&\n        !loadNotPending(i18nInstance.isLanguageChangingTo, ns)\n      )\n        return false;\n    },\n  });\n};\n\nexport const getDisplayName = (Component) =>\n  Component.displayName ||\n  Component.name ||\n  (isString(Component) && Component.length > 0 ? Component : 'Unknown');\n\nexport const isString = (obj) => typeof obj === 'string';\n\nexport const isObject = (obj) => typeof obj === 'object' && obj !== null;\n"
  },
  {
    "path": "src/withSSR.js",
    "content": "import { createElement } from 'react';\nimport { useSSR } from './useSSR.js';\nimport { composeInitialProps } from './context.js';\nimport { getDisplayName } from './utils.js';\n\nexport const withSSR = () =>\n  function Extend(WrappedComponent) {\n    function I18nextWithSSR({ initialI18nStore, initialLanguage, ...rest }) {\n      useSSR(initialI18nStore, initialLanguage);\n\n      return createElement(WrappedComponent, {\n        ...rest,\n      });\n    }\n\n    I18nextWithSSR.getInitialProps = composeInitialProps(WrappedComponent);\n    I18nextWithSSR.displayName = `withI18nextSSR(${getDisplayName(WrappedComponent)})`;\n    I18nextWithSSR.WrappedComponent = WrappedComponent;\n\n    return I18nextWithSSR;\n  };\n"
  },
  {
    "path": "src/withTranslation.js",
    "content": "import { createElement, forwardRef as forwardRefReact } from 'react';\nimport { useTranslation } from './useTranslation.js';\nimport { getDisplayName } from './utils.js';\n\nexport const withTranslation = (ns, options = {}) =>\n  function Extend(WrappedComponent) {\n    function I18nextWithTranslation({ forwardedRef, ...rest }) {\n      const [t, i18n, ready] = useTranslation(ns, { ...rest, keyPrefix: options.keyPrefix });\n\n      const passDownProps = {\n        ...rest,\n        t,\n        i18n,\n        tReady: ready,\n      };\n      if (options.withRef && forwardedRef) {\n        passDownProps.ref = forwardedRef;\n      } else if (!options.withRef && forwardedRef) {\n        passDownProps.forwardedRef = forwardedRef;\n      }\n      return createElement(WrappedComponent, passDownProps);\n    }\n\n    I18nextWithTranslation.displayName = `withI18nextTranslation(${getDisplayName(\n      WrappedComponent,\n    )})`;\n\n    I18nextWithTranslation.WrappedComponent = WrappedComponent;\n\n    const forwardRef = (props, ref) =>\n      // eslint-disable-next-line prefer-object-spread\n      createElement(I18nextWithTranslation, Object.assign({}, props, { forwardedRef: ref }));\n\n    return options.withRef ? forwardRefReact(forwardRef) : I18nextWithTranslation;\n  };\n"
  },
  {
    "path": "test/I18nextProvider.spec.jsx",
    "content": "import { describe, it, expect, vitest, afterEach } from 'vitest';\nimport React from 'react';\nimport { render, screen, cleanup } from '@testing-library/react';\nimport { I18nextProvider } from '../src/I18nextProvider';\nimport { useTranslation } from '../src/useTranslation';\nimport hasLoadedNamespace from './hasLoadedNamespaceMock.js';\n\nvitest.unmock('../src/useTranslation');\nvitest.unmock('../src/I18nextProvider');\n\nconst instance = {\n  language: 'en',\n  languages: ['en', 'fr'],\n  services: {\n    resourceStore: {\n      data: {},\n    },\n    backendConnector: { backend: {}, state: {} },\n  },\n  isInitialized: true,\n  changeLanguage: () => {},\n  getFixedT: () => (message) => message,\n  hasResourceBundle: (lng, ns) => ns === 'translation',\n  loadNamespaces: () => {},\n  hasLoadedNamespace: (ns) => hasLoadedNamespace(ns, instance),\n  on: () => {},\n  off: () => {},\n  options: {},\n};\n\ndescribe('I18nextProvider', () => {\n  afterEach(() => {\n    cleanup();\n  });\n\n  it('should render correct content', () => {\n    function TestComponent() {\n      const { t, i18n } = useTranslation('translation');\n\n      expect(typeof t).toBe('function');\n      // expect(i18n).toBe(instance);\n      expect(i18n.__original).toBe(instance);\n\n      return <div>{t('key1')}</div>;\n    }\n\n    render(\n      <I18nextProvider i18n={instance}>\n        <TestComponent />\n      </I18nextProvider>,\n    );\n\n    expect(screen.getByText('key1')).toBeInTheDocument();\n  });\n\n  it('should not rerender if value is not changed', () => {\n    let count = 0;\n    const TestComponent = React.memo(function TestComponent() {\n      const { t } = useTranslation('translation');\n      count += 1;\n      return <div>{t('key1')}</div>;\n    });\n\n    const { rerender } = render(\n      <I18nextProvider i18n={instance}>\n        <TestComponent />\n      </I18nextProvider>,\n    );\n    expect(count).toBe(1);\n    rerender(\n      <I18nextProvider i18n={instance}>\n        <TestComponent />\n      </I18nextProvider>,\n    );\n    expect(count).toBe(1);\n  });\n});\n"
  },
  {
    "path": "test/IcuTrans/IcuTrans.spec.jsx",
    "content": "import { describe, it, expect, beforeAll, afterEach, vi } from 'vitest';\nimport React from 'react';\nimport { render, cleanup } from '@testing-library/react';\nimport { I18nextProvider } from '../../src/I18nextProvider';\nimport { IcuTrans } from '../../src/IcuTrans';\nimport i18n from '../i18n';\n\ndescribe('IcuTrans', () => {\n  beforeAll(async () => {\n    await i18n.init();\n  });\n\n  afterEach(() => {\n    cleanup();\n  });\n\n  describe('basic rendering', () => {\n    it('should render plain text without tags', () => {\n      const { container } = render(\n        <I18nextProvider i18n={i18n}>\n          <IcuTrans i18nKey=\"test.plain\" defaultTranslation=\"Hello World\" content={[]} />\n        </I18nextProvider>,\n      );\n\n      expect(container.textContent).toBe('Hello World');\n    });\n\n    it('should render text with a single tag', () => {\n      const { container } = render(\n        <I18nextProvider i18n={i18n}>\n          <IcuTrans\n            i18nKey=\"test.single\"\n            defaultTranslation=\"Click <0>here</0> to continue\"\n            content={[{ type: 'strong', props: {} }]}\n          />\n        </I18nextProvider>,\n      );\n\n      expect(container.innerHTML).toContain('<strong>here</strong>');\n      expect(container.textContent).toBe('Click here to continue');\n    });\n\n    it('should render text with multiple tags', () => {\n      const { container } = render(\n        <I18nextProvider i18n={i18n}>\n          <IcuTrans\n            i18nKey=\"test.multiple\"\n            defaultTranslation=\"Text with <0>bold</0> and <1>italic</1>\"\n            content={[\n              { type: 'strong', props: {} },\n              { type: 'em', props: {} },\n            ]}\n          />\n        </I18nextProvider>,\n      );\n\n      expect(container.innerHTML).toContain('<strong>bold</strong>');\n      expect(container.innerHTML).toContain('<em>italic</em>');\n      expect(container.textContent).toBe('Text with bold and italic');\n    });\n\n    it('should render nested tags', () => {\n      const { container } = render(\n        <I18nextProvider i18n={i18n}>\n          <IcuTrans\n            i18nKey=\"test.nested\"\n            defaultTranslation=\"<0>Outer <1>inner</1> text</0>\"\n            content={[\n              { type: 'div', props: {} },\n              { type: 'strong', props: {} },\n            ]}\n          />\n        </I18nextProvider>,\n      );\n\n      expect(container.innerHTML).toContain('<div>');\n      expect(container.innerHTML).toContain('<strong>inner</strong>');\n      expect(container.textContent).toBe('Outer inner text');\n    });\n  });\n\n  describe('component props', () => {\n    it('should preserve component props', () => {\n      const { container } = render(\n        <I18nextProvider i18n={i18n}>\n          <IcuTrans\n            i18nKey=\"test.props\"\n            defaultTranslation=\"Go <0>here</0>\"\n            content={[{ type: 'a', props: { href: '/test', className: 'link' } }]}\n          />\n        </I18nextProvider>,\n      );\n\n      const link = container.querySelector('a');\n      expect(link).toBeTruthy();\n      expect(link.getAttribute('href')).toBe('/test');\n      expect(link.getAttribute('class')).toBe('link');\n      expect(link.textContent).toBe('here');\n    });\n\n    it('should support data attributes', () => {\n      const { container } = render(\n        <I18nextProvider i18n={i18n}>\n          <IcuTrans\n            i18nKey=\"test.data\"\n            defaultTranslation=\"Click <0>button</0>\"\n            content={[{ type: 'button', props: { 'data-testid': 'btn', 'data-action': 'submit' } }]}\n          />\n        </I18nextProvider>,\n      );\n\n      const button = container.querySelector('button');\n      expect(button.getAttribute('data-testid')).toBe('btn');\n      expect(button.getAttribute('data-action')).toBe('submit');\n    });\n\n    it('should support event handlers in props', () => {\n      const handleClick = vi.fn();\n      const { container } = render(\n        <I18nextProvider i18n={i18n}>\n          <IcuTrans\n            i18nKey=\"test.events\"\n            defaultTranslation=\"Click <0>me</0>\"\n            content={[{ type: 'button', props: { onClick: handleClick } }]}\n          />\n        </I18nextProvider>,\n      );\n\n      const button = container.querySelector('button');\n      button.click();\n      expect(handleClick).toHaveBeenCalledTimes(1);\n    });\n  });\n\n  describe('React components', () => {\n    it('should render custom React components', () => {\n      function CustomButton({ children, color }) {\n        return (\n          <button type=\"button\" style={{ color }}>\n            {children}\n          </button>\n        );\n      }\n\n      const { container } = render(\n        <I18nextProvider i18n={i18n}>\n          <IcuTrans\n            i18nKey=\"test.custom\"\n            defaultTranslation=\"Click <0>here</0>\"\n            content={[{ type: CustomButton, props: { color: 'red' } }]}\n          />\n        </I18nextProvider>,\n      );\n\n      const button = container.querySelector('button');\n      expect(button).toBeTruthy();\n      expect(button.style.color).toBe('red');\n      expect(button.textContent).toBe('here');\n    });\n\n    it('should render self-closing components', () => {\n      function Icon({ name }) {\n        return <i className={`icon-${name}`} />;\n      }\n\n      const { container } = render(\n        <I18nextProvider i18n={i18n}>\n          <IcuTrans\n            i18nKey=\"test.icon\"\n            defaultTranslation=\"Documentation <0></0>\"\n            content={[{ type: Icon, props: { name: 'external' } }]}\n          />\n        </I18nextProvider>,\n      );\n\n      const icon = container.querySelector('i');\n      expect(icon).toBeTruthy();\n      expect(icon.className).toBe('icon-external');\n    });\n  });\n\n  describe('interpolation values', () => {\n    it('should support variable interpolation', () => {\n      // Note: In real usage, i18n would handle interpolation before IcuTrans receives it\n      const { container } = render(\n        <I18nextProvider i18n={i18n}>\n          <IcuTrans\n            i18nKey=\"test.interpolation\"\n            defaultTranslation=\"Hello World\"\n            content={[]}\n            values={{ name: 'World' }}\n          />\n        </I18nextProvider>,\n      );\n\n      expect(container.textContent).toBeTruthy();\n    });\n\n    it('should pass values to i18n t function', () => {\n      const { container } = render(\n        <I18nextProvider i18n={i18n}>\n          <IcuTrans\n            i18nKey=\"test.values\"\n            defaultTranslation=\"Count: <0>5</0> items\"\n            content={[{ type: 'strong', props: {} }]}\n            values={{ count: 5 }}\n          />\n        </I18nextProvider>,\n      );\n\n      expect(container.textContent).toBeTruthy();\n    });\n  });\n\n  describe('HTML entities', () => {\n    it('should decode HTML entities in translations', () => {\n      const { container } = render(\n        <I18nextProvider i18n={i18n}>\n          <IcuTrans\n            i18nKey=\"test.entities\"\n            defaultTranslation=\"&copy; 2024 &amp; <0>more</0>\"\n            content={[{ type: 'strong', props: {} }]}\n          />\n        </I18nextProvider>,\n      );\n\n      expect(container.textContent).toContain('©');\n      expect(container.textContent).toContain('&');\n      expect(container.textContent).toContain('more');\n    });\n\n    it('should decode entities in nested content', () => {\n      const { container } = render(\n        <I18nextProvider i18n={i18n}>\n          <IcuTrans\n            i18nKey=\"test.nested.entities\"\n            defaultTranslation=\"<0>Price: &euro;50 &ndash; &euro;100</0>\"\n            content={[{ type: 'span', props: {} }]}\n          />\n        </I18nextProvider>,\n      );\n\n      expect(container.textContent).toContain('€50');\n      expect(container.textContent).toContain('€100');\n      expect(container.textContent).toContain('–');\n    });\n  });\n\n  describe('namespaces', () => {\n    it('should support single namespace', () => {\n      const { container } = render(\n        <I18nextProvider i18n={i18n}>\n          <IcuTrans\n            i18nKey=\"test.ns\"\n            defaultTranslation=\"Namespace test\"\n            content={[]}\n            ns=\"translation\"\n          />\n        </I18nextProvider>,\n      );\n\n      expect(container.textContent).toBeTruthy();\n    });\n\n    it('should support multiple namespaces', () => {\n      const { container } = render(\n        <I18nextProvider i18n={i18n}>\n          <IcuTrans\n            i18nKey=\"test.ns.array\"\n            defaultTranslation=\"Multi namespace\"\n            content={[]}\n            ns={['common', 'translation']}\n          />\n        </I18nextProvider>,\n      );\n\n      expect(container.textContent).toBeTruthy();\n    });\n  });\n\n  describe('complex scenarios', () => {\n    it('should handle deeply nested structures', () => {\n      const { container } = render(\n        <I18nextProvider i18n={i18n}>\n          <IcuTrans\n            i18nKey=\"test.deep\"\n            defaultTranslation=\"<0><1><2>Deep nesting</2></1></0>\"\n            content={[\n              { type: 'div', props: {} },\n              { type: 'span', props: {} },\n              { type: 'strong', props: {} },\n            ]}\n          />\n        </I18nextProvider>,\n      );\n\n      expect(container.innerHTML).toContain('<div>');\n      expect(container.innerHTML).toContain('<span>');\n      expect(container.innerHTML).toContain('<strong>Deep nesting</strong>');\n    });\n\n    it('should handle mixed content with text and components', () => {\n      const { container } = render(\n        <I18nextProvider i18n={i18n}>\n          <IcuTrans\n            i18nKey=\"test.mixed\"\n            defaultTranslation=\"Start <0>bold</0> middle <1>italic</1> end\"\n            content={[\n              { type: 'strong', props: {} },\n              { type: 'em', props: {} },\n            ]}\n          />\n        </I18nextProvider>,\n      );\n\n      expect(container.textContent).toBe('Start bold middle italic end');\n      expect(container.innerHTML).toContain('<strong>bold</strong>');\n      expect(container.innerHTML).toContain('<em>italic</em>');\n    });\n\n    it('should handle multiple uses of the same tag number', () => {\n      const { container } = render(\n        <I18nextProvider i18n={i18n}>\n          <IcuTrans\n            i18nKey=\"test.reuse\"\n            defaultTranslation=\"<0>First</0> and <0>second</0>\"\n            content={[{ type: 'strong', props: {} }]}\n          />\n        </I18nextProvider>,\n      );\n\n      const strongs = container.querySelectorAll('strong');\n      expect(strongs).toHaveLength(2);\n      expect(strongs[0].textContent).toBe('First');\n      expect(strongs[1].textContent).toBe('second');\n    });\n\n    it('should handle adjacent tags without text between', () => {\n      const { container } = render(\n        <I18nextProvider i18n={i18n}>\n          <IcuTrans\n            i18nKey=\"test.adjacent\"\n            defaultTranslation=\"<0>First</0><1>Second</1>\"\n            content={[\n              { type: 'span', props: {} },\n              { type: 'strong', props: {} },\n            ]}\n          />\n        </I18nextProvider>,\n      );\n\n      expect(container.innerHTML).toContain('<span>First</span>');\n      expect(container.innerHTML).toContain('<strong>Second</strong>');\n      expect(container.textContent).toBe('FirstSecond');\n    });\n\n    it('should handle tags with only whitespace', () => {\n      const { container } = render(\n        <I18nextProvider i18n={i18n}>\n          <IcuTrans\n            i18nKey=\"test.whitespace\"\n            defaultTranslation=\"<0>  </0>\"\n            content={[{ type: 'span', props: {} }]}\n          />\n        </I18nextProvider>,\n      );\n\n      const span = container.querySelector('span');\n      expect(span).toBeTruthy();\n      expect(span.textContent).toBe('  ');\n    });\n  });\n\n  describe('nested children in declarations', () => {\n    it('should handle nested children declarations', () => {\n      const { container } = render(\n        <I18nextProvider i18n={i18n}>\n          <IcuTrans\n            i18nKey=\"test.nested.decl\"\n            defaultTranslation=\"<0><0>Item 1</0><1>Item 2</1></0>\"\n            content={[\n              {\n                type: 'ul',\n                props: {\n                  children: [\n                    { type: 'li', props: {} },\n                    { type: 'li', props: {} },\n                  ],\n                },\n              },\n            ]}\n          />\n        </I18nextProvider>,\n      );\n\n      const ul = container.querySelector('ul');\n      expect(ul).toBeTruthy();\n      const lis = ul.querySelectorAll('li');\n      expect(lis).toHaveLength(2);\n      expect(lis[0].textContent).toBe('Item 1');\n      expect(lis[1].textContent).toBe('Item 2');\n    });\n\n    it('should handle nested declarations with different depths', () => {\n      const { container } = render(\n        <I18nextProvider i18n={i18n}>\n          <IcuTrans\n            i18nKey=\"test.complex.nested\"\n            defaultTranslation=\"<0>Text and <0>nested code</0></0>\"\n            content={[\n              {\n                type: 'div',\n                props: {\n                  style: { padding: '10px' },\n                  children: [{ type: 'code', props: {} }],\n                },\n              },\n            ]}\n          />\n        </I18nextProvider>,\n      );\n\n      const div = container.querySelector('div');\n      expect(div).toBeTruthy();\n      expect(div.style.padding).toBe('10px');\n      const code = div.querySelector('code');\n      expect(code).toBeTruthy();\n      expect(code.textContent).toBe('nested code');\n    });\n  });\n\n  describe('error handling', () => {\n    it('should handle rendering errors gracefully with mismatched tags', () => {\n      // Force an error by providing mismatched tags - renderTranslation will throw\n      const { container } = render(\n        <I18nextProvider i18n={i18n}>\n          <IcuTrans\n            i18nKey=\"test.error.mismatched\"\n            defaultTranslation=\"<0>Text</1>\"\n            content={[{ type: 'div', props: {} }]}\n          />\n        </I18nextProvider>,\n      );\n\n      // Should fallback to showing the translation string when error occurs\n      expect(container.textContent).toBe('<0>Text</1>');\n    });\n\n    it('should handle missing translation key', () => {\n      const { container } = render(\n        <I18nextProvider i18n={i18n}>\n          <IcuTrans\n            i18nKey=\"nonexistent.key\"\n            defaultTranslation=\"Fallback <0>text</0>\"\n            content={[{ type: 'strong', props: {} }]}\n          />\n        </I18nextProvider>,\n      );\n\n      // Should use defaultTranslation\n      expect(container.textContent).toBe('Fallback text');\n    });\n\n    it('should handle empty content array', () => {\n      const { container } = render(\n        <I18nextProvider i18n={i18n}>\n          <IcuTrans i18nKey=\"test.empty\" defaultTranslation=\"No components\" content={[]} />\n        </I18nextProvider>,\n      );\n\n      expect(container.textContent).toBe('No components');\n    });\n\n    it('should handle missing declarations for tags', () => {\n      const { container } = render(\n        <I18nextProvider i18n={i18n}>\n          <IcuTrans\n            i18nKey=\"test.missing\"\n            defaultTranslation=\"<0>text</0> and <1>more</1>\"\n            content={[{ type: 'strong', props: {} }]} // Only one declaration for two tags\n          />\n        </I18nextProvider>,\n      );\n\n      // Should render first tag correctly\n      expect(container.innerHTML).toContain('<strong>text</strong>');\n      // Second tag should be treated as literal text\n      expect(container.textContent).toContain('and');\n      expect(container.textContent).toContain('more');\n    });\n  });\n\n  describe('edge cases', () => {\n    it('should handle empty translation', () => {\n      const { container } = render(\n        <I18nextProvider i18n={i18n}>\n          <IcuTrans i18nKey=\"test.empty.trans\" defaultTranslation=\"\" content={[]} />\n        </I18nextProvider>,\n      );\n\n      expect(container.textContent).toBe('');\n    });\n\n    it('should handle translation with only tags', () => {\n      const { container } = render(\n        <I18nextProvider i18n={i18n}>\n          <IcuTrans\n            i18nKey=\"test.only.tags\"\n            defaultTranslation=\"<0></0><1></1>\"\n            content={[\n              { type: 'span', props: { className: 'a' } },\n              { type: 'span', props: { className: 'b' } },\n            ]}\n          />\n        </I18nextProvider>,\n      );\n\n      const spans = container.querySelectorAll('span');\n      expect(spans).toHaveLength(2);\n      expect(spans[0].className).toBe('a');\n      expect(spans[1].className).toBe('b');\n    });\n\n    it('should handle Unicode characters', () => {\n      const { container } = render(\n        <I18nextProvider i18n={i18n}>\n          <IcuTrans\n            i18nKey=\"test.unicode\"\n            defaultTranslation=\"Hello 世界 <0>🌍</0>\"\n            content={[{ type: 'span', props: {} }]}\n          />\n        </I18nextProvider>,\n      );\n\n      expect(container.textContent).toContain('世界');\n      expect(container.textContent).toContain('🌍');\n    });\n\n    it('should handle special characters', () => {\n      const { container } = render(\n        <I18nextProvider i18n={i18n}>\n          <IcuTrans\n            i18nKey=\"test.special\"\n            defaultTranslation=\"Test: <0>$100 + 50% = $150</0>\"\n            content={[{ type: 'code', props: {} }]}\n          />\n        </I18nextProvider>,\n      );\n\n      expect(container.textContent).toBe('Test: $100 + 50% = $150');\n    });\n\n    it('should preserve whitespace', () => {\n      const { container } = render(\n        <I18nextProvider i18n={i18n}>\n          <IcuTrans\n            i18nKey=\"test.whitespace.preserve\"\n            defaultTranslation=\"Text   with   <0>multiple   spaces</0>\"\n            content={[{ type: 'span', props: {} }]}\n          />\n        </I18nextProvider>,\n      );\n\n      expect(container.textContent).toContain('   ');\n      expect(container.textContent).toContain('multiple   spaces');\n    });\n\n    it('should handle newlines', () => {\n      const { container } = render(\n        <I18nextProvider i18n={i18n}>\n          <IcuTrans\n            i18nKey=\"test.newlines\"\n            defaultTranslation=\"Line 1\\nLine 2\\n<0>Line 3</0>\"\n            content={[{ type: 'div', props: {} }]}\n          />\n        </I18nextProvider>,\n      );\n\n      expect(container.textContent).toContain('Line 1');\n      expect(container.textContent).toContain('Line 2');\n      expect(container.textContent).toContain('Line 3');\n    });\n  });\n\n  describe('real-world examples', () => {\n    it('should render a link with icon', () => {\n      function Icon({ name }) {\n        return <i className={`icon-${name}`} />;\n      }\n\n      const { container } = render(\n        <I18nextProvider i18n={i18n}>\n          <IcuTrans\n            i18nKey=\"docs.link\"\n            defaultTranslation=\"See <0>documentation <1></1></0> for details\"\n            content={[\n              { type: 'a', props: { href: '#docs' } },\n              { type: Icon, props: { name: 'external' } },\n            ]}\n          />\n        </I18nextProvider>,\n      );\n\n      const link = container.querySelector('a');\n      expect(link).toBeTruthy();\n      expect(link.getAttribute('href')).toBe('#docs');\n      expect(link.textContent).toContain('documentation');\n\n      const icon = link.querySelector('i');\n      expect(icon).toBeTruthy();\n      expect(icon.className).toBe('icon-external');\n    });\n\n    it('should render formatted text', () => {\n      const { container } = render(\n        <I18nextProvider i18n={i18n}>\n          <IcuTrans\n            i18nKey=\"format.text\"\n            defaultTranslation=\"Welcome to <0>React</0>! It's <1>amazing</1>.\"\n            content={[\n              { type: 'strong', props: { style: { color: 'blue' } } },\n              { type: 'em', props: {} },\n            ]}\n          />\n        </I18nextProvider>,\n      );\n\n      const strong = container.querySelector('strong');\n      expect(strong).toBeTruthy();\n      expect(strong.style.color).toBe('blue');\n      expect(strong.textContent).toBe('React');\n\n      const em = container.querySelector('em');\n      expect(em).toBeTruthy();\n      expect(em.textContent).toBe('amazing');\n    });\n\n    it('should render copyright notice', () => {\n      const { container } = render(\n        <I18nextProvider i18n={i18n}>\n          <IcuTrans\n            i18nKey=\"footer.copyright\"\n            defaultTranslation=\"&copy; 2024 <0>Company Name</0>. All rights reserved&reg;.\"\n            content={[{ type: 'strong', props: {} }]}\n          />\n        </I18nextProvider>,\n      );\n\n      expect(container.textContent).toContain('©');\n      expect(container.textContent).toContain('Company Name');\n      expect(container.textContent).toContain('®');\n    });\n\n    it('should render call-to-action', () => {\n      const { container } = render(\n        <I18nextProvider i18n={i18n}>\n          <IcuTrans\n            i18nKey=\"cta.signup\"\n            defaultTranslation=\"Ready to start? <0>Sign up now</0> and get 50% off!\"\n            content={[{ type: 'a', props: { href: '/signup', className: 'btn btn-primary' } }]}\n          />\n        </I18nextProvider>,\n      );\n\n      const link = container.querySelector('a');\n      expect(link).toBeTruthy();\n      expect(link.getAttribute('href')).toBe('/signup');\n      expect(link.className).toContain('btn');\n      expect(link.textContent).toBe('Sign up now');\n    });\n  });\n\n  describe('displayName', () => {\n    it('should have correct displayName', () => {\n      expect(IcuTrans.displayName).toBe('IcuTrans');\n    });\n  });\n\n  describe('deeply nested complex scenario with ICU MessageFormat', () => {\n    it('should handle complex ICU translation with plural, select, number, and date - scenario 1', () => {\n      // This will trigger: plural \"other\" branch and select \"other\" branch\n      const now = new Date(2025, 9, 13);\n      const count = 1;\n      const selectInput = 'other';\n      const numbers = 41;\n\n      const { container } = render(\n        <I18nextProvider i18n={i18n}>\n          <IcuTrans\n            i18nKey=\"examples.complex-trans\"\n            defaultTranslation=\"<0>exciting!</0>{count, plural, =0 { hi there <1>friend</1> } other { woweee even supports nested {numbers, number} } } and {selectInput, select, thing { another nested thing <2>with regular text and a date: <0>{now, date}</0></2> } other {and the fallback <3><0>one</0><1>two</1></3>}}\"\n            content={[\n              { type: 'strong' }, // <0>exciting!</0>\n              { type: 'strong' }, // <1>friend</1> (in plural =0 branch)\n              {\n                type: 'div',\n                props: {\n                  style: { color: 'red' },\n                  children: [\n                    { type: 'code' }, // <0> inside div - date display\n                  ],\n                },\n              }, // <2> (in select \"thing\" branch)\n              {\n                type: 'ul',\n                props: {\n                  children: [\n                    { type: 'li' }, // <0> inside ul\n                    { type: 'li' }, // <1> inside ul\n                  ],\n                },\n              }, // <3> (in select \"other\" branch)\n            ]}\n            values={{ count, numbers, selectInput, now }}\n          />\n        </I18nextProvider>,\n      );\n\n      // With the given values, ICU should process to:\n      // \"<0>exciting!</0> woweee even supports nested {numbers} and the fallback <3><0>one</0><1>two</1></3>\"\n      expect(container.textContent).toContain('exciting!');\n      expect(container.textContent).toContain('and the fallback');\n      const ul = container.querySelector('ul');\n      expect(ul).toBeTruthy();\n    });\n\n    it('should handle complex ICU translation - scenario 2: count=0 branch', () => {\n      // With count=0, this triggers the \"=0\" branch of plural\n      const now = new Date(2025, 9, 13);\n      const count = 0;\n      const selectInput = 'other';\n      const numbers = 41;\n\n      const { container } = render(\n        <I18nextProvider i18n={i18n}>\n          <IcuTrans\n            i18nKey=\"examples.complex-trans-zero\"\n            defaultTranslation=\"<0>exciting!</0>{count, plural, =0 { hi there <1>friend</1> } other { woweee even supports nested {numbers, number} } } and {selectInput, select, thing { another nested thing <2>with regular text and a date: <0>{now, date}</0></2> } other {and the fallback <3><0>one</0><1>two</1></3>}}\"\n            content={[\n              { type: 'strong' }, // <0>exciting!</0>\n              { type: 'strong' }, // <1>friend</1>\n              {\n                type: 'div',\n                props: {\n                  style: { color: 'red' },\n                  children: [{ type: 'code' }],\n                },\n              },\n              {\n                type: 'ul',\n                props: {\n                  children: [{ type: 'li' }, { type: 'li' }],\n                },\n              },\n            ]}\n            values={{ count, numbers, selectInput, now }}\n          />\n        </I18nextProvider>,\n      );\n\n      // With count=0, should show \" hi there <1>friend</1> \" in the plural part\n      expect(container.textContent).toContain('exciting!');\n      expect(container.textContent).toContain('hi there');\n      expect(container.textContent).toContain('friend');\n    });\n\n    it('should handle complex ICU translation - scenario 3: selectInput=\"thing\" branch', () => {\n      // With selectInput=\"thing\", this triggers the \"thing\" branch of select\n      const now = new Date(2025, 9, 13);\n      const count = 1;\n      const selectInput = 'thing';\n      const numbers = 41;\n\n      const { container } = render(\n        <I18nextProvider i18n={i18n}>\n          <IcuTrans\n            i18nKey=\"examples.complex-trans-thing\"\n            defaultTranslation=\"<0>exciting!</0>{count, plural, =0 { hi there <1>friend</1> } other { woweee even supports nested {numbers, number} } } and {selectInput, select, thing { another nested thing <2>with regular text and a date: <0>{now, date}</0></2> } other {and the fallback <3><0>one</0><1>two</1></3>}}\"\n            content={[\n              { type: 'strong' },\n              { type: 'strong' },\n              {\n                type: 'div',\n                props: {\n                  style: { color: 'red' },\n                  children: [{ type: 'code' }],\n                },\n              },\n              {\n                type: 'ul',\n                props: {\n                  children: [{ type: 'li' }, { type: 'li' }],\n                },\n              },\n            ]}\n            values={{ count, numbers, selectInput, now }}\n          />\n        </I18nextProvider>,\n      );\n\n      // With selectInput=\"thing\", should show the div with nested code for date\n      expect(container.textContent).toContain('exciting!');\n      expect(container.textContent).toContain('another nested thing');\n      expect(container.textContent).toContain('with regular text and a date:');\n      const div = container.querySelector('div[style]');\n      expect(div).toBeTruthy();\n    });\n  });\n\n  describe('context handling', () => {\n    it('should work without I18nextProvider (using global instance)', () => {\n      // Test using the component outside of I18nextProvider\n      const { container } = render(\n        <IcuTrans\n          i18nKey=\"test.global\"\n          defaultTranslation=\"Global <0>test</0>\"\n          content={[{ type: 'strong', props: {} }]}\n          i18n={i18n}\n        />,\n      );\n\n      expect(container.textContent).toBe('Global test');\n    });\n\n    it('should use context when available', () => {\n      const { container } = render(\n        <I18nextProvider i18n={i18n}>\n          <IcuTrans\n            i18nKey=\"test.context\"\n            defaultTranslation=\"Context <0>test</0>\"\n            content={[{ type: 'em', props: {} }]}\n          />\n        </I18nextProvider>,\n      );\n\n      expect(container.textContent).toBe('Context test');\n    });\n\n    it('should handle missing i18n instance gracefully', () => {\n      const consoleWarnSpy = vi.spyOn(console, 'warn').mockImplementation(() => {});\n\n      const { container } = render(\n        <IcuTrans i18nKey=\"test.no.i18n\" defaultTranslation=\"Fallback text\" content={[]} />,\n      );\n\n      // Should render the defaultTranslation\n      expect(container.textContent).toBe('Fallback text');\n\n      consoleWarnSpy.mockRestore();\n    });\n  });\n});\n"
  },
  {
    "path": "test/IcuTrans/IcuTransWithoutContext.spec.jsx",
    "content": "import { describe, it, expect, beforeAll, afterEach, vi } from 'vitest';\nimport React from 'react';\nimport { render } from '@testing-library/react';\nimport { IcuTransWithoutContext } from '../../src/IcuTransWithoutContext';\nimport * as i18nInstanceModule from '../../src/i18nInstance';\nimport i18n from '../i18n';\n\ndescribe('IcuTransWithoutContext', () => {\n  beforeAll(async () => {\n    await i18n.init();\n  });\n\n  afterEach(() => {\n    vi.restoreAllMocks();\n  });\n\n  describe('basic rendering with i18n prop', () => {\n    it('should render with i18n instance passed as prop', () => {\n      const { container } = render(\n        <IcuTransWithoutContext\n          i18nKey=\"test.plain\"\n          defaultTranslation=\"Hello World\"\n          content={[]}\n          i18n={i18n}\n        />,\n      );\n\n      expect(container.textContent).toBe('Hello World');\n    });\n\n    it('should render with components', () => {\n      const { container } = render(\n        <IcuTransWithoutContext\n          i18nKey=\"test.component\"\n          defaultTranslation=\"Click <0>here</0>\"\n          content={[{ type: 'strong', props: {} }]}\n          i18n={i18n}\n        />,\n      );\n\n      expect(container.innerHTML).toContain('<strong>here</strong>');\n    });\n  });\n\n  describe('missing i18n instance', () => {\n    it('should fallback to defaultTranslation when i18n is not available', () => {\n      // Mock getI18n to return undefined\n      vi.spyOn(i18nInstanceModule, 'getI18n').mockReturnValue(undefined);\n\n      const { container } = render(\n        <IcuTransWithoutContext\n          i18nKey=\"test.no.i18n\"\n          defaultTranslation=\"Fallback text\"\n          content={[]}\n        />,\n      );\n\n      // Should render the defaultTranslation\n      expect(container.textContent).toBe('Fallback text');\n    });\n\n    it('should render defaultTranslation as plain text when no i18n', () => {\n      // Mock getI18n to return undefined\n      vi.spyOn(i18nInstanceModule, 'getI18n').mockReturnValue(undefined);\n\n      const { container } = render(\n        <IcuTransWithoutContext\n          i18nKey=\"test.no.i18n.components\"\n          defaultTranslation=\"Fallback with tags\"\n          content={[{ type: 'strong', props: {} }]}\n        />,\n      );\n\n      // Should render just the defaultTranslation string (not parsed when no i18n)\n      expect(container.textContent).toBe('Fallback with tags');\n    });\n  });\n\n  describe('namespace handling', () => {\n    it('should use provided namespace string', () => {\n      const { container } = render(\n        <IcuTransWithoutContext\n          i18nKey=\"test.ns\"\n          defaultTranslation=\"Namespace test\"\n          content={[]}\n          ns=\"translation\"\n          i18n={i18n}\n        />,\n      );\n\n      expect(container.textContent).toBeTruthy();\n    });\n\n    it('should use namespace array when provided', () => {\n      const { container } = render(\n        <IcuTransWithoutContext\n          i18nKey=\"test.ns.array\"\n          defaultTranslation=\"Multi namespace\"\n          content={[]}\n          ns={['common', 'translation']}\n          i18n={i18n}\n        />,\n      );\n\n      expect(container.textContent).toBeTruthy();\n    });\n\n    it('should fall back to translation namespace when ns is null/undefined', () => {\n      // Create i18n without defaultNS and t without ns\n      const mockI18n = {\n        t: vi.fn((key, opts) => opts.defaultValue),\n        options: {},\n      };\n\n      const { container } = render(\n        <IcuTransWithoutContext\n          i18nKey=\"test.no.ns\"\n          defaultTranslation=\"No namespace\"\n          content={[]}\n          ns={null}\n          i18n={mockI18n}\n        />,\n      );\n\n      expect(container.textContent).toBe('No namespace');\n      // Verify the t function was called with 'translation' namespace\n      expect(mockI18n.t).toHaveBeenCalledWith(\n        'test.no.ns',\n        expect.objectContaining({\n          ns: ['translation'],\n        }),\n      );\n    });\n\n    it('should use t.ns when available and no ns prop provided', () => {\n      const customT = vi.fn(() => 'Translation');\n      customT.ns = 'custom';\n\n      const { container } = render(\n        <IcuTransWithoutContext\n          i18nKey=\"test.t.ns\"\n          defaultTranslation=\"Test\"\n          content={[]}\n          i18n={i18n}\n          t={customT}\n        />,\n      );\n\n      expect(container.textContent).toBeTruthy();\n    });\n  });\n\n  describe('values and interpolation', () => {\n    it('should pass values to translation', () => {\n      const { container } = render(\n        <IcuTransWithoutContext\n          i18nKey=\"test.values\"\n          defaultTranslation=\"Hello World\"\n          content={[]}\n          values={{ name: 'World' }}\n          i18n={i18n}\n        />,\n      );\n\n      expect(container.textContent).toBeTruthy();\n    });\n\n    it('should merge default interpolation variables', () => {\n      // Create a custom i18n instance with default variables\n      const customI18n = i18n.cloneInstance({\n        interpolation: {\n          defaultVariables: {\n            appName: 'MyApp',\n            version: '1.0',\n          },\n        },\n      });\n\n      const { container } = render(\n        <IcuTransWithoutContext\n          i18nKey=\"test.default.vars\"\n          defaultTranslation=\"Test\"\n          content={[]}\n          values={{ custom: 'value' }}\n          i18n={customI18n}\n        />,\n      );\n\n      expect(container.textContent).toBeTruthy();\n    });\n\n    it('should use only default variables when no values provided', () => {\n      const customI18n = i18n.cloneInstance({\n        interpolation: {\n          defaultVariables: {\n            appName: 'MyApp',\n          },\n        },\n      });\n\n      const { container } = render(\n        <IcuTransWithoutContext\n          i18nKey=\"test.only.defaults\"\n          defaultTranslation=\"Test\"\n          content={[]}\n          i18n={customI18n}\n        />,\n      );\n\n      expect(container.textContent).toBeTruthy();\n    });\n  });\n\n  describe('custom t function', () => {\n    it('should use custom t function when provided', () => {\n      const customT = vi.fn(() => 'Custom translation');\n\n      const { container } = render(\n        <IcuTransWithoutContext\n          i18nKey=\"test.custom.t\"\n          defaultTranslation=\"Default\"\n          content={[]}\n          i18n={i18n}\n          t={customT}\n        />,\n      );\n\n      expect(customT).toHaveBeenCalled();\n      expect(container.textContent).toBe('Custom translation');\n    });\n\n    it('should use fallback t function when i18n.t is not available', () => {\n      // Create an i18n-like object without a t function\n      const mockI18n = {\n        options: {\n          defaultNS: 'translation',\n        },\n      };\n\n      const { container } = render(\n        <IcuTransWithoutContext\n          i18nKey=\"test.fallback.t\"\n          defaultTranslation=\"Fallback key test\"\n          content={[]}\n          i18n={mockI18n}\n        />,\n      );\n\n      // Should use the fallback t function `((k) => k)` which returns the key\n      expect(container.textContent).toBe('test.fallback.t');\n    });\n  });\n\n  describe('error handling', () => {\n    it('should handle rendering errors gracefully with mismatched tags', () => {\n      const { container } = render(\n        <IcuTransWithoutContext\n          i18nKey=\"test.error.mismatched\"\n          defaultTranslation=\"<0>Text</1>\"\n          content={[{ type: 'div', props: {} }]}\n          i18n={i18n}\n        />,\n      );\n\n      // Should fallback to showing the translation string when error occurs\n      expect(container.textContent).toBe('<0>Text</1>');\n    });\n  });\n\n  describe('displayName', () => {\n    it('should have correct displayName', () => {\n      expect(IcuTransWithoutContext.displayName).toBe('IcuTransWithoutContext');\n    });\n  });\n});\n"
  },
  {
    "path": "test/IcuTrans/utils/htmlEntityDecoder.spec.js",
    "content": "import { describe, it, expect } from 'vitest';\nimport { decodeHtmlEntities } from '../../../src/IcuTransUtils';\n\ndescribe('htmlEntityDecoder', () => {\n  describe('basic entities', () => {\n    it('should decode &nbsp; to non-breaking space', () => {\n      expect(decodeHtmlEntities('hello&nbsp;world')).toBe('hello\\u00A0world');\n    });\n\n    it('should decode &amp; to ampersand', () => {\n      expect(decodeHtmlEntities('Tom &amp; Jerry')).toBe('Tom & Jerry');\n    });\n\n    it('should decode &lt; to less than', () => {\n      expect(decodeHtmlEntities('5 &lt; 10')).toBe('5 < 10');\n    });\n\n    it('should decode &gt; to greater than', () => {\n      expect(decodeHtmlEntities('10 &gt; 5')).toBe('10 > 5');\n    });\n\n    it('should decode &quot; to double quote', () => {\n      expect(decodeHtmlEntities('He said &quot;hello&quot;')).toBe('He said \"hello\"');\n    });\n\n    it('should decode &apos; to single quote', () => {\n      expect(decodeHtmlEntities('It&apos;s working')).toBe(\"It's working\");\n    });\n  });\n\n  describe('copyright and trademark entities', () => {\n    it('should decode &copy; to copyright symbol', () => {\n      expect(decodeHtmlEntities('&copy; 2024')).toBe('© 2024');\n    });\n\n    it('should decode &reg; to registered trademark', () => {\n      expect(decodeHtmlEntities('React&reg;')).toBe('React®');\n    });\n\n    it('should decode &trade; to trademark symbol', () => {\n      expect(decodeHtmlEntities('Product&trade;')).toBe('Product™');\n    });\n  });\n\n  describe('punctuation entities', () => {\n    it('should decode &hellip; to ellipsis', () => {\n      expect(decodeHtmlEntities('Wait&hellip;')).toBe('Wait…');\n    });\n\n    it('should decode &ndash; to en dash', () => {\n      expect(decodeHtmlEntities('pages 10&ndash;20')).toBe('pages 10–20');\n    });\n\n    it('should decode &mdash; to em dash', () => {\n      expect(decodeHtmlEntities('Hello&mdash;world')).toBe('Hello—world');\n    });\n\n    it('should decode &lsquo; and &rsquo; to curly single quotes', () => {\n      expect(decodeHtmlEntities('&lsquo;hello&rsquo;')).toBe('\\u2018hello\\u2019');\n    });\n\n    it('should decode &ldquo; and &rdquo; to curly double quotes', () => {\n      expect(decodeHtmlEntities('&ldquo;hello&rdquo;')).toBe('\\u201Chello\\u201D');\n    });\n\n    it('should decode &sbquo; to single low quote', () => {\n      expect(decodeHtmlEntities('&sbquo;test')).toBe('\\u201Atest');\n    });\n\n    it('should decode &bdquo; to double low quote', () => {\n      expect(decodeHtmlEntities('&bdquo;test')).toBe('\\u201Etest');\n    });\n\n    it('should decode &dagger; and &Dagger; to dagger symbols', () => {\n      expect(decodeHtmlEntities('Note&dagger; and Note&Dagger;')).toBe('Note† and Note‡');\n    });\n\n    it('should decode &bull; to bullet', () => {\n      expect(decodeHtmlEntities('&bull; Item')).toBe('• Item');\n    });\n\n    it('should decode &prime; and &Prime; to prime symbols', () => {\n      expect(decodeHtmlEntities('5&prime; 10&Prime;')).toBe('5′ 10″');\n    });\n\n    it('should decode &lsaquo; and &rsaquo; to angle quotes', () => {\n      expect(decodeHtmlEntities('&lsaquo;text&rsaquo;')).toBe('‹text›');\n    });\n\n    it('should decode &sect; to section sign', () => {\n      expect(decodeHtmlEntities('&sect; 1')).toBe('§ 1');\n    });\n\n    it('should decode &para; to paragraph sign', () => {\n      expect(decodeHtmlEntities('&para; Introduction')).toBe('¶ Introduction');\n    });\n\n    it('should decode &middot; to middle dot', () => {\n      expect(decodeHtmlEntities('A &middot; B')).toBe('A · B');\n    });\n  });\n\n  describe('space entities', () => {\n    it('should decode &ensp; to en space', () => {\n      expect(decodeHtmlEntities('A&ensp;B')).toBe('A\\u2002B');\n    });\n\n    it('should decode &emsp; to em space', () => {\n      expect(decodeHtmlEntities('A&emsp;B')).toBe('A\\u2003B');\n    });\n\n    it('should decode &thinsp; to thin space', () => {\n      expect(decodeHtmlEntities('A&thinsp;B')).toBe('A\\u2009B');\n    });\n  });\n\n  describe('currency entities', () => {\n    it('should decode &euro; to euro symbol', () => {\n      expect(decodeHtmlEntities('Price: &euro;50')).toBe('Price: €50');\n    });\n\n    it('should decode &pound; to pound symbol', () => {\n      expect(decodeHtmlEntities('&pound;100')).toBe('£100');\n    });\n\n    it('should decode &yen; to yen symbol', () => {\n      expect(decodeHtmlEntities('&yen;1000')).toBe('¥1000');\n    });\n\n    it('should decode &cent; to cent symbol', () => {\n      expect(decodeHtmlEntities('99&cent;')).toBe('99¢');\n    });\n\n    it('should decode &curren; to currency symbol', () => {\n      expect(decodeHtmlEntities('&curren;100')).toBe('¤100');\n    });\n  });\n\n  describe('math symbols', () => {\n    it('should decode &times; to multiplication sign', () => {\n      expect(decodeHtmlEntities('5 &times; 3')).toBe('5 × 3');\n    });\n\n    it('should decode &divide; to division sign', () => {\n      expect(decodeHtmlEntities('10 &divide; 2')).toBe('10 ÷ 2');\n    });\n\n    it('should decode &minus; to minus sign', () => {\n      expect(decodeHtmlEntities('5 &minus; 3')).toBe('5 − 3');\n    });\n\n    it('should decode &plusmn; to plus-minus sign', () => {\n      expect(decodeHtmlEntities('&plusmn;5')).toBe('±5');\n    });\n\n    it('should decode &ne; to not equal', () => {\n      expect(decodeHtmlEntities('a &ne; b')).toBe('a ≠ b');\n    });\n\n    it('should decode &le; to less than or equal', () => {\n      expect(decodeHtmlEntities('x &le; 10')).toBe('x ≤ 10');\n    });\n\n    it('should decode &ge; to greater than or equal', () => {\n      expect(decodeHtmlEntities('x &ge; 5')).toBe('x ≥ 5');\n    });\n\n    it('should decode &asymp; to approximately equal', () => {\n      expect(decodeHtmlEntities('pi &asymp; 3.14')).toBe('pi ≈ 3.14');\n    });\n\n    it('should decode &equiv; to equivalent', () => {\n      expect(decodeHtmlEntities('a &equiv; b')).toBe('a ≡ b');\n    });\n\n    it('should decode &infin; to infinity', () => {\n      expect(decodeHtmlEntities('lim &rarr; &infin;')).toBe('lim → ∞');\n    });\n\n    it('should decode integral and sum symbols', () => {\n      expect(decodeHtmlEntities('&int; &sum; &prod;')).toBe('∫ ∑ ∏');\n    });\n\n    it('should decode &radic; to square root', () => {\n      expect(decodeHtmlEntities('&radic;2')).toBe('√2');\n    });\n\n    it('should decode &part; to partial derivative', () => {\n      expect(decodeHtmlEntities('&part;f')).toBe('∂f');\n    });\n\n    it('should decode &permil; to per mille', () => {\n      expect(decodeHtmlEntities('5&permil;')).toBe('5‰');\n    });\n\n    it('should decode &deg; to degree symbol', () => {\n      expect(decodeHtmlEntities('90&deg;')).toBe('90°');\n    });\n\n    it('should decode &micro; to micro symbol', () => {\n      expect(decodeHtmlEntities('5&micro;m')).toBe('5µm');\n    });\n  });\n\n  describe('arrow entities', () => {\n    it('should decode basic arrows', () => {\n      expect(decodeHtmlEntities('&larr; &uarr; &rarr; &darr;')).toBe('← ↑ → ↓');\n    });\n\n    it('should decode &harr; to left-right arrow', () => {\n      expect(decodeHtmlEntities('A &harr; B')).toBe('A ↔ B');\n    });\n\n    it('should decode &crarr; to carriage return arrow', () => {\n      expect(decodeHtmlEntities('Press &crarr;')).toBe('Press ↵');\n    });\n\n    it('should decode double arrows', () => {\n      expect(decodeHtmlEntities('&lArr; &uArr; &rArr; &dArr; &hArr;')).toBe('⇐ ⇑ ⇒ ⇓ ⇔');\n    });\n  });\n\n  describe('Greek letters - lowercase', () => {\n    it('should decode common lowercase Greek letters', () => {\n      expect(decodeHtmlEntities('&alpha; &beta; &gamma; &delta;')).toBe('α β γ δ');\n    });\n\n    it('should decode &epsilon; &zeta; &eta; &theta;', () => {\n      expect(decodeHtmlEntities('&epsilon; &zeta; &eta; &theta;')).toBe('ε ζ η θ');\n    });\n\n    it('should decode &iota; &kappa; &lambda; &mu;', () => {\n      expect(decodeHtmlEntities('&iota; &kappa; &lambda; &mu;')).toBe('ι κ λ μ');\n    });\n\n    it('should decode &nu; &xi; &omicron; &pi;', () => {\n      expect(decodeHtmlEntities('&nu; &xi; &omicron; &pi;')).toBe('ν ξ ο π');\n    });\n\n    it('should decode &rho; &sigma; &tau; &upsilon;', () => {\n      expect(decodeHtmlEntities('&rho; &sigma; &tau; &upsilon;')).toBe('ρ σ τ υ');\n    });\n\n    it('should decode &phi; &chi; &psi; &omega;', () => {\n      expect(decodeHtmlEntities('&phi; &chi; &psi; &omega;')).toBe('φ χ ψ ω');\n    });\n  });\n\n  describe('Greek letters - uppercase', () => {\n    it('should decode common uppercase Greek letters', () => {\n      expect(decodeHtmlEntities('&Alpha; &Beta; &Gamma; &Delta;')).toBe('Α Β Γ Δ');\n    });\n\n    it('should decode &Epsilon; through &Theta;', () => {\n      expect(decodeHtmlEntities('&Epsilon; &Zeta; &Eta; &Theta;')).toBe('Ε Ζ Η Θ');\n    });\n\n    it('should decode &Sigma; &Phi; &Psi; &Omega;', () => {\n      expect(decodeHtmlEntities('&Sigma; &Phi; &Psi; &Omega;')).toBe('Σ Φ Ψ Ω');\n    });\n  });\n\n  describe('Latin extended - uppercase', () => {\n    it('should decode accented A variants', () => {\n      expect(decodeHtmlEntities('&Agrave; &Aacute; &Acirc; &Atilde; &Auml; &Aring;')).toBe(\n        'À Á Â Ã Ä Å',\n      );\n    });\n\n    it('should decode &AElig; and &Ccedil;', () => {\n      expect(decodeHtmlEntities('&AElig; &Ccedil;')).toBe('Æ Ç');\n    });\n\n    it('should decode accented E variants', () => {\n      expect(decodeHtmlEntities('&Egrave; &Eacute; &Ecirc; &Euml;')).toBe('È É Ê Ë');\n    });\n\n    it('should decode accented I variants', () => {\n      expect(decodeHtmlEntities('&Igrave; &Iacute; &Icirc; &Iuml;')).toBe('Ì Í Î Ï');\n    });\n\n    it('should decode &ETH; and &Ntilde;', () => {\n      expect(decodeHtmlEntities('&ETH; &Ntilde;')).toBe('Ð Ñ');\n    });\n\n    it('should decode accented O variants', () => {\n      expect(decodeHtmlEntities('&Ograve; &Oacute; &Ocirc; &Otilde; &Ouml; &Oslash;')).toBe(\n        'Ò Ó Ô Õ Ö Ø',\n      );\n    });\n\n    it('should decode accented U variants', () => {\n      expect(decodeHtmlEntities('&Ugrave; &Uacute; &Ucirc; &Uuml;')).toBe('Ù Ú Û Ü');\n    });\n\n    it('should decode &Yacute; and &THORN;', () => {\n      expect(decodeHtmlEntities('&Yacute; &THORN;')).toBe('Ý Þ');\n    });\n  });\n\n  describe('Latin extended - lowercase', () => {\n    it('should decode &szlig;', () => {\n      expect(decodeHtmlEntities('&szlig;')).toBe('ß');\n    });\n\n    it('should decode accented a variants', () => {\n      expect(decodeHtmlEntities('&agrave; &aacute; &acirc; &atilde; &auml; &aring;')).toBe(\n        'à á â ã ä å',\n      );\n    });\n\n    it('should decode &aelig; and &ccedil;', () => {\n      expect(decodeHtmlEntities('&aelig; &ccedil;')).toBe('æ ç');\n    });\n\n    it('should decode accented e variants', () => {\n      expect(decodeHtmlEntities('&egrave; &eacute; &ecirc; &euml;')).toBe('è é ê ë');\n    });\n\n    it('should decode accented i variants', () => {\n      expect(decodeHtmlEntities('&igrave; &iacute; &icirc; &iuml;')).toBe('ì í î ï');\n    });\n\n    it('should decode &eth; and &ntilde;', () => {\n      expect(decodeHtmlEntities('&eth; &ntilde;')).toBe('ð ñ');\n    });\n\n    it('should decode accented o variants', () => {\n      expect(decodeHtmlEntities('&ograve; &oacute; &ocirc; &otilde; &ouml; &oslash;')).toBe(\n        'ò ó ô õ ö ø',\n      );\n    });\n\n    it('should decode accented u variants', () => {\n      expect(decodeHtmlEntities('&ugrave; &uacute; &ucirc; &uuml;')).toBe('ù ú û ü');\n    });\n\n    it('should decode &yacute;, &thorn; and &yuml;', () => {\n      expect(decodeHtmlEntities('&yacute; &thorn; &yuml;')).toBe('ý þ ÿ');\n    });\n  });\n\n  describe('special characters', () => {\n    it('should decode &iexcl; and &iquest;', () => {\n      expect(decodeHtmlEntities('&iexcl; &iquest;')).toBe('¡ ¿');\n    });\n\n    it('should decode &fnof; to function symbol', () => {\n      expect(decodeHtmlEntities('f&fnof;(x)')).toBe('fƒ(x)');\n    });\n\n    it('should decode &circ; and &tilde;', () => {\n      expect(decodeHtmlEntities('&circ; &tilde;')).toBe('ˆ ˜');\n    });\n\n    it('should decode &OElig; and &oelig;', () => {\n      expect(decodeHtmlEntities('&OElig; &oelig;')).toBe('Œ œ');\n    });\n\n    it('should decode &Scaron;, &scaron; and &Yuml;', () => {\n      expect(decodeHtmlEntities('&Scaron; &scaron; &Yuml;')).toBe('Š š Ÿ');\n    });\n\n    it('should decode ordinal indicators', () => {\n      expect(decodeHtmlEntities('1&ordf; 2&ordm;')).toBe('1ª 2º');\n    });\n\n    it('should decode diacritical marks', () => {\n      expect(decodeHtmlEntities('&macr; &acute; &cedil;')).toBe('¯ ´ ¸');\n    });\n\n    it('should decode superscripts', () => {\n      expect(decodeHtmlEntities('x&sup1; x&sup2; x&sup3;')).toBe('x¹ x² x³');\n    });\n\n    it('should decode fractions', () => {\n      expect(decodeHtmlEntities('&frac14; &frac12; &frac34;')).toBe('¼ ½ ¾');\n    });\n  });\n\n  describe('card suits', () => {\n    it('should decode all card suit symbols', () => {\n      expect(decodeHtmlEntities('&spades; &clubs; &hearts; &diams;')).toBe('♠ ♣ ♥ ♦');\n    });\n  });\n\n  describe('miscellaneous symbols', () => {\n    it('should decode &loz; to lozenge', () => {\n      expect(decodeHtmlEntities('&loz;')).toBe('◊');\n    });\n\n    it('should decode mathematical script letters', () => {\n      expect(decodeHtmlEntities('&weierp; &image; &real; &alefsym;')).toBe('℘ ℑ ℜ ℵ');\n    });\n\n    it('should decode &oline; to overline', () => {\n      expect(decodeHtmlEntities('&oline;')).toBe('‾');\n    });\n\n    it('should decode &frasl; to fraction slash', () => {\n      expect(decodeHtmlEntities('1&frasl;2')).toBe('1⁄2');\n    });\n  });\n\n  describe('numeric entities', () => {\n    it('should decode decimal numeric entities', () => {\n      expect(decodeHtmlEntities('&#65;')).toBe('A');\n      expect(decodeHtmlEntities('&#169;')).toBe('©');\n      expect(decodeHtmlEntities('&#8230;')).toBe('…');\n    });\n\n    it('should decode hexadecimal numeric entities', () => {\n      expect(decodeHtmlEntities('&#x41;')).toBe('A');\n      expect(decodeHtmlEntities('&#xA9;')).toBe('©');\n      expect(decodeHtmlEntities('&#x2026;')).toBe('…');\n    });\n\n    it('should decode lowercase hex entities', () => {\n      expect(decodeHtmlEntities('&#x2f;')).toBe('/');\n      expect(decodeHtmlEntities('&#x3c;')).toBe('<');\n    });\n\n    it('should decode uppercase hex entities', () => {\n      expect(decodeHtmlEntities('&#x2F;')).toBe('/');\n      expect(decodeHtmlEntities('&#x3C;')).toBe('<');\n    });\n  });\n\n  describe('combined entities', () => {\n    it('should decode multiple entities in one string', () => {\n      const input = 'Tom &amp; Jerry &copy; 2024 &ndash; All rights reserved &trade;';\n      const expected = 'Tom & Jerry © 2024 – All rights reserved ™';\n      expect(decodeHtmlEntities(input)).toBe(expected);\n    });\n\n    it('should decode mixed named and numeric entities', () => {\n      const input = '&lt;div&gt;Hello &#8211; &#x201C;World&#x201D;&lt;/div&gt;';\n      const expected = '<div>Hello – \\u201CWorld\\u201D</div>';\n      expect(decodeHtmlEntities(input)).toBe(expected);\n    });\n\n    it('should handle entities at start, middle, and end', () => {\n      const input = '&copy; Start middle&nbsp;text end&trade;';\n      const expected = '© Start middle\\u00A0text end™';\n      expect(decodeHtmlEntities(input)).toBe(expected);\n    });\n\n    it('should decode consecutive entities', () => {\n      const input = '&lt;&gt;&amp;&quot;&apos;';\n      const expected = '<>&\"\\'';\n      expect(decodeHtmlEntities(input)).toBe(expected);\n    });\n  });\n\n  describe('edge cases', () => {\n    it('should return empty string for empty input', () => {\n      expect(decodeHtmlEntities('')).toBe('');\n    });\n\n    it('should return unchanged string when no entities present', () => {\n      const input = 'Hello World 123';\n      expect(decodeHtmlEntities(input)).toBe(input);\n    });\n\n    it('should handle string with only entities', () => {\n      expect(decodeHtmlEntities('&amp;&lt;&gt;')).toBe('&<>');\n    });\n\n    it('should not decode incomplete entities', () => {\n      expect(decodeHtmlEntities('&amp test')).toBe('&amp test');\n      expect(decodeHtmlEntities('&lt test')).toBe('&lt test');\n    });\n\n    it('should not decode unknown entities', () => {\n      expect(decodeHtmlEntities('&unknown;')).toBe('&unknown;');\n    });\n\n    it('should handle malformed numeric entities', () => {\n      expect(decodeHtmlEntities('&#;')).toBe('&#;');\n      expect(decodeHtmlEntities('&#x;')).toBe('&#x;');\n    });\n\n    it('should preserve non-entity ampersands', () => {\n      expect(decodeHtmlEntities('A & B')).toBe('A & B');\n      expect(decodeHtmlEntities('Tom & Jerry')).toBe('Tom & Jerry');\n    });\n\n    it('should handle entities within words', () => {\n      expect(decodeHtmlEntities('It&apos;s&nbsp;working')).toBe(\"It's\\u00A0working\");\n    });\n\n    it('should handle Unicode characters mixed with entities', () => {\n      expect(decodeHtmlEntities('Hello 世界 &amp; &euro;50')).toBe('Hello 世界 & €50');\n    });\n\n    it('should handle very long strings with many entities', () => {\n      const input = Array(100).fill('&copy;').join(' ');\n      const expected = Array(100).fill('©').join(' ');\n      expect(decodeHtmlEntities(input)).toBe(expected);\n    });\n  });\n\n  describe('real-world examples', () => {\n    it('should decode a typical copyright notice', () => {\n      const input = '&copy; 2024 Company Name&trade;. All rights reserved&reg;.';\n      const expected = '© 2024 Company Name™. All rights reserved®.';\n      expect(decodeHtmlEntities(input)).toBe(expected);\n    });\n\n    it('should decode a mathematical expression', () => {\n      const input = 'E = mc&sup2;, &pi; &asymp; 3.14159';\n      const expected = 'E = mc², π ≈ 3.14159';\n      expect(decodeHtmlEntities(input)).toBe(expected);\n    });\n\n    it('should decode formatted quotes', () => {\n      const input = '&ldquo;Hello, World!&rdquo; he said.';\n      const expected = '\\u201CHello, World!\\u201D he said.';\n      expect(decodeHtmlEntities(input)).toBe(expected);\n    });\n\n    it('should decode HTML snippet', () => {\n      const input = '&lt;div class=&quot;container&quot;&gt;Content&lt;/div&gt;';\n      const expected = '<div class=\"container\">Content</div>';\n      expect(decodeHtmlEntities(input)).toBe(expected);\n    });\n\n    it('should decode currency with symbols', () => {\n      const input = 'Price: &euro;99.99 or &pound;79.99 or &yen;10,000';\n      const expected = 'Price: €99.99 or £79.99 or ¥10,000';\n      expect(decodeHtmlEntities(input)).toBe(expected);\n    });\n\n    it('should decode temperature', () => {\n      const input = 'Temperature: 25&deg;C &plusmn; 2&deg;';\n      const expected = 'Temperature: 25°C ± 2°';\n      expect(decodeHtmlEntities(input)).toBe(expected);\n    });\n  });\n});\n"
  },
  {
    "path": "test/IcuTrans/utils/renderTranslation.spec.js",
    "content": "import { describe, it, expect } from 'vitest';\nimport React from 'react';\n\nimport { TranslationParserError, renderTranslation } from '../../../src/IcuTransUtils';\n\ndescribe('translationParser', () => {\n  it('should render plain text without any tags', () => {\n    const result = renderTranslation('Hello world');\n\n    expect(result).toEqual(['Hello world']);\n  });\n\n  it('should render text with a single tag', () => {\n    const declarations = [{ type: 'strong', props: {} }];\n\n    const result = renderTranslation('<0>bold text</0>', declarations);\n\n    expect(result).toHaveLength(1);\n\n    expect(React.isValidElement(result[0])).toBe(true);\n\n    const element = result[0];\n\n    expect(element.type).toBe('strong');\n\n    expect(element.props.children).toBe('bold text');\n  });\n\n  it('should render tags with surrounding text content', () => {\n    const declarations = [{ type: 'a', props: { href: '#' } }];\n\n    const result = renderTranslation('Click <0>here</0> to continue', declarations);\n\n    expect(result).toHaveLength(3);\n\n    expect(result[0]).toBe('Click ');\n\n    expect(React.isValidElement(result[1])).toBe(true);\n\n    expect(result[2]).toBe(' to continue');\n\n    const link = result[1];\n\n    expect(link.type).toBe('a');\n\n    expect(link.props.href).toBe('#');\n\n    expect(link.props.children).toBe('here');\n  });\n\n  it('should render multiple tags in sequence', () => {\n    const declarations = [\n      { type: 'strong', props: {} },\n      { type: 'em', props: {} },\n    ];\n\n    const result = renderTranslation('<0>bold</0> and <1>italic</1>', declarations);\n\n    expect(result).toHaveLength(3);\n\n    expect(React.isValidElement(result[0])).toBe(true);\n\n    expect(result[1]).toBe(' and ');\n\n    expect(React.isValidElement(result[2])).toBe(true);\n\n    const bold = result[0];\n\n    expect(bold.type).toBe('strong');\n\n    expect(bold.props.children).toBe('bold');\n\n    const italic = result[2];\n\n    expect(italic.type).toBe('em');\n\n    expect(italic.props.children).toBe('italic');\n  });\n\n  it('should render nested tags with proper hierarchy', () => {\n    const declarations = [\n      { type: 'div', props: {} },\n      { type: 'strong', props: {} },\n    ];\n\n    const result = renderTranslation('<0>outer <1>inner</1> text</0>', declarations);\n\n    expect(result).toHaveLength(1);\n\n    const outer = result[0];\n\n    expect(outer.type).toBe('div');\n\n    expect(outer.props.children).toHaveLength(3);\n\n    expect(outer.props.children[0]).toBe('outer ');\n\n    const inner = outer.props.children[1];\n\n    expect(React.isValidElement(inner)).toBe(true);\n\n    expect(inner.type).toBe('strong');\n\n    expect(inner.props.children).toBe('inner');\n\n    expect(outer.props.children[2]).toBe(' text');\n  });\n\n  it('should preserve all component props from declarations', () => {\n    const declarations = [\n      {\n        type: 'a',\n        props: { href: '/test', className: 'link', 'data-test': 'foo' },\n      },\n    ];\n\n    const result = renderTranslation('<0>link</0>', declarations);\n\n    expect(result).toHaveLength(1);\n\n    const element = result[0];\n\n    expect(element.props.href).toBe('/test');\n\n    expect(element.props.className).toBe('link');\n\n    expect(element.props['data-test']).toBe('foo');\n\n    expect(element.props.children).toBe('link');\n  });\n\n  it('should handle deeply nested tag structures', () => {\n    const declarations = [\n      { type: 'div', props: {} },\n      { type: 'span', props: {} },\n      { type: 'strong', props: {} },\n    ];\n\n    const result = renderTranslation('<0><1><2>deep</2></1></0>', declarations);\n\n    expect(result).toHaveLength(1);\n\n    const div = result[0];\n\n    expect(div.type).toBe('div');\n\n    const span = div.props.children;\n\n    expect(span.type).toBe('span');\n\n    const strong = span.props.children;\n\n    expect(strong.type).toBe('strong');\n\n    expect(strong.props.children).toBe('deep');\n  });\n\n  it('should handle self-closing and empty tags', () => {\n    const declarations = [{ type: 'Icon', props: { name: 'test' } }];\n\n    const result = renderTranslation('Text <0></0> more text', declarations);\n\n    expect(result).toHaveLength(3);\n\n    expect(result[0]).toBe('Text ');\n\n    expect(React.isValidElement(result[1])).toBe(true);\n\n    expect(result[2]).toBe(' more text');\n\n    const icon = result[1];\n\n    expect(icon.type).toBe('Icon');\n\n    expect(icon.props.name).toBe('test');\n\n    expect(icon.props.children).toBeUndefined();\n  });\n\n  it('should decode HTML entities in text content', () => {\n    const declarations = [{ type: 'strong', props: {} }];\n\n    const result = renderTranslation('<0>me &amp; you &lt; 5</0>', declarations);\n\n    expect(result).toHaveLength(1);\n\n    const element = result[0];\n\n    expect(element.props.children).toBe('me & you < 5');\n  });\n\n  it('should decode non-breaking space entities correctly', () => {\n    const declarations = [{ type: 'span', props: {} }];\n\n    const result = renderTranslation('<0>hello&nbsp;world</0>', declarations);\n\n    expect(result).toHaveLength(1);\n\n    const element = result[0];\n\n    expect(element.props.children).toBe('hello\\u00A0world');\n  });\n\n  it('should handle real-world translation with custom styling', () => {\n    const declarations = [{ type: 'div', props: { className: 'foo' } }];\n\n    const result = renderTranslation('<0>bonjour</0>', declarations);\n\n    expect(result).toHaveLength(1);\n\n    const element = result[0];\n\n    expect(element.type).toBe('div');\n\n    expect(element.props.className).toBe('foo');\n\n    expect(element.props.children).toBe('bonjour');\n  });\n\n  it('should handle real-world documentation link pattern with nested icon', () => {\n    const declarations = [\n      { type: 'a', props: { href: '#' } },\n      { type: 'Icon', props: { name: 'external-link' } },\n    ];\n\n    const result = renderTranslation(\n      'Voir <0>documentation <1></1></0> pour plus de détails.',\n      declarations,\n    );\n\n    expect(result).toHaveLength(3);\n\n    expect(result[0]).toBe('Voir ');\n\n    expect(React.isValidElement(result[1])).toBe(true);\n\n    expect(result[2]).toBe(' pour plus de détails.');\n\n    const link = result[1];\n\n    expect(link.type).toBe('a');\n\n    const linkChildren = React.Children.toArray(link.props.children);\n\n    expect(linkChildren).toHaveLength(2);\n\n    expect(linkChildren[0]).toBe('documentation ');\n\n    const icon = linkChildren[1];\n\n    expect(icon.type).toBe('Icon');\n\n    expect(icon.props.name).toBe('external-link');\n  });\n\n  it('should handle empty translation strings', () => {\n    const result = renderTranslation('');\n\n    expect(result).toEqual([]);\n  });\n\n  it('should preserve whitespace-only translations', () => {\n    const result = renderTranslation('   ');\n\n    expect(result).toEqual(['   ']);\n  });\n\n  it('should throw TranslationParserError for unexpected closing tags', () => {\n    expect(() => {\n      renderTranslation('Hello </0>', []);\n    }).toThrow(TranslationParserError);\n\n    expect(() => {\n      renderTranslation('Hello </0>', []);\n    }).toThrow('Unexpected closing tag');\n  });\n\n  it('should throw TranslationParserError for mismatched opening and closing tags', () => {\n    const declarations = [\n      { type: 'strong', props: {} },\n      { type: 'em', props: {} },\n    ];\n\n    expect(() => {\n      renderTranslation('<0>text</1>', declarations);\n    }).toThrow(TranslationParserError);\n\n    expect(() => {\n      renderTranslation('<0>text</1>', declarations);\n    }).toThrow('Mismatched tags');\n  });\n\n  it('should throw TranslationParserError for unclosed tags', () => {\n    const declarations = [{ type: 'strong', props: {} }];\n\n    expect(() => {\n      renderTranslation('<0>text', declarations);\n    }).toThrow(TranslationParserError);\n\n    expect(() => {\n      renderTranslation('<0>text', declarations);\n    }).toThrow('Unclosed tag');\n  });\n\n  it('should treat tags as literal text when declaration is missing', () => {\n    // Changed behavior: instead of throwing, treat missing declarations as literal text\n    const result = renderTranslation('<0>text</0>', []);\n\n    // The result will have the tag parts and text as separate array elements\n    expect(result).toEqual(['<0>', 'text', '</0>']);\n  });\n\n  it('should reuse the same declaration for multiple tags with identical numbers', () => {\n    const declarations = [{ type: 'strong', props: {} }];\n\n    const result = renderTranslation('<0>first</0> and <0>second</0>', declarations);\n\n    expect(result).toHaveLength(3);\n\n    expect(React.isValidElement(result[0])).toBe(true);\n\n    expect(result[1]).toBe(' and ');\n\n    expect(React.isValidElement(result[2])).toBe(true);\n\n    const first = result[0];\n\n    expect(first.type).toBe('strong');\n\n    expect(first.props.children).toBe('first');\n\n    const second = result[2];\n\n    expect(second.type).toBe('strong');\n\n    expect(second.props.children).toBe('second');\n  });\n\n  it('should pass through ICU variable placeholders without modification', () => {\n    const declarations = [{ type: 'strong', props: {} }];\n\n    const result = renderTranslation('<0>{userName}</0>', declarations);\n\n    expect(result).toHaveLength(1);\n\n    const element = result[0];\n\n    expect(element.props.children).toBe('{userName}');\n  });\n\n  it('should pass through complex ICU message syntax without modification', () => {\n    const declarations = [{ type: 'span', props: {} }];\n\n    const result = renderTranslation(\n      '<0>{count, plural, one {# item} other {# items}}</0>',\n      declarations,\n    );\n\n    expect(result).toHaveLength(1);\n\n    const element = result[0];\n\n    expect(element.props.children).toBe('{count, plural, one {# item} other {# items}}');\n  });\n\n  it('should render custom React component types from declarations', () => {\n    function CustomButton({ label }) {\n      return React.createElement('button', { type: 'button' }, label || 'Click');\n    }\n\n    const declarations = [{ type: CustomButton, props: { label: 'Custom' } }];\n\n    const result = renderTranslation('<0>text</0>', declarations);\n\n    expect(result).toHaveLength(1);\n\n    const element = result[0];\n\n    expect(element.type).toBe(CustomButton);\n\n    expect(element.props.label).toBe('Custom');\n\n    expect(element.props.children).toBe('text');\n  });\n\n  it('should handle declarations with pre-defined children prop structure', () => {\n    const declarations = [\n      {\n        type: 'div',\n        props: {\n          className: 'wrapper',\n          children: [{ type: 'span', props: { className: 'inner' } }],\n        },\n      },\n    ];\n\n    const result = renderTranslation('<0>text</0>', declarations);\n\n    expect(result).toHaveLength(1);\n\n    const element = result[0];\n\n    expect(element.type).toBe('div');\n\n    expect(element.props.className).toBe('wrapper');\n\n    expect(element.props.children).toBe('text');\n  });\n\n  it('should create TranslationParserError instances with all required properties', () => {\n    const error = new TranslationParserError('Test error', 10, 'test translation');\n\n    expect(error).toBeInstanceOf(Error);\n\n    expect(error).toBeInstanceOf(TranslationParserError);\n\n    expect(error.name).toBe('TranslationParserError');\n\n    expect(error.message).toBe('Test error');\n\n    expect(error.position).toBe(10);\n\n    expect(error.translationString).toBe('test translation');\n  });\n\n  it('should decode numeric HTML entities in both decimal and hexadecimal formats', () => {\n    const declarations = [{ type: 'span', props: {} }];\n\n    const result = renderTranslation('<0>&#65; &#x42;</0>', declarations);\n\n    expect(result).toHaveLength(1);\n\n    const element = result[0];\n\n    expect(element.props.children).toBe('A B');\n  });\n\n  it('should handle nested declarations containing children arrays for multi-level structures', () => {\n    const declarations = [\n      {\n        type: 'div',\n        props: {\n          style: { color: 'red' },\n          children: [\n            { type: 'code' }, // nested child that handles <0> inside parent\n          ],\n        },\n      },\n    ];\n\n    const result = renderTranslation(\n      'before <0>parent text and <0>nested content</0></0> after',\n      declarations,\n    );\n\n    expect(result).toHaveLength(3);\n\n    expect(result[0]).toBe('before ');\n\n    expect(result[2]).toBe(' after');\n\n    const parent = result[1];\n\n    expect(parent.type).toBe('div');\n\n    expect(parent.props.style).toEqual({ color: 'red' });\n\n    const parentChildren = React.Children.toArray(parent.props.children);\n\n    expect(parentChildren).toHaveLength(2);\n\n    expect(parentChildren[0]).toBe('parent text and ');\n\n    const nested = parentChildren[1];\n\n    expect(React.isValidElement(nested)).toBe(true);\n\n    expect(nested.type).toBe('code');\n\n    expect(nested.props.children).toBe('nested content');\n  });\n\n  it('should handle complex translations with multiple interpolation types and nested structures', () => {\n    const declarations = [\n      { type: 'strong' },\n      { type: 'strong' },\n      {\n        type: 'div',\n        props: {\n          style: { color: 'red' },\n          children: [{ type: 'code' }],\n        },\n      },\n    ];\n\n    const translation =\n      '<0>exciting!</0> hi there <1>friend</1>  and  another nested <2>with regular text and a date: <0>10/11/2025</0></2>';\n\n    const result = renderTranslation(translation, declarations);\n\n    expect(result).toHaveLength(5);\n\n    const exciting = result[0];\n\n    expect(React.isValidElement(exciting)).toBe(true);\n\n    expect(exciting.type).toBe('strong');\n\n    expect(exciting.props.children).toBe('exciting!');\n\n    expect(result[1]).toBe(' hi there ');\n\n    const friend = result[2];\n\n    expect(React.isValidElement(friend)).toBe(true);\n\n    expect(friend.type).toBe('strong');\n\n    expect(friend.props.children).toBe('friend');\n\n    expect(result[3]).toBe('  and  another nested ');\n\n    const boxElement = result[4];\n\n    expect(React.isValidElement(boxElement)).toBe(true);\n\n    expect(boxElement.type).toBe('div');\n\n    expect(boxElement.props.style).toEqual({ color: 'red' });\n\n    const boxChildren = React.Children.toArray(boxElement.props.children);\n\n    expect(boxChildren).toHaveLength(2);\n\n    expect(boxChildren[0]).toBe('with regular text and a date: ');\n\n    const codeElement = boxChildren[1];\n\n    expect(React.isValidElement(codeElement)).toBe(true);\n\n    expect(codeElement.type).toBe('code');\n\n    expect(codeElement.props.children).toBe('10/11/2025');\n  });\n\n  it('should handle list elements with nested list item children', () => {\n    const declarations = [\n      {\n        type: 'ul',\n        props: {\n          children: [{ type: 'li' }, { type: 'li' }],\n        },\n      },\n    ];\n\n    const translation = 'and the fallback <0><0>one</0><1>two</1></0>';\n\n    const result = renderTranslation(translation, declarations);\n\n    expect(result).toHaveLength(2);\n\n    expect(result[0]).toBe('and the fallback ');\n\n    const ul = result[1];\n\n    expect(React.isValidElement(ul)).toBe(true);\n\n    expect(ul.type).toBe('ul');\n\n    const ulChildren = React.Children.toArray(ul.props.children);\n\n    expect(ulChildren).toHaveLength(2);\n\n    const li1 = ulChildren[0];\n\n    expect(React.isValidElement(li1)).toBe(true);\n\n    expect(li1.type).toBe('li');\n\n    expect(li1.props.children).toBe('one');\n\n    const li2 = ulChildren[1];\n\n    expect(React.isValidElement(li2)).toBe(true);\n\n    expect(li2.type).toBe('li');\n\n    expect(li2.props.children).toBe('two');\n  });\n\n  it('should handle deeply nested tags interspersed with sibling text content', () => {\n    const declarations = [\n      { type: 'strong' },\n      { type: 'em' },\n      {\n        type: 'div',\n        props: {\n          children: [{ type: 'span' }],\n        },\n      },\n    ];\n\n    const translation =\n      'Start <0>bold</0> middle <1>italic</1> then <2>container <0>nested span</0></2> end';\n\n    const result = renderTranslation(translation, declarations);\n\n    expect(result).toHaveLength(7);\n\n    expect(result[0]).toBe('Start ');\n\n    const bold = result[1];\n\n    expect(bold.type).toBe('strong');\n\n    expect(bold.props.children).toBe('bold');\n\n    expect(result[2]).toBe(' middle ');\n\n    const italic = result[3];\n\n    expect(italic.type).toBe('em');\n\n    expect(italic.props.children).toBe('italic');\n\n    expect(result[4]).toBe(' then ');\n\n    const div = result[5];\n\n    expect(div.type).toBe('div');\n\n    const divChildren = React.Children.toArray(div.props.children);\n\n    expect(divChildren).toHaveLength(2);\n\n    expect(divChildren[0]).toBe('container ');\n\n    const span = divChildren[1];\n\n    expect(span.type).toBe('span');\n\n    expect(span.props.children).toBe('nested span');\n\n    expect(result[6]).toBe(' end');\n  });\n\n  it('should treat literal HTML tags as text, not component placeholders', () => {\n    // This tests the case where ICU messageformat might return literal HTML tags\n    // These should be rendered as text, not interpreted as component placeholders\n    const result = renderTranslation('and the fallback <ul><li>one</li><li>two</li></ul>', []);\n\n    expect(result).toEqual(['and the fallback <ul><li>one</li><li>two</li></ul>']);\n  });\n\n  it('should treat numbered tags as literal text when no corresponding declaration exists', () => {\n    // This tests the edge case where a translation has numbered tags but no declarations\n    // This can happen when using ICU select/plural with literal HTML in some branches\n    // The system should gracefully render these as literal text instead of throwing\n    const result = renderTranslation('and the fallback <3><0>one</0><1>two</1></3>', []);\n\n    // Each tag and text segment is returned as a separate array element\n    expect(result).toEqual([\n      'and the fallback ',\n      '<3>',\n      '<0>',\n      'one',\n      '</0>',\n      '<1>',\n      'two',\n      '</1>',\n      '</3>',\n    ]);\n  });\n\n  it('should handle literal tags nested inside valid components', () => {\n    // This tests the case where a literal tag (missing declaration) appears inside a valid component\n    // This covers the stack.length > 0 branch for literal tag handling\n    const declarations = [{ type: 'div', props: {} }];\n\n    const result = renderTranslation('<0>Text <1>missing</1> more</0>', declarations);\n\n    expect(result).toHaveLength(1);\n\n    const div = result[0];\n\n    expect(React.isValidElement(div)).toBe(true);\n\n    expect(div.type).toBe('div');\n\n    const divChildren = React.Children.toArray(div.props.children);\n\n    // Should have: 'Text ', '<1>', 'missing', '</1>', ' more'\n    expect(divChildren).toHaveLength(5);\n\n    expect(divChildren[0]).toBe('Text ');\n\n    expect(divChildren[1]).toBe('<1>');\n\n    expect(divChildren[2]).toBe('missing');\n\n    expect(divChildren[3]).toBe('</1>');\n\n    expect(divChildren[4]).toBe(' more');\n  });\n\n  it('should handle multiple nested literal tags inside valid components', () => {\n    // Test multiple literal tags at different nesting levels\n    const declarations = [\n      { type: 'div', props: {} },\n      { type: 'span', props: {} },\n    ];\n\n    const result = renderTranslation('<0><1>Valid <2>literal</2></1> text</0>', declarations);\n\n    expect(result).toHaveLength(1);\n\n    const div = result[0];\n\n    expect(div.type).toBe('div');\n\n    const divChildren = React.Children.toArray(div.props.children);\n\n    // Should have a span element and ' text'\n    expect(divChildren).toHaveLength(2);\n\n    const span = divChildren[0];\n\n    expect(React.isValidElement(span)).toBe(true);\n\n    expect(span.type).toBe('span');\n\n    const spanChildren = React.Children.toArray(span.props.children);\n\n    // Should have: 'Valid ', '<2>', 'literal', '</2>'\n    expect(spanChildren).toHaveLength(4);\n\n    expect(spanChildren[0]).toBe('Valid ');\n\n    expect(spanChildren[1]).toBe('<2>');\n\n    expect(spanChildren[2]).toBe('literal');\n\n    expect(spanChildren[3]).toBe('</2>');\n\n    expect(divChildren[1]).toBe(' text');\n  });\n});\n"
  },
  {
    "path": "test/IcuTrans/utils/tokenizer.spec.js",
    "content": "import { describe, it, expect } from 'vitest';\nimport { tokenize } from '../../../src/IcuTransUtils';\n\ndescribe('tokenizer', () => {\n  describe('plain text', () => {\n    it('should tokenize plain text without any tags', () => {\n      const result = tokenize('Hello world');\n\n      expect(result).toEqual([\n        {\n          type: 'Text',\n          value: 'Hello world',\n          position: 0,\n        },\n      ]);\n    });\n\n    it('should handle empty strings', () => {\n      const result = tokenize('');\n\n      expect(result).toEqual([]);\n    });\n\n    it('should preserve whitespace-only text', () => {\n      const result = tokenize('   ');\n\n      expect(result).toEqual([\n        {\n          type: 'Text',\n          value: '   ',\n          position: 0,\n        },\n      ]);\n    });\n\n    it('should preserve newlines and tabs', () => {\n      const result = tokenize('Hello\\nWorld\\tTest');\n\n      expect(result).toEqual([\n        {\n          type: 'Text',\n          value: 'Hello\\nWorld\\tTest',\n          position: 0,\n        },\n      ]);\n    });\n  });\n\n  describe('single tag', () => {\n    it('should tokenize a simple opening and closing tag', () => {\n      const result = tokenize('<0>text</0>');\n\n      expect(result).toEqual([\n        {\n          type: 'TagOpen',\n          value: '<0>',\n          position: 0,\n          tagNumber: 0,\n        },\n        {\n          type: 'Text',\n          value: 'text',\n          position: 3,\n        },\n        {\n          type: 'TagClose',\n          value: '</0>',\n          position: 7,\n          tagNumber: 0,\n        },\n      ]);\n    });\n\n    it('should tokenize tag with single-digit numbers', () => {\n      const result = tokenize('<5>content</5>');\n\n      expect(result).toEqual([\n        {\n          type: 'TagOpen',\n          value: '<5>',\n          position: 0,\n          tagNumber: 5,\n        },\n        {\n          type: 'Text',\n          value: 'content',\n          position: 3,\n        },\n        {\n          type: 'TagClose',\n          value: '</5>',\n          position: 10,\n          tagNumber: 5,\n        },\n      ]);\n    });\n\n    it('should tokenize tag with multi-digit numbers', () => {\n      const result = tokenize('<123>test</123>');\n\n      expect(result).toEqual([\n        {\n          type: 'TagOpen',\n          value: '<123>',\n          position: 0,\n          tagNumber: 123,\n        },\n        {\n          type: 'Text',\n          value: 'test',\n          position: 5,\n        },\n        {\n          type: 'TagClose',\n          value: '</123>',\n          position: 9,\n          tagNumber: 123,\n        },\n      ]);\n    });\n\n    it('should handle empty tags', () => {\n      const result = tokenize('<0></0>');\n\n      expect(result).toEqual([\n        {\n          type: 'TagOpen',\n          value: '<0>',\n          position: 0,\n          tagNumber: 0,\n        },\n        {\n          type: 'TagClose',\n          value: '</0>',\n          position: 3,\n          tagNumber: 0,\n        },\n      ]);\n    });\n  });\n\n  describe('text with tags', () => {\n    it('should tokenize text before a tag', () => {\n      const result = tokenize('Hello <0>world</0>');\n\n      expect(result).toEqual([\n        {\n          type: 'Text',\n          value: 'Hello ',\n          position: 0,\n        },\n        {\n          type: 'TagOpen',\n          value: '<0>',\n          position: 6,\n          tagNumber: 0,\n        },\n        {\n          type: 'Text',\n          value: 'world',\n          position: 9,\n        },\n        {\n          type: 'TagClose',\n          value: '</0>',\n          position: 14,\n          tagNumber: 0,\n        },\n      ]);\n    });\n\n    it('should tokenize text after a tag', () => {\n      const result = tokenize('<0>Hello</0> world');\n\n      expect(result).toEqual([\n        {\n          type: 'TagOpen',\n          value: '<0>',\n          position: 0,\n          tagNumber: 0,\n        },\n        {\n          type: 'Text',\n          value: 'Hello',\n          position: 3,\n        },\n        {\n          type: 'TagClose',\n          value: '</0>',\n          position: 8,\n          tagNumber: 0,\n        },\n        {\n          type: 'Text',\n          value: ' world',\n          position: 12,\n        },\n      ]);\n    });\n\n    it('should tokenize text before, inside, and after tags', () => {\n      const result = tokenize('Start <0>middle</0> end');\n\n      expect(result).toEqual([\n        {\n          type: 'Text',\n          value: 'Start ',\n          position: 0,\n        },\n        {\n          type: 'TagOpen',\n          value: '<0>',\n          position: 6,\n          tagNumber: 0,\n        },\n        {\n          type: 'Text',\n          value: 'middle',\n          position: 9,\n        },\n        {\n          type: 'TagClose',\n          value: '</0>',\n          position: 15,\n          tagNumber: 0,\n        },\n        {\n          type: 'Text',\n          value: ' end',\n          position: 19,\n        },\n      ]);\n    });\n  });\n\n  describe('multiple tags', () => {\n    it('should tokenize multiple consecutive tags', () => {\n      const result = tokenize('<0>first</0><1>second</1>');\n\n      expect(result).toEqual([\n        {\n          type: 'TagOpen',\n          value: '<0>',\n          position: 0,\n          tagNumber: 0,\n        },\n        {\n          type: 'Text',\n          value: 'first',\n          position: 3,\n        },\n        {\n          type: 'TagClose',\n          value: '</0>',\n          position: 8,\n          tagNumber: 0,\n        },\n        {\n          type: 'TagOpen',\n          value: '<1>',\n          position: 12,\n          tagNumber: 1,\n        },\n        {\n          type: 'Text',\n          value: 'second',\n          position: 15,\n        },\n        {\n          type: 'TagClose',\n          value: '</1>',\n          position: 21,\n          tagNumber: 1,\n        },\n      ]);\n    });\n\n    it('should tokenize multiple tags with text between them', () => {\n      const result = tokenize('<0>bold</0> and <1>italic</1>');\n\n      expect(result).toEqual([\n        {\n          type: 'TagOpen',\n          value: '<0>',\n          position: 0,\n          tagNumber: 0,\n        },\n        {\n          type: 'Text',\n          value: 'bold',\n          position: 3,\n        },\n        {\n          type: 'TagClose',\n          value: '</0>',\n          position: 7,\n          tagNumber: 0,\n        },\n        {\n          type: 'Text',\n          value: ' and ',\n          position: 11,\n        },\n        {\n          type: 'TagOpen',\n          value: '<1>',\n          position: 16,\n          tagNumber: 1,\n        },\n        {\n          type: 'Text',\n          value: 'italic',\n          position: 19,\n        },\n        {\n          type: 'TagClose',\n          value: '</1>',\n          position: 25,\n          tagNumber: 1,\n        },\n      ]);\n    });\n\n    it('should handle the same tag number used multiple times', () => {\n      const result = tokenize('<0>first</0> and <0>second</0>');\n\n      expect(result).toEqual([\n        {\n          type: 'TagOpen',\n          value: '<0>',\n          position: 0,\n          tagNumber: 0,\n        },\n        {\n          type: 'Text',\n          value: 'first',\n          position: 3,\n        },\n        {\n          type: 'TagClose',\n          value: '</0>',\n          position: 8,\n          tagNumber: 0,\n        },\n        {\n          type: 'Text',\n          value: ' and ',\n          position: 12,\n        },\n        {\n          type: 'TagOpen',\n          value: '<0>',\n          position: 17,\n          tagNumber: 0,\n        },\n        {\n          type: 'Text',\n          value: 'second',\n          position: 20,\n        },\n        {\n          type: 'TagClose',\n          value: '</0>',\n          position: 26,\n          tagNumber: 0,\n        },\n      ]);\n    });\n  });\n\n  describe('nested tags', () => {\n    it('should tokenize nested tags', () => {\n      const result = tokenize('<0>outer <1>inner</1> text</0>');\n\n      expect(result).toEqual([\n        {\n          type: 'TagOpen',\n          value: '<0>',\n          position: 0,\n          tagNumber: 0,\n        },\n        {\n          type: 'Text',\n          value: 'outer ',\n          position: 3,\n        },\n        {\n          type: 'TagOpen',\n          value: '<1>',\n          position: 9,\n          tagNumber: 1,\n        },\n        {\n          type: 'Text',\n          value: 'inner',\n          position: 12,\n        },\n        {\n          type: 'TagClose',\n          value: '</1>',\n          position: 17,\n          tagNumber: 1,\n        },\n        {\n          type: 'Text',\n          value: ' text',\n          position: 21,\n        },\n        {\n          type: 'TagClose',\n          value: '</0>',\n          position: 26,\n          tagNumber: 0,\n        },\n      ]);\n    });\n\n    it('should tokenize deeply nested tags', () => {\n      const result = tokenize('<0><1><2>deep</2></1></0>');\n\n      expect(result).toEqual([\n        {\n          type: 'TagOpen',\n          value: '<0>',\n          position: 0,\n          tagNumber: 0,\n        },\n        {\n          type: 'TagOpen',\n          value: '<1>',\n          position: 3,\n          tagNumber: 1,\n        },\n        {\n          type: 'TagOpen',\n          value: '<2>',\n          position: 6,\n          tagNumber: 2,\n        },\n        {\n          type: 'Text',\n          value: 'deep',\n          position: 9,\n        },\n        {\n          type: 'TagClose',\n          value: '</2>',\n          position: 13,\n          tagNumber: 2,\n        },\n        {\n          type: 'TagClose',\n          value: '</1>',\n          position: 17,\n          tagNumber: 1,\n        },\n        {\n          type: 'TagClose',\n          value: '</0>',\n          position: 21,\n          tagNumber: 0,\n        },\n      ]);\n    });\n  });\n\n  describe('non-tag angle brackets', () => {\n    it('should treat < as text when not followed by digits', () => {\n      const result = tokenize('5 < 10');\n\n      expect(result).toEqual([\n        {\n          type: 'Text',\n          value: '5 < 10',\n          position: 0,\n        },\n      ]);\n    });\n\n    it('should treat </ as text when not followed by digits and >', () => {\n      const result = tokenize('a </div>');\n\n      expect(result).toEqual([\n        {\n          type: 'Text',\n          value: 'a </div>',\n          position: 0,\n        },\n      ]);\n    });\n\n    it('should treat incomplete tags as text', () => {\n      const result = tokenize('<0 not a tag');\n\n      expect(result).toEqual([\n        {\n          type: 'Text',\n          value: '<0 not a tag',\n          position: 0,\n        },\n      ]);\n    });\n\n    it(\"should handle text with < and > that aren't tags\", () => {\n      const result = tokenize('x < y && z > w');\n\n      expect(result).toEqual([\n        {\n          type: 'Text',\n          value: 'x < y && z > w',\n          position: 0,\n        },\n      ]);\n    });\n\n    it('should handle mixed valid tags and non-tag brackets', () => {\n      const result = tokenize('<0>5 < 10</0>');\n\n      expect(result).toEqual([\n        {\n          type: 'TagOpen',\n          value: '<0>',\n          position: 0,\n          tagNumber: 0,\n        },\n        {\n          type: 'Text',\n          value: '5 < 10',\n          position: 3,\n        },\n        {\n          type: 'TagClose',\n          value: '</0>',\n          position: 9,\n          tagNumber: 0,\n        },\n      ]);\n    });\n  });\n\n  describe('ICU variable placeholders', () => {\n    it('should treat ICU variables as text', () => {\n      const result = tokenize('{userName}');\n\n      expect(result).toEqual([\n        {\n          type: 'Text',\n          value: '{userName}',\n          position: 0,\n        },\n      ]);\n    });\n\n    it('should handle tags with ICU variables', () => {\n      const result = tokenize('<0>Hello {userName}</0>');\n\n      expect(result).toEqual([\n        {\n          type: 'TagOpen',\n          value: '<0>',\n          position: 0,\n          tagNumber: 0,\n        },\n        {\n          type: 'Text',\n          value: 'Hello {userName}',\n          position: 3,\n        },\n        {\n          type: 'TagClose',\n          value: '</0>',\n          position: 19,\n          tagNumber: 0,\n        },\n      ]);\n    });\n\n    it('should handle complex ICU plurals', () => {\n      const result = tokenize('<0>{count, plural, one {# item} other {# items}}</0>');\n\n      expect(result).toEqual([\n        {\n          type: 'TagOpen',\n          value: '<0>',\n          position: 0,\n          tagNumber: 0,\n        },\n        {\n          type: 'Text',\n          value: '{count, plural, one {# item} other {# items}}',\n          position: 3,\n        },\n        {\n          type: 'TagClose',\n          value: '</0>',\n          position: 48,\n          tagNumber: 0,\n        },\n      ]);\n    });\n  });\n\n  describe('position tracking', () => {\n    it('should track positions correctly for single tag', () => {\n      const result = tokenize('<0>test</0>');\n\n      expect(result[0].position).toBe(0); // <0>\n\n      expect(result[1].position).toBe(3); // test\n\n      expect(result[2].position).toBe(7); // </0>\n    });\n\n    it('should track positions correctly with leading text', () => {\n      const result = tokenize('Hello <0>world</0>');\n\n      expect(result[0].position).toBe(0); // Hello\n\n      expect(result[1].position).toBe(6); // <0>\n\n      expect(result[2].position).toBe(9); // world\n\n      expect(result[3].position).toBe(14); // </0>\n    });\n\n    it('should track positions correctly for nested tags', () => {\n      const result = tokenize('<0>a <1>b</1> c</0>');\n\n      expect(result[0].position).toBe(0); // <0>\n\n      expect(result[1].position).toBe(3); // a\n\n      expect(result[2].position).toBe(5); // <1>\n\n      expect(result[3].position).toBe(8); // b\n\n      expect(result[4].position).toBe(9); // </1>\n\n      expect(result[5].position).toBe(13); // c\n\n      expect(result[6].position).toBe(15); // </0>\n    });\n\n    it('should track positions correctly with multi-digit tag numbers', () => {\n      const result = tokenize('<123>test</123>');\n\n      expect(result[0].position).toBe(0); // <123>\n\n      expect(result[1].position).toBe(5); // test\n\n      expect(result[2].position).toBe(9); // </123>\n    });\n  });\n\n  describe('edge cases', () => {\n    it('should handle tag at the very end of string', () => {\n      const result = tokenize('text <0>end</0>');\n\n      expect(result).toHaveLength(4);\n\n      expect(result[3].type).toBe('TagClose');\n    });\n\n    it('should handle tag at the very beginning of string', () => {\n      const result = tokenize('<0>start</0> text');\n\n      expect(result).toHaveLength(4);\n\n      expect(result[0].type).toBe('TagOpen');\n    });\n\n    it('should handle only opening tags (no validation)', () => {\n      // Note: tokenizer doesn't validate matching, just tokenizes\n      const result = tokenize('<0>text');\n\n      expect(result).toEqual([\n        {\n          type: 'TagOpen',\n          value: '<0>',\n          position: 0,\n          tagNumber: 0,\n        },\n        {\n          type: 'Text',\n          value: 'text',\n          position: 3,\n        },\n      ]);\n    });\n\n    it('should handle only closing tags (no validation)', () => {\n      // Note: tokenizer doesn't validate matching, just tokenizes\n      const result = tokenize('text</0>');\n\n      expect(result).toEqual([\n        {\n          type: 'Text',\n          value: 'text',\n          position: 0,\n        },\n        {\n          type: 'TagClose',\n          value: '</0>',\n          position: 4,\n          tagNumber: 0,\n        },\n      ]);\n    });\n\n    it('should handle mismatched tag numbers (no validation)', () => {\n      // Note: tokenizer doesn't validate matching, just tokenizes\n      const result = tokenize('<0>text</1>');\n\n      expect(result).toEqual([\n        {\n          type: 'TagOpen',\n          value: '<0>',\n          position: 0,\n          tagNumber: 0,\n        },\n        {\n          type: 'Text',\n          value: 'text',\n          position: 3,\n        },\n        {\n          type: 'TagClose',\n          value: '</1>',\n          position: 7,\n          tagNumber: 1,\n        },\n      ]);\n    });\n\n    it('should handle special characters inside tags', () => {\n      const result = tokenize('<0>Hello & goodbye \\'quotes\\' \"double\"</0>');\n\n      expect(result).toEqual([\n        {\n          type: 'TagOpen',\n          value: '<0>',\n          position: 0,\n          tagNumber: 0,\n        },\n        {\n          type: 'Text',\n          value: 'Hello & goodbye \\'quotes\\' \"double\"',\n          position: 3,\n        },\n        {\n          type: 'TagClose',\n          value: '</0>',\n          position: 36,\n          tagNumber: 0,\n        },\n      ]);\n    });\n\n    it('should handle Unicode characters', () => {\n      const result = tokenize('<0>Hello 世界 🌍</0>');\n\n      expect(result).toEqual([\n        {\n          type: 'TagOpen',\n          value: '<0>',\n          position: 0,\n          tagNumber: 0,\n        },\n        {\n          type: 'Text',\n          value: 'Hello 世界 🌍',\n          position: 3,\n        },\n        {\n          type: 'TagClose',\n          value: '</0>',\n          position: 14, // Emoji counts as 2 characters in JavaScript\n          tagNumber: 0,\n        },\n      ]);\n    });\n  });\n\n  describe('real-world examples', () => {\n    it('should tokenize a link with an icon', () => {\n      const result = tokenize('See <0>documentation <1></1></0> for details.');\n\n      expect(result).toHaveLength(7);\n\n      expect(result[0].type).toBe('Text');\n\n      expect(result[0].value).toBe('See ');\n\n      expect(result[1].type).toBe('TagOpen');\n\n      expect(result[1].tagNumber).toBe(0);\n\n      expect(result[2].type).toBe('Text');\n\n      expect(result[2].value).toBe('documentation ');\n\n      expect(result[3].type).toBe('TagOpen');\n\n      expect(result[3].tagNumber).toBe(1);\n\n      expect(result[4].type).toBe('TagClose');\n\n      expect(result[4].tagNumber).toBe(1);\n\n      expect(result[5].type).toBe('TagClose');\n\n      expect(result[5].tagNumber).toBe(0);\n\n      expect(result[6].type).toBe('Text');\n\n      expect(result[6].value).toBe(' for details.');\n    });\n\n    it('should tokenize a complex sentence with multiple styled parts', () => {\n      const result = tokenize(\n        'Click <0>here</0> to view your <1>account settings</1> or <2>log out</2>.',\n      );\n\n      const tagOpenTokens = result.filter((t) => t.type === 'TagOpen');\n      const tagCloseTokens = result.filter((t) => t.type === 'TagClose');\n      const textTokens = result.filter((t) => t.type === 'Text');\n\n      expect(tagOpenTokens).toHaveLength(3);\n\n      expect(tagCloseTokens).toHaveLength(3);\n\n      expect(textTokens).toHaveLength(7); // Text between and inside tags\n\n      // Verify tag numbers are correct\n      expect(tagOpenTokens[0].tagNumber).toBe(0);\n\n      expect(tagOpenTokens[1].tagNumber).toBe(1);\n\n      expect(tagOpenTokens[2].tagNumber).toBe(2);\n    });\n\n    it('should tokenize nested list structure', () => {\n      const result = tokenize('<0><0>First item</0><1>Second item</1></0>');\n\n      expect(result[0]).toMatchObject({\n        type: 'TagOpen',\n        tagNumber: 0,\n      });\n\n      expect(result[1]).toMatchObject({\n        type: 'TagOpen',\n        tagNumber: 0,\n      });\n\n      expect(result[2]).toMatchObject({\n        type: 'Text',\n        value: 'First item',\n      });\n\n      expect(result[3]).toMatchObject({\n        type: 'TagClose',\n        tagNumber: 0,\n      });\n\n      expect(result[4]).toMatchObject({\n        type: 'TagOpen',\n        tagNumber: 1,\n      });\n\n      expect(result[5]).toMatchObject({\n        type: 'Text',\n        value: 'Second item',\n      });\n\n      expect(result[6]).toMatchObject({\n        type: 'TagClose',\n        tagNumber: 1,\n      });\n\n      expect(result[7]).toMatchObject({\n        type: 'TagClose',\n        tagNumber: 0,\n      });\n    });\n  });\n\n  describe('type safety', () => {\n    it('should return tokens with correct types', () => {\n      const result = tokenize('<0>test</0>');\n\n      expect(result[0].type).toBe('TagOpen');\n\n      expect(result[1].type).toBe('Text');\n\n      expect(result[2].type).toBe('TagClose');\n    });\n\n    it('should include tagNumber only for tag tokens', () => {\n      const result = tokenize('<0>test</0>');\n\n      expect(result[0].tagNumber).toBeDefined();\n\n      expect(result[1].tagNumber).toBeUndefined();\n\n      expect(result[2].tagNumber).toBeDefined();\n    });\n\n    it('should always include position for all tokens', () => {\n      const result = tokenize('<0>test</0>');\n\n      result.forEach((token) => {\n        expect(token.position).toBeDefined();\n\n        expect(typeof token.position).toBe('number');\n      });\n    });\n  });\n});\n"
  },
  {
    "path": "test/Translation.spec.jsx",
    "content": "import { describe, it, vitest, expect, afterEach } from 'vitest';\nimport React from 'react';\nimport { render, cleanup } from '@testing-library/react';\nimport './i18n';\nimport { Translation } from '../src/Translation';\n\nvitest.unmock('../src/Translation');\n\ndescribe('Translation', () => {\n  afterEach(() => {\n    cleanup();\n  });\n\n  function TestComponent() {\n    return <Translation>{(t) => <div>{t('key1')}</div>}</Translation>;\n  }\n\n  it('should render correct content', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        test\n      </div>\n    `);\n  });\n});\n"
  },
  {
    "path": "test/__snapshots__/icu.macro.spec.js.snap",
    "content": "// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html\n\nexports[`macros > 1. macros > 1. macros 1`] = `\n\"\n\nimport { Trans } from '../../../icu.macro'\n\nconst x = <Trans>Welcome, { name }!</Trans>\n    \n\n      ↓ ↓ ↓ ↓ ↓ ↓\n\nimport { IcuTrans } from 'react-i18next';\nconst x = (\n  <IcuTrans\n    defaultTranslation=\"Welcome, {name}!\"\n    content={[]}\n    values={{\n      name,\n    }}\n  />\n);\n\"\n`;\n\nexports[`macros > 2. macros > 2. macros 1`] = `\n\"\n\nimport { Trans } from '../../../icu.macro'\n\nconst x = <Trans>Welcome, <strong>{ name }</strong>!</Trans>\n    \n\n      ↓ ↓ ↓ ↓ ↓ ↓\n\nimport { IcuTrans } from 'react-i18next';\nconst x = (\n  <IcuTrans\n    defaultTranslation=\"Welcome, <0>{name}</0>!\"\n    content={[\n      {\n        type: 'strong',\n      },\n    ]}\n    values={{\n      name,\n    }}\n  />\n);\n\"\n`;\n\nexports[`macros > 3. macros > 3. macros 1`] = `\n\"\n\nimport { Trans } from '../../../icu.macro'\nimport { useTranslation } from 'react-i18next'\n\nconst x = <Trans>Trainers: { trainersCount, number }</Trans>\n    \n\n      ↓ ↓ ↓ ↓ ↓ ↓\n\nimport { useTranslation, IcuTrans } from 'react-i18next';\nconst x = (\n  <IcuTrans\n    defaultTranslation=\"Trainers: {trainersCount, number}\"\n    content={[]}\n    values={{\n      trainersCount,\n    }}\n  />\n);\n\"\n`;\n\nexports[`macros > 4. macros > 4. macros 1`] = `\n\"\n\nimport { Trans } from '../../../icu.macro'\n\nconst x = <Trans>Trainers: <strong>{ trainersCount, number }</strong>!</Trans>\n    \n\n      ↓ ↓ ↓ ↓ ↓ ↓\n\nimport { IcuTrans } from 'react-i18next';\nconst x = (\n  <IcuTrans\n    defaultTranslation=\"Trainers: <0>{trainersCount, number}</0>!\"\n    content={[\n      {\n        type: 'strong',\n      },\n    ]}\n    values={{\n      trainersCount,\n    }}\n  />\n);\n\"\n`;\n\nexports[`macros > 5. macros > 5. macros 1`] = `\n\"\n\nimport { Trans } from '../../../icu.macro'\n\nconst x = <Trans>Caught on { catchDate, date, short }</Trans>\n    \n\n      ↓ ↓ ↓ ↓ ↓ ↓\n\nimport { IcuTrans } from 'react-i18next';\nconst x = (\n  <IcuTrans\n    defaultTranslation=\"Caught on {catchDate, date, short}\"\n    content={[]}\n    values={{\n      catchDate,\n    }}\n  />\n);\n\"\n`;\n\nexports[`macros > 6. macros > 6. macros 1`] = `\n\"\n\nimport { Trans } from '../../../icu.macro'\n\nconst x = <Trans>Caught on <strong>{ catchDate, date, short }</strong>!</Trans>\n    \n\n      ↓ ↓ ↓ ↓ ↓ ↓\n\nimport { IcuTrans } from 'react-i18next';\nconst x = (\n  <IcuTrans\n    defaultTranslation=\"Caught on <0>{catchDate, date, short}</0>!\"\n    content={[\n      {\n        type: 'strong',\n      },\n    ]}\n    values={{\n      catchDate,\n    }}\n  />\n);\n\"\n`;\n\nexports[`macros > 7. macros > 7. macros 1`] = `\n\"\n\nimport { Trans } from '../../../icu.macro'\n\nconst x = <Trans defaults=\"Trainers: { trainersCount, number }\" />\n    \n\n      ↓ ↓ ↓ ↓ ↓ ↓\n\nimport { IcuTrans } from 'react-i18next';\nconst x = (\n  <IcuTrans\n    defaultTranslation=\"Trainers: {trainersCount, number}\"\n    content={[]}\n    values={{\n      trainersCount,\n    }}\n  />\n);\n\"\n`;\n\nexports[`macros > 8. macros > 8. macros 1`] = `\n\"\n\nimport { Trans } from '../../../icu.macro'\n\nconst x = <Trans i18nKey=\"trainersWithDefaults\" defaults=\"Trainers: <strong>{ trainersCount, number }</strong>!\" />\n    \n\n      ↓ ↓ ↓ ↓ ↓ ↓\n\nimport { IcuTrans } from 'react-i18next';\nconst x = (\n  <IcuTrans\n    i18nKey=\"trainersWithDefaults\"\n    defaultTranslation=\"Trainers: <0>{trainersCount, number}</0>!\"\n    content={[\n      {\n        type: 'strong',\n      },\n    ]}\n    values={{\n      trainersCount,\n    }}\n  />\n);\n\"\n`;\n\nexports[`macros > 9. macros > 9. macros 1`] = `\n\"\n\nimport { Trans } from '../../../icu.macro'\n\nconst x = <Trans i18nKey=\"caughtWithDefaults\" defaults=\"Caught on { catchDate, date, short }\" />\n    \n\n      ↓ ↓ ↓ ↓ ↓ ↓\n\nimport { IcuTrans } from 'react-i18next';\nconst x = (\n  <IcuTrans\n    i18nKey=\"caughtWithDefaults\"\n    defaultTranslation=\"Caught on {catchDate, date, short}\"\n    content={[]}\n    values={{\n      catchDate,\n    }}\n  />\n);\n\"\n`;\n\nexports[`macros > 10. macros > 10. macros 1`] = `\n\"\n\nimport { Trans } from '../../../icu.macro'\n\nconst x = <Trans defaults=\"Caught on <strong>{ catchDate, date, short }</strong>!\" />\n    \n\n      ↓ ↓ ↓ ↓ ↓ ↓\n\nimport { IcuTrans } from 'react-i18next';\nconst x = (\n  <IcuTrans\n    defaultTranslation=\"Caught on <0>{catchDate, date, short}</0>!\"\n    content={[\n      {\n        type: 'strong',\n      },\n    ]}\n    values={{\n      catchDate,\n    }}\n  />\n);\n\"\n`;\n\nexports[`macros > 11. macros > 11. macros 1`] = `\n\"\n\nimport { Trans } from '../../../icu.macro'\nconst Link = ({to, children}) => (<a href={to}>{children}</a>)\n\nconst x = <Trans defaults=\"Caught on <Link to='/dest'>{ catchDate, date, short }</Link>!\" values={{catchDate: Date.now()}}>This should be overridden by defaults</Trans>\n    \n\n      ↓ ↓ ↓ ↓ ↓ ↓\n\nimport { IcuTrans } from 'react-i18next';\nconst Link = ({ to, children }) => <a href={to}>{children}</a>;\nconst x = (\n  <IcuTrans\n    values={{\n      catchDate: Date.now(),\n    }}\n    defaultTranslation=\"Caught on <0>{catchDate, date, short}</0>!\"\n    content={[\n      {\n        type: Link,\n        props: {\n          to: '/dest',\n        },\n      },\n    ]}\n  />\n);\n\"\n`;\n\nexports[`macros > 12. macros > 12. macros 1`] = `\n\"\n\nimport { Trans } from '../../../icu.macro'\n\nconst x = <Trans i18nKey=\"trainersWithDefaults\" values={{trainersCount}} defaults=\"Trainers: <strong>{ trainersCount, number }</strong>!\" components={[]} />\n    \n\n      ↓ ↓ ↓ ↓ ↓ ↓\n\nimport { IcuTrans } from 'react-i18next';\nconst x = (\n  <IcuTrans\n    i18nKey=\"trainersWithDefaults\"\n    values={{\n      trainersCount,\n    }}\n    defaultTranslation=\"\"\n    content={[]}\n  />\n);\n\"\n`;\n\nexports[`macros > 13. macros > 13. macros 1`] = `\n\"\n\nimport { Select } from '../../../icu.macro'\n\nconst x = <Select\n  i18nKey=\"selectExample\"\n  switch={gender}\n  male=\"He avoids bugs.\"\n  female=\"She avoids bugs.\"\n  other=\"They avoid bugs.\"\n/>\n    \n\n      ↓ ↓ ↓ ↓ ↓ ↓\n\nimport { IcuTrans } from 'react-i18next';\nconst x = (\n  <IcuTrans\n    i18nKey=\"selectExample\"\n    defaultTranslation=\"{gender, select,  male {He avoids bugs.} female {She avoids bugs.} other {They avoid bugs.}}\"\n    content={[]}\n    values={{\n      gender,\n    }}\n  />\n);\n\"\n`;\n\nexports[`macros > 14. macros > 14. macros 1`] = `\n\"\n\nimport { Select } from '../../../icu.macro'\n\nconst x = <Select\n  switch={gender}\n  male={<Trans><strong>He</strong> avoids bugs.</Trans>}\n  female={<Trans><strong>She</strong> avoids bugs.</Trans>}\n  other={<Trans><strong>They</strong> avoid bugs.</Trans>}\n/>\n    \n\n      ↓ ↓ ↓ ↓ ↓ ↓\n\nimport { IcuTrans } from 'react-i18next';\nconst x = (\n  <IcuTrans\n    defaultTranslation=\"{gender, select,  male {<0>He</0> avoids bugs.} female {<1>She</1> avoids bugs.} other {<2>They</2> avoid bugs.}}\"\n    content={[\n      {\n        type: 'strong',\n      },\n      {\n        type: 'strong',\n      },\n      {\n        type: 'strong',\n      },\n    ]}\n    values={{\n      gender,\n    }}\n  />\n);\n\"\n`;\n\nexports[`macros > 15. macros > 15. macros 1`] = `\n\"\n\nimport { Plural } from '../../../icu.macro'\n\nconst x = <Plural\n  count={itemsCount1}\n  $0=\"There are no items.\"\n  one=\"There is # item.\"\n  other=\"There are # items.\"\n/>\n    \n\n      ↓ ↓ ↓ ↓ ↓ ↓\n\nimport { IcuTrans } from 'react-i18next';\nconst x = (\n  <IcuTrans\n    defaultTranslation=\"{itemsCount1, plural,  =0 {There are no items.} one {There is # item.} other {There are # items.}}\"\n    content={[]}\n    values={{\n      itemsCount1,\n    }}\n  />\n);\n\"\n`;\n\nexports[`macros > 16. macros > 16. macros 1`] = `\n\"\n\nimport { Plural } from '../../../icu.macro'\n\nconst x = <Plural\n  i18nKey=\"testKey\"\n  count={itemsCount3}\n  $0={<Trans>There is <strong>no</strong> item.</Trans>}\n  one={<Trans>There is <strong>#</strong> item.</Trans>}\n  other={<Trans>There are <strong>#</strong> items.</Trans>}\n/>\n    \n\n      ↓ ↓ ↓ ↓ ↓ ↓\n\nimport { IcuTrans } from 'react-i18next';\nconst x = (\n  <IcuTrans\n    i18nKey=\"testKey\"\n    defaultTranslation=\"{itemsCount3, plural,  =0 {There is <0>no</0> item.} one {There is <1>#</1> item.} other {There are <2>#</2> items.}}\"\n    content={[\n      {\n        type: 'strong',\n      },\n      {\n        type: 'strong',\n      },\n      {\n        type: 'strong',\n      },\n    ]}\n    values={{\n      itemsCount3,\n    }}\n  />\n);\n\"\n`;\n\nexports[`macros > 17. macros > 17. macros 1`] = `\n\"\n\nimport { Plural } from '../../../icu.macro'\n\nconst x = <Plural\n  i18nKey=\"testKey\"\n  count={itemsCount3}\n  values={{location: 'table'}}\n  $0={<Trans>There is <strong>no</strong> item on the <i>{location}</i>.</Trans>}\n  one={<Trans>There is <strong>#</strong> item on the <i>{location}</i>.</Trans>}\n  other={<Trans>There are <strong>#</strong> items on the <i>{location}</i>.</Trans>}\n/>\n    \n\n      ↓ ↓ ↓ ↓ ↓ ↓\n\nimport { IcuTrans } from 'react-i18next';\nconst x = (\n  <IcuTrans\n    i18nKey=\"testKey\"\n    defaultTranslation=\"{itemsCount3, plural,  =0 {There is <0>no</0> item on the <1>{location}</1>.} one {There is <2>#</2> item on the <3>{location}</3>.} other {There are <4>#</4> items on the <5>{location}</5>.}}\"\n    content={[\n      {\n        type: 'strong',\n      },\n      {\n        type: 'i',\n      },\n      {\n        type: 'strong',\n      },\n      {\n        type: 'i',\n      },\n      {\n        type: 'strong',\n      },\n      {\n        type: 'i',\n      },\n    ]}\n    values={{\n      itemsCount3,\n      location: 'table',\n    }}\n  />\n);\n\"\n`;\n\nexports[`macros > 18. macros > 18. macros 1`] = `\n\"\n\nimport { SelectOrdinal } from '../../../icu.macro'\n\nconst x = <SelectOrdinal\n  count={position}\n  zero=\"You are #th in line\"\n  one=\"You are #st in line\"\n  two=\"You are #nd in line\"\n  few=\"You are #rd in line\"\n  many=\"You are #th in line\"\n  other=\"You are #th in line\"\n  $7=\"You are in the lucky #th place in line\"\n/>\n    \n\n      ↓ ↓ ↓ ↓ ↓ ↓\n\nimport { IcuTrans } from 'react-i18next';\nconst x = (\n  <IcuTrans\n    defaultTranslation=\"{position, selectordinal,  zero {You are #th in line} one {You are #st in line} two {You are #nd in line} few {You are #rd in line} many {You are #th in line} other {You are #th in line} =7 {You are in the lucky #th place in line}}\"\n    content={[]}\n    values={{\n      position,\n    }}\n  />\n);\n\"\n`;\n\nexports[`macros > 19. macros > 19. macros 1`] = `\n\"\n\nimport { SelectOrdinal } from '../../../icu.macro'\n\nconst x = <SelectOrdinal\n  i18nKey=\"testKey\"\n  count={position}\n  one={<Trans>You are <strong>#st in line</strong></Trans>}\n  two={<Trans>You are <strong>#nd in line</strong></Trans>}\n  few={<Trans>You are <strong>#rd in line</strong></Trans>}\n  other={<Trans>You are <strong>#th in line</strong></Trans>}\n  $0={<Trans>You are <strong>#th in line</strong></Trans>}\n/>\n    \n\n      ↓ ↓ ↓ ↓ ↓ ↓\n\nimport { IcuTrans } from 'react-i18next';\nconst x = (\n  <IcuTrans\n    i18nKey=\"testKey\"\n    defaultTranslation=\"{position, selectordinal,  one {You are <0>#st in line</0>} two {You are <1>#nd in line</1>} few {You are <2>#rd in line</2>} other {You are <3>#th in line</3>} =0 {You are <4>#th in line</4>}}\"\n    content={[\n      {\n        type: 'strong',\n      },\n      {\n        type: 'strong',\n      },\n      {\n        type: 'strong',\n      },\n      {\n        type: 'strong',\n      },\n      {\n        type: 'strong',\n      },\n    ]}\n    values={{\n      position,\n    }}\n  />\n);\n\"\n`;\n\nexports[`macros > 20. macros > 20. macros 1`] = `\n\"\n\nimport React from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { Plural, Select, SelectOrdinal, Trans } from '../../../icu.macro'\nconst Link = ({to, children}) => (<a href={to}>{children}</a>)\n\nexport default function TestPage({count = 1}) {\n  const [t] = useTranslation()\n  const catchDate = Date.now()\n  const completion = 0.75\n  const gender = Math.random() < 0.5 ? 'female' : 'male'\n  return (\n    <>\n      {t('sample.text', 'Some sample text with {word} {gender} {count, number} {catchDate, date} {completion, number, percent}', {word: 'interpolation', gender, count, catchDate, completion})}\n      <Plural i18nKey=\"plural\"\n        count={count}\n        values={{linkPath: \"/item/\" + count}}\n        $0={<Trans><Link to='/cart'>Your cart</Link> is <strong>empty</strong>.</Trans>}\n        one={<Trans>You have <strong># item</strong> in <Link to='/cart'>your cart</Link>.</Trans>}\n        other={<Trans>You have <strong># items</strong> in <Link to='/cart'>your cart</Link>.</Trans>}\n      />\n      <Select\n        i18nKey=\"select\"\n        switch={gender}\n        female={<Trans>These are <Link to='/items'>her items</Link></Trans>}\n        male={<Trans>These are <Link to='/items'>his items</Link></Trans>}\n        other={<Trans>These are <Link to='/items'>their items</Link></Trans>}\n      />\n      <SelectOrdinal i18nKey=\"ordinal\"\n        count={itemIndex+1}\n        values={{linkPath: \"/item/\" + itemIndex}}\n        one={<Trans>Your <Link to={linkPath}><strong>#st</strong> item</Link></Trans>}\n        two={<Trans>Your <Link to={linkPath}><strong>#nd</strong> item</Link></Trans>}\n        few={<Trans>Your <Link to={linkPath}><strong>#rd</strong> item</Link></Trans>}\n        other={<Trans>Your <Link to={linkPath}><strong>#th</strong> item</Link></Trans>}\n      />\n      <Trans i18nKey=\"percent\" defaults=\"You&apos;ve completed <Link to='/tasks'>{completion, number, percent} of your tasks</Link>.\"/>\n      <Trans i18nKey=\"date\" defaults=\"Caught on <Link to='/dest'>{ catchDate, date, short }</Link>!\"/>\n      <SelectOrdinal\n        i18nKey=\"ordinal.prettier\"\n        count={count}\n        values={{ linkPath: \\`/item/\\${count}\\`, type: 'item', prop }}\n        one={\n          <Trans>\n            Your{' '}\n            <Link to={linkPath}>\n              <strong>#st</strong> {type}\n            </Link>\n          </Trans>\n        }\n        two={\n          <Trans>\n            Your{' '}\n            <Link to={linkPath}>\n              <strong>#nd</strong> {type}\n            </Link>\n          </Trans>\n        }\n        few={\n          <Trans>\n            Your{' '}\n            <Link to={linkPath}>\n              <strong>#rd</strong> {type}\n            </Link>\n          </Trans>\n        }\n        other={\n          <Trans>\n            Your{' '}\n            <Link to={linkPath}>\n              <strong>#th</strong> {type}\n            </Link>\n          </Trans>\n        }\n      />\n      <Select\n        i18nKey=\"select.expr.prettier\"\n        switch={\\`\\${gender}Person\\`}\n        values={{ linkPath: \\`/users/\\${number}\\`, type: 'bugs' }}\n        malePerson={\n          <Trans>\n            <Link to={linkPath}>\n              <strong>He</strong>\n            </Link>{' '}\n            avoids {type}.\n          </Trans>\n        }\n        femalePerson={\n          <Trans>\n            <Link to={linkPath}>\n              <strong>She</strong>\n            </Link>{' '}\n            avoids {type}.\n          </Trans>\n        }\n        other={\n          <Trans>\n            <Link to={linkPath}>\n              <strong>They</strong>\n            </Link>{' '}\n            avoid {type}.\n          </Trans>\n        }\n      />\n    </>\n  )\n}\n    \n\n      ↓ ↓ ↓ ↓ ↓ ↓\n\nimport React from 'react';\nimport { useTranslation, IcuTrans } from 'react-i18next';\nconst Link = ({ to, children }) => <a href={to}>{children}</a>;\nexport default function TestPage({ count = 1 }) {\n  const [t] = useTranslation();\n  const catchDate = Date.now();\n  const completion = 0.75;\n  const gender = Math.random() < 0.5 ? 'female' : 'male';\n  return (\n    <>\n      {t(\n        'sample.text',\n        'Some sample text with {word} {gender} {count, number} {catchDate, date} {completion, number, percent}',\n        {\n          word: 'interpolation',\n          gender,\n          count,\n          catchDate,\n          completion,\n        },\n      )}\n      <IcuTrans\n        i18nKey=\"plural\"\n        count={count}\n        defaultTranslation=\"{count, plural,  =0 {<0>Your cart</0> is <1>empty</1>.} one {You have <2># item</2> in <3>your cart</3>.} other {You have <4># items</4> in <5>your cart</5>.}}\"\n        content={[\n          {\n            type: Link,\n            props: {\n              to: '/cart',\n            },\n          },\n          {\n            type: 'strong',\n          },\n          {\n            type: 'strong',\n          },\n          {\n            type: Link,\n            props: {\n              to: '/cart',\n            },\n          },\n          {\n            type: 'strong',\n          },\n          {\n            type: Link,\n            props: {\n              to: '/cart',\n            },\n          },\n        ]}\n        values={{\n          linkPath: '/item/' + count,\n        }}\n      />\n      <IcuTrans\n        i18nKey=\"select\"\n        defaultTranslation=\"{gender, select,  female {These are <0>her items</0>} male {These are <1>his items</1>} other {These are <2>their items</2>}}\"\n        content={[\n          {\n            type: Link,\n            props: {\n              to: '/items',\n            },\n          },\n          {\n            type: Link,\n            props: {\n              to: '/items',\n            },\n          },\n          {\n            type: Link,\n            props: {\n              to: '/items',\n            },\n          },\n        ]}\n        values={{\n          gender,\n        }}\n      />\n      <IcuTrans\n        i18nKey=\"ordinal\"\n        count={itemIndex + 1}\n        defaultTranslation=\"{count, selectordinal,  one {Your <0><0>#st</0> item</0>} two {Your <1><0>#nd</0> item</1>} few {Your <2><0>#rd</0> item</2>} other {Your <3><0>#th</0> item</3>}}\"\n        content={[\n          {\n            type: Link,\n            props: {\n              to: linkPath,\n              children: [\n                {\n                  type: 'strong',\n                },\n              ],\n            },\n          },\n          {\n            type: Link,\n            props: {\n              to: linkPath,\n              children: [\n                {\n                  type: 'strong',\n                },\n              ],\n            },\n          },\n          {\n            type: Link,\n            props: {\n              to: linkPath,\n              children: [\n                {\n                  type: 'strong',\n                },\n              ],\n            },\n          },\n          {\n            type: Link,\n            props: {\n              to: linkPath,\n              children: [\n                {\n                  type: 'strong',\n                },\n              ],\n            },\n          },\n        ]}\n        values={{\n          linkPath: '/item/' + itemIndex,\n        }}\n      />\n      <IcuTrans\n        i18nKey=\"percent\"\n        defaultTranslation=\"You've completed <0>{completion, number, percent} of your tasks</0>.\"\n        content={[\n          {\n            type: Link,\n            props: {\n              to: '/tasks',\n            },\n          },\n        ]}\n        values={{\n          completion,\n        }}\n      />\n      <IcuTrans\n        i18nKey=\"date\"\n        defaultTranslation=\"Caught on <0>{catchDate, date, short}</0>!\"\n        content={[\n          {\n            type: Link,\n            props: {\n              to: '/dest',\n            },\n          },\n        ]}\n        values={{\n          catchDate,\n        }}\n      />\n      <IcuTrans\n        i18nKey=\"ordinal.prettier\"\n        count={count}\n        defaultTranslation=\"{count, selectordinal,  one {Your <0><0>#st</0> {type}</0>} two {Your <1><0>#nd</0> {type}</1>} few {Your <2><0>#rd</0> {type}</2>} other {Your <3><0>#th</0> {type}</3>}}\"\n        content={[\n          {\n            type: Link,\n            props: {\n              to: linkPath,\n              children: [\n                {\n                  type: 'strong',\n                },\n              ],\n            },\n          },\n          {\n            type: Link,\n            props: {\n              to: linkPath,\n              children: [\n                {\n                  type: 'strong',\n                },\n              ],\n            },\n          },\n          {\n            type: Link,\n            props: {\n              to: linkPath,\n              children: [\n                {\n                  type: 'strong',\n                },\n              ],\n            },\n          },\n          {\n            type: Link,\n            props: {\n              to: linkPath,\n              children: [\n                {\n                  type: 'strong',\n                },\n              ],\n            },\n          },\n        ]}\n        values={{\n          linkPath: \\`/item/\\${count}\\`,\n          type: 'item',\n          prop,\n        }}\n      />\n      <IcuTrans\n        i18nKey=\"select.expr.prettier\"\n        defaultTranslation=\"{selectKey, select,  malePerson {<0><0>He</0></0> avoids {type}.} femalePerson {<1><0>She</0></1> avoids {type}.} other {<2><0>They</0></2> avoid {type}.}}\"\n        content={[\n          {\n            type: Link,\n            props: {\n              to: linkPath,\n              children: [\n                {\n                  type: 'strong',\n                },\n              ],\n            },\n          },\n          {\n            type: Link,\n            props: {\n              to: linkPath,\n              children: [\n                {\n                  type: 'strong',\n                },\n              ],\n            },\n          },\n          {\n            type: Link,\n            props: {\n              to: linkPath,\n              children: [\n                {\n                  type: 'strong',\n                },\n              ],\n            },\n          },\n        ]}\n        values={{\n          selectKey: \\`\\${gender}Person\\`,\n          linkPath: \\`/users/\\${number}\\`,\n          type: 'bugs',\n        }}\n      />\n    </>\n  );\n}\n\"\n`;\n\nexports[`macros > 21. macros > 21. macros 1`] = `\n\"\n\nimport React from \"react\"\nimport { Trans, number, date, time, plural, select, selectOrdinal } from \"../../../icu.macro\";\n\nfunction Component({ children, style }) {\n  return <div style={style}>{children}</div>\n}\n\nconst count = 2;\nconst numbers = 34;\nconst selectInput = \"thing\"\nconst now = new Date()\nconst x = (\n  <Trans i18nKey=\"key\">\n    <strong>exciting!</strong>\n    {plural\\`\\${count},\n    =0 { hi there \\${<strong>friend</strong>} }\n    other { woweee even supports nested \\${number\\`\\${numbers}\\`} } \\`} and\n    {select\\`\\${selectInput},\n     thing { another nested \\${<Component style={{ color: \"red\" }}>\n       with regular text and a date: <pre>{date\\`\\${now}\\`}</pre>\n     </Component>}} \\`}\n  </Trans>\n);\n    \n\n      ↓ ↓ ↓ ↓ ↓ ↓\n\nimport { IcuTrans, number, date, plural, select } from 'react-i18next';\nimport React from 'react';\nfunction Component({ children, style }) {\n  return <div style={style}>{children}</div>;\n}\nconst count = 2;\nconst numbers = 34;\nconst selectInput = 'thing';\nconst now = new Date();\nconst x = (\n  <IcuTrans\n    i18nKey=\"key\"\n    defaultTranslation=\"<0>exciting!</0>{count, plural, =0 { hi there <1>friend</1> } other { woweee even supports nested {numbers, number} } } and{selectInput, select, thing { another nested <2>with regular text and a date: <0>{now, date}</0></2>} }\"\n    content={[\n      {\n        type: 'strong',\n      },\n      {\n        type: 'strong',\n      },\n      {\n        type: Component,\n        props: {\n          style: {\n            color: 'red',\n          },\n          children: [\n            {\n              type: 'pre',\n            },\n          ],\n        },\n      },\n    ]}\n    values={{\n      count,\n      numbers,\n      selectInput,\n      now,\n    }}\n  />\n);\n\"\n`;\n\nexports[`macros > 22. macros > 22. macros 1`] = `\n\"\n\nimport { Trans } from \"../../../icu.macro\";\n\nconst x = <Trans>Welcome, &quot;{ name }&quot;!</Trans>\n    \n\n      ↓ ↓ ↓ ↓ ↓ ↓\n\nimport { IcuTrans } from 'react-i18next';\nconst x = (\n  <IcuTrans\n    defaultTranslation={'Welcome, \"{name}\"!'}\n    content={[]}\n    values={{\n      name,\n    }}\n  />\n);\n\"\n`;\n\nexports[`macros > 23. macros > 23. macros 1`] = `\n\"\n\nimport { Trans } from \"../../../icu.macro\";\n\nconst x = <Trans data-cy=\"test\">Welcome, { name }!</Trans>\n    \n\n      ↓ ↓ ↓ ↓ ↓ ↓\n\nimport { IcuTrans } from 'react-i18next';\nconst x = (\n  <IcuTrans\n    data-cy=\"test\"\n    defaultTranslation=\"Welcome, {name}!\"\n    content={[]}\n    values={{\n      name,\n    }}\n  />\n);\n\"\n`;\n\nexports[`macros > 24. macros > 24. macros 1`] = `\n\"\n\nimport { Trans } from \"../../../icu.macro\";\n\nconst x = <Trans data-cy=\"test\" data-testid=\"trans-component\">Welcome, <strong data-cy=\"name\">{ name }</strong>!</Trans>\n    \n\n      ↓ ↓ ↓ ↓ ↓ ↓\n\nimport { IcuTrans } from 'react-i18next';\nconst x = (\n  <IcuTrans\n    data-cy=\"test\"\n    data-testid=\"trans-component\"\n    defaultTranslation=\"Welcome, <0>{name}</0>!\"\n    content={[\n      {\n        type: 'strong',\n        props: {\n          'data-cy': 'name',\n        },\n      },\n    ]}\n    values={{\n      name,\n    }}\n  />\n);\n\"\n`;\n\nexports[`macros > 25. macros > 25. macros 1`] = `\n\"\n\nimport type { PackageDetail } from \"@api/package\";\nimport type { ReactElement } from \"react\";\nimport React from \"react\";\n\nimport { number } from \"../../../icu.macro\";\nimport { Trans } from \"../../../icu.macro\";\nimport ProgressBar from \"/ProgressBar\";\n\nconst UsageTracker = ({\n  packageDetail,\n  className,\n}: {\n  packageDetail: PackageDetail;\n  className?: string;\n}): ReactElement => {\n  const { k } = useI18nNamespace(\"usage\");\n  const incomingRequestCount = packageDetail.incoming_requests;\n  const maxIncomingRequestsAllowed = packageDetail.incoming_requests_limit;\n  const prompt = (\n    <Trans i18nKey=\"usage-progress-bar-prompt\">\n      <b>{number\\`\\${ incomingRequestCount }\\`}</b> of {number\\`\\${ maxIncomingRequestsAllowed }\\`} incoming requests since\n      the first day of the month\n    </Trans>\n  );\n  return (\n    <div className={className} data-cy=\"usage-tracker\">\n      <ProgressBar\n        currentCount={incomingRequestCount}\n        limitCount={maxIncomingRequestsAllowed}\n        prompt={prompt}\n      />\n    </div>\n  );\n};\n\nexport default UsageTracker;\n    \n\n      ↓ ↓ ↓ ↓ ↓ ↓\n\nimport { IcuTrans, number } from 'react-i18next';\nimport type { PackageDetail } from '@api/package';\nimport type { ReactElement } from 'react';\nimport React from 'react';\nimport ProgressBar from '/ProgressBar';\nconst UsageTracker = ({\n  packageDetail,\n  className,\n}: {\n  packageDetail: PackageDetail,\n  className?: string,\n}): ReactElement => {\n  const { k } = useI18nNamespace('usage');\n  const incomingRequestCount = packageDetail.incoming_requests;\n  const maxIncomingRequestsAllowed = packageDetail.incoming_requests_limit;\n  const prompt = (\n    <IcuTrans\n      i18nKey=\"usage-progress-bar-prompt\"\n      defaultTranslation=\"<0>{incomingRequestCount, number}</0> of {maxIncomingRequestsAllowed, number} incoming requests since\\\\n      the first day of the month\"\n      content={[\n        {\n          type: 'b',\n        },\n      ]}\n      values={{\n        incomingRequestCount,\n        maxIncomingRequestsAllowed,\n      }}\n    />\n  );\n  return (\n    <div className={className} data-cy=\"usage-tracker\">\n      <ProgressBar\n        currentCount={incomingRequestCount}\n        limitCount={maxIncomingRequestsAllowed}\n        prompt={prompt}\n      />\n    </div>\n  );\n};\nexport default UsageTracker;\n\"\n`;\n\nexports[`macros > 36. macros > 36. macros 1`] = `\n\"\n\nimport { Trans } from '../../../icu.macro'\n\nconst spreadProps = { className: 'test', id: 'bold-text' }\nconst x = <Trans><b {...spreadProps}>test</b></Trans>\n    \n\n      ↓ ↓ ↓ ↓ ↓ ↓\n\nimport { IcuTrans } from 'react-i18next';\nconst spreadProps = {\n  className: 'test',\n  id: 'bold-text',\n};\nconst x = (\n  <IcuTrans\n    defaultTranslation=\"<0>test</0>\"\n    content={[\n      {\n        type: 'b',\n        props: {\n          ...spreadProps,\n        },\n      },\n    ]}\n    values={{}}\n  />\n);\n\"\n`;\n\nexports[`macros > 37. macros > 37. macros 1`] = `\n\"\n\nimport { Trans } from '../../../icu.macro'\n\nconst x = <Trans><b aria-hidden>test</b></Trans>\n    \n\n      ↓ ↓ ↓ ↓ ↓ ↓\n\nimport { IcuTrans } from 'react-i18next';\nconst x = (\n  <IcuTrans\n    defaultTranslation=\"<0>test</0>\"\n    content={[\n      {\n        type: 'b',\n        props: {\n          'aria-hidden': true,\n        },\n      },\n    ]}\n    values={{}}\n  />\n);\n\"\n`;\n"
  },
  {
    "path": "test/backendLngAwareMock.js",
    "content": "export class BackendLngAwareMock {\n  constructor(services, options = {}) {\n    this.init(services, options);\n    this.type = 'backend';\n    this.queue = [];\n  }\n\n  init(services, options) {\n    this.services = services;\n    this.options = options;\n  }\n\n  read(language, namespace, callback) {\n    this.queue.push({ language, namespace, callback });\n  }\n\n  flush(what) {\n    let q = [...this.queue];\n    if (what) {\n      const filterFor = [];\n      if (what.language) filterFor.push('language');\n      if (what.namespace) filterFor.push('namespace');\n      if (filterFor.length > 0) {\n        q = q.filter((item) => {\n          const allOk = filterFor.map((ff) => item[ff] === what[ff]).every((r) => r);\n          if (allOk) return true;\n          return false;\n        });\n      }\n    }\n\n    q.forEach((item) => {\n      this.queue.splice(this.queue.indexOf(item), 1);\n\n      item.callback(null, {\n        key1: `${item.language}/${item.namespace} for key1`,\n      });\n    });\n  }\n}\n"
  },
  {
    "path": "test/backendMock.js",
    "content": "export class BackendMock {\n  constructor(services, options = {}) {\n    this.init(services, options);\n    this.type = 'backend';\n    this.queue = [];\n  }\n\n  init(services, options) {\n    this.services = services;\n    this.options = options;\n  }\n\n  read(language, namespace, callback) {\n    this.queue.push(callback);\n  }\n\n  flush() {\n    this.queue.forEach((cb) => {\n      cb(null, {\n        key1: 'test',\n        interpolateKey: 'add {{insert}} {{up, uppercase}}',\n      });\n    });\n  }\n}\n"
  },
  {
    "path": "test/hasLoadedNamespaceMock.js",
    "content": "export default (ns, i18n, options = {}) => {\n  const lng = i18n.languages[0];\n  const fallbackLng = i18n.options ? i18n.options.fallbackLng : false;\n  const lastLng = i18n.languages[i18n.languages.length - 1];\n\n  // we're in cimode so this shall pass\n  if (lng.toLowerCase() === 'cimode') return true;\n\n  const loadNotPending = (l, n) => {\n    const loadState = i18n.services.backendConnector.state[`${l}|${n}`];\n    return loadState === -1 || loadState === 2;\n  };\n\n  // bound to trigger on event languageChanging\n  // so set ready to false while we are changing the language\n  // and namespace pending (depends on having a backend)\n  if (\n    options.bindI18n &&\n    options.bindI18n.indexOf('languageChanging') > -1 &&\n    i18n.services.backendConnector.backend &&\n    i18n.isLanguageChangingTo &&\n    !loadNotPending(i18n.isLanguageChangingTo, ns)\n  )\n    return false;\n\n  // loaded -> SUCCESS\n  if (i18n.hasResourceBundle(lng, ns)) return true;\n\n  // were not loading at all -> SEMI SUCCESS\n  if (\n    !i18n.services.backendConnector.backend ||\n    (i18n.options.resources && !i18n.options.partialBundledLanguages)\n  )\n    return true;\n\n  // failed loading ns - but at least fallback is not pending -> SEMI SUCCESS\n  if (loadNotPending(lng, ns) && (!fallbackLng || loadNotPending(lastLng, ns))) return true;\n\n  return false;\n};\n"
  },
  {
    "path": "test/i18n.js",
    "content": "import i18n from 'i18next';\n\n// set instance on hooks stuff\nimport { setI18n } from '../src/context';\n\nsetI18n(i18n);\n\ni18n.init({\n  lng: 'en',\n  fallbackLng: 'en',\n\n  resources: {\n    en: {\n      translation: {\n        key1: 'test',\n        interpolateKeyWithDefaultVariables: 'add {{defaultInsert}} {{defaultUp, uppercase}}',\n        interpolateKey: 'add {{insert}} {{up, uppercase}}',\n        interpolateKey2: '<strong>add</strong> {{insert}} {{up, uppercase}}',\n        myKey:\n          'This is a <CustomLink href=\"https://example.com/\">link to example.com</CustomLink>.',\n        transTest1: 'Go <1>there</1>.',\n        transTest1_noParent: '<0>Go <1>there</1>.</0>',\n        transTest1_customHtml: '<strong>Go</strong> <br/><1>there</1>.',\n        transTest1_customHtml2: '<strong>Go</strong> <br/> there.',\n        transTest1_customHtml3:\n          '<strong>Go</strong><video /><script>console.warn(\"test\")</script> there.',\n        transTest2:\n          'Hello <1><0>{{name}}</0></1>, you have <3>{{count}}</3> message. Open <5>hear</5>.',\n        transTest2_other:\n          'Hello <1><0>{{name}}</0></1>, you have <3>{{count}}</3> messages. Open <5>here</5>.',\n        transTest2InV2: 'Hello <1>{{name}}</1>, you have {{count}} message. Open <5>hear</5>.',\n        transTest2InV2_other:\n          'Hello <1>{{name}}</1>, you have {{count}} messages. Open <5>here</5>.',\n        testTransKey1: '<0>{{numOfItems}}</0> item matched.',\n        testTransKey1_other: '<0>{{numOfItems}}</0> items matched.',\n        testTransKey2: '<0><0>{{numOfItems}}</0></0> item matched.',\n        testTransKey2_other: '<0><0>{{numOfItems}}</0></0> items matched.',\n        testTransKey3: 'Result: <1><0>{{numOfItems}}</0></1> item matched.',\n        testTransKey3_other: 'Result: <1><0>{{numOfItems}}</0></1> items matched.',\n        testInvalidHtml: '<hello',\n        testInvalidHtml2: '<hello>',\n        testTrans4KeyWithNestedComponent: 'Result should be a list: <0></0>',\n        testTrans5KeyWithNestedComponent: 'Result should be a list: <1></1>',\n        testTrans5KeyWithValue: 'Result should be rendered within tag <0>{{testValue}}</0>',\n        transTest3: 'Result should be a clickable link <0 href=\"https://www.google.com\">Google</0>',\n        transTest3_overwrite:\n          'Result should be a clickable link <0 href=\"https://www.bing.com\">Google</0>',\n        transTestEscapedHtml: 'Escaped html should unescape correctly <0>&lt;&nbsp;&amp;&gt;</0>.',\n        transTestCustomUnescape: 'Text should be passed through custom unescape <0>&shy;</0>',\n        transTestCustomUnescapeSecond: 'Vertrauens&shy;kennwert',\n        'trans-key-with-generic-var': 'Value as is: {{foo}}',\n        'trans-key-with-number-var': 'Treat value as number: {{foo, number}}',\n        testTransWithCtx: 'Go <1>there</1>.',\n        testTransWithCtx_home: 'Go <1>home</1>.',\n        testTransNoChildrenWithCtx: 'Go {{context}}.',\n        testTransNoChildrenWithCtx_home: 'Go to Switzerland.',\n        'You have {{count}} message_one': 'You have {{count}} message',\n        'You have {{count}} message_other': 'You have {{count}} messages',\n        deepPath: {\n          deepKey1: 'value1',\n        },\n        transTestWithSelfClosing: 'interpolated component: <component/>',\n        bracketNotation: '{{count}}',\n        otherNotation: '#$?count?$#',\n        issue1893: 'Hello <Item title=\"{{ name }}\" />!',\n      },\n      other: {\n        transTest1: 'Another go <1>there</1>.',\n        nestingKey1: 'This is key1 value and $t(nestedKey2)',\n        nestedKey2: 'This is key2 value',\n        nestingInterKey3: 'should work {{check_this}}',\n      },\n    },\n  },\n\n  interpolation: {\n    escapeValue: false, // not needed for react!!\n    formatSeparator: ',',\n    format(value, format) {\n      if (format === 'uppercase') return value.toUpperCase();\n      return value;\n    },\n    defaultVariables: {\n      defaultInsert: 'first',\n      defaultUp: 'second',\n      check_this: '$t(nestedKey2)',\n    },\n  },\n\n  react: {\n    defaultTransParent: 'div',\n    transSupportBasicHtmlNodes: true,\n    transKeepBasicHtmlNodesFor: ['br', 'strong', 'i'],\n  },\n});\n\nexport default i18n;\n"
  },
  {
    "path": "test/i18nNoLng.js",
    "content": "import i18n from 'i18next';\n\n// set instance on hooks stuff\nimport { setI18n } from '../src/context';\n\nsetI18n(i18n);\n\ni18n.init({\n  defaultNS: 'ns1',\n  resources: {\n    ns1: {\n      testString: 'This has an interpolated <el1>link</el1> and <el2>%{buttonText}</el2>',\n    },\n  },\n});\n\nexport default i18n;\n"
  },
  {
    "path": "test/icu.macro.spec.js",
    "content": "import { describe, it, expect } from 'vitest';\n// Unsure why ESLint can't resolve it but tests run correctly\n// eslint-disable-next-line import/no-unresolved\nimport { pluginTester } from 'babel-plugin-tester';\nimport plugin from 'babel-plugin-macros';\n\n/**\n * babel-plugin-tester in icu.macro.spec.js need test function exposed in globals scope.\n *\n * Instead of exposing globals using relative --globals flag I exposed utilities only for this file\n * @see https://github.com/babel-utils/babel-plugin-tester#vitest\n */\n\nglobalThis.describe = describe;\nglobalThis.it = it;\nglobalThis.expect = expect;\n\npluginTester({\n  plugin,\n  snapshot: true,\n  babelOptions: { filename: __filename, parserOpts: { plugins: ['jsx', 'typescript'] } },\n  tests: [\n    `\n      import { Trans } from '../../../icu.macro'\n\n      const x = <Trans>Welcome, { name }!</Trans>\n    `,\n\n    `\n      import { Trans } from '../../../icu.macro'\n\n      const x = <Trans>Welcome, <strong>{ name }</strong>!</Trans>\n    `,\n\n    `\n      import { Trans } from '../../../icu.macro'\n      import { useTranslation } from 'react-i18next'\n\n      const x = <Trans>Trainers: { trainersCount, number }</Trans>\n    `,\n\n    `\n      import { Trans } from '../../../icu.macro'\n\n      const x = <Trans>Trainers: <strong>{ trainersCount, number }</strong>!</Trans>\n    `,\n\n    `\n      import { Trans } from '../../../icu.macro'\n\n      const x = <Trans>Caught on { catchDate, date, short }</Trans>\n    `,\n\n    `\n      import { Trans } from '../../../icu.macro'\n\n      const x = <Trans>Caught on <strong>{ catchDate, date, short }</strong>!</Trans>\n    `,\n\n    `\n      import { Trans } from '../../../icu.macro'\n\n      const x = <Trans defaults=\"Trainers: { trainersCount, number }\" />\n    `,\n\n    `\n      import { Trans } from '../../../icu.macro'\n\n      const x = <Trans i18nKey=\"trainersWithDefaults\" defaults=\"Trainers: <strong>{ trainersCount, number }</strong>!\" />\n    `,\n\n    `\n      import { Trans } from '../../../icu.macro'\n\n      const x = <Trans i18nKey=\"caughtWithDefaults\" defaults=\"Caught on { catchDate, date, short }\" />\n    `,\n\n    `\n      import { Trans } from '../../../icu.macro'\n\n      const x = <Trans defaults=\"Caught on <strong>{ catchDate, date, short }</strong>!\" />\n    `,\n\n    `\n      import { Trans } from '../../../icu.macro'\n      const Link = ({to, children}) => (<a href={to}>{children}</a>)\n\n      const x = <Trans defaults=\"Caught on <Link to='/dest'>{ catchDate, date, short }</Link>!\" values={{catchDate: Date.now()}}>This should be overridden by defaults</Trans>\n    `,\n\n    `\n      import { Trans } from '../../../icu.macro'\n\n      const x = <Trans i18nKey=\"trainersWithDefaults\" values={{trainersCount}} defaults=\"Trainers: <strong>{ trainersCount, number }</strong>!\" components={[]} />\n    `,\n\n    `\n      import { Select } from '../../../icu.macro'\n\n      const x = <Select\n        i18nKey=\"selectExample\"\n        switch={gender}\n        male=\"He avoids bugs.\"\n        female=\"She avoids bugs.\"\n        other=\"They avoid bugs.\"\n      />\n    `,\n\n    `\n      import { Select } from '../../../icu.macro'\n\n      const x = <Select\n        switch={gender}\n        male={<Trans><strong>He</strong> avoids bugs.</Trans>}\n        female={<Trans><strong>She</strong> avoids bugs.</Trans>}\n        other={<Trans><strong>They</strong> avoid bugs.</Trans>}\n      />\n    `,\n\n    `\n      import { Plural } from '../../../icu.macro'\n\n      const x = <Plural\n        count={itemsCount1}\n        $0=\"There are no items.\"\n        one=\"There is # item.\"\n        other=\"There are # items.\"\n      />\n    `,\n\n    `\n      import { Plural } from '../../../icu.macro'\n\n      const x = <Plural\n        i18nKey=\"testKey\"\n        count={itemsCount3}\n        $0={<Trans>There is <strong>no</strong> item.</Trans>}\n        one={<Trans>There is <strong>#</strong> item.</Trans>}\n        other={<Trans>There are <strong>#</strong> items.</Trans>}\n      />\n    `,\n\n    `\n      import { Plural } from '../../../icu.macro'\n\n      const x = <Plural\n        i18nKey=\"testKey\"\n        count={itemsCount3}\n        values={{location: 'table'}}\n        $0={<Trans>There is <strong>no</strong> item on the <i>{location}</i>.</Trans>}\n        one={<Trans>There is <strong>#</strong> item on the <i>{location}</i>.</Trans>}\n        other={<Trans>There are <strong>#</strong> items on the <i>{location}</i>.</Trans>}\n      />\n    `,\n\n    `\n      import { SelectOrdinal } from '../../../icu.macro'\n\n      const x = <SelectOrdinal\n        count={position}\n        zero=\"You are #th in line\"\n        one=\"You are #st in line\"\n        two=\"You are #nd in line\"\n        few=\"You are #rd in line\"\n        many=\"You are #th in line\"\n        other=\"You are #th in line\"\n        $7=\"You are in the lucky #th place in line\"\n      />\n    `,\n\n    `\n      import { SelectOrdinal } from '../../../icu.macro'\n\n      const x = <SelectOrdinal\n        i18nKey=\"testKey\"\n        count={position}\n        one={<Trans>You are <strong>#st in line</strong></Trans>}\n        two={<Trans>You are <strong>#nd in line</strong></Trans>}\n        few={<Trans>You are <strong>#rd in line</strong></Trans>}\n        other={<Trans>You are <strong>#th in line</strong></Trans>}\n        $0={<Trans>You are <strong>#th in line</strong></Trans>}\n      />\n    `,\n\n    `\n      import React from 'react'\n      import { useTranslation } from 'react-i18next'\n      import { Plural, Select, SelectOrdinal, Trans } from '../../../icu.macro'\n      const Link = ({to, children}) => (<a href={to}>{children}</a>)\n\n      export default function TestPage({count = 1}) {\n        const [t] = useTranslation()\n        const catchDate = Date.now()\n        const completion = 0.75\n        const gender = Math.random() < 0.5 ? 'female' : 'male'\n        return (\n          <>\n            {t('sample.text', 'Some sample text with {word} {gender} {count, number} {catchDate, date} {completion, number, percent}', {word: 'interpolation', gender, count, catchDate, completion})}\n            <Plural i18nKey=\"plural\"\n              count={count}\n              values={{linkPath: \"/item/\" + count}}\n              $0={<Trans><Link to='/cart'>Your cart</Link> is <strong>empty</strong>.</Trans>}\n              one={<Trans>You have <strong># item</strong> in <Link to='/cart'>your cart</Link>.</Trans>}\n              other={<Trans>You have <strong># items</strong> in <Link to='/cart'>your cart</Link>.</Trans>}\n            />\n            <Select\n              i18nKey=\"select\"\n              switch={gender}\n              female={<Trans>These are <Link to='/items'>her items</Link></Trans>}\n              male={<Trans>These are <Link to='/items'>his items</Link></Trans>}\n              other={<Trans>These are <Link to='/items'>their items</Link></Trans>}\n            />\n            <SelectOrdinal i18nKey=\"ordinal\"\n              count={itemIndex+1}\n              values={{linkPath: \"/item/\" + itemIndex}}\n              one={<Trans>Your <Link to={linkPath}><strong>#st</strong> item</Link></Trans>}\n              two={<Trans>Your <Link to={linkPath}><strong>#nd</strong> item</Link></Trans>}\n              few={<Trans>Your <Link to={linkPath}><strong>#rd</strong> item</Link></Trans>}\n              other={<Trans>Your <Link to={linkPath}><strong>#th</strong> item</Link></Trans>}\n            />\n            <Trans i18nKey=\"percent\" defaults=\"You&apos;ve completed <Link to='/tasks'>{completion, number, percent} of your tasks</Link>.\"/>\n            <Trans i18nKey=\"date\" defaults=\"Caught on <Link to='/dest'>{ catchDate, date, short }</Link>!\"/>\n            <SelectOrdinal\n              i18nKey=\"ordinal.prettier\"\n              count={count}\n              values={{ linkPath: \\`/item/\\${count}\\`, type: 'item', prop }}\n              one={\n                <Trans>\n                  Your{' '}\n                  <Link to={linkPath}>\n                    <strong>#st</strong> {type}\n                  </Link>\n                </Trans>\n              }\n              two={\n                <Trans>\n                  Your{' '}\n                  <Link to={linkPath}>\n                    <strong>#nd</strong> {type}\n                  </Link>\n                </Trans>\n              }\n              few={\n                <Trans>\n                  Your{' '}\n                  <Link to={linkPath}>\n                    <strong>#rd</strong> {type}\n                  </Link>\n                </Trans>\n              }\n              other={\n                <Trans>\n                  Your{' '}\n                  <Link to={linkPath}>\n                    <strong>#th</strong> {type}\n                  </Link>\n                </Trans>\n              }\n            />\n            <Select\n              i18nKey=\"select.expr.prettier\"\n              switch={\\`\\${gender}Person\\`}\n              values={{ linkPath: \\`/users/\\${number}\\`, type: 'bugs' }}\n              malePerson={\n                <Trans>\n                  <Link to={linkPath}>\n                    <strong>He</strong>\n                  </Link>{' '}\n                  avoids {type}.\n                </Trans>\n              }\n              femalePerson={\n                <Trans>\n                  <Link to={linkPath}>\n                    <strong>She</strong>\n                  </Link>{' '}\n                  avoids {type}.\n                </Trans>\n              }\n              other={\n                <Trans>\n                  <Link to={linkPath}>\n                    <strong>They</strong>\n                  </Link>{' '}\n                  avoid {type}.\n                </Trans>\n              }\n            />\n          </>\n        )\n      }\n    `,\n    `\n      import React from \"react\"\n      import { Trans, number, date, time, plural, select, selectOrdinal } from \"../../../icu.macro\";\n\n      function Component({ children, style }) {\n        return <div style={style}>{children}</div>\n      }\n\n      const count = 2;\n      const numbers = 34;\n      const selectInput = \"thing\"\n      const now = new Date()\n      const x = (\n        <Trans i18nKey=\"key\">\n          <strong>exciting!</strong>\n          {plural\\`\\${count},\n          =0 { hi there \\${<strong>friend</strong>} }\n          other { woweee even supports nested \\${number\\`\\${numbers}\\`} } \\`} and\n          {select\\`\\${selectInput},\n           thing { another nested \\${<Component style={{ color: \"red\" }}>\n             with regular text and a date: <pre>{date\\`\\${now}\\`}</pre>\n           </Component>}} \\`}\n        </Trans>\n      );\n    `,\n    `\n      import { Trans } from \"../../../icu.macro\";\n\n      const x = <Trans>Welcome, &quot;{ name }&quot;!</Trans>\n    `,\n    `\n      import { Trans } from \"../../../icu.macro\";\n\n      const x = <Trans data-cy=\"test\">Welcome, { name }!</Trans>\n    `,\n    `\n      import { Trans } from \"../../../icu.macro\";\n\n      const x = <Trans data-cy=\"test\" data-testid=\"trans-component\">Welcome, <strong data-cy=\"name\">{ name }</strong>!</Trans>\n    `,\n    `\n      import type { PackageDetail } from \"@api/package\";\n      import type { ReactElement } from \"react\";\n      import React from \"react\";\n\n      import { number } from \"../../../icu.macro\";\n      import { Trans } from \"../../../icu.macro\";\n      import ProgressBar from \"/ProgressBar\";\n\n      const UsageTracker = ({\n        packageDetail,\n        className,\n      }: {\n        packageDetail: PackageDetail;\n        className?: string;\n      }): ReactElement => {\n        const { k } = useI18nNamespace(\"usage\");\n        const incomingRequestCount = packageDetail.incoming_requests;\n        const maxIncomingRequestsAllowed = packageDetail.incoming_requests_limit;\n        const prompt = (\n          <Trans i18nKey=\"usage-progress-bar-prompt\">\n            <b>{number\\`\\${ incomingRequestCount }\\`}</b> of {number\\`\\${ maxIncomingRequestsAllowed }\\`} incoming requests since\n            the first day of the month\n          </Trans>\n        );\n        return (\n          <div className={className} data-cy=\"usage-tracker\">\n            <ProgressBar\n              currentCount={incomingRequestCount}\n              limitCount={maxIncomingRequestsAllowed}\n              prompt={prompt}\n            />\n          </div>\n        );\n      };\n\n      export default UsageTracker;\n    `,\n    {\n      code: `\n        import React from \"react\"\n        import { Trans, number } from \"../../../icu.macro\";\n\n        const count = 2;\n        const outside = number\\`\\${count}\\`;\n      `,\n      snapshot: false,\n      error: /\"number``\" can only be used inside <Trans> in \"[^\"]+\" on line 6/,\n    },\n    {\n      code: `\n        import React from \"react\"\n        import { Trans, date } from \"../../../icu.macro\";\n\n        const d = new Date;\n        const outside = date\\`\\${d}\\`;\n      `,\n      snapshot: false,\n      error: /\"date``\" can only be used inside <Trans> in \"[^\"]+\" on line 6/,\n    },\n    {\n      code: `\n        import React from \"react\"\n        import { Trans, time } from \"../../../icu.macro\";\n\n        const d = new Date;\n        const outside = time\\`\\${d}\\`;\n      `,\n      snapshot: false,\n      error: /\"time``\" can only be used inside <Trans> in \"[^\"]+\" on line 6/,\n    },\n    {\n      code: `\n        import React from \"react\"\n        import { Trans, select } from \"../../../icu.macro\";\n\n        const d = \"f\";\n        const outside = select\\`\\${d}, f { chose f } other { chose something else }\\`;\n      `,\n      snapshot: false,\n      error: /\"select``\" can only be used inside <Trans> in \"[^\"]+\" on line 6/,\n    },\n    {\n      code: `\n        import React from \"react\"\n        import { Trans, selectOrdinal } from \"../../../icu.macro\";\n\n        const d = 1;\n        const outside = selectOrdinal\\`\\${d}, =0 { # } other { chose # }\\`;\n      `,\n      snapshot: false,\n      error: /\"selectOrdinal``\" can only be used inside <Trans> in \"[^\"]+\" on line 6/,\n    },\n    {\n      code: `\n        import React from \"react\"\n        import { Trans, plural } from \"../../../icu.macro\";\n\n        const d = 1;\n        const outside = plural\\`\\${d}, =0 { # } other { chose # }\\`;\n      `,\n      snapshot: false,\n      error: /\"plural``\" can only be used inside <Trans> in \"[^\"]+\" on line 6/,\n    },\n    {\n      code: `\n        import React from \"react\"\n        import { Trans, plural } from \"../../../icu.macro\";\n\n        const d = 1;\n        const x = (\n          <Trans i18nKey=\"key\">\n           this will {fail\\`hard\\`}\n          </Trans>\n        );\n      `,\n      snapshot: false,\n      error:\n        /Unsupported tagged template literal \"fail\", must be one of date, time, number, plural, select, selectOrdinal in \"[^\"]+\" on line 8/,\n    },\n    {\n      code: `\n        import React from \"react\"\n        import { Trans, date } from \"../../../icu.macro\";\n\n        const d = 1;\n        const x = (\n          <Trans i18nKey=\"key\">\n           this will {date\\`fail\\`}\n          </Trans>\n        );\n      `,\n      snapshot: false,\n      error: /date argument must be interpolated in \"date``\" in \"[^\"]+\" on line 8/,\n    },\n    {\n      code: `\n        import React from \"react\"\n        import { Trans, date } from \"../../../icu.macro\";\n\n        const tooLate = new Date();\n        const x = (\n          <Trans i18nKey=\"key\">\n           this will {date\\`fail\\${tooLate}\\`}\n          </Trans>\n        );\n      `,\n      snapshot: false,\n      error: /date argument must be interpolated at the beginning of \"date``\" in \"[^\"]+\" on line 8/,\n    },\n    {\n      code: `\n        import React from \"react\"\n        import { Trans, number } from \"../../../icu.macro\";\n\n        const tooLate = funcThatReturnsNumberOrUndefined;\n        const x = (\n          <Trans i18nKey=\"key\">\n           this will {number\\`\\${tooLate || 0}\\`}\n          </Trans>\n        );\n      `,\n      snapshot: false,\n      error: /Must pass a variable, not an expression to \"number``\" in \"[^\"]+\" on line 8/,\n    },\n    `\n      import { Trans } from '../../../icu.macro'\n\n      const spreadProps = { className: 'test', id: 'bold-text' }\n      const x = <Trans><b {...spreadProps}>test</b></Trans>\n    `,\n    `\n      import { Trans } from '../../../icu.macro'\n\n      const x = <Trans><b aria-hidden>test</b></Trans>\n    `,\n  ],\n});\n"
  },
  {
    "path": "test/initReactI18next.spec.js",
    "content": "import { describe, it, expect } from 'vitest';\nimport { initReactI18next } from '../src/initReactI18next';\nimport { getDefaults, setDefaults } from '../src/defaults';\nimport { getI18n } from '../src/i18nInstance';\n\ndescribe('initReactI18next', () => {\n  it('should have correct type', () => {\n    expect(initReactI18next.type).toBe('3rdParty');\n  });\n\n  it('should initialize with i18next instance', () => {\n    const mockI18n = {\n      options: {\n        react: {\n          useSuspense: false,\n          bindI18n: 'languageChanged loaded',\n        },\n      },\n    };\n\n    initReactI18next.init(mockI18n);\n\n    const defaults = getDefaults();\n    expect(defaults.useSuspense).toBe(false);\n    expect(defaults.bindI18n).toBe('languageChanged loaded');\n\n    const storedI18n = getI18n();\n    expect(storedI18n).toBe(mockI18n);\n  });\n\n  it('should handle setDefaults with options', () => {\n    setDefaults({ useSuspense: true, customOption: 'test' });\n    const defaults = getDefaults();\n    expect(defaults.useSuspense).toBe(true);\n    expect(defaults.customOption).toBe('test');\n  });\n\n  it('should handle setDefaults with empty options', () => {\n    const defaultsBefore = getDefaults();\n    setDefaults();\n    const defaultsAfter = getDefaults();\n    expect(defaultsAfter).toEqual(defaultsBefore);\n  });\n\n  it('should preserve existing defaults when setting new ones', () => {\n    setDefaults({ bindI18n: 'languageChanged' });\n\n    setDefaults({ useSuspense: false });\n    const defaults = getDefaults();\n\n    // Should preserve bindI18n and add useSuspense\n    expect(defaults.bindI18n).toBe('languageChanged');\n    expect(defaults.useSuspense).toBe(false);\n  });\n});\n"
  },
  {
    "path": "test/setup.js",
    "content": "import '@testing-library/jest-dom/vitest';\n"
  },
  {
    "path": "test/trans.nodeToString.spec.jsx",
    "content": "import { describe, it, expect } from 'vitest';\nimport React from 'react';\nimport { nodesToString } from '../src/Trans';\n\ndescribe('trans nodeToString', () => {\n  describe('treat like other components (legacy)', () => {\n    it('should handle voidElements eg. br', () => {\n      const fragment = (\n        <>\n          lorem <br /> ipsum\n        </>\n      );\n      const expected = 'lorem <1></1> ipsum';\n      const transKeepBasicHtmlNodesFor = [];\n      const actual = nodesToString(fragment.props.children, { transKeepBasicHtmlNodesFor });\n      expect(actual).toEqual(expected);\n    });\n\n    it('should handle non voidElements eg. strong not having attributes and only one child typeof string', () => {\n      const fragment = (\n        <>\n          lorem <strong>bold</strong> ipsum\n        </>\n      );\n      const expected = 'lorem <1>bold</1> ipsum';\n      const transKeepBasicHtmlNodesFor = [];\n      const actual = nodesToString(fragment.props.children, { transKeepBasicHtmlNodesFor });\n      expect(actual).toEqual(expected);\n    });\n  });\n\n  describe('treat simplified if simple components', () => {\n    it('should handle voidElements eg. br', () => {\n      const fragment = (\n        <>\n          lorem <br /> ipsum\n        </>\n      );\n      const expected = 'lorem <br/> ipsum';\n      const transKeepBasicHtmlNodesFor = ['br', 'strong', 'i'];\n      const actual = nodesToString(fragment.props.children, {\n        transSupportBasicHtmlNodes: true,\n        transKeepBasicHtmlNodesFor,\n      });\n      expect(actual).toEqual(expected);\n    });\n\n    it('should handle non voidElements eg. strong not having attributes and only one child typeof string', () => {\n      const fragment = (\n        <>\n          lorem <strong>bold</strong> ipsum\n        </>\n      );\n      const expected = 'lorem <strong>bold</strong> ipsum';\n      const transKeepBasicHtmlNodesFor = ['br', 'strong', 'i'];\n      const actual = nodesToString(fragment.props.children, {\n        transSupportBasicHtmlNodes: true,\n        transKeepBasicHtmlNodesFor,\n      });\n      expect(actual).toEqual(expected);\n    });\n  });\n\n  describe('treat like other components if not simple (legacy)', () => {\n    it('should handle voidElements eg. br', () => {\n      const fragment = (\n        <>\n          lorem <i className=\"icon-gear\" /> ipsum\n        </>\n      );\n      const expected = 'lorem <1></1> ipsum';\n      const transKeepBasicHtmlNodesFor = ['br', 'strong', 'i'];\n      const actual = nodesToString(fragment.props.children, {\n        transSupportBasicHtmlNodes: true,\n        transKeepBasicHtmlNodesFor,\n      });\n      expect(actual).toEqual(expected);\n    });\n\n    it('should handle non voidElements eg. strong not having attributes and only one child typeof string', () => {\n      const fragment = (\n        <>\n          lorem <strong className=\"special\">bold</strong> ipsum\n        </>\n      );\n      const expected = 'lorem <1>bold</1> ipsum';\n      const transKeepBasicHtmlNodesFor = ['br', 'strong', 'i'];\n      const actual = nodesToString(fragment.props.children, {\n        transSupportBasicHtmlNodes: true,\n        transKeepBasicHtmlNodesFor,\n      });\n      expect(actual).toEqual(expected);\n    });\n  });\n\n  describe('having dynamic list maps', () => {\n    it('should create normal inner children if not set to ignore them', () => {\n      const fragment = (\n        <>\n          {'lorem ' /* eslint-disable-line react/jsx-curly-brace-presence */}\n          <ul>\n            <li>a</li>\n            <li>b</li>\n          </ul>\n          {' ipsum' /* eslint-disable-line react/jsx-curly-brace-presence */}\n        </>\n      );\n      const expected = 'lorem <1><0>a</0><1>b</1></1> ipsum';\n      const actual = nodesToString(fragment.props.children, {});\n      expect(actual).toEqual(expected);\n    });\n\n    it('should omit inner children if set', () => {\n      const fragment = (\n        <>\n          {'lorem ' /* eslint-disable-line react/jsx-curly-brace-presence */}\n          <ul i18nIsDynamicList>\n            <li>a</li>\n            <li>b</li>\n          </ul>\n          {' ipsum' /* eslint-disable-line react/jsx-curly-brace-presence */}\n        </>\n      );\n      const expected = 'lorem <1></1> ipsum';\n      const actual = nodesToString(fragment.props.children, {});\n      expect(actual).toEqual(expected);\n    });\n  });\n\n  describe('interpolation objects and invalid children', () => {\n    it('should convert single-key object children to interpolation syntax', () => {\n      const fragment = (\n        <>\n          {'lorem '}\n          {{ insert: 'x' }}\n          {' ipsum'}\n        </>\n      );\n\n      const expected = 'lorem {{insert}} ipsum';\n      const actual = nodesToString(fragment.props.children, {});\n      expect(actual).toEqual(expected);\n    });\n\n    it('should support format on interpolation object children', () => {\n      const fragment = (\n        <>\n          {'lorem '}\n          {{ insert: 'x', format: 'uppercase' }}\n          {' ipsum'}\n        </>\n      );\n\n      const expected = 'lorem {{insert, uppercase}} ipsum';\n      const actual = nodesToString(fragment.props.children, {});\n      expect(actual).toEqual(expected);\n    });\n\n    it('should ignore invalid primitive children (e.g. numbers)', () => {\n      const fragment = (\n        <>\n          {'lorem '}\n          {1}\n          {' ipsum'}\n        </>\n      );\n\n      const expected = 'lorem  ipsum';\n      const actual = nodesToString(fragment.props.children, {});\n      expect(actual).toEqual(expected);\n    });\n  });\n});\n"
  },
  {
    "path": "test/trans.render.dynamic.spec.jsx",
    "content": "import { describe, it, expect, afterEach } from 'vitest';\nimport React from 'react';\nimport { render, cleanup } from '@testing-library/react';\nimport './i18n';\nimport { Trans } from '../src';\n\ndescribe('Trans should render nested components', () => {\n  // beforeAll(() => {\n  //   vitest.spyOn(console, 'error').mockImplementation(() => { });\n  // })\n\n  afterEach(() => {\n    cleanup();\n    // vitest.clearAllMocks();\n  });\n\n  it('should render dynamic ul as components property', () => {\n    const list = ['li1', 'li2'];\n\n    function TestComponent() {\n      return (\n        <Trans\n          i18nKey=\"testTrans4KeyWithNestedComponent\"\n          components={[\n            <ul>\n              {list.map((item) => (\n                <li key={item}>{item}</li>\n              ))}\n            </ul>,\n          ]}\n        />\n      );\n    }\n    const { container } = render(<TestComponent />);\n\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        Result should be a list: \n        <ul>\n          <li>\n            li1\n          </li>\n          <li>\n            li2\n          </li>\n        </ul>\n      </div>\n    `);\n  });\n\n  it('should render dynamic ul as components property when pass as a children', () => {\n    const list = ['li1', 'li2'];\n\n    function TestComponent() {\n      return (\n        <Trans i18nKey=\"testTrans5KeyWithNestedComponent\">\n          My list:\n          <ul i18nIsDynamicList>\n            {list.map((item) => (\n              <li key={item}>{item}</li>\n            ))}\n          </ul>\n        </Trans>\n      );\n    }\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        Result should be a list: \n        <ul>\n          <li>\n            li1\n          </li>\n          <li>\n            li2\n          </li>\n        </ul>\n      </div>\n    `);\n  });\n\n  it('should render dynamic Elements correctly', () => {\n    const dynamicContent = <div>testing</div>;\n\n    function TestComponent() {\n      return (\n        <Trans>\n          My dynamic content:\n          <React.Fragment i18nIsDynamicList>{dynamicContent}</React.Fragment>\n        </Trans>\n      );\n    }\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        My dynamic content:\n        <div>\n          testing\n        </div>\n      </div>\n    `);\n  });\n\n  it('should render dynamic strings correctly', () => {\n    const dynamicContent = 'testing';\n\n    function TestComponent() {\n      return (\n        <Trans>\n          My dynamic content: <React.Fragment i18nIsDynamicList>{dynamicContent}</React.Fragment>\n        </Trans>\n      );\n    }\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        My dynamic content: \n        testing\n      </div>\n    `);\n  });\n});\n"
  },
  {
    "path": "test/trans.render.icu.spec.jsx",
    "content": "import { describe, it, expect, afterEach } from 'vitest';\nimport React from 'react';\nimport { render, cleanup } from '@testing-library/react';\nimport './i18n';\nimport { Trans } from '../src/Trans';\n\ndescribe('trans using no children but props - icu case', () => {\n  afterEach(() => {\n    cleanup();\n  });\n\n  function TestComponent() {\n    return (\n      <Trans\n        defaults=\"hello <0>{{what}}</0>\"\n        values={{ what: 'world' }}\n        components={[<strong>universe</strong>]}\n      />\n    );\n  }\n  it('should render translated string', () => {\n    const { container } = render(<TestComponent />);\n\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        hello \n        <strong>\n          world\n        </strong>\n      </div>\n    `);\n  });\n});\n\ndescribe('trans using no children but props - nested case', () => {\n  function TestComponent() {\n    return (\n      <Trans\n        defaults=\"<0>hello <1></1> {{what}}</0>\"\n        values={{ what: 'world' }}\n        components={[\n          <span>\n            placeholder\n            <br />\n          </span>,\n        ]}\n      />\n    );\n  }\n  it('should render translated string', () => {\n    const { container } = render(<TestComponent />);\n\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        <span>\n          hello \n          <br />\n           world\n        </span>\n      </div>\n    `);\n  });\n});\n\ndescribe('trans using no children but props - self closing case', () => {\n  function TestComponent() {\n    return <Trans defaults=\"hello <0/>{{what}}\" values={{ what: 'world' }} components={[<br />]} />;\n  }\n  it('should render translated string', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        hello \n        <br />\n        world\n      </div>\n    `);\n  });\n});\n\ndescribe('Trans should use value from translation', () => {\n  it('should use value from translation if no data provided in component', () => {\n    function TestComponent() {\n      return (\n        <Trans\n          i18nKey=\"testTrans5KeyWithValue\"\n          values={{\n            testValue: 'dragonfly',\n          }}\n          components={[<span className=\"awesome-styles\" />]}\n        />\n      );\n    }\n\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        Result should be rendered within tag \n        <span\n          class=\"awesome-styles\"\n        >\n          dragonfly\n        </span>\n      </div>\n    `);\n  });\n\n  it('should use value from translation if dummy data provided in component', () => {\n    function TestComponent() {\n      return (\n        <Trans\n          i18nKey=\"testTrans5KeyWithValue\"\n          values={{\n            testValue: 'dragonfly',\n          }}\n          components={[<span className=\"awesome-styles\">test string</span>]}\n        />\n      );\n    }\n\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        Result should be rendered within tag \n        <span\n          class=\"awesome-styles\"\n        >\n          dragonfly\n        </span>\n      </div>\n    `);\n  });\n});\n"
  },
  {
    "path": "test/trans.render.noLng.spec.jsx",
    "content": "import { describe, it, afterEach, assert } from 'vitest';\nimport React from 'react';\nimport { render, cleanup } from '@testing-library/react';\nimport './i18nNoLng';\nimport { Trans } from '../src/Trans';\n\ndescribe('trans simple', () => {\n  afterEach(() => {\n    cleanup();\n  });\n\n  it('does not throw when using the selector API with the component object and no lng set', () => {\n    // https://github.com/i18next/react-i18next/issues/1867\n    assert.doesNotThrow(() =>\n      render(\n        <Trans\n          i18nKey={($) => $['testString']}\n          values={{ buttonText: 'button' }}\n          components={{\n            el1: <a href=\"https://www.google.com/\">Link</a>,\n            el2: (\n              <button variant=\"link\" onClick={() => console.log('clicked')}>\n                Button\n              </button>\n            ),\n          }}\n        />,\n      ),\n    );\n  });\n});\n"
  },
  {
    "path": "test/trans.render.object.spec.jsx",
    "content": "import { describe, it, expect, afterEach } from 'vitest';\nimport React from 'react';\nimport { render, cleanup } from '@testing-library/react';\nimport './i18n';\nimport { Trans } from '../src/Trans';\n\ndescribe('trans using no children but components (object) - base case using array not object', () => {\n  afterEach(() => {\n    cleanup();\n  });\n\n  function TestComponent() {\n    return (\n      <Trans\n        defaults=\"hello <0>beautiful</0> <1>{{what}}</1>\"\n        values={{ what: 'world' }}\n        components={[<i>just dummy</i>, <strong>univers</strong>]}\n      />\n    );\n  }\n  it('should render translated string', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        hello \n        <i>\n          beautiful\n        </i>\n         \n        <strong>\n          world\n        </strong>\n      </div>\n    `);\n  });\n});\n\ndescribe('trans using no children but components (object) - using index', () => {\n  function TestComponent() {\n    return (\n      <Trans\n        defaults=\"hello <1>beautiful</1> <2>{{what}}</2>\"\n        values={{ what: 'world' }}\n        components={{ 1: <i>just dummy</i>, 2: <strong>univers</strong> }}\n      />\n    );\n  }\n  it('should render translated string', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        hello \n        <i>\n          beautiful\n        </i>\n         \n        <strong>\n          world\n        </strong>\n      </div>\n    `);\n  });\n});\n\ndescribe('trans using no children but components (object) - using names with less-than sign', () => {\n  function TestComponent() {\n    return (\n      <Trans\n        defaults=\"hello <italic>under ten</italic><10 this text after the sign should be rendered <bold>{{what}}</bold>\"\n        values={{ what: 'world' }}\n        components={{ italic: <i>just dummy</i>, bold: <strong>univers</strong> }}\n      />\n    );\n  }\n  it('should render translated string', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        hello \n        <i>\n          under ten\n        </i>\n        &lt;10 this text after the sign should be rendered \n        <strong>\n          world\n        </strong>\n      </div>\n    `);\n  });\n});\n\ndescribe('trans using no children but components (object) - using names', () => {\n  function TestComponent() {\n    return (\n      <Trans\n        defaults=\"hello <italic>beautiful</italic> <bold>{{what}}</bold>\"\n        values={{ what: 'world' }}\n        components={{ italic: <i>just dummy</i>, bold: <strong>univers</strong> }}\n      />\n    );\n  }\n  it('should render translated string', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        hello \n        <i>\n          beautiful\n        </i>\n         \n        <strong>\n          world\n        </strong>\n      </div>\n    `);\n  });\n});\n\ndescribe('trans using no children but components (object) - using names with no lowercase', () => {\n  function TestComponent() {\n    return (\n      <Trans\n        defaults=\"hello <italicCase>beautiful</italicCase> <BoldCase>{{what}}</BoldCase>\"\n        values={{ what: 'world' }}\n        components={{ italicCase: <i>just dummy</i>, BoldCase: <strong>univers</strong> }}\n      />\n    );\n  }\n  it('should render translated string', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        hello \n        <i>\n          beautiful\n        </i>\n         \n        <strong>\n          world\n        </strong>\n      </div>\n    `);\n  });\n});\n\ndescribe('trans using no children but components (object) - use more than once', () => {\n  function TestComponent() {\n    return (\n      <Trans\n        defaults=\"hello<list><listitem>A</listitem>,<listitem>B</listitem>and<listitem>C</listitem></list>\"\n        components={{ list: <ul>a</ul>, listitem: <li>b</li> }}\n      />\n    );\n  }\n  it('should render translated string', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        hello\n        <ul>\n          <li>\n            A\n          </li>\n          ,\n          <li>\n            B\n          </li>\n          and\n          <li>\n            C\n          </li>\n        </ul>\n      </div>\n    `);\n  });\n});\n\ndescribe('trans using no children but components (object) - use more than once (empty)', () => {\n  function TestComponent() {\n    return (\n      <Trans\n        defaults=\"hello<list><listitem>A</listitem>,<listitem>B</listitem>and<listitem>C</listitem></list>\"\n        components={{ list: <ul />, listitem: <li /> }}\n      />\n    );\n  }\n  it('should render translated string', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        hello\n        <ul>\n          <li>\n            A\n          </li>\n          ,\n          <li>\n            B\n          </li>\n          and\n          <li>\n            C\n          </li>\n        </ul>\n      </div>\n    `);\n  });\n});\n\ndescribe('trans using no children but components (object) - using self closing tag', () => {\n  function Button() {\n    return <button type=\"button\">click me</button>;\n  }\n  function TestComponent() {\n    return <Trans defaults=\"hello <ClickMe />\" components={{ ClickMe: <Button /> }} />;\n  }\n  it('should render translated string', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        hello \n        <button\n          type=\"button\"\n        >\n          click me\n        </button>\n      </div>\n    `);\n  });\n});\n\ndescribe('trans using no children but components (object) - empty content', () => {\n  function Button() {\n    return <button type=\"button\">click me</button>;\n  }\n  function TestComponent() {\n    return <Trans defaults=\"hello <ClickMe></ClickMe>\" components={{ ClickMe: <Button /> }} />;\n  }\n  it('should render translated string', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        hello \n        <button\n          type=\"button\"\n        >\n          click me\n        </button>\n      </div>\n    `);\n  });\n});\n\ndescribe('trans using children but components (object) - self closing tag', () => {\n  function Button() {\n    return <button type=\"button\">click me</button>;\n  }\n  function TestComponent() {\n    return <Trans components={{ ClickMe: <Button /> }}>{'hello <ClickMe/>'}</Trans>;\n  }\n  it('should render translated string', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        hello \n        <button\n          type=\"button\"\n        >\n          click me\n        </button>\n      </div>\n    `);\n  });\n});\n\ndescribe('trans using children and components (object) - should still allow for use of indexed basic html tags in children', () => {\n  function TestComponent() {\n    return (\n      <Trans\n        i18nKey=\"some key\"\n        defaults=\"Click <1>here</1> to continue\"\n        components={{ unused: <span /> }}\n      >\n        pre <a href=\"#\">link</a> post\n      </Trans>\n    );\n  }\n  it('should render translated string', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        Click \n        <a\n          href=\"#\"\n        >\n          here\n        </a>\n         to continue\n      </div>\n    `);\n  });\n});\n\ndescribe('trans using no children but components (object) - interpolated component with children', () => {\n  function Button({ children }) {\n    return <button type=\"button\">{children}</button>;\n  }\n  function TestComponent() {\n    return <Trans defaults=\"hello <ClickMe>Test</ClickMe>\" components={{ ClickMe: <Button /> }} />;\n  }\n  it('should render translated string', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        hello \n        <button\n          type=\"button\"\n        >\n          Test\n        </button>\n      </div>\n    `);\n  });\n});\n\ndescribe('trans with multiple less-than signs', () => {\n  function TestComponent() {\n    return (\n      <Trans\n        defaults=\"Values: <10, <20, and <bold>{{value}}</bold> are all less than 100\"\n        values={{ value: '50' }}\n        components={{ bold: <strong>test</strong> }}\n      />\n    );\n  }\n  it('should render with escaped less-than signs', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        Values: &lt;10, &lt;20, and \n        <strong>\n          50\n        </strong>\n         are all less than 100\n      </div>\n    `);\n  });\n});\n\ndescribe('trans with less-than in mathematical expression', () => {\n  function TestComponent() {\n    return (\n      <Trans\n        defaults=\"If x<5 then <bold>do this</bold>\"\n        components={{ bold: <strong>test</strong> }}\n      />\n    );\n  }\n  it('should render with escaped less-than sign', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        If x&lt;5 then \n        <strong>\n          do this\n        </strong>\n      </div>\n    `);\n  });\n});\n\ndescribe('trans with numbered tags with attributes', () => {\n  function TestComponent() {\n    return (\n      <Trans\n        defaults='Result should be a clickable link <0 href=\"https://www.google.com\">Google</0>'\n        components={[<a>dummy</a>]}\n      />\n    );\n  }\n  it('should render tags with attributes correctly', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        Result should be a clickable link \n        <a\n          href=\"https://www.google.com\"\n        >\n          Google\n        </a>\n      </div>\n    `);\n  });\n});\n\ndescribe('trans with hyphenated component names', () => {\n  function TestComponent() {\n    return (\n      <Trans\n        defaults=\"Visit our website: <website-link>mywebsite.fr</website-link>\"\n        components={{ 'website-link': <a href=\"https://mywebsite.fr\">dummy</a> }}\n      />\n    );\n  }\n  it('should render hyphenated component names correctly', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        Visit our website: \n        <a\n          href=\"https://mywebsite.fr\"\n        >\n          mywebsite.fr\n        </a>\n      </div>\n    `);\n  });\n});\n\ndescribe('trans with underscore component names', () => {\n  function TestComponent() {\n    return (\n      <Trans\n        defaults=\"Click <my_button>here</my_button> to continue\"\n        components={{ my_button: <button type=\"button\">dummy</button> }}\n      />\n    );\n  }\n  it('should render underscore component names correctly', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        Click \n        <button\n          type=\"button\"\n        >\n          here\n        </button>\n         to continue\n      </div>\n    `);\n  });\n});\n"
  },
  {
    "path": "test/trans.render.spec.jsx",
    "content": "import { describe, it, expect, beforeAll, afterAll, beforeEach, afterEach, vi } from 'vitest';\nimport React, { useRef, useEffect } from 'react';\nimport { render, cleanup, waitFor, screen } from '@testing-library/react';\nimport i18n from './i18n';\nimport { withTranslation } from '../src/withTranslation';\nimport { Trans } from '../src/Trans';\nimport { Trans as TransWithoutContext } from '../src/TransWithoutContext';\n\nfunction Link({ to, children }) {\n  return <a href={to}>{children}</a>;\n}\n\ndescribe('trans simple', () => {\n  afterEach(() => {\n    cleanup();\n  });\n\n  function TestComponent({ parent }) {\n    return (\n      <Trans i18nKey=\"transTest1\" parent={parent}>\n        Open <Link to=\"/msgs\">here</Link>.\n      </Trans>\n    );\n  }\n\n  it('should render correct content', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        Go \n        <a\n          href=\"/msgs\"\n        >\n          there\n        </a>\n        .\n      </div>\n    `);\n  });\n\n  it('can use a different parent element', () => {\n    const { container } = render(<TestComponent parent=\"span\" />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <span>\n        Go \n        <a\n          href=\"/msgs\"\n        >\n          there\n        </a>\n        .\n      </span>\n    `);\n  });\n});\n\ndescribe('trans simple using ns prop', () => {\n  function TestComponent({ parent }) {\n    return (\n      <Trans i18nKey=\"transTest1\" ns=\"other\" parent={parent}>\n        Open <Link to=\"/msgs\">here</Link>.\n      </Trans>\n    );\n  }\n\n  it('should render correct content', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        Another go \n        <a\n          href=\"/msgs\"\n        >\n          there\n        </a>\n        .\n      </div>\n    `);\n  });\n});\n\ndescribe('trans using translation prop', () => {\n  function TestComponent({ parent }) {\n    return (\n      <Trans i18nKey=\"transTest3\" parent={parent}>\n        {/* eslint-disable-next-line jsx-a11y/anchor-has-content */}\n        <a />\n      </Trans>\n    );\n  }\n\n  it('should render correct content', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        Result should be a clickable link \n        <a\n          href=\"https://www.google.com\"\n        >\n          Google\n        </a>\n      </div>\n    `);\n  });\n});\n\ndescribe('trans overwrites translation prop', () => {\n  function TestComponent({ parent }) {\n    return (\n      <Trans i18nKey=\"transTest3_overwrite\" parent={parent}>\n        {/* eslint-disable-next-line jsx-a11y/anchor-has-content, jsx-a11y/control-has-associated-label */}\n        <a href=\"https://www.bing.com\" />\n      </Trans>\n    );\n  }\n\n  it('should render correct content', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        Result should be a clickable link \n        <a\n          href=\"https://www.bing.com\"\n        >\n          Google\n        </a>\n      </div>\n    `);\n  });\n});\n\ndescribe('trans simple with custom html tag', () => {\n  function TestComponent({ parent }) {\n    return (\n      <Trans i18nKey=\"transTest1_customHtml\" parent={parent}>\n        Open <Link to=\"/msgs\">here</Link>.\n      </Trans>\n    );\n  }\n\n  function TestComponent2({ parent }) {\n    return <Trans i18nKey=\"transTest1_customHtml2\" parent={parent} />;\n  }\n\n  function TestComponent3({ parent }) {\n    return <Trans i18nKey=\"transTest1_customHtml3\" parent={parent} />;\n  }\n\n  it('should not skip custom html tags', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        <strong>\n          Go\n        </strong>\n         \n        <br />\n        <a\n          href=\"/msgs\"\n        >\n          there\n        </a>\n        .\n      </div>\n    `);\n  });\n\n  it('should not skip custom html tags - empty node', () => {\n    const { container } = render(<TestComponent2 />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        <strong>\n          Go\n        </strong>\n         \n        <br />\n         there.\n      </div>\n    `);\n  });\n\n  it('should skip custom html tags not listed in transKeepBasicHtmlNodesFor', () => {\n    const { container } = render(<TestComponent3 />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        <strong>\n          Go\n        </strong>\n        &lt;video /&gt;&lt;script&gt;console.warn(\"test\")&lt;/script&gt; there.\n      </div>\n    `);\n  });\n});\n\ndescribe('trans bracketNotation', () => {\n  function TestComponent() {\n    const numOfItems = 4;\n    return <Trans i18nKey=\"bracketNotation\" count={numOfItems} />;\n  }\n\n  it('should render correct content', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        4\n      </div>\n    `);\n  });\n});\n\ndescribe('trans otherNotation', () => {\n  function TestComponent() {\n    const numOfItems = 4;\n    return <Trans i18nKey=\"otherNotation\" count={numOfItems} />;\n  }\n\n  it('should render correct content', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        #$?count?$#\n      </div>\n    `);\n  });\n});\n\ndescribe('trans testTransKey1 singular', () => {\n  function TestComponent() {\n    const numOfItems = 1;\n    return (\n      <Trans i18nKey=\"testTransKey1\" count={numOfItems}>\n        {{ numOfItems }} items matched.\n      </Trans>\n    );\n  }\n\n  it('should render correct content', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        1\n         item matched.\n      </div>\n    `);\n  });\n});\n\ndescribe('trans testTransKey1 plural', () => {\n  function TestComponent() {\n    const numOfItems = 10;\n    return (\n      <Trans i18nKey=\"testTransKey1\" count={numOfItems}>\n        {{ numOfItems }} items matched.\n      </Trans>\n    );\n  }\n\n  it('should render correct content', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        10\n         items matched.\n      </div>\n    `);\n  });\n});\n\ndescribe('trans testTransKey2', () => {\n  function TestComponent() {\n    const numOfItems = 10;\n    return (\n      <Trans i18nKey=\"testTransKey2\" count={numOfItems}>\n        <span className=\"matchCount\">{{ numOfItems }}</span> items matched.\n      </Trans>\n    );\n  }\n\n  it('should render correct content', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        <span\n          class=\"matchCount\"\n        >\n          10\n        </span>\n         items matched.\n      </div>\n    `);\n  });\n});\n\ndescribe('trans testTransKey3', () => {\n  function TestComponent() {\n    const numOfItems = 10;\n    return (\n      <Trans i18nKey=\"testTransKey3\" count={numOfItems}>\n        Result: <span className=\"matchCount\">{{ numOfItems }}</span> items matched.\n      </Trans>\n    );\n  }\n\n  it('should render correct content', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        Result: \n        <span\n          class=\"matchCount\"\n        >\n          10\n        </span>\n         items matched.\n      </div>\n    `);\n  });\n});\n\ndescribe('trans complex', () => {\n  function TestComponent() {\n    const count = 10;\n    const name = 'Jan';\n    // prettier-ignore\n    return (\n      <Trans i18nKey=\"transTest2\" count={count}>\n        Hello <strong>{{ name }}</strong>, you have {{ count }} message. Open <Link to=\"/msgs\">here</Link>.\n      </Trans>\n    );\n  }\n\n  it('should render correct content', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        Hello \n        <strong>\n          Jan\n        </strong>\n        , you have \n        10\n         messages. Open \n        <a\n          href=\"/msgs\"\n        >\n          here\n        </a>\n        .\n      </div>\n    `);\n  });\n});\n\ndescribe('trans complex - count only in props', () => {\n  function TestComponent() {\n    const count = 10;\n    const name = 'Jan';\n    // prettier-ignore\n    return (\n      <Trans i18nKey=\"transTest2\" count={count}>\n        Hello <strong>{{ name }}</strong>, you have {{ n: count }} message. Open <Link to=\"/msgs\">here</Link>.\n      </Trans>\n    );\n  }\n\n  it('should render correct content', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        Hello \n        <strong>\n          Jan\n        </strong>\n        , you have \n        10\n         messages. Open \n        <a\n          href=\"/msgs\"\n        >\n          here\n        </a>\n        .\n      </div>\n    `);\n  });\n});\n\ndescribe('trans complex - count inferred from children', () => {\n  function TestComponent() {\n    const count = 10;\n    const name = 'Jan';\n    // prettier-ignore\n    return (\n      <Trans i18nKey=\"transTest2\">\n        Hello <strong>{{ name }}</strong>, you have {{ count }} message. Open <Link to=\"/msgs\">here</Link>.\n      </Trans>\n    );\n  }\n\n  it('should render correct content', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        Hello \n        <strong>\n          Jan\n        </strong>\n        , you have \n        10\n         messages. Open \n        <a\n          href=\"/msgs\"\n        >\n          here\n        </a>\n        .\n      </div>\n    `);\n  });\n});\n\ndescribe('trans with count and stuff inferred', () => {\n  function TestComponent() {\n    const count = 123;\n    const stuff = 'hey';\n    return (\n      <Trans>\n        <strong>\n          {{ count }} and {{ stuff }}\n        </strong>\n      </Trans>\n    );\n  }\n\n  it('should render correct content', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        <strong>\n          123 and hey\n        </strong>\n      </div>\n    `);\n  });\n});\n\ndescribe('trans complex v2 no extra pseudo elements for interpolation', () => {\n  function TestComponent() {\n    const count = 10;\n    const name = 'Jan';\n    // prettier-ignore\n    return (\n      <Trans i18nKey=\"transTest2InV2\" count={count}>\n        Hello <strong>{{ name }}</strong>, you have {{ count }} message. Open <Link to=\"/msgs\">here</Link>.\n      </Trans>\n    );\n  }\n\n  it('should render correct content', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        Hello \n        <strong>\n          Jan\n        </strong>\n        , you have 10 messages. Open \n        <a\n          href=\"/msgs\"\n        >\n          here\n        </a>\n        .\n      </div>\n    `);\n  });\n});\n\ndescribe('trans with t as prop', () => {\n  function TestComponent({ t, cb }) {\n    const customT = (...args) => {\n      if (cb) cb();\n      return t(...args);\n    };\n    return (\n      <Trans i18nKey=\"transTest1\" t={customT}>\n        Open <Link to=\"/msgs\">here</Link>.\n      </Trans>\n    );\n  }\n\n  it('should use props t', () => {\n    let usedCustomT = false;\n    const cb = () => {\n      usedCustomT = true;\n    };\n\n    const HocElement = withTranslation(['translation'], {})(TestComponent);\n\n    render(<HocElement cb={cb} />);\n    expect(usedCustomT).toBe(true);\n  });\n\n  it('should not pass t to HTML element', () => {\n    const HocElement = withTranslation(['translation'], {})(TestComponent);\n\n    const { container } = render(<HocElement i18n={i18n} />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        Go \n        <a\n          href=\"/msgs\"\n        >\n          there\n        </a>\n        .\n      </div>\n    `);\n  });\n});\n\ndescribe('trans with empty content', () => {\n  function TestComponent() {\n    return <Trans />;\n  }\n  it('should render an empty string', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`<div />`);\n  });\n});\n\ndescribe('trans with only content from translation file - no children', () => {\n  function TestComponent() {\n    return <Trans i18nKey=\"key1\" />;\n  }\n  it('should render translated string', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        test\n      </div>\n    `);\n  });\n});\n\ndescribe('trans with only html content from translation file - no children', () => {\n  function TestComponent() {\n    return <Trans i18nKey=\"transTest1_customHtml2\" />;\n  }\n  it('should render translated string', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        <strong>\n          Go\n        </strong>\n         \n        <br />\n         there.\n      </div>\n    `);\n  });\n});\n\ndescribe('trans should not break on invalid node from translations', () => {\n  function TestComponent() {\n    return <Trans i18nKey=\"testInvalidHtml\" />;\n  }\n  it('should render translated string', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        &lt;hello\n      </div>\n    `);\n  });\n});\n\ndescribe('trans should not break on invalid node from translations - part2', () => {\n  function TestComponent() {\n    return <Trans i18nKey=\"testInvalidHtml2\" />;\n  }\n  it('should render translated string', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        &lt;hello&gt;\n      </div>\n    `);\n  });\n});\n\ndescribe('trans should work with misleading overloaded empty elements in components', () => {\n  function TestComponent() {\n    return (\n      <Trans\n        i18nKey=\"someKey\"\n        defaults=\"Hi {{ firstName }},<br/>and <bold>welcome</bold>\"\n        values={{ firstName: 'Fritz' }}\n        components={{ br: <br />, bold: <strong /> }}\n      />\n    );\n  }\n  it('should render translated string', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        Hi Fritz,\n        <br />\n        and \n        <strong>\n          welcome\n        </strong>\n      </div>\n    `);\n  });\n});\n\ndescribe('trans should work with defaultVariables', () => {\n  function TestComponent() {\n    return <Trans i18nKey=\"interpolateKeyWithDefaultVariables\" />;\n  }\n  it('should render translated string', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        add first SECOND\n      </div>\n    `);\n  });\n});\n\ndescribe('trans should work with lowercase elements in components', () => {\n  function TestComponent() {\n    return (\n      <Trans\n        i18nKey=\"someKeyWithLowercaseComp\"\n        defaults=\"click <whatever>here</whatever> for more\"\n        components={{ whatever: <a href=\"/foo\">dummy</a> }}\n      />\n    );\n  }\n  it('should render translated string', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        click \n        <a\n          href=\"/foo\"\n        >\n          here\n        </a>\n         for more\n      </div>\n    `);\n  });\n});\n\ndescribe('trans should work with uppercase elements in components', () => {\n  function TestComponent() {\n    return (\n      <Trans\n        i18nKey=\"someKeyWithUppercaseComp\"\n        defaults=\"click <Link>here</Link> for more\"\n        components={{ Link: <a href=\"/foo\">dummy</a> }}\n      />\n    );\n  }\n  it('should render translated string', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        click \n        <a\n          href=\"/foo\"\n        >\n          here\n        </a>\n         for more\n      </div>\n    `);\n  });\n});\n\ndescribe('trans should work with selfclosing elements in components', () => {\n  function TestComponent() {\n    return (\n      <Trans\n        i18nKey=\"transTestWithSelfClosing\"\n        components={{\n          component: <div>These children will be preserved</div>,\n        }}\n      />\n    );\n  }\n  it('should render translated string', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        interpolated component: \n        <div>\n          These children will be preserved\n        </div>\n      </div>\n    `);\n  });\n});\n\ndescribe('trans should work with self closing elements with react components', () => {\n  function Component({ children }) {\n    return <div>{children}</div>;\n  }\n  it('should render component children', () => {\n    const { container } = render(\n      <Trans\n        i18nKey=\"transTestWithSelfClosing\"\n        components={{\n          component: <Component>These children will be preserved</Component>,\n        }}\n      />,\n    );\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        interpolated component: \n        <div>\n          These children will be preserved\n        </div>\n      </div>\n    `);\n  });\n  it('should render Link component children', () => {\n    const { container } = render(\n      <Trans\n        i18nKey=\"transTestWithSelfClosing\"\n        components={{\n          component: <Link to=\"#\">These children will be preserved</Link>,\n        }}\n      />,\n    );\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        interpolated component: \n        <a\n          href=\"#\"\n        >\n          These children will be preserved\n        </a>\n      </div>\n    `);\n  });\n  it('should render anchor tag children', () => {\n    const { container } = render(\n      <Trans\n        i18nKey=\"transTestWithSelfClosing\"\n        components={{\n          component: <a href=\"#\">These children will be preserved</a>,\n        }}\n      />,\n    );\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        interpolated component: \n        <a\n          href=\"#\"\n        >\n          These children will be preserved\n        </a>\n      </div>\n    `);\n  });\n\n  it('should override component props with translation props (issue #1902)', () => {\n    const { container } = render(\n      <Trans\n        i18nKey=\"myKey\"\n        components={{\n          CustomLink: <a href=\"value-to-be-overridden\">fallback</a>,\n        }}\n      />,\n    );\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        This is a \n        <a\n          href=\"https://example.com/\"\n        >\n          link to example.com\n        </a>\n        .\n      </div>\n    `);\n  });\n});\n\ndescribe('trans with null child', () => {\n  function TestComponent() {\n    return (\n      <Trans i18nKey=\"transTest1\">\n        Open <Link to=\"/msgs\">here</Link>.{null}\n      </Trans>\n    );\n  }\n\n  it('should ignore the null child and render correct content', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        Go \n        <a\n          href=\"/msgs\"\n        >\n          there\n        </a>\n        .\n      </div>\n    `);\n  });\n});\n\ndescribe('trans with wrapTextNodes', () => {\n  let orgValue;\n  beforeAll(() => {\n    orgValue = i18n.options.react.transWrapTextNodes;\n    i18n.options.react.transWrapTextNodes = 'span';\n  });\n  afterAll(() => {\n    i18n.options.react.transWrapTextNodes = orgValue;\n  });\n\n  function TestComponent() {\n    return (\n      <Trans i18nKey=\"transTest1\">\n        Open <Link to=\"/msgs\">here</Link>.\n      </Trans>\n    );\n  }\n\n  it('should wrap text nodes accordingly', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        <span>\n          Go \n        </span>\n        <a\n          href=\"/msgs\"\n        >\n          <span>\n            there\n          </span>\n        </a>\n        <span>\n          .\n        </span>\n      </div>\n    `);\n  });\n});\n\ndescribe('trans does ignore user defined values when parsing', () => {\n  function TestComponent({ value }) {\n    return (\n      <Trans>\n        This is <strong>just</strong> some {{ value }} text\n      </Trans>\n    );\n  }\n\n  it('should escape value with angle brackets', () => {\n    const { container } = render(<TestComponent value=\"<weird>\" />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        This is \n        <strong>\n          just\n        </strong>\n         some &lt;weird&gt; text\n      </div>\n    `);\n  });\n});\n\ndescribe('trans should allow escaped html', () => {\n  function TestComponent() {\n    return (\n      <Trans i18nKey=\"transTestEscapedHtml\" components={[<Link to=\"/msgs\" />]} shouldUnescape />\n    );\n  }\n\n  it('should unescape &lt; &nbsp; &amp; &gt; to < SPACE & >', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        Escaped html should unescape correctly \n        <a\n          href=\"/msgs\"\n        >\n          &lt; &&gt;\n        </a>\n        .\n      </div>\n    `);\n  });\n});\n\ndescribe('trans with custom unescape', () => {\n  let orgValue;\n  beforeAll(() => {\n    orgValue = i18n.options.react.unescape;\n    i18n.options.react.unescape = (text) => text.replace('&shy;', '\\u00AD');\n  });\n\n  afterAll(() => {\n    i18n.options.react.unescape = orgValue;\n  });\n\n  it('should allow unescape override', () => {\n    function TestComponent() {\n      return (\n        <Trans\n          i18nKey=\"transTestCustomUnescape\"\n          components={[<Link to=\"/msgs\" />]}\n          shouldUnescape\n        />\n      );\n    }\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        Text should be passed through custom unescape \n        <a\n          href=\"/msgs\"\n        >\n          \\u00AD\n        </a>\n      </div>\n    `);\n  });\n\n  it('should allow unescape override again', () => {\n    function TestComponent() {\n      return <Trans i18nKey=\"transTestCustomUnescapeSecond\" shouldUnescape />;\n    }\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        Vertrauens\\u00ADkennwert\n      </div>\n    `);\n  });\n});\n\ndescribe('trans with context via tOptions', () => {\n  const tOptions = { context: 'home' };\n  function TestComponent({ parent }) {\n    return (\n      <Trans i18nKey=\"testTransWithCtx\" tOptions={tOptions} parent={parent}>\n        Open <Link to=\"/msgs\">here</Link>.\n      </Trans>\n    );\n  }\n\n  it('should render correct content', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        Go \n        <a\n          href=\"/msgs\"\n        >\n          home\n        </a>\n        .\n      </div>\n    `);\n    expect(tOptions).to.have.property('context', 'home');\n  });\n});\n\ndescribe('trans with context property', () => {\n  function TestComponent({ parent }) {\n    return (\n      <Trans i18nKey=\"testTransWithCtx\" context=\"home\" parent={parent}>\n        Open <Link to=\"/msgs\">here</Link>.\n      </Trans>\n    );\n  }\n\n  it('should render correct content', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        Go \n        <a\n          href=\"/msgs\"\n        >\n          home\n        </a>\n        .\n      </div>\n    `);\n  });\n});\n\ndescribe('trans with formatting', () => {\n  function TestComponent({ parent }) {\n    return (\n      <>\n        <Trans parent={parent} i18nKey=\"trans-key-with-generic-var\" values={{ foo: 1234 }} />\n        <Trans parent={parent} i18nKey=\"trans-key-with-number-var\" values={{ foo: 1234 }} />\n        <Trans parent={parent} i18nKey=\"trans-key-with-number-var\">\n          {{ foo: 1234 }}\n        </Trans>\n      </>\n    );\n  }\n\n  it('should render correct content', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.childNodes[0]).toMatchInlineSnapshot(`\n      <div>\n        Value as is: 1234\n      </div>\n    `);\n    expect(container.childNodes[1]).toMatchInlineSnapshot(`\n      <div>\n        Treat value as number: 1234\n      </div>\n    `);\n    expect(container.childNodes[2]).toMatchInlineSnapshot(`\n      <div>\n        Treat value as number: 1234\n      </div>\n    `);\n  });\n});\n\ndescribe('trans with formatting with alwaysFormat', () => {\n  let newI18n;\n\n  beforeEach(() => {\n    newI18n = i18n.createInstance();\n    newI18n.init({\n      interpolation: {\n        alwaysFormat: true,\n        escapeValue: false,\n        format: (value) => `(formatted ${value})`,\n      },\n    });\n  });\n\n  function TestComponent({ parent }) {\n    const name = 'Fritz';\n    return (\n      <Trans parent={parent} i18n={newI18n} count={3}>\n        number: {'{{count, INTEGER}}'}\n        <br />\n        name: {{ name }}\n      </Trans>\n    );\n  }\n\n  it('should render correct content', () => {\n    const { container } = render(<TestComponent />);\n    expect(container).toMatchInlineSnapshot(`\n      <div>\n        number: (formatted 3)\n        <br />\n        name: (formatted Fritz)\n      </div>\n    `);\n  });\n});\n\ndescribe('trans with undefined context property', () => {\n  function TestComponent({ parent }) {\n    return (\n      <Trans i18nKey=\"testTransWithCtx\" context={undefined} parent={parent}>\n        Open <Link to=\"/msgs\">here</Link>.\n      </Trans>\n    );\n  }\n\n  it('should render correct content', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        Go \n        <a\n          href=\"/msgs\"\n        >\n          there\n        </a>\n        .\n      </div>\n    `);\n  });\n});\n\ndescribe('trans with context property but no children', () => {\n  function TestComponent({ parent }) {\n    return <Trans i18nKey=\"testTransNoChildrenWithCtx\" context=\"home\" parent={parent} />;\n  }\n\n  it('should render correct content', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        Go to Switzerland.\n      </div>\n    `);\n  });\n});\n\ndescribe('trans with undefined context property but no children', () => {\n  function TestComponent({ parent }) {\n    return <Trans i18nKey=\"testTransNoChildrenWithCtx\" context={undefined} parent={parent} />;\n  }\n\n  it('should render correct content', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        Go .\n      </div>\n    `);\n  });\n});\n\ndescribe('trans with different context property but no children', () => {\n  function TestComponent({ parent }) {\n    return <Trans i18nKey=\"testTransNoChildrenWithCtx\" context=\"somewhere\" parent={parent} />;\n  }\n\n  it('should render correct content', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        Go somewhere.\n      </div>\n    `);\n  });\n});\n\ndescribe('trans with defaults property and children', () => {\n  function TestComponent() {\n    return (\n      <Trans count={3} defaults=\"This property should not get used\">\n        You have {{ count: 3 }} message\n      </Trans>\n    );\n  }\n\n  it('should render correct content', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        You have 3 messages\n      </div>\n    `);\n  });\n});\n\ndescribe('trans with defaults property and no children', () => {\n  function TestComponent() {\n    return <Trans i18nKey=\"missing-key-here\" count={2} defaults=\"There are {{ count }} items\" />;\n  }\n\n  it('should render correct content', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        There are 2 items\n      </div>\n    `);\n  });\n});\n\ndescribe('trans with defaults (via tOptions) property and no children', () => {\n  function TestComponent() {\n    return (\n      <Trans\n        i18nKey=\"missing-key-here\"\n        count={4}\n        tOptions={{ defaultValue: 'There are {{ count }} items' }}\n      />\n    );\n  }\n\n  it('should render correct content', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        There are 4 items\n      </div>\n    `);\n  });\n});\n\ndescribe('trans with nesting $t()', () => {\n  function TestComponent({ parent }) {\n    return <Trans i18nKey=\"nestingKey1\" ns=\"other\" parent={parent} />;\n  }\n\n  it('should render correct content', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        This is key1 value and This is key2 value\n      </div>\n    `);\n  });\n});\n\ndescribe('trans with nesting $t() and interpolation', () => {\n  function TestComponent({ parent }) {\n    return (\n      <Trans\n        i18nKey=\"nestingInterKey3\"\n        ns=\"other\"\n        parent={parent}\n        tOptions={{ interpolation: { skipOnVariables: false } }}\n      />\n    );\n  }\n\n  it('should render correct content', () => {\n    const { container } = render(<TestComponent />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        should work This is key2 value\n      </div>\n    `);\n  });\n});\n\ndescribe('Trans edge cases', () => {\n  afterEach(() => {\n    cleanup();\n  });\n\n  it('should handle missing i18n instance gracefully', () => {\n    const { container } = render(\n      <TransWithoutContext i18n={null}>Fallback content</TransWithoutContext>,\n    );\n\n    expect(container).toHaveTextContent('Fallback content');\n  });\n\n  it('should handle invalid components prop type', () => {\n    const { container } = render(\n      <Trans i18n={i18n} i18nKey=\"test.key\" components={123} defaults=\"Hello <0>world</0>\">\n        Fallback\n      </Trans>,\n    );\n\n    // Should render something (component warning logged internally)\n    expect(container).toBeTruthy();\n  });\n\n  describe('Trans ref forwarding', () => {\n    function TestComponent({ cb }) {\n      const ref = useRef(null);\n      useEffect(() => {\n        cb(ref.current);\n      }, [cb]);\n      return (\n        <Trans>\n          <div className=\"App\">\n            <h1>Hello CodeSandbox</h1>\n            <h2 ref={ref}>Start editing to see some magic happen!</h2>\n          </div>\n        </Trans>\n      );\n    }\n\n    it('preserves a user ref placed on a nested element', async () => {\n      const cb = vi.fn();\n      render(<TestComponent cb={cb} />);\n\n      await waitFor(() => {\n        expect(cb).toHaveBeenCalled();\n      });\n\n      const el = cb.mock.calls[0][0];\n      expect(el).toBeInstanceOf(HTMLElement);\n      expect(el.tagName).toBe('H2');\n      expect(el).toHaveTextContent('Start editing to see some magic happen!');\n    });\n  });\n});\n\ndescribe('trans issue 1893 - double escaping in props', () => {\n  function Item({ title }) {\n    return <span title={title}>{title}</span>;\n  }\n\n  function TestComponent({ name, escapeValue }) {\n    return (\n      <Trans\n        i18nKey=\"issue1893\"\n        values={{ name }}\n        components={{ Item: <Item /> }}\n        tOptions={escapeValue ? { interpolation: { escapeValue: true } } : undefined}\n        shouldUnescape\n      />\n    );\n  }\n\n  it('should render correctly with quotes in interpolation (case 1: escapeValue false)', () => {\n    const value = 'World \" \\' Test';\n    const { container } = render(<TestComponent name={value} />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        Hello &lt;Item title=\"World \" ' Test\" /&gt;!\n      </div>\n    `);\n  });\n\n  it('should render correctly with quotes in interpolation (case 2: escapeValue true)', () => {\n    const value = 'World \" \\' Test';\n    const { container } = render(<TestComponent name={value} escapeValue />);\n\n    // Expected behavior: Component parsed and rendered correctly without double escaping\n    const span = screen.getByText(value);\n    expect(span).toBeInTheDocument();\n    expect(span).toHaveTextContent(value);\n    expect(span).toHaveAttribute('title', value);\n\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        Hello \n        <span\n          title=\"World \" ' Test\"\n        >\n          World \" ' Test\n        </span>\n        !\n      </div>\n    `);\n  });\n});\n\ndescribe('trans with default props', () => {\n  it('should use transDefaultProps for tOptions', () => {\n    const i18nInst = i18n.createInstance();\n    i18nInst.init({\n      lng: 'en',\n      resources: {\n        en: {\n          translation: {\n            key1: 'hello #name#',\n          },\n        },\n      },\n      react: {\n        transDefaultProps: {\n          tOptions: { interpolation: { prefix: '#', suffix: '#' } },\n        },\n      },\n    });\n\n    const { container } = render(\n      <Trans i18n={i18nInst} i18nKey=\"key1\" values={{ name: 'world' }} />,\n    );\n    expect(container).toHaveTextContent('hello world');\n  });\n\n  it('should use transDefaultProps for shouldUnescape', () => {\n    const i18nInst = i18n.createInstance();\n    i18nInst.init({\n      lng: 'en',\n      resources: {\n        en: {\n          translation: {\n            key1: 'hello <Item title=\"{{name}}\" />',\n          },\n        },\n      },\n      react: {\n        transDefaultProps: {\n          tOptions: { interpolation: { escapeValue: true } },\n          shouldUnescape: true,\n        },\n      },\n    });\n\n    function Item({ title }) {\n      return <span title={title}>{title}</span>;\n    }\n\n    render(\n      <Trans\n        i18n={i18nInst}\n        i18nKey=\"key1\"\n        values={{ name: '\"' }}\n        components={{ Item: <Item /> }}\n      />,\n    );\n    const span = screen.getByTitle('\"');\n    expect(span).toHaveAttribute('title', '\"');\n  });\n\n  it('should override transDefaultProps', () => {\n    const i18nInst = i18n.createInstance();\n    i18nInst.init({\n      lng: 'en',\n      resources: {\n        en: {\n          translation: {\n            key1: 'hello {{name}}',\n          },\n        },\n      },\n      react: {\n        transDefaultProps: {\n          tOptions: { interpolation: { prefix: '#', suffix: '#' } },\n        },\n      },\n    });\n\n    const { container } = render(\n      <Trans\n        i18n={i18nInst}\n        i18nKey=\"key1\"\n        values={{ name: 'world' }}\n        tOptions={{ interpolation: { prefix: '{{', suffix: '}}' } }}\n      />,\n    );\n    expect(container).toHaveTextContent('hello world');\n  });\n\n  it('should use transDefaultProps for values', () => {\n    const i18nInst = i18n.createInstance();\n    i18nInst.init({\n      lng: 'en',\n      resources: {\n        en: {\n          translation: {\n            key1: 'hello {{name}}',\n          },\n        },\n      },\n      react: {\n        transDefaultProps: {\n          values: { name: 'world' },\n        },\n      },\n    });\n\n    const { container } = render(<Trans i18n={i18nInst} i18nKey=\"key1\" />);\n    expect(container).toHaveTextContent('hello world');\n  });\n\n  it('should use transDefaultProps for components', () => {\n    const i18nInst = i18n.createInstance();\n    i18nInst.init({\n      lng: 'en',\n      resources: {\n        en: {\n          translation: {\n            key1: 'hello <Bold>world</Bold>',\n          },\n        },\n      },\n      react: {\n        transDefaultProps: {\n          components: { Bold: <strong /> },\n        },\n      },\n    });\n\n    render(<Trans i18n={i18nInst} i18nKey=\"key1\" />);\n    expect(screen.getByText('world', { selector: 'strong' })).toHaveTextContent('world');\n  });\n});\n"
  },
  {
    "path": "test/typescript/custom-types/IcuTrans.test.tsx",
    "content": "import { describe, it, expectTypeOf, assertType } from 'vitest';\nimport * as React from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { IcuTrans } from '../../..';\n\ndescribe('<IcuTrans />', () => {\n  describe('default namespace', () => {\n    it('standard usage', () => {\n      // <IcuTrans i18nKey=\"foo\" defaultTranslation=\"foo\" content={[]} />\n      expectTypeOf(IcuTrans).toBeCallableWith({\n        i18nKey: 'foo',\n        defaultTranslation: 'foo',\n        content: [],\n      });\n    });\n\n    it('should throw if key does not exist', () => {\n      expectTypeOf<React.ComponentProps<typeof IcuTrans>>()\n        .toHaveProperty('i18nKey')\n        .extract<'Nope'>()\n        // @ts-expect-error\n        .toMatchTypeOf<'Nope'>();\n    });\n  });\n\n  describe('named namespace', () => {\n    it('standard usage', () => {\n      // <IcuTrans ns=\"custom\" i18nKey=\"foo\" defaultTranslation=\"foo\" content={[]} />\n      expectTypeOf(IcuTrans).toBeCallableWith({\n        ns: 'custom',\n        i18nKey: 'foo',\n        defaultTranslation: 'foo',\n        content: [],\n      });\n    });\n\n    it('should throw if namespace does not exist', () => {\n      expectTypeOf<React.ComponentProps<typeof IcuTrans>>()\n        .toHaveProperty('ns')\n        .extract<'Nope'>()\n        // @ts-expect-error\n        .toMatchTypeOf<'Nope'>();\n    });\n  });\n\n  describe('array namespace', () => {\n    it('should work with array namespace', () => {\n      // <IcuTrans ns={['alternate', 'custom']} i18nKey=\"alternate:baz\" defaultTranslation=\"baz\" content={[]} />\n      expectTypeOf(IcuTrans).toBeCallableWith({\n        ns: ['alternate', 'custom'],\n        i18nKey: 'alternate:baz',\n        defaultTranslation: 'baz',\n        content: [],\n      });\n    });\n\n    it('should throw error if key is not present inside namespaces', () => {\n      // <IcuTrans ns={['alternate', 'custom']} i18nKey=\"custom:bar2\" defaultTranslation=\"bar\" content={[]} />\n      expectTypeOf(IcuTrans).toBeCallableWith({\n        ns: ['alternate', 'custom'],\n        // @ts-expect-error\n        i18nKey: 'custom:bar2',\n        defaultTranslation: 'bar',\n        content: [],\n      });\n    });\n  });\n\n  describe('usage with `t` function', () => {\n    it('should work when providing `t` function', () => {\n      const { t } = useTranslation('alternate');\n\n      // <IcuTrans t={t} i18nKey=\"foobar.barfoo\" defaultTranslation=\"foo\" content={[]} />\n      expectTypeOf(IcuTrans).toBeCallableWith({\n        t,\n        i18nKey: 'foobar.barfoo',\n        defaultTranslation: 'foo',\n        content: [],\n      });\n    });\n\n    it('should work when providing `t` function with a prefix', () => {\n      const { t } = useTranslation('alternate', { keyPrefix: 'foobar.deep' });\n\n      // <IcuTrans t={t} i18nKey=\"deeper.deeeeeper\" defaultTranslation=\"foo\" content={[]} />\n      expectTypeOf<\n        typeof IcuTrans<'deeper.deeeeeper', 'alternate', 'foobar.deep'>\n      >().toBeCallableWith({\n        t,\n        i18nKey: 'deeper.deeeeeper',\n        defaultTranslation: 'foo',\n        content: [],\n      });\n    });\n\n    it('should throw error with `t` function with key prefix and wrong `i18nKey`', () => {\n      const { t } = useTranslation('alternate', { keyPrefix: 'foobar.deep' });\n\n      // <IcuTrans t={t} i18nKey=\"xxx\" defaultTranslation=\"foo\" content={[]} />\n      expectTypeOf<\n        typeof IcuTrans<'deeper.deeeeeper', 'alternate', 'foobar.deep'>\n      >().toBeCallableWith({\n        t,\n        // @ts-expect-error\n        i18nKey: 'xxx',\n        defaultTranslation: 'foo',\n        content: [],\n      });\n    });\n  });\n\n  describe('values and content props', () => {\n    it('should work with values for ICU interpolation', () => {\n      expectTypeOf(IcuTrans).toBeCallableWith({\n        i18nKey: 'foo',\n        defaultTranslation: 'Hello {name}!',\n        content: [],\n        values: { name: 'World' },\n      });\n    });\n\n    it('should work with component and values', () => {\n      expectTypeOf(IcuTrans).toBeCallableWith({\n        i18nKey: 'foo',\n        defaultTranslation: 'Hello <0>{name}</0>!',\n        content: [{ type: 'strong', props: {} }],\n        values: { name: 'World' },\n      });\n    });\n\n    it('should work with nested content declarations', () => {\n      expectTypeOf(IcuTrans).toBeCallableWith({\n        i18nKey: 'foo',\n        defaultTranslation: '<0><0>Item 1</0><1>Item 2</1></0>',\n        content: [\n          {\n            type: 'ul',\n            props: {\n              children: [\n                { type: 'li', props: {} },\n                { type: 'li', props: {} },\n              ],\n            },\n          },\n        ],\n      });\n    });\n  });\n\n  describe('type safety with different namespaces', () => {\n    it('should work with context namespace', () => {\n      const { t } = useTranslation('context');\n\n      assertType<React.ReactElement>(\n        <IcuTrans t={t} i18nKey=\"dessert_cake\" defaultTranslation=\"a nice cake\" content={[]} />,\n      );\n    });\n\n    it('should work with plurals namespace', () => {\n      const { t } = useTranslation('plurals');\n      assertType<React.ReactElement>(\n        <IcuTrans ns=\"plurals\" i18nKey=\"foo_one\" defaultTranslation=\"foo\" content={[]} />,\n      );\n    });\n\n    it('should work with alternate namespace', () => {\n      assertType<React.ReactElement>(\n        <IcuTrans ns=\"alternate\" i18nKey=\"baz\" defaultTranslation=\"baz\" content={[]} />,\n      );\n    });\n  });\n});\n"
  },
  {
    "path": "test/typescript/custom-types/Trans.test.tsx",
    "content": "import { describe, it, expectTypeOf } from 'vitest';\nimport * as React from 'react';\nimport { Trans, useTranslation } from 'react-i18next';\n\ndescribe('<Trans />', () => {\n  describe('default namespace', () => {\n    it('standard usage', () => {\n      // <Trans i18nKey=\"foo\">foo</Trans>\n      expectTypeOf(Trans).toBeCallableWith({\n        i18nKey: 'foo',\n      });\n    });\n\n    it('should trow if key do not exist', () => {\n      expectTypeOf<React.ComponentProps<typeof Trans>>()\n        .toHaveProperty('i18nKey')\n        .extract<'Nope'>()\n        // @ts-expect-error\n        .toMatchTypeOf<'Nope'>();\n    });\n  });\n\n  describe('named namespace', () => {\n    it('standard usage', () => {\n      // <Trans ns=\"custom\" i18nKey=\"foo\">foo</Trans>\n      expectTypeOf(Trans).toBeCallableWith({\n        ns: 'custom',\n        i18nKey: 'foo',\n      });\n    });\n\n    it('should trow if namespace do not exist', () => {\n      expectTypeOf<React.ComponentProps<typeof Trans>>()\n        .toHaveProperty('ns')\n        .extract<'Nope'>()\n        // @ts-expect-error\n        .toMatchTypeOf<'Nope'>();\n    });\n  });\n\n  describe('array namespace', () => {\n    it('should work with array namespace', () => {\n      // <Trans ns={['alternate', 'custom']} i18nKey={['alternate:baz', 'custom:bar']} />\n      expectTypeOf(Trans).toBeCallableWith({\n        ns: ['alternate', 'custom'],\n        i18nKey: ['alternate:baz', 'custom:bar'],\n      });\n    });\n\n    it('should throw error if key is not present inside namespaces', () => {\n      // <Trans ns={['alternate', 'custom']} i18nKey={['alternate:baz', 'custom:bar']} />\n      expectTypeOf(Trans).toBeCallableWith({\n        ns: ['alternate', 'custom'],\n        // @ts-expect-error\n        i18nKey: ['alternate:baz', 'custom:bar2'],\n      });\n    });\n  });\n\n  describe('usage with `t` function', () => {\n    it('should work when providing `t` function', () => {\n      const { t } = useTranslation('alternate');\n\n      // <Trans t={t} i18nKey=\"foobar.barfoo\">foo</Trans>\n      expectTypeOf(Trans).toBeCallableWith({\n        t,\n        i18nKey: 'foobar.barfoo',\n      });\n    });\n\n    it('should work when providing `t` function with a prefix', () => {\n      const { t } = useTranslation('alternate', { keyPrefix: 'foobar.deep' });\n\n      // <Trans t={t} i18nKey=\"deeper.deeeeeper\">foo</Trans>\n      expectTypeOf<typeof Trans<'deeper.deeeeeper', 'alternate', 'foobar.deep'>>().toBeCallableWith(\n        {\n          t,\n          i18nKey: 'deeper.deeeeeper',\n        },\n      );\n    });\n\n    it('should throw error with `t` function with key prefix and wrong `i18nKey`', () => {\n      const { t } = useTranslation('alternate', { keyPrefix: 'foobar.deep' });\n\n      // <Trans t={t} i18nKey=\"xxx\">foo</Trans>\n      expectTypeOf<typeof Trans<'deeper.deeeeeper', 'alternate', 'foobar.deep'>>().toBeCallableWith(\n        {\n          t,\n          // @ts-expect-error\n          i18nKey: 'xxx',\n        },\n      );\n    });\n  });\n\n  describe('interpolation', () => {\n    it('should work with text and interpolation', () => {\n      expectTypeOf(Trans).toBeCallableWith({\n        children: ['foo ', { var: '' }],\n      });\n    });\n\n    it('should work with Interpolation in HTMLElement', () => {\n      expectTypeOf(Trans).toBeCallableWith({\n        children: (\n          <>\n            foo <strong>{{ var: '' }}</strong>\n          </>\n        ),\n      });\n    });\n\n    it('should work with text and interpolation as children of an  HTMLElement', () => {\n      expectTypeOf(Trans).toBeCallableWith({\n        children: <span>foo {{ var: '' }}</span>,\n      });\n    });\n  });\n});\n"
  },
  {
    "path": "test/typescript/custom-types/TransWithoutContext.test.tsx",
    "content": "import { describe, it, expectTypeOf, assertType } from 'vitest';\nimport * as React from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { Trans } from '../../../TransWithoutContext';\n\ndescribe('<Trans />', () => {\n  describe('default namespace', () => {\n    it('standard usage', () => {\n      // <Trans i18nKey=\"foo\">foo</Trans>\n      expectTypeOf(Trans).toBeCallableWith({\n        i18nKey: 'foo',\n      });\n    });\n\n    it('should trow if key do not exist', () => {\n      expectTypeOf<React.ComponentProps<typeof Trans>>()\n        .toHaveProperty('i18nKey')\n        .extract<'Nope'>()\n        // @ts-expect-error\n        .toMatchTypeOf<'Nope'>();\n    });\n  });\n\n  describe('named namespace', () => {\n    it('standard usage', () => {\n      // <Trans ns=\"custom\" i18nKey=\"foo\">foo</Trans>\n      expectTypeOf(Trans).toBeCallableWith({\n        ns: 'custom',\n        i18nKey: 'foo',\n      });\n    });\n\n    it('should trow if namespace do not exist', () => {\n      expectTypeOf<React.ComponentProps<typeof Trans>>()\n        .toHaveProperty('ns')\n        .extract<'Nope'>()\n        // @ts-expect-error\n        .toMatchTypeOf<'Nope'>();\n    });\n  });\n\n  describe('array namespace', () => {\n    it('should work with array namespace', () => {\n      // <Trans ns={['alternate', 'custom']} i18nKey={['alternate:baz', 'custom:bar']} />\n      expectTypeOf(Trans).toBeCallableWith({\n        ns: ['alternate', 'custom'],\n        i18nKey: ['alternate:baz', 'custom:bar'],\n      });\n    });\n\n    it('should throw error if key is not present inside namespaces', () => {\n      // <Trans ns={['alternate', 'custom']} i18nKey={['alternate:baz', 'custom:bar']} />\n      expectTypeOf(Trans).toBeCallableWith({\n        ns: ['alternate', 'custom'],\n        // @ts-expect-error\n        i18nKey: ['alternate:baz', 'custom:bar2'],\n      });\n    });\n  });\n\n  describe('usage with `t` function', () => {\n    it('should work when providing `t` function', () => {\n      const { t } = useTranslation('alternate');\n\n      // <Trans t={t} i18nKey=\"foobar.barfoo\">foo</Trans>\n      expectTypeOf(Trans).toBeCallableWith({\n        t,\n        i18nKey: 'foobar.barfoo',\n      });\n    });\n\n    it('should work when providing `t` function with a prefix', () => {\n      const { t } = useTranslation('alternate', { keyPrefix: 'foobar.deep' });\n\n      // <Trans t={t} i18nKey=\"deeper.deeeeeper\">foo</Trans>\n      expectTypeOf<typeof Trans<'deeper.deeeeeper', 'alternate', 'foobar.deep'>>().toBeCallableWith(\n        {\n          t,\n          i18nKey: 'deeper.deeeeeper',\n        },\n      );\n    });\n\n    it('should throw error with `t` function with key prefix and wrong `i18nKey`', () => {\n      const { t } = useTranslation('alternate', { keyPrefix: 'foobar.deep' });\n\n      // <Trans t={t} i18nKey=\"xxx\">foo</Trans>\n      expectTypeOf<typeof Trans<'deeper.deeeeeper', 'alternate', 'foobar.deep'>>().toBeCallableWith(\n        {\n          t,\n          // @ts-expect-error\n          i18nKey: 'xxx',\n        },\n      );\n    });\n  });\n\n  describe('interpolation', () => {\n    it('should work with text and interpolation', () => {\n      expectTypeOf(Trans).toBeCallableWith({\n        children: ['foo ', { var: '' }],\n      });\n    });\n\n    it('should work with Interpolation in HTMLElement', () => {\n      expectTypeOf(Trans).toBeCallableWith({\n        children: (\n          <>\n            foo <strong>{{ var: '' }}</strong>\n          </>\n        ),\n      });\n    });\n\n    it('should work with text and interpolation as children of an HTMLElement', () => {\n      expectTypeOf(Trans).toBeCallableWith({\n        children: <span>foo {{ var: '' }}</span>,\n      });\n    });\n  });\n\n  describe('usage with context', () => {\n    it('should work with default namespace', () => {\n      assertType<React.ReactElement>(<Trans i18nKey=\"some\" context=\"me\" />);\n\n      // @ts-expect-error should throw error when context is not valid\n      assertType<React.ReactElement>(<Trans i18nKey=\"some\" context=\"one\" />);\n    });\n\n    it('should work with `ns` prop', () => {\n      assertType<React.ReactElement>(<Trans ns=\"context\" i18nKey=\"beverage\" />);\n\n      assertType<React.ReactElement>(\n        // @ts-expect-error should throw error when context is not valid\n        <Trans ns=\"context\" i18nKey=\"beverage\" context=\"strawberry\" />,\n      );\n    });\n\n    it('should work with default `t` function', () => {\n      const { t } = useTranslation();\n\n      assertType<React.ReactElement>(<Trans t={t} i18nKey=\"some\" context=\"me\" />);\n\n      // @ts-expect-error should throw error when context is not valid\n      assertType<React.ReactElement>(<Trans t={t} i18nKey=\"some\" context=\"Test1222\" />);\n    });\n\n    it('should work with custom `t` function', () => {\n      const { t } = useTranslation('context');\n\n      assertType<React.ReactElement>(<Trans t={t} i18nKey=\"dessert\" context=\"cake\" />);\n\n      // @ts-expect-error should throw error when context is not valid\n      assertType<React.ReactElement>(<Trans t={t} i18nKey=\"dessert\" context=\"sake\" />);\n    });\n\n    it('should work with `ns` prop and `count` prop', () => {\n      const { t } = useTranslation('plurals');\n      assertType<React.ReactElement>(<Trans ns=\"plurals\" i18nKey=\"foo\" count={2} />);\n    });\n\n    it('should work with custom `t` function and `count` prop', () => {\n      const { t } = useTranslation('plurals');\n      assertType<React.ReactElement>(<Trans t={t} i18nKey=\"foo\" count={2} />);\n    });\n  });\n});\n"
  },
  {
    "path": "test/typescript/custom-types/Translation.test.ts",
    "content": "import { describe, it, expectTypeOf } from 'vitest';\nimport { Translation } from 'react-i18next';\n\ndescribe('<Translation />', () => {\n  it('should work with default namespace', () => {\n    expectTypeOf(Translation).toBeCallableWith({ children: (t) => t('foo') });\n  });\n\n  it('should work with named default namespace', () => {\n    expectTypeOf(Translation<'custom'>).toBeCallableWith({ children: (t) => t('foo') });\n  });\n\n  it('should work with named namespace', () => {\n    expectTypeOf(Translation<'alternate'>).toBeCallableWith({ children: (t) => t('baz') });\n  });\n\n  it('should work with namespace array', () => {\n    expectTypeOf(Translation<['alternate', 'custom']>).toBeCallableWith({\n      children: (t) => `${t('alternate:baz')} ${t('custom:foo')}`,\n    });\n  });\n\n  it('should throw error when namespace does not exist', () => {\n    // @ts-expect-error\n    expectTypeOf(Translation<'fake'>).toBeFunction();\n  });\n\n  it('should throw error when namespace does not contain given `t` key', () => {\n    expectTypeOf(Translation<'custom'>).toBeCallableWith({\n      // @ts-expect-error\n      children: (t) => t('fake'),\n    });\n  });\n\n  it('should throw error when namespace does not contain given `t` key (with namespace as prefix)', () => {\n    expectTypeOf(Translation<'custom'>).toBeCallableWith({\n      // @ts-expect-error\n      children: (t) => t('custom:fake'),\n    });\n  });\n});\n"
  },
  {
    "path": "test/typescript/custom-types/i18next.d.ts",
    "content": "import 'i18next';\n\ndeclare module 'i18next' {\n  interface CustomTypeOptions {\n    defaultNS: 'custom';\n    allowObjectInHTMLChildren: true;\n    resources: {\n      custom: {\n        foo: 'foo';\n        bar: 'bar';\n\n        some: 'some';\n        some_me: 'some context';\n      };\n\n      alternate: {\n        baz: 'baz';\n        foobar: {\n          barfoo: 'barfoo';\n          deep: {\n            deeper: {\n              deeeeeper: 'foobar';\n            };\n          };\n        };\n      };\n\n      plurals: {\n        foo_zero: 'foo';\n        foo_one: 'foo';\n        foo_two: 'foo';\n        foo_many: 'foo';\n        foo_other: 'foo';\n      };\n\n      context: {\n        dessert_cake: 'a nice cake';\n        dessert_muffin_one: 'a nice muffin';\n        dessert_muffin_other: '{{count}} nice muffins';\n\n        beverage: 'beverage';\n        beverage_beer: 'beer';\n      };\n    };\n  }\n}\n"
  },
  {
    "path": "test/typescript/custom-types/tsconfig.json",
    "content": "{\n  \"extends\": \"../../../tsconfig.json\",\n  \"include\": [\"./**/*\"],\n  \"exclude\": []\n}\n"
  },
  {
    "path": "test/typescript/custom-types/useTranslation.test.ts",
    "content": "import { describe, it, expectTypeOf, assertType } from 'vitest';\nimport { useTranslation } from 'react-i18next';\nimport { TFunction, i18n } from 'i18next';\n\ndescribe('useTranslation', () => {\n  it('should provide result with both object and array', () => {\n    const result = useTranslation();\n\n    expectTypeOf(result).toMatchTypeOf<[TFunction, i18n, boolean]>();\n    expectTypeOf(result).toHaveProperty('ready').toBeBoolean();\n    expectTypeOf(result).toHaveProperty('t').toBeFunction();\n    expectTypeOf(result).toHaveProperty('i18n').toBeObject();\n  });\n\n  describe('default namespace', () => {\n    it('should work with default namespace', () => {\n      const [t] = useTranslation();\n\n      expectTypeOf(t).toBeCallableWith('foo');\n    });\n\n    it('should work with default named namespace', () => {\n      const [t] = useTranslation('custom');\n\n      expectTypeOf(t).toBeCallableWith('bar');\n    });\n  });\n\n  describe('named namespace', () => {\n    it('should work with named namespace', () => {\n      const [t] = useTranslation('alternate');\n\n      expectTypeOf(t).toBeCallableWith('baz');\n    });\n\n    it('should throw error when namespace does not exist', () => {\n      // @ts-expect-error\n      const [t] = useTranslation('fake');\n    });\n\n    it('should throw error when key does not exist inside namespace', () => {\n      const [t] = useTranslation('custom');\n      // @ts-expect-error\n      assertType<string>(t('fake'));\n    });\n  });\n\n  describe('namespace as array', () => {\n    it('should work with const namespaces', () => {\n      const [t] = useTranslation(['alternate', 'custom']);\n\n      expectTypeOf(t('alternate:baz')).toEqualTypeOf<'baz'>();\n      expectTypeOf(t('baz', { ns: 'alternate' })).toEqualTypeOf<'baz'>();\n      expectTypeOf(t('custom:foo')).toEqualTypeOf<'foo'>();\n      expectTypeOf(t('foo', { ns: 'custom' })).toEqualTypeOf<'foo'>();\n    });\n\n    it('should work with const namespaces', () => {\n      const namespaces = ['alternate', 'custom'] as const;\n      const [t] = useTranslation(namespaces);\n\n      expectTypeOf(t('alternate:baz')).toEqualTypeOf<'baz'>();\n      expectTypeOf(t('baz', { ns: 'alternate' })).toEqualTypeOf<'baz'>();\n      expectTypeOf(t('custom:foo')).toEqualTypeOf<'foo'>();\n      expectTypeOf(t('foo', { ns: 'custom' })).toEqualTypeOf<'foo'>();\n    });\n\n    it('should throw error when using wrong key', () => {\n      const [t] = useTranslation(['custom']);\n      // @ts-expect-error\n      assertType<string>(t('custom:fake'));\n      // @ts-expect-error\n      assertType<string>(t('fake', { ns: 'custom' }));\n    });\n  });\n\n  describe('with `keyPrefix`', () => {\n    it('should provide string keys', () => {\n      const [t] = useTranslation('alternate', { keyPrefix: 'foobar' });\n\n      expectTypeOf(t('barfoo')).toEqualTypeOf<'barfoo'>();\n    });\n\n    it('should work with deeper objects', () => {\n      const [t] = useTranslation('alternate', { keyPrefix: 'foobar.deep' });\n\n      expectTypeOf(t('deeper', { returnObjects: true })).toEqualTypeOf<{\n        deeeeeper: 'foobar';\n      }>();\n      expectTypeOf(t('deeper.deeeeeper')).toEqualTypeOf<'foobar'>();\n    });\n\n    it('should throw error with an invalid keyPrefix', () => {\n      // @ts-expect-error\n      useTranslation('alternate', { keyPrefix: 'abc' });\n    });\n\n    it('should throw error with an invalid key', () => {\n      const [t] = useTranslation('alternate', { keyPrefix: 'foobar' });\n      // @ts-expect-error\n      assertType<string>(t('abc'));\n    });\n  });\n\n  it('should work with json format v4 plurals', () => {\n    const [t] = useTranslation('plurals');\n\n    expectTypeOf(t('foo', { count: 0 })).toEqualTypeOf<'foo'>();\n    expectTypeOf(t('foo_one')).toEqualTypeOf<'foo'>();\n  });\n});\n"
  },
  {
    "path": "test/typescript/issue-1899/check-types.sh",
    "content": "#!/bin/bash\n# Test script for issue #1899\n# https://github.com/i18next/react-i18next/issues/1899\n#\n# This script runs TypeScript with skipLibCheck: false and checks for errors\n# in index.d.ts. It ignores errors in node_modules (like @types/node issues).\n\nset -e\n\ncd \"$(dirname \"$0\")/../../..\"\n\n# Run tsc and capture output\nOUTPUT=$(npx tsc -p test/typescript/issue-1899/tsconfig.json --noEmit 2>&1 || true)\n\n# Check for errors in index.d.ts (our code)\nINDEX_ERRORS=$(echo \"$OUTPUT\" | grep \"^index.d.ts\" || true)\n\nif [ -n \"$INDEX_ERRORS\" ]; then\n  echo \"ERROR: Type errors found in index.d.ts:\"\n  echo \"$INDEX_ERRORS\"\n  exit 1\nfi\n\necho \"OK: No type errors in index.d.ts\"\nexit 0\n"
  },
  {
    "path": "test/typescript/issue-1899/i18next.d.ts",
    "content": "import 'i18next';\n\n/**\n * Issue #1899: Type errors when custom resources are declared\n * https://github.com/i18next/react-i18next/issues/1899\n *\n * This configuration reproduces the bug where declaring custom resources\n * causes type errors in IcuTrans type definitions.\n */\ndeclare module 'i18next' {\n  interface CustomTypeOptions {\n    defaultNS: 'app';\n    resources: {\n      app: { foo: string; bar: string };\n    };\n  }\n}\n"
  },
  {
    "path": "test/typescript/issue-1899/import-check.ts",
    "content": "/**\n * Issue #1899: Type errors when custom resources are declared\n * https://github.com/i18next/react-i18next/issues/1899\n *\n * This file imports from react-i18next to trigger TypeScript to check\n * the type definitions in index.d.ts with custom resources declared.\n */\nimport type { IcuTrans } from 'react-i18next';\n\n// Just need to reference the type to trigger the check\nexport type _Check = typeof IcuTrans;\n"
  },
  {
    "path": "test/typescript/issue-1899/tsconfig.json",
    "content": "{\n  \"extends\": \"../../../tsconfig.json\",\n  \"compilerOptions\": {\n    \"skipLibCheck\": false\n  },\n  \"include\": [\"./**/*\"],\n  \"exclude\": []\n}\n"
  },
  {
    "path": "test/typescript/misc/I18nextProvider.test.tsx",
    "content": "import { describe, expectTypeOf } from 'vitest';\nimport i18next from 'i18next';\nimport { I18nextProvider } from 'react-i18next';\n\ndescribe('<I18nextProvider />', () => {\n  it('basic usage', () => {\n    expectTypeOf(I18nextProvider).toBeCallableWith({\n      i18n: i18next,\n      children: 'Foo',\n    });\n  });\n\n  it('should accept `defaultNS`', () => {\n    expectTypeOf(I18nextProvider).toBeCallableWith({\n      i18n: i18next,\n      defaultNS: 'defaultNS',\n      children: 'Foo',\n    });\n  });\n});\n"
  },
  {
    "path": "test/typescript/misc/IcuTrans.test.tsx",
    "content": "import { describe, it, expectTypeOf } from 'vitest';\nimport * as React from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { IcuTrans } from '../../..';\n\ndescribe('<IcuTrans />', () => {\n  describe('default namespace', () => {\n    it('standard usage', () => {\n      // <IcuTrans i18nKey=\"foo\" defaultTranslation=\"foo\" content={[]} />\n      expectTypeOf(IcuTrans).toBeCallableWith({\n        i18nKey: 'foo',\n        defaultTranslation: 'foo',\n        content: [],\n      });\n    });\n\n    it('should throw if key does not exist', () => {\n      expectTypeOf<React.ComponentProps<typeof IcuTrans>>()\n        .toHaveProperty('i18nKey')\n        .extract<'Nope'>()\n        // @ts-expect-error\n        .toMatchTypeOf<'Nope'>();\n    });\n\n    it('should work with content declaration', () => {\n      expectTypeOf(IcuTrans).toBeCallableWith({\n        i18nKey: 'foo',\n        defaultTranslation: 'Welcome <0>friend</0>!',\n        content: [{ type: 'strong', props: {} }],\n      });\n    });\n\n    it('should work with nested content declarations', () => {\n      expectTypeOf(IcuTrans).toBeCallableWith({\n        i18nKey: 'foo',\n        defaultTranslation: '<0><0>Item 1</0><1>Item 2</1></0>',\n        content: [\n          {\n            type: 'ul',\n            props: {\n              children: [\n                { type: 'li', props: {} },\n                { type: 'li', props: {} },\n              ],\n            },\n          },\n        ],\n      });\n    });\n  });\n\n  describe('named namespace', () => {\n    it('standard usage', () => {\n      // <IcuTrans ns=\"custom\" i18nKey=\"foo\" defaultTranslation=\"foo\" content={[]} />\n      expectTypeOf(IcuTrans).toBeCallableWith({\n        ns: 'custom',\n        i18nKey: 'foo',\n        defaultTranslation: 'foo',\n        content: [],\n      });\n    });\n\n    it('should throw if namespace does not exist', () => {\n      expectTypeOf<React.ComponentProps<typeof IcuTrans>>()\n        .toHaveProperty('ns')\n        .extract<'Nope'>()\n        // @ts-expect-error\n        .toMatchTypeOf<'Nope'>();\n    });\n  });\n\n  describe('array namespace', () => {\n    it('should work with array namespace', () => {\n      // <IcuTrans ns={['alternate', 'custom']} i18nKey=\"alternate:baz\" defaultTranslation=\"baz\" content={[]} />\n      expectTypeOf(IcuTrans).toBeCallableWith({\n        ns: ['alternate', 'custom'],\n        i18nKey: 'alternate:baz',\n        defaultTranslation: 'baz',\n        content: [],\n      });\n    });\n  });\n\n  describe('usage with `t` function', () => {\n    it('should work when providing `t` function', () => {\n      const { t } = useTranslation('alternate');\n\n      // <IcuTrans t={t} i18nKey=\"foobar.barfoo\" defaultTranslation=\"foo\" content={[]} />\n      expectTypeOf(IcuTrans).toBeCallableWith({\n        t,\n        i18nKey: 'foobar.barfoo',\n        defaultTranslation: 'foo',\n        content: [],\n      });\n    });\n\n    it('should work when providing `t` function with a prefix', () => {\n      const { t } = useTranslation('alternate', { keyPrefix: 'foobar.deep' });\n\n      // <IcuTrans t={t} i18nKey=\"deeper.deeeeeper\" defaultTranslation=\"foo\" content={[]} />\n      expectTypeOf<\n        typeof IcuTrans<'deeper.deeeeeper', 'alternate', 'foobar.deep'>\n      >().toBeCallableWith({\n        t,\n        i18nKey: 'deeper.deeeeeper',\n        defaultTranslation: 'foo',\n        content: [],\n      });\n    });\n\n    it('should throw error with `t` function with key prefix and wrong `i18nKey`', () => {\n      const { t } = useTranslation('alternate', { keyPrefix: 'foobar.deep' });\n\n      // <IcuTrans t={t} i18nKey=\"xxx\" defaultTranslation=\"foo\" content={[]} />\n      expectTypeOf<\n        typeof IcuTrans<'deeper.deeeeeper', 'alternate', 'foobar.deep'>\n      >().toBeCallableWith({\n        t,\n        // @ts-expect-error\n        i18nKey: 'xxx',\n        defaultTranslation: 'foo',\n        content: [],\n      });\n    });\n  });\n\n  describe('values prop', () => {\n    it('should work with values for ICU interpolation', () => {\n      expectTypeOf(IcuTrans).toBeCallableWith({\n        i18nKey: 'foo',\n        defaultTranslation: 'Hello {name}!',\n        content: [],\n        values: { name: 'World' },\n      });\n    });\n\n    it('should work with component and values', () => {\n      expectTypeOf(IcuTrans).toBeCallableWith({\n        i18nKey: 'foo',\n        defaultTranslation: 'Hello <0>{name}</0>!',\n        content: [{ type: 'strong', props: {} }],\n        values: { name: 'World' },\n      });\n    });\n  });\n\n  describe('component types', () => {\n    it('should work with string component type', () => {\n      expectTypeOf(IcuTrans).toBeCallableWith({\n        i18nKey: 'foo',\n        defaultTranslation: 'Click <0>here</0>',\n        content: [{ type: 'a', props: { href: '#' } }],\n      });\n    });\n\n    it('should work with React component type', () => {\n      const Link = ({ to, children }: { to: string; children: React.ReactNode }) => (\n        <a href={to}>{children}</a>\n      );\n\n      expectTypeOf(IcuTrans).toBeCallableWith({\n        i18nKey: 'foo',\n        defaultTranslation: 'Click <0>here</0>',\n        content: [{ type: Link, props: { to: '/path' } }],\n      });\n    });\n  });\n});\n"
  },
  {
    "path": "test/typescript/misc/IcuTransWithoutContext.test.tsx",
    "content": "import { describe, it, expectTypeOf } from 'vitest';\nimport * as React from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { IcuTransWithoutContext } from '../../../';\n\ndescribe('<IcuTransWithoutContext />', () => {\n  describe('default namespace', () => {\n    it('standard usage', () => {\n      // <IcuTransWithoutContext i18nKey=\"foo\" defaultTranslation=\"foo\" content={[]} />\n      expectTypeOf(IcuTransWithoutContext).toBeCallableWith({\n        i18nKey: 'foo',\n        defaultTranslation: 'foo',\n        content: [],\n      });\n    });\n\n    it('should throw if key does not exist', () => {\n      expectTypeOf<React.ComponentProps<typeof IcuTransWithoutContext>>()\n        .toHaveProperty('i18nKey')\n        .extract<'Nope'>()\n        // @ts-expect-error\n        .toMatchTypeOf<'Nope'>();\n    });\n  });\n\n  describe('named namespace', () => {\n    it('standard usage', () => {\n      // <IcuTransWithoutContext ns=\"custom\" i18nKey=\"foo\" defaultTranslation=\"foo\" content={[]} />\n      expectTypeOf(IcuTransWithoutContext).toBeCallableWith({\n        ns: 'custom',\n        i18nKey: 'foo',\n        defaultTranslation: 'foo',\n        content: [],\n      });\n    });\n\n    it('should throw if namespace does not exist', () => {\n      expectTypeOf<React.ComponentProps<typeof IcuTransWithoutContext>>()\n        .toHaveProperty('ns')\n        .extract<'Nope'>()\n        // @ts-expect-error\n        .toMatchTypeOf<'Nope'>();\n    });\n  });\n\n  describe('array namespace', () => {\n    it('should work with array namespace', () => {\n      // <IcuTransWithoutContext ns={['alternate', 'custom']} i18nKey=\"alternate:baz\" defaultTranslation=\"baz\" content={[]} />\n      expectTypeOf(IcuTransWithoutContext).toBeCallableWith({\n        ns: ['alternate', 'custom'],\n        i18nKey: 'alternate:baz',\n        defaultTranslation: 'baz',\n        content: [],\n      });\n    });\n  });\n\n  describe('usage with `t` function', () => {\n    it('should work when providing `t` function', () => {\n      const { t } = useTranslation('alternate');\n\n      // <IcuTransWithoutContext t={t} i18nKey=\"foobar.barfoo\" defaultTranslation=\"foo\" content={[]} />\n      expectTypeOf(IcuTransWithoutContext).toBeCallableWith({\n        t,\n        i18nKey: 'foobar.barfoo',\n        defaultTranslation: 'foo',\n        content: [],\n      });\n    });\n\n    it('should work when providing `t` function with a prefix', () => {\n      const { t } = useTranslation('alternate', { keyPrefix: 'foobar.deep' });\n\n      // <IcuTransWithoutContext t={t} i18nKey=\"deeper.deeeeeper\" defaultTranslation=\"foo\" content={[]} />\n      expectTypeOf<\n        typeof IcuTransWithoutContext<'deeper.deeeeeper', 'alternate', 'foobar.deep'>\n      >().toBeCallableWith({\n        t,\n        i18nKey: 'deeper.deeeeeper',\n        defaultTranslation: 'foo',\n        content: [],\n      });\n    });\n\n    it('should throw error with `t` function with key prefix and wrong `i18nKey`', () => {\n      const { t } = useTranslation('alternate', { keyPrefix: 'foobar.deep' });\n\n      // <IcuTransWithoutContext t={t} i18nKey=\"xxx\" defaultTranslation=\"foo\" content={[]} />\n      expectTypeOf<\n        typeof IcuTransWithoutContext<'deeper.deeeeeper', 'alternate', 'foobar.deep'>\n      >().toBeCallableWith({\n        t,\n        // @ts-expect-error\n        i18nKey: 'xxx',\n        defaultTranslation: 'foo',\n        content: [],\n      });\n    });\n  });\n\n  describe('values prop', () => {\n    it('should work with values for ICU interpolation', () => {\n      expectTypeOf(IcuTransWithoutContext).toBeCallableWith({\n        i18nKey: 'foo',\n        defaultTranslation: 'Hello {name}!',\n        content: [],\n        values: { name: 'World' },\n      });\n    });\n  });\n});\n"
  },
  {
    "path": "test/typescript/misc/Trans.test.tsx",
    "content": "import { assertType, describe, expectTypeOf, it } from 'vitest';\nimport * as React from 'react';\nimport { Trans, useTranslation } from 'react-i18next';\n\ndescribe('<Trans />', () => {\n  it('should work with string as `children`', () => {\n    expectTypeOf(Trans).toBeCallableWith({ children: 'Foo' });\n  });\n\n  it('should work with HTMLNode as children', () => {\n    expectTypeOf(Trans).toBeCallableWith({ children: <div /> });\n  });\n\n  describe('should work with `components`', () => {\n    it('inline', () => {\n      expectTypeOf(Trans).toBeCallableWith({\n        components: [<div />],\n        children: 'Foo',\n      });\n    });\n\n    it('inline const variable', () => {\n      const components = [<div />] as const;\n\n      expectTypeOf(Trans).toBeCallableWith({\n        components,\n        children: 'Foo',\n      });\n    });\n\n    it('JSX', () => {\n      expectTypeOf(Trans).toBeCallableWith({\n        components: {\n          Btn: <button />,\n        },\n        defaults: 'Hello <Btn />',\n      });\n    });\n\n    it('JSX.Element', () => {\n      function MyComponent() {\n        return <>world</>;\n      }\n\n      expectTypeOf(Trans).toBeCallableWith({\n        components: {\n          Btn: <MyComponent />,\n        },\n        defaults: 'Hello <Btn />',\n      });\n    });\n\n    it('object with JSX.Element', () => {\n      const components = {\n        Btn: <button />,\n      } as const;\n\n      expectTypeOf(Trans).toBeCallableWith({\n        components,\n        defaults: 'Hello <Btn />',\n      });\n    });\n  });\n\n  it('should work with `count`', () => {\n    expectTypeOf(Trans).toBeCallableWith({ count: 42, children: 'Foo' });\n  });\n\n  it('should work with `defaults`', () => {\n    expectTypeOf(Trans).toBeCallableWith({ defaults: 'defaults', children: 'Foo' });\n  });\n\n  it('should work with `i18n`', () => {\n    const { i18n } = useTranslation();\n    expectTypeOf(Trans).toBeCallableWith({ i18n, children: 'Foo' });\n  });\n\n  it('should work with `i18nKey`', () => {\n    expectTypeOf(Trans).toBeCallableWith({ i18nKey: 'i18nKey', children: 'Foo' });\n  });\n\n  it('should work with `ns`', () => {\n    expectTypeOf(Trans).toBeCallableWith({ ns: 'ns', children: 'Foo' });\n  });\n\n  it('should work with `parent`', () => {\n    expectTypeOf(Trans).toBeCallableWith({ parent: 'div', children: 'Foo' });\n\n    // No parent(overrides the default one)\n    expectTypeOf(Trans).toBeCallableWith({ parent: null, children: 'Foo' });\n\n    // Use a custom component as parent\n    const CustomRedComponent = (props: React.PropsWithChildren) => (\n      <div style={{ color: 'red' }}>{props.children}</div>\n    );\n    expectTypeOf(Trans).toBeCallableWith({ parent: CustomRedComponent, children: 'Foo' });\n\n    assertType<React.ReactElement>(\n      <Trans parent=\"div\" style={{ color: 'green' }}>\n        Foo\n      </Trans>,\n    );\n\n    /* div is the default parent */\n    assertType<React.ReactElement>(<Trans style={{ color: 'green' }}>Foo</Trans>);\n  });\n\n  it('should work with `tOptions`', () => {\n    expectTypeOf(Trans).toBeCallableWith({ tOptions: {}, children: 'Foo' });\n  });\n\n  it('should work with `values`', () => {\n    expectTypeOf(Trans).toBeCallableWith({ values: {}, children: 'Foo' });\n  });\n\n  it('should work with `t`', () => {\n    const { t } = useTranslation();\n    expectTypeOf(Trans).toBeCallableWith({ t, children: 'Foo' });\n  });\n\n  it('should work with extra div`t`', () => {\n    const { t } = useTranslation();\n    expectTypeOf(Trans).toBeCallableWith({ t, children: 'Foo' });\n  });\n\n  it('should not work with object child', () => {\n    assertType<React.ReactElement>(\n      <Trans>\n        {/* @ts-expect-error */}\n        <span>This {{ var: '' }} is an error since `allowObjectInHTMLChildren` is disabled</span>\n      </Trans>,\n    );\n  });\n});\n"
  },
  {
    "path": "test/typescript/misc/TransWithoutContext.test.tsx",
    "content": "import { describe, it, expectTypeOf } from 'vitest';\nimport * as React from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { Trans } from '../../../TransWithoutContext';\n\ndescribe('<Trans />', () => {\n  describe('default namespace', () => {\n    it('standard usage', () => {\n      // <Trans i18nKey=\"foo\">foo</Trans>\n      expectTypeOf(Trans).toBeCallableWith({\n        i18nKey: 'foo',\n      });\n    });\n\n    it('should trow if key do not exist', () => {\n      expectTypeOf<React.ComponentProps<typeof Trans>>()\n        .toHaveProperty('i18nKey')\n        .extract<'Nope'>()\n        // @ts-expect-error\n        .toMatchTypeOf<'Nope'>();\n    });\n  });\n\n  describe('named namespace', () => {\n    it('standard usage', () => {\n      // <Trans ns=\"custom\" i18nKey=\"foo\">foo</Trans>\n      expectTypeOf(Trans).toBeCallableWith({\n        ns: 'custom',\n        i18nKey: 'foo',\n      });\n    });\n\n    it('should trow if namespace do not exist', () => {\n      expectTypeOf<React.ComponentProps<typeof Trans>>()\n        .toHaveProperty('ns')\n        .extract<'Nope'>()\n        // @ts-expect-error\n        .toMatchTypeOf<'Nope'>();\n    });\n  });\n\n  describe('array namespace', () => {\n    it('should work with array namespace', () => {\n      // <Trans ns={['alternate', 'custom']} i18nKey={['alternate:baz', 'custom:bar']} />\n      expectTypeOf(Trans).toBeCallableWith({\n        ns: ['alternate', 'custom'],\n        i18nKey: ['alternate:baz', 'custom:bar'],\n      });\n    });\n  });\n\n  describe('usage with `t` function', () => {\n    it('should work when providing `t` function', () => {\n      const { t } = useTranslation('alternate');\n\n      // <Trans t={t} i18nKey=\"foobar.barfoo\">foo</Trans>\n      expectTypeOf(Trans).toBeCallableWith({\n        t,\n        i18nKey: 'foobar.barfoo',\n      });\n    });\n\n    it('should work when providing `t` function with a prefix', () => {\n      const { t } = useTranslation('alternate', { keyPrefix: 'foobar.deep' });\n\n      // <Trans t={t} i18nKey=\"deeper.deeeeeper\">foo</Trans>\n      expectTypeOf<\n        typeof Trans<'deeper.deeeeeper', 'alternate', {}, 'foobar.deep'>\n      >().toBeCallableWith({\n        t,\n        i18nKey: 'deeper.deeeeeper',\n      });\n    });\n\n    it('should throw error with `t` function with key prefix and wrong `i18nKey`', () => {\n      const { t } = useTranslation('alternate', { keyPrefix: 'foobar.deep' });\n\n      // <Trans t={t} i18nKey=\"xxx\">foo</Trans>\n      expectTypeOf<\n        typeof Trans<'deeper.deeeeeper', 'alternate', {}, 'foobar.deep'>\n      >().toBeCallableWith({\n        t,\n        // @ts-expect-error\n        i18nKey: 'xxx',\n      });\n    });\n  });\n\n  describe('interpolation', () => {\n    it('should work with text and interpolation', () => {\n      expectTypeOf(Trans).toBeCallableWith({\n        children: ['foo ', { var: '' }],\n      });\n    });\n  });\n});\n"
  },
  {
    "path": "test/typescript/misc/Translation.test.tsx",
    "content": "import { describe, expectTypeOf, it } from 'vitest';\nimport * as React from 'react';\nimport { Translation } from 'react-i18next';\nimport { TFunction, i18n } from 'i18next';\n\ndescribe('<Translation />', () => {\n  it('basic usage', () => {\n    expectTypeOf(Translation).toBeCallableWith({\n      children: (t) => t('key1'),\n    });\n  });\n\n  it('should provide `ready` in children function', () => {\n    // <Translation>\n    //   {(t, { i18n, lng }, ready) => <div>{ready ? t('key1') : 'default'}</div>}\n    // </Translation>\n    type CmpProps = React.ComponentProps<typeof Translation>;\n    expectTypeOf<CmpProps>().toHaveProperty('children').parameter(0).toMatchTypeOf<TFunction>();\n    expectTypeOf<CmpProps>()\n      .toHaveProperty('children')\n      .parameter(1)\n      .toEqualTypeOf<{ i18n: i18n; lng: string }>();\n    expectTypeOf<CmpProps>().toHaveProperty('children').parameter(2).toBeBoolean();\n  });\n\n  describe('should accept `ns` prop', () => {\n    it('as string', () => {\n      expectTypeOf(Translation).toBeCallableWith({\n        ns: 'foo',\n        children: (t) => t('key1'),\n      });\n    });\n\n    it('as array', () => {\n      expectTypeOf(Translation).toBeCallableWith({\n        ns: ['foo', 'bar'],\n        children: (t) => t('key1'),\n      });\n    });\n  });\n});\n"
  },
  {
    "path": "test/typescript/misc/context.test.tsx",
    "content": "import { it, expectTypeOf } from 'vitest';\nimport { useContext } from 'react';\nimport { i18n } from 'i18next';\nimport { I18nContext } from 'react-i18next';\n\nit('context', () => {\n  expectTypeOf(useContext(I18nContext)).toHaveProperty('i18n').toEqualTypeOf<i18n>();\n});\n"
  },
  {
    "path": "test/typescript/misc/tsconfig.json",
    "content": "{\n  \"extends\": \"../../../tsconfig.json\",\n  \"include\": [\"./**/*\"],\n  \"exclude\": []\n}\n"
  },
  {
    "path": "test/typescript/misc/tsconfig.nonEsModuleInterop.json",
    "content": "{\n  \"extends\": \"./tsconfig.json\",\n  \"compilerOptions\": {\n    // typescript defaults to these\n    \"esModuleInterop\": false,\n    \"allowSyntheticDefaultImports\": false\n  }\n}\n"
  },
  {
    "path": "test/typescript/misc/useSSR.test.tsx",
    "content": "import { it, expectTypeOf } from 'vitest';\nimport { useSSR } from 'react-i18next';\nimport { Resource } from 'i18next';\n\nit('useSSR', () => {\n  expectTypeOf(useSSR).parameter(0).toEqualTypeOf<Resource>();\n  expectTypeOf(useSSR).parameter(1).toEqualTypeOf<string>();\n\n  expectTypeOf(useSSR).returns.toBeVoid();\n});\n"
  },
  {
    "path": "test/typescript/misc/useTranslation.test.ts",
    "content": "import { describe, it, expectTypeOf } from 'vitest';\nimport { useTranslation } from 'react-i18next';\nimport { TFunction, i18n } from 'i18next';\n\ndescribe('useTranslation', () => {\n  it('should provide result with both object and array', () => {\n    const result = useTranslation();\n\n    expectTypeOf(result).toMatchTypeOf<[TFunction, i18n, boolean]>();\n    expectTypeOf(result).toHaveProperty('ready').toBeBoolean();\n    expectTypeOf(result).toHaveProperty('t').toBeFunction();\n    expectTypeOf(result).toHaveProperty('i18n').toBeObject();\n  });\n\n  describe('default namespace', () => {\n    it('should work with default namespace', () => {\n      const [t] = useTranslation();\n\n      expectTypeOf(t).toBeCallableWith('foo');\n    });\n\n    it('should work with default named namespace', () => {\n      const [t] = useTranslation('custom');\n\n      expectTypeOf(t).toBeCallableWith('bar');\n    });\n  });\n\n  describe('named namespace', () => {\n    it('should work with named namespace', () => {\n      const [t] = useTranslation('alternate');\n\n      expectTypeOf(t).toBeCallableWith('baz');\n    });\n  });\n\n  describe('namespace as array', () => {\n    it('should work with const namespaces', () => {\n      const [t] = useTranslation(['alternate', 'custom']);\n\n      expectTypeOf(t('alternate:baz')).toEqualTypeOf<string>();\n      expectTypeOf(t('baz', { ns: 'alternate' })).toEqualTypeOf<string>();\n      expectTypeOf(t('custom:foo')).toEqualTypeOf<string>();\n      expectTypeOf(t('foo', { ns: 'custom' })).toEqualTypeOf<string>();\n    });\n\n    it('should work with const namespaces', () => {\n      const namespaces = ['alternate', 'custom'] as const;\n      const [t] = useTranslation(namespaces);\n\n      expectTypeOf(t('alternate:baz')).toEqualTypeOf<string>();\n      expectTypeOf(t('baz', { ns: 'alternate' })).toEqualTypeOf<string>();\n      expectTypeOf(t('custom:foo')).toEqualTypeOf<string>();\n      expectTypeOf(t('foo', { ns: 'custom' })).toEqualTypeOf<string>();\n    });\n  });\n\n  describe('with `keyPrefix`', () => {\n    it('should provide string keys', () => {\n      const [t] = useTranslation('alternate', { keyPrefix: 'foobar' });\n\n      expectTypeOf(t('barfoo')).toEqualTypeOf<string>();\n    });\n\n    it('should work with deeper objects', () => {\n      const [t] = useTranslation('alternate', { keyPrefix: 'foobar.deep' });\n\n      expectTypeOf(t('deeper', { returnObjects: true })).toEqualTypeOf<\n        (string | object)[] | object\n      >();\n      expectTypeOf(t('deeper.deeeeeper')).toEqualTypeOf<string>();\n    });\n  });\n\n  it('should work with json format v4 plurals', () => {\n    const [t] = useTranslation('plurals');\n\n    expectTypeOf(t('foo')).toEqualTypeOf<string>();\n    expectTypeOf(t('foo_one')).toEqualTypeOf<string>();\n  });\n});\n"
  },
  {
    "path": "test/typescript/misc/withSSR.test.tsx",
    "content": "import { describe, expectTypeOf, it } from 'vitest';\nimport * as React from 'react';\nimport { withSSR } from 'react-i18next';\n\ndescribe('withSSR', () => {\n  describe('class component', () => {\n    it('without props', () => {\n      class ClassComponent extends React.Component {\n        render = () => null;\n      }\n\n      const ExtendedClass = withSSR()(ClassComponent);\n\n      // <ExtendedClass initialLanguage={'en'} initialI18nStore={{ en: { namespace: { key: 'value' } } }} />;\n      expectTypeOf(ExtendedClass).toBeCallableWith({\n        initialLanguage: 'en',\n        initialI18nStore: { en: { namespace: { key: 'value' } } },\n      });\n    });\n\n    it('with props', () => {\n      class ClassComponentWithProps extends React.Component<{ foo: number }> {\n        render = () => null;\n      }\n\n      const ExtendedClassWithProps = withSSR()(ClassComponentWithProps);\n\n      // <ExtendedClassWithProps\n      //   initialLanguage={'en'}\n      //   initialI18nStore={{ en: { namespace: { key: 'value' } } }}\n      //   foo={1}\n      // />;\n      expectTypeOf(ExtendedClassWithProps).toBeCallableWith({\n        initialLanguage: 'en',\n        initialI18nStore: { en: { namespace: { key: 'value' } } },\n        foo: 1,\n      });\n    });\n  });\n\n  describe('functional component', () => {\n    it('without props', () => {\n      const FunctionComponent: React.FunctionComponent = () => null;\n\n      const ExtendedFn = withSSR()(FunctionComponent);\n\n      // <ExtendedFn initialLanguage={'en'} initialI18nStore={{ en: { namespace: { key: 'value' } } }} />;\n      expectTypeOf(ExtendedFn).toBeCallableWith({\n        initialLanguage: 'en',\n        initialI18nStore: { en: { namespace: { key: 'value' } } },\n      });\n    });\n\n    it('with props', () => {\n      const FunctionComponentWithProps: React.FunctionComponent<{ foo: string }> = () => null;\n\n      const ExtendedFnWithProp = withSSR()(FunctionComponentWithProps);\n\n      // <ExtendedFnWithProp\n      //   initialLanguage={'en'}\n      //   initialI18nStore={{ en: { namespace: { key: 'value' } } }}\n      //   foo=\"bar\"\n      // />;\n      expectTypeOf(ExtendedFnWithProp).toBeCallableWith({\n        initialLanguage: 'en',\n        initialI18nStore: { en: { namespace: { key: 'value' } } },\n        foo: 'bar',\n      });\n    });\n  });\n});\n"
  },
  {
    "path": "test/typescript/misc/withTranslation.test.tsx",
    "content": "import { assertType, expectTypeOf, it } from 'vitest';\nimport * as React from 'react';\nimport { withTranslation, WithTranslation } from 'react-i18next';\nimport { TFunction, i18n } from 'i18next';\n\ndescribe('withTranslation', () => {\n  it('WithTranslation expose all information', () => {\n    expectTypeOf<WithTranslation>().toEqualTypeOf<{\n      t: TFunction;\n      i18n: i18n;\n      tReady: boolean;\n    }>();\n  });\n\n  interface MyComponentProps extends WithTranslation {\n    bar?: 'baz';\n  }\n  const MyComponent = (props: MyComponentProps): React.JSX.Element => {\n    return <h2>something {props.tReady}</h2>;\n  };\n\n  it('default usage', () => {\n    const ExtendedComponent = withTranslation()(MyComponent);\n    // <ExtendedComponent />\n    expectTypeOf(ExtendedComponent).toBeCallableWith({});\n    // <ExtendedComponent bar=\"baz\" />\n    expectTypeOf(ExtendedComponent).toBeCallableWith({\n      bar: 'baz',\n    });\n  });\n\n  /**\n   * @see https://react.i18next.com/latest/withtranslation-hoc#withtranslation-params\n   */\n  describe('with namespace', () => {\n    it('string', () => {\n      const ExtendedComponent = withTranslation('ns')(MyComponent);\n\n      // <ExtendedComponent />\n      expectTypeOf(ExtendedComponent).toBeCallableWith({});\n      // <ExtendedComponent bar=\"baz\" />\n      expectTypeOf(ExtendedComponent).toBeCallableWith({\n        bar: 'baz',\n      });\n    });\n\n    it('array', () => {\n      const ExtendedComponent = withTranslation(['ns', 'ns2'])(MyComponent);\n\n      // <ExtendedComponent />\n      expectTypeOf(ExtendedComponent).toBeCallableWith({});\n      // <ExtendedComponent bar=\"baz\" />\n      expectTypeOf(ExtendedComponent).toBeCallableWith({\n        bar: 'baz',\n      });\n    });\n  });\n\n  /**\n   * @see https://react.i18next.com/latest/withtranslation-hoc#overriding-the-i-18-next-instance\n   */\n  it('should work with i18n override', () => {\n    const ExtendedComponent = withTranslation('ns')(MyComponent);\n    expectTypeOf<React.ComponentProps<typeof ExtendedComponent>>()\n      .toHaveProperty('i18n')\n      .exclude<undefined>()\n      .toEqualTypeOf<i18n>();\n  });\n\n  /**\n   * @see https://react.i18next.com/latest/withtranslation-hoc#not-using-suspense\n   */\n  it('should work with `useSuspense`', () => {\n    const ExtendedComponent = withTranslation('ns')(MyComponent);\n    expectTypeOf<React.ComponentProps<typeof ExtendedComponent>>()\n      .toHaveProperty('useSuspense')\n      .exclude<undefined>()\n      .toEqualTypeOf<boolean>();\n  });\n\n  it('should work with namespace and `keyPrefix`', () => {\n    interface KeyPrefixComponentProps extends WithTranslation<'translation', 'deepPath'> {\n      bar?: 'baz';\n    }\n    const KeyPrefixComponent = (props: KeyPrefixComponentProps) => {\n      return <h2>{props.t('deepKey1')}</h2>;\n    };\n\n    const ExtendedComponent = withTranslation('translation', { keyPrefix: 'deepPath' })(\n      KeyPrefixComponent,\n    );\n\n    expectTypeOf(ExtendedComponent).toBeCallableWith({\n      bar: 'baz',\n    });\n  });\n});\n"
  },
  {
    "path": "test/typescript/selector-custom-types/IcuTrans.test.tsx",
    "content": "import { describe, it, expectTypeOf } from 'vitest';\nimport * as React from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { IcuTrans } from '../../..';\n\ndescribe('<IcuTrans />', () => {\n  describe('default namespace', () => {\n    it('standard usage', () => {\n      expectTypeOf(IcuTrans).toBeCallableWith({\n        i18nKey: 'foo',\n        defaultTranslation: 'foo',\n        content: [],\n      });\n    });\n\n    it('should throw if key does not exist', () => {\n      expectTypeOf<React.ComponentProps<typeof IcuTrans>>()\n        .toHaveProperty('i18nKey')\n        .extract<'Nope'>()\n        // @ts-expect-error\n        .toMatchTypeOf<'Nope'>();\n    });\n  });\n\n  describe('named namespace', () => {\n    it('standard usage', () => {\n      expectTypeOf(IcuTrans).toBeCallableWith({\n        ns: 'custom',\n        i18nKey: 'foo',\n        defaultTranslation: 'foo',\n        content: [],\n      });\n    });\n  });\n\n  describe('usage with `t` function', () => {\n    it('should work when providing `t` function', () => {\n      const { t } = useTranslation('alternate');\n\n      expectTypeOf(IcuTrans).toBeCallableWith({\n        t,\n        i18nKey: 'foobar.barfoo',\n        defaultTranslation: 'foo',\n        content: [],\n      });\n    });\n\n    it('should work when providing `t` function with a prefix', () => {\n      const { t } = useTranslation('alternate', { keyPrefix: 'foobar.deep' });\n\n      expectTypeOf<\n        typeof IcuTrans<'deeper.deeeeeper', 'alternate', 'foobar.deep'>\n      >().toBeCallableWith({\n        t,\n        i18nKey: 'deeper.deeeeeper',\n        defaultTranslation: 'foo',\n        content: [],\n      });\n    });\n  });\n\n  describe('values and content', () => {\n    it('should work with values', () => {\n      expectTypeOf(IcuTrans).toBeCallableWith({\n        i18nKey: 'foo',\n        defaultTranslation: 'Hello {name}!',\n        content: [],\n        values: { name: 'World' },\n      });\n    });\n\n    it('should work with content declaration', () => {\n      expectTypeOf(IcuTrans).toBeCallableWith({\n        i18nKey: 'foo',\n        defaultTranslation: 'Welcome <0>friend</0>!',\n        content: [{ type: 'strong', props: {} }],\n      });\n    });\n  });\n});\n"
  },
  {
    "path": "test/typescript/selector-custom-types/IcuTransWithoutContext.test.tsx",
    "content": "import { describe, it, expectTypeOf } from 'vitest';\nimport * as React from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { IcuTransWithoutContext } from '../../../';\n\ndescribe('<IcuTransWithoutContext />', () => {\n  describe('default namespace', () => {\n    it('standard usage', () => {\n      expectTypeOf(IcuTransWithoutContext).toBeCallableWith({\n        i18nKey: 'foo',\n        defaultTranslation: 'foo',\n        content: [],\n      });\n    });\n\n    it('should throw if key does not exist', () => {\n      expectTypeOf<React.ComponentProps<typeof IcuTransWithoutContext>>()\n        .toHaveProperty('i18nKey')\n        .extract<'Nope'>()\n        // @ts-expect-error\n        .toMatchTypeOf<'Nope'>();\n    });\n  });\n\n  describe('named namespace', () => {\n    it('standard usage', () => {\n      expectTypeOf(IcuTransWithoutContext).toBeCallableWith({\n        ns: 'custom',\n        i18nKey: 'foo',\n        defaultTranslation: 'foo',\n        content: [],\n      });\n    });\n  });\n\n  describe('usage with `t` function', () => {\n    it('should work when providing `t` function', () => {\n      const { t } = useTranslation('alternate');\n\n      expectTypeOf(IcuTransWithoutContext).toBeCallableWith({\n        t,\n        i18nKey: 'foobar.barfoo',\n        defaultTranslation: 'foo',\n        content: [],\n      });\n    });\n  });\n});\n"
  },
  {
    "path": "test/typescript/selector-custom-types/Trans.test.tsx",
    "content": "import { describe, it, expectTypeOf } from 'vitest';\nimport * as React from 'react';\nimport { Trans, useTranslation } from 'react-i18next';\n\ndescribe('<Trans />', () => {\n  describe('default namespace', () => {\n    it('standard usage', () => {\n      <Trans i18nKey={($) => (expectTypeOf($.foo).toMatchTypeOf<'foo'>, $.foo)} />;\n    });\n\n    it(`raises a TypeError given a key that doesn't exist`, () => {\n      // @ts-expect-error\n      <Trans i18nKey={($) => $.Nope} />;\n    });\n  });\n\n  describe('named namespace', () => {\n    it('standard usage', () => {\n      <Trans ns=\"custom\" i18nKey={($) => (expectTypeOf($.foo).toEqualTypeOf<'foo'>, $.foo)} />;\n    });\n\n    it(`raises a TypeError given a namespace that doesn't exist`, () => {\n      expectTypeOf<React.ComponentProps<typeof Trans>>()\n        .toHaveProperty('ns')\n        .extract<'Nope'>()\n        // @ts-expect-error\n        .toMatchTypeOf<'Nope'>();\n    });\n  });\n\n  describe('array namespace', () => {\n    it('should work with array namespace', () => (\n      <>\n        <Trans\n          ns={['alternate', 'custom']}\n          i18nKey={($) => (expectTypeOf($.baz).toEqualTypeOf<'baz'>(), $.baz)}\n        />\n        <Trans\n          ns={['alternate', 'custom']}\n          i18nKey={($) => (expectTypeOf($.alternate.baz).toEqualTypeOf<'baz'>(), $.baz)}\n        />\n        <Trans\n          ns={['alternate', 'custom']}\n          i18nKey={($) => (expectTypeOf($.custom.bar).toEqualTypeOf<'bar'>(), $.custom.bar)}\n        />\n        <Trans\n          ns={['custom', 'alternate']}\n          i18nKey={($) => (expectTypeOf($.alternate.baz).toEqualTypeOf<'baz'>(), $.alternate.baz)}\n        />\n        <Trans\n          ns={['custom', 'alternate']}\n          i18nKey={($) => (expectTypeOf($.bar).toEqualTypeOf<'bar'>(), $.bar)}\n        />\n        <Trans\n          ns={['custom', 'alternate']}\n          i18nKey={($) => (expectTypeOf($.custom.bar).toEqualTypeOf<'bar'>(), $.bar)}\n        />\n        <Trans\n          ns={['custom', 'alternate']}\n          i18nKey={($) => (\n            expectTypeOf($.alternate.foobar.deep.deeper.deeeeeper).toEqualTypeOf<'foobar'>(),\n            $.alternate.foobar.deep.deeper.deeeeeper\n          )}\n        />\n      </>\n    ));\n\n    it(`raises a TypeError given a key that's not present inside any namespace`, () => {\n      <>\n        {/* @ts-expect-error */}\n        <Trans ns={['alternate', 'custom']} i18nKey={($) => $.bar} />\n        {/* @ts-expect-error */}\n        <Trans ns={['alternate', 'custom']} i18nKey={($) => $.custom.baz} />\n      </>;\n    });\n  });\n\n  describe('usage with `t` function', () => {\n    it('should work when providing `t` function', () => {\n      const { t } = useTranslation('alternate');\n      <Trans\n        t={t}\n        i18nKey={($) => (expectTypeOf($.foobar.barfoo).toEqualTypeOf<'barfoo'>(), $.foobar.barfoo)}\n      />;\n    });\n\n    it('should work when providing `t` function with a prefix', () => {\n      const { t } = useTranslation('alternate', { keyPrefix: 'foobar.deep' });\n      <Trans\n        t={t}\n        i18nKey={($) => (\n          expectTypeOf($.deeper.deeeeeper).toEqualTypeOf<'foobar'>(),\n          $.deeper.deeeeeper\n        )}\n      />;\n    });\n\n    it('raises a TypeError given a key-prefixed `t` function and an invalid key', () => {\n      const { t } = useTranslation('alternate', { keyPrefix: 'foobar.deep' });\n      // @ts-expect-error\n      <Trans t={t} i18nKey={($) => $.xxx} />;\n    });\n  });\n\n  describe('interpolation', () => {\n    it('should work with text and interpolation', () => {\n      expectTypeOf(Trans).toBeCallableWith({\n        children: ['foo ', { var: '' }],\n      });\n    });\n\n    it('should work with Interpolation in HTMLElement', () => {\n      expectTypeOf(Trans).toBeCallableWith({\n        children: (\n          <>\n            foo <strong>{{ var: '' }}</strong>\n          </>\n        ),\n      });\n    });\n\n    it('should work with text and interpolation as children of an  HTMLElement', () => {\n      expectTypeOf(Trans).toBeCallableWith({\n        children: <span>foo {{ var: '' }}</span>,\n      });\n    });\n  });\n});\n"
  },
  {
    "path": "test/typescript/selector-custom-types/TransWithoutContext.test.tsx",
    "content": "import { describe, it, expectTypeOf, assertType } from 'vitest';\nimport * as React from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { Trans } from '../../../TransWithoutContext';\n\ndescribe('<Trans />', () => {\n  describe('default namespace', () => {\n    it('standard usage', () => {\n      <Trans i18nKey={($) => $.foo}>foo</Trans>;\n    });\n\n    it(\"raises a TypeError given a key that doesn't exist\", () => {\n      expectTypeOf<React.ComponentProps<typeof Trans>>()\n        .toHaveProperty('i18nKey')\n        .extract<'Nope'>()\n        // @ts-expect-error\n        .toMatchTypeOf<'Nope'>();\n    });\n  });\n\n  describe('named namespace', () => {\n    it('standard usage', () => {\n      <Trans ns=\"custom\" i18nKey={($) => $.foo}></Trans>;\n    });\n\n    it(\"raises a TypeError given a namespace that doesn't exist\", () => {\n      expectTypeOf<React.ComponentProps<typeof Trans>>()\n        .toHaveProperty('ns')\n        .extract<'Nope'>()\n        // @ts-expect-error\n        .toMatchTypeOf<'Nope'>();\n    });\n  });\n\n  describe('array namespace', () => {\n    it('should work with array namespace', () => (\n      <>\n        <Trans ns={['alternate', 'custom']} i18nKey={($) => $.baz} />\n        <Trans ns={['alternate', 'custom']} i18nKey={($) => $.custom.bar} />\n        <Trans ns={['alternate', 'custom']} i18nKey={($) => $.alternate.baz} />\n        <Trans ns={['custom', 'alternate']} i18nKey={($) => $.bar} />\n        <Trans ns={['custom', 'alternate']} i18nKey={($) => $.custom.bar} />\n        <Trans ns={['custom', 'alternate']} i18nKey={($) => $.alternate.baz} />\n      </>\n    ));\n\n    it('raises a TypeError given a key not present inside the current namespace', () => {\n      // @ts-expect-error\n      <Trans ns={['custom', 'alternate']} i18nKey={($) => $.baz} />;\n    });\n  });\n\n  describe('usage with `t` function', () => {\n    it('should work when providing `t` function', () => {\n      const { t } = useTranslation('alternate');\n\n      <Trans t={t} i18nKey={($) => $.foobar.barfoo}>\n        foo\n      </Trans>;\n    });\n\n    it('should work when providing `t` function with a prefix', () => {\n      const { t } = useTranslation('alternate', { keyPrefix: 'foobar.deep' });\n\n      <Trans t={t} i18nKey={($) => $.deeper.deeeeeper}>\n        foo\n      </Trans>;\n    });\n\n    it('raises a TypeError given a `t` function with key prefix when the key is invalid', () => {\n      const { t } = useTranslation('alternate', { keyPrefix: 'foobar.deep' });\n\n      // @ts-expect-error\n      <Trans t={t} i18nKey={($) => $.xxx}>\n        foo\n      </Trans>;\n    });\n  });\n\n  describe('interpolation', () => {\n    it('should work with text and interpolation', () => {\n      expectTypeOf(Trans).toBeCallableWith({\n        children: ['foo ', { var: '' }],\n      });\n    });\n\n    it('should work with Interpolation in HTMLElement', () => {\n      expectTypeOf(Trans).toBeCallableWith({\n        children: (\n          <>\n            foo <strong>{{ var: '' }}</strong>\n          </>\n        ),\n      });\n    });\n\n    it('should work with text and interpolation as children of an HTMLElement', () => {\n      expectTypeOf(Trans).toBeCallableWith({\n        children: <span>foo {{ var: '' }}</span>,\n      });\n    });\n  });\n\n  describe('usage with context', () => {\n    it('should work with default namespace', () => {\n      assertType<React.ReactElement>(<Trans i18nKey={($) => $.some} context=\"me\" />);\n    });\n\n    it('raises a TypeError when context is invalid', () => {\n      // @ts-expect-error\n      assertType<React.ReactElement>(<Trans i18nKey={($) => $.some} context=\"one\" />);\n    });\n\n    it('should work with `ns` prop', () => {\n      assertType<React.ReactElement>(<Trans ns=\"context\" i18nKey={($) => $.beverage} />);\n    });\n\n    it('raises a TypeError given a namespace when context is invalid', () => {\n      assertType<React.ReactElement>(\n        // @ts-expect-error\n        <Trans ns=\"context\" i18nKey={($) => $.beverage} context=\"strawberry\" />,\n      );\n    });\n\n    it('should work with default `t` function', () => {\n      const { t } = useTranslation();\n\n      assertType<React.ReactElement>(<Trans t={t} i18nKey={($) => $.some} context=\"me\" />);\n    });\n\n    it('raises a TypeError given a defaut `t` function when context is invalid', () => {\n      // @ts-expect-error should\n      assertType<React.ReactElement>(<Trans t={t} i18nKey={($) => $.some} context=\"Test1222\" />);\n    });\n\n    it('should work with custom `t` function', () => {\n      const { t } = useTranslation('context');\n\n      assertType<React.ReactElement>(<Trans t={t} i18nKey={($) => $.dessert} context=\"cake\" />);\n    });\n\n    it('raises a TypeError given a custom `t` function when context is invalid', () => {\n      // @ts-expect-error\n      assertType<React.ReactElement>(<Trans t={t} i18nKey=\"dessert\" context=\"sake\" />);\n    });\n\n    it('should work with `ns` prop and `count` prop', () => {\n      const { t } = useTranslation('plurals');\n      assertType<React.ReactElement>(<Trans ns=\"plurals\" i18nKey={($) => $.foo} count={2} />);\n    });\n\n    it('should work with custom `t` function and `count` prop', () => {\n      const { t } = useTranslation('plurals');\n      assertType<React.ReactElement>(<Trans t={t} i18nKey={($) => $.foo} count={2} />);\n    });\n  });\n});\n"
  },
  {
    "path": "test/typescript/selector-custom-types/Translation.test.tsx",
    "content": "import { describe, it, expectTypeOf } from 'vitest';\nimport { Translation } from 'react-i18next';\nimport React from 'react';\n\ndescribe('<Translation />', () => {\n  it('should work with default namespace', () => (\n    <Translation>{(t) => t(($) => $.foo)}</Translation>\n  ));\n\n  it('should work with named default namespace', () => (\n    <Translation ns=\"custom\">{(t) => t(($) => $.foo)}</Translation>\n  ));\n\n  it('should work with named namespace', () => (\n    <Translation ns=\"alternate\">{(t) => t(($) => $.baz)}</Translation>\n  ));\n\n  it('should work with namespace array', () => {\n    <Translation ns={['alternate', 'custom']}>\n      {(t) => `${t(($) => $.baz)} ${t(($) => $.custom.foo)}`}\n    </Translation>;\n  });\n\n  it(\"raises a TypeError given a namespace that doesn't exist\", () => {\n    // @ts-expect-error\n    <Translation>{(t) => t.fake}</Translation>;\n  });\n\n  it(\"raises a TypeError given a key that's not in the namespace\", () => {\n    // @ts-expect-error\n    <Translation ns=\"custom\">{(t) => t.fake}</Translation>;\n  });\n\n  it(\"raises a TypeError given a key that's not in the namespace (with namespace as prefix)\", () => {\n    // @ts-expect-error\n    <Translation ns=\"custom\">{(t) => t.custom.fake}</Translation>;\n  });\n});\n"
  },
  {
    "path": "test/typescript/selector-custom-types/i18next.d.ts",
    "content": "import 'i18next';\n\ndeclare module 'i18next' {\n  interface CustomTypeOptions {\n    defaultNS: 'custom';\n    allowObjectInHTMLChildren: true;\n    enableSelector: true;\n    resources: {\n      custom: {\n        foo: 'foo';\n        bar: 'bar';\n\n        some: 'some';\n        some_me: 'some context';\n      };\n\n      alternate: {\n        baz: 'baz';\n        foobar: {\n          barfoo: 'barfoo';\n          deep: {\n            deeper: {\n              deeeeeper: 'foobar';\n            };\n          };\n        };\n      };\n\n      plurals: {\n        foo_zero: 'foo';\n        foo_one: 'foo';\n        foo_two: 'foo';\n        foo_many: 'foo';\n        foo_other: 'foo';\n      };\n\n      context: {\n        dessert_cake: 'a nice cake';\n        dessert_muffin_one: 'a nice muffin';\n        dessert_muffin_other: '{{count}} nice muffins';\n\n        beverage: 'beverage';\n        beverage_beer: 'beer';\n      };\n    };\n  }\n}\n"
  },
  {
    "path": "test/typescript/selector-custom-types/tsconfig.json",
    "content": "{\n  \"extends\": \"../../../tsconfig.json\",\n  \"include\": [\"./**/*\"],\n  \"exclude\": []\n}\n"
  },
  {
    "path": "test/typescript/selector-custom-types/useTranslation.test.ts",
    "content": "import { describe, it, expectTypeOf, assertType } from 'vitest';\nimport { useTranslation } from 'react-i18next';\nimport { TFunction, i18n } from 'i18next';\n\ndescribe('useTranslation', () => {\n  it('should provide result with both object and array', () => {\n    const result = useTranslation();\n\n    expectTypeOf(result).toMatchTypeOf<[TFunction, i18n, boolean]>();\n    expectTypeOf(result).toHaveProperty('ready').toBeBoolean();\n    expectTypeOf(result).toHaveProperty('t').toBeFunction();\n    expectTypeOf(result).toHaveProperty('i18n').toBeObject();\n  });\n\n  describe('default namespace', () => {\n    it('should work with default namespace', () => {\n      const [t] = useTranslation();\n\n      expectTypeOf(t).toBeCallableWith(($) => $.foo);\n    });\n\n    it('should work with default named namespace', () => {\n      const [t] = useTranslation('custom');\n\n      expectTypeOf(t).toBeCallableWith(($) => $.bar);\n    });\n  });\n\n  describe('named namespace', () => {\n    it('should work with named namespace', () => {\n      const [t] = useTranslation('alternate');\n\n      expectTypeOf(t).toBeCallableWith(($) => $.baz);\n    });\n\n    it(`raises a TypeError given a namespace that doesn't exist`, () => {\n      // @ts-expect-error\n      useTranslation('fake');\n    });\n\n    it(`raises a TypeError given a key that's not in the namespace`, () => {\n      const [t] = useTranslation('custom');\n      // @ts-expect-error\n      assertType<string>(t(($) => $.fake));\n    });\n  });\n\n  describe('namespace as array', () => {\n    it('should work with const namespaces', () => {\n      const [t] = useTranslation(['alternate', 'custom']);\n\n      expectTypeOf(t(($) => $.baz)).toEqualTypeOf<'baz'>();\n      expectTypeOf(t(($) => $.baz, { ns: 'alternate' })).toEqualTypeOf<'baz'>();\n      expectTypeOf(t(($) => $.custom.foo)).toEqualTypeOf<'foo'>();\n      expectTypeOf(t(($) => $.foo, { ns: 'custom' })).toEqualTypeOf<'foo'>();\n    });\n\n    it('should work with const namespaces', () => {\n      const namespaces = ['alternate', 'custom'] as const;\n      const [t] = useTranslation(namespaces);\n\n      expectTypeOf(t(($) => $.baz)).toEqualTypeOf<'baz'>();\n      expectTypeOf(t(($) => $.baz, { ns: 'alternate' })).toEqualTypeOf<'baz'>();\n      expectTypeOf(t(($) => $.custom.foo)).toEqualTypeOf<'foo'>();\n      expectTypeOf(t(($) => $.foo, { ns: 'custom' })).toEqualTypeOf<'foo'>();\n    });\n\n    it('raises a TypeError given an incorrect key', () => {\n      const [t] = useTranslation(['custom']);\n      // @ts-expect-error\n      assertType<string>(t(($) => $.custom.fake));\n      // @ts-expect-error\n      assertType<string>(t(($) => $.fake, { ns: 'custom' }));\n    });\n  });\n\n  describe('with `keyPrefix`', () => {\n    it('should provide top-level string keys', () => {\n      const [t] = useTranslation('alternate', { keyPrefix: 'foobar' });\n\n      expectTypeOf(t(($) => $.barfoo)).toEqualTypeOf<'barfoo'>();\n    });\n\n    it('should work with deeper objects', () => {\n      const [t] = useTranslation('alternate', { keyPrefix: 'foobar.deep' });\n\n      expectTypeOf(t(($) => $.deeper, { returnObjects: true })).toEqualTypeOf<{\n        deeeeeper: 'foobar';\n      }>();\n      expectTypeOf(t(($) => $.deeper.deeeeeper)).toEqualTypeOf<'foobar'>();\n    });\n\n    it('raises a TypeError given an invalid key', () => {\n      const [t] = useTranslation('alternate', { keyPrefix: 'foobar' });\n      // @ts-expect-error\n      assertType<string>(t('abc'));\n    });\n  });\n\n  it('should work with json format v4 plurals', () => {\n    const [t] = useTranslation('plurals');\n\n    expectTypeOf(t(($) => $.foo, { count: 0 })).toEqualTypeOf<'foo'>();\n  });\n\n  it('raises a TypeError when attempting to select a pluralized key with a specific pluralized suffix', () => {\n    const [t] = useTranslation('plurals');\n\n    // @ts-expect-error\n    expectTypeOf(t(($) => $.foo_one)).toEqualTypeOf<'foo'>();\n  });\n});\n"
  },
  {
    "path": "test/typescript/selector-optimize/IcuTrans.test.tsx",
    "content": "import { describe, it, expectTypeOf } from 'vitest';\nimport * as React from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { IcuTrans } from '../../..';\n\ndescribe('<IcuTrans />', () => {\n  describe('default namespace', () => {\n    it('standard usage', () => {\n      expectTypeOf(IcuTrans).toBeCallableWith({\n        i18nKey: 'foo',\n        defaultTranslation: 'foo',\n        content: [],\n      });\n    });\n\n    it('should throw if key does not exist', () => {\n      expectTypeOf<React.ComponentProps<typeof IcuTrans>>()\n        .toHaveProperty('i18nKey')\n        .extract<'Nope'>()\n        // @ts-expect-error\n        .toMatchTypeOf<'Nope'>();\n    });\n  });\n\n  describe('named namespace', () => {\n    it('standard usage', () => {\n      expectTypeOf(IcuTrans).toBeCallableWith({\n        ns: 'custom',\n        i18nKey: 'foo',\n        defaultTranslation: 'foo',\n        content: [],\n      });\n    });\n  });\n\n  describe('usage with `t` function', () => {\n    it('should work when providing `t` function', () => {\n      const { t } = useTranslation('alternate');\n\n      expectTypeOf(IcuTrans).toBeCallableWith({\n        t,\n        i18nKey: 'foobar.barfoo',\n        defaultTranslation: 'foo',\n        content: [],\n      });\n    });\n\n    it('should work when providing `t` function with a prefix', () => {\n      const { t } = useTranslation('alternate', { keyPrefix: 'foobar.deep' });\n\n      expectTypeOf<\n        typeof IcuTrans<'deeper.deeeeeper', 'alternate', 'foobar.deep'>\n      >().toBeCallableWith({\n        t,\n        i18nKey: 'deeper.deeeeeper',\n        defaultTranslation: 'foo',\n        content: [],\n      });\n    });\n  });\n\n  describe('values and content', () => {\n    it('should work with values', () => {\n      expectTypeOf(IcuTrans).toBeCallableWith({\n        i18nKey: 'foo',\n        defaultTranslation: 'Hello {name}!',\n        content: [],\n        values: { name: 'World' },\n      });\n    });\n\n    it('should work with content declaration', () => {\n      expectTypeOf(IcuTrans).toBeCallableWith({\n        i18nKey: 'foo',\n        defaultTranslation: 'Welcome <0>friend</0>!',\n        content: [{ type: 'strong', props: {} }],\n      });\n    });\n  });\n});\n"
  },
  {
    "path": "test/typescript/selector-optimize/IcuTransWithoutContext.test.tsx",
    "content": "import { describe, it, expectTypeOf } from 'vitest';\nimport * as React from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { IcuTransWithoutContext } from '../../../';\n\ndescribe('<IcuTransWithoutContext />', () => {\n  describe('default namespace', () => {\n    it('standard usage', () => {\n      expectTypeOf(IcuTransWithoutContext).toBeCallableWith({\n        i18nKey: 'foo',\n        defaultTranslation: 'foo',\n        content: [],\n      });\n    });\n\n    it('should throw if key does not exist', () => {\n      expectTypeOf<React.ComponentProps<typeof IcuTransWithoutContext>>()\n        .toHaveProperty('i18nKey')\n        .extract<'Nope'>()\n        // @ts-expect-error\n        .toMatchTypeOf<'Nope'>();\n    });\n  });\n\n  describe('named namespace', () => {\n    it('standard usage', () => {\n      expectTypeOf(IcuTransWithoutContext).toBeCallableWith({\n        ns: 'custom',\n        i18nKey: 'foo',\n        defaultTranslation: 'foo',\n        content: [],\n      });\n    });\n  });\n\n  describe('usage with `t` function', () => {\n    it('should work when providing `t` function', () => {\n      const { t } = useTranslation('alternate');\n\n      expectTypeOf(IcuTransWithoutContext).toBeCallableWith({\n        t,\n        i18nKey: 'foobar.barfoo',\n        defaultTranslation: 'foo',\n        content: [],\n      });\n    });\n  });\n});\n"
  },
  {
    "path": "test/typescript/selector-optimize/Trans.test.tsx",
    "content": "import { describe, it, expectTypeOf } from 'vitest';\nimport * as React from 'react';\nimport { Trans, useTranslation } from 'react-i18next';\n\ndescribe('<Trans />', () => {\n  describe('default namespace', () => {\n    it('standard usage', () => {\n      <Trans i18nKey={($) => (expectTypeOf($.foo).toMatchTypeOf<'foo'>, $.foo)} />;\n    });\n\n    it(`raises a TypeError given a key that doesn't exist`, () => {\n      // @ts-expect-error\n      <Trans i18nKey={($) => $.Nope} />;\n    });\n  });\n\n  describe('named namespace', () => {\n    it('standard usage', () => {\n      <Trans ns=\"custom\" i18nKey={($) => (expectTypeOf($.foo).toEqualTypeOf<'foo'>, $.foo)} />;\n    });\n\n    it(`raises a TypeError given a namespace that doesn't exist`, () => {\n      expectTypeOf<React.ComponentProps<typeof Trans>>()\n        .toHaveProperty('ns')\n        .extract<'Nope'>()\n        // @ts-expect-error\n        .toMatchTypeOf<'Nope'>();\n    });\n  });\n\n  describe('array namespace', () => {\n    it('should work with array namespace', () => (\n      <>\n        <Trans\n          ns={['alternate', 'custom']}\n          i18nKey={($) => (expectTypeOf($.baz).toEqualTypeOf<'baz'>(), $.baz)}\n        />\n        <Trans\n          ns={['alternate', 'custom']}\n          i18nKey={($) => (expectTypeOf($.alternate.baz).toEqualTypeOf<'baz'>(), $.baz)}\n        />\n        <Trans\n          ns={['alternate', 'custom']}\n          i18nKey={($) => (expectTypeOf($.custom.bar).toEqualTypeOf<'bar'>(), $.custom.bar)}\n        />\n        <Trans\n          ns={['custom', 'alternate']}\n          i18nKey={($) => (expectTypeOf($.alternate.baz).toEqualTypeOf<'baz'>(), $.alternate.baz)}\n        />\n        <Trans\n          ns={['custom', 'alternate']}\n          i18nKey={($) => (expectTypeOf($.bar).toEqualTypeOf<'bar'>(), $.bar)}\n        />\n        <Trans\n          ns={['custom', 'alternate']}\n          i18nKey={($) => (expectTypeOf($.custom.bar).toEqualTypeOf<'bar'>(), $.bar)}\n        />\n        <Trans\n          ns={['custom', 'alternate']}\n          i18nKey={($) => (\n            expectTypeOf($.alternate.foobar.deep.deeper.deeeeeper).toEqualTypeOf<'foobar'>(),\n            $.alternate.foobar.deep.deeper.deeeeeper\n          )}\n        />\n      </>\n    ));\n\n    it(`raises a TypeError given a key that's not present inside any namespace`, () => {\n      // @ts-expect-error\n      <Trans ns={['alternate', 'custom']} i18nKey={($) => $.bar} />;\n      // @ts-expect-error\n      <Trans ns={['alternate', 'custom']} i18nKey={($) => $.custom.baz} />;\n    });\n  });\n\n  describe('usage with `t` function', () => {\n    it('should work when providing `t` function', () => {\n      const { t } = useTranslation('alternate');\n      <Trans\n        t={t}\n        i18nKey={($) => (expectTypeOf($.foobar.barfoo).toEqualTypeOf<'barfoo'>(), $.foobar.barfoo)}\n      />;\n    });\n\n    it('should work when providing `t` function with a prefix', () => {\n      const { t } = useTranslation('alternate', { keyPrefix: 'foobar.deep' });\n      <Trans\n        t={t}\n        i18nKey={($) => (\n          expectTypeOf($.deeper.deeeeeper).toEqualTypeOf<'foobar'>(),\n          $.deeper.deeeeeper\n        )}\n      />;\n    });\n\n    it('raises a TypeError given a key-prefixed `t` function and an invalid key', () => {\n      const { t } = useTranslation('alternate', { keyPrefix: 'foobar.deep' });\n      // @ts-expect-error\n      <Trans t={t} i18nKey={($) => $.xxx} />;\n    });\n  });\n\n  describe('interpolation', () => {\n    it('should work with text and interpolation', () => {\n      expectTypeOf(Trans).toBeCallableWith({\n        children: ['foo ', { var: '' }],\n      });\n    });\n\n    it('should work with Interpolation in HTMLElement', () => {\n      expectTypeOf(Trans).toBeCallableWith({\n        children: (\n          <>\n            foo <strong>{{ var: '' }}</strong>\n          </>\n        ),\n      });\n    });\n\n    it('should work with text and interpolation as children of an  HTMLElement', () => {\n      expectTypeOf(Trans).toBeCallableWith({\n        children: <span>foo {{ var: '' }}</span>,\n      });\n    });\n  });\n});\n"
  },
  {
    "path": "test/typescript/selector-optimize/TransWithoutContext.test.tsx",
    "content": "import { describe, it, expectTypeOf, assertType } from 'vitest';\nimport * as React from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { Trans } from '../../../TransWithoutContext';\n\ndescribe('<Trans />', () => {\n  describe('default namespace', () => {\n    it('standard usage', () => {\n      <Trans i18nKey={($) => $.foo}>foo</Trans>;\n    });\n\n    it(\"raises a TypeError given a key that doesn't exist\", () => {\n      expectTypeOf<React.ComponentProps<typeof Trans>>()\n        .toHaveProperty('i18nKey')\n        .extract<'Nope'>()\n        // @ts-expect-error\n        .toMatchTypeOf<'Nope'>();\n    });\n  });\n\n  describe('named namespace', () => {\n    it('standard usage', () => {\n      <Trans ns=\"custom\" i18nKey={($) => $.foo}></Trans>;\n    });\n\n    it(\"raises a TypeError given a namespace that doesn't exist\", () => {\n      expectTypeOf<React.ComponentProps<typeof Trans>>()\n        .toHaveProperty('ns')\n        .extract<'Nope'>()\n        // @ts-expect-error\n        .toMatchTypeOf<'Nope'>();\n    });\n  });\n\n  describe('array namespace', () => {\n    it('should work with array namespace', () => (\n      <>\n        <Trans ns={['alternate', 'custom']} i18nKey={($) => $.baz} />\n        <Trans ns={['alternate', 'custom']} i18nKey={($) => $.custom.bar} />\n        <Trans ns={['alternate', 'custom']} i18nKey={($) => $.alternate.baz} />\n        <Trans ns={['custom', 'alternate']} i18nKey={($) => $.bar} />\n        <Trans ns={['custom', 'alternate']} i18nKey={($) => $.custom.bar} />\n        <Trans ns={['custom', 'alternate']} i18nKey={($) => $.alternate.baz} />\n      </>\n    ));\n\n    it('raises a TypeError given a key not present inside the current namespace', () => {\n      // @ts-expect-error\n      <Trans ns={['custom', 'alternate']} i18nKey={($) => $.baz} />;\n    });\n  });\n\n  describe('usage with `t` function', () => {\n    it('should work when providing `t` function', () => {\n      const { t } = useTranslation('alternate');\n\n      <Trans t={t} i18nKey={($) => $.foobar.barfoo}>\n        foo\n      </Trans>;\n    });\n\n    it('should work when providing `t` function with a prefix', () => {\n      const { t } = useTranslation('alternate', { keyPrefix: 'foobar.deep' });\n\n      <Trans t={t} i18nKey={($) => $.deeper.deeeeeper}>\n        foo\n      </Trans>;\n    });\n\n    it('raises a TypeError given a `t` function with key prefix when the key is invalid', () => {\n      const { t } = useTranslation('alternate', { keyPrefix: 'foobar.deep' });\n\n      // @ts-expect-error\n      <Trans t={t} i18nKey={($) => $.xxx}>\n        foo\n      </Trans>;\n    });\n  });\n\n  describe('interpolation', () => {\n    it('should work with text and interpolation', () => {\n      expectTypeOf(Trans).toBeCallableWith({\n        children: ['foo ', { var: '' }],\n      });\n    });\n\n    it('should work with Interpolation in HTMLElement', () => {\n      expectTypeOf(Trans).toBeCallableWith({\n        children: (\n          <>\n            foo <strong>{{ var: '' }}</strong>\n          </>\n        ),\n      });\n    });\n\n    it('should work with text and interpolation as children of an HTMLElement', () => {\n      expectTypeOf(Trans).toBeCallableWith({\n        children: <span>foo {{ var: '' }}</span>,\n      });\n    });\n  });\n\n  describe('usage with context', () => {\n    it('should work with default namespace', () => {\n      assertType<React.ReactElement>(<Trans i18nKey={($) => $.some} context=\"me\" />);\n    });\n\n    it('should work with `ns` prop', () => {\n      assertType<React.ReactElement>(<Trans ns=\"context\" i18nKey={($) => $.beverage} />);\n    });\n\n    it('should work with default `t` function', () => {\n      const { t } = useTranslation();\n\n      assertType<React.ReactElement>(<Trans t={t} i18nKey={($) => $.some} context=\"me\" />);\n    });\n\n    it('raises a TypeError given a default `t` function when context is invalid', () => {\n      // @ts-expect-error should\n      assertType<React.ReactElement>(<Trans t={t} i18nKey={($) => $.some} context=\"Test1222\" />);\n    });\n\n    it('should work with custom `t` function', () => {\n      const { t } = useTranslation('context');\n\n      assertType<React.ReactElement>(<Trans t={t} i18nKey={($) => $.dessert_cake} />);\n    });\n\n    it('raises a TypeError given a custom `t` function when context is invalid', () => {\n      // @ts-expect-error\n      assertType<React.ReactElement>(<Trans t={t} i18nKey=\"dessert\" context=\"sake\" />);\n    });\n  });\n});\n"
  },
  {
    "path": "test/typescript/selector-optimize/Translation.test.tsx",
    "content": "import { describe, it, expectTypeOf } from 'vitest';\nimport { Translation } from 'react-i18next';\nimport React from 'react';\n\ndescribe('<Translation />', () => {\n  it('should work with default namespace', () => (\n    <Translation>{(t) => t(($) => $.foo)}</Translation>\n  ));\n\n  it('should work with named default namespace', () => (\n    <Translation ns=\"custom\">{(t) => t(($) => $.foo)}</Translation>\n  ));\n\n  it('should work with named namespace', () => (\n    <Translation ns=\"alternate\">{(t) => t(($) => $.baz)}</Translation>\n  ));\n\n  it('should work with namespace array', () => {\n    <Translation ns={['alternate', 'custom']}>\n      {(t) => `${t(($) => $.baz)} ${t(($) => $.custom.foo)}`}\n    </Translation>;\n  });\n\n  it(\"raises a TypeError given a namespace that doesn't exist\", () => {\n    // @ts-expect-error\n    <Translation>{(t) => t.fake}</Translation>;\n  });\n\n  it(\"raises a TypeError given a key that's not in the namespace\", () => {\n    // @ts-expect-error\n    <Translation ns=\"custom\">{(t) => t.fake}</Translation>;\n  });\n\n  it(\"raises a TypeError given a key that's not in the namespace (with namespace as prefix)\", () => {\n    // @ts-expect-error\n    <Translation ns=\"custom\">{(t) => t.custom.fake}</Translation>;\n  });\n});\n"
  },
  {
    "path": "test/typescript/selector-optimize/i18next.d.ts",
    "content": "import 'i18next';\n\ndeclare module 'i18next' {\n  interface CustomTypeOptions {\n    defaultNS: 'custom';\n    allowObjectInHTMLChildren: true;\n    enableSelector: 'optimize';\n    resources: {\n      custom: {\n        foo: 'foo';\n        bar: 'bar';\n\n        some: 'some';\n        some_me: 'some context';\n      };\n\n      alternate: {\n        baz: 'baz';\n        foobar: {\n          barfoo: 'barfoo';\n          deep: {\n            deeper: {\n              deeeeeper: 'foobar';\n            };\n          };\n        };\n      };\n\n      context: {\n        dessert_cake: 'a nice cake';\n        dessert_muffin_one: 'a nice muffin';\n        dessert_muffin_other: '{{count}} nice muffins';\n\n        beverage: 'beverage';\n        beverage_beer: 'beer';\n      };\n    };\n  }\n}\n"
  },
  {
    "path": "test/typescript/selector-optimize/tsconfig.json",
    "content": "{\n  \"extends\": \"../../../tsconfig.json\",\n  \"include\": [\"./**/*\"],\n  \"exclude\": []\n}\n"
  },
  {
    "path": "test/typescript/selector-optimize/useTranslation.test.ts",
    "content": "import { describe, it, expectTypeOf, assertType } from 'vitest';\nimport { useTranslation } from 'react-i18next';\nimport { TFunction, i18n } from 'i18next';\n\ndescribe('useTranslation', () => {\n  it('should provide result with both object and array', () => {\n    const result = useTranslation();\n\n    expectTypeOf(result).toMatchTypeOf<[TFunction, i18n, boolean]>();\n    expectTypeOf(result).toHaveProperty('ready').toBeBoolean();\n    expectTypeOf(result).toHaveProperty('t').toBeFunction();\n    expectTypeOf(result).toHaveProperty('i18n').toBeObject();\n  });\n\n  describe('default namespace', () => {\n    it('should work with default namespace', () => {\n      const [t] = useTranslation();\n\n      expectTypeOf(t).toBeCallableWith(($) => $.foo);\n    });\n\n    it('should work with default named namespace', () => {\n      const [t] = useTranslation('custom');\n\n      expectTypeOf(t).toBeCallableWith(($) => $.bar);\n    });\n  });\n\n  describe('named namespace', () => {\n    it('should work with named namespace', () => {\n      const [t] = useTranslation('alternate');\n\n      expectTypeOf(t).toBeCallableWith(($) => $.baz);\n    });\n\n    it(`raises a TypeError given a namespace that doesn't exist`, () => {\n      // @ts-expect-error\n      useTranslation('fake');\n    });\n\n    it(`raises a TypeError given a key that's not in the namespace`, () => {\n      const [t] = useTranslation('custom');\n      // @ts-expect-error\n      assertType<string>(t(($) => $.fake));\n    });\n  });\n\n  describe('namespace as array', () => {\n    it('should work with const namespaces', () => {\n      const [t] = useTranslation(['alternate', 'custom']);\n\n      expectTypeOf(t(($) => $.baz)).toEqualTypeOf<'baz'>();\n      expectTypeOf(t(($) => $.baz, { ns: 'alternate' })).toEqualTypeOf<'baz'>();\n      expectTypeOf(t(($) => $.custom.foo)).toEqualTypeOf<'foo'>();\n      expectTypeOf(t(($) => $.foo, { ns: 'custom' })).toEqualTypeOf<'foo'>();\n    });\n\n    it('should work with const namespaces', () => {\n      const namespaces = ['alternate', 'custom'] as const;\n      const [t] = useTranslation(namespaces);\n\n      expectTypeOf(t(($) => $.baz)).toEqualTypeOf<'baz'>();\n      expectTypeOf(t(($) => $.baz, { ns: 'alternate' })).toEqualTypeOf<'baz'>();\n      expectTypeOf(t(($) => $.custom.foo)).toEqualTypeOf<'foo'>();\n      expectTypeOf(t(($) => $.foo, { ns: 'custom' })).toEqualTypeOf<'foo'>();\n    });\n\n    it('raises a TypeError given an incorrect key', () => {\n      const [t] = useTranslation(['custom']);\n      // @ts-expect-error\n      assertType<string>(t(($) => $.custom.fake));\n      // @ts-expect-error\n      assertType<string>(t(($) => $.fake, { ns: 'custom' }));\n    });\n  });\n\n  describe('with `keyPrefix`', () => {\n    it('should provide top-level string keys', () => {\n      const [t] = useTranslation('alternate', { keyPrefix: 'foobar' });\n\n      expectTypeOf(t(($) => $.barfoo)).toEqualTypeOf<'barfoo'>();\n    });\n\n    it('should work with deeper objects', () => {\n      const [t] = useTranslation('alternate', { keyPrefix: 'foobar.deep' });\n\n      expectTypeOf(t(($) => $.deeper, { returnObjects: true })).toEqualTypeOf<{\n        deeeeeper: 'foobar';\n      }>();\n      expectTypeOf(t(($) => $.deeper.deeeeeper)).toEqualTypeOf<'foobar'>();\n    });\n\n    it('raises a TypeError given an invalid key', () => {\n      const [t] = useTranslation('alternate', { keyPrefix: 'foobar' });\n      // @ts-expect-error\n      assertType<string>(t(($) => $.abc));\n      t(($) => $.barfoo);\n    });\n  });\n});\n"
  },
  {
    "path": "test/unescape.spec.js",
    "content": "import { describe, it, expect } from 'vitest';\nimport { unescape } from '../src/unescape';\n\ndescribe('unescape', () => {\n  /** @type {[string, string]} */\n  const testCases = [\n    ['&amp;', '&'],\n    ['&#38;', '&'],\n    ['&lt;', '<'],\n    ['&#60;', '<'],\n    ['&gt;', '>'],\n    ['&#62;', '>'],\n    ['&apos;', \"'\"],\n    ['&#39;', \"'\"],\n    ['&quot;', '\"'],\n    ['&#34;', '\"'],\n    ['&nbsp;', ' '],\n    ['&#160;', ' '],\n    ['&copy;', '©'],\n    ['&#169;', '©'],\n    ['&reg;', '®'],\n    ['&#174;', '®'],\n    ['&hellip;', '…'],\n    ['&#8230;', '…'],\n    ['&#x2F;', '/'],\n    ['&#47;', '/'],\n  ];\n\n  testCases.forEach(([value, expected]) => {\n    it(`should unescape \"${value}\" to \"${expected}\"`, () => {\n      expect(unescape(value)).toStrictEqual(expected);\n    });\n  });\n\n  it('should unescape long strings', () => {\n    expect(unescape(testCases.map((test) => test[0]).join(' '))).toStrictEqual(\n      testCases.map((test) => test[1]).join(' '),\n    );\n  });\n});\n"
  },
  {
    "path": "test/useSSR.spec.js",
    "content": "import { describe, it, vitest, beforeAll, afterAll, expect } from 'vitest';\nimport { renderHook } from '@testing-library/react';\nimport i18n from './i18n';\nimport { setI18n } from '../src/context';\nimport { useSSR } from '../src/useSSR';\n\nvitest.unmock('../src/useSSR');\n\ndescribe('useSSR', () => {\n  const mockI18n = {\n    language: 'en',\n    languages: ['en'],\n    options: {\n      ns: [],\n      defaultNS: 'defaultNS',\n      nsMode: 'fallback',\n    },\n    services: {\n      resourceStore: {\n        data: {},\n      },\n      backendConnector: {},\n    },\n    isInitialized: true,\n    changeLanguage: (lng) => {\n      mockI18n.language = lng;\n    },\n    getFixedT: () => (message) => message,\n    hasResourceBundle: (lng, ns) => ns === 'alreadyLoadedNS',\n    loadNamespaces: () => {},\n  };\n\n  beforeAll(() => {\n    setI18n(mockI18n);\n  });\n\n  afterAll(() => {\n    setI18n(i18n);\n  });\n\n  it('should set values', () => {\n    renderHook(() => useSSR({ foo: 'bar' }, 'de'));\n    expect(mockI18n.language).toBe('de');\n    expect(mockI18n.services.resourceStore.data).toEqual({ foo: 'bar' });\n  });\n\n  it('should not crash and warn when i18n is not available', () => {\n    setI18n(undefined);\n    const warnSpy = vitest.spyOn(console, 'warn').mockImplementation(() => {});\n    expect(() => {\n      renderHook(() => useSSR({ foo: 'bar' }, 'en'));\n    }).not.toThrow();\n    expect(warnSpy).toHaveBeenCalledWith(\n      expect.stringContaining('useSSR'),\n      expect.objectContaining({ code: 'NO_I18NEXT_INSTANCE' }),\n    );\n    warnSpy.mockRestore();\n    setI18n(mockI18n);\n  });\n\n  it('should not crash and warn when i18n exists but is not initialized', () => {\n    const uninitializedI18n = {\n      options: {},\n      services: {},\n    };\n    setI18n(uninitializedI18n);\n    const warnSpy = vitest.spyOn(console, 'warn').mockImplementation(() => {});\n    expect(() => {\n      renderHook(() => useSSR({ foo: 'bar' }, 'en'));\n    }).not.toThrow();\n    expect(warnSpy).toHaveBeenCalledWith(\n      expect.stringContaining('useSSR'),\n      expect.objectContaining({ code: 'I18N_NOT_INITIALIZED' }),\n    );\n    warnSpy.mockRestore();\n    setI18n(mockI18n);\n  });\n});\n"
  },
  {
    "path": "test/useTranslation.advanced.spec.js",
    "content": "import { describe, it, vitest, expect, afterEach } from 'vitest';\nimport { renderHook, cleanup, waitFor } from '@testing-library/react';\nimport { useTranslation } from '../src/useTranslation';\n\nvitest.unmock('../src/useTranslation');\n\n// A mock i18n instance for consistent testing\nconst createMockI18n = (isInitialized = true) => ({\n  language: 'en',\n  languages: ['en'],\n  isInitialized,\n  reportNamespaces: {\n    addUsedNamespaces: vitest.fn(),\n    getUsedNamespaces: vitest.fn(),\n  },\n  services: {\n    resourceStore: {\n      data: {\n        en: {\n          translation: { key: 'translated_key' },\n        },\n      },\n    },\n  },\n  getFixedT: (lng, ns, keyPrefix) => (key) => {\n    const prefixedKey = keyPrefix ? `${keyPrefix}.${key}` : key;\n    return (\n      (lng === 'en' && ns === 'translation' && prefixedKey === 'key' && 'translated_key') ||\n      prefixedKey\n    );\n  },\n  hasLoadedNamespace(ns, options) {\n    return options?.lng\n      ? !!this.services.resourceStore.data[options.lng]?.[ns]\n      : !!this.services.resourceStore.data.en?.[ns];\n  },\n  loadNamespaces: vitest.fn((ns, cb) => cb()), // Default to immediate load\n  on: vitest.fn(),\n  off: vitest.fn(),\n  options: {},\n});\n\ndescribe('useTranslation mounting and re-render', () => {\n  afterEach(() => {\n    cleanup();\n  });\n\n  /**\n   * This test verifies the fix for the React Rules of Hooks violation.\n   * It starts with no i18n instance and then provides one on a subsequent render.\n   * The hook should handle this gracefully without crashing.\n   */\n  it('should handle i18n instance becoming available after initial mount', () => {\n    const mockI18n = createMockI18n();\n    const { result, rerender } = renderHook(({ i18n }) => useTranslation('translation', { i18n }), {\n      initialProps: { i18n: undefined },\n    });\n\n    // 1. Initial render without i18n\n    expect(result.current.ready).toBe(false);\n    expect(result.current.t('key')).toBe('key');\n    expect(result.current.i18n).toEqual({});\n\n    // 2. Re-render with i18n instance provided\n    rerender({ i18n: mockI18n });\n\n    // 3. Hook should now be ready and functional\n    expect(result.current.ready).toBe(true);\n    expect(result.current.t('key')).toBe('translated_key');\n    // expect(result.current.i18n).toBe(mockI18n);\n    expect(result.current.i18n.__original).toBe(mockI18n);\n  });\n\n  /**\n   * This test verifies the fix for the state inconsistency bug.\n   * It ensures that at the exact moment `ready` becomes `true`, the `t` function\n   * is the correct, working translation function, not a stale fallback.\n   */\n  it('should ensure t function is correct as soon as ready is true', async () => {\n    const mockI18n = createMockI18n(false); // Start as not initialized\n    let loadNamespacesCallback;\n    mockI18n.loadNamespaces.mockImplementation((ns, cb) => {\n      loadNamespacesCallback = cb; // Capture the callback to trigger it manually\n    });\n\n    const { result } = renderHook(() =>\n      useTranslation('translation', { i18n: mockI18n, useSuspense: false }),\n    );\n\n    // Initially, we are not ready\n    expect(result.current.ready).toBe(false);\n\n    // Simulate the end of the initialization and namespace loading\n    mockI18n.isInitialized = true;\n    loadNamespacesCallback(); // This triggers the state update inside the hook\n\n    // Wait for the hook to re-render and report readiness.\n    await waitFor(() => {\n      expect(result.current.ready).toBe(true);\n    });\n\n    // Then, immediately check if `t` works after readiness is confirmed.\n    expect(result.current.t('key')).toBe('translated_key');\n  });\n\n  /**\n   * This test verifies the stability fixes.\n   * It ensures that the returned `t` function and the result object itself\n   * are stable across re-renders when nothing has changed, preventing\n   * unnecessary re-renders in memoized child components.\n   */\n  it('should return stable t function and result object across re-renders', () => {\n    const mockI18n = createMockI18n();\n    const { result, rerender } = renderHook(() =>\n      useTranslation('translation', { i18n: mockI18n }),\n    );\n\n    const initialResult = result.current;\n    const initialT = result.current.t;\n\n    // Re-render without changing any props\n    rerender();\n\n    // Assert that the function and result object instances are the same\n    expect(result.current.t).toBe(initialT);\n    expect(result.current).toBe(initialResult);\n  });\n});\n"
  },
  {
    "path": "test/useTranslation.bindI18nStore.spec.jsx",
    "content": "import { describe, it, expect } from 'vitest';\nimport React from 'react';\nimport { act, render, screen } from '@testing-library/react';\nimport { createInstance } from 'i18next';\nimport { useTranslation } from '../src/useTranslation';\nimport { I18nextProvider } from '../src/I18nextProvider';\n\ndescribe('useTranslation with bindI18nStore', () => {\n  it('should correctly return the correct translation', async () => {\n    const i18next = createInstance();\n    await i18next.init({\n      fallbackLng: ['en'],\n      react: { bindI18nStore: 'added' },\n    });\n    function TranslateAKey() {\n      const { t } = useTranslation();\n      return <h1>{t('key', { ns: 'namespace' })}</h1>;\n    }\n    i18next.addResourceBundle('en', 'namespace', { key: 'english' }, false, true);\n    render(\n      <I18nextProvider i18n={i18next}>\n        <TranslateAKey />\n      </I18nextProvider>,\n    );\n    expect(screen.getByRole('heading')).toHaveTextContent('english');\n    await act(() => i18next.changeLanguage('de'));\n    expect(screen.getByRole('heading')).toHaveTextContent('english');\n    await act(() => i18next.addResourceBundle('de', 'namespace', { key: 'deutsch' }, false, true));\n    expect(screen.getByRole('heading')).toHaveTextContent('deutsch'); // this assertion fails\n  });\n});\n"
  },
  {
    "path": "test/useTranslation.loading.spec.js",
    "content": "import { describe, it, vitest, beforeEach, expect } from 'vitest';\nimport { renderHook, waitFor } from '@testing-library/react';\nimport i18n from './i18n';\nimport { BackendMock } from './backendMock';\nimport { useTranslation } from '../src/useTranslation';\n\nvitest.unmock('../src/useTranslation');\n\ndescribe('useTranslation loading ns', () => {\n  let newI18n;\n  let backend;\n\n  beforeEach(() => {\n    newI18n = i18n.createInstance();\n    backend = new BackendMock();\n    newI18n.use(backend).init({\n      lng: 'en',\n      fallbackLng: 'en',\n      interpolation: {\n        escapeValue: false, // not needed for react!!\n      },\n    });\n  });\n\n  it('should wait for correct translation with suspense', async () => {\n    const all = [];\n    const { result } = renderHook(() => {\n      const value = useTranslation('common', { i18n: newI18n, useSuspense: true });\n      all.push(value);\n      return value;\n    });\n\n    expect(all).toHaveLength(0);\n    backend.flush();\n    await waitFor(() => expect(result.current.t('key1')).toBe('test'));\n  });\n\n  it('should wait for correct translation without suspense', async () => {\n    const { result } = renderHook(() =>\n      useTranslation('common', { i18n: newI18n, useSuspense: false }),\n    );\n\n    expect(result.current.t('key1')).toBe('key1');\n    backend.flush();\n    await waitFor(() => expect(result.current.t('key1')).toBe('test'));\n  });\n\n  it('should return defaultValue if i18n instance not found', async () => {\n    const { result } = renderHook(() =>\n      useTranslation('common', { i18n: newI18n, useSuspense: false }),\n    );\n    const { t } = result.current;\n    expect(t('key1', 'my default value')).toBe('my default value');\n    expect(t('key1', { defaultValue: 'my default value' })).toBe('my default value');\n  });\n});\n"
  },
  {
    "path": "test/useTranslation.loadingLng.spec.js",
    "content": "import { describe, it, vitest, beforeEach, afterEach, expect } from 'vitest';\nimport { renderHook, cleanup, waitFor } from '@testing-library/react';\nimport i18n from './i18n';\nimport { BackendLngAwareMock } from './backendLngAwareMock';\nimport { useTranslation } from '../src/useTranslation';\n\nvitest.unmock('../src/useTranslation');\n\ndescribe('useTranslation loading ns with lng via props', () => {\n  let newI18n;\n  /** @type {BackendLngAwareMock} */\n  let backend;\n\n  beforeEach(() => {\n    newI18n = i18n.createInstance();\n    backend = new BackendLngAwareMock();\n    newI18n.use(backend).init({\n      lng: 'en',\n      fallbackLng: 'en',\n    });\n  });\n\n  afterEach(cleanup);\n\n  it('should wait for correct translation with suspense', async () => {\n    const all = [];\n    const { result } = renderHook(() => {\n      const value = useTranslation('common', { i18n: newI18n, useSuspense: true, lng: 'de' });\n      all.push(value);\n      return value;\n    });\n\n    expect(all).toHaveLength(0);\n    backend.flush();\n    await waitFor(() => expect(result.current.t('key1')).toBe('de/common for key1'));\n  });\n\n  it('should wait for correct translation without suspense', async () => {\n    const { result } = renderHook(() =>\n      useTranslation('common', { i18n: newI18n, useSuspense: false, lng: 'it' }),\n    );\n    const { t } = result.current;\n    expect(t('key1')).toBe('key1');\n\n    backend.flush();\n    expect(t('key1')).toBe('it/common for key1');\n  });\n\n  it('should return defaultValue if resources not yet loaded', async () => {\n    const { result } = renderHook(() =>\n      useTranslation('common', { i18n: newI18n, useSuspense: false, lng: 'fr' }),\n    );\n    const { t } = result.current;\n    expect(t('key1', 'my default value')).toBe('my default value');\n    expect(t('key1', { defaultValue: 'my default value' })).toBe('my default value');\n\n    backend.flush({ language: 'en' });\n    expect(t('key1', 'my default value')).toBe('en/common for key1');\n    expect(t('key1', { defaultValue: 'my default value' })).toBe('en/common for key1');\n\n    backend.flush({ language: 'fr' });\n    expect(t('key1', 'my default value')).toBe('fr/common for key1');\n    expect(t('key1', { defaultValue: 'my default value' })).toBe('fr/common for key1');\n  });\n\n  it('should correctly return and render correct translations in multiple useTranslation usages', async () => {\n    {\n      const { result } = renderHook(() =>\n        useTranslation('newns', { i18n: newI18n, useSuspense: true, lng: 'pt' }),\n      );\n\n      backend.flush();\n      await waitFor(() => expect(result.current.t('key1')).toBe('pt/newns for key1'));\n    }\n\n    {\n      const { result } = renderHook(() =>\n        useTranslation('newns', { i18n: newI18n, useSuspense: true, lng: 'de' }),\n      );\n\n      backend.flush({ language: 'de' });\n      await waitFor(() => expect(result.current.t('key1')).toBe('de/newns for key1'));\n    }\n\n    {\n      const { result } = renderHook(() =>\n        useTranslation('newns', { i18n: newI18n, useSuspense: true, lng: 'pt' }),\n      );\n      // backend.flush({ language: 'pt' }); // already loaded\n      // await retPT.waitForNextUpdate(); // already loaded\n      const { t } = result.current;\n      expect(t('key1')).toBe('pt/newns for key1');\n    }\n  });\n});\n"
  },
  {
    "path": "test/useTranslation.ready.spec.jsx",
    "content": "import { describe, it, vitest, expect, beforeEach, afterEach } from 'vitest';\nimport React, { Suspense } from 'react';\nimport { render, renderHook, cleanup, screen } from '@testing-library/react';\nimport { useTranslation } from '../src/useTranslation';\nimport hasLoadedNamespace from './hasLoadedNamespaceMock.js';\n\nvitest.unmock('../src/useTranslation');\n\ndescribe('useTranslation', () => {\n  afterEach(() => {\n    cleanup();\n  });\n\n  let instance;\n  beforeEach(() => {\n    instance = {\n      language: 'en',\n      languages: ['en', 'fr'],\n      services: {\n        resourceStore: {\n          data: {},\n        },\n        backendConnector: { backend: {}, state: { 'en|notLoadedNS': 1, 'fr|notLoadedNS': 1 } },\n      },\n      isInitialized: true,\n      changeLanguage: () => {},\n      getFixedT: () => (message) => message,\n      hasResourceBundle: (lng, ns) => ns === 'alreadyLoadedNS',\n      loadNamespaces: () => {},\n      hasLoadedNamespace: (ns) => hasLoadedNamespace(ns, instance),\n      on: () => {},\n      off: () => {},\n      options: {},\n    };\n  });\n\n  function TestComponentNotReady({ i18n }) {\n    const { t } = useTranslation(['notLoadedNS', 'alreadyLoadedNS'], { i18n });\n\n    return <div>{t('keyOne')}</div>;\n  }\n\n  it('should render suspense if not ready (having not all ns)', async () => {\n    render(\n      <Suspense fallback=\"Suspended\">\n        <TestComponentNotReady i18n={instance} />\n      </Suspense>,\n    );\n\n    expect(screen.getByText('Suspended')).toBeInTheDocument();\n  });\n\n  it('should render correct content if ready (having all ns)', () => {\n    const { result } = renderHook(() => useTranslation('alreadyLoadedNS', { i18n: instance }));\n\n    const { t } = result.current;\n    expect(t('keyOne')).toBe('keyOne');\n  });\n\n  it('should ignore suspense if no backend defined', () => {\n    const instance2 = { ...instance };\n    instance2.services.backendConnector = { backend: false };\n    const { result } = renderHook(() =>\n      useTranslation(['notLoadedNS', 'alreadyLoadedNS'], { i18n: instance2 }),\n    );\n\n    const { t } = result.current;\n    expect(t('keyOne')).toBe('keyOne');\n  });\n\n  it('should ignore suspense if failed loading ns and no fallback lng is defined', () => {\n    const instance2 = { ...instance };\n    instance2.services.backendConnector = {\n      backend: {},\n      state: { 'en|notLoadedNS': -1 },\n    };\n    instance2.services.options = { fallbackLng: false };\n    const { result } = renderHook(() =>\n      useTranslation(['notLoadedNS', 'alreadyLoadedNS'], { i18n: instance2 }),\n    );\n\n    const { t } = result.current;\n    expect(t('keyOne')).toBe('keyOne');\n  });\n\n  it('should ignore suspense if failed loading ns but has fallback loaded', () => {\n    const instance2 = { ...instance };\n    instance2.services.backendConnector = {\n      backend: {},\n      state: { 'en|notLoadedNS': -1, 'fr|notLoadedNS': 2 },\n    };\n\n    const { result } = renderHook(() =>\n      useTranslation(['notLoadedNS', 'alreadyLoadedNS'], { i18n: instance2 }),\n    );\n\n    const { t } = result.current;\n    expect(t('keyOne')).toBe('keyOne');\n  });\n\n  it('should ignore suspense if failed loading ns and has fallback failing too', () => {\n    const instance2 = { ...instance };\n    instance2.services.backendConnector = {\n      backend: {},\n      state: { 'en|notLoadedNS': -1, 'fr|notLoadedNS': -1 },\n    };\n\n    const { result } = renderHook(() =>\n      useTranslation(['notLoadedNS', 'alreadyLoadedNS'], { i18n: instance2 }),\n    );\n\n    const { t } = result.current;\n    expect(t('keyOne')).toBe('keyOne');\n  });\n\n  it('should ignore suspense if set useSuspense to false', () => {\n    const instance2 = { ...instance };\n    instance2.options.react = { useSuspense: false };\n    instance2.services.backendConnector = {\n      backend: {},\n      state: { 'en|notLoadedNS': 1, 'fr|notLoadedNS': 1 },\n    };\n\n    const { result } = renderHook(() =>\n      useTranslation(['notLoadedNS', 'alreadyLoadedNS'], { i18n: instance2 }),\n    );\n\n    const { t } = result.current;\n    expect(t('keyOne')).toBe('keyOne');\n  });\n});\n"
  },
  {
    "path": "test/useTranslation.spec.jsx",
    "content": "import { describe, it, vitest, expect, beforeAll, afterAll, afterEach } from 'vitest';\nimport React from 'react';\nimport { renderHook, cleanup, render, act } from '@testing-library/react';\nimport { createInstance } from 'i18next';\nimport i18nInstance from './i18n';\nimport { useTranslation } from '../src/useTranslation';\nimport { setI18n } from '../src/context';\nimport { I18nextProvider } from '../src/I18nextProvider';\n\nvitest.unmock('../src/useTranslation');\nvitest.unmock('../src/I18nextProvider');\n\ndescribe('useTranslation', () => {\n  afterEach(() => {\n    cleanup();\n  });\n\n  describe('object', () => {\n    it('should render correct content', () => {\n      const { result } = renderHook(() => useTranslation('translation', { i18n: i18nInstance }));\n      const { t, i18n } = result.current;\n      expect(t('key1')).toBe('test');\n      expect(t(($) => $.key1)).toBe('test');\n      // expect(i18n).toBe(i18nInstance);\n      expect(i18n.__original).toBe(i18nInstance);\n    });\n  });\n\n  describe('proper object-equality of returned t function', () => {\n    it('should refresh t upon i18n.changeLanguage', () => {\n      const { result, rerender } = renderHook(() =>\n        useTranslation('translation', { i18n: i18nInstance }),\n      );\n      const { i18n, t } = result.current;\n      expect(i18n.language).toBe('en');\n      i18n.changeLanguage('fr');\n      try {\n        rerender();\n        const { t: refreshedT, i18n: refreshedI18n } = result.current;\n        expect(refreshedT).not.toBe(t);\n        // expect(refreshedI18n).toBe(i18n);\n        expect(refreshedI18n.__original).toBe(i18n.__original);\n      } finally {\n        i18n.changeLanguage('en');\n      }\n    });\n  });\n\n  describe('array', () => {\n    it('should render correct content', () => {\n      const { result } = renderHook(() => useTranslation('translation', { i18n: i18nInstance }));\n      const [t, i18n] = result.current;\n      expect(t('key1')).toBe('test');\n      // expect(i18n).toBe(i18nInstance);\n      expect(i18n.__original).toBe(i18nInstance);\n    });\n  });\n\n  describe('without i18next instance', () => {\n    beforeAll(() => {\n      setI18n(undefined);\n    });\n\n    afterAll(() => {\n      setI18n(i18nInstance);\n    });\n\n    describe('handling gracefully', () => {\n      it('should render content fallback', () => {\n        console.warn = vitest.fn();\n\n        const { result } = renderHook(() => useTranslation('translation', { i18n: undefined }));\n        const { t, i18n } = result.current;\n\n        expect(t('key1')).toBe('key1');\n        expect(t(['doh', 'Human friendly fallback'])).toBe('Human friendly fallback');\n        expect(i18n).toEqual({});\n\n        expect(console.warn).toHaveBeenCalled();\n      });\n\n      it('should return empty string for a selector function when not ready', () => {\n        console.warn = vitest.fn();\n\n        const { result } = renderHook(() => useTranslation('translation', { i18n: undefined }));\n        const { t } = result.current;\n\n        // A selector function cannot be resolved without an i18n instance —\n        // returning '' is safer than leaking the raw function reference.\n        expect(t(($) => $.foo)).toBe('');\n      });\n\n      it('should return empty string for an array of selector functions when not ready', () => {\n        console.warn = vitest.fn();\n\n        const { result } = renderHook(() => useTranslation('translation', { i18n: undefined }));\n        const { t } = result.current;\n\n        expect(t([($) => $.foo, ($) => $.fallback])).toBe('');\n      });\n\n      it('should still honour defaultValue with a selector when not ready', () => {\n        console.warn = vitest.fn();\n\n        const { result } = renderHook(() => useTranslation('translation', { i18n: undefined }));\n        const { t } = result.current;\n\n        expect(t(($) => $.foo, 'my default')).toBe('my default');\n        expect(t([($) => $.foo, ($) => $.fallback], { defaultValue: 'my default' })).toBe(\n          'my default',\n        );\n      });\n    });\n  });\n\n  describe('few namespaces', () => {\n    it('hook destructured values are expected types', () => {\n      const { result } = renderHook(() =>\n        useTranslation(['other', 'translation'], { i18n: i18nInstance }),\n      );\n      const { t, i18n } = result.current;\n      expect(typeof t).toBe('function');\n      expect(i18n).toEqual(i18nInstance);\n      expect(t('key1')).toEqual('key1');\n    });\n\n    describe('fallback mode', () => {\n      beforeAll(() => {\n        i18nInstance.options.react.nsMode = 'fallback';\n      });\n\n      afterAll(() => {\n        delete i18nInstance.options.react.nsMode;\n      });\n\n      it('should render correct content', () => {\n        const { result } = renderHook(() =>\n          useTranslation(['other', 'translation'], { i18n: i18nInstance }),\n        );\n        const { t } = result.current;\n\n        expect(t('key1')).toBe('test');\n      });\n    });\n\n    it('should render content fallback', () => {\n      const { result } = renderHook(() =>\n        useTranslation(['other', 'translation'], { i18n: i18nInstance }),\n      );\n      const { t } = result.current;\n\n      expect(t('key1')).toBe('key1');\n    });\n  });\n\n  describe('default namespace from context', () => {\n    afterEach(() => {\n      i18nInstance.reportNamespaces.usedNamespaces = {};\n    });\n\n    const namespace = 'sampleNS';\n    const wrapper = ({ children }) => (\n      <I18nextProvider defaultNS={namespace} i18={i18nInstance}>\n        {children}\n      </I18nextProvider>\n    );\n\n    it('should render content fallback', () => {\n      const { result } = renderHook(() => useTranslation(), { wrapper });\n      const { t } = result.current;\n\n      expect(t('key1')).toBe('key1');\n\n      expect(i18nInstance.reportNamespaces.getUsedNamespaces()).toContain(namespace);\n    });\n  });\n\n  describe('key prefix', () => {\n    i18nInstance.addResource('en', 'translation', 'deeply.nested_a.key', 'here_a!');\n    i18nInstance.addResource('en', 'translation', 'deeply.nested_b.key', 'here_b!');\n\n    it('should apply keyPrefix and reset it once changed', () => {\n      let keyPrefix = 'deeply.nested_a';\n      const { result, rerender } = renderHook(() =>\n        useTranslation('translation', { i18n: i18nInstance, keyPrefix }),\n      );\n      const { t: t1 } = result.current;\n      expect(t1('key')).toBe('here_a!');\n      expect(t1.keyPrefix).toBe('deeply.nested_a');\n      expect(t1(($) => $.key)).toBe('here_a!');\n\n      keyPrefix = 'deeply.nested_b';\n      rerender();\n\n      const { t: t2 } = result.current;\n      expect(t2('key')).toBe('here_b!');\n      expect(t2.keyPrefix).toBe('deeply.nested_b');\n      expect(t2(($) => $.key)).toBe('here_b!');\n    });\n  });\n\n  describe('replacing i18n instance in provider', () => {\n    i18nInstance.addResource('fr', 'translation', 'key1', 'test2');\n    const i18nInstanceClone = i18nInstance.cloneInstance({ lng: 'fr' });\n    const wrapper = ({ children }) => (\n      <I18nextProvider i18n={children?.props?.renderCallbackProps.i18n}>{children}</I18nextProvider>\n    );\n\n    it('should render correct content', async () => {\n      const { result, rerender } = renderHook(() => useTranslation(), {\n        wrapper,\n        initialProps: { i18n: i18nInstance },\n      });\n\n      expect(result.current.t('key1')).toBe('test');\n      rerender({ i18n: i18nInstanceClone });\n      expect(result.current.t('key1')).toBe('test2');\n    });\n  });\n\n  describe('with lng prop', () => {\n    i18nInstance.addResource('en', 'translation', 'myKey', 'second test');\n    i18nInstance.addResource('fr', 'translation', 'myKey', 'deuxième essai');\n    i18nInstance.addResource('it', 'translation', 'myKey', 'secondo test');\n    const wrapper = ({ children, i18n }) => (\n      <I18nextProvider i18n={i18n}>{children}</I18nextProvider>\n    );\n\n    it('should not fail when passing bindI18n: false or undefined', () => {\n      expect(() =>\n        renderHook(() => useTranslation('translation', { bindI18n: false })),\n      ).to.not.throw();\n      expect(() =>\n        renderHook(() => useTranslation('translation', { bindI18n: undefined })),\n      ).to.not.throw();\n    });\n\n    it('should render correct content', () => {\n      const { result: resultNoLng } = renderHook(() => useTranslation('translation'), {\n        wrapper,\n        initialProps: {\n          i18n: i18nInstance,\n        },\n      });\n      const { t: t1 } = resultNoLng.current;\n      expect(t1('myKey')).toBe('second test');\n\n      const { result: resultIt } = renderHook(() => useTranslation('translation', { lng: 'it' }), {\n        wrapper,\n        initialProps: {\n          i18n: i18nInstance,\n        },\n      });\n\n      const { t: t2 } = resultIt.current;\n      expect(t2('myKey')).toBe('secondo test');\n\n      const { result: resultFr } = renderHook(() => useTranslation('translation', { lng: 'fr' }), {\n        wrapper,\n        initialProps: {\n          i18n: i18nInstance,\n        },\n      });\n\n      const { t: t3 } = resultFr.current;\n      expect(t3('myKey')).toBe('deuxième essai');\n    });\n  });\n\n  describe('deprecated wait option', () => {\n    it('should warn when using deprecated wait option', () => {\n      const i18nWithWait = createInstance();\n      i18nWithWait.init({\n        lng: 'en',\n        resources: {\n          en: { translation: { key: 'value' } },\n        },\n        react: {\n          wait: true,\n        },\n      });\n\n      function TestComponent() {\n        const { t } = useTranslation(undefined, { i18n: i18nWithWait });\n        return <div>{t('key')}</div>;\n      }\n\n      const { container } = render(<TestComponent />);\n      expect(container.textContent).toBeTruthy();\n    });\n  });\n\n  describe('useTranslation __original safety', () => {\n    it('does not throw when the source i18n has a non-configurable __original property', async () => {\n      const mockI18n = createInstance();\n      await mockI18n.init({\n        lng: 'en',\n        resources: { en: { translation: { key1: 'test' } } },\n        react: { useSuspense: false },\n      });\n\n      // Simulate a non-configurable __original on the source instance\n      Object.defineProperty(mockI18n, '__original', {\n        value: 'existing',\n        writable: false,\n        enumerable: false,\n        configurable: false,\n      });\n\n      // Should not throw; wrapper creation should handle the existing non-configurable descriptor\n      const { result } = renderHook(() => useTranslation('translation', { i18n: mockI18n }));\n\n      // The returned wrapper should expose __original pointing to the original instance\n      expect(result.current.i18n.__original).toBe(mockI18n);\n    });\n  });\n\n  describe('useTranslation language wrapper identity', () => {\n    it('only replaces returned i18n wrapper when language actually changes', async () => {\n      const { result, rerender } = renderHook(() =>\n        useTranslation('translation', { i18n: i18nInstance }),\n      );\n\n      const beforeWrapper = result.current.i18n;\n      expect(beforeWrapper.__original || beforeWrapper).toBe(i18nInstance);\n\n      // calling changeLanguage with the same current language should NOT replace wrapper\n      await i18nInstance.changeLanguage(i18nInstance.language);\n      rerender();\n      expect(result.current.i18n).toBe(beforeWrapper);\n\n      // calling changeLanguage to a different language SHOULD replace wrapper\n      i18nInstance.changeLanguage('fr');\n      rerender();\n      const afterWrapper = result.current.i18n;\n      expect(afterWrapper).not.toBe(beforeWrapper);\n      expect(afterWrapper.__original).toBe(i18nInstance);\n\n      // restore language\n      await i18nInstance.changeLanguage('en');\n      rerender();\n    });\n  });\n\n  it('should not trigger loadNamespaces on every render if namespaces array is unstable (inline)', async () => {\n    const i18n = createInstance();\n    i18n.init({\n      lng: 'en',\n      resources: {},\n      react: { useSuspense: false },\n    });\n\n    // Mock hasLoadedNamespace to return false so we hit the loading path\n    i18n.hasLoadedNamespace = () => false;\n\n    // Mock loadNamespaces to do nothing (pending)\n    i18n.loadNamespaces = vitest.fn();\n\n    let renderCount = 0;\n    const countCalls = [];\n    // Create a hook wrapper that forces re-renders by prop\n    const { rerender } = renderHook(\n      ({ count }) => {\n        countCalls.push(count);\n        renderCount += 1;\n        // Inline array: New reference every render\n        useTranslation(['ns1'], { i18n });\n      },\n      { initialProps: { count: 0 } },\n    );\n\n    // Initial render\n    expect(i18n.loadNamespaces).toHaveBeenCalledTimes(1);\n    expect(renderCount).to.eql(1);\n    expect(countCalls).to.have.lengthOf(1);\n    expect(countCalls[0]).to.eql(0);\n\n    rerender({ count: 1 });\n    expect(i18n.loadNamespaces).toHaveBeenCalledTimes(1);\n    expect(renderCount).to.eql(2);\n    expect(countCalls).to.have.lengthOf(2);\n    expect(countCalls[1]).to.eql(1);\n\n    rerender({ count: 2 });\n    expect(i18n.loadNamespaces).toHaveBeenCalledTimes(1);\n    expect(renderCount).to.eql(3);\n    expect(countCalls).to.have.lengthOf(3);\n    expect(countCalls[2]).to.eql(2);\n  });\n});\n"
  },
  {
    "path": "test/useTranslation.usedNamespaces.spec.js",
    "content": "import { describe, it, vitest, expect, afterEach } from 'vitest';\nimport { renderHook, cleanup } from '@testing-library/react';\nimport { useTranslation } from '../src/useTranslation';\n\nvitest.unmock('../src/useTranslation');\n\ndescribe('useTranslation', () => {\n  afterEach(() => {\n    cleanup();\n  });\n\n  it('should render correct content if ready (having all ns)', () => {\n    const i18n = {\n      language: 'en',\n      languages: ['en'],\n      services: {\n        resourceStore: {\n          data: {},\n        },\n        backendConnector: { backend: {} },\n      },\n      isInitialized: true,\n      changeLanguage: () => {},\n      getFixedT: () => (message) => message,\n      hasLoadedNamespace: () => false,\n      hasResourceBundle: (lng, ns) => ns === 'ns1' || ns === 'ns2' || ns === 'ns3',\n      loadNamespaces: () => {},\n      on: () => {},\n      off: () => {},\n      options: {},\n    };\n    renderHook(() => useTranslation(['ns1', 'ns2', 'ns3'], { i18n }));\n\n    expect(i18n.reportNamespaces.getUsedNamespaces()).toEqual(['ns1', 'ns2', 'ns3']);\n  });\n});\n"
  },
  {
    "path": "test/utils.spec.js",
    "content": "import { describe, it, expect, vi } from 'vitest';\nimport { isString, isObject, warn, hasLoadedNamespace } from '../src/utils.js';\n\ndescribe('isString', () => {\n  it('should return true for strings', () => {\n    expect(isString('string')).toBe(true);\n  });\n\n  it.each([[undefined], [null], [1], [{}], [[]], [() => {}]])(\n    'should return false for non-strings, testing %o',\n    (value) => {\n      expect(isString(value)).toBe(false);\n    },\n  );\n});\n\ndescribe('isObject', () => {\n  it.each([[{}], [{ key: 'value' }], [[]]])(\n    'should return true for objects, testing %o',\n    (value) => {\n      expect(isObject(value)).toBe(true);\n    },\n  );\n\n  it.each([[undefined], [null], [1], ['string'], [() => {}]])(\n    'should return false for non-objects, testing %o',\n    (value) => {\n      expect(isObject(value)).toBe(false);\n    },\n  );\n});\n\ndescribe('warn', () => {\n  it('should use console.warn when i18n logger is not available', () => {\n    const consoleWarnSpy = vi.spyOn(console, 'warn').mockImplementation(() => {});\n\n    warn(null, 'TEST_CODE', 'Test message');\n\n    expect(consoleWarnSpy).toHaveBeenCalledWith(\n      expect.stringContaining('react-i18next::'),\n      expect.objectContaining({ code: 'TEST_CODE' }),\n    );\n\n    consoleWarnSpy.mockRestore();\n  });\n});\n\ndescribe('hasLoadedNamespace', () => {\n  it('should handle when languages is undefined', () => {\n    const mockI18n = {\n      languages: undefined,\n      hasLoadedNamespace: () => true,\n    };\n\n    const result = hasLoadedNamespace('test', mockI18n);\n    expect(result).toBe(true);\n  });\n\n  it('should handle empty languages array', () => {\n    const mockI18n = {\n      languages: [],\n      hasLoadedNamespace: () => true,\n    };\n\n    const result = hasLoadedNamespace('test', mockI18n);\n    expect(result).toBe(true);\n  });\n\n  it('should handle language changing check', () => {\n    const mockI18n = {\n      languages: ['en'],\n      isLanguageChangingTo: 'de',\n      services: {\n        backendConnector: {\n          backend: true,\n        },\n      },\n      hasLoadedNamespace: (ns, options) => {\n        if (options.precheck) {\n          const precheckResult = options.precheck(mockI18n, () => false);\n          if (precheckResult === false) return false;\n        }\n        return true;\n      },\n    };\n\n    const result = hasLoadedNamespace('test', mockI18n, {\n      bindI18n: 'languageChanging loaded',\n    });\n\n    expect(result).toBe(false);\n  });\n});\n"
  },
  {
    "path": "test/withSSR.spec.jsx",
    "content": "import { describe, it, vitest, expect, beforeAll, afterAll, afterEach } from 'vitest';\nimport { render, cleanup } from '@testing-library/react';\nimport React from 'react';\nimport i18n from './i18n';\nimport { setI18n } from '../src/context';\nimport { withSSR } from '../src/withSSR';\nimport { useTranslation } from '../src/useTranslation';\nimport hasLoadedNamespace from './hasLoadedNamespaceMock.js';\n\nvitest.unmock('../src/withSSR');\n\ndescribe('withSSR', () => {\n  afterEach(() => {\n    cleanup();\n  });\n\n  const mockI18n = {\n    language: 'en',\n    languages: ['en'],\n    options: {\n      ns: [],\n      defaultNS: 'defaultNS',\n      nsMode: 'fallback',\n    },\n    services: {\n      resourceStore: {\n        data: {},\n      },\n      backendConnector: {},\n    },\n    isInitialized: true,\n    changeLanguage: (lng) => {\n      mockI18n.language = lng;\n    },\n    getFixedT: () => (message) => message,\n    hasResourceBundle: (lng, ns) => ns === 'alreadyLoadedNS',\n    getResourceBundle: (lng, ns) => ({ lng, ns }),\n    loadNamespaces: () => {},\n    hasLoadedNamespace: (ns) => hasLoadedNamespace(ns, mockI18n),\n    on: () => {},\n    off: () => {},\n  };\n\n  function TestComponent() {\n    useTranslation('ns1');\n    return <div>SSR</div>;\n  }\n\n  TestComponent.getInitialProps = async () => ({ foo: 'bar' });\n\n  beforeAll(() => {\n    setI18n(mockI18n);\n  });\n\n  afterAll(() => {\n    setI18n(i18n);\n  });\n\n  it('should export wrapped component', () => {\n    const HocElement = withSSR()(TestComponent);\n    expect(HocElement.WrappedComponent).toBe(TestComponent);\n  });\n\n  it('should set values', () => {\n    const HocElement = withSSR()(TestComponent);\n    const { container } = render(\n      <HocElement initialI18nStore={{ foo: 'bar' }} initialLanguage=\"de\" />,\n    );\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        SSR\n      </div>\n    `);\n    expect(mockI18n.language).toBe('de');\n    expect(mockI18n.services.resourceStore.data).toEqual({ foo: 'bar' });\n  });\n\n  it('should get initialProps', async () => {\n    const HocElement = withSSR()(TestComponent);\n\n    expect.assertions(1);\n    const props = await HocElement.getInitialProps({});\n\n    const expected = {\n      foo: 'bar',\n      initialI18nStore: {\n        en: {\n          ns1: {\n            lng: 'en',\n            ns: 'ns1',\n          },\n        },\n      },\n      initialLanguage: 'de',\n    };\n\n    expect(props).toEqual(expected);\n  });\n});\n"
  },
  {
    "path": "test/withTranslation.keyPrefix.spec.jsx",
    "content": "import { describe, it, vitest, expect, afterEach } from 'vitest';\nimport React from 'react';\nimport { render, cleanup } from '@testing-library/react';\nimport i18n from './i18n';\nimport { withTranslation } from '../src/withTranslation';\n\nvitest.unmock('../src/withTranslation');\n\ndescribe('withTranslation', () => {\n  afterEach(() => {\n    cleanup();\n  });\n\n  class TestComponentKeyPrefix extends React.Component {\n    render() {\n      const { t, i18n: instance } = this.props;\n      expect(typeof t).toBe('function');\n      // expect(instance).toBe(i18n);\n      expect(instance.__original).toBe(i18n);\n\n      return <div>{t('deepKey1')}</div>;\n    }\n  }\n\n  it('should render correct content', () => {\n    const HocElement = withTranslation('translation', { keyPrefix: 'deepPath' })(\n      TestComponentKeyPrefix,\n    );\n    const { container } = render(<HocElement />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        value1\n      </div>\n    `);\n  });\n});\n"
  },
  {
    "path": "test/withTranslation.spec.jsx",
    "content": "import { describe, it, vitest, expect, afterEach } from 'vitest';\nimport React from 'react';\nimport { render, cleanup } from '@testing-library/react';\nimport i18n from './i18n';\nimport { withTranslation } from '../src/withTranslation';\n\nvitest.unmock('../src/withTranslation');\n\ndescribe('withTranslation', () => {\n  afterEach(() => {\n    cleanup();\n  });\n\n  class TestComponent extends React.Component {\n    render() {\n      const { t, i18n: instance } = this.props;\n      expect(typeof t).toBe('function');\n      // expect(instance).toBe(i18n);\n      expect(instance.__original).toBe(i18n);\n\n      return (\n        <div>\n          {t('key1')}\n          {t('deepPath.deepKey1')}\n        </div>\n      );\n    }\n  }\n\n  it('should export wrapped component', () => {\n    const HocElement = withTranslation()(TestComponent);\n    expect(HocElement.WrappedComponent).toBe(TestComponent);\n  });\n\n  it('should render correct content', () => {\n    const HocElement = withTranslation()(TestComponent);\n    const { container } = render(<HocElement />);\n    expect(container.firstChild).toMatchInlineSnapshot(`\n      <div>\n        test\n        value1\n      </div>\n    `);\n  });\n\n  it('should has ref', () => {\n    const HocElement = withTranslation('translation', { withRef: true })(TestComponent);\n    const hocRef = React.createRef();\n    render(<HocElement ref={hocRef} />);\n    expect(hocRef.current).not.toBeNull();\n  });\n});\n"
  },
  {
    "path": "tsconfig.json",
    "content": "{\n  \"exclude\": [\"example/**/*\"],\n\n  \"compilerOptions\": {\n    \"module\": \"ESNext\",\n    \"target\": \"ES2020\",\n    \"lib\": [\"ES2020\", \"dom\"],\n    \"jsx\": \"react\",\n    \"moduleResolution\": \"bundler\",\n    \"forceConsistentCasingInFileNames\": true,\n    \"strict\": true,\n    \"noEmit\": true,\n    \"baseUrl\": \".\",\n    \"paths\": { \"react-i18next\": [\"./\"] },\n    \"esModuleInterop\": true,\n    \"allowSyntheticDefaultImports\": true,\n    \"skipLibCheck\": true\n  }\n}\n"
  },
  {
    "path": "vitest.config.mts",
    "content": "import { defineConfig } from 'vitest/config';\n\nexport default defineConfig({\n  test: {\n    name: 'runtime',\n    dir: './test',\n    exclude: ['**/typescript/**'],\n    environment: 'happy-dom',\n    setupFiles: ['./test/setup'],\n\n    coverage: {\n      reporter: ['text', 'html', 'json', 'lcov'],\n      include: ['**/src/**/*.{js,jsx}', '*.macro.js'],\n      exclude: [\n        '**/src/index.js',\n        '**/src/shallowEqual.js',\n        '**/node_modules/**',\n        '**/test/**',\n        '**/example/**',\n      ],\n    },\n  },\n});\n"
  },
  {
    "path": "vitest.workspace.typescript.mts",
    "content": "import { readdirSync } from 'node:fs';\nimport { defineWorkspace } from 'vitest/config';\nimport type { UserProjectConfigExport } from 'vitest/config';\n\nexport default defineWorkspace(\n  /**\n   * If you need to test multiple typescript configurations (like misc) simply create a file named tsconfig.{customName}.json\n   * and this script will automatically create a new workspace named with the dirName followed by `customName`\n   */\n  readdirSync('./test/typescript', { withFileTypes: true })\n    .filter((dir) => dir.isDirectory())\n    // Exclude issue-1899 - it runs separately via test:typescript:issue-1899\n    // because it requires skipLibCheck: false which exposes @types/node errors\n    .filter((dir) => dir.name !== 'issue-1899')\n    .reduce<UserProjectConfigExport[]>((workspaces, dir) => {\n      const dirPath = `test/typescript/${dir.name}` as const;\n\n      const tsConfigFiles = readdirSync(dirPath).filter(\n        // Do not include temporary vitest tsconfig files\n        (it) => it.startsWith('tsconfig.') && it.endsWith('.json') && !it.includes('vitest-temp'),\n      );\n\n      tsConfigFiles.forEach((tsConfigFileName) => {\n        const workspaceName =\n          tsConfigFileName === 'tsconfig.json'\n            ? `typescript-${dir.name}`\n            : `${dir.name}-${tsConfigFileName.split('.')[1]}`;\n\n        workspaces.push({\n          test: {\n            dir: `./${dirPath}`,\n            name: workspaceName,\n            alias: {\n              /**\n               * From `vitest` >= 2 imports are resolved even if we are running only typecheck tests.\n               * This will result in:\n               * ```text\n               * Error: Failed to resolve entry for package \"react-i18next\". The package may have incorrect main/module/exports specified in its package.json.\n               * ```\n               * To avoid a useless build process before running these tests an empty alias to `react-i18next` is added.\n               */\n              'react-i18next': '',\n            },\n            typecheck: {\n              enabled: true,\n              include: [`**/${dirPath}/*.test.{ts,tsx}`],\n              tsconfig: `./${dirPath}/${tsConfigFileName}`,\n            },\n          },\n        });\n      });\n\n      return workspaces;\n    }, []),\n);\n"
  }
]