@maanlamp/react-web-ui 0.0.0-stage → 0.1.1

package/dist/components/time-field/time-input.js

@@ -0,0 +1,66 @@
+import { TemporalFrame, TemporalGroup, TemporalInput, TemporalSegment } from "../../lib/calendar/temporal.js";
+import { Field } from "../field/field.js";
+import { fieldStateAttributes } from "../field/field-state.js";
+import { c } from "react/compiler-runtime";
+import { jsx } from "react/jsx-runtime";
+import { TimeField } from "react-aria-components";
+// src/components/time-field/time-input.tsx
+var TimeInputRoot = (t0) => {
+	const $ = c(10);
+	let props;
+	let state;
+	if ($[0] !== t0) {
+		({state, ...props} = t0);
+		$[0] = t0;
+		$[1] = props;
+		$[2] = state;
+	} else {
+		props = $[1];
+		state = $[2];
+	}
+	let t1;
+	if ($[3] !== state) {
+		t1 = state ?? {};
+		$[3] = state;
+		$[4] = t1;
+	} else t1 = $[4];
+	let t2;
+	if ($[5] !== t1) {
+		t2 = fieldStateAttributes(t1);
+		$[5] = t1;
+		$[6] = t2;
+	} else t2 = $[6];
+	let t3;
+	if ($[7] !== props || $[8] !== t2) {
+		t3 = /* @__PURE__ */ jsx(TimeField, {
+			validationBehavior: "aria",
+			...t2,
+			...props
+		});
+		$[7] = props;
+		$[8] = t2;
+		$[9] = t3;
+	} else t3 = $[9];
+	return t3;
+};
+/**
+* The styled parts of a react-aria `TimeField`, carrying the field frame's ids
+* rather than a label of their own. Its `Group` is the bordered box the
+* segments and any inlay share. For the ordinary case, use `TimeField`.
+*
+* @example
+* <TimeInput.Root aria-labelledby={labelId}>
+* 	<TimeInput.Group state={{ requiredness: "optional" }}>
+* 		<TimeInput.Input />
+* 	</TimeInput.Group>
+* </TimeInput.Root>
+*/
+var TimeInput = {
+	Frame: TemporalFrame,
+	Root: TimeInputRoot,
+	Group: TemporalGroup,
+	Input: TemporalInput,
+	Segment: TemporalSegment,
+	Pending: Field.Pending
+};
+export { TimeInput };

package/dist/components/time-field/tsf-time-field.d.ts

@@ -0,0 +1,15 @@
+import type { ReactNode } from "react";
+import { type ConnectedFieldProps } from "../../lib/forms/use-connected-field.ts";
+import { type TimeFieldProps } from "./time-field.tsx";
+export type TSFTimeFieldProps = Omit<TimeFieldProps, keyof ConnectedFieldProps | "value" | "defaultValue" | "onValueChange">;
+/**
+ * `TimeField` bound to the TanStack Form field it renders in, reached as
+ * `field.TimeField`. The field's value is a `"HH:mm"` string, or `null`.
+ *
+ * @example
+ * <form.AppField name="startTime">
+ * 	{field => <field.TimeField label="Start time" optionalLabel="optional" />}
+ * </form.AppField>
+ */
+export declare const TSFTimeField: (props: TSFTimeFieldProps) => ReactNode;
+//# sourceMappingURL=tsf-time-field.d.ts.map

package/dist/components/time-field/tsf-time-field.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tsf-time-field.d.ts","sourceRoot":"","sources":["../../../src/components/time-field/tsf-time-field.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EACN,KAAK,mBAAmB,EAExB,MAAM,wCAAwC,CAAC;AAChD,OAAO,EAEN,KAAK,cAAc,EACnB,MAAM,kBAAkB,CAAC;AAE1B,MAAM,MAAM,iBAAiB,GAAG,IAAI,CACnC,cAAc,EACZ,MAAM,mBAAmB,GACzB,OAAO,GACP,cAAc,GACd,eAAe,CACjB,CAAC;AAEF;;;;;;;;GAQG;AACH,eAAO,MAAM,YAAY,UACjB,iBAAiB,KACtB,SAaF,CAAC"}

