apprun 3.38.0 → 3.38.1

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 (56) hide show
  1. package/.claude/settings.local.json +18 -0
  2. package/.docs/done/2026/07/13/explicit-pretty-links.md +32 -0
  3. package/.docs/done/2026/07/13/first-render-dom-attributes.md +18 -0
  4. package/.docs/plans/2026/07/13/plan-explicit-pretty-links.md +119 -0
  5. package/.docs/plans/2026/07/13/plan-first-render-dom-attributes.md +66 -0
  6. package/.docs/plans/2026/07/13/plan-play-typescript-runtime.md +77 -0
  7. package/.docs/plans/2026/07/13/plan-release-3-38-1-docs.md +74 -0
  8. package/.docs/reqs/2026/07/13/req-explicit-pretty-links.md +46 -0
  9. package/.docs/reqs/2026/07/13/req-first-render-dom-attributes.md +31 -0
  10. package/.docs/reqs/2026/07/13/req-play-typescript-runtime.md +29 -0
  11. package/.docs/reqs/2026/07/13/req-release-3-38-1-docs.md +34 -0
  12. package/.playwright-mcp/console-2026-06-24T18-37-47-881Z.log +17 -0
  13. package/CHANGELOG.md +8 -1
  14. package/README.md +3 -2
  15. package/WHATSNEW.md +26 -6
  16. package/apprun.d.ts +4 -1
  17. package/cli/app.js +7 -0
  18. package/dist/apprun-code.js +1 -1
  19. package/dist/apprun-code.js.map +1 -1
  20. package/dist/apprun-dev-tools.js +1 -1
  21. package/dist/apprun-dev-tools.js.map +1 -1
  22. package/dist/apprun-html.esm.js +3 -3
  23. package/dist/apprun-html.esm.js.map +1 -1
  24. package/dist/apprun-html.js +1 -1
  25. package/dist/apprun-html.js.map +1 -1
  26. package/dist/apprun-play-html.esm.js +2 -2
  27. package/dist/apprun-play-html.esm.js.map +1 -1
  28. package/dist/apprun-play.js +1 -1
  29. package/dist/apprun-play.js.map +1 -1
  30. package/dist/apprun.esm.js +1 -1
  31. package/dist/apprun.esm.js.map +1 -1
  32. package/dist/apprun.js +1 -1
  33. package/dist/apprun.js.map +1 -1
  34. package/dist/createState.js.map +1 -1
  35. package/esm/apprun-code.js +15 -3
  36. package/esm/apprun-code.js.map +1 -1
  37. package/esm/apprun-play.js +8 -2
  38. package/esm/apprun-play.js.map +1 -1
  39. package/esm/apprun.js +16 -8
  40. package/esm/apprun.js.map +1 -1
  41. package/esm/router.js +3 -2
  42. package/esm/router.js.map +1 -1
  43. package/esm/types.js +1 -0
  44. package/esm/types.js.map +1 -1
  45. package/esm/vdom-my-prop-attr.js +5 -11
  46. package/esm/vdom-my-prop-attr.js.map +1 -1
  47. package/jsx-runtime.js +1 -1
  48. package/jsx-runtime.js.map +1 -1
  49. package/package.json +1 -1
  50. package/src/apprun-code.tsx +15 -3
  51. package/src/apprun-play.tsx +8 -2
  52. package/src/apprun.ts +16 -8
  53. package/src/router.ts +3 -2
  54. package/src/types.ts +3 -0
  55. package/src/vdom-my-prop-attr.ts +5 -11
  56. package/error.log +0 -0
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "apprun",
3
- "version": "3.38.0",
3
+ "version": "3.38.1",
4
4
  "description": "JavaScript library that has Elm inspired architecture, event pub-sub and components",
5
5
  "main": "dist/apprun.js",
6
6
  "module": "esm/apprun.js",
package/src/apprun-code.tsx CHANGED
@@ -1,3 +1,15 @@
1
+ /**
2
+ * AppRun playground custom element.
3
+ *
4
+ * Generates an isolated preview document, compiles JSX/TypeScript in the
5
+ * browser, and renders the result with AppRun. The TypeScript CDN dependency
6
+ * uses an explicit version and browser bundle path so the `ts` global is
7
+ * available before preview compilation begins.
8
+ *
9
+ * Recent Changes:
10
+ * - Executes compiled script-style examples synchronously before the preview
11
+ * document finishes DOMContentLoaded, preserving startup configuration.
12
+ */
1
13
  import { app, Component } from './apprun';
2
14
 
3
15
  declare var CodeMirror;
