@databricks/appkit-ui 0.17.0 → 0.19.0

package/dist/react/file-browser/directory-list.js

@@ -0,0 +1,74 @@
+import { Button } from "../ui/button.js";
+import { Card } from "../ui/card.js";
+import { Skeleton } from "../ui/skeleton.js";
+import { FileEntry } from "./file-entry.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { AlertCircle, ArrowLeft, FileIcon } from "lucide-react";
+
+//#region src/react/file-browser/directory-list.tsx
+/** Card-wrapped directory listing with loading, error, and empty states */
+function DirectoryList({ entries, loading, error, onEntryClick, onNavigateToParent, onRetry, isAtRoot, selectedPath, resolveEntryPath, headerContent, hasCurrentPath, formatSize, labels, className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "directory-list",
+		className,
+		...props,
+		children: /* @__PURE__ */ jsxs(Card, {
+			className: "p-0 overflow-hidden",
+			children: [
+				!isAtRoot && onNavigateToParent && /* @__PURE__ */ jsxs("button", {
+					type: "button",
+					onClick: onNavigateToParent,
+					className: "flex items-center gap-2 px-4 py-3 w-full text-left hover:bg-muted/50 border-b text-sm text-muted-foreground transition-colors",
+					children: [/* @__PURE__ */ jsx(ArrowLeft, { className: "h-4 w-4" }), labels?.backToParent ?? "Back to parent"]
+				}),
+				headerContent,
+				loading && /* @__PURE__ */ jsxs("div", {
+					className: "p-4 space-y-3",
+					children: [
+						/* @__PURE__ */ jsx(Skeleton, { className: "h-10 w-full" }),
+						/* @__PURE__ */ jsx(Skeleton, { className: "h-10 w-full" }),
+						/* @__PURE__ */ jsx(Skeleton, { className: "h-10 w-full" })
+					]
+				}),
+				error && /* @__PURE__ */ jsxs("div", {
+					className: "p-6 text-center",
+					children: [
+						/* @__PURE__ */ jsx(AlertCircle, { className: "h-8 w-8 text-destructive mx-auto mb-2" }),
+						/* @__PURE__ */ jsx("p", {
+							className: "text-sm text-destructive",
+							children: error
+						}),
+						onRetry && /* @__PURE__ */ jsx(Button, {
+							variant: "outline",
+							size: "sm",
+							className: "mt-3",
+							onClick: onRetry,
+							children: labels?.retry ?? "Retry"
+						})
+					]
+				}),
+				!loading && !error && entries.length === 0 && /* @__PURE__ */ jsxs("div", {
+					className: "p-6 text-center text-muted-foreground",
+					children: [/* @__PURE__ */ jsx(FileIcon, { className: "h-8 w-8 mx-auto mb-2 opacity-50" }), /* @__PURE__ */ jsx("p", {
+						className: "text-sm",
+						children: hasCurrentPath ? labels?.emptyDirectory ?? "This directory is empty." : labels?.noVolumeConfigured ?? "No volume configured. Configure volumes in the files plugin to get started."
+					})]
+				}),
+				!loading && !error && entries.map((entry) => {
+					const entryPath = resolveEntryPath(entry);
+					return /* @__PURE__ */ jsx(FileEntry, {
+						entry,
+						entryPath,
+						isSelected: selectedPath === entryPath,
+						formatSize,
+						onClick: () => onEntryClick(entry)
+					}, entryPath);
+				})
+			]
+		})
+	});
+}
+
+//#endregion
+export { DirectoryList };
+//# sourceMappingURL=directory-list.js.map

package/dist/react/file-browser/directory-list.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"directory-list.js","names":[],"sources":["../../../src/react/file-browser/directory-list.tsx"],"sourcesContent":["import { AlertCircle, ArrowLeft, FileIcon } from \"lucide-react\";\nimport { Button } from \"../ui/button\";\nimport { Card } from \"../ui/card\";\nimport { Skeleton } from \"../ui/skeleton\";\nimport { FileEntry } from \"./file-entry\";\nimport type { DirectoryEntry, FileBrowserLabels } from \"./types\";\n\n/** Props for the DirectoryList component */\nexport interface DirectoryListProps\n  extends Omit<React.ComponentProps<\"div\">, \"children\"> {\n  /** Directory entries to display */\n  entries: DirectoryEntry[];\n  /** Whether the directory is currently loading */\n  loading?: boolean;\n  /** Error message to display */\n  error?: string | null;\n  /** Called when an entry is clicked */\n  onEntryClick: (entry: DirectoryEntry) => void;\n  /** Called when the back/parent button is clicked */\n  onNavigateToParent?: () => void;\n  /** Called when the retry button is clicked */\n  onRetry?: () => void;\n  /** Whether the user is at the root directory (hides back button) */\n  isAtRoot?: boolean;\n  /** Currently selected file path for highlighting */\n  selectedPath?: string | null;\n  /** Resolves a DirectoryEntry to its full path */\n  resolveEntryPath: (entry: DirectoryEntry) => string;\n  /** Content rendered between the back button and the entry list (e.g., NewFolderInput) */\n  headerContent?: React.ReactNode;\n  /** Whether a current path is set (affects empty state message) */\n  hasCurrentPath?: boolean;\n  /** Custom file size formatter */\n  formatSize?: (bytes: number | undefined) => string;\n  /** Customizable labels */\n  labels?: Pick<\n    FileBrowserLabels,\n    \"backToParent\" | \"emptyDirectory\" | \"noVolumeConfigured\" | \"retry\"\n  >;\n}\n\n/** Card-wrapped directory listing with loading, error, and empty states */\nexport function DirectoryList({\n  entries,\n  loading,\n  error,\n  onEntryClick,\n  onNavigateToParent,\n  onRetry,\n  isAtRoot,\n  selectedPath,\n  resolveEntryPath,\n  headerContent,\n  hasCurrentPath,\n  formatSize,\n  labels,\n  className,\n  ...props\n}: DirectoryListProps) {\n  return (\n    <div data-slot=\"directory-list\" className={className} {...props}>\n      <Card className=\"p-0 overflow-hidden\">\n        {!isAtRoot && onNavigateToParent && (\n          <button\n            type=\"button\"\n            onClick={onNavigateToParent}\n            className=\"flex items-center gap-2 px-4 py-3 w-full text-left hover:bg-muted/50 border-b text-sm text-muted-foreground transition-colors\"\n          >\n            <ArrowLeft className=\"h-4 w-4\" />\n            {labels?.backToParent ?? \"Back to parent\"}\n          </button>\n        )}\n\n        {headerContent}\n\n        {loading && (\n          <div className=\"p-4 space-y-3\">\n            <Skeleton className=\"h-10 w-full\" />\n            <Skeleton className=\"h-10 w-full\" />\n            <Skeleton className=\"h-10 w-full\" />\n          </div>\n        )}\n\n        {error && (\n          <div className=\"p-6 text-center\">\n            <AlertCircle className=\"h-8 w-8 text-destructive mx-auto mb-2\" />\n            <p className=\"text-sm text-destructive\">{error}</p>\n            {onRetry && (\n              <Button\n                variant=\"outline\"\n                size=\"sm\"\n                className=\"mt-3\"\n                onClick={onRetry}\n              >\n                {labels?.retry ?? \"Retry\"}\n              </Button>\n            )}\n          </div>\n        )}\n\n        {!loading && !error && entries.length === 0 && (\n          <div className=\"p-6 text-center text-muted-foreground\">\n            <FileIcon className=\"h-8 w-8 mx-auto mb-2 opacity-50\" />\n            <p className=\"text-sm\">\n              {hasCurrentPath\n                ? (labels?.emptyDirectory ?? \"This directory is empty.\")\n                : (labels?.noVolumeConfigured ??\n                  \"No volume configured. Configure volumes in the files plugin to get started.\")}\n            </p>\n          </div>\n        )}\n\n        {!loading &&\n          !error &&\n          entries.map((entry) => {\n            const entryPath = resolveEntryPath(entry);\n            return (\n              <FileEntry\n                key={entryPath}\n                entry={entry}\n                entryPath={entryPath}\n                isSelected={selectedPath === entryPath}\n                formatSize={formatSize}\n                onClick={() => onEntryClick(entry)}\n              />\n            );\n          })}\n      </Card>\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;AA0CA,SAAgB,cAAc,EAC5B,SACA,SACA,OACA,cACA,oBACA,SACA,UACA,cACA,kBACA,eACA,gBACA,YACA,QACA,WACA,GAAG,SACkB;AACrB,QACE,oBAAC;EAAI,aAAU;EAA4B;EAAW,GAAI;YACxD,qBAAC;GAAK,WAAU;;IACb,CAAC,YAAY,sBACZ,qBAAC;KACC,MAAK;KACL,SAAS;KACT,WAAU;gBAEV,oBAAC,aAAU,WAAU,YAAY,EAChC,QAAQ,gBAAgB;MAClB;IAGV;IAEA,WACC,qBAAC;KAAI,WAAU;;MACb,oBAAC,YAAS,WAAU,gBAAgB;MACpC,oBAAC,YAAS,WAAU,gBAAgB;MACpC,oBAAC,YAAS,WAAU,gBAAgB;;MAChC;IAGP,SACC,qBAAC;KAAI,WAAU;;MACb,oBAAC,eAAY,WAAU,0CAA0C;MACjE,oBAAC;OAAE,WAAU;iBAA4B;QAAU;MAClD,WACC,oBAAC;OACC,SAAQ;OACR,MAAK;OACL,WAAU;OACV,SAAS;iBAER,QAAQ,SAAS;QACX;;MAEP;IAGP,CAAC,WAAW,CAAC,SAAS,QAAQ,WAAW,KACxC,qBAAC;KAAI,WAAU;gBACb,oBAAC,YAAS,WAAU,oCAAoC,EACxD,oBAAC;MAAE,WAAU;gBACV,iBACI,QAAQ,kBAAkB,6BAC1B,QAAQ,sBACT;OACF;MACA;IAGP,CAAC,WACA,CAAC,SACD,QAAQ,KAAK,UAAU;KACrB,MAAM,YAAY,iBAAiB,MAAM;AACzC,YACE,oBAAC;MAEQ;MACI;MACX,YAAY,iBAAiB;MACjB;MACZ,eAAe,aAAa,MAAM;QAL7B,UAML;MAEJ;;IACC;GACH"}

