alinea 2.0.0-preview.2 → 2.0.0-preview.4

package/dist/dashboard/app/editor/MediaAltField.view.js

@@ -1,7 +1,7 @@
 import {
-  useAtomValue
-} from "../../../chunks/chunk-U4VOHNR2.js";
-import "../../../chunks/chunk-Y7XOMJOC.js";
+  useAtomValueRaw
+} from "../../../chunks/chunk-D6UJHBJJ.js";
+import "../../../chunks/chunk-CFNRVI3Y.js";
 import "../../../chunks/chunk-CQ52GEHY.js";
 
 // src/dashboard/app/editor/MediaAltField.view.tsx
@@ -21,7 +21,7 @@ import { useState } from "react";
 import { jsx } from "react/jsx-runtime";
 function MediaAltFieldView({ field }) {
   const { entry } = useEntryAtoms();
-  const i18n = useAtomValue(entry.mediaI18n);
+  const i18n = useAtomValueRaw(entry.mediaI18n);
   const [value, setValue] = useField(field);
   const options = useFieldOptions(field);
   const error = useFieldError(field);

package/dist/dashboard/app/modals/CreateEntry.js

@@ -1,10 +1,10 @@
 import {
-  useAtomValue,
+  useAtomValueRaw,
   useSetAtom
-} from "../../../chunks/chunk-U4VOHNR2.js";
+} from "../../../chunks/chunk-D6UJHBJJ.js";
 import {
   atom
-} from "../../../chunks/chunk-Y7XOMJOC.js";
+} from "../../../chunks/chunk-CFNRVI3Y.js";
 import {
   dist_default
 } from "../../../chunks/chunk-I4OYYAX5.js";
@@ -47,14 +47,14 @@ import {
 
 // src/dashboard/app/modals/CreateEntry.module.css
 var CreateEntry_default = {
+  "CreateEntry-message": "alinea-CreateEntry-message",
+  "CreateEntryMessage": "alinea-CreateEntry-message",
   "CreateEntry-parentRow": "alinea-CreateEntry-parentRow",
   "CreateEntryParentRow": "alinea-CreateEntry-parentRow",
-  "CreateEntry-insertOrder": "alinea-CreateEntry-insertOrder",
-  "CreateEntryInsertOrder": "alinea-CreateEntry-insertOrder",
   "CreateEntry-parentField": "alinea-CreateEntry-parentField",
   "CreateEntryParentField": "alinea-CreateEntry-parentField",
-  "CreateEntry-message": "alinea-CreateEntry-message",
-  "CreateEntryMessage": "alinea-CreateEntry-message"
+  "CreateEntry-insertOrder": "alinea-CreateEntry-insertOrder",
+  "CreateEntryInsertOrder": "alinea-CreateEntry-insertOrder"
 };
 
 // src/dashboard/app/modals/CreateEntry.tsx
@@ -102,12 +102,12 @@ function CreateEntryForm() {
   const modal = useDashboardModal();
   const { page, root } = useDashboardContext();
   const createEntry = useSetAtom(createEntryAtom);
-  const config = useAtomValue(configAtom).schema;
-  const policy = useAtomValue(policyAtom);
+  const config = useAtomValueRaw(configAtom).schema;
+  const policy = useAtomValueRaw(policyAtom);
   const { locale } = page;
   const tree = root.tree(locale);
-  const selectedItem = useAtomValue(tree.selectedItem);
-  const rootData = useAtomValue(root.data);
+  const selectedItem = useAtomValueRaw(tree.selectedItem);
+  const rootData = useAtomValueRaw(root.data);
   const initialParentId = useMemo(() => {
     if (!page.entry || !selectedItem) return void 0;
     const type = config[selectedItem.type];
@@ -134,7 +134,7 @@ function CreateEntryForm() {
       initialParentId ? entryReference(initialParentId, "parent") : null
     );
   }, [containerTypes, initialParentId, root.key, root.workspace]);
-  const parentValue = useAtomValue(parent.value);
+  const parentValue = useAtomValueRaw(parent.value);
   const parentId = entryIdOf(parentValue);
   const parentItemAtom = useMemo(
     () => atom((get) => {
@@ -143,7 +143,7 @@ function CreateEntryForm() {
     }),
     [parent.value, tree]
   );
-  const parentItem = useAtomValue(parentItemAtom);
+  const parentItem = useAtomValueRaw(parentItemAtom);
   const parentType = parentItem ? config[parentItem.type] : void 0;
   const allowed = parentType ? Schema.contained(config, Type.contains(parentType)) : Schema.contained(config, rootData.contains ?? []);
   const parentIds = parentItem ? [parentItem.id, ...parentItem.parents] : [];
@@ -166,7 +166,7 @@ function CreateEntryForm() {
     });
     return createLinkEditor("copyFrom", field);
   }, [root.key, root.workspace, selectedType]);
