@book.dev/ui 1.60.0 → 1.64.0

package/dist/{EmojiGrid-xK5mPJPo.js → EmojiGrid-THzuvC4K.js}

@@ -1,18 +1,9 @@
-import { J as e, Mt as t, i as n, n as r, t as i } from "./lucideIcons-B6pmC-WQ.js";
-import { useMemo as a, useRef as o, useState as s } from "react";
-import { Fragment as c, jsx as l, jsxs as u } from "react/jsx-runtime";
-import { search as d } from "node-emoji";
-//#region src/lib/emoji.ts
-function f(e, t = 8) {
-	let n = e.trim().toLowerCase();
-	return n ? d(n).slice().sort((e, t) => p(e.name, n) - p(t.name, n)).slice(0, t) : [];
-}
-function p(e, t) {
-	return e === t ? 0 : e.startsWith(t) ? 1 : 2;
-}
-//#endregion
+import { Mt as e, U as t, i as n, n as r, t as i } from "./lucideIcons-Dv5yzk2L.js";
+import { t as a } from "./emoji-Bmft6RPl.js";
+import { useMemo as o, useRef as s, useState as c } from "react";
+import { Fragment as l, jsx as u, jsxs as d } from "react/jsx-runtime";
 //#region src/lib/emojiData.ts