package/dist/react/file-browser/file-breadcrumb.d.ts

@@ -0,0 +1,25 @@
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/react/file-browser/file-breadcrumb.d.ts
+/** Props for the FileBreadcrumb component */
+interface FileBreadcrumbProps extends Omit<React.ComponentProps<"nav">, "children"> {
+  /** Label for the root breadcrumb item */
+  rootLabel: string;
+  /** Path segments after the root */
+  segments: string[];
+  /** Called when the root breadcrumb is clicked */
+  onNavigateToRoot: () => void;
+  /** Called when a segment breadcrumb is clicked (receives segment index) */
+  onNavigateToSegment: (index: number) => void;
+}
+/** Path-aware breadcrumb navigation built on top of Breadcrumb primitives */
+declare function FileBreadcrumb({
+  rootLabel,
+  segments,
+  onNavigateToRoot,
+  onNavigateToSegment,
+  ...props
+}: FileBreadcrumbProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+export { FileBreadcrumb, FileBreadcrumbProps };
+//# sourceMappingURL=file-breadcrumb.d.ts.map

package/dist/react/file-browser/file-breadcrumb.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"file-breadcrumb.d.ts","names":[],"sources":["../../../src/react/file-browser/file-breadcrumb.tsx"],"mappings":";;;;UAUiB,mBAAA,SACP,IAAA,CAAK,KAAA,CAAM,cAAA;;EAEnB,SAAA;EAFA;EAIA,QAAA;EAJY;EAMZ,gBAAA;EANa;EAQb,mBAAA,GAAsB,KAAA;AAAA;;iBAIR,cAAA,CAAA;EACd,SAAA;EACA,QAAA;EACA,gBAAA;EACA,mBAAA;EAAA,GACG;AAAA,GACF,mBAAA,GAAmB,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/react/file-browser/file-breadcrumb.js

@@ -0,0 +1,27 @@
+import { Breadcrumb, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator } from "../ui/breadcrumb.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/react/file-browser/file-breadcrumb.tsx
+/** Path-aware breadcrumb navigation built on top of Breadcrumb primitives */
+function FileBreadcrumb({ rootLabel, segments, onNavigateToRoot, onNavigateToSegment, ...props }) {
+	return /* @__PURE__ */ jsx(Breadcrumb, {
+		"data-slot": "file-breadcrumb",
+		...props,
+		children: /* @__PURE__ */ jsxs(BreadcrumbList, { children: [/* @__PURE__ */ jsx(BreadcrumbItem, { children: segments.length > 0 ? /* @__PURE__ */ jsx(BreadcrumbLink, {
+			className: "cursor-pointer",
+			onClick: onNavigateToRoot,
+			children: rootLabel
+		}) : /* @__PURE__ */ jsx(BreadcrumbPage, { children: rootLabel }) }), segments.map((segment, index) => /* @__PURE__ */ jsxs("span", {
+			className: "contents",
+			children: [/* @__PURE__ */ jsx(BreadcrumbSeparator, {}), /* @__PURE__ */ jsx(BreadcrumbItem, { children: index === segments.length - 1 ? /* @__PURE__ */ jsx(BreadcrumbPage, { children: segment }) : /* @__PURE__ */ jsx(BreadcrumbLink, {
+				className: "cursor-pointer",
+				onClick: () => onNavigateToSegment(index),
+				children: segment
+			}) })]
+		}, segment))] })
+	});
+}
+
+//#endregion
+export { FileBreadcrumb };
+//# sourceMappingURL=file-breadcrumb.js.map

package/dist/react/file-browser/file-breadcrumb.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"file-breadcrumb.js","names":[],"sources":["../../../src/react/file-browser/file-breadcrumb.tsx"],"sourcesContent":["import {\n  Breadcrumb,\n  BreadcrumbItem,\n  BreadcrumbLink,\n  BreadcrumbList,\n  BreadcrumbPage,\n  BreadcrumbSeparator,\n} from \"../ui/breadcrumb\";\n\n/** Props for the FileBreadcrumb component */\nexport interface FileBreadcrumbProps\n  extends Omit<React.ComponentProps<\"nav\">, \"children\"> {\n  /** Label for the root breadcrumb item */\n  rootLabel: string;\n  /** Path segments after the root */\n  segments: string[];\n  /** Called when the root breadcrumb is clicked */\n  onNavigateToRoot: () => void;\n  /** Called when a segment breadcrumb is clicked (receives segment index) */\n  onNavigateToSegment: (index: number) => void;\n}\n\n/** Path-aware breadcrumb navigation built on top of Breadcrumb primitives */\nexport function FileBreadcrumb({\n  rootLabel,\n  segments,\n  onNavigateToRoot,\n  onNavigateToSegment,\n  ...props\n}: FileBreadcrumbProps) {\n  return (\n    <Breadcrumb data-slot=\"file-breadcrumb\" {...props}>\n      <BreadcrumbList>\n        <BreadcrumbItem>\n          {segments.length > 0 ? (\n            <BreadcrumbLink\n              className=\"cursor-pointer\"\n              onClick={onNavigateToRoot}\n            >\n              {rootLabel}\n            </BreadcrumbLink>\n          ) : (\n            <BreadcrumbPage>{rootLabel}</BreadcrumbPage>\n          )}\n        </BreadcrumbItem>\n        {segments.map((segment, index) => (\n          <span key={segment} className=\"contents\">\n            <BreadcrumbSeparator />\n            <BreadcrumbItem>\n              {index === segments.length - 1 ? (\n                <BreadcrumbPage>{segment}</BreadcrumbPage>\n              ) : (\n                <BreadcrumbLink\n                  className=\"cursor-pointer\"\n                  onClick={() => onNavigateToSegment(index)}\n                >\n                  {segment}\n                </BreadcrumbLink>\n              )}\n            </BreadcrumbItem>\n          </span>\n        ))}\n      </BreadcrumbList>\n    </Breadcrumb>\n  );\n}\n"],"mappings":";;;;;AAuBA,SAAgB,eAAe,EAC7B,WACA,UACA,kBACA,qBACA,GAAG,SACmB;AACtB,QACE,oBAAC;EAAW,aAAU;EAAkB,GAAI;YAC1C,qBAAC,6BACC,oBAAC,4BACE,SAAS,SAAS,IACjB,oBAAC;GACC,WAAU;GACV,SAAS;aAER;IACc,GAEjB,oBAAC,4BAAgB,YAA2B,GAE/B,EAChB,SAAS,KAAK,SAAS,UACtB,qBAAC;GAAmB,WAAU;cAC5B,oBAAC,wBAAsB,EACvB,oBAAC,4BACE,UAAU,SAAS,SAAS,IAC3B,oBAAC,4BAAgB,UAAyB,GAE1C,oBAAC;IACC,WAAU;IACV,eAAe,oBAAoB,MAAM;cAExC;KACc,GAEJ;KAbR,QAcJ,CACP,IACa;GACN"}

