primevue 3.27.0 → 3.28.0

package/skeleton/skeleton.esm.js

@@ -1,7 +1,9 @@
-import { openBlock, createElementBlock, normalizeStyle, normalizeClass } from 'vue';
+import BaseComponent from 'primevue/basecomponent';
+import { openBlock, createElementBlock, mergeProps } from 'vue';
 
 var script = {
     name: 'Skeleton',
+    extends: BaseComponent,
     props: {
         shape: {
             type: String,
@@ -46,11 +48,11 @@ var script = {
 };
 
 function render(_ctx, _cache, $props, $setup, $data, $options) {
-  return (openBlock(), createElementBlock("div", {
-    style: normalizeStyle($options.containerStyle),
-    class: normalizeClass($options.containerClass),
+  return (openBlock(), createElementBlock("div", mergeProps({
+    style: $options.containerStyle,
+    class: $options.containerClass,
     "aria-hidden": "true"
-  }, null, 6))
+  }, _ctx.ptm('root')), null, 16))
 }
 
 function styleInject(css, ref) {

package/skeleton/skeleton.esm.min.js

@@ -1 +1 @@
-import{openBlock as e,createElementBlock as t,normalizeStyle as n,normalizeClass as i}from"vue";var r={name:"Skeleton",props:{shape:{type:String,default:"rectangle"},size:{type:String,default:null},width:{type:String,default:"100%"},height:{type:String,default:"1rem"},borderRadius:{type:String,default:null},animation:{type:String,default:"wave"}},computed:{containerClass(){return["p-skeleton p-component",{"p-skeleton-circle":"circle"===this.shape,"p-skeleton-none":"none"===this.animation}]},containerStyle(){return this.size?{width:this.size,height:this.size,borderRadius:this.borderRadius}:{width:this.width,height:this.height,borderRadius:this.borderRadius}}}};!function(e,t){void 0===t&&(t={});var n=t.insertAt;if(e&&"undefined"!=typeof document){var i=document.head||document.getElementsByTagName("head")[0],r=document.createElement("style");r.type="text/css","top"===n&&i.firstChild?i.insertBefore(r,i.firstChild):i.appendChild(r),r.styleSheet?r.styleSheet.cssText=e:r.appendChild(document.createTextNode(e))}}("\n.p-skeleton {\n    position: relative;\n    overflow: hidden;\n}\n.p-skeleton::after {\n    content: '';\n    animation: p-skeleton-animation 1.2s infinite;\n    height: 100%;\n    left: 0;\n    position: absolute;\n    right: 0;\n    top: 0;\n    transform: translateX(-100%);\n    z-index: 1;\n}\n.p-skeleton.p-skeleton-circle {\n    border-radius: 50%;\n}\n.p-skeleton-none::after {\n    animation: none;\n}\n@keyframes p-skeleton-animation {\nfrom {\n        transform: translateX(-100%);\n}\nto {\n        transform: translateX(100%);\n}\n}\n"),r.render=function(r,a,o,s,l,d){return e(),t("div",{style:n(d.containerStyle),class:i(d.containerClass),"aria-hidden":"true"},null,6)};export{r as default};
+import e from"primevue/basecomponent";import{openBlock as t,createElementBlock as n,mergeProps as i}from"vue";var r={name:"Skeleton",extends:e,props:{shape:{type:String,default:"rectangle"},size:{type:String,default:null},width:{type:String,default:"100%"},height:{type:String,default:"1rem"},borderRadius:{type:String,default:null},animation:{type:String,default:"wave"}},computed:{containerClass(){return["p-skeleton p-component",{"p-skeleton-circle":"circle"===this.shape,"p-skeleton-none":"none"===this.animation}]},containerStyle(){return this.size?{width:this.size,height:this.size,borderRadius:this.borderRadius}:{width:this.width,height:this.height,borderRadius:this.borderRadius}}}};!function(e,t){void 0===t&&(t={});var n=t.insertAt;if(e&&"undefined"!=typeof document){var i=document.head||document.getElementsByTagName("head")[0],r=document.createElement("style");r.type="text/css","top"===n&&i.firstChild?i.insertBefore(r,i.firstChild):i.appendChild(r),r.styleSheet?r.styleSheet.cssText=e:r.appendChild(document.createTextNode(e))}}("\n.p-skeleton {\n    position: relative;\n    overflow: hidden;\n}\n.p-skeleton::after {\n    content: '';\n    animation: p-skeleton-animation 1.2s infinite;\n    height: 100%;\n    left: 0;\n    position: absolute;\n    right: 0;\n    top: 0;\n    transform: translateX(-100%);\n    z-index: 1;\n}\n.p-skeleton.p-skeleton-circle {\n    border-radius: 50%;\n}\n.p-skeleton-none::after {\n    animation: none;\n}\n@keyframes p-skeleton-animation {\nfrom {\n        transform: translateX(-100%);\n}\nto {\n        transform: translateX(100%);\n}\n}\n"),r.render=function(e,r,o,a,s,l){return t(),n("div",i({style:l.containerStyle,class:l.containerClass,"aria-hidden":"true"},e.ptm("root")),null,16)};export{r as default};

package/skeleton/skeleton.js

@@ -1,9 +1,14 @@
 this.primevue = this.primevue || {};
-this.primevue.skeleton = (function (vue) {
+this.primevue.skeleton = (function (BaseComponent, vue) {
     'use strict';
 
+    function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+    var BaseComponent__default = /*#__PURE__*/_interopDefaultLegacy(BaseComponent);
+
     var script = {
         name: 'Skeleton',
+        extends: BaseComponent__default["default"],
         props: {
             shape: {
                 type: String,
@@ -48,11 +53,11 @@ this.primevue.skeleton = (function (vue) {
     };
 
     function render(_ctx, _cache, $props, $setup, $data, $options) {
-      return (vue.openBlock(), vue.createElementBlock("div", {
-        style: vue.normalizeStyle($options.containerStyle),
-        class: vue.normalizeClass($options.containerClass),
+      return (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
+        style: $options.containerStyle,
+        class: $options.containerClass,
         "aria-hidden": "true"
-      }, null, 6))
+      }, _ctx.ptm('root')), null, 16))
     }
 
     function styleInject(css, ref) {
@@ -89,4 +94,4 @@ this.primevue.skeleton = (function (vue) {
 
     return script;
 
-})(Vue);
+})(primevue.basecomponent, Vue);

package/skeleton/skeleton.min.js

@@ -1 +1 @@
-this.primevue=this.primevue||{},this.primevue.skeleton=function(e){"use strict";var t={name:"Skeleton",props:{shape:{type:String,default:"rectangle"},size:{type:String,default:null},width:{type:String,default:"100%"},height:{type:String,default:"1rem"},borderRadius:{type:String,default:null},animation:{type:String,default:"wave"}},computed:{containerClass(){return["p-skeleton p-component",{"p-skeleton-circle":"circle"===this.shape,"p-skeleton-none":"none"===this.animation}]},containerStyle(){return this.size?{width:this.size,height:this.size,borderRadius:this.borderRadius}:{width:this.width,height:this.height,borderRadius:this.borderRadius}}}};return function(e,t){void 0===t&&(t={});var n=t.insertAt;if(e&&"undefined"!=typeof document){var i=document.head||document.getElementsByTagName("head")[0],r=document.createElement("style");r.type="text/css","top"===n&&i.firstChild?i.insertBefore(r,i.firstChild):i.appendChild(r),r.styleSheet?r.styleSheet.cssText=e:r.appendChild(document.createTextNode(e))}}("\n.p-skeleton {\n    position: relative;\n    overflow: hidden;\n}\n.p-skeleton::after {\n    content: '';\n    animation: p-skeleton-animation 1.2s infinite;\n    height: 100%;\n    left: 0;\n    position: absolute;\n    right: 0;\n    top: 0;\n    transform: translateX(-100%);\n    z-index: 1;\n}\n.p-skeleton.p-skeleton-circle {\n    border-radius: 50%;\n}\n.p-skeleton-none::after {\n    animation: none;\n}\n@keyframes p-skeleton-animation {\nfrom {\n        transform: translateX(-100%);\n}\nto {\n        transform: translateX(100%);\n}\n}\n"),t.render=function(t,n,i,r,s,o){return e.openBlock(),e.createElementBlock("div",{style:e.normalizeStyle(o.containerStyle),class:e.normalizeClass(o.containerClass),"aria-hidden":"true"},null,6)},t}(Vue);
+this.primevue=this.primevue||{},this.primevue.skeleton=function(e,t){"use strict";function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var i={name:"Skeleton",extends:n(e).default,props:{shape:{type:String,default:"rectangle"},size:{type:String,default:null},width:{type:String,default:"100%"},height:{type:String,default:"1rem"},borderRadius:{type:String,default:null},animation:{type:String,default:"wave"}},computed:{containerClass(){return["p-skeleton p-component",{"p-skeleton-circle":"circle"===this.shape,"p-skeleton-none":"none"===this.animation}]},containerStyle(){return this.size?{width:this.size,height:this.size,borderRadius:this.borderRadius}:{width:this.width,height:this.height,borderRadius:this.borderRadius}}}};return function(e,t){void 0===t&&(t={});var n=t.insertAt;if(e&&"undefined"!=typeof document){var i=document.head||document.getElementsByTagName("head")[0],r=document.createElement("style");r.type="text/css","top"===n&&i.firstChild?i.insertBefore(r,i.firstChild):i.appendChild(r),r.styleSheet?r.styleSheet.cssText=e:r.appendChild(document.createTextNode(e))}}("\n.p-skeleton {\n    position: relative;\n    overflow: hidden;\n}\n.p-skeleton::after {\n    content: '';\n    animation: p-skeleton-animation 1.2s infinite;\n    height: 100%;\n    left: 0;\n    position: absolute;\n    right: 0;\n    top: 0;\n    transform: translateX(-100%);\n    z-index: 1;\n}\n.p-skeleton.p-skeleton-circle {\n    border-radius: 50%;\n}\n.p-skeleton-none::after {\n    animation: none;\n}\n@keyframes p-skeleton-animation {\nfrom {\n        transform: translateX(-100%);\n}\nto {\n        transform: translateX(100%);\n}\n}\n"),i.render=function(e,n,i,r,o,s){return t.openBlock(),t.createElementBlock("div",t.mergeProps({style:s.containerStyle,class:s.containerClass,"aria-hidden":"true"},e.ptm("root")),null,16)},i}(primevue.basecomponent,Vue);

package/speeddial/SpeedDial.d.ts

@@ -8,9 +8,105 @@
  *
  */
 import { VNode } from 'vue';
+import { ButtonPassThroughOptions } from '../button';
 import { MenuItem } from '../menuitem';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
+export declare type SpeedDialPassThroughOptionType = SpeedDialPassThroughAttributes | ((options: SpeedDialPassThroughMethodOptions) => SpeedDialPassThroughAttributes) | null | undefined;
+
+/**
+ * Custom passthrough(pt) option method.
+ */
+export interface SpeedDialPassThroughMethodOptions {
+    props: SpeedDialProps;
+    state: SpeedDialState;
+    context: SpeedDialContext;
+}
+
+/**
+ * Custom passthrough(pt) options.
+ * @see {@link SpeedDialProps.pt}
+ */
+export interface SpeedDialPassThroughOptions {
+    /**
+     * Uses to pass attributes to the root's DOM element.
+     */
+    root?: SpeedDialPassThroughOptionType;
+    /**
+     * Uses to pass attributes to the Button component.
+     *  @see {@link ButtonPassThroughOptions}
+     */
+    button?: ButtonPassThroughOptions;
+    /**
+     * Uses to pass attributes to the menu's DOM element.
+     */
+    menu?: SpeedDialPassThroughOptionType;
+    /**
+     * Uses to pass attributes to the menu item's DOM element.
+     */
+    menuitem?: SpeedDialPassThroughOptionType;
+    /**
+     * Uses to pass attributes to the action's DOM element.
+     */
+    action?: SpeedDialPassThroughOptionType;
+    /**
+     * Uses to pass attributes to the action icon's DOM element.
+     */
+    actionIcon?: SpeedDialPassThroughOptionType;
+    /**
+     * Uses to pass attributes to the mask's DOM element.
+     */
+    mask?: SpeedDialPassThroughOptionType;
+}
+
+/**
+ * Custom passthrough attributes for each DOM elements
+ */
+export interface SpeedDialPassThroughAttributes {
+    [key: string]: any;
+}
+
+/**
+ * Defines current inline state in SpeedDial component.
+ */
+export interface SpeedDialState {
+    /**
+     * List of items' id.
+     */
+    id: string;
+    /**
+     * Current visible state as a boolean.
+     * @defaultValue false
+     */
+    visible: boolean;
+    /**
+     * Current click state of component as a boolean.
+     * @defaultValue false
+     */
+    isItemClicked: boolean;
+    /**
+     * Current focus state as a boolean.
+     * @defaultValue false
+     */
+    focused: boolean;
+    /**
+     * Current focused option index as a number.
+     * @defaultValue -1
+     */
+    focusedOptionIndex: number;
+}
+
+/**
+ * Defines current options in SpeedDial component.
+ */
+export interface SpeedDialContext {
+    /**
+     * Current active state of menuitem as a boolean.
+     * @defaultValue false
+     */
+    active: boolean;
+}
+
 /**
  * Defines tooltip options.
  * @see {@link SpeedDialProps.tooltipOptions}
@@ -127,6 +223,11 @@ export interface SpeedDialProps {
      * Identifier of the underlying list element.
      */
     'aria-labelledby'?: string | undefined;
+    /**
+     * Uses to pass attributes to DOM elements inside the component.
+     * @type {SpeedDialPassThroughOptions}
+     */
+    pt?: SpeedDialPassThroughOptions;
 }
 
 /**

package/speeddial/SpeedDial.vue

@@ -1,5 +1,5 @@
 <template>
-    <div :ref="containerRef" :class="containerClass" :style="style">
+    <div :ref="containerRef" :class="containerClass" :style="style" v-bind="ptm('root')">
         <slot name="button" :toggle="onClick">
             <SDButton
                 type="button"
@@ -12,18 +12,28 @@
                 :aria-controls="id + '_list'"
                 :aria-label="ariaLabel"
                 :aria-labelledby="ariaLabelledby"
+                :pt="ptm('button')"
             >
                 <template #icon>
                     <slot name="icon" :visible="d_visible">
-                        <component v-if="d_visible && !!hideIcon" :is="hideIcon ? 'span' : 'PlusIcon'" :class="hideIcon" />
-                        <component v-else :is="showIcon ? 'span' : 'PlusIcon'" :class="showIcon" />
+                        <component v-if="d_visible && !!hideIcon" :is="hideIcon ? 'span' : 'PlusIcon'" :class="hideIcon" v-bind="ptm('button')['icon']" />
+                        <component v-else :is="showIcon ? 'span' : 'PlusIcon'" :class="showIcon" v-bind="ptm('button')['icon']" />
                     </slot>
                 </template>
             </SDButton>
         </slot>
-        <ul :ref="listRef" :id="id + '_list'" class="p-speeddial-list" role="menu" @focus="onFocus" @blur="onBlur" @keydown="onKeyDown" :aria-activedescendant="focused ? focusedOptionId : undefined" tabindex="-1">
+        <ul :ref="listRef" :id="id + '_list'" class="p-speeddial-list" role="menu" @focus="onFocus" @blur="onBlur" @keydown="onKeyDown" :aria-activedescendant="focused ? focusedOptionId : undefined" tabindex="-1" v-bind="ptm('menu')">
             <template v-for="(item, index) of model" :key="index">
-                <li v-if="isItemVisible(item)" :id="`${id}_${index}`" :aria-controls="`${id}_item`" class="p-speeddial-item" :class="itemClass(`${id}_${index}`)" :style="getItemStyle(index)" role="menuitem">
+                <li
+                    v-if="isItemVisible(item)"
+                    :id="`${id}_${index}`"
+                    :aria-controls="`${id}_item`"
+                    class="p-speeddial-item"
+                    :class="itemClass(`${id}_${index}`)"
+                    :style="getItemStyle(index)"
+                    role="menuitem"
+                    v-bind="getPTOptions(`${id}_${index}`, 'menuitem')"
+                >
                     <template v-if="!$slots.item">
                         <a
                             v-tooltip:[tooltipOptions]="{ value: item.label, disabled: !tooltipOptions }"
@@ -35,8 +45,9 @@
                             :target="item.target"
                             @click="onItemClick($event, item)"
                             :aria-label="item.label"
+                            v-bind="getPTOptions(`${id}_${index}`, 'action')"
                         >
-                            <span v-if="item.icon" :class="['p-speeddial-action-icon', item.icon]"></span>
+                            <span v-if="item.icon" :class="['p-speeddial-action-icon', item.icon]" v-bind="getPTOptions(`${id}_${index}`, 'actionIcon')"></span>
                         </a>
                     </template>
                     <component v-else :is="$slots.item" :item="item"></component>
@@ -45,11 +56,12 @@
         </ul>
     </div>
     <template v-if="mask">
-        <div :class="maskClassName" :style="maskStyle"></div>
+        <div :class="maskClassName" :style="maskStyle" v-bind="ptm('mask')"></div>
     </template>
 </template>
 
 <script>
+import BaseComponent from 'primevue/basecomponent';
 import Button from 'primevue/button';
 import PlusIcon from 'primevue/icons/plus';
 import Ripple from 'primevue/ripple';
@@ -58,6 +70,7 @@ import { DomHandler, UniqueComponentId } from 'primevue/utils';
 
 export default {
     name: 'SpeedDial',
+    extends: BaseComponent,
     emits: ['click', 'show', 'hide', 'focus', 'blur'],
     props: {
         model: null,
@@ -164,6 +177,13 @@ export default {
         this.unbindDocumentClickListener();
     },
     methods: {
+        getPTOptions(id, key) {
+            return this.ptm(key, {
+                context: {
+                    active: this.isItemActive(id)
+                }
+            });
+        },
         onFocus(event) {
             this.focused = true;
 
@@ -484,6 +504,9 @@ export default {
         isItemVisible(item) {
             return typeof item.visible === 'function' ? item.visible() : item.visible !== false;
         },
+        isItemActive(id) {
+            return id === this.focusedOptionId;
+        },
         containerRef(el) {
             this.container = el;
         },
@@ -493,7 +516,7 @@ export default {
         itemClass(id) {
             return [
                 {
-                    'p-focus': id === this.focusedOptionId
+                    'p-focus': this.isItemActive(id)
                 }
             ];
         }

package/speeddial/speeddial.cjs.js

@@ -1,5 +1,6 @@
 'use strict';
 
+var BaseComponent = require('primevue/basecomponent');
 var Button = require('primevue/button');
 var PlusIcon = require('primevue/icons/plus');
 var Ripple = require('primevue/ripple');
@@ -9,6 +10,7 @@ var vue = require('vue');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
+var BaseComponent__default = /*#__PURE__*/_interopDefaultLegacy(BaseComponent);
 var Button__default = /*#__PURE__*/_interopDefaultLegacy(Button);
 var PlusIcon__default = /*#__PURE__*/_interopDefaultLegacy(PlusIcon);
 var Ripple__default = /*#__PURE__*/_interopDefaultLegacy(Ripple);
@@ -16,6 +18,7 @@ var Tooltip__default = /*#__PURE__*/_interopDefaultLegacy(Tooltip);
 
 var script = {
     name: 'SpeedDial',
+    extends: BaseComponent__default["default"],
     emits: ['click', 'show', 'hide', 'focus', 'blur'],
     props: {
         model: null,
@@ -122,6 +125,13 @@ var script = {
         this.unbindDocumentClickListener();
     },
     methods: {
+        getPTOptions(id, key) {
+            return this.ptm(key, {
+                context: {
+                    active: this.isItemActive(id)
+                }
+            });
+        },
         onFocus(event) {
             this.focused = true;
 
@@ -436,6 +446,9 @@ var script = {
         isItemVisible(item) {
             return typeof item.visible === 'function' ? item.visible() : item.visible !== false;
         },
+        isItemActive(id) {
+            return id === this.focusedOptionId;
+        },
         containerRef(el) {
             this.container = el;
         },
@@ -445,7 +458,7 @@ var script = {
         itemClass(id) {
             return [
                 {
-                    'p-focus': id === this.focusedOptionId
+                    'p-focus': this.isItemActive(id)
                 }
             ];
         }
@@ -504,11 +517,11 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
   const _directive_ripple = vue.resolveDirective("ripple");
 
   return (vue.openBlock(), vue.createElementBlock(vue.Fragment, null, [
-    vue.createElementVNode("div", {
+    vue.createElementVNode("div", vue.mergeProps({
       ref: $options.containerRef,
-      class: vue.normalizeClass($options.containerClass),
-      style: vue.normalizeStyle($props.style)
-    }, [
+      class: $options.containerClass,
+      style: $props.style
+    }, _ctx.ptm('root')), [
       vue.renderSlot(_ctx.$slots, "button", { toggle: $options.onClick }, () => [
         vue.createVNode(_component_SDButton, {
           type: "button",
@@ -520,25 +533,26 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
           "aria-haspopup": true,
           "aria-controls": $data.id + '_list',
           "aria-label": _ctx.ariaLabel,
-          "aria-labelledby": _ctx.ariaLabelledby
+          "aria-labelledby": _ctx.ariaLabelledby,
+          pt: _ctx.ptm('button')
         }, {
           icon: vue.withCtx(() => [
             vue.renderSlot(_ctx.$slots, "icon", { visible: $data.d_visible }, () => [
               ($data.d_visible && !!$props.hideIcon)
-                ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.hideIcon ? 'span' : 'PlusIcon'), {
+                ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.hideIcon ? 'span' : 'PlusIcon'), vue.mergeProps({
                     key: 0,
-                    class: vue.normalizeClass($props.hideIcon)
-                  }, null, 8, ["class"]))
-                : (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.showIcon ? 'span' : 'PlusIcon'), {
+                    class: $props.hideIcon
+                  }, _ctx.ptm('button')['icon']), null, 16, ["class"]))
+                : (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.showIcon ? 'span' : 'PlusIcon'), vue.mergeProps({
                     key: 1,
-                    class: vue.normalizeClass($props.showIcon)
-                  }, null, 8, ["class"]))
+                    class: $props.showIcon
+                  }, _ctx.ptm('button')['icon']), null, 16, ["class"]))
             ])
           ]),
           _: 3
-        }, 8, ["class", "disabled", "onKeydown", "aria-expanded", "aria-controls", "aria-label", "aria-labelledby"])
+        }, 8, ["class", "disabled", "onKeydown", "aria-expanded", "aria-controls", "aria-label", "aria-labelledby", "pt"])
       ]),
-      vue.createElementVNode("ul", {
+      vue.createElementVNode("ul", vue.mergeProps({
         ref: $options.listRef,
         id: $data.id + '_list',
         class: "p-speeddial-list",
@@ -548,36 +562,36 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
         onKeydown: _cache[3] || (_cache[3] = (...args) => ($options.onKeyDown && $options.onKeyDown(...args))),
         "aria-activedescendant": $data.focused ? $options.focusedOptionId : undefined,
         tabindex: "-1"
-      }, [
+      }, _ctx.ptm('menu')), [
         (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList($props.model, (item, index) => {
           return (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: index }, [
             ($options.isItemVisible(item))
-              ? (vue.openBlock(), vue.createElementBlock("li", {
+              ? (vue.openBlock(), vue.createElementBlock("li", vue.mergeProps({
                   key: 0,
                   id: `${$data.id}_${index}`,
                   "aria-controls": `${$data.id}_item`,
-                  class: vue.normalizeClass(["p-speeddial-item", $options.itemClass(`${$data.id}_${index}`)]),
-                  style: vue.normalizeStyle($options.getItemStyle(index)),
+                  class: ["p-speeddial-item", $options.itemClass(`${$data.id}_${index}`)],
+                  style: $options.getItemStyle(index),
                   role: "menuitem"
-                }, [
+                }, $options.getPTOptions(`${$data.id}_${index}`, 'menuitem')), [
                   (!_ctx.$slots.item)
-                    ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("a", {
+                    ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("a", vue.mergeProps({
                         key: 0,
                         tabindex: -1,
                         href: item.url || '#',
                         role: "menuitem",
-                        class: vue.normalizeClass(['p-speeddial-action', { 'p-disabled': item.disabled }]),
+                        class: ['p-speeddial-action', { 'p-disabled': item.disabled }],
                         target: item.target,
                         onClick: $event => ($options.onItemClick($event, item)),
                         "aria-label": item.label
-                      }, [
+                      }, $options.getPTOptions(`${$data.id}_${index}`, 'action')), [
                         (item.icon)
-                          ? (vue.openBlock(), vue.createElementBlock("span", {
+                          ? (vue.openBlock(), vue.createElementBlock("span", vue.mergeProps({
                               key: 0,
-                              class: vue.normalizeClass(['p-speeddial-action-icon', item.icon])
-                            }, null, 2))
+                              class: ['p-speeddial-action-icon', item.icon]
+                            }, $options.getPTOptions(`${$data.id}_${index}`, 'actionIcon')), null, 16))
                           : vue.createCommentVNode("", true)
-                      ], 10, _hoisted_3)), [
+                      ], 16, _hoisted_3)), [
                         [_directive_tooltip, { value: item.label, disabled: !$props.tooltipOptions }, $props.tooltipOptions],
                         [_directive_ripple]
                       ])
@@ -585,18 +599,18 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                         key: 1,
                         item: item
                       }, null, 8, ["item"]))
-                ], 14, _hoisted_2))
+                ], 16, _hoisted_2))
               : vue.createCommentVNode("", true)
           ], 64))
         }), 128))
-      ], 40, _hoisted_1)
-    ], 6),
+      ], 16, _hoisted_1)
+    ], 16),
     ($props.mask)
