@skdx/vue 0.28.0 → 0.29.0

package/dist/field/FieldRequiredIndicator.vue.d.ts

@@ -1,7 +1,5 @@
 /**
- * Mandatory marker for Field (renders only if required). Must be inside
- * SkdxFieldLabel (text joins control's accessible name). Not aria-hidden
- * (would hide from users who need it announced).
+ * Mandatory marker for a `SkdxField`, rendered only when required and never `aria-hidden`.
  *
  * @example
  * ```vue

package/dist/field/FieldRequiredIndicator.vue_vue_type_script_setup_true_lang.cjs

@@ -1 +1 @@
-const o=require("./fieldCore.cjs"),i=require("./context.cjs");let e=require("vue");var n=(0,e.defineComponent)({__name:"FieldRequiredIndicator",setup(u){const r=(0,e.inject)(i.FIELD_CONTEXT);if(!r)throw new Error("<SkdxFieldRequiredIndicator> must be used inside <SkdxField> or <SkdxFieldset>.");return(d,t)=>(0,e.unref)(r).required?((0,e.openBlock)(),(0,e.createElementBlock)("span",(0,e.normalizeProps)({key:0,class:"skdx-field__required-indicator","data-part":"required-indicator",[(0,e.unref)("data-skdx-field-required-indicator")||""]:""}),[(0,e.renderSlot)(d.$slots,"default",{},()=>[t[0]||(t[0]=(0,e.createTextVNode)("*",-1))])],16)):(0,e.createCommentVNode)("",!0)}});exports.default=n;
+const t=require("../utils/injectRequired.cjs"),a=require("../utils/field-core.cjs"),u=require("./context.cjs");let e=require("vue");var n=(0,e.defineComponent)({__name:"FieldRequiredIndicator",setup(o){const i=t.injectRequired(u.FIELD_CONTEXT,"<SkdxFieldRequiredIndicator> must be used inside <SkdxField> or <SkdxFieldset>.");return(d,r)=>(0,e.unref)(i).required?((0,e.openBlock)(),(0,e.createElementBlock)("span",(0,e.normalizeProps)({key:0,class:"skdx-field__required-indicator","data-part":"required-indicator",[(0,e.unref)("data-skdx-field-required-indicator")||""]:""}),[(0,e.renderSlot)(d.$slots,"default",{},()=>[r[0]||(r[0]=(0,e.createTextVNode)("*",-1))])],16)):(0,e.createCommentVNode)("",!0)}});exports.default=n;

package/dist/field/FieldRequiredIndicator.vue_vue_type_script_setup_true_lang.js

@@ -1 +1 @@
-import"./fieldCore.js";import{FIELD_CONTEXT as e}from"./context.js";import{createCommentVNode as r,createElementBlock as d,createTextVNode as t,defineComponent as a,inject as i,normalizeProps as o,openBlock as s,renderSlot as n,unref as l}from"vue";var c=/* @__PURE__ */a({__name:"FieldRequiredIndicator",setup(a){const c=i(e);if(!c)throw new Error("<SkdxFieldRequiredIndicator> must be used inside <SkdxField> or <SkdxFieldset>.");return(e,a)=>l(c).required?(s(),d("span",o({key:0,class:"skdx-field__required-indicator","data-part":"required-indicator",[l("data-skdx-field-required-indicator")||""]:""}),[n(e.$slots,"default",{},()=>[a[0]||(a[0]=t("*",-1))])],16)):r("",!0)}});export{c as default};
+import{injectRequired as e}from"../utils/injectRequired.js";import"../utils/field-core.js";import{FIELD_CONTEXT as r}from"./context.js";import{createCommentVNode as d,createElementBlock as i,createTextVNode as t,defineComponent as a,normalizeProps as s,openBlock as o,renderSlot as n,unref as l}from"vue";var u=/* @__PURE__ */a({__name:"FieldRequiredIndicator",setup(a){const u=e(r,"<SkdxFieldRequiredIndicator> must be used inside <SkdxField> or <SkdxFieldset>.");return(e,r)=>l(u).required?(o(),i("span",s({key:0,class:"skdx-field__required-indicator","data-part":"required-indicator",[l("data-skdx-field-required-indicator")||""]:""}),[n(e.$slots,"default",{},()=>[r[0]||(r[0]=t("*",-1))])],16)):d("",!0)}});export{u as default};

package/dist/field/FieldRoot.vue.d.cts

@@ -1,9 +1,7 @@
+import type { FieldMode, FieldValidator } from '../utils/field-core.cjs';
 import type { FieldValidityDetail } from './context.cjs';
