Skip to content

Commit bcef686

Browse files
committed
log prevState, event and next state
1 parent 77b41d5 commit bcef686

File tree

5 files changed

+125
-0
lines changed

5 files changed

+125
-0
lines changed

.gitignore

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -102,3 +102,5 @@ dist
102102

103103
# TernJS port file
104104
.tern-port
105+
106+
lib

package.json

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
{
2+
"name": "xstate-logger",
3+
"version": "0.0.1",
4+
"main": "lib/index.js",
5+
"types": "lib/index.d.ts",
6+
"repository": "[email protected]:codingedgar/xstate-logger.git",
7+
"author": "codingedgar <[email protected]>",
8+
"license": "MIT",
9+
"description": "redux-logger but for XState",
10+
"files": ["lib/**/*"],
11+
"scripts": {
12+
"build": "tsc"
13+
},
14+
"dependencies": {
15+
"typescript": "4.2.4"
16+
},
17+
"peerDependencies": {
18+
"xstate": "^4.11.0"
19+
}
20+
}

src/index.ts

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
import { EventObject, State } from 'xstate';
2+
3+
export function xstateLogger<TContext, TEvents extends EventObject>(
4+
s: State<
5+
TContext,
6+
TEvents,
7+
any,
8+
{
9+
value: any;
10+
context: TContext;
11+
}
12+
>
13+
) {
14+
console.groupCollapsed(
15+
'%c event',
16+
'color: gray; font-weight: lighter;',
17+
s.event.type
18+
);
19+
console.log('%c prev state', 'color: #9E9E9E; font-weight: bold;', s.history);
20+
console.log('%c event', 'color: #03A9F4; font-weight: bold;', s.event);
21+
console.log('%c next state', 'color: #4CAF50; font-weight: bold;', s);
22+
console.groupEnd();
23+
}

tsconfig.json

