bitboss-ui 3.0.0-beta.65 → 3.0.0-beta.67

package/dist/components/BbTree/types.js

@@ -1,7 +1,8 @@
-//#region src/components/BbTree/types.ts
+// src/components/BbTree/types.ts
 var e = {
 	parts: ["root", "item"],
-	states: ["expanded"]
+	states: ["expanded"],
+	wide: [],
+	node: { item: ["expanded"] }
 };
-//#endregion
 export { e as BB_TREE_PT };

package/dist/components/ChipsBox/ChipsBox.vue.js

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

package/dist/components/ChipsBox/ChipsBox.vue_vue_type_script_setup_true_lang.js

@@ -1,8 +1,8 @@
-import { isNil as e } from "../../utilities/functions/isNil.js";
-import { hash as t } from "../../utilities/functions/hash.js";
+import { hash as e } from "../../utilities/functions/hash.js";
+import { isNil as t } from "../../utilities/functions/isNil.js";
 import n from "../BbBadge/BbBadge.vue.js";
 import { Fragment as r, computed as i, createBlock as a, createElementBlock as o, createElementVNode as s, createTextVNode as c, defineComponent as l, mergeProps as u, openBlock as d, ref as f, renderList as p, toDisplayString as m, watch as h, withCtx as g, withModifiers as _ } from "vue";
