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

package/dist/components/form/form-context.d.ts

@@ -0,0 +1,24 @@
+import { type Context } from "react";
+declare const FormDisabledContext: Context<boolean>;
+/** Provides whether the enclosing `Form.Root` is busy. */
+export declare const FormDisabledProvider: typeof FormDisabledContext.Provider;
+/**
+ * Whether an enclosing `Form.Root` is busy, so its controls are disabled. A
+ * control whose primitive ignores the disabled `<fieldset>` reads this.
+ *
+ * @example
+ * const formDisabled = useFormDisabled();
+ */
+export declare const useFormDisabled: () => boolean;
+declare const FormStatusContext: Context<HTMLElement | null>;
+/** Provides the live region `Form.Submit` announces its wait in. */
+export declare const FormStatusProvider: typeof FormStatusContext.Provider;
+/**
+ * The enclosing `Form.Root`'s live region, which sits outside its inert fields.
+ *
+ * @example
+ * const status = useFormStatus();
+ */
+export declare const useFormStatus: () => HTMLElement | null;
+export {};
+//# sourceMappingURL=form-context.d.ts.map

package/dist/components/form/form-context.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"form-context.d.ts","sourceRoot":"","sources":["../../../src/components/form/form-context.ts"],"names":[],"mappings":"AAAA,OAAO,EACN,KAAK,OAAO,EAGZ,MAAM,OAAO,CAAC;AAEf,QAAA,MAAM,mBAAmB,EAAE,OAAO,CAAC,OAAO,CACrB,CAAC;AAEtB,0DAA0D;AAC1D,eAAO,MAAM,oBAAoB,EAAE,OAAO,mBAAmB,CAAC,QACjC,CAAC;AAE9B;;;;;;GAMG;AACH,eAAO,MAAM,eAAe,QAAO,OACH,CAAC;AAEjC,QAAA,MAAM,iBAAiB,EAAE,OAAO,CAAC,WAAW,GAAG,IAAI,CACX,CAAC;AAEzC,oEAAoE;AACpE,eAAO,MAAM,kBAAkB,EAAE,OAAO,iBAAiB,CAAC,QAC/B,CAAC;AAE5B;;;;;GAKG;AACH,eAAO,MAAM,aAAa,QAAO,WAAW,GAAG,IACjB,CAAC"}

package/dist/components/form/form-context.js

@@ -0,0 +1,28 @@
+import { createContext, useContext } from "react";
+// src/components/form/form-context.ts
+var FormDisabledContext = createContext(false);
+/** Provides whether the enclosing `Form.Root` is busy. */
+var FormDisabledProvider = FormDisabledContext.Provider;
+/**
+* Whether an enclosing `Form.Root` is busy, so its controls are disabled. A
+* control whose primitive ignores the disabled `<fieldset>` reads this.
+*
+* @example
+* const formDisabled = useFormDisabled();
+*/
+var useFormDisabled = () => {
+	return useContext(FormDisabledContext);
+};
+var FormStatusContext = createContext(null);
+/** Provides the live region `Form.Submit` announces its wait in. */
+var FormStatusProvider = FormStatusContext.Provider;
+/**
+* The enclosing `Form.Root`'s live region, which sits outside its inert fields.
+*
+* @example
+* const status = useFormStatus();
+*/
+var useFormStatus = () => {
+	return useContext(FormStatusContext);
+};
+export { FormDisabledProvider, FormStatusProvider, useFormDisabled, useFormStatus };

package/dist/components/form/form.css

@@ -0,0 +1,14 @@
+@layer kit.reset, kit.base, kit.components;
+@layer kit.components {
+  ._fieldset_1kw7m_3 {
+    display: contents;
+  }
+  ._status_1kw7m_6 {
+    position: absolute;
+    overflow: hidden;
+    clip-path: inset(50%);
+    inline-size: 1px;
+    block-size: 1px;
+    white-space: nowrap;
+  }
+}

package/dist/components/form/form.d.ts

