gloomberb 0.9.1 → 0.9.2

package/src/renderers/electrobun/view/styles.css

@@ -32,15 +32,9 @@ button, [data-gloom-interactive="true"] { cursor: pointer; }
 [data-gloom-role="app-header"][data-titlebar-overlay="true"],
 .electrobun-webkit-app-region-drag {
   cursor: default;
-  -webkit-app-region: drag;
-  app-region: drag;
   -webkit-user-select: none;
   user-select: none;
 }
-.electrobun-webkit-app-region-no-drag {
-  -webkit-app-region: no-drag;
-  app-region: no-drag;
-}
 [data-titlebar-overlay="true"] {
   min-height: __TITLEBAR_OVERLAY_HEIGHT_PX__px;
   max-height: __TITLEBAR_OVERLAY_HEIGHT_PX__px;
@@ -55,15 +49,22 @@ button, [data-gloom-interactive="true"] { cursor: pointer; }
 [data-titlebar-overlay="true"] a,
 [data-titlebar-overlay="true"] .electrobun-webkit-app-region-no-drag,
 [data-titlebar-overlay="true"] [data-gloom-interactive="true"] {
-  -webkit-app-region: no-drag;
-  app-region: no-drag;
+  cursor: pointer;
 }
 [data-gloom-role="window-controls"] {
   height: 100%;
   color: var(--gloom-header-text, #f2f2f2);
 }
 [data-gloom-role="window-control"] {
+  appearance: none;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border: 0;
+  padding: 0;
+  background: transparent;
   color: color-mix(in srgb, var(--gloom-header-text, #f2f2f2) 86%, transparent);
+  cursor: pointer;
   transition: background-color 90ms linear, color 90ms linear;
 }
 [data-gloom-role="window-control"] svg {

package/src/renderers/electrobun/view/ui-host.tsx

@@ -31,92 +31,117 @@ function currentDesktopPlatform(): string {
   const navigatorWithUserAgentData = navigator as Navigator & {
     userAgentData?: { platform?: string };
   };
-  return navigatorWithUserAgentData.userAgentData?.platform ?? navigator.platform ?? "";
+  return [
+    navigatorWithUserAgentData.userAgentData?.platform,
+    navigator.platform,
+    navigator.userAgent,
+  ].filter((value): value is string => Boolean(value)).join(" ");
 }
 
 const DESKTOP_PLATFORM = currentDesktopPlatform();
-const USES_WINDOWS_CONTROLS = /win/i.test(DESKTOP_PLATFORM);
+const USES_WINDOWS_CONTROLS = !/(darwin|ipad|iphone|linux|mac)/i.test(DESKTOP_PLATFORM);
+const NON_WINDOWS_DESKTOP_PLATFORMS = /^(darwin|linux|freebsd|openbsd|aix|sunos)$/i;
 
-export const webUiHost: UiHost = {
-  kind: "desktop-web",
-  capabilities: {
-    nativePaneChrome: true,
-    titleBarOverlay: true,
-    precisePointer: true,
-    fractionalViewport: true,
-    cellWidthPx: WEB_CELL_WIDTH,
-    cellHeightPx: WEB_CELL_HEIGHT,
-    pixelRatio: Math.min(window.devicePixelRatio || 1, 2),
-    canvasCharts: true,
-    nativeContextMenu: NATIVE_CONTEXT_MENU_SUPPORTED,
-    windowControls: USES_WINDOWS_CONTROLS ? "windows" : undefined,
-  },
-  Box: WebBox,
-  Text: WebText,
-  Span: WebSpan,
-  Strong: WebStrong,
-  Underline: WebUnderline,
-  ScrollBox: WebScrollBox,
-  Input: WebInput,
-  Textarea: WebTextarea,
-  Button: WebButton,
-  TextField: WebTextField,
-  MessageComposer: WebMessageComposer,
-  ListView: WebListView,
-  SegmentedControl: WebSegmentedControl,
-  DialogFrame: WebDialogFrame,
-  PageStackView: WebPageStackView,
-  DataTable: WebDataTable,
-  Tabs: WebTabs,
-  ChartSurface: WebChartSurface,
-  ImageSurface: ({ children, src, alt = "", objectFit = "contain", ...props }) => {
-    const imageSrc = typeof src === "string" ? src.trim() : "";
-    const [failed, setFailed] = useState(false);
-    useEffect(() => setFailed(false), [imageSrc]);
-    const baseStyle = commonStyle(props);
-    return (
-      <div
+function usesWindowsWindowControls(desktopPlatform?: string): boolean {
+  const platform = desktopPlatform?.trim();
+  if (!platform) {
+    return USES_WINDOWS_CONTROLS;
+  }
+  if (/^win/i.test(platform)) {
+    return true;
+  }
+  if (NON_WINDOWS_DESKTOP_PLATFORMS.test(platform)) {
+    return false;
+  }
+  return USES_WINDOWS_CONTROLS;
+}
+
+export function createWebUiHost(desktopPlatform?: string): UiHost {
+  const usesWindowsControls = usesWindowsWindowControls(desktopPlatform);
+
+  return {
+    kind: "desktop-web",
+    capabilities: {
+      nativePaneChrome: true,
+      titleBarOverlay: true,
+      precisePointer: true,
+      fractionalViewport: true,
+      cellWidthPx: WEB_CELL_WIDTH,
+      cellHeightPx: WEB_CELL_HEIGHT,
+      pixelRatio: Math.min(window.devicePixelRatio || 1, 2),
+      canvasCharts: true,
+      nativeContextMenu: NATIVE_CONTEXT_MENU_SUPPORTED,
+      windowControls: usesWindowsControls ? "windows" : undefined,
+    },
+    Box: WebBox,
+    Text: WebText,
+    Span: WebSpan,
+    Strong: WebStrong,
+    Underline: WebUnderline,
+    ScrollBox: WebScrollBox,
+    Input: WebInput,
+    Textarea: WebTextarea,
+    Button: WebButton,
+    TextField: WebTextField,
+    MessageComposer: WebMessageComposer,
+    ListView: WebListView,
+    SegmentedControl: WebSegmentedControl,
+    DialogFrame: WebDialogFrame,
+    PageStackView: WebPageStackView,
+    DataTable: WebDataTable,
+    Tabs: WebTabs,
+    ChartSurface: WebChartSurface,
+    ImageSurface: ({ children, src, alt = "", objectFit = "contain", ...props }) => {
+      const imageSrc = typeof src === "string" ? src.trim() : "";
+      const [failed, setFailed] = useState(false);
+      useEffect(() => setFailed(false), [imageSrc]);
+      const baseStyle = commonStyle(props);
+      return (
+        <div
+          {...cleanDomProps(props)}
+          style={{
+            ...baseStyle,
+            overflow: baseStyle.overflow ?? "hidden",
+            ...(props.style as CSSProperties | undefined),
+          }}
+        >
+          {imageSrc && !failed ? (
+            <img
+              src={imageSrc}
+              alt={alt}
+              draggable={false}
+              onError={() => setFailed(true)}
+              style={{
+                width: "100%",
+                height: "100%",
+                display: "block",
+                objectFit,
+              }}
+            />
+          ) : children as ReactNode}
+        </div>
+      );
+    },
+    SpinnerMark: ({ color, ...props }) => (
+      <span
         {...cleanDomProps(props)}
+        aria-hidden="true"
         style={{
-          ...baseStyle,
-          overflow: baseStyle.overflow ?? "hidden",
+          color,
+          display: "inline-block",
+          width: "1ch",
+          animation: "gloom-spin 0.9s steps(8) infinite",
           ...(props.style as CSSProperties | undefined),
         }}
       >
-        {imageSrc && !failed ? (
-          <img
-            src={imageSrc}
-            alt={alt}
-            draggable={false}
-            onError={() => setFailed(true)}
-            style={{
-              width: "100%",
-              height: "100%",
-              display: "block",
-              objectFit,
-            }}
-          />
-        ) : children as ReactNode}
-      </div>
-    );
-  },
-  SpinnerMark: ({ color, ...props }) => (
-    <span
-      {...cleanDomProps(props)}
-      aria-hidden="true"
-      style={{
-        color,
-        display: "inline-block",
-        width: "1ch",
-        animation: "gloom-spin 0.9s steps(8) infinite",
-        ...(props.style as CSSProperties | undefined),
-      }}
-    >
-      *
-    </span>
-  ),
-  AsciiText: WebAsciiText,
-};
+        *
+      </span>
+    ),
+    AsciiText: WebAsciiText,
+  };
+}
+
+export const webUiHost: UiHost = createWebUiHost();
 
 export const webRendererHost: RendererHost = {
   supportsNativeDesktopNotifications: true,

package/src/version.ts

@@ -1 +1 @@
-export const VERSION = "0.9.1";
+export const VERSION = "0.9.2";