Socket
Socket
Sign inDemoInstall

@headlessui/vue

Package Overview
Dependencies
Maintainers
2
Versions
670
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@headlessui/vue - npm Package Compare versions

Comparing version 0.1.1 to 0.1.2

5

dist/components/menu/menu.d.ts

@@ -70,6 +70,2 @@ import { Ref } from 'vue';

};
onClick: {
type: FunctionConstructor;
required: false;
};
}, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {

@@ -85,3 +81,2 @@ [key: string]: any;

className?: string | Function | undefined;
onClick?: Function | undefined;
}>, {

@@ -88,0 +83,0 @@ as: string;

8

dist/headlessui.cjs.development.js

@@ -533,6 +533,2 @@ 'use strict';

required: false
},
onClick: {
type: Function,
required: false
}

@@ -603,3 +599,2 @@ },

if (disabled) return event.preventDefault();
if (props.onClick) return props.onClick(event);
}

@@ -617,4 +612,3 @@

"class": resolvePropValue(className, slot),
disabled: disabled === true ? disabled : undefined,
'aria-disabled': disabled === true ? disabled : undefined,
'aria-disabled': disabled === true ? true : undefined,
onClick: handleClick,

@@ -621,0 +615,0 @@ onFocus: handleFocus,

2

dist/headlessui.cjs.production.min.js

@@ -1,2 +0,2 @@