-import type { FieldMode, FieldValidator } from './fieldCore.cjs';
 /**
- * Headless validation model and control wiring (ids, aria-describedby/aria-invalid,
- * data-* hooks), renders verbatim. SkdxField is this plus derived label/description/error;
- * reach here for full manual composition (only way to place CharacterCount).
+ * Headless validation model and control wiring — ids, aria-describedby/aria-invalid, data-* hooks — rendering verbatim.
  *
  * @example With `import * as Field from '@skdx/vue/primitives/field'`:
  * ```vue
@@ -18,24 +16,25 @@ import type { FieldMode, FieldValidator } from './fieldCore.cjs';
  */
 type __VLS_Props = {
     /** Validator returning one message, several, or `null`/`undefined` when acceptable; may be async. */
-    validate?: FieldValidator;
+    validate?: FieldValidator | undefined;
     /** When validation first runs; an already-failed field always re-validates on every input. */
     mode?: FieldMode;
     /** Server-injected errors, always shown, listed before anything `validate` produces. */
-    errors?: string | string[];
-    /** Value handed to `validate`; omit and the Field reads it off the discovered control. */
+    errors?: string | string[] | undefined;
+    /** Value handed to `validate`; omit and the Field reads it off the discovered control. @default undefined — read off the discovered control */
     value?: unknown;
-    /** Field name, used as the `SkdxFormErrorSummary` link text when the field renders no error of its own. */
-    name?: string;
     /**
-     * Whether an answer is mandatory. Native `required` on an `<input>`/`<select>`/`<textarea>`,
-     * `aria-required="true"` on a group or widget-role element.
+     * Field name, used as the `SkdxFormErrorSummary` link text when the field renders no error of its own.
+     * @default undefined
+     */
+    name?: string | undefined;
+    /**
+     * Whether an answer is mandatory, reflected onto the wrapped control as `required` or `aria-required`.
      * @default false
      */
     required?: boolean;
     /**
-     * Whether the field is unavailable. Native `disabled` where there is one,
-     * `aria-disabled="true"` otherwise, mirrored as `data-disabled`.
+     * Whether the field is unavailable, reflected onto the wrapped control as `disabled` or `aria-disabled`.
      * @default false
      */
     disabled?: boolean;
@@ -43,18 +42,23 @@ type __VLS_Props = {
      * Words the character-count copy shared by the rendered text, the announcement, and the over-limit error.
      * @default undefined — `characterCountMessage`'s English wording ("50 characters remaining").
      */
-    getCharacterCountMessage?: (remaining: number) => string;
+    getCharacterCountMessage?: ((remaining: number) => string) | undefined;
     /**
      * Fallback message when native constraint validation fails but the browser reports none of its own.
      * @default undefined — `NATIVE_INVALID_FALLBACK_MESSAGE` ('This field is invalid.').
      */
-    invalidMessage?: string;
+    invalidMessage?: string | undefined;
     /**
      * Milliseconds `mode: 'change'` waits after the last keystroke before
      * running `validate`; a blur flushes the pending run immediately.
      * @default 0 — no debounce.
      */
     validationDebounceTime?: number;
+    /**
+     * How tightly the skin packs the field's contents, reflected as `data-density`.
+     * @default undefined — falls back to a `data-density` attribute.
+     */
+    density?: 'compact' | (string & {}) | undefined;
 };
 declare var __VLS_1: {};
 type __VLS_Slots = {} & {
@@ -68,17 +72,13 @@ declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "validity-change": (detail: FieldValidityDetail) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
-    "onValidity-change"?: ((detail: FieldValidityDetail) => any) | undefined;
+    "onValidity-change"?: (detail: FieldValidityDetail) => any;
 }>, {
     disabled: boolean;
-    value: undefined;
     required: boolean;
-    name: string;
-    errors: string | string[];
-    validate: FieldValidator;
+    errors: string | string[] | undefined;
+    validate: FieldValidator | undefined;
     mode: FieldMode;
-    getCharacterCountMessage: (remaining: number) => string;
-    invalidMessage: string;
     validationDebounceTime: number;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;

package/dist/field/FieldRoot.vue.d.ts

@@ -1,9 +1,7 @@
+import type { FieldMode, FieldValidator } from '../utils/field-core.js';
 import type { FieldValidityDetail } from './context.js';
-import type { FieldMode, FieldValidator } from './fieldCore.js';
 /**
- * Headless validation model and control wiring (ids, aria-describedby/aria-invalid,
- * data-* hooks), renders verbatim. SkdxField is this plus derived label/description/error;
- * reach here for full manual composition (only way to place CharacterCount).
+ * Headless validation model and control wiring — ids, aria-describedby/aria-invalid, data-* hooks — rendering verbatim.
  *
  * @example With `import * as Field from '@skdx/vue/primitives/field'`:
  * ```vue
@@ -18,24 +16,25 @@ import type { FieldMode, FieldValidator } from './fieldCore.js';
  */
 type __VLS_Props = {
     /** Validator returning one message, several, or `null`/`undefined` when acceptable; may be async. */
-    validate?: FieldValidator;
+    validate?: FieldValidator | undefined;
     /** When validation first runs; an already-failed field always re-validates on every input. */
     mode?: FieldMode;
     /** Server-injected errors, always shown, listed before anything `validate` produces. */
-    errors?: string | string[];
-    /** Value handed to `validate`; omit and the Field reads it off the discovered control. */
+    errors?: string | string[] | undefined;
+    /** Value handed to `validate`; omit and the Field reads it off the discovered control. @default undefined — read off the discovered control */
     value?: unknown;
-    /** Field name, used as the `SkdxFormErrorSummary` link text when the field renders no error of its own. */
-    name?: string;
     /**
-     * Whether an answer is mandatory. Native `required` on an `<input>`/`<select>`/`<textarea>`,
-     * `aria-required="true"` on a group or widget-role element.
+     * Field name, used as the `SkdxFormErrorSummary` link text when the field renders no error of its own.
+     * @default undefined
+     */
+    name?: string | undefined;
+    /**
+     * Whether an answer is mandatory, reflected onto the wrapped control as `required` or `aria-required`.
      * @default false
      */
     required?: boolean;
     /**
-     * Whether the field is unavailable. Native `disabled` where there is one,
-     * `aria-disabled="true"` otherwise, mirrored as `data-disabled`.
+     * Whether the field is unavailable, reflected onto the wrapped control as `disabled` or `aria-disabled`.
      * @default false
      */
     disabled?: boolean;
@@ -43,18 +42,23 @@ type __VLS_Props = {
      * Words the character-count copy shared by the rendered text, the announcement, and the over-limit error.
      * @default undefined — `characterCountMessage`'s English wording ("50 characters remaining").
      */
-    getCharacterCountMessage?: (remaining: number) => string;
+    getCharacterCountMessage?: ((remaining: number) => string) | undefined;
     /**
      * Fallback message when native constraint validation fails but the browser reports none of its own.
      * @default undefined — `NATIVE_INVALID_FALLBACK_MESSAGE` ('This field is invalid.').
      */
-    invalidMessage?: string;
+    invalidMessage?: string | undefined;
     /**
      * Milliseconds `mode: 'change'` waits after the last keystroke before
      * running `validate`; a blur flushes the pending run immediately.
      * @default 0 — no debounce.
      */
     validationDebounceTime?: number;
+    /**
+     * How tightly the skin packs the field's contents, reflected as `data-density`.
+     * @default undefined — falls back to a `data-density` attribute.
+     */
+    density?: 'compact' | (string & {}) | undefined;
 };
 declare var __VLS_1: {};
 type __VLS_Slots = {} & {
@@ -68,17 +72,13 @@ declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "validity-change": (detail: FieldValidityDetail) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
-    "onValidity-change"?: ((detail: FieldValidityDetail) => any) | undefined;
+    "onValidity-change"?: (detail: FieldValidityDetail) => any;
 }>, {
     disabled: boolean;
-    value: undefined;
     required: boolean;
-    name: string;
-    errors: string | string[];
-    validate: FieldValidator;
+    errors: string | string[] | undefined;
+    validate: FieldValidator | undefined;
     mode: FieldMode;
-    getCharacterCountMessage: (remaining: number) => string;
-    invalidMessage: string;
     validationDebounceTime: number;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;

package/dist/field/FieldRoot.vue_vue_type_script_setup_true_lang.cjs

@@ -1 +1 @@
-const s=require("./useField.cjs");let e=require("vue");var f=(0,e.defineComponent)({__name:"FieldRoot",props:{validate:{type:Function,default:void 0},mode:{default:"blur"},errors:{default:void 0},value:{default:void 0},name:{default:void 0},required:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},getCharacterCountMessage:{type:Function,default:void 0},invalidMessage:{default:void 0},validationDebounceTime:{default:0}},emits:["validity-change"],setup(a,{expose:d,emit:o}){const l=a,i=o,{rootRef:r,checkValidity:u,reset:n}=s.useField(l,!1,t=>i("validity-change",t));return d({checkValidity:u,reset:n}),(t,c)=>((0,e.openBlock)(),(0,e.createElementBlock)("div",{class:"skdx-field","data-part":"root","data-skdx-component":"field",ref_key:"rootRef",ref:r},[(0,e.renderSlot)(t.$slots,"default")],512))}});exports.default=f;
+const u=require("../utils/appearance.cjs"),c=require("./useField.cjs");let e=require("vue");var f=(0,e.defineComponent)({inheritAttrs:!1,__name:"FieldRoot",props:{validate:{type:Function,default:void 0},mode:{default:"blur"},errors:{default:void 0},value:{},name:{},required:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},getCharacterCountMessage:{},invalidMessage:{},validationDebounceTime:{default:0},density:{}},emits:["validity-change"],setup(a,{expose:r,emit:i}){const l=a,o=i,{rootRef:s,checkValidity:d,reset:n}=c.useField(l,!1,t=>o("validity-change",t));return r({checkValidity:d,reset:n}),(t,p)=>((0,e.openBlock)(),(0,e.createElementBlock)("div",(0,e.mergeProps)({ref_key:"rootRef",ref:s,class:"skdx-field","data-part":"root","data-skdx-component":"field"},{...t.$attrs,...(0,e.unref)(u.appearanceAttrs)({density:a.density},t.$attrs)}),[(0,e.renderSlot)(t.$slots,"default")],16))}});exports.default=f;

package/dist/field/FieldRoot.vue_vue_type_script_setup_true_lang.js

@@ -1 +1 @@
-import{useField as e}from"./useField.js";import{createElementBlock as t,defineComponent as a,openBlock as o,renderSlot as d}from"vue";var i=/* @__PURE__ */a({__name:"FieldRoot",props:{validate:{type:Function,default:void 0},mode:{default:"blur"},errors:{default:void 0},value:{default:void 0},name:{default:void 0},required:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},getCharacterCountMessage:{type:Function,default:void 0},invalidMessage:{default:void 0},validationDebounceTime:{default:0}},emits:["validity-change"],setup(a,{expose:i,emit:l}){const r=a,s=l,{rootRef:n,checkValidity:u,reset:f}=e(r,!1,e=>s("validity-change",e));return i({checkValidity:u,reset:f}),(e,a)=>(o(),t("div",{class:"skdx-field","data-part":"root","data-skdx-component":"field",ref_key:"rootRef",ref:n},[d(e.$slots,"default")],512))}});export{i as default};
+import{appearanceAttrs as e}from"../utils/appearance.js";import{useField as t}from"./useField.js";import{createElementBlock as a,defineComponent as s,mergeProps as o,openBlock as r,renderSlot as i,unref as d}from"vue";var l=/* @__PURE__ */s({inheritAttrs:!1,__name:"FieldRoot",props:{validate:{type:Function,default:void 0},mode:{default:"blur"},errors:{default:void 0},value:{},name:{},required:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},getCharacterCountMessage:{},invalidMessage:{},validationDebounceTime:{default:0},density:{}},emits:["validity-change"],setup(s,{expose:l,emit:n}){const u=s,p=n,{rootRef:f,checkValidity:c,reset:m}=t(u,!1,e=>p("validity-change",e));return l({checkValidity:c,reset:m}),(t,l)=>(r(),a("div",o({ref_key:"rootRef",ref:f,class:"skdx-field","data-part":"root","data-skdx-component":"field"},{...t.$attrs,...d(e)({density:s.density},t.$attrs)}),[i(t.$slots,"default")],16))}});export{l as default};

