asheeui 0.7.0 → 1.1.0

package/dist/components/testimonials/Testimonials.js

@@ -0,0 +1,96 @@
+"use client";
+"use client";
+import { useAsheeConfig as e } from "../../libs/context.js";
+import { resolveConfigCascade as t } from "../../utils/resolve-token.js";
+import { Typography as n } from "../typography/Typography.js";
+import { SectionHeading as r } from "../section-kit/SectionHeading.js";
+import { Avatar as i } from "../avatar/Avatar.js";
+import { Card as a } from "../card/Card.js";
+import { Container as o } from "../container/Container.js";
+import { Section as s } from "../section/Section.js";
+import { Grid as c } from "../grid/Grid.js";
+import { FALLBACK_TESTIMONIALS_CONFIG as l } from "./testimonials-config.js";
+import { TESTIMONIAL_HEADING_CLASS as u, TESTIMONIAL_PERSON_CLASS as d, TESTIMONIAL_QUOTE_CLASS as f } from "./testimonials-styles.js";
+import { forwardRef as p } from "react";
+import { Fragment as m, jsx as h, jsxs as g } from "react/jsx-runtime";
+//#region src/components/testimonials/Testimonials.tsx
+var _ = p(({ eyebrow: p, title: _, description: v, items: y, columns: b, columnsMd: x, columnsLg: S, gap: C, spacing: w, background: T, align: E, containerSize: D, contained: O, as: k, className: A, children: j, ...M }, N) => {
+	let P = e(), F = t({
+		columns: b,
+		columnsMd: x,
+		columnsLg: S,
+		gap: C,
+		spacing: w,
+		background: T,
+		align: E,
+		containerSize: D,
+		contained: O
+	}, P.components?.testimonials, l), I = /* @__PURE__ */ g(m, { children: [
+		/* @__PURE__ */ h(r, {
+			eyebrow: p,
+			title: _,
+			description: v,
+			align: F.align,
+			className: u
+		}),
+		/* @__PURE__ */ h(c, {
+			columns: F.columns,
+			columnsMd: F.columnsMd,
+			columnsLg: F.columnsLg,
+			gap: F.gap,
+			as: "ul",
+			children: y.map((e, t) => /* @__PURE__ */ h("li", {
+				className: "min-w-0",
+				children: /* @__PURE__ */ h(a, {
+					variant: "bordered",
+					size: "md",
+					className: "h-full",
+					children: /* @__PURE__ */ g("figure", {
+						className: f,
+						children: [/* @__PURE__ */ h(n, {
+							as: "blockquote",
+							role: "body-md",
+							children: e.quote
+						}), /* @__PURE__ */ g("figcaption", {
+							className: d,
+							children: [/* @__PURE__ */ h(i, {
+								name: e.name,
+								src: e.avatarSrc,
+								size: "sm",
+								component: e.avatarComponent,
+								componentProps: e.avatarComponentProps
+							}), /* @__PURE__ */ g("span", {
+								className: "flex min-w-0 flex-col",
+								children: [/* @__PURE__ */ h(n, {
+									role: "label",
+									children: e.name
+								}), e.role && /* @__PURE__ */ h(n, {
+									role: "caption",
+									tone: "muted",
+									children: e.role
+								})]
+							})]
+						})]
+					})
+				})
+			}, e.id ?? t))
+		}),
+		j
+	] });
+	return /* @__PURE__ */ h(s, {
+		ref: N,
+		as: k,
+		spacing: F.spacing,
+		background: F.background,
+		contained: !1,
+		className: A,
+		...M,
+		children: F.contained ? /* @__PURE__ */ h(o, {
+			size: F.containerSize,
+			children: I
+		}) : I
+	});
+});
+_.displayName = "Testimonials";
+//#endregion
+export { _ as Testimonials };

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

@@ -0,0 +1,3 @@
+export * from './Testimonials';
+export * from './testimonials-config';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/testimonials/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC;AAC/B,cAAc,uBAAuB,CAAC"}

package/dist/components/testimonials/index.js

@@ -0,0 +1,3 @@
+export * from "./Testimonials.js";
+export * from "./testimonials-config.js";
+export * from "./testimonials-styles.js";

package/dist/components/testimonials/testimonials-config.d.ts