package/dist/react/file-browser/file-entry.d.ts

@@ -0,0 +1,27 @@
+import { DirectoryEntry } from "./types.js";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/react/file-browser/file-entry.d.ts
+/** Props for the FileEntry component */
+interface FileEntryProps extends Omit<React.ComponentProps<"button">, "children"> {
+  /** The directory entry to render */
+  entry: DirectoryEntry;
+  /** Resolved full path for this entry */
+  entryPath: string;
+  /** Whether this entry is currently selected */
+  isSelected?: boolean;
+  /** Custom file size formatter (defaults to formatFileSize) */
+  formatSize?: (bytes: number | undefined) => string;
+}
+/** Single file or directory row with icon, name, size, and selection state */
+declare function FileEntry({
+  entry,
+  entryPath,
+  isSelected,
+  formatSize,
+  className,
+  ...props
+}: FileEntryProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+export { FileEntry, FileEntryProps };
+//# sourceMappingURL=file-entry.d.ts.map

package/dist/react/file-browser/file-entry.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"file-entry.d.ts","names":[],"sources":["../../../src/react/file-browser/file-entry.tsx"],"mappings":";;;;;UAMiB,cAAA,SACP,IAAA,CAAK,KAAA,CAAM,cAAA;;EAEnB,KAAA,EAAO,cAAA;EAFP;EAIA,SAAA;EAJa;EAMb,UAAA;EANQ;EAQR,UAAA,IAAc,KAAA;AAAA;;iBAIA,SAAA,CAAA;EACd,KAAA;EACA,SAAA;EACA,UAAA;EACA,UAAA;EACA,SAAA;EAAA,GACG;AAAA,GACF,cAAA,GAAc,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/react/file-browser/file-entry.js

@@ -0,0 +1,31 @@
+import { formatFileSize } from "../lib/format.js";
+import { cn } from "../lib/utils.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { ChevronRight, FileIcon, FolderIcon } from "lucide-react";
+
+//#region src/react/file-browser/file-entry.tsx
+/** Single file or directory row with icon, name, size, and selection state */
+function FileEntry({ entry, entryPath, isSelected, formatSize = formatFileSize, className, ...props }) {
+	return /* @__PURE__ */ jsxs("button", {
+		type: "button",
+		"data-slot": "file-entry",
+		className: cn("flex items-center gap-3 px-4 py-3 w-full text-left hover:bg-muted/50 border-b last:border-b-0 transition-colors", isSelected && "bg-muted", className),
+		...props,
+		children: [
+			entry.is_directory ? /* @__PURE__ */ jsx(FolderIcon, { className: "h-5 w-5 text-blue-500 shrink-0" }) : /* @__PURE__ */ jsx(FileIcon, { className: "h-5 w-5 text-muted-foreground shrink-0" }),
+			/* @__PURE__ */ jsx("span", {
+				className: "flex-1 truncate text-sm text-foreground",
+				children: entry.name ?? entryPath.split("/").pop()
+			}),
+			entry.is_directory && /* @__PURE__ */ jsx(ChevronRight, { className: "h-4 w-4 text-muted-foreground shrink-0" }),
+			!entry.is_directory && entry.file_size !== void 0 && /* @__PURE__ */ jsx("span", {
+				className: "text-xs text-muted-foreground shrink-0",
+				children: formatSize(entry.file_size)
+			})
+		]
+	});
+}
+
+//#endregion
+export { FileEntry };
+//# sourceMappingURL=file-entry.js.map

package/dist/react/file-browser/file-entry.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"file-entry.js","names":[],"sources":["../../../src/react/file-browser/file-entry.tsx"],"sourcesContent":["import { ChevronRight, FileIcon, FolderIcon } from \"lucide-react\";\nimport { formatFileSize } from \"../lib/format\";\nimport { cn } from \"../lib/utils\";\nimport type { DirectoryEntry } from \"./types\";\n\n/** Props for the FileEntry component */\nexport interface FileEntryProps\n  extends Omit<React.ComponentProps<\"button\">, \"children\"> {\n  /** The directory entry to render */\n  entry: DirectoryEntry;\n  /** Resolved full path for this entry */\n  entryPath: string;\n  /** Whether this entry is currently selected */\n  isSelected?: boolean;\n  /** Custom file size formatter (defaults to formatFileSize) */\n  formatSize?: (bytes: number | undefined) => string;\n}\n\n/** Single file or directory row with icon, name, size, and selection state */\nexport function FileEntry({\n  entry,\n  entryPath,\n  isSelected,\n  formatSize = formatFileSize,\n  className,\n  ...props\n}: FileEntryProps) {\n  return (\n    <button\n      type=\"button\"\n      data-slot=\"file-entry\"\n      className={cn(\n        \"flex items-center gap-3 px-4 py-3 w-full text-left hover:bg-muted/50 border-b last:border-b-0 transition-colors\",\n        isSelected && \"bg-muted\",\n        className,\n      )}\n      {...props}\n    >\n      {entry.is_directory ? (\n        <FolderIcon className=\"h-5 w-5 text-blue-500 shrink-0\" />\n      ) : (\n        <FileIcon className=\"h-5 w-5 text-muted-foreground shrink-0\" />\n      )}\n      <span className=\"flex-1 truncate text-sm text-foreground\">\n        {entry.name ?? entryPath.split(\"/\").pop()}\n      </span>\n      {entry.is_directory && (\n        <ChevronRight className=\"h-4 w-4 text-muted-foreground shrink-0\" />\n      )}\n      {!entry.is_directory && entry.file_size !== undefined && (\n        <span className=\"text-xs text-muted-foreground shrink-0\">\n          {formatSize(entry.file_size)}\n        </span>\n      )}\n    </button>\n  );\n}\n"],"mappings":";;;;;;;AAmBA,SAAgB,UAAU,EACxB,OACA,WACA,YACA,aAAa,gBACb,WACA,GAAG,SACc;AACjB,QACE,qBAAC;EACC,MAAK;EACL,aAAU;EACV,WAAW,GACT,mHACA,cAAc,YACd,UACD;EACD,GAAI;;GAEH,MAAM,eACL,oBAAC,cAAW,WAAU,mCAAmC,GAEzD,oBAAC,YAAS,WAAU,2CAA2C;GAEjE,oBAAC;IAAK,WAAU;cACb,MAAM,QAAQ,UAAU,MAAM,IAAI,CAAC,KAAK;KACpC;GACN,MAAM,gBACL,oBAAC,gBAAa,WAAU,2CAA2C;GAEpE,CAAC,MAAM,gBAAgB,MAAM,cAAc,UAC1C,oBAAC;IAAK,WAAU;cACb,WAAW,MAAM,UAAU;KACvB;;GAEF"}

