primereact 9.3.0 → 9.4.0

package/speeddial/speeddial.cjs.min.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("primereact/button"),n=require("primereact/hooks"),r=require("primereact/ripple"),i=require("primereact/utils"),o=require("primereact/icons/plus"),l=require("primereact/icons/minus");function a(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(n){if("default"!==n){var r=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,r.get?r:{enumerable:!0,get:function(){return e[n]}})}})),t.default=e,Object.freeze(t)}var c=a(e);function s(){return s=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},s.apply(this,arguments)}function u(e){return u="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},u(e)}function f(e,t){if("object"!==u(e)||null===e)return e;var n=e[Symbol.toPrimitive];if(void 0!==n){var r=n.call(e,t||"default");if("object"!==u(r))return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}function p(e){var t=f(e,"string");return"symbol"===u(t)?t:String(t)}function d(e,t,n){return(t=p(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function m(e){if(Array.isArray(e))return e}function b(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var r,i,o,l,a=[],c=!0,s=!1;try{if(o=(n=n.call(e)).next,0===t){if(Object(n)!==n)return;c=!1}else for(;!(c=(r=o.call(n)).done)&&(a.push(r.value),a.length!==t);c=!0);}catch(e){s=!0,i=e}finally{try{if(!c&&null!=n.return&&(l=n.return(),Object(l)!==l))return}finally{if(s)throw i}}return a}}function y(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}function h(e,t){if(e){if("string"==typeof e)return y(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?y(e,t):void 0}}function v(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function g(e,t){return m(e)||b(e,t)||h(e,t)||v()}var O={defaultProps:{__TYPE:"SpeedDial",id:null,model:null,visible:!1,style:null,className:null,direction:"up",transitionDelay:30,type:"linear",radius:0,mask:!1,disabled:!1,hideOnClickOutside:!0,buttonStyle:null,buttonClassName:null,buttonTemplate:null,"aria-label":null,maskStyle:null,maskClassName:null,showIcon:null,hideIcon:null,rotateAnimation:!0,onVisibleChange:null,onClick:null,onShow:null,onHide:null,children:void 0},getProps:function(e){return i.ObjectUtils.getMergedProps(e,O.defaultProps)},getOtherProps:function(e){return i.ObjectUtils.getDiffProps(e,O.defaultProps)}};function S(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function j(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?S(Object(n),!0).forEach((function(t){d(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):S(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}var P=c.memo(c.forwardRef((function(e,a){var u,f=O.getProps(e),p=g(c.useState(!1),2),m=p[0],b=p[1],y=c.useRef(!1),h=c.useRef(null),v=c.useRef(null),S=f.onVisibleChange?f.visible:m,P=g(n.useEventListener({type:"click",listener:function(e){!y.current&&x(e)&&k(),y.current=!1},when:m}),2),w=P[0],N=P[1],I=function(){f.onVisibleChange?f.onVisibleChange(!0):b(!0),f.onShow&&f.onShow()},k=function(){f.onVisibleChange?f.onVisibleChange(!1):b(!1),f.onHide&&f.onHide()},C=function(e){S?k():I(),f.onClick&&f.onClick(e),y.current=!0},E=function(e,t){t.command&&t.command({originalEvent:e,item:t}),k(),y.current=!0,e.preventDefault()},x=function(e){return h.current&&!(h.current.isSameNode(e.target)||h.current.contains(e.target))},M=function(e){return(S?e:f.model.length-e-1)*f.transitionDelay},D=function(e){var t=f.type;if("linear"!==t){var n=f.model.length,r=f.radius||20*n;if("circle"===t){var i=2*Math.PI/n;return{left:"calc(".concat(r*Math.cos(i*e),"px + var(--item-diff-x, 0px))"),top:"calc(".concat(r*Math.sin(i*e),"px + var(--item-diff-y, 0px))")}}if("semi-circle"===t){var o=f.direction,l=Math.PI/(n-1),a="calc(".concat(r*Math.cos(l*e),"px + var(--item-diff-x, 0px))"),c="calc(".concat(r*Math.sin(l*e),"px + var(--item-diff-y, 0px))");if("up"===o)return{left:a,bottom:c};if("down"===o)return{left:a,top:c};if("left"===o)return{right:c,top:a};if("right"===o)return{left:c,top:a}}else if("quarter-circle"===t){var s=f.direction,u=Math.PI/(2*(n-1)),p="calc(".concat(r*Math.cos(u*e),"px + var(--item-diff-x, 0px))"),d="calc(".concat(r*Math.sin(u*e),"px + var(--item-diff-y, 0px))");if("up-left"===s)return{right:p,bottom:d};if("up-right"===s)return{left:p,bottom:d};if("down-left"===s)return{right:d,top:p};if("down-right"===s)return{left:d,top:p}}}return{}},q=function(e){var t=M(e),n=D(e);return j({transitionDelay:"".concat(t,"ms")},n)};n.useMountEffect((function(){if("linear"!==f.type){var e=i.DomHandler.findSingle(h.current,".p-speeddial-button"),t=i.DomHandler.findSingle(v.current,".p-speeddial-item");if(e&&t){var n=Math.abs(e.offsetWidth-t.offsetWidth),r=Math.abs(e.offsetHeight-t.offsetHeight);v.current.style.setProperty("--item-diff-x","".concat(n/2,"px")),v.current.style.setProperty("--item-diff-y","".concat(r/2,"px"))}}})),n.useUpdateEffect((function(){return m&&f.hideOnClickOutside&&w(),function(){f.hideOnClickOutside&&N()}}),[m]),c.useImperativeHandle(a,(function(){return{props:f,show:I,hide:k,getElement:function(){return h.current}}}));var A,H=function(e,t){if(!1===e.visible)return null;var n=q(t),o=e.icon,l=e.label,a=e.template,s=e.url,u=e.target,p=i.classNames("p-speeddial-action",{"p-disabled":e.disabled}),d=i.classNames("p-speeddial-action-icon",o),m=i.IconUtils.getJSXIcon(o,{className:"p-speeddial-action-icon"},{props:f}),b=c.createElement("a",{href:s||"#",role:"menuitem",className:p,target:u,"data-pr-tooltip":l,onClick:function(t){return E(t,e)}},m,c.createElement(r.Ripple,null));a&&(b=i.ObjectUtils.getJSXElement(a,e,{onClick:function(t){return E(t,e)},className:p,iconClassName:d,element:b,props:f,visible:S}));return c.createElement("li",{key:t,className:"p-speeddial-item",style:n,role:"none"},b)},U=O.getOtherProps(f),V=i.classNames("p-speeddial p-component p-speeddial-".concat(f.type),(d(u={},"p-speeddial-direction-".concat(f.direction),"circle"!==f.type),d(u,"p-speeddial-opened",S),d(u,"p-disabled",f.disabled),u),f.className),_=function(){var e,n=!S&&!!f.showIcon||!f.hideIcon,r=S&&!!f.hideIcon,a=i.classNames("p-speeddial-button p-button-rounded",{"p-speeddial-rotate":f.rotateAnimation&&!f.hideIcon},f.buttonClassName),s=i.classNames((d(e={},"".concat(f.showIcon),!S&&!!f.showIcon||!f.hideIcon),d(e,"".concat(f.hideIcon),S&&!!f.hideIcon),e)),u=i.IconUtils.getJSXIcon(n?f.showIcon||c.createElement(o.PlusIcon,{className:s,onClick:C}):r?f.hideIcon||c.createElement(l.MinusIcon,{className:s,onClick:C}):null,{className:s},{props:f,visible:S});return c.createElement(t.Button,{type:"button",style:f.buttonStyle,className:a,icon:u,onClick:C,disabled:f.disabled,"aria-label":f["aria-label"]})}(),R=(A=f.model?f.model.map(H):null,c.createElement("ul",{ref:v,className:"p-speeddial-list",role:"menu"},A)),T=function(){if(f.mask){var e=i.classNames("p-speeddial-mask",{"p-speeddial-mask-visible":S},f.maskClassName);return c.createElement("div",{className:e,style:f.maskStyle})}return null}();return c.createElement(c.Fragment,null,c.createElement("div",s({ref:h,id:f.id,className:V,style:f.style},U),_,R),T)})));P.displayName="SpeedDial",exports.SpeedDial=P;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("primereact/button"),n=require("primereact/hooks"),r=require("primereact/icons/minus"),i=require("primereact/icons/plus"),o=require("primereact/ripple"),l=require("primereact/utils"),a=require("primereact/componentbase");function c(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(n){if("default"!==n){var r=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,r.get?r:{enumerable:!0,get:function(){return e[n]}})}})),t.default=e,Object.freeze(t)}var s=c(e);function u(e){return u="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},u(e)}function p(e,t){if("object"!==u(e)||null===e)return e;var n=e[Symbol.toPrimitive];if(void 0!==n){var r=n.call(e,t||"default");if("object"!==u(r))return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}function f(e){var t=p(e,"string");return"symbol"===u(t)?t:String(t)}function m(e,t,n){return(t=f(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function d(e){if(Array.isArray(e))return e}function b(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var r,i,o,l,a=[],c=!0,s=!1;try{if(o=(n=n.call(e)).next,0===t){if(Object(n)!==n)return;c=!1}else for(;!(c=(r=o.call(n)).done)&&(a.push(r.value),a.length!==t);c=!0);}catch(e){s=!0,i=e}finally{try{if(!c&&null!=n.return&&(l=n.return(),Object(l)!==l))return}finally{if(s)throw i}}return a}}function y(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}function h(e,t){if(e){if("string"==typeof e)return y(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?y(e,t):void 0}}function v(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function g(e,t){return d(e)||b(e,t)||h(e,t)||v()}var O=a.ComponentBase.extend({defaultProps:{__TYPE:"SpeedDial",id:null,model:null,visible:!1,style:null,className:null,direction:"up",transitionDelay:30,type:"linear",radius:0,mask:!1,disabled:!1,hideOnClickOutside:!0,buttonStyle:null,buttonClassName:null,buttonTemplate:null,"aria-label":null,maskStyle:null,maskClassName:null,showIcon:null,hideIcon:null,rotateAnimation:!0,onVisibleChange:null,onClick:null,onShow:null,onHide:null,children:void 0}});function S(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function P(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?S(Object(n),!0).forEach((function(t){m(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):S(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}var N=s.memo(s.forwardRef((function(e,a){var c,u=g(s.useState(!1),2),p=u[0],f=u[1],d=O.getProps(e),b=O.setMetaData({props:d,state:{visible:p}}).ptm,y=s.useRef(!1),h=s.useRef(null),v=s.useRef(null),S=d.onVisibleChange?d.visible:p,N=g(n.useEventListener({type:"click",listener:function(e){!y.current&&x(e)&&k(),y.current=!1},when:p}),2),w=N[0],j=N[1],I=function(){d.onVisibleChange?d.onVisibleChange(!0):f(!0),d.onShow&&d.onShow()},k=function(){d.onVisibleChange?d.onVisibleChange(!1):f(!1),d.onHide&&d.onHide()},C=function(e){S?k():I(),d.onClick&&d.onClick(e),y.current=!0},E=function(e,t){t.command&&t.command({originalEvent:e,item:t}),k(),y.current=!0,e.preventDefault()},x=function(e){return h.current&&!(h.current.isSameNode(e.target)||h.current.contains(e.target))},M=function(e){return(S?e:d.model.length-e-1)*d.transitionDelay},D=function(e){var t=d.type;if("linear"!==t){var n=d.model.length,r=d.radius||20*n;if("circle"===t){var i=2*Math.PI/n;return{left:"calc(".concat(r*Math.cos(i*e),"px + var(--item-diff-x, 0px))"),top:"calc(".concat(r*Math.sin(i*e),"px + var(--item-diff-y, 0px))")}}if("semi-circle"===t){var o=d.direction,l=Math.PI/(n-1),a="calc(".concat(r*Math.cos(l*e),"px + var(--item-diff-x, 0px))"),c="calc(".concat(r*Math.sin(l*e),"px + var(--item-diff-y, 0px))");if("up"===o)return{left:a,bottom:c};if("down"===o)return{left:a,top:c};if("left"===o)return{right:c,top:a};if("right"===o)return{left:c,top:a}}else if("quarter-circle"===t){var s=d.direction,u=Math.PI/(2*(n-1)),p="calc(".concat(r*Math.cos(u*e),"px + var(--item-diff-x, 0px))"),f="calc(".concat(r*Math.sin(u*e),"px + var(--item-diff-y, 0px))");if("up-left"===s)return{right:p,bottom:f};if("up-right"===s)return{left:p,bottom:f};if("down-left"===s)return{right:f,top:p};if("down-right"===s)return{left:f,top:p}}}return{}},q=function(e){var t=M(e),n=D(e);return P({transitionDelay:"".concat(t,"ms")},n)};n.useMountEffect((function(){if("linear"!==d.type){var e=l.DomHandler.findSingle(h.current,".p-speeddial-button"),t=l.DomHandler.findSingle(v.current,".p-speeddial-item");if(e&&t){var n=Math.abs(e.offsetWidth-t.offsetWidth),r=Math.abs(e.offsetHeight-t.offsetHeight);v.current.style.setProperty("--item-diff-x","".concat(n/2,"px")),v.current.style.setProperty("--item-diff-y","".concat(r/2,"px"))}}})),n.useUpdateEffect((function(){return p&&d.hideOnClickOutside&&w(),function(){d.hideOnClickOutside&&j()}}),[p]),s.useImperativeHandle(a,(function(){return{props:d,show:I,hide:k,getElement:function(){return h.current}}}));var A,H,T=function(e,t){if(!1===e.visible)return null;var n=q(t),r=e.icon,i=e.label,a=e.template,c=e.url,u=e.target,p=l.classNames("p-speeddial-action",{"p-disabled":e.disabled}),f=l.classNames("p-speeddial-action-icon",r),m=l.mergeProps({className:f},b("actionIcon")),y=l.mergeProps({href:c||"#",role:"menuitem",className:p,target:u,"data-pr-tooltip":i,onClick:function(t){return E(t,e)}},b("action")),h=l.IconUtils.getJSXIcon(r,P({},m),{props:d}),v=s.createElement("a",y,h,s.createElement(o.Ripple,null));a&&(v=l.ObjectUtils.getJSXElement(a,e,{onClick:function(t){return E(t,e)},className:p,iconClassName:f,element:v,props:d,visible:S}));var g=l.mergeProps({key:t,className:"p-speeddial-item",style:n,role:"none"},b("menuitem"));return s.createElement("li",g,v)},U=l.classNames("p-speeddial p-component p-speeddial-".concat(d.type),(m(c={},"p-speeddial-direction-".concat(d.direction),"circle"!==d.type),m(c,"p-speeddial-opened",S),m(c,"p-disabled",d.disabled),c),d.className),V=function(){var e,n=!S&&!!d.showIcon||!d.hideIcon,o=S&&!!d.hideIcon,a=l.classNames("p-speeddial-button p-button-rounded",{"p-speeddial-rotate":d.rotateAnimation&&!d.hideIcon},d.buttonClassName),c=l.classNames((m(e={},"".concat(d.showIcon),!S&&!!d.showIcon||!d.hideIcon),m(e,"".concat(d.hideIcon),S&&!!d.hideIcon),e)),u=l.IconUtils.getJSXIcon(n?d.showIcon||s.createElement(i.PlusIcon,{className:c,onClick:C}):o?d.hideIcon||s.createElement(r.MinusIcon,{className:c,onClick:C}):null,{className:c},{props:d,visible:S}),p=l.mergeProps({type:"button",style:d.buttonStyle,className:a,icon:u,onClick:function(e){return C(e)},disabled:d.disabled,"aria-label":d["aria-label"],pt:d.pt&&d.pt.button?d.pt.button:{}}),f=s.createElement(t.Button,p);return d.buttonTemplate?l.ObjectUtils.getJSXElement(d.buttonTemplate,{onClick:C,className:a,iconClassName:c,element:f,props:d,visible:S}):f}(),_=(A=d.model?d.model.map(T):null,H=l.mergeProps({ref:v,className:"p-speeddial-list",role:"menu"},b("menu")),s.createElement("ul",H,A)),R=function(){if(d.mask){var e=l.classNames("p-speeddial-mask",{"p-speeddial-mask-visible":S},d.maskClassName),t=l.mergeProps({className:e,style:d.maskStyle},b("mask"));return s.createElement("div",t)}return null}(),J=l.mergeProps({id:d.id,ref:h,className:U,style:d.style},O.getOtherProps(d),b("root"));return s.createElement(s.Fragment,null,s.createElement("div",J,V,_),R)})));N.displayName="SpeedDial",exports.SpeedDial=N;

package/speeddial/speeddial.d.ts

@@ -9,7 +9,65 @@
  */
 import * as React from 'react';
 import { MenuItem } from '../menuitem';
-import { IconType } from '../utils';
+import { IconType, PassThroughType } from '../utils';
+import { ButtonPassThroughOptions } from '../button/button';
+
+export declare type SpeedDialPassThroughType<T> = PassThroughType<T, SpeedDialPassThroughMethodOptions>;
+
+/**
+ * Custom passthrough(pt) option method.
+ */
+export interface SpeedDialPassThroughMethodOptions {
+    props: SpeedDialProps;
+    state: SpeedDialState;
+}
+
+/**
+ * Custom passthrough(pt) options.
+ * @see {@link SpeedDialProps.pt}
+ */
+export interface SpeedDialPassThroughOptions {
+    /**
+     * Uses to pass attributes to the root's DOM element.
+     */
+    root?: SpeedDialPassThroughType<React.HTMLAttributes<HTMLDivElement>>;
+    /**
+     * Uses to pass attributes to the Button component.
+     *  @see {@link ButtonPassThroughOptions}
+     */
+    button?: ButtonPassThroughOptions;
+    /**
+     * Uses to pass attributes to the menu's DOM element.
+     */
+    menu?: SpeedDialPassThroughType<React.HTMLAttributes<HTMLDivElement>>;
+    /**
+     * Uses to pass attributes to the menu item's DOM element.
+     */
+    menuitem?: SpeedDialPassThroughType<React.HTMLAttributes<HTMLLIElement>>;
+    /**
+     * Uses to pass attributes to the action's DOM element.
+     */
+    action?: SpeedDialPassThroughType<React.HTMLAttributes<HTMLAnchorElement>>;
+    /**
+     * Uses to pass attributes to the action icon's DOM element.
+     */
+    actionIcon?: SpeedDialPassThroughType<React.SVGProps<SVGSVGElement> | React.HTMLAttributes<HTMLSpanElement>>;
+    /**
+     * Uses to pass attributes to the mask's DOM element.
+     */
+    mask?: SpeedDialPassThroughType<React.HTMLAttributes<HTMLDivElement>>;
+}
+
+/**
+ * Defines current inline state in SpeedDial component.
+ */
+export interface SpeedDialState {
+    /**
+     * Current visible state as a boolean.
+     * @defaultValue false
+     */
+    visible: boolean;
+}
 
 /**
  */
@@ -146,6 +204,11 @@ export interface SpeedDialProps extends Omit<React.DetailedHTMLProps<React.HTMLA
      * @readonly
      */
     children?: React.ReactNode | undefined;
+    /**
+     * Uses to pass attributes to DOM elements inside the component.
+     * @type {SpeedDialPassThroughOptions}
+     */
+    pt?: SpeedDialPassThroughOptions;
 }
 
 /**

package/speeddial/speeddial.esm.js

@@ -1,25 +1,11 @@
 import * as React from 'react';
 import { Button } from 'primereact/button';
 import { useEventListener, useMountEffect, useUpdateEffect } from 'primereact/hooks';
-import { Ripple } from 'primereact/ripple';
-import { ObjectUtils, DomHandler, classNames, IconUtils } from 'primereact/utils';
-import { PlusIcon } from 'primereact/icons/plus';
 import { MinusIcon } from 'primereact/icons/minus';
-
-function _extends() {
-  _extends = Object.assign ? Object.assign.bind() : function (target) {
-    for (var i = 1; i < arguments.length; i++) {
-      var source = arguments[i];
-      for (var key in source) {
-        if (Object.prototype.hasOwnProperty.call(source, key)) {
-          target[key] = source[key];
-        }
-      }
-    }
-    return target;
-  };
-  return _extends.apply(this, arguments);
-}
+import { PlusIcon } from 'primereact/icons/plus';
+import { Ripple } from 'primereact/ripple';
+import { DomHandler, classNames, mergeProps, IconUtils, ObjectUtils } from 'primereact/utils';
+import { ComponentBase } from 'primereact/componentbase';
 
 function _typeof(obj) {
   "@babel/helpers - typeof";
@@ -117,7 +103,7 @@ function _slicedToArray(arr, i) {
   return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
 }
 
-var SpeedDialBase = {
+var SpeedDialBase = ComponentBase.extend({
   defaultProps: {
     __TYPE: 'SpeedDial',
     id: null,
@@ -146,24 +132,25 @@ var SpeedDialBase = {
     onShow: null,
     onHide: null,
     children: undefined
-  },
-  getProps: function getProps(props) {
-    return ObjectUtils.getMergedProps(props, SpeedDialBase.defaultProps);
-  },
-  getOtherProps: function getOtherProps(props) {
-    return ObjectUtils.getDiffProps(props, SpeedDialBase.defaultProps);
   }
-};
+});
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var SpeedDial = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (inProps, ref) {
   var _classNames2;
-  var props = SpeedDialBase.getProps(inProps);
   var _React$useState = React.useState(false),
     _React$useState2 = _slicedToArray(_React$useState, 2),
     visibleState = _React$useState2[0],
     setVisibleState = _React$useState2[1];
+  var props = SpeedDialBase.getProps(inProps);
+  var _SpeedDialBase$setMet = SpeedDialBase.setMetaData({
+      props: props,
+      state: {
+        visible: visibleState
+      }
+    }),
+    ptm = _SpeedDialBase$setMet.ptm;
   var isItemClicked = React.useRef(false);
   var elementRef = React.useRef(null);
   var listRef = React.useRef(null);
@@ -189,7 +176,7 @@ var SpeedDial = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function
     props.onVisibleChange ? props.onVisibleChange(false) : setVisibleState(false);
     props.onHide && props.onHide();
   };
-  var onClick = function onClick(e) {
+  var _onClick = function onClick(e) {
     visible ? hide() : show();
     props.onClick && props.onClick(e);
     isItemClicked.current = true;
@@ -329,21 +316,23 @@ var SpeedDial = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function
       'p-disabled': disabled
     });
     var iconClassName = classNames('p-speeddial-action-icon', _icon);
-    var icon = IconUtils.getJSXIcon(_icon, {
-      className: 'p-speeddial-action-icon'
-    }, {
-      props: props
-    });
-    var content = /*#__PURE__*/React.createElement("a", {
+    var actionIconProps = mergeProps({
+      className: iconClassName
+    }, ptm('actionIcon'));
+    var actionProps = mergeProps({
       href: url || '#',
-      role: "menuitem",
+      role: 'menuitem',
       className: contentClassName,
       target: target,
-      "data-pr-tooltip": label,
+      'data-pr-tooltip': label,
       onClick: function onClick(e) {
         return onItemClick(e, item);
       }
-    }, icon, /*#__PURE__*/React.createElement(Ripple, null));
+    }, ptm('action'));
+    var icon = IconUtils.getJSXIcon(_icon, _objectSpread({}, actionIconProps), {
+      props: props
+    });
+    var content = /*#__PURE__*/React.createElement("a", actionProps, icon, /*#__PURE__*/React.createElement(Ripple, null));
     if (template) {
       var defaultContentOptions = {
         onClick: function onClick(e) {
@@ -357,23 +346,25 @@ var SpeedDial = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function
       };
       content = ObjectUtils.getJSXElement(template, item, defaultContentOptions);
     }
-    return /*#__PURE__*/React.createElement("li", {
+    var menuItemProps = mergeProps({
       key: index,
-      className: "p-speeddial-item",
+      className: 'p-speeddial-item',
       style: style,
-      role: "none"
-    }, content);
+      role: 'none'
+    }, ptm('menuitem'));
+    return /*#__PURE__*/React.createElement("li", menuItemProps, content);
   };
   var createItems = function createItems() {
     return props.model ? props.model.map(createItem) : null;
   };
   var createList = function createList() {
     var items = createItems();
-    return /*#__PURE__*/React.createElement("ul", {
+    var menuProps = mergeProps({
       ref: listRef,
-      className: "p-speeddial-list",
-      role: "menu"
-    }, items);
+      className: 'p-speeddial-list',
+      role: 'menu'
+    }, ptm('menu'));
+    return /*#__PURE__*/React.createElement("ul", menuProps, items);
   };
   var createButton = function createButton() {
     var _classNames;
@@ -385,10 +376,10 @@ var SpeedDial = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function
     var iconClassName = classNames((_classNames = {}, _defineProperty(_classNames, "".concat(props.showIcon), !visible && !!props.showIcon || !props.hideIcon), _defineProperty(_classNames, "".concat(props.hideIcon), visible && !!props.hideIcon), _classNames));
     var icon = showIconVisible ? props.showIcon || /*#__PURE__*/React.createElement(PlusIcon, {
       className: iconClassName,
-      onClick: onClick
+      onClick: _onClick
     }) : hideIconVisible ? props.hideIcon || /*#__PURE__*/React.createElement(MinusIcon, {
       className: iconClassName,
-      onClick: onClick
+      onClick: _onClick
     }) : null;
     var toggleIcon = IconUtils.getJSXIcon(icon, {
       className: iconClassName
@@ -396,15 +387,30 @@ var SpeedDial = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function
       props: props,
       visible: visible
     });
-    var content = /*#__PURE__*/React.createElement(Button, {
-      type: "button",
+    var buttonProps = mergeProps({
+      type: 'button',
       style: props.buttonStyle,
       className: className,
       icon: toggleIcon,
-      onClick: onClick,
+      onClick: function onClick(e) {
+        return _onClick(e);
+      },
       disabled: props.disabled,
-      "aria-label": props['aria-label']
+      'aria-label': props['aria-label'],
+      pt: props.pt && props.pt.button ? props.pt.button : {}
     });
+    var content = /*#__PURE__*/React.createElement(Button, buttonProps);
+    if (props.buttonTemplate) {
+      var defaultContentOptions = {
+        onClick: _onClick,
+        className: className,
+        iconClassName: iconClassName,
+        element: content,
+        props: props,
+        visible: visible
+      };
+      return ObjectUtils.getJSXElement(props.buttonTemplate, defaultContentOptions);
+    }
     return content;
   };
   var createMask = function createMask() {
@@ -412,24 +418,25 @@ var SpeedDial = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function
       var _className = classNames('p-speeddial-mask', {
         'p-speeddial-mask-visible': visible
       }, props.maskClassName);
-      return /*#__PURE__*/React.createElement("div", {
+      var maskProps = mergeProps({
         className: _className,
         style: props.maskStyle
-      });
+      }, ptm('mask'));
+      return /*#__PURE__*/React.createElement("div", maskProps);
     }
     return null;
   };
-  var otherProps = SpeedDialBase.getOtherProps(props);
   var className = classNames("p-speeddial p-component p-speeddial-".concat(props.type), (_classNames2 = {}, _defineProperty(_classNames2, "p-speeddial-direction-".concat(props.direction), props.type !== 'circle'), _defineProperty(_classNames2, 'p-speeddial-opened', visible), _defineProperty(_classNames2, 'p-disabled', props.disabled), _classNames2), props.className);
   var button = createButton();
   var list = createList();
   var mask = createMask();
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", _extends({
-    ref: elementRef,
+  var rootProps = mergeProps({
     id: props.id,
+    ref: elementRef,
     className: className,
     style: props.style
-  }, otherProps), button, list), mask);
+  }, SpeedDialBase.getOtherProps(props), ptm('root'));
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", rootProps, button, list), mask);
 }));
 SpeedDial.displayName = 'SpeedDial';
 

