@moduix/solid-tailwind 1.0.0

package/dist/components/fieldset/Fieldset.js

@@ -0,0 +1,93 @@
+import { createComponent, mergeProps } from "solid-js/web";
+import { Fieldset, useFieldset, useFieldsetContext } from "@ark-ui/solid/fieldset";
+import { splitProps } from "solid-js";
+import { cn } from "../../internal/cn.js";
+function FieldsetRoot(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'class'
+    ]);
+    return createComponent(Fieldset.Root, mergeProps({
+        get asChild () {
+            return local.asChild;
+        }
+    }, others, {
+        "data-slot": "fieldset-root",
+        get ["class"] () {
+            return cn('flex w-full max-w-none min-w-0 flex-col gap-4 border-transparent data-disabled:opacity-50 data-invalid:border-destructive', local.class);
+        }
+    }));
+}
+function FieldsetRootProvider(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'class'
+    ]);
+    return createComponent(Fieldset.RootProvider, mergeProps({
+        get asChild () {
+            return local.asChild;
+        }
+    }, others, {
+        "data-slot": "fieldset-root-provider",
+        get ["class"] () {
+            return cn('flex w-full max-w-none min-w-0 flex-col gap-4 border-transparent data-disabled:opacity-50 data-invalid:border-destructive', local.class);
+        }
+    }));
+}
+function FieldsetLegend(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'class'
+    ]);
+    return createComponent(Fieldset.Legend, mergeProps({
+        get asChild () {
+            return local.asChild;
+        }
+    }, others, {
+        "data-slot": "fieldset-legend",
+        get ["class"] () {
+            return cn('inline-block max-w-full pb-3 text-lg font-semibold wrap-anywhere text-foreground', local.class);
+        }
+    }));
+}
+function FieldsetHelperText(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'class'
+    ]);
+    return createComponent(Fieldset.HelperText, mergeProps({
+        get asChild () {
+            return local.asChild;
+        }
+    }, others, {
+        "data-slot": "fieldset-helper-text",
+        get ["class"] () {
+            return cn('text-sm wrap-anywhere text-muted-foreground', local.class);
+        }
+    }));
+}
+function FieldsetErrorText(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'class'
+    ]);
+    return createComponent(Fieldset.ErrorText, mergeProps({
+        get asChild () {
+            return local.asChild;
+        }
+    }, others, {
+        "data-slot": "fieldset-error-text",
+        get ["class"] () {
+            return cn('text-sm font-medium wrap-anywhere text-destructive', local.class);
+        }
+    }));
+}
+const Fieldset_Fieldset = Object.assign(FieldsetRoot, {
+    Root: FieldsetRoot,
+    RootProvider: FieldsetRootProvider,
+    Context: Fieldset.Context,
+    Legend: FieldsetLegend,
+    HelperText: FieldsetHelperText,
+    ErrorText: FieldsetErrorText
+});
+export { Fieldset_Fieldset as Fieldset, useFieldset, useFieldsetContext };

package/dist/components/fieldset/Fieldset.jsx

@@ -0,0 +1,47 @@
+import { Fieldset, useFieldset, useFieldsetContext } from "@ark-ui/solid/fieldset";
+import { splitProps } from "solid-js";
+import { cn } from "../../internal/cn.jsx";
+function FieldsetRoot(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'class'
+    ]);
+    return <Fieldset.Root asChild={local.asChild} {...others} data-slot="fieldset-root" class={cn('flex w-full max-w-none min-w-0 flex-col gap-4 border-transparent data-disabled:opacity-50 data-invalid:border-destructive', local.class)}/>;
+}
+function FieldsetRootProvider(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'class'
+    ]);
+    return <Fieldset.RootProvider asChild={local.asChild} {...others} data-slot="fieldset-root-provider" class={cn('flex w-full max-w-none min-w-0 flex-col gap-4 border-transparent data-disabled:opacity-50 data-invalid:border-destructive', local.class)}/>;
+}
+function FieldsetLegend(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'class'
+    ]);
+    return <Fieldset.Legend asChild={local.asChild} {...others} data-slot="fieldset-legend" class={cn('inline-block max-w-full pb-3 text-lg font-semibold wrap-anywhere text-foreground', local.class)}/>;
+}
+function FieldsetHelperText(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'class'
+    ]);
+    return <Fieldset.HelperText asChild={local.asChild} {...others} data-slot="fieldset-helper-text" class={cn('text-sm wrap-anywhere text-muted-foreground', local.class)}/>;
+}
+function FieldsetErrorText(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'class'
+    ]);
+    return <Fieldset.ErrorText asChild={local.asChild} {...others} data-slot="fieldset-error-text" class={cn('text-sm font-medium wrap-anywhere text-destructive', local.class)}/>;
+}
+const Fieldset_Fieldset = Object.assign(FieldsetRoot, {
+    Root: FieldsetRoot,
+    RootProvider: FieldsetRootProvider,
+    Context: Fieldset.Context,
+    Legend: FieldsetLegend,
+    HelperText: FieldsetHelperText,
+    ErrorText: FieldsetErrorText
+});
+export { Fieldset_Fieldset as Fieldset, useFieldset, useFieldsetContext };

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

