@sprawlify/svelte 0.0.45 → 0.0.47

package/dist/components/carousel/carousel-anatomy.d.ts

@@ -1 +1 @@
-export declare const carouselAnatomy: import("@sprawlify/primitives/anatomy").AnatomyInstance<"root" | "item" | "control" | "indicator" | "nextTrigger" | "prevTrigger" | "itemGroup" | "indicatorGroup" | "autoplayTrigger" | "progressText" | "autoplayIndicator">;
+export declare const carouselAnatomy: import("@sprawlify/primitives/anatomy").AnatomyInstance<"root" | "item" | "control" | "indicator" | "prevTrigger" | "nextTrigger" | "itemGroup" | "indicatorGroup" | "autoplayTrigger" | "progressText" | "autoplayIndicator">;

package/dist/components/color-picker/color-picker-anatomy.d.ts

@@ -1 +1 @@
-export declare const colorPickerAnatomy: import("@sprawlify/primitives/anatomy").AnatomyInstance<"label" | "area" | "view" | "root" | "content" | "trigger" | "control" | "valueText" | "positioner" | "areaThumb" | "areaBackground" | "channelSlider" | "channelSliderLabel" | "channelSliderTrack" | "channelSliderThumb" | "channelSliderValueText" | "channelInput" | "transparencyGrid" | "swatchGroup" | "swatchTrigger" | "swatchIndicator" | "swatch" | "eyeDropperTrigger" | "formatTrigger" | "formatSelect">;
+export declare const colorPickerAnatomy: import("@sprawlify/primitives/anatomy").AnatomyInstance<"label" | "area" | "view" | "root" | "content" | "trigger" | "control" | "valueText" | "positioner" | "formatSelect" | "areaThumb" | "channelInput" | "channelSliderTrack" | "channelSliderThumb" | "areaBackground" | "channelSlider" | "channelSliderLabel" | "channelSliderValueText" | "transparencyGrid" | "swatchGroup" | "swatchTrigger" | "swatchIndicator" | "swatch" | "eyeDropperTrigger" | "formatTrigger">;

package/dist/components/combobox/combobox-anatomy.d.ts

@@ -1 +1 @@
-export declare const comboboxAnatomy: import("@sprawlify/primitives/anatomy").AnatomyInstance<"label" | "input" | "root" | "content" | "trigger" | "list" | "item" | "control" | "itemGroup" | "positioner" | "itemIndicator" | "itemText" | "clearTrigger" | "itemGroupLabel" | "empty">;
+export declare const comboboxAnatomy: import("@sprawlify/primitives/anatomy").AnatomyInstance<"label" | "input" | "root" | "content" | "trigger" | "list" | "item" | "control" | "itemGroup" | "positioner" | "itemText" | "itemIndicator" | "clearTrigger" | "itemGroupLabel" | "empty">;

package/dist/components/combobox/combobox-root-provider.svelte

@@ -1,8 +1,8 @@
 <script lang="ts" module>
   import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
   import type { Snippet } from 'svelte'
