@powerhousedao/powerhouse-vetra-packages 6.2.0-dev.4 → 6.2.0-dev.41

package/dist/browser/{state-schemas-S69fnpVk.js → state-schemas-Cx-QbW5a.js}

@@ -12,7 +12,7 @@ const Button = forwardRef((props, ref) => {
 	return /* @__PURE__ */ jsx("button", {
 		ref,
 		...rest,
-		className: twMerge("h-10 rounded-md border border-gray-200 bg-gray-50 px-4 py-2 text-sm font-medium whitespace-nowrap text-gray-900 transition-colors hover:bg-gray-100 hover:text-gray-900 focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50 dark:border-slate-500 dark:bg-slate-600 dark:text-slate-100 dark:hover:bg-slate-700 dark:hover:text-slate-50", className)
+		className: twMerge("h-10 rounded-md border border-border bg-background px-4 py-2 text-sm font-medium whitespace-nowrap text-foreground transition-colors hover:hover-effect focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none disabled:disabled-effect", className)
 	});
 });
 //#endregion
@@ -64,13 +64,13 @@ function StateValidationErrorMessage({ error }) {
 const Tabs = Root2;
 const TabsList = React$1.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(List, {
 	ref,
-	className: twMerge("flex items-center justify-center rounded-xl bg-gray-50 p-1 shadow-inner dark:bg-slate-800", className),
+	className: twMerge("flex items-center justify-center rounded-xl bg-background p-1 shadow-inner", className),
 	...props
 }));
 TabsList.displayName = List.displayName;
 const TabsTrigger = React$1.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(Trigger, {
 	ref,
-	className: twMerge("flex w-full items-center justify-center rounded-lg p-1 text-sm whitespace-nowrap text-gray-500 transition-all disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-gray-50 data-[state=active]:text-gray-800 data-[state=active]:shadow-tab dark:text-slate-400", className),
+	className: twMerge("flex w-full items-center justify-center rounded-lg p-1 text-sm whitespace-nowrap text-muted-foreground transition-all disabled:disabled-effect data-[state=active]:bg-accent data-[state=active]:text-foreground data-[state=active]:shadow-tab", className),
 	...props
 }));
 TabsTrigger.displayName = Trigger.displayName;
@@ -82,8 +82,8 @@ const TabsContent = React$1.forwardRef(({ className, ...props }, ref) => /* @__P
 TabsContent.displayName = Content.displayName;
 //#endregion
 //#region editors/document-model-editor/components/state-schemas.tsx
-const GraphqlEditor = lazy(() => import("./graphql-editor-Dwgpm08w.js"));
-const JSONEditor = lazy(() => import("./json-editor-SKLjwlux.js"));
+const GraphqlEditor = lazy(() => import("./graphql-editor-b61MnkEP.js"));
+const JSONEditor = lazy(() => import("./json-editor-DO_EwDmY.js"));
 function StateEditor({ modelName, stateSchema, initialValue, setStateSchema, setInitialState, scope }) {
 	const { sharedSchema: sharedSchemaSdl, error: sharedSchemaError } = useSchemaContext();
 	const [showStandardLib, setShowStandardLib] = useState(false);
@@ -159,7 +159,7 @@ function StateEditor({ modelName, stateSchema, initialValue, setStateSchema, set
 		className: "grid grid-cols-2 gap-4",
 		children: [/* @__PURE__ */ jsxs("div", { children: [
 			/* @__PURE__ */ jsxs("h3", {
-				className: "mb-2 text-lg text-gray-900 capitalize dark:text-slate-100",
+				className: "mb-2 text-lg text-foreground capitalize",
 				children: [scope, " state schema *"]
 			}),
 			/* @__PURE__ */ jsxs(Button, {
@@ -193,17 +193,17 @@ function StateEditor({ modelName, stateSchema, initialValue, setStateSchema, set
 					customLinter
 				}),
 				schemaErrors.length > 0 && /* @__PURE__ */ jsx("p", {
-					className: "mt-2 text-sm text-red-600 dark:text-red-100",
+					className: "mt-2 text-sm text-destructive",
 					children: schemaErrors[0].message
 				})
 			] })
 		] }), /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsxs("div", {
 			className: "flex flex-col items-end",
 			children: [/* @__PURE__ */ jsxs("h3", {
-				className: "mb-2 text-right text-lg text-gray-900 capitalize dark:text-slate-100",
+				className: "mb-2 text-right text-lg text-foreground capitalize",
 				children: [scope, " state initial value *"]
 			}), /* @__PURE__ */ jsxs("label", {
-				className: "mb-2 flex w-fit items-center gap-2 rounded-md border border-gray-200 bg-gray-50 p-2 text-sm font-medium whitespace-nowrap text-gray-900 transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none dark:border-slate-500 dark:bg-slate-600 dark:text-slate-100 dark:hover:bg-slate-500 dark:hover:text-slate-50",
+				className: "mb-2 flex w-fit items-center gap-2 rounded-md border border-border bg-background p-2 text-sm font-medium whitespace-nowrap text-foreground transition-colors hover:hover-effect focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none",
 				children: [
 					/* @__PURE__ */ jsx("input", {
 						type: "checkbox",
@@ -233,7 +233,7 @@ function StateEditor({ modelName, stateSchema, initialValue, setStateSchema, set
 			doc: initialValue,
 			updateDocumentInModel: handleInitialStateUpdate
 		}), initialValueErrors.map((error, index) => /* @__PURE__ */ jsx("p", {
-			className: "mt-2 text-sm text-red-600 dark:text-red-100",
+			className: "mt-2 text-sm text-destructive",
 			children: error instanceof StateValidationError ? /* @__PURE__ */ jsx(StateValidationErrorMessage, { error }) : error.message
 		}, index))] })] })]
 	});
