@sevenfold/setto-client 0.14.0 → 0.15.0

package/dist/setto-client.js

@@ -1,6 +1,6 @@
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 import * as React from "react";
-import { useState, useRef, useEffect, useMemo, useSyncExternalStore, useLayoutEffect, createContext, useContext, useCallback, forwardRef, Fragment as Fragment$1, useId, useInsertionEffect } from "react";
+import { useState, useRef, useEffect, useMemo, createContext, useContext, useCallback, useLayoutEffect, useSyncExternalStore, forwardRef, Fragment as Fragment$1, useId, useInsertionEffect } from "react";
 import { useTranslation } from "react-i18next";
 import * as ReactDOM from "react-dom";
 import { createPortal } from "react-dom";
@@ -21452,6 +21452,7 @@ function SettoChrome() {
     currentSite: null,
     sitesLoaded: false,
     editMode: false,
+    guestEdit: false,
     authLoading: true
   }));
   stateRef.current = () => ({
@@ -21464,6 +21465,7 @@ function SettoChrome() {
     } : null,
     sitesLoaded: setto.sites !== null,
     editMode: setto.editMode,
+    guestEdit: setto.guestEdit,
     authLoading: setto.authLoading
   });
   useEffect(() => {
@@ -21569,9 +21571,14 @@ function useSettoDocumentLayout(active) {
           overflow-x: clip;
         }
 
+        /*
+         * Anchored by its right edge, which is also what makes the menu open
+         * leftwards: the pill grows and this corner does not move, so the
+         * button somebody just tapped stays under their thumb.
+         */
         html.setto-edit-mode #setto-toolbar-root {
           position: fixed;
-          left: var(--setto-fab-inset);
+          right: var(--setto-fab-inset);
           bottom: var(--setto-fab-inset);
           z-index: 2147483647;
         }
@@ -21625,492 +21632,6 @@ function notifyLayoutChange() {
     window.dispatchEvent(new Event("resize"));
   });
 }