@@ -0,0 +1,44 @@
+import { Space } from '../../shared';
+import { ContainerSize } from '../container/container-config';
+import { GridColumns } from '../grid/grid-config';
+import { SectionBackground } from '../section/section-config';
+/**
+ * Theme configuration options for the Testimonials component.
+ *
+ * Set under `components.testimonials` in the AsheeUI config. Values feed the
+ * component-level fallback tier of the theme cascade.
+ */
+export interface TestimonialsConfig {
+    /** Columns from the smallest viewport upwards. @default 1 */
+    columns?: GridColumns;
+    /** Columns from the `md` breakpoint upwards. @default 2 */
+    columnsMd?: GridColumns;
+    /** Columns from the `lg` breakpoint upwards. @default 3 */
+    columnsLg?: GridColumns;
+    /** Space between the quotes. @default "lg" */
+    gap?: Space;
+    /** Vertical padding of the band. @default "lg" */
+    spacing?: Space;
+    /** Background treatment of the band. @default "none" */
+    background?: SectionBackground;
+    /** Alignment of the heading above the quotes. @default "center" */
+    align?: "start" | "center";
+    /** Maximum content width of the band. @default "lg" */
+    containerSize?: ContainerSize;
+    /** Whether the band wraps its content in a `Container`. @default true */
+    contained?: boolean;
+}
+/**
+ * Default config values registered for the Testimonials component.
+ */
+export declare const defaultTestimonialsConfig: TestimonialsConfig;
+declare module "../../libs/registry" {
+    interface ComponentTypeConfigRegistry {
+        testimonials: TestimonialsConfig;
+    }
+}
+/**
+ * Hard fallback values used when no config tier provides a value.
+ */
+export declare const FALLBACK_TESTIMONIALS_CONFIG: Required<TestimonialsConfig>;
+//# sourceMappingURL=testimonials-config.d.ts.map

package/dist/components/testimonials/testimonials-config.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"testimonials-config.d.ts","sourceRoot":"","sources":["../../../src/components/testimonials/testimonials-config.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAGH,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AACnE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AACvD,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAEnE;;;;;GAKG;AACH,MAAM,WAAW,kBAAkB;IACjC,6DAA6D;IAC7D,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB,2DAA2D;IAC3D,SAAS,CAAC,EAAE,WAAW,CAAC;IAExB,2DAA2D;IAC3D,SAAS,CAAC,EAAE,WAAW,CAAC;IAExB,8CAA8C;IAC9C,GAAG,CAAC,EAAE,KAAK,CAAC;IAEZ,kDAAkD;IAClD,OAAO,CAAC,EAAE,KAAK,CAAC;IAEhB,wDAAwD;IACxD,UAAU,CAAC,EAAE,iBAAiB,CAAC;IAE/B,mEAAmE;IACnE,KAAK,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;IAE3B,uDAAuD;IACvD,aAAa,CAAC,EAAE,aAAa,CAAC;IAE9B,yEAAyE;IACzE,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED;;GAEG;AACH,eAAO,MAAM,yBAAyB,EAAE,kBAUvC,CAAC;AAEF,OAAO,QAAQ,qBAAqB,CAAC;IACnC,UAAU,2BAA2B;QACnC,YAAY,EAAE,kBAAkB,CAAC;KAClC;CACF;AAID;;GAEG;AACH,eAAO,MAAM,4BAA4B,EAAE,QAAQ,CAAC,kBAAkB,CAUrE,CAAC"}

package/dist/components/testimonials/testimonials-config.js

@@ -0,0 +1,28 @@
+"use client";
+import { registerComponentDefaults as e } from "../../libs/registry.js";
+//#region src/components/testimonials/testimonials-config.ts
+var t = {
+	columns: 1,
+	columnsMd: 2,
+	columnsLg: 3,
+	gap: "lg",
+	spacing: "lg",
+	background: "none",
+	align: "center",
+	containerSize: "lg",
+	contained: !0
+};
+e("testimonials", t);
+var n = {
+	columns: 1,
+	columnsMd: 2,
+	columnsLg: 3,
+	gap: "lg",
+	spacing: "lg",
+	background: "none",
+	align: "center",
+	containerSize: "lg",
+	contained: !0
+};
+//#endregion
+export { n as FALLBACK_TESTIMONIALS_CONFIG, t as defaultTestimonialsConfig };

package/dist/components/testimonials/testimonials-styles.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Testimonials component styles for AsheeUI.
+ * This file provides the static class mappings for the Testimonials pattern.
+ */
+/** The quote itself. */
+export declare const TESTIMONIAL_QUOTE_CLASS = "flex flex-col gap-4";
+/** The person credited with a quote. */
+export declare const TESTIMONIAL_PERSON_CLASS = "flex items-center gap-3";
+/** The heading block above the quotes. */
+export declare const TESTIMONIAL_HEADING_CLASS = "mb-10";
+//# sourceMappingURL=testimonials-styles.d.ts.map

package/dist/components/testimonials/testimonials-styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"testimonials-styles.d.ts","sourceRoot":"","sources":["../../../src/components/testimonials/testimonials-styles.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,wBAAwB;AACxB,eAAO,MAAM,uBAAuB,wBAAwB,CAAC;AAE7D,wCAAwC;AACxC,eAAO,MAAM,wBAAwB,4BAA4B,CAAC;AAElE,0CAA0C;AAC1C,eAAO,MAAM,yBAAyB,UAAU,CAAC"}

package/dist/components/testimonials/testimonials-styles.js

@@ -0,0 +1,5 @@
+"use client";
+//#region src/components/testimonials/testimonials-styles.ts
+var e = "flex flex-col gap-4", t = "flex items-center gap-3", n = "mb-10";
+//#endregion
+export { n as TESTIMONIAL_HEADING_CLASS, t as TESTIMONIAL_PERSON_CLASS, e as TESTIMONIAL_QUOTE_CLASS };

package/dist/components/textarea/Textarea.d.ts

