@webamoki/web-svelte 0.7.4 → 1.0.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.
Files changed (120) hide show
  1. package/README.md +83 -3
  2. package/dist/components/form/Button.svelte +24 -23
  3. package/dist/components/form/Button.svelte.d.ts +2 -2
  4. package/dist/components/form/Errors.svelte +13 -13
  5. package/dist/components/form/FieldWrapper.svelte +57 -55
  6. package/dist/components/form/FieldWrapper.svelte.d.ts +4 -4
  7. package/dist/components/form/Form.svelte +18 -14
  8. package/dist/components/form/Form.svelte.d.ts +31 -22
  9. package/dist/components/form/IconInputWrapper.svelte +30 -29
  10. package/dist/components/form/IconInputWrapper.svelte.d.ts +7 -7
  11. package/dist/components/form/fields/ChoiceField.svelte +45 -43
  12. package/dist/components/form/fields/ChoiceField.svelte.d.ts +28 -23
  13. package/dist/components/form/fields/ChoiceMultiField.svelte +44 -42
  14. package/dist/components/form/fields/ChoiceMultiField.svelte.d.ts +28 -23
  15. package/dist/components/form/fields/DateField.svelte +42 -40
  16. package/dist/components/form/fields/DateField.svelte.d.ts +29 -22
  17. package/dist/components/form/fields/HexColorField.svelte +21 -19
  18. package/dist/components/form/fields/HexColorField.svelte.d.ts +24 -19
  19. package/dist/components/form/fields/MessageField.svelte +39 -60
  20. package/dist/components/form/fields/MessageField.svelte.d.ts +33 -24
  21. package/dist/components/form/fields/NumberField.svelte +38 -36
  22. package/dist/components/form/fields/NumberField.svelte.d.ts +32 -23
  23. package/dist/components/form/fields/PasswordField.svelte +45 -39
  24. package/dist/components/form/fields/PasswordField.svelte.d.ts +28 -21
  25. package/dist/components/form/fields/SelectField.svelte +84 -79
  26. package/dist/components/form/fields/SelectField.svelte.d.ts +39 -26
  27. package/dist/components/form/fields/SelectMultiField.svelte +90 -85
  28. package/dist/components/form/fields/SelectMultiField.svelte.d.ts +38 -25
  29. package/dist/components/form/fields/TextField.svelte +31 -29
  30. package/dist/components/form/fields/TextField.svelte.d.ts +32 -23
  31. package/dist/components/form/fields/TextFieldNullable.svelte +49 -47
  32. package/dist/components/form/fields/TextFieldNullable.svelte.d.ts +32 -23
  33. package/dist/components/form/fields/TimeField.svelte +66 -64
  34. package/dist/components/form/fields/TimeField.svelte.d.ts +33 -24
  35. package/dist/components/form/fields/WeekdayChoiceField.svelte +37 -35
  36. package/dist/components/form/fields/WeekdayChoiceField.svelte.d.ts +27 -22
  37. package/dist/components/form/fields/WeekdayChoiceMultiField.svelte +37 -35
  38. package/dist/components/form/fields/WeekdayChoiceMultiField.svelte.d.ts +27 -22
  39. package/dist/components/showcase/CodeBlock.svelte +41 -41
  40. package/dist/components/showcase/Container.svelte +7 -7
  41. package/dist/components/showcase/Preview.svelte +4 -4
  42. package/dist/components/showcase/Sidebar.svelte +4 -4
  43. package/dist/components/showcase/SidebarLink.svelte +3 -3
  44. package/dist/components/ui/choice/Choice.svelte +25 -22
  45. package/dist/components/ui/choice/Choice.svelte.d.ts +7 -7
  46. package/dist/components/ui/choice/ChoiceInternal.svelte +73 -69
  47. package/dist/components/ui/choice/ChoiceInternal.svelte.d.ts +9 -9
  48. package/dist/components/ui/choice/ChoiceMulti.svelte +59 -53
  49. package/dist/components/ui/choice/ChoiceMulti.svelte.d.ts +7 -7
  50. package/dist/components/ui/choice/WeekdayChoice.svelte +22 -21
  51. package/dist/components/ui/choice/WeekdayChoice.svelte.d.ts +6 -6
  52. package/dist/components/ui/choice/WeekdayChoiceMulti.svelte +24 -22
  53. package/dist/components/ui/choice/WeekdayChoiceMulti.svelte.d.ts +6 -6
  54. package/dist/components/ui/context-menu/ContextMenu.svelte +51 -50
  55. package/dist/components/ui/context-menu/ContextMenu.svelte.d.ts +1 -1
  56. package/dist/components/ui/context-menu/ContextMenuContent.svelte +92 -91
  57. package/dist/components/ui/context-menu/ContextMenuItem.svelte +26 -25
  58. package/dist/components/ui/context-menu/ContextMenuItem.svelte.d.ts +1 -1
  59. package/dist/components/ui/context-menu/ContextMenuTrigger.svelte +16 -15
  60. package/dist/components/ui/context-menu/context-menu-state.svelte.d.ts +3 -3
  61. package/dist/components/ui/context-menu/context-menu-state.svelte.js +15 -15
  62. package/dist/components/ui/drag-drop/Draggable.svelte +73 -72
  63. package/dist/components/ui/drag-drop/Draggable.svelte.d.ts +2 -2
  64. package/dist/components/ui/drag-drop/Dropzone.svelte +56 -54
  65. package/dist/components/ui/drag-drop/Dropzone.svelte.d.ts +3 -3
  66. package/dist/components/ui/drag-drop/drag-manager.d.ts +2 -2
  67. package/dist/components/ui/drag-drop/drag-manager.js +9 -9
  68. package/dist/components/ui/index.d.ts +2 -2
  69. package/dist/components/ui/index.js +5 -5
  70. package/dist/components/ui/search/SearchBar.svelte +18 -18
  71. package/dist/components/ui/search/SearchBar.svelte.d.ts +2 -2
  72. package/dist/highlight.js +2 -2
  73. package/dist/server/form-handler.d.ts +12 -12
  74. package/dist/server/form-handler.js +17 -17
  75. package/dist/server/form-processor.d.ts +1 -1
  76. package/dist/server/form-processor.js +0 -1
  77. package/dist/shadcn/components/ui/button/button.svelte +72 -71
  78. package/dist/shadcn/components/ui/button/button.svelte.d.ts +23 -23
  79. package/dist/shadcn/components/ui/button/index.d.ts +1 -1
  80. package/dist/shadcn/components/ui/button/index.js +2 -2
  81. package/dist/shadcn/components/ui/input/index.d.ts +1 -1
  82. package/dist/shadcn/components/ui/input/index.js +2 -2
  83. package/dist/shadcn/components/ui/input/input.svelte +35 -32
  84. package/dist/shadcn/components/ui/input/input.svelte.d.ts +2 -2
  85. package/dist/shadcn/components/ui/select/index.d.ts +6 -6
  86. package/dist/shadcn/components/ui/select/index.js +7 -7
  87. package/dist/shadcn/components/ui/select/select-content.svelte +35 -34
  88. package/dist/shadcn/components/ui/select/select-content.svelte.d.ts +1 -1
  89. package/dist/shadcn/components/ui/select/select-group-heading.svelte +15 -14
  90. package/dist/shadcn/components/ui/select/select-group.svelte +2 -2
  91. package/dist/shadcn/components/ui/select/select-item.svelte +31 -31
  92. package/dist/shadcn/components/ui/select/select-label.svelte +14 -13
  93. package/dist/shadcn/components/ui/select/select-label.svelte.d.ts +1 -1
  94. package/dist/shadcn/components/ui/select/select-scroll-down-button.svelte +13 -13
  95. package/dist/shadcn/components/ui/select/select-scroll-up-button.svelte +13 -13
  96. package/dist/shadcn/components/ui/select/select-separator.svelte +13 -12
  97. package/dist/shadcn/components/ui/select/select-trigger.svelte +26 -26
  98. package/dist/shadcn/components/ui/select/select-trigger.svelte.d.ts +2 -2
  99. package/dist/shadcn/components/ui/separator/separator.svelte +14 -14
  100. package/dist/shadcn/components/ui/textarea/textarea.svelte +22 -21
  101. package/dist/shadcn/components/ui/textarea/textarea.svelte.d.ts +1 -1
  102. package/dist/shadcn/utils.d.ts +4 -4
  103. package/dist/utils/datetime/index.d.ts +68 -68
  104. package/dist/utils/datetime/index.js +124 -124
  105. package/dist/utils/email/README.md +60 -60
  106. package/dist/utils/email/aws-signer.d.ts +1 -1
  107. package/dist/utils/email/aws-signer.js +39 -39
  108. package/dist/utils/email/ses.d.ts +8 -10
  109. package/dist/utils/email/ses.js +15 -23
  110. package/dist/utils/form/index.d.ts +11 -11
  111. package/dist/utils/form/index.js +23 -24
  112. package/dist/utils/form/virtual-form.d.ts +5 -5
  113. package/dist/utils/form/virtual-form.js +58 -58
  114. package/dist/utils/search.d.ts +1 -1
  115. package/dist/utils/search.js +22 -22
  116. package/dist/utils/types/arktype.d.ts +2 -2
  117. package/dist/utils/types/arktype.js +3 -3
  118. package/dist/utils/types/db.d.ts +2 -1
  119. package/dist/utils/types/db.js +7 -7
  120. package/package.json +69 -54
