quix-ui 1.3.0 → 1.3.2

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 (2) hide show
  1. package/dist/index.js +19 -1956
  2. package/package.json +2 -2
package/dist/index.js CHANGED
@@ -1,5 +1,6 @@
1
1
  import { jsx as jsx$1, jsxs } from 'react/jsx-runtime';
2
- import * as React3 from 'react';
2
+ import { useNavigate, NavLink, Link } from 'react-router-dom';
3
+ import * as React2 from 'react';
3
4
  import { forwardRef, useContext, useState, useCallback, useEffect } from 'react';
4
5
 
5
6
  function _arrayLikeToArray(r, a) {
@@ -219,1929 +220,7 @@ function Buttons(props) {
219
220
  });
220
221
  }
221
222
 
222
- /**
223
- * react-router v7.12.0
224
- *
225
- * Copyright (c) Remix Software Inc.
226
- *
227
- * This source code is licensed under the MIT license found in the
228
- * LICENSE.md file in the root directory of this source tree.
229
- *
230
- * @license MIT
231
- */
232
- function invariant(value, message) {
233
- if (value === false || value === null || typeof value === "undefined") {
234
- throw new Error(message);
235
- }
236
- }
237
- function warning(cond, message) {
238
- if (!cond) {
239
- if (typeof console !== "undefined") console.warn(message);
240
- try {
241
- throw new Error(message);
242
- } catch (e) {
243
- }
244
- }
245
- }
246
- function createPath({
247
- pathname = "/",
248
- search = "",
249
- hash = ""
250
- }) {
251
- if (search && search !== "?")
252
- pathname += search.charAt(0) === "?" ? search : "?" + search;
253
- if (hash && hash !== "#")
254
- pathname += hash.charAt(0) === "#" ? hash : "#" + hash;
255
- return pathname;
256
- }
257
- function parsePath(path) {
258
- let parsedPath = {};
259
- if (path) {
260
- let hashIndex = path.indexOf("#");
261
- if (hashIndex >= 0) {
262
- parsedPath.hash = path.substring(hashIndex);
263
- path = path.substring(0, hashIndex);
264
- }
265
- let searchIndex = path.indexOf("?");
266
- if (searchIndex >= 0) {
267
- parsedPath.search = path.substring(searchIndex);
268
- path = path.substring(0, searchIndex);
269
- }
270
- if (path) {
271
- parsedPath.pathname = path;
272
- }
273
- }
274
- return parsedPath;
275
- }
276
- function matchRoutes(routes, locationArg, basename = "/") {
277
- return matchRoutesImpl(routes, locationArg, basename, false);
278
- }
279
- function matchRoutesImpl(routes, locationArg, basename, allowPartial) {
280
- let location = typeof locationArg === "string" ? parsePath(locationArg) : locationArg;
281
- let pathname = stripBasename(location.pathname || "/", basename);
282
- if (pathname == null) {
283
- return null;
284
- }
285
- let branches = flattenRoutes(routes);
286
- rankRouteBranches(branches);
287
- let matches = null;
288
- for (let i = 0; matches == null && i < branches.length; ++i) {
289
- let decoded = decodePath(pathname);
290
- matches = matchRouteBranch(
291
- branches[i],
292
- decoded,
293
- allowPartial
294
- );
295
- }
296
- return matches;
297
- }
298
- function flattenRoutes(routes, branches = [], parentsMeta = [], parentPath = "", _hasParentOptionalSegments = false) {
299
- let flattenRoute = (route, index, hasParentOptionalSegments = _hasParentOptionalSegments, relativePath) => {
300
- let meta = {
301
- relativePath: relativePath === void 0 ? route.path || "" : relativePath,
302
- caseSensitive: route.caseSensitive === true,
303
- childrenIndex: index,
304
- route
305
- };
306
- if (meta.relativePath.startsWith("/")) {
307
- if (!meta.relativePath.startsWith(parentPath) && hasParentOptionalSegments) {
308
- return;
309
- }
310
- invariant(
311
- meta.relativePath.startsWith(parentPath),
312
- `Absolute route path "${meta.relativePath}" nested under path "${parentPath}" is not valid. An absolute child route path must start with the combined path of all its parent routes.`
313
- );
314
- meta.relativePath = meta.relativePath.slice(parentPath.length);
315
- }
316
- let path = joinPaths([parentPath, meta.relativePath]);
317
- let routesMeta = parentsMeta.concat(meta);
318
- if (route.children && route.children.length > 0) {
319
- invariant(
320
- // Our types know better, but runtime JS may not!
321
- // @ts-expect-error
322
- route.index !== true,
323
- `Index routes must not have child routes. Please remove all child routes from route path "${path}".`
324
- );
325
- flattenRoutes(
326
- route.children,
327
- branches,
328
- routesMeta,
329
- path,
330
- hasParentOptionalSegments
331
- );
332
- }
333
- if (route.path == null && !route.index) {
334
- return;
335
- }
336
- branches.push({
337
- path,
338
- score: computeScore(path, route.index),
339
- routesMeta
340
- });
341
- };
342
- routes.forEach((route, index) => {
343
- if (route.path === "" || !route.path?.includes("?")) {
344
- flattenRoute(route, index);
345
- } else {
346
- for (let exploded of explodeOptionalSegments(route.path)) {
347
- flattenRoute(route, index, true, exploded);
348
- }
349
- }
350
- });
351
- return branches;
352
- }
353
- function explodeOptionalSegments(path) {
354
- let segments = path.split("/");
355
- if (segments.length === 0) return [];
356
- let [first, ...rest] = segments;
357
- let isOptional = first.endsWith("?");
358
- let required = first.replace(/\?$/, "");
359
- if (rest.length === 0) {
360
- return isOptional ? [required, ""] : [required];
361
- }
362
- let restExploded = explodeOptionalSegments(rest.join("/"));
363
- let result = [];
364
- result.push(
365
- ...restExploded.map(
366
- (subpath) => subpath === "" ? required : [required, subpath].join("/")
367
- )
368
- );
369
- if (isOptional) {
370
- result.push(...restExploded);
371
- }
372
- return result.map(
373
- (exploded) => path.startsWith("/") && exploded === "" ? "/" : exploded
374
- );
375
- }
376
- function rankRouteBranches(branches) {
377
- branches.sort(
378
- (a, b) => a.score !== b.score ? b.score - a.score : compareIndexes(
379
- a.routesMeta.map((meta) => meta.childrenIndex),
380
- b.routesMeta.map((meta) => meta.childrenIndex)
381
- )
382
- );
383
- }
384
- var paramRe = /^:[\w-]+$/;
385
- var dynamicSegmentValue = 3;
386
- var indexRouteValue = 2;
387
- var emptySegmentValue = 1;
388
- var staticSegmentValue = 10;
389
- var splatPenalty = -2;
390
- var isSplat = (s) => s === "*";
391
- function computeScore(path, index) {
392
- let segments = path.split("/");
393
- let initialScore = segments.length;
394
- if (segments.some(isSplat)) {
395
- initialScore += splatPenalty;
396
- }
397
- if (index) {
398
- initialScore += indexRouteValue;
399
- }
400
- return segments.filter((s) => !isSplat(s)).reduce(
401
- (score, segment) => score + (paramRe.test(segment) ? dynamicSegmentValue : segment === "" ? emptySegmentValue : staticSegmentValue),
402
- initialScore
403
- );
404
- }
405
- function compareIndexes(a, b) {
406
- let siblings = a.length === b.length && a.slice(0, -1).every((n, i) => n === b[i]);
407
- return siblings ? (
408
- // If two routes are siblings, we should try to match the earlier sibling
409
- // first. This allows people to have fine-grained control over the matching
410
- // behavior by simply putting routes with identical paths in the order they
411
- // want them tried.
412
- a[a.length - 1] - b[b.length - 1]
413
- ) : (
414
- // Otherwise, it doesn't really make sense to rank non-siblings by index,
415
- // so they sort equally.
416
- 0
417
- );
418
- }
419
- function matchRouteBranch(branch, pathname, allowPartial = false) {
420
- let { routesMeta } = branch;
421
- let matchedParams = {};
422
- let matchedPathname = "/";
423
- let matches = [];
424
- for (let i = 0; i < routesMeta.length; ++i) {
425
- let meta = routesMeta[i];
426
- let end = i === routesMeta.length - 1;
427
- let remainingPathname = matchedPathname === "/" ? pathname : pathname.slice(matchedPathname.length) || "/";
428
- let match = matchPath(
429
- { path: meta.relativePath, caseSensitive: meta.caseSensitive, end },
430
- remainingPathname
431
- );
432
- let route = meta.route;
433
- if (!match && end && allowPartial && !routesMeta[routesMeta.length - 1].route.index) {
434
- match = matchPath(
435
- {
436
- path: meta.relativePath,
437
- caseSensitive: meta.caseSensitive,
438
- end: false
439
- },
440
- remainingPathname
441
- );
442
- }
443
- if (!match) {
444
- return null;
445
- }
446
- Object.assign(matchedParams, match.params);
447
- matches.push({
448
- // TODO: Can this as be avoided?
449
- params: matchedParams,
450
- pathname: joinPaths([matchedPathname, match.pathname]),
451
- pathnameBase: normalizePathname(
452
- joinPaths([matchedPathname, match.pathnameBase])
453
- ),
454
- route
455
- });
456
- if (match.pathnameBase !== "/") {
457
- matchedPathname = joinPaths([matchedPathname, match.pathnameBase]);
458
- }
459
- }
460
- return matches;
461
- }
462
- function matchPath(pattern, pathname) {
463
- if (typeof pattern === "string") {
464
- pattern = { path: pattern, caseSensitive: false, end: true };
465
- }
466
- let [matcher, compiledParams] = compilePath(
467
- pattern.path,
468
- pattern.caseSensitive,
469
- pattern.end
470
- );
471
- let match = pathname.match(matcher);
472
- if (!match) return null;
473
- let matchedPathname = match[0];
474
- let pathnameBase = matchedPathname.replace(/(.)\/+$/, "$1");
475
- let captureGroups = match.slice(1);
476
- let params = compiledParams.reduce(
477
- (memo2, { paramName, isOptional }, index) => {
478
- if (paramName === "*") {
479
- let splatValue = captureGroups[index] || "";
480
- pathnameBase = matchedPathname.slice(0, matchedPathname.length - splatValue.length).replace(/(.)\/+$/, "$1");
481
- }
482
- const value = captureGroups[index];
483
- if (isOptional && !value) {
484
- memo2[paramName] = void 0;
485
- } else {
486
- memo2[paramName] = (value || "").replace(/%2F/g, "/");
487
- }
488
- return memo2;
489
- },
490
- {}
491
- );
492
- return {
493
- params,
494
- pathname: matchedPathname,
495
- pathnameBase,
496
- pattern
497
- };
498
- }
499
- function compilePath(path, caseSensitive = false, end = true) {
500
- warning(
501
- path === "*" || !path.endsWith("*") || path.endsWith("/*"),
502
- `Route path "${path}" will be treated as if it were "${path.replace(/\*$/, "/*")}" because the \`*\` character must always follow a \`/\` in the pattern. To get rid of this warning, please change the route path to "${path.replace(/\*$/, "/*")}".`
503
- );
504
- let params = [];
505
- let regexpSource = "^" + path.replace(/\/*\*?$/, "").replace(/^\/*/, "/").replace(/[\\.*+^${}|()[\]]/g, "\\$&").replace(
506
- /\/:([\w-]+)(\?)?/g,
507
- (_, paramName, isOptional) => {
508
- params.push({ paramName, isOptional: isOptional != null });
509
- return isOptional ? "/?([^\\/]+)?" : "/([^\\/]+)";
510
- }
511
- ).replace(/\/([\w-]+)\?(\/|$)/g, "(/$1)?$2");
512
- if (path.endsWith("*")) {
513
- params.push({ paramName: "*" });
514
- regexpSource += path === "*" || path === "/*" ? "(.*)$" : "(?:\\/(.+)|\\/*)$";
515
- } else if (end) {
516
- regexpSource += "\\/*$";
517
- } else if (path !== "" && path !== "/") {
518
- regexpSource += "(?:(?=\\/|$))";
519
- } else ;
520
- let matcher = new RegExp(regexpSource, caseSensitive ? void 0 : "i");
521
- return [matcher, params];
522
- }
523
- function decodePath(value) {
524
- try {
525
- return value.split("/").map((v) => decodeURIComponent(v).replace(/\//g, "%2F")).join("/");
526
- } catch (error) {
527
- warning(
528
- false,
529
- `The URL path "${value}" could not be decoded because it is a malformed URL segment. This is probably due to a bad percent encoding (${error}).`
530
- );
531
- return value;
532
- }
533
- }
534
- function stripBasename(pathname, basename) {
535
- if (basename === "/") return pathname;
536
- if (!pathname.toLowerCase().startsWith(basename.toLowerCase())) {
537
- return null;
538
- }
539
- let startIndex = basename.endsWith("/") ? basename.length - 1 : basename.length;
540
- let nextChar = pathname.charAt(startIndex);
541
- if (nextChar && nextChar !== "/") {
542
- return null;
543
- }
544
- return pathname.slice(startIndex) || "/";
545
- }
546
- var ABSOLUTE_URL_REGEX = /^(?:[a-z][a-z0-9+.-]*:|\/\/)/i;
547
- var isAbsoluteUrl = (url) => ABSOLUTE_URL_REGEX.test(url);
548
- function resolvePath(to, fromPathname = "/") {
549
- let {
550
- pathname: toPathname,
551
- search = "",
552
- hash = ""
553
- } = typeof to === "string" ? parsePath(to) : to;
554
- let pathname;
555
- if (toPathname) {
556
- if (isAbsoluteUrl(toPathname)) {
557
- pathname = toPathname;
558
- } else {
559
- if (toPathname.includes("//")) {
560
- let oldPathname = toPathname;
561
- toPathname = toPathname.replace(/\/\/+/g, "/");
562
- warning(
563
- false,
564
- `Pathnames cannot have embedded double slashes - normalizing ${oldPathname} -> ${toPathname}`
565
- );
566
- }
567
- if (toPathname.startsWith("/")) {
568
- pathname = resolvePathname(toPathname.substring(1), "/");
569
- } else {
570
- pathname = resolvePathname(toPathname, fromPathname);
571
- }
572
- }
573
- } else {
574
- pathname = fromPathname;
575
- }
576
- return {
577
- pathname,
578
- search: normalizeSearch(search),
579
- hash: normalizeHash(hash)
580
- };
581
- }
582
- function resolvePathname(relativePath, fromPathname) {
583
- let segments = fromPathname.replace(/\/+$/, "").split("/");
584
- let relativeSegments = relativePath.split("/");
585
- relativeSegments.forEach((segment) => {
586
- if (segment === "..") {
587
- if (segments.length > 1) segments.pop();
588
- } else if (segment !== ".") {
589
- segments.push(segment);
590
- }
591
- });
592
- return segments.length > 1 ? segments.join("/") : "/";
593
- }
594
- function getInvalidPathError(char, field, dest, path) {
595
- return `Cannot include a '${char}' character in a manually specified \`to.${field}\` field [${JSON.stringify(
596
- path
597
- )}]. Please separate it out to the \`to.${dest}\` field. Alternatively you may provide the full path as a string in <Link to="..."> and the router will parse it for you.`;
598
- }
599
- function getPathContributingMatches(matches) {
600
- return matches.filter(
601
- (match, index) => index === 0 || match.route.path && match.route.path.length > 0
602
- );
603
- }
604
- function getResolveToMatches(matches) {
605
- let pathMatches = getPathContributingMatches(matches);
606
- return pathMatches.map(
607
- (match, idx) => idx === pathMatches.length - 1 ? match.pathname : match.pathnameBase
608
- );
609
- }
610
- function resolveTo(toArg, routePathnames, locationPathname, isPathRelative = false) {
611
- let to;
612
- if (typeof toArg === "string") {
613
- to = parsePath(toArg);
614
- } else {
615
- to = { ...toArg };
616
- invariant(
617
- !to.pathname || !to.pathname.includes("?"),
618
- getInvalidPathError("?", "pathname", "search", to)
619
- );
620
- invariant(
621
- !to.pathname || !to.pathname.includes("#"),
622
- getInvalidPathError("#", "pathname", "hash", to)
623
- );
624
- invariant(
625
- !to.search || !to.search.includes("#"),
626
- getInvalidPathError("#", "search", "hash", to)
627
- );
628
- }
629
- let isEmptyPath = toArg === "" || to.pathname === "";
630
- let toPathname = isEmptyPath ? "/" : to.pathname;
631
- let from;
632
- if (toPathname == null) {
633
- from = locationPathname;
634
- } else {
635
- let routePathnameIndex = routePathnames.length - 1;
636
- if (!isPathRelative && toPathname.startsWith("..")) {
637
- let toSegments = toPathname.split("/");
638
- while (toSegments[0] === "..") {
639
- toSegments.shift();
640
- routePathnameIndex -= 1;
641
- }
642
- to.pathname = toSegments.join("/");
643
- }
644
- from = routePathnameIndex >= 0 ? routePathnames[routePathnameIndex] : "/";
645
- }
646
- let path = resolvePath(to, from);
647
- let hasExplicitTrailingSlash = toPathname && toPathname !== "/" && toPathname.endsWith("/");
648
- let hasCurrentTrailingSlash = (isEmptyPath || toPathname === ".") && locationPathname.endsWith("/");
649
- if (!path.pathname.endsWith("/") && (hasExplicitTrailingSlash || hasCurrentTrailingSlash)) {
650
- path.pathname += "/";
651
- }
652
- return path;
653
- }
654
- var joinPaths = (paths) => paths.join("/").replace(/\/\/+/g, "/");
655
- var normalizePathname = (pathname) => pathname.replace(/\/+$/, "").replace(/^\/*/, "/");
656
- var normalizeSearch = (search) => !search || search === "?" ? "" : search.startsWith("?") ? search : "?" + search;
657
- var normalizeHash = (hash) => !hash || hash === "#" ? "" : hash.startsWith("#") ? hash : "#" + hash;
658
- var ErrorResponseImpl = class {
659
- constructor(status, statusText, data2, internal = false) {
660
- this.status = status;
661
- this.statusText = statusText || "";
662
- this.internal = internal;
663
- if (data2 instanceof Error) {
664
- this.data = data2.toString();
665
- this.error = data2;
666
- } else {
667
- this.data = data2;
668
- }
669
- }
670
- };
671
- function isRouteErrorResponse(error) {
672
- return error != null && typeof error.status === "number" && typeof error.statusText === "string" && typeof error.internal === "boolean" && "data" in error;
673
- }
674
- function getRoutePattern(matches) {
675
- return matches.map((m) => m.route.path).filter(Boolean).join("/").replace(/\/\/*/g, "/") || "/";
676
- }
677
- var isBrowser$1 = typeof window !== "undefined" && typeof window.document !== "undefined" && typeof window.document.createElement !== "undefined";
678
- function parseToInfo(_to, basename) {
679
- let to = _to;
680
- if (typeof to !== "string" || !ABSOLUTE_URL_REGEX.test(to)) {
681
- return {
682
- absoluteURL: void 0,
683
- isExternal: false,
684
- to
685
- };
686
- }
687
- let absoluteURL = to;
688
- let isExternal = false;
689
- if (isBrowser$1) {
690
- try {
691
- let currentUrl = new URL(window.location.href);
692
- let targetUrl = to.startsWith("//") ? new URL(currentUrl.protocol + to) : new URL(to);
693
- let path = stripBasename(targetUrl.pathname, basename);
694
- if (targetUrl.origin === currentUrl.origin && path != null) {
695
- to = path + targetUrl.search + targetUrl.hash;
696
- } else {
697
- isExternal = true;
698
- }
699
- } catch (e) {
700
- warning(
701
- false,
702
- `<Link to="${to}"> contains an invalid URL which will probably break when clicked - please update to a valid URL path.`
703
- );
704
- }
705
- }
706
- return {
707
- absoluteURL,
708
- isExternal,
709
- to
710
- };
711
- }
712
- Object.getOwnPropertyNames(Object.prototype).sort().join("\0");
713
-
714
- // lib/router/router.ts
715
- var validMutationMethodsArr = [
716
- "POST",
717
- "PUT",
718
- "PATCH",
719
- "DELETE"
720
- ];
721
- new Set(
722
- validMutationMethodsArr
723
- );
724
- var validRequestMethodsArr = [
725
- "GET",
726
- ...validMutationMethodsArr
727
- ];
728
- new Set(validRequestMethodsArr);
729
- var DataRouterContext = React3.createContext(null);
730
- DataRouterContext.displayName = "DataRouter";
731
- var DataRouterStateContext = React3.createContext(null);
732
- DataRouterStateContext.displayName = "DataRouterState";
733
- var RSCRouterContext = React3.createContext(false);
734
- var ViewTransitionContext = React3.createContext({
735
- isTransitioning: false
736
- });
737
- ViewTransitionContext.displayName = "ViewTransition";
738
- var FetchersContext = React3.createContext(
739
- /* @__PURE__ */ new Map()
740
- );
741
- FetchersContext.displayName = "Fetchers";
742
- var AwaitContext = React3.createContext(null);
743
- AwaitContext.displayName = "Await";
744
- var NavigationContext = React3.createContext(
745
- null
746
- );
747
- NavigationContext.displayName = "Navigation";
748
- var LocationContext = React3.createContext(
749
- null
750
- );
751
- LocationContext.displayName = "Location";
752
- var RouteContext = React3.createContext({
753
- outlet: null,
754
- matches: [],
755
- isDataRoute: false
756
- });
757
- RouteContext.displayName = "Route";
758
- var RouteErrorContext = React3.createContext(null);
759
- RouteErrorContext.displayName = "RouteError";
760
-
761
- // lib/errors.ts
762
- var ERROR_DIGEST_BASE = "REACT_ROUTER_ERROR";
763
- var ERROR_DIGEST_REDIRECT = "REDIRECT";
764
- var ERROR_DIGEST_ROUTE_ERROR_RESPONSE = "ROUTE_ERROR_RESPONSE";
765
- function decodeRedirectErrorDigest(digest) {
766
- if (digest.startsWith(`${ERROR_DIGEST_BASE}:${ERROR_DIGEST_REDIRECT}:{`)) {
767
- try {
768
- let parsed = JSON.parse(digest.slice(28));
769
- if (typeof parsed === "object" && parsed && typeof parsed.status === "number" && typeof parsed.statusText === "string" && typeof parsed.location === "string" && typeof parsed.reloadDocument === "boolean" && typeof parsed.replace === "boolean") {
770
- return parsed;
771
- }
772
- } catch {
773
- }
774
- }
775
- }
776
- function decodeRouteErrorResponseDigest(digest) {
777
- if (digest.startsWith(
778
- `${ERROR_DIGEST_BASE}:${ERROR_DIGEST_ROUTE_ERROR_RESPONSE}:{`
779
- )) {
780
- try {
781
- let parsed = JSON.parse(digest.slice(40));
782
- if (typeof parsed === "object" && parsed && typeof parsed.status === "number" && typeof parsed.statusText === "string") {
783
- return new ErrorResponseImpl(
784
- parsed.status,
785
- parsed.statusText,
786
- parsed.data
787
- );
788
- }
789
- } catch {
790
- }
791
- }
792
- }
793
-
794
- // lib/hooks.tsx
795
- function useHref(to, { relative } = {}) {
796
- invariant(
797
- useInRouterContext(),
798
- // TODO: This error is probably because they somehow have 2 versions of the
799
- // router loaded. We can help them understand how to avoid that.
800
- `useHref() may be used only in the context of a <Router> component.`
801
- );
802
- let { basename, navigator } = React3.useContext(NavigationContext);
803
- let { hash, pathname, search } = useResolvedPath(to, { relative });
804
- let joinedPathname = pathname;
805
- if (basename !== "/") {
806
- joinedPathname = pathname === "/" ? basename : joinPaths([basename, pathname]);
807
- }
808
- return navigator.createHref({ pathname: joinedPathname, search, hash });
809
- }
810
- function useInRouterContext() {
811
- return React3.useContext(LocationContext) != null;
812
- }
813
- function useLocation() {
814
- invariant(
815
- useInRouterContext(),
816
- // TODO: This error is probably because they somehow have 2 versions of the
817
- // router loaded. We can help them understand how to avoid that.
818
- `useLocation() may be used only in the context of a <Router> component.`
819
- );
820
- return React3.useContext(LocationContext).location;
821
- }
822
- var navigateEffectWarning = `You should call navigate() in a React.useEffect(), not when your component is first rendered.`;
823
- function useIsomorphicLayoutEffect(cb) {
824
- let isStatic = React3.useContext(NavigationContext).static;
825
- if (!isStatic) {
826
- React3.useLayoutEffect(cb);
827
- }
828
- }
829
- function useNavigate() {
830
- let { isDataRoute } = React3.useContext(RouteContext);
831
- return isDataRoute ? useNavigateStable() : useNavigateUnstable();
832
- }
833
- function useNavigateUnstable() {
834
- invariant(
835
- useInRouterContext(),
836
- // TODO: This error is probably because they somehow have 2 versions of the
837
- // router loaded. We can help them understand how to avoid that.
838
- `useNavigate() may be used only in the context of a <Router> component.`
839
- );
840
- let dataRouterContext = React3.useContext(DataRouterContext);
841
- let { basename, navigator } = React3.useContext(NavigationContext);
842
- let { matches } = React3.useContext(RouteContext);
843
- let { pathname: locationPathname } = useLocation();
844
- let routePathnamesJson = JSON.stringify(getResolveToMatches(matches));
845
- let activeRef = React3.useRef(false);
846
- useIsomorphicLayoutEffect(() => {
847
- activeRef.current = true;
848
- });
849
- let navigate = React3.useCallback(
850
- (to, options = {}) => {
851
- warning(activeRef.current, navigateEffectWarning);
852
- if (!activeRef.current) return;
853
- if (typeof to === "number") {
854
- navigator.go(to);
855
- return;
856
- }
857
- let path = resolveTo(
858
- to,
859
- JSON.parse(routePathnamesJson),
860
- locationPathname,
861
- options.relative === "path"
862
- );
863
- if (dataRouterContext == null && basename !== "/") {
864
- path.pathname = path.pathname === "/" ? basename : joinPaths([basename, path.pathname]);
865
- }
866
- (!!options.replace ? navigator.replace : navigator.push)(
867
- path,
868
- options.state,
869
- options
870
- );
871
- },
872
- [
873
- basename,
874
- navigator,
875
- routePathnamesJson,
876
- locationPathname,
877
- dataRouterContext
878
- ]
879
- );
880
- return navigate;
881
- }
882
- React3.createContext(null);
883
- function useResolvedPath(to, { relative } = {}) {
884
- let { matches } = React3.useContext(RouteContext);
885
- let { pathname: locationPathname } = useLocation();
886
- let routePathnamesJson = JSON.stringify(getResolveToMatches(matches));
887
- return React3.useMemo(
888
- () => resolveTo(
889
- to,
890
- JSON.parse(routePathnamesJson),
891
- locationPathname,
892
- relative === "path"
893
- ),
894
- [to, routePathnamesJson, locationPathname, relative]
895
- );
896
- }
897
- function useRoutesImpl(routes, locationArg, dataRouterState, onError, future) {
898
- invariant(
899
- useInRouterContext(),
900
- // TODO: This error is probably because they somehow have 2 versions of the
901
- // router loaded. We can help them understand how to avoid that.
902
- `useRoutes() may be used only in the context of a <Router> component.`
903
- );
904
- let { navigator } = React3.useContext(NavigationContext);
905
- let { matches: parentMatches } = React3.useContext(RouteContext);
906
- let routeMatch = parentMatches[parentMatches.length - 1];
907
- let parentParams = routeMatch ? routeMatch.params : {};
908
- let parentPathname = routeMatch ? routeMatch.pathname : "/";
909
- let parentPathnameBase = routeMatch ? routeMatch.pathnameBase : "/";
910
- let parentRoute = routeMatch && routeMatch.route;
911
- {
912
- let parentPath = parentRoute && parentRoute.path || "";
913
- warningOnce(
914
- parentPathname,
915
- !parentRoute || parentPath.endsWith("*") || parentPath.endsWith("*?"),
916
- `You rendered descendant <Routes> (or called \`useRoutes()\`) at "${parentPathname}" (under <Route path="${parentPath}">) but the parent route path has no trailing "*". This means if you navigate deeper, the parent won't match anymore and therefore the child routes will never render.
917
-
918
- Please change the parent <Route path="${parentPath}"> to <Route path="${parentPath === "/" ? "*" : `${parentPath}/*`}">.`
919
- );
920
- }
921
- let locationFromContext = useLocation();
922
- let location;
923
- {
924
- location = locationFromContext;
925
- }
926
- let pathname = location.pathname || "/";
927
- let remainingPathname = pathname;
928
- if (parentPathnameBase !== "/") {
929
- let parentSegments = parentPathnameBase.replace(/^\//, "").split("/");
930
- let segments = pathname.replace(/^\//, "").split("/");
931
- remainingPathname = "/" + segments.slice(parentSegments.length).join("/");
932
- }
933
- let matches = matchRoutes(routes, { pathname: remainingPathname });
934
- {
935
- warning(
936
- parentRoute || matches != null,
937
- `No routes matched location "${location.pathname}${location.search}${location.hash}" `
938
- );
939
- warning(
940
- matches == null || matches[matches.length - 1].route.element !== void 0 || matches[matches.length - 1].route.Component !== void 0 || matches[matches.length - 1].route.lazy !== void 0,
941
- `Matched leaf route at location "${location.pathname}${location.search}${location.hash}" does not have an element or Component. This means it will render an <Outlet /> with a null value by default resulting in an "empty" page.`
942
- );
943
- }
944
- let renderedMatches = _renderMatches(
945
- matches && matches.map(
946
- (match) => Object.assign({}, match, {
947
- params: Object.assign({}, parentParams, match.params),
948
- pathname: joinPaths([
949
- parentPathnameBase,
950
- // Re-encode pathnames that were decoded inside matchRoutes.
951
- // Pre-encode `?` and `#` ahead of `encodeLocation` because it uses
952
- // `new URL()` internally and we need to prevent it from treating
953
- // them as separators
954
- navigator.encodeLocation ? navigator.encodeLocation(
955
- match.pathname.replace(/\?/g, "%3F").replace(/#/g, "%23")
956
- ).pathname : match.pathname
957
- ]),
958
- pathnameBase: match.pathnameBase === "/" ? parentPathnameBase : joinPaths([
959
- parentPathnameBase,
960
- // Re-encode pathnames that were decoded inside matchRoutes
961
- // Pre-encode `?` and `#` ahead of `encodeLocation` because it uses
962
- // `new URL()` internally and we need to prevent it from treating
963
- // them as separators
964
- navigator.encodeLocation ? navigator.encodeLocation(
965
- match.pathnameBase.replace(/\?/g, "%3F").replace(/#/g, "%23")
966
- ).pathname : match.pathnameBase
967
- ])
968
- })
969
- ),
970
- parentMatches,
971
- dataRouterState,
972
- onError,
973
- future
974
- );
975
- return renderedMatches;
976
- }
977
- function DefaultErrorComponent() {
978
- let error = useRouteError();
979
- let message = isRouteErrorResponse(error) ? `${error.status} ${error.statusText}` : error instanceof Error ? error.message : JSON.stringify(error);
980
- let stack = error instanceof Error ? error.stack : null;
981
- let lightgrey = "rgba(200,200,200, 0.5)";
982
- let preStyles = { padding: "0.5rem", backgroundColor: lightgrey };
983
- let codeStyles = { padding: "2px 4px", backgroundColor: lightgrey };
984
- let devInfo = null;
985
- {
986
- console.error(
987
- "Error handled by React Router default ErrorBoundary:",
988
- error
989
- );
990
- devInfo = /* @__PURE__ */ React3.createElement(React3.Fragment, null, /* @__PURE__ */ React3.createElement("p", null, "\u{1F4BF} Hey developer \u{1F44B}"), /* @__PURE__ */ React3.createElement("p", null, "You can provide a way better UX than this when your app throws errors by providing your own ", /* @__PURE__ */ React3.createElement("code", { style: codeStyles }, "ErrorBoundary"), " or", " ", /* @__PURE__ */ React3.createElement("code", { style: codeStyles }, "errorElement"), " prop on your route."));
991
- }
992
- return /* @__PURE__ */ React3.createElement(React3.Fragment, null, /* @__PURE__ */ React3.createElement("h2", null, "Unexpected Application Error!"), /* @__PURE__ */ React3.createElement("h3", { style: { fontStyle: "italic" } }, message), stack ? /* @__PURE__ */ React3.createElement("pre", { style: preStyles }, stack) : null, devInfo);
993
- }
994
- var defaultErrorElement = /* @__PURE__ */ React3.createElement(DefaultErrorComponent, null);
995
- var RenderErrorBoundary = class extends React3.Component {
996
- constructor(props) {
997
- super(props);
998
- this.state = {
999
- location: props.location,
1000
- revalidation: props.revalidation,
1001
- error: props.error
1002
- };
1003
- }
1004
- static getDerivedStateFromError(error) {
1005
- return { error };
1006
- }
1007
- static getDerivedStateFromProps(props, state) {
1008
- if (state.location !== props.location || state.revalidation !== "idle" && props.revalidation === "idle") {
1009
- return {
1010
- error: props.error,
1011
- location: props.location,
1012
- revalidation: props.revalidation
1013
- };
1014
- }
1015
- return {
1016
- error: props.error !== void 0 ? props.error : state.error,
1017
- location: state.location,
1018
- revalidation: props.revalidation || state.revalidation
1019
- };
1020
- }
1021
- componentDidCatch(error, errorInfo) {
1022
- if (this.props.onError) {
1023
- this.props.onError(error, errorInfo);
1024
- } else {
1025
- console.error(
1026
- "React Router caught the following error during render",
1027
- error
1028
- );
1029
- }
1030
- }
1031
- render() {
1032
- let error = this.state.error;
1033
- if (this.context && typeof error === "object" && error && "digest" in error && typeof error.digest === "string") {
1034
- const decoded = decodeRouteErrorResponseDigest(error.digest);
1035
- if (decoded) error = decoded;
1036
- }
1037
- let result = error !== void 0 ? /* @__PURE__ */ React3.createElement(RouteContext.Provider, { value: this.props.routeContext }, /* @__PURE__ */ React3.createElement(
1038
- RouteErrorContext.Provider,
1039
- {
1040
- value: error,
1041
- children: this.props.component
1042
- }
1043
- )) : this.props.children;
1044
- if (this.context) {
1045
- return /* @__PURE__ */ React3.createElement(RSCErrorHandler, { error }, result);
1046
- }
1047
- return result;
1048
- }
1049
- };
1050
- RenderErrorBoundary.contextType = RSCRouterContext;
1051
- var errorRedirectHandledMap = /* @__PURE__ */ new WeakMap();
1052
- function RSCErrorHandler({
1053
- children,
1054
- error
1055
- }) {
1056
- let { basename } = React3.useContext(NavigationContext);
1057
- if (typeof error === "object" && error && "digest" in error && typeof error.digest === "string") {
1058
- let redirect2 = decodeRedirectErrorDigest(error.digest);
1059
- if (redirect2) {
1060
- let existingRedirect = errorRedirectHandledMap.get(error);
1061
- if (existingRedirect) throw existingRedirect;
1062
- let parsed = parseToInfo(redirect2.location, basename);
1063
- if (isBrowser$1 && !errorRedirectHandledMap.get(error)) {
1064
- if (parsed.isExternal || redirect2.reloadDocument) {
1065
- window.location.href = parsed.absoluteURL || parsed.to;
1066
- } else {
1067
- const redirectPromise = Promise.resolve().then(
1068
- () => window.__reactRouterDataRouter.navigate(parsed.to, {
1069
- replace: redirect2.replace
1070
- })
1071
- );
1072
- errorRedirectHandledMap.set(error, redirectPromise);
1073
- throw redirectPromise;
1074
- }
1075
- }
1076
- return /* @__PURE__ */ React3.createElement(
1077
- "meta",
1078
- {
1079
- httpEquiv: "refresh",
1080
- content: `0;url=${parsed.absoluteURL || parsed.to}`
1081
- }
1082
- );
1083
- }
1084
- }
1085
- return children;
1086
- }
1087
- function RenderedRoute({ routeContext, match, children }) {
1088
- let dataRouterContext = React3.useContext(DataRouterContext);
1089
- if (dataRouterContext && dataRouterContext.static && dataRouterContext.staticContext && (match.route.errorElement || match.route.ErrorBoundary)) {
1090
- dataRouterContext.staticContext._deepestRenderedBoundaryId = match.route.id;
1091
- }
1092
- return /* @__PURE__ */ React3.createElement(RouteContext.Provider, { value: routeContext }, children);
1093
- }
1094
- function _renderMatches(matches, parentMatches = [], dataRouterState = null, onErrorHandler = null, future = null) {
1095
- if (matches == null) {
1096
- if (!dataRouterState) {
1097
- return null;
1098
- }
1099
- if (dataRouterState.errors) {
1100
- matches = dataRouterState.matches;
1101
- } else if (parentMatches.length === 0 && !dataRouterState.initialized && dataRouterState.matches.length > 0) {
1102
- matches = dataRouterState.matches;
1103
- } else {
1104
- return null;
1105
- }
1106
- }
1107
- let renderedMatches = matches;
1108
- let errors = dataRouterState?.errors;
1109
- if (errors != null) {
1110
- let errorIndex = renderedMatches.findIndex(
1111
- (m) => m.route.id && errors?.[m.route.id] !== void 0
1112
- );
1113
- invariant(
1114
- errorIndex >= 0,
1115
- `Could not find a matching route for errors on route IDs: ${Object.keys(
1116
- errors
1117
- ).join(",")}`
1118
- );
1119
- renderedMatches = renderedMatches.slice(
1120
- 0,
1121
- Math.min(renderedMatches.length, errorIndex + 1)
1122
- );
1123
- }
1124
- let renderFallback = false;
1125
- let fallbackIndex = -1;
1126
- if (dataRouterState) {
1127
- for (let i = 0; i < renderedMatches.length; i++) {
1128
- let match = renderedMatches[i];
1129
- if (match.route.HydrateFallback || match.route.hydrateFallbackElement) {
1130
- fallbackIndex = i;
1131
- }
1132
- if (match.route.id) {
1133
- let { loaderData, errors: errors2 } = dataRouterState;
1134
- let needsToRunLoader = match.route.loader && !loaderData.hasOwnProperty(match.route.id) && (!errors2 || errors2[match.route.id] === void 0);
1135
- if (match.route.lazy || needsToRunLoader) {
1136
- renderFallback = true;
1137
- if (fallbackIndex >= 0) {
1138
- renderedMatches = renderedMatches.slice(0, fallbackIndex + 1);
1139
- } else {
1140
- renderedMatches = [renderedMatches[0]];
1141
- }
1142
- break;
1143
- }
1144
- }
1145
- }
1146
- }
1147
- let onError = dataRouterState && onErrorHandler ? (error, errorInfo) => {
1148
- onErrorHandler(error, {
1149
- location: dataRouterState.location,
1150
- params: dataRouterState.matches?.[0]?.params ?? {},
1151
- unstable_pattern: getRoutePattern(dataRouterState.matches),
1152
- errorInfo
1153
- });
1154
- } : void 0;
1155
- return renderedMatches.reduceRight(
1156
- (outlet, match, index) => {
1157
- let error;
1158
- let shouldRenderHydrateFallback = false;
1159
- let errorElement = null;
1160
- let hydrateFallbackElement = null;
1161
- if (dataRouterState) {
1162
- error = errors && match.route.id ? errors[match.route.id] : void 0;
1163
- errorElement = match.route.errorElement || defaultErrorElement;
1164
- if (renderFallback) {
1165
- if (fallbackIndex < 0 && index === 0) {
1166
- warningOnce(
1167
- "route-fallback",
1168
- false,
1169
- "No `HydrateFallback` element provided to render during initial hydration"
1170
- );
1171
- shouldRenderHydrateFallback = true;
1172
- hydrateFallbackElement = null;
1173
- } else if (fallbackIndex === index) {
1174
- shouldRenderHydrateFallback = true;
1175
- hydrateFallbackElement = match.route.hydrateFallbackElement || null;
1176
- }
1177
- }
1178
- }
1179
- let matches2 = parentMatches.concat(renderedMatches.slice(0, index + 1));
1180
- let getChildren = () => {
1181
- let children;
1182
- if (error) {
1183
- children = errorElement;
1184
- } else if (shouldRenderHydrateFallback) {
1185
- children = hydrateFallbackElement;
1186
- } else if (match.route.Component) {
1187
- children = /* @__PURE__ */ React3.createElement(match.route.Component, null);
1188
- } else if (match.route.element) {
1189
- children = match.route.element;
1190
- } else {
1191
- children = outlet;
1192
- }
1193
- return /* @__PURE__ */ React3.createElement(
1194
- RenderedRoute,
1195
- {
1196
- match,
1197
- routeContext: {
1198
- outlet,
1199
- matches: matches2,
1200
- isDataRoute: dataRouterState != null
1201
- },
1202
- children
1203
- }
1204
- );
1205
- };
1206
- return dataRouterState && (match.route.ErrorBoundary || match.route.errorElement || index === 0) ? /* @__PURE__ */ React3.createElement(
1207
- RenderErrorBoundary,
1208
- {
1209
- location: dataRouterState.location,
1210
- revalidation: dataRouterState.revalidation,
1211
- component: errorElement,
1212
- error,
1213
- children: getChildren(),
1214
- routeContext: { outlet: null, matches: matches2, isDataRoute: true },
1215
- onError
1216
- }
1217
- ) : getChildren();
1218
- },
1219
- null
1220
- );
1221
- }
1222
- function getDataRouterConsoleError(hookName) {
1223
- return `${hookName} must be used within a data router. See https://reactrouter.com/en/main/routers/picking-a-router.`;
1224
- }
1225
- function useDataRouterContext(hookName) {
1226
- let ctx = React3.useContext(DataRouterContext);
1227
- invariant(ctx, getDataRouterConsoleError(hookName));
1228
- return ctx;
1229
- }
1230
- function useDataRouterState(hookName) {
1231
- let state = React3.useContext(DataRouterStateContext);
1232
- invariant(state, getDataRouterConsoleError(hookName));
1233
- return state;
1234
- }
1235
- function useRouteContext(hookName) {
1236
- let route = React3.useContext(RouteContext);
1237
- invariant(route, getDataRouterConsoleError(hookName));
1238
- return route;
1239
- }
1240
- function useCurrentRouteId(hookName) {
1241
- let route = useRouteContext(hookName);
1242
- let thisRoute = route.matches[route.matches.length - 1];
1243
- invariant(
1244
- thisRoute.route.id,
1245
- `${hookName} can only be used on routes that contain a unique "id"`
1246
- );
1247
- return thisRoute.route.id;
1248
- }
1249
- function useRouteId() {
1250
- return useCurrentRouteId("useRouteId" /* UseRouteId */);
1251
- }
1252
- function useRouteError() {
1253
- let error = React3.useContext(RouteErrorContext);
1254
- let state = useDataRouterState("useRouteError" /* UseRouteError */);
1255
- let routeId = useCurrentRouteId("useRouteError" /* UseRouteError */);
1256
- if (error !== void 0) {
1257
- return error;
1258
- }
1259
- return state.errors?.[routeId];
1260
- }
1261
- function useNavigateStable() {
1262
- let { router } = useDataRouterContext("useNavigate" /* UseNavigateStable */);
1263
- let id = useCurrentRouteId("useNavigate" /* UseNavigateStable */);
1264
- let activeRef = React3.useRef(false);
1265
- useIsomorphicLayoutEffect(() => {
1266
- activeRef.current = true;
1267
- });
1268
- let navigate = React3.useCallback(
1269
- async (to, options = {}) => {
1270
- warning(activeRef.current, navigateEffectWarning);
1271
- if (!activeRef.current) return;
1272
- if (typeof to === "number") {
1273
- await router.navigate(to);
1274
- } else {
1275
- await router.navigate(to, { fromRouteId: id, ...options });
1276
- }
1277
- },
1278
- [router, id]
1279
- );
1280
- return navigate;
1281
- }
1282
- var alreadyWarned = {};
1283
- function warningOnce(key, cond, message) {
1284
- if (!cond && !alreadyWarned[key]) {
1285
- alreadyWarned[key] = true;
1286
- warning(false, message);
1287
- }
1288
- }
1289
- React3.memo(DataRoutes);
1290
- function DataRoutes({
1291
- routes,
1292
- future,
1293
- state,
1294
- onError
1295
- }) {
1296
- return useRoutesImpl(routes, void 0, state, onError, future);
1297
- }
1298
-
1299
- // lib/dom/dom.ts
1300
- var defaultMethod = "get";
1301
- var defaultEncType = "application/x-www-form-urlencoded";
1302
- function isHtmlElement(object) {
1303
- return typeof HTMLElement !== "undefined" && object instanceof HTMLElement;
1304
- }
1305
- function isButtonElement(object) {
1306
- return isHtmlElement(object) && object.tagName.toLowerCase() === "button";
1307
- }
1308
- function isFormElement(object) {
1309
- return isHtmlElement(object) && object.tagName.toLowerCase() === "form";
1310
- }
1311
- function isInputElement(object) {
1312
- return isHtmlElement(object) && object.tagName.toLowerCase() === "input";
1313
- }
1314
- function isModifiedEvent(event) {
1315
- return !!(event.metaKey || event.altKey || event.ctrlKey || event.shiftKey);
1316
- }
1317
- function shouldProcessLinkClick(event, target) {
1318
- return event.button === 0 && // Ignore everything but left clicks
1319
- (!target || target === "_self") && // Let browser handle "target=_blank" etc.
1320
- !isModifiedEvent(event);
1321
- }
1322
- var _formDataSupportsSubmitter = null;
1323
- function isFormDataSubmitterSupported() {
1324
- if (_formDataSupportsSubmitter === null) {
1325
- try {
1326
- new FormData(
1327
- document.createElement("form"),
1328
- // @ts-expect-error if FormData supports the submitter parameter, this will throw
1329
- 0
1330
- );
1331
- _formDataSupportsSubmitter = false;
1332
- } catch (e) {
1333
- _formDataSupportsSubmitter = true;
1334
- }
1335
- }
1336
- return _formDataSupportsSubmitter;
1337
- }
1338
- var supportedFormEncTypes = /* @__PURE__ */ new Set([
1339
- "application/x-www-form-urlencoded",
1340
- "multipart/form-data",
1341
- "text/plain"
1342
- ]);
1343
- function getFormEncType(encType) {
1344
- if (encType != null && !supportedFormEncTypes.has(encType)) {
1345
- warning(
1346
- false,
1347
- `"${encType}" is not a valid \`encType\` for \`<Form>\`/\`<fetcher.Form>\` and will default to "${defaultEncType}"`
1348
- );
1349
- return null;
1350
- }
1351
- return encType;
1352
- }
1353
- function getFormSubmissionInfo(target, basename) {
1354
- let method;
1355
- let action;
1356
- let encType;
1357
- let formData;
1358
- let body;
1359
- if (isFormElement(target)) {
1360
- let attr = target.getAttribute("action");
1361
- action = attr ? stripBasename(attr, basename) : null;
1362
- method = target.getAttribute("method") || defaultMethod;
1363
- encType = getFormEncType(target.getAttribute("enctype")) || defaultEncType;
1364
- formData = new FormData(target);
1365
- } else if (isButtonElement(target) || isInputElement(target) && (target.type === "submit" || target.type === "image")) {
1366
- let form = target.form;
1367
- if (form == null) {
1368
- throw new Error(
1369
- `Cannot submit a <button> or <input type="submit"> without a <form>`
1370
- );
1371
- }
1372
- let attr = target.getAttribute("formaction") || form.getAttribute("action");
1373
- action = attr ? stripBasename(attr, basename) : null;
1374
- method = target.getAttribute("formmethod") || form.getAttribute("method") || defaultMethod;
1375
- encType = getFormEncType(target.getAttribute("formenctype")) || getFormEncType(form.getAttribute("enctype")) || defaultEncType;
1376
- formData = new FormData(form, target);
1377
- if (!isFormDataSubmitterSupported()) {
1378
- let { name, type, value } = target;
1379
- if (type === "image") {
1380
- let prefix = name ? `${name}.` : "";
1381
- formData.append(`${prefix}x`, "0");
1382
- formData.append(`${prefix}y`, "0");
1383
- } else if (name) {
1384
- formData.append(name, value);
1385
- }
1386
- }
1387
- } else if (isHtmlElement(target)) {
1388
- throw new Error(
1389
- `Cannot submit element that is not <form>, <button>, or <input type="submit|image">`
1390
- );
1391
- } else {
1392
- method = defaultMethod;
1393
- action = null;
1394
- encType = defaultEncType;
1395
- body = target;
1396
- }
1397
- if (formData && encType === "text/plain") {
1398
- body = formData;
1399
- formData = void 0;
1400
- }
1401
- return { action, method: method.toLowerCase(), encType, formData, body };
1402
- }
1403
- Object.getOwnPropertyNames(Object.prototype).sort().join("\0");
1404
-
1405
- // lib/dom/ssr/invariant.ts
1406
- function invariant2(value, message) {
1407
- if (value === false || value === null || typeof value === "undefined") {
1408
- throw new Error(message);
1409
- }
1410
- }
1411
- function singleFetchUrl(reqUrl, basename, trailingSlashAware, extension) {
1412
- let url = typeof reqUrl === "string" ? new URL(
1413
- reqUrl,
1414
- // This can be called during the SSR flow via PrefetchPageLinksImpl so
1415
- // don't assume window is available
1416
- typeof window === "undefined" ? "server://singlefetch/" : window.location.origin
1417
- ) : reqUrl;
1418
- if (trailingSlashAware) {
1419
- if (url.pathname.endsWith("/")) {
1420
- url.pathname = `${url.pathname}_.${extension}`;
1421
- } else {
1422
- url.pathname = `${url.pathname}.${extension}`;
1423
- }
1424
- } else {
1425
- if (url.pathname === "/") {
1426
- url.pathname = `_root.${extension}`;
1427
- } else if (basename && stripBasename(url.pathname, basename) === "/") {
1428
- url.pathname = `${basename.replace(/\/$/, "")}/_root.${extension}`;
1429
- } else {
1430
- url.pathname = `${url.pathname.replace(/\/$/, "")}.${extension}`;
1431
- }
1432
- }
1433
- return url;
1434
- }
1435
-
1436
- // lib/dom/ssr/routeModules.ts
1437
- async function loadRouteModule(route, routeModulesCache) {
1438
- if (route.id in routeModulesCache) {
1439
- return routeModulesCache[route.id];
1440
- }
1441
- try {
1442
- let routeModule = await import(
1443
- /* @vite-ignore */
1444
- /* webpackIgnore: true */
1445
- route.module
1446
- );
1447
- routeModulesCache[route.id] = routeModule;
1448
- return routeModule;
1449
- } catch (error) {
1450
- console.error(
1451
- `Error loading route module \`${route.module}\`, reloading page...`
1452
- );
1453
- console.error(error);
1454
- if (window.__reactRouterContext && window.__reactRouterContext.isSpaMode && // @ts-expect-error
1455
- import.meta.hot) {
1456
- throw error;
1457
- }
1458
- window.location.reload();
1459
- return new Promise(() => {
1460
- });
1461
- }
1462
- }
1463
- function isHtmlLinkDescriptor(object) {
1464
- if (object == null) {
1465
- return false;
1466
- }
1467
- if (object.href == null) {
1468
- return object.rel === "preload" && typeof object.imageSrcSet === "string" && typeof object.imageSizes === "string";
1469
- }
1470
- return typeof object.rel === "string" && typeof object.href === "string";
1471
- }
1472
- async function getKeyedPrefetchLinks(matches, manifest, routeModules) {
1473
- let links = await Promise.all(
1474
- matches.map(async (match) => {
1475
- let route = manifest.routes[match.route.id];
1476
- if (route) {
1477
- let mod = await loadRouteModule(route, routeModules);
1478
- return mod.links ? mod.links() : [];
1479
- }
1480
- return [];
1481
- })
1482
- );
1483
- return dedupeLinkDescriptors(
1484
- links.flat(1).filter(isHtmlLinkDescriptor).filter((link) => link.rel === "stylesheet" || link.rel === "preload").map(
1485
- (link) => link.rel === "stylesheet" ? { ...link, rel: "prefetch", as: "style" } : { ...link, rel: "prefetch" }
1486
- )
1487
- );
1488
- }
1489
- function getNewMatchesForLinks(page, nextMatches, currentMatches, manifest, location, mode) {
1490
- let isNew = (match, index) => {
1491
- if (!currentMatches[index]) return true;
1492
- return match.route.id !== currentMatches[index].route.id;
1493
- };
1494
- let matchPathChanged = (match, index) => {
1495
- return (
1496
- // param change, /users/123 -> /users/456
1497
- currentMatches[index].pathname !== match.pathname || // splat param changed, which is not present in match.path
1498
- // e.g. /files/images/avatar.jpg -> files/finances.xls
1499
- currentMatches[index].route.path?.endsWith("*") && currentMatches[index].params["*"] !== match.params["*"]
1500
- );
1501
- };
1502
- if (mode === "assets") {
1503
- return nextMatches.filter(
1504
- (match, index) => isNew(match, index) || matchPathChanged(match, index)
1505
- );
1506
- }
1507
- if (mode === "data") {
1508
- return nextMatches.filter((match, index) => {
1509
- let manifestRoute = manifest.routes[match.route.id];
1510
- if (!manifestRoute || !manifestRoute.hasLoader) {
1511
- return false;
1512
- }
1513
- if (isNew(match, index) || matchPathChanged(match, index)) {
1514
- return true;
1515
- }
1516
- if (match.route.shouldRevalidate) {
1517
- let routeChoice = match.route.shouldRevalidate({
1518
- currentUrl: new URL(
1519
- location.pathname + location.search + location.hash,
1520
- window.origin
1521
- ),
1522
- currentParams: currentMatches[0]?.params || {},
1523
- nextUrl: new URL(page, window.origin),
1524
- nextParams: match.params,
1525
- defaultShouldRevalidate: true
1526
- });
1527
- if (typeof routeChoice === "boolean") {
1528
- return routeChoice;
1529
- }
1530
- }
1531
- return true;
1532
- });
1533
- }
1534
- return [];
1535
- }
1536
- function getModuleLinkHrefs(matches, manifest, { includeHydrateFallback } = {}) {
1537
- return dedupeHrefs(
1538
- matches.map((match) => {
1539
- let route = manifest.routes[match.route.id];
1540
- if (!route) return [];
1541
- let hrefs = [route.module];
1542
- if (route.clientActionModule) {
1543
- hrefs = hrefs.concat(route.clientActionModule);
1544
- }
1545
- if (route.clientLoaderModule) {
1546
- hrefs = hrefs.concat(route.clientLoaderModule);
1547
- }
1548
- if (includeHydrateFallback && route.hydrateFallbackModule) {
1549
- hrefs = hrefs.concat(route.hydrateFallbackModule);
1550
- }
1551
- if (route.imports) {
1552
- hrefs = hrefs.concat(route.imports);
1553
- }
1554
- return hrefs;
1555
- }).flat(1)
1556
- );
1557
- }
1558
- function dedupeHrefs(hrefs) {
1559
- return [...new Set(hrefs)];
1560
- }
1561
- function sortKeys(obj) {
1562
- let sorted = {};
1563
- let keys = Object.keys(obj).sort();
1564
- for (let key of keys) {
1565
- sorted[key] = obj[key];
1566
- }
1567
- return sorted;
1568
- }
1569
- function dedupeLinkDescriptors(descriptors, preloads) {
1570
- let set = /* @__PURE__ */ new Set();
1571
- new Set(preloads);
1572
- return descriptors.reduce((deduped, descriptor) => {
1573
- let key = JSON.stringify(sortKeys(descriptor));
1574
- if (!set.has(key)) {
1575
- set.add(key);
1576
- deduped.push({ key, link: descriptor });
1577
- }
1578
- return deduped;
1579
- }, []);
1580
- }
1581
-
1582
- // lib/dom/ssr/components.tsx
1583
- function useDataRouterContext2() {
1584
- let context = React3.useContext(DataRouterContext);
1585
- invariant2(
1586
- context,
1587
- "You must render this element inside a <DataRouterContext.Provider> element"
1588
- );
1589
- return context;
1590
- }
1591
- function useDataRouterStateContext() {
1592
- let context = React3.useContext(DataRouterStateContext);
1593
- invariant2(
1594
- context,
1595
- "You must render this element inside a <DataRouterStateContext.Provider> element"
1596
- );
1597
- return context;
1598
- }
1599
- var FrameworkContext = React3.createContext(void 0);
1600
- FrameworkContext.displayName = "FrameworkContext";
1601
- function useFrameworkContext() {
1602
- let context = React3.useContext(FrameworkContext);
1603
- invariant2(
1604
- context,
1605
- "You must render this element inside a <HydratedRouter> element"
1606
- );
1607
- return context;
1608
- }
1609
- function usePrefetchBehavior(prefetch, theirElementProps) {
1610
- let frameworkContext = React3.useContext(FrameworkContext);
1611
- let [maybePrefetch, setMaybePrefetch] = React3.useState(false);
1612
- let [shouldPrefetch, setShouldPrefetch] = React3.useState(false);
1613
- let { onFocus, onBlur, onMouseEnter, onMouseLeave, onTouchStart } = theirElementProps;
1614
- let ref = React3.useRef(null);
1615
- React3.useEffect(() => {
1616
- if (prefetch === "render") {
1617
- setShouldPrefetch(true);
1618
- }
1619
- if (prefetch === "viewport") {
1620
- let callback = (entries) => {
1621
- entries.forEach((entry) => {
1622
- setShouldPrefetch(entry.isIntersecting);
1623
- });
1624
- };
1625
- let observer = new IntersectionObserver(callback, { threshold: 0.5 });
1626
- if (ref.current) observer.observe(ref.current);
1627
- return () => {
1628
- observer.disconnect();
1629
- };
1630
- }
1631
- }, [prefetch]);
1632
- React3.useEffect(() => {
1633
- if (maybePrefetch) {
1634
- let id = setTimeout(() => {
1635
- setShouldPrefetch(true);
1636
- }, 100);
1637
- return () => {
1638
- clearTimeout(id);
1639
- };
1640
- }
1641
- }, [maybePrefetch]);
1642
- let setIntent = () => {
1643
- setMaybePrefetch(true);
1644
- };
1645
- let cancelIntent = () => {
1646
- setMaybePrefetch(false);
1647
- setShouldPrefetch(false);
1648
- };
1649
- if (!frameworkContext) {
1650
- return [false, ref, {}];
1651
- }
1652
- if (prefetch !== "intent") {
1653
- return [shouldPrefetch, ref, {}];
1654
- }
1655
- return [
1656
- shouldPrefetch,
1657
- ref,
1658
- {
1659
- onFocus: composeEventHandlers(onFocus, setIntent),
1660
- onBlur: composeEventHandlers(onBlur, cancelIntent),
1661
- onMouseEnter: composeEventHandlers(onMouseEnter, setIntent),
1662
- onMouseLeave: composeEventHandlers(onMouseLeave, cancelIntent),
1663
- onTouchStart: composeEventHandlers(onTouchStart, setIntent)
1664
- }
1665
- ];
1666
- }
1667
- function composeEventHandlers(theirHandler, ourHandler) {
1668
- return (event) => {
1669
- theirHandler && theirHandler(event);
1670
- if (!event.defaultPrevented) {
1671
- ourHandler(event);
1672
- }
1673
- };
1674
- }
1675
- function PrefetchPageLinks({ page, ...linkProps }) {
1676
- let { router } = useDataRouterContext2();
1677
- let matches = React3.useMemo(
1678
- () => matchRoutes(router.routes, page, router.basename),
1679
- [router.routes, page, router.basename]
1680
- );
1681
- if (!matches) {
1682
- return null;
1683
- }
1684
- return /* @__PURE__ */ React3.createElement(PrefetchPageLinksImpl, { page, matches, ...linkProps });
1685
- }
1686
- function useKeyedPrefetchLinks(matches) {
1687
- let { manifest, routeModules } = useFrameworkContext();
1688
- let [keyedPrefetchLinks, setKeyedPrefetchLinks] = React3.useState([]);
1689
- React3.useEffect(() => {
1690
- let interrupted = false;
1691
- void getKeyedPrefetchLinks(matches, manifest, routeModules).then(
1692
- (links) => {
1693
- if (!interrupted) {
1694
- setKeyedPrefetchLinks(links);
1695
- }
1696
- }
1697
- );
1698
- return () => {
1699
- interrupted = true;
1700
- };
1701
- }, [matches, manifest, routeModules]);
1702
- return keyedPrefetchLinks;
1703
- }
1704
- function PrefetchPageLinksImpl({
1705
- page,
1706
- matches: nextMatches,
1707
- ...linkProps
1708
- }) {
1709
- let location = useLocation();
1710
- let { future, manifest, routeModules } = useFrameworkContext();
1711
- let { basename } = useDataRouterContext2();
1712
- let { loaderData, matches } = useDataRouterStateContext();
1713
- let newMatchesForData = React3.useMemo(
1714
- () => getNewMatchesForLinks(
1715
- page,
1716
- nextMatches,
1717
- matches,
1718
- manifest,
1719
- location,
1720
- "data"
1721
- ),
1722
- [page, nextMatches, matches, manifest, location]
1723
- );
1724
- let newMatchesForAssets = React3.useMemo(
1725
- () => getNewMatchesForLinks(
1726
- page,
1727
- nextMatches,
1728
- matches,
1729
- manifest,
1730
- location,
1731
- "assets"
1732
- ),
1733
- [page, nextMatches, matches, manifest, location]
1734
- );
1735
- let dataHrefs = React3.useMemo(() => {
1736
- if (page === location.pathname + location.search + location.hash) {
1737
- return [];
1738
- }
1739
- let routesParams = /* @__PURE__ */ new Set();
1740
- let foundOptOutRoute = false;
1741
- nextMatches.forEach((m) => {
1742
- let manifestRoute = manifest.routes[m.route.id];
1743
- if (!manifestRoute || !manifestRoute.hasLoader) {
1744
- return;
1745
- }
1746
- if (!newMatchesForData.some((m2) => m2.route.id === m.route.id) && m.route.id in loaderData && routeModules[m.route.id]?.shouldRevalidate) {
1747
- foundOptOutRoute = true;
1748
- } else if (manifestRoute.hasClientLoader) {
1749
- foundOptOutRoute = true;
1750
- } else {
1751
- routesParams.add(m.route.id);
1752
- }
1753
- });
1754
- if (routesParams.size === 0) {
1755
- return [];
1756
- }
1757
- let url = singleFetchUrl(
1758
- page,
1759
- basename,
1760
- future.unstable_trailingSlashAwareDataRequests,
1761
- "data"
1762
- );
1763
- if (foundOptOutRoute && routesParams.size > 0) {
1764
- url.searchParams.set(
1765
- "_routes",
1766
- nextMatches.filter((m) => routesParams.has(m.route.id)).map((m) => m.route.id).join(",")
1767
- );
1768
- }
1769
- return [url.pathname + url.search];
1770
- }, [
1771
- basename,
1772
- future.unstable_trailingSlashAwareDataRequests,
1773
- loaderData,
1774
- location,
1775
- manifest,
1776
- newMatchesForData,
1777
- nextMatches,
1778
- page,
1779
- routeModules
1780
- ]);
1781
- let moduleHrefs = React3.useMemo(
1782
- () => getModuleLinkHrefs(newMatchesForAssets, manifest),
1783
- [newMatchesForAssets, manifest]
1784
- );
1785
- let keyedPrefetchLinks = useKeyedPrefetchLinks(newMatchesForAssets);
1786
- return /* @__PURE__ */ React3.createElement(React3.Fragment, null, dataHrefs.map((href) => /* @__PURE__ */ React3.createElement("link", { key: href, rel: "prefetch", as: "fetch", href, ...linkProps })), moduleHrefs.map((href) => /* @__PURE__ */ React3.createElement("link", { key: href, rel: "modulepreload", href, ...linkProps })), keyedPrefetchLinks.map(({ key, link }) => (
1787
- // these don't spread `linkProps` because they are full link descriptors
1788
- // already with their own props
1789
- /* @__PURE__ */ React3.createElement("link", { key, nonce: linkProps.nonce, ...link })
1790
- )));
1791
- }
1792
- function mergeRefs(...refs) {
1793
- return (value) => {
1794
- refs.forEach((ref) => {
1795
- if (typeof ref === "function") {
1796
- ref(value);
1797
- } else if (ref != null) {
1798
- ref.current = value;
1799
- }
1800
- });
1801
- };
1802
- }
1803
- var isBrowser2 = typeof window !== "undefined" && typeof window.document !== "undefined" && typeof window.document.createElement !== "undefined";
1804
- try {
1805
- if (isBrowser2) {
1806
- window.__reactRouterVersion = // @ts-expect-error
1807
- "7.12.0";
1808
- }
1809
- } catch (e) {
1810
- }
1811
- var ABSOLUTE_URL_REGEX2 = /^(?:[a-z][a-z0-9+.-]*:|\/\/)/i;
1812
- var Link = React3.forwardRef(
1813
- function LinkWithRef({
1814
- onClick,
1815
- discover = "render",
1816
- prefetch = "none",
1817
- relative,
1818
- reloadDocument,
1819
- replace: replace2,
1820
- state,
1821
- target,
1822
- to,
1823
- preventScrollReset,
1824
- viewTransition,
1825
- unstable_defaultShouldRevalidate,
1826
- ...rest
1827
- }, forwardedRef) {
1828
- let { basename, unstable_useTransitions } = React3.useContext(NavigationContext);
1829
- let isAbsolute = typeof to === "string" && ABSOLUTE_URL_REGEX2.test(to);
1830
- let parsed = parseToInfo(to, basename);
1831
- to = parsed.to;
1832
- let href = useHref(to, { relative });
1833
- let [shouldPrefetch, prefetchRef, prefetchHandlers] = usePrefetchBehavior(
1834
- prefetch,
1835
- rest
1836
- );
1837
- let internalOnClick = useLinkClickHandler(to, {
1838
- replace: replace2,
1839
- state,
1840
- target,
1841
- preventScrollReset,
1842
- relative,
1843
- viewTransition,
1844
- unstable_defaultShouldRevalidate,
1845
- unstable_useTransitions
1846
- });
1847
- function handleClick(event) {
1848
- if (onClick) onClick(event);
1849
- if (!event.defaultPrevented) {
1850
- internalOnClick(event);
1851
- }
1852
- }
1853
- let link = (
1854
- // eslint-disable-next-line jsx-a11y/anchor-has-content
1855
- /* @__PURE__ */ React3.createElement(
1856
- "a",
1857
- {
1858
- ...rest,
1859
- ...prefetchHandlers,
1860
- href: parsed.absoluteURL || href,
1861
- onClick: parsed.isExternal || reloadDocument ? onClick : handleClick,
1862
- ref: mergeRefs(forwardedRef, prefetchRef),
1863
- target,
1864
- "data-discover": !isAbsolute && discover === "render" ? "true" : void 0
1865
- }
1866
- )
1867
- );
1868
- return shouldPrefetch && !isAbsolute ? /* @__PURE__ */ React3.createElement(React3.Fragment, null, link, /* @__PURE__ */ React3.createElement(PrefetchPageLinks, { page: href })) : link;
1869
- }
1870
- );
1871
- Link.displayName = "Link";
1872
- var NavLink = React3.forwardRef(
1873
- function NavLinkWithRef({
1874
- "aria-current": ariaCurrentProp = "page",
1875
- caseSensitive = false,
1876
- className: classNameProp = "",
1877
- end = false,
1878
- style: styleProp,
1879
- to,
1880
- viewTransition,
1881
- children,
1882
- ...rest
1883
- }, ref) {
1884
- let path = useResolvedPath(to, { relative: rest.relative });
1885
- let location = useLocation();
1886
- let routerState = React3.useContext(DataRouterStateContext);
1887
- let { navigator, basename } = React3.useContext(NavigationContext);
1888
- let isTransitioning = routerState != null && // Conditional usage is OK here because the usage of a data router is static
1889
- // eslint-disable-next-line react-hooks/rules-of-hooks
1890
- useViewTransitionState(path) && viewTransition === true;
1891
- let toPathname = navigator.encodeLocation ? navigator.encodeLocation(path).pathname : path.pathname;
1892
- let locationPathname = location.pathname;
1893
- let nextLocationPathname = routerState && routerState.navigation && routerState.navigation.location ? routerState.navigation.location.pathname : null;
1894
- if (!caseSensitive) {
1895
- locationPathname = locationPathname.toLowerCase();
1896
- nextLocationPathname = nextLocationPathname ? nextLocationPathname.toLowerCase() : null;
1897
- toPathname = toPathname.toLowerCase();
1898
- }
1899
- if (nextLocationPathname && basename) {
1900
- nextLocationPathname = stripBasename(nextLocationPathname, basename) || nextLocationPathname;
1901
- }
1902
- const endSlashPosition = toPathname !== "/" && toPathname.endsWith("/") ? toPathname.length - 1 : toPathname.length;
1903
- let isActive = locationPathname === toPathname || !end && locationPathname.startsWith(toPathname) && locationPathname.charAt(endSlashPosition) === "/";
1904
- let isPending = nextLocationPathname != null && (nextLocationPathname === toPathname || !end && nextLocationPathname.startsWith(toPathname) && nextLocationPathname.charAt(toPathname.length) === "/");
1905
- let renderProps = {
1906
- isActive,
1907
- isPending,
1908
- isTransitioning
1909
- };
1910
- let ariaCurrent = isActive ? ariaCurrentProp : void 0;
1911
- let className;
1912
- if (typeof classNameProp === "function") {
1913
- className = classNameProp(renderProps);
1914
- } else {
1915
- className = [
1916
- classNameProp,
1917
- isActive ? "active" : null,
1918
- isPending ? "pending" : null,
1919
- isTransitioning ? "transitioning" : null
1920
- ].filter(Boolean).join(" ");
1921
- }
1922
- let style = typeof styleProp === "function" ? styleProp(renderProps) : styleProp;
1923
- return /* @__PURE__ */ React3.createElement(
1924
- Link,
1925
- {
1926
- ...rest,
1927
- "aria-current": ariaCurrent,
1928
- className,
1929
- ref,
1930
- style,
1931
- to,
1932
- viewTransition
1933
- },
1934
- typeof children === "function" ? children(renderProps) : children
1935
- );
1936
- }
1937
- );
1938
- NavLink.displayName = "NavLink";
1939
- var Form = React3.forwardRef(
1940
- ({
1941
- discover = "render",
1942
- fetcherKey,
1943
- navigate,
1944
- reloadDocument,
1945
- replace: replace2,
1946
- state,
1947
- method = defaultMethod,
1948
- action,
1949
- onSubmit,
1950
- relative,
1951
- preventScrollReset,
1952
- viewTransition,
1953
- unstable_defaultShouldRevalidate,
1954
- ...props
1955
- }, forwardedRef) => {
1956
- let { unstable_useTransitions } = React3.useContext(NavigationContext);
1957
- let submit = useSubmit();
1958
- let formAction = useFormAction(action, { relative });
1959
- let formMethod = method.toLowerCase() === "get" ? "get" : "post";
1960
- let isAbsolute = typeof action === "string" && ABSOLUTE_URL_REGEX2.test(action);
1961
- let submitHandler = (event) => {
1962
- onSubmit && onSubmit(event);
1963
- if (event.defaultPrevented) return;
1964
- event.preventDefault();
1965
- let submitter = event.nativeEvent.submitter;
1966
- let submitMethod = submitter?.getAttribute("formmethod") || method;
1967
- let doSubmit = () => submit(submitter || event.currentTarget, {
1968
- fetcherKey,
1969
- method: submitMethod,
1970
- navigate,
1971
- replace: replace2,
1972
- state,
1973
- relative,
1974
- preventScrollReset,
1975
- viewTransition,
1976
- unstable_defaultShouldRevalidate
1977
- });
1978
- if (unstable_useTransitions && navigate !== false) {
1979
- React3.startTransition(() => doSubmit());
1980
- } else {
1981
- doSubmit();
1982
- }
1983
- };
1984
- return /* @__PURE__ */ React3.createElement(
1985
- "form",
1986
- {
1987
- ref: forwardedRef,
1988
- method: formMethod,
1989
- action: formAction,
1990
- onSubmit: reloadDocument ? onSubmit : submitHandler,
1991
- ...props,
1992
- "data-discover": !isAbsolute && discover === "render" ? "true" : void 0
1993
- }
1994
- );
1995
- }
1996
- );
1997
- Form.displayName = "Form";
1998
- function getDataRouterConsoleError2(hookName) {
1999
- return `${hookName} must be used within a data router. See https://reactrouter.com/en/main/routers/picking-a-router.`;
2000
- }
2001
- function useDataRouterContext3(hookName) {
2002
- let ctx = React3.useContext(DataRouterContext);
2003
- invariant(ctx, getDataRouterConsoleError2(hookName));
2004
- return ctx;
2005
- }
2006
- function useLinkClickHandler(to, {
2007
- target,
2008
- replace: replaceProp,
2009
- state,
2010
- preventScrollReset,
2011
- relative,
2012
- viewTransition,
2013
- unstable_defaultShouldRevalidate,
2014
- unstable_useTransitions
2015
- } = {}) {
2016
- let navigate = useNavigate();
2017
- let location = useLocation();
2018
- let path = useResolvedPath(to, { relative });
2019
- return React3.useCallback(
2020
- (event) => {
2021
- if (shouldProcessLinkClick(event, target)) {
2022
- event.preventDefault();
2023
- let replace2 = replaceProp !== void 0 ? replaceProp : createPath(location) === createPath(path);
2024
- let doNavigate = () => navigate(to, {
2025
- replace: replace2,
2026
- state,
2027
- preventScrollReset,
2028
- relative,
2029
- viewTransition,
2030
- unstable_defaultShouldRevalidate
2031
- });
2032
- if (unstable_useTransitions) {
2033
- React3.startTransition(() => doNavigate());
2034
- } else {
2035
- doNavigate();
2036
- }
2037
- }
2038
- },
2039
- [
2040
- location,
2041
- navigate,
2042
- path,
2043
- replaceProp,
2044
- state,
2045
- target,
2046
- to,
2047
- preventScrollReset,
2048
- relative,
2049
- viewTransition,
2050
- unstable_defaultShouldRevalidate,
2051
- unstable_useTransitions
2052
- ]
2053
- );
2054
- }
2055
- var fetcherId = 0;
2056
- var getUniqueFetcherId = () => `__${String(++fetcherId)}__`;
2057
- function useSubmit() {
2058
- let { router } = useDataRouterContext3("useSubmit" /* UseSubmit */);
2059
- let { basename } = React3.useContext(NavigationContext);
2060
- let currentRouteId = useRouteId();
2061
- let routerFetch = router.fetch;
2062
- let routerNavigate = router.navigate;
2063
- return React3.useCallback(
2064
- async (target, options = {}) => {
2065
- let { action, method, encType, formData, body } = getFormSubmissionInfo(
2066
- target,
2067
- basename
2068
- );
2069
- if (options.navigate === false) {
2070
- let key = options.fetcherKey || getUniqueFetcherId();
2071
- await routerFetch(key, currentRouteId, options.action || action, {
2072
- unstable_defaultShouldRevalidate: options.unstable_defaultShouldRevalidate,
2073
- preventScrollReset: options.preventScrollReset,
2074
- formData,
2075
- body,
2076
- formMethod: options.method || method,
2077
- formEncType: options.encType || encType,
2078
- flushSync: options.flushSync
2079
- });
2080
- } else {
2081
- await routerNavigate(options.action || action, {
2082
- unstable_defaultShouldRevalidate: options.unstable_defaultShouldRevalidate,
2083
- preventScrollReset: options.preventScrollReset,
2084
- formData,
2085
- body,
2086
- formMethod: options.method || method,
2087
- formEncType: options.encType || encType,
2088
- replace: options.replace,
2089
- state: options.state,
2090
- fromRouteId: currentRouteId,
2091
- flushSync: options.flushSync,
2092
- viewTransition: options.viewTransition
2093
- });
2094
- }
2095
- },
2096
- [routerFetch, routerNavigate, basename, currentRouteId]
2097
- );
2098
- }
2099
- function useFormAction(action, { relative } = {}) {
2100
- let { basename } = React3.useContext(NavigationContext);
2101
- let routeContext = React3.useContext(RouteContext);
2102
- invariant(routeContext, "useFormAction must be used inside a RouteContext");
2103
- let [match] = routeContext.matches.slice(-1);
2104
- let path = { ...useResolvedPath(action ? action : ".", { relative }) };
2105
- let location = useLocation();
2106
- if (action == null) {
2107
- path.search = location.search;
2108
- let params = new URLSearchParams(path.search);
2109
- let indexValues = params.getAll("index");
2110
- let hasNakedIndexParam = indexValues.some((v) => v === "");
2111
- if (hasNakedIndexParam) {
2112
- params.delete("index");
2113
- indexValues.filter((v) => v).forEach((v) => params.append("index", v));
2114
- let qs = params.toString();
2115
- path.search = qs ? `?${qs}` : "";
2116
- }
2117
- }
2118
- if ((!action || action === ".") && match.route.index) {
2119
- path.search = path.search ? path.search.replace(/^\?/, "?index&") : "?index";
2120
- }
2121
- if (basename !== "/") {
2122
- path.pathname = path.pathname === "/" ? basename : joinPaths([basename, path.pathname]);
2123
- }
2124
- return createPath(path);
2125
- }
2126
- function useViewTransitionState(to, { relative } = {}) {
2127
- let vtContext = React3.useContext(ViewTransitionContext);
2128
- invariant(
2129
- vtContext != null,
2130
- "`useViewTransitionState` must be used within `react-router-dom`'s `RouterProvider`. Did you accidentally import `RouterProvider` from `react-router`?"
2131
- );
2132
- let { basename } = useDataRouterContext3(
2133
- "useViewTransitionState" /* useViewTransitionState */
2134
- );
2135
- let path = useResolvedPath(to, { relative });
2136
- if (!vtContext.isTransitioning) {
2137
- return false;
2138
- }
2139
- let currentPath = stripBasename(vtContext.currentLocation.pathname, basename) || vtContext.currentLocation.pathname;
2140
- let nextPath = stripBasename(vtContext.nextLocation.pathname, basename) || vtContext.nextLocation.pathname;
2141
- return matchPath(path.pathname, nextPath) != null || matchPath(path.pathname, currentPath) != null;
2142
- }
2143
-
2144
- var css_248z = ".quix_side_menu{border-right:1px solid #333;.sidemenu_bottom_section{align-items:center;display:flex;flex-direction:column;height:80%;justify-content:center;position:relative;width:100%;.items{bottom:20px;cursor:pointer;height:auto;position:absolute;width:100%}}}.quix_menu_item{align-items:center;border-radius:4px;cursor:pointer;display:flex;height:48px;justify-content:space-between;opacity:100%;width:90%}";
223
+ var css_248z = ".quix_side_menu{border-right:1px solid #333;.sidemenu_bottom_section{align-items:center;display:flex;flex-direction:column;height:80%;justify-content:center;position:relative;width:100%;.items{bottom:20px;cursor:pointer;height:auto;position:absolute;width:100%}}}.quix_menu_item{align-items:center;border-radius:4px;cursor:pointer;display:flex;height:48px;justify-content:space-between;opacity:100%;width:90%}a{text-decoration:none}";
2145
224
  styleInject(css_248z);
2146
225
 
2147
226
  // ../node_modules/@babel/runtime/helpers/esm/extends.js
@@ -3461,10 +1540,10 @@ function serializeStyles(args, registered, mergedProps) {
3461
1540
  }
3462
1541
  var syncFallback = function(create3) {
3463
1542
  return create3();
3464
- }, useInsertionEffect2 = React3.useInsertionEffect ? React3.useInsertionEffect : false, useInsertionEffectAlwaysWithSyncFallback = useInsertionEffect2 || syncFallback, useInsertionEffectWithLayoutFallback = useInsertionEffect2 || React3.useLayoutEffect;
1543
+ }, useInsertionEffect2 = React2.useInsertionEffect ? React2.useInsertionEffect : false, useInsertionEffectAlwaysWithSyncFallback = useInsertionEffect2 || syncFallback, useInsertionEffectWithLayoutFallback = useInsertionEffect2 || React2.useLayoutEffect;
3465
1544
 
3466
1545
  // ../node_modules/@emotion/react/dist/emotion-element-f0de968e.browser.esm.js
3467
- var EmotionCacheContext = React3.createContext(
1546
+ var EmotionCacheContext = React2.createContext(
3468
1547
  // we're doing this to avoid preconstruct's dead code elimination in this one case
3469
1548
  // because this module is primarily intended for the browser and node
3470
1549
  // but it's also required in react native and similar environments sometimes
@@ -3480,7 +1559,7 @@ var withEmotionCache = function(func) {
3480
1559
  var cache = useContext(EmotionCacheContext);
3481
1560
  return func(props, cache, ref);
3482
1561
  });
3483
- }, ThemeContext = React3.createContext({});
1562
+ }, ThemeContext = React2.createContext({});
3484
1563
  var hasOwn = {}.hasOwnProperty, typePropName = "__EMOTION_TYPE_PLEASE_DO_NOT_USE__", createEmotionProps = function(type, props) {
3485
1564
  var newProps = {};
3486
1565
  for (var _key in props)
@@ -3496,33 +1575,33 @@ var hasOwn = {}.hasOwnProperty, typePropName = "__EMOTION_TYPE_PLEASE_DO_NOT_USE
3496
1575
  typeof cssProp == "string" && cache.registered[cssProp] !== void 0 && (cssProp = cache.registered[cssProp]);
3497
1576
  var WrappedComponent = props[typePropName], registeredStyles = [cssProp], className = "";
3498
1577
  typeof props.className == "string" ? className = getRegisteredStyles(cache.registered, registeredStyles, props.className) : props.className != null && (className = props.className + " ");
3499
- var serialized = serializeStyles(registeredStyles, void 0, React3.useContext(ThemeContext));
1578
+ var serialized = serializeStyles(registeredStyles, void 0, React2.useContext(ThemeContext));
3500
1579
  className += cache.key + "-" + serialized.name;
3501
1580
  var newProps = {};
3502
1581
  for (var _key2 in props)
3503
1582
  hasOwn.call(props, _key2) && _key2 !== "css" && _key2 !== typePropName && true && (newProps[_key2] = props[_key2]);
3504
- return newProps.className = className, ref && (newProps.ref = ref), React3.createElement(React3.Fragment, null, React3.createElement(Insertion, {
1583
+ return newProps.className = className, ref && (newProps.ref = ref), React2.createElement(React2.Fragment, null, React2.createElement(Insertion, {
3505
1584
  cache,
3506
1585
  serialized,
3507
1586
  isStringTag: typeof WrappedComponent == "string"
3508
- }), React3.createElement(WrappedComponent, newProps));
1587
+ }), React2.createElement(WrappedComponent, newProps));
3509
1588
  }), Emotion$1 = Emotion;
