your personal website on atproto - mirror
blento.app
1import type { CardDefinition } from '../types';
2import TimerCard from './TimerCard.svelte';
3import TimerCardSettings from './TimerCardSettings.svelte';
4
5export type TimerMode = 'clock' | 'event';
6
7export type TimerCardData = {
8 mode: TimerMode;
9 label?: string;
10 // For clock mode
11 timezone?: string;
12 // For event mode: target date as ISO string
13 targetDate?: string;
14};
15
16export const TimerCardDefinition = {
17 type: 'timer',
18 contentComponent: TimerCard,
19 settingsComponent: TimerCardSettings,
20
21 createNew: (card) => {
22 card.w = 4;
23 card.h = 2;
24 card.mobileW = 8;
25 card.mobileH = 3;
26 card.cardData = {
27 mode: 'clock',
28 timezone: Intl.DateTimeFormat().resolvedOptions().timeZone
29 } as TimerCardData;
30 },
31
32 allowSetColor: true,
33 minW: 4,
34 canHaveLabel: true,
35
36 migrate: (item) => {
37 const data = item.cardData as TimerCardData;
38 if (data.mode === 'event') {
39 item.cardType = 'countdown';
40 item.cardData = { targetDate: data.targetDate };
41 } else {
42 item.cardType = 'clock';
43 item.cardData = { timezone: data.timezone };
44 }
45 if (data.label) {
46 item.cardData.label = data.label;
47 }
48 }
49
50} as CardDefinition & { type: 'timer' };