@@ -284,7 +284,7 @@ function StateSchemas({ modelName, globalStateSchema, localStateSchema, globalSt
 				children: !localStateSchema ? /* @__PURE__ */ jsxs("div", {
 					className: "",
 					children: [/* @__PURE__ */ jsx("h3", {
-						className: "mb-2 text-lg text-gray-900 capitalize dark:text-slate-100",
+						className: "mb-2 text-lg text-foreground capitalize",
 						children: "local state schema *"
 					}), /* @__PURE__ */ jsx(Button, {
 						onClick: handleAddLocalState,
@@ -305,4 +305,4 @@ function StateSchemas({ modelName, globalStateSchema, localStateSchema, globalSt
 //#endregion
 export { StateSchemas as default };
 
-//# sourceMappingURL=state-schemas-S69fnpVk.js.map
+//# sourceMappingURL=state-schemas-Cx-QbW5a.js.map

package/dist/browser/state-schemas-Cx-QbW5a.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"state-schemas-Cx-QbW5a.js","names":["TabsPrimitive.Root","React","TabsPrimitive.List","TabsPrimitive.Trigger","TabsPrimitive.Content"],"sources":["../../editors/document-model-editor/components/button.tsx","../../editors/document-model-editor/components/state-error.tsx","../../editors/document-model-editor/components/tabs.tsx","../../editors/document-model-editor/components/state-schemas.tsx"],"sourcesContent":["import type { ComponentPropsWithRef } from \"react\";\nimport { forwardRef } from \"react\";\nimport { twMerge } from \"tailwind-merge\";\n\ntype Props = ComponentPropsWithRef<\"button\">;\n\nexport const Button = forwardRef<HTMLButtonElement, Props>((props, ref) => {\n  const { className, ...rest } = props;\n  return (\n    <button\n      ref={ref}\n      {...rest}\n      className={twMerge(\n        \"h-10 rounded-md border border-border bg-background px-4 py-2 text-sm font-medium whitespace-nowrap text-foreground transition-colors hover:hover-effect focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none disabled:disabled-effect\",\n        className,\n      )}\n    />\n  );\n});\n","import type { StateValidationError } from \"../utils/helpers.js\";\n\nexport function StateValidationErrorMessage({\n  error,\n}: {\n  error: StateValidationError;\n}) {\n  const { payload } = error;\n\n  switch (payload.kind) {\n    case \"MISSING\":\n      return (\n        <span>\n          Field <strong>{payload.field}</strong> is missing.\n        </span>\n      );\n\n    case \"MISSING_OPTIONAL\":\n      return (\n        <span>\n          Optional field <strong>{payload.field}</strong> is not defined.\n        </span>\n      );\n\n    case \"UNKNOWN_FIELD\":\n      return (\n        <span>\n          Field <strong>{payload.field}</strong> is not a known field.\n        </span>\n      );\n\n    case \"NON_NULL\":\n      return (\n        <span>\n          Field <strong>{payload.field}</strong> cannot be null.\n        </span>\n      );\n\n    case \"TYPE\":\n      return (\n        <span>\n          Field <strong>{payload.field}</strong>\n          {payload.expectedType ? (\n            <>\n              {\" \"}\n              must be a{\" \"}\n              <strong>{payload.expectedType.replace(/!/g, \"\")}</strong>.\n            </>\n          ) : (\n            <> has an invalid value.</>\n          )}\n        </span>\n      );\n\n    case \"RECURSIVE_TYPE\":\n      return (\n        <span>\n          Field <strong>{payload.typeName}</strong> has a recursive type. It\n          must be optional.\n        </span>\n      );\n\n    default:\n      return <span>Invalid value.</span>;\n  }\n}\n","import * as TabsPrimitive from \"@radix-ui/react-tabs\";\nimport * as React from \"react\";\nimport { twMerge } from \"tailwind-merge\";\n\nconst Tabs = TabsPrimitive.Root;\n\nconst TabsList = React.forwardRef<\n  React.ElementRef<typeof TabsPrimitive.List>,\n  React.ComponentPropsWithoutRef<typeof TabsPrimitive.List>\n>(({ className, ...props }, ref) => (\n  <TabsPrimitive.List\n    ref={ref}\n    className={twMerge(\n      \"flex items-center justify-center rounded-xl bg-background p-1 shadow-inner\",\n      className,\n    )}\n    {...props}\n  />\n));\nTabsList.displayName = TabsPrimitive.List.displayName;\n\nconst TabsTrigger = React.forwardRef<\n  React.ElementRef<typeof TabsPrimitive.Trigger>,\n  React.ComponentPropsWithoutRef<typeof TabsPrimitive.Trigger>\n>(({ className, ...props }, ref) => (\n  <TabsPrimitive.Trigger\n    ref={ref}\n    className={twMerge(\n      \"flex w-full items-center justify-center rounded-lg p-1 text-sm whitespace-nowrap text-muted-foreground transition-all disabled:disabled-effect data-[state=active]:bg-accent data-[state=active]:text-foreground data-[state=active]:shadow-tab\",\n      className,\n    )}\n    {...props}\n  />\n));\nTabsTrigger.displayName = TabsPrimitive.Trigger.displayName;\n\nconst TabsContent = React.forwardRef<\n  React.ElementRef<typeof TabsPrimitive.Content>,\n  React.ComponentPropsWithoutRef<typeof TabsPrimitive.Content>\n>(({ className, ...props }, ref) => (\n  <TabsPrimitive.Content ref={ref} className={className} {...props} />\n));\nTabsContent.displayName = TabsPrimitive.Content.displayName;\n\nexport { Tabs, TabsContent, TabsList, TabsTrigger };\n","import { twMerge } from \"tailwind-merge\";\nimport { Checkbox } from \"@powerhousedao/design-system/ui\";\nimport { Kind } from \"graphql\";\nimport {\n  lazy,\n  Suspense,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\nimport { typeDefsDoc } from \"../constants/documents.js\";\nimport { safeParseSdl, useSchemaContext } from \"../context/schema-context.js\";\nimport type { Scope } from \"../types/documents.js\";\nimport {\n  makeInitialSchemaDoc,\n  makeMinimalObjectForStateType,\n  makeStateSchemaNameForScope,\n  StateValidationError,\n  validateStateObject,\n} from \"../utils/helpers.js\";\nimport { ensureValidStateSchemaName } from \"../utils/linting.js\";\nimport { Button } from \"./button.js\";\nimport { StateValidationErrorMessage } from \"./state-error.js\";\nimport { Tabs, TabsContent, TabsList, TabsTrigger } from \"./tabs.js\";\nconst GraphqlEditor = lazy(() => import(\"./code-editors/graphql-editor.js\"));\nconst JSONEditor = lazy(() => import(\"./code-editors/json-editor.js\"));\ntype Props = {\n  modelName: string;\n  globalStateSchema: string;\n  localStateSchema: string;\n  globalStateInitialValue: string;\n  localStateInitialValue: string;\n  setStateSchema: (doc: string, scope: Scope) => void;\n  setInitialState: (doc: string, scope: Scope) => void;\n  currentScope: Scope;\n  onScopeChange: (scope: Scope) => void;\n};\n\ntype StateEditorProps = {\n  modelName: string;\n  stateSchema: string;\n  initialValue: string;\n  setStateSchema: (doc: string, scope: Scope) => void;\n  setInitialState: (doc: string, scope: Scope) => void;\n  scope: Scope;\n};\n\nfunction StateEditor({\n  modelName,\n  stateSchema,\n  initialValue,\n  setStateSchema,\n  setInitialState,\n  scope,\n}: StateEditorProps) {\n  const { sharedSchema: sharedSchemaSdl, error: sharedSchemaError } =\n    useSchemaContext();\n  const [showStandardLib, setShowStandardLib] = useState(false);\n  const [syncWithSchema, setSyncWithSchema] = useState(true);\n\n  const customLinter = useCallback(\n    (doc: string) => ensureValidStateSchemaName(doc, modelName, scope),\n    [modelName, scope],\n  );\n\n  const schemaErrors = useMemo(() => {\n    const errors = ensureValidStateSchemaName(stateSchema, modelName, scope);\n    if (sharedSchemaError) {\n      return [...errors, sharedSchemaError];\n    }\n    return errors;\n  }, [stateSchema, modelName, scope, sharedSchemaError]);\n\n  const handleToggleStandardLib = useCallback(() => {\n    setShowStandardLib((prev) => !prev);\n  }, []);\n\n  const handleSchemaUpdate = useCallback(\n    (newDoc: string) => setStateSchema(newDoc, scope),\n    [setStateSchema, scope],\n  );\n\n  const handleInitialStateUpdate = useCallback(\n    (newDoc: string) => setInitialState(newDoc, scope),\n    [setInitialState, scope],\n  );\n\n  // Track if we've already synced to prevent double-calls in StrictMode\n  const hasSyncedRef = useRef(false);\n\n  const { initialValueErrors, fixedState } = useMemo(() => {\n    const existingValue = initialValue || \"{}\";\n    const sharedSchemaDocumentNode = safeParseSdl(sharedSchemaSdl);\n    if (!sharedSchemaDocumentNode)\n      return { initialValueErrors: [], fixedState: null };\n    const stateTypeName = makeStateSchemaNameForScope(modelName, scope);\n    if (!stateTypeName) return { initialValueErrors: [], fixedState: null };\n    const stateTypeDefinitionNode = sharedSchemaDocumentNode.definitions.find(\n      (def) =>\n        def.kind === Kind.OBJECT_TYPE_DEFINITION &&\n        def.name.value === stateTypeName,\n    );\n    if (\n      !stateTypeDefinitionNode ||\n      stateTypeDefinitionNode.kind !== Kind.OBJECT_TYPE_DEFINITION\n    )\n      return { initialValueErrors: [], fixedState: null };\n\n    const errors = validateStateObject(\n      sharedSchemaDocumentNode,\n      stateTypeDefinitionNode,\n      existingValue,\n    );\n\n    if (errors.length && syncWithSchema) {\n      const computedFixedState = makeMinimalObjectForStateType({\n        sharedSchemaDocumentNode,\n        stateTypeDefinitionNode,\n        existingValue,\n      });\n      if (initialValue !== computedFixedState) {\n        return { initialValueErrors: [], fixedState: computedFixedState };\n      }\n    }\n    return { initialValueErrors: errors, fixedState: null };\n  }, [sharedSchemaSdl, initialValue, syncWithSchema, scope, modelName]);\n\n  // Handle the side effect of syncing initial state separately\n  useEffect(() => {\n    if (fixedState && !hasSyncedRef.current) {\n      hasSyncedRef.current = true;\n      setInitialState(fixedState, scope);\n    } else if (!fixedState) {\n      // Reset the ref when there's no fix needed\n      hasSyncedRef.current = false;\n    }\n  }, [fixedState, setInitialState, scope]);\n\n  return (\n    <div className=\"grid grid-cols-2 gap-4\">\n      <div>\n        <h3 className=\"mb-2 text-lg text-foreground capitalize\">\n          {scope} state schema *\n        </h3>\n        <Button\n          onClick={handleToggleStandardLib}\n          className=\"mb-2 flex w-fit items-center gap-2\"\n        >\n          {showStandardLib ? \"Hide\" : \"Show\"} standard library\n          <svg\n            className={twMerge(\n              \"inline-block transition-transform\",\n              showStandardLib ? \"rotate-180\" : \"rotate-0\",\n            )}\n            xmlns=\"http://www.w3.org/2000/svg\"\n            width=\"24\"\n            height=\"24\"\n            viewBox=\"0 0 24 24\"\n            fill=\"currentColor\"\n          >\n            <path\n              d=\"M11.9883 6.01172C11.4363 6.01172 10.9883 6.45972 10.9883 7.01172V13.0117H6.98828L11.9883 18.0117L16.9883 13.0117H12.9883V7.01172C12.9883 6.45972 12.5403 6.01172 11.9883 6.01172Z\"\n              fill=\"currentColor\"\n            />\n          </svg>\n        </Button>\n        <Suspense>\n          {showStandardLib && <GraphqlEditor doc={typeDefsDoc} readonly />}\n          <GraphqlEditor\n            doc={stateSchema}\n            updateDocumentInModel={handleSchemaUpdate}\n            customLinter={customLinter}\n          />\n          {schemaErrors.length > 0 && (\n            <p className=\"mt-2 text-sm text-destructive\">\n              {schemaErrors[0].message}\n            </p>\n          )}\n        </Suspense>\n      </div>\n      <div>\n        <div className=\"flex flex-col items-end\">\n          <h3 className=\"mb-2 text-right text-lg text-foreground capitalize\">\n            {scope} state initial value *\n          </h3>\n          <label className=\"mb-2 flex w-fit items-center gap-2 rounded-md border border-border bg-background p-2 text-sm font-medium whitespace-nowrap text-foreground transition-colors hover:hover-effect focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none\">\n            <input\n              type=\"checkbox\"\n              className=\"\"\n              value={syncWithSchema.toString()}\n              onChange={(e) => {\n                setSyncWithSchema(\n                  e.currentTarget.value === \"true\" ? true : false,\n                );\n              }}\n            />\n            Sync with schema{\" \"}\n            <svg\n              className=\"inline-block\"\n              xmlns=\"http://www.w3.org/2000/svg\"\n              width=\"16\"\n              height=\"16\"\n              viewBox=\"0 0 16 16\"\n              fill=\"none\"\n            >\n              <path\n                d=\"M8.00521 1.99219C6.63588 1.99219 5.32788 2.45152 4.27588 3.28419C3.98721 3.51219 3.94321 3.93285 4.17188 4.22151C4.40054 4.51018 4.82055 4.55418 5.10921 4.32552C5.92721 3.67819 6.93921 3.32552 8.00521 3.32552C10.5825 3.32552 12.6719 5.41485 12.6719 7.99218H11.3385L13.3385 10.6588L15.3385 7.99218H14.0052C14.0052 4.67818 11.3192 1.99219 8.00521 1.99219ZM2.67188 5.32552L0.671875 7.99218H2.00521C2.00521 11.3062 4.69121 13.9922 8.00521 13.9922C9.37521 13.9922 10.6825 13.5335 11.7345 12.7002C12.0232 12.4722 12.0672 12.0515 11.8385 11.7628C11.6099 11.4742 11.1899 11.4302 10.9012 11.6588C10.0825 12.3068 9.07188 12.6588 8.00521 12.6588C5.42788 12.6588 3.33854 10.5695 3.33854 7.99218H4.67188L2.67188 5.32552Z\"\n                fill=\"currentColor\"\n              />\n            </svg>\n          </label>\n        </div>\n        <Suspense>\n          <JSONEditor\n            doc={initialValue}\n            updateDocumentInModel={handleInitialStateUpdate}\n          />\n          {initialValueErrors.map((error, index) => (\n            <p key={index} className=\"mt-2 text-sm text-destructive\">\n              {error instanceof StateValidationError ? (\n                <StateValidationErrorMessage error={error} />\n              ) : (\n                error.message\n              )}\n            </p>\n          ))}\n        </Suspense>\n      </div>\n    </div>\n  );\n}\n\nexport default function StateSchemas({\n  modelName,\n  globalStateSchema,\n  localStateSchema,\n  globalStateInitialValue,\n  localStateInitialValue,\n  setStateSchema,\n  setInitialState,\n  currentScope,\n  onScopeChange,\n}: Props) {\n  const handleAddLocalState = useCallback(() => {\n    const initialDoc = makeInitialSchemaDoc(modelName, \"local\");\n    setStateSchema(initialDoc, \"local\");\n    setInitialState(\"\", \"local\");\n  }, [modelName, setStateSchema, setInitialState]);\n\n  return (\n    <Tabs\n      className=\"pb-8\"\n      activationMode=\"manual\"\n      value={currentScope}\n      onValueChange={(value) => onScopeChange(value as Scope)}\n    >\n      <div className=\"my-6\">\n        <TabsList className=\"mx-auto flex max-w-sm\">\n          <TabsTrigger value=\"global\">Global</TabsTrigger>\n          <TabsTrigger value=\"local\">Local</TabsTrigger>\n        </TabsList>\n      </div>\n\n      <TabsContent value=\"global\" tabIndex={-1}>\n        <StateEditor\n          modelName={modelName}\n          stateSchema={globalStateSchema}\n          initialValue={globalStateInitialValue}\n          setStateSchema={setStateSchema}\n          setInitialState={setInitialState}\n          scope=\"global\"\n        />\n      </TabsContent>\n\n      <TabsContent value=\"local\" tabIndex={-1}>\n        {!localStateSchema ? (\n          <div className=\"\">\n            <h3 className=\"mb-2 text-lg text-foreground capitalize\">\n              local state schema *\n            </h3>\n            <Button onClick={handleAddLocalState}>Add local state</Button>\n          </div>\n        ) : (\n          <StateEditor\n            modelName={modelName}\n            stateSchema={localStateSchema}\n            initialValue={localStateInitialValue}\n            setStateSchema={setStateSchema}\n            setInitialState={setInitialState}\n            scope=\"local\"\n          />\n        )}\n      </TabsContent>\n    </Tabs>\n  );\n}\n"],"mappings":"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"}

package/dist/node/{connect-5a3Nx0Jd.mjs → connect-CwDdrOag.mjs}

@@ -1,8 +1,8 @@
 import { A as __toCommonJS, E as __commonJSMin, j as __toESM, k as __require } from "./dist-fA4EItr0.mjs";
-import { G as undo, k as redo } from "./document-drive-BK2-EDni.mjs";
-import { i as tslib_es6_exports, r as init_tslib_es6 } from "./dist-C7ZmTHz4.mjs";
+import { A as redo, K as undo } from "./document-drive-DjL9iikf.mjs";
+import { n as init_tslib_es6, r as tslib_es6_exports } from "./main-DbTMJyA_.mjs";
 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, v as createContextScope, x as composeEventHandlers, y as composeRefs } from "./dist-BeZaEP6S.mjs";
-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-QOGgRb-y.mjs";
+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-RdOXBdt-.mjs";
 import * as React$10 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";
@@ -8287,15 +8287,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"
@@ -13253,14 +13253,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",
@@ -13282,14 +13282,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",
@@ -13306,7 +13306,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,
@@ -13331,7 +13331,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
 	});
 }
@@ -13397,7 +13397,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
 	});
 }
@@ -13555,7 +13555,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
@@ -13591,7 +13591,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
@@ -13786,9 +13786,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", {
@@ -13832,7 +13832,7 @@ const folderNodeDropdownOptions = {
 			name: "Trash",
 			size: 16
 		}),