package/dist/field/Fieldset.vue.d.cts

@@ -1,9 +1,7 @@
+import type { FieldMode, FieldValidator } from '../utils/field-core.cjs';
 import type { FieldValidityDetail } from './context.cjs';
-import type { FieldMode, FieldValidator } from './fieldCore.cjs';
 /**
- * Field rendering fieldset with label as legend.
- * For grouping radiogroups/checkboxes; same validation model as Field.
- * Label must be first child to render as legend.
+ * Field rendering a `<fieldset>` with the label as legend, for grouping radiogroups/checkboxes.
  *
  * @example With `import * as Field from '@skdx/vue/primitives/field'`:
  * ```vue
@@ -15,96 +13,69 @@ import type { FieldMode, FieldValidator } from './fieldCore.cjs';
  * ```
  */
 type __VLS_Props = {
-    /**
-     * Validator for this group, returning one message, several, or
-     * `null`/`undefined` when the value is acceptable. May be async; a
-     * resolution from a superseded run is discarded.
-     */
-    validate?: FieldValidator;
-    /**
-     * When validation first runs. Failed groups always re-validate on each input.
-     */
+    /** Validator returning one message, several, or nothing when the value is acceptable; may be async. */
+    validate?: FieldValidator | undefined;
+    /** When validation first runs; a failed group always re-validates on every input. */
     mode?: FieldMode;
     /** Server-injected errors, always shown, listed before anything `validate` produces. */
-    errors?: string | string[];
-    /** Value handed to `validate`; omit and the Fieldset reads it off the discovered group control. */
+    errors?: string | string[] | undefined;
+    /** Value handed to `validate`; omit and the Fieldset reads it off the discovered group control. @default undefined — read off the discovered control */
     value?: unknown;
-    /** Field name, used as the `SkdxFormErrorSummary` link text when the group renders no error of its own. */
-    name?: string;
     /**
-     * Whether an answer is mandatory. Reflected onto the wrapped control as the
-     * native `required` attribute when it is an `<input>`/`<select>`/
-     * `<textarea>`, and as `aria-required="true"` when it is a group or a
-     * widget-role element, which has no native `required` to set.
-     *
-     * Render a `SkdxFieldRequiredIndicator` inside the `SkdxFieldLabel` to say
-     * so visibly; its text joins the control's accessible name.
+     * Field name, used as the `SkdxFormErrorSummary` link text when the group renders no error of its own.
+     * @default undefined
+     */
+    name?: string | undefined;
+    /**
+     * Whether an answer is mandatory, reflected onto the wrapped control as `required` or `aria-required`.
      * @default false
      */
     required?: boolean;
     /**
-     * Whether the field is unavailable. Applied to the wrapped control — the
-     * native `disabled` attribute where there is one, `aria-disabled="true"`
-     * otherwise, because a disabled *widget* stays focusable and stays
-     * announced — and mirrored as `data-disabled` on the Field root and the
-     * control for styling.
+     * Whether the field is unavailable, reflected onto the wrapped control as `disabled` or `aria-disabled`.
      * @default false
      */
     disabled?: boolean;
     /**
-     * Words the character-count copy and error; all three (displayed text,
-     * announced message, error) share one wording to avoid confusion. Negative
-     * `remaining` indicates over the limit.
+     * Words the character-count text, announcement, and over-limit error, which share one wording.
      * @default undefined — English "characters remaining"
      */
-    getCharacterCountMessage?: (remaining: number) => string;
+    getCharacterCountMessage?: ((remaining: number) => string) | undefined;
     /**
-     * What the group says when its discovered control fails native constraint
-     * validation but the browser reports no message of its own. The browser's
-     * own messages are already localized; this fallback is the one string in
-     * the native path that is not, so it is the only one worth overriding.
+     * Fallback message when the group's control fails native constraint validation with none of its own.
      * @default undefined — `NATIVE_INVALID_FALLBACK_MESSAGE` ('This field is invalid.').
      */
-    invalidMessage?: string;
+    invalidMessage?: string | undefined;
     /**
-     * How long, in milliseconds, `mode: 'change'` waits after the last
-     * keystroke before running `validate`. Only `change` mode is debounced, and
-     * a blur flushes the pending run immediately — the delay exists to keep a
-     * validator quiet *while* the user types, and a blur means they have
-     * stopped.
+     * Milliseconds `mode: 'change'` waits after the last keystroke before running `validate`.
      * @default 0 — no debounce.
      */
     validationDebounceTime?: number;
+    /**
+     * How tightly the skin packs the fieldset's contents, reflected as `data-density`.
+     * @default undefined — falls back to a `data-density` attribute.
+     */
+    density?: 'compact' | (string & {}) | undefined;
 };
 declare var __VLS_1: {};
 type __VLS_Slots = {} & {
     default?: (props: typeof __VLS_1) => any;
 };
 declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {
-    /**
-     * Runs validation now and returns validity. Validates server `errors`,
-     * the `validate` prop, native constraint validation, and character count.
-     */
+    /** Runs every validation source now and resolves to whether the group is valid. */
     checkValidity: () => Promise<boolean>;
-    /**
-     * Clear messages and state; re-derive `filled`/`count` from the control.
-     * Also clear the `errors` prop, which is re-applied on next render.
-     */
+    /** Clears messages and state, then re-derives `filled`/`count` from the control. */
     reset: () => void;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "validity-change": (detail: FieldValidityDetail) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
-    "onValidity-change"?: ((detail: FieldValidityDetail) => any) | undefined;
+    "onValidity-change"?: (detail: FieldValidityDetail) => any;
 }>, {
     disabled: boolean;
-    value: undefined;
     required: boolean;
-    name: string;
-    errors: string | string[];
-    validate: FieldValidator;
+    errors: string | string[] | undefined;
+    validate: FieldValidator | undefined;
     mode: FieldMode;
-    getCharacterCountMessage: (remaining: number) => string;
-    invalidMessage: string;
     validationDebounceTime: number;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;

package/dist/field/Fieldset.vue.d.ts

@@ -1,9 +1,7 @@
+import type { FieldMode, FieldValidator } from '../utils/field-core.js';
 import type { FieldValidityDetail } from './context.js';
-import type { FieldMode, FieldValidator } from './fieldCore.js';
 /**
- * Field rendering fieldset with label as legend.
- * For grouping radiogroups/checkboxes; same validation model as Field.
- * Label must be first child to render as legend.
+ * Field rendering a `<fieldset>` with the label as legend, for grouping radiogroups/checkboxes.
  *
  * @example With `import * as Field from '@skdx/vue/primitives/field'`:
  * ```vue
@@ -15,96 +13,69 @@ import type { FieldMode, FieldValidator } from './fieldCore.js';
  * ```
  */
 type __VLS_Props = {
-    /**
-     * Validator for this group, returning one message, several, or
-     * `null`/`undefined` when the value is acceptable. May be async; a
-     * resolution from a superseded run is discarded.
-     */
-    validate?: FieldValidator;
-    /**
-     * When validation first runs. Failed groups always re-validate on each input.
-     */
+    /** Validator returning one message, several, or nothing when the value is acceptable; may be async. */
+    validate?: FieldValidator | undefined;
+    /** When validation first runs; a failed group always re-validates on every input. */
     mode?: FieldMode;
     /** Server-injected errors, always shown, listed before anything `validate` produces. */
-    errors?: string | string[];
-    /** Value handed to `validate`; omit and the Fieldset reads it off the discovered group control. */
+    errors?: string | string[] | undefined;
+    /** Value handed to `validate`; omit and the Fieldset reads it off the discovered group control. @default undefined — read off the discovered control */
     value?: unknown;
-    /** Field name, used as the `SkdxFormErrorSummary` link text when the group renders no error of its own. */
-    name?: string;
     /**
-     * Whether an answer is mandatory. Reflected onto the wrapped control as the
-     * native `required` attribute when it is an `<input>`/`<select>`/
-     * `<textarea>`, and as `aria-required="true"` when it is a group or a
-     * widget-role element, which has no native `required` to set.
-     *
-     * Render a `SkdxFieldRequiredIndicator` inside the `SkdxFieldLabel` to say
-     * so visibly; its text joins the control's accessible name.
+     * Field name, used as the `SkdxFormErrorSummary` link text when the group renders no error of its own.
+     * @default undefined
+     */
+    name?: string | undefined;
+    /**
+     * Whether an answer is mandatory, reflected onto the wrapped control as `required` or `aria-required`.
      * @default false
      */
     required?: boolean;
     /**
-     * Whether the field is unavailable. Applied to the wrapped control — the
-     * native `disabled` attribute where there is one, `aria-disabled="true"`
-     * otherwise, because a disabled *widget* stays focusable and stays
-     * announced — and mirrored as `data-disabled` on the Field root and the
-     * control for styling.
+     * Whether the field is unavailable, reflected onto the wrapped control as `disabled` or `aria-disabled`.
      * @default false
      */
     disabled?: boolean;
     /**
-     * Words the character-count copy and error; all three (displayed text,
-     * announced message, error) share one wording to avoid confusion. Negative
-     * `remaining` indicates over the limit.
+     * Words the character-count text, announcement, and over-limit error, which share one wording.
      * @default undefined — English "characters remaining"
      */
-    getCharacterCountMessage?: (remaining: number) => string;
+    getCharacterCountMessage?: ((remaining: number) => string) | undefined;
     /**
-     * What the group says when its discovered control fails native constraint
-     * validation but the browser reports no message of its own. The browser's
-     * own messages are already localized; this fallback is the one string in
-     * the native path that is not, so it is the only one worth overriding.
+     * Fallback message when the group's control fails native constraint validation with none of its own.
      * @default undefined — `NATIVE_INVALID_FALLBACK_MESSAGE` ('This field is invalid.').
      */
-    invalidMessage?: string;
+    invalidMessage?: string | undefined;
     /**
-     * How long, in milliseconds, `mode: 'change'` waits after the last
-     * keystroke before running `validate`. Only `change` mode is debounced, and
-     * a blur flushes the pending run immediately — the delay exists to keep a
-     * validator quiet *while* the user types, and a blur means they have
-     * stopped.
+     * Milliseconds `mode: 'change'` waits after the last keystroke before running `validate`.
      * @default 0 — no debounce.
      */
     validationDebounceTime?: number;
+    /**
+     * How tightly the skin packs the fieldset's contents, reflected as `data-density`.
+     * @default undefined — falls back to a `data-density` attribute.
+     */
+    density?: 'compact' | (string & {}) | undefined;
 };
 declare var __VLS_1: {};
 type __VLS_Slots = {} & {
     default?: (props: typeof __VLS_1) => any;
 };
 declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {
-    /**
-     * Runs validation now and returns validity. Validates server `errors`,
-     * the `validate` prop, native constraint validation, and character count.
-     */
+    /** Runs every validation source now and resolves to whether the group is valid. */
     checkValidity: () => Promise<boolean>;
-    /**
-     * Clear messages and state; re-derive `filled`/`count` from the control.
-     * Also clear the `errors` prop, which is re-applied on next render.
-     */
+    /** Clears messages and state, then re-derives `filled`/`count` from the control. */
     reset: () => void;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "validity-change": (detail: FieldValidityDetail) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
-    "onValidity-change"?: ((detail: FieldValidityDetail) => any) | undefined;
+    "onValidity-change"?: (detail: FieldValidityDetail) => any;
 }>, {
     disabled: boolean;
-    value: undefined;
     required: boolean;
-    name: string;
-    errors: string | string[];
-    validate: FieldValidator;
+    errors: string | string[] | undefined;
+    validate: FieldValidator | undefined;
     mode: FieldMode;
-    getCharacterCountMessage: (remaining: number) => string;
-    invalidMessage: string;
     validationDebounceTime: number;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;

package/dist/field/Fieldset.vue_vue_type_script_setup_true_lang.cjs

@@ -1 +1 @@
-const s=require("./useField.cjs");let e=require("vue");var f=(0,e.defineComponent)({__name:"Fieldset",props:{validate:{type:Function,default:void 0},mode:{default:"blur"},errors:{default:void 0},value:{default:void 0},name:{default:void 0},required:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},getCharacterCountMessage:{type:Function,default:void 0},invalidMessage:{default:void 0},validationDebounceTime:{default:0}},emits:["validity-change"],setup(a,{expose:l,emit:i}){const d=a,o=i,{rootRef:u,checkValidity:r,reset:n}=s.useField(d,!0,t=>o("validity-change",t));return l({checkValidity:r,reset:n}),(t,c)=>((0,e.openBlock)(),(0,e.createElementBlock)("fieldset",{ref_key:"rootRef",ref:u},[(0,e.renderSlot)(t.$slots,"default")],512))}});exports.default=f;
+const u=require("../utils/appearance.cjs"),c=require("./useField.cjs");let e=require("vue");var f=["disabled"],p=(0,e.defineComponent)({inheritAttrs:!1,__name:"Fieldset",props:{validate:{type:Function,default:void 0},mode:{default:"blur"},errors:{default:void 0},value:{},name:{},required:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},getCharacterCountMessage:{},invalidMessage:{},validationDebounceTime:{default:0},density:{}},emits:["validity-change"],setup(a,{expose:r,emit:i}){const d=a,s=i,{rootRef:l,checkValidity:n,reset:o}=c.useField(d,!0,t=>s("validity-change",t));return r({checkValidity:n,reset:o}),(t,v)=>((0,e.openBlock)(),(0,e.createElementBlock)("fieldset",(0,e.mergeProps)({ref_key:"rootRef",ref:l,class:"skdx-field","data-part":"root","data-skdx-component":"field",disabled:a.disabled},{...t.$attrs,...(0,e.unref)(u.appearanceAttrs)({density:a.density},t.$attrs)}),[(0,e.renderSlot)(t.$slots,"default")],16,f))}});exports.default=p;

