@pixpilot/shadcn-ui 0.57.1 → 0.58.0

package/dist/AbsoluteFill.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-import * as react_jsx_runtime4 from "react/jsx-runtime";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
 
 //#region src/AbsoluteFill.d.ts
 
@@ -10,7 +10,7 @@ import * as react_jsx_runtime4 from "react/jsx-runtime";
  */
 declare function AbsoluteFill(props: React.HTMLAttributes<HTMLDivElement> & {
   ref?: React.Ref<HTMLDivElement>;
-}): react_jsx_runtime4.JSX.Element;
+}): react_jsx_runtime0.JSX.Element;
 declare namespace AbsoluteFill {
   var displayName: string;
 }

package/dist/Alert.cjs

@@ -1,6 +1,5 @@
 const require_rolldown_runtime = require('./_virtual/rolldown_runtime.cjs');
 const require_utils = require('./shadcn/src/lib/utils.cjs');
-require('./shadcn/src/lib/index.cjs');
 let __pixpilot_shadcn = require("@pixpilot/shadcn");
 __pixpilot_shadcn = require_rolldown_runtime.__toESM(__pixpilot_shadcn);
 let lucide_react = require("lucide-react");

package/dist/Alert.js

@@ -1,5 +1,4 @@
 import { cn as cn$1 } from "./shadcn/src/lib/utils.js";
-import "./shadcn/src/lib/index.js";
 import { Alert, AlertDescription, AlertTitle } from "@pixpilot/shadcn";
 import { CircleAlertIcon, CircleCheckBigIcon, OctagonAlertIcon } from "lucide-react";
 import React from "react";

package/dist/Button.d.ts

@@ -1,6 +1,6 @@
 import { Button, Tooltip, TooltipContent, TooltipTrigger, buttonVariants } from "@pixpilot/shadcn";
 import React from "react";
-import * as react_jsx_runtime5 from "react/jsx-runtime";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
 import { VariantProps } from "class-variance-authority";
 
 //#region src/Button.d.ts
@@ -50,7 +50,7 @@ interface ButtonProps extends React.ComponentProps<typeof Button>, VariantProps<
 }
 declare function Button$1(props: ButtonProps & {
   ref?: React.Ref<HTMLButtonElement>;
-}): react_jsx_runtime5.JSX.Element;
+}): react_jsx_runtime0.JSX.Element;
 declare namespace Button$1 {
   var displayName: string;
 }

package/dist/ColorSelect.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime2 from "react/jsx-runtime";
+import * as react_jsx_runtime1 from "react/jsx-runtime";
 import { Select, SelectContent } from "@pixpilot/shadcn";
 import React, { ComponentProps } from "react";
 
@@ -15,6 +15,6 @@ type BaseColorSelectProps = {
   placeholder?: string;
   keyboardMode?: 'cycle' | 'dropdown';
 } & Omit<ComponentProps<typeof Select>, 'value' | 'onValueChange' | 'children'>;
-declare function ColorSelect(props: BaseColorSelectProps): react_jsx_runtime2.JSX.Element;
+declare function ColorSelect(props: BaseColorSelectProps): react_jsx_runtime1.JSX.Element;
 //#endregion
 export { BaseColorSelectProps, ColorSelect, ColorSelectOption };

package/dist/ColorSelect.d.ts

@@ -1,6 +1,6 @@
 import { Select, SelectContent } from "@pixpilot/shadcn";
 import React, { ComponentProps } from "react";
-import * as react_jsx_runtime3 from "react/jsx-runtime";
+import * as react_jsx_runtime2 from "react/jsx-runtime";
 
 //#region src/ColorSelect.d.ts
 interface ColorSelectOption {
@@ -15,6 +15,6 @@ type BaseColorSelectProps = {
   placeholder?: string;
   keyboardMode?: 'cycle' | 'dropdown';
 } & Omit<ComponentProps<typeof Select>, 'value' | 'onValueChange' | 'children'>;
-declare function ColorSelect(props: BaseColorSelectProps): react_jsx_runtime3.JSX.Element;
+declare function ColorSelect(props: BaseColorSelectProps): react_jsx_runtime2.JSX.Element;
 //#endregion
 export { BaseColorSelectProps, ColorSelect, ColorSelectOption };

package/dist/ContentCard.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime1 from "react/jsx-runtime";
+import * as react_jsx_runtime2 from "react/jsx-runtime";
 import { Card } from "@pixpilot/shadcn";
 import React, { ReactNode } from "react";
 
@@ -8,7 +8,7 @@ interface SectionCardProps extends React.ComponentProps<typeof Card> {
   children: ReactNode;
   marginBottom?: boolean;
 }
-declare function ContentCard(props: SectionCardProps): react_jsx_runtime1.JSX.Element;
+declare function ContentCard(props: SectionCardProps): react_jsx_runtime2.JSX.Element;
 declare namespace ContentCard {
   var displayName: string;
 }

package/dist/ContentCard.d.ts

@@ -1,6 +1,6 @@
 import { Card } from "@pixpilot/shadcn";
 import React, { ReactNode } from "react";
-import * as react_jsx_runtime6 from "react/jsx-runtime";
+import * as react_jsx_runtime1 from "react/jsx-runtime";
 
 //#region src/ContentCard.d.ts
 interface SectionCardProps extends React.ComponentProps<typeof Card> {
@@ -8,7 +8,7 @@ interface SectionCardProps extends React.ComponentProps<typeof Card> {
   children: ReactNode;
   marginBottom?: boolean;
 }
-declare function ContentCard(props: SectionCardProps): react_jsx_runtime6.JSX.Element;
+declare function ContentCard(props: SectionCardProps): react_jsx_runtime1.JSX.Element;
 declare namespace ContentCard {
   var displayName: string;
 }

package/dist/DatePicker.d.ts

@@ -1,6 +1,6 @@
 import { Calendar } from "@pixpilot/shadcn";
 import { ComponentProps } from "react";
-import * as react_jsx_runtime0 from "react/jsx-runtime";
+import * as react_jsx_runtime3 from "react/jsx-runtime";
 
 //#region src/DatePicker.d.ts
 type DatePickerProps = {
@@ -8,7 +8,7 @@ type DatePickerProps = {
   onChange?: (date: Date | undefined) => void;
   placeholder?: string;
 } & Omit<ComponentProps<typeof Calendar>, 'selected' | 'onSelect' | 'mode'>;
-declare function DatePicker(props: DatePickerProps): react_jsx_runtime0.JSX.Element;
+declare function DatePicker(props: DatePickerProps): react_jsx_runtime3.JSX.Element;
 declare namespace DatePicker {
   var displayName: string;
 }

package/dist/Rating.d.ts

@@ -1,5 +1,5 @@
 import * as React$1 from "react";
-import * as react_jsx_runtime0 from "react/jsx-runtime";
+import * as react_jsx_runtime4 from "react/jsx-runtime";
 import { VariantProps } from "class-variance-authority";
 import * as class_variance_authority_types0 from "class-variance-authority/types";
 
@@ -35,7 +35,7 @@ declare function RatingButton({
   index,
   className,
   ...props
-}: RatingButtonProps): react_jsx_runtime0.JSX.Element;
+}: RatingButtonProps): react_jsx_runtime4.JSX.Element;
 declare function Rating({
   value: valueProp,
   defaultValue,
@@ -52,6 +52,6 @@ declare function Rating({
   className,
   children,
   ...props
-}: React$1.PropsWithChildren<RatingProps>): react_jsx_runtime0.JSX.Element;
+}: React$1.PropsWithChildren<RatingProps>): react_jsx_runtime4.JSX.Element;
 //#endregion
 export { Rating, RatingButton, RatingButtonProps, RatingColor, RatingOption, RatingProps };

package/dist/Select.d.ts

@@ -1,6 +1,6 @@
 import { Select, SelectContent } from "@pixpilot/shadcn";
 import React, { ComponentProps } from "react";
-import * as react_jsx_runtime2 from "react/jsx-runtime";
+import * as react_jsx_runtime6 from "react/jsx-runtime";
 
 //#region src/Select.d.ts
 interface SelectOption {
@@ -46,6 +46,6 @@ type BaseSelectProps = {
    */
   clearable?: boolean;
 } & Omit<ComponentProps<typeof Select>, 'value' | 'onValueChange' | 'children'>;
-declare function Select$1(props: BaseSelectProps): react_jsx_runtime2.JSX.Element;
+declare function Select$1(props: BaseSelectProps): react_jsx_runtime6.JSX.Element;
 //#endregion
 export { Select$1 as Select, SelectContentProps, SelectOption };

package/dist/avatar-upload/AvatarUpload.cjs

@@ -1,6 +1,5 @@
 const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
 const require_utils = require('../shadcn/src/lib/utils.cjs');
-require('../shadcn/src/lib/index.cjs');
 const require_AvatarUploadComponents = require('./AvatarUploadComponents.cjs');
 const require_AvatarUploadItem = require('./AvatarUploadItem.cjs');
 let __pixpilot_shadcn = require("@pixpilot/shadcn");

package/dist/avatar-upload/AvatarUpload.js

@@ -1,5 +1,4 @@
 import { cn as cn$1 } from "../shadcn/src/lib/utils.js";
-import "../shadcn/src/lib/index.js";
 import { AvatarWrap, Image, MainWrapper, MessageComponent } from "./AvatarUploadComponents.js";
 import { AvatarUploadItem } from "./AvatarUploadItem.js";
 import { FileUpload, FileUploadDropzone, FileUploadList } from "@pixpilot/shadcn";

package/dist/avatar-upload/AvatarUploadComponents.cjs

@@ -1,6 +1,5 @@
 const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
 const require_utils = require('../shadcn/src/lib/utils.cjs');
-require('../shadcn/src/lib/index.cjs');
 let lucide_react = require("lucide-react");
 lucide_react = require_rolldown_runtime.__toESM(lucide_react);
 let react = require("react");

package/dist/avatar-upload/AvatarUploadComponents.js

@@ -1,5 +1,4 @@
 import { cn } from "../shadcn/src/lib/utils.js";
-import "../shadcn/src/lib/index.js";
 import { Pencil } from "lucide-react";
 import React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";

package/dist/dialog/Dialog.d.ts

@@ -1,5 +1,5 @@
 import * as React$1 from "react";
-import * as react_jsx_runtime7 from "react/jsx-runtime";
+import * as react_jsx_runtime8 from "react/jsx-runtime";
 import * as _radix_ui_react_dialog0 from "@radix-ui/react-dialog";
 
 //#region src/dialog/Dialog.d.ts
@@ -9,14 +9,14 @@ declare const DialogContent: React$1.ForwardRefExoticComponent<Omit<_radix_ui_re
 declare function DialogHeader({
   className,
   ...props
-}: React$1.HTMLAttributes<HTMLDivElement>): react_jsx_runtime7.JSX.Element;
+}: React$1.HTMLAttributes<HTMLDivElement>): react_jsx_runtime8.JSX.Element;
 declare function DialogBody({
   className,
   ...props
-}: React$1.HTMLAttributes<HTMLDivElement>): react_jsx_runtime7.JSX.Element;
+}: React$1.HTMLAttributes<HTMLDivElement>): react_jsx_runtime8.JSX.Element;
 declare function DialogFooter({
   className,
   ...props
-}: React$1.HTMLAttributes<HTMLDivElement>): react_jsx_runtime7.JSX.Element;
+}: React$1.HTMLAttributes<HTMLDivElement>): react_jsx_runtime8.JSX.Element;
 //#endregion
 export { DialogBody, DialogContent, DialogFooter, DialogHeader };

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

