@treeseed/core 0.10.22 → 0.11.0

package/dist/components/ui/shell/ProjectHeader.astro

@@ -1,66 +0,0 @@
----
-import Badge from '../data/Badge.astro';
-import Button from '../forms/Button.astro';
-import type { ButtonAction } from '../types.js';
-
-interface TabItem {
-	label: string;
-	href: string;
-}
-
-interface Props {
-	title: string;
-	description?: string;
-	badges?: string[];
-	actions?: ButtonAction[];
-	tabs?: TabItem[];
-	currentPath?: string;
-	class?: string;
-}
-
-const {
-	title,
-	description,
-	badges = [],
-	actions = [],
-	tabs = [],
-	currentPath = '',
-	class: className,
-} = Astro.props as Props;
----
-
-<section class:list={['ts-project-header', className]}>
-	<div class="ts-project-header__main">
-		{badges.length > 0 ? (
-			<div class="ts-project-header__badges">
-				{badges.map((badge) => <Badge>{badge}</Badge>)}
-			</div>
-		) : null}
-		<h2>{title}</h2>
-		{description ? <p>{description}</p> : null}
-	</div>
-	{actions.length > 0 || Astro.slots.has('actions') ? (
-		<div class="ts-project-header__actions">
-			{actions.map((action) => (
-				<Button
-					href={action.href}
-					type={action.type}
-					variant={action.variant ?? 'secondary'}
-					ariaLabel={action.ariaLabel}
-					disabled={action.disabled}
-					size="sm"
-				>
-					{action.label}
-				</Button>
-			))}
-			<slot name="actions" />
-		</div>
-	) : null}
-	{tabs.length > 0 ? (
-		<nav class="ts-shell-tabs" aria-label="Project">
-			{tabs.map((tab) => (
-				<a class="ts-shell-tab" href={tab.href} aria-current={currentPath === tab.href ? 'page' : undefined}>{tab.label}</a>
-			))}
-		</nav>
-	) : null}
-</section>

package/dist/components/ui/shell/PublicFooter.astro

@@ -1,39 +0,0 @@
----
-import FooterSubscribeForm from '../../forms/FooterSubscribeForm.astro';
-import { PROJECT_STAGE } from '../../../utils/content-status';
-import { SITE } from '../../../utils/seo';
-import { SITE_FOOTER_MENU } from '../../../utils/site-config';
-
-interface Props {
-	currentPath?: string;
-}
-
-const { currentPath = Astro.url.pathname } = Astro.props as Props;
----
-
-<footer class="ts-public-footer">
-	<div class="ts-public-footer__inner">
-		<div class="ts-public-footer__grid">
-			<div class="ts-public-footer__column">
-				<p class="ts-public-footer__title">{SITE.name}</p>
-				<p class="ts-public-footer__copy">{SITE.summary}</p>
-			</div>
-			<div class="ts-public-footer__column">
-				<p class="ts-public-footer__heading">Project stage</p>
-				<p class="ts-public-footer__column-title">{PROJECT_STAGE.label}</p>
-				<p class="ts-public-footer__copy">{PROJECT_STAGE.description}</p>
-			</div>
-			{SITE_FOOTER_MENU.map((group) => (
-				<div class="ts-public-footer__column">
-					<p class="ts-public-footer__heading">{group.label}</p>
-					<div class="ts-public-footer__links">
-						{group.items.map((item) => (
-							<a href={item.href}>{item.label}</a>
-						))}
-					</div>
-				</div>
-			))}
-		</div>
-		<FooterSubscribeForm currentPath={currentPath} />
-	</div>
-</footer>

package/dist/components/ui/shell/PublicShell.astro

