plusui-native 0.2.61 → 0.2.62

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 (5) hide show
  1. package/package.json +4 -4
  2. package/templates/react/frontend/src/App.tsx +27 -27
  3. package/templates/react/frontend/src/plusui.ts +16 -16
  4. package/templates/solid/frontend/src/App.tsx +26 -26
  5. package/templates/solid/frontend/src/plusui.ts +16 -16
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "plusui-native",
3
- "version": "0.2.61",
3
+ "version": "0.2.62",
4
4
  "description": "PlusUI CLI - Build C++ desktop apps modern UI ",
5
5
  "main": "src/index.js",
6
6
  "type": "module",
@@ -27,11 +27,11 @@
27
27
  "semver": "^7.6.0",
28
28
  "which": "^4.0.0",
29
29
  "execa": "^8.0.1",
30
- "plusui-native-builder": "^0.1.60",
31
- "plusui-native-connect": "^0.1.60"
30
+ "plusui-native-builder": "^0.1.61",
31
+ "plusui-native-connect": "^0.1.61"
32
32
  },
33
33
  "peerDependencies": {
34
- "plusui-native-connect": "^0.1.60"
34
+ "plusui-native-connect": "^0.1.61"
35
35
  },
36
36
  "publishConfig": {
37
37
  "access": "public"
package/templates/react/frontend/src/App.tsx CHANGED
@@ -1,5 +1,5 @@
1
1
  import { useState, useEffect } from 'react';
2
- import { win, browser, router, app, fileDrop, formatFileSize, type FileInfo } from 'plusui';
2
+ import plusui, { type FileInfo } from 'plusui';
3
3
  // Custom channels (generated by `plusui connect`) — import what you use:
4
4
  // import { greeting, download } from '../Connections/connections.gen';
5
5
 
@@ -24,39 +24,39 @@ function App() {
24
24
  const [dropAccent] = useState('#60a5fa');
25
25
 
26
26
  useEffect(() => {
27
- win.show().catch(() => {
27
+ plusui.win.show().catch(() => {
28
28
  // no-op for browser preview mode
29
29
  });
30
30
 
31
31
  // Setup routes
32
- router.setRoutes(routes);
32
+ plusui.router.setRoutes(routes);
33
33
 
34
34
  // Listen for navigation changes
35
- const unsub = browser.onNavigate((url) => {
35
+ const unsub = plusui.browser.onNavigate((url) => {
36
36
  setCurrentUrl(url);
37
- browser.canGoBack().then(setCanGoBack);
38
- browser.canGoForward().then(setCanGoForward);
37
+ plusui.browser.canGoBack().then(setCanGoBack);
38
+ plusui.browser.canGoForward().then(setCanGoForward);
39
39
  });
40
40
 
41
41
  // Setup FileDrop listeners
42
- const unsubDrop = fileDrop.onFilesDropped((droppedFiles) => {
42
+ const unsubDrop = plusui.fileDrop.onFilesDropped((droppedFiles) => {
43
43
  console.log('Files dropped:', droppedFiles);
44
44
  setFiles(prev => [...prev, ...droppedFiles]);
45
45
  setIsDragging(false);
46
46
  });
47
47
 
48
- const unsubEnter = fileDrop.onDragEnter(() => {
48
+ const unsubEnter = plusui.fileDrop.onDragEnter(() => {
49
49
  setIsDragging(true);
50
50
  });
51
51
 
52
- const unsubLeave = fileDrop.onDragLeave(() => {
52
+ const unsubLeave = plusui.fileDrop.onDragLeave(() => {
53
53
  setIsDragging(false);
54
54
  });
55
55
 
56
56
  // Get initial state
57
- browser.getUrl().then(setCurrentUrl);
58
- browser.canGoBack().then(setCanGoBack);
59
- browser.canGoForward().then(setCanGoForward);
57
+ plusui.browser.getUrl().then(setCurrentUrl);
58
+ plusui.browser.canGoBack().then(setCanGoBack);
59
+ plusui.browser.canGoForward().then(setCanGoForward);
60
60
 
61
61
  return () => {
62
62
  unsub();
@@ -66,29 +66,29 @@ function App() {
66
66
  };
67
67
  }, []);
68
68
 
69
- const handleMinimize = async () => await win.minimize();
70
- const handleMaximize = async () => await win.maximize();
71
- const handleClose = async () => await win.close();
69
+ const handleMinimize = async () => await plusui.win.minimize();
70
+ const handleMaximize = async () => await plusui.win.maximize();
71
+ const handleClose = async () => await plusui.win.close();
72
72
  const handleGetSize = async () => {
73
- const size = await win.getSize();
73
+ const size = await plusui.win.getSize();
74
74
  setWindowSize(size);
75
75
  };
76
76
  const handleGetPosition = async () => {
77
- const pos = await win.getPosition();
77
+ const pos = await plusui.win.getPosition();
78
78
  setWindowPos(pos);
79
79
  };
80
80
 
81
81
  // Browser navigation
82
- const handleGoBack = async () => await browser.goBack();
83
- const handleGoForward = async () => await browser.goForward();
84
- const handleReload = async () => await browser.reload();
82
+ const handleGoBack = async () => await plusui.browser.goBack();
83
+ const handleGoForward = async () => await plusui.browser.goForward();
84
+ const handleReload = async () => await plusui.browser.reload();
85
85
 
86
86
  // Router navigation
87
- const handleGoHome = async () => await router.push('/');
88
- const handleGoSettings = async () => await router.push('/settings');
87
+ const handleGoHome = async () => await plusui.router.push('/');
88
+ const handleGoSettings = async () => await plusui.router.push('/settings');
89
89
 
90
90
  // App control
91
- const handleQuit = async () => await app.quit();
91
+ const handleQuit = async () => await plusui.app.quit();
92
92
 
93
93
  return (
94
94
  <div className="app">
@@ -119,8 +119,8 @@ function App() {
119
119
  <h2>Window Position</h2>
120
120
  <div className="button-group">
121
121
  <button onClick={handleGetPosition} className="button">Get Position</button>
122
- <button onClick={() => win.setPosition(100, 100)} className="button">Move Left</button>
123
- <button onClick={() => win.setPosition(800, 100)} className="button">Move Right</button>
122
+ <button onClick={() => plusui.win.setPosition(100, 100)} className="button">Move Left</button>
123
+ <button onClick={() => plusui.win.setPosition(800, 100)} className="button">Move Right</button>
124
124
  </div>
125
125
  {windowPos.x !== 0 && (
126
126
  <p className="info-text">Position: {windowPos.x}, {windowPos.y}</p>
@@ -144,7 +144,7 @@ function App() {
144
144
  <button onClick={handleGoSettings} className="button">Settings</button>
145
145
  </div>
146
146
  <p style={{ fontSize: '0.85em', color: '#666', marginTop: '10px' }}>
147
- Define routes with <code>router.setRoutes({'{ ... }'})</code> then navigate with <code>router.push('/path')</code>
147
+ Define routes with <code>plusui.router.setRoutes({'{ ... }'})</code> then navigate with <code>plusui.router.push('/path')</code>
148
148
  </p>
149
149
  </div>
150
150
 
@@ -202,7 +202,7 @@ function App() {
202
202
  <div className="filedrop-file-info">
203
203
  <div className="filedrop-file-name">{file.name}</div>
204
204
  <div className="filedrop-file-meta">
205
- {formatFileSize(file.size)} • {file.type}
205
+ {plusui.formatFileSize(file.size)} • {file.type}
206
206
  </div>
207
207
  </div>
208
208
  <button
package/templates/react/frontend/src/plusui.ts CHANGED
@@ -2,13 +2,17 @@
2
2
  // PlusUI — single import entrypoint
3
3
  //
4
4
  // import plusui from 'plusui';
5
- // import { connect, win, clipboard, app } from 'plusui';
6
5
  //
7
- // Everything your app needs — built-in features AND your own
8
- // custom connect channels — is available from this one import.
6
+ // plusui.win.minimize();
7
+ // plusui.fileDrop.onFilesDropped(...);
8
+ // plusui.formatFileSize(bytes);
9
9
  //
10
- // After running `plusui connect`, Connections/connections.gen.ts
11
- // is auto-imported here so all discovered channels become typed.
10
+ // For TypeScript types only:
11
+ // import type { FileInfo } from 'plusui';
12
+ //
13
+ // After running `plusui connect`, custom channel objects are
14
+ // exported from Connections/connections.gen.ts:
15
+ // import { myChannel } from '../Connections/connections.gen';
12
16
  // ============================================================
13
17
 
14
18
  // ─── Bridge bootstrap ────────────────────────────────────────────────────────
@@ -366,19 +370,13 @@ export function isImageFile(file: FileInfo): boolean { return file.type.startsWi
366
370
 
367
371
  // ─── Top-level on / emit ─────────────────────────────────────────────────────
368
372
  //
369
- // Custom app events — import directly, no wrapper prefix:
370
- //
371
- // import { on, emit } from 'plusui';
372
- //
373
- // emit('myEvent', { value: 42 }); // TS → C++
374
- // on('myEvent', (data) => { ... }); // C++ → TS
375
- //
376
- // Framework features use their own namespace:
373
+ // import plusui from 'plusui';
377
374
  //
378
- // import { win, clipboard } from 'plusui';
375
+ // plusui.emit('myEvent', { value: 42 }); // TS → C++
376
+ // plusui.on('myEvent', (data) => { ... }); // C++ → TS
379
377
  //
380
- // win.minimize();
381
- // clipboard.on('changed', (data) => { ... });
378
+ // plusui.win.minimize();
379
+ // plusui.clipboard.on('changed', (data) => { ... });
382
380
  //
383
381
  export const on = connect.on.bind(connect) as typeof connect.on;
384
382
  export const emit = connect.emit.bind(connect) as typeof connect.emit;
@@ -394,6 +392,8 @@ const plusui = {
394
392
  app,
395
393
  clipboard,
396
394
  fileDrop,
395
+ formatFileSize,
396
+ isImageFile,
397
397
  on,
398
398
  emit,
399
399
  };
package/templates/solid/frontend/src/App.tsx CHANGED
@@ -1,5 +1,5 @@
1
1
  import { createSignal, onMount, onCleanup, Show, For } from 'solid-js';
2
- import { win, browser, router, app, fileDrop, formatFileSize, type FileInfo } from 'plusui';
2
+ import plusui, { type FileInfo } from 'plusui';
3
3
  // Custom channels (generated by `plusui connect`) — import what you use:
4
4
  // import { greeting, download } from '../Connections/connections.gen';
5
5
 
@@ -25,32 +25,32 @@ function App() {
25
25
 
26
26
  onMount(() => {
27
27
  // Setup routes
28
- router.setRoutes(routes);
28
+ plusui.router.setRoutes(routes);
29
29
 
30
30
  // Listen for navigation changes
31
- browser.onNavigate((url) => {
31
+ plusui.browser.onNavigate((url) => {
32
32
  setCurrentUrl(url);
33
- browser.canGoBack().then(setCanGoBack);
34
- browser.canGoForward().then(setCanGoForward);
33
+ plusui.browser.canGoBack().then(setCanGoBack);
34
+ plusui.browser.canGoForward().then(setCanGoForward);
35
35
  });
36
36
 
37
37
  // Get initial state
38
- browser.getUrl().then(setCurrentUrl);
39
- browser.canGoBack().then(setCanGoBack);
40
- browser.canGoForward().then(setCanGoForward);
38
+ plusui.browser.getUrl().then(setCurrentUrl);
39
+ plusui.browser.canGoBack().then(setCanGoBack);
40
+ plusui.browser.canGoForward().then(setCanGoForward);
41
41
 
42
42
  // Setup FileDrop listeners
43
- const unsubDrop = fileDrop.onFilesDropped((droppedFiles) => {
43
+ const unsubDrop = plusui.fileDrop.onFilesDropped((droppedFiles) => {
44
44
  console.log('Files dropped:', droppedFiles);
45
45
  setFiles(prev => [...prev, ...droppedFiles]);
46
46
  setIsDragging(false);
47
47
  });
48
48
 
49
- const unsubEnter = fileDrop.onDragEnter(() => {
49
+ const unsubEnter = plusui.fileDrop.onDragEnter(() => {
50
50
  setIsDragging(true);
51
51
  });
52
52
 
53
- const unsubLeave = fileDrop.onDragLeave(() => {
53
+ const unsubLeave = plusui.fileDrop.onDragLeave(() => {
54
54
  setIsDragging(false);
55
55
  });
56
56
 
@@ -61,29 +61,29 @@ function App() {
61
61
  });
62
62
  });
63
63
 
64
- const handleMinimize = async () => await win.minimize();
65
- const handleMaximize = async () => await win.maximize();
66
- const handleClose = async () => await win.close();
64
+ const handleMinimize = async () => await plusui.win.minimize();
65
+ const handleMaximize = async () => await plusui.win.maximize();
66
+ const handleClose = async () => await plusui.win.close();
67
67
  const handleGetSize = async () => {
68
- const size = await win.getSize();
68
+ const size = await plusui.win.getSize();
69
69
  setWindowSize(size);
70
70
  };
71
71
  const handleGetPosition = async () => {
72
- const pos = await win.getPosition();
72
+ const pos = await plusui.win.getPosition();
73
73
  setWindowPos(pos);
74
74
  };
75
75
 
76
76
  // Browser navigation
77
- const handleGoBack = async () => await browser.goBack();
78
- const handleGoForward = async () => await browser.goForward();
79
- const handleReload = async () => await browser.reload();
77
+ const handleGoBack = async () => await plusui.browser.goBack();
78
+ const handleGoForward = async () => await plusui.browser.goForward();
79
+ const handleReload = async () => await plusui.browser.reload();
80
80
 
81
81
  // Router navigation
82
- const handleGoHome = async () => await router.push('/');
83
- const handleGoSettings = async () => await router.push('/settings');
82
+ const handleGoHome = async () => await plusui.router.push('/');
83
+ const handleGoSettings = async () => await plusui.router.push('/settings');
84
84
 
85
85
  // App control
86
- const handleQuit = async () => await app.quit();
86
+ const handleQuit = async () => await plusui.app.quit();
87
87
 
88
88
  return (
89
89
  <div class="app">
@@ -114,8 +114,8 @@ function App() {
114
114
  <h2>Window Position</h2>
115
115
  <div class="button-group">
116
116
  <button onClick={handleGetPosition} class="button">Get Position</button>
117
- <button onClick={() => win.setPosition(100, 100)} class="button">Move Left</button>
118
- <button onClick={() => win.setPosition(800, 100)} class="button">Move Right</button>
117
+ <button onClick={() => plusui.win.setPosition(100, 100)} class="button">Move Left</button>
118
+ <button onClick={() => plusui.win.setPosition(800, 100)} class="button">Move Right</button>
119
119
  </div>
120
120
  <Show when={windowPos().x !== 0}>
121
121
  <p class="info-text">Position: {windowPos().x}, {windowPos().y}</p>
@@ -139,7 +139,7 @@ function App() {
139
139
  <button onClick={handleGoSettings} class="button">Settings</button>
140
140
  </div>
141
141
  <p style={{ 'font-size': '0.85em', color: '#666', 'margin-top': '10px' }}>
142
- Define routes with <code>router.setRoutes({'{ ... }'})</code> then navigate with <code>router.push('/path')</code>
142
+ Define routes with <code>plusui.router.setRoutes({'{ ... }'})</code> then navigate with <code>plusui.router.push('/path')</code>
143
143
  </p>
144
144
  </div>
145
145
 
@@ -198,7 +198,7 @@ function App() {
198
198
  <div class="filedrop-file-info">
199
199
  <div class="filedrop-file-name">{file.name}</div>
200
200
  <div class="filedrop-file-meta">
201
- {formatFileSize(file.size)} • {file.type}
201
+ {plusui.formatFileSize(file.size)} • {file.type}
202
202
  </div>
203
203
  </div>
204
204
  <button
package/templates/solid/frontend/src/plusui.ts CHANGED
@@ -2,13 +2,17 @@
2
2
  // PlusUI — single import entrypoint
3
3
  //
4
4
  // import plusui from 'plusui';
5
- // import { connect, win, clipboard, app } from 'plusui';
6
5
  //
7
- // Everything your app needs — built-in features AND your own
8
- // custom connect channels — is available from this one import.
6
+ // plusui.win.minimize();
7
+ // plusui.fileDrop.onFilesDropped(...);
8
+ // plusui.formatFileSize(bytes);
9
9
  //
10
- // After running `plusui connect`, Connections/connections.gen.ts
11
- // is auto-imported here so all discovered channels become typed.
10
+ // For TypeScript types only:
11
+ // import type { FileInfo } from 'plusui';
12
+ //
13
+ // After running `plusui connect`, custom channel objects are
14
+ // exported from Connections/connections.gen.ts:
15
+ // import { myChannel } from '../Connections/connections.gen';
12
16
  // ============================================================
13
17
 
14
18
  // ─── Bridge bootstrap ────────────────────────────────────────────────────────
@@ -366,19 +370,13 @@ export function isImageFile(file: FileInfo): boolean { return file.type.startsWi
366
370
 
367
371
  // ─── Top-level on / emit ─────────────────────────────────────────────────────
368
372
  //
369
- // Custom app events — import directly, no wrapper prefix:
370
- //
371
- // import { on, emit } from 'plusui';
372
- //
373
- // emit('myEvent', { value: 42 }); // TS → C++
374
- // on('myEvent', (data) => { ... }); // C++ → TS
375
- //
376
- // Framework features use their own namespace:
373
+ // import plusui from 'plusui';
377
374
  //
378
- // import { win, clipboard } from 'plusui';
375
+ // plusui.emit('myEvent', { value: 42 }); // TS → C++
376
+ // plusui.on('myEvent', (data) => { ... }); // C++ → TS
379
377
  //
380
- // win.minimize();
381
- // clipboard.on('changed', (data) => { ... });
378
+ // plusui.win.minimize();
379
+ // plusui.clipboard.on('changed', (data) => { ... });
382
380
  //
383
381
  export const on = connect.on.bind(connect) as typeof connect.on;
384
382
  export const emit = connect.emit.bind(connect) as typeof connect.emit;
@@ -394,6 +392,8 @@ const plusui = {
394
392
  app,
395
393
  clipboard,
396
394
  fileDrop,
395
+ formatFileSize,
396
+ isImageFile,
397
397
  on,
398
398
  emit,
399
399
  };