feat: upgrade svelte and plachta
All checks were successful
continuous-integration/drone/push Build is passing

This commit is contained in:
Damillora 2023-08-08 19:58:35 +07:00
parent 4f3d11dc02
commit b103804c73
9 changed files with 849 additions and 685 deletions

View File

@ -14,40 +14,40 @@
"format": "prettier --write --plugin-search-dir=. ." "format": "prettier --write --plugin-search-dir=. ."
}, },
"devDependencies": { "devDependencies": {
"@sveltejs/adapter-auto": "^1.0.0", "@sveltejs/adapter-auto": "^1.0.3",
"@sveltejs/adapter-node": "^1.0.0", "@sveltejs/adapter-node": "^1.3.1",
"@sveltejs/kit": "^1.0.1", "@sveltejs/kit": "^1.22.4",
"@types/fitvids": "^2.1.1", "@types/fitvids": "^2.1.1",
"@types/tryghost__content-api": "^1.3.11", "@types/tryghost__content-api": "^1.3.11",
"@typescript-eslint/eslint-plugin": "^5.46.1", "@typescript-eslint/eslint-plugin": "^5.62.0",
"@typescript-eslint/parser": "^5.46.1", "@typescript-eslint/parser": "^5.62.0",
"dayjs": "^1.11.7", "dayjs": "^1.11.9",
"eslint": "^8.30.0", "eslint": "^8.46.0",
"eslint-config-prettier": "^8.5.0", "eslint-config-prettier": "^8.10.0",
"eslint-plugin-svelte3": "^4.0.0", "eslint-plugin-svelte": "^2.32.4",
"hast-util-from-selector": "^2.0.0", "hast-util-from-selector": "^2.0.1",
"prettier": "^2.8.1", "prettier": "^2.8.8",
"prettier-plugin-svelte": "^2.9.0", "prettier-plugin-svelte": "^2.10.1",
"rehype-parse": "^8.0.4", "rehype-parse": "^8.0.4",
"rehype-stringify": "^9.0.3", "rehype-stringify": "^9.0.3",
"sass": "^1.57.0", "sass": "^1.64.2",
"svelte": "^3.55.0", "svelte": "^4.1.2",
"svelte-check": "^2.10.2", "svelte-check": "^3.4.6",
"svelte-infinite-scroll": "^2.0.1", "svelte-infinite-scroll": "^2.0.1",
"svelte-preprocess": "^4.10.7", "svelte-preprocess": "^5.0.4",
"svelte2tsx": "^0.5.22", "svelte2tsx": "^0.6.0",
"tslib": "^2.4.1", "tslib": "^2.6.1",
"typescript": "^4.9.4", "typescript": "^5.1.6",
"unified": "^10.1.2", "unified": "^10.1.2",
"unist-util-visit": "^4.1.1", "unist-util-visit": "^4.1.2",
"vite": "^4.0.1" "vite": "^4.4.9"
}, },
"type": "module", "type": "module",
"dependencies": { "dependencies": {
"@damillora/plachta": "^2.0.2", "@damillora/plachta": "^3.0.3",
"@tryghost/content-api": "^1.11.5", "@tryghost/content-api": "^1.11.16",
"fitvids": "^2.1.1", "fitvids": "^2.1.1",
"svelte-material-icons": "^2.0.4", "svelte-material-icons": "^3.0.0",
"svelte-themes": "^0.0.98" "svelte-themes": "^0.0.98"
} }
} }

File diff suppressed because it is too large Load Diff

View File

@ -1,7 +1,7 @@
<script lang="ts"> <script lang="ts">
import { generateSizesString, generateSrcsetString } from '$lib/content/srcset'; import { generateSizesString, generateSrcsetString } from '$lib/content/srcset';
import Hero from '@damillora/plachta/components/Hero/Hero.svelte'; import {Hero}from '@damillora/plachta';
export let background: string | null = null; export let background: string | null = null;
export let alt = ''; export let alt = '';

View File