@@ -1,184 +0,0 @@
----
-import '../../../styles/tokens.css';
-import '../../../styles/theme.css';
-import '../../../styles/ui.css';
-import '../../../styles/forms.css';
-import '../../../styles/app-shell.css';
-import { ClientRouter } from 'astro:transitions';
-import ThemeScript from '../theme/ThemeScript.astro';
-import ThemeMenu from '../theme/ThemeMenu.astro';
-import TopBar from './TopBar.astro';
-import Button from '../forms/Button.astro';
-import PublicFooter from './PublicFooter.astro';
-import DevWatchReload from '../../DevWatchReload.astro';
-import type { ButtonAction } from '../types.js';
-import type { ThemePreference } from '../../../utils/theme.js';
-
-interface Brand {
-	name: string;
-	tag?: string;
-	href: string;
-	logoSrc?: string;
-	logoAlt?: string;
-	mark?: string;
-}
-
-interface NavItem {
-	label: string;
-	href: string;
-	ariaLabel?: string;
-}
-
-interface NavGroup {
-	label: string;
-	items: NavItem[];
-}
-
-interface Props {
-	title: string;
-	description: string;
-	currentPath: string;
-	appearance: ThemePreference;
-	brand: Brand;
-	navItems: NavItem[];
-	navGroups?: NavGroup[];
-	actions?: ButtonAction[];
-	showAppearanceControl?: boolean;
-	preferServerAppearance?: boolean;
-	contentWidth?: 'shell' | 'content';
-}
-
-const {
-	title,
-	description,
-	currentPath,
-	appearance,
-	brand,
-	navItems,
-	navGroups = [],
-	actions = [],
-	showAppearanceControl = true,
-	preferServerAppearance = false,
-	contentWidth = 'shell',
-} = Astro.props as Props;
-
-function isCurrentPath(href: string) {
-	if (href === '/') return currentPath === '/';
-	return currentPath === href || currentPath.startsWith(href);
-}
----
-
-<!doctype html>
-<html lang="en">
-	<head>
-		<meta charset="utf-8" />
-		<meta name="viewport" content="width=device-width, initial-scale=1" />
-		<title>{title}</title>
-		<meta name="description" content={description} />
-		<link rel="icon" href="/favicon.svg" type="image/svg+xml" />
-		<link rel="shortcut icon" href="/favicon.svg" type="image/svg+xml" />
-		<ThemeScript
-			defaultScheme={appearance.scheme}
-			defaultMode={appearance.mode}
-			preferDefaultPreference={preferServerAppearance}
-		/>
-		<ClientRouter />
-		<slot name="head" />
-	</head>
-	<body>
-		<a class="ts-skip-link" href="#main-content">Skip to content</a>
-		<div class:list={['ts-public-shell', contentWidth === 'content' && 'ts-public-shell--content']}>
-			<header class="ts-public-shell__header">
-				<TopBar brand={brand}>
-					<Fragment slot="actions">
-						<nav class="ts-public-shell__nav" aria-label="Primary" data-ts-public-nav>
-							{navGroups.length > 0 ? (
-								navGroups.map((group) => (
-									<details class="ts-public-shell__nav-group" data-ts-public-nav-group>
-										<summary
-											class:list={[
-												'ts-public-shell__link ts-public-shell__summary',
-												group.items.some((item) => isCurrentPath(item.href)) && 'ts-public-shell__summary--active',
-											]}
-										>
-											{group.label}
-											<span aria-hidden="true">▾</span>
-										</summary>
-										<div class="ts-public-shell__menu">
-											{group.items.map((item) => (
-												<a
-													class="ts-public-shell__menu-link"
-													href={item.href}
-													aria-label={item.ariaLabel}
-													aria-current={isCurrentPath(item.href) ? 'page' : undefined}
-												>
-													{item.label}
-												</a>
-											))}
-										</div>
-									</details>
-								))
-							) : (
-								navItems.map((item) => (
-									<a class="ts-public-shell__link" href={item.href} aria-label={item.ariaLabel} aria-current={isCurrentPath(item.href) ? 'page' : undefined}>
-										{item.label}
-									</a>
-								))
-							)}
-						</nav>
-						{showAppearanceControl ? <ThemeMenu selectedScheme={appearance.scheme} selectedMode={appearance.mode} /> : null}
-						{actions.map((action) => (
-							<Button
-								href={action.href}
-								type={action.type}
-								variant={action.variant ?? 'secondary'}
-								ariaLabel={action.ariaLabel}
-								disabled={action.disabled}
-								reload={action.reload}
-								size="sm"
-							>
-								{action.label}
-							</Button>
-						))}
-						<slot name="actions" />
-					</Fragment>
-				</TopBar>
-			</header>
-			<main class="ts-public-shell__main" id="main-content">
-				<slot />
-			</main>
-			{Astro.slots.has('footer') ? <slot name="footer" /> : <PublicFooter currentPath={currentPath} />}
-			<slot name="afterFooter" />
-		</div>
-		<DevWatchReload />
-		<script>
-			const publicNav = document.querySelector('[data-ts-public-nav]');
-			const navGroups = document.querySelectorAll<HTMLDetailsElement>('[data-ts-public-nav-group]');
-
-			navGroups.forEach((group) => {
-				group.addEventListener('toggle', () => {
-					if (!group.open) return;
-					navGroups.forEach((otherGroup) => {
-						if (otherGroup !== group) otherGroup.open = false;
-					});
-				});
-			});
-
-			document.addEventListener('click', (event) => {
-				if (!(publicNav instanceof HTMLElement)) return;
-				if (event.target instanceof Node && publicNav.contains(event.target)) return;
-				navGroups.forEach((group) => {
-					group.open = false;
-				});
-			});
-
-			publicNav?.addEventListener('click', (event) => {
-				const target = event.target;
-				if (!(target instanceof HTMLElement) || !target.closest('a')) return;
-				navGroups.forEach((group) => {
-					group.open = false;
-				});
-			});
-		</script>
-	</body>
-</html>

