eightequal/AstralRinth
1
0
Fork 0
forked from didirus/AstralRinth
Code Pull Requests Activity

Update utilities and documentation

Browse Source
This commit is contained in:
venashial
2022-05-20 19:53:13 -07:00
parent d8b59925b0
commit 8bf90714da
26 changed files with 6974 additions and 5236 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
.vscode/settings.json vendored Normal file
View File

@@ -0,0 +1,8 @@
{
"editor.formatOnSave": true,
"editor.defaultFormatter": "esbenp.prettier-vscode",
"editor.formatOnPaste": true,
"[javascript]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
}
}

4
README.md
View File

@@ -4,9 +4,7 @@ _The Modrinth component library, in Svelte_
---
### ⚠️ In-progress: Not accepting contributions currently.
Learn more at [omorphia.modrinth.com.](https://omorphia.modrinth.com)
Read the documentation at [omorphia.modrinth.com.](https://omorphia.modrinth.com)
Requires Node v16.5+.

3
package.json
View File

@@ -83,5 +83,8 @@
"throttle-debounce": "^3.0.1",
"undici": "^5.2.0",
"unplugin-icons": "^0.13.3"
},
"engines": {
"node": ">=16.5.0"
}
}

11683
pnpm-lock.yaml generated
View File

File diff suppressed because it is too large Load Diff

6
src/package/index.ts
View File

@@ -23,3 +23,9 @@ export { default as Select } from './components/Select.svelte';
export { default as Slider } from './components/Slider.svelte';
export { default as TextInput } from './components/TextInput.svelte';
/* UTILITIES */
export { ago } from './utils/ago';
export { Permissions } from './utils/permissions';
export { formatVersions } from './utils/versions';
export { markdown, markdownInline } from './utils/parse';

10
src/package/plugins/generator/index.d.ts vendored Normal file
View File

@@ -0,0 +1,10 @@
export default function Generator(options: PluginOptions): {
name: string;
buildStart(): Promise<void>;
};
export interface PluginOptions {
projectColors: boolean;
landingPage: boolean;
gameVersions: boolean;
tags: boolean;
}

21
src/package/plugins/generator/index.ts → src/package/plugins/generator/index.js
View File