"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("vue");function t(){return(t=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var o in n)Object.prototype.hasOwnProperty.call(n,o)&&(e[o]=n[o])}return e}).apply(this,arguments)}function n(e,t){if(null==e)return{};var n,o,r={},u=Object.keys(e);for(o=0;o<u.length;o++)t.indexOf(n=u[o])>=0||(r[n]=e[n]);return r}function o(e,t){if(e in t){for(var n=t[e],r=arguments.length,u=new Array(r>2?r-2:0),a=2;a<r;a++)u[a-2]=arguments[a];return"function"==typeof n?n.apply(void 0,u):n}var i=new Error('Tried to handle "'+e+'" but there is no handler defined. Only defined handlers are: '+Object.keys(t).map((function(e){return'"'+e+'"'})).join(", ")+".");throw Error.captureStackTrace&&Error.captureStackTrace(i,o),i}function r(t){var o,r=t.props,u=t.attrs,a=t.slots,i=t.slot,l=r.as,s=n(r,["as"]),c=null===(o=a.default)||void 0===o?void 0:o.call(a,i);if("template"===l){if(Object.keys(s).length>0||"class"in u){var d=null!=c?c:[],v=d[0];if(d.slice(1).length>0)throw new Error('You should only render 1 child or use the `as="..."` prop');return e.cloneVNode(v,s)}return c}return e.h(l,s,c)}var u,a,i,l=0;function s(){return++l}!function(e){e[e.Open=0]="Open",e[e.Closed=1]="Closed"}(u||(u={})),function(e){e.Space=" ",e.Enter="Enter",e.Escape="Escape",e.Backspace="Backspace",e.ArrowUp="ArrowUp",e.ArrowDown="ArrowDown",e.Home="Home",e.End="End",e.PageUp="PageUp",e.PageDown="PageDown",e.Tab="Tab"}(a||(a={})),function(e){e[e.FirstItem=0]="FirstItem",e[e.PreviousItem=1]="PreviousItem",e[e.NextItem=2]="NextItem",e[e.LastItem=3]="LastItem",e[e.SpecificItem=4]="SpecificItem",e[e.Nothing=5]="Nothing"}(i||(i={}));var c=Symbol("MenuContext");function d(t){var n=e.inject(c);if(void 0===n){var o=new Error("<"+t+" /> is missing a parent <Menu /> component.");throw Error.captureStackTrace&&Error.captureStackTrace(o,d),o}return n}var v=e.defineComponent({props:{as:{type:[Object,String],default:"template"}},setup:function(t,n){var a=n.slots,l=n.attrs,s=e.ref(u.Closed),d=e.ref(null),v=e.ref(null),f=e.ref([]),p=e.ref(""),m=e.ref(null),I={menuState:s,buttonRef:d,itemsRef:v,items:f,searchQuery:p,activeItemIndex:m,toggleMenu:function(){var e;s.value=o(s.value,((e={})[u.Closed]=u.Open,e[u.Open]=u.Closed,e))},closeMenu:function(){return s.value=u.Closed},openMenu:function(){return s.value=u.Open},goToItem:function(e,t){var n=function(e,t){var n,r;if(f.value.length<=0)return null;var u=null!==(n=m.value)&&void 0!==n?n:-1,a=o(e,((r={})[i.FirstItem]=function(){return f.value.findIndex((function(e){return!e.dataRef.disabled}))},r[i.PreviousItem]=function(){var e=f.value.slice().reverse().findIndex((function(e,t,n){return!(-1!==u&&n.length-t-1>=u||e.dataRef.disabled)}));return-1===e?e:f.value.length-1-e},r[i.NextItem]=function(){return f.value.findIndex((function(e,t){return!(t<=u||e.dataRef.disabled)}))},r[i.LastItem]=function(){var e=f.value.slice().reverse().findIndex((function(e){return!e.dataRef.disabled}));return-1===e?e:f.value.length-1-e},r[i.SpecificItem]=function(){return f.value.findIndex((function(e){return e.id===t}))},r[i.Nothing]=function(){return null},r));return-1===a?m.value:a}(e,t);""===p.value&&m.value===n||(p.value="",m.value=n)},search:function(e){p.value+=e;var t=f.value.findIndex((function(e){return e.dataRef.textValue.startsWith(p.value)&&!e.dataRef.disabled}));-1!==t&&t!==m.value&&(m.value=t)},clearSearch:function(){p.value=""},registerItem:function(e,t){f.value.push({id:e,dataRef:t})},unregisterItem:function(e){var t=f.value.slice(),n=null!==m.value?t[m.value]:null,o=t.findIndex((function(t){return t.id===e}));-1!==o&&t.splice(o,1),f.value=t,m.value=o===m.value||null===n?null:t.indexOf(n)}};return e.onMounted((function(){function t(t){var n;t.defaultPrevented||s.value===u.Open&&((null===(n=v.value)||void 0===n?void 0:n.contains(t.target))||(I.closeMenu(),e.nextTick((function(){var e;return null===(e=d.value)||void 0===e?void 0:e.focus()}))))}window.addEventListener("pointerdown",t),e.onUnmounted((function(){return window.removeEventListener("pointerdown",t)}))})),e.provide(c,I),function(){return r({props:t,slot:{open:s.value===u.Open},slots:a,attrs:l})}}}),f=e.defineComponent({props:{as:{type:[Object,String],default:"button"}},render:function(){var e,n=d("MenuButton"),o={open:n.menuState.value===u.Open},a={ref:"el",id:this.id,type:"button","aria-haspopup":!0,"aria-controls":null===(e=n.itemsRef.value)||void 0===e?void 0:e.id,"aria-expanded":n.menuState.value===u.Open||void 0,onKeyDown:this.handleKeyDown,onFocus:this.handleFocus,onPointerUp:this.handlePointerUp,onPointerDown:this.handlePointerDown};return r({props:t({},this.$props,a),slot:o,attrs:this.$attrs,slots:this.$slots})},setup:function(){var t=d("MenuButton");return{id:"headlessui-menu-button-"+s(),el:t.buttonRef,handleKeyDown:function(n){switch(n.key){case a.Space:case a.Enter:case a.ArrowDown:n.preventDefault(),t.openMenu(),e.nextTick((function(){var e;null===(e=t.itemsRef.value)||void 0===e||e.focus(),t.goToItem(i.FirstItem)}));break;case a.ArrowUp:n.preventDefault(),t.openMenu(),e.nextTick((function(){var e;null===(e=t.itemsRef.value)||void 0===e||e.focus(),t.goToItem(i.LastItem)}))}},handlePointerDown:function(e){e.preventDefault()},handlePointerUp:function(){t.toggleMenu(),e.nextTick((function(){var e;return null===(e=t.itemsRef.value)||void 0===e?void 0:e.focus()}))},handleFocus:function(){var e;t.menuState.value===u.Open&&(null===(e=t.itemsRef.value)||void 0===e||e.focus())}}}}),p=e.defineComponent({props:{as:{type:[Object,String],default:"div"},static:{type:Boolean,default:!1}},render:function(){var e,o,a=d("MenuItems"),i=this.$props,l=i.static,s=n(i,["static"]);if(!l&&a.menuState.value===u.Closed)return null;var c={open:a.menuState.value===u.Open};return r({props:t({},s,{"aria-activedescendant":null===a.activeItemIndex.value||null===(e=a.items.value[a.activeItemIndex.value])||void 0===e?void 0:e.id,"aria-labelledby":null===(o=a.buttonRef.value)||void 0===o?void 0:o.id,id:this.id,onKeyDown:this.handleKeyDown,role:"menu",tabIndex:0,ref:"el"}),slot:c,attrs:this.$attrs,slots:this.$slots})},setup:function(){var t=d("MenuItems"),n="headlessui-menu-items-"+s(),o=e.ref(null);return{id:n,el:t.itemsRef,handleKeyDown:function(n){switch(o.value&&clearTimeout(o.value),n.key){case a.Enter:var r;t.closeMenu(),null!==t.activeItemIndex.value&&(null===(r=document.getElementById(t.items.value[t.activeItemIndex.value].id))||void 0===r||r.click(),e.nextTick((function(){var e;return null===(e=t.buttonRef.value)||void 0===e?void 0:e.focus()})));break;case a.ArrowDown:return t.goToItem(i.NextItem);case a.ArrowUp:return t.goToItem(i.PreviousItem);case a.Home:case a.PageUp:return t.goToItem(i.FirstItem);case a.End:case a.PageDown:return t.goToItem(i.LastItem);case a.Escape:t.closeMenu(),e.nextTick((function(){var e;return null===(e=t.buttonRef.value)||void 0===e?void 0:e.focus()}));break;case a.Tab:return n.preventDefault();default:1===n.key.length&&(t.search(n.key),o.value=setTimeout((function(){return t.clearSearch()}),350))}}}}}),m=e.defineComponent({props:{as:{type:[Object,String],default:"template"},disabled:{type:Boolean,default:!1},class:{type:[String,Function],required:!1},className:{type:[String,Function],required:!1},onClick:{type:Function,required:!1}},setup:function(n,o){var u=o.slots,a=o.attrs,l=d("MenuItem"),c="headlessui-menu-item-"+s(),v=n.disabled,f=n.className,p=void 0===f?n.class:f,m=e.computed((function(){return null!==l.activeItemIndex.value&&l.items.value[l.activeItemIndex.value].id===c})),h=e.ref({disabled:v,textValue:""});function g(){v||l.goToItem(i.SpecificItem,c)}function b(){if(v)return l.goToItem(i.Nothing);l.goToItem(i.SpecificItem,c)}function w(){v||l.goToItem(i.Nothing)}function x(){v||m.value||l.goToItem(i.SpecificItem,c)}function y(t){v||(t.preventDefault(),l.closeMenu(),e.nextTick((function(){var e;return null===(e=l.buttonRef.value)||void 0===e?void 0:e.focus()})))}function T(e){return v?e.preventDefault():n.onClick?n.onClick(e):void 0}return e.onMounted((function(){var e,t,n=null===(e=document.getElementById(c))||void 0===e||null===(t=e.textContent)||void 0===t?void 0:t.toLowerCase().trim();void 0!==n&&(h.value.textValue=n)})),e.onMounted((function(){return l.registerItem(c,h)})),e.onUnmounted((function(){return l.unregisterItem(c)})),function(){var e={active:m.value,disabled:v},o={id:c,role:"menuitem",tabIndex:-1,class:I(p,e),disabled:!0===v?v:void 0,"aria-disabled":!0===v?v:void 0,onClick:T,onFocus:b,onMouseMove:x,onPointerEnter:g,onPointerLeave:w,onPointerUp:y};return r({props:t({},n,o),slot:e,attrs:a,slots:u})}}});function I(e,t){if(void 0!==e)return"function"==typeof e?e(t):e}exports.Menu=v,exports.MenuButton=f,exports.MenuItem=m,exports.MenuItems=p;
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("vue");function t(){return(t=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e}).apply(this,arguments)}function n(e,t){if(null==e)return{};var n,r,o={},u=Object.keys(e);for(r=0;r<u.length;r++)t.indexOf(n=u[r])>=0||(o[n]=e[n]);return o}function r(e,t){if(e in t){for(var n=t[e],o=arguments.length,u=new Array(o>2?o-2:0),a=2;a<o;a++)u[a-2]=arguments[a];return"function"==typeof n?n.apply(void 0,u):n}var i=new Error('Tried to handle "'+e+'" but there is no handler defined. Only defined handlers are: '+Object.keys(t).map((function(e){return'"'+e+'"'})).join(", ")+".");throw Error.captureStackTrace&&Error.captureStackTrace(i,r),i}function o(t){var r,o=t.props,u=t.attrs,a=t.slots,i=t.slot,l=o.as,s=n(o,["as"]),c=null===(r=a.default)||void 0===r?void 0:r.call(a,i);if("template"===l){if(Object.keys(s).length>0||"class"in u){var d=null!=c?c:[],v=d[0];if(d.slice(1).length>0)throw new Error('You should only render 1 child or use the `as="..."` prop');return e.cloneVNode(v,s)}return c}return e.h(l,s,c)}var u,a,i,l=0;function s(){return++l}!function(e){e[e.Open=0]="Open",e[e.Closed=1]="Closed"}(u||(u={})),function(e){e.Space=" ",e.Enter="Enter",e.Escape="Escape",e.Backspace="Backspace",e.ArrowUp="ArrowUp",e.ArrowDown="ArrowDown",e.Home="Home",e.End="End",e.PageUp="PageUp",e.PageDown="PageDown",e.Tab="Tab"}(a||(a={})),function(e){e[e.FirstItem=0]="FirstItem",e[e.PreviousItem=1]="PreviousItem",e[e.NextItem=2]="NextItem",e[e.LastItem=3]="LastItem",e[e.SpecificItem=4]="SpecificItem",e[e.Nothing=5]="Nothing"}(i||(i={}));var c=Symbol("MenuContext");function d(t){var n=e.inject(c);if(void 0===n){var r=new Error("<"+t+" /> is missing a parent <Menu /> component.");throw Error.captureStackTrace&&Error.captureStackTrace(r,d),r}return n}var v=e.defineComponent({props:{as:{type:[Object,String],default:"template"}},setup:function(t,n){var a=n.slots,l=n.attrs,s=e.ref(u.Closed),d=e.ref(null),v=e.ref(null),f=e.ref([]),p=e.ref(""),m=e.ref(null),I={menuState:s,buttonRef:d,itemsRef:v,items:f,searchQuery:p,activeItemIndex:m,toggleMenu:function(){var e;s.value=r(s.value,((e={})[u.Closed]=u.Open,e[u.Open]=u.Closed,e))},closeMenu:function(){return s.value=u.Closed},openMenu:function(){return s.value=u.Open},goToItem:function(e,t){var n=function(e,t){var n,o;if(f.value.length<=0)return null;var u=null!==(n=m.value)&&void 0!==n?n:-1,a=r(e,((o={})[i.FirstItem]=function(){return f.value.findIndex((function(e){return!e.dataRef.disabled}))},o[i.PreviousItem]=function(){var e=f.value.slice().reverse().findIndex((function(e,t,n){return!(-1!==u&&n.length-t-1>=u||e.dataRef.disabled)}));return-1===e?e:f.value.length-1-e},o[i.NextItem]=function(){return f.value.findIndex((function(e,t){return!(t<=u||e.dataRef.disabled)}))},o[i.LastItem]=function(){var e=f.value.slice().reverse().findIndex((function(e){return!e.dataRef.disabled}));return-1===e?e:f.value.length-1-e},o[i.SpecificItem]=function(){return f.value.findIndex((function(e){return e.id===t}))},o[i.Nothing]=function(){return null},o));return-1===a?m.value:a}(e,t);""===p.value&&m.value===n||(p.value="",m.value=n)},search:function(e){p.value+=e;var t=f.value.findIndex((function(e){return e.dataRef.textValue.startsWith(p.value)&&!e.dataRef.disabled}));-1!==t&&t!==m.value&&(m.value=t)},clearSearch:function(){p.value=""},registerItem:function(e,t){f.value.push({id:e,dataRef:t})},unregisterItem:function(e){var t=f.value.slice(),n=null!==m.value?t[m.value]:null,r=t.findIndex((function(t){return t.id===e}));-1!==r&&t.splice(r,1),f.value=t,m.value=r===m.value||null===n?null:t.indexOf(n)}};return e.onMounted((function(){function t(t){var n;t.defaultPrevented||s.value===u.Open&&((null===(n=v.value)||void 0===n?void 0:n.contains(t.target))||(I.closeMenu(),e.nextTick((function(){var e;return null===(e=d.value)||void 0===e?void 0:e.focus()}))))}window.addEventListener("pointerdown",t),e.onUnmounted((function(){return window.removeEventListener("pointerdown",t)}))})),e.provide(c,I),function(){return o({props:t,slot:{open:s.value===u.Open},slots:a,attrs:l})}}}),f=e.defineComponent({props:{as:{type:[Object,String],default:"button"}},render:function(){var e,n=d("MenuButton"),r={open:n.menuState.value===u.Open},a={ref:"el",id:this.id,type:"button","aria-haspopup":!0,"aria-controls":null===(e=n.itemsRef.value)||void 0===e?void 0:e.id,"aria-expanded":n.menuState.value===u.Open||void 0,onKeyDown:this.handleKeyDown,onFocus:this.handleFocus,onPointerUp:this.handlePointerUp,onPointerDown:this.handlePointerDown};return o({props:t({},this.$props,a),slot:r,attrs:this.$attrs,slots:this.$slots})},setup:function(){var t=d("MenuButton");return{id:"headlessui-menu-button-"+s(),el:t.buttonRef,handleKeyDown:function(n){switch(n.key){case a.Space:case a.Enter:case a.ArrowDown:n.preventDefault(),t.openMenu(),e.nextTick((function(){var e;null===(e=t.itemsRef.value)||void 0===e||e.focus(),t.goToItem(i.FirstItem)}));break;case a.ArrowUp:n.preventDefault(),t.openMenu(),e.nextTick((function(){var e;null===(e=t.itemsRef.value)||void 0===e||e.focus(),t.goToItem(i.LastItem)}))}},handlePointerDown:function(e){e.preventDefault()},handlePointerUp:function(){t.toggleMenu(),e.nextTick((function(){var e;return null===(e=t.itemsRef.value)||void 0===e?void 0:e.focus()}))},handleFocus:function(){var e;t.menuState.value===u.Open&&(null===(e=t.itemsRef.value)||void 0===e||e.focus())}}}}),p=e.defineComponent({props:{as:{type:[Object,String],default:"div"},static:{type:Boolean,default:!1}},render:function(){var e,r,a=d("MenuItems"),i=this.$props,l=i.static,s=n(i,["static"]);if(!l&&a.menuState.value===u.Closed)return null;var c={open:a.menuState.value===u.Open};return o({props:t({},s,{"aria-activedescendant":null===a.activeItemIndex.value||null===(e=a.items.value[a.activeItemIndex.value])||void 0===e?void 0:e.id,"aria-labelledby":null===(r=a.buttonRef.value)||void 0===r?void 0:r.id,id:this.id,onKeyDown:this.handleKeyDown,role:"menu",tabIndex:0,ref:"el"}),slot:c,attrs:this.$attrs,slots:this.$slots})},setup:function(){var t=d("MenuItems"),n="headlessui-menu-items-"+s(),r=e.ref(null);return{id:n,el:t.itemsRef,handleKeyDown:function(n){switch(r.value&&clearTimeout(r.value),n.key){case a.Enter:var o;t.closeMenu(),null!==t.activeItemIndex.value&&(null===(o=document.getElementById(t.items.value[t.activeItemIndex.value].id))||void 0===o||o.click(),e.nextTick((function(){var e;return null===(e=t.buttonRef.value)||void 0===e?void 0:e.focus()})));break;case a.ArrowDown:return t.goToItem(i.NextItem);case a.ArrowUp:return t.goToItem(i.PreviousItem);case a.Home:case a.PageUp:return t.goToItem(i.FirstItem);case a.End:case a.PageDown:return t.goToItem(i.LastItem);case a.Escape:t.closeMenu(),e.nextTick((function(){var e;return null===(e=t.buttonRef.value)||void 0===e?void 0:e.focus()}));break;case a.Tab:return n.preventDefault();default:1===n.key.length&&(t.search(n.key),r.value=setTimeout((function(){return t.clearSearch()}),350))}}}}}),m=e.defineComponent({props:{as:{type:[Object,String],default:"template"},disabled:{type:Boolean,default:!1},class:{type:[String,Function],required:!1},className:{type:[String,Function],required:!1}},setup:function(n,r){var u=r.slots,a=r.attrs,l=d("MenuItem"),c="headlessui-menu-item-"+s(),v=n.disabled,f=n.className,p=void 0===f?n.class:f,m=e.computed((function(){return null!==l.activeItemIndex.value&&l.items.value[l.activeItemIndex.value].id===c})),h=e.ref({disabled:v,textValue:""});function g(){v||l.goToItem(i.SpecificItem,c)}function b(){if(v)return l.goToItem(i.Nothing);l.goToItem(i.SpecificItem,c)}function w(){v||l.goToItem(i.Nothing)}function x(){v||m.value||l.goToItem(i.SpecificItem,c)}function y(t){v||(t.preventDefault(),l.closeMenu(),e.nextTick((function(){var e;return null===(e=l.buttonRef.value)||void 0===e?void 0:e.focus()})))}function T(e){if(v)return e.preventDefault()}return e.onMounted((function(){var e,t,n=null===(e=document.getElementById(c))||void 0===e||null===(t=e.textContent)||void 0===t?void 0:t.toLowerCase().trim();void 0!==n&&(h.value.textValue=n)})),e.onMounted((function(){return l.registerItem(c,h)})),e.onUnmounted((function(){return l.unregisterItem(c)})),function(){var e={active:m.value,disabled:v},r={id:c,role:"menuitem",tabIndex:-1,class:I(p,e),"aria-disabled":!0===v||void 0,onClick:T,onFocus:b,onMouseMove:x,onPointerEnter:g,onPointerLeave:w,onPointerUp:y};return o({props:t({},n,r),slot:e,attrs:a,slots:u})}}});function I(e,t){if(void 0!==e)return"function"==typeof e?e(t):e}exports.Menu=v,exports.MenuButton=f,exports.MenuItem=m,exports.MenuItems=p;
//# sourceMappingURL=headlessui.cjs.production.min.js.map