@@ -1,7 +1,7 @@
 import { FileUploadProps } from "./types/index.js";
-import * as react_jsx_runtime18 from "react/jsx-runtime";
+import * as react_jsx_runtime7 from "react/jsx-runtime";
 
 //#region src/file-upload/FileUpload.d.ts
-declare function FileUpload(props: FileUploadProps): react_jsx_runtime18.JSX.Element;
+declare function FileUpload(props: FileUploadProps): react_jsx_runtime7.JSX.Element;
 //#endregion
 export { FileUpload };

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

@@ -1,4 +1,4 @@
 import "./get-file-key.js";
 import "./get-file-meta.js";
 import "./is-file-equal.js";
-import "./merge-file-metadata.js";
+import { FileWithMetadata } from "./merge-file-metadata.js";

package/dist/file-upload/utils/merge-file-metadata.d.cts

@@ -0,0 +1,8 @@
+import { FileMetadata } from "../types/index.cjs";
+
+//#region src/file-upload/utils/merge-file-metadata.d.ts
+interface FileWithMetadata extends FileMetadata {
+  file?: File;
+}
+//#endregion
+export { FileWithMetadata };

package/dist/file-upload/utils/merge-file-metadata.d.ts

@@ -1 +1,8 @@
-import "../types/index.js";
+import { FileMetadata } from "../types/index.js";
+
+//#region src/file-upload/utils/merge-file-metadata.d.ts
+interface FileWithMetadata extends FileMetadata {
+  file?: File;
+}
+//#endregion
+export { FileWithMetadata };

package/dist/file-upload-inline/FileUploadInline.cjs

@@ -2,16 +2,13 @@
 
 
 const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
-const require_use_file_upload_store = require('../file-upload/hooks/use-file-upload-store.cjs');
-require('../file-upload/index.cjs');
+const require_FileUploadRoot = require('../file-upload-root/FileUploadRoot.cjs');
+require('../file-upload-root/index.cjs');
 const require_defaults = require('./defaults.cjs');
-const require_FileUploadInlineItem = require('./FileUploadInlineItem.cjs');
 let __pixpilot_shadcn = require("@pixpilot/shadcn");
 __pixpilot_shadcn = require_rolldown_runtime.__toESM(__pixpilot_shadcn);
 let lucide_react = require("lucide-react");
 lucide_react = require_rolldown_runtime.__toESM(lucide_react);
-let react = require("react");
-react = require_rolldown_runtime.__toESM(react);
 let react_jsx_runtime = require("react/jsx-runtime");
 react_jsx_runtime = require_rolldown_runtime.__toESM(react_jsx_runtime);
 
