@nordwerk/scroll-carousel 0.1.3 → 0.1.5

package/dist/shared/adapter-D4APPfnz.d.ts

@@ -0,0 +1,36 @@
+import { n as CarouselOptions, r as CarouselState, s as Plugin, t as Carousel } from "./index-D1Np3wzP.js";
+import { t as LayoutProps } from "./markup-CM54igQ_.js";
+//#region src/adapter.d.ts
+interface CarouselProps extends LayoutProps {
+  /** Accessible name of the scrolling list. */
+  label: string;
+  /** Element of the track. With 'ul' every child is wrapped in <li>, otherwise in <div>. */
+  as?: 'ul' | 'div';
+  children?: unknown;
+  className?: string;
+  style?: Record<string, string | number>;
+  slideClassName?: string;
+  /** Mark slides as groups with aria-roledescription="slide" and "n of count" labels. */
+  slideRoles?: boolean;
+  /** Keep a short row in the middle instead of at the start. */
+  centerFew?: boolean;
+  /** Default arrows. false renders none, e.g. when the host brings its own. */
+  arrows?: boolean;
+  /** Default dots. */
+  dots?: boolean;
+  /** Render a play/pause button for the autoplay plugin. */
+  playButton?: boolean;
+  labels?: CarouselOptions['labels'] & {
+    prev?: string;
+    next?: string;
+  };
+  initial?: number;
+  rewind?: CarouselOptions['rewind'];
+  group?: LayoutProps['group'];
+  plugins?: Plugin[];
+  onChange?: (state: CarouselState) => void;
+  /** Receives the carousel after attaching, and null after it is destroyed. */
+  carouselRef?: (carousel: Carousel | null) => void;
+}
+//#endregion
+export { CarouselProps as t };

package/dist/shared/adapter-DhmQTrqX.js

