9 |
10 |
17 |
18 | )
19 | }
20 |
21 | export default App
22 |
--------------------------------------------------------------------------------
/examples/publish-ci/cra4/src/app/hooks.ts:
--------------------------------------------------------------------------------
1 | import { TypedUseSelectorHook, useDispatch, useSelector } from 'react-redux'
2 | import type { RootState, AppDispatch } from './store'
3 |
4 | // Use throughout your app instead of plain `useDispatch` and `useSelector`
5 | export const useAppDispatch = () => useDispatch
5 | {children}
6 |
7 | )
8 |
--------------------------------------------------------------------------------
/examples/publish-ci/cra4/src/features/counter/counterAPI.ts:
--------------------------------------------------------------------------------
1 | // A mock function to mimic making an async request for data
2 | export function fetchCount(amount = 1) {
3 | return new Promise<{ data: number }>((resolve) =>
4 | setTimeout(() => resolve({ data: amount }), 500),
5 | )
6 | }
7 |
--------------------------------------------------------------------------------
/examples/publish-ci/cra4/src/features/posts/Post.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 |
3 | // import the file that injects "post" to make sure it has been loaded
4 | import { useGetPostQuery } from '../../app/services/post'
5 |
6 | export const Post = ({ id }: { id: number }) => {
7 | const { data, error } = useGetPostQuery(id)
8 | const content = error ? (
9 | <>there was an error
10 | ) : !data ? (
11 | <>loading
12 | ) : (
13 |
14 | Title:{' '}
15 |
16 | {data.name}
17 |
18 |
19 | )
20 |
21 | return (
22 |
23 |
26 | )
27 | }
28 | export default Post
29 |
--------------------------------------------------------------------------------
/examples/publish-ci/cra4/src/features/posts/PostsManager.css:
--------------------------------------------------------------------------------
1 | .posts-list {
2 | display: flex;
3 | flex-direction: column;
4 | flex-basis: 100%;
5 | flex: 1;
6 | min-height: 200px;
7 | border-right: 1px solid #eee;
8 | padding: 20px;
9 | text-align: left;
10 | }
11 |
--------------------------------------------------------------------------------
/examples/publish-ci/cra4/src/index.css:
--------------------------------------------------------------------------------
1 | body {
2 | margin: 0;
3 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
4 | 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
5 | sans-serif;
6 | -webkit-font-smoothing: antialiased;
7 | -moz-osx-font-smoothing: grayscale;
8 | }
9 |
10 | code {
11 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
12 | monospace;
13 | }
14 |
--------------------------------------------------------------------------------
/examples/publish-ci/cra4/src/index.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import ReactDOM from 'react-dom/client'
3 | import { Provider } from 'react-redux'
4 | import { store } from './app/store'
5 | import App from './App'
6 | import './index.css'
7 |
8 | import { worker } from './mocks/browser'
9 |
10 | // Initialize the msw worker, wait for the service worker registration to resolve, then mount
11 | async function render() {
12 | await worker.start()
13 |
14 | const rootNode = ReactDOM.createRoot(
15 | document.getElementById('root') as HTMLElement,
16 | )
17 |
18 | rootNode.render(
19 | Post
24 | {content} 25 |
9 |
10 |
17 |
18 | )
19 | }
20 |
21 | export default App
22 |
--------------------------------------------------------------------------------
/examples/publish-ci/cra5/src/app/hooks.ts:
--------------------------------------------------------------------------------
1 | import { TypedUseSelectorHook, useDispatch, useSelector } from 'react-redux'
2 | import type { RootState, AppDispatch } from './store'
3 |
4 | // Use throughout your app instead of plain `useDispatch` and `useSelector`
5 | export const useAppDispatch = () => useDispatch
5 | {children}
6 |
7 | )
8 |
--------------------------------------------------------------------------------
/examples/publish-ci/cra5/src/features/counter/counterAPI.ts:
--------------------------------------------------------------------------------
1 | // A mock function to mimic making an async request for data
2 | export function fetchCount(amount = 1) {
3 | return new Promise<{ data: number }>((resolve) =>
4 | setTimeout(() => resolve({ data: amount }), 500),
5 | )
6 | }
7 |
--------------------------------------------------------------------------------
/examples/publish-ci/cra5/src/features/posts/Post.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 |
3 | // import the file that injects "post" to make sure it has been loaded
4 | import { useGetPostQuery } from '../../app/services/post'
5 |
6 | export const Post = ({ id }: { id: number }) => {
7 | const { data, error } = useGetPostQuery(id)
8 | const content = error ? (
9 | <>there was an error
10 | ) : !data ? (
11 | <>loading
12 | ) : (
13 |
14 | Title:{' '}
15 |
16 | {data.name}
17 |
18 |
19 | )
20 |
21 | return (
22 |
23 |
26 | )
27 | }
28 | export default Post
29 |
--------------------------------------------------------------------------------
/examples/publish-ci/cra5/src/features/posts/PostsManager.css:
--------------------------------------------------------------------------------
1 | .posts-list {
2 | display: flex;
3 | flex-direction: column;
4 | flex-basis: 100%;
5 | flex: 1;
6 | min-height: 200px;
7 | border-right: 1px solid #eee;
8 | padding: 20px;
9 | text-align: left;
10 | }
11 |
--------------------------------------------------------------------------------
/examples/publish-ci/cra5/src/index.css:
--------------------------------------------------------------------------------
1 | body {
2 | margin: 0;
3 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
4 | 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
5 | sans-serif;
6 | -webkit-font-smoothing: antialiased;
7 | -moz-osx-font-smoothing: grayscale;
8 | }
9 |
10 | code {
11 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
12 | monospace;
13 | }
14 |
--------------------------------------------------------------------------------
/examples/publish-ci/cra5/src/index.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import ReactDOM from 'react-dom/client'
3 | import { Provider } from 'react-redux'
4 | import { store } from './app/store'
5 | import App from './App'
6 | import './index.css'
7 |
8 | import { worker } from './mocks/browser'
9 |
10 | // Initialize the msw worker, wait for the service worker registration to resolve, then mount
11 | async function render() {
12 | await worker.start()
13 |
14 | const rootNode = ReactDOM.createRoot(
15 | document.getElementById('root') as HTMLElement,
16 | )
17 |
18 | rootNode.render(
19 | Post
24 | {content} 25 |
5 | {children}
6 |
7 | )
8 |
--------------------------------------------------------------------------------
/examples/publish-ci/next/src/features/counter/counterAPI.ts:
--------------------------------------------------------------------------------
1 | // A mock function to mimic making an async request for data
2 | export function fetchCount(amount = 1) {
3 | return new Promise<{ data: number }>((resolve) =>
4 | setTimeout(() => resolve({ data: amount }), 500),
5 | )
6 | }
7 |
--------------------------------------------------------------------------------
/examples/publish-ci/next/src/features/posts/Post.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 |
3 | // import the file that injects "post" to make sure it has been loaded
4 | import { useGetPostQuery } from '../../app-core/services/post'
5 |
6 | export const Post = ({ id }: { id: number }) => {
7 | const { data, error } = useGetPostQuery(id)
8 | const content = error ? (
9 | <>there was an error
10 | ) : !data ? (
11 | <>loading
12 | ) : (
13 |
14 | Title:{' '}
15 |
16 | {data.name}
17 |
18 |
19 | )
20 |
21 | return (
22 |
23 |
26 | )
27 | }
28 | export default Post
29 |
--------------------------------------------------------------------------------
/examples/publish-ci/next/src/features/posts/PostsManager.css:
--------------------------------------------------------------------------------
1 | .posts-list {
2 | display: flex;
3 | flex-direction: column;
4 | flex-basis: 100%;
5 | flex: 1;
6 | min-height: 200px;
7 | border-right: 1px solid #eee;
8 | padding: 20px;
9 | text-align: left;
10 | }
11 |
--------------------------------------------------------------------------------
/examples/publish-ci/next/src/mocks/browser.ts:
--------------------------------------------------------------------------------
1 | import { setupWorker } from 'msw'
2 | import { handlers } from './handlers'
3 |
4 | export const worker = setupWorker(...handlers)
5 |
--------------------------------------------------------------------------------
/examples/publish-ci/next/src/mocks/mockServer.ts:
--------------------------------------------------------------------------------
1 | import { setupServer } from 'msw/node'
2 | import { handlers } from './handlers'
3 | import { state } from './handlers'
4 |
5 | export const mockServer = () => {
6 | const server = setupServer(...handlers)
7 |
8 | return { server, state }
9 | }
10 |
--------------------------------------------------------------------------------
/examples/publish-ci/next/src/mocks/node.ts:
--------------------------------------------------------------------------------
1 | import { setupServer } from 'msw/node'
2 | import { handlers } from './handlers'
3 | import { state } from './handlers'
4 |
5 | export const mockServer = () => {
6 | const server = setupServer(...handlers)
7 |
8 | return { server, state }
9 | }
10 |
--------------------------------------------------------------------------------
/examples/publish-ci/next/src/pages/_app.tsx:
--------------------------------------------------------------------------------
1 | import { useEffect, useState } from 'react'
2 | import '../styles/globals.css'
3 |
4 | import { Provider } from 'react-redux'
5 | import type { AppProps } from 'next/app'
6 |
7 | import { store } from '../app-core/store'
8 |
9 | export default function MyApp({ Component, pageProps }: AppProps) {
10 | const [showComponent, setShowComponent] = useState(false)
11 | useEffect(() => {
12 | ;(async () => {
13 | if (typeof window !== 'undefined') {
14 | const { worker } = await import('../mocks/browser')
15 | await worker.start()
16 | setShowComponent(true)
17 | }
18 | })()
19 | }, [])
20 | return (
21 | Post
24 | {content} 25 |
12 |
13 |
20 |
21 | )
22 | }
23 |
24 | export default IndexPage
25 |
--------------------------------------------------------------------------------
/examples/publish-ci/next/src/styles/Home.module.css:
--------------------------------------------------------------------------------
1 | .container {
2 | text-align: center;
3 | }
4 |
5 | .logo {
6 | height: 40vmin;
7 | pointer-events: none;
8 | }
9 |
10 | .header {
11 | min-height: 100vh;
12 | display: flex;
13 | flex-direction: column;
14 | align-items: center;
15 | justify-content: center;
16 | font-size: calc(10px + 2vmin);
17 | }
18 |
19 | .link {
20 | color: rgb(112, 76, 182);
21 | }
22 |
23 | @media (prefers-reduced-motion: no-preference) {
24 | .logo {
25 | animation: logo-float infinite 3s ease-in-out;
26 | }
27 | }
28 |
29 | @keyframes logo-float {
30 | 0% {
31 | transform: translateY(0);
32 | }
33 | 50% {
34 | transform: translateY(10px);
35 | }
36 | 100% {
37 | transform: translateY(0px);
38 | }
39 | }
40 |
--------------------------------------------------------------------------------
/examples/publish-ci/next/src/styles/globals.css:
--------------------------------------------------------------------------------
1 | html,
2 | body {
3 | padding: 0;
4 | margin: 0;
5 | font-family:
6 | -apple-system,
7 | BlinkMacSystemFont,
8 | Segoe UI,
9 | Roboto,
10 | Oxygen,
11 | Ubuntu,
12 | Cantarell,
13 | Fira Sans,
14 | Droid Sans,
15 | Helvetica Neue,
16 | sans-serif;
17 | }
18 |
19 | .App {
20 | text-align: center;
21 | }
22 |
23 | .App-header {
24 | min-height: 100vh;
25 | display: flex;
26 | flex-direction: column;
27 | align-items: center;
28 | justify-content: flex-start;
29 | font-size: calc(10px + 2vmin);
30 | }
31 |
32 | a {
33 | color: inherit;
34 | text-decoration: none;
35 | }
36 |
37 | * {
38 | box-sizing: border-box;
39 | }
40 |
--------------------------------------------------------------------------------
/examples/publish-ci/next/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "target": "es5",
4 | "lib": ["dom", "dom.iterable", "esnext"],
5 | "allowJs": true,
6 | "skipLibCheck": true,
7 | "strict": false,
8 | "forceConsistentCasingInFileNames": true,
9 | "noEmit": true,
10 | "esModuleInterop": true,
11 | "module": "esnext",
12 | "moduleResolution": "node",
13 | "resolveJsonModule": true,
14 | "isolatedModules": true,
15 | "jsx": "preserve",
16 | "incremental": true
17 | },
18 | "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"],
19 | "exclude": ["node_modules"]
20 | }
21 |
--------------------------------------------------------------------------------
/examples/publish-ci/next/tsconfig.test.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "./tsconfig.json",
3 | "compilerOptions": {
4 | "jsx": "react-jsx"
5 | }
6 | }
7 |
--------------------------------------------------------------------------------
/examples/publish-ci/node-esm/.gitignore:
--------------------------------------------------------------------------------
1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
2 |
3 | # dependencies
4 | /node_modules
5 | /.pnp
6 | .pnp.js
7 |
8 | # testing
9 | /coverage
10 |
11 | # production
12 | /build
13 |
14 | # misc
15 | .DS_Store
16 | .env.local
17 | .env.development.local
18 | .env.test.local
19 | .env.production.local
20 |
21 | npm-debug.log*
22 | yarn-debug.log*
23 | yarn-error.log*
24 |
25 | typesversions
26 | .cache
27 | .yarnrc
28 | .yarn/*
29 | !.yarn/patches
30 | !.yarn/releases
31 | !.yarn/plugins
32 | !.yarn/sdks
33 | !.yarn/versions
34 | .pnp.*
35 | *.tgz
36 |
--------------------------------------------------------------------------------
/examples/publish-ci/node-esm/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "dual-module-test",
3 | "version": "1.0.0",
4 | "license": "MIT",
5 | "type": "module",
6 | "scripts": {
7 | "build": "echo Done",
8 | "test": "node --no-experimental-require-module test-cjs.cjs && node test-esm.mjs"
9 | },
10 | "dependencies": {
11 | "@reduxjs/toolkit": "^2.0.0-rc.3",
12 | "react": "^18.2.0",
13 | "react-dom": "^18.2.0",
14 | "react-redux": "^9.0.0-rc.0"
15 | },
16 | "devDependencies": {
17 | "resolve-esm": "^1.4.0"
18 | }
19 | }
20 |
--------------------------------------------------------------------------------
/examples/publish-ci/node-standard/.gitignore:
--------------------------------------------------------------------------------
1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
2 |
3 | # dependencies
4 | /node_modules
5 | /.pnp
6 | .pnp.js
7 |
8 | # testing
9 | /coverage
10 |
11 | # production
12 | /build
13 |
14 | # misc
15 | .DS_Store
16 | .env.local
17 | .env.development.local
18 | .env.test.local
19 | .env.production.local
20 |
21 | npm-debug.log*
22 | yarn-debug.log*
23 | yarn-error.log*
24 |
25 | typesversions
26 | .cache
27 | .yarnrc
28 | .yarn/*
29 | !.yarn/patches
30 | !.yarn/releases
31 | !.yarn/plugins
32 | !.yarn/sdks
33 | !.yarn/versions
34 | .pnp.*
35 | *.tgz
36 |
--------------------------------------------------------------------------------
/examples/publish-ci/node-standard/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "dual-module-test",
3 | "version": "1.0.0",
4 | "license": "MIT",
5 | "scripts": {
6 | "build": "echo Done",
7 | "test": "node --no-experimental-require-module test-cjs.js && node test-esm.mjs"
8 | },
9 | "dependencies": {
10 | "@reduxjs/toolkit": "^2.0.0-rc.3",
11 | "react": "^18.2.0",
12 | "react-dom": "^18.2.0",
13 | "react-redux": "^9.0.0-rc.0"
14 | },
15 | "devDependencies": {
16 | "resolve-esm": "^1.4.0"
17 | }
18 | }
19 |
--------------------------------------------------------------------------------
/examples/publish-ci/react-native/.bundle/config:
--------------------------------------------------------------------------------
1 | BUNDLE_PATH: "vendor/bundle"
2 | BUNDLE_FORCE_RUBY_PLATFORM: 1
3 |
--------------------------------------------------------------------------------
/examples/publish-ci/react-native/.prettierrc.json:
--------------------------------------------------------------------------------
1 | {
2 | "arrowParens": "avoid",
3 | "semi": false,
4 | "singleQuote": true
5 | }
6 |
--------------------------------------------------------------------------------
/examples/publish-ci/react-native/.watchmanconfig:
--------------------------------------------------------------------------------
1 | {}
2 |
--------------------------------------------------------------------------------
/examples/publish-ci/react-native/Gemfile:
--------------------------------------------------------------------------------
1 | source 'https://rubygems.org'
2 |
3 | # You may use http://rbenv.org/ or https://rvm.io/ to install and use this version
4 | ruby ">= 2.6.10"
5 |
6 | # Exclude problematic versions of cocoapods and activesupport that causes build failures.
7 | gem 'cocoapods', '>= 1.13', '!= 1.15.0', '!= 1.15.1'
8 | gem 'activesupport', '>= 6.1.7.5', '!= 7.1.0'
9 | gem 'xcodeproj', '< 1.26.0'
10 |
--------------------------------------------------------------------------------
/examples/publish-ci/react-native/android/app/debug.keystore:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/reduxjs/redux-toolkit/af3e75bb9e6a51e13603d2a5684ef3ba1da07e3b/examples/publish-ci/react-native/android/app/debug.keystore
--------------------------------------------------------------------------------
/examples/publish-ci/react-native/android/app/proguard-rules.pro:
--------------------------------------------------------------------------------
1 | # Add project specific ProGuard rules here.
2 | # By default, the flags in this file are appended to flags specified
3 | # in /usr/local/Cellar/android-sdk/24.3.3/tools/proguard/proguard-android.txt
4 | # You can edit the include path and order by changing the proguardFiles
5 | # directive in build.gradle.
6 | #
7 | # For more details, see
8 | # http://developer.android.com/guide/developing/tools/proguard.html
9 |
10 | # Add any project specific keep options here:
11 |
--------------------------------------------------------------------------------
/examples/publish-ci/react-native/android/app/src/debug/AndroidManifest.xml:
--------------------------------------------------------------------------------
1 |
2 |
9 |
10 |
17 |
18 | )
19 | }
20 |
21 | export default App
22 |
--------------------------------------------------------------------------------
/examples/publish-ci/vite/src/app/hooks.ts:
--------------------------------------------------------------------------------
1 | import { TypedUseSelectorHook, useDispatch, useSelector } from 'react-redux'
2 | import type { RootState, AppDispatch } from './store'
3 |
4 | // Use throughout your app instead of plain `useDispatch` and `useSelector`
5 | export const useAppDispatch = () => useDispatch
5 | {children}
6 |
7 | )
8 |
--------------------------------------------------------------------------------
/examples/publish-ci/vite/src/features/counter/counterAPI.ts:
--------------------------------------------------------------------------------
1 | // A mock function to mimic making an async request for data
2 | export function fetchCount(amount = 1) {
3 | return new Promise<{ data: number }>((resolve) =>
4 | setTimeout(() => resolve({ data: amount }), 500),
5 | )
6 | }
7 |
--------------------------------------------------------------------------------
/examples/publish-ci/vite/src/features/posts/Post.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 |
3 | // import the file that injects "post" to make sure it has been loaded
4 | import { useGetPostQuery } from '../../app/services/post'
5 |
6 | export const Post = ({ id }: { id: number }) => {
7 | const { data, error } = useGetPostQuery(id)
8 | const content = error ? (
9 | <>there was an error
10 | ) : !data ? (
11 | <>loading
12 | ) : (
13 |
14 | Title:{' '}
15 |
16 | {data.name}
17 |
18 |
19 | )
20 |
21 | return (
22 |
23 |
26 | )
27 | }
28 | export default Post
29 |
--------------------------------------------------------------------------------
/examples/publish-ci/vite/src/features/posts/PostsManager.css:
--------------------------------------------------------------------------------
1 | .posts-list {
2 | display: flex;
3 | flex-direction: column;
4 | flex-basis: 100%;
5 | flex: 1;
6 | min-height: 200px;
7 | border-right: 1px solid #eee;
8 | padding: 20px;
9 | text-align: left;
10 | }
11 |
--------------------------------------------------------------------------------
/examples/publish-ci/vite/src/index.css:
--------------------------------------------------------------------------------
1 | body {
2 | margin: 0;
3 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
4 | 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
5 | sans-serif;
6 | -webkit-font-smoothing: antialiased;
7 | -moz-osx-font-smoothing: grayscale;
8 | }
9 |
10 | code {
11 | font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
12 | monospace;
13 | }
14 |
--------------------------------------------------------------------------------
/examples/publish-ci/vite/src/main.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import ReactDOM from 'react-dom/client'
3 | import { Provider } from 'react-redux'
4 | import { store } from './app/store'
5 | import App from './App'
6 | import './index.css'
7 |
8 | import { worker } from './mocks/browser'
9 |
10 | // Initialize the msw worker, wait for the service worker registration to resolve, then mount
11 | async function render() {
12 | await worker.start()
13 |
14 | const rootNode = ReactDOM.createRoot(
15 | document.getElementById('root') as HTMLElement,
16 | )
17 |
18 | rootNode.render(
19 | Post
24 | {content} 25 |
12 |
19 |
25 | )
26 | }
27 |
--------------------------------------------------------------------------------
/examples/query/react/advanced/src/Pokemon.tsx:
--------------------------------------------------------------------------------
1 | import { useGetPokemonByNameQuery } from './services/pokemon'
2 |
3 | export const Pokemon = ({
4 | name,
5 | pollingInterval,
6 | }: {
7 | name: string
8 | pollingInterval: number
9 | }) => {
10 | const { data, error, isLoading, isFetching } = useGetPokemonByNameQuery(
11 | name,
12 | {
13 | pollingInterval,
14 | },
15 | )
16 |
17 | return (
18 | <>
19 | {error ? (
20 | <>Oh no, there was an error
21 | ) : isLoading ? (
22 | <>Loading...
23 | ) : data ? (
24 | <>
25 |
20 | {pokemon.map((poke, index) => (
21 |
24 | 26 | {data.species.name} {isFetching ? '...' : ''} 27 |
28 |
9 | {error ? (
10 | <>Oh no, there was an error
11 | ) : isLoading ? (
12 | <>Loading...
13 | ) : data ? (
14 | <>
15 | 
17 |
18 | ) : null}
19 |
20 | )
21 | }
22 |
--------------------------------------------------------------------------------
/examples/query/react/basic/src/index.tsx:
--------------------------------------------------------------------------------
1 | import ReactDOM from 'react-dom/client'
2 | import { Provider } from 'react-redux'
3 |
4 | import App from './App'
5 | import { setupStore } from './store'
6 |
7 | const store = setupStore()
8 |
9 | const reactRoot = ReactDOM.createRoot(
10 | document.getElementById('root') as HTMLElement,
11 | )
12 | reactRoot.render(
13 | {data.species.name}
16 |
5 | {children}
6 |
7 | )
8 |
--------------------------------------------------------------------------------
/examples/query/react/kitchen-sink/src/features/posts/PostsManager.css:
--------------------------------------------------------------------------------
1 | .posts-list {
2 | display: flex;
3 | flex-direction: column;
4 | flex-basis: 100%;
5 | flex: 1;
6 | min-height: 200px;
7 | border-right: 1px solid #eee;
8 | padding: 20px;
9 | text-align: left;
10 | }
11 |
--------------------------------------------------------------------------------
/examples/query/react/kitchen-sink/src/mocks/browser.ts:
--------------------------------------------------------------------------------
1 | import { setupWorker } from 'msw'
2 | import { handlers } from './handlers'
3 |
4 | export const worker = setupWorker(...handlers)
5 |
--------------------------------------------------------------------------------
/examples/query/react/kitchen-sink/src/mocks/mockServer.ts:
--------------------------------------------------------------------------------
1 | import { setupServer } from 'msw/node'
2 | import { handlers } from './handlers'
3 | import { state } from './handlers'
4 |
5 | export const mockServer = () => {
6 | const server = setupServer(...handlers)
7 |
8 | return { server, state }
9 | }
10 |
--------------------------------------------------------------------------------
/examples/query/react/kitchen-sink/src/react-app-env.d.ts:
--------------------------------------------------------------------------------
1 | /// {data.name}
24 | ) 25 | } 26 | 27 | export default Post 28 | -------------------------------------------------------------------------------- /examples/type-portability/bundler/src/features/bundleSplitting/PostsList.tsx: -------------------------------------------------------------------------------- 1 | import { useState } from 'react' 2 | import { Post } from '.' 3 | import { postsApi } from '../../app/services/posts' 4 | 5 | export const PostsList = () => { 6 | const { data, error } = postsApi.endpoints.getPosts.useQuery() 7 | const [selected, select] = useState-
17 | {data.map((post) => (
18 |
- 19 | 20 | 21 | ))} 22 |
5 | {children}
6 |
7 | )
8 |
--------------------------------------------------------------------------------
/examples/type-portability/bundler/src/index.tsx:
--------------------------------------------------------------------------------
1 | import * as React from 'react'
2 | import { createRoot } from 'react-dom/client'
3 | import { Provider } from 'react-redux'
4 | import App from './App'
5 | import { store } from './app/store'
6 |
7 | export const container = document.getElementById('root')
8 |
9 | if (container) {
10 | const root = createRoot(container)
11 |
12 | root.render(
13 | {data.name}
22 | ) 23 | } 24 | 25 | export = Post 26 | -------------------------------------------------------------------------------- /examples/type-portability/nodenext-cjs/src/features/bundleSplitting/index.ts: -------------------------------------------------------------------------------- 1 | import React = require('react') 2 | import lazyModule = require('./Lazy.js') 3 | 4 | namespace bundleSplitting { 5 | import lazy = React.lazy 6 | 7 | export const PostsList = lazy(() => import('./PostsList.js')) 8 | 9 | export const Post = lazy(() => import('./Post.js')) 10 | 11 | export import Lazy = lazyModule.Lazy 12 | } 13 | 14 | export = bundleSplitting 15 | -------------------------------------------------------------------------------- /examples/type-portability/nodenext-cjs/src/features/common/Container.tsx: -------------------------------------------------------------------------------- 1 | import type { FC, ReactNode } from 'react' 2 | 3 | const Container: FC<{ children: ReactNode }> = ({ children }) => ( 4 |
5 | {children}
6 |
7 | )
8 |
9 | export = { Container }
10 |
--------------------------------------------------------------------------------
/examples/type-portability/nodenext-esm/src/app/dynamicMiddleware.ts:
--------------------------------------------------------------------------------
1 | import { createDynamicMiddleware } from '@reduxjs/toolkit'
2 |
3 | export const dynamicMiddleware = createDynamicMiddleware()
4 |
5 | export const { addMiddleware, instanceId, middleware, withMiddleware } =
6 | dynamicMiddleware
7 |
8 | export const { withTypes, match, type } = withMiddleware
9 |
10 | export const { withTypes: _withTypes } = addMiddleware
11 |
--------------------------------------------------------------------------------
/examples/type-portability/nodenext-esm/src/app/dynamicReactMiddleware.ts:
--------------------------------------------------------------------------------
1 | import { createDynamicMiddleware } from '@reduxjs/toolkit/react'
2 | import { listenerMiddleware } from './listenerMiddleware.js'
3 |
4 | export const dynamicReactMiddleware = createDynamicMiddleware()
5 |
6 | export const {
7 | addMiddleware,
8 | createDispatchWithMiddlewareHook,
9 | createDispatchWithMiddlewareHookFactory,
10 | instanceId,
11 | middleware,
12 | withMiddleware,
13 | } = dynamicReactMiddleware
14 |
15 | export const { withTypes } = addMiddleware
16 |
17 | export const useDispatchWithMiddleware = createDispatchWithMiddlewareHook(
18 | listenerMiddleware.middleware,
19 | )
20 |
--------------------------------------------------------------------------------
/examples/type-portability/nodenext-esm/src/app/hooks.ts:
--------------------------------------------------------------------------------
1 | import { useDispatch, useSelector, useStore } from 'react-redux'
2 | import type { AppDispatch, AppStore, RootState } from './store.js'
3 |
4 | export const useAppDispatch = useDispatch.withTypes{data.name}
24 | ) 25 | } 26 | 27 | export default Post 28 | -------------------------------------------------------------------------------- /examples/type-portability/nodenext-esm/src/features/bundleSplitting/PostsList.tsx: -------------------------------------------------------------------------------- 1 | import { useState } from 'react' 2 | import { postsApi } from '../../app/services/posts.js' 3 | import { Post } from './index.js' 4 | 5 | export const PostsList = () => { 6 | const { data, error } = postsApi.endpoints.getPosts.useQuery() 7 | const [selected, select] = useState-
17 | {data.map((post) => (
18 |
- 19 | 20 | 21 | ))} 22 |
5 | {children}
6 |
7 | )
8 |
--------------------------------------------------------------------------------
/examples/type-portability/nodenext-esm/src/index.tsx:
--------------------------------------------------------------------------------
1 | import * as React from 'react'
2 | import { createRoot } from 'react-dom/client'
3 | import { Provider } from 'react-redux'
4 | import App from './App.js'
5 | import { store } from './app/store.js'
6 |
7 | export const container = document.getElementById('root')
8 |
9 | if (container) {
10 | const root = createRoot(container)
11 |
12 | root.render(
13 |
2 | 
3 |
5 | Code Generator 6 |
7 | 8 |
9 |
10 | 