@aurelia/storybook 1.0.2 → 2.0.0

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.
Files changed (21) hide show
  1. package/README.md +4 -11
  2. package/apps/hello-world/package-lock.json +99 -99
  3. package/apps/hello-world/package.json +6 -6
  4. package/apps/hello-world-webpack/package-lock.json +81 -81
  5. package/apps/hello-world-webpack/package.json +4 -4
  6. package/dist/index.js +4 -11
  7. package/dist/index.js.map +1 -1
  8. package/dist/preset.js +2 -9
  9. package/dist/preset.js.map +1 -1
  10. package/dist/preview/render.js +4 -9
  11. package/dist/preview/render.js.map +1 -1
  12. package/dist/preview/types.js +0 -1
  13. package/dist/preview/types.js.map +1 -1
  14. package/dist/preview.js +4 -7
  15. package/dist/preview.js.map +1 -1
  16. package/dist/webpack.js +1 -3
  17. package/dist/webpack.js.map +1 -1
  18. package/package.json +16 -19
  19. package/rollup.config.mjs +4 -7
  20. package/src/preset.ts +1 -1
  21. package/tsconfig.json +1 -1
package/README.md CHANGED
@@ -2,13 +2,13 @@
2
2
 
3
3
  > **Note:** Storybook support is currently in an early stage, and there may be bugs, issues, or unsupported features in this plugin. The intention is to make this plugin more production-ready when Aurelia 2 reaches stable release.
4
4
 
5
- This package provides an integration between Aurelia 2 and Storybook 9 using Vite or Webpack. It lets you write and render Aurelia 2 components as Storybook stories with full support for Storybook controls, actions, and interactive testing.
5
+ This package provides an integration between Aurelia 2 and Storybook 10 using Vite or Webpack. It lets you write and render Aurelia 2 components as Storybook stories with full support for Storybook controls, actions, and interactive testing.
6
6
 
7
7
  ## Features
8
8
 
9
9
  - **Vite & Webpack Support**: Works with both Vite (via `@storybook/builder-vite`) and Webpack 5 (via `@storybook/builder-webpack5`).
10
10
  - **Aurelia Enhancement**: Renders Aurelia 2 components using Aurelia's `enhance()` API.
11
- - **Storybook 9 Compatibility**: Fully compatible with Storybook 9's new rendering API.
11
+ - **Storybook 10 Compatibility**: Fully compatible with Storybook 10's rendering API and ESM-only architecture.
12
12
  - **Arg & Action Support**: Use story args and actions as you would with any Storybook story.
13
13
 
14
14
  ## Installation
@@ -25,12 +25,6 @@ Also, make sure to have the required dependencies installed in your project:
25
25
  npm install --save-dev storybook @storybook/builder-vite
26
26
  ```
27
27
 
28
- For testing functionality, you may also want to install:
29
-
30
- ```bash
31
- npm install --save-dev @storybook/test @storybook/addon-actions
32
- ```
33
-
34
28
  > **Tip:** Check your existing Aurelia 2 app for already installed versions. The peer dependencies are expected to be compatible with Aurelia 2 beta releases (see `package.json` for version details).
35
29
 
36
30
  ## Getting Started
@@ -89,7 +83,7 @@ To integrate Aurelia 2 with your Storybook instance, follow these steps:
89
83
  export { render, renderToCanvas } from '@aurelia/storybook';
90
84
  ```
91
85
 
92
- > **Note:** Essential features like actions, controls, backgrounds, and viewport are now built into Storybook 9 core and don't need to be installed separately. However, if you need to use the `action()` function in your stories (for programmatic actions), you may still need to install `@storybook/addon-actions`. Additional addons like `@storybook/addon-links` can be installed and added to the `addons` array in your configuration.
86
+ > **Note:** Essential features like actions, controls, backgrounds, and viewport are now built into Storybook 10 core and don't need to be installed separately. However, if you need to use the `action()` function in your stories (for programmatic actions), you may still need to install `@storybook/addon-actions`. Additional addons like `@storybook/addon-links` can be installed and added to the `addons` array in your configuration.
93
87
 
94
88
  ### Using with Webpack
95
89
 
@@ -134,8 +128,7 @@ Aurelia 2 stories are written similarly to standard Storybook stories, with a fe
134
128
 
