@bysages/solid 0.2.2 → 0.3.0

package/dist/components/autocomplete/index.mjs

@@ -0,0 +1,76 @@
+import { injectComponentStyle } from "@bysages/core";
+import { createComponent, mergeProps } from "@solidjs/web";
+import { For, splitProps } from "solid-js";
+import { useListCollection } from "@ark-ui/solid/collection";
+import { Combobox } from "@ark-ui/solid/combobox";
+import { Portal } from "solid-js/web";
+//#region src/components/autocomplete/index.tsx
+/**
+* Free text with suggestions: the reader types anything, the list
+* narrows to help, and both a pick and a custom value end up in the
+* same `value`. A preset of the combobox machinery — same parts,
+* same styling, one job. `items` seeds the suggestion list once;
+* matching is a case-insensitive substring unless `filter` says
+* otherwise.
+*/
+function AutoComplete(props) {
+	injectComponentStyle("combobox");
+	const [own, rest] = splitProps(props, [
+		"value",
+		"items",
+		"placeholder",
+		"size",
+		"filter",
+		"onValueChange"
+	]);
+	const { collection, filter } = useListCollection({
+		initialItems: own.items ?? [],
+		filter: (item, input) => own.filter ? own.filter(item, input) : item.toLowerCase().includes(input.toLowerCase())
+	});
+	return createComponent(Combobox.Root, mergeProps(rest, {
+		get collection() {
+			return collection();
+		},
+		get inputValue() {
+			return own.value;
+		},
+		get "data-size"() {
+			return own.size ?? "md";
+		},
+		allowCustomValue: true,
+		onValueChange: (details) => {
+			const [first] = details.value;
+			if (first != null) own.onValueChange?.(first);
+		},
+		onInputValueChange: (details) => {
+			filter(details.inputValue);
+			own.onValueChange?.(details.inputValue);
+		},
+		positioning: { sameWidth: true },
+		get children() {
+			return [createComponent(Combobox.Control, { get children() {
+				return createComponent(Combobox.Input, { get placeholder() {
+					return own.placeholder;
+				} });
+			} }), createComponent(Portal, { get children() {
+				return createComponent(Combobox.Positioner, { get children() {
+					return createComponent(Combobox.Content, { get children() {
+						return [createComponent(Combobox.Empty, { children: "No matches" }), createComponent(For, {
+							get each() {
+								return collection().items;
+							},
+							children: (item) => createComponent(Combobox.Item, {
+								item,
+								get children() {
+									return createComponent(Combobox.ItemText, { children: item });
+								}
+							})
+						})];
+					} });
+				} });
+			} })];
+		}
+	}));
+}
+//#endregion
+export { AutoComplete };

package/dist/components/avatar/index.d.mts

@@ -0,0 +1,23 @@
+import { ComponentProps } from "solid-js";
+import { Avatar as Avatar$1 } from "@ark-ui/solid/avatar";
+//#region src/components/avatar/index.d.ts
+/** Avatar, dressed in the paper-and-ink system: a circular seal on
+ * inset paper that holds initials until the image loads over them.
+ * `size` picks a control-height rung for the seal — the core styles
+ * re-point `--bs-avatar-size` per rung, and scenes can still retune the
+ * variable directly. */
+export type AvatarSize = "sm" | "md" | "lg";
+export interface AvatarProps extends ComponentProps<typeof Avatar$1.Root> {
+  /** Seal diameter: the small, medium, or large control rung. The
+   * default (large) stands as tall as the biggest control so an avatar
+   * rides a row without stretching it. */
+  size?: AvatarSize;
+  /** The corner: round by default; square cuts it sharp, a stamp
+   * beside a round portrait. */
+  shape?: "circle" | "square";
+}
+declare function AvatarRoot(props: AvatarProps): import("solid-js").JSX.Element;
+export declare const Avatar: typeof Avatar$1 & {
+  Root: typeof AvatarRoot;
+};
+//#endregion

package/dist/components/avatar/index.mjs