@@ -529,6 +529,2 @@ import { cloneVNode, h, defineComponent, ref, onMounted, onUnmounted, provide, computed, inject, nextTick } from 'vue';

required: false
},
onClick: {
type: Function,
required: false
}

@@ -599,3 +595,2 @@ },

if (disabled) return event.preventDefault();
if (props.onClick) return props.onClick(event);
}

@@ -613,4 +608,3 @@

"class": resolvePropValue(className, slot),
disabled: disabled === true ? disabled : undefined,
'aria-disabled': disabled === true ? disabled : undefined,
'aria-disabled': disabled === true ? true : undefined,
onClick: handleClick,

@@ -617,0 +611,0 @@ onFocus: handleFocus,

@@ -533,6 +533,2 @@ (function (global, factory) {

required: false
},
onClick: {
type: Function,
required: false
}

@@ -603,3 +599,2 @@ },

if (disabled) return event.preventDefault();
if (props.onClick) return props.onClick(event);
}

@@ -617,4 +612,3 @@

"class": resolvePropValue(className, slot),
disabled: disabled === true ? disabled : undefined,
'aria-disabled': disabled === true ? disabled : undefined,
'aria-disabled': disabled === true ? true : undefined,
onClick: handleClick,

@@ -621,0 +615,0 @@ onFocus: handleFocus,