package/dist/react/file-browser/file-preview-panel.d.ts

@@ -0,0 +1,42 @@
+import { FileBrowserLabels, FilePreview } from "./types.js";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/react/file-browser/file-preview-panel.d.ts
+/** Props for the FilePreviewPanel component */
+interface FilePreviewPanelProps extends Omit<React.ComponentProps<"div">, "children"> {
+  /** Full path of the selected file (null when nothing is selected) */
+  selectedFile: string | null;
+  /** Preview data for the selected file */
+  preview: FilePreview | null;
+  /** Whether the preview is loading */
+  previewLoading?: boolean;
+  /** Called when the download button is clicked */
+  onDownload?: (filePath: string) => void;
+  /** Called when the delete button is clicked */
+  onDelete?: (filePath: string) => void;
+  /** Whether a delete operation is in progress */
+  deleting?: boolean;
+  /** Image preview source — string URL or function that receives the file path */
+  imagePreviewSrc?: string | ((filePath: string) => string);
+  /** Custom file size formatter (defaults to formatFileSize) */
+  formatSize?: (bytes: number | undefined) => string;
+  /** Customizable labels */
+  labels?: Pick<FileBrowserLabels, "selectFilePrompt" | "previewNotAvailable" | "previewFailed" | "download" | "size" | "type" | "modified" | "unknown">;
+}
+/** Preview panel displaying file metadata, image/text preview, and download/delete actions */
+declare function FilePreviewPanel({
+  selectedFile,
+  preview,
+  previewLoading,
+  onDownload,
+  onDelete,
+  deleting,
+  imagePreviewSrc,
+  formatSize,
+  labels,
+  className,
+  ...props
+}: FilePreviewPanelProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+export { FilePreviewPanel, FilePreviewPanelProps };
+//# sourceMappingURL=file-preview-panel.d.ts.map

package/dist/react/file-browser/file-preview-panel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"file-preview-panel.d.ts","names":[],"sources":["../../../src/react/file-browser/file-preview-panel.tsx"],"mappings":";;;;;UAQiB,qBAAA,SACP,IAAA,CAAK,KAAA,CAAM,cAAA;;EAEnB,YAAA;EAFA;EAIA,OAAA,EAAS,WAAA;EAJI;EAMb,cAAA;EAaE;EAXF,UAAA,IAAc,QAAA;EARN;EAUR,QAAA,IAAY,QAAA;EAVA;EAYZ,QAAA;EAZa;EAcb,eAAA,cAA6B,QAAA;EAZ7B;EAcA,UAAA,IAAc,KAAA;EAZL;EAcT,MAAA,GAAS,IAAA,CACP,iBAAA;AAAA;;iBAaY,gBAAA,CAAA;EACd,YAAA;EACA,OAAA;EACA,cAAA;EACA,UAAA;EACA,QAAA;EACA,QAAA;EACA,eAAA;EACA,UAAA;EACA,MAAA;EACA,SAAA;EAAA,GACG;AAAA,GACF,qBAAA,GAAqB,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/react/file-browser/file-preview-panel.js

@@ -0,0 +1,135 @@
+import { formatFileSize } from "../lib/format.js";
+import { Button } from "../ui/button.js";
+import { Card } from "../ui/card.js";
+import { Skeleton } from "../ui/skeleton.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { AlertCircle, Download, FileIcon, Loader2, Trash2 } from "lucide-react";
+
+//#region src/react/file-browser/file-preview-panel.tsx
+/** Preview panel displaying file metadata, image/text preview, and download/delete actions */
+function FilePreviewPanel({ selectedFile, preview, previewLoading, onDownload, onDelete, deleting, imagePreviewSrc, formatSize = formatFileSize, labels, className, ...props }) {
+	const resolveImageSrc = (filePath) => {
+		if (!imagePreviewSrc) return "";
+		if (typeof imagePreviewSrc === "string") return imagePreviewSrc;
+		return imagePreviewSrc(filePath);
+	};
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "file-preview-panel",
+		className,
+		...props,
+		children: /* @__PURE__ */ jsxs(Card, {
+			className: "p-6",
+			children: [
+				!selectedFile && /* @__PURE__ */ jsxs("div", {
+					className: "text-center text-muted-foreground py-8",
+					children: [/* @__PURE__ */ jsx(FileIcon, { className: "h-10 w-10 mx-auto mb-3 opacity-40" }), /* @__PURE__ */ jsx("p", {
+						className: "text-sm",
+						children: labels?.selectFilePrompt ?? "Select a file to preview"
+					})]
+				}),
+				selectedFile && previewLoading && /* @__PURE__ */ jsxs("div", {
+					className: "space-y-3",
+					children: [
+						/* @__PURE__ */ jsx(Skeleton, { className: "h-5 w-3/4" }),
+						/* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-1/2" }),
+						/* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-2/3" }),
+						/* @__PURE__ */ jsx(Skeleton, { className: "h-32 w-full mt-4" })
+					]
+				}),
+				selectedFile && !previewLoading && preview && /* @__PURE__ */ jsxs("div", {
+					className: "space-y-4",
+					children: [
+						/* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("h3", {
+							className: "font-semibold text-foreground truncate mb-1",
+							children: selectedFile.split("/").pop()
+						}), /* @__PURE__ */ jsx("p", {
+							className: "text-xs text-muted-foreground truncate",
+							children: selectedFile
+						})] }),
+						/* @__PURE__ */ jsxs("div", {
+							className: "space-y-2 text-sm",
+							children: [
+								/* @__PURE__ */ jsxs("div", {
+									className: "flex justify-between",
+									children: [/* @__PURE__ */ jsx("span", {
+										className: "text-muted-foreground",
+										children: labels?.size ?? "Size"
+									}), /* @__PURE__ */ jsx("span", {
+										className: "text-foreground",
+										children: formatSize(preview.contentLength)
+									})]
+								}),
+								/* @__PURE__ */ jsxs("div", {
+									className: "flex justify-between",
+									children: [/* @__PURE__ */ jsx("span", {
+										className: "text-muted-foreground",
+										children: labels?.type ?? "Type"
+									}), /* @__PURE__ */ jsx("span", {
+										className: "text-foreground truncate ml-2",
+										children: preview.contentType ?? labels?.unknown ?? "Unknown"
+									})]
+								}),
+								preview.lastModified && /* @__PURE__ */ jsxs("div", {
+									className: "flex justify-between",
+									children: [/* @__PURE__ */ jsx("span", {
+										className: "text-muted-foreground",
+										children: labels?.modified ?? "Modified"
+									}), /* @__PURE__ */ jsx("span", {
+										className: "text-foreground",
+										children: preview.lastModified
+									})]
+								})
+							]
+						}),
+						/* @__PURE__ */ jsxs("div", {
+							className: "flex gap-2",
+							children: [onDownload && /* @__PURE__ */ jsxs(Button, {
+								variant: "outline",
+								size: "sm",
+								className: "flex-1",
+								onClick: () => onDownload(selectedFile),
+								children: [/* @__PURE__ */ jsx(Download, { className: "h-4 w-4 mr-2" }), labels?.download ?? "Download"]
+							}), onDelete && /* @__PURE__ */ jsx(Button, {
+								variant: "destructive",
+								size: "sm",
+								disabled: deleting,
+								onClick: () => onDelete(selectedFile),
+								children: deleting ? /* @__PURE__ */ jsx(Loader2, { className: "h-4 w-4 animate-spin" }) : /* @__PURE__ */ jsx(Trash2, { className: "h-4 w-4" })
+							})]
+						}),
+						preview.isImage && imagePreviewSrc && /* @__PURE__ */ jsx("div", {
+							className: "border rounded overflow-hidden",
+							children: /* @__PURE__ */ jsx("img", {
+								src: resolveImageSrc(selectedFile),
+								alt: selectedFile.split("/").pop() ?? "Preview",
+								className: "w-full h-auto"
+							})
+						}),
+						preview.isText && preview.textPreview !== null && /* @__PURE__ */ jsx("div", {
+							className: "border rounded",
+							children: /* @__PURE__ */ jsx("pre", {
+								className: "p-3 text-xs font-mono overflow-auto max-h-80 whitespace-pre-wrap text-foreground bg-muted/30",
+								children: preview.textPreview
+							})
+						}),
+						!preview.isText && !preview.isImage && /* @__PURE__ */ jsx("div", {
+							className: "text-center py-4 text-sm text-muted-foreground",
+							children: labels?.previewNotAvailable ?? "Preview not available for this file type."
+						})
+					]
+				}),
+				selectedFile && !previewLoading && !preview && /* @__PURE__ */ jsxs("div", {
+					className: "text-center py-8",
+					children: [/* @__PURE__ */ jsx(AlertCircle, { className: "h-8 w-8 text-destructive mx-auto mb-2" }), /* @__PURE__ */ jsx("p", {
+						className: "text-sm text-destructive",
+						children: labels?.previewFailed ?? "Failed to load preview"
+					})]
+				})
+			]
+		})
+	});
+}
+
+//#endregion
+export { FilePreviewPanel };
+//# sourceMappingURL=file-preview-panel.js.map

