@skdx/vue 0.26.0

package/dist/field/FieldCharacterCount.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1 @@
+import{characterCountMessage as e,characterCountVisible as t}from"./fieldCore.js";import{FIELD_CONTEXT as a}from"./context.js";import{computed as r,createCommentVNode as o,createElementBlock as s,createTextVNode as n,defineComponent as c,inject as l,onUnmounted as d,openBlock as u,renderSlot as h,toDisplayString as i,watchEffect as m}from"vue";var C=["data-over-limit"],f=/* @__PURE__ */c({__name:"FieldCharacterCount",props:{maxLength:{},threshold:{default:0}},setup(c){const f=c,p=l(a);if(!p)throw new Error("<SkdxFieldCharacterCount> must be used inside <SkdxField> or <SkdxFieldset>.");m(()=>p.setCharacterCount({maxLength:f.maxLength,threshold:f.threshold}),{flush:"post"}),d(()=>p.setCharacterCount(null));const x=r(()=>t(p.count.value,f.maxLength,f.threshold)),v=r(()=>f.maxLength-p.count.value),g=r(()=>(p.getCharacterCountMessage??e)(v.value));return(e,t)=>x.value?(u(),s("span",{key:0,class:"skdx-field__character-count","data-part":"character-count","data-skdx-field-character-count":"","data-over-limit":v.value<0?"":void 0},[h(e.$slots,"default",{},()=>[n(i(g.value),1)])],8,C)):o("",!0)}});export{f as default};

package/dist/field/FieldDescription.vue.cjs

@@ -0,0 +1 @@
+const e=require("./FieldDescription.vue_vue_type_script_setup_true_lang.cjs");var t=e.default;exports.default=t;

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

@@ -0,0 +1,18 @@
+/**
+ * Help text for a `SkdxField`. Its generated `id` is added to the wrapped
+ * control's `aria-describedby`, so screen readers announce it *with* the
+ * control instead of leaving it to be discovered by browsing.
+ */
+type __VLS_Props = {};
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_component: 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: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

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

@@ -0,0 +1,18 @@
+/**
+ * Help text for a `SkdxField`. Its generated `id` is added to the wrapped
+ * control's `aria-describedby`, so screen readers announce it *with* the
+ * control instead of leaving it to be discovered by browsing.
+ */
+type __VLS_Props = {};
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_component: 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: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/field/FieldDescription.vue.js

@@ -0,0 +1 @@
+import e from"./FieldDescription.vue_vue_type_script_setup_true_lang.js";var t=e;export{t as default};

package/dist/field/FieldDescription.vue_vue_type_script_setup_true_lang.cjs

@@ -0,0 +1 @@
+const d=require("./context.cjs");let e=require("vue");var n=["id"],s=(0,e.defineComponent)({__name:"FieldDescription",setup(o){const t=(0,e.inject)(d.FIELD_CONTEXT);if(!t)throw new Error("<SkdxFieldDescription> must be used inside <SkdxField> or <SkdxFieldset>.");const{descriptionId:i}=t;return(r,c)=>((0,e.openBlock)(),(0,e.createElementBlock)("span",{class:"skdx-field__description","data-part":"description",id:(0,e.unref)(i),"data-skdx-field-description":""},[(0,e.renderSlot)(r.$slots,"default")],8,n))}});exports.default=s;

package/dist/field/FieldDescription.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1 @@
+import{FIELD_CONTEXT as e}from"./context.js";import{createElementBlock as s,defineComponent as t,inject as i,openBlock as d,renderSlot as o,unref as r}from"vue";var n=["id"],a=/* @__PURE__ */t({__name:"FieldDescription",setup(t){const a=i(e);if(!a)throw new Error("<SkdxFieldDescription> must be used inside <SkdxField> or <SkdxFieldset>.");const{descriptionId:c}=a;return(e,t)=>(d(),s("span",{class:"skdx-field__description","data-part":"description",id:r(c),"data-skdx-field-description":""},[o(e.$slots,"default")],8,n))}});export{a as default};

package/dist/field/FieldError.vue.cjs

@@ -0,0 +1 @@
+const e=require("./FieldError.vue_vue_type_script_setup_true_lang.cjs");var r=e.default;exports.default=r;

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