@@ -12,18 +12,16 @@ process.env.VITE_API_URL || process.env?.NODE_ENV === 'development'
// Time to live: 7 days
const TTL = 7 * 24 * 60 * 60 * 1000;
export default function Generator(options: PluginOptions) {
export default function Generator(options) {
return {
name: 'rollup-plugin-omorphia-generator',
async buildStart() {
let state: State = {};
let state = {};
try {
state = JSON.parse(await fs.readFile('./generated/state.json', 'utf8'));
} catch {
// File doesn't exist, create folder
await fs.mkdir('./generated', { recursive: true });
await fs.writeFile(
'./generated/state.json',
JSON.stringify(
@@ -35,7 +33,6 @@ export default function Generator(options: PluginOptions) {
)
);
}
// Don't generate if the last generation was less than TTL and the options are the same
if (
state?.lastGenerated &&
@@ -44,12 +41,10 @@ export default function Generator(options: PluginOptions) {
) {
return;
}
if (options.landingPage) await landingPage(API_URL);
if (options.projectColors) await projectColors(API_URL);
if (options.gameVersions) await gameVersions(API_URL);
if (options.tags) await tags(API_URL);
// Write new state
state.lastGenerated = new Date().toISOString();
state.options = options;
@@ -57,15 +52,3 @@ export default function Generator(options: PluginOptions) {
},
};
}
export interface PluginOptions {
projectColors: boolean;
landingPage: boolean;
gameVersions: boolean;
tags: boolean;
}
interface State {
lastGenerated?: string;
options?: PluginOptions;
}

1
src/package/plugins/generator/outputs/gameVersions.d.ts vendored Normal file
View File

@@ -0,0 +1 @@
export declare function gameVersions(API_URL: string): Promise<void>;

4
src/package/plugins/generator/outputs/gameVersions.ts → src/package/plugins/generator/outputs/gameVersions.js
View File

@@ -2,18 +2,16 @@ import { fetch } from 'undici';
import { promises as fs } from 'fs';
import cliProgress from 'cli-progress';
export async function gameVersions(API_URL: string) {
export async function gameVersions(API_URL) {
const progressBar = new cliProgress.SingleBar({
format: 'Generating game versions | {bar} | {percentage}%',
barCompleteChar: '\u2588',
barIncompleteChar: '\u2591',
hideCursor: true,
});
progressBar.start(2, 0);
const gameVersions = await (await fetch(API_URL + 'tag/game_version')).json();
progressBar.increment();
// Write JSON file

1
src/package/plugins/generator/outputs/landingPage.d.ts vendored Normal file
View File

@@ -0,0 +1 @@
export declare function landingPage(API_URL: string): Promise<void>;

8
src/package/plugins/generator/outputs/landingPage.ts → src/package/plugins/generator/outputs/landingPage.js
View File

@@ -2,20 +2,19 @@ import { fetch } from 'undici';
import { promises as fs } from 'fs';
import cliProgress from 'cli-progress';
export async function landingPage(API_URL: string) {
export async function landingPage(API_URL) {
const progressBar = new cliProgress.SingleBar({
format: 'Generating landing page | {bar} | {percentage}% || {value}/{total} mods',
barCompleteChar: '\u2588',
barIncompleteChar: '\u2591',
hideCursor: true,
});
progressBar.start(100, 0);
// Fetch top 100 mods
const response = (await (
const response = await (
await fetch(API_URL + 'search?limit=100&facets=[["project_type:mod"]]')
).json()) as Record<string, any>;
).json();
// Simplified array with the format: ['id', 'slug', 'icon_extension']
const compressed = response.hits
@@ -37,6 +36,5 @@ export async function landingPage(API_URL: string) {
random: Math.random(),
})
);
progressBar.stop();
}

1
src/package/plugins/generator/outputs/projectColors.d.ts vendored Normal file
View File

@@ -0,0 +1 @@
export declare function projectColors(API_URL: string): Promise<void>;

26
src/package/plugins/generator/outputs/projectColors.ts → src/package/plugins/generator/outputs/projectColors.js
View File

@@ -5,30 +5,21 @@ import Jimp from 'jimp';
import { getAverageColor } from 'fast-average-color-node';
// Note: This function has issues and will occasionally fail with some project icons. It averages at a 99.4% success rate. Most issues are from ECONNRESET errors & Jimp not being able to handle webp & svg images.
export async function projectColors(API_URL: string) {
export async function projectColors(API_URL) {
const progressBar = new cliProgress.SingleBar({
format: 'Generating project colors | {bar} | {percentage}% || {value}/{total} projects',
barCompleteChar: '\u2588',
barIncompleteChar: '\u2591',
hideCursor: true,
});
// Get total number of projects
const projectCount = (
(await (await fetch(API_URL + 'search?limit=0')).json()) as Record<string, any>
).total_hits;
const projectCount = (await (await fetch(API_URL + 'search?limit=0')).json()).total_hits;
progressBar.start(projectCount, 0);
const writeStream = createWriteStream('./generated/projects.json');
writeStream.write('{');
// Used to form the JSON string (so that the first doesn't have a comma prefix)
let first = true;
let completed = 0;
// Number of pages through search to fetch
const requestCount = Math.ceil(projectCount / 100);
await Promise.allSettled(
@@ -37,15 +28,13 @@ export async function projectColors(API_URL: string) {
if (!response.ok) {
throw new Error(`Failed to fetch projects: ${response.statusText}`);
}
// Get project hits & use map to get rid of extra data
const hits = ((await response.json()) as Record<string, any>).hits.map((project) => ({
const hits = (await response.json()).hits.map((project) => ({
project_id: project.project_id,
slug: project.slug,
title: project.title,
icon_url: project.icon_url,
}));
// Try parsing the icon of each project
await Promise.allSettled(
hits.map(async (project) => {
@@ -59,32 +48,25 @@ export async function projectColors(API_URL: string) {
const image = await Jimp.read(
project.icon_url.replace('cdn', 'cdn-raw') // Skip redirect to raw CDN
);
// Resize image before getting average color (faster)
image.resize(256, 256);
// Get bottom edge of image
const edge = image.clone().crop(0, 255, 256, 1);
const buffer = await edge.getBufferAsync(Jimp.AUTO);
let color = (await getAverageColor(buffer)).hexa;
// If the edge is transparent, use the average color of the entire image
if (color === '#00000000') {
const buffer = await image.getBufferAsync(Jimp.AUTO);
color = (await getAverageColor(buffer)).hexa;
}
// Remove color transparency
color = color.replace(/.{2}$/, '');
// Only use comma prefix if not first
let prefix = ',';
if (first) {
prefix = '';
first = false;
}
writeStream.write(`${prefix}"${project.project_id}":"${color}"`);
completed++;
} catch (error) {
@@ -97,10 +79,8 @@ export async function projectColors(API_URL: string) {
);
})
);
writeStream.write('}');
writeStream.end();
progressBar.stop();
console.log(`Failed to parse ${projectCount - completed} project icons.`);
}

1
src/package/plugins/generator/outputs/tags.d.ts vendored Normal file
View File

@@ -0,0 +1 @@
export declare function tags(API_URL: string): Promise<void>;

9
src/package/plugins/generator/outputs/tags.ts → src/package/plugins/generator/outputs/tags.js
View File

@@ -1,31 +1,27 @@
import { fetch } from 'undici';
import { promises as fs } from 'fs';
import cliProgress from 'cli-progress';
export async function tags(API_URL: string) {
export async function tags(API_URL) {
const progressBar = new cliProgress.SingleBar({
format: 'Generating tags | {bar} | {percentage}%',
barCompleteChar: '\u2588',
barIncompleteChar: '\u2591',
hideCursor: true,
});
progressBar.start(7, 0);
// eslint-disable-next-line prefer-const
let [categories, loaders, licenses, donationPlatforms]: any = await Promise.all([
let [categories, loaders, licenses, donationPlatforms] = await Promise.all([
await (await fetch(API_URL + 'tag/category')).json(),
await (await fetch(API_URL + 'tag/loader')).json(),
await (await fetch(API_URL + 'tag/license')).json(),
await (await fetch(API_URL + 'tag/donation_platform')).json(),
]);
progressBar.update(4);
// Delete icons from original arrays
categories = categories.map(({ icon, ...rest }) => rest);
loaders = loaders.map(({ icon, ...rest }) => rest);
progressBar.increment();
// Create single object with icons
@@ -33,7 +29,6 @@ export async function tags(API_URL: string) {
...categories.reduce((a, v) => ({ ...a, [v.name]: v.icon }), {}),
...loaders.reduce((a, v) => ({ ...a, [v.name]: v.icon }), {}),
};
progressBar.increment();
// Set project types

2
src/package/styles/classes/card.postcss
View File

@@ -91,7 +91,7 @@
--padding: 1rem 1.3rem;
}
&.text {
&.markdown {
--padding: 1.5rem;
}

4
src/package/utils/index.ts
View File

@@ -1,4 +0,0 @@
export { ago } from './ago';
export { simplify } from './number';
export { Permissions } from './permissions';
export { formatVersions } from './versions';

22
src/package/utils/parse.ts
View File

@@ -40,7 +40,7 @@ marked.setOptions({
function sanitize(html: string): string {
return insane(html, {
allowedAttributes: {
a: ['href', 'name', 'target', 'title', 'rel'],
a: ['href', 'target', 'title', 'rel'],
iframe: ['allowfullscreen', 'src', 'width', 'height'],
img: ['src', 'width', 'height', 'alt'],
h1: ['id'],
@@ -121,14 +121,22 @@ function sanitize(html: string): string {
});
}
export function markdown(markdown: string): string {
return marked.parse(markdown);
}
export function markdownInline(markdown: string): string {
return marked.parseInline(markdown);
return insane(
marked.parseInline(markdown),
{
allowedAttributes: {
a: ['href', 'target', 'title', 'rel'],
},
allowedClasses: {},
allowedSchemes: ['http', 'https', 'mailto'],
allowedTags: ['a', 'b', 'br', 'code', 'em', 'i', 'strike', 'strong', 'sub', 'sup', 'u'],
transformText: null,
},
true
);
}
export function markdownXSS(markdown: string): string {
export function markdown(markdown: string): string {
return sanitize(marked.parse(markdown));
}

3
src/package/utils/versions.ts
View File

@@ -79,8 +79,7 @@ export function formatVersions(versionArray: string[]): string {
return output.join(', ');
}
export const getPrimary = (files: Version['files']) =>
files.find((file) => file.primary) || files[0];
export const getPrimary = (files) => files.find((file) => file.primary) || files[0];
export function downloadUrl(file): string {
return import.meta.env.VITE_API_URL + `version_file/${file?.hashes.sha1}/download`;

27
src/routes/_internal/components/Example.svelte
View File

@@ -1,35 +1,38 @@
<script lang="ts">
import { Button } from 'omorphia'
import IconMoon from 'virtual:icons/heroicons-outline/moon'
import IconSun from 'virtual:icons/heroicons-outline/sun'
import { Button } from 'omorphia';
import IconMoon from 'virtual:icons/heroicons-outline/moon';
import IconSun from 'virtual:icons/heroicons-outline/sun';
export let meta: { raised: boolean };
let theme = 'light'
let background = meta.raised ? 'var(--color-raised-bg)' : 'var(--color-bg)'
let theme = 'light';
let background = meta.raised ? 'var(--color-raised-bg)' : 'var(--color-bg)';
</script>
<div class="example">
<div class="example__preview theme-{theme} base" style:background={background}>
<slot name="example"/>
<div class="example__preview theme-{theme} base" style:background>
<slot name="example" />
</div>
<div class="example__source">
<div class="example__source__options">
<Button color="primary-light" on:click={() => theme === 'light' ? theme = 'dark' : theme = 'light'}>
<Button
color="primary-light"
on:click={() => (theme === 'light' ? (theme = 'dark') : (theme = 'light'))}
>
{#if theme === 'light'}
<IconMoon/>
<IconMoon />
{:else}
<IconSun/>
<IconSun />
{/if}
</Button>
</div>
<pre class="example__source__code language-svelte"><slot name="code"/></pre>
<pre class="example__source__code language-svelte"><slot name="code" /></pre>
</div>
</div>
<style lang="postcss">
.example {
margin-bottom: 32px;
margin: 15px 0 32px;
&__preview {
border-radius: var(--rounded-sm-top);

271
src/routes/_internal/components/Sidebar.svelte
View File

@@ -1,157 +1,162 @@
<script lang="ts">
import { page } from '$app/stores';
import { page } from '$app/stores';
import IconMenu from 'virtual:icons/lucide/menu';
import IconMenu from 'virtual:icons/lucide/menu';
const components = Object.keys(import.meta.glob('../../components/**'))
.map((it) => it.replace('../../components/', '').replace('.md', ''))
.sort();
const components = Object.keys(import.meta.glob('../../components/**'))
.map((it) => it.replace('../../components/', '').replace('.md', ''))
.sort();
const classes = Object.keys(import.meta.glob('../../classes/**'))
.map((it) => it.replace('../../classes/', '').replace('.md', ''))
.sort();
const classes = Object.keys(import.meta.glob('../../classes/**'))
.map((it) => it.replace('../../classes/', '').replace('.md', ''))
.sort();
let slideIn = false;
let slideIn = false;
$: if ($page.url.pathname) {
slideIn = false;
}
$: if ($page.url.pathname) {
slideIn = false;
}
</script>
<nav class="sidebar" class:slideIn>
<div class="sidebar__content">
<div class="section">
<span class="section__title">Getting started</span>
<a href="/" class="section__link">Introduction</a>
<a href="/getting-started/configure" class="section__link">Configure</a>
<a href="/getting-started/icons" class="section__link">Using Icons</a>
<a href="/getting-started/css" class="section__link">Writing CSS</a>
<a href="/getting-started/illustrations" class="section__link">Illustrations</a>
<a href="/getting-started/utils" class="section__link">Built-in utilities</a>
<a href="/getting-started/generator" class="section__link">Generator plugin</a>
<div class="sidebar__content">
<div class="section">
<span class="section__title">Getting started</span>
<a href="/" class="section__link">Introduction</a>
<a href="/getting-started/configure" class="section__link">Configure</a>
<a href="/getting-started/icons" class="section__link">Using Icons</a>
<!-- <a href="/getting-started/css" class="section__link">Writing CSS</a> -->
<a href="/getting-started/illustrations" class="section__link">Illustrations</a>
<a href="/getting-started/utils" class="section__link">Built-in utilities</a>
<a href="/getting-started/generator" class="section__link">Generator plugin</a>
</div>
<div class="section">
<span class="section__title">Components</span>
{#each components as component}
<a href="/components/{component}" class="section__link">{component}</a>
{/each}
</div>
<div class="section">
<span class="section__title">Classes</span>
{#each classes as page}
<a href="/classes/{page}" class="section__link">{page}</a>
{/each}
</div>
</div>
<div class="section">
<span class="section__title">Components</span>
{#each components as component}
<a href="/components/{component}" class="section__link">{component}</a>
{/each}
</div>
<div class="section">
<span class="section__title">Classes</span>
{#each classes as page}
<a href="/classes/{page}" class="section__link">{page}</a>
{/each}
</div>
</div>
<button class="sidebar__toggle" on:click={() => (slideIn = !slideIn)}>
<IconMenu />
</button>
<button class="sidebar__toggle" on:click={() => (slideIn = !slideIn)}>
<IconMenu />
</button>
</nav>
<style lang="postcss">
:root {
--sidebar-color: hsl(220, 15%, 40%);
--title-color: hsl(216, 10%, 80%);
--link-color: hsl(216, 10%, 90%);
--scrollbar-thumb-color: hsl(216, 10%, 70%);
}
.sidebar {
background-color: var(--sidebar-color);
color: var(--title-color);
width: var(--sidebar-width);
max-width: 70vw;
position: fixed;
left: -100%;
top: 0;
z-index: 5;
transition: left 0.2s ease-in-out;
box-shadow: 2px 0px 4px hsla(221, 39%, 11%, 0.2);
@media (--md) {
left: 0;
:root {
--sidebar-color: hsl(220, 15%, 40%);
--title-color: hsl(216, 10%, 80%);
--link-color: hsl(216, 10%, 90%);
--scrollbar-thumb-color: hsl(216, 10%, 70%);
}
&__content {
mask-image: linear-gradient(to bottom, transparent, hsla(0, 0%, 0%, 1) 5% 95%, transparent);
padding: 88px 32px 32px;
height: 100vh;
max-height: 100vh;
overflow-y: auto;
grid-gap: 40px;
display: flex;
flex-direction: column;
.sidebar {
background-color: var(--sidebar-color);
color: var(--title-color);
width: var(--sidebar-width);
max-width: 70vw;
position: fixed;
left: -100%;
top: 0;
z-index: 5;
transition: left 0.2s ease-in-out;
box-shadow: 2px 0px 4px hsla(221, 39%, 11%, 0.2);
.section {
display: flex;
flex-direction: column;
grid-gap: 0.5rem;
&__title {
text-transform: uppercase;
font-size: 12px;
@media (--md) {
left: 0;
}
&__link {
color: var(--link-color);
text-decoration: none;
&__content {
mask-image: linear-gradient(
to bottom,
transparent,
hsla(0, 0%, 0%, 1) 5% 95%,
transparent
);
padding: 88px 32px 32px;
height: 100vh;
max-height: 100vh;
overflow-y: auto;
grid-gap: 40px;
display: flex;
flex-direction: column;
&:hover {
.section {
display: flex;
flex-direction: column;
grid-gap: 0.5rem;
&__title {
text-transform: uppercase;
font-size: 12px;
}
&__link {
color: var(--link-color);
text-decoration: none;
&:hover {
color: white;
text-decoration: underline;
}
}
}
}
&__toggle {
position: fixed;
left: 16px;
bottom: 16px;
padding: 8px;
aspect-ratio: 1 / 1;
background-color: var(--accent-color);
z-index: 20;
border-radius: var(--rounded);
color: white;
text-decoration: underline;
}
box-shadow: var(--shadow-inset-sm), var(--shadow-floating);
transition: left 0.2s cubic-bezier(0.38, 0.52, 0.37, 1.27);
:global(.icon) {
width: 32px;
height: auto;
}
@media (--md) {
visibility: hidden;
}
}
&.slideIn {
left: 0;
.sidebar__toggle {
left: calc(32px + min(70vw, var(--sidebar-width)));
}
}
scrollbar-color: var(--scrollbar-thumb-color) var(--sidebar-color);
&::-webkit-scrollbar {
width: 14px;
}
&::-webkit-scrollbar-track {
background-color: var(--sidebar-color);
}
&::-webkit-scrollbar-thumb {
background-color: var(--scrollbar-thumb-color);
border-radius: 999px;
border: 3px solid var(--sidebar-color);
}
}
}
&__toggle {
position: fixed;
left: 16px;
bottom: 16px;
padding: 8px;
aspect-ratio: 1 / 1;
background-color: var(--accent-color);
z-index: 20;
border-radius: var(--rounded);
color: white;
box-shadow: var(--shadow-inset-sm), var(--shadow-floating);
transition: left 0.2s cubic-bezier(0.38, 0.52, 0.37, 1.27);
:global(.icon) {
width: 32px;
height: auto;
}
@media (--md) {
visibility: hidden;
}
}
&.slideIn {
left: 0;
.sidebar__toggle {
left: calc(32px + min(70vw, var(--sidebar-width)));
}
}
scrollbar-color: var(--scrollbar-thumb-color) var(--sidebar-color);
&::-webkit-scrollbar {
width: 14px;
}
&::-webkit-scrollbar-track {
background-color: var(--sidebar-color);
}
&::-webkit-scrollbar-thumb {
background-color: var(--scrollbar-thumb-color);
border-radius: 999px;
border: 3px solid var(--sidebar-color);
}
}
</style>

4
src/routes/_internal/styles/gh-markdown.postcss
View File

@@ -19,7 +19,7 @@
}
&:where(h1, h2, h3, h4, h5, h6) {
margin: 20px 0 10px;
margin: 30px 0 10px;
padding: 0;
font-weight: bold;
-webkit-font-smoothing: antialiased;
@@ -76,6 +76,8 @@
font-size: 24px;
/*border-bottom: 1px solid #cccccc;*/
color: black;
margin-top: 50px;
}
&:where(h3) {

0
src/routes/getting-started/css.md → src/routes/getting-started/_css.md
View File

79
src/routes/getting-started/utils.md
View File

@@ -2,25 +2,82 @@
title: Built-in utilities
---
TODO
## Markdown
## ... ago
Use the markdown utilities to parse markdown text into HTML. Both markdown parsers have HTML sanitization built-in.
## Simplify number
### Body parser
## Markdown & XSS
The `markdown` parser is designed for bodies of markdown text and supports images, tables, lists, and youtube `<iframe>`s.
### Parsers
> Use the `.markdown` class on the element containing your parsed markdown.
- sanitize
- markdown
- markdownInline
- markdownXSS
```svelte example
<script lang="ts">
import { markdown } from "omorphia"
### Markdown
const source = '## Example markdown \n\
This is **some** *text*! \n\
#### An image \n\
<img src="https://cdn.modrinth.com/data/YL57xq9U/images/d382106b9a2b943d06107c31c139c77849f1a0e8.png" />'
</script>
Put parsed HTML into a `<div>` with `class="markdown"`.
<div class="card markdown">
{@html markdown(source)}
</div>
```
### Inline parser
The `markdownInline` parser is perfect for translations and short bios. It doesn't allow complex elements such as images or tables.
```svelte example raised
<script lang="ts">
import { markdownInline } from "omorphia"
const source = "This is some **bolded** and *italicized* text."
</script>
<p>{@html markdownInline(source)}</p>
```
## Human readable "ago" times
```svelte example raised
<script lang="ts">
import { ago } from 'omorphia';
</script>
<p>Something happened {ago(Date.now())}.</p>
<p>Something happened {ago(new Date(Date.now() - 1000 * 60 * 60 * 2))}.</p>
<p>Something happened {ago(new Date(Date.now() - 1000 * 60 * 60 * 24 * 7))}.</p>
<p>Something happened {ago(new Date(Date.now() - 1000 * 60 * 60 * 24 * 7 * 5))}.</p>
```
## Permissions
The `Permissions` class provides an easy way to manage user permissions.
```ts
import { Permissions } from 'omorphia';
const adminLevel = new Permissions('ALL');
const memberLevel = new Permissions(member.permissions); /* `member` from API */
const userLevel = new Permissions(0);
if (memberLevel.data.uploadVersions) {
console.log('Can upload versions!');
}
```
## Versions
The `formatVersions` function provides an easy way to parse a project's versions into a readable string.
```svelte example raised
<script lang="ts">
import { formatVersions } from 'omorphia';
</script>
<p>{formatVersions(["1.18", "1.18.1", "1.18.2", "1.17.1"])}</p>
```

11
svelte.config.js
View File

@@ -5,6 +5,7 @@ import examples from 'mdsvexamples/vite';
import sveld from './plugins/sveld.js';
import path from 'path';
import { preprocess, plugins } from './src/package/config/svelte.config.js';
import Generator from './src/package/plugins/generator/index.js';
/** @type {import('@sveltejs/kit').Config} */
const config = {
@@ -20,6 +21,9 @@ const config = {
},
vite: {
plugins: [
Generator({
gameVersions: true,
}),
...plugins,
examples,
sveld(),
@@ -29,6 +33,7 @@ const config = {
alias: {
$package: path.resolve('./src/package'),
$routes: path.resolve('./src/routes'),
$generated: path.resolve('./generated'),
omorphia: path.resolve('./src/package'),
},
},
@@ -38,6 +43,12 @@ const config = {
external: '/_app/COMPONENT_API.json',
},
},
server: {
fs: {
allow: ['generated'],
},
},
},
files: {
lib: 'src/package',

1
tsconfig.json
View File

@@ -5,6 +5,7 @@
"omorphia": ["src/package"],
"$package/*": ["src/package/*"],
"$routes/*": ["src/routes/*"],
"$generated/*": ["generated/*"],
"$lib": ["src/package"],
"$lib/*": ["src/package/*"]
},