@@ -1,71 +1,73 @@
1
- <script lang="ts" generics="T">
2
- import type { Snippet } from 'svelte';
3
- import type { DragManager } from './drag-manager.js';
4
- import { LucideArrowDown } from '@lucide/svelte';
1
+ <script generics="T" lang="ts">
2
+ import type { Snippet } from 'svelte';
5
3
 
6
- interface Props {
7
- isDroppable: (data: T) => boolean;
8
- onDrop: (data: T) => void;
9
- manager: DragManager<T>;
10
- children: Snippet<[]>;
11
- class?: string;
12
- }
13
- let { isDroppable, onDrop, manager, children, class: className = '' }: Props = $props();
4
+ import { LucideArrowDown } from '@lucide/svelte';
14
5
 
15
- let isOver = $state(false);
6
+ import type { DragManager } from './drag-manager.js';
16
7
 
17
- let canDrop = $derived(manager.isDragging && isDroppable(manager.dragData!));
8
+ interface Props {
9
+ children: Snippet<[]>;
10
+ class?: string;
11
+ isDroppable: (data: T) => boolean;
12
+ manager: DragManager<T>;
13
+ onDrop: (data: T) => void;
14
+ }
15
+ let { children, class: className = '', isDroppable, manager, onDrop }: Props = $props();
18
16
 
