gridsmith-ui 0.30.0 → 0.30.2

package/dist/chat.js

@@ -1,13 +1,14 @@
 "use client";
-import { Divider, CodeBlock, Link } from './chunk-KTPGMJUK.js';
-import './chunk-NLXQ323J.js';
-import './chunk-GQVBZ4GW.js';
-import './chunk-7Q46JXSK.js';
+import { Divider, CodeBlock, Link } from './chunk-SQHKC4HA.js';
+import './chunk-BZRZENBS.js';
+import { useKeyboardScroll } from './chunk-ACLKDE5W.js';
+import './chunk-ZCDA74RQ.js';
+import './chunk-WWN6CQKI.js';
 import './chunk-L6HWACK7.js';
-import './chunk-HP7WUZPK.js';
-import './chunk-WH2FUFAC.js';
-import { cn } from './chunk-JTU7OBYJ.js';
-import { memo, Children, isValidElement } from 'react';
+import './chunk-7Q46JXSK.js';
+import './chunk-4HJDOZ2M.js';
+import { cn, FOCUS_INSET } from './chunk-YL5KD5RC.js';
+import { memo, useState, Children, isValidElement } from 'react';
 import Markdown from 'react-markdown';
 import remarkGfm from 'remark-gfm';
 import { jsx } from 'react/jsx-runtime';
@@ -21,6 +22,11 @@ function codeFromPre(children) {
   const code = Children.toArray(raw).map((c) => typeof c === "string" || typeof c === "number" ? String(c) : "").join("").replace(/\n$/, "");
   return { code, language };
 }