package/dist/components/time-field/tsf-time-field.js

@@ -0,0 +1,40 @@
+import { useConnectedField } from "../../lib/forms/use-connected-field.js";
+import { TimeField } from "./time-field.js";
+import { c } from "react/compiler-runtime";
+import { jsx } from "react/jsx-runtime";
+// src/components/time-field/tsf-time-field.tsx
+/**
+* `TimeField` bound to the TanStack Form field it renders in, reached as
+* `field.TimeField`. The field's value is a `"HH:mm"` string, or `null`.
+*
+* @example
+* <form.AppField name="startTime">
+* 	{field => <field.TimeField label="Start time" optionalLabel="optional" />}
+* </form.AppField>
+*/
+var TSFTimeField = (props) => {
+	const $ = c(7);
+	const { field, props: connected } = useConnectedField();
+	let t0;
+	if ($[0] !== field) {
+		t0 = (next) => field.handleChange(next);
+		$[0] = field;
+		$[1] = t0;
+	} else t0 = $[1];
+	let t1;
+	if ($[2] !== connected || $[3] !== field.state.value || $[4] !== props || $[5] !== t0) {
+		t1 = /* @__PURE__ */ jsx(TimeField, {
+			...props,
+			...connected,
+			value: field.state.value,
+			onValueChange: t0
+		});
+		$[2] = connected;
+		$[3] = field.state.value;
+		$[4] = props;
+		$[5] = t0;
+		$[6] = t1;
+	} else t1 = $[6];
+	return t1;
+};
+export { TSFTimeField };

package/dist/components/time-zone-provider/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./time-zone-provider.tsx";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/time-zone-provider/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/time-zone-provider/index.ts"],"names":[],"mappings":"AAAA,cAAc,0BAA0B,CAAC"}

package/dist/components/time-zone-provider/index.js

@@ -0,0 +1 @@
+export { TimeZoneProvider, useTimeZone } from "./time-zone-provider.js";

package/dist/components/time-zone-provider/time-zone-provider.d.ts

@@ -0,0 +1,23 @@
+import { type ReactNode } from "react";
+export type TimeZoneProviderProps = Readonly<{
+    /** The IANA zone the app's users live in, such as "Europe/Amsterdam". */
+    timeZone: string;
+    children: ReactNode;
+}>;
+/**
+ * The time zone every "today" and every instant the kit shows or takes is read
+ * in.
+ *
+ * @example
+ * <TimeZoneProvider timeZone="Europe/Amsterdam">{app}</TimeZoneProvider>
+ */
+export declare const TimeZoneProvider: ({ timeZone, children, }: TimeZoneProviderProps) => ReactNode;
+/**
+ * The IANA zone of the nearest `TimeZoneProvider`; it throws where there is
+ * none.
+ *
+ * @example
+ * const timeZone = useTimeZone(); // "Europe/Amsterdam"
+ */
+export declare const useTimeZone: () => string;
+//# sourceMappingURL=time-zone-provider.d.ts.map

package/dist/components/time-zone-provider/time-zone-provider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"time-zone-provider.d.ts","sourceRoot":"","sources":["../../../src/components/time-zone-provider/time-zone-provider.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAGtD,MAAM,MAAM,qBAAqB,GAAG,QAAQ,CAAC;IAC5C,yEAAyE;IACzE,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,SAAS,CAAC;CACpB,CAAC,CAAC;AAMH;;;;;;GAMG;AACH,eAAO,MAAM,gBAAgB,4BAG1B,qBAAqB,KAAG,SAI1B,CAAC;AAEF;;;;;;GAMG;AACH,eAAO,MAAM,WAAW,QAAO,MAI7B,CAAC"}

package/dist/components/time-zone-provider/time-zone-provider.js