package/dist/field/Fieldset.vue_vue_type_script_setup_true_lang.js

@@ -1 +1 @@
-import{useField as e}from"./useField.js";import{createElementBlock as t,defineComponent as a,openBlock as o,renderSlot as d}from"vue";var i=/* @__PURE__ */a({__name:"Fieldset",props:{validate:{type:Function,default:void 0},mode:{default:"blur"},errors:{default:void 0},value:{default:void 0},name:{default:void 0},required:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},getCharacterCountMessage:{type:Function,default:void 0},invalidMessage:{default:void 0},validationDebounceTime:{default:0}},emits:["validity-change"],setup(a,{expose:i,emit:l}){const r=a,s=l,{rootRef:u,checkValidity:n,reset:f}=e(r,!0,e=>s("validity-change",e));return i({checkValidity:n,reset:f}),(e,a)=>(o(),t("fieldset",{ref_key:"rootRef",ref:u},[d(e.$slots,"default")],512))}});export{i as default};
+import{appearanceAttrs as e}from"../utils/appearance.js";import{useField as t}from"./useField.js";import{createElementBlock as a,defineComponent as s,mergeProps as d,openBlock as i,renderSlot as r,unref as o}from"vue";var l=["disabled"],n=/* @__PURE__ */s({inheritAttrs:!1,__name:"Fieldset",props:{validate:{type:Function,default:void 0},mode:{default:"blur"},errors:{default:void 0},value:{},name:{},required:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},getCharacterCountMessage:{},invalidMessage:{},validationDebounceTime:{default:0},density:{}},emits:["validity-change"],setup(s,{expose:n,emit:u}){const f=s,p=u,{rootRef:c,checkValidity:m,reset:y}=t(f,!0,e=>p("validity-change",e));return n({checkValidity:m,reset:y}),(t,n)=>(i(),a("fieldset",d({ref_key:"rootRef",ref:c,class:"skdx-field","data-part":"root","data-skdx-component":"field",disabled:s.disabled},{...t.$attrs,...o(e)({density:s.density},t.$attrs)}),[r(t.$slots,"default")],16,l))}});export{n as default};