package/dist/react/file-browser/file-preview-panel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"file-preview-panel.js","names":[],"sources":["../../../src/react/file-browser/file-preview-panel.tsx"],"sourcesContent":["import { AlertCircle, Download, FileIcon, Loader2, Trash2 } from \"lucide-react\";\nimport { formatFileSize } from \"../lib/format\";\nimport { Button } from \"../ui/button\";\nimport { Card } from \"../ui/card\";\nimport { Skeleton } from \"../ui/skeleton\";\nimport type { FileBrowserLabels, FilePreview } from \"./types\";\n\n/** Props for the FilePreviewPanel component */\nexport interface FilePreviewPanelProps\n  extends Omit<React.ComponentProps<\"div\">, \"children\"> {\n  /** Full path of the selected file (null when nothing is selected) */\n  selectedFile: string | null;\n  /** Preview data for the selected file */\n  preview: FilePreview | null;\n  /** Whether the preview is loading */\n  previewLoading?: boolean;\n  /** Called when the download button is clicked */\n  onDownload?: (filePath: string) => void;\n  /** Called when the delete button is clicked */\n  onDelete?: (filePath: string) => void;\n  /** Whether a delete operation is in progress */\n  deleting?: boolean;\n  /** Image preview source — string URL or function that receives the file path */\n  imagePreviewSrc?: string | ((filePath: string) => string);\n  /** Custom file size formatter (defaults to formatFileSize) */\n  formatSize?: (bytes: number | undefined) => string;\n  /** Customizable labels */\n  labels?: Pick<\n    FileBrowserLabels,\n    | \"selectFilePrompt\"\n    | \"previewNotAvailable\"\n    | \"previewFailed\"\n    | \"download\"\n    | \"size\"\n    | \"type\"\n    | \"modified\"\n    | \"unknown\"\n  >;\n}\n\n/** Preview panel displaying file metadata, image/text preview, and download/delete actions */\nexport function FilePreviewPanel({\n  selectedFile,\n  preview,\n  previewLoading,\n  onDownload,\n  onDelete,\n  deleting,\n  imagePreviewSrc,\n  formatSize = formatFileSize,\n  labels,\n  className,\n  ...props\n}: FilePreviewPanelProps) {\n  const resolveImageSrc = (filePath: string) => {\n    if (!imagePreviewSrc) return \"\";\n    if (typeof imagePreviewSrc === \"string\") return imagePreviewSrc;\n    return imagePreviewSrc(filePath);\n  };\n\n  return (\n    <div data-slot=\"file-preview-panel\" className={className} {...props}>\n      <Card className=\"p-6\">\n        {/* No file selected */}\n        {!selectedFile && (\n          <div className=\"text-center text-muted-foreground py-8\">\n            <FileIcon className=\"h-10 w-10 mx-auto mb-3 opacity-40\" />\n            <p className=\"text-sm\">\n              {labels?.selectFilePrompt ?? \"Select a file to preview\"}\n            </p>\n          </div>\n        )}\n\n        {/* Loading state */}\n        {selectedFile && previewLoading && (\n          <div className=\"space-y-3\">\n            <Skeleton className=\"h-5 w-3/4\" />\n            <Skeleton className=\"h-4 w-1/2\" />\n            <Skeleton className=\"h-4 w-2/3\" />\n            <Skeleton className=\"h-32 w-full mt-4\" />\n          </div>\n        )}\n\n        {/* Preview content */}\n        {selectedFile && !previewLoading && preview && (\n          <div className=\"space-y-4\">\n            <div>\n              <h3 className=\"font-semibold text-foreground truncate mb-1\">\n                {selectedFile.split(\"/\").pop()}\n              </h3>\n              <p className=\"text-xs text-muted-foreground truncate\">\n                {selectedFile}\n              </p>\n            </div>\n\n            <div className=\"space-y-2 text-sm\">\n              <div className=\"flex justify-between\">\n                <span className=\"text-muted-foreground\">\n                  {labels?.size ?? \"Size\"}\n                </span>\n                <span className=\"text-foreground\">\n                  {formatSize(preview.contentLength)}\n                </span>\n              </div>\n              <div className=\"flex justify-between\">\n                <span className=\"text-muted-foreground\">\n                  {labels?.type ?? \"Type\"}\n                </span>\n                <span className=\"text-foreground truncate ml-2\">\n                  {preview.contentType ?? labels?.unknown ?? \"Unknown\"}\n                </span>\n              </div>\n              {preview.lastModified && (\n                <div className=\"flex justify-between\">\n                  <span className=\"text-muted-foreground\">\n                    {labels?.modified ?? \"Modified\"}\n                  </span>\n                  <span className=\"text-foreground\">\n                    {preview.lastModified}\n                  </span>\n                </div>\n              )}\n            </div>\n\n            <div className=\"flex gap-2\">\n              {onDownload && (\n                <Button\n                  variant=\"outline\"\n                  size=\"sm\"\n                  className=\"flex-1\"\n                  onClick={() => onDownload(selectedFile)}\n                >\n                  <Download className=\"h-4 w-4 mr-2\" />\n                  {labels?.download ?? \"Download\"}\n                </Button>\n              )}\n              {onDelete && (\n                <Button\n                  variant=\"destructive\"\n                  size=\"sm\"\n                  disabled={deleting}\n                  onClick={() => onDelete(selectedFile)}\n                >\n                  {deleting ? (\n                    <Loader2 className=\"h-4 w-4 animate-spin\" />\n                  ) : (\n                    <Trash2 className=\"h-4 w-4\" />\n                  )}\n                </Button>\n              )}\n            </div>\n\n            {preview.isImage && imagePreviewSrc && (\n              <div className=\"border rounded overflow-hidden\">\n                <img\n                  src={resolveImageSrc(selectedFile)}\n                  alt={selectedFile.split(\"/\").pop() ?? \"Preview\"}\n                  className=\"w-full h-auto\"\n                />\n              </div>\n            )}\n\n            {preview.isText && preview.textPreview !== null && (\n              <div className=\"border rounded\">\n                <pre className=\"p-3 text-xs font-mono overflow-auto max-h-80 whitespace-pre-wrap text-foreground bg-muted/30\">\n                  {preview.textPreview}\n                </pre>\n              </div>\n            )}\n\n            {!preview.isText && !preview.isImage && (\n              <div className=\"text-center py-4 text-sm text-muted-foreground\">\n                {labels?.previewNotAvailable ??\n                  \"Preview not available for this file type.\"}\n              </div>\n            )}\n          </div>\n        )}\n\n        {/* Preview load failed */}\n        {selectedFile && !previewLoading && !preview && (\n          <div className=\"text-center py-8\">\n            <AlertCircle className=\"h-8 w-8 text-destructive mx-auto mb-2\" />\n            <p className=\"text-sm text-destructive\">\n              {labels?.previewFailed ?? \"Failed to load preview\"}\n            </p>\n          </div>\n        )}\n      </Card>\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;AAyCA,SAAgB,iBAAiB,EAC/B,cACA,SACA,gBACA,YACA,UACA,UACA,iBACA,aAAa,gBACb,QACA,WACA,GAAG,SACqB;CACxB,MAAM,mBAAmB,aAAqB;AAC5C,MAAI,CAAC,gBAAiB,QAAO;AAC7B,MAAI,OAAO,oBAAoB,SAAU,QAAO;AAChD,SAAO,gBAAgB,SAAS;;AAGlC,QACE,oBAAC;EAAI,aAAU;EAAgC;EAAW,GAAI;YAC5D,qBAAC;GAAK,WAAU;;IAEb,CAAC,gBACA,qBAAC;KAAI,WAAU;gBACb,oBAAC,YAAS,WAAU,sCAAsC,EAC1D,oBAAC;MAAE,WAAU;gBACV,QAAQ,oBAAoB;OAC3B;MACA;IAIP,gBAAgB,kBACf,qBAAC;KAAI,WAAU;;MACb,oBAAC,YAAS,WAAU,cAAc;MAClC,oBAAC,YAAS,WAAU,cAAc;MAClC,oBAAC,YAAS,WAAU,cAAc;MAClC,oBAAC,YAAS,WAAU,qBAAqB;;MACrC;IAIP,gBAAgB,CAAC,kBAAkB,WAClC,qBAAC;KAAI,WAAU;;MACb,qBAAC,oBACC,oBAAC;OAAG,WAAU;iBACX,aAAa,MAAM,IAAI,CAAC,KAAK;QAC3B,EACL,oBAAC;OAAE,WAAU;iBACV;QACC,IACA;MAEN,qBAAC;OAAI,WAAU;;QACb,qBAAC;SAAI,WAAU;oBACb,oBAAC;UAAK,WAAU;oBACb,QAAQ,QAAQ;WACZ,EACP,oBAAC;UAAK,WAAU;oBACb,WAAW,QAAQ,cAAc;WAC7B;UACH;QACN,qBAAC;SAAI,WAAU;oBACb,oBAAC;UAAK,WAAU;oBACb,QAAQ,QAAQ;WACZ,EACP,oBAAC;UAAK,WAAU;oBACb,QAAQ,eAAe,QAAQ,WAAW;WACtC;UACH;QACL,QAAQ,gBACP,qBAAC;SAAI,WAAU;oBACb,oBAAC;UAAK,WAAU;oBACb,QAAQ,YAAY;WAChB,EACP,oBAAC;UAAK,WAAU;oBACb,QAAQ;WACJ;UACH;;QAEJ;MAEN,qBAAC;OAAI,WAAU;kBACZ,cACC,qBAAC;QACC,SAAQ;QACR,MAAK;QACL,WAAU;QACV,eAAe,WAAW,aAAa;mBAEvC,oBAAC,YAAS,WAAU,iBAAiB,EACpC,QAAQ,YAAY;SACd,EAEV,YACC,oBAAC;QACC,SAAQ;QACR,MAAK;QACL,UAAU;QACV,eAAe,SAAS,aAAa;kBAEpC,WACC,oBAAC,WAAQ,WAAU,yBAAyB,GAE5C,oBAAC,UAAO,WAAU,YAAY;SAEzB;QAEP;MAEL,QAAQ,WAAW,mBAClB,oBAAC;OAAI,WAAU;iBACb,oBAAC;QACC,KAAK,gBAAgB,aAAa;QAClC,KAAK,aAAa,MAAM,IAAI,CAAC,KAAK,IAAI;QACtC,WAAU;SACV;QACE;MAGP,QAAQ,UAAU,QAAQ,gBAAgB,QACzC,oBAAC;OAAI,WAAU;iBACb,oBAAC;QAAI,WAAU;kBACZ,QAAQ;SACL;QACF;MAGP,CAAC,QAAQ,UAAU,CAAC,QAAQ,WAC3B,oBAAC;OAAI,WAAU;iBACZ,QAAQ,uBACP;QACE;;MAEJ;IAIP,gBAAgB,CAAC,kBAAkB,CAAC,WACnC,qBAAC;KAAI,WAAU;gBACb,oBAAC,eAAY,WAAU,0CAA0C,EACjE,oBAAC;MAAE,WAAU;gBACV,QAAQ,iBAAiB;OACxB;MACA;;IAEH;GACH"}