@@ -0,0 +1 @@
+export { Fieldset, useFieldset, useFieldsetContext } from './Fieldset.js';

package/dist/components/fieldset/index.js

@@ -0,0 +1 @@
+export { Fieldset, useFieldset, useFieldsetContext } from "./Fieldset.js";

package/dist/components/fieldset/index.jsx

@@ -0,0 +1 @@
+export { Fieldset, useFieldset, useFieldsetContext } from "./Fieldset.jsx";

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

@@ -0,0 +1,44 @@
+import type { HTMLArkProps } from '@ark-ui/solid/factory';
+import { FileUpload as FileUploadPrimitive, useFileUpload, useFileUploadContext } from '@ark-ui/solid/file-upload';
+import type { ComponentProps } from 'solid-js';
+declare function FileUploadRoot(props: ComponentProps<typeof FileUploadPrimitive.Root>): import("solid-js").JSX.Element;
+declare function FileUploadRootProvider(props: ComponentProps<typeof FileUploadPrimitive.RootProvider>): import("solid-js").JSX.Element;
+declare function FileUploadLabel(props: ComponentProps<typeof FileUploadPrimitive.Label>): import("solid-js").JSX.Element;
+declare function FileUploadDropzone(props: ComponentProps<typeof FileUploadPrimitive.Dropzone>): import("solid-js").JSX.Element;
+declare function FileUploadDropzoneIcon(props: HTMLArkProps<'span'>): import("solid-js").JSX.Element;
+declare function FileUploadTrigger(props: ComponentProps<typeof FileUploadPrimitive.Trigger>): import("solid-js").JSX.Element;
+declare function FileUploadItemGroup(props: ComponentProps<typeof FileUploadPrimitive.ItemGroup>): import("solid-js").JSX.Element;
+declare function FileUploadItem(props: ComponentProps<typeof FileUploadPrimitive.Item>): import("solid-js").JSX.Element;
+declare function FileUploadItemPreview(props: ComponentProps<typeof FileUploadPrimitive.ItemPreview>): import("solid-js").JSX.Element;
+declare function FileUploadItemPreviewImage(props: ComponentProps<typeof FileUploadPrimitive.ItemPreviewImage>): import("solid-js").JSX.Element;
+declare function FileUploadItemPreviewIcon(props: ComponentProps<'svg'>): import("solid-js").JSX.Element;
+declare function FileUploadItemName(props: ComponentProps<typeof FileUploadPrimitive.ItemName>): import("solid-js").JSX.Element;
+declare function FileUploadItemSizeText(props: ComponentProps<typeof FileUploadPrimitive.ItemSizeText>): import("solid-js").JSX.Element;
+declare function FileUploadItemMetadata(props: HTMLArkProps<'div'> & {
+    file: File;
+}): import("solid-js").JSX.Element;
+declare function FileUploadItemDeleteTrigger(props: ComponentProps<typeof FileUploadPrimitive.ItemDeleteTrigger>): import("solid-js").JSX.Element;
+declare function FileUploadItems(): import("solid-js").JSX.Element;
+declare function FileUploadClearTrigger(props: ComponentProps<typeof FileUploadPrimitive.ClearTrigger>): import("solid-js").JSX.Element;
+declare const FileUpload: typeof FileUploadRoot & {
+    Root: typeof FileUploadRoot;
+    RootProvider: typeof FileUploadRootProvider;
+    Context: (props: FileUploadPrimitive.ContextProps) => import("solid-js").JSX.Element;
+    HiddenInput: (props: FileUploadPrimitive.HiddenInputProps) => import("solid-js").JSX.Element;
+    Label: typeof FileUploadLabel;
+    Dropzone: typeof FileUploadDropzone;
+    DropzoneIcon: typeof FileUploadDropzoneIcon;
+    Trigger: typeof FileUploadTrigger;
+    ItemGroup: typeof FileUploadItemGroup;
+    Item: typeof FileUploadItem;
+    Items: typeof FileUploadItems;
+    ItemPreview: typeof FileUploadItemPreview;
+    ItemPreviewImage: typeof FileUploadItemPreviewImage;
+    ItemPreviewIcon: typeof FileUploadItemPreviewIcon;
+    ItemName: typeof FileUploadItemName;
+    ItemMetadata: typeof FileUploadItemMetadata;
+    ItemSizeText: typeof FileUploadItemSizeText;
+    ItemDeleteTrigger: typeof FileUploadItemDeleteTrigger;
+    ClearTrigger: typeof FileUploadClearTrigger;
+};
+export { FileUpload, useFileUpload, useFileUploadContext };

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