@@ -45,7 +57,7 @@ const code_html = code => `<!DOCTYPE html>
45
57
  margin: 2em;
46
58
  }
47
59
  </style>
48
- <script src="https://cdn.jsdelivr.net/npm/typescript@latest"></script>
60
+ <script src="https://cdn.jsdelivr.net/npm/typescript@5.8.3/lib/typescript.js"></script>
49
61
  <script src="dist/apprun-html.js"></script>
50
62
  </head>
51
63
  <body>
@@ -58,7 +70,7 @@ const compiled = ts.transpileModule(code, {
58
70
  "jsxFactory": "app.h",
59
71
  "jsxFragmentFactory": "app.Fragment",
60
72
  "target": "es2020",
61
- "module": "esnext",
73
+ "module": "none",
62
74
  },
63
75
  reportDiagnostics: true,
64
76
  });
@@ -82,7 +94,7 @@ if (compiled.diagnostics && compiled.diagnostics.length) {
82
94
  document.body.appendChild(pre);
83
95
  };
84
96
  const script = document.createElement('script');
85
- script.type = 'module';
97
+ script.type = 'text/javascript';
86
98
  script.text = compiled.outputText;
87
99
  document.body.appendChild(script);
88
100
  }
package/src/apprun-play.tsx CHANGED
@@ -1,3 +1,9 @@
1
+ /**
2
+ * AppRun documentation playground custom element.
3
+ *
4
+ * Compiles browser-global TypeScript/JSX examples into synchronous scripts so
5
+ * startup configuration runs before the preview document's DOMContentLoaded.
6
+ */
1
7
  import { app, Component } from './apprun';
2
8
 
3
9
  const popup_div = `<div id="play-popup" class="overlay">
@@ -126,7 +132,7 @@ const compiled = ts.transpileModule(code, {
126
132
  "jsxFactory": "app.h",
127
133
  "jsxFragmentFactory": "app.Fragment",
128
134
  "target": "es2020",
129
- "module": "esnext",
135
+ "module": "none",
130
136
  },
131
137
  reportDiagnostics: true,
132
138
  });
@@ -150,7 +156,7 @@ if (compiled.diagnostics && compiled.diagnostics.length) {
150
156
  document.body.appendChild(pre);
151
157
  };
152
158
  const script = document.createElement('script');
153
- script.type = 'module';
159
+ script.type = 'text/javascript';
154
160
  script.text = compiled.outputText;
155
161
  document.body.appendChild(script);
156
162
  }
package/src/apprun.ts CHANGED
@@ -24,6 +24,7 @@
24
24
  * - Virtual DOM rendering with multiple renderer support
25
25
  * - Component lifecycle management
26
26
  * - Client-side routing with hash/path support
27
+ * - Explicit pretty-link path routing through app.use_prettyLink()
27
28
  * - Web Components integration
28
29
  * - React compatibility layer
29
30
  * - TypeScript support with strong typing
@@ -37,6 +38,7 @@
37
38
  * - Safer element access with proper type assertions
38
39
  *
39
40
  * Recent Changes:
41
+ * - Restored hash routing and normal browser navigation as the default; pretty-link interception is opt-in
40
42
  * - Modified addComponents to accept (element, components) where components is a key-value object with routes as keys and components as values
41
43
  * - Simplified component mounting API for better usability
42
44
  *
@@ -54,6 +56,8 @@
54
56
  * }
55
57
  *
56
58
  * // Mount multiple components
