@backmatter/studio 0.0.1

package/src/define.ts

@@ -0,0 +1,12 @@
+// packages/studio/src/define.ts
+// Light entry for `backmatter.studio.tsx` on a site: the definition helper and
+// its types, without pulling the Studio UI into that module.
+export {
+  defineStudio,
+  type StudioBlockConfig,
+  type StudioBlockPreviewProps,
+  type StudioDefinition,
+  type StudioFieldInput,
+  type StudioFieldInputProps,
+  type StudioMenuItem,
+} from "./define-studio";

package/src/index.css

@@ -0,0 +1,123 @@
+/* packages/studio/src/index.css */
+*,
+*::before,
+*::after {
+  box-sizing: border-box;
+}
+
+html,
+body,
+#root {
+  margin: 0;
+  min-height: 100dvh;
+}
+
+html {
+  background: #f7f7f8;
+  color-scheme: light;
+}
+
+html[data-theme="dark"] {
+  background: #18181b;
+  color-scheme: dark;
+}
+
+body {
+  -webkit-font-smoothing: antialiased;
+  font-family:
+    "Geist Sans",
+    Inter,
+    ui-sans-serif,
+    system-ui,
+    sans-serif;
+}
+
+button,
+input,
+textarea,
+select {
+  /* Don't use `font: inherit` — it overrides StyleX sizes in @layer. */
+  font-family: inherit;
+}
+
+button,
+[role="button"] {
+  cursor: default;
+}
+
+button:disabled,
+button[aria-disabled="true"] {
+  cursor: not-allowed;
+}
+
+[data-drag-handle] {
+  cursor: grab;
+}
+
+[data-drag-handle][data-dragging] {
+  cursor: grabbing;
+}
+
+a {
+  color: inherit;
+  text-decoration: none;
+  cursor: default;
+}
+
+a[href^="http"],
+a[href^="//"],
+a[target="_blank"] {
+  cursor: pointer;
+}
+
+:focus-visible {
+  outline: 2px solid #18181b;
+  outline-offset: 2px;
+}
+
+html[data-theme="dark"] :focus-visible {
+  outline-color: #fafafa;
+}
+
+/* Controls whose container already indicates focus (e.g. the chat composer). */
+[data-no-ring]:focus-visible {
+  outline: none;
+}
+
+/* Prose UI reads these on the rendered body. Match the app fonts. */
+.prose-ui {
+  --p-font-family: "Geist Sans", Inter, ui-sans-serif, system-ui, sans-serif;
+  --p-font-family-heading: "Geist Sans", Inter, ui-sans-serif, system-ui, sans-serif;
+  --p-font-family-mono: "Geist Mono", ui-monospace, SFMono-Regular, Menlo, Consolas,
+    monospace;
+  --p-body-font-family: "Geist Sans", Inter, ui-sans-serif, system-ui, sans-serif;
+  --p-h1-font-family: "Geist Sans", Inter, ui-sans-serif, system-ui, sans-serif;
+  --p-h2-font-family: "Geist Sans", Inter, ui-sans-serif, system-ui, sans-serif;
+  --p-h3-font-family: "Geist Sans", Inter, ui-sans-serif, system-ui, sans-serif;
+  --p-h4-font-family: "Geist Sans", Inter, ui-sans-serif, system-ui, sans-serif;
+  --p-h5-font-family: "Geist Sans", Inter, ui-sans-serif, system-ui, sans-serif;
+  --p-h6-font-family: "Geist Sans", Inter, ui-sans-serif, system-ui, sans-serif;
+}
+
+.prose-ui img {
+  max-width: 100%;
+  height: auto;
+}
+
+.prose-ui > :first-child {
+  margin-top: 0;
+}
+
+.prose-ui > :last-child {
+  margin-bottom: 0;
+}
+
+.prose-ui [data-body-block] :is(p, h1, h2, h3, h4, h5, h6, ul, ol, blockquote) {
+  margin-top: 0;
+  margin-bottom: 0;
+}
+
+.prose-ui [data-body-block] :focus,
+.prose-ui [data-body-block] :focus-visible {
+  outline: none;
+}