@@ -0,0 +1,39 @@
+import { useRequiredContext } from "../../lib/use-required-context.js";
+import { c } from "react/compiler-runtime";
+import { createContext } from "react";
+import { jsx } from "react/jsx-runtime";
+// src/components/time-zone-provider/time-zone-provider.tsx
+var TimeZoneContext = createContext(void 0);
+/**
+* The time zone every "today" and every instant the kit shows or takes is read
+* in.
+*
+* @example
+* <TimeZoneProvider timeZone="Europe/Amsterdam">{app}</TimeZoneProvider>
+*/
+var TimeZoneProvider = (t0) => {
+	const $ = c(3);
+	const { timeZone, children } = t0;
+	let t1;
+	if ($[0] !== children || $[1] !== timeZone) {
+		t1 = /* @__PURE__ */ jsx(TimeZoneContext, {
+			value: timeZone,
+			children
+		});
+		$[0] = children;
+		$[1] = timeZone;
+		$[2] = t1;
+	} else t1 = $[2];
+	return t1;
+};
+/**
+* The IANA zone of the nearest `TimeZoneProvider`; it throws where there is
+* none.
+*
+* @example
+* const timeZone = useTimeZone(); // "Europe/Amsterdam"
+*/
+var useTimeZone = () => {
+	return useRequiredContext(TimeZoneContext, "useTimeZone must be used inside a TimeZoneProvider");
+};
+export { TimeZoneProvider, useTimeZone };

package/dist/components/toast/index.d.ts

@@ -0,0 +1,3 @@
+export { type ToastAction, type ToastData, type ToastHelpers, type ToastOptions, type ToastTone, toast, toastManager, useToast, } from "./toast.ts";
+export * from "./toast-provider.tsx";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/toast/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/toast/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACN,KAAK,WAAW,EAChB,KAAK,SAAS,EACd,KAAK,YAAY,EACjB,KAAK,YAAY,EACjB,KAAK,SAAS,EACd,KAAK,EACL,YAAY,EACZ,QAAQ,GACR,MAAM,YAAY,CAAC;AACpB,cAAc,sBAAsB,CAAC"}

package/dist/components/toast/index.js

@@ -0,0 +1,3 @@
+import { toast, toastManager, useToast } from "./toast.js";
+import { ToastProvider } from "./toast-provider.js";
+export { ToastProvider, toast, toastManager, useToast };

package/dist/components/toast/toast-provider.css