135
129
  ```typescript
136
130
  import { HelloWorld } from '../hello-world';
137
- import { fn } from '@storybook/test';
138
- import { userEvent, within } from '@storybook/test';
131
+ import { fn, userEvent, within } from 'storybook/test';
139
132
 
140
133
  const meta = {
141
134
  title: 'Example/HelloWorld',
package/apps/hello-world/package-lock.json CHANGED
@@ -9,15 +9,15 @@
9
9
  "version": "0.1.0",
10
10
  "license": "UNLICENSED",
11
11
  "dependencies": {
12
- "@aurelia/router": "^2.0.0-beta.24",
13
- "@aurelia/validation": "^2.0.0-beta.24",
14
- "@aurelia/validation-html": "^2.0.0-beta.24",
15
- "aurelia": "^2.0.0-beta.24"
12
+ "@aurelia/router": "^2.0.0-beta.25",
13
+ "@aurelia/validation": "^2.0.0-beta.25",
14
+ "@aurelia/validation-html": "^2.0.0-beta.25",
15
+ "aurelia": "^2.0.0-beta.25"
16
16
  },
17
17
  "devDependencies": {
18
18
  "@aurelia/storybook": "^1.0.2",
19
- "@aurelia/testing": "^2.0.0-beta.24",
20
- "@aurelia/vite-plugin": "^2.0.0-beta.24",
19
+ "@aurelia/testing": "^2.0.0-beta.25",
20
+ "@aurelia/vite-plugin": "^2.0.0-beta.25",
21
21
  "@storybook/addon-actions": "^9.0.0",
22
22
  "@storybook/addon-links": "^9.0.0",
23
23
  "@storybook/builder-vite": "^9.0.0",
@@ -51,7 +51,7 @@
51
51
  "version": "1.0.2",
52
52
  "dev": true,
53
53
  "devDependencies": {
54
- "@aurelia/webpack-loader": "^2.0.0-beta.24",
54
+ "@aurelia/webpack-loader": "^2.0.0-beta.25",
55
55
  "@rollup/plugin-commonjs": "^28.0.6",
56
56
  "@rollup/plugin-node-resolve": "^16.0.1",
57
57
  "@rollup/plugin-typescript": "^12.1.3",
@@ -67,11 +67,11 @@
67
67
  "typescript": "^5.8.3"
68
68
  },
69
69
  "peerDependencies": {
70
- "@aurelia/runtime-html": "^2.0.0-beta.24",
71
- "@aurelia/vite-plugin": "^2.0.0-beta.24",
70
+ "@aurelia/runtime-html": "^2.0.0-beta.25",
71
+ "@aurelia/vite-plugin": "^2.0.0-beta.25",
72
72
  "@storybook/builder-vite": "^9.0.0",
73
73
  "@storybook/builder-webpack5": "^9.0.0",
74
- "aurelia": "^2.0.0-beta.24",
74
+ "aurelia": "^2.0.0-beta.25",
75
75
  "storybook": "^9.0.0"
76
76
  }
77
77
  },
@@ -105,73 +105,73 @@
105
105
  }
106
106
  },
107
107
  "node_modules/@aurelia/expression-parser": {
108
- "version": "2.0.0-beta.24",
108
+ "version": "2.0.0-beta.25",
109
109
  "license": "MIT",
110
110
  "dependencies": {
111
- "@aurelia/kernel": "2.0.0-beta.24"
111
+ "@aurelia/kernel": "2.0.0-beta.25"
112
112
  },
113
113
  "engines": {
114
114
  "node": ">=20.16.0"
115
115
  }
116
116
  },
117
117
  "node_modules/@aurelia/fetch-client": {
118
- "version": "2.0.0-beta.24",
118
+ "version": "2.0.0-beta.25",
119
119
  "license": "MIT",
120
120
  "dependencies": {
121
- "@aurelia/kernel": "2.0.0-beta.24",
122
- "@aurelia/metadata": "2.0.0-beta.24"
121
+ "@aurelia/kernel": "2.0.0-beta.25",
122
+ "@aurelia/metadata": "2.0.0-beta.25"
123
123
  },
124
124
  "engines": {
125
125
  "node": ">=20.16.0"
126
126
  }
127
127
  },
128
128
  "node_modules/@aurelia/kernel": {
129
- "version": "2.0.0-beta.24",
129
+ "version": "2.0.0-beta.25",
130
130
  "license": "MIT",
131
131
  "dependencies": {
132
- "@aurelia/metadata": "2.0.0-beta.24",
133
- "@aurelia/platform": "2.0.0-beta.24"
132
+ "@aurelia/metadata": "2.0.0-beta.25",
133
+ "@aurelia/platform": "2.0.0-beta.25"
134
134
  },
135
135
  "engines": {
136
136
  "node": ">=20.16.0"
137
137
  }
138
138
  },
139
139
  "node_modules/@aurelia/metadata": {
140
- "version": "2.0.0-beta.24",
140
+ "version": "2.0.0-beta.25",
141
141
  "license": "MIT",
142
142
  "engines": {
143
143
  "node": ">=20.16.0"
144
144
  }
145
145
  },
146
146
  "node_modules/@aurelia/platform": {
147
- "version": "2.0.0-beta.24",
147
+ "version": "2.0.0-beta.25",
148
148
  "license": "MIT",
149
149
  "engines": {
150
150
  "node": ">=20.16.0"
151
151
  }
152
152
  },
153
153
  "node_modules/@aurelia/platform-browser": {
154
- "version": "2.0.0-beta.24",
154
+ "version": "2.0.0-beta.25",
155
155
  "license": "MIT",
156
156
  "dependencies": {
157
- "@aurelia/platform": "2.0.0-beta.24"
157
+ "@aurelia/platform": "2.0.0-beta.25"
158
158
  },
159
159
  "engines": {
160
160
  "node": ">=20.16.0"
161
161
  }
162
162
  },
163
163
  "node_modules/@aurelia/plugin-conventions": {
164
- "version": "2.0.0-beta.24",
164
+ "version": "2.0.0-beta.25",
165
165
  "dev": true,
166
166
  "license": "MIT",
167
167
  "dependencies": {
168
- "@aurelia/expression-parser": "2.0.0-beta.24",
169
- "@aurelia/kernel": "2.0.0-beta.24",
170
- "@aurelia/metadata": "2.0.0-beta.24",
171
- "@aurelia/platform": "2.0.0-beta.24",
172
- "@aurelia/runtime": "2.0.0-beta.24",
173
- "@aurelia/runtime-html": "2.0.0-beta.24",
174
- "@aurelia/template-compiler": "2.0.0-beta.24",
168
+ "@aurelia/expression-parser": "2.0.0-beta.25",
169
+ "@aurelia/kernel": "2.0.0-beta.25",
170
+ "@aurelia/metadata": "2.0.0-beta.25",
171
+ "@aurelia/platform": "2.0.0-beta.25",
172
+ "@aurelia/runtime": "2.0.0-beta.25",
173
+ "@aurelia/runtime-html": "2.0.0-beta.25",
174
+ "@aurelia/template-compiler": "2.0.0-beta.25",
175
175
  "modify-code": "^2.1.3",
176
176
  "parse5": "^7.1.2",
177
177
  "typescript": "^5.4.2"
@@ -181,53 +181,53 @@
181
181
  }
182
182
  },
183
183
  "node_modules/@aurelia/route-recognizer": {
184
- "version": "2.0.0-beta.24",
184
+ "version": "2.0.0-beta.25",
185
185
  "license": "MIT",
186
186
  "engines": {
187
187
  "node": ">=20.16.0"
188
188
  }
189
189
  },
190
190
  "node_modules/@aurelia/router": {
191
- "version": "2.0.0-beta.24",
191
+ "version": "2.0.0-beta.25",
192
192
  "license": "MIT",
193
193
  "dependencies": {
194
- "@aurelia/kernel": "2.0.0-beta.24",
195
- "@aurelia/metadata": "2.0.0-beta.24",
196
- "@aurelia/platform": "2.0.0-beta.24",
197
- "@aurelia/platform-browser": "2.0.0-beta.24",
198
- "@aurelia/route-recognizer": "2.0.0-beta.24",
199
- "@aurelia/runtime": "2.0.0-beta.24",
200
- "@aurelia/runtime-html": "2.0.0-beta.24",
201
- "@aurelia/template-compiler": "2.0.0-beta.24"
194
+ "@aurelia/kernel": "2.0.0-beta.25",
195
+ "@aurelia/metadata": "2.0.0-beta.25",
196
+ "@aurelia/platform": "2.0.0-beta.25",
197
+ "@aurelia/platform-browser": "2.0.0-beta.25",
198
+ "@aurelia/route-recognizer": "2.0.0-beta.25",
199
+ "@aurelia/runtime": "2.0.0-beta.25",
200
+ "@aurelia/runtime-html": "2.0.0-beta.25",
201
+ "@aurelia/template-compiler": "2.0.0-beta.25"
202
202
  },
203
203
  "engines": {
204
204
  "node": ">=20.16.0"
205
205
  }
206
206
  },
207
207
  "node_modules/@aurelia/runtime": {
208
- "version": "2.0.0-beta.24",
208
+ "version": "2.0.0-beta.25",
209
209
  "license": "MIT",
210
210
  "dependencies": {
211
- "@aurelia/expression-parser": "2.0.0-beta.24",
212
- "@aurelia/kernel": "2.0.0-beta.24",
213
- "@aurelia/metadata": "2.0.0-beta.24",
214
- "@aurelia/platform": "2.0.0-beta.24"
211
+ "@aurelia/expression-parser": "2.0.0-beta.25",
212
+ "@aurelia/kernel": "2.0.0-beta.25",
213
+ "@aurelia/metadata": "2.0.0-beta.25",
214
+ "@aurelia/platform": "2.0.0-beta.25"
215
215
  },
216
216
  "engines": {
217
217
  "node": ">=20.16.0"
218
218
  }
219
219
  },
220
220
  "node_modules/@aurelia/runtime-html": {
221
- "version": "2.0.0-beta.24",
221
+ "version": "2.0.0-beta.25",
222
222
  "license": "MIT",
223
223
  "dependencies": {
224
- "@aurelia/expression-parser": "2.0.0-beta.24",
225
- "@aurelia/kernel": "2.0.0-beta.24",
226
- "@aurelia/metadata": "2.0.0-beta.24",
227
- "@aurelia/platform": "2.0.0-beta.24",
228
- "@aurelia/platform-browser": "2.0.0-beta.24",
229
- "@aurelia/runtime": "2.0.0-beta.24",
230
- "@aurelia/template-compiler": "2.0.0-beta.24"
224
+ "@aurelia/expression-parser": "2.0.0-beta.25",
225
+ "@aurelia/kernel": "2.0.0-beta.25",
226
+ "@aurelia/metadata": "2.0.0-beta.25",
227
+ "@aurelia/platform": "2.0.0-beta.25",
228
+ "@aurelia/platform-browser": "2.0.0-beta.25",
229
+ "@aurelia/runtime": "2.0.0-beta.25",
230
+ "@aurelia/template-compiler": "2.0.0-beta.25"
231
231
  },
232
232
  "engines": {
233
233
  "node": ">=20.16.0"
@@ -238,76 +238,76 @@
238
238
  "link": true
239
239
  },
240
240
  "node_modules/@aurelia/template-compiler": {
241
- "version": "2.0.0-beta.24",
241
+ "version": "2.0.0-beta.25",
242
242
  "license": "MIT",
243
243
  "dependencies": {
244
- "@aurelia/expression-parser": "2.0.0-beta.24",
245
- "@aurelia/kernel": "2.0.0-beta.24",
246
- "@aurelia/metadata": "2.0.0-beta.24"
244
+ "@aurelia/expression-parser": "2.0.0-beta.25",
245
+ "@aurelia/kernel": "2.0.0-beta.25",
246
+ "@aurelia/metadata": "2.0.0-beta.25"
247
247
  },
248
248
  "engines": {
249
249
  "node": ">=20.16.0"
250
250
  }
251
251
  },
252
252
  "node_modules/@aurelia/testing": {
253
- "version": "2.0.0-beta.24",
253
+ "version": "2.0.0-beta.25",
254
254
  "dev": true,
255
255
  "license": "MIT",
256
256
  "dependencies": {
257
- "@aurelia/kernel": "2.0.0-beta.24",
258
- "@aurelia/metadata": "2.0.0-beta.24",
259
- "@aurelia/platform": "2.0.0-beta.24",
260
- "@aurelia/platform-browser": "2.0.0-beta.24",
261
- "@aurelia/runtime": "2.0.0-beta.24",
262
- "@aurelia/runtime-html": "2.0.0-beta.24",
263
- "@aurelia/template-compiler": "2.0.0-beta.24"
257
+ "@aurelia/kernel": "2.0.0-beta.25",
258
+ "@aurelia/metadata": "2.0.0-beta.25",
259
+ "@aurelia/platform": "2.0.0-beta.25",
260
+ "@aurelia/platform-browser": "2.0.0-beta.25",
261
+ "@aurelia/runtime": "2.0.0-beta.25",
262
+ "@aurelia/runtime-html": "2.0.0-beta.25",
263
+ "@aurelia/template-compiler": "2.0.0-beta.25"
264
264
  },
265
265
  "engines": {
266
266
  "node": ">=20.16.0"
267
267
  }
268
268
  },
269
269
  "node_modules/@aurelia/validation": {
270
- "version": "2.0.0-beta.24",
270
+ "version": "2.0.0-beta.25",
271
271
  "license": "MIT",
272
272
  "dependencies": {
273
- "@aurelia/expression-parser": "2.0.0-beta.24",
274
- "@aurelia/kernel": "2.0.0-beta.24",
275
- "@aurelia/metadata": "2.0.0-beta.24",
276
- "@aurelia/platform": "2.0.0-beta.24",
277
- "@aurelia/runtime": "2.0.0-beta.24",
278
- "@aurelia/runtime-html": "2.0.0-beta.24"
273
+ "@aurelia/expression-parser": "2.0.0-beta.25",
274
+ "@aurelia/kernel": "2.0.0-beta.25",
275
+ "@aurelia/metadata": "2.0.0-beta.25",
276
+ "@aurelia/platform": "2.0.0-beta.25",
277
+ "@aurelia/runtime": "2.0.0-beta.25",
278
+ "@aurelia/runtime-html": "2.0.0-beta.25"
279
279
  },
280
280
  "engines": {
281
281
  "node": ">=20.16.0"
282
282
  }
283
283
  },
284
284
  "node_modules/@aurelia/validation-html": {
285
- "version": "2.0.0-beta.24",
285
+ "version": "2.0.0-beta.25",
286
286
  "license": "MIT",
287
287
  "dependencies": {
288
- "@aurelia/expression-parser": "2.0.0-beta.24",
289
- "@aurelia/kernel": "2.0.0-beta.24",
290
- "@aurelia/metadata": "2.0.0-beta.24",
291
- "@aurelia/platform": "2.0.0-beta.24",
292
- "@aurelia/platform-browser": "2.0.0-beta.24",
293
- "@aurelia/runtime": "2.0.0-beta.24",
294
- "@aurelia/runtime-html": "2.0.0-beta.24",
295
- "@aurelia/validation": "2.0.0-beta.24"
288
+ "@aurelia/expression-parser": "2.0.0-beta.25",
289
+ "@aurelia/kernel": "2.0.0-beta.25",
290
+ "@aurelia/metadata": "2.0.0-beta.25",
291
+ "@aurelia/platform": "2.0.0-beta.25",
292
+ "@aurelia/platform-browser": "2.0.0-beta.25",
293
+ "@aurelia/runtime": "2.0.0-beta.25",
294
+ "@aurelia/runtime-html": "2.0.0-beta.25",
295
+ "@aurelia/validation": "2.0.0-beta.25"
296
296
  },
297
297
  "engines": {
298
298
  "node": ">=20.16.0"
299
299
  }
300
300
  },
301
301
  "node_modules/@aurelia/vite-plugin": {
302
- "version": "2.0.0-beta.24",
302
+ "version": "2.0.0-beta.25",
303
303
  "dev": true,
304
304
  "license": "MIT",
305
305
  "dependencies": {
306
- "@aurelia/kernel": "2.0.0-beta.24",
307
- "@aurelia/metadata": "2.0.0-beta.24",
308
- "@aurelia/platform": "2.0.0-beta.24",
309
- "@aurelia/plugin-conventions": "2.0.0-beta.24",
310
- "@aurelia/runtime": "2.0.0-beta.24",
306
+ "@aurelia/kernel": "2.0.0-beta.25",
307
+ "@aurelia/metadata": "2.0.0-beta.25",
308
+ "@aurelia/platform": "2.0.0-beta.25",
309
+ "@aurelia/plugin-conventions": "2.0.0-beta.25",
310
+ "@aurelia/runtime": "2.0.0-beta.25",
311
311
  "@rollup/pluginutils": "5.0.2",
312
312
  "loader-utils": "^2.0.0",
313
313
  "vite": "^6.2.6"
@@ -2064,18 +2064,18 @@
2064
2064
  "license": "MIT"
2065
2065
  },
2066
2066
  "node_modules/aurelia": {
2067
- "version": "2.0.0-beta.24",
2068
- "license": "MIT",
2069
- "dependencies": {
2070
- "@aurelia/expression-parser": "2.0.0-beta.24",
2071
- "@aurelia/fetch-client": "2.0.0-beta.24",
2072
- "@aurelia/kernel": "2.0.0-beta.24",
2073
- "@aurelia/metadata": "2.0.0-beta.24",
2074
- "@aurelia/platform": "2.0.0-beta.24",
2075
- "@aurelia/platform-browser": "2.0.0-beta.24",
2076
- "@aurelia/runtime": "2.0.0-beta.24",
2077
- "@aurelia/runtime-html": "2.0.0-beta.24",
2078
- "@aurelia/template-compiler": "2.0.0-beta.24"
2067
+ "version": "2.0.0-beta.25",
2068
+ "license": "MIT",
2069
+ "dependencies": {
2070
+ "@aurelia/expression-parser": "2.0.0-beta.25",
2071
+ "@aurelia/fetch-client": "2.0.0-beta.25",
2072
+ "@aurelia/kernel": "2.0.0-beta.25",
2073
+ "@aurelia/metadata": "2.0.0-beta.25",
2074
+ "@aurelia/platform": "2.0.0-beta.25",
2075
+ "@aurelia/platform-browser": "2.0.0-beta.25",
2076
+ "@aurelia/runtime": "2.0.0-beta.25",
2077
+ "@aurelia/runtime-html": "2.0.0-beta.25",
2078
+ "@aurelia/template-compiler": "2.0.0-beta.25"
2079
2079
  },
2080
2080
  "engines": {
2081
2081
  "node": ">=20.16.0"
package/apps/hello-world/package.json CHANGED
@@ -8,15 +8,15 @@
8
8
  },
9
9
  "license": "UNLICENSED",
10
10
  "dependencies": {
11
- "@aurelia/router": "^2.0.0-beta.24",
12
- "@aurelia/validation": "^2.0.0-beta.24",
13
- "@aurelia/validation-html": "^2.0.0-beta.24",
14
- "aurelia": "^2.0.0-beta.24"
11
+ "@aurelia/router": "^2.0.0-beta.25",
12
+ "@aurelia/validation": "^2.0.0-beta.25",
13
+ "@aurelia/validation-html": "^2.0.0-beta.25",
14
+ "aurelia": "^2.0.0-beta.25"
15
15
  },
16
16
  "devDependencies": {
17
17
  "@aurelia/storybook": "^1.0.2",
18
- "@aurelia/testing": "^2.0.0-beta.24",
19
- "@aurelia/vite-plugin": "^2.0.0-beta.24",
18
+ "@aurelia/testing": "^2.0.0-beta.25",
19
+ "@aurelia/vite-plugin": "^2.0.0-beta.25",
20
20
  "@storybook/addon-actions": "^9.0.0",
21
21
  "@storybook/addon-links": "^9.0.0",
22
22
  "@storybook/builder-vite": "^9.0.0",
package/apps/hello-world-webpack/package-lock.json CHANGED
@@ -9,13 +9,13 @@
9
9
  "version": "0.1.0",
10
10
  "license": "UNLICENSED",
11
11
  "dependencies": {
12
- "@aurelia/router": "2.0.0-beta.24",
13
- "aurelia": "2.0.0-beta.24"
12
+ "@aurelia/router": "2.0.0-beta.25",
13
+ "aurelia": "2.0.0-beta.25"
14
14
  },
15
15
  "devDependencies": {
16
16
  "@aurelia/storybook": "^1.0.2",
17
- "@aurelia/testing": "2.0.0-beta.24",
18
- "@aurelia/webpack-loader": "2.0.0-beta.24",
17
+ "@aurelia/testing": "2.0.0-beta.25",
18
+ "@aurelia/webpack-loader": "2.0.0-beta.25",
19
19
  "@storybook/addon-actions": "^9.0.8",
20
20
  "@storybook/addon-links": "^9.0.0",
21
21
  "@storybook/test": "^9.0.0-alpha.2",
@@ -47,7 +47,7 @@
47
47
  "version": "1.0.2",
48
48
  "dev": true,
49
49
  "devDependencies": {
50
- "@aurelia/webpack-loader": "^2.0.0-beta.24",
50
+ "@aurelia/webpack-loader": "^2.0.0-beta.25",
51
51
  "@rollup/plugin-commonjs": "^28.0.6",
52
52
  "@rollup/plugin-node-resolve": "^16.0.1",
53
53
  "@rollup/plugin-typescript": "^12.1.3",
@@ -63,11 +63,11 @@
63
63
  "typescript": "^5.8.3"
64
64
  },
65
65
  "peerDependencies": {
66
- "@aurelia/runtime-html": "^2.0.0-beta.24",
67
- "@aurelia/vite-plugin": "^2.0.0-beta.24",
66
+ "@aurelia/runtime-html": "^2.0.0-beta.25",
67
+ "@aurelia/vite-plugin": "^2.0.0-beta.25",
68
68
  "@storybook/builder-vite": "^9.0.0",
69
69
  "@storybook/builder-webpack5": "^9.0.0",
70
- "aurelia": "^2.0.0-beta.24",
70
+ "aurelia": "^2.0.0-beta.25",
71
71
  "storybook": "^9.0.0"
72
72
  }
73
73
  },
@@ -77,75 +77,75 @@
77
77
  "license": "MIT"
78
78
  },
79
79
  "node_modules/@aurelia/expression-parser": {
80
- "version": "2.0.0-beta.24",
80
+ "version": "2.0.0-beta.25",
81
81
  "license": "MIT",
82
82
  "dependencies": {
83
- "@aurelia/kernel": "2.0.0-beta.24"
83
+ "@aurelia/kernel": "2.0.0-beta.25"
84
84
  },
85
85
  "engines": {
86
86
  "node": ">=20.16.0"
87
87
  }
88
88
  },
89
89
  "node_modules/@aurelia/fetch-client": {
90
- "version": "2.0.0-beta.24",
91
- "resolved": "https://registry.npmjs.org/@aurelia/fetch-client/-/fetch-client-2.0.0-beta.24.tgz",
90
+ "version": "2.0.0-beta.25",
91
+ "resolved": "https://registry.npmjs.org/@aurelia/fetch-client/-/fetch-client-2.0.0-beta.25.tgz",
92
92
  "integrity": "sha512-Av+MZ/94iXTtKk3/N9YYWQcM2terV8+r73tP7IprP6mmsEeNZ9XalZiQBu5BkzsTBVo3dbb8lZThwbFPL7vDOw==",
93
93
  "license": "MIT",
94
94
  "dependencies": {
95
- "@aurelia/kernel": "2.0.0-beta.24",
96
- "@aurelia/metadata": "2.0.0-beta.24"
95
+ "@aurelia/kernel": "2.0.0-beta.25",
96
+ "@aurelia/metadata": "2.0.0-beta.25"
97
97
  },
98
98
  "engines": {
99
99
  "node": ">=20.16.0"
100
100
  }
101
101
  },
102
102
  "node_modules/@aurelia/kernel": {
103
- "version": "2.0.0-beta.24",
103
+ "version": "2.0.0-beta.25",
104
104
  "license": "MIT",
105
105
  "dependencies": {
106
- "@aurelia/metadata": "2.0.0-beta.24",
107
- "@aurelia/platform": "2.0.0-beta.24"
106
+ "@aurelia/metadata": "2.0.0-beta.25",
107
+ "@aurelia/platform": "2.0.0-beta.25"
108
108
  },
109
109
  "engines": {
110
110
  "node": ">=20.16.0"
111
111
  }
112
112
  },
113
113
  "node_modules/@aurelia/metadata": {
114
- "version": "2.0.0-beta.24",
114
+ "version": "2.0.0-beta.25",
115
115
  "license": "MIT",
116
116
  "engines": {
117
117
  "node": ">=20.16.0"
118
118
  }
119
119
  },
120
120
  "node_modules/@aurelia/platform": {
121
- "version": "2.0.0-beta.24",
121
+ "version": "2.0.0-beta.25",
122
122
  "license": "MIT",
123
123
  "engines": {
124
124
  "node": ">=20.16.0"
125
125
  }
126
126
  },
127
127
  "node_modules/@aurelia/platform-browser": {
128
- "version": "2.0.0-beta.24",
128
+ "version": "2.0.0-beta.25",
129
129
  "license": "MIT",
130
130
  "dependencies": {
131
- "@aurelia/platform": "2.0.0-beta.24"
131
+ "@aurelia/platform": "2.0.0-beta.25"
132
132
  },
133
133
  "engines": {
134
134
  "node": ">=20.16.0"
135
135
  }
136
136
  },
137
137
  "node_modules/@aurelia/plugin-conventions": {
138
- "version": "2.0.0-beta.24",
138
+ "version": "2.0.0-beta.25",
139
139
  "dev": true,
140
140
  "license": "MIT",
141
141
  "dependencies": {
142
- "@aurelia/expression-parser": "2.0.0-beta.24",
143
- "@aurelia/kernel": "2.0.0-beta.24",
144
- "@aurelia/metadata": "2.0.0-beta.24",
145
- "@aurelia/platform": "2.0.0-beta.24",
146
- "@aurelia/runtime": "2.0.0-beta.24",
147
- "@aurelia/runtime-html": "2.0.0-beta.24",
148
- "@aurelia/template-compiler": "2.0.0-beta.24",
142
+ "@aurelia/expression-parser": "2.0.0-beta.25",
143
+ "@aurelia/kernel": "2.0.0-beta.25",
144
+ "@aurelia/metadata": "2.0.0-beta.25",
145
+ "@aurelia/platform": "2.0.0-beta.25",
146
+ "@aurelia/runtime": "2.0.0-beta.25",
147
+ "@aurelia/runtime-html": "2.0.0-beta.25",
148
+ "@aurelia/template-compiler": "2.0.0-beta.25",
149
149
  "modify-code": "^2.1.3",
150
150
  "parse5": "^7.1.2",
151
151
  "typescript": "^5.4.2"
@@ -155,53 +155,53 @@
155
155
  }
156
156
  },
157
157
  "node_modules/@aurelia/route-recognizer": {
158
- "version": "2.0.0-beta.24",
158
+ "version": "2.0.0-beta.25",
159
159
  "license": "MIT",
160
160
  "engines": {
161
161
  "node": ">=20.16.0"
162
162
  }
163
163
  },
164
164
  "node_modules/@aurelia/router": {
165
- "version": "2.0.0-beta.24",
165
+ "version": "2.0.0-beta.25",
166
166
  "license": "MIT",
167
167
  "dependencies": {
168
- "@aurelia/kernel": "2.0.0-beta.24",
169
- "@aurelia/metadata": "2.0.0-beta.24",
170
- "@aurelia/platform": "2.0.0-beta.24",
171
- "@aurelia/platform-browser": "2.0.0-beta.24",
172
- "@aurelia/route-recognizer": "2.0.0-beta.24",
173
- "@aurelia/runtime": "2.0.0-beta.24",
174
- "@aurelia/runtime-html": "2.0.0-beta.24",
175
- "@aurelia/template-compiler": "2.0.0-beta.24"
168
+ "@aurelia/kernel": "2.0.0-beta.25",
169
+ "@aurelia/metadata": "2.0.0-beta.25",
170
+ "@aurelia/platform": "2.0.0-beta.25",
171
+ "@aurelia/platform-browser": "2.0.0-beta.25",
172
+ "@aurelia/route-recognizer": "2.0.0-beta.25",
173
+ "@aurelia/runtime": "2.0.0-beta.25",
174
+ "@aurelia/runtime-html": "2.0.0-beta.25",
175
+ "@aurelia/template-compiler": "2.0.0-beta.25"
176
176
  },
177
177
  "engines": {
178
178
  "node": ">=20.16.0"
179
179
  }
180
180
  },
181
181
  "node_modules/@aurelia/runtime": {
182
- "version": "2.0.0-beta.24",
182
+ "version": "2.0.0-beta.25",
183
183
  "license": "MIT",
184
184
  "dependencies": {
185
- "@aurelia/expression-parser": "2.0.0-beta.24",
186
- "@aurelia/kernel": "2.0.0-beta.24",
187
- "@aurelia/metadata": "2.0.0-beta.24",
188
- "@aurelia/platform": "2.0.0-beta.24"
185
+ "@aurelia/expression-parser": "2.0.0-beta.25",
186
+ "@aurelia/kernel": "2.0.0-beta.25",
187
+ "@aurelia/metadata": "2.0.0-beta.25",
188
+ "@aurelia/platform": "2.0.0-beta.25"
189
189
  },
190
190
  "engines": {
191
191
  "node": ">=20.16.0"
192
192
  }
193
193
  },
194
194
  "node_modules/@aurelia/runtime-html": {
195
- "version": "2.0.0-beta.24",
195
+ "version": "2.0.0-beta.25",
196
196
  "license": "MIT",
197
197
  "dependencies": {
198
- "@aurelia/expression-parser": "2.0.0-beta.24",
199
- "@aurelia/kernel": "2.0.0-beta.24",
200
- "@aurelia/metadata": "2.0.0-beta.24",
201
- "@aurelia/platform": "2.0.0-beta.24",
202
- "@aurelia/platform-browser": "2.0.0-beta.24",
203
- "@aurelia/runtime": "2.0.0-beta.24",
204
- "@aurelia/template-compiler": "2.0.0-beta.24"
198
+ "@aurelia/expression-parser": "2.0.0-beta.25",
199
+ "@aurelia/kernel": "2.0.0-beta.25",
200
+ "@aurelia/metadata": "2.0.0-beta.25",
201
+ "@aurelia/platform": "2.0.0-beta.25",
202
+ "@aurelia/platform-browser": "2.0.0-beta.25",
203
+ "@aurelia/runtime": "2.0.0-beta.25",
204
+ "@aurelia/template-compiler": "2.0.0-beta.25"
205
205
  },
206
206
  "engines": {
207
207
  "node": ">=20.16.0"
@@ -212,44 +212,44 @@
212
212
  "link": true
213
213
  },
214
214
  "node_modules/@aurelia/template-compiler": {
215
- "version": "2.0.0-beta.24",
215
+ "version": "2.0.0-beta.25",
216
216
  "license": "MIT",
217
217
  "dependencies": {
218
- "@aurelia/expression-parser": "2.0.0-beta.24",
219
- "@aurelia/kernel": "2.0.0-beta.24",
220
- "@aurelia/metadata": "2.0.0-beta.24"
218
+ "@aurelia/expression-parser": "2.0.0-beta.25",
219
+ "@aurelia/kernel": "2.0.0-beta.25",
220
+ "@aurelia/metadata": "2.0.0-beta.25"
221
221
  },
222
222
  "engines": {
223
223
  "node": ">=20.16.0"
224
224
  }
225
225
  },
226
226
  "node_modules/@aurelia/testing": {
227
- "version": "2.0.0-beta.24",
227
+ "version": "2.0.0-beta.25",
228
228
  "dev": true,
229
229
  "license": "MIT",
230
230
  "dependencies": {
231
- "@aurelia/kernel": "2.0.0-beta.24",
232
- "@aurelia/metadata": "2.0.0-beta.24",
233
- "@aurelia/platform": "2.0.0-beta.24",
234
- "@aurelia/platform-browser": "2.0.0-beta.24",
235
- "@aurelia/runtime": "2.0.0-beta.24",
236
- "@aurelia/runtime-html": "2.0.0-beta.24",
237
- "@aurelia/template-compiler": "2.0.0-beta.24"
231
+ "@aurelia/kernel": "2.0.0-beta.25",
232
+ "@aurelia/metadata": "2.0.0-beta.25",
233
+ "@aurelia/platform": "2.0.0-beta.25",
234
+ "@aurelia/platform-browser": "2.0.0-beta.25",
235
+ "@aurelia/runtime": "2.0.0-beta.25",
236
+ "@aurelia/runtime-html": "2.0.0-beta.25",
237
+ "@aurelia/template-compiler": "2.0.0-beta.25"
238
238
  },
239
239
  "engines": {
240
240
  "node": ">=20.16.0"
241
241
  }
242
242
  },
243
243
  "node_modules/@aurelia/webpack-loader": {
244
- "version": "2.0.0-beta.24",
244
+ "version": "2.0.0-beta.25",
245
245
  "dev": true,
246
246
  "license": "MIT",
247
247
  "dependencies": {
248
- "@aurelia/kernel": "2.0.0-beta.24",
249
- "@aurelia/metadata": "2.0.0-beta.24",
250
- "@aurelia/platform": "2.0.0-beta.24",
251
- "@aurelia/plugin-conventions": "2.0.0-beta.24",
252
- "@aurelia/runtime": "2.0.0-beta.24",
248
+ "@aurelia/kernel": "2.0.0-beta.25",
249
+ "@aurelia/metadata": "2.0.0-beta.25",
250
+ "@aurelia/platform": "2.0.0-beta.25",
251
+ "@aurelia/plugin-conventions": "2.0.0-beta.25",
252
+ "@aurelia/runtime": "2.0.0-beta.25",
253
253
  "loader-utils": "^2.0.0"
254
254
  },
255
255
  "engines": {
@@ -1848,20 +1848,20 @@
1848
1848
  }
1849
1849
  },
1850
1850
  "node_modules/aurelia": {
1851
- "version": "2.0.0-beta.24",
1852
- "resolved": "https://registry.npmjs.org/aurelia/-/aurelia-2.0.0-beta.24.tgz",
1851
+ "version": "2.0.0-beta.25",
1852
+ "resolved": "https://registry.npmjs.org/aurelia/-/aurelia-2.0.0-beta.25.tgz",
1853
1853
  "integrity": "sha512-2YboWpE9zjRJWs20gUa+08qdFDaVoTnEy/EHUA7N7JaXc2IYB8DJVqqZNNFpasgxX/KSutL6HdJcfhVGHXdnYQ==",
1854
1854
  "license": "MIT",
1855
1855
  "dependencies": {
1856
- "@aurelia/expression-parser": "2.0.0-beta.24",
1857
- "@aurelia/fetch-client": "2.0.0-beta.24",
1858
- "@aurelia/kernel": "2.0.0-beta.24",
1859
- "@aurelia/metadata": "2.0.0-beta.24",
1860
- "@aurelia/platform": "2.0.0-beta.24",
1861
- "@aurelia/platform-browser": "2.0.0-beta.24",
1862
- "@aurelia/runtime": "2.0.0-beta.24",
1863
- "@aurelia/runtime-html": "2.0.0-beta.24",
1864
- "@aurelia/template-compiler": "2.0.0-beta.24"
1856
+ "@aurelia/expression-parser": "2.0.0-beta.25",
1857
+ "@aurelia/fetch-client": "2.0.0-beta.25",
1858
+ "@aurelia/kernel": "2.0.0-beta.25",
1859
+ "@aurelia/metadata": "2.0.0-beta.25",
1860
+ "@aurelia/platform": "2.0.0-beta.25",
1861
+ "@aurelia/platform-browser": "2.0.0-beta.25",
1862
+ "@aurelia/runtime": "2.0.0-beta.25",
1863
+ "@aurelia/runtime-html": "2.0.0-beta.25",
1864
+ "@aurelia/template-compiler": "2.0.0-beta.25"
1865
1865
  },
1866
1866
  "engines": {
1867
1867
  "node": ">=20.16.0"
package/apps/hello-world-webpack/package.json CHANGED
@@ -8,13 +8,13 @@
8
8
  },
9
9
  "license": "UNLICENSED",
10
10
  "dependencies": {
11
- "@aurelia/router": "2.0.0-beta.24",
12
- "aurelia": "2.0.0-beta.24"
11
+ "@aurelia/router": "2.0.0-beta.25",
12
+ "aurelia": "2.0.0-beta.25"
13
13
  },
14
14
  "devDependencies": {
15
15
  "@aurelia/storybook": "^1.0.2",
16
- "@aurelia/testing": "2.0.0-beta.24",
17
- "@aurelia/webpack-loader": "2.0.0-beta.24",
16
+ "@aurelia/testing": "2.0.0-beta.25",
17
+ "@aurelia/webpack-loader": "2.0.0-beta.25",
18
18
  "@storybook/addon-actions": "^9.0.8",
19
19
  "@storybook/addon-links": "^9.0.0",
20
20
  "@storybook/test": "^9.0.0-alpha.2",
package/dist/index.js CHANGED
@@ -1,6 +1,4 @@
1
- 'use strict';
2
-
3
- var Aurelia = require('aurelia');
1
+ import Aurelia, { CustomElement } from 'aurelia';
4
2
 
5
3
  // Track Aurelia apps for cleanup
6
4
  const appMap = new Map();
@@ -86,7 +84,7 @@ function createAureliaApp(story, args, domElement, component) {
86
84
  template = template ?? createComponentTemplate(component, story.innerHtml);
87
85
  aurelia.register(component);
88
86
  }
89
- const App = Aurelia.CustomElement.define({
87
+ const App = CustomElement.define({
90
88
  name: 'sb-app',
91
89
  template,
92
90
  containerless: true,
@@ -99,7 +97,7 @@ function createAureliaApp(story, args, domElement, component) {
99
97
  });
100
98
  }
101
99
  function createComponentTemplate(component, innerHtml) {
102
- const def = Aurelia.CustomElement.getDefinition(component);
100
+ const def = CustomElement.getDefinition(component);
103
101
  return `<${def.name} ${Object.values(def.bindables)
104
102
  .map((bindable) => `${bindable.attribute}.bind="${bindable.name}"`)
105
103
  .join(' ')}>${innerHtml ?? ''}</${def.name}>`;
@@ -130,10 +128,5 @@ const externals = {
130
128
  'react-dom': 'ReactDOM'
131
129
  };
132
130
 
133
- exports.aureliaFramework = aureliaFramework;
134
- exports.externals = externals;
135
- exports.framework = framework;
136
- exports.frameworkOptions = frameworkOptions;
137
- exports.render = render;
138
- exports.renderToCanvas = renderToCanvas;
131
+ export { aureliaFramework, externals, framework, frameworkOptions, render, renderToCanvas };
139
132
  //# sourceMappingURL=index.js.map
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../src/preview/render.ts","../src/index.ts"],"sourcesContent":["import { STORY_CHANGED } from 'storybook/internal/core-events';\nimport type { RenderContext, ArgsStoryFn } from 'storybook/internal/types';\nimport type { AureliaRenderer } from './types';\nimport Aurelia, { Constructable, CustomElement } from 'aurelia';\n\ninterface AureliaStoryResult {\n template: string;\n components?: unknown[];\n Component?: unknown;\n container?: any;\n items?: unknown[];\n innerHtml?: string;\n props?: Record<string, any>;\n}\n\n// Track Aurelia apps for cleanup\nconst appMap = new Map<HTMLElement, any>();\n\nasync function teardown(element: HTMLElement) {\n if (appMap.has(element)) {\n const app = appMap.get(element);\n if (app) {\n await app.stop();\n appMap.delete(element);\n }\n }\n}\n\nexport const render: ArgsStoryFn<AureliaRenderer> = (args, context) => {\n const { id, component: Component } = context;\n \n if (!Component) {\n throw new Error(\n `Unable to render story ${id} as the component annotation is missing from the default export`\n );\n }\n return { Component, props: args, template: '' };\n};\n\nexport async function renderToCanvas(\n {\n storyFn,\n title,\n name,\n showMain,\n showError,\n storyContext,\n forceRemount,\n }: RenderContext<AureliaRenderer>,\n canvasElement: HTMLElement,\n bootstrapAppFn?: typeof createAureliaApp\n) {\n // Store reference to the original storybook root element\n const rootElement = canvasElement;\n\n // Ensure we have (or create) a single container inside the root where the Aurelia app actually renders\n let hostElement: HTMLElement;\n if (rootElement.id === 'storybook-root') {\n hostElement = rootElement.querySelector('.aurelia-story-container') as HTMLElement;\n if (!hostElement) {\n hostElement = document.createElement('div');\n hostElement.className = 'aurelia-story-container';\n hostElement.style.height = '100%';\n rootElement.appendChild(hostElement);\n }\n } else {\n hostElement = rootElement;\n }\n\n // All app instances are now tracked by the *root* element, ensuring we only ever have one per story iframe\n const appBootstrapFn = bootstrapAppFn ?? createAureliaApp;\n const { parameters, component, args } = storyContext;\n \n let app = appMap.get(rootElement);\n const story = storyFn() as AureliaStoryResult;\n \n // Temporary debug logging\n console.log(`[DEBUG] Story: ${name}, forceRemount: ${forceRemount}, hasExistingApp: ${!!app}, canvasId: ${canvasElement.className}`);\n\n if (!story) {\n showError({\n title: `Expecting an Aurelia component from the story: \"${name}\" of \"${title}\".`,\n description: `\n Did you forget to return the Aurelia component from the story?\n Use \"() => ({ template: '<custom-component></custom-component>' })\" when defining the story.\n `,\n });\n return () => {};\n }\n\n showMain();\n\n if (!app || forceRemount) {\n if (forceRemount && app) {\n await teardown(rootElement);\n app = undefined;\n }\n // Clear container before mounting new app\n hostElement.innerHTML = '';\n\n const mergedProps = { ...parameters?.args, ...args, ...story.props };\n\n const aureliaApp = appBootstrapFn(\n story,\n mergedProps,\n hostElement,\n component as Constructable\n );\n await aureliaApp.start();\n appMap.set(rootElement, aureliaApp);\n app = aureliaApp;\n } else {\n // update existing app props\n const mergedProps = { ...parameters?.args, ...args, ...story.props };\n if (app?.root?.controller?.viewModel) {\n Object.assign(app.root.controller.viewModel, mergedProps);\n }\n }\n\n // Return cleanup fn\n return async () => {\n await teardown(rootElement);\n };\n}\n\nexport function createAureliaApp(\n story: AureliaStoryResult,\n args: Record<string, any>,\n domElement: HTMLElement,\n component?: Constructable\n) {\n const aurelia = new Aurelia(story.container);\n\n if (story.items?.length) {\n aurelia.register(...story.items);\n }\n\n if (story.components?.length) {\n aurelia.register(...story.components);\n }\n\n let { template } = story;\n\n if (component) {\n template = template ?? createComponentTemplate(component, story.innerHtml);\n aurelia.register(component);\n }\n\n const App = CustomElement.define(\n {\n name: 'sb-app',\n template,\n containerless: true,\n },\n class {}\n );\n\n const app = Object.assign(new App(), args);\n\n return aurelia.app({\n host: domElement,\n component: app,\n });\n}\n\nexport function createComponentTemplate(\n component: Constructable,\n innerHtml?: string\n): string {\n const def = CustomElement.getDefinition(component);\n\n return `<${def.name} ${Object.values(def.bindables)\n .map((bindable) => `${bindable.attribute}.bind=\"${bindable.name}\"`)\n .join(' ')}>${innerHtml ?? ''}</${def.name}>`;\n}","import type { StorybookConfig } from 'storybook/internal/types';\nimport { renderToCanvas } from './preview/render';\n\nexport { renderToCanvas };\nexport const render = renderToCanvas;\n\n// Define the framework\nexport const framework = {\n name: '@aurelia/storybook',\n options: {}\n};\n\n// Framework configuration for Storybook\nexport const frameworkOptions = {\n builder: {\n name: '@storybook/builder-vite',\n options: {}\n }\n};\n\n// Export a complete framework configuration\nexport const aureliaFramework = {\n name: '@aurelia/storybook',\n options: {},\n builder: '@storybook/builder-vite'\n};\n\n// Provide external dependencies configuration\nexport const externals = {\n 'react': 'React',\n 'react-dom': 'ReactDOM'\n};\n"],"names":["CustomElement"],"mappings":"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"}
1
+ {"version":3,"file":"index.js","sources":["../src/preview/render.ts","../src/index.ts"],"sourcesContent":["import { STORY_CHANGED } from 'storybook/internal/core-events';\nimport type { RenderContext, ArgsStoryFn } from 'storybook/internal/types';\nimport type { AureliaRenderer } from './types';\nimport Aurelia, { Constructable, CustomElement } from 'aurelia';\n\ninterface AureliaStoryResult {\n template: string;\n components?: unknown[];\n Component?: unknown;\n container?: any;\n items?: unknown[];\n innerHtml?: string;\n props?: Record<string, any>;\n}\n\n// Track Aurelia apps for cleanup\nconst appMap = new Map<HTMLElement, any>();\n\nasync function teardown(element: HTMLElement) {\n if (appMap.has(element)) {\n const app = appMap.get(element);\n if (app) {\n await app.stop();\n appMap.delete(element);\n }\n }\n}\n\nexport const render: ArgsStoryFn<AureliaRenderer> = (args, context) => {\n const { id, component: Component } = context;\n \n if (!Component) {\n throw new Error(\n `Unable to render story ${id} as the component annotation is missing from the default export`\n );\n }\n return { Component, props: args, template: '' };\n};\n\nexport async function renderToCanvas(\n {\n storyFn,\n title,\n name,\n showMain,\n showError,\n storyContext,\n forceRemount,\n }: RenderContext<AureliaRenderer>,\n canvasElement: HTMLElement,\n bootstrapAppFn?: typeof createAureliaApp\n) {\n // Store reference to the original storybook root element\n const rootElement = canvasElement;\n\n // Ensure we have (or create) a single container inside the root where the Aurelia app actually renders\n let hostElement: HTMLElement;\n if (rootElement.id === 'storybook-root') {\n hostElement = rootElement.querySelector('.aurelia-story-container') as HTMLElement;\n if (!hostElement) {\n hostElement = document.createElement('div');\n hostElement.className = 'aurelia-story-container';\n hostElement.style.height = '100%';\n rootElement.appendChild(hostElement);\n }\n } else {\n hostElement = rootElement;\n }\n\n // All app instances are now tracked by the *root* element, ensuring we only ever have one per story iframe\n const appBootstrapFn = bootstrapAppFn ?? createAureliaApp;\n const { parameters, component, args } = storyContext;\n \n let app = appMap.get(rootElement);\n const story = storyFn() as AureliaStoryResult;\n \n // Temporary debug logging\n console.log(`[DEBUG] Story: ${name}, forceRemount: ${forceRemount}, hasExistingApp: ${!!app}, canvasId: ${canvasElement.className}`);\n\n if (!story) {\n showError({\n title: `Expecting an Aurelia component from the story: \"${name}\" of \"${title}\".`,\n description: `\n Did you forget to return the Aurelia component from the story?\n Use \"() => ({ template: '<custom-component></custom-component>' })\" when defining the story.\n `,\n });\n return () => {};\n }\n\n showMain();\n\n if (!app || forceRemount) {\n if (forceRemount && app) {\n await teardown(rootElement);\n app = undefined;\n }\n // Clear container before mounting new app\n hostElement.innerHTML = '';\n\n const mergedProps = { ...parameters?.args, ...args, ...story.props };\n\n const aureliaApp = appBootstrapFn(\n story,\n mergedProps,\n hostElement,\n component as Constructable\n );\n await aureliaApp.start();\n appMap.set(rootElement, aureliaApp);\n app = aureliaApp;\n } else {\n // update existing app props\n const mergedProps = { ...parameters?.args, ...args, ...story.props };\n if (app?.root?.controller?.viewModel) {\n Object.assign(app.root.controller.viewModel, mergedProps);\n }\n }\n\n // Return cleanup fn\n return async () => {\n await teardown(rootElement);\n };\n}\n\nexport function createAureliaApp(\n story: AureliaStoryResult,\n args: Record<string, any>,\n domElement: HTMLElement,\n component?: Constructable\n) {\n const aurelia = new Aurelia(story.container);\n\n if (story.items?.length) {\n aurelia.register(...story.items);\n }\n\n if (story.components?.length) {\n aurelia.register(...story.components);\n }\n\n let { template } = story;\n\n if (component) {\n template = template ?? createComponentTemplate(component, story.innerHtml);\n aurelia.register(component);\n }\n\n const App = CustomElement.define(\n {\n name: 'sb-app',\n template,\n containerless: true,\n },\n class {}\n );\n\n const app = Object.assign(new App(), args);\n\n return aurelia.app({\n host: domElement,\n component: app,\n });\n}\n\nexport function createComponentTemplate(\n component: Constructable,\n innerHtml?: string\n): string {\n const def = CustomElement.getDefinition(component);\n\n return `<${def.name} ${Object.values(def.bindables)\n .map((bindable) => `${bindable.attribute}.bind=\"${bindable.name}\"`)\n .join(' ')}>${innerHtml ?? ''}</${def.name}>`;\n}","import type { StorybookConfig } from 'storybook/internal/types';\nimport { renderToCanvas } from './preview/render';\n\nexport { renderToCanvas };\nexport const render = renderToCanvas;\n\n// Define the framework\nexport const framework = {\n name: '@aurelia/storybook',\n options: {}\n};\n\n// Framework configuration for Storybook\nexport const frameworkOptions = {\n builder: {\n name: '@storybook/builder-vite',\n options: {}\n }\n};\n\n// Export a complete framework configuration\nexport const aureliaFramework = {\n name: '@aurelia/storybook',\n options: {},\n builder: '@storybook/builder-vite'\n};\n\n// Provide external dependencies configuration\nexport const externals = {\n 'react': 'React',\n 'react-dom': 'ReactDOM'\n};\n"],"names":[],"mappings":"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"}
package/dist/preset.js CHANGED
@@ -1,7 +1,3 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
1
  /**
6
2
  * A set of rules to be added to the webpack configuration.
7
3
  * @returns
@@ -58,10 +54,7 @@ async function webpackFinal(config) {
58
54
  }
59
55
  // Export a default for compatibility.
60
56
  var preset = { viteFinal, webpackFinal };
61
- const previewAnnotations = [require.resolve('./preview')];
57
+ const previewAnnotations = ['./preview.js'];
62
58
 
63
- exports.default = preset;
64
- exports.previewAnnotations = previewAnnotations;
65
- exports.viteFinal = viteFinal;
66
- exports.webpackFinal = webpackFinal;
59
+ export { preset as default, previewAnnotations, viteFinal, webpackFinal };
67
60
  //# sourceMappingURL=preset.js.map
package/dist/preset.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"preset.js","sources":["../src/webpack.ts","../src/preset.ts"],"sourcesContent":["// src/webpack.ts\nimport type { RuleSetRule } from 'webpack';\n\n/**\n * A set of rules to be added to the webpack configuration.\n * @returns\n */\nexport function getRules(): RuleSetRule[] {\n return [\n {\n test: /\\.ts$/i,\n use: ['ts-loader', '@aurelia/webpack-loader'],\n exclude: /node_modules/,\n },\n {\n test: /\\.html$/i,\n use: '@aurelia/webpack-loader',\n exclude: /node_modules/,\n },\n ];\n}\n","// src/preset.ts\n// Minimal preset for Storybook-Aurelia2\n\nimport { getRules } from './webpack';\n\n/**\n * Optionally adjust the Vite configuration.\n */\nexport async function viteFinal(config: any): Promise<any> {\n // Configure Vite to properly handle dependencies\n config.define = config.define || {};\n config.define['process.env.NODE_ENV'] = JSON.stringify(process.env.NODE_ENV || 'development');\n \n // Configure optimization deps\n config.optimizeDeps = config.optimizeDeps || {};\n config.optimizeDeps.exclude = config.optimizeDeps.exclude || [];\n \n // Only exclude Aurelia-specific dependencies that cause issues\n const excludeList = [\n '@aurelia/runtime-html'\n ];\n \n excludeList.forEach(dep => {\n if (!config.optimizeDeps.exclude.includes(dep)) {\n config.optimizeDeps.exclude.push(dep);\n }\n });\n \n return config;\n}\n\n/**\n * A function to configure webpack.\n * @param config\n * @returns\n */\nexport async function webpackFinal(config: any): Promise<any> {\n const rules = config.module?.rules;\n if (rules) {\n rules.push(...getRules());\n }\n\n return config;\n}\n\n// Export a default for compatibility.\nexport default { viteFinal, webpackFinal };\n\nexport const previewAnnotations = [require.resolve('./preview')];\n"],"names":[],"mappings":";;;;AAGA;;;AAGG;SACa,QAAQ,GAAA;IACtB,OAAO;AACL,QAAA;AACE,YAAA,IAAI,EAAE,QAAQ;AACd,YAAA,GAAG,EAAE,CAAC,WAAW,EAAE,yBAAyB,CAAC;AAC7C,YAAA,OAAO,EAAE,cAAc;AACxB,SAAA;AACD,QAAA;AACE,YAAA,IAAI,EAAE,UAAU;AAChB,YAAA,GAAG,EAAE,yBAAyB;AAC9B,YAAA,OAAO,EAAE,cAAc;AACxB,SAAA;KACF;AACH;;ACpBA;AACA;AAIA;;AAEG;AACI,eAAe,SAAS,CAAC,MAAW,EAAA;;IAEvC,MAAM,CAAC,MAAM,GAAG,MAAM,CAAC,MAAM,IAAI,EAAE;AACnC,IAAA,MAAM,CAAC,MAAM,CAAC,sBAAsB,CAAC,GAAG,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,GAAG,CAAC,QAAQ,IAAI,aAAa,CAAC;;IAG7F,MAAM,CAAC,YAAY,GAAG,MAAM,CAAC,YAAY,IAAI,EAAE;AAC/C,IAAA,MAAM,CAAC,YAAY,CAAC,OAAO,GAAG,MAAM,CAAC,YAAY,CAAC,OAAO,IAAI,EAAE;;AAG/D,IAAA,MAAM,WAAW,GAAG;QAChB;KACH;AAED,IAAA,WAAW,CAAC,OAAO,CAAC,GAAG,IAAG;AACtB,QAAA,IAAI,CAAC,MAAM,CAAC,YAAY,CAAC,OAAO,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE;YAC5C,MAAM,CAAC,YAAY,CAAC,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC;;AAE7C,KAAC,CAAC;AAEF,IAAA,OAAO,MAAM;AACjB;AAEA;;;;AAIG;AACI,eAAe,YAAY,CAAC,MAAW,EAAA;AAC1C,IAAA,MAAM,KAAK,GAAG,MAAM,CAAC,MAAM,EAAE,KAAK;IAClC,IAAI,KAAK,EAAE;AACP,QAAA,KAAK,CAAC,IAAI,CAAC,GAAG,QAAQ,EAAE,CAAC;;AAG7B,IAAA,OAAO,MAAM;AACjB;AAEA;AACA,aAAe,EAAE,SAAS,EAAE,YAAY,EAAE;AAEnC,MAAM,kBAAkB,GAAG,CAAC,OAAO,CAAC,OAAO,CAAC,WAAW,CAAC;;;;;;;"}
1
+ {"version":3,"file":"preset.js","sources":["../src/webpack.ts","../src/preset.ts"],"sourcesContent":["// src/webpack.ts\nimport type { RuleSetRule } from 'webpack';\n\n/**\n * A set of rules to be added to the webpack configuration.\n * @returns\n */\nexport function getRules(): RuleSetRule[] {\n return [\n {\n test: /\\.ts$/i,\n use: ['ts-loader', '@aurelia/webpack-loader'],\n exclude: /node_modules/,\n },\n {\n test: /\\.html$/i,\n use: '@aurelia/webpack-loader',\n exclude: /node_modules/,\n },\n ];\n}\n","// src/preset.ts\n// Minimal preset for Storybook-Aurelia2\n\nimport { getRules } from './webpack';\n\n/**\n * Optionally adjust the Vite configuration.\n */\nexport async function viteFinal(config: any): Promise<any> {\n // Configure Vite to properly handle dependencies\n config.define = config.define || {};\n config.define['process.env.NODE_ENV'] = JSON.stringify(process.env.NODE_ENV || 'development');\n \n // Configure optimization deps\n config.optimizeDeps = config.optimizeDeps || {};\n config.optimizeDeps.exclude = config.optimizeDeps.exclude || [];\n \n // Only exclude Aurelia-specific dependencies that cause issues\n const excludeList = [\n '@aurelia/runtime-html'\n ];\n \n excludeList.forEach(dep => {\n if (!config.optimizeDeps.exclude.includes(dep)) {\n config.optimizeDeps.exclude.push(dep);\n }\n });\n \n return config;\n}\n\n/**\n * A function to configure webpack.\n * @param config\n * @returns\n */\nexport async function webpackFinal(config: any): Promise<any> {\n const rules = config.module?.rules;\n if (rules) {\n rules.push(...getRules());\n }\n\n return config;\n}\n\n// Export a default for compatibility.\nexport default { viteFinal, webpackFinal };\n\nexport const previewAnnotations = ['./preview.js'];\n"],"names":[],"mappings":"AAGA;;;AAGG;SACa,QAAQ,GAAA;IACtB,OAAO;AACL,QAAA;AACE,YAAA,IAAI,EAAE,QAAQ;AACd,YAAA,GAAG,EAAE,CAAC,WAAW,EAAE,yBAAyB,CAAC;AAC7C,YAAA,OAAO,EAAE,cAAc;AACxB,SAAA;AACD,QAAA;AACE,YAAA,IAAI,EAAE,UAAU;AAChB,YAAA,GAAG,EAAE,yBAAyB;AAC9B,YAAA,OAAO,EAAE,cAAc;AACxB,SAAA;KACF;AACH;;ACpBA;AACA;AAIA;;AAEG;AACI,eAAe,SAAS,CAAC,MAAW,EAAA;;IAEvC,MAAM,CAAC,MAAM,GAAG,MAAM,CAAC,MAAM,IAAI,EAAE;AACnC,IAAA,MAAM,CAAC,MAAM,CAAC,sBAAsB,CAAC,GAAG,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,GAAG,CAAC,QAAQ,IAAI,aAAa,CAAC;;IAG7F,MAAM,CAAC,YAAY,GAAG,MAAM,CAAC,YAAY,IAAI,EAAE;AAC/C,IAAA,MAAM,CAAC,YAAY,CAAC,OAAO,GAAG,MAAM,CAAC,YAAY,CAAC,OAAO,IAAI,EAAE;;AAG/D,IAAA,MAAM,WAAW,GAAG;QAChB;KACH;AAED,IAAA,WAAW,CAAC,OAAO,CAAC,GAAG,IAAG;AACtB,QAAA,IAAI,CAAC,MAAM,CAAC,YAAY,CAAC,OAAO,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE;YAC5C,MAAM,CAAC,YAAY,CAAC,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC;QACzC;AACJ,IAAA,CAAC,CAAC;AAEF,IAAA,OAAO,MAAM;AACjB;AAEA;;;;AAIG;AACI,eAAe,YAAY,CAAC,MAAW,EAAA;AAC1C,IAAA,MAAM,KAAK,GAAG,MAAM,CAAC,MAAM,EAAE,KAAK;IAClC,IAAI,KAAK,EAAE;AACP,QAAA,KAAK,CAAC,IAAI,CAAC,GAAG,QAAQ,EAAE,CAAC;IAC7B;AAEA,IAAA,OAAO,MAAM;AACjB;AAEA;AACA,aAAe,EAAE,SAAS,EAAE,YAAY,EAAE;AAEnC,MAAM,kBAAkB,GAAG,CAAC,cAAc;;;;"}
package/dist/preview/render.js CHANGED
@@ -1,6 +1,4 @@
1
- 'use strict';
2
-
3
- var Aurelia = require('aurelia');
1
+ import Aurelia, { CustomElement } from 'aurelia';
4
2
 