package/dist/react/file-browser/index.d.ts

@@ -0,0 +1,7 @@
+import { formatFileSize } from "../lib/format.js";
+import { DirectoryEntry, FileBrowserLabels, FilePreview } from "./types.js";
+import { DirectoryList, DirectoryListProps } from "./directory-list.js";
+import { FileBreadcrumb, FileBreadcrumbProps } from "./file-breadcrumb.js";
+import { FileEntry, FileEntryProps } from "./file-entry.js";
+import { FilePreviewPanel, FilePreviewPanelProps } from "./file-preview-panel.js";
+import { NewFolderInput, NewFolderInputProps } from "./new-folder-input.js";

package/dist/react/file-browser/index.js

@@ -0,0 +1,6 @@
+import { formatFileSize } from "../lib/format.js";
+import { FileEntry } from "./file-entry.js";
+import { DirectoryList } from "./directory-list.js";
+import { FileBreadcrumb } from "./file-breadcrumb.js";
+import { FilePreviewPanel } from "./file-preview-panel.js";
+import { NewFolderInput } from "./new-folder-input.js";

package/dist/react/file-browser/new-folder-input.d.ts

@@ -0,0 +1,36 @@
+import { FileBrowserLabels } from "./types.js";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/react/file-browser/new-folder-input.d.ts
+/** Props for the NewFolderInput component */
+interface NewFolderInputProps extends Omit<React.ComponentProps<"div">, "children" | "onChange"> {
+  /** Current folder name value */
+  value: string;
+  /** Called when folder name changes */
+  onChange: (value: string) => void;
+  /** Called when the user confirms creation */
+  onCreate: () => void;
+  /** Called when the user cancels */
+  onCancel: () => void;
+  /** Whether folder creation is in progress */
+  creating?: boolean;
+  /** Auto-focus the input on mount */
+  autoFocus?: boolean;
+  /** Customizable labels */
+  labels?: Pick<FileBrowserLabels, "create" | "folderNamePlaceholder">;
+}
+/** Inline folder-name input with create/cancel actions */
+declare function NewFolderInput({
+  value,
+  onChange,
+  onCreate,
+  onCancel,
+  creating,
+  autoFocus,
+  labels,
+  className,
+  ...props
+}: NewFolderInputProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+export { NewFolderInput, NewFolderInputProps };
+//# sourceMappingURL=new-folder-input.d.ts.map

package/dist/react/file-browser/new-folder-input.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"new-folder-input.d.ts","names":[],"sources":["../../../src/react/file-browser/new-folder-input.tsx"],"mappings":";;;;;UAOiB,mBAAA,SACP,IAAA,CAAK,KAAA,CAAM,cAAA;;EAEnB,KAAA;EAFA;EAIA,QAAA,GAAW,KAAA;EAJE;EAMb,QAAA;EAQS;EANT,QAAA;EARY;EAUZ,QAAA;EAVQ;EAYR,SAAA;EAZmB;EAcnB,MAAA,GAAS,IAAA,CAAK,iBAAA;AAAA;;iBAIA,cAAA,CAAA;EACd,KAAA;EACA,QAAA;EACA,QAAA;EACA,QAAA;EACA,QAAA;EACA,SAAA;EACA,MAAA;EACA,SAAA;EAAA,GACG;AAAA,GACF,mBAAA,GAAmB,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/react/file-browser/new-folder-input.js

@@ -0,0 +1,52 @@
+import { cn } from "../lib/utils.js";
+import { Button } from "../ui/button.js";
+import { useEffect, useRef } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { FolderPlus, Loader2, X } from "lucide-react";
+
+//#region src/react/file-browser/new-folder-input.tsx
+/** Inline folder-name input with create/cancel actions */
+function NewFolderInput({ value, onChange, onCreate, onCancel, creating, autoFocus = true, labels, className, ...props }) {
+	const inputRef = useRef(null);
+	useEffect(() => {
+		if (autoFocus) inputRef.current?.focus();
+	}, [autoFocus]);
+	return /* @__PURE__ */ jsxs("div", {
+		"data-slot": "new-folder-input",
+		className: cn("flex items-center gap-2 px-4 py-3 border-b bg-muted/30", className),
+		...props,
+		children: [
+			/* @__PURE__ */ jsx(FolderPlus, { className: "h-5 w-5 text-blue-500 shrink-0" }),
+			/* @__PURE__ */ jsx("input", {
+				ref: inputRef,
+				type: "text",
+				value,
+				onChange: (e) => onChange(e.target.value),
+				onKeyDown: (e) => {
+					if (e.key === "Enter") onCreate();
+					if (e.key === "Escape") onCancel();
+				},
+				placeholder: labels?.folderNamePlaceholder ?? "Folder name",
+				className: "flex-1 text-sm bg-background border rounded px-2 py-1 outline-none focus:ring-1 focus:ring-ring",
+				disabled: creating
+			}),
+			/* @__PURE__ */ jsx(Button, {
+				variant: "ghost",
+				size: "sm",
+				disabled: creating || !value.trim(),
+				onClick: onCreate,
+				children: creating ? /* @__PURE__ */ jsx(Loader2, { className: "h-4 w-4 animate-spin" }) : labels?.create ?? "Create"
+			}),
+			/* @__PURE__ */ jsx("button", {
+				type: "button",
+				onClick: onCancel,
+				className: "text-muted-foreground hover:text-foreground",
+				children: /* @__PURE__ */ jsx(X, { className: "h-4 w-4" })
+			})
+		]
+	});
+}
+
+//#endregion
+export { NewFolderInput };
+//# sourceMappingURL=new-folder-input.js.map

package/dist/react/file-browser/new-folder-input.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"new-folder-input.js","names":[],"sources":["../../../src/react/file-browser/new-folder-input.tsx"],"sourcesContent":["import { FolderPlus, Loader2, X } from \"lucide-react\";\nimport { useEffect, useRef } from \"react\";\nimport { cn } from \"../lib/utils\";\nimport { Button } from \"../ui/button\";\nimport type { FileBrowserLabels } from \"./types\";\n\n/** Props for the NewFolderInput component */\nexport interface NewFolderInputProps\n  extends Omit<React.ComponentProps<\"div\">, \"children\" | \"onChange\"> {\n  /** Current folder name value */\n  value: string;\n  /** Called when folder name changes */\n  onChange: (value: string) => void;\n  /** Called when the user confirms creation */\n  onCreate: () => void;\n  /** Called when the user cancels */\n  onCancel: () => void;\n  /** Whether folder creation is in progress */\n  creating?: boolean;\n  /** Auto-focus the input on mount */\n  autoFocus?: boolean;\n  /** Customizable labels */\n  labels?: Pick<FileBrowserLabels, \"create\" | \"folderNamePlaceholder\">;\n}\n\n/** Inline folder-name input with create/cancel actions */\nexport function NewFolderInput({\n  value,\n  onChange,\n  onCreate,\n  onCancel,\n  creating,\n  autoFocus = true,\n  labels,\n  className,\n  ...props\n}: NewFolderInputProps) {\n  const inputRef = useRef<HTMLInputElement>(null);\n\n  useEffect(() => {\n    if (autoFocus) {\n      inputRef.current?.focus();\n    }\n  }, [autoFocus]);\n\n  return (\n    <div\n      data-slot=\"new-folder-input\"\n      className={cn(\n        \"flex items-center gap-2 px-4 py-3 border-b bg-muted/30\",\n        className,\n      )}\n      {...props}\n    >\n      <FolderPlus className=\"h-5 w-5 text-blue-500 shrink-0\" />\n      <input\n        ref={inputRef}\n        type=\"text\"\n        value={value}\n        onChange={(e) => onChange(e.target.value)}\n        onKeyDown={(e) => {\n          if (e.key === \"Enter\") onCreate();\n          if (e.key === \"Escape\") onCancel();\n        }}\n        placeholder={labels?.folderNamePlaceholder ?? \"Folder name\"}\n        className=\"flex-1 text-sm bg-background border rounded px-2 py-1 outline-none focus:ring-1 focus:ring-ring\"\n        disabled={creating}\n      />\n      <Button\n        variant=\"ghost\"\n        size=\"sm\"\n        disabled={creating || !value.trim()}\n        onClick={onCreate}\n      >\n        {creating ? (\n          <Loader2 className=\"h-4 w-4 animate-spin\" />\n        ) : (\n          (labels?.create ?? \"Create\")\n        )}\n      </Button>\n      <button\n        type=\"button\"\n        onClick={onCancel}\n        className=\"text-muted-foreground hover:text-foreground\"\n      >\n        <X className=\"h-4 w-4\" />\n      </button>\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;AA0BA,SAAgB,eAAe,EAC7B,OACA,UACA,UACA,UACA,UACA,YAAY,MACZ,QACA,WACA,GAAG,SACmB;CACtB,MAAM,WAAW,OAAyB,KAAK;AAE/C,iBAAgB;AACd,MAAI,UACF,UAAS,SAAS,OAAO;IAE1B,CAAC,UAAU,CAAC;AAEf,QACE,qBAAC;EACC,aAAU;EACV,WAAW,GACT,0DACA,UACD;EACD,GAAI;;GAEJ,oBAAC,cAAW,WAAU,mCAAmC;GACzD,oBAAC;IACC,KAAK;IACL,MAAK;IACE;IACP,WAAW,MAAM,SAAS,EAAE,OAAO,MAAM;IACzC,YAAY,MAAM;AAChB,SAAI,EAAE,QAAQ,QAAS,WAAU;AACjC,SAAI,EAAE,QAAQ,SAAU,WAAU;;IAEpC,aAAa,QAAQ,yBAAyB;IAC9C,WAAU;IACV,UAAU;KACV;GACF,oBAAC;IACC,SAAQ;IACR,MAAK;IACL,UAAU,YAAY,CAAC,MAAM,MAAM;IACnC,SAAS;cAER,WACC,oBAAC,WAAQ,WAAU,yBAAyB,GAE3C,QAAQ,UAAU;KAEd;GACT,oBAAC;IACC,MAAK;IACL,SAAS;IACT,WAAU;cAEV,oBAAC,KAAE,WAAU,YAAY;KAClB;;GACL"}

package/dist/react/file-browser/types.d.ts

@@ -0,0 +1,52 @@
+//#region src/react/file-browser/types.d.ts
+/** A single entry (file or directory) in a directory listing */
+interface DirectoryEntry {
+  name?: string;
+  path?: string;
+  is_directory?: boolean;
+  file_size?: number;
+  last_modified?: string;
+}
+/** Metadata and content preview for a selected file */
+interface FilePreview {
+  contentLength: number | undefined;
+  contentType: string | undefined;
+  lastModified: string | undefined;
+  textPreview: string | null;
+  isText: boolean;
+  isImage: boolean;
+}
+/** Customizable labels for file browser components (i18n-ready) */
+interface FileBrowserLabels {
+  /** Back button text (default: "Back to parent") */
+  backToParent?: string;
+  /** Empty directory message (default: "This directory is empty.") */
+  emptyDirectory?: string;
+  /** No volume configured message */
+  noVolumeConfigured?: string;
+  /** Retry button text (default: "Retry") */
+  retry?: string;
+  /** Select file prompt (default: "Select a file to preview") */
+  selectFilePrompt?: string;
+  /** Preview not available message */
+  previewNotAvailable?: string;
+  /** Failed to load preview message */
+  previewFailed?: string;
+  /** Download button text (default: "Download") */
+  download?: string;
+  /** Create button text (default: "Create") */
+  create?: string;
+  /** Folder name placeholder (default: "Folder name") */
+  folderNamePlaceholder?: string;
+  /** Size label (default: "Size") */
+  size?: string;
+  /** Type label (default: "Type") */
+  type?: string;
+  /** Modified label (default: "Modified") */
+  modified?: string;
+  /** Unknown value fallback (default: "Unknown") */
+  unknown?: string;
+}
+//#endregion
+export { DirectoryEntry, FileBrowserLabels, FilePreview };
+//# sourceMappingURL=types.d.ts.map

package/dist/react/file-browser/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","names":[],"sources":["../../../src/react/file-browser/types.ts"],"mappings":";;UACiB,cAAA;EACf,IAAA;EACA,IAAA;EACA,YAAA;EACA,SAAA;EACA,aAAA;AAAA;;UAIe,WAAA;EACf,aAAA;EACA,WAAA;EACA,YAAA;EACA,WAAA;EACA,MAAA;EACA,OAAA;AAAA;;UAIe,iBAAA;EANf;EAQA,YAAA;EANA;EAQA,cAAA;EARO;EAUP,kBAAA;EANgC;EAQhC,KAAA;EARgC;EAUhC,gBAAA;EANA;EAQA,mBAAA;EAJA;EAMA,aAAA;EAFA;EAIA,QAAA;EAAA;EAEA,MAAA;EAEA;EAAA,qBAAA;EAIA;EAFA,IAAA;EAMA;EAJA,IAAA;EAIO;EAFP,QAAA;;EAEA,OAAA;AAAA"}

package/dist/react/genie/genie-chart-inference.d.ts

@@ -0,0 +1,17 @@
+import { ChartType } from "../charts/types.js";
+import { GenieColumnMeta } from "./genie-query-transform.js";
+
+//#region src/react/genie/genie-chart-inference.d.ts
+interface ChartInference {
+  chartType: ChartType;
+  xKey: string;
+  yKey: string | string[];
+}
+/**
+ * Infer the best chart type for the given Genie query result.
+ * Returns `null` when the data is not suitable for charting.
+ */
+declare function inferChartType(rows: Record<string, unknown>[], columns: GenieColumnMeta[]): ChartInference | null;
+//#endregion
+export { ChartInference, inferChartType };
+//# sourceMappingURL=genie-chart-inference.d.ts.map

package/dist/react/genie/genie-chart-inference.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"genie-chart-inference.d.ts","names":[],"sources":["../../../src/react/genie/genie-chart-inference.ts"],"mappings":";;;;UAqDiB,cAAA;EACf,SAAA,EAAW,SAAA;EACX,IAAA;EACA,IAAA;AAAA;;;;;iBA6Bc,cAAA,CACd,IAAA,EAAM,MAAA,qBACN,OAAA,EAAS,eAAA,KACR,cAAA"}