@@ -0,0 +1,325 @@
+import { createComponent, memo, mergeProps } from "solid-js/web";
+import { ark } from "@ark-ui/solid/factory";
+import { FileUpload, useFileUpload, useFileUploadContext } from "@ark-ui/solid/file-upload";
+import { For, children, splitProps } from "solid-js";
+import { cn } from "../../internal/cn.js";
+import { CloseIcon, FileIcon, TrashIcon, UploadIcon } from "../../internal/icons/ui/Icons.js";
+import { CloseButton } from "../close-button/index.js";
+function FileUploadRoot(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'children',
+        'class'
+    ]);
+    return createComponent(FileUpload.Root, mergeProps({
+        get asChild () {
+            return local.asChild;
+        },
+        "data-slot": "file-upload-root",
+        get ["class"] () {
+            return cn('box-border flex w-full max-w-md flex-col items-start gap-3 text-foreground', local.class);
+        }
+    }, others, {
+        get children () {
+            return local.children;
+        }
+    }));
+}
+function FileUploadRootProvider(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'children',
+        'class'
+    ]);
+    return createComponent(FileUpload.RootProvider, mergeProps({
+        get asChild () {
+            return local.asChild;
+        },
+        "data-slot": "file-upload-root-provider",
+        get ["class"] () {
+            return cn('box-border flex w-full max-w-md flex-col items-start gap-3 text-foreground', local.class);
+        }
+    }, others, {
+        get children () {
+            return local.children;
+        }
+    }));
+}
+function FileUploadLabel(props) {
+    const [local, others] = splitProps(props, [
+        'class'
+    ]);
+    return createComponent(FileUpload.Label, mergeProps({
+        "data-slot": "file-upload-label",
+        get ["class"] () {
+            return cn('text-sm font-medium text-foreground data-disabled:opacity-50', local.class);
+        }
+    }, others));
+}
+function FileUploadDropzone(props) {
+    const [local, others] = splitProps(props, [
+        'class'
+    ]);
+    return createComponent(FileUpload.Dropzone, mergeProps({
+        "data-slot": "file-upload-dropzone",
+        get ["class"] () {
+            return cn('box-border grid min-h-32 w-full place-items-center gap-3 rounded-md border border-dashed border-border bg-background p-5 text-center text-muted-foreground transition-[border-color,background-color,color,opacity] duration-200 ease-in-out focus-visible:outline-2 focus-visible:outline-offset-1 focus-visible:outline-ring data-disabled:cursor-default data-disabled:opacity-50 data-dragging:border-primary data-dragging:bg-accent data-dragging:text-foreground data-invalid:border-destructive data-readonly:cursor-default data-readonly:opacity-50 motion-reduce:transition-none [&[role=button]:not([data-disabled],[data-readonly])]:cursor-pointer', local.class);
+        }
+    }, others));
+}
+function FileUploadDropzoneIcon(props) {
+    const [local, others] = splitProps(props, [
+        'children',
+        'class'
+    ]);
+    const resolvedChildren = children(()=>local.children);
+    return createComponent(ark.span, mergeProps({
+        "aria-hidden": "true",
+        "data-slot": "file-upload-dropzone-icon",
+        get ["class"] () {
+            return cn('box-border inline-flex size-10 items-center justify-center rounded-full border border-border bg-muted text-foreground [&>svg]:size-4', local.class);
+        }
+    }, others, {
+        get children () {
+            return resolvedChildren() ?? createComponent(UploadIcon, {});
+        }
+    }));
+}
+function FileUploadTrigger(props) {
+    const [local, others] = splitProps(props, [
+        'class'
+    ]);
+    return createComponent(FileUpload.Trigger, mergeProps({
+        "data-slot": "file-upload-trigger",
+        get ["class"] () {
+            return cn('box-border inline-flex min-h-control-md cursor-pointer appearance-none items-center justify-center gap-2 rounded-md border border-primary bg-primary px-4 text-sm leading-5 font-medium whitespace-nowrap text-primary-foreground transition-[border-color,background-color,color,opacity] duration-200 ease-in-out select-none focus-visible:outline-2 focus-visible:-outline-offset-1 focus-visible:outline-ring disabled:pointer-events-none disabled:cursor-default data-disabled:pointer-events-none data-disabled:cursor-default data-invalid:border-destructive data-readonly:pointer-events-none data-readonly:cursor-default motion-reduce:transition-none [@media(hover:hover)]:[&:not(:disabled):not([data-disabled]):not([data-readonly]):hover]:bg-foreground', local.class);
+        }
+    }, others));
+}
+function FileUploadItemGroup(props) {
+    const [local, others] = splitProps(props, [
+        'class'
+    ]);
+    return createComponent(FileUpload.ItemGroup, mergeProps({
+        "data-slot": "file-upload-item-group",
+        get ["class"] () {
+            return cn('flex w-full flex-wrap items-start gap-2 empty:hidden', local.class);
+        }
+    }, others));
+}
+function FileUploadItem(props) {
+    const [local, others] = splitProps(props, [
+        'class'
+    ]);
+    return createComponent(FileUpload.Item, mergeProps({
+        "data-slot": "file-upload-item",
+        get ["class"] () {
+            return cn('group/item box-border grid min-h-control-md shrink-0 grow basis-full grid-cols-[minmax(0,1fr)_auto] items-center gap-x-3 gap-y-1 rounded-md border border-border bg-background px-3 py-2 text-foreground has-[[data-slot=file-upload-item-preview-image]]:min-h-0 has-[[data-slot=file-upload-item-preview-image]]:max-w-40 has-[[data-slot=file-upload-item-preview-image]]:grow-0 has-[[data-slot=file-upload-item-preview-image]]:grid-cols-[minmax(0,1fr)_auto] has-[[data-slot=file-upload-item-preview-image]]:grid-rows-[auto_auto_auto] has-[[data-slot=file-upload-item-preview-image]]:items-start has-[[data-slot=file-upload-item-preview]]:min-h-control-xl has-[[data-slot=file-upload-item-preview]]:grid-cols-[auto_minmax(0,1fr)_auto] has-[[data-slot=file-upload-item-preview]]:py-2 data-disabled:opacity-50 data-[type=rejected]:border-destructive', local.class);
+        }
+    }, others));
+}
+function FileUploadItemPreview(props) {
+    const [local, others] = splitProps(props, [
+        'class'
+    ]);
+    return createComponent(FileUpload.ItemPreview, mergeProps({
+        "data-slot": "file-upload-item-preview",
+        get ["class"] () {
+            return cn('col-start-1 row-span-2 row-start-1 inline-flex size-10 items-center justify-center overflow-hidden rounded-sm bg-muted text-muted-foreground group-has-[[data-slot=file-upload-item-preview-image]]/item:col-span-2 group-has-[[data-slot=file-upload-item-preview-image]]/item:aspect-square group-has-[[data-slot=file-upload-item-preview-image]]/item:h-auto group-has-[[data-slot=file-upload-item-preview-image]]/item:w-full', local.class);
+        }
+    }, others));
+}
+function FileUploadItemPreviewImage(props) {
+    const [local, others] = splitProps(props, [
+        'class'
+    ]);
+    return createComponent(FileUpload.ItemPreviewImage, mergeProps({
+        "data-slot": "file-upload-item-preview-image",
+        get ["class"] () {
+            return cn('size-full object-cover', local.class);
+        }
+    }, others));
+}
+function FileUploadItemPreviewIcon(props) {
+    const [local, others] = splitProps(props, [
+        'class'
+    ]);
+    return createComponent(FileIcon, mergeProps({
+        "data-slot": "file-upload-item-preview-icon",
+        get ["class"] () {
+            return cn('size-4', local.class);
+        }
+    }, others));
+}
+function getFileTypeLabel(file) {
+    const extension = file.name.split('.').pop();
+    return extension ? extension.toUpperCase() : file.type || 'FILE';
+}
+function isImageFile(file) {
+    return file.type.startsWith('image/');
+}
+function FileUploadItemName(props) {
+    const [local, others] = splitProps(props, [
+        'class'
+    ]);
+    return createComponent(FileUpload.ItemName, mergeProps({
+        "data-slot": "file-upload-item-name",
+        get ["class"] () {
+            return cn('col-start-1 line-clamp-1 min-w-0 text-sm leading-5 font-medium group-has-[[data-slot=file-upload-item-preview-image]]/item:col-start-1 group-has-[[data-slot=file-upload-item-preview-image]]/item:row-start-2 group-has-[[data-slot=file-upload-item-preview-image]]/item:self-end group-has-[[data-slot=file-upload-item-preview]]/item:col-start-2', local.class);
+        }
+    }, others));
+}
+function FileUploadItemSizeText(props) {
+    const [local, others] = splitProps(props, [
+        'class'
+    ]);
+    return createComponent(FileUpload.ItemSizeText, mergeProps({
+        "data-slot": "file-upload-item-size-text",
+        get ["class"] () {
+            return cn('text-xs leading-4 text-muted-foreground', local.class);
+        }
+    }, others));
+}
+function FileUploadItemMetadata(props) {
+    const [local, others] = splitProps(props, [
+        'class',
+        'file'
+    ]);
+    return createComponent(ark.div, mergeProps({
+        "data-slot": "file-upload-item-metadata",
+        get ["class"] () {
+            return cn("col-start-1 flex items-center gap-1 text-xs leading-4 text-muted-foreground group-has-[[data-slot=file-upload-item-preview-image]]/item:col-start-1 group-has-[[data-slot=file-upload-item-preview-image]]/item:row-start-3 group-has-[[data-slot=file-upload-item-preview]]/item:col-start-2 [&>[data-slot='file-upload-item-size-text']::before]:me-1 [&>[data-slot='file-upload-item-size-text']::before]:content-['·']", local.class);
+        }
+    }, others, {
+        get children () {
+            return [
+                createComponent(ark.span, {
+                    get children () {
+                        return getFileTypeLabel(local.file);
+                    }
+                }),
+                createComponent(FileUploadItemSizeText, {})
+            ];
+        }
+    }));
+}
+function FileUploadItemDeleteTrigger(props) {
+    const [local, others] = splitProps(props, [
+        'children',
+        'class'
+    ]);
+    const resolvedChildren = children(()=>local.children);
+    return createComponent(FileUpload.ItemDeleteTrigger, mergeProps({
+        "data-slot": "file-upload-item-delete-trigger",
+        get ["class"] () {
+            return cn('col-start-2 row-start-1 box-border inline-flex size-control-sm shrink-0 cursor-pointer appearance-none items-center justify-center justify-self-end rounded-sm border-0 bg-transparent p-0 text-muted-foreground transition-[background-color,color,opacity] duration-200 ease-in-out group-has-[[data-slot=file-upload-item-preview-image]]/item:col-start-2 group-has-[[data-slot=file-upload-item-preview-image]]/item:row-start-2 group-has-[[data-slot=file-upload-item-preview-image]]/item:self-center group-has-[[data-slot=file-upload-item-preview]]/item:col-start-3 group-has-[[data-slot=file-upload-item-preview]]/item:row-span-2 group-has-[[data-slot=file-upload-item-preview]]/item:row-start-1 group-has-[[data-slot=file-upload-item-size-text]]/item:row-span-2 group-has-[[data-slot=file-upload-item-size-text]]/item:row-start-1 focus-visible:outline-2 focus-visible:outline-offset-1 focus-visible:outline-ring disabled:pointer-events-none disabled:cursor-default disabled:opacity-50 data-disabled:pointer-events-none data-disabled:cursor-default data-disabled:opacity-50 data-readonly:pointer-events-none data-readonly:cursor-default data-readonly:opacity-50 motion-reduce:transition-none [&>svg]:size-4 [@media(hover:hover)]:[&:not(:disabled):not([data-disabled]):not([data-readonly]):hover]:bg-muted [@media(hover:hover)]:[&:not(:disabled):not([data-disabled]):not([data-readonly]):hover]:text-foreground', local.class);
+        }
+    }, others, {
+        get children () {
+            return resolvedChildren() ?? createComponent(TrashIcon, {});
+        }
+    }));
+}
+function FileUploadItems() {
+    const fileUpload = useFileUploadContext();
+    return createComponent(For, {
+        get each () {
+            return fileUpload().acceptedFiles;
+        },
+        children: (file)=>createComponent(FileUploadItem, {
+                file: file,
+                get children () {
+                    return [
+                        memo(()=>memo(()=>!!isImageFile(file))() ? createComponent(FileUploadItemPreview, {
+                                get children () {
+                                    return createComponent(FileUploadItemPreviewImage, {});
+                                }
+                            }) : createComponent(FileUploadItemPreview, {
+                                get children () {
+                                    return createComponent(FileUploadItemPreviewIcon, {});
+                                }
+                            })),
+                        createComponent(FileUploadItemName, {}),
+                        createComponent(FileUploadItemMetadata, {
+                            file: file
+                        }),
+                        createComponent(FileUploadItemDeleteTrigger, {
+                            get ["aria-label"] () {
+                                return `Remove ${file.name}`;
+                            }
+                        })
+                    ];
+                }
+            })
+    });
+}
+function FileUploadClearTrigger(props) {
+    const [local, others] = splitProps(props, [
+        'aria-label',
+        'aria-labelledby',
+        'asChild',
+        'children',
+        'class'
+    ]);
+    const resolvedChildren = children(()=>local.children);
+    const clearLabel = ()=>local['aria-label'] ?? (null == local['aria-labelledby'] ? 'Clear files' : void 0);
+    const triggerClass = ()=>cn('size-control-sm self-start rounded-sm bg-transparent text-muted-foreground focus-visible:outline-2 focus-visible:outline-offset-1 focus-visible:outline-ring data-readonly:pointer-events-none data-readonly:opacity-50 [&>svg]:size-4', null != local.children && 'w-auto gap-2 px-2 text-sm leading-5', local.class);
+    if (local.asChild) return createComponent(FileUpload.ClearTrigger, mergeProps({
+        get asChild () {
+            return local.asChild;
+        },
+        "data-slot": "file-upload-clear-trigger",
+        get ["class"] () {
+            return triggerClass();
+        },
+        get ["aria-label"] () {
+            return clearLabel();
+        },
+        get ["aria-labelledby"] () {
+            return local['aria-labelledby'];
+        }
+    }, others, {
+        get children () {
+            return resolvedChildren();
+        }
+    }));
+    return createComponent(FileUpload.ClearTrigger, mergeProps({
+        asChild: (triggerProps)=>createComponent(CloseButton.Root, mergeProps(triggerProps, {
+                get ["aria-label"] () {
+                    return clearLabel();
+                },
+                get ["aria-labelledby"] () {
+                    return local['aria-labelledby'];
+                },
+                get children () {
+                    return resolvedChildren() ?? createComponent(CloseIcon, {});
+                }
+            })),
+        "data-slot": "file-upload-clear-trigger",
+        get ["class"] () {
+            return triggerClass();
+        }
+    }, others));
+}
+const FileUpload_FileUpload = Object.assign(FileUploadRoot, {
+    Root: FileUploadRoot,
+    RootProvider: FileUploadRootProvider,
+    Context: FileUpload.Context,
+    HiddenInput: FileUpload.HiddenInput,
+    Label: FileUploadLabel,
+    Dropzone: FileUploadDropzone,
+    DropzoneIcon: FileUploadDropzoneIcon,
+    Trigger: FileUploadTrigger,
+    ItemGroup: FileUploadItemGroup,
+    Item: FileUploadItem,
+    Items: FileUploadItems,
+    ItemPreview: FileUploadItemPreview,
+    ItemPreviewImage: FileUploadItemPreviewImage,
+    ItemPreviewIcon: FileUploadItemPreviewIcon,
+    ItemName: FileUploadItemName,
+    ItemMetadata: FileUploadItemMetadata,
+    ItemSizeText: FileUploadItemSizeText,
+    ItemDeleteTrigger: FileUploadItemDeleteTrigger,
+    ClearTrigger: FileUploadClearTrigger
+});
+export { FileUpload_FileUpload as FileUpload, useFileUpload, useFileUploadContext };