@@ -0,0 +1,22 @@
+/**
+ * The error text for a `SkdxField`. Renders nothing while the field is valid;
+ * once it renders, its generated `id` joins the control's `aria-describedby`
+ * and the control gains `aria-invalid="true"`.
+ *
+ * With no slot content it renders the field's current messages, which is also
+ * the text a `SkdxFormErrorSummary` uses for its link — pass your own content to
+ * override the copy.
+ */
+type __VLS_Props = {};
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_component: 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: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

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

@@ -0,0 +1,22 @@
+/**
+ * The error text for a `SkdxField`. Renders nothing while the field is valid;
+ * once it renders, its generated `id` joins the control's `aria-describedby`
+ * and the control gains `aria-invalid="true"`.
+ *
+ * With no slot content it renders the field's current messages, which is also
+ * the text a `SkdxFormErrorSummary` uses for its link — pass your own content to
+ * override the copy.
+ */
+type __VLS_Props = {};
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_component: 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: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/field/FieldError.vue.js

@@ -0,0 +1 @@
+import r from"./FieldError.vue_vue_type_script_setup_true_lang.js";var e=r;export{e as default};

package/dist/field/FieldError.vue_vue_type_script_setup_true_lang.cjs

@@ -0,0 +1 @@
+const n=require("./context.cjs");let e=require("vue");var i=["id"],l=(0,e.defineComponent)({__name:"FieldError",setup(s){const r=(0,e.inject)(n.FIELD_CONTEXT);if(!r)throw new Error("<SkdxFieldError> must be used inside <SkdxField> or <SkdxFieldset>.");const{errorId:o,errors:t}=r;return(d,u)=>(0,e.unref)(t).length>0?((0,e.openBlock)(),(0,e.createElementBlock)("span",{key:0,class:"skdx-field__error","data-part":"error",id:(0,e.unref)(o),"data-skdx-field-error":""},[(0,e.renderSlot)(d.$slots,"default",{},()=>[(0,e.createTextVNode)((0,e.toDisplayString)((0,e.unref)(t).join(" ")),1)])],8,i)):(0,e.createCommentVNode)("",!0)}});exports.default=l;

package/dist/field/FieldError.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1 @@
+import{FIELD_CONTEXT as e}from"./context.js";import{createCommentVNode as r,createElementBlock as o,createTextVNode as t,defineComponent as s,inject as a,openBlock as d,renderSlot as n,toDisplayString as i,unref as l}from"vue";var c=["id"],m=/* @__PURE__ */s({__name:"FieldError",setup(s){const m=a(e);if(!m)throw new Error("<SkdxFieldError> must be used inside <SkdxField> or <SkdxFieldset>.");const{errorId:f,errors:p}=m;return(e,s)=>l(p).length>0?(d(),o("span",{key:0,class:"skdx-field__error","data-part":"error",id:l(f),"data-skdx-field-error":""},[n(e.$slots,"default",{},()=>[t(i(l(p).join(" ")),1)])],8,c)):r("",!0)}});export{m as default};

package/dist/field/FieldLabel.vue.cjs

@@ -0,0 +1 @@
+const e=require("./FieldLabel.vue_vue_type_script_setup_true_lang.cjs");var u=e.default;exports.default=u;

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

@@ -0,0 +1,22 @@
+/**
+ * The label for a `SkdxField`'s control. Renders a `<label>` whose `for` points
+ * at whatever control the Field discovered — or a `<legend>` inside a
+ * `SkdxFieldset`, since a `<label for>` may not reference a
+ * `[role="radiogroup"]` (there the Field puts `aria-labelledby` on the group
+ * instead).
+ */
+type __VLS_Props = {};
+declare var __VLS_1: {}, __VLS_3: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+} & {
+    default?: (props: typeof __VLS_3) => any;
+};
+declare const __VLS_component: 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: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

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

