primevue
Version:
[](https://opensource.org/licenses/MIT) [](https://badge.fury.io/js/primevue) [ • 36.7 kB
JavaScript
this.primevue = this.primevue || {};
this.primevue.speeddial = (function (Button, Ripple, vue) {
'use strict';
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
var Button__default = /*#__PURE__*/_interopDefaultLegacy(Button);
var Ripple__default = /*#__PURE__*/_interopDefaultLegacy(Ripple);
class DomHandler {
static innerWidth(el) {
let width = el.offsetWidth;
let style = getComputedStyle(el);
width += parseFloat(style.paddingLeft) + parseFloat(style.paddingRight);
return width;
}
static width(el) {
let width = el.offsetWidth;
let style = getComputedStyle(el);
width -= parseFloat(style.paddingLeft) + parseFloat(style.paddingRight);
return width;
}
static getWindowScrollTop() {
let doc = document.documentElement;
return (window.pageYOffset || doc.scrollTop) - (doc.clientTop || 0);
}
static getWindowScrollLeft() {
let doc = document.documentElement;
return (window.pageXOffset || doc.scrollLeft) - (doc.clientLeft || 0);
}
static getOuterWidth(el, margin) {
if (el) {
let width = el.offsetWidth;
if (margin) {
let style = getComputedStyle(el);
width += parseFloat(style.marginLeft) + parseFloat(style.marginRight);
}
return width;
}
else {
return 0;
}
}
static getOuterHeight(el, margin) {
if (el) {
let height = el.offsetHeight;
if (margin) {
let style = getComputedStyle(el);
height += parseFloat(style.marginTop) + parseFloat(style.marginBottom);
}
return height;
}
else {
return 0;
}
}
static getClientHeight(el, margin) {
if (el) {
let height = el.clientHeight;
if (margin) {
let style = getComputedStyle(el);
height += parseFloat(style.marginTop) + parseFloat(style.marginBottom);
}
return height;
} else {
return 0;
}
}
static getViewport() {
let win = window,
d = document,
e = d.documentElement,
g = d.getElementsByTagName('body')[0],
w = win.innerWidth || e.clientWidth || g.clientWidth,
h = win.innerHeight || e.clientHeight || g.clientHeight;
return {width: w, height: h};
}
static getOffset(el) {
var rect = el.getBoundingClientRect();
return {
top: rect.top + (window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0),
left: rect.left + (window.pageXOffset || document.documentElement.scrollLeft || document.body.scrollLeft || 0),
};
}
static index(element) {
let children = element.parentNode.childNodes;
let num = 0;
for (var i = 0; i < children.length; i++) {
if (children[i] === element) return num;
if (children[i].nodeType === 1) num++;
}
return -1;
}
static addMultipleClasses(element, className) {
if (element.classList) {
let styles = className.split(' ');
for (let i = 0; i < styles.length; i++) {
element.classList.add(styles[i]);
}
}
else {
let styles = className.split(' ');
for (let i = 0; i < styles.length; i++) {
element.className += ' ' + styles[i];
}
}
}
static addClass(element, className) {
if (element.classList)
element.classList.add(className);
else
element.className += ' ' + className;
}
static removeClass(element, className) {
if (element.classList)
element.classList.remove(className);
else
element.className = element.className.replace(new RegExp('(^|\\b)' + className.split(' ').join('|') + '(\\b|$)', 'gi'), ' ');
}
static hasClass(element, className) {
if (element) {
if (element.classList)
return element.classList.contains(className);
else
return new RegExp('(^| )' + className + '( |$)', 'gi').test(element.className);
}
return false;
}
static find(element, selector) {
return element.querySelectorAll(selector);
}
static findSingle(element, selector) {
return element.querySelector(selector);
}
static getHeight(el) {
let height = el.offsetHeight;
let style = getComputedStyle(el);
height -= parseFloat(style.paddingTop) + parseFloat(style.paddingBottom) + parseFloat(style.borderTopWidth) + parseFloat(style.borderBottomWidth);
return height;
}
static getWidth(el) {
let width = el.offsetWidth;
let style = getComputedStyle(el);
width -= parseFloat(style.paddingLeft) + parseFloat(style.paddingRight) + parseFloat(style.borderLeftWidth) + parseFloat(style.borderRightWidth);
return width;
}
static absolutePosition(element, target) {
let elementDimensions = element.offsetParent ? { width: element.offsetWidth, height: element.offsetHeight } : this.getHiddenElementDimensions(element);
let elementOuterHeight = elementDimensions.height;
let elementOuterWidth = elementDimensions.width;
let targetOuterHeight = target.offsetHeight;
let targetOuterWidth = target.offsetWidth;
let targetOffset = target.getBoundingClientRect();
let windowScrollTop = this.getWindowScrollTop();
let windowScrollLeft = this.getWindowScrollLeft();
let viewport = this.getViewport();
let top, left;
if (targetOffset.top + targetOuterHeight + elementOuterHeight > viewport.height) {
top = targetOffset.top + windowScrollTop - elementOuterHeight;
element.style.transformOrigin = 'bottom';
if (top < 0) {
top = windowScrollTop;
}
}
else {
top = targetOuterHeight + targetOffset.top + windowScrollTop;
element.style.transformOrigin = 'top';
}
if (targetOffset.left + elementOuterWidth > viewport.width)
left = Math.max(0, targetOffset.left + windowScrollLeft + targetOuterWidth - elementOuterWidth);
else
left = targetOffset.left + windowScrollLeft;
element.style.top = top + 'px';
element.style.left = left + 'px';
}
static relativePosition(element, target) {
let elementDimensions = element.offsetParent ? { width: element.offsetWidth, height: element.offsetHeight } : this.getHiddenElementDimensions(element);
const targetHeight = target.offsetHeight;
const targetOffset = target.getBoundingClientRect();
const viewport = this.getViewport();
let top, left;
if ((targetOffset.top + targetHeight + elementDimensions.height) > viewport.height) {
top = -1 * (elementDimensions.height);
element.style.transformOrigin = 'bottom';
if (targetOffset.top + top < 0) {
top = -1 * targetOffset.top;
}
}
else {
top = targetHeight;
element.style.transformOrigin = 'top';
}
if (elementDimensions.width > viewport.width) {
// element wider then viewport and cannot fit on screen (align at left side of viewport)
left = targetOffset.left * -1;
}
else if ((targetOffset.left + elementDimensions.width) > viewport.width) {
// element wider then viewport but can be fit on screen (align at right side of viewport)
left = (targetOffset.left + elementDimensions.width - viewport.width) * -1;
}
else {
// element fits on screen (align with target)
left = 0;
}
element.style.top = top + 'px';
element.style.left = left + 'px';
}
static getParents(element, parents = []) {
return element['parentNode'] === null ? parents : this.getParents(element.parentNode, parents.concat([element.parentNode]));
}
static getScrollableParents(element) {
let scrollableParents = [];
if (element) {
let parents = this.getParents(element);
const overflowRegex = /(auto|scroll)/;
const overflowCheck = (node) => {
let styleDeclaration = window['getComputedStyle'](node, null);
return overflowRegex.test(styleDeclaration.getPropertyValue('overflow')) || overflowRegex.test(styleDeclaration.getPropertyValue('overflowX')) || overflowRegex.test(styleDeclaration.getPropertyValue('overflowY'));
};
for (let parent of parents) {
let scrollSelectors = parent.nodeType === 1 && parent.dataset['scrollselectors'];
if (scrollSelectors) {
let selectors = scrollSelectors.split(',');
for (let selector of selectors) {
let el = this.findSingle(parent, selector);
if (el && overflowCheck(el)) {
scrollableParents.push(el);
}
}
}
if (parent.nodeType !== 9 && overflowCheck(parent)) {
scrollableParents.push(parent);
}
}
}
return scrollableParents;
}
static getHiddenElementOuterHeight(element) {
element.style.visibility = 'hidden';
element.style.display = 'block';
let elementHeight = element.offsetHeight;
element.style.display = 'none';
element.style.visibility = 'visible';
return elementHeight;
}
static getHiddenElementOuterWidth(element) {
element.style.visibility = 'hidden';
element.style.display = 'block';
let elementWidth = element.offsetWidth;
element.style.display = 'none';
element.style.visibility = 'visible';
return elementWidth;
}
static getHiddenElementDimensions(element) {
var dimensions = {};
element.style.visibility = 'hidden';
element.style.display = 'block';
dimensions.width = element.offsetWidth;
dimensions.height = element.offsetHeight;
element.style.display = 'none';
element.style.visibility = 'visible';
return dimensions;
}
static fadeIn(element, duration) {
element.style.opacity = 0;
var last = +new Date();
var opacity = 0;
var tick = function () {
opacity = +element.style.opacity + (new Date().getTime() - last) / duration;
element.style.opacity = opacity;
last = +new Date();
if (+opacity < 1) {
(window.requestAnimationFrame && requestAnimationFrame(tick)) || setTimeout(tick, 16);
}
};
tick();
}
static fadeOut(element, ms) {
var opacity = 1,
interval = 50,
duration = ms,
gap = interval / duration;
let fading = setInterval(() => {
opacity -= gap;
if (opacity <= 0) {
opacity = 0;
clearInterval(fading);
}
element.style.opacity = opacity;
}, interval);
}
static getUserAgent() {
return navigator.userAgent;
}
static appendChild(element, target) {
if(this.isElement(target))
target.appendChild(element);
else if(target.el && target.elElement)
target.elElement.appendChild(element);
else
throw new Error('Cannot append ' + target + ' to ' + element);
}
static scrollInView(container, item) {
let borderTopValue = getComputedStyle(container).getPropertyValue('borderTopWidth');
let borderTop = borderTopValue ? parseFloat(borderTopValue) : 0;
let paddingTopValue = getComputedStyle(container).getPropertyValue('paddingTop');
let paddingTop = paddingTopValue ? parseFloat(paddingTopValue) : 0;
let containerRect = container.getBoundingClientRect();
let itemRect = item.getBoundingClientRect();
let offset = (itemRect.top + document.body.scrollTop) - (containerRect.top + document.body.scrollTop) - borderTop - paddingTop;
let scroll = container.scrollTop;
let elementHeight = container.clientHeight;
let itemHeight = this.getOuterHeight(item);
if (offset < 0) {
container.scrollTop = scroll + offset;
}
else if ((offset + itemHeight) > elementHeight) {
container.scrollTop = scroll + offset - elementHeight + itemHeight;
}
}
static clearSelection() {
if(window.getSelection) {
if(window.getSelection().empty) {
window.getSelection().empty();
} else if(window.getSelection().removeAllRanges && window.getSelection().rangeCount > 0 && window.getSelection().getRangeAt(0).getClientRects().length > 0) {
window.getSelection().removeAllRanges();
}
}
else if(document['selection'] && document['selection'].empty) {
try {
document['selection'].empty();
} catch(error) {
//ignore IE bug
}
}
}
static calculateScrollbarWidth() {
if(this.calculatedScrollbarWidth != null)
return this.calculatedScrollbarWidth;
let scrollDiv = document.createElement("div");
scrollDiv.className = "p-scrollbar-measure";
document.body.appendChild(scrollDiv);
let scrollbarWidth = scrollDiv.offsetWidth - scrollDiv.clientWidth;
document.body.removeChild(scrollDiv);
this.calculatedScrollbarWidth = scrollbarWidth;
return scrollbarWidth;
}
static getBrowser() {
if(!this.browser) {
let matched = this.resolveUserAgent();
this.browser = {};
if (matched.browser) {
this.browser[matched.browser] = true;
this.browser['version'] = matched.version;
}
if (this.browser['chrome']) {
this.browser['webkit'] = true;
} else if (this.browser['webkit']) {
this.browser['safari'] = true;
}
}
return this.browser;
}
static resolveUserAgent() {
let ua = navigator.userAgent.toLowerCase();
let match = /(chrome)[ ]([\w.]+)/.exec(ua) ||
/(webkit)[ ]([\w.]+)/.exec(ua) ||
/(opera)(?:.*version|)[ ]([\w.]+)/.exec(ua) ||
/(msie) ([\w.]+)/.exec(ua) ||
(ua.indexOf("compatible") < 0 && /(mozilla)(?:.*? rv:([\w.]+)|)/.exec(ua)) ||
[];
return {
browser: match[1] || "",
version: match[2] || "0"
};
}
static isVisible(element) {
return element.offsetParent != null;
}
static invokeElementMethod(element, methodName, args) {
(element)[methodName].apply(element, args);
}
static getFocusableElements(element) {
let focusableElements = DomHandler.find(element, `button:not([tabindex = "-1"]):not([disabled]):not([style*="display:none"]):not([hidden]),
[href][clientHeight][clientWidth]:not([tabindex = "-1"]):not([disabled]):not([style*="display:none"]):not([hidden]),
input:not([tabindex = "-1"]):not([disabled]):not([style*="display:none"]):not([hidden]), select:not([tabindex = "-1"]):not([disabled]):not([style*="display:none"]):not([hidden]),
textarea:not([tabindex = "-1"]):not([disabled]):not([style*="display:none"]):not([hidden]), [tabIndex]:not([tabIndex = "-1"]):not([disabled]):not([style*="display:none"]):not([hidden]),
[contenteditable]:not([tabIndex = "-1"]):not([disabled]):not([style*="display:none"]):not([hidden])`
);
let visibleFocusableElements = [];
for (let focusableElement of focusableElements) {
if (getComputedStyle(focusableElement).display != "none" && getComputedStyle(focusableElement).visibility != "hidden")
visibleFocusableElements.push(focusableElement);
}
return visibleFocusableElements;
}
static isClickable(element) {
const targetNode = element.nodeName;
const parentNode = element.parentElement && element.parentElement.nodeName;
return (targetNode == 'INPUT' || targetNode == 'BUTTON' || targetNode == 'A' ||
parentNode == 'INPUT' || parentNode == 'BUTTON' || parentNode == 'A' ||
this.hasClass(element, 'p-button') || this.hasClass(element.parentElement, 'p-button') ||
this.hasClass(element.parentElement, 'p-checkbox') || this.hasClass(element.parentElement, 'p-radiobutton')
);
}
static applyStyle(element, style) {
if (typeof style === 'string') {
element.style.cssText = this.style;
}
else {
for (let prop in this.style) {
element.style[prop] = style[prop];
}
}
}
static isIOS() {
return /iPad|iPhone|iPod/.test(navigator.userAgent) && !window['MSStream'];
}
static isAndroid() {
return /(android)/i.test(navigator.userAgent);
}
}
var script = {
name: 'SpeedDial',
props: {
model: null,
visible: {
type: Boolean,
default: false
},
direction: {
type: String,
default: 'up'
},
transitionDelay: {
type: Number,
default: 30
},
type: {
type: String,
default: 'linear'
},
radius: {
type: Number,
default: 0
},
mask: {
type: Boolean,
default: false
},
disabled: {
type: Boolean,
default: false
},
hideOnClickOutside: {
type: Boolean,
default: true
},
buttonClassName: null,
maskStyle: null,
maskClassName: null,
showIcon: {
type: String,
default: 'pi pi-plus'
},
hideIcon: null,
rotateAnimation: {
type: Boolean,
default: true
},
style: null,
class: null
},
documentClickListener: null,
container: null,
list: null,
data() {
return {
d_visible: this.visible,
isItemClicked: false
}
},
watch: {
visible(newValue) {
this.d_visible = newValue;
}
},
mounted() {
if (this.type !== 'linear') {
const button = DomHandler.findSingle(this.container, '.p-speeddial-button');
const firstItem = DomHandler.findSingle(this.list, '.p-speeddial-item');
if (button && firstItem) {
const wDiff = Math.abs(button.offsetWidth - firstItem.offsetWidth);
const hDiff = Math.abs(button.offsetHeight - firstItem.offsetHeight);
this.list.style.setProperty('--item-diff-x', `${wDiff / 2}px`);
this.list.style.setProperty('--item-diff-y', `${hDiff / 2}px`);
}
}
if (this.hideOnClickOutside) {
this.bindDocumentClickListener();
}
},
beforeMount() {
this.bindDocumentClickListener();
},
methods: {
onItemClick(e, item) {
if (item.command) {
item.command({ originalEvent: e, item });
}
this.hide();
this.isItemClicked = true;
e.preventDefault();
},
onClick(event) {
this.d_visible ? this.hide() : this.show();
this.isItemClicked = true;
this.$emit('click', event);
},
show() {
this.d_visible = true;
this.$emit('show');
},
hide() {
this.d_visible = false;
this.$emit('hide');
},
calculateTransitionDelay(index) {
const length = this.model.length;
const visible = this.d_visible;
return (visible ? index : length - index - 1) * this.transitionDelay;
},
calculatePointStyle(index) {
const type = this.type;
if (type !== 'linear') {
const length = this.model.length;
const radius = this.radius || (length * 20);
if (type === 'circle') {
const step = 2 * Math.PI / length;
return {
left: `calc(${radius * Math.cos(step * index)}px + var(--item-diff-x, 0px))`,
top: `calc(${radius * Math.sin(step * index)}px + var(--item-diff-y, 0px))`,
}
}
else if (type === 'semi-circle') {
const direction = this.direction;
const step = Math.PI / (length - 1);
const x = `calc(${radius * Math.cos(step * index)}px + var(--item-diff-x, 0px))`;
const y = `calc(${radius * Math.sin(step * index)}px + var(--item-diff-y, 0px))`;
if (direction === 'up') {
return { left: x, bottom: y };
}
else if (direction === 'down') {
return { left: x, top: y };
}
else if (direction === 'left') {
return { right: y, top: x };
}
else if (direction === 'right') {
return { left: y, top: x };
}
}
else if (type === 'quarter-circle') {
const direction = this.direction;
const step = Math.PI / (2 * (length - 1));
const x = `calc(${radius * Math.cos(step * index)}px + var(--item-diff-x, 0px))`;
const y = `calc(${radius * Math.sin(step * index)}px + var(--item-diff-y, 0px))`;
if (direction === 'up-left') {
return { right: x, bottom: y };
}
else if (direction === 'up-right') {
return { left: x, bottom: y };
}
else if (direction === 'down-left') {
return { right: y, top: x };
}
else if (direction === 'down-right') {
return { left: y, top: x };
}
}
}
return {};
},
getItemStyle(index) {
const transitionDelay = this.calculateTransitionDelay(index);
const pointStyle = this.calculatePointStyle(index);
return {
transitionDelay: `${transitionDelay}ms`,
...pointStyle
};
},
bindDocumentClickListener() {
if (!this.documentClickListener) {
this.documentClickListener = (event) => {
if (this.d_visible && this.isOutsideClicked(event)) {
this.hide();
}
this.isItemClicked = false;
};
document.addEventListener('click', this.documentClickListener);
}
},
unbindDocumentClickListener() {
if (this.documentClickListener) {
document.removeEventListener('click', this.documentClickListener);
this.documentClickListener = null;
}
},
isOutsideClicked(event) {
return this.container && !(this.container.isSameNode(event.target) || this.container.contains(event.target) || this.isItemClicked);
},
containerRef(el) {
this.container = el;
},
listRef(el) {
this.list = el;
}
},
computed: {
containerClass() {
return [`p-speeddial p-component p-speeddial-${this.type}`, {
[`p-speeddial-direction-${this.direction}`]: this.type !== 'circle',
'p-speeddial-opened': this.d_visible,
'p-disabled': this.disabled
}, this.class];
},
buttonClass() {
return ['p-speeddial-button p-button-rounded', {
'p-speeddial-rotate': this.rotateAnimation && !this.hideIcon
}, this.buttonClassName];
},
iconClassName() {
return this.d_visible && !!this.hideIcon ? this.hideIcon : this.showIcon;
},
maskClass() {
return ['p-speeddial-mask', {
'p-speeddial-mask-visible': this.d_visible
}, this.maskClassName];
}
},
components: {
'SDButton': Button__default['default']
},
directives: {
'ripple': Ripple__default['default']
}
};
function render(_ctx, _cache, $props, $setup, $data, $options) {
const _component_SDButton = vue.resolveComponent("SDButton");
const _directive_ripple = vue.resolveDirective("ripple");
return (vue.openBlock(), vue.createBlock(vue.Fragment, null, [
vue.createVNode("div", {
ref: $options.containerRef,
class: $options.containerClass,
style: $props.style
}, [
vue.renderSlot(_ctx.$slots, "button", { toggle: $options.onClick }, () => [
vue.createVNode(_component_SDButton, {
type: "button",
class: $options.buttonClass,
icon: $options.iconClassName,
onClick: _cache[1] || (_cache[1] = $event => ($options.onClick($event))),
disabled: $props.disabled
}, null, 8, ["class", "icon", "disabled"])
]),
vue.createVNode("ul", {
ref: $options.listRef,
class: "p-speeddial-list",
role: "menu"
}, [
(vue.openBlock(true), vue.createBlock(vue.Fragment, null, vue.renderList($props.model, (item, index) => {
return (vue.openBlock(), vue.createBlock("li", {
key: index,
class: "p-speeddial-item",
style: $options.getItemStyle(index),
role: "none"
}, [
(!_ctx.$slots.item)
? vue.withDirectives((vue.openBlock(), vue.createBlock("a", {
key: 0,
href: item.url || '#',
role: "menuitem",
class: ['p-speeddial-action', { 'p-disabled': item.disabled }],
target: item.target,
"data-pr-tooltip": item.label,
onClick: $event => ($options.onItemClick($event, item))
}, [
(item.icon)
? (vue.openBlock(), vue.createBlock("span", {
key: 0,
class: ['p-speeddial-action-icon', item.icon]
}, null, 2))
: vue.createCommentVNode("", true)
], 10, ["href", "target", "data-pr-tooltip", "onClick"])), [
[_directive_ripple]
])
: (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.$slots.item), {
key: 1,
item: item
}, null, 8, ["item"]))
], 4))
}), 128))
], 512)
], 6),
($props.mask)
? (vue.openBlock(), vue.createBlock("div", {
key: 0,
class: $options.maskClass,
style: this.maskStyle
}, null, 6))
: vue.createCommentVNode("", true)
], 64))
}
function styleInject(css, ref) {
if ( ref === void 0 ) ref = {};
var insertAt = ref.insertAt;
if (!css || typeof document === 'undefined') { return; }
var head = document.head || document.getElementsByTagName('head')[0];
var style = document.createElement('style');
style.type = 'text/css';
if (insertAt === 'top') {
if (head.firstChild) {
head.insertBefore(style, head.firstChild);
} else {
head.appendChild(style);
}
} else {
head.appendChild(style);
}
if (style.styleSheet) {
style.styleSheet.cssText = css;
} else {
style.appendChild(document.createTextNode(css));
}
}
var css_248z = "\n.p-speeddial {\n position: absolute;\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n z-index: 1;\n}\n.p-speeddial-list {\n margin: 0;\n padding: 0;\n list-style: none;\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n -webkit-box-pack: center;\n -ms-flex-pack: center;\n justify-content: center;\n -webkit-transition: top 0s linear 0.2s;\n transition: top 0s linear 0.2s;\n pointer-events: none;\n}\n.p-speeddial-item {\n -webkit-transform: scale(0);\n transform: scale(0);\n opacity: 0;\n -webkit-transition: opacity 0.8s, -webkit-transform 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n transition: opacity 0.8s, -webkit-transform 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n transition: transform 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, opacity 0.8s;\n transition: transform 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, opacity 0.8s, -webkit-transform 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n will-change: transform;\n}\n.p-speeddial-action {\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n -webkit-box-pack: center;\n -ms-flex-pack: 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 -webkit-transition: -webkit-transform 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n transition: -webkit-transform 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n transition: transform 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n transition: transform 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, -webkit-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 -webkit-transition: opacity 250ms cubic-bezier(0.25, 0.8, 0.25, 1);\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 -webkit-transition: opacity 400ms cubic-bezier(0.25, 0.8, 0.25, 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 -webkit-transform: scale(1);\n transform: scale(1);\n opacity: 1;\n}\n.p-speeddial-opened .p-speeddial-rotate {\n -webkit-transform: rotate(45deg);\n transform: rotate(45deg);\n}\n\n/* Direction */\n.p-speeddial-direction-up {\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n -webkit-box-orient: vertical;\n -webkit-box-direction: reverse;\n -ms-flex-direction: column-reverse;\n flex-direction: column-reverse;\n}\n.p-speeddial-direction-up .p-speeddial-list {\n -webkit-box-orient: vertical;\n -webkit-box-direction: reverse;\n -ms-flex-direction: column-reverse;\n flex-direction: column-reverse;\n}\n.p-speeddial-direction-down {\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n -webkit-box-orient: vertical;\n -webkit-box-direction: normal;\n -ms-flex-direction: column;\n flex-direction: column;\n}\n.p-speeddial-direction-down .p-speeddial-list {\n -webkit-box-orient: vertical;\n -webkit-box-direction: normal;\n -ms-flex-direction: column;\n flex-direction: column;\n}\n.p-speeddial-direction-left {\n -webkit-box-pack: center;\n -ms-flex-pack: center;\n justify-content: center;\n -webkit-box-orient: horizontal;\n -webkit-box-direction: reverse;\n -ms-flex-direction: row-reverse;\n flex-direction: row-reverse;\n}\n.p-speeddial-direction-left .p-speeddial-list {\n -webkit-box-orient: horizontal;\n -webkit-box-direction: reverse;\n -ms-flex-direction: row-reverse;\n flex-direction: row-reverse;\n}\n.p-speeddial-direction-right {\n -webkit-box-pack: center;\n -ms-flex-pack: center;\n justify-content: center;\n -webkit-box-orient: horizontal;\n -webkit-box-direction: normal;\n -ms-flex-direction: row;\n flex-direction: row;\n}\n.p-speeddial-direction-right .p-speeddial-list {\n -webkit-box-orient: horizontal;\n -webkit-box-direction: normal;\n -ms-flex-direction: row;\n flex-direction: row;\n}\n";
styleInject(css_248z);
script.render = render;
return script;
}(primevue.button, primevue.ripple, Vue));