your personal website on atproto - mirror
blento.app
flo-bit.dev
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 keywords: ['stopwatch', 'clock', 'time'],
33 allowSetColor: true,
34 minW: 4,
35 canHaveLabel: true,
36
37 migrate: (item) => {
38 const data = item.cardData as TimerCardData;
39 if (data.mode === 'event') {
40 item.cardType = 'countdown';
41 item.cardData = { targetDate: data.targetDate };
42 } else {
43 item.cardType = 'clock';
44 item.cardData = { timezone: data.timezone };
45 }
46 if (data.label) {
47 item.cardData.label = data.label;
48 }
49 }
50} as CardDefinition & { type: 'timer' };