primereact
Version:
PrimeReact is an open source UI library for React featuring a rich set of 90+ components, a theme designer, various theme alternatives such as Material, Bootstrap, Tailwind, premium templates and professional support. In addition, it integrates with Prime
2 lines (1 loc) • 3.14 kB
JavaScript
import*as e from"react";import{PrimeReactContext as r}from"primereact/api";import{ComponentBase as t,useHandleStyle as n}from"primereact/componentbase";import{useMergeProps as o}from"primereact/hooks";import{classNames as a,ObjectUtils as i}from"primereact/utils";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 p(e,r){if("object"!=l(e)||!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 s(e){var r=p(e,"string");return"symbol"==l(r)?r:r+""}function u(e,r,t){return(r=s(r))in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}var c=t.extend({defaultProps:{__TYPE:"Badge",__parentMetadata:null,value:null,severity:null,size:null,style:null,className:null,children:void 0},css:{classes:{root:function(e){var r=e.props;return a("p-badge p-component",u({"p-badge-no-gutter":i.isNotEmpty(r.value)&&1===String(r.value).length,"p-badge-dot":i.isEmpty(r.value),"p-badge-lg":"large"===r.size,"p-badge-xl":"xlarge"===r.size},"p-badge-".concat(r.severity),null!==r.severity))}},styles:"\n@layer primereact {\n .p-badge {\n display: inline-block;\n border-radius: 10px;\n text-align: center;\n padding: 0 .5rem;\n }\n \n .p-overlay-badge {\n position: relative;\n }\n \n .p-overlay-badge .p-badge {\n position: absolute;\n top: 0;\n right: 0;\n transform: translate(50%,-50%);\n transform-origin: 100% 0;\n margin: 0;\n }\n \n .p-badge-dot {\n width: .5rem;\n min-width: .5rem;\n height: .5rem;\n border-radius: 50%;\n padding: 0;\n }\n \n .p-badge-no-gutter {\n padding: 0;\n border-radius: 50%;\n }\n}\n"}});function m(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?m(Object(t),!0).forEach((function(r){u(e,r,t[r])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):m(Object(t)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))}))}return e}var d=e.memo(e.forwardRef((function(t,i){var l=o(),p=e.useContext(r),s=c.getProps(t,p),u=c.setMetaData(b({props:s},s.__parentMetadata)),m=u.ptm,d=u.cx;n(c.css.styles,u.isUnstyled,{name:"badge"});var f=e.useRef(null);e.useImperativeHandle(i,(function(){return{props:s,getElement:function(){return f.current}}}));var g=l({ref:f,style:s.style,className:a(s.className,d("root"))},c.getOtherProps(s),m("root"));return e.createElement("span",g,s.value)})));d.displayName="Badge";export{d as Badge};