@dryui/ui 0.2.2 → 0.4.0

package/dist/file-upload/file-upload-button-item-delete.svelte

@@ -0,0 +1,36 @@
+<script lang="ts">
+	import type { Snippet } from 'svelte';
+	import type { HTMLButtonAttributes } from 'svelte/elements';
+	import CloseButtonBase from '../internal/close-button-base.svelte';
+	import { getFileUploadCtx } from './context.svelte.js';
+
+	interface Props extends Omit<HTMLButtonAttributes, 'children'> {
+		index: number;
+		children?: Snippet | undefined;
+	}
+
+	let { index, children, onclick, ...rest }: Props = $props();
+
+	const ctx = getFileUploadCtx();
+
+	function handleClick(e: MouseEvent & { currentTarget: HTMLButtonElement }) {
+		e.stopPropagation();
+		ctx.removeFile(index);
+		if (onclick) (onclick as (e: MouseEvent & { currentTarget: HTMLButtonElement }) => void)(e);
+	}
+</script>
+
+<CloseButtonBase aria-label="Remove file" disabled={ctx.disabled} {...rest} onclick={handleClick}>
+	{#if children}
+		{@render children()}
+	{:else}
+		<svg
+			xmlns="http://www.w3.org/2000/svg"
+			viewBox="0 0 24 24"
+			fill="none"
+			stroke="currentColor"
+			stroke-width="2"
+			aria-hidden="true"><path d="M18 6 6 18" /><path d="m6 6 12 12" /></svg
+		>
+	{/if}
+</CloseButtonBase>

package/dist/file-upload/file-upload-button-item-delete.svelte.d.ts

@@ -0,0 +1,9 @@
+import type { Snippet } from 'svelte';
+import type { HTMLButtonAttributes } from 'svelte/elements';
+interface Props extends Omit<HTMLButtonAttributes, 'children'> {
+    index: number;
+    children?: Snippet | undefined;
+}
+declare const FileUploadButtonItemDelete: import("svelte").Component<Props, {}, "">;
+type FileUploadButtonItemDelete = ReturnType<typeof FileUploadButtonItemDelete>;
+export default FileUploadButtonItemDelete;

package/dist/file-upload/file-upload-button-trigger.svelte

@@ -0,0 +1,31 @@
+<script lang="ts">
+	import type { Snippet } from 'svelte';
+	import type { HTMLButtonAttributes } from 'svelte/elements';
+	import Button from '../button/button.svelte';
+	import { getFileUploadCtx } from './context.svelte.js';
+
+	interface Props extends HTMLButtonAttributes {
+		size?: 'sm' | 'md' | 'lg';
+		children: Snippet;
+	}
+
+	let { children, onclick, size = 'md', ...rest }: Props = $props();
+
+	const ctx = getFileUploadCtx();
+
+	function handleClick(e: MouseEvent & { currentTarget: HTMLButtonElement }) {
+		if (!ctx.disabled) ctx.openFileDialog();
+		if (onclick) (onclick as (e: MouseEvent & { currentTarget: HTMLButtonElement }) => void)(e);
+	}
+</script>
+
+<Button
+	variant="solid"
+	type="button"
+	{size}
+	disabled={ctx.disabled}
+	onclick={handleClick}
+	{...rest}
+>
+	{@render children()}
+</Button>

package/dist/file-upload/file-upload-button-trigger.svelte.d.ts

@@ -0,0 +1,9 @@
+import type { Snippet } from 'svelte';
+import type { HTMLButtonAttributes } from 'svelte/elements';
+interface Props extends HTMLButtonAttributes {
+    size?: 'sm' | 'md' | 'lg';
+    children: Snippet;
+}
+declare const FileUploadButtonTrigger: import("svelte").Component<Props, {}, "">;
+type FileUploadButtonTrigger = ReturnType<typeof FileUploadButtonTrigger>;
+export default FileUploadButtonTrigger;

package/dist/file-upload/file-upload-dropzone.svelte.d.ts

@@ -1,9 +1,9 @@
 import type { Snippet } from 'svelte';
 import type { HTMLAttributes } from 'svelte/elements';
 interface Props extends HTMLAttributes<HTMLDivElement> {
-	size?: 'sm' | 'md' | 'lg';
-	children: Snippet;
+    size?: 'sm' | 'md' | 'lg';
+    children: Snippet;
 }
-declare const FileUploadDropzone: import('svelte').Component<Props, {}, ''>;
+declare const FileUploadDropzone: import("svelte").Component<Props, {}, "">;
 type FileUploadDropzone = ReturnType<typeof FileUploadDropzone>;
 export default FileUploadDropzone;

package/dist/file-upload/file-upload-input-root.svelte.d.ts

@@ -0,0 +1,14 @@
+import type { Snippet } from 'svelte';
+interface Props {
+    files?: File[];
+    accept?: string | undefined;
+    multiple?: boolean | undefined;
+    maxSize?: number | undefined;
+    maxFiles?: number | undefined;
+    disabled?: boolean | undefined;
+    onFilesChange?: ((files: File[]) => void) | undefined;
+    children: Snippet;
+}
+declare const FileUploadInputRoot: import("svelte").Component<Props, {}, "files">;
+type FileUploadInputRoot = ReturnType<typeof FileUploadInputRoot>;
+export default FileUploadInputRoot;

package/dist/file-upload/file-upload-item.svelte.d.ts

@@ -1,11 +1,11 @@
 import type { Snippet } from 'svelte';
 import type { HTMLAttributes } from 'svelte/elements';
 interface Props extends HTMLAttributes<HTMLLIElement> {
-	file: File;
-	index: number;
-	size?: 'sm' | 'md' | 'lg';
-	children?: Snippet;
+    file: File;
+    index: number;
+    size?: 'sm' | 'md' | 'lg';
+    children: Snippet;
 }
-declare const FileUploadItem: import('svelte').Component<Props, {}, ''>;
+declare const FileUploadItem: import("svelte").Component<Props, {}, "">;
 type FileUploadItem = ReturnType<typeof FileUploadItem>;
 export default FileUploadItem;

package/dist/file-upload/file-upload-list.svelte.d.ts

@@ -1,16 +1,12 @@
 import type { Snippet } from 'svelte';
 import type { HTMLAttributes } from 'svelte/elements';
 interface Props extends Omit<HTMLAttributes<HTMLUListElement>, 'children'> {
-	size?: 'sm' | 'md' | 'lg';
-	children: Snippet<
-		[
-			{
-				file: File;
-				index: number;
-			}
-		]
-	>;
+    size?: 'sm' | 'md' | 'lg';
+    children: Snippet<[{
+        file: File;
+        index: number;
+    }]>;
 }
-declare const FileUploadList: import('svelte').Component<Props, {}, ''>;
+declare const FileUploadList: import("svelte").Component<Props, {}, "">;
 type FileUploadList = ReturnType<typeof FileUploadList>;
 export default FileUploadList;

package/dist/file-upload/index.d.ts

@@ -16,12 +16,12 @@ export interface FileUploadItemProps extends Omit<PrimitiveFileUploadItemProps,
 }
 export interface FileUploadItemDeleteProps extends PrimitiveFileUploadItemDeleteProps {
 }
