yaxa-svelte 1.13.1 → 1.14.0

package/README.md

@@ -216,10 +216,10 @@ export const POST = createPolarWebhookHandler();
 
 | Subpath                | Description                                                                                                                               |
 | :--------------------- | :---------------------------------------------------------------------------------------------------------------------------------------- |
-| `yaxa-svelte`          | Core UI Primitives, SEO Components, `<Gate />`, Theme System & Composables (`useGate`, `useUpload`, `useAuth`, `useClipboard`, etc.)      |
+| `yaxa-svelte`          | Core UI Primitives, SEO Components, `<Gate />`, Theme System & Composables (`useGate`, `useUpload`, `useToast`, `useClipboard`, etc.)     |
 | `yaxa-svelte/admin`    | Drizzle ORM Schema Introspection, `<AdminDashboard />`, `createYaxaAdminHook`, `createDrizzleAdmin`, `<DevSandbox />`, `<RecordDrawer />` |
 | `yaxa-svelte/server`   | Universal Server Hooks, SEO endpoints, Drizzle DB drivers, Cloud Storage handlers, and Email dispatch                                     |
-| `yaxa-svelte/auth`     | Better-Auth integration and protected route server guards (`createYaxaAuth`, `createYaxaAuthHook`)                                        |
+| `yaxa-svelte/auth`     | Better-Auth client & server integration (`useAuth`, `<AuthCard />`, `<PasskeyUI />`, `<TwoFactorModal />`, `createYaxaAuth`)              |
 | `yaxa-svelte/db`       | Multi-dialect Drizzle ORM clients & schemas for Neon (PostgreSQL) and Turso (SQLite/LibSQL)                                               |
 | `yaxa-svelte/polar`    | Polar.sh billing, customer portal sessions, and webhook synchronization                                                                   |
 | `yaxa-svelte/email`    | Resend transactional email templates with automatic development console fallback                                                          |

package/dist/actions/infiniteScroll.js