-var m = [
+var f = [
 	{
 		id: "smileys",
 		icon: "😀",
@@ -54,152 +45,152 @@ var m = [
 		emojis: /* @__PURE__ */ "❤️.🧡.💛.💚.💙.💜.🖤.🤍.🤎.💔.❣️.💕.💞.💓.💗.💖.💘.💝.💟.☮️.✝️.☪️.🕉️.☸️.✡️.🔯.🕎.☯️.☦️.⛎.♈.♉.♊.♋.♌.♍.♎.♏.♐.♑.♒.♓.🆔.⚛️.🉑.☢️.☣️.📴.✅.❌.❎.➕.➖.➗.✖️.♾️.‼️.⁉️.❓.❔.❕.❗.〰️.⚠️.🚸.🔱.⚜️.🔰.♻️.✳️.❇️.⭐.🌟.💫.⭕.🔴.🟠.🟡.🟢.🔵.🟣.🟤.⚫.⚪.🔺.🔻.🔸.🔹.🔶.🔷.🔳.🔲.▪️.▫️.◼️.◻️.🏁.🚩.🎌.🏴.🏳️.🏳️‍🌈.🔔.🔕.🎵.🎶.💬.💭".split(".")
 	}
 ];
-Array.from(new Set(m.flatMap((e) => e.emojis)));
+Array.from(new Set(f.flatMap((e) => e.emojis)));
 //#endregion
 //#region src/lib/iconRecents.ts
-var h = "openbook.iconRecents", g = 24;
-function _() {
+var p = "openbook.iconRecents", m = 24;
+function h() {
 	if (typeof localStorage > "u") return [];
 	try {
-		let e = localStorage.getItem(h), t = e ? JSON.parse(e) : [];
-		return Array.isArray(t) ? t.filter((e) => typeof e == "string").slice(0, g) : [];
+		let e = localStorage.getItem(p), t = e ? JSON.parse(e) : [];
+		return Array.isArray(t) ? t.filter((e) => typeof e == "string").slice(0, m) : [];
 	} catch {
 		return [];
 	}
 }
-function v(e) {
+function g(e) {
 	if (!(typeof localStorage > "u" || !e)) try {
-		let t = [e, ..._().filter((t) => t !== e)].slice(0, g);
-		localStorage.setItem(h, JSON.stringify(t));
+		let t = [e, ...h().filter((t) => t !== e)].slice(0, m);
+		localStorage.setItem(p, JSON.stringify(t));
 	} catch {}
 }
 //#endregion
 //#region src/components/EmojiGrid.tsx
-function y({ value: t, onPick: n }) {
-	let { t: r } = e(), [i, a] = s(t?.startsWith("lucide:") ? "icon" : "emoji"), [c, d] = s(""), f = o(_()).current;
-	return /* @__PURE__ */ u("div", {
+function _({ value: e, onPick: n }) {
+	let { t: r } = t(), [i, a] = c(e?.startsWith("lucide:") ? "icon" : "emoji"), [o, l] = c(""), f = s(h()).current;
+	return /* @__PURE__ */ d("div", {
 		className: "flex h-[372px] w-[332px] flex-col bg-popover text-popover-foreground",
 		children: [
-			/* @__PURE__ */ u("div", {
+			/* @__PURE__ */ d("div", {
 				className: "flex items-center gap-1 p-2 pb-1.5",
-				children: [/* @__PURE__ */ l(b, {
+				children: [/* @__PURE__ */ u(v, {
 					active: i === "emoji",
 					onClick: () => a("emoji"),
 					label: r("emoji.tabEmoji")
-				}), /* @__PURE__ */ l(b, {
+				}), /* @__PURE__ */ u(v, {
 					active: i === "icon",
 					onClick: () => a("icon"),
 					label: r("emoji.tabIcons")
 				})]
 			}),
-			/* @__PURE__ */ l("div", {
+			/* @__PURE__ */ u("div", {
 				className: "px-2 pb-2",
-				children: /* @__PURE__ */ l("input", {
+				children: /* @__PURE__ */ u("input", {
 					autoFocus: !0,
-					value: c,
-					onChange: (e) => d(e.target.value),
+					value: o,
+					onChange: (e) => l(e.target.value),
 					placeholder: r(i === "emoji" ? "emoji.searchEmoji" : "emoji.searchIcons"),
 					className: "h-8 w-full rounded-md border border-input bg-background px-2.5 text-sm outline-hidden placeholder:text-muted-foreground focus-visible:ring-2 focus-visible:ring-ring",
 					"aria-label": r("emoji.search")
 				})
 			}),
-			/* @__PURE__ */ l("div", {
+			/* @__PURE__ */ u("div", {
 				className: "min-h-0 flex-1 overflow-y-auto px-2 pb-2",
-				children: l(i === "emoji" ? w : E, {
-					query: c,
+				children: u(i === "emoji" ? S : w, {
+					query: o,
 					recents: f,
-					current: t,
+					current: e,
 					onPick: (e) => {
-						v(e), n(e);
+						g(e), n(e);
 					}
 				})
 			})
 		]
 	});
 }
-function b({ active: e, onClick: n, label: r }) {
-	return /* @__PURE__ */ l("button", {
+function v({ active: t, onClick: n, label: r }) {
+	return /* @__PURE__ */ u("button", {
 		type: "button",
 		onClick: n,
-		className: t("flex-1 cursor-pointer rounded-md px-2.5 py-1 text-sm font-medium transition-colors", e ? "bg-accent text-accent-foreground" : "text-muted-foreground hover:bg-hover"),
+		className: e("flex-1 cursor-pointer rounded-md px-2.5 py-1 text-sm font-medium transition-colors", t ? "bg-accent text-accent-foreground" : "text-muted-foreground hover:bg-hover"),
 		children: r
 	});
 }
-function x({ children: e }) {
-	return /* @__PURE__ */ l("div", {
+function y({ children: e }) {
+	return /* @__PURE__ */ u("div", {
 		className: "sticky top-0 z-10 bg-popover px-1 pb-1 pt-1.5 text-xs font-medium uppercase tracking-wide text-muted-foreground/70",
 		children: e
 	});
 }
-var S = "grid grid-cols-8 gap-0.5";
-function C({ glyph: e, active: n, onPick: r }) {
-	return /* @__PURE__ */ l("button", {
+var b = "grid grid-cols-8 gap-0.5";
+function x({ glyph: t, active: n, onPick: r }) {
+	return /* @__PURE__ */ u("button", {
 		type: "button",
-		onClick: () => r(e),
-		className: t("flex h-9 w-9 items-center justify-center rounded-md text-[20px] leading-none transition-colors hover:bg-hover", n && "bg-accent ring-1 ring-primary"),
-		title: e,
-		children: e
+		onClick: () => r(t),
+		className: e("flex h-9 w-9 items-center justify-center rounded-md text-[20px] leading-none transition-colors hover:bg-hover", n && "bg-accent ring-1 ring-primary"),
+		title: t,
+		children: t
 	});
 }
-function w({ query: t, recents: r, current: i, onPick: o }) {
-	let { t: s } = e(), d = a(() => t.trim() ? f(t, 64).map((e) => e.emoji) : null, [t]), p = r.filter((e) => !e.startsWith(n));
-	return d ? d.length === 0 ? /* @__PURE__ */ l(D, { text: s("emoji.noResults") }) : /* @__PURE__ */ l("div", {
-		className: S,
-		children: d.map((e, t) => /* @__PURE__ */ l(C, {
+function S({ query: e, recents: r, current: i, onPick: s }) {
+	let { t: c } = t(), p = o(() => e.trim() ? a(e, 64).map((e) => e.emoji) : null, [e]), m = r.filter((e) => !e.startsWith(n));
+	return p ? p.length === 0 ? /* @__PURE__ */ u(T, { text: c("emoji.noResults") }) : /* @__PURE__ */ u("div", {
+		className: b,
+		children: p.map((e, t) => /* @__PURE__ */ u(x, {
 			glyph: e,
 			active: e === i,
-			onPick: o
+			onPick: s
 		}, `${e}-${t}`))
-	}) : /* @__PURE__ */ u(c, { children: [p.length > 0 && /* @__PURE__ */ u("section", { children: [/* @__PURE__ */ l(x, { children: s("emoji.recent") }), /* @__PURE__ */ l("div", {
-		className: S,
-		children: p.map((e, t) => /* @__PURE__ */ l(C, {
+	}) : /* @__PURE__ */ d(l, { children: [m.length > 0 && /* @__PURE__ */ d("section", { children: [/* @__PURE__ */ u(y, { children: c("emoji.recent") }), /* @__PURE__ */ u("div", {
+		className: b,
+		children: m.map((e, t) => /* @__PURE__ */ u(x, {
 			glyph: e,
 			active: e === i,
-			onPick: o
+			onPick: s
 		}, `r-${e}-${t}`))
-	})] }), m.map((e) => /* @__PURE__ */ u("section", { children: [/* @__PURE__ */ l(x, { children: s(`emoji.cat.${e.id}`) }), /* @__PURE__ */ l("div", {
-		className: S,
-		children: e.emojis.map((t, n) => /* @__PURE__ */ l(C, {
+	})] }), f.map((e) => /* @__PURE__ */ d("section", { children: [/* @__PURE__ */ u(y, { children: c(`emoji.cat.${e.id}`) }), /* @__PURE__ */ u("div", {
+		className: b,
+		children: e.emojis.map((t, n) => /* @__PURE__ */ u(x, {
 			glyph: t,
 			active: t === i,
-			onPick: o
+			onPick: s
 		}, `${e.id}-${t}-${n}`))
 	})] }, e.id))] });
 }
-function T({ name: e, active: r, onPick: a }) {
-	let o = i[e];
-	return o ? /* @__PURE__ */ l("button", {
+function C({ name: t, active: r, onPick: a }) {
+	let o = i[t];
+	return o ? /* @__PURE__ */ u("button", {
 		type: "button",
-		onClick: () => a(`${n}${e}`),
-		className: t("flex h-9 w-9 items-center justify-center rounded-md text-foreground transition-colors hover:bg-hover", r && "bg-accent ring-1 ring-primary"),
-		title: e,
-		"aria-label": e,
-		children: /* @__PURE__ */ l(o, { className: "h-[18px] w-[18px]" })
+		onClick: () => a(`${n}${t}`),
+		className: e("flex h-9 w-9 items-center justify-center rounded-md text-foreground transition-colors hover:bg-hover", r && "bg-accent ring-1 ring-primary"),
+		title: t,
+		"aria-label": t,
+		children: /* @__PURE__ */ u(o, { className: "h-[18px] w-[18px]" })
 	}) : null;
 }
-function E({ query: t, recents: o, current: s, onPick: d }) {
-	let { t: f } = e(), p = t.trim().toLowerCase(), m = a(() => p ? r.filter((e) => e.toLowerCase().includes(p)) : r, [p]), h = s?.startsWith("lucide:") ? s.slice(n.length) : void 0, g = o.filter((e) => e.startsWith(n)).map((e) => e.slice(n.length)).filter((e) => i[e]);
-	return m.length === 0 ? /* @__PURE__ */ l(D, { text: f("emoji.noResults") }) : /* @__PURE__ */ u(c, { children: [!p && g.length > 0 && /* @__PURE__ */ u("section", { children: [/* @__PURE__ */ l(x, { children: f("emoji.recent") }), /* @__PURE__ */ l("div", {
-		className: S,
-		children: g.map((e, t) => /* @__PURE__ */ l(T, {
+function w({ query: e, recents: a, current: s, onPick: c }) {
+	let { t: f } = t(), p = e.trim().toLowerCase(), m = o(() => p ? r.filter((e) => e.toLowerCase().includes(p)) : r, [p]), h = s?.startsWith("lucide:") ? s.slice(n.length) : void 0, g = a.filter((e) => e.startsWith(n)).map((e) => e.slice(n.length)).filter((e) => i[e]);
+	return m.length === 0 ? /* @__PURE__ */ u(T, { text: f("emoji.noResults") }) : /* @__PURE__ */ d(l, { children: [!p && g.length > 0 && /* @__PURE__ */ d("section", { children: [/* @__PURE__ */ u(y, { children: f("emoji.recent") }), /* @__PURE__ */ u("div", {
+		className: b,
+		children: g.map((e, t) => /* @__PURE__ */ u(C, {
 			name: e,
 			active: e === h,
-			onPick: d
+			onPick: c
 		}, `r-${e}-${t}`))
-	})] }), /* @__PURE__ */ u("section", { children: [!p && /* @__PURE__ */ l(x, { children: f("emoji.tabIcons") }), /* @__PURE__ */ l("div", {
-		className: S,
-		children: m.map((e) => /* @__PURE__ */ l(T, {
+	})] }), /* @__PURE__ */ d("section", { children: [!p && /* @__PURE__ */ u(y, { children: f("emoji.tabIcons") }), /* @__PURE__ */ u("div", {
+		className: b,
+		children: m.map((e) => /* @__PURE__ */ u(C, {
 			name: e,
 			active: e === h,
-			onPick: d
+			onPick: c
 		}, e))
 	})] })] });
 }
-function D({ text: e }) {
-	return /* @__PURE__ */ l("div", {
+function T({ text: e }) {
+	return /* @__PURE__ */ u("div", {
 		className: "flex h-24 items-center justify-center text-sm text-muted-foreground",
 		children: e
 	});
 }
 //#endregion
-export { y as default };
+export { _ as default };

package/dist/blockeditor/BlockEditor.d.ts

@@ -14,6 +14,7 @@ import type { InlineAttrs } from './model';
 export interface EditorUI {
     slash: SlashState;
     mention: SlashState;
+    emoji: SlashState;
     spellcheck: boolean;
     openSlash(blockId: string, anchorOffset: number): void;
     updateSlash(caret: number): void;
@@ -23,8 +24,19 @@ export interface EditorUI {
     updateMention(caret: number): void;
     closeMention(): void;
     mentionKey(key: string): void;
+    openEmoji(blockId: string, anchorOffset: number): void;
+    updateEmoji(caret: number): void;
+    closeEmoji(): void;
+    emojiKey(key: string): void;
     toggleFormat(key: keyof InlineAttrs, value?: string): void;
     scheduleToolbar(): void;
+    /** Leave the editor for the page title above (↑/←/Backspace at the very top). */
+    leaveToTitle?(): void;
+}
+/** Imperative handle the host uses to hand the caret into the editor. */
+export interface BlockEditorHandle {
+    /** Focus the first text block at its start, creating a paragraph if empty. */
+    focusStart(): void;
 }
 export type DropRegion = 'above' | 'below' | 'left' | 'right';
 interface DragState {
@@ -47,6 +59,10 @@ export declare const BlockEditor: React.FC<{
     spellcheck?: boolean;
     /** The page hosting this editor — powers the "New page/database" commands. */
     pageId?: string;
+    /** Imperative handle so the title can hand the caret to the first block. */
+    focusRef?: React.Ref<BlockEditorHandle>;
+    /** Leave the editor for the title above (caret at the top of the document). */
+    onLeaveToTitle?: () => void;
 }>;
 export interface RowShared {
     editor: BlockEditorController;

package/dist/blockeditor/EmojiMenu.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+import type { SlashState } from './SlashMenu';
+import type { BlockEditorController } from './useBlockEditor';
+/**
+ * The ":" emoji menu: like the slash and mention menus but for emoji. Trigger
+ * detection, query tracking and key forwarding mirror those menus; this only
+ * differs in its items (offline `searchEmojis`) and how a pick is inserted —
+ * the typed ":query" is removed and the chosen glyph dropped in its place.
+ */
+export declare const EmojiMenu: React.FC<{
+    state: SlashState;
+    editor: BlockEditorController;
+    anchorEl: HTMLElement | null;
+    onClose: () => void;
+    /** Insert the chosen glyph (plain text) at the offset where ":" was typed. */
+    onInsertText: (blockId: string, anchorOffset: number, text: string) => void;
+}>;

package/dist/blockeditor/__tests__/EmojiMenu.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/blockeditor/__tests__/readOnly.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/blockeditor/__tests__/titleHandoff.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/blockeditor/__tests__/triggerMenus.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/blockeditor/kit/KitFrame.d.ts

@@ -44,6 +44,11 @@ export declare const ConfigToggle: React.FC<{
  * so it looks like the text it replaces; falls back to a static span when the
  * editor is read-only (or the block's group is locked). `stopPropagation` keeps
  * keystrokes out of the surrounding block editor's shortcuts.
+ *
+ * On a read-only page the widget's *control* revives (interactive exemption)
+ * with a `liveEditor`, so `readOnly` arrives `false` here — but the label is
+ * chrome, not a control, and must stay frozen. {@link useKitPageLock} re-freezes
+ * it independently of the control's editor.
  */
 export declare const KitInlineText: React.FC<{
     value: string;

package/dist/blockeditor/kit/lock.d.ts

@@ -10,3 +10,17 @@ export interface KitLockState {
 export declare const KitLockContext: import("react").Context<KitLockState>;
 /** Whether the nearest enclosing group is locked. */
 export declare const useKitLock: () => boolean;
+/**
+ * Whether the whole page is read-only (a viewer who can't write). Set ONCE at
+ * the editor root and never re-provided by groups, so it survives nesting —
+ * unlike {@link KitLockContext}, which a locked group flips on for its subtree.
+ *
+ * Interactive widgets revive under a page lock (their control gets a `liveEditor`
+ * with `readOnly:false`), which would otherwise make their kit chrome — the
+ * inline label / description — editable again. The {@link KitInlineText} chrome
+ * consults this so the control stays live while the label/config text stays
+ * frozen for the reader.
+ */
+export declare const KitPageLockContext: import("react").Context<boolean>;
+/** Whether the whole page is read-only (viewer / can't-write). */
+export declare const useKitPageLock: () => boolean;

package/dist/components/LastEditedBy.d.ts

@@ -0,0 +1,11 @@
+/**
+ * A subtle "Edited by X · 2h" indicator in the page header cluster (OB-165),
+ * read from the change provenance log so the *who* and *when* of the last edit
+ * are visible, not just stored. Renders nothing when the server has no edit log
+ * (an older build) or the page has no recorded edits yet. Refreshes when the
+ * page is saved so it reflects the latest editor (including you).
+ */
+export declare function LastEditedBy({ pageId }: {
+    pageId: string;
+}): import("react/jsx-runtime").JSX.Element | null;
+export default LastEditedBy;

package/dist/components/OnboardingNudge.d.ts

@@ -0,0 +1,11 @@
+/**
+ * A tasteful, dismissible "sign up free to publish" prompt for the genuinely
+ * unauthenticated user — the on-ramp from local-first into a first publish
+ * (OB-206). It sits at the foot of the sidebar and only ever appears when no
+ * account is connected; signing in (or dismissing it) retires it for good. We
+ * never force it: local-first stays the default, this is just the door.
+ *
+ * The CTA opens Settings → Account, where the actual sign-in / add-account flow
+ * lives, rather than firing the OAuth popup straight from the sidebar.
+ */
+export default function OnboardingNudge(): import("react/jsx-runtime").JSX.Element | null;

package/dist/components/ShareDialog.d.ts

@@ -0,0 +1,25 @@
+import { type InstanceInfo } from '@book.dev/sdk';
+/**
+ * Does this principal manage sharing instance-wide? The loopback owner, an
+ * instance admin, and the claimed owner all do; on a still-unclaimed instance the
+ * legacy guest gate governs (anyone who may write). This is the coarse gate for
+ * the Share *entry point* — the per-page routes still enforce write server-side,
+ * and the dialog degrades to an error state if a specific page load is refused.
+ */
+export declare function canManageSharing(info: InstanceInfo): boolean;
+/**
+ * Whether the current user may manage page sharing (gates the Share control).
+ * `null` while the one-shot `/api/instance` lookup is in flight; `false` if the
+ * server predates multi-user (no endpoint) so the control simply stays hidden.
+ */
+export declare function useCanManageSharing(): boolean | null;
+/**
+ * The per-page Share dialog (OB-203). The page owner / admin sets the page's
+ * audience-scope visibility and grants individual people read/edit access by
+ * email or handle, all against the OB-191 per-page API (`setPageVisibility`,
+ * `sharePage`/`listPageAcl`/`unsharePage`). Rendered from the page-actions
+ * cluster; only mounted when {@link useCanManageSharing} clears the user.
+ */
+export default function ShareDialog({ pageId }: {
+    pageId: string;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/components/__tests__/lastEditedBy.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/__tests__/membersSettings.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/__tests__/sharingSettings.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/settings/AccountSettings.d.ts

@@ -2,5 +2,9 @@
  * Account & sync: connect this device to account.book.pub (the deep-link OAuth
  * flow) and mirror preferences + the workspace list there. The data server is
  * untouched — only settings sync through the account service.
+ *
+ * With no account connected this is the sign-in surface; once at least one is
+ * connected it hands off to {@link AccountSwitcher} — the multi-account list
+ * (switch / add / remove / sign out) introduced in OB-206.
  */
 export default function AccountSettings(): import("react/jsx-runtime").JSX.Element;

package/dist/components/settings/AccountSwitcher.d.ts

@@ -0,0 +1,12 @@
+/**
+ * The multi-account switcher (OB-206): lists every connected account, marks the
+ * active one with a live status, and lets the user switch between them, add
+ * another, remove one, or sign the active one out — all over the `useAccount()`
+ * actions (the provider owns the logic; this is the surface). The single active
+ * account's sync details and dashboard link sit below the list.
+ *
+ * Per Devon's OB-194 note the dormant accounts read as "Signed in" (available),
+ * never "syncing": only the active account talks to the server, so only it shows
+ * a live status.
+ */
+export default function AccountSwitcher(): import("react/jsx-runtime").JSX.Element;

package/dist/components/settings/MembersSettings.d.ts

@@ -0,0 +1 @@
+export default function MembersSettings(): import("react/jsx-runtime").JSX.Element;

package/dist/components/settings/SharingSettings.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Multi-user access policy (OB-165): who can read/edit this shared workspace
+ * without signing in, plus who the server currently sees *you* as. Reads the
+ * instance policy from the data server and lets the owner change the guest gate.
+ *
+ * Hidden when the server doesn't expose `/api/instance` (an older build), so it
+ * degrades cleanly against a server that predates multi-user support.
+ */
+export declare function SharingSection(): import("react/jsx-runtime").JSX.Element | null;

package/dist/emoji-Bmft6RPl.js

@@ -0,0 +1,11 @@
+import { search as e } from "node-emoji";
+//#region src/lib/emoji.ts
+function t(t, r = 8) {
+	let i = t.trim().toLowerCase();
+	return i ? e(i).slice().sort((e, t) => n(e.name, i) - n(t.name, i)).slice(0, r) : [];
+}
+function n(e, t) {
+	return e === t ? 0 : e.startsWith(t) ? 1 : 2;
+}
+//#endregion
+export { t };