sanity-context 0.1.0

package/dist/index.cjs

@@ -0,0 +1,226 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: !0 });
+var sanity = require("sanity"), jsxRuntime = require("react/jsx-runtime"), react = require("react"), ui = require("@sanity/ui"), icons = require("@sanity/icons");
+const DEFAULT_STORAGE_KEY = "sanity-context";
+let _definitions = [], _storageKey = DEFAULT_STORAGE_KEY, _state = {}, _resolver = null;
+const _listeners = /* @__PURE__ */ new Set();
+function defaultState(definitions) {
+  return Object.fromEntries(definitions.map((d) => [d.id, { enabled: !1, value: d.defaultValue }]));
+}
+function loadFromStorage(definitions) {
+  if (typeof window > "u") return defaultState(definitions);
+  try {
+    const raw = localStorage.getItem(_storageKey);
+    if (!raw) return defaultState(definitions);
+    const saved = JSON.parse(raw);
+    return Object.fromEntries(
+      definitions.map((d) => [
+        d.id,
+        {
+          enabled: !!saved[d.id]?.enabled,
+          value: d.options.find((o) => o.value === saved[d.id]?.value)?.value ?? d.defaultValue
+        }
+      ])
+    );
+  } catch {
+    return defaultState(definitions);
+  }
+}
+function persist() {
+  typeof window < "u" && localStorage.setItem(_storageKey, JSON.stringify(_state));
+}
+function notify() {
+  _listeners.forEach((fn) => fn());
+}
+function initContextStore(definitions, storageKey) {
+  _definitions = definitions, _storageKey = storageKey ?? DEFAULT_STORAGE_KEY, _state = loadFromStorage(definitions), notify();
+}
+function setContextsResolver(resolver, storageKey) {
+  _resolver = resolver, _storageKey = storageKey ?? DEFAULT_STORAGE_KEY;
+}
+function resolveContexts(ctx) {
+  _resolver && initContextStore(_resolver(ctx), _storageKey);
+}
+function getContextDefinitions() {
+  return _definitions;
+}
+function getContext() {
+  return _state;
+}
+function setContextEntry(id, patch) {
+  _state[id] && (_state = { ..._state, [id]: { ..._state[id], ...patch } }, persist(), notify());
+}
+function subscribeToContext(listener) {
+  return _listeners.add(listener), () => {
+    _listeners.delete(listener);
+  };
+}
+const ContextIcon = react.forwardRef(
+  function(_props, _ref) {
+    return /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "18", height: "18", viewBox: "0 0 128 128", xmlns: "http://www.w3.org/2000/svg", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("defs", { children: /* @__PURE__ */ jsxRuntime.jsxs("linearGradient", { id: "g", x1: "0", y1: "0", x2: "1", y2: "0", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("stop", { offset: "0%", "stop-color": "#6366F1" }),
+        /* @__PURE__ */ jsxRuntime.jsx("stop", { offset: "100%", "stop-color": "#06B6D4" })
+      ] }) }),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "rect",
+        {
+          x: "16",
+          y: "20",
+          width: "32",
+          height: "88",
+          rx: "8",
+          fill: "none",
+          stroke: "#6366F1",
+          "stroke-width": "6"
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "rect",
+        {
+          x: "80",
+          y: "20",
+          width: "32",
+          height: "88",
+          rx: "8",
+          fill: "none",
+          stroke: "#06B6D4",
+          "stroke-width": "6"
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "path",
+        {
+          d: "M48 64 C60 40, 68 88, 80 64",
+          fill: "none",
+          stroke: "url(#g)",
+          "stroke-width": "6",
+          "stroke-linecap": "round"
+        }
+      )
+    ] });
+  }
+);
+function ContextItem({ id, label, enabled, onToggle, children }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { align: "center", justify: "space-between", gap: 4, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(
+      ui.Flex,
+      {
+        align: "center",
+        gap: 2,
+        as: "label",
+        htmlFor: id,
+        style: { cursor: "pointer", flexShrink: 0 },
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            ui.Switch,
+            {
+              id,
+              checked: enabled,
+              onChange: (e) => onToggle(e.currentTarget.checked)
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { size: 1, children: label })
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(ui.Box, { style: { width: 150, opacity: enabled ? 1 : 0.35, pointerEvents: enabled ? "auto" : "none" }, children })
+  ] });
+}
+function useContextState() {
+  return react.useSyncExternalStore(subscribeToContext, getContext, getContext);
+}
+function ContextPopover() {
+  const [open, setOpen] = react.useState(!1), definitions = getContextDefinitions(), state = useContextState(), triggerRef = react.useRef(null), cardRef = react.useRef(null), [coords, setCoords] = react.useState({ top: 0, right: 0 }), hasActive = Object.values(state).some((e) => e.enabled);
+  return react.useLayoutEffect(() => {
+    if (!open || !triggerRef.current) return;
+    const rect = triggerRef.current.getBoundingClientRect();
+    setCoords({ top: rect.bottom + 4, right: window.innerWidth - rect.right });
+  }, [open]), react.useEffect(() => {
+    if (!open) return;
+    const handler = (e) => {
+      const target = e.target;
+      triggerRef.current?.contains(target) || cardRef.current?.contains(target) || target.closest?.("[data-context-ui]") || setOpen(!1);
+    };
+    return document.addEventListener("mousedown", handler), () => document.removeEventListener("mousedown", handler);
+  }, [open]), /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { ref: triggerRef, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Tooltip, { content: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: 1, children: "Sanity context" }), placement: "bottom", portal: !0, children: /* @__PURE__ */ jsxRuntime.jsx(
+      ui.Button,
+      {
+        mode: "bleed",
+        icon: ContextIcon,
+        selected: open,
+        tone: hasActive ? "primary" : "default",
+        onClick: () => setOpen((v) => !v)
+      }
+    ) }) }),
+    open && /* @__PURE__ */ jsxRuntime.jsx(ui.Portal, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Layer, { children: /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        ref: cardRef,
+        style: { position: "fixed", top: coords.top, right: coords.right },
+        children: /* @__PURE__ */ jsxRuntime.jsx(ui.Card, { "data-context-ui": !0, padding: 3, shadow: 2, style: { minWidth: 260 }, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Stack, { space: 3, children: definitions.map((def) => {
+          const entry = state[def.id], currentTitle = def.options.find((o) => o.value === entry?.value)?.title ?? def.options[0]?.title;
+          return /* @__PURE__ */ jsxRuntime.jsx(
+            ContextItem,
+            {
+              id: `sanity-context-${def.id}`,
+              label: def.title,
+              enabled: entry?.enabled ?? !1,
+              onToggle: (enabled) => setContextEntry(def.id, { enabled }),
+              children: /* @__PURE__ */ jsxRuntime.jsx(
+                ui.MenuButton,
+                {
+                  button: /* @__PURE__ */ jsxRuntime.jsx(
+                    ui.Button,
+                    {
+                      text: currentTitle,
+                      fontSize: 1,
+                      padding: 2,
+                      mode: "ghost",
+                      style: { width: "100%" }
+                    }
+                  ),
+                  id: `sanity-context-menu-${def.id}`,
+                  menu: /* @__PURE__ */ jsxRuntime.jsx(ui.Menu, { "data-context-ui": !0, children: def.options.map((opt) => /* @__PURE__ */ jsxRuntime.jsx(
+                    ui.MenuItem,
+                    {
+                      text: opt.title,
+                      icon: entry?.value === opt.value ? icons.CheckmarkIcon : void 0,
+                      onClick: () => setContextEntry(def.id, { value: opt.value })
+                    },
+                    opt.value
+                  )) }),
+                  popover: { placement: "bottom-start" }
+                }
+              )
+            },
+            def.id
+          );
+        }) }) })
+      }
+    ) }) })
+  ] });
+}
+function ContextNavbar(props) {
+  const currentUser = sanity.useCurrentUser(), workspace = sanity.useWorkspace(), resolved = react.useRef(!1);
+  return react.useEffect(() => {
+    resolved.current || !currentUser || (resolveContexts({ currentUser, workspace }), resolved.current = !0);
+  }, [currentUser, workspace]), /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { style: { width: "100%" }, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(ui.Box, { flex: 1, style: { minWidth: 0 }, children: props.renderDefault(props) }),
+    /* @__PURE__ */ jsxRuntime.jsx(ui.Card, { borderBottom: !0, style: { display: "flex", alignItems: "center", paddingRight: 8 }, children: /* @__PURE__ */ jsxRuntime.jsx(ContextPopover, {}) })
+  ] });
+}
+function contextPlugin(config) {
+  return typeof config.contexts == "function" ? setContextsResolver(config.contexts, config.storageKey) : initContextStore(config.contexts, config.storageKey), sanity.definePlugin({
+    name: "sanity-context",
+    studio: {
+      components: { navbar: ContextNavbar }
+    }
+  })();
+}
+exports.ContextIcon = ContextIcon;
+exports.contextPlugin = contextPlugin;
+exports.getContext = getContext;
+exports.subscribeToContext = subscribeToContext;
+//# sourceMappingURL=index.cjs.map