@@ -1,11 +1,11 @@
 import { default as React, TextareaHTMLAttributes } from 'react';
 import { KeyboardOpenOptions } from '../keyboard';
 import { TextAreaConfig } from './textarea-config';
-type BaseTextAreaProps = TextAreaConfig & Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, "size" | "color" | "children">;
+type BaseTextareaProps = TextAreaConfig & Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, "size" | "color" | "children">;
 /**
- * Configuration options for the TextArea component.
+ * Configuration options for the Textarea component.
  */
-export interface TextAreaProps extends BaseTextAreaProps {
+export interface TextareaProps extends BaseTextareaProps {
     /**
      * Label text for the textarea.
      * Displayed above the input field.
@@ -50,7 +50,7 @@ export interface TextAreaProps extends BaseTextAreaProps {
  * A multi-line text input with label, description, validation message,
  * and virtual keyboard support.
  *
- * TextArea renders a textarea with consistent styling and field layout.
+ * Textarea renders a textarea with consistent styling and field layout.
  * It supports validation states, loading state, configurable rows, and
  * the standard AsheeUI cascade for visual tokens. The component integrates
  * with FieldShell for label, description, and message handling.
@@ -59,7 +59,7 @@ export interface TextAreaProps extends BaseTextAreaProps {
  * aria-invalid, aria-describedby, and proper focus management. It also
  * supports mobile virtual keyboard control via the enableVirtualKeyboard prop.
  *
- * @param props - TextArea configuration options and native textarea props.
+ * @param props - Textarea configuration options and native textarea props.
  * @param props.label - Label text for the textarea.
  * @param props.isLoading - Loading state. Defaults to false.
  * @param props.description - Description text.
@@ -80,14 +80,14 @@ export interface TextAreaProps extends BaseTextAreaProps {
  *
  * @example
  * ```tsx
- * import { TextArea } from "asheeui";
+ * import { Textarea } from "asheeui";
  * import { useState } from "react";
  *
  * export function Example() {
  *   const [value, setValue] = useState("");
  *
  *   return (
- *     <TextArea
+ *     <Textarea
  *       label="Message"
  *       description="Write your message here"
  *       placeholder="Type your message..."
@@ -102,7 +102,7 @@ export interface TextAreaProps extends BaseTextAreaProps {
  * @example
  * ```tsx
  * // With validation state
- * <TextArea
+ * <Textarea
  *   label="Feedback"
  *   status="error"
  *   message="Feedback must be at least 10 characters"
@@ -113,7 +113,7 @@ export interface TextAreaProps extends BaseTextAreaProps {
  * @example
  * ```tsx
  * // With virtual keyboard configuration
- * <TextArea
+ * <Textarea
  *   label="Numeric Input"
  *   enableVirtualKeyboard={{
  *     layout: "numeric",
@@ -128,6 +128,6 @@ export interface TextAreaProps extends BaseTextAreaProps {
  * @see useAsheeConfig - Hook for accessing the global configuration.
  * @see useKeyboardField - Hook for connecting inputs to the virtual keyboard.
  */
-export declare const TextArea: React.ForwardRefExoticComponent<TextAreaProps & React.RefAttributes<HTMLTextAreaElement>>;
+export declare const Textarea: React.ForwardRefExoticComponent<TextareaProps & React.RefAttributes<HTMLTextAreaElement>>;
 export {};
 //# sourceMappingURL=Textarea.d.ts.map

package/dist/components/textarea/Textarea.js

@@ -1,9 +1,9 @@
 "use client";
 "use client";
 import { cn as e } from "../../utils/cn.js";
-import { useAsheeConfig as t } from "../../libs/context.js";
-import { RADIUS_CLASS as n } from "../../shared/radius.js";
-import { resolveVariantClass as r } from "../../shared/variant.js";
+import { RADIUS_CLASS as t } from "../../shared/radius.js";
+import { resolveVariantClass as n } from "../../shared/variant.js";
+import { useAsheeConfig as r } from "../../libs/context.js";
 import { resolveCascade as i, resolveClassKey as a, resolveRadiusKey as o } from "../../utils/resolve-token.js";
 import { FieldShell as ee } from "../field/FieldShell.js";
 import { useKeyboardField as s } from "../keyboard/use-keyboard-field.js";
@@ -13,13 +13,13 @@ import { forwardRef as u, useCallback as d, useId as f, useImperativeHandle as p
 import { jsx as h } from "react/jsx-runtime";
 //#region src/components/textarea/Textarea.tsx
 var g = u(({ size: u, radius: g, variant: _, color: v, status: y, label: b, labelAlign: x, description: S, message: C, required: w, isLoading: T, rows: E, id: D, className: O, disabled: k, style: A, onFocus: j, onBlur: M, enableVirtualKeyboard: N = !0, ...P }, F) => {
-	let I = t(), L = I.components?.textarea, R = m(null);
+	let I = r(), L = I.components?.textarea, R = m(null);
 	p(F, () => R.current);
 	let z = f(), B = D ?? z, V = S ? `${B}-description` : void 0, H = C ? `${B}-message` : void 0, U = [V, H].filter(Boolean).join(" ") || void 0, { handleFocus: W, handleBlur: G } = s(B, R, !!N, typeof N == "object" && N ? N : void 0), K = d((e) => {
 		W(e), j?.(e);
 	}, [W, j]), q = d((e) => {
 		G(), M?.(e);
-	}, [G, M]), J = i(u, L?.size, void 0, c.size), Y = i(_, L?.variant, I.defaultVariant, c.variant), X = i(v, L?.color, I.defaultColor, c.color), Z = (e) => e === "full" ? "xl" : e, Q = o(Z(g), Z(L?.radius), I.defaultRadius, c.radius), $ = y ?? c.status, ne = i(x, L?.labelAlign, void 0, c.labelAlign), re = i(E, L?.rows, void 0, c.rows), ie = r(Y, X), ae = $ === "default" ? "" : l[$], oe = Y === "underlined" ? "rounded-none" : a(Q, n, c.radius);
+	}, [G, M]), J = i(u, L?.size, void 0, c.size), Y = i(_, L?.variant, I.defaultVariant, c.variant), X = i(v, L?.color, I.defaultColor, c.color), Z = (e) => e === "full" ? "xl" : e, Q = o(Z(g), Z(L?.radius), I.defaultRadius, c.radius), $ = y ?? c.status, ne = i(x, L?.labelAlign, void 0, c.labelAlign), re = i(E, L?.rows, void 0, c.rows), ie = n(Y, X), ae = $ === "default" ? "" : l[$], oe = Y === "underlined" ? "rounded-none" : a(Q, t, c.radius);
 	return /* @__PURE__ */ h(ee, {
 		id: B,
 		label: b,
@@ -48,6 +48,6 @@ var g = u(({ size: u, radius: g, variant: _, color: v, status: y, label: b, labe
 		})
 	});
 });
-g.displayName = "TextArea";
+g.displayName = "Textarea";
 //#endregion
-export { g as TextArea };
+export { g as Textarea };

package/dist/components/textarea/textarea-config.d.ts

@@ -1,6 +1,6 @@
 import { FieldConfig } from '../field/field-config';
 /**
- * Theme configuration options for the TextArea component.
+ * Theme configuration options for the Textarea component.
  *
  * Set under `components.textarea` in the AsheeUI config. Values feed the
  * component-level fallback tier of the theme cascade.
@@ -15,7 +15,7 @@ export interface TextAreaConfig extends FieldConfig {
     rows?: number;
 }
 /**
- * Default config values registered for the TextArea component.
+ * Default config values registered for the Textarea component.
  * Inherits field defaults and sets default rows to 4.
  */
 export declare const defaultTextAreaConfig: TextAreaConfig;

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

@@ -1 +1 @@
-{"version":3,"file":"ToastItem.d.ts","sourceRoot":"","sources":["../../../src/components/toast/ToastItem.tsx"],"names":[],"mappings":"AAgBA,OAAO,EACL,KAAK,KAAK,EAEV,KAAK,MAAM,EAEX,KAAK,IAAI,EACT,KAAK,OAAO,EACb,MAAM,cAAc,CAAC;AAGtB,OAAO,EAEL,KAAK,aAAa,EAClB,KAAK,cAAc,EAEpB,MAAM,gBAAgB,CAAC;AA0DxB;;;GAGG;AACH,MAAM,WAAW,cAAe,SAAQ,aAAa;IACnD;;OAEG;IACH,SAAS,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAEhC;;;OAGG;IACH,SAAS,EAAE,cAAc,CAAC;IAE1B;;OAEG;IACH,IAAI,EAAE,IAAI,CAAC;IAEX;;OAEG;IACH,OAAO,EAAE,OAAO,CAAC;IAEjB;;;OAGG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC;IAEd;;OAEG;IACH,MAAM,EAAE,MAAM,CAAC;IAEf;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,wBAAgB,SAAS,CAAC,EACxB,EAAE,EACF,KAAK,EACL,OAAO,EACP,IAAa,EACb,OAAc,EACd,IAAI,EACJ,MAAM,EACN,WAAkB,EAClB,SAAS,EACT,SAAS,EACT,IAAI,EACJ,OAAO,EACP,KAAK,EACL,MAAM,EACN,QAAQ,GACT,EAAE,cAAc,+BAyHhB;yBAzIe,SAAS"}
+{"version":3,"file":"ToastItem.d.ts","sourceRoot":"","sources":["../../../src/components/toast/ToastItem.tsx"],"names":[],"mappings":"AAgBA,OAAO,EACL,KAAK,KAAK,EAEV,KAAK,MAAM,EAEX,KAAK,IAAI,EACT,KAAK,OAAO,EACb,MAAM,cAAc,CAAC;AAGtB,OAAO,EAEL,KAAK,aAAa,EAClB,KAAK,cAAc,EAEpB,MAAM,gBAAgB,CAAC;AA0DxB;;;GAGG;AACH,MAAM,WAAW,cAAe,SAAQ,aAAa;IACnD;;OAEG;IACH,SAAS,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAEhC;;;OAGG;IACH,SAAS,EAAE,cAAc,CAAC;IAE1B;;OAEG;IACH,IAAI,EAAE,IAAI,CAAC;IAEX;;OAEG;IACH,OAAO,EAAE,OAAO,CAAC;IAEjB;;;OAGG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC;IAEd;;OAEG;IACH,MAAM,EAAE,MAAM,CAAC;IAEf;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,wBAAgB,SAAS,CAAC,EACxB,EAAE,EACF,KAAK,EACL,OAAO,EACP,IAAa,EACb,OAAc,EACd,IAAI,EACJ,MAAM,EACN,WAAkB,EAClB,SAAS,EACT,SAAS,EACT,IAAI,EACJ,OAAO,EACP,KAAK,EACL,MAAM,EACN,QAAQ,GACT,EAAE,cAAc,+BA0HhB;yBA1Ie,SAAS"}

package/dist/components/toast/ToastItem.js

@@ -1,9 +1,9 @@
 "use client";
 "use client";
 import { cn as e } from "../../utils/cn.js";
-import { useAsheeConfig as t } from "../../libs/context.js";
-import { RADIUS_CLASS as n } from "../../shared/radius.js";
-import { resolveVariantClass as r } from "../../shared/variant.js";
+import { RADIUS_CLASS as t } from "../../shared/radius.js";
+import { resolveVariantClass as n } from "../../shared/variant.js";
+import { useAsheeConfig as r } from "../../libs/context.js";
 import { resolveCascade as i, resolveClassKey as a } from "../../utils/resolve-token.js";
 import { CheckIcon as o } from "../../icons/CheckIcon.js";
 import { CloseIcon as s } from "../../icons/CloseIcon.js";
@@ -35,7 +35,7 @@ function C(t = "info", n = !1) {
 	}
 }
 function w({ id: o, title: c, message: l, type: u = "info", timeout: w = 3500, icon: T, action: E, dismissible: D = !0, onDismiss: O, placement: k, size: A, variant: j, color: M, radius: N, animated: P }) {
-	let F = t().components?.toast, [I, L] = y(!1), R = i(P, F?.animated, void 0, d.animated), z = v(() => {
+	let F = r().components?.toast, [I, L] = y(!1), R = i(P, F?.animated, void 0, d.animated), z = v(() => {
 		R && !I ? (L(!0), setTimeout(() => {
 			O(o);
 		}, 150)) : O(o);
@@ -44,11 +44,12 @@ function w({ id: o, title: c, message: l, type: u = "info", timeout: w = 3500, i
 		I,
 		O,
 		o
-	]), { pause: B, resume: V } = _(z, w), H = M ?? S(u), U = j === "solid", W = a(A, g, d.size), G = a(A, m, d.size), K = a(A, p, d.size), q = a(A, h, d.size), J = a(N, n, d.radius), Y = f[k], X = P ? I ? Y.exit : Y.enter : "";
+	]), { pause: B, resume: V } = _(z, w), H = M ?? S(u), U = j === "solid", W = a(A, g, d.size), G = a(A, m, d.size), K = a(A, p, d.size), q = a(A, h, d.size), J = a(N, t, d.radius), Y = f[k], X = P ? I ? Y.exit : Y.enter : "";
 	return /* @__PURE__ */ x("div", {
+		role: "status",
 		onMouseEnter: B,
 		onMouseLeave: V,
-		className: e("pointer-events-auto relative flex gap-3 items-start shadow-lg border backdrop-blur-md select-none scrollbar-hide overflow-hidden transition-all duration-200 active:scale-[0.99]", "bg-background", W, G, J, X, r(j, H)),
+		className: e("pointer-events-auto relative flex gap-3 items-start shadow-lg border backdrop-blur-md select-none scrollbar-hide overflow-hidden transition-all duration-200 active:scale-[0.99]", "bg-background", W, G, J, X, n(j, H)),
 		children: [
 			/* @__PURE__ */ b("div", {
 				className: "shrink-0 pt-0.5 ps-1",
@@ -75,7 +76,7 @@ function w({ id: o, title: c, message: l, type: u = "info", timeout: w = 3500, i
 				type: "button",
 				onClick: () => O(o),
 				"aria-label": "Dismiss notification",
-				className: "shrink-0 p-1 rounded-md opacity-70 hover:opacity-100 hover:bg-black/10 dark:hover:bg-white/10 transition-all cursor-pointer outline-none focus-visible:ring-2 focus-visible:ring-current",
+				className: "shrink-0 p-1 rounded-md opacity-70 hover:opacity-100 hover:bg-foreground/10 transition-all cursor-pointer outline-none focus-visible:ring-2 focus-visible:ring-current",
 				children: /* @__PURE__ */ b(s, { className: "w-4 h-4" })
 			})
 		]

package/dist/components/tooltip/Tooltip.js

@@ -1,9 +1,9 @@
 "use client";
 "use client";
 import { cn as e } from "../../utils/cn.js";
-import { useAsheeConfig as t } from "../../libs/context.js";
-import { RADIUS_CLASS as ee } from "../../shared/radius.js";
-import { resolveVariantClass as n } from "../../shared/variant.js";
+import { RADIUS_CLASS as t } from "../../shared/radius.js";
+import { resolveVariantClass as ee } from "../../shared/variant.js";
+import { useAsheeConfig as n } from "../../libs/context.js";
 import { resolveCascade as r, resolveClassKey as i, resolveRadiusKey as te } from "../../utils/resolve-token.js";
 import { useFloatingZIndex as ne } from "../../libs/use-floating-z-index.js";
 import { FALLBACK_TOOLTIP_CONFIG as a } from "./tooltip-config.js";
@@ -13,7 +13,7 @@ import { Fragment as p, jsx as m, jsxs as h } from "react/jsx-runtime";
 import { FloatingArrow as ie, FloatingPortal as ae, arrow as oe, autoUpdate as se, flip as ce, offset as le, shift as g, useDismiss as _, useFloating as v, useFocus as y, useHover as b, useInteractions as x, useRole as S } from "@floating-ui/react";
 //#region src/components/tooltip/Tooltip.tsx
 var C = u(({ content: u, children: C, variant: w, color: T, size: E, placement: D, delay: O, offset: k, radius: A, showArrow: j, portal: M, zIndex: N, isDisabled: P = !1, className: F }, I) => {
-	let L = t(), R = L.components?.tooltip, z = d(null), [B, V] = f(!1), H = r(E, R?.size, void 0, a.size), U = r(D, R?.placement, void 0, a.placement), W = r(w, R?.variant, L.defaultVariant, a.variant), ue = r(T, R?.color, L.defaultColor, a.color), de = r(O, R?.delay, void 0, a.delay), fe = r(k, R?.offset, void 0, a.offset), G = r(j, R?.showArrow, void 0, a.showArrow), K = r(M, R?.portal, void 0, a.portal), pe = r(N, R?.zIndex, void 0, a.zIndex), me = te(A, R?.radius, L.defaultRadius, a.radius), he = i(H, s, a.size), ge = i(H, c, a.size), _e = i(H, o, a.size), ve = i(me, ee, a.radius), q = [
+	let L = n(), R = L.components?.tooltip, z = d(null), [B, V] = f(!1), H = r(E, R?.size, void 0, a.size), U = r(D, R?.placement, void 0, a.placement), W = r(w, R?.variant, L.defaultVariant, a.variant), ue = r(T, R?.color, L.defaultColor, a.color), de = r(O, R?.delay, void 0, a.delay), fe = r(k, R?.offset, void 0, a.offset), G = r(j, R?.showArrow, void 0, a.showArrow), K = r(M, R?.portal, void 0, a.portal), pe = r(N, R?.zIndex, void 0, a.zIndex), me = te(A, R?.radius, L.defaultRadius, a.radius), he = i(H, s, a.size), ge = i(H, c, a.size), _e = i(H, o, a.size), ve = i(me, t, a.radius), q = [
 		le(fe),
 		ce({ padding: 8 }),
 		g({ padding: 8 })
@@ -54,7 +54,7 @@ var C = u(({ content: u, children: C, variant: w, color: T, size: E, placement:
 		className: "pointer-events-none",
 		...Se(),
 		children: /* @__PURE__ */ h("div", {
-			className: e("font-medium border whitespace-nowrap select-none bg-background shadow-md transition-all duration-150 ease-out animate-in fade-in-0 zoom-in-95", he, ge, _e, ve, n(W, ue), R?.className, F),
+			className: e("font-medium border whitespace-nowrap select-none bg-background shadow-md transition-all duration-150 ease-out animate-in fade-in-0 zoom-in-95", he, ge, _e, ve, ee(W, ue), R?.className, F),
 			children: [u, G && /* @__PURE__ */ m(ie, {
 				ref: z,
 				context: X,

package/dist/components/typography/Typography.d.ts

@@ -0,0 +1,60 @@
+import { ElementType, HTMLAttributes, ReactNode } from 'react';
+import { TypographyLeading, TypographySize, TypographyTracking, TypographyWeight } from '../../shared';
+import { TypographyConfig } from './typography-config';
+/**
+ * Typography props. Combines the component configuration with the shared
+ * typography options and standard element attributes.
+ *
+ * The ARIA `role` attribute is intentionally not part of the inherited
+ * attributes: `role` here is the typography role, and letting both exist would
+ * make the prop ambiguous. Consumers who need an explicit ARIA role can wrap the
+ * component or render a semantic element through `as`.
+ */
+export interface TypographyProps extends TypographyConfig, Omit<HTMLAttributes<HTMLElement>, "color" | "role"> {
+    /**
+     * Element to render.
+     * Defaults to the semantic element implied by the resolved role.
+     */
+    as?: ElementType;
+    /**
+     * Size token override. Replaces the size part of the role's treatment.
+     */
+    size?: TypographySize;
+    /**
+     * Font-weight token override.
+     */
+    weight?: TypographyWeight;
+    /**
+     * Line-height token override.
+     */
+    leading?: TypographyLeading;
+    /**
+     * Letter-spacing token override.
+     */
+    tracking?: TypographyTracking;
+    /**
+     * Content to render.
+     */
+    children?: ReactNode;
+}
+/**
+ * Semantic text rendering.
+ *
+ * Resolution order follows the standard AsheeUI cascade: instance prop, then
+ * `components.typography` configuration, then the framework fallback. A role
+ * supplies size, weight, leading and tracking together; any explicit token prop
+ * replaces just that part of the treatment.
+ *
+ * @param props - Typography options and element attributes.
+ * @returns The rendered semantic element.
+ *
+ * @example
+ * ```tsx
+ * <Typography role="heading-lg">Dashboard</Typography>
+ * <Typography role="body-md" tone="muted" as="h2">A muted paragraph rendered as a heading</Typography>
+ * ```
+ *
+ * @see TYPOGRAPHY_ROLE_TOKEN - The documented role table.
+ */
+export declare const Typography: import('react').ForwardRefExoticComponent<TypographyProps & import('react').RefAttributes<HTMLElement>>;
+//# sourceMappingURL=Typography.d.ts.map

package/dist/components/typography/Typography.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Typography.d.ts","sourceRoot":"","sources":["../../../src/components/typography/Typography.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;GAcG;AAIH,OAAO,EACL,KAAK,WAAW,EAEhB,KAAK,cAAc,EACnB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAEf,OAAO,EAKL,KAAK,iBAAiB,EAEtB,KAAK,cAAc,EAEnB,KAAK,kBAAkB,EACvB,KAAK,gBAAgB,EACtB,MAAM,cAAc,CAAC;AAGtB,OAAO,EAEL,KAAK,gBAAgB,EACtB,MAAM,qBAAqB,CAAC;AAG7B;;;;;;;;GAQG;AACH,MAAM,WAAW,eACf,SAAQ,gBAAgB,EACtB,IAAI,CAAC,cAAc,CAAC,WAAW,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IACrD;;;OAGG;IACH,EAAE,CAAC,EAAE,WAAW,CAAC;IAEjB;;OAEG;IACH,IAAI,CAAC,EAAE,cAAc,CAAC;IAEtB;;OAEG;IACH,MAAM,CAAC,EAAE,gBAAgB,CAAC;IAE1B;;OAEG;IACH,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAE5B;;OAEG;IACH,QAAQ,CAAC,EAAE,kBAAkB,CAAC;IAE9B;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;;;;;;;;;;;;;;;;;GAkBG;AACH,eAAO,MAAM,UAAU,yGAuFtB,CAAC"}

package/dist/components/typography/Typography.js

@@ -0,0 +1,28 @@
+"use client";
+"use client";
+import { cn as e } from "../../utils/cn.js";
+import { TYPOGRAPHY_ALIGN_CLASS as t, TYPOGRAPHY_ROLE_DEFAULT_ELEMENT as n, TYPOGRAPHY_TONE_CLASS as r } from "../../shared/typography.js";
+import { useAsheeConfig as i } from "../../libs/context.js";
+import { resolveCascade as a } from "../../utils/resolve-token.js";
+import { FALLBACK_TYPOGRAPHY_CONFIG as o } from "./typography-config.js";
+import { resolveTypographyRoleClass as s } from "./typography-styles.js";
+import { forwardRef as c } from "react";
+import { jsx as l } from "react/jsx-runtime";
+//#region src/components/typography/Typography.tsx
+var u = c(({ as: c, role: u, tone: d, align: f, truncate: p, size: m, weight: h, leading: g, tracking: _, className: v, children: y, ...b }, x) => {
+	let S = i().components?.typography, C = a(u, S?.role, void 0, o.role), w = a(d, S?.tone, void 0, o.tone), T = a(f, S?.align, void 0, void 0), E = a(p, S?.truncate, void 0, o.truncate), D = S?.roles?.[C], O = {
+		size: m ?? D?.size,
+		weight: h ?? D?.weight,
+		leading: g ?? D?.leading,
+		tracking: _ ?? D?.tracking
+	}, k = O.size !== void 0 || O.weight !== void 0 || O.leading !== void 0 || O.tracking !== void 0 ? s(C, O) : s(C), A = e(k, T ? t[T] : void 0, E && "truncate", r[w], S?.className, v), j = c ?? n[C];
+	return /* @__PURE__ */ l(j, {
+		ref: x,
+		className: A,
+		...b,
+		children: y
+	});
+});
+u.displayName = "Typography";
+//#endregion
+export { u as Typography };

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

@@ -0,0 +1,3 @@
+export * from './Typography';
+export * from './typography-config';
+//# sourceMappingURL=index.d.ts.map

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

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

package/dist/components/typography/index.js

@@ -0,0 +1,3 @@
+export * from "./Typography.js";
+export * from "./typography-config.js";
+export * from "./typography-styles.js";

package/dist/components/typography/typography-config.d.ts

@@ -0,0 +1,54 @@
+import { TypographyAlign, TypographyRole, TypographyRoleTokens, TypographyTone } from '../../shared';
+/**
+ * Configuration options for the Typography component.
+ *
+ * Set under `components.typography` in the AsheeUI configuration.
+ */
+export interface TypographyConfig {
+    /**
+     * Default semantic role.
+     * @default "body-md"
+     */
+    role?: TypographyRole;
+    /**
+     * Default colour treatment.
+     * @default "default"
+     */
+    tone?: TypographyTone;
+    /**
+     * Default text alignment. Unset means the alignment is inherited.
+     */
+    align?: TypographyAlign;
+    /**
+     * Whether text is truncated to a single line by default.
+     * @default false
+     */
+    truncate?: boolean;
+    /**
+     * Per-application role overrides.
+     *
+     * Each entry retunes the size/style tokens a role resolves to, so a role can
+     * keep its semantic meaning while the underlying typography changes. Values
+     * still come from the static class maps, so no class is built dynamically.
+     */
+    roles?: Partial<Record<TypographyRole, Partial<TypographyRoleTokens>>>;
+    /**
+     * Extra classes applied to every instance, before the instance `className`.
+     */
+    className?: string;
+}
+/**
+ * Default configuration registered for the Typography component.
+ * Intentionally empty: roles and tones have framework fallbacks.
+ */
+export declare const defaultTypographyConfig: TypographyConfig;
+declare module "../../libs/registry" {
+    interface ComponentTypeConfigRegistry {
+        typography: TypographyConfig;
+    }
+}
+/**
+ * Hard fallback values used when no cascade tier provides a value.
+ */
+export declare const FALLBACK_TYPOGRAPHY_CONFIG: Required<Pick<TypographyConfig, "role" | "tone" | "truncate">>;
+//# sourceMappingURL=typography-config.d.ts.map

package/dist/components/typography/typography-config.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"typography-config.d.ts","sourceRoot":"","sources":["../../../src/components/typography/typography-config.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAGH,OAAO,KAAK,EACV,eAAe,EACf,cAAc,EACd,oBAAoB,EACpB,cAAc,EACf,MAAM,cAAc,CAAC;AAEtB;;;;GAIG;AACH,MAAM,WAAW,gBAAgB;IAC/B;;;OAGG;IACH,IAAI,CAAC,EAAE,cAAc,CAAC;IAEtB;;;OAGG;IACH,IAAI,CAAC,EAAE,cAAc,CAAC;IAEtB;;OAEG;IACH,KAAK,CAAC,EAAE,eAAe,CAAC;IAExB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;;;;OAMG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC,MAAM,CAAC,cAAc,EAAE,OAAO,CAAC,oBAAoB,CAAC,CAAC,CAAC,CAAC;IAEvE;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;GAGG;AACH,eAAO,MAAM,uBAAuB,EAAE,gBAAqB,CAAC;AAE5D,OAAO,QAAQ,qBAAqB,CAAC;IACnC,UAAU,2BAA2B;QACnC,UAAU,EAAE,gBAAgB,CAAC;KAC9B;CACF;AAID;;GAEG;AACH,eAAO,MAAM,0BAA0B,EAAE,QAAQ,CAC/C,IAAI,CAAC,gBAAgB,EAAE,MAAM,GAAG,MAAM,GAAG,UAAU,CAAC,CAKrD,CAAC"}

package/dist/components/typography/typography-config.js

@@ -0,0 +1,12 @@
+"use client";
+import { registerComponentDefaults as e } from "../../libs/registry.js";
+//#region src/components/typography/typography-config.ts
+var t = {};
+e("typography", t);
+var n = {
+	role: "body-md",
+	tone: "default",
+	truncate: !1
+};
+//#endregion
+export { n as FALLBACK_TYPOGRAPHY_CONFIG, t as defaultTypographyConfig };

package/dist/components/typography/typography-styles.d.ts

@@ -0,0 +1,21 @@
+import { TypographyRole, TypographyRoleTokens } from '../../shared';
+/**
+ * Compose a role's class string from its size/style tokens.
+ *
+ * @param tokens - Complete size/style tokens.
+ * @returns A space-separated class string of static utilities.
+ */
+export declare function composeTypographyRoleClass(tokens: TypographyRoleTokens): string;
+/**
+ * Resolve the class string for a semantic role.
+ *
+ * With no overrides the role's literal class string is returned directly. When
+ * a role has been retuned, the tokens are resolved (overrides on top of the
+ * role table) and composed from the static maps.
+ *
+ * @param role - Semantic role.
+ * @param overrides - Partial token overrides for the role.
+ * @returns A space-separated class string of static utilities.
+ */
+export declare function resolveTypographyRoleClass(role: TypographyRole, overrides?: Partial<TypographyRoleTokens>): string;
+//# sourceMappingURL=typography-styles.d.ts.map

package/dist/components/typography/typography-styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"typography-styles.d.ts","sourceRoot":"","sources":["../../../src/components/typography/typography-styles.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EAOL,KAAK,cAAc,EACnB,KAAK,oBAAoB,EAC1B,MAAM,cAAc,CAAC;AAGtB;;;;;GAKG;AACH,wBAAgB,0BAA0B,CACxC,MAAM,EAAE,oBAAoB,GAC3B,MAAM,CAOR;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,0BAA0B,CACxC,IAAI,EAAE,cAAc,EACpB,SAAS,CAAC,EAAE,OAAO,CAAC,oBAAoB,CAAC,GACxC,MAAM,CAcR"}