@@ -0,0 +1,99 @@
+@layer kit.reset, kit.base, kit.components;
+@layer kit.components {
+  ._viewport_r09x9_3 {
+    position: fixed;
+    inset-block: auto var(--toast-viewport-inset, var(--sys-unit-16));
+    inset-inline: auto var(--toast-viewport-inset, var(--sys-unit-16));
+    display: flex;
+    flex-direction: column;
+    gap: var(--sys-unit-8);
+    inline-size: var(--toast-width, min(24rem, 100vw - 2rem));
+  }
+  ._viewport_r09x9_3 {
+    outline: 0 solid var(--sys-color-focus-ring);
+    outline-offset: var(--sys-focus-ring-offset);
+  }
+  ._viewport_r09x9_3:focus-visible {
+    outline-width: var(--sys-focus-ring-width);
+  }
+  ._toast_r09x9_19 {
+    --_toast-fg: var(--sys-color-text);
+    --_toast-bg: var(--sys-color-surface-overlay-high);
+    box-sizing: border-box;
+    border-radius: var(--toast-radius, var(--sys-radius-md));
+    background: var(--toast-bg, var(--_toast-bg));
+    box-shadow: var(--sys-elevation-2);
+    padding: var(--sys-unit-8);
+    color: var(--toast-fg, var(--_toast-fg));
+    font: var(--sys-font-body-medium);
+  }
+  @media not (prefers-reduced-motion) {
+    ._toast_r09x9_19 {
+      transition: opacity var(--sys-motion-short) var(--sys-motion-standard), scale var(--sys-motion-short) var(--sys-motion-emphasized);
+    }
+  }
+  ._toast_r09x9_19[data-starting-style], ._toast_r09x9_19[data-ending-style] {
+    opacity: 0;
+    scale: 0.8;
+  }
+  ._toast_r09x9_19[data-tone=success] {
+    --_toast-fg: var(--sys-color-success-fg);
+    --_toast-bg: var(--sys-color-success-bg);
+  }
+  ._toast_r09x9_19[data-tone=error] {
+    --_toast-fg: var(--sys-color-error-fg);
+    --_toast-bg: var(--sys-color-error-bg);
+  }
+  ._toast_r09x9_19[data-tone=warning] {
+    --_toast-fg: var(--sys-color-warning-fg);
+    --_toast-bg: var(--sys-color-warning-bg);
+  }
+  ._toast_r09x9_19[data-tone=info] {
+    --_toast-fg: var(--sys-color-info-fg);
+    --_toast-bg: var(--sys-color-info-bg);
+  }
+  ._content_r09x9_55 {
+    display: flex;
+    flex-direction: column;
+    gap: var(--sys-unit-6);
+  }
+  ._header_r09x9_60 {
+    display: flex;
+    align-items: center;
+    gap: var(--sys-unit-6);
+  }
+  ._headingMain_r09x9_65 {
+    display: flex;
+    flex: 1;
+    align-items: center;
+    gap: var(--sys-unit-4);
+    min-inline-size: 0;
+  }
+  ._title_r09x9_72 {
+    font: var(--sys-font-label-medium);
+  }
+  ._description_r09x9_75 {
+    font: var(--sys-font-body-medium);
+    text-wrap: pretty;
+  }
+  ._actions_r09x9_79 {
+    display: flex;
+    gap: var(--sys-unit-4);
+    margin-block-start: var(--sys-unit-2);
+  }
+  ._closeButton_r09x9_84 {
+    --btn-fg: var(--toast-fg, var(--_toast-fg));
+    flex-shrink: 0;
+  }
+  ._action_r09x9_79[data-variant=primary] {
+    --btn-bg: var(--toast-fg, var(--_toast-fg));
+    --btn-fg: var(--toast-bg, var(--_toast-bg));
+  }
+  ._action_r09x9_79[data-variant=secondary] {
+    --btn-bg: var(--sys-color-surface-overlay-high);
+    --btn-fg: var(--toast-fg, var(--_toast-fg));
+  }
+  ._action_r09x9_79[data-variant=tertiary] {
+    --btn-fg: var(--toast-fg, var(--_toast-fg));
+  }
+}

package/dist/components/toast/toast-provider.d.ts

@@ -0,0 +1,19 @@
+import { type ReactNode } from "react";
+export type ToastProviderProps = Readonly<{
+    /** Accessible name of each toast's close button, also its tooltip. */
+    closeLabel: string;
+    /** Accessible name of the region the toasts appear in, reached with F6. */
+    viewportLabel: string;
+    children: ReactNode;
+}>;
+/**
+ * Mounts the toast system once at the app root: provides the global
+ * {@link toastManager} to base-ui and renders the viewport alongside the app.
+ *
+ * @example
+ * <ToastProvider closeLabel="Close" viewportLabel="Notifications">
+ *   <App />
+ * </ToastProvider>
+ */
+export declare const ToastProvider: ({ closeLabel, viewportLabel, children, }: ToastProviderProps) => ReactNode;
+//# sourceMappingURL=toast-provider.d.ts.map

package/dist/components/toast/toast-provider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"toast-provider.d.ts","sourceRoot":"","sources":["../../../src/components/toast/toast-provider.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,KAAK,SAAS,EAAa,MAAM,OAAO,CAAC;AAuGlD,MAAM,MAAM,kBAAkB,GAAG,QAAQ,CAAC;IACzC,sEAAsE;IACtE,UAAU,EAAE,MAAM,CAAC;IACnB,2EAA2E;IAC3E,aAAa,EAAE,MAAM,CAAC;IACtB,QAAQ,EAAE,SAAS,CAAC;CACpB,CAAC,CAAC;AAEH;;;;;;;;GAQG;AACH,eAAO,MAAM,aAAa,6CAIvB,kBAAkB,KAAG,SAevB,CAAC"}