-  const copyFromValue = useAtomValue(copyFrom.value);
+  const copyFromValue = useAtomValueRaw(copyFrom.value);
   const copyFromId = entryIdOf(copyFromValue);
   const showInsertOrder = parentType ? Type.insertOrder(parentType) === "free" : true;
   async function onSubmit(event) {

package/dist/dashboard/app/pages/EntryPage.js

@@ -1,9 +1,9 @@
 import {
   useAtom,
-  useAtomValue,
+  useAtomValueRaw,
   useSetAtom
-} from "../../../chunks/chunk-U4VOHNR2.js";
-import "../../../chunks/chunk-Y7XOMJOC.js";
+} from "../../../chunks/chunk-D6UJHBJJ.js";
+import "../../../chunks/chunk-CFNRVI3Y.js";
 import {
   styler
 } from "../../../chunks/chunk-I4OYYAX5.js";
@@ -26,7 +26,7 @@ import {
   routeGuardAtom
 } from "alinea/dashboard/atoms/nav";
 import { rootAtoms } from "alinea/dashboard/atoms/root";
-import { useEffect, useLayoutEffect, useRef, useTransition } from "react";
+import { useEffect, useLayoutEffect, useRef } from "react";
 import { EntryScope } from "../../hooks.js";
 import {
   IcBaselineErrorOutline,
@@ -56,31 +56,31 @@ import { Rail, RailBody, RailContent } from "./../ui/Rail.js";
 
 // src/dashboard/app/pages/EntryPage.module.css
 var EntryPage_default = {
-  "EntryEditor-fields": "alinea-EntryEditor-fields",
-  "EntryEditorFields": "alinea-EntryEditor-fields",
-  "EntryEditor-title": "alinea-EntryEditor-title",
-  "EntryEditorTitle": "alinea-EntryEditor-title",
+  "MissingEntry-icon": "alinea-MissingEntry-icon",
+  "MissingEntryIcon": "alinea-MissingEntry-icon",
+  "MissingEntry-title": "alinea-MissingEntry-title",
+  "MissingEntryTitle": "alinea-MissingEntry-title",
+  "MissingEntry-id": "alinea-MissingEntry-id",
+  "MissingEntryId": "alinea-MissingEntry-id",
+  "MissingEntry-message": "alinea-MissingEntry-message",
+  "MissingEntryMessage": "alinea-MissingEntry-message",
   "EntryEditor-toolbar": "alinea-EntryEditor-toolbar",
   "EntryEditorToolbar": "alinea-EntryEditor-toolbar",
   "EntryOverview-mobileActions": "alinea-EntryOverview-mobileActions",
   "EntryOverviewMobileActions": "alinea-EntryOverview-mobileActions",
-  "EntryEditor-header": "alinea-EntryEditor-header",
-  "EntryEditorHeader": "alinea-EntryEditor-header",
+  "EntryEditor-title": "alinea-EntryEditor-title",
+  "EntryEditorTitle": "alinea-EntryEditor-title",
+  "EntryEditor-fields": "alinea-EntryEditor-fields",
+  "EntryEditorFields": "alinea-EntryEditor-fields",
   "MissingEntry-card": "alinea-MissingEntry-card",
   "MissingEntryCard": "alinea-MissingEntry-card",
-  "MissingEntry": "alinea-MissingEntry",
   "EntryEditor-body": "alinea-EntryEditor-body",
   "EntryEditorBody": "alinea-EntryEditor-body",
-  "MissingEntry-icon": "alinea-MissingEntry-icon",
-  "MissingEntryIcon": "alinea-MissingEntry-icon",
-  "MissingEntry-title": "alinea-MissingEntry-title",
-  "MissingEntryTitle": "alinea-MissingEntry-title",
-  "MissingEntry-message": "alinea-MissingEntry-message",
-  "MissingEntryMessage": "alinea-MissingEntry-message",
-  "MissingEntry-id": "alinea-MissingEntry-id",
-  "MissingEntryId": "alinea-MissingEntry-id",
   "EntryEditor-banner": "alinea-EntryEditor-banner",
-  "EntryEditorBanner": "alinea-EntryEditor-banner"
+  "EntryEditorBanner": "alinea-EntryEditor-banner",
+  "MissingEntry": "alinea-MissingEntry",
+  "EntryEditor-header": "alinea-EntryEditor-header",
+  "EntryEditorHeader": "alinea-EntryEditor-header"
 };
 
 // src/dashboard/app/pages/EntryPage.tsx
@@ -136,7 +136,7 @@ var entryPage = page(async (page2, get) => {
 });
 function MissingEntry({ page: page2 }) {
   assert(page2.workspace && page2.root && page2.entry);
-  const root = useAtomValue(rootAtoms(page2.workspace, page2.root).data);
+  const root = useAtomValueRaw(rootAtoms(page2.workspace, page2.root).data);
   const setRoute = useSetAtom(routeAtom);
   return /* @__PURE__ */ jsx(
     NotFoundPanel,
@@ -176,10 +176,9 @@ function NotFoundPanel({
   ] }) }) });
 }
 function EntryViewToggle({ entry, page: page2 }) {
-  const entryView = useAtomValue(entry.view);
+  const entryView = useAtomValueRaw(entry.view);
   const view = page2.view ?? entryView;
   const setRoute = useSetAtom(routeAtom);
-  const [isPending, startTransition] = useTransition();
   const nextView = view === "overview" ? "edit" : "overview";
   const label = nextView === "overview" ? "Show overview" : "Edit entry";
   const tooltip = nextView === "overview" ? "Overview view" : "Edit view";
@@ -190,7 +189,6 @@ function EntryViewToggle({ entry, page: page2 }) {
       "aria-label": label,
       appearance: "plain",
       icon: ViewIcon,
-      isDisabled: isPending,
       size: "icon",
       onPress: () => setRoute({
         workspace: page2.workspace,
@@ -245,12 +243,12 @@ function EntryEditorContent({
   sourceLocale,
   node
 }) {
-  const typeName = useAtomValue(entry.type);
-  const type = useAtomValue(typeAtoms(typeName));
-  const hasChildren = useAtomValue(entry.hasChildren);
-  const defaultView = useAtomValue(entry.view);
-  const sourceLocales = useAtomValue(entry.translationSourceLocales);
-  const parentPaths = useAtomValue(entry.parentPaths);
+  const typeName = useAtomValueRaw(entry.type);
+  const type = useAtomValueRaw(typeAtoms(typeName));
+  const hasChildren = useAtomValueRaw(entry.hasChildren);
+  const defaultView = useAtomValueRaw(entry.view);
+  const sourceLocales = useAtomValueRaw(entry.translationSourceLocales);
+  const parentPaths = useAtomValueRaw(entry.parentPaths);
   const View = type.customView;
   const { locale } = page2;
   const isUntranslated = selectedEntry.locale !== locale;

package/dist/dashboard/app/pages/RootPage.js

@@ -1,8 +1,8 @@
 import {
-  useAtomValue,
+  useAtomValueRaw,
   useSetAtom
-} from "../../../chunks/chunk-U4VOHNR2.js";
-import "../../../chunks/chunk-Y7XOMJOC.js";
+} from "../../../chunks/chunk-D6UJHBJJ.js";
+import "../../../chunks/chunk-CFNRVI3Y.js";
 import {
   styler
 } from "../../../chunks/chunk-I4OYYAX5.js";
@@ -66,7 +66,7 @@ function RootBrowser({ page: page2, root }) {
   ) });
 }
 function MissingRoot({ page: page2, requestedRoot, root }) {
-  const label = useAtomValue(root.label);
+  const label = useAtomValueRaw(root.label);
   const setRoute = useSetAtom(routeAtom);
   return /* @__PURE__ */ jsx(
     NotFoundPanel,

package/dist/dashboard/app/pages/SplashPage.d.ts

@@ -0,0 +1,3 @@
+import { type Getter } from 'jotai';
+import type { ReactNode } from 'react';
+export declare function splashPage(get: Getter): Promise<ReactNode>;

package/dist/dashboard/app/pages/SplashPage.js

@@ -0,0 +1,414 @@
+import {
+  useSetAtom
+} from "../../../chunks/chunk-D6UJHBJJ.js";
+import "../../../chunks/chunk-CFNRVI3Y.js";
+import {
+  styler
+} from "../../../chunks/chunk-I4OYYAX5.js";
+import "../../../chunks/chunk-CQ52GEHY.js";
+
+// src/dashboard/app/pages/SplashPage.tsx
+import { Button, Icon, Menu, MenuItem, Surface } from "alinea/components";
+import { Entry } from "alinea/core/Entry";
+import { timestampFromId } from "alinea/core/Id";
+import { getRoot, getType } from "alinea/core/Internal";
+import { configAtom, graphAtom } from "alinea/dashboard/atoms/core";
+import { shaAtom } from "alinea/dashboard/atoms/graph";
+import { routeAtom } from "alinea/dashboard/atoms/nav";
+import { rootAtoms } from "alinea/dashboard/atoms/root";
+import { workspaceAtom, workspacesAtom } from "alinea/dashboard/atoms/config";
+import { canManageMembersAtom, policyAtom } from "alinea/dashboard/atoms/user";
+import { useUser } from "alinea/dashboard/hooks";
+import {
+  IcBaselineAccountCircle,
+  IcOutlineSettings,
+  IcRoundSearch,
+  LucideFile
+} from "../../icons.js";
+import { AppearanceToggle } from "../AppearanceToggle.js";
+import { GlobalSearch, WorkspaceAvatar } from "../WorkspaceMenu.js";
+
+// src/dashboard/app/pages/SplashPage.module.css
+var SplashPage_default = {
+  "SplashPage-appearance": "alinea-SplashPage-appearance",
+  "SplashPageAppearance": "alinea-SplashPage-appearance",
+  "SplashPage": "alinea-SplashPage",
+  "SplashPage-card-header-title": "alinea-SplashPage-card-header-title",
+  "SplashPageCardHeaderTitle": "alinea-SplashPage-card-header-title",
+  "SplashPage-entries": "alinea-SplashPage-entries",
+  "SplashPageEntries": "alinea-SplashPage-entries",
+  "SplashPage-root-menuIcon": "alinea-SplashPage-root-menuIcon",
+  "SplashPageRootMenuIcon": "alinea-SplashPage-root-menuIcon",
+  "SplashPage-card-header": "alinea-SplashPage-card-header",
+  "SplashPageCardHeader": "alinea-SplashPage-card-header",
+  "SplashPage-search-label": "alinea-SplashPage-search-label",
+  "SplashPageSearchLabel": "alinea-SplashPage-search-label",
+  "SplashPage-sidebar": "alinea-SplashPage-sidebar",
+  "SplashPageSidebar": "alinea-SplashPage-sidebar",
+  "SplashPage-entry-visual-icon": "alinea-SplashPage-entry-visual-icon",
+  "SplashPageEntryVisualIcon": "alinea-SplashPage-entry-visual-icon",
+  "SplashPage-card-header-content": "alinea-SplashPage-card-header-content",
+  "SplashPageCardHeaderContent": "alinea-SplashPage-card-header-content",
+  "SplashPage-entry-user": "alinea-SplashPage-entry-user",
+  "SplashPageEntryUser": "alinea-SplashPage-entry-user",
+  "SplashPage-grid": "alinea-SplashPage-grid",
+  "SplashPageGrid": "alinea-SplashPage-grid",
+  "SplashPage-entry": "alinea-SplashPage-entry",
+  "SplashPageEntry": "alinea-SplashPage-entry",
+  "SplashPage-entry-content": "alinea-SplashPage-entry-content",
+  "SplashPageEntryContent": "alinea-SplashPage-entry-content",
+  "SplashPage-entry-visual": "alinea-SplashPage-entry-visual",
+  "SplashPageEntryVisual": "alinea-SplashPage-entry-visual",
+  "SplashPage-root": "alinea-SplashPage-root",
+  "SplashPageRoot": "alinea-SplashPage-root",
+  "SplashPage-user": "alinea-SplashPage-user",
+  "SplashPageUser": "alinea-SplashPage-user",
+  "SplashPage-content": "alinea-SplashPage-content",
+  "SplashPageContent": "alinea-SplashPage-content",
+  "SplashPage-card-header-button": "alinea-SplashPage-card-header-button",
+  "SplashPageCardHeaderButton": "alinea-SplashPage-card-header-button",
+  "SplashPage-card-header-label": "alinea-SplashPage-card-header-label",
+  "SplashPageCardHeaderLabel": "alinea-SplashPage-card-header-label",
+  "SplashPage-card-footer": "alinea-SplashPage-card-footer",
+  "SplashPageCardFooter": "alinea-SplashPage-card-footer",
+  "SplashPage-actionIcon": "alinea-SplashPage-actionIcon",
+  "SplashPageActionIcon": "alinea-SplashPage-actionIcon",
+  "SplashPage-card": "alinea-SplashPage-card",
+  "SplashPageCard": "alinea-SplashPage-card",
+  "SplashPage-entry-meta": "alinea-SplashPage-entry-meta",
+  "SplashPageEntryMeta": "alinea-SplashPage-entry-meta",
+  "SplashPage-entry-title": "alinea-SplashPage-entry-title",
+  "SplashPageEntryTitle": "alinea-SplashPage-entry-title",
+  "SplashPage-entry-primary": "alinea-SplashPage-entry-primary",
+  "SplashPageEntryPrimary": "alinea-SplashPage-entry-primary",
+  "SplashPage-appearance-label": "alinea-SplashPage-appearance-label",
+  "SplashPageAppearanceLabel": "alinea-SplashPage-appearance-label",
+  "SplashPage-entry-time": "alinea-SplashPage-entry-time",
+  "SplashPageEntryTime": "alinea-SplashPage-entry-time",
+  "SplashPage-action": "alinea-SplashPage-action",
+  "SplashPageAction": "alinea-SplashPage-action",
+  "SplashPage-sidebar-content": "alinea-SplashPage-sidebar-content",
+  "SplashPageSidebarContent": "alinea-SplashPage-sidebar-content",
+  "SplashPage-user-label": "alinea-SplashPage-user-label",
+  "SplashPageUserLabel": "alinea-SplashPage-user-label"
+};
+
+// src/dashboard/app/pages/SplashPage.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+var styles = styler(SplashPage_default);
+var recentEntryCount = 3;
+var recentCandidateWindowSize = recentEntryCount;
+var visibleRootCount = 2;
+var futureTimestampTolerance = 24 * 60 * 60 * 1e3;
+var relativeTimeFormatter = new Intl.RelativeTimeFormat(void 0, {
+  numeric: "auto",
+  style: "narrow"
+});
+var shortDateFormatter = new Intl.DateTimeFormat(void 0, {
+  day: "numeric",
+  month: "short"
+});
+var changedAtFormatter = new Intl.DateTimeFormat(void 0, {
+  dateStyle: "medium",
+  timeStyle: "short"
+});
+async function splashPage(get) {
+  const canManageMembers = await get(canManageMembersAtom);
+  await get(shaAtom);
+  const graph = get(graphAtom);
+  const config = get(configAtom);
+  const policy = get(policyAtom);
+  const summaries = await Promise.all(
+    get(workspacesAtom).map(async (key) => {
+      const workspace = get(workspaceAtom(key));
+      const roots = Object.entries(workspace.roots).flatMap(
+        ([rootKey, root]) => {
+          if (!policy.canRead({ workspace: key, root: rootKey })) return [];
+          const { icon, label } = getRoot(root);
+          return [{ icon: icon ?? LucideFile, key: rootKey, label }];
+        }
+      );
+      const candidates = await Promise.all(
+        roots.flatMap(({ key: root }) => [
+          graph.find({
+            workspace: key,
+            root,
+            status: "preferDraft",
+            groupBy: Entry.id,
+            orderBy: { desc: Entry.updatedAt },
+            take: recentCandidateWindowSize,
+            select: recentEntrySelection
+          }),
+          graph.find({
+            workspace: key,
+            root,
+            status: "preferDraft",
+            groupBy: Entry.id,
+            orderBy: { desc: Entry.id, caseSensitive: true },
+            take: recentCandidateWindowSize,
+            select: recentEntrySelection
+          })
+        ])
+      );
+      const readableCandidates = candidates.flat().filter((entry) => policy.canRead(entry));
+      const now = Date.now();
+      const trustsIdTimestamps = readableCandidates.every((entry) => {
+        const timestamp = timestampFromId(entry.id);
+        return timestamp === void 0 || timestamp <= now + futureTimestampTolerance;
+      });
+      const recentEntries = Array.from(
+        new Map(
+          readableCandidates.map((entry) => [
+            entry.id,
+            toRecentEntry(entry, trustsIdTimestamps)
+          ])
+        ).values()
+      ).filter((entry) => Boolean(entry)).sort((a, b) => b.changedAt - a.changedAt).slice(0, recentEntryCount);
+      const entries = recentEntries.map((entry) => {
+        const type = config.schema[entry.type];
+        return {
+          ...entry,
+          icon: type ? getType(type).icon ?? LucideFile : LucideFile
+        };
+      });
+      return {
+        entries,
+        key,
+        openRoute: { workspace: key, root: roots[0]?.key },
+        roots,
+        workspace
+      };
+    })
+  );
+  const searchLocation = summaries.flatMap(
+    (summary) => summary.roots.map((root) => ({ root: root.key, workspace: summary.key }))
+  ).at(0);
+  const searchRoot = searchLocation ? rootAtoms(searchLocation.workspace, searchLocation.root) : void 0;
+  return /* @__PURE__ */ jsx(
+    SplashPage,
+    {
+      canManageMembers,
+      searchRoot,
+      summaries
+    }
+  );
+}
+var recentEntrySelection = {
+  createdBy: Entry.createdBy,
+  id: Entry.id,
+  locale: Entry.locale,
+  root: Entry.root,
+  title: Entry.title,
+  type: Entry.type,
+  updatedAt: Entry.updatedAt,
+  updatedBy: Entry.updatedBy,
+  workspace: Entry.workspace
+};
+function toRecentEntry(entry, trustsIdTimestamps) {
+  const changedAt = typeof entry.updatedAt === "number" ? entry.updatedAt * 1e3 : trustsIdTimestamps ? timestampFromId(entry.id) : void 0;
+  if (changedAt === void 0) return void 0;
+  const auditUser = entry.updatedBy ?? entry.createdBy;
+  const actor = auditUser?.name || auditUser?.email || void 0;
+  return { ...entry, actor, changedAt };
+}
+function SplashPage({
+  canManageMembers,
+  searchRoot,
+  summaries
+}) {
+  const user = useUser();
+  const setRoute = useSetAtom(routeAtom);
+  const userName = user ? user.name ?? user.sub : void 0;
+  return /* @__PURE__ */ jsx("main", { className: styles.SplashPage(), children: /* @__PURE__ */ jsxs("div", { className: styles.SplashPage.content(), children: [
+    /* @__PURE__ */ jsx(
+      "aside",
+      {
+        "aria-label": "Dashboard tools",
+        className: styles.SplashPage.sidebar(),
+        children: /* @__PURE__ */ jsxs("div", { className: styles.SplashPage.sidebar.content(), children: [
+          userName && /* @__PURE__ */ jsxs("div", { className: styles.SplashPage.user(), children: [
+            /* @__PURE__ */ jsx(
+              Icon,
+              {
+                icon: IcBaselineAccountCircle,
+                className: styles.SplashPage.actionIcon()
+              }
+            ),
+            /* @__PURE__ */ jsx("span", { className: styles.SplashPage.user.label(), children: userName })
+          ] }),
+          searchRoot && /* @__PURE__ */ jsx(GlobalSearch, { initialSearchScope: "everything", root: searchRoot, children: /* @__PURE__ */ jsxs(
+            Button,
+            {
+              appearance: "plain",
+              className: styles.SplashPage.action(),
+              "aria-label": "Search content",
+              children: [
+                /* @__PURE__ */ jsx(
+                  Icon,
+                  {
+                    icon: IcRoundSearch,
+                    className: styles.SplashPage.actionIcon()
+                  }
+                ),
+                /* @__PURE__ */ jsx("span", { className: styles.SplashPage.search.label(), children: "Search content" })
+              ]
+            }
+          ) }),
+          canManageMembers && /* @__PURE__ */ jsxs(
+            Button,
+            {
+              appearance: "plain",
+              className: styles.SplashPage.action(),
+              onPress: () => setRoute({ page: "users" }),
+              children: [
+                /* @__PURE__ */ jsx(
+                  Icon,
+                  {
+                    icon: IcOutlineSettings,
+                    className: styles.SplashPage.actionIcon()
+                  }
+                ),
+                "Manage users"
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxs(
+            "div",
+            {
+              "aria-label": "Appearance",
+              className: styles.SplashPage.appearance(),
+              children: [
+                /* @__PURE__ */ jsx("span", { className: styles.SplashPage.appearance.label(), children: "Appearance" }),
+                /* @__PURE__ */ jsx(AppearanceToggle, {})
+              ]
+            }
+          )
+        ] })
+      }
+    ),
+    /* @__PURE__ */ jsx("div", { className: styles.SplashPage.grid(), children: summaries.map((summary) => /* @__PURE__ */ jsx(WorkspaceCard, { summary }, summary.key)) })
+  ] }) });
+}
+function WorkspaceCard({ summary }) {
+  const setRoute = useSetAtom(routeAtom);
+  const { entries, key, openRoute, roots, workspace } = summary;
+  const visibleRoots = roots.slice(0, visibleRootCount);
+  const remainingRoots = roots.slice(visibleRootCount);
+  function onCardClick(event) {
+    const target = event.target;
+    if (target instanceof Element && target.closest('a, button, [role="menuitem"]'))
+      return;
+    setRoute(openRoute);
+  }
+  return /* @__PURE__ */ jsxs(Surface, { className: styles.SplashPage.card(), onClick: onCardClick, children: [
+    /* @__PURE__ */ jsxs("header", { className: styles.SplashPage.card.header(), children: [
+      /* @__PURE__ */ jsx("h2", { className: styles.SplashPage.card.header.title(), children: /* @__PURE__ */ jsxs(
+        Button,
+        {
+          appearance: "plain",
+          className: styles.SplashPage.card.header.button(),
+          onPress: () => setRoute(openRoute),
+          children: [
+            /* @__PURE__ */ jsx(WorkspaceAvatar, { color: workspace.color, icon: workspace.icon }),
+            /* @__PURE__ */ jsx("span", { className: styles.SplashPage.card.header.content(), children: /* @__PURE__ */ jsx("span", { className: styles.SplashPage.card.header.label(), children: workspace.label }) })
+          ]
+        }
+      ) }),
+      /* @__PURE__ */ jsxs("div", { className: styles.SplashPage.card.footer(), children: [
+        visibleRoots.map((root) => /* @__PURE__ */ jsx(
+          Button,
+          {
+            appearance: "plain",
+            className: styles.SplashPage.root(),
+            icon: root.icon,
+            onPress: () => setRoute({ workspace: key, root: root.key }),
+            children: root.label
+          },
+          root.key
+        )),
+        remainingRoots.length > 0 && /* @__PURE__ */ jsx(
+          Menu,
+          {
+            "aria-label": `More roots in ${workspace.label}`,
+            onAction: (rootKey) => setRoute({ workspace: key, root: String(rootKey) }),
+            popoverProps: { placement: "bottom start" },
+            label: /* @__PURE__ */ jsxs(Button, { appearance: "plain", className: styles.SplashPage.root(), children: [
+              "+",
+              remainingRoots.length,
+              " more"
+            ] }),
+            children: remainingRoots.map((root) => /* @__PURE__ */ jsxs(MenuItem, { id: root.key, textValue: root.label, children: [
+              /* @__PURE__ */ jsx(
+                Icon,
+                {
+                  icon: root.icon,
+                  className: styles.SplashPage.root.menuIcon()
+                }
+              ),
+              root.label
+            ] }, root.key))
+          }
+        )
+      ] })
+    ] }),
+    entries.length > 0 && /* @__PURE__ */ jsx("div", { className: styles.SplashPage.entries(), children: entries.map((entry) => /* @__PURE__ */ jsx(
+      Button,
+      {
+        appearance: "plain",
+        className: styles.SplashPage.entry(),
+        onPress: () => setRoute({
+          workspace: entry.workspace,
+          root: entry.root,
+          entry: entry.id,
+          locale: entry.locale ?? void 0,
+          view: "edit"
+        }),
+        children: /* @__PURE__ */ jsxs("span", { className: styles.SplashPage.entry.content(), children: [
+          /* @__PURE__ */ jsxs("span", { className: styles.SplashPage.entry.primary(), children: [
+            /* @__PURE__ */ jsx("span", { className: styles.SplashPage.entry.visual(), children: /* @__PURE__ */ jsx(
+              Icon,
+              {
+                className: styles.SplashPage.entry.visual.icon(),
+                icon: entry.icon
+              }
+            ) }),
+            /* @__PURE__ */ jsx("span", { className: styles.SplashPage.entry.title(), children: /* @__PURE__ */ jsx("span", { title: entry.title, children: entry.title }) })
+          ] }),
+          /* @__PURE__ */ jsxs("span", { className: styles.SplashPage.entry.meta(), children: [
+            entry.actor && /* @__PURE__ */ jsx("span", { className: styles.SplashPage.entry.user(), children: entry.actor }),
+            entry.actor && /* @__PURE__ */ jsx("span", { "aria-hidden": "true", children: "\xB7" }),
+            /* @__PURE__ */ jsx(
+              "time",
+              {
+                className: styles.SplashPage.entry.time(),
+                dateTime: new Date(entry.changedAt).toISOString(),
+                title: formatChangedAt(entry.changedAt),
+                children: formatRelativeTime(entry.changedAt)
+              }
+            )
+          ] })
+        ] })
+      },
+      entry.id
+    )) })
+  ] });
+}
+function formatChangedAt(timestamp) {
+  return changedAtFormatter.format(timestamp);
+}
+function formatRelativeTime(timestamp) {
+  const seconds = Math.round((timestamp - Date.now()) / 1e3);
+  if (Math.abs(seconds) < 60)
+    return relativeTimeFormatter.format(seconds, "second");
+  const minutes = Math.round(seconds / 60);
+  if (Math.abs(minutes) < 60)
+    return relativeTimeFormatter.format(minutes, "minute");
+  const hours = Math.round(minutes / 60);
+  if (Math.abs(hours) < 24) return relativeTimeFormatter.format(hours, "hour");
+  const days = Math.round(hours / 24);
+  if (Math.abs(days) < 7) return relativeTimeFormatter.format(days, "day");
+  return shortDateFormatter.format(timestamp);
+}
+export {
+  splashPage
+};