@@ -0,0 +1,69 @@
+import { type AnyFormApi } from "@tanstack/react-form";
+import { type ComponentPropsWithRef, type ReactNode } from "react";
+import { type LeaveGuardPolicy } from "../../lib/unsaved-changes/policy.ts";
+import { type ButtonProps } from "../button/index.ts";
+export type FormRootProps = Omit<ComponentPropsWithRef<"form">, "onSubmit" | "children"> & Readonly<{
+    /** The form instance, from `useAppForm`. */
+    form: AnyFormApi;
+    /** Work the form waits on besides its own submit, such as a mutation it started. */
+    busy?: boolean;
+    /** When the form reports unsaved changes to the page's leave guards, decided from its live state. Defaults to `whenDirty`. */
+    leaveGuard?: LeaveGuardPolicy;
+    children: ReactNode;
+}>;
+/**
+ * The `<form>`: submits through the form instance, leaves validation to it,
+ * disables and inerts its fields while busy, and focuses the first invalid
+ * control after a failed submit. While its `leaveGuard` policy holds, it
+ * reports unsaved changes to the page's leave guards. Its parts read the
+ * form from it.
+ *
+ * @example
+ * <Form.Root form={form}>…</Form.Root>
+ */
+declare const FormRoot: ({ form, busy, leaveGuard, children, ...props }: FormRootProps) => ReactNode;
+export type FormErrorsProps = Readonly<{
+    className?: string;
+}>;
+/**
+ * The errors that belong to the form rather than to one of its fields, such
+ * as a refusal `onSubmitAsync` returns. Renders nothing when there are none.
+ *
+ * @example
+ * <Form.Errors />
+ */
+declare const FormErrors: ({ className, }: FormErrorsProps) => ReactNode;
+export type FormSubmitProps = Omit<Extract<ButtonProps, Readonly<{
+    iconOnly?: false;
+}>>, "type" | "iconOnly"> & Readonly<{
+    /** What a wait is announced as once it has lasted, such as "Saving". */
+    busyLabel: string;
+}>;
+/**
+ * The form's submit button. A wait that lasts 150 ms shows a spinner and is
+ * announced as `busyLabel`, and stays shown at least 200 ms.
+ *
+ * @example
+ * <Form.Submit busyLabel="Saving">Save</Form.Submit>
+ */
+declare const FormSubmit: ({ busyLabel, variant, icon, children, ...props }: FormSubmitProps) => ReactNode;
+/** The parts of a form. */
+export type FormParts = Readonly<{
+    Root: typeof FormRoot;
+    Errors: typeof FormErrors;
+    Submit: typeof FormSubmit;
+}>;
+/**
+ * A form over a TanStack Form instance: `Root` is the `<form>`, `Errors` its
+ * form-level errors and `Submit` its submit button.
+ *
+ * @example
+ * <Form.Root form={form}>
+ * 	<form.AppField name="email">{field => <field.EmailField label="Email" optionalLabel="optional" />}</form.AppField>
+ * 	<Form.Errors />
+ * 	<Form.Submit busyLabel="Signing in">Sign in</Form.Submit>
+ * </Form.Root>
+ */
+export declare const Form: FormParts;
+export {};
+//# sourceMappingURL=form.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"form.d.ts","sourceRoot":"","sources":["../../../src/components/form/form.tsx"],"names":[],"mappings":"AAAA,OAAO,EACN,KAAK,UAAU,EAEf,MAAM,sBAAsB,CAAC;AAC9B,OAAO,EACN,KAAK,qBAAqB,EAC1B,KAAK,SAAS,EAId,MAAM,OAAO,CAAC;AASf,OAAO,EACN,KAAK,gBAAgB,EAErB,MAAM,qCAAqC,CAAC;AAE7C,OAAO,EAEN,KAAK,WAAW,EAChB,MAAM,oBAAoB,CAAC;AAgB5B,MAAM,MAAM,aAAa,GAAG,IAAI,CAC/B,qBAAqB,CAAC,MAAM,CAAC,EAC7B,UAAU,GAAG,UAAU,CACvB,GACA,QAAQ,CAAC;IACR,4CAA4C;IAC5C,IAAI,EAAE,UAAU,CAAC;IACjB,oFAAoF;IACpF,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,8HAA8H;IAC9H,UAAU,CAAC,EAAE,gBAAgB,CAAC;IAC9B,QAAQ,EAAE,SAAS,CAAC;CACpB,CAAC,CAAC;AAEJ;;;;;;;;;GASG;AACH,QAAA,MAAM,QAAQ,mDAMX,aAAa,KAAG,SA+DlB,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG,QAAQ,CAAC;IACtC,SAAS,CAAC,EAAE,MAAM,CAAC;CACnB,CAAC,CAAC;AAEH;;;;;;GAMG;AACH,QAAA,MAAM,UAAU,mBAEb,eAAe,KAAG,SAWpB,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG,IAAI,CACjC,OAAO,CAAC,WAAW,EAAE,QAAQ,CAAC;IAAE,QAAQ,CAAC,EAAE,KAAK,CAAA;CAAE,CAAC,CAAC,EACpD,MAAM,GAAG,UAAU,CACnB,GACA,QAAQ,CAAC;IACR,wEAAwE;IACxE,SAAS,EAAE,MAAM,CAAC;CAClB,CAAC,CAAC;AAEJ;;;;;;GAMG;AACH,QAAA,MAAM,UAAU,qDAMb,eAAe,KAAG,SAqBpB,CAAC;AAEF,2BAA2B;AAC3B,MAAM,MAAM,SAAS,GAAG,QAAQ,CAAC;IAChC,IAAI,EAAE,OAAO,QAAQ,CAAC;IACtB,MAAM,EAAE,OAAO,UAAU,CAAC;IAC1B,MAAM,EAAE,OAAO,UAAU,CAAC;CAC1B,CAAC,CAAC;AAEH;;;;;;;;;;GAUG;AACH,eAAO,MAAM,IAAI,EAAE,SAIlB,CAAC"}

