@tanglemedia/svelte-starter-auth-shadcn 0.0.3 → 0.1.0

package/dist/lib/components/ui/auth-layout/index.d.ts

@@ -1,2 +1,8 @@
-import AuthLayout from './auth-layout.svelte';
-export { AuthLayout };
+import Root from "./auth-layout.svelte";
+import Feature from "./auth-layout-feature.svelte";
+import Info from "./auth-layout-feature-info.svelte";
+import Content from './auth-layout-content.svelte';
+import Main from './auth-layout-main.svelte';
+import ContentTop from './auth-layout-content-top.svelte';
+import Logo from './auth-layout-logo.svelte';
+export { Root, Feature, Info, Content, ContentTop, Main, Logo, Root as AuthLayout, Feature as AuthLayoutFeature, Info as AuthLayoutFeatureInfo };

package/dist/lib/components/ui/auth-layout/index.js

@@ -1,2 +1,10 @@
-import AuthLayout from './auth-layout.svelte';
-export { AuthLayout };
+import Root from "./auth-layout.svelte";
+import Feature from "./auth-layout-feature.svelte";
+import Info from "./auth-layout-feature-info.svelte";
+import Content from './auth-layout-content.svelte';
+import Main from './auth-layout-main.svelte';
+import ContentTop from './auth-layout-content-top.svelte';
+import Logo from './auth-layout-logo.svelte';
+export { Root, Feature, Info, Content, ContentTop, Main, Logo, 
+//
+Root as AuthLayout, Feature as AuthLayoutFeature, Info as AuthLayoutFeatureInfo };

package/dist/lib/components/ui/forgot-password/forgot-password-container.svelte

