primereact 10.2.1 → 10.3.1

package/divider/divider.min.js

@@ -1 +1 @@
-this.primereact=this.primereact||{},this.primereact.divider=function(e,n,t,i,r){"use strict";function l(e){if(e&&e.__esModule)return e;var n=Object.create(null);return e&&Object.keys(e).forEach((function(t){if("default"!==t){var i=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(n,t,i.get?i:{enumerable:!0,get:function(){return e[t]}})}})),n.default=e,Object.freeze(n)}var o=l(n),d=i.ComponentBase.extend({defaultProps:{__TYPE:"Divider",align:null,layout:"horizontal",type:"solid",style:null,className:null,children:void 0},css:{classes:{root:function(e){var n=e.props,i=e.horizontal,r=e.vertical;return t.classNames("p-divider p-component p-divider-".concat(n.layout," p-divider-").concat(n.type),{"p-divider-left":i&&(!n.align||"left"===n.align),"p-divider-right":i&&"right"===n.align,"p-divider-center":i&&"center"===n.align||r&&(!n.align||"center"===n.align),"p-divider-top":r&&"top"===n.align,"p-divider-bottom":r&&"bottom"===n.align},n.className)},content:"p-divider-content"},styles:'\n@layer primereact {\n    .p-divider-horizontal {\n        display: flex;\n        width: 100%;\n        position: relative;\n        align-items: center;\n    }\n    \n    .p-divider-horizontal:before {\n        position: absolute;\n        display: block;\n        top: 50%;\n        left: 0;\n        width: 100%;\n        content: "";\n    }\n    \n    .p-divider-horizontal.p-divider-left {\n        justify-content: flex-start;\n    }\n    \n    .p-divider-horizontal.p-divider-right {\n        justify-content: flex-end;\n    }\n    \n    .p-divider-horizontal.p-divider-center {\n        justify-content: center;\n    }\n    \n    .p-divider-content {\n        z-index: 1;\n    }\n    \n    .p-divider-vertical {\n        min-height: 100%;\n        margin: 0 1rem;\n        display: flex;\n        position: relative;\n        justify-content: center;\n    }\n    \n    .p-divider-vertical:before {\n        position: absolute;\n        display: block;\n        top: 0;\n        left: 50%;\n        height: 100%;\n        content: "";\n    }\n    \n    .p-divider-vertical.p-divider-top {\n        align-items: flex-start;\n    }\n    \n    .p-divider-vertical.p-divider-center {\n        align-items: center;\n    }\n    \n    .p-divider-vertical.p-divider-bottom {\n        align-items: flex-end;\n    }\n    \n    .p-divider-solid.p-divider-horizontal:before {\n        border-top-style: solid;\n    }\n    \n    .p-divider-solid.p-divider-vertical:before {\n        border-left-style: solid;\n    }\n    \n    .p-divider-dashed.p-divider-horizontal:before {\n        border-top-style: dashed;\n    }\n    \n    .p-divider-dashed.p-divider-vertical:before {\n        border-left-style: dashed;\n    }\n    \n    .p-divider-dotted.p-divider-horizontal:before {\n        border-top-style: dotted;\n    }\n    \n    .p-divider-dotted.p-divider-horizontal:before {\n        border-left-style: dotted;\n    }\n}\n',inlineStyles:{root:function(e){var n=e.props;return{justifyContent:"horizontal"===n.layout?"center"===n.align||null===n.align?"center":"left"===n.align?"flex-start":"right"===n.align?"flex-end":null:null,alignItems:"vertical"===n.layout?"center"===n.align||null===n.align?"center":"top"===n.align?"flex-start":"bottom"===n.align?"flex-end":null:null}}}}}),a=o.forwardRef((function(e,n){var l=o.useContext(r.PrimeReactContext),a=d.getProps(e,l),s=d.setMetaData({props:a}),p=s.ptm,c=s.cx,v=s.sx;i.useHandleStyle(d.css.styles,s.isUnstyled,{name:"divider"});var u=o.useRef(null),f="horizontal"===a.layout,m="vertical"===a.layout;o.useImperativeHandle(n,(function(){return{props:a,getElement:function(){return u.current}}}));var g=t.mergeProps({ref:u,style:v("root"),className:c("root",{horizontal:f,vertical:m}),role:"separator"},d.getOtherProps(a),p("root")),y=t.mergeProps({className:c("content")},p("content"));return o.createElement("div",g,o.createElement("div",y,a.children))}));return a.displayName="Divider",e.Divider=a,Object.defineProperty(e,"__esModule",{value:!0}),e}({},React,primereact.utils,primereact.componentbase,primereact.api);
+this.primereact=this.primereact||{},this.primereact.divider=function(e,n,t,i,r){"use strict";function o(e){if(e&&e.__esModule)return e;var n=Object.create(null);return e&&Object.keys(e).forEach((function(t){if("default"!==t){var i=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(n,t,i.get?i:{enumerable:!0,get:function(){return e[t]}})}})),n.default=e,Object.freeze(n)}var l=o(n),d=i.ComponentBase.extend({defaultProps:{__TYPE:"Divider",align:null,layout:"horizontal",type:"solid",style:null,className:null,children:void 0},css:{classes:{root:function(e){var n=e.props,i=e.horizontal,r=e.vertical;return t.classNames("p-divider p-component p-divider-".concat(n.layout," p-divider-").concat(n.type),{"p-divider-left":i&&(!n.align||"left"===n.align),"p-divider-right":i&&"right"===n.align,"p-divider-center":i&&"center"===n.align||r&&(!n.align||"center"===n.align),"p-divider-top":r&&"top"===n.align,"p-divider-bottom":r&&"bottom"===n.align},n.className)},content:"p-divider-content"},styles:'\n@layer primereact {\n    .p-divider-horizontal {\n        display: flex;\n        width: 100%;\n        position: relative;\n        align-items: center;\n    }\n    \n    .p-divider-horizontal:before {\n        position: absolute;\n        display: block;\n        top: 50%;\n        left: 0;\n        width: 100%;\n        content: "";\n    }\n    \n    .p-divider-horizontal.p-divider-left {\n        justify-content: flex-start;\n    }\n    \n    .p-divider-horizontal.p-divider-right {\n        justify-content: flex-end;\n    }\n    \n    .p-divider-horizontal.p-divider-center {\n        justify-content: center;\n    }\n    \n    .p-divider-content {\n        z-index: 1;\n    }\n    \n    .p-divider-vertical {\n        min-height: 100%;\n        margin: 0 1rem;\n        display: flex;\n        position: relative;\n        justify-content: center;\n    }\n    \n    .p-divider-vertical:before {\n        position: absolute;\n        display: block;\n        top: 0;\n        left: 50%;\n        height: 100%;\n        content: "";\n    }\n    \n    .p-divider-vertical.p-divider-top {\n        align-items: flex-start;\n    }\n    \n    .p-divider-vertical.p-divider-center {\n        align-items: center;\n    }\n    \n    .p-divider-vertical.p-divider-bottom {\n        align-items: flex-end;\n    }\n    \n    .p-divider-solid.p-divider-horizontal:before {\n        border-top-style: solid;\n    }\n    \n    .p-divider-solid.p-divider-vertical:before {\n        border-left-style: solid;\n    }\n    \n    .p-divider-dashed.p-divider-horizontal:before {\n        border-top-style: dashed;\n    }\n    \n    .p-divider-dashed.p-divider-vertical:before {\n        border-left-style: dashed;\n    }\n    \n    .p-divider-dotted.p-divider-horizontal:before {\n        border-top-style: dotted;\n    }\n    \n    .p-divider-dotted.p-divider-horizontal:before {\n        border-left-style: dotted;\n    }\n}\n',inlineStyles:{root:function(e){var n=e.props;return{justifyContent:"horizontal"===n.layout?"center"===n.align||null===n.align?"center":"left"===n.align?"flex-start":"right"===n.align?"flex-end":null:null,alignItems:"vertical"===n.layout?"center"===n.align||null===n.align?"center":"top"===n.align?"flex-start":"bottom"===n.align?"flex-end":null:null}}}}}),a=l.forwardRef((function(e,n){var o=l.useContext(r.PrimeReactContext),a=d.getProps(e,o),s=d.setMetaData({props:a}),p=s.ptm,c=s.cx,v=s.sx;i.useHandleStyle(d.css.styles,s.isUnstyled,{name:"divider"});var u=l.useRef(null),f="horizontal"===a.layout,m="vertical"===a.layout;l.useImperativeHandle(n,(function(){return{props:a,getElement:function(){return u.current}}}));var g=t.mergeProps({ref:u,style:v("root"),className:c("root",{horizontal:f,vertical:m}),"aria-orientation":a.layout,role:"separator"},d.getOtherProps(a),p("root")),y=t.mergeProps({className:c("content")},p("content"));return l.createElement("div",g,l.createElement("div",y,a.children))}));return a.displayName="Divider",e.Divider=a,Object.defineProperty(e,"__esModule",{value:!0}),e}({},React,primereact.utils,primereact.componentbase,primereact.api);