package/dist/components/form/form.js

@@ -0,0 +1,317 @@
+import { formContext, useFormContext } from "../../lib/forms/context.js";
+import { normalizeFieldErrors } from "../../lib/forms/errors.js";
+import { useFailedSubmitFocus } from "../../lib/forms/failed-submit.js";
+import { useBusyPhase } from "../../lib/hooks/use-busy-phase.js";
+import { whenDirty } from "../../lib/unsaved-changes/policy.js";
+import { useReportUnsavedChanges } from "../../lib/unsaved-changes/registry.js";
+import { Button } from "../button/button.js";
+import { ErrorCascadeProvider, createErrorCascade } from "../error-text/error-cascade.js";
+import { ErrorText } from "../error-text/error-text.js";
+import { Spinner } from "../spinner/spinner.js";
+import { focusFirstInvalid } from "./first-invalid.js";
+import { FormDisabledProvider, FormStatusProvider, useFormDisabled, useFormStatus } from "./form-context.js";
+import form_module_default from "./form.module.js";
+import { c } from "react/compiler-runtime";
+import { useEffect, useRef, useState } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+import { useStore } from "@tanstack/react-form";
+import { createPortal } from "react-dom";
+// src/components/form/form.tsx
+/**
+* The `<form>`: submits through the form instance, leaves validation to it,
+* disables and inerts its fields while busy, and focuses the first invalid
+* control after a failed submit. While its `leaveGuard` policy holds, it
+* reports unsaved changes to the page's leave guards. Its parts read the
+* form from it.
+*
+* @example
+* <Form.Root form={form}>…</Form.Root>
+*/
+var FormRoot = (t0) => {
+	const $ = c(34);
+	let children;
+	let form;
+	let props;
+	let t1;
+	let t2;
+	if ($[0] !== t0) {
+		({form, busy: t1, leaveGuard: t2, children, ...props} = t0);
+		$[0] = t0;
+		$[1] = children;
+		$[2] = form;
+		$[3] = props;
+		$[4] = t1;
+		$[5] = t2;
+	} else {
+		children = $[1];
+		form = $[2];
+		props = $[3];
+		t1 = $[4];
+		t2 = $[5];
+	}
+	const busy = t1 === void 0 ? false : t1;
+	const leaveGuard = t2 === void 0 ? whenDirty : t2;
+	const submitting = useStore(form.store, _temp);
+	const guarded = useStore(form.store, leaveGuard);
+	useReportUnsavedChanges(guarded);
+	const disabled = busy || submitting;
+	const content = useRef(null);
+	const [invalidSubmits, setInvalidSubmits] = useState(0);
+	const focusedSubmits = useRef(0);
+	const [cascade] = useState(_temp2);
+	const [status, setStatus] = useState(null);
+	let t3;
+	if ($[6] === Symbol.for("react.memo_cache_sentinel")) {
+		t3 = () => setInvalidSubmits(_temp3);
+		$[6] = t3;
+	} else t3 = $[6];
+	useFailedSubmitFocus(form, t3);
+	let t4;
+	let t5;
+	if ($[7] !== disabled || $[8] !== invalidSubmits) {
+		t4 = () => {
+			if (disabled || content.current === null || focusedSubmits.current === invalidSubmits) return;
+			focusedSubmits.current = invalidSubmits;
+			focusFirstInvalid(content.current);
+		};
+		t5 = [disabled, invalidSubmits];
+		$[7] = disabled;
+		$[8] = invalidSubmits;
+		$[9] = t4;
+		$[10] = t5;
+	} else {
+		t4 = $[9];
+		t5 = $[10];
+	}
+	useEffect(t4, t5);
+	const t6 = disabled || void 0;
+	let t7;
+	if ($[11] !== form) {
+		t7 = (event) => {
+			event.preventDefault();
+			form.handleSubmit();
+		};
+		$[11] = form;
+		$[12] = t7;
+	} else t7 = $[12];
+	let t8;
+	if ($[13] !== cascade || $[14] !== children) {
+		t8 = /* @__PURE__ */ jsx(ErrorCascadeProvider, {
+			value: cascade,
+			children
+		});
+		$[13] = cascade;
+		$[14] = children;
+		$[15] = t8;
+	} else t8 = $[15];
+	let t9;
+	if ($[16] !== status || $[17] !== t8) {
+		t9 = /* @__PURE__ */ jsx(FormStatusProvider, {
+			value: status,
+			children: t8
+		});
+		$[16] = status;
+		$[17] = t8;
+		$[18] = t9;
+	} else t9 = $[18];
+	let t10;
+	if ($[19] !== disabled || $[20] !== t9) {
+		t10 = /* @__PURE__ */ jsx(FormDisabledProvider, {
+			value: disabled,
+			children: t9
+		});
+		$[19] = disabled;
+		$[20] = t9;
+		$[21] = t10;
+	} else t10 = $[21];
+	let t11;
+	if ($[22] !== disabled || $[23] !== t10) {
+		t11 = /* @__PURE__ */ jsx("fieldset", {
+			ref: content,
+			disabled,
+			inert: disabled,
+			className: form_module_default.fieldset,
+			children: t10
+		});
+		$[22] = disabled;
+		$[23] = t10;
+		$[24] = t11;
+	} else t11 = $[24];
+	let t12;
+	if ($[25] === Symbol.for("react.memo_cache_sentinel")) {
+		t12 = /* @__PURE__ */ jsx("span", {
+			ref: setStatus,
+			role: "status",
+			className: form_module_default.status
+		});
+		$[25] = t12;
+	} else t12 = $[25];
+	let t13;
+	if ($[26] !== props || $[27] !== t11 || $[28] !== t6 || $[29] !== t7) {
+		t13 = /* @__PURE__ */ jsxs("form", {
+			noValidate: true,
+			"aria-busy": t6,
+			...props,
+			onSubmit: t7,
+			children: [t11, t12]
+		});
+		$[26] = props;
+		$[27] = t11;
+		$[28] = t6;
+		$[29] = t7;
+		$[30] = t13;
+	} else t13 = $[30];
+	let t14;
+	if ($[31] !== form || $[32] !== t13) {
+		t14 = /* @__PURE__ */ jsx(formContext.Provider, {
+			value: form,
+			children: t13
+		});
+		$[31] = form;
+		$[32] = t13;
+		$[33] = t14;
+	} else t14 = $[33];
+	return t14;
+};
+/**
+* The errors that belong to the form rather than to one of its fields, such
+* as a refusal `onSubmitAsync` returns. Renders nothing when there are none.
+*
+* @example
+* <Form.Errors />
+*/
+var FormErrors = (t0) => {
+	const $ = c(5);
+	const { className } = t0;
+	const form = useFormContext();
+	const errors = useStore(form.store, _temp4);
+	let t1;
+	if ($[0] !== errors) {
+		t1 = normalizeFieldErrors(errors);
+		$[0] = errors;
+		$[1] = t1;
+	} else t1 = $[1];
+	let t2;
+	if ($[2] !== className || $[3] !== t1) {
+		t2 = /* @__PURE__ */ jsx(ErrorText, {
+			role: "alert",
+			className,
+			children: t1
+		});
+		$[2] = className;
+		$[3] = t1;
+		$[4] = t2;
+	} else t2 = $[4];
+	return t2;
+};
+/**
+* The form's submit button. A wait that lasts 150 ms shows a spinner and is
+* announced as `busyLabel`, and stays shown at least 200 ms.
+*
+* @example
+* <Form.Submit busyLabel="Saving">Save</Form.Submit>
+*/
+var FormSubmit = (t0) => {
+	const $ = c(24);
+	let busyLabel;
+	let children;
+	let icon;
+	let props;
+	let t1;
+	if ($[0] !== t0) {
+		({busyLabel, variant: t1, icon, children, ...props} = t0);
+		$[0] = t0;
+		$[1] = busyLabel;
+		$[2] = children;
+		$[3] = icon;
+		$[4] = props;
+		$[5] = t1;
+	} else {
+		busyLabel = $[1];
+		children = $[2];
+		icon = $[3];
+		props = $[4];
+		t1 = $[5];
+	}
+	const variant = t1 === void 0 ? "primary" : t1;
+	const busy = useFormDisabled();
+	const status = useFormStatus();
+	let t2;
+	if ($[6] !== busy) {
+		t2 = { busy };
+		$[6] = busy;
+		$[7] = t2;
+	} else t2 = $[7];
+	const shown = useBusyPhase(t2) !== "fresh";
+	const t3 = shown ? void 0 : icon;
+	const t4 = shown || void 0;
+	let t5;
+	if ($[8] !== shown) {
+		t5 = shown ? /* @__PURE__ */ jsx(Spinner, { size: 1 }) : null;
+		$[8] = shown;
+		$[9] = t5;
+	} else t5 = $[9];
+	let t6;
+	if ($[10] !== children || $[11] !== props || $[12] !== t3 || $[13] !== t4 || $[14] !== t5 || $[15] !== variant) {
+		t6 = /* @__PURE__ */ jsxs(Button, {
+			...props,
+			type: "submit",
+			variant,
+			icon: t3,
+			"aria-busy": t4,
+			children: [t5, children]
+		});
+		$[10] = children;
+		$[11] = props;
+		$[12] = t3;
+		$[13] = t4;
+		$[14] = t5;
+		$[15] = variant;
+		$[16] = t6;
+	} else t6 = $[16];
+	let t7;
+	if ($[17] !== busyLabel || $[18] !== shown || $[19] !== status) {
+		t7 = shown && status !== null ? createPortal(busyLabel, status) : null;
+		$[17] = busyLabel;
+		$[18] = shown;
+		$[19] = status;
+		$[20] = t7;
+	} else t7 = $[20];
+	let t8;
+	if ($[21] !== t6 || $[22] !== t7) {
+		t8 = /* @__PURE__ */ jsxs(Fragment$1, { children: [t6, t7] });
+		$[21] = t6;
+		$[22] = t7;
+		$[23] = t8;
+	} else t8 = $[23];
+	return t8;
+};
+/**
+* A form over a TanStack Form instance: `Root` is the `<form>`, `Errors` its
+* form-level errors and `Submit` its submit button.
+*
+* @example
+* <Form.Root form={form}>
+* 	<form.AppField name="email">{field => <field.EmailField label="Email" optionalLabel="optional" />}</form.AppField>
+* 	<Form.Errors />
+* 	<Form.Submit busyLabel="Signing in">Sign in</Form.Submit>
+* </Form.Root>
+*/
+var Form = {
+	Root: FormRoot,
+	Errors: FormErrors,
+	Submit: FormSubmit
+};
+function _temp(state) {
+	return state.isSubmitting;
+}
+function _temp2() {
+	return createErrorCascade();
+}
+function _temp3(count) {
+	return count + 1;
+}
+function _temp4(state) {
+	return state.errors;
+}
+export { Form };

