feat(calendar): CalendarCompact nutzt SectionHeader; fix IconButton-Typing
CalendarCompactBlock: plain h3 → SectionHeader (title + 'Alle kommenden Termine'- Action). IconButton props via HTMLButton/AnchorAttributes statt Index-Signatur (brach Storybook-Typing). Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -6,6 +6,7 @@
|
|||||||
*/
|
*/
|
||||||
import Icon from "@iconify/svelte";
|
import Icon from "@iconify/svelte";
|
||||||
import "$lib/iconify-offline";
|
import "$lib/iconify-offline";
|
||||||
|
import type { HTMLButtonAttributes, HTMLAnchorAttributes } from "svelte/elements";
|
||||||
|
|
||||||
type Size = "sm" | "md";
|
type Size = "sm" | "md";
|
||||||
type Variant = "surface" | "ghost";
|
type Variant = "surface" | "ghost";
|
||||||
@@ -29,8 +30,8 @@
|
|||||||
variant?: Variant;
|
variant?: Variant;
|
||||||
disabled?: boolean;
|
disabled?: boolean;
|
||||||
class?: string;
|
class?: string;
|
||||||
[key: string]: unknown;
|
} & HTMLButtonAttributes &
|
||||||
} = $props();
|
HTMLAnchorAttributes = $props();
|
||||||
|
|
||||||
const sizeClass: Record<Size, string> = { sm: "size-7", md: "size-9" };
|
const sizeClass: Record<Size, string> = { sm: "size-7", md: "size-9" };
|
||||||
const iconClass: Record<Size, string> = { sm: "size-4", md: "size-5" };
|
const iconClass: Record<Size, string> = { sm: "size-4", md: "size-5" };
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { getBlockLayoutClasses } from "$lib/block-layout";
|
import { getBlockLayoutClasses } from "$lib/block-layout";
|
||||||
import ArrowLink from "$lib/components/ArrowLink.svelte";
|
import SectionHeader from "$lib/components/SectionHeader.svelte";
|
||||||
import type { CalendarBlockData, CalendarItemData } from "$lib/block-types";
|
import type { CalendarBlockData, CalendarItemData } from "$lib/block-types";
|
||||||
import { t as tStatic, T } from "$lib/translations";
|
import { t as tStatic, T } from "$lib/translations";
|
||||||
import type { Translations } from "$lib/translations";
|
import type { Translations } from "$lib/translations";
|
||||||
@@ -81,13 +81,13 @@
|
|||||||
data-block-variant="compact"
|
data-block-variant="compact"
|
||||||
data-block-slug={block._slug}
|
data-block-slug={block._slug}
|
||||||
>
|
>
|
||||||
<div class="mb-2 flex items-baseline justify-between gap-4">
|
<div class="mb-4">
|
||||||
<h3 class="mb-0">{block.title ?? t(T.calendar_next_events)}</h3>
|
<SectionHeader
|
||||||
{#if linkHref()}
|
title={block.title ?? t(T.calendar_next_events)}
|
||||||
<div class="shrink-0">
|
tag="h3"
|
||||||
<ArrowLink href={linkHref() ?? "#"} label={t(T.calendar_all_upcoming)} tone="wald" size="sm" />
|
actionLabel={linkHref() ? t(T.calendar_all_upcoming) : undefined}
|
||||||
</div>
|
actionHref={linkHref() ?? undefined}
|
||||||
{/if}
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{#if upcoming.length === 0}
|
{#if upcoming.length === 0}
|
||||||
|
|||||||
Reference in New Issue
Block a user