From eb94c6995b53da95e346f108df08fbb972e98410 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Ramirez=20Vargas=2C=20Jos=C3=A9=20Pablo?= Date: Sun, 23 Nov 2025 21:33:16 -0600 Subject: [PATCH] chore(demo): Update demo --- demo/index.html | 1 - demo/package-lock.json | 224 +++++++------- demo/src/App.svelte | 64 ++-- demo/src/app.scss | 16 + demo/src/lib/Breadcrumb.svelte | 25 ++ demo/src/lib/BreadcrumbItem.svelte | 15 + demo/src/lib/CodeSnippet.svelte | 63 ++-- demo/src/lib/DemoBc.svelte | 32 ++ demo/src/lib/NavBar.svelte | 26 +- demo/src/lib/SubNav.svelte | 17 +- demo/src/lib/ThemeSwitch.svelte | 28 ++ demo/src/lib/demo/DemoView.svelte | 4 +- demo/src/lib/state/theme.svelte.ts | 38 +++ demo/src/lib/state/title.svelte.ts | 33 +++ demo/src/lib/views/ViewSkeleton.svelte | 4 +- .../views/hash-routing/HashRoutingDemo.svelte | 80 ++--- .../views/hash-routing/HashRoutingView.svelte | 138 +-------- .../lib/views/hash-routing/InCodeView.svelte | 124 ++++++++ demo/src/lib/views/home/Hero.svelte | 11 +- demo/src/lib/views/home/HomeView.svelte | 280 +++++++++--------- .../views/path-routing/views/HomeView.svelte | 3 + .../views/redirected/RedirectedView.svelte | 28 ++ 22 files changed, 738 insertions(+), 516 deletions(-) create mode 100644 demo/src/lib/Breadcrumb.svelte create mode 100644 demo/src/lib/BreadcrumbItem.svelte create mode 100644 demo/src/lib/DemoBc.svelte create mode 100644 demo/src/lib/ThemeSwitch.svelte create mode 100644 demo/src/lib/state/theme.svelte.ts create mode 100644 demo/src/lib/state/title.svelte.ts create mode 100644 demo/src/lib/views/hash-routing/InCodeView.svelte create mode 100644 demo/src/lib/views/redirected/RedirectedView.svelte diff --git a/demo/index.html b/demo/index.html index b6c5f0a..aa26e29 100644 --- a/demo/index.html +++ b/demo/index.html @@ -4,7 +4,6 @@ - Vite + Svelte + TS
diff --git a/demo/package-lock.json b/demo/package-lock.json index 0b8c629..c67da82 100644 --- a/demo/package-lock.json +++ b/demo/package-lock.json @@ -862,9 +862,9 @@ } }, "node_modules/@rollup/rollup-android-arm-eabi": { - "version": "4.53.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.53.2.tgz", - "integrity": "sha512-yDPzwsgiFO26RJA4nZo8I+xqzh7sJTZIWQOxn+/XOdPE31lAvLIYCKqjV+lNH/vxE2L2iH3plKxDCRK6i+CwhA==", + "version": "4.53.3", + "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.53.3.tgz", + "integrity": "sha512-mRSi+4cBjrRLoaal2PnqH82Wqyb+d3HsPUN/W+WslCXsZsyHa9ZeQQX/pQsZaVIWDkPcpV6jJ+3KLbTbgnwv8w==", "cpu": [ "arm" ], @@ -876,9 +876,9 @@ ] }, "node_modules/@rollup/rollup-android-arm64": { - "version": "4.53.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.53.2.tgz", - "integrity": "sha512-k8FontTxIE7b0/OGKeSN5B6j25EuppBcWM33Z19JoVT7UTXFSo3D9CdU39wGTeb29NO3XxpMNauh09B+Ibw+9g==", + "version": "4.53.3", + "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.53.3.tgz", + "integrity": "sha512-CbDGaMpdE9sh7sCmTrTUyllhrg65t6SwhjlMJsLr+J8YjFuPmCEjbBSx4Z/e4SmDyH3aB5hGaJUP2ltV/vcs4w==", "cpu": [ "arm64" ], @@ -890,9 +890,9 @@ ] }, "node_modules/@rollup/rollup-darwin-arm64": { - "version": "4.53.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.53.2.tgz", - "integrity": "sha512-A6s4gJpomNBtJ2yioj8bflM2oogDwzUiMl2yNJ2v9E7++sHrSrsQ29fOfn5DM/iCzpWcebNYEdXpaK4tr2RhfQ==", + "version": "4.53.3", + "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.53.3.tgz", + "integrity": "sha512-Nr7SlQeqIBpOV6BHHGZgYBuSdanCXuw09hon14MGOLGmXAFYjx1wNvquVPmpZnl0tLjg25dEdr4IQ6GgyToCUA==", "cpu": [ "arm64" ], @@ -904,9 +904,9 @@ ] }, "node_modules/@rollup/rollup-darwin-x64": { - "version": "4.53.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.53.2.tgz", - "integrity": "sha512-e6XqVmXlHrBlG56obu9gDRPW3O3hLxpwHpLsBJvuI8qqnsrtSZ9ERoWUXtPOkY8c78WghyPHZdmPhHLWNdAGEw==", + "version": "4.53.3", + "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.53.3.tgz", + "integrity": "sha512-DZ8N4CSNfl965CmPktJ8oBnfYr3F8dTTNBQkRlffnUarJ2ohudQD17sZBa097J8xhQ26AwhHJ5mvUyQW8ddTsQ==", "cpu": [ "x64" ], @@ -918,9 +918,9 @@ ] }, "node_modules/@rollup/rollup-freebsd-arm64": { - "version": "4.53.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-arm64/-/rollup-freebsd-arm64-4.53.2.tgz", - "integrity": "sha512-v0E9lJW8VsrwPux5Qe5CwmH/CF/2mQs6xU1MF3nmUxmZUCHazCjLgYvToOk+YuuUqLQBio1qkkREhxhc656ViA==", + "version": "4.53.3", + "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-arm64/-/rollup-freebsd-arm64-4.53.3.tgz", + "integrity": "sha512-yMTrCrK92aGyi7GuDNtGn2sNW+Gdb4vErx4t3Gv/Tr+1zRb8ax4z8GWVRfr3Jw8zJWvpGHNpss3vVlbF58DZ4w==", "cpu": [ "arm64" ], @@ -932,9 +932,9 @@ ] }, "node_modules/@rollup/rollup-freebsd-x64": { - "version": "4.53.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-x64/-/rollup-freebsd-x64-4.53.2.tgz", - "integrity": "sha512-ClAmAPx3ZCHtp6ysl4XEhWU69GUB1D+s7G9YjHGhIGCSrsg00nEGRRZHmINYxkdoJehde8VIsDC5t9C0gb6yqA==", + "version": "4.53.3", + "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-x64/-/rollup-freebsd-x64-4.53.3.tgz", + "integrity": "sha512-lMfF8X7QhdQzseM6XaX0vbno2m3hlyZFhwcndRMw8fbAGUGL3WFMBdK0hbUBIUYcEcMhVLr1SIamDeuLBnXS+Q==", "cpu": [ "x64" ], @@ -946,9 +946,9 @@ ] }, "node_modules/@rollup/rollup-linux-arm-gnueabihf": { - "version": "4.53.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.53.2.tgz", - "integrity": "sha512-EPlb95nUsz6Dd9Qy13fI5kUPXNSljaG9FiJ4YUGU1O/Q77i5DYFW5KR8g1OzTcdZUqQQ1KdDqsTohdFVwCwjqg==", + "version": "4.53.3", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.53.3.tgz", + "integrity": "sha512-k9oD15soC/Ln6d2Wv/JOFPzZXIAIFLp6B+i14KhxAfnq76ajt0EhYc5YPeX6W1xJkAdItcVT+JhKl1QZh44/qw==", "cpu": [ "arm" ], @@ -960,9 +960,9 @@ ] }, "node_modules/@rollup/rollup-linux-arm-musleabihf": { - "version": "4.53.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-musleabihf/-/rollup-linux-arm-musleabihf-4.53.2.tgz", - "integrity": "sha512-BOmnVW+khAUX+YZvNfa0tGTEMVVEerOxN0pDk2E6N6DsEIa2Ctj48FOMfNDdrwinocKaC7YXUZ1pHlKpnkja/Q==", + "version": "4.53.3", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-musleabihf/-/rollup-linux-arm-musleabihf-4.53.3.tgz", + "integrity": "sha512-vTNlKq+N6CK/8UktsrFuc+/7NlEYVxgaEgRXVUVK258Z5ymho29skzW1sutgYjqNnquGwVUObAaxae8rZ6YMhg==", "cpu": [ "arm" ], @@ -974,9 +974,9 @@ ] }, "node_modules/@rollup/rollup-linux-arm64-gnu": { - "version": "4.53.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.53.2.tgz", - "integrity": "sha512-Xt2byDZ+6OVNuREgBXr4+CZDJtrVso5woFtpKdGPhpTPHcNG7D8YXeQzpNbFRxzTVqJf7kvPMCub/pcGUWgBjA==", + "version": "4.53.3", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.53.3.tgz", + "integrity": "sha512-RGrFLWgMhSxRs/EWJMIFM1O5Mzuz3Xy3/mnxJp/5cVhZ2XoCAxJnmNsEyeMJtpK+wu0FJFWz+QF4mjCA7AUQ3w==", "cpu": [ "arm64" ], @@ -988,9 +988,9 @@ ] }, "node_modules/@rollup/rollup-linux-arm64-musl": { - "version": "4.53.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.53.2.tgz", - "integrity": "sha512-+LdZSldy/I9N8+klim/Y1HsKbJ3BbInHav5qE9Iy77dtHC/pibw1SR/fXlWyAk0ThnpRKoODwnAuSjqxFRDHUQ==", + "version": "4.53.3", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.53.3.tgz", + "integrity": "sha512-kASyvfBEWYPEwe0Qv4nfu6pNkITLTb32p4yTgzFCocHnJLAHs+9LjUu9ONIhvfT/5lv4YS5muBHyuV84epBo/A==", "cpu": [ "arm64" ], @@ -1002,9 +1002,9 @@ ] }, "node_modules/@rollup/rollup-linux-loong64-gnu": { - "version": "4.53.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-loong64-gnu/-/rollup-linux-loong64-gnu-4.53.2.tgz", - "integrity": "sha512-8ms8sjmyc1jWJS6WdNSA23rEfdjWB30LH8Wqj0Cqvv7qSHnvw6kgMMXRdop6hkmGPlyYBdRPkjJnj3KCUHV/uQ==", + "version": "4.53.3", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-loong64-gnu/-/rollup-linux-loong64-gnu-4.53.3.tgz", + "integrity": "sha512-JiuKcp2teLJwQ7vkJ95EwESWkNRFJD7TQgYmCnrPtlu50b4XvT5MOmurWNrCj3IFdyjBQ5p9vnrX4JM6I8OE7g==", "cpu": [ "loong64" ], @@ -1016,9 +1016,9 @@ ] }, "node_modules/@rollup/rollup-linux-ppc64-gnu": { - "version": "4.53.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-ppc64-gnu/-/rollup-linux-ppc64-gnu-4.53.2.tgz", - "integrity": "sha512-3HRQLUQbpBDMmzoxPJYd3W6vrVHOo2cVW8RUo87Xz0JPJcBLBr5kZ1pGcQAhdZgX9VV7NbGNipah1omKKe23/g==", + "version": "4.53.3", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-ppc64-gnu/-/rollup-linux-ppc64-gnu-4.53.3.tgz", + "integrity": "sha512-EoGSa8nd6d3T7zLuqdojxC20oBfNT8nexBbB/rkxgKj5T5vhpAQKKnD+h3UkoMuTyXkP5jTjK/ccNRmQrPNDuw==", "cpu": [ "ppc64" ], @@ -1030,9 +1030,9 @@ ] }, "node_modules/@rollup/rollup-linux-riscv64-gnu": { - "version": "4.53.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.53.2.tgz", - "integrity": "sha512-fMjKi+ojnmIvhk34gZP94vjogXNNUKMEYs+EDaB/5TG/wUkoeua7p7VCHnE6T2Tx+iaghAqQX8teQzcvrYpaQA==", + "version": "4.53.3", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.53.3.tgz", + "integrity": "sha512-4s+Wped2IHXHPnAEbIB0YWBv7SDohqxobiiPA1FIWZpX+w9o2i4LezzH/NkFUl8LRci/8udci6cLq+jJQlh+0g==", "cpu": [ "riscv64" ], @@ -1044,9 +1044,9 @@ ] }, "node_modules/@rollup/rollup-linux-riscv64-musl": { - "version": "4.53.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-musl/-/rollup-linux-riscv64-musl-4.53.2.tgz", - "integrity": "sha512-XuGFGU+VwUUV5kLvoAdi0Wz5Xbh2SrjIxCtZj6Wq8MDp4bflb/+ThZsVxokM7n0pcbkEr2h5/pzqzDYI7cCgLQ==", + "version": "4.53.3", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-musl/-/rollup-linux-riscv64-musl-4.53.3.tgz", + "integrity": "sha512-68k2g7+0vs2u9CxDt5ktXTngsxOQkSEV/xBbwlqYcUrAVh6P9EgMZvFsnHy4SEiUl46Xf0IObWVbMvPrr2gw8A==", "cpu": [ "riscv64" ], @@ -1058,9 +1058,9 @@ ] }, "node_modules/@rollup/rollup-linux-s390x-gnu": { - "version": "4.53.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.53.2.tgz", - "integrity": "sha512-w6yjZF0P+NGzWR3AXWX9zc0DNEGdtvykB03uhonSHMRa+oWA6novflo2WaJr6JZakG2ucsyb+rvhrKac6NIy+w==", + "version": "4.53.3", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.53.3.tgz", + "integrity": "sha512-VYsFMpULAz87ZW6BVYw3I6sWesGpsP9OPcyKe8ofdg9LHxSbRMd7zrVrr5xi/3kMZtpWL/wC+UIJWJYVX5uTKg==", "cpu": [ "s390x" ], @@ -1072,9 +1072,9 @@ ] }, "node_modules/@rollup/rollup-linux-x64-gnu": { - "version": "4.53.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.53.2.tgz", - "integrity": "sha512-yo8d6tdfdeBArzC7T/PnHd7OypfI9cbuZzPnzLJIyKYFhAQ8SvlkKtKBMbXDxe1h03Rcr7u++nFS7tqXz87Gtw==", + "version": "4.53.3", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.53.3.tgz", + "integrity": "sha512-3EhFi1FU6YL8HTUJZ51imGJWEX//ajQPfqWLI3BQq4TlvHy4X0MOr5q3D2Zof/ka0d5FNdPwZXm3Yyib/UEd+w==", "cpu": [ "x64" ], @@ -1086,9 +1086,9 @@ ] }, "node_modules/@rollup/rollup-linux-x64-musl": { - "version": "4.53.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.53.2.tgz", - "integrity": "sha512-ah59c1YkCxKExPP8O9PwOvs+XRLKwh/mV+3YdKqQ5AMQ0r4M4ZDuOrpWkUaqO7fzAHdINzV9tEVu8vNw48z0lA==", + "version": "4.53.3", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.53.3.tgz", + "integrity": "sha512-eoROhjcc6HbZCJr+tvVT8X4fW3/5g/WkGvvmwz/88sDtSJzO7r/blvoBDgISDiCjDRZmHpwud7h+6Q9JxFwq1Q==", "cpu": [ "x64" ], @@ -1100,9 +1100,9 @@ ] }, "node_modules/@rollup/rollup-openharmony-arm64": { - "version": "4.53.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-openharmony-arm64/-/rollup-openharmony-arm64-4.53.2.tgz", - "integrity": "sha512-4VEd19Wmhr+Zy7hbUsFZ6YXEiP48hE//KPLCSVNY5RMGX2/7HZ+QkN55a3atM1C/BZCGIgqN+xrVgtdak2S9+A==", + "version": "4.53.3", + "resolved": "https://registry.npmjs.org/@rollup/rollup-openharmony-arm64/-/rollup-openharmony-arm64-4.53.3.tgz", + "integrity": "sha512-OueLAWgrNSPGAdUdIjSWXw+u/02BRTcnfw9PN41D2vq/JSEPnJnVuBgw18VkN8wcd4fjUs+jFHVM4t9+kBSNLw==", "cpu": [ "arm64" ], @@ -1114,9 +1114,9 @@ ] }, "node_modules/@rollup/rollup-win32-arm64-msvc": { - "version": "4.53.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.53.2.tgz", - "integrity": "sha512-IlbHFYc/pQCgew/d5fslcy1KEaYVCJ44G8pajugd8VoOEI8ODhtb/j8XMhLpwHCMB3yk2J07ctup10gpw2nyMA==", + "version": "4.53.3", + "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.53.3.tgz", + "integrity": "sha512-GOFuKpsxR/whszbF/bzydebLiXIHSgsEUp6M0JI8dWvi+fFa1TD6YQa4aSZHtpmh2/uAlj/Dy+nmby3TJ3pkTw==", "cpu": [ "arm64" ], @@ -1128,9 +1128,9 @@ ] }, "node_modules/@rollup/rollup-win32-ia32-msvc": { - "version": "4.53.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.53.2.tgz", - "integrity": "sha512-lNlPEGgdUfSzdCWU176ku/dQRnA7W+Gp8d+cWv73jYrb8uT7HTVVxq62DUYxjbaByuf1Yk0RIIAbDzp+CnOTFg==", + "version": "4.53.3", + "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.53.3.tgz", + "integrity": "sha512-iah+THLcBJdpfZ1TstDFbKNznlzoxa8fmnFYK4V67HvmuNYkVdAywJSoteUszvBQ9/HqN2+9AZghbajMsFT+oA==", "cpu": [ "ia32" ], @@ -1142,9 +1142,9 @@ ] }, "node_modules/@rollup/rollup-win32-x64-gnu": { - "version": "4.53.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-gnu/-/rollup-win32-x64-gnu-4.53.2.tgz", - "integrity": "sha512-S6YojNVrHybQis2lYov1sd+uj7K0Q05NxHcGktuMMdIQ2VixGwAfbJ23NnlvvVV1bdpR2m5MsNBViHJKcA4ADw==", + "version": "4.53.3", + "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-gnu/-/rollup-win32-x64-gnu-4.53.3.tgz", + "integrity": "sha512-J9QDiOIZlZLdcot5NXEepDkstocktoVjkaKUtqzgzpt2yWjGlbYiKyp05rWwk4nypbYUNoFAztEgixoLaSETkg==", "cpu": [ "x64" ], @@ -1156,9 +1156,9 @@ ] }, "node_modules/@rollup/rollup-win32-x64-msvc": { - "version": "4.53.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.53.2.tgz", - "integrity": "sha512-k+/Rkcyx//P6fetPoLMb8pBeqJBNGx81uuf7iljX9++yNBVRDQgD04L+SVXmXmh5ZP4/WOp4mWF0kmi06PW2tA==", + "version": "4.53.3", + "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.53.3.tgz", + "integrity": "sha512-UhTd8u31dXadv0MopwGgNOBpUVROFKWVQgAg5N1ESyCz8AuBcMqm4AuTjrwgQKGDfoFuz02EuMRHQIw/frmYKQ==", "cpu": [ "x64" ], @@ -1170,9 +1170,9 @@ ] }, "node_modules/@sveltejs/acorn-typescript": { - "version": "1.0.6", - "resolved": "https://registry.npmjs.org/@sveltejs/acorn-typescript/-/acorn-typescript-1.0.6.tgz", - "integrity": "sha512-4awhxtMh4cx9blePWl10HRHj8Iivtqj+2QdDCSMDzxG+XKa9+VCNupQuCuvzEhYPzZSrX+0gC+0lHA/0fFKKQQ==", + "version": "1.0.7", + "resolved": "https://registry.npmjs.org/@sveltejs/acorn-typescript/-/acorn-typescript-1.0.7.tgz", + "integrity": "sha512-znp1A/Y1Jj4l/Zy7PX5DZKBE0ZNY+5QBngiE21NJkfSTyzzC5iKNWOtwFXKtIrn7MXEFBck4jD95iBNkGjK92Q==", "dev": true, "license": "MIT", "peerDependencies": { @@ -1219,9 +1219,9 @@ } }, "node_modules/@tsconfig/svelte": { - "version": "5.0.5", - "resolved": "https://registry.npmjs.org/@tsconfig/svelte/-/svelte-5.0.5.tgz", - "integrity": "sha512-48fAnUjKye38FvMiNOj0J9I/4XlQQiZlpe9xaNPfe8vy2Y1hFBt8g1yqf2EGjVvHavo4jf2lC+TQyENCr4BJBQ==", + "version": "5.0.6", + "resolved": "https://registry.npmjs.org/@tsconfig/svelte/-/svelte-5.0.6.tgz", + "integrity": "sha512-yGxYL0I9eETH1/DR9qVJey4DAsCdeau4a9wYPKuXfEhm8lFO8wg+LLYJjIpAm6Fw7HSlhepPhYPDop75485yWQ==", "dev": true, "license": "MIT" }, @@ -1432,9 +1432,9 @@ "license": "MIT" }, "node_modules/esrap": { - "version": "2.1.2", - "resolved": "https://registry.npmjs.org/esrap/-/esrap-2.1.2.tgz", - "integrity": "sha512-DgvlIQeowRNyvLPWW4PT7Gu13WznY288Du086E751mwwbsgr29ytBiYeLzAGIo0qk3Ujob0SDk8TiSaM5WQzNg==", + "version": "2.1.3", + "resolved": "https://registry.npmjs.org/esrap/-/esrap-2.1.3.tgz", + "integrity": "sha512-T/Dhhv/QH+yYmiaLz9SA3PW+YyenlnRKDNdtlYJrSOBmNsH4nvPux+mTwx7p+wAedlJrGoZtXNI0a0MjQ2QkVg==", "dev": true, "license": "MIT", "dependencies": { @@ -1673,9 +1673,9 @@ } }, "node_modules/rollup": { - "version": "4.53.2", - "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.53.2.tgz", - "integrity": "sha512-MHngMYwGJVi6Fmnk6ISmnk7JAHRNF0UkuucA0CUW3N3a4KnONPEZz+vUanQP/ZC/iY1Qkf3bwPWzyY84wEks1g==", + "version": "4.53.3", + "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.53.3.tgz", + "integrity": "sha512-w8GmOxZfBmKknvdXU1sdM9NHcoQejwF/4mNgj2JuEEdRaHwwF12K7e9eXn1nLZ07ad+du76mkVsyeb2rKGllsA==", "dev": true, "license": "MIT", "dependencies": { @@ -1689,28 +1689,28 @@ "npm": ">=8.0.0" }, "optionalDependencies": { - "@rollup/rollup-android-arm-eabi": "4.53.2", - "@rollup/rollup-android-arm64": "4.53.2", - "@rollup/rollup-darwin-arm64": "4.53.2", - "@rollup/rollup-darwin-x64": "4.53.2", - "@rollup/rollup-freebsd-arm64": "4.53.2", - "@rollup/rollup-freebsd-x64": "4.53.2", - "@rollup/rollup-linux-arm-gnueabihf": "4.53.2", - "@rollup/rollup-linux-arm-musleabihf": "4.53.2", - "@rollup/rollup-linux-arm64-gnu": "4.53.2", - "@rollup/rollup-linux-arm64-musl": "4.53.2", - "@rollup/rollup-linux-loong64-gnu": "4.53.2", - "@rollup/rollup-linux-ppc64-gnu": "4.53.2", - "@rollup/rollup-linux-riscv64-gnu": "4.53.2", - "@rollup/rollup-linux-riscv64-musl": "4.53.2", - "@rollup/rollup-linux-s390x-gnu": "4.53.2", - "@rollup/rollup-linux-x64-gnu": "4.53.2", - "@rollup/rollup-linux-x64-musl": "4.53.2", - "@rollup/rollup-openharmony-arm64": "4.53.2", - "@rollup/rollup-win32-arm64-msvc": "4.53.2", - "@rollup/rollup-win32-ia32-msvc": "4.53.2", - "@rollup/rollup-win32-x64-gnu": "4.53.2", - "@rollup/rollup-win32-x64-msvc": "4.53.2", + "@rollup/rollup-android-arm-eabi": "4.53.3", + "@rollup/rollup-android-arm64": "4.53.3", + "@rollup/rollup-darwin-arm64": "4.53.3", + "@rollup/rollup-darwin-x64": "4.53.3", + "@rollup/rollup-freebsd-arm64": "4.53.3", + "@rollup/rollup-freebsd-x64": "4.53.3", + "@rollup/rollup-linux-arm-gnueabihf": "4.53.3", + "@rollup/rollup-linux-arm-musleabihf": "4.53.3", + "@rollup/rollup-linux-arm64-gnu": "4.53.3", + "@rollup/rollup-linux-arm64-musl": "4.53.3", + "@rollup/rollup-linux-loong64-gnu": "4.53.3", + "@rollup/rollup-linux-ppc64-gnu": "4.53.3", + "@rollup/rollup-linux-riscv64-gnu": "4.53.3", + "@rollup/rollup-linux-riscv64-musl": "4.53.3", + "@rollup/rollup-linux-s390x-gnu": "4.53.3", + "@rollup/rollup-linux-x64-gnu": "4.53.3", + "@rollup/rollup-linux-x64-musl": "4.53.3", + "@rollup/rollup-openharmony-arm64": "4.53.3", + "@rollup/rollup-win32-arm64-msvc": "4.53.3", + "@rollup/rollup-win32-ia32-msvc": "4.53.3", + "@rollup/rollup-win32-x64-gnu": "4.53.3", + "@rollup/rollup-win32-x64-msvc": "4.53.3", "fsevents": "~2.3.2" } }, @@ -1728,9 +1728,9 @@ } }, "node_modules/sass": { - "version": "1.94.0", - "resolved": "https://registry.npmjs.org/sass/-/sass-1.94.0.tgz", - "integrity": "sha512-Dqh7SiYcaFtdv5Wvku6QgS5IGPm281L+ZtVD1U2FJa7Q0EFRlq8Z3sjYtz6gYObsYThUOz9ArwFqPZx+1azILQ==", + "version": "1.94.2", + "resolved": "https://registry.npmjs.org/sass/-/sass-1.94.2.tgz", + "integrity": "sha512-N+7WK20/wOr7CzA2snJcUSSNTCzeCGUTFY3OgeQP3mZ1aj9NMQ0mSTXwlrnd89j33zzQJGqIN52GIOmYrfq46A==", "dev": true, "license": "MIT", "dependencies": { @@ -1759,9 +1759,9 @@ } }, "node_modules/svelte": { - "version": "5.43.5", - "resolved": "https://registry.npmjs.org/svelte/-/svelte-5.43.5.tgz", - "integrity": "sha512-HQoZArIewxQVNedseDsgMgnRSC4XOXczxXLF9rOJaPIJkg58INOPUiL8aEtzqZIXNSZJyw8NmqObwg/voajiHQ==", + "version": "5.43.14", + "resolved": "https://registry.npmjs.org/svelte/-/svelte-5.43.14.tgz", + "integrity": "sha512-pHeUrp1A5S6RGaXhJB7PtYjL1VVjbVrJ2EfuAoPu9/1LeoMaJa/pcdCsCSb0gS4eUHAHnhCbUDxORZyvGK6kOQ==", "dev": true, "license": "MIT", "dependencies": { @@ -1785,9 +1785,9 @@ } }, "node_modules/svelte-check": { - "version": "4.3.3", - "resolved": "https://registry.npmjs.org/svelte-check/-/svelte-check-4.3.3.tgz", - "integrity": "sha512-RYP0bEwenDXzfv0P1sKAwjZSlaRyqBn0Fz1TVni58lqyEiqgwztTpmodJrGzP6ZT2aHl4MbTvWP6gbmQ3FOnBg==", + "version": "4.3.4", + "resolved": "https://registry.npmjs.org/svelte-check/-/svelte-check-4.3.4.tgz", + "integrity": "sha512-DVWvxhBrDsd+0hHWKfjP99lsSXASeOhHJYyuKOFYJcP7ThfSCKgjVarE8XfuMWpS5JV3AlDf+iK1YGGo2TACdw==", "dev": true, "license": "MIT", "dependencies": { @@ -1927,9 +1927,9 @@ } }, "node_modules/vite": { - "version": "7.2.2", - "resolved": "https://registry.npmjs.org/vite/-/vite-7.2.2.tgz", - "integrity": "sha512-BxAKBWmIbrDgrokdGZH1IgkIk/5mMHDreLDmCJ0qpyJaAteP8NvMhkwr/ZCQNqNH97bw/dANTE9PDzqwJghfMQ==", + "version": "7.2.4", + "resolved": "https://registry.npmjs.org/vite/-/vite-7.2.4.tgz", + "integrity": "sha512-NL8jTlbo0Tn4dUEXEsUg8KeyG/Lkmc4Fnzb8JXN/Ykm9G4HNImjtABMJgkQoVjOBN/j2WAwDTRytdqJbZsah7w==", "dev": true, "license": "MIT", "dependencies": { diff --git a/demo/src/App.svelte b/demo/src/App.svelte index 48a6c2d..60b9f3e 100644 --- a/demo/src/App.svelte +++ b/demo/src/App.svelte @@ -2,13 +2,26 @@ import './app.scss'; import NavBar from './lib/NavBar.svelte'; import Tooltip from './lib/Tooltip.svelte'; - import { Router, Route, Fallback, RouterTrace, activeBehavior } from '@svelte-router/core'; + import { Router, Route, Fallback, RouterTrace, Redirector } from '@svelte-router/core'; import NotFound from './lib/NotFound.svelte'; import HomeView from './lib/views/home/HomeView.svelte'; import PathRoutingView from './lib/views/path-routing/PathRoutingView.svelte'; import HashRoutingView from './lib/views/hash-routing/HashRoutingView.svelte'; + import DemoBc from './lib/DemoBc.svelte'; + import { initTitleContext } from './lib/state/title.svelte'; + import HrInCodeView from './lib/views/hash-routing/InCodeView.svelte'; + import RedirectedView from './lib/views/redirected/RedirectedView.svelte'; + initTitleContext(); let showNavTooltip = $state(false); + const redirector = new Redirector(); + redirector.redirections.push({ + pattern: '/deprecated-path', + href: '/new-path', + options: { + state: { redirected: true }, + } + }); // Show tooltip after a short delay when app loads $effect(() => { @@ -39,21 +52,7 @@ {/snippet} Use these navigation links to test-drive the routing capabilities of @svelte-router/core. -
- - Home - - - Path Routing - - - Hash Routing - -
+
@@ -67,6 +66,12 @@ + + + + + + @@ -74,7 +79,9 @@
{#if !rs.home.match} - +
+ +
{/if} {/snippet} @@ -107,27 +114,4 @@ } } } - .breadcrumb { - padding: 0.5em 1em; - background-color: #f8f9fa; - border-bottom: 1px solid #dee2e6; - font-size: 0.9em; - display: flex; - flex-direction: row; - gap: 0.5em; - & > *:after { - content: '>'; - flex-grow: 1; - margin-left: 0.5em; - } - & > *:last-child:after { - content: ''; - flex-grow: 0; - margin-left: 0; - } - } - :global .bc-active { - font-weight: bold; - text-decoration: underline; - } diff --git a/demo/src/app.scss b/demo/src/app.scss index d2a2c12..9716485 100644 --- a/demo/src/app.scss +++ b/demo/src/app.scss @@ -2,3 +2,19 @@ $bootstrap-icons-font-dir: 'bootstrap-icons/font/fonts'; @import 'bootstrap-icons/font/bootstrap-icons'; + +.router-property { + border-radius: 0.5em; + background-color: var(--bs-gray-200); + padding: 0.1em 0.7em; +} + +[data-bs-theme=dark] .router-property { + background-color: var(--bs-gray-dark); +} + +@media (prefers-color-scheme: dark) { + .router-property { + background-color: var(--bs-gray-dark); + } +} \ No newline at end of file diff --git a/demo/src/lib/Breadcrumb.svelte b/demo/src/lib/Breadcrumb.svelte new file mode 100644 index 0000000..1d442ed --- /dev/null +++ b/demo/src/lib/Breadcrumb.svelte @@ -0,0 +1,25 @@ + + + diff --git a/demo/src/lib/BreadcrumbItem.svelte b/demo/src/lib/BreadcrumbItem.svelte new file mode 100644 index 0000000..6b807fa --- /dev/null +++ b/demo/src/lib/BreadcrumbItem.svelte @@ -0,0 +1,15 @@ + + +
  • + {@render children?.()} +
    • diff --git a/demo/src/lib/CodeSnippet.svelte b/demo/src/lib/CodeSnippet.svelte index 4d9c349..c0e4b09 100644 --- a/demo/src/lib/CodeSnippet.svelte +++ b/demo/src/lib/CodeSnippet.svelte @@ -1,7 +1,9 @@ + + + Home + Path Routing + Hash Routing + + + diff --git a/demo/src/lib/NavBar.svelte b/demo/src/lib/NavBar.svelte index 23486b9..bbfa9db 100644 --- a/demo/src/lib/NavBar.svelte +++ b/demo/src/lib/NavBar.svelte @@ -1,9 +1,10 @@ @@ -24,7 +31,7 @@
    N-Savant Compass Logo - @svelte-router/core + webJose's Svelte Router
    diff --git a/demo/src/lib/SubNav.svelte b/demo/src/lib/SubNav.svelte index 93467d6..180ae68 100644 --- a/demo/src/lib/SubNav.svelte +++ b/demo/src/lib/SubNav.svelte @@ -2,6 +2,8 @@ export type LinkItem = { href: string; text: string; + activeFor?: string; + activeState?: ActiveState; }; @@ -26,7 +28,7 @@ {#each links as link}
  • - + {link.text}
    • @@ -41,7 +43,18 @@ box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); } .sub-nav * { - /* word-break: keep-all; */ + /* word-break: keep-all; */ text-wrap: nowrap; } + :global([data-bs-theme=dark]) .sub-nav { + background-color: rgba(0, 0, 0, 0.09); + box-shadow: 0 4px 8px rgba(255, 255, 255, 0.2); + } + + @media (prefers-color-scheme: dark) { + .sub-nav { + background-color: rgba(0, 0, 0, 0.09); + box-shadow: 0 4px 8px rgba(255, 255, 255, 0.2); + } + } diff --git a/demo/src/lib/ThemeSwitch.svelte b/demo/src/lib/ThemeSwitch.svelte new file mode 100644 index 0000000..18e31d0 --- /dev/null +++ b/demo/src/lib/ThemeSwitch.svelte @@ -0,0 +1,28 @@ + + + + + diff --git a/demo/src/lib/demo/DemoView.svelte b/demo/src/lib/demo/DemoView.svelte index 0b9f942..3dc922e 100644 --- a/demo/src/lib/demo/DemoView.svelte +++ b/demo/src/lib/demo/DemoView.svelte @@ -41,7 +41,9 @@
    - +
    + +
    diff --git a/demo/src/lib/state/theme.svelte.ts b/demo/src/lib/state/theme.svelte.ts new file mode 100644 index 0000000..82f5eaf --- /dev/null +++ b/demo/src/lib/state/theme.svelte.ts @@ -0,0 +1,38 @@ +const themeOptions = ['system', 'light', 'dark'] as const; + +type ThemeIndex = 0 | 1 | 2; + +function indexOfTheme(theme: 'system' | 'light' | 'dark'): ThemeIndex { + const index = themeOptions.indexOf(theme); + if (index === -1) { + throw new Error(`Invalid theme: ${theme}`); + } + return index as ThemeIndex; +} + +export class ThemeState { + #current: ThemeIndex = $state(0); + + get current() { + return themeOptions[this.#current]; + } + set current(value: 'light' | 'dark' | 'system') { + this.#current = indexOfTheme(value); + this.#updateTheme(); + } + + #updateTheme() { + if (this.#current === 0) { + document.documentElement.removeAttribute('data-bs-theme'); + return; + } + document.documentElement.setAttribute('data-bs-theme', themeOptions[this.#current]); + } + + nextTheme() { + this.#current = (this.#current + 1) % themeOptions.length as ThemeIndex; + this.#updateTheme(); + } +} + +export default new ThemeState(); diff --git a/demo/src/lib/state/title.svelte.ts b/demo/src/lib/state/title.svelte.ts new file mode 100644 index 0000000..2783f01 --- /dev/null +++ b/demo/src/lib/state/title.svelte.ts @@ -0,0 +1,33 @@ +import { getContext, setContext } from "svelte"; + +const defaultTitle = "Svelte Router: Live Demo"; + +export class TitleState { + #current = $state(defaultTitle); + + constructor() { + $effect(() => { + document.title = this.current ? `${this.current} - ${defaultTitle}` : defaultTitle; + }); + } + + get current() { + return this.#current; + } + + set current(v: string) { + this.#current = v; + } +} + +const titleCtxKey = Symbol(); + +let titleState: TitleState; + +export function initTitleContext() { + titleState = setContext(titleCtxKey, new TitleState()); +} + +export function getTitleContext() { + return getContext(titleCtxKey); +} diff --git a/demo/src/lib/views/ViewSkeleton.svelte b/demo/src/lib/views/ViewSkeleton.svelte index b707b29..05727c2 100644 --- a/demo/src/lib/views/ViewSkeleton.svelte +++ b/demo/src/lib/views/ViewSkeleton.svelte @@ -21,4 +21,6 @@ {@render children?.()} - +
    + +
    diff --git a/demo/src/lib/views/hash-routing/HashRoutingDemo.svelte b/demo/src/lib/views/hash-routing/HashRoutingDemo.svelte index fb731b5..8d2f7d4 100644 --- a/demo/src/lib/views/hash-routing/HashRoutingDemo.svelte +++ b/demo/src/lib/views/hash-routing/HashRoutingDemo.svelte @@ -34,46 +34,6 @@ {/snippet} - -
    -
    - - - 🎮 Interactive Demo - - -
    - - Current Mode: {routingMode} - -
    -

    Experience the difference between single and multi-hash routing modes!

    -

    - Currently in {routingMode} mode. - {#if routingMode === 'single'} - The entire hash value represents one route. - {:else} - The hash contains multiple key/value pairs for independent routers. - {/if} -

    - -
    - ⚠ī¸ Note: The page will reload to apply the new mode. -
    -     -     -
    -
    -

    đŸŽĒ Live Demo

    @@ -155,6 +115,46 @@ {/if}
    + +
    +
    + + + 🎮 Interactive Demo + + +
    + + Current Mode: {routingMode} + +
    +

    Experience the difference between single and multi-hash routing modes!

    +

    + Currently in {routingMode} mode. + {#if routingMode === 'single'} + The entire hash value represents one route. + {:else} + The hash contains multiple key/value pairs for independent routers. + {/if} +

    + +
    + ⚠ī¸ Note: The page will reload to apply the new mode. +
    +     +     +
    +
    + {#if location.getState(false)?.showCodeDialog}
    diff --git a/demo/src/lib/views/hash-routing/HashRoutingView.svelte b/demo/src/lib/views/hash-routing/HashRoutingView.svelte index e6e5e32..d150211 100644 --- a/demo/src/lib/views/hash-routing/HashRoutingView.svelte +++ b/demo/src/lib/views/hash-routing/HashRoutingView.svelte @@ -1,149 +1,21 @@

    🚀 Hash Routing

    - Navigate your app using URL fragments! Hash routing uses the portion after the `#` character - to determine routes, perfect for client-side navigation that works everywhere. + Navigate your app using URL fragments! Hash routing uses the portion after the `#` character to + determine routes, perfect for client-side navigation that works everywhere.

    - - -
    -
    - - - ✨ Basic Hash Routing - - -

    - Hash routing is perfect for single-page applications. It works without server - configuration and plays nicely with static hosting! -

    - -
    - - 💡 Try changing the URL hash to see routing in action! - -
    -     -     -
    -
    - - - đŸŽ¯ URL Examples - - -

    See how URLs look in both single and multi-hash modes:

    - -     -     -
    -
    - - - 🔗 Links & Navigation - - -

    - You should always stick to Link components when creating navigation links. However, - hash HREF's in anchor elements work: -

    - - - ℹī¸ Anchor elements, when clicked, carry the existing history state. - -
    Live Code Sample
    - -     -     -
    -
    - - -
    -
    - - - 🔄 Multiple Hash Routers - - -

    - Run multiple independent hash routers simultaneously! Each router gets its own - namespace in the hash value using key-value pairs. -

    - -
    - Cool fact: Multi-hash mode uses semicolon-separated key/value - pairs, so `#sidebar=/nav;main=/dashboard` runs two routers independently! -
    -
    - 💡 Pro tip: Keep your multi-hash path names short to prevent URLs from growing too long! -
    -     -     -
    -
    - - - 🤝 Path + Hash Harmony - - -

    - Mix path and hash routing! Use path routing for main navigation and hash - routing for modals, tabs, or secondary navigation. -

    - -
    - Best practice: Use path routing for main content and hash - routing for overlays and temporary UI states. -
    -     -     -
    -
    diff --git a/demo/src/lib/views/hash-routing/InCodeView.svelte b/demo/src/lib/views/hash-routing/InCodeView.svelte new file mode 100644 index 0000000..674e33a --- /dev/null +++ b/demo/src/lib/views/hash-routing/InCodeView.svelte @@ -0,0 +1,124 @@ + + +
    +

    In-Code Hash Routing

    +

    Explore how to implement hash routing directly within your Svelte components.

    +
    +
    + + + ✨ Basic Hash Routing + + +

    + Hash routing is perfect for single-page applications. It works without server + configuration and plays nicely with static hosting! +

    + +
    + + 💡 Try changing the URL hash to see routing in action! + +
    +     +     +
    +
    + + + đŸŽ¯ URL Examples + + +

    See how URLs look in both single and multi-hash modes:

    + +     +     +
    +
    + + + 🔗 Links & Navigation + + +

    + You should always stick to Link components when creating navigation links. However, + hash HREF's in anchor elements work: +

    + + + ℹī¸ Anchor elements, when clicked, carry the existing history state. + +
    Live Code Sample
    + +     +     +
    +
    + +
    +
    + + + 🔄 Multiple Hash Routers + + +

    + Run multiple independent hash routers simultaneously! Each router gets its own namespace + in the hash value using key-value pairs. +

    + +
    + Cool fact: Multi-hash mode uses semicolon-separated key/value pairs, so + `#sidebar=/nav;main=/dashboard` runs two routers independently! +
    +
    + 💡 Pro tip: Keep your multi-hash path names short to prevent URLs from growing + too long! +
    +     +     +
    +
    + + + 🤝 Path + Hash Harmony + + +

    + Mix path and hash routing! Use path routing for main navigation and hash routing for + modals, tabs, or secondary navigation. +

    + +
    + Best practice: Use path routing for main content and hash routing for overlays + and temporary UI states. +
    +     +     +
    +
    +
    diff --git a/demo/src/lib/views/home/Hero.svelte b/demo/src/lib/views/home/Hero.svelte index 87fa2b8..b6837df 100644 --- a/demo/src/lib/views/home/Hero.svelte +++ b/demo/src/lib/views/home/Hero.svelte @@ -1,11 +1,13 @@
    -

    {title}

    -

    {subtitle}

    +
    +

    webJose's {title}

    +
    {subtitle}
    +
    diff --git a/demo/src/lib/views/path-routing/views/HomeView.svelte b/demo/src/lib/views/path-routing/views/HomeView.svelte index 2ef748d..6a2e6f4 100644 --- a/demo/src/lib/views/path-routing/views/HomeView.svelte +++ b/demo/src/lib/views/path-routing/views/HomeView.svelte @@ -5,6 +5,7 @@ import CardBody from '../../../CardBody.svelte'; import xml from 'svelte-highlight/languages/xml'; import typescript from 'svelte-highlight/languages/typescript'; + import { getTitleContext } from '../../../state/title.svelte'; // Import code samples as raw text import basicPathRouterCode from '../code-samples/basic-path-router.txt?raw'; @@ -13,6 +14,8 @@ import routeParametersCode from '../code-samples/route-parameters.txt?raw'; import urlExamples from '../code-samples/url-examples.ts?raw'; import routeGuardsCode from '../code-samples/route-guards.txt?raw'; + + getTitleContext().current = 'Path Routing';
    diff --git a/demo/src/lib/views/redirected/RedirectedView.svelte b/demo/src/lib/views/redirected/RedirectedView.svelte new file mode 100644 index 0000000..8e67498 --- /dev/null +++ b/demo/src/lib/views/redirected/RedirectedView.svelte @@ -0,0 +1,28 @@ + + +
    + {#if location.getState(false)?.redirected} + + You have been redirected here from a deprecated path. Please update your bookmarks! + + {:else} + + Note how the warning alert is not shown when navigating directly to this URL. This is because the piece + of state indicating a redirection is only set when arriving here via the redirection defined in this demo's + App.svelte component. + + {/if} +

    Feature With New URL Goes Here

    +

    + This page is accessible via its new path (/new-path), but can also be reached by + navigating to the old deprecated path (/deprecated-path), which will redirect to + the new URL. +

    +

    + This demonstrates how to set up URL redirections using the Redirector class from + the @svelte-router/core NPM package. +

    +