package/src/index.ts

@@ -0,0 +1,19 @@
+// packages/studio/src/index.ts
+// Public surface for a Studio mounted on a customer site.
+export { SiteStudio, configureSiteStudio, bounceToEnter, type SiteStudioProps } from "./site";
+export {
+  defineStudio,
+  type StudioBlockConfig,
+  type StudioBlockPreviewProps,
+  type StudioDefinition,
+  type StudioFieldInput,
+  type StudioFieldInputProps,
+  type StudioMenuItem,
+} from "./define-studio";
+export {
+  configureStudio,
+  studioConfig,
+  apiUrl,
+  type StudioConfig,
+  type StudioCredentials,
+} from "./studio-config";

package/src/last-user.ts

@@ -0,0 +1,40 @@
+// packages/studio/src/last-user.ts
+import type { KeyValueStore } from "./last-workspace";
+
+export const LAST_USER_KEY = "backmatter-last-user";
+
+export type LastUser = { id: string; email: string };
+
+export function rememberLastUser(
+  user: LastUser,
+  storage: KeyValueStore = localStorage,
+) {
+  if (!user.id) return;
+  try {
+    storage.setItem(LAST_USER_KEY, JSON.stringify(user));
+  } catch {
+    // ignore quota / private mode
+  }
+}
+
+export function readLastUser(
+  storage: KeyValueStore = localStorage,
+): LastUser | null {
+  try {
+    const raw = storage.getItem(LAST_USER_KEY);
+    if (!raw) return null;
+    const parsed = JSON.parse(raw) as Partial<LastUser>;
+    if (!parsed || typeof parsed.id !== "string" || !parsed.id) return null;
+    return { id: parsed.id, email: typeof parsed.email === "string" ? parsed.email : "" };
+  } catch {
+    return null;
+  }
+}
+
+export function forgetLastUser(storage: KeyValueStore = localStorage) {
+  try {
+    storage.removeItem(LAST_USER_KEY);
+  } catch {
+    // ignore
+  }
+}

package/src/last-workspace.ts

@@ -0,0 +1,57 @@
+// packages/studio/src/last-workspace.ts
+export type KeyValueStore = {
+  getItem(key: string): string | null;
+  setItem(key: string, value: string): void;
+  removeItem(key: string): void;
+};
+
+export function lastWorkspaceKey(userId: string) {
+  return `backmatter-last-workspace:${userId}`;
+}
+
+export function rememberLastWorkspace(
+  userId: string,
+  workspaceId: string,
+  storage: KeyValueStore = localStorage,
+) {
+  if (!userId || !workspaceId) return;
+  try {
+    storage.setItem(lastWorkspaceKey(userId), workspaceId);
+  } catch {
+    // ignore quota / private mode
+  }
+}
+
+export function readLastWorkspace(
+  userId: string,
+  storage: KeyValueStore = localStorage,
+): string | null {
+  if (!userId) return null;
+  try {
+    const value = storage.getItem(lastWorkspaceKey(userId));
+    return value || null;
+  } catch {
+    return null;
+  }
+}
+
+export function forgetLastWorkspace(
+  userId: string,
+  storage: KeyValueStore = localStorage,
+) {
+  if (!userId) return;
+  try {
+    storage.removeItem(lastWorkspaceKey(userId));
+  } catch {
+    // ignore quota / private mode
+  }
+}
+
+export function resumePath(
+  workspaceId: string | null,
+  accessible: Array<{ id: string; slug: string }>,
+): string {
+  const match = accessible.find((workspace) => workspace.id === workspaceId);
+  if (match) return `/${match.slug}`;
+  return "/workspaces";
+}