package/dist/components/toast/toast-provider.js

@@ -0,0 +1,203 @@
+import SvgCheckCircle from "../../vendor/@material-design-icons/svg/outlined/check_circle.js";
+import SvgClose from "../../vendor/@material-design-icons/svg/outlined/close.js";
+import SvgError from "../../vendor/@material-design-icons/svg/outlined/error.js";
+import SvgInfo from "../../vendor/@material-design-icons/svg/outlined/info.js";
+import SvgWarningAmber from "../../vendor/@material-design-icons/svg/outlined/warning_amber.js";
+import { Button } from "../button/button.js";
+import { Icon } from "../icon/icon.js";
+import { flushBufferedToasts, toastManager } from "./toast.js";
+import toast_provider_module_default from "./toast-provider.module.js";
+import { c } from "react/compiler-runtime";
+import { useEffect } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+import { Toast } from "@base-ui/react/toast";
+// src/components/toast/toast-provider.tsx
+var TONE_ICON = {
+	success: SvgCheckCircle,
+	error: SvgError,
+	warning: SvgWarningAmber,
+	info: SvgInfo
+};
+var ToastBody = (t0) => {
+	const $ = c(22);
+	const { data, closeLabel, onClose } = t0;
+	if (!data) return null;
+	const t1 = TONE_ICON[data.tone];
+	let t2;
+	if ($[0] !== t1) {
+		t2 = /* @__PURE__ */ jsx(Icon, {
+			svg: t1,
+			size: 1.2,
+			label: ""
+		});
+		$[0] = t1;
+		$[1] = t2;
+	} else t2 = $[1];
+	const t3 = data.title ?? data.body;
+	let t4;
+	if ($[2] !== t3) {
+		t4 = /* @__PURE__ */ jsx(Toast.Title, {
+			className: toast_provider_module_default.title,
+			children: t3
+		});
+		$[2] = t3;
+		$[3] = t4;
+	} else t4 = $[3];
+	let t5;
+	if ($[4] !== t2 || $[5] !== t4) {
+		t5 = /* @__PURE__ */ jsxs("div", {
+			className: toast_provider_module_default.headingMain,
+			children: [t2, t4]
+		});
+		$[4] = t2;
+		$[5] = t4;
+		$[6] = t5;
+	} else t5 = $[6];
+	let t6;
+	if ($[7] !== closeLabel || $[8] !== onClose) {
+		t6 = /* @__PURE__ */ jsx(Button, {
+			className: toast_provider_module_default.closeButton,
+			variant: "tertiary",
+			size: "sm",
+			iconOnly: true,
+			icon: SvgClose,
+			label: closeLabel,
+			onClick: onClose
+		});
+		$[7] = closeLabel;
+		$[8] = onClose;
+		$[9] = t6;
+	} else t6 = $[9];
+	let t7;
+	if ($[10] !== t5 || $[11] !== t6) {
+		t7 = /* @__PURE__ */ jsxs("div", {
+			className: toast_provider_module_default.header,
+			children: [t5, t6]
+		});
+		$[10] = t5;
+		$[11] = t6;
+		$[12] = t7;
+	} else t7 = $[12];
+	let t8;
+	if ($[13] !== data.body || $[14] !== data.title) {
+		t8 = data.title !== void 0 && /* @__PURE__ */ jsx(Toast.Description, {
+			className: toast_provider_module_default.description,
+			children: data.body
+		});
+		$[13] = data.body;
+		$[14] = data.title;
+		$[15] = t8;
+	} else t8 = $[15];
+	let t9;
+	if ($[16] !== data.actions) {
+		t9 = data.actions && data.actions.length > 0 && /* @__PURE__ */ jsx("div", {
+			className: toast_provider_module_default.actions,
+			children: data.actions.map(_temp)
+		});
+		$[16] = data.actions;
+		$[17] = t9;
+	} else t9 = $[17];
+	let t10;
+	if ($[18] !== t7 || $[19] !== t8 || $[20] !== t9) {
+		t10 = /* @__PURE__ */ jsxs(Fragment$1, { children: [
+			t7,
+			t8,
+			t9
+		] });
+		$[18] = t7;
+		$[19] = t8;
+		$[20] = t9;
+		$[21] = t10;
+	} else t10 = $[21];
+	return t10;
+};
+var ToastList = (t0) => {
+	const $ = c(7);
+	const { closeLabel } = t0;
+	const { toasts, close } = Toast.useToastManager();
+	let t1;
+	if ($[0] !== close || $[1] !== closeLabel || $[2] !== toasts) {
+		let t2;
+		if ($[4] !== close || $[5] !== closeLabel) {
+			t2 = (toast) => /* @__PURE__ */ jsx(Toast.Root, {
+				toast,
+				className: toast_provider_module_default.toast,
+				"data-tone": toast.data?.tone,
+				children: /* @__PURE__ */ jsx("div", {
+					className: toast_provider_module_default.content,
+					children: /* @__PURE__ */ jsx(ToastBody, {
+						data: toast.data,
+						closeLabel,
+						onClose: () => close(toast.id)
+					})
+				})
+			}, toast.id);
+			$[4] = close;
+			$[5] = closeLabel;
+			$[6] = t2;
+		} else t2 = $[6];
+		t1 = toasts.map(t2);
+		$[0] = close;
+		$[1] = closeLabel;
+		$[2] = toasts;
+		$[3] = t1;
+	} else t1 = $[3];
+	return t1;
+};
+/**
+* Mounts the toast system once at the app root: provides the global
+* {@link toastManager} to base-ui and renders the viewport alongside the app.
+*
+* @example
+* <ToastProvider closeLabel="Close" viewportLabel="Notifications">
+*   <App />
+* </ToastProvider>
+*/
+var ToastProvider = (t0) => {
+	const $ = c(9);
+	const { closeLabel, viewportLabel, children } = t0;
+	let t1;
+	if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+		t1 = [];
+		$[0] = t1;
+	} else t1 = $[0];
+	useEffect(flushBufferedToasts, t1);
+	let t2;
+	if ($[1] !== closeLabel) {
+		t2 = /* @__PURE__ */ jsx(ToastList, { closeLabel });
+		$[1] = closeLabel;
+		$[2] = t2;
+	} else t2 = $[2];
+	let t3;
+	if ($[3] !== t2 || $[4] !== viewportLabel) {
+		t3 = /* @__PURE__ */ jsx(Toast.Portal, { children: /* @__PURE__ */ jsx(Toast.Viewport, {
+			className: toast_provider_module_default.viewport,
+			"aria-label": viewportLabel,
+			children: t2
+		}) });
+		$[3] = t2;
+		$[4] = viewportLabel;
+		$[5] = t3;
+	} else t3 = $[5];
+	let t4;
+	if ($[6] !== children || $[7] !== t3) {
+		t4 = /* @__PURE__ */ jsxs(Toast.Provider, {
+			toastManager,
+			children: [children, t3]
+		});
+		$[6] = children;
+		$[7] = t3;
+		$[8] = t4;
+	} else t4 = $[8];
+	return t4;
+};
+function _temp(action) {
+	return /* @__PURE__ */ jsx(Button, {
+		className: toast_provider_module_default.action,
+		size: "sm",
+		variant: action.variant ?? "secondary",
+		onClick: action.onClick,
+		children: action.label
+	}, action.label);
+}
+export { ToastProvider };

