npm - @vue-interface/btn-dropdown - Versions diffs - 4.1.3 → 4.1.5 - Mend

@vue-interface/btn-dropdown 4.1.3 → 4.1.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (10) hide show

package/dist/btn-dropdown.js +2 -2
package/dist/btn-dropdown.js.map +1 -1
package/dist/btn-dropdown.umd.cjs +1 -1
package/dist/btn-dropdown.umd.cjs.map +1 -1
package/dist/index.d.ts +1 -0
package/dist/src/BtnDropdown.vue.d.ts +2 -2
package/dist/src/useDropdownHandler.d.ts +3 -4
package/index.ts +2 -0
package/package.json +3 -2
package/src/useDropdownHandler.ts +34 -42

package/dist/btn-dropdown.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { ref as D, computed as x, watchEffect as O, defineComponent as L, createElementBlock as I, openBlock as P, normalizeClass as C, unref as e, renderSlot as y, createVNode as N, normalizeProps as B, guardReactiveProps as z, createElementVNode as E, toDisplayString as M, withModifiers as V, normalizeStyle as F, withCtx as T, createCommentVNode as A, mergeProps as H, useTemplateRef as G, createBlock as J, resolveDynamicComponent as K } from "vue";
+import { ref as D, computed as x, watchEffect as O, defineComponent as L, openBlock as P, createElementBlock as I, normalizeClass as C, unref as e, renderSlot as y, normalizeProps as B, guardReactiveProps as z, createElementVNode as E, toDisplayString as M, createVNode as N, withModifiers as V, normalizeStyle as F, withCtx as T, mergeProps as H, createCommentVNode as A, useTemplateRef as G, createBlock as J, resolveDynamicComponent as K } from "vue";
 import { DropdownMenu as R } from "@vue-interface/dropdown-menu";
 import { offset as Q, flip as U } from "@floating-ui/dom";
 import { useFloating as W } from "@floating-ui/vue";