package/dist/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":["../src/store.ts","../src/components/ContextIcon.tsx","../src/components/ContextItem.tsx","../src/components/ContextPopover.tsx","../src/components/ContextNavbar.tsx","../src/plugin.ts"],"sourcesContent":["import type {ContextDefinition, ContextEntry, ContextResolverContext, ContextsResolver, ContextState} from './types'\n\nconst DEFAULT_STORAGE_KEY = 'sanity-context'\n\nlet _definitions: ContextDefinition[] = []\nlet _storageKey = DEFAULT_STORAGE_KEY\nlet _state: ContextState = {}\nlet _resolver: ContextsResolver | null = null\nconst _listeners = new Set<() => void>()\n\nfunction defaultState(definitions: ContextDefinition[]): ContextState {\n  return Object.fromEntries(definitions.map((d) => [d.id, {enabled: false, value: d.defaultValue}]))\n}\n\nfunction loadFromStorage(definitions: ContextDefinition[]): ContextState {\n  if (typeof window === 'undefined') return defaultState(definitions)\n  try {\n    const raw = localStorage.getItem(_storageKey)\n    if (!raw) return defaultState(definitions)\n    const saved = JSON.parse(raw) as ContextState\n    return Object.fromEntries(\n      definitions.map((d) => [\n        d.id,\n        {\n          enabled: !!saved[d.id]?.enabled,\n          value: d.options.find((o) => o.value === saved[d.id]?.value)?.value ?? d.defaultValue,\n        },\n      ]),\n    )\n  } catch {\n    return defaultState(definitions)\n  }\n}\n\nfunction persist(): void {\n  if (typeof window !== 'undefined') {\n    localStorage.setItem(_storageKey, JSON.stringify(_state))\n  }\n}\n\nfunction notify(): void {\n  _listeners.forEach((fn) => fn())\n}\n\nexport function initContextStore(definitions: ContextDefinition[], storageKey?: string): void {\n  _definitions = definitions\n  _storageKey = storageKey ?? DEFAULT_STORAGE_KEY\n  _state = loadFromStorage(definitions)\n  notify()\n}\n\nexport function setContextsResolver(resolver: ContextsResolver, storageKey?: string): void {\n  _resolver = resolver\n  _storageKey = storageKey ?? DEFAULT_STORAGE_KEY\n}\n\nexport function resolveContexts(ctx: ContextResolverContext): void {\n  if (!_resolver) return\n  initContextStore(_resolver(ctx), _storageKey)\n}\n\nexport function getContextDefinitions(): ContextDefinition[] {\n  return _definitions\n}\n\n/** @public */\nexport function getContext(): ContextState {\n  return _state\n}\n\nexport function setContextEntry(id: string, patch: Partial<ContextEntry>): void {\n  if (!_state[id]) return\n  _state = {..._state, [id]: {..._state[id], ...patch}}\n  persist()\n  notify()\n}\n\n/** @public */\nexport function subscribeToContext(listener: () => void): () => void {\n  _listeners.add(listener)\n  return () => {\n    _listeners.delete(listener)\n  }\n}\n","import {forwardRef} from 'react'\n\n/** @public */\nexport const ContextIcon = forwardRef<SVGSVGElement, React.SVGProps<SVGSVGElement>>(\n  function ContextIcon(_props, _ref) {\n    return (\n      <svg width=\"18\" height=\"18\" viewBox=\"0 0 128 128\" xmlns=\"http://www.w3.org/2000/svg\">\n        <defs>\n          <linearGradient id=\"g\" x1=\"0\" y1=\"0\" x2=\"1\" y2=\"0\">\n            <stop offset=\"0%\" stop-color=\"#6366F1\" />\n            <stop offset=\"100%\" stop-color=\"#06B6D4\" />\n          </linearGradient>\n        </defs>\n\n        <rect\n          x=\"16\"\n          y=\"20\"\n          width=\"32\"\n          height=\"88\"\n          rx=\"8\"\n          fill=\"none\"\n          stroke=\"#6366F1\"\n          stroke-width=\"6\"\n        />\n        <rect\n          x=\"80\"\n          y=\"20\"\n          width=\"32\"\n          height=\"88\"\n          rx=\"8\"\n          fill=\"none\"\n          stroke=\"#06B6D4\"\n          stroke-width=\"6\"\n        />\n\n        <path\n          d=\"M48 64 C60 40, 68 88, 80 64\"\n          fill=\"none\"\n          stroke=\"url(#g)\"\n          stroke-width=\"6\"\n          stroke-linecap=\"round\"\n        />\n      </svg>\n    )\n  },\n)\n","import {Box, Flex, Label, Switch} from '@sanity/ui'\n\ninterface Props {\n  id: string\n  label: string\n  enabled: boolean\n  onToggle: (enabled: boolean) => void\n  children: React.ReactNode\n}\n\nexport function ContextItem({id, label, enabled, onToggle, children}: Props) {\n  return (\n    <Flex align=\"center\" justify=\"space-between\" gap={4}>\n      <Flex\n        align=\"center\"\n        gap={2}\n        as=\"label\"\n        htmlFor={id}\n        style={{cursor: 'pointer', flexShrink: 0}}\n      >\n        <Switch\n          id={id}\n          checked={enabled}\n          onChange={(e) => onToggle(e.currentTarget.checked)}\n        />\n        <Label size={1}>{label}</Label>\n      </Flex>\n      <Box style={{width: 150, opacity: enabled ? 1 : 0.35, pointerEvents: enabled ? 'auto' : 'none'}}>\n        {children}\n      </Box>\n    </Flex>\n  )\n}\n","import {useEffect, useLayoutEffect, useRef, useState, useSyncExternalStore} from 'react'\nimport {Button, Card, Layer, Menu, MenuButton, MenuItem, Portal, Stack, Text, Tooltip} from '@sanity/ui'\nimport {CheckmarkIcon} from '@sanity/icons'\nimport {ContextIcon} from './ContextIcon'\n\nimport {ContextItem} from './ContextItem'\nimport {getContext, getContextDefinitions, setContextEntry, subscribeToContext} from '../store'\n\nfunction useContextState() {\n  return useSyncExternalStore(subscribeToContext, getContext, getContext)\n}\n\nexport function ContextPopover() {\n  const [open, setOpen] = useState(false)\n  const definitions = getContextDefinitions()\n  const state = useContextState()\n  const triggerRef = useRef<HTMLDivElement>(null)\n  const cardRef = useRef<HTMLDivElement>(null)\n  const [coords, setCoords] = useState({top: 0, right: 0})\n\n  const hasActive = Object.values(state).some((e) => e.enabled)\n\n  useLayoutEffect(() => {\n    if (!open || !triggerRef.current) return\n    const rect = triggerRef.current.getBoundingClientRect()\n    setCoords({top: rect.bottom + 4, right: window.innerWidth - rect.right})\n  }, [open])\n\n  useEffect(() => {\n    if (!open) return\n    const handler = (e: MouseEvent) => {\n      const target = e.target as Element\n      if (triggerRef.current?.contains(target)) return\n      if (cardRef.current?.contains(target)) return\n      if (target.closest?.('[data-context-ui]')) return\n      setOpen(false)\n    }\n    document.addEventListener('mousedown', handler)\n    return () => document.removeEventListener('mousedown', handler)\n  }, [open])\n\n  return (\n    <>\n      <div ref={triggerRef}>\n        <Tooltip content={<Text size={1}>Sanity context</Text>} placement=\"bottom\" portal>\n          <Button\n            mode=\"bleed\"\n            icon={ContextIcon}\n            selected={open}\n            tone={hasActive ? 'primary' : 'default'}\n            onClick={() => setOpen((v) => !v)}\n          />\n        </Tooltip>\n      </div>\n      {open && (\n        <Portal>\n          <Layer>\n            <div\n              ref={cardRef}\n              style={{position: 'fixed', top: coords.top, right: coords.right}}\n            >\n              <Card data-context-ui padding={3} shadow={2} style={{minWidth: 260}}>\n                <Stack space={3}>\n                  {definitions.map((def) => {\n                    const entry = state[def.id]\n                    const currentTitle =\n                      def.options.find((o) => o.value === entry?.value)?.title ??\n                      def.options[0]?.title\n\n                    return (\n                      <ContextItem\n                        key={def.id}\n                        id={`sanity-context-${def.id}`}\n                        label={def.title}\n                        enabled={entry?.enabled ?? false}\n                        onToggle={(enabled) => setContextEntry(def.id, {enabled})}\n                      >\n                        <MenuButton\n                          button={\n                            <Button\n                              text={currentTitle}\n                              fontSize={1}\n                              padding={2}\n                              mode=\"ghost\"\n                              style={{width: '100%'}}\n                            />\n                          }\n                          id={`sanity-context-menu-${def.id}`}\n                          menu={\n                            <Menu data-context-ui>\n                              {def.options.map((opt) => (\n                                <MenuItem\n                                  key={opt.value}\n                                  text={opt.title}\n                                  icon={entry?.value === opt.value ? CheckmarkIcon : undefined}\n                                  onClick={() => setContextEntry(def.id, {value: opt.value})}\n                                />\n                              ))}\n                            </Menu>\n                          }\n                          popover={{placement: 'bottom-start'}}\n                        />\n                      </ContextItem>\n                    )\n                  })}\n                </Stack>\n              </Card>\n            </div>\n          </Layer>\n        </Portal>\n      )}\n    </>\n  )\n}\n","import {useEffect, useRef} from 'react'\nimport {type NavbarProps, useCurrentUser, useWorkspace} from 'sanity'\nimport {Box, Card, Flex} from '@sanity/ui'\nimport {resolveContexts} from '../store'\nimport {ContextPopover} from './ContextPopover'\n\nexport function ContextNavbar(props: NavbarProps) {\n  const currentUser = useCurrentUser()\n  const workspace = useWorkspace()\n  const resolved = useRef(false)\n\n  useEffect(() => {\n    if (resolved.current || !currentUser) return\n    resolveContexts({currentUser, workspace})\n    resolved.current = true\n  }, [currentUser, workspace])\n\n  return (\n    <Flex style={{width: '100%'}}>\n      <Box flex={1} style={{minWidth: 0}}>\n        {props.renderDefault(props)}\n      </Box>\n      <Card borderBottom style={{display: 'flex', alignItems: 'center', paddingRight: 8}}>\n        <ContextPopover />\n      </Card>\n    </Flex>\n  )\n}\n","import {definePlugin} from 'sanity'\nimport {initContextStore, setContextsResolver} from './store'\nimport {ContextNavbar} from './components/ContextNavbar'\nimport type {ContextPluginConfig} from './types'\n\n/** @public */\nexport function contextPlugin(config: ContextPluginConfig) {\n  if (typeof config.contexts === 'function') {\n    setContextsResolver(config.contexts, config.storageKey)\n  } else {\n    initContextStore(config.contexts, config.storageKey)\n  }\n\n  return definePlugin({\n    name: 'sanity-context',\n    studio: {\n      components: {navbar: ContextNavbar},\n    },\n  })()\n}\n"],"names":["forwardRef","jsxs","jsx","Flex","Switch","Label","Box","useSyncExternalStore","useState","useRef","useLayoutEffect","useEffect","Fragment","Tooltip","Text","Button","Portal","Layer","Card","Stack","MenuButton","Menu","MenuItem","CheckmarkIcon","useCurrentUser","useWorkspace","definePlugin"],"mappings":"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"}

package/dist/index.d.cts

@@ -0,0 +1,64 @@
+import type { CurrentUser } from "sanity";
+import { ForwardRefExoticComponent } from "react";
+import { PluginOptions } from "sanity";
+import { RefAttributes } from "react";
+import { SVGProps } from "react";
+import type { Workspace } from "sanity";
+
+/** @public */
+export declare interface ContextDefinition {
+  id: string;
+  title: string;
+  options: ContextOption[];
+  defaultValue: string;
+}
+
+/** @public */
+export declare interface ContextEntry {
+  enabled: boolean;
+  value: string;
+}
+
+/** @public */
+export declare const ContextIcon: ForwardRefExoticComponent<
+  Omit<SVGProps<SVGSVGElement>, "ref"> & RefAttributes<SVGSVGElement>
+>;
+
+/** @public */
+export declare interface ContextOption {
+  value: string;
+  title: string;
+}
+
+/** @public */
+export declare function contextPlugin(
+  config: ContextPluginConfig,
+): PluginOptions;
+
+/** @public */
+export declare interface ContextPluginConfig {
+  contexts: ContextDefinition[] | ContextsResolver;
+  storageKey?: string;
+}
+
+/** @public */
+export declare interface ContextResolverContext {
+  currentUser: CurrentUser | null;
+  workspace: Workspace;
+}
+
+/** @public */
+export declare type ContextsResolver = (
+  ctx: ContextResolverContext,
+) => ContextDefinition[];
+
+/** @public */
+export declare type ContextState = Record<string, ContextEntry>;
+
+/** @public */
+export declare function getContext(): ContextState;
+
+/** @public */
+export declare function subscribeToContext(listener: () => void): () => void;
+
+export {};

package/dist/index.d.ts

@@ -0,0 +1,64 @@
+import type { CurrentUser } from "sanity";
+import { ForwardRefExoticComponent } from "react";
+import { PluginOptions } from "sanity";
+import { RefAttributes } from "react";
+import { SVGProps } from "react";
+import type { Workspace } from "sanity";
+
+/** @public */
+export declare interface ContextDefinition {
+  id: string;
+  title: string;
+  options: ContextOption[];
+  defaultValue: string;
+}
+
+/** @public */
+export declare interface ContextEntry {
+  enabled: boolean;
+  value: string;
+}
+
+/** @public */
+export declare const ContextIcon: ForwardRefExoticComponent<
+  Omit<SVGProps<SVGSVGElement>, "ref"> & RefAttributes<SVGSVGElement>
+>;
+
+/** @public */
+export declare interface ContextOption {
+  value: string;
+  title: string;
+}
+
+/** @public */
+export declare function contextPlugin(
+  config: ContextPluginConfig,
+): PluginOptions;
+
+/** @public */
+export declare interface ContextPluginConfig {
+  contexts: ContextDefinition[] | ContextsResolver;
+  storageKey?: string;
+}
+
+/** @public */
+export declare interface ContextResolverContext {
+  currentUser: CurrentUser | null;
+  workspace: Workspace;
+}
+
+/** @public */
+export declare type ContextsResolver = (
+  ctx: ContextResolverContext,
+) => ContextDefinition[];
+
+/** @public */
+export declare type ContextState = Record<string, ContextEntry>;
+
+/** @public */
+export declare function getContext(): ContextState;
+
+/** @public */
+export declare function subscribeToContext(listener: () => void): () => void;
+
+export {};

package/dist/index.js

@@ -0,0 +1,230 @@
+import { useCurrentUser, useWorkspace, definePlugin } from "sanity";
+import { jsxs, jsx, Fragment } from "react/jsx-runtime";
+import { forwardRef, useState, useRef, useLayoutEffect, useEffect, useSyncExternalStore } from "react";
+import { Flex, Switch, Label, Box, Tooltip, Button, Text, Portal, Layer, Card, Stack, MenuButton, Menu, MenuItem } from "@sanity/ui";
+import { CheckmarkIcon } from "@sanity/icons";
+const DEFAULT_STORAGE_KEY = "sanity-context";
+let _definitions = [], _storageKey = DEFAULT_STORAGE_KEY, _state = {}, _resolver = null;
+const _listeners = /* @__PURE__ */ new Set();
+function defaultState(definitions) {
+  return Object.fromEntries(definitions.map((d) => [d.id, { enabled: !1, value: d.defaultValue }]));
+}
+function loadFromStorage(definitions) {
+  if (typeof window > "u") return defaultState(definitions);
+  try {
+    const raw = localStorage.getItem(_storageKey);
+    if (!raw) return defaultState(definitions);
+    const saved = JSON.parse(raw);
+    return Object.fromEntries(
+      definitions.map((d) => [
+        d.id,
+        {
+          enabled: !!saved[d.id]?.enabled,
+          value: d.options.find((o) => o.value === saved[d.id]?.value)?.value ?? d.defaultValue
+        }
+      ])
+    );
+  } catch {
+    return defaultState(definitions);
+  }
+}
+function persist() {
+  typeof window < "u" && localStorage.setItem(_storageKey, JSON.stringify(_state));
+}
+function notify() {
+  _listeners.forEach((fn) => fn());
+}
+function initContextStore(definitions, storageKey) {
+  _definitions = definitions, _storageKey = storageKey ?? DEFAULT_STORAGE_KEY, _state = loadFromStorage(definitions), notify();
+}
+function setContextsResolver(resolver, storageKey) {
+  _resolver = resolver, _storageKey = storageKey ?? DEFAULT_STORAGE_KEY;
+}
+function resolveContexts(ctx) {
+  _resolver && initContextStore(_resolver(ctx), _storageKey);
+}
+function getContextDefinitions() {
+  return _definitions;
+}
+function getContext() {
+  return _state;
+}
+function setContextEntry(id, patch) {
+  _state[id] && (_state = { ..._state, [id]: { ..._state[id], ...patch } }, persist(), notify());
+}
+function subscribeToContext(listener) {
+  return _listeners.add(listener), () => {
+    _listeners.delete(listener);
+  };
+}
+const ContextIcon = forwardRef(
+  function(_props, _ref) {
+    return /* @__PURE__ */ jsxs("svg", { width: "18", height: "18", viewBox: "0 0 128 128", xmlns: "http://www.w3.org/2000/svg", children: [
+      /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsxs("linearGradient", { id: "g", x1: "0", y1: "0", x2: "1", y2: "0", children: [
+        /* @__PURE__ */ jsx("stop", { offset: "0%", "stop-color": "#6366F1" }),
+        /* @__PURE__ */ jsx("stop", { offset: "100%", "stop-color": "#06B6D4" })
+      ] }) }),
+      /* @__PURE__ */ jsx(
+        "rect",
+        {
+          x: "16",
+          y: "20",
+          width: "32",
+          height: "88",
+          rx: "8",
+          fill: "none",
+          stroke: "#6366F1",
+          "stroke-width": "6"
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "rect",
+        {
+          x: "80",
+          y: "20",
+          width: "32",
+          height: "88",
+          rx: "8",
+          fill: "none",
+          stroke: "#06B6D4",
+          "stroke-width": "6"
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "path",
+        {
+          d: "M48 64 C60 40, 68 88, 80 64",
+          fill: "none",
+          stroke: "url(#g)",
+          "stroke-width": "6",
+          "stroke-linecap": "round"
+        }
+      )
+    ] });
+  }
+);
+function ContextItem({ id, label, enabled, onToggle, children }) {
+  return /* @__PURE__ */ jsxs(Flex, { align: "center", justify: "space-between", gap: 4, children: [
+    /* @__PURE__ */ jsxs(
+      Flex,
+      {
+        align: "center",
+        gap: 2,
+        as: "label",
+        htmlFor: id,
+        style: { cursor: "pointer", flexShrink: 0 },
+        children: [
+          /* @__PURE__ */ jsx(
+            Switch,
+            {
+              id,
+              checked: enabled,
+              onChange: (e) => onToggle(e.currentTarget.checked)
+            }
+          ),
+          /* @__PURE__ */ jsx(Label, { size: 1, children: label })
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsx(Box, { style: { width: 150, opacity: enabled ? 1 : 0.35, pointerEvents: enabled ? "auto" : "none" }, children })
+  ] });
+}
+function useContextState() {
+  return useSyncExternalStore(subscribeToContext, getContext, getContext);
+}
+function ContextPopover() {
+  const [open, setOpen] = useState(!1), definitions = getContextDefinitions(), state = useContextState(), triggerRef = useRef(null), cardRef = useRef(null), [coords, setCoords] = useState({ top: 0, right: 0 }), hasActive = Object.values(state).some((e) => e.enabled);
+  return useLayoutEffect(() => {
+    if (!open || !triggerRef.current) return;
+    const rect = triggerRef.current.getBoundingClientRect();
+    setCoords({ top: rect.bottom + 4, right: window.innerWidth - rect.right });
+  }, [open]), useEffect(() => {
+    if (!open) return;
+    const handler = (e) => {
+      const target = e.target;
+      triggerRef.current?.contains(target) || cardRef.current?.contains(target) || target.closest?.("[data-context-ui]") || setOpen(!1);
+    };
+    return document.addEventListener("mousedown", handler), () => document.removeEventListener("mousedown", handler);
+  }, [open]), /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("div", { ref: triggerRef, children: /* @__PURE__ */ jsx(Tooltip, { content: /* @__PURE__ */ jsx(Text, { size: 1, children: "Sanity context" }), placement: "bottom", portal: !0, children: /* @__PURE__ */ jsx(
+      Button,
+      {
+        mode: "bleed",
+        icon: ContextIcon,
+        selected: open,
+        tone: hasActive ? "primary" : "default",
+        onClick: () => setOpen((v) => !v)
+      }
+    ) }) }),
+    open && /* @__PURE__ */ jsx(Portal, { children: /* @__PURE__ */ jsx(Layer, { children: /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref: cardRef,
+        style: { position: "fixed", top: coords.top, right: coords.right },
+        children: /* @__PURE__ */ jsx(Card, { "data-context-ui": !0, padding: 3, shadow: 2, style: { minWidth: 260 }, children: /* @__PURE__ */ jsx(Stack, { space: 3, children: definitions.map((def) => {
+          const entry = state[def.id], currentTitle = def.options.find((o) => o.value === entry?.value)?.title ?? def.options[0]?.title;
+          return /* @__PURE__ */ jsx(
+            ContextItem,
+            {
+              id: `sanity-context-${def.id}`,
+              label: def.title,
+              enabled: entry?.enabled ?? !1,
+              onToggle: (enabled) => setContextEntry(def.id, { enabled }),
+              children: /* @__PURE__ */ jsx(
+                MenuButton,
+                {
+                  button: /* @__PURE__ */ jsx(
+                    Button,
+                    {
+                      text: currentTitle,
+                      fontSize: 1,
+                      padding: 2,
+                      mode: "ghost",
+                      style: { width: "100%" }
+                    }
+                  ),
+                  id: `sanity-context-menu-${def.id}`,
+                  menu: /* @__PURE__ */ jsx(Menu, { "data-context-ui": !0, children: def.options.map((opt) => /* @__PURE__ */ jsx(
+                    MenuItem,
+                    {
+                      text: opt.title,
+                      icon: entry?.value === opt.value ? CheckmarkIcon : void 0,
+                      onClick: () => setContextEntry(def.id, { value: opt.value })
+                    },
+                    opt.value
+                  )) }),
+                  popover: { placement: "bottom-start" }
+                }
+              )
+            },
+            def.id
+          );
+        }) }) })
+      }
+    ) }) })
+  ] });
+}
+function ContextNavbar(props) {
+  const currentUser = useCurrentUser(), workspace = useWorkspace(), resolved = useRef(!1);
+  return useEffect(() => {
+    resolved.current || !currentUser || (resolveContexts({ currentUser, workspace }), resolved.current = !0);
+  }, [currentUser, workspace]), /* @__PURE__ */ jsxs(Flex, { style: { width: "100%" }, children: [
+    /* @__PURE__ */ jsx(Box, { flex: 1, style: { minWidth: 0 }, children: props.renderDefault(props) }),
+    /* @__PURE__ */ jsx(Card, { borderBottom: !0, style: { display: "flex", alignItems: "center", paddingRight: 8 }, children: /* @__PURE__ */ jsx(ContextPopover, {}) })
+  ] });
+}
+function contextPlugin(config) {
+  return typeof config.contexts == "function" ? setContextsResolver(config.contexts, config.storageKey) : initContextStore(config.contexts, config.storageKey), definePlugin({
+    name: "sanity-context",
+    studio: {
+      components: { navbar: ContextNavbar }
+    }
+  })();
+}
+export {
+  ContextIcon,
+  contextPlugin,
+  getContext,
+  subscribeToContext
+};
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../src/store.ts","../src/components/ContextIcon.tsx","../src/components/ContextItem.tsx","../src/components/ContextPopover.tsx","../src/components/ContextNavbar.tsx","../src/plugin.ts"],"sourcesContent":["import type {ContextDefinition, ContextEntry, ContextResolverContext, ContextsResolver, ContextState} from './types'\n\nconst DEFAULT_STORAGE_KEY = 'sanity-context'\n\nlet _definitions: ContextDefinition[] = []\nlet _storageKey = DEFAULT_STORAGE_KEY\nlet _state: ContextState = {}\nlet _resolver: ContextsResolver | null = null\nconst _listeners = new Set<() => void>()\n\nfunction defaultState(definitions: ContextDefinition[]): ContextState {\n  return Object.fromEntries(definitions.map((d) => [d.id, {enabled: false, value: d.defaultValue}]))\n}\n\nfunction loadFromStorage(definitions: ContextDefinition[]): ContextState {\n  if (typeof window === 'undefined') return defaultState(definitions)\n  try {\n    const raw = localStorage.getItem(_storageKey)\n    if (!raw) return defaultState(definitions)\n    const saved = JSON.parse(raw) as ContextState\n    return Object.fromEntries(\n      definitions.map((d) => [\n        d.id,\n        {\n          enabled: !!saved[d.id]?.enabled,\n          value: d.options.find((o) => o.value === saved[d.id]?.value)?.value ?? d.defaultValue,\n        },\n      ]),\n    )\n  } catch {\n    return defaultState(definitions)\n  }\n}\n\nfunction persist(): void {\n  if (typeof window !== 'undefined') {\n    localStorage.setItem(_storageKey, JSON.stringify(_state))\n  }\n}\n\nfunction notify(): void {\n  _listeners.forEach((fn) => fn())\n}\n\nexport function initContextStore(definitions: ContextDefinition[], storageKey?: string): void {\n  _definitions = definitions\n  _storageKey = storageKey ?? DEFAULT_STORAGE_KEY\n  _state = loadFromStorage(definitions)\n  notify()\n}\n\nexport function setContextsResolver(resolver: ContextsResolver, storageKey?: string): void {\n  _resolver = resolver\n  _storageKey = storageKey ?? DEFAULT_STORAGE_KEY\n}\n\nexport function resolveContexts(ctx: ContextResolverContext): void {\n  if (!_resolver) return\n  initContextStore(_resolver(ctx), _storageKey)\n}\n\nexport function getContextDefinitions(): ContextDefinition[] {\n  return _definitions\n}\n\n/** @public */\nexport function getContext(): ContextState {\n  return _state\n}\n\nexport function setContextEntry(id: string, patch: Partial<ContextEntry>): void {\n  if (!_state[id]) return\n  _state = {..._state, [id]: {..._state[id], ...patch}}\n  persist()\n  notify()\n}\n\n/** @public */\nexport function subscribeToContext(listener: () => void): () => void {\n  _listeners.add(listener)\n  return () => {\n    _listeners.delete(listener)\n  }\n}\n","import {forwardRef} from 'react'\n\n/** @public */\nexport const ContextIcon = forwardRef<SVGSVGElement, React.SVGProps<SVGSVGElement>>(\n  function ContextIcon(_props, _ref) {\n    return (\n      <svg width=\"18\" height=\"18\" viewBox=\"0 0 128 128\" xmlns=\"http://www.w3.org/2000/svg\">\n        <defs>\n          <linearGradient id=\"g\" x1=\"0\" y1=\"0\" x2=\"1\" y2=\"0\">\n            <stop offset=\"0%\" stop-color=\"#6366F1\" />\n            <stop offset=\"100%\" stop-color=\"#06B6D4\" />\n          </linearGradient>\n        </defs>\n\n        <rect\n          x=\"16\"\n          y=\"20\"\n          width=\"32\"\n          height=\"88\"\n          rx=\"8\"\n          fill=\"none\"\n          stroke=\"#6366F1\"\n          stroke-width=\"6\"\n        />\n        <rect\n          x=\"80\"\n          y=\"20\"\n          width=\"32\"\n          height=\"88\"\n          rx=\"8\"\n          fill=\"none\"\n          stroke=\"#06B6D4\"\n          stroke-width=\"6\"\n        />\n\n        <path\n          d=\"M48 64 C60 40, 68 88, 80 64\"\n          fill=\"none\"\n          stroke=\"url(#g)\"\n          stroke-width=\"6\"\n          stroke-linecap=\"round\"\n        />\n      </svg>\n    )\n  },\n)\n","import {Box, Flex, Label, Switch} from '@sanity/ui'\n\ninterface Props {\n  id: string\n  label: string\n  enabled: boolean\n  onToggle: (enabled: boolean) => void\n  children: React.ReactNode\n}\n\nexport function ContextItem({id, label, enabled, onToggle, children}: Props) {\n  return (\n    <Flex align=\"center\" justify=\"space-between\" gap={4}>\n      <Flex\n        align=\"center\"\n        gap={2}\n        as=\"label\"\n        htmlFor={id}\n        style={{cursor: 'pointer', flexShrink: 0}}\n      >\n        <Switch\n          id={id}\n          checked={enabled}\n          onChange={(e) => onToggle(e.currentTarget.checked)}\n        />\n        <Label size={1}>{label}</Label>\n      </Flex>\n      <Box style={{width: 150, opacity: enabled ? 1 : 0.35, pointerEvents: enabled ? 'auto' : 'none'}}>\n        {children}\n      </Box>\n    </Flex>\n  )\n}\n","import {useEffect, useLayoutEffect, useRef, useState, useSyncExternalStore} from 'react'\nimport {Button, Card, Layer, Menu, MenuButton, MenuItem, Portal, Stack, Text, Tooltip} from '@sanity/ui'\nimport {CheckmarkIcon} from '@sanity/icons'\nimport {ContextIcon} from './ContextIcon'\n\nimport {ContextItem} from './ContextItem'\nimport {getContext, getContextDefinitions, setContextEntry, subscribeToContext} from '../store'\n\nfunction useContextState() {\n  return useSyncExternalStore(subscribeToContext, getContext, getContext)\n}\n\nexport function ContextPopover() {\n  const [open, setOpen] = useState(false)\n  const definitions = getContextDefinitions()\n  const state = useContextState()\n  const triggerRef = useRef<HTMLDivElement>(null)\n  const cardRef = useRef<HTMLDivElement>(null)\n  const [coords, setCoords] = useState({top: 0, right: 0})\n\n  const hasActive = Object.values(state).some((e) => e.enabled)\n\n  useLayoutEffect(() => {\n    if (!open || !triggerRef.current) return\n    const rect = triggerRef.current.getBoundingClientRect()\n    setCoords({top: rect.bottom + 4, right: window.innerWidth - rect.right})\n  }, [open])\n\n  useEffect(() => {\n    if (!open) return\n    const handler = (e: MouseEvent) => {\n      const target = e.target as Element\n      if (triggerRef.current?.contains(target)) return\n      if (cardRef.current?.contains(target)) return\n      if (target.closest?.('[data-context-ui]')) return\n      setOpen(false)\n    }\n    document.addEventListener('mousedown', handler)\n    return () => document.removeEventListener('mousedown', handler)\n  }, [open])\n\n  return (\n    <>\n      <div ref={triggerRef}>\n        <Tooltip content={<Text size={1}>Sanity context</Text>} placement=\"bottom\" portal>\n          <Button\n            mode=\"bleed\"\n            icon={ContextIcon}\n            selected={open}\n            tone={hasActive ? 'primary' : 'default'}\n            onClick={() => setOpen((v) => !v)}\n          />\n        </Tooltip>\n      </div>\n      {open && (\n        <Portal>\n          <Layer>\n            <div\n              ref={cardRef}\n              style={{position: 'fixed', top: coords.top, right: coords.right}}\n            >\n              <Card data-context-ui padding={3} shadow={2} style={{minWidth: 260}}>\n                <Stack space={3}>\n                  {definitions.map((def) => {\n                    const entry = state[def.id]\n                    const currentTitle =\n                      def.options.find((o) => o.value === entry?.value)?.title ??\n                      def.options[0]?.title\n\n                    return (\n                      <ContextItem\n                        key={def.id}\n                        id={`sanity-context-${def.id}`}\n                        label={def.title}\n                        enabled={entry?.enabled ?? false}\n                        onToggle={(enabled) => setContextEntry(def.id, {enabled})}\n                      >\n                        <MenuButton\n                          button={\n                            <Button\n                              text={currentTitle}\n                              fontSize={1}\n                              padding={2}\n                              mode=\"ghost\"\n                              style={{width: '100%'}}\n                            />\n                          }\n                          id={`sanity-context-menu-${def.id}`}\n                          menu={\n                            <Menu data-context-ui>\n                              {def.options.map((opt) => (\n                                <MenuItem\n                                  key={opt.value}\n                                  text={opt.title}\n                                  icon={entry?.value === opt.value ? CheckmarkIcon : undefined}\n                                  onClick={() => setContextEntry(def.id, {value: opt.value})}\n                                />\n                              ))}\n                            </Menu>\n                          }\n                          popover={{placement: 'bottom-start'}}\n                        />\n                      </ContextItem>\n                    )\n                  })}\n                </Stack>\n              </Card>\n            </div>\n          </Layer>\n        </Portal>\n      )}\n    </>\n  )\n}\n","import {useEffect, useRef} from 'react'\nimport {type NavbarProps, useCurrentUser, useWorkspace} from 'sanity'\nimport {Box, Card, Flex} from '@sanity/ui'\nimport {resolveContexts} from '../store'\nimport {ContextPopover} from './ContextPopover'\n\nexport function ContextNavbar(props: NavbarProps) {\n  const currentUser = useCurrentUser()\n  const workspace = useWorkspace()\n  const resolved = useRef(false)\n\n  useEffect(() => {\n    if (resolved.current || !currentUser) return\n    resolveContexts({currentUser, workspace})\n    resolved.current = true\n  }, [currentUser, workspace])\n\n  return (\n    <Flex style={{width: '100%'}}>\n      <Box flex={1} style={{minWidth: 0}}>\n        {props.renderDefault(props)}\n      </Box>\n      <Card borderBottom style={{display: 'flex', alignItems: 'center', paddingRight: 8}}>\n        <ContextPopover />\n      </Card>\n    </Flex>\n  )\n}\n","import {definePlugin} from 'sanity'\nimport {initContextStore, setContextsResolver} from './store'\nimport {ContextNavbar} from './components/ContextNavbar'\nimport type {ContextPluginConfig} from './types'\n\n/** @public */\nexport function contextPlugin(config: ContextPluginConfig) {\n  if (typeof config.contexts === 'function') {\n    setContextsResolver(config.contexts, config.storageKey)\n  } else {\n    initContextStore(config.contexts, config.storageKey)\n  }\n\n  return definePlugin({\n    name: 'sanity-context',\n    studio: {\n      components: {navbar: ContextNavbar},\n    },\n  })()\n}\n"],"names":[],"mappings":"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"}

package/package.json

@@ -0,0 +1,62 @@
+{
+  "name": "sanity-context",
+  "version": "0.1.0",
+  "description": "Sanity Studio plugin for managing studio-wide context (brand, locale, market, etc.)",
+  "keywords": [
+    "sanity",
+    "sanity-plugin"
+  ],
+  "license": "MIT",
+  "author": "Tommy Ljungberg",
+  "type": "module",
+  "sideEffects": false,
+  "exports": {
+    ".": {
+      "source": "./src/index.ts",
+      "import": "./dist/index.js",
+      "require": "./dist/index.cjs",
+      "default": "./dist/index.js"
+    },
+    "./package.json": "./package.json"
+  },
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "files": [
+    "dist",
+    "src"
+  ],
+  "engines": {
+    "node": ">=18"
+  },
+  "scripts": {
+    "build": "plugin-kit verify-package --silent && pkg-utils build --strict --check --clean",
+    "link-watch": "plugin-kit link-watch",
+    "prepublishOnly": "npm run build",
+    "watch": "pkg-utils watch --strict"
+  },
+  "peerDependencies": {
+    "@sanity/icons": ">=2",
+    "@sanity/ui": ">=2",
+    "react": "^18",
+    "sanity": "^3"
+  },
+  "devDependencies": {
+    "@sanity/icons": "^2",
+    "@sanity/pkg-utils": "^6",
+    "@sanity/plugin-kit": "^4",
+    "@sanity/ui": "^2",
+    "@types/react": "^18",
+    "eslint": "^9",
+    "react": "^18",
+    "sanity": "^3",
+    "typescript": "^5"
+  },
+  "sanityPlugin": {
+    "verifyPackage": {
+      "packageName": false,
+      "sanityV2Json": false,
+      "eslintImports": false
+    }
+  }
+}

package/src/components/ContextIcon.tsx

@@ -0,0 +1,46 @@
+import {forwardRef} from 'react'
+
+/** @public */
+export const ContextIcon = forwardRef<SVGSVGElement, React.SVGProps<SVGSVGElement>>(
+  function ContextIcon(_props, _ref) {
+    return (
+      <svg width="18" height="18" viewBox="0 0 128 128" xmlns="http://www.w3.org/2000/svg">
+        <defs>
+          <linearGradient id="g" x1="0" y1="0" x2="1" y2="0">
+            <stop offset="0%" stop-color="#6366F1" />
+            <stop offset="100%" stop-color="#06B6D4" />
+          </linearGradient>
+        </defs>
+
+        <rect
+          x="16"
+          y="20"
+          width="32"
+          height="88"
+          rx="8"
+          fill="none"
+          stroke="#6366F1"
+          stroke-width="6"
+        />
+        <rect
+          x="80"
+          y="20"
+          width="32"
+          height="88"
+          rx="8"
+          fill="none"
+          stroke="#06B6D4"
+          stroke-width="6"
+        />
+
+        <path
+          d="M48 64 C60 40, 68 88, 80 64"
+          fill="none"
+          stroke="url(#g)"
+          stroke-width="6"
+          stroke-linecap="round"
+        />
+      </svg>
+    )
+  },
+)

package/src/components/ContextItem.tsx

@@ -0,0 +1,33 @@
+import {Box, Flex, Label, Switch} from '@sanity/ui'
+
+interface Props {
+  id: string
+  label: string
+  enabled: boolean
+  onToggle: (enabled: boolean) => void
+  children: React.ReactNode
+}
+
+export function ContextItem({id, label, enabled, onToggle, children}: Props) {
+  return (
+    <Flex align="center" justify="space-between" gap={4}>
+      <Flex
+        align="center"
+        gap={2}
+        as="label"
+        htmlFor={id}
+        style={{cursor: 'pointer', flexShrink: 0}}
+      >
+        <Switch
+          id={id}
+          checked={enabled}
+          onChange={(e) => onToggle(e.currentTarget.checked)}
+        />
+        <Label size={1}>{label}</Label>
+      </Flex>
+      <Box style={{width: 150, opacity: enabled ? 1 : 0.35, pointerEvents: enabled ? 'auto' : 'none'}}>
+        {children}
+      </Box>
+    </Flex>
+  )
+}

package/src/components/ContextNavbar.tsx

@@ -0,0 +1,28 @@
+import {useEffect, useRef} from 'react'
+import {type NavbarProps, useCurrentUser, useWorkspace} from 'sanity'
+import {Box, Card, Flex} from '@sanity/ui'
+import {resolveContexts} from '../store'
+import {ContextPopover} from './ContextPopover'
+
+export function ContextNavbar(props: NavbarProps) {
+  const currentUser = useCurrentUser()
+  const workspace = useWorkspace()
+  const resolved = useRef(false)
+
+  useEffect(() => {
+    if (resolved.current || !currentUser) return
+    resolveContexts({currentUser, workspace})
+    resolved.current = true
+  }, [currentUser, workspace])
+
+  return (
+    <Flex style={{width: '100%'}}>
+      <Box flex={1} style={{minWidth: 0}}>
+        {props.renderDefault(props)}
+      </Box>
+      <Card borderBottom style={{display: 'flex', alignItems: 'center', paddingRight: 8}}>
+        <ContextPopover />
+      </Card>
+    </Flex>
+  )
+}

package/src/components/ContextPopover.tsx

@@ -0,0 +1,114 @@
+import {useEffect, useLayoutEffect, useRef, useState, useSyncExternalStore} from 'react'
+import {Button, Card, Layer, Menu, MenuButton, MenuItem, Portal, Stack, Text, Tooltip} from '@sanity/ui'
+import {CheckmarkIcon} from '@sanity/icons'
+import {ContextIcon} from './ContextIcon'
+
+import {ContextItem} from './ContextItem'
+import {getContext, getContextDefinitions, setContextEntry, subscribeToContext} from '../store'
+
+function useContextState() {
+  return useSyncExternalStore(subscribeToContext, getContext, getContext)
+}
+
+export function ContextPopover() {
+  const [open, setOpen] = useState(false)
+  const definitions = getContextDefinitions()
+  const state = useContextState()
+  const triggerRef = useRef<HTMLDivElement>(null)
+  const cardRef = useRef<HTMLDivElement>(null)
+  const [coords, setCoords] = useState({top: 0, right: 0})
+
+  const hasActive = Object.values(state).some((e) => e.enabled)
+
+  useLayoutEffect(() => {
+    if (!open || !triggerRef.current) return
+    const rect = triggerRef.current.getBoundingClientRect()
+    setCoords({top: rect.bottom + 4, right: window.innerWidth - rect.right})
+  }, [open])
+
+  useEffect(() => {
+    if (!open) return
+    const handler = (e: MouseEvent) => {
+      const target = e.target as Element
+      if (triggerRef.current?.contains(target)) return
+      if (cardRef.current?.contains(target)) return
+      if (target.closest?.('[data-context-ui]')) return
+      setOpen(false)
+    }
+    document.addEventListener('mousedown', handler)
+    return () => document.removeEventListener('mousedown', handler)
+  }, [open])
+
+  return (
+    <>
+      <div ref={triggerRef}>
+        <Tooltip content={<Text size={1}>Sanity context</Text>} placement="bottom" portal>
+          <Button
+            mode="bleed"
+            icon={ContextIcon}
+            selected={open}
+            tone={hasActive ? 'primary' : 'default'}
+            onClick={() => setOpen((v) => !v)}
+          />
+        </Tooltip>
+      </div>
+      {open && (
+        <Portal>
+          <Layer>
+            <div
+              ref={cardRef}
+              style={{position: 'fixed', top: coords.top, right: coords.right}}
+            >
+              <Card data-context-ui padding={3} shadow={2} style={{minWidth: 260}}>
+                <Stack space={3}>
+                  {definitions.map((def) => {
+                    const entry = state[def.id]
+                    const currentTitle =
+                      def.options.find((o) => o.value === entry?.value)?.title ??
+                      def.options[0]?.title
+
+                    return (
+                      <ContextItem
+                        key={def.id}
+                        id={`sanity-context-${def.id}`}
+                        label={def.title}
+                        enabled={entry?.enabled ?? false}
+                        onToggle={(enabled) => setContextEntry(def.id, {enabled})}
+                      >
+                        <MenuButton
+                          button={
+                            <Button
+                              text={currentTitle}
+                              fontSize={1}
+                              padding={2}
+                              mode="ghost"
+                              style={{width: '100%'}}
+                            />
+                          }
+                          id={`sanity-context-menu-${def.id}`}
+                          menu={
+                            <Menu data-context-ui>
+                              {def.options.map((opt) => (
+                                <MenuItem
+                                  key={opt.value}
+                                  text={opt.title}
+                                  icon={entry?.value === opt.value ? CheckmarkIcon : undefined}
+                                  onClick={() => setContextEntry(def.id, {value: opt.value})}
+                                />
+                              ))}
+                            </Menu>
+                          }
+                          popover={{placement: 'bottom-start'}}
+                        />
+                      </ContextItem>
+                    )
+                  })}
+                </Stack>
+              </Card>
+            </div>
+          </Layer>
+        </Portal>
+      )}
+    </>
+  )
+}

package/src/index.ts

@@ -0,0 +1,12 @@
+export {contextPlugin} from './plugin'
+export {getContext, subscribeToContext} from './store'
+export {ContextIcon} from './components/ContextIcon'
+export type {
+  ContextDefinition,
+  ContextEntry,
+  ContextOption,
+  ContextPluginConfig,
+  ContextResolverContext,
+  ContextsResolver,
+  ContextState,
+} from './types'

package/src/plugin.ts

@@ -0,0 +1,20 @@
+import {definePlugin} from 'sanity'
+import {initContextStore, setContextsResolver} from './store'
+import {ContextNavbar} from './components/ContextNavbar'
+import type {ContextPluginConfig} from './types'
+
+/** @public */
+export function contextPlugin(config: ContextPluginConfig) {
+  if (typeof config.contexts === 'function') {
+    setContextsResolver(config.contexts, config.storageKey)
+  } else {
+    initContextStore(config.contexts, config.storageKey)
+  }
+
+  return definePlugin({
+    name: 'sanity-context',
+    studio: {
+      components: {navbar: ContextNavbar},
+    },
+  })()
+}

package/src/store.ts

@@ -0,0 +1,84 @@
+import type {ContextDefinition, ContextEntry, ContextResolverContext, ContextsResolver, ContextState} from './types'
+
+const DEFAULT_STORAGE_KEY = 'sanity-context'
+
+let _definitions: ContextDefinition[] = []
+let _storageKey = DEFAULT_STORAGE_KEY
+let _state: ContextState = {}
+let _resolver: ContextsResolver | null = null
+const _listeners = new Set<() => void>()
+
+function defaultState(definitions: ContextDefinition[]): ContextState {
+  return Object.fromEntries(definitions.map((d) => [d.id, {enabled: false, value: d.defaultValue}]))
+}
+
+function loadFromStorage(definitions: ContextDefinition[]): ContextState {
+  if (typeof window === 'undefined') return defaultState(definitions)
+  try {
+    const raw = localStorage.getItem(_storageKey)
+    if (!raw) return defaultState(definitions)
+    const saved = JSON.parse(raw) as ContextState
+    return Object.fromEntries(
+      definitions.map((d) => [
+        d.id,
+        {
+          enabled: !!saved[d.id]?.enabled,
+          value: d.options.find((o) => o.value === saved[d.id]?.value)?.value ?? d.defaultValue,
+        },
+      ]),
+    )
+  } catch {
+    return defaultState(definitions)
+  }
+}
+
+function persist(): void {
+  if (typeof window !== 'undefined') {
+    localStorage.setItem(_storageKey, JSON.stringify(_state))
+  }
+}
+
+function notify(): void {
+  _listeners.forEach((fn) => fn())
+}
+
+export function initContextStore(definitions: ContextDefinition[], storageKey?: string): void {
+  _definitions = definitions
+  _storageKey = storageKey ?? DEFAULT_STORAGE_KEY
+  _state = loadFromStorage(definitions)
+  notify()
+}
+
+export function setContextsResolver(resolver: ContextsResolver, storageKey?: string): void {
+  _resolver = resolver
+  _storageKey = storageKey ?? DEFAULT_STORAGE_KEY
+}
+
+export function resolveContexts(ctx: ContextResolverContext): void {
+  if (!_resolver) return
+  initContextStore(_resolver(ctx), _storageKey)
+}
+
+export function getContextDefinitions(): ContextDefinition[] {
+  return _definitions
+}
+
+/** @public */
+export function getContext(): ContextState {
+  return _state
+}
+
+export function setContextEntry(id: string, patch: Partial<ContextEntry>): void {
+  if (!_state[id]) return
+  _state = {..._state, [id]: {..._state[id], ...patch}}
+  persist()
+  notify()
+}
+
+/** @public */
+export function subscribeToContext(listener: () => void): () => void {
+  _listeners.add(listener)
+  return () => {
+    _listeners.delete(listener)
+  }
+}

package/src/types.ts

@@ -0,0 +1,39 @@
+import type {CurrentUser, Workspace} from 'sanity'
+
+/** @public */
+export interface ContextOption {
+  value: string
+  title: string
+}
+
+/** @public */
+export interface ContextDefinition {
+  id: string
+  title: string
+  options: ContextOption[]
+  defaultValue: string
+}
+
+/** @public */
+export interface ContextEntry {
+  enabled: boolean
+  value: string
+}
+
+/** @public */
+export type ContextState = Record<string, ContextEntry>
+
+/** @public */
+export interface ContextResolverContext {
+  currentUser: CurrentUser | null
+  workspace: Workspace
+}
+
+/** @public */
+export type ContextsResolver = (ctx: ContextResolverContext) => ContextDefinition[]
+
+/** @public */
+export interface ContextPluginConfig {
+  contexts: ContextDefinition[] | ContextsResolver
+  storageKey?: string
+}