-function isLinkContext(el) {
-  const key = el.getAttribute("data-setto-key");
-  if (key?.startsWith("lang.")) return false;
-  if (el.closest("[data-setto-no-hint]")) return false;
-  return !!(el.closest("a[href]") || el.closest("button"));
-}
-function activateLinkContext(el) {
-  const anchor = el.closest("a[href]");
-  if (anchor instanceof HTMLAnchorElement) {
-    anchor.click();
-    return;
-  }
-  const button = el.closest("button");
-  if (button instanceof HTMLButtonElement) {
-    button.click();
-  }
-}
-const QUERY = "(hover: none) and (pointer: coarse)";
-function subscribe(onChange) {
-  const mq = window.matchMedia(QUERY);
-  mq.addEventListener("change", onChange);
-  return () => mq.removeEventListener("change", onChange);
-}
-function getSnapshot() {
-  return window.matchMedia(QUERY).matches;
-}
-function useCoarsePointer() {
-  return useSyncExternalStore(subscribe, getSnapshot, () => false);
-}
-const MARGIN$2 = 10;
-const OFFSET$1 = 14;
-function hintLabel() {
-  const isMac = navigator.platform.toUpperCase().includes("MAC");
-  return isMac ? "⌘+klikk for å åpne" : "Ctrl+klikk for å åpne";
-}
-function placeTooltip(anchor, width, height) {
-  const vw = window.innerWidth;
-  const vh = window.innerHeight;
-  let left = anchor.x + OFFSET$1;
-  let top = anchor.y + OFFSET$1;
-  if (left + width > vw - MARGIN$2) {
-    left = anchor.x - width - OFFSET$1;
-  }
-  if (left < MARGIN$2) {
-    left = MARGIN$2;
-  }
-  if (top + height > vh - MARGIN$2) {
-    top = anchor.y - height - OFFSET$1;
-  }
-  if (top < MARGIN$2) {
-    top = MARGIN$2;
-  }
-  return { left, top };
-}
-function EditLinkHint() {
-  const coarsePointer = useCoarsePointer();
-  const [anchor, setAnchor] = useState(null);
-  const [position, setPosition] = useState(null);
-  const tipRef = useRef(null);
-  const text = hintLabel();
-  useEffect(() => {
-    if (coarsePointer) return;
-    const onMove = (e) => {
-      const target = e.target;
-      if (!(target instanceof Element)) {
-        setAnchor(null);
-        return;
-      }
-      const editable = target.closest("[data-setto-key]");
-      if (!(editable instanceof HTMLElement) || !isLinkContext(editable)) {
-        setAnchor(null);
-        return;
-      }
-      setAnchor({ x: e.clientX, y: e.clientY });
-    };
-    document.addEventListener("mousemove", onMove, true);
-    return () => document.removeEventListener("mousemove", onMove, true);
-  }, [coarsePointer]);
-  useLayoutEffect(() => {
-    if (!anchor || !tipRef.current) {
-      setPosition(null);
-      return;
-    }
-    const { width, height } = tipRef.current.getBoundingClientRect();
-    setPosition(placeTooltip(anchor, width, height));
-  }, [anchor, text]);
-  if (coarsePointer || !anchor) return null;
-  const style = {
-    position: "fixed",
-    left: position?.left ?? anchor.x + OFFSET$1,
-    top: position?.top ?? anchor.y + OFFSET$1,
-    visibility: position ? "visible" : "hidden",
-    background: "#1a1a1a",
-    color: "#fff",
-    fontSize: 11,
-    padding: "4px 8px",
-    borderRadius: 4,
-    pointerEvents: "none",
-    whiteSpace: "nowrap",
-    fontFamily: "system-ui, sans-serif",
-    boxShadow: "0 2px 8px rgba(0,0,0,0.15)"
-  };
-  return /* @__PURE__ */ jsx("div", { ref: tipRef, style, children: text });
-}
-function colorsMatch(a, b) {
-  const na = normalizeColor(a);
-  const nb = normalizeColor(b);
-  if (!na || !nb) return false;
-  return na === nb;
-}
-function normalizeColor(color) {
-  const trimmed = color.trim().toLowerCase();
-  if (/^#[0-9a-f]{3}$/.test(trimmed)) {
-    const [, r, g, b] = trimmed.match(/^#(.)(.)(.)$/) ?? [];
-    return `#${r}${r}${g}${g}${b}${b}`;
-  }
-  if (/^#[0-9a-f]{6}$/.test(trimmed)) return trimmed;
-  const rgb = trimmed.match(/^rgba?\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)/);
-  if (rgb) {
-    const [, r, g, b] = rgb;
-    if (r === void 0 || g === void 0 || b === void 0) return null;
-    const hex = (n) => Number(n).toString(16).padStart(2, "0");
-    return `#${hex(r)}${hex(g)}${hex(b)}`;
-  }
-  return null;
-}
-function swatchBorder(color) {
-  const n = normalizeColor(color);
-  if (n === "#ffffff" || n === "#e6dccf") return "#ccc";
-  return "transparent";
-}
-const SectionEditContext = createContext(null);
-function SectionEditProvider({ children }) {
-  const [selectedId, setSelectedId] = useState(null);
-  const selectSection = useCallback((id) => {
-    setSelectedId(id);
-  }, []);
-  const value = useMemo(
-    () => ({ selectedId, selectSection }),
-    [selectedId, selectSection]
-  );
-  return /* @__PURE__ */ jsx(SectionEditContext.Provider, { value, children });
-}
-function useSectionEdit() {
-  const ctx = useContext(SectionEditContext);
-  if (!ctx) {
-    throw new Error("useSectionEdit() must be used inside SectionEditProvider");
-  }
-  return ctx;
-}
-const SECTION_TOOLBAR_HEIGHT = 44;
-const GAP = 8;
-const MARGIN$1 = 8;
-function computePosition(targetEl, toolbarW, toolbarH) {
-  const rect = targetEl.getBoundingClientRect();
-  let left = rect.left + (rect.width - toolbarW) / 2;
-  left = Math.max(MARGIN$1, Math.min(left, window.innerWidth - toolbarW - MARGIN$1));
-  const top = Math.max(MARGIN$1, rect.top - toolbarH - GAP);
-  return { top, left };
-}
-function BrandColorPicker({
-  label,
-  value,
-  brandColors,
-  open,
-  onToggle,
-  onSelect,
-  popoverPlacement
-}) {
-  const buttonRef = useRef(null);
-  const popoverRef = useRef(null);
-  const [popoverPos, setPopoverPos] = useState(null);
-  const matched = brandColors.find((b) => colorsMatch(value, b.value));
-  const displayColor = matched?.value ?? (value || "#cccccc");
-  const displayLabel = matched?.label ?? label;
-  useLayoutEffect(() => {
-    if (!open || !buttonRef.current) {
-      setPopoverPos(null);
-      return;
-    }
-    const update = () => {
-      const btn = buttonRef.current;
-      const pop = popoverRef.current;
-      if (!btn) return;
-      const rect = btn.getBoundingClientRect();
-      const popoverH = pop?.offsetHeight ?? 120;
-      const popoverW = pop?.offsetWidth ?? 180;
-      let top = popoverPlacement === "above" ? rect.top - popoverH - 6 : rect.bottom + 6;
-      let left = rect.left;
-      if (left + popoverW > window.innerWidth - 8) {
-        left = window.innerWidth - popoverW - 8;
-      }
-      if (left < 8) left = 8;
-      if (top < 8) top = rect.bottom + 6;
-      if (top + popoverH > window.innerHeight - 8) {
-        top = rect.top - popoverH - 6;
-      }
-      setPopoverPos({ top, left });
-    };
-    update();
-    requestAnimationFrame(update);
-    window.addEventListener("scroll", update, true);
-    window.addEventListener("resize", update);
-    return () => {
-      window.removeEventListener("scroll", update, true);
-      window.removeEventListener("resize", update);
-    };
-  }, [open, popoverPlacement, brandColors.length]);
-  const popover = open ? /* @__PURE__ */ jsx(
-    "div",
-    {
-      ref: popoverRef,
-      role: "listbox",
-      "aria-label": label,
-      "data-setto-ui": true,
-      style: {
-        position: "fixed",
-        top: popoverPos?.top ?? -9999,
-        left: popoverPos?.left ?? 0,
-        visibility: popoverPos ? "visible" : "hidden",
-        zIndex: 2147483647,
-        display: "grid",
-        gridTemplateColumns: "repeat(4, 1fr)",
-        gap: 4,
-        padding: 8,
-        background: "#fff",
-        border: "1px solid #e0e0e0",
-        borderRadius: 8,
-        boxShadow: "0 8px 24px rgba(0,0,0,0.15)",
-        minWidth: 160
-      },
-      onMouseDown: (e) => e.stopPropagation(),
-      onClick: (e) => e.stopPropagation(),
-      children: brandColors.map((brand) => {
-        const selected = colorsMatch(value, brand.value);
-        return /* @__PURE__ */ jsxs(
-          "button",
-          {
-            type: "button",
-            role: "option",
-            "aria-selected": selected,
-            title: brand.label,
-            onClick: () => onSelect(brand.value),
-            style: {
-              display: "flex",
-              flexDirection: "column",
-              alignItems: "center",
-              gap: 4,
-              padding: 6,
-              background: selected ? "#f5f3ff" : "transparent",
-              border: selected ? "1px solid #640AFF" : "1px solid transparent",
-              borderRadius: 6,
-              cursor: "pointer"
-            },
-            children: [
-              /* @__PURE__ */ jsx(
-                "span",
-                {
-                  "aria-hidden": true,
-                  style: {
-                    width: 24,
-                    height: 24,
-                    borderRadius: "50%",
-                    background: brand.value,
-                    border: `1px solid ${swatchBorder(brand.value)}`
-                  }
-                }
-              ),
-              /* @__PURE__ */ jsx("span", { style: { fontSize: 10, color: "#666", lineHeight: 1.2 }, children: brand.label })
-            ]
-          },
-          brand.value
-        );
-      })
-    }
-  ) : null;
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsxs(
-      "button",
-      {
-        ref: buttonRef,
-        type: "button",
-        "data-setto-ui": true,
-        onMouseDown: (e) => e.stopPropagation(),
-        onClick: (e) => {
-          e.stopPropagation();
-          onToggle();
-        },
-        "aria-expanded": open,
-        "aria-haspopup": "listbox",
-        "aria-label": `${label}: ${displayLabel}`,
-        title: `${label}: ${displayLabel}`,
-        style: {
-          display: "inline-flex",
-          alignItems: "center",
-          gap: 6,
-          padding: "4px 8px 4px 6px",
-          background: open ? "#f5f3ff" : "#f7f7f7",
-          border: open ? "1px solid #640AFF" : "1px solid #e0e0e0",
-          borderRadius: 6,
-          cursor: "pointer",
-          fontSize: 11,
-          color: "#444",
-          whiteSpace: "nowrap",
-          flexShrink: 0
-        },
-        children: [
-          /* @__PURE__ */ jsx(
-            "span",
-            {
-              "aria-hidden": true,
-              style: {
-                width: 18,
-                height: 18,
-                borderRadius: "50%",
-                background: displayColor,
-                border: `1px solid ${swatchBorder(displayColor)}`,
-                flexShrink: 0
-              }
-            }
-          ),
-          /* @__PURE__ */ jsx("span", { children: label }),
-          /* @__PURE__ */ jsx("span", { "aria-hidden": true, style: { color: "#999", fontSize: 10, lineHeight: 1 }, children: "▾" })
-        ]
-      }
-    ),
-    popover ? createPortal(popover, document.body) : null
-  ] });
-}
-function SectionToolbar() {
-  const { themeStore, config } = useSetto();
-  const { selectedId, selectSection } = useSectionEdit();
-  const [pos, setPos] = useState(null);
-  const [openField, setOpenField] = useState(null);
-  const barRef = useRef(null);
-  const schema = selectedId ? config.sectionSchemas?.[selectedId] : null;
-  const brandColors = config.brandColors ?? [];
-  useLayoutEffect(() => {
-    if (!selectedId) {
-      setPos(null);
-      return;
-    }
-    const el = document.querySelector(
-      `[data-setto-section="${selectedId}"]`
-    );
-    if (!el) {
-      setPos(null);
-      return;
-    }
-    const update = () => {
-      const bar = barRef.current;
-      if (!bar) return;
-      const w = bar.offsetWidth;
-      const h = bar.offsetHeight || SECTION_TOOLBAR_HEIGHT;
-      setPos(computePosition(el, w, h));
-    };
-    update();
-    requestAnimationFrame(update);
-    window.addEventListener("scroll", update, true);
-    window.addEventListener("resize", update);
-    return () => {
-      window.removeEventListener("scroll", update, true);
-      window.removeEventListener("resize", update);
-    };
-  }, [selectedId, openField, schema?.fields.length]);
-  useEffect(() => {
-    setOpenField(null);
-  }, [selectedId]);
-  useEffect(() => {
-    if (!openField) return;
-    const close = (e) => {
-      const target = e.target;
-      if (barRef.current?.contains(target)) return;
-      if (target instanceof Element && target.closest("[data-setto-ui]")) return;
-      setOpenField(null);
-    };
-    document.addEventListener("mousedown", close);
-    return () => document.removeEventListener("mousedown", close);
-  }, [openField]);
-  useEffect(() => {
-    if (!selectedId) return;
-    const onKey = (e) => {
-      if (e.key !== "Escape") return;
-      if (openField) {
-        setOpenField(null);
-        return;
-      }
-      selectSection(null);
-    };
-    window.addEventListener("keydown", onKey);
-    return () => window.removeEventListener("keydown", onKey);
-  }, [selectedId, selectSection, openField]);
-  if (!selectedId || !schema || !themeStore || brandColors.length === 0) {
-    return null;
-  }
-  const colors = themeStore.getSection(selectedId);
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      ref: barRef,
-      role: "toolbar",
-      "data-setto-ui": true,
-      "data-setto-theme-id": selectedId,
-      "aria-label": `Farger — ${schema.label}`,
-      style: {
-        position: "fixed",
-        top: pos?.top ?? -9999,
-        left: pos?.left ?? 0,
-        width: "max-content",
-        maxWidth: `calc(100vw - ${MARGIN$1 * 2}px)`,
-        minHeight: SECTION_TOOLBAR_HEIGHT,
-        zIndex: 2147483646,
-        display: "flex",
-        alignItems: "center",
-        gap: 8,
-        padding: "0 12px",
-        background: "#ffffff",
-        border: "1px solid #e0e0e0",
-        borderRadius: 8,
-        boxShadow: "0 4px 20px rgba(0,0,0,0.12)",
-        fontFamily: 'system-ui, -apple-system, "Segoe UI", sans-serif',
-        fontSize: 12,
-        pointerEvents: "auto",
-        userSelect: "none",
-        visibility: pos ? "visible" : "hidden"
-      },
-      onMouseDown: (e) => e.stopPropagation(),
-      onClick: (e) => e.stopPropagation(),
-      children: [
-        /* @__PURE__ */ jsx("span", { style: { fontWeight: 600, whiteSpace: "nowrap", flexShrink: 0 }, children: schema.label }),
-        /* @__PURE__ */ jsx("span", { style: { color: "#ccc", flexShrink: 0 }, children: "·" }),
-        /* @__PURE__ */ jsx(
-          "div",
-          {
-            style: {
-              display: "flex",
-              alignItems: "center",
-              gap: 6,
-              flexWrap: "nowrap"
-            },
-            children: schema.fields.map((field) => /* @__PURE__ */ jsx(
-              BrandColorPicker,
-              {
-                label: field.label,
-                value: colors[field.key] ?? "",
-                brandColors,
-                open: openField === field.key,
-                popoverPlacement: "below",
-                onToggle: () => setOpenField((prev) => prev === field.key ? null : field.key),
-                onSelect: (v) => {
-                  themeStore.set(selectedId, field.key, v);
-                  setOpenField(null);
-                }
-              },
-              field.key
-            ))
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          "button",
-          {
-            type: "button",
-            "data-setto-ui": true,
-            onMouseDown: (e) => e.stopPropagation(),
-            onClick: (e) => {
-              e.stopPropagation();
-              selectSection(null);
-            },
-            "aria-label": "Lukk",
-            style: {
-              flexShrink: 0,
-              background: "transparent",
-              border: "none",
-              color: "#999",
-              cursor: "pointer",
-              fontSize: 16,
-              lineHeight: 1,
-              padding: "2px 6px"
-            },
-            children: "×"
-          }
-        )
-      ]
-    }
-  );
-}
 function SettoMark({
   size = 24,
   letterColor = "#F2EBDF",
@@ -22175,6 +21696,8 @@ const pillStyle = {
 function EditModeShell({ children, themeStore, active }) {
   useSettoDocumentLayout(active);
   const Toolbar = useSettoChromeSlot("toolbar");
+  const SectionTools = useSettoChromeSlot("section-toolbar");
+  const LinkHint = useSettoChromeSlot("link-hint");
   const [toolbarRoot, setToolbarRoot] = useState(null);
   const [hintRoot, setHintRoot] = useState(null);
   const [sectionToolbarRoot, setSectionToolbarRoot] = useState(null);
@@ -22208,8 +21731,8 @@ function EditModeShell({ children, themeStore, active }) {
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     children,
     active && toolbarRoot ? createPortal(Toolbar ? /* @__PURE__ */ jsx(Toolbar, {}) : /* @__PURE__ */ jsx(ToolbarUnavailable, {}), toolbarRoot) : null,
-    active && hintRoot ? createPortal(/* @__PURE__ */ jsx(EditLinkHint, {}), hintRoot) : null,
-    active && sectionToolbarRoot && themeStore ? createPortal(/* @__PURE__ */ jsx(SectionToolbar, {}), sectionToolbarRoot) : null
+    active && hintRoot && LinkHint ? createPortal(/* @__PURE__ */ jsx(LinkHint, {}), hintRoot) : null,
+    active && sectionToolbarRoot && themeStore && SectionTools ? createPortal(/* @__PURE__ */ jsx(SectionTools, {}), sectionToolbarRoot) : null
   ] });
 }
 const SettoContext = createContext(null);
@@ -22256,6 +21779,16 @@ function SettoProvider({ config, children }) {
     setStoreReady(true);
   }, [i18n, config.theme]);
   const editMode = !!session && !!access.currentSite && !onAdminRoute && !authLoading && !access.loading;
