@skdx/vue 0.27.0 → 0.29.0

package/dist/pin-input/PinInput.vue_vue_type_script_setup_true_lang.js

@@ -1 +1 @@
-import{useFormReset as e}from"../utils/useFormReset.js";import{PIN_INPUT_CONTEXT as a}from"./context.js";import{computed as t,createCommentVNode as l,createElementBlock as d,defineComponent as u,nextTick as n,openBlock as i,provide as o,ref as s,renderSlot as r}from"vue";var v=["data-disabled","data-invalid","data-readonly"],p=["name","^value","pattern","required","disabled"],f=/* @__PURE__ */u({__name:"PinInput",props:{value:{default:void 0},defaultValue:{default:""},length:{default:6},disabled:{type:Boolean,default:!1},invalid:{type:Boolean,default:!1},readOnly:{type:Boolean,default:!1},type:{default:"text"},mask:{type:Boolean,default:!1},autoSubmit:{type:Boolean,default:!1},sanitize:{type:Function,default:void 0},name:{default:void 0},required:{type:Boolean,default:!1}},emits:["update:value","value-change","value-complete"],setup(u,{expose:f,emit:m}){const c=u,y=m,h=s(c.defaultValue),b=t(()=>void 0===c.value?h.value:c.value),g=s([]),k=s(null);o(a,{value:b,length:t(()=>c.length),type:t(()=>c.type),mask:t(()=>c.mask),disabled:t(()=>c.disabled),invalid:t(()=>c.invalid),readOnly:t(()=>c.readOnly),setValue:function(e){const a=b.value.length===c.length;void 0===c.value&&(h.value=e),y("update:value",e),y("value-change",e),e.length===c.length&&!a&&(y("value-complete",e),c.autoSubmit&&k.value?.closest("form")?.requestSubmit())},focusIndex:function(e){g.value[e]?.focus()},registerField:function(e,a){g.value[e]=a},sanitizePaste:function(e){return c.sanitize?.(e)??e}});const x=s(null),V=t(()=>`.{${c.length}}`),B=c.value??c.defaultValue;return e(()=>x.value,()=>{void 0===c.value&&(h.value=B),y("update:value",B),y("value-change",B),n(()=>{g.value.forEach((e,a)=>{e&&(e.value=B[a]??"")})})}),f({checkValidity:()=>x.value?.checkValidity()??!0,reportValidity:()=>x.value?.reportValidity()??!0}),(e,a)=>(i(),d("div",{class:"skdx-pin-input","data-part":"root","data-skdx-component":"pin-input",ref_key:"rootRef",ref:k,"data-disabled":u.disabled?"":void 0,"data-invalid":u.invalid?"":void 0,"data-readonly":u.readOnly?"":void 0},[r(e.$slots,"default"),u.name?(i(),d("input",{key:0,ref_key:"hiddenEl",ref:x,type:"text","aria-hidden":"true",tabindex:"-1",name:u.name,"^value":b.value,pattern:V.value,required:u.required,disabled:u.disabled,style:{position:"absolute","pointer-events":"none",opacity:"0",margin:"0",width:"1px",height:"1px"}},null,8,p)):l("",!0)],8,v))}});export{f as default};
+import{appearanceAttrs as e}from"../utils/appearance.js";import{isDevMode as t}from"../utils/dev-mode.js";import{useFormReset as a}from"../utils/useFormReset.js";import{pinCharAcceptor as l,pinInputDigitLabel as n}from"../utils/pin-chars.js";import{PIN_INPUT_CONTEXT as o}from"./context.js";import i from"./PinInputAnatomy.vue.js";import{joinPinSlots as u,toPinSlots as d}from"./slots.js";import{computed as s,createCommentVNode as r,createElementBlock as p,createVNode as v,defineComponent as c,mergeProps as f,nextTick as m,onMounted as h,openBlock as y,provide as g,ref as b,renderSlot as x,unref as k,watchEffect as B}from"vue";var V=["aria-invalid","data-disabled","data-invalid","data-readonly"],F=["name","form","^value","pattern","required","disabled"],O=/* @__PURE__ */c({inheritAttrs:!1,__name:"PinInput",props:{value:{default:void 0},defaultValue:{default:""},length:{default:6},disabled:{type:Boolean,default:!1},invalid:{type:Boolean,default:!1},readOnly:{type:Boolean,default:!1},type:{default:"text"},pattern:{},placeholder:{},otp:{type:Boolean,default:!0},autoFocus:{type:Boolean,default:!1},blurOnComplete:{type:Boolean,default:!1},selectOnFocus:{type:Boolean,default:!1},mask:{type:Boolean,default:!1},autoSubmit:{type:Boolean,default:!1},sanitize:{},name:{},form:{},required:{type:Boolean,default:!1},digitLabel:{type:Function,default:n},density:{},shape:{},size:{}},emits:["update:value","value-change","value-complete","value-invalid"],setup(n,{expose:c,emit:O}){const P=n,C=O,I=b(P.defaultValue),j=s(()=>void 0===P.value?I.value:P.value),S=b([]),$=b(null);function q(e){if(e===j.value)return;const t=j.value.length===P.length;void 0===P.value&&(I.value=e),C("update:value",e),C("value-change",e),e.length===P.length&&!t&&(C("value-complete",e),P.blurOnComplete&&(S.value.find(e=>e===document.activeElement)??S.value[P.length-1])?.blur(),P.autoSubmit&&(N.value?.form??$.value?.closest("form"))?.requestSubmit())}const z=b(d(j.value,P.length)),A=s(()=>z.value.length===P.length&&u(z.value)===j.value?z.value:d(j.value,P.length));function E(e){const t=[...A.value];e(t),z.value=t,q(u(t))}function _(e){S.value[e]?.focus()}const w=s(()=>l(P.type,P.pattern));g(o,{value:j,length:s(()=>P.length),type:s(()=>P.type),mask:s(()=>P.mask),disabled:s(()=>P.disabled),invalid:s(()=>P.invalid),readOnly:s(()=>P.readOnly),placeholder:s(()=>P.placeholder),otp:s(()=>P.otp),selectOnFocus:s(()=>P.selectOnFocus),accepts:e=>w.value(e),reportInvalid:(e,t)=>C("value-invalid",{value:e,index:t}),digitLabel:s(()=>P.digitLabel),charAt:function(e){return A.value[e]??""},setCharAt:function(e,t){E(a=>{a[e]=t})},fillFrom:function(e,t){let a=e-1;return E(l=>{for(let n=0;n<t.length&&e+n<P.length;n++)l[e+n]=t[n],a=e+n}),a},focusIndex:_,registerField:function(e,t){S.value[e]=t},sanitizePaste:function(e){return P.sanitize?.(e)??e}});const N=b(null),L=s(()=>`.{${P.length}}`),R=P.value??P.defaultValue;return a(()=>N.value,()=>{const e=P.defaultValue||R;void 0===P.value&&(I.value=e),C("update:value",e),C("value-change",e),m(()=>{S.value.forEach((t,a)=>{t&&(t.value=e[a]??"")})})}),h(()=>{P.autoFocus&&_(0)}),B(()=>{j.value;const e=S.value.filter(Boolean).length;0!==e&&e!==P.length&&t()&&console.warn(`SkdxPinInput: ${e} SkdxPinInputField${1===e?"":"s"} rendered but length is ${P.length}. Render exactly one field per position, with contiguous \`index\` values from 0 to ${P.length-1} — otherwise the value can never complete and value-complete never fires.`)}),c({checkValidity:()=>N.value?.checkValidity()??!0,reportValidity:()=>N.value?.reportValidity()??!0,setCustomValidity:e=>N.value?.setCustomValidity(e),clear:()=>q(""),focus:()=>_(0)}),(t,a)=>(y(),p("div",f({ref_key:"rootRef",ref:$,class:"skdx-pin-input","data-part":"root","data-skdx-component":"pin-input",role:"group","aria-invalid":!!n.invalid||void 0,"data-disabled":n.disabled?"":void 0,"data-invalid":n.invalid?"":void 0,"data-readonly":n.readOnly?"":void 0},{...t.$attrs,...k(e)({density:n.density,shape:n.shape,size:n.size},t.$attrs)}),[x(t.$slots,"default",{},()=>[v(i,{length:n.length},null,8,["length"])]),n.name?(y(),p("input",{key:0,ref_key:"hiddenEl",ref:N,type:"text","aria-hidden":"true",tabindex:"-1",name:n.name,form:n.form,"^value":j.value,pattern:n.required?L.value:void 0,required:n.required,disabled:n.disabled,style:{position:"absolute","pointer-events":"none",opacity:"0",margin:"0",width:"1px",height:"1px"}},null,8,F)):r("",!0)],16,V))}});export{O as default};

