@kayord/ui 2.1.9 → 2.1.10

package/dist/components/ui/date-strip/index.d.ts

@@ -0,0 +1,3 @@
+import DateStrip from "./date-strip.svelte";
+import DateStripItem from "./date-strip-item.svelte";
+export { DateStrip as Root, DateStripItem as Item };

package/dist/components/ui/date-strip/index.js

@@ -0,0 +1,3 @@
+import DateStrip from "./date-strip.svelte";
+import DateStripItem from "./date-strip-item.svelte";
+export { DateStrip as Root, DateStripItem as Item };

package/dist/components/ui/dropdown-menu/dropdown-menu-checkbox-group.svelte.d.ts

@@ -1,4 +1,4 @@
 import { DropdownMenu as DropdownMenuPrimitive } from "bits-ui";
-declare const DropdownMenuCheckboxGroup: import("svelte").Component<DropdownMenuPrimitive.CheckboxGroupProps, {}, "value" | "ref">;
+declare const DropdownMenuCheckboxGroup: import("svelte").Component<DropdownMenuPrimitive.CheckboxGroupProps, {}, "ref" | "value">;
 type DropdownMenuCheckboxGroup = ReturnType<typeof DropdownMenuCheckboxGroup>;
 export default DropdownMenuCheckboxGroup;

package/dist/components/ui/dropdown-menu/dropdown-menu-radio-group.svelte.d.ts

@@ -1,4 +1,4 @@
 import { DropdownMenu as DropdownMenuPrimitive } from "bits-ui";
-declare const DropdownMenuRadioGroup: import("svelte").Component<DropdownMenuPrimitive.RadioGroupProps, {}, "value" | "ref">;
+declare const DropdownMenuRadioGroup: import("svelte").Component<DropdownMenuPrimitive.RadioGroupProps, {}, "ref" | "value">;
 type DropdownMenuRadioGroup = ReturnType<typeof DropdownMenuRadioGroup>;
 export default DropdownMenuRadioGroup;

package/dist/components/ui/dynamic-select/ctx.d.ts

@@ -0,0 +1,15 @@
+type DynamicSelectContext = {
+    value: {
+        value: string;
+    };
+    open: {
+        value: boolean;
+    };
+    inputValue: {
+        value: string;
+    };
+    setValue: (v: string) => void;
+};
+export declare function setDynamicSelectContext(props: DynamicSelectContext): void;
+export declare function getDynamicSelectContext(): DynamicSelectContext;
+export {};

package/dist/components/ui/dynamic-select/ctx.js

@@ -0,0 +1,8 @@
+import { getContext, setContext } from "svelte";
+const DYNAMIC_SELECT_KEY = Symbol("dynamic-select");
+export function setDynamicSelectContext(props) {
+    setContext(DYNAMIC_SELECT_KEY, props);
+}
+export function getDynamicSelectContext() {
+    return getContext(DYNAMIC_SELECT_KEY);
+}

package/dist/components/ui/dynamic-select/dynamic-select-content.svelte

