@liiift-studio/deploy-vercel-from-sanity 1.2.0 → 1.2.1

package/dist/index.mjs

@@ -9,10 +9,18 @@ import * as sanityUi from "@sanity/ui";
 import * as sanityIcons from "@sanity/icons";
 var UI = sanityUi;
 var ICONS = sanityIcons;
-function resolveExport(ns, name) {
+function resolveComponent(ns, name) {
   const value = ns[name];
   return typeof value === "function" || typeof value === "object" && value !== null ? value : void 0;
 }
+function resolveFunction(ns, name) {
+  const value = ns[name];
+  return typeof value === "function" ? value : void 0;
+}
+function resolveRecord(ns, name) {
+  const value = ns[name];
+  return typeof value === "object" && value !== null ? value : void 0;
+}
 var STACK_USES_GAP = typeof UI.Stack === "function";
 
 // src/icons.tsx
@@ -21,11 +29,11 @@ var GLYPH = { width: "1em", height: "1em", viewBox: "0 0 25 25", fill: "none" };
 var MissingIcon = forwardRef(function MissingIcon2(props, ref) {
   return /* @__PURE__ */ jsx("svg", { ...GLYPH, xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", focusable: "false", ...props, ref });
 });
-var SYMBOL_MAP = resolveExport(ICONS, "icons");
+var SYMBOL_MAP = resolveRecord(ICONS, "icons");
 function resolveIcon(name, symbol) {
-  const named = resolveExport(ICONS, name);
+  const named = resolveComponent(ICONS, name);
   if (named) return named;
-  const Icon = resolveExport(ICONS, "Icon");
+  const Icon = resolveComponent(ICONS, "Icon");
   if (!Icon) return MissingIcon;
   if (SYMBOL_MAP && !(symbol in SYMBOL_MAP)) return MissingIcon;
   const Resolved = forwardRef(function SanityIcon(props, ref) {
@@ -63,21 +71,43 @@ import { createElement, forwardRef as forwardRef2 } from "react";
 import { jsx as jsx2 } from "react/jsx-runtime";
 function domFallback(tag) {
   const Fallback = forwardRef2(function SanityUiFallback(props, ref) {
-    const { children, style, id, className, onClick, href, title, ...rest } = props;
+    const { children, style, id, className, onClick, href, title, as, ...rest } = props;
+    const element = typeof as === "string" ? as : tag;
     const passthrough = { style, id, className, onClick, href, title, ref };
-    for (const key of ["role", "type", "value", "checked", "placeholder", "disabled", "onChange", "onKeyDown"]) {
+    for (const key of [
+      "role",
+      "type",
+      "value",
+      "checked",
+      "placeholder",
+      "disabled",
+      "tabIndex",
+      "onChange",
+      "onKeyDown",
+      "onFocus",
+      "onBlur",
+      "onMouseEnter",
+      "onMouseLeave",
+      "htmlFor",
+      "target",
+      "rel",
+      "name",
+      "autoComplete",
+      "required",
+      "readOnly"
+    ]) {
       if (key in rest) passthrough[key] = rest[key];
     }
     for (const key of Object.keys(rest)) {
       if (key.startsWith("aria-") || key.startsWith("data-")) passthrough[key] = rest[key];
     }
-    return createElement(tag, passthrough, children);
+    return createElement(element, passthrough, children);
   });
   Fallback.displayName = `SanityUiFallback(${tag})`;
   return Fallback;
 }
 function primitive(name, tag) {
-  return resolveExport(UI, name) ?? domFallback(tag);
+  return resolveComponent(UI, name) ?? domFallback(tag);
 }
 var Box = primitive("Box", "div");
 var Card = primitive("Card", "div");
@@ -136,11 +166,19 @@ function scheduleDismiss(id, status) {
 }
 function pushLocalToast(params) {
   const toast = { ...params, id: nextToastId++ };
-  localToasts = [...localToasts, toast].slice(-MAX_VISIBLE_TOASTS);
+  const next = [...localToasts, toast];
+  for (const dropped of next.slice(0, Math.max(0, next.length - MAX_VISIBLE_TOASTS))) {
+    const timer = dismissTimers.get(dropped.id);
+    if (timer) {
+      clearTimeout(timer);
+      dismissTimers.delete(dropped.id);
+    }
+  }
+  localToasts = next.slice(-MAX_VISIBLE_TOASTS);
   emitToasts();
   scheduleDismiss(toast.id, toast.status);
 }
-var installedUseToast = resolveExport(UI, "useToast");
+var installedUseToast = resolveFunction(UI, "useToast");
 var localToaster = { push: pushLocalToast };
 function useToast() {
   const real = installedUseToast;
@@ -157,6 +195,10 @@ function ToastViewport() {
       toastListeners.delete(setToasts);
     };
   }, []);
+  const resume = useCallback((toast, el) => {
+    if (el && el.contains(document.activeElement)) return;
+    scheduleDismiss(toast.id, toast.status);
+  }, []);
   const hold = useCallback((id) => {
     const timer = dismissTimers.get(id);
     if (timer) {
@@ -168,9 +210,8 @@ function ToastViewport() {
   return /* @__PURE__ */ jsx3(
     Box,
     {
-      role: "status",
-      "aria-live": "polite",
-      "aria-atomic": false,
+      role: "log",
+      "aria-label": "Deployment notifications",
       style: {
         position: "fixed",
         bottom: 16,
@@ -185,11 +226,12 @@ function ToastViewport() {
           padding: 3,
           radius: 2,
           shadow: 3,
-          tone: LOCAL_TOAST_TONE[toast.status ?? "info"] ?? "primary",
+          tone: LOCAL_TOAST_TONE[toast.status ?? "info"],
           style: { pointerEvents: "auto" },
           onMouseEnter: () => hold(toast.id),
           onFocusCapture: () => hold(toast.id),
-          onMouseLeave: () => scheduleDismiss(toast.id, toast.status),
+          onMouseLeave: (e) => resume(toast, e.currentTarget),
+          onBlurCapture: (e) => resume(toast, e.currentTarget),
           children: /* @__PURE__ */ jsxs(Flex, { align: "flex-start", gap: 3, children: [
             /* @__PURE__ */ jsxs(Stack, { space: 2, flex: 1, children: [
               toast.title && /* @__PURE__ */ jsx3(Text, { size: 1, weight: "semibold", children: toast.title }),
@@ -215,50 +257,49 @@ function ToastViewport() {
 }
 
 // src/compat/tooltip.tsx
-import { useId, useState as useState2 } from "react";
+import { cloneElement, isValidElement, useId, useState as useState2 } from "react";
 import { jsx as jsx4, jsxs as jsxs2 } from "react/jsx-runtime";
-var InstalledTooltip = resolveExport(UI, "Tooltip");
+var InstalledTooltip = resolveComponent(UI, "Tooltip");
 function Tooltip({ text, children }) {
   const id = useId();
   const [visible, setVisible] = useState2(false);
   if (InstalledTooltip) {
     return /* @__PURE__ */ jsx4(InstalledTooltip, { content: /* @__PURE__ */ jsx4(Box, { padding: 2, children: /* @__PURE__ */ jsx4(Text, { size: 1, children: text }) }), portal: true, children });
   }
+  const described = visible && isValidElement(children) ? cloneElement(children, { "aria-describedby": id }) : children;
   return /* @__PURE__ */ jsxs2(
     "span",
     {
       style: { position: "relative", display: "inline-flex" },
-      "aria-describedby": id,
       onMouseEnter: () => setVisible(true),
       onMouseLeave: () => setVisible(false),
       onFocusCapture: () => setVisible(true),
       onBlurCapture: () => setVisible(false),
       onKeyDown: (e) => {
-        if (e.key === "Escape") setVisible(false);
+        if (e.key === "Escape" && visible) {
+          e.stopPropagation();
+          setVisible(false);
+        }
       },
       children: [
-        children,
-        /* @__PURE__ */ jsx4(
-          Card,
+        described,
+        visible && /* @__PURE__ */ jsx4(
+          "span",
           {
             id,
             role: "tooltip",
-            radius: 2,
-            shadow: 2,
-            padding: 2,
             style: {
               position: "absolute",
               bottom: "100%",
               left: "50%",
               transform: "translateX(-50%)",
-              marginBottom: 4,
+              // No gap between trigger and tooltip, so the pointer can travel onto it
+              // without leaving the hover target (WCAG 1.4.13 Hoverable).
+              paddingBottom: 4,
               whiteSpace: "nowrap",
-              pointerEvents: "none",
-              zIndex: 1e3,
-              // Kept in the accessibility tree when hidden so `aria-describedby` still resolves.
-              visibility: visible ? "visible" : "hidden"
+              zIndex: 1e3
             },
-            children: /* @__PURE__ */ jsx4(Text, { size: 1, children: text })
+            children: /* @__PURE__ */ jsx4(Card, { radius: 2, shadow: 2, padding: 2, children: /* @__PURE__ */ jsx4(Text, { size: 1, children: text }) })
           }
         )
       ]
@@ -269,9 +310,9 @@ function Tooltip({ text, children }) {
 // src/compat/menu.tsx
 import { useCallback as useCallback2, useEffect as useEffect2, useId as useId2, useRef, useState as useState3 } from "react";
 import { jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
-var InstalledMenuButton = resolveExport(UI, "MenuButton");
-var InstalledMenu = resolveExport(UI, "Menu");
-var InstalledMenuItem = resolveExport(UI, "MenuItem");
+var InstalledMenuButton = resolveComponent(UI, "MenuButton");
+var InstalledMenu = resolveComponent(UI, "Menu");
+var InstalledMenuItem = resolveComponent(UI, "MenuItem");
 var INSTALLED_MENU = InstalledMenuButton && InstalledMenu && InstalledMenuItem ? { MenuButton: InstalledMenuButton, Menu: InstalledMenu, MenuItem: InstalledMenuItem } : null;
 var itemKey = (item, index) => item.key ?? `${index}-${item.text}`;
 function ActionMenu({ id, label, items, buttonIcon }) {
@@ -299,7 +340,10 @@ function ActionMenu({ id, label, items, buttonIcon }) {
   useEffect2(() => {
     if (INSTALLED_MENU || !open) return;
     const onPointerDown = (e) => {
-      if (!wrapRef.current?.contains(e.target)) setOpen(false);
+      if (wrapRef.current?.contains(e.target)) return;
+      const hadFocus = wrapRef.current?.contains(document.activeElement);
+      setOpen(false);
+      if (hadFocus) triggerRef.current?.focus();
     };
     document.addEventListener("mousedown", onPointerDown);
     return () => document.removeEventListener("mousedown", onPointerDown);
@@ -337,7 +381,20 @@ function ActionMenu({ id, label, items, buttonIcon }) {
       return;
     }
     if (e.key === "Tab") {
-      close(false);
+      triggerRef.current?.focus();
+      setOpen(false);
+      return;
+    }
+    if (e.key === "Enter" || e.key === " ") {
+      e.preventDefault();
+      const item = shownItems[activeIndex];
+      if (item) {
+        if (item.href) {
+          itemRefs.current[activeIndex]?.click();
+        } else {
+          runAction(item);
+        }
+      }
       return;
     }
     if (e.key === "ArrowDown") {
@@ -412,7 +469,6 @@ function ActionMenu({ id, label, items, buttonIcon }) {
             ref: (el) => {
               itemRefs.current[i] = el;
             },
-            onMouseEnter: () => setActiveIndex(i),
             style: {
               display: "block",
               width: "100%",
@@ -437,15 +493,17 @@ function ActionMenu({ id, label, items, buttonIcon }) {
               href: item.href,
               target: "_blank",
               rel: "noreferrer",
-              onClick: () => close(false),
+              onClick: () => {
+                setOpen(false);
+                triggerRef.current?.focus();
+              },
               children: content
             },
             itemKey(item, i)
           ) : /* @__PURE__ */ jsx5(
-            "button",
+            "div",
             {
               ...shared,
-              type: "button",
               onClick: () => runAction(item),
               children: content
             },
@@ -459,7 +517,7 @@ function ActionMenu({ id, label, items, buttonIcon }) {
 
 // src/compat/code.tsx
 import { jsx as jsx6 } from "react/jsx-runtime";
-var InstalledCode = resolveExport(UI, "Code");
+var InstalledCode = resolveComponent(UI, "Code");
 var FALLBACK_CODE_STYLE = {
   display: "block",
   fontFamily: "ui-monospace, SFMono-Regular, Menlo, Consolas, monospace",
@@ -633,9 +691,10 @@ function StatusBadge({ state, showSpinner }) {
 }
 
 // src/components/DeployHistory.tsx
-import { useEffect as useEffect3, useState as useState4, useCallback as useCallback3 } from "react";
+import { useId as useId3, useEffect as useEffect3, useState as useState4, useCallback as useCallback3 } from "react";
 import { jsx as jsx8, jsxs as jsxs5 } from "react/jsx-runtime";
 function DeployHistory({ target, token, onClose }) {
+  const dialogId = useId3();
   const [deployments, setDeployments] = useState4([]);
   const [loading, setLoading] = useState4(true);
   const [error, setError] = useState4(null);
@@ -659,7 +718,7 @@ function DeployHistory({ target, token, onClose }) {
     Dialog,
     {
       header: `${target.name} \u2014 Deployment History`,
-      id: "deploy-history",
+      id: dialogId,
       onClose,
       width: 2,
       footer: /* @__PURE__ */ jsx8(Box, { padding: 3, children: /* @__PURE__ */ jsx8(Button, { text: "Close", icon: CloseIcon, mode: "ghost", onClick: onClose }) }),
@@ -747,8 +806,11 @@ function DeployItem({ target, token, onDelete, onEdit }) {
   const triggeredFromUidRef = useRef2(void 0);
   const requestSeqRef = useRef2(0);
   const mountedRef = useRef2(true);
-  useEffect4(() => () => {
-    mountedRef.current = false;
+  useEffect4(() => {
+    mountedRef.current = true;
+    return () => {
+      mountedRef.current = false;
+    };
   }, []);
   const latest = deployments[0];
   const isPending = pendingSince !== null;
@@ -974,17 +1036,36 @@ function DeployItem({ target, token, onDelete, onEdit }) {
                 formatDuration(Math.floor((latest.ready - latest.created) / 1e3)),
                 " to build"
               ] }),
-              latest?.url && latest.state === "READY" && /* @__PURE__ */ jsx9(Fragment, { children: /* @__PURE__ */ jsx9(Tooltip, { text: copied ? "Copied!" : "Copy URL", children: /* @__PURE__ */ jsx9(
-                Button,
-                {
-                  mode: "ghost",
-                  icon: copied ? CheckmarkIcon : CopyIcon,
-                  padding: 1,
-                  tone: copied ? "positive" : "default",
-                  onClick: copyUrl,
-                  style: { cursor: "pointer" }
-                }
-              ) }) })
+              latest?.url && latest.state === "READY" && /* @__PURE__ */ jsxs6(Fragment, { children: [
+                /* @__PURE__ */ jsx9(Tooltip, { text: copied ? "Copied" : "Copy deployment URL", children: /* @__PURE__ */ jsx9(
+                  Button,
+                  {
+                    mode: "ghost",
+                    icon: copied ? CheckmarkIcon : CopyIcon,
+                    padding: 1,
+                    tone: copied ? "positive" : "default",
+                    onClick: copyUrl,
+                    "aria-label": copied ? "Deployment URL copied" : "Copy deployment URL",
+                    style: { cursor: "pointer" }
+                  }
+                ) }),
+                /* @__PURE__ */ jsx9(
+                  "span",
+                  {
+                    role: "status",
+                    "aria-live": "polite",
+                    style: {
+                      position: "absolute",
+                      width: 1,
+                      height: 1,
+                      overflow: "hidden",
+                      clip: "rect(0 0 0 0)",
+                      whiteSpace: "nowrap"
+                    },
+                    children: copied ? "Deployment URL copied to clipboard" : ""
+                  }
+                )
+              ] })
             ] }),
             /* @__PURE__ */ jsxs6(Flex, { align: "center", gap: 2, wrap: "wrap", children: [
               commitMsg && /* @__PURE__ */ jsx9(
@@ -1035,7 +1116,7 @@ function DeployItem({ target, token, onDelete, onEdit }) {
               deployError && /* @__PURE__ */ jsx9(Card, { tone: "critical", padding: 2, radius: 2, children: /* @__PURE__ */ jsx9(Text, { size: 1, children: deployError }) })
             ] })
           ] }),
-          pollError && /* @__PURE__ */ jsx9(Card, { tone: "caution", padding: 3, radius: 2, role: "status", children: /* @__PURE__ */ jsxs6(Flex, { align: "center", gap: 2, children: [
+          pollError && /* @__PURE__ */ jsx9(Card, { tone: "caution", padding: 3, radius: 2, children: /* @__PURE__ */ jsxs6(Flex, { align: "center", gap: 2, children: [
             /* @__PURE__ */ jsx9(WarningOutlineIcon, { "aria-hidden": "true" }),
             /* @__PURE__ */ jsxs6(Text, { size: 1, children: [
               "Status updates paused \u2014 ",
@@ -1143,16 +1224,18 @@ function DeployItem({ target, token, onDelete, onEdit }) {
 }
 
 // src/components/TokenSetup.tsx
-import { useId as useId3, useState as useState6, useCallback as useCallback5 } from "react";
+import { useId as useId4, useState as useState6, useCallback as useCallback5 } from "react";
 import { useClient } from "sanity";
 import { jsx as jsx10, jsxs as jsxs7 } from "react/jsx-runtime";
 var TOKEN_DOC_ID = "config.vercelDeploy";
-function TokenSetup({ onSaved, onCancel }) {
-  const tokenId = useId3();
+function TokenSetup({ onSaved, onCancel, hasToken = false }) {
+  const dialogId = useId4();
+  const tokenId = useId4();
   const client = useClient({ apiVersion: "2025-01-01" });
   const [token, setToken] = useState6("");
   const [saving, setSaving] = useState6(false);
   const [error, setError] = useState6(null);
+  const [revoking, setRevoking] = useState6(false);
   const save = useCallback5(async () => {
     if (!token.trim()) return;
     setSaving(true);
@@ -1170,27 +1253,54 @@ function TokenSetup({ onSaved, onCancel }) {
       setSaving(false);
     }
   }, [client, token, onSaved]);
+  const revoke = useCallback5(async () => {
+    setRevoking(true);
+    setError(null);
+    try {
+      await client.delete(TOKEN_DOC_ID);
+      onSaved();
+    } catch (err) {
+      setError(err instanceof Error ? err.message : "Failed to remove token");
+    } finally {
+      setRevoking(false);
+    }
+  }, [client, onSaved]);
   return /* @__PURE__ */ jsx10(
     Dialog,
     {
       header: "Connect Vercel API token",
-      id: "token-setup",
+      id: dialogId,
       onClose: onCancel,
       width: 1,
-      footer: /* @__PURE__ */ jsxs7(Flex, { padding: 3, gap: 2, justify: "flex-end", children: [
-        onCancel && /* @__PURE__ */ jsx10(Button, { text: "Cancel", mode: "ghost", onClick: onCancel, style: { cursor: "pointer" } }),
-        /* @__PURE__ */ jsx10(
+      footer: /* @__PURE__ */ jsxs7(Flex, { padding: 3, gap: 2, justify: hasToken ? "space-between" : "flex-end", children: [
+        hasToken && /* @__PURE__ */ jsx10(
           Button,
           {
-            text: "Save and connect",
-            tone: "primary",
-            icon: CheckmarkCircleIcon,
-            loading: saving,
-            disabled: !token.trim() || saving,
-            onClick: save,
+            text: "Remove token",
+            mode: "ghost",
+            tone: "critical",
+            icon: TrashIcon,
+            loading: revoking,
+            disabled: revoking || saving,
+            onClick: revoke,
             style: { cursor: "pointer" }
           }
-        )
+        ),
+        /* @__PURE__ */ jsxs7(Flex, { gap: 2, children: [
+          onCancel && /* @__PURE__ */ jsx10(Button, { text: "Cancel", mode: "ghost", onClick: onCancel, style: { cursor: "pointer" } }),
+          /* @__PURE__ */ jsx10(
+            Button,
+            {
+              text: "Save and connect",
+              tone: "primary",
+              icon: CheckmarkCircleIcon,
+              loading: saving,
+              disabled: !token.trim() || saving,
+              onClick: save,
+              style: { cursor: "pointer" }
+            }
+          )
+        ] })
       ] }),
       children: /* @__PURE__ */ jsxs7(Stack, { space: 4, padding: 4, children: [
         /* @__PURE__ */ jsxs7(Stack, { space: 3, children: [
@@ -1224,20 +1334,21 @@ function TokenSetup({ onSaved, onCancel }) {
 }
 
 // src/components/DeployTargetForm.tsx
-import { useId as useId4, useState as useState7, useCallback as useCallback6 } from "react";
+import { useId as useId5, useState as useState7, useCallback as useCallback6 } from "react";
 import { useClient as useClient2 } from "sanity";
 import { jsx as jsx11, jsxs as jsxs8 } from "react/jsx-runtime";
 var VERCEL_HOOK_RE2 = /^https:\/\/api\.vercel\.com\/v1\/integrations\/deploy\//;
 function DeployTargetForm({ initial, onSaved, onClose }) {
   const client = useClient2({ apiVersion: "2025-01-01" });
   const isEdit = Boolean(initial);
-  const nameId = useId4();
-  const urlId = useId4();
-  const urlErrorId = useId4();
-  const urlHelpId = useId4();
-  const teamId_ = useId4();
-  const teamHelpId = useId4();
-  const disableId = useId4();
+  const dialogId = useId5();
+  const nameId = useId5();
+  const urlId = useId5();
+  const urlErrorId = useId5();
+  const urlHelpId = useId5();
+  const teamId_ = useId5();
+  const teamHelpId = useId5();
+  const disableId = useId5();
   const [name, setName] = useState7(initial?.name ?? "");
   const [url, setUrl] = useState7(initial?.url ?? "");
   const [teamId, setTeamId] = useState7(initial?.teamId ?? "");
@@ -1273,7 +1384,7 @@ function DeployTargetForm({ initial, onSaved, onClose }) {
     Dialog,
     {
       header: isEdit ? `Edit "${initial?.name}"` : "Add deploy target",
-      id: "deploy-target-form",
+      id: dialogId,
       onClose,
       width: 1,
       footer: /* @__PURE__ */ jsxs8(Flex, { padding: 3, gap: 2, justify: "flex-end", children: [
@@ -1372,7 +1483,7 @@ function DeployTargetForm({ initial, onSaved, onClose }) {
 }
 
 // src/version.ts
-var VERSION = "1.2.0";
+var VERSION = "1.2.1";
 
 // src/components/DeployTool.tsx
 import { jsx as jsx12, jsxs as jsxs9 } from "react/jsx-runtime";
@@ -1577,7 +1688,8 @@ function DeployTool() {
           setShowTokenSetup(false);
           load();
         },
-        onCancel: () => setShowTokenSetup(false)
+        onCancel: () => setShowTokenSetup(false),
+        hasToken: Boolean(token)
       }
     ),
     showCreateForm && /* @__PURE__ */ jsx12(
@@ -1724,37 +1836,13 @@ var vercelDeploySchema = defineType({
   }
 });
 
-// src/schema/vercelConfig.ts
-import { defineField as defineField2, defineType as defineType2 } from "sanity";
-var vercelConfigSchema = defineType2({
-  name: "vercelDeploy.config",
-  title: "Vercel Deploy Configuration",
-  type: "document",
-  fields: [
-    defineField2({
-      name: "accessToken",
-      title: "Vercel API Token",
-      type: "string",
-      description: "Readable by anyone who can read this dataset. Delete this document to revoke the stored token."
-    })
-  ],
-  preview: {
-    select: { token: "accessToken" },
-    prepare: ({ token }) => ({
-      title: "Vercel API Token",
-      // Never render the secret itself in a preview.
-      subtitle: token ? "Connected" : "Not set"
-    })
-  }
-});
-
 // src/index.ts
 var vercelDeploy = definePlugin((options) => {
   const config = options ?? {};
   return {
     name: "deploy-vercel-from-sanity",
     schema: {
-      types: [vercelDeploySchema, vercelConfigSchema]
+      types: [vercelDeploySchema]
     },
     tools: [
       {
@@ -1767,7 +1855,6 @@ var vercelDeploy = definePlugin((options) => {
   };
 });
 export {
-  vercelConfigSchema,
   vercelDeploy,
   vercelDeploySchema
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@liiift-studio/deploy-vercel-from-sanity",
-  "version": "1.2.0",
+  "version": "1.2.1",
   "description": "Sanity Studio plugin — trigger and monitor Vercel deployments with full status, history, and build logs. Supports Studio v3.30 through v6.",
   "license": "MIT",
   "author": "Liiift Studio",
@@ -22,16 +22,20 @@
   "types": "./dist/index.d.ts",
   "exports": {
     ".": {
-      "types": "./dist/index.d.ts",
-      "import": "./dist/index.mjs",
-      "require": "./dist/index.js",
+      "import": {
+        "types": "./dist/index.d.mts",
+        "default": "./dist/index.mjs"
+      },
+      "require": {
+        "types": "./dist/index.d.ts",
+        "default": "./dist/index.js"
+      },
       "default": "./dist/index.mjs"
     },
     "./package.json": "./package.json"
   },
   "files": [
-    "dist",
-    "src"
+    "dist"
   ],
   "scripts": {
     "build": "tsup",
@@ -43,7 +47,7 @@
     "@sanity/ui": ">=2 <5",
     "react": ">=18",
     "react-dom": ">=18",
-    "sanity": ">=3.30"
+    "sanity": ">=3.30 <7"
   },
   "devDependencies": {
     "@sanity/icons": "^5",
@@ -62,6 +66,6 @@
   },
   "sideEffects": true,
   "engines": {
-    "node": ">=20.19"
+    "node": ">=20.19 <22 || >=22.12"
   }
 }

package/src/compat/code.tsx

@@ -1,29 +0,0 @@
-// Monospace block — Studio's Code where available, a styled <code> block otherwise
-import type { CSSProperties, ComponentType, ReactNode } from 'react'
-import { UI, resolveExport } from './resolve'
-
-/** The real Code when the installed @sanity/ui still exports it, otherwise undefined. */
-const InstalledCode = resolveExport<ComponentType<{
-	size?: number
-	style?: CSSProperties
-	children: ReactNode
-}>>(UI, 'Code')
-
-/**
- * Styling for the fallback Code element, approximating @sanity/ui's `size={1}`.
- * `display: block` is included deliberately — `<code>` is inline by default while
- * upstream's Code renders a block, so omitting it would concatenate every line.
- */
-const FALLBACK_CODE_STYLE: CSSProperties = {
-	display: 'block',
-	fontFamily: 'ui-monospace, SFMono-Regular, Menlo, Consolas, monospace',
-	fontSize: '0.8125rem',
-	lineHeight: 1.4,
-	margin: 0,
-}
-
-/** Monospace block. Uses Studio's Code where available, a plain `<code>` on @sanity/ui v4+. */
-export function Code({ style, children }: { style?: CSSProperties; children: ReactNode }): React.JSX.Element {
-	if (InstalledCode) return <InstalledCode size={1} style={style}>{children}</InstalledCode>
-	return <code style={{ ...FALLBACK_CODE_STYLE, ...style }}>{children}</code>
-}

package/src/compat/index.ts

@@ -1,14 +0,0 @@
-// Single entry point for every @sanity/ui value this plugin uses, resolved against the installed major
-export {
-	Box, Card, Flex, Grid, Text, Heading, Label, Badge, Spinner,
-	Button, TextInput, Select, Switch, Dialog, Stack,
-} from './primitives'
-export type { StackProps } from './primitives'
-export { useToast, ToastViewport } from './toast'
-export type { ToastParams, Toaster } from './toast'
-export { Tooltip } from './tooltip'
-export type { TooltipProps } from './tooltip'
-export { ActionMenu } from './menu'
-export type { ActionMenuProps, MenuAction } from './menu'
-export { Code } from './code'
-export { STACK_USES_GAP } from './resolve'