package/dist/pin-input/PinInputAnatomy.vue.cjs

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

package/dist/pin-input/PinInputAnatomy.vue.d.cts

@@ -0,0 +1,8 @@
+/** @internal Renders one Field box per position from 0 to length - 1. */
+type __VLS_Props = {
+    length?: number | undefined;
+};
+declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    length: number | undefined;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/pin-input/PinInputAnatomy.vue.d.ts

@@ -0,0 +1,8 @@
+/** @internal Renders one Field box per position from 0 to length - 1. */
+type __VLS_Props = {
+    length?: number | undefined;
+};
+declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    length: number | undefined;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/pin-input/PinInputAnatomy.vue.js

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

package/dist/pin-input/PinInputAnatomy.vue_vue_type_script_setup_true_lang.cjs

@@ -0,0 +1 @@
+const r=require("./PinInputField.vue.cjs");let e=require("vue");var u=(0,e.defineComponent)({__name:"PinInputAnatomy",props:{length:{default:6}},setup(n){return(l,a)=>((0,e.openBlock)(!0),(0,e.createElementBlock)(e.Fragment,null,(0,e.renderList)(n.length,t=>((0,e.openBlock)(),(0,e.createBlock)(r.default,{key:t-1,index:t-1},null,8,["index"]))),128))}});exports.default=u;

package/dist/pin-input/PinInputAnatomy.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1 @@
+import e from"./PinInputField.vue.js";import{Fragment as n,createBlock as t,createElementBlock as a,defineComponent as l,openBlock as o,renderList as r}from"vue";var s=/* @__PURE__ */l({__name:"PinInputAnatomy",props:{length:{default:6}},setup:l=>(s,p)=>(o(!0),a(n,null,r(l.length,n=>(o(),t(e,{key:n-1,index:n-1},null,8,["index"]))),128))});export{s as default};

package/dist/pin-input/PinInputField.vue.d.cts

@@ -1,12 +1,6 @@
-/**
- * A single character box of a `SkdxPinInput`. Reads/writes its character at
- * `index` in the shared value via context. Typing or pasting auto-advances
- * focus; Backspace on an empty box clears and moves back; Arrow Left/Right
- * move focus between boxes; pasting a multi-character string fills
- * consecutive boxes from `index` onward.
- */
+/** Single character box that reads/writes at `index` and auto-advances focus on typing, paste, and arrow/Backspace navigation. */
 type __VLS_Props = {
-    /** This box's 0-indexed position within the pin's combined value. */
+    /** 0-indexed position in pin value (aria-label counts from 1). */
     index: number;
 };
 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>;

package/dist/pin-input/PinInputField.vue.d.ts

@@ -1,12 +1,6 @@
-/**
- * A single character box of a `SkdxPinInput`. Reads/writes its character at
- * `index` in the shared value via context. Typing or pasting auto-advances
- * focus; Backspace on an empty box clears and moves back; Arrow Left/Right
- * move focus between boxes; pasting a multi-character string fills
- * consecutive boxes from `index` onward.
- */
+/** Single character box that reads/writes at `index` and auto-advances focus on typing, paste, and arrow/Backspace navigation. */
 type __VLS_Props = {
-    /** This box's 0-indexed position within the pin's combined value. */
+    /** 0-indexed position in pin value (aria-label counts from 1). */
     index: number;
 };
 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>;

package/dist/pin-input/PinInputField.vue_vue_type_script_setup_true_lang.cjs