package/dist/components/ui/shell/RailNav.astro

@@ -1,42 +0,0 @@
----
-interface NavItem {
-	label: string;
-	href: string;
-	ariaLabel?: string;
-}
-
-interface Props {
-	items: NavItem[];
-	currentPath: string;
-	label?: string;
-	class?: string;
-}
-
-const {
-	items,
-	currentPath,
-	label = 'Application',
-	class: className,
-} = Astro.props as Props;
-
-function normalizePath(path: string) {
-	if (path.length <= 1) return path;
-	return path.replace(/\/+$/u, '');
-}
-
-function isCurrentPath(href: string) {
-	const current = normalizePath(currentPath);
-	const target = normalizePath(href);
-	if (target === '/') return current === '/';
-	if (target === '/app') return current === '/app';
-	return current === target || current.startsWith(`${target}/`);
-}
----
-
-<nav class:list={['ts-rail-nav', className]} aria-label={label}>
-	{items.map((item) => (
-		<a class="ts-rail-nav__link" href={item.href} aria-label={item.ariaLabel} aria-current={isCurrentPath(item.href) ? 'page' : undefined}>
-			<span>{item.label}</span>
-		</a>
-	))}
-</nav>

package/dist/components/ui/shell/ShellIconLink.astro

@@ -1,30 +0,0 @@
----
-interface Props {
-	href: string;
-	label: string;
-	icon: 'book' | 'manager';
-}
-
-const { href, label, icon } = Astro.props as Props;
----
-
-<a
-	href={href}
-	aria-label={label}
-	title={label}
-	class="ts-public-shell__icon-link ts-public-shell__icon-link--stroke"
->
-	{icon === 'manager' ? (
-		<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true" focusable="false">
-			<path d="M12 15.25a3.25 3.25 0 1 0 0-6.5 3.25 3.25 0 0 0 0 6.5Z" />
-			<path d="M19.43 12.98c.04-.32.07-.65.07-.98s-.02-.66-.07-.98l2.05-1.6-2-3.46-2.42.98a7.65 7.65 0 0 0-1.7-.98L15 3.38h-4l-.36 2.58c-.6.24-1.17.57-1.7.98l-2.42-.98-2 3.46 2.05 1.6c-.04.32-.07.65-.07.98s.02.66.07.98l-2.05 1.6 2 3.46 2.42-.98c.52.41 1.09.74 1.7.98l.36 2.58h4l.36-2.58c.6-.24 1.17-.57 1.7-.98l2.42.98 2-3.46-2.05-1.6Z" />
-		</svg>
-	) : (
-		<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true" focusable="false">
-			<path d="M4.75 5.75A2.75 2.75 0 0 1 7.5 3h11.75v16.25H7.5a2.75 2.75 0 0 0-2.75 2.75V5.75Z" />
-			<path d="M7.5 19.25h11.75" />
-			<path d="M8.25 7.25h7.5" />
-			<path d="M8.25 10.75h6" />
-		</svg>
-	)}
-</a>

package/dist/components/ui/shell/TopBar.astro

