@powerhousedao/powerhouse-vetra-packages 6.2.0-dev.20 → 6.2.0-dev.22

package/dist/browser/{connect-BPAGykLm.js → connect-CahHnhpc.js}

@@ -2,7 +2,7 @@ import { E as __commonJSMin } from "./dist-CXoKspdx.js";
 import { A as redo, K as undo } from "./document-drive-sTKoi6L4.js";
 import { a as __spreadArray, i as __rest, r as __assign } from "./dist-DXM8ccKa.js";
 import { C as twMerge, S as twJoin, _ as useLayoutEffect2, a as Item, b as useComposedRefs, c as Presence, d as useDirection, f as createCollection, g as useControllableState, h as createSlot, l as useId$1, m as dispatchDiscreteCustomEvent, o as Root$1, p as Primitive, s as createRovingFocusGroupScope, u as useCallbackRef$1, v as createContextScope, x as composeEventHandlers, y as composeRefs } from "./dist-D8H48e8N.js";
-import { A as e$5, C as useSelectedDriveSafe, M as t$9, N as useDocumentById, O as useUserPermissions, S as useSelectedDriveId, _ as useNodeParentFolderById, a as setSelectedDrive, c as showDeleteNodeModal, d as useDownloadDocument, f as useDragNode, g as useNodeById, h as useNodeActions, j as t$10, k as e$4, l as showRevisionHistory, m as useGetSwitchboardLink, n as getSyncStatusSync, o as setSelectedNode, p as useDropNode, t as addFolder, w as useSelectedNodePath, x as useSelectedDocumentSafe } from "./dist-vCEZRfyv.js";
+import { A as e$5, C as useSelectedDriveSafe, M as t$9, N as useDocumentById, O as useUserPermissions, S as useSelectedDriveId, _ as useNodeParentFolderById, a as setSelectedDrive, c as showDeleteNodeModal, d as useDownloadDocument, f as useDragNode, g as useNodeById, h as useNodeActions, j as t$10, k as e$4, l as showRevisionHistory, m as useGetSwitchboardLink, n as getSyncStatusSync, o as setSelectedNode, p as useDropNode, t as addFolder, w as useSelectedNodePath, x as useSelectedDocumentSafe } from "./dist-HgA907mh.js";
 import * as React$1 from "react";
 import React, { Fragment, Suspense, createContext, createElement, forwardRef, useContext, useEffect, useLayoutEffect, useMemo, useReducer, useRef, useState } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
@@ -7607,15 +7607,15 @@ var Portal2 = DropdownMenuPortal;
 var Content2 = DropdownMenuContent$1;
 var Item2 = DropdownMenuItem$1;
 //#endregion