@@ -1 +1 @@
-const g=require("../utils/reassertValue.cjs"),v=require("../utils/direction.cjs"),_=require("./context.cjs");let a=require("vue");var I=["inputmode","autocomplete","type","disabled","readonly","aria-invalid","aria-readonly","data-disabled","data-invalid","data-readonly","value"],b=(0,a.defineComponent)({__name:"PinInputField",props:{index:{}},setup(d){const f=/^[0-9]$/,n=d,e=(0,a.inject)(_.PIN_INPUT_CONTEXT);if(!e)throw new Error("<SkdxPinInputField> must be used inside <SkdxPinInput>.");const p=v.useDirection(),r=(0,a.computed)(()=>e.value.value[n.index]??""),x=(0,a.computed)(()=>r.value!=="");function o(t){const i=e.value.value.split("");i[n.index]=t,e.setValue(i.join("").slice(0,e.length.value))}function h(t){if(e.disabled.value)return;const i=t.target.value;if(i===""){o("");return}if(e.type.value==="numeric"&&!f.test(i)){t.target.value=r.value;return}o(i),g.reassertValue(t.target,()=>r.value),n.index<e.length.value-1&&e.focusIndex(n.index+1)}function y(t){if(e.disabled.value)return;const i=v.directionalKey(t.key,t.currentTarget,p());if(i==="Backspace"){if(e.readOnly.value)return;if(t.preventDefault(),r.value)o("");else if(n.index>0){const l=e.value.value.split("");l[n.index-1]="",e.setValue(l.join("").slice(0,e.length.value)),e.focusIndex(n.index-1)}}else i==="ArrowLeft"?n.index>0&&(t.preventDefault(),e.focusIndex(n.index-1)):i==="ArrowRight"&&n.index<e.length.value-1&&(t.preventDefault(),e.focusIndex(n.index+1))}function m(t){if(e.disabled.value||e.readOnly.value)return;t.preventDefault();const i=e.sanitizePaste(t.clipboardData?.getData("text")??""),l=e.type.value==="numeric"?i.replace(/[^0-9]/g,""):i;if(!l)return;const s=e.value.value.split("");let c=n.index-1;for(let u=0;u<l.length&&n.index+u<e.length.value;u++)s[n.index+u]=l[u],c=n.index+u;e.setValue(s.join("").slice(0,e.length.value)),e.focusIndex(Math.min(c+1,e.length.value-1))}return(t,i)=>((0,a.openBlock)(),(0,a.createElementBlock)("input",{class:"skdx-pin-input__field","data-part":"field",ref:l=>(0,a.unref)(e).registerField(d.index,l),inputmode:(0,a.unref)(e).type.value==="numeric"?"numeric":"text",autocomplete:d.index===0?"one-time-code":"off",type:(0,a.unref)(e).mask.value&&x.value?"password":"text",maxlength:"1",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:r.value,onInput:h,onKeydown:y,onPaste:m},null,40,I))}});exports.default=b;
+const y=require("../utils/injectRequired.cjs"),g=require("../utils/reassertValue.cjs"),c=require("../utils/direction.cjs"),_=require("./context.cjs");let t=require("vue");var b=["inputmode","autocomplete","type","placeholder","disabled","readonly","aria-label","aria-readonly","data-disabled","data-invalid","data-readonly","value"],I=(0,t.defineComponent)({__name:"PinInputField",props:{index:{}},setup(u){const n=u,e=y.injectRequired(_.PIN_INPUT_CONTEXT,"<SkdxPinInputField> must be used inside <SkdxPinInput>."),s=c.useDirection(),r=(0,t.computed)(()=>e.charAt(n.index)),f=(0,t.computed)(()=>r.value!=="");function d(a){e.setCharAt(n.index,a)}function v(a){if(e.disabled.value)return;const i=a.target.value;if(i===""){d("");return}if(!e.accepts(i)){a.target.value=r.value,e.reportInvalid(i,n.index);return}d(i),g.reassertValue(a.target,()=>r.value),n.index<e.length.value-1&&e.focusIndex(n.index+1)}function p(a){e.selectOnFocus.value&&a.target.select()}function x(a){if(e.disabled.value)return;const i=c.directionalKey(a.key,a.currentTarget,s());if(i==="Backspace"){if(e.readOnly.value)return;a.preventDefault(),r.value?d(""):n.index>0&&(e.setCharAt(n.index-1,""),e.focusIndex(n.index-1))}else if(i==="Delete"){if(e.readOnly.value)return;a.preventDefault(),r.value&&d("")}else i==="ArrowLeft"?n.index>0&&(a.preventDefault(),e.focusIndex(n.index-1)):i==="ArrowRight"&&n.index<e.length.value-1&&(a.preventDefault(),e.focusIndex(n.index+1))}function h(a){if(e.disabled.value||e.readOnly.value)return;a.preventDefault();const i=e.sanitizePaste(a.clipboardData?.getData("text")??"");let l="";for(const o of i)e.accepts(o)?l+=o:e.reportInvalid(o,Math.min(n.index+l.length,e.length.value-1));if(!l)return;const m=e.fillFrom(n.index,l);e.focusIndex(Math.min(m+1,e.length.value-1))}return(a,i)=>((0,t.openBlock)(),(0,t.createElementBlock)("input",{ref:l=>(0,t.unref)(e).registerField(u.index,l),class:"skdx-pin-input__field","data-part":"field",inputmode:(0,t.unref)(e).type.value==="numeric"?"numeric":"text",autocomplete:(0,t.unref)(e).otp.value&&u.index===0?"one-time-code":"off",type:(0,t.unref)(e).mask.value&&f.value?"password":"text",placeholder:(0,t.unref)(e).placeholder.value,maxlength:"1",disabled:(0,t.unref)(e).disabled.value,readonly:(0,t.unref)(e).readOnly.value,"aria-label":(0,t.unref)(e).digitLabel.value(u.index+1,(0,t.unref)(e).length.value),"aria-readonly":(0,t.unref)(e).readOnly.value?!0:void 0,"data-disabled":(0,t.unref)(e).disabled.value?"":void 0,"data-invalid":(0,t.unref)(e).invalid.value?"":void 0,"data-readonly":(0,t.unref)(e).readOnly.value?"":void 0,value:r.value,onInput:v,onKeydown:x,onPaste:h,onFocus:p},null,40,b))}});exports.default=I;