@@ -1,2 +0,2 @@

!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports,require("vue")):"function"==typeof define&&define.amd?define(["exports","vue"],n):n((e=e||self).headlessui={},e.Vue)}(this,(function(e,n){"use strict";function t(){return(t=Object.assign||function(e){for(var n=1;n<arguments.length;n++){var t=arguments[n];for(var o in t)Object.prototype.hasOwnProperty.call(t,o)&&(e[o]=t[o])}return e}).apply(this,arguments)}function o(e,n){if(null==e)return{};var t,o,u={},r=Object.keys(e);for(o=0;o<r.length;o++)n.indexOf(t=r[o])>=0||(u[t]=e[t]);return u}function u(e,n){if(e in n){for(var t=n[e],o=arguments.length,r=new Array(o>2?o-2:0),i=2;i<o;i++)r[i-2]=arguments[i];return"function"==typeof t?t.apply(void 0,r):t}var a=new Error('Tried to handle "'+e+'" but there is no handler defined. Only defined handlers are: '+Object.keys(n).map((function(e){return'"'+e+'"'})).join(", ")+".");throw Error.captureStackTrace&&Error.captureStackTrace(a,u),a}function r(e){var t,u=e.props,r=e.attrs,i=e.slots,a=e.slot,l=u.as,s=o(u,["as"]),c=null===(t=i.default)||void 0===t?void 0:t.call(i,a);if("template"===l){if(Object.keys(s).length>0||"class"in r){var d=null!=c?c:[],v=d[0];if(d.slice(1).length>0)throw new Error('You should only render 1 child or use the `as="..."` prop');return n.cloneVNode(v,s)}return c}return n.h(l,s,c)}var i,a,l,s=0;function c(){return++s}!function(e){e[e.Open=0]="Open",e[e.Closed=1]="Closed"}(i||(i={})),function(e){e.Space=" ",e.Enter="Enter",e.Escape="Escape",e.Backspace="Backspace",e.ArrowUp="ArrowUp",e.ArrowDown="ArrowDown",e.Home="Home",e.End="End",e.PageUp="PageUp",e.PageDown="PageDown",e.Tab="Tab"}(a||(a={})),function(e){e[e.FirstItem=0]="FirstItem",e[e.PreviousItem=1]="PreviousItem",e[e.NextItem=2]="NextItem",e[e.LastItem=3]="LastItem",e[e.SpecificItem=4]="SpecificItem",e[e.Nothing=5]="Nothing"}(l||(l={}));var d=Symbol("MenuContext");function v(e){var t=n.inject(d);if(void 0===t){var o=new Error("<"+e+" /> is missing a parent <Menu /> component.");throw Error.captureStackTrace&&Error.captureStackTrace(o,v),o}return t}var f=n.defineComponent({props:{as:{type:[Object,String],default:"template"}},setup:function(e,t){var o=t.slots,a=t.attrs,s=n.ref(i.Closed),c=n.ref(null),v=n.ref(null),f=n.ref([]),p=n.ref(""),m=n.ref(null),I={menuState:s,buttonRef:c,itemsRef:v,items:f,searchQuery:p,activeItemIndex:m,toggleMenu:function(){var e;s.value=u(s.value,((e={})[i.Closed]=i.Open,e[i.Open]=i.Closed,e))},closeMenu:function(){return s.value=i.Closed},openMenu:function(){return s.value=i.Open},goToItem:function(e,n){var t=function(e,n){var t,o;if(f.value.length<=0)return null;var r=null!==(t=m.value)&&void 0!==t?t:-1,i=u(e,((o={})[l.FirstItem]=function(){return f.value.findIndex((function(e){return!e.dataRef.disabled}))},o[l.PreviousItem]=function(){var e=f.value.slice().reverse().findIndex((function(e,n,t){return!(-1!==r&&t.length-n-1>=r||e.dataRef.disabled)}));return-1===e?e:f.value.length-1-e},o[l.NextItem]=function(){return f.value.findIndex((function(e,n){return!(n<=r||e.dataRef.disabled)}))},o[l.LastItem]=function(){var e=f.value.slice().reverse().findIndex((function(e){return!e.dataRef.disabled}));return-1===e?e:f.value.length-1-e},o[l.SpecificItem]=function(){return f.value.findIndex((function(e){return e.id===n}))},o[l.Nothing]=function(){return null},o));return-1===i?m.value:i}(e,n);""===p.value&&m.value===t||(p.value="",m.value=t)},search:function(e){p.value+=e;var n=f.value.findIndex((function(e){return e.dataRef.textValue.startsWith(p.value)&&!e.dataRef.disabled}));-1!==n&&n!==m.value&&(m.value=n)},clearSearch:function(){p.value=""},registerItem:function(e,n){f.value.push({id:e,dataRef:n})},unregisterItem:function(e){var n=f.value.slice(),t=null!==m.value?n[m.value]:null,o=n.findIndex((function(n){return n.id===e}));-1!==o&&n.splice(o,1),f.value=n,m.value=o===m.value||null===t?null:n.indexOf(t)}};return n.onMounted((function(){function e(e){var t;e.defaultPrevented||s.value===i.Open&&((null===(t=v.value)||void 0===t?void 0:t.contains(e.target))||(I.closeMenu(),n.nextTick((function(){var e;return null===(e=c.value)||void 0===e?void 0:e.focus()}))))}window.addEventListener("pointerdown",e),n.onUnmounted((function(){return window.removeEventListener("pointerdown",e)}))})),n.provide(d,I),function(){return r({props:e,slot:{open:s.value===i.Open},slots:o,attrs:a})}}}),p=n.defineComponent({props:{as:{type:[Object,String],default:"button"}},render:function(){var e,n=v("MenuButton"),o={open:n.menuState.value===i.Open},u={ref:"el",id:this.id,type:"button","aria-haspopup":!0,"aria-controls":null===(e=n.itemsRef.value)||void 0===e?void 0:e.id,"aria-expanded":n.menuState.value===i.Open||void 0,onKeyDown:this.handleKeyDown,onFocus:this.handleFocus,onPointerUp:this.handlePointerUp,onPointerDown:this.handlePointerDown};return r({props:t({},this.$props,u),slot:o,attrs:this.$attrs,slots:this.$slots})},setup:function(){var e=v("MenuButton");return{id:"headlessui-menu-button-"+c(),el:e.buttonRef,handleKeyDown:function(t){switch(t.key){case a.Space:case a.Enter:case a.ArrowDown:t.preventDefault(),e.openMenu(),n.nextTick((function(){var n;null===(n=e.itemsRef.value)||void 0===n||n.focus(),e.goToItem(l.FirstItem)}));break;case a.ArrowUp:t.preventDefault(),e.openMenu(),n.nextTick((function(){var n;null===(n=e.itemsRef.value)||void 0===n||n.focus(),e.goToItem(l.LastItem)}))}},handlePointerDown:function(e){e.preventDefault()},handlePointerUp:function(){e.toggleMenu(),n.nextTick((function(){var n;return null===(n=e.itemsRef.value)||void 0===n?void 0:n.focus()}))},handleFocus:function(){var n;e.menuState.value===i.Open&&(null===(n=e.itemsRef.value)||void 0===n||n.focus())}}}}),m=n.defineComponent({props:{as:{type:[Object,String],default:"div"},static:{type:Boolean,default:!1}},render:function(){var e,n,u=v("MenuItems"),a=this.$props,l=a.static,s=o(a,["static"]);if(!l&&u.menuState.value===i.Closed)return null;var c={open:u.menuState.value===i.Open};return r({props:t({},s,{"aria-activedescendant":null===u.activeItemIndex.value||null===(e=u.items.value[u.activeItemIndex.value])||void 0===e?void 0:e.id,"aria-labelledby":null===(n=u.buttonRef.value)||void 0===n?void 0:n.id,id:this.id,onKeyDown:this.handleKeyDown,role:"menu",tabIndex:0,ref:"el"}),slot:c,attrs:this.$attrs,slots:this.$slots})},setup:function(){var e=v("MenuItems"),t="headlessui-menu-items-"+c(),o=n.ref(null);return{id:t,el:e.itemsRef,handleKeyDown:function(t){switch(o.value&&clearTimeout(o.value),t.key){case a.Enter:var u;e.closeMenu(),null!==e.activeItemIndex.value&&(null===(u=document.getElementById(e.items.value[e.activeItemIndex.value].id))||void 0===u||u.click(),n.nextTick((function(){var n;return null===(n=e.buttonRef.value)||void 0===n?void 0:n.focus()})));break;case a.ArrowDown:return e.goToItem(l.NextItem);case a.ArrowUp:return e.goToItem(l.PreviousItem);case a.Home:case a.PageUp:return e.goToItem(l.FirstItem);case a.End:case a.PageDown:return e.goToItem(l.LastItem);case a.Escape:e.closeMenu(),n.nextTick((function(){var n;return null===(n=e.buttonRef.value)||void 0===n?void 0:n.focus()}));break;case a.Tab:return t.preventDefault();default:1===t.key.length&&(e.search(t.key),o.value=setTimeout((function(){return e.clearSearch()}),350))}}}}}),I=n.defineComponent({props:{as:{type:[Object,String],default:"template"},disabled:{type:Boolean,default:!1},class:{type:[String,Function],required:!1},className:{type:[String,Function],required:!1},onClick:{type:Function,required:!1}},setup:function(e,o){var u=o.slots,i=o.attrs,a=v("MenuItem"),s="headlessui-menu-item-"+c(),d=e.disabled,f=e.className,p=void 0===f?e.class:f,m=n.computed((function(){return null!==a.activeItemIndex.value&&a.items.value[a.activeItemIndex.value].id===s})),I=n.ref({disabled:d,textValue:""});function g(){d||a.goToItem(l.SpecificItem,s)}function b(){if(d)return a.goToItem(l.Nothing);a.goToItem(l.SpecificItem,s)}function w(){d||a.goToItem(l.Nothing)}function y(){d||m.value||a.goToItem(l.SpecificItem,s)}function x(e){d||(e.preventDefault(),a.closeMenu(),n.nextTick((function(){var e;return null===(e=a.buttonRef.value)||void 0===e?void 0:e.focus()})))}function T(n){return d?n.preventDefault():e.onClick?e.onClick(n):void 0}return n.onMounted((function(){var e,n,t=null===(e=document.getElementById(s))||void 0===e||null===(n=e.textContent)||void 0===n?void 0:n.toLowerCase().trim();void 0!==t&&(I.value.textValue=t)})),n.onMounted((function(){return a.registerItem(s,I)})),n.onUnmounted((function(){return a.unregisterItem(s)})),function(){var n={active:m.value,disabled:d},o={id:s,role:"menuitem",tabIndex:-1,class:h(p,n),disabled:!0===d?d:void 0,"aria-disabled":!0===d?d:void 0,onClick:T,onFocus:b,onMouseMove:y,onPointerEnter:g,onPointerLeave:w,onPointerUp:x};return r({props:t({},e,o),slot:n,attrs:i,slots:u})}}});function h(e,n){if(void 0!==e)return"function"==typeof e?e(n):e}e.Menu=f,e.MenuButton=p,e.MenuItem=I,e.MenuItems=m,Object.defineProperty(e,"__esModule",{value:!0})}));
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("vue")):"function"==typeof define&&define.amd?define(["exports","vue"],t):t((e=e||self).headlessui={},e.Vue)}(this,(function(e,t){"use strict";function n(){return(n=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var o in n)Object.prototype.hasOwnProperty.call(n,o)&&(e[o]=n[o])}return e}).apply(this,arguments)}function o(e,t){if(null==e)return{};var n,o,u={},r=Object.keys(e);for(o=0;o<r.length;o++)t.indexOf(n=r[o])>=0||(u[n]=e[n]);return u}function u(e,t){if(e in t){for(var n=t[e],o=arguments.length,r=new Array(o>2?o-2:0),i=2;i<o;i++)r[i-2]=arguments[i];return"function"==typeof n?n.apply(void 0,r):n}var a=new Error('Tried to handle "'+e+'" but there is no handler defined. Only defined handlers are: '+Object.keys(t).map((function(e){return'"'+e+'"'})).join(", ")+".");throw Error.captureStackTrace&&Error.captureStackTrace(a,u),a}function r(e){var n,u=e.props,r=e.attrs,i=e.slots,a=e.slot,l=u.as,s=o(u,["as"]),c=null===(n=i.default)||void 0===n?void 0:n.call(i,a);if("template"===l){if(Object.keys(s).length>0||"class"in r){var d=null!=c?c:[],f=d[0];if(d.slice(1).length>0)throw new Error('You should only render 1 child or use the `as="..."` prop');return t.cloneVNode(f,s)}return c}return t.h(l,s,c)}var i,a,l,s=0;function c(){return++s}!function(e){e[e.Open=0]="Open",e[e.Closed=1]="Closed"}(i||(i={})),function(e){e.Space=" ",e.Enter="Enter",e.Escape="Escape",e.Backspace="Backspace",e.ArrowUp="ArrowUp",e.ArrowDown="ArrowDown",e.Home="Home",e.End="End",e.PageUp="PageUp",e.PageDown="PageDown",e.Tab="Tab"}(a||(a={})),function(e){e[e.FirstItem=0]="FirstItem",e[e.PreviousItem=1]="PreviousItem",e[e.NextItem=2]="NextItem",e[e.LastItem=3]="LastItem",e[e.SpecificItem=4]="SpecificItem",e[e.Nothing=5]="Nothing"}(l||(l={}));var d=Symbol("MenuContext");function f(e){var n=t.inject(d);if(void 0===n){var o=new Error("<"+e+" /> is missing a parent <Menu /> component.");throw Error.captureStackTrace&&Error.captureStackTrace(o,f),o}return n}var v=t.defineComponent({props:{as:{type:[Object,String],default:"template"}},setup:function(e,n){var o=n.slots,a=n.attrs,s=t.ref(i.Closed),c=t.ref(null),f=t.ref(null),v=t.ref([]),p=t.ref(""),m=t.ref(null),I={menuState:s,buttonRef:c,itemsRef:f,items:v,searchQuery:p,activeItemIndex:m,toggleMenu:function(){var e;s.value=u(s.value,((e={})[i.Closed]=i.Open,e[i.Open]=i.Closed,e))},closeMenu:function(){return s.value=i.Closed},openMenu:function(){return s.value=i.Open},goToItem:function(e,t){var n=function(e,t){var n,o;if(v.value.length<=0)return null;var r=null!==(n=m.value)&&void 0!==n?n:-1,i=u(e,((o={})[l.FirstItem]=function(){return v.value.findIndex((function(e){return!e.dataRef.disabled}))},o[l.PreviousItem]=function(){var e=v.value.slice().reverse().findIndex((function(e,t,n){return!(-1!==r&&n.length-t-1>=r||e.dataRef.disabled)}));return-1===e?e:v.value.length-1-e},o[l.NextItem]=function(){return v.value.findIndex((function(e,t){return!(t<=r||e.dataRef.disabled)}))},o[l.LastItem]=function(){var e=v.value.slice().reverse().findIndex((function(e){return!e.dataRef.disabled}));return-1===e?e:v.value.length-1-e},o[l.SpecificItem]=function(){return v.value.findIndex((function(e){return e.id===t}))},o[l.Nothing]=function(){return null},o));return-1===i?m.value:i}(e,t);""===p.value&&m.value===n||(p.value="",m.value=n)},search:function(e){p.value+=e;var t=v.value.findIndex((function(e){return e.dataRef.textValue.startsWith(p.value)&&!e.dataRef.disabled}));-1!==t&&t!==m.value&&(m.value=t)},clearSearch:function(){p.value=""},registerItem:function(e,t){v.value.push({id:e,dataRef:t})},unregisterItem:function(e){var t=v.value.slice(),n=null!==m.value?t[m.value]:null,o=t.findIndex((function(t){return t.id===e}));-1!==o&&t.splice(o,1),v.value=t,m.value=o===m.value||null===n?null:t.indexOf(n)}};return t.onMounted((function(){function e(e){var n;e.defaultPrevented||s.value===i.Open&&((null===(n=f.value)||void 0===n?void 0:n.contains(e.target))||(I.closeMenu(),t.nextTick((function(){var e;return null===(e=c.value)||void 0===e?void 0:e.focus()}))))}window.addEventListener("pointerdown",e),t.onUnmounted((function(){return window.removeEventListener("pointerdown",e)}))})),t.provide(d,I),function(){return r({props:e,slot:{open:s.value===i.Open},slots:o,attrs:a})}}}),p=t.defineComponent({props:{as:{type:[Object,String],default:"button"}},render:function(){var e,t=f("MenuButton"),o={open:t.menuState.value===i.Open},u={ref:"el",id:this.id,type:"button","aria-haspopup":!0,"aria-controls":null===(e=t.itemsRef.value)||void 0===e?void 0:e.id,"aria-expanded":t.menuState.value===i.Open||void 0,onKeyDown:this.handleKeyDown,onFocus:this.handleFocus,onPointerUp:this.handlePointerUp,onPointerDown:this.handlePointerDown};return r({props:n({},this.$props,u),slot:o,attrs:this.$attrs,slots:this.$slots})},setup:function(){var e=f("MenuButton");return{id:"headlessui-menu-button-"+c(),el:e.buttonRef,handleKeyDown:function(n){switch(n.key){case a.Space:case a.Enter:case a.ArrowDown:n.preventDefault(),e.openMenu(),t.nextTick((function(){var t;null===(t=e.itemsRef.value)||void 0===t||t.focus(),e.goToItem(l.FirstItem)}));break;case a.ArrowUp:n.preventDefault(),e.openMenu(),t.nextTick((function(){var t;null===(t=e.itemsRef.value)||void 0===t||t.focus(),e.goToItem(l.LastItem)}))}},handlePointerDown:function(e){e.preventDefault()},handlePointerUp:function(){e.toggleMenu(),t.nextTick((function(){var t;return null===(t=e.itemsRef.value)||void 0===t?void 0:t.focus()}))},handleFocus:function(){var t;e.menuState.value===i.Open&&(null===(t=e.itemsRef.value)||void 0===t||t.focus())}}}}),m=t.defineComponent({props:{as:{type:[Object,String],default:"div"},static:{type:Boolean,default:!1}},render:function(){var e,t,u=f("MenuItems"),a=this.$props,l=a.static,s=o(a,["static"]);if(!l&&u.menuState.value===i.Closed)return null;var c={open:u.menuState.value===i.Open};return r({props:n({},s,{"aria-activedescendant":null===u.activeItemIndex.value||null===(e=u.items.value[u.activeItemIndex.value])||void 0===e?void 0:e.id,"aria-labelledby":null===(t=u.buttonRef.value)||void 0===t?void 0:t.id,id:this.id,onKeyDown:this.handleKeyDown,role:"menu",tabIndex:0,ref:"el"}),slot:c,attrs:this.$attrs,slots:this.$slots})},setup:function(){var e=f("MenuItems"),n="headlessui-menu-items-"+c(),o=t.ref(null);return{id:n,el:e.itemsRef,handleKeyDown:function(n){switch(o.value&&clearTimeout(o.value),n.key){case a.Enter:var u;e.closeMenu(),null!==e.activeItemIndex.value&&(null===(u=document.getElementById(e.items.value[e.activeItemIndex.value].id))||void 0===u||u.click(),t.nextTick((function(){var t;return null===(t=e.buttonRef.value)||void 0===t?void 0:t.focus()})));break;case a.ArrowDown:return e.goToItem(l.NextItem);case a.ArrowUp:return e.goToItem(l.PreviousItem);case a.Home:case a.PageUp:return e.goToItem(l.FirstItem);case a.End:case a.PageDown:return e.goToItem(l.LastItem);case a.Escape:e.closeMenu(),t.nextTick((function(){var t;return null===(t=e.buttonRef.value)||void 0===t?void 0:t.focus()}));break;case a.Tab:return n.preventDefault();default:1===n.key.length&&(e.search(n.key),o.value=setTimeout((function(){return e.clearSearch()}),350))}}}}}),I=t.defineComponent({props:{as:{type:[Object,String],default:"template"},disabled:{type:Boolean,default:!1},class:{type:[String,Function],required:!1},className:{type:[String,Function],required:!1}},setup:function(e,o){var u=o.slots,i=o.attrs,a=f("MenuItem"),s="headlessui-menu-item-"+c(),d=e.disabled,v=e.className,p=void 0===v?e.class:v,m=t.computed((function(){return null!==a.activeItemIndex.value&&a.items.value[a.activeItemIndex.value].id===s})),I=t.ref({disabled:d,textValue:""});function g(){d||a.goToItem(l.SpecificItem,s)}function b(){if(d)return a.goToItem(l.Nothing);a.goToItem(l.SpecificItem,s)}function w(){d||a.goToItem(l.Nothing)}function y(){d||m.value||a.goToItem(l.SpecificItem,s)}function x(e){d||(e.preventDefault(),a.closeMenu(),t.nextTick((function(){var e;return null===(e=a.buttonRef.value)||void 0===e?void 0:e.focus()})))}function T(e){if(d)return e.preventDefault()}return t.onMounted((function(){var e,t,n=null===(e=document.getElementById(s))||void 0===e||null===(t=e.textContent)||void 0===t?void 0:t.toLowerCase().trim();void 0!==n&&(I.value.textValue=n)})),t.onMounted((function(){return a.registerItem(s,I)})),t.onUnmounted((function(){return a.unregisterItem(s)})),function(){var t={active:m.value,disabled:d},o={id:s,role:"menuitem",tabIndex:-1,class:h(p,t),"aria-disabled":!0===d||void 0,onClick:T,onFocus:b,onMouseMove:y,onPointerEnter:g,onPointerLeave:w,onPointerUp:x};return r({props:n({},e,o),slot:t,attrs:i,slots:u})}}});function h(e,t){if(void 0!==e)return"function"==typeof e?e(t):e}e.Menu=v,e.MenuButton=p,e.MenuItem=I,e.MenuItems=m,Object.defineProperty(e,"__esModule",{value:!0})}));
//# sourceMappingURL=headlessui.umd.production.min.js.map
{
"name": "@headlessui/vue",
"version": "0.1.1",
"version": "0.1.2",
"main": "dist/index.js",

@@ -25,2 +25,3 @@ "typings": "dist/index.d.ts",

"playground:build": "NODE_ENV=production vite build examples",
"prepublishOnly": "npm run build",
"build": "../../scripts/build.sh",

@@ -27,0 +28,0 @@ "test": "../../scripts/test.sh",

@@ -56,3 +56,3 @@ <h3 align="center">

[View complete demo on CodeSandbox](https://codesandbox.io/s/flamboyant-glade-b2jb4?file=/src/App.vue)
[View live demo on CodeSandbox](https://codesandbox.io/s/headlessuivue-menu-example-70br3?file=/src/App.vue)

@@ -59,0 +59,0 @@ The `Menu` component and related child components are used to quickly build custom dropdown components that are fully accessible out of the box, including correct ARIA attribute management and robust keyboard navigation support.

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc