@quidgest/ui 0.27.1 → 0.28.0

package/esm/composables/useColor/index.d.ts

@@ -19,16 +19,19 @@ export declare function resolveOnMainColor(rawColor: string, isUtilityColor: boo
 /**
  * Resolves hover colors for `useColor`.
  *
- * Theme utility keys with a matching `*Dark` scheme token use that token (and `on*Dark`
- * when present). Custom CSS colors, utilities without `*Dark` (e.g. `background`), and
- * unparsable `*Dark` overrides fall back to `darken(main, COLOR_SCHEME_DARKEN_AMOUNT)` with WCAG `onHover`.
+ * Every color gets the same hover, derived from the color itself: theme colors such as
+ * `primary`, other scheme keys, and custom CSS colors. The hover moves away from the
+ * scheme background, darker on a light theme and lighter on a dark one (the other way
+ * when that changes the color by less than 1.3:1 and the other direction changes it
+ * more), with WCAG `onHover`. The scheme's `*Dark` tokens are not read: a theme that sets
+ * only its base colors keeps the default `*Dark` values, which would not match them.
  *
- * @param rawColor - The original color input (utility key or CSS color).
- * @param isUtilityColor - Whether `rawColor` is a BEM theme utility key.
- * @param scheme - The active color scheme.
+ * @param scheme - The active color scheme. Its background sets the direction.
  * @param mainRgb - Parsed RGB of the resolved main color.
+ * @param surfaceRgb - Parsed RGB of the surface the component sits on, which sets the
+ * direction instead of the scheme background.
  */
-export declare function resolveHoverStyle(rawColor: string, isUtilityColor: boolean, scheme: Readonly<QColorScheme>, mainRgb: RGB): HoverStyle;
+export declare function resolveHoverStyle(scheme: Readonly<QColorScheme>, mainRgb: RGB, surfaceRgb?: RGB): HoverStyle;
 /**
  * A composable function that processes and returns color-related information and styles.
  *
@@ -39,41 +42,48 @@ export declare function resolveHoverStyle(rawColor: string, isUtilityColor: bool
  *
  * `style.onMainColor` uses the theme's own `on*` token for theme utility keys when
  * present (e.g. `onPrimary`), falling back to WCAG relative luminance otherwise.
- * For theme utility keys that have a scheme `*Dark` token, `hoverColor` / `onHoverColor`
- * come from `*Dark` / `on*Dark`. Custom CSS colors, utilities without `*Dark` (such as
- * `background`), and unparsable `*Dark` overrides use `darken(main, COLOR_SCHEME_DARKEN_AMOUNT)` with WCAG
- * `onHover`. Components bind those values as
- * CSS variables for both utility and custom colors. `isUtilityColor` still marks
- * theme keys for hover resolution (`*Dark` / `on*Dark`). Exception: `QButton` with
- * `color="background"` omits inline vars so its SCSS `--background` modifier
- * (primary-dark hover) wins.
+ * Every color gets its hover the same way, theme colors included: `hoverColor` moves away
+ * from the theme background by `COLOR_SCHEME_DARKEN_AMOUNT`, darker on a light theme and
+ * lighter on a dark one (the other way when that changes the color by less than 1.3:1
+ * and the other direction changes it more), and `onHoverColor` is the WCAG contrasting
+ * color for it. The scheme's `*Dark` / `on*Dark` tokens are not used for hover.
+ * Components bind those values as CSS variables for both utility and custom colors.
+ *
+ * Everything measured against a background (the hover direction, `textColor`,
+ * `hoverTextColor` and the tint) uses the theme background, or `surface` when the
+ * component sits on another color, such as a white button on a primary banner.
  *
  * @param color - A theme utility key or CSS color value. Can be provided as a ref or plain string.
+ * @param surface - The theme key or CSS color the component sits on. Defaults to the theme
+ * background. Can be provided as a ref or plain string.
  *
  * @returns {QUseColorReturn} An object containing:
  * - isUtilityColor: A computed boolean indicating if the color is a theme utility key
  * - style: A computed object containing:
  *   - mainColor: The resolved color value
  *   - onMainColor: Scheme `on*` for utilities when present, otherwise WCAG contrast
- *   - hoverColor: Scheme `*Dark` for utilities, otherwise a darkened main color
- *   - onHoverColor: Scheme `on*Dark` for utilities when present, otherwise WCAG on hover
- *   - textColor: `mainColor` darkened or lightened until it clears 4.5:1 on a 12% tint of itself over the theme background. Assumes the component sits on that background
- *   - hoverTextColor: `hoverColor` adjusted the same way against a 6% tint of the hover color over the theme background, for ghost and text hover
+ *   - hoverColor: The main color darkened on a light surface or lightened on a dark one, the other way when that barely shows
+ *   - onHoverColor: WCAG contrasting color for the hover color
+ *   - textColor: `mainColor` darkened or lightened until it clears 4.5:1 on a 12% tint of itself over the surface
+ *   - hoverTextColor: `hoverColor` adjusted the same way against a 6% tint of the hover color over the surface, for ghost and text hover
+ *   - tintColor / tintColorRgb: A pale version of the color for selection and highlight surfaces, like the scheme's `*Light` tokens
  *
  * @example
  * ```ts
  * const { isUtilityColor, style } = useColor('primary')
  * // or
  * const { isUtilityColor, style } = useColor(ref('#FF0000'))
+ * // or, for a button on a primary banner
+ * const { isUtilityColor, style } = useColor('background', 'primary')
  * ```
  */
-export declare function useColor(color: MaybeRef<string | undefined>): QUseColorReturn;
+export declare function useColor(color: MaybeRef<string | undefined>, surface?: MaybeRef<string | undefined>): QUseColorReturn;
 /**
  * Resolves a color scheme key against a color scheme while preserving CSS and custom colors.
  *
  * Looks up any key present on the scheme (base, Light/Dark variants, and `on*` tokens).
  * {@link isThemeColor} remains narrower and is only used for theme-key classification
- * (`isUtilityColor` / hover `*Dark` resolution).
+ * (`isUtilityColor`).
  *
  * This pure variant is useful when a component needs to resolve a dynamic collection of
  * colors and therefore cannot create one `useColor` instance per collection entry.

package/esm/composables/useColor/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/composables/useColor/index.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,KAAK,CAAA;AACnC,OAAO,KAAK,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,SAAS,CAAA;AAC3D,OAAO,KAAK,EAAE,YAAY,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAA;AAwB1D,KAAK,UAAU,GAAG,IAAI,CAAC,WAAW,EAAE,YAAY,GAAG,eAAe,GAAG,cAAc,CAAC,CAAA;AAuCpF;;;;;;;;;;;;GAYG;AACH,wBAAgB,kBAAkB,CACjC,QAAQ,EAAE,MAAM,EAChB,cAAc,EAAE,OAAO,EACvB,MAAM,EAAE,QAAQ,CAAC,YAAY,CAAC,EAC9B,OAAO,EAAE,GAAG,GACV,MAAM,CAUR;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,iBAAiB,CAChC,QAAQ,EAAE,MAAM,EAChB,cAAc,EAAE,OAAO,EACvB,MAAM,EAAE,QAAQ,CAAC,YAAY,CAAC,EAC9B,OAAO,EAAE,GAAG,GACV,UAAU,CA4BZ;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqCG;AACH,wBAAgB,QAAQ,CAAC,KAAK,EAAE,QAAQ,CAAC,MAAM,GAAG,SAAS,CAAC,GAAG,eAAe,CAyD7E;AAED;;;;;;;;;;;;;GAaG;AACH,wBAAgB,YAAY,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,CAAC,YAAY,CAAC,GAAG,MAAM,CAQlF"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/composables/useColor/index.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,KAAK,CAAA;AACnC,OAAO,KAAK,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,SAAS,CAAA;AAC3D,OAAO,KAAK,EAAE,YAAY,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAA;AA4B1D,KAAK,UAAU,GAAG,IAAI,CAAC,WAAW,EAAE,YAAY,GAAG,eAAe,GAAG,cAAc,CAAC,CAAA;AA0GpF;;;;;;;;;;;;GAYG;AACH,wBAAgB,kBAAkB,CACjC,QAAQ,EAAE,MAAM,EAChB,cAAc,EAAE,OAAO,EACvB,MAAM,EAAE,QAAQ,CAAC,YAAY,CAAC,EAC9B,OAAO,EAAE,GAAG,GACV,MAAM,CAUR;AAED;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,iBAAiB,CAChC,MAAM,EAAE,QAAQ,CAAC,YAAY,CAAC,EAC9B,OAAO,EAAE,GAAG,EACZ,UAAU,GAAE,GAAmC,GAC7C,UAAU,CAEZ;AA2BD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4CG;AACH,wBAAgB,QAAQ,CACvB,KAAK,EAAE,QAAQ,CAAC,MAAM,GAAG,SAAS,CAAC,EACnC,OAAO,CAAC,EAAE,QAAQ,CAAC,MAAM,GAAG,SAAS,CAAC,GACpC,eAAe,CAmDjB;AAED;;;;;;;;;;;;;GAaG;AACH,wBAAgB,YAAY,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,CAAC,YAAY,CAAC,GAAG,MAAM,CAQlF"}

package/esm/composables/useColor/index.js

@@ -1,86 +1,95 @@
 import { rgbToHex as e, rgbToVariableString as t } from "../../utils/color/conversion.js";
-import { darken as n } from "../../utils/color/manipulate.js";
-import { parseColor as r } from "../../utils/color/parse.js";
-import { ensureContrast as i, getContrastingColor as a } from "../../utils/color/contrast.js";
-import { isThemeColor as o, isUnsupportedColor as s } from "../../utils/color/theme-colors.js";
-import { useTheme as c } from "../theme.js";
-import { computed as l, unref as u } from "vue";
+import { darken as n, lighten as r } from "../../utils/color/manipulate.js";
+import { parseColor as i } from "../../utils/color/parse.js";
+import { ensureContrast as a, getContrastRatio as o, getContrastingColor as s, getRelativeLuminance as c } from "../../utils/color/contrast.js";
+import { isThemeColor as l, isUnsupportedColor as u } from "../../utils/color/theme-colors.js";
+import { useTheme as d } from "../theme.js";
+import { computed as f, unref as p } from "vue";
 //#region src/composables/useColor/index.ts
-function d(e) {
+function m(e) {
 	typeof process < "u" && process.env.NODE_ENV === "production" || console.warn(`[Quidgest UI] useColor: unable to resolve color "${e}"`);
 }
-var f = .12, p = .06;
-function m(e, t, n) {
+var h = .12, g = .06, _ = .15;
+function v(e) {
+	return s(e) === "#000";
+}
+function y(e, t) {
+	return v(t) ? r(e, 75) : b(e, t, _);
+}
+function b(e, t, n) {
 	return {
 		r: Math.round(e.r * n + t.r * (1 - n)),
 		g: Math.round(e.g * n + t.g * (1 - n)),
 		b: Math.round(e.b * n + t.b * (1 - n))
 	};
 }
-function h(r) {
-	let i = n(r, 25);
+var x = 1.3;
+function S(e, t) {
+	return o(c(e), c(t));
+}
+function C(i, a) {
+	let o = n(i, 25), c = r(i, 25), [l, u] = v(a) ? [o, c] : [c, o], d = S(i, l), f = d >= x || d >= S(i, u) ? l : u;
 	return {
-		hoverColor: e(i),
-		hoverColorRgb: t(i),
-		onHoverColor: a(i)
+		hoverColor: e(f),
+		hoverColorRgb: t(f),
+		onHoverColor: s(f)
 	};
 }
-function g(e, t, n, r) {
+function w(e, t, n, r) {
 	if (t) {
 		let t = n[`on${e.charAt(0).toUpperCase()}${e.slice(1)}`];
 		if (typeof t == "string") return t;
 	}
-	return a(r);
+	return s(r);
 }
-function _(e, n, i, o) {
-	if (n) {
-		let n = e, o = i[`${n}Dark`];
-		if (typeof o == "string") try {
-			let e = r(o), s = i[`on${n.charAt(0).toUpperCase()}${n.slice(1)}Dark`];
-			return {
-				hoverColor: o,
-				hoverColorRgb: t(e),
-				onHoverColor: typeof s == "string" ? s : a(e)
-			};
-		} catch {
-			d(o);
-		}
+function T(e, t, n = i(e.background)) {
+	return C(t, n);
+}
+function E(e, t) {
+	let n = i(t.background);
+	if (!e) return n;
+	if (u(e)) return m(e), n;
+	try {
+		return i(O(e, t));
+	} catch {
+		return m(e), n;
 	}
-	return h(o);
 }
-function v(n) {
-	let a = l(() => u(n)), h = c(), v = l(() => a.value ? o(a.value) : !1);
+function D(n, r) {
+	let o = f(() => p(n)), s = d(), c = f(() => o.value ? l(o.value) : !1);
 	return {
-		isUtilityColor: v,
-		style: l(() => {
-			let n = a.value;
+		isUtilityColor: c,
+		style: f(() => {
+			let n = o.value;
 			if (!n) return;
-			if (!v.value && s(n)) {
-				d(n);
+			if (!c.value && u(n)) {
+				m(n);
 				return;
 			}
-			let o = y(n, h.current.value.scheme), c;
+			let l = s.current.value.scheme, d = O(n, l), f;
 			try {
-				c = r(o);
+				f = i(d);
 			} catch {
-				d(n);
+				m(n);
 				return;
 			}
-			let l = g(n, v.value, h.current.value.scheme, c), u = _(n, v.value, h.current.value.scheme, c), b = r(h.current.value.scheme.background), x = i(o, e(m(c, b, f))), S = u.hoverColor ?? o, C = i(S, e(m(r(S), b, p)));
+			let _ = w(n, c.value, l, f), v = E(p(r), l), x = T(l, f, v), S = a(d, e(b(f, v, h))), C = x.hoverColor ?? d, D = a(C, e(b(i(C), v, g))), k = y(f, v);
 			return {
-				mainColor: o,
-				mainColorRgb: t(c),
-				onMainColor: l,
-				textColor: x,
-				hoverTextColor: C,
-				...u
+				mainColor: d,
+				mainColorRgb: t(f),
+				onMainColor: _,
+				textColor: S,
+				hoverTextColor: D,
+				tintColor: e(k),
+				tintColorRgb: t(k),
+				...x
 			};
 		})
 	};
 }
-function y(e, t) {
+function O(e, t) {
 	let n = e.trim();
 	return Object.prototype.hasOwnProperty.call(t, n) ? t[n] ?? e : e;
 }
 //#endregion
-export { y as resolveColor, _ as resolveHoverStyle, g as resolveOnMainColor, v as useColor };
+export { O as resolveColor, T as resolveHoverStyle, w as resolveOnMainColor, D as useColor };

package/esm/composables/useColor/types.d.ts

@@ -19,21 +19,34 @@ export interface QColorStyle {
     /**
      * Text color for tonal, outlined, ghost, and text treatments.
      * `mainColor` adjusted on the same hue until it clears 4.5:1 against a
-     * 12% tint of itself over the theme background. Unchanged when it already passes.
-     * Assumes the component sits on the theme background. A different surface,
-     * such as a light tonal toast in the dark theme, needs its own measurement.
+     * 12% tint of itself over the surface: the theme background, or the `surface`
+     * passed to `useColor`. Unchanged when it already passes.
      */
     textColor: string;
     /**
      * Text color for ghost and text treatments while hovered.
      * `hoverColor` adjusted until it clears 4.5:1 against a 6% tint of the
-     * hover color over the theme background (the ghost hover fill).
+     * hover color over the surface (the ghost hover fill).
      * Unchanged when it already passes.
      */
     hoverTextColor: string;
+    /**
+     * A pale version of the color for selection and highlight surfaces, like the scheme's
+     * `*Light` tokens. On a light surface it is the color lightened by
+     * `COLOR_SCHEME_LIGHTEN_AMOUNT`, the same as the default light theme's tokens; on a
+     * dark one, such as a dark theme's background, it is the color blended 15% over it.
+     */
+    tintColor: string;
+    /**
+     * The RGB representation of the tint color, to combine with an alpha channel.
+     */
+    tintColorRgb: string;
     /**
      * Optional color to be used when the component is in hover state.
-     * Scheme `*Dark` for theme utilities when present; otherwise `darken(main, COLOR_SCHEME_DARKEN_AMOUNT)`.
+     * The main color moved away from the surface by `COLOR_SCHEME_DARKEN_AMOUNT`,
+     * for theme and custom colors alike: darker on a light surface, lighter on a dark one,
+     * and the other way when that changes the color by less than 1.3:1 and the other
+     * direction changes it more. The scheme's `*Dark` tokens are not used.
      */
     hoverColor?: string;
     /**
@@ -42,7 +55,7 @@ export interface QColorStyle {
     hoverColorRgb?: string;
     /**
      * Optional color to be used for content when the component is in hover state.
-     * Scheme `on*Dark` for theme utilities when present; otherwise WCAG against the hover background.
+     * The WCAG contrasting color (black or white) for the hover color.
      */
     onHoverColor?: string;
 }