package/speeddial/speeddial.esm.min.js

@@ -1 +1 @@
-import*as e from"react";import{Button as t}from"primereact/button";import{useEventListener as n,useMountEffect as r,useUpdateEffect as i}from"primereact/hooks";import{Ripple as o}from"primereact/ripple";import{ObjectUtils as l,DomHandler as a,classNames as c,IconUtils as u}from"primereact/utils";import{PlusIcon as s}from"primereact/icons/plus";import{MinusIcon as p}from"primereact/icons/minus";function f(){return f=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},f.apply(this,arguments)}function m(e){return m="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},m(e)}function d(e,t){if("object"!==m(e)||null===e)return e;var n=e[Symbol.toPrimitive];if(void 0!==n){var r=n.call(e,t||"default");if("object"!==m(r))return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}function b(e){var t=d(e,"string");return"symbol"===m(t)?t:String(t)}function y(e,t,n){return(t=b(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function h(e){if(Array.isArray(e))return e}function v(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var r,i,o,l,a=[],c=!0,u=!1;try{if(o=(n=n.call(e)).next,0===t){if(Object(n)!==n)return;c=!1}else for(;!(c=(r=o.call(n)).done)&&(a.push(r.value),a.length!==t);c=!0);}catch(e){u=!0,i=e}finally{try{if(!c&&null!=n.return&&(l=n.return(),Object(l)!==l))return}finally{if(u)throw i}}return a}}function g(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}function O(e,t){if(e){if("string"==typeof e)return g(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?g(e,t):void 0}}function S(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function w(e,t){return h(e)||v(e,t)||O(e,t)||S()}var P={defaultProps:{__TYPE:"SpeedDial",id:null,model:null,visible:!1,style:null,className:null,direction:"up",transitionDelay:30,type:"linear",radius:0,mask:!1,disabled:!1,hideOnClickOutside:!0,buttonStyle:null,buttonClassName:null,buttonTemplate:null,"aria-label":null,maskStyle:null,maskClassName:null,showIcon:null,hideIcon:null,rotateAnimation:!0,onVisibleChange:null,onClick:null,onShow:null,onHide:null,children:void 0},getProps:function(e){return l.getMergedProps(e,P.defaultProps)},getOtherProps:function(e){return l.getDiffProps(e,P.defaultProps)}};function k(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function C(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?k(Object(n),!0).forEach((function(t){y(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):k(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}var j=e.memo(e.forwardRef((function(m,d){var b,h=P.getProps(m),v=w(e.useState(!1),2),g=v[0],O=v[1],S=e.useRef(!1),k=e.useRef(null),j=e.useRef(null),I=h.onVisibleChange?h.visible:g,N=w(n({type:"click",listener:function(e){!S.current&&V(e)&&D(),S.current=!1},when:g}),2),x=N[0],E=N[1],M=function(){h.onVisibleChange?h.onVisibleChange(!0):O(!0),h.onShow&&h.onShow()},D=function(){h.onVisibleChange?h.onVisibleChange(!1):O(!1),h.onHide&&h.onHide()},A=function(e){I?D():M(),h.onClick&&h.onClick(e),S.current=!0},H=function(e,t){t.command&&t.command({originalEvent:e,item:t}),D(),S.current=!0,e.preventDefault()},V=function(e){return k.current&&!(k.current.isSameNode(e.target)||k.current.contains(e.target))},R=function(e){return(I?e:h.model.length-e-1)*h.transitionDelay},T=function(e){var t=h.type;if("linear"!==t){var n=h.model.length,r=h.radius||20*n;if("circle"===t){var i=2*Math.PI/n;return{left:"calc(".concat(r*Math.cos(i*e),"px + var(--item-diff-x, 0px))"),top:"calc(".concat(r*Math.sin(i*e),"px + var(--item-diff-y, 0px))")}}if("semi-circle"===t){var o=h.direction,l=Math.PI/(n-1),a="calc(".concat(r*Math.cos(l*e),"px + var(--item-diff-x, 0px))"),c="calc(".concat(r*Math.sin(l*e),"px + var(--item-diff-y, 0px))");if("up"===o)return{left:a,bottom:c};if("down"===o)return{left:a,top:c};if("left"===o)return{right:c,top:a};if("right"===o)return{left:c,top:a}}else if("quarter-circle"===t){var u=h.direction,s=Math.PI/(2*(n-1)),p="calc(".concat(r*Math.cos(s*e),"px + var(--item-diff-x, 0px))"),f="calc(".concat(r*Math.sin(s*e),"px + var(--item-diff-y, 0px))");if("up-left"===u)return{right:p,bottom:f};if("up-right"===u)return{left:p,bottom:f};if("down-left"===u)return{right:f,top:p};if("down-right"===u)return{left:f,top:p}}}return{}},J=function(e){var t=R(e),n=T(e);return C({transitionDelay:"".concat(t,"ms")},n)};r((function(){if("linear"!==h.type){var e=a.findSingle(k.current,".p-speeddial-button"),t=a.findSingle(j.current,".p-speeddial-item");if(e&&t){var n=Math.abs(e.offsetWidth-t.offsetWidth),r=Math.abs(e.offsetHeight-t.offsetHeight);j.current.style.setProperty("--item-diff-x","".concat(n/2,"px")),j.current.style.setProperty("--item-diff-y","".concat(r/2,"px"))}}})),i((function(){return g&&h.hideOnClickOutside&&x(),function(){h.hideOnClickOutside&&E()}}),[g]),e.useImperativeHandle(d,(function(){return{props:h,show:M,hide:D,getElement:function(){return k.current}}}));var X,W=function(t,n){if(!1===t.visible)return null;var r=J(n),i=t.icon,a=t.label,s=t.template,p=t.url,f=t.target,m=c("p-speeddial-action",{"p-disabled":t.disabled}),d=c("p-speeddial-action-icon",i),b=u.getJSXIcon(i,{className:"p-speeddial-action-icon"},{props:h}),y=e.createElement("a",{href:p||"#",role:"menuitem",className:m,target:f,"data-pr-tooltip":a,onClick:function(e){return H(e,t)}},b,e.createElement(o,null));s&&(y=l.getJSXElement(s,t,{onClick:function(e){return H(e,t)},className:m,iconClassName:d,element:y,props:h,visible:I}));return e.createElement("li",{key:n,className:"p-speeddial-item",style:r,role:"none"},y)},_=P.getOtherProps(h),q=c("p-speeddial p-component p-speeddial-".concat(h.type),(y(b={},"p-speeddial-direction-".concat(h.direction),"circle"!==h.type),y(b,"p-speeddial-opened",I),y(b,"p-disabled",h.disabled),b),h.className),F=function(){var n,r=!I&&!!h.showIcon||!h.hideIcon,i=I&&!!h.hideIcon,o=c("p-speeddial-button p-button-rounded",{"p-speeddial-rotate":h.rotateAnimation&&!h.hideIcon},h.buttonClassName),l=c((y(n={},"".concat(h.showIcon),!I&&!!h.showIcon||!h.hideIcon),y(n,"".concat(h.hideIcon),I&&!!h.hideIcon),n)),a=u.getJSXIcon(r?h.showIcon||e.createElement(s,{className:l,onClick:A}):i?h.hideIcon||e.createElement(p,{className:l,onClick:A}):null,{className:l},{props:h,visible:I});return e.createElement(t,{type:"button",style:h.buttonStyle,className:o,icon:a,onClick:A,disabled:h.disabled,"aria-label":h["aria-label"]})}(),U=(X=h.model?h.model.map(W):null,e.createElement("ul",{ref:j,className:"p-speeddial-list",role:"menu"},X)),Y=function(){if(h.mask){var t=c("p-speeddial-mask",{"p-speeddial-mask-visible":I},h.maskClassName);return e.createElement("div",{className:t,style:h.maskStyle})}return null}();return e.createElement(e.Fragment,null,e.createElement("div",f({ref:k,id:h.id,className:q,style:h.style},_),F,U),Y)})));j.displayName="SpeedDial";export{j as SpeedDial};
+import*as e from"react";import{Button as t}from"primereact/button";import{useEventListener as n,useMountEffect as r,useUpdateEffect as i}from"primereact/hooks";import{MinusIcon as o}from"primereact/icons/minus";import{PlusIcon as l}from"primereact/icons/plus";import{Ripple as a}from"primereact/ripple";import{DomHandler as c,classNames as u,mergeProps as s,IconUtils as p,ObjectUtils as f}from"primereact/utils";import{ComponentBase as m}from"primereact/componentbase";function d(e){return d="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},d(e)}function b(e,t){if("object"!==d(e)||null===e)return e;var n=e[Symbol.toPrimitive];if(void 0!==n){var r=n.call(e,t||"default");if("object"!==d(r))return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}function y(e){var t=b(e,"string");return"symbol"===d(t)?t:String(t)}function h(e,t,n){return(t=y(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function v(e){if(Array.isArray(e))return e}function g(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var r,i,o,l,a=[],c=!0,u=!1;try{if(o=(n=n.call(e)).next,0===t){if(Object(n)!==n)return;c=!1}else for(;!(c=(r=o.call(n)).done)&&(a.push(r.value),a.length!==t);c=!0);}catch(e){u=!0,i=e}finally{try{if(!c&&null!=n.return&&(l=n.return(),Object(l)!==l))return}finally{if(u)throw i}}return a}}function S(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}function O(e,t){if(e){if("string"==typeof e)return S(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?S(e,t):void 0}}function w(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function k(e,t){return v(e)||g(e,t)||O(e,t)||w()}var C=m.extend({defaultProps:{__TYPE:"SpeedDial",id:null,model:null,visible:!1,style:null,className:null,direction:"up",transitionDelay:30,type:"linear",radius:0,mask:!1,disabled:!1,hideOnClickOutside:!0,buttonStyle:null,buttonClassName:null,buttonTemplate:null,"aria-label":null,maskStyle:null,maskClassName:null,showIcon:null,hideIcon:null,rotateAnimation:!0,onVisibleChange:null,onClick:null,onShow:null,onHide:null,children:void 0}});function I(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function N(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?I(Object(n),!0).forEach((function(t){h(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):I(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}var x=e.memo(e.forwardRef((function(m,d){var b,y=k(e.useState(!1),2),v=y[0],g=y[1],S=C.getProps(m),O=C.setMetaData({props:S,state:{visible:v}}).ptm,w=e.useRef(!1),I=e.useRef(null),x=e.useRef(null),P=S.onVisibleChange?S.visible:v,j=k(n({type:"click",listener:function(e){!w.current&&V(e)&&A(),w.current=!1},when:v}),2),E=j[0],M=j[1],D=function(){S.onVisibleChange?S.onVisibleChange(!0):g(!0),S.onShow&&S.onShow()},A=function(){S.onVisibleChange?S.onVisibleChange(!1):g(!1),S.onHide&&S.onHide()},H=function(e){P?A():D(),S.onClick&&S.onClick(e),w.current=!0},T=function(e,t){t.command&&t.command({originalEvent:e,item:t}),A(),w.current=!0,e.preventDefault()},V=function(e){return I.current&&!(I.current.isSameNode(e.target)||I.current.contains(e.target))},J=function(e){return(P?e:S.model.length-e-1)*S.transitionDelay},R=function(e){var t=S.type;if("linear"!==t){var n=S.model.length,r=S.radius||20*n;if("circle"===t){var i=2*Math.PI/n;return{left:"calc(".concat(r*Math.cos(i*e),"px + var(--item-diff-x, 0px))"),top:"calc(".concat(r*Math.sin(i*e),"px + var(--item-diff-y, 0px))")}}if("semi-circle"===t){var o=S.direction,l=Math.PI/(n-1),a="calc(".concat(r*Math.cos(l*e),"px + var(--item-diff-x, 0px))"),c="calc(".concat(r*Math.sin(l*e),"px + var(--item-diff-y, 0px))");if("up"===o)return{left:a,bottom:c};if("down"===o)return{left:a,top:c};if("left"===o)return{right:c,top:a};if("right"===o)return{left:c,top:a}}else if("quarter-circle"===t){var u=S.direction,s=Math.PI/(2*(n-1)),p="calc(".concat(r*Math.cos(s*e),"px + var(--item-diff-x, 0px))"),f="calc(".concat(r*Math.sin(s*e),"px + var(--item-diff-y, 0px))");if("up-left"===u)return{right:p,bottom:f};if("up-right"===u)return{left:p,bottom:f};if("down-left"===u)return{right:f,top:p};if("down-right"===u)return{left:f,top:p}}}return{}},X=function(e){var t=J(e),n=R(e);return N({transitionDelay:"".concat(t,"ms")},n)};r((function(){if("linear"!==S.type){var e=c.findSingle(I.current,".p-speeddial-button"),t=c.findSingle(x.current,".p-speeddial-item");if(e&&t){var n=Math.abs(e.offsetWidth-t.offsetWidth),r=Math.abs(e.offsetHeight-t.offsetHeight);x.current.style.setProperty("--item-diff-x","".concat(n/2,"px")),x.current.style.setProperty("--item-diff-y","".concat(r/2,"px"))}}})),i((function(){return v&&S.hideOnClickOutside&&E(),function(){S.hideOnClickOutside&&M()}}),[v]),e.useImperativeHandle(d,(function(){return{props:S,show:D,hide:A,getElement:function(){return I.current}}}));var W,_,q=function(t,n){if(!1===t.visible)return null;var r=X(n),i=t.icon,o=t.label,l=t.template,c=t.url,m=t.target,d=u("p-speeddial-action",{"p-disabled":t.disabled}),b=u("p-speeddial-action-icon",i),y=s({className:b},O("actionIcon")),h=s({href:c||"#",role:"menuitem",className:d,target:m,"data-pr-tooltip":o,onClick:function(e){return T(e,t)}},O("action")),v=p.getJSXIcon(i,N({},y),{props:S}),g=e.createElement("a",h,v,e.createElement(a,null));l&&(g=f.getJSXElement(l,t,{onClick:function(e){return T(e,t)},className:d,iconClassName:b,element:g,props:S,visible:P}));var w=s({key:n,className:"p-speeddial-item",style:r,role:"none"},O("menuitem"));return e.createElement("li",w,g)},F=u("p-speeddial p-component p-speeddial-".concat(S.type),(h(b={},"p-speeddial-direction-".concat(S.direction),"circle"!==S.type),h(b,"p-speeddial-opened",P),h(b,"p-disabled",S.disabled),b),S.className),U=function(){var n,r=!P&&!!S.showIcon||!S.hideIcon,i=P&&!!S.hideIcon,a=u("p-speeddial-button p-button-rounded",{"p-speeddial-rotate":S.rotateAnimation&&!S.hideIcon},S.buttonClassName),c=u((h(n={},"".concat(S.showIcon),!P&&!!S.showIcon||!S.hideIcon),h(n,"".concat(S.hideIcon),P&&!!S.hideIcon),n)),m=p.getJSXIcon(r?S.showIcon||e.createElement(l,{className:c,onClick:H}):i?S.hideIcon||e.createElement(o,{className:c,onClick:H}):null,{className:c},{props:S,visible:P}),d=s({type:"button",style:S.buttonStyle,className:a,icon:m,onClick:function(e){return H(e)},disabled:S.disabled,"aria-label":S["aria-label"],pt:S.pt&&S.pt.button?S.pt.button:{}}),b=e.createElement(t,d);return S.buttonTemplate?f.getJSXElement(S.buttonTemplate,{onClick:H,className:a,iconClassName:c,element:b,props:S,visible:P}):b}(),Y=(W=S.model?S.model.map(q):null,_=s({ref:x,className:"p-speeddial-list",role:"menu"},O("menu")),e.createElement("ul",_,W)),$=function(){if(S.mask){var t=u("p-speeddial-mask",{"p-speeddial-mask-visible":P},S.maskClassName),n=s({className:t,style:S.maskStyle},O("mask"));return e.createElement("div",n)}return null}(),z=s({id:S.id,ref:I,className:F,style:S.style},C.getOtherProps(S),O("root"));return e.createElement(e.Fragment,null,e.createElement("div",z,U,Y),$)})));x.displayName="SpeedDial";export{x as SpeedDial};

package/speeddial/speeddial.js

@@ -1,5 +1,5 @@
 this.primereact = this.primereact || {};
-this.primereact.speeddial = (function (exports, React, button, hooks, ripple, utils, plus, minus) {
+this.primereact.speeddial = (function (exports, React, button, hooks, minus, plus, ripple, utils, componentbase) {
   'use strict';
 
   function _interopNamespace(e) {
@@ -22,21 +22,6 @@ this.primereact.speeddial = (function (exports, React, button, hooks, ripple, ut
 
   var React__namespace = /*#__PURE__*/_interopNamespace(React);
 
-  function _extends() {
-    _extends = Object.assign ? Object.assign.bind() : function (target) {
-      for (var i = 1; i < arguments.length; i++) {
-        var source = arguments[i];
-        for (var key in source) {
-          if (Object.prototype.hasOwnProperty.call(source, key)) {
-            target[key] = source[key];
-          }
-        }
-      }
-      return target;
-    };
-    return _extends.apply(this, arguments);
-  }
-
   function _typeof(obj) {
     "@babel/helpers - typeof";
 
@@ -133,7 +118,7 @@ this.primereact.speeddial = (function (exports, React, button, hooks, ripple, ut
     return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
   }
 
-  var SpeedDialBase = {
+  var SpeedDialBase = componentbase.ComponentBase.extend({
     defaultProps: {
       __TYPE: 'SpeedDial',
       id: null,
@@ -162,24 +147,25 @@ this.primereact.speeddial = (function (exports, React, button, hooks, ripple, ut
       onShow: null,
       onHide: null,
       children: undefined
-    },
-    getProps: function getProps(props) {
-      return utils.ObjectUtils.getMergedProps(props, SpeedDialBase.defaultProps);
-    },
-    getOtherProps: function getOtherProps(props) {
-      return utils.ObjectUtils.getDiffProps(props, SpeedDialBase.defaultProps);
     }
-  };
+  });
 
   function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
   function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
   var SpeedDial = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
     var _classNames2;
-    var props = SpeedDialBase.getProps(inProps);
     var _React$useState = React__namespace.useState(false),
       _React$useState2 = _slicedToArray(_React$useState, 2),
       visibleState = _React$useState2[0],
       setVisibleState = _React$useState2[1];
+    var props = SpeedDialBase.getProps(inProps);
+    var _SpeedDialBase$setMet = SpeedDialBase.setMetaData({
+        props: props,
+        state: {
+          visible: visibleState
+        }
+      }),
+      ptm = _SpeedDialBase$setMet.ptm;
     var isItemClicked = React__namespace.useRef(false);
     var elementRef = React__namespace.useRef(null);
     var listRef = React__namespace.useRef(null);
@@ -205,7 +191,7 @@ this.primereact.speeddial = (function (exports, React, button, hooks, ripple, ut
       props.onVisibleChange ? props.onVisibleChange(false) : setVisibleState(false);
       props.onHide && props.onHide();
     };
-    var onClick = function onClick(e) {
+    var _onClick = function onClick(e) {
       visible ? hide() : show();
       props.onClick && props.onClick(e);
       isItemClicked.current = true;
@@ -345,21 +331,23 @@ this.primereact.speeddial = (function (exports, React, button, hooks, ripple, ut
         'p-disabled': disabled
       });
       var iconClassName = utils.classNames('p-speeddial-action-icon', _icon);
-      var icon = utils.IconUtils.getJSXIcon(_icon, {
-        className: 'p-speeddial-action-icon'
-      }, {
-        props: props
-      });
-      var content = /*#__PURE__*/React__namespace.createElement("a", {
+      var actionIconProps = utils.mergeProps({
+        className: iconClassName
+      }, ptm('actionIcon'));
+      var actionProps = utils.mergeProps({
         href: url || '#',
-        role: "menuitem",
+        role: 'menuitem',
         className: contentClassName,
         target: target,
-        "data-pr-tooltip": label,
+        'data-pr-tooltip': label,
         onClick: function onClick(e) {
           return onItemClick(e, item);
         }
-      }, icon, /*#__PURE__*/React__namespace.createElement(ripple.Ripple, null));
+      }, ptm('action'));
+      var icon = utils.IconUtils.getJSXIcon(_icon, _objectSpread({}, actionIconProps), {
+        props: props
+      });
+      var content = /*#__PURE__*/React__namespace.createElement("a", actionProps, icon, /*#__PURE__*/React__namespace.createElement(ripple.Ripple, null));
       if (template) {
         var defaultContentOptions = {
           onClick: function onClick(e) {
@@ -373,23 +361,25 @@ this.primereact.speeddial = (function (exports, React, button, hooks, ripple, ut
         };
         content = utils.ObjectUtils.getJSXElement(template, item, defaultContentOptions);
       }
-      return /*#__PURE__*/React__namespace.createElement("li", {
+      var menuItemProps = utils.mergeProps({
         key: index,
-        className: "p-speeddial-item",
+        className: 'p-speeddial-item',
         style: style,
-        role: "none"
-      }, content);
+        role: 'none'
+      }, ptm('menuitem'));
+      return /*#__PURE__*/React__namespace.createElement("li", menuItemProps, content);
     };
     var createItems = function createItems() {
       return props.model ? props.model.map(createItem) : null;
     };
     var createList = function createList() {
       var items = createItems();
-      return /*#__PURE__*/React__namespace.createElement("ul", {
+      var menuProps = utils.mergeProps({
         ref: listRef,
-        className: "p-speeddial-list",
-        role: "menu"
-      }, items);
+        className: 'p-speeddial-list',
+        role: 'menu'
+      }, ptm('menu'));
+      return /*#__PURE__*/React__namespace.createElement("ul", menuProps, items);
     };
     var createButton = function createButton() {
       var _classNames;
@@ -401,10 +391,10 @@ this.primereact.speeddial = (function (exports, React, button, hooks, ripple, ut
       var iconClassName = utils.classNames((_classNames = {}, _defineProperty(_classNames, "".concat(props.showIcon), !visible && !!props.showIcon || !props.hideIcon), _defineProperty(_classNames, "".concat(props.hideIcon), visible && !!props.hideIcon), _classNames));
       var icon = showIconVisible ? props.showIcon || /*#__PURE__*/React__namespace.createElement(plus.PlusIcon, {
         className: iconClassName,
-        onClick: onClick
+        onClick: _onClick
       }) : hideIconVisible ? props.hideIcon || /*#__PURE__*/React__namespace.createElement(minus.MinusIcon, {
         className: iconClassName,
-        onClick: onClick
+        onClick: _onClick
       }) : null;
       var toggleIcon = utils.IconUtils.getJSXIcon(icon, {
         className: iconClassName
@@ -412,15 +402,30 @@ this.primereact.speeddial = (function (exports, React, button, hooks, ripple, ut
         props: props,
         visible: visible
       });
-      var content = /*#__PURE__*/React__namespace.createElement(button.Button, {
-        type: "button",
+      var buttonProps = utils.mergeProps({
+        type: 'button',
         style: props.buttonStyle,
         className: className,
         icon: toggleIcon,
-        onClick: onClick,
+        onClick: function onClick(e) {
+          return _onClick(e);
+        },
         disabled: props.disabled,
-        "aria-label": props['aria-label']
+        'aria-label': props['aria-label'],
+        pt: props.pt && props.pt.button ? props.pt.button : {}
       });
+      var content = /*#__PURE__*/React__namespace.createElement(button.Button, buttonProps);
+      if (props.buttonTemplate) {
+        var defaultContentOptions = {
+          onClick: _onClick,
+          className: className,
+          iconClassName: iconClassName,
+          element: content,
+          props: props,
+          visible: visible
+        };
+        return utils.ObjectUtils.getJSXElement(props.buttonTemplate, defaultContentOptions);
+      }
       return content;
     };
     var createMask = function createMask() {
@@ -428,24 +433,25 @@ this.primereact.speeddial = (function (exports, React, button, hooks, ripple, ut
         var _className = utils.classNames('p-speeddial-mask', {
           'p-speeddial-mask-visible': visible
         }, props.maskClassName);
-        return /*#__PURE__*/React__namespace.createElement("div", {
+        var maskProps = utils.mergeProps({
           className: _className,
           style: props.maskStyle
-        });
+        }, ptm('mask'));
+        return /*#__PURE__*/React__namespace.createElement("div", maskProps);
       }
       return null;
     };
-    var otherProps = SpeedDialBase.getOtherProps(props);
     var className = utils.classNames("p-speeddial p-component p-speeddial-".concat(props.type), (_classNames2 = {}, _defineProperty(_classNames2, "p-speeddial-direction-".concat(props.direction), props.type !== 'circle'), _defineProperty(_classNames2, 'p-speeddial-opened', visible), _defineProperty(_classNames2, 'p-disabled', props.disabled), _classNames2), props.className);
     var button$1 = createButton();
     var list = createList();
     var mask = createMask();
-    return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement("div", _extends({
-      ref: elementRef,
+    var rootProps = utils.mergeProps({
       id: props.id,
+      ref: elementRef,
       className: className,
       style: props.style
-    }, otherProps), button$1, list), mask);
+    }, SpeedDialBase.getOtherProps(props), ptm('root'));
+    return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement("div", rootProps, button$1, list), mask);
   }));
   SpeedDial.displayName = 'SpeedDial';
 
@@ -455,4 +461,4 @@ this.primereact.speeddial = (function (exports, React, button, hooks, ripple, ut
 
   return exports;
 
-})({}, React, primereact.button, primereact.hooks, primereact.ripple, primereact.utils, primereact.icons/plus, primereact.icons/minus);
+})({}, React, primereact.button, primereact.hooks, primereact.icons.minus, primereact.icons.plus, primereact.ripple, primereact.utils, primereact.componentbase);