@novadx/svelte-inngest 0.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.
- package/README.md +65 -0
- package/dist/components/ui/alert/alert-description.svelte +23 -0
- package/dist/components/ui/alert/alert-description.svelte.d.ts +5 -0
- package/dist/components/ui/alert/alert-title.svelte +20 -0
- package/dist/components/ui/alert/alert-title.svelte.d.ts +5 -0
- package/dist/components/ui/alert/alert.svelte +44 -0
- package/dist/components/ui/alert/alert.svelte.d.ts +26 -0
- package/dist/components/ui/alert/index.d.ts +5 -0
- package/dist/components/ui/alert/index.js +7 -0
- package/dist/components/ui/badge/badge.svelte +50 -0
- package/dist/components/ui/badge/badge.svelte.d.ts +32 -0
- package/dist/components/ui/badge/index.d.ts +2 -0
- package/dist/components/ui/badge/index.js +2 -0
- package/dist/components/ui/button/button.svelte +82 -0
- package/dist/components/ui/button/button.svelte.d.ts +64 -0
- package/dist/components/ui/button/index.d.ts +2 -0
- package/dist/components/ui/button/index.js +4 -0
- package/dist/components/ui/card/card-action.svelte +20 -0
- package/dist/components/ui/card/card-action.svelte.d.ts +5 -0
- package/dist/components/ui/card/card-content.svelte +15 -0
- package/dist/components/ui/card/card-content.svelte.d.ts +5 -0
- package/dist/components/ui/card/card-description.svelte +20 -0
- package/dist/components/ui/card/card-description.svelte.d.ts +5 -0
- package/dist/components/ui/card/card-footer.svelte +20 -0
- package/dist/components/ui/card/card-footer.svelte.d.ts +5 -0
- package/dist/components/ui/card/card-header.svelte +23 -0
- package/dist/components/ui/card/card-header.svelte.d.ts +5 -0
- package/dist/components/ui/card/card-title.svelte +20 -0
- package/dist/components/ui/card/card-title.svelte.d.ts +5 -0
- package/dist/components/ui/card/card.svelte +23 -0
- package/dist/components/ui/card/card.svelte.d.ts +5 -0
- package/dist/components/ui/card/index.d.ts +8 -0
- package/dist/components/ui/card/index.js +10 -0
- package/dist/components/ui/checkbox/checkbox.svelte +36 -0
- package/dist/components/ui/checkbox/checkbox.svelte.d.ts +4 -0
- package/dist/components/ui/checkbox/index.d.ts +2 -0
- package/dist/components/ui/checkbox/index.js +4 -0
- package/dist/components/ui/table/index.d.ts +9 -0
- package/dist/components/ui/table/index.js +11 -0
- package/dist/components/ui/table/table-body.svelte +20 -0
- package/dist/components/ui/table/table-body.svelte.d.ts +5 -0
- package/dist/components/ui/table/table-caption.svelte +20 -0
- package/dist/components/ui/table/table-caption.svelte.d.ts +5 -0
- package/dist/components/ui/table/table-cell.svelte +23 -0
- package/dist/components/ui/table/table-cell.svelte.d.ts +5 -0
- package/dist/components/ui/table/table-footer.svelte +20 -0
- package/dist/components/ui/table/table-footer.svelte.d.ts +5 -0
- package/dist/components/ui/table/table-head.svelte +23 -0
- package/dist/components/ui/table/table-head.svelte.d.ts +5 -0
- package/dist/components/ui/table/table-header.svelte +20 -0
- package/dist/components/ui/table/table-header.svelte.d.ts +5 -0
- package/dist/components/ui/table/table-row.svelte +23 -0
- package/dist/components/ui/table/table-row.svelte.d.ts +5 -0
- package/dist/components/ui/table/table.svelte +22 -0
- package/dist/components/ui/table/table.svelte.d.ts +5 -0
- package/dist/index.d.ts +3 -0
- package/dist/index.js +3 -0
- package/dist/realtime/context.d.ts +23 -0
- package/dist/realtime/context.js +9 -0
- package/dist/utils.d.ts +12 -0
- package/dist/utils.js +5 -0
- package/package.json +63 -0
package/README.md
ADDED
|
@@ -0,0 +1,65 @@
|
|
|
1
|
+
# Svelte library
|
|
2
|
+
|
|
3
|
+
Everything you need to build a Svelte library, powered by [`sv`](https://npmjs.com/package/sv).
|
|
4
|
+
|
|
5
|
+
Read more about creating a library [in the docs](https://svelte.dev/docs/kit/packaging).
|
|
6
|
+
|
|
7
|
+
## Creating a project
|
|
8
|
+
|
|
9
|
+
If you're seeing this, you've probably already done this step. Congrats!
|
|
10
|
+
|
|
11
|
+
```sh
|
|
12
|
+
# create a new project in the current directory
|
|
13
|
+
npx sv create
|
|
14
|
+
|
|
15
|
+
# create a new project in my-app
|
|
16
|
+
npx sv create my-app
|
|
17
|
+
```
|
|
18
|
+
|
|
19
|
+
To recreate this project with the same configuration:
|
|
20
|
+
|
|
21
|
+
```sh
|
|
22
|
+
# recreate this project
|
|
23
|
+
bun x sv create --template library --types ts --add tailwindcss="plugins:typography,forms" --install bun svelte-inngest
|
|
24
|
+
```
|
|
25
|
+
|
|
26
|
+
## Developing
|
|
27
|
+
|
|
28
|
+
Once you've created a project and installed dependencies with `npm install` (or `pnpm install` or `yarn`), start a development server:
|
|
29
|
+
|
|
30
|
+
```sh
|
|
31
|
+
npm run dev
|
|
32
|
+
|
|
33
|
+
# or start the server and open the app in a new browser tab
|
|
34
|
+
npm run dev -- --open
|
|
35
|
+
```
|
|
36
|
+
|
|
37
|
+
Everything inside `src/lib` is part of your library, everything inside `src/routes` can be used as a showcase or preview app.
|
|
38
|
+
|
|
39
|
+
## Building
|
|
40
|
+
|
|
41
|
+
To build your library:
|
|
42
|
+
|
|
43
|
+
```sh
|
|
44
|
+
npm pack
|
|
45
|
+
```
|
|
46
|
+
|
|
47
|
+
To create a production version of your showcase app:
|
|
48
|
+
|
|
49
|
+
```sh
|
|
50
|
+
npm run build
|
|
51
|
+
```
|
|
52
|
+
|
|
53
|
+
You can preview the production build with `npm run preview`.
|
|
54
|
+
|
|
55
|
+
> To deploy your app, you may need to install an [adapter](https://svelte.dev/docs/kit/adapters) for your target environment.
|
|
56
|
+
|
|
57
|
+
## Publishing
|
|
58
|
+
|
|
59
|
+
Go into the `package.json` and give your package the desired name through the `"name"` option. Also consider adding a `"license"` field and point it to a `LICENSE` file which you can create from a template (one popular option is the [MIT license](https://opensource.org/license/mit/)).
|
|
60
|
+
|
|
61
|
+
To publish your library to [npm](https://www.npmjs.com):
|
|
62
|
+
|
|
63
|
+
```sh
|
|
64
|
+
npm publish
|
|
65
|
+
```
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
<script lang="ts">
|
|
2
|
+
import type { HTMLAttributes } from "svelte/elements";
|
|
3
|
+
import { cn, type WithElementRef } from "../../../utils.js";
|
|
4
|
+
|
|
5
|
+
let {
|
|
6
|
+
ref = $bindable(null),
|
|
7
|
+
class: className,
|
|
8
|
+
children,
|
|
9
|
+
...restProps
|
|
10
|
+
}: WithElementRef<HTMLAttributes<HTMLDivElement>> = $props();
|
|
11
|
+
</script>
|
|
12
|
+
|
|
13
|
+
<div
|
|
14
|
+
bind:this={ref}
|
|
15
|
+
data-slot="alert-description"
|
|
16
|
+
class={cn(
|
|
17
|
+
"text-muted-foreground col-start-2 grid justify-items-start gap-1 text-sm [&_p]:leading-relaxed",
|
|
18
|
+
className
|
|
19
|
+
)}
|
|
20
|
+
{...restProps}
|
|
21
|
+
>
|
|
22
|
+
{@render children?.()}
|
|
23
|
+
</div>
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import type { HTMLAttributes } from "svelte/elements";
|
|
2
|
+
import { type WithElementRef } from "../../../utils.js";
|
|
3
|
+
declare const AlertDescription: import("svelte").Component<WithElementRef<HTMLAttributes<HTMLDivElement>>, {}, "ref">;
|
|
4
|
+
type AlertDescription = ReturnType<typeof AlertDescription>;
|
|
5
|
+
export default AlertDescription;
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
<script lang="ts">
|
|
2
|
+
import type { HTMLAttributes } from "svelte/elements";
|
|
3
|
+
import { cn, type WithElementRef } from "../../../utils.js";
|
|
4
|
+
|
|
5
|
+
let {
|
|
6
|
+
ref = $bindable(null),
|
|
7
|
+
class: className,
|
|
8
|
+
children,
|
|
9
|
+
...restProps
|
|
10
|
+
}: WithElementRef<HTMLAttributes<HTMLDivElement>> = $props();
|
|
11
|
+
</script>
|
|
12
|
+
|
|
13
|
+
<div
|
|
14
|
+
bind:this={ref}
|
|
15
|
+
data-slot="alert-title"
|
|
16
|
+
class={cn("col-start-2 line-clamp-1 min-h-4 font-medium tracking-tight", className)}
|
|
17
|
+
{...restProps}
|
|
18
|
+
>
|
|
19
|
+
{@render children?.()}
|
|
20
|
+
</div>
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import type { HTMLAttributes } from "svelte/elements";
|
|
2
|
+
import { type WithElementRef } from "../../../utils.js";
|
|
3
|
+
declare const AlertTitle: import("svelte").Component<WithElementRef<HTMLAttributes<HTMLDivElement>>, {}, "ref">;
|
|
4
|
+
type AlertTitle = ReturnType<typeof AlertTitle>;
|
|
5
|
+
export default AlertTitle;
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
<script lang="ts" module>
|
|
2
|
+
import { type VariantProps, tv } from "tailwind-variants";
|
|
3
|
+
|
|
4
|
+
export const alertVariants = tv({
|
|
5
|
+
base: "relative grid w-full grid-cols-[0_1fr] items-start gap-y-0.5 rounded-lg border px-4 py-3 text-sm has-[>svg]:grid-cols-[calc(var(--spacing)*4)_1fr] has-[>svg]:gap-x-3 [&>svg]:size-4 [&>svg]:translate-y-0.5 [&>svg]:text-current",
|
|
6
|
+
variants: {
|
|
7
|
+
variant: {
|
|
8
|
+
default: "bg-card text-card-foreground",
|
|
9
|
+
destructive:
|
|
10
|
+
"text-destructive bg-card *:data-[slot=alert-description]:text-destructive/90 [&>svg]:text-current",
|
|
11
|
+
},
|
|
12
|
+
},
|
|
13
|
+
defaultVariants: {
|
|
14
|
+
variant: "default",
|
|
15
|
+
},
|
|
16
|
+
});
|
|
17
|
+
|
|
18
|
+
export type AlertVariant = VariantProps<typeof alertVariants>["variant"];
|
|
19
|
+
</script>
|
|
20
|
+
|
|
21
|
+
<script lang="ts">
|
|
22
|
+
import type { HTMLAttributes } from "svelte/elements";
|
|
23
|
+
import { cn, type WithElementRef } from "../../../utils.js";
|
|
24
|
+
|
|
25
|
+
let {
|
|
26
|
+
ref = $bindable(null),
|
|
27
|
+
class: className,
|
|
28
|
+
variant = "default",
|
|
29
|
+
children,
|
|
30
|
+
...restProps
|
|
31
|
+
}: WithElementRef<HTMLAttributes<HTMLDivElement>> & {
|
|
32
|
+
variant?: AlertVariant;
|
|
33
|
+
} = $props();
|
|
34
|
+
</script>
|
|
35
|
+
|
|
36
|
+
<div
|
|
37
|
+
bind:this={ref}
|
|
38
|
+
data-slot="alert"
|
|
39
|
+
class={cn(alertVariants({ variant }), className)}
|
|
40
|
+
{...restProps}
|
|
41
|
+
role="alert"
|
|
42
|
+
>
|
|
43
|
+
{@render children?.()}
|
|
44
|
+
</div>
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import { type VariantProps } from "tailwind-variants";
|
|
2
|
+
export declare const alertVariants: import("tailwind-variants").TVReturnType<{
|
|
3
|
+
variant: {
|
|
4
|
+
default: string;
|
|
5
|
+
destructive: string;
|
|
6
|
+
};
|
|
7
|
+
}, undefined, "relative grid w-full grid-cols-[0_1fr] items-start gap-y-0.5 rounded-lg border px-4 py-3 text-sm has-[>svg]:grid-cols-[calc(var(--spacing)*4)_1fr] has-[>svg]:gap-x-3 [&>svg]:size-4 [&>svg]:translate-y-0.5 [&>svg]:text-current", {
|
|
8
|
+
variant: {
|
|
9
|
+
default: string;
|
|
10
|
+
destructive: string;
|
|
11
|
+
};
|
|
12
|
+
}, undefined, import("tailwind-variants").TVReturnType<{
|
|
13
|
+
variant: {
|
|
14
|
+
default: string;
|
|
15
|
+
destructive: string;
|
|
16
|
+
};
|
|
17
|
+
}, undefined, "relative grid w-full grid-cols-[0_1fr] items-start gap-y-0.5 rounded-lg border px-4 py-3 text-sm has-[>svg]:grid-cols-[calc(var(--spacing)*4)_1fr] has-[>svg]:gap-x-3 [&>svg]:size-4 [&>svg]:translate-y-0.5 [&>svg]:text-current", unknown, unknown, undefined>>;
|
|
18
|
+
export type AlertVariant = VariantProps<typeof alertVariants>["variant"];
|
|
19
|
+
import type { HTMLAttributes } from "svelte/elements";
|
|
20
|
+
import { type WithElementRef } from "../../../utils.js";
|
|
21
|
+
type $$ComponentProps = WithElementRef<HTMLAttributes<HTMLDivElement>> & {
|
|
22
|
+
variant?: AlertVariant;
|
|
23
|
+
};
|
|
24
|
+
declare const Alert: import("svelte").Component<$$ComponentProps, {}, "ref">;
|
|
25
|
+
type Alert = ReturnType<typeof Alert>;
|
|
26
|
+
export default Alert;
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import Root from "./alert.svelte";
|
|
2
|
+
import Description from "./alert-description.svelte";
|
|
3
|
+
import Title from "./alert-title.svelte";
|
|
4
|
+
export { alertVariants, type AlertVariant } from "./alert.svelte";
|
|
5
|
+
export { Root, Description, Title, Root as Alert, Description as AlertDescription, Title as AlertTitle, };
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import Root from "./alert.svelte";
|
|
2
|
+
import Description from "./alert-description.svelte";
|
|
3
|
+
import Title from "./alert-title.svelte";
|
|
4
|
+
export { alertVariants } from "./alert.svelte";
|
|
5
|
+
export { Root, Description, Title,
|
|
6
|
+
//
|
|
7
|
+
Root as Alert, Description as AlertDescription, Title as AlertTitle, };
|
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
<script lang="ts" module>
|
|
2
|
+
import { type VariantProps, tv } from "tailwind-variants";
|
|
3
|
+
|
|
4
|
+
export const badgeVariants = tv({
|
|
5
|
+
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 w-fit shrink-0 items-center justify-center gap-1 overflow-hidden rounded-full border px-2 py-0.5 text-xs font-medium whitespace-nowrap transition-[color,box-shadow] focus-visible:ring-[3px] [&>svg]:pointer-events-none [&>svg]:size-3",
|
|
6
|
+
variants: {
|
|
7
|
+
variant: {
|
|
8
|
+
default:
|
|
9
|
+
"bg-primary text-primary-foreground [a&]:hover:bg-primary/90 border-transparent",
|
|
10
|
+
secondary:
|
|
11
|
+
"bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90 border-transparent",
|
|
12
|
+
destructive:
|
|
13
|
+
"bg-destructive [a&]:hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/70 border-transparent text-white",
|
|
14
|
+
outline: "text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground",
|
|
15
|
+
},
|
|
16
|
+
},
|
|
17
|
+
defaultVariants: {
|
|
18
|
+
variant: "default",
|
|
19
|
+
},
|
|
20
|
+
});
|
|
21
|
+
|
|
22
|
+
export type BadgeVariant = VariantProps<typeof badgeVariants>["variant"];
|
|
23
|
+
</script>
|
|
24
|
+
|
|
25
|
+
<script lang="ts">
|
|
26
|
+
import type { HTMLAnchorAttributes } from "svelte/elements";
|
|
27
|
+
import { cn, type WithElementRef } from "../../../utils.js";
|
|
28
|
+
|
|
29
|
+
let {
|
|
30
|
+
ref = $bindable(null),
|
|
31
|
+
href,
|
|
32
|
+
class: className,
|
|
33
|
+
variant = "default",
|
|
34
|
+
children,
|
|
35
|
+
...restProps
|
|
36
|
+
}: WithElementRef<HTMLAnchorAttributes> & {
|
|
37
|
+
variant?: BadgeVariant;
|
|
38
|
+
} = $props();
|
|
39
|
+
</script>
|
|
40
|
+
|
|
41
|
+
<svelte:element
|
|
42
|
+
this={href ? "a" : "span"}
|
|
43
|
+
bind:this={ref}
|
|
44
|
+
data-slot="badge"
|
|
45
|
+
{href}
|
|
46
|
+
class={cn(badgeVariants({ variant }), className)}
|
|
47
|
+
{...restProps}
|
|
48
|
+
>
|
|
49
|
+
{@render children?.()}
|
|
50
|
+
</svelte:element>
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
import { type VariantProps } from "tailwind-variants";
|
|
2
|
+
export declare const badgeVariants: import("tailwind-variants").TVReturnType<{
|
|
3
|
+
variant: {
|
|
4
|
+
default: string;
|
|
5
|
+
secondary: string;
|
|
6
|
+
destructive: string;
|
|
7
|
+
outline: string;
|
|
8
|
+
};
|
|
9
|
+
}, 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 w-fit shrink-0 items-center justify-center gap-1 overflow-hidden rounded-full border px-2 py-0.5 text-xs font-medium whitespace-nowrap transition-[color,box-shadow] focus-visible:ring-[3px] [&>svg]:pointer-events-none [&>svg]:size-3", {
|
|
10
|
+
variant: {
|
|
11
|
+
default: string;
|
|
12
|
+
secondary: string;
|
|
13
|
+
destructive: string;
|
|
14
|
+
outline: string;
|
|
15
|
+
};
|
|
16
|
+
}, undefined, import("tailwind-variants").TVReturnType<{
|
|
17
|
+
variant: {
|
|
18
|
+
default: string;
|
|
19
|
+
secondary: string;
|
|
20
|
+
destructive: string;
|
|
21
|
+
outline: string;
|
|
22
|
+
};
|
|
23
|
+
}, 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 w-fit shrink-0 items-center justify-center gap-1 overflow-hidden rounded-full border px-2 py-0.5 text-xs font-medium whitespace-nowrap transition-[color,box-shadow] focus-visible:ring-[3px] [&>svg]:pointer-events-none [&>svg]:size-3", unknown, unknown, undefined>>;
|
|
24
|
+
export type BadgeVariant = VariantProps<typeof badgeVariants>["variant"];
|
|
25
|
+
import type { HTMLAnchorAttributes } from "svelte/elements";
|
|
26
|
+
import { type WithElementRef } from "../../../utils.js";
|
|
27
|
+
type $$ComponentProps = WithElementRef<HTMLAnchorAttributes> & {
|
|
28
|
+
variant?: BadgeVariant;
|
|
29
|
+
};
|
|
30
|
+
declare const Badge: import("svelte").Component<$$ComponentProps, {}, "ref">;
|
|
31
|
+
type Badge = ReturnType<typeof Badge>;
|
|
32
|
+
export default Badge;
|
|
@@ -0,0 +1,82 @@
|
|
|
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";
|
|
5
|
+
|
|
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 rounded-md text-sm font-medium whitespace-nowrap transition-all outline-none focus-visible:ring-[3px] disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
|
|
8
|
+
variants: {
|
|
9
|
+
variant: {
|
|
10
|
+
default: "bg-primary text-primary-foreground hover:bg-primary/90 shadow-xs",
|
|
11
|
+
destructive:
|
|
12
|
+
"bg-destructive hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60 text-white shadow-xs",
|
|
13
|
+
outline:
|
|
14
|
+
"bg-background hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 border shadow-xs",
|
|
15
|
+
secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80 shadow-xs",
|
|
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
|
+
"icon-sm": "size-8",
|
|
25
|
+
"icon-lg": "size-10",
|
|
26
|
+
},
|
|
27
|
+
},
|
|
28
|
+
defaultVariants: {
|
|
29
|
+
variant: "default",
|
|
30
|
+
size: "default",
|
|
31
|
+
},
|
|
32
|
+
});
|
|
33
|
+
|
|
34
|
+
export type ButtonVariant = VariantProps<typeof buttonVariants>["variant"];
|
|
35
|
+
export type ButtonSize = VariantProps<typeof buttonVariants>["size"];
|
|
36
|
+
|
|
37
|
+
export type ButtonProps = WithElementRef<HTMLButtonAttributes> &
|
|
38
|
+
WithElementRef<HTMLAnchorAttributes> & {
|
|
39
|
+
variant?: ButtonVariant;
|
|
40
|
+
size?: ButtonSize;
|
|
41
|
+
};
|
|
42
|
+
</script>
|
|
43
|
+
|
|
44
|
+
<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();
|
|
56
|
+
</script>
|
|
57
|
+
|
|
58
|
+
{#if href}
|
|
59
|
+
<a
|
|
60
|
+
bind:this={ref}
|
|
61
|
+
data-slot="button"
|
|
62
|
+
class={cn(buttonVariants({ variant, size }), className)}
|
|
63
|
+
href={disabled ? undefined : href}
|
|
64
|
+
aria-disabled={disabled}
|
|
65
|
+
role={disabled ? "link" : undefined}
|
|
66
|
+
tabindex={disabled ? -1 : undefined}
|
|
67
|
+
{...restProps}
|
|
68
|
+
>
|
|
69
|
+
{@render children?.()}
|
|
70
|
+
</a>
|
|
71
|
+
{:else}
|
|
72
|
+
<button
|
|
73
|
+
bind:this={ref}
|
|
74
|
+
data-slot="button"
|
|
75
|
+
class={cn(buttonVariants({ variant, size }), className)}
|
|
76
|
+
{type}
|
|
77
|
+
{disabled}
|
|
78
|
+
{...restProps}
|
|
79
|
+
>
|
|
80
|
+
{@render children?.()}
|
|
81
|
+
</button>
|
|
82
|
+
{/if}
|
|
@@ -0,0 +1,64 @@
|
|
|
1
|
+
import { type WithElementRef } from "../../../utils.js";
|
|
2
|
+
import type { HTMLAnchorAttributes, HTMLButtonAttributes } from "svelte/elements";
|
|
3
|
+
import { type VariantProps } from "tailwind-variants";
|
|
4
|
+
export declare const buttonVariants: import("tailwind-variants").TVReturnType<{
|
|
5
|
+
variant: {
|
|
6
|
+
default: string;
|
|
7
|
+
destructive: string;
|
|
8
|
+
outline: string;
|
|
9
|
+
secondary: string;
|
|
10
|
+
ghost: string;
|
|
11
|
+
link: string;
|
|
12
|
+
};
|
|
13
|
+
size: {
|
|
14
|
+
default: string;
|
|
15
|
+
sm: string;
|
|
16
|
+
lg: string;
|
|
17
|
+
icon: string;
|
|
18
|
+
"icon-sm": string;
|
|
19
|
+
"icon-lg": string;
|
|
20
|
+
};
|
|
21
|
+
}, 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 rounded-md text-sm font-medium whitespace-nowrap transition-all outline-none focus-visible:ring-[3px] disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", {
|
|
22
|
+
variant: {
|
|
23
|
+
default: string;
|
|
24
|
+
destructive: string;
|
|
25
|
+
outline: string;
|
|
26
|
+
secondary: string;
|
|
27
|
+
ghost: string;
|
|
28
|
+
link: string;
|
|
29
|
+
};
|
|
30
|
+
size: {
|
|
31
|
+
default: string;
|
|
32
|
+
sm: string;
|
|
33
|
+
lg: string;
|
|
34
|
+
icon: string;
|
|
35
|
+
"icon-sm": string;
|
|
36
|
+
"icon-lg": string;
|
|
37
|
+
};
|
|
38
|
+
}, undefined, import("tailwind-variants").TVReturnType<{
|
|
39
|
+
variant: {
|
|
40
|
+
default: string;
|
|
41
|
+
destructive: string;
|
|
42
|
+
outline: string;
|
|
43
|
+
secondary: string;
|
|
44
|
+
ghost: string;
|
|
45
|
+
link: string;
|
|
46
|
+
};
|
|
47
|
+
size: {
|
|
48
|
+
default: string;
|
|
49
|
+
sm: string;
|
|
50
|
+
lg: string;
|
|
51
|
+
icon: string;
|
|
52
|
+
"icon-sm": string;
|
|
53
|
+
"icon-lg": string;
|
|
54
|
+
};
|
|
55
|
+
}, 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 rounded-md text-sm font-medium whitespace-nowrap transition-all outline-none focus-visible:ring-[3px] disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", unknown, unknown, undefined>>;
|
|
56
|
+
export type ButtonVariant = VariantProps<typeof buttonVariants>["variant"];
|
|
57
|
+
export type ButtonSize = VariantProps<typeof buttonVariants>["size"];
|
|
58
|
+
export type ButtonProps = WithElementRef<HTMLButtonAttributes> & WithElementRef<HTMLAnchorAttributes> & {
|
|
59
|
+
variant?: ButtonVariant;
|
|
60
|
+
size?: ButtonSize;
|
|
61
|
+
};
|
|
62
|
+
declare const Button: import("svelte").Component<ButtonProps, {}, "ref">;
|
|
63
|
+
type Button = ReturnType<typeof Button>;
|
|
64
|
+
export default Button;
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
<script lang="ts">
|
|
2
|
+
import { cn, type WithElementRef } from "../../../utils.js";
|
|
3
|
+
import type { HTMLAttributes } from "svelte/elements";
|
|
4
|
+
|
|
5
|
+
let {
|
|
6
|
+
ref = $bindable(null),
|
|
7
|
+
class: className,
|
|
8
|
+
children,
|
|
9
|
+
...restProps
|
|
10
|
+
}: WithElementRef<HTMLAttributes<HTMLDivElement>> = $props();
|
|
11
|
+
</script>
|
|
12
|
+
|
|
13
|
+
<div
|
|
14
|
+
bind:this={ref}
|
|
15
|
+
data-slot="card-action"
|
|
16
|
+
class={cn("col-start-2 row-span-2 row-start-1 self-start justify-self-end", className)}
|
|
17
|
+
{...restProps}
|
|
18
|
+
>
|
|
19
|
+
{@render children?.()}
|
|
20
|
+
</div>
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import { type WithElementRef } from "../../../utils.js";
|
|
2
|
+
import type { HTMLAttributes } from "svelte/elements";
|
|
3
|
+
declare const CardAction: import("svelte").Component<WithElementRef<HTMLAttributes<HTMLDivElement>>, {}, "ref">;
|
|
4
|
+
type CardAction = ReturnType<typeof CardAction>;
|
|
5
|
+
export default CardAction;
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
<script lang="ts">
|
|
2
|
+
import type { HTMLAttributes } from "svelte/elements";
|
|
3
|
+
import { cn, type WithElementRef } from "../../../utils.js";
|
|
4
|
+
|
|
5
|
+
let {
|
|
6
|
+
ref = $bindable(null),
|
|
7
|
+
class: className,
|
|
8
|
+
children,
|
|
9
|
+
...restProps
|
|
10
|
+
}: WithElementRef<HTMLAttributes<HTMLDivElement>> = $props();
|
|
11
|
+
</script>
|
|
12
|
+
|
|
13
|
+
<div bind:this={ref} data-slot="card-content" class={cn("px-6", className)} {...restProps}>
|
|
14
|
+
{@render children?.()}
|
|
15
|
+
</div>
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import type { HTMLAttributes } from "svelte/elements";
|
|
2
|
+
import { type WithElementRef } from "../../../utils.js";
|
|
3
|
+
declare const CardContent: import("svelte").Component<WithElementRef<HTMLAttributes<HTMLDivElement>>, {}, "ref">;
|
|
4
|
+
type CardContent = ReturnType<typeof CardContent>;
|
|
5
|
+
export default CardContent;
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
<script lang="ts">
|
|
2
|
+
import type { HTMLAttributes } from "svelte/elements";
|
|
3
|
+
import { cn, type WithElementRef } from "../../../utils.js";
|
|
4
|
+
|
|
5
|
+
let {
|
|
6
|
+
ref = $bindable(null),
|
|
7
|
+
class: className,
|
|
8
|
+
children,
|
|
9
|
+
...restProps
|
|
10
|
+
}: WithElementRef<HTMLAttributes<HTMLParagraphElement>> = $props();
|
|
11
|
+
</script>
|
|
12
|
+
|
|
13
|
+
<p
|
|
14
|
+
bind:this={ref}
|
|
15
|
+
data-slot="card-description"
|
|
16
|
+
class={cn("text-muted-foreground text-sm", className)}
|
|
17
|
+
{...restProps}
|
|
18
|
+
>
|
|
19
|
+
{@render children?.()}
|
|
20
|
+
</p>
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import type { HTMLAttributes } from "svelte/elements";
|
|
2
|
+
import { type WithElementRef } from "../../../utils.js";
|
|
3
|
+
declare const CardDescription: import("svelte").Component<WithElementRef<HTMLAttributes<HTMLParagraphElement>>, {}, "ref">;
|
|
4
|
+
type CardDescription = ReturnType<typeof CardDescription>;
|
|
5
|
+
export default CardDescription;
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
<script lang="ts">
|
|
2
|
+
import { cn, type WithElementRef } from "../../../utils.js";
|
|
3
|
+
import type { HTMLAttributes } from "svelte/elements";
|
|
4
|
+
|
|
5
|
+
let {
|
|
6
|
+
ref = $bindable(null),
|
|
7
|
+
class: className,
|
|
8
|
+
children,
|
|
9
|
+
...restProps
|
|
10
|
+
}: WithElementRef<HTMLAttributes<HTMLDivElement>> = $props();
|
|
11
|
+
</script>
|
|
12
|
+
|
|
13
|
+
<div
|
|
14
|
+
bind:this={ref}
|
|
15
|
+
data-slot="card-footer"
|
|
16
|
+
class={cn("flex items-center px-6 [.border-t]:pt-6", className)}
|
|
17
|
+
{...restProps}
|
|
18
|
+
>
|
|
19
|
+
{@render children?.()}
|
|
20
|
+
</div>
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import { type WithElementRef } from "../../../utils.js";
|
|
2
|
+
import type { HTMLAttributes } from "svelte/elements";
|
|
3
|
+
declare const CardFooter: import("svelte").Component<WithElementRef<HTMLAttributes<HTMLDivElement>>, {}, "ref">;
|
|
4
|
+
type CardFooter = ReturnType<typeof CardFooter>;
|
|
5
|
+
export default CardFooter;
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
<script lang="ts">
|
|
2
|
+
import { cn, type WithElementRef } from "../../../utils.js";
|
|
3
|
+
import type { HTMLAttributes } from "svelte/elements";
|
|
4
|
+
|
|
5
|
+
let {
|
|
6
|
+
ref = $bindable(null),
|
|
7
|
+
class: className,
|
|
8
|
+
children,
|
|
9
|
+
...restProps
|
|
10
|
+
}: WithElementRef<HTMLAttributes<HTMLDivElement>> = $props();
|
|
11
|
+
</script>
|
|
12
|
+
|
|
13
|
+
<div
|
|
14
|
+
bind:this={ref}
|
|
15
|
+
data-slot="card-header"
|
|
16
|
+
class={cn(
|
|
17
|
+
"@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-1.5 px-6 has-data-[slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6",
|
|
18
|
+
className
|
|
19
|
+
)}
|
|
20
|
+
{...restProps}
|
|
21
|
+
>
|
|
22
|
+
{@render children?.()}
|
|
23
|
+
</div>
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import { type WithElementRef } from "../../../utils.js";
|
|
2
|
+
import type { HTMLAttributes } from "svelte/elements";
|
|
3
|
+
declare const CardHeader: import("svelte").Component<WithElementRef<HTMLAttributes<HTMLDivElement>>, {}, "ref">;
|
|
4
|
+
type CardHeader = ReturnType<typeof CardHeader>;
|
|
5
|
+
export default CardHeader;
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
<script lang="ts">
|
|
2
|
+
import type { HTMLAttributes } from "svelte/elements";
|
|
3
|
+
import { cn, type WithElementRef } from "../../../utils.js";
|
|
4
|
+
|
|
5
|
+
let {
|
|
6
|
+
ref = $bindable(null),
|
|
7
|
+
class: className,
|
|
8
|
+
children,
|
|
9
|
+
...restProps
|
|
10
|
+
}: WithElementRef<HTMLAttributes<HTMLDivElement>> = $props();
|
|
11
|
+
</script>
|
|
12
|
+
|
|
13
|
+
<div
|
|
14
|
+
bind:this={ref}
|
|
15
|
+
data-slot="card-title"
|
|
16
|
+
class={cn("leading-none font-semibold", className)}
|
|
17
|
+
{...restProps}
|
|
18
|
+
>
|
|
19
|
+
{@render children?.()}
|
|
20
|
+
</div>
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import type { HTMLAttributes } from "svelte/elements";
|
|
2
|
+
import { type WithElementRef } from "../../../utils.js";
|
|
3
|
+
declare const CardTitle: import("svelte").Component<WithElementRef<HTMLAttributes<HTMLDivElement>>, {}, "ref">;
|
|
4
|
+
type CardTitle = ReturnType<typeof CardTitle>;
|
|
5
|
+
export default CardTitle;
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
<script lang="ts">
|
|
2
|
+
import type { HTMLAttributes } from "svelte/elements";
|
|
3
|
+
import { cn, type WithElementRef } from "../../../utils.js";
|
|
4
|
+
|
|
5
|
+
let {
|
|
6
|
+
ref = $bindable(null),
|
|
7
|
+
class: className,
|
|
8
|
+
children,
|
|
9
|
+
...restProps
|
|
10
|
+
}: WithElementRef<HTMLAttributes<HTMLDivElement>> = $props();
|
|
11
|
+
</script>
|
|
12
|
+
|
|
13
|
+
<div
|
|
14
|
+
bind:this={ref}
|
|
15
|
+
data-slot="card"
|
|
16
|
+
class={cn(
|
|
17
|
+
"bg-card text-card-foreground flex flex-col gap-6 rounded-xl border py-6 shadow-sm",
|
|
18
|
+
className
|
|
19
|
+
)}
|
|
20
|
+
{...restProps}
|
|
21
|
+
>
|
|
22
|
+
{@render children?.()}
|
|
23
|
+
</div>
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import type { HTMLAttributes } from "svelte/elements";
|
|
2
|
+
import { type WithElementRef } from "../../../utils.js";
|
|
3
|
+
declare const Card: import("svelte").Component<WithElementRef<HTMLAttributes<HTMLDivElement>>, {}, "ref">;
|
|
4
|
+
type Card = ReturnType<typeof Card>;
|
|
5
|
+
export default Card;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import Root from "./card.svelte";
|
|
2
|
+
import Content from "./card-content.svelte";
|
|
3
|
+
import Description from "./card-description.svelte";
|
|
4
|
+
import Footer from "./card-footer.svelte";
|
|
5
|
+
import Header from "./card-header.svelte";
|
|
6
|
+
import Title from "./card-title.svelte";
|
|
7
|
+
import Action from "./card-action.svelte";
|
|
8
|
+
export { Root, Content, Description, Footer, Header, Title, Action, Root as Card, Content as CardContent, Description as CardDescription, Footer as CardFooter, Header as CardHeader, Title as CardTitle, Action as CardAction, };
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import Root from "./card.svelte";
|
|
2
|
+
import Content from "./card-content.svelte";
|
|
3
|
+
import Description from "./card-description.svelte";
|
|
4
|
+
import Footer from "./card-footer.svelte";
|
|
5
|
+
import Header from "./card-header.svelte";
|
|
6
|
+
import Title from "./card-title.svelte";
|
|
7
|
+
import Action from "./card-action.svelte";
|
|
8
|
+
export { Root, Content, Description, Footer, Header, Title, Action,
|
|
9
|
+
//
|
|
10
|
+
Root as Card, Content as CardContent, Description as CardDescription, Footer as CardFooter, Header as CardHeader, Title as CardTitle, Action as CardAction, };
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
<script lang="ts">
|
|
2
|
+
import { Checkbox as CheckboxPrimitive } from "bits-ui";
|
|
3
|
+
import CheckIcon from "@lucide/svelte/icons/check";
|
|
4
|
+
import MinusIcon from "@lucide/svelte/icons/minus";
|
|
5
|
+
import { cn, type WithoutChildrenOrChild } from "../../../utils.js";
|
|
6
|
+
|
|
7
|
+
let {
|
|
8
|
+
ref = $bindable(null),
|
|
9
|
+
checked = $bindable(false),
|
|
10
|
+
indeterminate = $bindable(false),
|
|
11
|
+
class: className,
|
|
12
|
+
...restProps
|
|
13
|
+
}: WithoutChildrenOrChild<CheckboxPrimitive.RootProps> = $props();
|
|
14
|
+
</script>
|
|
15
|
+
|
|
16
|
+
<CheckboxPrimitive.Root
|
|
17
|
+
bind:ref
|
|
18
|
+
data-slot="checkbox"
|
|
19
|
+
class={cn(
|
|
20
|
+
"border-input dark:bg-input/30 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground dark:data-[state=checked]:bg-primary data-[state=checked]:border-primary focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive peer flex size-4 shrink-0 items-center justify-center rounded-[4px] border shadow-xs transition-shadow outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50",
|
|
21
|
+
className
|
|
22
|
+
)}
|
|
23
|
+
bind:checked
|
|
24
|
+
bind:indeterminate
|
|
25
|
+
{...restProps}
|
|
26
|
+
>
|
|
27
|
+
{#snippet children({ checked, indeterminate })}
|
|
28
|
+
<div data-slot="checkbox-indicator" class="text-current transition-none">
|
|
29
|
+
{#if checked}
|
|
30
|
+
<CheckIcon class="size-3.5" />
|
|
31
|
+
{:else if indeterminate}
|
|
32
|
+
<MinusIcon class="size-3.5" />
|
|
33
|
+
{/if}
|
|
34
|
+
</div>
|
|
35
|
+
{/snippet}
|
|
36
|
+
</CheckboxPrimitive.Root>
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import { Checkbox as CheckboxPrimitive } from "bits-ui";
|
|
2
|
+
declare const Checkbox: import("svelte").Component<Omit<Omit<CheckboxPrimitive.RootProps, "child">, "children">, {}, "ref" | "checked" | "indeterminate">;
|
|
3
|
+
type Checkbox = ReturnType<typeof Checkbox>;
|
|
4
|
+
export default Checkbox;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import Root from "./table.svelte";
|
|
2
|
+
import Body from "./table-body.svelte";
|
|
3
|
+
import Caption from "./table-caption.svelte";
|
|
4
|
+
import Cell from "./table-cell.svelte";
|
|
5
|
+
import Footer from "./table-footer.svelte";
|
|
6
|
+
import Head from "./table-head.svelte";
|
|
7
|
+
import Header from "./table-header.svelte";
|
|
8
|
+
import Row from "./table-row.svelte";
|
|
9
|
+
export { Root, Body, Caption, Cell, Footer, Head, Header, Row, Root as Table, Body as TableBody, Caption as TableCaption, Cell as TableCell, Footer as TableFooter, Head as TableHead, Header as TableHeader, Row as TableRow, };
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import Root from "./table.svelte";
|
|
2
|
+
import Body from "./table-body.svelte";
|
|
3
|
+
import Caption from "./table-caption.svelte";
|
|
4
|
+
import Cell from "./table-cell.svelte";
|
|
5
|
+
import Footer from "./table-footer.svelte";
|
|
6
|
+
import Head from "./table-head.svelte";
|
|
7
|
+
import Header from "./table-header.svelte";
|
|
8
|
+
import Row from "./table-row.svelte";
|
|
9
|
+
export { Root, Body, Caption, Cell, Footer, Head, Header, Row,
|
|
10
|
+
//
|
|
11
|
+
Root as Table, Body as TableBody, Caption as TableCaption, Cell as TableCell, Footer as TableFooter, Head as TableHead, Header as TableHeader, Row as TableRow, };
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
<script lang="ts">
|
|
2
|
+
import { cn, type WithElementRef } from "../../../utils.js";
|
|
3
|
+
import type { HTMLAttributes } from "svelte/elements";
|
|
4
|
+
|
|
5
|
+
let {
|
|
6
|
+
ref = $bindable(null),
|
|
7
|
+
class: className,
|
|
8
|
+
children,
|
|
9
|
+
...restProps
|
|
10
|
+
}: WithElementRef<HTMLAttributes<HTMLTableSectionElement>> = $props();
|
|
11
|
+
</script>
|
|
12
|
+
|
|
13
|
+
<tbody
|
|
14
|
+
bind:this={ref}
|
|
15
|
+
data-slot="table-body"
|
|
16
|
+
class={cn("[&_tr:last-child]:border-0", className)}
|
|
17
|
+
{...restProps}
|
|
18
|
+
>
|
|
19
|
+
{@render children?.()}
|
|
20
|
+
</tbody>
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import { type WithElementRef } from "../../../utils.js";
|
|
2
|
+
import type { HTMLAttributes } from "svelte/elements";
|
|
3
|
+
declare const TableBody: import("svelte").Component<WithElementRef<HTMLAttributes<HTMLTableSectionElement>>, {}, "ref">;
|
|
4
|
+
type TableBody = ReturnType<typeof TableBody>;
|
|
5
|
+
export default TableBody;
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
<script lang="ts">
|
|
2
|
+
import { cn, type WithElementRef } from "../../../utils.js";
|
|
3
|
+
import type { HTMLAttributes } from "svelte/elements";
|
|
4
|
+
|
|
5
|
+
let {
|
|
6
|
+
ref = $bindable(null),
|
|
7
|
+
class: className,
|
|
8
|
+
children,
|
|
9
|
+
...restProps
|
|
10
|
+
}: WithElementRef<HTMLAttributes<HTMLElement>> = $props();
|
|
11
|
+
</script>
|
|
12
|
+
|
|
13
|
+
<caption
|
|
14
|
+
bind:this={ref}
|
|
15
|
+
data-slot="table-caption"
|
|
16
|
+
class={cn("text-muted-foreground mt-4 text-sm", className)}
|
|
17
|
+
{...restProps}
|
|
18
|
+
>
|
|
19
|
+
{@render children?.()}
|
|
20
|
+
</caption>
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import { type WithElementRef } from "../../../utils.js";
|
|
2
|
+
import type { HTMLAttributes } from "svelte/elements";
|
|
3
|
+
declare const TableCaption: import("svelte").Component<WithElementRef<HTMLAttributes<HTMLElement>>, {}, "ref">;
|
|
4
|
+
type TableCaption = ReturnType<typeof TableCaption>;
|
|
5
|
+
export default TableCaption;
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
<script lang="ts">
|
|
2
|
+
import { cn, type WithElementRef } from "../../../utils.js";
|
|
3
|
+
import type { HTMLTdAttributes } from "svelte/elements";
|
|
4
|
+
|
|
5
|
+
let {
|
|
6
|
+
ref = $bindable(null),
|
|
7
|
+
class: className,
|
|
8
|
+
children,
|
|
9
|
+
...restProps
|
|
10
|
+
}: WithElementRef<HTMLTdAttributes> = $props();
|
|
11
|
+
</script>
|
|
12
|
+
|
|
13
|
+
<td
|
|
14
|
+
bind:this={ref}
|
|
15
|
+
data-slot="table-cell"
|
|
16
|
+
class={cn(
|
|
17
|
+
"bg-clip-padding p-2 align-middle whitespace-nowrap [&:has([role=checkbox])]:pe-0",
|
|
18
|
+
className
|
|
19
|
+
)}
|
|
20
|
+
{...restProps}
|
|
21
|
+
>
|
|
22
|
+
{@render children?.()}
|
|
23
|
+
</td>
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import { type WithElementRef } from "../../../utils.js";
|
|
2
|
+
import type { HTMLTdAttributes } from "svelte/elements";
|
|
3
|
+
declare const TableCell: import("svelte").Component<WithElementRef<HTMLTdAttributes>, {}, "ref">;
|
|
4
|
+
type TableCell = ReturnType<typeof TableCell>;
|
|
5
|
+
export default TableCell;
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
<script lang="ts">
|
|
2
|
+
import { cn, type WithElementRef } from "../../../utils.js";
|
|
3
|
+
import type { HTMLAttributes } from "svelte/elements";
|
|
4
|
+
|
|
5
|
+
let {
|
|
6
|
+
ref = $bindable(null),
|
|
7
|
+
class: className,
|
|
8
|
+
children,
|
|
9
|
+
...restProps
|
|
10
|
+
}: WithElementRef<HTMLAttributes<HTMLTableSectionElement>> = $props();
|
|
11
|
+
</script>
|
|
12
|
+
|
|
13
|
+
<tfoot
|
|
14
|
+
bind:this={ref}
|
|
15
|
+
data-slot="table-footer"
|
|
16
|
+
class={cn("bg-muted/50 border-t font-medium [&>tr]:last:border-b-0", className)}
|
|
17
|
+
{...restProps}
|
|
18
|
+
>
|
|
19
|
+
{@render children?.()}
|
|
20
|
+
</tfoot>
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import { type WithElementRef } from "../../../utils.js";
|
|
2
|
+
import type { HTMLAttributes } from "svelte/elements";
|
|
3
|
+
declare const TableFooter: import("svelte").Component<WithElementRef<HTMLAttributes<HTMLTableSectionElement>>, {}, "ref">;
|
|
4
|
+
type TableFooter = ReturnType<typeof TableFooter>;
|
|
5
|
+
export default TableFooter;
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
<script lang="ts">
|
|
2
|
+
import { cn, type WithElementRef } from "../../../utils.js";
|
|
3
|
+
import type { HTMLThAttributes } from "svelte/elements";
|
|
4
|
+
|
|
5
|
+
let {
|
|
6
|
+
ref = $bindable(null),
|
|
7
|
+
class: className,
|
|
8
|
+
children,
|
|
9
|
+
...restProps
|
|
10
|
+
}: WithElementRef<HTMLThAttributes> = $props();
|
|
11
|
+
</script>
|
|
12
|
+
|
|
13
|
+
<th
|
|
14
|
+
bind:this={ref}
|
|
15
|
+
data-slot="table-head"
|
|
16
|
+
class={cn(
|
|
17
|
+
"text-foreground h-10 bg-clip-padding px-2 text-start align-middle font-medium whitespace-nowrap [&:has([role=checkbox])]:pe-0",
|
|
18
|
+
className
|
|
19
|
+
)}
|
|
20
|
+
{...restProps}
|
|
21
|
+
>
|
|
22
|
+
{@render children?.()}
|
|
23
|
+
</th>
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import { type WithElementRef } from "../../../utils.js";
|
|
2
|
+
import type { HTMLThAttributes } from "svelte/elements";
|
|
3
|
+
declare const TableHead: import("svelte").Component<WithElementRef<HTMLThAttributes>, {}, "ref">;
|
|
4
|
+
type TableHead = ReturnType<typeof TableHead>;
|
|
5
|
+
export default TableHead;
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
<script lang="ts">
|
|
2
|
+
import { cn, type WithElementRef } from "../../../utils.js";
|
|
3
|
+
import type { HTMLAttributes } from "svelte/elements";
|
|
4
|
+
|
|
5
|
+
let {
|
|
6
|
+
ref = $bindable(null),
|
|
7
|
+
class: className,
|
|
8
|
+
children,
|
|
9
|
+
...restProps
|
|
10
|
+
}: WithElementRef<HTMLAttributes<HTMLTableSectionElement>> = $props();
|
|
11
|
+
</script>
|
|
12
|
+
|
|
13
|
+
<thead
|
|
14
|
+
bind:this={ref}
|
|
15
|
+
data-slot="table-header"
|
|
16
|
+
class={cn("[&_tr]:border-b", className)}
|
|
17
|
+
{...restProps}
|
|
18
|
+
>
|
|
19
|
+
{@render children?.()}
|
|
20
|
+
</thead>
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import { type WithElementRef } from "../../../utils.js";
|
|
2
|
+
import type { HTMLAttributes } from "svelte/elements";
|
|
3
|
+
declare const TableHeader: import("svelte").Component<WithElementRef<HTMLAttributes<HTMLTableSectionElement>>, {}, "ref">;
|
|
4
|
+
type TableHeader = ReturnType<typeof TableHeader>;
|
|
5
|
+
export default TableHeader;
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
<script lang="ts">
|
|
2
|
+
import { cn, type WithElementRef } from "../../../utils.js";
|
|
3
|
+
import type { HTMLAttributes } from "svelte/elements";
|
|
4
|
+
|
|
5
|
+
let {
|
|
6
|
+
ref = $bindable(null),
|
|
7
|
+
class: className,
|
|
8
|
+
children,
|
|
9
|
+
...restProps
|
|
10
|
+
}: WithElementRef<HTMLAttributes<HTMLTableRowElement>> = $props();
|
|
11
|
+
</script>
|
|
12
|
+
|
|
13
|
+
<tr
|
|
14
|
+
bind:this={ref}
|
|
15
|
+
data-slot="table-row"
|
|
16
|
+
class={cn(
|
|
17
|
+
"hover:[&,&>svelte-css-wrapper]:[&>th,td]:bg-muted/50 data-[state=selected]:bg-muted border-b transition-colors",
|
|
18
|
+
className
|
|
19
|
+
)}
|
|
20
|
+
{...restProps}
|
|
21
|
+
>
|
|
22
|
+
{@render children?.()}
|
|
23
|
+
</tr>
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import { type WithElementRef } from "../../../utils.js";
|
|
2
|
+
import type { HTMLAttributes } from "svelte/elements";
|
|
3
|
+
declare const TableRow: import("svelte").Component<WithElementRef<HTMLAttributes<HTMLTableRowElement>>, {}, "ref">;
|
|
4
|
+
type TableRow = ReturnType<typeof TableRow>;
|
|
5
|
+
export default TableRow;
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
<script lang="ts">
|
|
2
|
+
import type { HTMLTableAttributes } from "svelte/elements";
|
|
3
|
+
import { cn, type WithElementRef } from "../../../utils.js";
|
|
4
|
+
|
|
5
|
+
let {
|
|
6
|
+
ref = $bindable(null),
|
|
7
|
+
class: className,
|
|
8
|
+
children,
|
|
9
|
+
...restProps
|
|
10
|
+
}: WithElementRef<HTMLTableAttributes> = $props();
|
|
11
|
+
</script>
|
|
12
|
+
|
|
13
|
+
<div data-slot="table-container" class="relative w-full overflow-x-auto">
|
|
14
|
+
<table
|
|
15
|
+
bind:this={ref}
|
|
16
|
+
data-slot="table"
|
|
17
|
+
class={cn("w-full caption-bottom text-sm", className)}
|
|
18
|
+
{...restProps}
|
|
19
|
+
>
|
|
20
|
+
{@render children?.()}
|
|
21
|
+
</table>
|
|
22
|
+
</div>
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import type { HTMLTableAttributes } from "svelte/elements";
|
|
2
|
+
import { type WithElementRef } from "../../../utils.js";
|
|
3
|
+
declare const Table: import("svelte").Component<WithElementRef<HTMLTableAttributes>, {}, "ref">;
|
|
4
|
+
type Table = ReturnType<typeof Table>;
|
|
5
|
+
export default Table;
|
package/dist/index.d.ts
ADDED
package/dist/index.js
ADDED
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import type { Readable } from "svelte/store";
|
|
2
|
+
export declare const REALTIME_MANAGER_KEY: unique symbol;
|
|
3
|
+
export type RealtimeMessage<T = unknown> = {
|
|
4
|
+
channel: string;
|
|
5
|
+
topic: string;
|
|
6
|
+
data: T;
|
|
7
|
+
receivedAt: number;
|
|
8
|
+
raw?: unknown;
|
|
9
|
+
};
|
|
10
|
+
export type ChannelConfig = {
|
|
11
|
+
channel: string;
|
|
12
|
+
topics: string[];
|
|
13
|
+
params?: Record<string, string>;
|
|
14
|
+
};
|
|
15
|
+
export type RealtimeManager = {
|
|
16
|
+
subscribe: (config: ChannelConfig) => void;
|
|
17
|
+
unsubscribe: (channel: string) => void;
|
|
18
|
+
closeAll: () => void;
|
|
19
|
+
listen: <T = unknown>(channel: string, topic: string, handler: (message: RealtimeMessage<T>) => void) => () => void;
|
|
20
|
+
get: <T = unknown>(channel: string, topic?: string) => Readable<RealtimeMessage<T>[]>;
|
|
21
|
+
getLatest: <T = unknown>(channel: string, topic?: string) => Readable<RealtimeMessage<T> | null>;
|
|
22
|
+
};
|
|
23
|
+
export declare function getRealtimeManager(): RealtimeManager;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { getContext } from "svelte";
|
|
2
|
+
export const REALTIME_MANAGER_KEY = Symbol("realtime-manager");
|
|
3
|
+
export function getRealtimeManager() {
|
|
4
|
+
const manager = getContext(REALTIME_MANAGER_KEY);
|
|
5
|
+
if (!manager) {
|
|
6
|
+
throw new Error("RealtimeManager context not found. Wrap your tree in <RealtimeManager>.");
|
|
7
|
+
}
|
|
8
|
+
return manager;
|
|
9
|
+
}
|
package/dist/utils.d.ts
ADDED
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { type ClassValue } from "clsx";
|
|
2
|
+
export declare function cn(...inputs: ClassValue[]): string;
|
|
3
|
+
export type WithoutChild<T> = T extends {
|
|
4
|
+
child?: any;
|
|
5
|
+
} ? Omit<T, "child"> : T;
|
|
6
|
+
export type WithoutChildren<T> = T extends {
|
|
7
|
+
children?: any;
|
|
8
|
+
} ? Omit<T, "children"> : T;
|
|
9
|
+
export type WithoutChildrenOrChild<T> = WithoutChildren<WithoutChild<T>>;
|
|
10
|
+
export type WithElementRef<T, U extends HTMLElement = HTMLElement> = T & {
|
|
11
|
+
ref?: U | null;
|
|
12
|
+
};
|
package/dist/utils.js
ADDED
package/package.json
ADDED
|
@@ -0,0 +1,63 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@novadx/svelte-inngest",
|
|
3
|
+
"version": "0.0.0",
|
|
4
|
+
"scripts": {
|
|
5
|
+
"dev": "vite dev",
|
|
6
|
+
"build": "vite build && npm run prepack",
|
|
7
|
+
"preview": "vite preview",
|
|
8
|
+
"prepare": "svelte-kit sync || echo ''",
|
|
9
|
+
"prepack": "svelte-kit sync && svelte-package && publint",
|
|
10
|
+
"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
|
|
11
|
+
"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch"
|
|
12
|
+
},
|
|
13
|
+
"files": [
|
|
14
|
+
"dist",
|
|
15
|
+
"!dist/**/*.test.*",
|
|
16
|
+
"!dist/**/*.spec.*"
|
|
17
|
+
],
|
|
18
|
+
"sideEffects": [
|
|
19
|
+
"**/*.css"
|
|
20
|
+
],
|
|
21
|
+
"svelte": "./dist/index.js",
|
|
22
|
+
"types": "./dist/index.d.ts",
|
|
23
|
+
"type": "module",
|
|
24
|
+
"exports": {
|
|
25
|
+
".": {
|
|
26
|
+
"types": "./dist/index.d.ts",
|
|
27
|
+
"svelte": "./dist/index.js"
|
|
28
|
+
}
|
|
29
|
+
},
|
|
30
|
+
"dependencies": {
|
|
31
|
+
"@inngest/realtime": "^0.4.5",
|
|
32
|
+
"inngest": "^3.32.0",
|
|
33
|
+
"sveltekit-sse": "^0.14.3"
|
|
34
|
+
},
|
|
35
|
+
"peerDependencies": {
|
|
36
|
+
"svelte": "^5.0.0"
|
|
37
|
+
},
|
|
38
|
+
"devDependencies": {
|
|
39
|
+
"@internationalized/date": "^3.10.0",
|
|
40
|
+
"@lucide/svelte": "^0.561.0",
|
|
41
|
+
"@sveltejs/adapter-auto": "^7.0.0",
|
|
42
|
+
"@sveltejs/kit": "^2.50.1",
|
|
43
|
+
"@sveltejs/package": "^2.5.7",
|
|
44
|
+
"@sveltejs/vite-plugin-svelte": "^6.2.4",
|
|
45
|
+
"@tailwindcss/forms": "^0.5.11",
|
|
46
|
+
"@tailwindcss/typography": "^0.5.19",
|
|
47
|
+
"@tailwindcss/vite": "^4.1.18",
|
|
48
|
+
"bits-ui": "^2.14.4",
|
|
49
|
+
"clsx": "^2.1.1",
|
|
50
|
+
"publint": "^0.3.17",
|
|
51
|
+
"svelte": "^5.48.2",
|
|
52
|
+
"svelte-check": "^4.3.5",
|
|
53
|
+
"tailwind-merge": "^3.4.0",
|
|
54
|
+
"tailwind-variants": "^3.2.2",
|
|
55
|
+
"tailwindcss": "^4.1.18",
|
|
56
|
+
"tw-animate-css": "^1.4.0",
|
|
57
|
+
"typescript": "^5.9.3",
|
|
58
|
+
"vite": "^7.3.1"
|
|
59
|
+
},
|
|
60
|
+
"keywords": [
|
|
61
|
+
"svelte"
|
|
62
|
+
]
|
|
63
|
+
}
|