package/dist/field/context.d.cts

@@ -1,5 +1,5 @@
 import type { InjectionKey, Ref } from 'vue';
-import type { FieldCharacterCountOptions, FieldSnapshot } from './fieldCore.cjs';
+import type { FieldCharacterCountOptions, FieldSnapshot } from '../utils/field-core.cjs';
 /** Field state from `validity-change` events. */
 export type FieldValidityDetail = Omit<FieldSnapshot, 'controlId'>;
 /**
@@ -20,7 +20,7 @@ export interface FieldContext {
     /** Register character count options. */
     setCharacterCount: (options: FieldCharacterCountOptions | null) => void;
     /** Formats remaining characters for announcement. */
-    readonly getCharacterCountMessage?: (remaining: number) => string;
+    readonly getCharacterCountMessage?: ((remaining: number) => string) | undefined;
     /** Re-run DOM wiring when parts mount/unmount. */
     requestSync: () => void;
 }

package/dist/field/context.d.ts

@@ -1,5 +1,5 @@
 import type { InjectionKey, Ref } from 'vue';
-import type { FieldCharacterCountOptions, FieldSnapshot } from './fieldCore.js';
+import type { FieldCharacterCountOptions, FieldSnapshot } from '../utils/field-core.js';
 /** Field state from `validity-change` events. */
 export type FieldValidityDetail = Omit<FieldSnapshot, 'controlId'>;
 /**
@@ -20,7 +20,7 @@ export interface FieldContext {
     /** Register character count options. */
     setCharacterCount: (options: FieldCharacterCountOptions | null) => void;
     /** Formats remaining characters for announcement. */