@@ -0,0 +1,137 @@
+import { attach } from "../index.js";
+import { PRE_POSITION, baseVars, responsiveCss } from "../markup.js";
+//#region src/adapter.ts
+const chevron = (h, path) => h("svg", {
+	viewBox: "0 0 24 24",
+	"aria-hidden": "true",
+	focusable: "false"
+}, h("path", { d: path }));
+function createAdapter(framework) {
+	const { createElement: h, Fragment, useState, useRef, useEffect, useLayoutEffect, useId, toChildArray } = framework;
+	const useBeforePaint = typeof window == "undefined" ? useEffect : useLayoutEffect;
+	/**
+	* Attach a carousel to your own markup. Put `ref` on the root. Options are read once, when
+	* the root mounts; give the component a new `key` to attach again with other options.
+	*/
+	function useCarousel(options = {}) {
+		const ref = useRef(null);
+		const latest = useRef(options);
+		useBeforePaint(() => {
+			latest.current = options;
+		});
+		const [carousel, setCarousel] = useState(null);
+		const [state, setState] = useState(null);
+		useBeforePaint(() => {
+			if (!ref.current) return;
+			const instance = attach(ref.current, {
+				...latest.current,
+				onChange: (next) => {
+					setState(next);
+					latest.current.onChange?.(next);
+				}
+			});
+			setCarousel(instance);
+			setState(instance.state);
+			return () => {
+				instance.destroy();
+				setCarousel(null);
+			};
+		}, []);
+		return {
+			ref,
+			carousel,
+			state
+		};
+	}
+	function Carousel(props) {
+		const id = useId();
+		const { as = "div", label, children, className, style, slideClassName, slideRoles, centerFew } = props;
+		const { arrows = true, dots = true, playButton, labels = {}, initial = 0, carouselRef } = props;
+		const { ref, carousel } = useCarousel({
+			group: typeof props.group == "object" ? void 0 : props.group,
+			initial,
+			rewind: props.rewind,
+			labels,
+			plugins: props.plugins,
+			onChange: props.onChange
+		});
+		const handoff = useRef(carouselRef);
+		useEffect(() => {
+			handoff.current = carouselRef;
+		});
+		useEffect(() => {
+			if (!carousel) return;
+			handoff.current?.(carousel);
+			return () => handoff.current?.(null);
+		}, [carousel]);
+		const slides = toChildArray(children);
+		const item = as == "ul" ? "li" : "div";
+		const css = responsiveCss(id, props);
+		const root = h("div", {
+			ref,
+			className: [
+				"sc",
+				centerFew && "sc--center-few",
+				className
+			].filter(Boolean).join(" "),
+			"data-sc-id": id,
+			style: {
+				...baseVars(props),
+				...style
+			}
+		}, css && h("style", { dangerouslySetInnerHTML: { __html: css } }), h(as, {
+			className: "sc-track",
+			"data-sc-track": "",
+			tabIndex: 0,
+			"aria-label": label
+		}, slides.map((child, i) => h(item, {
+			key: child?.key ?? i,
+			className: slideClassName,
+			"data-sc-initial": i == initial && i > 0 ? "" : void 0,
+			...slideRoles && {
+				role: "group",
+				"aria-roledescription": "slide",
+				"aria-label": `${i + 1} of ${slides.length}`
+			}
+		}, child))), arrows && h(Fragment, null, h("button", {
+			type: "button",
+			className: "sc-nav sc-prev",
+			"data-sc-prev": "",
+			"aria-label": labels.prev || "Previous"
+		}, chevron(h, "m15 18-6-6 6-6")), h("button", {
+			type: "button",
+			className: "sc-nav sc-next",
+			"data-sc-next": "",
+			"aria-label": labels.next || "Next"
+		}, chevron(h, "m9 6 6 6-6 6"))), playButton && h("button", {
+			type: "button",
+			className: "sc-play",
+			"data-sc-play": "",
+			"aria-label": "Stop automatic scrolling"
+		}, h("svg", {
+			className: "sc-icon-play",
+			viewBox: "0 0 24 24",
+			"aria-hidden": "true",
+			focusable: "false"
+		}, h("path", { d: "M8 5v14l11-7z" })), h("svg", {
+			className: "sc-icon-pause",
+			viewBox: "0 0 24 24",
+			"aria-hidden": "true",
+			focusable: "false"
+		}, h("path", { d: "M7 5h3.5v14H7zM13.5 5H17v14h-3.5z" }))), dots && h("div", {
+			className: "sc-dots",
+			"data-sc-dots": ""
+		}), h("p", {
+			className: "sc-status",
+			"data-sc-status": "",
+			"aria-live": "polite"
+		}));
+		return initial > 0 ? h(Fragment, null, root, h("script", { dangerouslySetInnerHTML: { __html: PRE_POSITION } })) : root;
+	}
+	return {
+		Carousel,
+		useCarousel
+	};
+}
+//#endregion
+export { createAdapter as t };

package/dist/shared/index-D1Np3wzP.d.ts