3510
1589
  __toESM(require_hoist_non_react_statics_cjs()); var jsx = function(type, props) {
3511
1590
  var args = arguments;
3512
1591
  if (props == null || !hasOwn.call(props, "css"))
3513
- return React3.createElement.apply(void 0, args);
1592
+ return React2.createElement.apply(void 0, args);
3514
1593
  var argsLength = args.length, createElementArgArray = new Array(argsLength);
3515
1594
  createElementArgArray[0] = Emotion$1, createElementArgArray[1] = createEmotionProps(type, props);
3516
1595
  for (var i = 2; i < argsLength; i++)
3517
1596
  createElementArgArray[i] = args[i];
3518
- return React3.createElement.apply(null, createElementArgArray);
1597
+ return React2.createElement.apply(null, createElementArgArray);
3519
1598
  };
3520
1599
  (function(_jsx) {
3521
1600
  var JSX;
3522
1601
  JSX || (JSX = _jsx.JSX || (_jsx.JSX = {}));
3523
1602
  })(jsx || (jsx = {}));
3524
1603
  withEmotionCache(function(props, cache) {
3525
- var styles = props.styles, serialized = serializeStyles([styles], void 0, React3.useContext(ThemeContext)), sheetRef = React3.useRef();
1604
+ var styles = props.styles, serialized = serializeStyles([styles], void 0, React2.useContext(ThemeContext)), sheetRef = React2.useRef();
3526
1605
  return useInsertionEffectWithLayoutFallback(function() {
3527
1606
  var key = cache.key + "-global", sheet = new cache.sheet.constructor({
3528
1607
  key,
@@ -3611,9 +1690,9 @@ var Insertion3 = function(_ref) {
3611
1690
  }, content = {
3612
1691
  css: css2,
3613
1692
  cx,
3614
- theme: React3.useContext(ThemeContext)
1693
+ theme: React2.useContext(ThemeContext)
3615
1694
  }, ele = props.children(content);
3616
- return React3.createElement(React3.Fragment, null, React3.createElement(Insertion3, {
1695
+ return React2.createElement(React2.Fragment, null, React2.createElement(Insertion3, {
3617
1696
  cache,
3618
1697
  serializedArr
3619
1698
  }), ele);
@@ -3669,7 +1748,7 @@ var testOmitPropsOnStringTag = isPropValid, testOmitPropsOnComponent = function(
3669
1748
  mergedProps = {};
3670
1749
  for (var key in props)
3671
1750
  mergedProps[key] = props[key];
3672
- mergedProps.theme = React3.useContext(ThemeContext);
1751
+ mergedProps.theme = React2.useContext(ThemeContext);
3673
1752
  }
3674
1753
  typeof props.className == "string" ? className = getRegisteredStyles(cache.registered, classInterpolations, props.className) : props.className != null && (className = props.className + " ");
3675
1754
  var serialized = serializeStyles(styles.concat(classInterpolations), cache.registered, mergedProps);
@@ -3677,11 +1756,11 @@ var testOmitPropsOnStringTag = isPropValid, testOmitPropsOnComponent = function(
3677
1756
  var finalShouldForwardProp = shouldUseAs && shouldForwardProp === void 0 ? getDefaultShouldForwardProp(FinalTag) : defaultShouldForwardProp, newProps = {};
3678
1757
  for (var _key in props)
3679
1758
  shouldUseAs && _key === "as" || finalShouldForwardProp(_key) && (newProps[_key] = props[_key]);
3680
- return newProps.className = className, ref && (newProps.ref = ref), React3.createElement(React3.Fragment, null, React3.createElement(Insertion5, {
1759
+ return newProps.className = className, ref && (newProps.ref = ref), React2.createElement(React2.Fragment, null, React2.createElement(Insertion5, {
3681
1760
  cache,
3682
1761
  serialized,
3683
1762
  isStringTag: typeof FinalTag == "string"
3684
- }), React3.createElement(FinalTag, newProps));
1763
+ }), React2.createElement(FinalTag, newProps));
3685
1764
  });
3686
1765
  return Styled.displayName = identifierName !== void 0 ? identifierName : "Styled(" + (typeof baseTag == "string" ? baseTag : baseTag.displayName || baseTag.name || "Component") + ")", Styled.defaultProps = tag.defaultProps, Styled.__emotion_real = Styled, Styled.__emotion_base = baseTag, Styled.__emotion_styles = styles, Styled.__emotion_forwardProp = shouldForwardProp, Object.defineProperty(Styled, "toString", {
3687
1766
  value: function() {
@@ -4023,6 +2102,7 @@ function Layout(props) {
4023
2102
  var size = useViewportSize();
4024
2103
  var LayoutSection = styled.section(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n width:", "\n "])), layoutStyle === null || layoutStyle === void 0 ? void 0 : layoutStyle.width);
4025
2104
  var Content = styled.section(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n\n "])));
2105
+ var navigate = useNavigate();
4026
2106
  function SideMenu(props) {
4027
2107
  var _sideMenuStyle$left, _menuItemStyle$width$, _menuItemStyle$width, _sideMenuStyle$bottom, _props$top, _menuItemStyle$width2;
4028
2108
  var _props$sideMenu = props.sideMenu,
@@ -4079,9 +2159,6 @@ function Layout(props) {
4079
2159
  menuItemStyle = _ref.menuItemStyle;
4080
2160
  var windowWidth = size.width;
4081
2161
  var MenuItemElement = styled.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n background-color:", ";\n color:", ";\n\n &:hover{\n background-color:", ";\n color:", "\n }\n "])), (_menuItemsDynamicStyl = menuItemsDynamicStyle === null || menuItemsDynamicStyle === void 0 ? void 0 : menuItemsDynamicStyle.backgroundColor) !== null && _menuItemsDynamicStyl !== void 0 ? _menuItemsDynamicStyl : '#d4d4d480', (_menuItemsDynamicStyl2 = menuItemsDynamicStyle === null || menuItemsDynamicStyle === void 0 ? void 0 : menuItemsDynamicStyle.textColor) !== null && _menuItemsDynamicStyl2 !== void 0 ? _menuItemsDynamicStyl2 : "#121212", (_menuItemsDynamicStyl3 = menuItemsDynamicStyle === null || menuItemsDynamicStyle === void 0 || (_menuItemsDynamicStyl4 = menuItemsDynamicStyle.activeColor) === null || _menuItemsDynamicStyl4 === void 0 ? void 0 : _menuItemsDynamicStyl4.background) !== null && _menuItemsDynamicStyl3 !== void 0 ? _menuItemsDynamicStyl3 : '#d4d4d4', (_menuItemsDynamicStyl5 = menuItemsDynamicStyle === null || menuItemsDynamicStyle === void 0 || (_menuItemsDynamicStyl6 = menuItemsDynamicStyle.activeColor) === null || _menuItemsDynamicStyl6 === void 0 ? void 0 : _menuItemsDynamicStyl6.text) !== null && _menuItemsDynamicStyl5 !== void 0 ? _menuItemsDynamicStyl5 : "#121212");
4082
- var navigate = function navigate(route) {
4083
- window.location.replace(route);
4084
- };
4085
2162
  var Element = function Element(_ref2) {
4086
2163
  var children = _ref2.children;
4087
2164
  return ElementType === 'NavLink' ? jsx$1(NavLink, {
@@ -4139,7 +2216,6 @@ function Layout(props) {
4139
2216
  }, item.label)
4140
2217
  }, item.label);
4141
2218
  }
4142
- // console.log( (size.width) - ((size.width < 450 ? Number(sideMenu?.width.mobile) : size.width < 850 ? Number(sideMenu?.width.tablet) : size.width > 850 ? Number(sideMenu?.width.desktop) : Number(sideMenu?.width.desktop)) + 30))
4143
2219
  return jsxs(LayoutSection, {
4144
2220
  className: "".concat(className),
4145
2221
  style: _objectSpread2({
@@ -4170,20 +2246,7 @@ function Layout(props) {
4170
2246
  }
4171
2247
 
4172
2248
  export { Buttons, FlexView, Layout };
4173
- header.children && (header === null || header === void 0 ? void 0 : header.children())
4174
- }), sideMenu && SideMenu({
4175
- sideMenu: sideMenu,
4176
- top: ((_header$height = header === null || header === void 0 ? void 0 : header.height) !== null && _header$height !== void 0 ? _header$height : 80) + 20
4177
- }), jsxRuntime.jsx(Content, {
4178
- style: {
4179
- position: 'absolute',
4180
- left: size.width < 450 ? 0 : size.width < 850 ? sideMenu === null || sideMenu === void 0 ? void 0 : sideMenu.width.tablet : size.width > 850 ? sideMenu === null || sideMenu === void 0 ? void 0 : sideMenu.width.desktop : 300,
4181
- top: ((_header$height2 = header === null || header === void 0 ? void 0 : header.height) !== null && _header$height2 !== void 0 ? _header$height2 : 80) + 20,
4182
- padding: 10,
4183
- height: Number(size.height) - (Number(header === null || header === void 0 ? void 0 : header.height) + 70),
4184
- margin: 5,
4185
- zIndex: 10,
4186
- width: size.width - ((size.width < 450 ? Number(0) : size.width < 850 ? Number((_sideMenu$width$table = sideMenu === null || sideMenu === void 0 || (_sideMenu$width = sideMenu.width) === null || _sideMenu$width === void 0 ? void 0 : _sideMenu$width.tablet) !== null && _sideMenu$width$table !== void 0 ? _sideMenu$width$table : 60) : size.width > 850 ? Number((_sideMenu$width$deskt = sideMenu === null || sideMenu === void 0 || (_sideMenu$width2 = sideMenu.width) === null || _sideMenu$width2 === void 0 ? void 0 : _sideMenu$width2.desktop) !== null && _sideMenu$width$deskt !== void 0 ? _sideMenu$width$deskt : 300) : Number((_sideMenu$width$deskt2 = sideMenu === null || sideMenu === void 0 || (_sideMenu$width3 = sideMenu.width) === null || _sideMenu$width3 === void 0 ? void 0 : _sideMenu$width3.desktop) !== null && _sideMenu$width$deskt2 !== void 0 ? _sideMenu$width$deskt2 : 300)) + 30)
2249
+ Menu === null || sideMenu === void 0 || (_sideMenu$width = sideMenu.width) === null || _sideMenu$width === void 0 ? void 0 : _sideMenu$width.tablet) !== null && _sideMenu$width$table !== void 0 ? _sideMenu$width$table : 60) : size.width > 850 ? Number((_sideMenu$width$deskt = sideMenu === null || sideMenu === void 0 || (_sideMenu$width2 = sideMenu.width) === null || _sideMenu$width2 === void 0 ? void 0 : _sideMenu$width2.desktop) !== null && _sideMenu$width$deskt !== void 0 ? _sideMenu$width$deskt : 300) : Number((_sideMenu$width$deskt2 = sideMenu === null || sideMenu === void 0 || (_sideMenu$width3 = sideMenu.width) === null || _sideMenu$width3 === void 0 ? void 0 : _sideMenu$width3.desktop) !== null && _sideMenu$width$deskt2 !== void 0 ? _sideMenu$width$deskt2 : 300)) + 30)
4187
2250
  },
4188
2251
  children: content && content()
4189
2252
  })]