@astryxdesign/core 0.7.5-canary.10ca8ea → 0.7.5-canary.116f54b

package/dist/Chat/ChatComposer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ChatComposer.d.ts","sourceRoot":"","sources":["../../src/Chat/ChatComposer.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,KAAK,EAAE,EAMZ,KAAK,SAAS,EAGf,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAgC5C,MAAM,MAAM,kBAAkB,GAAG;IAC/B,IAAI,EAAE,OAAO,GAAG,SAAS,CAAC;IAC1B,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG,SAAS,GAAG,UAAU,GAAG,UAAU,CAAC;AAEtE,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAC7C,SAAS,CAAC,cAAc,CAAC,EACzB,UAAU,GAAG,UAAU,CACxB;IACC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC,+CAA+C;IAC/C,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,kDAAkD;IAClD,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,kFAAkF;IAClF,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,oCAAoC;IACpC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,0CAA0C;IAC1C,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,qCAAqC;IACrC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,uCAAuC;IACvC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,sBAAsB;IACtB,OAAO,CAAC,EAAE,mBAAmB,CAAC;IAC9B;;;;;;OAMG;IACH,SAAS,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC;IAI3B,6GAA6G;IAC7G,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,yHAAyH;IACzH,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B,yGAAyG;IACzG,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B,2DAA2D;IAC3D,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,gHAAgH;IAChH,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B,gHAAgH;IAChH,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,gDAAgD;IAChD,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,iEAAiE;IACjE,MAAM,CAAC,EAAE,kBAAkB,CAAC;IAC5B,oDAAoD;IACpD,cAAc,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAC;CACnC;AAkND;;;;;;;;;;;GAWG;AACH,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,qBAwOpD;yBAxOe,YAAY"}
+{"version":3,"file":"ChatComposer.d.ts","sourceRoot":"","sources":["../../src/Chat/ChatComposer.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,KAAK,EAAE,EAKZ,KAAK,SAAS,EAGf,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAgC5C,MAAM,MAAM,kBAAkB,GAAG;IAC/B,IAAI,EAAE,OAAO,GAAG,SAAS,CAAC;IAC1B,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG,SAAS,GAAG,UAAU,GAAG,UAAU,CAAC;AAEtE,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAC7C,SAAS,CAAC,cAAc,CAAC,EACzB,UAAU,GAAG,UAAU,CACxB;IACC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC,+CAA+C;IAC/C,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,kDAAkD;IAClD,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,kFAAkF;IAClF,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,oCAAoC;IACpC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,0CAA0C;IAC1C,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,qCAAqC;IACrC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,uCAAuC;IACvC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,sBAAsB;IACtB,OAAO,CAAC,EAAE,mBAAmB,CAAC;IAC9B;;;;;;OAMG;IACH,SAAS,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC;IAI3B,6GAA6G;IAC7G,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,yHAAyH;IACzH,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B,yGAAyG;IACzG,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B,2DAA2D;IAC3D,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,gHAAgH;IAChH,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B,gHAAgH;IAChH,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,gDAAgD;IAChD,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,iEAAiE;IACjE,MAAM,CAAC,EAAE,kBAAkB,CAAC;IAC5B,oDAAoD;IACpD,cAAc,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAC;CACnC;AAkND;;;;;;;;;;;GAWG;AACH,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,qBAmOpD;yBAnOe,YAAY"}

package/dist/Chat/ChatComposer.js

@@ -22,7 +22,7 @@
  * - /apps/storybook/stories/ChatComposer.stories.tsx
  * - /packages/cli/assets/templates/blocks/components/ChatComposer/ (block examples)
  */
-import React, { useState, useCallback, useEffect, useRef, useMemo } from 'react';
+import React, { useState, useCallback, useRef, useMemo } from 'react';
 import * as stylex from '@stylexjs/stylex';
 import "../theme/tokens.stylex.js";
 import { colorVars, spacingVars, radiusVars, shadowVars, durationVars, easeVars, borderVars, typeScaleVars, typographyVars } from "../theme/tokens.stylex.js";
@@ -33,7 +33,7 @@ import { ChatComposerContext } from "./ChatContext.js";
 import { ChatSendButton } from "./ChatSendButton.js";
 import { themeProps } from "../utils/themeProps.js";
 import { useTranslator } from "../i18n/index.js";
-import { useAnnounce } from "../hooks/useAnnounce.js";
+import { useAnnounceRenderedText } from "../hooks/useAnnounceRenderedText.js";
 import { focusOutlineStyles } from "../utils/focusOutline.stylex.js";
 import { getInteractionModality, useInteractionModalityTracking } from "../utils/interactionModality.js";
 
@@ -194,28 +194,18 @@ export function ChatComposer(props) {
   }, []);
 
   // The status bar mounts together with its message, and a live region born