package/dock/dock.cjs.js

@@ -86,6 +86,37 @@ function _defineProperty(obj, key, value) {
   return obj;
 }
 
+function _arrayLikeToArray(arr, len) {
+  if (len == null || len > arr.length) len = arr.length;
+  for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
+  return arr2;
+}
+
+function _arrayWithoutHoles(arr) {
+  if (Array.isArray(arr)) return _arrayLikeToArray(arr);
+}
+
+function _iterableToArray(iter) {
+  if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
+}
+
+function _unsupportedIterableToArray(o, minLen) {
+  if (!o) return;
+  if (typeof o === "string") return _arrayLikeToArray(o, minLen);
+  var n = Object.prototype.toString.call(o).slice(8, -1);
+  if (n === "Object" && o.constructor) n = o.constructor.name;
+  if (n === "Map" || n === "Set") return Array.from(o);
+  if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
+}
+
+function _nonIterableSpread() {
+  throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+}
+
+function _toConsumableArray(arr) {
+  return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread();
+}
+
 function _arrayWithHoles(arr) {
   if (Array.isArray(arr)) return arr;
 }
@@ -118,21 +149,6 @@ function _iterableToArrayLimit(r, l) {
   }
 }
 
-function _arrayLikeToArray(arr, len) {
-  if (len == null || len > arr.length) len = arr.length;
-  for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
-  return arr2;
-}
-
-function _unsupportedIterableToArray(o, minLen) {
-  if (!o) return;
-  if (typeof o === "string") return _arrayLikeToArray(o, minLen);
-  var n = Object.prototype.toString.call(o).slice(8, -1);
-  if (n === "Object" && o.constructor) n = o.constructor.name;
-  if (n === "Map" || n === "Set") return Array.from(o);
-  if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
-}
-
 function _nonIterableRest() {
   throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
 }
@@ -151,15 +167,18 @@ var classes = {
   },
   menuitem: function menuitem(_ref2) {
     var currentIndexState = _ref2.currentIndexState,
-      index = _ref2.index;
+      index = _ref2.index,
+      active = _ref2.active;
     return utils.classNames('p-dock-item', {
       'p-dock-item-second-prev': currentIndexState - 2 === index,
       'p-dock-item-prev': currentIndexState - 1 === index,
       'p-dock-item-current': currentIndexState === index,
       'p-dock-item-next': currentIndexState + 1 === index,
-      'p-dock-item-second-next': currentIndexState + 2 === index
+      'p-dock-item-second-next': currentIndexState + 2 === index,
+      'p-focus': active
     });
   },
+  content: 'p-menuitem-content',
   header: 'p-dock-header',
   menu: 'p-dock-list',
   footer: 'p-dock-footer',
@@ -169,9 +188,9 @@ var classes = {
       'p-dock-magnification': props.magnification
     });
   },
-  container: 'p-dock-container'
+  container: 'p-dock-list-container'
 };
