@quidgest/ui 0.20.0 → 0.20.1

package/esm/components/QGauge/QGauge.d.ts

@@ -0,0 +1,56 @@
+import { DEFAULT_TEXTS } from './constants';
+import { QGaugeProps } from './types';
+type __VLS_Props = QGaugeProps;
+type __VLS_PublicProps = {
+    modelValue?: number;
+} & __VLS_Props;
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: Readonly<{
+        /**
+         * Custom markup for the visible current value. Also set `valueLabel` when the
+         * slot changes how the value should be announced, because slot content does
+         * not replace `aria-valuetext`.
+         */
+        value?: (props: {
+            value: number;
+            min: number;
+            max: number;
+        }) => unknown;
+    }> & {
+        /**
+         * Custom markup for the visible current value. Also set `valueLabel` when the
+         * slot changes how the value should be announced, because slot content does
+         * not replace `aria-valuetext`.
+         */
+        value?: (props: {
+            value: number;
+            min: number;
+            max: number;
+        }) => unknown;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "update:modelValue": (value: number) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: number) => any) | undefined;
+}>, {
+    texts: typeof DEFAULT_TEXTS;
+    min: number;
+    max: number;
+    tickCount: number;
+    targetComparison: import('./types').QGaugeTargetComparison;
+    showLegend: boolean;
+    showTargetLegend: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+//# sourceMappingURL=QGauge.vue.d.ts.map

package/esm/components/QGauge/QGauge.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"QGauge.vue.d.ts","sourceRoot":"","sources":["../../../src/components/QGauge/QGauge.vue"],"names":[],"mappings":"AA+JA;AAugBC,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAA;AAO3C,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AA4B1C,KAAK,WAAW,GAAG,WAAW,CAAC;AA6UhC,KAAK,iBAAiB,GAAG;IACzB,UAAU,CAAC,EAAE,MAAM,CAAC;CACnB,GAAG,WAAW,CAAC;AAKhB,iBAAS,cAAc;WA6LT,OAAO,IAA6B;;QAngBhD;;;;WAIG;gBACK,CAAC,KAAK,EAAE;YAAE,KAAK,EAAE,MAAM,CAAC;YAAC,GAAG,EAAE,MAAM,CAAC;YAAC,GAAG,EAAE,MAAM,CAAA;SAAE,KAAK,OAAO;;QALvE;;;;WAIG;gBACK,CAAC,KAAK,EAAE;YAAE,KAAK,EAAE,MAAM,CAAC;YAAC,GAAG,EAAE,MAAM,CAAC;YAAC,GAAG,EAAE,MAAM,CAAA;SAAE,KAAK,OAAO;;;;EAmgBxE;AAkCD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;;;;;;;;;wFASnB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAapG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}

package/esm/components/QGauge/QGauge.vue.js

@@ -0,0 +1,305 @@
+import { useTheme as e } from "../../composables/theme.js";
+import { resolveColor as t } from "../../composables/useColor/index.js";
+import { useId as n } from "../../composables/uid.js";
+import { DEFAULT_TEXTS as r } from "./constants.js";
+import { Fragment as i, computed as a, createCommentVNode as o, createElementBlock as s, createElementVNode as c, createTextVNode as l, defineComponent as u, mergeModels as d, normalizeClass as f, normalizeStyle as ee, openBlock as p, renderList as m, renderSlot as te, toDisplayString as h, toRef as g, unref as _, useModel as ne } from "vue";
+//#region src/components/QGauge/QGauge.vue?vue&type=script&setup=true&lang.ts
+var re = [
+	"id",
+	"aria-labelledby",
+	"aria-valuemin",
+	"aria-valuemax",
+	"aria-valuenow",
+	"aria-valuetext"
+], ie = ["id"], ae = { class: "q-gauge__visual" }, oe = {
+	class: "q-gauge__svg",
+	viewBox: "0 0 240 158",
+	"aria-hidden": "true",
+	focusable: "false"
+}, se = ["d"], ce = ["d"], le = [
+	"d",
+	"stroke",
+	"data-range-from",
+	"data-range-to"
+], ue = ["data-value"], de = [
+	"x1",
+	"y1",
+	"x2",
+	"y2"
+], fe = ["x", "y"], pe = ["data-target", "data-target-state"], me = [
+	"x1",
+	"y1",
+	"x2",
+	"y2"
+], he = [
+	"x1",
+	"y1",
+	"x2",
+	"y2"
+], ge = ["x", "y"], _e = ["transform"], ve = { class: "q-gauge__value-row" }, ye = { class: "q-gauge__value" }, be = {
+	key: 0,
+	class: "q-gauge__unit"
+}, xe = {
+	key: 1,
+	class: "q-gauge__secondary"
+}, Se = {
+	key: 2,
+	class: "q-gauge__legend"
+}, Ce = { class: "q-gauge__legend-label" }, we = { class: "q-gauge__legend-label" }, v = 120, y = 126, b = 86, x = 73, S = 97, C = 59, w = 68, T = 104, E = 116, D = 70, O = 180, k = 360, A = /*@__PURE__*/ u({
+	__name: "QGauge",
+	props: /*@__PURE__*/ d({
+		id: {},
+		class: {},
+		min: { default: 0 },
+		max: { default: 100 },
+		ranges: {},
+		ticks: {},
+		tickCount: { default: 5 },
+		label: {},
+		valueLabel: {},
+		target: {},
+		targetComparison: { default: "at-least" },
+		targetLabel: {},
+		showTargetValue: { type: Boolean },
+		showLegend: {
+			type: Boolean,
+			default: !0
+		},
+		showTargetLegend: {
+			type: Boolean,
+			default: !0
+		},
+		unit: {},
+		secondaryLabel: {},
+		texts: { default: () => r },
+		tickFormatter: {}
+	}, {
+		modelValue: { default: 0 },
+		modelModifiers: {}
+	}),
+	emits: ["update:modelValue"],
+	setup(r) {
+		let u = r, d = ne(r, "modelValue"), A = k - O, j = n(g(u, "id")), Te = e(), M = a(() => Number.isFinite(u.min) ? u.min : 0), N = a(() => Number.isFinite(u.max) && u.max > M.value ? u.max : M.value + 1), P = a(() => Number.isFinite(d.value) ? d.value : M.value), F = a(() => Math.min(N.value, Math.max(M.value, P.value))), I = a(() => typeof u.target == "number" && Number.isFinite(u.target) ? u.target : void 0), L = a(() => `${j.value}-label`), R = a(() => !!u.label), Ee = a(() => !!u.unit), De = a(() => !!u.secondaryLabel), z = a(() => typeof u.valueLabel == "string" ? u.valueLabel : u.valueLabel ? u.valueLabel(P.value, M.value, N.value) : String(P.value)), B = a(() => {
+			if (I.value === void 0) return;
+			if (typeof u.targetLabel == "string") return u.targetLabel;
+			if (u.targetLabel) return u.targetLabel(I.value, M.value, N.value);
+			let e = u.unit ? ` ${u.unit}` : "";
+			return `${Q(I.value)}${e}`;
+		}), Oe = a(() => {
+			let e = B.value;
+			return e === void 0 || u.targetLabel !== void 0 ? e : `${u.texts.target} ${e}`;
+		}), V = a(() => {
+			if (I.value !== void 0) return u.targetComparison === "at-most" ? P.value <= I.value : P.value >= I.value;
+		}), H = a(() => {
+			if (V.value !== void 0) return V.value ? "achieved" : "missed";
+		}), ke = a(() => {
+			if (H.value) return H.value === "achieved" ? u.texts.targetAchieved : u.texts.targetNotAchieved;
+		}), U = a(() => (u.ranges ?? []).flatMap((e) => {
+			if (!Number.isFinite(e.from) || !Number.isFinite(e.to) || e.to <= e.from) return [];
+			let n = Math.max(M.value, e.from), r = Math.min(N.value, e.to);
+			return r <= n ? [] : [{
+				from: n,
+				to: r,
+				color: t(e.color, Te.current.value.scheme),
+				label: e.label,
+				path: Z(Y(n), Y(r), b)
+			}];
+		})), W = a(() => U.value.flatMap((e) => e.label ? [{
+			from: e.from,
+			to: e.to,
+			color: e.color,
+			label: e.label
+		}] : [])), G = a(() => u.showTargetLegend && K.value ? [{
+			state: "achieved",
+			label: u.texts.targetAchieved
+		}, {
+			state: "missed",
+			label: u.texts.targetNotAchieved
+		}] : []), Ae = a(() => u.showLegend && (W.value.length > 0 || G.value.length > 0)), je = a(() => {
+			if (u.ticks) return [...new Set(u.ticks)].filter((e) => Number.isFinite(e) && e >= M.value && e <= N.value).sort((e, t) => e - t);
+			let e = Math.max(2, Math.floor(Number.isFinite(u.tickCount) ? u.tickCount : 5)), t = (N.value - M.value) / (e - 1);
+			return Array.from({ length: e }, (e, n) => M.value + t * n);
+		}), Me = a(() => je.value.map((e) => {
+			let t = Y(e);
+			return {
+				value: e,
+				inner: X(t, x),
+				outer: X(t, S),
+				label: Le(t),
+				text: u.tickFormatter ? u.tickFormatter(e) : Q(e)
+			};
+		})), K = a(() => {
+			if (I.value === void 0 || I.value < M.value || I.value > N.value) return;
+			let e = Y(I.value);
+			return {
+				value: I.value,
+				inner: X(e, w),
+				outer: X(e, T),
+				label: Re(e)
+			};
+		}), q = a(() => Z(O, k, b)), J = a(() => Y(F.value)), Ne = a(() => `rotate(${Q(J.value - 270)} ${v} ${y})`), Pe = a(() => {
+			let e;
+			for (let t of U.value) F.value >= t.from && F.value <= t.to && (e = t.label);
+			return e;
+		}), Fe = a(() => u.valueLabel === void 0 ? [z.value, u.unit].filter(Boolean).join(" ") : z.value), Ie = a(() => [
+			Fe.value,
+			Pe.value,
+			Oe.value,
+			ke.value
+		].filter(Boolean).join(" "));
+		function Y(e) {
+			return O + (e - M.value) / (N.value - M.value) * A;
+		}
+		function X(e, t) {
+			let n = e * Math.PI / 180;
+			return {
+				x: $(v + t * Math.cos(n)),
+				y: $(y + t * Math.sin(n))
+			};
+		}
+		function Le(e) {
+			let t = X(e, C);
+			return e === O || e === k ? {
+				x: t.x,
+				y: $(t.y + 14)
+			} : t;
+		}
+		function Re(e) {
+			let t = X(e, E);
+			return e === O ? {
+				x: $(t.x + 16),
+				y: t.y
+			} : e === k ? {
+				x: $(t.x - 16),
+				y: t.y
+			} : t;
+		}
+		function Z(e, t, n) {
+			let r = X(e, n), i = X(t, n), a = +(t - e > 180);
+			return `M ${r.x} ${r.y} A ${n} ${n} 0 ${a} 1 ${i.x} ${i.y}`;
+		}
+		function Q(e) {
+			return String($(e));
+		}
+		function $(e) {
+			return Number(e.toFixed(3));
+		}
+		return (e, t) => (p(), s("div", {
+			id: _(j),
+			class: f(["q-gauge", u.class]),
+			role: "meter",
+			"aria-labelledby": R.value ? L.value : void 0,
+			"aria-valuemin": M.value,
+			"aria-valuemax": N.value,
+			"aria-valuenow": F.value,
+			"aria-valuetext": Ie.value
+		}, [
+			R.value ? (p(), s("div", {
+				key: 0,
+				id: L.value,
+				class: "q-gauge__label"
+			}, h(u.label), 9, ie)) : o("v-if", !0),
+			c("div", ae, [(p(), s("svg", oe, [
+				c("path", {
+					class: "q-gauge__track-shadow",
+					d: q.value
+				}, null, 8, se),
+				c("path", {
+					class: "q-gauge__track",
+					d: q.value
+				}, null, 8, ce),
+				(p(!0), s(i, null, m(U.value, (e, t) => (p(), s("path", {
+					key: `${e.from}-${e.to}-${t}`,
+					class: "q-gauge__range",
+					d: e.path,
+					stroke: e.color,
+					"data-range-from": e.from,
+					"data-range-to": e.to
+				}, null, 8, le))), 128)),
+				(p(!0), s(i, null, m(Me.value, (e) => (p(), s("g", {
+					key: e.value,
+					class: "q-gauge__tick",
+					"data-value": e.value
+				}, [c("line", {
+					x1: e.inner.x,
+					y1: e.inner.y,
+					x2: e.outer.x,
+					y2: e.outer.y
+				}, null, 8, de), c("text", {
+					x: e.label.x,
+					y: e.label.y
+				}, h(e.text), 9, fe)], 8, ue))), 128)),
+				K.value ? (p(), s("g", {
+					key: 0,
+					class: f(["q-gauge__target", `q-gauge__target--${H.value}`]),
+					"data-target": K.value.value,
+					"data-target-state": H.value
+				}, [
+					c("line", {
+						class: "q-gauge__target-outline",
+						x1: K.value.inner.x,
+						y1: K.value.inner.y,
+						x2: K.value.outer.x,
+						y2: K.value.outer.y
+					}, null, 8, me),
+					c("line", {
+						class: "q-gauge__target-line",
+						x1: K.value.inner.x,
+						y1: K.value.inner.y,
+						x2: K.value.outer.x,
+						y2: K.value.outer.y
+					}, null, 8, he),
+					u.showTargetValue ? (p(), s("text", {
+						key: 0,
+						class: "q-gauge__target-value",
+						x: K.value.label.x,
+						y: K.value.label.y
+					}, h(B.value), 9, ge)) : o("v-if", !0)
+				], 10, pe)) : o("v-if", !0),
+				c("g", {
+					class: "q-gauge__needle",
+					transform: Ne.value
+				}, [c("line", {
+					x1: v,
+					y1: y,
+					x2: v,
+					y2: D
+				})], 8, _e),
+				c("circle", {
+					class: "q-gauge__hub",
+					cx: v,
+					cy: y,
+					r: "21"
+				}),
+				c("circle", {
+					class: "q-gauge__hub-center",
+					cx: v,
+					cy: y,
+					r: "12"
+				})
+			]))]),
+			c("div", ve, [c("span", ye, [te(e.$slots, "value", {
+				value: P.value,
+				min: M.value,
+				max: N.value
+			}, () => [l(h(z.value), 1)])]), Ee.value ? (p(), s("span", be, h(u.unit), 1)) : o("v-if", !0)]),
+			De.value ? (p(), s("div", xe, h(u.secondaryLabel), 1)) : o("v-if", !0),
+			Ae.value ? (p(), s("ul", Se, [(p(!0), s(i, null, m(W.value, (e, t) => (p(), s("li", {
+				key: `${e.from}-${e.to}-${t}`,
+				class: "q-gauge__legend-item"
+			}, [c("span", {
+				class: "q-gauge__legend-swatch",
+				style: ee({ backgroundColor: e.color })
+			}, null, 4), c("span", Ce, h(e.label), 1)]))), 128)), (p(!0), s(i, null, m(G.value, (e) => (p(), s("li", {
+				key: e.state,
+				class: f([
+					"q-gauge__legend-item",
+					"q-gauge__legend-item--target",
+					{ "q-gauge__legend-item--active": e.state === H.value }
+				])
+			}, [c("span", { class: f(["q-gauge__legend-target", `q-gauge__legend-target--${e.state}`]) }, null, 2), c("span", we, h(e.label), 1)], 2))), 128))])) : o("v-if", !0)
+		], 10, re));
+	}
+});
+//#endregion
+export { A as default };

package/esm/components/QGauge/QGauge2.vue.js

@@ -0,0 +1,5 @@
+import e from "./QGauge.vue.js";
+//#region src/components/QGauge/QGauge.vue
+var t = e;
+//#endregion
+export { t as default };

package/esm/components/QGauge/constants.d.ts

@@ -0,0 +1,6 @@
+export declare const DEFAULT_TEXTS: {
+    target: string;
+    targetAchieved: string;
+    targetNotAchieved: string;
+};
+//# sourceMappingURL=constants.d.ts.map

package/esm/components/QGauge/constants.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../../src/components/QGauge/constants.ts"],"names":[],"mappings":"AACA,eAAO,MAAM,aAAa;;;;CAIQ,CAAA"}

package/esm/components/QGauge/constants.js

@@ -0,0 +1,8 @@
+//#region src/components/QGauge/constants.ts
+var e = {
+	target: "Target",
+	targetAchieved: "Target achieved",
+	targetNotAchieved: "Target not achieved"
+};
+//#endregion
+export { e as DEFAULT_TEXTS };

package/esm/components/QGauge/index.d.ts

@@ -0,0 +1,124 @@
+declare const QGauge: {
+    new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<{
+        modelValue?: number;
+    } & import('../../types/component').QBaseComponentProps & {
+        min?: number;
+        max?: number;
+        ranges?: import('./types').QGaugeRange[];
+        ticks?: number[];
+        tickCount?: number;
+        label?: string;
+        valueLabel?: string | ((value: number, min: number, max: number) => string);
+        target?: number;
+        targetComparison?: import('./types').QGaugeTargetComparison;
+        targetLabel?: string | ((target: number, min: number, max: number) => string);
+        showTargetValue?: boolean;
+        showLegend?: boolean;
+        showTargetLegend?: boolean;
+        unit?: string;
+        secondaryLabel?: string;
+        texts?: typeof import('./constants').DEFAULT_TEXTS;
+        tickFormatter?: (value: number) => string;
+    }> & Readonly<{
+        "onUpdate:modelValue"?: ((value: number) => any) | undefined;
+    }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+        "update:modelValue": (value: number) => any;
+    }, import('vue').PublicProps, {
+        texts: typeof import('./constants').DEFAULT_TEXTS;
+        min: number;
+        max: number;
+        tickCount: number;
+        targetComparison: import('./types').QGaugeTargetComparison;
+        showLegend: boolean;
+        showTargetLegend: boolean;
+    }, false, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, HTMLDivElement, import('vue').ComponentProvideOptions, {
+        P: {};
+        B: {};
+        D: {};
+        C: {};
+        M: {};
+        Defaults: {};
+    }, Readonly<{
+        modelValue?: number;
+    } & import('../../types/component').QBaseComponentProps & {
+        min?: number;
+        max?: number;
+        ranges?: import('./types').QGaugeRange[];
+        ticks?: number[];
+        tickCount?: number;
+        label?: string;
+        valueLabel?: string | ((value: number, min: number, max: number) => string);
+        target?: number;
+        targetComparison?: import('./types').QGaugeTargetComparison;
+        targetLabel?: string | ((target: number, min: number, max: number) => string);
+        showTargetValue?: boolean;
+        showLegend?: boolean;
+        showTargetLegend?: boolean;
+        unit?: string;
+        secondaryLabel?: string;
+        texts?: typeof import('./constants').DEFAULT_TEXTS;
+        tickFormatter?: (value: number) => string;
+    }> & Readonly<{
+        "onUpdate:modelValue"?: ((value: number) => any) | undefined;
+    }>, {}, {}, {}, {}, {
+        texts: typeof import('./constants').DEFAULT_TEXTS;
+        min: number;
+        max: number;
+        tickCount: number;
+        targetComparison: import('./types').QGaugeTargetComparison;
+        showLegend: boolean;
+        showTargetLegend: boolean;
+    }>;
+    __isFragment?: never;
+    __isTeleport?: never;
+    __isSuspense?: never;
+} & import('vue').ComponentOptionsBase<Readonly<{
+    modelValue?: number;
+} & import('../../types/component').QBaseComponentProps & {
+    min?: number;
+    max?: number;
+    ranges?: import('./types').QGaugeRange[];
+    ticks?: number[];
+    tickCount?: number;
+    label?: string;
+    valueLabel?: string | ((value: number, min: number, max: number) => string);
+    target?: number;
+    targetComparison?: import('./types').QGaugeTargetComparison;
+    targetLabel?: string | ((target: number, min: number, max: number) => string);
+    showTargetValue?: boolean;
+    showLegend?: boolean;
+    showTargetLegend?: boolean;
+    unit?: string;
+    secondaryLabel?: string;
+    texts?: typeof import('./constants').DEFAULT_TEXTS;
+    tickFormatter?: (value: number) => string;
+}> & Readonly<{
+    "onUpdate:modelValue"?: ((value: number) => any) | undefined;
+}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "update:modelValue": (value: number) => any;
+}, string, {
+    texts: typeof import('./constants').DEFAULT_TEXTS;
+    min: number;
+    max: number;
+    tickCount: number;
+    targetComparison: import('./types').QGaugeTargetComparison;
+    showLegend: boolean;
+    showTargetLegend: boolean;
+}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
+    $slots: Readonly<{
+        value?: (props: {
+            value: number;
+            min: number;
+            max: number;
+        }) => unknown;
+    }> & {
+        value?: (props: {
+            value: number;
+            min: number;
+            max: number;
+        }) => unknown;
+    };
+});
+export { QGauge };
+export * from './types';
+//# sourceMappingURL=index.d.ts.map

package/esm/components/QGauge/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/QGauge/index.ts"],"names":[],"mappings":"AAMA,QAAA,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAA2B,CAAA;AAGvC,OAAO,EAAE,MAAM,EAAE,CAAA;AAGjB,cAAc,SAAS,CAAA"}

package/esm/components/QGauge/index.js

@@ -0,0 +1,6 @@
+import { setupPropsProxy as e } from "../../utils/setupPropsProxy.js";
+import t from "./QGauge2.vue.js";
+//#region src/components/QGauge/index.ts
+var n = e(t);
+//#endregion
+export { n as QGauge };

package/esm/components/QGauge/types.d.ts

@@ -0,0 +1,146 @@
+import { QBaseComponentProps } from '../../types/component';
+import { DEFAULT_TEXTS } from './constants';
+/**
+ * A colored interval on the gauge scale.
+ */
+export type QGaugeRange = {
+    /**
+     * Inclusive start of the interval.
+     *
+     * @category Configuration
+     */
+    from: number;
+    /**
+     * Inclusive end of the interval.
+     *
+     * @category Configuration
+     */
+    to: number;
+    /**
+     * Theme utility color or CSS color used by the interval.
+     *
+     * @category Presentation
+     */
+    color: string;
+    /**
+     * Accessible description of the interval.
+     *
+     * @category Content
+     */
+    label?: string;
+};
+/**
+ * Defines how the current value is compared against the target.
+ */
+export type QGaugeTargetComparison = 'at-least' | 'at-most';
+export type QGaugeProps = QBaseComponentProps & {
+    /**
+     * Lowest value represented by the scale.
+     *
+     * @category Configuration
+     */
+    min?: number;
+    /**
+     * Highest value represented by the scale.
+     *
+     * @category Configuration
+     */
+    max?: number;
+    /**
+     * Colored intervals displayed over the neutral gauge track.
+     *
+     * @category Configuration
+     */
+    ranges?: QGaugeRange[];
+    /**
+     * Explicit values to label on the scale. Overrides tickCount.
+     *
+     * @category Configuration
+     */
+    ticks?: number[];
+    /**
+     * Number of evenly spaced scale labels generated when ticks is omitted.
+     *
+     * @category Configuration
+     */
+    tickCount?: number;
+    /**
+     * KPI title displayed above the gauge.
+     *
+     * @category Content
+     */
+    label?: string;
+    /**
+     * Text or formatter used as the fallback display and as the current-value part
+     * of `aria-valuetext`. Set this when the `value` slot changes how the value
+     * should be announced, because slot markup cannot be inferred reliably for
+     * accessibility. When provided, it is treated as complete current-value text,
+     * so the unit is not appended there automatically.
+     *
+     * @category Content
+     */
+    valueLabel?: string | ((value: number, min: number, max: number) => string);
+    /**
+     * Target value highlighted on the gauge track.
+     *
+     * @category Configuration
+     */
+    target?: number;
+    /**
+     * Target comparison mode. Use `at-least` when values should reach or exceed
+     * the target, and `at-most` when values should stay at or below it.
+     *
+     * @category Configuration
+     */
+    targetComparison?: QGaugeTargetComparison;
+    /**
+     * Text or formatter used to describe the target value.
+     *
+     * @category Content
+     */
+    targetLabel?: string | ((target: number, min: number, max: number) => string);
+    /**
+     * Whether the target value label is displayed next to the target marker.
+     *
+     * @category Presentation
+     */
+    showTargetValue?: boolean;
+    /**
+     * Whether the legend is displayed below the gauge.
+     *
+     * @category Presentation
+     */
+    showLegend?: boolean;
+    /**
+     * Whether target status items are included in the legend when a target marker
+     * is visible. The legend itself must also be enabled with `showLegend`.
+     *
+     * @category Presentation
+     */
+    showTargetLegend?: boolean;
+    /**
+     * Unit displayed next to the current value.
+     *
+     * @category Content
+     */
+    unit?: string;
+    /**
+     * Supporting information displayed below the current value.
+     *
+     * @category Content
+     */
+    secondaryLabel?: string;
+    /**
+     * Custom text configurations.
+     *
+     * @category Configuration
+     */
+    texts?: typeof DEFAULT_TEXTS;
+    /**
+     * Formatter used for scale labels.
+     *
+     * @category Configuration
+     */
+    tickFormatter?: (value: number) => string;
+};
+//# sourceMappingURL=types.d.ts.map