-  // holding its text is not reliably announced, so the message goes through
-  // the shared channel instead: errors assertively, warnings politely
-  // (spec:AST-086 FR2, FR5). The ref keeps a rerender or a StrictMode effect
-  // replay from repeating it; clearing the status re-arms it, so the same
-  // message shown again is a new occasion (FR6).
-  const announce = useAnnounce();
-  const statusType = status?.type;
-  const statusMessage = status?.message;
-  const announcedStatusRef = useRef(null);
-  useEffect(() => {
-    if (!statusMessage) {
-      announcedStatusRef.current = null;
-      return;
-    }
-    const occasion = `${statusType}\u0000${statusMessage}`;
-    if (announcedStatusRef.current === occasion) {
-      return;
-    }
-    announcedStatusRef.current = occasion;
-    announce(statusMessage, statusType === 'error' ? 'assertive' : 'polite');
-  }, [announce, statusType, statusMessage]);
+  // holding its text is not reliably announced, so the shared own-content
+  // module announces what the bar renders: errors assertively, warnings
+  // politely, once per occasion, silent for a status already shown when the
+  // page loads (spec:AST-086 FR2, FR5, FR6, FR11; react-component-runtime
+  // INV10). Changing the status type is a new occasion; clearing it re-arms.
+  const statusRef = useRef(null);
+  useAnnounceRenderedText(statusRef, Boolean(status?.message), status?.type ?? '', {
+    skipFirstRender: true,
+    politeness: status?.type === 'error' ? 'assertive' : 'polite'
+  });
   const statusEl = status ? /*#__PURE__*/_jsxs("div", {
+    ref: statusRef,
     ...{
       0: {
         className: "x1n2onr6 x1ja2u2z x78zum5 x6s0dn4 x1txdalj x1pzlopt x141an7d x1ltkj2j x9ynric x1htvmrp xvpcij2 xckg3cf xkvxy4d x6k0y1c"

package/dist/CodeBlock/CodeBlock.d.ts

@@ -20,6 +20,14 @@ export interface CodeBlockProps extends BaseProps<HTMLPreElement> {
     isDiff?: boolean;
     hasCopyButton?: boolean;
     onCopy?: () => void;
+    /**
+     * Your own controls, shown just before Copy: in the header when the block
+     * has one, otherwise beside the code in the top inline-end corner, never
+     * over it. It never creates a header, and activating it never collapses the
+     * block. You own each control's label, state, and action; ghost `sm`
+     * IconButtons match Copy.
+     */
+    endContent?: React.ReactNode;
     isWrapped?: boolean;
     maxHeight?: number | string;
     isCollapsible?: boolean;
@@ -67,7 +75,7 @@ export interface CodeBlockProps extends BaseProps<HTMLPreElement> {
  * <CodeBlock code="const x = 42;" language="javascript" />
  * ```
  */
-export declare function CodeBlock({ code, language, title, hasLanguageLabel, hasLineNumbers, highlightLines, isDiff, hasCopyButton, onCopy, isWrapped, maxHeight, isCollapsible, collapsibleThreshold, size, width: widthProp, container, tokenizer: customTokenizer, highlightMode, syntaxTheme, xstyle, className, style, ref, ...props }: CodeBlockProps): React.JSX.Element;
+export declare function CodeBlock({ code, language, title, hasLanguageLabel, hasLineNumbers, highlightLines, isDiff, hasCopyButton, onCopy, endContent, isWrapped, maxHeight, isCollapsible, collapsibleThreshold, size, width: widthProp, container, tokenizer: customTokenizer, highlightMode, syntaxTheme, xstyle, className, style, ref, ...props }: CodeBlockProps): React.JSX.Element;
 export declare namespace CodeBlock {
     var displayName: string;
 }

package/dist/CodeBlock/CodeBlock.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CodeBlock.d.ts","sourceRoot":"","sources":["../../src/CodeBlock/CodeBlock.tsx"],"names":[],"mappings":"AAoBA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAiC5C,OAAO,EAAc,KAAK,qBAAqB,EAAC,MAAM,iBAAiB,CAAC;AA0dxE,MAAM,WAAW,cAAe,SAAQ,SAAS,CAAC,cAAc,CAAC;IAC/D,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,cAAc,CAAC,EAAE,MAAM,EAAE,CAAC;IAC1B;;;;;;;OAOG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC5B,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IACnB;;;;;;OAMG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;;;;;OAQG;IACH,SAAS,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC/B,SAAS,CAAC,EAAE,CACV,IAAI,EAAE,MAAM,EACZ,QAAQ,EAAE,MAAM,KACb;QAAC,IAAI,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAA;KAAC,EAAE,CAAC;IAClD,aAAa,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,OAAO,CAAC;IAC5C;;;;;;OAMG;IACH,WAAW,CAAC,EAAE,qBAAqB,CAAC;CACrC;AA0SD;;;;;;;;GAQG;AACH,wBAAgB,SAAS,CAAC,EACxB,IAAI,EACJ,QAAsB,EACtB,KAAK,EACL,gBAAuB,EACvB,cAAsB,EACtB,cAAc,EACd,MAAc,EACd,aAAoB,EACpB,MAAM,EACN,SAAiB,EACjB,SAAS,EACT,aAAqB,EACrB,oBAAyB,EACzB,IAAW,EACX,KAAK,EAAE,SAAyB,EAChC,SAAkB,EAClB,SAAS,EAAE,eAAe,EAC1B,aAAsB,EACtB,WAAW,EACX,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,cAAc,qBA2RhB;yBApTe,SAAS"}
+{"version":3,"file":"CodeBlock.d.ts","sourceRoot":"","sources":["../../src/CodeBlock/CodeBlock.tsx"],"names":[],"mappings":"AAoBA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAgC5C,OAAO,EAAc,KAAK,qBAAqB,EAAC,MAAM,iBAAiB,CAAC;AAuexE,MAAM,WAAW,cAAe,SAAQ,SAAS,CAAC,cAAc,CAAC;IAC/D,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,cAAc,CAAC,EAAE,MAAM,EAAE,CAAC;IAC1B;;;;;;;OAOG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB;;;;;;OAMG;IACH,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC5B,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IACnB;;;;;;OAMG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;;;;;OAQG;IACH,SAAS,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC/B,SAAS,CAAC,EAAE,CACV,IAAI,EAAE,MAAM,EACZ,QAAQ,EAAE,MAAM,KACb;QAAC,IAAI,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAA;KAAC,EAAE,CAAC;IAClD,aAAa,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,OAAO,CAAC;IAC5C;;;;;;OAMG;IACH,WAAW,CAAC,EAAE,qBAAqB,CAAC;CACrC;AA0SD;;;;;;;;GAQG;AACH,wBAAgB,SAAS,CAAC,EACxB,IAAI,EACJ,QAAsB,EACtB,KAAK,EACL,gBAAuB,EACvB,cAAsB,EACtB,cAAc,EACd,MAAc,EACd,aAAoB,EACpB,MAAM,EACN,UAAU,EACV,SAAiB,EACjB,SAAS,EACT,aAAqB,EACrB,oBAAyB,EACzB,IAAW,EACX,KAAK,EAAE,SAAyB,EAChC,SAAkB,EAClB,SAAS,EAAE,eAAe,EAC1B,aAAsB,EACtB,WAAW,EACX,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,cAAc,qBAsShB;yBAhUe,SAAS"}

package/dist/CodeBlock/CodeBlock.js

@@ -12,8 +12,8 @@ import { useInsertionEffect, useEffect, useId, useRef, useState, useCallback, us
 import * as React from 'react';
 import * as stylex from '@stylexjs/stylex';
 import "../theme/tokens.stylex.js";
-import { colorVars, spacingVars, radiusVars, typographyVars, fontWeightVars, typeScaleVars, borderVars, durationVars, easeVars, sizeVars } from "../theme/tokens.stylex.js";
-import { mergeProps } from "../utils/index.js";
+import { colorVars, spacingVars, radiusVars, typographyVars, fontWeightVars, typeScaleVars, borderVars, durationVars, easeVars } from "../theme/tokens.stylex.js";
+import { isRenderable, mergeProps } from "../utils/index.js";
 import { useClipboard } from "../hooks/useClipboard.js";
 import { useScrollableArea } from "../hooks/useScrollableArea.js";
 import { Icon } from "../Icon/index.js";
@@ -219,19 +219,6 @@ const styles = {
   copyButton: {
     kMwMTN: "x1mjzq1q",
     $$css: true
-  },
-  copyButtonCorner: {
-    kSGwAc: "x1y8v6su",
-    kUOVxO: "x16j26i2",
-    $$css: true
-  },
-  copyButtonCornerMd: {
-    keoZOQ: "x11xk4k4",
-    $$css: true
-  },
-  copyButtonCornerSm: {
-    keoZOQ: "x1t6j4wq",
-    $$css: true
   }
 };
 
@@ -556,6 +543,7 @@ export function CodeBlock({
   isDiff = false,
   hasCopyButton = true,
   onCopy,
+  endContent,
   isWrapped = false,
   maxHeight,
   isCollapsible = false,
@@ -646,6 +634,11 @@ export function CodeBlock({
   const scrollStyle = maxHeight != null ? {
     maxHeight: typeof maxHeight === 'number' ? `${maxHeight}px` : maxHeight
   } : undefined;
+
+  // Caller controls render before Copy; together they are the block's controls,
+  // in the header when there is one and in the corner cluster otherwise.
+  const hasEndContent = isRenderable(endContent);
+  const hasControls = hasCopyButton || hasEndContent;
   const copyButtonEl = hasCopyButton ? /*#__PURE__*/_jsx(IconButton, {
     variant: "ghost",
     size: "sm",
@@ -666,7 +659,7 @@ export function CodeBlock({
       e.stopPropagation();
       void handleCopy();
     },
-    xstyle: [styles.copyButton, !showHeader && styles.copyButtonCorner, !showHeader && (size === 'sm' ? styles.copyButtonCornerSm : styles.copyButtonCornerMd)],
+    xstyle: styles.copyButton,
     ...themeProps('code-block-copy-button')
   }) : null;
   const headerEl = showHeader ? /*#__PURE__*/_jsxs("div", {
@@ -715,7 +708,12 @@ export function CodeBlock({
           })
         }), title, title && languageLabel ? ' — ' : '', languageLabel]
       })
-    }), copyButtonEl]
+    }), hasControls ? /*#__PURE__*/_jsxs("div", {
+      ...{
+        className: "x78zum5 x6s0dn4 xzye2dw x2lah0s"
+      },
+      children: [hasEndContent ? endContent : null, copyButtonEl]
+    }) : null]
   }) : null;
   const codeBody = /*#__PURE__*/_jsx("div", {
     ...getViewportProps({
@@ -761,7 +759,7 @@ export function CodeBlock({
       size,
       language,
       container
-    }), stylex.props(styles.root, hasCopyButton && !showHeader && styles.rootCorner, dynamicStyles.width(widthProp), containerStyles[container], xstyle), className, style),
+    }), stylex.props(styles.root, hasControls && !showHeader && styles.rootCorner, dynamicStyles.width(widthProp), containerStyles[container], xstyle), className, style),
     ...props,
     children: [headerEl, canCollapse ? /*#__PURE__*/_jsx("div", {
       id: regionId
@@ -786,7 +784,17 @@ export function CodeBlock({
         },
         children: codeBody
       })
-    }) : codeBody, !showHeader && copyButtonEl]
+    }) : codeBody, hasControls && !showHeader ? /*#__PURE__*/_jsxs("div", {
+      ...{
+        0: {
+          className: "x78zum5 x6s0dn4 xzye2dw x1y8v6su x16j26i2 xlgwz2i"
+        },
+        1: {
+          className: "x78zum5 x6s0dn4 xzye2dw x1y8v6su x16j26i2 x166xdbf"
+        }
+      }[!!(size === 'sm') << 0],
+      children: [hasEndContent ? endContent : null, copyButtonEl]
+    }) : null]
   });
   return syntaxTheme ? /*#__PURE__*/_jsx(SyntaxTheme, {
     theme: syntaxTheme,

package/dist/Dialog/Dialog.d.ts

@@ -12,6 +12,10 @@
  * while preserving explicit prop/theme padding overrides, and fade in without
  * the centered-dialog translate/scale motion.
  *
+ * Under reduced motion the entrance never travels or scales
+ * (docs/design/reduced-motion.md): on a touch screen the dialog fades in
+ * where it lands, in 200 ms or less; with a mouse it appears at once.
+ *
  * Initial focus and the focus returned on close follow the last input
  * (docs/architecture/interaction-modality.md INV1): the shared focus indicator
  * is hidden after a pointer press and shown after a key press.

package/dist/Dialog/Dialog.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Dialog.d.ts","sourceRoot":"","sources":["../../src/Dialog/Dialog.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AAEH,OAAO,EAOL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AA2B5C,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAMhD,OAAO,KAAK,EAAC,gBAAgB,EAAC,MAAM,SAAS,CAAC;AAyB9C;;;;;;GAMG;AACH,MAAM,MAAM,aAAa,GAAG,MAAM,gBAAgB,CAAC;AAEnD;;;;;GAKG;AACH,MAAM,MAAM,aAAa,GAAG,UAAU,GAAG,MAAM,GAAG,MAAM,CAAC;AAEzD,4EAA4E;AAC5E,UAAU,mBAAmB;IAC3B,GAAG,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACtB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CAC1B;AAED;;;;;GAKG;AACH,MAAM,WAAW,cAAe,SAAQ,mBAAmB;IACzD,6EAA6E;IAC7E,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,yEAAyE;IACzE,GAAG,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CACvB;AAuBD,2FAA2F;AAC3F,eAAO,MAAM,uCAAuC;;;;;;;;;;;CAW1C,CAAC;AAoJX;;;;;;;;;GASG;AACH,wBAAgB,4BAA4B,CAAC,QAAQ,EAAE,cAAc;;;;;EAUpE;AAED,MAAM,WAAW,WAAY,SAAQ,SAAS,CAAC,iBAAiB,CAAC;IAC/D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;IACnC;;OAEG;IACH,MAAM,EAAE,OAAO,CAAC;IAEhB;;;;;;OAMG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;;;;;OAOG;IACH,YAAY,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,OAAO,CAAC;IAE3C;;;;;OAKG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAExB;;;;;;OAMG;IACH,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAE5B;;;;OAIG;IACH,QAAQ,CAAC,EAAE,QAAQ,CAAC,cAAc,CAAC,CAAC;IAEpC;;;;;OAKG;IACH,OAAO,CAAC,EAAE,aAAa,CAAC;IAExB;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,aAAa,CAAC;IAExB;;;;OAIG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB;;;OAGG;IACH,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,wBAAgB,MAAM,CAAC,EACrB,MAAM,EACN,QAAgB,EAChB,YAAY,EACZ,KAAW,EACX,SAAmB,EACnB,QAAQ,EACR,OAAoB,EACpB,OAAgB,EAChB,OAAO,EACP,QAAQ,EACR,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,WAAW,sCA4Vb;yBA5We,MAAM"}
+{"version":3,"file":"Dialog.d.ts","sourceRoot":"","sources":["../../src/Dialog/Dialog.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AAEH,OAAO,EAOL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AA2B5C,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAMhD,OAAO,KAAK,EAAC,gBAAgB,EAAC,MAAM,SAAS,CAAC;AAyB9C;;;;;;GAMG;AACH,MAAM,MAAM,aAAa,GAAG,MAAM,gBAAgB,CAAC;AAEnD;;;;;GAKG;AACH,MAAM,MAAM,aAAa,GAAG,UAAU,GAAG,MAAM,GAAG,MAAM,CAAC;AAEzD,4EAA4E;AAC5E,UAAU,mBAAmB;IAC3B,GAAG,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACtB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CAC1B;AAED;;;;;GAKG;AACH,MAAM,WAAW,cAAe,SAAQ,mBAAmB;IACzD,6EAA6E;IAC7E,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,yEAAyE;IACzE,GAAG,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CACvB;AAuBD,2FAA2F;AAC3F,eAAO,MAAM,uCAAuC;;;;;;;;;;;CAW1C,CAAC;AAqKX;;;;;;;;;GASG;AACH,wBAAgB,4BAA4B,CAAC,QAAQ,EAAE,cAAc;;;;;EAUpE;AAED,MAAM,WAAW,WAAY,SAAQ,SAAS,CAAC,iBAAiB,CAAC;IAC/D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;IACnC;;OAEG;IACH,MAAM,EAAE,OAAO,CAAC;IAEhB;;;;;;OAMG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;;;;;OAOG;IACH,YAAY,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,OAAO,CAAC;IAE3C;;;;;OAKG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAExB;;;;;;OAMG;IACH,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAE5B;;;;OAIG;IACH,QAAQ,CAAC,EAAE,QAAQ,CAAC,cAAc,CAAC,CAAC;IAEpC;;;;;OAKG;IACH,OAAO,CAAC,EAAE,aAAa,CAAC;IAExB;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,aAAa,CAAC;IAExB;;;;OAIG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB;;;OAGG;IACH,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,wBAAgB,MAAM,CAAC,EACrB,MAAM,EACN,QAAgB,EAChB,YAAY,EACZ,KAAW,EACX,SAAmB,EACnB,QAAQ,EACR,OAAoB,EACpB,OAAgB,EAChB,OAAO,EACP,QAAQ,EACR,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,WAAW,sCA+Vb;yBA/We,MAAM"}

package/dist/Dialog/Dialog.js

@@ -16,6 +16,10 @@
  * while preserving explicit prop/theme padding overrides, and fade in without
  * the centered-dialog translate/scale motion.
  *
+ * Under reduced motion the entrance never travels or scales
+ * (docs/design/reduced-motion.md): on a touch screen the dialog fades in
+ * where it lands, in 200 ms or less; with a mouse it appears at once.
+ *
  * Initial focus and the focus returned on close follow the last input
  * (docs/architecture/interaction-modality.md INV1): the shared focus indicator
  * is hidden after a pointer press and shown after a key press.
@@ -133,15 +137,15 @@ const styles = {
     kZKoxP: "xg7h5cd",
     kZeWKH: "xish69e",
     kSiTet: "xg01cxk",
-    k44tkh: "xqgcaz",
-    kyAemX: "x128ha8g",
+    k44tkh: "xqgcaz x1jq6yc9",
+    kyAemX: "x128ha8g xr5m3f0",
     kWV6AL: "xskzprw",
     $$css: true
   },
   open: {
     k1xSpc: "x78zum5",
     kSiTet: "x1hc1fzr",
-    kKVMdj: "x1ewfqum x1aquc0h",
+    kKVMdj: "x1ewfqum x6mpr79 xtuz6mp",
     $$css: true
   },
   backdrop: {
@@ -160,7 +164,7 @@ const styles = {
     $$css: true
   },
   fullscreenOpen: {
-    kKVMdj: "xqcmdr3 x1aquc0h",
+    kKVMdj: "xqcmdr3 x6mpr79 xtuz6mp",
     $$css: true
   },
   fullscreenSafeArea: {
@@ -441,7 +445,10 @@ export function Dialog({
     escapeBehavior: allowEscape ? 'close' : 'block',
     onDismiss: () => {
       onOpenChange(false);
-    }
+    },
+    // The dialog's document is this layer's: rendered into an iframe or a
+    // Picture-in-Picture window, it ranks with the layers opened inside it.
+    getContainer: () => dialogRef.current
   });
 
   // Dev-time guardrail: an open modal should always have an accessible name.

package/dist/EmptyState/EmptyState.d.ts

@@ -1,6 +1,6 @@
 /**
  * @file EmptyState.tsx
- * @input Uses React, HTMLAttributes
+ * @input Uses React, HTMLAttributes, AnnounceRenderedText
  * @output Exports EmptyState component, EmptyStateProps type
  * @position Core implementation; consumed by index.ts
  *
@@ -53,7 +53,9 @@ export interface EmptyStateProps extends BaseProps<HTMLDivElement> {
  * An empty state placeholder for content areas with no data.
  * Displays an icon or illustration, title, optional description, and action buttons.
  *
- * Uses `role="status"` to announce content to screen readers.
+ * Not a live region. Its title and description are announced once when they
+ * appear or change after the page loaded, never when the page first renders
+ * with them (`spec:AST-086` FR2).
  * Styles use Astryx theme tokens via StyleX. Wrap your app in <Theme> to apply a theme.
  *
  * @example

package/dist/EmptyState/EmptyState.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EmptyState.d.ts","sourceRoot":"","sources":["../../src/EmptyState/EmptyState.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAAC,KAAK,SAAS,EAAgB,MAAM,OAAO,CAAC;AAQpD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AA4D5C,MAAM,WAAW,eAAgB,SAAQ,SAAS,CAAC,cAAc,CAAC;IAChE,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;;OAGG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB;;;;;;;OAOG;IACH,YAAY,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IACrC;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,wBAAgB,UAAU,CAAC,EACzB,KAAK,EACL,WAAW,EACX,IAAI,EACJ,OAAO,EACP,YAAgB,EAChB,SAAiB,EACjB,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,eAAe,+BAoDjB;yBAhEe,UAAU"}
+{"version":3,"file":"EmptyState.d.ts","sourceRoot":"","sources":["../../src/EmptyState/EmptyState.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAAC,KAAK,SAAS,EAAgB,MAAM,OAAO,CAAC;AAQpD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AA6D5C,MAAM,WAAW,eAAgB,SAAQ,SAAS,CAAC,cAAc,CAAC;IAChE,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;;OAGG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB;;;;;;;OAOG;IACH,YAAY,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IACrC;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,wBAAgB,UAAU,CAAC,EACzB,KAAK,EACL,WAAW,EACX,IAAI,EACJ,OAAO,EACP,YAAgB,EAChB,SAAiB,EACjB,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,eAAe,+BAmDjB;yBA/De,UAAU"}

package/dist/EmptyState/EmptyState.js

@@ -2,7 +2,7 @@
 
 /**
  * @file EmptyState.tsx
- * @input Uses React, HTMLAttributes
+ * @input Uses React, HTMLAttributes, AnnounceRenderedText
  * @output Exports EmptyState component, EmptyStateProps type
  * @position Core implementation; consumed by index.ts
  *
@@ -18,6 +18,7 @@ import { createElement } from 'react';
 import * as stylex from '@stylexjs/stylex';
 import "../theme/tokens.stylex.js";
 import { colorVars, spacingVars, fontWeightVars, typeScaleVars } from "../theme/tokens.stylex.js";
+import { AnnounceRenderedText } from "../hooks/AnnounceRenderedText.js";
 import { isRenderable, mergeProps } from "../utils/index.js";
 import { themeProps } from "../utils/themeProps.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
@@ -44,7 +45,9 @@ const styles = {
  * An empty state placeholder for content areas with no data.
  * Displays an icon or illustration, title, optional description, and action buttons.
  *
- * Uses `role="status"` to announce content to screen readers.
+ * Not a live region. Its title and description are announced once when they
+ * appear or change after the page loaded, never when the page first renders
+ * with them (`spec:AST-086` FR2).
  * Styles use Astryx theme tokens via StyleX. Wrap your app in <Theme> to apply a theme.
  *
  * @example
@@ -78,14 +81,13 @@ export function EmptyState({
   return /*#__PURE__*/_jsxs("div", {
     ref: ref,
     ...props,
-    role: "status",
     ...mergeProps(themeProps('empty-state', {
       variant: isCompact ? 'compact' : null
     }), stylex.props(styles.container, isCompact && styles.containerCompact, xstyle), className, style),
     children: [isRenderable(icon) && /*#__PURE__*/_jsx("div", {
       "aria-hidden": "true",
       children: icon
-    }), /*#__PURE__*/_jsxs("div", {
+    }), /*#__PURE__*/_jsxs(AnnounceRenderedText, {
       ...{
         className: "x78zum5 xdt5ytf x6s0dn4 xxc7z9f"
       },

package/dist/Layer/layerAnimations.stylex.d.ts

@@ -32,29 +32,33 @@ import * as stylex from '@stylexjs/stylex';
  *
  * Each entry disables its keyframe animation under
  * `prefers-reduced-motion: reduce` so the layer appears instantly instead of
- * translating/scaling in (infra-6).
+ * translating/scaling in (infra-6). Under a finger (the primary pointer is
+ * coarse) it fades in instead, opacity only and in 200 ms or less: on a touch
+ * screen Reduce Motion replaces motion with a cross-fade rather than a jump
+ * (design:reduced-motion DR2, DR3), as iOS does for its menus, popovers and
+ * tips.
  */
 export declare const layerAnimations: Readonly<{
     readonly below: Readonly<{
-        readonly animationDuration: stylex.StyleXClassNameFor<"animationDuration", "230ms">;
+        readonly animationDuration: stylex.StyleXClassNameFor<"animationDuration", string>;
         readonly animationTimingFunction: stylex.StyleXClassNameFor<"animationTimingFunction", "cubic-bezier(0.24, 1, 0.4, 1)">;
         readonly animationFillMode: stylex.StyleXClassNameFor<"animationFillMode", "backwards">;
         readonly animationName: stylex.StyleXClassNameFor<"animationName", string>;
     }>;
     readonly above: Readonly<{
-        readonly animationDuration: stylex.StyleXClassNameFor<"animationDuration", "230ms">;
+        readonly animationDuration: stylex.StyleXClassNameFor<"animationDuration", string>;
         readonly animationTimingFunction: stylex.StyleXClassNameFor<"animationTimingFunction", "cubic-bezier(0.24, 1, 0.4, 1)">;
         readonly animationFillMode: stylex.StyleXClassNameFor<"animationFillMode", "backwards">;
         readonly animationName: stylex.StyleXClassNameFor<"animationName", string>;
     }>;
     readonly end: Readonly<{
-        readonly animationDuration: stylex.StyleXClassNameFor<"animationDuration", "230ms">;
+        readonly animationDuration: stylex.StyleXClassNameFor<"animationDuration", string>;
         readonly animationTimingFunction: stylex.StyleXClassNameFor<"animationTimingFunction", "cubic-bezier(0.24, 1, 0.4, 1)">;
         readonly animationFillMode: stylex.StyleXClassNameFor<"animationFillMode", "backwards">;
         readonly animationName: stylex.StyleXClassNameFor<"animationName", string>;
     }>;
     readonly start: Readonly<{
-        readonly animationDuration: stylex.StyleXClassNameFor<"animationDuration", "230ms">;
+        readonly animationDuration: stylex.StyleXClassNameFor<"animationDuration", string>;
         readonly animationTimingFunction: stylex.StyleXClassNameFor<"animationTimingFunction", "cubic-bezier(0.24, 1, 0.4, 1)">;
         readonly animationFillMode: stylex.StyleXClassNameFor<"animationFillMode", "backwards">;
         readonly animationName: stylex.StyleXClassNameFor<"animationName", string>;

package/dist/Layer/layerAnimations.stylex.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"layerAnimations.stylex.d.ts","sourceRoot":"","sources":["../../src/Layer/layerAnimations.stylex.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AAEH,OAAO,KAAK,MAAM,MAAM,kBAAkB,CAAC;AA8D3C;;;;;;;;;GASG;AACH,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;EA+B1B,CAAC"}
+{"version":3,"file":"layerAnimations.stylex.d.ts","sourceRoot":"","sources":["../../src/Layer/layerAnimations.stylex.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AAEH,OAAO,KAAK,MAAM,MAAM,kBAAkB,CAAC;AA0E3C;;;;;;;;;;;;;GAaG;AACH,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;EAmC1B,CAAC"}

package/dist/Layer/layerAnimations.stylex.js

@@ -41,8 +41,17 @@ const enterStart = "xu7jd1z-B";
 // (translateY) entrances are direction-neutral and are left as-is.
 const enterEndRtl = "xu7jd1z-B";
 const enterStartRtl = "xwmkjkf-B";
+
+// Reduce Motion under a finger: the same entrance without its travel. A touch
+// presentation substitutes a cross-fade for motion, never a jump.
+const fadeIn = "x18re5ia-B";
 const animationBase = {
-  animationDuration: durationVars['--duration-fast-max'],
+  animationDuration: {
+    default: durationVars['--duration-fast-max'],
+    // The cross-fade is 200 ms or less, whatever the theme's duration
+    // (design:reduced-motion DR2).
+    '@media (prefers-reduced-motion: reduce) and (pointer: coarse)': `min(${durationVars['--duration-fast-max']}, 200ms)`
+  },
   animationTimingFunction: easeVars['--ease-standard'],
   animationFillMode: 'backwards'
 };
@@ -55,33 +64,37 @@ const animationBase = {
  *
  * Each entry disables its keyframe animation under
  * `prefers-reduced-motion: reduce` so the layer appears instantly instead of
- * translating/scaling in (infra-6).
+ * translating/scaling in (infra-6). Under a finger (the primary pointer is
+ * coarse) it fades in instead, opacity only and in 200 ms or less: on a touch
+ * screen Reduce Motion replaces motion with a cross-fade rather than a jump
+ * (design:reduced-motion DR2, DR3), as iOS does for its menus, popovers and
+ * tips.
  */
 export const layerAnimations = {
   below: {
-    kKVMdj: "xl1vlw0 x1aquc0h",
-    k44tkh: "x9uej1z",
+    kKVMdj: "xl1vlw0 xa4pr1u xajy0lc",
+    k44tkh: "x9uej1z x13pi3j7",
     kyAemX: "x128ha8g",
     kWV6AL: "xskzprw",
     $$css: true
   },
   above: {
-    kKVMdj: "x3psbcj x1aquc0h",
-    k44tkh: "x9uej1z",
+    kKVMdj: "x3psbcj xa4pr1u xajy0lc",
+    k44tkh: "x9uej1z x13pi3j7",
     kyAemX: "x128ha8g",
     kWV6AL: "xskzprw",
     $$css: true
   },
   end: {
-    kKVMdj: "x1i331go x1vxsm5i x1aquc0h",
-    k44tkh: "x9uej1z",
+    kKVMdj: "x1i331go x1vxsm5i xa4pr1u xajy0lc",
+    k44tkh: "x9uej1z x13pi3j7",
     kyAemX: "x128ha8g",
     kWV6AL: "xskzprw",
     $$css: true
   },
   start: {
-    kKVMdj: "xck01x9 x18lne9g x1aquc0h",
-    k44tkh: "x9uej1z",
+    kKVMdj: "xck01x9 x18lne9g xa4pr1u xajy0lc",
+    k44tkh: "x9uej1z x13pi3j7",
     kyAemX: "x128ha8g",
     kWV6AL: "xskzprw",
     $$css: true

package/dist/Layer/layerSlideRules.d.ts

@@ -1,7 +1,9 @@
 /**
  * @file layerSlideRules.ts
  * @input A layer's placement and alignment
- * @output The `@position-try` rules for its slide options and their names
+ * @output The `@position-try` rules for its slide options and their names, and
+ *   the beside and fit options of a layer that must never settle over its
+ *   anchor
  * @position Layer runtime geometry; the slide of spec:AST-059 FR4
  *
  * The slide is a position option whose area spans the whole alignment axis,
@@ -14,6 +16,23 @@
  * gutter on both alignment-axis edges, and the clearance facing the anchor
  * with the gutter on the far edge of the side it lands on.
  *
+ * A layer that must never settle over its anchor (spec:AST-059 FR4, Tooltip)
+ * has a second fallback list, for when its settled box covers its anchor:
+ * content taller than the room above and below its trigger. `beside` lands on a
+ * side across the alignment axis, spanning the whole block axis, at the
+ * content's own inline size, so it fits only where the layer fits without
+ * squeezing. `fit` lands above or below sized to the room on that side, so
+ * overflow scrolls inside the layer, and is never smaller than half of the room
+ * the trigger leaves on the block axis, so it fits only on the side with more
+ * room; the list tries both only after the layer's own position, `beside` and
+ * the opposite side at the layer's own size, so only content taller than the
+ * room on both sides is sized to a room. No option is sized to whatever room
+ * is left: a browser keeps a layer on the option it last used for as long as
+ * that option still fits, so such an option would hold an open layer on a side
+ * shrunk to a sliver after its anchor moved. Chromium applies a position
+ * option's width and height properties but not their min/max forms, so the
+ * sizes are `inline-size` and `block-size`.
+ *
  * The rules are static — the anchor clearance travels through a custom
  * property — so one style sheet per document carries all of them. It is
  * installed from a layout effect, before the layer's first paint, rather than
@@ -27,7 +46,48 @@ import type { LayerAlignment, LayerPlacement } from './useLayer.js';
 export declare const LAYER_CLEARANCE_PROPERTY = "--_astryx-layer-clearance";
 type Side = 'same' | 'opposite';
 export declare function slideRuleName(placement: LayerPlacement, alignment: LayerAlignment, side: Side): string;
-/** Every slide rule, for every placement and alignment. */
+/** The name of the `beside` option that lands on `side`, across the block axis. */
+export declare function besideRuleName(side: 'start' | 'end'): string;
+/**
+ * The name of the `fit` option that lands on `side` sized to the room there,
+ * which fits only while that side holds at least half of the room the trigger
+ * leaves on the block axis.
+ */
+export declare function fitRuleName(side: 'above' | 'below'): string;
+/**
+ * The fallback list of a layer that must never settle over its anchor, once
+ * the standard list has failed it (FR4). After the layer's own position (the
+ * preferred block side, at its own size): beside the trigger on the inline
+ * end, then the inline start, then the opposite block side at its own size,
+ * and only then the preferred block side and the opposite one sized to the
+ * room there, each only while it is the roomier side. Every option before the
+ * last two keeps the layer at its own size, so a layer whose content fits
+ * somewhere is never stretched to a room; the last two are for content taller
+ * than the room on both sides. Chromium tries no more than five options, so
+ * this replaces the standard list rather than extending it. Side placements
+ * already slide along the block axis at full height, so they have none.
+ */
+export declare function getAnchorClearFallbacks(placement: LayerPlacement): string;
+/** The custom property a layer writes its anchor-clear fallback list to. */
+export declare const LAYER_CLEAR_FALLBACKS_PROPERTY = "--_astryx-layer-clear-fallbacks";
+/** The custom property its `position-try-fallbacks` reads first. */
+export declare const LAYER_TRY_FALLBACKS_PROPERTY = "--_astryx-layer-try-fallbacks";
+/**
+ * The attribute the runtime sets on a layer whose settled box covered its
+ * anchor; it switches the layer to its anchor-clear list.
+ */
+export declare const LAYER_CLEARS_ANCHOR_ATTRIBUTE = "data-astryx-clears-anchor";
+/**
+ * The attribute the runtime sets on a layer that keeps its anchor clear while
+ * its content overflows the box it was given; only then does it scroll, so a
+ * layer that fits stays a plain box and a wheel over it still scrolls the
+ * page.
+ */
+export declare const LAYER_SCROLLS_ATTRIBUTE = "data-astryx-layer-scrolls";
+/**
+ * Every slide rule, for every placement and alignment, and the beside and fit
+ * rules.
+ */
 export declare function slideRulesCss(): string;
 export declare const SLIDE_RULES_ID = "astryx-layer-slide-rules";
 /**

package/dist/Layer/layerSlideRules.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"layerSlideRules.d.ts","sourceRoot":"","sources":["../../src/Layer/layerSlideRules.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AAEH,OAAO,KAAK,EAAC,cAAc,EAAE,cAAc,EAAC,MAAM,YAAY,CAAC;AAG/D,kEAAkE;AAClE,eAAO,MAAM,wBAAwB,8BAA8B,CAAC;AAEpE,KAAK,IAAI,GAAG,MAAM,GAAG,UAAU,CAAC;AAEhC,wBAAgB,aAAa,CAC3B,SAAS,EAAE,cAAc,EACzB,SAAS,EAAE,cAAc,EACzB,IAAI,EAAE,IAAI,GACT,MAAM,CAER;AAmFD,2DAA2D;AAC3D,wBAAgB,aAAa,IAAI,MAAM,CAOtC;AAED,eAAO,MAAM,cAAc,6BAA6B,CAAC;AAEzD;;;GAGG;AACH,wBAAgB,gBAAgB,CAAC,GAAG,EAAE,QAAQ,GAAG,IAAI,CAQpD"}
+{"version":3,"file":"layerSlideRules.d.ts","sourceRoot":"","sources":["../../src/Layer/layerSlideRules.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0CG;AAEH,OAAO,KAAK,EAAC,cAAc,EAAE,cAAc,EAAC,MAAM,YAAY,CAAC;AAG/D,kEAAkE;AAClE,eAAO,MAAM,wBAAwB,8BAA8B,CAAC;AAEpE,KAAK,IAAI,GAAG,MAAM,GAAG,UAAU,CAAC;AAEhC,wBAAgB,aAAa,CAC3B,SAAS,EAAE,cAAc,EACzB,SAAS,EAAE,cAAc,EACzB,IAAI,EAAE,IAAI,GACT,MAAM,CAER;AAmFD,mFAAmF;AACnF,wBAAgB,cAAc,CAAC,IAAI,EAAE,OAAO,GAAG,KAAK,GAAG,MAAM,CAE5D;AAED;;;;GAIG;AACH,wBAAgB,WAAW,CAAC,IAAI,EAAE,OAAO,GAAG,OAAO,GAAG,MAAM,CAE3D;AA2CD;;;;;;;;;;;;GAYG;AACH,wBAAgB,uBAAuB,CAAC,SAAS,EAAE,cAAc,GAAG,MAAM,CAMzE;AAED,4EAA4E;AAC5E,eAAO,MAAM,8BAA8B,oCAAoC,CAAC;AAEhF,oEAAoE;AACpE,eAAO,MAAM,4BAA4B,kCAAkC,CAAC;AAE5E;;;GAGG;AACH,eAAO,MAAM,6BAA6B,8BAA8B,CAAC;AAEzE;;;;;GAKG;AACH,eAAO,MAAM,uBAAuB,8BAA8B,CAAC;AAUnE;;;GAGG;AACH,wBAAgB,aAAa,IAAI,MAAM,CActC;AAED,eAAO,MAAM,cAAc,6BAA6B,CAAC;AAEzD;;;GAGG;AACH,wBAAgB,gBAAgB,CAAC,GAAG,EAAE,QAAQ,GAAG,IAAI,CAQpD"}