-var styles = "\n@layer primereact {\n    .p-dock {\n        position: absolute;\n        z-index: 1;\n        display: flex;\n        justify-content: center;\n        align-items: center;\n        pointer-events: none;\n    }\n    \n    .p-dock-container {\n        display: flex;\n        pointer-events: auto;\n    }\n    \n    .p-dock-list {\n        margin: 0;\n        padding: 0;\n        list-style: none;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        pointer-events: auto;\n    }\n    \n    .p-dock-magnification .p-dock-item {\n        transition: all .2s cubic-bezier(0.4, 0, 0.2, 1);\n        will-change: transform;\n    }\n    \n    .p-dock-action {\n        display: flex;\n        flex-direction: column;\n        align-items: center;\n        justify-content: center;\n        position: relative;\n        overflow: hidden;\n        cursor: default;\n    }\n    \n    .p-dock-magnification .p-dock-item-second-prev,\n    .p-dock-magnification .p-dock-item-second-next {\n        transform: scale(1.2);\n    }\n    \n    .p-dock-magnification .p-dock-item-prev,\n    .p-dock-magnification .p-dock-item-next {\n        transform: scale(1.4);\n    }\n    \n    .p-dock-magnification .p-dock-item-current {\n        transform: scale(1.6);\n        z-index: 1;\n    }\n    \n    /* Position */\n    /* top */\n    .p-dock-top {\n        left: 0;\n        top: 0;\n        width: 100%;\n    }\n    \n    .p-dock-top.p-dock-magnification .p-dock-item {\n        transform-origin: center top;\n    }\n    \n    .p-dock-top .p-dock-container {\n        flex-direction: column-reverse;\n    }\n    \n    /* bottom */\n    .p-dock-bottom {\n        left: 0;\n        bottom: 0;\n        width: 100%;\n    }\n    \n    .p-dock-bottom.p-dock-magnification .p-dock-item {\n        transform-origin: center bottom;\n    }\n    \n    .p-dock-bottom .p-dock-container {\n        flex-direction: column;\n    }\n    \n    /* right */\n    .p-dock-right {\n        right: 0;\n        top: 0;\n        height: 100%;\n    }\n    \n    .p-dock-right.p-dock-magnification .p-dock-item {\n        transform-origin: center right;\n    }\n    \n    .p-dock-right .p-dock-list {\n        flex-direction: column;\n    }\n    \n    /* left */\n    .p-dock-left {\n        left: 0;\n        top: 0;\n        height: 100%;\n    }\n    \n    .p-dock-left.p-dock-magnification .p-dock-item {\n        transform-origin: center left;\n    }\n    \n    .p-dock-left .p-dock-list {\n        flex-direction: column;\n    }\n    \n    .p-dock-left .p-dock-container {\n        flex-direction: row-reverse;\n    }\n}\n";
+var styles = "\n@layer primereact {\n    .p-dock {\n        position: absolute;\n        z-index: 1;\n        display: flex;\n        justify-content: center;\n        align-items: center;\n        pointer-events: none;\n    }\n\n    .p-dock-list-container {\n        display: flex;\n        pointer-events: auto;\n    }\n\n    .p-dock-list {\n        margin: 0;\n        padding: 0;\n        list-style: none;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        pointer-events: auto;\n    }\n\n    .p-dock-magnification .p-dock-item {\n        transition: all .2s cubic-bezier(0.4, 0, 0.2, 1);\n        will-change: transform;\n    }\n\n    .p-dock-action {\n        display: flex;\n        flex-direction: column;\n        align-items: center;\n        justify-content: center;\n        position: relative;\n        overflow: hidden;\n        cursor: default;\n    }\n\n    .p-dock-magnification .p-dock-item-second-prev,\n    .p-dock-magnification .p-dock-item-second-next {\n        transform: scale(1.2);\n    }\n\n    .p-dock-magnification .p-dock-item-prev,\n    .p-dock-magnification .p-dock-item-next {\n        transform: scale(1.4);\n    }\n\n    .p-dock-magnification .p-dock-item-current {\n        transform: scale(1.6);\n        z-index: 1;\n    }\n\n    /* Position */\n    /* top */\n    .p-dock-top {\n        left: 0;\n        top: 0;\n        width: 100%;\n    }\n\n    .p-dock-top.p-dock-magnification .p-dock-item {\n        transform-origin: center top;\n    }\n\n    .p-dock-top .p-dock-list-container {\n        flex-direction: column-reverse;\n    }\n\n    /* bottom */\n    .p-dock-bottom {\n        left: 0;\n        bottom: 0;\n        width: 100%;\n    }\n\n    .p-dock-bottom.p-dock-magnification .p-dock-item {\n        transform-origin: center bottom;\n    }\n\n    .p-dock-bottom .p-dock-list-container {\n        flex-direction: column;\n    }\n\n    /* right */\n    .p-dock-right {\n        right: 0;\n        top: 0;\n        height: 100%;\n    }\n\n    .p-dock-right.p-dock-magnification .p-dock-item {\n        transform-origin: center right;\n    }\n\n    .p-dock-right .p-dock-list {\n        flex-direction: column;\n    }\n\n    /* left */\n    .p-dock-left {\n        left: 0;\n        top: 0;\n        height: 100%;\n    }\n\n    .p-dock-left.p-dock-magnification .p-dock-item {\n        transform-origin: center left;\n    }\n\n    .p-dock-left .p-dock-list {\n        flex-direction: column;\n    }\n\n    .p-dock-left .p-dock-list-container {\n        flex-direction: row-reverse;\n    }\n}\n";
 var DockBase = componentbase.ComponentBase.extend({
   defaultProps: {
     __TYPE: 'Dock',
@@ -179,6 +198,9 @@ var DockBase = componentbase.ComponentBase.extend({
     style: null,
     className: null,
     model: null,
+    tabIndex: 0,
+    onFocus: null,
+    onBlur: null,
     position: 'bottom',
     magnification: true,
     header: null,
@@ -198,12 +220,20 @@ var Dock = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.for
     _React$useState2 = _slicedToArray(_React$useState, 2),
     currentIndexState = _React$useState2[0],
     setCurrentIndexState = _React$useState2[1];
+  var _React$useState3 = React__namespace.useState(false),
+    _React$useState4 = _slicedToArray(_React$useState3, 2),
+    focused = _React$useState4[0],
+    setFocused = _React$useState4[1];
+  var _React$useState5 = React__namespace.useState(-1),
+    _React$useState6 = _slicedToArray(_React$useState5, 2),
+    focusedOptionIndex = _React$useState6[0],
+    setFocusedOptionIndex = _React$useState6[1];
   var context = React__namespace.useContext(api.PrimeReactContext);
   var props = DockBase.getProps(inProps, context);
-  var _React$useState3 = React__namespace.useState(props.id),
-    _React$useState4 = _slicedToArray(_React$useState3, 2),
-    idState = _React$useState4[0],
-    setIdState = _React$useState4[1];
+  var _React$useState7 = React__namespace.useState(props.id),
+    _React$useState8 = _slicedToArray(_React$useState7, 2),
+    idState = _React$useState8[0],
+    setIdState = _React$useState8[1];
   var _DockBase$setMetaData = DockBase.setMetaData({
       props: props,
       state: {
@@ -215,6 +245,7 @@ var Dock = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.for
     cx = _DockBase$setMetaData.cx,
     isUnstyled = _DockBase$setMetaData.isUnstyled;
   var elementRef = React__namespace.useRef(null);
+  var listRef = React__namespace.useRef(null);
   componentbase.useHandleStyle(DockBase.css.styles, isUnstyled, {
     name: 'dock'
   });
@@ -241,6 +272,90 @@ var Dock = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.for
     }
     e.preventDefault();
   };
+  var onListFocus = function onListFocus(event) {
+    setFocused(true);
+    changeFocusedOptionIndex(0);
+    props.onFocus && props.onFocus(event);
+  };
+  var onListBlur = function onListBlur(event) {
+    setFocused(false);
+    setFocusedOptionIndex(-1);
+    props.onBlur && props.onBlur(event);
+  };
+  var onListKeyDown = function onListKeyDown(event) {
+    switch (event.code) {
+      case 'ArrowDown':
+        if (props.position === 'left' || props.position === 'right') onArrowDownKey();
+        event.preventDefault();
+        break;
+      case 'ArrowUp':
+        if (props.position === 'left' || props.position === 'right') onArrowUpKey();
+        event.preventDefault();
+        break;
+      case 'ArrowRight':
+        if (props.position === 'top' || props.position === 'bottom') onArrowDownKey();
+        event.preventDefault();
+        break;
+      case 'ArrowLeft':
+        if (props.position === 'top' || props.position === 'bottom') onArrowUpKey();
+        event.preventDefault();
+        break;
+      case 'Home':
+        onHomeKey();
+        event.preventDefault();
+        break;
+      case 'End':
+        onEndKey();
+        event.preventDefault();
+        break;
+      case 'Enter':
+      case 'Space':
+        onSpaceKey();
+        event.preventDefault();
+        break;
+    }
+  };
+  var onArrowDownKey = function onArrowDownKey() {
+    var optionIndex = findNextOptionIndex(focusedOptionIndex);
+    changeFocusedOptionIndex(optionIndex);
+  };
+  var onArrowUpKey = function onArrowUpKey() {
+    var optionIndex = findPrevOptionIndex(focusedOptionIndex);
+    changeFocusedOptionIndex(optionIndex);
+  };
+  var onHomeKey = function onHomeKey() {
+    changeFocusedOptionIndex(0);
+  };
+  var onEndKey = function onEndKey() {
+    changeFocusedOptionIndex(utils.DomHandler.find(listRef.current, 'li[data-pc-section="menuitem"][data-p-disabled="false"]').length - 1);
+  };
+  var onSpaceKey = function onSpaceKey() {
+    var element = utils.DomHandler.findSingle(listRef.current, "li[id=\"".concat("".concat(focusedOptionIndex), "\"]"));
+    var anchorElement = element && utils.DomHandler.findSingle(element, '[data-pc-section="action"]');
+    anchorElement ? anchorElement.click() : element && element.click();
+  };
+  var findNextOptionIndex = function findNextOptionIndex(index) {
+    var menuitems = utils.DomHandler.find(listRef.current, 'li[data-pc-section="menuitem"][data-p-disabled="false"]');
+    var matchedOptionIndex = _toConsumableArray(menuitems).findIndex(function (link) {
+      return link.id === index;
+    });
+    return matchedOptionIndex > -1 ? matchedOptionIndex + 1 : 0;
+  };
+  var findPrevOptionIndex = function findPrevOptionIndex(index) {
+    var menuitems = utils.DomHandler.find(listRef.current, 'li[data-pc-section="menuitem"][data-p-disabled="false"]');
+    var matchedOptionIndex = _toConsumableArray(menuitems).findIndex(function (link) {
+      return link.id === index;
+    });
+    return matchedOptionIndex > -1 ? matchedOptionIndex - 1 : 0;
+  };
+  var changeFocusedOptionIndex = function changeFocusedOptionIndex(index) {
+    var menuitems = utils.DomHandler.find(listRef.current, 'li[data-pc-section="menuitem"][data-p-disabled="false"]');
+    var order = index >= menuitems.length ? menuitems.length - 1 : index < 0 ? 0 : index;
+    setFocusedOptionIndex(menuitems[order].getAttribute('id'));
+  };
+  var isItemActive = function isItemActive(id) {
+    return id === focusedOptionIndex;
+  };
   var createItem = function createItem(item, index) {
     if (item.visible === false) {
       return null;
@@ -264,10 +379,14 @@ var Dock = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.for
     });
     var actionProps = utils.mergeProps({
       href: url || '#',
-      role: 'menuitem',
+      onFocus: function onFocus(event) {
+        return event.stopPropagation();
+      },
       className: cx('action', {
         disabled: disabled
       }),
+      'aria-hidden': 'true',
+      tabIndex: -1,
       target: target,
       'data-pr-tooltip': label,
       onClick: function onClick(e) {
@@ -282,25 +401,35 @@ var Dock = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.for
         },
         className: contentClassName,
         iconClassName: iconClassName,
+        'aria-hidden': 'true',
+        tabIndex: -1,
         element: content,
         props: props,
         index: index
       };
       content = utils.ObjectUtils.getJSXElement(template, item, defaultContentOptions);
     }
-    var menuitemProps = utils.mergeProps({
+    var contentProps = utils.mergeProps({
+      className: cx('content')
+    }, getPTOptions('content', item, index));
+    var active = isItemActive(key);
+    var menuitemProps = utils.mergeProps(_defineProperty(_defineProperty({
       id: key,
+      role: 'menuitem',
       key: key,
+      'aria-label': label,
+      'aria-disabled': disabled,
+      'data-p-focused': active,
+      'data-p-disabled': disabled || false,
       className: cx('menuitem', {
         currentIndexState: currentIndexState,
-        index: index
-      }),
-      role: 'none',
-      onMouseEnter: function onMouseEnter() {
-        return onItemMouseEnter(index);
-      }
-    }, getPTOptions('menuitem', item, index));
-    return /*#__PURE__*/React__namespace.createElement("li", menuitemProps, content);
+        index: index,
+        active: isItemActive(key)
+      })
+    }, "role", 'none'), "onMouseEnter", function onMouseEnter() {
+      return onItemMouseEnter(index);
+    }), getPTOptions('menuitem', item, index));
+    return /*#__PURE__*/React__namespace.createElement("li", menuitemProps, /*#__PURE__*/React__namespace.createElement("div", contentProps, content));
   };
   var createItems = function createItems() {
     return props.model ? props.model.map(createItem) : null;
@@ -320,8 +449,15 @@ var Dock = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.for
   var createList = function createList() {
     var items = createItems();
     var menuProps = utils.mergeProps({
+      ref: listRef,
       className: cx('menu'),
       role: 'menu',
+      'aria-orientation': props.position === 'bottom' || props.position === 'top' ? 'horizontal' : 'vertical',
+      'aria-activedescendant': focused ? focusedOptionIndex !== -1 ? focusedOptionIndex : null : undefined,
+      tabIndex: props.tabIndex || 0,
+      onFocus: onListFocus,
+      onBlur: onListBlur,
+      onKeyDown: onListKeyDown,
       onMouseLeave: onListMouseLeave
     }, ptm('menu'));
     return /*#__PURE__*/React__namespace.createElement("ul", menuProps, items);

package/dock/dock.cjs.min.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),n=require("primereact/api"),t=require("primereact/componentbase"),r=require("primereact/hooks"),o=require("primereact/ripple"),i=require("primereact/utils");function c(e){if(e&&e.__esModule)return e;var n=Object.create(null);return e&&Object.keys(e).forEach((function(t){if("default"!==t){var r=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(n,t,r.get?r:{enumerable:!0,get:function(){return e[t]}})}})),n.default=e,Object.freeze(n)}var a=c(e);function l(){return l=Object.assign?Object.assign.bind():function(e){for(var n=1;n<arguments.length;n++){var t=arguments[n];for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&(e[r]=t[r])}return e},l.apply(this,arguments)}function s(e){return s="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},s(e)}function p(e,n){if("object"!==s(e)||null===e)return e;var t=e[Symbol.toPrimitive];if(void 0!==t){var r=t.call(e,n||"default");if("object"!==s(r))return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===n?String:Number)(e)}function u(e){var n=p(e,"string");return"symbol"===s(n)?n:String(n)}function m(e){if(Array.isArray(e))return e}function d(e,n){var t=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=t){var r,o,i,c,a=[],l=!0,s=!1;try{if(i=(t=t.call(e)).next,0===n){if(Object(t)!==t)return;l=!1}else for(;!(l=(r=i.call(t)).done)&&(a.push(r.value),a.length!==n);l=!0);}catch(e){s=!0,o=e}finally{try{if(!l&&null!=t.return&&(c=t.return(),Object(c)!==c))return}finally{if(s)throw o}}return a}}function f(e,n){(null==n||n>e.length)&&(n=e.length);for(var t=0,r=new Array(n);t<n;t++)r[t]=e[t];return r}function b(e,n){if(e){if("string"==typeof e)return f(e,n);var t=Object.prototype.toString.call(e).slice(8,-1);return"Object"===t&&e.constructor&&(t=e.constructor.name),"Map"===t||"Set"===t?Array.from(e):"Arguments"===t||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t)?f(e,n):void 0}}function g(){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 y(e,n){return m(e)||d(e,n)||b(e,n)||g()}var k=t.ComponentBase.extend({defaultProps:{__TYPE:"Dock",id:null,style:null,className:null,model:null,position:"bottom",magnification:!0,header:null,footer:null,children:void 0},css:{classes:{icon:"p-dock-action-icon",action:function(e){return i.classNames("p-dock-action",{"p-disabled":e.disabled})},menuitem:function(e){var n=e.currentIndexState,t=e.index;return i.classNames("p-dock-item",{"p-dock-item-second-prev":n-2===t,"p-dock-item-prev":n-1===t,"p-dock-item-current":n===t,"p-dock-item-next":n+1===t,"p-dock-item-second-next":n+2===t})},header:"p-dock-header",menu:"p-dock-list",footer:"p-dock-footer",root:function(e){var n=e.props;return i.classNames("p-dock p-component p-dock-".concat(n.position),{"p-dock-magnification":n.magnification})},container:"p-dock-container"},styles:"\n@layer primereact {\n    .p-dock {\n        position: absolute;\n        z-index: 1;\n        display: flex;\n        justify-content: center;\n        align-items: center;\n        pointer-events: none;\n    }\n    \n    .p-dock-container {\n        display: flex;\n        pointer-events: auto;\n    }\n    \n    .p-dock-list {\n        margin: 0;\n        padding: 0;\n        list-style: none;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        pointer-events: auto;\n    }\n    \n    .p-dock-magnification .p-dock-item {\n        transition: all .2s cubic-bezier(0.4, 0, 0.2, 1);\n        will-change: transform;\n    }\n    \n    .p-dock-action {\n        display: flex;\n        flex-direction: column;\n        align-items: center;\n        justify-content: center;\n        position: relative;\n        overflow: hidden;\n        cursor: default;\n    }\n    \n    .p-dock-magnification .p-dock-item-second-prev,\n    .p-dock-magnification .p-dock-item-second-next {\n        transform: scale(1.2);\n    }\n    \n    .p-dock-magnification .p-dock-item-prev,\n    .p-dock-magnification .p-dock-item-next {\n        transform: scale(1.4);\n    }\n    \n    .p-dock-magnification .p-dock-item-current {\n        transform: scale(1.6);\n        z-index: 1;\n    }\n    \n    /* Position */\n    /* top */\n    .p-dock-top {\n        left: 0;\n        top: 0;\n        width: 100%;\n    }\n    \n    .p-dock-top.p-dock-magnification .p-dock-item {\n        transform-origin: center top;\n    }\n    \n    .p-dock-top .p-dock-container {\n        flex-direction: column-reverse;\n    }\n    \n    /* bottom */\n    .p-dock-bottom {\n        left: 0;\n        bottom: 0;\n        width: 100%;\n    }\n    \n    .p-dock-bottom.p-dock-magnification .p-dock-item {\n        transform-origin: center bottom;\n    }\n    \n    .p-dock-bottom .p-dock-container {\n        flex-direction: column;\n    }\n    \n    /* right */\n    .p-dock-right {\n        right: 0;\n        top: 0;\n        height: 100%;\n    }\n    \n    .p-dock-right.p-dock-magnification .p-dock-item {\n        transform-origin: center right;\n    }\n    \n    .p-dock-right .p-dock-list {\n        flex-direction: column;\n    }\n    \n    /* left */\n    .p-dock-left {\n        left: 0;\n        top: 0;\n        height: 100%;\n    }\n    \n    .p-dock-left.p-dock-magnification .p-dock-item {\n        transform-origin: center left;\n    }\n    \n    .p-dock-left .p-dock-list {\n        flex-direction: column;\n    }\n    \n    .p-dock-left .p-dock-container {\n        flex-direction: row-reverse;\n    }\n}\n"}});function v(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);n&&(r=r.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,r)}return t}function h(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{};n%2?v(Object(t),!0).forEach((function(n){var r,o,i;r=e,i=t[n],(o=u(o=n))in r?Object.defineProperty(r,o,{value:i,enumerable:!0,configurable:!0,writable:!0}):r[o]=i})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):v(Object(t)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))}))}return e}var O=a.memo(a.forwardRef((function(e,c){var s=y(a.useState(-3),2),p=s[0],u=s[1],m=a.useContext(n.PrimeReactContext),d=k.getProps(e,m),f=y(a.useState(d.id),2),b=f[0],g=f[1],v=k.setMetaData({props:d,state:{id:b,currentIndex:p}}),O=v.ptm,j=v.cx,x=v.isUnstyled,P=a.useRef(null);t.useHandleStyle(k.css.styles,x,{name:"dock"});var S=function(e,n,t){return O(e,{context:{index:t,item:n}})},w=function(){u(-3)},E=function(e){u(e)},N=function(e,n){n.command&&n.command({originalEvent:e,item:n}),e.preventDefault()},D=function(e,n){if(!1===e.visible)return null;var t=e.disabled,r=e.icon,c=e.label,l=e.template,s=e.url,u=e.target,m=e.id||b+"_"+n,f=i.classNames("p-dock-action",{"p-disabled":t}),g=i.classNames("p-dock-action-icon",r),y=i.mergeProps({className:j("icon")},S("icon",e,n)),k=i.IconUtils.getJSXIcon(r,h({},y),{props:d}),v=i.mergeProps({href:s||"#",role:"menuitem",className:j("action",{disabled:t}),target:u,"data-pr-tooltip":c,onClick:function(n){return N(n,e)}},S("action",e,n)),O=a.createElement("a",v,k,a.createElement(o.Ripple,null));l&&(O=i.ObjectUtils.getJSXElement(l,e,{onClick:function(n){return N(n,e)},className:f,iconClassName:g,element:O,props:d,index:n}));var x=i.mergeProps({id:m,key:m,className:j("menuitem",{currentIndexState:p,index:n}),role:"none",onMouseEnter:function(){return E(n)}},S("menuitem",e,n));return a.createElement("li",x,O)};r.useMountEffect((function(){b||g(i.UniqueComponentId())})),a.useImperativeHandle(c,(function(){return{props:d,getElement:function(){return P.current}}}));var I,C,q=function(){if(d.header){var e=i.ObjectUtils.getJSXElement(d.header,{props:d}),n=i.mergeProps({className:j("header")},O("header"));return a.createElement("div",n,e)}return null}(),M=(I=d.model?d.model.map(D):null,C=i.mergeProps({className:j("menu"),role:"menu",onMouseLeave:w},O("menu")),a.createElement("ul",C,I)),U=function(){if(d.footer){var e=i.ObjectUtils.getJSXElement(d.footer,{props:d}),n=i.mergeProps({className:j("footer")},O("footer"));return a.createElement("div",n,e)}return null}(),_=i.mergeProps({className:i.classNames(d.className,j("root")),style:d.style},k.getOtherProps(d),O("root")),A=i.mergeProps({className:j("container")},O("container"));return a.createElement("div",l({id:d.id,ref:P},_),a.createElement("div",A,q,M,U))})));O.displayName="Dock",exports.Dock=O;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),n=require("primereact/api"),t=require("primereact/componentbase"),r=require("primereact/hooks"),o=require("primereact/ripple"),i=require("primereact/utils");function a(e){if(e&&e.__esModule)return e;var n=Object.create(null);return e&&Object.keys(e).forEach((function(t){if("default"!==t){var r=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(n,t,r.get?r:{enumerable:!0,get:function(){return e[t]}})}})),n.default=e,Object.freeze(n)}var c=a(e);function l(){return l=Object.assign?Object.assign.bind():function(e){for(var n=1;n<arguments.length;n++){var t=arguments[n];for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&(e[r]=t[r])}return e},l.apply(this,arguments)}function s(e){return s="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},s(e)}function u(e,n){if("object"!==s(e)||null===e)return e;var t=e[Symbol.toPrimitive];if(void 0!==t){var r=t.call(e,n||"default");if("object"!==s(r))return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===n?String:Number)(e)}function p(e){var n=u(e,"string");return"symbol"===s(n)?n:String(n)}function d(e,n,t){return(n=p(n))in e?Object.defineProperty(e,n,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[n]=t,e}function f(e,n){(null==n||n>e.length)&&(n=e.length);for(var t=0,r=new Array(n);t<n;t++)r[t]=e[t];return r}function m(e){if(Array.isArray(e))return f(e)}function b(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}function g(e,n){if(e){if("string"==typeof e)return f(e,n);var t=Object.prototype.toString.call(e).slice(8,-1);return"Object"===t&&e.constructor&&(t=e.constructor.name),"Map"===t||"Set"===t?Array.from(e):"Arguments"===t||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t)?f(e,n):void 0}}function v(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function y(e){return m(e)||b(e)||g(e)||v()}function k(e){if(Array.isArray(e))return e}function h(e,n){var t=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=t){var r,o,i,a,c=[],l=!0,s=!1;try{if(i=(t=t.call(e)).next,0===n){if(Object(t)!==t)return;l=!1}else for(;!(l=(r=i.call(t)).done)&&(c.push(r.value),c.length!==n);l=!0);}catch(e){s=!0,o=e}finally{try{if(!l&&null!=t.return&&(a=t.return(),Object(a)!==a))return}finally{if(s)throw o}}return c}}function x(){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 O(e,n){return k(e)||h(e,n)||g(e,n)||x()}var j=t.ComponentBase.extend({defaultProps:{__TYPE:"Dock",id:null,style:null,className:null,model:null,tabIndex:0,onFocus:null,onBlur:null,position:"bottom",magnification:!0,header:null,footer:null,children:void 0},css:{classes:{icon:"p-dock-action-icon",action:function(e){return i.classNames("p-dock-action",{"p-disabled":e.disabled})},menuitem:function(e){var n=e.currentIndexState,t=e.index;return i.classNames("p-dock-item",{"p-dock-item-second-prev":n-2===t,"p-dock-item-prev":n-1===t,"p-dock-item-current":n===t,"p-dock-item-next":n+1===t,"p-dock-item-second-next":n+2===t,"p-focus":e.active})},content:"p-menuitem-content",header:"p-dock-header",menu:"p-dock-list",footer:"p-dock-footer",root:function(e){var n=e.props;return i.classNames("p-dock p-component p-dock-".concat(n.position),{"p-dock-magnification":n.magnification})},container:"p-dock-list-container"},styles:"\n@layer primereact {\n    .p-dock {\n        position: absolute;\n        z-index: 1;\n        display: flex;\n        justify-content: center;\n        align-items: center;\n        pointer-events: none;\n    }\n\n    .p-dock-list-container {\n        display: flex;\n        pointer-events: auto;\n    }\n\n    .p-dock-list {\n        margin: 0;\n        padding: 0;\n        list-style: none;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        pointer-events: auto;\n    }\n\n    .p-dock-magnification .p-dock-item {\n        transition: all .2s cubic-bezier(0.4, 0, 0.2, 1);\n        will-change: transform;\n    }\n\n    .p-dock-action {\n        display: flex;\n        flex-direction: column;\n        align-items: center;\n        justify-content: center;\n        position: relative;\n        overflow: hidden;\n        cursor: default;\n    }\n\n    .p-dock-magnification .p-dock-item-second-prev,\n    .p-dock-magnification .p-dock-item-second-next {\n        transform: scale(1.2);\n    }\n\n    .p-dock-magnification .p-dock-item-prev,\n    .p-dock-magnification .p-dock-item-next {\n        transform: scale(1.4);\n    }\n\n    .p-dock-magnification .p-dock-item-current {\n        transform: scale(1.6);\n        z-index: 1;\n    }\n\n    /* Position */\n    /* top */\n    .p-dock-top {\n        left: 0;\n        top: 0;\n        width: 100%;\n    }\n\n    .p-dock-top.p-dock-magnification .p-dock-item {\n        transform-origin: center top;\n    }\n\n    .p-dock-top .p-dock-list-container {\n        flex-direction: column-reverse;\n    }\n\n    /* bottom */\n    .p-dock-bottom {\n        left: 0;\n        bottom: 0;\n        width: 100%;\n    }\n\n    .p-dock-bottom.p-dock-magnification .p-dock-item {\n        transform-origin: center bottom;\n    }\n\n    .p-dock-bottom .p-dock-list-container {\n        flex-direction: column;\n    }\n\n    /* right */\n    .p-dock-right {\n        right: 0;\n        top: 0;\n        height: 100%;\n    }\n\n    .p-dock-right.p-dock-magnification .p-dock-item {\n        transform-origin: center right;\n    }\n\n    .p-dock-right .p-dock-list {\n        flex-direction: column;\n    }\n\n    /* left */\n    .p-dock-left {\n        left: 0;\n        top: 0;\n        height: 100%;\n    }\n\n    .p-dock-left.p-dock-magnification .p-dock-item {\n        transform-origin: center left;\n    }\n\n    .p-dock-left .p-dock-list {\n        flex-direction: column;\n    }\n\n    .p-dock-left .p-dock-list-container {\n        flex-direction: row-reverse;\n    }\n}\n"}});function S(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);n&&(r=r.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,r)}return t}function P(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{};n%2?S(Object(t),!0).forEach((function(n){d(e,n,t[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):S(Object(t)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))}))}return e}var w=c.memo(c.forwardRef((function(e,a){var s=O(c.useState(-3),2),u=s[0],p=s[1],f=O(c.useState(!1),2),m=f[0],b=f[1],g=O(c.useState(-1),2),v=g[0],k=g[1],h=c.useContext(n.PrimeReactContext),x=j.getProps(e,h),S=O(c.useState(x.id),2),w=S[0],D=S[1],E=j.setMetaData({props:x,state:{id:w,currentIndex:u}}),N=E.ptm,I=E.cx,A=E.isUnstyled,H=c.useRef(null),C=c.useRef(null);t.useHandleStyle(j.css.styles,A,{name:"dock"});var U=function(e,n,t){return N(e,{context:{index:t,item:n}})},q=function(){p(-3)},M=function(e){p(e)},_=function(e,n){n.command&&n.command({originalEvent:e,item:n}),e.preventDefault()},R=function(e){b(!0),$(0),x.onFocus&&x.onFocus(e)},z=function(e){b(!1),k(-1),x.onBlur&&x.onBlur(e)},B=function(e){switch(e.code){case"ArrowDown":"left"!==x.position&&"right"!==x.position||F(),e.preventDefault();break;case"ArrowUp":"left"!==x.position&&"right"!==x.position||J(),e.preventDefault();break;case"ArrowRight":"top"!==x.position&&"bottom"!==x.position||F(),e.preventDefault();break;case"ArrowLeft":"top"!==x.position&&"bottom"!==x.position||J(),e.preventDefault();break;case"Home":T(),e.preventDefault();break;case"End":X(),e.preventDefault();break;case"Enter":case"Space":L(),e.preventDefault()}},F=function(){var e=K(v);$(e)},J=function(){var e=Y(v);$(e)},T=function(){$(0)},X=function(){$(i.DomHandler.find(C.current,'li[data-pc-section="menuitem"][data-p-disabled="false"]').length-1)},L=function(){var e=i.DomHandler.findSingle(C.current,'li[id="'.concat("".concat(v),'"]')),n=e&&i.DomHandler.findSingle(e,'[data-pc-section="action"]');n?n.click():e&&e.click()},K=function(e){var n=y(i.DomHandler.find(C.current,'li[data-pc-section="menuitem"][data-p-disabled="false"]')).findIndex((function(n){return n.id===e}));return n>-1?n+1:0},Y=function(e){var n=y(i.DomHandler.find(C.current,'li[data-pc-section="menuitem"][data-p-disabled="false"]')).findIndex((function(n){return n.id===e}));return n>-1?n-1:0},$=function(e){var n=i.DomHandler.find(C.current,'li[data-pc-section="menuitem"][data-p-disabled="false"]');k(n[e>=n.length?n.length-1:e<0?0:e].getAttribute("id"))},G=function(e){return e===v},Q=function(e,n){if(!1===e.visible)return null;var t=e.disabled,r=e.icon,a=e.label,l=e.template,s=e.url,p=e.target,f=e.id||w+"_"+n,m=i.classNames("p-dock-action",{"p-disabled":t}),b=i.classNames("p-dock-action-icon",r),g=i.mergeProps({className:I("icon")},U("icon",e,n)),v=i.IconUtils.getJSXIcon(r,P({},g),{props:x}),y=i.mergeProps({href:s||"#",onFocus:function(e){return e.stopPropagation()},className:I("action",{disabled:t}),"aria-hidden":"true",tabIndex:-1,target:p,"data-pr-tooltip":a,onClick:function(n){return _(n,e)}},U("action",e,n)),k=c.createElement("a",y,v,c.createElement(o.Ripple,null));l&&(k=i.ObjectUtils.getJSXElement(l,e,{onClick:function(n){return _(n,e)},className:m,iconClassName:b,"aria-hidden":"true",tabIndex:-1,element:k,props:x,index:n}));var h=i.mergeProps({className:I("content")},U("content",e,n)),O=G(f),j=i.mergeProps(d(d({id:f,role:"menuitem",key:f,"aria-label":a,"aria-disabled":t,"data-p-focused":O,"data-p-disabled":t||!1,className:I("menuitem",{currentIndexState:u,index:n,active:G(f)})},"role","none"),"onMouseEnter",(function(){return M(n)})),U("menuitem",e,n));return c.createElement("li",j,c.createElement("div",h,k))};r.useMountEffect((function(){w||D(i.UniqueComponentId())})),c.useImperativeHandle(a,(function(){return{props:x,getElement:function(){return H.current}}}));var V,W,Z=function(){if(x.header){var e=i.ObjectUtils.getJSXElement(x.header,{props:x}),n=i.mergeProps({className:I("header")},N("header"));return c.createElement("div",n,e)}return null}(),ee=(V=x.model?x.model.map(Q):null,W=i.mergeProps({ref:C,className:I("menu"),role:"menu","aria-orientation":"bottom"===x.position||"top"===x.position?"horizontal":"vertical","aria-activedescendant":m?-1!==v?v:null:void 0,tabIndex:x.tabIndex||0,onFocus:R,onBlur:z,onKeyDown:B,onMouseLeave:q},N("menu")),c.createElement("ul",W,V)),ne=function(){if(x.footer){var e=i.ObjectUtils.getJSXElement(x.footer,{props:x}),n=i.mergeProps({className:I("footer")},N("footer"));return c.createElement("div",n,e)}return null}(),te=i.mergeProps({className:i.classNames(x.className,I("root")),style:x.style},j.getOtherProps(x),N("root")),re=i.mergeProps({className:I("container")},N("container"));return c.createElement("div",l({id:x.id,ref:H},te),c.createElement("div",re,Z,ee,ne))})));w.displayName="Dock",exports.Dock=w;

package/dock/dock.d.ts

@@ -37,6 +37,7 @@ export interface DockPassThroughOptions {
      * Uses to pass attributes to the container's DOM element.
      */
     container?: DockPassThroughType<React.HTMLAttributes<HTMLDivElement>>;
+
     /**
      * Uses to pass attributes to the header's DOM element.
      */
@@ -152,6 +153,20 @@ export interface DockProps extends Omit<React.DetailedHTMLProps<React.HTMLAttrib
      * @type {PassThroughOptions}
      */
     ptOptions?: PassThroughOptions;
+    /**
+     * Index of the element in tabbing order.
+     */
+    tabIndex?: number | undefined;
+    /**
+     * Callback to invoke when dock receives focus.
+     * @param {React.SyntheticEvent} event - Browser event.
+     */
+    onFocus?(event: React.SyntheticEvent): void;
+    /**
+     * Callback to invoke when dock loses focus.
+     * @param {React.SyntheticEvent} event - Browser event.
+     */
+    onBlur?(event: React.SyntheticEvent): void;
     /**
      * When enabled, it removes component related styles in the core.
      * @defaultValue false