@@ -0,0 +1,20 @@
+import { injectComponentStyle } from "@bysages/core";
+import { createComponent, mergeProps } from "@solidjs/web";
+import { splitProps } from "solid-js";
+import { Avatar as Avatar$1 } from "@ark-ui/solid/avatar";
+//#region src/components/avatar/index.tsx
+function AvatarRoot(props) {
+	const [own, rest] = splitProps(props, ["size", "shape"]);
+	return createComponent(Avatar$1.Root, mergeProps(rest, {
+		get "data-size"() {
+			return own.size;
+		},
+		get "data-shape"() {
+			return own.shape ?? "circle";
+		}
+	}));
+}
+const Avatar = Object.assign({}, Avatar$1, { Root: AvatarRoot });
+injectComponentStyle("avatar");
+//#endregion
+export { Avatar };

package/dist/components/avatar-group/index.d.mts

@@ -0,0 +1,11 @@
+import { JSX } from "solid-js";
+//#region src/components/avatar-group/index.d.ts
+/** Avatars overlapping one row, each rimmed in the ground so the pile
+ * stays legible. */
+export interface AvatarGroupProps extends JSX.HTMLAttributes<HTMLDivElement> {
+  /** One register for every seal: falls onto data-size for the
+   * stylesheet to re-point the avatars' measure. */
+  size?: "sm" | "md" | "lg";
+}
+export declare function AvatarGroup(props: AvatarGroupProps): JSX.Element;
+//#endregion

package/dist/components/avatar-group/index.mjs

@@ -0,0 +1,20 @@
+import { injectComponentStyle } from "@bysages/core";
+import { spread, template } from "@solidjs/web";
+import { splitProps } from "solid-js";
+//#region src/components/avatar-group/index.tsx
+var _tmpl$ = /* @__PURE__ */ template(`<div>`);
+function AvatarGroup(props) {
+	injectComponentStyle("avatar-group");
+	const [own, rest] = splitProps(props, ["size"]);
+	var _el$ = _tmpl$();
+	spread(_el$, [rest, {
+		"data-scope": "avatar-group",
+		"data-part": "root",
+		get "data-size"() {
+			return own.size;
+		}
+	}], false);
+	return _el$;
+}
+//#endregion
+export { AvatarGroup };

package/dist/components/back-top/index.d.mts

@@ -0,0 +1,29 @@
+import { JSX } from "solid-js";
+//#region src/components/back-top/index.d.ts
+export interface BackTopProps extends JSX.HTMLAttributes<HTMLButtonElement> {
+  /** How far the reader must have travelled (px) before the affordance
+   * appears. */
+  threshold?: number;
+  /** The accessible name; the control is icon-only by default. */
+  label?: string;
+  /** Ride a scrolling element of your own instead of the page: the
+   * control moors inside that element's corner and watches its
+   * scrollTop. The host supplies the positioning context. */
+  scrollEl?: () => HTMLElement | null;
+}
+/**
+ * A way home: after the page has scrolled past `threshold`, a small
+ * floating control rises at the page's corner and returns the reader to
+ * the top. The scroll itself stays native — `window.scrollTo` defers to
+ * the stylesheet's `scroll-behavior: smooth`, which reduced motion turns
+ * back into an instant jump (a moored control asks the media query
+ * directly, since a scroller of its own has no stylesheet to defer to).
+ * The button stays mounted either way so the entrance is a transition,
+ * never a pop.
+ *
+ * The control itself is the shared `Button` (outline, square) — the
+ * paper, hairline and halo are its; this family owns only the floating
+ * and the entrance.
+ */
+export declare function BackTop(props: BackTopProps): JSX.Element;
+//#endregion

package/dist/components/back-top/index.mjs