@ -1,29 +1,20 @@
<script lang="ts"> <script lang="ts">
import { navigating } from '$app/stores';
import { goto } from '$app/navigation'; import { goto } from '$app/navigation';
import { browseSettings } from '$lib/content/contentApi'; import { browseSettings } from '$lib/content/contentApi';
import Base from '@damillora/plachta/components/Base/Base.svelte'; import { Base, Footer, Header, NavDarkMode, NavMenu, NavSearch, NavigationLoading } from '@damillora/plachta';
import Footer from '@damillora/plachta/components/Footer/Footer.svelte';
import Header from '@damillora/plachta/components/Header/Header.svelte';
import NavDarkMode from '@damillora/plachta/components/Nav/NavDarkMode.svelte';
import NavMenu from '@damillora/plachta/components/Nav/NavMenu.svelte';
import NavSearch from '@damillora/plachta/components/Nav/NavSearch.svelte';
import NavigationLoading from '@damillora/plachta/components/NavigationLoading/NavigationLoading.svelte';
import type { Load } from '@sveltejs/kit'; import type { Load } from '@sveltejs/kit';
const doSearch = (e: any) => { const doSearch = (e: any) => {
if (e.detail.query) { if (e.detail.query) {
goto('/search?q=' + e.detail.query, { replaceState: true, keepfocus: true }); goto('/search?q=' + e.detail.query, { replaceState: true, keepFocus: true });
} else { } else {
goto('/', { replaceState: true, keepfocus: true }); goto('/', { replaceState: true, keepFocus: true });
} }
}; };
export let data; export let data;
let loading = true;
navigating.subscribe((x) => (loading = x != null));
</script> </script>
<svelte:head> <svelte:head>
@ -48,8 +39,6 @@
</Footer> </Footer>
</Base> </Base>
<NavigationLoading {loading} />
<style lang="scss"> <style lang="scss">
// Responsive embeds // Responsive embeds
:global(.fluid-width-video-wrapper) { :global(.fluid-width-video-wrapper) {

View File

@ -1,16 +1,12 @@
<script lang="ts"> <script lang="ts">
import { browser } from '$app/environment'; import { browser } from '$app/environment';
import dayjs from 'dayjs'; import dayjs from 'dayjs';
import Container from '@damillora/plachta/components/Container/Container.svelte'; import { Container, Hero, Index, PostCard } from '@damillora/plachta';
import Hero from '@damillora/plachta/components/Hero/Hero.svelte';
import Index from '@damillora/plachta/components/PageTypes/Index.svelte';
import PostCard from '@damillora/plachta/components/PostCard/PostCard.svelte';
import { onMount } from 'svelte'; import { onMount } from 'svelte';
import IndexSeo from '$lib/components/SEO/IndexSEO.svelte'; import IndexSeo from '$lib/components/SEO/IndexSEO.svelte';
import {browsePost} from '$lib/content/contentApi'; import { browsePost } from '$lib/content/contentApi';
export let data; export let data;
let { posts } = data; let { posts } = data;

View File

@ -1,10 +1,6 @@
<script lang="ts"> <script lang="ts">
import Hero from '@damillora/plachta/components/Hero/Hero.svelte'; import { Hero, PostCard, Index, TagHeader, Post, Container } from '@damillora/plachta';
import PostCard from '@damillora/plachta/components/PostCard/PostCard.svelte';
import Index from '@damillora/plachta/components/PageTypes/Index.svelte';
import TagHeader from '@damillora/plachta/components/Post/TagHeader.svelte';
import Post from '@damillora/plachta/components/PageTypes/Post.svelte';
import Container from '@damillora/plachta/components/Container/Container.svelte';
import { browsePostWithTag, readTag } from '$lib/content/contentApi'; import { browsePostWithTag, readTag } from '$lib/content/contentApi';
import type { Load } from '@sveltejs/kit'; import type { Load } from '@sveltejs/kit';
import { onMount } from 'svelte'; import { onMount } from 'svelte';
@ -52,7 +48,11 @@
<Container> <Container>
<Post> <Post>
<TagHeader accent_color={data.tag.accent_color} name={data.tag.name} description={data.tag.description} /> <TagHeader
accent_color={data.tag.accent_color}
name={data.tag.name}
description={data.tag.description}
/>
</Post> </Post>
<Index> <Index>

View File

@ -1,15 +1,17 @@
<script lang="ts"> <script lang="ts">
import dayjs from 'dayjs'; import dayjs from 'dayjs';
import {
Hero,
PostHeader,
Post,
PostMain,
PostNavigator,
Container,
PostRelated,
PostCard,
GhostStyle
} from '@damillora/plachta';
import Hero from '@damillora/plachta/components/Hero/Hero.svelte';
import PostHeader from '@damillora/plachta/components/Post/PostHeader.svelte';
import Post from '@damillora/plachta/components/PageTypes/Post.svelte';
import PostMain from '@damillora/plachta/components/Post/PostMain.svelte';
import PostNavigator from '@damillora/plachta/components/Post/PostNavigator.svelte';
import Container from '@damillora/plachta/components/Container/Container.svelte';
import PostRelated from '@damillora/plachta/components/Post/PostRelated.svelte';
import PostCard from '@damillora/plachta/components/PostCard/PostCard.svelte';
import GhostStyle from '@damillora/plachta/components/Base/GhostStyle.svelte';
import { processPostHtml } from '$lib/content/postProcessor'; import { processPostHtml } from '$lib/content/postProcessor';
import type { Load } from '@sveltejs/kit'; import type { Load } from '@sveltejs/kit';
@ -48,8 +50,8 @@
<PostMain> <PostMain>
<GhostStyle> <GhostStyle>
{@html data.post.html} {@html data.post.html}
<br/> <br />
</GhostStyle> </GhostStyle>
<svelte:fragment slot="comments" /> <svelte:fragment slot="comments" />
</PostMain> </PostMain>
@ -57,9 +59,9 @@
</Post> </Post>
<PostRelated <PostRelated
name={data.post.primary_tag.name} name={data.post.primary_tag?.name}
url={data.post.primary_tag.url} url={data.post.primary_tag?.url}
accent_color={data.post.primary_tag.accent_color} accent_color={data.post.primary_tag?.accent_color}
> >
{#each data.relatedPost as post} {#each data.relatedPost as post}
<PostCard <PostCard

View File

@ -1,21 +1,17 @@
<script lang="ts"> <script lang="ts">
import PostCard from '@damillora/plachta/components/PostCard/PostCard.svelte'; import { Hero, PostCard, Index, Post, AuthorHeader, Container } from '@damillora/plachta';
import Index from '@damillora/plachta/components/PageTypes/Index.svelte';
import Post from '@damillora/plachta/components/PageTypes/Post.svelte';
import AuthorHeader from '@damillora/plachta/components/Post/AuthorHeader.svelte';
import Container from '@damillora/plachta/components/Container/Container.svelte';
import type { Load } from '@sveltejs/kit'; import type { Load } from '@sveltejs/kit';
import { browsePostWithAuthor, readAuthor } from '$lib/content/contentApi'; import { browsePostWithAuthor, readAuthor } from '$lib/content/contentApi';
import { onMount } from 'svelte'; import { onMount } from 'svelte';
import { browser } from '$app/environment'; import { browser } from '$app/environment';
import dayjs from 'dayjs'; import dayjs from 'dayjs';
import AuthorSeo from '$lib/components/SEO/AuthorSEO.svelte'; import AuthorSeo from '$lib/components/SEO/AuthorSEO.svelte';
import Hero from '@damillora/plachta/components/Hero/Hero.svelte';
export let author: any; export let author: any;
export let data; export let data;
let { posts } = data; let { posts } = data;
let newPosts: any[] = []; let newPosts: any[] = [];
let page = 1; let page = 1;
$: posts = [...posts, ...newPosts]; $: posts = [...posts, ...newPosts];

View File

@ -2,10 +2,8 @@
import { browser } from '$app/environment'; import { browser } from '$app/environment';
import dayjs from 'dayjs'; import dayjs from 'dayjs';
import Container from '@damillora/plachta/components/Container/Container.svelte'; import { Container, Hero, Index, SearchCard } from '@damillora/plachta';
import Hero from '@damillora/plachta/components/Hero/Hero.svelte';
import Index from '@damillora/plachta/components/PageTypes/Index.svelte';
import SearchCard from '@damillora/plachta/components/PostCard/SearchCard.svelte';
import { onMount } from 'svelte'; import { onMount } from 'svelte';
import { search } from '$lib/content/searchApi'; import { search } from '$lib/content/searchApi';
import type { Load } from '@sveltejs/kit'; import type { Load } from '@sveltejs/kit';