package/dist/components/form/form.module.js

@@ -0,0 +1,8 @@
+import './form.css';// src/components/form/form.module.scss
+var fieldset = "_fieldset_1kw7m_3";
+var status = "_status_1kw7m_6";
+var form_module_default = {
+	fieldset,
+	status
+};
+export { form_module_default as default, fieldset, status };

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

@@ -0,0 +1,3 @@
+export { useFormDisabled } from "./form-context.ts";
+export * from "./form.tsx";
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/form/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,cAAc,YAAY,CAAC"}

package/dist/components/form/index.js

@@ -0,0 +1,3 @@
+import { useFormDisabled } from "./form-context.js";
+import { Form } from "./form.js";
+export { Form, useFormDisabled };

package/dist/components/icon/icon.css

@@ -0,0 +1,9 @@
+@layer kit.reset, kit.base, kit.components;
+@layer kit.components {
+  ._icon_ex143_3 {
+    display: inline-block;
+    flex-shrink: 0;
+    vertical-align: middle;
+    fill: var(--icon-color, currentcolor);
+  }
+}

package/dist/components/icon/icon.d.ts

@@ -0,0 +1,32 @@
+import type { FunctionComponent, ReactNode, SVGProps } from "react";
+/**
+ * The component type produced by SVGR's `?react` imports
+ * (e.g. `import Close from "@material-design-icons/svg/outlined/close.svg?react"`).
+ */
+export type SvgComponent = FunctionComponent<SVGProps<SVGSVGElement>>;
+export type IconProps = Readonly<{
+    /** The SVG component to render, from a SVGR `?react` import. */
+    svg: SvgComponent;
+    /**
+     * Size relative to the current font size (in `em`). Defaults to `1`
+     * so the icon matches the surrounding text.
+     */
+    size?: number;
+    /**
+     * Human-readable label for assistive tech. An empty string (`""`) hides the
+     * icon from the accessibility tree, for a decorative or already-labelled one.
+     */
+    label: string;
+    className?: string;
+}>;
+/**
+ * Renders an SVG icon with a consistent size and accessibility treatment.
+ * Decorative icons (`label=""`) are hidden from assistive tech; labelled icons
+ * expose `role="img"` with an accessible name.
+ *
+ * @example
+ * import Close from "@material-design-icons/svg/outlined/close.svg?react";
+ * <Icon svg={Close} label="Close" />
+ */
+export declare const Icon: ({ svg: Svg, size, label, className, }: IconProps) => ReactNode;
+//# sourceMappingURL=icon.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"icon.d.ts","sourceRoot":"","sources":["../../../src/components/icon/icon.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EACX,iBAAiB,EACjB,SAAS,EACT,QAAQ,EACR,MAAM,OAAO,CAAC;AAGf;;;GAGG;AACH,MAAM,MAAM,YAAY,GAAG,iBAAiB,CAC3C,QAAQ,CAAC,aAAa,CAAC,CACvB,CAAC;AAEF,MAAM,MAAM,SAAS,GAAG,QAAQ,CAAC;IAChC,gEAAgE;IAChE,GAAG,EAAE,YAAY,CAAC;IAElB;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd,SAAS,CAAC,EAAE,MAAM,CAAC;CACnB,CAAC,CAAC;AAEH;;;;;;;;GAQG;AACH,eAAO,MAAM,IAAI,0CAKd,SAAS,KAAG,SAYd,CAAC"}

