@skdx/vue 0.26.0

package/dist/tags-input/TagsInputInput.vue.cjs

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

package/dist/tags-input/TagsInputInput.vue.d.cts

@@ -0,0 +1,11 @@
+/**
+ * Text field for typing and committing new tags within a `SkdxTagsInput`. Its
+ * draft text lives on the root (control it with the root's
+ * `v-model:input-value`). Enter or the root's `delimiter` commits the draft as
+ * a tag; Backspace on an empty field removes the last tag; pasting splits on
+ * the delimiter and commits every piece at once while the root's `addOnPaste`
+ * is set.
+ */
+type __VLS_Props = {};
+declare const _default: 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>;
+export default _default;

package/dist/tags-input/TagsInputInput.vue.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Text field for typing and committing new tags within a `SkdxTagsInput`. Its
+ * draft text lives on the root (control it with the root's
+ * `v-model:input-value`). Enter or the root's `delimiter` commits the draft as
+ * a tag; Backspace on an empty field removes the last tag; pasting splits on
+ * the delimiter and commits every piece at once while the root's `addOnPaste`
+ * is set.
+ */
+type __VLS_Props = {};
+declare const _default: 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>;
+export default _default;

package/dist/tags-input/TagsInputInput.vue.js

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

package/dist/tags-input/TagsInputInput.vue_vue_type_script_setup_true_lang.cjs

@@ -0,0 +1 @@
+const i=require("../utils/reassertValue.cjs"),s=require("./context.cjs");let a=require("vue");var v=["disabled","readonly","aria-invalid","aria-readonly","data-disabled","data-invalid","data-readonly","value"],o=(0,a.defineComponent)({__name:"TagsInputInput",setup(p){const e=(0,a.inject)(s.TAGS_INPUT_CONTEXT);if(!e)throw new Error("<SkdxTagsInputInput> must be used inside <SkdxTagsInput>.");const n=(0,a.computed)(()=>e.inputValue.value);function l(t){const u=t.target;e.setInputValue(u.value),i.reassertValue(u,()=>e.inputValue.value)}function d(t){e.disabled.value||(t.key==="Enter"||t.key===e.delimiter.value?(t.preventDefault(),e.addTag(n.value),e.setInputValue("")):t.key==="Backspace"&&n.value===""&&e.value.value.length>0&&e.removeTag(e.value.value.length-1))}function r(t){if(e.disabled.value||!e.addOnPaste.value)return;t.preventDefault();const u=t.clipboardData?.getData("text")??"";e.addTags(u.split(e.delimiter.value)),e.setInputValue("")}return(t,u)=>((0,a.openBlock)(),(0,a.createElementBlock)("input",{class:"skdx-tags-input__input","data-part":"input",type:"text","data-skdx-tags-input-field":"",disabled:(0,a.unref)(e).disabled.value,readonly:(0,a.unref)(e).readOnly.value,"aria-invalid":(0,a.unref)(e).invalid.value?!0:void 0,"aria-readonly":(0,a.unref)(e).readOnly.value?!0:void 0,"data-disabled":(0,a.unref)(e).disabled.value?"":void 0,"data-invalid":(0,a.unref)(e).invalid.value?"":void 0,"data-readonly":(0,a.unref)(e).readOnly.value?"":void 0,value:n.value,onInput:l,onKeydown:d,onPaste:r},null,40,v))}});exports.default=o;

package/dist/tags-input/TagsInputInput.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1 @@
+import{reassertValue as a}from"../utils/reassertValue.js";import{TAGS_INPUT_CONTEXT as e}from"./context.js";import{computed as t,createElementBlock as l,defineComponent as n,inject as d,openBlock as u,unref as i}from"vue";var s=["disabled","readonly","aria-invalid","aria-readonly","data-disabled","data-invalid","data-readonly","value"],r=/* @__PURE__ */n({__name:"TagsInputInput",setup(n){const r=d(e);if(!r)throw new Error("<SkdxTagsInputInput> must be used inside <SkdxTagsInput>.");const o=t(()=>r.inputValue.value);function v(e){const t=e.target;r.setInputValue(t.value),a(t,()=>r.inputValue.value)}function p(a){r.disabled.value||("Enter"===a.key||a.key===r.delimiter.value?(a.preventDefault(),r.addTag(o.value),r.setInputValue("")):"Backspace"===a.key&&""===o.value&&r.value.value.length>0&&r.removeTag(r.value.value.length-1))}function c(a){if(r.disabled.value||!r.addOnPaste.value)return;a.preventDefault();const e=a.clipboardData?.getData("text")??"";r.addTags(e.split(r.delimiter.value)),r.setInputValue("")}return(a,e)=>(u(),l("input",{class:"skdx-tags-input__input","data-part":"input",type:"text","data-skdx-tags-input-field":"",disabled:i(r).disabled.value,readonly:i(r).readOnly.value,"aria-invalid":!!i(r).invalid.value||void 0,"aria-readonly":!!i(r).readOnly.value||void 0,"data-disabled":i(r).disabled.value?"":void 0,"data-invalid":i(r).invalid.value?"":void 0,"data-readonly":i(r).readOnly.value?"":void 0,value:o.value,onInput:v,onKeydown:p,onPaste:c},null,40,s))}});export{r as default};

