domma-js 0.56.0 → 0.58.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +2 -2
- package/assets/types/generated/public/assets/flags/africa.d.ts +6 -0
- package/assets/types/generated/public/assets/flags/americas.d.ts +6 -0
- package/assets/types/generated/public/assets/flags/asia.d.ts +6 -0
- package/assets/types/generated/public/assets/flags/europe.d.ts +9 -0
- package/assets/types/generated/public/assets/flags/index.d.ts +11 -0
- package/assets/types/generated/public/assets/flags/oceania.d.ts +2 -0
- package/assets/types/generated/public/assets/icons/buildings.d.ts +6 -0
- package/assets/types/generated/public/assets/icons/code.d.ts +2 -0
- package/assets/types/generated/public/assets/icons/commerce.d.ts +7 -0
- package/assets/types/generated/public/assets/icons/communication.d.ts +7 -0
- package/assets/types/generated/public/assets/icons/devices.d.ts +6 -0
- package/assets/types/generated/public/assets/icons/emojis.d.ts +6 -0
- package/assets/types/generated/public/assets/icons/files.d.ts +7 -0
- package/assets/types/generated/public/assets/icons/finance.d.ts +6 -0
- package/assets/types/generated/public/assets/icons/forms.d.ts +5 -0
- package/assets/types/generated/public/assets/icons/health.d.ts +6 -0
- package/assets/types/generated/public/assets/icons/index.d.ts +24 -0
- package/assets/types/generated/public/assets/icons/media.d.ts +7 -0
- package/assets/types/generated/public/assets/icons/navigation.d.ts +7 -0
- package/assets/types/generated/public/assets/icons/seasonal.d.ts +6 -0
- package/assets/types/generated/public/assets/icons/social.d.ts +7 -0
- package/assets/types/generated/public/assets/icons/sport.d.ts +6 -0
- package/assets/types/generated/public/assets/icons/status.d.ts +7 -0
- package/assets/types/generated/public/assets/icons/transport.d.ts +7 -0
- package/assets/types/generated/public/assets/icons/ui.d.ts +7 -0
- package/assets/types/generated/public/assets/icons/weather.d.ts +6 -0
- package/assets/types/generated/src/auth.d.ts +424 -0
- package/assets/types/generated/src/avatar.d.ts +270 -0
- package/assets/types/generated/src/binding-source.d.ts +58 -0
- package/assets/types/generated/src/butterfly-drawing.d.ts +2 -0
- package/assets/types/generated/src/component-factory.d.ts +150 -0
- package/assets/types/generated/src/component.d.ts +162 -0
- package/assets/types/generated/src/components/back-to-top.d.ts +150 -0
- package/assets/types/generated/src/components/badge.d.ts +208 -0
- package/assets/types/generated/src/components/card.d.ts +189 -0
- package/assets/types/generated/src/components/command-palette.d.ts +352 -0
- package/assets/types/generated/src/components/dropzone.d.ts +342 -0
- package/assets/types/generated/src/components/focus-trap.d.ts +238 -0
- package/assets/types/generated/src/components/loader.d.ts +133 -0
- package/assets/types/generated/src/components/modal.d.ts +339 -0
- package/assets/types/generated/src/components/range-slider.d.ts +267 -0
- package/assets/types/generated/src/components/shared.d.ts +91 -0
- package/assets/types/generated/src/components/split-pane.d.ts +239 -0
- package/assets/types/generated/src/components/toast.d.ts +284 -0
- package/assets/types/generated/src/components/tooltip.d.ts +200 -0
- package/assets/types/generated/src/components/virtual-list.d.ts +340 -0
- package/assets/types/generated/src/config.d.ts +193 -0
- package/assets/types/generated/src/context-cursor.d.ts +69 -0
- package/assets/types/generated/src/context-menu.d.ts +596 -0
- package/assets/types/generated/src/dates.d.ts +367 -0
- package/assets/types/generated/src/dom.d.ts +1221 -0
- package/assets/types/generated/src/effects.d.ts +1281 -0
- package/assets/types/generated/src/elements.d.ts +4994 -0
- package/assets/types/generated/src/escape.d.ts +5 -0
- package/assets/types/generated/src/flags-bundle.d.ts +4 -0
- package/assets/types/generated/src/flags.d.ts +338 -0
- package/assets/types/generated/src/forms.d.ts +1060 -0
- package/assets/types/generated/src/globals.d.ts +45 -0
- package/assets/types/generated/src/http.d.ts +131 -0
- package/assets/types/generated/src/i18n.d.ts +261 -0
- package/assets/types/generated/src/icons.d.ts +213 -0
- package/assets/types/generated/src/index.d.ts +249 -0
- package/assets/types/generated/src/input-group.d.ts +135 -0
- package/assets/types/generated/src/models.d.ts +968 -0
- package/assets/types/generated/src/popover.d.ts +413 -0
- package/assets/types/generated/src/router.d.ts +344 -0
- package/assets/types/generated/src/safe-url.d.ts +10 -0
- package/assets/types/generated/src/sanitize.d.ts +97 -0
- package/assets/types/generated/src/schema-builder.d.ts +420 -0
- package/assets/types/generated/src/skeleton.d.ts +135 -0
- package/assets/types/generated/src/smooth-caret.d.ts +61 -0
- package/assets/types/generated/src/sortable.d.ts +368 -0
- package/assets/types/generated/src/storage.d.ts +93 -0
- package/assets/types/generated/src/tables.d.ts +901 -0
- package/assets/types/generated/src/theme.d.ts +262 -0
- package/assets/types/generated/src/ticker-tape-drawing.d.ts +2 -0
- package/assets/types/generated/src/treeview.d.ts +504 -0
- package/assets/types/generated/src/utils.d.ts +1667 -0
- package/assets/types/generated/src/web-components/base/domma-element.d.ts +134 -0
- package/assets/types/generated/src/web-components/index.d.ts +14 -0
- package/assets/types/generated/vendor/domma-reactive.d.ts +587 -0
- package/assets/types/index.d.ts +104 -226
- package/package.json +5 -2
- package/public/dist/bundles/domma-complete.css +20 -14
- package/public/dist/bundles/domma-data-focused.css +20 -14
- package/public/dist/bundles/domma-essentials.css +20 -14
- package/public/dist/bundles/domma-full.css +20 -14
- package/public/dist/bundles/domma-minimal.css +8 -8
- package/public/dist/domma-flags.esm.js +3 -3
- package/public/dist/domma-flags.esm.js.map +1 -1
- package/public/dist/domma-flags.min.js +3 -3
- package/public/dist/domma-flags.min.js.map +1 -1
- package/public/dist/domma-syntax.min.js +3 -3
- package/public/dist/domma.css +3 -3
- package/public/dist/domma.esm.js +5 -5
- package/public/dist/domma.esm.js.map +1 -1
- package/public/dist/domma.min.js +5 -5
- package/public/dist/domma.min.js.map +1 -1
- package/public/dist/elements.css +9 -3
- package/public/dist/grid.css +3 -3
- package/public/dist/syntax.css +3 -3
- package/public/dist/themes/domma-themes.css +3 -3
- package/templates/kickstart/.claude/snippets.md +1 -1
- package/templates/kickstart/CLAUDE.md +1 -1
- package/templates/kickstart/frontend/types/domma.d.ts +7 -4
- package/templates/kickstart-spa/.claude/snippets.md +1 -1
- package/assets/types/config.d.ts +0 -136
- package/assets/types/dates.d.ts +0 -209
- package/assets/types/dom.d.ts +0 -448
- package/assets/types/elements.d.ts +0 -1168
- package/assets/types/flags.d.ts +0 -130
- package/assets/types/http.d.ts +0 -97
- package/assets/types/i18n.d.ts +0 -99
- package/assets/types/icons.d.ts +0 -147
- package/assets/types/models.d.ts +0 -260
- package/assets/types/smooth-caret.d.ts +0 -12
- package/assets/types/storage.d.ts +0 -93
- package/assets/types/tables.d.ts +0 -327
- package/assets/types/theme.d.ts +0 -137
- package/assets/types/utils.d.ts +0 -675
|
@@ -0,0 +1,208 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @typedef {object} BadgeOptions
|
|
3
|
+
* @property {import('../elements.js').BadgeVariant} [variant='primary'] - Badge variant/colour
|
|
4
|
+
* @property {import('../elements.js').BadgeSize|'sm'|'lg'} [size='medium'] - Badge size
|
|
5
|
+
* @property {boolean} [pill=false] - Use pill/rounded style
|
|
6
|
+
* @property {boolean} [outline=false] - Use outline style
|
|
7
|
+
* @property {boolean} [removable=false] - Show remove button
|
|
8
|
+
* @property {boolean} [pulse=false] - Pulse animation
|
|
9
|
+
* @property {((event: MouseEvent, badge: BadgeInstance) => void)|null} [onClick] - Callback on click (not the remove button)
|
|
10
|
+
* @property {((badge: BadgeInstance, event: MouseEvent) => boolean|void)|null} [onRemove] - Callback on remove; return false to keep the badge
|
|
11
|
+
*/
|
|
12
|
+
/** @typedef {Badge} BadgeInstance */
|
|
13
|
+
export class Badge extends Component {
|
|
14
|
+
static defaults: {
|
|
15
|
+
variant: string;
|
|
16
|
+
size: string;
|
|
17
|
+
pill: boolean;
|
|
18
|
+
outline: boolean;
|
|
19
|
+
removable: boolean;
|
|
20
|
+
pulse: boolean;
|
|
21
|
+
onClick: any;
|
|
22
|
+
onRemove: any;
|
|
23
|
+
};
|
|
24
|
+
/**
|
|
25
|
+
* @param {import('./shared.js').ComponentTarget} selector
|
|
26
|
+
* @param {BadgeOptions} [options]
|
|
27
|
+
*/
|
|
28
|
+
constructor(selector: import("./shared.js").ComponentTarget, options?: BadgeOptions);
|
|
29
|
+
_had: Set<string>;
|
|
30
|
+
_apply(): void;
|
|
31
|
+
_removeBtn: HTMLButtonElement;
|
|
32
|
+
_applyOptions(): void;
|
|
33
|
+
/**
|
|
34
|
+
* Set the badge variant.
|
|
35
|
+
* @param {import('../elements.js').BadgeVariant} variant
|
|
36
|
+
* @returns {this}
|
|
37
|
+
*/
|
|
38
|
+
setVariant(variant: import("../elements.js").BadgeVariant): this;
|
|
39
|
+
/**
|
|
40
|
+
* Set the badge size.
|
|
41
|
+
* @param {import('../elements.js').BadgeSize|'sm'|'lg'} size
|
|
42
|
+
* @returns {this}
|
|
43
|
+
*/
|
|
44
|
+
setSize(size: import("../elements.js").BadgeSize | "sm" | "lg"): this;
|
|
45
|
+
/**
|
|
46
|
+
* Replace the text, keeping the remove button.
|
|
47
|
+
* @param {string|number|null} text
|
|
48
|
+
* @returns {this}
|
|
49
|
+
*/
|
|
50
|
+
setText(text: string | number | null): this;
|
|
51
|
+
/**
|
|
52
|
+
* Permanent alias of destroy() (the element stays in the page).
|
|
53
|
+
* @returns {void}
|
|
54
|
+
*/
|
|
55
|
+
remove(...args: any[]): void;
|
|
56
|
+
}
|
|
57
|
+
/** @typedef {'primary'|'secondary'|'success'|'danger'|'warning'|'info'|'light'|'dark'} NumberBadgeVariant */
|
|
58
|
+
/**
|
|
59
|
+
* @typedef {object} NumberBadgeOptions
|
|
60
|
+
* @property {number} [count=0] - Initial count to display (0 hides the counter unless `dot`)
|
|
61
|
+
* @property {number|null} [max] - Cap, e.g. 99 shows "99+"
|
|
62
|
+
* @property {NumberBadgeVariant} [variant='danger'] - Colour variant
|
|
63
|
+
* @property {boolean} [dot=false] - Show as dot indicator instead of number
|
|
64
|
+
* @property {boolean} [pulse=false] - Enable pulse animation
|
|
65
|
+
* @property {string|null} [borderColor] - Custom border ring colour
|
|
66
|
+
* @property {string|null} [label] - Accessible name (default: the count, or "New" for a dot)
|
|
67
|
+
* @property {((count: number, previous: number, badge: NumberBadgeInstance) => void)|null} [onChange] - The count changed
|
|
68
|
+
*/
|
|
69
|
+
/** @typedef {NumberBadge} NumberBadgeInstance */
|
|
70
|
+
export class NumberBadge extends Component {
|
|
71
|
+
static defaults: {
|
|
72
|
+
count: number;
|
|
73
|
+
max: any;
|
|
74
|
+
variant: string;
|
|
75
|
+
dot: boolean;
|
|
76
|
+
pulse: boolean;
|
|
77
|
+
borderColor: any;
|
|
78
|
+
label: any;
|
|
79
|
+
onChange: any;
|
|
80
|
+
};
|
|
81
|
+
/**
|
|
82
|
+
* @param {import('./shared.js').ComponentTarget} selector - The element the counter sits on
|
|
83
|
+
* @param {NumberBadgeOptions} [options]
|
|
84
|
+
*/
|
|
85
|
+
constructor(selector: import("./shared.js").ComponentTarget, options?: NumberBadgeOptions);
|
|
86
|
+
_holder: HTMLElement;
|
|
87
|
+
_hostClassAdded: boolean;
|
|
88
|
+
/** The `.badge-counter` span. @type {HTMLSpanElement} */
|
|
89
|
+
counter: HTMLSpanElement;
|
|
90
|
+
_paint(): void;
|
|
91
|
+
_applyOptions(): void;
|
|
92
|
+
/**
|
|
93
|
+
* Set the badge count.
|
|
94
|
+
* @param {number} count
|
|
95
|
+
* @returns {this}
|
|
96
|
+
*/
|
|
97
|
+
setCount(count: number): this;
|
|
98
|
+
/**
|
|
99
|
+
* Increment the badge count.
|
|
100
|
+
* @param {number} [by=1]
|
|
101
|
+
* @returns {this}
|
|
102
|
+
*/
|
|
103
|
+
increment(by?: number): this;
|
|
104
|
+
/**
|
|
105
|
+
* Decrement the badge count (min 0).
|
|
106
|
+
* @param {number} [by=1]
|
|
107
|
+
* @returns {this}
|
|
108
|
+
*/
|
|
109
|
+
decrement(by?: number): this;
|
|
110
|
+
/** @returns {number} The current count */
|
|
111
|
+
getCount(): number;
|
|
112
|
+
/**
|
|
113
|
+
* Toggle dot mode.
|
|
114
|
+
* @param {boolean} dot
|
|
115
|
+
* @returns {this}
|
|
116
|
+
*/
|
|
117
|
+
setDot(dot: boolean): this;
|
|
118
|
+
/**
|
|
119
|
+
* Set the colour variant.
|
|
120
|
+
* @param {NumberBadgeVariant} variant
|
|
121
|
+
* @returns {this}
|
|
122
|
+
*/
|
|
123
|
+
setVariant(variant: NumberBadgeVariant): this;
|
|
124
|
+
/**
|
|
125
|
+
* Toggle pulse animation.
|
|
126
|
+
* @param {boolean} pulse
|
|
127
|
+
* @returns {this}
|
|
128
|
+
*/
|
|
129
|
+
setPulse(pulse: boolean): this;
|
|
130
|
+
/**
|
|
131
|
+
* Permanent alias of destroy() (the element stays in the page).
|
|
132
|
+
* @returns {void}
|
|
133
|
+
*/
|
|
134
|
+
remove(...args: any[]): void;
|
|
135
|
+
}
|
|
136
|
+
export default Badge;
|
|
137
|
+
export type BadgeOptions = {
|
|
138
|
+
/**
|
|
139
|
+
* - Badge variant/colour
|
|
140
|
+
*/
|
|
141
|
+
variant?: import("../elements.js").BadgeVariant;
|
|
142
|
+
/**
|
|
143
|
+
* - Badge size
|
|
144
|
+
*/
|
|
145
|
+
size?: import("../elements.js").BadgeSize | "sm" | "lg";
|
|
146
|
+
/**
|
|
147
|
+
* - Use pill/rounded style
|
|
148
|
+
*/
|
|
149
|
+
pill?: boolean;
|
|
150
|
+
/**
|
|
151
|
+
* - Use outline style
|
|
152
|
+
*/
|
|
153
|
+
outline?: boolean;
|
|
154
|
+
/**
|
|
155
|
+
* - Show remove button
|
|
156
|
+
*/
|
|
157
|
+
removable?: boolean;
|
|
158
|
+
/**
|
|
159
|
+
* - Pulse animation
|
|
160
|
+
*/
|
|
161
|
+
pulse?: boolean;
|
|
162
|
+
/**
|
|
163
|
+
* - Callback on click (not the remove button)
|
|
164
|
+
*/
|
|
165
|
+
onClick?: ((event: MouseEvent, badge: BadgeInstance) => void) | null;
|
|
166
|
+
/**
|
|
167
|
+
* - Callback on remove; return false to keep the badge
|
|
168
|
+
*/
|
|
169
|
+
onRemove?: ((badge: BadgeInstance, event: MouseEvent) => boolean | void) | null;
|
|
170
|
+
};
|
|
171
|
+
export type BadgeInstance = Badge;
|
|
172
|
+
export type NumberBadgeVariant = "primary" | "secondary" | "success" | "danger" | "warning" | "info" | "light" | "dark";
|
|
173
|
+
export type NumberBadgeOptions = {
|
|
174
|
+
/**
|
|
175
|
+
* - Initial count to display (0 hides the counter unless `dot`)
|
|
176
|
+
*/
|
|
177
|
+
count?: number;
|
|
178
|
+
/**
|
|
179
|
+
* - Cap, e.g. 99 shows "99+"
|
|
180
|
+
*/
|
|
181
|
+
max?: number | null;
|
|
182
|
+
/**
|
|
183
|
+
* - Colour variant
|
|
184
|
+
*/
|
|
185
|
+
variant?: NumberBadgeVariant;
|
|
186
|
+
/**
|
|
187
|
+
* - Show as dot indicator instead of number
|
|
188
|
+
*/
|
|
189
|
+
dot?: boolean;
|
|
190
|
+
/**
|
|
191
|
+
* - Enable pulse animation
|
|
192
|
+
*/
|
|
193
|
+
pulse?: boolean;
|
|
194
|
+
/**
|
|
195
|
+
* - Custom border ring colour
|
|
196
|
+
*/
|
|
197
|
+
borderColor?: string | null;
|
|
198
|
+
/**
|
|
199
|
+
* - Accessible name (default: the count, or "New" for a dot)
|
|
200
|
+
*/
|
|
201
|
+
label?: string | null;
|
|
202
|
+
/**
|
|
203
|
+
* - The count changed
|
|
204
|
+
*/
|
|
205
|
+
onChange?: ((count: number, previous: number, badge: NumberBadgeInstance) => void) | null;
|
|
206
|
+
};
|
|
207
|
+
export type NumberBadgeInstance = NumberBadge;
|
|
208
|
+
import Component from '../component.js';
|
|
@@ -0,0 +1,189 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @typedef {object} CardOptions
|
|
3
|
+
* @property {boolean} [hoverable=true] - Enable hover effects (`hover` is accepted as an alias)
|
|
4
|
+
* @property {boolean} [hover] - Alias of `hoverable`
|
|
5
|
+
* @property {import('../elements.js').ShadowSize|'sm'|'lg'} [shadow='medium'] - Shadow size
|
|
6
|
+
* @property {boolean} [rounded=true] - Apply border radius (false gives square corners)
|
|
7
|
+
* @property {boolean} [animation=true] - Enable animations
|
|
8
|
+
* @property {number} [animationDuration=200] - Animation duration in ms
|
|
9
|
+
* @property {boolean} [collapsible=false] - Clicking the header collapses/expands the body
|
|
10
|
+
* @property {boolean} [collapsed=false] - Start collapsed (a saved state wins)
|
|
11
|
+
* @property {string|null} [persistKey] - Storage key for the collapsed state (default `domma-card-<id>` when the card has an id)
|
|
12
|
+
* @property {string} [title] - Adds a `.card-header` with this title when the card has none
|
|
13
|
+
* @property {string} [icon] - Icon name shown before the title
|
|
14
|
+
* @property {string|Node} [content] - Body content: HTML (sanitised unless `safe: false`) or a Node
|
|
15
|
+
* @property {boolean} [safe=true] - Sanitise string content
|
|
16
|
+
* @property {boolean} [clickable=false] - Clickable style (also on when `onClick` is given)
|
|
17
|
+
* @property {string|null} [color] - Colour variant, e.g. 'primary' adds `.card-primary`
|
|
18
|
+
* @property {((card: CardInstance) => void)|null} [onCollapse] - After the body collapses
|
|
19
|
+
* @property {((card: CardInstance) => void)|null} [onExpand] - After the body expands
|
|
20
|
+
* @property {((card: CardInstance, event: MouseEvent) => void)|null} [onClick] - Click on the card (not a collapsing header click)
|
|
21
|
+
*/
|
|
22
|
+
/** @typedef {Card} CardInstance */
|
|
23
|
+
export class Card extends Component {
|
|
24
|
+
static defaults: {
|
|
25
|
+
hoverable: boolean;
|
|
26
|
+
shadow: string;
|
|
27
|
+
rounded: boolean;
|
|
28
|
+
animation: boolean;
|
|
29
|
+
animationDuration: number;
|
|
30
|
+
collapsible: boolean;
|
|
31
|
+
collapsed: boolean;
|
|
32
|
+
persistKey: any;
|
|
33
|
+
title: string;
|
|
34
|
+
icon: string;
|
|
35
|
+
content: string;
|
|
36
|
+
safe: boolean;
|
|
37
|
+
clickable: boolean;
|
|
38
|
+
color: any;
|
|
39
|
+
onCollapse: any;
|
|
40
|
+
onExpand: any;
|
|
41
|
+
onClick: any;
|
|
42
|
+
};
|
|
43
|
+
/**
|
|
44
|
+
* @param {import('./shared.js').ComponentTarget} selector
|
|
45
|
+
* @param {CardOptions} [options]
|
|
46
|
+
*/
|
|
47
|
+
constructor(selector: import("./shared.js").ComponentTarget, options?: CardOptions);
|
|
48
|
+
_added: any[];
|
|
49
|
+
_made: any[];
|
|
50
|
+
_addClass(...names: any[]): void;
|
|
51
|
+
_apply(): void;
|
|
52
|
+
_colorClass: string;
|
|
53
|
+
_headerTabindex: boolean;
|
|
54
|
+
_header(): Element;
|
|
55
|
+
_body(): Element;
|
|
56
|
+
_bind(): void;
|
|
57
|
+
_storageKey(): any;
|
|
58
|
+
_restoreState(): void;
|
|
59
|
+
_saveState(): void;
|
|
60
|
+
_setCollapsed(collapsed: any, save?: boolean, animate?: boolean): void;
|
|
61
|
+
_heightTimer: number;
|
|
62
|
+
/**
|
|
63
|
+
* Collapse the body.
|
|
64
|
+
* @returns {this}
|
|
65
|
+
*/
|
|
66
|
+
collapse(): this;
|
|
67
|
+
/**
|
|
68
|
+
* Expand the body.
|
|
69
|
+
* @returns {this}
|
|
70
|
+
*/
|
|
71
|
+
expand(): this;
|
|
72
|
+
/**
|
|
73
|
+
* Toggle collapsed/expanded.
|
|
74
|
+
* @returns {this}
|
|
75
|
+
*/
|
|
76
|
+
toggle(): this;
|
|
77
|
+
/** @returns {boolean} */
|
|
78
|
+
isCollapsed(): boolean;
|
|
79
|
+
/**
|
|
80
|
+
* Set the shadow size.
|
|
81
|
+
* @param {import('../elements.js').ShadowSize|'sm'|'lg'} size
|
|
82
|
+
* @returns {this}
|
|
83
|
+
*/
|
|
84
|
+
setShadow(size: import("../elements.js").ShadowSize | "sm" | "lg"): this;
|
|
85
|
+
/**
|
|
86
|
+
* Turn the hover style on or off.
|
|
87
|
+
* @param {boolean} hoverable
|
|
88
|
+
* @returns {this}
|
|
89
|
+
*/
|
|
90
|
+
setHoverable(hoverable: boolean): this;
|
|
91
|
+
/**
|
|
92
|
+
* Replace the body's content. A string is HTML, sanitised like `$().html()` unless
|
|
93
|
+
* `{safe: false}`; a Node is appended.
|
|
94
|
+
* @param {string|Node|null} content
|
|
95
|
+
* @param {{safe?: boolean}} [opts]
|
|
96
|
+
* @returns {this}
|
|
97
|
+
*/
|
|
98
|
+
setContent(content: string | Node | null, opts?: {
|
|
99
|
+
safe?: boolean;
|
|
100
|
+
}): this;
|
|
101
|
+
/**
|
|
102
|
+
* The `.card-body`, made if the card has none.
|
|
103
|
+
* @returns {HTMLElement}
|
|
104
|
+
*/
|
|
105
|
+
getBody(): HTMLElement;
|
|
106
|
+
/**
|
|
107
|
+
* Re-measure an expanded collapsible body whose content changed.
|
|
108
|
+
* @returns {this}
|
|
109
|
+
*/
|
|
110
|
+
updateHeight(): this;
|
|
111
|
+
_applyOptions(): void;
|
|
112
|
+
}
|
|
113
|
+
export default Card;
|
|
114
|
+
export type CardOptions = {
|
|
115
|
+
/**
|
|
116
|
+
* - Enable hover effects (`hover` is accepted as an alias)
|
|
117
|
+
*/
|
|
118
|
+
hoverable?: boolean;
|
|
119
|
+
/**
|
|
120
|
+
* - Alias of `hoverable`
|
|
121
|
+
*/
|
|
122
|
+
hover?: boolean;
|
|
123
|
+
/**
|
|
124
|
+
* - Shadow size
|
|
125
|
+
*/
|
|
126
|
+
shadow?: import("../elements.js").ShadowSize | "sm" | "lg";
|
|
127
|
+
/**
|
|
128
|
+
* - Apply border radius (false gives square corners)
|
|
129
|
+
*/
|
|
130
|
+
rounded?: boolean;
|
|
131
|
+
/**
|
|
132
|
+
* - Enable animations
|
|
133
|
+
*/
|
|
134
|
+
animation?: boolean;
|
|
135
|
+
/**
|
|
136
|
+
* - Animation duration in ms
|
|
137
|
+
*/
|
|
138
|
+
animationDuration?: number;
|
|
139
|
+
/**
|
|
140
|
+
* - Clicking the header collapses/expands the body
|
|
141
|
+
*/
|
|
142
|
+
collapsible?: boolean;
|
|
143
|
+
/**
|
|
144
|
+
* - Start collapsed (a saved state wins)
|
|
145
|
+
*/
|
|
146
|
+
collapsed?: boolean;
|
|
147
|
+
/**
|
|
148
|
+
* - Storage key for the collapsed state (default `domma-card-<id>` when the card has an id)
|
|
149
|
+
*/
|
|
150
|
+
persistKey?: string | null;
|
|
151
|
+
/**
|
|
152
|
+
* - Adds a `.card-header` with this title when the card has none
|
|
153
|
+
*/
|
|
154
|
+
title?: string;
|
|
155
|
+
/**
|
|
156
|
+
* - Icon name shown before the title
|
|
157
|
+
*/
|
|
158
|
+
icon?: string;
|
|
159
|
+
/**
|
|
160
|
+
* - Body content: HTML (sanitised unless `safe: false`) or a Node
|
|
161
|
+
*/
|
|
162
|
+
content?: string | Node;
|
|
163
|
+
/**
|
|
164
|
+
* - Sanitise string content
|
|
165
|
+
*/
|
|
166
|
+
safe?: boolean;
|
|
167
|
+
/**
|
|
168
|
+
* - Clickable style (also on when `onClick` is given)
|
|
169
|
+
*/
|
|
170
|
+
clickable?: boolean;
|
|
171
|
+
/**
|
|
172
|
+
* - Colour variant, e.g. 'primary' adds `.card-primary`
|
|
173
|
+
*/
|
|
174
|
+
color?: string | null;
|
|
175
|
+
/**
|
|
176
|
+
* - After the body collapses
|
|
177
|
+
*/
|
|
178
|
+
onCollapse?: ((card: CardInstance) => void) | null;
|
|
179
|
+
/**
|
|
180
|
+
* - After the body expands
|
|
181
|
+
*/
|
|
182
|
+
onExpand?: ((card: CardInstance) => void) | null;
|
|
183
|
+
/**
|
|
184
|
+
* - Click on the card (not a collapsing header click)
|
|
185
|
+
*/
|
|
186
|
+
onClick?: ((card: CardInstance, event: MouseEvent) => void) | null;
|
|
187
|
+
};
|
|
188
|
+
export type CardInstance = Card;
|
|
189
|
+
import Component from '../component.js';
|