@@ -0,0 +1,120 @@
+//#region src/math.d.ts
+type Align = 'start' | 'center' | 'end';
+type Group = number | 'page';
+interface Geometry {
+  /** Start of each slide in scroll-content coordinates, px. */
+  starts: number[];
+  /** Inline size of each slide, px. */
+  sizes: number[];
+  /** Width of the scrollport, px. */
+  port: number;
+  /** Scroll padding at the start and the end, px. */
+  padStart: number;
+  padEnd: number;
+  /** Largest scroll position, px. */
+  max: number;
+  align: Align;
+}
+interface Page {
+  /** Scroll position of the page. */
+  pos: number;
+  /** Index of the first slide of the page. */
+  first: number;
+}
+//#endregion
+//#region src/index.d.ts
+interface CarouselState {
+  /** The slide at the snap position, or the destination of a move in flight. */
+  index: number;
+  page: number;
+  pageCount: number;
+  isBeginning: boolean;
+  isEnd: boolean;
+  /** Whether the content overflows at all. Without overflow there are no controls. */
+  overflow: boolean;
+}
+interface Labels {
+  /** Accessible name of a default dot. */
+  page: (n: number, count: number) => string;
+  /** Live-region text after a settled move, from the first and last visible slide (1-based). */
+  status: (first: number, last: number, count: number, slides: HTMLElement[]) => string;
+}
+interface CarouselOptions {
+  /** Slides per step of next and previous: a number or 'page'. Default: --sc-group, then 1. */
+  group?: Group;
+  /** Initial slide. Default: the slide with [data-sc-initial], then 0. */
+  initial?: number;
+  /** Next at the end goes to the start and the reverse. true fades, 'scroll' scrolls back. */
+  rewind?: boolean | 'fade' | 'scroll';
+  labels?: Partial<Labels>;
+  /** Called after every settled move that changed the state, like the sc:change event. */
+  onChange?: (state: CarouselState) => void;
+  /** Default: [data-sc-prev], [data-sc-next], [data-sc-dots], [data-sc-status] inside the root. */
+  prev?: HTMLElement | null;
+  next?: HTMLElement | null;
+  dots?: HTMLElement | null;
+  status?: HTMLElement | null;
+  /** Opt-in behaviour, e.g. drag() and autoplay(). */
+  plugins?: Plugin[];
+}
+interface MoveOptions {
+  /** Jump instead of scrolling smoothly. */
+  instant?: boolean;
+}
+interface Carousel {
+  readonly root: HTMLElement;
+  readonly track: HTMLElement;
+  readonly slides: HTMLElement[];
+  readonly state: CarouselState;
+  readonly index: number;
+  readonly page: number;
+  readonly pageCount: number;
+  readonly isBeginning: boolean;
+  readonly isEnd: boolean;
+  next(): void;
+  prev(): void;
+  slideTo(index: number, options?: MoveOptions): void;
+  goToPage(page: number, options?: MoveOptions): void;
+  /** Measure again, e.g. after changing the direction or a custom property from script. */
+  update(): void;
+  destroy(): void;
+  /** Present when the autoplay plugin is attached. */
+  play?(): void;
+  pause?(): void;
+}
+interface Layout {
+  pages: Page[];
+  max: number;
+  rtl: boolean;
+  snap: 'mandatory' | 'proximity' | 'none';
+  state: CarouselState;
+}
+/** What a plugin gets to work with. Listeners added through `listen` end with destroy(). */
+interface PluginContext {
+  root: HTMLElement;
+  track: HTMLElement;
+  listen(target: EventTarget | null | undefined, type: string, handler: (event: any) => void, options?: AddEventListenerOptions): void;
+  layout(): Layout;
+  toPage(page: number): void;
+  /** Scroll to a position, e.g. where a drag's momentum ends. */
+  scrollTo(pos: number): void;
+  /** Next or previous page; a quiet step is not announced in the live region. */
+  step(direction: 1 | -1, wrap: boolean, quiet?: boolean): void;
+  /** The user took hold of the track: a programmatic move in flight is abandoned. */
+  grab(): void;
+  /** While held, scrolling never counts as settled, e.g. during a drag. */
+  hold(on: boolean): void;
+  /** control: the user took over. settle: a move came to rest. measure: layout was read. */
+  on(event: 'control' | 'settle' | 'measure', handler: () => void): void;
+}
+type Plugin = (context: PluginContext) => {
+  destroy?(): void;
+  play?(): void;
+  pause?(): void;
+} | void;
+/** The carousel attached to `root`, if any. */
+declare const getCarousel: (root: HTMLElement) => Carousel | undefined;
+/** Attach to server-rendered markup. Attaching twice returns the same carousel. */
+declare function attach(root: HTMLElement, options?: CarouselOptions): Carousel;
+//#endregion
+export { Layout as a, PluginContext as c, Align as d, Geometry as f, Labels as i, attach as l, Page as m, CarouselOptions as n, MoveOptions as o, Group as p, CarouselState as r, Plugin as s, Carousel as t, getCarousel as u };