-    readonly getCharacterCountMessage?: (remaining: number) => string;
+    readonly getCharacterCountMessage?: ((remaining: number) => string) | undefined;
     /** Re-run DOM wiring when parts mount/unmount. */
     requestSync: () => void;
 }

package/dist/field/index.d.cts

@@ -1,4 +1,4 @@
 export { default as SkdxField } from './Field.vue.cjs';
 export { default as SkdxFieldset } from './Fieldset.vue.cjs';
 export type { FieldValidityDetail } from './context.cjs';
-export type { FieldMode, FieldSnapshot, FieldValidator, FieldValidationResult } from './fieldCore.cjs';
+export type { FieldMode, FieldSnapshot, FieldValidator, FieldValidationResult, } from '../utils/field-core.cjs';

package/dist/field/index.d.ts

@@ -1,4 +1,4 @@
 export { default as SkdxField } from './Field.vue.js';
 export { default as SkdxFieldset } from './Fieldset.vue.js';
 export type { FieldValidityDetail } from './context.js';
-export type { FieldMode, FieldSnapshot, FieldValidator, FieldValidationResult } from './fieldCore.js';
+export type { FieldMode, FieldSnapshot, FieldValidator, FieldValidationResult, } from '../utils/field-core.js';

package/dist/field/primitives.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./fieldCore.cjs"),r=require("./FieldDescription.vue.cjs"),i=require("./FieldError.vue.cjs"),_=require("./FieldLabel.vue.cjs"),E=require("./FieldRequiredIndicator.vue.cjs"),t=require("./FieldRoot.vue.cjs"),d=require("./Fieldset.vue.cjs"),C=require("./FieldCharacterCount.vue.cjs");exports.CHARACTER_COUNT_ANNOUNCE_DELAY_MS=e.CHARACTER_COUNT_ANNOUNCE_DELAY_MS;exports.FIELD_CHARACTER_COUNT_ATTRIBUTE=e.FIELD_CHARACTER_COUNT_ATTRIBUTE;exports.FIELD_CONTROL_SELECTOR=e.FIELD_CONTROL_SELECTOR;exports.FIELD_REQUIRED_INDICATOR_ATTRIBUTE=e.FIELD_REQUIRED_INDICATOR_ATTRIBUTE;exports.FIELD_VALIDITY_CHANGE_EVENT=e.FIELD_VALIDITY_CHANGE_EVENT;exports.NATIVE_INVALID_FALLBACK_MESSAGE=e.NATIVE_INVALID_FALLBACK_MESSAGE;exports.SkdxFieldCharacterCount=C.default;exports.SkdxFieldDescription=r.default;exports.SkdxFieldError=i.default;exports.SkdxFieldLabel=_.default;exports.SkdxFieldRequiredIndicator=E.default;exports.SkdxFieldRoot=t.default;exports.SkdxFieldset=d.default;exports.characterCountMessage=e.characterCountMessage;exports.characterCountVisible=e.characterCountVisible;exports.findFieldControl=e.findFieldControl;
+Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../utils/field-core.cjs"),r=require("./FieldDescription.vue.cjs"),i=require("./FieldError.vue.cjs"),_=require("./FieldLabel.vue.cjs"),E=require("./FieldRequiredIndicator.vue.cjs"),t=require("./FieldRoot.vue.cjs"),d=require("./Fieldset.vue.cjs"),C=require("./FieldCharacterCount.vue.cjs");exports.CHARACTER_COUNT_ANNOUNCE_DELAY_MS=e.CHARACTER_COUNT_ANNOUNCE_DELAY_MS;exports.FIELD_CHARACTER_COUNT_ATTRIBUTE=e.FIELD_CHARACTER_COUNT_ATTRIBUTE;exports.FIELD_CONTROL_SELECTOR=e.FIELD_CONTROL_SELECTOR;exports.FIELD_REQUIRED_INDICATOR_ATTRIBUTE=e.FIELD_REQUIRED_INDICATOR_ATTRIBUTE;exports.FIELD_VALIDITY_CHANGE_EVENT=e.FIELD_VALIDITY_CHANGE_EVENT;exports.NATIVE_INVALID_FALLBACK_MESSAGE=e.NATIVE_INVALID_FALLBACK_MESSAGE;exports.SkdxFieldCharacterCount=C.default;exports.SkdxFieldDescription=r.default;exports.SkdxFieldError=i.default;exports.SkdxFieldLabel=_.default;exports.SkdxFieldRequiredIndicator=E.default;exports.SkdxFieldRoot=t.default;exports.SkdxFieldset=d.default;exports.characterCountMessage=e.characterCountMessage;exports.characterCountVisible=e.characterCountVisible;exports.findFieldControl=e.findFieldControl;

