@thewhateverapp/tile-sdk 0.2.7 → 0.3.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.
- package/dist/bridge/TileBridge.d.ts +2 -0
- package/dist/bridge/TileBridge.d.ts.map +1 -1
- package/dist/bridge/TileBridge.js +38 -0
- package/dist/index.d.ts +1 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +1 -0
- package/dist/react/TileProvider.d.ts.map +1 -1
- package/dist/react/TileProvider.js +4 -5
- package/dist/react/useTileNavigation.d.ts +31 -0
- package/dist/react/useTileNavigation.d.ts.map +1 -0
- package/dist/react/useTileNavigation.js +49 -0
- package/package.json +1 -1
|
@@ -32,6 +32,7 @@ export declare class TileBridge {
|
|
|
32
32
|
private handleConfig;
|
|
33
33
|
private handleResponse;
|
|
34
34
|
private handleEvent;
|
|
35
|
+
private handleNavigate;
|
|
35
36
|
private sendToParent;
|
|
36
37
|
/**
|
|
37
38
|
* Request to navigate to full page view
|
|
@@ -105,6 +106,7 @@ export declare class TileBridge {
|
|
|
105
106
|
private generateId;
|
|
106
107
|
private isDevelopment;
|
|
107
108
|
private isPreview;
|
|
109
|
+
private isInIframe;
|
|
108
110
|
}
|
|
109
111
|
export declare function getTileBridge(): TileBridge;
|
|
110
112
|
//# sourceMappingURL=TileBridge.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TileBridge.d.ts","sourceRoot":"","sources":["../../src/bridge/TileBridge.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,MAAM,WAAW,WAAW;IAC1B,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,GAAG,CAAC;IACd,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,UAAU;IACzB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAA;KAAE,CAAC;IACvC,OAAO,EAAE,MAAM,CAAC;IAChB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IACzB,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB;AAED,qBAAa,UAAU;IACrB,OAAO,CAAC,MAAM,CAA2B;IACzC,OAAO,CAAC,YAAY,CAAqB;IACzC,OAAO,CAAC,gBAAgB,CAAmD;IAC3E,OAAO,CAAC,aAAa,CAAoD;IACzE,OAAO,CAAC,KAAK,CAAS;IACtB,OAAO,CAAC,YAAY,CAAS;gBAEjB,cAAc,GAAE,MAAkC;IA4B9D,OAAO,CAAC,UAAU;IAuBlB,OAAO,CAAC,aAAa;
|
|
1
|
+
{"version":3,"file":"TileBridge.d.ts","sourceRoot":"","sources":["../../src/bridge/TileBridge.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,MAAM,WAAW,WAAW;IAC1B,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,GAAG,CAAC;IACd,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,UAAU;IACzB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAA;KAAE,CAAC;IACvC,OAAO,EAAE,MAAM,CAAC;IAChB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IACzB,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB;AAED,qBAAa,UAAU;IACrB,OAAO,CAAC,MAAM,CAA2B;IACzC,OAAO,CAAC,YAAY,CAAqB;IACzC,OAAO,CAAC,gBAAgB,CAAmD;IAC3E,OAAO,CAAC,aAAa,CAAoD;IACzE,OAAO,CAAC,KAAK,CAAS;IACtB,OAAO,CAAC,YAAY,CAAS;gBAEjB,cAAc,GAAE,MAAkC;IA4B9D,OAAO,CAAC,UAAU;IAuBlB,OAAO,CAAC,aAAa;IAyCrB,OAAO,CAAC,YAAY;IAgBpB,OAAO,CAAC,cAAc;IAUtB,OAAO,CAAC,WAAW;IAInB,OAAO,CAAC,cAAc;IAuBtB,OAAO,CAAC,YAAY;IAmCpB;;OAEG;IACI,cAAc,IAAI,IAAI;IAoB7B;;OAEG;IACI,cAAc,IAAI,IAAI;IAiB7B;;OAEG;IACI,OAAO,CAAC,GAAG,EAAE,MAAM,EAAE,MAAM,GAAE,QAAQ,GAAG,OAAkB,GAAG,IAAI;IAOxE;;OAEG;IACI,UAAU,CAAC,SAAS,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,GAAG,GAAG,IAAI;IAOtD;;;OAGG;IACI,qBAAqB,CAAC,OAAO,EAAE,OAAO,GAAG,IAAI;IAOpD;;OAEG;IACU,gBAAgB,CAAC,IAAI,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC;IA4B1D;;OAEG;IACU,UAAU,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,GAAG,OAAO,CAAC,IAAI,CAAC;IA2B/D;;OAEG;IACU,UAAU,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC,GAAG,CAAC;IAoBlD;;OAEG;IACI,aAAa,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAG,IAAI;IAWzD;;OAEG;IACU,OAAO,CAAC,OAAO,CAAC,EAAE;QAC7B,MAAM,CAAC,EAAE,MAAM,EAAE,CAAC;QAClB,MAAM,CAAC,EAAE,MAAM,CAAC;KACjB,GAAG,OAAO,CAAC,GAAG,CAAC;IAiChB;;OAEG;IACU,aAAa,CAAC,MAAM,EAAE,MAAM,EAAE,GAAG,OAAO,CAAC,OAAO,CAAC;IA8B9D;;OAEG;IACU,cAAc,IAAI,OAAO,CAAC,GAAG,CAAC;IAuB3C;;OAEG;IACI,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,CAAC,IAAI,EAAE,GAAG,KAAK,IAAI,GAAG,MAAM,IAAI;IAgBlE;;OAEG;IACI,SAAS,IAAI,UAAU,GAAG,IAAI;IAIrC;;OAEG;IACI,OAAO,IAAI,OAAO;IAIzB;;OAEG;IACU,YAAY,IAAI,OAAO,CAAC,UAAU,CAAC;IAehD,OAAO,CAAC,SAAS;IAOjB,OAAO,CAAC,UAAU;IAIlB,OAAO,CAAC,aAAa;IAMrB,OAAO,CAAC,SAAS;IAKjB,OAAO,CAAC,UAAU;CAGnB;AAKD,wBAAgB,aAAa,IAAI,UAAU,CAK1C"}
|
|
@@ -76,6 +76,9 @@ export class TileBridge {
|
|
|
76
76
|
case 'parent:event':
|
|
77
77
|
this.handleEvent(message);
|
|
78
78
|
break;
|
|
79
|
+
case 'parent:navigate':
|
|
80
|
+
this.handleNavigate(message.payload);
|
|
81
|
+
break;
|
|
79
82
|
default:
|
|
80
83
|
// Handle custom messages
|
|
81
84
|
this.emitEvent(message.type, message.payload);
|
|
@@ -106,6 +109,26 @@ export class TileBridge {
|
|
|
106
109
|
handleEvent(message) {
|
|
107
110
|
this.emitEvent(message.payload?.type, message.payload?.data);
|
|
108
111
|
}
|
|
112
|
+
handleNavigate(payload) {
|
|
113
|
+
// Parent is telling us to navigate internally using Next.js router
|
|
114
|
+
if (typeof window === 'undefined')
|
|
115
|
+
return;
|
|
116
|
+
const route = payload?.route;
|
|
117
|
+
if (!route)
|
|
118
|
+
return;
|
|
119
|
+
if (this.isDevelopment() || this.isPreview()) {
|
|
120
|
+
console.log('[TileBridge] Received navigate command:', route);
|
|
121
|
+
}
|
|
122
|
+
// Emit navigate event so the app can handle it with Next.js router
|
|
123
|
+
this.emitEvent('navigate', { route });
|
|
124
|
+
// Also try using window.location if Next.js router isn't available
|
|
125
|
+
// This is a fallback, the app should preferably use the 'navigate' event
|
|
126
|
+
if (window.location.pathname !== route) {
|
|
127
|
+
window.history.pushState({}, '', route);
|
|
128
|
+
// Trigger a popstate event to notify the app
|
|
129
|
+
window.dispatchEvent(new PopStateEvent('popstate', { state: {} }));
|
|
130
|
+
}
|
|
131
|
+
}
|
|
109
132
|
sendToParent(message) {
|
|
110
133
|
if (typeof window === 'undefined' || !window.parent)
|
|
111
134
|
return;
|
|
@@ -145,8 +168,12 @@ export class TileBridge {
|
|
|
145
168
|
ready: this.ready,
|
|
146
169
|
parentOrigin: this.parentOrigin,
|
|
147
170
|
currentOrigin: window.location.origin,
|
|
171
|
+
isInIframe: this.isInIframe(),
|
|
148
172
|
});
|
|
149
173
|
}
|
|
174
|
+
// Emit local navigation event for app to handle with Next.js router
|
|
175
|
+
this.emitEvent('navigate', { route: '/page', target: 'page' });
|
|
176
|
+
// Always send to parent (tiles are always in iframes on the platform)
|
|
150
177
|
this.sendToParent({
|
|
151
178
|
type: 'tile:navigate',
|
|
152
179
|
payload: { target: 'page' },
|
|
@@ -156,6 +183,14 @@ export class TileBridge {
|
|
|
156
183
|
* Request to navigate back to tile view (from page)
|
|
157
184
|
*/
|
|
158
185
|
navigateToTile() {
|
|
186
|
+
if (this.isDevelopment() || this.isPreview()) {
|
|
187
|
+
console.log('[TileBridge] Requesting navigation to tile', {
|
|
188
|
+
isInIframe: this.isInIframe(),
|
|
189
|
+
});
|
|
190
|
+
}
|
|
191
|
+
// Emit local navigation event for app to handle with Next.js router
|
|
192
|
+
this.emitEvent('navigate', { route: '/tile', target: 'tile' });
|
|
193
|
+
// Always send to parent (tiles are always in iframes on the platform)
|
|
159
194
|
this.sendToParent({
|
|
160
195
|
type: 'tile:navigate',
|
|
161
196
|
payload: { target: 'tile' },
|
|
@@ -425,6 +460,9 @@ export class TileBridge {
|
|
|
425
460
|
return typeof window !== 'undefined' &&
|
|
426
461
|
window.location.hostname === 'api.thewhatever.app';
|
|
427
462
|
}
|
|
463
|
+
isInIframe() {
|
|
464
|
+
return typeof window !== 'undefined' && window.self !== window.top;
|
|
465
|
+
}
|
|
428
466
|
}
|
|
429
467
|
// Singleton instance
|
|
430
468
|
let bridgeInstance = null;
|
package/dist/index.d.ts
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
export { TileProvider } from './react/TileProvider';
|
|
2
2
|
export { useTile } from './react/useTile';
|
|
3
|
+
export { useTileNavigation } from './react/useTileNavigation';
|
|
3
4
|
export { TileContainer } from './react/TileContainer';
|
|
4
5
|
export { withTile } from './react/withTile';
|
|
5
6
|
export { getTileBridge, TileBridge } from './bridge/TileBridge';
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AACpD,OAAO,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAC;AAC1C,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AACtD,OAAO,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAG5C,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAChE,YAAY,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAGnE,cAAc,SAAS,CAAC;AAGxB,cAAc,SAAS,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AACpD,OAAO,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAC;AAC1C,OAAO,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAC9D,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AACtD,OAAO,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAG5C,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAChE,YAAY,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAGnE,cAAc,SAAS,CAAC;AAGxB,cAAc,SAAS,CAAC"}
|
package/dist/index.js
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
// React components and hooks
|
|
2
2
|
export { TileProvider } from './react/TileProvider';
|
|
3
3
|
export { useTile } from './react/useTile';
|
|
4
|
+
export { useTileNavigation } from './react/useTileNavigation';
|
|
4
5
|
export { TileContainer } from './react/TileContainer';
|
|
5
6
|
export { withTile } from './react/withTile';
|
|
6
7
|
// Bridge for secure communication
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TileProvider.d.ts","sourceRoot":"","sources":["../../src/react/TileProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA0D,MAAM,OAAO,CAAC;AAC/E,OAAO,EAAiB,UAAU,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAE7E,MAAM,WAAW,gBAAgB;IAC/B,MAAM,EAAE,UAAU,GAAG,IAAI,CAAC;IAC1B,MAAM,EAAE,UAAU,CAAC;IACnB,OAAO,EAAE,OAAO,CAAC;IACjB,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,OAAO,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,MAAM,CAAC,EAAE,QAAQ,GAAG,OAAO,KAAK,IAAI,CAAC;IAC5D,UAAU,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,GAAG,KAAK,IAAI,CAAC;IACpD,qBAAqB,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IAClD,OAAO,EAAE;QACP,GAAG,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,OAAO,CAAC,GAAG,CAAC,CAAC;QACnC,GAAG,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;KACjD,CAAC;IACF,SAAS,EAAE;QACT,KAAK,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;KACxC,CAAC;IACF,IAAI,EAAE;QACJ,OAAO,EAAE,CAAC,OAAO,CAAC,EAAE;YAAE,MAAM,CAAC,EAAE,MAAM,EAAE,CAAC;YAAC,MAAM,CAAC,EAAE,MAAM,CAAA;SAAE,KAAK,OAAO,CAAC,GAAG,CAAC,CAAC;QAC5E,aAAa,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,OAAO,CAAC,OAAO,CAAC,CAAC;QACtD,cAAc,EAAE,MAAM,OAAO,CAAC,GAAG,CAAC,CAAC;KACpC,CAAC;CACH;AAED,eAAO,MAAM,WAAW,wCAA+C,CAAC;AAExE,UAAU,iBAAiB;IACzB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,wBAAgB,YAAY,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,iBAAiB,
|
|
1
|
+
{"version":3,"file":"TileProvider.d.ts","sourceRoot":"","sources":["../../src/react/TileProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA0D,MAAM,OAAO,CAAC;AAC/E,OAAO,EAAiB,UAAU,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAE7E,MAAM,WAAW,gBAAgB;IAC/B,MAAM,EAAE,UAAU,GAAG,IAAI,CAAC;IAC1B,MAAM,EAAE,UAAU,CAAC;IACnB,OAAO,EAAE,OAAO,CAAC;IACjB,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,OAAO,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,MAAM,CAAC,EAAE,QAAQ,GAAG,OAAO,KAAK,IAAI,CAAC;IAC5D,UAAU,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,GAAG,KAAK,IAAI,CAAC;IACpD,qBAAqB,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IAClD,OAAO,EAAE;QACP,GAAG,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,OAAO,CAAC,GAAG,CAAC,CAAC;QACnC,GAAG,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;KACjD,CAAC;IACF,SAAS,EAAE;QACT,KAAK,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;KACxC,CAAC;IACF,IAAI,EAAE;QACJ,OAAO,EAAE,CAAC,OAAO,CAAC,EAAE;YAAE,MAAM,CAAC,EAAE,MAAM,EAAE,CAAC;YAAC,MAAM,CAAC,EAAE,MAAM,CAAA;SAAE,KAAK,OAAO,CAAC,GAAG,CAAC,CAAC;QAC5E,aAAa,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,OAAO,CAAC,OAAO,CAAC,CAAC;QACtD,cAAc,EAAE,MAAM,OAAO,CAAC,GAAG,CAAC,CAAC;KACpC,CAAC;CACH;AAED,eAAO,MAAM,WAAW,wCAA+C,CAAC;AAExE,UAAU,iBAAiB;IACzB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,wBAAgB,YAAY,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,iBAAiB,qBAmDrE"}
|
|
@@ -39,9 +39,8 @@ export function TileProvider({ children, fallback }) {
|
|
|
39
39
|
getCurrentUser: () => bridge.getCurrentUser(),
|
|
40
40
|
},
|
|
41
41
|
};
|
|
42
|
-
//
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
}
|
|
46
|
-
return (React.createElement(TileContext.Provider, { value: contextValue }, children));
|
|
42
|
+
// Always render children immediately - don't wait for config
|
|
43
|
+
// This eliminates the delay before animations start
|
|
44
|
+
// Components can check isReady if they need to wait
|
|
45
|
+
return (React.createElement(TileContext.Provider, { value: contextValue }, !isReady && fallback ? fallback : children));
|
|
47
46
|
}
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
type AppRouterInstance = {
|
|
2
|
+
push: (href: string) => void;
|
|
3
|
+
replace: (href: string) => void;
|
|
4
|
+
back: () => void;
|
|
5
|
+
};
|
|
6
|
+
interface UseTileNavigationProps {
|
|
7
|
+
router: AppRouterInstance;
|
|
8
|
+
pathname: string;
|
|
9
|
+
}
|
|
10
|
+
/**
|
|
11
|
+
* Hook to integrate TileBridge navigation with Next.js App Router
|
|
12
|
+
*
|
|
13
|
+
* This hook listens for navigation events from TileBridge and uses
|
|
14
|
+
* Next.js router to navigate between /tile and /page routes.
|
|
15
|
+
*
|
|
16
|
+
* Usage in app/layout.tsx with Next.js hooks:
|
|
17
|
+
* ```tsx
|
|
18
|
+
* import { useRouter, usePathname } from 'next/navigation';
|
|
19
|
+
* import { useTileNavigation } from '@thewhateverapp/tile-sdk';
|
|
20
|
+
*
|
|
21
|
+
* function NavigationProvider({ children }) {
|
|
22
|
+
* const router = useRouter();
|
|
23
|
+
* const pathname = usePathname();
|
|
24
|
+
* useTileNavigation({ router, pathname });
|
|
25
|
+
* return <>{children}</>;
|
|
26
|
+
* }
|
|
27
|
+
* ```
|
|
28
|
+
*/
|
|
29
|
+
export declare function useTileNavigation({ router, pathname }: UseTileNavigationProps): void;
|
|
30
|
+
export {};
|
|
31
|
+
//# sourceMappingURL=useTileNavigation.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useTileNavigation.d.ts","sourceRoot":"","sources":["../../src/react/useTileNavigation.ts"],"names":[],"mappings":"AAIA,KAAK,iBAAiB,GAAG;IACvB,IAAI,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7B,OAAO,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,IAAI,EAAE,MAAM,IAAI,CAAC;CAClB,CAAC;AAEF,UAAU,sBAAsB;IAC9B,MAAM,EAAE,iBAAiB,CAAC;IAC1B,QAAQ,EAAE,MAAM,CAAC;CAClB;AAED;;;;;;;;;;;;;;;;;;GAkBG;AACH,wBAAgB,iBAAiB,CAAC,EAAE,MAAM,EAAE,QAAQ,EAAE,EAAE,sBAAsB,QA8B7E"}
|
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
import { useEffect } from 'react';
|
|
2
|
+
import { getTileBridge } from '../bridge/TileBridge.js';
|
|
3
|
+
/**
|
|
4
|
+
* Hook to integrate TileBridge navigation with Next.js App Router
|
|
5
|
+
*
|
|
6
|
+
* This hook listens for navigation events from TileBridge and uses
|
|
7
|
+
* Next.js router to navigate between /tile and /page routes.
|
|
8
|
+
*
|
|
9
|
+
* Usage in app/layout.tsx with Next.js hooks:
|
|
10
|
+
* ```tsx
|
|
11
|
+
* import { useRouter, usePathname } from 'next/navigation';
|
|
12
|
+
* import { useTileNavigation } from '@thewhateverapp/tile-sdk';
|
|
13
|
+
*
|
|
14
|
+
* function NavigationProvider({ children }) {
|
|
15
|
+
* const router = useRouter();
|
|
16
|
+
* const pathname = usePathname();
|
|
17
|
+
* useTileNavigation({ router, pathname });
|
|
18
|
+
* return <>{children}</>;
|
|
19
|
+
* }
|
|
20
|
+
* ```
|
|
21
|
+
*/
|
|
22
|
+
export function useTileNavigation({ router, pathname }) {
|
|
23
|
+
const bridge = getTileBridge();
|
|
24
|
+
useEffect(() => {
|
|
25
|
+
// Listen for navigation events from TileBridge
|
|
26
|
+
const unsubscribe = bridge.on('navigate', (data) => {
|
|
27
|
+
const targetRoute = data.route;
|
|
28
|
+
if (typeof window !== 'undefined') {
|
|
29
|
+
console.log('[useTileNavigation] Navigation event received:', {
|
|
30
|
+
targetRoute,
|
|
31
|
+
currentPathname: pathname,
|
|
32
|
+
target: data.target,
|
|
33
|
+
});
|
|
34
|
+
}
|
|
35
|
+
// Only navigate if we're not already on the target route
|
|
36
|
+
if (pathname !== targetRoute) {
|
|
37
|
+
console.log('[useTileNavigation] Navigating to:', targetRoute);
|
|
38
|
+
router.push(targetRoute);
|
|
39
|
+
}
|
|
40
|
+
else {
|
|
41
|
+
console.log('[useTileNavigation] Already on target route, skipping navigation');
|
|
42
|
+
}
|
|
43
|
+
});
|
|
44
|
+
// Cleanup
|
|
45
|
+
return () => {
|
|
46
|
+
unsubscribe();
|
|
47
|
+
};
|
|
48
|
+
}, [bridge, router, pathname]);
|
|
49
|
+
}
|