@walkrstudio/cli 0.2.0 → 0.2.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +45 -30
- package/dist/dev.d.ts.map +1 -1
- package/dist/dev.js +4 -2
- package/dist/dev.js.map +1 -1
- package/package.json +5 -12
package/README.md
CHANGED
|
@@ -1,51 +1,64 @@
|
|
|
1
|
-
# @
|
|
1
|
+
# @walkrstudio/cli
|
|
2
2
|
|
|
3
|
-
CLI for
|
|
3
|
+
CLI for previewing and exporting Walkr walkthroughs.
|
|
4
4
|
|
|
5
5
|
## Install
|
|
6
6
|
|
|
7
7
|
```bash
|
|
8
|
-
npm install -g @
|
|
8
|
+
npm install -g @walkrstudio/cli
|
|
9
9
|
```
|
|
10
10
|
|
|
11
|
-
Or run without global install:
|
|
11
|
+
Or run without a global install:
|
|
12
12
|
|
|
13
13
|
```bash
|
|
14
|
-
npx walkr
|
|
14
|
+
npx walkr <command>
|
|
15
15
|
```
|
|
16
16
|
|
|
17
17
|
## Commands
|
|
18
18
|
|
|
19
19
|
### `walkr dev <script>`
|
|
20
20
|
|
|
21
|
-
Opens Walkr Studio with live reload.
|
|
21
|
+
Opens Walkr Studio with live reload. Write your walkthrough script, and the preview updates every time you save.
|
|
22
22
|
|
|
23
23
|
```bash
|
|
24
24
|
walkr dev demo.ts
|
|
25
25
|
```
|
|
26
26
|
|
|
27
|
+
This starts a Vite dev server on port 5174, loads your script, proxies the target website, and opens the Studio UI in your browser.
|
|
28
|
+
|
|
27
29
|
### `walkr export <script> [options]`
|
|
28
30
|
|
|
29
|
-
Exports a walkthrough to
|
|
31
|
+
Exports a walkthrough to video or a self-contained HTML embed.
|
|
30
32
|
|
|
31
33
|
```bash
|
|
32
|
-
|
|
33
|
-
|
|
34
|
+
# MP4 (default)
|
|
35
|
+
walkr export demo.ts
|
|
34
36
|
|
|
35
|
-
|
|
37
|
+
# GIF
|
|
38
|
+
walkr export demo.ts --format gif --output demo.gif
|
|
36
39
|
|
|
37
|
-
|
|
40
|
+
# Self-contained HTML embed
|
|
41
|
+
walkr export demo.ts --format embed --output demo.html
|
|
42
|
+
```
|
|
38
43
|
|
|
39
|
-
|
|
44
|
+
**Options:**
|
|
40
45
|
|
|
41
|
-
|
|
|
46
|
+
| Flag | Type | Default | Description |
|
|
42
47
|
| --- | --- | --- | --- |
|
|
43
48
|
| `--format` | `mp4 \| gif \| webm \| embed` | `mp4` | Output format. |
|
|
44
|
-
| `--output` | `string` | `output.<ext>` | Output path.
|
|
49
|
+
| `--output` | `string` | `output.<ext>` | Output file path. |
|
|
45
50
|
| `--width` | `number` | `1920` | Render width in px. |
|
|
46
51
|
| `--height` | `number` | `1080` | Render height in px. |
|
|
47
52
|
|
|
48
|
-
|
|
53
|
+
### `walkr --help`
|
|
54
|
+
|
|
55
|
+
Shows command usage and examples.
|
|
56
|
+
|
|
57
|
+
### `walkr --version`
|
|
58
|
+
|
|
59
|
+
Prints the current version.
|
|
60
|
+
|
|
61
|
+
## Example walkthrough script
|
|
49
62
|
|
|
50
63
|
```ts
|
|
51
64
|
import {
|
|
@@ -54,18 +67,17 @@ import {
|
|
|
54
67
|
click,
|
|
55
68
|
type,
|
|
56
69
|
highlight,
|
|
57
|
-
scroll,
|
|
58
70
|
wait,
|
|
59
|
-
|
|
60
|
-
parallel,
|
|
71
|
+
scroll,
|
|
61
72
|
zoom,
|
|
62
73
|
pan,
|
|
63
|
-
|
|
74
|
+
sequence,
|
|
75
|
+
parallel,
|
|
76
|
+
} from "@walkrstudio/core";
|
|
64
77
|
|
|
65
78
|
export default walkr({
|
|
66
|
-
url: "https://
|
|
67
|
-
title: "
|
|
68
|
-
description: "A complete scripted walkthrough for local preview/export",
|
|
79
|
+
url: "https://your-app.com",
|
|
80
|
+
title: "Product demo",
|
|
69
81
|
cursor: {
|
|
70
82
|
shape: "circle",
|
|
71
83
|
color: "#22d3ee",
|
|
@@ -74,9 +86,10 @@ export default walkr({
|
|
|
74
86
|
clickColor: "#0ea5e9",
|
|
75
87
|
},
|
|
76
88
|
steps: [
|
|
77
|
-
moveTo(
|
|
78
|
-
click(
|
|
79
|
-
type("hello@example.com", { selector: "input
|
|
89
|
+
moveTo("#email-input", { duration: 600 }),
|
|
90
|
+
click("#email-input"),
|
|
91
|
+
type("hello@example.com", { selector: "#email-input", delay: 35 }),
|
|
92
|
+
|
|
80
93
|
parallel(
|
|
81
94
|
highlight(".submit-btn", {
|
|
82
95
|
spotlight: true,
|
|
@@ -86,10 +99,11 @@ export default walkr({
|
|
|
86
99
|
}),
|
|
87
100
|
sequence(
|
|
88
101
|
wait(200),
|
|
89
|
-
moveTo(
|
|
102
|
+
moveTo(".submit-btn", { duration: 500 }),
|
|
90
103
|
),
|
|
91
104
|
),
|
|
92
|
-
click(
|
|
105
|
+
click(".submit-btn"),
|
|
106
|
+
|
|
93
107
|
sequence(
|
|
94
108
|
wait(300),
|
|
95
109
|
scroll(0, 700, { smooth: true }),
|
|
@@ -103,6 +117,7 @@ export default walkr({
|
|
|
103
117
|
|
|
104
118
|
## Requirements
|
|
105
119
|
|
|
106
|
-
- Node.js
|
|
107
|
-
- `
|
|
108
|
-
- `@
|
|
120
|
+
- Node.js >= 18
|
|
121
|
+
- `@walkrstudio/core` — defines the walkthrough
|
|
122
|
+
- `@walkrstudio/playwright` — required for `walkr export` (peer dependency)
|
|
123
|
+
- `ffmpeg` — required on your system PATH for video encoding (mp4/gif/webm)
|
package/dist/dev.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dev.d.ts","sourceRoot":"","sources":["../src/dev.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"dev.d.ts","sourceRoot":"","sources":["../src/dev.ts"],"names":[],"mappings":"AAiCA,wBAAsB,UAAU,CAAC,UAAU,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC,CAwFlE"}
|
package/dist/dev.js
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { spawn } from "node:child_process";
|
|
2
2
|
import { mkdirSync, rmSync, writeFileSync } from "node:fs";
|
|
3
|
+
import { createRequire } from "node:module";
|
|
3
4
|
import { dirname, resolve } from "node:path";
|
|
4
5
|
import { loadScriptWalkthrough, watchScript } from "./watch.js";
|
|
5
6
|
const STUDIO_PORT = 5174;
|
|
@@ -21,8 +22,9 @@ function writeWalkthroughJson(path, walkthrough, targetOrigin) {
|
|
|
21
22
|
}
|
|
22
23
|
export async function devCommand(scriptPath) {
|
|
23
24
|
const resolvedScript = resolve(process.cwd(), scriptPath);
|
|
24
|
-
// Resolve the studio package path
|
|
25
|
-
const
|
|
25
|
+
// Resolve the studio package path from node_modules
|
|
26
|
+
const require = createRequire(import.meta.url);
|
|
27
|
+
const studioRoot = dirname(require.resolve("@walkr/studio/package.json"));
|
|
26
28
|
// Write loaded walkthrough JSON to Studio's public dir so it can fetch on startup
|
|
27
29
|
const walkthroughJsonPath = resolve(studioRoot, "public", "walkthrough.json");
|
|
28
30
|
mkdirSync(dirname(walkthroughJsonPath), { recursive: true });
|
package/dist/dev.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dev.js","sourceRoot":"","sources":["../src/dev.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAC3C,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAC3D,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAE7C,OAAO,EAAE,qBAAqB,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AAEhE,MAAM,WAAW,GAAG,IAAI,CAAC;AACzB,MAAM,YAAY,GAAG,aAAa,CAAC;AAEnC,SAAS,WAAW,CAAC,GAAW;IAC9B,MAAM,KAAK,GACT,OAAO,CAAC,QAAQ,KAAK,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,CAAC,QAAQ,KAAK,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,UAAU,CAAC;IAE/F,KAAK,CAAC,KAAK,EAAE,CAAC,GAAG,CAAC,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE,KAAK,EAAE,QAAQ,EAAE,CAAC,CAAC,KAAK,EAAE,CAAC;AACnE,CAAC;AAED,SAAS,qBAAqB,CAC5B,WAAwB,EACxB,YAAoB;IAEpB,OAAO;QACL,GAAG,WAAW;QACd,WAAW,EAAE,WAAW,CAAC,GAAG;QAC5B,GAAG,EAAE,WAAW,CAAC,GAAG,CAAC,OAAO,CAAC,YAAY,EAAE,YAAY,CAAC;KACzD,CAAC;AACJ,CAAC;AAED,SAAS,oBAAoB,CAAC,IAAY,EAAE,WAAwB,EAAE,YAAoB;IACxF,MAAM,OAAO,GAAG,YAAY,CAAC,CAAC,CAAC,qBAAqB,CAAC,WAAW,EAAE,YAAY,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC;IAC9F,aAAa,CAAC,IAAI,EAAE,IAAI,CAAC,SAAS,CAAC,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC;AACxD,CAAC;AAED,MAAM,CAAC,KAAK,UAAU,UAAU,CAAC,UAAkB;IACjD,MAAM,cAAc,GAAG,OAAO,CAAC,OAAO,CAAC,GAAG,EAAE,EAAE,UAAU,CAAC,CAAC;IAE1D,
|
|
1
|
+
{"version":3,"file":"dev.js","sourceRoot":"","sources":["../src/dev.ts"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@walkrstudio/cli",
|
|
3
|
-
"version": "0.2.
|
|
3
|
+
"version": "0.2.2",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"types": "dist/index.d.ts",
|
|
@@ -14,19 +14,12 @@
|
|
|
14
14
|
"access": "public"
|
|
15
15
|
},
|
|
16
16
|
"dependencies": {
|
|
17
|
-
"@
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
"@walkrstudio/playwright": "0.2.0"
|
|
21
|
-
},
|
|
22
|
-
"peerDependenciesMeta": {
|
|
23
|
-
"@walkrstudio/playwright": {
|
|
24
|
-
"optional": true
|
|
25
|
-
}
|
|
17
|
+
"@walkr/studio": "^0.2.0",
|
|
18
|
+
"@walkrstudio/core": "^0.2.0",
|
|
19
|
+
"@walkrstudio/playwright": "^0.2.1"
|
|
26
20
|
},
|
|
27
21
|
"devDependencies": {
|
|
28
|
-
"@types/node": "^22.15.3"
|
|
29
|
-
"@walkrstudio/playwright": "0.2.0"
|
|
22
|
+
"@types/node": "^22.15.3"
|
|
30
23
|
},
|
|
31
24
|
"scripts": {
|
|
32
25
|
"build": "tsc -p tsconfig.json",
|