package/esm/composables/useColor/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/composables/useColor/types.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,KAAK,CAAA;AAEtC;;GAEG;AACH,MAAM,WAAW,WAAW;IAC3B;;OAEG;IACH,SAAS,EAAE,MAAM,CAAA;IAEjB;;OAEG;IACH,YAAY,EAAE,MAAM,CAAA;IAEpB;;;OAGG;IACH,WAAW,EAAE,MAAM,CAAA;IAEnB;;;;;;OAMG;IACH,SAAS,EAAE,MAAM,CAAA;IAEjB;;;;;OAKG;IACH,cAAc,EAAE,MAAM,CAAA;IAEtB;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAA;IAEnB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAA;IAEtB;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAA;CACrB;AAED;;GAEG;AACH,MAAM,WAAW,eAAe;IAC/B;;OAEG;IACH,cAAc,EAAE,WAAW,CAAC,OAAO,CAAC,CAAA;IAEpC;;OAEG;IACH,KAAK,EAAE,WAAW,CAAC,WAAW,GAAG,SAAS,CAAC,CAAA;CAC3C"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/composables/useColor/types.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,KAAK,CAAA;AAEtC;;GAEG;AACH,MAAM,WAAW,WAAW;IAC3B;;OAEG;IACH,SAAS,EAAE,MAAM,CAAA;IAEjB;;OAEG;IACH,YAAY,EAAE,MAAM,CAAA;IAEpB;;;OAGG;IACH,WAAW,EAAE,MAAM,CAAA;IAEnB;;;;;OAKG;IACH,SAAS,EAAE,MAAM,CAAA;IAEjB;;;;;OAKG;IACH,cAAc,EAAE,MAAM,CAAA;IAEtB;;;;;OAKG;IACH,SAAS,EAAE,MAAM,CAAA;IAEjB;;OAEG;IACH,YAAY,EAAE,MAAM,CAAA;IAEpB;;;;;;OAMG;IACH,UAAU,CAAC,EAAE,MAAM,CAAA;IAEnB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAA;IAEtB;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAA;CACrB;AAED;;GAEG;AACH,MAAM,WAAW,eAAe;IAC/B;;OAEG;IACH,cAAc,EAAE,WAAW,CAAC,OAAO,CAAC,CAAA;IAEpC;;OAEG;IACH,KAAK,EAAE,WAAW,CAAC,WAAW,GAAG,SAAS,CAAC,CAAA;CAC3C"}