59
+ * // Required only when browser /path links should use SPA navigation.
60
+ * app.use_prettyLink();
57
61
  * app.addComponents(document.body, {
58
62
  * '/home': MyComponent,
59
63
  * '/about': AnotherComponent
@@ -124,24 +128,25 @@ if (!app.start) {
124
128
 
125
129
  const NOOP = _ => {/* Intentionally empty */ }
126
130
  app.on('/', NOOP);
131
+ app.on('#', NOOP);
127
132
  app.on('debug', _ => NOOP);
128
133
  app.on(ROUTER_EVENT, NOOP);
129
134
  app.on(ROUTER_404_EVENT, NOOP);
130
135
  app.route = route;
131
136
  app.on('route', url => app['route'] && app['route'](url));
132
137
 
138
+ let prettyLinks = false;
139
+ /** Select SPA path-link routing before DOMContentLoaded; hash routing is the default. */
140
+ app.use_prettyLink = (enabled = true) => {
141
+ prettyLinks = enabled;
142
+ };
143
+
133
144
  if (typeof document === 'object') {
134
145
  document.addEventListener("DOMContentLoaded", () => {
135
146
  const no_init_route = document.body.hasAttribute('apprun-no-init') || app['no-init-route'] || false;
136
- const use_hash = app.find('#') || app.find('#/') || false;
137
147
 
138
- // console.log(`AppRun ${app.version} started with ${use_hash ? 'hash' : 'path'} routing. Initial load: ${init_load ? 'disabled' : 'enabled'}.`);
139
- window.addEventListener('hashchange', () => route(location.hash));
140
- window.addEventListener('popstate', () => route(location.pathname));
141
-
142
- if (use_hash) {
143
- !no_init_route && route(location.hash);
144
- } else {
148
+ if (prettyLinks) {
149
+ window.addEventListener('popstate', () => route(location.pathname));
145
150
  !no_init_route && (() => {
146
151
  const basePath = app.basePath || '';
147
152
  let initialPath = location.pathname;
@@ -172,6 +177,9 @@ if (!app.start) {
172
177
  route(menu.pathname); // Route with relative path (without base path)
173
178
  }
174
179
  });
180
+ } else {
181
+ window.addEventListener('hashchange', () => route(location.hash));
182
+ !no_init_route && route(location.hash);
175
183
  }
176
184
  });
177
185
  }
package/src/router.ts CHANGED
@@ -9,7 +9,7 @@
9
9
  * 2. Path-based routing (/path)
10
10
  * - Works with browser history API
11
11
  * - Requires server configuration for SPA routing
12
- * - Handles popstate events automatically
12
+ * - Handles browser links and popstate after app.use_prettyLink() opts in before initialization
13
13
  * 3. Event-based navigation
14
14
  * - Routes trigger corresponding component events
15
15
  * - Automatic route parameter extraction
@@ -38,7 +38,7 @@
38
38
  *
39
39
  * // Navigate programmatically
40
40
  * app.run('route', '#/home');
41
- * route('/users/123'); // Direct routing
41
+ * route('/users/123'); // Direct routing does not require pretty-link mode
42
42
  *
43
43
  * // Hierarchical matching examples
44
44
  * app.on('/api', (operation, id) => // Handle /api/users/123);
@@ -50,6 +50,7 @@
50
50
  * // If handler found at /api, it receives: ('v1', 'users', '123')
51
51
  *
52
52
  * // Base Path Support (NEW):
53
+ * app.use_prettyLink(); // Enable automatic browser path navigation before initialization
53
54
  * app.basePath = '/myapp'; // For sub-directory deployments
54
55
  * // Links: <a href="/users/123"> (relative paths)
55
56
  * // Navigation: /myapp/users/123 (full path)
package/src/types.ts CHANGED
@@ -19,6 +19,7 @@
19
19
  * - ActionOptions: Action behavior options (render, history, global, callback)
20
20
  * - MountOptions: Component mounting options (global events, routing, transitions)
21
21
  * - AppStartOptions: Application startup configuration with lifecycle hooks
22
+ * - IApp.use_prettyLink: Explicit startup selection for path-link routing
22
23
  *
23
24
  * Features:
24
25
  * - Strong typing for component lifecycle
@@ -123,6 +124,8 @@ export interface IApp {
123
124
  safeHTML(html: string): any[];
124
125
  use_render(render: any, mode?: 0 | 1): void;
125
126
  use_react(React: any, ReactDOM: any): void;
127
+ /** Select SPA path-link routing before DOMContentLoaded; hash routing is the default. */
128
+ use_prettyLink(enabled?: boolean): void;
126
129
  version: string;
127
130
  basePath?: string;
128
131
  addComponents: (element: Element | string, components: ComponentRoute) => void;
package/src/vdom-my-prop-attr.ts CHANGED
@@ -3,7 +3,7 @@
3
3
  * Standards-compliant property/attribute handling with caching and special element support
4
4
  * Features: Skip logic for preserving user interactions during VDOM reconciliation
5
5
  * Exports: updateProps - Main function for DOM element property updates
6
- * Updated: 2025-01-14 - Skip logic for focus-sensitive (selection), scroll, and media properties
6
+ * Updated: 2026-07-13 - Restore stale class cleanup when first-render VDOM props are null
7
7
  */
8
8
 
9
9
  import { find, html, svg } from 'property-information';
@@ -13,17 +13,11 @@ const propertyInfoCache = new Map<string, any>();
13
13
 
14
14
  // Merge old and new props, handling className -> class conversion and null cleanup
15
15
  function mergeProps(oldProps: { [key: string]: any }, newProps: { [key: string]: any }): { [key: string]: any } {
16
- if (newProps) {
17
- newProps['class'] = newProps['class'] || newProps['className'];
18
- delete newProps['className'];
19
- }
16
+ newProps = newProps || {};
17
+ newProps['class'] = newProps['class'] || newProps['className'];
18
+ delete newProps['className'];
20
19
 
21
- if (!oldProps || Object.keys(oldProps).length === 0) return newProps || {};
22
- if (!newProps || Object.keys(newProps).length === 0) {
23
- const props: { [key: string]: any } = {};
24
- Object.keys(oldProps).forEach(p => props[p] = null);
25
- return props;
26
- }
20
+ if (!oldProps || Object.keys(oldProps).length === 0) return newProps;
27
21
 
28
22
  const props: { [key: string]: any } = {};
29
23
  Object.keys(oldProps).forEach(p => {
package/error.log DELETED
File without changes