-      ? (vue.openBlock(), vue.createElementBlock("div", {
+      ? (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
           key: 0,
-          class: vue.normalizeClass($options.maskClassName),
-          style: vue.normalizeStyle($props.maskStyle)
-        }, null, 6))
+          class: $options.maskClassName,
+          style: $props.maskStyle
+        }, _ctx.ptm('mask')), null, 16))
       : vue.createCommentVNode("", true)
   ], 64))
 }

package/speeddial/speeddial.cjs.min.js

@@ -1 +1 @@
-"use strict";var e=require("primevue/button"),t=require("primevue/icons/plus"),i=require("primevue/ripple"),n=require("primevue/tooltip"),s=require("primevue/utils"),o=require("vue");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var a=l(e),r=l(t),d=l(i),c=l(n),p={name:"SpeedDial",emits:["click","show","hide","focus","blur"],props:{model:null,visible:{type:Boolean,default:!1},direction:{type:String,default:"up"},transitionDelay:{type:Number,default:30},type:{type:String,default:"linear"},radius:{type:Number,default:0},mask:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},hideOnClickOutside:{type:Boolean,default:!0},buttonClass:null,maskStyle:null,maskClass:null,showIcon:{type:String,default:void 0},hideIcon:{type:String,default:void 0},rotateAnimation:{type:Boolean,default:!0},tooltipOptions:null,style:null,class:null,"aria-labelledby":{type:String,default:null},"aria-label":{type:String,default:null}},documentClickListener:null,container:null,list:null,data(){return{id:this.$attrs.id,d_visible:this.visible,isItemClicked:!1,focused:!1,focusedOptionIndex:-1}},watch:{"$attrs.id":function(e){this.id=e||s.UniqueComponentId()},visible(e){this.d_visible=e}},mounted(){if(this.id=this.id||s.UniqueComponentId(),"linear"!==this.type){const e=s.DomHandler.findSingle(this.container,".p-speeddial-button"),t=s.DomHandler.findSingle(this.list,".p-speeddial-item");if(e&&t){const i=Math.abs(e.offsetWidth-t.offsetWidth),n=Math.abs(e.offsetHeight-t.offsetHeight);this.list.style.setProperty("--item-diff-x",i/2+"px"),this.list.style.setProperty("--item-diff-y",n/2+"px")}}this.hideOnClickOutside&&this.bindDocumentClickListener()},beforeMount(){this.unbindDocumentClickListener()},methods:{onFocus(e){this.focused=!0,this.$emit("focus",e)},onBlur(e){this.focused=!1,this.focusedOptionIndex=-1,this.$emit("blur",e)},onItemClick(e,t){t.command&&t.command({originalEvent:e,item:t}),this.hide(),this.isItemClicked=!0,e.preventDefault()},onClick(e){this.d_visible?this.hide():this.show(),this.isItemClicked=!0,this.$emit("click",e)},show(){this.d_visible=!0,this.$emit("show")},hide(){this.d_visible=!1,this.$emit("hide")},calculateTransitionDelay(e){const t=this.model.length;return(this.d_visible?e:t-e-1)*this.transitionDelay},onTogglerKeydown(e){switch(e.code){case"ArrowDown":case"ArrowLeft":this.onTogglerArrowDown(e);break;case"ArrowUp":case"ArrowRight":this.onTogglerArrowUp(e);break;case"Escape":this.onEscapeKey()}},onKeyDown(e){switch(e.code){case"ArrowDown":this.onArrowDown(e);break;case"ArrowUp":this.onArrowUp(e);break;case"ArrowLeft":this.onArrowLeft(e);break;case"ArrowRight":this.onArrowRight(e);break;case"Enter":case"Space":this.onEnterKey(e);break;case"Escape":this.onEscapeKey(e);break;case"Home":this.onHomeKey(e);break;case"End":this.onEndKey(e)}},onTogglerArrowUp(e){this.focused=!0,s.DomHandler.focus(this.list),this.show(),this.navigatePrevItem(e),e.preventDefault()},onTogglerArrowDown(e){this.focused=!0,s.DomHandler.focus(this.list),this.show(),this.navigateNextItem(e),e.preventDefault()},onEnterKey(e){const t=[...s.DomHandler.find(this.container,".p-speeddial-item")].findIndex((e=>e.id===this.focusedOptionIndex));this.onItemClick(e,this.model[t]),this.onBlur(e);const i=s.DomHandler.findSingle(this.container,"button");i&&s.DomHandler.focus(i)},onEscapeKey(){this.hide();const e=s.DomHandler.findSingle(this.container,"button");e&&s.DomHandler.focus(e)},onArrowUp(e){"up"===this.direction?this.navigateNextItem(e):"down"===this.direction?this.navigatePrevItem(e):this.navigateNextItem(e)},onArrowDown(e){"up"===this.direction?this.navigatePrevItem(e):"down"===this.direction?this.navigateNextItem(e):this.navigatePrevItem(e)},onArrowLeft(e){["left","up-right","down-left"].includes(this.direction)?this.navigateNextItem(e):(["right","up-left","down-right"].includes(this.direction),this.navigatePrevItem(e))},onArrowRight(e){["left","up-right","down-left"].includes(this.direction)?this.navigatePrevItem(e):(["right","up-left","down-right"].includes(this.direction),this.navigateNextItem(e))},onEndKey(e){e.preventDefault(),this.focusedOptionIndex=-1,this.navigatePrevItem(e)},onHomeKey(e){e.preventDefault(),this.focusedOptionIndex=-1,this.navigateNextItem(e)},navigateNextItem(e){const t=this.findNextOptionIndex(this.focusedOptionIndex);this.changeFocusedOptionIndex(t),e.preventDefault()},navigatePrevItem(e){const t=this.findPrevOptionIndex(this.focusedOptionIndex);this.changeFocusedOptionIndex(t),e.preventDefault()},changeFocusedOptionIndex(e){const t=[...s.DomHandler.find(this.container,".p-speeddial-item")].filter((e=>!s.DomHandler.hasClass(s.DomHandler.findSingle(e,"a"),"p-disabled")));t[e]&&(this.focusedOptionIndex=t[e].getAttribute("id"))},findPrevOptionIndex(e){const t=[...s.DomHandler.find(this.container,".p-speeddial-item")].filter((e=>!s.DomHandler.hasClass(s.DomHandler.findSingle(e,"a"),"p-disabled"))),i=-1===e?t[t.length-1].id:e;let n=t.findIndex((e=>e.getAttribute("id")===i));return n=-1===e?t.length-1:n-1,n},findNextOptionIndex(e){const t=[...s.DomHandler.find(this.container,".p-speeddial-item")].filter((e=>!s.DomHandler.hasClass(s.DomHandler.findSingle(e,"a"),"p-disabled"))),i=-1===e?t[0].id:e;let n=t.findIndex((e=>e.getAttribute("id")===i));return n=-1===e?0:n+1,n},calculatePointStyle(e){const t=this.type;if("linear"!==t){const i=this.model.length,n=this.radius||20*i;if("circle"===t){const t=2*Math.PI/i;return{left:`calc(${n*Math.cos(t*e)}px + var(--item-diff-x, 0px))`,top:`calc(${n*Math.sin(t*e)}px + var(--item-diff-y, 0px))`}}if("semi-circle"===t){const t=this.direction,s=Math.PI/(i-1),o=`calc(${n*Math.cos(s*e)}px + var(--item-diff-x, 0px))`,l=`calc(${n*Math.sin(s*e)}px + var(--item-diff-y, 0px))`;if("up"===t)return{left:o,bottom:l};if("down"===t)return{left:o,top:l};if("left"===t)return{right:l,top:o};if("right"===t)return{left:l,top:o}}else if("quarter-circle"===t){const t=this.direction,s=Math.PI/(2*(i-1)),o=`calc(${n*Math.cos(s*e)}px + var(--item-diff-x, 0px))`,l=`calc(${n*Math.sin(s*e)}px + var(--item-diff-y, 0px))`;if("up-left"===t)return{right:o,bottom:l};if("up-right"===t)return{left:o,bottom:l};if("down-left"===t)return{right:l,top:o};if("down-right"===t)return{left:l,top:o}}}return{}},getItemStyle(e){return{transitionDelay:`${this.calculateTransitionDelay(e)}ms`,...this.calculatePointStyle(e)}},bindDocumentClickListener(){this.documentClickListener||(this.documentClickListener=e=>{this.d_visible&&this.isOutsideClicked(e)&&this.hide(),this.isItemClicked=!1},document.addEventListener("click",this.documentClickListener))},unbindDocumentClickListener(){this.documentClickListener&&(document.removeEventListener("click",this.documentClickListener),this.documentClickListener=null)},isOutsideClicked(e){return this.container&&!(this.container.isSameNode(e.target)||this.container.contains(e.target)||this.isItemClicked)},isItemVisible:e=>"function"==typeof e.visible?e.visible():!1!==e.visible,containerRef(e){this.container=e},listRef(e){this.list=e},itemClass(e){return[{"p-focus":e===this.focusedOptionId}]}},computed:{containerClass(){return[`p-speeddial p-component p-speeddial-${this.type}`,{[`p-speeddial-direction-${this.direction}`]:"circle"!==this.type,"p-speeddial-opened":this.d_visible,"p-disabled":this.disabled},this.class]},buttonClassName(){return["p-speeddial-button p-button-rounded",{"p-speeddial-rotate":this.rotateAnimation&&!this.hideIcon},this.buttonClass]},maskClassName(){return["p-speeddial-mask",{"p-speeddial-mask-visible":this.d_visible},this.maskClass]},focusedOptionId(){return-1!==this.focusedOptionIndex?this.focusedOptionIndex:null}},components:{SDButton:a.default,PlusIcon:r.default},directives:{ripple:d.default,tooltip:c.default}};const u=["id","aria-activedescendant"],h=["id","aria-controls"],m=["href","target","onClick","aria-label"];!function(e,t){void 0===t&&(t={});var i=t.insertAt;if(e&&"undefined"!=typeof document){var n=document.head||document.getElementsByTagName("head")[0],s=document.createElement("style");s.type="text/css","top"===i&&n.firstChild?n.insertBefore(s,n.firstChild):n.appendChild(s),s.styleSheet?s.styleSheet.cssText=e:s.appendChild(document.createTextNode(e))}}("\n.p-speeddial {\n    position: absolute;\n    display: flex;\n}\n.p-speeddial-button {\n    z-index: 1;\n}\n.p-speeddial-list {\n    margin: 0;\n    padding: 0;\n    list-style: none;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    transition: top 0s linear 0.2s;\n    pointer-events: none;\n    z-index: 2;\n}\n.p-speeddial-item {\n    transform: scale(0);\n    opacity: 0;\n    transition: transform 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, opacity 0.8s;\n    will-change: transform;\n}\n.p-speeddial-action {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    border-radius: 50%;\n    position: relative;\n    overflow: hidden;\n}\n.p-speeddial-circle .p-speeddial-item,\n.p-speeddial-semi-circle .p-speeddial-item,\n.p-speeddial-quarter-circle .p-speeddial-item {\n    position: absolute;\n}\n.p-speeddial-rotate {\n    transition: transform 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n    will-change: transform;\n}\n.p-speeddial-mask {\n    position: absolute;\n    left: 0;\n    top: 0;\n    width: 100%;\n    height: 100%;\n    opacity: 0;\n    transition: opacity 250ms cubic-bezier(0.25, 0.8, 0.25, 1);\n}\n.p-speeddial-mask-visible {\n    pointer-events: none;\n    opacity: 1;\n    transition: opacity 400ms cubic-bezier(0.25, 0.8, 0.25, 1);\n}\n.p-speeddial-opened .p-speeddial-list {\n    pointer-events: auto;\n}\n.p-speeddial-opened .p-speeddial-item {\n    transform: scale(1);\n    opacity: 1;\n}\n.p-speeddial-opened .p-speeddial-rotate {\n    transform: rotate(45deg);\n}\n\n/* Direction */\n.p-speeddial-direction-up {\n    align-items: center;\n    flex-direction: column-reverse;\n}\n.p-speeddial-direction-up .p-speeddial-list {\n    flex-direction: column-reverse;\n}\n.p-speeddial-direction-down {\n    align-items: center;\n    flex-direction: column;\n}\n.p-speeddial-direction-down .p-speeddial-list {\n    flex-direction: column;\n}\n.p-speeddial-direction-left {\n    justify-content: center;\n    flex-direction: row-reverse;\n}\n.p-speeddial-direction-left .p-speeddial-list {\n    flex-direction: row-reverse;\n}\n.p-speeddial-direction-right {\n    justify-content: center;\n    flex-direction: row;\n}\n.p-speeddial-direction-right .p-speeddial-list {\n    flex-direction: row;\n}\n"),p.render=function(e,t,i,n,s,l){const a=o.resolveComponent("SDButton"),r=o.resolveDirective("tooltip"),d=o.resolveDirective("ripple");return o.openBlock(),o.createElementBlock(o.Fragment,null,[o.createElementVNode("div",{ref:l.containerRef,class:o.normalizeClass(l.containerClass),style:o.normalizeStyle(i.style)},[o.renderSlot(e.$slots,"button",{toggle:l.onClick},(()=>[o.createVNode(a,{type:"button",class:o.normalizeClass(l.buttonClassName),onClick:t[0]||(t[0]=e=>l.onClick(e)),disabled:i.disabled,onKeydown:l.onTogglerKeydown,"aria-expanded":s.d_visible,"aria-haspopup":!0,"aria-controls":s.id+"_list","aria-label":e.ariaLabel,"aria-labelledby":e.ariaLabelledby},{icon:o.withCtx((()=>[o.renderSlot(e.$slots,"icon",{visible:s.d_visible},(()=>[s.d_visible&&i.hideIcon?(o.openBlock(),o.createBlock(o.resolveDynamicComponent(i.hideIcon?"span":"PlusIcon"),{key:0,class:o.normalizeClass(i.hideIcon)},null,8,["class"])):(o.openBlock(),o.createBlock(o.resolveDynamicComponent(i.showIcon?"span":"PlusIcon"),{key:1,class:o.normalizeClass(i.showIcon)},null,8,["class"]))]))])),_:3},8,["class","disabled","onKeydown","aria-expanded","aria-controls","aria-label","aria-labelledby"])])),o.createElementVNode("ul",{ref:l.listRef,id:s.id+"_list",class:"p-speeddial-list",role:"menu",onFocus:t[1]||(t[1]=(...e)=>l.onFocus&&l.onFocus(...e)),onBlur:t[2]||(t[2]=(...e)=>l.onBlur&&l.onBlur(...e)),onKeydown:t[3]||(t[3]=(...e)=>l.onKeyDown&&l.onKeyDown(...e)),"aria-activedescendant":s.focused?l.focusedOptionId:void 0,tabindex:"-1"},[(o.openBlock(!0),o.createElementBlock(o.Fragment,null,o.renderList(i.model,((t,n)=>(o.openBlock(),o.createElementBlock(o.Fragment,{key:n},[l.isItemVisible(t)?(o.openBlock(),o.createElementBlock("li",{key:0,id:`${s.id}_${n}`,"aria-controls":`${s.id}_item`,class:o.normalizeClass(["p-speeddial-item",l.itemClass(`${s.id}_${n}`)]),style:o.normalizeStyle(l.getItemStyle(n)),role:"menuitem"},[e.$slots.item?(o.openBlock(),o.createBlock(o.resolveDynamicComponent(e.$slots.item),{key:1,item:t},null,8,["item"])):o.withDirectives((o.openBlock(),o.createElementBlock("a",{key:0,tabindex:-1,href:t.url||"#",role:"menuitem",class:o.normalizeClass(["p-speeddial-action",{"p-disabled":t.disabled}]),target:t.target,onClick:e=>l.onItemClick(e,t),"aria-label":t.label},[t.icon?(o.openBlock(),o.createElementBlock("span",{key:0,class:o.normalizeClass(["p-speeddial-action-icon",t.icon])},null,2)):o.createCommentVNode("",!0)],10,m)),[[r,{value:t.label,disabled:!i.tooltipOptions},i.tooltipOptions],[d]])],14,h)):o.createCommentVNode("",!0)],64)))),128))],40,u)],6),i.mask?(o.openBlock(),o.createElementBlock("div",{key:0,class:o.normalizeClass(l.maskClassName),style:o.normalizeStyle(i.maskStyle)},null,6)):o.createCommentVNode("",!0)],64)},module.exports=p;
+"use strict";var e=require("primevue/basecomponent"),t=require("primevue/button"),i=require("primevue/icons/plus"),n=require("primevue/ripple"),s=require("primevue/tooltip"),o=require("primevue/utils"),l=require("vue");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var r=a(e),d=a(t),c=a(i),p=a(n),u=a(s),m={name:"SpeedDial",extends:r.default,emits:["click","show","hide","focus","blur"],props:{model:null,visible:{type:Boolean,default:!1},direction:{type:String,default:"up"},transitionDelay:{type:Number,default:30},type:{type:String,default:"linear"},radius:{type:Number,default:0},mask:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},hideOnClickOutside:{type:Boolean,default:!0},buttonClass:null,maskStyle:null,maskClass:null,showIcon:{type:String,default:void 0},hideIcon:{type:String,default:void 0},rotateAnimation:{type:Boolean,default:!0},tooltipOptions:null,style:null,class:null,"aria-labelledby":{type:String,default:null},"aria-label":{type:String,default:null}},documentClickListener:null,container:null,list:null,data(){return{id:this.$attrs.id,d_visible:this.visible,isItemClicked:!1,focused:!1,focusedOptionIndex:-1}},watch:{"$attrs.id":function(e){this.id=e||o.UniqueComponentId()},visible(e){this.d_visible=e}},mounted(){if(this.id=this.id||o.UniqueComponentId(),"linear"!==this.type){const e=o.DomHandler.findSingle(this.container,".p-speeddial-button"),t=o.DomHandler.findSingle(this.list,".p-speeddial-item");if(e&&t){const i=Math.abs(e.offsetWidth-t.offsetWidth),n=Math.abs(e.offsetHeight-t.offsetHeight);this.list.style.setProperty("--item-diff-x",i/2+"px"),this.list.style.setProperty("--item-diff-y",n/2+"px")}}this.hideOnClickOutside&&this.bindDocumentClickListener()},beforeMount(){this.unbindDocumentClickListener()},methods:{getPTOptions(e,t){return this.ptm(t,{context:{active:this.isItemActive(e)}})},onFocus(e){this.focused=!0,this.$emit("focus",e)},onBlur(e){this.focused=!1,this.focusedOptionIndex=-1,this.$emit("blur",e)},onItemClick(e,t){t.command&&t.command({originalEvent:e,item:t}),this.hide(),this.isItemClicked=!0,e.preventDefault()},onClick(e){this.d_visible?this.hide():this.show(),this.isItemClicked=!0,this.$emit("click",e)},show(){this.d_visible=!0,this.$emit("show")},hide(){this.d_visible=!1,this.$emit("hide")},calculateTransitionDelay(e){const t=this.model.length;return(this.d_visible?e:t-e-1)*this.transitionDelay},onTogglerKeydown(e){switch(e.code){case"ArrowDown":case"ArrowLeft":this.onTogglerArrowDown(e);break;case"ArrowUp":case"ArrowRight":this.onTogglerArrowUp(e);break;case"Escape":this.onEscapeKey()}},onKeyDown(e){switch(e.code){case"ArrowDown":this.onArrowDown(e);break;case"ArrowUp":this.onArrowUp(e);break;case"ArrowLeft":this.onArrowLeft(e);break;case"ArrowRight":this.onArrowRight(e);break;case"Enter":case"Space":this.onEnterKey(e);break;case"Escape":this.onEscapeKey(e);break;case"Home":this.onHomeKey(e);break;case"End":this.onEndKey(e)}},onTogglerArrowUp(e){this.focused=!0,o.DomHandler.focus(this.list),this.show(),this.navigatePrevItem(e),e.preventDefault()},onTogglerArrowDown(e){this.focused=!0,o.DomHandler.focus(this.list),this.show(),this.navigateNextItem(e),e.preventDefault()},onEnterKey(e){const t=[...o.DomHandler.find(this.container,".p-speeddial-item")].findIndex((e=>e.id===this.focusedOptionIndex));this.onItemClick(e,this.model[t]),this.onBlur(e);const i=o.DomHandler.findSingle(this.container,"button");i&&o.DomHandler.focus(i)},onEscapeKey(){this.hide();const e=o.DomHandler.findSingle(this.container,"button");e&&o.DomHandler.focus(e)},onArrowUp(e){"up"===this.direction?this.navigateNextItem(e):"down"===this.direction?this.navigatePrevItem(e):this.navigateNextItem(e)},onArrowDown(e){"up"===this.direction?this.navigatePrevItem(e):"down"===this.direction?this.navigateNextItem(e):this.navigatePrevItem(e)},onArrowLeft(e){["left","up-right","down-left"].includes(this.direction)?this.navigateNextItem(e):(["right","up-left","down-right"].includes(this.direction),this.navigatePrevItem(e))},onArrowRight(e){["left","up-right","down-left"].includes(this.direction)?this.navigatePrevItem(e):(["right","up-left","down-right"].includes(this.direction),this.navigateNextItem(e))},onEndKey(e){e.preventDefault(),this.focusedOptionIndex=-1,this.navigatePrevItem(e)},onHomeKey(e){e.preventDefault(),this.focusedOptionIndex=-1,this.navigateNextItem(e)},navigateNextItem(e){const t=this.findNextOptionIndex(this.focusedOptionIndex);this.changeFocusedOptionIndex(t),e.preventDefault()},navigatePrevItem(e){const t=this.findPrevOptionIndex(this.focusedOptionIndex);this.changeFocusedOptionIndex(t),e.preventDefault()},changeFocusedOptionIndex(e){const t=[...o.DomHandler.find(this.container,".p-speeddial-item")].filter((e=>!o.DomHandler.hasClass(o.DomHandler.findSingle(e,"a"),"p-disabled")));t[e]&&(this.focusedOptionIndex=t[e].getAttribute("id"))},findPrevOptionIndex(e){const t=[...o.DomHandler.find(this.container,".p-speeddial-item")].filter((e=>!o.DomHandler.hasClass(o.DomHandler.findSingle(e,"a"),"p-disabled"))),i=-1===e?t[t.length-1].id:e;let n=t.findIndex((e=>e.getAttribute("id")===i));return n=-1===e?t.length-1:n-1,n},findNextOptionIndex(e){const t=[...o.DomHandler.find(this.container,".p-speeddial-item")].filter((e=>!o.DomHandler.hasClass(o.DomHandler.findSingle(e,"a"),"p-disabled"))),i=-1===e?t[0].id:e;let n=t.findIndex((e=>e.getAttribute("id")===i));return n=-1===e?0:n+1,n},calculatePointStyle(e){const t=this.type;if("linear"!==t){const i=this.model.length,n=this.radius||20*i;if("circle"===t){const t=2*Math.PI/i;return{left:`calc(${n*Math.cos(t*e)}px + var(--item-diff-x, 0px))`,top:`calc(${n*Math.sin(t*e)}px + var(--item-diff-y, 0px))`}}if("semi-circle"===t){const t=this.direction,s=Math.PI/(i-1),o=`calc(${n*Math.cos(s*e)}px + var(--item-diff-x, 0px))`,l=`calc(${n*Math.sin(s*e)}px + var(--item-diff-y, 0px))`;if("up"===t)return{left:o,bottom:l};if("down"===t)return{left:o,top:l};if("left"===t)return{right:l,top:o};if("right"===t)return{left:l,top:o}}else if("quarter-circle"===t){const t=this.direction,s=Math.PI/(2*(i-1)),o=`calc(${n*Math.cos(s*e)}px + var(--item-diff-x, 0px))`,l=`calc(${n*Math.sin(s*e)}px + var(--item-diff-y, 0px))`;if("up-left"===t)return{right:o,bottom:l};if("up-right"===t)return{left:o,bottom:l};if("down-left"===t)return{right:l,top:o};if("down-right"===t)return{left:l,top:o}}}return{}},getItemStyle(e){return{transitionDelay:`${this.calculateTransitionDelay(e)}ms`,...this.calculatePointStyle(e)}},bindDocumentClickListener(){this.documentClickListener||(this.documentClickListener=e=>{this.d_visible&&this.isOutsideClicked(e)&&this.hide(),this.isItemClicked=!1},document.addEventListener("click",this.documentClickListener))},unbindDocumentClickListener(){this.documentClickListener&&(document.removeEventListener("click",this.documentClickListener),this.documentClickListener=null)},isOutsideClicked(e){return this.container&&!(this.container.isSameNode(e.target)||this.container.contains(e.target)||this.isItemClicked)},isItemVisible:e=>"function"==typeof e.visible?e.visible():!1!==e.visible,isItemActive(e){return e===this.focusedOptionId},containerRef(e){this.container=e},listRef(e){this.list=e},itemClass(e){return[{"p-focus":this.isItemActive(e)}]}},computed:{containerClass(){return[`p-speeddial p-component p-speeddial-${this.type}`,{[`p-speeddial-direction-${this.direction}`]:"circle"!==this.type,"p-speeddial-opened":this.d_visible,"p-disabled":this.disabled},this.class]},buttonClassName(){return["p-speeddial-button p-button-rounded",{"p-speeddial-rotate":this.rotateAnimation&&!this.hideIcon},this.buttonClass]},maskClassName(){return["p-speeddial-mask",{"p-speeddial-mask-visible":this.d_visible},this.maskClass]},focusedOptionId(){return-1!==this.focusedOptionIndex?this.focusedOptionIndex:null}},components:{SDButton:d.default,PlusIcon:c.default},directives:{ripple:p.default,tooltip:u.default}};const h=["id","aria-activedescendant"],f=["id","aria-controls"],b=["href","target","onClick","aria-label"];!function(e,t){void 0===t&&(t={});var i=t.insertAt;if(e&&"undefined"!=typeof document){var n=document.head||document.getElementsByTagName("head")[0],s=document.createElement("style");s.type="text/css","top"===i&&n.firstChild?n.insertBefore(s,n.firstChild):n.appendChild(s),s.styleSheet?s.styleSheet.cssText=e:s.appendChild(document.createTextNode(e))}}("\n.p-speeddial {\n    position: absolute;\n    display: flex;\n}\n.p-speeddial-button {\n    z-index: 1;\n}\n.p-speeddial-list {\n    margin: 0;\n    padding: 0;\n    list-style: none;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    transition: top 0s linear 0.2s;\n    pointer-events: none;\n    z-index: 2;\n}\n.p-speeddial-item {\n    transform: scale(0);\n    opacity: 0;\n    transition: transform 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, opacity 0.8s;\n    will-change: transform;\n}\n.p-speeddial-action {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    border-radius: 50%;\n    position: relative;\n    overflow: hidden;\n}\n.p-speeddial-circle .p-speeddial-item,\n.p-speeddial-semi-circle .p-speeddial-item,\n.p-speeddial-quarter-circle .p-speeddial-item {\n    position: absolute;\n}\n.p-speeddial-rotate {\n    transition: transform 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n    will-change: transform;\n}\n.p-speeddial-mask {\n    position: absolute;\n    left: 0;\n    top: 0;\n    width: 100%;\n    height: 100%;\n    opacity: 0;\n    transition: opacity 250ms cubic-bezier(0.25, 0.8, 0.25, 1);\n}\n.p-speeddial-mask-visible {\n    pointer-events: none;\n    opacity: 1;\n    transition: opacity 400ms cubic-bezier(0.25, 0.8, 0.25, 1);\n}\n.p-speeddial-opened .p-speeddial-list {\n    pointer-events: auto;\n}\n.p-speeddial-opened .p-speeddial-item {\n    transform: scale(1);\n    opacity: 1;\n}\n.p-speeddial-opened .p-speeddial-rotate {\n    transform: rotate(45deg);\n}\n\n/* Direction */\n.p-speeddial-direction-up {\n    align-items: center;\n    flex-direction: column-reverse;\n}\n.p-speeddial-direction-up .p-speeddial-list {\n    flex-direction: column-reverse;\n}\n.p-speeddial-direction-down {\n    align-items: center;\n    flex-direction: column;\n}\n.p-speeddial-direction-down .p-speeddial-list {\n    flex-direction: column;\n}\n.p-speeddial-direction-left {\n    justify-content: center;\n    flex-direction: row-reverse;\n}\n.p-speeddial-direction-left .p-speeddial-list {\n    flex-direction: row-reverse;\n}\n.p-speeddial-direction-right {\n    justify-content: center;\n    flex-direction: row;\n}\n.p-speeddial-direction-right .p-speeddial-list {\n    flex-direction: row;\n}\n"),m.render=function(e,t,i,n,s,o){const a=l.resolveComponent("SDButton"),r=l.resolveDirective("tooltip"),d=l.resolveDirective("ripple");return l.openBlock(),l.createElementBlock(l.Fragment,null,[l.createElementVNode("div",l.mergeProps({ref:o.containerRef,class:o.containerClass,style:i.style},e.ptm("root")),[l.renderSlot(e.$slots,"button",{toggle:o.onClick},(()=>[l.createVNode(a,{type:"button",class:l.normalizeClass(o.buttonClassName),onClick:t[0]||(t[0]=e=>o.onClick(e)),disabled:i.disabled,onKeydown:o.onTogglerKeydown,"aria-expanded":s.d_visible,"aria-haspopup":!0,"aria-controls":s.id+"_list","aria-label":e.ariaLabel,"aria-labelledby":e.ariaLabelledby,pt:e.ptm("button")},{icon:l.withCtx((()=>[l.renderSlot(e.$slots,"icon",{visible:s.d_visible},(()=>[s.d_visible&&i.hideIcon?(l.openBlock(),l.createBlock(l.resolveDynamicComponent(i.hideIcon?"span":"PlusIcon"),l.mergeProps({key:0,class:i.hideIcon},e.ptm("button").icon),null,16,["class"])):(l.openBlock(),l.createBlock(l.resolveDynamicComponent(i.showIcon?"span":"PlusIcon"),l.mergeProps({key:1,class:i.showIcon},e.ptm("button").icon),null,16,["class"]))]))])),_:3},8,["class","disabled","onKeydown","aria-expanded","aria-controls","aria-label","aria-labelledby","pt"])])),l.createElementVNode("ul",l.mergeProps({ref:o.listRef,id:s.id+"_list",class:"p-speeddial-list",role:"menu",onFocus:t[1]||(t[1]=(...e)=>o.onFocus&&o.onFocus(...e)),onBlur:t[2]||(t[2]=(...e)=>o.onBlur&&o.onBlur(...e)),onKeydown:t[3]||(t[3]=(...e)=>o.onKeyDown&&o.onKeyDown(...e)),"aria-activedescendant":s.focused?o.focusedOptionId:void 0,tabindex:"-1"},e.ptm("menu")),[(l.openBlock(!0),l.createElementBlock(l.Fragment,null,l.renderList(i.model,((t,n)=>(l.openBlock(),l.createElementBlock(l.Fragment,{key:n},[o.isItemVisible(t)?(l.openBlock(),l.createElementBlock("li",l.mergeProps({key:0,id:`${s.id}_${n}`,"aria-controls":`${s.id}_item`,class:["p-speeddial-item",o.itemClass(`${s.id}_${n}`)],style:o.getItemStyle(n),role:"menuitem"},o.getPTOptions(`${s.id}_${n}`,"menuitem")),[e.$slots.item?(l.openBlock(),l.createBlock(l.resolveDynamicComponent(e.$slots.item),{key:1,item:t},null,8,["item"])):l.withDirectives((l.openBlock(),l.createElementBlock("a",l.mergeProps({key:0,tabindex:-1,href:t.url||"#",role:"menuitem",class:["p-speeddial-action",{"p-disabled":t.disabled}],target:t.target,onClick:e=>o.onItemClick(e,t),"aria-label":t.label},o.getPTOptions(`${s.id}_${n}`,"action")),[t.icon?(l.openBlock(),l.createElementBlock("span",l.mergeProps({key:0,class:["p-speeddial-action-icon",t.icon]},o.getPTOptions(`${s.id}_${n}`,"actionIcon")),null,16)):l.createCommentVNode("",!0)],16,b)),[[r,{value:t.label,disabled:!i.tooltipOptions},i.tooltipOptions],[d]])],16,f)):l.createCommentVNode("",!0)],64)))),128))],16,h)],16),i.mask?(l.openBlock(),l.createElementBlock("div",l.mergeProps({key:0,class:o.maskClassName,style:i.maskStyle},e.ptm("mask")),null,16)):l.createCommentVNode("",!0)],64)},module.exports=m;