svelte-docsmith 0.1.0

package/dist/ui/shadcn/sheet/sheet-content.svelte

@@ -0,0 +1,55 @@
+<script lang="ts" module>
+	export type Side = 'top' | 'right' | 'bottom' | 'left';
+</script>
+
+<script lang="ts">
+	import { Dialog as SheetPrimitive } from 'bits-ui';
+	import type { Snippet } from 'svelte';
+	import SheetPortal from './sheet-portal.svelte';
+	import SheetOverlay from './sheet-overlay.svelte';
+	import { Button } from '../button/index.js';
+	import XIcon from '@lucide/svelte/icons/x';
+	import { cn, type WithoutChildrenOrChild } from '../../../shadcn.js';
+	import type { ComponentProps } from 'svelte';
+
+	let {
+		ref = $bindable(null),
+		class: className,
+		side = 'right',
+		showCloseButton = true,
+		portalProps,
+		children,
+		...restProps
+	}: WithoutChildrenOrChild<SheetPrimitive.ContentProps> & {
+		portalProps?: WithoutChildrenOrChild<ComponentProps<typeof SheetPortal>>;
+		side?: Side;
+		showCloseButton?: boolean;
+		children: Snippet;
+	} = $props();
+</script>
+
+<SheetPortal {...portalProps}>
+	<SheetOverlay />
+	<SheetPrimitive.Content
+		bind:ref
+		data-slot="sheet-content"
+		data-side={side}
+		class={cn(
+			'bg-popover text-popover-foreground fixed z-50 flex flex-col gap-4 bg-clip-padding text-sm shadow-lg transition duration-200 ease-in-out data-[side=bottom]:inset-x-0 data-[side=bottom]:bottom-0 data-[side=bottom]:h-auto data-[side=bottom]:border-t data-[side=left]:inset-y-0 data-[side=left]:left-0 data-[side=left]:h-full data-[side=left]:w-3/4 data-[side=left]:border-r data-[side=right]:inset-y-0 data-[side=right]:right-0 data-[side=right]:h-full data-[side=right]:w-3/4 data-[side=right]:border-l data-[side=top]:inset-x-0 data-[side=top]:top-0 data-[side=top]:h-auto data-[side=top]:border-b data-[side=left]:sm:max-w-sm data-[side=right]:sm:max-w-sm data-open:animate-in data-open:fade-in-0 data-[side=bottom]:data-open:slide-in-from-bottom-10 data-[side=left]:data-open:slide-in-from-left-10 data-[side=right]:data-open:slide-in-from-right-10 data-[side=top]:data-open:slide-in-from-top-10 data-closed:animate-out data-closed:fade-out-0 data-[side=bottom]:data-closed:slide-out-to-bottom-10 data-[side=left]:data-closed:slide-out-to-left-10 data-[side=right]:data-closed:slide-out-to-right-10 data-[side=top]:data-closed:slide-out-to-top-10',
+			className
+		)}
+		{...restProps}
+	>
+		{@render children?.()}
+		{#if showCloseButton}
+			<SheetPrimitive.Close data-slot="sheet-close">
+				{#snippet child({ props })}
+					<Button variant="ghost" class="absolute top-4 right-4" size="icon-sm" {...props}>
+						<XIcon />
+						<span class="sr-only">Close</span>
+					</Button>
+				{/snippet}
+			</SheetPrimitive.Close>
+		{/if}
+	</SheetPrimitive.Content>
+</SheetPortal>

package/dist/ui/shadcn/sheet/sheet-content.svelte.d.ts

@@ -0,0 +1,15 @@
+export type Side = 'top' | 'right' | 'bottom' | 'left';
+import { Dialog as SheetPrimitive } from 'bits-ui';
+import type { Snippet } from 'svelte';
+import SheetPortal from './sheet-portal.svelte';
+import { type WithoutChildrenOrChild } from '../../../shadcn.js';
+import type { ComponentProps } from 'svelte';
+type $$ComponentProps = WithoutChildrenOrChild<SheetPrimitive.ContentProps> & {
+    portalProps?: WithoutChildrenOrChild<ComponentProps<typeof SheetPortal>>;
+    side?: Side;
+    showCloseButton?: boolean;
+    children: Snippet;
+};
+declare const SheetContent: import("svelte").Component<$$ComponentProps, {}, "ref">;
+type SheetContent = ReturnType<typeof SheetContent>;
+export default SheetContent;

package/dist/ui/shadcn/sheet/sheet-description.svelte

@@ -0,0 +1,17 @@
+<script lang="ts">
+	import { Dialog as SheetPrimitive } from 'bits-ui';
+	import { cn } from '../../../shadcn.js';
+
+	let {
+		ref = $bindable(null),
+		class: className,
+		...restProps
+	}: SheetPrimitive.DescriptionProps = $props();
+</script>
+
+<SheetPrimitive.Description
+	bind:ref
+	data-slot="sheet-description"
+	class={cn('text-muted-foreground text-sm', className)}
+	{...restProps}
+/>

package/dist/ui/shadcn/sheet/sheet-description.svelte.d.ts

@@ -0,0 +1,4 @@
+import { Dialog as SheetPrimitive } from 'bits-ui';
+declare const SheetDescription: import("svelte").Component<SheetPrimitive.DescriptionProps, {}, "ref">;
+type SheetDescription = ReturnType<typeof SheetDescription>;
+export default SheetDescription;

package/dist/ui/shadcn/sheet/sheet-footer.svelte

@@ -0,0 +1,20 @@
+<script lang="ts">
+	import { cn, type WithElementRef } from '../../../shadcn.js';
+	import type { HTMLAttributes } from 'svelte/elements';
+
+	let {
+		ref = $bindable(null),
+		class: className,
+		children,
+		...restProps
+	}: WithElementRef<HTMLAttributes<HTMLDivElement>> = $props();
+</script>
+
+<div
+	bind:this={ref}
+	data-slot="sheet-footer"
+	class={cn('gap-2 p-4 mt-auto flex flex-col', className)}
+	{...restProps}
+>
+	{@render children?.()}
+</div>

package/dist/ui/shadcn/sheet/sheet-footer.svelte.d.ts

@@ -0,0 +1,5 @@
+import { type WithElementRef } from '../../../shadcn.js';
+import type { HTMLAttributes } from 'svelte/elements';
+declare const SheetFooter: import("svelte").Component<WithElementRef<HTMLAttributes<HTMLDivElement>>, {}, "ref">;
+type SheetFooter = ReturnType<typeof SheetFooter>;
+export default SheetFooter;

package/dist/ui/shadcn/sheet/sheet-header.svelte

@@ -0,0 +1,20 @@
+<script lang="ts">
+	import type { HTMLAttributes } from 'svelte/elements';
+	import { cn, type WithElementRef } from '../../../shadcn.js';
+
+	let {
+		ref = $bindable(null),
+		class: className,
+		children,
+		...restProps
+	}: WithElementRef<HTMLAttributes<HTMLDivElement>> = $props();
+</script>
+
+<div
+	bind:this={ref}
+	data-slot="sheet-header"
+	class={cn('gap-1.5 p-4 flex flex-col', className)}
+	{...restProps}
+>
+	{@render children?.()}
+</div>

package/dist/ui/shadcn/sheet/sheet-header.svelte.d.ts

@@ -0,0 +1,5 @@
+import type { HTMLAttributes } from 'svelte/elements';
+import { type WithElementRef } from '../../../shadcn.js';
+declare const SheetHeader: import("svelte").Component<WithElementRef<HTMLAttributes<HTMLDivElement>>, {}, "ref">;
+type SheetHeader = ReturnType<typeof SheetHeader>;
+export default SheetHeader;

package/dist/ui/shadcn/sheet/sheet-overlay.svelte

@@ -0,0 +1,17 @@
+<script lang="ts">
+	import { Dialog as SheetPrimitive } from 'bits-ui';
+	import { cn } from '../../../shadcn.js';
+
+	let {
+		ref = $bindable(null),
+		class: className,
+		...restProps
+	}: SheetPrimitive.OverlayProps = $props();
+</script>
+
+<SheetPrimitive.Overlay
+	bind:ref
+	data-slot="sheet-overlay"
+	class={cn('bg-black/10 supports-backdrop-filter:backdrop-blur-xs fixed inset-0 z-50', className)}
+	{...restProps}
+/>

package/dist/ui/shadcn/sheet/sheet-overlay.svelte.d.ts

@@ -0,0 +1,4 @@
+import { Dialog as SheetPrimitive } from 'bits-ui';
+declare const SheetOverlay: import("svelte").Component<SheetPrimitive.OverlayProps, {}, "ref">;
+type SheetOverlay = ReturnType<typeof SheetOverlay>;
+export default SheetOverlay;

package/dist/ui/shadcn/sheet/sheet-portal.svelte

@@ -0,0 +1,7 @@
+<script lang="ts">
+	import { Dialog as SheetPrimitive } from 'bits-ui';
+
+	let { ...restProps }: SheetPrimitive.PortalProps = $props();
+</script>
+
+<SheetPrimitive.Portal {...restProps} />

package/dist/ui/shadcn/sheet/sheet-portal.svelte.d.ts

@@ -0,0 +1,3 @@
+declare const SheetPortal: import("svelte").Component<import("bits-ui").PortalProps, {}, "">;
+type SheetPortal = ReturnType<typeof SheetPortal>;
+export default SheetPortal;

package/dist/ui/shadcn/sheet/sheet-title.svelte

@@ -0,0 +1,17 @@
+<script lang="ts">
+	import { Dialog as SheetPrimitive } from 'bits-ui';
+	import { cn } from '../../../shadcn.js';
+
+	let {
+		ref = $bindable(null),
+		class: className,
+		...restProps
+	}: SheetPrimitive.TitleProps = $props();
+</script>
+
+<SheetPrimitive.Title
+	bind:ref
+	data-slot="sheet-title"
+	class={cn('text-foreground font-medium', className)}
+	{...restProps}
+/>

package/dist/ui/shadcn/sheet/sheet-title.svelte.d.ts

@@ -0,0 +1,4 @@
+import { Dialog as SheetPrimitive } from 'bits-ui';
+declare const SheetTitle: import("svelte").Component<SheetPrimitive.TitleProps, {}, "ref">;
+type SheetTitle = ReturnType<typeof SheetTitle>;
+export default SheetTitle;

package/dist/ui/shadcn/sheet/sheet-trigger.svelte

@@ -0,0 +1,7 @@
+<script lang="ts">
+	import { Dialog as SheetPrimitive } from 'bits-ui';
+
+	let { ref = $bindable(null), ...restProps }: SheetPrimitive.TriggerProps = $props();
+</script>
+
+<SheetPrimitive.Trigger bind:ref data-slot="sheet-trigger" {...restProps} />

package/dist/ui/shadcn/sheet/sheet-trigger.svelte.d.ts

@@ -0,0 +1,4 @@
+import { Dialog as SheetPrimitive } from 'bits-ui';
+declare const SheetTrigger: import("svelte").Component<SheetPrimitive.TriggerProps, {}, "ref">;
+type SheetTrigger = ReturnType<typeof SheetTrigger>;
+export default SheetTrigger;

package/dist/ui/shadcn/sheet/sheet.svelte

@@ -0,0 +1,7 @@
+<script lang="ts">
+	import { Dialog as SheetPrimitive } from 'bits-ui';
+
+	let { open = $bindable(false), ...restProps }: SheetPrimitive.RootProps = $props();
+</script>
+
+<SheetPrimitive.Root bind:open {...restProps} />

package/dist/ui/shadcn/sheet/sheet.svelte.d.ts

@@ -0,0 +1,3 @@
+declare const Sheet: import("svelte").Component<import("bits-ui").AlertDialogRootPropsWithoutHTML, {}, "open">;
+type Sheet = ReturnType<typeof Sheet>;
+export default Sheet;

package/dist/ui/shadcn/tabs/index.d.ts

@@ -0,0 +1,5 @@
+import Root from './tabs.svelte';
+import Content from './tabs-content.svelte';
+import List, { tabsListVariants, type TabsListVariant } from './tabs-list.svelte';
+import Trigger from './tabs-trigger.svelte';
+export { Root, Content, List, Trigger, tabsListVariants, type TabsListVariant, Root as Tabs, Content as TabsContent, List as TabsList, Trigger as TabsTrigger };

package/dist/ui/shadcn/tabs/index.js

@@ -0,0 +1,7 @@
+import Root from './tabs.svelte';
+import Content from './tabs-content.svelte';
+import List, { tabsListVariants } from './tabs-list.svelte';
+import Trigger from './tabs-trigger.svelte';
+export { Root, Content, List, Trigger, tabsListVariants, 
+//
+Root as Tabs, Content as TabsContent, List as TabsList, Trigger as TabsTrigger };

package/dist/ui/shadcn/tabs/tabs-content.svelte

@@ -0,0 +1,17 @@
+<script lang="ts">
+	import { Tabs as TabsPrimitive } from 'bits-ui';
+	import { cn } from '../../../shadcn.js';
+
+	let {
+		ref = $bindable(null),
+		class: className,
+		...restProps
+	}: TabsPrimitive.ContentProps = $props();
+</script>
+
+<TabsPrimitive.Content
+	bind:ref
+	data-slot="tabs-content"
+	class={cn('text-sm flex-1 outline-none', className)}
+	{...restProps}
+/>

package/dist/ui/shadcn/tabs/tabs-content.svelte.d.ts

@@ -0,0 +1,4 @@
+import { Tabs as TabsPrimitive } from 'bits-ui';
+declare const TabsContent: import("svelte").Component<TabsPrimitive.ContentProps, {}, "ref">;
+type TabsContent = ReturnType<typeof TabsContent>;
+export default TabsContent;

package/dist/ui/shadcn/tabs/tabs-list.svelte

@@ -0,0 +1,40 @@
+<script lang="ts" module>
+	import { tv, type VariantProps } from 'tailwind-variants';
+
+	export const tabsListVariants = tv({
+		base: 'rounded-lg p-[3px] group-data-horizontal/tabs:h-9 data-[variant=line]:rounded-none group/tabs-list text-muted-foreground inline-flex w-fit items-center justify-center group-data-[orientation=vertical]/tabs:h-fit group-data-[orientation=vertical]/tabs:flex-col',
+		variants: {
+			variant: {
+				default: 'cn-tabs-list-variant-default bg-muted',
+				line: 'cn-tabs-list-variant-line gap-1 bg-transparent'
+			}
+		},
+		defaultVariants: {
+			variant: 'default'
+		}
+	});
+
+	export type TabsListVariant = VariantProps<typeof tabsListVariants>['variant'];
+</script>
+
+<script lang="ts">
+	import { Tabs as TabsPrimitive } from 'bits-ui';
+	import { cn } from '../../../shadcn.js';
+
+	let {
+		ref = $bindable(null),
+		variant = 'default',
+		class: className,
+		...restProps
+	}: TabsPrimitive.ListProps & {
+		variant?: TabsListVariant;
+	} = $props();
+</script>
+
+<TabsPrimitive.List
+	bind:ref
+	data-slot="tabs-list"
+	data-variant={variant}
+	class={cn(tabsListVariants({ variant }), className)}
+	{...restProps}
+/>

package/dist/ui/shadcn/tabs/tabs-list.svelte.d.ts

@@ -0,0 +1,25 @@
+import { type VariantProps } from 'tailwind-variants';
+export declare const tabsListVariants: import("tailwind-variants").TVReturnType<{
+    variant: {
+        default: string;
+        line: string;
+    };
+}, undefined, "rounded-lg p-[3px] group-data-horizontal/tabs:h-9 data-[variant=line]:rounded-none group/tabs-list text-muted-foreground inline-flex w-fit items-center justify-center group-data-[orientation=vertical]/tabs:h-fit group-data-[orientation=vertical]/tabs:flex-col", {
+    variant: {
+        default: string;
+        line: string;
+    };
+}, undefined, import("tailwind-variants").TVReturnType<{
+    variant: {
+        default: string;
+        line: string;
+    };
+}, undefined, "rounded-lg p-[3px] group-data-horizontal/tabs:h-9 data-[variant=line]:rounded-none group/tabs-list text-muted-foreground inline-flex w-fit items-center justify-center group-data-[orientation=vertical]/tabs:h-fit group-data-[orientation=vertical]/tabs:flex-col", unknown, unknown, undefined>>;
+export type TabsListVariant = VariantProps<typeof tabsListVariants>['variant'];
+import { Tabs as TabsPrimitive } from 'bits-ui';
+type $$ComponentProps = TabsPrimitive.ListProps & {
+    variant?: TabsListVariant;
+};
+declare const TabsList: import("svelte").Component<$$ComponentProps, {}, "ref">;
+type TabsList = ReturnType<typeof TabsList>;
+export default TabsList;

package/dist/ui/shadcn/tabs/tabs-trigger.svelte

@@ -0,0 +1,23 @@
+<script lang="ts">
+	import { Tabs as TabsPrimitive } from 'bits-ui';
+	import { cn } from '../../../shadcn.js';
+
+	let {
+		ref = $bindable(null),
+		class: className,
+		...restProps
+	}: TabsPrimitive.TriggerProps = $props();
+</script>
+
+<TabsPrimitive.Trigger
+	bind:ref
+	data-slot="tabs-trigger"
+	class={cn(
+		"gap-1.5 rounded-md border border-transparent px-2 py-1 text-sm font-medium has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 group-data-[variant=default]/tabs-list:data-active:shadow-sm group-data-[variant=line]/tabs-list:data-active:shadow-none [&_svg:not([class*='size-'])]:size-4 focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:outline-ring text-foreground/60 hover:text-foreground dark:text-muted-foreground dark:hover:text-foreground relative inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center whitespace-nowrap transition-all group-data-[orientation=vertical]/tabs:w-full group-data-[orientation=vertical]/tabs:justify-start focus-visible:ring-[3px] focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0",
+		'group-data-[variant=line]/tabs-list:bg-transparent group-data-[variant=line]/tabs-list:data-active:bg-transparent dark:group-data-[variant=line]/tabs-list:data-active:border-transparent dark:group-data-[variant=line]/tabs-list:data-active:bg-transparent',
+		'data-active:bg-background dark:data-active:text-foreground dark:data-active:border-input dark:data-active:bg-input/30 data-active:text-foreground',
+		'after:bg-foreground after:absolute after:opacity-0 after:transition-opacity group-data-[orientation=horizontal]/tabs:after:inset-x-0 group-data-[orientation=horizontal]/tabs:after:bottom-[-5px] group-data-[orientation=horizontal]/tabs:after:h-0.5 group-data-[orientation=vertical]/tabs:after:inset-y-0 group-data-[orientation=vertical]/tabs:after:-right-1 group-data-[orientation=vertical]/tabs:after:w-0.5 group-data-[variant=line]/tabs-list:data-active:after:opacity-100',
+		className
+	)}
+	{...restProps}
+/>

package/dist/ui/shadcn/tabs/tabs-trigger.svelte.d.ts

@@ -0,0 +1,4 @@
+import { Tabs as TabsPrimitive } from 'bits-ui';
+declare const TabsTrigger: import("svelte").Component<TabsPrimitive.TriggerProps, {}, "ref">;
+type TabsTrigger = ReturnType<typeof TabsTrigger>;
+export default TabsTrigger;

package/dist/ui/shadcn/tabs/tabs.svelte

@@ -0,0 +1,19 @@
+<script lang="ts">
+	import { Tabs as TabsPrimitive } from 'bits-ui';
+	import { cn } from '../../../shadcn.js';
+
+	let {
+		ref = $bindable(null),
+		value = $bindable(''),
+		class: className,
+		...restProps
+	}: TabsPrimitive.RootProps = $props();
+</script>
+
+<TabsPrimitive.Root
+	bind:ref
+	bind:value
+	data-slot="tabs"
+	class={cn('gap-2 group/tabs flex data-[orientation=horizontal]:flex-col', className)}
+	{...restProps}
+/>

package/dist/ui/shadcn/tabs/tabs.svelte.d.ts

@@ -0,0 +1,4 @@
+import { Tabs as TabsPrimitive } from 'bits-ui';
+declare const Tabs: import("svelte").Component<TabsPrimitive.RootProps, {}, "ref" | "value">;
+type Tabs = ReturnType<typeof Tabs>;
+export default Tabs;

package/dist/ui/step.svelte

@@ -0,0 +1,82 @@
+<script lang="ts">
+	import type { Snippet } from 'svelte';
+
+	const {
+		title,
+		children
+	}: {
+		/** Optional heading for the step. */
+		title?: string;
+		children?: Snippet;
+	} = $props();
+</script>
+
+<!--
+	One step in a <Steps>. Auto-numbered via a CSS counter shared with the parent,
+	so it needs no preprocessor and works in both markdown and plain .svelte.
+-->
+<div class="step">
+	<div class="step-marker" aria-hidden="true"></div>
+	<div class="step-content">
+		{#if title}<p class="step-title">{title}</p>{/if}
+		{#if children}{@render children()}{/if}
+	</div>
+</div>
+
+<style>
+	.step {
+		counter-increment: docsmith-step;
+		position: relative;
+		padding: 0 0 1.5rem 2.5rem;
+	}
+	/* Connector line, centered under the badge, sitting behind it (z-index) so
+	   it never cuts across the number; hidden on the last step. */
+	.step::after {
+		content: '';
+		position: absolute;
+		left: 0.8rem;
+		top: 0;
+		bottom: 0;
+		width: 1px;
+		background: var(--border);
+		z-index: 0;
+	}
+	.step:last-child {
+		padding-bottom: 0;
+	}
+	.step:last-child::after {
+		display: none;
+	}
+	.step-marker {
+		position: absolute;
+		left: 0;
+		top: -0.15rem;
+		z-index: 1;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		width: 1.6rem;
+		height: 1.6rem;
+		border-radius: 9999px;
+		background: var(--primary);
+		color: var(--primary-foreground);
+		font-size: 0.8rem;
+		font-weight: 600;
+		font-variant-numeric: tabular-nums;
+		/* Ring in the page bg so the connector visually stops at the badge edge. */
+		box-shadow: 0 0 0 4px var(--background);
+	}
+	.step-marker::before {
+		content: counter(docsmith-step);
+	}
+	.step-title {
+		margin: 0 0 0.4rem;
+		font-weight: 600;
+	}
+	.step-content :global(:first-child) {
+		margin-top: 0;
+	}
+	.step-content :global(:last-child) {
+		margin-bottom: 0;
+	}
+</style>

package/dist/ui/step.svelte.d.ts

@@ -0,0 +1,9 @@
+import type { Snippet } from 'svelte';
+type $$ComponentProps = {
+    /** Optional heading for the step. */
+    title?: string;
+    children?: Snippet;
+};
+declare const Step: import("svelte").Component<$$ComponentProps, {}, "">;
+type Step = ReturnType<typeof Step>;
+export default Step;

package/dist/ui/steps.svelte

@@ -0,0 +1,71 @@
+<script lang="ts">
+	import type { Snippet } from 'svelte';
+
+	// A numbered walkthrough. Two ways to author it, both work anywhere
+	// (markdown pages AND plain .svelte components):
+	//
+	//   <Steps>
+	//     <Step title="First">Do this.</Step>
+	//     <Step title="Then">Do that.</Step>
+	//   </Steps>
+	//
+	// Or, as a convenience inside markdown, a plain ordered list:
+	//
+	//   <Steps>
+	//
+	//   1. Do this.
+	//   2. Do that.
+	//
+	//   </Steps>
+	const { children }: { children: Snippet } = $props();
+</script>
+
+<div class="steps">{@render children()}</div>
+
+<style>
+	.steps {
+		counter-reset: docsmith-step;
+	}
+
+	/* Markdown convenience: a plain ordered list renders as numbered steps too.
+	   (In a .svelte file there is no mdsvex to produce this <ol>, so prefer
+	   <Step> there — this block simply does nothing when no <ol> is present.) */
+	.steps :global(ol) {
+		counter-reset: docsmith-step;
+		list-style: none;
+		margin: 1.5rem 0;
+		padding: 0;
+	}
+	.steps :global(ol > li) {
+		counter-increment: docsmith-step;
+		position: relative;
+		margin-left: 0.8rem;
+		padding: 0 0 1.5rem 2rem;
+		border-left: 1px solid var(--border);
+	}
+	.steps :global(ol > li:last-child) {
+		border-left-color: transparent;
+		padding-bottom: 0;
+	}
+	.steps :global(ol > li)::before {
+		content: counter(docsmith-step);
+		position: absolute;
+		left: 0;
+		top: -0.15rem;
+		transform: translateX(-50%);
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		width: 1.6rem;
+		height: 1.6rem;
+		border-radius: 9999px;
+		background: var(--primary);
+		color: var(--primary-foreground);
+		font-size: 0.8rem;
+		font-weight: 600;
+		font-variant-numeric: tabular-nums;
+	}
+	.steps :global(ol > li > :first-child) {
+		margin-top: 0;
+	}
+</style>

package/dist/ui/steps.svelte.d.ts

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

package/dist/ui/tab-item.svelte

@@ -0,0 +1,14 @@
+<script lang="ts">
+	import * as Tabs from './shadcn/tabs/index.js';
+	import type { WithChildren } from '../types.js';
+
+	type TabsItemProps = {
+		value: string;
+	};
+
+	const { children, value }: WithChildren<TabsItemProps> = $props();
+</script>
+
+<Tabs.Content {value}>
+	{@render children()}
+</Tabs.Content>

package/dist/ui/tab-item.svelte.d.ts

@@ -0,0 +1,6 @@
+import type { WithChildren } from '../types.js';
+declare const TabItem: import("svelte").Component<WithChildren<{
+    value: string;
+}>, {}, "">;
+type TabItem = ReturnType<typeof TabItem>;
+export default TabItem;