-//#region ../design-system/dist/src-BrrPQVce.js
+//#region ../design-system/dist/src-CfIIbIOi.js
 const PowerhouseButton = /* @__PURE__ */ forwardRef(function PowerhouseButton(props, ref) {
 	const { color = "dark", size = "medium", className = "", children, icon, iconPosition = "left", ...delegatedProps } = props;
 	return /* @__PURE__ */ jsxs("button", {
-		className: twMerge("flex items-center justify-center gap-2 border border-none transition outline-none disabled:cursor-not-allowed", twJoin({
-			light: "bg-gray-200 text-gray-700 hover:text-gray-800 hover:border-gray-300 active:border-gray-100 active:text-gray-700 disabled:text-gray-400 dark:bg-slate-600 dark:hover:border-slate-500 dark:active:border-slate-500 dark:disabled:text-slate-500 dark:hover:bg-slate-600 dark:active:bg-slate-600 dark:text-slate-100 dark:hover:text-slate-100 dark:active:text-slate-100",
-			dark: "bg-gray-800 text-gray-50 hover:bg-gray-800 active:border-gray-700 disabled:bg-gray-300 disabled:text-gray-100 dark:bg-slate-100 dark:text-slate-900 dark:hover:bg-slate-100 dark:active:border-slate-200 dark:disabled:bg-slate-600 dark:disabled:text-slate-100",
-			red: "bg-red-900 text-gray-50 hover:opacity-80 active:border-red-800 disabled:text-red-400 disabled:opacity-100 dark:bg-red-50 dark:text-slate-900 dark:active:border-red-100 dark:disabled:text-red-100",
-			blue: "bg-blue-900 text-gray-50 hover:opacity-80 active:border-blue-800 disabled:text-blue-400 disabled:opacity-100 dark:bg-blue-50 dark:text-slate-900 dark:active:border-blue-100 dark:disabled:text-blue-100"
+		className: twMerge("flex items-center justify-center gap-2 border border-none transition outline-none disabled:disabled-effect", twJoin({
+			light: "bg-secondary text-foreground hover:hover-effect active:active-effect disabled:disabled-effect",
+			dark: "bg-primary text-primary-foreground hover:hover-effect active:active-effect disabled:disabled-effect",
+			red: "bg-destructive text-destructive-foreground hover:hover-effect active:active-effect disabled:disabled-effect disabled:opacity-100",
+			blue: "bg-info text-info-foreground hover:hover-effect active:active-effect disabled:disabled-effect disabled:opacity-100"
 		}[color], {
 			small: "px-2 py-1.5 text-xs rounded-md font-medium",
 			medium: "px-6 py-3 text-base rounded-xl font-semibold tracking-wide"
@@ -12559,14 +12559,14 @@ function Breadcrumbs() {
 	const hasSelectedDrive = !!selectedDrive;
 	const hasNodePath = !!selectedNodePath.length;
 	return /* @__PURE__ */ jsxs("div", {
-		className: "flex h-9 flex-row items-center gap-2 p-6 text-gray-500 dark:text-slate-400",
+		className: "flex h-9 flex-row items-center gap-2 p-6 text-muted-foreground",
 		children: [
 			hasSelectedDrive && /* @__PURE__ */ jsxs(Fragment$1, { children: [
 				/* @__PURE__ */ jsx("button", {
 					type: "button",
 					"aria-label": "Back to home",
 					title: "Back to home",
-					className: "flex items-center justify-center rounded-md p-1 text-gray-700 transition-colors hover:bg-gray-100 hover:text-gray-800 dark:text-slate-200 dark:hover:bg-slate-700 dark:hover:text-slate-100",
+					className: "flex items-center justify-center rounded-md p-1 text-foreground transition-colors hover:hover-effect",
 					onClick: () => setSelectedDrive(void 0),
 					children: /* @__PURE__ */ jsx(Icon, {
 						name: "ArrowLeft",
@@ -12588,14 +12588,14 @@ function Breadcrumbs() {
 				onClick: () => setSelectedNode(node)
 			}), /* @__PURE__ */ jsx("span", { children: "/" })] }, node.id)),
 			isAllowedToCreateDocuments && (isCreating ? /* @__PURE__ */ jsx(NodeInput, {
-				className: "text-gray-900 dark:text-slate-100",
+				className: "text-foreground",
 				defaultValue: "New Folder",
 				onCancel,
 				onSubmit,
 				placeholder: "New Folder"
 			}) : /* @__PURE__ */ jsxs("button", {
 				type: "button",
-				className: "ml-1 flex items-center justify-center gap-2 rounded-md bg-gray-50 px-2 py-1.5 text-gray-700 transition-colors hover:bg-gray-200 hover:text-gray-800 dark:bg-slate-800 dark:text-slate-200 dark:hover:bg-slate-600 dark:hover:text-slate-100",
+				className: "ml-1 flex items-center justify-center gap-2 rounded-md bg-background px-2 py-1.5 text-foreground transition-colors hover:hover-effect",
 				onClick: onAddNew,
 				children: [/* @__PURE__ */ jsx(Icon, {
 					name: "Plus",
@@ -12612,7 +12612,7 @@ function Breadcrumb(props) {
 		parentId: parentId ?? void 0
 	});
 	const { isDropTarget, ...dropProps } = useDropNode(id);
-	const containerStyles = twMerge("cursor-pointer transition-colors last-of-type:text-gray-800 hover:text-gray-800 dark:text-slate-200 last-of-type:dark:text-slate-100 dark:hover:text-slate-100", isDragging ? "opacity-60" : isDropTarget ? "bg-blue-100 dark:bg-blue-800" : "");
+	const containerStyles = twMerge("cursor-pointer transition-colors last-of-type:text-foreground hover:hover-effect", isDragging ? "opacity-60" : isDropTarget ? "bg-info/10" : "");
 	return /* @__PURE__ */ jsx("div", {
 		...dragProps,
 		...dropProps,
@@ -12637,7 +12637,7 @@ function ToolbarContainer(props) {
 	const { children, className, ...rest } = props;
 	return /* @__PURE__ */ jsx("div", {
 		...rest,
-		className: twMerge("flex h-12 w-full items-center justify-between rounded-xl border border-gray-200 bg-gray-50 px-4 dark:border-slate-500 dark:bg-slate-600 dark:text-slate-100", className),
+		className: twMerge("flex h-12 w-full items-center justify-between rounded-xl border border-border bg-background px-4", className),
 		children
 	});
 }
@@ -12703,7 +12703,7 @@ function ToolbarButton(props) {
 	return /* @__PURE__ */ jsx("button", {
 		...rest,
 		disabled,
-		className: twMerge("grid size-fit place-items-center rounded-lg border border-gray-200 bg-gray-50 p-1 text-gray-900 dark:border-slate-500 dark:bg-slate-600 dark:text-slate-100", disabled ? "cursor-not-allowed text-gray-500 dark:text-slate-400" : "cursor-pointer active:opacity-70", className),
+		className: twMerge("grid size-fit place-items-center rounded-lg border border-border bg-background p-1 text-foreground hover:hover-effect active:active-effect disabled:disabled-effect", className),
 		children
 	});
 }
@@ -12861,7 +12861,7 @@ function ToolbarInput(props) {
 	const { defaultValue, className, onSubmit, onCancel, "aria-label": ariaLabel } = props;
 	return /* @__PURE__ */ jsx(NodeInput, {
 		defaultValue,
-		className: twMerge("text-center text-sm font-medium text-gray-500 dark:text-slate-400", className),
+		className: twMerge("text-center text-sm font-medium text-muted-foreground", className),
 		"aria-label": ariaLabel,
 		onCancel,
 		onSubmit
@@ -12897,7 +12897,7 @@ function ToolbarName(props) {
 		"aria-label": "Document name"
 	});
 	return /* @__PURE__ */ jsx("h1", {
-		className: twMerge("cursor-pointer text-sm font-medium text-gray-500 hover:text-gray-700 dark:text-slate-400 dark:hover:text-slate-200", titleClassName),
+		className: twMerge("cursor-pointer text-sm font-medium text-muted-foreground hover:hover-effect", titleClassName),
 		onClick: activateEditing,
 		title: "Click to edit",
 		children: documentName
@@ -13092,9 +13092,9 @@ function ConnectDropdownMenu(props) {
 			className: "outline-none",
 			children
 		}), /* @__PURE__ */ jsx(DropdownMenuContent, {
-			className: twMerge("cursor-pointer rounded-2xl border border-gray-200 bg-gray-50 text-sm font-medium text-gray-500 shadow-lg dark:border-slate-500 dark:bg-slate-600 dark:text-slate-100", menuClassName),
+			className: twMerge("cursor-pointer rounded-2xl border border-border bg-popover text-sm font-medium text-muted-foreground shadow-lg", menuClassName),
 			children: items.map(({ id, label, icon, className }) => /* @__PURE__ */ jsxs(DropdownMenuItem, {
-				className: twMerge("flex items-center px-5 py-2 outline-none first-of-type:rounded-t-2xl first-of-type:pt-3 last-of-type:rounded-b-2xl last-of-type:pb-3 hover:bg-gray-50 dark:hover:bg-slate-800", className),
+				className: twMerge("flex items-center px-5 py-2 outline-none first-of-type:rounded-t-2xl first-of-type:pt-3 last-of-type:rounded-b-2xl last-of-type:pb-3 hover:hover-effect", className),
 				onClick: (e) => e.stopPropagation(),
 				onSelect: () => onItemClick(id),
 				children: [icon ? /* @__PURE__ */ jsx("span", {
@@ -13138,7 +13138,7 @@ const folderNodeDropdownOptions = {
 			name: "Trash",
 			size: 16
 		}),
-		className: "text-red-900 dark:text-red-400"
+		className: "text-destructive"
 	}
 };
 const fileNodeDropdownOptions = {
@@ -13175,37 +13175,37 @@ function SyncStatusIcon(props) {
 		[INITIAL_SYNC]: /* @__PURE__ */ jsx(Icon, {
 			size: 16,
 			...iconProps,
-			className: twMerge("text-blue-900 dark:text-blue-100", className),
+			className: twMerge("text-info", className),
 			name: icons[INITIAL_SYNC]
 		}),
 		[SYNCING]: /* @__PURE__ */ jsx(Icon, {
 			size: 16,
 			...iconProps,
-			className: twMerge("text-blue-900 dark:text-blue-100", className),
+			className: twMerge("text-info", className),
 			name: icons[SYNCING]
 		}),
 		[SUCCESS]: /* @__PURE__ */ jsx(Icon, {
 			size: 16,
 			...iconProps,
-			className: twMerge("text-green-900 dark:text-green-100", className),
+			className: twMerge("text-success", className),
 			name: icons[SUCCESS]
 		}),
 		[CONFLICT]: /* @__PURE__ */ jsx(Icon, {
 			size: 16,
 			...iconProps,
-			className: twMerge("text-orange-900 dark:text-orange-100", className),
+			className: twMerge("text-warning", className),
 			name: icons[CONFLICT]
 		}),
 		[MISSING]: /* @__PURE__ */ jsx(Icon, {
 			size: 16,
 			...iconProps,
-			className: twMerge("text-red-900 dark:text-red-400", className),
+			className: twMerge("text-destructive", className),
 			name: icons[MISSING]
 		}),
 		[ERROR]: /* @__PURE__ */ jsx(Icon, {
 			size: 16,
 			...iconProps,
-			className: twMerge("text-red-900 dark:text-red-400", className),
+			className: twMerge("text-destructive", className),
 			name: icons[ERROR]
 		})
 	}[syncStatus];
@@ -13271,7 +13271,7 @@ function FileItem(props) {
 			width: 32,
 			draggable: false
 		}) : /* @__PURE__ */ jsx(DefaultFileIcon, {}), isReadMode && syncStatus && /* @__PURE__ */ jsx("div", {
-			className: "absolute right-0 bottom-[-2px] size-3 rounded-full bg-gray-50 dark:bg-slate-800",
+			className: "absolute right-0 bottom-[-2px] size-3 rounded-full bg-background",
 			children: /* @__PURE__ */ jsx("div", {
 				className: "absolute top-[-2px] left-[-2px]",
 				children: /* @__PURE__ */ jsx(SyncStatusIcon, {
@@ -13281,16 +13281,16 @@ function FileItem(props) {
 			})
 		})]
 	});
-	const containerStyles = twMerge("group flex h-12 cursor-pointer items-center rounded-lg bg-gray-200 px-2 text-gray-700 select-none hover:text-gray-800 dark:bg-slate-600 dark:text-slate-100 dark:hover:text-slate-100", isDragging ? "opacity-60" : "", className);
+	const containerStyles = twMerge("group flex h-12 cursor-pointer items-center rounded-lg bg-muted px-2 text-foreground select-none hover:hover-effect", isDragging ? "opacity-60" : "", className);
 	const content = isReadMode ? /* @__PURE__ */ jsxs("div", {
 		className: "flex w-52 items-center justify-between",
 		children: [/* @__PURE__ */ jsxs("div", {
 			className: "mr-2 truncate group-hover:mr-0",
 			children: [/* @__PURE__ */ jsx("div", {
-				className: "max-h-6 truncate text-sm font-medium text-gray-700 group-hover:text-gray-800 dark:text-slate-200 dark:group-hover:text-slate-100",
+				className: "max-h-6 truncate text-sm font-medium text-foreground group-hover:hover-effect",
 				children: fileNode.name
 			}), /* @__PURE__ */ jsx("div", {
-				className: "max-h-6 truncate text-xs font-medium text-gray-700 group-hover:text-gray-800 dark:text-slate-200 dark:group-hover:text-slate-100",
+				className: "max-h-6 truncate text-xs font-medium text-muted-foreground group-hover:hover-effect",
 				children: fileNode.documentType
 			})]
 		}), isAllowedToCreateDocuments ? /* @__PURE__ */ jsx(ConnectDropdownMenu, {
@@ -13305,7 +13305,7 @@ function FileItem(props) {
 					setIsDropdownMenuOpen(true);
 				},
 				children: /* @__PURE__ */ jsx(Icon, {
-					className: "text-gray-700 dark:text-slate-200",
+					className: "text-foreground",
 					name: "VerticalDots"
 				})
 			})
@@ -13334,7 +13334,7 @@ function FileItem(props) {
 }
 function DefaultFileIcon() {
 	return /* @__PURE__ */ jsx("div", {
-		className: "text-white dark:text-slate-800",
+		className: "text-primary-foreground",
 		children: /* @__PURE__ */ jsxs("svg", {
 			width: "32",
 			height: "40",
@@ -13478,7 +13478,7 @@ function FolderItem(props) {
 		setIsDropdownMenuOpen(false);
 	}
 	const content = isReadMode || !isAllowedToCreateDocuments ? /* @__PURE__ */ jsx("div", {
-		className: "ml-3 max-h-6 truncate font-medium text-gray-700 group-hover:text-gray-800 dark:text-slate-200 dark:group-hover:text-slate-100",
+		className: "ml-3 max-h-6 truncate font-medium text-foreground group-hover:hover-effect",
 		children: folderNode.name
 	}) : /* @__PURE__ */ jsx(NodeInput, {
 		className: "ml-3 font-medium",
@@ -13486,9 +13486,9 @@ function FolderItem(props) {
 		onCancel,
 		onSubmit
 	});
-	const containerStyles = twMerge("group flex h-12 cursor-pointer items-center rounded-lg bg-gray-200 px-2 select-none dark:bg-slate-600 dark:text-slate-100", isDragging ? "opacity-60" : isDropTarget ? "bg-blue-100 dark:bg-blue-800" : "", className);
+	const containerStyles = twMerge("group flex h-12 cursor-pointer items-center rounded-lg bg-muted px-2 select-none", isDragging ? "opacity-60" : isDropTarget ? "bg-info/10" : "", className);
 	return /* @__PURE__ */ jsx("div", {
-		className: "relative w-64",
+		className: "relative w-64 hover:hover-effect",
 		onClick: isReadMode ? () => setSelectedNode(folderNode) : void 0,
 		children: /* @__PURE__ */ jsxs("div", {
 			...dragProps,
@@ -13499,7 +13499,7 @@ function FolderItem(props) {
 				children: [/* @__PURE__ */ jsx("div", {
 					className: "p-1",
 					children: /* @__PURE__ */ jsx("div", {
-						className: "relative text-gray-700 dark:text-slate-200",
+						className: "relative text-foreground",
 						children: /* @__PURE__ */ jsx(Icon, {
 							name: "FolderClose",
 							size: 24
@@ -13518,7 +13518,7 @@ function FolderItem(props) {
 						setIsDropdownMenuOpen(true);
 					},
 					children: /* @__PURE__ */ jsx(Icon, {
-						className: "text-gray-700 dark:text-slate-200",
+						className: "text-foreground",
 						name: "VerticalDots"
 					})
 				})
@@ -13532,7 +13532,7 @@ const FilterItem = (props) => {
 		className: twMerge("flex h-full flex-row items-center justify-between gap-x-4 px-2", typeof className === "string" && className),
 		...containerProps,
 		children: [item.icon, /* @__PURE__ */ jsx("div", {
-			className: "text-sm font-semibold text-gray-200 dark:text-slate-700",
+			className: "text-sm font-semibold text-foreground",
 			children: item.label
 		})]
 	});
@@ -13548,7 +13548,7 @@ const ConnectSearchBar = (props) => {
 		className: "gap-x-1",
 		item: selectedItemFilter
 	}) : filterLabel && /* @__PURE__ */ jsx("div", {
-		className: "mr-2 text-sm font-semibold text-gray-200 dark:text-slate-700",
+		className: "mr-2 text-sm font-semibold text-foreground",
 		children: filterLabel
 	});
 	function handleChange(event) {
@@ -13558,11 +13558,11 @@ const ConnectSearchBar = (props) => {
 		className: twMerge("flex items-center", className),
 		children: [
 			/* @__PURE__ */ jsx(Icon, {
-				className: "mr-3 text-gray-700 dark:text-slate-200",
+				className: "mr-3 text-foreground",
 				name: "Search"
 			}),
 			/* @__PURE__ */ jsx("input", {
-				className: twMerge("flex h-[52px] min-w-0 flex-1 items-center rounded-xl border border-gray-200 bg-gray-50 px-4 text-sm text-gray-200 outline-none dark:border-slate-500 dark:bg-slate-600 dark:text-slate-100"),
+				className: twMerge("flex h-[52px] min-w-0 flex-1 items-center rounded-xl border border-border bg-background px-4 text-sm text-foreground outline-none"),
 				onChange: handleChange,
 				placeholder,
 				value
@@ -13575,9 +13575,9 @@ const ConnectSearchBar = (props) => {
 					/* @__PURE__ */ jsx(Icon, { name: "ChevronDown" })
 				]
 			}), /* @__PURE__ */ jsx(DropdownMenuContent, {
-				className: "rounded-xl border border-gray-100 bg-gray-50 p-2 dark:border-slate-500 dark:bg-slate-600 dark:text-slate-100",
+				className: "rounded-xl border border-border bg-background p-2",
 				children: items.map((item) => /* @__PURE__ */ jsx(DropdownMenuItem, {
-					className: "h-10 cursor-pointer overflow-hidden rounded-lg hover:bg-gray-100 dark:hover:bg-slate-700",
+					className: "h-10 cursor-pointer overflow-hidden rounded-lg hover:hover-effect",
 					id: item.id,
 					onSelect: () => onFilterSelect(item.id),
 					children: item.content
@@ -13589,4 +13589,4 @@ const ConnectSearchBar = (props) => {
 //#endregion
 export { FolderItem as a, FormProvider as c, set as d, useForm as f, Icon as g, useWindowSize as h, FileItem as i, appendErrors as l, PowerhouseButton as m, ConnectSearchBar as n, useVirtualizer as o, useFormContext as p, DocumentToolbar as r, Controller as s, Breadcrumbs as t, get as u };
 
-//# sourceMappingURL=connect-BPAGykLm.js.map
+//# sourceMappingURL=connect-CahHnhpc.js.map