package/dist/components/toast/toast-provider.module.js

@@ -0,0 +1,24 @@
+import './toast-provider.css';// src/components/toast/toast-provider.module.scss
+var viewport = "_viewport_r09x9_3";
+var toast = "_toast_r09x9_19";
+var content = "_content_r09x9_55";
+var header = "_header_r09x9_60";
+var headingMain = "_headingMain_r09x9_65";
+var title = "_title_r09x9_72";
+var description = "_description_r09x9_75";
+var actions = "_actions_r09x9_79";
+var closeButton = "_closeButton_r09x9_84";
+var action = "_action_r09x9_79";
+var toast_provider_module_default = {
+	viewport,
+	toast,
+	content,
+	header,
+	headingMain,
+	title,
+	description,
+	actions,
+	closeButton,
+	action
+};
+export { action, actions, closeButton, content, toast_provider_module_default as default, description, header, headingMain, title, toast, viewport };

package/dist/components/toast/toast.d.ts

@@ -0,0 +1,89 @@
+import { type ToastManager } from "@base-ui/react/toast";
+import type { ReactNode } from "react";
+import type { Tone } from "../../lib/tone.ts";
+/** A toast's status role; drives its colour and icon. */
+export type ToastTone = Exclude<Tone, "neutral">;
+/** An action button rendered inside a toast, such as Retry on a failed send. */
+export type ToastAction = Readonly<{
+    /** Button label. */
+    label: string;
+    /** Invoked when the button is clicked. */
+    onClick: () => void;
+    /** Visual tier for the action button. @default "secondary" */
+    variant?: "primary" | "secondary" | "tertiary";
+}>;
+/** The data every kit toast carries. */
+export type ToastData = Readonly<{
+    tone: ToastTone;
+    /** Heading above the body, where one line will not carry the news. */
+    title?: ReactNode;
+    body: ReactNode;
+    actions?: ReadonlyArray<ToastAction>;
+}>;
+/** Options accepted by the push helpers. */
+export type ToastOptions = Readonly<{
+    /**
+     * Dedupe key. While a toast pushed with this key is still open, a second
+     * push with the same key is a no-op and returns the existing id.
+     */
+    key?: string;
+    /**
+     * Heading above the body. Without it the body is the toast's own heading, for
+     * copy short enough to read at a glance.
+     */
+    title?: ReactNode;
+    /** Action buttons rendered in the toast. */
+    actions?: ReadonlyArray<ToastAction>;
+    /**
+     * Auto-dismiss timeout in ms. `0` keeps the toast until dismissed. Defaults
+     * to 5000, or `0` when actions are present.
+     */
+    timeout?: number;
+}>;
+/** The global toast manager, living outside React so non-component code can push. */
+export declare const toastManager: ToastManager<ToastData>;
+/**
+ * Releases the toasts pushed before the viewport subscribed to the manager.
+ * Called once by `ToastProvider`, whose own effect runs after base-ui's
+ * subscription; the manager drops anything emitted before that.
+ *
+ * @example
+ * useEffect(flushBufferedToasts, []);
+ */
+export declare const flushBufferedToasts: () => void;
+/** The toast push helpers {@link toast} and {@link useToast} hand out. */
+export type ToastHelpers = Readonly<{
+    /** Pushes a success toast. Returns the toast id. */
+    success: (body: ReactNode, options?: ToastOptions) => string;
+    /** Pushes an error toast. Returns the toast id. */
+    error: (body: ReactNode, options?: ToastOptions) => string;
+    /** Pushes an info toast. Returns the toast id. */
+    info: (body: ReactNode, options?: ToastOptions) => string;
+    /** Pushes a warning toast. Returns the toast id. */
+    warning: (body: ReactNode, options?: ToastOptions) => string;
+    /** Pushes a toast of a tone known only at runtime. Returns the toast id. */
+    notify: (tone: ToastTone, body: ReactNode, options?: ToastOptions) => string;
+    /** Dismisses a toast by id. */
+    dismiss: (id: string) => void;
+}>;
+/**
+ * Pushes toasts from anywhere, components or not, into the viewport
+ * `ToastProvider` renders. `key` dedupes, so one failed item raises one toast.
+ *
+ * @example
+ * toast.error("The comment failed to send.", {
+ * 	key: `outbox-${item.id}`,
+ * 	actions: [{ label: "Retry", onClick: () => retry(item.id) }],
+ * });
+ */
+export declare const toast: ToastHelpers;
+/**
+ * The stable toast push helpers, for components that prefer a hook over
+ * importing {@link toast}.
+ *
+ * @example
+ * const { success } = useToast();
+ * success("Comment sent.");
+ */
+export declare const useToast: () => ToastHelpers;
+//# sourceMappingURL=toast.d.ts.map

