@quidgest/ui 0.27.0 → 0.28.0

package/esm/components/QRadioGroup/QRadioGroup.vue.js

@@ -1,19 +1,24 @@
 import { provideDefaults as e } from "../../composables/defaults.js";
 import { useGroup as t } from "../../composables/useGroup/index.js";
 import { useId as n } from "../../composables/useId/index.js";
-import { QField as r } from "../QField/index.js";
-import { computed as i, createBlock as a, createElementVNode as o, createSlots as s, defineComponent as c, mergeModels as l, mergeProps as u, normalizeClass as d, openBlock as f, renderSlot as p, toRef as m, unref as h, useModel as g, watch as _, withCtx as v } from "vue";
+import { mergeDescribedBy as r } from "../__internal__/QHelpPopover/resolveHelp.js";
+import { QField as i } from "../QField/index.js";
+import { computed as a, createBlock as o, createElementVNode as s, createSlots as c, defineComponent as l, mergeModels as u, mergeProps as d, normalizeClass as f, openBlock as p, renderSlot as m, toRef as h, unref as g, useAttrs as _, useModel as v, watch as y, withCtx as b } from "vue";
 //#region src/components/QRadioGroup/QRadioGroup.vue?vue&type=script&setup=true&lang.ts
-var y = ["id"], b = /*@__PURE__*/ c({
+var x = ["id", "aria-describedby"], S = /*@__PURE__*/ l({
 	inheritAttrs: !1,
 	__name: "QRadioGroup",
-	props: /*@__PURE__*/ l({
+	props: /*@__PURE__*/ u({
 		id: {},
 		class: {},
 		label: {},
 		required: { type: Boolean },
 		for: {},
 		labelPosition: { default: "topleft" },
+		help: {},
+		helpDisplay: {},
+		icons: {},
+		texts: {},
 		readonly: { type: Boolean },
 		disabled: { type: Boolean },
 		invalid: { type: Boolean },
@@ -30,50 +35,56 @@ var y = ["id"], b = /*@__PURE__*/ c({
 		modelModifiers: {}
 	}),
 	emits: ["update:modelValue"],
-	setup(c) {
-		let l = c, b = g(c, "modelValue"), { active: x } = t({
-			active: b,
+	setup(l) {
+		let u = l, S = v(l, "modelValue"), { active: C } = t({
+			active: S,
 			required: !0
 		});
-		_(x, (e) => {
-			b.value = e;
+		y(C, (e) => {
+			S.value = e;
 		});
-		let S = n(m(l, "id")), C = i(() => l.name ?? S.value), w = i(() => [
+		let w = n(h(u, "id")), T = _(), E = a(() => `${w.value}_field`), D = a(() => typeof T["aria-describedby"] == "string" ? T["aria-describedby"] : void 0), O = a(() => u.name ?? w.value), k = a(() => [
 			"q-radio-group",
 			{
-				"q-radio-group--horizontal": l.orientation === "horizontal",
-				"q-radio-group--focus-style": l.hasFocusOutline
+				"q-radio-group--horizontal": u.orientation === "horizontal",
+				"q-radio-group--focus-style": u.hasFocusOutline
 			},
-			l.class
-		]), T = i(() => l.columns > 1 ? { "--q-radio-group-columns": l.columns } : {});
+			u.class
+		]), A = a(() => u.columns > 1 ? { "--q-radio-group-columns": u.columns } : {});
 		return e({ QRadioButton: {
-			size: m(l, "size"),
-			disabled: m(l, "disabled"),
-			readonly: m(l, "readonly"),
-			invalid: m(l, "invalid"),
-			name: C
-		} }), (e, t) => (f(), a(h(r), {
-			for: h(S),
-			class: d(w.value),
-			label: l.label,
-			"label-position": l.labelPosition,
-			required: l.required,
-			readonly: l.readonly,
-			disabled: l.disabled,
-			invalid: l.invalid
-		}, s({
-			control: v(() => [o("div", u({
-				id: h(S),
-				class: ["q-radio-group__group", { "q-radio-group--grid": l.columns > 1 }],
+			size: h(u, "size"),
+			disabled: h(u, "disabled"),
+			readonly: h(u, "readonly"),
+			invalid: h(u, "invalid"),
+			name: O
+		} }), (e, t) => (p(), o(g(i), {
+			id: E.value,
+			for: g(w),
+			class: f(k.value),
+			label: u.label,
+			"label-position": u.labelPosition,
+			required: u.required,
+			readonly: u.readonly,
+			disabled: u.disabled,
+			invalid: u.invalid,
+			help: u.help,
+			"help-display": u.helpDisplay,
+			icons: u.icons,
+			texts: u.texts
+		}, c({
+			control: b(({ describedBy: t }) => [s("div", d({
+				id: g(w),
+				class: ["q-radio-group__group", { "q-radio-group--grid": u.columns > 1 }],
 				role: "radiogroup",
-				style: T.value
-			}, e.$attrs), [p(e.$slots, "default")], 16, y)]),
+				style: A.value
+			}, e.$attrs, { "aria-describedby": g(r)(t, D.value) }), [m(e.$slots, "default")], 16, x)]),
 			_: 2
 		}, [e.$slots.extras ? {
 			name: "extras",
-			fn: v(() => [p(e.$slots, "extras")]),
+			fn: b(() => [m(e.$slots, "extras")]),
 			key: "0"
 		} : void 0]), 1032, [
+			"id",
 			"for",
 			"class",
 			"label",
@@ -81,9 +92,13 @@ var y = ["id"], b = /*@__PURE__*/ c({
 			"required",
 			"readonly",
 			"disabled",
-			"invalid"
+			"invalid",
+			"help",
+			"help-display",
+			"icons",
+			"texts"
 		]));
 	}
 });
 //#endregion
-export { b as default };
+export { S as default };

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

@@ -1,7 +1,7 @@
 declare const QRadioButton: {
     new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('./types').QRadioButtonProps> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {
         color: string;
-        labelPlacement: import('./types').QRadioButtonLabelPlacement;
+        labelPlacement: import('../..').QSelectionLabelPlacement;
     }, false, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {
         inputEl: HTMLInputElement;
     }, any, import('vue').ComponentProvideOptions, {
@@ -13,14 +13,14 @@ declare const QRadioButton: {
         Defaults: {};
     }, Readonly<import('./types').QRadioButtonProps> & Readonly<{}>, {}, {}, {}, {}, {
         color: string;
-        labelPlacement: import('./types').QRadioButtonLabelPlacement;
+        labelPlacement: import('../..').QSelectionLabelPlacement;
     }>;
     __isFragment?: never;
     __isTeleport?: never;
     __isSuspense?: never;
 } & import('vue').ComponentOptionsBase<Readonly<import('./types').QRadioButtonProps> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {
     color: string;
-    labelPlacement: import('./types').QRadioButtonLabelPlacement;
+    labelPlacement: import('../..').QSelectionLabelPlacement;
 }, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
     $slots: {
         default?(_: {}): any;

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

@@ -1,4 +1,4 @@
-import { QComponentSize } from '../../types/component';
+import { QComponentSize, QSelectionLabelPlacement } from '../../types/component';
 import { QFieldProps } from '../QField';
 import { QLabelProps } from '../QLabel';
 export type QRadioButtonOrientation = 'vertical' | 'horizontal';
@@ -41,7 +41,6 @@ export type QRadioGroupProps = Omit<QFieldProps, 'size'> & {
      */
     hasFocusOutline?: boolean;
 };
-export type QRadioButtonLabelPlacement = 'start' | 'end';
 export type QRadioButtonProps = QLabelProps & {
     /**
      * Defined the value for the radio button.
@@ -60,9 +59,11 @@ export type QRadioButtonProps = QLabelProps & {
      *
      * @category Presentation
      */
-    labelPlacement?: QRadioButtonLabelPlacement;
+    labelPlacement?: QSelectionLabelPlacement;
     /**
-     * Applies specified color to the control.
+     * The color of the radio button.
+     * Can be chosen from utility colors like 'success' or 'danger',
+     * or specified using CSS color codes.
      *
      * @category Presentation
      */

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

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/QRadioGroup/types.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAA;AAC3D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,WAAW,CAAA;AAC5C,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,WAAW,CAAA;AAE5C,MAAM,MAAM,uBAAuB,GAAG,UAAU,GAAG,YAAY,CAAA;AAE/D;;;;GAIG;AACH,MAAM,MAAM,gBAAgB,GAAG,IAAI,CAAC,WAAW,EAAE,MAAM,CAAC,GAAG;IAC1D;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,CAAA;IAEb;;;;OAIG;IACH,WAAW,CAAC,EAAE,uBAAuB,CAAA;IAErC;;;;;;OAMG;IACH,IAAI,CAAC,EAAE,cAAc,CAAA;IAErB;;;;OAIG;IACH,OAAO,CAAC,EAAE,MAAM,CAAA;IAEhB;;;;OAIG;IACH,eAAe,CAAC,EAAE,OAAO,CAAA;CACzB,CAAA;AAED,MAAM,MAAM,0BAA0B,GAAG,OAAO,GAAG,KAAK,CAAA;AAExD,MAAM,MAAM,iBAAiB,GAAG,WAAW,GAAG;IAC7C;;;;OAIG;IACH,KAAK,EAAE,MAAM,CAAA;IAEb;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,CAAA;IAEb;;;;OAIG;IACH,cAAc,CAAC,EAAE,0BAA0B,CAAA;IAE3C;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAA;IAEd;;;;;OAKG;IACH,IAAI,CAAC,EAAE,cAAc,CAAA;IAErB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAElB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAElB;;;;OAIG;IACH,OAAO,CAAC,EAAE,OAAO,CAAA;CACjB,CAAA"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/QRadioGroup/types.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,wBAAwB,EAAE,MAAM,uBAAuB,CAAA;AACrF,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,WAAW,CAAA;AAC5C,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,WAAW,CAAA;AAE5C,MAAM,MAAM,uBAAuB,GAAG,UAAU,GAAG,YAAY,CAAA;AAE/D;;;;GAIG;AACH,MAAM,MAAM,gBAAgB,GAAG,IAAI,CAAC,WAAW,EAAE,MAAM,CAAC,GAAG;IAC1D;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,CAAA;IAEb;;;;OAIG;IACH,WAAW,CAAC,EAAE,uBAAuB,CAAA;IAErC;;;;;;OAMG;IACH,IAAI,CAAC,EAAE,cAAc,CAAA;IAErB;;;;OAIG;IACH,OAAO,CAAC,EAAE,MAAM,CAAA;IAEhB;;;;OAIG;IACH,eAAe,CAAC,EAAE,OAAO,CAAA;CACzB,CAAA;AAED,MAAM,MAAM,iBAAiB,GAAG,WAAW,GAAG;IAC7C;;;;OAIG;IACH,KAAK,EAAE,MAAM,CAAA;IAEb;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,CAAA;IAEb;;;;OAIG;IACH,cAAc,CAAC,EAAE,wBAAwB,CAAA;IAEzC;;;;;;OAMG;IACH,KAAK,CAAC,EAAE,MAAM,CAAA;IAEd;;;;;OAKG;IACH,IAAI,CAAC,EAAE,cAAc,CAAA;IAErB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAElB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAElB;;;;OAIG;IACH,OAAO,CAAC,EAAE,OAAO,CAAA;CACjB,CAAA"}

package/esm/components/QSection/QSection.d.ts

@@ -1,3 +1,4 @@
+import { DEFAULT_ICONS, DEFAULT_TEXTS } from './constants';
 import { QSectionProps } from '.';
 declare function __VLS_template(): {
     attrs: Partial<{}>;
@@ -6,13 +7,20 @@ declare function __VLS_template(): {
         'title.append'?(_: {}): any;
         default?(_: {}): any;
     };
-    refs: {};
-    rootEl: HTMLDivElement;
+    refs: {
+        titleEl: HTMLDivElement;
+    };
+    rootEl: any;
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
 declare const __VLS_component: import('vue').DefineComponent<QSectionProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<QSectionProps> & Readonly<{}>, {
     variant: import('./types').QSectionVariant;
-}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+    icons: typeof DEFAULT_ICONS;
+    texts: typeof DEFAULT_TEXTS;
+    helpDisplay: import('../..').QHelpDisplay;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
+    titleEl: HTMLDivElement;
+}, any>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {

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

@@ -1 +1 @@
-{"version":3,"file":"QSection.vue.d.ts","sourceRoot":"","sources":["../../../src/components/QSection/QSection.vue"],"names":[],"mappings":"AAkBA;AAwDC,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,GAAG,CAAA;AAgCvC,iBAAS,cAAc;WAwCT,OAAO,IAA6B;;iCAZb,GAAG;gCACJ,GAAG;yBACV,GAAG;;;;EAe/B;AAWD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;wFAQnB,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"}
+{"version":3,"file":"QSection.vue.d.ts","sourceRoot":"","sources":["../../../src/components/QSection/QSection.vue"],"names":[],"mappings":"AAgDA;AA4IC,OAAO,EAAE,aAAa,EAAE,aAAa,EAAE,MAAM,aAAa,CAAA;AAW1D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,GAAG,CAAA;AAoFvC,iBAAS,cAAc;WAgGT,OAAO,IAA6B;;iCAdb,GAAG;gCACJ,GAAG;yBACT,GAAG;;;;;;EAiBhC;AAsBD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;;;;OAQnB,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/QSection/QSection.vue.js

@@ -1,38 +1,93 @@
 import { useId as e } from "../../composables/useId/index.js";
-import { computed as t, createCommentVNode as n, createElementBlock as r, createElementVNode as i, createTextVNode as a, defineComponent as o, normalizeClass as s, openBlock as c, renderSlot as l, toDisplayString as u, toRef as d, unref as f } from "vue";
+import { useColor as t } from "../../composables/useColor/index.js";
+import { QHelpPopover as n } from "../__internal__/QHelpPopover/index.js";
+import { QTooltip as r } from "../QTooltip/index.js";
+import { describedHelpText as i, helpElementId as a, mergeDescribedBy as o, resolveHelp as s } from "../__internal__/QHelpPopover/resolveHelp.js";
+import { DEFAULT_ICONS as c, DEFAULT_TEXTS as l } from "./constants.js";
+import { computed as u, createBlock as d, createCommentVNode as f, createElementBlock as p, createElementVNode as m, createTextVNode as h, defineComponent as g, mergeProps as _, openBlock as v, renderSlot as y, toDisplayString as b, toRef as x, unref as S, useAttrs as C, useTemplateRef as w } from "vue";
 //#region src/components/QSection/QSection.vue?vue&type=script&setup=true&lang.ts
-var p = ["id"], m = {
-	key: 0,
-	class: "q-section__title"
-}, h = { class: "q-section__content" }, g = /*@__PURE__*/ o({
+var T = [
+	"id",
+	"role",
+	"aria-labelledby",
+	"aria-describedby"
+], E = ["id"], D = ["id"], O = ["id"], k = { class: "q-section__content" }, A = /*@__PURE__*/ g({
+	inheritAttrs: !1,
 	__name: "QSection",
 	props: {
 		id: {},
 		class: {},
 		title: {},
+		help: {},
+		helpDisplay: { default: "popover" },
 		borderless: { type: Boolean },
 		variant: { default: "default" },
-		block: { type: Boolean }
+		block: { type: Boolean },
+		icons: { default: () => c },
+		texts: { default: () => l }
 	},
-	setup(o) {
-		let g = o, _ = e(d(g, "id")), v = t(() => [
+	setup(c) {
+		let l = c, g = e(x(l, "id")), { style: A } = t("primary"), j = u(() => ({ "--q-section-tint-color-rgb": A.value?.tintColorRgb })), M = C(), N = u(() => typeof M["aria-describedby"] == "string" ? M["aria-describedby"] : void 0), P = u(() => `${g.value}_title`), F = w("titleEl"), I = u(() => a(g.value)), L = u(() => s({
+			help: l.title ? l.help : void 0,
+			helpDisplay: l.helpDisplay
+		})), R = u(() => i(L.value)), z = u(() => L.value.inlineText || R.value ? I.value : void 0), B = u(() => [
 			"q-section",
-			g.variant === "default" ? void 0 : `q-section--${g.variant}`,
+			l.variant === "default" ? void 0 : `q-section--${l.variant}`,
 			{
-				"q-section--block": g.block,
-				"q-section--borderless": g.borderless
+				"q-section--block": l.block,
+				"q-section--borderless": l.borderless
 			},
-			g.class
+			l.class
 		]);
-		return (e, t) => (c(), r("div", {
-			id: f(_),
-			class: s(v.value)
-		}, [g.title ? (c(), r("div", m, [
-			l(e.$slots, "title.prepend"),
-			a(" " + u(g.title) + " ", 1),
-			l(e.$slots, "title.append")
-		])) : n("v-if", !0), i("div", h, [l(e.$slots, "default")])], 10, p));
+		return (e, t) => (v(), p("div", _({
+			id: S(g),
+			class: B.value,
+			style: j.value,
+			role: l.title ? "group" : void 0,
+			"aria-labelledby": l.title ? P.value : void 0
+		}, e.$attrs, { "aria-describedby": S(o)(z.value, N.value) }), [
+			l.title ? (v(), p("div", {
+				key: 0,
+				id: P.value,
+				ref_key: "titleEl",
+				ref: F,
+				class: "q-section__title"
+			}, [
+				y(e.$slots, "title.prepend"),
+				h(" " + b(l.title) + " ", 1),
+				y(e.$slots, "title.append"),
+				L.value.popoverText ? (v(), d(S(n), {
+					key: 0,
+					label: l.title,
+					text: L.value.popoverText,
+					icons: l.icons,
+					texts: l.texts
+				}, null, 8, [
+					"label",
+					"text",
+					"icons",
+					"texts"
+				])) : f("v-if", !0)
+			], 8, E)) : f("v-if", !0),
+			L.value.tooltipText && F.value ? (v(), d(S(r), {
+				key: 1,
+				anchor: F.value,
+				text: L.value.tooltipText,
+				html: !1
+			}, null, 8, ["anchor", "text"])) : f("v-if", !0),
+			L.value.inlineText ? (v(), p("p", {
+				key: 2,
+				id: I.value,
+				class: "q-section__subtitle"
+			}, b(L.value.inlineText), 9, D)) : f("v-if", !0),
+			R.value ? (v(), p("span", {
+				key: 3,
+				id: I.value,
+				class: "q-sr-only"
+			}, b(R.value), 9, O)) : f("v-if", !0),
+			m("div", k, [y(e.$slots, "default")])
+		], 16, T));
 	}
 });
 //#endregion
-export { g as default };
+export { A as default };

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

@@ -0,0 +1,11 @@
+/** Default icons for {@link QSection}. Includes the help popover icon. */
+export declare const DEFAULT_ICONS: {
+    help: {
+        icon: string;
+    };
+};
+/** Default accessible strings for {@link QSection}. Includes the help button label. */
+export declare const DEFAULT_TEXTS: {
+    showHelp: string;
+};
+//# sourceMappingURL=constants.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../../src/components/QSection/constants.ts"],"names":[],"mappings":"AASA,0EAA0E;AAC1E,eAAO,MAAM,aAAa;;;;CAEY,CAAA;AAEtC,uFAAuF;AACvF,eAAO,MAAM,aAAa;;CAEQ,CAAA"}

package/esm/components/QSection/constants.js

@@ -0,0 +1,5 @@
+import { DEFAULT_ICONS as e, DEFAULT_TEXTS as t } from "../__internal__/QHelpPopover/constants.js";
+//#region src/components/QSection/constants.ts
+var n = { ...e }, r = { ...t };
+//#endregion
+export { n as DEFAULT_ICONS, r as DEFAULT_TEXTS };

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

@@ -1,7 +1,12 @@
 declare const QSection: {
     new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('./types').QSectionProps> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {
         variant: import('./types').QSectionVariant;
-    }, false, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, HTMLDivElement, import('vue').ComponentProvideOptions, {
+        icons: typeof import('./constants').DEFAULT_ICONS;
+        texts: typeof import('./constants').DEFAULT_TEXTS;
+        helpDisplay: import('../..').QHelpDisplay;
+    }, false, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {
+        titleEl: HTMLDivElement;
+    }, any, import('vue').ComponentProvideOptions, {
         P: {};
         B: {};
         D: {};
@@ -10,12 +15,18 @@ declare const QSection: {
         Defaults: {};
     }, Readonly<import('./types').QSectionProps> & Readonly<{}>, {}, {}, {}, {}, {
         variant: import('./types').QSectionVariant;
+        icons: typeof import('./constants').DEFAULT_ICONS;
+        texts: typeof import('./constants').DEFAULT_TEXTS;
+        helpDisplay: import('../..').QHelpDisplay;
     }>;
     __isFragment?: never;
     __isTeleport?: never;
     __isSuspense?: never;
 } & import('vue').ComponentOptionsBase<Readonly<import('./types').QSectionProps> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {
     variant: import('./types').QSectionVariant;
+    icons: typeof import('./constants').DEFAULT_ICONS;
+    texts: typeof import('./constants').DEFAULT_TEXTS;
+    helpDisplay: import('../..').QHelpDisplay;
 }, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
     $slots: {
         'title.prepend'?(_: {}): any;

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/QSection/index.ts"],"names":[],"mappings":"AAMA,QAAA,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;EAA6B,CAAA;AAG3C,OAAO,EAAE,QAAQ,EAAE,CAAA;AAGnB,cAAc,SAAS,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/QSection/index.ts"],"names":[],"mappings":"AAMA,QAAA,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAA6B,CAAA;AAG3C,OAAO,EAAE,QAAQ,EAAE,CAAA;AAGnB,cAAc,SAAS,CAAA"}

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

@@ -1,4 +1,6 @@
 import { QBaseComponentProps } from '../../types/component';
+import { DEFAULT_ICONS, DEFAULT_TEXTS } from './constants';
+import { QHelpDisplay } from '../../types';
 /**
  * QSection visual style variants.
  */
@@ -10,6 +12,29 @@ export type QSectionProps = QBaseComponentProps & {
      * @category Content
      */
     title?: string;
+    /**
+     * Help text. Plain text only. One display at a time.
+     *
+     * Help needs a `title`, which labels the popover and anchors the tooltip. Without a title,
+     * no help is shown, whatever the display.
+     *
+     * Tooltip and popover help is also exposed to assistive tech on the section, as its
+     * description. The section is a named group, labeled by its title.
+     *
+     * @category Content
+     */
+    help?: string;
+    /**
+     * How {@link QSectionProps.help} is presented. Defaults to a popover.
+     *
+     * A tooltip opens on hover, or on focus inside the title, which only happens when a
+     * `title.append` control takes focus. On a section it is therefore pointer-only for sighted
+     * users, and `popover` or `subtext` suit keyboard users better. Screen readers get the help
+     * as the section's description in every display.
+     *
+     * @category Presentation
+     */
+    helpDisplay?: QHelpDisplay;
     /**
      * If true, the section has no borders.
      *
@@ -28,5 +53,19 @@ export type QSectionProps = QBaseComponentProps & {
      * @category Presentation
      */
     block?: boolean;
+    /**
+     * Icon overrides. Includes the help popover icon, `help`.
+     * Pass every key, or omit the prop to keep the defaults.
+     *
+     * @category Configuration
+     */
+    icons?: typeof DEFAULT_ICONS;
+    /**
+     * Accessible text overrides. Includes the help button label, `showHelp`.
+     * Pass every key, or omit the prop to keep the defaults.
+     *
+     * @category Configuration
+     */
+    texts?: typeof DEFAULT_TEXTS;
 };
 //# sourceMappingURL=types.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/QSection/types.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAA;AAEhE;;GAEG;AACH,MAAM,MAAM,eAAe,GACxB,SAAS,GACT,YAAY,GACZ,OAAO,GACP,kBAAkB,GAClB,kBAAkB,CAAA;AAErB,MAAM,MAAM,aAAa,GAAG,mBAAmB,GAAG;IACjD;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAA;IAEd;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAA;IAEpB;;;;OAIG;IACH,OAAO,CAAC,EAAE,eAAe,CAAA;IAEzB;;;;OAIG;IACH,KAAK,CAAC,EAAE,OAAO,CAAA;CACf,CAAA"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/QSection/types.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAA;AAChE,OAAO,KAAK,EAAE,aAAa,EAAE,aAAa,EAAE,MAAM,aAAa,CAAA;AAC/D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAA;AAE/C;;GAEG;AACH,MAAM,MAAM,eAAe,GACxB,SAAS,GACT,YAAY,GACZ,OAAO,GACP,kBAAkB,GAClB,kBAAkB,CAAA;AAErB,MAAM,MAAM,aAAa,GAAG,mBAAmB,GAAG;IACjD;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAA;IAEd;;;;;;;;;;OAUG;IACH,IAAI,CAAC,EAAE,MAAM,CAAA;IAEb;;;;;;;;;OASG;IACH,WAAW,CAAC,EAAE,YAAY,CAAA;IAE1B;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAA;IAEpB;;;;OAIG;IACH,OAAO,CAAC,EAAE,eAAe,CAAA;IAEzB;;;;OAIG;IACH,KAAK,CAAC,EAAE,OAAO,CAAA;IAEf;;;;;OAKG;IACH,KAAK,CAAC,EAAE,OAAO,aAAa,CAAA;IAE5B;;;;;OAKG;IACH,KAAK,CAAC,EAAE,OAAO,aAAa,CAAA;CAC5B,CAAA"}