package/dist/tags-input/TagsInputItem.vue.cjs

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

package/dist/tags-input/TagsInputItem.vue.d.cts

@@ -0,0 +1,21 @@
+/**
+ * A single rendered tag within a `SkdxTagsInput`. Renders a plain `<span>`
+ * with `data-disabled` mirroring the root; typically wraps the tag's label
+ * and a `SkdxTagsInputItemDelete`.
+ */
+type __VLS_Props = {
+    /** Position of this tag in the root's `value` array; passed through to `SkdxTagsInputItemDelete`. */
+    index: number;
+};
+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/tags-input/TagsInputItem.vue.d.ts

@@ -0,0 +1,21 @@
+/**
+ * A single rendered tag within a `SkdxTagsInput`. Renders a plain `<span>`
+ * with `data-disabled` mirroring the root; typically wraps the tag's label
+ * and a `SkdxTagsInputItemDelete`.
+ */
+type __VLS_Props = {
+    /** Position of this tag in the root's `value` array; passed through to `SkdxTagsInputItemDelete`. */
+    index: number;
+};
+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/tags-input/TagsInputItem.vue.js

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

package/dist/tags-input/TagsInputItem.vue_vue_type_script_setup_true_lang.cjs

@@ -0,0 +1 @@
+const n=require("./context.cjs");let e=require("vue");var r=["data-disabled"],s=(0,e.defineComponent)({__name:"TagsInputItem",props:{index:{}},setup(u){const t=(0,e.inject)(n.TAGS_INPUT_CONTEXT);if(!t)throw new Error("<SkdxTagsInputItem> must be used inside <SkdxTagsInput>.");return(a,d)=>((0,e.openBlock)(),(0,e.createElementBlock)("span",{class:"skdx-tags-input__item","data-part":"item","data-disabled":(0,e.unref)(t).disabled.value?"":void 0},[(0,e.renderSlot)(a.$slots,"default")],8,r))}});exports.default=s;

package/dist/tags-input/TagsInputItem.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1 @@
+import{TAGS_INPUT_CONTEXT as e}from"./context.js";import{createElementBlock as t,defineComponent as a,inject as s,openBlock as d,renderSlot as n,unref as o}from"vue";var r=["data-disabled"],i=/* @__PURE__ */a({__name:"TagsInputItem",props:{index:{}},setup(a){const i=s(e);if(!i)throw new Error("<SkdxTagsInputItem> must be used inside <SkdxTagsInput>.");return(e,a)=>(d(),t("span",{class:"skdx-tags-input__item","data-part":"item","data-disabled":o(i).disabled.value?"":void 0},[n(e.$slots,"default")],8,r))}});export{i as default};

package/dist/tags-input/TagsInputItemDelete.vue.cjs

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

package/dist/tags-input/TagsInputItemDelete.vue.d.cts

@@ -0,0 +1,26 @@
+/**
+ * Removes its parent `SkdxTagsInputItem` from the tag list on click. Renders
+ * a `<button type="button">` with an auto-generated
+ * `aria-label="Remove <tag>"`, disabled and `data-disabled` when the root
+ * is disabled.
+ *
+ * Because the button is its own tab stop, it hands focus to the next delete
+ * button (or the previous one, or the draft field) *before* signalling the
+ * removal, so deleting a tag never drops focus onto `<body>`.
+ */
+type __VLS_Props = {
+    /** Position of the tag to remove in the root's `value` array. */
+    index: number;
+};
+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/tags-input/TagsInputItemDelete.vue.d.ts

@@ -0,0 +1,26 @@
+/**
+ * Removes its parent `SkdxTagsInputItem` from the tag list on click. Renders
+ * a `<button type="button">` with an auto-generated
+ * `aria-label="Remove <tag>"`, disabled and `data-disabled` when the root
+ * is disabled.
+ *
+ * Because the button is its own tab stop, it hands focus to the next delete
+ * button (or the previous one, or the draft field) *before* signalling the
+ * removal, so deleting a tag never drops focus onto `<body>`.
+ */
+type __VLS_Props = {
+    /** Position of the tag to remove in the root's `value` array. */
+    index: number;
+};
+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/tags-input/TagsInputItemDelete.vue.js

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

package/dist/tags-input/TagsInputItemDelete.vue_vue_type_script_setup_true_lang.cjs