package/esm/components/QGauge/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/QGauge/types.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAA;AAChE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,aAAa,CAAA;AAEhD;;GAEG;AACH,MAAM,MAAM,WAAW,GAAG;IACzB;;;;OAIG;IACH,IAAI,EAAE,MAAM,CAAA;IAEZ;;;;OAIG;IACH,EAAE,EAAE,MAAM,CAAA;IAEV;;;;OAIG;IACH,KAAK,EAAE,MAAM,CAAA;IAEb;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAA;CACd,CAAA;AAED;;GAEG;AACH,MAAM,MAAM,sBAAsB,GAAG,UAAU,GAAG,SAAS,CAAA;AAE3D,MAAM,MAAM,WAAW,GAAG,mBAAmB,GAAG;IAC/C;;;;OAIG;IACH,GAAG,CAAC,EAAE,MAAM,CAAA;IAEZ;;;;OAIG;IACH,GAAG,CAAC,EAAE,MAAM,CAAA;IAEZ;;;;OAIG;IACH,MAAM,CAAC,EAAE,WAAW,EAAE,CAAA;IAEtB;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,EAAE,CAAA;IAEhB;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAElB;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAA;IAEd;;;;;;;;OAQG;IACH,UAAU,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,KAAK,MAAM,CAAC,CAAA;IAE3E;;;;OAIG;IACH,MAAM,CAAC,EAAE,MAAM,CAAA;IAEf;;;;;OAKG;IACH,gBAAgB,CAAC,EAAE,sBAAsB,CAAA;IAEzC;;;;OAIG;IACH,WAAW,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,MAAM,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,KAAK,MAAM,CAAC,CAAA;IAE7E;;;;OAIG;IACH,eAAe,CAAC,EAAE,OAAO,CAAA;IAEzB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAA;IAEpB;;;;;OAKG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAE1B;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,CAAA;IAEb;;;;OAIG;IACH,cAAc,CAAC,EAAE,MAAM,CAAA;IAEvB;;;;OAIG;IACH,KAAK,CAAC,EAAE,OAAO,aAAa,CAAA;IAE5B;;;;OAIG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAA;CACzC,CAAA"}

package/esm/components/index.d.ts

@@ -19,6 +19,7 @@ export * from './QDropdownMenu';
 export * from './QField';
 export * from './QFileUpload';
 export * from './QFocusWrap';
+export * from './QGauge';
 export * from './QGrid';
 export * from './QIcon';
 export * from './QInputGroup';