primereact 9.4.0 → 9.6.0

package/breadcrumb/breadcrumb.cjs.js

@@ -3,8 +3,10 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
-var utils = require('primereact/utils');
+var api = require('primereact/api');
 var chevronright = require('primereact/icons/chevronright');
+var utils = require('primereact/utils');
+var componentbase = require('primereact/componentbase');
 
 function _interopNamespace(e) {
   if (e && e.__esModule) return e;
@@ -26,22 +28,48 @@ function _interopNamespace(e) {
 
 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";
+
+  return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) {
+    return typeof obj;
+  } : function (obj) {
+    return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
+  }, _typeof(obj);
+}
+
+function _toPrimitive(input, hint) {
+  if (_typeof(input) !== "object" || input === null) return input;
+  var prim = input[Symbol.toPrimitive];
+  if (prim !== undefined) {
+    var res = prim.call(input, hint || "default");
+    if (_typeof(res) !== "object") return res;
+    throw new TypeError("@@toPrimitive must return a primitive value.");
+  }
+  return (hint === "string" ? String : Number)(input);
 }
 
-var BreadCrumbBase = {
+function _toPropertyKey(arg) {
+  var key = _toPrimitive(arg, "string");
+  return _typeof(key) === "symbol" ? key : String(key);
+}
+
+function _defineProperty(obj, key, value) {
+  key = _toPropertyKey(key);
+  if (key in obj) {
+    Object.defineProperty(obj, key, {
+      value: value,
+      enumerable: true,
+      configurable: true,
+      writable: true
+    });
+  } else {
+    obj[key] = value;
+  }
+  return obj;
+}
+
+var BreadCrumbBase = componentbase.ComponentBase.extend({
   defaultProps: {
     __TYPE: 'BreadCrumb',
     id: null,
@@ -51,17 +79,18 @@ var BreadCrumbBase = {
     style: null,
     className: null,
     children: undefined
-  },
-  getProps: function getProps(props) {
-    return utils.ObjectUtils.getMergedProps(props, BreadCrumbBase.defaultProps);
-  },
-  getOtherProps: function getOtherProps(props) {
-    return utils.ObjectUtils.getDiffProps(props, BreadCrumbBase.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 BreadCrumb = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
-  var props = BreadCrumbBase.getProps(inProps);
+  var context = React__namespace.useContext(api.PrimeReactContext);
+  var props = BreadCrumbBase.getProps(inProps, context);
+  var _BreadCrumbBase$setMe = BreadCrumbBase.setMetaData({
+      props: props
+    }),
+    ptm = _BreadCrumbBase$setMe.ptm;
   var elementRef = React__namespace.useRef(null);
   var itemClick = function itemClick(event, item) {
     if (item.disabled) {
@@ -90,24 +119,31 @@ var BreadCrumb = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespa
         disabled = home.disabled,
         style = home.style,
         _className = home.className,
-        template = home.template;
+        template = home.template,
+        _label = home.label;
       var _className2 = utils.classNames('p-breadcrumb-home', {
         'p-disabled': disabled
       }, _className);
-      var icon = utils.IconUtils.getJSXIcon(_icon, {
+      var iconProps = utils.mergeProps({
         className: 'p-menuitem-icon'
-      }, {
+      }, ptm('icon'));
+      var icon = utils.IconUtils.getJSXIcon(_icon, _objectSpread({}, iconProps), {
         props: props
       });
-      var content = /*#__PURE__*/React__namespace.createElement("a", {
+      var actionProps = utils.mergeProps({
         href: url || '#',
-        className: "p-menuitem-link",
-        "aria-disabled": disabled,
+        className: 'p-menuitem-link',
+        'aria-disabled': disabled,
         target: target,
         onClick: function onClick(event) {
           return itemClick(event, home);
         }
-      }, icon);
+      }, ptm('action'));
+      var labelProps = utils.mergeProps({
+        className: 'p-menuitem-text'
+      }, ptm('label'));
+      var label = _label && /*#__PURE__*/React__namespace.createElement("span", labelProps, _label);
+      var content = /*#__PURE__*/React__namespace.createElement("a", actionProps, icon, label);
       if (template) {
         var defaultContentOptions = {
           onClick: function onClick(event) {
@@ -120,44 +156,49 @@ var BreadCrumb = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespa
         };
         content = utils.ObjectUtils.getJSXElement(template, home, defaultContentOptions);
       }
-      return /*#__PURE__*/React__namespace.createElement("li", {
+      var menuitemProps = utils.mergeProps({
         className: _className2,
         style: style
-      }, content);
+      }, ptm('menuitem'));
+      return /*#__PURE__*/React__namespace.createElement("li", menuitemProps, content);
     }
     return null;
   };
   var createSeparator = function createSeparator() {
     var iconClassName = 'p-breadcrumb-chevron';
-    var icon = props.separatorIcon || /*#__PURE__*/React__namespace.createElement(chevronright.ChevronRightIcon, {
-      className: iconClassName
-    });
-    var separatorIcon = utils.IconUtils.getJSXIcon(icon, {
+    var separatorIconProps = utils.mergeProps({
       className: iconClassName
-    }, {
+    }, ptm('separatorIcon'));
+    var icon = props.separatorIcon || /*#__PURE__*/React__namespace.createElement(chevronright.ChevronRightIcon, separatorIconProps);
+    var separatorIcon = utils.IconUtils.getJSXIcon(icon, _objectSpread({}, separatorIconProps), {
       props: props
     });
-    return separatorIcon;
+    var separatorProps = utils.mergeProps({
+      className: 'p-menuitem-separator'
+    }, ptm('separator'));
+    return /*#__PURE__*/React__namespace.createElement("li", separatorProps, separatorIcon);
   };
   var createMenuitem = function createMenuitem(item) {
     if (item.visible === false) {
       return null;
     }
-    var className = utils.classNames(item.className, {
+    var className = utils.classNames('p-menuitem', item.className, {
       'p-disabled': item.disabled
     });
-    var label = item.label && /*#__PURE__*/React__namespace.createElement("span", {
-      className: "p-menuitem-text"
-    }, item.label);
-    var content = /*#__PURE__*/React__namespace.createElement("a", {
+    var labelProps = utils.mergeProps({
+      className: 'p-menuitem-text'
+    }, ptm('label'));
+    var label = item.label && /*#__PURE__*/React__namespace.createElement("span", labelProps, item.label);
+    var actionProps = utils.mergeProps({
       href: item.url || '#',
-      className: "p-menuitem-link",
+      className: 'p-menuitem-link',
       target: item.target,
       onClick: function onClick(event) {
         return itemClick(event, item);
       },
-      "aria-disabled": item.disabled
-    }, label);
+      'aria-disabled': item.disabled
+    }, ptm('action'));
+    var content = /*#__PURE__*/React__namespace.createElement("a", actionProps, label);
     if (item.template) {
       var defaultContentOptions = {
         onClick: function onClick(event) {
@@ -170,10 +211,11 @@ var BreadCrumb = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespa
       };
       content = utils.ObjectUtils.getJSXElement(item.template, item, defaultContentOptions);
     }
-    return /*#__PURE__*/React__namespace.createElement("li", {
+    var menuitemProps = utils.mergeProps({
       className: className,
       style: item.style
-    }, content);
+    }, ptm('menuitem'));
+    return /*#__PURE__*/React__namespace.createElement("li", menuitemProps, content);
   };
   var createMenuitems = function createMenuitems() {
     if (props.model) {
@@ -200,18 +242,21 @@ var BreadCrumb = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespa
       }
     };
   });
-  var otherProps = BreadCrumbBase.getOtherProps(props);
   var className = utils.classNames('p-breadcrumb p-component', props.className);
   var home = createHome();
   var items = createMenuitems();
   var separator = createSeparator();
-  return /*#__PURE__*/React__namespace.createElement("nav", _extends({
+  var menuProps = utils.mergeProps({
+    className: 'p-breadcrumb-list'
+  }, ptm('menu'));
+  var rootProps = utils.mergeProps({
     id: props.id,
     ref: elementRef,
     className: className,
     style: props.style,
-    "aria-label": "Breadcrumb"
-  }, otherProps), /*#__PURE__*/React__namespace.createElement("ul", null, home, separator, items));
+    'aria-label': 'Breadcrumb'
+  }, BreadCrumbBase.getOtherProps(props), ptm('root'));
+  return /*#__PURE__*/React__namespace.createElement("nav", rootProps, /*#__PURE__*/React__namespace.createElement("ul", menuProps, home, separator, items));
 }));
 BreadCrumb.displayName = 'BreadCrumb';
 

package/breadcrumb/breadcrumb.cjs.min.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("primereact/utils"),r=require("primereact/icons/chevronright");function n(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var n=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,n.get?n:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var l=n(e);function a(){return a=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e},a.apply(this,arguments)}var s={defaultProps:{__TYPE:"BreadCrumb",id:null,model:null,home:null,separatorIcon:null,style:null,className:null,children:void 0},getProps:function(e){return t.ObjectUtils.getMergedProps(e,s.defaultProps)},getOtherProps:function(e){return t.ObjectUtils.getDiffProps(e,s.defaultProps)}},i=l.memo(l.forwardRef((function(e,n){var i=s.getProps(e),u=l.useRef(null),c=function(e,t){t.disabled?e.preventDefault():(t.url||e.preventDefault(),t.command&&t.command({originalEvent:e,item:t}))},m=function(){var e="p-breadcrumb-chevron";return t.IconUtils.getJSXIcon(i.separatorIcon||l.createElement(r.ChevronRightIcon,{className:e}),{className:e},{props:i})},o=function(e){if(!1===e.visible)return null;var r=t.classNames(e.className,{"p-disabled":e.disabled}),n=l.createElement("a",{href:e.url||"#",className:"p-menuitem-link",target:e.target,onClick:function(t){return c(t,e)},"aria-disabled":e.disabled},e.label&&l.createElement("span",{className:"p-menuitem-text"},e.label));e.template&&(n=t.ObjectUtils.getJSXElement(e.template,e,{onClick:function(t){return c(t,e)},className:"p-menuitem-link",labelClassName:"p-menuitem-text",element:n,props:i}));return l.createElement("li",{className:r,style:e.style},n)};l.useImperativeHandle(n,(function(){return{props:i,getElement:function(){return u.current}}}));var p=s.getOtherProps(i),f=t.classNames("p-breadcrumb p-component",i.className),d=function(){var e=i.home;if(e){if(!1===e.visible)return null;var r=e.icon,n=e.target,a=e.url,s=e.disabled,u=e.style,m=e.template,o=t.classNames("p-breadcrumb-home",{"p-disabled":s},e.className),p=t.IconUtils.getJSXIcon(r,{className:"p-menuitem-icon"},{props:i}),f=l.createElement("a",{href:a||"#",className:"p-menuitem-link","aria-disabled":s,target:n,onClick:function(t){return c(t,e)}},p);if(m)f=t.ObjectUtils.getJSXElement(m,e,{onClick:function(t){return c(t,e)},className:"p-menuitem-link",labelClassName:"p-menuitem-text",element:f,props:i});return l.createElement("li",{className:o,style:u},f)}return null}(),b=function(){if(i.model){var e=i.model.map((function(e,t){if(!1===e.visible)return null;var r=o(e),n=t===i.model.length-1?null:m();return l.createElement(l.Fragment,{key:e.label+"_"+t},r,n)}));return e}return null}(),v=m();return l.createElement("nav",a({id:i.id,ref:u,className:f,style:i.style,"aria-label":"Breadcrumb"},p),l.createElement("ul",null,d,v,b))})));i.displayName="BreadCrumb",exports.BreadCrumb=i;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),r=require("primereact/api"),t=require("primereact/icons/chevronright"),n=require("primereact/utils"),a=require("primereact/componentbase");function l(e){if(e&&e.__esModule)return e;var r=Object.create(null);return e&&Object.keys(e).forEach((function(t){if("default"!==t){var n=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,n.get?n:{enumerable:!0,get:function(){return e[t]}})}})),r.default=e,Object.freeze(r)}var o=l(e);function i(e){return i="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},i(e)}function c(e,r){if("object"!==i(e)||null===e)return e;var t=e[Symbol.toPrimitive];if(void 0!==t){var n=t.call(e,r||"default");if("object"!==i(n))return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===r?String:Number)(e)}function m(e){var r=c(e,"string");return"symbol"===i(r)?r:String(r)}function u(e,r,t){return(r=m(r))in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}var s=a.ComponentBase.extend({defaultProps:{__TYPE:"BreadCrumb",id:null,model:null,home:null,separatorIcon:null,style:null,className:null,children:void 0}});function p(e,r){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);r&&(n=n.filter((function(r){return Object.getOwnPropertyDescriptor(e,r).enumerable}))),t.push.apply(t,n)}return t}function b(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{};r%2?p(Object(t),!0).forEach((function(r){u(e,r,t[r])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):p(Object(t)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))}))}return e}var f=o.memo(o.forwardRef((function(e,a){var l=o.useContext(r.PrimeReactContext),i=s.getProps(e,l),c=s.setMetaData({props:i}).ptm,m=o.useRef(null),u=function(e,r){r.disabled?e.preventDefault():(r.url||e.preventDefault(),r.command&&r.command({originalEvent:e,item:r}))},p=function(){var e=n.mergeProps({className:"p-breadcrumb-chevron"},c("separatorIcon")),r=n.IconUtils.getJSXIcon(i.separatorIcon||o.createElement(t.ChevronRightIcon,e),b({},e),{props:i}),a=n.mergeProps({className:"p-menuitem-separator"},c("separator"));return o.createElement("li",a,r)},f=function(e){if(!1===e.visible)return null;var r=n.classNames("p-menuitem",e.className,{"p-disabled":e.disabled}),t=n.mergeProps({className:"p-menuitem-text"},c("label")),a=e.label&&o.createElement("span",t,e.label),l=n.mergeProps({href:e.url||"#",className:"p-menuitem-link",target:e.target,onClick:function(r){return u(r,e)},"aria-disabled":e.disabled},c("action")),m=o.createElement("a",l,a);e.template&&(m=n.ObjectUtils.getJSXElement(e.template,e,{onClick:function(r){return u(r,e)},className:"p-menuitem-link",labelClassName:"p-menuitem-text",element:m,props:i}));var s=n.mergeProps({className:r,style:e.style},c("menuitem"));return o.createElement("li",s,m)};o.useImperativeHandle(a,(function(){return{props:i,getElement:function(){return m.current}}}));var d=n.classNames("p-breadcrumb p-component",i.className),g=function(){var e=i.home;if(e){if(!1===e.visible)return null;var r=e.icon,t=e.target,a=e.url,l=e.disabled,m=e.style,s=e.template,p=e.label,f=n.classNames("p-breadcrumb-home",{"p-disabled":l},e.className),d=n.mergeProps({className:"p-menuitem-icon"},c("icon")),g=n.IconUtils.getJSXIcon(r,b({},d),{props:i}),v=n.mergeProps({href:a||"#",className:"p-menuitem-link","aria-disabled":l,target:t,onClick:function(r){return u(r,e)}},c("action")),y=n.mergeProps({className:"p-menuitem-text"},c("label")),P=o.createElement("a",v,g,p&&o.createElement("span",y,p));if(s)P=n.ObjectUtils.getJSXElement(s,e,{onClick:function(r){return u(r,e)},className:"p-menuitem-link",labelClassName:"p-menuitem-text",element:P,props:i});var O=n.mergeProps({className:f,style:m},c("menuitem"));return o.createElement("li",O,P)}return null}(),v=function(){if(i.model){var e=i.model.map((function(e,r){if(!1===e.visible)return null;var t=f(e),n=r===i.model.length-1?null:p();return o.createElement(o.Fragment,{key:e.label+"_"+r},t,n)}));return e}return null}(),y=p(),P=n.mergeProps({className:"p-breadcrumb-list"},c("menu")),O=n.mergeProps({id:i.id,ref:m,className:d,style:i.style,"aria-label":"Breadcrumb"},s.getOtherProps(i),c("root"));return o.createElement("nav",O,o.createElement("ul",P,g,y,v))})));f.displayName="BreadCrumb",exports.BreadCrumb=f;

package/breadcrumb/breadcrumb.d.ts

@@ -9,8 +9,55 @@
  */
 import * as React from 'react';
 import { MenuItem } from '../menuitem';
-import { IconType } from '../utils/utils';
+import { IconType, PassThroughType } from '../utils/utils';
 
+export declare type BreadCrumbPassThroughType<T> = PassThroughType<T, BreadCrumbPassThroughMethodOptions>;
+
+/**
+ * Custom passthrough(pt) option method.
+ */
+export interface BreadCrumbPassThroughMethodOptions {
+    props: BreadCrumbProps;
+}
+
+/**
+ * Custom passthrough(pt) options.
+ * @see {@link BreadCrumbProps.pt}
+ */
+export interface BreadCrumbPassThroughOptions {
+    /**
+     * Uses to pass attributes to the root's DOM element.
+     */
+    root?: BreadCrumbPassThroughType<React.HTMLAttributes<HTMLElement>>;
+    /**
+     * Uses to pass attributes to the list's DOM element.
+     */
+    menu?: BreadCrumbPassThroughType<React.HTMLAttributes<HTMLUListElement>>;
+    /**
+     * Uses to pass attributes to the list item's DOM element.
+     */
+    menuitem?: BreadCrumbPassThroughType<React.HTMLAttributes<HTMLLIElement>>;
+    /**
+     * Uses to pass attributes to the action's DOM element.
+     */
+    action?: BreadCrumbPassThroughType<React.HTMLAttributes<HTMLAnchorElement>>;
+    /**
+     * Uses to pass attributes to the icon's DOM element.
+     */
+    icon?: BreadCrumbPassThroughType<React.SVGProps<SVGSVGElement> | React.HTMLAttributes<HTMLSpanElement>>;
+    /**
+     * Uses to pass attributes to the label's DOM element.
+     */
+    label?: BreadCrumbPassThroughType<React.HTMLAttributes<HTMLSpanElement>>;
+    /**
+     * Uses to pass attributes to the separator's DOM element.
+     */
+    separator?: BreadCrumbPassThroughType<React.HTMLAttributes<HTMLLIElement>>;
+    /**
+     * Uses to pass attributes to the separator icon's DOM element.
+     */
+    separatorIcon?: BreadCrumbPassThroughType<React.SVGProps<SVGSVGElement> | React.HTMLAttributes<HTMLSpanElement>>;
+}
 /**
  * Defines valid properties in BreadCrumb component. In addition to these, all properties of HTMLElement can be used in this component.
  * @group Properties
@@ -33,6 +80,11 @@ export interface BreadCrumbProps extends Omit<React.DetailedHTMLProps<React.HTML
      * @readonly
      */
     children?: React.ReactNode | undefined;
+    /**
+     * Uses to pass attributes to DOM elements inside the component.
+     * @type {BreadCrumbPassThroughOptions}
+     */
+    pt?: BreadCrumbPassThroughOptions;
 }
 
 /**

package/breadcrumb/breadcrumb.esm.js

@@ -1,23 +1,51 @@
 import * as React from 'react';
-import { ObjectUtils, classNames, IconUtils } from 'primereact/utils';
+import { PrimeReactContext } from 'primereact/api';
 import { ChevronRightIcon } from 'primereact/icons/chevronright';
+import { classNames, mergeProps, IconUtils, ObjectUtils } from 'primereact/utils';
+import { ComponentBase } from 'primereact/componentbase';
 
-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";
+
+  return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) {
+    return typeof obj;
+  } : function (obj) {
+    return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
+  }, _typeof(obj);
+}
+
+function _toPrimitive(input, hint) {
+  if (_typeof(input) !== "object" || input === null) return input;
+  var prim = input[Symbol.toPrimitive];
+  if (prim !== undefined) {
+    var res = prim.call(input, hint || "default");
+    if (_typeof(res) !== "object") return res;
+    throw new TypeError("@@toPrimitive must return a primitive value.");
+  }
+  return (hint === "string" ? String : Number)(input);
+}
+
+function _toPropertyKey(arg) {
+  var key = _toPrimitive(arg, "string");
+  return _typeof(key) === "symbol" ? key : String(key);
+}
+
+function _defineProperty(obj, key, value) {
+  key = _toPropertyKey(key);
+  if (key in obj) {
+    Object.defineProperty(obj, key, {
+      value: value,
+      enumerable: true,
+      configurable: true,
+      writable: true
+    });
+  } else {
+    obj[key] = value;
+  }
+  return obj;
 }
 
-var BreadCrumbBase = {
+var BreadCrumbBase = ComponentBase.extend({
   defaultProps: {
     __TYPE: 'BreadCrumb',
     id: null,
@@ -27,17 +55,18 @@ var BreadCrumbBase = {
     style: null,
     className: null,
     children: undefined
-  },
-  getProps: function getProps(props) {
-    return ObjectUtils.getMergedProps(props, BreadCrumbBase.defaultProps);
-  },
-  getOtherProps: function getOtherProps(props) {
-    return ObjectUtils.getDiffProps(props, BreadCrumbBase.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 BreadCrumb = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (inProps, ref) {
-  var props = BreadCrumbBase.getProps(inProps);
+  var context = React.useContext(PrimeReactContext);
+  var props = BreadCrumbBase.getProps(inProps, context);
+  var _BreadCrumbBase$setMe = BreadCrumbBase.setMetaData({
+      props: props
+    }),
+    ptm = _BreadCrumbBase$setMe.ptm;
   var elementRef = React.useRef(null);
   var itemClick = function itemClick(event, item) {
     if (item.disabled) {
@@ -66,24 +95,31 @@ var BreadCrumb = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function
         disabled = home.disabled,
         style = home.style,
         _className = home.className,
-        template = home.template;
+        template = home.template,
+        _label = home.label;
       var _className2 = classNames('p-breadcrumb-home', {
         'p-disabled': disabled
       }, _className);
-      var icon = IconUtils.getJSXIcon(_icon, {
+      var iconProps = mergeProps({
         className: 'p-menuitem-icon'
-      }, {
+      }, ptm('icon'));
+      var icon = IconUtils.getJSXIcon(_icon, _objectSpread({}, iconProps), {
         props: props
       });
-      var content = /*#__PURE__*/React.createElement("a", {
+      var actionProps = mergeProps({
         href: url || '#',
-        className: "p-menuitem-link",
-        "aria-disabled": disabled,
+        className: 'p-menuitem-link',
+        'aria-disabled': disabled,
         target: target,
         onClick: function onClick(event) {
           return itemClick(event, home);
         }
-      }, icon);
+      }, ptm('action'));
+      var labelProps = mergeProps({
+        className: 'p-menuitem-text'
+      }, ptm('label'));
+      var label = _label && /*#__PURE__*/React.createElement("span", labelProps, _label);
+      var content = /*#__PURE__*/React.createElement("a", actionProps, icon, label);
       if (template) {
         var defaultContentOptions = {
           onClick: function onClick(event) {
@@ -96,44 +132,49 @@ var BreadCrumb = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function
         };
         content = ObjectUtils.getJSXElement(template, home, defaultContentOptions);
       }
-      return /*#__PURE__*/React.createElement("li", {
+      var menuitemProps = mergeProps({
         className: _className2,
         style: style
-      }, content);
+      }, ptm('menuitem'));
+      return /*#__PURE__*/React.createElement("li", menuitemProps, content);
     }
     return null;
   };
   var createSeparator = function createSeparator() {
     var iconClassName = 'p-breadcrumb-chevron';
-    var icon = props.separatorIcon || /*#__PURE__*/React.createElement(ChevronRightIcon, {
-      className: iconClassName
-    });
-    var separatorIcon = IconUtils.getJSXIcon(icon, {
+    var separatorIconProps = mergeProps({
       className: iconClassName
-    }, {
+    }, ptm('separatorIcon'));
+    var icon = props.separatorIcon || /*#__PURE__*/React.createElement(ChevronRightIcon, separatorIconProps);
+    var separatorIcon = IconUtils.getJSXIcon(icon, _objectSpread({}, separatorIconProps), {
       props: props
     });
-    return separatorIcon;
+    var separatorProps = mergeProps({
+      className: 'p-menuitem-separator'
+    }, ptm('separator'));
+    return /*#__PURE__*/React.createElement("li", separatorProps, separatorIcon);
   };
   var createMenuitem = function createMenuitem(item) {
     if (item.visible === false) {
       return null;
     }
-    var className = classNames(item.className, {
+    var className = classNames('p-menuitem', item.className, {
       'p-disabled': item.disabled
     });
-    var label = item.label && /*#__PURE__*/React.createElement("span", {
-      className: "p-menuitem-text"
-    }, item.label);
-    var content = /*#__PURE__*/React.createElement("a", {
+    var labelProps = mergeProps({
+      className: 'p-menuitem-text'
+    }, ptm('label'));
+    var label = item.label && /*#__PURE__*/React.createElement("span", labelProps, item.label);
+    var actionProps = mergeProps({
       href: item.url || '#',
-      className: "p-menuitem-link",
+      className: 'p-menuitem-link',
       target: item.target,
       onClick: function onClick(event) {
         return itemClick(event, item);
       },
-      "aria-disabled": item.disabled
-    }, label);
+      'aria-disabled': item.disabled
+    }, ptm('action'));
+    var content = /*#__PURE__*/React.createElement("a", actionProps, label);
     if (item.template) {
       var defaultContentOptions = {
         onClick: function onClick(event) {
@@ -146,10 +187,11 @@ var BreadCrumb = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function
       };
       content = ObjectUtils.getJSXElement(item.template, item, defaultContentOptions);
     }
-    return /*#__PURE__*/React.createElement("li", {
+    var menuitemProps = mergeProps({
       className: className,
       style: item.style
-    }, content);
+    }, ptm('menuitem'));
+    return /*#__PURE__*/React.createElement("li", menuitemProps, content);
   };
   var createMenuitems = function createMenuitems() {
     if (props.model) {
@@ -176,18 +218,21 @@ var BreadCrumb = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function
       }
     };
   });
-  var otherProps = BreadCrumbBase.getOtherProps(props);
   var className = classNames('p-breadcrumb p-component', props.className);
   var home = createHome();
   var items = createMenuitems();
   var separator = createSeparator();
-  return /*#__PURE__*/React.createElement("nav", _extends({
+  var menuProps = mergeProps({
+    className: 'p-breadcrumb-list'
+  }, ptm('menu'));
+  var rootProps = mergeProps({
     id: props.id,
     ref: elementRef,
     className: className,
     style: props.style,
-    "aria-label": "Breadcrumb"
-  }, otherProps), /*#__PURE__*/React.createElement("ul", null, home, separator, items));
+    'aria-label': 'Breadcrumb'
+  }, BreadCrumbBase.getOtherProps(props), ptm('root'));
+  return /*#__PURE__*/React.createElement("nav", rootProps, /*#__PURE__*/React.createElement("ul", menuProps, home, separator, items));
 }));
 BreadCrumb.displayName = 'BreadCrumb';
 

package/breadcrumb/breadcrumb.esm.min.js

@@ -1 +1 @@
-import*as e from"react";import{ObjectUtils as t,classNames as r,IconUtils as n}from"primereact/utils";import{ChevronRightIcon as l}from"primereact/icons/chevronright";function a(){return a=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e},a.apply(this,arguments)}var i={defaultProps:{__TYPE:"BreadCrumb",id:null,model:null,home:null,separatorIcon:null,style:null,className:null,children:void 0},getProps:function(e){return t.getMergedProps(e,i.defaultProps)},getOtherProps:function(e){return t.getDiffProps(e,i.defaultProps)}},m=e.memo(e.forwardRef((function(m,s){var u=i.getProps(m),o=e.useRef(null),c=function(e,t){t.disabled?e.preventDefault():(t.url||e.preventDefault(),t.command&&t.command({originalEvent:e,item:t}))},p=function(){var t="p-breadcrumb-chevron";return n.getJSXIcon(u.separatorIcon||e.createElement(l,{className:t}),{className:t},{props:u})},d=function(n){if(!1===n.visible)return null;var l=r(n.className,{"p-disabled":n.disabled}),a=e.createElement("a",{href:n.url||"#",className:"p-menuitem-link",target:n.target,onClick:function(e){return c(e,n)},"aria-disabled":n.disabled},n.label&&e.createElement("span",{className:"p-menuitem-text"},n.label));n.template&&(a=t.getJSXElement(n.template,n,{onClick:function(e){return c(e,n)},className:"p-menuitem-link",labelClassName:"p-menuitem-text",element:a,props:u}));return e.createElement("li",{className:l,style:n.style},a)};e.useImperativeHandle(s,(function(){return{props:u,getElement:function(){return o.current}}}));var f=i.getOtherProps(u),b=r("p-breadcrumb p-component",u.className),g=function(){var l=u.home;if(l){if(!1===l.visible)return null;var a=l.icon,i=l.target,m=l.url,s=l.disabled,o=l.style,p=l.template,d=r("p-breadcrumb-home",{"p-disabled":s},l.className),f=n.getJSXIcon(a,{className:"p-menuitem-icon"},{props:u}),b=e.createElement("a",{href:m||"#",className:"p-menuitem-link","aria-disabled":s,target:i,onClick:function(e){return c(e,l)}},f);if(p)b=t.getJSXElement(p,l,{onClick:function(e){return c(e,l)},className:"p-menuitem-link",labelClassName:"p-menuitem-text",element:b,props:u});return e.createElement("li",{className:d,style:o},b)}return null}(),v=function(){if(u.model){var t=u.model.map((function(t,r){if(!1===t.visible)return null;var n=d(t),l=r===u.model.length-1?null:p();return e.createElement(e.Fragment,{key:t.label+"_"+r},n,l)}));return t}return null}(),N=p();return e.createElement("nav",a({id:u.id,ref:o,className:b,style:u.style,"aria-label":"Breadcrumb"},f),e.createElement("ul",null,g,N,v))})));m.displayName="BreadCrumb";export{m as BreadCrumb};
+import*as e from"react";import{PrimeReactContext as t}from"primereact/api";import{ChevronRightIcon as r}from"primereact/icons/chevronright";import{classNames as n,mergeProps as a,IconUtils as l,ObjectUtils as i}from"primereact/utils";import{ComponentBase as o}from"primereact/componentbase";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 u(e,t){if("object"!==m(e)||null===e)return e;var r=e[Symbol.toPrimitive];if(void 0!==r){var n=r.call(e,t||"default");if("object"!==m(n))return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}function c(e){var t=u(e,"string");return"symbol"===m(t)?t:String(t)}function s(e,t,r){return(t=c(t))in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}var p=o.extend({defaultProps:{__TYPE:"BreadCrumb",id:null,model:null,home:null,separatorIcon:null,style:null,className:null,children:void 0}});function f(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function b(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?f(Object(r),!0).forEach((function(t){s(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):f(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}var d=e.memo(e.forwardRef((function(o,m){var u=e.useContext(t),c=p.getProps(o,u),s=p.setMetaData({props:c}).ptm,f=e.useRef(null),d=function(e,t){t.disabled?e.preventDefault():(t.url||e.preventDefault(),t.command&&t.command({originalEvent:e,item:t}))},y=function(){var t=a({className:"p-breadcrumb-chevron"},s("separatorIcon")),n=l.getJSXIcon(c.separatorIcon||e.createElement(r,t),b({},t),{props:c}),i=a({className:"p-menuitem-separator"},s("separator"));return e.createElement("li",i,n)},v=function(t){if(!1===t.visible)return null;var r=n("p-menuitem",t.className,{"p-disabled":t.disabled}),l=a({className:"p-menuitem-text"},s("label")),o=t.label&&e.createElement("span",l,t.label),m=a({href:t.url||"#",className:"p-menuitem-link",target:t.target,onClick:function(e){return d(e,t)},"aria-disabled":t.disabled},s("action")),u=e.createElement("a",m,o);t.template&&(u=i.getJSXElement(t.template,t,{onClick:function(e){return d(e,t)},className:"p-menuitem-link",labelClassName:"p-menuitem-text",element:u,props:c}));var p=a({className:r,style:t.style},s("menuitem"));return e.createElement("li",p,u)};e.useImperativeHandle(m,(function(){return{props:c,getElement:function(){return f.current}}}));var g=n("p-breadcrumb p-component",c.className),N=function(){var t=c.home;if(t){if(!1===t.visible)return null;var r=t.icon,o=t.target,m=t.url,u=t.disabled,p=t.style,f=t.template,y=t.label,v=n("p-breadcrumb-home",{"p-disabled":u},t.className),g=a({className:"p-menuitem-icon"},s("icon")),N=l.getJSXIcon(r,b({},g),{props:c}),E=a({href:m||"#",className:"p-menuitem-link","aria-disabled":u,target:o,onClick:function(e){return d(e,t)}},s("action")),O=a({className:"p-menuitem-text"},s("label")),h=e.createElement("a",E,N,y&&e.createElement("span",O,y));if(f)h=i.getJSXElement(f,t,{onClick:function(e){return d(e,t)},className:"p-menuitem-link",labelClassName:"p-menuitem-text",element:h,props:c});var P=a({className:v,style:p},s("menuitem"));return e.createElement("li",P,h)}return null}(),E=function(){if(c.model){var t=c.model.map((function(t,r){if(!1===t.visible)return null;var n=v(t),a=r===c.model.length-1?null:y();return e.createElement(e.Fragment,{key:t.label+"_"+r},n,a)}));return t}return null}(),O=y(),h=a({className:"p-breadcrumb-list"},s("menu")),P=a({id:c.id,ref:f,className:g,style:c.style,"aria-label":"Breadcrumb"},p.getOtherProps(c),s("root"));return e.createElement("nav",P,e.createElement("ul",h,N,O,E))})));d.displayName="BreadCrumb";export{d as BreadCrumb};