package/esm/composables/useDialog/types.d.ts

@@ -41,16 +41,16 @@ export type QUseDialogReturn = {
      * Rejects when `props.id` is already used by an active dialog.
      * Resolves with the dialog id once the component registers it during setup.
      */
-    addDialog(props: QDialogProps, options?: QDialogOptions, handlers?: QDialogHandlers): Promise<string>;
+    addDialog: (props: QDialogProps, options?: QDialogOptions, handlers?: QDialogHandlers) => Promise<string>;
     /**
      * Removes a mounted dialog by id.
      * Throws when no mounted dialog with that id exists.
      */
-    removeDialog(id: string): void;
+    removeDialog: (id: string) => void;
     /**
      * Cancels a dialog that has not registered yet.
      * Matches `props.id` from `addDialog`. No-op when no matching entry exists.
      */
-    cancelDialog(id: string): void;
+    cancelDialog: (id: string) => void;
 };
 //# sourceMappingURL=types.d.ts.map

package/esm/composables/useDialog/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/composables/useDialog/types.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAO,MAAM,KAAK,CAAA;AAC3C,OAAO,KAAK,EAAE,YAAY,EAAE,cAAc,EAAE,eAAe,EAAE,MAAM,gCAAgC,CAAA;AA+EnG;;;;;GAKG;AACH,MAAM,MAAM,WAAW,GAAG;IACzB;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,CAAA;IAEX;;OAEG;IACH,KAAK,EAAE,YAAY,CAAA;IAEnB;;OAEG;IACH,OAAO,CAAC,EAAE,cAAc,CAAA;IAExB;;OAEG;IACH,QAAQ,CAAC,EAAE,eAAe,CAAA;CAC1B,CAAA;AAeD;;;GAGG;AACH,MAAM,MAAM,gBAAgB,GAAG;IAC9B;;;;OAIG;IACH,OAAO,EAAE,WAAW,CAAC,WAAW,EAAE,CAAC,CAAA;IAEnC;;;;;OAKG;IACH,SAAS,CACR,KAAK,EAAE,YAAY,EACnB,OAAO,CAAC,EAAE,cAAc,EACxB,QAAQ,CAAC,EAAE,eAAe,GACxB,OAAO,CAAC,MAAM,CAAC,CAAA;IAElB;;;OAGG;IACH,YAAY,CAAC,EAAE,EAAE,MAAM,GAAG,IAAI,CAAA;IAE9B;;;OAGG;IACH,YAAY,CAAC,EAAE,EAAE,MAAM,GAAG,IAAI,CAAA;CAC9B,CAAA"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/composables/useDialog/types.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAO,MAAM,KAAK,CAAA;AAC3C,OAAO,KAAK,EAAE,YAAY,EAAE,cAAc,EAAE,eAAe,EAAE,MAAM,gCAAgC,CAAA;AA+EnG;;;;;GAKG;AACH,MAAM,MAAM,WAAW,GAAG;IACzB;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,CAAA;IAEX;;OAEG;IACH,KAAK,EAAE,YAAY,CAAA;IAEnB;;OAEG;IACH,OAAO,CAAC,EAAE,cAAc,CAAA;IAExB;;OAEG;IACH,QAAQ,CAAC,EAAE,eAAe,CAAA;CAC1B,CAAA;AAeD;;;GAGG;AACH,MAAM,MAAM,gBAAgB,GAAG;IAC9B;;;;OAIG;IACH,OAAO,EAAE,WAAW,CAAC,WAAW,EAAE,CAAC,CAAA;IAEnC;;;;;OAKG;IACH,SAAS,EAAE,CACV,KAAK,EAAE,YAAY,EACnB,OAAO,CAAC,EAAE,cAAc,EACxB,QAAQ,CAAC,EAAE,eAAe,KACtB,OAAO,CAAC,MAAM,CAAC,CAAA;IAEpB;;;OAGG;IACH,YAAY,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAA;IAElC;;;OAGG;IACH,YAAY,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAA;CAClC,CAAA"}