package/dist/pin-input/PinInputField.vue_vue_type_script_setup_true_lang.js

@@ -1 +1 @@
-import{reassertValue as e}from"../utils/reassertValue.js";import{directionalKey as a,useDirection as t}from"../utils/direction.js";import{PIN_INPUT_CONTEXT as n}from"./context.js";import{computed as l,createElementBlock as i,defineComponent as d,inject as u,openBlock as r,unref as o}from"vue";var s=["inputmode","autocomplete","type","disabled","readonly","aria-invalid","aria-readonly","data-disabled","data-invalid","data-readonly","value"],v=/* @__PURE__ */d({__name:"PinInputField",props:{index:{}},setup(d){const v=/^[0-9]$/,c=d,p=u(n);if(!p)throw new Error("<SkdxPinInputField> must be used inside <SkdxPinInput>.");const f=t(),x=l(()=>p.value.value[c.index]??""),m=l(()=>""!==x.value);function y(e){const a=p.value.value.split("");a[c.index]=e,p.setValue(a.join("").slice(0,p.length.value))}function g(a){if(p.disabled.value)return;const t=a.target.value;""!==t?"numeric"!==p.type.value||v.test(t)?(y(t),e(a.target,()=>x.value),c.index<p.length.value-1&&p.focusIndex(c.index+1)):a.target.value=x.value:y("")}function h(e){if(p.disabled.value)return;const t=a(e.key,e.currentTarget,f());if("Backspace"===t){if(p.readOnly.value)return;if(e.preventDefault(),x.value)y("");else if(c.index>0){const e=p.value.value.split("");e[c.index-1]="",p.setValue(e.join("").slice(0,p.length.value)),p.focusIndex(c.index-1)}}else"ArrowLeft"===t?c.index>0&&(e.preventDefault(),p.focusIndex(c.index-1)):"ArrowRight"===t&&c.index<p.length.value-1&&(e.preventDefault(),p.focusIndex(c.index+1))}function b(e){if(p.disabled.value||p.readOnly.value)return;e.preventDefault();const a=p.sanitizePaste(e.clipboardData?.getData("text")??""),t="numeric"===p.type.value?a.replace(/[^0-9]/g,""):a;if(!t)return;const n=p.value.value.split("");let l=c.index-1;for(let e=0;e<t.length&&c.index+e<p.length.value;e++)n[c.index+e]=t[e],l=c.index+e;p.setValue(n.join("").slice(0,p.length.value)),p.focusIndex(Math.min(l+1,p.length.value-1))}return(e,a)=>(r(),i("input",{class:"skdx-pin-input__field","data-part":"field",ref:e=>o(p).registerField(d.index,e),inputmode:"numeric"===o(p).type.value?"numeric":"text",autocomplete:0===d.index?"one-time-code":"off",type:o(p).mask.value&&m.value?"password":"text",maxlength:"1",disabled:o(p).disabled.value,readonly:o(p).readOnly.value,"aria-invalid":!!o(p).invalid.value||void 0,"aria-readonly":!!o(p).readOnly.value||void 0,"data-disabled":o(p).disabled.value?"":void 0,"data-invalid":o(p).invalid.value?"":void 0,"data-readonly":o(p).readOnly.value?"":void 0,value:x.value,onInput:g,onKeydown:h,onPaste:b},null,40,s))}});export{v as default};
+import{injectRequired as e}from"../utils/injectRequired.js";import{reassertValue as a}from"../utils/reassertValue.js";import{directionalKey as t,useDirection as n}from"../utils/direction.js";import{PIN_INPUT_CONTEXT as l}from"./context.js";import{computed as i,createElementBlock as d,defineComponent as r,openBlock as u,unref as o}from"vue";var s=["inputmode","autocomplete","type","placeholder","disabled","readonly","aria-label","aria-readonly","data-disabled","data-invalid","data-readonly","value"],v=/* @__PURE__ */r({__name:"PinInputField",props:{index:{}},setup(r){const v=r,c=e(l,"<SkdxPinInputField> must be used inside <SkdxPinInput>."),p=n(),f=i(()=>c.charAt(v.index)),x=i(()=>""!==f.value);function m(e){c.setCharAt(v.index,e)}function y(e){if(c.disabled.value)return;const t=e.target.value;if(""!==t)return c.accepts(t)?(m(t),a(e.target,()=>f.value),void(v.index<c.length.value-1&&c.focusIndex(v.index+1))):(e.target.value=f.value,void c.reportInvalid(t,v.index));m("")}function g(e){c.selectOnFocus.value&&e.target.select()}function h(e){if(c.disabled.value)return;const a=t(e.key,e.currentTarget,p());if("Backspace"===a){if(c.readOnly.value)return;e.preventDefault(),f.value?m(""):v.index>0&&(c.setCharAt(v.index-1,""),c.focusIndex(v.index-1))}else if("Delete"===a){if(c.readOnly.value)return;e.preventDefault(),f.value&&m("")}else"ArrowLeft"===a?v.index>0&&(e.preventDefault(),c.focusIndex(v.index-1)):"ArrowRight"===a&&v.index<c.length.value-1&&(e.preventDefault(),c.focusIndex(v.index+1))}function b(e){if(c.disabled.value||c.readOnly.value)return;e.preventDefault();const a=c.sanitizePaste(e.clipboardData?.getData("text")??"");let t="";for(const e of a)c.accepts(e)?t+=e:c.reportInvalid(e,Math.min(v.index+t.length,c.length.value-1));if(!t)return;const n=c.fillFrom(v.index,t);c.focusIndex(Math.min(n+1,c.length.value-1))}return(e,a)=>(u(),d("input",{ref:e=>o(c).registerField(r.index,e),class:"skdx-pin-input__field","data-part":"field",inputmode:"numeric"===o(c).type.value?"numeric":"text",autocomplete:o(c).otp.value&&0===r.index?"one-time-code":"off",type:o(c).mask.value&&x.value?"password":"text",placeholder:o(c).placeholder.value,maxlength:"1",disabled:o(c).disabled.value,readonly:o(c).readOnly.value,"aria-label":o(c).digitLabel.value(r.index+1,o(c).length.value),"aria-readonly":!!o(c).readOnly.value||void 0,"data-disabled":o(c).disabled.value?"":void 0,"data-invalid":o(c).invalid.value?"":void 0,"data-readonly":o(c).readOnly.value?"":void 0,value:f.value,onInput:y,onKeydown:h,onPaste:b,onFocus:g},null,40,s))}});export{v as default};

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