@@ -1,52 +0,0 @@
----
-import Button from '../forms/Button.astro';
-import type { ButtonAction } from '../types.js';
-
-interface Brand {
-	name: string;
-	tag?: string;
-	href: string;
-	logoSrc?: string;
-	logoAlt?: string;
-	mark?: string;
-}
-
-interface Props {
-	brand: Brand;
-	actions?: ButtonAction[];
-	class?: string;
-}
-
-const {
-	brand,
-	actions = [],
-	class: className,
-} = Astro.props as Props;
----
-
-<div class:list={['ts-top-bar', className]}>
-	<a class="ts-shell-brand" href={brand.href}>
-		<span class="ts-shell-brand__mark">
-			{brand.logoSrc ? <img src={brand.logoSrc} alt={brand.logoAlt ?? ''} width="60" height="60" loading="eager" /> : brand.mark}
-		</span>
-		<span class="ts-shell-brand__text">
-			<span class="ts-shell-brand__name">{brand.name}</span>
-			{brand.tag ? <span class="ts-shell-brand__tag">{brand.tag}</span> : null}
-		</span>
-	</a>
-	<div class="ts-top-bar__actions">
-		<slot name="actions" />
-		{actions.map((action) => (
-			<Button
-				href={action.href}
-				type={action.type}
-				variant={action.variant ?? 'secondary'}
-				ariaLabel={action.ariaLabel}
-				disabled={action.disabled}
-				size="sm"
-			>
-				{action.label}
-			</Button>
-		))}
-	</div>
-</div>

package/dist/components/ui/surface/Card.astro

@@ -1,46 +0,0 @@
----
-import type { Tone } from '../types.js';
-
-interface Props {
-	href?: string;
-	eyebrow?: string;
-	title?: string;
-	description?: string;
-	tone?: Tone;
-	interactive?: boolean;
-	class?: string;
-}
-
-const {
-	href,
-	eyebrow,
-	title,
-	description,
-	tone = 'default',
-	interactive = false,
-	class: className,
-} = Astro.props as Props;
-
-const classes = ['ts-card', className].filter(Boolean).join(' ');
-const isInteractive = href || interactive;
----
-
-{
-	href ? (
-		<a href={href} class={classes} data-tone={tone} data-interactive="true">
-			{eyebrow ? <p class="ts-card__eyebrow">{eyebrow}</p> : null}
-			{title ? <h3 class="ts-card__title">{title}</h3> : null}
-			{description ? <p class="ts-card__description">{description}</p> : null}
-			<div class="ts-card__body"><slot /></div>
-			<slot name="footer" />
-		</a>
-	) : (
-		<article class={classes} data-tone={tone} data-interactive={isInteractive ? 'true' : undefined}>
-			{eyebrow ? <p class="ts-card__eyebrow">{eyebrow}</p> : null}
-			{title ? <h3 class="ts-card__title">{title}</h3> : null}
-			{description ? <p class="ts-card__description">{description}</p> : null}
-			<div class="ts-card__body"><slot /></div>
-			<slot name="footer" />
-		</article>
-	)
-}

package/dist/components/ui/surface/EmptyState.astro

@@ -1,45 +0,0 @@
----
-import Button from '../forms/Button.astro';
-import type { ButtonAction } from '../types.js';
-
-interface Props {
-	eyebrow?: string;
-	title: string;
-	description?: string;
-	actions?: ButtonAction[];
-	class?: string;
-}
-
-const {
-	eyebrow,
-	title,
-	description,
-	actions = [],
-	class: className,
-} = Astro.props as Props;
----
-
-<section class:list={['ts-empty-state', className]}>
-	{eyebrow ? <p class="ts-empty-state__eyebrow">{eyebrow}</p> : null}
-	<h2 class="ts-empty-state__title">{title}</h2>
-	{description ? <p class="ts-empty-state__description">{description}</p> : null}
-	<div class="ts-empty-state__body">
-		<slot />
-	</div>
-	{actions.length > 0 || Astro.slots.has('actions') ? (
-		<div class="ts-empty-state__actions">
-			{actions.map((action) => (
-				<Button
-					href={action.href}
-					type={action.type}
-					variant={action.variant ?? 'secondary'}
-					ariaLabel={action.ariaLabel}
-					disabled={action.disabled}
-				>
-					{action.label}
-				</Button>
-			))}
-			<slot name="actions" />
-		</div>
-	) : null}
-</section>

package/dist/components/ui/surface/Panel.astro