@@ -20,51 +17,25 @@ react_jsx_runtime = require_rolldown_runtime.__toESM(react_jsx_runtime);
 * FileUploadInline - An inline file upload component using FileUpload primitives
 */
 function FileUploadInline(props) {
-	const { value, onChange, className, disabled = require_defaults.defaultOptions.disabled, multiple = require_defaults.defaultOptions.multiple, buttonText: buttonTextProp, showIcon = require_defaults.defaultOptions.showIcon, onAccept, preventDuplicates,...rest } = props;
+	const { value, onChange, className, disabled = require_defaults.defaultOptions.disabled, buttonText: buttonTextProp, showIcon = require_defaults.defaultOptions.showIcon, onAccept, preventDuplicates,...rest } = props;
+	const multiple = props.multiple ?? require_defaults.defaultOptions.multiple;
 	const buttonText = buttonTextProp ?? (multiple ? "Click to upload files" : "Click to upload a file");
-	const { handleAccept, displayFiles, deleteFile, getFile, orgValue } = require_use_file_upload_store.useFileUploadStore({
-		value,
-		onChange,
-		multiple,
-		preventDuplicates
-	});
-	const handleFileAccept = (0, react.useCallback)((files) => {
-		onAccept?.(files);
-		handleAccept(files);
-	}, [handleAccept, onAccept]);
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.FileUpload, {
+	const dropzoneClassName = (0, __pixpilot_shadcn.cn)("rounded-md border border-input border-solid flex-row bg-background px-3 py-0 display-block w-full cursor-pointer", "hover:bg-accent/50 transition-colors m-0", disabled && "cursor-not-allowed opacity-50");
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_FileUploadRoot.FileUploadRoot, {
 		...rest,
-		value: orgValue,
-		onAccept: handleFileAccept,
+		value,
+		onAccept,
 		disabled,
 		multiple,
 		className: (0, __pixpilot_shadcn.cn)("space-y-2", className),
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [(multiple || !multiple && displayFiles.length === 0) && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__pixpilot_shadcn.FileUploadDropzone, {
-			className: (0, __pixpilot_shadcn.cn)("rounded-md border border-input border-solid flex-row bg-background px-3 py-0 display-block w-full cursor-pointer", "hover:bg-accent/50 transition-colors m-0", disabled && "cursor-not-allowed opacity-50"),
-			children: [showIcon && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.CloudUpload, { className: "h-4 w-4 shrink-0 mx-1 text-muted-foreground" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.FileUploadTrigger, {
-				asChild: true,
-				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.Button, {
-					variant: "link",
-					size: "sm",
-					className: "h-auto py-2 px-0 text-sm text-muted-foreground hover:no-underline justify-start flex-1",
-					disabled,
-					children: buttonText
-				})
-			})]
-		}), displayFiles.length > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.FileUploadList, {
-			className: "space-y-1 m-0",
-			forceMount: true,
-			children: displayFiles.map((data) => {
-				const { name, lastModified } = data;
-				const key = `${name}-${lastModified}`;
-				return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_FileUploadInlineItem.FileUploadInlineItem, {
-					...data,
-					file: getFile(data),
-					disabled,
-					onDelete: deleteFile
-				}, key);
-			})
-		})] })
+		slots: { trigger: { className: dropzoneClassName } },
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__pixpilot_shadcn.Button, {
+			variant: "link",
+			size: "sm",
+			className: (0, __pixpilot_shadcn.cn)("h-auto py-2 px-0 text-sm text-muted-foreground hover:no-underline  flex-1", showIcon ? "justify-start" : "justify-center"),
+			disabled,
+			children: [showIcon && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.CloudUpload, { className: "h-4 w-4 shrink-0 mx-1 text-muted-foreground" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: buttonText })]
+		})
 	});
 }
 

package/dist/file-upload-inline/FileUploadInline.d.ts

@@ -1,10 +1,10 @@
 import { FileUploadInlineProps } from "./types.js";
-import * as react_jsx_runtime10 from "react/jsx-runtime";
+import * as react_jsx_runtime18 from "react/jsx-runtime";
 
 //#region src/file-upload-inline/FileUploadInline.d.ts
 /**
  * FileUploadInline - An inline file upload component using FileUpload primitives
  */
-declare function FileUploadInline(props: FileUploadInlineProps): react_jsx_runtime10.JSX.Element;
+declare function FileUploadInline(props: FileUploadInlineProps): react_jsx_runtime18.JSX.Element;
 //#endregion
 export { FileUploadInline };

package/dist/file-upload-inline/FileUploadInline.js

@@ -1,65 +1,37 @@
 'use client';
 
 
-import { useFileUploadStore } from "../file-upload/hooks/use-file-upload-store.js";
-import "../file-upload/index.js";
+import { FileUploadRoot } from "../file-upload-root/FileUploadRoot.js";
+import "../file-upload-root/index.js";
 import { defaultOptions } from "./defaults.js";
-import { FileUploadInlineItem } from "./FileUploadInlineItem.js";
-import { Button, FileUpload, FileUploadDropzone, FileUploadList, FileUploadTrigger, cn } from "@pixpilot/shadcn";
+import { Button, cn } from "@pixpilot/shadcn";
 import { CloudUpload } from "lucide-react";
-import { useCallback } from "react";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
 
 //#region src/file-upload-inline/FileUploadInline.tsx
 /**
 * FileUploadInline - An inline file upload component using FileUpload primitives
 */
 function FileUploadInline(props) {
-	const { value, onChange, className, disabled = defaultOptions.disabled, multiple = defaultOptions.multiple, buttonText: buttonTextProp, showIcon = defaultOptions.showIcon, onAccept, preventDuplicates,...rest } = props;
+	const { value, onChange, className, disabled = defaultOptions.disabled, buttonText: buttonTextProp, showIcon = defaultOptions.showIcon, onAccept, preventDuplicates,...rest } = props;
+	const multiple = props.multiple ?? defaultOptions.multiple;
 	const buttonText = buttonTextProp ?? (multiple ? "Click to upload files" : "Click to upload a file");
-	const { handleAccept, displayFiles, deleteFile, getFile, orgValue } = useFileUploadStore({
-		value,
-		onChange,
-		multiple,
-		preventDuplicates
-	});
-	const handleFileAccept = useCallback((files) => {
-		onAccept?.(files);
-		handleAccept(files);
-	}, [handleAccept, onAccept]);
-	return /* @__PURE__ */ jsx(FileUpload, {
+	const dropzoneClassName = cn("rounded-md border border-input border-solid flex-row bg-background px-3 py-0 display-block w-full cursor-pointer", "hover:bg-accent/50 transition-colors m-0", disabled && "cursor-not-allowed opacity-50");
+	return /* @__PURE__ */ jsx(FileUploadRoot, {
 		...rest,
-		value: orgValue,
-		onAccept: handleFileAccept,
+		value,
+		onAccept,
 		disabled,
 		multiple,
 		className: cn("space-y-2", className),
-		children: /* @__PURE__ */ jsxs(Fragment, { children: [(multiple || !multiple && displayFiles.length === 0) && /* @__PURE__ */ jsxs(FileUploadDropzone, {
-			className: cn("rounded-md border border-input border-solid flex-row bg-background px-3 py-0 display-block w-full cursor-pointer", "hover:bg-accent/50 transition-colors m-0", disabled && "cursor-not-allowed opacity-50"),
-			children: [showIcon && /* @__PURE__ */ jsx(CloudUpload, { className: "h-4 w-4 shrink-0 mx-1 text-muted-foreground" }), /* @__PURE__ */ jsx(FileUploadTrigger, {
-				asChild: true,
-				children: /* @__PURE__ */ jsx(Button, {
-					variant: "link",
-					size: "sm",
-					className: "h-auto py-2 px-0 text-sm text-muted-foreground hover:no-underline justify-start flex-1",
-					disabled,
-					children: buttonText
-				})
-			})]
-		}), displayFiles.length > 0 && /* @__PURE__ */ jsx(FileUploadList, {
-			className: "space-y-1 m-0",
-			forceMount: true,
-			children: displayFiles.map((data) => {
-				const { name, lastModified } = data;
-				const key = `${name}-${lastModified}`;
-				return /* @__PURE__ */ jsx(FileUploadInlineItem, {
-					...data,
-					file: getFile(data),
-					disabled,
-					onDelete: deleteFile
-				}, key);
-			})
-		})] })
+		slots: { trigger: { className: dropzoneClassName } },
+		children: /* @__PURE__ */ jsxs(Button, {
+			variant: "link",
+			size: "sm",
+			className: cn("h-auto py-2 px-0 text-sm text-muted-foreground hover:no-underline  flex-1", showIcon ? "justify-start" : "justify-center"),
+			disabled,
+			children: [showIcon && /* @__PURE__ */ jsx(CloudUpload, { className: "h-4 w-4 shrink-0 mx-1 text-muted-foreground" }), /* @__PURE__ */ jsx("span", { children: buttonText })]
+		})
 	});
 }
 

package/dist/file-upload-inline/types.d.cts

@@ -1,4 +1,5 @@
-import { FileUploadProps } from "../file-upload/types/index.cjs";
+import { FileUploadRootProps } from "../file-upload-root/types.cjs";
+import "../file-upload-root/index.cjs";
 
 //#region src/file-upload-inline/types.d.ts
 interface FileUploadInlineBaseProps {
@@ -11,6 +12,6 @@ interface FileUploadInlineBaseProps {
    */
   showIcon?: boolean;
 }
-type FileUploadInlineProps = FileUploadInlineBaseProps & FileUploadProps;
+type FileUploadInlineProps = FileUploadInlineBaseProps & FileUploadRootProps;
 //#endregion
 export { FileUploadInlineBaseProps, FileUploadInlineProps };

package/dist/file-upload-inline/types.d.ts

@@ -1,4 +1,5 @@
-import { FileUploadProps } from "../file-upload/types/index.js";
+import { FileUploadRootProps } from "../file-upload-root/types.js";
+import "../file-upload-root/index.js";
 
 //#region src/file-upload-inline/types.d.ts
 interface FileUploadInlineBaseProps {
@@ -11,6 +12,6 @@ interface FileUploadInlineBaseProps {
    */
   showIcon?: boolean;
 }
-type FileUploadInlineProps = FileUploadInlineBaseProps & FileUploadProps;
+type FileUploadInlineProps = FileUploadInlineBaseProps & FileUploadRootProps;
 //#endregion
 export { FileUploadInlineBaseProps, FileUploadInlineProps };

package/dist/file-upload-root/FileUploadRoot.cjs

@@ -0,0 +1,69 @@
+'use client';
+
+
+const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
+const require_use_file_upload_store = require('../file-upload/hooks/use-file-upload-store.cjs');
+require('../file-upload/index.cjs');
+const require_FileUploadRootItem = require('./FileUploadRootItem.cjs');
+let __pixpilot_shadcn = require("@pixpilot/shadcn");
+__pixpilot_shadcn = require_rolldown_runtime.__toESM(__pixpilot_shadcn);
+let react = require("react");
+react = require_rolldown_runtime.__toESM(react);
+let react_jsx_runtime = require("react/jsx-runtime");
+react_jsx_runtime = require_rolldown_runtime.__toESM(react_jsx_runtime);
+
+//#region src/file-upload-root/FileUploadRoot.tsx
+/**
+* FileUploadInline - An inline file upload component using FileUpload primitives
+*/
+function FileUploadRoot(props) {
+	const { value, onChange, className, disabled, multiple = false, children, onAccept, preventDuplicates, slots,...rest } = props;
+	const { handleAccept, displayFiles, deleteFile, getFile, orgValue } = require_use_file_upload_store.useFileUploadStore({
+		value,
+		onChange,
+		multiple,
+		preventDuplicates
+	});
+	const handleFileAccept = (0, react.useCallback)((files) => {
+		onAccept?.(files);
+		handleAccept(files);
+	}, [handleAccept, onAccept]);
+	if (process.env.NODE_ENV !== "production") {
+		if (!children && !(slots && slots.trigger)) throw new Error("FileUploadRoot requires children or slots.trigger to be passed in.");
+	}
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.FileUpload, {
+		...rest,
+		value: orgValue,
+		onAccept: handleFileAccept,
+		disabled,
+		multiple,
+		className: (0, __pixpilot_shadcn.cn)("space-y-2", className),
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [(multiple || !multiple && displayFiles.length === 0) && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.FileUploadDropzone, {
+			...slots?.dropzone || {},
+			className: (0, __pixpilot_shadcn.cn)("p-0 border-0 hover:bg-transparent", slots?.dropzone?.className),
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.FileUploadTrigger, {
+				asChild: true,
+				...slots?.trigger || {},
+				children
+			})
+		}), displayFiles.length > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.FileUploadList, {
+			className: "space-y-1 m-0",
+			forceMount: true,
+			children: displayFiles.map((data) => {
+				const { name, lastModified } = data;
+				const key = `${name}-${lastModified}`;
+				return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_FileUploadRootItem.FileUploadRootItem, {
+					...data,
+					file: getFile(data),
+					disabled,
+					onDelete: deleteFile,
+					...slots?.fileItem || {}
+				}, key);
+			})
+		})] })
+	});
+}
+FileUploadRoot.displayName = "FileUploadRoot";
+
+//#endregion
+exports.FileUploadRoot = FileUploadRoot;