+  const [selectedSectionId, setSelectedSectionId] = useState(null);
+  const selectSection = useCallback((id) => setSelectedSectionId(id), []);
+  const [guestEdit, setGuestEdit] = useState(false);
+  useEffect(() => {
+    if (editMode && guestEdit) setGuestEdit(false);
+  }, [editMode, guestEdit]);
+  useEffect(() => {
+    document.documentElement.classList.toggle("setto-guest-editing", guestEdit);
+    return () => document.documentElement.classList.remove("setto-guest-editing");
+  }, [guestEdit]);
   const value = {
     config,
     supabase,
@@ -22267,10 +21800,14 @@ function SettoProvider({ config, children }) {
     sites: access.sites,
     store: storeReady ? storeRef.current : null,
     themeStore: storeReady ? themeStoreRef.current : null,
-    assetStore: storeReady ? assetStoreRef.current : null
+    assetStore: storeReady ? assetStoreRef.current : null,
+    selectedSectionId,
+    selectSection,
+    guestEdit,
+    setGuestEdit
   };
   const editShellActive = editMode && !!value.store;
-  return /* @__PURE__ */ jsx(SettoContext.Provider, { value, children: /* @__PURE__ */ jsxs(SectionEditProvider, { children: [
+  return /* @__PURE__ */ jsx(SettoContext.Provider, { value, children: /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsx(EditModeShell, { active: editShellActive, themeStore: value.themeStore, children }),
     /* @__PURE__ */ jsx(SettoChrome, {})
   ] }) });
@@ -22282,36 +21819,24 @@ function useSetto() {
   }
   return ctx;
 }
-const GuestEditContext = createContext(null);
 function GuestEditProvider({ children }) {
-  const { editMode, themeStore } = useSetto();
-  const { selectSection } = useSectionEdit();
-  const [active, setActive] = useState(false);
-  useEffect(() => {
-    if (editMode && active) setActive(false);
-  }, [editMode, active]);
-  useEffect(() => {
-    document.documentElement.classList.toggle("setto-guest-editing", active);
-    return () => document.documentElement.classList.remove("setto-guest-editing");
-  }, [active]);
-  const start = useCallback(() => setActive(true), []);
-  const stop = useCallback(() => {
-    setActive(false);
-    selectSection(null);
-  }, [selectSection]);
-  return /* @__PURE__ */ jsxs(GuestEditContext.Provider, { value: { active, start, stop }, children: [
+  const { guestEdit, themeStore } = useSetto();
+  const SectionTools = useSettoChromeSlot("section-toolbar");
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
     children,
-    active && themeStore ? createPortal(/* @__PURE__ */ jsx(SectionToolbar, {}), document.body) : null
+    guestEdit && themeStore && SectionTools ? createPortal(/* @__PURE__ */ jsx(SectionTools, {}), document.body) : null
   ] });
 }
 function useGuestEdit() {
-  const ctx = useContext(GuestEditContext);
-  if (!ctx) {
-    return { active: false, start: () => {
-    }, stop: () => {
-    } };
-  }
-  return ctx;
+  const { guestEdit, setGuestEdit, selectSection } = useSetto();
+  return {
+    active: guestEdit,
+    start: () => setGuestEdit(true),
+    stop: () => {
+      setGuestEdit(false);
+      selectSection(null);
+    }
+  };
 }
 const PREVIEW_HOST = /(^|\.)site\.setto\.no$/i;
 function isPreviewHost(hostname) {
@@ -22509,6 +22034,23 @@ const errorStyle = {
   textOverflow: "ellipsis",
   whiteSpace: "nowrap"
 };
+function isLinkContext(el) {
+  const key = el.getAttribute("data-setto-key");
+  if (key?.startsWith("lang.")) return false;
+  if (el.closest("[data-setto-no-hint]")) return false;
+  return !!(el.closest("a[href]") || el.closest("button"));
+}
+function activateLinkContext(el) {
+  const anchor = el.closest("a[href]");
+  if (anchor instanceof HTMLAnchorElement) {
+    anchor.click();
+    return;
+  }
+  const button = el.closest("button");
+  if (button instanceof HTMLButtonElement) {
+    button.click();
+  }
+}
 const MARGIN = 10;
 const OFFSET = 8;
 const MIN_TOUCH = 44;
@@ -22623,6 +22165,18 @@ function rangeFromPoint(doc, x, y) {
   range.collapse(true);
   return range;
 }
+const QUERY = "(hover: none) and (pointer: coarse)";
+function subscribe(onChange) {
+  const mq = window.matchMedia(QUERY);
+  mq.addEventListener("change", onChange);
+  return () => mq.removeEventListener("change", onChange);
+}
+function getSnapshot() {
+  return window.matchMedia(QUERY).matches;
+}
+function useCoarsePointer() {
+  return useSyncExternalStore(subscribe, getSnapshot, () => false);
+}
 function T({ k }) {
   const { t, i18n } = useTranslation();
   const { editMode, store } = useSetto();
@@ -22745,6 +22299,10 @@ function toBcp47(code) {
   if (base === "en") return "en";
   return code;
 }
+function useSectionEdit() {
+  const { selectedSectionId, selectSection } = useSetto();
+  return { selectedId: selectedSectionId, selectSection };
+}
 function isTextEditClick(target) {
   if (target.closest("[data-setto-key]")) return true;
   if (target.closest("[data-setto-ui]")) return true;
@@ -25750,6 +25308,7 @@ export {
   isDeploymentInProgress,
   isDeploymentStale,
   isFormFieldType,
+  isLinkContext,
   isPreviewHost,
   nodeChildren,
   parseBlockTree,
@@ -25757,6 +25316,7 @@ export {
   readLocaleFields,
   settoSubmissionUrl,
   siteHomeUrl,
+  useCoarsePointer,
   useDeploymentStatus,
   useGuestEdit,
   useSectionTheme,