package/dist/shared/markup-CM54igQ_.d.ts

@@ -0,0 +1,54 @@
+//#region src/markup.d.ts
+/**
+ * A value, or values by minimum container width in px, e.g. { 0: 2, 600: 3, 900: 4 }.
+ * Widths are container widths: the carousel root is the query container.
+ */
+type Responsive<T> = T | Record<number, T>;
+interface LayoutProps {
+  /** Slides per view; fractions show part of the next slide. */
+  perView?: Responsive<number>;
+  /** A fixed slide size such as '18rem', or 'auto' for the content width. Wins over perView. */
+  slideSize?: Responsive<string>;
+  /** Numbers are px. */
+  gap?: Responsive<number | string>;
+  offsetBefore?: Responsive<number | string>;
+  offsetAfter?: Responsive<number | string>;
+  snap?: Responsive<'mandatory' | 'proximity' | 'none'>;
+  align?: Responsive<'start' | 'center'>;
+  /** Pad both ends so the first and last slide can reach the centre. Needs perView. */
+  centered?: boolean;
+  /** Slides per step of next and previous. */
+  group?: Responsive<number | 'page'>;
+  /** false hides arrows, dots and the play button, e.g. for free mode on small containers. */
+  controls?: Responsive<boolean>;
+}
+/** Custom properties for the root's style attribute: plain values and the 0 breakpoint. */
+declare function baseVars(props: LayoutProps): Record<string, string>;
+/** The same as a CSS declaration string, for templating languages. */
+declare const baseStyle: (props: LayoutProps) => string;
+/**
+ * Container-query rules for responsive values, scoped to [data-sc-id="id"]. Empty when nothing
+ * is responsive. Render it in a <style> element inside the root.
+ */
+declare function responsiveCss(id: string, props: LayoutProps): string;
+/**
+ * Inline script to render immediately after a carousel that opens on a later slide. It sets the
+ * start position before the first paint, so a deferred or module script finds it in place.
+ * Start alignment only. It expects the root as its previous sibling.
+ */
+declare const PRE_POSITION: string;
+/**
+ * Label templates such as 'Slide {n} of {count}' turned into label functions. `statusSingle`
+ * is used when only one slide is visible, e.g. 'Item {first} of {count}' next to a `status` of
+ * 'Items {first} to {last} of {count}'.
+ */
+declare function templateLabels(templates?: {
+  page?: string;
+  status?: string;
+  statusSingle?: string;
+}): {
+  page?: ((n: number, count: number) => string) | undefined;
+  status?: ((first: number, last: number, count: number) => string) | undefined;
+};
+//#endregion
+export { baseVars as a, baseStyle as i, PRE_POSITION as n, responsiveCss as o, Responsive as r, templateLabels as s, LayoutProps as t };

package/dist/shared/math-DhvRXjtu.js