package/dist/field/primitives.d.cts

@@ -1,6 +1,5 @@
 /**
- * Advanced primitives for custom `SkdxField` layouts. Recipe built from these.
- * Root/Fieldset headless (derive nothing).
+ * Advanced primitives for custom `SkdxField` layouts; Root and Fieldset are headless and derive nothing.
  *
  * @example
  * ```vue
@@ -27,4 +26,4 @@ export { default as SkdxFieldDescription } from './FieldDescription.vue.cjs';
 export { default as SkdxFieldError } from './FieldError.vue.cjs';
 export { default as SkdxFieldCharacterCount } from './FieldCharacterCount.vue.cjs';
 export type { FieldValidityDetail } from './context.cjs';
-export { CHARACTER_COUNT_ANNOUNCE_DELAY_MS, characterCountMessage, characterCountVisible, FIELD_CHARACTER_COUNT_ATTRIBUTE, FIELD_REQUIRED_INDICATOR_ATTRIBUTE, FIELD_CONTROL_SELECTOR, FIELD_VALIDITY_CHANGE_EVENT, NATIVE_INVALID_FALLBACK_MESSAGE, findFieldControl, type FieldSnapshot, type FieldMode, type FieldValidator, type FieldValidationResult, type FieldCharacterCountOptions, } from './fieldCore.cjs';
+export { CHARACTER_COUNT_ANNOUNCE_DELAY_MS, characterCountMessage, characterCountVisible, FIELD_CHARACTER_COUNT_ATTRIBUTE, FIELD_REQUIRED_INDICATOR_ATTRIBUTE, FIELD_CONTROL_SELECTOR, FIELD_VALIDITY_CHANGE_EVENT, NATIVE_INVALID_FALLBACK_MESSAGE, findFieldControl, type FieldSnapshot, type FieldMode, type FieldValidator, type FieldValidationResult, type FieldCharacterCountOptions, } from '../utils/field-core.cjs';

package/dist/field/primitives.d.ts

@@ -1,6 +1,5 @@
 /**
- * Advanced primitives for custom `SkdxField` layouts. Recipe built from these.
- * Root/Fieldset headless (derive nothing).
+ * Advanced primitives for custom `SkdxField` layouts; Root and Fieldset are headless and derive nothing.
  *
  * @example
  * ```vue
@@ -27,4 +26,4 @@ export { default as SkdxFieldDescription } from './FieldDescription.vue.js';
 export { default as SkdxFieldError } from './FieldError.vue.js';
 export { default as SkdxFieldCharacterCount } from './FieldCharacterCount.vue.js';
 export type { FieldValidityDetail } from './context.js';
-export { CHARACTER_COUNT_ANNOUNCE_DELAY_MS, characterCountMessage, characterCountVisible, FIELD_CHARACTER_COUNT_ATTRIBUTE, FIELD_REQUIRED_INDICATOR_ATTRIBUTE, FIELD_CONTROL_SELECTOR, FIELD_VALIDITY_CHANGE_EVENT, NATIVE_INVALID_FALLBACK_MESSAGE, findFieldControl, type FieldSnapshot, type FieldMode, type FieldValidator, type FieldValidationResult, type FieldCharacterCountOptions, } from './fieldCore.js';
+export { CHARACTER_COUNT_ANNOUNCE_DELAY_MS, characterCountMessage, characterCountVisible, FIELD_CHARACTER_COUNT_ATTRIBUTE, FIELD_REQUIRED_INDICATOR_ATTRIBUTE, FIELD_CONTROL_SELECTOR, FIELD_VALIDITY_CHANGE_EVENT, NATIVE_INVALID_FALLBACK_MESSAGE, findFieldControl, type FieldSnapshot, type FieldMode, type FieldValidator, type FieldValidationResult, type FieldCharacterCountOptions, } from '../utils/field-core.js';

package/dist/field/primitives.js

@@ -1 +1 @@
-import{CHARACTER_COUNT_ANNOUNCE_DELAY_MS as e,FIELD_CHARACTER_COUNT_ATTRIBUTE as r,FIELD_CONTROL_SELECTOR as a,FIELD_REQUIRED_INDICATOR_ATTRIBUTE as s,FIELD_VALIDITY_CHANGE_EVENT as E,NATIVE_INVALID_FALLBACK_MESSAGE as i,characterCountMessage as o,characterCountVisible as _,findFieldControl as C}from"./fieldCore.js";import A from"./FieldDescription.vue.js";import T from"./FieldError.vue.js";import t from"./FieldLabel.vue.js";import d from"./FieldRequiredIndicator.vue.js";import I from"./FieldRoot.vue.js";import F from"./Fieldset.vue.js";import R from"./FieldCharacterCount.vue.js";export{e as CHARACTER_COUNT_ANNOUNCE_DELAY_MS,r as FIELD_CHARACTER_COUNT_ATTRIBUTE,a as FIELD_CONTROL_SELECTOR,s as FIELD_REQUIRED_INDICATOR_ATTRIBUTE,E as FIELD_VALIDITY_CHANGE_EVENT,i as NATIVE_INVALID_FALLBACK_MESSAGE,R as SkdxFieldCharacterCount,A as SkdxFieldDescription,T as SkdxFieldError,t as SkdxFieldLabel,d as SkdxFieldRequiredIndicator,I as SkdxFieldRoot,F as SkdxFieldset,o as characterCountMessage,_ as characterCountVisible,C as findFieldControl};
+import{CHARACTER_COUNT_ANNOUNCE_DELAY_MS as e,FIELD_CHARACTER_COUNT_ATTRIBUTE as r,FIELD_CONTROL_SELECTOR as s,FIELD_REQUIRED_INDICATOR_ATTRIBUTE as a,FIELD_VALIDITY_CHANGE_EVENT as E,NATIVE_INVALID_FALLBACK_MESSAGE as i,characterCountMessage as o,characterCountVisible as _,findFieldControl as C}from"../utils/field-core.js";import t from"./FieldDescription.vue.js";import A from"./FieldError.vue.js";import T from"./FieldLabel.vue.js";import d from"./FieldRequiredIndicator.vue.js";import I from"./FieldRoot.vue.js";import F from"./Fieldset.vue.js";import R from"./FieldCharacterCount.vue.js";export{e as CHARACTER_COUNT_ANNOUNCE_DELAY_MS,r as FIELD_CHARACTER_COUNT_ATTRIBUTE,s as FIELD_CONTROL_SELECTOR,a as FIELD_REQUIRED_INDICATOR_ATTRIBUTE,E as FIELD_VALIDITY_CHANGE_EVENT,i as NATIVE_INVALID_FALLBACK_MESSAGE,R as SkdxFieldCharacterCount,t as SkdxFieldDescription,A as SkdxFieldError,T as SkdxFieldLabel,d as SkdxFieldRequiredIndicator,I as SkdxFieldRoot,F as SkdxFieldset,o as characterCountMessage,_ as characterCountVisible,C as findFieldControl};