@@ -0,0 +1,22 @@
+/**
+ * The label for a `SkdxField`'s control. Renders a `<label>` whose `for` points
+ * at whatever control the Field discovered — or a `<legend>` inside a
+ * `SkdxFieldset`, since a `<label for>` may not reference a
+ * `[role="radiogroup"]` (there the Field puts `aria-labelledby` on the group
+ * instead).
+ */
+type __VLS_Props = {};
+declare var __VLS_1: {}, __VLS_3: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+} & {
+    default?: (props: typeof __VLS_3) => any;
+};
+declare const __VLS_component: 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: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/field/FieldLabel.vue.js

@@ -0,0 +1 @@
+import e from"./FieldLabel.vue_vue_type_script_setup_true_lang.js";var t=e;export{t as default};

package/dist/field/FieldLabel.vue_vue_type_script_setup_true_lang.cjs

@@ -0,0 +1 @@
+const o=require("./context.cjs");let e=require("vue");var a=["id"],u=["id","for"],s=(0,e.defineComponent)({__name:"FieldLabel",setup(i){const l=(0,e.inject)(o.FIELD_CONTEXT);if(!l)throw new Error("<SkdxFieldLabel> must be used inside <SkdxField> or <SkdxFieldset>.");const{labelId:t,controlId:d,grouped:n}=l;return(0,e.onMounted)(l.requestSync),(0,e.onUnmounted)(l.requestSync),(r,_)=>(0,e.unref)(n)?((0,e.openBlock)(),(0,e.createElementBlock)("legend",{key:0,class:"skdx-field__label","data-part":"label",id:(0,e.unref)(t)},[(0,e.renderSlot)(r.$slots,"default")],8,a)):((0,e.openBlock)(),(0,e.createElementBlock)("label",{key:1,class:"skdx-field__label","data-part":"label",id:(0,e.unref)(t),for:(0,e.unref)(d)},[(0,e.renderSlot)(r.$slots,"default")],8,u))}});exports.default=s;

package/dist/field/FieldLabel.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1 @@
+import{FIELD_CONTEXT as e}from"./context.js";import{createElementBlock as l,defineComponent as a,inject as t,onMounted as d,onUnmounted as s,openBlock as o,renderSlot as r,unref as n}from"vue";var i=["id"],u=["id","for"],c=/* @__PURE__ */a({__name:"FieldLabel",setup(a){const c=t(e);if(!c)throw new Error("<SkdxFieldLabel> must be used inside <SkdxField> or <SkdxFieldset>.");const{labelId:f,controlId:b,grouped:k}=c;return d(c.requestSync),s(c.requestSync),(e,a)=>n(k)?(o(),l("legend",{key:0,class:"skdx-field__label","data-part":"label",id:n(f)},[r(e.$slots,"default")],8,i)):(o(),l("label",{key:1,class:"skdx-field__label","data-part":"label",id:n(f),for:n(b)},[r(e.$slots,"default")],8,u))}});export{c as default};

package/dist/field/Fieldset.vue.cjs

@@ -0,0 +1 @@
+const e=require("./Fieldset.vue_vue_type_script_setup_true_lang.cjs");var t=e.default;exports.default=t;

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