-//#region src/components/ChipsBox/ChipsBox.vue?vue&type=script&setup=true&lang.ts
+// src/components/ChipsBox/ChipsBox.vue?vue&type=script&setup=true&lang.ts
 var v = {
 	class: "bb-sr-only",
 	role: "status"
@@ -16,17 +16,17 @@ var v = {
 	},
 	emits: ["option:unselected"],
 	setup(l, { expose: y, emit: b }) {
-		let x = l, S = b, C = f(null), w = (e) => !x.disabled && e === C.value, T = i(() => x.options.some((e) => !e.disabled)), E = (t = 1) => {
-			let n = e(C.value) ? -1 : C.value, r = (n + t) % x.options.length;
-			for (; x.options[r].disabled && r !== n;) r = E(t + 1);
+		let x = l, S = b, C = f(null), w = (e) => !x.disabled && e === C.value, T = i(() => x.options.some((e) => !e.disabled)), E = (e = 1) => {
+			let n = t(C.value) ? -1 : C.value, r = (n + e) % x.options.length;
+			for (; x.options[r].disabled && r !== n;) r = E(e + 1);
 			return r;
 		}, D = () => {
 			if (!T.value) return;
 			let e = E();
 			C.value = e;
-		}, O = (t = 1) => {
-			let n = e(C.value) ? 0 : C.value, r = (n - t + x.options.length) % x.options.length;
-			for (; x.options[r].disabled && r !== n;) r = O(t + 1);
+		}, O = (e = 1) => {
+			let n = t(C.value) ? 0 : C.value, r = (n - e + x.options.length) % x.options.length;
+			for (; x.options[r].disabled && r !== n;) r = O(e + 1);
 			return r;
 		}, k = async () => {
 			if (!T.value) return;
@@ -60,9 +60,9 @@ var v = {
 			t >= 0 && (C.value = t);
 		}, F = () => {
 			C.value = null;
-		}, I = i(() => x.disabled || e(C.value) ? "" : x.options[C.value]?.text ?? "");
-		return h(() => x.options, (e, n) => {
-			t(e) !== t(n) && F();
+		}, I = i(() => x.disabled || t(C.value) ? "" : x.options[C.value]?.text ?? "");
+		return h(() => x.options, (t, n) => {
+			e(t) !== e(n) && F();
 		}, { flush: "post" }), y({
 			focusNext: D,
 			focusPrevious: k,
@@ -72,24 +72,23 @@ var v = {
 			focusLastSelected: N,
 			blur: F,
 			confirmOption: () => {
-				if (e(C.value)) return;
-				let t = x.options[C.value];
-				t.selected && S("option:unselected", t);
+				if (t(C.value)) return;
+				let e = x.options[C.value];
+				e.selected && S("option:unselected", e);
 			},
 			focusByHash: P,
 			getHighlighted: () => {
-				if (!e(C.value)) return x.options[C.value];
+				if (!t(C.value)) return x.options[C.value];
 			}
-		}), (e, t) => (d(), o(r, null, [(d(!0), o(r, null, p(e.options, (t, r) => (d(), a(n, u({
-			key: t.valueHash,
-			class: ["bb-tag__badge", { "bb-badge--highlighted": w(r) }],
-			clearable: !e.disabled,
-			size: e.size,
+		}), (e, t) => (d(), o(r, null, [(d(!0), o(r, null, p(l.options, (e, t) => (d(), a(n, u({
+			key: e.valueHash,
+			class: ["bb-tag__badge", { "bb-badge--highlighted": w(t) }],
+			clearable: !l.disabled,
+			size: l.size,
 			variant: "secondary",
-			"onClick:clear": _((e) => S("option:unselected", t), ["stop"]),
-			ref_for: !0
-		}, e.passthrough?.part?.("badge", { highlighted: w(r) }, t.item)), {
-			default: g(() => [c(m(t.text), 1)]),
+			"onClick:clear": _((t) => S("option:unselected", e), ["stop"])
+		}, { ref_for: !0 }, l.passthrough?.part?.("badge", { highlighted: w(t) }, e.item)), {
+			default: g(() => [c(m(e.text), 1)]),
 			_: 2
 		}, 1040, [
 			"class",
@@ -99,5 +98,4 @@ var v = {
 		]))), 128)), s("span", v, m(I.value), 1)], 64));
 	}
 });
-//#endregion
 export { y as default };

package/dist/components/ClearableButton/ClearableButton.vue.d.ts

@@ -1,4 +1,6 @@
+import { FallthroughAttrs } from '../../types/fallthrough';
 import { ClearableButtonProps } from './types';
-declare const __VLS_export: import('vue').DefineComponent<ClearableButtonProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<ClearableButtonProps> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+type __VLS_Props = ClearableButtonProps & FallthroughAttrs<'button', ClearableButtonProps>;
+declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/components/ClearableButton/ClearableButton.vue.js

@@ -1,6 +1,5 @@
 import e from "./ClearableButton.vue_vue_type_script_setup_true_lang.js";
 /* empty css                                                        */
-//#region src/components/ClearableButton/ClearableButton.vue
+// src/components/ClearableButton/ClearableButton.vue
 var t = e;
-//#endregion
 export { t as default };

package/dist/components/ClearableButton/ClearableButton.vue_vue_type_script_setup_true_lang.js

@@ -2,7 +2,7 @@ import { useLocale as e } from "../../composables/useLocale.js";
 import t from "../BbIcon/BbIcon.vue.js";
 import n from "../../assets/svgs/clear.svg_raw.js";
 import { createElementBlock as r, createVNode as i, defineComponent as a, openBlock as o, unref as s } from "vue";
-//#region src/components/ClearableButton/ClearableButton.vue?vue&type=script&setup=true&lang.ts
+// src/components/ClearableButton/ClearableButton.vue?vue&type=script&setup=true&lang.ts
 var c = ["aria-label"], l = /*@__PURE__*/ a({
 	__name: "ClearableButton",
 	props: { label: {} },
@@ -15,5 +15,4 @@ var c = ["aria-label"], l = /*@__PURE__*/ a({
 		}, [i(t, { icon: s(n) }, null, 8, ["icon"])], 8, c));
 	}
 });
-//#endregion
 export { l as default };

package/dist/components/CloseIcon/CloseButton.vue.d.ts

@@ -1,5 +1,7 @@
+import { FallthroughAttrs } from '../../types/fallthrough';
 import { CloseButtonProps, CloseButtonEvents } from './types';
 export type { CloseButtonProps, CloseButtonEvents };
-declare const __VLS_export: import('vue').DefineComponent<CloseButtonProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<CloseButtonProps> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+type __VLS_Props = CloseButtonProps & FallthroughAttrs<'button', CloseButtonProps, CloseButtonEvents>;
+declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/components/CloseIcon/CloseButton.vue.js

@@ -1,7 +1,6 @@
 import e from "./CloseButton.vue_vue_type_script_setup_true_lang.js";
 /* empty css                                                                */
 import t from "../../_virtual/_plugin-vue_export-helper.js";
-//#region src/components/CloseIcon/CloseButton.vue
-var n = /*#__PURE__*/ t(e, [["__scopeId", "data-v-e1096a83"]]);
-//#endregion
+// src/components/CloseIcon/CloseButton.vue
+var n = /*#__PURE__*/ t(e, [["__scopeId", "data-v-eeccc0fb"]]);
 export { n as default };

package/dist/components/CloseIcon/CloseButton.vue_vue_type_script_setup_true_lang.js

@@ -1,12 +1,12 @@
 import { createElementBlock as e, createElementVNode as t, defineComponent as n, openBlock as r } from "vue";
-//#region src/components/CloseIcon/CloseButton.vue?vue&type=script&setup=true&lang.ts
+// src/components/CloseIcon/CloseButton.vue?vue&type=script&setup=true&lang.ts
 var i = {
 	class: "bb-close-button",
 	type: "button"
 }, a = /*@__PURE__*/ n({
 	__name: "CloseButton",
 	setup(n) {
-		return (n, a) => (r(), e("button", i, a[0] ||= [t("svg", {
+		return (n, a) => (r(), e("button", i, [...a[0] ||= [t("svg", {
 			"aria-hidden": "true",
 			fill: "none",
 			viewBox: "0 0 24 24",
@@ -16,8 +16,7 @@ var i = {
 			stroke: "currentColor",
 			"stroke-linecap": "round",
 			"stroke-width": "3"
-		})], -1)]));
+		})], -1)]]));
 	}
 });
-//#endregion
 export { a as default };

package/dist/components/CommaBox/CommaBox.vue.js

@@ -1,6 +1,5 @@
 import e from "./CommaBox.vue_vue_type_script_setup_true_lang.js";
 /* empty css                                                 */
-//#region src/components/CommaBox/CommaBox.vue
+// src/components/CommaBox/CommaBox.vue
 var t = e;
-//#endregion
 export { t as default };

package/dist/components/CommaBox/CommaBox.vue_vue_type_script_setup_true_lang.js

@@ -1,7 +1,7 @@
-import { isNil as e } from "../../utilities/functions/isNil.js";
-import { hash as t } from "../../utilities/functions/hash.js";
+import { hash as e } from "../../utilities/functions/hash.js";
+import { isNil as t } from "../../utilities/functions/isNil.js";
 import { Fragment as n, computed as r, createElementBlock as i, createElementVNode as a, defineComponent as o, mergeProps as s, openBlock as c, ref as l, renderList as u, toDisplayString as d, watch as f } from "vue";
-//#region src/components/CommaBox/CommaBox.vue?vue&type=script&setup=true&lang.ts
+// src/components/CommaBox/CommaBox.vue?vue&type=script&setup=true&lang.ts
 var p = {
 	class: "bb-sr-only",
 	role: "status"
@@ -13,17 +13,17 @@ var p = {
 	},
 	emits: ["option:unselected"],
 	setup(o, { expose: m, emit: h }) {
-		let g = o, _ = h, v = l(null), y = r(() => g.options.some((e) => !e.disabled)), b = (t = 1) => {
-			let n = e(v.value) ? -1 : v.value, r = (n + t) % g.options.length;
-			for (; g.options[r].disabled && r !== n;) r = b(t + 1);
+		let g = o, _ = h, v = l(null), y = r(() => g.options.some((e) => !e.disabled)), b = (e = 1) => {
+			let n = t(v.value) ? -1 : v.value, r = (n + e) % g.options.length;
+			for (; g.options[r].disabled && r !== n;) r = b(e + 1);
 			return r;
 		}, x = () => {
 			if (!y.value) return;
 			let e = b();
 			v.value = e;
-		}, S = (t = 1) => {
-			let n = e(v.value) ? 0 : v.value, r = (n - t + g.options.length) % g.options.length;
-			for (; g.options[r].disabled && r !== n;) r = S(t + 1);
+		}, S = (e = 1) => {
+			let n = t(v.value) ? 0 : v.value, r = (n - e + g.options.length) % g.options.length;
+			for (; g.options[r].disabled && r !== n;) r = S(e + 1);
 			return r;
 		}, C = async () => {
 			if (!y.value) return;
@@ -57,9 +57,9 @@ var p = {
 			t >= 0 && (v.value = t);
 		}, k = () => {
 			v.value = null;
-		}, A = r(() => e(v.value) ? "" : g.options[v.value]?.text ?? "");
-		return f(() => g.options, (e, n) => {
-			t(e) !== t(n) && k();
+		}, A = r(() => t(v.value) ? "" : g.options[v.value]?.text ?? "");
+		return f(() => g.options, (t, n) => {
+			e(t) !== e(n) && k();
 		}, { flush: "post" }), m({
 			focusNext: x,
 			focusPrevious: C,
@@ -69,20 +69,18 @@ var p = {
 			focusLastSelected: D,
 			blur: k,
 			confirmOption: () => {
-				if (e(v.value)) return;
-				let t = g.options[v.value];
-				t.selected && _("option:unselected", t);
+				if (t(v.value)) return;
+				let e = g.options[v.value];
+				e.selected && _("option:unselected", e);
 			},
 			focusByHash: O,
 			getHighlighted: () => {
-				if (!e(v.value)) return g.options[v.value];
+				if (!t(v.value)) return g.options[v.value];
 			}
-		}), (e, t) => (c(), i(n, null, [(c(!0), i(n, null, u(e.options, (t, n) => (c(), i("span", s({
-			key: t.valueHash,
-			class: ["bb-tag__comma", { "bb-tag__comma--highlighted": n === v.value }],
-			ref_for: !0
-		}, e.passthrough?.part?.("comma", { highlighted: n === v.value }, t.item)), d(t.text), 17))), 128)), a("span", p, d(A.value), 1)], 64));
+		}), (e, t) => (c(), i(n, null, [(c(!0), i(n, null, u(o.options, (e, t) => (c(), i("span", s({
+			key: e.valueHash,
+			class: ["bb-tag__comma", { "bb-tag__comma--highlighted": t === v.value }]
+		}, { ref_for: !0 }, o.passthrough?.part?.("comma", { highlighted: t === v.value }, e.item)), d(e.text), 17))), 128)), a("span", p, d(A.value), 1)], 64));
 	}
 });
-//#endregion
 export { m as default };

package/dist/components/CommonField/CommonField.vue.d.ts

@@ -1,7 +1,9 @@
+import { FallthroughAttrs } from '../../types/fallthrough';
 import { FieldLayout } from '../../types/FieldLayout';
 import { CommonFieldProps, CommonFieldSlots } from './types';
+type __VLS_Props = CommonFieldProps & FallthroughAttrs<'div', CommonFieldProps>;
 type __VLS_Slots = CommonFieldSlots;
-declare const __VLS_base: import('vue').DefineComponent<CommonFieldProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<CommonFieldProps> & Readonly<{}>, {
+declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
     reverse: boolean;
     tag: import('../../types/CommonProps').ContainerTag;
     layout: import('../../types/ResponsiveSize').Responsive<FieldLayout>;

package/dist/components/CommonField/CommonField.vue.js

@@ -1,6 +1,5 @@
 import e from "./CommonField.vue_vue_type_script_setup_true_lang.js";
 /* empty css                                                    */
-//#region src/components/CommonField/CommonField.vue
+// src/components/CommonField/CommonField.vue
 var t = e;
-//#endregion
 export { t as default };

package/dist/components/CommonField/CommonField.vue_vue_type_script_setup_true_lang.js

@@ -1,13 +1,13 @@
-import { useLogger as e } from "../../composables/useLogger.js";
-import { useId as t } from "../../composables/useId.js";
+import { SsrMarker as e } from "../../composables/ssrMarker.js";
+import { deburr as t } from "../../utilities/functions/deburr.js";
+import { getAsPercentage as n } from "../../utilities/functions/percentage.js";
 import "../../utilities/functions/noop.js";
-import { SsrMarker as n } from "../../composables/ssrMarker.js";
-import { getAsPercentage as r } from "../../utilities/functions/percentage.js";
-import i from "../BbAsterisk/BbAsterisk.vue.js";
-import { deburr as a } from "../../utilities/functions/deburr.js";
-import { FIELD_CROSS_ALIGNS as o } from "../../types/FieldLayout.js";
-import { Fragment as s, Transition as c, computed as l, createBlock as u, createCommentVNode as d, createElementBlock as f, createElementVNode as p, createTextVNode as m, createVNode as h, defineComponent as g, guardReactiveProps as _, mergeProps as v, normalizeClass as y, normalizeProps as b, onBeforeUnmount as ee, openBlock as x, renderList as te, renderSlot as S, resolveDynamicComponent as C, shallowRef as ne, toDisplayString as w, unref as T, useSlots as re, useTemplateRef as E, vShow as D, watch as ie, withCtx as O, withDirectives as ae } from "vue";
-//#region src/components/CommonField/CommonField.vue?vue&type=script&setup=true&lang.ts
+import { useId as r } from "../../composables/useId.js";
+import { useLogger as i } from "../../composables/useLogger.js";
+import { FIELD_CROSS_ALIGNS as a } from "../../types/FieldLayout.js";
+import o from "../BbAsterisk/BbAsterisk.vue.js";
+import { Fragment as s, Transition as c, computed as l, createBlock as u, createCommentVNode as d, createElementBlock as f, createElementVNode as p, createTextVNode as m, createVNode as h, defineComponent as g, guardReactiveProps as _, mergeProps as v, normalizeClass as y, normalizeProps as b, onBeforeUnmount as ee, openBlock as x, renderList as S, renderSlot as C, resolveDynamicComponent as te, shallowRef as ne, toDisplayString as w, unref as T, useSlots as re, useTemplateRef as E, vShow as D, watch as ie, withCtx as O, withDirectives as ae } from "vue";
+// src/components/CommonField/CommonField.vue?vue&type=script&setup=true&lang.ts
 var oe = {
 	key: 1,
 	class: "bb-field__meta"
@@ -56,14 +56,14 @@ var oe = {
 		tag: { default: "span" }
 	},
 	setup(g) {
-		let k = g, fe = re(), pe = e(), me = [
+		let k = g, fe = re(), pe = i(), me = [
 			"default",
 			"sm",
 			"md",
 			"lg",
 			"xl",
 			"2xl"
-		], he = t().id.value, A = k.id || he, j = `counter_${A}`, M = l(() => k.hint ? `hint_${A}` : void 0), N = l(() => k.showHint && !!k.hint), P = () => !!k.description || !!fe.description, F = `description_${A}`, I = `errors_${A}`, L = `warnings_${A}`, R = `${A}__label`, z = () => P() ? R : void 0, B = l(() => k.labelMode === "floating" || k.labelMode === "inside"), V = l(() => {
+		], he = r().id.value, A = k.id || he, j = `counter_${A}`, M = l(() => k.hint ? `hint_${A}` : void 0), N = l(() => k.showHint && !!k.hint), P = () => !!k.description || !!fe.description, F = `description_${A}`, I = `errors_${A}`, L = `warnings_${A}`, R = `${A}__label`, z = () => P() ? R : void 0, B = l(() => k.labelMode === "floating" || k.labelMode === "inside"), V = l(() => {
 			let e = k.layout;
 			return B.value || typeof e != "object" || !e ? null : me.flatMap((t) => {
 				let n = t === "default" ? e.default ?? "vertical" : e[t];
@@ -75,75 +75,77 @@ var oe = {
 			"vertical",
 			"label-fill",
 			"input-fill"
-		], U = (e) => /^[\S]+\s[\S]+$/.test(e), W = (e) => ge.includes(e) ? e : U(e) ? "ratio" : "auto", G = l(() => W(H.value)), _e = l(() => G.value === "horizontal" || G.value === "ratio"), ve = l(() => k.inputPosition ?? (_e.value ? "right" : "left")), K = (e) => (V.value || G.value !== "vertical") && o.includes(e) ? e : void 0, q = l(() => K(k.labelAlign)), J = l(() => K(k.inputAlign)), ye = l(() => k.name ? k.name : a(k.label).replace(/\s+/g, "").toLowerCase()), be = () => {
+		], U = (e) => /^[\S]+\s[\S]+$/.test(e), W = (e) => ge.includes(e) ? e : U(e) ? "ratio" : "auto", G = l(() => W(H.value)), _e = l(() => G.value === "horizontal" || G.value === "ratio"), ve = l(() => k.inputPosition ?? (_e.value ? "right" : "left")), ye = (e) => (V.value || G.value !== "vertical") && a.includes(e) ? e : void 0, K = l(() => ye(k.labelAlign)), q = l(() => ye(k.inputAlign)), be = l(() => k.name ? k.name : t(k.label).replace(/\s+/g, "").toLowerCase()), xe = () => {
 			let e = V.value ? {
 				class: {
 					"bb-field__layout": !0,
 					"bb-field__layout--responsive": !0,
 					...Object.fromEntries(V.value.map(([e]) => [`bb-field__layout--${e === "default" ? "d" : e}`, !0])),
 					"bb-field__layout--reverse": k.reverse,
-					"bb-field__layout--aligned": !!(q.value || J.value)
+					"bb-field__layout--aligned": !!(K.value || q.value)
 				},
-				style: we.value
+				style: Te.value
 			} : { class: {
 				"bb-field__layout": !0,
 				"bb-field__layout--horizontal": G.value !== "vertical",
 				"bb-field__layout--vertical": G.value === "vertical",
 				[`bb-field__layout--${G.value}`]: !0,
 				"bb-field__layout--reverse": k.reverse,
-				"bb-field__layout--aligned": !!(q.value || J.value)
+				"bb-field__layout--aligned": !!(K.value || q.value)
 			} };
 			k.tag === "label" && (e.for = A);
 			let t = z();
 			return k.tag === "fieldset" && t && (e["aria-labelledby"] = t), e;
-		}, xe = l(() => {
+		}, Se = l(() => {
 			let e = {
 				class: {
 					"bb-field__label": !0,
 					"bb-field__legend": k.labelTag === "legend",
 					"bb-field__label--hidden": k.hideLabel,
 					[`bb-field__label--${k.labelPosition}`]: k.labelPosition,
-					[`bb-field__label--align-${q.value}`]: !!q.value
+					[`bb-field__label--align-${K.value}`]: !!K.value
 				},
-				style: { width: Ce.value.label }
+				style: { width: we.value.label }
 			};
 			return k.labelTag === "label" && (e.for = A), k.passthrough?.label ? v(e, k.passthrough.label) : e;
-		}), Se = l(() => ({
+		}), Ce = l(() => ({
 			class: {
 				"bb-field__input-wrapper": !0,
 				[`bb-field__input-wrapper--${ve.value}`]: !V.value,
-				[`bb-field__input-wrapper--align-${J.value}`]: !!J.value
+				[`bb-field__input-wrapper--align-${q.value}`]: !!q.value
 			},
 			style: {
-				width: Ce.value.input,
+				width: we.value.input,
 				justifyItems: V.value ? "var(--ly-ij)" : void 0
 			}
-		})), Ce = l(() => V.value ? {
+		})), we = l(() => V.value ? {
 			label: "var(--ly-lw)",
 			input: "var(--ly-iw)"
-		} : Y(H.value)), we = l(() => {
+		} : J(H.value)), Te = l(() => {
 			if (!V.value) return;
 			let e = {};
 			for (let [t, n] of V.value) {
-				let r = W(n), i = r !== "vertical", a = r === "horizontal" || r === "ratio", o = k.inputPosition ?? (a ? "right" : "left"), { label: s, input: c } = Y(n), l = (n, r) => e[`--ly-${t === "default" ? "d" : t}-${n}`] = r;
+				let r = W(n), i = r !== "vertical", a = r === "horizontal" || r === "ratio", o = k.inputPosition ?? (a ? "right" : "left"), { label: s, input: c } = J(n), l = (n, r) => e[`--ly-${t === "default" ? "d" : t}-${n}`] = r;
 				l("dir", i ? "row" : "column"), l("x", i ? "initial" : "none"), l("lw", s), l("iw", c), l("lf", r === "label-fill" ? "1 1 0" : r === "input-fill" ? "none" : "initial"), l("if", r === "input-fill" ? "1 1 0" : r === "label-fill" ? "none" : "initial"), l("lmin", r === "label-fill" ? "0" : "initial"), l("ij", o === "right" ? "flex-end" : o === "center" ? "center" : "flex-start"), l("lj", o === "right" ? "flex-end" : o === "center" ? "center" : "initial"), l("ls", o === "right" ? "end" : o === "center" ? "center" : "initial");
 			}
 			return e;
 		});
-		function Y(e) {
+		function J(e) {
 			let t = {
 				label: "auto",
 				input: "auto"
 			};
-			if (!(e === "auto" || e === "label-fill" || e === "input-fill")) if (e === "vertical") t.label = t.input = "100%";
-			else if (e === "horizontal") t.label = t.input = "50%";
-			else if (U(e)) {
-				let [n, i] = e.split(/\s+/).map((e) => e.length), a = r(n, n + i) + "%", o = r(i, i + n) + "%";
-				k.reverse ? (t.label = o, t.input = a) : (t.label = a, t.input = o);
-			} else pe.warn(`Invalid layout: "${e}". Expected 'auto', 'vertical', 'horizontal', 'label-fill', 'input-fill', or a two-token pattern whose TOKEN LENGTHS are the ratio, like 'x xx' for 1:2. Falling back to 'auto'.`);
+			if (e !== "auto" && e !== "label-fill" && e !== "input-fill") {
+				if (e === "vertical") t.label = t.input = "100%";
+				else if (e === "horizontal") t.label = t.input = "50%";
+				else if (U(e)) {
+					let [r, i] = e.split(/\s+/).map((e) => e.length), a = n(r, r + i) + "%", o = n(i, i + r) + "%";
+					k.reverse ? (t.label = o, t.input = a) : (t.label = a, t.input = o);
+				} else pe.warn(`Invalid layout: "${e}". Expected 'auto', 'vertical', 'horizontal', 'label-fill', 'input-fill', or a two-token pattern whose TOKEN LENGTHS are the ratio, like 'x xx' for 1:2. Falling back to 'auto'.`);
+			}
 			return t;
 		}
-		let X = l(() => k.errors ? [].concat(k.errors) : []), Z = l(() => !!X.value.length || k.hasErrors), Te = l(() => k.warnings ? [].concat(k.warnings) : []), Q = l(() => (!!k.hasWarnings || !!Te.value.length) && !Z.value), $ = l(() => Q.value ? Te.value : []), Ee = (e, t) => {
+		let Y = l(() => k.errors ? [].concat(k.errors) : []), X = l(() => !!Y.value.length || k.hasErrors), Ee = l(() => k.warnings ? [].concat(k.warnings) : []), Z = l(() => (!!k.hasWarnings || !!Ee.value.length) && !X.value), Q = l(() => Z.value ? Ee.value : []), De = (e, t) => {
 			let n = ne(e()), r;
 			return ie(e, (i) => {
 				if (clearTimeout(r), i.length) {
@@ -153,23 +155,23 @@ var oe = {
 				let a = t.value ? Math.max(...getComputedStyle(t.value).transitionDuration.split(",").map((e) => parseFloat(e) * (e.includes("ms") ? 1 : 1e3))) : 0;
 				a > 0 ? r = setTimeout(() => n.value = e(), a) : n.value = i;
 			}), ee(() => clearTimeout(r)), n;
-		}, De = Ee(() => X.value, E("errorsWrap")), Oe = Ee(() => $.value, E("warningsWrap")), ke = () => [
-			X.value.length ? I : void 0,
-			$.value.length ? L : void 0,
+		}, Oe = De(() => Y.value, E("errorsWrap")), ke = De(() => Q.value, E("warningsWrap")), Ae = () => [
+			Y.value.length ? I : void 0,
+			Q.value.length ? L : void 0,
 			P() ? F : void 0,
 			N.value ? M.value : void 0,
 			k.counter ? j : void 0
-		].filter(Boolean).join(" ") || void 0, Ae = l(() => ({
+		].filter(Boolean).join(" ") || void 0, $ = l(() => ({
 			text: k.description ?? "",
-			hasErrors: Z.value,
-			hasWarnings: Q.value
+			hasErrors: X.value,
+			hasWarnings: Z.value
 		}));
-		return (e, t) => (x(), f("div", v({ class: ["bb-field", {
+		return (t, n) => (x(), f("div", v({ class: ["bb-field", {
 			"bb-field--clearable": k.clearable,
 			"bb-field--description": P(),
 			"bb-field--disabled": k.disabled,
-			"bb-field--errors": Z.value,
-			"bb-field--warnings": Q.value,
+			"bb-field--errors": X.value,
+			"bb-field--warnings": Z.value,
 			"bb-field--has-value": k.hasValue,
 			"bb-field--hint": N.value,
 			"bb-field--near-limit": k.counter?.state === "near",
@@ -180,78 +182,82 @@ var oe = {
 			"bb-field--floating-label": k.labelMode === "floating",
 			"bb-field--inside-label": k.labelMode === "inside",
 			"bb-field--readonly": k.readonly
-		}] }, e.passthrough?.root), [
-			e.ssrMarker === void 0 ? d("", !0) : (x(), u(T(n), {
+		}] }, g.passthrough?.root), [
+			g.ssrMarker === void 0 ? d("", !0) : (x(), u(T(e), {
 				key: 0,
-				value: e.ssrMarker
+				value: g.ssrMarker
 			}, null, 8, ["value"])),
-			(x(), u(C(e.tag), b(_(be())), {
+			(x(), u(te(g.tag), b(_(xe())), {
 				default: O(() => [
-					(x(), u(C(e.labelTag), b(_(xe.value)), {
+					(x(), u(te(g.labelTag), b(_(Se.value)), {
 						default: O(() => [p("span", {
 							id: R,
 							class: "bb-field__label-text"
-						}, [S(e.$slots, "label", b(_({
-							text: e.label,
-							hasErrors: Z.value,
-							hasWarnings: Q.value,
-							showAsterisk: e.showAsterisk || void 0
-						})), () => [m(w(e.label), 1), e.showAsterisk ? (x(), u(i, { key: 0 })) : d("", !0)])]), P() && !B.value ? (x(), f("span", v({
+						}, [C(t.$slots, "label", b(_({
+							text: g.label,
+							hasErrors: X.value,
+							hasWarnings: Z.value,
+							showAsterisk: g.showAsterisk || void 0
+						})), () => [m(w(g.label), 1), g.showAsterisk ? (x(), u(o, { key: 0 })) : d("", !0)])]), P() && !B.value ? (x(), f("span", v({
 							key: 0,
 							id: F,
 							class: "bb-field__description"
-						}, e.passthrough?.description), [S(e.$slots, "description", b(_(Ae.value)), () => [m(w(e.description), 1)])], 16)) : d("", !0)]),
+						}, g.passthrough?.description), [C(t.$slots, "description", b(_($.value)), () => [m(w(g.description), 1)])], 16)) : d("", !0)]),
 						_: 3
 					}, 16)),
 					P() && B.value ? (x(), f("span", v({
 						key: 0,
 						id: F,
 						class: "bb-field__description"
-					}, e.passthrough?.description), [S(e.$slots, "description", b(_(Ae.value)), () => [m(w(e.description), 1)])], 16)) : d("", !0),
-					p("span", b(_(Se.value)), [S(e.$slots, "input", b(_({
+					}, g.passthrough?.description), [C(t.$slots, "description", b(_($.value)), () => [m(w(g.description), 1)])], 16)) : d("", !0),
+					p("span", b(_(Ce.value)), [C(t.$slots, "input", b(_({
 						id: T(A),
-						name: ye.value,
-						hasErrors: Z.value,
-						hasWarnings: Q.value,
-						ariaDescribedby: ke(),
+						name: be.value,
+						hasErrors: X.value,
+						hasWarnings: Z.value,
+						ariaDescribedby: Ae(),
 						ariaLabelledby: z()
 					})))], 16)
 				]),
 				_: 3
 			}, 16)),
-			e.counter ? (x(), f("div", oe, [
-				h(c, { name: "hint" }, {
+			g.counter ? (x(), f("div", oe, [
+				h(c, {
+					name: "hint",
+					persisted: ""
+				}, {
 					default: O(() => [ae(p("span", {
 						id: M.value,
 						class: "bb-field__hint-wrap"
-					}, [p("span", v({ class: "bb-field__hint" }, e.passthrough?.hint), w(e.hint), 17)], 8, se), [[D, N.value]])]),
+					}, [p("span", v({ class: "bb-field__hint" }, g.passthrough?.hint), w(g.hint), 17)], 8, se), [[D, N.value]])]),
 					_: 1
 				}),
 				p("span", v({
 					id: j,
-					class: ["bb-field__counter", e.counter.state && `bb-field__counter--${e.counter.state}`],
-					style: { minInlineSize: `${e.counter.reserve}ch` }
-				}, e.passthrough?.counter), [p("span", ce, w(e.counter.text), 1), p("span", le, w(e.counter.label), 1)], 16),
-				p("span", ue, w(e.counter.announcement), 1)
+					class: ["bb-field__counter", g.counter.state && `bb-field__counter--${g.counter.state}`],
+					style: { minInlineSize: `${g.counter.reserve}ch` }
+				}, g.passthrough?.counter), [p("span", ce, w(g.counter.text), 1), p("span", le, w(g.counter.label), 1)], 16),
+				p("span", ue, w(g.counter.announcement), 1)
 			])) : (x(), u(c, {
 				key: 2,
-				name: "hint"
+				name: "hint",
+				persisted: ""
 			}, {
 				default: O(() => [ae(p("span", {
 					id: M.value,
 					class: "bb-field__hint-wrap"
-				}, [p("span", v({ class: "bb-field__hint" }, e.passthrough?.hint), w(e.hint), 17)], 8, de), [[D, N.value]])]),
+				}, [p("span", v({ class: "bb-field__hint" }, g.passthrough?.hint), w(g.hint), 17)], 8, de), [[D, N.value]])]),
 				_: 1
 			})),
 			h(c, { name: "errors" }, {
 				default: O(() => [p("div", {
 					ref: "errorsWrap",
 					"aria-live": "polite",
-					class: y(["bb-field__errors-wrap", { "bb-field__errors-wrap--open": X.value.length > 0 }])
+					class: y(["bb-field__errors-wrap", { "bb-field__errors-wrap--open": Y.value.length > 0 }])
 				}, [p("div", v({
 					id: I,
 					class: "bb-field__message bb-field__errors"
-				}, Q.value ? void 0 : e.passthrough?.message), [(x(!0), f(s, null, te(T(De), (e) => (x(), f("span", {
+				}, Z.value ? void 0 : g.passthrough?.message), [(x(!0), f(s, null, S(T(Oe), (e) => (x(), f("span", {
 					key: e,
 					class: "bb-field__error"
 				}, w(e), 1))), 128))], 16)], 2)]),
@@ -261,11 +267,11 @@ var oe = {
 				default: O(() => [p("div", {
 					ref: "warningsWrap",
 					"aria-live": "polite",
-					class: y(["bb-field__warnings-wrap", { "bb-field__warnings-wrap--open": $.value.length > 0 }])
+					class: y(["bb-field__warnings-wrap", { "bb-field__warnings-wrap--open": Q.value.length > 0 }])
 				}, [p("div", v({
 					id: L,
 					class: "bb-field__message bb-field__warnings"
-				}, Q.value ? e.passthrough?.message : void 0), [(x(!0), f(s, null, te(T(Oe), (e) => (x(), f("span", {
+				}, Z.value ? g.passthrough?.message : void 0), [(x(!0), f(s, null, S(T(ke), (e) => (x(), f("span", {
 					key: e,
 					class: "bb-field__warning"
 				}, w(e), 1))), 128))], 16)], 2)]),
@@ -274,5 +280,4 @@ var oe = {
 		], 16));
 	}
 });
-//#endregion
 export { k as default };

package/dist/components/CommonField/types.d.ts

@@ -73,7 +73,7 @@ export type CommonFieldProps = {
      */
     hint?: string;
     /**
-     * The character counter (LI-5) from `useCharacterCounter`: rendered at the
+     * The character counter from `useCharacterCounter`: rendered at the
      * end of the hint row, visible whether or not the hint is. Its screen-reader
      * label joins `ariaDescribedby` after the hint.
      */
@@ -158,7 +158,7 @@ export type CommonFieldProps = {
      */
     showAsterisk?: boolean;
     /**
-     * SSR-transfer marker of a provider-backed group (Q56.1): when set, it
+     * SSR-transfer marker of a provider-backed group: when set, it
      * renders as the root's FIRST child, where the hydrating group reads its
      * payload key (`src/composables/ssrMarker.ts`). `''` still renders an empty
      * marker; only an absent prop renders none.