@@ -0,0 +1 @@
+const l=require("./context.cjs");let e=require("vue");var s=["aria-label","disabled","data-disabled"],i=(0,e.defineComponent)({__name:"TagsInputItemDelete",props:{index:{}},setup(n){const d=n,t=(0,e.inject)(l.TAGS_INPUT_CONTEXT);if(!t)throw new Error("<SkdxTagsInputItemDelete> must be used inside <SkdxTagsInput>.");const u=(0,e.computed)(()=>`Remove ${t.value.value[d.index]??""}`.trim());function r(a){t.disabled.value||(l.focusDeleteNeighbor(a.currentTarget),t.removeTag(d.index))}return(a,o)=>((0,e.openBlock)(),(0,e.createElementBlock)("button",{class:"skdx-tags-input__item-delete","data-part":"item-delete",type:"button","aria-label":u.value,disabled:(0,e.unref)(t).disabled.value,"data-skdx-tags-input-delete":"","data-disabled":(0,e.unref)(t).disabled.value?"":void 0,onClick:r},[(0,e.renderSlot)(a.$slots,"default")],8,s))}});exports.default=i;

package/dist/tags-input/TagsInputItemDelete.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1 @@
+import{TAGS_INPUT_CONTEXT as e,focusDeleteNeighbor as a}from"./context.js";import{computed as t,createElementBlock as s,defineComponent as d,inject as l,openBlock as n,renderSlot as i,unref as o}from"vue";var r=["aria-label","disabled","data-disabled"],u=/* @__PURE__ */d({__name:"TagsInputItemDelete",props:{index:{}},setup(d){const u=d,m=l(e);if(!m)throw new Error("<SkdxTagsInputItemDelete> must be used inside <SkdxTagsInput>.");const p=t(()=>`Remove ${m.value.value[u.index]??""}`.trim());function b(e){m.disabled.value||(a(e.currentTarget),m.removeTag(u.index))}return(e,a)=>(n(),s("button",{class:"skdx-tags-input__item-delete","data-part":"item-delete",type:"button","aria-label":p.value,disabled:o(m).disabled.value,"data-skdx-tags-input-delete":"","data-disabled":o(m).disabled.value?"":void 0,onClick:b},[i(e.$slots,"default")],8,r))}});export{u as default};

package/dist/tags-input/context.cjs

@@ -0,0 +1 @@
+var o="[data-skdx-tags-input]",s="[data-skdx-tags-input-delete]",_="[data-skdx-tags-input-field]",a=Symbol("skdx-tags-input-context");function S(E){const t=E.closest(o),T=t?Array.from(t.querySelectorAll(s)):[],e=T.indexOf(E);((e===-1?void 0:T[e+1])??T[e-1]??t?.querySelector("[data-skdx-tags-input-field]"))?.focus()}exports.TAGS_INPUT_CONTEXT=a;exports.TAGS_INPUT_DELETE_SELECTOR=s;exports.TAGS_INPUT_FIELD_SELECTOR=_;exports.TAGS_INPUT_SELECTOR=o;exports.focusDeleteNeighbor=S;

package/dist/tags-input/context.d.cts

@@ -0,0 +1,51 @@
+import type { ComputedRef, InjectionKey } from 'vue';
+/** @internal Marks the TagsInput root, so a delete button being removed can find its siblings and the draft field. */
+export declare const TAGS_INPUT_SELECTOR = "[data-skdx-tags-input]";
+/** @internal Marks a delete button — each one is its own tab stop, so removal has to hand focus on. */
+export declare const TAGS_INPUT_DELETE_SELECTOR = "[data-skdx-tags-input-delete]";
+/** @internal Marks the draft field, the last place focus can go when the removed tag was the only one. */
+export declare const TAGS_INPUT_FIELD_SELECTOR = "[data-skdx-tags-input-field]";
+/** @internal Injection key a TagsInput provides so its parts can read/drive shared state. */
+export interface TagsInputContext {
+    value: ComputedRef<string[]>;
+    /** The draft text in `SkdxTagsInputInput`, owned by the root so it can be controlled. */
+    inputValue: ComputedRef<string>;
+    setInputValue: (value: string) => void;
+    disabled: ComputedRef<boolean>;
+    invalid: ComputedRef<boolean>;
+    readOnly: ComputedRef<boolean>;
+    /** Character that commits the draft while typing, and that pasted text is split on. */
+    delimiter: ComputedRef<string>;
+    /** Whether pasted text is committed as tags instead of dropped into the draft. */
+    addOnPaste: ComputedRef<boolean>;
+    addTag: (tag: string) => void;
+    /**
+     * Commits several candidates in one pass, deduping and validating each
+     * against the ones already accepted earlier in the same batch.
+     */
+    addTags: (tags: string[]) => void;
+    removeTag: (index: number) => void;
+}
+/** @internal Injection key a TagsInput provides so its Input/Item parts share the tag list and add/remove actions. */
+export declare const TAGS_INPUT_CONTEXT: InjectionKey<TagsInputContext>;
+/**
+ * Moves focus off `button` *before* the tag it deletes is removed.
+ *
+ * Focus goes to the next tag's delete button, to the previous one when the
+ * removed tag was last, or to the draft input when it was the only one —
+ * never to `<body>`, which is where focus lands by default once the button
+ * holding it unmounts, and which makes clearing several tags in a row
+ * unusable from the keyboard.
+ *
+ * This can't reuse `TagGroup`'s `focusTagNeighbor`: there the tag is the
+ * single tab stop and its delete button is `tabindex="-1"`, whereas here every
+ * delete button is its own tab stop and the draft input — not the root — is
+ * the natural landing spot, since deleting a tag usually precedes typing
+ * another.
+ *
+ * Mirrors `packages/react/src/tags-input/TagsInput.tsx`'s `focusDeleteNeighbor`
+ * — duplicated rather than shared, because no framework package imports
+ * `@skdx/shared` at runtime.
+ * @internal
+ */
+export declare function focusDeleteNeighbor(button: HTMLElement): void;