@@ -1,18 +1,37 @@
 import type { ComputedRef, InjectionKey } from 'vue';
+import type { PinInputType } from '../utils/pin-chars.cjs';
 /** @internal Injection key a PinInput provides so its fields can read/drive shared state. */
 export interface PinInputContext {
+    /** Joined value; boxes read via charAt. */
     value: ComputedRef<string>;
     length: ComputedRef<number>;
-    type: ComputedRef<'text' | 'numeric'>;
+    type: ComputedRef<PinInputType>;
     mask: ComputedRef<boolean>;
     disabled: ComputedRef<boolean>;
     invalid: ComputedRef<boolean>;
     readOnly: ComputedRef<boolean>;
-    setValue: (next: string) => void;
+    /** A single character drawn in every empty box, or `undefined` for none. */
+    placeholder: ComputedRef<string | undefined>;
+    /** Whether box 0 advertises `autocomplete="one-time-code"`. */
+    otp: ComputedRef<boolean>;
+    /** Whether a box selects the character it already holds when focus lands in it. */
+    selectOnFocus: ComputedRef<boolean>;
+    /** Whether character passes type/pattern filter. Built once per root. */
+    accepts: (char: string) => boolean;
+    /** Emits `value-invalid` for a character the filter refused. */
+    reportInvalid: (char: string, index: number) => void;
+    /** Character at index, read from slot array (keeps position). */
+    charAt: (index: number) => string;
+    /** Writes one box's character (`''` clears it) and publishes the joined value. */
+    setCharAt: (index: number, char: string) => void;
+    /** Writes consecutive boxes from index; returns last written (paste path). */
+    fillFrom: (index: number, chars: string) => number;
     focusIndex: (index: number) => void;
     registerField: (index: number, el: HTMLInputElement | null) => void;
     /** Runs the root's `sanitize` hook over pasted text; identity when none is set. */
     sanitizePaste: (pasted: string) => string;
+    /** Creates `aria-label` from 1-based index and length. */
+    digitLabel: ComputedRef<(index: number, length: number) => string>;
 }
 /** @internal Injection key a PinInput provides so its fields share value, config, and focus/registration handlers. */
 export declare const PIN_INPUT_CONTEXT: InjectionKey<PinInputContext>;

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

@@ -1,18 +1,37 @@
 import type { ComputedRef, InjectionKey } from 'vue';
+import type { PinInputType } from '../utils/pin-chars.js';
 /** @internal Injection key a PinInput provides so its fields can read/drive shared state. */
 export interface PinInputContext {
+    /** Joined value; boxes read via charAt. */
     value: ComputedRef<string>;
     length: ComputedRef<number>;
-    type: ComputedRef<'text' | 'numeric'>;
+    type: ComputedRef<PinInputType>;
     mask: ComputedRef<boolean>;
     disabled: ComputedRef<boolean>;
     invalid: ComputedRef<boolean>;
     readOnly: ComputedRef<boolean>;
-    setValue: (next: string) => void;
+    /** A single character drawn in every empty box, or `undefined` for none. */
+    placeholder: ComputedRef<string | undefined>;
+    /** Whether box 0 advertises `autocomplete="one-time-code"`. */
+    otp: ComputedRef<boolean>;
+    /** Whether a box selects the character it already holds when focus lands in it. */
+    selectOnFocus: ComputedRef<boolean>;
+    /** Whether character passes type/pattern filter. Built once per root. */
+    accepts: (char: string) => boolean;
+    /** Emits `value-invalid` for a character the filter refused. */
+    reportInvalid: (char: string, index: number) => void;
+    /** Character at index, read from slot array (keeps position). */
+    charAt: (index: number) => string;
+    /** Writes one box's character (`''` clears it) and publishes the joined value. */
+    setCharAt: (index: number, char: string) => void;
+    /** Writes consecutive boxes from index; returns last written (paste path). */
+    fillFrom: (index: number, chars: string) => number;
     focusIndex: (index: number) => void;
     registerField: (index: number, el: HTMLInputElement | null) => void;
     /** Runs the root's `sanitize` hook over pasted text; identity when none is set. */
     sanitizePaste: (pasted: string) => string;
+    /** Creates `aria-label` from 1-based index and length. */
+    digitLabel: ComputedRef<(index: number, length: number) => string>;
 }
 /** @internal Injection key a PinInput provides so its fields share value, config, and focus/registration handlers. */
 export declare const PIN_INPUT_CONTEXT: InjectionKey<PinInputContext>;

package/dist/pin-input/index.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./PinInput.vue.cjs"),i=require("./PinInputField.vue.cjs");exports.SkdxPinInput=e.default;exports.SkdxPinInputField=i.default;
+Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../utils/pin-chars.cjs"),i=require("./PinInput.vue.cjs");exports.SkdxPinInput=i.default;exports.pinInputDigitLabel=e.pinInputDigitLabel;

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

@@ -1,2 +1,2 @@
 export { default as SkdxPinInput } from './PinInput.vue.cjs';
-export { default as SkdxPinInputField } from './PinInputField.vue.cjs';
+export { pinInputDigitLabel } from '../utils/pin-chars.cjs';

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

@@ -1,2 +1,2 @@
 export { default as SkdxPinInput } from './PinInput.vue.js';
-export { default as SkdxPinInputField } from './PinInputField.vue.js';
+export { pinInputDigitLabel } from '../utils/pin-chars.js';

package/dist/pin-input/index.js

@@ -1 +1 @@
-import i from"./PinInput.vue.js";import n from"./PinInputField.vue.js";export{i as SkdxPinInput,n as SkdxPinInputField};
+import{pinInputDigitLabel as i}from"../utils/pin-chars.js";import p from"./PinInput.vue.js";export{p as SkdxPinInput,i as pinInputDigitLabel};

package/dist/pin-input/primitives.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./PinInputField.vue.cjs"),i=require("./PinInput.vue.cjs");exports.SkdxPinInput=i.default;exports.SkdxPinInputField=e.default;