package/esm/composables/useToast/_internal.js

@@ -103,17 +103,21 @@ function u() {
 		let i = r.remainingTimeout;
 		return delete r.remainingTimeout, i;
 	}
-	function g() {
-		return `toast-${++o}`;
+	function g(t) {
+		let n = e.value.find((e) => e.entryKey === t);
+		return !n || n.announced ? !1 : (n.announced = !0, !0);
 	}
 	function _() {
-		return s > 0;
+		return `toast-${++o}`;
 	}
 	function v() {
+		return s > 0;
+	}
+	function y() {
 		if (s > 0) throw Error("Only one QToaster may be mounted per app.");
 		s++;
 	}
-	function y() {
+	function b() {
 		s = Math.max(0, s - 1), !(s > 0) && (i(r, /* @__PURE__ */ Error("QToaster unmounted before the toast was ready")), e.value = [], n.value = []);
 	}
 	return {
@@ -127,10 +131,11 @@ function u() {
 		updateToastEntryId: p,
 		setRemainingTimeout: m,
 		consumeRemainingTimeout: h,
-		nextEntryKey: g,
-		hasToaster: _,
-		registerToaster: v,
-		unregisterToaster: y
+		markAnnounced: g,
+		nextEntryKey: _,
+		hasToaster: v,
+		registerToaster: y,
+		unregisterToaster: b
 	};
 }
 function d() {

package/esm/composables/useToast/types.d.ts

@@ -34,14 +34,14 @@ export type QUseToastReturn = {
      * When `maxToasts` is set and the stack is full, the toast waits in a queue and the
      * promise stays pending until a slot opens and the toast registers during setup.
      */
-    addToast(props: QToastProps): Promise<string>;
+    addToast: (props: QToastProps) => Promise<string>;
     /**
      * Removes a toast that has already registered its public id — mounted or demoted
      * into the queue. Throws when no toast with that registered id exists.
      * For never-mounted queue entries or not-yet-registered mounts, use `cancelToast`
      * with `props.id`. Demoted toasts accept either API.
      */
-    removeToast(id: string): void;
+    removeToast: (id: string) => void;
     /**
      * Cancels a never-mounted queue entry, a demoted queue entry, or a mount that has
      * not registered yet. Matches `props.id` from `addToast` (demotion copies the
@@ -49,6 +49,6 @@ export type QUseToastReturn = {
      * For registered mounted toasts, use `removeToast`. Rejects an unsettled
      * `addToast` promise with "Toast canceled".
      */
-    cancelToast(id: string): void;
+    cancelToast: (id: string) => void;
 };
 //# sourceMappingURL=types.d.ts.map

package/esm/composables/useToast/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/composables/useToast/types.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAO,MAAM,KAAK,CAAA;AAC3C,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAA;AA+H1D;;;;GAIG;AACH,MAAM,MAAM,UAAU,GAAG;IACxB;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,CAAA;IAEX;;OAEG;IACH,KAAK,EAAE,WAAW,CAAA;CAClB,CAAA;AAoBD;;;GAGG;AACH,MAAM,MAAM,eAAe,GAAG;IAC7B;;;;OAIG;IACH,MAAM,EAAE,WAAW,CAAC,UAAU,EAAE,CAAC,CAAA;IAEjC;;;;;;;OAOG;IACH,QAAQ,CAAC,KAAK,EAAE,WAAW,GAAG,OAAO,CAAC,MAAM,CAAC,CAAA;IAE7C;;;;;OAKG;IACH,WAAW,CAAC,EAAE,EAAE,MAAM,GAAG,IAAI,CAAA;IAE7B;;;;;;OAMG;IACH,WAAW,CAAC,EAAE,EAAE,MAAM,GAAG,IAAI,CAAA;CAC7B,CAAA"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/composables/useToast/types.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAO,MAAM,KAAK,CAAA;AAC3C,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAA;AA0I1D;;;;GAIG;AACH,MAAM,MAAM,UAAU,GAAG;IACxB;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,CAAA;IAEX;;OAEG;IACH,KAAK,EAAE,WAAW,CAAA;CAClB,CAAA;AA0BD;;;GAGG;AACH,MAAM,MAAM,eAAe,GAAG;IAC7B;;;;OAIG;IACH,MAAM,EAAE,WAAW,CAAC,UAAU,EAAE,CAAC,CAAA;IAEjC;;;;;;;OAOG;IACH,QAAQ,EAAE,CAAC,KAAK,EAAE,WAAW,KAAK,OAAO,CAAC,MAAM,CAAC,CAAA;IAEjD;;;;;OAKG;IACH,WAAW,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAA;IAEjC;;;;;;OAMG;IACH,WAAW,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAA;CACjC,CAAA"}

package/esm/index.d.ts

@@ -5,12 +5,13 @@ import * as utils from './utils';
 export declare const createFramework: (options?: QFrameworkConfig) => import('vue').Plugin;
 export { templates, components, utils };
 export * from './composables';
-export type { QBaseComponentProps, QComponentSize } from './types';
+export type { QBaseComponentProps, QComponentSize, QHelpDisplay, QLive, QSelectionLabelPlacement } from './types';
 //# sourceMappingURL=index.d.ts.map
 declare module '@vue/runtime-core' {
 	export interface GlobalComponents {
 		QAccordion: typeof import('@quidgest/ui/components')['QAccordion']
 		QAccordionItem: typeof import('@quidgest/ui/components')['QAccordionItem']
+		QAlert: typeof import('@quidgest/ui/components')['QAlert']
 		QAvatar: typeof import('@quidgest/ui/components')['QAvatar']
 		QBadge: typeof import('@quidgest/ui/components')['QBadge']
 		QBadgeIndicator: typeof import('@quidgest/ui/components')['QBadgeIndicator']
@@ -21,7 +22,6 @@ declare module '@vue/runtime-core' {
 		QCard: typeof import('@quidgest/ui/components')['QCard']
 		QCarousel: typeof import('@quidgest/ui/components')['QCarousel']
 		QCheckbox: typeof import('@quidgest/ui/components')['QCheckbox']
-		QCheckboxLabel: typeof import('@quidgest/ui/components')['QCheckboxLabel']
 		QCollapsible: typeof import('@quidgest/ui/components')['QCollapsible']
 		QColorPicker: typeof import('@quidgest/ui/components')['QColorPicker']
 		QCombobox: typeof import('@quidgest/ui/components')['QCombobox']

package/esm/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,SAAS,MAAM,aAAa,CAAA;AACxC,OAAO,KAAK,UAAU,MAAM,cAAc,CAAA;AAC1C,OAAO,KAAK,KAAK,MAAM,SAAS,CAAA;AAIhC,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAA;AAEnD,eAAO,MAAM,eAAe,aAAa,gBAAgB,yBAExD,CAAA;AAED,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,KAAK,EAAE,CAAA;AACvC,cAAc,eAAe,CAAA;AAC7B,YAAY,EAAE,mBAAmB,EAAE,cAAc,EAAE,MAAM,SAAS,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,SAAS,MAAM,aAAa,CAAA;AACxC,OAAO,KAAK,UAAU,MAAM,cAAc,CAAA;AAC1C,OAAO,KAAK,KAAK,MAAM,SAAS,CAAA;AAIhC,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAA;AAEnD,eAAO,MAAM,eAAe,aAAa,gBAAgB,yBAExD,CAAA;AAED,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,KAAK,EAAE,CAAA;AACvC,cAAc,eAAe,CAAA;AAC7B,YAAY,EACX,mBAAmB,EACnB,cAAc,EACd,YAAY,EACZ,KAAK,EACL,wBAAwB,EACxB,MAAM,SAAS,CAAA"}

package/esm/types/component.d.ts

@@ -26,4 +26,27 @@ export type QBaseComponentProps = {
  * inherit the global scale with no extra class.
  */
 export type QComponentSize = 'small' | 'medium' | 'large';
+/**
+ * Where a selection control's label sits relative to the control.
+ * `end` places the label after the control. `start` places it before.
+ * Shared by `QCheckbox` and `QRadioButton`. Not a `QLabel` position.
+ */
+export type QSelectionLabelPlacement = 'start' | 'end';
+/**
+ * How help text is presented on a component.
+ * Tooltip, popover, and subtext are alternatives.
+ * - `popover`: a help button opens the text.
+ * - `tooltip`: the text shows on hover of the control or title, or focus of the
+ *   control (see each component's `helpDisplay`).
+ * - `subtext`: the text is always visible under the control or title.
+ */
+export type QHelpDisplay = 'tooltip' | 'popover' | 'subtext';
+/**
+ * How screen readers announce a component's message.
+ * - `assertive`: interrupts the user (`role="alert"`).
+ * - `polite`: waits until the user is idle (`role="status"`).
+ * - `off`: does not announce it.
+ * Shared by `QAlert` and `QToast`.
+ */
+export type QLive = 'assertive' | 'polite' | 'off';
 //# sourceMappingURL=component.d.ts.map

package/esm/types/component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"component.d.ts","sourceRoot":"","sources":["../../src/types/component.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,MAAM,MAAM,mBAAmB,GAAG;IACjC;;;;OAIG;IACH,EAAE,CAAC,EAAE,MAAM,CAAA;IAEX;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,OAAO,EAAE,CAAA;CAC1B,CAAA;AAED;;;;;GAKG;AACH,MAAM,MAAM,cAAc,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAA"}
+{"version":3,"file":"component.d.ts","sourceRoot":"","sources":["../../src/types/component.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,MAAM,MAAM,mBAAmB,GAAG;IACjC;;;;OAIG;IACH,EAAE,CAAC,EAAE,MAAM,CAAA;IAEX;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,OAAO,EAAE,CAAA;CAC1B,CAAA;AAED;;;;;GAKG;AACH,MAAM,MAAM,cAAc,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAA;AAEzD;;;;GAIG;AACH,MAAM,MAAM,wBAAwB,GAAG,OAAO,GAAG,KAAK,CAAA;AAEtD;;;;;;;GAOG;AACH,MAAM,MAAM,YAAY,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,CAAA;AAE5D;;;;;;GAMG;AACH,MAAM,MAAM,KAAK,GAAG,WAAW,GAAG,QAAQ,GAAG,KAAK,CAAA"}

package/esm/types/index.d.ts

@@ -14,5 +14,5 @@
  * Add new exports here **only if** the type is meant to be
  * consumed by applications or other packages.
  */
-export type { QBaseComponentProps, QComponentSize } from './component';
+export type { QBaseComponentProps, QComponentSize, QHelpDisplay, QLive, QSelectionLabelPlacement } from './component';
 //# sourceMappingURL=index.d.ts.map

package/esm/types/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/types/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AAEH,YAAY,EAAE,mBAAmB,EAAE,cAAc,EAAE,MAAM,aAAa,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/types/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AAEH,YAAY,EACX,mBAAmB,EACnB,cAAc,EACd,YAAY,EACZ,KAAK,EACL,wBAAwB,EACxB,MAAM,aAAa,CAAA"}

package/esm/utils/color/merge.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"merge.d.ts","sourceRoot":"","sources":["../../../src/utils/color/merge.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAoB,YAAY,EAAE,MAAM,SAAS,CAAA;AAQ7D;;GAEG;AACH,eAAO,MAAM,2BAA2B,KAAK,CAAA;AAE7C;;;GAGG;AACH,eAAO,MAAM,0BAA0B,KAAK,CAAA;AAE5C;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,iBAAiB,CAAC,CAAC,EAAE,YAAY,EAAE,CAAC,EAAE,OAAO,CAAC,YAAY,CAAC,GAAG,YAAY,CAiGzF"}
+{"version":3,"file":"merge.d.ts","sourceRoot":"","sources":["../../../src/utils/color/merge.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAoB,YAAY,EAAE,MAAM,SAAS,CAAA;AAQ7D;;GAEG;AACH,eAAO,MAAM,2BAA2B,KAAK,CAAA;AAE7C;;;GAGG;AACH,eAAO,MAAM,0BAA0B,KAAK,CAAA;AAE5C;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,iBAAiB,CAAC,CAAC,EAAE,YAAY,EAAE,CAAC,EAAE,OAAO,CAAC,YAAY,CAAC,GAAG,YAAY,CAgGzF"}

package/esm/utils/focus.d.ts

@@ -0,0 +1,35 @@
+/**
+ * Returns the rendered elements in `container` that match {@link TABBABLE_SELECTOR},
+ * in document order. Skips the focus walls of `QFocusWrap`.
+ *
+ * @param container - The element or document to search.
+ */
+export declare function getTabbableElements(container: ParentNode): HTMLElement[];
+/**
+ * Finds the tabbable element next to `element` inside `container`: the first one after
+ * it in document order, or the last one before it when nothing follows. That is where
+ * Tab would have gone, so the focus order stays intact (WCAG 2.4.3).
+ *
+ * Skips elements inside `element` and elements with a negative `tabindex`.
+ *
+ * @param element - The element about to be removed.
+ * @param container - Where to look. Defaults to the whole document.
+ * @returns The element to focus, or `undefined` when the container has none.
+ */
+export declare function getAdjacentTabbable(element: Element, container?: ParentNode): HTMLElement | undefined;
+/**
+ * Finds where focus should go when `element` leaves the page while focus is inside it.
+ * Removing the focused element would otherwise drop focus on `<body>`, and screen
+ * readers lose their place.
+ *
+ * Inside an overlay, such as an open `QDialog` or `QPopover`, the search stays in the
+ * overlay's content: an element of the page behind a modal dialog is not a valid target.
+ * When nothing else in the overlay can take focus, the content element itself takes it
+ * (it has `tabindex="-1"`), so focus stays in the dialog. Outside overlays, the search
+ * covers the whole document.
+ *
+ * @param element - The element about to be removed.
+ * @returns The element to focus, or `undefined` when the page has none.
+ */
+export declare function getFocusTargetOnRemoval(element: Element): HTMLElement | undefined;
+//# sourceMappingURL=focus.d.ts.map

package/esm/utils/focus.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"focus.d.ts","sourceRoot":"","sources":["../../src/utils/focus.ts"],"names":[],"mappings":"AA0BA;;;;;GAKG;AACH,wBAAgB,mBAAmB,CAAC,SAAS,EAAE,UAAU,GAAG,WAAW,EAAE,CAMxE;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,mBAAmB,CAClC,OAAO,EAAE,OAAO,EAChB,SAAS,GAAE,UAAkC,GAC3C,WAAW,GAAG,SAAS,CAczB;AAED;;;;;;;;;;;;;GAaG;AACH,wBAAgB,uBAAuB,CAAC,OAAO,EAAE,OAAO,GAAG,WAAW,GAAG,SAAS,CAKjF"}

package/esm/utils/focus.js

@@ -0,0 +1,27 @@
+//#region src/utils/focus.ts
+var e = [
+	"a[href]",
+	"area[href]",
+	"input:not([disabled])",
+	"select:not([disabled])",
+	"textarea:not([disabled])",
+	"button:not([disabled])",
+	"iframe",
+	"object",
+	"embed",
+	"[tabindex]:not([tabindex=\"-1\"])",
+	"[contenteditable]"
+].join(","), t = ".q-overlay__content";
+function n(t) {
+	return Array.from(t.querySelectorAll(e)).filter((e) => (e.offsetWidth > 0 || e.offsetHeight > 0 || e.getClientRects().length > 0) && !e.getAttribute("data-focus-wall"));
+}
+function r(e, t = e.ownerDocument) {
+	let r = n(t).filter((t) => !(Number(t.getAttribute("tabindex")) < 0) && !e.contains(t)), i = r.findIndex((t) => e.compareDocumentPosition(t) & Node.DOCUMENT_POSITION_FOLLOWING);
+	return i >= 0 ? r[i] : r[r.length - 1];
+}
+function i(e) {
+	let n = e.closest(t);
+	return n ? r(e, n) ?? n : r(e);
+}
+//#endregion
+export { r as getAdjacentTabbable, i as getFocusTargetOnRemoval, n as getTabbableElements };

package/esm/utils/overlay.js

@@ -91,7 +91,7 @@ function s(e, t, n) {
 		case "end":
 			s[l] += u;
 			break;
-		default: throw Error(`[Quidgest UI] Invalid alignment value: ${i}`);
+		default: throw Error(`[Quidgest UI] Invalid alignment value: ${String(i)}`);
 	}
 	return s;
 }
@@ -110,7 +110,7 @@ function c(e, t, n, r) {
 		case "right":
 			a = window.innerWidth - e.right - (t.width + r);
 			break;
-		default: throw Error(`[Quidgest UI] Invalid side value: ${i}`);
+		default: throw Error(`[Quidgest UI] Invalid side value: ${String(i)}`);
 	}
 	return a;
 }

package/esm/utils/severity.d.ts

@@ -0,0 +1,40 @@
+import { QLive } from '../types/component';
+export declare const SEVERITIES: readonly ["info", "success", "warning", "danger"];
+/** A theme color that carries a severity. */
+export type QSeverity = (typeof SEVERITIES)[number];
+export declare const SEVERITY_ICONS: {
+    info: {
+        icon: string;
+    };
+    success: {
+        icon: string;
+    };
+    warning: {
+        icon: string;
+    };
+    danger: {
+        icon: string;
+    };
+};
+export declare const SEVERITY_TEXTS: {
+    info: string;
+    success: string;
+    warning: string;
+    danger: string;
+};
+/**
+ * Checks whether a color is one of the severity theme colors.
+ *
+ * @param color - The color value to check.
+ * @returns True for `info`, `success`, `warning` and `danger`.
+ */
+export declare function isSeverity(color: string): color is QSeverity;
+/**
+ * The default politeness of a message in the given color. Warnings and errors interrupt
+ * the user. Every other color waits until they are idle.
+ *
+ * @param color - The color of the alert or toast.
+ * @returns `assertive` for `warning` and `danger`, otherwise `polite`.
+ */
+export declare function getDefaultLive(color: string): Exclude<QLive, 'off'>;
+//# sourceMappingURL=severity.d.ts.map

package/esm/utils/severity.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"severity.d.ts","sourceRoot":"","sources":["../../src/utils/severity.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAA;AAI/C,eAAO,MAAM,UAAU,mDAAoD,CAAA;AAE3E,6CAA6C;AAC7C,MAAM,MAAM,SAAS,GAAG,CAAC,OAAO,UAAU,CAAC,CAAC,MAAM,CAAC,CAAA;AAGnD,eAAO,MAAM,cAAc;;;;;;;;;;;;;CAac,CAAA;AAIzC,eAAO,MAAM,cAAc;;;;;CAKU,CAAA;AAErC;;;;;GAKG;AACH,wBAAgB,UAAU,CAAC,KAAK,EAAE,MAAM,GAAG,KAAK,IAAI,SAAS,CAE5D;AAED;;;;;;GAMG;AACH,wBAAgB,cAAc,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO,CAAC,KAAK,EAAE,KAAK,CAAC,CAEnE"}