@@ -0,0 +1,93 @@
+import { Button } from "../button/index.mjs";
+import { injectComponentStyle } from "@bysages/core";
+import { createComponent, insert, mergeProps, spread, template } from "@solidjs/web";
+import { createSignal, onCleanup, onMount, splitProps } from "solid-js";
+//#region src/components/back-top/index.tsx
+var _tmpl$ = /* @__PURE__ */ template(`<div>`);
+var _tmpl$2 = /* @__PURE__ */ template(`<svg width=16 height=16 viewBox="0 0 24 24"fill=none stroke=currentColor stroke-width=1.75 stroke-linecap=round stroke-linejoin=round aria-hidden=true><path d="m6 14 6-6 6 6">`);
+/**
+* A way home: after the page has scrolled past `threshold`, a small
+* floating control rises at the page's corner and returns the reader to
+* the top. The scroll itself stays native — `window.scrollTo` defers to
+* the stylesheet's `scroll-behavior: smooth`, which reduced motion turns
+* back into an instant jump (a moored control asks the media query
+* directly, since a scroller of its own has no stylesheet to defer to).
+* The button stays mounted either way so the entrance is a transition,
+* never a pop.
+*
+* The control itself is the shared `Button` (outline, square) — the
+* paper, hairline and halo are its; this family owns only the floating
+* and the entrance.
+*/
+function BackTop(props) {
+	injectComponentStyle("back-top");
+	const [own, rest] = splitProps(props, [
+		"threshold",
+		"label",
+		"scrollEl"
+	]);
+	const [visible, setVisible] = createSignal(false);
+	const scroller = () => own.scrollEl?.() ?? null;
+	const onScroll = () => {
+		const el = scroller();
+		setVisible((el ? el.scrollTop : window.scrollY) > (own.threshold ?? 400));
+	};
+	const toTop = () => {
+		const el = scroller();
+		if (!el) {
+			window.scrollTo({ top: 0 });
+			return;
+		}
+		const reduce = window.matchMedia("(prefers-reduced-motion: reduce)").matches;
+		el.scrollTo({
+			top: 0,
+			behavior: reduce ? "auto" : "smooth"
+		});
+	};
+	onMount(() => {
+		const el = scroller();
+		onScroll();
+		if (el) el.addEventListener("scroll", onScroll, { passive: true });
+		else window.addEventListener("scroll", onScroll, { passive: true });
+	});
+	onCleanup(() => {
+		const el = scroller();
+		if (el) el.removeEventListener("scroll", onScroll);
+		else window.removeEventListener("scroll", onScroll);
+	});
+	var _el$ = _tmpl$();
+	spread(_el$, [{
+		"data-scope": "back-top",
+		"data-part": "root",
+		get "data-state"() {
+			return visible() ? "shown" : "hidden";
+		}
+	}, () => {
+		return scroller() ? { "data-container": "" } : {};
+	}], true);
+	insert(_el$, createComponent(Button, mergeProps(rest, {
+		variant: "outline",
+		square: true,
+		size: "lg",
+		get "aria-label"() {
+			return own.label ?? "Back to top";
+		},
+		get "aria-hidden"() {
+			return visible() ? void 0 : "true";
+		},
+		get tabindex() {
+			return visible() ? 0 : -1;
+		},
+		onClick: toTop,
+		get children() {
+			return rest.children ?? chevronUp();
+		}
+	})));
+	return _el$;
+}
+/** The single glyph a way-home control needs: one stroke pointing up. */
+function chevronUp() {
+	return _tmpl$2();
+}
+//#endregion
+export { BackTop };

package/dist/components/badge/index.d.mts

@@ -0,0 +1,10 @@
+import { JSX } from "solid-js";
+//#region src/components/badge/index.d.ts
+/** A small seal of state. Ink is the neutral tone; the four semantic
+ * pigments are fixed. Subtle and outline re-register the same pigment. */
+export interface BadgeProps extends JSX.HTMLAttributes<HTMLSpanElement> {
+  tone?: "ink" | "info" | "success" | "warning" | "danger";
+  variant?: "solid" | "subtle" | "outline";
+}
+export declare function Badge(props: BadgeProps): JSX.Element;
+//#endregion

package/dist/components/badge/index.mjs

@@ -0,0 +1,23 @@
+import { injectComponentStyle } from "@bysages/core";
+import { spread, template } from "@solidjs/web";
+import { splitProps } from "solid-js";
+//#region src/components/badge/index.tsx
+var _tmpl$ = /* @__PURE__ */ template(`<span>`);
+function Badge(props) {
+	injectComponentStyle("badge");
+	const [own, rest] = splitProps(props, ["tone", "variant"]);
+	var _el$ = _tmpl$();
+	spread(_el$, [rest, {
+		"data-scope": "badge",
+		"data-part": "root",
+		get "data-tone"() {
+			return own.tone ?? "ink";
+		},
+		get "data-variant"() {
+			return own.variant ?? "solid";
+		}
+	}], false);
+	return _el$;
+}
+//#endregion
+export { Badge };

package/dist/components/banner/index.d.mts

