vowel 0.1.46 → 0.2.2

package/src/lib/components/FrontmatterProperty.svelte

@@ -1,78 +0,0 @@
-<script>
-	import { sentenceCase } from 'change-case';
-	import Frontmatter from './Frontmatter.svelte';
-	import Image from './Markdown/Image.svelte';
-
-	/** @type {{ property: any, key: string }}*/
-	let { property, key, format } = $props();
-</script>
-
-{#if property}
-	<dl class={key}>
-		<dt>{sentenceCase(key)}</dt>
-		<dd>
-			{@render propertySwitch(property)}
-		</dd>
-	</dl>
-{/if}
-
-{#snippet array(items)}
-	<ul>
-		{#each items as item}
-			<li>
-				{@render propertySwitch(item)}
-			</li>
-		{/each}
-	</ul>
-{/snippet}
-
-{#snippet propertySwitch(value)}
-	{#if value.type === 'array'}
-		{@render array(value.output)}
-	{:else if value.type === 'object'}
-		<Frontmatter props={{ properties: value.output, format }} />
-	{:else if value.type === 'image'}
-		{@render image(value.output)}
-	{:else if value.type === 'date'}
-		{@render date(value.output)}
-	{:else if value.type === 'url'}
-		{@render url(value.output)}
-	{:else}
-		{value.output || value}
-	{/if}
-{/snippet}
-
-{#snippet image(value)}
-	<Image node={{ url: value, alt: '' }} />
-{/snippet}
-
-{#snippet date(value)}
-	{@const date = new Date(value)}
-	<time datetime={date.toISOString()}>{date.toLocaleDateString('en-US')}</time>
-{/snippet}
-
-{#snippet url(value)}
-	{#if format === 'rss'}
-		<a href={value.url}>
-			{value.title || value['og:title']}
-		</a>
-	{:else}
-		<article class="link-preview">
-			<a href={value.url}>
-				{#if value['og:image']}
-					<img src={value['og:image']} alt="" />
-				{/if}
-				<h2>
-					{value.title || value['og:title']}
-				</h2>
-				<p>
-					{value['og:description'] || value.og_description || value.description}
-				</p>
-			</a>
-		</article>
-	{/if}
-{/snippet}
-
-{#snippet pdf(value)}
-	<a href={value.url}>{value.url}</a>
-{/snippet}

package/src/lib/components/Markdown/Image.svelte

@@ -1,50 +0,0 @@
-<script>
-	let { node } = $props();
-	let { url, alt } = node;
-
-	let defaultWidth = 800;
-	const srcsetWidths = [640, 828, 1080, 1200, 1920, 2048, 3840];
-
-	let urlObject = createURLObject();
-
-	function createURLObject() {
-		try {
-			return new URL(url);
-		} catch (e) {
-			// console.error(`Error on image ${url}:`);
-			// console.error(e);
-		}
-	}
-
-	let srcset = createSrcset();
-
-	function createSrcset() {
-		if (urlObject?.host.includes('imgix.net')) {
-			urlObject?.searchParams.set('width', String(defaultWidth));
-			urlObject?.searchParams.append('auto', 'format,compress');
-
-			return srcsetWidths.reduce((srcset, width) => {
-				urlObject?.searchParams.set('width', width);
-				return `${srcset}, ${urlObject?.href} ${width}w`;
-			}, '');
-
-			urlObject?.searchParams.set('width', String(defaultWidth));
-		}
-	}
-</script>
-
-{#if urlObject?.pathname?.endsWith('.svg')}
-	<object type="image/svg+xml" data={urlObject.href} title={alt}></object>
-{:else if urlObject}
-	<img src={urlObject.href} {alt} {srcset} />
-{/if}
-
-<style>
-	img {
-		transition: max-width 1s linear;
-		max-width: 100%;
-		height: auto;
-		width: auto;
-		margin-inline: auto;
-	}
-</style>

package/src/lib/components/Markdown/Link.svelte

@@ -1,19 +0,0 @@
-<script>
-	import Markdown from './index.svelte';
-
-	let { node, level, website } = $props();
-	let { url, children } = $derived(node);
-
-	function isAbsoluteURL(url) {
-		try {
-			new URL(url);
-			return true;
-		} catch (e) {
-			return false;
-		}
-	}
-</script>
-
-<a href={url} target={isAbsoluteURL(url) ? '_blank' : null}>
-	<Markdown props={{ ast: children, level, website }} />
-</a>

package/src/lib/components/Markdown/LinkPreview.svelte

@@ -1,45 +0,0 @@
-<script>
-	let { metadata, url, format } = $props();
-	let { image, description, og_description, author } = $derived(metadata || {});
-
-	const href = $derived(metadata?.og_url || metadata?.canonical || url || '');
-
-	const title = $derived(metadata?.og_title || metadata?.title || '');
-
-	const urlObject = new URL(url);
-</script>
-
-{#if metadata}
-	{#if format === 'rss'}
-		<p><a {href}>{title ? title + ' - ' : ''}{urlObject.host}</a></p>
-	{:else}
-		<article class="link-preview">
-			<a {href}>
-				{#if image}
-					<img src={image} alt="" />
-				{/if}
-				<h2>{title ? title + ' - ' : ''}<span class="host">{urlObject.host}</span></h2>
-				{#if author}
-					<p>
-						By {author}
-					</p>
-				{/if}
-				{#if description || og_description}
-					<p>
-						{description || og_description}
-					</p>
-				{/if}
-			</a>
-		</article>
-	{/if}
-{:else if format === 'rss'}
-	<p><a {href}>{urlObject.host}</a></p>
-{:else}
-	<article class="link-preview">
-		<a {href}>
-			<h2>
-				<span class="host">{urlObject.host}</span>
-			</h2>
-		</a>
-	</article>
-{/if}

package/src/lib/components/Markdown/Text.svelte

@@ -1,6 +0,0 @@
-<script>
-	let { node } = $props();
-	let { value } = $derived(node);
-</script>
-
-{value}

package/src/lib/components/Markdown/index.svelte

@@ -1,147 +0,0 @@
-<script>
-	import { Page } from '$lib/components';
-	import { getPage, getPagesByFolder, createPageClass, createFolderClass } from '$lib/utilities';
-	import { getFolderAndCount, isFileLink } from './validators';
-	import Image from './Image.svelte';
-	import Link from './Link.svelte';
-	import Text from './Text.svelte';
-	import LinkPreview from './LinkPreview.svelte';
-	import { toString } from 'mdast-util-to-string';
-	import { kebabCase } from 'change-case';
-
-	let { props } = $props();
-
-	let { ast, level, website, format, identifier } = $derived(props);
-
-	function getElement(node) {
-		if (node.type === 'heading') {
-			return ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'div', 'div'][node.depth - 1];
-		}
-		const elements = {
-			emphasis: 'em',
-			text: 'span',
-			paragraph: 'p',
-			strong: 'strong',
-			list: node.ordered ? 'ol' : 'ul',
-			// listItem: 'li',
-			blockquote: 'blockquote',
-			inlineCode: 'code',
-			code: 'pre',
-			figure: 'figure',
-			figcaption: 'figcaption',
-			delete: 's',
-			table: 'table',
-			tableRow: 'tr',
-			tableCell: 'td'
-		};
-
-		// Handle list item separately
-		// Handle `pre` properly
-		// Handle `footnoteDefinition` and `footnoteReference`
-
-		if (elements[node.type]) return elements[node.type];
-	}
-
-	const noteTypes = {
-		tip: 'Tip',
-		note: 'Note',
-		important: 'Important',
-		warning: 'Warning',
-		caution: 'Caution'
-	};
-</script>
-
-{#if ast}
-	{#each ast as node}
-		{@const { count, path, property, content } = getFolderAndCount(node)}
-		{#if count}
-			{@const pages = getPagesByFolder(website, path, true, count, property)}
-			<section class={createFolderClass(path)}>
-				{#each pages as page}
-					<article class={createPageClass(page.url, 'thumbnail')}>
-						<Page link={true} {content} {page} level={level + 1} {website} {format} />
-					</article>
-				{/each}
-			</section>
-		{:else if isFileLink(node)}
-			<article class={createPageClass(node.children[0].value, 'thumbnail')}>
-				<Page
-					link={true}
-					page={getPage(website, node.children[0].value)}
-					level={level + 1}
-					{website}
-					content={false}
-					{format}
-				/>
-			</article>
-		{:else if node.type === 'heading'}
-			<svelte:element this={getElement(node)} id={kebabCase(toString(node))}>
-				<svelte:self props={{ ast: node.children, level }} />
-			</svelte:element>
-		{:else if node.type === 'link' && node.children}
-			<Link {node} {level} {website} {format} />
-		{:else if node.type === 'thematicBreak'}
-			<hr />
-		{:else if node.type === 'image'}
-			<Image {node} />
-		{:else if node.type === 'url'}
-			<!-- {@const dummy = console.log(node)} -->
-			<LinkPreview url={node.url} metadata={node.metadata} {format} />
-		{:else if node.type === 'listItem'}
-			{@const isChecklistItem = node.checked !== null}
-			{#if isChecklistItem}
-				<li
-					class={`checklist-item ${node.checked ? 'checked' : 'unchecked'}`}
-					style:list-style-type={`"${node.checked ? '☑' : '☐'}"`}
-				>
-					<svelte:self props={{ ast: node.children, level, format }} />
-				</li>
-			{:else}
-				<li>
-					<svelte:self props={{ ast: node.children, level, format }} />
-				</li>
-			{/if}
-		{:else if node.type === 'footnoteReference'}
-			<sup
-				><a
-					href={`#footnote-definition-${node.identifier}`}
-					id={`footnote-${node.identifier}`}
-					aria-describedby="footnotes">{node.label}</a
-				></sup
-			>
-		{:else if node.type === 'footnotes'}
-			<section id="footnotes">
-				<h2>Footnotes</h2>
-				<ol>
-					{#each node.children as footnote}
-						<li id={`footnote-definition-${footnote.identifier}`}>
-							<svelte:self
-								props={{ ast: footnote.children, level, format, identifier: footnote.identifier }}
-							/>
-						</li>
-					{/each}
-				</ol>
-			</section>
-		{:else if node.type === 'containerDirective' && noteTypes[node.name]}
-			<aside class={`alert ${node.name}`}>
-				<h2>
-					{noteTypes[node.name]}
-				</h2>
-				<svelte:self props={{ ast: node.children, level, format }}></svelte:self>
-			</aside>
-		{:else if node.children}
-			<svelte:element this={getElement(node)}>
-				<svelte:self props={{ ast: node.children, level, format }} />{#if identifier}<a
-						href={`#footnote-${identifier}`}
-						aria-label="Back to content">↩</a
-					>{/if}
-			</svelte:element>
-		{:else if node.type === 'text'}
-			<Text {node} />
-		{:else}
-			<svelte:element this={getElement(node)}>
-				<Text {node} />
-			</svelte:element>
-		{/if}
-	{/each}
-{/if}

package/src/lib/components/Markdown/validators.js

@@ -1,29 +0,0 @@
-const pathRegex = /^\/[\/\$\w\d=-_\.\?&-]*$/;
-
-export function getFolderAndCount(node) {
-	if (
-		node.type === 'paragraph' &&
-		node.children.length === 1 &&
-		node.children[0].type === 'text' &&
-		(node.children[0].value.match(pathRegex) || node.children[0].value.match(/^\/$/))
-	) {
-		const urlObject = new URL(node.children[0].value, 'https://placeholder.getvowel.com');
-		const isFolder = urlObject.searchParams.get('count');
-		const property = urlObject.searchParams.get('property');
-		const content = urlObject.searchParams.get('content') === 'true';
-		if (isFolder) return { count: isFolder, path: urlObject.pathname, property, content };
-	}
-	return false;
-}
-
-export function isFileLink(node) {
-	if (
-		node.type === 'paragraph' &&
-		node.children.length === 1 &&
-		node.children[0].type === 'text' &&
-		node.children[0].value.match(pathRegex)
-	) {
-		return true;
-	}
-	return false;
-}

package/src/lib/components/Nav.svelte

@@ -1,40 +0,0 @@
-<script>
-	import { getFileLabel, getFolderLabel, isActiveLink } from '$lib/utilities';
-
-	let { folder, segments, child } = $props();
-
-	// There's definitely a better way to filter this
-	function filterFolder(folder) {
-		const filteredFolder = {};
-		for (let key in folder) {
-			if ((!folder[key]['$']?.date && !key.startsWith('$')) || key.length === 1) {
-				filteredFolder[key] = folder[key];
-			}
-		}
-		return filteredFolder;
-	}
-
-	const evergreen = $derived(filterFolder(folder));
-</script>
-
-{#if Object.keys(evergreen).some((key) => key !== '$' && key !== '_')}
-	<nav class="top-bar">
-		{#if !child}
-			<a aria-current={isActiveLink(segments)} href={evergreen?.url || evergreen['$']?.url}
-				>{getFolderLabel(evergreen, true)}</a
-			>
-		{/if}
-		{#each Object.keys(evergreen) as key}
-			{#if !key.match(/^[$_]$/) && key !== '.obsidian'}
-				<a
-					href={evergreen?.url || evergreen[key]['_']?.url || evergreen[key]['$']?.url}
-					aria-current={isActiveLink(segments, key)}
-					>{getFolderLabel(evergreen[key], true) || key}</a
-				>
-			{/if}
-		{/each}
-	</nav>
-	{#if segments[0]}
-		<svelte:self folder={evergreen[segments[0]]} segments={segments.slice(1)} child={true} />
-	{/if}
-{/if}

package/src/lib/components/NoStyles.svelte

@@ -1,5 +0,0 @@
-<svelte:head>
-	<style>
-		/* Nothing to see here */
-	</style>
-</svelte:head>

package/src/lib/components/Page.svelte

@@ -1,90 +0,0 @@
-<script>
-	import { Markdown, Frontmatter } from '$lib/components';
-	import { toString } from 'mdast-util-to-string';
-	import { kebabCase } from 'change-case';
-	import Image from './Markdown/Image.svelte';
-
-	let { page, content = true, link, level = 0, website = {}, format = 'html', webmentions } = $props();
-	let { ast, title, date, image, imputedProperties } = $derived(page || {});
-
-	let headerImage = $derived(image?.output || !content && imputedProperties.image)
-
-	const dateObject = date?.type === 'date' && new Date(date.output);
-	// TODO: Add conditional logic for format = 'xml'
-
-	const headings = ast.filter((child) => child.type === 'heading');
-</script>
-
-<!-- Image -->
-{#if headerImage}
-	{#if link}
-		<a href={page.url} class="image">
-			<Image node={{ url: headerImage, alt: '' }} />
-		</a>
-	{:else}
-		<Image node={{ url: headerImage, alt: '' }} />
-	{/if}
-{/if}
-
-<!-- Title -->
-{#if title}
-	{#if link && page.url}
-		<h1>
-			<a href={page.url}>
-				{page.imputedProperties.title || title || page.imputedProperties?.fileName}
-			</a>
-		</h1>
-	{:else}
-		<h1 class="p-name">{page.imputedProperties.title || title || page.imputedProperties?.fileName}</h1>
-	{/if}
-{/if}
-
-<!-- Date -->
-{#if link}
-	{#if dateObject}
-		<time class="dt-published" datetime={dateObject.toISOString()}>
-			<a href={page.url}>
-				{dateObject.toLocaleDateString()}
-			</a>
-		</time>
-	{/if}
-{:else if dateObject}
-	<time datetime={dateObject.toISOString()}>{dateObject.toLocaleDateString()}</time>
-{/if}
-
-<Frontmatter props={{ properties: page, website, format }} />
-
-{#if page?.description || (!content && page?.imputedProperties?.description)}
-	<p class="description p-summary">{page?.description || page?.imputedProperties.description}</p>
-{/if}
-
-{#if format === 'html' && page.toc && headings.length > 1}
-	<dl class="contents">
-		<dt>Contents</dt>
-		<dd>
-			<ul>
-				{#each headings as heading, index}
-					{@const headingString = toString(heading.children)}
-					<li class={`heading depth-${heading.depth}`}>
-						<a href={`#${kebabCase(headingString)}`}>{headingString}</a>
-					</li>
-				{/each}
-			</ul>
-		</dd>
-	</dl>
-{/if}
-
-{#if level < 2 && content}
-	<section class="content e-content">
-		<Markdown props={{ ast, level, website, format }} />
-	</section>
-{/if}
-
-{#if level < 2 && content && website._?.webmentions && webmentions?.children?.length}
-	<section class="webmentions">
-		<h2>Webmentions</h2>
-		{#each webmentions.children as webmention}
-			<a href={webmention.url} target="_blank">{webmention.url}</a>
-		{/each}
-	</section>
-{/if}

package/src/lib/components/ResetStyles.svelte

@@ -1,7 +0,0 @@
-<script>
-	import styles from './ResetStyles.css?inline';
-</script>
-
-<svelte:head>
-  {@html `<style>${styles}</style>`}
-</svelte:head>

package/src/lib/components/Sitemap.svelte

@@ -1,38 +0,0 @@
-<script>
-	import { getFileLabel } from '$lib/utilities';
-	import { getFolderLabel, isActiveLink } from '../utilities';
-
-	let { section, key, root, segments } = $props();
-
-	const element = section['_'] ? 'ul' : 'div';
-</script>
-
-<!-- TODO: Add a sort -->
-
-{#if typeof section === 'object'}
-	<ul>
-		{#if root}
-			<li class="home">
-				<a aria-current={isActiveLink(segments)} href={section['$'].url}>
-					{getFileLabel(section['$']) || getFolderLabel(section)}
-				</a>
-			</li>
-		{/if}
-		{#each Object.keys(section) as key}
-			{#if Object.keys(section[key]).length === 1 && section[key].$ && !section[key].$.date && !key.startsWith('$')}
-				<li class={key}>
-					<a aria-current={isActiveLink(segments, key)} href={section[key].$.url}>
-						{getFileLabel(section[key]['$'], true) || getFolderLabel(section[key], true)}
-					</a>
-				</li>
-			{:else if section[key].$ && !section[key].$.date && !key.startsWith('$')}
-				<li class={key}>
-					<a aria-current={isActiveLink(segments, key)} href={section[key].$.url}>
-						{getFileLabel(section[key]['$']) || getFolderLabel(section[key])}
-					</a>
-					<svelte:self section={section[key]} segments={segments.slice(1)} {key} />
-				</li>
-			{/if}
-		{/each}
-	</ul>
-{/if}

package/src/lib/components/TypographyStyles.svelte

@@ -1,10 +0,0 @@
-<script>
-	import styles from './TypographyStyles.css?inline';
-	import ResetStyles from './ResetStyles.svelte';
-</script>
-
-<ResetStyles />
-
-<svelte:head>
-  {@html `<style>${styles}</style>`}
-</svelte:head>

package/src/lib/components/index.js

@@ -1,12 +0,0 @@
-export { default as Breadcrumbs } from './Breadcrumbs.svelte';
-export { default as Markdown } from './Markdown/index.svelte';
-export { default as Nav } from './Nav.svelte';
-export { default as Frontmatter } from './Frontmatter.svelte';
-export { default as Page } from './Page.svelte';
-export { default as Sitemap } from './Sitemap.svelte';
-export { default as FrontmatterProperty } from './FrontmatterProperty.svelte';
-export { default as FrontmatterTaxonomy } from './FrontMatterTaxonomy.svelte';
-export { default as ResetStyles } from './ResetStyles.svelte';
-export { default as TypographyStyles } from './TypographyStyles.svelte';
-export { default as DefaultStyles } from './DefaultStyles.svelte';
-export { default as NoStyles } from './NoStyles.svelte';

package/src/lib/index.js

@@ -1 +0,0 @@
-// place files you want to import through the `$lib` alias in this folder.

package/src/lib/utilities/buildURL.js

@@ -1,18 +0,0 @@
-/**
- * Build a URL for a file.
- * @param {string} parents - Parent URL.
- * @param {string} route - Filename.
- * @returns {string} - URL for the file.
- */
-export default function buildURL(parents, route) {
-	if (!parents) {
-		if (route === 'home' || route === 'settings') {
-			return '/';
-		}
-		return '/' + route;
-	}
-	if (route === 'home' || route === 'settings') {
-		return parents;
-	}
-	return parents + '/' + route;
-}

package/src/lib/utilities/checkFileExists.js

@@ -1,16 +0,0 @@
-import fs from 'fs/promises';
-// import { constants as fsConstants } from 'fs';
-
-/**
- * Description
- * @param {string} folderPath - File page for a document.
- * @returns {Promise<boolean>}
- */
-export default async function checkFileExists(folderPath) {
-	try {
-		await fs.access(folderPath);
-		return true; // Folder exists
-	} catch (error) {
-		return false; // Folder does not exist
-	}
-}

package/src/lib/utilities/createFolderClass.js

@@ -1,4 +0,0 @@
-export default function createFolderClass(url) {
-	if (url === '/') return 'folder-root';
-	return 'folder' + url.replaceAll('/', '-');
-}

package/src/lib/utilities/createPageClass.js

@@ -1,6 +0,0 @@
-export default function createPageClass(url, type = 'page') {
-	if (!url) return 'item';
-	if (url === '/') return `page home`;
-	if (type === 'page') return `page ${url.split('/').join(' ')}`;
-	return type + url.split('/').join(' ');
-}

package/src/lib/utilities/getFileLabel.js

@@ -1,35 +0,0 @@
-import { capitalCase } from 'change-case';
-
-function createTitleFromDescription(description) {
-	if (description?.length > 30) {
-		return description.slice(0, 30) + '...';
-	}
-	return description;
-}
-
-export default function getFileLabel(page, shorter = false, date = true) {
-	const description = createTitleFromDescription(
-		page?.description || page?.imputedProperties?.description
-	);
-
-	const fileName = page?.imputedProperties?.fileName
-		? capitalCase(page?.imputedProperties?.fileName)
-		: false;
-
-	const formattedDate =
-		page?.date && date
-			? new Intl.DateTimeFormat('en-US').format(new Date(page?.date?.output))
-			: false;
-
-	return (
-		(shorter && page?.breadcrumb) ||
-		page?.title ||
-		page?.imputedProperties?.title ||
-		page?.breadcrumb ||
-		formattedDate ||
-		(shorter && fileName) ||
-		description ||
-		fileName ||
-		null
-	);
-}