package/dist/tags-input/context.d.ts

@@ -0,0 +1,51 @@
+import type { ComputedRef, InjectionKey } from 'vue';
+/** @internal Marks the TagsInput root, so a delete button being removed can find its siblings and the draft field. */
+export declare const TAGS_INPUT_SELECTOR = "[data-skdx-tags-input]";
+/** @internal Marks a delete button — each one is its own tab stop, so removal has to hand focus on. */
+export declare const TAGS_INPUT_DELETE_SELECTOR = "[data-skdx-tags-input-delete]";
+/** @internal Marks the draft field, the last place focus can go when the removed tag was the only one. */
+export declare const TAGS_INPUT_FIELD_SELECTOR = "[data-skdx-tags-input-field]";
+/** @internal Injection key a TagsInput provides so its parts can read/drive shared state. */
+export interface TagsInputContext {
+    value: ComputedRef<string[]>;
+    /** The draft text in `SkdxTagsInputInput`, owned by the root so it can be controlled. */
+    inputValue: ComputedRef<string>;
+    setInputValue: (value: string) => void;
+    disabled: ComputedRef<boolean>;
+    invalid: ComputedRef<boolean>;
+    readOnly: ComputedRef<boolean>;
+    /** Character that commits the draft while typing, and that pasted text is split on. */
+    delimiter: ComputedRef<string>;
+    /** Whether pasted text is committed as tags instead of dropped into the draft. */
+    addOnPaste: ComputedRef<boolean>;
+    addTag: (tag: string) => void;
+    /**
+     * Commits several candidates in one pass, deduping and validating each
+     * against the ones already accepted earlier in the same batch.
+     */
+    addTags: (tags: string[]) => void;
+    removeTag: (index: number) => void;
+}
+/** @internal Injection key a TagsInput provides so its Input/Item parts share the tag list and add/remove actions. */
+export declare const TAGS_INPUT_CONTEXT: InjectionKey<TagsInputContext>;
+/**
+ * Moves focus off `button` *before* the tag it deletes is removed.
+ *
+ * Focus goes to the next tag's delete button, to the previous one when the
+ * removed tag was last, or to the draft input when it was the only one —
+ * never to `<body>`, which is where focus lands by default once the button
+ * holding it unmounts, and which makes clearing several tags in a row
+ * unusable from the keyboard.
+ *
+ * This can't reuse `TagGroup`'s `focusTagNeighbor`: there the tag is the
+ * single tab stop and its delete button is `tabindex="-1"`, whereas here every
+ * delete button is its own tab stop and the draft input — not the root — is
+ * the natural landing spot, since deleting a tag usually precedes typing
+ * another.
+ *
+ * Mirrors `packages/react/src/tags-input/TagsInput.tsx`'s `focusDeleteNeighbor`
+ * — duplicated rather than shared, because no framework package imports
+ * `@skdx/shared` at runtime.
+ * @internal
+ */
+export declare function focusDeleteNeighbor(button: HTMLElement): void;

package/dist/tags-input/context.js

@@ -0,0 +1 @@
+var t="[data-skdx-tags-input]",a="[data-skdx-tags-input-delete]",s="[data-skdx-tags-input-field]",e=/* @__PURE__ */Symbol("skdx-tags-input-context");function d(s){const e=s.closest(t),d=e?Array.from(e.querySelectorAll(a)):[],T=d.indexOf(s);((-1===T?void 0:d[T+1])??d[T-1]??e?.querySelector("[data-skdx-tags-input-field]"))?.focus()}export{e as TAGS_INPUT_CONTEXT,a as TAGS_INPUT_DELETE_SELECTOR,s as TAGS_INPUT_FIELD_SELECTOR,t as TAGS_INPUT_SELECTOR,d as focusDeleteNeighbor};

