@escape-game-over/atlas 0.1.67 → 0.1.69

package/docs/checks.md

@@ -124,7 +124,7 @@ dependencies at all. Vitest type-checks them itself when it runs them.
 | `breadcrumbs.test.ts`      | the trail, a dropped ancestor, `orphanSegments`, and how a gap is reported                                                                                                                           |
 | `jsonld/*.test.ts`         | that a `</script>` in any value cannot close the block, each node's shape and `@id`, and how a price table becomes offers                                                                            |
 | `analytics.test.ts`        | Umami's attributes, its three-state booleans, the `domains` list that would record nothing, and that `consentRequired` answers exactly when a tag was emitted                                        |
-| `google-analytics.test.ts` | that consent is denied first and precedes every tag, one loader for many ids, dead `UA-` properties, the preconnect — once, ahead of the block that writes the loader's URL, never `crossorigin` — and where `googleEvent` sends, per setting |
+| `google-analytics.test.ts` | that consent is denied first and precedes every tag, one loader for many ids, dead `UA-` properties, and the preconnect — once, ahead of the block that writes the loader's URL, never `crossorigin` |
 | `contact.test.ts`          | the E.164 a `tel:` needs — trunk zero dropped, spacing stripped — and the displayed form kept                                                                                                        |
 | `hours.test.ts`            | collapsing a week into runs, week start changing the answer, and every impossible week that throws                                                                                                   |
 | `money.test.ts`            | a bare count widened to a band, the span of a table, and the gaps and overlaps that throw                                                                                                            |

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@escape-game-over/atlas",
-    "version": "0.1.67",
+    "version": "0.1.69",
     "type": "module",
     "description": "Typed, data-driven machinery for static multi-locale, multi-deployment Astro sites.",
     "private": false,
@@ -34,7 +34,7 @@
         "README.md"
     ],
     "engines": {
-        "node": ">=22.12.0"
+        "node": ">=24.0.0"
     },
     "scripts": {
         "test": "npm run test:types && npm run test:unit && npm run test:examples",
@@ -54,14 +54,14 @@
         "@types/node": ">=22",
         "astro": ">=7",
         "typescript": ">=5",
-        "vite": ">=8"
+        "vite": ">= 8"
     },
     "devDependencies": {
-        "@biomejs/biome": "2.5.14",
-        "@types/node": "26.6.2",
-        "@vitest/coverage-istanbul": "5.0.1",
+        "@biomejs/biome": "2.5.15",
+        "@types/node": "26.6.3",
+        "@vitest/coverage-istanbul": "5.0.3",
         "astro": "7.3.5",
         "typescript": "6.0.3",
-        "vitest": "5.0.1"
+        "vitest": "5.0.3"
     }
 }

package/src/astro/AutoDialog.astro

@@ -5,9 +5,12 @@
  * (`closedby="any"`). Close it with `<form method="dialog"><button>…</button></form>`.
  *
  * ```astro
- * <AutoDialog id="promo" aria-label="…" after={2000} once="session">…</AutoDialog>
+ * <AutoDialog id="promo" aria-label="…" when={{ on: "delay", ms: 2000 }} once="session">…</AutoDialog>
  * ```
  *
+ * With `when={{ on: "visible" }}` it opens when the place it is written
+ * scrolls into view.
+ *
  * A dialog opened only by a button or a script needs none of this: write
  * `<dialog closedby="any">`.
  */
@@ -20,8 +23,8 @@ type Props = AutoOpen &
         readonly id: string;
     };
 
-const { after, once, waitForConsent, modal, ...attrs } = Astro.props;
-const auto: AutoOpen = { after, once, waitForConsent, modal };
+const { when, once, waitForConsent, modal, ...attrs } = Astro.props;
+const auto: AutoOpen = { when, once, waitForConsent, modal };
 ---
 
 <script src="./auto-dialog.ts" />
@@ -31,6 +34,11 @@ const auto: AutoOpen = { after, once, waitForConsent, modal };
     data-auto={JSON.stringify(auto)}
     style="display:contents"
 >
+    <!-- Out of the flow, so it adds no gap to a flex or grid parent. -->
+    <span
+        data-spot
+        style="position:absolute"
+    ></span>
     <dialog
         closedby="any"
         {...attrs}

package/src/astro/Document.astro

@@ -78,11 +78,11 @@ if (meta.consentVendors.length > 0 && !Astro.slots.has("consent")) {
         <MetaTags tags={meta.tags} />
         {rememberLocale && <RememberLocale />}
         {Object.entries(fonts).map(([key, font]) => (
-    <Font
-        cssVariable={`--${key}`}
-        preload={font.preload === true}
-    />
-))}
+            <Font
+                cssVariable={`--${key}`}
+                preload={font.preload === true}
+            />
+        ))}
         <slot name="head" />
     </head>
     <body {...body}>

package/src/astro/auto-dialog.ts

@@ -1,17 +1,29 @@
 import { CONSENT_EVENT, CONSENT_TAG, readConsent } from "./consent.ts";
 import { element } from "./element.ts";
+import { type LoadTrigger, triggered } from "./load-script.ts";
 import { data, ref } from "./ref.ts";
 