@@ -0,0 +1,42 @@
+<script lang="ts">
+	import * as Popover from "../popover";
+	import * as Command from "../command";
+	import { getDynamicSelectContext } from "./ctx";
+	import type { Snippet } from "svelte";
+
+	let { children }: { children: Snippet } = $props();
+	const ctx = getDynamicSelectContext();
+
+	let internalInput = $state("");
+
+	function handleKeyDown(e: KeyboardEvent) {
+		if (e.key === "Enter" && internalInput.trim() !== "") {
+			ctx.setValue(internalInput);
+			internalInput = "";
+		}
+	}
+</script>
+
+<Popover.Content
+	class="w-[var(--bits-popover-anchor-width)] min-w-[var(--bits-popover-anchor-width)] p-0"
+	align="start"
+>
+	<Command.Root>
+		<Command.Input placeholder="Search or type custom..." bind:value={internalInput} onkeydown={handleKeyDown} />
+		<Command.List>
+			<Command.Empty>
+				{#if internalInput.trim() !== ""}
+					<button
+						class="hover:bg-accent hover:text-accent-foreground flex w-full cursor-pointer items-center px-2 py-1.5 text-sm outline-none"
+						onclick={() => ctx.setValue(internalInput)}
+					>
+						Add "{internalInput}"
+					</button>
+				{:else}
+					No results found.
+				{/if}
+			</Command.Empty>
+			{@render children()}
+		</Command.List>
+	</Command.Root>
+</Popover.Content>

package/dist/components/ui/dynamic-select/dynamic-select-content.svelte.d.ts

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

package/dist/components/ui/dynamic-select/dynamic-select-item.svelte

@@ -0,0 +1,16 @@
+<script lang="ts">
+	import { cn } from "../../../utils";
+	import * as Command from "../command";
+	import { Check } from "lucide-svelte";
+	import { getDynamicSelectContext } from "./ctx";
+	import type { Snippet } from "svelte";
+
+	let { value, children }: { value: string; children: Snippet } = $props();
+	const ctx = getDynamicSelectContext();
+	const isSelected = $derived(ctx.value.value === value);
+</script>
+
+<Command.Item {value} onSelect={() => ctx.setValue(value)} class="flex cursor-pointer items-center justify-between">
+	{@render children()}
+	<Check class={cn("h-4 w-4", isSelected ? "opacity-100" : "opacity-0")} />
+</Command.Item>

package/dist/components/ui/dynamic-select/dynamic-select-item.svelte.d.ts

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

package/dist/components/ui/dynamic-select/dynamic-select-trigger.svelte

@@ -0,0 +1,20 @@
+<script lang="ts">
+	import { cn } from "../../../utils";
+	import * as Popover from "../popover";
+	import { buttonVariants } from "../button";
+	import { ChevronDown } from "lucide-svelte";
+	import { getDynamicSelectContext } from "./ctx";
+	import type { Snippet } from "svelte";
+
+	let { class: className, children }: { class?: string; children: Snippet } = $props();
+	const ctx = getDynamicSelectContext();
+</script>
+
+<Popover.Trigger class={cn(buttonVariants({ variant: "outline" }), "w-full justify-between font-normal", className)}>
+	{#if ctx.value.value}
+		{ctx.value.value}
+	{:else}
+		{@render children()}
+	{/if}
+	<ChevronDown class="ml-2 h-4 w-4 shrink-0 opacity-50" />
+</Popover.Trigger>

package/dist/components/ui/dynamic-select/dynamic-select-trigger.svelte.d.ts

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

package/dist/components/ui/dynamic-select/dynamic-select.svelte

@@ -0,0 +1,37 @@
+<script lang="ts">
+	import * as Popover from "../popover";
+	import { setDynamicSelectContext } from "./ctx";
+	import type { Snippet } from "svelte";
+
+	let {
+		value = $bindable(""),
+		open = $bindable(false),
+		children,
+	}: {
+		value?: string;
+		open?: boolean;
+		children: Snippet;
+	} = $props();
+
+	let inputValue = $state("");
+
+	setDynamicSelectContext({
+		get value() {
+			return { value };
+		},
+		get open() {
+			return { value: open };
+		},
+		get inputValue() {
+			return { value: inputValue };
+		},
+		setValue: (v: string) => {
+			value = v;
+			open = false;
+		},
+	});
+</script>
+
+<Popover.Root bind:open>
+	{@render children()}
+</Popover.Root>

package/dist/components/ui/dynamic-select/dynamic-select.svelte.d.ts

@@ -0,0 +1,9 @@
+import type { Snippet } from "svelte";
+type $$ComponentProps = {
+    value?: string;
+    open?: boolean;
+    children: Snippet;
+};
+declare const DynamicSelect: import("svelte").Component<$$ComponentProps, {}, "value" | "open">;
+type DynamicSelect = ReturnType<typeof DynamicSelect>;
+export default DynamicSelect;

package/dist/components/ui/dynamic-select/index.d.ts

@@ -0,0 +1,18 @@
+import Root from "./dynamic-select.svelte";
+import Trigger from "./dynamic-select-trigger.svelte";
+import Content from "./dynamic-select-content.svelte";
+import Item from "./dynamic-select-item.svelte";
+declare const Group: import("svelte").Component<Omit<{
+    value?: string;
+    forceMount?: boolean;
+}, "child" | "children"> & {
+    child?: import("svelte").Snippet<[{
+        props: Record<string, unknown>;
+    }]> | undefined;
+    children?: import("svelte").Snippet<[]> | undefined;
+    style?: import("bits-ui").StyleProperties | string | null | undefined;
+    ref?: HTMLElement | null | undefined;
+} & import("bits-ui").Without<import("bits-ui").BitsPrimitiveDivAttributes, import("bits-ui").CommandGroupPropsWithoutHTML> & {
+    heading?: string;
+}, {}, "ref">;
+export { Root, Trigger, Content, Item, Group };

package/dist/components/ui/dynamic-select/index.js

@@ -0,0 +1,7 @@
+import Root from "./dynamic-select.svelte";
+import Trigger from "./dynamic-select-trigger.svelte";
+import Content from "./dynamic-select-content.svelte";
+import Item from "./dynamic-select-item.svelte";
+import { CommandGroup } from "../command";
+const Group = CommandGroup;
+export { Root, Trigger, Content, Item, Group };

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

@@ -45,3 +45,10 @@ export { Textarea } from "./textarea/index.js";
 export { Toggle } from "./toggle/index.js";
 export * as ToggleGroup from "./toggle-group/index.js";
 export * as Tooltip from "./tooltip/index.js";
+export * as Chip from "./chip";
+export { Root as ColorPicker } from "./color-picker";
+export * as DateStrip from "./date-strip";
+export * as Timeline from "./timeline";
+export * as DynamicSelect from "./dynamic-select";
+export { AudioWave } from "./audio-wave";
+export * as StatusDot from "./status-dot";

package/dist/components/ui/index.js

@@ -45,3 +45,11 @@ export { Textarea } from "./textarea/index.js";
 export { Toggle } from "./toggle/index.js";
 export * as ToggleGroup from "./toggle-group/index.js";
 export * as Tooltip from "./tooltip/index.js";
+// More
+export * as Chip from "./chip";
+export { Root as ColorPicker } from "./color-picker";
+export * as DateStrip from "./date-strip";
+export * as Timeline from "./timeline";
+export * as DynamicSelect from "./dynamic-select";
+export { AudioWave } from "./audio-wave";
+export * as StatusDot from "./status-dot";

package/dist/components/ui/input/input.svelte.d.ts

@@ -8,6 +8,6 @@ type Props = WithElementRef<Omit<HTMLInputAttributes, "type"> & ({
     type?: InputType;
     files?: undefined;
 })>;
-declare const Input: import("svelte").Component<Props, {}, "value" | "ref" | "files">;
+declare const Input: import("svelte").Component<Props, {}, "ref" | "value" | "files">;
 type Input = ReturnType<typeof Input>;
 export default Input;

package/dist/components/ui/input-group/input-group-input.svelte.d.ts

@@ -2,10 +2,10 @@ declare const InputGroupInput: import("svelte").Component<(Omit<import("svelte/e
     type: "file";
     files?: FileList;
 } | {
-    type?: "number" | "hidden" | "color" | "search" | "button" | "checkbox" | "radio" | (string & {}) | "text" | "tel" | "url" | "email" | "date" | "time" | "submit" | "reset" | "datetime-local" | "image" | "month" | "password" | "range" | "week";
+    type?: "number" | "submit" | "reset" | "button" | "search" | "checkbox" | "radio" | (string & {}) | "text" | "tel" | "url" | "email" | "hidden" | "color" | "date" | "time" | "datetime-local" | "image" | "month" | "password" | "range" | "week";
     files?: undefined;
 })) & {
     ref?: HTMLElement | null | undefined;
-}, {}, "value" | "ref">;
+}, {}, "ref" | "value">;
 type InputGroupInput = ReturnType<typeof InputGroupInput>;
 export default InputGroupInput;