-import FileUploadRoot from './file-upload-root.svelte';
+import FileUploadRoot from './file-upload-input-root.svelte';
 import FileUploadDropzone from './file-upload-dropzone.svelte';
-import FileUploadTrigger from './file-upload-trigger.svelte';
+import FileUploadTrigger from './file-upload-button-trigger.svelte';
 import FileUploadList from './file-upload-list.svelte';
 import FileUploadItem from './file-upload-item.svelte';
-import FileUploadItemDelete from './file-upload-item-delete.svelte';
+import FileUploadItemDelete from './file-upload-button-item-delete.svelte';
 export declare const FileUpload: {
     Root: typeof FileUploadRoot;
     Dropzone: typeof FileUploadDropzone;

package/dist/file-upload/index.js

@@ -1,9 +1,9 @@
-import FileUploadRoot from './file-upload-root.svelte';
+import FileUploadRoot from './file-upload-input-root.svelte';
 import FileUploadDropzone from './file-upload-dropzone.svelte';
-import FileUploadTrigger from './file-upload-trigger.svelte';
+import FileUploadTrigger from './file-upload-button-trigger.svelte';
 import FileUploadList from './file-upload-list.svelte';
 import FileUploadItem from './file-upload-item.svelte';
-import FileUploadItemDelete from './file-upload-item-delete.svelte';
+import FileUploadItemDelete from './file-upload-button-item-delete.svelte';
 export const FileUpload = {
     Root: FileUploadRoot,
     Dropzone: FileUploadDropzone,

package/dist/flip-card/flip-card-back.svelte.d.ts

@@ -1,8 +1,8 @@
 import type { Snippet } from 'svelte';
 import type { HTMLAttributes } from 'svelte/elements';
 interface Props extends HTMLAttributes<HTMLDivElement> {
-	children: Snippet;
+    children: Snippet;
 }
-declare const FlipCardBack: import('svelte').Component<Props, {}, ''>;
+declare const FlipCardBack: import("svelte").Component<Props, {}, "">;
 type FlipCardBack = ReturnType<typeof FlipCardBack>;
 export default FlipCardBack;

package/dist/flip-card/flip-card-front.svelte.d.ts

@@ -1,8 +1,8 @@
 import type { Snippet } from 'svelte';
 import type { HTMLAttributes } from 'svelte/elements';
 interface Props extends HTMLAttributes<HTMLDivElement> {
-	children: Snippet;
+    children: Snippet;
 }
-declare const FlipCardFront: import('svelte').Component<Props, {}, ''>;
+declare const FlipCardFront: import("svelte").Component<Props, {}, "">;
 type FlipCardFront = ReturnType<typeof FlipCardFront>;
 export default FlipCardFront;

package/dist/flip-card/flip-card-root.svelte.d.ts

@@ -1,11 +1,11 @@
 import type { Snippet } from 'svelte';
 import type { HTMLAttributes } from 'svelte/elements';
 interface Props extends HTMLAttributes<HTMLDivElement> {
-	trigger?: 'hover' | 'click';
-	direction?: 'horizontal' | 'vertical';
-	flipped?: boolean;
-	children: Snippet;
+    trigger?: 'hover' | 'click';
+    direction?: 'horizontal' | 'vertical';
+    flipped?: boolean;
+    children: Snippet;
 }
-declare const FlipCardRoot: import('svelte').Component<Props, {}, ''>;
+declare const FlipCardRoot: import("svelte").Component<Props, {}, "flipped">;
 type FlipCardRoot = ReturnType<typeof FlipCardRoot>;
 export default FlipCardRoot;

package/dist/float-button/float-button-action.svelte

@@ -1,92 +1,26 @@
 <script lang="ts">
 	import type { Snippet } from 'svelte';
 	import type { HTMLButtonAttributes } from 'svelte/elements';
+	import Button from '../button/button.svelte';
 	import { getFloatButtonCtx } from './context.svelte.js';
 
 	interface Props extends HTMLButtonAttributes {
 		children: Snippet;
 	}
 
-	let { children, class: className, ...rest }: Props = $props();
+	let { children, ...rest }: Props = $props();
 
 	const ctx = getFloatButtonCtx();
 </script>
 
-<button
+<Button
+	variant="nav"
+	size="icon-sm"
 	type="button"
 	data-float-button-action
 	data-state={ctx.open ? 'open' : 'closed'}
 	tabindex={ctx.open ? 0 : -1}
 	{...rest}
-	class={className}
 >
 	{@render children()}
-</button>
-
-<style>
-	[data-float-button-action] {
-		--dry-fab-action-bg: var(--dry-color-bg-overlay);
-		--dry-fab-action-color: var(--dry-color-text-strong);
-		--dry-fab-action-border: var(--dry-color-stroke-weak);
-		--dry-fab-action-shadow: var(--dry-shadow-md);
-		--dry-fab-action-size: 44px;
-
-		display: grid;
-		place-items: center;
-		height: var(--dry-fab-action-size);
-		aspect-ratio: 1;
-		padding: 0;
-		background: var(--dry-fab-action-bg);
-		color: var(--dry-fab-action-color);
-		border: 1px solid var(--dry-fab-action-border);
-		border-radius: 50%;
-		box-shadow: var(--dry-fab-action-shadow);
-		cursor: pointer;
-		opacity: 0;
-		transform: scale(0.6) translateY(var(--dry-motion-distance-xs));
-		pointer-events: none;
-		transition:
-			opacity var(--dry-duration-normal) var(--dry-ease-default),
-			transform var(--dry-duration-normal) var(--dry-ease-default);
-
-		&[data-state='open'] {
-			opacity: 1;
-			transform: scale(1) translateY(0);
-			pointer-events: auto;
-		}
-
-		&[data-state='open']:nth-last-child(2) {
-			transition-delay: 0ms;
-		}
-		&[data-state='open']:nth-last-child(3) {
-			transition-delay: 30ms;
-		}
-		&[data-state='open']:nth-last-child(4) {
-			transition-delay: 60ms;
-		}
-		&[data-state='open']:nth-last-child(5) {
-			transition-delay: 90ms;
-		}
-		&[data-state='open']:nth-last-child(6) {
-			transition-delay: 120ms;
-		}
-
-		&:hover {
-			--dry-fab-action-bg: color-mix(
-				in srgb,
-				var(--dry-color-fill-brand) 8%,
-				var(--dry-color-bg-overlay)
-			);
-			--dry-fab-action-color: var(--dry-color-fill-brand);
-		}
-
-		&:focus-visible {
-			outline: 2px solid var(--dry-color-focus-ring);
-			outline-offset: 2px;
-		}
-
-		&[data-state='open']:active {
-			transform: scale(0.9) translateY(0);
-		}
-	}
-</style>
+</Button>

package/dist/float-button/float-button-action.svelte.d.ts

@@ -1,8 +1,8 @@
 import type { Snippet } from 'svelte';
 import type { HTMLButtonAttributes } from 'svelte/elements';
 interface Props extends HTMLButtonAttributes {
-	children: Snippet;
+    children: Snippet;
 }
-declare const FloatButtonAction: import('svelte').Component<Props, {}, ''>;
+declare const FloatButtonAction: import("svelte").Component<Props, {}, "">;
 type FloatButtonAction = ReturnType<typeof FloatButtonAction>;
 export default FloatButtonAction;

package/dist/float-button/float-button-root.svelte.d.ts

@@ -1,10 +1,10 @@
 import type { Snippet } from 'svelte';
 import type { HTMLAttributes } from 'svelte/elements';
 interface Props extends HTMLAttributes<HTMLDivElement> {
-	open?: boolean;
-	position?: 'bottom-right' | 'bottom-left';
-	children: Snippet;
+    open?: boolean;
+    position?: 'bottom-right' | 'bottom-left';
+    children: Snippet;
 }
-declare const FloatButtonRoot: import('svelte').Component<Props, {}, 'open'>;
+declare const FloatButtonRoot: import("svelte").Component<Props, {}, "open">;
 type FloatButtonRoot = ReturnType<typeof FloatButtonRoot>;
 export default FloatButtonRoot;

package/dist/float-button/float-button-trigger.svelte

@@ -1,6 +1,7 @@
 <script lang="ts">
 	import type { Snippet } from 'svelte';
 	import type { HTMLButtonAttributes } from 'svelte/elements';
+	import Button from '../button/button.svelte';
 	import { getFloatButtonCtx } from './context.svelte.js';
 
 	interface Props extends HTMLButtonAttributes {
@@ -8,79 +9,22 @@
 		children: Snippet;
 	}
 
-	let { children, class: className, size = 'md', ...rest }: Props = $props();
+	let { children, size = 'md', ...rest }: Props = $props();
 
 	const ctx = getFloatButtonCtx();
+
+	const btnSize = $derived(size === 'sm' ? 'icon-sm' : size === 'lg' ? 'icon-lg' : 'icon');
 </script>
 
-<button
+<Button
+	variant="solid"
+	size={btnSize}
 	type="button"
 	aria-expanded={ctx.open}
 	data-state={ctx.open ? 'open' : 'closed'}
 	data-float-button-trigger
-	data-size={size}
-	class={className}
 	onclick={() => ctx.toggle()}
 	{...rest}
 >
 	{@render children()}
-</button>
-
-<style>
-	[data-float-button-trigger] {
-		--dry-fab-bg: var(--dry-color-fill-brand);
-		--dry-fab-color: var(--dry-color-on-brand);
-		--dry-fab-shadow: var(--dry-shadow-lg);
-
-		display: grid;
-		place-items: center;
-		padding: 0;
-		background: var(--dry-fab-bg);
-		color: var(--dry-fab-color);
-		border: none;
-		border-radius: 50%;
-		box-shadow: var(--dry-fab-shadow);
-		cursor: pointer;
-		transition:
-			background var(--dry-duration-fast) var(--dry-ease-default),
-			transform var(--dry-duration-fast) var(--dry-ease-default),
-			box-shadow var(--dry-duration-fast) var(--dry-ease-default);
-
-		&:hover {
-			--dry-fab-bg: var(--dry-color-fill-brand-hover);
-			box-shadow: var(--dry-shadow-xl);
-		}
-
-		&:focus-visible {
-			outline: 2px solid var(--dry-color-focus-ring);
-			outline-offset: 2px;
-		}
-
-		&:active {
-			transform: scale(0.95);
-		}
-
-		&[data-state='open'] {
-			transform: rotate(45deg);
-		}
-
-		&[data-state='open']:active {
-			transform: rotate(45deg) scale(0.95);
-		}
-	}
-
-	[data-float-button-trigger][data-size='sm'] {
-		height: 44px;
-		aspect-ratio: 1;
-	}
-
-	[data-float-button-trigger][data-size='md'] {
-		height: 52px;
-		aspect-ratio: 1;
-	}
-
-	[data-float-button-trigger][data-size='lg'] {
-		height: 60px;
-		aspect-ratio: 1;
-	}
-</style>
+</Button>

package/dist/float-button/float-button-trigger.svelte.d.ts

@@ -1,9 +1,9 @@
 import type { Snippet } from 'svelte';
 import type { HTMLButtonAttributes } from 'svelte/elements';
 interface Props extends HTMLButtonAttributes {
-	size?: 'sm' | 'md' | 'lg';
-	children: Snippet;
+    size?: 'sm' | 'md' | 'lg';
+    children: Snippet;
 }
-declare const FloatButtonTrigger: import('svelte').Component<Props, {}, ''>;
+declare const FloatButtonTrigger: import("svelte").Component<Props, {}, "">;
 type FloatButtonTrigger = ReturnType<typeof FloatButtonTrigger>;
 export default FloatButtonTrigger;

package/dist/focus-trap/focus-trap.svelte.d.ts

@@ -1,11 +1,11 @@
 import type { Snippet } from 'svelte';
 import type { HTMLAttributes } from 'svelte/elements';
 interface Props extends HTMLAttributes<HTMLDivElement> {
-	active?: boolean;
-	initialFocus?: string;
-	returnFocus?: boolean;
-	children?: Snippet;
+    active?: boolean;
+    initialFocus?: string;
+    returnFocus?: boolean;
+    children?: Snippet;
 }
-declare const FocusTrap: import('svelte').Component<Props, {}, ''>;
+declare const FocusTrap: import("svelte").Component<Props, {}, "">;
 type FocusTrap = ReturnType<typeof FocusTrap>;
 export default FocusTrap;

package/dist/format-bytes/format-bytes.svelte.d.ts

@@ -1,10 +1,10 @@
 import type { HTMLAttributes } from 'svelte/elements';
 interface Props extends HTMLAttributes<HTMLSpanElement> {
-	value: number;
-	locale?: string;
-	unit?: 'byte' | 'bit';
-	display?: 'short' | 'long' | 'narrow';
+    value: number;
+    locale?: string;
+    unit?: 'byte' | 'bit';
+    display?: 'short' | 'long' | 'narrow';
 }
-declare const FormatBytes: import('svelte').Component<Props, {}, ''>;
+declare const FormatBytes: import("svelte").Component<Props, {}, "">;
 type FormatBytes = ReturnType<typeof FormatBytes>;
 export default FormatBytes;

package/dist/format-date/format-date.svelte.d.ts

@@ -1,21 +1,21 @@
 import type { HTMLAttributes } from 'svelte/elements';
 interface Props extends HTMLAttributes<HTMLTimeElement> {
-	date: Date | string | number;
-	locale?: string;
-	weekday?: 'long' | 'short' | 'narrow';
-	era?: 'long' | 'short' | 'narrow';
-	year?: 'numeric' | '2-digit';
-	month?: 'numeric' | '2-digit' | 'long' | 'short' | 'narrow';
-	day?: 'numeric' | '2-digit';
-	hour?: 'numeric' | '2-digit';
-	minute?: 'numeric' | '2-digit';
-	second?: 'numeric' | '2-digit';
-	timeZoneName?: 'long' | 'short';
-	timeZone?: string;
-	hourCycle?: 'h11' | 'h12' | 'h23' | 'h24';
-	dateStyle?: 'full' | 'long' | 'medium' | 'short';
-	timeStyle?: 'full' | 'long' | 'medium' | 'short';
+    date: Date | string | number;
+    locale?: string;
+    weekday?: 'long' | 'short' | 'narrow';
+    era?: 'long' | 'short' | 'narrow';
+    year?: 'numeric' | '2-digit';
+    month?: 'numeric' | '2-digit' | 'long' | 'short' | 'narrow';
+    day?: 'numeric' | '2-digit';
+    hour?: 'numeric' | '2-digit';
+    minute?: 'numeric' | '2-digit';
+    second?: 'numeric' | '2-digit';
+    timeZoneName?: 'long' | 'short';
+    timeZone?: string;
+    hourCycle?: 'h11' | 'h12' | 'h23' | 'h24';
+    dateStyle?: 'full' | 'long' | 'medium' | 'short';
+    timeStyle?: 'full' | 'long' | 'medium' | 'short';
 }
-declare const FormatDate: import('svelte').Component<Props, {}, ''>;
+declare const FormatDate: import("svelte").Component<Props, {}, "">;
 type FormatDate = ReturnType<typeof FormatDate>;
 export default FormatDate;

package/dist/format-number/format-number.svelte.d.ts

@@ -1,17 +1,17 @@
 import type { HTMLAttributes } from 'svelte/elements';
 interface Props extends HTMLAttributes<HTMLSpanElement> {
-	value: number;
-	locale?: string;
-	type?: 'decimal' | 'currency' | 'percent' | 'unit';
-	currency?: string;
-	unit?: string;
-	notation?: 'standard' | 'scientific' | 'engineering' | 'compact';
-	minimumFractionDigits?: number;
-	maximumFractionDigits?: number;
-	minimumIntegerDigits?: number;
-	minimumSignificantDigits?: number;
-	maximumSignificantDigits?: number;
+    value: number;
+    locale?: string;
+    type?: 'decimal' | 'currency' | 'percent' | 'unit';
+    currency?: string;
+    unit?: string;
+    notation?: 'standard' | 'scientific' | 'engineering' | 'compact';
+    minimumFractionDigits?: number;
+    maximumFractionDigits?: number;
+    minimumIntegerDigits?: number;
+    minimumSignificantDigits?: number;
+    maximumSignificantDigits?: number;
 }
-declare const FormatNumber: import('svelte').Component<Props, {}, ''>;
+declare const FormatNumber: import("svelte").Component<Props, {}, "">;
 type FormatNumber = ReturnType<typeof FormatNumber>;
 export default FormatNumber;

package/dist/gauge/gauge.svelte.d.ts

@@ -1,25 +1,21 @@
 import type { Snippet } from 'svelte';
 import type { SVGAttributes } from 'svelte/elements';
 interface Props extends SVGAttributes<SVGSVGElement> {
-	value: number;
-	min?: number;
-	max?: number;
-	startAngle?: number;
-	endAngle?: number;
-	thresholds?: {
-		value: number;
-		color: string;
-	}[];
-	label?: Snippet<
-		[
-			{
-				value: number;
-				percentage: number;
-			}
-		]
-	>;
-	children?: Snippet;
+    value: number;
+    min?: number;
+    max?: number;
+    startAngle?: number;
+    endAngle?: number;
+    thresholds?: {
+        value: number;
+        color: string;
+    }[];
+    label?: Snippet<[{
+        value: number;
+        percentage: number;
+    }]>;
+    children?: Snippet;
 }
-declare const Gauge: import('svelte').Component<Props, {}, ''>;
+declare const Gauge: import("svelte").Component<Props, {}, "">;
 type Gauge = ReturnType<typeof Gauge>;
 export default Gauge;

package/dist/glass/glass.svelte.d.ts

@@ -1,11 +1,11 @@
+import type { Snippet } from 'svelte';
 import type { HTMLAttributes } from 'svelte/elements';
-import { type GlassProps as PrimitiveGlassProps } from '@dryui/primitives/glass';
 interface Props extends HTMLAttributes<HTMLDivElement> {
-	blur?: PrimitiveGlassProps['blur'];
-	tint?: PrimitiveGlassProps['tint'];
-	saturation?: PrimitiveGlassProps['saturation'];
-	children: PrimitiveGlassProps['children'];
+    blur?: number;
+    tint?: string;
+    saturation?: number;
+    children: Snippet;
 }
-declare const Glass: import('svelte').Component<Props, {}, ''>;
+declare const Glass: import("svelte").Component<Props, {}, "">;
 type Glass = ReturnType<typeof Glass>;
 export default Glass;