@@ -1,4 +1,4 @@
-import { browser } from '$app/environment';
+import { browser } from '$app/env';
 /**
  * Headless Svelte Action to trigger loading callbacks when scrolling near the edges.
  *

package/dist/admin/handler.d.ts

@@ -39,8 +39,8 @@ export declare class DrizzleAdminService {
  * Example:
  * ```ts
  * // src/routes/admin/+page.server.ts
- * import { db } from '../server/db';
- * import * as schema from '../server/db/schema-pg';
+ * import { db } from '#lib/server/db/index.js';
+ * import * as schema from '#lib/server/db/schema-pg.js';
  * import { createDrizzleAdmin } from 'yaxa-svelte/admin';
  *
  * export const { load, actions } = createDrizzleAdmin({ db, schema });

package/dist/admin/handler.js

@@ -232,8 +232,8 @@ export class DrizzleAdminService {
  * Example:
  * ```ts
  * // src/routes/admin/+page.server.ts
- * import { db } from '../server/db';
- * import * as schema from '../server/db/schema-pg';
+ * import { db } from '#lib/server/db/index.js';
+ * import * as schema from '#lib/server/db/schema-pg.js';
  * import { createDrizzleAdmin } from 'yaxa-svelte/admin';
  *
  * export const { load, actions } = createDrizzleAdmin({ db, schema });

package/dist/admin/hook.d.ts

@@ -1,4 +1,4 @@
-import type { Handle } from '@sveltejs/kit';
+import type { Handle } from '@sveltejs/kit/hooks';
 import type { YaxaAdminHookOptions } from './types';
 /**
  * Creates a SvelteKit Handle hook for zero-file route interception and automatic Drizzle admin dashboard.
@@ -8,8 +8,8 @@ import type { YaxaAdminHookOptions } from './types';
  * // src/hooks.server.ts
  * import { sequence } from '@sveltejs/kit/hooks';
  * import { createYaxaAdminHook } from 'yaxa-svelte/admin';
- * import { db } from '../server/db';
- * import * as schema from '../server/db/schema-pg';
+ * import { db } from '#lib/server/db/index.js';
+ * import * as schema from '#lib/server/db/schema-pg.js';
  *
  * export const handle = sequence(
  *   createYaxaAdminHook({ db, schema, path: '/admin' })

package/dist/admin/hook.js

@@ -9,8 +9,8 @@ import { createPresignedUploadUrl } from '../server/storage/index';
  * // src/hooks.server.ts
  * import { sequence } from '@sveltejs/kit/hooks';
  * import { createYaxaAdminHook } from 'yaxa-svelte/admin';
- * import { db } from '../server/db';
- * import * as schema from '../server/db/schema-pg';
+ * import { db } from '#lib/server/db/index.js';
+ * import * as schema from '#lib/server/db/schema-pg.js';
  *
  * export const handle = sequence(
  *   createYaxaAdminHook({ db, schema, path: '/admin' })
@@ -172,8 +172,8 @@ function renderAdminHtml(data, title, adminPath) {
   <meta charset="utf-8" />
   <meta name="viewport" content="width=device-width, initial-scale=1" />
   <title>${title}</title>
-  <script src="https://cdn.tailwindcss.com"></script>
-  <script>
+  <${'script'} src="https://cdn.tailwindcss.com"></${'script'}>
+  <${'script'}>
     tailwind.config = {
       darkMode: 'class',
       theme: {
@@ -188,8 +188,8 @@ function renderAdminHtml(data, title, adminPath) {
           }
         }
       }
-    }
-  </script>
+    };
+  </${'script'}>
 </head>
 <body class="bg-neutral-950 text-neutral-100 antialiased min-h-screen font-sans">
   <div class="flex h-14 items-center justify-between border-b border-neutral-800 bg-neutral-900/90 px-6 backdrop-blur">

package/dist/auth/index.d.ts

@@ -1,3 +1,7 @@
 export { default as AuthCard } from '../components/saas/AuthCard.svelte';
+export type { AuthCardMode } from '../components/saas/AuthCard.svelte';
+export { default as PasskeyUI, passkeyUiVariants } from '../components/saas/PasskeyUI.svelte';
+export type { PasskeyUiProps } from '../components/saas/PasskeyUI.svelte';
+export { default as TwoFactorModal } from '../components/saas/TwoFactorModal.svelte';
 export { useAuth } from '../composables/useAuth.svelte';
-export type { UseAuthOptions, SocialProvider } from '../composables/useAuth.svelte';
+export type { UseAuthOptions, SocialProvider, PasskeyInfo } from '../composables/useAuth.svelte';

package/dist/auth/index.js

@@ -1,3 +1,5 @@
 // Yaxa SaaS Auth Suite (Better-Auth integration for Svelte 5 & SvelteKit)
 export { default as AuthCard } from '../components/saas/AuthCard.svelte';
+export { default as PasskeyUI, passkeyUiVariants } from '../components/saas/PasskeyUI.svelte';
+export { default as TwoFactorModal } from '../components/saas/TwoFactorModal.svelte';
 export { useAuth } from '../composables/useAuth.svelte';

package/dist/components/ai/AiChat.svelte

@@ -49,7 +49,7 @@
 	import PromptBar from './PromptBar.svelte';
 	import AiThought from './AiThought.svelte';
 	import AiToolCall from './AiToolCall.svelte';
-	import { useToast } from '../../composables/useToast.svelte';
+	import { useToast } from '#lib/composables/useToast.svelte.js';
 
 	let {
 		messages = [],

package/dist/components/ai/PromptBar.svelte

@@ -22,7 +22,7 @@
 </script>
 
 <script lang="ts">
-	import { autosize } from '../../actions';
+	import { autosize } from '#lib/actions/index.js';
 	import Button from '../elements/Button.svelte';
 	import Icon from '../elements/Icon.svelte';
 

package/dist/components/blocks/FAQ.svelte

@@ -1,5 +1,5 @@
 <script module lang="ts">
-	import { tv, type VariantProps } from '../../utils/cn';
+	import { tv, type VariantProps } from '#lib/utils/cn.js';
 
 	export interface FAQItem {
 		id: string | number;

package/dist/components/blocks/FAQ.svelte.d.ts

@@ -1,4 +1,4 @@
-import { type VariantProps } from '../../utils/cn';
+import { type VariantProps } from '#lib/utils/cn.js';
 export interface FAQItem {
     id: string | number;
     question: string;

package/dist/components/blocks/FeatureGrid.svelte

@@ -1,5 +1,5 @@
 <script module lang="ts">
-	import { tv, type VariantProps } from '../../utils/cn';
+	import { tv, type VariantProps } from '#lib/utils/cn.js';
 	import type { IconSource } from '../elements/Icon.svelte';
 
 	export interface FeatureItem {

package/dist/components/blocks/FeatureGrid.svelte.d.ts

@@ -1,4 +1,4 @@
-import { type VariantProps } from '../../utils/cn';
+import { type VariantProps } from '#lib/utils/cn.js';
 import type { IconSource } from '../elements/Icon.svelte';
 export interface FeatureItem {
     id: string | number;

package/dist/components/blocks/Testimonials.svelte

@@ -1,5 +1,5 @@
 <script module lang="ts">
-	import { tv, type VariantProps } from '../../utils/cn';
+	import { tv, type VariantProps } from '#lib/utils/cn.js';
 
 	export interface TestimonialItem {
 		id: string | number;

package/dist/components/blocks/Testimonials.svelte.d.ts

@@ -1,4 +1,4 @@
-import { type VariantProps } from '../../utils/cn';
+import { type VariantProps } from '#lib/utils/cn.js';
 export interface TestimonialItem {
     id: string | number;
     quote: string;

package/dist/components/elements/Avatar.svelte

@@ -1,5 +1,5 @@
 <script module lang="ts">
-	import { tv, type VariantProps } from '../../utils/cn';
+	import { tv, type VariantProps } from '#lib/utils/cn.js';
 
 	export const avatarVariants = tv({
 		base: 'relative inline-flex shrink-0 items-center justify-center font-medium select-none overflow-hidden rounded-full bg-neutral-200 text-neutral-700 dark:bg-neutral-800 dark:text-neutral-300',

package/dist/components/elements/Avatar.svelte.d.ts

@@ -1,4 +1,4 @@
-import { type VariantProps } from '../../utils/cn';
+import { type VariantProps } from '#lib/utils/cn.js';
 export declare const avatarVariants: import("tailwind-variants").TVReturnType<{
     size: {
         xs: "h-6 w-6 text-[10px]";

package/dist/components/elements/Badge.svelte

@@ -1,5 +1,5 @@
 <script module lang="ts">
-	import { tv, type VariantProps } from '../../utils/cn';
+	import { tv, type VariantProps } from '#lib/utils/cn.js';
 	import type { Snippet } from 'svelte';
 	import type { IconSource } from './Icon.svelte';
 

package/dist/components/elements/Badge.svelte.d.ts

@@ -1,4 +1,4 @@
-import { type VariantProps } from '../../utils/cn';
+import { type VariantProps } from '#lib/utils/cn.js';
 import type { Snippet } from 'svelte';
 import type { IconSource } from './Icon.svelte';
 export declare const badgeVariants: import("tailwind-variants").TVReturnType<{

package/dist/components/elements/Button.svelte

@@ -1,5 +1,5 @@
 <script module lang="ts">
-	import { tv, type VariantProps } from '../../utils/cn';
+	import { tv, type VariantProps } from '#lib/utils/cn.js';
 	import type { Snippet } from 'svelte';
 	import type { HTMLButtonAttributes, HTMLAnchorAttributes } from 'svelte/elements';
 	import type { IconSource } from './Icon.svelte';

package/dist/components/elements/Button.svelte.d.ts

@@ -1,4 +1,4 @@
-import { type VariantProps } from '../../utils/cn';
+import { type VariantProps } from '#lib/utils/cn.js';
 import type { Snippet } from 'svelte';
 import type { IconSource } from './Icon.svelte';
 export declare const buttonVariants: import("tailwind-variants").TVReturnType<{

package/dist/components/elements/Carousel.svelte

@@ -1,5 +1,5 @@
 <script module lang="ts">
-	import { tv, type VariantProps } from '../../utils/cn';
+	import { tv, type VariantProps } from '#lib/utils/cn.js';
 	import type { Snippet } from 'svelte';
 
 	export const carouselVariants = tv({

package/dist/components/elements/Carousel.svelte.d.ts

@@ -1,10 +1,10 @@
-import { type VariantProps } from '../../utils/cn';
+import { type VariantProps } from '#lib/utils/cn.js';
 import type { Snippet } from 'svelte';
 export declare const carouselVariants: import("tailwind-variants").TVReturnType<{
     [key: string]: {
         [key: string]: import("tailwind-variants").ClassValue | {
-            root?: import("tailwind-variants").ClassValue;
             viewport?: import("tailwind-variants").ClassValue;
+            root?: import("tailwind-variants").ClassValue;
             slide?: import("tailwind-variants").ClassValue;
             controls?: import("tailwind-variants").ClassValue;
             arrowBtn?: import("tailwind-variants").ClassValue;
@@ -15,8 +15,8 @@ export declare const carouselVariants: import("tailwind-variants").TVReturnType<
 } | {
     [x: string]: {
         [x: string]: import("tailwind-variants").ClassValue | {
-            root?: import("tailwind-variants").ClassValue;
             viewport?: import("tailwind-variants").ClassValue;
+            root?: import("tailwind-variants").ClassValue;
             slide?: import("tailwind-variants").ClassValue;
             controls?: import("tailwind-variants").ClassValue;
             arrowBtn?: import("tailwind-variants").ClassValue;
@@ -35,8 +35,8 @@ export declare const carouselVariants: import("tailwind-variants").TVReturnType<
 }, undefined, {
     [key: string]: {
         [key: string]: import("tailwind-variants").ClassValue | {
-            root?: import("tailwind-variants").ClassValue;
             viewport?: import("tailwind-variants").ClassValue;
+            root?: import("tailwind-variants").ClassValue;
             slide?: import("tailwind-variants").ClassValue;
             controls?: import("tailwind-variants").ClassValue;
             arrowBtn?: import("tailwind-variants").ClassValue;

package/dist/components/elements/CodeBlock.svelte

@@ -243,7 +243,7 @@
 <script lang="ts">
 	import Button from './Button.svelte';
 	import Icon from './Icon.svelte';
-	import { useToast } from '../../composables/useToast.svelte';
+	import { useToast } from '#lib/composables/useToast.svelte.js';
 
 	let {
 		code,

package/dist/components/elements/CodeDiff.svelte

@@ -156,7 +156,7 @@
 	import Button from './Button.svelte';
 	import Icon from './Icon.svelte';
 	import Badge from './Badge.svelte';
-	import { useToast } from '../../composables/useToast.svelte';
+	import { useToast } from '#lib/composables/useToast.svelte.js';
 
 	let {
 		original = '',

package/dist/components/elements/CodeDiff.test.js

@@ -1,5 +1,5 @@
 import { describe, it, expect } from 'vitest';
-import { renderComponent } from '../../testing';
+import { renderComponent } from '#lib/testing/index.js';
 import CodeDiff, { computeDiff } from './CodeDiff.svelte';
 describe('CodeDiff Component & Diff Algorithm', () => {
     it('should correctly compute line additions, deletions, and unchanged lines', () => {
@@ -36,8 +36,8 @@ describe('CodeDiff Component & Diff Algorithm', () => {
         cleanup();
     });
     it('should render split side-by-side mode', () => {
-        const original = `<script>\n  export let name = 'world';\n</script>`;
-        const modified = `<script>\n  let { name = 'world' } = $props();\n</script>`;
+        const original = `<${'script'}>\n  export let name = 'world';\n</${'script'}>`;
+        const modified = `<${'script'}>\n  let { name = 'world' } = $props();\n</${'script'}>`;
         const { target, cleanup } = renderComponent(CodeDiff, {
             original,
             modified,

package/dist/components/elements/DataTable.dom.test.js

@@ -1,6 +1,6 @@
 import { describe, it, expect, vi } from 'vitest';
 import { flushSync } from 'svelte';
-import { renderComponent } from '../../testing';
+import { renderComponent } from '#lib/testing/index.js';
 import DataTable, {} from './DataTable.svelte';
 const testData = [
     { id: '1', name: 'Alice Smith', role: 'Engineer', score: 95 },

package/dist/components/elements/EmptyState.svelte

@@ -1,5 +1,5 @@
 <script module lang="ts">
-	import { tv, type VariantProps } from '../../utils/cn';
+	import { tv, type VariantProps } from '#lib/utils/cn.js';
 	import type { Snippet } from 'svelte';
 	import type { IconSource } from './Icon.svelte';
 

package/dist/components/elements/EmptyState.svelte.d.ts

@@ -1,4 +1,4 @@
-import { type VariantProps } from '../../utils/cn';
+import { type VariantProps } from '#lib/utils/cn.js';
 import type { Snippet } from 'svelte';
 import type { IconSource } from './Icon.svelte';
 export declare const emptyStateVariants: import("tailwind-variants").TVReturnType<{

package/dist/components/elements/Icon.svelte

@@ -1,5 +1,5 @@
 <script module lang="ts">
-	import { tv } from '../../utils/cn';
+	import { tv } from '#lib/utils/cn.js';
 	import type { Component, Snippet } from 'svelte';
 
 	export const iconVariants = tv({

package/dist/components/elements/Icon.test.js

@@ -1,5 +1,5 @@
 import { describe, it, expect } from 'vitest';
-import { renderComponent } from '../../testing';
+import { renderComponent } from '#lib/testing/index.js';
 import Icon from './Icon.svelte';
 describe('Icon Component', () => {
     it('renders built-in SVG icons by string name', () => {

package/dist/components/elements/Kbd.svelte

@@ -1,5 +1,5 @@
 <script module lang="ts">
-	import { tv, type VariantProps } from '../../utils/cn';
+	import { tv, type VariantProps } from '#lib/utils/cn.js';
 	import type { Snippet } from 'svelte';
 
 	export const kbdVariants = tv({

package/dist/components/elements/Kbd.svelte.d.ts

@@ -1,4 +1,4 @@
-import { type VariantProps } from '../../utils/cn';
+import { type VariantProps } from '#lib/utils/cn.js';
 import type { Snippet } from 'svelte';
 export declare const kbdVariants: import("tailwind-variants").TVReturnType<{
     size: {

package/dist/components/elements/MetricCard.svelte

@@ -3,7 +3,7 @@
 	import Icon, { type IconSource } from './Icon.svelte';
 	import Badge from './Badge.svelte';
 	import Skeleton from './Skeleton.svelte';
-	import { cn } from '../../utils/cn';
+	import { cn } from '#lib/utils/cn.js';
 
 	interface Props {
 		title: string;

package/dist/components/elements/Progress.svelte

@@ -1,5 +1,5 @@
 <script module lang="ts">
-	import { tv, type VariantProps } from '../../utils/cn';
+	import { tv, type VariantProps } from '#lib/utils/cn.js';
 
 	export const progressVariants = tv({
 		base: 'relative w-full overflow-hidden rounded-full bg-neutral-200 dark:bg-neutral-800',

package/dist/components/elements/Progress.svelte.d.ts

@@ -1,4 +1,4 @@
-import { type VariantProps } from '../../utils/cn';
+import { type VariantProps } from '#lib/utils/cn.js';
 export declare const progressVariants: import("tailwind-variants").TVReturnType<{
     size: {
         xs: "h-1";

package/dist/components/elements/Skeleton.svelte

@@ -1,5 +1,5 @@
 <script module lang="ts">
-	import { tv, type VariantProps } from '../../utils/cn';
+	import { tv, type VariantProps } from '#lib/utils/cn.js';
 
 	export const skeletonVariants = tv({
 		base: 'relative overflow-hidden bg-neutral-200 dark:bg-neutral-800 select-none',

package/dist/components/elements/Skeleton.svelte.d.ts

@@ -1,4 +1,4 @@
-import { type VariantProps } from '../../utils/cn';
+import { type VariantProps } from '#lib/utils/cn.js';
 export declare const skeletonVariants: import("tailwind-variants").TVReturnType<{
     variant: {
         pulse: "animate-pulse";

package/dist/components/elements/Skeleton.test.js

@@ -1,5 +1,5 @@
 import { describe, it, expect } from 'vitest';
-import { renderComponent } from '../../testing';
+import { renderComponent } from '#lib/testing/index.js';
 import Skeleton, { skeletonVariants } from './Skeleton.svelte';
 describe('Skeleton Component (DOM & Variants)', () => {
     it('generates pulse animation classes by default', () => {

package/dist/components/elements/SortableList.svelte

@@ -11,7 +11,7 @@
 <script lang="ts" generics="T extends Record<string, any> | string | number">
 	import type { Snippet } from 'svelte';
 	import Icon from './Icon.svelte';
-	import { useSortable } from '../../composables/useSortable.svelte';
+	import { useSortable } from '#lib/composables/useSortable.svelte.js';
 
 	interface Props extends SortableListProps<T> {
 		children?: Snippet<

package/dist/components/elements/Terminal.svelte

@@ -1,5 +1,5 @@
 <script module lang="ts">
-	import { tv, type VariantProps } from '../../utils/cn';
+	import { tv, type VariantProps } from '#lib/utils/cn.js';
 
 	export interface TerminalLine {
 		command?: string;
@@ -22,7 +22,7 @@
 
 <script lang="ts">
 	import Icon from './Icon.svelte';
-	import { useClipboard } from '../../composables/useClipboard.svelte';
+	import { useClipboard } from '#lib/composables/useClipboard.svelte.js';
 
 	let {
 		title = 'bash',

package/dist/components/elements/Terminal.svelte.d.ts

@@ -1,4 +1,4 @@
-import { type VariantProps } from '../../utils/cn';
+import { type VariantProps } from '#lib/utils/cn.js';
 export interface TerminalLine {
     command?: string;
     output?: string;

package/dist/components/elements/Timeline.svelte

@@ -1,5 +1,5 @@
 <script module lang="ts">
-	import { tv, type VariantProps } from '../../utils/cn';
+	import { tv, type VariantProps } from '#lib/utils/cn.js';
 	import type { Snippet } from 'svelte';
 	import type { IconSource } from './Icon.svelte';
 

package/dist/components/elements/Timeline.svelte.d.ts

@@ -1,4 +1,4 @@
-import { type VariantProps } from '../../utils/cn';
+import { type VariantProps } from '#lib/utils/cn.js';
 import type { Snippet } from 'svelte';
 import type { IconSource } from './Icon.svelte';
 export interface TimelineItem {

package/dist/components/elements/Tree.svelte

@@ -1,5 +1,5 @@
 <script module lang="ts">
-	import { tv, type VariantProps } from '../../utils/cn';
+	import { tv, type VariantProps } from '#lib/utils/cn.js';
 	import type { IconSource } from './Icon.svelte';
 
 	export interface TreeNode {

package/dist/components/elements/Tree.svelte.d.ts

@@ -1,4 +1,4 @@
-import { type VariantProps } from '../../utils/cn';
+import { type VariantProps } from '#lib/utils/cn.js';
 import type { IconSource } from './Icon.svelte';
 export interface TreeNode {
     id: string;

package/dist/components/elements/VirtualList.svelte

@@ -1,5 +1,5 @@
 <script module lang="ts">
-	import { tv, type VariantProps } from '../../utils/cn';
+	import { tv, type VariantProps } from '#lib/utils/cn.js';
 	import type { Snippet } from 'svelte';
 
 	export const virtualListVariants = tv({

package/dist/components/elements/VirtualList.svelte.d.ts

@@ -1,4 +1,4 @@
-import { type VariantProps } from '../../utils/cn';
+import { type VariantProps } from '#lib/utils/cn.js';
 import type { Snippet } from 'svelte';
 export declare const virtualListVariants: import("tailwind-variants").TVReturnType<{
     bordered: {

package/dist/components/forms/Combobox.dom.test.js

@@ -1,5 +1,5 @@
 import { describe, it, expect } from 'vitest';
-import { renderComponent } from '../../testing';
+import { renderComponent } from '#lib/testing/index.js';
 import Combobox, { comboboxVariants } from './Combobox.svelte';
 const testOptions = [
     { value: 'svelte', label: 'Svelte 5' },

package/dist/components/forms/Combobox.svelte

@@ -1,5 +1,5 @@
 <script module lang="ts">
-	import { tv, type VariantProps } from '../../utils/cn';
+	import { tv, type VariantProps } from '#lib/utils/cn.js';
 	import type { Snippet } from 'svelte';
 	import type { IconSource } from '../elements/Icon.svelte';
 

package/dist/components/forms/Combobox.svelte.d.ts

@@ -1,4 +1,4 @@
-import { type VariantProps } from '../../utils/cn';
+import { type VariantProps } from '#lib/utils/cn.js';
 import type { Snippet } from 'svelte';
 import type { IconSource } from '../elements/Icon.svelte';
 export interface ComboboxOption {

package/dist/components/forms/DatePicker.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
 	import { Popover } from 'bits-ui';
 	import Icon from '../elements/Icon.svelte';
-	import { cn } from '../../utils/cn';
+	import { cn } from '#lib/utils/cn.js';
 
 	export interface DatePreset {
 		label: string;

package/dist/components/forms/DateRangePicker.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
 	import { Popover } from 'bits-ui';
 	import Icon from '../elements/Icon.svelte';
-	import { cn } from '../../utils/cn';
+	import { cn } from '#lib/utils/cn.js';
 
 	export interface DateRange {
 		start?: string | Date;

package/dist/components/forms/Dropzone.svelte

@@ -24,7 +24,7 @@
 	import Icon from '../elements/Icon.svelte';
 	import Button from '../elements/Button.svelte';
 	import Progress from '../elements/Progress.svelte';
-	import { useUpload } from '../../composables/useUpload.svelte';
+	import { useUpload } from '#lib/composables/useUpload.svelte.js';
 
 	let {
 		id,

package/dist/components/forms/Form.dom.test.js

@@ -1,5 +1,5 @@
 import { describe, it, expect } from 'vitest';
-import { renderComponent } from '../../testing';
+import { renderComponent } from '#lib/testing/index.js';
 import Form from './Form.svelte';
 import FormField from './FormField.svelte';
 describe('Form & FormField Components with Context Auto-Wiring', () => {

package/dist/components/forms/Input.svelte

@@ -1,5 +1,5 @@
 <script module lang="ts">
-	import { tv, type VariantProps } from '../../utils/cn';
+	import { tv, type VariantProps } from '#lib/utils/cn.js';
 	import type { Snippet } from 'svelte';
 	import type { HTMLInputAttributes } from 'svelte/elements';
 	import type { IconSource } from '../elements/Icon.svelte';

package/dist/components/forms/Input.svelte.d.ts

@@ -1,4 +1,4 @@
-import { type VariantProps } from '../../utils/cn';
+import { type VariantProps } from '#lib/utils/cn.js';
 import type { Snippet } from 'svelte';
 import type { HTMLInputAttributes } from 'svelte/elements';
 import type { IconSource } from '../elements/Icon.svelte';

package/dist/components/forms/InputOTP.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import { cn } from '../../utils/cn';
+	import { cn } from '#lib/utils/cn.js';
 	import { getFormFieldContext } from './form-context';
 
 	interface Props {

package/dist/components/forms/InputOTP.test.js

@@ -1,5 +1,5 @@
 import { describe, it, expect } from 'vitest';
-import { renderComponent } from '../../testing';
+import { renderComponent } from '#lib/testing/index.js';
 import InputOTP from './InputOTP.svelte';
 describe('InputOTP Component (DOM & Interactions)', () => {
     it('renders specified number of input slots with aria-labels', () => {

package/dist/components/forms/MultiSelect.svelte

@@ -1,5 +1,5 @@
 <script module lang="ts">
-	import { tv, type VariantProps } from '../../utils/cn';
+	import { tv, type VariantProps } from '#lib/utils/cn.js';
 	import type { IconSource } from '../elements/Icon.svelte';
 
 	export interface MultiSelectOption {

package/dist/components/forms/MultiSelect.svelte.d.ts

@@ -1,4 +1,4 @@
-import { type VariantProps } from '../../utils/cn';
+import { type VariantProps } from '#lib/utils/cn.js';
 import type { IconSource } from '../elements/Icon.svelte';
 export interface MultiSelectOption {
     value: string;