@@ -0,0 +1,73 @@
+const clamp = (value, min, max) => Math.min(max, Math.max(min, value));
+/** Index of the value closest to `target`; the earliest one wins a tie. */
+const closest = (values, target) => {
+	let best = 0;
+	for (let i = 1; i < values.length; i++) if (Math.abs(values[i] - target) < Math.abs(values[best] - target) - .5) best = i;
+	return best;
+};
+/** The scroll position at which each slide is aligned, clamped to the scroll range. */
+const snapPositions = ({ starts, sizes, port, padStart, padEnd, max, align }) => starts.map((start, i) => clamp(align === "center" ? start + sizes[i] / 2 - padStart - (port - padStart - padEnd) / 2 : align === "end" ? start + sizes[i] - port + padEnd : start - padStart, 0, max));
+/**
+* The first slide of every page. Pages are counted outwards from `anchor` (the initial slide),
+* so the initial slide always starts a page and the first page may be shorter than the rest.
+* `group` is a number of slides, or 'page' for as many whole slides as fit in the view.
+*/
+const pageStarts = (geo, snaps, group, anchor) => {
+	const count = snaps.length;
+	const firsts = /* @__PURE__ */ new Set([0, anchor]);
+	if (group === "page") {
+		const fits = (from, last) => geo.starts[last] + geo.sizes[last] <= snaps[from] + geo.port - geo.padEnd + 2;
+		for (let i = anchor; i < count && snaps[i] < geo.max - 2;) {
+			let next = i + 1;
+			while (next < count && fits(i, next)) next++;
+			if (next >= count) break;
+			firsts.add(i = next);
+		}
+		for (let i = anchor; i > 0;) {
+			let first = i - 1;
+			while (first > 0 && fits(first - 1, i - 1)) first--;
+			firsts.add(i = first);
+		}
+	} else for (let i = anchor % group; i < count; i += group) firsts.add(i);
+	return [...firsts].filter((i) => i >= 0 && i < count).sort((a, b) => a - b);
+};
+/**
+* Pages at distinct positions, always ending at the end of the scroll range. A page's `first` is
+* the earliest slide aligned at its position, which is also the index reported there: at the
+* clamped end that is the first slide of the last full view, not the start of the last group.
+*/
+const buildPages = (geo, snaps, group, anchor) => {
+	const pages = [];
+	const add = (pos) => {
+		const first = snaps.findIndex((snap) => snap >= pos - 2);
+		pages.push({
+			pos,
+			first: first < 0 ? snaps.length - 1 : first
+		});
+	};
+	for (const start of pageStarts(geo, snaps, group, anchor)) if (!pages.length || snaps[start] > pages[pages.length - 1].pos + 2) add(snaps[start]);
+	if (pages.length && pages[pages.length - 1].pos < geo.max - 2) add(geo.max);
+	return pages;
+};
+/** The page that contains slide `index`. */
+const pageOf = (pages, index) => {
+	let page = 0;
+	pages.forEach((candidate, i) => {
+		if (candidate.first <= index) page = i;
+	});
+	return page;
+};
+/** First and last slide that are at least half visible at `pos`, or [-1, -1]. */
+const visibleRange = (pos, { starts, sizes, port }) => {
+	let first = -1;
+	let last = -1;
+	starts.forEach((start, i) => {
+		if (Math.min(start + sizes[i], pos + port) - Math.max(start, pos) >= sizes[i] / 2 - .5) {
+			if (first < 0) first = i;
+			last = i;
+		}
+	});
+	return [first, last];
+};
+//#endregion
+export { snapPositions as a, pageOf as i, clamp as n, visibleRange as o, closest as r, buildPages as t };

package/package.json

@@ -1,27 +1,57 @@
 {
   "name": "@nordwerk/scroll-carousel",
-  "version": "0.1.3",
+  "version": "0.1.5",
   "description": "A dependency-free carousel on native scrolling: CSS scroll snap first, arrows, dots, paging and an API as progressive enhancement.",
-  "license": "MIT",
-  "type": "module",
-  "repository": {
-    "type": "git",
-    "url": "git+https://github.com/studio-nordwerk/scroll-carousel.git"
-  },
-  "homepage": "https://www.nordwerk.studio/oss/scroll-carousel",
   "keywords": [
+    "accessibility",
+    "astro",
     "carousel",
-    "slider",
-    "scroll-snap",
+    "preact",
     "progressive-enhancement",
-    "accessibility",
     "react",
-    "preact",
-    "astro"
+    "scroll-snap",
+    "slider"
+  ],
+  "homepage": "https://www.nordwerk.studio/oss/scroll-carousel",
+  "bugs": "https://github.com/studio-nordwerk/oss-ui/issues",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/studio-nordwerk/oss-ui.git",
+    "directory": "packages/scroll-carousel"
+  },
+  "files": [
+    "dist",
+    "src/astro",
+    "AGENTS.md",
+    "CHANGELOG.md",
+    "docs/migration.md"
   ],
