@django-bridge/react 0.3.2 → 0.4.0-rc.10

package/dist/index.d.ts

@@ -1,43 +1,6 @@
-import React, { ReactNode, ReactElement, FunctionComponent, Context } from 'react';
-import Telepath from 'telepath-unpack';
-
-type MessageLevel = "info" | "success" | "warning" | "error";
-interface TextMessage {
-    level: MessageLevel;
-    text: string;
-}
-interface HTMLMessage {
-    level: MessageLevel;
-    html: string;
-}
-type Message = TextMessage | HTMLMessage;
-interface ReloadResponse {
-    status: "reload";
-}
-interface RedirectResponse {
-    status: "redirect";
-    path: string;
-}
-interface RenderResponse {
-    status: "render";
-    overlay: boolean;
-    title: string;
-    view: string;
-    props: Record<string, unknown>;
-    context: Record<string, unknown>;
-    messages: Message[];
-}
-interface CloseOverlayResponse {
-    status: "close-overlay";
-    messages: Message[];
-}
-interface ServerErrorResponse {
-    status: "server-error";
-}
-interface NetworkErrorResponse {
-    status: "network-error";
-}
-type DjangoBridgeResponse = ReloadResponse | RedirectResponse | RenderResponse | CloseOverlayResponse | ServerErrorResponse | NetworkErrorResponse;
+import React, { ReactNode, ReactElement, Context } from 'react';
+import { Message, Config as Config$1, Frame, DjangoBridgeResponse } from '@django-bridge/common';
+export { Frame, Message, Metadata, DjangoBridgeResponse as Response } from '@django-bridge/common';
 
 interface NavigateOptions {
     pushState?: boolean;
@@ -84,17 +47,10 @@ declare const Link: React.ForwardRefExoticComponent<React.AnchorHTMLAttributes<H
     skipDirtyFormCheck?: boolean;
 } & React.RefAttributes<HTMLAnchorElement>>;
 