@@ -0,0 +1,24 @@
+import { JSX } from "solid-js";
+//#region src/components/banner/index.d.ts
+export type BannerStatus = "ink" | "info" | "success" | "warning" | "danger";
+export interface BannerRootProps extends JSX.HTMLAttributes<HTMLDivElement> {
+  status?: BannerStatus;
+}
+/** A page-level notice, spoken across the full measure: a wash of the
+ * status pigment, one heavier hairline on the leading edge, and room
+ * for actions and a quiet close. Ink is the neutral register; the four
+ * semantic pigments are fixed. */
+declare function Root(props: BannerRootProps): JSX.Element;
+/** The quiet close: a plain square-cut button; dismissal stays the
+ * consumer's state. */
+declare function Close(props: JSX.ButtonHTMLAttributes<HTMLButtonElement>): JSX.Element;
+export declare const Banner: typeof Root & {
+  Root: typeof Root;
+  Icon: (props: JSX.HTMLAttributes<HTMLDivElement>) => JSX.Element;
+  Body: (props: JSX.HTMLAttributes<HTMLDivElement>) => JSX.Element;
+  Title: (props: JSX.HTMLAttributes<HTMLDivElement>) => JSX.Element;
+  Description: (props: JSX.HTMLAttributes<HTMLDivElement>) => JSX.Element;
+  Actions: (props: JSX.HTMLAttributes<HTMLDivElement>) => JSX.Element;
+  Close: typeof Close;
+};
+//#endregion

package/dist/components/banner/index.mjs

@@ -0,0 +1,67 @@
+import { injectComponentStyle } from "@bysages/core";
+import { createComponent, mergeProps, spread, template } from "@solidjs/web";
+import { splitProps } from "solid-js";
+//#region src/components/banner/index.tsx
+var _tmpl$ = /* @__PURE__ */ template(`<div>`);
+var _tmpl$2 = /* @__PURE__ */ template(`<button><svg viewBox="0 0 16 16"fill=none aria-hidden=true><path d="M4 4l8 8M12 4l-8 8"stroke=currentColor stroke-width=1.5 stroke-linecap=round>`);
+/** A page-level notice, spoken across the full measure: a wash of the
+* status pigment, one heavier hairline on the leading edge, and room
+* for actions and a quiet close. Ink is the neutral register; the four
+* semantic pigments are fixed. */
+function Root(props) {
+	const [own, rest] = splitProps(props, ["status"]);
+	const status = own.status ?? "ink";
+	var _el$ = _tmpl$();
+	spread(_el$, [rest, {
+		role: status === "ink" ? void 0 : "status",
+		"data-scope": "banner",
+		"data-part": "root",
+		"data-status": status
+	}], false);
+	return _el$;
+}
+function part(name, tag) {
+	function Component(props) {
+		return createComponent(tag, mergeProps(props, {
+			"data-scope": "banner",
+			get "data-part"() {
+				return name.toLowerCase();
+			}
+		}));
+	}
+	return Component;
+}
+const Icon = part("Icon", "span");
+const Body = part("Body", "div");
+const Title = part("Title", "p");
+const Description = part("Description", "p");
+const Actions = part("Actions", "div");
+/** The quiet close: a plain square-cut button; dismissal stays the
+* consumer's state. */
+function Close(props) {
+	const [own, rest] = splitProps(props, ["type"]);
+	var _el$2 = _tmpl$2();
+	spread(_el$2, [rest, {
+		get type() {
+			return own.type ?? "button";
+		},
+		get "aria-label"() {
+			return rest["aria-label"] ?? "Dismiss";
+		},
+		"data-scope": "banner",
+		"data-part": "close"
+	}], true);
+	return _el$2;
+}
+const Banner = Object.assign(Root, {
+	Root,
+	Icon,
+	Body,
+	Title,
+	Description,
+	Actions,
+	Close
+});
+injectComponentStyle("banner");
+//#endregion
+export { Banner };

package/dist/components/bento/index.d.mts