package/dist/components/toast/toast.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"toast.d.ts","sourceRoot":"","sources":["../../../src/components/toast/toast.ts"],"names":[],"mappings":"AAAA,OAAO,EAEN,KAAK,YAAY,EACjB,MAAM,sBAAsB,CAAC;AAC9B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAC;AAE9C,yDAAyD;AACzD,MAAM,MAAM,SAAS,GAAG,OAAO,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC;AAEjD,gFAAgF;AAChF,MAAM,MAAM,WAAW,GAAG,QAAQ,CAAC;IAClC,oBAAoB;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,0CAA0C;IAC1C,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,8DAA8D;IAC9D,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,UAAU,CAAC;CAC/C,CAAC,CAAC;AAEH,wCAAwC;AACxC,MAAM,MAAM,SAAS,GAAG,QAAQ,CAAC;IAChC,IAAI,EAAE,SAAS,CAAC;IAChB,sEAAsE;IACtE,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,IAAI,EAAE,SAAS,CAAC;IAChB,OAAO,CAAC,EAAE,aAAa,CAAC,WAAW,CAAC,CAAC;CACrC,CAAC,CAAC;AAEH,4CAA4C;AAC5C,MAAM,MAAM,YAAY,GAAG,QAAQ,CAAC;IACnC;;;OAGG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,4CAA4C;IAC5C,OAAO,CAAC,EAAE,aAAa,CAAC,WAAW,CAAC,CAAC;IACrC;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC,CAAC;AAEH,qFAAqF;AACrF,eAAO,MAAM,YAAY,EAAE,YAAY,CAAC,SAAS,CACX,CAAC;AASvC;;;;;;;GAOG;AACH,eAAO,MAAM,mBAAmB,QAAO,IAKtC,CAAC;AAoDF,0EAA0E;AAC1E,MAAM,MAAM,YAAY,GAAG,QAAQ,CAAC;IACnC,oDAAoD;IACpD,OAAO,EAAE,CACR,IAAI,EAAE,SAAS,EACf,OAAO,CAAC,EAAE,YAAY,KAClB,MAAM,CAAC;IACZ,mDAAmD;IACnD,KAAK,EAAE,CACN,IAAI,EAAE,SAAS,EACf,OAAO,CAAC,EAAE,YAAY,KAClB,MAAM,CAAC;IACZ,kDAAkD;IAClD,IAAI,EAAE,CAAC,IAAI,EAAE,SAAS,EAAE,OAAO,CAAC,EAAE,YAAY,KAAK,MAAM,CAAC;IAC1D,oDAAoD;IACpD,OAAO,EAAE,CACR,IAAI,EAAE,SAAS,EACf,OAAO,CAAC,EAAE,YAAY,KAClB,MAAM,CAAC;IACZ,4EAA4E;IAC5E,MAAM,EAAE,CACP,IAAI,EAAE,SAAS,EACf,IAAI,EAAE,SAAS,EACf,OAAO,CAAC,EAAE,YAAY,KAClB,MAAM,CAAC;IACZ,+BAA+B;IAC/B,OAAO,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;CAC9B,CAAC,CAAC;AAEH;;;;;;;;;GASG;AACH,eAAO,MAAM,KAAK,EAAE,YAUnB,CAAC;AAEF;;;;;;;GAOG;AACH,eAAO,MAAM,QAAQ,QAAO,YAAqB,CAAC"}