@@ -0,0 +1,27 @@
+<script lang="ts">
+  import { Card } from '@tanglemedia/svelte-starter-ui-shadcn';
+  import type { WithChild } from 'svelte-toolbelt';
+  import { cn } from '../../../utils.js';
+
+  type ForgotPasswordContainerProps = Omit<WithChild, 'child'> & {
+    class?: string;
+    card?: boolean;
+  };
+
+  const {
+    children,
+    class: cls,
+    card = true,
+    ...rest
+  }: ForgotPasswordContainerProps = $props();
+</script>
+
+{#if !card}
+  <div class={cn('mx-auto max-w-sm', cls)} {...rest}>
+    {@render children?.()}
+  </div>
+{:else}
+  <Card.Root class={cn('mx-auto max-w-sm', cls)} {...rest}>
+    {@render children?.()}
+  </Card.Root>
+{/if}

package/dist/lib/components/ui/forgot-password/forgot-password-container.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { WithChild } from 'svelte-toolbelt';
+type ForgotPasswordContainerProps = Omit<WithChild, 'child'> & {
+    class?: string;
+    card?: boolean;
+};
+declare const ForgotPasswordContainer: import("svelte").Component<ForgotPasswordContainerProps, {}, "">;
+type ForgotPasswordContainer = ReturnType<typeof ForgotPasswordContainer>;
+export default ForgotPasswordContainer;

package/dist/lib/components/ui/forgot-password/forgot-password-form.svelte

@@ -1,98 +1,91 @@
 <script lang="ts">
-	import { Button, Card, Input, Label, Form } from '@tanglemedia/svelte-starter-ui-shadcn';
-  import type { Snippet } from 'svelte';
+  import { Card } from "@tanglemedia/svelte-starter-ui-shadcn";
+  import type { Snippet } from "svelte";
+  import SuperDebug, {
+    defaults,
+    superForm,
+    type Infer,
+    type SuperForm,
+    type SuperValidated,
+  } from "sveltekit-superforms";
+  import { zod4 } from "sveltekit-superforms/adapters";
+  import ForgotPasswordContainer from "./forgot-password-container.svelte";
+  import ForgotPasswordUserInput from "./forgot-password-user-input.svelte";
+  import ForgotPasswordHeader from "./forgot-password-header.svelte";
+  import ForgotPasswordProvider from "./forgot-password-provider.svelte";
+  import ForgotPasswordSubmit from "./forgot-password-submit.svelte";
+  import ForgotPasswordLogin from "./forgot-password-login.svelte";
+  import { forgotPasswordSchema, type ForgotPasswordSchema } from "./forgot-password.schema.js";
+  import { ServerError } from "@tanglemedia/svelte-starter-form-shadcn";
 
   interface Props {
-    superform: any;
+    superform?: SuperForm<Infer<ForgotPasswordSchema>> | null;
     card?: boolean;
-    cardClass?: string;
+    // cardClass?: string;
     title?: string;
     description?: string;
-    login?: boolean;
+    // forgotPassword?: boolean;
     loginLink?: string;
-    formTail?: Snippet;
-    formHead?: Snippet;
+    register?: boolean;
+    registerLink?: string;
+    lead?: Snippet;
+    tail?: Snippet;
     children?: Snippet;
+    form?: SuperValidated<Infer<ForgotPasswordSchema>>;
+    action?: string;
+
+    debug?: boolean;
   }
 
-  let { 
-    superform, 
-    card = false, 
-    cardClass = "mx-auto max-w-sm", 
-    title = "Forgot Password", 
+  let {
+    debug = false,
+    form,
+    superform: superforms = $bindable(null),
+    card = true,
+    title = "Forgot Password",
     description = "Enter your email below to request a password reset",
-    login = true,
+    // forgotPassword = true,
     loginLink = "/login",
-    formTail,
-    formHead,
-    children
+    register = true,
+    registerLink = "/register",
+    lead,
+    tail,
+    action = "?/forgot-password",
   }: Props = $props();
 
-  const { form: formData, enhance } = superform;
+  superforms = superforms || superForm(form || defaults(zod4(forgotPasswordSchema)));
+
+  const { errors, message } = superforms;
 </script>
 
-{#if card}
-  <Card.Root class={cardClass}>
-    <Card.Header>
-      <Card.Title class="text-2xl">{title}</Card.Title>
-      <Card.Description>{description}</Card.Description>
-    </Card.Header>
+<ForgotPasswordProvider {superforms} {action}>
+  <ForgotPasswordContainer {card}>
+    <ForgotPasswordHeader text={title} desc={description} />
     <Card.Content>
-      <form method="POST" use:enhance class="grid gap-4">
-        {@render formHead?.()}
-        {#if children}
-          {@render children?.()}
-        {:else}
-          <Form.Field form={superform} name="email">
-            <Form.Control>
-              {#snippet children({ props })}
-                <Form.Label>Email</Form.Label>
-                <Input {...props} bind:value={$formData.email} type="email" required />
-              {/snippet}
-            </Form.Control>
-            <Form.FieldErrors />
-          </Form.Field>
-        {/if}
-        <Form.Button type="submit" class="w-full">Request Password</Form.Button>
-        {@render formTail?.()}
-      </form>
-      {#if login}
+      {@render lead?.()}
+      <ServerError class="mb-4" />
+      <ForgotPasswordUserInput name={"email"}>
+        {#snippet asideLabel()}
+          <ForgotPasswordLogin href={loginLink} />
+        {/snippet}
+      </ForgotPasswordUserInput>
+      <ForgotPasswordSubmit />
+      {#if register}
         <div class="mt-4 text-center text-sm">
-          Remember your password?
-          <a href={loginLink} class="underline"> Sign in </a>
+          Don't have an account?
+          <a href={registerLink} class="underline"> Sign up </a>
         </div>
       {/if}
-    </Card.Content>
-  </Card.Root>
-{:else}
-  <div class={cardClass}>
-    <div class="flex flex-col space-y-1.5 p-6 pb-0">
-      <h3 class="font-semibold tracking-tight text-2xl">{title}</h3>
-      <p class="text-muted-foreground text-sm">{description}</p>
-    </div>
-    <form method="POST" use:enhance class="grid gap-4 p-6">
-      {@render formHead?.()}
-      {#if children}
-        {@render children?.()}
-      {:else}
-        <Form.Field form={superform} name="email">
-          <Form.Control>
-            {#snippet children({ props })}
-              <Form.Label>Email</Form.Label>
-              <Input {...props} bind:value={$formData.email} type="email" required />
-            {/snippet}
-          </Form.Control>
-          <Form.FieldErrors />
-        </Form.Field>
+      {@render tail?.()}
+
+      {#if debug}
+        <div class="mb-6">
+          <h4>Errors</h4>
+          <SuperDebug data={errors} />
+        </div>
+        <h4>Message</h4>
+        <SuperDebug data={$message} />
       {/if}
-      <Form.Button type="submit" class="w-full">Request Password</Form.Button>
-      {@render formTail?.()}
-    </form>
-    {#if login}
-      <div class="mt-4 text-center text-sm">
-        Remember your password?
-        <a href={loginLink} class="underline"> Sign in </a>
-      </div>
-    {/if}
-  </div>
-{/if}
+    </Card.Content>
+  </ForgotPasswordContainer>
+</ForgotPasswordProvider>

package/dist/lib/components/ui/forgot-password/forgot-password-form.svelte.d.ts

@@ -1,16 +1,21 @@
-import type { Snippet } from 'svelte';
+import type { Snippet } from "svelte";
+import { type Infer, type SuperForm, type SuperValidated } from "sveltekit-superforms";
+import { type ForgotPasswordSchema } from "./forgot-password.schema.js";
 interface Props {
-    superform: any;
+    superform?: SuperForm<Infer<ForgotPasswordSchema>> | null;
     card?: boolean;
-    cardClass?: string;
     title?: string;
     description?: string;
-    login?: boolean;
     loginLink?: string;
-    formTail?: Snippet;
-    formHead?: Snippet;
+    register?: boolean;
+    registerLink?: string;
+    lead?: Snippet;
+    tail?: Snippet;
     children?: Snippet;
+    form?: SuperValidated<Infer<ForgotPasswordSchema>>;
+    action?: string;
+    debug?: boolean;
 }
-declare const ForgotPasswordForm: import("svelte").Component<Props, {}, "">;
+declare const ForgotPasswordForm: import("svelte").Component<Props, {}, "superform">;
 type ForgotPasswordForm = ReturnType<typeof ForgotPasswordForm>;
 export default ForgotPasswordForm;

package/dist/lib/components/ui/forgot-password/forgot-password-header.svelte

@@ -0,0 +1,34 @@
+<script lang="ts">
+  import { Card } from '@tanglemedia/svelte-starter-ui-shadcn';
+  import type { Snippet } from 'svelte';
+
+  type LoginHeaderAttr = {
+    text?: string;
+    desc?: string;
+  };
+
+  type LoginHeaderProps = LoginHeaderAttr & {
+    title?: Snippet<[LoginHeaderAttr]>;
+    description?: Snippet<[LoginHeaderAttr]>;
+    children?: Snippet<[LoginHeaderAttr]>;
+  };
+
+  let { title, children, description, ...restProps }: LoginHeaderProps = $props();
+</script>
+
+<Card.Header>
+  <Card.Title class="text-2xl">
+    {#if title}
+      {@render title(restProps)}
+    {:else if children}
+      {@render children?.(restProps)}
+    {:else}
+      {restProps.text}
+    {/if}
+  </Card.Title>
+  {#if description}
+    <Card.Description>{@render description(restProps)}</Card.Description>
+  {:else if restProps.desc}
+    <Card.Description>{restProps.desc}</Card.Description>
+  {/if}
+</Card.Header>

package/dist/lib/components/ui/forgot-password/forgot-password-header.svelte.d.ts

@@ -0,0 +1,13 @@
+import type { Snippet } from 'svelte';
+type LoginHeaderAttr = {
+    text?: string;
+    desc?: string;
+};
+type LoginHeaderProps = LoginHeaderAttr & {
+    title?: Snippet<[LoginHeaderAttr]>;
+    description?: Snippet<[LoginHeaderAttr]>;
+    children?: Snippet<[LoginHeaderAttr]>;
+};
+declare const ForgotPasswordHeader: import("svelte").Component<LoginHeaderProps, {}, "">;
+type ForgotPasswordHeader = ReturnType<typeof ForgotPasswordHeader>;
+export default ForgotPasswordHeader;

package/dist/lib/components/ui/forgot-password/forgot-password-login.svelte

@@ -0,0 +1,19 @@
+<script lang="ts">
+  import { cn } from "../../../utils.js";
+  import type { Snippet } from "svelte";
+
+  type LoginForgotPasswordProps = {
+    href: string;
+    class?: string;
+    children?: Snippet;
+  };
+  const { href, class: cls, children }: LoginForgotPasswordProps = $props();
+</script>
+
+<a {href} class={cn("ml-auto inline-block text-sm underline", cls)}>
+  {#if children}
+    {@render children?.()}
+  {:else}
+    Back to login
+  {/if}
+</a>

package/dist/lib/components/ui/forgot-password/forgot-password-login.svelte.d.ts

@@ -0,0 +1,9 @@
+import type { Snippet } from "svelte";
+type LoginForgotPasswordProps = {
+    href: string;
+    class?: string;
+    children?: Snippet;
+};
+declare const ForgotPasswordLogin: import("svelte").Component<LoginForgotPasswordProps, {}, "">;
+type ForgotPasswordLogin = ReturnType<typeof ForgotPasswordLogin>;
+export default ForgotPasswordLogin;

package/dist/lib/components/ui/forgot-password/forgot-password-provider.svelte

@@ -0,0 +1,13 @@
+<script lang="ts" module>
+  type T = Record<string, unknown>;
+</script>
+
+<script lang="ts" generics="T extends Record<string, unknown>">
+  import {
+    Form,
+    type FormProviderProps,
+  } from "@tanglemedia/svelte-starter-form-shadcn";
+  let rest: FormProviderProps<T> = $props();
+</script>
+
+<Form.Provider {...rest} />

package/dist/lib/components/ui/forgot-password/forgot-password-provider.svelte.d.ts

@@ -0,0 +1,25 @@
+import { type FormProviderProps } from "@tanglemedia/svelte-starter-form-shadcn";
+declare function $$render<T extends Record<string, unknown>>(): {
+    props: FormProviderProps<T>;
+    exports: {};
+    bindings: "";
+    slots: {};
+    events: {};
+};
+declare class __sveltets_Render<T extends Record<string, unknown>> {
+    props(): ReturnType<typeof $$render<T>>['props'];
+    events(): ReturnType<typeof $$render<T>>['events'];
+    slots(): ReturnType<typeof $$render<T>>['slots'];
+    bindings(): "";
+    exports(): {};
+}
+interface $$IsomorphicComponent {
+    new <T extends Record<string, unknown>>(options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<T>['props']>>): import('svelte').SvelteComponent<ReturnType<__sveltets_Render<T>['props']>, ReturnType<__sveltets_Render<T>['events']>, ReturnType<__sveltets_Render<T>['slots']>> & {
+        $$bindings?: ReturnType<__sveltets_Render<T>['bindings']>;
+    } & ReturnType<__sveltets_Render<T>['exports']>;
+    <T extends Record<string, unknown>>(internal: unknown, props: ReturnType<__sveltets_Render<T>['props']> & {}): ReturnType<__sveltets_Render<T>['exports']>;
+    z_$$bindings?: ReturnType<__sveltets_Render<any>['bindings']>;
+}
+declare const ForgotPasswordProvider: $$IsomorphicComponent;
+type ForgotPasswordProvider<T extends Record<string, unknown>> = InstanceType<typeof ForgotPasswordProvider<T>>;
+export default ForgotPasswordProvider;

package/dist/lib/components/ui/forgot-password/forgot-password-submit.svelte

@@ -0,0 +1,17 @@
+<script lang="ts">
+  import { Form } from "@tanglemedia/svelte-starter-form-shadcn";
+  import type { Snippet } from "svelte";
+
+  type LoginSubmitProps = {
+    children?: Snippet;
+  };
+  const { children }: LoginSubmitProps = $props();
+</script>
+
+<Form.Submit class="w-full">
+  {#if children}
+    {@render children?.()}
+  {:else}
+    Submit
+  {/if}
+</Form.Submit>

package/dist/lib/components/ui/forgot-password/forgot-password-submit.svelte.d.ts

@@ -0,0 +1,7 @@
+import type { Snippet } from "svelte";
+type LoginSubmitProps = {
+    children?: Snippet;
+};
+declare const ForgotPasswordSubmit: import("svelte").Component<LoginSubmitProps, {}, "">;
+type ForgotPasswordSubmit = ReturnType<typeof ForgotPasswordSubmit>;
+export default ForgotPasswordSubmit;

package/dist/lib/components/ui/forgot-password/forgot-password-user-input.svelte

@@ -0,0 +1,21 @@
+<script lang="ts" module>
+  import { type FormPathLeaves as _FormPathLeaves } from 'sveltekit-superforms';
+
+  type T = Record<string, unknown>;
+  type U = _FormPathLeaves<T, any>;
+</script>
+
+<script
+  lang="ts"
+  generics="T extends Record<string, unknown>, U extends _FormPathLeaves<T, any>"
+>
+  import {
+    Field,
+    type InputFieldProps,
+  } from '@tanglemedia/svelte-starter-form-shadcn';
+
+  type LoginUserInputProps = InputFieldProps<T, U>;
+  const { name = 'email' as U,  label, ...rest }: LoginUserInputProps = $props();
+</script>
+
+<Field.Input type={'email'} {name} label={label || 'Email'} {...rest}></Field.Input>

package/dist/lib/components/ui/forgot-password/forgot-password-user-input.svelte.d.ts

@@ -0,0 +1,26 @@
+import { type FormPathLeaves as _FormPathLeaves } from 'sveltekit-superforms';
+import { type InputFieldProps } from '@tanglemedia/svelte-starter-form-shadcn';
+declare function $$render<T extends Record<string, unknown>, U extends _FormPathLeaves<T, any>>(): {
+    props: InputFieldProps<T, U>;
+    exports: {};
+    bindings: "";
+    slots: {};
+    events: {};
+};
+declare class __sveltets_Render<T extends Record<string, unknown>, U extends _FormPathLeaves<T, any>> {
+    props(): ReturnType<typeof $$render<T, U>>['props'];
+    events(): ReturnType<typeof $$render<T, U>>['events'];
+    slots(): ReturnType<typeof $$render<T, U>>['slots'];
+    bindings(): "";
+    exports(): {};
+}
+interface $$IsomorphicComponent {
+    new <T extends Record<string, unknown>, U extends _FormPathLeaves<T, any>>(options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<T, U>['props']>>): import('svelte').SvelteComponent<ReturnType<__sveltets_Render<T, U>['props']>, ReturnType<__sveltets_Render<T, U>['events']>, ReturnType<__sveltets_Render<T, U>['slots']>> & {
+        $$bindings?: ReturnType<__sveltets_Render<T, U>['bindings']>;
+    } & ReturnType<__sveltets_Render<T, U>['exports']>;
+    <T extends Record<string, unknown>, U extends _FormPathLeaves<T, any>>(internal: unknown, props: ReturnType<__sveltets_Render<T, U>['props']> & {}): ReturnType<__sveltets_Render<T, U>['exports']>;
+    z_$$bindings?: ReturnType<__sveltets_Render<any, any>['bindings']>;
+}
+declare const ForgotPasswordUserInput: $$IsomorphicComponent;
+type ForgotPasswordUserInput<T extends Record<string, unknown>, U extends _FormPathLeaves<T, any>> = InstanceType<typeof ForgotPasswordUserInput<T, U>>;
+export default ForgotPasswordUserInput;

package/dist/lib/components/ui/forgot-password/forgot-password.schema.d.ts

@@ -0,0 +1,5 @@
+import { z } from "zod";
+export declare const forgotPasswordSchema: z.ZodObject<{
+    username: z.ZodString;
+}, z.core.$strip>;
+export type ForgotPasswordSchema = typeof forgotPasswordSchema;

package/dist/lib/components/ui/forgot-password/forgot-password.schema.js

@@ -0,0 +1,4 @@
+import { z } from "zod";
+export const forgotPasswordSchema = z.object({
+    username: z.string().min(1, { message: "Username is required" }),
+});

package/dist/lib/components/ui/forgot-password/index.d.ts

@@ -1,2 +1,9 @@
-import ForgotPasswordForm from './forgot-password-form.svelte';
-export { ForgotPasswordForm };
+import Form from './forgot-password-form.svelte';
+import Provider from './forgot-password-provider.svelte';
+import Header from './forgot-password-header.svelte';
+import { forgotPasswordSchema as schema, type ForgotPasswordSchema } from './forgot-password.schema.ts';
+import Container from './forgot-password-container.svelte';
+import ForgotPasswordLogin from './forgot-password-login.svelte';
+import Submit from './forgot-password-submit.svelte';
+import UserInput from './forgot-password-user-input.svelte';
+export { Form, Provider, Header, Container, schema, ForgotPasswordLogin, Submit, UserInput, type ForgotPasswordSchema, };

package/dist/lib/components/ui/forgot-password/index.js

@@ -1,2 +1,9 @@
-import ForgotPasswordForm from './forgot-password-form.svelte';
-export { ForgotPasswordForm };
+import Form from './forgot-password-form.svelte';
+import Provider from './forgot-password-provider.svelte';
+import Header from './forgot-password-header.svelte';
+import { forgotPasswordSchema as schema } from "./forgot-password.schema.js";
+import Container from './forgot-password-container.svelte';
+import ForgotPasswordLogin from './forgot-password-login.svelte';
+import Submit from './forgot-password-submit.svelte';
+import UserInput from './forgot-password-user-input.svelte';
+export { Form, Provider, Header, Container, schema, ForgotPasswordLogin, Submit, UserInput, };

package/dist/lib/components/ui/index.d.ts

@@ -1,5 +1,5 @@
-export * from './auth-layout';
-export * from './login-form';
-export * from './register-form';
-export * from './reset-password';
-export * from './forgot-password';
+export * as Auth from './auth-layout/index.ts';
+export * as Login from './login-form/index.ts';
+export * as ForgotPassword from './forgot-password/index.ts';
+export * as Register from './register-form/index.ts';
+export * as ResetPassword from './reset-password/index.ts';

package/dist/lib/components/ui/index.js

@@ -1,5 +1,6 @@
-export * from './auth-layout';
-export * from './login-form';
-export * from './register-form';
-export * from './reset-password';
-export * from './forgot-password';
+export * as Auth from "./auth-layout/index.js";
+export * as Login from "./login-form/index.js";
+export * as ForgotPassword from "./forgot-password/index.js";
+export * as Register from "./register-form/index.js";
+export * as ResetPassword from "./reset-password/index.js";
+// export * from './forgot-password/index.ts';

package/dist/lib/components/ui/login-form/index.d.ts

@@ -1,2 +1,11 @@
-import LoginForm from './login-form.svelte';
-export { LoginForm };
+import Form from './login-form.svelte';
+import Provider from './login-provider.svelte';
+import Header from './login-header.svelte';
+import { loginSchema as schema, type LoginSchema } from './login.schema.ts';
+import Container from './login-container.svelte';
+import ForgotPasswordLink from './login-forgot-password.svelte';
+import Submit from './login-submit.svelte';
+import UserInput from './login-user-input.svelte';
+import PasswordInput from './login-password-input.svelte';
+export * from './login-context.ts';
+export { Form, Provider, Header, Container, schema, ForgotPasswordLink, Submit, UserInput, PasswordInput, type LoginSchema, };

package/dist/lib/components/ui/login-form/index.js

@@ -1,2 +1,13 @@
-import LoginForm from './login-form.svelte';
-export { LoginForm };
+import Form from './login-form.svelte';
+import Provider from './login-provider.svelte';
+import Header from './login-header.svelte';
+import { loginSchema as schema } from "./login.schema.js";
+import Container from './login-container.svelte';
+import ForgotPasswordLink from './login-forgot-password.svelte';
+import Submit from './login-submit.svelte';
+import UserInput from './login-user-input.svelte';
+import PasswordInput from './login-password-input.svelte';
+// import { Field } from '@tanglemedia/svelte-starter-form-shadcn';
+export * from "./login-context.js";
+// const PasswordField = Field.PasswordField;
+export { Form, Provider, Header, Container, schema, ForgotPasswordLink, Submit, UserInput, PasswordInput, };

package/dist/lib/components/ui/login-form/login-container.svelte

@@ -0,0 +1,27 @@
+<script lang="ts">
+  import { Card } from '@tanglemedia/svelte-starter-ui-shadcn';
+  import type { WithChild } from 'svelte-toolbelt';
+  import { cn } from '../../../utils.js';
+
+  type LoginContainerProps = Omit<WithChild, 'child'> & {
+    class?: string;
+    card?: boolean;
+  };
+
+  const {
+    children,
+    class: cls,
+    card = true,
+    ...rest
+  }: LoginContainerProps = $props();
+</script>
+
+{#if !card}
+  <div class={cn('mx-auto max-w-sm', cls)} {...rest}>
+    {@render children?.()}
+  </div>
+{:else}
+  <Card.Root class={cn('mx-auto max-w-sm', cls)} {...rest}>
+    {@render children?.()}
+  </Card.Root>
+{/if}

package/dist/lib/components/ui/login-form/login-container.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { WithChild } from 'svelte-toolbelt';
+type LoginContainerProps = Omit<WithChild, 'child'> & {
+    class?: string;
+    card?: boolean;
+};
+declare const LoginContainer: import("svelte").Component<LoginContainerProps, {}, "">;
+type LoginContainer = ReturnType<typeof LoginContainer>;
+export default LoginContainer;

package/dist/lib/components/ui/login-form/login-context.d.ts

@@ -0,0 +1,2 @@
+import { useForm } from '@tanglemedia/svelte-starter-form-shadcn';
+export { useForm };

package/dist/lib/components/ui/login-form/login-context.js

@@ -0,0 +1,13 @@
+import { useForm } from '@tanglemedia/svelte-starter-form-shadcn';
+export { useForm };
+// import { getContext, setContext } from 'svelte';
+// import type { SuperForm } from 'sveltekit-superforms';
+// const ctx = '--auth-superform';
+// export function setForm<T extends Record<string, unknown>>(
+//   superform: SuperForm<T>
+// ) {
+//   setContext(ctx, superform);
+// }
+// export function useForm<T extends Record<string, unknown>>() {
+//   return getContext<SuperForm<T>>(ctx);
+// }

package/dist/lib/components/ui/login-form/login-forgot-password.svelte

@@ -0,0 +1,19 @@
+<script lang="ts">
+  import { cn } from "../../../utils.js";
+  import type { Snippet } from "svelte";
+
+  type LoginForgotPasswordProps = {
+    href: string;
+    class?: string;
+    children?: Snippet;
+  };
+  const { href, class: cls, children }: LoginForgotPasswordProps = $props();
+</script>
+
+<a {href} class={cn("ml-auto inline-block text-sm underline", cls)}>
+  {#if children}
+    {@render children?.()}
+  {:else}
+    Forgot your password?
+  {/if}
+</a>