@@ -0,0 +1,24 @@
+import { JSX } from "solid-js";
+//#region src/components/bento/index.d.ts
+export interface BentoProps extends JSX.HTMLAttributes<HTMLDivElement> {
+  /** Tracks across the lattice. */
+  columns?: number;
+}
+export interface BentoCellProps extends JSX.HTMLAttributes<HTMLDivElement> {
+  /** Columns this tile claims. */
+  span?: number;
+  /** Rows this tile claims. */
+  rowSpan?: number;
+}
+/** The bento lattice: a grid of unequal tiles that reads as one plate.
+ * The container owns the track count; each cell claims its own span. */
+export declare function BentoRoot(props: BentoProps): JSX.Element;
+/** One tile: `span` claims columns, `rowSpan` claims rows — the rest
+ * of the plate stays in measure. */
+export declare function BentoCell(props: BentoCellProps): JSX.Element;
+/** The whole family under one handle — Bento.Root, Bento.Cell. */
+export declare const Bento: typeof BentoRoot & {
+  Root: typeof BentoRoot;
+  Cell: typeof BentoCell;
+};
+//#endregion

package/dist/components/bento/index.mjs

@@ -0,0 +1,51 @@
+import { injectComponentStyle } from "@bysages/core";
+import { insert, spread, template } from "@solidjs/web";
+import { splitProps } from "solid-js";
+//#region src/components/bento/index.tsx
+var _tmpl$ = /* @__PURE__ */ template(`<div>`);
+/** The bento lattice: a grid of unequal tiles that reads as one plate.
+* The container owns the track count; each cell claims its own span. */
+function BentoRoot(props) {
+	injectComponentStyle("bento");
+	const [own, rest] = splitProps(props, ["columns"]);
+	var _el$ = _tmpl$();
+	spread(_el$, [rest, {
+		"data-scope": "bento",
+		"data-part": "root",
+		get style() {
+			return { "--bs-bento-columns": String(own.columns ?? 3) };
+		}
+	}], true);
+	insert(_el$, () => {
+		return rest.children;
+	});
+	return _el$;
+}
+/** One tile: `span` claims columns, `rowSpan` claims rows — the rest
+* of the plate stays in measure. */
+function BentoCell(props) {
+	injectComponentStyle("bento");
+	const [own, rest] = splitProps(props, ["span", "rowSpan"]);
+	var _el$2 = _tmpl$();
+	spread(_el$2, [rest, {
+		"data-scope": "bento",
+		"data-part": "cell",
+		get style() {
+			return {
+				"--bs-bento-span-x": String(own.span ?? 1),
+				"--bs-bento-span-y": String(own.rowSpan ?? 1)
+			};
+		}
+	}], true);
+	insert(_el$2, () => {
+		return rest.children;
+	});
+	return _el$2;
+}
+/** The whole family under one handle — Bento.Root, Bento.Cell. */
+const Bento = Object.assign(BentoRoot, {
+	Root: BentoRoot,
+	Cell: BentoCell
+});
+//#endregion
+export { Bento, BentoCell, BentoRoot };

package/dist/components/block-ui/index.d.mts

@@ -0,0 +1,12 @@
+import { JSX } from "solid-js";
+//#region src/components/block-ui/index.d.ts
+export interface BlockUIProps extends JSX.HTMLAttributes<HTMLDivElement> {
+  /** Whether the curtain is drawn. */
+  blocked?: boolean;
+  children?: JSX.Element;
+}
+/** A curtain over content that must wait: the blocked region keeps its
+ * shape and dims under frosted paper while a quiet wheel reports the
+ * wait. Callers own the state; the curtain only answers it. */
+export declare function BlockUI(props: BlockUIProps): JSX.Element;
+//#endregion

package/dist/components/block-ui/index.mjs

@@ -0,0 +1,43 @@
+import { Spinner } from "../spinner/index.mjs";
+import { injectComponentStyle } from "@bysages/core";
+import { createComponent, insert, spread, template } from "@solidjs/web";
+import { Show, splitProps } from "solid-js";
+//#region src/components/block-ui/index.tsx
+var _tmpl$ = /* @__PURE__ */ template(`<div data-scope=block-ui data-part=mask>`);
+var _tmpl$2 = /* @__PURE__ */ template(`<div><!><!>`);
+/** A curtain over content that must wait: the blocked region keeps its
+* shape and dims under frosted paper while a quiet wheel reports the
+* wait. Callers own the state; the curtain only answers it. */
+function BlockUI(props) {
+	injectComponentStyle("block-ui");
+	const [own, rest] = splitProps(props, ["blocked", "children"]);
+	var _el$ = _tmpl$2();
+	var _el$2 = _el$.firstChild;
+	var _el$4 = _el$2.nextSibling;
+	spread(_el$, [rest, {
+		"data-scope": "block-ui",
+		"data-part": "root",
+		get "data-blocked"() {
+			return own.blocked ? "" : void 0;
+		},
+		get "aria-busy"() {
+			return own.blocked || void 0;
+		}
+	}], true);
+	insert(_el$, () => {
+		return own.children;
+	}, _el$2);
+	insert(_el$, createComponent(Show, {
+		get when() {
+			return own.blocked;
+		},
+		get children() {
+			var _el$3 = _tmpl$();
+			insert(_el$3, createComponent(Spinner, { size: "lg" }));
+			return _el$3;
+		}
+	}), _el$4);
+	return _el$;
+}
+//#endregion
+export { BlockUI };