package/dist/pin-input/primitives.d.cts

@@ -0,0 +1,18 @@
+/**
+ * Advanced primitives for `SkdxPinInput` — the parts the recipe composes.
+ *
+ * @example
+ * ```vue
+ * <script setup lang="ts">
+ * import { SkdxPinInput, SkdxPinInputField } from '@skdx/vue/primitives/pin-input';
+ * </script>
+ *
+ * <template>
+ *   <SkdxPinInput :length="4">
+ *     <SkdxPinInputField v-for="i in 4" :key="i - 1" :index="i - 1" />
+ *   </SkdxPinInput>
+ * </template>
+ * ```
+ */
+export { default as SkdxPinInput } from './PinInput.vue.cjs';
+export { default as SkdxPinInputField } from './PinInputField.vue.cjs';

package/dist/pin-input/primitives.d.ts

@@ -0,0 +1,18 @@
+/**
+ * Advanced primitives for `SkdxPinInput` — the parts the recipe composes.
+ *
+ * @example
+ * ```vue
+ * <script setup lang="ts">
+ * import { SkdxPinInput, SkdxPinInputField } from '@skdx/vue/primitives/pin-input';
+ * </script>
+ *
+ * <template>
+ *   <SkdxPinInput :length="4">
+ *     <SkdxPinInputField v-for="i in 4" :key="i - 1" :index="i - 1" />
+ *   </SkdxPinInput>
+ * </template>
+ * ```
+ */
+export { default as SkdxPinInput } from './PinInput.vue.js';
+export { default as SkdxPinInputField } from './PinInputField.vue.js';

package/dist/pin-input/primitives.js

@@ -0,0 +1 @@
+import i from"./PinInputField.vue.js";import n from"./PinInput.vue.js";export{n as SkdxPinInput,i as SkdxPinInputField};

package/dist/pin-input/slots.cjs

@@ -0,0 +1 @@
+function i(n,o){return Array.from({length:o},(l,t)=>n[t]??"")}function r(n){return n.join("")}exports.joinPinSlots=r;exports.toPinSlots=i;

package/dist/pin-input/slots.d.cts

@@ -0,0 +1,5 @@
+/** @internal */
+/** Splits a value into slots, left-packed, with holes only where the user skipped a box. */
+export declare function toPinSlots(value: string, length: number): string[];
+/** Join slots into published value. */
+export declare function joinPinSlots(slots: readonly string[]): string;

package/dist/pin-input/slots.d.ts

@@ -0,0 +1,5 @@
+/** @internal */
+/** Splits a value into slots, left-packed, with holes only where the user skipped a box. */
+export declare function toPinSlots(value: string, length: number): string[];
+/** Join slots into published value. */
+export declare function joinPinSlots(slots: readonly string[]): string;

package/dist/pin-input/slots.js

@@ -0,0 +1 @@
+function n(n,o){return Array.from({length:o},(o,t)=>n[t]??"")}function o(n){return n.join("")}export{o as joinPinSlots,n as toPinSlots};

package/dist/popover/Popover.vue.d.cts

@@ -1,42 +1,122 @@
+import type { Align, Side } from '../utils/popper.cjs';
+import type { PopoverModality, PopoverOpenOn, PopoverRole } from './context.cjs';
 /**
- * The Vue implementation of the shared Popover contract (see
- * `@skdx/shared`'s `popoverContract`). Root of a non-modal-by-default
- * popover: owns open state and hands it down to `SkdxPopoverTrigger` /
- * `SkdxPopoverAnchor` / `SkdxPopoverPortal` / `SkdxPopoverContent` /
- * `SkdxPopoverArrow` / `SkdxPopoverClose` via context. Wraps children in the
- * shared popper positioning root, so `SkdxPopoverContent` can float relative
- * to the trigger (or a custom `SkdxPopoverAnchor`). Renders no DOM of its own.
+ * Non-modal-by-default popover that owns open state and renders trigger, title, description, body, and close button — or, under `open-on="hover"` and `role="tooltip"`, a delayed bubble that describes its trigger.
  *
- * Emits `open-change` the instant the state flips and `open-change-complete`
- * once the change has finished on screen — after `SkdxPopoverContent`'s enter
- * or exit animation ends, or in the same task when it declares none.
- *
- * Works controlled (`v-model:open`) or uncontrolled (`default-open`).
+ * @example
+ * ```vue
+ * <SkdxPopover title="Share this page">
+ *   <template #trigger>Share</template>
+ *   <p>Anyone with the link can view it.</p>
+ * </SkdxPopover>
+ * ```
  */
 type __VLS_Props = {
     /** Whether the popover is open, for controlled usage via v-model:open. */
-    open?: boolean;
+    open?: boolean | undefined;
     /** Whether the popover is initially open, for uncontrolled usage. */
     defaultOpen?: boolean;
-    /** Whether SkdxPopoverContent traps focus while open. Non-modal (the default) lets the rest of the page stay interactive. */
-    modal?: boolean;
+    /**
+     * Which gesture reveals the panel: a click on the derived Trigger, or a pointer resting on it.
+     * @default 'click'
+     */
+    openOn?: PopoverOpenOn;
+    /**
+     * What the panel is: an operable `role="dialog"`, or an inert `role="tooltip"` bubble the Trigger is described by.
+     * @default 'dialog'
+     */
+    role?: PopoverRole;
+    /**
+     * Delay in milliseconds before a hover popover opens on pointer enter.
+     * @default 700, or an ancestor Provider's `delayDuration` under `role="tooltip"`
+     */
+    openDelay?: number | undefined;
+    /**
+     * Delay in milliseconds before a hover popover closes once the pointer has left both Trigger and panel.
+     * @default 300, or an ancestor Provider's `closeDelay` under `role="tooltip"`
+     */
+    closeDelay?: number | undefined;
+    /**
+     * Whether moving the pointer from the Trigger onto the panel closes it instead of keeping it open.
+     * @default false
+     */
+    disableHoverableContent?: boolean | undefined;
+    /**
+     * Stands the popover down: it is forced closed and no gesture opens it.
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * Destination of the derived Trigger anchor, which is what makes a hover panel reachable without a pointer.
+     * @default undefined — the derived Trigger renders a button.
+     */
+    href?: string | undefined;
+    /**
+     * How much of the page the open popover takes over: `'none'` contains nothing,
+     * `'trap-focus'` traps Tab and marks the rest of the document inert, `'modal'` also locks body scroll. Forced to `'none'` under `role="tooltip"`.
+     * @default 'none'
+     */
+    modal?: PopoverModality;
+    /**
+     * Title rendered by the derived anatomy as `SkdxPopoverTitle`.
+     * @default undefined — no title is rendered.
+     */
+    title?: string | undefined;
+    /**
+     * Description rendered by the derived anatomy as
+     * `SkdxPopoverDescription`.
+     * @default undefined — no description is rendered.
+     */
+    description?: string | undefined;
+    /**
+     * Preferred edge of the trigger the derived panel is placed against.
+     * @default 'bottom'
+     */
+    side?: Side;
+    /**
+     * Preferred alignment of the derived panel along `side`.
+     * @default 'center'
+     */
+    align?: Align;
+    /**
+     * Whether the derived panel includes a `SkdxPopoverArrow`.
+     * @default false
+     */
+    showArrow?: boolean;
 };