package/dist/components/icon/icon.js

@@ -0,0 +1,61 @@
+import icon_module_default from "./icon.module.js";
+import { c } from "react/compiler-runtime";
+import { jsx } from "react/jsx-runtime";
+import { clsx } from "clsx";
+// src/components/icon/icon.tsx
+/**
+* Renders an SVG icon with a consistent size and accessibility treatment.
+* Decorative icons (`label=""`) are hidden from assistive tech; labelled icons
+* expose `role="img"` with an accessible name.
+*
+* @example
+* import Close from "@material-design-icons/svg/outlined/close.svg?react";
+* <Icon svg={Close} label="Close" />
+*/
+var Icon = (t0) => {
+	const $ = c(12);
+	const { svg: Svg, size: t1, label, className } = t0;
+	const size = t1 === void 0 ? 1 : t1;
+	const decorative = label === "";
+	let t2;
+	if ($[0] !== className) {
+		t2 = clsx(icon_module_default.icon, className);
+		$[0] = className;
+		$[1] = t2;
+	} else t2 = $[1];
+	const t3 = `${size}em`;
+	const t4 = `${size}em`;
+	let t5;
+	if ($[2] !== t3 || $[3] !== t4) {
+		t5 = {
+			width: t3,
+			height: t4
+		};
+		$[2] = t3;
+		$[3] = t4;
+		$[4] = t5;
+	} else t5 = $[4];
+	const t6 = decorative || void 0;
+	const t7 = decorative ? void 0 : "img";
+	const t8 = decorative ? void 0 : label;
+	let t9;
+	if ($[5] !== Svg || $[6] !== t2 || $[7] !== t5 || $[8] !== t6 || $[9] !== t7 || $[10] !== t8) {
+		t9 = /* @__PURE__ */ jsx(Svg, {
+			className: t2,
+			style: t5,
+			focusable: "false",
+			"aria-hidden": t6,
+			role: t7,
+			"aria-label": t8
+		});
+		$[5] = Svg;
+		$[6] = t2;
+		$[7] = t5;
+		$[8] = t6;
+		$[9] = t7;
+		$[10] = t8;
+		$[11] = t9;
+	} else t9 = $[11];
+	return t9;
+};
+export { Icon };