+  "type": "module",
   "sideEffects": [
     "*.css"
   ],
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "typesVersions": {
+    "*": {
+      "drag": [
+        "./dist/drag.d.ts"
+      ],
+      "autoplay": [
+        "./dist/autoplay.d.ts"
+      ],
+      "markup": [
+        "./dist/markup.d.ts"
+      ],
+      "react": [
+        "./dist/react.d.ts"
+      ],
+      "preact": [
+        "./dist/preact.d.ts"
+      ]
+    }
+  },
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
@@ -52,27 +82,24 @@
     "./carousel.layer.css": "./dist/carousel.layer.css",
     "./package.json": "./package.json"
   },
-  "files": [
-    "dist",
-    "src/astro",
-    "AGENTS.md",
-    "CHANGELOG.md",
-    "docs/migration.md"
-  ],
   "publishConfig": {
     "access": "public"
   },
   "scripts": {
-    "build": "node scripts/build.mjs",
-    "typecheck": "tsc -p tsconfig.json --noEmit && tsc -p registry/tsconfig.json",
-    "test": "node --test \"test/unit/*.test.ts\"",
-    "size": "node scripts/size.mjs",
-    "site": "node scripts/build.mjs && node site/generate.mjs",
-    "fixtures": "node scripts/fixtures.mjs",
-    "test:e2e": "playwright test",
-    "serve": "node scripts/serve.mjs",
-    "check": "pnpm typecheck && pnpm test && pnpm site && pnpm size && pnpm fixtures && pnpm test:e2e",
-    "prepublishOnly": "node scripts/build.mjs"
+    "build": "vp pack",
+    "prepublishOnly": "vp pack"
+  },
+  "devDependencies": {
+    "@base-ui/react": "^1.8.0",
+    "@types/react": "^19.3.0",
+    "@types/react-dom": "^19.3.0",
+    "astro": "^7.3.3",
+    "class-variance-authority": "^0.7.1",
+    "cn": "^0.3.2",
+    "preact": "^10.29.8",
+    "preact-render-to-string": "6.7.0",
+    "react": "^19.3.0",
+    "react-dom": "^19.3.0"
   },
   "peerDependencies": {
     "preact": ">=10",
@@ -85,27 +112,5 @@
     "react": {
       "optional": true
     }
-  },
-  "devDependencies": {
-    "@axe-core/playwright": "4.13.0",
-    "@fontsource-variable/geist": "^5.3.0",
-    "@playwright/test": "1.61.1",
-    "@tailwindcss/cli": "4.3.3",
-    "@types/node": "^24.0.0",
-    "@types/react": "^19.3.0",
-    "@types/react-dom": "^19.3.0",
-    "astro": "^7.3.3",
-    "esbuild": "0.28.2",
-    "preact": "^10.29.8",
-    "preact-render-to-string": "6.7.0",
-    "react": "^19.3.0",
-    "react-dom": "^19.3.0",
-    "shadcn": "4.21.0",
-    "tailwindcss": "4.3.3",
-    "typescript": "^7.0.2"
-  },
-  "engines": {
-    "node": ">=22"
-  },
-  "packageManager": "pnpm@12.5.1"
+  }
 }

package/dist/adapter.d.ts