package/dist/components/breadcrumb/index.d.mts

@@ -0,0 +1,11 @@
+import { Component, JSX } from "solid-js";
+//#region src/components/breadcrumb/index.d.ts
+export declare const Breadcrumb: Component<Record<string, unknown>> & {
+  Root: Component<Record<string, unknown>>;
+  List: Component<Record<string, unknown>>;
+  Item: Component<Record<string, unknown>>;
+  Link: Component<Record<string, unknown>>;
+  Current: Component<Record<string, unknown>>;
+  Separator: Component<JSX.HTMLAttributes<HTMLSpanElement>>;
+};
+//#endregion

package/dist/components/breadcrumb/index.mjs

@@ -0,0 +1,45 @@
+import { injectComponentStyle } from "@bysages/core";
+import { createComponent, mergeProps, spread, template } from "@solidjs/web";
+import { mergeProps as mergeProps$1 } from "solid-js";
+//#region src/components/breadcrumb/index.tsx
+var _tmpl$ = /* @__PURE__ */ template(`<span>`);
+/** A trail of waymarks: Root wraps the nav, List the ordered trail, and
+* each Item carries a Link — or the Current page — parted by a quiet
+* Separator. Links take href and the rest through attributes. */
+function part(name, tag, extra = {}) {
+	return ((props) => {
+		return createComponent(tag, mergeProps(extra, props, {
+			"data-scope": "breadcrumb",
+			get "data-part"() {
+				return name.toLowerCase();
+			}
+		}));
+	});
+}
+const Root = part("Root", "nav", { "aria-label": "Breadcrumb" });
+const List = part("List", "ol");
+const Item = part("Item", "li");
+const Link = part("Link", "a");
+const Current = part("Current", "span", { "aria-current": "page" });
+const Separator = (props) => (() => {
+	var _el$ = _tmpl$();
+	spread(_el$, [() => {
+		return mergeProps$1({ children: "/" }, props);
+	}, {
+		"aria-hidden": "true",
+		"data-scope": "breadcrumb",
+		"data-part": "separator"
+	}], false);
+	return _el$;
+})();
+const Breadcrumb = Object.assign(Root, {
+	Root,
+	List,
+	Item,
+	Link,
+	Current,
+	Separator
+});
+injectComponentStyle("breadcrumb");
+//#endregion
+export { Breadcrumb };

package/dist/components/browser/index.d.mts

@@ -0,0 +1,21 @@
+import { JSX } from "solid-js";
+//#region src/components/browser/index.d.ts
+export interface BrowserPartProps extends JSX.HTMLAttributes<HTMLDivElement> {}
+/** The three lamps are the system's own fixed pigments — the same
+ * semantics reserved for danger, warning, and success. */
+export declare function BrowserDots(props: BrowserPartProps): JSX.Element;
+export declare function BrowserRoot(props: BrowserPartProps): JSX.Element;
+export declare function BrowserTitleBar(props: BrowserPartProps): JSX.Element;
+export declare function BrowserUrlBar(props: BrowserPartProps): JSX.Element;
+export declare function BrowserBody(props: BrowserPartProps): JSX.Element;
+/** A browser window as a vessel: title bar, the three lamps, the
+ * address well, and a body that carries whatever the site hangs in
+ * it — an iframe, a screenshot, a live page. */
+export declare const Browser: typeof BrowserRoot & {
+  Root: typeof BrowserRoot;
+  TitleBar: typeof BrowserTitleBar;
+  Dots: typeof BrowserDots;
+  UrlBar: typeof BrowserUrlBar;
+  Body: typeof BrowserBody;
+};
+//#endregion