crossroad 3.0.9 → 3.0.11
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/index.min.js +2 -2
- package/package.json +11 -13
- package/readme.md +11 -9
package/index.min.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{createContext as e,useCallback as r,useContext as t,useEffect as n,useRef as o,useState as a}from"react";var i=(e,r)=>()=>(r||e((r={exports:{}}).exports,r),r.exports),s=/* @__PURE__ */(e=>"undefined"!=typeof require?require:"undefined"!=typeof Proxy?new Proxy(e,{get:(e,r)=>("undefined"!=typeof require?require:e)[r]}):e)(function(e){if("undefined"!=typeof require)return require.apply(this,arguments);throw Error('Calling `require` for "'+e+"\" in an environment that doesn't expose the `require` function. See https://rolldown.rs/in-depth/bundling-cjs#require-external-modules for more details.")}),c=e(void 0),u=e=>e.length>1?e:e[0],l=e=>{if("string"!=typeof e)return e;const r={query:{}},t=new URL(e,"http://localhost:3000/");r.path=(t.pathname.replace(/\/$/,"")||"/").replaceAll("%3C","<").replaceAll("%3E",">"),r.query={};for(const[n]of t.searchParams)r.query[n]=u(t.searchParams.getAll(n));return t.hash&&(r.hash=t.hash.replace(/^#/,"")),r},f=e=>{if("string"==typeof e)return e;const{path:r,query:t={},hash:n}=e||{};let o=r||"/";const a=new URLSearchParams(Object.entries(t).map(([e,r])=>(Array.isArray(r)?r:[r]).map(r=>[e,r])).flat().filter(([e,r])=>r)).toString();return a&&(o+="?"+a),n&&(o+="#"+n),o},p=()=>"undefined"==typeof window,y=/* @__PURE__ */i(e=>{var r=s("react"),t=Symbol.for("react.element"),n=Symbol.for("react.fragment"),o=Object.prototype.hasOwnProperty,a=r.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,i={key:!0,ref:!0,__self:!0,__source:!0};function c(e,r,n){var s,c={},u=null,l=null;for(s in void 0!==n&&(u=""+n),void 0!==r.key&&(u=""+r.key),void 0!==r.ref&&(l=r.ref),r)o.call(r,s)&&!i.hasOwnProperty(s)&&(c[s]=r[s]);if(e&&e.defaultProps)for(s in r=e.defaultProps)void 0===c[s]&&(c[s]=r[s]);return{$$typeof:t,type:e,key:u,ref:l,props:c,_owner:a.current}}e.Fragment=n,e.jsx=c,e.jsxs=c}),d=/* @__PURE__ */i(e=>{"production"!==process.env.NODE_ENV&&function(){var r=s("react"),t=Symbol.for("react.element"),n=Symbol.for("react.portal"),o=Symbol.for("react.fragment"),a=Symbol.for("react.strict_mode"),i=Symbol.for("react.profiler"),c=Symbol.for("react.provider"),u=Symbol.for("react.context"),l=Symbol.for("react.forward_ref"),f=Symbol.for("react.suspense"),p=Symbol.for("react.suspense_list"),y=Symbol.for("react.memo"),d=Symbol.for("react.lazy"),h=Symbol.for("react.offscreen"),v=Symbol.iterator;var m=r.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;function g(e){for(var r=arguments.length,t=new Array(r>1?r-1:0),n=1;n<r;n++)t[n-1]=arguments[n];!function(e,r,t){var n=m.ReactDebugCurrentFrame.getStackAddendum();""!==n&&(r+="%s",t=t.concat([n]));var o=t.map(function(e){return String(e)});o.unshift("Warning: "+r),Function.prototype.apply.call(console[e],console,o)}("error",e,t)}var b=Symbol.for("react.module.reference");function w(e){return e.displayName||"Context"}function _(e){if(null==e)return null;if("number"==typeof e.tag&&g("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),"function"==typeof e)return e.displayName||e.name||null;if("string"==typeof e)return e;switch(e){case o:return"Fragment";case n:return"Portal";case i:return"Profiler";case a:return"StrictMode";case f:return"Suspense";case p:return"SuspenseList"}if("object"==typeof e)switch(e.$$typeof){case u:return w(e)+".Consumer";case c:return w(e._context)+".Provider";case l:return function(e,r,t){var n=e.displayName;if(n)return n;var o=r.displayName||r.name||"";return""!==o?t+"("+o+")":t}(e,e.render,"ForwardRef");case y:var r=e.displayName||null;return null!==r?r:_(e.type)||"Memo";case d:var t=e,s=t._payload,h=t._init;try{return _(h(s))}catch(v){return null}}return null}var k,S,j,O,R,E,P,x=Object.assign,q=0;function T(){}T.__reactDisabledLog=!0;var $,N=m.ReactCurrentDispatcher;function C(e,r,t){if(void 0===$)try{throw Error()}catch(o){var n=o.stack.trim().match(/\n( *(at )?)/);$=n&&n[1]||""}return"\n"+$+e}var D=!1,A=new("function"==typeof WeakMap?WeakMap:Map);function F(e,r){if(!e||D)return"";var t,n=A.get(e);if(void 0!==n)return n;D=!0;var o=Error.prepareStackTrace;Error.prepareStackTrace=void 0;var a=N.current;N.current=null,function(){if(0===q){k=console.log,S=console.info,j=console.warn,O=console.error,R=console.group,E=console.groupCollapsed,P=console.groupEnd;var e={configurable:!0,enumerable:!0,value:T,writable:!0};Object.defineProperties(console,{info:e,log:e,warn:e,error:e,group:e,groupCollapsed:e,groupEnd:e})}q++}();try{if(r){var i=function(){throw Error()};if(Object.defineProperty(i.prototype,"props",{set:function(){throw Error()}}),"object"==typeof Reflect&&Reflect.construct){try{Reflect.construct(i,[])}catch(d){t=d}Reflect.construct(e,[],i)}else{try{i.call()}catch(d){t=d}e.call(i.prototype)}}else{try{throw Error()}catch(d){t=d}e()}}catch(h){if(h&&t&&"string"==typeof h.stack){for(var s=h.stack.split("\n"),c=t.stack.split("\n"),u=s.length-1,l=c.length-1;u>=1&&l>=0&&s[u]!==c[l];)l--;for(;u>=1&&l>=0;u--,l--)if(s[u]!==c[l]){if(1!==u||1!==l)do{if(u--,--l<0||s[u]!==c[l]){var f="\n"+s[u].replace(" at new "," at ");return e.displayName&&f.includes("<anonymous>")&&(f=f.replace("<anonymous>",e.displayName)),"function"==typeof e&&A.set(e,f),f}}while(u>=1&&l>=0);break}}}finally{D=!1,N.current=a,function(){if(0===--q){var e={configurable:!0,enumerable:!0,writable:!0};Object.defineProperties(console,{log:x({},e,{value:k}),info:x({},e,{value:S}),warn:x({},e,{value:j}),error:x({},e,{value:O}),group:x({},e,{value:R}),groupCollapsed:x({},e,{value:E}),groupEnd:x({},e,{value:P})})}q<0&&g("disabledDepth fell below zero. This is a bug in React. Please file an issue.")}(),Error.prepareStackTrace=o}var p=e?e.displayName||e.name:"",y=p?C(p):"";return"function"==typeof e&&A.set(e,y),y}function I(e,r,t){if(null==e)return"";if("function"==typeof e)return F(e,!(!(n=e.prototype)||!n.isReactComponent));var n;if("string"==typeof e)return C(e);switch(e){case f:return C("Suspense");case p:return C("SuspenseList")}if("object"==typeof e)switch(e.$$typeof){case l:return F(e.render,!1);case y:return I(e.type,r,t);case d:var o=e,a=o._payload,i=o._init;try{return I(i(a),r,t)}catch(s){}}return""}var L=Object.prototype.hasOwnProperty,U={},W=m.ReactDebugCurrentFrame;function z(e){if(e){var r=e._owner,t=I(e.type,e._source,r?r.type:null);W.setExtraStackFrame(t)}else W.setExtraStackFrame(null)}var J=Array.isArray;function M(e){return J(e)}function Y(e){return""+e}function B(e){if(function(e){try{return Y(e),!1}catch(r){return!0}}(e))return g("The provided key is an unsupported type %s. This value must be coerced to a string before before using it here.",function(e){return"function"==typeof Symbol&&Symbol.toStringTag&&e[Symbol.toStringTag]||e.constructor.name||"Object"}(e)),Y(e)}var V,K,X=m.ReactCurrentOwner,H={key:!0,ref:!0,__self:!0,__source:!0},Z={};function G(e,r,n,o,a){var i,s={},c=null,u=null;for(i in void 0!==n&&(B(n),c=""+n),function(e){if(L.call(e,"key")){var r=Object.getOwnPropertyDescriptor(e,"key").get;if(r&&r.isReactWarning)return!1}return void 0!==e.key}(r)&&(B(r.key),c=""+r.key),function(e){if(L.call(e,"ref")){var r=Object.getOwnPropertyDescriptor(e,"ref").get;if(r&&r.isReactWarning)return!1}return void 0!==e.ref}(r)&&(u=r.ref,function(e,r){if("string"==typeof e.ref&&X.current&&r&&X.current.stateNode!==r){var t=_(X.current.type);Z[t]||(g('Component "%s" contains the string ref "%s". Support for string refs will be removed in a future major release. This case cannot be automatically converted to an arrow function. We ask you to manually fix this case by using useRef() or createRef() instead. Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref',_(X.current.type),e.ref),Z[t]=!0)}}(r,a)),r)L.call(r,i)&&!H.hasOwnProperty(i)&&(s[i]=r[i]);if(e&&e.defaultProps){var l=e.defaultProps;for(i in l)void 0===s[i]&&(s[i]=l[i])}if(c||u){var f="function"==typeof e?e.displayName||e.name||"Unknown":e;c&&function(e,r){var t=function(){V||(V=!0,g("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)",r))};t.isReactWarning=!0,Object.defineProperty(e,"key",{get:t,configurable:!0})}(s,f),u&&function(e,r){var t=function(){K||(K=!0,g("%s: `ref` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)",r))};t.isReactWarning=!0,Object.defineProperty(e,"ref",{get:t,configurable:!0})}(s,f)}return function(e,r,n,o,a,i,s){var c={$$typeof:t,type:e,key:r,ref:n,props:s,_owner:i,_store:{}};return Object.defineProperty(c._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:!1}),Object.defineProperty(c,"_self",{configurable:!1,enumerable:!1,writable:!1,value:o}),Object.defineProperty(c,"_source",{configurable:!1,enumerable:!1,writable:!1,value:a}),Object.freeze&&(Object.freeze(c.props),Object.freeze(c)),c}(e,c,u,a,o,X.current,s)}var Q=m.ReactCurrentOwner,ee=m.ReactDebugCurrentFrame;function re(e){if(e){var r=e._owner,t=I(e.type,e._source,r?r.type:null);ee.setExtraStackFrame(t)}else ee.setExtraStackFrame(null)}var te=!1;function ne(e){return"object"==typeof e&&null!==e&&e.$$typeof===t}function oe(){if(Q.current){var e=_(Q.current.type);if(e)return"\n\nCheck the render method of `"+e+"`."}return""}var ae={};function ie(e,r){if(e._store&&!e._store.validated&&null==e.key){e._store.validated=!0;var t=function(e){var r=oe();if(!r){var t="string"==typeof e?e:e.displayName||e.name;t&&(r="\n\nCheck the top-level render call using <"+t+">.")}return r}(r);if(!ae[t]){ae[t]=!0;var n="";e&&e._owner&&e._owner!==Q.current&&(n=" It was passed a child from "+_(e._owner.type)+"."),re(e),g('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.',t,n),re(null)}}}function se(e,r){if("object"==typeof e)if(M(e))for(var t=0;t<e.length;t++){var n=e[t];ne(n)&&ie(n,r)}else if(ne(e))e._store&&(e._store.validated=!0);else if(e){var o=function(e){if(null===e||"object"!=typeof e)return null;var r=v&&e[v]||e["@@iterator"];return"function"==typeof r?r:null}(e);if("function"==typeof o&&o!==e.entries)for(var a,i=o.call(e);!(a=i.next()).done;)ne(a.value)&&ie(a.value,r)}}function ce(e){var r=e.type;if(null!=r&&"string"!=typeof r){var t;if("function"==typeof r)t=r.propTypes;else{if("object"!=typeof r||r.$$typeof!==l&&r.$$typeof!==y)return;t=r.propTypes}if(t){var n=_(r);!function(e,r,t,n,o){var a=Function.call.bind(L);for(var i in e)if(a(e,i)){var s=void 0;try{if("function"!=typeof e[i]){var c=Error((n||"React class")+": "+t+" type `"+i+"` is invalid; it must be a function, usually from the `prop-types` package, but received `"+typeof e[i]+"`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.");throw c.name="Invariant Violation",c}s=e[i](r,i,n,t,null,"SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED")}catch(u){s=u}!s||s instanceof Error||(z(o),g("%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).",n||"React class",t,i,typeof s),z(null)),s instanceof Error&&!(s.message in U)&&(U[s.message]=!0,z(o),g("Failed %s type: %s",t,s.message),z(null))}}(t,e.props,"prop",n,e)}else void 0===r.PropTypes||te||(te=!0,g("Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?",_(r)||"Unknown"));"function"!=typeof r.getDefaultProps||r.getDefaultProps.isReactClassApproved||g("getDefaultProps is only used on classic React.createClass definitions. Use a static property named `defaultProps` instead.")}}var ue={};function le(e,r,n,s,v,m){var w=function(e){return"string"==typeof e||"function"==typeof e||e===o||e===i||e===a||e===f||e===p||e===h||"object"==typeof e&&null!==e&&(e.$$typeof===d||e.$$typeof===y||e.$$typeof===c||e.$$typeof===u||e.$$typeof===l||e.$$typeof===b||void 0!==e.getModuleId)}(e);if(!w){var k="";(void 0===e||"object"==typeof e&&null!==e&&0===Object.keys(e).length)&&(k+=" You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.");var S,j=function(e){return void 0!==e?"\n\nCheck your code at "+e.fileName.replace(/^.*[\\\/]/,"")+":"+e.lineNumber+".":""}(v);k+=j||oe(),null===e?S="null":M(e)?S="array":void 0!==e&&e.$$typeof===t?(S="<"+(_(e.type)||"Unknown")+" />",k=" Did you accidentally export a JSX literal instead of a component?"):S=typeof e,g("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s",S,k)}var O=G(e,r,n,v,m);if(null==O)return O;if(w){var R=r.children;if(void 0!==R)if(s)if(M(R)){for(var E=0;E<R.length;E++)se(R[E],e);Object.freeze&&Object.freeze(R)}else g("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else se(R,e)}if(L.call(r,"key")){var P=_(e),x=Object.keys(r).filter(function(e){return"key"!==e}),q=x.length>0?"{key: someKey, "+x.join(": ..., ")+": ...}":"{key: someKey}";ue[P+q]||(g('A props object containing a "key" prop is being spread into JSX:\n let props = %s;\n <%s {...props} />\nReact keys must be passed directly to JSX without using spread:\n let props = %s;\n <%s key={someKey} {...props} />',q,P,x.length>0?"{"+x.join(": ..., ")+": ...}":"{}",P),ue[P+q]=!0)}return e===o?function(e){for(var r=Object.keys(e.props),t=0;t<r.length;t++){var n=r[t];if("children"!==n&&"key"!==n){re(e),g("Invalid prop `%s` supplied to `React.Fragment`. React.Fragment can only have `key` and `children` props.",n),re(null);break}}null!==e.ref&&(re(e),g("Invalid attribute `ref` supplied to `React.Fragment`."),re(null))}(O):ce(O),O}var fe=function(e,r,t){return le(e,r,t,!1)},pe=function(e,r,t){return le(e,r,t,!0)};e.Fragment=o,e.jsx=fe,e.jsxs=pe}()}),h=/* @__PURE__ */i((e,r)=>{"production"===process.env.NODE_ENV?r.exports=y():r.exports=d()})();function v(e,r,t={}){let n=JSON.parse(JSON.stringify(l(e))),o=JSON.parse(JSON.stringify(l(r)));if(o.path=o.path.replace(/\/$/,"")||"/",n.path=n.path.replace(/\/$/,"")||"/",n.path.endsWith("*")){n.path=n.path.replace(/\/?\*/,"")||"/";const e=n.path.split("/").filter(Boolean).length;o.path="/"+o.path.slice(1).split("/").slice(0,e).join("/")}if(Object.entries(n.query).length)for(const s in n.query){if(!(s in o.query))return!1;if(n.query[s]&&n.query[s]!==o.query[s])return!1}if(!n.path.includes(":"))return n.path===o.path&&t;if(n.path.split("/").length!==o.path.split("/").length)return!1;const a={},i=n.path.split("/").every((e,r)=>{const n=o.path.split("/")[r];if(e.startsWith(":")){let r=e.slice(1),o="string";r.includes("<")&&([r,o]=r.split("<"),o=o.slice(0,-1));const i=decodeURIComponent(n);return a[r]="number"===o?Number(i):"date"===o?new Date(/^\d+$/.test(i)?Number(i):i):"boolean"===o?"true"===i:i,t}return n===e});return i&&Object.assign(t,a),i&&t}var m=()=>{const e=t(c);if(!e)throw new Error("Wrap your App with <Router>");return e},g=({path:e="*",scrollUp:r,component:t,render:n,children:o})=>{const a=m(),i=v(e,a[0]);if(!i)return null;if(r&&window.scrollTo(0,0),t)o=/* @__PURE__ */ /* @__PURE__ */(0,h.jsx)(t,{...i});else if(n)o=n(i);else if(!o)throw new Error("Route needs prop `component`, `render` or `children`");/* @__PURE__ */ /* @__PURE__ */
|
|
2
|
-
return(
|
|
1
|
+
import{createContext as t,useCallback as e,useContext as r,useEffect as n,useRef as o,useState as s}from"react";import{jsx as i}from"react/jsx-runtime";var a=t(void 0),u=t=>t.length>1?t:t[0],c=t=>{if("string"!=typeof t)return t;const e={query:{}},r=new URL(t,"http://localhost:3000/");e.path=(r.pathname.replace(/\/$/,"")||"/").replaceAll("%3C","<").replaceAll("%3E",">"),e.query={};for(const[n]of r.searchParams)e.query[n]=u(r.searchParams.getAll(n));return r.hash&&(e.hash=r.hash.replace(/^#/,"")),e},l=t=>{if("string"==typeof t)return t;const{path:e,query:r={},hash:n}=t||{};let o=e||"/";const s=new URLSearchParams(Object.entries(r).map(([t,e])=>(Array.isArray(e)?e:[e]).map(e=>[t,e])).flat().filter(([t,e])=>e)).toString();return s&&(o+="?"+s),n&&(o+="#"+n),o},p=()=>"undefined"==typeof window;function h(t,e,r={}){let n=JSON.parse(JSON.stringify(c(t))),o=JSON.parse(JSON.stringify(c(e)));if(o.path=o.path.replace(/\/$/,"")||"/",n.path=n.path.replace(/\/$/,"")||"/",n.path.endsWith("*")){n.path=n.path.replace(/\/?\*/,"")||"/";const t=n.path.split("/").filter(Boolean).length;o.path="/"+o.path.slice(1).split("/").slice(0,t).join("/")}if(Object.entries(n.query).length)for(const a in n.query){if(!(a in o.query))return!1;if(n.query[a]&&n.query[a]!==o.query[a])return!1}if(!n.path.includes(":"))return n.path===o.path&&r;if(n.path.split("/").length!==o.path.split("/").length)return!1;const s={},i=n.path.split("/").every((t,e)=>{const n=o.path.split("/")[e];if(t.startsWith(":")){let e=t.slice(1),o="string";e.includes("<")&&([e,o]=e.split("<"),o=o.slice(0,-1));const i=decodeURIComponent(n);return s[e]="number"===o?Number(i):"date"===o?new Date(/^\d+$/.test(i)?Number(i):i):"boolean"===o?"true"===i:i,r}return n===t});return i&&Object.assign(r,s),i&&r}var f=()=>{const t=r(a);if(!t)throw new Error("Wrap your App with <Router>");return t},y=({path:t="*",scrollUp:e,component:r,render:n,children:o})=>{const s=f(),u=h(t,s[0]);if(!u)return null;if(e&&window.scrollTo(0,0),r)o=/* @__PURE__ */i(r,{...u});else if(n)o=n(u);else if(!o)throw new Error("Route needs prop `component`, `render` or `children`");/* @__PURE__ */
|
|
2
|
+
return i(a.Provider,{value:[{...s[0],params:u},s[1]],children:o})},d=({redirect:t,children:e})=>{const[r,o]=f(),s=(t=>(Array.isArray(t)?t:[t]).filter(t=>null!=t&&"object"==typeof t&&"props"in t))(e).find(t=>h(t.props.path||"*",r))||null;return n(()=>{t&&(s||o(l("function"==typeof t?t(r):t)))},[t,s]),s},w=()=>{const[t,r]=f(),n=e((t,e)=>{r(e=>{const r="function"==typeof t?t(e.path):t;return{...e,path:"string"==typeof r?r:"/"}},e)},[]);return[t.path,n]},m=t=>l({query:t});function q(t){return t?(t=>{const[r,n]=f(),o=e((e,r)=>{n(r=>{const n=r.query[t],o="function"==typeof e?e(n):e;if(o===n)return r;if(o)return{...r,query:{...r.query,[t]:o}};{const{[t]:e,...n}=r.query;return{...r,query:n}}},r)},[]);return[r.query[t],o]})(t):(()=>{const[t,r]=f(),n=e((t,e)=>{r(e=>{let r="function"==typeof t?t(e.query):t;"string"==typeof r&&(r=c("/?"+r.replace(/^\?/,"")).query);const n=c(m(r)).query;return m(n)===m(e.query)?e:{...e,query:n}},e)},[]);return[t.query,n]})()}var g=()=>{const[t,r]=f(),n=e((t,e)=>{r(e=>{const r="function"==typeof t?t(e.hash):t,n="string"!=typeof r?"":r.replace(/^#/,"");return{...e,hash:n}},e)},[]);return[t.hash,n]};function v(t){const[{params:e}]=r(a);return t?t in e?e[t]:"":e||{}}var A=({scrollUp:t,url:r,children:u})=>{const h=r||(p()?"/":window.location.href),[f,y]=s(()=>c(h)),d=o(f),w=e((e,{mode:r="push"}={})=>{if(!history[r+"State"])throw new Error(`Invalid mode "${r}"`);y(t=>{const r="function"==typeof e?e(t):e;return l(t)===l(r)?t:c(r)});const n=d.current,o="function"==typeof e?e(n):e;if(l(n)!==l(o)){const e=c(o);d.current=e,history[r+"State"]({},null,l(e)),t&&window.scrollTo(0,0)}},[]);return n(()=>{d.current=f},[f]),n(()=>{if(p())return;const t=()=>y(c(window.location.href)),e=t=>{const e=t.target,r=(t=>{if(!t)return null;const e=t.getAttribute("href");if(!e)return null;const r=e.trim();return/^[a-zA-Z][a-zA-Z0-9+\-.]*:/.test(r)||null!==t.getAttribute("target")?null:r})(e?.closest("a")??null);if(!r)return!1;t.preventDefault();const[n,o]=r.split("#");n?w(r):o&&(window.location.hash="#"+o)};return window.addEventListener("popstate",t),document.addEventListener("click",e),()=>{window.removeEventListener("popstate",t),document.removeEventListener("click",e)}},[w]),/* @__PURE__ */i(a.Provider,{value:[f,w],children:u})};export{a as Context,y as Route,d as Switch,A as default,g as useHash,v as useParams,w as usePath,q as useQuery,f as useUrl};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "crossroad",
|
|
3
|
-
"version": "3.0.
|
|
3
|
+
"version": "3.0.11",
|
|
4
4
|
"description": "A React library to handle navigation easily in your WebApp",
|
|
5
5
|
"homepage": "https://crossroad.page/",
|
|
6
6
|
"repository": "github:franciscop/crossroad",
|
|
@@ -14,15 +14,6 @@
|
|
|
14
14
|
"javascript",
|
|
15
15
|
"hooks"
|
|
16
16
|
],
|
|
17
|
-
"documentation": {
|
|
18
|
-
"home": "assets/home.html",
|
|
19
|
-
"menu": {
|
|
20
|
-
"Documentation": "/documentation",
|
|
21
|
-
"Donate": "https://www.paypal.me/franciscopresencia/19",
|
|
22
|
-
"Author": "https://francisco.io/",
|
|
23
|
-
"Github": "https://github.com/franciscop/crossroad"
|
|
24
|
-
}
|
|
25
|
-
},
|
|
26
17
|
"scripts": {
|
|
27
18
|
"build": "npm run build:library && npm run build:types && npm run build:prettier",
|
|
28
19
|
"build:library": "vite build && mv dist/index.min.js . && rm -rf dist",
|
|
@@ -37,7 +28,6 @@
|
|
|
37
28
|
"type": "module",
|
|
38
29
|
"types": "index.d.ts",
|
|
39
30
|
"files": [
|
|
40
|
-
"index.min.js",
|
|
41
31
|
"index.d.ts"
|
|
42
32
|
],
|
|
43
33
|
"devDependencies": {
|
|
@@ -51,14 +41,22 @@
|
|
|
51
41
|
"prettier": "^3.8.1",
|
|
52
42
|
"react": "^18.3.1",
|
|
53
43
|
"react-dom": "^18.3.1",
|
|
54
|
-
"react-test": "^0.24.
|
|
44
|
+
"react-test": "^0.24.3",
|
|
55
45
|
"terser": "^5.46.1",
|
|
56
46
|
"typescript": "^6.0.2",
|
|
57
47
|
"vite": "^8.0.3",
|
|
58
|
-
"vite-plugin-dts": "^4.5.4",
|
|
59
48
|
"vitest": "^4.1.2"
|
|
60
49
|
},
|
|
61
50
|
"peerDependencies": {
|
|
62
51
|
"react": ">=18.0.0"
|
|
52
|
+
},
|
|
53
|
+
"documentation": {
|
|
54
|
+
"home": "assets/home.html",
|
|
55
|
+
"menu": {
|
|
56
|
+
"Documentation": "/documentation",
|
|
57
|
+
"Donate": "https://www.paypal.me/franciscopresencia/19",
|
|
58
|
+
"Author": "https://francisco.io/",
|
|
59
|
+
"Github": "https://github.com/franciscop/crossroad"
|
|
60
|
+
}
|
|
63
61
|
}
|
|
64
62
|
}
|
package/readme.md
CHANGED
|
@@ -6,7 +6,7 @@ A React library to handle navigation in your WebApp. Built with simple component
|
|
|
6
6
|
- Very useful hooks like [`useUrl`](#useurl), [`useQuery`](#usequery), etc. Follow [the rules of hooks](https://reactjs.org/docs/hooks-rules.html).
|
|
7
7
|
- Links are plain `<a>` instead of custom components. [Read more](#a).
|
|
8
8
|
- The `<Route>` path is `exact` by default and can match query parameters.
|
|
9
|
-
- It's [just ~1.
|
|
9
|
+
- It's [just ~1.9kb](https://bundlephobia.com/package/crossroad) (min+gzip) instead of the 17kb of React Router(+Dom).
|
|
10
10
|
- Add `scrollUp` to `<Router>` o `<Route>` to automatically scroll up on a route change.
|
|
11
11
|
|
|
12
12
|
[**🔗 Demo on CodeSandbox**](https://codesandbox.io/s/recursing-wozniak-uftyo?file=/src/App.js)
|
|
@@ -250,7 +250,8 @@ const UserList = () => <div>List here</div>;
|
|
|
250
250
|
// <div>List here</div>
|
|
251
251
|
```
|
|
252
252
|
|
|
253
|
-
>
|
|
253
|
+
> [!WARNING]
|
|
254
|
+
> The parameter is passed straight to the component instead of wrapped like in React Router, see the examples above.
|
|
254
255
|
|
|
255
256
|
The path can also include a wildcard `*`, in which case it will perform a partial match of everything before itself. It can only be at the end of the path:
|
|
256
257
|
|
|
@@ -265,7 +266,9 @@ The path can also include a wildcard `*`, in which case it will perform a partia
|
|
|
265
266
|
<Route path="/user/:id/*" component={User} />
|
|
266
267
|
```
|
|
267
268
|
|
|
268
|
-
|
|
269
|
+
|
|
270
|
+
> [!TIP]
|
|
271
|
+
> In Crossroad the paths are exact by default, and with the wildcard you can make them partial matches. So the wildcard is the opposite of adding `exact` to React Router.
|
|
269
272
|
|
|
270
273
|
It can also match query parameters:
|
|
271
274
|
|
|
@@ -347,9 +350,7 @@ Some examples:
|
|
|
347
350
|
|
|
348
351
|
### `useUrl()`
|
|
349
352
|
|
|
350
|
-
|
|
351
|
-
|
|
352
|
-
Read and set the full URL:
|
|
353
|
+
Read and set the full URL (path + search query + hash):
|
|
353
354
|
|
|
354
355
|
```js
|
|
355
356
|
import { useUrl } from "crossroad";
|
|
@@ -485,7 +486,7 @@ const Login = () => {
|
|
|
485
486
|
|
|
486
487
|
The path is always a string equivalent to `window.location.pathname`. Why not use `window.location.pathname` then? Because usePath() is a hook that will trigger a re-render when the path changes!
|
|
487
488
|
|
|
488
|
-
|
|
489
|
+
`setPath` _only_ modifies the path(name) and keeps the search query and hash the same, so if you want to modify the full URL you should instead utilize `useUrl()` and `setUrl('/welcome')`
|
|
489
490
|
|
|
490
491
|
#### Setter
|
|
491
492
|
|
|
@@ -496,7 +497,7 @@ setPath("/newpath");
|
|
|
496
497
|
setPath((oldPath) => "/newpath");
|
|
497
498
|
```
|
|
498
499
|
|
|
499
|
-
The function `setPath` is _always_
|
|
500
|
+
The function `setPath` is _always_ stable, so it doesn't matter whether you put it as a dependency or not. However the `path` can be updated, so you might want to put that:
|
|
500
501
|
|
|
501
502
|
```js
|
|
502
503
|
const [path, setPath] = usePath();
|
|
@@ -922,7 +923,8 @@ In this case the order matters, because the generic NotFound will be matched wit
|
|
|
922
923
|
|
|
923
924
|
### Github hosting
|
|
924
925
|
|
|
925
|
-
>
|
|
926
|
+
> [!WARNING]
|
|
927
|
+
> This is a bad idea for SEO, but if that doesn't matter much for you go ahead and host your webapp in Github Pages
|
|
926
928
|
|
|
927
929
|
Github pages is a bit particular in that as of this writing it does not allow for a generic redirect like most other static website servers, so we need to do a workaround with the `404.html` page.
|
|
928
930
|
|