@@ -1,55 +0,0 @@
-import { type Carousel, type CarouselOptions, type CarouselState, type Plugin } from './index.js';
-import { type LayoutProps } from './markup.js';
-export interface CarouselProps extends LayoutProps {
-    /** Accessible name of the scrolling list. */
-    label: string;
-    /** Element of the track. With 'ul' every child is wrapped in <li>, otherwise in <div>. */
-    as?: 'ul' | 'div';
-    children?: unknown;
-    className?: string;
-    style?: Record<string, string | number>;
-    slideClassName?: string;
-    /** Mark slides as groups with aria-roledescription="slide" and "n of count" labels. */
-    slideRoles?: boolean;
-    /** Keep a short row in the middle instead of at the start. */
-    centerFew?: boolean;
-    /** Default arrows. false renders none, e.g. when the host brings its own. */
-    arrows?: boolean;
-    /** Default dots. */
-    dots?: boolean;
-    /** Render a play/pause button for the autoplay plugin. */
-    playButton?: boolean;
-    labels?: CarouselOptions['labels'] & {
-        prev?: string;
-        next?: string;
-    };
-    initial?: number;
-    rewind?: CarouselOptions['rewind'];
-    group?: LayoutProps['group'];
-    plugins?: Plugin[];
-    onChange?: (state: CarouselState) => void;
-    /** Receives the carousel after attaching, and null after it is destroyed. */
-    carouselRef?: (carousel: Carousel | null) => void;
-}
-export interface Framework {
-    createElement: (...args: any[]) => any;
-    Fragment: any;
-    useState: <T>(initial: T) => [T, (value: T) => void];
-    useRef: <T>(initial: T) => {
-        current: T;
-    };
-    useEffect: (effect: () => void | (() => void), deps?: unknown[]) => void;
-    useLayoutEffect: (effect: () => void | (() => void), deps?: unknown[]) => void;
-    useId: () => string;
-    toChildArray: (children: unknown) => any[];
-}
-export declare function createAdapter(framework: Framework): {
-    Carousel: (props: CarouselProps) => any;
-    useCarousel: (options?: CarouselOptions) => {
-        ref: {
-            current: HTMLElement | null;
-        };
-        carousel: Carousel | null;
-        state: CarouselState | null;
-    };
-};

package/dist/math.d.ts

@@ -1,45 +0,0 @@
-export type Align = 'start' | 'center' | 'end';
-export type Group = number | 'page';
-export interface Geometry {
-    /** Start of each slide in scroll-content coordinates, px. */
-    starts: number[];
-    /** Inline size of each slide, px. */
-    sizes: number[];
-    /** Width of the scrollport, px. */
-    port: number;
-    /** Scroll padding at the start and the end, px. */
-    padStart: number;
-    padEnd: number;
-    /** Largest scroll position, px. */
-    max: number;
-    align: Align;
-}
-export interface Page {
-    /** Scroll position of the page. */
-    pos: number;
-    /** Index of the first slide of the page. */
-    first: number;
-}
-/** Two positions closer than this, in px, are the same place. */
-export declare const EPS = 2;
-export declare const clamp: (value: number, min: number, max: number) => number;
-/** Index of the value closest to `target`; the earliest one wins a tie. */
-export declare const closest: (values: number[], target: number) => number;
-/** The scroll position at which each slide is aligned, clamped to the scroll range. */
-export declare const snapPositions: ({ starts, sizes, port, padStart, padEnd, max, align }: Geometry) => number[];
-/**
- * The first slide of every page. Pages are counted outwards from `anchor` (the initial slide),
- * so the initial slide always starts a page and the first page may be shorter than the rest.
- * `group` is a number of slides, or 'page' for as many whole slides as fit in the view.
- */
-export declare const pageStarts: (geo: Geometry, snaps: number[], group: Group, anchor: number) => number[];
-/**
- * Pages at distinct positions, always ending at the end of the scroll range. A page's `first` is
- * the earliest slide aligned at its position, which is also the index reported there: at the
- * clamped end that is the first slide of the last full view, not the start of the last group.
- */
-export declare const buildPages: (geo: Geometry, snaps: number[], group: Group, anchor: number) => Page[];
-/** The page that contains slide `index`. */
-export declare const pageOf: (pages: Page[], index: number) => number;
-/** First and last slide that are at least half visible at `pos`, or [-1, -1]. */
-export declare const visibleRange: (pos: number, { starts, sizes, port }: Geometry) => [number, number];