-declare class Config {
-    views: Map<string, FunctionComponent>;
+declare class Config extends Config$1 {
     contextProviders: Map<string, Context<unknown>>;
-    telepathRegistry: Telepath;
     constructor();
-    addView: <P>(name: string, component: FunctionComponent<P>) => Config;
     addContextProvider: <C>(name: string, context: Context<C>) => Config;
-    addAdapter: <Cls>(name: string, ctor: {
-        new (...args: any[]): Cls;
-    }) => Config;
-    unpack: (data: Record<string, unknown>) => Record<string, unknown>;
 }
 
 interface FormProps extends React.HTMLProps<HTMLFormElement> {
@@ -103,6 +59,12 @@ interface FormProps extends React.HTMLProps<HTMLFormElement> {
 }
 declare function Form({ children, onSubmit: callerOnSubmit, isDirty: isInitiallyDirty, disableDirtyCheck, ...props }: FormProps): ReactElement;
 
+interface RenderFrameProps {
+    config: Config;
+    frame: Frame;
+}
+declare function RenderFrame({ config, frame }: RenderFrameProps): ReactElement;
+
 interface DirtyForm {
     isDirty: boolean;
     requestUnload: () => Promise<unknown>;
@@ -115,15 +77,6 @@ interface DirtyForm {
 declare const DirtyFormContext: React.Context<DirtyForm>;
 declare function DirtyFormMarker(): React.ReactElement;
 
-interface Frame<Props = Record<string, unknown>> {
-    id: number;
-    path: string;
-    title: string;
-    view: string;
-    props: Props;
-    context: Record<string, unknown>;
-    shouldReloadCallback?: (newPath: string, newProps: Props) => boolean;
-}
 interface NavigationController {
     parent: NavigationController | null;
     currentFrame: Frame;
@@ -141,4 +94,4 @@ interface AppProps {
 }
 declare function App({ config, initialResponse }: AppProps): ReactElement;
 
-export { App, type AppProps, BuildLinkElement, Config, type DirtyForm, DirtyFormContext, DirtyFormMarker, Form, FormSubmissionStatus, FormWidgetChangeNotificationContext, type Frame, Link, type Message, MessagesContext, type Navigation, NavigationContext, type NavigationController, OverlayContext, type DjangoBridgeResponse as Response, buildLinkElement };
+export { App, type AppProps, BuildLinkElement, Config, type DirtyForm, DirtyFormContext, DirtyFormMarker, Form, FormSubmissionStatus, FormWidgetChangeNotificationContext, Link, MessagesContext, type Navigation, NavigationContext, type NavigationController, OverlayContext, RenderFrame, buildLinkElement };

package/dist/index.js

@@ -1 +1,3 @@
-"use strict";var fe=Object.create;var X=Object.defineProperty;var Ce=Object.getOwnPropertyDescriptor;var he=Object.getOwnPropertyNames;var ye=Object.getPrototypeOf,Re=Object.prototype.hasOwnProperty;var xe=(e,o)=>{for(var t in o)X(e,t,{get:o[t],enumerable:!0})},ce=(e,o,t,s)=>{if(o&&typeof o=="object"||typeof o=="function")for(let n of he(o))!Re.call(e,n)&&n!==t&&X(e,n,{get:()=>o[n],enumerable:!(s=Ce(o,n))||s.enumerable});return e};var k=(e,o,t)=>(t=e!=null?fe(ye(e)):{},ce(o||!e||!e.__esModule?X(t,"default",{value:e,enumerable:!0}):t,e)),we=e=>ce(X({},"__esModule",{value:!0}),e);var ke={};xe(ke,{App:()=>Fe,BuildLinkElement:()=>te,Config:()=>A,DirtyFormContext:()=>b,DirtyFormMarker:()=>V,Form:()=>oe,FormSubmissionStatus:()=>$,FormWidgetChangeNotificationContext:()=>Y,Link:()=>ue,MessagesContext:()=>B,NavigationContext:()=>D,OverlayContext:()=>G,buildLinkElement:()=>ee});module.exports=we(ke);var F=k(require("react"));var _=k(require("react"));var x=k(require("react")),U=require("react/jsx-runtime"),Q=x.default.createContext(()=>{}),b=x.default.createContext({isDirty:!1,requestUnload:()=>Promise.resolve(),unloadRequested:!1,unloadBlocked:!1,confirmUnload:()=>{},cancelUnload:()=>{},unloadConfirmed:!1});function Z({handleBrowserUnload:e=!1,children:o}){let[t,s]=x.default.useState(!1),[n,a]=x.default.useState({cb:()=>{}}),[p,g]=x.default.useState(!1),[c,v]=x.default.useState(!1),d=x.default.useRef(null),h=()=>d.current&&!!d.current.querySelector("div.dirty-form-marker")||!1;x.default.useEffect(()=>{if(e&&c){let m="This page has unsaved changes.",l=R=>h()?(R.returnValue=m,m):"";return window.addEventListener("beforeunload",l),()=>{window.removeEventListener("beforeunload",l)}}return()=>{}},[e,c]);let y=x.default.useContext(Q),u=x.default.useCallback(()=>{v(h()),y()},[y]),i=x.default.useMemo(()=>({isDirty:c,requestUnload:()=>c&&h()?(s(!0),new Promise(m=>{a({cb:m})})):Promise.resolve(),unloadRequested:t,unloadBlocked:c&&t,confirmUnload:()=>{t&&(g(!0),n.cb(),s(!1),a({cb:()=>{}}))},cancelUnload:()=>{t&&(s(!1),a({cb:()=>{}}))},unloadConfirmed:p}),[c,n,p,t]);return(0,U.jsx)("div",{ref:d,children:(0,U.jsx)(Q.Provider,{value:u,children:(0,U.jsx)(b.Provider,{value:i,children:o})})})}function V(){let e=x.default.useContext(Q);return x.default.useEffect(e),(0,U.jsx)("div",{className:"dirty-form-marker",style:{display:"none"}})}var O=k(require("react")),G=O.default.createContext({overlay:!1,closeRequested:!1,requestClose:()=>{console.error("OverlayContext.requestClose() called from outside an overlay")},onCloseCompleted:()=>{console.error("OverlayContext.onCloseCompleted() called from outside an overlay")}}),D=O.default.createContext({frameId:0,path:"/",props:{},context:{},navigate:()=>(console.error("navigate() called from outside a Django Bridge Browser"),Promise.resolve()),replacePath:()=>{console.error("replacePath() called from outside a Django Bridge Browser")},submitForm:()=>(console.error("submitForm() called from outside a Django Bridge Browser"),Promise.resolve()),openOverlay:()=>{throw console.error("openOverlay() called from outside a Django Bridge Browser"),new Error("Modal cannot be opened here")},refreshProps:()=>(console.error("refreshProps() called from outside a Django Bridge Browser"),Promise.resolve())}),Y=O.default.createContext(()=>{}),$=O.default.createContext(!1),B=O.default.createContext({messages:[],pushMessage:()=>{}});var E=require("react/jsx-runtime");function Pe({config:e,navigationController:o,openOverlay:t}){let{currentFrame:s,navigate:n,replacePath:a,submitForm:p,refreshProps:g}=o,{isDirty:c,requestUnload:v,cancelUnload:d}=_.default.useContext(b),h=_.default.useMemo(()=>({frameId:s.id,path:s.path,props:s.props,context:s.context,navigate:(i,m={})=>!c||m.skipDirtyFormCheck===!0?(m.skipDirtyFormCheck===!0&&d(),n(i,m.pushState)):v().then(()=>n(i,m.pushState)),replacePath:a,submitForm:p,openOverlay:t,refreshProps:g}),[s,a,p,t,c,v,d,n,g]),y=e.views.get(s.view);if(!y)return(0,E.jsxs)("p",{children:["Unknown view '",s.view,"'"]});let u=(0,E.jsx)(y,{...s.props});return e.contextProviders.forEach((i,m)=>{u=(0,E.jsx)(i.Provider,{value:s.context[m],children:u})}),(0,E.jsx)(D.Provider,{value:h,children:(0,E.jsx)("div",{children:u},s.id)})}var J=Pe;async function q(e,o){let t,s={"X-Requested-With":"DjangoBridge"};o&&(s["X-DjangoBridge-Overlay"]="true");try{t=await fetch(e,{headers:s})}catch{return{status:"network-error"}}return t.status===500?{status:"server-error"}:t.headers.get("X-DjangoBridge-Status")?t.json():{status:"reload"}}async function de(e,o,t){let s,n={"X-Requested-With":"DjangoBridge"};t&&(n["X-DjangoBridge-Overlay"]="true");try{s=await fetch(e,{method:"post",headers:n,body:o})}catch{return{status:"network-error"}}return s.status===500?{status:"server-error"}:s.headers.get("X-DjangoBridge-Status")?s.json():{status:"reload"}}var C=require("react");var z=1;function K(e,o,t,s,n={}){z+=1;let[a,p]=(0,C.useState)({id:z,path:s,title:"Loading",view:"loading",props:{},context:{}}),g=(0,C.useCallback)((r,f,w,P,M,N,H=!0,ge=!0)=>{let ne=a.id,se=w!==a.view||ge;if(se&&(z+=1,ne=z),!e&&(document.title=f,H)){let ie=0,ve=window.scrollY,le=window.history?.state;le?.prevPath===r&&(ie=le.prevScrollPosition??0),window.history.pushState({prevPath:window.location.pathname,prevScrollPosition:ve},"",r),window.scrollTo(0,ie)}let ae={id:ne,path:r,title:f,view:w,props:P,context:M};p(ae),n.onNavigation&&n.onNavigation(ae,se,N)},[n,a.id,a.view,e]),[c,v]=(0,C.useState)(null),d=(0,C.useCallback)((r,f,w=!0,P=!1)=>{if(r.status==="reload")if(!e)window.location.href=f;else return e.handleResponse(r,f);else{if(r.status==="redirect")return v(r.path),Promise.resolve();if(r.status==="render"){if(e&&!r.overlay)return e.handleResponse(r,f);let M=o(r.props),N=o(r.context),H=!P;H&&r.view===a.view&&a.shouldReloadCallback&&(H=a.shouldReloadCallback(f,M)),g(f,r.title,r.view,M,N,r.messages,w,H)}else if(r.status==="close-overlay")n.onOverlayClose&&n.onOverlayClose(r.messages);else{if(r.status==="server-error")return n.onServerError&&n.onServerError("server"),Promise.reject();if(r.status==="network-error")return n.onServerError&&n.onServerError("network"),Promise.reject()}}return Promise.resolve()},[n,a,e,g,o]),h=(0,C.useRef)(1),y=(0,C.useRef)(1),u=(0,C.useCallback)(async(r,f,w,P=!1)=>{h.current+=1;let M=h.current,N=await r();M<y.current||(y.current=M,N!==null&&await d(N,f,w,P))},[d]),i=(0,C.useCallback)((r,f=!0)=>{let w=r;if(!r.startsWith("/")){let P=new URL(r);if(P.origin!==window.location.origin)return window.location.href=r,Promise.resolve();w=P.pathname+P.search}return u(()=>q(w,!!e),w,f)},[u,e]),m=(0,C.useCallback)((r,f)=>{r===a.id&&(a.path=f,e||history.replaceState({},"",a.path))},[a,e]),l=(0,C.useCallback)((r,f)=>u(()=>de(r,f,!!e),r,!0),[u,e]),R=(0,C.useCallback)(()=>u(()=>q(a.path,!!e),a.path,!1,!0),[a.path,u,e]);return(0,C.useEffect)(()=>{d(t,s,!1)},[]),(0,C.useEffect)(()=>{c&&(v(null),i(c))},[i,c]),{parent:e,currentFrame:a,isLoading:a.view==="loading",handleResponse:d,navigate:i,replacePath:m,submitForm:l,refreshProps:R}}var I=k(require("react"));var me=require("react/jsx-runtime");function ee({children:e,href:o,skipDirtyFormCheck:t=!1,...s},{navigate:n},a){return(0,me.jsx)("a",{onClick:g=>{o&&(g.preventDefault(),n(o,{skipDirtyFormCheck:t}))},href:o||"#",ref:a,...s,children:e})}var te=I.default.createContext(ee),be=I.default.forwardRef((e,o)=>{let t=I.default.useContext(D);return I.default.useContext(te)(e,t,o)}),ue=be;var pe=k(require("telepath-unpack")),A=class{views;contextProviders;telepathRegistry;constructor(){this.views=new Map,this.contextProviders=new Map,this.telepathRegistry=new pe.default,this.addAdapter("Date",Date)}addView=(o,t)=>(this.views.set(o,t),this);addContextProvider=(o,t)=>(this.contextProviders.set(o,t),this);addAdapter=(o,t)=>(this.telepathRegistry.register(o,t),this);unpack=o=>this.telepathRegistry.unpack(o)};var L=k(require("react"));var j=require("react/jsx-runtime");function oe({children:e,onSubmit:o,isDirty:t=!1,disableDirtyCheck:s=!1,...n}){let{submitForm:a,navigate:p}=L.default.useContext(D),[g,c]=L.default.useState(!1),[v,d]=L.default.useState(t),{cancelUnload:h}=L.default.useContext(b),y=i=>{if(v&&h(),!(o&&(o(i),i.defaultPrevented))&&i.target instanceof HTMLFormElement){if(g){i.preventDefault();return}let m=new FormData(i.target);if(i.nativeEvent instanceof SubmitEvent&&i.nativeEvent.submitter){let{submitter:l}=i.nativeEvent;(l instanceof HTMLButtonElement||l instanceof HTMLInputElement)&&l.name&&l.value&&m.set(l.name,l.value)}if(i.target.method==="post")i.preventDefault(),c(!0),a(i.target.action,m).catch(()=>c(!1));else if(i.target.method==="get"){i.preventDefault();let l=Array.from(m.entries()).map(r=>`${encodeURIComponent(r[0])}=${encodeURIComponent(r[1])}`).join("&"),R=i.target.action+(i.target.action.indexOf("?")===-1?"?":"&")+l;c(!0),p(R).catch(()=>c(!1))}}},u=L.default.useCallback(()=>{d(!0)},[]);return(0,j.jsxs)("form",{onSubmit:y,...n,children:[v&&!s&&(0,j.jsx)(V,{}),(0,j.jsx)($.Provider,{value:g,children:(0,j.jsx)(Y.Provider,{value:u,children:e})})]})}var W=k(require("react"));var T=require("react/jsx-runtime");function re({config:e,initialResponse:o,initialPath:t,parentNavigationContoller:s,render:n,requestClose:a,closeRequested:p,onCloseCompleted:g,onServerError:c}){let{pushMessage:v}=W.default.useContext(B),d=K(s,e.unpack,o,t,{onNavigation:(i,m,l)=>{l.forEach(v)},onOverlayClose:i=>{i.forEach(v),a()},onServerError:c}),h=W.default.useContext(b),y=W.default.useCallback(({skipDirtyFormCheck:i=!1}={})=>{!i&&h.isDirty?h.requestUnload().then(()=>a()):a()},[h,a]),u=W.default.useMemo(()=>({overlay:!0,closeRequested:p,requestClose:y,onCloseCompleted:g}),[p,g,y]);return d.isLoading?(0,T.jsx)(T.Fragment,{}):(0,T.jsx)(G.Provider,{value:u,children:n((0,T.jsx)(J,{config:e,navigationController:d,openOverlay:()=>{}}))})}var S=require("react/jsx-runtime");function Fe({config:e,initialResponse:o}){let[t,s]=F.default.useState([]),n=F.default.useCallback(l=>{s(t.concat([l]))},[t]),a=F.default.useCallback(l=>{l==="server"?n({level:"error",text:"A server error occurred. Please try again later."}):l==="network"&&n({level:"error",text:"A network error occurred. Please check your internet connection or try again later."})},[n]),[p,g]=F.default.useState(null),[c,v]=F.default.useState(!1),d=F.default.useRef(null),h=(l,R,r)=>{R&&(v(!0),d.current=null),R?s(r):r.forEach(n)},y=window.location.pathname+window.location.search+window.location.hash,u=K(null,e.unpack,o,y,{onNavigation:h,onServerError:a});F.default.useEffect(()=>{let l=document.querySelector(".django-bridge-load");l instanceof HTMLElement&&(l.classList.add("django-bridge-load--hidden"),setTimeout(()=>{l.remove()},200));let R=()=>{u.navigate(document.location.pathname,!1)};return window.addEventListener("popstate",R),()=>{window.removeEventListener("popstate",R)}},[]);let i=async(l,R,{onClose:r}={})=>{let f=await q(l,!0);r&&(d.current=r),v(!1),g({render:R,initialResponse:f,initialPath:l})},m=F.default.useMemo(()=>({messages:t,pushMessage:n}),[t,n]);return(0,S.jsx)(Z,{handleBrowserUnload:!0,children:(0,S.jsxs)(B.Provider,{value:m,children:[p&&(0,S.jsx)(Z,{children:(0,S.jsx)(re,{config:e,initialResponse:p.initialResponse,initialPath:p.initialPath,parentNavigationContoller:u,render:l=>p.render(l),requestClose:()=>v(!0),closeRequested:c,onCloseCompleted:()=>{g(null),v(!1),d.current&&(d.current(),d.current=null)},onServerError:a})}),!u.isLoading&&(0,S.jsx)(J,{config:e,navigationController:u,openOverlay:(l,R,r)=>void i(l,R,r)})]})})}0&&(module.exports={App,BuildLinkElement,Config,DirtyFormContext,DirtyFormMarker,Form,FormSubmissionStatus,FormWidgetChangeNotificationContext,Link,MessagesContext,NavigationContext,OverlayContext,buildLinkElement});
+"use strict";var Se=Object.create;var G=Object.defineProperty;var Ee=Object.getOwnPropertyDescriptor;var Ne=Object.getOwnPropertyNames;var Oe=Object.getPrototypeOf,De=Object.prototype.hasOwnProperty;var Le=(t,r)=>()=>(r||t((r={exports:{}}).exports,r),r.exports),Te=(t,r)=>{for(var e in r)G(t,e,{get:r[e],enumerable:!0})},he=(t,r,e,o)=>{if(r&&typeof r=="object"||typeof r=="function")for(let n of Ne(r))!De.call(t,n)&&n!==e&&G(t,n,{get:()=>r[n],enumerable:!(o=Ee(r,n))||o.enumerable});return t};var k=(t,r,e)=>(e=t!=null?Se(Oe(t)):{},he(r||!t||!t.__esModule?G(e,"default",{value:t,enumerable:!0}):e,t)),Ae=t=>he(G({},"__esModule",{value:!0}),t);var we=Le(($e,xe)=>{"use strict";function J(t,r,e){return _e()?J=Reflect.construct:J=function(n,i,s){var c=[null];c.push.apply(c,i);var u=Function.bind.apply(n,c),p=new u;return s&&oe(p,s.prototype),p},J.apply(null,arguments)}function _e(){if(typeof Reflect>"u"||!Reflect.construct||Reflect.construct.sham)return!1;if(typeof Proxy=="function")return!0;try{return Date.prototype.toString.call(Reflect.construct(Date,[],function(){})),!0}catch{return!1}}function oe(t,r){return oe=Object.setPrototypeOf||function(o,n){return o.__proto__=n,o},oe(t,r)}function Be(t){return qe(t)||Ue(t)||Re(t)||He()}function He(){throw new TypeError(`Invalid attempt to spread non-iterable instance.
+In order to be iterable, non-array objects must have a [Symbol.iterator]() method.`)}function Ue(t){if(typeof Symbol<"u"&&Symbol.iterator in Object(t))return Array.from(t)}function qe(t){if(Array.isArray(t))return ne(t)}function Y(t,r){return je(t)||Ie(t,r)||Re(t,r)||We()}function We(){throw new TypeError(`Invalid attempt to destructure non-iterable instance.
+In order to be iterable, non-array objects must have a [Symbol.iterator]() method.`)}function Re(t,r){if(t){if(typeof t=="string")return ne(t,r);var e=Object.prototype.toString.call(t).slice(8,-1);if(e==="Object"&&t.constructor&&(e=t.constructor.name),e==="Map"||e==="Set")return Array.from(t);if(e==="Arguments"||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(e))return ne(t,r)}}function ne(t,r){(r==null||r>t.length)&&(r=t.length);for(var e=0,o=new Array(r);e<r;e++)o[e]=t[e];return o}function Ie(t,r){if(!(typeof Symbol>"u"||!(Symbol.iterator in Object(t)))){var e=[],o=!0,n=!1,i=void 0;try{for(var s=t[Symbol.iterator](),c;!(o=(c=s.next()).done)&&(e.push(c.value),!(r&&e.length===r));o=!0);}catch(u){n=!0,i=u}finally{try{!o&&s.return!=null&&s.return()}finally{if(n)throw i}}return e}}function je(t){if(Array.isArray(t))return t}function U(t){"@babel/helpers - typeof";return typeof Symbol=="function"&&typeof Symbol.iterator=="symbol"?U=function(e){return typeof e}:U=function(e){return e&&typeof Symbol=="function"&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},U(t)}function Xe(t,r){if(!(t instanceof r))throw new TypeError("Cannot call a class as a function")}function Ce(t,r){for(var e=0;e<r.length;e++){var o=r[e];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(t,o.key,o)}}function Ge(t,r,e){return r&&Ce(t.prototype,r),e&&Ce(t,e),t}var Ye=function(){function t(){Xe(this,t),this.constructors={}}return Ge(t,[{key:"register",value:function(e,o){this.constructors[e]=o}},{key:"unpack",value:function(e){var o={};this.scanForIds(e,o);var n={};return this.unpackWithRefs(e,o,n)}},{key:"scanForIds",value:function(e,o){var n=this;if(!(e===null||U(e)!=="object")){if(Array.isArray(e)){e.forEach(function(l){return n.scanForIds(l,o)});return}var i=!1;if("_id"in e&&(i=!0,o[e._id]=e),("_type"in e||"_val"in e||"_ref"in e)&&(i=!0),"_list"in e&&(i=!0,e._list.forEach(function(l){return n.scanForIds(l,o)})),"_args"in e&&(i=!0,e._args.forEach(function(l){return n.scanForIds(l,o)})),"_dict"in e){i=!0;for(var s=0,c=Object.entries(e._dict);s<c.length;s++){var u=Y(c[s],2),p=u[0],m=u[1];this.scanForIds(m,o)}}if(!i)for(var v=0,g=Object.entries(e);v<g.length;v++){var d=Y(g[v],2),f=d[0],h=d[1];this.scanForIds(h,o)}}}},{key:"unpackWithRefs",value:function(e,o,n){var i=this;if(e===null||U(e)!=="object")return e;if(Array.isArray(e))return e.map(function(x){return i.unpackWithRefs(x,o,n)});var s;if("_ref"in e)e._ref in n?s=n[e._ref]:s=this.unpackWithRefs(o[e._ref],o,n);else if("_val"in e)s=e._val;else if("_list"in e)s=e._list.map(function(x){return i.unpackWithRefs(x,o,n)});else if("_dict"in e){s={};for(var c=0,u=Object.entries(e._dict);c<u.length;c++){var p=Y(u[c],2),m=p[0],v=p[1];s[m]=this.unpackWithRefs(v,o,n)}}else if("_type"in e){var g=e._type,d=this.constructors[g];if(typeof d!="function")throw new Error("telepath encountered unknown object type ".concat(g));var f=e._args.map(function(x){return i.unpackWithRefs(x,o,n)});s=J(d,Be(f))}else{if("_id"in e)throw new Error("telepath encountered object with _id but no type specified");s={};for(var h=0,l=Object.entries(e);h<l.length;h++){var C=Y(l[h],2),a=C[0],y=C[1];s[a]=this.unpackWithRefs(y,o,n)}return s}return"_id"in e&&(n[e._id]=s),s}}]),t}();xe.exports=Ye});var Ze={};Te(Ze,{App:()=>Qe,BuildLinkElement:()=>ue,Config:()=>j,DirtyFormContext:()=>F,DirtyFormMarker:()=>Q,Form:()=>fe,FormSubmissionStatus:()=>$,FormWidgetChangeNotificationContext:()=>V,Link:()=>Fe,MessagesContext:()=>L,NavigationContext:()=>M,OverlayContext:()=>Z,RenderFrame:()=>ee,buildLinkElement:()=>ce});module.exports=Ae(Ze);var b=k(require("react"));var Pe=k(we()),q=class{views;telepathRegistry;constructor(){this.views=new Map,this.telepathRegistry=new Pe.default,this.addAdapter("Date",Date)}addView=(r,e)=>(this.views.set(r,e),this);addAdapter=(r,e)=>(this.telepathRegistry.register(r,e),this);unpack=r=>this.telepathRegistry.unpack(r)};async function O(t,r){let e,o={"X-Requested-With":"DjangoBridge"};r&&(o["X-DjangoBridge-Overlay"]="true");try{e=await fetch(t,{headers:o})}catch{return{action:"network-error"}}return e.status===500?{action:"server-error"}:e.headers.get("X-DjangoBridge-Action")?e.json():{action:"reload"}}async function ie(t,r,e){let o,n={"X-Requested-With":"DjangoBridge"};e&&(n["X-DjangoBridge-Overlay"]="true");try{o=await fetch(t,{method:"post",headers:n,body:r})}catch{return{action:"network-error"}}return o.status===500?{action:"server-error"}:o.headers.get("X-DjangoBridge-Action")?o.json():{action:"reload"}}var R=require("react");var K=1;function z(t,r,e,o,n={}){K+=1;let[i,s]=(0,R.useState)({id:K,path:o,metadata:{title:"Loading"},view:"loading",props:{},context:{}}),c=(0,R.useCallback)((a,y,x,P,S,N,H=!0,ke=!0)=>{let me=i.id,pe=x!==i.view||ke;if(pe&&(K+=1,me=K),!t&&(document.title=y.title,H)){let ge=0,Me=window.scrollY,ye=window.history?.state;ye?.prevPath===a&&(ge=ye.prevScrollPosition??0),window.history.pushState({prevPath:window.location.pathname,prevScrollPosition:Me},"",a),window.scrollTo(0,ge)}let ve={id:me,path:a,metadata:y,view:x,props:P,context:S};s(ve),n.onNavigation&&n.onNavigation(ve,pe,N)},[n,i.id,i.view,t]),[u,p]=(0,R.useState)(null),m=(0,R.useCallback)((a,y,x=!0,P=!1)=>{if(a.action==="reload")if(!t)window.location.href=y;else return t.handleResponse(a,y);else{if(a.action==="redirect")return p(a.path),Promise.resolve();if(a.action==="render"){if(t&&!a.overlay)return t.handleResponse(a,y);let S=r(a.props),N=r(a.context),H=!P;H&&a.view===i.view&&i.shouldReloadCallback&&(H=i.shouldReloadCallback(y,S)),c(y,a.metadata,a.view,S,N,a.messages,x,H)}else if(a.action==="close-overlay")n.onOverlayClose&&n.onOverlayClose(a.messages);else{if(a.action==="server-error")return n.onServerError&&n.onServerError("server"),Promise.reject();if(a.action==="network-error")return n.onServerError&&n.onServerError("network"),Promise.reject()}}return Promise.resolve()},[n,i,t,c,r]),v=(0,R.useRef)(1),g=(0,R.useRef)(1),d=(0,R.useCallback)(async(a,y,x,P=!1)=>{v.current+=1;let S=v.current,N=await a();S<g.current||(g.current=S,N!==null&&await m(N,y,x,P))},[m]),f=(0,R.useCallback)((a,y=!0)=>{let x=a;if(!a.startsWith("/")){let P=new URL(a);if(P.origin!==window.location.origin)return window.location.href=a,Promise.resolve();x=P.pathname+P.search}return d(()=>O(x,!!t),x,y)},[d,t]),h=(0,R.useCallback)((a,y)=>{a===i.id&&(i.path=y,t||history.replaceState({},"",i.path))},[i,t]),l=(0,R.useCallback)((a,y)=>d(()=>ie(a,y,!!t),a,!0),[d,t]),C=(0,R.useCallback)(()=>d(()=>O(i.path,!!t),i.path,!1,!0),[i.path,d,t]);return(0,R.useEffect)(()=>{m(e,o,!1)},[]),(0,R.useEffect)(()=>{u&&(p(null),f(u))},[f,u]),{parent:t,currentFrame:i,isLoading:i.view==="loading",handleResponse:m,navigate:f,replacePath:h,submitForm:l,refreshProps:C}}var w=k(require("react")),W=require("react/jsx-runtime"),ae=w.default.createContext(()=>{}),F=w.default.createContext({isDirty:!1,requestUnload:()=>Promise.resolve(),unloadRequested:!1,unloadBlocked:!1,confirmUnload:()=>{},cancelUnload:()=>{},unloadConfirmed:!1});function se({handleBrowserUnload:t=!1,children:r}){let[e,o]=w.default.useState(!1),[n,i]=w.default.useState({cb:()=>{}}),[s,c]=w.default.useState(!1),[u,p]=w.default.useState(!1),m=w.default.useRef(null),v=()=>m.current&&!!m.current.querySelector("div.dirty-form-marker")||!1;w.default.useEffect(()=>{if(t&&u){let h="This page has unsaved changes.",l=C=>v()?(C.returnValue=h,h):"";return window.addEventListener("beforeunload",l),()=>{window.removeEventListener("beforeunload",l)}}return()=>{}},[t,u]);let g=w.default.useContext(ae),d=w.default.useCallback(()=>{p(v()),g()},[g]),f=w.default.useMemo(()=>({isDirty:u,requestUnload:()=>u&&v()?(o(!0),new Promise(h=>{i({cb:h})})):Promise.resolve(),unloadRequested:e,unloadBlocked:u&&e,confirmUnload:()=>{e&&(c(!0),n.cb(),o(!1),i({cb:()=>{}}))},cancelUnload:()=>{e&&(o(!1),i({cb:()=>{}}))},unloadConfirmed:s}),[u,n,s,e]);return(0,W.jsx)("div",{ref:m,children:(0,W.jsx)(ae.Provider,{value:d,children:(0,W.jsx)(F.Provider,{value:f,children:r})})})}function Q(){let t=w.default.useContext(ae);return w.default.useEffect(t),(0,W.jsx)("div",{className:"dirty-form-marker",style:{display:"none"}})}var le=k(require("react"));var D=k(require("react")),Z=D.default.createContext({overlay:!1,closeRequested:!1,requestClose:()=>{console.error("OverlayContext.requestClose() called from outside an overlay")},onCloseCompleted:()=>{console.error("OverlayContext.onCloseCompleted() called from outside an overlay")}}),M=D.default.createContext({frameId:0,path:"/",props:{},context:{},navigate:()=>(console.error("navigate() called from outside a Django Bridge Browser"),Promise.resolve()),replacePath:()=>{console.error("replacePath() called from outside a Django Bridge Browser")},submitForm:()=>(console.error("submitForm() called from outside a Django Bridge Browser"),Promise.resolve()),openOverlay:()=>{throw console.error("openOverlay() called from outside a Django Bridge Browser"),new Error("Modal cannot be opened here")},refreshProps:()=>(console.error("refreshProps() called from outside a Django Bridge Browser"),Promise.resolve())}),V=D.default.createContext(()=>{}),$=D.default.createContext(!1),L=D.default.createContext({messages:[],pushMessage:()=>{}});var T=require("react/jsx-runtime");function Je({config:t,frame:r}){let e=t.views.get(r.view);if(!e)return(0,T.jsxs)("p",{children:["Unknown view '",r.view,"'"]});let o=(0,T.jsx)(e,{...r.props});return t.contextProviders.forEach((n,i)=>{o=(0,T.jsx)(n.Provider,{value:r.context[i],children:o})}),(0,T.jsx)("div",{children:o},r.id)}var ee=Je;var te=require("react/jsx-runtime");function Ke({config:t,navigationController:r,openOverlay:e}){let{currentFrame:o,navigate:n,replacePath:i,submitForm:s,refreshProps:c}=r,{isDirty:u,requestUnload:p,cancelUnload:m}=le.default.useContext(F),v=le.default.useMemo(()=>({frameId:o.id,path:o.path,props:o.props,context:o.context,navigate:(g,d={})=>!u||d.skipDirtyFormCheck===!0?(d.skipDirtyFormCheck===!0&&m(),n(g,d.pushState)):p().then(()=>n(g,d.pushState)),replacePath:i,submitForm:s,openOverlay:e,refreshProps:c}),[o,i,s,e,u,p,m,n,c]);return(0,te.jsx)(M.Provider,{value:v,children:(0,te.jsx)("div",{children:(0,te.jsx)(ee,{config:t,frame:o})},o.id)})}var re=Ke;var I=k(require("react"));var be=require("react/jsx-runtime");function ce({children:t,href:r,skipDirtyFormCheck:e=!1,...o},{navigate:n},i){return(0,be.jsx)("a",{onClick:c=>{r&&(c.preventDefault(),n(r,{skipDirtyFormCheck:e}))},href:r||"#",ref:i,...o,children:t})}var ue=I.default.createContext(ce),ze=I.default.forwardRef((t,r)=>{let e=I.default.useContext(M);return I.default.useContext(ue)(t,e,r)}),Fe=ze;var j=class extends q{contextProviders;constructor(){super(),this.contextProviders=new Map}addContextProvider=(r,e)=>(this.contextProviders.set(r,e),this)};var A=k(require("react"));var _=require("react/jsx-runtime");function fe({children:t,onSubmit:r,isDirty:e=!1,disableDirtyCheck:o=!1,...n}){let{submitForm:i,navigate:s}=A.default.useContext(M),[c,u]=A.default.useState(!1),[p,m]=A.default.useState(e),{cancelUnload:v}=A.default.useContext(F),g=f=>{if(p&&v(),!(r&&(r(f),f.defaultPrevented))&&f.target instanceof HTMLFormElement){if(c){f.preventDefault();return}let h=new FormData(f.target);if(f.nativeEvent instanceof SubmitEvent&&f.nativeEvent.submitter){let{submitter:l}=f.nativeEvent;(l instanceof HTMLButtonElement||l instanceof HTMLInputElement)&&l.name&&l.value&&h.set(l.name,l.value)}if(f.target.method==="post")f.preventDefault(),u(!0),i(f.target.action,h).catch(()=>u(!1));else if(f.target.method==="get"){f.preventDefault();let l=Array.from(h.entries()).map(a=>`${encodeURIComponent(a[0])}=${encodeURIComponent(a[1])}`).join("&"),C=f.target.action+(f.target.action.indexOf("?")===-1?"?":"&")+l;u(!0),s(C).catch(()=>u(!1))}}},d=A.default.useCallback(()=>{m(!0)},[]);return(0,_.jsxs)("form",{onSubmit:g,...n,children:[p&&!o&&(0,_.jsx)(Q,{}),(0,_.jsx)($.Provider,{value:c,children:(0,_.jsx)(V.Provider,{value:d,children:t})})]})}var X=k(require("react"));var B=require("react/jsx-runtime");function de({config:t,initialResponse:r,initialPath:e,parentNavigationContoller:o,render:n,requestClose:i,closeRequested:s,onCloseCompleted:c,onServerError:u}){let{pushMessage:p}=X.default.useContext(L),m=z(o,t.unpack,r,e,{onNavigation:(f,h,l)=>{l.forEach(p)},onOverlayClose:f=>{f.forEach(p),i()},onServerError:u}),v=X.default.useContext(F),g=X.default.useCallback(({skipDirtyFormCheck:f=!1}={})=>{!f&&v.isDirty?v.requestUnload().then(()=>i()):i()},[v,i]),d=X.default.useMemo(()=>({overlay:!0,closeRequested:s,requestClose:g,onCloseCompleted:c}),[s,c,g]);return m.isLoading?(0,B.jsx)(B.Fragment,{}):(0,B.jsx)(Z.Provider,{value:d,children:n((0,B.jsx)(re,{config:t,navigationController:m,openOverlay:()=>{}}))})}var E=require("react/jsx-runtime");function Qe({config:t,initialResponse:r}){let[e,o]=b.default.useState([]),n=b.default.useCallback(l=>{o(e.concat([l]))},[e]),i=b.default.useCallback(l=>{l==="server"?n({level:"error",text:"A server error occurred. Please try again later."}):l==="network"&&n({level:"error",text:"A network error occurred. Please check your internet connection or try again later."})},[n]),[s,c]=b.default.useState(null),[u,p]=b.default.useState(!1),m=b.default.useRef(null),v=(l,C,a)=>{C&&(p(!0),m.current=null),C?o(a):a.forEach(n)},g=window.location.pathname+window.location.search+window.location.hash,d=z(null,t.unpack,r,g,{onNavigation:v,onServerError:i});b.default.useEffect(()=>{let l=document.querySelector(".django-bridge-load");l instanceof HTMLElement&&(l.classList.add("django-bridge-load--hidden"),setTimeout(()=>{l.remove()},200));let C=()=>{d.navigate(document.location.pathname,!1)};return window.addEventListener("popstate",C),()=>{window.removeEventListener("popstate",C)}},[]);let f=async(l,C,{onClose:a}={})=>{let y=await O(l,!0);a&&(m.current=a),p(!1),c({render:C,initialResponse:y,initialPath:l})},h=b.default.useMemo(()=>({messages:e,pushMessage:n}),[e,n]);return(0,E.jsx)(se,{handleBrowserUnload:!0,children:(0,E.jsxs)(L.Provider,{value:h,children:[s&&(0,E.jsx)(se,{children:(0,E.jsx)(de,{config:t,initialResponse:s.initialResponse,initialPath:s.initialPath,parentNavigationContoller:d,render:l=>s.render(l),requestClose:()=>p(!0),closeRequested:u,onCloseCompleted:()=>{c(null),p(!1),m.current&&(m.current(),m.current=null)},onServerError:i})}),!d.isLoading&&(0,E.jsx)(re,{config:t,navigationController:d,openOverlay:(l,C,a)=>void f(l,C,a)})]})})}0&&(module.exports={App,BuildLinkElement,Config,DirtyFormContext,DirtyFormMarker,Form,FormSubmissionStatus,FormWidgetChangeNotificationContext,Link,MessagesContext,NavigationContext,OverlayContext,RenderFrame,buildLinkElement});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@django-bridge/react",
-  "version": "0.3.2",
+  "version": "0.4.0-rc.10",
   "description": "The simple way to build Django applications with modern React frontends",
   "repository": "https://github.com/django-bridge/django-bridge",
   "license": "BSD-3-Clause",
@@ -10,7 +10,7 @@
     "/dist"
   ],
   "scripts": {
-    "build": "tsup src/index.tsx --format cjs --dts --minify --clean --out-dir dist",
+    "build": "tsup",
     "check-types": "tsc --noEmit"
   },
   "browserslist": {
@@ -26,14 +26,15 @@
     ]
   },
   "dependencies": {
-    "react": "^18.2.0",
-    "telepath-unpack": "^0.0.3"
+    "react": "^18.2.0"
   },
   "devDependencies": {
     "@types/node": "^12.0.0",
     "@types/react": "18",
     "tsup": "^8.0.1",
-    "typescript": "^5.3.3"
+    "typescript": "^5.3.3",
+    "telepath-unpack": "^0.0.4",
+    "@django-bridge/common": "*"
   },
   "peerDependencies": {
     "react": "^18.2.0"