+/**
+ * `loadScript`'s triggers, as a dialog uses them. `visible` watches where the
+ * `<AutoDialog>` sits in the page, so placing it in a section opens it as the
+ * visitor scrolls there. A dialog opened by a click is a plain `<dialog>`.
+ */
+export type OpenTrigger =
+    | { readonly on: "idle" }
+    | { readonly on: "delay"; readonly ms: number }
+    | { readonly on: "visible"; readonly margin?: string }
+    | { readonly on: "interaction" };
+
 /** When an `<AutoDialog>` opens by itself. */
 export interface AutoOpen {
-    /** Milliseconds after load, or after the consent answer with `waitForConsent`. */
-    readonly after: number;
+    /** Counted from `load`, or from the consent answer with `waitForConsent`. */
+    readonly when: OpenTrigger;
     /**
      * Once closed, stays closed for the tab (`session`) or for good (`visitor`).
      * Omitted, it opens on every page.
      */
     readonly once?: "session" | "visitor";
-    /** Holds the timer until the consent banner is answered, where it asks. */
+    /** Holds the trigger until the consent banner is answered, where it asks. */
     readonly waitForConsent?: boolean;
     /** Defaults to `true`; `false` leaves the page usable behind it. */
     readonly modal?: boolean;
@@ -20,10 +32,14 @@ export interface AutoOpen {
 const storage = (once: "session" | "visitor"): Storage =>
     once === "session" ? sessionStorage : localStorage;
 
-/** Opens `dialog` as `options` say, until `signal` aborts. */
+/**
+ * Opens `dialog` as `options` say, until `signal` aborts. `spot` is where the
+ * dialog sits in the page, which a `visible` trigger watches.
+ */
 export function autoOpen(
     dialog: HTMLDialogElement,
-    { after, once, waitForConsent = false, modal = true }: AutoOpen,
+    spot: Element,
+    { when, once, waitForConsent = false, modal = true }: AutoOpen,
     signal: AbortSignal
 ): void {
     const key = `atlas-dialog:${dialog.id}`;
@@ -44,13 +60,14 @@ export function autoOpen(
         );
     }
 
+    const trigger: LoadTrigger =
+        when.on === "visible" ? { ...when, element: spot } : when;
     const start = () => {
-        const timer = setTimeout(() => {
+        void triggered(trigger, signal).then(() => {
             if (dialog.open) return;
             if (modal) dialog.showModal();
             else dialog.show();
-        }, after);
-        signal.addEventListener("abort", () => clearTimeout(timer));
+        });
     };
 
     const asking =
@@ -66,6 +83,7 @@ export function autoOpen(
 export const autoDialog = element("atlas-dialog", ({ root, signal }) => {
     autoOpen(
         ref<HTMLDialogElement>(root, "dialog"),
+        ref(root, "[data-spot]"),
         JSON.parse(data(root, "auto")),
         signal
     );

package/src/config.ts

@@ -2,20 +2,21 @@ import type { Fonts } from "./fonts.ts";
 import type { LlmsConfig } from "./llms.ts";
 import type { RobotsConfig } from "./robots.ts";
 import type { SitemapConfig } from "./sitemap.ts";
-import type { StringKeys } from "./types.ts";
+import type { NoExcessKeys, StringKeys } from "./types.ts";
 
 export interface LocaleMeta {
     /** Name of the language, written in that language. */
     readonly label: string;
     // No language tag here: the locale's own key is the tag. One identifier,
     // used for the URL segment, `lang`, `hreflang` and `og:locale` alike.
-    readonly dir: "ltr" | "rtl";
+    // No `dir` either: writing direction follows from the tag too.
 }
 
 /** `LocaleMeta` after defaults are filled in. */
 export interface ResolvedLocaleMeta {
     readonly label: string;
     readonly htmlLang: string;
+    /** Derived: the writing direction of the tag's script, from `Intl`. */
     readonly dir: "ltr" | "rtl";
     /** Derived: `htmlLang` with `-` swapped for `_`, which is the OG form. */
     readonly ogLocale: string;
@@ -55,7 +56,7 @@ interface MalformedLanguageTag<T extends string> {
 type ValidateLocales<T> = {
     [K in StringKeys<T>]: [LanguageTag<K>] extends [never]
         ? MalformedLanguageTag<K>
-        : LocaleMeta;
+        : LocaleMeta & NoExcessKeys<T[K], keyof LocaleMeta>;
 };
 
 export interface RoutingConfig<L extends string> {
@@ -156,10 +157,9 @@ export function defineSiteConfig<
 /**
  * What a project may restate about a locale.
  *
- * `dir` is deliberately not here: writing direction is a fact about the script a
- * language is written in, not a choice a deployment makes. Greek is
- * left-to-right for everybody, and a project that could say otherwise would only
- * ever be wrong. The label is the one part that is a matter of taste.
+ * Only the label: writing direction is a fact about the script a language is
+ * written in, not a choice a deployment makes, so it is derived from the tag.
+ * The label is the one part that is a matter of taste.
  */
 export type LocaleMetaOverride = Pick<LocaleMeta, "label">;
 
@@ -184,6 +184,8 @@ export interface LocaleNotEnabled<L extends string> {
  *
  * The locale key is the language tag, and `ogLocale` is that tag with `-`
  * swapped for `_` — Open Graph writes `en_US` where BCP 47 writes `en-US`.
+ * `dir` comes from the tag's script, so `ar-EG` and `az-Arab-IR` are
+ * right-to-left and `az-AZ` is not.
  */
 export function mergeLocaleMeta<L extends string>(
     base: Readonly<Record<L, LocaleMeta>>,
@@ -199,10 +201,20 @@ export function mergeLocaleMeta<L extends string>(
         const meta = { ...defaults, ...overrides?.[locale] };
         merged[locale] = {
             label: meta.label,
-            dir: meta.dir,
+            dir: writingDirection(locale),
             htmlLang: locale,
             ogLocale: locale.replace(/-/g, "_"),
         };
     }
     return merged as Readonly<Record<L, ResolvedLocaleMeta>>;
 }
+
+function writingDirection(tag: string): "ltr" | "rtl" {
+    const direction = new Intl.Locale(tag).getTextInfo().direction;
+    if (direction === undefined) {
+        throw new Error(
+            `This runtime cannot tell the writing direction of "${tag}".`
+        );
+    }
+    return direction;
+}