package/dist/tags-input/index.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./TagsInput.vue.cjs"),t=require("./TagsInputItem.vue.cjs"),u=require("./TagsInputItemDelete.vue.cjs"),r=require("./TagsInputInput.vue.cjs");exports.SkdxTagsInput=e.default;exports.SkdxTagsInputInput=r.default;exports.SkdxTagsInputItem=t.default;exports.SkdxTagsInputItemDelete=u.default;

package/dist/tags-input/index.d.cts

@@ -0,0 +1,4 @@
+export { default as SkdxTagsInput } from './TagsInput.vue.cjs';
+export { default as SkdxTagsInputItem } from './TagsInputItem.vue.cjs';
+export { default as SkdxTagsInputItemDelete } from './TagsInputItemDelete.vue.cjs';
+export { default as SkdxTagsInputInput } from './TagsInputInput.vue.cjs';

package/dist/tags-input/index.d.ts

@@ -0,0 +1,4 @@
+export { default as SkdxTagsInput } from './TagsInput.vue.js';
+export { default as SkdxTagsInputItem } from './TagsInputItem.vue.js';
+export { default as SkdxTagsInputItemDelete } from './TagsInputItemDelete.vue.js';
+export { default as SkdxTagsInputInput } from './TagsInputInput.vue.js';

package/dist/tags-input/index.js

@@ -0,0 +1 @@
+import t from"./TagsInput.vue.js";import s from"./TagsInputItem.vue.js";import e from"./TagsInputItemDelete.vue.js";import p from"./TagsInputInput.vue.js";export{t as SkdxTagsInput,p as SkdxTagsInputInput,s as SkdxTagsInputItem,e as SkdxTagsInputItemDelete};

package/dist/text-field/TextField.vue.cjs

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

package/dist/text-field/TextField.vue.d.cts

