, isProduction: boolean): VitePluginOptions;
9 |
--------------------------------------------------------------------------------
/examples/typescript-tailwind-cypress/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Svelte app
7 |
8 | Svelte app
7 |
8 | /redirect/somehwere from
8 |
13 | {:else}
14 | Go to redirect to be redirected here
15 | {/if}
16 |
--------------------------------------------------------------------------------
/test/integration/meta/example/_module.meta.js:
--------------------------------------------------------------------------------
1 | export default function () {
2 | return {
3 | plain: 'Im plain',
4 | function: () => 'Im a function',
5 | 'scopedPlain|scoped': 'Im scoped',
6 | 'scopedSplitPlain|scoped|split': 'Im scoped split',
7 | 'scopedFunction|scoped': () => 'Im a scoped function',
8 | 'scopedSplitFunction|scoped|split': () => 'Im a scoped split function',
9 | 'overwritten|scoped': 'original',
10 | }
11 | }
12 |
--------------------------------------------------------------------------------
/examples/starter-mobile/src/routes/2.app/_module.svelte:
--------------------------------------------------------------------------------
1 |
5 |
6 |
7 |
8 |
10 |
12 |
13 |
20 |
--------------------------------------------------------------------------------
/examples/portfolio/src/routes/[...index].svelte:
--------------------------------------------------------------------------------
1 |
11 |
12 |
6 | This example demonstrates how to utilize the `load` hook to fetch and return data via
7 | a "props" object. Navigate to data.svelte to see how we retrieve data from a Star Wars
8 | API and make it accessible for our component.
9 |
10 |
11 | prefetch data on hover
12 |
--------------------------------------------------------------------------------
/examples/experiment/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "type": "module",
3 | "imports": {
4 | "#cmp/*": "./src/components/*"
5 | },
6 | "scripts": {
7 | "build": "vite build",
8 | "preview": "vite preview",
9 | "dev": "vite"
10 | },
11 | "devDependencies": {
12 | "@roxi/routify": "^3.5.1",
13 | "@sveltejs/vite-plugin-svelte": "^1.0.0-next.13",
14 | "mdsvex": "^0.9.3",
15 | "svelte": "^3.39.0",
16 | "vite": "^2.2.3"
17 | }
18 | }
--------------------------------------------------------------------------------
/examples/express/client/routes/examples/[mode]/__assets/open-props/routify.props.red-hsl.css:
--------------------------------------------------------------------------------
1 | .routify {
2 | --red-0-hsl: 0 100% 98%;
3 | --red-1-hsl: 0 100% 95%;
4 | --red-2-hsl: 0 100% 89%;
5 | --red-3-hsl: 0 100% 83%;
6 | --red-4-hsl: 0 100% 76%;
7 | --red-5-hsl: 0 100% 71%;
8 | --red-6-hsl: 0 94% 65%;
9 | --red-7-hsl: 0 86% 59%;
10 | --red-8-hsl: 0 74% 54%;
11 | --red-9-hsl: 0 65% 48%;
12 | --red-10-hsl: 0 65% 42%;
13 | --red-11-hsl: 0 65% 36%;
14 | --red-12-hsl: 0 66% 30%;
15 | }
16 |
--------------------------------------------------------------------------------
/examples/feathersjs/packages/backend/src/configuration.js:
--------------------------------------------------------------------------------
1 | import { Type, getValidator, defaultAppConfiguration } from '@feathersjs/typebox'
2 |
3 | import { dataValidator } from './validators.js'
4 |
5 | export const configurationSchema = Type.Intersect([
6 | defaultAppConfiguration,
7 | Type.Object({
8 | host: Type.String(),
9 | port: Type.Number(),
10 | public: Type.String()
11 | })
12 | ])
13 |
14 | export const configurationValidator = getValidator(configurationSchema, dataValidator)
15 |
--------------------------------------------------------------------------------
/examples/starter/src/routes/examples/[mode]/__assets/open-props/routify.props.red-hsl.css:
--------------------------------------------------------------------------------
1 | .routify {
2 | --red-0-hsl: 0 100% 98%;
3 | --red-1-hsl: 0 100% 95%;
4 | --red-2-hsl: 0 100% 89%;
5 | --red-3-hsl: 0 100% 83%;
6 | --red-4-hsl: 0 100% 76%;
7 | --red-5-hsl: 0 100% 71%;
8 | --red-6-hsl: 0 94% 65%;
9 | --red-7-hsl: 0 86% 59%;
10 | --red-8-hsl: 0 74% 54%;
11 | --red-9-hsl: 0 65% 48%;
12 | --red-10-hsl: 0 65% 42%;
13 | --red-11-hsl: 0 65% 36%;
14 | --red-12-hsl: 0 66% 30%;
15 | }
16 |
--------------------------------------------------------------------------------
/lib/buildtime/plugins/devHelper/helper.js:
--------------------------------------------------------------------------------
1 | /** @type {RoutifyBuildtimePlugin} */
2 | export const devHelperPlugin = {
3 | name: 'devHelper',
4 | after: 'metaFromFile',
5 | before: 'exporter',
6 | build: () => {},
7 | transform: (id, content, instance) => {
8 | // @ts-ignore
9 | if (instance.options.devHelper && id.endsWith('.js'))
10 | content += `\n\nimport '@roxi/routify/lib/buildtime/plugins/devHelper/runtime.js'`
11 | return content
12 | },
13 | }
14 |
--------------------------------------------------------------------------------
/examples/buildtime-data/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "routify-starter-buildtime-data",
3 | "type": "module",
4 | "scripts": {
5 | "build": "vite build",
6 | "preview": "vite preview",
7 | "dev": "vite"
8 | },
9 | "devDependencies": {
10 | "@roxi/routify": "^3.5.1",
11 | "@sveltejs/vite-plugin-svelte": "^1.0.0-next.13",
12 | "mdsvex": "^0.9.3",
13 | "svelte": "^3.39.0",
14 | "vite": "^3.2.4",
15 | "axios": "^1.2.0"
16 | }
17 | }
--------------------------------------------------------------------------------
/examples/experiment/jsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "checkJs": true,
4 | "baseUrl": ".",
5 | "paths": {
6 | "#cmp/*": ["./src/cmp/*"],
7 | "#root/*": ["./*"]
8 | },
9 | "target": "esnext",
10 | "moduleResolution": "node"
11 | },
12 | "exclude": [
13 | "**/node_modules",
14 | "**/dist",
15 | "**/example",
16 | "**/temp",
17 | "**/output",
18 | "**/.history"
19 | ]
20 | }
21 |
--------------------------------------------------------------------------------
/examples/experiment/src/routes/pages/gallery/index.svelte:
--------------------------------------------------------------------------------
1 |
10 |
11 | Gallery
12 |
13 | r
14 |
6 | This example demonstrates how to utilize the `load` hook to fetch and return data via
7 | a
8 |
9 |
10 |
11 | "props" object. Navigate to data.svelte to see how we retrieve data from a Star Wars
12 | API and make it accessible for our component.
13 |
14 |
15 | prefetch data on hover
16 |
--------------------------------------------------------------------------------
/examples/express/client/routes/examples/[mode]/__assets/open-props/routify.props.gray-hsl.css:
--------------------------------------------------------------------------------
1 | .routify {
2 | --gray-0-hsl: 210 17% 98%;
3 | --gray-1-hsl: 210 17% 95%;
4 | --gray-2-hsl: 210 16% 93%;
5 | --gray-3-hsl: 210 14% 89%;
6 | --gray-4-hsl: 210 14% 83%;
7 | --gray-5-hsl: 210 11% 71%;
8 | --gray-6-hsl: 210 7% 56%;
9 | --gray-7-hsl: 210 9% 31%;
10 | --gray-8-hsl: 210 10% 23%;
11 | --gray-9-hsl: 210 11% 15%;
12 | --gray-10-hsl: 214 14% 10%;
13 | --gray-11-hsl: 216 16% 6%;
14 | --gray-12-hsl: 210 40% 2%;
15 | }
16 |
--------------------------------------------------------------------------------
/examples/kitchensink/src/routes/multi-slot/4.examples/_decorator.svelte:
--------------------------------------------------------------------------------
1 |
5 |
6 |
7 |
9 |
10 |
11 |
12 |
21 |
--------------------------------------------------------------------------------
/examples/starter-vitest/test/dom.test.js:
--------------------------------------------------------------------------------
1 | /** @type { Router } */
2 | let router
3 |
4 | beforeAll(async () => {
5 | await import('../src/main')
6 | router = globalThis.__routify.routers[0]
7 | await router.ready()
8 | })
9 |
10 | test('can see frontpage', async () => {
11 | expect(document.body.innerHTML).toContain('Routify 3 App')
12 | })
13 |
14 | test('can see /hello-world', async () => {
15 | await router.url.push('/hello-world')
16 |
17 | expect(document.body.innerHTML).toContain('Hello world!')
18 | })
19 |
--------------------------------------------------------------------------------
/examples/starter/src/routes/examples/[mode]/__assets/open-props/routify.props.gray-hsl.css:
--------------------------------------------------------------------------------
1 | .routify {
2 | --gray-0-hsl: 210 17% 98%;
3 | --gray-1-hsl: 210 17% 95%;
4 | --gray-2-hsl: 210 16% 93%;
5 | --gray-3-hsl: 210 14% 89%;
6 | --gray-4-hsl: 210 14% 83%;
7 | --gray-5-hsl: 210 11% 71%;
8 | --gray-6-hsl: 210 7% 56%;
9 | --gray-7-hsl: 210 9% 31%;
10 | --gray-8-hsl: 210 10% 23%;
11 | --gray-9-hsl: 210 11% 15%;
12 | --gray-10-hsl: 214 14% 10%;
13 | --gray-11-hsl: 216 16% 6%;
14 | --gray-12-hsl: 210 40% 2%;
15 | }
16 |
--------------------------------------------------------------------------------
/examples/starter/src/routes/examples/[mode]/__assets/open-props/routify.props.stone-hsl.css:
--------------------------------------------------------------------------------
1 | .routify {
2 | --stone-0-hsl: 200 27% 98%;
3 | --stone-1-hsl: 210 18% 96%;
4 | --stone-2-hsl: 210 11% 93%;
5 | --stone-3-hsl: 192 9% 89%;
6 | --stone-4-hsl: 197 8% 83%;
7 | --stone-5-hsl: 202 5% 71%;
8 | --stone-6-hsl: 200 3% 60%;
9 | --stone-7-hsl: 180 2% 50%;
10 | --stone-8-hsl: 160 1% 41%;
11 | --stone-9-hsl: 90 1% 31%;
12 | --stone-10-hsl: 60 3% 22%;
13 | --stone-11-hsl: 60 6% 14%;
14 | --stone-12-hsl: 60 6% 7%;
15 | }
16 |
--------------------------------------------------------------------------------
/lib/runtime/utils/messages.js:
--------------------------------------------------------------------------------
1 | export const noRoutesMapProvided = name =>
2 | `No routesMap provided. Make sure you\'ve either created a router for the '${name}' route or provided a routesMap`
3 |
4 | export const handleRebuildError = (context, childContexts) => {
5 | console.warn('Failed to rebuild routes', { context, childContexts })
6 | const msg =
7 | 'Infinite loop detected while trying to compose components. This is likely an error in Routify.'
8 | const err = new Error(msg)
9 |
10 | throw err
11 | }
12 |
--------------------------------------------------------------------------------
/examples/express/client/routes/examples/[mode]/__assets/open-props/routify.props.brown-hsl.css:
--------------------------------------------------------------------------------
1 | .routify {
2 | --brown-0-hsl: 36 60% 95%;
3 | --brown-1-hsl: 32 44% 87%;
4 | --brown-2-hsl: 28 40% 80%;
5 | --brown-3-hsl: 28 38% 72%;
6 | --brown-4-hsl: 27 36% 65%;
7 | --brown-5-hsl: 28 34% 57%;
8 | --brown-6-hsl: 28 32% 50%;
9 | --brown-7-hsl: 28 35% 43%;
10 | --brown-8-hsl: 28 38% 37%;
11 | --brown-9-hsl: 27 42% 31%;
12 | --brown-10-hsl: 25 48% 25%;
13 | --brown-11-hsl: 23 58% 19%;
14 | --brown-12-hsl: 22 57% 16%;
15 | }
16 |
--------------------------------------------------------------------------------
/examples/express/client/routes/examples/[mode]/__assets/open-props/routify.props.cyan-hsl.css:
--------------------------------------------------------------------------------
1 | .routify {
2 | --cyan-0-hsl: 185 81% 94%;
3 | --cyan-1-hsl: 185 84% 88%;
4 | --cyan-2-hsl: 186 77% 77%;
5 | --cyan-3-hsl: 187 74% 65%;
6 | --cyan-4-hsl: 187 69% 55%;
7 | --cyan-5-hsl: 188 72% 47%;
8 | --cyan-6-hsl: 187 80% 42%;
9 | --cyan-7-hsl: 188 83% 37%;
10 | --cyan-8-hsl: 189 85% 32%;
11 | --cyan-9-hsl: 189 85% 28%;
12 | --cyan-10-hsl: 189 84% 23%;
13 | --cyan-11-hsl: 190 84% 17%;
14 | --cyan-12-hsl: 189 84% 12%;
15 | }
16 |
--------------------------------------------------------------------------------
/examples/express/client/routes/examples/[mode]/__assets/open-props/routify.props.stone-hsl.css:
--------------------------------------------------------------------------------
1 | .routify {
2 | --stone-0-hsl: 200 27% 98%;
3 | --stone-1-hsl: 210 18% 96%;
4 | --stone-2-hsl: 210 11% 93%;
5 | --stone-3-hsl: 192 9% 89%;
6 | --stone-4-hsl: 197 8% 83%;
7 | --stone-5-hsl: 202 5% 71%;
8 | --stone-6-hsl: 200 3% 60%;
9 | --stone-7-hsl: 180 2% 50%;
10 | --stone-8-hsl: 160 1% 41%;
11 | --stone-9-hsl: 90 1% 31%;
12 | --stone-10-hsl: 60 3% 22%;
13 | --stone-11-hsl: 60 6% 14%;
14 | --stone-12-hsl: 60 6% 7%;
15 | }
16 |
--------------------------------------------------------------------------------
/examples/express/client/routes/examples/[mode]/__assets/open-props/routify.props.teal-hsl.css:
--------------------------------------------------------------------------------
1 | .routify {
2 | --teal-0-hsl: 161 79% 95%;
3 | --teal-1-hsl: 160 85% 87%;
4 | --teal-2-hsl: 162 78% 77%;
5 | --teal-3-hsl: 162 72% 65%;
6 | --teal-4-hsl: 162 68% 54%;
7 | --teal-5-hsl: 162 73% 46%;
8 | --teal-6-hsl: 162 82% 40%;
9 | --teal-7-hsl: 162 87% 35%;
10 | --teal-8-hsl: 162 88% 30%;
11 | --teal-9-hsl: 162 88% 26%;
12 | --teal-10-hsl: 162 89% 21%;
13 | --teal-11-hsl: 162 88% 16%;
14 | --teal-12-hsl: 163 89% 11%;
15 | }
16 |
--------------------------------------------------------------------------------
/examples/starter/src/routes/examples/[mode]/__assets/open-props/routify.props.blue-hsl.css:
--------------------------------------------------------------------------------
1 | .routify {
2 | --blue-0-hsl: 205 100% 95%;
3 | --blue-1-hsl: 206 100% 91%;
4 | --blue-2-hsl: 206 100% 82%;
5 | --blue-3-hsl: 206 96% 72%;
6 | --blue-4-hsl: 207 91% 64%;
7 | --blue-5-hsl: 207 86% 57%;
8 | --blue-6-hsl: 208 80% 52%;
9 | --blue-7-hsl: 208 77% 47%;
10 | --blue-8-hsl: 209 77% 43%;
11 | --blue-9-hsl: 209 75% 38%;
12 | --blue-10-hsl: 209 76% 32%;
13 | --blue-11-hsl: 209 75% 27%;
14 | --blue-12-hsl: 209 76% 21%;
15 | }
16 |
--------------------------------------------------------------------------------
/examples/starter/src/routes/examples/[mode]/__assets/open-props/routify.props.brown-hsl.css:
--------------------------------------------------------------------------------
1 | .routify {
2 | --brown-0-hsl: 36 60% 95%;
3 | --brown-1-hsl: 32 44% 87%;
4 | --brown-2-hsl: 28 40% 80%;
5 | --brown-3-hsl: 28 38% 72%;
6 | --brown-4-hsl: 27 36% 65%;
7 | --brown-5-hsl: 28 34% 57%;
8 | --brown-6-hsl: 28 32% 50%;
9 | --brown-7-hsl: 28 35% 43%;
10 | --brown-8-hsl: 28 38% 37%;
11 | --brown-9-hsl: 27 42% 31%;
12 | --brown-10-hsl: 25 48% 25%;
13 | --brown-11-hsl: 23 58% 19%;
14 | --brown-12-hsl: 22 57% 16%;
15 | }
16 |
--------------------------------------------------------------------------------
/examples/starter/src/routes/examples/[mode]/__assets/open-props/routify.props.choco-hsl.css:
--------------------------------------------------------------------------------
1 | .routify {
2 | --choco-0-hsl: 48 100% 93%;
3 | --choco-1-hsl: 35 91% 86%;
4 | --choco-2-hsl: 30 85% 79%;
5 | --choco-3-hsl: 27 80% 72%;
6 | --choco-4-hsl: 25 75% 65%;
7 | --choco-5-hsl: 25 71% 57%;
8 | --choco-6-hsl: 25 70% 49%;
9 | --choco-7-hsl: 25 75% 42%;
10 | --choco-8-hsl: 25 75% 37%;
11 | --choco-9-hsl: 25 76% 31%;
12 | --choco-10-hsl: 25 71% 26%;
13 | --choco-11-hsl: 25 66% 21%;
14 | --choco-12-hsl: 25 65% 15%;
15 | }
16 |
--------------------------------------------------------------------------------
/examples/starter/src/routes/examples/[mode]/__assets/open-props/routify.props.cyan-hsl.css:
--------------------------------------------------------------------------------
1 | .routify {
2 | --cyan-0-hsl: 185 81% 94%;
3 | --cyan-1-hsl: 185 84% 88%;
4 | --cyan-2-hsl: 186 77% 77%;
5 | --cyan-3-hsl: 187 74% 65%;
6 | --cyan-4-hsl: 187 69% 55%;
7 | --cyan-5-hsl: 188 72% 47%;
8 | --cyan-6-hsl: 187 80% 42%;
9 | --cyan-7-hsl: 188 83% 37%;
10 | --cyan-8-hsl: 189 85% 32%;
11 | --cyan-9-hsl: 189 85% 28%;
12 | --cyan-10-hsl: 189 84% 23%;
13 | --cyan-11-hsl: 190 84% 17%;
14 | --cyan-12-hsl: 189 84% 12%;
15 | }
16 |
--------------------------------------------------------------------------------
/examples/starter/src/routes/examples/[mode]/__assets/open-props/routify.props.pink-hsl.css:
--------------------------------------------------------------------------------
1 | .routify {
2 | --pink-0-hsl: 336 100% 97%;
3 | --pink-1-hsl: 336 100% 94%;
4 | --pink-2-hsl: 338 91% 87%;
5 | --pink-3-hsl: 339 90% 81%;
6 | --pink-4-hsl: 339 88% 74%;
7 | --pink-5-hsl: 339 82% 67%;
8 | --pink-6-hsl: 339 76% 59%;
9 | --pink-7-hsl: 339 67% 52%;
10 | --pink-8-hsl: 339 68% 45%;
11 | --pink-9-hsl: 339 69% 38%;
12 | --pink-10-hsl: 339 70% 32%;
13 | --pink-11-hsl: 339 69% 27%;
14 | --pink-12-hsl: 339 70% 21%;
15 | }
16 |
--------------------------------------------------------------------------------
/examples/starter/src/routes/examples/[mode]/__assets/open-props/routify.props.teal-hsl.css:
--------------------------------------------------------------------------------
1 | .routify {
2 | --teal-0-hsl: 161 79% 95%;
3 | --teal-1-hsl: 160 85% 87%;
4 | --teal-2-hsl: 162 78% 77%;
5 | --teal-3-hsl: 162 72% 65%;
6 | --teal-4-hsl: 162 68% 54%;
7 | --teal-5-hsl: 162 73% 46%;
8 | --teal-6-hsl: 162 82% 40%;
9 | --teal-7-hsl: 162 87% 35%;
10 | --teal-8-hsl: 162 88% 30%;
11 | --teal-9-hsl: 162 88% 26%;
12 | --teal-10-hsl: 162 89% 21%;
13 | --teal-11-hsl: 162 88% 16%;
14 | --teal-12-hsl: 163 89% 11%;
15 | }
16 |
--------------------------------------------------------------------------------
/test/examples/sveltekit.test.js:
--------------------------------------------------------------------------------
1 | import { getExamplesPath, runViteDev } from '../utils.js'
2 |
3 | beforeAll(() => page.setDefaultTimeout(25000))
4 |
5 | test('should see sveltekit front page', async ({ skip }) => {
6 | return skip('kit starter needs fixing')
7 | const { kill, port } = await runViteDev(getExamplesPath('sveltekit'))
8 | await page.goto(`http://localhost:${port}`)
9 | const result = await page.waitForSelector('"Welcome to SvelteKit + Routify"')
10 | expect(result).toBeTruthy()
11 | await kill()
12 | })
13 |
--------------------------------------------------------------------------------
/examples/express-modular/packages/server/index.js:
--------------------------------------------------------------------------------
1 | import express from 'express'
2 |
3 | async function createServer() {
4 | const app = express()
5 |
6 | // example endpoint
7 | app.get('/api/greeting', (req, res) => {
8 | // Please note: this is not a production-ready way to handle CORS
9 | res.setHeader('Access-Control-Allow-Origin', '*')
10 | res.json({ msg: 'Hello World' })
11 | })
12 |
13 | app.listen(3000)
14 | console.log('listening on http://localhost:3000')
15 | }
16 |
17 | createServer()
18 |
--------------------------------------------------------------------------------
/examples/express/client/routes/examples/[mode]/__assets/open-props/routify.props.blue-hsl.css:
--------------------------------------------------------------------------------
1 | .routify {
2 | --blue-0-hsl: 205 100% 95%;
3 | --blue-1-hsl: 206 100% 91%;
4 | --blue-2-hsl: 206 100% 82%;
5 | --blue-3-hsl: 206 96% 72%;
6 | --blue-4-hsl: 207 91% 64%;
7 | --blue-5-hsl: 207 86% 57%;
8 | --blue-6-hsl: 208 80% 52%;
9 | --blue-7-hsl: 208 77% 47%;
10 | --blue-8-hsl: 209 77% 43%;
11 | --blue-9-hsl: 209 75% 38%;
12 | --blue-10-hsl: 209 76% 32%;
13 | --blue-11-hsl: 209 75% 27%;
14 | --blue-12-hsl: 209 76% 21%;
15 | }
16 |
--------------------------------------------------------------------------------
/examples/express/client/routes/examples/[mode]/__assets/open-props/routify.props.choco-hsl.css:
--------------------------------------------------------------------------------
1 | .routify {
2 | --choco-0-hsl: 48 100% 93%;
3 | --choco-1-hsl: 35 91% 86%;
4 | --choco-2-hsl: 30 85% 79%;
5 | --choco-3-hsl: 27 80% 72%;
6 | --choco-4-hsl: 25 75% 65%;
7 | --choco-5-hsl: 25 71% 57%;
8 | --choco-6-hsl: 25 70% 49%;
9 | --choco-7-hsl: 25 75% 42%;
10 | --choco-8-hsl: 25 75% 37%;
11 | --choco-9-hsl: 25 76% 31%;
12 | --choco-10-hsl: 25 71% 26%;
13 | --choco-11-hsl: 25 66% 21%;
14 | --choco-12-hsl: 25 65% 15%;
15 | }
16 |
--------------------------------------------------------------------------------
/examples/express/client/routes/examples/[mode]/__assets/open-props/routify.props.pink-hsl.css:
--------------------------------------------------------------------------------
1 | .routify {
2 | --pink-0-hsl: 336 100% 97%;
3 | --pink-1-hsl: 336 100% 94%;
4 | --pink-2-hsl: 338 91% 87%;
5 | --pink-3-hsl: 339 90% 81%;
6 | --pink-4-hsl: 339 88% 74%;
7 | --pink-5-hsl: 339 82% 67%;
8 | --pink-6-hsl: 339 76% 59%;
9 | --pink-7-hsl: 339 67% 52%;
10 | --pink-8-hsl: 339 68% 45%;
11 | --pink-9-hsl: 339 69% 38%;
12 | --pink-10-hsl: 339 70% 32%;
13 | --pink-11-hsl: 339 69% 27%;
14 | --pink-12-hsl: 339 70% 21%;
15 | }
16 |
--------------------------------------------------------------------------------
/examples/feathersjs/packages/backend/test/client.test.js:
--------------------------------------------------------------------------------
1 | import assert from 'assert'
2 | import axios from 'axios'
3 | import { app } from '../src/app.js'
4 | import { createClient } from '../src/client.js'
5 |
6 | import rest from '@feathersjs/rest-client'
7 |
8 | const port = app.get('port')
9 | const appUrl = `http://${app.get('host')}:${port}`
10 |
11 | describe('client tests', () => {
12 | const client = createClient(rest(appUrl).axios(axios))
13 |
14 | it('initialized the client', () => {
15 | assert.ok(client)
16 | })
17 | })
18 |
--------------------------------------------------------------------------------
/examples/feathersjs/packages/frontend/src/feathersApp.js:
--------------------------------------------------------------------------------
1 | import { feathers } from "@feathersjs/feathers";
2 | import socketio from "@feathersjs/socketio-client";
3 | import io from "socket.io-client";
4 |
5 | const socket = io("http://localhost:3030/");
6 | const feathersClient = feathers();
7 | feathersClient.configure(socketio(socket));
8 |
9 |
10 | const messageService = feathersClient.service('todo')
11 |
12 | messageService.on('created', (message) => console.log('Created a message', message))
13 |
14 |
15 | export { feathersClient };
16 |
--------------------------------------------------------------------------------
/examples/express-modular/packages/client/tests/test.spec.js:
--------------------------------------------------------------------------------
1 | /** @type { Router } */
2 | let router
3 |
4 | beforeAll(async () => {
5 | await import('../.routify/routify-init.js')
6 | router = globalThis.__routify.routers[0]
7 | await router.ready()
8 | // wait for components to render
9 | await new Promise((resolve) => setTimeout(resolve))
10 | })
11 |
12 | test('can see /', async () => {
13 | await router.url.push('/')
14 |
15 | expect(document.body.innerHTML).toContain('Welcome to Your New Routify 3 Project!')
16 | })
17 |
--------------------------------------------------------------------------------
/examples/starter-svelte-5-triplit/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "starter",
3 | "type": "module",
4 | "scripts": {
5 | "build": "vite build",
6 | "preview": "vite preview",
7 | "dev": "vite"
8 | },
9 | "devDependencies": {
10 | "@roxi/routify": "^3.5.1",
11 | "@sveltejs/vite-plugin-svelte": "^5.0.0",
12 | "@triplit/client": "^1.0.24",
13 | "@triplit/svelte": "^1.0.24",
14 | "@triplit/cli": "1.0.32",
15 | "svelte": "^5.0.0",
16 | "vite": "^6.0.0"
17 | }
18 | }
--------------------------------------------------------------------------------
/examples/starter/src/routes/examples/[mode]/__assets/open-props/routify.index.css:
--------------------------------------------------------------------------------
1 | @import 'props.media.css';
2 | @import 'routify.props.fonts.css';
3 | @import 'routify.props.sizes.css';
4 | @import 'routify.props.easing.css';
5 | @import 'routify.props.zindex.css';
6 | @import 'routify.props.shadows.css';
7 | @import 'routify.props.aspects.css';
8 | @import 'routify.props.colors.css';
9 | @import 'routify.props.colors-hsl.css';
10 | @import 'routify.props.gradients.css';
11 | @import 'routify.props.animations.css';
12 | @import 'routify.props.borders.css';
--------------------------------------------------------------------------------
/examples/starter/src/routes/examples/[mode]/__assets/open-props/routify.props.green-hsl.css:
--------------------------------------------------------------------------------
1 | .routify {
2 | --green-0-hsl: 131 67% 95%;
3 | --green-1-hsl: 128 76% 90%;
4 | --green-2-hsl: 128 71% 82%;
5 | --green-3-hsl: 129 68% 73%;
6 | --green-4-hsl: 130 61% 64%;
7 | --green-5-hsl: 130 57% 56%;
8 | --green-6-hsl: 131 50% 50%;
9 | --green-7-hsl: 131 53% 46%;
10 | --green-8-hsl: 131 54% 40%;
11 | --green-9-hsl: 132 52% 35%;
12 | --green-10-hsl: 132 52% 29%;
13 | --green-11-hsl: 132 53% 22%;
14 | --green-12-hsl: 131 53% 16%;
15 | }
16 |
--------------------------------------------------------------------------------
/examples/starter/src/routes/examples/[mode]/landing-page/discover.svelte:
--------------------------------------------------------------------------------
1 | Discover the Power of Inline Pages
2 |
3 | Welcome to a whole new way of designing your web pages - Inline Pages in Routify. A
4 | transformative feature that enables seamless user experience by allowing pages to
5 | coexist side by side, and be independently controlled and manipulated. Discover how
6 | Inline Pages will revolutionize your workflow and web design approach.
7 |
8 |
9 |
10 |
11 |
--------------------------------------------------------------------------------
/examples/express/client/routes/examples/[mode]/__assets/open-props/routify.index.css:
--------------------------------------------------------------------------------
1 | @import 'props.media.css';
2 | @import 'routify.props.fonts.css';
3 | @import 'routify.props.sizes.css';
4 | @import 'routify.props.easing.css';
5 | @import 'routify.props.zindex.css';
6 | @import 'routify.props.shadows.css';
7 | @import 'routify.props.aspects.css';
8 | @import 'routify.props.colors.css';
9 | @import 'routify.props.colors-hsl.css';
10 | @import 'routify.props.gradients.css';
11 | @import 'routify.props.animations.css';
12 | @import 'routify.props.borders.css';
--------------------------------------------------------------------------------
/examples/express/client/routes/examples/[mode]/__assets/open-props/routify.props.green-hsl.css:
--------------------------------------------------------------------------------
1 | .routify {
2 | --green-0-hsl: 131 67% 95%;
3 | --green-1-hsl: 128 76% 90%;
4 | --green-2-hsl: 128 71% 82%;
5 | --green-3-hsl: 129 68% 73%;
6 | --green-4-hsl: 130 61% 64%;
7 | --green-5-hsl: 130 57% 56%;
8 | --green-6-hsl: 131 50% 50%;
9 | --green-7-hsl: 131 53% 46%;
10 | --green-8-hsl: 131 54% 40%;
11 | --green-9-hsl: 132 52% 35%;
12 | --green-10-hsl: 132 52% 29%;
13 | --green-11-hsl: 132 53% 22%;
14 | --green-12-hsl: 131 53% 16%;
15 | }
16 |
--------------------------------------------------------------------------------
/examples/express/client/routes/examples/[mode]/__assets/open-props/routify.props.jungle-hsl.css:
--------------------------------------------------------------------------------
1 | .routify {
2 | --jungle-0-hsl: 74 98% 84%;
3 | --jungle-1-hsl: 74 79% 78%;
4 | --jungle-2-hsl: 74 68% 71%;
5 | --jungle-3-hsl: 75 62% 65%;
6 | --jungle-4-hsl: 74 56% 59%;
7 | --jungle-5-hsl: 74 53% 53%;
8 | --jungle-6-hsl: 74 55% 47%;
9 | --jungle-7-hsl: 74 66% 42%;
10 | --jungle-8-hsl: 74 79% 36%;
11 | --jungle-9-hsl: 73 90% 32%;
12 | --jungle-10-hsl: 73 91% 26%;
13 | --jungle-11-hsl: 73 91% 21%;
14 | --jungle-12-hsl: 73 90% 16%;
15 | }
16 |
--------------------------------------------------------------------------------
/examples/express/client/routes/examples/[mode]/landing-page/discover.svelte:
--------------------------------------------------------------------------------
1 | Discover the Power of Inline Pages
2 |
3 | Welcome to a whole new way of designing your web pages - Inline Pages in Routify. A
4 | transformative feature that enables seamless user experience by allowing pages to
5 | coexist side by side, and be independently controlled and manipulated. Discover how
6 | Inline Pages will revolutionize your workflow and web design approach.
7 |
8 |
9 |
10 |
11 |
--------------------------------------------------------------------------------
/examples/feathersjs/packages/backend/src/logger.js:
--------------------------------------------------------------------------------
1 | // For more information about this file see https://dove.feathersjs.com/guides/cli/logging.html
2 | import { createLogger, format, transports } from 'winston'
3 |
4 | // Configure the Winston logger. For the complete documentation see https://github.com/winstonjs/winston
5 | export const logger = createLogger({
6 | // To see more detailed errors, change this to 'debug'
7 | level: 'info',
8 | format: format.combine(format.splat(), format.simple()),
9 | transports: [new transports.Console()]
10 | })
11 |
--------------------------------------------------------------------------------
/examples/starter/src/routes/examples/[mode]/__assets/open-props/routify.props.jungle-hsl.css:
--------------------------------------------------------------------------------
1 | .routify {
2 | --jungle-0-hsl: 74 98% 84%;
3 | --jungle-1-hsl: 74 79% 78%;
4 | --jungle-2-hsl: 74 68% 71%;
5 | --jungle-3-hsl: 75 62% 65%;
6 | --jungle-4-hsl: 74 56% 59%;
7 | --jungle-5-hsl: 74 53% 53%;
8 | --jungle-6-hsl: 74 55% 47%;
9 | --jungle-7-hsl: 74 66% 42%;
10 | --jungle-8-hsl: 74 79% 36%;
11 | --jungle-9-hsl: 73 90% 32%;
12 | --jungle-10-hsl: 73 91% 26%;
13 | --jungle-11-hsl: 73 91% 21%;
14 | --jungle-12-hsl: 73 90% 16%;
15 | }
16 |
--------------------------------------------------------------------------------
/examples/sveltekit/src/routes/[...index].svelte:
--------------------------------------------------------------------------------
1 |
14 |
15 |
9 |
10 | {connection.status === 'CLOSED'
11 | ? 'Offline'
12 | : connection.status === 'CONNECTING'
13 | ? 'Connecting'
14 | : 'Online'}
15 |
;
13 | export function captureSegments(content: string): {};
14 |
--------------------------------------------------------------------------------
/examples/express/client/routes/examples/[mode]/__assets/open-props/routify.props.indigo-hsl.css:
--------------------------------------------------------------------------------
1 | .routify {
2 | --indigo-0-hsl: 223 100% 96%;
3 | --indigo-1-hsl: 225 100% 93%;
4 | --indigo-2-hsl: 228 100% 86%;
5 | --indigo-3-hsl: 228 100% 78%;
6 | --indigo-4-hsl: 228 96% 72%;
7 | --indigo-5-hsl: 228 94% 67%;
8 | --indigo-6-hsl: 228 89% 63%;
9 | --indigo-7-hsl: 228 81% 59%;
10 | --indigo-8-hsl: 228 69% 55%;
11 | --indigo-9-hsl: 230 57% 50%;
12 | --indigo-10-hsl: 230 57% 43%;
13 | --indigo-11-hsl: 230 57% 37%;
14 | --indigo-12-hsl: 230 57% 30%;
15 | }
16 |
--------------------------------------------------------------------------------
/examples/starter-mobile/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "starter-basic-mobile",
3 | "type": "module",
4 | "scripts": {
5 | "build": "vite build",
6 | "preview": "vite preview",
7 | "dev": "vite"
8 | },
9 | "devDependencies": {
10 | "@roxi/routify": "^3.5.1",
11 | "@sveltejs/vite-plugin-svelte": "^2.4.2",
12 | "mdsvex": "^0.11.0",
13 | "spank": "^2.0.0",
14 | "svelte": "^4.1.2",
15 | "vite": "^4.0.0"
16 | },
17 | "dependencies": {
18 | "postcss-nesting": "^11.3.0"
19 | }
20 | }
--------------------------------------------------------------------------------
/test/e2e/an-app/app/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "starter-basic",
3 | "type": "module",
4 | "scripts": {
5 | "build": "vite build",
6 | "preview": "vite preview",
7 | "dev": "vite"
8 | },
9 | "devDependencies": {
10 | "@roxi/routify": "file:../../../..",
11 | "@sveltejs/vite-plugin-svelte": "^2.2.0",
12 | "mdsvex": "^0.9.3",
13 | "spank": "^2.0.0-12",
14 | "svelte": "^3.39.0",
15 | "vite": "^4.0.0"
16 | },
17 | "dependencies": {
18 | "postcss-nesting": "^11.2.1"
19 | }
20 | }
--------------------------------------------------------------------------------
/examples/starter/src/routes/examples/[mode]/landing-page/in-action/index.svelte:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | Inline Pages in Action
6 |
7 | Wondering how Inline Pages work in a real-world scenario? This page is built using
8 | inline pages. Every section is a separate page, and the navigation is handled by
9 | Routify. The result is a seamless browsing experience, with no page reloads or
10 | interruptions. The tabbed window below also uses inline pages.
11 |
12 |
--------------------------------------------------------------------------------
/typings/lib/extra/tools/ssr4.d.ts:
--------------------------------------------------------------------------------
1 | export function renderModule(module: (SvelteComponentDev | {
2 | default: SvelteComponentDev;
3 | }) & {
4 | load: (url: string) => Promise;
5 | }, urlOrOptions?: (string | string[] | import("../../runtime").PreloadOptions) | undefined): Promise<{
6 | html: string;
7 | status: number;
8 | css: {
9 | code: string;
10 | map: string;
11 | };
12 | head: "";
13 | error: string;
14 | maxage: number;
15 | props: {
16 | [x: string]: string;
17 | };
18 | redirect: string;
19 | }>;
20 |
--------------------------------------------------------------------------------
/typings/lib/extra/tools/ssr5.d.ts:
--------------------------------------------------------------------------------
1 | export function renderModule(module: (SvelteComponentDev | {
2 | default: SvelteComponentDev;
3 | }) & {
4 | load: (url: string) => Promise;
5 | }, urlOrOptions?: (string | string[] | import("../../runtime").PreloadOptions) | undefined): Promise<{
6 | html: string;
7 | status: number;
8 | css: {
9 | code: string;
10 | map: string;
11 | };
12 | head: "";
13 | error: string;
14 | maxage: number;
15 | props: {
16 | [x: string]: string;
17 | };
18 | redirect: string;
19 | }>;
20 |
--------------------------------------------------------------------------------
/examples/express/client/routes/examples/[mode]/__assets/open-props/extra/theme.css:
--------------------------------------------------------------------------------
1 | @import "../props.media.css";
2 | @import "theme.light.css";
3 |
4 | @media (--OSdark) {
5 | :where(.routify) {
6 | color-scheme: dark;
7 |
8 | --link: var(--indigo-3);
9 | --link-visited: var(--purple-3);
10 |
11 | --text-1: var(--gray-1);
12 | --text-2: var(--gray-4);
13 |
14 | --surface-1: var(--gray-9);
15 | --surface-2: var(--gray-8);
16 | --surface-3: var(--gray-7);
17 | --surface-4: var(--gray-6);
18 |
19 | --scrollthumb-color: var(--gray-6);
20 | }
21 | }
--------------------------------------------------------------------------------
/examples/starter/src/routes/examples/[mode]/__assets/open-props/extra/theme.css:
--------------------------------------------------------------------------------
1 | @import "../props.media.css";
2 | @import "theme.light.css";
3 |
4 | @media (--OSdark) {
5 | :where(.routify) {
6 | color-scheme: dark;
7 |
8 | --link: var(--indigo-3);
9 | --link-visited: var(--purple-3);
10 |
11 | --text-1: var(--gray-1);
12 | --text-2: var(--gray-4);
13 |
14 | --surface-1: var(--gray-9);
15 | --surface-2: var(--gray-8);
16 | --surface-3: var(--gray-7);
17 | --surface-4: var(--gray-6);
18 |
19 | --scrollthumb-color: var(--gray-6);
20 | }
21 | }
--------------------------------------------------------------------------------
/examples/starter/src/routes/examples/[mode]/__assets/open-props/extra/normalize.css:
--------------------------------------------------------------------------------
1 | @import "theme.css";
2 | @import "brand.css";
3 | @import "normalize.src.css";
4 |
5 | @media (--OSdark) {
6 | :where(textarea, select, input:not([type="button"],[type="submit"],[type="reset"])) {
7 | background-color: hsl(210 11% 10%);
8 | }
9 |
10 | :where(dialog) {
11 | background-color: var(--surface-2);
12 | }
13 |
14 | :where(.routify) {
15 | --shadow-strength: 10%;
16 | --shadow-color: 220 40% 2%;
17 | }
18 |
19 | ::placeholder {
20 | color: var(--gray-6);
21 | }
22 | }
--------------------------------------------------------------------------------
/examples/express-modular/packages/client/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "starter-basic",
3 | "type": "module",
4 | "scripts": {
5 | "build": "vite build",
6 | "preview": "vite preview",
7 | "dev": "vite",
8 | "test": "vitest"
9 | },
10 | "devDependencies": {
11 | "@roxi/routify": "^3.0.0-next.176",
12 | "@sveltejs/vite-plugin-svelte": "^2.4.2",
13 | "mdsvex": "^0.11.0",
14 | "spank": "^2.0.0",
15 | "svelte": "^4.1.2",
16 | "vite": "^4.4.1",
17 | "vitest": "latest"
18 | },
19 | "dependencies": {
20 | "postcss-nesting": "^11.3.0"
21 | }
22 | }
--------------------------------------------------------------------------------
/examples/express/client/routes/examples/[mode]/__assets/open-props/extra/normalize.css:
--------------------------------------------------------------------------------
1 | @import "theme.css";
2 | @import "brand.css";
3 | @import "normalize.src.css";
4 |
5 | @media (--OSdark) {
6 | :where(textarea, select, input:not([type="button"],[type="submit"],[type="reset"])) {
7 | background-color: hsl(210 11% 10%);
8 | }
9 |
10 | :where(dialog) {
11 | background-color: var(--surface-2);
12 | }
13 |
14 | :where(.routify) {
15 | --shadow-strength: 10%;
16 | --shadow-color: 220 40% 2%;
17 | }
18 |
19 | ::placeholder {
20 | color: var(--gray-6);
21 | }
22 | }
--------------------------------------------------------------------------------
/examples/express/client/routes/examples/[mode]/landing-page/__components/LandingPageSection.svelte:
--------------------------------------------------------------------------------
1 |
4 |
5 |
6 |
8 |
9 |
19 |
--------------------------------------------------------------------------------
/examples/portfolio/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "@example/portfolio",
3 | "version": "0.0.1",
4 | "scripts": {
5 | "dev": "svelte-kit dev",
6 | "build": "svelte-kit build",
7 | "preview": "svelte-kit preview"
8 | },
9 | "dependencies": {
10 | "@roxi/routify": "^3.5.1",
11 | "marked": "^4.0.0",
12 | "axios": "^0.24.0"
13 | },
14 | "devDependencies": {
15 | "@sveltejs/adapter-vercel": "^1.0.0-next.31",
16 | "@sveltejs/kit": "next",
17 | "svelte": "^4.0.5"
18 | },
19 | "type": "module",
20 | "routify": {
21 | "routesDir": "src/pages"
22 | }
23 | }
--------------------------------------------------------------------------------
/examples/starter/src/routes/examples/[mode]/landing-page/__components/LandingPageSection.svelte:
--------------------------------------------------------------------------------
1 |
4 |
5 |
6 |
8 |
9 |
19 |
--------------------------------------------------------------------------------
/lib/buildtime/RNodeBuildtime.js:
--------------------------------------------------------------------------------
1 | import { RNode } from '../common/RNode.js'
2 | import { RoutifyBuildtime } from './RoutifyBuildtime.js'
3 |
4 | /**
5 | * @extends {RNode}
6 | */
7 | export class RNodeBuildtime extends RNode {
8 | /** @type {RFile} */
9 | file
10 |
11 | /** @type {String} */
12 | asyncModule
13 |
14 | /**
15 | * @param {string} name
16 | * @param {string} module
17 | * @param {RoutifyBuildtime} instance
18 | */
19 | constructor(name, module, instance) {
20 | super(name, module, instance)
21 | }
22 | }
23 |
--------------------------------------------------------------------------------
/typings/lib/runtime/Router/urlReflectors/Address.d.ts:
--------------------------------------------------------------------------------
1 | export class AddressReflector extends BaseReflector {
2 | absorb: () => void;
3 | _pushstateHandler: (data: any, title: any, url: any) => any;
4 | _replacestateHandler: (data: any, title: any, url: any) => any;
5 | _popstateHandler: (event: any) => Promise;
6 | hooks: any[];
7 | _reflect: () => void;
8 | _getRouterUrl(): string;
9 | _createState(): any;
10 | }
11 | export type AddressReflectorOptions = {
12 | interceptHistory: boolean;
13 | };
14 | import { BaseReflector } from './ReflectorBase.js';
15 |
--------------------------------------------------------------------------------
/typings/lib/runtime/helpers/preload.d.ts:
--------------------------------------------------------------------------------
1 | export function preloadUrl(urlOrOptions?: (string | string[] | PreloadOptions) | undefined): Promise;
2 | export function preloadUrlFromUrlPairs(urlPairs: UrlPair[], routesMap?: RoutesMap | undefined): Promise;
3 | export function getPrimaryUrl(urlPairs: UrlPair[]): string;
4 | export type UrlPair = [routerName: string, url: string];
5 | export type RoutesMap = {
6 | [x: string]: () => Promise;
7 | };
8 | export type PreloadOptions = {
9 | routesMap?: RoutesMap | undefined;
10 | url?: (string | string[]) | undefined;
11 | };
12 |
--------------------------------------------------------------------------------
/.github/workflows/test-suite-ci.yml:
--------------------------------------------------------------------------------
1 | name: Test Suite CI
2 |
3 | on: [push, pull_request]
4 |
5 | jobs:
6 | test:
7 | name: Test on NodeJS v${{ matrix.node-version }}
8 | runs-on: ubuntu-latest
9 |
10 | strategy:
11 | matrix:
12 | node-version: [14.x]
13 |
14 | steps:
15 | - uses: actions/checkout@v2
16 | - name: Use Node.js ${{ matrix.node-version }}
17 | uses: actions/setup-node@v1
18 | with:
19 | node-version: ${{ matrix.node-version }}
20 | - run: npm i -g npm@7
21 | - run: npm ci --force
22 | - run: npm test
23 |
--------------------------------------------------------------------------------
/examples/feathersjs/packages/backend/migrations/20230724095532_todo.js:
--------------------------------------------------------------------------------
1 | export async function up(knex) {
2 | await knex.schema.createTable('todo', (table) => {
3 | table.increments('id')
4 | table.string('text')
5 | table.boolean('done')
6 | })
7 |
8 | // seed the table
9 | await knex('todo').insert({ text: 'Learn Routify', done: false})
10 | await knex('todo').insert({ text: 'Learn Feathers', done: false})
11 | await knex('todo').insert({ text: 'Learn Svelte', done: false})
12 | }
13 |
14 | export async function down(knex) {
15 | await knex.schema.dropTable('todo')
16 | }
17 |
--------------------------------------------------------------------------------
/examples/starter-mobile/src/routes/_module.svelte:
--------------------------------------------------------------------------------
1 |
8 |
9 |
12 |
14 |
15 |
16 |
22 |
--------------------------------------------------------------------------------
/typings/lib/buildtime/RNodeBuildtime.d.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * @extends {RNode}
3 | */
4 | export class RNodeBuildtime extends RNode {
5 | /**
6 | * @param {string} name
7 | * @param {string} module
8 | * @param {RoutifyBuildtime} instance
9 | */
10 | constructor(name: string, module: string, instance: RoutifyBuildtime);
11 | /** @type {RFile} */
12 | file: RFile;
13 | /** @type {String} */
14 | asyncModule: string;
15 | }
16 | import { RoutifyBuildtime } from './RoutifyBuildtime.js';
17 | import { RNode } from '../common/RNode.js';
18 |
--------------------------------------------------------------------------------
/typings/lib/runtime/plugins/scroller/utils.d.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * watches an element position relative to the viewport and waits for it to stop moving.
3 | * @param {HTMLElement} elem
4 | */
5 | export function waitForScrollToComplete(elem: HTMLElement): Promise;
6 | export function getNearestScrollLock(elem: any): any;
7 | export function observeDocument(callback: any, runOnInit: any, timeout: any): MutationObserver;
8 | export function backupScrollBehavior(elem: any): void;
9 | export function restoreScrollBehavior(elem: any): void;
10 | export function getAllAncestors(elem: HTMLElement): HTMLElement[];
11 |
--------------------------------------------------------------------------------
/examples/kitchensink/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "kitchensink",
3 | "type": "module",
4 | "scripts": {
5 | "build": "vite build",
6 | "preview": "vite preview",
7 | "dev": "vite"
8 | },
9 | "devDependencies": {
10 | "@roxi/routify": "^3.5.1",
11 | "@sveltejs/vite-plugin-svelte": "^2.4.2",
12 | "mdsvex": "^0.11.0",
13 | "spank": "^2.0.0",
14 | "svelte": "^4.0.5",
15 | "vite": "^4.4.3"
16 | },
17 | "routify": {
18 | "plugins": [
19 | "@roxi/routify/plugins/indexByName"
20 | ]
21 | }
22 | }
--------------------------------------------------------------------------------
/examples/kitchensink/src/routes/composition/using-meta/index.svelte:
--------------------------------------------------------------------------------
1 |
4 |
5 | Using-meta
6 |
7 |
8 | This file uses embeded metadata to reset the render tree. <!-- routify:meta reset -->
10 |
11 |
12 | Alternatively <!-- routify:meta reset="custom" -->
13 | or <!-- routify:meta reset="custom+" -->
14 | could have been used to prepend the custom module.
15 |
16 |
17 | Go back
18 |
19 |
--------------------------------------------------------------------------------
/lib/buildtime/plugins/devHelper/modal/Modal.svelte:
--------------------------------------------------------------------------------
1 |
12 |
13 |
14 | {#if show}
15 | Routify Helper
18 | {/if}
19 |
20 |
--------------------------------------------------------------------------------
/lib/runtime/Router/urlReflectors/LocalStorage.js:
--------------------------------------------------------------------------------
1 | import { BaseReflector } from './ReflectorBase.js'
2 |
3 | export class LocalStorageReflector extends BaseReflector {
4 | /** @param {Router} router */
5 | constructor(router) {
6 | super(router)
7 | this.storageName = `__routify-router-${this.router.name}`
8 | }
9 | reflect() {
10 | window.localStorage.setItem(this.storageName, this.router.url.internal())
11 | }
12 | install() {
13 | const url = window.localStorage.getItem(this.storageName)
14 | this.router.url.replace(url || '/')
15 | }
16 | }
17 |
--------------------------------------------------------------------------------