noph-ui 0.9.11 → 0.9.13
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/types.d.ts
CHANGED
|
@@ -8,7 +8,7 @@ interface TextProps extends HTMLAttributes<HTMLDivElement> {
|
|
|
8
8
|
headline?: string | null;
|
|
9
9
|
subhead?: string | null;
|
|
10
10
|
supportingText?: string | null;
|
|
11
|
-
action?: Snippet
|
|
11
|
+
action?: Snippet<[]>;
|
|
12
12
|
type: 'text';
|
|
13
13
|
}
|
|
14
14
|
interface ButtonProps extends HTMLButtonAttributes {
|
|
@@ -19,7 +19,7 @@ interface ButtonProps extends HTMLButtonAttributes {
|
|
|
19
19
|
headline?: string | null;
|
|
20
20
|
subhead?: string | null;
|
|
21
21
|
supportingText?: string | null;
|
|
22
|
-
action?: Snippet
|
|
22
|
+
action?: Snippet<[]>;
|
|
23
23
|
type: 'button';
|
|
24
24
|
}
|
|
25
25
|
interface AnchorProps extends HTMLAnchorAttributes {
|
|
@@ -30,7 +30,7 @@ interface AnchorProps extends HTMLAnchorAttributes {
|
|
|
30
30
|
headline?: string | null;
|
|
31
31
|
subhead?: string | null;
|
|
32
32
|
supportingText?: string | null;
|
|
33
|
-
action?: Snippet
|
|
33
|
+
action?: Snippet<[]>;
|
|
34
34
|
type: 'link';
|
|
35
35
|
}
|
|
36
36
|
export type CardProps = TextProps | ButtonProps | AnchorProps;
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
<script lang="ts">
|
|
2
|
-
import { enhance } from '$app/forms'
|
|
3
2
|
import Divider from '../divider/Divider.svelte'
|
|
4
3
|
import type { DialogProps } from './types.ts'
|
|
5
4
|
|
|
@@ -13,7 +12,6 @@
|
|
|
13
12
|
supportingText,
|
|
14
13
|
buttons,
|
|
15
14
|
divider,
|
|
16
|
-
submitFunction,
|
|
17
15
|
...attributes
|
|
18
16
|
}: DialogProps = $props()
|
|
19
17
|
|
|
@@ -26,14 +24,7 @@
|
|
|
26
24
|
}
|
|
27
25
|
</script>
|
|
28
26
|
|
|
29
|
-
<
|
|
30
|
-
use:enhance={submitFunction}
|
|
31
|
-
bind:this={element}
|
|
32
|
-
class="np-dialog"
|
|
33
|
-
popover="auto"
|
|
34
|
-
role="dialog"
|
|
35
|
-
{...attributes}
|
|
36
|
-
>
|
|
27
|
+
<div bind:this={element} class="np-dialog" popover="auto" role="dialog" {...attributes}>
|
|
37
28
|
{#if icon}
|
|
38
29
|
<div class="np-dialog-icon">
|
|
39
30
|
{@render icon()}
|
|
@@ -54,7 +45,7 @@
|
|
|
54
45
|
{@render buttons()}
|
|
55
46
|
</div>
|
|
56
47
|
{/if}
|
|
57
|
-
</
|
|
48
|
+
</div>
|
|
58
49
|
|
|
59
50
|
<style>
|
|
60
51
|
.np-dialog {
|
package/dist/dialog/types.d.ts
CHANGED
|
@@ -1,7 +1,6 @@
|
|
|
1
|
-
import type { SubmitFunction } from '@sveltejs/kit';
|
|
2
1
|
import type { Snippet } from 'svelte';
|
|
3
|
-
import type {
|
|
4
|
-
export interface DialogProps extends Omit<
|
|
2
|
+
import type { HTMLAttributes } from 'svelte/elements';
|
|
3
|
+
export interface DialogProps extends Omit<HTMLAttributes<HTMLDivElement>, 'class' | 'popover'> {
|
|
5
4
|
icon?: Snippet;
|
|
6
5
|
headline: string;
|
|
7
6
|
supportingText?: string;
|
|
@@ -10,5 +9,4 @@ export interface DialogProps extends Omit<HTMLFormAttributes, 'class' | 'popover
|
|
|
10
9
|
element?: HTMLElement;
|
|
11
10
|
showPopover?: () => void;
|
|
12
11
|
hidePopover?: () => void;
|
|
13
|
-
submitFunction?: SubmitFunction<Record<string, unknown> | undefined, Record<string, unknown> | undefined> | undefined;
|
|
14
12
|
}
|
|
@@ -118,6 +118,7 @@
|
|
|
118
118
|
onclick={(event) => {
|
|
119
119
|
event.preventDefault()
|
|
120
120
|
menuElement?.showPopover()
|
|
121
|
+
menuElement?.style.setProperty('min-width', `${field?.clientWidth}px`)
|
|
121
122
|
}}
|
|
122
123
|
onkeydown={(event) => {
|
|
123
124
|
if (event.key === 'Tab') {
|
|
@@ -126,6 +127,7 @@
|
|
|
126
127
|
event.preventDefault()
|
|
127
128
|
if (event.key === 'ArrowDown' || event.key === 'ArrowUp' || event.key === 'Enter') {
|
|
128
129
|
menuElement?.showPopover()
|
|
130
|
+
menuElement?.style.setProperty('min-width', `${field?.clientWidth}px`)
|
|
129
131
|
;(menuElement?.firstElementChild as HTMLElement)?.focus()
|
|
130
132
|
}
|
|
131
133
|
}
|
|
@@ -211,7 +213,7 @@
|
|
|
211
213
|
</div>
|
|
212
214
|
|
|
213
215
|
<Menu
|
|
214
|
-
style="position-anchor:{menuId}
|
|
216
|
+
style="position-anchor:{menuId}"
|
|
215
217
|
popover="manual"
|
|
216
218
|
--np-menu-justify-self="none"
|
|
217
219
|
--np-menu-position-area-fallback="top span-right"
|