@@ -0,0 +1,81 @@
+/**
+ * The Vue implementation of the shared TextField contract (see
+ * `@skdx/shared`'s `textFieldContract`). Root of a text field: owns the
+ * value and disabled/invalid/required state, and `provide()`s them so a
+ * nested `<SkdxTextFieldInput>`/`<SkdxTextFieldSlot>`/`<SkdxTextFieldClearButton>`
+ * can `inject()` them — Vue's equivalent of React context for slotted
+ * content, mirroring `<SkdxAlert>`'s context.
+ *
+ * Supports `v-model:value` (the default `v-model`/`modelValue` convention is
+ * intentionally not used so the prop name matches every other framework's
+ * `value`/`valueChange` pair).
+ *
+ * With a `name`, the wrapped `<SkdxTextFieldInput>` submits its value with the
+ * surrounding `<form>`, and `checkValidity()`/`reportValidity()` — exposed on
+ * this root — delegate to that native input. Resetting the form restores
+ * `defaultValue`, emitting `value-change` like any other change so a
+ * controlled parent follows it.
+ *
+ * Works controlled (`value` + `@value-change`/`v-model:value`) or uncontrolled
+ * (`defaultValue`). While `value` is supplied it is the sole source of truth:
+ * edits emit but never move the field on their own, so a parent that declines
+ * a change holds the field where it is.
+ */
+type __VLS_Props = {
+    /** Disables the field and the wrapped input. @defaultValue false */
+    disabled?: boolean;
+    /** Marks the field invalid; sets data-invalid on the root and aria-invalid/data-invalid on the input. @defaultValue false */
+    invalid?: boolean;
+    /** Marks the wrapped input required for native form validation. @defaultValue false */
+    required?: boolean;
+    /**
+     * Current value, for controlled usage. Pair with `v-model:value` or
+     * `@value-change`.
+     * @defaultValue undefined — uncontrolled, tracks its own value internally.
+     */
+    value?: string;
+    /**
+     * Initial value, for uncontrolled usage — seeds the internally-tracked
+     * value and is what a form reset restores. Ignored while `value` is set.
+     * @defaultValue '' — starts empty.
+     */
+    defaultValue?: string;
+    /**
+     * Name put on the wrapped native input, so the value submits with the
+     * surrounding `<form>`.
+     * @defaultValue undefined
+     */
+    name?: string;
+};
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {
+    /** Reports whether the wrapped input satisfies its constraints. `true` without one. */
+    checkValidity: () => boolean;
+    /** Like `checkValidity()`, but also shows the browser's validation message. */
+    reportValidity: () => boolean;
+    /** The wrapped native input element. */
+    inputEl: import("vue").Ref<HTMLInputElement | null, HTMLInputElement | null>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:value": (value: string) => any;
+    "value-change": (value: string) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:value"?: ((value: string) => any) | undefined;
+    "onValue-change"?: ((value: string) => any) | undefined;
+}>, {
+    disabled: boolean;
+    required: boolean;
+    name: string;
+    value: string;
+    invalid: boolean;
+    defaultValue: 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/text-field/TextField.vue.d.ts

@@ -0,0 +1,81 @@
+/**
+ * The Vue implementation of the shared TextField contract (see
+ * `@skdx/shared`'s `textFieldContract`). Root of a text field: owns the
+ * value and disabled/invalid/required state, and `provide()`s them so a
+ * nested `<SkdxTextFieldInput>`/`<SkdxTextFieldSlot>`/`<SkdxTextFieldClearButton>`
+ * can `inject()` them — Vue's equivalent of React context for slotted
+ * content, mirroring `<SkdxAlert>`'s context.
+ *
+ * Supports `v-model:value` (the default `v-model`/`modelValue` convention is
+ * intentionally not used so the prop name matches every other framework's
+ * `value`/`valueChange` pair).
+ *
+ * With a `name`, the wrapped `<SkdxTextFieldInput>` submits its value with the
+ * surrounding `<form>`, and `checkValidity()`/`reportValidity()` — exposed on
+ * this root — delegate to that native input. Resetting the form restores
+ * `defaultValue`, emitting `value-change` like any other change so a
+ * controlled parent follows it.
+ *
+ * Works controlled (`value` + `@value-change`/`v-model:value`) or uncontrolled
+ * (`defaultValue`). While `value` is supplied it is the sole source of truth:
+ * edits emit but never move the field on their own, so a parent that declines
+ * a change holds the field where it is.
+ */
+type __VLS_Props = {
+    /** Disables the field and the wrapped input. @defaultValue false */
+    disabled?: boolean;
+    /** Marks the field invalid; sets data-invalid on the root and aria-invalid/data-invalid on the input. @defaultValue false */
+    invalid?: boolean;
+    /** Marks the wrapped input required for native form validation. @defaultValue false */
+    required?: boolean;
+    /**
+     * Current value, for controlled usage. Pair with `v-model:value` or
+     * `@value-change`.
+     * @defaultValue undefined — uncontrolled, tracks its own value internally.
+     */
+    value?: string;
+    /**
+     * Initial value, for uncontrolled usage — seeds the internally-tracked
+     * value and is what a form reset restores. Ignored while `value` is set.
+     * @defaultValue '' — starts empty.
+     */
+    defaultValue?: string;
+    /**
+     * Name put on the wrapped native input, so the value submits with the
+     * surrounding `<form>`.
+     * @defaultValue undefined
+     */
+    name?: string;
+};
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {
+    /** Reports whether the wrapped input satisfies its constraints. `true` without one. */
+    checkValidity: () => boolean;
+    /** Like `checkValidity()`, but also shows the browser's validation message. */
+    reportValidity: () => boolean;
+    /** The wrapped native input element. */
+    inputEl: import("vue").Ref<HTMLInputElement | null, HTMLInputElement | null>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:value": (value: string) => any;
+    "value-change": (value: string) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:value"?: ((value: string) => any) | undefined;
+    "onValue-change"?: ((value: string) => any) | undefined;
+}>, {
+    disabled: boolean;
+    required: boolean;
+    name: string;
+    value: string;
+    invalid: boolean;
+    defaultValue: 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/text-field/TextField.vue.js

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

package/dist/text-field/TextField.vue_vue_type_script_setup_true_lang.cjs

@@ -0,0 +1 @@
+const f=require("../utils/useFormReset.cjs"),r=require("./context.cjs");let e=require("vue");var p=["data-disabled","data-invalid"],m=(0,e.defineComponent)({__name:"TextField",props:{disabled:{type:Boolean,default:!1},invalid:{type:Boolean,default:!1},required:{type:Boolean,default:!1},value:{default:void 0},defaultValue:{default:""},name:{default:void 0}},emits:["update:value","value-change"],setup(d,{expose:v,emit:s}){const a=d,u=s,c=r.nextTextFieldId(),i=(0,e.ref)(a.defaultValue),o=(0,e.computed)(()=>a.value===void 0?i.value:a.value);function n(l){a.value===void 0&&(i.value=l),u("update:value",l),u("value-change",l)}const t=(0,e.ref)(null);return(0,e.provide)(r.TEXT_FIELD_CONTEXT,{inputId:c,disabled:(0,e.toRef)(a,"disabled"),invalid:(0,e.toRef)(a,"invalid"),required:(0,e.toRef)(a,"required"),value:o,setValue:n,name:(0,e.toRef)(a,"name"),inputEl:t}),f.useFormReset(()=>t.value,()=>{n(a.defaultValue),(0,e.nextTick)(()=>{t.value&&(t.value.value=o.value)})}),v({checkValidity:()=>t.value?.checkValidity()??!0,reportValidity:()=>t.value?.reportValidity()??!0,inputEl:t}),(l,_)=>((0,e.openBlock)(),(0,e.createElementBlock)("div",{class:"skdx-text-field","data-part":"root","data-skdx-component":"text-field","data-disabled":d.disabled?"":void 0,"data-invalid":d.invalid?"":void 0},[(0,e.renderSlot)(l.$slots,"default")],8,p))}});exports.default=m;

package/dist/text-field/TextField.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1 @@
+import{useFormReset as e}from"../utils/useFormReset.js";import{TEXT_FIELD_CONTEXT as a,nextTextFieldId as l}from"./context.js";import{computed as t,createElementBlock as d,defineComponent as i,nextTick as u,openBlock as o,provide as s,ref as n,renderSlot as v,toRef as r}from"vue";var p=["data-disabled","data-invalid"],f=/* @__PURE__ */i({__name:"TextField",props:{disabled:{type:Boolean,default:!1},invalid:{type:Boolean,default:!1},required:{type:Boolean,default:!1},value:{default:void 0},defaultValue:{default:""},name:{default:void 0}},emits:["update:value","value-change"],setup(i,{expose:f,emit:m}){const c=i,x=m,V=l(),k=n(c.defaultValue),y=t(()=>void 0===c.value?k.value:c.value);function T(e){void 0===c.value&&(k.value=e),x("update:value",e),x("value-change",e)}const b=n(null);return s(a,{inputId:V,disabled:r(c,"disabled"),invalid:r(c,"invalid"),required:r(c,"required"),value:y,setValue:T,name:r(c,"name"),inputEl:b}),e(()=>b.value,()=>{T(c.defaultValue),u(()=>{b.value&&(b.value.value=y.value)})}),f({checkValidity:()=>b.value?.checkValidity()??!0,reportValidity:()=>b.value?.reportValidity()??!0,inputEl:b}),(e,a)=>(o(),d("div",{class:"skdx-text-field","data-part":"root","data-skdx-component":"text-field","data-disabled":i.disabled?"":void 0,"data-invalid":i.invalid?"":void 0},[v(e.$slots,"default")],8,p))}});export{f as default};

package/dist/text-field/TextFieldClearButton.vue.cjs

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

package/dist/text-field/TextFieldClearButton.vue.d.cts

@@ -0,0 +1,23 @@
+/**
+ * A button that resets a `<SkdxTextField>`'s value to the empty string.
+ * Renders only once the field has a non-empty value, unless `forceMount` is
+ * set. Must be used inside `<SkdxTextField>`.
+ */
+type __VLS_Props = {
+    /** Keep mounted even when the field is empty (for exit animations). */
+    forceMount?: boolean;
+};
+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<{}>, {
+    forceMount: boolean;
+}, {}, {}, {}, 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/text-field/TextFieldClearButton.vue.d.ts

@@ -0,0 +1,23 @@
+/**
+ * A button that resets a `<SkdxTextField>`'s value to the empty string.
+ * Renders only once the field has a non-empty value, unless `forceMount` is
+ * set. Must be used inside `<SkdxTextField>`.
+ */
+type __VLS_Props = {
+    /** Keep mounted even when the field is empty (for exit animations). */
+    forceMount?: boolean;
+};
+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<{}>, {
+    forceMount: boolean;
+}, {}, {}, {}, 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/text-field/TextFieldClearButton.vue.js

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

package/dist/text-field/TextFieldClearButton.vue_vue_type_script_setup_true_lang.cjs

@@ -0,0 +1 @@
+const u=require("./context.cjs");let e=require("vue");var a=(0,e.defineComponent)({__name:"TextFieldClearButton",props:{forceMount:{type:Boolean,default:!1}},setup(r){const n=r,t=(0,e.inject)(u.TEXT_FIELD_CONTEXT);if(!t)throw new Error("<SkdxTextFieldClearButton> must be used inside <SkdxTextField>.");function o(){t.setValue("")}return(l,c)=>n.forceMount||(0,e.unref)(t).value.value!==""?((0,e.openBlock)(),(0,e.createElementBlock)("button",{key:0,class:"skdx-text-field__clear-button","data-part":"clear-button",type:"button","aria-label":"Clear",onClick:o},[(0,e.renderSlot)(l.$slots,"default")])):(0,e.createCommentVNode)("",!0)}});exports.default=a;

package/dist/text-field/TextFieldClearButton.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1 @@
+import{TEXT_FIELD_CONTEXT as e}from"./context.js";import{createCommentVNode as t,createElementBlock as o,defineComponent as a,inject as n,openBlock as r,renderSlot as l,unref as s}from"vue";var u=/* @__PURE__ */a({__name:"TextFieldClearButton",props:{forceMount:{type:Boolean,default:!1}},setup(a){const u=a,d=n(e);if(!d)throw new Error("<SkdxTextFieldClearButton> must be used inside <SkdxTextField>.");function c(){d.setValue("")}return(e,a)=>u.forceMount||""!==s(d).value.value?(r(),o("button",{key:0,class:"skdx-text-field__clear-button","data-part":"clear-button",type:"button","aria-label":"Clear",onClick:c},[l(e.$slots,"default")])):t("",!0)}});export{u as default};

package/dist/text-field/TextFieldInput.vue.cjs

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

package/dist/text-field/TextFieldInput.vue.d.cts

@@ -0,0 +1,16 @@
+/**
+ * The native `<input>` for a `<SkdxTextField>`. Reads value/disabled/
+ * required/invalid/name from the field's context and writes back to it on
+ * input, so it must be used inside `<SkdxTextField>`. Publishes itself back to
+ * the root through the context: it is the element that carries the value into
+ * a `<form>`, so it is what the root's `checkValidity()`/`reportValidity()`
+ * delegate to and what its form reset is observed through.
+ */
+type __VLS_Props = {
+    /** Native `<input>` `type` attribute, e.g. `'text'`, `'email'`, `'password'`. */
+    type?: string;
+};
+declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    type: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/text-field/TextFieldInput.vue.d.ts

@@ -0,0 +1,16 @@
+/**
+ * The native `<input>` for a `<SkdxTextField>`. Reads value/disabled/
+ * required/invalid/name from the field's context and writes back to it on
+ * input, so it must be used inside `<SkdxTextField>`. Publishes itself back to
+ * the root through the context: it is the element that carries the value into
+ * a `<form>`, so it is what the root's `checkValidity()`/`reportValidity()`
+ * delegate to and what its form reset is observed through.
+ */
+type __VLS_Props = {
+    /** Native `<input>` `type` attribute, e.g. `'text'`, `'email'`, `'password'`. */
+    type?: string;
+};
+declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    type: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/text-field/TextFieldInput.vue.js

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

package/dist/text-field/TextFieldInput.vue_vue_type_script_setup_true_lang.cjs

@@ -0,0 +1 @@
+const l=require("./context.cjs"),d=require("../utils/composeRefs.cjs"),s=require("../utils/reassertValue.cjs");let e=require("vue");var o=["id","type","name","value","disabled","required","aria-invalid","data-disabled","data-invalid"],v=(0,e.defineComponent)({inheritAttrs:!1,__name:"TextFieldInput",props:{type:{default:"text"}},setup(r){const t=(0,e.inject)(l.TEXT_FIELD_CONTEXT);if(!t)throw new Error("<SkdxTextFieldInput> must be used inside <SkdxTextField>.");const i=d.composeRefs(t.inputEl);function n(a){const u=a.target;t.setValue(u.value),s.reassertValue(u,()=>t.value.value)}return(a,u)=>((0,e.openBlock)(),(0,e.createElementBlock)("input",(0,e.mergeProps)({class:"skdx-text-field__input","data-part":"input",id:(0,e.unref)(t).inputId,ref:(0,e.unref)(i),type:r.type,name:(0,e.unref)(t).name.value,value:(0,e.unref)(t).value.value,disabled:(0,e.unref)(t).disabled.value,required:(0,e.unref)(t).required.value,"aria-invalid":(0,e.unref)(t).invalid.value?"true":void 0,"data-disabled":(0,e.unref)(t).disabled.value?"":void 0,"data-invalid":(0,e.unref)(t).invalid.value?"":void 0,onInput:n},a.$attrs),null,16,o))}});exports.default=v;

package/dist/text-field/TextFieldInput.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1 @@
+import{TEXT_FIELD_CONTEXT as e}from"./context.js";import{composeRefs as a}from"../utils/composeRefs.js";import{reassertValue as t}from"../utils/reassertValue.js";import{createElementBlock as i,defineComponent as d,inject as s,mergeProps as l,openBlock as r,unref as u}from"vue";var n=["id","type","name","value","disabled","required","aria-invalid","data-disabled","data-invalid"],o=/* @__PURE__ */d({inheritAttrs:!1,__name:"TextFieldInput",props:{type:{default:"text"}},setup(d){const o=s(e);if(!o)throw new Error("<SkdxTextFieldInput> must be used inside <SkdxTextField>.");const p=a(o.inputEl);function v(e){const a=e.target;o.setValue(a.value),t(a,()=>o.value.value)}return(e,a)=>(r(),i("input",l({class:"skdx-text-field__input","data-part":"input",id:u(o).inputId,ref:u(p),type:d.type,name:u(o).name.value,value:u(o).value.value,disabled:u(o).disabled.value,required:u(o).required.value,"aria-invalid":u(o).invalid.value?"true":void 0,"data-disabled":u(o).disabled.value?"":void 0,"data-invalid":u(o).invalid.value?"":void 0,onInput:v},e.$attrs),null,16,n))}});export{o as default};

package/dist/text-field/TextFieldSlot.vue.cjs

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