-		className: "text-red-900 dark:text-red-400"
+		className: "text-destructive"
 	}
 };
 const fileNodeDropdownOptions = {
@@ -13869,37 +13869,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];
@@ -13965,7 +13965,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, {
@@ -13975,16 +13975,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, {
@@ -13999,7 +13999,7 @@ function FileItem(props) {
 					setIsDropdownMenuOpen(true);
 				},
 				children: /* @__PURE__ */ jsx(Icon, {
-					className: "text-gray-700 dark:text-slate-200",
+					className: "text-foreground",
 					name: "VerticalDots"
 				})
 			})
@@ -14028,7 +14028,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",
@@ -14172,7 +14172,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",
@@ -14180,9 +14180,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,
@@ -14193,7 +14193,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
@@ -14212,7 +14212,7 @@ function FolderItem(props) {
 						setIsDropdownMenuOpen(true);
 					},
 					children: /* @__PURE__ */ jsx(Icon, {
-						className: "text-gray-700 dark:text-slate-200",
+						className: "text-foreground",
 						name: "VerticalDots"
 					})
 				})
@@ -14226,7 +14226,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
 		})]
 	});
@@ -14242,7 +14242,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) {
@@ -14252,11 +14252,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
@@ -14269,9 +14269,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
@@ -14283,4 +14283,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-5a3Nx0Jd.mjs.map
+//# sourceMappingURL=connect-CwDdrOag.mjs.map