-declare var __VLS_5: {};
+declare var __VLS_16: {}, __VLS_18: {};
 type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_5) => any;
+    trigger?: (props: typeof __VLS_16) => any;
+} & {
+    default?: (props: typeof __VLS_18) => any;
 };
-declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {
+    /** Recomputes the open panel's position immediately, for an anchor that moved without the floating layer noticing. */
+    reposition: () => void | undefined;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:open": (open: boolean) => any;
     "open-change": (open: boolean) => any;
+    "escape-key-down": (event: KeyboardEvent) => any;
     "open-change-complete": (open: boolean) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
-    "onUpdate:open"?: ((open: boolean) => any) | undefined;
-    "onOpen-change"?: ((open: boolean) => any) | undefined;
-    "onOpen-change-complete"?: ((open: boolean) => any) | undefined;
+    "onUpdate:open"?: (open: boolean) => any;
+    "onOpen-change"?: (open: boolean) => any;
+    "onEscape-key-down"?: (event: KeyboardEvent) => any;
+    "onOpen-change-complete"?: (open: boolean) => any;
 }>, {
-    open: boolean;
+    disabled: boolean;
+    role: PopoverRole;
+    open: boolean | undefined;
     defaultOpen: boolean;
-    modal: boolean;
+    align: Align;
+    side: Side;
+    modal: PopoverModality;
+    href: string | undefined;
+    openOn: PopoverOpenOn;
+    showArrow: boolean;
+    openDelay: number | undefined;
+    closeDelay: number | undefined;
+    disableHoverableContent: boolean | undefined;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;

package/dist/popover/Popover.vue.d.ts

@@ -1,42 +1,122 @@
+import type { Align, Side } from '../utils/popper.js';
+import type { PopoverModality, PopoverOpenOn, PopoverRole } from './context.js';
 /**
- * The Vue implementation of the shared Popover contract (see
- * `@skdx/shared`'s `popoverContract`). Root of a non-modal-by-default
- * popover: owns open state and hands it down to `SkdxPopoverTrigger` /
- * `SkdxPopoverAnchor` / `SkdxPopoverPortal` / `SkdxPopoverContent` /
- * `SkdxPopoverArrow` / `SkdxPopoverClose` via context. Wraps children in the
- * shared popper positioning root, so `SkdxPopoverContent` can float relative
- * to the trigger (or a custom `SkdxPopoverAnchor`). Renders no DOM of its own.
+ * Non-modal-by-default popover that owns open state and renders trigger, title, description, body, and close button — or, under `open-on="hover"` and `role="tooltip"`, a delayed bubble that describes its trigger.
  *
- * Emits `open-change` the instant the state flips and `open-change-complete`
- * once the change has finished on screen — after `SkdxPopoverContent`'s enter
- * or exit animation ends, or in the same task when it declares none.
- *
- * Works controlled (`v-model:open`) or uncontrolled (`default-open`).
+ * @example
+ * ```vue
+ * <SkdxPopover title="Share this page">
+ *   <template #trigger>Share</template>
+ *   <p>Anyone with the link can view it.</p>
+ * </SkdxPopover>
+ * ```
  */
 type __VLS_Props = {
     /** Whether the popover is open, for controlled usage via v-model:open. */
-    open?: boolean;
+    open?: boolean | undefined;
     /** Whether the popover is initially open, for uncontrolled usage. */
     defaultOpen?: boolean;
-    /** Whether SkdxPopoverContent traps focus while open. Non-modal (the default) lets the rest of the page stay interactive. */
-    modal?: boolean;
+    /**
+     * Which gesture reveals the panel: a click on the derived Trigger, or a pointer resting on it.
+     * @default 'click'
+     */
+    openOn?: PopoverOpenOn;
+    /**
+     * What the panel is: an operable `role="dialog"`, or an inert `role="tooltip"` bubble the Trigger is described by.
+     * @default 'dialog'
+     */
+    role?: PopoverRole;
+    /**
+     * Delay in milliseconds before a hover popover opens on pointer enter.
+     * @default 700, or an ancestor Provider's `delayDuration` under `role="tooltip"`
+     */
+    openDelay?: number | undefined;
+    /**
+     * Delay in milliseconds before a hover popover closes once the pointer has left both Trigger and panel.
+     * @default 300, or an ancestor Provider's `closeDelay` under `role="tooltip"`
+     */
+    closeDelay?: number | undefined;
+    /**
+     * Whether moving the pointer from the Trigger onto the panel closes it instead of keeping it open.
+     * @default false
+     */
+    disableHoverableContent?: boolean | undefined;
+    /**
+     * Stands the popover down: it is forced closed and no gesture opens it.
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * Destination of the derived Trigger anchor, which is what makes a hover panel reachable without a pointer.
+     * @default undefined — the derived Trigger renders a button.
+     */
+    href?: string | undefined;
+    /**
+     * How much of the page the open popover takes over: `'none'` contains nothing,
+     * `'trap-focus'` traps Tab and marks the rest of the document inert, `'modal'` also locks body scroll. Forced to `'none'` under `role="tooltip"`.
+     * @default 'none'
+     */
+    modal?: PopoverModality;
+    /**
+     * Title rendered by the derived anatomy as `SkdxPopoverTitle`.
+     * @default undefined — no title is rendered.
+     */
+    title?: string | undefined;
+    /**
+     * Description rendered by the derived anatomy as
+     * `SkdxPopoverDescription`.
+     * @default undefined — no description is rendered.
+     */
+    description?: string | undefined;
+    /**
+     * Preferred edge of the trigger the derived panel is placed against.
+     * @default 'bottom'
+     */
+    side?: Side;
+    /**
+     * Preferred alignment of the derived panel along `side`.
+     * @default 'center'
+     */
+    align?: Align;
+    /**
+     * Whether the derived panel includes a `SkdxPopoverArrow`.
+     * @default false
+     */
+    showArrow?: boolean;
 };
-declare var __VLS_5: {};
+declare var __VLS_16: {}, __VLS_18: {};
 type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_5) => any;
