@noahbaumgartner/svelte-ui 0.0.4 → 0.0.6

package/dist/components/toaster/toast.svelte.d.ts

@@ -1,4 +1,4 @@
-import type { LucideIcon } from '@lucide/svelte';
+import type { IconComponent } from '../../icon.js';
 export type ToastAction = {
     label: string;
     onclick: () => void;
@@ -6,8 +6,8 @@ export type ToastAction = {
 export type ToastOptions = {
     /** Updates the toast with this id instead of adding a new one. */
     id?: number;
-    /** Any Lucide icon (import from `svelte-ui/icons`), shown on the left. */
-    icon?: LucideIcon;
+    /** Any icon component, e.g. from `@lucide/svelte`, shown on the left. */
+    icon?: IconComponent;
     /** Shows a Spinner instead of the icon and keeps the toast open until it is updated. */
     loading?: boolean;
     /** Button on the right; clicking it runs `onclick` and dismisses the toast. */

package/dist/components/toggle/Toggle.svelte

@@ -9,11 +9,18 @@
 		pressed?: boolean;
 	};
 
-	let { pressed = $bindable(false), class: className, onclick, ...rest }: Props = $props();
+	let {
+		pressed = $bindable(false),
+		ref = $bindable(null),
+		class: className,
+		onclick,
+		...rest
+	}: Props = $props();
 </script>
 
 <Button
 	{...rest}
+	bind:ref
 	variant="secondary"
 	aria-pressed={pressed}
 	class={['toggle', className]}
@@ -24,8 +31,22 @@
 />
 
 <style>
-	:global(.button.toggle[aria-pressed='true']),
-	:global(.button.toggle[aria-pressed='true']:hover:not(:disabled)) {
-		background-color: var(--color-surface-active);
+	@layer svelte-ui {
+		:global(.button.toggle[aria-pressed='true']),
+		:global(.button.toggle[aria-pressed='true']:hover:not(:disabled)) {
+			background-color: var(--color-surface-active);
+		}
+
+		@media (forced-colors: active) {
+			:global(.button.toggle[aria-pressed='true']),
+			:global(.button.toggle[aria-pressed='true']:hover:not(:disabled)) {
+				background-color: Highlight;
+				color: HighlightText;
+			}
+
+			:global(.button.toggle[aria-pressed='false']) {
+				border: 1px solid ButtonText;
+			}
+		}
 	}
 </style>

package/dist/components/toggle/Toggle.svelte.d.ts

@@ -3,6 +3,6 @@ import Button from '../button/Button.svelte';
 type Props = Omit<ComponentProps<typeof Button>, 'href' | 'target' | 'rel' | 'type' | 'variant'> & {
     pressed?: boolean;
 };
-declare const Toggle: import("svelte").Component<Props, {}, "pressed">;
+declare const Toggle: import("svelte").Component<Props, {}, "ref" | "pressed">;
 type Toggle = ReturnType<typeof Toggle>;
 export default Toggle;

package/dist/components/tooltip/Tooltip.svelte

@@ -14,11 +14,12 @@
 
 <script lang="ts">
 	import type { Snippet } from 'svelte';
+	import type { HTMLAttributes } from 'svelte/elements';
 	import { fade } from 'svelte/transition';
 
 	type Side = 'top' | 'right' | 'bottom' | 'left';
 
-	type Props = {
+	type Props = Omit<HTMLAttributes<HTMLSpanElement>, 'children'> & {
 		/** Whether the tooltip is shown. Bindable. */
 		open?: boolean;
 		/** Preferred side; flips to the opposite one when there is not enough room. */
@@ -29,9 +30,19 @@
 		trigger: Snippet<[TooltipTriggerProps]>;
 		/** Tooltip content; may contain `Kbd` / `KbdGroup`. */
 		children: Snippet;
+		ref?: HTMLSpanElement | null;
 	};
 
-	let { open = $bindable(false), side = 'top', delay = 0, trigger, children }: Props = $props();
+	let {
+		open = $bindable(false),
+		side = 'top',
+		delay = 0,
+		trigger,
+		children,
+		ref = $bindable(null),
+		class: className,
+		...rest
+	}: Props = $props();
 
 	const id = $props.id();
 	const gap = 6;
@@ -45,6 +56,10 @@
 	// A click dismisses the tooltip until the pointer leaves the trigger.
 	let pressed = false;
 
+	function reducedMotion() {
+		return window.matchMedia('(prefers-reduced-motion: reduce)').matches;
+	}
+
 	function show(wait: number) {
 		clearTimeout(timer);
 		if (pressed) return;
@@ -135,7 +150,7 @@
 	});
 </script>
 
-<span class="tooltip">
+<span {...rest} bind:this={ref} class={['tooltip', className]}>
 	{@render trigger(triggerProps)}
 
 	{#if open}
@@ -148,7 +163,7 @@
 			style:left="{position.left}px"
 			style:--tooltip-arrow="{position.arrow}px"
 			{@attach popover}
-			transition:fade={{ duration: 100 }}
+			transition:fade={{ duration: reducedMotion() ? 0 : 100 }}
 		>
 			{@render children()}
 			<span class="tooltip-arrow" aria-hidden="true"></span>
@@ -157,68 +172,82 @@
 </span>
 
 <style>
-	.tooltip {
-		display: inline-flex;
-		height: fit-content;
-	}
+	@layer svelte-ui {
+		.tooltip {
+			display: inline-flex;
+			height: fit-content;
+		}
 
-	.tooltip-content {
-		position: fixed;
-		inset: auto;
-		margin: 0;
-		display: inline-flex;
-		align-items: center;
-		gap: 6px;
-		width: max-content;
-		max-width: 280px;
-		padding: 6px 10px;
-		overflow: visible;
-		font-size: 12px;
-		line-height: 1.4;
-		text-wrap: balance;
-		background-color: var(--color-ink);
-		color: var(--color-base);
-		border: none;
-		border-radius: 10px;
-		pointer-events: none;
-	}
+		.tooltip-content {
+			position: fixed;
+			inset: auto;
+			margin: 0;
+			display: inline-flex;
+			align-items: center;
+			gap: 6px;
+			width: max-content;
+			max-width: 280px;
+			padding: 6px 10px;
+			overflow: visible;
+			font-size: 12px;
+			line-height: 1.4;
+			text-wrap: balance;
+			background-color: var(--color-ink);
+			color: var(--color-base);
+			border: none;
+			border-radius: 10px;
+			pointer-events: none;
+		}
 
-	.tooltip-content :global(:is(.kbd, .kbd-group)) {
-		font-size: inherit;
-	}
+		.tooltip-content :global(:is(.kbd, .kbd-group)) {
+			font-size: inherit;
+		}
 
-	.tooltip-arrow {
-		position: absolute;
-		width: 8px;
-		height: 8px;
-		background-color: inherit;
-		border-radius: 2px;
-		transform: rotate(45deg);
-	}
+		.tooltip-arrow {
+			position: absolute;
+			width: 8px;
+			height: 8px;
+			background-color: inherit;
+			border-radius: 2px;
+			transform: rotate(45deg);
+		}
 
-	.tooltip-content--top .tooltip-arrow,
-	.tooltip-content--bottom .tooltip-arrow {
-		left: calc(var(--tooltip-arrow) - 4px);
-	}
+		.tooltip-content--top .tooltip-arrow,
+		.tooltip-content--bottom .tooltip-arrow {
+			left: calc(var(--tooltip-arrow) - 4px);
+		}
 
-	.tooltip-content--left .tooltip-arrow,
-	.tooltip-content--right .tooltip-arrow {
-		top: calc(var(--tooltip-arrow) - 4px);
-	}
+		.tooltip-content--left .tooltip-arrow,
+		.tooltip-content--right .tooltip-arrow {
+			top: calc(var(--tooltip-arrow) - 4px);
+		}
 
-	.tooltip-content--top .tooltip-arrow {
-		bottom: -3px;
-	}
+		.tooltip-content--top .tooltip-arrow {
+			bottom: -3px;
+		}
 
-	.tooltip-content--bottom .tooltip-arrow {
-		top: -3px;
-	}
+		.tooltip-content--bottom .tooltip-arrow {
+			top: -3px;
+		}
 
-	.tooltip-content--left .tooltip-arrow {
-		right: -3px;
-	}
+		.tooltip-content--left .tooltip-arrow {
+			right: -3px;
+		}
+
+		.tooltip-content--right .tooltip-arrow {
+			left: -3px;
+		}
+
+		@media (forced-colors: active) {
+			.tooltip-content {
+				border: 1px solid CanvasText;
+				background-color: Canvas;
+				color: CanvasText;
+			}
 
-	.tooltip-content--right .tooltip-arrow {
-		left: -3px;
+			.tooltip-arrow {
+				display: none;
+			}
+		}
 	}
 </style>

package/dist/components/tooltip/Tooltip.svelte.d.ts

@@ -9,8 +9,9 @@ export type TooltipTriggerProps = {
     [key: symbol]: Attachment<HTMLElement>;
 };
 import type { Snippet } from 'svelte';
+import type { HTMLAttributes } from 'svelte/elements';
 type Side = 'top' | 'right' | 'bottom' | 'left';
-type Props = {
+type Props = Omit<HTMLAttributes<HTMLSpanElement>, 'children'> & {
     /** Whether the tooltip is shown. Bindable. */
     open?: boolean;
     /** Preferred side; flips to the opposite one when there is not enough room. */
@@ -21,7 +22,8 @@ type Props = {
     trigger: Snippet<[TooltipTriggerProps]>;
     /** Tooltip content; may contain `Kbd` / `KbdGroup`. */
     children: Snippet;
+    ref?: HTMLSpanElement | null;
 };
-declare const Tooltip: import("svelte").Component<Props, {}, "open">;
+declare const Tooltip: import("svelte").Component<Props, {}, "ref" | "open">;
 type Tooltip = ReturnType<typeof Tooltip>;
 export default Tooltip;

package/dist/icon.d.ts

@@ -0,0 +1,12 @@
+import type { Component } from 'svelte';
+/**
+ * A Svelte component that renders an icon, from any icon library
+ * (`@lucide/svelte`, `phosphor-svelte`, an inline SVG component, …).
+ *
+ * Components only pass `class` and `aria-hidden`; the size comes from CSS, so
+ * the icon should fill its box (`width`/`height: 1em` or a fixed size is fine).
+ */
+export type IconComponent = Component<{
+    class?: string;
+    'aria-hidden'?: boolean | 'true' | 'false';
+}>;

package/dist/icon.js

@@ -0,0 +1 @@
+export {};

package/dist/index.d.ts

@@ -1,5 +1,9 @@
+export type { IconComponent } from './icon.js';
+export { default as Accordion } from './components/accordion/Accordion.svelte';
+export { default as AccordionItem } from './components/accordion/AccordionItem.svelte';
 export { default as AlertDialog } from './components/alert-dialog/AlertDialog.svelte';
 export { default as Avatar } from './components/avatar/Avatar.svelte';
+export { default as AvatarGroup } from './components/avatar-group/AvatarGroup.svelte';
 export { default as Badge } from './components/badge/Badge.svelte';
 export { default as Breadcrumb } from './components/breadcrumb/Breadcrumb.svelte';
 export { default as BreadcrumbEllipsis } from './components/breadcrumb/BreadcrumbEllipsis.svelte';
@@ -18,7 +22,13 @@ export { default as Checkbox } from './components/checkbox/Checkbox.svelte';
 export { default as ColorPicker } from './components/color-picker/ColorPicker.svelte';
 export { default as ContextMenu } from './components/context-menu/ContextMenu.svelte';
 export { default as ContextMenuItem } from './components/context-menu/ContextMenuItem.svelte';
+export { default as ContextMenuSeparator } from './components/context-menu/ContextMenuSeparator.svelte';
+export { default as ContextMenuLabel } from './components/context-menu/ContextMenuLabel.svelte';
+export { default as ContextMenuInfo } from './components/context-menu/ContextMenuInfo.svelte';
 export { default as Dialog } from './components/dialog/Dialog.svelte';
+export { default as Drawer } from './components/drawer/Drawer.svelte';
+export { default as EmptyState } from './components/empty-state/EmptyState.svelte';
+export { default as Entry } from './components/entry/Entry.svelte';
 export { default as Field } from './components/field/Field.svelte';
 export { default as FieldContent } from './components/field/FieldContent.svelte';
 export { default as FieldDescription } from './components/field/FieldDescription.svelte';
@@ -27,6 +37,9 @@ export { default as FieldGroup } from './components/field/FieldGroup.svelte';
 export { default as FieldLegend } from './components/field/FieldLegend.svelte';
 export { default as FieldSeparator } from './components/field/FieldSeparator.svelte';
 export { default as FieldSet } from './components/field/FieldSet.svelte';
+export { default as Footer } from './components/footer/Footer.svelte';
+export { default as FooterColumn } from './components/footer/FooterColumn.svelte';
+export { default as Image } from './components/image/Image.svelte';
 export { default as Input } from './components/input/Input.svelte';
 export { default as Kbd } from './components/kbd/Kbd.svelte';
 export { default as KbdGroup } from './components/kbd/KbdGroup.svelte';
@@ -34,13 +47,19 @@ export { default as InputGroup } from './components/input-group/InputGroup.svelt
 export { default as InputGroupAddon } from './components/input-group/InputGroupAddon.svelte';
 export { default as Label } from './components/label/Label.svelte';
 export { default as Link } from './components/link/Link.svelte';
+export { default as MeshGradient } from './components/mesh-gradient/MeshGradient.svelte';
 export { default as Navbar } from './components/navbar/Navbar.svelte';
 export { default as NavigationMenu } from './components/navigation-menu/NavigationMenu.svelte';
 export { default as NavigationMenuItem } from './components/navigation-menu/NavigationMenuItem.svelte';
 export { default as NavigationMenuLink } from './components/navigation-menu/NavigationMenuLink.svelte';
+export { default as NumberStepper } from './components/number-stepper/NumberStepper.svelte';
 export { default as Popover } from './components/popover/Popover.svelte';
+export { default as PreviewCard } from './components/preview-card/PreviewCard.svelte';
+export { default as Progress } from './components/progress/Progress.svelte';
 export { default as RadioGroup } from './components/radio-group/RadioGroup.svelte';
 export { default as RadioGroupItem } from './components/radio-group/RadioGroupItem.svelte';
+export { default as Section } from './components/section/Section.svelte';
+export { default as Select, type SelectOption } from './components/select/Select.svelte';
 export { default as Separator } from './components/separator/Separator.svelte';
 export { default as Sidebar } from './components/sidebar/Sidebar.svelte';
 export { default as SidebarContent } from './components/sidebar/SidebarContent.svelte';
@@ -58,6 +77,7 @@ export { default as Skeleton } from './components/skeleton/Skeleton.svelte';
 export { default as Spinner } from './components/spinner/Spinner.svelte';
 export { default as Switch } from './components/switch/Switch.svelte';
 export { default as Table, type TableColumn, type TableSort, type TableSortValue } from './components/table/Table.svelte';
+export { default as Tabs, type TabsOption } from './components/tabs/Tabs.svelte';
 export { default as Textarea } from './components/textarea/Textarea.svelte';
 export { default as Toaster } from './components/toaster/Toaster.svelte';
 export { toast, type ToastOptions, type ToastAction } from './components/toaster/toast.svelte.js';
@@ -69,5 +89,6 @@ export type { PopoverTriggerProps } from './components/popover/Popover.svelte';
 export type { TooltipTriggerProps } from './components/tooltip/Tooltip.svelte';
 export type { InputType } from './components/input/Input.svelte';
 export type { DialogTriggerProps } from './components/dialog/Dialog.svelte';
+export type { DrawerTriggerProps } from './components/drawer/Drawer.svelte';
 export type { ContextMenuTriggerProps } from './components/context-menu/context.js';
 export { getSidebarContext, type SidebarContext } from './components/sidebar/context.js';

package/dist/index.js

@@ -1,5 +1,8 @@
+export { default as Accordion } from './components/accordion/Accordion.svelte';
+export { default as AccordionItem } from './components/accordion/AccordionItem.svelte';
 export { default as AlertDialog } from './components/alert-dialog/AlertDialog.svelte';
 export { default as Avatar } from './components/avatar/Avatar.svelte';
+export { default as AvatarGroup } from './components/avatar-group/AvatarGroup.svelte';
 export { default as Badge } from './components/badge/Badge.svelte';
 export { default as Breadcrumb } from './components/breadcrumb/Breadcrumb.svelte';
 export { default as BreadcrumbEllipsis } from './components/breadcrumb/BreadcrumbEllipsis.svelte';
@@ -18,7 +21,13 @@ export { default as Checkbox } from './components/checkbox/Checkbox.svelte';
 export { default as ColorPicker } from './components/color-picker/ColorPicker.svelte';
 export { default as ContextMenu } from './components/context-menu/ContextMenu.svelte';
 export { default as ContextMenuItem } from './components/context-menu/ContextMenuItem.svelte';
+export { default as ContextMenuSeparator } from './components/context-menu/ContextMenuSeparator.svelte';
+export { default as ContextMenuLabel } from './components/context-menu/ContextMenuLabel.svelte';
+export { default as ContextMenuInfo } from './components/context-menu/ContextMenuInfo.svelte';
 export { default as Dialog } from './components/dialog/Dialog.svelte';
+export { default as Drawer } from './components/drawer/Drawer.svelte';
+export { default as EmptyState } from './components/empty-state/EmptyState.svelte';
+export { default as Entry } from './components/entry/Entry.svelte';
 export { default as Field } from './components/field/Field.svelte';
 export { default as FieldContent } from './components/field/FieldContent.svelte';
 export { default as FieldDescription } from './components/field/FieldDescription.svelte';
@@ -27,6 +36,9 @@ export { default as FieldGroup } from './components/field/FieldGroup.svelte';
 export { default as FieldLegend } from './components/field/FieldLegend.svelte';
 export { default as FieldSeparator } from './components/field/FieldSeparator.svelte';
 export { default as FieldSet } from './components/field/FieldSet.svelte';
+export { default as Footer } from './components/footer/Footer.svelte';
+export { default as FooterColumn } from './components/footer/FooterColumn.svelte';
+export { default as Image } from './components/image/Image.svelte';
 export { default as Input } from './components/input/Input.svelte';
 export { default as Kbd } from './components/kbd/Kbd.svelte';
 export { default as KbdGroup } from './components/kbd/KbdGroup.svelte';
@@ -34,13 +46,19 @@ export { default as InputGroup } from './components/input-group/InputGroup.svelt
 export { default as InputGroupAddon } from './components/input-group/InputGroupAddon.svelte';
 export { default as Label } from './components/label/Label.svelte';
 export { default as Link } from './components/link/Link.svelte';
+export { default as MeshGradient } from './components/mesh-gradient/MeshGradient.svelte';
 export { default as Navbar } from './components/navbar/Navbar.svelte';
 export { default as NavigationMenu } from './components/navigation-menu/NavigationMenu.svelte';
 export { default as NavigationMenuItem } from './components/navigation-menu/NavigationMenuItem.svelte';
 export { default as NavigationMenuLink } from './components/navigation-menu/NavigationMenuLink.svelte';
+export { default as NumberStepper } from './components/number-stepper/NumberStepper.svelte';
 export { default as Popover } from './components/popover/Popover.svelte';
+export { default as PreviewCard } from './components/preview-card/PreviewCard.svelte';
+export { default as Progress } from './components/progress/Progress.svelte';
 export { default as RadioGroup } from './components/radio-group/RadioGroup.svelte';
 export { default as RadioGroupItem } from './components/radio-group/RadioGroupItem.svelte';
+export { default as Section } from './components/section/Section.svelte';
+export { default as Select } from './components/select/Select.svelte';
 export { default as Separator } from './components/separator/Separator.svelte';
 export { default as Sidebar } from './components/sidebar/Sidebar.svelte';
 export { default as SidebarContent } from './components/sidebar/SidebarContent.svelte';
@@ -57,6 +75,7 @@ export { default as Skeleton } from './components/skeleton/Skeleton.svelte';
 export { default as Spinner } from './components/spinner/Spinner.svelte';
 export { default as Switch } from './components/switch/Switch.svelte';
 export { default as Table } from './components/table/Table.svelte';
+export { default as Tabs } from './components/tabs/Tabs.svelte';
 export { default as Textarea } from './components/textarea/Textarea.svelte';
 export { default as Toaster } from './components/toaster/Toaster.svelte';
 export { toast } from './components/toaster/toast.svelte.js';

package/dist/internal/icons/ArrowDown.svelte

@@ -0,0 +1,14 @@
+<script lang="ts">
+	import type { SVGAttributes } from 'svelte/elements';
+	import Icon from './Icon.svelte';
+
+	let props: SVGAttributes<SVGSVGElement> = $props();
+</script>
+
+<Icon
+	{...props}
+	nodes={[
+		['path', { d: 'M12 5v14' }],
+		['path', { d: 'm19 12-7 7-7-7' }]
+	]}
+/>

package/dist/internal/icons/ArrowDown.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { SVGAttributes } from 'svelte/elements';
+declare const ArrowDown: import("svelte").Component<SVGAttributes<SVGSVGElement>, {}, "">;
+type ArrowDown = ReturnType<typeof ArrowDown>;
+export default ArrowDown;

package/dist/internal/icons/ArrowUp.svelte

@@ -0,0 +1,14 @@
+<script lang="ts">
+	import type { SVGAttributes } from 'svelte/elements';
+	import Icon from './Icon.svelte';
+
+	let props: SVGAttributes<SVGSVGElement> = $props();
+</script>
+
+<Icon
+	{...props}
+	nodes={[
+		['path', { d: 'm5 12 7-7 7 7' }],
+		['path', { d: 'M12 19V5' }]
+	]}
+/>

package/dist/internal/icons/ArrowUp.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { SVGAttributes } from 'svelte/elements';
+declare const ArrowUp: import("svelte").Component<SVGAttributes<SVGSVGElement>, {}, "">;
+type ArrowUp = ReturnType<typeof ArrowUp>;
+export default ArrowUp;

package/dist/internal/icons/Calendar.svelte

@@ -0,0 +1,16 @@
+<script lang="ts">
+	import type { SVGAttributes } from 'svelte/elements';
+	import Icon from './Icon.svelte';
+
+	let props: SVGAttributes<SVGSVGElement> = $props();
+</script>
+
+<Icon
+	{...props}
+	nodes={[
+		['path', { d: 'M8 2v3' }],
+		['path', { d: 'M16 2v3' }],
+		['rect', { x: '3', y: '3', width: '18', height: '18', rx: '2' }],
+		['path', { d: 'M3 9h18' }]
+	]}
+/>

package/dist/internal/icons/Calendar.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { SVGAttributes } from 'svelte/elements';
+declare const Calendar: import("svelte").Component<SVGAttributes<SVGSVGElement>, {}, "">;
+type Calendar = ReturnType<typeof Calendar>;
+export default Calendar;

package/dist/internal/icons/Check.svelte

@@ -0,0 +1,8 @@
+<script lang="ts">
+	import type { SVGAttributes } from 'svelte/elements';
+	import Icon from './Icon.svelte';
+
+	let props: SVGAttributes<SVGSVGElement> = $props();
+</script>
+
+<Icon {...props} nodes={[['path', { d: 'M20 6 9 17l-5-5' }]]} />

package/dist/internal/icons/Check.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { SVGAttributes } from 'svelte/elements';
+declare const Check: import("svelte").Component<SVGAttributes<SVGSVGElement>, {}, "">;
+type Check = ReturnType<typeof Check>;
+export default Check;

package/dist/internal/icons/ChevronDown.svelte

@@ -0,0 +1,8 @@
+<script lang="ts">
+	import type { SVGAttributes } from 'svelte/elements';
+	import Icon from './Icon.svelte';
+
+	let props: SVGAttributes<SVGSVGElement> = $props();
+</script>
+
+<Icon {...props} nodes={[['path', { d: 'm6 9 6 6 6-6' }]]} />

package/dist/internal/icons/ChevronDown.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { SVGAttributes } from 'svelte/elements';
+declare const ChevronDown: import("svelte").Component<SVGAttributes<SVGSVGElement>, {}, "">;
+type ChevronDown = ReturnType<typeof ChevronDown>;
+export default ChevronDown;

package/dist/internal/icons/ChevronLeft.svelte

@@ -0,0 +1,8 @@
+<script lang="ts">
+	import type { SVGAttributes } from 'svelte/elements';
+	import Icon from './Icon.svelte';
+
+	let props: SVGAttributes<SVGSVGElement> = $props();
+</script>
+
+<Icon {...props} nodes={[['path', { d: 'm15 18-6-6 6-6' }]]} />

package/dist/internal/icons/ChevronLeft.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { SVGAttributes } from 'svelte/elements';
+declare const ChevronLeft: import("svelte").Component<SVGAttributes<SVGSVGElement>, {}, "">;
+type ChevronLeft = ReturnType<typeof ChevronLeft>;
+export default ChevronLeft;

package/dist/internal/icons/ChevronRight.svelte

@@ -0,0 +1,8 @@
+<script lang="ts">
+	import type { SVGAttributes } from 'svelte/elements';
+	import Icon from './Icon.svelte';
+
+	let props: SVGAttributes<SVGSVGElement> = $props();
+</script>
+
+<Icon {...props} nodes={[['path', { d: 'm9 18 6-6-6-6' }]]} />

package/dist/internal/icons/ChevronRight.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { SVGAttributes } from 'svelte/elements';
+declare const ChevronRight: import("svelte").Component<SVGAttributes<SVGSVGElement>, {}, "">;
+type ChevronRight = ReturnType<typeof ChevronRight>;
+export default ChevronRight;

package/dist/internal/icons/ChevronUp.svelte

@@ -0,0 +1,8 @@
+<script lang="ts">
+	import type { SVGAttributes } from 'svelte/elements';
+	import Icon from './Icon.svelte';
+
+	let props: SVGAttributes<SVGSVGElement> = $props();
+</script>
+
+<Icon {...props} nodes={[['path', { d: 'm18 15-6-6-6 6' }]]} />

package/dist/internal/icons/ChevronUp.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { SVGAttributes } from 'svelte/elements';
+declare const ChevronUp: import("svelte").Component<SVGAttributes<SVGSVGElement>, {}, "">;
+type ChevronUp = ReturnType<typeof ChevronUp>;
+export default ChevronUp;

package/dist/internal/icons/ChevronsUpDown.svelte

@@ -0,0 +1,14 @@
+<script lang="ts">
+	import type { SVGAttributes } from 'svelte/elements';
+	import Icon from './Icon.svelte';
+
+	let props: SVGAttributes<SVGSVGElement> = $props();
+</script>
+
+<Icon
+	{...props}
+	nodes={[
+		['path', { d: 'm7 15 5 5 5-5' }],
+		['path', { d: 'm7 9 5-5 5 5' }]
+	]}
+/>

package/dist/internal/icons/ChevronsUpDown.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { SVGAttributes } from 'svelte/elements';
+declare const ChevronsUpDown: import("svelte").Component<SVGAttributes<SVGSVGElement>, {}, "">;
+type ChevronsUpDown = ReturnType<typeof ChevronsUpDown>;
+export default ChevronsUpDown;

package/dist/internal/icons/Clock.svelte

@@ -0,0 +1,14 @@
+<script lang="ts">
+	import type { SVGAttributes } from 'svelte/elements';
+	import Icon from './Icon.svelte';
+
+	let props: SVGAttributes<SVGSVGElement> = $props();
+</script>
+
+<Icon
+	{...props}
+	nodes={[
+		['circle', { cx: '12', cy: '12', r: '10' }],
+		['path', { d: 'M12 6v6l4 2' }]
+	]}
+/>

package/dist/internal/icons/Clock.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { SVGAttributes } from 'svelte/elements';
+declare const Clock: import("svelte").Component<SVGAttributes<SVGSVGElement>, {}, "">;
+type Clock = ReturnType<typeof Clock>;
+export default Clock;