@juspay/svelte-ui-components 2.26.0 → 2.28.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/dist/Card/Card.svelte
CHANGED
|
@@ -35,9 +35,11 @@
|
|
|
35
35
|
{/if}
|
|
36
36
|
</div>
|
|
37
37
|
{/if}
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
38
|
+
{#if typeof children === 'function'}
|
|
39
|
+
<div class="card-content">
|
|
40
|
+
{@render children()}
|
|
41
|
+
</div>
|
|
42
|
+
{/if}
|
|
41
43
|
</div>
|
|
42
44
|
|
|
43
45
|
<style>
|
|
@@ -52,6 +54,7 @@
|
|
|
52
54
|
width: var(--card-width, auto);
|
|
53
55
|
min-width: var(--card-min-width, 0);
|
|
54
56
|
max-width: var(--card-max-width, none);
|
|
57
|
+
height: var(--card-height, auto);
|
|
55
58
|
max-height: var(--card-max-height, none);
|
|
56
59
|
margin: var(--card-margin, 0);
|
|
57
60
|
}
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
|
|
2
|
-
declare const Card: import("svelte").Component<CardProperties, {}, "">;
|
|
1
|
+
declare const Card: import("svelte").Component<import("./properties").OptionalCardProperties, {}, "">;
|
|
3
2
|
type Card = ReturnType<typeof Card>;
|
|
4
3
|
export default Card;
|
|
@@ -1,9 +1,11 @@
|
|
|
1
1
|
import type { Snippet } from 'svelte';
|
|
2
|
-
export type CardProperties =
|
|
3
|
-
export type MandatoryCardProperties =
|
|
4
|
-
children: Snippet;
|
|
5
|
-
};
|
|
2
|
+
export type CardProperties = OptionalCardProperties;
|
|
3
|
+
export type MandatoryCardProperties = Record<string, never>;
|
|
6
4
|
export type OptionalCardProperties = {
|
|
5
|
+
/**
|
|
6
|
+
* Main content body of the card. Rendered inside the `.card-content` container.
|
|
7
|
+
*/
|
|
8
|
+
children?: Snippet;
|
|
7
9
|
title?: string;
|
|
8
10
|
description?: string;
|
|
9
11
|
classes?: string;
|
|
@@ -11,11 +11,13 @@
|
|
|
11
11
|
additionalContent,
|
|
12
12
|
classes,
|
|
13
13
|
onbackClick,
|
|
14
|
-
onkeydown
|
|
14
|
+
onkeydown,
|
|
15
|
+
testId,
|
|
16
|
+
headingTestId
|
|
15
17
|
}: ToolbarProperties = $props();
|
|
16
18
|
</script>
|
|
17
19
|
|
|
18
|
-
<div class="toolbar {classes ?? ''}">
|
|
20
|
+
<div class="toolbar {classes ?? ''}" data-pw={testId}>
|
|
19
21
|
<div class="content">
|
|
20
22
|
{#if typeof leftContent === 'function'}
|
|
21
23
|
{@render leftContent()}
|
|
@@ -29,7 +31,7 @@
|
|
|
29
31
|
{@render centerContent()}
|
|
30
32
|
</div>
|
|
31
33
|
{:else if typeof text === 'string' && text.length > 0}
|
|
32
|
-
<div class="text">
|
|
34
|
+
<div class="text" data-pw={headingTestId}>
|
|
33
35
|
{text}
|
|
34
36
|
</div>
|
|
35
37
|
{/if}
|