-  import type { CollectionItem } from '../collection/index.js'
-  import type { UsePresenceProps } from '../presence/use-presence.svelte.js'
+  import type { CollectionItem } from '../collection'
+  import type { UsePresenceProps } from '../presence/use-presence.svelte'
   import type { UseComboboxReturn } from './use-combobox.svelte.js'
 
   interface RootProviderProps<T extends CollectionItem> {

package/dist/components/combobox/combobox-root-provider.svelte.d.ts

@@ -1,7 +1,7 @@
 import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
 import type { Snippet } from 'svelte';
-import type { CollectionItem } from '../collection/index.js';
-import type { UsePresenceProps } from '../presence/use-presence.svelte.js';
+import type { CollectionItem } from '../collection';
+import type { UsePresenceProps } from '../presence/use-presence.svelte';
 import type { UseComboboxReturn } from './use-combobox.svelte.js';
 interface RootProviderProps<T extends CollectionItem> {
     value: UseComboboxReturn<T>;

package/dist/components/date-picker/date-picker-anatomy.d.ts

@@ -1 +1 @@
-export declare const datePickerAnatomy: import("@sprawlify/primitives/anatomy").AnatomyInstance<"label" | "input" | "table" | "view" | "root" | "content" | "trigger" | "control" | "nextTrigger" | "prevTrigger" | "positioner" | "clearTrigger" | "monthSelect" | "presetTrigger" | "rangeText" | "tableBody" | "tableCell" | "tableCellTrigger" | "tableHead" | "tableHeader" | "tableRow" | "viewControl" | "viewTrigger" | "yearSelect">;
+export declare const datePickerAnatomy: import("@sprawlify/primitives/anatomy").AnatomyInstance<"label" | "input" | "table" | "view" | "root" | "content" | "trigger" | "control" | "prevTrigger" | "nextTrigger" | "positioner" | "clearTrigger" | "monthSelect" | "presetTrigger" | "rangeText" | "tableBody" | "tableCell" | "tableCellTrigger" | "tableHead" | "tableHeader" | "tableRow" | "viewControl" | "viewTrigger" | "yearSelect">;

package/dist/components/date-picker/date-picker-root.svelte

@@ -57,6 +57,7 @@
       'onOpenChange',
       'onValueChange',
       'onViewChange',
+      "onVisibleRangeChange",
       'open',
       'outsideDaySelectable',
       'parse',

package/dist/components/editable/editable-root-provider.svelte

@@ -16,7 +16,6 @@
   let { ref = $bindable(null), value, ...props }: EditableRootProviderProps = $props()
 
   EditableProvider(value)
-
   const mergedProps = $derived(mergeProps(value().getRootProps(), props))
 </script>
 

package/dist/components/file-upload/file-upload-anatomy.d.ts

@@ -0,0 +1 @@
+export { anatomy as fileUploadAnatomy } from '@sprawlify/primitives/machines/file-upload';

package/dist/components/file-upload/file-upload-anatomy.js

@@ -0,0 +1 @@
+export { anatomy as fileUploadAnatomy } from '@sprawlify/primitives/machines/file-upload';

package/dist/components/file-upload/file-upload-clear-trigger.svelte

@@ -0,0 +1,18 @@
+<script module lang="ts">
+  import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
+
+  export interface FileUploadClearTriggerBaseProps extends PolymorphicProps<'button'>, RefAttribute {}
+  export interface FileUploadClearTriggerProps extends Assign<HTMLProps<'button'>, FileUploadClearTriggerBaseProps> {}
+</script>
+
+<script lang="ts">
+  import { mergeProps } from '../../core'
+  import { Sprawlify } from '../factory'
+  import { useFileUploadContext } from './use-file-upload-context'
+
+  let { ref = $bindable(null), ...props }: FileUploadClearTriggerProps = $props()
+  const fileUpload = useFileUploadContext()
+  const mergedProps = $derived(mergeProps(fileUpload().getClearTriggerProps(), props))
+</script>
+
+<Sprawlify as="button" bind:ref {...mergedProps} />

package/dist/components/file-upload/file-upload-clear-trigger.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+export interface FileUploadClearTriggerBaseProps extends PolymorphicProps<'button'>, RefAttribute {
+}
+export interface FileUploadClearTriggerProps extends Assign<HTMLProps<'button'>, FileUploadClearTriggerBaseProps> {
+}
+declare const FileUploadClearTrigger: import("svelte").Component<FileUploadClearTriggerProps, {}, "ref">;
+type FileUploadClearTrigger = ReturnType<typeof FileUploadClearTrigger>;
+export default FileUploadClearTrigger;

package/dist/components/file-upload/file-upload-context.svelte

@@ -0,0 +1,18 @@
+<script module lang="ts">
+  import type { Snippet } from 'svelte'
+  import type { UseFileUploadContext } from './use-file-upload-context'
+
+  export interface FileUploadContextProps {
+    render?: Snippet<[UseFileUploadContext]>
+  }
+</script>
+
+<script lang="ts">
+  import { useFileUploadContext } from './use-file-upload-context'
+
+  const { render }: FileUploadContextProps = $props()
+
+  const context = useFileUploadContext()
+</script>
+
+{@render render?.(context)}

package/dist/components/file-upload/file-upload-context.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { Snippet } from 'svelte';
+import type { UseFileUploadContext } from './use-file-upload-context';
+export interface FileUploadContextProps {
+    render?: Snippet<[UseFileUploadContext]>;
+}
+declare const FileUploadContext: import("svelte").Component<FileUploadContextProps, {}, "">;
+type FileUploadContext = ReturnType<typeof FileUploadContext>;
+export default FileUploadContext;

package/dist/components/file-upload/file-upload-dropzone.svelte

@@ -0,0 +1,23 @@
+<script module lang="ts">
+  import type { DropzoneProps } from '@sprawlify/primitives/machines/file-upload'
+  import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
+
+  export interface FileUploadDropzoneBaseProps extends PolymorphicProps<'div'>, DropzoneProps, RefAttribute {}
+  export interface FileUploadDropzoneProps extends Assign<HTMLProps<'div'>, FileUploadDropzoneBaseProps> {}
+</script>
+
+<script lang="ts">
+  import { mergeProps } from '../../core'
+  import { createSplitProps } from '../../utils/create-split-props'
+  import { Sprawlify } from '../factory'
+  import { useFileUploadContext } from './use-file-upload-context'
+
+  let { ref = $bindable(null), ...props }: FileUploadDropzoneProps = $props()
+  const fileUpload = useFileUploadContext()
+
+  const [dropzoneProps, localProps] = $derived(createSplitProps<DropzoneProps>()(props, ['disableClick']))
+
+  const mergedProps = $derived(mergeProps(fileUpload().getDropzoneProps(dropzoneProps), localProps))
+</script>
+
+<Sprawlify as="div" bind:ref {...mergedProps} />

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

@@ -0,0 +1,9 @@
+import type { DropzoneProps } from '@sprawlify/primitives/machines/file-upload';
+import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+export interface FileUploadDropzoneBaseProps extends PolymorphicProps<'div'>, DropzoneProps, RefAttribute {
+}
+export interface FileUploadDropzoneProps extends Assign<HTMLProps<'div'>, FileUploadDropzoneBaseProps> {
+}
+declare const FileUploadDropzone: import("svelte").Component<FileUploadDropzoneProps, {}, "ref">;
+type FileUploadDropzone = ReturnType<typeof FileUploadDropzone>;
+export default FileUploadDropzone;

package/dist/components/file-upload/file-upload-hidden-input.svelte

@@ -0,0 +1,18 @@
+<script module lang="ts">
+  import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
+
+  export interface FileUploadHiddenInputBaseProps extends PolymorphicProps<'input'>, RefAttribute {}
+  export interface FileUploadHiddenInputProps extends Assign<HTMLProps<'input'>, FileUploadHiddenInputBaseProps> {}
+</script>
+
+<script lang="ts">
+  import { mergeProps } from '../../core'
+  import { Sprawlify } from '../factory'
+  import { useFileUploadContext } from './use-file-upload-context'
+
+  let { ref = $bindable(null), ...props }: FileUploadHiddenInputProps = $props()
+  const fileUpload = useFileUploadContext()
+  const mergedProps = $derived(mergeProps(fileUpload().getHiddenInputProps(), props))
+</script>
+
+<Sprawlify as="input" bind:ref {...mergedProps} />

package/dist/components/file-upload/file-upload-hidden-input.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+export interface FileUploadHiddenInputBaseProps extends PolymorphicProps<'input'>, RefAttribute {
+}
+export interface FileUploadHiddenInputProps extends Assign<HTMLProps<'input'>, FileUploadHiddenInputBaseProps> {
+}
+declare const FileUploadHiddenInput: import("svelte").Component<FileUploadHiddenInputProps, {}, "ref">;
+type FileUploadHiddenInput = ReturnType<typeof FileUploadHiddenInput>;
+export default FileUploadHiddenInput;

package/dist/components/file-upload/file-upload-item-delete-trigger.svelte

@@ -0,0 +1,21 @@
+<script module lang="ts">
+  import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
+
+  export interface FileUploadItemDeleteTriggerBaseProps extends PolymorphicProps<'button'>, RefAttribute {}
+  export interface FileUploadItemDeleteTriggerProps
+    extends Assign<HTMLProps<'button'>, FileUploadItemDeleteTriggerBaseProps> {}
+</script>
+
+<script lang="ts">
+  import { mergeProps } from '../../core'
+  import { Sprawlify } from '../factory'
+  import { useFileUploadContext } from './use-file-upload-context'
+  import { useFileUploadItemPropsContext } from './use-file-upload-item-props-context'
+
+  let { ref = $bindable(null), ...props }: FileUploadItemDeleteTriggerProps = $props()
+  const fileUpload = useFileUploadContext()
+  const itemProps = useFileUploadItemPropsContext()
+  const mergedProps = $derived(mergeProps(fileUpload().getItemDeleteTriggerProps(itemProps()), props))
+</script>
+
+<Sprawlify as="button" bind:ref {...mergedProps} />

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

@@ -0,0 +1,8 @@
+import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+export interface FileUploadItemDeleteTriggerBaseProps extends PolymorphicProps<'button'>, RefAttribute {
+}
+export interface FileUploadItemDeleteTriggerProps extends Assign<HTMLProps<'button'>, FileUploadItemDeleteTriggerBaseProps> {
+}
+declare const FileUploadItemDeleteTrigger: import("svelte").Component<FileUploadItemDeleteTriggerProps, {}, "ref">;
+type FileUploadItemDeleteTrigger = ReturnType<typeof FileUploadItemDeleteTrigger>;
+export default FileUploadItemDeleteTrigger;

package/dist/components/file-upload/file-upload-item-group.svelte

@@ -0,0 +1,25 @@
+<script module lang="ts">
+  import type { ItemGroupProps } from '@sprawlify/primitives/machines/file-upload'
+  import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
+
+  export interface FileUploadItemGroupBaseProps extends PolymorphicProps<'div'>, RefAttribute, ItemGroupProps {}
+  export interface FileUploadItemGroupProps extends Assign<HTMLProps<'div'>, FileUploadItemGroupBaseProps> {}
+</script>
+
+<script lang="ts">
+  import { mergeProps } from '../../core'
+  import { Sprawlify } from '../factory'
+  import { useFileUploadContext } from './use-file-upload-context'
+  import { FileUploadItemGroupPropsProvider } from './use-file-upload-item-group-props-context'
+  import { createSplitProps } from '../../utils/create-split-props'
+
+  let { ref = $bindable(null), ...props }: FileUploadItemGroupProps = $props()
+  const fileUpload = useFileUploadContext()
+
+  const [itemGroupProps, localProps] = $derived(createSplitProps<ItemGroupProps>()(props, ['type']))
+  const mergedProps = $derived(mergeProps(fileUpload().getItemGroupProps(itemGroupProps), localProps))
+
+  FileUploadItemGroupPropsProvider(() => itemGroupProps)
+</script>
+
+<Sprawlify as="div" bind:ref {...mergedProps} />

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

@@ -0,0 +1,9 @@
+import type { ItemGroupProps } from '@sprawlify/primitives/machines/file-upload';
+import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+export interface FileUploadItemGroupBaseProps extends PolymorphicProps<'div'>, RefAttribute, ItemGroupProps {
+}
+export interface FileUploadItemGroupProps extends Assign<HTMLProps<'div'>, FileUploadItemGroupBaseProps> {
+}
+declare const FileUploadItemGroup: import("svelte").Component<FileUploadItemGroupProps, {}, "ref">;
+type FileUploadItemGroup = ReturnType<typeof FileUploadItemGroup>;
+export default FileUploadItemGroup;

package/dist/components/file-upload/file-upload-item-name.svelte

@@ -0,0 +1,26 @@
+<script module lang="ts">
+  import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
+
+  export interface FileUploadItemNameBaseProps extends PolymorphicProps<'div'>, RefAttribute {}
+  export interface FileUploadItemNameProps extends Assign<HTMLProps<'div'>, FileUploadItemNameBaseProps> {}
+</script>
+
+<script lang="ts">
+  import { mergeProps } from '../../core'
+  import { Sprawlify } from '../factory'
+  import { useFileUploadContext } from './use-file-upload-context'
+  import { useFileUploadItemPropsContext } from './use-file-upload-item-props-context'
+
+  let { ref = $bindable(null), ...props }: FileUploadItemNameProps = $props()
+  const fileUpload = useFileUploadContext()
+  const itemProps = useFileUploadItemPropsContext()
+  const mergedProps = $derived(mergeProps(fileUpload().getItemNameProps(itemProps()), props))
+</script>
+
+<Sprawlify as="div" bind:ref {...mergedProps}>
+  {#if props.children}
+    {@render props.children?.()}
+  {:else}
+    {itemProps().file.name}
+  {/if}
+</Sprawlify>

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

@@ -0,0 +1,8 @@
+import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+export interface FileUploadItemNameBaseProps extends PolymorphicProps<'div'>, RefAttribute {
+}
+export interface FileUploadItemNameProps extends Assign<HTMLProps<'div'>, FileUploadItemNameBaseProps> {
+}
+declare const FileUploadItemName: import("svelte").Component<FileUploadItemNameProps, {}, "ref">;
+type FileUploadItemName = ReturnType<typeof FileUploadItemName>;
+export default FileUploadItemName;

package/dist/components/file-upload/file-upload-item-preview-image.svelte

@@ -0,0 +1,32 @@
+<script module lang="ts">
+  import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
+
+  export interface FileUploadItemPreviewImageBaseProps extends PolymorphicProps<'img'>, RefAttribute {}
+  export interface FileUploadItemPreviewImageProps
+    extends Assign<HTMLProps<'img'>, FileUploadItemPreviewImageBaseProps> {}
+</script>
+
+<script lang="ts">
+  import { mergeProps } from '../../core'
+  import { Sprawlify } from '../factory'
+  import { useFileUploadContext } from './use-file-upload-context'
+  import { useFileUploadItemPropsContext } from './use-file-upload-item-props-context'
+
+  let { ref = $bindable(null), ...props }: FileUploadItemPreviewImageProps = $props()
+
+  let url = $state('')
+  const fileUpload = useFileUploadContext()
+  const itemProps = useFileUploadItemPropsContext()
+
+  $effect(() => {
+    return fileUpload().createFileUrl(itemProps().file, (nextUrl) => {
+      url = nextUrl
+    })
+  })
+
+  const mergedProps = $derived(mergeProps(fileUpload().getItemPreviewImageProps({ ...itemProps(), url }), props))
+</script>
+
+{#if url}
+  <Sprawlify as="img" bind:ref {...mergedProps} />
+{/if}

package/dist/components/file-upload/file-upload-item-preview-image.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+export interface FileUploadItemPreviewImageBaseProps extends PolymorphicProps<'img'>, RefAttribute {
+}
+export interface FileUploadItemPreviewImageProps extends Assign<HTMLProps<'img'>, FileUploadItemPreviewImageBaseProps> {
+}
+declare const FileUploadItemPreviewImage: import("svelte").Component<FileUploadItemPreviewImageProps, {}, "ref">;
+type FileUploadItemPreviewImage = ReturnType<typeof FileUploadItemPreviewImage>;
+export default FileUploadItemPreviewImage;

package/dist/components/file-upload/file-upload-item-preview.svelte

@@ -0,0 +1,26 @@
+<script module lang="ts">
+  import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
+
+  export interface FileUploadItemPreviewBaseProps extends PolymorphicProps<'div'>, RefAttribute {
+    type?: string
+  }
+  export interface FileUploadItemPreviewProps extends Assign<HTMLProps<'div'>, FileUploadItemPreviewBaseProps> {}
+</script>
+
+<script lang="ts">
+  import { mergeProps } from '../../core'
+  import { Sprawlify } from '../factory'
+  import { useFileUploadContext } from './use-file-upload-context'
+  import { useFileUploadItemPropsContext } from './use-file-upload-item-props-context'
+
+  let { ref = $bindable(null), type, ...props }: FileUploadItemPreviewProps = $props()
+  const fileUpload = useFileUploadContext()
+  const itemProps = useFileUploadItemPropsContext()
+  const mergedProps = $derived(mergeProps(fileUpload().getItemPreviewProps(itemProps()), props))
+
+  const shouldRender = $derived(itemProps().file.type.match(type ?? '.*'))
+</script>
+
+{#if shouldRender}
+  <Sprawlify as="div" bind:ref {...mergedProps} />
+{/if}

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

@@ -0,0 +1,9 @@
+import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+export interface FileUploadItemPreviewBaseProps extends PolymorphicProps<'div'>, RefAttribute {
+    type?: string;
+}
+export interface FileUploadItemPreviewProps extends Assign<HTMLProps<'div'>, FileUploadItemPreviewBaseProps> {
+}
+declare const FileUploadItemPreview: import("svelte").Component<FileUploadItemPreviewProps, {}, "ref">;
+type FileUploadItemPreview = ReturnType<typeof FileUploadItemPreview>;
+export default FileUploadItemPreview;

package/dist/components/file-upload/file-upload-item-size-text.svelte

@@ -0,0 +1,26 @@
+<script module lang="ts">
+  import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
+
+  export interface FileUploadItemSizeTextBaseProps extends PolymorphicProps<'div'>, RefAttribute {}
+  export interface FileUploadItemSizeTextProps extends Assign<HTMLProps<'div'>, FileUploadItemSizeTextBaseProps> {}
+</script>
+
+<script lang="ts">
+  import { mergeProps } from '../../core'
+  import { Sprawlify } from '../factory'
+  import { useFileUploadContext } from './use-file-upload-context'
+  import { useFileUploadItemPropsContext } from './use-file-upload-item-props-context'
+
+  let { ref = $bindable(null), ...props }: FileUploadItemSizeTextProps = $props()
+  const fileUpload = useFileUploadContext()
+  const itemProps = useFileUploadItemPropsContext()
+  const mergedProps = $derived(mergeProps(fileUpload().getItemSizeTextProps(itemProps()), props))
+</script>
+
+<Sprawlify as="div" bind:ref {...mergedProps}>
+  {#if props.children}
+    {@render props.children?.()}
+  {:else}
+    {fileUpload().getFileSize(itemProps().file)}
+  {/if}
+</Sprawlify>

package/dist/components/file-upload/file-upload-item-size-text.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+export interface FileUploadItemSizeTextBaseProps extends PolymorphicProps<'div'>, RefAttribute {
+}
+export interface FileUploadItemSizeTextProps extends Assign<HTMLProps<'div'>, FileUploadItemSizeTextBaseProps> {
+}
+declare const FileUploadItemSizeText: import("svelte").Component<FileUploadItemSizeTextProps, {}, "ref">;
+type FileUploadItemSizeText = ReturnType<typeof FileUploadItemSizeText>;
+export default FileUploadItemSizeText;

package/dist/components/file-upload/file-upload-item.svelte

@@ -0,0 +1,32 @@
+<script module lang="ts">
+  import type { ItemProps } from '@sprawlify/primitives/machines/file-upload'
+  import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
+
+  type ItemBaseProps = Omit<ItemProps, 'type'>
+
+  export interface FileUploadItemBaseProps extends ItemBaseProps, PolymorphicProps<'li'>, RefAttribute {}
+  export interface FileUploadItemProps extends Assign<HTMLProps<'li'>, FileUploadItemBaseProps> {}
+</script>
+
+<script lang="ts">
+  import { mergeProps } from '../../core'
+  import { createSplitProps } from '../../utils/create-split-props'
+  import { Sprawlify } from '../factory'
+  import { useFileUploadContext } from './use-file-upload-context'
+  import { FileUploadItemPropsProvider } from './use-file-upload-item-props-context'
+  import { useFileUploadItemGroupPropsContext } from './use-file-upload-item-group-props-context'
+
+  let { ref = $bindable(null), ...props }: FileUploadItemProps = $props()
+  const fileUpload = useFileUploadContext()
+
+  const [itemProps, localProps] = $derived(createSplitProps<ItemBaseProps>()(props, ['file']))
+
+  const itemGroupProps = useFileUploadItemGroupPropsContext()
+  const itemPropsWithType = $derived({ ...itemProps, type: itemGroupProps().type })
+
+  const mergedProps = $derived(mergeProps(fileUpload().getItemProps(itemPropsWithType), localProps))
+
+  FileUploadItemPropsProvider(() => itemPropsWithType)
+</script>
+
+<Sprawlify as="li" bind:ref {...mergedProps} />

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

@@ -0,0 +1,10 @@
+import type { ItemProps } from '@sprawlify/primitives/machines/file-upload';
+import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+type ItemBaseProps = Omit<ItemProps, 'type'>;
+export interface FileUploadItemBaseProps extends ItemBaseProps, PolymorphicProps<'li'>, RefAttribute {
+}
+export interface FileUploadItemProps extends Assign<HTMLProps<'li'>, FileUploadItemBaseProps> {
+}
+declare const FileUploadItem: import("svelte").Component<FileUploadItemProps, {}, "ref">;
+type FileUploadItem = ReturnType<typeof FileUploadItem>;
+export default FileUploadItem;

package/dist/components/file-upload/file-upload-label.svelte

@@ -0,0 +1,18 @@
+<script module lang="ts">
+  import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
+
+  export interface FileUploadLabelBaseProps extends PolymorphicProps<'label'>, RefAttribute {}
+  export interface FileUploadLabelProps extends Assign<HTMLProps<'label'>, FileUploadLabelBaseProps> {}
+</script>
+
+<script lang="ts">
+  import { mergeProps } from '../../core'
+  import { Sprawlify } from '../factory'
+  import { useFileUploadContext } from './use-file-upload-context'
+
+  let { ref = $bindable(null), ...props }: FileUploadLabelProps = $props()
+  const fileUpload = useFileUploadContext()
+  const mergedProps = $derived(mergeProps(fileUpload().getLabelProps(), props))
+</script>
+
+<Sprawlify as="label" bind:ref {...mergedProps} />

package/dist/components/file-upload/file-upload-label.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+export interface FileUploadLabelBaseProps extends PolymorphicProps<'label'>, RefAttribute {
+}
+export interface FileUploadLabelProps extends Assign<HTMLProps<'label'>, FileUploadLabelBaseProps> {
+}
+declare const FileUploadLabel: import("svelte").Component<FileUploadLabelProps, {}, "ref">;
+type FileUploadLabel = ReturnType<typeof FileUploadLabel>;
+export default FileUploadLabel;

package/dist/components/file-upload/file-upload-root-provider.svelte

@@ -0,0 +1,24 @@
+<script module lang="ts">
+  import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
+  import type { UseFileUploadReturn } from './use-file-upload.svelte'
+
+  interface RootProviderProps {
+    value: UseFileUploadReturn
+  }
+
+  export interface FileUploadRootProviderBaseProps extends RootProviderProps, PolymorphicProps<'div'>, RefAttribute {}
+  export interface FileUploadRootProviderProps extends Assign<HTMLProps<'div'>, FileUploadRootProviderBaseProps> {}
+</script>
+
+<script lang="ts">
+  import { mergeProps } from '../../core'
+  import { Sprawlify } from '../factory'
+  import { FileUploadProvider } from './use-file-upload-context'
+
+  let { ref = $bindable(null), value, ...props }: FileUploadRootProviderProps = $props()
+  const mergedProps = $derived(mergeProps(value().getRootProps(), props))
+
+  FileUploadProvider(value)
+</script>
+
+<Sprawlify as="div" bind:ref {...mergedProps} />

package/dist/components/file-upload/file-upload-root-provider.svelte.d.ts

@@ -0,0 +1,12 @@
+import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+import type { UseFileUploadReturn } from './use-file-upload.svelte';
+interface RootProviderProps {
+    value: UseFileUploadReturn;
+}
+export interface FileUploadRootProviderBaseProps extends RootProviderProps, PolymorphicProps<'div'>, RefAttribute {
+}
+export interface FileUploadRootProviderProps extends Assign<HTMLProps<'div'>, FileUploadRootProviderBaseProps> {
+}
+declare const FileUploadRootProvider: import("svelte").Component<FileUploadRootProviderProps, {}, "ref">;
+type FileUploadRootProvider = ReturnType<typeof FileUploadRootProvider>;
+export default FileUploadRootProvider;

package/dist/components/file-upload/file-upload-root.svelte

@@ -0,0 +1,64 @@
+<script module lang="ts">
+  import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
+  import type { UseFileUploadProps } from './use-file-upload.svelte'
+
+  export interface FileUploadRootBaseProps extends UseFileUploadProps, PolymorphicProps<'div'>, RefAttribute {}
+  export interface FileUploadRootProps extends Assign<HTMLProps<'div'>, FileUploadRootBaseProps> {}
+</script>
+
+<script lang="ts">
+  import { mergeProps } from '../../core'
+  import { createSplitProps } from '../../utils/create-split-props'
+  import { Sprawlify } from '../factory'
+  import { FileUploadProvider } from './use-file-upload-context'
+  import { useFileUpload } from './use-file-upload.svelte'
+
+  let { ref = $bindable(null), acceptedFiles = $bindable(), ...props }: FileUploadRootProps = $props()
+  const providedId = $props.id()
+
+  const [useFileUploadProps, localProps] = $derived(
+    createSplitProps<UseFileUploadProps>()(props, [
+      'accept',
+      'acceptedFiles',
+      'allowDrop',
+      'capture',
+      'defaultAcceptedFiles',
+      'directory',
+      'disabled',
+      'readOnly',
+      'id',
+      'ids',
+      'invalid',
+      'locale',
+      'maxFiles',
+      'maxFileSize',
+      'minFileSize',
+      'name',
+      'onFileAccept',
+      'onFileChange',
+      'onFileReject',
+      'preventDocumentDrop',
+      'required',
+      'translations',
+      'transformFiles',
+      'validate',
+    ]),
+  )
+
+  const resolvedProps = $derived<UseFileUploadProps>({
+    ...useFileUploadProps,
+    id: useFileUploadProps.id ?? providedId,
+    acceptedFiles,
+    onFileChange: (details) => {
+      useFileUploadProps.onFileChange?.(details)
+      if (acceptedFiles !== undefined) acceptedFiles = details.acceptedFiles
+    },
+  })
+
+  const fileUpload = useFileUpload(() => resolvedProps)
+  const mergedProps = $derived(mergeProps(fileUpload().getRootProps(), localProps))
+
+  FileUploadProvider(fileUpload)
+</script>
+
+<Sprawlify as="div" bind:ref {...mergedProps} />

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

@@ -0,0 +1,9 @@
+import type { Assign, HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+import type { UseFileUploadProps } from './use-file-upload.svelte';
+export interface FileUploadRootBaseProps extends UseFileUploadProps, PolymorphicProps<'div'>, RefAttribute {
+}
+export interface FileUploadRootProps extends Assign<HTMLProps<'div'>, FileUploadRootBaseProps> {
+}
+declare const FileUploadRoot: import("svelte").Component<FileUploadRootProps, {}, "ref" | "acceptedFiles">;
+type FileUploadRoot = ReturnType<typeof FileUploadRoot>;
+export default FileUploadRoot;