@noxlovette/material 0.1.2 → 0.1.4

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.
@@ -33,7 +33,6 @@ on screen until confirmed, dismissed, or a required action has been taken.
33
33
  disabled = false,
34
34
  class: className,
35
35
  contentProps,
36
- onconfirm,
37
36
  ...rootRest
38
37
  }: DialogueProps = $props();
39
38
 
@@ -64,13 +63,6 @@ on screen until confirmed, dismissed, or a required action has been taken.
64
63
  method="POST"
65
64
  action={confirmAction}
66
65
  use:enhance
67
- onsubmit={(e: any) => {
68
- if (onconfirm) {
69
- e.preventDefault();
70
- onconfirm();
71
- open = false;
72
- }
73
- }}
74
66
  {...props}
75
67
  class={inner({ class: className })}
76
68
  style:min-width={minWidth}
@@ -107,15 +99,12 @@ on screen until confirmed, dismissed, or a required action has been taken.
107
99
  >
108
100
  {cancelText}
109
101
  </Button>
110
- <Button
111
- type="submit"
112
- {disabled}
113
- {loading}
114
- variant="filled"
115
- data-cy="dialogue-confirm"
116
- >
117
- {confirmText}
118
- </Button>
102
+
103
+ <Dialog.Close>
104
+ <Button type="submit" {disabled} {loading} data-cy="dialogue-confirm">
105
+ {confirmText}
106
+ </Button>
107
+ </Dialog.Close>
119
108
  </div>
120
109
  </form>
121
110
  {/if}
@@ -10,8 +10,6 @@ export type DialogueProps = DialogueVariants & Dialog.RootProps & {
10
10
  enhance: any;
11
11
  /** Whether to deactivate the submit button */
12
12
  disabled?: boolean;
13
- /** Toggle handler for closing the dialogue when not using history state. */
14
- toggle?: () => void;
15
13
  /** Whether the dialogue is open. */
16
14
  open?: boolean;
17
15
  /** The main descriptive text content of the dialogue. */
@@ -13,7 +13,7 @@ Snackbars provide brief messages about app processes at the bottom of the screen
13
13
  import { easeEmphasizedDecel, easeEmphasizedAccel } from '../../animation/easing.js';
14
14
 
15
15
  let {
16
- message,
16
+ message = $bindable(''),
17
17
  fixed = true,
18
18
  static: isStatic = false,
19
19
  label,
@@ -23,23 +23,30 @@ Snackbars provide brief messages about app processes at the bottom of the screen
23
23
  }: SnackBarProps = $props();
24
24
 
25
25
  let dismissed = $state(false);
26
+ let timeoutId: ReturnType<typeof setTimeout> | undefined;
26
27
 
27
28
  $effect(() => {
28
- if (!message) return;
29
- if (isStatic) return;
30
- const t = setTimeout(() => {
31
- dismissed = true;
32
- message = '';
33
- }, 5000);
34
- return () => clearTimeout(t);
35
- });
36
-
37
- $effect(() => {
38
- if (!message) {
29
+ if (message) {
39
30
  dismissed = false;
40
- return;
31
+ if (timeoutId) clearTimeout(timeoutId);
32
+
33
+ if (!isStatic) {
34
+ timeoutId = setTimeout(() => {
35
+ dismissed = true;
36
+ // Clear message if it's a string to allow re-triggering.
37
+ // If it's a snippet, we just let it be dismissed.
38
+ if (typeof message === 'string') {
39
+ message = '';
40
+ }
41
+ }, 4000);
42
+ }
43
+ } else {
44
+ dismissed = true;
41
45
  }
42
- dismissed = false;
46
+
47
+ return () => {
48
+ if (timeoutId) clearTimeout(timeoutId);
49
+ };
43
50
  });
44
51
 
45
52
  const {
@@ -88,7 +95,9 @@ Snackbars provide brief messages about app processes at the bottom of the screen
88
95
  class="relative rounded-full p-1"
89
96
  onclick={() => {
90
97
  dismissed = true;
91
- message = '';
98
+ if (typeof message === 'string') {
99
+ message = '';
100
+ }
92
101
  }}
93
102
  aria-label="Dismiss snackbar"
94
103
  data-cy="notification-dismiss"
@@ -4,6 +4,6 @@ import type { SnackBarProps } from './types.js';
4
4
  *
5
5
  * @see https://m3.material.io/components/snackbars/overview
6
6
  */
7
- declare const Snackbar: import("svelte").Component<SnackBarProps, {}, "">;
7
+ declare const Snackbar: import("svelte").Component<SnackBarProps, {}, "message">;
8
8
  type Snackbar = ReturnType<typeof Snackbar>;
9
9
  export default Snackbar;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@noxlovette/material",
3
- "version": "0.1.2",
3
+ "version": "0.1.4",
4
4
  "type": "module",
5
5
  "license": "MIT",
6
6
  "repository": {