package/dist/file-upload-root/FileUploadRoot.d.cts

@@ -0,0 +1,13 @@
+import { FileUploadRootProps } from "./types.cjs";
+import * as react_jsx_runtime12 from "react/jsx-runtime";
+
+//#region src/file-upload-root/FileUploadRoot.d.ts
+/**
+ * FileUploadInline - An inline file upload component using FileUpload primitives
+ */
+declare function FileUploadRoot(props: FileUploadRootProps): react_jsx_runtime12.JSX.Element;
+declare namespace FileUploadRoot {
+  var displayName: string;
+}
+//#endregion
+export { FileUploadRoot };

package/dist/file-upload-root/FileUploadRoot.d.ts

@@ -0,0 +1,13 @@
+import { FileUploadRootProps } from "./types.js";
+import * as react_jsx_runtime19 from "react/jsx-runtime";
+
+//#region src/file-upload-root/FileUploadRoot.d.ts
+/**
+ * FileUploadInline - An inline file upload component using FileUpload primitives
+ */
+declare function FileUploadRoot(props: FileUploadRootProps): react_jsx_runtime19.JSX.Element;
+declare namespace FileUploadRoot {
+  var displayName: string;
+}
+//#endregion
+export { FileUploadRoot };

package/dist/file-upload-root/FileUploadRoot.js

@@ -0,0 +1,63 @@
+'use client';
+
+
+import { useFileUploadStore } from "../file-upload/hooks/use-file-upload-store.js";
+import "../file-upload/index.js";
+import { FileUploadRootItem } from "./FileUploadRootItem.js";
+import { FileUpload, FileUploadDropzone, FileUploadList, FileUploadTrigger, cn } from "@pixpilot/shadcn";
+import { useCallback } from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/file-upload-root/FileUploadRoot.tsx
+/**
+* FileUploadInline - An inline file upload component using FileUpload primitives
+*/
+function FileUploadRoot(props) {
+	const { value, onChange, className, disabled, multiple = false, children, onAccept, preventDuplicates, slots,...rest } = props;
+	const { handleAccept, displayFiles, deleteFile, getFile, orgValue } = useFileUploadStore({
+		value,
+		onChange,
+		multiple,
+		preventDuplicates
+	});
+	const handleFileAccept = useCallback((files) => {
+		onAccept?.(files);
+		handleAccept(files);
+	}, [handleAccept, onAccept]);
+	if (!children && !(slots && slots.trigger)) throw new Error("FileUploadRoot requires children or slots.trigger to be passed in.");
+	return /* @__PURE__ */ jsx(FileUpload, {
+		...rest,
+		value: orgValue,
+		onAccept: handleFileAccept,
+		disabled,
+		multiple,
+		className: cn("space-y-2", className),
+		children: /* @__PURE__ */ jsxs(Fragment, { children: [(multiple || !multiple && displayFiles.length === 0) && /* @__PURE__ */ jsx(FileUploadDropzone, {
+			...slots?.dropzone || {},
+			className: cn("p-0 border-0 hover:bg-transparent", slots?.dropzone?.className),
+			children: /* @__PURE__ */ jsx(FileUploadTrigger, {
+				asChild: true,
+				...slots?.trigger || {},
+				children
+			})
+		}), displayFiles.length > 0 && /* @__PURE__ */ jsx(FileUploadList, {
+			className: "space-y-1 m-0",
+			forceMount: true,
+			children: displayFiles.map((data) => {
+				const { name, lastModified } = data;
+				const key = `${name}-${lastModified}`;
+				return /* @__PURE__ */ jsx(FileUploadRootItem, {
+					...data,
+					file: getFile(data),
+					disabled,
+					onDelete: deleteFile,
+					...slots?.fileItem || {}
+				}, key);
+			})
+		})] })
+	});
+}
+FileUploadRoot.displayName = "FileUploadRoot";
+
+//#endregion
+export { FileUploadRoot };

package/dist/{file-upload-inline/FileUploadInlineItem.cjs → file-upload-root/FileUploadRootItem.cjs}

@@ -16,7 +16,7 @@ pretty_bytes = require_rolldown_runtime.__toESM(pretty_bytes);
 let react_jsx_runtime = require("react/jsx-runtime");
 react_jsx_runtime = require_rolldown_runtime.__toESM(react_jsx_runtime);
 