+function TableFrame(props) {
+  const [frame, setFrame] = useState(null);
+  useKeyboardScroll(frame, "Table", true, false, "x");
+  return /* @__PURE__ */ jsx("div", { ref: setFrame, className: cn("overflow-x-auto rounded-[var(--ds-radius-md)] border-[length:var(--ds-border-width)] border-[var(--ds-border-default)]", FOCUS_INSET), children: /* @__PURE__ */ jsx("table", { className: "w-full border-collapse text-sm", ...props }) });
+}
 var components = {
   p: ({ node: _n, ...props }) => /* @__PURE__ */ jsx("p", { ...props }),
   a: ({ node: _n, href = "#", children, ...props }) => /* @__PURE__ */ jsx(
@@ -67,7 +73,7 @@ var components = {
   hr: () => /* @__PURE__ */ jsx(Divider, {}),
   strong: ({ node: _n, ...props }) => /* @__PURE__ */ jsx("strong", { className: "font-semibold", ...props }),
   // Wide content scrolls inside its own container; the page never scrolls sideways.
-  table: ({ node: _n, ...props }) => /* @__PURE__ */ jsx("div", { className: "overflow-x-auto rounded-[var(--ds-radius-md)] border-[length:var(--ds-border-width)] border-[var(--ds-border-default)]", children: /* @__PURE__ */ jsx("table", { className: "w-full border-collapse text-sm", ...props }) }),
+  table: ({ node: _n, ...props }) => /* @__PURE__ */ jsx(TableFrame, { ...props }),
   thead: ({ node: _n, ...props }) => /* @__PURE__ */ jsx("thead", { className: "bg-[var(--ds-bg-muted)]", ...props }),
   th: ({ node: _n, ...props }) => /* @__PURE__ */ jsx("th", { className: "px-ds-3 py-ds-2 text-left text-xs font-semibold uppercase tracking-wide text-[var(--ds-text-secondary)]", ...props }),
   td: ({ node: _n, ...props }) => /* @__PURE__ */ jsx("td", { className: "border-t-[length:var(--ds-border-width)] border-[var(--ds-border-subtle)] px-ds-3 py-ds-2 align-top", ...props }),

package/dist/chat.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../showcase/src/components/MarkdownContent.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;AAgBA,IAAM,UAAA,GAAa,CAAC,IAAA,KAAiB,kBAAA,CAAmB,KAAK,IAAI,CAAA;AAGjE,SAAS,YAAY,QAAA,EAA0D;AAC7E,EAAA,MAAM,OAAO,QAAA,CAAS,OAAA,CAAQ,QAAQ,CAAA,CAAE,KAAK,cAAc,CAAA;AAC3D,EAAA,MAAM,GAAA,GAAM,IAAA,EAAM,KAAA,CAAM,SAAA,IAAa,EAAA;AACrC,EAAA,MAAM,QAAA,GAAW,oBAAA,CAAqB,IAAA,CAAK,GAAG,IAAI,CAAC,CAAA;AACnD,EAAA,MAAM,GAAA,GAAM,IAAA,GAAO,IAAA,CAAK,KAAA,CAAM,QAAA,GAAW,QAAA;AACzC,EAAA,MAAM,IAAA,GAAO,QAAA,CAAS,OAAA,CAAQ,GAAG,CAAA,CAC9B,IAAI,CAAC,CAAA,KAAO,OAAO,CAAA,KAAM,QAAA,IAAY,OAAO,MAAM,QAAA,GAAW,MAAA,CAAO,CAAC,CAAA,GAAI,EAAG,CAAA,CAC5E,KAAK,EAAE,CAAA,CACP,OAAA,CAAQ,KAAA,EAAO,EAAE,CAAA;AACpB,EAAA,OAAO,EAAE,MAAM,QAAA,EAAS;AAC1B;AAIA,IAAM,UAAA,GAAyB;AAAA,EAC7B,CAAA,EAAG,CAAC,EAAE,IAAA,EAAM,EAAA,EAAI,GAAG,KAAA,EAAM,qBAAc,GAAA,CAAC,GAAA,EAAA,EAAG,GAAG,KAAA,EAAO,CAAA;AAAA,EACrD,CAAA,EAAG,CAAC,EAAE,IAAA,EAAM,EAAA,EAAI,OAAO,GAAA,EAAK,QAAA,EAAU,GAAG,KAAA,EAAM,qBAC7C,GAAA;AAAA,IAAC,IAAA;AAAA,IAAA;AAAA,MACC,IAAA;AAAA,MACA,SAAA,EAAU,QAAA;AAAA,MACT,GAAI,UAAA,CAAW,IAAI,CAAA,GAAI,EAAE,QAAQ,QAAA,EAAU,GAAA,EAAK,qBAAA,EAAsB,GAAI,EAAC;AAAA,MAC3E,GAAI,KAAA;AAAA,MAEJ;AAAA;AAAA,GACH;AAAA,EAEF,KAAK,CAAC,EAAE,IAAA,EAAM,EAAA,EAAI,UAAS,KAAgB;AACzC,IAAA,MAAM,EAAE,IAAA,EAAM,QAAA,EAAS,GAAI,YAAY,QAAQ,CAAA;AAC/C,IAAA,uBAAO,GAAA,CAAC,SAAA,EAAA,EAAU,IAAA,EAAY,QAAA,EAAoB,CAAA;AAAA,EACpD,CAAA;AAAA,EACA,IAAA,EAAM,CAAC,EAAE,IAAA,EAAM,IAAI,SAAA,EAAW,QAAA,EAAU,GAAG,KAAA,EAAM,qBAC/C,GAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,EAAA;AAAA,QACT,4HAAA;AAAA,QACA;AAAA,OACF;AAAA,MACC,GAAG,KAAA;AAAA,MAEH;AAAA;AAAA,GACH;AAAA,EAEF,EAAA,EAAI,CAAC,EAAE,IAAA,EAAM,EAAA,EAAI,GAAG,KAAA,EAAM,qBAAe,GAAA,CAAC,IAAA,EAAA,EAAG,SAAA,EAAU,gCAAA,EAAkC,GAAG,KAAA,EAAO,CAAA;AAAA,EACnG,EAAA,EAAI,CAAC,EAAE,IAAA,EAAM,EAAA,EAAI,GAAG,KAAA,EAAM,qBAAe,GAAA,CAAC,IAAA,EAAA,EAAG,SAAA,EAAU,mCAAA,EAAqC,GAAG,KAAA,EAAO,CAAA;AAAA,EACtG,EAAA,EAAI,CAAC,EAAE,IAAA,EAAM,EAAA,EAAI,GAAG,KAAA,EAAM,qBAAe,GAAA,CAAC,IAAA,EAAA,EAAI,GAAG,KAAA,EAAO,CAAA;AAAA,EACxD,EAAA,EAAI,CAAC,EAAE,IAAA,EAAM,EAAA,EAAI,GAAG,KAAA,EAAM,qBAAe,GAAA,CAAC,IAAA,EAAA,EAAG,SAAA,EAAU,uDAAA,EAAyD,GAAG,KAAA,EAAO,CAAA;AAAA,EAC1H,EAAA,EAAI,CAAC,EAAE,IAAA,EAAM,EAAA,EAAI,GAAG,KAAA,EAAM,qBAAe,GAAA,CAAC,IAAA,EAAA,EAAG,SAAA,EAAU,uDAAA,EAAyD,GAAG,KAAA,EAAO,CAAA;AAAA,EAC1H,EAAA,EAAI,CAAC,EAAE,IAAA,EAAM,EAAA,EAAI,GAAG,KAAA,EAAM,qBAAe,GAAA,CAAC,IAAA,EAAA,EAAG,SAAA,EAAU,qDAAA,EAAuD,GAAG,KAAA,EAAO,CAAA;AAAA,EACxH,EAAA,EAAI,CAAC,EAAE,IAAA,EAAM,EAAA,EAAI,GAAG,KAAA,EAAM,qBAAe,GAAA,CAAC,IAAA,EAAA,EAAG,SAAA,EAAU,qDAAA,EAAuD,GAAG,KAAA,EAAO,CAAA;AAAA,EACxH,EAAA,EAAI,CAAC,EAAE,IAAA,EAAM,EAAA,EAAI,GAAG,KAAA,EAAM,qBAAe,GAAA,CAAC,IAAA,EAAA,EAAG,SAAA,EAAU,mDAAA,EAAqD,GAAG,KAAA,EAAO,CAAA;AAAA,EACtH,EAAA,EAAI,CAAC,EAAE,IAAA,EAAM,EAAA,EAAI,GAAG,KAAA,EAAM,qBAAe,GAAA,CAAC,IAAA,EAAA,EAAG,SAAA,EAAU,qDAAA,EAAuD,GAAG,KAAA,EAAO,CAAA;AAAA,EACxH,YAAY,CAAC,EAAE,MAAM,EAAA,EAAI,GAAG,OAAM,qBAChC,GAAA;AAAA,IAAC,YAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAU,4HAAA;AAAA,MACT,GAAG;AAAA;AAAA,GACN;AAAA,EAEF,EAAA,EAAI,sBAAM,GAAA,CAAC,OAAA,EAAA,EAAQ,CAAA;AAAA,EACnB,MAAA,EAAQ,CAAC,EAAE,IAAA,EAAM,EAAA,EAAI,GAAG,KAAA,EAAM,qBAAmB,GAAA,CAAC,QAAA,EAAA,EAAO,SAAA,EAAU,eAAA,EAAiB,GAAG,KAAA,EAAO,CAAA;AAAA;AAAA,EAE9F,OAAO,CAAC,EAAE,MAAM,EAAA,EAAI,GAAG,OAAM,qBAC3B,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,0HACb,QAAA,kBAAA,GAAA,CAAC,OAAA,EAAA,EAAM,WAAU,gCAAA,EAAkC,GAAG,OAAO,CAAA,EAC/D,CAAA;AAAA,EAEF,KAAA,EAAO,CAAC,EAAE,IAAA,EAAM,EAAA,EAAI,GAAG,KAAA,EAAM,qBAAkB,GAAA,CAAC,OAAA,EAAA,EAAM,SAAA,EAAU,yBAAA,EAA2B,GAAG,KAAA,EAAO,CAAA;AAAA,EACrG,EAAA,EAAI,CAAC,EAAE,IAAA,EAAM,EAAA,EAAI,GAAG,KAAA,EAAM,qBACxB,GAAA,CAAC,IAAA,EAAA,EAAG,SAAA,EAAU,yGAAA,EAA2G,GAAG,KAAA,EAAO,CAAA;AAAA,EAErI,EAAA,EAAI,CAAC,EAAE,IAAA,EAAM,EAAA,EAAI,GAAG,KAAA,EAAM,qBACxB,GAAA,CAAC,IAAA,EAAA,EAAG,SAAA,EAAU,qGAAA,EAAuG,GAAG,KAAA,EAAO,CAAA;AAAA,EAEjI,KAAK,CAAC,EAAE,IAAA,EAAM,EAAA,EAAI,MAAM,EAAA,EAAI,GAAG,KAAA,EAAM,yBAAiB,KAAA,EAAA,EAAI,GAAA,EAAU,SAAA,EAAU,0CAAA,EAA4C,GAAG,KAAA,EAAO;AACtI,CAAA;AAcA,IAAM,eAAA,GAAkB,EAAA;AAAA,EACtB,0EAAA;AAAA,EACA;AACF,CAAA;AAEA,IAAM,QAAA,GAAW,KAAK,SAAS,oBAAA,CAAqB,EAAE,QAAA,EAAU,SAAA,EAAW,WAAU,EAAyB;AAC5G,EAAA,uBACE,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,EAAA,CAAG,oEAAA,EAAsE,SAAA,IAAa,iBAAiB,SAAS,CAAA;AAAA,MAC3H,eAAA,EAAc,EAAA;AAAA,MACd,kBAAgB,SAAA,IAAa,MAAA;AAAA,MAE7B,QAAA,kBAAA,GAAA,CAAC,YAAS,aAAA,EAAe,CAAC,SAAS,CAAA,EAAG,UAAA,EAAwB,QAAA,EAAQ,IAAA,EACnE,QAAA,EACH;AAAA;AAAA,GACF;AAEJ,CAAC,CAAA;AAIM,SAAS,gBAAgB,KAAA,EAA6B;AAC3D,EAAA,uBAAO,GAAA,CAAC,QAAA,EAAA,EAAU,GAAG,KAAA,EAAO,CAAA;AAC9B","file":"chat.js","sourcesContent":["import { memo, Children, isValidElement, type ComponentProps, type ReactElement, type ReactNode } from \"react\";\nimport Markdown, { type Components } from \"react-markdown\";\nimport remarkGfm from \"remark-gfm\";\nimport { cn } from \"../lib/utils\";\nimport { CodeBlock } from \"./CodeBlock\";\nimport { Link } from \"./Link\";\nimport { Divider } from \"./Divider\";\n\nexport interface MarkdownContentProps {\n  /** The markdown source — a model's reply, an API's description. Raw HTML in it is never rendered. */\n  children: string;\n  /** Show a caret at the end of the last block while the source is still arriving. Pass a message's status === \"streaming\" from ChatMessageList's renderContent. */\n  streaming?: boolean;\n  className?: string;\n}\n\nconst isExternal = (href: string) => /^(https?:)?\\/\\//i.test(href);\n\n/** Pull the code string and language out of the single <code> child react-markdown gives a <pre>. */\nfunction codeFromPre(children: ReactNode): { code: string; language?: string } {\n  const only = Children.toArray(children).find(isValidElement) as ReactElement<{ className?: string; children?: ReactNode }> | undefined;\n  const cls = only?.props.className ?? \"\";\n  const language = /language-([\\w+-]+)/.exec(cls)?.[1];\n  const raw = only ? only.props.children : children;\n  const code = Children.toArray(raw)\n    .map((c) => (typeof c === \"string\" || typeof c === \"number\" ? String(c) : \"\"))\n    .join(\"\")\n    .replace(/\\n$/, \"\");\n  return { code, language };\n}\n\ntype P<T extends keyof React.JSX.IntrinsicElements> = ComponentProps<T> & { node?: unknown };\n\nconst components: Components = {\n  p: ({ node: _n, ...props }: P<\"p\">) => <p {...props} />,\n  a: ({ node: _n, href = \"#\", children, ...props }: P<\"a\">) => (\n    <Link\n      href={href}\n      underline=\"always\"\n      {...(isExternal(href) ? { target: \"_blank\", rel: \"noopener noreferrer\" } : {})}\n      {...(props as Record<string, unknown>)}\n    >\n      {children}\n    </Link>\n  ),\n  pre: ({ node: _n, children }: P<\"pre\">) => {\n    const { code, language } = codeFromPre(children);\n    return <CodeBlock code={code} language={language} />;\n  },\n  code: ({ node: _n, className, children, ...props }: P<\"code\">) => (\n    <code\n      className={cn(\n        \"rounded-[var(--ds-radius-sm)] bg-[var(--ds-bg-muted)] px-ds-1 py-[1px] font-[family-name:var(--ds-font-mono)] text-[0.9em]\",\n        className,\n      )}\n      {...props}\n    >\n      {children}\n    </code>\n  ),\n  ul: ({ node: _n, ...props }: P<\"ul\">) => <ul className=\"list-disc space-y-ds-1 pl-ds-5\" {...props} />,\n  ol: ({ node: _n, ...props }: P<\"ol\">) => <ol className=\"list-decimal space-y-ds-1 pl-ds-5\" {...props} />,\n  li: ({ node: _n, ...props }: P<\"li\">) => <li {...props} />,\n  h1: ({ node: _n, ...props }: P<\"h1\">) => <h3 className=\"text-base font-semibold text-[var(--ds-text-primary)]\" {...props} />,\n  h2: ({ node: _n, ...props }: P<\"h2\">) => <h3 className=\"text-base font-semibold text-[var(--ds-text-primary)]\" {...props} />,\n  h3: ({ node: _n, ...props }: P<\"h3\">) => <h4 className=\"text-sm font-semibold text-[var(--ds-text-primary)]\" {...props} />,\n  h4: ({ node: _n, ...props }: P<\"h4\">) => <h4 className=\"text-sm font-semibold text-[var(--ds-text-primary)]\" {...props} />,\n  h5: ({ node: _n, ...props }: P<\"h5\">) => <h5 className=\"text-sm font-medium text-[var(--ds-text-primary)]\" {...props} />,\n  h6: ({ node: _n, ...props }: P<\"h6\">) => <h6 className=\"text-sm font-medium text-[var(--ds-text-secondary)]\" {...props} />,\n  blockquote: ({ node: _n, ...props }: P<\"blockquote\">) => (\n    <blockquote\n      className=\"border-l-[length:calc(var(--ds-border-width)*2)] border-[var(--ds-border-default)] pl-ds-3 text-[var(--ds-text-secondary)]\"\n      {...props}\n    />\n  ),\n  hr: () => <Divider />,\n  strong: ({ node: _n, ...props }: P<\"strong\">) => <strong className=\"font-semibold\" {...props} />,\n  // Wide content scrolls inside its own container; the page never scrolls sideways.\n  table: ({ node: _n, ...props }: P<\"table\">) => (\n    <div className=\"overflow-x-auto rounded-[var(--ds-radius-md)] border-[length:var(--ds-border-width)] border-[var(--ds-border-default)]\">\n      <table className=\"w-full border-collapse text-sm\" {...props} />\n    </div>\n  ),\n  thead: ({ node: _n, ...props }: P<\"thead\">) => <thead className=\"bg-[var(--ds-bg-muted)]\" {...props} />,\n  th: ({ node: _n, ...props }: P<\"th\">) => (\n    <th className=\"px-ds-3 py-ds-2 text-left text-xs font-semibold uppercase tracking-wide text-[var(--ds-text-secondary)]\" {...props} />\n  ),\n  td: ({ node: _n, ...props }: P<\"td\">) => (\n    <td className=\"border-t-[length:var(--ds-border-width)] border-[var(--ds-border-subtle)] px-ds-3 py-ds-2 align-top\" {...props} />\n  ),\n  img: ({ node: _n, alt = \"\", ...props }: P<\"img\">) => <img alt={alt} className=\"max-w-full rounded-[var(--ds-radius-md)]\" {...props} />,\n};\n\n/**\n * Renders markdown (GitHub flavour: tables, task lists, strikethrough) with\n * Gridsmith primitives: fenced code becomes CodeBlock, links become Link,\n * a rule becomes Divider, everything else is token-styled markup. Raw HTML is\n * not rendered — the source is untrusted by default. Memoised: an unchanged\n * message never re-parses; a streaming message re-parses only its own string.\n *\n * Lives on the `gridsmith-ui/chat` entry point (react-markdown and remark-gfm\n * are optional peers), so apps without a chat never load a markdown parser.\n */\n// The caret is a pseudo-element on the last block, so it sits at the end of the\n// last line of text instead of on a line of its own below a block element.\nconst STREAMING_CARET = cn(\n  \"[&>:last-child]:after:content-['▍'] [&>:last-child]:after:ml-ds-0.5\",\n  \"[&>:last-child]:after:text-[var(--ds-accent-ink)] [&>:last-child]:after:animate-pulse\",\n);\n\nconst Memoised = memo(function MarkdownContentInner({ children, streaming, className }: MarkdownContentProps) {\n  return (\n    <div\n      className={cn(\"space-y-ds-4 text-sm leading-relaxed text-[var(--ds-text-primary)]\", streaming && STREAMING_CARET, className)}\n      data-markdown=\"\"\n      data-streaming={streaming || undefined}\n    >\n      <Markdown remarkPlugins={[remarkGfm]} components={components} skipHtml>\n        {children}\n      </Markdown>\n    </div>\n  );\n});\n\n// A plain function export so the registry extractor (which reads `export function`)\n// documents it; the memo above still skips re-parsing unchanged sources.\nexport function MarkdownContent(props: MarkdownContentProps) {\n  return <Memoised {...props} />;\n}\n"]}
+{"version":3,"sources":["../../../showcase/src/components/MarkdownContent.tsx"],"names":[],"mappings":"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","file":"chat.js","sourcesContent":["import { memo, Children, isValidElement, useState, type ComponentProps, type ReactElement, type ReactNode } from \"react\";\nimport Markdown, { type Components } from \"react-markdown\";\nimport remarkGfm from \"remark-gfm\";\nimport { cn, FOCUS_INSET } from \"../lib/utils\";\nimport { useKeyboardScroll } from \"../lib/use-keyboard-scroll\";\nimport { CodeBlock } from \"./CodeBlock\";\nimport { Link } from \"./Link\";\nimport { Divider } from \"./Divider\";\n\nexport interface MarkdownContentProps {\n  /** The markdown source — a model's reply, an API's description. Raw HTML in it is never rendered. */\n  children: string;\n  /** Show a caret at the end of the last block while the source is still arriving. Pass a message's status === \"streaming\" from ChatMessageList's renderContent. */\n  streaming?: boolean;\n  className?: string;\n}\n\nconst isExternal = (href: string) => /^(https?:)?\\/\\//i.test(href);\n\n/** Pull the code string and language out of the single <code> child react-markdown gives a <pre>. */\nfunction codeFromPre(children: ReactNode): { code: string; language?: string } {\n  const only = Children.toArray(children).find(isValidElement) as ReactElement<{ className?: string; children?: ReactNode }> | undefined;\n  const cls = only?.props.className ?? \"\";\n  const language = /language-([\\w+-]+)/.exec(cls)?.[1];\n  const raw = only ? only.props.children : children;\n  const code = Children.toArray(raw)\n    .map((c) => (typeof c === \"string\" || typeof c === \"number\" ? String(c) : \"\"))\n    .join(\"\")\n    .replace(/\\n$/, \"\");\n  return { code, language };\n}\n\n/**\n * A table in its own frame, which scrolls sideways when the table is wider; with nothing in it to Tab to, the frame is\n * a Tab stop while it scrolls, so a keyboard can scroll it too (Sprint 25.30 item 2).\n */\nfunction TableFrame(props: ComponentProps<\"table\">) {\n  const [frame, setFrame] = useState<HTMLDivElement | null>(null);\n  useKeyboardScroll(frame, \"Table\", true, false, \"x\");\n  return (\n    <div ref={setFrame} className={cn(\"overflow-x-auto rounded-[var(--ds-radius-md)] border-[length:var(--ds-border-width)] border-[var(--ds-border-default)]\", FOCUS_INSET)}>\n      <table className=\"w-full border-collapse text-sm\" {...props} />\n    </div>\n  );\n}\n\ntype P<T extends keyof React.JSX.IntrinsicElements> = ComponentProps<T> & { node?: unknown };\n\nconst components: Components = {\n  p: ({ node: _n, ...props }: P<\"p\">) => <p {...props} />,\n  a: ({ node: _n, href = \"#\", children, ...props }: P<\"a\">) => (\n    <Link\n      href={href}\n      underline=\"always\"\n      {...(isExternal(href) ? { target: \"_blank\", rel: \"noopener noreferrer\" } : {})}\n      {...(props as Record<string, unknown>)}\n    >\n      {children}\n    </Link>\n  ),\n  pre: ({ node: _n, children }: P<\"pre\">) => {\n    const { code, language } = codeFromPre(children);\n    return <CodeBlock code={code} language={language} />;\n  },\n  code: ({ node: _n, className, children, ...props }: P<\"code\">) => (\n    <code\n      className={cn(\n        \"rounded-[var(--ds-radius-sm)] bg-[var(--ds-bg-muted)] px-ds-1 py-[1px] font-[family-name:var(--ds-font-mono)] text-[0.9em]\",\n        className,\n      )}\n      {...props}\n    >\n      {children}\n    </code>\n  ),\n  ul: ({ node: _n, ...props }: P<\"ul\">) => <ul className=\"list-disc space-y-ds-1 pl-ds-5\" {...props} />,\n  ol: ({ node: _n, ...props }: P<\"ol\">) => <ol className=\"list-decimal space-y-ds-1 pl-ds-5\" {...props} />,\n  li: ({ node: _n, ...props }: P<\"li\">) => <li {...props} />,\n  h1: ({ node: _n, ...props }: P<\"h1\">) => <h3 className=\"text-base font-semibold text-[var(--ds-text-primary)]\" {...props} />,\n  h2: ({ node: _n, ...props }: P<\"h2\">) => <h3 className=\"text-base font-semibold text-[var(--ds-text-primary)]\" {...props} />,\n  h3: ({ node: _n, ...props }: P<\"h3\">) => <h4 className=\"text-sm font-semibold text-[var(--ds-text-primary)]\" {...props} />,\n  h4: ({ node: _n, ...props }: P<\"h4\">) => <h4 className=\"text-sm font-semibold text-[var(--ds-text-primary)]\" {...props} />,\n  h5: ({ node: _n, ...props }: P<\"h5\">) => <h5 className=\"text-sm font-medium text-[var(--ds-text-primary)]\" {...props} />,\n  h6: ({ node: _n, ...props }: P<\"h6\">) => <h6 className=\"text-sm font-medium text-[var(--ds-text-secondary)]\" {...props} />,\n  blockquote: ({ node: _n, ...props }: P<\"blockquote\">) => (\n    <blockquote\n      className=\"border-l-[length:calc(var(--ds-border-width)*2)] border-[var(--ds-border-default)] pl-ds-3 text-[var(--ds-text-secondary)]\"\n      {...props}\n    />\n  ),\n  hr: () => <Divider />,\n  strong: ({ node: _n, ...props }: P<\"strong\">) => <strong className=\"font-semibold\" {...props} />,\n  // Wide content scrolls inside its own container; the page never scrolls sideways.\n  table: ({ node: _n, ...props }: P<\"table\">) => <TableFrame {...props} />,\n  thead: ({ node: _n, ...props }: P<\"thead\">) => <thead className=\"bg-[var(--ds-bg-muted)]\" {...props} />,\n  th: ({ node: _n, ...props }: P<\"th\">) => (\n    <th className=\"px-ds-3 py-ds-2 text-left text-xs font-semibold uppercase tracking-wide text-[var(--ds-text-secondary)]\" {...props} />\n  ),\n  td: ({ node: _n, ...props }: P<\"td\">) => (\n    <td className=\"border-t-[length:var(--ds-border-width)] border-[var(--ds-border-subtle)] px-ds-3 py-ds-2 align-top\" {...props} />\n  ),\n  img: ({ node: _n, alt = \"\", ...props }: P<\"img\">) => <img alt={alt} className=\"max-w-full rounded-[var(--ds-radius-md)]\" {...props} />,\n};\n\n/**\n * Renders markdown (GitHub flavour: tables, task lists, strikethrough) with\n * Gridsmith primitives: fenced code becomes CodeBlock, links become Link,\n * a rule becomes Divider, everything else is token-styled markup. Raw HTML is\n * not rendered — the source is untrusted by default. Memoised: an unchanged\n * message never re-parses; a streaming message re-parses only its own string.\n *\n * Lives on the `gridsmith-ui/chat` entry point (react-markdown and remark-gfm\n * are optional peers), so apps without a chat never load a markdown parser.\n */\n// The caret is a pseudo-element on the last block, so it sits at the end of the\n// last line of text instead of on a line of its own below a block element.\nconst STREAMING_CARET = cn(\n  \"[&>:last-child]:after:content-['▍'] [&>:last-child]:after:ml-ds-0.5\",\n  \"[&>:last-child]:after:text-[var(--ds-accent-ink)] [&>:last-child]:after:animate-pulse\",\n);\n\nconst Memoised = memo(function MarkdownContentInner({ children, streaming, className }: MarkdownContentProps) {\n  return (\n    <div\n      className={cn(\"space-y-ds-4 text-sm leading-relaxed text-[var(--ds-text-primary)]\", streaming && STREAMING_CARET, className)}\n      data-markdown=\"\"\n      data-streaming={streaming || undefined}\n    >\n      <Markdown remarkPlugins={[remarkGfm]} components={components} skipHtml>\n        {children}\n      </Markdown>\n    </div>\n  );\n});\n\n// A plain function export so the registry extractor (which reads `export function`)\n// documents it; the memo above still skips re-parsing unchanged sources.\nexport function MarkdownContent(props: MarkdownContentProps) {\n  return <Memoised {...props} />;\n}\n"]}

package/dist/{chunk-OIOII5L6.js → chunk-4HJDOZ2M.js}

@@ -1,8 +1,17 @@
 "use client";
-import { useLatest } from './chunk-WH2FUFAC.js';
-import { useRef, useInsertionEffect, useEffect, useCallback, useState, useMemo, useLayoutEffect } from 'react';
+import { useRef, useLayoutEffect, useInsertionEffect, useEffect, useCallback, useState, useMemo } from 'react';
 import { flushSync } from 'react-dom';
 
+// ../../showcase/src/lib/focus.ts
+function useLatest(value) {
+  const ref = useRef(value);
+  useLayoutEffect(() => {
+    ref.current = value;
+  });
+  return ref;
+}
+
+// ../../showcase/src/lib/focus.ts
 var FOCUSABLE = 'a[href], button:not(:disabled), input:not(:disabled), select:not(:disabled), textarea:not(:disabled), [tabindex]:not([tabindex="-1"]), [contenteditable]:not([contenteditable="false"])';
 var FIELD = "input, select, textarea, [contenteditable='true']";
 var CONTROL_ANCESTOR = 'a[href], button, summary, label, [role="button"], [role="link"], [role="option"], [role="menuitem"], [role="menuitemcheckbox"], [role="menuitemradio"], [role="tab"], [role="treeitem"], [role="row"], [role="gridcell"], [role="checkbox"], [role="radio"], [role="switch"]';
@@ -55,10 +64,34 @@ function focusInitial(root, opts = {}) {
 function useFocusBeforeOpen(open) {
   const before = useRef(null);
   useInsertionEffect(() => {
-    if (open) before.current = document.activeElement;
+    trackFocus();
+    if (!open) return;
+    const active = document.activeElement;
+    before.current = !active || active === document.body ? justLost() ?? active : active;
   }, [open]);
   return before;
 }
+var lastFocused = null;
+var lastFocusedAt = 0;
+var lastActedAt = 0;
+var tracking = false;
+function trackFocus() {
+  if (tracking || typeof document === "undefined") return;
+  tracking = true;
+  document.addEventListener("focusin", (e) => {
+    lastFocused = e.target instanceof Element ? e.target : null;
+    lastFocusedAt = performance.now();
+  }, true);
+  const acted = () => {
+    lastActedAt = performance.now();
+  };
+  for (const type of ["keydown", "pointerdown", "click"]) document.addEventListener(type, acted, true);
+}
+function justLost() {
+  const recent = lastActedAt >= lastFocusedAt && performance.now() - lastActedAt < 1e3;
+  return lastFocused && !lastFocused.isConnected && recent ? lastFocused : null;
+}
+trackFocus();
 function pathAbove(to, from) {
   const up = to.replace(/\/+$/, "");
   return from.startsWith(`${up}/`) && from.replace(/\/+$/, "") !== up;
@@ -74,6 +107,64 @@ function deletedRow(before, now) {
   for (let j = k; j < (refilled ? last : now.length); j++) if (now[j] !== before[j + 1]) return -1;
   return k;
 }
+function focusForTheMoment(el) {
+  const own = el.getAttribute("tabindex");
+  if (own === null) el.setAttribute("tabindex", "-1");
+  el.focus();
+  if (document.activeElement !== el) {
+    if (own === null) el.removeAttribute("tabindex");
+    return false;
+  }
+  let ring = false;
+  try {
+    ring = el.matches(":focus-visible");
+  } catch {
+  }
+  const { outline, outlineOffset } = el.style;
+  if (ring) {
+    el.style.outline = "2px solid var(--ds-focus)";
+    el.style.outlineOffset = "2px";
+  }
+  el.addEventListener("blur", () => {
+    if (own === null) el.removeAttribute("tabindex");
+    if (ring) Object.assign(el.style, { outline, outlineOffset });
+  }, { once: true });
+  return true;
+}
+var HEADING = 'h1, h2, h3, h4, h5, h6, [role="heading"]';
+var LAST_RESORT_MS = 200;
+function placesOf(el) {
+  const places = [];
+  for (let c = el, box = el.parentElement; box && box !== document.body && box.parentElement && box.parentElement !== document.body; c = box, box = box.parentElement) {
+    places.push({ box, prev: c.previousElementSibling, next: c.nextElementSibling });
+  }
+  return places;
+}
+function landLastResort(places, closing) {
+  const counts = (el) => !closing?.contains(el);
+  const areas = [];
+  const at = places.findIndex((p) => p.box.isConnected);
+  if (at >= 0) {
+    const { box, prev, next } = places[at];
+    const kids = Array.from(box.children);
+    const from = prev?.parentElement === box ? kids.indexOf(prev) + 1 : 0;
+    const to = next?.parentElement === box ? kids.indexOf(next) : kids.length;
+    areas.push(kids.slice(from, Math.max(from, to)), ...places.slice(at).map((p) => [p.box]));
+  }
+  const main = document.querySelector('main, [role="main"]');
+  const mainCounts = !!main && counts(main) && isRendered(main);
+  if (mainCounts) areas.push([main]);
+  for (const area of areas) {
+    const stop = area.flatMap((a) => [...isTabStop(a) ? [a] : [], ...tabStops(a)]).find(counts);
+    if (stop) {
+      stop.focus();
+      if (document.activeElement === stop) return true;
+    }
+    const heading = area.flatMap((a) => [...a.matches(HEADING) ? [a] : [], ...a.querySelectorAll(HEADING)]).find((h) => h instanceof HTMLElement && isRendered(h) && counts(h));
+    if (heading && focusForTheMoment(heading)) return true;
+  }
+  return mainCounts && focusForTheMoment(main);
+}
 function rememberFocus(el, { ignoreRoute = false } = {}) {
   const { href, pathname } = location;
   const row = el.closest(ROW);
@@ -86,6 +177,7 @@ function rememberFocus(el, { ignoreRoute = false } = {}) {
   const texts = rows.map((r) => r.textContent ?? "");
   const keyOf = (r) => r?.getAttribute("data-row-key") ?? null;
   const key = keyOf(row);
+  const places = placesOf(el);
   const pageChanged = () => {
     if (ignoreRoute) return false;
     if (location.pathname !== pathname) return !pathAbove(location.pathname, pathname);
@@ -118,16 +210,27 @@ function rememberFocus(el, { ignoreRoute = false } = {}) {
     return k >= 0 && k <= at ? list.children[Math.max(0, at - 1)] ?? void 0 : void 0;
   };
   const neighbour = () => inRow(byKey(keyOf(before)) ?? before) || inRow(byKey(keyOf(after)) ?? after) || !!list?.isConnected && land(tabStops(list)[0]);
+  const lastResort = () => {
+    setTimeout(() => {
+      if (typeof document === "undefined") return;
+      const active = document.activeElement;
+      if (active && active !== document.body && active.isConnected || pageChanged()) return;
+      landLastResort(places);
+    }, LAST_RESORT_MS);
+    return false;
+  };
   let unwatch = null;
   const watch = () => {
     unwatch?.();
     if (!list || typeof MutationObserver === "undefined") return;
-    const observer = new MutationObserver(() => {
+    const observer = new MutationObserver((changes) => {
       if (el.isConnected) return;
       const active = document.activeElement;
       const dropped = !active || active === document.body || !active.isConnected;
       stop();
-      if (dropped && !pageChanged()) neighbour();
+      if (!dropped || pageChanged()) return;
+      const fromList = changes.some((c) => c.target === list || c.target === list.parentNode);
+      if (!(fromList && neighbour())) lastResort();
     });
     const onFocusIn = (e) => {
       if (e.target !== el) stop();
@@ -136,11 +239,12 @@ function rememberFocus(el, { ignoreRoute = false } = {}) {
     function stop() {
       observer.disconnect();
       clearTimeout(timer);
-      document.removeEventListener("focusin", onFocusIn, true);
+      if (typeof document !== "undefined") document.removeEventListener("focusin", onFocusIn, true);
       unwatch = null;
     }
     observer.observe(list, { childList: true });
     if (list.parentNode) observer.observe(list.parentNode, { childList: true });
+    for (const { box } of places) observer.observe(box, { childList: true });
     document.addEventListener("focusin", onFocusIn, true);
     unwatch = stop;
   };
@@ -154,7 +258,90 @@ function rememberFocus(el, { ignoreRoute = false } = {}) {
         return true;
       }
       if (row && !row.isConnected && neighbour()) return true;
-      return land(fallback);
+      return land(fallback) || lastResort();
+    }
+  };
+}
+function useFocusKeptInList(listRef) {
+  useEffect(() => {
+    if (typeof MutationObserver === "undefined") return;
+    let held = null;
+    let observer = null;
+    const forget = () => {
+      held = null;
+      observer?.disconnect();
+      observer = null;
+    };
+    const onFocusIn = (e) => {
+      const list = listRef.current;
+      const t = e.target;
+      if (!list || !(t instanceof HTMLElement) || !list.contains(t)) {
+        if (held) forget();
+        return;
+      }
+      held = rememberFocus(t);
+      if (observer) return;
+      observer = new MutationObserver(() => {
+        const h = held;
+        if (!h || h.el.isConnected) return;
+        const active = document.activeElement;
+        forget();
+        if (!active || active === document.body || !active.isConnected) h.restore();
+      });
+      observer.observe(list, { childList: true, subtree: true });
+    };
+    const onFocusOut = (e) => {
+      if (!held || e.target !== held.el) return;
+      queueMicrotask(() => {
+        if (held?.el.isConnected && !listRef.current?.contains(document.activeElement)) forget();
+      });
+    };
+    document.addEventListener("focusin", onFocusIn, true);
+    document.addEventListener("focusout", onFocusOut, true);
+    return () => {
+      document.removeEventListener("focusin", onFocusIn, true);
+      document.removeEventListener("focusout", onFocusOut, true);
+      const h = held;
+      forget();
+      const active = document.activeElement;
+      if (h && !h.el.isConnected && (!active || active === document.body || !active.isConnected)) h.restore();
+    };
+  }, [listRef]);
+}
+var openers = /* @__PURE__ */ new WeakMap();
+function rememberOpener(active, root) {
+  let own = active instanceof HTMLElement && active !== document.body && active.isConnected ? rememberFocus(active) : null;
+  const controller = !own && root?.id ? document.querySelector(`[aria-controls~="${CSS.escape(root.id)}"]`) : null;
+  if (controller) own = rememberFocus(controller);
+  let around = null;
+  for (let n = active; n && !around; n = n.parentElement) {
+    const opener = openers.get(n);
+    if (opener) around = { root: n, opener };
+  }
+  const back = own ?? around?.opener;
+  if (!back) {
+    if (!root) return null;
+    const places = placesOf(root);
+    const { pathname } = location;
+    return {
+      el: null,
+      restore() {
+        setTimeout(() => {
+          if (typeof document === "undefined") return;
+          const now = document.activeElement;
+          if (now && now !== document.body && now.isConnected && !root.contains(now) || location.pathname !== pathname && !pathAbove(location.pathname, pathname)) return;
+          landLastResort(places, root);
+        }, LAST_RESORT_MS);
+        return false;
+      }
+    };
+  }
+  if (root) openers.set(root, back);
+  return {
+    el: own?.el ?? null,
+    restore(fallback) {
+      if (own?.restore(fallback)) return true;
+      return !!around && !around.root.isConnected && around.opener.restore();
     }
   };
 }
@@ -163,8 +350,7 @@ function useReturnFocus(open, root) {
   const before = useFocusBeforeOpen(open);
   useEffect(() => {
     if (open) {
-      const active2 = before.current;
-      remembered.current = active2 instanceof HTMLElement && active2 !== document.body && active2.isConnected ? rememberFocus(active2) : null;
+      remembered.current = rememberOpener(before.current, root?.current);
       return;
     }
     const r = remembered.current;
@@ -191,10 +377,14 @@ function rovingTabStop(items, isChecked, isDisabled = () => false) {
 function focusAfterRemoval(items, index, fallback) {
   (items[index - 1] ?? items[index] ?? fallback)?.focus();
 }
-function focusAfterSelfRemoval(control, { item, group } = {}) {
+function mayStop(root) {
+  const disabled = (el) => (el instanceof HTMLButtonElement || el instanceof HTMLInputElement || el instanceof HTMLSelectElement || el instanceof HTMLTextAreaElement) && el.disabled;
+  return Array.from(root.querySelectorAll(`${FOCUSABLE}, button:disabled, input:disabled, select:disabled, textarea:disabled`)).filter((el) => disabled(el) ? !(el instanceof HTMLInputElement && el.type === "hidden") : isTabStop(el)).sort((a, b) => a.compareDocumentPosition(b) & Node.DOCUMENT_POSITION_FOLLOWING ? -1 : 1);
+}
+function focusAfterSelfRemoval(control, { item, group, to } = {}) {
   const goes = item ?? control;
   const within = group === void 0 ? goes.parentElement : group;
-  const stops = within ? tabStops(within).filter((el) => !goes.contains(el)) : [];
+  const stops = within ? mayStop(within).filter((el) => !goes.contains(el)) : [];
   const before = stops.filter((el) => goes.compareDocumentPosition(el) & Node.DOCUMENT_POSITION_PRECEDING).reverse();
   const after = stops.filter((el) => goes.compareDocumentPosition(el) & Node.DOCUMENT_POSITION_FOLLOWING);
   const stopsOf = (el) => [...isTabStop(el) ? [el] : [], ...tabStops(el)];
@@ -224,7 +414,8 @@ function focusAfterSelfRemoval(control, { item, group } = {}) {
     within.focus();
     return document.activeElement === within;
   };
-  const place = () => land(sameBefore) || land(before[0]) || land(sameAfter) || land(after[0]) || landOnGroup();
+  const landTo = (el) => land(el) || !!el && el.isConnected && !isTabStop(el) && isRendered(el) && focusForTheMoment(el);
+  const place = () => landTo(typeof to === "function" ? to() : to) || land(sameBefore) || before.some(land) || land(sameAfter) || after.some(land) || landOnGroup();
   if (typeof MutationObserver === "undefined") return () => {
   };
   const observer = new MutationObserver(() => {
@@ -239,7 +430,7 @@ function focusAfterSelfRemoval(control, { item, group } = {}) {
   function stop() {
     observer.disconnect();
     clearTimeout(timer);
-    document.removeEventListener("focusin", onFocusIn, true);
+    if (typeof document !== "undefined") document.removeEventListener("focusin", onFocusIn, true);
   }
   observer.observe(document.body, { childList: true, subtree: true, attributes: true, attributeFilter: ["disabled"] });
   document.addEventListener("focusin", onFocusIn, true);
@@ -338,6 +529,7 @@ function usePopupFocus(open, { trigger, panel, close, tabExits, onTabOut, marked
     const inPanel = active instanceof Node && !!panel.current?.contains(active);
     const opener = active instanceof HTMLElement && active !== document.body && !inPanel ? active : trigger.current;
     remembered.current = opener ? rememberFocus(opener) : null;
+    if (panel.current && remembered.current) openers.set(panel.current, remembered.current);
     lastPress.current = null;
   }, [open, trigger, panel, before]);
   useEffect(() => {
@@ -517,12 +709,13 @@ function useGridKeyboard({ container, active, setActive, keyOf, move, onActivate
   return { onKeyDown, tabIndexOf, focusActive, focus };
 }
 var ALWAYS_TOP = () => true;
-function useFocusTrap(root, active, isTop = ALWAYS_TOP) {
+function useFocusTrap(root, active, isTop = ALWAYS_TOP, also) {
   useEffect(() => {
     if (!active) return;
     const onKeyDown = (e) => {
       if (e.key !== "Tab" || e.defaultPrevented || !root.current || !isTop()) return;
-      const focusable = tabStops(root.current);
+      const scope = [root.current, also?.current].filter((el) => !!el);
+      const focusable = scope.flatMap((el) => tabStops(el)).sort((a, b) => a.compareDocumentPosition(b) & Node.DOCUMENT_POSITION_FOLLOWING ? -1 : 1);
       if (focusable.length === 0) {
         e.preventDefault();
         return;
@@ -530,7 +723,7 @@ function useFocusTrap(root, active, isTop = ALWAYS_TOP) {
       const first = focusable[0];
       const last = focusable[focusable.length - 1];
       const current = document.activeElement;
-      const inside = current instanceof Node && root.current.contains(current);
+      const inside = current instanceof Node && scope.some((el) => el.contains(current));
       if (e.shiftKey) {
         if (!inside || current === first) {
           e.preventDefault();
@@ -543,7 +736,24 @@ function useFocusTrap(root, active, isTop = ALWAYS_TOP) {
     };
     document.addEventListener("keydown", onKeyDown);
     return () => document.removeEventListener("keydown", onKeyDown);
-  }, [root, active, isTop]);
+  }, [root, active, isTop, also]);
+}
+function inertOutside(keep, within) {
+  const made = [];
+  const visit = (el) => {
+    for (const child of Array.from(el.children)) {
+      if (keep.includes(child)) continue;
+      if (keep.some((k) => child.contains(k))) visit(child);
+      else if (!child.hasAttribute("inert")) {
+        child.setAttribute("inert", "");
+        made.push(child);
+      }
+    }
+  };
+  visit(within);
+  return () => {
+    for (const el of made) el.removeAttribute("inert");
+  };
 }
 function useNonModalDialog(root, active, onClose, isTop = ALWAYS_TOP) {
   const onCloseRef = useLatest(onClose);
@@ -566,7 +776,80 @@ function useNonModalDialog(root, active, onClose, isTop = ALWAYS_TOP) {
     return () => document.removeEventListener("keydown", onKeyDown);
   }, [active, root, isTop, onCloseRef]);
 }
+var VIEWPORT_PADDING = 8;
+function usePosition(triggerRef, floatingRef, open, options = {}) {
+  const { side = "bottom", align = "center", offset = 8, flip = true } = options;
+  const [pos, setPos] = useState({ top: 0, left: 0, placement: side });
+  const rafId = useRef(0);
+  const compute = useCallback(() => {
+    const trigger = triggerRef.current;
+    const floating = floatingRef.current;
+    if (!trigger || !floating) return;
+    const tRect = trigger.getBoundingClientRect();
+    const fRect = floating.getBoundingClientRect();
+    const vw = window.innerWidth;
+    const vh = window.innerHeight;
+    let placement = side;
+    if (flip) {
+      if (placement === "bottom" && tRect.bottom + offset + fRect.height > vh - VIEWPORT_PADDING && tRect.top - offset - fRect.height > VIEWPORT_PADDING) {
+        placement = "top";
+      } else if (placement === "top" && tRect.top - offset - fRect.height < VIEWPORT_PADDING && tRect.bottom + offset + fRect.height < vh - VIEWPORT_PADDING) {
+        placement = "bottom";
+      } else if (placement === "right" && tRect.right + offset + fRect.width > vw - VIEWPORT_PADDING && tRect.left - offset - fRect.width > VIEWPORT_PADDING) {
+        placement = "left";
+      } else if (placement === "left" && tRect.left - offset - fRect.width < VIEWPORT_PADDING && tRect.right + offset + fRect.width < vw - VIEWPORT_PADDING) {
+        placement = "right";
+      }
+    }
+    let top;
+    let left;
+    if (placement === "bottom" || placement === "top") {
+      top = placement === "bottom" ? tRect.bottom + offset : tRect.top - fRect.height - offset;
+      switch (align) {
+        case "start":
+          left = tRect.left;
+          break;
+        case "end":
+          left = tRect.right - fRect.width;
+          break;
+        default:
+          left = tRect.left + (tRect.width - fRect.width) / 2;
+      }
+    } else {
+      left = placement === "right" ? tRect.right + offset : tRect.left - fRect.width - offset;
+      switch (align) {
+        case "start":
+          top = tRect.top;
+          break;
+        case "end":
+          top = tRect.bottom - fRect.height;
+          break;
+        default:
+          top = tRect.top + (tRect.height - fRect.height) / 2;
+      }
+    }
+    left = Math.max(VIEWPORT_PADDING, Math.min(left, vw - fRect.width - VIEWPORT_PADDING));
+    top = Math.max(VIEWPORT_PADDING, Math.min(top, vh - fRect.height - VIEWPORT_PADDING));
+    setPos((cur) => cur.top === top && cur.left === left && cur.placement === placement ? cur : { top, left, placement });
+  }, [triggerRef, floatingRef, side, align, offset, flip]);
+  useLayoutEffect(() => {
+    if (!open) return;
+    compute();
+    const onUpdate = () => {
+      cancelAnimationFrame(rafId.current);
+      rafId.current = requestAnimationFrame(compute);
+    };
+    window.addEventListener("scroll", onUpdate, true);
+    window.addEventListener("resize", onUpdate);
+    return () => {
+      cancelAnimationFrame(rafId.current);
+      window.removeEventListener("scroll", onUpdate, true);
+      window.removeEventListener("resize", onUpdate);
+    };
+  }, [open, compute]);
+  return pos;
+}
 
-export { CONTROL_ANCESTOR, FIELD, FOCUSABLE, OVERLAY_CLOSE_ATTR, ZOOM_KEYS, focusAfterRemoval, focusAfterSelfRemoval, focusInitial, isTabStop, rememberFocus, rovingTabStop, tabStops, useCloseOnFocusOut, useFocusBeforeOpen, useFocusLeave, useFocusTrap, useGridKeyboard, useNonModalDialog, useOverlayLayer, usePopupFocus, usePressMarks, useReturnFocus };
-//# sourceMappingURL=chunk-OIOII5L6.js.map
-//# sourceMappingURL=chunk-OIOII5L6.js.map
+export { CONTROL_ANCESTOR, FIELD, FOCUSABLE, OVERLAY_CLOSE_ATTR, ZOOM_KEYS, focusAfterRemoval, focusAfterSelfRemoval, focusInitial, inertOutside, isTabStop, rememberFocus, rememberOpener, rovingTabStop, tabStops, useCloseOnFocusOut, useFocusBeforeOpen, useFocusKeptInList, useFocusLeave, useFocusTrap, useGridKeyboard, useLatest, useNonModalDialog, useOverlayLayer, usePopupFocus, usePosition, usePressMarks, useReturnFocus };
+//# sourceMappingURL=chunk-4HJDOZ2M.js.map
+//# sourceMappingURL=chunk-4HJDOZ2M.js.map