@stll/workspace-ui 0.6.0 → 0.6.1

package/dist/workspace-frame.js

@@ -1,9 +1,11 @@
 "use client";
+import { resolveWorkspaceInspectorPresentation } from "./workspace-frame.logic.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { cn } from "@stll/ui/utils";
 import { ApplicationRail, ApplicationRailButton, ApplicationRailContent, ApplicationRailFooter, ApplicationRailHeader, ApplicationRailMenu } from "@stll/ui/application-rail";
 import { InspectorDock, TOOLBAR_ROW_HEIGHT } from "@stll/ui/inspector";
 import { Sheet, SheetPopup, SheetTitle } from "@stll/ui/sheet";
+import { useIsMobile } from "@stll/ui/use-mobile";
 import { WorkspaceEndRail, WorkspaceShell } from "@stll/ui/workspace-shell";
 //#region src/workspace-frame.tsx
 /**
@@ -18,7 +20,14 @@ const WorkspaceFrame = (props) => {
 		topBar: props.topBar,
 		children: props.children
 	});
-	const { children, endRail, inspector, navigation, topBar } = props;
+	return /* @__PURE__ */ jsx(DescribedWorkspaceFrame, { ...props });
+};
+const DescribedWorkspaceFrame = ({ children, endRail, inspector, navigation, topBar }) => {
+	const isCompact = useIsMobile();
+	const inspectorPresentation = resolveWorkspaceInspectorPresentation({
+		hasMobilePresentation: inspector?.mobile !== void 0,
+		isCompact
+	});
 	const desktopNavigation = /* @__PURE__ */ jsxs(ApplicationRail, {
 		"aria-label": navigation.label,
 		children: [
@@ -36,7 +45,7 @@ const WorkspaceFrame = (props) => {
 			/* @__PURE__ */ jsx(ApplicationRailFooter, { children: navigation.footer })
 		]
 	});
-	const endDock = inspector ? /* @__PURE__ */ jsx(InspectorDock, {
+	const endDock = inspector && inspectorPresentation === "desktop" ? /* @__PURE__ */ jsx(InspectorDock, {
 		rail: /* @__PURE__ */ jsx(WorkspaceEndRail, { ...endRail }),
 		resizeHandleLabel: inspector.resizeHandleLabel,
 		resizeHandleProps: inspector.resizeHandleProps,
@@ -74,17 +83,19 @@ const WorkspaceFrame = (props) => {
 	});
 	if (inspector?.mobile === void 0) return frame;
 	return /* @__PURE__ */ jsxs(Sheet, {
-		open: inspector.mobile.open,
-		onOpenChange: inspector.mobile.onOpenChange,
-		children: [frame, /* @__PURE__ */ jsxs(SheetPopup, {
-			className: "h-dvh w-full max-w-none border-0 p-0 md:hidden",
+		open: inspectorPresentation === "mobile" && inspector.mobile.open,
+		onOpenChange: (open) => {
+			if (inspectorPresentation === "mobile") inspector.mobile?.onOpenChange(open);
+		},
+		children: [frame, inspectorPresentation === "mobile" ? /* @__PURE__ */ jsxs(SheetPopup, {
+			className: "h-dvh w-full max-w-none border-0 p-0",
 			showCloseButton: false,
 			side: "inline-end",
 			children: [/* @__PURE__ */ jsx(SheetTitle, {
 				className: "sr-only",
 				children: inspector.mobile.label
 			}), inspector.mobile.content]
-		})]
+		}) : null]
 	});
 };
 //#endregion

package/dist/workspace-frame.logic.d.ts

@@ -0,0 +1,7 @@
+//#region src/workspace-frame.logic.d.ts
+declare const resolveWorkspaceInspectorPresentation: ({ hasMobilePresentation, isCompact }: {
+  hasMobilePresentation: boolean;
+  isCompact: boolean;
+}) => "desktop" | "mobile";
+//#endregion
+export { resolveWorkspaceInspectorPresentation };

package/dist/workspace-frame.logic.js

@@ -0,0 +1,4 @@
+//#region src/workspace-frame.logic.ts
+const resolveWorkspaceInspectorPresentation = ({ hasMobilePresentation, isCompact }) => hasMobilePresentation && isCompact ? "mobile" : "desktop";
+//#endregion
+export { resolveWorkspaceInspectorPresentation };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stll/workspace-ui",
-  "version": "0.6.0",
+  "version": "0.6.1",
   "description": "Reusable workspace presentation components and view helpers for Stella.",
   "keywords": [
     "calculations",
@@ -119,7 +119,7 @@
     "@stll/calculations": "^0.1.0",
     "@stll/conditions": "^0.2.0",
     "@stll/money": "^0.1.0",
-    "@stll/ui": "^0.14.0",
+    "@stll/ui": "^0.15.0",
     "better-result": "3.0.0",
     "lucide-react": "1.30.0",
     "use-intl": "4.13.5"