-//#region src/file-upload-inline/FileUploadInlineItem.tsx
+//#region src/file-upload-root/FileUploadRootItem.tsx
 const FileMetaDataDisplay = ({ size, name, children }) => {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 		className: (0, __pixpilot_shadcn.cn)("min-w-0 flex-1 flex flex-col"),
@@ -55,7 +55,7 @@ const FileItemInnerWrapper = ({ children }) => {
 		children
 	});
 };
-const FileUploadInlineItem = react.default.memo(({ file, name = "", size = 0, type = "", lastModified = 0, disabled = false, onDelete }) => {
+const FileUploadRootItem = react.default.memo(({ file, name = "", size = 0, type = "", lastModified = 0, disabled = false, onDelete }) => {
 	require_use_file_upload_progress_callbacks.useFileUploadProgressCallbacks(file, { onChange: () => {} });
 	const fileError = require_use_file_error.useFileError(file);
 	const isUploading = (0, __pixpilot_shadcn.useFileUpload)((store) => {
@@ -89,6 +89,7 @@ const FileUploadInlineItem = react.default.memo(({ file, name = "", size = 0, ty
 		})] })
 	}, `${name}-${size}-${lastModified}`);
 });
+FileUploadRootItem.displayName = "FileUploadRootItem";
 
 //#endregion
-exports.FileUploadInlineItem = FileUploadInlineItem;
+exports.FileUploadRootItem = FileUploadRootItem;

package/dist/file-upload-root/FileUploadRootItem.d.cts

@@ -0,0 +1,13 @@
+import { FileMetadata } from "../file-upload/types/index.cjs";
+import { FileWithMetadata } from "../file-upload/utils/merge-file-metadata.cjs";
+import React from "react";
+
+//#region src/file-upload-root/FileUploadRootItem.d.ts
+interface FileUploadRootItemProps extends Partial<FileMetadata> {
+  file: File;
+  disabled?: boolean;
+  onDelete: (file: FileWithMetadata) => void;
+}
+declare const FileUploadRootItem: React.FC<FileUploadRootItemProps>;
+//#endregion
+export { FileUploadRootItem, FileUploadRootItemProps };

package/dist/file-upload-root/FileUploadRootItem.d.ts

@@ -0,0 +1,14 @@
+import { FileMetadata } from "../file-upload/types/index.js";
+import { FileWithMetadata } from "../file-upload/utils/merge-file-metadata.js";
+import "../file-upload/utils/index.js";
+import React from "react";
+
+//#region src/file-upload-root/FileUploadRootItem.d.ts
+interface FileUploadRootItemProps extends Partial<FileMetadata> {
+  file: File;
+  disabled?: boolean;
+  onDelete: (file: FileWithMetadata) => void;
+}
+declare const FileUploadRootItem: React.FC<FileUploadRootItemProps>;
+//#endregion
+export { FileUploadRootItem, FileUploadRootItemProps };

package/dist/{file-upload-inline/FileUploadInlineItem.js → file-upload-root/FileUploadRootItem.js}

@@ -10,7 +10,7 @@ import React from "react";
 import prettyBytes from "pretty-bytes";
 import { jsx, jsxs } from "react/jsx-runtime";
 