Lines changed: 72 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,72 @@
1+
{
2+
"compilerOptions": {
3+
/* Visit https://aka.ms/tsconfig.json to read more about this file */
4+
5+
/* Basic Options */
6+
// "incremental": true, /* Enable incremental compilation */
7+
"target": "es5", /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', 'ES2018', 'ES2019', 'ES2020', or 'ESNEXT'. */
8+
"module": "commonjs", /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', 'es2020', or 'ESNext'. */
9+
// "lib": [], /* Specify library files to be included in the compilation. */
10+
// "allowJs": true, /* Allow javascript files to be compiled. */
11+
// "checkJs": true, /* Report errors in .js files. */
12+
// "jsx": "preserve", /* Specify JSX code generation: 'preserve', 'react-native', or 'react'. */
13+
"declaration": true, /* Generates corresponding '.d.ts' file. */
14+
// "declarationMap": true, /* Generates a sourcemap for each corresponding '.d.ts' file. */
15+
// "sourceMap": true, /* Generates corresponding '.map' file. */
16+
// "outFile": "./", /* Concatenate and emit output to single file. */
17+
"outDir": "./lib", /* Redirect output structure to the directory. */
18+
// "rootDir": "./", /* Specify the root directory of input files. Use to control the output directory structure with --outDir. */
19+
// "composite": true, /* Enable project compilation */
20+
// "tsBuildInfoFile": "./", /* Specify file to store incremental compilation information */
21+
// "removeComments": true, /* Do not emit comments to output. */
22+
// "noEmit": true, /* Do not emit outputs. */
23+
// "importHelpers": true, /* Import emit helpers from 'tslib'. */
24+
// "downlevelIteration": true, /* Provide full support for iterables in 'for-of', spread, and destructuring when targeting 'ES5' or 'ES3'. */
25+
// "isolatedModules": true, /* Transpile each file as a separate module (similar to 'ts.transpileModule'). */
26+
27+
/* Strict Type-Checking Options */
28+
"strict": true, /* Enable all strict type-checking options. */
29+
// "noImplicitAny": true, /* Raise error on expressions and declarations with an implied 'any' type. */
30+
// "strictNullChecks": true, /* Enable strict null checks. */
31+
// "strictFunctionTypes": true, /* Enable strict checking of function types. */
32+
// "strictBindCallApply": true, /* Enable strict 'bind', 'call', and 'apply' methods on functions. */
33+
// "strictPropertyInitialization": true, /* Enable strict checking of property initialization in classes. */
34+
// "noImplicitThis": true, /* Raise error on 'this' expressions with an implied 'any' type. */
35+
// "alwaysStrict": true, /* Parse in strict mode and emit "use strict" for each source file. */
36+
37+
/* Additional Checks */
38+
// "noUnusedLocals": true, /* Report errors on unused locals. */
39+
// "noUnusedParameters": true, /* Report errors on unused parameters. */
40+
// "noImplicitReturns": true, /* Report error when not all code paths in function return a value. */
41+
// "noFallthroughCasesInSwitch": true, /* Report errors for fallthrough cases in switch statement. */
42+
// "noUncheckedIndexedAccess": true, /* Include 'undefined' in index signature results */
43+
44+
/* Module Resolution Options */
45+
// "moduleResolution": "node", /* Specify module resolution strategy: 'node' (Node.js) or 'classic' (TypeScript pre-1.6). */
46+
// "baseUrl": "./", /* Base directory to resolve non-absolute module names. */
47+
// "paths": {}, /* A series of entries which re-map imports to lookup locations relative to the 'baseUrl'. */
48+
// "rootDirs": [], /* List of root folders whose combined content represents the structure of the project at runtime. */
49+
// "typeRoots": [], /* List of folders to include type definitions from. */
50+
// "types": [], /* Type declaration files to be included in compilation. */
51+
// "allowSyntheticDefaultImports": true, /* Allow default imports from modules with no default export. This does not affect code emit, just typechecking. */
52+
"esModuleInterop": true, /* Enables emit interoperability between CommonJS and ES Modules via creation of namespace objects for all imports. Implies 'allowSyntheticDefaultImports'. */
53+
// "preserveSymlinks": true, /* Do not resolve the real path of symlinks. */
54+
// "allowUmdGlobalAccess": true, /* Allow accessing UMD globals from modules. */
55+
56+
/* Source Map Options */
57+
// "sourceRoot": "", /* Specify the location where debugger should locate TypeScript files instead of source locations. */
58+
// "mapRoot": "", /* Specify the location where debugger should locate map files instead of generated locations. */
59+
// "inlineSourceMap": true, /* Emit a single file with source maps instead of having a separate file. */
60+
// "inlineSources": true, /* Emit the source alongside the sourcemaps within a single file; requires '--inlineSourceMap' or '--sourceMap' to be set. */
61+
62+
/* Experimental Options */
63+
// "experimentalDecorators": true, /* Enables experimental support for ES7 decorators. */
64+
// "emitDecoratorMetadata": true, /* Enables experimental support for emitting type metadata for decorators. */
65+
66+
/* Advanced Options */
67+
"skipLibCheck": true, /* Skip type checking of declaration files. */
68+
"forceConsistentCasingInFileNames": true /* Disallow inconsistently-cased references to the same file. */
69+
},
70+
"include": ["src"],
71+
"exclude": ["node_modules"]
72+
}

yarn.lock

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
2+
# yarn lockfile v1
3+
4+
5+
6+
version "4.2.4"
7+
resolved "https://registry.yarnpkg.com/typescript/-/typescript-4.2.4.tgz#8610b59747de028fda898a8aef0e103f156d0961"
8+
integrity sha512-V+evlYHZnQkaz8TRBuxTA92yZBPotr5H+WhQ7bD3hZUndx5tGOa1fuCgeSjxAzM1RiN5IzvadIXTVefuuwZCRg==

0 commit comments

Comments
 (0)