your personal website on atproto - mirror
blento.app
flo-bit.dev
1import type { Component } from 'svelte';
2import type { Item } from '$lib/types';
3import type { CacheService } from '$lib/cache';
4import type { Did } from '@atcute/lexicons';
5
6export type CreationModalComponentProps = {
7 item: Item;
8 oncreate: () => void;
9 oncancel: () => void;
10};
11
12export type SettingsComponentProps = {
13 item: Item;
14 onclose: () => void;
15};
16
17export type ContentComponentProps = {
18 item: Item;
19 isEditing?: boolean;
20};
21
22export type CardDefinition = {
23 type: string; // should be unique
24 contentComponent: Component<ContentComponentProps>; // content of card
25 editingContentComponent?: Component<ContentComponentProps>; // optional content of card in editing mode
26
27 createNew?: (item: Item) => void; // set some custom cardData stuff here (or custom default sizes)
28
29 creationModalComponent?: Component<CreationModalComponentProps>;
30
31 upload?: (item: Item) => Promise<Item>; // optionally upload some other data needed for this card
32
33 // if this component exists, a settings button with a popover will be shown containing this component
34 settingsComponent?: Component<SettingsComponentProps>;
35
36 // optionally load some extra data
37 loadData?: (
38 // all cards of that type
39 items: Item[],
40 { did, handle, cache }: { did: Did; handle: string; cache?: CacheService }
41 ) => Promise<unknown>;
42
43 // server-side version of loadData that calls external APIs directly
44 // instead of going through self-referential /api/ routes (avoids 522 on Cloudflare Workers)
45 loadDataServer?: (
46 items: Item[],
47 {
48 did,
49 handle,
50 cache,
51 env
52 }: {
53 did: Did;
54 handle: string;
55 cache?: CacheService;
56 env?: Record<string, string | undefined>;
57 }
58 ) => Promise<unknown>;
59
60 // show color selection popup
61 allowSetColor?: boolean;
62
63 // default card background color one of 'base', 'accent', 'transparent', or one of the tailwind colors
64 // (actual colors only, without 'gray', 'neutral', 'stone', etc)
65 defaultColor?: string;
66
67 // for resizing:
68 minW?: number;
69 maxW?: number;
70
71 minH?: number;
72 maxH?: number;
73
74 canResize?: boolean;
75
76 onUrlHandler?: (url: string, item: Item) => Item | null;
77 urlHandlerPriority?: number;
78
79 canChange?: (item: Item) => boolean;
80 change?: (item: Item) => Item;
81
82 name?: string;
83
84 canHaveLabel?: boolean;
85
86 migrate?: (item: Item) => void;
87
88 groups?: string[];
89
90 keywords?: string[];
91
92 icon?: string;
93};