5
3
  // Track Aurelia apps for cleanup
6
4
  const appMap = new Map();
@@ -93,7 +91,7 @@ function createAureliaApp(story, args, domElement, component) {
93
91
  template = template ?? createComponentTemplate(component, story.innerHtml);
94
92
  aurelia.register(component);
95
93
  }
96
- const App = Aurelia.CustomElement.define({
94
+ const App = CustomElement.define({
97
95
  name: 'sb-app',
98
96
  template,
99
97
  containerless: true,
@@ -106,14 +104,11 @@ function createAureliaApp(story, args, domElement, component) {
106
104
  });
107
105
  }
108
106
  function createComponentTemplate(component, innerHtml) {
109
- const def = Aurelia.CustomElement.getDefinition(component);
107
+ const def = CustomElement.getDefinition(component);
110
108
  return `<${def.name} ${Object.values(def.bindables)
111
109
  .map((bindable) => `${bindable.attribute}.bind="${bindable.name}"`)
112
110
  .join(' ')}>${innerHtml ?? ''}</${def.name}>`;
113
111
  }
114
112
 
115
- exports.createAureliaApp = createAureliaApp;
116
- exports.createComponentTemplate = createComponentTemplate;
117
- exports.render = render;
118
- exports.renderToCanvas = renderToCanvas;
113
+ export { createAureliaApp, createComponentTemplate, render, renderToCanvas };
119
114
  //# sourceMappingURL=render.js.map
package/dist/preview/render.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"render.js","sources":["../../src/preview/render.ts"],"sourcesContent":["import { STORY_CHANGED } from 'storybook/internal/core-events';\nimport type { RenderContext, ArgsStoryFn } from 'storybook/internal/types';\nimport type { AureliaRenderer } from './types';\nimport Aurelia, { Constructable, CustomElement } from 'aurelia';\n\ninterface AureliaStoryResult {\n template: string;\n components?: unknown[];\n Component?: unknown;\n container?: any;\n items?: unknown[];\n innerHtml?: string;\n props?: Record<string, any>;\n}\n\n// Track Aurelia apps for cleanup\nconst appMap = new Map<HTMLElement, any>();\n\nasync function teardown(element: HTMLElement) {\n if (appMap.has(element)) {\n const app = appMap.get(element);\n if (app) {\n await app.stop();\n appMap.delete(element);\n }\n }\n}\n\nexport const render: ArgsStoryFn<AureliaRenderer> = (args, context) => {\n const { id, component: Component } = context;\n \n if (!Component) {\n throw new Error(\n `Unable to render story ${id} as the component annotation is missing from the default export`\n );\n }\n return { Component, props: args, template: '' };\n};\n\nexport async function renderToCanvas(\n {\n storyFn,\n title,\n name,\n showMain,\n showError,\n storyContext,\n forceRemount,\n }: RenderContext<AureliaRenderer>,\n canvasElement: HTMLElement,\n bootstrapAppFn?: typeof createAureliaApp\n) {\n // Store reference to the original storybook root element\n const rootElement = canvasElement;\n\n // Ensure we have (or create) a single container inside the root where the Aurelia app actually renders\n let hostElement: HTMLElement;\n if (rootElement.id === 'storybook-root') {\n hostElement = rootElement.querySelector('.aurelia-story-container') as HTMLElement;\n if (!hostElement) {\n hostElement = document.createElement('div');\n hostElement.className = 'aurelia-story-container';\n hostElement.style.height = '100%';\n rootElement.appendChild(hostElement);\n }\n } else {\n hostElement = rootElement;\n }\n\n // All app instances are now tracked by the *root* element, ensuring we only ever have one per story iframe\n const appBootstrapFn = bootstrapAppFn ?? createAureliaApp;\n const { parameters, component, args } = storyContext;\n \n let app = appMap.get(rootElement);\n const story = storyFn() as AureliaStoryResult;\n \n // Temporary debug logging\n console.log(`[DEBUG] Story: ${name}, forceRemount: ${forceRemount}, hasExistingApp: ${!!app}, canvasId: ${canvasElement.className}`);\n\n if (!story) {\n showError({\n title: `Expecting an Aurelia component from the story: \"${name}\" of \"${title}\".`,\n description: `\n Did you forget to return the Aurelia component from the story?\n Use \"() => ({ template: '<custom-component></custom-component>' })\" when defining the story.\n `,\n });\n return () => {};\n }\n\n showMain();\n\n if (!app || forceRemount) {\n if (forceRemount && app) {\n await teardown(rootElement);\n app = undefined;\n }\n // Clear container before mounting new app\n hostElement.innerHTML = '';\n\n const mergedProps = { ...parameters?.args, ...args, ...story.props };\n\n const aureliaApp = appBootstrapFn(\n story,\n mergedProps,\n hostElement,\n component as Constructable\n );\n await aureliaApp.start();\n appMap.set(rootElement, aureliaApp);\n app = aureliaApp;\n } else {\n // update existing app props\n const mergedProps = { ...parameters?.args, ...args, ...story.props };\n if (app?.root?.controller?.viewModel) {\n Object.assign(app.root.controller.viewModel, mergedProps);\n }\n }\n\n // Return cleanup fn\n return async () => {\n await teardown(rootElement);\n };\n}\n\nexport function createAureliaApp(\n story: AureliaStoryResult,\n args: Record<string, any>,\n domElement: HTMLElement,\n component?: Constructable\n) {\n const aurelia = new Aurelia(story.container);\n\n if (story.items?.length) {\n aurelia.register(...story.items);\n }\n\n if (story.components?.length) {\n aurelia.register(...story.components);\n }\n\n let { template } = story;\n\n if (component) {\n template = template ?? createComponentTemplate(component, story.innerHtml);\n aurelia.register(component);\n }\n\n const App = CustomElement.define(\n {\n name: 'sb-app',\n template,\n containerless: true,\n },\n class {}\n );\n\n const app = Object.assign(new App(), args);\n\n return aurelia.app({\n host: domElement,\n component: app,\n });\n}\n\nexport function createComponentTemplate(\n component: Constructable,\n innerHtml?: string\n): string {\n const def = CustomElement.getDefinition(component);\n\n return `<${def.name} ${Object.values(def.bindables)\n .map((bindable) => `${bindable.attribute}.bind=\"${bindable.name}\"`)\n .join(' ')}>${innerHtml ?? ''}</${def.name}>`;\n}"],"names":["CustomElement"],"mappings":"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"}
1
+ {"version":3,"file":"render.js","sources":["../../src/preview/render.ts"],"sourcesContent":["import { STORY_CHANGED } from 'storybook/internal/core-events';\nimport type { RenderContext, ArgsStoryFn } from 'storybook/internal/types';\nimport type { AureliaRenderer } from './types';\nimport Aurelia, { Constructable, CustomElement } from 'aurelia';\n\ninterface AureliaStoryResult {\n template: string;\n components?: unknown[];\n Component?: unknown;\n container?: any;\n items?: unknown[];\n innerHtml?: string;\n props?: Record<string, any>;\n}\n\n// Track Aurelia apps for cleanup\nconst appMap = new Map<HTMLElement, any>();\n\nasync function teardown(element: HTMLElement) {\n if (appMap.has(element)) {\n const app = appMap.get(element);\n if (app) {\n await app.stop();\n appMap.delete(element);\n }\n }\n}\n\nexport const render: ArgsStoryFn<AureliaRenderer> = (args, context) => {\n const { id, component: Component } = context;\n \n if (!Component) {\n throw new Error(\n `Unable to render story ${id} as the component annotation is missing from the default export`\n );\n }\n return { Component, props: args, template: '' };\n};\n\nexport async function renderToCanvas(\n {\n storyFn,\n title,\n name,\n showMain,\n showError,\n storyContext,\n forceRemount,\n }: RenderContext<AureliaRenderer>,\n canvasElement: HTMLElement,\n bootstrapAppFn?: typeof createAureliaApp\n) {\n // Store reference to the original storybook root element\n const rootElement = canvasElement;\n\n // Ensure we have (or create) a single container inside the root where the Aurelia app actually renders\n let hostElement: HTMLElement;\n if (rootElement.id === 'storybook-root') {\n hostElement = rootElement.querySelector('.aurelia-story-container') as HTMLElement;\n if (!hostElement) {\n hostElement = document.createElement('div');\n hostElement.className = 'aurelia-story-container';\n hostElement.style.height = '100%';\n rootElement.appendChild(hostElement);\n }\n } else {\n hostElement = rootElement;\n }\n\n // All app instances are now tracked by the *root* element, ensuring we only ever have one per story iframe\n const appBootstrapFn = bootstrapAppFn ?? createAureliaApp;\n const { parameters, component, args } = storyContext;\n \n let app = appMap.get(rootElement);\n const story = storyFn() as AureliaStoryResult;\n \n // Temporary debug logging\n console.log(`[DEBUG] Story: ${name}, forceRemount: ${forceRemount}, hasExistingApp: ${!!app}, canvasId: ${canvasElement.className}`);\n\n if (!story) {\n showError({\n title: `Expecting an Aurelia component from the story: \"${name}\" of \"${title}\".`,\n description: `\n Did you forget to return the Aurelia component from the story?\n Use \"() => ({ template: '<custom-component></custom-component>' })\" when defining the story.\n `,\n });\n return () => {};\n }\n\n showMain();\n\n if (!app || forceRemount) {\n if (forceRemount && app) {\n await teardown(rootElement);\n app = undefined;\n }\n // Clear container before mounting new app\n hostElement.innerHTML = '';\n\n const mergedProps = { ...parameters?.args, ...args, ...story.props };\n\n const aureliaApp = appBootstrapFn(\n story,\n mergedProps,\n hostElement,\n component as Constructable\n );\n await aureliaApp.start();\n appMap.set(rootElement, aureliaApp);\n app = aureliaApp;\n } else {\n // update existing app props\n const mergedProps = { ...parameters?.args, ...args, ...story.props };\n if (app?.root?.controller?.viewModel) {\n Object.assign(app.root.controller.viewModel, mergedProps);\n }\n }\n\n // Return cleanup fn\n return async () => {\n await teardown(rootElement);\n };\n}\n\nexport function createAureliaApp(\n story: AureliaStoryResult,\n args: Record<string, any>,\n domElement: HTMLElement,\n component?: Constructable\n) {\n const aurelia = new Aurelia(story.container);\n\n if (story.items?.length) {\n aurelia.register(...story.items);\n }\n\n if (story.components?.length) {\n aurelia.register(...story.components);\n }\n\n let { template } = story;\n\n if (component) {\n template = template ?? createComponentTemplate(component, story.innerHtml);\n aurelia.register(component);\n }\n\n const App = CustomElement.define(\n {\n name: 'sb-app',\n template,\n containerless: true,\n },\n class {}\n );\n\n const app = Object.assign(new App(), args);\n\n return aurelia.app({\n host: domElement,\n component: app,\n });\n}\n\nexport function createComponentTemplate(\n component: Constructable,\n innerHtml?: string\n): string {\n const def = CustomElement.getDefinition(component);\n\n return `<${def.name} ${Object.values(def.bindables)\n .map((bindable) => `${bindable.attribute}.bind=\"${bindable.name}\"`)\n .join(' ')}>${innerHtml ?? ''}</${def.name}>`;\n}"],"names":[],"mappings":"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"}
package/dist/preview/types.js CHANGED
@@ -1,3 +1,2 @@
1
- 'use strict';
2
1
 
3
2
  //# sourceMappingURL=types.js.map
package/dist/preview/types.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"types.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;"}
1
+ {"version":3,"file":"types.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
package/dist/preview.js CHANGED
@@ -1,6 +1,4 @@
1
- 'use strict';
2
-
3
- var Aurelia = require('aurelia');
1
+ import Aurelia, { CustomElement } from 'aurelia';
4
2
 
5
3
  // Track Aurelia apps for cleanup
6
4
  const appMap = new Map();
@@ -93,7 +91,7 @@ function createAureliaApp(story, args, domElement, component) {
93
91
  template = template ?? createComponentTemplate(component, story.innerHtml);
94
92
  aurelia.register(component);
95
93
  }
96
- const App = Aurelia.CustomElement.define({
94
+ const App = CustomElement.define({
97
95
  name: 'sb-app',
98
96
  template,
99
97
  containerless: true,
@@ -106,12 +104,11 @@ function createAureliaApp(story, args, domElement, component) {
106
104
  });
107
105
  }
108
106
  function createComponentTemplate(component, innerHtml) {
109
- const def = Aurelia.CustomElement.getDefinition(component);
107
+ const def = CustomElement.getDefinition(component);
110
108
  return `<${def.name} ${Object.values(def.bindables)
111
109
  .map((bindable) => `${bindable.attribute}.bind="${bindable.name}"`)
112
110
  .join(' ')}>${innerHtml ?? ''}</${def.name}>`;
113
111
  }
114
112
 
115
- exports.render = render;
116
- exports.renderToCanvas = renderToCanvas;
113
+ export { render, renderToCanvas };
117
114
  //# sourceMappingURL=preview.js.map
package/dist/preview.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"preview.js","sources":["../src/preview/render.ts"],"sourcesContent":["import { STORY_CHANGED } from 'storybook/internal/core-events';\nimport type { RenderContext, ArgsStoryFn } from 'storybook/internal/types';\nimport type { AureliaRenderer } from './types';\nimport Aurelia, { Constructable, CustomElement } from 'aurelia';\n\ninterface AureliaStoryResult {\n template: string;\n components?: unknown[];\n Component?: unknown;\n container?: any;\n items?: unknown[];\n innerHtml?: string;\n props?: Record<string, any>;\n}\n\n// Track Aurelia apps for cleanup\nconst appMap = new Map<HTMLElement, any>();\n\nasync function teardown(element: HTMLElement) {\n if (appMap.has(element)) {\n const app = appMap.get(element);\n if (app) {\n await app.stop();\n appMap.delete(element);\n }\n }\n}\n\nexport const render: ArgsStoryFn<AureliaRenderer> = (args, context) => {\n const { id, component: Component } = context;\n \n if (!Component) {\n throw new Error(\n `Unable to render story ${id} as the component annotation is missing from the default export`\n );\n }\n return { Component, props: args, template: '' };\n};\n\nexport async function renderToCanvas(\n {\n storyFn,\n title,\n name,\n showMain,\n showError,\n storyContext,\n forceRemount,\n }: RenderContext<AureliaRenderer>,\n canvasElement: HTMLElement,\n bootstrapAppFn?: typeof createAureliaApp\n) {\n // Store reference to the original storybook root element\n const rootElement = canvasElement;\n\n // Ensure we have (or create) a single container inside the root where the Aurelia app actually renders\n let hostElement: HTMLElement;\n if (rootElement.id === 'storybook-root') {\n hostElement = rootElement.querySelector('.aurelia-story-container') as HTMLElement;\n if (!hostElement) {\n hostElement = document.createElement('div');\n hostElement.className = 'aurelia-story-container';\n hostElement.style.height = '100%';\n rootElement.appendChild(hostElement);\n }\n } else {\n hostElement = rootElement;\n }\n\n // All app instances are now tracked by the *root* element, ensuring we only ever have one per story iframe\n const appBootstrapFn = bootstrapAppFn ?? createAureliaApp;\n const { parameters, component, args } = storyContext;\n \n let app = appMap.get(rootElement);\n const story = storyFn() as AureliaStoryResult;\n \n // Temporary debug logging\n console.log(`[DEBUG] Story: ${name}, forceRemount: ${forceRemount}, hasExistingApp: ${!!app}, canvasId: ${canvasElement.className}`);\n\n if (!story) {\n showError({\n title: `Expecting an Aurelia component from the story: \"${name}\" of \"${title}\".`,\n description: `\n Did you forget to return the Aurelia component from the story?\n Use \"() => ({ template: '<custom-component></custom-component>' })\" when defining the story.\n `,\n });\n return () => {};\n }\n\n showMain();\n\n if (!app || forceRemount) {\n if (forceRemount && app) {\n await teardown(rootElement);\n app = undefined;\n }\n // Clear container before mounting new app\n hostElement.innerHTML = '';\n\n const mergedProps = { ...parameters?.args, ...args, ...story.props };\n\n const aureliaApp = appBootstrapFn(\n story,\n mergedProps,\n hostElement,\n component as Constructable\n );\n await aureliaApp.start();\n appMap.set(rootElement, aureliaApp);\n app = aureliaApp;\n } else {\n // update existing app props\n const mergedProps = { ...parameters?.args, ...args, ...story.props };\n if (app?.root?.controller?.viewModel) {\n Object.assign(app.root.controller.viewModel, mergedProps);\n }\n }\n\n // Return cleanup fn\n return async () => {\n await teardown(rootElement);\n };\n}\n\nexport function createAureliaApp(\n story: AureliaStoryResult,\n args: Record<string, any>,\n domElement: HTMLElement,\n component?: Constructable\n) {\n const aurelia = new Aurelia(story.container);\n\n if (story.items?.length) {\n aurelia.register(...story.items);\n }\n\n if (story.components?.length) {\n aurelia.register(...story.components);\n }\n\n let { template } = story;\n\n if (component) {\n template = template ?? createComponentTemplate(component, story.innerHtml);\n aurelia.register(component);\n }\n\n const App = CustomElement.define(\n {\n name: 'sb-app',\n template,\n containerless: true,\n },\n class {}\n );\n\n const app = Object.assign(new App(), args);\n\n return aurelia.app({\n host: domElement,\n component: app,\n });\n}\n\nexport function createComponentTemplate(\n component: Constructable,\n innerHtml?: string\n): string {\n const def = CustomElement.getDefinition(component);\n\n return `<${def.name} ${Object.values(def.bindables)\n .map((bindable) => `${bindable.attribute}.bind=\"${bindable.name}\"`)\n .join(' ')}>${innerHtml ?? ''}</${def.name}>`;\n}"],"names":["CustomElement"],"mappings":"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"}
1
+ {"version":3,"file":"preview.js","sources":["../src/preview/render.ts"],"sourcesContent":["import { STORY_CHANGED } from 'storybook/internal/core-events';\nimport type { RenderContext, ArgsStoryFn } from 'storybook/internal/types';\nimport type { AureliaRenderer } from './types';\nimport Aurelia, { Constructable, CustomElement } from 'aurelia';\n\ninterface AureliaStoryResult {\n template: string;\n components?: unknown[];\n Component?: unknown;\n container?: any;\n items?: unknown[];\n innerHtml?: string;\n props?: Record<string, any>;\n}\n\n// Track Aurelia apps for cleanup\nconst appMap = new Map<HTMLElement, any>();\n\nasync function teardown(element: HTMLElement) {\n if (appMap.has(element)) {\n const app = appMap.get(element);\n if (app) {\n await app.stop();\n appMap.delete(element);\n }\n }\n}\n\nexport const render: ArgsStoryFn<AureliaRenderer> = (args, context) => {\n const { id, component: Component } = context;\n \n if (!Component) {\n throw new Error(\n `Unable to render story ${id} as the component annotation is missing from the default export`\n );\n }\n return { Component, props: args, template: '' };\n};\n\nexport async function renderToCanvas(\n {\n storyFn,\n title,\n name,\n showMain,\n showError,\n storyContext,\n forceRemount,\n }: RenderContext<AureliaRenderer>,\n canvasElement: HTMLElement,\n bootstrapAppFn?: typeof createAureliaApp\n) {\n // Store reference to the original storybook root element\n const rootElement = canvasElement;\n\n // Ensure we have (or create) a single container inside the root where the Aurelia app actually renders\n let hostElement: HTMLElement;\n if (rootElement.id === 'storybook-root') {\n hostElement = rootElement.querySelector('.aurelia-story-container') as HTMLElement;\n if (!hostElement) {\n hostElement = document.createElement('div');\n hostElement.className = 'aurelia-story-container';\n hostElement.style.height = '100%';\n rootElement.appendChild(hostElement);\n }\n } else {\n hostElement = rootElement;\n }\n\n // All app instances are now tracked by the *root* element, ensuring we only ever have one per story iframe\n const appBootstrapFn = bootstrapAppFn ?? createAureliaApp;\n const { parameters, component, args } = storyContext;\n \n let app = appMap.get(rootElement);\n const story = storyFn() as AureliaStoryResult;\n \n // Temporary debug logging\n console.log(`[DEBUG] Story: ${name}, forceRemount: ${forceRemount}, hasExistingApp: ${!!app}, canvasId: ${canvasElement.className}`);\n\n if (!story) {\n showError({\n title: `Expecting an Aurelia component from the story: \"${name}\" of \"${title}\".`,\n description: `\n Did you forget to return the Aurelia component from the story?\n Use \"() => ({ template: '<custom-component></custom-component>' })\" when defining the story.\n `,\n });\n return () => {};\n }\n\n showMain();\n\n if (!app || forceRemount) {\n if (forceRemount && app) {\n await teardown(rootElement);\n app = undefined;\n }\n // Clear container before mounting new app\n hostElement.innerHTML = '';\n\n const mergedProps = { ...parameters?.args, ...args, ...story.props };\n\n const aureliaApp = appBootstrapFn(\n story,\n mergedProps,\n hostElement,\n component as Constructable\n );\n await aureliaApp.start();\n appMap.set(rootElement, aureliaApp);\n app = aureliaApp;\n } else {\n // update existing app props\n const mergedProps = { ...parameters?.args, ...args, ...story.props };\n if (app?.root?.controller?.viewModel) {\n Object.assign(app.root.controller.viewModel, mergedProps);\n }\n }\n\n // Return cleanup fn\n return async () => {\n await teardown(rootElement);\n };\n}\n\nexport function createAureliaApp(\n story: AureliaStoryResult,\n args: Record<string, any>,\n domElement: HTMLElement,\n component?: Constructable\n) {\n const aurelia = new Aurelia(story.container);\n\n if (story.items?.length) {\n aurelia.register(...story.items);\n }\n\n if (story.components?.length) {\n aurelia.register(...story.components);\n }\n\n let { template } = story;\n\n if (component) {\n template = template ?? createComponentTemplate(component, story.innerHtml);\n aurelia.register(component);\n }\n\n const App = CustomElement.define(\n {\n name: 'sb-app',\n template,\n containerless: true,\n },\n class {}\n );\n\n const app = Object.assign(new App(), args);\n\n return aurelia.app({\n host: domElement,\n component: app,\n });\n}\n\nexport function createComponentTemplate(\n component: Constructable,\n innerHtml?: string\n): string {\n const def = CustomElement.getDefinition(component);\n\n return `<${def.name} ${Object.values(def.bindables)\n .map((bindable) => `${bindable.attribute}.bind=\"${bindable.name}\"`)\n .join(' ')}>${innerHtml ?? ''}</${def.name}>`;\n}"],"names":[],"mappings":"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"}
package/dist/webpack.js CHANGED
@@ -1,5 +1,3 @@
1
- 'use strict';
2
-
3
1
  /**
4
2
  * A set of rules to be added to the webpack configuration.
5
3
  * @returns
@@ -19,5 +17,5 @@ function getRules() {
19
17
  ];
20
18
  }
21
19
 
22
- exports.getRules = getRules;
20
+ export { getRules };
23
21
  //# sourceMappingURL=webpack.js.map
package/dist/webpack.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"webpack.js","sources":["../src/webpack.ts"],"sourcesContent":["// src/webpack.ts\nimport type { RuleSetRule } from 'webpack';\n\n/**\n * A set of rules to be added to the webpack configuration.\n * @returns\n */\nexport function getRules(): RuleSetRule[] {\n return [\n {\n test: /\\.ts$/i,\n use: ['ts-loader', '@aurelia/webpack-loader'],\n exclude: /node_modules/,\n },\n {\n test: /\\.html$/i,\n use: '@aurelia/webpack-loader',\n exclude: /node_modules/,\n },\n ];\n}\n"],"names":[],"mappings":";;AAGA;;;AAGG;SACa,QAAQ,GAAA;IACtB,OAAO;AACL,QAAA;AACE,YAAA,IAAI,EAAE,QAAQ;AACd,YAAA,GAAG,EAAE,CAAC,WAAW,EAAE,yBAAyB,CAAC;AAC7C,YAAA,OAAO,EAAE,cAAc;AACxB,SAAA;AACD,QAAA;AACE,YAAA,IAAI,EAAE,UAAU;AAChB,YAAA,GAAG,EAAE,yBAAyB;AAC9B,YAAA,OAAO,EAAE,cAAc;AACxB,SAAA;KACF;AACH;;;;"}
1
+ {"version":3,"file":"webpack.js","sources":["../src/webpack.ts"],"sourcesContent":["// src/webpack.ts\nimport type { RuleSetRule } from 'webpack';\n\n/**\n * A set of rules to be added to the webpack configuration.\n * @returns\n */\nexport function getRules(): RuleSetRule[] {\n return [\n {\n test: /\\.ts$/i,\n use: ['ts-loader', '@aurelia/webpack-loader'],\n exclude: /node_modules/,\n },\n {\n test: /\\.html$/i,\n use: '@aurelia/webpack-loader',\n exclude: /node_modules/,\n },\n ];\n}\n"],"names":[],"mappings":"AAGA;;;AAGG;SACa,QAAQ,GAAA;IACtB,OAAO;AACL,QAAA;AACE,YAAA,IAAI,EAAE,QAAQ;AACd,YAAA,GAAG,EAAE,CAAC,WAAW,EAAE,yBAAyB,CAAC;AAC7C,YAAA,OAAO,EAAE,cAAc;AACxB,SAAA;AACD,QAAA;AACE,YAAA,IAAI,EAAE,UAAU;AAChB,YAAA,GAAG,EAAE,yBAAyB;AAC9B,YAAA,OAAO,EAAE,cAAc;AACxB,SAAA;KACF;AACH;;;;"}
package/package.json CHANGED
@@ -1,13 +1,16 @@
1
1
  {
2
2
  "name": "@aurelia/storybook",
3
- "version": "1.0.2",
3
+ "version": "2.0.0",
4
4
  "description": "A Storybook plugin to render Aurelia 2 components using Vite or Webpack",
5
+ "type": "module",
5
6
  "main": "dist/index.js",
6
7
  "types": "dist/index.d.ts",
7
- "module": "dist/index.mjs",
8
8
  "publishConfig": {
9
9
  "access": "public"
10
10
  },
11
+ "engines": {
12
+ "node": ">=20.19.0 || >=22.12.0"
13
+ },
11
14
  "scripts": {
12
15
  "build": "rollup -c",
13
16
  "build:types": "tsc --project tsconfig.build.json --emitDeclarationOnly",
@@ -15,37 +18,31 @@
15
18
  "test": "NODE_OPTIONS=--no-deprecation jest"
16
19
  },
17
20
  "peerDependencies": {
18
- "@aurelia/runtime-html": "^2.0.0-beta.24",
19
- "@aurelia/vite-plugin": "^2.0.0-beta.24",
20
- "@storybook/builder-vite": "^9.0.0",
21
- "@storybook/builder-webpack5": "^9.0.0",
22
- "aurelia": "^2.0.0-beta.24",
23
- "storybook": "^9.0.0"
21
+ "@aurelia/runtime-html": "^2.0.0-beta.25",
22
+ "@aurelia/vite-plugin": "^2.0.0-beta.25",
23
+ "@storybook/builder-vite": "^10.0.0",
24
+ "@storybook/builder-webpack5": "^10.0.0",
25
+ "aurelia": "^2.0.0-beta.25",
26
+ "storybook": "^10.0.0"
24
27
  },
25
28
  "devDependencies": {
26
- "@aurelia/webpack-loader": "^2.0.0-beta.24",
29
+ "@aurelia/webpack-loader": "^2.0.0-beta.25",
27
30
  "@rollup/plugin-commonjs": "^28.0.6",
28
31
  "@rollup/plugin-node-resolve": "^16.0.1",
29
32
  "@rollup/plugin-typescript": "^12.1.3",
30
- "@storybook/builder-vite": "^9.0.12",
31
- "storybook": "^9.0.12",
33
+ "@storybook/builder-vite": "^10.0.5",
32
34
  "@types/jest": "^30.0.0",
33
35
  "glob": "^11.0.3",
34
36
  "jest": "^30.0.2",
35
37
  "jest-environment-jsdom": "^30.0.2",
36
38
  "rollup": "^4.44.0",
39
+ "storybook": "^10.0.0",
37
40
  "ts-jest": "^29.4.0",
38
41
  "ts-loader": "^9.5.2",
39
42
  "typescript": "^5.8.3"
40
43
  },
41
44
  "exports": {
42
- ".": {
43
- "require": "./dist/index.js",
44
- "import": "./dist/index.mjs"
45
- },
46
- "./preset": {
47
- "require": "./dist/preset.js",
48
- "import": "./dist/preset.mjs"
49
- }
45
+ ".": "./dist/index.js",
46
+ "./preset": "./dist/preset.js"
50
47
  }
51
48
  }
package/rollup.config.mjs CHANGED
@@ -26,7 +26,7 @@ const createConfig = (input, output) => ({
26
26
  input,
27
27
  output: {
28
28
  file: output,
29
- format: output.endsWith('.mjs') ? 'esm' : 'cjs',
29
+ format: 'esm',
30
30
  sourcemap: true,
31
31
  exports: 'named'
32
32
  },
@@ -42,12 +42,9 @@ const createConfig = (input, output) => ({
42
42
  external
43
43
  });
44
44
 
45
- // Create configs for all source files
46
- const configs = Object.entries(srcFiles).flatMap(([name, input]) => [
47
- // ESM build
48
- createConfig(input, `dist/${name}.mjs`),
49
- // CommonJS build
45
+ // Create configs for all source files - ESM only for Storybook v10
46
+ const configs = Object.entries(srcFiles).map(([name, input]) =>
50
47
  createConfig(input, `dist/${name}.js`)
51
- ]);
48
+ );
52
49
 
53
50
  export default configs;
package/src/preset.ts CHANGED
@@ -46,4 +46,4 @@ export async function webpackFinal(config: any): Promise<any> {
46
46
  // Export a default for compatibility.
47
47
  export default { viteFinal, webpackFinal };
48
48
 
49
- export const previewAnnotations = [require.resolve('./preview')];
49
+ export const previewAnnotations = ['./preview.js'];
package/tsconfig.json CHANGED
@@ -6,7 +6,7 @@
6
6
  "outDir": "dist",
7
7
  "rootDir": "src",
8
8
  "strict": true,
9
- "moduleResolution": "node",
9
+ "moduleResolution": "bundler",
10
10
  "esModuleInterop": true,
11
11
  "skipLibCheck": true
12
12
  },