@itznevikat/router
Version:
π¦ ΠΠ½ΠΎΠ³ΠΎΡΡΠ½ΠΊΡΠΈΠΎΠ½Π°Π»ΡΠ½ΡΠΉ ΡΠΎΡΡΠ΅Ρ Π΄Π»Ρ ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΠΉ Π½Π° React ΠΈ VKUI
2 lines (1 loc) β’ 5.77 kB
JavaScript
import{createHashHistory as e,Action as t,createPath as n}from"history";import r,{isValidElement as o,Children as a,useState as l,useEffect as i,useContext as u,useMemo as c,useCallback as s,createContext as f,useRef as p,cloneElement as d}from"react";import{deepMap as v,deepForEach as h}from"react-children-utilities";import{ConfigProviderContext as m,Platform as y,View as b,Root as k,Epic as w,ModalRoot as E}from"@vkontakte/vkui";import{getNavId as I}from"@vkontakte/vkui/dist/lib/getNavId";import D from"@vkontakte/vk-bridge";let O=e({window});function R(e,t){return O.push(e,{meta:t})}function L(e,t){return O.replace(e,{meta:t})}function P(){return O.back()}function g(){return O.forward()}function S(e){return O.go(e)}function M(e){return O.block(e)}function A(e){return O.listen(e)}function B(){return B=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},B.apply(this,arguments)}function K(e){if(o(e))return e.props["data-node-id"]}function T(e){if(o(e))return I(e.props)}function U(e,t,n){let r={},l=n.split(/(?=\/)/),i=l.shift();return function e(n,u){if(!o(n)||!o(u))return;let c=T(n),s=K(u);if(c&&s&&i===c){let e=t.find(e=>e.nodeID===s);null!=e&&e.availableTransitionIDs.includes(c)&&(r[s]=c,i=l.shift())}n.props.children&&a.toArray(n.props.children).forEach(t=>e(t,c?n:u))}(e,e),r}let V=location;function j(){var e;return null!=(e=Object.fromEntries(new URLSearchParams(O.location.search.slice(1))))?e:{}}function C(){let[e,t]=l(j);return i(()=>O.listen(()=>t(j)),[]),e}function x(){var e,t;return null!=(e=null==(t=O.location.state)?void 0:t.meta)?e:{}}function H(){let[e,n]=l(x);return i(()=>O.listen(({action:e})=>{[t.Push,t.Replace].includes(e)&&n(x)}),[]),e}function N(){return O.location}function W(){let[e,t]=l(N);return i(()=>O.listen(()=>t(N)),[]),e}function _(){return V}function q(){let{root:e,navs:t}=u($),n=c(()=>U(e,t,O.location.pathname),[e,O.location.pathname]),{view:r,panel:o}=c(()=>{var e,r,o,a,l,i;let u=null!=(e=null==(r=t.find(({type:e})=>"root"===e||"epic"===e))?void 0:r.nodeID)?e:"/",c=null!=(o=n[u])?o:"/",s=null!=(a=null==(l=t.find(({type:e,navID:t})=>"view"===e&&t===c))?void 0:l.nodeID)?a:"/",f=null!=(i=n[s])?i:"/";return{view:c,panel:f}},[e,t,O.location.pathname]);return B({},n,{view:r,panel:o})}let z=null;function F(e){let t=s(t=>{z=t,e&&e(z)},[e]),n=s(t=>{z=null==t?void 0:t.target,e&&e(z)},[e]);return{actionRef:z,setActionRef:t,setActionRefHandler:n}}function G(){let{platform:e}=u(m);return e===y.VKCOM?ee.DESKTOP:ee.MOBILE}const J=e=>r.createElement(b,B({},e),e.children),Q=e=>r.createElement(k,B({},e),e.children),X=e=>r.createElement(w,B({},e),e.children),Y=e=>{let{modal:t=null}=C();return r.createElement(E,B({activeModal:t,onClose:P},e),e.children)};function Z(e){let t="";return h(e,e=>{var n;o(e)&&(t+=null!=(n=e.key)?n:e.type.name)}),t}const $=f({});var ee;!function(e){e.MOBILE="MOBILE",e.DESKTOP="DESKTOP"}(ee||(ee={}));const te=({children:e,style:u,initialURL:s,fallbackURL:f,disableSetLocation:m})=>{let y=l()[1],E=p(!0),I=c(()=>function(e){return v(e,e=>{if(!o(e))return e;if(!T(e)){switch(e.type){case J:case Q:case X:console.warn("[router] found known navigation layout but no `nav` property. Maybe you forgot about it?");break;case b:case k:case w:console.warn("[router] use View, Root and Epic imported from the router to work correctly.")}return e}return d(e,B({},e.props,{"data-node-id":Z(e)}))})[0]}(e),[e]),R=c(()=>function(e){let t=[];return h(e,e=>{if(!o(e))return;let n,r=T(e);if(!r)return e;switch(e.type){case J:n="view";break;case Q:n="root";break;case X:n="epic";break;default:return e}let l=a.toArray(e.props.children).map(e=>o(e)&&T(e)).filter(e=>!!e);t.unshift(function(e,t,n,r){return{type:e,navID:t,nodeID:r,availableTransitionIDs:n,transitions:[n[0]]}}(n,r,l,e.props["data-node-id"]))}),t}(I),[]),L=E.current&&null!=s?s:O.location.pathname,P=null!=u?u:G();return i(()=>{let e=O.listen(({location:e,action:r})=>{let o=e.state,a=U(I,R,e.pathname);var l,i,u;if(0===Object.keys(a).length&&(console.warn("[router] route not found."),f))return(null==o||null==(l=o.meta)?void 0:l.retry)>0?console.error("[router] fallback route not found."):O.replace(f,{force:!0,meta:{from:n(e),retry:null!=o&&null!=(i=o.meta)&&i.retry?(null==o||null==(u=o.meta)?void 0:u.retry)+1:1,meta:null==o?void 0:o.meta}});null!=o&&o.force&&(r=t.Push),R.forEach(({nodeID:e,transitions:n})=>{var o;let l=null!=(o=a[e])?o:"/";n[n.length-1]!==l&&(r===t.Push&&n.push(l),r===t.Replace&&n.splice(-1,1,l),r===t.Pop)&&(n.includes(l)?n.pop():n.push(l))}),m||function(e){D.send("VKWebAppSetLocation",{location:n(e),replace_state:!0})}(e),y({})}),r=n(O.location);return s?s!==r&&(L=s,O.replace(s)):O.location.search.slice(1)?(O.replace(O.location.pathname),O.push(r)):O.location.pathname.slice(1)&&(O.replace("/"),O.push(r)),E.current=!1,e},[]),r.createElement($.Provider,{value:{root:I,navs:R,style:P,initialURL:s,fallbackURL:f,disableSetLocation:m}},function(e,t,n,r){let a=U(t,n,e);return v(t,e=>{var t;if(!o(e))return e;let l=K(e);if(!l)return e;let i=null!=(t=a[l])?t:"/",u=B({},e.props);switch(e.type){case J:if(u.activePanel=i,r===ee.MOBILE){let e=n.find(e=>e.nodeID===l);u.history=e.transitions,u.onSwipeBack=O.back}break;case Q:u.activeView=i;break;case X:u.activeStory=i;break;default:return e}return d(e,u)})[0]}(L,I,R,P))};function ne(e,t){var n;return e&&null!=(n=t.find(t=>T(t)===e))?n:null}export{X as Epic,te as Match,$ as MatchContext,Y as ModalRoot,Q as Root,ee as Style,J as View,P as back,M as block,g as forward,S as go,A as listen,ne as matchPopout,R as push,L as replace,F as useActionRef,q as useDeserialized,_ as useInitialLocation,W as useLocation,H as useMeta,C as useParams,G as useStyle};