package/dist/components/icon/icon.module.js

@@ -0,0 +1,4 @@
+import './icon.css';// src/components/icon/icon.module.scss
+var icon = "_icon_ex143_3";
+var icon_module_default = { icon };
+export { icon_module_default as default, icon };

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

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

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

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

package/dist/components/icon/index.js

@@ -0,0 +1 @@
+export { Icon } from "./icon.js";

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

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

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

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

package/dist/components/link/index.js

@@ -0,0 +1 @@
+export { Link } from "./link.js";

package/dist/components/link/link.css

@@ -0,0 +1,18 @@
+@layer kit.reset, kit.base, kit.components;
+@layer kit.components {
+  ._link_xyp6s_3 {
+    color: var(--link-fg, var(--sys-color-primary));
+    text-decoration: underline;
+    text-underline-offset: var(--link-underline-offset, var(--sys-unit-1));
+  }
+  ._link_xyp6s_3 {
+    outline: 0 solid var(--sys-color-focus-ring);
+    outline-offset: var(--sys-focus-ring-offset);
+  }
+  ._link_xyp6s_3:focus-visible {
+    outline-width: var(--sys-focus-ring-width);
+  }
+  ._link_xyp6s_3:hover {
+    color: var(--link-hover-fg, var(--sys-color-on-primary-container));
+  }
+}

package/dist/components/link/link.d.ts

@@ -0,0 +1,12 @@
+import type { ComponentPropsWithRef, ReactNode } from "react";
+export type LinkProps = ComponentPropsWithRef<"a">;
+/**
+ * The one text link: brand-coloured and underlined. It spreads every prop onto
+ * the `<a>` and forwards its ref, so a router's `createLink` can wrap it.
+ *
+ * @example
+ * const RouterLink = createLink(Link);
+ * <RouterLink to="/register">Create an account</RouterLink>
+ */
+export declare const Link: ({ className, ...anchorProps }: LinkProps) => ReactNode;
+//# sourceMappingURL=link.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"link.d.ts","sourceRoot":"","sources":["../../../src/components/link/link.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EACX,qBAAqB,EACrB,SAAS,EACT,MAAM,OAAO,CAAC;AAGf,MAAM,MAAM,SAAS,GAAG,qBAAqB,CAAC,GAAG,CAAC,CAAC;AAEnD;;;;;;;GAOG;AACH,eAAO,MAAM,IAAI,kCAGd,SAAS,KAAG,SAKd,CAAC"}