-//#region src/file-upload-inline/FileUploadInlineItem.tsx
+//#region src/file-upload-root/FileUploadRootItem.tsx
 const FileMetaDataDisplay = ({ size, name, children }) => {
 	return /* @__PURE__ */ jsxs("div", {
 		className: cn("min-w-0 flex-1 flex flex-col"),
@@ -49,7 +49,7 @@ const FileItemInnerWrapper = ({ children }) => {
 		children
 	});
 };
-const FileUploadInlineItem = React.memo(({ file, name = "", size = 0, type = "", lastModified = 0, disabled = false, onDelete }) => {
+const FileUploadRootItem = React.memo(({ file, name = "", size = 0, type = "", lastModified = 0, disabled = false, onDelete }) => {
 	useFileUploadProgressCallbacks(file, { onChange: () => {} });
 	const fileError = useFileError(file);
 	const isUploading = useFileUpload((store) => {
@@ -83,6 +83,7 @@ const FileUploadInlineItem = React.memo(({ file, name = "", size = 0, type = "",
 		})] })
 	}, `${name}-${size}-${lastModified}`);
 });
+FileUploadRootItem.displayName = "FileUploadRootItem";
 
 //#endregion
-export { FileUploadInlineItem };
+export { FileUploadRootItem };

package/dist/file-upload-root/index.cjs

@@ -0,0 +1,2 @@
+const require_FileUploadRootItem = require('./FileUploadRootItem.cjs');
+const require_FileUploadRoot = require('./FileUploadRoot.cjs');

package/dist/file-upload-root/index.d.cts

@@ -0,0 +1,3 @@
+import { FileUploadRootItem, FileUploadRootItemProps } from "./FileUploadRootItem.cjs";
+import { FileUploadRootProps, FileUploadRootPropsBaseProps } from "./types.cjs";
+import { FileUploadRoot } from "./FileUploadRoot.cjs";

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

@@ -0,0 +1,3 @@
+import { FileUploadRootItem, FileUploadRootItemProps } from "./FileUploadRootItem.js";
+import { FileUploadRootProps, FileUploadRootPropsBaseProps } from "./types.js";
+import { FileUploadRoot } from "./FileUploadRoot.js";

package/dist/file-upload-root/index.js

@@ -0,0 +1,2 @@
+import { FileUploadRootItem } from "./FileUploadRootItem.js";
+import { FileUploadRoot } from "./FileUploadRoot.js";

package/dist/file-upload-root/types.d.cts

@@ -0,0 +1,26 @@
+import { FileUploadProps } from "../file-upload/types/index.cjs";
+import { FileUploadRootItemProps } from "./FileUploadRootItem.cjs";
+import { ComponentProps, ReactNode } from "react";
+
+//#region src/file-upload-root/types.d.ts
+interface FileUploadRootPropsBaseProps {
+  /**
+   * Optional custom trigger children
+   */
+  children?: ReactNode;
+  slots?: {
+    /** Props spread onto the `FileUploadTrigger` (renders a `button`) */
+    trigger?: Omit<ComponentProps<'button'>, 'children'> & {
+      asChild?: boolean;
+    };
+    /** Props spread onto the `FileUploadDropzone` (renders a `div`) */
+    dropzone?: ComponentProps<'div'> & {
+      asChild?: boolean;
+    };
+    /** Props passed to the file item component */
+    fileItem?: Partial<FileUploadRootItemProps>;
+  };
+}
+type FileUploadRootProps = FileUploadRootPropsBaseProps & FileUploadProps;
+//#endregion
+export { FileUploadRootProps, FileUploadRootPropsBaseProps };

package/dist/file-upload-root/types.d.ts

@@ -0,0 +1,26 @@
+import { FileUploadProps } from "../file-upload/types/index.js";
+import { FileUploadRootItemProps } from "./FileUploadRootItem.js";
+import { ComponentProps, ReactNode } from "react";
+
+//#region src/file-upload-root/types.d.ts
+interface FileUploadRootPropsBaseProps {
+  /**
+   * Optional custom trigger children
+   */
+  children?: ReactNode;
+  slots?: {
+    /** Props spread onto the `FileUploadTrigger` (renders a `button`) */
+    trigger?: Omit<ComponentProps<'button'>, 'children'> & {
+      asChild?: boolean;
+    };
+    /** Props spread onto the `FileUploadDropzone` (renders a `div`) */
+    dropzone?: ComponentProps<'div'> & {
+      asChild?: boolean;
+    };
+    /** Props passed to the file item component */
+    fileItem?: Partial<FileUploadRootItemProps>;
+  };
+}
+type FileUploadRootProps = FileUploadRootPropsBaseProps & FileUploadProps;
+//#endregion
+export { FileUploadRootProps, FileUploadRootPropsBaseProps };

package/dist/index.cjs

@@ -25,6 +25,9 @@ const require_ContentCard = require('./ContentCard.cjs');
 const require_DatePicker = require('./DatePicker.cjs');
 const require_Dialog = require('./dialog/Dialog.cjs');
 require('./dialog/index.cjs');
+const require_FileUploadRootItem = require('./file-upload-root/FileUploadRootItem.cjs');
+const require_FileUploadRoot = require('./file-upload-root/FileUploadRoot.cjs');
+require('./file-upload-root/index.cjs');
 const require_FileUploadInline = require('./file-upload-inline/FileUploadInline.cjs');
 require('./file-upload-inline/index.cjs');
 const require_use_media_query = require('./hooks/use-media-query.cjs');
@@ -106,6 +109,8 @@ exports.DialogTitle = __pixpilot_shadcn.DialogTitle;
 exports.DialogTrigger = __pixpilot_shadcn.DialogTrigger;
 exports.FileUpload = require_FileUpload.FileUpload;
 exports.FileUploadInline = require_FileUploadInline.FileUploadInline;
+exports.FileUploadRoot = require_FileUploadRoot.FileUploadRoot;
+exports.FileUploadRootItem = require_FileUploadRootItem.FileUploadRootItem;
 exports.IconPicker = require_IconPicker.IconPicker;
 exports.IconToggle = require_IconToggle.IconToggle;
 exports.Input = require_Input.Input;

package/dist/index.d.cts

@@ -24,6 +24,10 @@ import { ContentCard } from "./ContentCard.cjs";
 import { DatePicker, DatePickerProps } from "./DatePicker.cjs";
 import { DialogBody, DialogContent, DialogFooter, DialogHeader } from "./dialog/Dialog.cjs";
 import { Dialog, DialogClose, DialogDescription, DialogTitle, DialogTrigger } from "./dialog/index.cjs";
+import { FileUploadRootItem, FileUploadRootItemProps } from "./file-upload-root/FileUploadRootItem.cjs";
+import { FileUploadRootProps, FileUploadRootPropsBaseProps } from "./file-upload-root/types.cjs";
+import { FileUploadRoot } from "./file-upload-root/FileUploadRoot.cjs";
+import "./file-upload-root/index.cjs";
 import { FileUploadInlineBaseProps, FileUploadInlineProps } from "./file-upload-inline/types.cjs";
 import { FileUploadInline } from "./file-upload-inline/FileUploadInline.cjs";
 import "./file-upload-inline/index.cjs";
@@ -79,4 +83,4 @@ import "./toast/index.cjs";
 import { ToggleGroup, ToggleGroupItem, ToggleGroupItemProps, ToggleGroupProps, ToggleGroupValue } from "./ToggleGroup.cjs";
 import { isSvgMarkupString, svgMarkupToMaskUrl } from "./utils/svg.cjs";
 import { cn } from "@pixpilot/shadcn";
-export { AbsoluteFill, Alert, AlertBaseProps, AlertProps, AlertToastProps, AlertVariant, AvatarUpload, AvatarUploadProps, BaseTabsTriggerProps, Button, ButtonGroup, ButtonGroupProps, ButtonGroupSeparator, ButtonGroupText, ButtonLoaderProps, ButtonProps, CircleLoader, CircleLoaderProps, CloseButtonAbsolute, CloseButtonRounded, CloseButtonRoundedProps, ColorPicker, ColorPickerBase, ColorPickerBaseProps, ColorPickerBaseSection, ColorPickerProps, ColorSelect, ColorSelectOption, BaseColorSelectProps as ColorSelectProps, Combobox, ConfirmationDialogProps, ContentCard, DEFAULT_ALERT_DURATION, DatePicker, DatePickerProps, Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogProvider, DialogProviderProps, DialogTitle, DialogTrigger, type FileMetadata, FileUpload, FileUploadBaseProps, FileUploadInline, FileUploadInlineBaseProps, FileUploadInlineProps, type FileUploadProgressCallBacks, type FileUploadProps, IconPicker, IconPickerProps, IconPickerVariant, IconProvider, IconProviderLoader, IconProviderProps, IconToggle, IconToggleProps, Input, InputProps, Layout, LayoutFooter, LayoutFooterProps, LayoutHeader, LayoutHeaderProps, LayoutMain, LayoutMainProps, LayoutProps, LoadingOverlay, LoadingOverlayProps, MultiFileUploadProps, OnChangeMultipleFiles, OnChangeSingleFile, Pagination, PaginationProps, Popover, PopoverAnchor, PopoverCloseButtonProps, PopoverContent, PopoverContentProps, PopoverTrigger, PresetColor, Rating, RatingButton, RatingButtonProps, RatingColor, RatingOption, RatingProps, RichTextEditor, RichTextEditorProps, RichTextEditorSlots, ScaledPreview, ScaledPreviewProps, ScaledPreviewSize, Select, SelectContentProps, SelectOption, SingleFileUploadProps, Slider, SliderInput, SliderInputProps, SliderProps, SliderSelect, SliderSelectOption, SliderSelectProps, SliderSelectValue, Tabs, TabsContent, TabsContext, TabsContextValue, TabsList, TabsListProps, TabsTrigger, TabsTriggerProps, TabsVariant, TagsInput, TagsInputInline, TagsInputInlineItem, TagsInputInlineProps, TagsInputProps, ThemeModeDropdown, ThemeModeDropdownProps, ThemeModeSwitchInside, ThemeModeSwitchInsideProps, ThemeModeSwitchInsideSize, ThemeModeSwitchOutside, ThemeModeSwitchOutsideProps, ThemeModeToggleButton, ThemeModeToggleButtonProps, ThemeProvider, ThemeProviderProps, ToastFunction, ToastMessage, Toaster, ToggleGroup, ToggleGroupItem, ToggleGroupItemProps, ToggleGroupProps, ToggleGroupValue, ToolbarItems, cn, isSvgMarkupString, showConfirmDialog, svgMarkupToMaskUrl, toast, useMediaQuery, useSelectKeyboard, useTabsContext, useTheme };
+export { AbsoluteFill, Alert, AlertBaseProps, AlertProps, AlertToastProps, AlertVariant, AvatarUpload, AvatarUploadProps, BaseTabsTriggerProps, Button, ButtonGroup, ButtonGroupProps, ButtonGroupSeparator, ButtonGroupText, ButtonLoaderProps, ButtonProps, CircleLoader, CircleLoaderProps, CloseButtonAbsolute, CloseButtonRounded, CloseButtonRoundedProps, ColorPicker, ColorPickerBase, ColorPickerBaseProps, ColorPickerBaseSection, ColorPickerProps, ColorSelect, ColorSelectOption, BaseColorSelectProps as ColorSelectProps, Combobox, ConfirmationDialogProps, ContentCard, DEFAULT_ALERT_DURATION, DatePicker, DatePickerProps, Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogProvider, DialogProviderProps, DialogTitle, DialogTrigger, type FileMetadata, FileUpload, FileUploadBaseProps, FileUploadInline, FileUploadInlineBaseProps, FileUploadInlineProps, type FileUploadProgressCallBacks, type FileUploadProps, FileUploadRoot, FileUploadRootItem, FileUploadRootItemProps, FileUploadRootProps, FileUploadRootPropsBaseProps, IconPicker, IconPickerProps, IconPickerVariant, IconProvider, IconProviderLoader, IconProviderProps, IconToggle, IconToggleProps, Input, InputProps, Layout, LayoutFooter, LayoutFooterProps, LayoutHeader, LayoutHeaderProps, LayoutMain, LayoutMainProps, LayoutProps, LoadingOverlay, LoadingOverlayProps, MultiFileUploadProps, OnChangeMultipleFiles, OnChangeSingleFile, Pagination, PaginationProps, Popover, PopoverAnchor, PopoverCloseButtonProps, PopoverContent, PopoverContentProps, PopoverTrigger, PresetColor, Rating, RatingButton, RatingButtonProps, RatingColor, RatingOption, RatingProps, RichTextEditor, RichTextEditorProps, RichTextEditorSlots, ScaledPreview, ScaledPreviewProps, ScaledPreviewSize, Select, SelectContentProps, SelectOption, SingleFileUploadProps, Slider, SliderInput, SliderInputProps, SliderProps, SliderSelect, SliderSelectOption, SliderSelectProps, SliderSelectValue, Tabs, TabsContent, TabsContext, TabsContextValue, TabsList, TabsListProps, TabsTrigger, TabsTriggerProps, TabsVariant, TagsInput, TagsInputInline, TagsInputInlineItem, TagsInputInlineProps, TagsInputProps, ThemeModeDropdown, ThemeModeDropdownProps, ThemeModeSwitchInside, ThemeModeSwitchInsideProps, ThemeModeSwitchInsideSize, ThemeModeSwitchOutside, ThemeModeSwitchOutsideProps, ThemeModeToggleButton, ThemeModeToggleButtonProps, ThemeProvider, ThemeProviderProps, ToastFunction, ToastMessage, Toaster, ToggleGroup, ToggleGroupItem, ToggleGroupItemProps, ToggleGroupProps, ToggleGroupValue, ToolbarItems, cn, isSvgMarkupString, showConfirmDialog, svgMarkupToMaskUrl, toast, useMediaQuery, useSelectKeyboard, useTabsContext, useTheme };

package/dist/index.d.ts

@@ -26,6 +26,10 @@ import { ContentCard } from "./ContentCard.js";
 import { DatePicker, DatePickerProps } from "./DatePicker.js";
 import { DialogBody, DialogContent, DialogFooter, DialogHeader } from "./dialog/Dialog.js";
 import { Dialog, DialogClose, DialogDescription, DialogTitle, DialogTrigger } from "./dialog/index.js";
+import { FileUploadRootItem, FileUploadRootItemProps } from "./file-upload-root/FileUploadRootItem.js";
+import { FileUploadRootProps, FileUploadRootPropsBaseProps } from "./file-upload-root/types.js";
+import { FileUploadRoot } from "./file-upload-root/FileUploadRoot.js";
+import "./file-upload-root/index.js";
 import { FileUploadInlineBaseProps, FileUploadInlineProps } from "./file-upload-inline/types.js";
 import { FileUploadInline } from "./file-upload-inline/FileUploadInline.js";
 import "./file-upload-inline/index.js";
@@ -81,4 +85,4 @@ import "./toast/index.js";
 import { ToggleGroup, ToggleGroupItem, ToggleGroupItemProps, ToggleGroupProps, ToggleGroupValue } from "./ToggleGroup.js";
 import { isSvgMarkupString, svgMarkupToMaskUrl } from "./utils/svg.js";
 import { cn } from "@pixpilot/shadcn";
-export { AbsoluteFill, Alert, AlertBaseProps, AlertProps, AlertToastProps, AlertVariant, AvatarUpload, AvatarUploadProps, BaseTabsTriggerProps, Button, ButtonGroup, ButtonGroupProps, ButtonGroupSeparator, ButtonGroupText, ButtonLoaderProps, ButtonProps, CircleLoader, CircleLoaderProps, CloseButtonAbsolute, CloseButtonRounded, CloseButtonRoundedProps, ColorPicker, ColorPickerBase, ColorPickerBaseProps, ColorPickerBaseSection, ColorPickerProps, ColorSelect, ColorSelectOption, BaseColorSelectProps as ColorSelectProps, Combobox, ConfirmationDialogProps, ContentCard, DEFAULT_ALERT_DURATION, DatePicker, DatePickerProps, Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogProvider, DialogProviderProps, DialogTitle, DialogTrigger, type FileMetadata, FileUpload, FileUploadBaseProps, FileUploadInline, FileUploadInlineBaseProps, FileUploadInlineProps, type FileUploadProgressCallBacks, type FileUploadProps, IconPicker, IconPickerProps, IconPickerVariant, IconProvider, IconProviderLoader, IconProviderProps, IconToggle, IconToggleProps, Input, InputProps, Layout, LayoutFooter, LayoutFooterProps, LayoutHeader, LayoutHeaderProps, LayoutMain, LayoutMainProps, LayoutProps, LoadingOverlay, LoadingOverlayProps, MultiFileUploadProps, OnChangeMultipleFiles, OnChangeSingleFile, Pagination, PaginationProps, Popover, PopoverAnchor, PopoverCloseButtonProps, PopoverContent, PopoverContentProps, PopoverTrigger, PresetColor, Rating, RatingButton, RatingButtonProps, RatingColor, RatingOption, RatingProps, RichTextEditor, RichTextEditorProps, RichTextEditorSlots, ScaledPreview, ScaledPreviewProps, ScaledPreviewSize, Select, SelectContentProps, SelectOption, SingleFileUploadProps, Slider, SliderInput, SliderInputProps, SliderProps, SliderSelect, SliderSelectOption, SliderSelectProps, SliderSelectValue, Tabs, TabsContent, TabsContext, TabsContextValue, TabsList, TabsListProps, TabsTrigger, TabsTriggerProps, TabsVariant, TagsInput, TagsInputInline, TagsInputInlineItem, TagsInputInlineProps, TagsInputProps, ThemeModeDropdown, ThemeModeDropdownProps, ThemeModeSwitchInside, ThemeModeSwitchInsideProps, ThemeModeSwitchInsideSize, ThemeModeSwitchOutside, ThemeModeSwitchOutsideProps, ThemeModeToggleButton, ThemeModeToggleButtonProps, ThemeProvider, ThemeProviderProps, ToastFunction, ToastMessage, Toaster, ToggleGroup, ToggleGroupItem, ToggleGroupItemProps, ToggleGroupProps, ToggleGroupValue, ToolbarItems, cn, isSvgMarkupString, showConfirmDialog, svgMarkupToMaskUrl, toast, useMediaQuery, useSelectKeyboard, useTabsContext, useTheme };
+export { AbsoluteFill, Alert, AlertBaseProps, AlertProps, AlertToastProps, AlertVariant, AvatarUpload, AvatarUploadProps, BaseTabsTriggerProps, Button, ButtonGroup, ButtonGroupProps, ButtonGroupSeparator, ButtonGroupText, ButtonLoaderProps, ButtonProps, CircleLoader, CircleLoaderProps, CloseButtonAbsolute, CloseButtonRounded, CloseButtonRoundedProps, ColorPicker, ColorPickerBase, ColorPickerBaseProps, ColorPickerBaseSection, ColorPickerProps, ColorSelect, ColorSelectOption, BaseColorSelectProps as ColorSelectProps, Combobox, ConfirmationDialogProps, ContentCard, DEFAULT_ALERT_DURATION, DatePicker, DatePickerProps, Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogProvider, DialogProviderProps, DialogTitle, DialogTrigger, type FileMetadata, FileUpload, FileUploadBaseProps, FileUploadInline, FileUploadInlineBaseProps, FileUploadInlineProps, type FileUploadProgressCallBacks, type FileUploadProps, FileUploadRoot, FileUploadRootItem, FileUploadRootItemProps, FileUploadRootProps, FileUploadRootPropsBaseProps, IconPicker, IconPickerProps, IconPickerVariant, IconProvider, IconProviderLoader, IconProviderProps, IconToggle, IconToggleProps, Input, InputProps, Layout, LayoutFooter, LayoutFooterProps, LayoutHeader, LayoutHeaderProps, LayoutMain, LayoutMainProps, LayoutProps, LoadingOverlay, LoadingOverlayProps, MultiFileUploadProps, OnChangeMultipleFiles, OnChangeSingleFile, Pagination, PaginationProps, Popover, PopoverAnchor, PopoverCloseButtonProps, PopoverContent, PopoverContentProps, PopoverTrigger, PresetColor, Rating, RatingButton, RatingButtonProps, RatingColor, RatingOption, RatingProps, RichTextEditor, RichTextEditorProps, RichTextEditorSlots, ScaledPreview, ScaledPreviewProps, ScaledPreviewSize, Select, SelectContentProps, SelectOption, SingleFileUploadProps, Slider, SliderInput, SliderInputProps, SliderProps, SliderSelect, SliderSelectOption, SliderSelectProps, SliderSelectValue, Tabs, TabsContent, TabsContext, TabsContextValue, TabsList, TabsListProps, TabsTrigger, TabsTriggerProps, TabsVariant, TagsInput, TagsInputInline, TagsInputInlineItem, TagsInputInlineProps, TagsInputProps, ThemeModeDropdown, ThemeModeDropdownProps, ThemeModeSwitchInside, ThemeModeSwitchInsideProps, ThemeModeSwitchInsideSize, ThemeModeSwitchOutside, ThemeModeSwitchOutsideProps, ThemeModeToggleButton, ThemeModeToggleButtonProps, ThemeProvider, ThemeProviderProps, ToastFunction, ToastMessage, Toaster, ToggleGroup, ToggleGroupItem, ToggleGroupItemProps, ToggleGroupProps, ToggleGroupValue, ToolbarItems, cn, isSvgMarkupString, showConfirmDialog, svgMarkupToMaskUrl, toast, useMediaQuery, useSelectKeyboard, useTabsContext, useTheme };

package/dist/index.js

@@ -24,6 +24,9 @@ import { ContentCard } from "./ContentCard.js";
 import { DatePicker } from "./DatePicker.js";
 import { DialogBody, DialogContent, DialogFooter, DialogHeader } from "./dialog/Dialog.js";
 import { Dialog, DialogClose, DialogDescription, DialogTitle, DialogTrigger } from "./dialog/index.js";
+import { FileUploadRootItem } from "./file-upload-root/FileUploadRootItem.js";
+import { FileUploadRoot } from "./file-upload-root/FileUploadRoot.js";
+import "./file-upload-root/index.js";
 import { FileUploadInline } from "./file-upload-inline/FileUploadInline.js";
 import "./file-upload-inline/index.js";
 import { useMediaQuery } from "./hooks/use-media-query.js";
@@ -75,4 +78,4 @@ import "./toast/index.js";
 import { ToggleGroup, ToggleGroupItem } from "./ToggleGroup.js";
 import { cn } from "@pixpilot/shadcn";
 
-export { AbsoluteFill, Alert, AvatarUpload, Button, ButtonGroup, ButtonGroupSeparator, ButtonGroupText, CircleLoader, CloseButtonAbsolute, CloseButtonRounded, ColorPicker, ColorPickerBase, ColorSelect, Combobox, ContentCard, DEFAULT_ALERT_DURATION, DatePicker, Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogProvider, DialogTitle, DialogTrigger, FileUpload, FileUploadInline, IconPicker, IconToggle, Input, Layout, LayoutFooter, LayoutHeader, LayoutMain, LoadingOverlay, Pagination, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, Rating, RatingButton, RichTextEditor, ScaledPreview, Select, Slider, SliderInput, SliderSelect, Tabs, TabsContent, TabsContext, TabsList, TabsTrigger, TagsInput, TagsInputInline, ThemeModeDropdown, ThemeModeSwitchInside, ThemeModeSwitchOutside, ThemeModeToggleButton, ThemeProvider, Toaster, ToggleGroup, ToggleGroupItem, cn, isSvgMarkupString, showConfirmDialog, svgMarkupToMaskUrl, toast, useMediaQuery, useSelectKeyboard, useTabsContext, useTheme };
+export { AbsoluteFill, Alert, AvatarUpload, Button, ButtonGroup, ButtonGroupSeparator, ButtonGroupText, CircleLoader, CloseButtonAbsolute, CloseButtonRounded, ColorPicker, ColorPickerBase, ColorSelect, Combobox, ContentCard, DEFAULT_ALERT_DURATION, DatePicker, Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogProvider, DialogTitle, DialogTrigger, FileUpload, FileUploadInline, FileUploadRoot, FileUploadRootItem, IconPicker, IconToggle, Input, Layout, LayoutFooter, LayoutHeader, LayoutMain, LoadingOverlay, Pagination, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, Rating, RatingButton, RichTextEditor, ScaledPreview, Select, Slider, SliderInput, SliderSelect, Tabs, TabsContent, TabsContext, TabsList, TabsTrigger, TagsInput, TagsInputInline, ThemeModeDropdown, ThemeModeSwitchInside, ThemeModeSwitchOutside, ThemeModeToggleButton, ThemeProvider, Toaster, ToggleGroup, ToggleGroupItem, cn, isSvgMarkupString, showConfirmDialog, svgMarkupToMaskUrl, toast, useMediaQuery, useSelectKeyboard, useTabsContext, useTheme };

package/dist/input/Input.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime12 from "react/jsx-runtime";
+import * as react_jsx_runtime13 from "react/jsx-runtime";
 import { InputProps } from "@pixpilot/shadcn";
 import * as React$1 from "react";
 
@@ -10,6 +10,6 @@ type InputProps$1 = InputProps & {
   prefixClassName?: string;
   suffixClassName?: string;
 };
-declare function Input(props: InputProps$1): react_jsx_runtime12.JSX.Element;
+declare function Input(props: InputProps$1): react_jsx_runtime13.JSX.Element;
 //#endregion
 export { Input, InputProps$1 as InputProps };

package/dist/tags-input/TagsInput.d.cts

@@ -1,5 +1,5 @@
 import { CommandOptionListItem } from "../CommandOptionList.cjs";
-import * as react_jsx_runtime14 from "react/jsx-runtime";
+import * as react_jsx_runtime19 from "react/jsx-runtime";
 
 //#region src/tags-input/TagsInput.d.ts
 interface TagsInputProps {
@@ -57,6 +57,6 @@ declare function TagsInput({
   addOnTab,
   onValidate,
   addButtonVisibility
-}: TagsInputProps): react_jsx_runtime14.JSX.Element;
+}: TagsInputProps): react_jsx_runtime19.JSX.Element;
 //#endregion
 export { TagsInput, TagsInputProps };

