primereact 9.3.1 → 9.5.0

package/checkbox/checkbox.esm.js

@@ -1,8 +1,8 @@
 import * as React from 'react';
-import { useUpdateEffect } from 'primereact/hooks';
+import { useUpdateEffect, useMountEffect } from 'primereact/hooks';
+import { CheckIcon } from 'primereact/icons/check';
 import { Tooltip } from 'primereact/tooltip';
 import { ObjectUtils, DomHandler, classNames, IconUtils } from 'primereact/utils';
-import { CheckIcon } from 'primereact/icons/check';
 
 function _extends() {
   _extends = Object.assign ? Object.assign.bind() : function (target) {
@@ -77,26 +77,28 @@ function _slicedToArray(arr, i) {
 var CheckboxBase = {
   defaultProps: {
     __TYPE: 'Checkbox',
-    id: null,
-    inputRef: null,
-    inputId: null,
-    value: null,
-    name: null,
+    autoFocus: false,
     checked: false,
-    trueValue: true,
-    falseValue: false,
-    style: null,
     className: null,
     disabled: false,
-    required: false,
+    falseValue: false,
+    icon: null,
+    id: null,
+    inputId: null,
+    inputRef: null,
+    name: null,
+    onChange: null,
+    onClick: null,
+    onContextMenu: null,
+    onMouseDown: null,
     readOnly: false,
+    required: false,
+    style: null,
     tabIndex: null,
-    icon: null,
     tooltip: null,
     tooltipOptions: null,
-    onChange: null,
-    onMouseDown: null,
-    onContextMenu: null,
+    trueValue: true,
+    value: null,
     children: undefined
   },
   getProps: function getProps(props) {
@@ -116,19 +118,26 @@ var Checkbox = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (
   var elementRef = React.useRef(null);
   var inputRef = React.useRef(props.inputRef);
   var onClick = function onClick(event) {
-    if (!props.disabled && !props.readOnly && props.onChange) {
+    if (props.disabled || props.readOnly) {
+      return;
+    }
+    if (props.onChange || props.onClick) {
       var _checked = isChecked();
       var checkboxClicked = event.target instanceof HTMLDivElement || event.target instanceof HTMLSpanElement || event.target instanceof Object;
       var isInputToggled = event.target === inputRef.current;
       var isCheckboxToggled = checkboxClicked && event.target.checked !== _checked;
       if (isInputToggled || isCheckboxToggled) {
         var value = _checked ? props.falseValue : props.trueValue;
-        props.onChange({
+        var eventData = {
           originalEvent: event,
           value: props.value,
           checked: value,
-          stopPropagation: function stopPropagation() {},
-          preventDefault: function preventDefault() {},
+          stopPropagation: function stopPropagation() {
+            event.stopPropagation();
+          },
+          preventDefault: function preventDefault() {
+            event.preventDefault();
+          },
           target: {
             type: 'checkbox',
             name: props.name,
@@ -136,7 +145,14 @@ var Checkbox = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (
             value: props.value,
             checked: value
           }
-        });
+        };
+        props.onClick && props.onClick(eventData);
+
+        // do not continue if the user defined click wants to prevent
+        if (event.defaultPrevented) {
+          return;
+        }
+        props.onChange && props.onChange(eventData);
       }
       DomHandler.focus(inputRef.current);
       event.preventDefault();
@@ -177,6 +193,11 @@ var Checkbox = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (
   useUpdateEffect(function () {
     inputRef.current.checked = isChecked();
   }, [props.checked, props.trueValue]);
+  useMountEffect(function () {
+    if (props.autoFocus) {
+      DomHandler.focus(inputRef.current, props.autoFocus);
+    }
+  });
   var checked = isChecked();
   var hasTooltip = ObjectUtils.isNotEmpty(props.tooltip);
   var otherProps = CheckboxBase.getOtherProps(props);

package/checkbox/checkbox.esm.min.js

@@ -1 +1 @@
-import*as e from"react";import{useUpdateEffect as t}from"primereact/hooks";import{Tooltip as n}from"primereact/tooltip";import{ObjectUtils as r,DomHandler as o,classNames as l,IconUtils as a}from"primereact/utils";import{CheckIcon as c}from"primereact/icons/check";function u(){return u=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},u.apply(this,arguments)}function i(e){if(Array.isArray(e))return e}function s(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var r,o,l,a,c=[],u=!0,i=!1;try{if(l=(n=n.call(e)).next,0===t){if(Object(n)!==n)return;u=!1}else for(;!(u=(r=l.call(n)).done)&&(c.push(r.value),c.length!==t);u=!0);}catch(e){i=!0,o=e}finally{try{if(!u&&null!=n.return&&(a=n.return(),Object(a)!==a))return}finally{if(i)throw o}}return c}}function f(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 p(e,t){if(e){if("string"==typeof e)return f(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)?f(e,t):void 0}}function d(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var m={defaultProps:{__TYPE:"Checkbox",id:null,inputRef:null,inputId:null,value:null,name:null,checked:!1,trueValue:!0,falseValue:!1,style:null,className:null,disabled:!1,required:!1,readOnly:!1,tabIndex:null,icon:null,tooltip:null,tooltipOptions:null,onChange:null,onMouseDown:null,onContextMenu:null,children:void 0},getProps:function(e){return r.getMergedProps(e,m.defaultProps)},getOtherProps:function(e){return r.getDiffProps(e,m.defaultProps)}},h=e.memo(e.forwardRef((function(f,h){var b,g,y=m.getProps(f),v=e.useState(!1),k=(g=2,i(b=v)||s(b,g)||p(b,g)||d()),x=k[0],O=k[1],E=e.useRef(null),P=e.useRef(y.inputRef),I=function(e){if(!y.disabled&&!y.readOnly&&y.onChange){var t=C(),n=e.target instanceof HTMLDivElement||e.target instanceof HTMLSpanElement||e.target instanceof Object;if(e.target===P.current||n&&e.target.checked!==t){var r=t?y.falseValue:y.trueValue;y.onChange({originalEvent:e,value:y.value,checked:r,stopPropagation:function(){},preventDefault:function(){},target:{type:"checkbox",name:y.name,id:y.id,value:y.value,checked:r}})}o.focus(P.current),e.preventDefault()}},C=function(){return y.checked===y.trueValue};e.useImperativeHandle(h,(function(){return{props:y,focus:function(){return o.focus(P.current)},getElement:function(){return E.current},getInput:function(){return P.current}}})),e.useEffect((function(){r.combinedRefs(P,y.inputRef)}),[P,y.inputRef]),t((function(){P.current.checked=C()}),[y.checked,y.trueValue]);var w=C(),M=r.isNotEmpty(y.tooltip),R=m.getOtherProps(y),S=r.reduceKeys(R,o.ARIA_PROPS),j=l("p-checkbox p-component",{"p-checkbox-checked":w,"p-checkbox-disabled":y.disabled,"p-checkbox-focused":x},y.className),N=l("p-checkbox-box",{"p-highlight":w,"p-disabled":y.disabled,"p-focus":x}),A="p-checkbox-icon p-c",D=a.getJSXIcon(w?y.icon||e.createElement(c,{className:A}):null,{className:A},{props:y,checked:w});return e.createElement(e.Fragment,null,e.createElement("div",u({ref:E,id:y.id,className:j,style:y.style},R,{onClick:I,onContextMenu:y.onContextMenu,onMouseDown:y.onMouseDown}),e.createElement("div",{className:"p-hidden-accessible"},e.createElement("input",u({ref:P,type:"checkbox",id:y.inputId,name:y.name,tabIndex:y.tabIndex,defaultChecked:w,onFocus:function(){O(!0)},onBlur:function(){O(!1)},onKeyDown:function(e){"Space"!==e.code&&" "!==e.key||I(e)},disabled:y.disabled,readOnly:y.readOnly,required:y.required},S))),e.createElement("div",{className:N},D)),M&&e.createElement(n,u({target:E,content:y.tooltip},y.tooltipOptions)))})));h.displayName="Checkbox";export{h as Checkbox};
+import*as e from"react";import{useUpdateEffect as t,useMountEffect as n}from"primereact/hooks";import{CheckIcon as r}from"primereact/icons/check";import{Tooltip as o}from"primereact/tooltip";import{ObjectUtils as c,DomHandler as l,classNames as a,IconUtils as u}from"primereact/utils";function i(){return i=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},i.apply(this,arguments)}function s(e){if(Array.isArray(e))return e}function f(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var r,o,c,l,a=[],u=!0,i=!1;try{if(c=(n=n.call(e)).next,0===t){if(Object(n)!==n)return;u=!1}else for(;!(u=(r=c.call(n)).done)&&(a.push(r.value),a.length!==t);u=!0);}catch(e){i=!0,o=e}finally{try{if(!u&&null!=n.return&&(l=n.return(),Object(l)!==l))return}finally{if(i)throw o}}return a}}function p(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 d(e,t){if(e){if("string"==typeof e)return p(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)?p(e,t):void 0}}function m(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var h={defaultProps:{__TYPE:"Checkbox",autoFocus:!1,checked:!1,className:null,disabled:!1,falseValue:!1,icon:null,id:null,inputId:null,inputRef:null,name:null,onChange:null,onClick:null,onContextMenu:null,onMouseDown:null,readOnly:!1,required:!1,style:null,tabIndex:null,tooltip:null,tooltipOptions:null,trueValue:!0,value:null,children:void 0},getProps:function(e){return c.getMergedProps(e,h.defaultProps)},getOtherProps:function(e){return c.getDiffProps(e,h.defaultProps)}},b=e.memo(e.forwardRef((function(p,b){var g,y,v=h.getProps(p),k=e.useState(!1),x=(y=2,s(g=k)||f(g,y)||d(g,y)||m()),O=x[0],C=x[1],P=e.useRef(null),E=e.useRef(v.inputRef),I=function(e){if(!v.disabled&&!v.readOnly&&(v.onChange||v.onClick)){var t=w(),n=e.target instanceof HTMLDivElement||e.target instanceof HTMLSpanElement||e.target instanceof Object;if(e.target===E.current||n&&e.target.checked!==t){var r=t?v.falseValue:v.trueValue,o={originalEvent:e,value:v.value,checked:r,stopPropagation:function(){e.stopPropagation()},preventDefault:function(){e.preventDefault()},target:{type:"checkbox",name:v.name,id:v.id,value:v.value,checked:r}};if(v.onClick&&v.onClick(o),e.defaultPrevented)return;v.onChange&&v.onChange(o)}l.focus(E.current),e.preventDefault()}},w=function(){return v.checked===v.trueValue};e.useImperativeHandle(b,(function(){return{props:v,focus:function(){return l.focus(E.current)},getElement:function(){return P.current},getInput:function(){return E.current}}})),e.useEffect((function(){c.combinedRefs(E,v.inputRef)}),[E,v.inputRef]),t((function(){E.current.checked=w()}),[v.checked,v.trueValue]),n((function(){v.autoFocus&&l.focus(E.current,v.autoFocus)}));var M=w(),R=c.isNotEmpty(v.tooltip),S=h.getOtherProps(v),j=c.reduceKeys(S,l.ARIA_PROPS),D=a("p-checkbox p-component",{"p-checkbox-checked":M,"p-checkbox-disabled":v.disabled,"p-checkbox-focused":O},v.className),N=a("p-checkbox-box",{"p-highlight":M,"p-disabled":v.disabled,"p-focus":O}),A="p-checkbox-icon p-c",V=u.getJSXIcon(M?v.icon||e.createElement(r,{className:A}):null,{className:A},{props:v,checked:M});return e.createElement(e.Fragment,null,e.createElement("div",i({ref:P,id:v.id,className:D,style:v.style},S,{onClick:I,onContextMenu:v.onContextMenu,onMouseDown:v.onMouseDown}),e.createElement("div",{className:"p-hidden-accessible"},e.createElement("input",i({ref:E,type:"checkbox",id:v.inputId,name:v.name,tabIndex:v.tabIndex,defaultChecked:M,onFocus:function(){C(!0)},onBlur:function(){C(!1)},onKeyDown:function(e){"Space"!==e.code&&" "!==e.key||I(e)},disabled:v.disabled,readOnly:v.readOnly,required:v.required},j))),e.createElement("div",{className:N},V)),R&&e.createElement(o,i({target:P,content:v.tooltip},v.tooltipOptions)))})));b.displayName="Checkbox";export{b as Checkbox};

package/checkbox/checkbox.js

@@ -1,5 +1,5 @@
 this.primereact = this.primereact || {};
-this.primereact.checkbox = (function (exports, React, hooks, tooltip, utils, check) {
+this.primereact.checkbox = (function (exports, React, hooks, check, tooltip, utils) {
   'use strict';
 
   function _interopNamespace(e) {
@@ -95,26 +95,28 @@ this.primereact.checkbox = (function (exports, React, hooks, tooltip, utils, che
   var CheckboxBase = {
     defaultProps: {
       __TYPE: 'Checkbox',
-      id: null,
-      inputRef: null,
-      inputId: null,
-      value: null,
-      name: null,
+      autoFocus: false,
       checked: false,
-      trueValue: true,
-      falseValue: false,
-      style: null,
       className: null,
       disabled: false,
-      required: false,
+      falseValue: false,
+      icon: null,
+      id: null,
+      inputId: null,
+      inputRef: null,
+      name: null,
+      onChange: null,
+      onClick: null,
+      onContextMenu: null,
+      onMouseDown: null,
       readOnly: false,
+      required: false,
+      style: null,
       tabIndex: null,
-      icon: null,
       tooltip: null,
       tooltipOptions: null,
-      onChange: null,
-      onMouseDown: null,
-      onContextMenu: null,
+      trueValue: true,
+      value: null,
       children: undefined
     },
     getProps: function getProps(props) {
@@ -134,19 +136,26 @@ this.primereact.checkbox = (function (exports, React, hooks, tooltip, utils, che
     var elementRef = React__namespace.useRef(null);
     var inputRef = React__namespace.useRef(props.inputRef);
     var onClick = function onClick(event) {
-      if (!props.disabled && !props.readOnly && props.onChange) {
+      if (props.disabled || props.readOnly) {
+        return;
+      }
+      if (props.onChange || props.onClick) {
         var _checked = isChecked();
         var checkboxClicked = event.target instanceof HTMLDivElement || event.target instanceof HTMLSpanElement || event.target instanceof Object;
         var isInputToggled = event.target === inputRef.current;
         var isCheckboxToggled = checkboxClicked && event.target.checked !== _checked;
         if (isInputToggled || isCheckboxToggled) {
           var value = _checked ? props.falseValue : props.trueValue;
-          props.onChange({
+          var eventData = {
             originalEvent: event,
             value: props.value,
             checked: value,
-            stopPropagation: function stopPropagation() {},
-            preventDefault: function preventDefault() {},
+            stopPropagation: function stopPropagation() {
+              event.stopPropagation();
+            },
+            preventDefault: function preventDefault() {
+              event.preventDefault();
+            },
             target: {
               type: 'checkbox',
               name: props.name,
@@ -154,7 +163,14 @@ this.primereact.checkbox = (function (exports, React, hooks, tooltip, utils, che
               value: props.value,
               checked: value
             }
-          });
+          };
+          props.onClick && props.onClick(eventData);
+
+          // do not continue if the user defined click wants to prevent
+          if (event.defaultPrevented) {
+            return;
+          }
+          props.onChange && props.onChange(eventData);
         }
         utils.DomHandler.focus(inputRef.current);
         event.preventDefault();
@@ -195,6 +211,11 @@ this.primereact.checkbox = (function (exports, React, hooks, tooltip, utils, che
     hooks.useUpdateEffect(function () {
       inputRef.current.checked = isChecked();
     }, [props.checked, props.trueValue]);
+    hooks.useMountEffect(function () {
+      if (props.autoFocus) {
+        utils.DomHandler.focus(inputRef.current, props.autoFocus);
+      }
+    });
     var checked = isChecked();
     var hasTooltip = utils.ObjectUtils.isNotEmpty(props.tooltip);
     var otherProps = CheckboxBase.getOtherProps(props);
@@ -258,4 +279,4 @@ this.primereact.checkbox = (function (exports, React, hooks, tooltip, utils, che
 
   return exports;
 
-})({}, React, primereact.hooks, primereact.tooltip, primereact.utils, primereact.icons.check);
+})({}, React, primereact.hooks, primereact.icons.check, primereact.tooltip, primereact.utils);

package/checkbox/checkbox.min.js

@@ -1 +1 @@
-this.primereact=this.primereact||{},this.primereact.checkbox=function(e,t,n,r,c,o){"use strict";function l(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 a=l(t);function u(){return u=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},u.apply(this,arguments)}function i(e){if(Array.isArray(e))return e}function s(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var r,c,o,l,a=[],u=!0,i=!1;try{if(o=(n=n.call(e)).next,0===t){if(Object(n)!==n)return;u=!1}else for(;!(u=(r=o.call(n)).done)&&(a.push(r.value),a.length!==t);u=!0);}catch(e){i=!0,c=e}finally{try{if(!u&&null!=n.return&&(l=n.return(),Object(l)!==l))return}finally{if(i)throw c}}return a}}function f(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 d(e,t){if(e){if("string"==typeof e)return f(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)?f(e,t):void 0}}function p(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var b={defaultProps:{__TYPE:"Checkbox",id:null,inputRef:null,inputId:null,value:null,name:null,checked:!1,trueValue:!0,falseValue:!1,style:null,className:null,disabled:!1,required:!1,readOnly:!1,tabIndex:null,icon:null,tooltip:null,tooltipOptions:null,onChange:null,onMouseDown:null,onContextMenu:null,children:void 0},getProps:function(e){return c.ObjectUtils.getMergedProps(e,b.defaultProps)},getOtherProps:function(e){return c.ObjectUtils.getDiffProps(e,b.defaultProps)}},m=a.memo(a.forwardRef((function(e,t){var l,f,m=b.getProps(e),h=a.useState(!1),y=(f=2,i(l=h)||s(l,f)||d(l,f)||p()),g=y[0],v=y[1],O=a.useRef(null),k=a.useRef(m.inputRef),j=function(e){if(!m.disabled&&!m.readOnly&&m.onChange){var t=x(),n=e.target instanceof HTMLDivElement||e.target instanceof HTMLSpanElement||e.target instanceof Object;if(e.target===k.current||n&&e.target.checked!==t){var r=t?m.falseValue:m.trueValue;m.onChange({originalEvent:e,value:m.value,checked:r,stopPropagation:function(){},preventDefault:function(){},target:{type:"checkbox",name:m.name,id:m.id,value:m.value,checked:r}})}c.DomHandler.focus(k.current),e.preventDefault()}},x=function(){return m.checked===m.trueValue};a.useImperativeHandle(t,(function(){return{props:m,focus:function(){return c.DomHandler.focus(k.current)},getElement:function(){return O.current},getInput:function(){return k.current}}})),a.useEffect((function(){c.ObjectUtils.combinedRefs(k,m.inputRef)}),[k,m.inputRef]),n.useUpdateEffect((function(){k.current.checked=x()}),[m.checked,m.trueValue]);var E=x(),P=c.ObjectUtils.isNotEmpty(m.tooltip),I=b.getOtherProps(m),C=c.ObjectUtils.reduceKeys(I,c.DomHandler.ARIA_PROPS),D=c.classNames("p-checkbox p-component",{"p-checkbox-checked":E,"p-checkbox-disabled":m.disabled,"p-checkbox-focused":g},m.className),M=c.classNames("p-checkbox-box",{"p-highlight":E,"p-disabled":m.disabled,"p-focus":g}),w="p-checkbox-icon p-c",N=c.IconUtils.getJSXIcon(E?m.icon||a.createElement(o.CheckIcon,{className:w}):null,{className:w},{props:m,checked:E});return a.createElement(a.Fragment,null,a.createElement("div",u({ref:O,id:m.id,className:D,style:m.style},I,{onClick:j,onContextMenu:m.onContextMenu,onMouseDown:m.onMouseDown}),a.createElement("div",{className:"p-hidden-accessible"},a.createElement("input",u({ref:k,type:"checkbox",id:m.inputId,name:m.name,tabIndex:m.tabIndex,defaultChecked:E,onFocus:function(){v(!0)},onBlur:function(){v(!1)},onKeyDown:function(e){"Space"!==e.code&&" "!==e.key||j(e)},disabled:m.disabled,readOnly:m.readOnly,required:m.required},C))),a.createElement("div",{className:M},N)),P&&a.createElement(r.Tooltip,u({target:O,content:m.tooltip},m.tooltipOptions)))})));return m.displayName="Checkbox",e.Checkbox=m,Object.defineProperty(e,"__esModule",{value:!0}),e}({},React,primereact.hooks,primereact.tooltip,primereact.utils,primereact.icons.check);
+this.primereact=this.primereact||{},this.primereact.checkbox=function(e,t,n,r,o,c){"use strict";function l(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 a=l(t);function u(){return u=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},u.apply(this,arguments)}function i(e){if(Array.isArray(e))return e}function s(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var r,o,c,l,a=[],u=!0,i=!1;try{if(c=(n=n.call(e)).next,0===t){if(Object(n)!==n)return;u=!1}else for(;!(u=(r=c.call(n)).done)&&(a.push(r.value),a.length!==t);u=!0);}catch(e){i=!0,o=e}finally{try{if(!u&&null!=n.return&&(l=n.return(),Object(l)!==l))return}finally{if(i)throw o}}return a}}function f(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 d(e,t){if(e){if("string"==typeof e)return f(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)?f(e,t):void 0}}function p(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var b={defaultProps:{__TYPE:"Checkbox",autoFocus:!1,checked:!1,className:null,disabled:!1,falseValue:!1,icon:null,id:null,inputId:null,inputRef:null,name:null,onChange:null,onClick:null,onContextMenu:null,onMouseDown:null,readOnly:!1,required:!1,style:null,tabIndex:null,tooltip:null,tooltipOptions:null,trueValue:!0,value:null,children:void 0},getProps:function(e){return c.ObjectUtils.getMergedProps(e,b.defaultProps)},getOtherProps:function(e){return c.ObjectUtils.getDiffProps(e,b.defaultProps)}},m=a.memo(a.forwardRef((function(e,t){var l,f,m=b.getProps(e),h=a.useState(!1),g=(f=2,i(l=h)||s(l,f)||d(l,f)||p()),y=g[0],v=g[1],k=a.useRef(null),O=a.useRef(m.inputRef),j=function(e){if(!m.disabled&&!m.readOnly&&(m.onChange||m.onClick)){var t=x(),n=e.target instanceof HTMLDivElement||e.target instanceof HTMLSpanElement||e.target instanceof Object;if(e.target===O.current||n&&e.target.checked!==t){var r=t?m.falseValue:m.trueValue,o={originalEvent:e,value:m.value,checked:r,stopPropagation:function(){e.stopPropagation()},preventDefault:function(){e.preventDefault()},target:{type:"checkbox",name:m.name,id:m.id,value:m.value,checked:r}};if(m.onClick&&m.onClick(o),e.defaultPrevented)return;m.onChange&&m.onChange(o)}c.DomHandler.focus(O.current),e.preventDefault()}},x=function(){return m.checked===m.trueValue};a.useImperativeHandle(t,(function(){return{props:m,focus:function(){return c.DomHandler.focus(O.current)},getElement:function(){return k.current},getInput:function(){return O.current}}})),a.useEffect((function(){c.ObjectUtils.combinedRefs(O,m.inputRef)}),[O,m.inputRef]),n.useUpdateEffect((function(){O.current.checked=x()}),[m.checked,m.trueValue]),n.useMountEffect((function(){m.autoFocus&&c.DomHandler.focus(O.current,m.autoFocus)}));var P=x(),C=c.ObjectUtils.isNotEmpty(m.tooltip),E=b.getOtherProps(m),D=c.ObjectUtils.reduceKeys(E,c.DomHandler.ARIA_PROPS),I=c.classNames("p-checkbox p-component",{"p-checkbox-checked":P,"p-checkbox-disabled":m.disabled,"p-checkbox-focused":y},m.className),M=c.classNames("p-checkbox-box",{"p-highlight":P,"p-disabled":m.disabled,"p-focus":y}),w="p-checkbox-icon p-c",N=c.IconUtils.getJSXIcon(P?m.icon||a.createElement(r.CheckIcon,{className:w}):null,{className:w},{props:m,checked:P});return a.createElement(a.Fragment,null,a.createElement("div",u({ref:k,id:m.id,className:I,style:m.style},E,{onClick:j,onContextMenu:m.onContextMenu,onMouseDown:m.onMouseDown}),a.createElement("div",{className:"p-hidden-accessible"},a.createElement("input",u({ref:O,type:"checkbox",id:m.inputId,name:m.name,tabIndex:m.tabIndex,defaultChecked:P,onFocus:function(){v(!0)},onBlur:function(){v(!1)},onKeyDown:function(e){"Space"!==e.code&&" "!==e.key||j(e)},disabled:m.disabled,readOnly:m.readOnly,required:m.required},D))),a.createElement("div",{className:M},N)),C&&a.createElement(o.Tooltip,u({target:k,content:m.tooltip},m.tooltipOptions)))})));return m.displayName="Checkbox",e.Checkbox=m,Object.defineProperty(e,"__esModule",{value:!0}),e}({},React,primereact.hooks,primereact.icons.check,primereact.tooltip,primereact.utils);

package/chip/chip.cjs.js

@@ -4,6 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var utils = require('primereact/utils');
+var componentbase = require('primereact/componentbase');
 var timescircle = require('primereact/icons/timescircle');
 
 function _interopNamespace(e) {
@@ -26,21 +27,6 @@ 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";
 
@@ -82,6 +68,21 @@ function _defineProperty(obj, key, value) {
   return obj;
 }
 
+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 _arrayWithHoles(arr) {
   if (Array.isArray(arr)) return arr;
 }
@@ -137,7 +138,7 @@ function _slicedToArray(arr, i) {
   return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
 }
 
-var ChipBase = {
+var ChipBase = componentbase.ComponentBase.extend({
   defaultProps: {
     __TYPE: 'Chip',
     label: null,
@@ -152,14 +153,8 @@ var ChipBase = {
     onImageError: null,
     onRemove: null,
     children: undefined
-  },
-  getProps: function getProps(props) {
-    return utils.ObjectUtils.getMergedProps(props, ChipBase.defaultProps);
-  },
-  getOtherProps: function getOtherProps(props) {
-    return utils.ObjectUtils.getDiffProps(props, ChipBase.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; }
@@ -170,6 +165,10 @@ var Chip = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.for
     _React$useState2 = _slicedToArray(_React$useState, 2),
     visibleState = _React$useState2[0],
     setVisibleState = _React$useState2[1];
+  var _ChipBase$setMetaData = ChipBase.setMetaData({
+      props: props
+    }),
+    ptm = _ChipBase$setMetaData.ptm;
   var onKeyDown = function onKeyDown(event) {
     if (event.keyCode === 13) {
       // enter
@@ -184,53 +183,57 @@ var Chip = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__namespace.for
   };
   var createContent = function createContent() {
     var content = [];
-    var iconProps = {
+    var removeIconProps = utils.mergeProps({
       key: 'removeIcon',
       tabIndex: 0,
       className: 'p-chip-remove-icon',
       onClick: close,
       onKeyDown: onKeyDown
-    };
-    var icon = props.removeIcon || /*#__PURE__*/React__namespace.createElement(timescircle.TimesCircleIcon, iconProps);
+    }, ptm('removeIcon'));
+    var icon = props.removeIcon || /*#__PURE__*/React__namespace.createElement(timescircle.TimesCircleIcon, removeIconProps);
     if (props.image) {
-      content.push( /*#__PURE__*/React__namespace.createElement("img", {
-        key: "image",
+      var imageProps = utils.mergeProps({
+        key: 'image',
         src: props.image,
-        alt: props.imageAlt,
         onError: props.onImageError
-      }));
+      }, ptm('image'));
+      content.push( /*#__PURE__*/React__namespace.createElement("img", _extends({
+        alt: props.imageAlt
+      }, imageProps)));
     } else if (props.icon) {
-      content.push(utils.IconUtils.getJSXIcon(props.icon, {
+      var chipIconProps = utils.mergeProps({
         key: 'icon',
         className: 'p-chip-icon'
-      }, {
+      }, ptm('icon'));
+      content.push(utils.IconUtils.getJSXIcon(props.icon, _objectSpread({}, chipIconProps), {
         props: props
       }));
     }
     if (props.label) {
-      content.push( /*#__PURE__*/React__namespace.createElement("span", {
-        key: "label",
-        className: "p-chip-text"
-      }, props.label));
+      var labelProps = utils.mergeProps({
+        key: 'label',
+        className: 'p-chip-text'
+      }, ptm('label'));
+      content.push( /*#__PURE__*/React__namespace.createElement("span", labelProps, props.label));
     }
     if (props.removable) {
-      content.push(utils.IconUtils.getJSXIcon(icon, _objectSpread({}, iconProps), {
+      content.push(utils.IconUtils.getJSXIcon(icon, _objectSpread({}, removeIconProps), {
         props: props
       }));
     }
     return content;
   };
   var createElement = function createElement() {
-    var otherProps = ChipBase.getOtherProps(props);
     var className = utils.classNames('p-chip p-component', {
       'p-chip-image': props.image != null
     }, props.className);
     var content = props.template ? utils.ObjectUtils.getJSXElement(props.template, props) : createContent();
-    return /*#__PURE__*/React__namespace.createElement("div", _extends({
+    var rootProps = utils.mergeProps({
       ref: elementRef,
-      className: className,
-      style: props.style
-    }, otherProps), content);
+      style: props.style,
+      className: className
+    }, ChipBase.getOtherProps(props), ptm('root'));
+    return /*#__PURE__*/React__namespace.createElement("div", rootProps, content);
   };
   React__namespace.useImperativeHandle(ref, function () {
     return {

package/chip/chip.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/timescircle");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 o=n(e);function i(){return i=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},i.apply(this,arguments)}function l(e){return l="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},l(e)}function c(e,t){if("object"!==l(e)||null===e)return e;var r=e[Symbol.toPrimitive];if(void 0!==r){var n=r.call(e,t||"default");if("object"!==l(n))return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}function a(e){var t=c(e,"string");return"symbol"===l(t)?t:String(t)}function u(e,t,r){return(t=a(t))in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function s(e){if(Array.isArray(e))return e}function p(e,t){var r=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=r){var n,o,i,l,c=[],a=!0,u=!1;try{if(i=(r=r.call(e)).next,0===t){if(Object(r)!==r)return;a=!1}else for(;!(a=(n=i.call(r)).done)&&(c.push(n.value),c.length!==t);a=!0);}catch(e){u=!0,o=e}finally{try{if(!a&&null!=r.return&&(l=r.return(),Object(l)!==l))return}finally{if(u)throw o}}return c}}function f(e,t){(null==t||t>e.length)&&(t=e.length);for(var r=0,n=new Array(t);r<t;r++)n[r]=e[r];return n}function m(e,t){if(e){if("string"==typeof e)return f(e,t);var r=Object.prototype.toString.call(e).slice(8,-1);return"Object"===r&&e.constructor&&(r=e.constructor.name),"Map"===r||"Set"===r?Array.from(e):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?f(e,t):void 0}}function b(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var y={defaultProps:{__TYPE:"Chip",label:null,icon:null,image:null,removable:!1,removeIcon:null,className:null,style:null,template:null,imageAlt:"chip",onImageError:null,onRemove:null,children:void 0},getProps:function(e){return t.ObjectUtils.getMergedProps(e,y.defaultProps)},getOtherProps:function(e){return t.ObjectUtils.getDiffProps(e,y.defaultProps)}};function g(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 v(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?g(Object(r),!0).forEach((function(t){u(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):g(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}var O=o.memo(o.forwardRef((function(e,n){var l,c,a,u,f,g=y.getProps(e),O=o.useRef(null),h=o.useState(!0),d=(c=2,s(l=h)||p(l,c)||m(l,c)||b()),j=d[0],P=d[1],S=function(e){13===e.keyCode&&w(e)},w=function(e){P(!1),g.onRemove&&g.onRemove(e)},E=function(){var e=[],n={key:"removeIcon",tabIndex:0,className:"p-chip-remove-icon",onClick:w,onKeyDown:S},i=g.removeIcon||o.createElement(r.TimesCircleIcon,n);return g.image?e.push(o.createElement("img",{key:"image",src:g.image,alt:g.imageAlt,onError:g.onImageError})):g.icon&&e.push(t.IconUtils.getJSXIcon(g.icon,{key:"icon",className:"p-chip-icon"},{props:g})),g.label&&e.push(o.createElement("span",{key:"label",className:"p-chip-text"},g.label)),g.removable&&e.push(t.IconUtils.getJSXIcon(i,v({},n),{props:g})),e};return o.useImperativeHandle(n,(function(){return{props:g,getElement:function(){return O.current}}})),j&&(a=y.getOtherProps(g),u=t.classNames("p-chip p-component",{"p-chip-image":null!=g.image},g.className),f=g.template?t.ObjectUtils.getJSXElement(g.template,g):E(),o.createElement("div",i({ref:O,className:u,style:g.style},a),f))})));O.displayName="Chip",exports.Chip=O;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),r=require("primereact/utils"),t=require("primereact/componentbase"),n=require("primereact/icons/timescircle");function o(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 i=o(e);function l(e){return l="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},l(e)}function a(e,r){if("object"!==l(e)||null===e)return e;var t=e[Symbol.toPrimitive];if(void 0!==t){var n=t.call(e,r||"default");if("object"!==l(n))return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===r?String:Number)(e)}function c(e){var r=a(e,"string");return"symbol"===l(r)?r:String(r)}function u(e,r,t){return(r=c(r))in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}function s(){return s=Object.assign?Object.assign.bind():function(e){for(var r=1;r<arguments.length;r++){var t=arguments[r];for(var n in t)Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n])}return e},s.apply(this,arguments)}function p(e){if(Array.isArray(e))return e}function m(e,r){var t=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=t){var n,o,i,l,a=[],c=!0,u=!1;try{if(i=(t=t.call(e)).next,0===r){if(Object(t)!==t)return;c=!1}else for(;!(c=(n=i.call(t)).done)&&(a.push(n.value),a.length!==r);c=!0);}catch(e){u=!0,o=e}finally{try{if(!c&&null!=t.return&&(l=t.return(),Object(l)!==l))return}finally{if(u)throw o}}return a}}function f(e,r){(null==r||r>e.length)&&(r=e.length);for(var t=0,n=new Array(r);t<r;t++)n[t]=e[t];return n}function b(e,r){if(e){if("string"==typeof e)return f(e,r);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,r):void 0}}function y(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var v=t.ComponentBase.extend({defaultProps:{__TYPE:"Chip",label:null,icon:null,image:null,removable:!1,removeIcon:null,className:null,style:null,template:null,imageAlt:"chip",onImageError:null,onRemove:null,children:void 0}});function g(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 O(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{};r%2?g(Object(t),!0).forEach((function(r){u(e,r,t[r])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):g(Object(t)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))}))}return e}var h=i.memo(i.forwardRef((function(e,t){var o,l,a,c,u,f=v.getProps(e),g=i.useRef(null),h=i.useState(!0),d=(l=2,p(o=h)||m(o,l)||b(o,l)||y()),j=d[0],P=d[1],S=v.setMetaData({props:f}).ptm,w=function(e){13===e.keyCode&&I(e)},I=function(e){P(!1),f.onRemove&&f.onRemove(e)},E=function(){var e=[],t=r.mergeProps({key:"removeIcon",tabIndex:0,className:"p-chip-remove-icon",onClick:I,onKeyDown:w},S("removeIcon")),o=f.removeIcon||i.createElement(n.TimesCircleIcon,t);if(f.image){var l=r.mergeProps({key:"image",src:f.image,onError:f.onImageError},S("image"));e.push(i.createElement("img",s({alt:f.imageAlt},l)))}else if(f.icon){var a=r.mergeProps({key:"icon",className:"p-chip-icon"},S("icon"));e.push(r.IconUtils.getJSXIcon(f.icon,O({},a),{props:f}))}if(f.label){var c=r.mergeProps({key:"label",className:"p-chip-text"},S("label"));e.push(i.createElement("span",c,f.label))}return f.removable&&e.push(r.IconUtils.getJSXIcon(o,O({},t),{props:f})),e};return i.useImperativeHandle(t,(function(){return{props:f,getElement:function(){return g.current}}})),j&&(a=r.classNames("p-chip p-component",{"p-chip-image":null!=f.image},f.className),c=f.template?r.ObjectUtils.getJSXElement(f.template,f):E(),u=r.mergeProps({ref:g,style:f.style,className:a},v.getOtherProps(f),S("root")),i.createElement("div",u,c))})));h.displayName="Chip",exports.Chip=h;

package/chip/chip.d.ts

@@ -8,7 +8,54 @@
  *
  */
 import * as React from 'react';
-import { IconType, TemplateType } from '../utils';
+import { IconType, PassThroughType, TemplateType } from '../utils';
+
+export declare type ChipPassThroughType<T> = PassThroughType<T, ChipPassThroughMethodOptions>;
+/**
+ * Custom passthrough(pt) option method.
+ */
+export interface ChipPassThroughMethodOptions {
+    props: ChipProps;
+    state: ChipState;
+}
+
+/**
+ * Custom passthrough(pt) options.
+ * @see {@link ChipProps.pt}
+ */
+export interface ChipPassThroughOptions {
+    /**
+     * Uses to pass attributes to the root's DOM element.
+     */
+    root?: ChipPassThroughType<React.HTMLAttributes<HTMLDivElement>>;
+    /**
+     * Uses to pass attributes to the image's DOM element.
+     */
+    image?: ChipPassThroughType<React.HTMLAttributes<HTMLImageElement>>;
+    /**
+     * Uses to pass attributes to the icon's DOM element.
+     */
+    icon?: ChipPassThroughType<React.SVGProps<SVGSVGElement> | React.HTMLAttributes<HTMLSpanElement>>;
+    /**
+     * Uses to pass attributes to the label' DOM element.
+     */
+    label?: ChipPassThroughType<React.HTMLAttributes<HTMLSpanElement>>;
+    /**
+     * Uses to pass attributes to the removeIcon's DOM element.
+     */
+    removeIcon?: ChipPassThroughType<React.SVGProps<SVGSVGElement> | React.HTMLAttributes<HTMLSpanElement>>;
+}
+
+/**
+ * Defines current inline state in Chip component.
+ */
+export interface ChipState {
+    /**
+     * Current visible state as a boolean.
+     * @defaultValue true
+     */
+    visible: boolean;
+}
 
 /**
  * Defines valid properties in Chip component. In addition to these, all properties of HTMLDivElement can be used in this component.
@@ -59,6 +106,11 @@ export interface ChipProps extends Omit<React.DetailedHTMLProps<React.HTMLAttrib
      * @readonly
      */
     children?: React.ReactNode | undefined;
+    /**
+     * Uses to pass attributes to DOM elements inside the component.
+     * @type {ChipPassThroughOptions}
+     */
+    pt?: ChipPassThroughOptions;
 }
 
 /**