package/dist/components/ui/input-group/input-group-textarea.svelte.d.ts

@@ -1,3 +1,3 @@
-declare const InputGroupTextarea: import("svelte").Component<Omit<import("../../../utils.js").WithElementRef<import("svelte/elements").HTMLTextareaAttributes>, "children">, {}, "value" | "ref">;
+declare const InputGroupTextarea: import("svelte").Component<Omit<import("../../../utils.js").WithElementRef<import("svelte/elements").HTMLTextareaAttributes>, "children">, {}, "ref" | "value">;
 type InputGroupTextarea = ReturnType<typeof InputGroupTextarea>;
 export default InputGroupTextarea;

package/dist/components/ui/input-otp/input-otp.svelte.d.ts

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

package/dist/components/ui/menubar/menubar-radio-group.svelte.d.ts

@@ -1,4 +1,4 @@
 import { Menubar as MenubarPrimitive } from "bits-ui";
-declare const MenubarRadioGroup: import("svelte").Component<MenubarPrimitive.RadioGroupProps, {}, "value" | "ref">;
+declare const MenubarRadioGroup: import("svelte").Component<MenubarPrimitive.RadioGroupProps, {}, "ref" | "value">;
 type MenubarRadioGroup = ReturnType<typeof MenubarRadioGroup>;
 export default MenubarRadioGroup;

