@atelic-action/ui 0.17.2 → 1.0.0

package/src/lib/basePathAudit.ts

@@ -0,0 +1,96 @@
+/**
+ * The build's base path audit, kept pure so the tests can drive it; a site's
+ * build runs it over dist/client through `atelic-check-base-path`.
+ *
+ * Two failures it exists to catch. A root absolute path that skipped
+ * `withBase` still builds and still prerenders (the crawler prefixes it on its
+ * own), and only breaks once the site is served under its base, as a link to
+ * the host owner's page or an image that 404s. And a based cut whose
+ * vercel.json lacks the two rewrites serves fine through the host owner's
+ * proxy but 404s every asset on its own Vercel host, while a root cut that
+ * kept them carries a stray rule. Neither shows up in a root build, so both
+ * fail the build loudly instead.
+ */
+import { hasBase } from "../routing/basePath";
+
+const ATTRIBUTE = /\s(?:href|src|action|poster)\s*=\s*"([^"]*)"/g;
+const SRCSET = /\ssrcset\s*=\s*"([^"]*)"/gi;
+const CSS_URL = /url\(\s*(['"]?)([^'")]+)\1\s*\)/g;
+
+function isRootAbsolute(ref: string): boolean {
+	return ref.startsWith("/") && !ref.startsWith("//");
+}
+
+/** Every root absolute path an HTML document references through an attribute. */
+export function htmlRefs(html: string): string[] {
+	const refs: string[] = [];
+	for (const match of html.matchAll(ATTRIBUTE)) refs.push(match[1]);
+	for (const match of html.matchAll(SRCSET)) {
+		for (const candidate of match[1].split(",")) refs.push(candidate.trim().split(/\s+/)[0]);
+	}
+	return refs.filter(isRootAbsolute);
+}
+
+/** Every root absolute path a stylesheet references through `url()`. */
+export function cssRefs(css: string): string[] {
+	return [...css.matchAll(CSS_URL)].map((match) => match[2].trim()).filter(isRootAbsolute);
+}
+
+/** The root absolute references that do not carry the base. Empty at the root. */
+export function unbasedRefs(refs: string[], base: string): string[] {
+	if (!base) return [];
+	return [...new Set(refs.filter((ref) => !hasBase(base, ref)))];
+}
+
+export interface Rewrite {
+	source: string;
+	destination: string;
+}
+
+/** The two rewrites a based cut's vercel.json carries, so its own host serves the prefixed URLs. */
+export function expectedRewrites(base: string): Rewrite[] {
+	if (!base) return [];
+	return [
+		{ source: `${base}/:path*`, destination: "/:path*" },
+		{ source: base, destination: "/" },
+	];
+}
+
+/**
+ * True for a rewrite of the base path shape: a prefix's subtree mapped back
+ * onto the root, or the bare prefix mapped onto "/" beside such a subtree
+ * rule (alone, "/home" to "/" is an ordinary rewrite and stays legal).
+ */
+function isBaseRewrite(rewrite: Rewrite, all: Rewrite[]): boolean {
+	if (rewrite.destination === "/:path*" && rewrite.source.endsWith("/:path*")) return true;
+	return (
+		rewrite.destination === "/" &&
+		all.some((r) => r.source === `${rewrite.source}/:path*` && r.destination === "/:path*")
+	);
+}
+
+/**
+ * What is wrong with vercel.json's rewrites for this base: a missing expected
+ * rewrite, or a base path rewrite for a prefix the build does not carry.
+ */
+export function rewriteProblems(vercel: { rewrites?: Rewrite[] }, base: string): string[] {
+	const rewrites = vercel.rewrites ?? [];
+	const expected = expectedRewrites(base);
+	const problems: string[] = [];
+	for (const want of expected) {
+		if (!rewrites.some((r) => r.source === want.source && r.destination === want.destination)) {
+			problems.push(`missing rewrite ${JSON.stringify(want)}`);
+		}
+	}
+	for (const rewrite of rewrites) {
+		const wanted = expected.some(
+			(want) => want.source === rewrite.source && want.destination === rewrite.destination,
+		);
+		if (!wanted && isBaseRewrite(rewrite, rewrites)) {
+			problems.push(
+				`stray base path rewrite ${JSON.stringify(rewrite)} for a build ${base ? `based at ${base}` : "at the root"}`,
+			);
+		}
+	}
+	return problems;
+}

package/src/lib/displayDate.ts

@@ -0,0 +1,25 @@
+const MONTHS = [
+	"January",
+	"February",
+	"March",
+	"April",
+	"May",
+	"June",
+	"July",
+	"August",
+	"September",
+	"October",
+	"November",
+	"December",
+];
+
+/**
+ * "2025-03-27" or a full ISO timestamp -> "March 27, 2025". The calendar date
+ * is read off the string, never through Date(), which lands a bare date a day
+ * early west of UTC. Anything unreadable is returned as given.
+ */
+export function displayDate(iso: string): string {
+	const [year, month, day] = iso.slice(0, 10).split("-").map(Number);
+	if (!year || !month || !day || month > 12) return iso;
+	return `${MONTHS[month - 1]} ${day}, ${year}`;
+}

package/src/lib/honeypot.ts

@@ -0,0 +1,11 @@
+/**
+ * The contact form's honeypot. Humans never see the "company" field, so any
+ * value in it marks a bot. The relay a site runs (its api/contact.ts) drops
+ * such a submission behind the same quiet success a real send gets, so the
+ * bot learns nothing, and ContactForm, holding the value it just sent, skips
+ * the lead event that success would otherwise earn. A site's relay applies
+ * this same predicate, so the two never disagree about a bot.
+ */
+export function isHoneypotFilled(value: unknown): boolean {
+	return String(value ?? "").trim() !== "";
+}

package/src/lib/hours.ts

@@ -0,0 +1,28 @@
+import type { OpeningHours } from "../sections/siteConfig";
+
+/**
+ * Formats a 24 hour "HH:MM" time as the display style used across the
+ * marketing components: "11:00" -> "11:00a", "19:00" -> "7:00p".
+ * With short: true, whole hours drop their minutes: "11a", "7p".
+ */
+export function formatClock(time: string, opts: { short?: boolean } = {}): string {
+	const [hourStr, minuteStr = "00"] = time.split(":");
+	const hour24 = Number(hourStr);
+	const suffix = hour24 % 24 >= 12 ? "p" : "a";
+	const hour = hour24 % 12 || 12;
+	if (opts.short && minuteStr === "00") return `${hour}${suffix}`;
+	return `${hour}:${minuteStr}${suffix}`;
+}
+
+export function isClosed(row: OpeningHours): boolean {
+	return !row.opens || !row.closes;
+}
+
+/**
+ * "11:00a to 7:00p" (or "11a to 7p" with short: true). Rows without times
+ * render their note ("By appointment") when present, else "Closed".
+ */
+export function formatHoursRange(row: OpeningHours, opts: { short?: boolean } = {}): string {
+	if (!row.opens || !row.closes) return row.note ?? "Closed";
+	return `${formatClock(row.opens, opts)} to ${formatClock(row.closes, opts)}`;
+}

package/src/lib/sitemap.ts

@@ -0,0 +1,34 @@
+/**
+ * Sitemap cleanup, run after the build writes sitemap.xml.
+ *
+ * The prerender crawler adds every internal link it follows to the page list,
+ * so an in page link like `/services#dry-needling` lands in the sitemap as its
+ * own URL, and an index route like `/blog/` lands beside the `/blog` the nav
+ * links to. Google ignores fragments, and every page declares its canonical
+ * without the trailing slash, so each one is a duplicate of a page already
+ * listed. This strips the fragment and the trailing slash from every `<loc>`
+ * and keeps the first entry per resulting URL, so a page reached only through
+ * a section link or its slashed form still stays listed. The root keeps its
+ * slash.
+ */
+
+const URL_BLOCK = /[ \t]*<url>[\s\S]*?<\/url>\s*/g;
+const LOC = /<loc>([^<]*)<\/loc>/;
+const TRAILING_SLASH = /^(\w+:\/\/[^/]+\/.*?[^/])\/+$/;
+
+export function dedupeSitemap(xml: string): { xml: string; removed: number } {
+	const seen = new Set<string>();
+	let removed = 0;
+	const cleaned = xml.replace(URL_BLOCK, (block) => {
+		const match = block.match(LOC);
+		if (!match) return block;
+		const loc = match[1].split("#")[0].replace(TRAILING_SLASH, "$1");
+		if (seen.has(loc)) {
+			removed++;
+			return "";
+		}
+		seen.add(loc);
+		return block.replace(LOC, () => `<loc>${loc}</loc>`);
+	});
+	return { xml: cleaned, removed };
+}

package/src/lib/trackEvent.ts

@@ -0,0 +1,26 @@
+/**
+ * Sends one GA4 event through the Google tag a site loads, and nothing else:
+ * the tag itself, and the delegated listener for the click events, stay in
+ * the site. A silent no op when the tag is absent (no tag id configured, the
+ * script blocked, prerender with no window), and it never throws, since
+ * analytics must never break the page. Beacon transport, so an event fired on
+ * the way out of the page survives the navigation.
+ *
+ * Params are closed vocabularies: never a name, a phone number, an email
+ * address, or a message.
+ */
+
+type Gtag = (...args: unknown[]) => void;
+
+export type EventParams = Record<string, string | number | boolean>;
+
+export function trackEvent(name: string, params: EventParams = {}): void {
+	if (typeof window === "undefined") return;
+	try {
+		const gtag = (window as Window & { gtag?: Gtag }).gtag;
+		if (typeof gtag !== "function") return;
+		gtag("event", name, { ...params, transport_type: "beacon" });
+	} catch {
+		// Analytics must never break the page.
+	}
+}

package/src/lib/useOpenHeight.ts

@@ -0,0 +1,28 @@
+import { useEffect, useLayoutEffect, useRef, useState } from "react";
+
+const useIsoLayoutEffect = typeof window === "undefined" ? useEffect : useLayoutEffect;
+
+/**
+ * The max height an expanding body animates to. Put `ref` on the content
+ * inside the clipped box: the height is measured before paint when the row
+ * opens (so a row that mounts already open is never clipped to nothing) and
+ * re-measured whenever the content resizes (rotation, font swap, late image).
+ * The layout effect runs before paint, so the 0 it starts from is never seen
+ * clipped, and the first open animates like every later one.
+ */
+export function useOpenHeight(open: boolean) {
+	const ref = useRef<HTMLDivElement>(null);
+	const [height, setHeight] = useState<number | null>(null);
+
+	useIsoLayoutEffect(() => {
+		const el = ref.current;
+		if (!open || !el) return;
+		setHeight(el.scrollHeight);
+		if (typeof ResizeObserver === "undefined") return;
+		const observer = new ResizeObserver(() => setHeight(el.scrollHeight));
+		observer.observe(el);
+		return () => observer.disconnect();
+	}, [open]);
+
+	return { ref, maxHeight: open ? (height ?? 0) : 0 } as const;
+}

package/src/primitives/Button.tsx

@@ -1,5 +1,6 @@
 import type { CSSProperties, ReactNode } from "react";
 import { newTabProps } from "../lib/newTabProps";
+import { useWithBase } from "../routing/BasePathProvider";
 
 export interface ButtonProps {
 	variant?: "primary" | "dark" | "ghost";
@@ -39,6 +40,7 @@ export function Button({
 	style,
 	children,
 }: ButtonProps) {
+	const withBase = useWithBase();
 	const classes = [
 		"btn",
 		`btn-${variant}`,
@@ -63,7 +65,7 @@ export function Button({
 	if (href) {
 		return (
 			<a
-				href={href}
+				href={withBase(href)}
 				className={classes}
 				style={style}
 				aria-label={ariaLabel}

package/src/primitives/Chip.tsx

@@ -1,4 +1,5 @@
 import type { ReactNode } from "react";
+import { useWithBase } from "../routing/BasePathProvider";
 
 export interface ChipProps {
 	/** Shows the small brand-colored dot before the label. */
@@ -12,6 +13,7 @@ export interface ChipProps {
 
 /** Small mono tag/badge, used for credentials, tags, and service areas. */
 export function Chip({ dot = false, onDark = false, href, children }: ChipProps) {
+	const withBase = useWithBase();
 	const classes = ["chip", onDark && "on-dark"].filter(Boolean).join(" ");
 	const content = (
 		<>
@@ -21,7 +23,7 @@ export function Chip({ dot = false, onDark = false, href, children }: ChipProps)
 	);
 	if (href) {
 		return (
-			<a className={classes} href={href}>
+			<a className={classes} href={withBase(href)}>
 				{content}
 			</a>
 		);

package/src/primitives/ImageFrame.tsx

@@ -0,0 +1,48 @@
+import type { CSSProperties } from "react";
+import { useWithBase } from "../routing/BasePathProvider";
+
+export interface ImageFrameProps {
+	src?: string;
+	alt?: string;
+	/** CSS aspect-ratio for the frame, e.g. "4/5". */
+	aspectRatio?: string;
+	maxWidth?: string;
+	/** Placeholder label rendered when no src is provided yet. */
+	placeholder?: string;
+	/** Set on above-the-fold imagery; defaults to lazy loading. */
+	priority?: boolean;
+	className?: string;
+	style?: CSSProperties;
+}
+
+/** Rounded, shadowed media frame; renders a labeled placeholder block until an image exists. */
+export function ImageFrame({
+	src,
+	alt = "",
+	aspectRatio,
+	maxWidth,
+	placeholder,
+	priority = false,
+	className,
+	style,
+}: ImageFrameProps) {
+	const withBase = useWithBase();
+	const frameStyle: CSSProperties = { aspectRatio, maxWidth, ...style };
+	if (!src) {
+		return (
+			<div className={["ph", className].filter(Boolean).join(" ")} style={frameStyle}>
+				{placeholder ?? "Image"}
+			</div>
+		);
+	}
+	return (
+		<div className={["imgframe", className].filter(Boolean).join(" ")} style={frameStyle}>
+			<img
+				src={withBase(src)}
+				alt={alt}
+				loading={priority ? undefined : "lazy"}
+				fetchPriority={priority ? "high" : undefined}
+			/>
+		</div>
+	);
+}

package/src/primitives/ProseBlocks.tsx

@@ -0,0 +1,67 @@
+/**
+ * One block of ported prose. A deliberately tiny vocabulary — headings,
+ * paragraphs, lists — because that is what survives extraction from a CMS
+ * intact, and because anything richer invites rewriting content that was
+ * meant to be carried across verbatim.
+ */
+export interface ProseBlock {
+	type: "h" | "p" | "ul";
+	/** Present for "h" and "p". */
+	text?: string;
+	/** Present for "ul". */
+	items?: string[];
+}
+
+export interface ProseBlocksProps {
+	blocks: ProseBlock[];
+	/**
+	 * Heading level for "h" blocks. Defaults to h2, since the page's h1
+	 * belongs to whatever hero sits above this.
+	 */
+	headingLevel?: "h2" | "h3";
+	className?: string;
+}
+
+/**
+ * Renders a document body from data rather than markup: legal pages, ported
+ * blog posts, anything whose words came from somewhere else and must not be
+ * quietly edited on the way in.
+ *
+ * Keys are derived from content plus position. Repeated text is common in
+ * ported prose ("Contact us" appears in three legal documents), so neither
+ * alone is stable.
+ */
+export function ProseBlocks({ blocks, headingLevel = "h2", className }: ProseBlocksProps) {
+	const Heading = headingLevel;
+	return (
+		<div className={["prose-blocks", className].filter(Boolean).join(" ")}>
+			{blocks.map((block, i) => {
+				if (block.type === "h") {
+					return (
+						// biome-ignore lint/suspicious/noArrayIndexKey: static ported prose; position plus content is the stable key (see above)
+						<Heading className="pb-heading" key={`h-${i}-${block.text?.slice(0, 24)}`}>
+							{block.text}
+						</Heading>
+					);
+				}
+				if (block.type === "ul") {
+					return (
+						// biome-ignore lint/suspicious/noArrayIndexKey: static ported prose; position plus content is the stable key (see above)
+						<ul className="pb-list" key={`ul-${i}-${(block.items ?? [])[0]?.slice(0, 24)}`}>
+							{(block.items ?? []).map((item, j) => (
+								// biome-ignore lint/suspicious/noArrayIndexKey: static ported prose; position plus content is the stable key (see above)
+								<li key={`${j}-${item.slice(0, 40)}`}>{item}</li>
+							))}
+						</ul>
+					);
+				}
+				return (
+					// biome-ignore lint/suspicious/noArrayIndexKey: static ported prose; position plus content is the stable key (see above)
+					<p className="pb-body" key={`p-${i}-${block.text?.slice(0, 24)}`}>
+						{block.text}
+					</p>
+				);
+			})}
+		</div>
+	);
+}

package/src/primitives/QuoteCard.tsx

@@ -0,0 +1,20 @@
+import type { ReactNode } from "react";
+
+export interface QuoteCardProps {
+	quote: ReactNode;
+	/** Attribution line, e.g. "Dr. Alex Rivers, PT, DPT". */
+	by: string;
+	center?: boolean;
+	className?: string;
+}
+
+/** Testimonial / pull-quote card with serif italic type. */
+export function QuoteCard({ quote, by, center = false, className }: QuoteCardProps) {
+	const classes = ["quote-card", center && "center", className].filter(Boolean).join(" ");
+	return (
+		<figure className={classes}>
+			<blockquote>{quote}</blockquote>
+			<figcaption className="by">{by}</figcaption>
+		</figure>
+	);
+}

package/src/primitives/StarRow.tsx

@@ -0,0 +1,37 @@
+import { Star } from "lucide-react";
+
+export interface StarRowProps {
+	/** Star count, 1 to 5. Rounded and clamped into range. */
+	rating: number;
+	/** Glyph size in px. */
+	size?: number;
+	className?: string;
+}
+
+/**
+ * A row of filled stars, rendered as a single labeled image so screen
+ * readers announce "4 out of 5 stars" instead of four decorative glyphs.
+ * Shared by the review components; render one only when the source
+ * actually shows a rating — never invent one.
+ */
+export function StarRow({ rating, size = 15, className }: StarRowProps) {
+	const count = Math.max(1, Math.min(5, Math.round(rating)));
+	return (
+		<span
+			className={["star-row", className].filter(Boolean).join(" ")}
+			role="img"
+			aria-label={`${count} out of 5 stars`}
+		>
+			{Array.from({ length: count }, (_, i) => (
+				<Star
+					// biome-ignore lint/suspicious/noArrayIndexKey: static decorative row
+					key={i}
+					size={size}
+					strokeWidth={1.5}
+					fill="currentColor"
+					aria-hidden="true"
+				/>
+			))}
+		</span>
+	);
+}

package/src/primitives/TickList.tsx

@@ -0,0 +1,24 @@
+import { Check } from "lucide-react";
+import type { ReactNode } from "react";
+
+export interface TickListProps {
+	items: ReactNode[];
+	className?: string;
+}
+
+/** Checkmark bullet list used in feature details and pricing cards. */
+export function TickList({ items, className }: TickListProps) {
+	return (
+		<ul className={["ticks", className].filter(Boolean).join(" ")}>
+			{items.map((item, i) => (
+				// biome-ignore lint/suspicious/noArrayIndexKey: static content lists never reorder
+				<li key={i}>
+					<span className="tick" aria-hidden="true">
+						<Check size={12} strokeWidth={3} />
+					</span>
+					{item}
+				</li>
+			))}
+		</ul>
+	);
+}

package/src/primitives/index.ts

@@ -1,5 +1,10 @@
 export { Button, type ButtonProps } from "./Button";
 export { Chip, type ChipProps } from "./Chip";
 export { Eyebrow, type EyebrowProps } from "./Eyebrow";
+export { ImageFrame, type ImageFrameProps } from "./ImageFrame";
 export { Lead, type LeadProps } from "./Lead";
+export { type ProseBlock, ProseBlocks, type ProseBlocksProps } from "./ProseBlocks";
+export { QuoteCard, type QuoteCardProps } from "./QuoteCard";
 export { SectionHeading, type SectionHeadingProps } from "./SectionHeading";
+export { StarRow, type StarRowProps } from "./StarRow";
+export { TickList, type TickListProps } from "./TickList";

package/src/routing/BasePathProvider.tsx

@@ -0,0 +1,47 @@
+import { createContext, type ReactNode, useCallback, useContext } from "react";
+import { joinBase, normalizeBasePath } from "./basePath";
+
+/**
+ * The base path every link the package renders carries. The package imports
+ * no router and reads no build setting, so a site says its base once, here,
+ * and `Button`, `Chip`, and every section that builds a link or an image
+ * source read it through `useBasePath`. `SiteShell` mounts the provider from
+ * its `basePath` prop, so a site that renders its pages inside the shell
+ * never mounts it by hand.
+ *
+ * With no provider above it the base is "", the root, and every path renders
+ * as given.
+ */
+const BasePathContext = createContext("");
+
+export interface BasePathProviderProps {
+	/** The prefix the site is served under: "", "/", "proto", and "/proto/" are all read as written. */
+	base?: string;
+	children: ReactNode;
+}
+
+export function BasePathProvider({ base, children }: BasePathProviderProps) {
+	return (
+		<BasePathContext.Provider value={normalizeBasePath(base)}>{children}</BasePathContext.Provider>
+	);
+}
+
+/** The base path in force: "" at the root, otherwise "/proto" in normalized form. */
+export function useBasePath(): string {
+	return useContext(BasePathContext);
+}
+
+/**
+ * A function that puts the base in force on a root absolute path. External
+ * URLs, protocol links, fragments, and paths that already carry the base pass
+ * through unchanged, and so does `undefined`, so an optional prop can be
+ * handed over as it is.
+ */
+export function useWithBase(): <T extends string | undefined>(path: T) => T {
+	const base = useBasePath();
+	return useCallback(
+		<T extends string | undefined>(path: T): T =>
+			(path === undefined ? path : joinBase(base, path)) as T,
+		[base],
+	);
+}

package/src/routing/basePath.ts

@@ -0,0 +1,57 @@
+/**
+ * The base path: the prefix a site is served under when it does not own the
+ * root of its host (a website build previewed at `/proto` on the business's
+ * artifact host). A site sets it once; `BasePathProvider` hands it to every
+ * component below, and `marketingConfig` turns it into Vite's `base` and the
+ * router's `basepath`.
+ *
+ * Normalized form: "" for the root, otherwise a leading slash and no trailing
+ * slash ("/proto"). These helpers are pure and take the base explicitly, so
+ * the Vite config, the build commands, and the tests use them as they are.
+ * Plain TypeScript with no imports, since the built Vite entry imports it.
+ */
+
+const SEGMENT = /^(\/[A-Za-z0-9._~-]+)+$/;
+
+/** Turns a configured value ("", "/", "proto", "/proto/") into "" or "/proto". Throws on anything else. */
+export function normalizeBasePath(raw: string | undefined): string {
+	const trimmed = (raw ?? "").trim();
+	if (trimmed === "" || trimmed === "/") return "";
+	const base = `/${trimmed.replace(/^\/+|\/+$/g, "")}`;
+	if (!SEGMENT.test(base)) {
+		throw new Error(
+			`basePath must be a path such as "/proto" (letters, digits, dot, dash, underscore, tilde): got ${JSON.stringify(raw)}`,
+		);
+	}
+	return base;
+}
+
+/** True for a path the base applies to: root absolute, not protocol relative. */
+function isRootAbsolute(path: string): boolean {
+	return path.startsWith("/") && !path.startsWith("//");
+}
+
+/** True when the path already carries the base (so applying it again is a no op). */
+export function hasBase(base: string, path: string): boolean {
+	if (!base) return true;
+	if (!path.startsWith(base)) return false;
+	const next = path.charAt(base.length);
+	return next === "" || next === "/" || next === "?" || next === "#";
+}
+
+/**
+ * Prefixes a root absolute path with the base. External URLs, protocol links
+ * (mailto:, tel:), fragments, relative paths, and paths that already carry the
+ * base come back unchanged, so it is safe on any href and idempotent.
+ */
+export function joinBase(base: string, path: string): string {
+	if (!base || !isRootAbsolute(path) || hasBase(base, path)) return path;
+	return `${base}${path}`;
+}
+
+/** Removes the base from a path that carries it ("/proto/faqs" to "/faqs", "/proto" to "/"). */
+export function stripBase(base: string, path: string): string {
+	if (!base || !isRootAbsolute(path) || !path.startsWith(base) || !hasBase(base, path)) return path;
+	const rest = path.slice(base.length);
+	return rest === "" || !rest.startsWith("/") ? `/${rest}` : rest;
+}

package/src/routing/index.ts

@@ -29,3 +29,11 @@ export function staticNotFoundRouting<Page>(page: Page) {
 		defaultPendingComponent: page,
 	};
 }
+
+export {
+	BasePathProvider,
+	type BasePathProviderProps,
+	useBasePath,
+	useWithBase,
+} from "./BasePathProvider";
+export { hasBase, joinBase, normalizeBasePath, stripBase } from "./basePath";