@juspay/svelte-ui-components 2.40.0 → 2.41.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.
|
@@ -1,7 +1,16 @@
|
|
|
1
1
|
<script lang="ts">
|
|
2
2
|
import type { EmptyStateProperties } from './properties';
|
|
3
3
|
|
|
4
|
-
let {
|
|
4
|
+
let {
|
|
5
|
+
title,
|
|
6
|
+
description,
|
|
7
|
+
icon,
|
|
8
|
+
children,
|
|
9
|
+
classes,
|
|
10
|
+
testId,
|
|
11
|
+
titleSnippet,
|
|
12
|
+
descriptionSnippet
|
|
13
|
+
}: EmptyStateProperties = $props();
|
|
5
14
|
</script>
|
|
6
15
|
|
|
7
16
|
<div class="empty-state {classes ?? ''}" data-pw={typeof testId === 'string' ? testId : null}>
|
|
@@ -10,8 +19,18 @@
|
|
|
10
19
|
{@render icon()}
|
|
11
20
|
</div>
|
|
12
21
|
{/if}
|
|
13
|
-
<div class="empty-state-title">
|
|
14
|
-
|
|
22
|
+
<div class="empty-state-title">
|
|
23
|
+
{#if typeof titleSnippet === 'function'}
|
|
24
|
+
{@render titleSnippet()}
|
|
25
|
+
{:else}
|
|
26
|
+
{title}
|
|
27
|
+
{/if}
|
|
28
|
+
</div>
|
|
29
|
+
{#if typeof descriptionSnippet === 'function'}
|
|
30
|
+
<div class="empty-state-description">
|
|
31
|
+
{@render descriptionSnippet()}
|
|
32
|
+
</div>
|
|
33
|
+
{:else if typeof description === 'string' && description.length > 0}
|
|
15
34
|
<div class="empty-state-description">{description}</div>
|
|
16
35
|
{/if}
|
|
17
36
|
{#if typeof children === 'function'}
|
|
@@ -1,6 +1,13 @@
|
|
|
1
1
|
import type { Snippet } from 'svelte';
|
|
2
2
|
export type EmptyStateProperties = MandatoryEmptyStateProperties & OptionalEmptyStateProperties;
|
|
3
3
|
export type MandatoryEmptyStateProperties = {
|
|
4
|
+
/**
|
|
5
|
+
* Fallback text title rendered when `titleSnippet` is not provided.
|
|
6
|
+
* This prop is required for backward-compatibility. When `titleSnippet` is supplied,
|
|
7
|
+
* `title` is still required by TypeScript but its value is not rendered — the snippet
|
|
8
|
+
* takes priority. Pass an empty string (`title=""`) as the minimal valid value when
|
|
9
|
+
* using `titleSnippet`.
|
|
10
|
+
*/
|
|
4
11
|
title: string;
|
|
5
12
|
};
|
|
6
13
|
export type OptionalEmptyStateProperties = {
|
|
@@ -9,4 +16,17 @@ export type OptionalEmptyStateProperties = {
|
|
|
9
16
|
children?: Snippet;
|
|
10
17
|
classes?: string;
|
|
11
18
|
testId?: string;
|
|
19
|
+
/**
|
|
20
|
+
* Optional snippet that replaces the `title` string at render time.
|
|
21
|
+
* When provided, the mandatory `title` prop is still required for backward-compatibility
|
|
22
|
+
* but its value is not rendered — the snippet takes full priority.
|
|
23
|
+
* Use this when the title needs rich markup (e.g. formatted text, icons inline).
|
|
24
|
+
*/
|
|
25
|
+
titleSnippet?: Snippet;
|
|
26
|
+
/**
|
|
27
|
+
* Optional snippet that replaces the `description` string at render time.
|
|
28
|
+
* When provided, `description` is silently discarded — only one is rendered.
|
|
29
|
+
* Use this when the description needs rich markup (e.g. links, emphasis).
|
|
30
|
+
*/
|
|
31
|
+
descriptionSnippet?: Snippet;
|
|
12
32
|
};
|