package/dist/components/ui/native-select/native-select.svelte.d.ts

@@ -1,5 +1,5 @@
 import { type WithElementRef } from "../../../utils.js";
 import type { HTMLSelectAttributes } from "svelte/elements";
-declare const NativeSelect: import("svelte").Component<WithElementRef<HTMLSelectAttributes>, {}, "value" | "ref">;
+declare const NativeSelect: import("svelte").Component<WithElementRef<HTMLSelectAttributes>, {}, "ref" | "value">;
 type NativeSelect = ReturnType<typeof NativeSelect>;
 export default NativeSelect;

package/dist/components/ui/radio-group/radio-group.svelte.d.ts

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

package/dist/components/ui/range-calendar/range-calendar.svelte.d.ts

@@ -16,6 +16,6 @@ type $$ComponentProps = WithoutChildrenOrChild<RangeCalendarPrimitive.RootProps>
         outsideMonth: boolean;
     }]>;
 };
-declare const RangeCalendar: import("svelte").Component<$$ComponentProps, {}, "value" | "placeholder" | "ref">;
+declare const RangeCalendar: import("svelte").Component<$$ComponentProps, {}, "ref" | "value" | "placeholder">;
 type RangeCalendar = ReturnType<typeof RangeCalendar>;
 export default RangeCalendar;

package/dist/components/ui/sidebar/sidebar-input.svelte.d.ts

@@ -2,10 +2,10 @@ declare const SidebarInput: import("svelte").Component<(Omit<import("svelte/elem
     type: "file";
     files?: FileList;
 } | {
-    type?: "number" | "hidden" | "color" | "search" | "button" | "checkbox" | "radio" | (string & {}) | "text" | "tel" | "url" | "email" | "date" | "time" | "submit" | "reset" | "datetime-local" | "image" | "month" | "password" | "range" | "week";
+    type?: "number" | "submit" | "reset" | "button" | "search" | "checkbox" | "radio" | (string & {}) | "text" | "tel" | "url" | "email" | "hidden" | "color" | "date" | "time" | "datetime-local" | "image" | "month" | "password" | "range" | "week";
     files?: undefined;
 })) & {
     ref?: HTMLElement | null | undefined;
-}, {}, "value" | "ref">;
+}, {}, "ref" | "value">;
 type SidebarInput = ReturnType<typeof SidebarInput>;
 export default SidebarInput;

package/dist/components/ui/slider/slider.svelte.d.ts

@@ -1,5 +1,5 @@
 import { Slider as SliderPrimitive } from "bits-ui";
 import { type WithoutChildrenOrChild } from "../../../utils.js";