package/dist/tags-input/TagsInputInline.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime13 from "react/jsx-runtime";
+import * as react_jsx_runtime18 from "react/jsx-runtime";
 import { ChangeEventHandler, FocusEventHandler, KeyboardEventHandler, MouseEventHandler, Ref } from "react";
 
 //#region src/tags-input/TagsInputInline.d.ts
@@ -75,6 +75,6 @@ declare function TagsInputInline({
   canAddCurrentValue,
   onAddCurrentInput,
   showClear
-}: TagsInputInlineProps): react_jsx_runtime13.JSX.Element;
+}: TagsInputInlineProps): react_jsx_runtime18.JSX.Element;
 //#endregion
 export { TagsInputInline, TagsInputInlineItem, TagsInputInlineProps };

package/dist/theme-toggle/ThemeModeToggleButton.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime18 from "react/jsx-runtime";
+import * as react_jsx_runtime14 from "react/jsx-runtime";
 
 //#region src/theme-toggle/ThemeModeToggleButton.d.ts
 interface ThemeModeToggleButtonProps {
@@ -13,7 +13,7 @@ interface ThemeModeToggleButtonProps {
  * Light/Dark toggle button.
  * Pure component - toggles between light and dark.
  */
-declare function ThemeModeToggleButton(props: ThemeModeToggleButtonProps): react_jsx_runtime18.JSX.Element;
+declare function ThemeModeToggleButton(props: ThemeModeToggleButtonProps): react_jsx_runtime14.JSX.Element;
 declare namespace ThemeModeToggleButton {
   var displayName: string;
 }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@pixpilot/shadcn-ui",
   "type": "module",
-  "version": "0.57.1",
+  "version": "0.58.0",
   "description": "Custom UI components and utilities built with shadcn/ui.",
   "author": "m.doaie <m.doaie@hotmail.com>",
   "license": "MIT",
@@ -47,7 +47,7 @@
     "pretty-bytes": "^7.1.0",
     "react-responsive": "^10.0.1",
     "sonner": "2.0.7",
-    "@pixpilot/shadcn": "0.10.1"
+    "@pixpilot/shadcn": "0.11.0"
   },
   "devDependencies": {
     "@storybook/react": "^8.6.14",

package/dist/shadcn/src/lib/index.cjs

@@ -1 +0,0 @@
-const require_utils = require('./utils.cjs');

package/dist/shadcn/src/lib/index.js

@@ -1 +0,0 @@
-import { cn } from "./utils.js";