@@ -1,54 +0,0 @@
----
-import Button from '../forms/Button.astro';
-import type { ButtonAction, Tone } from '../types.js';
-
-interface Props {
-	eyebrow?: string;
-	title?: string;
-	description?: string;
-	tone?: Tone;
-	actions?: ButtonAction[];
-	class?: string;
-}
-
-const {
-	eyebrow,
-	title,
-	description,
-	tone = 'default',
-	actions = [],
-	class: className,
-} = Astro.props as Props;
----
-
-<section class:list={['ts-panel', className]} data-tone={tone}>
-	{eyebrow || title || description || actions.length > 0 || Astro.slots.has('actions') ? (
-		<header class="ts-panel__header">
-			<div class="ts-panel__heading">
-				{eyebrow ? <p class="ts-panel__eyebrow">{eyebrow}</p> : null}
-				{title ? <h2 class="ts-panel__title">{title}</h2> : null}
-				{description ? <p class="ts-panel__description">{description}</p> : null}
-			</div>
-			{actions.length > 0 || Astro.slots.has('actions') ? (
-				<div class="ts-panel__actions">
-					{actions.map((action) => (
-						<Button
-							href={action.href}
-							type={action.type}
-							variant={action.variant ?? 'secondary'}
-							ariaLabel={action.ariaLabel}
-							disabled={action.disabled}
-							size="sm"
-						>
-							{action.label}
-						</Button>
-					))}
-					<slot name="actions" />
-				</div>
-			) : null}
-		</header>
-	) : null}
-	<div class="ts-panel__body">
-		<slot />
-	</div>
-</section>

package/dist/components/ui/theme/ThemeMenu.astro

@@ -1,58 +0,0 @@
----
-import ThemeSelector from './ThemeSelector.astro';
-import type { ThemePreference } from '../../../utils/theme.js';
-
-interface Props {
-	selectedScheme?: ThemePreference['scheme'];
-	selectedMode?: ThemePreference['mode'];
-	label?: string;
-}
-
-const {
-	selectedScheme,
-	selectedMode,
-	label = 'Appearance',
-} = Astro.props as Props;
----
-
-<details class="ts-theme-menu" data-ts-theme-menu>
-	<summary class="ts-theme-menu__trigger" aria-label={label} title={label}>
-		<svg aria-hidden="true" viewBox="0 0 24 24" focusable="false">
-			<path d="M12 3.25a8.75 8.75 0 0 0 0 17.5h1.1a2.05 2.05 0 0 0 1.46-3.49 0.55 0.55 0 0 1 .39-.94h1.45a4.35 4.35 0 0 0 4.35-4.35A8.72 8.72 0 0 0 12 3.25Zm-4.1 9.1a1.35 1.35 0 1 1 0-2.7 1.35 1.35 0 0 1 0 2.7Zm2.3-4.1a1.35 1.35 0 1 1 0-2.7 1.35 1.35 0 0 1 0 2.7Zm3.9 0a1.35 1.35 0 1 1 0-2.7 1.35 1.35 0 0 1 0 2.7Zm2.6 4.1a1.35 1.35 0 1 1 0-2.7 1.35 1.35 0 0 1 0 2.7Z" />
-		</svg>
-	</summary>
-	<div class="ts-theme-menu__panel">
-		<ThemeSelector
-			label={label}
-			selectedScheme={selectedScheme}
-			selectedMode={selectedMode}
-			compact={false}
-		/>
-	</div>
-</details>
-
-<script is:inline>
-	(() => {
-		const bindingKey = '__treeseedThemeMenuDismissBound';
-		if (window[bindingKey]) return;
-		window[bindingKey] = true;
-
-		function themeMenuForTarget(target) {
-			return target instanceof Element ? target.closest('[data-ts-theme-menu]') : null;
-		}
-
-		function closeOpenMenus(except = null) {
-			document.querySelectorAll('[data-ts-theme-menu][open]').forEach((menu) => {
-				if (menu !== except) menu.removeAttribute('open');
-			});
-		}
-
-		document.addEventListener('pointerdown', (event) => {
-			closeOpenMenus(themeMenuForTarget(event.target));
-		}, true);
-
-		document.addEventListener('keydown', (event) => {
-			if (event.key === 'Escape') closeOpenMenus();
-		});
-	})();
-</script>

package/dist/components/ui/theme/ThemePreviewSwatch.astro

@@ -1,18 +0,0 @@
----
-interface Props {
-	swatches: string[];
-	label?: string;
-}
-
-const { swatches, label = 'Color scheme preview' } = Astro.props as Props;
-const visibleSwatches = swatches.slice(0, 4);
-const swatchStyle = visibleSwatches
-	.map((swatch, index) => `--ts-preview-swatch-${index + 1}: ${swatch}`)
-	.join('; ');
----
-
-<span class="ts-theme-swatch" style={swatchStyle} role="img" aria-label={label}>
-	{visibleSwatches.map((_, index) => (
-		<span class="ts-theme-swatch__dot" data-swatch-index={index + 1} aria-hidden="true"></span>
-	))}
-</span>