-declare const Slider: import("svelte").Component<WithoutChildrenOrChild<SliderPrimitive.RootProps>, {}, "value" | "ref">;
+declare const Slider: import("svelte").Component<WithoutChildrenOrChild<SliderPrimitive.RootProps>, {}, "ref" | "value">;
 type Slider = ReturnType<typeof Slider>;
 export default Slider;

package/dist/components/ui/status-dot/index.d.ts

@@ -0,0 +1,2 @@
+import StatusDot from "./status-dot.svelte";
+export { StatusDot as Root };

package/dist/components/ui/status-dot/index.js

@@ -0,0 +1,2 @@
+import StatusDot from "./status-dot.svelte";
+export { StatusDot as Root };

package/dist/components/ui/status-dot/status-dot.svelte

@@ -0,0 +1,56 @@
+<script lang="ts">
+	import { cn } from "../../../utils";
+	import { tv, type VariantProps } from "tailwind-variants";
+
+	const dotVariants = tv({
+		base: "rounded-full",
+		variants: {
+			variant: {
+				default: "bg-primary text-primary",
+				success: "bg-emerald-500 text-emerald-500",
+				warning: "bg-amber-500 text-amber-500",
+				error: "bg-rose-500 text-rose-500",
+				info: "bg-sky-500 text-sky-500",
+				muted: "bg-muted-foreground/50 text-muted-foreground/50",
+			},
+			size: {
+				sm: "h-2 w-2",
+				md: "h-3 w-3",
+				lg: "h-4 w-4",
+			},
+		},
+		defaultVariants: {
+			variant: "default",
+			size: "md",
+		},
+	});
+
+	type Variant = VariantProps<typeof dotVariants>["variant"];
+	type Size = VariantProps<typeof dotVariants>["size"];
+
+	let {
+		class: className,
+		variant = "default",
+		size = "md",
+		pulse = false,
+		...rest
+	}: {
+		class?: string;
+		variant?: Variant;
+		size?: Size;
+		pulse?: boolean;
+		[key: string]: any;
+	} = $props();
+</script>
+
+<span class={cn("relative flex items-center justify-center", dotVariants({ size }), className)} {...rest}>
+	{#if pulse}
+		<span
+			class={cn(
+				"absolute inline-flex h-full w-full animate-ping rounded-full opacity-75",
+				dotVariants({ variant, size: undefined })
+			)}
+		></span>
+	{/if}
+	<span class={cn("relative inline-flex rounded-full", dotVariants({ variant, size }))}></span>
+</span>

package/dist/components/ui/status-dot/status-dot.svelte.d.ts

@@ -0,0 +1,9 @@
+declare const StatusDot: import("svelte").Component<{
+    [key: string]: any;
+    class?: string;
+    variant?: "default" | "error" | "muted" | "success" | "warning" | "info" | undefined;
+    size?: "sm" | "lg" | "md" | undefined;
+    pulse?: boolean;
+}, {}, "">;
+type StatusDot = ReturnType<typeof StatusDot>;
+export default StatusDot;

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

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

package/dist/components/ui/textarea/textarea.svelte.d.ts

@@ -1,5 +1,5 @@
 import { type WithElementRef } from "../../../utils.js";
 import type { HTMLTextareaAttributes } from "svelte/elements";
-declare const Textarea: import("svelte").Component<Omit<WithElementRef<HTMLTextareaAttributes>, "children">, {}, "value" | "ref">;
+declare const Textarea: import("svelte").Component<Omit<WithElementRef<HTMLTextareaAttributes>, "children">, {}, "ref" | "value">;
 type Textarea = ReturnType<typeof Textarea>;
 export default Textarea;

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

@@ -0,0 +1,8 @@
+import Root from "./timeline.svelte";
+import Item from "./timeline-item.svelte";
+import Separator from "./timeline-separator.svelte";
+import Content from "./timeline-content.svelte";
+import Title from "./timeline-title.svelte";
+import Date from "./timeline-date.svelte";
+import Description from "./timeline-description.svelte";
+export { Root, Item, Separator, Content, Title, Date, Description };

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

@@ -0,0 +1,8 @@
+import Root from "./timeline.svelte";
+import Item from "./timeline-item.svelte";
+import Separator from "./timeline-separator.svelte";
+import Content from "./timeline-content.svelte";
+import Title from "./timeline-title.svelte";
+import Date from "./timeline-date.svelte";
+import Description from "./timeline-description.svelte";
+export { Root, Item, Separator, Content, Title, Date, Description };

package/dist/components/ui/timeline/timeline-content.svelte

@@ -0,0 +1,16 @@
+<script lang="ts">
+	import { cn } from "../../../utils";
+	import type { Snippet } from "svelte";
+
+	let {
+		class: className,
+		children,
+	}: {
+		class?: string;
+		children: Snippet;
+	} = $props();
+</script>
+
+<div class={cn("ml-4 flex flex-1 flex-col gap-1 pt-0.5", className)}>
+	{@render children()}
+</div>

package/dist/components/ui/timeline/timeline-content.svelte.d.ts

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

package/dist/components/ui/timeline/timeline-date.svelte

@@ -0,0 +1,10 @@
+<script lang="ts">
+	import { cn } from "../../../utils";
+	import type { Snippet } from "svelte";
+
+	let { class: className, children }: { class?: string; children: Snippet } = $props();
+</script>
+
+<p class={cn("text-muted-foreground mb-0.5 text-xs", className)}>
+	{@render children()}
+</p>

package/dist/components/ui/timeline/timeline-date.svelte.d.ts

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

package/dist/components/ui/timeline/timeline-description.svelte

@@ -0,0 +1,10 @@
+<script lang="ts">
+	import { cn } from "../../../utils";
+	import type { Snippet } from "svelte";
+
+	let { class: className, children }: { class?: string; children: Snippet } = $props();
+</script>
+
+<p class={cn("text-muted-foreground mt-1 text-sm", className)}>
+	{@render children()}
+</p>

package/dist/components/ui/timeline/timeline-description.svelte.d.ts

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

package/dist/components/ui/timeline/timeline-item.svelte

@@ -0,0 +1,16 @@
+<script lang="ts">
+	import { cn } from "../../../utils";
+	import type { Snippet } from "svelte";
+
+	let {
+		class: className,
+		children,
+	}: {
+		class?: string;
+		children: Snippet;
+	} = $props();
+</script>
+
+<div class={cn("group relative flex items-start pb-8 last:pb-0", className)}>
+	{@render children()}
+</div>

package/dist/components/ui/timeline/timeline-item.svelte.d.ts

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

package/dist/components/ui/timeline/timeline-separator.svelte

@@ -0,0 +1,25 @@
+<script lang="ts">
+	import { cn } from "../../../utils";
+	import type { Snippet } from "svelte";
+
+	let {
+		class: className,
+		children,
+	}: {
+		class?: string;
+		children?: Snippet;
+	} = $props();
+</script>
+
+<div
+	class={cn(
+		"bg-background relative z-10 flex h-6 w-6 shrink-0 items-center justify-center rounded-full border shadow-sm",
+		className
+	)}
+>
+	{#if children}
+		{@render children()}
+	{:else}
+		<div class="bg-primary h-1.5 w-1.5 rounded-full" />
+	{/if}
+</div>

package/dist/components/ui/timeline/timeline-separator.svelte.d.ts

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

package/dist/components/ui/timeline/timeline-title.svelte

@@ -0,0 +1,10 @@
+<script lang="ts">
+	import { cn } from "../../../utils";
+	import type { Snippet } from "svelte";
+
+	let { class: className, children }: { class?: string; children: Snippet } = $props();
+</script>
+
+<h3 class={cn("text-sm leading-none font-semibold tracking-tight", className)}>
+	{@render children()}
+</h3>

package/dist/components/ui/timeline/timeline-title.svelte.d.ts

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