19
- // --- Event Handlers ---
17
+ let isOver = $state(false);
20
18
 
21
- function handleMouseEnter() {
22
- // Only track 'isOver' if a drag is active
23
- if (manager.isDragging) {
24
- isOver = true;
25
- }
26
- }
19
+ let canDrop = $derived(manager.isDragging && isDroppable(manager.dragData!));
27
20
 
28
- function handleMouseLeave() {
29
- isOver = false;
30
- }
21
+ // --- Event Handlers ---
31
22
 
32
- function handleMouseUp() {
33
- if (isOver && canDrop) {
34
- onDrop(manager.dragData as T);
35
- manager.stop();
36
- }
37
- isOver = false;
38
- }
23
+ function handleMouseEnter() {
24
+ // Only track 'isOver' if a drag is active
25
+ if (manager.isDragging) {
26
+ isOver = true;
27
+ }
28
+ }
29
+
30
+ function handleMouseLeave() {
31
+ isOver = false;
32
+ }
33
+
34
+ function handleMouseUp() {
35
+ if (isOver && canDrop) {
36
+ onDrop(manager.dragData as T);
37
+ manager.stop();
38
+ }
39
+ isOver = false;
40
+ }
39
41
  </script>
40
42
 
41
43
  <!-- svelte-ignore a11y_no_static_element_interactions -->
42
44
  <div
43
- onmouseenter={handleMouseEnter}
44
- onmouseleave={handleMouseLeave}
45
- onmouseup={handleMouseUp}
46
- class={`relative p-4 transition-colors duration-150 ${className}
45
+ class={`relative p-4 transition-colors duration-150 ${className}
47
46
  ${
48
- // Zero Layout Shift: always reserve the same border width to prevent layout flicker.
49
- // Use transparent border when not droppable so sizing remains constant.
50
- !manager.isDragging
51
- ? 'border-2 border-dashed border-transparent'
52
- : canDrop
53
- ? 'border-2 border-dashed border-gray-400'
54
- : 'border-2 border-dashed border-transparent'
55
- }`}
47
+ // Zero Layout Shift: always reserve the same border width to prevent layout flicker.
48
+ // Use transparent border when not droppable so sizing remains constant.
49
+ !manager.isDragging
50
+ ? 'border-2 border-dashed border-transparent'
51
+ : canDrop
52
+ ? 'border-2 border-dashed border-gray-400'
53
+ : 'border-2 border-dashed border-transparent'
54
+ }`}
55
+ onmouseenter={handleMouseEnter}
56
+ onmouseleave={handleMouseLeave}
57
+ onmouseup={handleMouseUp}
56
58
  >
57
- {@render children()}
59
+ {@render children()}
58
60
 