@@ -9,7 +9,7 @@ function j(t, k) {
     dropright: t.dropright,
     dropleft: t.dropleft,
     expanded: s.value,
-    [t.size ?? ""]: !!t.size
+    [t.size]: !!t.size
   })), f = x(() => {
     const l = {
       btn: !0,

package/dist/btn-dropdown.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"btn-dropdown.js","sources":["../src/useDropdownHandler.ts","../src/BtnDropdownSingle.vue","../src/BtnDropdownSplit.vue","../src/BtnDropdown.vue"],"sourcesContent":["import { flip, offset, Placement, type Alignment, type Middleware, type OffsetOptions, type Side } from '@floating-ui/dom';\nimport { useFloating, UseFloatingReturn } from '@floating-ui/vue';\nimport { DropdownMenu } from '@vue-interface/dropdown-menu';\nimport { ComponentPublicInstance, computed, ComputedRef, Ref, ref, watchEffect, type EmitFn, type HTMLAttributes } from 'vue';\n\ntype LiteralUnion<T extends U, U = string> = T \| (U & Record<never, never>);\n\nexport type BtnGroupSizes = 'btn-group-xs'\n \| 'btn-group-sm' \n \| 'btn-group-md'\n \| 'btn-group-lg'\n \| 'btn-group-xl'\n \| 'btn-group-2xl'\n \| 'btn-group-3xl'\n \| 'btn-group-4xl';\n\nexport type BtnDropdownProps = {\n align?: Alignment;\n block?: boolean;\n buttonClass?: HTMLAttributes['class'],\n caret?: boolean;\n dropup?: boolean;\n dropright?: boolean;\n dropleft?: boolean;\n label?: string;\n offset?: OffsetOptions,\n middleware?: Middleware[],\n side?: Side;\n size?: LiteralUnion<BtnGroupSizes>;\n split?: boolean;\n variant?: string;\n}\n\nexport type BtnDropdownEvents = {\n click: [event: MouseEvent];\n clickToggle: [event: MouseEvent];\n show: [],\n hide: []\n}\n\nexport type BtnDropdownSlotProps = { \n target: (el: Element \| ComponentPublicInstance \| null) => void;\n expanded: boolean;\n onBlur: (e: FocusEvent) => void;\n onClickToggle: (e: MouseEvent) => void;\n};\n\nexport type UseDropdownHandler = {\n target: Ref<Element\|ComponentPublicInstance\|null>;\n menu: Ref<InstanceType<typeof DropdownMenu>\|undefined>;\n alignment: ComputedRef<Alignment>;\n expanded: Ref<boolean>;\n floatingStyles: UseFloatingReturn['floatingStyles'];\n placement: ComputedRef<Placement>;\n side: ComputedRef<Side>;\n classes: ComputedRef<Record<string, boolean\|undefined>>;\n buttonClasses: ComputedRef<Record<string, boolean>>;\n show: () => void;\n hide: () => void;\n toggle: () => void;\n onBlur: (e: FocusEvent) => void;\n onClick: (e: MouseEvent) => void;\n onClickToggle: (e: MouseEvent) => void;\n onClickItem: (e: PointerEvent) => void;\n}\n\nexport function useDropdownHandler(props: BtnDropdownProps, emit: EmitFn<BtnDropdownEvents>): UseDropdownHandler {\n const target = ref<Element\|ComponentPublicInstance\|null>(null);\n const menu = ref<InstanceType<typeof DropdownMenu>>();\n const expanded = ref(false);\n\n const alignment = computed<Alignment>(() => props.align ?? 'start');\n\n const side = computed<Side>(() => {\n if(props.dropup) {\n return 'top';\n }\n\n if(props.dropleft) {\n return 'left';\n }\n\n if(props.dropright) {\n return 'right';\n }\n\n return 'bottom';\n });\n\n const placement = computed<Placement>(() => `${side.value}-${alignment.value}`);\n\n const classes = computed<Record<string,boolean\|undefined>>(() => ({\n 'dropdown': props.dropup && props.dropright && props.dropleft,\n 'dropup': props.dropup,\n 'dropright': props.dropright,\n 'dropleft': props.dropleft,\n 'expanded': expanded.value,\n [props.size ?? '']: !!props.size,\n }));\n \n const buttonClasses = computed(() => {\n const classes = {\n btn: true,\n [props.variant ?? '']: !!props.variant,\n 'btn-block': !!props.block,\n 'no-caret': !props.caret\n };\n \n if(typeof props.buttonClass === 'string') {\n classes[props.buttonClass] = true;\n }\n else if(Array.isArray(props.buttonClass)) {\n for(const value of props.buttonClass) {\n classes[value] = true;\n }\n }\n else if(props.buttonClass) {\n Object.assign(classes, props.buttonClass);\n }\n\n return classes;\n });\n\n const { floatingStyles, update } = useFloating(target, menu, {\n placement: placement,\n middleware: props.middleware ?? [\n offset(props.offset ?? 5),\n flip()\n ]\n });\n\n function show() {\n expanded.value = true;\n\n if(!target.value \|\| !menu.value) {\n return;\n }\n\n update();\n\n emit('show');\n }\n\n function hide() {\n expanded.value = false;\n\n if(target.value instanceof HTMLElement) {\n target.value?.blur();\n }\n\n emit('hide');\n }\n\n function toggle() {\n if(!expanded.value) {\n show();\n }\n else {\n hide();\n }\n }\n\n function isFocusable(element: HTMLElement) {\n const nodes = Array.from(menu.value?.$el.querySelectorAll('label, input, select, textarea') ?? []);\n\n for(const i in nodes) {\n if(element === nodes[i]) {\n return true;\n }\n }\n\n return false;\n }\n \n function onBlur(e: FocusEvent) {\n if(!(e.relatedTarget instanceof HTMLElement) \|\| !(target.value instanceof Element)) {\n hide();\n \n return;\n }\n \n if(menu.value && !menu.value?.$el.contains(e.relatedTarget) \|\| !target.value?.contains(e.relatedTarget)) {\n hide();\n }\n }\n\n function onClick(e: MouseEvent) {\n emit('click', e);\n }\n\n function onClickToggle(e: MouseEvent) {\n e.target?.dispatchEvent(new Event('focus', e));\n \n emit('clickToggle', e);\n\n if(!e.defaultPrevented) {\n toggle();\n }\n }\n\n function onClickItem(e: PointerEvent) {\n if(!(e.target instanceof HTMLElement)) {\n hide();\n\n return;\n }\n\n if(!isFocusable(e.target) && !e.defaultPrevented) {\n hide();\n }\n }\n\n watchEffect(() => {\n if(expanded.value) {\n window.addEventListener('resize', update);\n }\n else {\n window.removeEventListener('resize', update);\n }\n });\n\n return {\n target,\n menu,\n alignment,\n expanded,\n floatingStyles,\n placement,\n side,\n classes,\n buttonClasses,\n show,\n hide,\n toggle,\n onBlur,\n onClick,\n onClickToggle,\n onClickItem\n };\n}","<script setup lang=\"ts\">\nimport { DropdownMenu } from '@vue-interface/dropdown-menu';\nimport { ComponentPublicInstance } from 'vue';\nimport { BtnDropdownEvents, BtnDropdownProps, BtnDropdownSlotProps, useDropdownHandler } from './useDropdownHandler';\n\nconst props = withDefaults(defineProps<BtnDropdownProps>(), {\n caret: true,\n variant: 'btn-primary'\n});\n\nconst emit = defineEmits<BtnDropdownEvents>();\n\nconst {\n target,\n menu,\n buttonClasses,\n classes,\n expanded,\n floatingStyles,\n show,\n hide,\n toggle,\n onBlur,\n onClickToggle,\n onClickItem\n} = useDropdownHandler(props, emit);\n\ndefineExpose({\n show,\n hide,\n toggle,\n});\n\ndefineSlots<{\n button(props: BtnDropdownSlotProps): any;\n default(): any;\n}>();\n</script>\n\n<template>\n <div\n class=\"btn-group\"\n :class=\"classes\">\n <slot\n name=\"button\"\n v-bind=\"{\n target: (el: Element \| ComponentPublicInstance \| null) => target = el,\n expanded,\n onBlur,\n onClickToggle\n }\">\n <button\n ref=\"target\"\n type=\"button\"\n :class=\"{...buttonClasses, ['dropdown-toggle']: true}\"\n aria-haspopup=\"true\"\n :aria-expanded=\"expanded\"\n @blur=\"onBlur\"\n @click=\"onClickToggle\">\n {{ label }}\n </button>\n </slot>\n <DropdownMenu\n ref=\"menu\"\n :class=\"{\n 'show': expanded\n }\"\n :style=\"floatingStyles\"\n @blur=\"onBlur\"\n @click=\"onClickItem\"\n @mousedown.prevent>\n <slot />\n </DropdownMenu>\n </div>\n</template>","<script setup lang=\"ts\">\nimport { DropdownMenu } from '@vue-interface/dropdown-menu';\nimport { ComponentPublicInstance } from 'vue';\nimport { BtnDropdownEvents, BtnDropdownProps, BtnDropdownSlotProps, useDropdownHandler } from './useDropdownHandler';\n\nconst props = withDefaults(defineProps<BtnDropdownProps>(), {\n caret: true,\n variant: 'btn-primary'\n});\n\nconst emit = defineEmits<BtnDropdownEvents>();\n\nconst {\n target,\n menu,\n buttonClasses,\n classes,\n expanded,\n floatingStyles,\n show,\n hide,\n toggle,\n onBlur,\n onClickToggle,\n onClickItem\n} = useDropdownHandler(props, emit);\n\ndefineExpose({\n show,\n hide,\n toggle,\n});\n\ndefineSlots<{\n button(props: {\n expanded: BtnDropdownSlotProps['expanded'],\n onBlur: BtnDropdownSlotProps['onBlur'],\n onClickToggle: BtnDropdownSlotProps['onClickToggle']\n }): any;\n toggle(props: BtnDropdownSlotProps): any;\n default(): any;\n}>();\n</script>\n\n<template>\n <div\n class=\"btn-group btn-dropdown-split\"\n :class=\"classes\">\n <slot\n v-if=\"!dropleft\"\n name=\"button\"\n v-bind=\"{ expanded, onBlur, onClickToggle }\">\n <button\n type=\"button\"\n :class=\"buttonClasses\"\n aria-haspopup=\"true\"\n :aria-expanded=\"expanded\"\n @blur=\"onBlur\"\n @click=\"onClick\">\n {{ label }}\n </button>\n </slot>\n <div class=\"btn-group\">\n <slot\n name=\"toggle\"\n v-bind=\"{\n target: (el: Element \| ComponentPublicInstance \| null) => target = el,\n expanded,\n onBlur,\n onClickToggle\n }\">\n <button\n ref=\"target\"\n type=\"button\"\n aria-haspopup=\"true\"\n :aria-expanded=\"expanded\"\n :class=\"{...buttonClasses, 'dropdown-toggle': true, 'dropdown-toggle-split': split}\"\n @blur=\"onBlur\"\n @click=\"onClickToggle\" />\n </slot>\n <DropdownMenu\n ref=\"menu\"\n :class=\"{\n 'show': expanded\n }\"\n :style=\"floatingStyles\"\n @blur=\"onBlur\"\n @click=\"onClickItem\"\n @mousedown.prevent>\n <slot />\n </DropdownMenu>\n </div>\n <slot\n v-if=\"dropleft\"\n name=\"button\"\n v-bind=\"{ expanded, onBlur, onClickToggle }\">\n <button\n type=\"button\"\n :class=\"buttonClasses\"\n aria-haspopup=\"true\"\n :aria-expanded=\"expanded\"\n @blur=\"onBlur\"\n @click=\"onClick\">\n {{ label }}\n </button>\n </slot>\n </div>\n</template>","<script setup lang=\"ts\">\nimport { useTemplateRef } from 'vue';\nimport { type ComponentExposed } from 'vue-component-type-helpers';\nimport BtnDropdownSingle from './BtnDropdownSingle.vue';\nimport BtnDropdownSplit from './BtnDropdownSplit.vue';\nimport { BtnDropdownEvents, BtnDropdownProps, BtnDropdownSlotProps } from './useDropdownHandler';\n\nconst props = withDefaults(defineProps<{\n split?: boolean\n} & BtnDropdownProps>(), {\n split: false,\n caret: true\n});\n\nconst emit = defineEmits<BtnDropdownEvents>();\n\nconst el = useTemplateRef<ComponentExposed<typeof BtnDropdownSingle \| typeof BtnDropdownSplit>>('el');\n\ndefineExpose({\n hide: () => el.value?.hide(),\n show: () => el.value?.show(),\n toggle: () => el.value?.toggle(),\n});\n\ndefineSlots<{\n button(props: BtnDropdownSlotProps): any;\n toggle(props: BtnDropdownSlotProps): any;\n split(props: BtnDropdownSlotProps): any;\n default(): any;\n}>();\n</script>\n\n<template>\n <Component\n ref=\"el\"\n :is=\"!split ? BtnDropdownSingle : BtnDropdownSplit\"\n v-bind=\"props\"\n @click=\"(e: MouseEvent) => emit('click', e)\"\n @click-toggle=\"(e: MouseEvent) => emit('clickToggle', e)\"\n @show=\"() => emit('show')\"\n @hide=\"() => emit('hide')\">\n <template #button=\"slot\">\n <slot\n name=\"button\"\n v-bind=\"slot\" />\n </template>\n <template #toggle=\"slot\">\n <slot\n name=\"toggle\"\n v-bind=\"slot\" />\n </template>\n <template #split=\"slot\">\n <slot\n name=\"split\"\n v-bind=\"slot\" />\n </template>\n <slot />\n </Component>\n</template>"],"names":["useDropdownHandler","props","emit","target","ref","menu","expanded","alignment","computed","side","placement","classes","buttonClasses","value","floatingStyles","update","useFloating","offset","flip","show","hide","toggle","isFocusable","element","nodes","i","onBlur","e","onClick","onClickToggle","onClickItem","watchEffect","__props","__emit","__expose","_createElementBlock","_normalizeClass","_unref","_renderSlot","_ctx","_normalizeProps","_guardReactiveProps","el","_createElementVNode","_cache","args","_hoisted_1","_createVNode","DropdownMenu","_hoisted_2","_hoisted_4","useTemplateRef","_openBlock","_createBlock","_resolveDynamicComponent","BtnDropdownSplit","BtnDropdownSingle","_mergeProps","_withCtx","slot"],"mappings":"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"}
1	+ {"version":3,"file":"btn-dropdown.js","sources":["../src/useDropdownHandler.ts","../src/BtnDropdownSingle.vue","../src/BtnDropdownSplit.vue","../src/BtnDropdown.vue"],"sourcesContent":["import { flip, offset, Placement, type Alignment, type Middleware, type OffsetOptions, type Side } from '@floating-ui/dom';\nimport { useFloating, UseFloatingReturn } from '@floating-ui/vue';\nimport { DropdownMenu } from '@vue-interface/dropdown-menu';\nimport { ComponentSize } from '@vue-interface/sizeable';\nimport { ComponentPublicInstance, computed, ComputedRef, Ref, ref, watchEffect, type EmitFn, type HTMLAttributes } from 'vue';\n\nexport type BtnGroupSizePrefix = 'btn-group';\n\nexport type BtnDropdownProps = {\n align?: Alignment;\n block?: boolean;\n buttonClass?: HTMLAttributes['class'],\n caret?: boolean;\n dropup?: boolean;\n dropright?: boolean;\n dropleft?: boolean;\n label?: string;\n offset?: OffsetOptions,\n middleware?: Middleware[],\n side?: Side;\n size?: ComponentSize<BtnGroupSizePrefix>;\n split?: boolean;\n variant?: string;\n}\n\nexport type BtnDropdownEvents = {\n click: [event: MouseEvent];\n clickToggle: [event: MouseEvent];\n show: [],\n hide: []\n}\n\nexport type BtnDropdownSlotProps = {\n target: (el: Element \| ComponentPublicInstance \| null) => void;\n expanded: boolean;\n onBlur: (e: FocusEvent) => void;\n onClickToggle: (e: MouseEvent) => void;\n};\n\nexport type UseDropdownHandler = {\n target: Ref<Element \| ComponentPublicInstance \| null>;\n menu: Ref<InstanceType<typeof DropdownMenu> \| undefined>;\n alignment: ComputedRef<Alignment>;\n expanded: Ref<boolean>;\n floatingStyles: UseFloatingReturn['floatingStyles'];\n placement: ComputedRef<Placement>;\n side: ComputedRef<Side>;\n classes: ComputedRef<Record<string, boolean \| undefined>>;\n buttonClasses: ComputedRef<Record<string, boolean>>;\n show: () => void;\n hide: () => void;\n toggle: () => void;\n onBlur: (e: FocusEvent) => void;\n onClick: (e: MouseEvent) => void;\n onClickToggle: (e: MouseEvent) => void;\n onClickItem: (e: PointerEvent) => void;\n}\n\nexport function useDropdownHandler(props: BtnDropdownProps, emit: EmitFn<BtnDropdownEvents>): UseDropdownHandler {\n const target = ref<Element \| ComponentPublicInstance \| null>(null);\n const menu = ref<InstanceType<typeof DropdownMenu>>();\n const expanded = ref(false);\n\n const alignment = computed<Alignment>(() => props.align ?? 'start');\n\n const side = computed<Side>(() => {\n if (props.dropup) {\n return 'top';\n }\n\n if (props.dropleft) {\n return 'left';\n }\n\n if (props.dropright) {\n return 'right';\n }\n\n return 'bottom';\n });\n\n const placement = computed<Placement>(() => `${side.value}-${alignment.value}`);\n\n const classes = computed<Record<string, boolean \| undefined>>(() => ({\n 'dropdown': props.dropup && props.dropright && props.dropleft,\n 'dropup': props.dropup,\n 'dropright': props.dropright,\n 'dropleft': props.dropleft,\n 'expanded': expanded.value,\n [props.size as string]: !!props.size,\n }));\n\n const buttonClasses = computed(() => {\n const classes = {\n btn: true,\n [props.variant ?? '']: !!props.variant,\n 'btn-block': !!props.block,\n 'no-caret': !props.caret\n };\n\n if (typeof props.buttonClass === 'string') {\n classes[props.buttonClass] = true;\n }\n else if (Array.isArray(props.buttonClass)) {\n for (const value of props.buttonClass) {\n classes[value] = true;\n }\n }\n else if (props.buttonClass) {\n Object.assign(classes, props.buttonClass);\n }\n\n return classes;\n });\n\n const { floatingStyles, update } = useFloating(target, menu, {\n placement: placement,\n middleware: props.middleware ?? [\n offset(props.offset ?? 5),\n flip()\n ]\n });\n\n function show() {\n expanded.value = true;\n\n if (!target.value \|\| !menu.value) {\n return;\n }\n\n update();\n\n emit('show');\n }\n\n function hide() {\n expanded.value = false;\n\n if (target.value instanceof HTMLElement) {\n target.value?.blur();\n }\n\n emit('hide');\n }\n\n function toggle() {\n if (!expanded.value) {\n show();\n }\n else {\n hide();\n }\n }\n\n function isFocusable(element: HTMLElement) {\n const nodes = Array.from(menu.value?.$el.querySelectorAll('label, input, select, textarea') ?? []);\n\n for (const i in nodes) {\n if (element === nodes[i]) {\n return true;\n }\n }\n\n return false;\n }\n\n function onBlur(e: FocusEvent) {\n if (!(e.relatedTarget instanceof HTMLElement) \|\| !(target.value instanceof Element)) {\n hide();\n\n return;\n }\n\n if (menu.value && !menu.value?.$el.contains(e.relatedTarget) \|\| !target.value?.contains(e.relatedTarget)) {\n hide();\n }\n }\n\n function onClick(e: MouseEvent) {\n emit('click', e);\n }\n\n function onClickToggle(e: MouseEvent) {\n e.target?.dispatchEvent(new Event('focus', e));\n\n emit('clickToggle', e);\n\n if (!e.defaultPrevented) {\n toggle();\n }\n }\n\n function onClickItem(e: PointerEvent) {\n if (!(e.target instanceof HTMLElement)) {\n hide();\n\n return;\n }\n\n if (!isFocusable(e.target) && !e.defaultPrevented) {\n hide();\n }\n }\n\n watchEffect(() => {\n if (expanded.value) {\n window.addEventListener('resize', update);\n }\n else {\n window.removeEventListener('resize', update);\n }\n });\n\n return {\n target,\n menu,\n alignment,\n expanded,\n floatingStyles,\n placement,\n side,\n classes,\n buttonClasses,\n show,\n hide,\n toggle,\n onBlur,\n onClick,\n onClickToggle,\n onClickItem\n };\n}","<script setup lang=\"ts\">\nimport { DropdownMenu } from '@vue-interface/dropdown-menu';\nimport { ComponentPublicInstance } from 'vue';\nimport { BtnDropdownEvents, BtnDropdownProps, BtnDropdownSlotProps, useDropdownHandler } from './useDropdownHandler';\n\nconst props = withDefaults(defineProps<BtnDropdownProps>(), {\n caret: true,\n variant: 'btn-primary'\n});\n\nconst emit = defineEmits<BtnDropdownEvents>();\n\nconst {\n target,\n menu,\n buttonClasses,\n classes,\n expanded,\n floatingStyles,\n show,\n hide,\n toggle,\n onBlur,\n onClickToggle,\n onClickItem\n} = useDropdownHandler(props, emit);\n\ndefineExpose({\n show,\n hide,\n toggle,\n});\n\ndefineSlots<{\n button(props: BtnDropdownSlotProps): any;\n default(): any;\n}>();\n</script>\n\n<template>\n <div\n class=\"btn-group\"\n :class=\"classes\">\n <slot\n name=\"button\"\n v-bind=\"{\n target: (el: Element \| ComponentPublicInstance \| null) => target = el,\n expanded,\n onBlur,\n onClickToggle\n }\">\n <button\n ref=\"target\"\n type=\"button\"\n :class=\"{...buttonClasses, ['dropdown-toggle']: true}\"\n aria-haspopup=\"true\"\n :aria-expanded=\"expanded\"\n @blur=\"onBlur\"\n @click=\"onClickToggle\">\n {{ label }}\n </button>\n </slot>\n <DropdownMenu\n ref=\"menu\"\n :class=\"{\n 'show': expanded\n }\"\n :style=\"floatingStyles\"\n @blur=\"onBlur\"\n @click=\"onClickItem\"\n @mousedown.prevent>\n <slot />\n </DropdownMenu>\n </div>\n</template>","<script setup lang=\"ts\">\nimport { DropdownMenu } from '@vue-interface/dropdown-menu';\nimport { ComponentPublicInstance } from 'vue';\nimport { BtnDropdownEvents, BtnDropdownProps, BtnDropdownSlotProps, useDropdownHandler } from './useDropdownHandler';\n\nconst props = withDefaults(defineProps<BtnDropdownProps>(), {\n caret: true,\n variant: 'btn-primary'\n});\n\nconst emit = defineEmits<BtnDropdownEvents>();\n\nconst {\n target,\n menu,\n buttonClasses,\n classes,\n expanded,\n floatingStyles,\n show,\n hide,\n toggle,\n onBlur,\n onClickToggle,\n onClickItem\n} = useDropdownHandler(props, emit);\n\ndefineExpose({\n show,\n hide,\n toggle,\n});\n\ndefineSlots<{\n button(props: {\n expanded: BtnDropdownSlotProps['expanded'],\n onBlur: BtnDropdownSlotProps['onBlur'],\n onClickToggle: BtnDropdownSlotProps['onClickToggle']\n }): any;\n toggle(props: BtnDropdownSlotProps): any;\n default(): any;\n}>();\n</script>\n\n<template>\n <div\n class=\"btn-group btn-dropdown-split\"\n :class=\"classes\">\n <slot\n v-if=\"!dropleft\"\n name=\"button\"\n v-bind=\"{ expanded, onBlur, onClickToggle }\">\n <button\n type=\"button\"\n :class=\"buttonClasses\"\n aria-haspopup=\"true\"\n :aria-expanded=\"expanded\"\n @blur=\"onBlur\"\n @click=\"onClick\">\n {{ label }}\n </button>\n </slot>\n <div class=\"btn-group\">\n <slot\n name=\"toggle\"\n v-bind=\"{\n target: (el: Element \| ComponentPublicInstance \| null) => target = el,\n expanded,\n onBlur,\n onClickToggle\n }\">\n <button\n ref=\"target\"\n type=\"button\"\n aria-haspopup=\"true\"\n :aria-expanded=\"expanded\"\n :class=\"{...buttonClasses, 'dropdown-toggle': true, 'dropdown-toggle-split': split}\"\n @blur=\"onBlur\"\n @click=\"onClickToggle\" />\n </slot>\n <DropdownMenu\n ref=\"menu\"\n :class=\"{\n 'show': expanded\n }\"\n :style=\"floatingStyles\"\n @blur=\"onBlur\"\n @click=\"onClickItem\"\n @mousedown.prevent>\n <slot />\n </DropdownMenu>\n </div>\n <slot\n v-if=\"dropleft\"\n name=\"button\"\n v-bind=\"{ expanded, onBlur, onClickToggle }\">\n <button\n type=\"button\"\n :class=\"buttonClasses\"\n aria-haspopup=\"true\"\n :aria-expanded=\"expanded\"\n @blur=\"onBlur\"\n @click=\"onClick\">\n {{ label }}\n </button>\n </slot>\n </div>\n</template>","<script setup lang=\"ts\">\nimport { useTemplateRef } from 'vue';\nimport { type ComponentExposed } from 'vue-component-type-helpers';\nimport BtnDropdownSingle from './BtnDropdownSingle.vue';\nimport BtnDropdownSplit from './BtnDropdownSplit.vue';\nimport { BtnDropdownEvents, BtnDropdownProps, BtnDropdownSlotProps } from './useDropdownHandler';\n\nconst props = withDefaults(defineProps<{\n split?: boolean\n} & BtnDropdownProps>(), {\n split: false,\n caret: true\n});\n\nconst emit = defineEmits<BtnDropdownEvents>();\n\nconst el = useTemplateRef<ComponentExposed<typeof BtnDropdownSingle \| typeof BtnDropdownSplit>>('el');\n\ndefineExpose({\n hide: () => el.value?.hide(),\n show: () => el.value?.show(),\n toggle: () => el.value?.toggle(),\n});\n\ndefineSlots<{\n button(props: BtnDropdownSlotProps): any;\n toggle(props: BtnDropdownSlotProps): any;\n split(props: BtnDropdownSlotProps): any;\n default(): any;\n}>();\n</script>\n\n<template>\n <Component\n ref=\"el\"\n :is=\"!split ? BtnDropdownSingle : BtnDropdownSplit\"\n v-bind=\"props\"\n @click=\"(e: MouseEvent) => emit('click', e)\"\n @click-toggle=\"(e: MouseEvent) => emit('clickToggle', e)\"\n @show=\"() => emit('show')\"\n @hide=\"() => emit('hide')\">\n <template #button=\"slot\">\n <slot\n name=\"button\"\n v-bind=\"slot\" />\n </template>\n <template #toggle=\"slot\">\n <slot\n name=\"toggle\"\n v-bind=\"slot\" />\n </template>\n <template #split=\"slot\">\n <slot\n name=\"split\"\n v-bind=\"slot\" />\n </template>\n <slot />\n </Component>\n</template>"],"names":["useDropdownHandler","props","emit","target","ref","menu","expanded","alignment","computed","side","placement","classes","buttonClasses","value","floatingStyles","update","useFloating","offset","flip","show","hide","toggle","isFocusable","element","nodes","i","onBlur","e","onClick","onClickToggle","onClickItem","watchEffect","__props","__emit","__expose","_createElementBlock","_normalizeClass","_unref","_renderSlot","_ctx","_normalizeProps","_guardReactiveProps","el","_createElementVNode","_cache","args","_hoisted_1","_createVNode","DropdownMenu","_hoisted_2","_hoisted_4","useTemplateRef","_openBlock","_createBlock","_resolveDynamicComponent","BtnDropdownSplit","BtnDropdownSingle","_mergeProps","_withCtx","slot"],"mappings":";;;;AA0DO,SAASA,EAAmBC,GAAyBC,GAAqD;AAC7G,QAAMC,IAASC,EAA8C,IAAI,GAC3DC,IAAOD,EAAA,GACPE,IAAWF,EAAI,EAAK,GAEpBG,IAAYC,EAAoB,MAAMP,EAAM,SAAS,OAAO,GAE5DQ,IAAOD,EAAe,MACpBP,EAAM,SACC,QAGPA,EAAM,WACC,SAGPA,EAAM,YACC,UAGJ,QACV,GAEKS,IAAYF,EAAoB,MAAM,GAAGC,EAAK,KAAK,IAAIF,EAAU,KAAK,EAAE,GAExEI,IAAUH,EAA8C,OAAO;AAAA,IACjE,UAAYP,EAAM,UAAUA,EAAM,aAAaA,EAAM;AAAA,IACrD,QAAUA,EAAM;AAAA,IAChB,WAAaA,EAAM;AAAA,IACnB,UAAYA,EAAM;AAAA,IAClB,UAAYK,EAAS;AAAA,IACrB,CAACL,EAAM,IAAc,GAAG,CAAC,CAACA,EAAM;AAAA,EAAA,EAClC,GAEIW,IAAgBJ,EAAS,MAAM;AACjC,UAAMG,IAAU;AAAA,MACZ,KAAK;AAAA,MACL,CAACV,EAAM,WAAW,EAAE,GAAG,CAAC,CAACA,EAAM;AAAA,MAC/B,aAAa,CAAC,CAACA,EAAM;AAAA,MACrB,YAAY,CAACA,EAAM;AAAA,IAAA;AAGvB,QAAI,OAAOA,EAAM,eAAgB;AAC7BU,MAAAA,EAAQV,EAAM,WAAW,IAAI;AAAA,aAExB,MAAM,QAAQA,EAAM,WAAW;AACpC,iBAAWY,KAASZ,EAAM;AACtBU,QAAAA,EAAQE,CAAK,IAAI;AAAA,QAEzB,CACSZ,EAAM,eACX,OAAO,OAAOU,GAASV,EAAM,WAAW;AAG5C,WAAOU;AAAAA,EACX,CAAC,GAEK,EAAE,gBAAAG,GAAgB,QAAAC,EAAA,IAAWC,EAAYb,GAAQE,GAAM;AAAA,IACzD,WAAAK;AAAA,IACA,YAAYT,EAAM,cAAc;AAAA,MAC5BgB,EAAOhB,EAAM,UAAU,CAAC;AAAA,MACxBiB,EAAA;AAAA,IAAK;AAAA,EACT,CACH;AAED,WAASC,IAAO;AAGZ,IAFAb,EAAS,QAAQ,IAEb,GAACH,EAAO,SAAS,CAACE,EAAK,WAI3BU,EAAA,GAEAb,EAAK,MAAM;AAAA,EACf;AAEA,WAASkB,IAAO;AACZ,IAAAd,EAAS,QAAQ,IAEbH,EAAO,iBAAiB,eACxBA,EAAO,OAAO,KAAA,GAGlBD,EAAK,MAAM;AAAA,EACf;AAEA,WAASmB,IAAS;AACd,IAAKf,EAAS,QAIVc,EAAA,IAHAD,EAAA;AAAA,EAKR;AAEA,WAASG,EAAYC,GAAsB;AACvC,UAAMC,IAAQ,MAAM,KAAKnB,EAAK,OAAO,IAAI,iBAAiB,gCAAgC,KAAK,EAAE;AAEjG,eAAWoB,KAAKD;AACZ,UAAID,MAAYC,EAAMC,CAAC;AACnB,eAAO;AAIf,WAAO;AAAA,EACX;AAEA,WAASC,EAAOC,GAAe;AAC3B,QAAI,EAAEA,EAAE,yBAAyB,gBAAgB,EAAExB,EAAO,iBAAiB,UAAU;AACjF,MAAAiB,EAAA;AAEA;AAAA,IACJ;AAEA,KAAIf,EAAK,SAAS,CAACA,EAAK,OAAO,IAAI,SAASsB,EAAE,aAAa,KAAK,CAACxB,EAAO,OAAO,SAASwB,EAAE,aAAa,MACnGP,EAAA;AAAA,EAER;AAEA,WAASQ,EAAQD,GAAe;AAC5B,IAAAzB,EAAK,SAASyB,CAAC;AAAA,EACnB;AAEA,WAASE,EAAcF,GAAe;AAClC,IAAAA,EAAE,QAAQ,cAAc,IAAI,MAAM,SAASA,CAAC,CAAC,GAE7CzB,EAAK,eAAeyB,CAAC,GAEhBA,EAAE,oBACHN,EAAA;AAAA,EAER;AAEA,WAASS,EAAYH,GAAiB;AAClC,QAAI,EAAEA,EAAE,kBAAkB,cAAc;AACpC,MAAAP,EAAA;AAEA;AAAA,IACJ;AAEA,IAAI,CAACE,EAAYK,EAAE,MAAM,KAAK,CAACA,EAAE,oBAC7BP,EAAA;AAAA,EAER;AAEA,SAAAW,EAAY,MAAM;AACd,IAAIzB,EAAS,QACT,OAAO,iBAAiB,UAAUS,CAAM,IAGxC,OAAO,oBAAoB,UAAUA,CAAM;AAAA,EAEnD,CAAC,GAEM;AAAA,IACH,QAAAZ;AAAA,IACA,MAAAE;AAAA,IACA,WAAAE;AAAA,IACA,UAAAD;AAAA,IACA,gBAAAQ;AAAA,IACA,WAAAJ;AAAA,IACA,MAAAD;AAAA,IACA,SAAAE;AAAA,IACA,eAAAC;AAAA,IACA,MAAAO;AAAA,IACA,MAAAC;AAAA,IACA,QAAAC;AAAA,IACA,QAAAK;AAAA,IACA,SAAAE;AAAA,IACA,eAAAC;AAAA,IACA,aAAAC;AAAA,EAAA;AAER;;;;;;;;;;;;;;;;;;;;;AClOA,UAAM7B,IAAQ+B,GAKR9B,IAAO+B,GAEP;AAAA,MACF,QAAA9B;AAAA,MACA,MAAAE;AAAA,MACA,eAAAO;AAAA,MACA,SAAAD;AAAA,MACA,UAAAL;AAAA,MACA,gBAAAQ;AAAA,MACA,MAAAK;AAAA,MACA,MAAAC;AAAA,MACA,QAAAC;AAAA,MACA,QAAAK;AAAA,MACA,eAAAG;AAAA,MACA,aAAAC;AAAA,IAAA,IACA9B,EAAmBC,GAAOC,CAAI;AAElC,WAAAgC,EAAa;AAAA,MACT,MAAAf;AAAA,MACA,MAAAC;AAAA,MACA,QAAAC;AAAA,IAAA,CACH,mBASGc,EAiCM,OAAA;AAAA,MAhCF,OAAKC,EAAA,CAAC,aACEC,EAAA1B,CAAA,CAAO,CAAA;AAAA,IAAA;MACf2B,EAkBOC,EAAA,QAAA,UAAAC,EAAAC,EAAA;AAAA,iBAhBgCC,MAAiDvC,EAAA,QAASuC;AAAA,kBAAoBL,EAAA/B,CAAA;AAAA,gBAA0B+B,EAAAX,CAAA;AAAA,uBAAwBW,EAAAR,CAAA;AAAA,MAAA,KAFvK,MAkBO;AAAA,QAVHc,EASS,UAAA;AAAA,mBARD;AAAA,UAAJ,KAAIxC;AAAA,UACJ,MAAK;AAAA,UACJ,cAAWkC,EAAAzB,CAAA,GAAa,mBAAA,IAAA;AAAA,UACzB,iBAAc;AAAA,UACb,iBAAeyB,EAAA/B,CAAA;AAAA,UACf,QAAIsC,EAAA,CAAA,MAAAA,EAAA,CAAA;AAAA,oBAAEP,EAAAX,CAAA,KAAAW,EAAAX,CAAA,EAAA,GAAAmB,CAAA;AAAA,UACN,SAAKD,EAAA,CAAA,MAAAA,EAAA,CAAA;AAAA,oBAAEP,EAAAR,CAAA,KAAAQ,EAAAR,CAAA,EAAA,GAAAgB,CAAA;AAAA,QAAA,KACLb,EAAA,KAAK,GAAA,IAAAc,CAAA;AAAA,MAAA;MAGhBC,EAUeV,EAAAW,CAAA,GAAA;AAAA,iBATP;AAAA,QAAJ,KAAI3C;AAAA,QACH,OAAK+B,EAAA;AAAA,gBAA4BC,EAAA/B,CAAA;AAAA,QAAA;QAGjC,SAAO+B,EAAAvB,CAAA,CAAc;AAAA,QACrB,QAAMuB,EAAAX,CAAA;AAAA,QACN,SAAOW,EAAAP,CAAA;AAAA,QACP,+BAAD,MAAA;AAAA,QAAA,GAAkB,CAAA,SAAA,CAAA;AAAA,MAAA;mBAClB,MAAQ;AAAA,UAARQ,EAAQC,EAAA,QAAA,SAAA;AAAA,QAAA;;;;;;;;;;;;;;;;;;;;;;;;;AClEpB,UAAMtC,IAAQ+B,GAKR9B,IAAO+B,GAEP;AAAA,MACF,QAAA9B;AAAA,MACA,MAAAE;AAAA,MACA,eAAAO;AAAA,MACA,SAAAD;AAAA,MACA,UAAAL;AAAA,MACA,gBAAAQ;AAAA,MACA,MAAAK;AAAA,MACA,MAAAC;AAAA,MACA,QAAAC;AAAA,MACA,QAAAK;AAAA,MACA,eAAAG;AAAA,MACA,aAAAC;AAAA,IAAA,IACA9B,EAAmBC,GAAOC,CAAI;AAElC,WAAAgC,EAAa;AAAA,MACT,MAAAf;AAAA,MACA,MAAAC;AAAA,MACA,QAAAC;AAAA,IAAA,CACH,mBAcGc,EA6DM,OAAA;AAAA,MA5DF,OAAKC,EAAA,CAAC,gCACEC,EAAA1B,CAAA,CAAO,CAAA;AAAA,IAAA;MAEJqB,EAAA,uBADXM,EAaOC,gDAVOF,EAAA/B,CAAA,GAAQ,QAAE+B,MAAM,eAAEA,EAAAR,CAAA,EAAA,KAHhC,MAaO;AAAA,QATHc,EAQS,UAAA;AAAA,UAPL,MAAK;AAAA,UACJ,SAAON,EAAAzB,CAAA,CAAa;AAAA,UACrB,iBAAc;AAAA,UACb,iBAAeyB,EAAA/B,CAAA;AAAA,UACf,QAAIsC,EAAA,CAAA,MAAAA,EAAA,CAAA;AAAA,oBAAEP,EAAAX,CAAA,KAAAW,EAAAX,CAAA,EAAA,GAAAmB,CAAA;AAAA,UACN,SAAKD,EAAA,CAAA,MAAAA,EAAA,CAAA;AAAA,oBAAEL,EAAA,WAAAA,EAAA,QAAA,GAAAM,CAAA;AAAA,QAAA,KACLb,EAAA,KAAK,GAAA,IAAAc,CAAA;AAAA,MAAA;MAGhBH,EA6BM,OA7BNM,GA6BM;AAAA,QA5BFX,EAgBOC,EAAA,QAAA,UAAAC,EAAAC,EAAA;AAAA,mBAdoCC,MAAiDvC,EAAA,QAASuC;AAAA,oBAAwBL,EAAA/B,CAAA;AAAA,kBAA8B+B,EAAAX,CAAA;AAAA,yBAA4BW,EAAAR,CAAA;AAAA,QAAA,KAFvL,MAgBO;AAAA,UARHc,EAO6B,UAAA;AAAA,qBANrB;AAAA,YAAJ,KAAIxC;AAAA,YACJ,MAAK;AAAA,YACL,iBAAc;AAAA,YACb,iBAAekC,EAAA/B,CAAA;AAAA,YACf,OAAK8B,EAAA,EAAA,GAAMC,EAAAzB,CAAA,GAAa,mBAAA,IAAA,yBAAoDoB,EAAA,MAAA,CAAK;AAAA,YACjF,QAAIY,EAAA,CAAA,MAAAA,EAAA,CAAA;AAAA,sBAAEP,EAAAX,CAAA,KAAAW,EAAAX,CAAA,EAAA,GAAAmB,CAAA;AAAA,YACN,SAAKD,EAAA,CAAA,MAAAA,EAAA,CAAA;AAAA,sBAAEP,EAAAR,CAAA,KAAAQ,EAAAR,CAAA,EAAA,GAAAgB,CAAA;AAAA,UAAA;;QAEhBE,EAUeV,EAAAW,CAAA,GAAA;AAAA,mBATP;AAAA,UAAJ,KAAI3C;AAAA,UACH,OAAK+B,EAAA;AAAA,kBAAgCC,EAAA/B,CAAA;AAAA,UAAA;UAGrC,SAAO+B,EAAAvB,CAAA,CAAc;AAAA,UACrB,QAAMuB,EAAAX,CAAA;AAAA,UACN,SAAOW,EAAAP,CAAA;AAAA,UACP,+BAAD,MAAA;AAAA,UAAA,GAAkB,CAAA,SAAA,CAAA;AAAA,QAAA;qBAClB,MAAQ;AAAA,YAARQ,EAAQC,EAAA,QAAA,SAAA;AAAA,UAAA;;;;MAINP,EAAA,WADVM,EAaOC,gDAVOF,EAAA/B,CAAA,GAAQ,QAAE+B,MAAM,eAAEA,EAAAR,CAAA,EAAA,KAHhC,MAaO;AAAA,QATHc,EAQS,UAAA;AAAA,UAPL,MAAK;AAAA,UACJ,SAAON,EAAAzB,CAAA,CAAa;AAAA,UACrB,iBAAc;AAAA,UACb,iBAAeyB,EAAA/B,CAAA;AAAA,UACf,QAAIsC,EAAA,CAAA,MAAAA,EAAA,CAAA;AAAA,oBAAEP,EAAAX,CAAA,KAAAW,EAAAX,CAAA,EAAA,GAAAmB,CAAA;AAAA,UACN,SAAKD,EAAA,CAAA,MAAAA,EAAA,CAAA;AAAA,oBAAEL,EAAA,WAAAA,EAAA,QAAA,GAAAM,CAAA;AAAA,QAAA,KACLb,EAAA,KAAK,GAAA,IAAAkB,EAAA;AAAA,MAAA;;;;;;;;;;;;;;;;;;;;;;;AChGxB,UAAMjD,IAAQ+B,GAOR9B,IAAO+B,GAEPS,IAAKS,EAAqF,IAAI;AAEpG,WAAAjB,EAAa;AAAA,MACT,MAAM,MAAMQ,EAAG,OAAO,KAAA;AAAA,MACtB,MAAM,MAAMA,EAAG,OAAO,KAAA;AAAA,MACtB,QAAQ,MAAMA,EAAG,OAAO,OAAA;AAAA,IAAO,CAClC,cAWGU,EAAA,GAAAC,EAwBYC,EAtBFtB,EAAA,QAA4BuB,KAApBC,CAAoC,GAFtDC,EAwBY;AAAA,eAvBJ;AAAA,MAAJ,KAAIf;AAAA,IAAA,GAEIzC,GAAK;AAAA,MACZ,SAAK2C,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAGjB,MAAkBzB,WAAcyB,CAAC;AAAA,MACzC,eAAYiB,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAGjB,MAAkBzB,iBAAoByB,CAAC;AAAA,MACtD,8BAAYzB,EAAI,MAAA;AAAA,MAChB,8BAAYA,EAAI,MAAA;AAAA,IAAA;MACN,QAAMwD,EACb,CAEoBC,MAHD;AAAA,QACnBrB,EAEoBC,wBAARoB,CAAI,CAAA,CAAA;AAAA,MAAA;MAET,QAAMD,EACb,CAEoBC,MAHD;AAAA,QACnBrB,EAEoBC,wBAARoB,CAAI,CAAA,CAAA;AAAA,MAAA;MAET,OAAKD,EACZ,CAEoBC,MAHF;AAAA,QAClBrB,EAEoBC,uBAARoB,CAAI,CAAA,CAAA;AAAA,MAAA;iBAEpB,MAAQ;AAAA,QAARrB,EAAQC,EAAA,QAAA,SAAA;AAAA,MAAA;;;;;"}

package/dist/btn-dropdown.umd.cjs CHANGED Viewed

@@ -1,2 +1,2 @@
-(function(C,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue"),require("@vue-interface/dropdown-menu"),require("@floating-ui/dom"),require("@floating-ui/vue")):typeof define=="function"&&define.amd?define(["exports","vue","@vue-interface/dropdown-menu","@floating-ui/dom","@floating-ui/vue"],e):(C=typeof globalThis<"u"?globalThis:C||self,e(C.BtnDropdown={},C.Vue,C.VueInterfaceDropdownMenu,C.FloatingUiDom,C.FloatingUiVue))})(this,(function(C,e,S,T,x){"use strict";function P(t,k){const d=e.ref(null),c=e.ref(),a=e.ref(!1),f=e.computed(()=>t.align??"start"),g=e.computed(()=>t.dropup?"top":t.dropleft?"left":t.dropright?"right":"bottom"),i=e.computed(()=>`${g.value}-${f.value}`),s=e.computed(()=>({dropdown:t.dropup&&t.dropright&&t.dropleft,dropup:t.dropup,dropright:t.dropright,dropleft:t.dropleft,expanded:a.value,[t.size??""]:!!t.size})),u=e.computed(()=>{const l={btn:!0,[t.variant??""]:!!t.variant,"btn-block":!!t.block,"no-caret":!t.caret};if(typeof t.buttonClass=="string")l[t.buttonClass]=!0;else if(Array.isArray(t.buttonClass))for(const z of t.buttonClass)l[z]=!0;else t.buttonClass&&Object.assign(l,t.buttonClass);return l}),{floatingStyles:B,update:w}=x.useFloating(d,c,{placement:i,middleware:t.middleware??[T.offset(t.offset??5),T.flip()]});function b(){a.value=!0,!(!d.value||!c.value)&&(w(),k("show"))}function y(){a.value=!1,d.value instanceof HTMLElement&&d.value?.blur(),k("hide")}function r(){a.value?y():b()}function m(l){const z=Array.from(c.value?.$el.querySelectorAll("label, input, select, textarea")??[]);for(const H in z)if(l===z[H])return!0;return!1}function h(l){if(!(l.relatedTarget instanceof HTMLElement)||!(d.value instanceof Element)){y();return}(c.value&&!c.value?.$el.contains(l.relatedTarget)||!d.value?.contains(l.relatedTarget))&&y()}function p(l){k("click",l)}function n(l){l.target?.dispatchEvent(new Event("focus",l)),k("clickToggle",l),l.defaultPrevented||r()}function o(l){if(!(l.target instanceof HTMLElement)){y();return}!m(l.target)&&!l.defaultPrevented&&y()}return e.watchEffect(()=>{a.value?window.addEventListener("resize",w):window.removeEventListener("resize",w)}),{target:d,menu:c,alignment:f,expanded:a,floatingStyles:B,placement:i,side:g,classes:s,buttonClasses:u,show:b,hide:y,toggle:r,onBlur:h,onClick:p,onClickToggle:n,onClickItem:o}}const $=["aria-expanded"],E=e.defineComponent({__name:"BtnDropdownSingle",props:{align:{},block:{type:Boolean},buttonClass:{},caret:{type:Boolean,default:!0},dropup:{type:Boolean},dropright:{type:Boolean},dropleft:{type:Boolean},label:{},offset:{},middleware:{},side:{},size:{},split:{type:Boolean},variant:{default:"btn-primary"}},emits:["click","clickToggle","show","hide"],setup(t,{expose:k,emit:d}){const c=t,a=d,{target:f,menu:g,buttonClasses:i,classes:s,expanded:u,floatingStyles:B,show:w,hide:b,toggle:y,onBlur:r,onClickToggle:m,onClickItem:h}=P(c,a);return k({show:w,hide:b,toggle:y}),(p,n)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["btn-group",e.unref(s)])},[e.renderSlot(p.$slots,"button",e.normalizeProps(e.guardReactiveProps({target:o=>f.value=o,expanded:e.unref(u),onBlur:e.unref(r),onClickToggle:e.unref(m)})),()=>[e.createElementVNode("button",{ref_key:"target",ref:f,type:"button",class:e.normalizeClass({...e.unref(i),"dropdown-toggle":!0}),"aria-haspopup":"true","aria-expanded":e.unref(u),onBlur:n[0]||(n[0]=(...o)=>e.unref(r)&&e.unref(r)(...o)),onClick:n[1]||(n[1]=(...o)=>e.unref(m)&&e.unref(m)(...o))},e.toDisplayString(t.label),43,$)]),e.createVNode(e.unref(S.DropdownMenu),{ref_key:"menu",ref:g,class:e.normalizeClass({show:e.unref(u)}),style:e.normalizeStyle(e.unref(B)),onBlur:e.unref(r),onClick:e.unref(h),onMousedown:n[2]||(n[2]=e.withModifiers(()=>{},["prevent"]))},{default:e.withCtx(()=>[e.renderSlot(p.$slots,"default")]),_:3},8,["class","style","onBlur","onClick"])],2))}}),D=["aria-expanded"],V={class:"btn-group"},M=["aria-expanded"],N=["aria-expanded"],R=e.defineComponent({__name:"BtnDropdownSplit",props:{align:{},block:{type:Boolean},buttonClass:{},caret:{type:Boolean,default:!0},dropup:{type:Boolean},dropright:{type:Boolean},dropleft:{type:Boolean},label:{},offset:{},middleware:{},side:{},size:{},split:{type:Boolean},variant:{default:"btn-primary"}},emits:["click","clickToggle","show","hide"],setup(t,{expose:k,emit:d}){const c=t,a=d,{target:f,menu:g,buttonClasses:i,classes:s,expanded:u,floatingStyles:B,show:w,hide:b,toggle:y,onBlur:r,onClickToggle:m,onClickItem:h}=P(c,a);return k({show:w,hide:b,toggle:y}),(p,n)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["btn-group btn-dropdown-split",e.unref(s)])},[t.dropleft?e.createCommentVNode("",!0):e.renderSlot(p.$slots,"button",e.normalizeProps(e.mergeProps({key:0},{expanded:e.unref(u),onBlur:e.unref(r),onClickToggle:e.unref(m)})),()=>[e.createElementVNode("button",{type:"button",class:e.normalizeClass(e.unref(i)),"aria-haspopup":"true","aria-expanded":e.unref(u),onBlur:n[0]||(n[0]=(...o)=>e.unref(r)&&e.unref(r)(...o)),onClick:n[1]||(n[1]=(...o)=>p.onClick&&p.onClick(...o))},e.toDisplayString(t.label),43,D)]),e.createElementVNode("div",V,[e.renderSlot(p.$slots,"toggle",e.normalizeProps(e.guardReactiveProps({target:o=>f.value=o,expanded:e.unref(u),onBlur:e.unref(r),onClickToggle:e.unref(m)})),()=>[e.createElementVNode("button",{ref_key:"target",ref:f,type:"button","aria-haspopup":"true","aria-expanded":e.unref(u),class:e.normalizeClass({...e.unref(i),"dropdown-toggle":!0,"dropdown-toggle-split":t.split}),onBlur:n[2]||(n[2]=(...o)=>e.unref(r)&&e.unref(r)(...o)),onClick:n[3]||(n[3]=(...o)=>e.unref(m)&&e.unref(m)(...o))},null,42,M)]),e.createVNode(e.unref(S.DropdownMenu),{ref_key:"menu",ref:g,class:e.normalizeClass({show:e.unref(u)}),style:e.normalizeStyle(e.unref(B)),onBlur:e.unref(r),onClick:e.unref(h),onMousedown:n[4]||(n[4]=e.withModifiers(()=>{},["prevent"]))},{default:e.withCtx(()=>[e.renderSlot(p.$slots,"default")]),_:3},8,["class","style","onBlur","onClick"])]),t.dropleft?e.renderSlot(p.$slots,"button",e.normalizeProps(e.mergeProps({key:1},{expanded:e.unref(u),onBlur:e.unref(r),onClickToggle:e.unref(m)})),()=>[e.createElementVNode("button",{type:"button",class:e.normalizeClass(e.unref(i)),"aria-haspopup":"true","aria-expanded":e.unref(u),onBlur:n[5]||(n[5]=(...o)=>e.unref(r)&&e.unref(r)(...o)),onClick:n[6]||(n[6]=(...o)=>p.onClick&&p.onClick(...o))},e.toDisplayString(t.label),43,N)]):e.createCommentVNode("",!0)],2))}}),q=e.defineComponent({__name:"BtnDropdown",props:{split:{type:Boolean,default:!1},align:{},block:{type:Boolean},buttonClass:{},caret:{type:Boolean,default:!0},dropup:{type:Boolean},dropright:{type:Boolean},dropleft:{type:Boolean},label:{},offset:{},middleware:{},side:{},size:{},variant:{}},emits:["click","clickToggle","show","hide"],setup(t,{expose:k,emit:d}){const c=t,a=d,f=e.useTemplateRef("el");return k({hide:()=>f.value?.hide(),show:()=>f.value?.show(),toggle:()=>f.value?.toggle()}),(g,i)=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(t.split?R:E),e.mergeProps({ref_key:"el",ref:f},c,{onClick:i[0]||(i[0]=s=>a("click",s)),onClickToggle:i[1]||(i[1]=s=>a("clickToggle",s)),onShow:i[2]||(i[2]=()=>a("show")),onHide:i[3]||(i[3]=()=>a("hide"))}),{button:e.withCtx(s=>[e.renderSlot(g.$slots,"button",e.normalizeProps(e.guardReactiveProps(s)))]),toggle:e.withCtx(s=>[e.renderSlot(g.$slots,"toggle",e.normalizeProps(e.guardReactiveProps(s)))]),split:e.withCtx(s=>[e.renderSlot(g.$slots,"split",e.normalizeProps(e.guardReactiveProps(s)))]),default:e.withCtx(()=>[e.renderSlot(g.$slots,"default")]),_:3},16))}});C.BtnDropdown=q,Object.defineProperty(C,Symbol.toStringTag,{value:"Module"})}));
+(function(C,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue"),require("@vue-interface/dropdown-menu"),require("@floating-ui/dom"),require("@floating-ui/vue")):typeof define=="function"&&define.amd?define(["exports","vue","@vue-interface/dropdown-menu","@floating-ui/dom","@floating-ui/vue"],e):(C=typeof globalThis<"u"?globalThis:C||self,e(C.BtnDropdown={},C.Vue,C.VueInterfaceDropdownMenu,C.FloatingUiDom,C.FloatingUiVue))})(this,(function(C,e,S,T,x){"use strict";function P(t,k){const d=e.ref(null),c=e.ref(),a=e.ref(!1),f=e.computed(()=>t.align??"start"),g=e.computed(()=>t.dropup?"top":t.dropleft?"left":t.dropright?"right":"bottom"),i=e.computed(()=>`${g.value}-${f.value}`),s=e.computed(()=>({dropdown:t.dropup&&t.dropright&&t.dropleft,dropup:t.dropup,dropright:t.dropright,dropleft:t.dropleft,expanded:a.value,[t.size]:!!t.size})),u=e.computed(()=>{const l={btn:!0,[t.variant??""]:!!t.variant,"btn-block":!!t.block,"no-caret":!t.caret};if(typeof t.buttonClass=="string")l[t.buttonClass]=!0;else if(Array.isArray(t.buttonClass))for(const z of t.buttonClass)l[z]=!0;else t.buttonClass&&Object.assign(l,t.buttonClass);return l}),{floatingStyles:B,update:w}=x.useFloating(d,c,{placement:i,middleware:t.middleware??[T.offset(t.offset??5),T.flip()]});function b(){a.value=!0,!(!d.value||!c.value)&&(w(),k("show"))}function y(){a.value=!1,d.value instanceof HTMLElement&&d.value?.blur(),k("hide")}function r(){a.value?y():b()}function m(l){const z=Array.from(c.value?.$el.querySelectorAll("label, input, select, textarea")??[]);for(const H in z)if(l===z[H])return!0;return!1}function h(l){if(!(l.relatedTarget instanceof HTMLElement)||!(d.value instanceof Element)){y();return}(c.value&&!c.value?.$el.contains(l.relatedTarget)||!d.value?.contains(l.relatedTarget))&&y()}function p(l){k("click",l)}function n(l){l.target?.dispatchEvent(new Event("focus",l)),k("clickToggle",l),l.defaultPrevented||r()}function o(l){if(!(l.target instanceof HTMLElement)){y();return}!m(l.target)&&!l.defaultPrevented&&y()}return e.watchEffect(()=>{a.value?window.addEventListener("resize",w):window.removeEventListener("resize",w)}),{target:d,menu:c,alignment:f,expanded:a,floatingStyles:B,placement:i,side:g,classes:s,buttonClasses:u,show:b,hide:y,toggle:r,onBlur:h,onClick:p,onClickToggle:n,onClickItem:o}}const $=["aria-expanded"],E=e.defineComponent({__name:"BtnDropdownSingle",props:{align:{},block:{type:Boolean},buttonClass:{},caret:{type:Boolean,default:!0},dropup:{type:Boolean},dropright:{type:Boolean},dropleft:{type:Boolean},label:{},offset:{},middleware:{},side:{},size:{},split:{type:Boolean},variant:{default:"btn-primary"}},emits:["click","clickToggle","show","hide"],setup(t,{expose:k,emit:d}){const c=t,a=d,{target:f,menu:g,buttonClasses:i,classes:s,expanded:u,floatingStyles:B,show:w,hide:b,toggle:y,onBlur:r,onClickToggle:m,onClickItem:h}=P(c,a);return k({show:w,hide:b,toggle:y}),(p,n)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["btn-group",e.unref(s)])},[e.renderSlot(p.$slots,"button",e.normalizeProps(e.guardReactiveProps({target:o=>f.value=o,expanded:e.unref(u),onBlur:e.unref(r),onClickToggle:e.unref(m)})),()=>[e.createElementVNode("button",{ref_key:"target",ref:f,type:"button",class:e.normalizeClass({...e.unref(i),"dropdown-toggle":!0}),"aria-haspopup":"true","aria-expanded":e.unref(u),onBlur:n[0]||(n[0]=(...o)=>e.unref(r)&&e.unref(r)(...o)),onClick:n[1]||(n[1]=(...o)=>e.unref(m)&&e.unref(m)(...o))},e.toDisplayString(t.label),43,$)]),e.createVNode(e.unref(S.DropdownMenu),{ref_key:"menu",ref:g,class:e.normalizeClass({show:e.unref(u)}),style:e.normalizeStyle(e.unref(B)),onBlur:e.unref(r),onClick:e.unref(h),onMousedown:n[2]||(n[2]=e.withModifiers(()=>{},["prevent"]))},{default:e.withCtx(()=>[e.renderSlot(p.$slots,"default")]),_:3},8,["class","style","onBlur","onClick"])],2))}}),D=["aria-expanded"],V={class:"btn-group"},M=["aria-expanded"],N=["aria-expanded"],R=e.defineComponent({__name:"BtnDropdownSplit",props:{align:{},block:{type:Boolean},buttonClass:{},caret:{type:Boolean,default:!0},dropup:{type:Boolean},dropright:{type:Boolean},dropleft:{type:Boolean},label:{},offset:{},middleware:{},side:{},size:{},split:{type:Boolean},variant:{default:"btn-primary"}},emits:["click","clickToggle","show","hide"],setup(t,{expose:k,emit:d}){const c=t,a=d,{target:f,menu:g,buttonClasses:i,classes:s,expanded:u,floatingStyles:B,show:w,hide:b,toggle:y,onBlur:r,onClickToggle:m,onClickItem:h}=P(c,a);return k({show:w,hide:b,toggle:y}),(p,n)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["btn-group btn-dropdown-split",e.unref(s)])},[t.dropleft?e.createCommentVNode("",!0):e.renderSlot(p.$slots,"button",e.normalizeProps(e.mergeProps({key:0},{expanded:e.unref(u),onBlur:e.unref(r),onClickToggle:e.unref(m)})),()=>[e.createElementVNode("button",{type:"button",class:e.normalizeClass(e.unref(i)),"aria-haspopup":"true","aria-expanded":e.unref(u),onBlur:n[0]||(n[0]=(...o)=>e.unref(r)&&e.unref(r)(...o)),onClick:n[1]||(n[1]=(...o)=>p.onClick&&p.onClick(...o))},e.toDisplayString(t.label),43,D)]),e.createElementVNode("div",V,[e.renderSlot(p.$slots,"toggle",e.normalizeProps(e.guardReactiveProps({target:o=>f.value=o,expanded:e.unref(u),onBlur:e.unref(r),onClickToggle:e.unref(m)})),()=>[e.createElementVNode("button",{ref_key:"target",ref:f,type:"button","aria-haspopup":"true","aria-expanded":e.unref(u),class:e.normalizeClass({...e.unref(i),"dropdown-toggle":!0,"dropdown-toggle-split":t.split}),onBlur:n[2]||(n[2]=(...o)=>e.unref(r)&&e.unref(r)(...o)),onClick:n[3]||(n[3]=(...o)=>e.unref(m)&&e.unref(m)(...o))},null,42,M)]),e.createVNode(e.unref(S.DropdownMenu),{ref_key:"menu",ref:g,class:e.normalizeClass({show:e.unref(u)}),style:e.normalizeStyle(e.unref(B)),onBlur:e.unref(r),onClick:e.unref(h),onMousedown:n[4]||(n[4]=e.withModifiers(()=>{},["prevent"]))},{default:e.withCtx(()=>[e.renderSlot(p.$slots,"default")]),_:3},8,["class","style","onBlur","onClick"])]),t.dropleft?e.renderSlot(p.$slots,"button",e.normalizeProps(e.mergeProps({key:1},{expanded:e.unref(u),onBlur:e.unref(r),onClickToggle:e.unref(m)})),()=>[e.createElementVNode("button",{type:"button",class:e.normalizeClass(e.unref(i)),"aria-haspopup":"true","aria-expanded":e.unref(u),onBlur:n[5]||(n[5]=(...o)=>e.unref(r)&&e.unref(r)(...o)),onClick:n[6]||(n[6]=(...o)=>p.onClick&&p.onClick(...o))},e.toDisplayString(t.label),43,N)]):e.createCommentVNode("",!0)],2))}}),q=e.defineComponent({__name:"BtnDropdown",props:{split:{type:Boolean,default:!1},align:{},block:{type:Boolean},buttonClass:{},caret:{type:Boolean,default:!0},dropup:{type:Boolean},dropright:{type:Boolean},dropleft:{type:Boolean},label:{},offset:{},middleware:{},side:{},size:{},variant:{}},emits:["click","clickToggle","show","hide"],setup(t,{expose:k,emit:d}){const c=t,a=d,f=e.useTemplateRef("el");return k({hide:()=>f.value?.hide(),show:()=>f.value?.show(),toggle:()=>f.value?.toggle()}),(g,i)=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(t.split?R:E),e.mergeProps({ref_key:"el",ref:f},c,{onClick:i[0]||(i[0]=s=>a("click",s)),onClickToggle:i[1]||(i[1]=s=>a("clickToggle",s)),onShow:i[2]||(i[2]=()=>a("show")),onHide:i[3]||(i[3]=()=>a("hide"))}),{button:e.withCtx(s=>[e.renderSlot(g.$slots,"button",e.normalizeProps(e.guardReactiveProps(s)))]),toggle:e.withCtx(s=>[e.renderSlot(g.$slots,"toggle",e.normalizeProps(e.guardReactiveProps(s)))]),split:e.withCtx(s=>[e.renderSlot(g.$slots,"split",e.normalizeProps(e.guardReactiveProps(s)))]),default:e.withCtx(()=>[e.renderSlot(g.$slots,"default")]),_:3},16))}});C.BtnDropdown=q,Object.defineProperty(C,Symbol.toStringTag,{value:"Module"})}));
 //# sourceMappingURL=btn-dropdown.umd.cjs.map

package/dist/btn-dropdown.umd.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"btn-dropdown.umd.cjs","sources":["../src/useDropdownHandler.ts","../src/BtnDropdownSingle.vue","../src/BtnDropdownSplit.vue","../src/BtnDropdown.vue"],"sourcesContent":["import { flip, offset, Placement, type Alignment, type Middleware, type OffsetOptions, type Side } from '@floating-ui/dom';\nimport { useFloating, UseFloatingReturn } from '@floating-ui/vue';\nimport { DropdownMenu } from '@vue-interface/dropdown-menu';\nimport { ComponentPublicInstance, computed, ComputedRef, Ref, ref, watchEffect, type EmitFn, type HTMLAttributes } from 'vue';\n\ntype LiteralUnion<T extends U, U = string> = T \| (U & Record<never, never>);\n\nexport type BtnGroupSizes = 'btn-group-xs'\n \| 'btn-group-sm' \n \| 'btn-group-md'\n \| 'btn-group-lg'\n \| 'btn-group-xl'\n \| 'btn-group-2xl'\n \| 'btn-group-3xl'\n \| 'btn-group-4xl';\n\nexport type BtnDropdownProps = {\n align?: Alignment;\n block?: boolean;\n buttonClass?: HTMLAttributes['class'],\n caret?: boolean;\n dropup?: boolean;\n dropright?: boolean;\n dropleft?: boolean;\n label?: string;\n offset?: OffsetOptions,\n middleware?: Middleware[],\n side?: Side;\n size?: LiteralUnion<BtnGroupSizes>;\n split?: boolean;\n variant?: string;\n}\n\nexport type BtnDropdownEvents = {\n click: [event: MouseEvent];\n clickToggle: [event: MouseEvent];\n show: [],\n hide: []\n}\n\nexport type BtnDropdownSlotProps = { \n target: (el: Element \| ComponentPublicInstance \| null) => void;\n expanded: boolean;\n onBlur: (e: FocusEvent) => void;\n onClickToggle: (e: MouseEvent) => void;\n};\n\nexport type UseDropdownHandler = {\n target: Ref<Element\|ComponentPublicInstance\|null>;\n menu: Ref<InstanceType<typeof DropdownMenu>\|undefined>;\n alignment: ComputedRef<Alignment>;\n expanded: Ref<boolean>;\n floatingStyles: UseFloatingReturn['floatingStyles'];\n placement: ComputedRef<Placement>;\n side: ComputedRef<Side>;\n classes: ComputedRef<Record<string, boolean\|undefined>>;\n buttonClasses: ComputedRef<Record<string, boolean>>;\n show: () => void;\n hide: () => void;\n toggle: () => void;\n onBlur: (e: FocusEvent) => void;\n onClick: (e: MouseEvent) => void;\n onClickToggle: (e: MouseEvent) => void;\n onClickItem: (e: PointerEvent) => void;\n}\n\nexport function useDropdownHandler(props: BtnDropdownProps, emit: EmitFn<BtnDropdownEvents>): UseDropdownHandler {\n const target = ref<Element\|ComponentPublicInstance\|null>(null);\n const menu = ref<InstanceType<typeof DropdownMenu>>();\n const expanded = ref(false);\n\n const alignment = computed<Alignment>(() => props.align ?? 'start');\n\n const side = computed<Side>(() => {\n if(props.dropup) {\n return 'top';\n }\n\n if(props.dropleft) {\n return 'left';\n }\n\n if(props.dropright) {\n return 'right';\n }\n\n return 'bottom';\n });\n\n const placement = computed<Placement>(() => `${side.value}-${alignment.value}`);\n\n const classes = computed<Record<string,boolean\|undefined>>(() => ({\n 'dropdown': props.dropup && props.dropright && props.dropleft,\n 'dropup': props.dropup,\n 'dropright': props.dropright,\n 'dropleft': props.dropleft,\n 'expanded': expanded.value,\n [props.size ?? '']: !!props.size,\n }));\n \n const buttonClasses = computed(() => {\n const classes = {\n btn: true,\n [props.variant ?? '']: !!props.variant,\n 'btn-block': !!props.block,\n 'no-caret': !props.caret\n };\n \n if(typeof props.buttonClass === 'string') {\n classes[props.buttonClass] = true;\n }\n else if(Array.isArray(props.buttonClass)) {\n for(const value of props.buttonClass) {\n classes[value] = true;\n }\n }\n else if(props.buttonClass) {\n Object.assign(classes, props.buttonClass);\n }\n\n return classes;\n });\n\n const { floatingStyles, update } = useFloating(target, menu, {\n placement: placement,\n middleware: props.middleware ?? [\n offset(props.offset ?? 5),\n flip()\n ]\n });\n\n function show() {\n expanded.value = true;\n\n if(!target.value \|\| !menu.value) {\n return;\n }\n\n update();\n\n emit('show');\n }\n\n function hide() {\n expanded.value = false;\n\n if(target.value instanceof HTMLElement) {\n target.value?.blur();\n }\n\n emit('hide');\n }\n\n function toggle() {\n if(!expanded.value) {\n show();\n }\n else {\n hide();\n }\n }\n\n function isFocusable(element: HTMLElement) {\n const nodes = Array.from(menu.value?.$el.querySelectorAll('label, input, select, textarea') ?? []);\n\n for(const i in nodes) {\n if(element === nodes[i]) {\n return true;\n }\n }\n\n return false;\n }\n \n function onBlur(e: FocusEvent) {\n if(!(e.relatedTarget instanceof HTMLElement) \|\| !(target.value instanceof Element)) {\n hide();\n \n return;\n }\n \n if(menu.value && !menu.value?.$el.contains(e.relatedTarget) \|\| !target.value?.contains(e.relatedTarget)) {\n hide();\n }\n }\n\n function onClick(e: MouseEvent) {\n emit('click', e);\n }\n\n function onClickToggle(e: MouseEvent) {\n e.target?.dispatchEvent(new Event('focus', e));\n \n emit('clickToggle', e);\n\n if(!e.defaultPrevented) {\n toggle();\n }\n }\n\n function onClickItem(e: PointerEvent) {\n if(!(e.target instanceof HTMLElement)) {\n hide();\n\n return;\n }\n\n if(!isFocusable(e.target) && !e.defaultPrevented) {\n hide();\n }\n }\n\n watchEffect(() => {\n if(expanded.value) {\n window.addEventListener('resize', update);\n }\n else {\n window.removeEventListener('resize', update);\n }\n });\n\n return {\n target,\n menu,\n alignment,\n expanded,\n floatingStyles,\n placement,\n side,\n classes,\n buttonClasses,\n show,\n hide,\n toggle,\n onBlur,\n onClick,\n onClickToggle,\n onClickItem\n };\n}","<script setup lang=\"ts\">\nimport { DropdownMenu } from '@vue-interface/dropdown-menu';\nimport { ComponentPublicInstance } from 'vue';\nimport { BtnDropdownEvents, BtnDropdownProps, BtnDropdownSlotProps, useDropdownHandler } from './useDropdownHandler';\n\nconst props = withDefaults(defineProps<BtnDropdownProps>(), {\n caret: true,\n variant: 'btn-primary'\n});\n\nconst emit = defineEmits<BtnDropdownEvents>();\n\nconst {\n target,\n menu,\n buttonClasses,\n classes,\n expanded,\n floatingStyles,\n show,\n hide,\n toggle,\n onBlur,\n onClickToggle,\n onClickItem\n} = useDropdownHandler(props, emit);\n\ndefineExpose({\n show,\n hide,\n toggle,\n});\n\ndefineSlots<{\n button(props: BtnDropdownSlotProps): any;\n default(): any;\n}>();\n</script>\n\n<template>\n <div\n class=\"btn-group\"\n :class=\"classes\">\n <slot\n name=\"button\"\n v-bind=\"{\n target: (el: Element \| ComponentPublicInstance \| null) => target = el,\n expanded,\n onBlur,\n onClickToggle\n }\">\n <button\n ref=\"target\"\n type=\"button\"\n :class=\"{...buttonClasses, ['dropdown-toggle']: true}\"\n aria-haspopup=\"true\"\n :aria-expanded=\"expanded\"\n @blur=\"onBlur\"\n @click=\"onClickToggle\">\n {{ label }}\n </button>\n </slot>\n <DropdownMenu\n ref=\"menu\"\n :class=\"{\n 'show': expanded\n }\"\n :style=\"floatingStyles\"\n @blur=\"onBlur\"\n @click=\"onClickItem\"\n @mousedown.prevent>\n <slot />\n </DropdownMenu>\n </div>\n</template>","<script setup lang=\"ts\">\nimport { DropdownMenu } from '@vue-interface/dropdown-menu';\nimport { ComponentPublicInstance } from 'vue';\nimport { BtnDropdownEvents, BtnDropdownProps, BtnDropdownSlotProps, useDropdownHandler } from './useDropdownHandler';\n\nconst props = withDefaults(defineProps<BtnDropdownProps>(), {\n caret: true,\n variant: 'btn-primary'\n});\n\nconst emit = defineEmits<BtnDropdownEvents>();\n\nconst {\n target,\n menu,\n buttonClasses,\n classes,\n expanded,\n floatingStyles,\n show,\n hide,\n toggle,\n onBlur,\n onClickToggle,\n onClickItem\n} = useDropdownHandler(props, emit);\n\ndefineExpose({\n show,\n hide,\n toggle,\n});\n\ndefineSlots<{\n button(props: {\n expanded: BtnDropdownSlotProps['expanded'],\n onBlur: BtnDropdownSlotProps['onBlur'],\n onClickToggle: BtnDropdownSlotProps['onClickToggle']\n }): any;\n toggle(props: BtnDropdownSlotProps): any;\n default(): any;\n}>();\n</script>\n\n<template>\n <div\n class=\"btn-group btn-dropdown-split\"\n :class=\"classes\">\n <slot\n v-if=\"!dropleft\"\n name=\"button\"\n v-bind=\"{ expanded, onBlur, onClickToggle }\">\n <button\n type=\"button\"\n :class=\"buttonClasses\"\n aria-haspopup=\"true\"\n :aria-expanded=\"expanded\"\n @blur=\"onBlur\"\n @click=\"onClick\">\n {{ label }}\n </button>\n </slot>\n <div class=\"btn-group\">\n <slot\n name=\"toggle\"\n v-bind=\"{\n target: (el: Element \| ComponentPublicInstance \| null) => target = el,\n expanded,\n onBlur,\n onClickToggle\n }\">\n <button\n ref=\"target\"\n type=\"button\"\n aria-haspopup=\"true\"\n :aria-expanded=\"expanded\"\n :class=\"{...buttonClasses, 'dropdown-toggle': true, 'dropdown-toggle-split': split}\"\n @blur=\"onBlur\"\n @click=\"onClickToggle\" />\n </slot>\n <DropdownMenu\n ref=\"menu\"\n :class=\"{\n 'show': expanded\n }\"\n :style=\"floatingStyles\"\n @blur=\"onBlur\"\n @click=\"onClickItem\"\n @mousedown.prevent>\n <slot />\n </DropdownMenu>\n </div>\n <slot\n v-if=\"dropleft\"\n name=\"button\"\n v-bind=\"{ expanded, onBlur, onClickToggle }\">\n <button\n type=\"button\"\n :class=\"buttonClasses\"\n aria-haspopup=\"true\"\n :aria-expanded=\"expanded\"\n @blur=\"onBlur\"\n @click=\"onClick\">\n {{ label }}\n </button>\n </slot>\n </div>\n</template>","<script setup lang=\"ts\">\nimport { useTemplateRef } from 'vue';\nimport { type ComponentExposed } from 'vue-component-type-helpers';\nimport BtnDropdownSingle from './BtnDropdownSingle.vue';\nimport BtnDropdownSplit from './BtnDropdownSplit.vue';\nimport { BtnDropdownEvents, BtnDropdownProps, BtnDropdownSlotProps } from './useDropdownHandler';\n\nconst props = withDefaults(defineProps<{\n split?: boolean\n} & BtnDropdownProps>(), {\n split: false,\n caret: true\n});\n\nconst emit = defineEmits<BtnDropdownEvents>();\n\nconst el = useTemplateRef<ComponentExposed<typeof BtnDropdownSingle \| typeof BtnDropdownSplit>>('el');\n\ndefineExpose({\n hide: () => el.value?.hide(),\n show: () => el.value?.show(),\n toggle: () => el.value?.toggle(),\n});\n\ndefineSlots<{\n button(props: BtnDropdownSlotProps): any;\n toggle(props: BtnDropdownSlotProps): any;\n split(props: BtnDropdownSlotProps): any;\n default(): any;\n}>();\n</script>\n\n<template>\n <Component\n ref=\"el\"\n :is=\"!split ? BtnDropdownSingle : BtnDropdownSplit\"\n v-bind=\"props\"\n @click=\"(e: MouseEvent) => emit('click', e)\"\n @click-toggle=\"(e: MouseEvent) => emit('clickToggle', e)\"\n @show=\"() => emit('show')\"\n @hide=\"() => emit('hide')\">\n <template #button=\"slot\">\n <slot\n name=\"button\"\n v-bind=\"slot\" />\n </template>\n <template #toggle=\"slot\">\n <slot\n name=\"toggle\"\n v-bind=\"slot\" />\n </template>\n <template #split=\"slot\">\n <slot\n name=\"split\"\n v-bind=\"slot\" />\n </template>\n <slot />\n </Component>\n</template>"],"names":["useDropdownHandler","props","emit","target","ref","menu","expanded","alignment","computed","side","placement","classes","buttonClasses","value","floatingStyles","update","useFloating","offset","flip","show","hide","toggle","isFocusable","element","nodes","i","onBlur","e","onClick","onClickToggle","onClickItem","watchEffect","__props","__emit","__expose","_createElementBlock","_normalizeClass","_unref","_renderSlot","_ctx","_normalizeProps","_guardReactiveProps","el","_createElementVNode","_cache","args","_hoisted_1","_createVNode","DropdownMenu","_hoisted_2","_hoisted_4","useTemplateRef","_openBlock","_createBlock","_resolveDynamicComponent","BtnDropdownSplit","BtnDropdownSingle","_mergeProps","_withCtx","slot"],"mappings":"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"}
1	+ {"version":3,"file":"btn-dropdown.umd.cjs","sources":["../src/useDropdownHandler.ts","../src/BtnDropdownSingle.vue","../src/BtnDropdownSplit.vue","../src/BtnDropdown.vue"],"sourcesContent":["import { flip, offset, Placement, type Alignment, type Middleware, type OffsetOptions, type Side } from '@floating-ui/dom';\nimport { useFloating, UseFloatingReturn } from '@floating-ui/vue';\nimport { DropdownMenu } from '@vue-interface/dropdown-menu';\nimport { ComponentSize } from '@vue-interface/sizeable';\nimport { ComponentPublicInstance, computed, ComputedRef, Ref, ref, watchEffect, type EmitFn, type HTMLAttributes } from 'vue';\n\nexport type BtnGroupSizePrefix = 'btn-group';\n\nexport type BtnDropdownProps = {\n align?: Alignment;\n block?: boolean;\n buttonClass?: HTMLAttributes['class'],\n caret?: boolean;\n dropup?: boolean;\n dropright?: boolean;\n dropleft?: boolean;\n label?: string;\n offset?: OffsetOptions,\n middleware?: Middleware[],\n side?: Side;\n size?: ComponentSize<BtnGroupSizePrefix>;\n split?: boolean;\n variant?: string;\n}\n\nexport type BtnDropdownEvents = {\n click: [event: MouseEvent];\n clickToggle: [event: MouseEvent];\n show: [],\n hide: []\n}\n\nexport type BtnDropdownSlotProps = {\n target: (el: Element \| ComponentPublicInstance \| null) => void;\n expanded: boolean;\n onBlur: (e: FocusEvent) => void;\n onClickToggle: (e: MouseEvent) => void;\n};\n\nexport type UseDropdownHandler = {\n target: Ref<Element \| ComponentPublicInstance \| null>;\n menu: Ref<InstanceType<typeof DropdownMenu> \| undefined>;\n alignment: ComputedRef<Alignment>;\n expanded: Ref<boolean>;\n floatingStyles: UseFloatingReturn['floatingStyles'];\n placement: ComputedRef<Placement>;\n side: ComputedRef<Side>;\n classes: ComputedRef<Record<string, boolean \| undefined>>;\n buttonClasses: ComputedRef<Record<string, boolean>>;\n show: () => void;\n hide: () => void;\n toggle: () => void;\n onBlur: (e: FocusEvent) => void;\n onClick: (e: MouseEvent) => void;\n onClickToggle: (e: MouseEvent) => void;\n onClickItem: (e: PointerEvent) => void;\n}\n\nexport function useDropdownHandler(props: BtnDropdownProps, emit: EmitFn<BtnDropdownEvents>): UseDropdownHandler {\n const target = ref<Element \| ComponentPublicInstance \| null>(null);\n const menu = ref<InstanceType<typeof DropdownMenu>>();\n const expanded = ref(false);\n\n const alignment = computed<Alignment>(() => props.align ?? 'start');\n\n const side = computed<Side>(() => {\n if (props.dropup) {\n return 'top';\n }\n\n if (props.dropleft) {\n return 'left';\n }\n\n if (props.dropright) {\n return 'right';\n }\n\n return 'bottom';\n });\n\n const placement = computed<Placement>(() => `${side.value}-${alignment.value}`);\n\n const classes = computed<Record<string, boolean \| undefined>>(() => ({\n 'dropdown': props.dropup && props.dropright && props.dropleft,\n 'dropup': props.dropup,\n 'dropright': props.dropright,\n 'dropleft': props.dropleft,\n 'expanded': expanded.value,\n [props.size as string]: !!props.size,\n }));\n\n const buttonClasses = computed(() => {\n const classes = {\n btn: true,\n [props.variant ?? '']: !!props.variant,\n 'btn-block': !!props.block,\n 'no-caret': !props.caret\n };\n\n if (typeof props.buttonClass === 'string') {\n classes[props.buttonClass] = true;\n }\n else if (Array.isArray(props.buttonClass)) {\n for (const value of props.buttonClass) {\n classes[value] = true;\n }\n }\n else if (props.buttonClass) {\n Object.assign(classes, props.buttonClass);\n }\n\n return classes;\n });\n\n const { floatingStyles, update } = useFloating(target, menu, {\n placement: placement,\n middleware: props.middleware ?? [\n offset(props.offset ?? 5),\n flip()\n ]\n });\n\n function show() {\n expanded.value = true;\n\n if (!target.value \|\| !menu.value) {\n return;\n }\n\n update();\n\n emit('show');\n }\n\n function hide() {\n expanded.value = false;\n\n if (target.value instanceof HTMLElement) {\n target.value?.blur();\n }\n\n emit('hide');\n }\n\n function toggle() {\n if (!expanded.value) {\n show();\n }\n else {\n hide();\n }\n }\n\n function isFocusable(element: HTMLElement) {\n const nodes = Array.from(menu.value?.$el.querySelectorAll('label, input, select, textarea') ?? []);\n\n for (const i in nodes) {\n if (element === nodes[i]) {\n return true;\n }\n }\n\n return false;\n }\n\n function onBlur(e: FocusEvent) {\n if (!(e.relatedTarget instanceof HTMLElement) \|\| !(target.value instanceof Element)) {\n hide();\n\n return;\n }\n\n if (menu.value && !menu.value?.$el.contains(e.relatedTarget) \|\| !target.value?.contains(e.relatedTarget)) {\n hide();\n }\n }\n\n function onClick(e: MouseEvent) {\n emit('click', e);\n }\n\n function onClickToggle(e: MouseEvent) {\n e.target?.dispatchEvent(new Event('focus', e));\n\n emit('clickToggle', e);\n\n if (!e.defaultPrevented) {\n toggle();\n }\n }\n\n function onClickItem(e: PointerEvent) {\n if (!(e.target instanceof HTMLElement)) {\n hide();\n\n return;\n }\n\n if (!isFocusable(e.target) && !e.defaultPrevented) {\n hide();\n }\n }\n\n watchEffect(() => {\n if (expanded.value) {\n window.addEventListener('resize', update);\n }\n else {\n window.removeEventListener('resize', update);\n }\n });\n\n return {\n target,\n menu,\n alignment,\n expanded,\n floatingStyles,\n placement,\n side,\n classes,\n buttonClasses,\n show,\n hide,\n toggle,\n onBlur,\n onClick,\n onClickToggle,\n onClickItem\n };\n}","<script setup lang=\"ts\">\nimport { DropdownMenu } from '@vue-interface/dropdown-menu';\nimport { ComponentPublicInstance } from 'vue';\nimport { BtnDropdownEvents, BtnDropdownProps, BtnDropdownSlotProps, useDropdownHandler } from './useDropdownHandler';\n\nconst props = withDefaults(defineProps<BtnDropdownProps>(), {\n caret: true,\n variant: 'btn-primary'\n});\n\nconst emit = defineEmits<BtnDropdownEvents>();\n\nconst {\n target,\n menu,\n buttonClasses,\n classes,\n expanded,\n floatingStyles,\n show,\n hide,\n toggle,\n onBlur,\n onClickToggle,\n onClickItem\n} = useDropdownHandler(props, emit);\n\ndefineExpose({\n show,\n hide,\n toggle,\n});\n\ndefineSlots<{\n button(props: BtnDropdownSlotProps): any;\n default(): any;\n}>();\n</script>\n\n<template>\n <div\n class=\"btn-group\"\n :class=\"classes\">\n <slot\n name=\"button\"\n v-bind=\"{\n target: (el: Element \| ComponentPublicInstance \| null) => target = el,\n expanded,\n onBlur,\n onClickToggle\n }\">\n <button\n ref=\"target\"\n type=\"button\"\n :class=\"{...buttonClasses, ['dropdown-toggle']: true}\"\n aria-haspopup=\"true\"\n :aria-expanded=\"expanded\"\n @blur=\"onBlur\"\n @click=\"onClickToggle\">\n {{ label }}\n </button>\n </slot>\n <DropdownMenu\n ref=\"menu\"\n :class=\"{\n 'show': expanded\n }\"\n :style=\"floatingStyles\"\n @blur=\"onBlur\"\n @click=\"onClickItem\"\n @mousedown.prevent>\n <slot />\n </DropdownMenu>\n </div>\n</template>","<script setup lang=\"ts\">\nimport { DropdownMenu } from '@vue-interface/dropdown-menu';\nimport { ComponentPublicInstance } from 'vue';\nimport { BtnDropdownEvents, BtnDropdownProps, BtnDropdownSlotProps, useDropdownHandler } from './useDropdownHandler';\n\nconst props = withDefaults(defineProps<BtnDropdownProps>(), {\n caret: true,\n variant: 'btn-primary'\n});\n\nconst emit = defineEmits<BtnDropdownEvents>();\n\nconst {\n target,\n menu,\n buttonClasses,\n classes,\n expanded,\n floatingStyles,\n show,\n hide,\n toggle,\n onBlur,\n onClickToggle,\n onClickItem\n} = useDropdownHandler(props, emit);\n\ndefineExpose({\n show,\n hide,\n toggle,\n});\n\ndefineSlots<{\n button(props: {\n expanded: BtnDropdownSlotProps['expanded'],\n onBlur: BtnDropdownSlotProps['onBlur'],\n onClickToggle: BtnDropdownSlotProps['onClickToggle']\n }): any;\n toggle(props: BtnDropdownSlotProps): any;\n default(): any;\n}>();\n</script>\n\n<template>\n <div\n class=\"btn-group btn-dropdown-split\"\n :class=\"classes\">\n <slot\n v-if=\"!dropleft\"\n name=\"button\"\n v-bind=\"{ expanded, onBlur, onClickToggle }\">\n <button\n type=\"button\"\n :class=\"buttonClasses\"\n aria-haspopup=\"true\"\n :aria-expanded=\"expanded\"\n @blur=\"onBlur\"\n @click=\"onClick\">\n {{ label }}\n </button>\n </slot>\n <div class=\"btn-group\">\n <slot\n name=\"toggle\"\n v-bind=\"{\n target: (el: Element \| ComponentPublicInstance \| null) => target = el,\n expanded,\n onBlur,\n onClickToggle\n }\">\n <button\n ref=\"target\"\n type=\"button\"\n aria-haspopup=\"true\"\n :aria-expanded=\"expanded\"\n :class=\"{...buttonClasses, 'dropdown-toggle': true, 'dropdown-toggle-split': split}\"\n @blur=\"onBlur\"\n @click=\"onClickToggle\" />\n </slot>\n <DropdownMenu\n ref=\"menu\"\n :class=\"{\n 'show': expanded\n }\"\n :style=\"floatingStyles\"\n @blur=\"onBlur\"\n @click=\"onClickItem\"\n @mousedown.prevent>\n <slot />\n </DropdownMenu>\n </div>\n <slot\n v-if=\"dropleft\"\n name=\"button\"\n v-bind=\"{ expanded, onBlur, onClickToggle }\">\n <button\n type=\"button\"\n :class=\"buttonClasses\"\n aria-haspopup=\"true\"\n :aria-expanded=\"expanded\"\n @blur=\"onBlur\"\n @click=\"onClick\">\n {{ label }}\n </button>\n </slot>\n </div>\n</template>","<script setup lang=\"ts\">\nimport { useTemplateRef } from 'vue';\nimport { type ComponentExposed } from 'vue-component-type-helpers';\nimport BtnDropdownSingle from './BtnDropdownSingle.vue';\nimport BtnDropdownSplit from './BtnDropdownSplit.vue';\nimport { BtnDropdownEvents, BtnDropdownProps, BtnDropdownSlotProps } from './useDropdownHandler';\n\nconst props = withDefaults(defineProps<{\n split?: boolean\n} & BtnDropdownProps>(), {\n split: false,\n caret: true\n});\n\nconst emit = defineEmits<BtnDropdownEvents>();\n\nconst el = useTemplateRef<ComponentExposed<typeof BtnDropdownSingle \| typeof BtnDropdownSplit>>('el');\n\ndefineExpose({\n hide: () => el.value?.hide(),\n show: () => el.value?.show(),\n toggle: () => el.value?.toggle(),\n});\n\ndefineSlots<{\n button(props: BtnDropdownSlotProps): any;\n toggle(props: BtnDropdownSlotProps): any;\n split(props: BtnDropdownSlotProps): any;\n default(): any;\n}>();\n</script>\n\n<template>\n <Component\n ref=\"el\"\n :is=\"!split ? BtnDropdownSingle : BtnDropdownSplit\"\n v-bind=\"props\"\n @click=\"(e: MouseEvent) => emit('click', e)\"\n @click-toggle=\"(e: MouseEvent) => emit('clickToggle', e)\"\n @show=\"() => emit('show')\"\n @hide=\"() => emit('hide')\">\n <template #button=\"slot\">\n <slot\n name=\"button\"\n v-bind=\"slot\" />\n </template>\n <template #toggle=\"slot\">\n <slot\n name=\"toggle\"\n v-bind=\"slot\" />\n </template>\n <template #split=\"slot\">\n <slot\n name=\"split\"\n v-bind=\"slot\" />\n </template>\n <slot />\n </Component>\n</template>"],"names":["useDropdownHandler","props","emit","target","ref","menu","expanded","alignment","computed","side","placement","classes","buttonClasses","value","floatingStyles","update","useFloating","offset","flip","show","hide","toggle","isFocusable","element","nodes","i","onBlur","e","onClick","onClickToggle","onClickItem","watchEffect","__props","__emit","__expose","_createElementBlock","_normalizeClass","_unref","_renderSlot","_ctx","_normalizeProps","_guardReactiveProps","el","_createElementVNode","_cache","args","_hoisted_1","_createVNode","DropdownMenu","_hoisted_2","_hoisted_4","useTemplateRef","_openBlock","_createBlock","_resolveDynamicComponent","BtnDropdownSplit","BtnDropdownSingle","_mergeProps","_withCtx","slot"],"mappings":"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"}

package/dist/index.d.ts CHANGED Viewed

@@ -1,2 +1,3 @@
 import { default as BtnDropdown } from './src/BtnDropdown.vue';
+export * from './src/BtnDropdown.vue';
 export { BtnDropdown };

package/dist/src/BtnDropdown.vue.d.ts CHANGED Viewed

@@ -31,7 +31,7 @@ declare function __VLS_template(): {
                 readonly offset?: import('@floating-ui/dom').OffsetOptions | undefined;
                 readonly middleware?: import('@floating-ui/dom').Middleware[] | undefined;
                 readonly side?: import('@floating-ui/dom').Side | undefined;
-                readonly size?: (import('./useDropdownHandler').BtnGroupSizes | (string & Record<never, never>)) | undefined;
+                readonly size?: import('@vue-interface/sizeable').ComponentSize<import('./useDropdownHandler').BtnGroupSizePrefix> | undefined;
                 readonly split?: boolean | undefined;
                 readonly variant?: string | undefined;
                 readonly onShow?: (() => any) | undefined;
@@ -206,7 +206,7 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {
             readonly offset?: import('@floating-ui/dom').OffsetOptions | undefined;
             readonly middleware?: import('@floating-ui/dom').Middleware[] | undefined;
             readonly side?: import('@floating-ui/dom').Side | undefined;
-            readonly size?: (import('./useDropdownHandler').BtnGroupSizes | (string & Record<never, never>)) | undefined;
+            readonly size?: import('@vue-interface/sizeable').ComponentSize<import('./useDropdownHandler').BtnGroupSizePrefix> | undefined;
             readonly split?: boolean | undefined;
             readonly variant?: string | undefined;
             readonly onShow?: (() => any) | undefined;

package/dist/src/useDropdownHandler.d.ts CHANGED Viewed

@@ -1,9 +1,9 @@
 import { Placement, Alignment, Middleware, OffsetOptions, Side } from '@floating-ui/dom';
 import { UseFloatingReturn } from '@floating-ui/vue';
 import { DropdownMenu } from '@vue-interface/dropdown-menu';
+import { ComponentSize } from '@vue-interface/sizeable';
 import { ComponentPublicInstance, ComputedRef, Ref, EmitFn, HTMLAttributes } from 'vue';
-type LiteralUnion<T extends U, U = string> = T | (U & Record<never, never>);
-export type BtnGroupSizes = 'btn-group-xs' | 'btn-group-sm' | 'btn-group-md' | 'btn-group-lg' | 'btn-group-xl' | 'btn-group-2xl' | 'btn-group-3xl' | 'btn-group-4xl';
+export type BtnGroupSizePrefix = 'btn-group';
 export type BtnDropdownProps = {
     align?: Alignment;
     block?: boolean;
@@ -16,7 +16,7 @@ export type BtnDropdownProps = {
     offset?: OffsetOptions;
     middleware?: Middleware[];
     side?: Side;
-    size?: LiteralUnion<BtnGroupSizes>;
+    size?: ComponentSize<BtnGroupSizePrefix>;
     split?: boolean;
     variant?: string;
 };
@@ -51,4 +51,3 @@ export type UseDropdownHandler = {
     onClickItem: (e: PointerEvent) => void;
 };
 export declare function useDropdownHandler(props: BtnDropdownProps, emit: EmitFn<BtnDropdownEvents>): UseDropdownHandler;
-export {};

package/index.ts CHANGED Viewed

@@ -1,5 +1,7 @@
 import BtnDropdown from './src/BtnDropdown.vue';
+export * from './src/BtnDropdown.vue';
 export {
     BtnDropdown
 };

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@vue-interface/btn-dropdown",
-  "version": "4.1.3",
+  "version": "4.1.5",
   "description": "A Vue button dropdown component.",
   "type": "module",
   "main": "./dist/btn-dropdown.umd.cjs",
@@ -49,7 +49,8 @@
     "@floating-ui/vue": "^1.1.6",
     "vue": "^3.3.4",
     "@vue-interface/btn": "5.0.5",
-    "@vue-interface/dropdown-menu": "3.0.7"
+    "@vue-interface/dropdown-menu": "3.0.8",
+    "@vue-interface/sizeable": "2.0.0"
   },
   "devDependencies": {
     "vue-component-type-helpers": "^3.2.2"

package/src/useDropdownHandler.ts CHANGED Viewed

@@ -1,18 +1,10 @@
 import { flip, offset, Placement, type Alignment, type Middleware, type OffsetOptions, type Side } from '@floating-ui/dom';
 import { useFloating, UseFloatingReturn } from '@floating-ui/vue';
 import { DropdownMenu } from '@vue-interface/dropdown-menu';
+import { ComponentSize } from '@vue-interface/sizeable';
 import { ComponentPublicInstance, computed, ComputedRef, Ref, ref, watchEffect, type EmitFn, type HTMLAttributes } from 'vue';
-type LiteralUnion<T extends U, U = string> = T | (U & Record<never, never>);
-export type BtnGroupSizes = 'btn-group-xs'
-    | 'btn-group-sm'
-    | 'btn-group-md'
-    | 'btn-group-lg'
-    | 'btn-group-xl'
-    | 'btn-group-2xl'
-    | 'btn-group-3xl'
-    | 'btn-group-4xl';
+export type BtnGroupSizePrefix = 'btn-group';
 export type BtnDropdownProps = {
     align?: Alignment;
@@ -26,7 +18,7 @@ export type BtnDropdownProps = {
     offset?: OffsetOptions,
     middleware?: Middleware[],
     side?: Side;
-    size?: LiteralUnion<BtnGroupSizes>;
+    size?: ComponentSize<BtnGroupSizePrefix>;
     split?: boolean;
     variant?: string;
 }
@@ -38,7 +30,7 @@ export type BtnDropdownEvents = {
     hide: []
 }
-export type BtnDropdownSlotProps = {
+export type BtnDropdownSlotProps = {
     target: (el: Element | ComponentPublicInstance | null) => void;
     expanded: boolean;
     onBlur: (e: FocusEvent) => void;
@@ -46,14 +38,14 @@ export type BtnDropdownSlotProps = {
 };
 export type UseDropdownHandler = {
-    target: Ref<Element|ComponentPublicInstance|null>;
-    menu: Ref<InstanceType<typeof DropdownMenu>|undefined>;
+    target: Ref<Element | ComponentPublicInstance | null>;
+    menu: Ref<InstanceType<typeof DropdownMenu> | undefined>;
     alignment: ComputedRef<Alignment>;
     expanded: Ref<boolean>;
     floatingStyles: UseFloatingReturn['floatingStyles'];
     placement: ComputedRef<Placement>;
     side: ComputedRef<Side>;
-    classes: ComputedRef<Record<string, boolean|undefined>>;
+    classes: ComputedRef<Record<string, boolean | undefined>>;
     buttonClasses: ComputedRef<Record<string, boolean>>;
     show: () => void;
     hide: () => void;
@@ -65,22 +57,22 @@ export type UseDropdownHandler = {
 }
 export function useDropdownHandler(props: BtnDropdownProps, emit: EmitFn<BtnDropdownEvents>): UseDropdownHandler {
-    const target = ref<Element|ComponentPublicInstance|null>(null);
+    const target = ref<Element | ComponentPublicInstance | null>(null);
     const menu = ref<InstanceType<typeof DropdownMenu>>();
     const expanded = ref(false);
     const alignment = computed<Alignment>(() => props.align ?? 'start');
     const side = computed<Side>(() => {
-        if(props.dropup) {
+        if (props.dropup) {
             return 'top';
         }
-        if(props.dropleft) {
+        if (props.dropleft) {
             return 'left';
         }
-        if(props.dropright) {
+        if (props.dropright) {
             return 'right';
         }
@@ -89,15 +81,15 @@ export function useDropdownHandler(props: BtnDropdownProps, emit: EmitFn<BtnDrop
     const placement = computed<Placement>(() => `${side.value}-${alignment.value}`);
-    const classes = computed<Record<string,boolean|undefined>>(() => ({
+    const classes = computed<Record<string, boolean | undefined>>(() => ({
         'dropdown': props.dropup && props.dropright && props.dropleft,
         'dropup': props.dropup,
         'dropright': props.dropright,
         'dropleft': props.dropleft,
         'expanded': expanded.value,
-        [props.size ?? '']: !!props.size,
+        [props.size as string]: !!props.size,
     }));
     const buttonClasses = computed(() => {
         const classes = {
             btn: true,
@@ -105,16 +97,16 @@ export function useDropdownHandler(props: BtnDropdownProps, emit: EmitFn<BtnDrop
             'btn-block': !!props.block,
             'no-caret': !props.caret
         };
-        if(typeof props.buttonClass === 'string') {
+        if (typeof props.buttonClass === 'string') {
             classes[props.buttonClass] = true;
         }
-        else if(Array.isArray(props.buttonClass)) {
-            for(const value of props.buttonClass) {
+        else if (Array.isArray(props.buttonClass)) {
+            for (const value of props.buttonClass) {
                 classes[value] = true;
             }
         }
-        else if(props.buttonClass) {
+        else if (props.buttonClass) {
             Object.assign(classes, props.buttonClass);
         }
@@ -132,7 +124,7 @@ export function useDropdownHandler(props: BtnDropdownProps, emit: EmitFn<BtnDrop
     function show() {
         expanded.value = true;
-        if(!target.value || !menu.value) {
+        if (!target.value || !menu.value) {
             return;
         }
@@ -144,7 +136,7 @@ export function useDropdownHandler(props: BtnDropdownProps, emit: EmitFn<BtnDrop
     function hide() {
         expanded.value = false;
-        if(target.value instanceof HTMLElement) {
+        if (target.value instanceof HTMLElement) {
             target.value?.blur();
         }
@@ -152,7 +144,7 @@ export function useDropdownHandler(props: BtnDropdownProps, emit: EmitFn<BtnDrop
     }
     function toggle() {
-        if(!expanded.value) {
+        if (!expanded.value) {
             show();
         }
         else {
@@ -163,23 +155,23 @@ export function useDropdownHandler(props: BtnDropdownProps, emit: EmitFn<BtnDrop
     function isFocusable(element: HTMLElement) {
         const nodes = Array.from(menu.value?.$el.querySelectorAll('label, input, select, textarea') ?? []);
-        for(const i in nodes) {
-            if(element === nodes[i]) {
+        for (const i in nodes) {
+            if (element === nodes[i]) {
                 return true;
             }
         }
         return false;
     }
     function onBlur(e: FocusEvent) {
-        if(!(e.relatedTarget instanceof HTMLElement) || !(target.value instanceof Element)) {
+        if (!(e.relatedTarget instanceof HTMLElement) || !(target.value instanceof Element)) {
             hide();
             return;
         }
-        if(menu.value && !menu.value?.$el.contains(e.relatedTarget) || !target.value?.contains(e.relatedTarget)) {
+        if (menu.value && !menu.value?.$el.contains(e.relatedTarget) || !target.value?.contains(e.relatedTarget)) {
             hide();
         }
     }
@@ -190,28 +182,28 @@ export function useDropdownHandler(props: BtnDropdownProps, emit: EmitFn<BtnDrop
     function onClickToggle(e: MouseEvent) {
         e.target?.dispatchEvent(new Event('focus', e));
         emit('clickToggle', e);
-        if(!e.defaultPrevented) {
+        if (!e.defaultPrevented) {
             toggle();
         }
     }
     function onClickItem(e: PointerEvent) {
-        if(!(e.target instanceof HTMLElement)) {
+        if (!(e.target instanceof HTMLElement)) {
             hide();
             return;
         }
-        if(!isFocusable(e.target) && !e.defaultPrevented) {
+        if (!isFocusable(e.target) && !e.defaultPrevented) {
             hide();
         }
     }
     watchEffect(() => {
-        if(expanded.value) {
+        if (expanded.value) {
             window.addEventListener('resize', update);
         }
         else {