@@ -0,0 +1,79 @@
+import type { FieldValidityDetail } from './context.cjs';
+import type { FieldMode, FieldValidator } from './fieldCore.cjs';
+/**
+ * A `SkdxField` that renders a `<fieldset>` and puts its `SkdxFieldLabel` in a
+ * `<legend>` — the grouping a `SkdxRadioGroup` or a set of checkboxes needs,
+ * since a `<label for>` may not point at a `[role="radiogroup"]`. Same props,
+ * same validation model, same state hooks; the group control is named with
+ * `aria-labelledby` back to the legend instead of `for`/`id`.
+ *
+ * @example
+ * ```vue
+ * <SkdxFieldset :validate="(value) => (value ? null : 'Choose a plan')">
+ *   <SkdxFieldLabel>Plan</SkdxFieldLabel>
+ *   <SkdxRadioGroup>…</SkdxRadioGroup>
+ *   <SkdxFieldError />
+ * </SkdxFieldset>
+ * ```
+ */
+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. Whatever the mode, a group that has already
+     * failed 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. */
+    value?: unknown;
+    /** Field name, used as the `SkdxFormErrorSummary` link text when the group renders no error of its own. */
+    name?: string;
+    /**
+     * Words the character-count copy — the text `SkdxFieldCharacterCount`
+     * renders, the message announced one typing pause later, and the error
+     * raised once the value goes over the soft limit. All three share one
+     * wording deliberately: a screen-reader user hearing a different sentence
+     * from the one on screen has to work out whether they are the same fact.
+     * A negative `remaining` means over the limit.
+     * @default undefined — `characterCountMessage`'s English wording ("50 characters remaining").
+     */
+    getCharacterCountMessage?: (remaining: number) => string;
+    /**
+     * 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.
+     * @default undefined — `NATIVE_INVALID_FALLBACK_MESSAGE` ('This field is invalid.').
+     */
+    invalidMessage?: string;
+};
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+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;
+}>, {
+    name: string;
+    value: undefined;
+    mode: FieldMode;
+    errors: string | string[];
+    validate: FieldValidator;
+    getCharacterCountMessage: (remaining: number) => string;
+    invalidMessage: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

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

@@ -0,0 +1,79 @@
+import type { FieldValidityDetail } from './context.js';
+import type { FieldMode, FieldValidator } from './fieldCore.js';
+/**
+ * A `SkdxField` that renders a `<fieldset>` and puts its `SkdxFieldLabel` in a
+ * `<legend>` — the grouping a `SkdxRadioGroup` or a set of checkboxes needs,
+ * since a `<label for>` may not point at a `[role="radiogroup"]`. Same props,
+ * same validation model, same state hooks; the group control is named with
+ * `aria-labelledby` back to the legend instead of `for`/`id`.
+ *
+ * @example
+ * ```vue
+ * <SkdxFieldset :validate="(value) => (value ? null : 'Choose a plan')">
+ *   <SkdxFieldLabel>Plan</SkdxFieldLabel>
+ *   <SkdxRadioGroup>…</SkdxRadioGroup>
+ *   <SkdxFieldError />
+ * </SkdxFieldset>
+ * ```
+ */
+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. Whatever the mode, a group that has already
+     * failed 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. */
+    value?: unknown;
+    /** Field name, used as the `SkdxFormErrorSummary` link text when the group renders no error of its own. */
+    name?: string;
+    /**
+     * Words the character-count copy — the text `SkdxFieldCharacterCount`
+     * renders, the message announced one typing pause later, and the error
+     * raised once the value goes over the soft limit. All three share one
+     * wording deliberately: a screen-reader user hearing a different sentence
+     * from the one on screen has to work out whether they are the same fact.
+     * A negative `remaining` means over the limit.
+     * @default undefined — `characterCountMessage`'s English wording ("50 characters remaining").
+     */
+    getCharacterCountMessage?: (remaining: number) => string;
+    /**
+     * 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.
+     * @default undefined — `NATIVE_INVALID_FALLBACK_MESSAGE` ('This field is invalid.').
+     */
+    invalidMessage?: string;
+};
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+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;
+}>, {
+    name: string;
+    value: undefined;
+    mode: FieldMode;
+    errors: string | string[];
+    validate: FieldValidator;
+    getCharacterCountMessage: (remaining: number) => string;
+    invalidMessage: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/field/Fieldset.vue.js

@@ -0,0 +1 @@
+import e from"./Fieldset.vue_vue_type_script_setup_true_lang.js";var t=e;export{t as default};

package/dist/field/Fieldset.vue_vue_type_script_setup_true_lang.cjs

@@ -0,0 +1 @@
+const l=require("./useField.cjs");let e=require("vue");var o=(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},getCharacterCountMessage:{type:Function,default:void 0},invalidMessage:{default:void 0}},emits:["validity-change"],setup(r,{emit:u}){const a=r,d=u,i=l.useField(a,!0,t=>d("validity-change",t));return(t,n)=>((0,e.openBlock)(),(0,e.createElementBlock)("fieldset",{ref_key:"rootRef",ref:i},[(0,e.renderSlot)(t.$slots,"default")],512))}});exports.default=o;

package/dist/field/Fieldset.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +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},getCharacterCountMessage:{type:Function,default:void 0},invalidMessage:{default:void 0}},emits:["validity-change"],setup(a,{emit:i}){const l=i,s=e(a,!0,e=>l("validity-change",e));return(e,a)=>(o(),t("fieldset",{ref_key:"rootRef",ref:s},[d(e.$slots,"default")],512))}});export{i as default};

package/dist/field/context.cjs

@@ -0,0 +1 @@
+const d=require("../utils/id.cjs");var i=Symbol("skdx-field-context");function n(e){return d.nextId(`field-${e}`)}exports.FIELD_CONTEXT=i;exports.nextFieldId=n;

package/dist/field/context.d.cts

@@ -0,0 +1,42 @@
+import type { InjectionKey, Ref } from 'vue';
+import type { FieldCharacterCountOptions, FieldSnapshot } from './fieldCore.cjs';
+/** The state a Field reports through its `validity-change` event. */
+export type FieldValidityDetail = Omit<FieldSnapshot, 'controlId'>;
+/**
+ * @internal Field identity and state distributed to `SkdxFieldLabel`,
+ * `SkdxFieldDescription`, and `SkdxFieldError`. `controlId` and `errors` are refs
+ * because the controller rewrites them after mount — it adopts a control that
+ * brought its own id, and replaces the message list on every validation run.
+ */
+export interface FieldContext {
+    labelId: string;
+    descriptionId: string;
+    errorId: string;
+    controlId: Ref<string>;
+    errors: Ref<string[]>;
+    /** True for a `SkdxFieldset`: the Label is a `<legend>` and the control is named by `aria-labelledby`. */
+    grouped: boolean;
+    /** Length of the wrapped control's current value, for `SkdxFieldCharacterCount`. */
+    count: Ref<number>;
+    /** Registers (or clears, with `null`) the field's character count. */
+    setCharacterCount: (options: FieldCharacterCountOptions | null) => void;
+    /**
+     * The root's `getCharacterCountMessage`, so the rendered count uses the same
+     * wording as the announced one. Provided as an accessor rather than a
+     * snapshot, so a wording swapped after mount reaches
+     * `SkdxFieldCharacterCount`.
+     */
+    readonly getCharacterCountMessage?: (remaining: number) => string;
+    /**
+     * Re-runs the controller's DOM wiring. Parts whose *presence* the engine
+     * reads from the DOM (the Label, via `getElementById`) call this when they
+     * mount or unmount — nothing the Field's own effect tracks changes with a
+     * slotted part's lifecycle, so without the nudge a `<legend>` unmounting
+     * would leave its `aria-labelledby` IDREF dangling on the group.
+     */
+    requestSync: () => void;
+}
+/** @internal Injection key a Field/Fieldset provides so its Label, Description, and Error share its ids and state. */
+export declare const FIELD_CONTEXT: InjectionKey<FieldContext>;
+/** @internal Generates a unique id for one of a Field's four wired parts. */
+export declare function nextFieldId(part: 'label' | 'description' | 'error' | 'control'): string;

package/dist/field/context.d.ts

@@ -0,0 +1,42 @@
+import type { InjectionKey, Ref } from 'vue';
+import type { FieldCharacterCountOptions, FieldSnapshot } from './fieldCore.js';
+/** The state a Field reports through its `validity-change` event. */
+export type FieldValidityDetail = Omit<FieldSnapshot, 'controlId'>;
+/**
+ * @internal Field identity and state distributed to `SkdxFieldLabel`,
+ * `SkdxFieldDescription`, and `SkdxFieldError`. `controlId` and `errors` are refs
+ * because the controller rewrites them after mount — it adopts a control that
+ * brought its own id, and replaces the message list on every validation run.
+ */
+export interface FieldContext {
+    labelId: string;
+    descriptionId: string;
+    errorId: string;
+    controlId: Ref<string>;
+    errors: Ref<string[]>;
+    /** True for a `SkdxFieldset`: the Label is a `<legend>` and the control is named by `aria-labelledby`. */
+    grouped: boolean;
+    /** Length of the wrapped control's current value, for `SkdxFieldCharacterCount`. */
+    count: Ref<number>;
+    /** Registers (or clears, with `null`) the field's character count. */
+    setCharacterCount: (options: FieldCharacterCountOptions | null) => void;
+    /**
+     * The root's `getCharacterCountMessage`, so the rendered count uses the same
+     * wording as the announced one. Provided as an accessor rather than a
+     * snapshot, so a wording swapped after mount reaches
+     * `SkdxFieldCharacterCount`.
+     */
+    readonly getCharacterCountMessage?: (remaining: number) => string;
+    /**
+     * Re-runs the controller's DOM wiring. Parts whose *presence* the engine
+     * reads from the DOM (the Label, via `getElementById`) call this when they
+     * mount or unmount — nothing the Field's own effect tracks changes with a
+     * slotted part's lifecycle, so without the nudge a `<legend>` unmounting
+     * would leave its `aria-labelledby` IDREF dangling on the group.
+     */
+    requestSync: () => void;
+}
+/** @internal Injection key a Field/Fieldset provides so its Label, Description, and Error share its ids and state. */
+export declare const FIELD_CONTEXT: InjectionKey<FieldContext>;
+/** @internal Generates a unique id for one of a Field's four wired parts. */
+export declare function nextFieldId(part: 'label' | 'description' | 'error' | 'control'): string;

package/dist/field/context.js

@@ -0,0 +1 @@
+import{nextId as t}from"../utils/id.js";var e=/* @__PURE__ */Symbol("skdx-field-context");function d(e){return t(`field-${e}`)}export{e as FIELD_CONTEXT,d as nextFieldId};

package/dist/field/fieldCore.cjs

@@ -0,0 +1 @@
+var E="validity-change",f="data-skdx-field",u="data-skdx-field-name",h="data-skdx-field-message",v="data-skdx-field-description",T="data-skdx-field-error",y="data-skdx-field-character-count",A=1e3;function g(t){const e=Math.abs(t),r=e===1?"character":"characters";return t<0?`You have ${e} ${r} too many`:`You have ${e} ${r} remaining`}function b(t,e,r=0){return r<=0?!0:t>=e*r/100}var R="This field is invalid.",I="data-skdx-field-control",C=[`[${I}]`,'input:not([type="hidden"])',"select","textarea",'[role="textbox"]','[role="searchbox"]','[role="combobox"]','[role="listbox"]','[role="radiogroup"]','[role="group"]','[role="slider"]','[role="spinbutton"]','[role="checkbox"]','[role="radio"]','[role="switch"]'].join(", "),O=new Set(["radiogroup","group"]),S=['input:not([disabled]):not([type="hidden"])',"select:not([disabled])","textarea:not([disabled])","button:not([disabled])",'[tabindex]:not([tabindex="-1"])'].join(", ");function d(t){return t==null?[]:(Array.isArray(t)?t:[t]).filter(e=>typeof e=="string"&&e.trim()!=="")}function p(t){for(const e of Array.from(t.querySelectorAll(C)))if(e.getAttribute("aria-hidden")!=="true"&&e.closest("[data-skdx-field]")===t)return e;return null}function c(t,e){for(const r of Array.from(t.querySelectorAll(e)))if(r.closest("[data-skdx-field]")===t)return r;return null}function L(t){if(!t)return;const e=t;return e.type==="checkbox"||e.type==="radio"?e.checked:"value"in t?e.value:t.querySelector('input[aria-hidden="true"]')?.value}function l(t){return t==null||t===!1||t===""?!1:!(Array.isArray(t)&&t.length===0)}function o(t,e,r){r?t.setAttribute(e,""):t.removeAttribute(e)}function D(t,...e){const r=t.split(/\s+/).filter(Boolean);for(const i of e)i&&!r.includes(i)&&r.push(i);return r.join(" ")}function F(t){return t.closest("form, skdx-form")??t.parentElement??t}function x(t){return Array.from(t.querySelectorAll(`[${f}][data-invalid]`)).flatMap(e=>{const r=p(e),i=c(e,"[data-skdx-field-error]")?.textContent?.trim()||e.getAttribute("data-skdx-field-message")||e.getAttribute("data-skdx-field-name")||"";return!r?.id||!i?[]:[{id:r.id,message:i}]})}function N(t,e=document){const r=e.getElementById(t);if(!r)return;const i=r.getAttribute("role"),s=(r.tagName==="FIELDSET"||i!==null&&O.has(i)?r.querySelector(S):null)??r;s.focus(),s.scrollIntoView?.({block:"center"})}var V=class{constructor(t){this.options=t,this.props={},this.root=null,this.form=null,this.control=null,this.baseDescribedBy="",this.runToken=0,this.pending=!1,this.injected=[],this.custom=[],this.characterCount=null,this.handleInput=()=>{const e=this.isOverLimit(this.snapshot.count),r=this.readCount();this.update({dirty:!0,filled:l(this.resolveValue()),count:r,errors:this.composeErrors(r)}),this.scheduleCountAnnouncement(r,e),(this.props.mode==="change"||this.snapshot.errors.length>0)&&this.runValidation()},this.handleFocusOut=()=>{const e=this.readCount();this.update({touched:!0,filled:l(this.resolveValue()),count:e,errors:this.composeErrors(e)}),((this.props.mode??"blur")==="blur"||this.snapshot.errors.length>0)&&this.runValidation()},this.handleSubmit=e=>{if(e.target?.closest?.("form")!==this.form)return;this.markTouched();const r=this.runValidation({silent:!0});if(m(r)){e.preventDefault();return}(r.length>0||this.pending)&&e.preventDefault()},this.snapshot={controlId:t.controlId,errors:[],valid:!0,touched:!1,dirty:!1,filled:!1,count:0}}get state(){return this.snapshot}setProps(t){this.props=t;const e=d(t.errors??null);B(this.injected,e)||(this.injected=e,this.update({errors:this.composeErrors()}))}setCharacterCount(t){if((this.characterCount?.maxLength??null)===(t?.maxLength??null)&&(this.characterCount?.threshold??0)===(t?.threshold??0))return;this.characterCount=t;const e=this.readCount();this.update({count:e,errors:this.composeErrors(e)})}readCount(){const t=this.resolveValue();return typeof t=="string"?t.length:0}countMessage(t){return(this.props.getCharacterCountMessage??g)(t)}isOverLimit(t){return this.characterCount!==null&&t>this.characterCount.maxLength}composeErrors(t=this.snapshot.count){const e=[...this.injected,...this.custom];return this.characterCount&&this.isOverLimit(t)&&e.push(this.countMessage(this.characterCount.maxLength-t)),e}scheduleCountAnnouncement(t,e){const r=this.characterCount;if(!r)return;if(clearTimeout(this.announceTimer),this.isOverLimit(t)){e||this.options.announce(this.countMessage(r.maxLength-t),"assertive");return}if(!b(t,r.maxLength,r.threshold))return;const i=r.maxLength-t;this.announceTimer=setTimeout(()=>{this.options.announce(this.countMessage(i),"polite")},A)}connect(t){this.root=t,t.setAttribute(f,""),t.addEventListener("input",this.handleInput,!0),t.addEventListener("change",this.handleInput,!0),t.addEventListener("focusout",this.handleFocusOut,!0),this.form=t.closest("form"),this.form&&t.ownerDocument.addEventListener("submit",this.handleSubmit,!0),this.sync();const e=this.readCount();this.update({filled:l(this.resolveValue()),count:e,errors:this.composeErrors(e)})}disconnect(){clearTimeout(this.announceTimer);const t=this.root;t&&(t.removeEventListener("input",this.handleInput,!0),t.removeEventListener("change",this.handleInput,!0),t.removeEventListener("focusout",this.handleFocusOut,!0),this.form&&t.ownerDocument.removeEventListener("submit",this.handleSubmit,!0),this.root=null,this.form=null,this.control=null)}sync(){const t=this.root;if(!t)return;const e=p(t);e!==this.control&&(this.control=e,this.baseDescribedBy=e?.getAttribute("aria-describedby")??"");const{name:r}=this.props;r?t.setAttribute(u,r):t.removeAttribute(u);const i=this.snapshot.errors.join(" ");if(i?t.setAttribute(h,i):t.removeAttribute(h),this.applyStateAttributes(t),!e)return;e.id||(e.id=this.options.controlId),e.id!==this.snapshot.controlId&&(this.snapshot={...this.snapshot,controlId:e.id},this.options.onSnapshotChange(this.snapshot));const s=c(t,`[${v}]`)!==null,n=c(t,`[${T}]`)!==null,a=D(this.baseDescribedBy,s?this.options.descriptionId:void 0,n?this.options.errorId:void 0);a?e.setAttribute("aria-describedby",a):e.removeAttribute("aria-describedby"),this.snapshot.errors.length>0?e.setAttribute("aria-invalid","true"):e.removeAttribute("aria-invalid");const _=t.ownerDocument.getElementById(this.options.labelId)!==null;this.options.grouped&&_?e.setAttribute("aria-labelledby",this.options.labelId):e.getAttribute("aria-labelledby")===this.options.labelId&&e.removeAttribute("aria-labelledby"),this.applyStateAttributes(e)}validate(){return Promise.resolve(this.runValidation()).then(t=>t.length===0)}markTouched(){this.snapshot.touched||this.update({touched:!0})}applyStateAttributes(t){const{errors:e,touched:r,dirty:i,filled:s,count:n}=this.snapshot;o(t,"data-invalid",e.length>0),o(t,"data-valid",e.length===0),o(t,"data-touched",r),o(t,"data-dirty",i),o(t,"data-filled",s),o(t,"data-over-limit",this.isOverLimit(n))}resolveValue(){return this.props.value!==void 0?this.props.value:L(this.control)}nativeMessage(){const t=this.control;return!t?.validity||t.validity.valid?null:t.validationMessage||this.props.invalidMessage||"This field is invalid."}runValidation(t={}){const e=++this.runToken,r=this.props.validate?.(this.resolveValue());return m(r)?(this.pending=!0,Promise.resolve(r).then(i=>e!==this.runToken?this.snapshot.errors:(this.pending=!1,this.commit(i,t)))):this.commit(r,t)}commit(t,e){if(this.custom=d(t),this.custom.length===0&&this.injected.length===0){const a=this.nativeMessage();a&&(this.custom=[a])}const r=this.readCount(),i=this.composeErrors(r),s=this.snapshot.errors.length===0;this.update({errors:i,count:r,filled:l(this.resolveValue())});const n=i[0];return n&&s&&!e.silent&&this.options.announce(n,"assertive"),i}update(t){const e={...this.snapshot,...t,valid:!0};e.valid=e.errors.length===0,!M(this.snapshot,e)&&(this.snapshot=e,this.sync(),this.options.onSnapshotChange(e),this.root?.dispatchEvent(new CustomEvent(E,{bubbles:!0,composed:!0,detail:{valid:e.valid,errors:e.errors,touched:e.touched,dirty:e.dirty,filled:e.filled,count:e.count}})))}};function m(t){return typeof t?.then=="function"}function B(t,e){return t.length===e.length&&t.every((r,i)=>r===e[i])}function M(t,e){return t.controlId===e.controlId&&t.valid===e.valid&&t.touched===e.touched&&t.dirty===e.dirty&&t.filled===e.filled&&t.count===e.count&&t.errors.length===e.errors.length&&t.errors.every((r,i)=>r===e.errors[i])}exports.CHARACTER_COUNT_ANNOUNCE_DELAY_MS=A;exports.FIELD_CHARACTER_COUNT_ATTRIBUTE=y;exports.FIELD_CONTROL_ATTRIBUTE=I;exports.FIELD_CONTROL_SELECTOR=C;exports.FIELD_DESCRIPTION_ATTRIBUTE=v;exports.FIELD_ERROR_ATTRIBUTE=T;exports.FIELD_MESSAGE_ATTRIBUTE=h;exports.FIELD_NAME_ATTRIBUTE=u;exports.FIELD_ROOT_ATTRIBUTE=f;exports.FIELD_VALIDITY_CHANGE_EVENT=E;exports.FieldController=V;exports.NATIVE_INVALID_FALLBACK_MESSAGE=R;exports.characterCountMessage=g;exports.characterCountVisible=b;exports.collectFieldErrors=x;exports.errorSummaryScope=F;exports.findFieldControl=p;exports.focusFieldTarget=N;exports.isFilled=l;exports.normalizeMessages=d;exports.readControlValue=L;