+    trigger?: (props: typeof __VLS_16) => any;
+} & {
+    default?: (props: typeof __VLS_18) => any;
 };
-declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {
+    /** Recomputes the open panel's position immediately, for an anchor that moved without the floating layer noticing. */
+    reposition: () => void | undefined;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:open": (open: boolean) => any;
     "open-change": (open: boolean) => any;
+    "escape-key-down": (event: KeyboardEvent) => any;
     "open-change-complete": (open: boolean) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
-    "onUpdate:open"?: ((open: boolean) => any) | undefined;
-    "onOpen-change"?: ((open: boolean) => any) | undefined;
-    "onOpen-change-complete"?: ((open: boolean) => any) | undefined;
+    "onUpdate:open"?: (open: boolean) => any;
+    "onOpen-change"?: (open: boolean) => any;
+    "onEscape-key-down"?: (event: KeyboardEvent) => any;
+    "onOpen-change-complete"?: (open: boolean) => any;
 }>, {
-    open: boolean;
+    disabled: boolean;
+    role: PopoverRole;
+    open: boolean | undefined;
     defaultOpen: boolean;
-    modal: boolean;
+    align: Align;
+    side: Side;
+    modal: PopoverModality;
+    href: string | undefined;
+    openOn: PopoverOpenOn;
+    showArrow: boolean;
+    openDelay: number | undefined;
+    closeDelay: number | undefined;
+    disableHoverableContent: boolean | undefined;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;

package/dist/popover/Popover.vue_vue_type_script_setup_true_lang.cjs

@@ -1 +1 @@
-const i=require("../utils/useOpenChangeComplete.cjs"),_=require("../utils/PopperRoot.vue.cjs"),r=require("./context.cjs");let e=require("vue");var m=(0,e.defineComponent)({__name:"Popover",props:{open:{type:Boolean,default:void 0},defaultOpen:{type:Boolean,default:!1},modal:{type:Boolean,default:!1}},emits:["update:open","open-change","open-change-complete"],setup(a,{emit:c}){const t=a,n=c,d=(0,e.ref)(null),p=(0,e.ref)(null),l=(0,e.ref)(t.defaultOpen),u=(0,e.computed)(()=>t.open??l.value),s=(0,e.computed)(()=>t.modal);i.useOpenChangeComplete(u,p,o=>n("open-change-complete",o));function f(o){t.open===void 0&&(l.value=o),n("update:open",o),n("open-change",o)}return(0,e.provide)(r.POPOVER_CONTEXT,{triggerRef:d,contentRef:p,contentId:r.nextPopoverContentId(),open:u,modal:s,setOpen:f}),(o,v)=>((0,e.openBlock)(),(0,e.createBlock)(_.default,null,{default:(0,e.withCtx)(()=>[(0,e.renderSlot)(o.$slots,"default")]),_:3}))}});exports.default=m;
+const r=require("./PopoverAnatomy.vue.cjs"),u=require("./PopoverRoot.vue.cjs");let o=require("vue");var s=(0,o.defineComponent)({inheritAttrs:!1,__name:"Popover",props:{open:{type:Boolean,default:void 0},defaultOpen:{type:Boolean,default:!1},openOn:{default:"click"},role:{default:"dialog"},openDelay:{default:void 0},closeDelay:{default:void 0},disableHoverableContent:{type:Boolean,default:void 0},disabled:{type:Boolean,default:!1},href:{default:void 0},modal:{default:"none"},title:{},description:{},side:{default:"bottom"},align:{default:"center"},showArrow:{type:Boolean,default:!1}},emits:["update:open","open-change","open-change-complete","escape-key-down"],setup(e,{expose:i}){const a=e,d=(0,o.ref)(null);return i({reposition:()=>d.value?.reposition()}),(l,t)=>((0,o.openBlock)(),(0,o.createBlock)(u.default,{ref_key:"rootRef",ref:d,open:e.open,"default-open":e.defaultOpen,"open-on":e.openOn,role:e.role,"open-delay":e.openDelay,"close-delay":e.closeDelay,"disable-hoverable-content":e.disableHoverableContent,disabled:e.disabled,href:e.href,modal:e.modal,"onUpdate:open":t[0]||(t[0]=n=>l.$emit("update:open",n)),onOpenChange:t[1]||(t[1]=n=>l.$emit("open-change",n)),onOpenChangeComplete:t[2]||(t[2]=n=>l.$emit("open-change-complete",n)),onEscapeKeyDown:t[3]||(t[3]=n=>l.$emit("escape-key-down",n))},{default:(0,o.withCtx)(()=>[(0,o.createVNode)(r.default,(0,o.mergeProps)(l.$attrs,{title:e.title,description:e.description,side:a.side,align:a.align,"show-arrow":a.showArrow}),{trigger:(0,o.withCtx)(()=>[(0,o.renderSlot)(l.$slots,"trigger")]),default:(0,o.withCtx)(()=>[(0,o.renderSlot)(l.$slots,"default")]),_:3},16,["title","description","side","align","show-arrow"])]),_:3},8,["open","default-open","open-on","role","open-delay","close-delay","disable-hoverable-content","disabled","href","modal"]))}});exports.default=s;