59
- {#if isOver && canDrop}
60
- <div
61
- class="absolute inset-0 z-10 flex flex-col items-center justify-center
61
+ {#if isOver && canDrop}
62
+ <div
63
+ class="absolute inset-0 z-10 flex flex-col items-center justify-center
62
64
  bg-gray-200/50 p-4 backdrop-blur-none"
63
- >
64
- <LucideArrowDown class="h-16 w-16 animate-bounce text-gray-700" />
65
- </div>
66
- {/if}
65
+ >
66
+ <LucideArrowDown class="h-16 w-16 animate-bounce text-gray-700" />
67
+ </div>
68
+ {/if}
67
69
 
68
- {#if isOver && !canDrop}
69
- <div class="absolute inset-0 z-10" aria-label="Cannot drop here"></div>
70
- {/if}
70
+ {#if isOver && !canDrop}
71
+ <div class="absolute inset-0 z-10" aria-label="Cannot drop here"></div>
72
+ {/if}
71
73
  </div>
@@ -2,11 +2,11 @@ import type { Snippet } from 'svelte';
2
2
  import type { DragManager } from './drag-manager.js';
3
3
  declare function $$render<T>(): {
4
4
  props: {
5
- isDroppable: (data: T) => boolean;
6
- onDrop: (data: T) => void;
7
- manager: DragManager<T>;
8
5
  children: Snippet<[]>;
9
6
  class?: string;
7
+ isDroppable: (data: T) => boolean;
8
+ manager: DragManager<T>;
9
+ onDrop: (data: T) => void;
10
10
  };
11
11
  exports: {};
12
12
  bindings: "";
@@ -1,8 +1,8 @@
1
1
  export declare class DragManager<T> {
2
2
  #private;
3
+ get dragData(): null | T;
4
+ get isDragging(): boolean;
3
5
  constructor();
4
6
  drag(dragData: T): void;
5
7
  stop(): void;
6
- get isDragging(): boolean;
7
- get dragData(): T | null;
8
8
  }
@@ -1,8 +1,15 @@
1
1
  import { createSubscriber } from 'svelte/reactivity';
2
2
  export class DragManager {
3
+ get dragData() {
4
+ this.#subscribe();
5
+ return this.#dragData;
6
+ }
7
+ get isDragging() {
8
+ this.#subscribe();
9
+ return this.#dragData !== null;
10
+ }
3
11
  #dragData = null;
4
12
  #subscribe;
5
- #update = () => { };
6
13
  constructor() {
7
14
  this.#subscribe = createSubscriber((update) => {
8
15
  this.#update = update;
@@ -17,12 +24,5 @@ export class DragManager {
17
24
  this.#dragData = null;
18
25
  this.#update();
19
26
  }
20
- get isDragging() {
21
- this.#subscribe();
22
- return this.#dragData !== null;
23
- }
24
- get dragData() {
25
- this.#subscribe();
26
- return this.#dragData;
27
- }
27
+ #update = () => { };
28
28
  }
@@ -2,7 +2,6 @@ import Choice from './choice/Choice.svelte';
2
2
  import ChoiceMulti from './choice/ChoiceMulti.svelte';
3
3
  import WeekdayChoice from './choice/WeekdayChoice.svelte';
4
4
  import WeekdayChoiceMulti from './choice/WeekdayChoiceMulti.svelte';
5
- import SearchBar from './search/SearchBar.svelte';
6
5
  import ContextMenu from './context-menu/ContextMenu.svelte';
7
6
  import ContextMenuContent from './context-menu/ContextMenuContent.svelte';
8
7
  import ContextMenuItem from './context-menu/ContextMenuItem.svelte';
@@ -11,4 +10,5 @@ import ContextMenuTrigger from './context-menu/ContextMenuTrigger.svelte';
11
10
  import { DragManager } from './drag-drop/drag-manager.js';
12
11
  import Draggable from './drag-drop/Draggable.svelte';
13
12
  import Dropzone from './drag-drop/Dropzone.svelte';
14
- export { Choice, ChoiceMulti, SearchBar, WeekdayChoice, WeekdayChoiceMulti, DragManager, Draggable, Dropzone, ContextMenu, ContextMenuContent, ContextMenuItem, ContextMenuSeparator, ContextMenuTrigger };
13
+ import SearchBar from './search/SearchBar.svelte';
14
+ export { Choice, ChoiceMulti, ContextMenu, ContextMenuContent, ContextMenuItem, ContextMenuSeparator, ContextMenuTrigger, Draggable, DragManager, Dropzone, SearchBar, WeekdayChoice, WeekdayChoiceMulti };
@@ -2,7 +2,6 @@ import Choice from './choice/Choice.svelte';
2
2
  import ChoiceMulti from './choice/ChoiceMulti.svelte';
3
3
  import WeekdayChoice from './choice/WeekdayChoice.svelte';
4
4
  import WeekdayChoiceMulti from './choice/WeekdayChoiceMulti.svelte';
5
- import SearchBar from './search/SearchBar.svelte';
6
5
  // context menu
7
6
  import ContextMenu from './context-menu/ContextMenu.svelte';
8
7
  import ContextMenuContent from './context-menu/ContextMenuContent.svelte';
@@ -13,8 +12,9 @@ import ContextMenuTrigger from './context-menu/ContextMenuTrigger.svelte';
13
12
  import { DragManager } from './drag-drop/drag-manager.js';
14
13
  import Draggable from './drag-drop/Draggable.svelte';
15
14
  import Dropzone from './drag-drop/Dropzone.svelte';
16
- export { Choice, ChoiceMulti, SearchBar, WeekdayChoice, WeekdayChoiceMulti,
17
- // drag drop
18
- DragManager, Draggable, Dropzone,
15
+ import SearchBar from './search/SearchBar.svelte';
16
+ export { Choice, ChoiceMulti,
19
17
  // context menu
20
- ContextMenu, ContextMenuContent, ContextMenuItem, ContextMenuSeparator, ContextMenuTrigger };
18
+ ContextMenu, ContextMenuContent, ContextMenuItem, ContextMenuSeparator, ContextMenuTrigger, Draggable,
19
+ // drag drop
20
+ DragManager, Dropzone, SearchBar, WeekdayChoice, WeekdayChoiceMulti };
@@ -1,24 +1,24 @@
1
1
  <script lang="ts">
2
- import Input from '../../../shadcn/components/ui/input/input.svelte';
3
- import { cn } from '../../../shadcn/utils.js';
4
- import { Search } from '@lucide/svelte';
2
+ import Input from '../../../shadcn/components/ui/input/input.svelte';
3
+ import { cn } from '../../../shadcn/utils.js';
4
+ import { Search } from '@lucide/svelte';
5
5
 
6
- interface Props {
7
- defaultValue?: string;
8
- placeholder?: string;
9
- onChange: (value: string) => void;
10
- class?: string;
11
- }
12
- let { defaultValue, placeholder, onChange, class: className }: Props = $props();
6
+ interface Props {
7
+ class?: string;
8
+ defaultValue?: string;
9
+ onChange: (value: string) => void;
10
+ placeholder?: string;
11
+ }
12
+ let { class: className, defaultValue, onChange, placeholder }: Props = $props();
13
13
  </script>
14
14
 
15
15
  <div class="relative w-full max-w-sm">
16
- <Search class="absolute top-1/2 left-2.5 h-4 w-4 -translate-y-1/2 text-muted-foreground" />
17
- <Input
18
- type="search"
19
- {placeholder}
20
- value={defaultValue}
21
- oninput={(e: Event & { currentTarget: HTMLInputElement }) => onChange(e.currentTarget.value)}
22
- class={cn('w-full pl-9', className)}
23
- />
16
+ <Search class="absolute top-1/2 left-2.5 h-4 w-4 -translate-y-1/2 text-muted-foreground" />
17
+ <Input
18
+ class={cn('w-full pl-9', className)}
19
+ oninput={(e: Event & { currentTarget: HTMLInputElement }) => onChange(e.currentTarget.value)}
20
+ {placeholder}
21
+ type="search"
22
+ value={defaultValue}
23
+ />
24
24
  </div>
@@ -1,8 +1,8 @@
1
1
  interface Props {
2
+ class?: string;
2
3
  defaultValue?: string;
3
- placeholder?: string;
4
4
  onChange: (value: string) => void;
5
- class?: string;
5
+ placeholder?: string;
6
6
  }
7
7
  declare const SearchBar: import("svelte").Component<Props, {}, "">;
8
8
  type SearchBar = ReturnType<typeof SearchBar>;
package/dist/highlight.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import { bundledLanguages, bundledThemes, createHighlighter } from 'shiki';
2
2
  const highlighterPromise = createHighlighter({
3
- themes: Object.keys(bundledThemes), // all bundled themes
4
- langs: Object.keys(bundledLanguages) // all bundled languages
3
+ langs: Object.keys(bundledLanguages), // all bundled languages
4
+ themes: Object.keys(bundledThemes) // all bundled themes
5
5
  });
6
6
  export async function highlight(code, lang = 'svelte', theme = 'nord') {
7
7
  const highlighter = await highlighterPromise;
@@ -1,4 +1,16 @@
1
1
  import { type SuperValidated } from 'sveltekit-superforms';
2
+ export declare function errorMessage<T extends Record<string, unknown>>(form: SuperValidated<T>, options?: {
3
+ data?: unknown;
4
+ showToast?: boolean;
5
+ text?: string;
6
+ }): {
7
+ form: SuperValidated<T, App.Superforms.Message, T>;
8
+ } | import("@sveltejs/kit").ActionFailure<{
9
+ form: SuperValidated<T, App.Superforms.Message, T>;
10
+ }>;
11
+ export declare function failFormValidation<T extends Record<string, unknown>>(form: SuperValidated<T>): import("@sveltejs/kit").ActionFailure<{
12
+ form: SuperValidated<T>;
13
+ }>;
2
14
  /**
3
15
  * automatically handle database errors from catch.
4
16
  * used in form/action handling in page.server.ts
@@ -11,23 +23,11 @@ export declare function handleDbErrorForm<T extends Record<string, unknown>>(for
11
23
  */
12
24
  export declare function isDuplicateDbError(err: unknown): boolean;
13
25
  export declare function successMessage<T extends Record<string, unknown>>(form: SuperValidated<T>, options?: {
14
- showToast?: boolean;
15
- text?: string;
16
26
  data?: unknown;
17
- }): {
18
- form: SuperValidated<T, App.Superforms.Message, T>;
19
- } | import("@sveltejs/kit").ActionFailure<{
20
- form: SuperValidated<T, App.Superforms.Message, T>;
21
- }>;
22
- export declare function errorMessage<T extends Record<string, unknown>>(form: SuperValidated<T>, options?: {
23
27
  showToast?: boolean;
24
28
  text?: string;
25
- data?: unknown;
26
29
  }): {
27
30
  form: SuperValidated<T, App.Superforms.Message, T>;
28
31
  } | import("@sveltejs/kit").ActionFailure<{
29
32
  form: SuperValidated<T, App.Superforms.Message, T>;
30
33
  }>;
31
- export declare function failFormValidation<T extends Record<string, unknown>>(form: SuperValidated<T>): import("@sveltejs/kit").ActionFailure<{
32
- form: SuperValidated<T>;
33
- }>;
@@ -1,4 +1,18 @@
1
1
  import { fail, message as superFormMessage } from 'sveltekit-superforms';
2
+ export function errorMessage(form, options) {
3
+ const message = {
4
+ data: options?.data,
5
+ showToast: options?.showToast ?? false,
6
+ success: false,
7
+ text: options?.text
8
+ };
9
+ return superFormMessage(form, message);
10
+ }
11
+ export function failFormValidation(form) {
12
+ if (form.valid)
13
+ throw new Error('Invalid form passed');
14
+ return fail(400, { form });
15
+ }
2
16
  /**
3
17
  * automatically handle database errors from catch.
4
18
  * used in form/action handling in page.server.ts
@@ -21,24 +35,10 @@ export function isDuplicateDbError(err) {
21
35
  }
22
36
  export function successMessage(form, options) {
23
37
  const message = {
24
- success: true,
38
+ data: options?.data,
25
39
  showToast: options?.showToast ?? true,
26
- text: options?.text ?? 'Success',
27
- data: options?.data
28
- };
29
- return superFormMessage(form, message);
30
- }
31
- export function errorMessage(form, options) {
32
- const message = {
33
- success: false,
34
- showToast: options?.showToast ?? false,
35
- text: options?.text,
36
- data: options?.data
40
+ success: true,
41
+ text: options?.text ?? 'Success'
37
42
  };
38
43
  return superFormMessage(form, message);
39
44
  }
40
- export function failFormValidation(form) {
41
- if (form.valid)
42
- throw new Error('Invalid form passed');
43
- return fail(400, { form });
44
- }
@@ -1,2 +1,2 @@
1
- import { type } from 'arktype';
1
+ import type { type } from 'arktype';
2
2
  export declare function processForm<S extends type.Any<Record<string, unknown>>>(request: Request, schema: S): Promise<import("sveltekit-superforms").SuperValidated<S["infer"], any, S["inferIn"]>>;
@@ -1,5 +1,4 @@
1
1
  import { dateTransport } from '../utils/datetime/index.js';
2
- import { type } from 'arktype';
3
2
  import { superValidate } from 'sveltekit-superforms';
4
3
  import { arktype } from 'sveltekit-superforms/adapters';
5
4
  export async function processForm(request, schema) {
@@ -1,86 +1,87 @@
1
1
  <script lang="ts" module>
2
- import { cn, type WithElementRef } from '../../../utils.js';
3
- import type { HTMLAnchorAttributes, HTMLButtonAttributes } from 'svelte/elements';
4
- import { type VariantProps, tv } from 'tailwind-variants';
2
+ import type { HTMLAnchorAttributes, HTMLButtonAttributes } from 'svelte/elements';
5
3
 
6
- export const buttonVariants = tv({
7
- base: "focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive inline-flex shrink-0 items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium outline-none transition-all focus-visible:ring-[3px] disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0",
8
- variants: {
9
- variant: {
10
- default: 'bg-primary text-primary-foreground shadow-xs hover:bg-primary/90',
11
- destructive:
12
- 'bg-destructive shadow-xs hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60 text-white',
13
- outline:
14
- 'bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 border',
15
- secondary: 'bg-secondary text-secondary-foreground shadow-xs hover:bg-secondary/80',
16
- ghost: 'hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50',
17
- link: 'text-primary underline-offset-4 hover:underline'
18
- },
19
- size: {
20
- default: 'h-9 px-4 py-2 has-[>svg]:px-3',
21
- sm: 'h-8 gap-1.5 rounded-md px-3 has-[>svg]:px-2.5',
22
- lg: 'h-10 rounded-md px-6 has-[>svg]:px-4',
23
- icon: 'size-9'
24
- }
25
- },
26
- defaultVariants: {
27
- variant: 'default',
28
- size: 'default'
29
- }
30
- });
4
+ import { cn, type WithElementRef } from '../../../utils.js';
5
+ import { tv, type VariantProps } from 'tailwind-variants';
31
6
 
32
- export type ButtonVariant = VariantProps<typeof buttonVariants>['variant'];
33
- export type ButtonSize = VariantProps<typeof buttonVariants>['size'];
7
+ export const buttonVariants = tv({
8
+ base: "focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive inline-flex shrink-0 items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium outline-none transition-all focus-visible:ring-[3px] disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0",
9
+ defaultVariants: {
10
+ size: 'default',
11
+ variant: 'default'
12
+ },
13
+ variants: {
14
+ size: {
15
+ default: 'h-9 px-4 py-2 has-[>svg]:px-3',
16
+ icon: 'size-9',
17
+ lg: 'h-10 rounded-md px-6 has-[>svg]:px-4',
18
+ sm: 'h-8 gap-1.5 rounded-md px-3 has-[>svg]:px-2.5'
19
+ },
20
+ variant: {
21
+ default: 'bg-primary text-primary-foreground shadow-xs hover:bg-primary/80',
22
+ destructive:
23
+ 'bg-destructive shadow-xs hover:bg-destructive/80 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60 text-white',
24
+ ghost: 'hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50',
25
+ link: 'text-primary underline-offset-4 hover:underline',
26
+ outline:
27
+ 'bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 border',
28
+ secondary: 'bg-secondary text-secondary-foreground shadow-xs hover:bg-secondary/80'
29
+ }
30
+ }
31
+ });
34
32
 
35
- export type ButtonProps = WithElementRef<HTMLButtonAttributes> &
36
- WithElementRef<HTMLAnchorAttributes> & {
37
- variant?: ButtonVariant;
38
- size?: ButtonSize;
39
- } & {
40
- loading?: boolean;
41
- };
33
+ export type ButtonVariant = VariantProps<typeof buttonVariants>['variant'];
34
+ export type ButtonSize = VariantProps<typeof buttonVariants>['size'];
35
+
36
+ export type ButtonProps = WithElementRef<HTMLAnchorAttributes> &
37
+ WithElementRef<HTMLButtonAttributes> & {
38
+ loading?: boolean;
39
+ } & {
40
+ size?: ButtonSize;
41
+ variant?: ButtonVariant;
42
+ };
42
43
  </script>
43
44
 
44
45
  <script lang="ts">
45
- let {
46
- class: className,
47
- variant = 'default',
48
- size = 'default',
49
- ref = $bindable(null),
50
- href = undefined,
51
- type = 'button',
52
- disabled,
53
- children,
54
- ...restProps
55
- }: ButtonProps = $props();
46
+ let {
47
+ children,
48
+ class: className,
49
+ disabled,
50
+ href = undefined,
51
+ ref = $bindable(null),
52
+ size = 'default',
53
+ type = 'button',
54
+ variant = 'default',
55
+ ...restProps
56
+ }: ButtonProps = $props();
56
57
 
57
- let pointer = $derived(disabled ? '' : 'cursor-pointer');
58
+ let pointer = $derived(disabled ? '' : 'cursor-pointer');
58
59
  </script>
59
60
 
60
61
  <!-- eslint-disable svelte/no-navigation-without-resolve -->
61
62
  {#if href}
62
- <a
63
- bind:this={ref}
64
- data-slot="button"
65
- class={cn(buttonVariants({ variant, size }), pointer, className)}
66
- href={disabled ? undefined : href}
67
- aria-disabled={disabled}
68
- role={disabled ? 'link' : undefined}
69
- tabindex={disabled ? -1 : undefined}
70
- {...restProps}
71
- >
72
- {@render children?.()}
73
- </a>
63
+ <a
64
+ bind:this={ref}
65
+ class={cn(buttonVariants({ size, variant }), pointer, className)}
66
+ aria-disabled={disabled}
67
+ data-slot="button"
68
+ href={disabled ? undefined : href}
69
+ role={disabled ? 'link' : undefined}
70
+ tabindex={disabled ? -1 : undefined}
71
+ {...restProps}
72
+ >
73
+ {@render children?.()}
74
+ </a>
74
75
  {:else}
75
- <button
76
- bind:this={ref}
77
- data-slot="button"
78
- class={cn(buttonVariants({ variant, size }), pointer, className)}
79
- {type}
80
- {disabled}
81
- {...restProps}
82
- >
83
- {@render children?.()}
84
- </button>
76
+ <button
77
+ bind:this={ref}
78
+ class={cn(buttonVariants({ size, variant }), pointer, className)}
79
+ data-slot="button"
80
+ {disabled}
81
+ {type}
82
+ {...restProps}
83
+ >
84
+ {@render children?.()}
85
+ </button>
85
86
  {/if}
86
87
  <!-- eslint-enable svelte/no-navigation-without-resolve -->
@@ -1,59 +1,59 @@
1
- import { type WithElementRef } from '../../../utils.js';
2
1
  import type { HTMLAnchorAttributes, HTMLButtonAttributes } from 'svelte/elements';
2
+ import { type WithElementRef } from '../../../utils.js';
3
3
  import { type VariantProps } from 'tailwind-variants';
4
4
  export declare const buttonVariants: import("tailwind-variants").TVReturnType<{
5
+ size: {
6
+ default: string;
7
+ icon: string;
8
+ lg: string;
9
+ sm: string;
10
+ };
5
11
  variant: {
6
12
  default: string;
7
13
  destructive: string;
8
- outline: string;
9
- secondary: string;
10
14
  ghost: string;
11
15
  link: string;
16
+ outline: string;
17
+ secondary: string;
12
18
  };
19
+ }, undefined, "focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive inline-flex shrink-0 items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium outline-none transition-all focus-visible:ring-[3px] disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0", {
13
20
  size: {
14
21
  default: string;
15
- sm: string;
16
- lg: string;
17
22
  icon: string;
23
+ lg: string;
24
+ sm: string;
18
25
  };
19
- }, undefined, "focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive inline-flex shrink-0 items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium outline-none transition-all focus-visible:ring-[3px] disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0", {
20
26
  variant: {
21
27
  default: string;
22
28
  destructive: string;
23
- outline: string;
24
- secondary: string;
25
29
  ghost: string;
26
30
  link: string;
31
+ outline: string;
32
+ secondary: string;
27
33
  };
34
+ }, undefined, import("tailwind-variants").TVReturnType<{
28
35
  size: {
29
36
  default: string;
30
- sm: string;
31
- lg: string;
32
37
  icon: string;
38
+ lg: string;
39
+ sm: string;
33
40
  };
34
- }, undefined, import("tailwind-variants").TVReturnType<{
35
41
  variant: {
36
42
  default: string;
37
43
  destructive: string;
38
- outline: string;
39
- secondary: string;
40
44
  ghost: string;
41
45
  link: string;
42
- };
43
- size: {
44
- default: string;
45
- sm: string;
46
- lg: string;
47
- icon: string;
46
+ outline: string;
47
+ secondary: string;
48
48
  };
49
49
  }, undefined, "focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive inline-flex shrink-0 items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium outline-none transition-all focus-visible:ring-[3px] disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0", unknown, unknown, undefined>>;
50
50
  export type ButtonVariant = VariantProps<typeof buttonVariants>['variant'];
51
51
  export type ButtonSize = VariantProps<typeof buttonVariants>['size'];
52
- export type ButtonProps = WithElementRef<HTMLButtonAttributes> & WithElementRef<HTMLAnchorAttributes> & {
53
- variant?: ButtonVariant;
54
- size?: ButtonSize;
55
- } & {
52
+ export type ButtonProps = WithElementRef<HTMLAnchorAttributes> & WithElementRef<HTMLButtonAttributes> & {
56
53
  loading?: boolean;
54
+ } & {
55
+ size?: ButtonSize;
56
+ variant?: ButtonVariant;
57
57
  };
58
58
  declare const Button: import("svelte").Component<ButtonProps, {}, "ref">;
59
59
  type Button = ReturnType<typeof Button>;
@@ -1,2 +1,2 @@
1
1
  import Root, { type ButtonProps, type ButtonSize, type ButtonVariant, buttonVariants } from './button.svelte';
2
- export { Root, type ButtonProps as Props, Root as Button, buttonVariants, type ButtonProps, type ButtonSize, type ButtonVariant };
2
+ export { Root as Button, type ButtonProps, type ButtonSize, type ButtonVariant, buttonVariants, type ButtonProps as Props, Root };
@@ -1,4 +1,4 @@
1
1
  import Root, { buttonVariants } from './button.svelte';
2
- export { Root,
2
+ export {
3
3
  //
4
- Root as Button, buttonVariants };
4
+ Root as Button, buttonVariants, Root };